Select menu
Generates a select menu.
-
Documentation
-
select_menu
Form: single select
Selected: -
Form: selecting items with phx-*
An example of selecting items using
phx-click
and phx-value-item
.
Selected: -
Menu title
Menu title
Footer
Footer
Footer
Filter
Tabs
Selected items
Labels and icons
Use modifier classes to add space between the icon or label and the text label, for example:
class="mr-2"
.
Message
Message
Blankslate
Menu
This is a blank slate
Use it to provide information when no dynamic content exists.
Loading
Loading...
Borderless
Aligned at end
Dropdown caret
Custom toggle
Backdrop
Transition duration
Open from outside
-
On this page
-
Top of page
-
Documentation
-
Stories
-
Form: single select
-
Form: selecting items with phx-*
-
Item types
-
Item types - disabled
-
Menu title
-
Footer
-
Filter
-
Tabs
-
Selected items
-
Labels and icons
-
Message
-
Blankslate
-
Loading
-
Borderless
-
Aligned at end
-
Dropdown caret
-
Custom toggle
-
Backdrop
-
Transition duration
-
Open from outside
-
Top of page
-
Introduction
-
Components
-
Action list
-
Action menu
-
Alert
-
Avatar
-
Blankslate
-
Box
-
Branch name
-
Breadcrumb
-
Button
-
Button group
-
Checkbox
-
Checkbox group
-
Circle badge
-
Counter
-
Dialog
-
Drawer
-
Dropdown
-
Ellipsis
-
Filter list
-
Form control
-
Header
-
Input validation message
-
Label
-
Layout
-
Link
-
Menu
-
Octicon
-
Pagination
-
Progress
-
Radio button
-
Radio group
-
Radio tabs
-
Select
-
Select menu
-
-
Side nav
-
Spinner
-
State label
-
Styled HTML
-
Subhead
-
Subnav
-
Tabnav
-
Text input
-
Textarea
-
Theme
-
Theme menu
-
Theme menu options
-
Timeline
-
Toggle switch
-
Truncate
-
Underline nav