Select input
Source page in Figma: Select input · 43 component sets · 0 standalone components
Index: ../component-registry.md · Workflows: ../workflows.md
Component Sets (43)
Section titled “Component Sets (43)”| Name | Key | Variants | Properties |
|---|---|---|---|
| .Select button/Size | 3964d6a1ec0a27aa7cb0f719092c61aa6e5e7c26 | 8 | ✏️ Content#19457:0=text ✏️ Desrc.#24049:0=text Description#32633:0=bool (default True)🔄 Icon#34241:0=instance-swap Icon#34241:9=bool (default True)Type= checkbox (default checkbox)Layout= Left check (default Left check)Size= md | lg | xl | 2xl (default md)Align= Left | Center (default Left) |
| Dropdown content/Empty state search dropdown | 891bcb409423fa665ba6cee3cfbd420c0d872ab2 | 3 | Type=Start search | No result | Loading (default Start search) |
| Dropdown item content/General | 9234d471cf53d213ece9e4428d5195c5dff3f633 | 6 | 🔄 L icon#7537:16=instance-swap ✏️ Item content#7565:0=text Show L icon#7565:24=bool (default False)🔄 R icon#7565:29=instance-swap Show R icon#7565:34=bool (default False)Show R subtext#7565:39=bool (default False)✏️ Sub content#7565:44=text 🔄 Swap content#19867:0=instance-swap Type= General | Checkbox | Letter | Radio | Checkbox swap | Class code (default General) |
| Dropdown item/Dropdown button | 23ab20b668473408398d3dfbe70f88d20bf575b4 | 64 | State=Default | Hover | Selected | Disable (default Default)👁️ Divider= False | True (default False)Type= Text | Select | Select - Legacy | w switch (default Text)Size= Medium | Large (default Medium) |
| Dropdown item/Dropdown button - style 2 | 9890e3418d542064a1db18aab754767cc3153d6b | 24 | State=Default | Hover | Selected | Disable (default Default)Type= Text | Select | w switch (default Text)Size= Medium | Large (default Medium) |
| Grabber | 6e8c7603cf02fb01200b0e67d3f0a038b33bec3a | 2 | Color=Dim | Deep (default Dim) |
| Group label | 244917d79e8cb9a65a119b76d073a7e57e5b5b0e | 2 | Number#28533:0=bool (default True)Expand= Yes | No (default No) |
| Grouped dropdown | 73dacede29d30ca7625e915994170aa3e8a833d1 | 2 | Expand=Yes | No (default Yes) |
| Input/Outline/Inline Dropdown, Select | b4043861d5fbbb78d72247c7fec13c9d8d981c45 | 10 | State=Default | Focus | Error | Disable | Hover (default Default)Label= Yes | No (default No) |
| Select button | 13792073fca4c15070bac652d1d4caaa3f15a8bd | 6 | Type=Checkbox (default Checkbox)State= Hover | Disable | Default (default Default)Selected= True | False (default False)Color= Brand (default Brand) |
| Select dropdown/Simple options dropdown - style 1 card | 5742e2d8eb61104dc4b55bde1a4494bec3a53508 | 2 | Layout=Auto | Overlfow (default Auto) |
| Select dropdown/Simple options dropdown - style 2 block | d0474d36a5579755e4848606630afe8cec4983e0 | 2 | Layout=Auto | Overlfow (default Auto) |
| Select/Dropdown/Grouped dropdown | 9a61b73fec6dd7cc890439c4c79137aae8ac1cb2 | 4 | Group=2 | 3 | 5 | Selected (default 2) |
| Select/Dropdown/List With Search | 5d8dc9a57fa2397185cecb9a55fae138f2c3add5 | 11 | Show Search input#9219:0=bool (default True)State= Start w hidden list | No result | Loading / Searching | Content dropdown | Legacy | Start w list (default Start w list)Style= 1 | 2 (default 1) |
| Select/Dropdown/Mobile dropdown action sheet | cf60078259b4412cd653d393357524616d5f2dae | 2 | Layout=4 | Overflow (default 4) |
| Select/Dropdown/Mobile dropdown bottom sheet - Style 1 card | 662b4ec88bec7c0cf0b262d26e16c427e0086d13 | 2 | Layout=Auto | Overflow (default Auto) |
| Select/Dropdown/Mobile dropdown bottom sheet - Style 2 block | 26da6880500b8e229932db3149e90bc8c63d9de8 | 2 | Layout=Auto | Overflow (default Auto) |
| Select/List item - Style 1 | 181224e6416feae90468ab11db1e9abfb2c82a83 | 10 | Overflow scroller#15775:0=bool (default True)Item number= 2 | 4 | 8 | 10 | 12 (default 4)Type= Select | Text (default Select) |
| Select/List item - style 2 | dc9bb3280c3dfe78daaadc1121fe13a6bfbfa8f7 | 10 | Item number=2 | 4 | 8 | 10 | 12 (default 4)Type= Checkbox | Text (default Checkbox) |
| Select/Option List (Old) | 47d48e79dc9cd11a9ef737cfeb4f0ffd9a66348e | 6 | Item number=1 | 2 | 4 | 8 | 10 | 12 (default 4) |
| Select/Option multi select, List, dropdown | 33c6cf46f6fcb809854da0aa4c67488b37b1173c | 6 | Footer buttons#17182:0=bool (default True)State= Empty | Select 1 | Select multi (default Empty)Layout= Real-time | Update (default Update) |
| Select/Outline/Select input | 3e1b9a7625a7e9bc70f8b74d1e55569f9051b2ec | 2 | Swap dropdown#7844:41=instance-swap Dropdown= False | True (default False) |
| Select/Outline/Select input, label | 5267ce13cc8e52a0aa68f6f548cbea80606cf6a8 | 2 | Swap dropdown#7844:41=instance-swap Dropdown= False | True (default False) |
| Select/Outline/Select with search | 5b13cc4ff6b341236914e7d1850970a65733af63 | 2 | Swap dropdown#9388:6=instance-swap Dropdown= True | False (default False) |
| Select/Outline/Select with search inline | 5cb1d99be5e770086f42ae0d79e20d07c53d48ca | 5 | State=Focus | Default | No result | Dropdown | Loading (default Default) |
| Select/Outline/Select with search inline, label | ae74f7062627b56f8b209ab66245b9e499f01d0e | 5 | State=Focus | Default | No result | Dropdown | Loading (default Default) |
| Select/Outline/Select with search, label | 9a6afe494d22ef78d727f3b0be5afc4eaa35af90 | 2 | Swap dropdown#9388:6=instance-swap Dropdown= True | False (default False) |
| Select/Solid, stroke/Inline Dropdown, Select | f8b694a6e6a4f3a60a0f03ac85cdc04003d05425 | 6 | State=Error | Default | Hover | Select | Disable | Filled (default Default) |
| Select/Solid, stroke/Inline select input, label, filter select | d885575cf78cd4fb27c15519e73705cd8b78492f | 2 | Dropdown=False | True (default False) |
| Select/Solid/Inline Dropdown, Select filter | c61d309b9e83233b91cd2ae9334b9c8981380cbe | 36 | 🔄 Dropdown#32291:5=instance-swap State= Error | Default | Select | Disable | Filled | Default filled (default Default filled)Wdith= Auto | Fixed (default Auto)Dropdown= False | True (default False)Size= Medium | Large | Small (default Medium) |
| Select/Solid/Inline Dropdown, Select filter (2023) | 70ed1d953c5dca4219b53c98f060f646e742f044 | 12 | State=Error | Default | Select | Disable | Filled | Default filled (default Default filled)Wdith= Auto | Fixed (default Auto) |
| Select/Solid/Layout/Inline select input, label, filter select | 384b0f84434871d2853c837cd0c0b722f8d24b74 | 2 | Dropdown=False | True (default False) |
| Select/Solid/Layout/Select input | dcc993ce2f1534f0b116242b17a4447e029d2b04 | 18 | 🔄 Dropdown#32291:18=instance-swap State= Default | Focus | Filled | Disable | Default filled | Error (default Default)Dropdown= False | True (default False)Size= Medium | Large | Small (default Medium) |
| Select/Solid/Layout/Select input (2023) | 5f47966510939f41fd557f5434a57c3967475d27 | 7 | State=Default | Focus | Filled | Disable | Default filled | Error (default Default filled)Dropdown= False | True (default False) |
| Select/Solid/Layout/Select with search | a1392d28a9b89e13d9bb1809feece13e151b8e50 | 2 | Dropdown=True | False (default False) |
| Select/Solid/Select filter | cc8719a13feb543e50ddcbc307b399401253c76c | 4 | Swap dropdown#7844:41=instance-swap Dropdown= False | True (default False)Selected= Yes | No (default No) |
| Select/Solid/Select user with tags | ddbda279c68ee362cf91e1dc235c0a8af22b81ed | 5 | State=Focus | Default | Selected | Typing new | Selecting (default Default) |
| Select/Solid/Select user with tags/Input | edb8f0744789af82602f33d8bc0907fb8b5786e7 | 5 | Text cursor#9837:0=bool (default True)State= Default | Focus | n tags | 1 tag | Filling (default Default) |
| Select/Solid/Select with search inline | a35d4e5c8c05b2ad93360670230f6b8253f02ec4 | 6 | State=Focus | Default | No result | Dropdown | Loading | Disable (default Default) |
| Select/Solid/Select with search inline, label | 59a72368637d56fbd808f57117315a334559389a | 5 | State=Focus | Default | No result | Dropdown | Loading (default Default) |
| Select/Solid/Select with search, label | f687f0b9993da461a314a2cd2249e0d978ab88cf | 2 | Dropdown=True | False (default False) |
| Select/Solid/Select with tags | acdc4d89a90b08f8d392f90423490f890ba90018 | 7 | State=Focus | Default (default Default)Typing state= No | Start typing | Typing new tag | Typing duplicate tag (default No)Items= n | 0 | 1 (default 0) |
| Select/Solid/Select with tags/Input | e7f71079686607f87ef32023787bb831c95de014 | 7 | Text cursor#9837:0=bool (default True)State=7 opts (default Default) |