-
What is Moon DS?
What is Moon DS?
-
Customization
Customization
-
Icons
Icons
-
Installation
Installation
-
Migration to V3
Migration to V3
-
Tokens
Tokens
-
Button
Actions Button
-
Icon Button
Actions Icon Button
-
Bottomsheet
Containers & layout Bottomsheet
-
Drawer
Containers & layout Drawer
-
Popover
Containers & layout Popover
-
Accordion
Content display Accordion
-
Avatar
Content display Avatar
-
Carousel
Content display Carousel
-
List
Content display List
-
Table
Content display Table
-
Authenticator
Forms & selection controls Authenticator
-
Checkbox
Forms & selection controls Checkbox
-
Chip
Forms & selection controls Chip
-
Dropdown
Forms & selection controls Dropdown
-
Input
Forms & selection controls Input
-
Inset Select
Forms & selection controls Inset Select
-
Radio
Forms & selection controls Radio
-
Radio Group
Forms & selection controls Radio Group
-
Segmented Control
Forms & selection controls Segmented Control
-
Select
Forms & selection controls Select
-
Switch
Forms & selection controls Switch
-
Textarea
Forms & selection controls Textarea
-
Badge
Indicators & status Badge
-
Circular Progress
Indicators & status Circular Progress
-
Linear Progress
Indicators & status Linear Progress
-
Loader
Indicators & status Loader
-
Placeholder
Indicators & status Placeholder
-
Tag
Indicators & status Tag
-
Alert
Messaging & feedback Alert
-
Modal
Messaging & feedback Modal
-
Snackbar
Messaging & feedback Snackbar
-
Tooltip
Messaging & feedback Tooltip
-
Breadcrumbs
Navigation Breadcrumbs
-
Menu Item
Navigation Menu Item
-
Pagination
Navigation Pagination
-
Tabs
Navigation Tabs
Snackbar message
<div> <.button phx-click={show_snackbar("#snackbar-single-default")} data-testid="snackbar-default-open-button"> Show Snackbar </.button> <.moon_snackbar id="snackbar-single-default"> Snackbar message </.moon_snackbar> </div>