@keenmate/web-multiselect 2.0.0 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +201 -208
- package/component-variables.manifest.json +4 -30
- package/custom-elements.json +0 -100
- package/dist/multiselect.js +10 -5
- package/dist/multiselect.umd.js +4 -4
- package/dist/style.css +1 -1
- package/docs/theming.md +7 -7
- package/package.json +5 -3
- package/src/css/options.css +8 -4
- package/src/css/variables.css +964 -964
- package/vscode.css-custom-data.json +0 -125
- package/vscode.html-custom-data.json +1 -1
- package/web-types.json +2 -84
|
@@ -122,16 +122,6 @@
|
|
|
122
122
|
"description": "Disabled input background",
|
|
123
123
|
"values": []
|
|
124
124
|
},
|
|
125
|
-
{
|
|
126
|
-
"name": "--ms-input-padding",
|
|
127
|
-
"description": "Input padding",
|
|
128
|
-
"values": []
|
|
129
|
-
},
|
|
130
|
-
{
|
|
131
|
-
"name": "--ms-input-padding-right",
|
|
132
|
-
"description": "Input right padding (for toggle)",
|
|
133
|
-
"values": []
|
|
134
|
-
},
|
|
135
125
|
{
|
|
136
126
|
"name": "--ms-input-height",
|
|
137
127
|
"description": "Input height",
|
|
@@ -157,111 +147,6 @@
|
|
|
157
147
|
"description": "Input text color",
|
|
158
148
|
"values": []
|
|
159
149
|
},
|
|
160
|
-
{
|
|
161
|
-
"name": "--ms-input-size-xs-font",
|
|
162
|
-
"description": "XS size font",
|
|
163
|
-
"values": []
|
|
164
|
-
},
|
|
165
|
-
{
|
|
166
|
-
"name": "--ms-input-size-xs-padding-v",
|
|
167
|
-
"description": "XS vertical padding",
|
|
168
|
-
"values": []
|
|
169
|
-
},
|
|
170
|
-
{
|
|
171
|
-
"name": "--ms-input-size-xs-padding-h",
|
|
172
|
-
"description": "XS horizontal padding",
|
|
173
|
-
"values": []
|
|
174
|
-
},
|
|
175
|
-
{
|
|
176
|
-
"name": "--ms-input-size-xs-height",
|
|
177
|
-
"description": "XS input height",
|
|
178
|
-
"values": []
|
|
179
|
-
},
|
|
180
|
-
{
|
|
181
|
-
"name": "--ms-input-size-sm-font",
|
|
182
|
-
"description": "SM size font",
|
|
183
|
-
"values": []
|
|
184
|
-
},
|
|
185
|
-
{
|
|
186
|
-
"name": "--ms-input-size-sm-padding-v",
|
|
187
|
-
"description": "SM vertical padding",
|
|
188
|
-
"values": []
|
|
189
|
-
},
|
|
190
|
-
{
|
|
191
|
-
"name": "--ms-input-size-sm-padding-h",
|
|
192
|
-
"description": "SM horizontal padding",
|
|
193
|
-
"values": []
|
|
194
|
-
},
|
|
195
|
-
{
|
|
196
|
-
"name": "--ms-input-size-sm-height",
|
|
197
|
-
"description": "SM input height",
|
|
198
|
-
"values": []
|
|
199
|
-
},
|
|
200
|
-
{
|
|
201
|
-
"name": "--ms-input-size-md-font",
|
|
202
|
-
"description": "MD size font",
|
|
203
|
-
"values": []
|
|
204
|
-
},
|
|
205
|
-
{
|
|
206
|
-
"name": "--ms-input-size-md-padding-v",
|
|
207
|
-
"description": "MD vertical padding",
|
|
208
|
-
"values": []
|
|
209
|
-
},
|
|
210
|
-
{
|
|
211
|
-
"name": "--ms-input-size-md-padding-h",
|
|
212
|
-
"description": "MD horizontal padding",
|
|
213
|
-
"values": []
|
|
214
|
-
},
|
|
215
|
-
{
|
|
216
|
-
"name": "--ms-input-size-md-height",
|
|
217
|
-
"description": "MD input height",
|
|
218
|
-
"values": []
|
|
219
|
-
},
|
|
220
|
-
{
|
|
221
|
-
"name": "--ms-input-size-lg-font",
|
|
222
|
-
"description": "LG size font",
|
|
223
|
-
"values": []
|
|
224
|
-
},
|
|
225
|
-
{
|
|
226
|
-
"name": "--ms-input-size-lg-padding-v",
|
|
227
|
-
"description": "LG vertical padding",
|
|
228
|
-
"values": []
|
|
229
|
-
},
|
|
230
|
-
{
|
|
231
|
-
"name": "--ms-input-size-lg-padding-h",
|
|
232
|
-
"description": "LG horizontal padding",
|
|
233
|
-
"values": []
|
|
234
|
-
},
|
|
235
|
-
{
|
|
236
|
-
"name": "--ms-input-size-lg-height",
|
|
237
|
-
"description": "LG input height",
|
|
238
|
-
"values": []
|
|
239
|
-
},
|
|
240
|
-
{
|
|
241
|
-
"name": "--ms-input-size-xl-font",
|
|
242
|
-
"description": "XL size font",
|
|
243
|
-
"values": []
|
|
244
|
-
},
|
|
245
|
-
{
|
|
246
|
-
"name": "--ms-input-size-xl-padding-v",
|
|
247
|
-
"description": "XL vertical padding",
|
|
248
|
-
"values": []
|
|
249
|
-
},
|
|
250
|
-
{
|
|
251
|
-
"name": "--ms-input-size-xl-padding-h",
|
|
252
|
-
"description": "XL horizontal padding",
|
|
253
|
-
"values": []
|
|
254
|
-
},
|
|
255
|
-
{
|
|
256
|
-
"name": "--ms-input-size-xl-height",
|
|
257
|
-
"description": "XL input height",
|
|
258
|
-
"values": []
|
|
259
|
-
},
|
|
260
|
-
{
|
|
261
|
-
"name": "--ms-toggle-right",
|
|
262
|
-
"description": "Toggle icon right position",
|
|
263
|
-
"values": []
|
|
264
|
-
},
|
|
265
150
|
{
|
|
266
151
|
"name": "--ms-toggle-color",
|
|
267
152
|
"description": "Toggle icon color",
|
|
@@ -277,11 +162,6 @@
|
|
|
277
162
|
"description": "Toggle icon color when open",
|
|
278
163
|
"values": []
|
|
279
164
|
},
|
|
280
|
-
{
|
|
281
|
-
"name": "--ms-counter-offset",
|
|
282
|
-
"description": "Counter badge offset",
|
|
283
|
-
"values": []
|
|
284
|
-
},
|
|
285
165
|
{
|
|
286
166
|
"name": "--ms-counter-padding",
|
|
287
167
|
"description": "Counter badge padding",
|
|
@@ -1600,11 +1480,6 @@
|
|
|
1600
1480
|
"description": "Debug stat bullet marker color",
|
|
1601
1481
|
"values": []
|
|
1602
1482
|
},
|
|
1603
|
-
{
|
|
1604
|
-
"name": "--ms-transform-center-y",
|
|
1605
|
-
"description": "Center Y transform",
|
|
1606
|
-
"values": []
|
|
1607
|
-
},
|
|
1608
1483
|
{
|
|
1609
1484
|
"name": "--ms-transform-rotate-180",
|
|
1610
1485
|
"description": "180 degree rotation",
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"tags": [
|
|
5
5
|
{
|
|
6
6
|
"name": "web-multiselect",
|
|
7
|
-
"description": "\n---\n\n\n### **Events:**\n - **select** - An option was selected. `detail.option` is the selected option; `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **deselect** - An option was removed from the selection. `detail.option` is that option.\n- **change** - The selection changed. `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **add** - The user chose to create a new option from the typed text (via the \"add new\" prompt or Enter) — requires `allow-add-new`. `detail.value` is the typed text; `detail.option` is the created item when `addNewCallback` produced one.\n\n### **Methods:**\n - **formResetCallback(): _void_** - Called by the browser when the surrounding <form> is reset. Clears the\r\npicker's selection so the control participates in the standard reset.\n\n\n\n\n\n\n\n- **showMessage(content: _string | HTMLElement_, opts: _MessageOptions_): _void_** - Surface a transient message (\"toast\") on top of the component — visible even in the\r\nfullscreen overlay, where page-level UI is hidden behind the sheet. Content is text or\r\nan element; `opts.variant` sets the tone and `opts.duration` the auto-dismiss (0 =\r\nsticky). Also reached automatically when a `beforeSelect`/`beforeDeselect` callback\r\nreturns a reason string.\n- **hideMessage(): _void_** - Dismiss the transient message shown by showMessage, if any.\n- **clearSearch(): _void_** - Clear the search box and restore the full option list (does not touch the selection — use\r\nclearAll for that). Pair with scrollToValue to reveal then scroll to an option\r\na search had filtered out: `el.clearSearch(); el.scrollToValue(v)`.\n- **search(term: _string_): _void_** - Programmatically set the search text and filter, as if the user typed it (runs\r\n`beforeSearchCallback` / `minSearchLength` / async `searchCallback`). Does not open the dropdown\r\n— call open if you want it visible. Pass `''` to clear (same as clearSearch).\n- **scrollToIndex(index: _number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option at `index` (into the current filtered list). Returns\r\nfalse if closed or out of range. Deferred internally so `el.open(); el.scrollToIndex(i)` works.\n- **scrollToValue(value: _string | number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option with this `value`. Returns false if it isn't in the\r\ncurrently visible list (filtered out by search, or under a collapsed tree branch) — call\r\nclearSearch / expand first.\n- **scrollToGroup(name: _string_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll to a group: its header in standard rendering, or the group's first option in\r\nvirtual-scroll mode (no headers there). Returns false in tree mode or if the group is empty\r\nin the current filtered list.\n- **open(): _void_** - Open the dropdown.\n- **close(): _void_** - Close the dropdown.\n- **toggle(): _void_** - Toggle the dropdown open/closed.\n\n### **CSS Properties:**\n - **--ms-rem** - Base sizing unit for proportional scaling (default: 10px) _(default: undefined)_\n- **--ms-accent-color** - Primary accent color _(default: undefined)_\n- **--ms-accent-color-hover** - Accent color on hover _(default: undefined)_\n- **--ms-accent-color-active** - Accent color when pressed _(default: undefined)_\n- **--ms-accent-color-light** - Light accent background _(default: undefined)_\n- **--ms-accent-color-light-hover** - Light accent hover _(default: undefined)_\n- **--ms-text-color-1** - Primary text color _(default: undefined)_\n- **--ms-text-color-2** - Secondary text color _(default: undefined)_\n- **--ms-text-color-3** - Tertiary text color _(default: undefined)_\n- **--ms-text-color-4** - Quaternary text color _(default: undefined)_\n- **--ms-text-color-on-accent** - Text on accent backgrounds _(default: undefined)_\n- **--ms-text-primary** - Legacy alias for text-color-1 _(default: undefined)_\n- **--ms-text-secondary** - Legacy alias for text-color-3 _(default: undefined)_\n- **--ms-primary-bg** - Hover/focus background (options, action buttons, counter); reads --base-hover-bg _(default: undefined)_\n- **--ms-primary-bg-hover** - Active/stronger background (counter badge text); reads --base-active-bg _(default: undefined)_\n- **--ms-border-color** - Default border color _(default: undefined)_\n- **--ms-border** - Full border shorthand _(default: undefined)_\n- **--ms-input-bg** - Input field background _(default: undefined)_\n- **--ms-input-color** - Input text color _(default: undefined)_\n- **--ms-input-border** - Input border _(default: undefined)_\n- **--ms-input-border-hover** - Input border on hover _(default: undefined)_\n- **--ms-input-border-focus** - Input border when focused _(default: undefined)_\n- **--ms-input-placeholder-color** - Placeholder text color _(default: undefined)_\n- **--ms-input-bg-disabled** - Disabled input background _(default: undefined)_\n- **--ms-input-padding** - Input padding _(default: undefined)_\n- **--ms-input-padding-right** - Input right padding (for toggle) _(default: undefined)_\n- **--ms-input-height** - Input height _(default: undefined)_\n- **--ms-input-font-size** - Input font size _(default: undefined)_\n- **--ms-input-border-width** - Input border width _(default: undefined)_\n- **--ms-input-border-radius** - Input border radius _(default: undefined)_\n- **--ms-input-text** - Input text color _(default: undefined)_\n- **--ms-input-size-xs-font** - XS size font _(default: undefined)_\n- **--ms-input-size-xs-padding-v** - XS vertical padding _(default: undefined)_\n- **--ms-input-size-xs-padding-h** - XS horizontal padding _(default: undefined)_\n- **--ms-input-size-xs-height** - XS input height _(default: undefined)_\n- **--ms-input-size-sm-font** - SM size font _(default: undefined)_\n- **--ms-input-size-sm-padding-v** - SM vertical padding _(default: undefined)_\n- **--ms-input-size-sm-padding-h** - SM horizontal padding _(default: undefined)_\n- **--ms-input-size-sm-height** - SM input height _(default: undefined)_\n- **--ms-input-size-md-font** - MD size font _(default: undefined)_\n- **--ms-input-size-md-padding-v** - MD vertical padding _(default: undefined)_\n- **--ms-input-size-md-padding-h** - MD horizontal padding _(default: undefined)_\n- **--ms-input-size-md-height** - MD input height _(default: undefined)_\n- **--ms-input-size-lg-font** - LG size font _(default: undefined)_\n- **--ms-input-size-lg-padding-v** - LG vertical padding _(default: undefined)_\n- **--ms-input-size-lg-padding-h** - LG horizontal padding _(default: undefined)_\n- **--ms-input-size-lg-height** - LG input height _(default: undefined)_\n- **--ms-input-size-xl-font** - XL size font _(default: undefined)_\n- **--ms-input-size-xl-padding-v** - XL vertical padding _(default: undefined)_\n- **--ms-input-size-xl-padding-h** - XL horizontal padding _(default: undefined)_\n- **--ms-input-size-xl-height** - XL input height _(default: undefined)_\n- **--ms-toggle-right** - Toggle icon right position _(default: undefined)_\n- **--ms-toggle-color** - Toggle icon color _(default: undefined)_\n- **--ms-toggle-icon-color** - Toggle icon color (semantic) _(default: undefined)_\n- **--ms-toggle-icon-color-open** - Toggle icon color when open _(default: undefined)_\n- **--ms-counter-offset** - Counter badge offset _(default: undefined)_\n- **--ms-counter-padding** - Counter badge padding _(default: undefined)_\n- **--ms-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-counter-color** - Counter badge text color _(default: undefined)_\n- **--ms-counter-font-size** - Counter badge font size _(default: undefined)_\n- **--ms-counter-font-weight** - Counter badge font weight _(default: undefined)_\n- **--ms-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-counter-bg-hover** - Counter badge hover background _(default: undefined)_\n- **--ms-counter-badge-bg** - Counter badge semantic background _(default: undefined)_\n- **--ms-counter-badge-bg-hover** - Counter badge semantic hover _(default: undefined)_\n- **--ms-counter-badge-color** - Counter badge semantic color _(default: undefined)_\n- **--ms-hint-padding** - Floating hint padding _(default: undefined)_\n- **--ms-hint-border** - Floating hint border _(default: undefined)_\n- **--ms-hint-border-radius** - Floating hint border radius _(default: undefined)_\n- **--ms-hint-box-shadow** - Floating hint shadow _(default: undefined)_\n- **--ms-hint-font-size** - Floating hint font size _(default: undefined)_\n- **--ms-hint-bg** - Floating hint background _(default: undefined)_\n- **--ms-hint-color** - Floating hint text color _(default: undefined)_\n- **--ms-hint-border-color** - Floating hint border color _(default: undefined)_\n- **--ms-dropdown-bg** - Dropdown background _(default: undefined)_\n- **--ms-dropdown-text-color** - Dropdown text color _(default: undefined)_\n- **--ms-dropdown-border** - Dropdown border _(default: undefined)_\n- **--ms-dropdown-border-color** - Dropdown border color _(default: undefined)_\n- **--ms-dropdown-border-radius** - Dropdown border radius _(default: undefined)_\n- **--ms-dropdown-box-shadow** - Dropdown shadow _(default: undefined)_\n- **--ms-dropdown-box-shadow-semantic** - Dropdown semantic shadow _(default: undefined)_\n- **--ms-dropdown-width** - Options dropdown width (defaults to the input width; also set via the dropdown-width attribute) _(default: undefined)_\n- **--ms-options-max-height** - Options list max height _(default: undefined)_\n- **--ms-z-index-dropdown** - Dropdown z-index _(default: undefined)_\n- **--ms-z-index-sticky** - Sticky elements z-index _(default: undefined)_\n- **--ms-actions-gap** - Actions row gap _(default: undefined)_\n- **--ms-actions-padding** - Actions row padding _(default: undefined)_\n- **--ms-actions-border-bottom** - Actions row border _(default: undefined)_\n- **--ms-actions-bg** - Actions row background _(default: undefined)_\n- **--ms-actions-border-color** - Actions row border color _(default: undefined)_\n- **--ms-action-btn-padding** - Action button padding _(default: undefined)_\n- **--ms-action-btn-font-size** - Action button font size _(default: undefined)_\n- **--ms-action-btn-border** - Action button border _(default: undefined)_\n- **--ms-action-btn-border-radius** - Action button border radius _(default: undefined)_\n- **--ms-action-btn-bg** - Action button background _(default: undefined)_\n- **--ms-action-btn-color** - Action button color _(default: undefined)_\n- **--ms-action-btn-bg-hover** - Action button hover background _(default: undefined)_\n- **--ms-action-btn-border-color-hover** - Action button hover border _(default: undefined)_\n- **--ms-action-button-bg** - Semantic action button background _(default: undefined)_\n- **--ms-action-button-bg-hover** - Semantic action button hover _(default: undefined)_\n- **--ms-action-button-border-color** - Semantic action button border _(default: undefined)_\n- **--ms-action-button-border-color-hover** - Semantic action button hover border _(default: undefined)_\n- **--ms-action-button-color** - Semantic action button color _(default: undefined)_\n- **--ms-options-padding** - Options container padding _(default: undefined)_\n- **--ms-group-border-top** - Group border top _(default: undefined)_\n- **--ms-group-margin-top** - Group margin top _(default: undefined)_\n- **--ms-group-padding-top** - Group padding top _(default: undefined)_\n- **--ms-group-border-color** - Group border color _(default: undefined)_\n- **--ms-group-label-padding** - Group label padding _(default: undefined)_\n- **--ms-group-label-font-size** - Group label font size _(default: undefined)_\n- **--ms-group-label-font-weight** - Group label font weight _(default: undefined)_\n- **--ms-group-label-color** - Group label color _(default: undefined)_\n- **--ms-group-label-transform** - Group label text transform _(default: undefined)_\n- **--ms-group-label-letter-spacing** - Group label letter spacing _(default: undefined)_\n- **--ms-option-gap** - Option content gap _(default: undefined)_\n- **--ms-option-padding** - Option padding _(default: undefined)_\n- **--ms-option-padding-h** - Option horizontal padding _(default: undefined)_\n- **--ms-option-color** - Option text color _(default: undefined)_\n- **--ms-option-bg** - Option background _(default: undefined)_\n- **--ms-option-bg-hover** - Option hover background _(default: undefined)_\n- **--ms-option-bg-focused** - Option focused background _(default: undefined)_\n- **--ms-option-outline-focused** - Option focus outline _(default: undefined)_\n- **--ms-option-focus-outline-offset** - Option focus outline offset _(default: undefined)_\n- **--ms-option-bg-matched** - Matched option background _(default: undefined)_\n- **--ms-option-border-matched** - Matched option border _(default: undefined)_\n- **--ms-option-bg-selected** - Selected option background _(default: undefined)_\n- **--ms-option-text-color** - Option text color (semantic) _(default: undefined)_\n- **--ms-option-color-hover** - Option hover color _(default: undefined)_\n- **--ms-option-color-focused** - Option focused color _(default: undefined)_\n- **--ms-option-outline-color-focused** - Option focus outline color _(default: undefined)_\n- **--ms-option-color-matched** - Matched option color _(default: undefined)_\n- **--ms-option-border-matched-color** - Matched option border color _(default: undefined)_\n- **--ms-option-bg-focused-hover** - Focused option hover background _(default: undefined)_\n- **--ms-option-bg-matched-hover** - Matched option hover background _(default: undefined)_\n- **--ms-option-bg-selected-focused** - Selected focused background _(default: undefined)_\n- **--ms-option-bg-selected-matched** - Selected matched background _(default: undefined)_\n- **--ms-option-disabled-bg** - Disabled option background _(default: undefined)_\n- **--ms-option-bg-disabled-selected** - Disabled selected background _(default: undefined)_\n- **--ms-disabled-opacity** - Disabled option opacity _(default: undefined)_\n- **--ms-option-content-gap** - Option content gap _(default: undefined)_\n- **--ms-option-icon-size** - Option icon size _(default: undefined)_\n- **--ms-option-icon-font-size** - Option icon font size _(default: undefined)_\n- **--ms-option-title-font-size** - Option title font size _(default: undefined)_\n- **--ms-option-title-color** - Option title color _(default: undefined)_\n- **--ms-option-subtitle-margin-top** - Option subtitle margin _(default: undefined)_\n- **--ms-option-subtitle-font-size** - Option subtitle font size _(default: undefined)_\n- **--ms-option-subtitle-line-height** - Option subtitle line height _(default: undefined)_\n- **--ms-option-subtitle-color** - Option subtitle color _(default: undefined)_\n- **--ms-option-mark-bg** - Search match highlight background _(default: undefined)_\n- **--ms-option-mark-color** - Search match highlight color _(default: undefined)_\n- **--ms-option-mark-font-weight** - Search match highlight weight _(default: undefined)_\n- **--ms-checkbox-margin-top** - Checkbox margin top _(default: undefined)_\n- **--ms-checkbox-margin-right** - Checkbox margin right _(default: undefined)_\n- **--ms-checkbox-margin-bottom** - Checkbox margin bottom _(default: undefined)_\n- **--ms-checkbox-margin-left** - Checkbox margin left _(default: undefined)_\n- **--ms-checkbox-size** - Checkbox size _(default: undefined)_\n- **--ms-checkbox-scale** - Checkbox scale _(default: undefined)_\n- **--ms-checkbox-align** - Checkbox alignment _(default: undefined)_\n- **--ms-checkbox-bg** - Checkbox background _(default: undefined)_\n- **--ms-checkbox-border** - Checkbox border _(default: undefined)_\n- **--ms-checkbox-border-radius** - Checkbox border radius _(default: undefined)_\n- **--ms-checkbox-checked-bg** - Checked checkbox background _(default: undefined)_\n- **--ms-checkbox-checked-border** - Checked checkbox border _(default: undefined)_\n- **--ms-checkbox-checkmark-color** - Checkmark color _(default: undefined)_\n- **--ms-checkbox-hover-border-color** - Checkbox hover border _(default: undefined)_\n- **--ms-checkbox-disabled-bg** - Disabled checkbox background _(default: undefined)_\n- **--ms-checkbox-disabled-border** - Disabled checkbox border _(default: undefined)_\n- **--ms-checkbox-checked-bg-hover** - Checked checkbox hover background _(default: undefined)_\n- **--ms-checkbox-checked-border-color-hover** - Checked checkbox hover border _(default: undefined)_\n- **--ms-state-min-height** - Shared min-height for the empty and loading states so the dropdown doesn't resize when swapping between them _(default: undefined)_\n- **--ms-empty-padding** - Empty state padding _(default: undefined)_\n- **--ms-empty-font-size** - Empty state font size _(default: undefined)_\n- **--ms-empty-color** - Empty state text color _(default: undefined)_\n- **--ms-loader-padding** - Loader padding _(default: undefined)_\n- **--ms-loader-gap** - Loader gap _(default: undefined)_\n- **--ms-loading-text-font-size** - Loading text font size _(default: undefined)_\n- **--ms-loading-text-color** - Loading text color _(default: undefined)_\n- **--ms-loading-color** - Loading color (semantic) _(default: undefined)_\n- **--ms-badges-gap** - Badges container gap _(default: undefined)_\n- **--ms-badges-margin-bottom** - Badges margin bottom _(default: undefined)_\n- **--ms-badges-margin-top** - Badges margin top _(default: undefined)_\n- **--ms-badges-margin-left** - Badges margin left _(default: undefined)_\n- **--ms-badges-margin-right** - Badges margin right _(default: undefined)_\n- **--ms-badge-gap** - Badge internal gap _(default: undefined)_\n- **--ms-badge-height** - Badge height _(default: undefined)_\n- **--ms-badge-font-size** - Badge font size _(default: undefined)_\n- **--ms-badge-font-weight** - Badge font weight _(default: undefined)_\n- **--ms-badge-border-radius** - Badge border radius _(default: undefined)_\n- **--ms-badge-bg** - Badge background _(default: undefined)_\n- **--ms-badge-bg-hover** - Badge hover background _(default: undefined)_\n- **--ms-badge-bg-active** - Badge active background _(default: undefined)_\n- **--ms-badge-text-padding** - Badge text padding _(default: undefined)_\n- **--ms-badge-text-bg** - Badge text background _(default: undefined)_\n- **--ms-badge-text-color** - Badge text color _(default: undefined)_\n- **--ms-badge-text-border** - Badge text border _(default: undefined)_\n- **--ms-badge-text-bg-hover** - Badge text hover background _(default: undefined)_\n- **--ms-badge-text-color-hover** - Badge text hover color _(default: undefined)_\n- **--ms-badge-remove-width** - Badge remove button width _(default: undefined)_\n- **--ms-badge-remove-bg** - Badge remove button background _(default: undefined)_\n- **--ms-badge-remove-color** - Badge remove button color _(default: undefined)_\n- **--ms-badge-remove-border** - Badge remove button border _(default: undefined)_\n- **--ms-badge-remove-font-size** - Badge remove button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-badge-remove-icon-size** - Badge remove X icon size (mask SVG) _(default: undefined)_\n- **--ms-badge-remove-bg-hover** - Badge remove button hover background _(default: undefined)_\n- **--ms-badge-remove-box-shadow-focus** - Badge remove button focus shadow _(default: undefined)_\n- **--ms-icon-remove** - Remove icon as CSS url() to a mask-friendly SVG; color comes from currentColor _(default: undefined)_\n- **--ms-icon-filter** - Funnel glyph (fullscreen search-mode toggle); chains to --base-icon-filter _(default: undefined)_\n- **--ms-icon-check** - Checkmark glyph (mask) for a checked checkbox/option; chains to --base-icon-check _(default: undefined)_\n- **--ms-icon-indeterminate** - Dash glyph (mask) for a tri-state/partial checkbox; chains to --base-icon-indeterminate _(default: undefined)_\n- **--ms-badge-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-badge-counter-border** - Counter badge border _(default: undefined)_\n- **--ms-badge-counter-border-color** - Counter badge border color _(default: undefined)_\n- **--ms-badge-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-badge-counter-text-color** - Counter badge text color _(default: undefined)_\n- **--ms-badge-counter-text-bg** - Counter badge text background _(default: undefined)_\n- **--ms-badge-counter-remove-bg** - Counter badge remove background _(default: undefined)_\n- **--ms-badge-counter-remove-color** - Counter badge remove color _(default: undefined)_\n- **--ms-badge-counter-remove-bg-hover** - Counter badge remove hover background _(default: undefined)_\n- **--ms-more-badge-bg** - More badge background _(default: undefined)_\n- **--ms-more-badge-hover-bg** - More badge hover background _(default: undefined)_\n- **--ms-more-badge-active-bg** - More badge active background _(default: undefined)_\n- **--ms-count-display-margin-bottom** - Count display margin bottom _(default: undefined)_\n- **--ms-count-display-margin-top** - Count display margin top _(default: undefined)_\n- **--ms-count-display-margin-left** - Count display margin left _(default: undefined)_\n- **--ms-count-display-margin-right** - Count display margin right _(default: undefined)_\n- **--ms-counter-wrapper-bg** - Counter wrapper background _(default: undefined)_\n- **--ms-counter-wrapper-border** - Counter wrapper border _(default: undefined)_\n- **--ms-counter-wrapper-border-radius** - Counter wrapper border radius _(default: undefined)_\n- **--ms-counter-wrapper-padding** - Counter wrapper padding _(default: undefined)_\n- **--ms-counter-wrapper-gap** - Counter wrapper gap _(default: undefined)_\n- **--ms-counter-wrapper-bg-hover** - Counter wrapper hover background _(default: undefined)_\n- **--ms-counter-wrapper-border-color** - Counter wrapper border color _(default: undefined)_\n- **--ms-counter-wrapper-border-color-hover** - Counter wrapper hover border _(default: undefined)_\n- **--ms-count-text-bg** - Count text background _(default: undefined)_\n- **--ms-count-text-border** - Count text border _(default: undefined)_\n- **--ms-count-text-font-size** - Count text font size _(default: undefined)_\n- **--ms-count-text-color** - Count text color _(default: undefined)_\n- **--ms-count-clear-size** - Count clear button size _(default: undefined)_\n- **--ms-count-clear-bg** - Count clear button background _(default: undefined)_\n- **--ms-count-clear-color** - Count clear button color _(default: undefined)_\n- **--ms-count-clear-font-size** - Count clear button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-count-clear-icon-size** - Count clear X icon size (mask SVG) _(default: undefined)_\n- **--ms-count-clear-border-radius** - Count clear button border radius _(default: undefined)_\n- **--ms-count-clear-bg-hover** - Count clear button hover background _(default: undefined)_\n- **--ms-count-clear-color-hover** - Count clear button hover color _(default: undefined)_\n- **--ms-icon-clear** - Clear icon as CSS url() to a mask-friendly SVG; defaults to var(--ms-icon-remove) _(default: undefined)_\n- **--ms-tooltip-bg** - Tooltip background _(default: undefined)_\n- **--ms-tooltip-text-color** - Tooltip text color _(default: undefined)_\n- **--ms-tooltip-color** - Tooltip color _(default: undefined)_\n- **--ms-tooltip-padding** - Tooltip padding _(default: undefined)_\n- **--ms-tooltip-border-radius** - Tooltip border radius _(default: undefined)_\n- **--ms-tooltip-font-size** - Tooltip font size _(default: undefined)_\n- **--ms-tooltip-max-width** - Tooltip max width _(default: undefined)_\n- **--ms-tooltip-shadow** - Tooltip shadow _(default: undefined)_\n- **--ms-tooltip-z-index** - Tooltip z-index _(default: undefined)_\n- **--ms-z-index-popover** - Popover z-index _(default: undefined)_\n- **--ms-selected-popover-width** - Selected popover width _(default: undefined)_\n- **--ms-selected-popover-max-height** - Selected popover max height _(default: undefined)_\n- **--ms-selected-popover-border** - Selected popover border _(default: undefined)_\n- **--ms-selected-popover-border-radius** - Selected popover border radius _(default: undefined)_\n- **--ms-selected-popover-box-shadow** - Selected popover shadow _(default: undefined)_\n- **--ms-selected-popover-bg** - Selected popover background _(default: undefined)_\n- **--ms-selected-popover-border-color** - Selected popover border color _(default: undefined)_\n- **--ms-selected-popover-header-padding** - Popover header padding _(default: undefined)_\n- **--ms-selected-popover-header-bg** - Popover header background _(default: undefined)_\n- **--ms-selected-popover-header-border-bottom** - Popover header border _(default: undefined)_\n- **--ms-selected-popover-header-font-size** - Popover header font size _(default: undefined)_\n- **--ms-selected-popover-header-font-weight** - Popover header font weight _(default: undefined)_\n- **--ms-selected-popover-header-color** - Popover header color _(default: undefined)_\n- **--ms-selected-popover-header-border-color** - Popover header border color _(default: undefined)_\n- **--ms-popover-close-size** - Popover close button size _(default: undefined)_\n- **--ms-selected-popover-close-bg** - Popover close button background _(default: undefined)_\n- **--ms-selected-popover-close-color** - Popover close button color _(default: undefined)_\n- **--ms-selected-popover-close-font-size** - Popover close button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-selected-popover-close-icon-size** - Popover close X icon size (mask SVG) _(default: undefined)_\n- **--ms-selected-popover-close-border-radius** - Popover close button border radius _(default: undefined)_\n- **--ms-selected-popover-close-bg-hover** - Popover close button hover background _(default: undefined)_\n- **--ms-selected-popover-close-color-hover** - Popover close button hover color _(default: undefined)_\n- **--ms-selected-popover-body-gap** - Popover body gap _(default: undefined)_\n- **--ms-selected-popover-body-padding** - Popover body padding _(default: undefined)_\n- **--ms-selected-popover-body-max-height** - Popover body max height _(default: undefined)_\n- **--ms-font-size-2xs** - Extra extra small font size _(default: undefined)_\n- **--ms-font-size-xs** - Extra small font size _(default: undefined)_\n- **--ms-font-size-sm** - Small font size _(default: undefined)_\n- **--ms-font-size-base** - Base font size _(default: undefined)_\n- **--ms-font-size-lg** - Large font size _(default: undefined)_\n- **--ms-font-weight-normal** - Normal font weight _(default: undefined)_\n- **--ms-font-weight-medium** - Medium font weight _(default: undefined)_\n- **--ms-font-weight-semibold** - Semibold font weight _(default: undefined)_\n- **--ms-line-height-none** - No line height (1) _(default: undefined)_\n- **--ms-line-height-tight** - Tight line height _(default: undefined)_\n- **--ms-line-height-normal** - Normal line height _(default: undefined)_\n- **--ms-line-height-relaxed** - Relaxed line height _(default: undefined)_\n- **--ms-border-radius-sm** - Small border radius _(default: undefined)_\n- **--ms-border-radius-md** - Medium border radius _(default: undefined)_\n- **--ms-border-radius-lg** - Large border radius _(default: undefined)_\n- **--ms-border-radius** - Default border radius _(default: undefined)_\n- **--ms-spacing-xs** - Extra small spacing _(default: undefined)_\n- **--ms-spacing-sm** - Small spacing _(default: undefined)_\n- **--ms-spacing-md** - Medium spacing _(default: undefined)_\n- **--ms-spacing-lg** - Large spacing _(default: undefined)_\n- **--ms-transition-fast** - Fast transition duration _(default: undefined)_\n- **--ms-transition-normal** - Normal transition duration _(default: undefined)_\n- **--ms-easing-snappy** - Snappy easing function _(default: undefined)_\n- **--ms-placeholder-opacity** - Placeholder opacity _(default: undefined)_\n- **--ms-disabled-input-opacity** - Disabled input opacity _(default: undefined)_\n- **--ms-scrollbar-width** - Scrollbar width _(default: undefined)_\n- **--ms-scrollbar-track-bg** - Scrollbar track background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg** - Scrollbar thumb background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg-hover** - Scrollbar thumb hover background _(default: undefined)_\n- **--ms-scrollbar-thumb-border-radius** - Scrollbar thumb border radius _(default: undefined)_\n- **--ms-debug-bg** - Debug panel background _(default: undefined)_\n- **--ms-debug-border-color** - Debug panel border _(default: undefined)_\n- **--ms-debug-text-color** - Debug panel text _(default: undefined)_\n- **--ms-debug-border-radius** - Debug panel corner radius _(default: undefined)_\n- **--ms-debug-summary-color** - Debug section heading color _(default: undefined)_\n- **--ms-debug-summary-bg-hover** - Debug section heading hover background _(default: undefined)_\n- **--ms-debug-summary-outline-color** - Debug section heading focus outline _(default: undefined)_\n- **--ms-debug-summary-border-radius** - Debug section heading corner radius _(default: undefined)_\n- **--ms-debug-stats-bg** - Debug stats nested panel background _(default: undefined)_\n- **--ms-debug-stats-border-radius** - Debug stats nested panel corner radius _(default: undefined)_\n- **--ms-debug-bullet-color** - Debug stat bullet marker color _(default: undefined)_\n- **--ms-transform-center-y** - Center Y transform _(default: undefined)_\n- **--ms-transform-rotate-180** - 180 degree rotation _(default: undefined)_\n- **--ms-transform-scale-hover** - Hover scale transform _(default: undefined)_\n- **--ms-transform-scale-active** - Active scale transform _(default: undefined)_\n- **--ms-order-first** - Order first (-1) _(default: undefined)_",
|
|
7
|
+
"description": "\n---\n\n\n### **Events:**\n - **select** - An option was selected. `detail.option` is the selected option; `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **deselect** - An option was removed from the selection. `detail.option` is that option.\n- **change** - The selection changed. `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **add** - The user chose to create a new option from the typed text (via the \"add new\" prompt or Enter) — requires `allow-add-new`. `detail.value` is the typed text; `detail.option` is the created item when `addNewCallback` produced one.\n\n### **Methods:**\n - **formResetCallback(): _void_** - Called by the browser when the surrounding <form> is reset. Clears the\r\npicker's selection so the control participates in the standard reset.\n\n\n\n\n\n\n\n- **showMessage(content: _string | HTMLElement_, opts: _MessageOptions_): _void_** - Surface a transient message (\"toast\") on top of the component — visible even in the\r\nfullscreen overlay, where page-level UI is hidden behind the sheet. Content is text or\r\nan element; `opts.variant` sets the tone and `opts.duration` the auto-dismiss (0 =\r\nsticky). Also reached automatically when a `beforeSelect`/`beforeDeselect` callback\r\nreturns a reason string.\n- **hideMessage(): _void_** - Dismiss the transient message shown by showMessage, if any.\n- **clearSearch(): _void_** - Clear the search box and restore the full option list (does not touch the selection — use\r\nclearAll for that). Pair with scrollToValue to reveal then scroll to an option\r\na search had filtered out: `el.clearSearch(); el.scrollToValue(v)`.\n- **search(term: _string_): _void_** - Programmatically set the search text and filter, as if the user typed it (runs\r\n`beforeSearchCallback` / `minSearchLength` / async `searchCallback`). Does not open the dropdown\r\n— call open if you want it visible. Pass `''` to clear (same as clearSearch).\n- **scrollToIndex(index: _number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option at `index` (into the current filtered list). Returns\r\nfalse if closed or out of range. Deferred internally so `el.open(); el.scrollToIndex(i)` works.\n- **scrollToValue(value: _string | number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option with this `value`. Returns false if it isn't in the\r\ncurrently visible list (filtered out by search, or under a collapsed tree branch) — call\r\nclearSearch / expand first.\n- **scrollToGroup(name: _string_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll to a group: its header in standard rendering, or the group's first option in\r\nvirtual-scroll mode (no headers there). Returns false in tree mode or if the group is empty\r\nin the current filtered list.\n- **open(): _void_** - Open the dropdown.\n- **close(): _void_** - Close the dropdown.\n- **toggle(): _void_** - Toggle the dropdown open/closed.\n\n### **CSS Properties:**\n - **--ms-rem** - Base sizing unit for proportional scaling (default: 10px) _(default: undefined)_\n- **--ms-accent-color** - Primary accent color _(default: undefined)_\n- **--ms-accent-color-hover** - Accent color on hover _(default: undefined)_\n- **--ms-accent-color-active** - Accent color when pressed _(default: undefined)_\n- **--ms-accent-color-light** - Light accent background _(default: undefined)_\n- **--ms-accent-color-light-hover** - Light accent hover _(default: undefined)_\n- **--ms-text-color-1** - Primary text color _(default: undefined)_\n- **--ms-text-color-2** - Secondary text color _(default: undefined)_\n- **--ms-text-color-3** - Tertiary text color _(default: undefined)_\n- **--ms-text-color-4** - Quaternary text color _(default: undefined)_\n- **--ms-text-color-on-accent** - Text on accent backgrounds _(default: undefined)_\n- **--ms-text-primary** - Legacy alias for text-color-1 _(default: undefined)_\n- **--ms-text-secondary** - Legacy alias for text-color-3 _(default: undefined)_\n- **--ms-primary-bg** - Hover/focus background (options, action buttons, counter); reads --base-hover-bg _(default: undefined)_\n- **--ms-primary-bg-hover** - Active/stronger background (counter badge text); reads --base-active-bg _(default: undefined)_\n- **--ms-border-color** - Default border color _(default: undefined)_\n- **--ms-border** - Full border shorthand _(default: undefined)_\n- **--ms-input-bg** - Input field background _(default: undefined)_\n- **--ms-input-color** - Input text color _(default: undefined)_\n- **--ms-input-border** - Input border _(default: undefined)_\n- **--ms-input-border-hover** - Input border on hover _(default: undefined)_\n- **--ms-input-border-focus** - Input border when focused _(default: undefined)_\n- **--ms-input-placeholder-color** - Placeholder text color _(default: undefined)_\n- **--ms-input-bg-disabled** - Disabled input background _(default: undefined)_\n- **--ms-input-height** - Input height _(default: undefined)_\n- **--ms-input-font-size** - Input font size _(default: undefined)_\n- **--ms-input-border-width** - Input border width _(default: undefined)_\n- **--ms-input-border-radius** - Input border radius _(default: undefined)_\n- **--ms-input-text** - Input text color _(default: undefined)_\n- **--ms-toggle-color** - Toggle icon color _(default: undefined)_\n- **--ms-toggle-icon-color** - Toggle icon color (semantic) _(default: undefined)_\n- **--ms-toggle-icon-color-open** - Toggle icon color when open _(default: undefined)_\n- **--ms-counter-padding** - Counter badge padding _(default: undefined)_\n- **--ms-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-counter-color** - Counter badge text color _(default: undefined)_\n- **--ms-counter-font-size** - Counter badge font size _(default: undefined)_\n- **--ms-counter-font-weight** - Counter badge font weight _(default: undefined)_\n- **--ms-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-counter-bg-hover** - Counter badge hover background _(default: undefined)_\n- **--ms-counter-badge-bg** - Counter badge semantic background _(default: undefined)_\n- **--ms-counter-badge-bg-hover** - Counter badge semantic hover _(default: undefined)_\n- **--ms-counter-badge-color** - Counter badge semantic color _(default: undefined)_\n- **--ms-hint-padding** - Floating hint padding _(default: undefined)_\n- **--ms-hint-border** - Floating hint border _(default: undefined)_\n- **--ms-hint-border-radius** - Floating hint border radius _(default: undefined)_\n- **--ms-hint-box-shadow** - Floating hint shadow _(default: undefined)_\n- **--ms-hint-font-size** - Floating hint font size _(default: undefined)_\n- **--ms-hint-bg** - Floating hint background _(default: undefined)_\n- **--ms-hint-color** - Floating hint text color _(default: undefined)_\n- **--ms-hint-border-color** - Floating hint border color _(default: undefined)_\n- **--ms-dropdown-bg** - Dropdown background _(default: undefined)_\n- **--ms-dropdown-text-color** - Dropdown text color _(default: undefined)_\n- **--ms-dropdown-border** - Dropdown border _(default: undefined)_\n- **--ms-dropdown-border-color** - Dropdown border color _(default: undefined)_\n- **--ms-dropdown-border-radius** - Dropdown border radius _(default: undefined)_\n- **--ms-dropdown-box-shadow** - Dropdown shadow _(default: undefined)_\n- **--ms-dropdown-box-shadow-semantic** - Dropdown semantic shadow _(default: undefined)_\n- **--ms-dropdown-width** - Options dropdown width (defaults to the input width; also set via the dropdown-width attribute) _(default: undefined)_\n- **--ms-options-max-height** - Options list max height _(default: undefined)_\n- **--ms-z-index-dropdown** - Dropdown z-index _(default: undefined)_\n- **--ms-z-index-sticky** - Sticky elements z-index _(default: undefined)_\n- **--ms-actions-gap** - Actions row gap _(default: undefined)_\n- **--ms-actions-padding** - Actions row padding _(default: undefined)_\n- **--ms-actions-border-bottom** - Actions row border _(default: undefined)_\n- **--ms-actions-bg** - Actions row background _(default: undefined)_\n- **--ms-actions-border-color** - Actions row border color _(default: undefined)_\n- **--ms-action-btn-padding** - Action button padding _(default: undefined)_\n- **--ms-action-btn-font-size** - Action button font size _(default: undefined)_\n- **--ms-action-btn-border** - Action button border _(default: undefined)_\n- **--ms-action-btn-border-radius** - Action button border radius _(default: undefined)_\n- **--ms-action-btn-bg** - Action button background _(default: undefined)_\n- **--ms-action-btn-color** - Action button color _(default: undefined)_\n- **--ms-action-btn-bg-hover** - Action button hover background _(default: undefined)_\n- **--ms-action-btn-border-color-hover** - Action button hover border _(default: undefined)_\n- **--ms-action-button-bg** - Semantic action button background _(default: undefined)_\n- **--ms-action-button-bg-hover** - Semantic action button hover _(default: undefined)_\n- **--ms-action-button-border-color** - Semantic action button border _(default: undefined)_\n- **--ms-action-button-border-color-hover** - Semantic action button hover border _(default: undefined)_\n- **--ms-action-button-color** - Semantic action button color _(default: undefined)_\n- **--ms-options-padding** - Options container padding _(default: undefined)_\n- **--ms-group-border-top** - Group border top _(default: undefined)_\n- **--ms-group-margin-top** - Group margin top _(default: undefined)_\n- **--ms-group-padding-top** - Group padding top _(default: undefined)_\n- **--ms-group-border-color** - Group border color _(default: undefined)_\n- **--ms-group-label-padding** - Group label padding _(default: undefined)_\n- **--ms-group-label-font-size** - Group label font size _(default: undefined)_\n- **--ms-group-label-font-weight** - Group label font weight _(default: undefined)_\n- **--ms-group-label-color** - Group label color _(default: undefined)_\n- **--ms-group-label-transform** - Group label text transform _(default: undefined)_\n- **--ms-group-label-letter-spacing** - Group label letter spacing _(default: undefined)_\n- **--ms-option-gap** - Option content gap _(default: undefined)_\n- **--ms-option-padding** - Option padding _(default: undefined)_\n- **--ms-option-padding-h** - Option horizontal padding _(default: undefined)_\n- **--ms-option-color** - Option text color _(default: undefined)_\n- **--ms-option-bg** - Option background _(default: undefined)_\n- **--ms-option-bg-hover** - Option hover background _(default: undefined)_\n- **--ms-option-bg-focused** - Option focused background _(default: undefined)_\n- **--ms-option-outline-focused** - Option focus outline _(default: undefined)_\n- **--ms-option-focus-outline-offset** - Option focus outline offset _(default: undefined)_\n- **--ms-option-bg-matched** - Matched option background _(default: undefined)_\n- **--ms-option-border-matched** - Matched option border _(default: undefined)_\n- **--ms-option-bg-selected** - Selected option background _(default: undefined)_\n- **--ms-option-text-color** - Option text color (semantic) _(default: undefined)_\n- **--ms-option-color-hover** - Option hover color _(default: undefined)_\n- **--ms-option-color-focused** - Option focused color _(default: undefined)_\n- **--ms-option-outline-color-focused** - Option focus outline color _(default: undefined)_\n- **--ms-option-color-matched** - Matched option color _(default: undefined)_\n- **--ms-option-border-matched-color** - Matched option border color _(default: undefined)_\n- **--ms-option-bg-focused-hover** - Focused option hover background _(default: undefined)_\n- **--ms-option-bg-matched-hover** - Matched option hover background _(default: undefined)_\n- **--ms-option-bg-selected-focused** - Selected focused background _(default: undefined)_\n- **--ms-option-bg-selected-matched** - Selected matched background _(default: undefined)_\n- **--ms-option-disabled-bg** - Disabled option background _(default: undefined)_\n- **--ms-option-bg-disabled-selected** - Disabled selected background _(default: undefined)_\n- **--ms-disabled-opacity** - Disabled option opacity _(default: undefined)_\n- **--ms-option-content-gap** - Option content gap _(default: undefined)_\n- **--ms-option-icon-size** - Option icon size _(default: undefined)_\n- **--ms-option-icon-font-size** - Option icon font size _(default: undefined)_\n- **--ms-option-title-font-size** - Option title font size _(default: undefined)_\n- **--ms-option-title-color** - Option title color _(default: undefined)_\n- **--ms-option-subtitle-margin-top** - Option subtitle margin _(default: undefined)_\n- **--ms-option-subtitle-font-size** - Option subtitle font size _(default: undefined)_\n- **--ms-option-subtitle-line-height** - Option subtitle line height _(default: undefined)_\n- **--ms-option-subtitle-color** - Option subtitle color _(default: undefined)_\n- **--ms-option-mark-bg** - Search match highlight background _(default: undefined)_\n- **--ms-option-mark-color** - Search match highlight color _(default: undefined)_\n- **--ms-option-mark-font-weight** - Search match highlight weight _(default: undefined)_\n- **--ms-checkbox-margin-top** - Checkbox margin top _(default: undefined)_\n- **--ms-checkbox-margin-right** - Checkbox margin right _(default: undefined)_\n- **--ms-checkbox-margin-bottom** - Checkbox margin bottom _(default: undefined)_\n- **--ms-checkbox-margin-left** - Checkbox margin left _(default: undefined)_\n- **--ms-checkbox-size** - Checkbox size _(default: undefined)_\n- **--ms-checkbox-scale** - Checkbox scale _(default: undefined)_\n- **--ms-checkbox-align** - Checkbox alignment _(default: undefined)_\n- **--ms-checkbox-bg** - Checkbox background _(default: undefined)_\n- **--ms-checkbox-border** - Checkbox border _(default: undefined)_\n- **--ms-checkbox-border-radius** - Checkbox border radius _(default: undefined)_\n- **--ms-checkbox-checked-bg** - Checked checkbox background _(default: undefined)_\n- **--ms-checkbox-checked-border** - Checked checkbox border _(default: undefined)_\n- **--ms-checkbox-checkmark-color** - Checkmark color _(default: undefined)_\n- **--ms-checkbox-hover-border-color** - Checkbox hover border _(default: undefined)_\n- **--ms-checkbox-disabled-bg** - Disabled checkbox background _(default: undefined)_\n- **--ms-checkbox-disabled-border** - Disabled checkbox border _(default: undefined)_\n- **--ms-checkbox-checked-bg-hover** - Checked checkbox hover background _(default: undefined)_\n- **--ms-checkbox-checked-border-color-hover** - Checked checkbox hover border _(default: undefined)_\n- **--ms-state-min-height** - Shared min-height for the empty and loading states so the dropdown doesn't resize when swapping between them _(default: undefined)_\n- **--ms-empty-padding** - Empty state padding _(default: undefined)_\n- **--ms-empty-font-size** - Empty state font size _(default: undefined)_\n- **--ms-empty-color** - Empty state text color _(default: undefined)_\n- **--ms-loader-padding** - Loader padding _(default: undefined)_\n- **--ms-loader-gap** - Loader gap _(default: undefined)_\n- **--ms-loading-text-font-size** - Loading text font size _(default: undefined)_\n- **--ms-loading-text-color** - Loading text color _(default: undefined)_\n- **--ms-loading-color** - Loading color (semantic) _(default: undefined)_\n- **--ms-badges-gap** - Badges container gap _(default: undefined)_\n- **--ms-badges-margin-bottom** - Badges margin bottom _(default: undefined)_\n- **--ms-badges-margin-top** - Badges margin top _(default: undefined)_\n- **--ms-badges-margin-left** - Badges margin left _(default: undefined)_\n- **--ms-badges-margin-right** - Badges margin right _(default: undefined)_\n- **--ms-badge-gap** - Badge internal gap _(default: undefined)_\n- **--ms-badge-height** - Badge height _(default: undefined)_\n- **--ms-badge-font-size** - Badge font size _(default: undefined)_\n- **--ms-badge-font-weight** - Badge font weight _(default: undefined)_\n- **--ms-badge-border-radius** - Badge border radius _(default: undefined)_\n- **--ms-badge-bg** - Badge background _(default: undefined)_\n- **--ms-badge-bg-hover** - Badge hover background _(default: undefined)_\n- **--ms-badge-bg-active** - Badge active background _(default: undefined)_\n- **--ms-badge-text-padding** - Badge text padding _(default: undefined)_\n- **--ms-badge-text-bg** - Badge text background _(default: undefined)_\n- **--ms-badge-text-color** - Badge text color _(default: undefined)_\n- **--ms-badge-text-border** - Badge text border _(default: undefined)_\n- **--ms-badge-text-bg-hover** - Badge text hover background _(default: undefined)_\n- **--ms-badge-text-color-hover** - Badge text hover color _(default: undefined)_\n- **--ms-badge-remove-width** - Badge remove button width _(default: undefined)_\n- **--ms-badge-remove-bg** - Badge remove button background _(default: undefined)_\n- **--ms-badge-remove-color** - Badge remove button color _(default: undefined)_\n- **--ms-badge-remove-border** - Badge remove button border _(default: undefined)_\n- **--ms-badge-remove-font-size** - Badge remove button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-badge-remove-icon-size** - Badge remove X icon size (mask SVG) _(default: undefined)_\n- **--ms-badge-remove-bg-hover** - Badge remove button hover background _(default: undefined)_\n- **--ms-badge-remove-box-shadow-focus** - Badge remove button focus shadow _(default: undefined)_\n- **--ms-icon-remove** - Remove icon as CSS url() to a mask-friendly SVG; color comes from currentColor _(default: undefined)_\n- **--ms-icon-filter** - Funnel glyph (fullscreen search-mode toggle); chains to --base-icon-filter _(default: undefined)_\n- **--ms-icon-check** - Checkmark glyph (mask) for a checked checkbox/option; chains to --base-icon-check _(default: undefined)_\n- **--ms-icon-indeterminate** - Dash glyph (mask) for a tri-state/partial checkbox; chains to --base-icon-indeterminate _(default: undefined)_\n- **--ms-badge-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-badge-counter-border** - Counter badge border _(default: undefined)_\n- **--ms-badge-counter-border-color** - Counter badge border color _(default: undefined)_\n- **--ms-badge-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-badge-counter-text-color** - Counter badge text color _(default: undefined)_\n- **--ms-badge-counter-text-bg** - Counter badge text background _(default: undefined)_\n- **--ms-badge-counter-remove-bg** - Counter badge remove background _(default: undefined)_\n- **--ms-badge-counter-remove-color** - Counter badge remove color _(default: undefined)_\n- **--ms-badge-counter-remove-bg-hover** - Counter badge remove hover background _(default: undefined)_\n- **--ms-more-badge-bg** - More badge background _(default: undefined)_\n- **--ms-more-badge-hover-bg** - More badge hover background _(default: undefined)_\n- **--ms-more-badge-active-bg** - More badge active background _(default: undefined)_\n- **--ms-count-display-margin-bottom** - Count display margin bottom _(default: undefined)_\n- **--ms-count-display-margin-top** - Count display margin top _(default: undefined)_\n- **--ms-count-display-margin-left** - Count display margin left _(default: undefined)_\n- **--ms-count-display-margin-right** - Count display margin right _(default: undefined)_\n- **--ms-counter-wrapper-bg** - Counter wrapper background _(default: undefined)_\n- **--ms-counter-wrapper-border** - Counter wrapper border _(default: undefined)_\n- **--ms-counter-wrapper-border-radius** - Counter wrapper border radius _(default: undefined)_\n- **--ms-counter-wrapper-padding** - Counter wrapper padding _(default: undefined)_\n- **--ms-counter-wrapper-gap** - Counter wrapper gap _(default: undefined)_\n- **--ms-counter-wrapper-bg-hover** - Counter wrapper hover background _(default: undefined)_\n- **--ms-counter-wrapper-border-color** - Counter wrapper border color _(default: undefined)_\n- **--ms-counter-wrapper-border-color-hover** - Counter wrapper hover border _(default: undefined)_\n- **--ms-count-text-bg** - Count text background _(default: undefined)_\n- **--ms-count-text-border** - Count text border _(default: undefined)_\n- **--ms-count-text-font-size** - Count text font size _(default: undefined)_\n- **--ms-count-text-color** - Count text color _(default: undefined)_\n- **--ms-count-clear-size** - Count clear button size _(default: undefined)_\n- **--ms-count-clear-bg** - Count clear button background _(default: undefined)_\n- **--ms-count-clear-color** - Count clear button color _(default: undefined)_\n- **--ms-count-clear-font-size** - Count clear button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-count-clear-icon-size** - Count clear X icon size (mask SVG) _(default: undefined)_\n- **--ms-count-clear-border-radius** - Count clear button border radius _(default: undefined)_\n- **--ms-count-clear-bg-hover** - Count clear button hover background _(default: undefined)_\n- **--ms-count-clear-color-hover** - Count clear button hover color _(default: undefined)_\n- **--ms-icon-clear** - Clear icon as CSS url() to a mask-friendly SVG; defaults to var(--ms-icon-remove) _(default: undefined)_\n- **--ms-tooltip-bg** - Tooltip background _(default: undefined)_\n- **--ms-tooltip-text-color** - Tooltip text color _(default: undefined)_\n- **--ms-tooltip-color** - Tooltip color _(default: undefined)_\n- **--ms-tooltip-padding** - Tooltip padding _(default: undefined)_\n- **--ms-tooltip-border-radius** - Tooltip border radius _(default: undefined)_\n- **--ms-tooltip-font-size** - Tooltip font size _(default: undefined)_\n- **--ms-tooltip-max-width** - Tooltip max width _(default: undefined)_\n- **--ms-tooltip-shadow** - Tooltip shadow _(default: undefined)_\n- **--ms-tooltip-z-index** - Tooltip z-index _(default: undefined)_\n- **--ms-z-index-popover** - Popover z-index _(default: undefined)_\n- **--ms-selected-popover-width** - Selected popover width _(default: undefined)_\n- **--ms-selected-popover-max-height** - Selected popover max height _(default: undefined)_\n- **--ms-selected-popover-border** - Selected popover border _(default: undefined)_\n- **--ms-selected-popover-border-radius** - Selected popover border radius _(default: undefined)_\n- **--ms-selected-popover-box-shadow** - Selected popover shadow _(default: undefined)_\n- **--ms-selected-popover-bg** - Selected popover background _(default: undefined)_\n- **--ms-selected-popover-border-color** - Selected popover border color _(default: undefined)_\n- **--ms-selected-popover-header-padding** - Popover header padding _(default: undefined)_\n- **--ms-selected-popover-header-bg** - Popover header background _(default: undefined)_\n- **--ms-selected-popover-header-border-bottom** - Popover header border _(default: undefined)_\n- **--ms-selected-popover-header-font-size** - Popover header font size _(default: undefined)_\n- **--ms-selected-popover-header-font-weight** - Popover header font weight _(default: undefined)_\n- **--ms-selected-popover-header-color** - Popover header color _(default: undefined)_\n- **--ms-selected-popover-header-border-color** - Popover header border color _(default: undefined)_\n- **--ms-popover-close-size** - Popover close button size _(default: undefined)_\n- **--ms-selected-popover-close-bg** - Popover close button background _(default: undefined)_\n- **--ms-selected-popover-close-color** - Popover close button color _(default: undefined)_\n- **--ms-selected-popover-close-font-size** - Popover close button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-selected-popover-close-icon-size** - Popover close X icon size (mask SVG) _(default: undefined)_\n- **--ms-selected-popover-close-border-radius** - Popover close button border radius _(default: undefined)_\n- **--ms-selected-popover-close-bg-hover** - Popover close button hover background _(default: undefined)_\n- **--ms-selected-popover-close-color-hover** - Popover close button hover color _(default: undefined)_\n- **--ms-selected-popover-body-gap** - Popover body gap _(default: undefined)_\n- **--ms-selected-popover-body-padding** - Popover body padding _(default: undefined)_\n- **--ms-selected-popover-body-max-height** - Popover body max height _(default: undefined)_\n- **--ms-font-size-2xs** - Extra extra small font size _(default: undefined)_\n- **--ms-font-size-xs** - Extra small font size _(default: undefined)_\n- **--ms-font-size-sm** - Small font size _(default: undefined)_\n- **--ms-font-size-base** - Base font size _(default: undefined)_\n- **--ms-font-size-lg** - Large font size _(default: undefined)_\n- **--ms-font-weight-normal** - Normal font weight _(default: undefined)_\n- **--ms-font-weight-medium** - Medium font weight _(default: undefined)_\n- **--ms-font-weight-semibold** - Semibold font weight _(default: undefined)_\n- **--ms-line-height-none** - No line height (1) _(default: undefined)_\n- **--ms-line-height-tight** - Tight line height _(default: undefined)_\n- **--ms-line-height-normal** - Normal line height _(default: undefined)_\n- **--ms-line-height-relaxed** - Relaxed line height _(default: undefined)_\n- **--ms-border-radius-sm** - Small border radius _(default: undefined)_\n- **--ms-border-radius-md** - Medium border radius _(default: undefined)_\n- **--ms-border-radius-lg** - Large border radius _(default: undefined)_\n- **--ms-border-radius** - Default border radius _(default: undefined)_\n- **--ms-spacing-xs** - Extra small spacing _(default: undefined)_\n- **--ms-spacing-sm** - Small spacing _(default: undefined)_\n- **--ms-spacing-md** - Medium spacing _(default: undefined)_\n- **--ms-spacing-lg** - Large spacing _(default: undefined)_\n- **--ms-transition-fast** - Fast transition duration _(default: undefined)_\n- **--ms-transition-normal** - Normal transition duration _(default: undefined)_\n- **--ms-easing-snappy** - Snappy easing function _(default: undefined)_\n- **--ms-placeholder-opacity** - Placeholder opacity _(default: undefined)_\n- **--ms-disabled-input-opacity** - Disabled input opacity _(default: undefined)_\n- **--ms-scrollbar-width** - Scrollbar width _(default: undefined)_\n- **--ms-scrollbar-track-bg** - Scrollbar track background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg** - Scrollbar thumb background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg-hover** - Scrollbar thumb hover background _(default: undefined)_\n- **--ms-scrollbar-thumb-border-radius** - Scrollbar thumb border radius _(default: undefined)_\n- **--ms-debug-bg** - Debug panel background _(default: undefined)_\n- **--ms-debug-border-color** - Debug panel border _(default: undefined)_\n- **--ms-debug-text-color** - Debug panel text _(default: undefined)_\n- **--ms-debug-border-radius** - Debug panel corner radius _(default: undefined)_\n- **--ms-debug-summary-color** - Debug section heading color _(default: undefined)_\n- **--ms-debug-summary-bg-hover** - Debug section heading hover background _(default: undefined)_\n- **--ms-debug-summary-outline-color** - Debug section heading focus outline _(default: undefined)_\n- **--ms-debug-summary-border-radius** - Debug section heading corner radius _(default: undefined)_\n- **--ms-debug-stats-bg** - Debug stats nested panel background _(default: undefined)_\n- **--ms-debug-stats-border-radius** - Debug stats nested panel corner radius _(default: undefined)_\n- **--ms-debug-bullet-color** - Debug stat bullet marker color _(default: undefined)_\n- **--ms-transform-rotate-180** - 180 degree rotation _(default: undefined)_\n- **--ms-transform-scale-hover** - Hover scale transform _(default: undefined)_\n- **--ms-transform-scale-active** - Active scale transform _(default: undefined)_\n- **--ms-order-first** - Order first (-1) _(default: undefined)_",
|
|
8
8
|
"attributes": [
|
|
9
9
|
{
|
|
10
10
|
"name": "search-hint",
|
package/web-types.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
|
|
3
3
|
"name": "@keenmate/web-multiselect",
|
|
4
|
-
"version": "2.0.
|
|
4
|
+
"version": "2.0.1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
8
8
|
"elements": [
|
|
9
9
|
{
|
|
10
10
|
"name": "web-multiselect",
|
|
11
|
-
"description": "\n---\n\n\n### **Events:**\n - **select** - An option was selected. `detail.option` is the selected option; `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **deselect** - An option was removed from the selection. `detail.option` is that option.\n- **change** - The selection changed. `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **add** - The user chose to create a new option from the typed text (via the \"add new\" prompt or Enter) — requires `allow-add-new`. `detail.value` is the typed text; `detail.option` is the created item when `addNewCallback` produced one.\n\n### **Methods:**\n - **formResetCallback(): _void_** - Called by the browser when the surrounding <form> is reset. Clears the\r\npicker's selection so the control participates in the standard reset.\n\n\n\n\n\n\n\n- **showMessage(content: _string | HTMLElement_, opts: _MessageOptions_): _void_** - Surface a transient message (\"toast\") on top of the component — visible even in the\r\nfullscreen overlay, where page-level UI is hidden behind the sheet. Content is text or\r\nan element; `opts.variant` sets the tone and `opts.duration` the auto-dismiss (0 =\r\nsticky). Also reached automatically when a `beforeSelect`/`beforeDeselect` callback\r\nreturns a reason string.\n- **hideMessage(): _void_** - Dismiss the transient message shown by showMessage, if any.\n- **clearSearch(): _void_** - Clear the search box and restore the full option list (does not touch the selection — use\r\nclearAll for that). Pair with scrollToValue to reveal then scroll to an option\r\na search had filtered out: `el.clearSearch(); el.scrollToValue(v)`.\n- **search(term: _string_): _void_** - Programmatically set the search text and filter, as if the user typed it (runs\r\n`beforeSearchCallback` / `minSearchLength` / async `searchCallback`). Does not open the dropdown\r\n— call open if you want it visible. Pass `''` to clear (same as clearSearch).\n- **scrollToIndex(index: _number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option at `index` (into the current filtered list). Returns\r\nfalse if closed or out of range. Deferred internally so `el.open(); el.scrollToIndex(i)` works.\n- **scrollToValue(value: _string | number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option with this `value`. Returns false if it isn't in the\r\ncurrently visible list (filtered out by search, or under a collapsed tree branch) — call\r\nclearSearch / expand first.\n- **scrollToGroup(name: _string_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll to a group: its header in standard rendering, or the group's first option in\r\nvirtual-scroll mode (no headers there). Returns false in tree mode or if the group is empty\r\nin the current filtered list.\n- **open(): _void_** - Open the dropdown.\n- **close(): _void_** - Close the dropdown.\n- **toggle(): _void_** - Toggle the dropdown open/closed.\n\n### **CSS Properties:**\n - **--ms-rem** - Base sizing unit for proportional scaling (default: 10px) _(default: undefined)_\n- **--ms-accent-color** - Primary accent color _(default: undefined)_\n- **--ms-accent-color-hover** - Accent color on hover _(default: undefined)_\n- **--ms-accent-color-active** - Accent color when pressed _(default: undefined)_\n- **--ms-accent-color-light** - Light accent background _(default: undefined)_\n- **--ms-accent-color-light-hover** - Light accent hover _(default: undefined)_\n- **--ms-text-color-1** - Primary text color _(default: undefined)_\n- **--ms-text-color-2** - Secondary text color _(default: undefined)_\n- **--ms-text-color-3** - Tertiary text color _(default: undefined)_\n- **--ms-text-color-4** - Quaternary text color _(default: undefined)_\n- **--ms-text-color-on-accent** - Text on accent backgrounds _(default: undefined)_\n- **--ms-text-primary** - Legacy alias for text-color-1 _(default: undefined)_\n- **--ms-text-secondary** - Legacy alias for text-color-3 _(default: undefined)_\n- **--ms-primary-bg** - Hover/focus background (options, action buttons, counter); reads --base-hover-bg _(default: undefined)_\n- **--ms-primary-bg-hover** - Active/stronger background (counter badge text); reads --base-active-bg _(default: undefined)_\n- **--ms-border-color** - Default border color _(default: undefined)_\n- **--ms-border** - Full border shorthand _(default: undefined)_\n- **--ms-input-bg** - Input field background _(default: undefined)_\n- **--ms-input-color** - Input text color _(default: undefined)_\n- **--ms-input-border** - Input border _(default: undefined)_\n- **--ms-input-border-hover** - Input border on hover _(default: undefined)_\n- **--ms-input-border-focus** - Input border when focused _(default: undefined)_\n- **--ms-input-placeholder-color** - Placeholder text color _(default: undefined)_\n- **--ms-input-bg-disabled** - Disabled input background _(default: undefined)_\n- **--ms-input-padding** - Input padding _(default: undefined)_\n- **--ms-input-padding-right** - Input right padding (for toggle) _(default: undefined)_\n- **--ms-input-height** - Input height _(default: undefined)_\n- **--ms-input-font-size** - Input font size _(default: undefined)_\n- **--ms-input-border-width** - Input border width _(default: undefined)_\n- **--ms-input-border-radius** - Input border radius _(default: undefined)_\n- **--ms-input-text** - Input text color _(default: undefined)_\n- **--ms-input-size-xs-font** - XS size font _(default: undefined)_\n- **--ms-input-size-xs-padding-v** - XS vertical padding _(default: undefined)_\n- **--ms-input-size-xs-padding-h** - XS horizontal padding _(default: undefined)_\n- **--ms-input-size-xs-height** - XS input height _(default: undefined)_\n- **--ms-input-size-sm-font** - SM size font _(default: undefined)_\n- **--ms-input-size-sm-padding-v** - SM vertical padding _(default: undefined)_\n- **--ms-input-size-sm-padding-h** - SM horizontal padding _(default: undefined)_\n- **--ms-input-size-sm-height** - SM input height _(default: undefined)_\n- **--ms-input-size-md-font** - MD size font _(default: undefined)_\n- **--ms-input-size-md-padding-v** - MD vertical padding _(default: undefined)_\n- **--ms-input-size-md-padding-h** - MD horizontal padding _(default: undefined)_\n- **--ms-input-size-md-height** - MD input height _(default: undefined)_\n- **--ms-input-size-lg-font** - LG size font _(default: undefined)_\n- **--ms-input-size-lg-padding-v** - LG vertical padding _(default: undefined)_\n- **--ms-input-size-lg-padding-h** - LG horizontal padding _(default: undefined)_\n- **--ms-input-size-lg-height** - LG input height _(default: undefined)_\n- **--ms-input-size-xl-font** - XL size font _(default: undefined)_\n- **--ms-input-size-xl-padding-v** - XL vertical padding _(default: undefined)_\n- **--ms-input-size-xl-padding-h** - XL horizontal padding _(default: undefined)_\n- **--ms-input-size-xl-height** - XL input height _(default: undefined)_\n- **--ms-toggle-right** - Toggle icon right position _(default: undefined)_\n- **--ms-toggle-color** - Toggle icon color _(default: undefined)_\n- **--ms-toggle-icon-color** - Toggle icon color (semantic) _(default: undefined)_\n- **--ms-toggle-icon-color-open** - Toggle icon color when open _(default: undefined)_\n- **--ms-counter-offset** - Counter badge offset _(default: undefined)_\n- **--ms-counter-padding** - Counter badge padding _(default: undefined)_\n- **--ms-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-counter-color** - Counter badge text color _(default: undefined)_\n- **--ms-counter-font-size** - Counter badge font size _(default: undefined)_\n- **--ms-counter-font-weight** - Counter badge font weight _(default: undefined)_\n- **--ms-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-counter-bg-hover** - Counter badge hover background _(default: undefined)_\n- **--ms-counter-badge-bg** - Counter badge semantic background _(default: undefined)_\n- **--ms-counter-badge-bg-hover** - Counter badge semantic hover _(default: undefined)_\n- **--ms-counter-badge-color** - Counter badge semantic color _(default: undefined)_\n- **--ms-hint-padding** - Floating hint padding _(default: undefined)_\n- **--ms-hint-border** - Floating hint border _(default: undefined)_\n- **--ms-hint-border-radius** - Floating hint border radius _(default: undefined)_\n- **--ms-hint-box-shadow** - Floating hint shadow _(default: undefined)_\n- **--ms-hint-font-size** - Floating hint font size _(default: undefined)_\n- **--ms-hint-bg** - Floating hint background _(default: undefined)_\n- **--ms-hint-color** - Floating hint text color _(default: undefined)_\n- **--ms-hint-border-color** - Floating hint border color _(default: undefined)_\n- **--ms-dropdown-bg** - Dropdown background _(default: undefined)_\n- **--ms-dropdown-text-color** - Dropdown text color _(default: undefined)_\n- **--ms-dropdown-border** - Dropdown border _(default: undefined)_\n- **--ms-dropdown-border-color** - Dropdown border color _(default: undefined)_\n- **--ms-dropdown-border-radius** - Dropdown border radius _(default: undefined)_\n- **--ms-dropdown-box-shadow** - Dropdown shadow _(default: undefined)_\n- **--ms-dropdown-box-shadow-semantic** - Dropdown semantic shadow _(default: undefined)_\n- **--ms-dropdown-width** - Options dropdown width (defaults to the input width; also set via the dropdown-width attribute) _(default: undefined)_\n- **--ms-options-max-height** - Options list max height _(default: undefined)_\n- **--ms-z-index-dropdown** - Dropdown z-index _(default: undefined)_\n- **--ms-z-index-sticky** - Sticky elements z-index _(default: undefined)_\n- **--ms-actions-gap** - Actions row gap _(default: undefined)_\n- **--ms-actions-padding** - Actions row padding _(default: undefined)_\n- **--ms-actions-border-bottom** - Actions row border _(default: undefined)_\n- **--ms-actions-bg** - Actions row background _(default: undefined)_\n- **--ms-actions-border-color** - Actions row border color _(default: undefined)_\n- **--ms-action-btn-padding** - Action button padding _(default: undefined)_\n- **--ms-action-btn-font-size** - Action button font size _(default: undefined)_\n- **--ms-action-btn-border** - Action button border _(default: undefined)_\n- **--ms-action-btn-border-radius** - Action button border radius _(default: undefined)_\n- **--ms-action-btn-bg** - Action button background _(default: undefined)_\n- **--ms-action-btn-color** - Action button color _(default: undefined)_\n- **--ms-action-btn-bg-hover** - Action button hover background _(default: undefined)_\n- **--ms-action-btn-border-color-hover** - Action button hover border _(default: undefined)_\n- **--ms-action-button-bg** - Semantic action button background _(default: undefined)_\n- **--ms-action-button-bg-hover** - Semantic action button hover _(default: undefined)_\n- **--ms-action-button-border-color** - Semantic action button border _(default: undefined)_\n- **--ms-action-button-border-color-hover** - Semantic action button hover border _(default: undefined)_\n- **--ms-action-button-color** - Semantic action button color _(default: undefined)_\n- **--ms-options-padding** - Options container padding _(default: undefined)_\n- **--ms-group-border-top** - Group border top _(default: undefined)_\n- **--ms-group-margin-top** - Group margin top _(default: undefined)_\n- **--ms-group-padding-top** - Group padding top _(default: undefined)_\n- **--ms-group-border-color** - Group border color _(default: undefined)_\n- **--ms-group-label-padding** - Group label padding _(default: undefined)_\n- **--ms-group-label-font-size** - Group label font size _(default: undefined)_\n- **--ms-group-label-font-weight** - Group label font weight _(default: undefined)_\n- **--ms-group-label-color** - Group label color _(default: undefined)_\n- **--ms-group-label-transform** - Group label text transform _(default: undefined)_\n- **--ms-group-label-letter-spacing** - Group label letter spacing _(default: undefined)_\n- **--ms-option-gap** - Option content gap _(default: undefined)_\n- **--ms-option-padding** - Option padding _(default: undefined)_\n- **--ms-option-padding-h** - Option horizontal padding _(default: undefined)_\n- **--ms-option-color** - Option text color _(default: undefined)_\n- **--ms-option-bg** - Option background _(default: undefined)_\n- **--ms-option-bg-hover** - Option hover background _(default: undefined)_\n- **--ms-option-bg-focused** - Option focused background _(default: undefined)_\n- **--ms-option-outline-focused** - Option focus outline _(default: undefined)_\n- **--ms-option-focus-outline-offset** - Option focus outline offset _(default: undefined)_\n- **--ms-option-bg-matched** - Matched option background _(default: undefined)_\n- **--ms-option-border-matched** - Matched option border _(default: undefined)_\n- **--ms-option-bg-selected** - Selected option background _(default: undefined)_\n- **--ms-option-text-color** - Option text color (semantic) _(default: undefined)_\n- **--ms-option-color-hover** - Option hover color _(default: undefined)_\n- **--ms-option-color-focused** - Option focused color _(default: undefined)_\n- **--ms-option-outline-color-focused** - Option focus outline color _(default: undefined)_\n- **--ms-option-color-matched** - Matched option color _(default: undefined)_\n- **--ms-option-border-matched-color** - Matched option border color _(default: undefined)_\n- **--ms-option-bg-focused-hover** - Focused option hover background _(default: undefined)_\n- **--ms-option-bg-matched-hover** - Matched option hover background _(default: undefined)_\n- **--ms-option-bg-selected-focused** - Selected focused background _(default: undefined)_\n- **--ms-option-bg-selected-matched** - Selected matched background _(default: undefined)_\n- **--ms-option-disabled-bg** - Disabled option background _(default: undefined)_\n- **--ms-option-bg-disabled-selected** - Disabled selected background _(default: undefined)_\n- **--ms-disabled-opacity** - Disabled option opacity _(default: undefined)_\n- **--ms-option-content-gap** - Option content gap _(default: undefined)_\n- **--ms-option-icon-size** - Option icon size _(default: undefined)_\n- **--ms-option-icon-font-size** - Option icon font size _(default: undefined)_\n- **--ms-option-title-font-size** - Option title font size _(default: undefined)_\n- **--ms-option-title-color** - Option title color _(default: undefined)_\n- **--ms-option-subtitle-margin-top** - Option subtitle margin _(default: undefined)_\n- **--ms-option-subtitle-font-size** - Option subtitle font size _(default: undefined)_\n- **--ms-option-subtitle-line-height** - Option subtitle line height _(default: undefined)_\n- **--ms-option-subtitle-color** - Option subtitle color _(default: undefined)_\n- **--ms-option-mark-bg** - Search match highlight background _(default: undefined)_\n- **--ms-option-mark-color** - Search match highlight color _(default: undefined)_\n- **--ms-option-mark-font-weight** - Search match highlight weight _(default: undefined)_\n- **--ms-checkbox-margin-top** - Checkbox margin top _(default: undefined)_\n- **--ms-checkbox-margin-right** - Checkbox margin right _(default: undefined)_\n- **--ms-checkbox-margin-bottom** - Checkbox margin bottom _(default: undefined)_\n- **--ms-checkbox-margin-left** - Checkbox margin left _(default: undefined)_\n- **--ms-checkbox-size** - Checkbox size _(default: undefined)_\n- **--ms-checkbox-scale** - Checkbox scale _(default: undefined)_\n- **--ms-checkbox-align** - Checkbox alignment _(default: undefined)_\n- **--ms-checkbox-bg** - Checkbox background _(default: undefined)_\n- **--ms-checkbox-border** - Checkbox border _(default: undefined)_\n- **--ms-checkbox-border-radius** - Checkbox border radius _(default: undefined)_\n- **--ms-checkbox-checked-bg** - Checked checkbox background _(default: undefined)_\n- **--ms-checkbox-checked-border** - Checked checkbox border _(default: undefined)_\n- **--ms-checkbox-checkmark-color** - Checkmark color _(default: undefined)_\n- **--ms-checkbox-hover-border-color** - Checkbox hover border _(default: undefined)_\n- **--ms-checkbox-disabled-bg** - Disabled checkbox background _(default: undefined)_\n- **--ms-checkbox-disabled-border** - Disabled checkbox border _(default: undefined)_\n- **--ms-checkbox-checked-bg-hover** - Checked checkbox hover background _(default: undefined)_\n- **--ms-checkbox-checked-border-color-hover** - Checked checkbox hover border _(default: undefined)_\n- **--ms-state-min-height** - Shared min-height for the empty and loading states so the dropdown doesn't resize when swapping between them _(default: undefined)_\n- **--ms-empty-padding** - Empty state padding _(default: undefined)_\n- **--ms-empty-font-size** - Empty state font size _(default: undefined)_\n- **--ms-empty-color** - Empty state text color _(default: undefined)_\n- **--ms-loader-padding** - Loader padding _(default: undefined)_\n- **--ms-loader-gap** - Loader gap _(default: undefined)_\n- **--ms-loading-text-font-size** - Loading text font size _(default: undefined)_\n- **--ms-loading-text-color** - Loading text color _(default: undefined)_\n- **--ms-loading-color** - Loading color (semantic) _(default: undefined)_\n- **--ms-badges-gap** - Badges container gap _(default: undefined)_\n- **--ms-badges-margin-bottom** - Badges margin bottom _(default: undefined)_\n- **--ms-badges-margin-top** - Badges margin top _(default: undefined)_\n- **--ms-badges-margin-left** - Badges margin left _(default: undefined)_\n- **--ms-badges-margin-right** - Badges margin right _(default: undefined)_\n- **--ms-badge-gap** - Badge internal gap _(default: undefined)_\n- **--ms-badge-height** - Badge height _(default: undefined)_\n- **--ms-badge-font-size** - Badge font size _(default: undefined)_\n- **--ms-badge-font-weight** - Badge font weight _(default: undefined)_\n- **--ms-badge-border-radius** - Badge border radius _(default: undefined)_\n- **--ms-badge-bg** - Badge background _(default: undefined)_\n- **--ms-badge-bg-hover** - Badge hover background _(default: undefined)_\n- **--ms-badge-bg-active** - Badge active background _(default: undefined)_\n- **--ms-badge-text-padding** - Badge text padding _(default: undefined)_\n- **--ms-badge-text-bg** - Badge text background _(default: undefined)_\n- **--ms-badge-text-color** - Badge text color _(default: undefined)_\n- **--ms-badge-text-border** - Badge text border _(default: undefined)_\n- **--ms-badge-text-bg-hover** - Badge text hover background _(default: undefined)_\n- **--ms-badge-text-color-hover** - Badge text hover color _(default: undefined)_\n- **--ms-badge-remove-width** - Badge remove button width _(default: undefined)_\n- **--ms-badge-remove-bg** - Badge remove button background _(default: undefined)_\n- **--ms-badge-remove-color** - Badge remove button color _(default: undefined)_\n- **--ms-badge-remove-border** - Badge remove button border _(default: undefined)_\n- **--ms-badge-remove-font-size** - Badge remove button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-badge-remove-icon-size** - Badge remove X icon size (mask SVG) _(default: undefined)_\n- **--ms-badge-remove-bg-hover** - Badge remove button hover background _(default: undefined)_\n- **--ms-badge-remove-box-shadow-focus** - Badge remove button focus shadow _(default: undefined)_\n- **--ms-icon-remove** - Remove icon as CSS url() to a mask-friendly SVG; color comes from currentColor _(default: undefined)_\n- **--ms-icon-filter** - Funnel glyph (fullscreen search-mode toggle); chains to --base-icon-filter _(default: undefined)_\n- **--ms-icon-check** - Checkmark glyph (mask) for a checked checkbox/option; chains to --base-icon-check _(default: undefined)_\n- **--ms-icon-indeterminate** - Dash glyph (mask) for a tri-state/partial checkbox; chains to --base-icon-indeterminate _(default: undefined)_\n- **--ms-badge-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-badge-counter-border** - Counter badge border _(default: undefined)_\n- **--ms-badge-counter-border-color** - Counter badge border color _(default: undefined)_\n- **--ms-badge-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-badge-counter-text-color** - Counter badge text color _(default: undefined)_\n- **--ms-badge-counter-text-bg** - Counter badge text background _(default: undefined)_\n- **--ms-badge-counter-remove-bg** - Counter badge remove background _(default: undefined)_\n- **--ms-badge-counter-remove-color** - Counter badge remove color _(default: undefined)_\n- **--ms-badge-counter-remove-bg-hover** - Counter badge remove hover background _(default: undefined)_\n- **--ms-more-badge-bg** - More badge background _(default: undefined)_\n- **--ms-more-badge-hover-bg** - More badge hover background _(default: undefined)_\n- **--ms-more-badge-active-bg** - More badge active background _(default: undefined)_\n- **--ms-count-display-margin-bottom** - Count display margin bottom _(default: undefined)_\n- **--ms-count-display-margin-top** - Count display margin top _(default: undefined)_\n- **--ms-count-display-margin-left** - Count display margin left _(default: undefined)_\n- **--ms-count-display-margin-right** - Count display margin right _(default: undefined)_\n- **--ms-counter-wrapper-bg** - Counter wrapper background _(default: undefined)_\n- **--ms-counter-wrapper-border** - Counter wrapper border _(default: undefined)_\n- **--ms-counter-wrapper-border-radius** - Counter wrapper border radius _(default: undefined)_\n- **--ms-counter-wrapper-padding** - Counter wrapper padding _(default: undefined)_\n- **--ms-counter-wrapper-gap** - Counter wrapper gap _(default: undefined)_\n- **--ms-counter-wrapper-bg-hover** - Counter wrapper hover background _(default: undefined)_\n- **--ms-counter-wrapper-border-color** - Counter wrapper border color _(default: undefined)_\n- **--ms-counter-wrapper-border-color-hover** - Counter wrapper hover border _(default: undefined)_\n- **--ms-count-text-bg** - Count text background _(default: undefined)_\n- **--ms-count-text-border** - Count text border _(default: undefined)_\n- **--ms-count-text-font-size** - Count text font size _(default: undefined)_\n- **--ms-count-text-color** - Count text color _(default: undefined)_\n- **--ms-count-clear-size** - Count clear button size _(default: undefined)_\n- **--ms-count-clear-bg** - Count clear button background _(default: undefined)_\n- **--ms-count-clear-color** - Count clear button color _(default: undefined)_\n- **--ms-count-clear-font-size** - Count clear button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-count-clear-icon-size** - Count clear X icon size (mask SVG) _(default: undefined)_\n- **--ms-count-clear-border-radius** - Count clear button border radius _(default: undefined)_\n- **--ms-count-clear-bg-hover** - Count clear button hover background _(default: undefined)_\n- **--ms-count-clear-color-hover** - Count clear button hover color _(default: undefined)_\n- **--ms-icon-clear** - Clear icon as CSS url() to a mask-friendly SVG; defaults to var(--ms-icon-remove) _(default: undefined)_\n- **--ms-tooltip-bg** - Tooltip background _(default: undefined)_\n- **--ms-tooltip-text-color** - Tooltip text color _(default: undefined)_\n- **--ms-tooltip-color** - Tooltip color _(default: undefined)_\n- **--ms-tooltip-padding** - Tooltip padding _(default: undefined)_\n- **--ms-tooltip-border-radius** - Tooltip border radius _(default: undefined)_\n- **--ms-tooltip-font-size** - Tooltip font size _(default: undefined)_\n- **--ms-tooltip-max-width** - Tooltip max width _(default: undefined)_\n- **--ms-tooltip-shadow** - Tooltip shadow _(default: undefined)_\n- **--ms-tooltip-z-index** - Tooltip z-index _(default: undefined)_\n- **--ms-z-index-popover** - Popover z-index _(default: undefined)_\n- **--ms-selected-popover-width** - Selected popover width _(default: undefined)_\n- **--ms-selected-popover-max-height** - Selected popover max height _(default: undefined)_\n- **--ms-selected-popover-border** - Selected popover border _(default: undefined)_\n- **--ms-selected-popover-border-radius** - Selected popover border radius _(default: undefined)_\n- **--ms-selected-popover-box-shadow** - Selected popover shadow _(default: undefined)_\n- **--ms-selected-popover-bg** - Selected popover background _(default: undefined)_\n- **--ms-selected-popover-border-color** - Selected popover border color _(default: undefined)_\n- **--ms-selected-popover-header-padding** - Popover header padding _(default: undefined)_\n- **--ms-selected-popover-header-bg** - Popover header background _(default: undefined)_\n- **--ms-selected-popover-header-border-bottom** - Popover header border _(default: undefined)_\n- **--ms-selected-popover-header-font-size** - Popover header font size _(default: undefined)_\n- **--ms-selected-popover-header-font-weight** - Popover header font weight _(default: undefined)_\n- **--ms-selected-popover-header-color** - Popover header color _(default: undefined)_\n- **--ms-selected-popover-header-border-color** - Popover header border color _(default: undefined)_\n- **--ms-popover-close-size** - Popover close button size _(default: undefined)_\n- **--ms-selected-popover-close-bg** - Popover close button background _(default: undefined)_\n- **--ms-selected-popover-close-color** - Popover close button color _(default: undefined)_\n- **--ms-selected-popover-close-font-size** - Popover close button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-selected-popover-close-icon-size** - Popover close X icon size (mask SVG) _(default: undefined)_\n- **--ms-selected-popover-close-border-radius** - Popover close button border radius _(default: undefined)_\n- **--ms-selected-popover-close-bg-hover** - Popover close button hover background _(default: undefined)_\n- **--ms-selected-popover-close-color-hover** - Popover close button hover color _(default: undefined)_\n- **--ms-selected-popover-body-gap** - Popover body gap _(default: undefined)_\n- **--ms-selected-popover-body-padding** - Popover body padding _(default: undefined)_\n- **--ms-selected-popover-body-max-height** - Popover body max height _(default: undefined)_\n- **--ms-font-size-2xs** - Extra extra small font size _(default: undefined)_\n- **--ms-font-size-xs** - Extra small font size _(default: undefined)_\n- **--ms-font-size-sm** - Small font size _(default: undefined)_\n- **--ms-font-size-base** - Base font size _(default: undefined)_\n- **--ms-font-size-lg** - Large font size _(default: undefined)_\n- **--ms-font-weight-normal** - Normal font weight _(default: undefined)_\n- **--ms-font-weight-medium** - Medium font weight _(default: undefined)_\n- **--ms-font-weight-semibold** - Semibold font weight _(default: undefined)_\n- **--ms-line-height-none** - No line height (1) _(default: undefined)_\n- **--ms-line-height-tight** - Tight line height _(default: undefined)_\n- **--ms-line-height-normal** - Normal line height _(default: undefined)_\n- **--ms-line-height-relaxed** - Relaxed line height _(default: undefined)_\n- **--ms-border-radius-sm** - Small border radius _(default: undefined)_\n- **--ms-border-radius-md** - Medium border radius _(default: undefined)_\n- **--ms-border-radius-lg** - Large border radius _(default: undefined)_\n- **--ms-border-radius** - Default border radius _(default: undefined)_\n- **--ms-spacing-xs** - Extra small spacing _(default: undefined)_\n- **--ms-spacing-sm** - Small spacing _(default: undefined)_\n- **--ms-spacing-md** - Medium spacing _(default: undefined)_\n- **--ms-spacing-lg** - Large spacing _(default: undefined)_\n- **--ms-transition-fast** - Fast transition duration _(default: undefined)_\n- **--ms-transition-normal** - Normal transition duration _(default: undefined)_\n- **--ms-easing-snappy** - Snappy easing function _(default: undefined)_\n- **--ms-placeholder-opacity** - Placeholder opacity _(default: undefined)_\n- **--ms-disabled-input-opacity** - Disabled input opacity _(default: undefined)_\n- **--ms-scrollbar-width** - Scrollbar width _(default: undefined)_\n- **--ms-scrollbar-track-bg** - Scrollbar track background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg** - Scrollbar thumb background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg-hover** - Scrollbar thumb hover background _(default: undefined)_\n- **--ms-scrollbar-thumb-border-radius** - Scrollbar thumb border radius _(default: undefined)_\n- **--ms-debug-bg** - Debug panel background _(default: undefined)_\n- **--ms-debug-border-color** - Debug panel border _(default: undefined)_\n- **--ms-debug-text-color** - Debug panel text _(default: undefined)_\n- **--ms-debug-border-radius** - Debug panel corner radius _(default: undefined)_\n- **--ms-debug-summary-color** - Debug section heading color _(default: undefined)_\n- **--ms-debug-summary-bg-hover** - Debug section heading hover background _(default: undefined)_\n- **--ms-debug-summary-outline-color** - Debug section heading focus outline _(default: undefined)_\n- **--ms-debug-summary-border-radius** - Debug section heading corner radius _(default: undefined)_\n- **--ms-debug-stats-bg** - Debug stats nested panel background _(default: undefined)_\n- **--ms-debug-stats-border-radius** - Debug stats nested panel corner radius _(default: undefined)_\n- **--ms-debug-bullet-color** - Debug stat bullet marker color _(default: undefined)_\n- **--ms-transform-center-y** - Center Y transform _(default: undefined)_\n- **--ms-transform-rotate-180** - 180 degree rotation _(default: undefined)_\n- **--ms-transform-scale-hover** - Hover scale transform _(default: undefined)_\n- **--ms-transform-scale-active** - Active scale transform _(default: undefined)_\n- **--ms-order-first** - Order first (-1) _(default: undefined)_",
|
|
11
|
+
"description": "\n---\n\n\n### **Events:**\n - **select** - An option was selected. `detail.option` is the selected option; `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **deselect** - An option was removed from the selection. `detail.option` is that option.\n- **change** - The selection changed. `detail.selectedOptions`/`detail.selectedValues` are the full selection.\n- **add** - The user chose to create a new option from the typed text (via the \"add new\" prompt or Enter) — requires `allow-add-new`. `detail.value` is the typed text; `detail.option` is the created item when `addNewCallback` produced one.\n\n### **Methods:**\n - **formResetCallback(): _void_** - Called by the browser when the surrounding <form> is reset. Clears the\r\npicker's selection so the control participates in the standard reset.\n\n\n\n\n\n\n\n- **showMessage(content: _string | HTMLElement_, opts: _MessageOptions_): _void_** - Surface a transient message (\"toast\") on top of the component — visible even in the\r\nfullscreen overlay, where page-level UI is hidden behind the sheet. Content is text or\r\nan element; `opts.variant` sets the tone and `opts.duration` the auto-dismiss (0 =\r\nsticky). Also reached automatically when a `beforeSelect`/`beforeDeselect` callback\r\nreturns a reason string.\n- **hideMessage(): _void_** - Dismiss the transient message shown by showMessage, if any.\n- **clearSearch(): _void_** - Clear the search box and restore the full option list (does not touch the selection — use\r\nclearAll for that). Pair with scrollToValue to reveal then scroll to an option\r\na search had filtered out: `el.clearSearch(); el.scrollToValue(v)`.\n- **search(term: _string_): _void_** - Programmatically set the search text and filter, as if the user typed it (runs\r\n`beforeSearchCallback` / `minSearchLength` / async `searchCallback`). Does not open the dropdown\r\n— call open if you want it visible. Pass `''` to clear (same as clearSearch).\n- **scrollToIndex(index: _number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option at `index` (into the current filtered list). Returns\r\nfalse if closed or out of range. Deferred internally so `el.open(); el.scrollToIndex(i)` works.\n- **scrollToValue(value: _string | number_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll the open dropdown to the option with this `value`. Returns false if it isn't in the\r\ncurrently visible list (filtered out by search, or under a collapsed tree branch) — call\r\nclearSearch / expand first.\n- **scrollToGroup(name: _string_, opts: _{ block?: ScrollLogicalPosition }_): _boolean_** - Scroll to a group: its header in standard rendering, or the group's first option in\r\nvirtual-scroll mode (no headers there). Returns false in tree mode or if the group is empty\r\nin the current filtered list.\n- **open(): _void_** - Open the dropdown.\n- **close(): _void_** - Close the dropdown.\n- **toggle(): _void_** - Toggle the dropdown open/closed.\n\n### **CSS Properties:**\n - **--ms-rem** - Base sizing unit for proportional scaling (default: 10px) _(default: undefined)_\n- **--ms-accent-color** - Primary accent color _(default: undefined)_\n- **--ms-accent-color-hover** - Accent color on hover _(default: undefined)_\n- **--ms-accent-color-active** - Accent color when pressed _(default: undefined)_\n- **--ms-accent-color-light** - Light accent background _(default: undefined)_\n- **--ms-accent-color-light-hover** - Light accent hover _(default: undefined)_\n- **--ms-text-color-1** - Primary text color _(default: undefined)_\n- **--ms-text-color-2** - Secondary text color _(default: undefined)_\n- **--ms-text-color-3** - Tertiary text color _(default: undefined)_\n- **--ms-text-color-4** - Quaternary text color _(default: undefined)_\n- **--ms-text-color-on-accent** - Text on accent backgrounds _(default: undefined)_\n- **--ms-text-primary** - Legacy alias for text-color-1 _(default: undefined)_\n- **--ms-text-secondary** - Legacy alias for text-color-3 _(default: undefined)_\n- **--ms-primary-bg** - Hover/focus background (options, action buttons, counter); reads --base-hover-bg _(default: undefined)_\n- **--ms-primary-bg-hover** - Active/stronger background (counter badge text); reads --base-active-bg _(default: undefined)_\n- **--ms-border-color** - Default border color _(default: undefined)_\n- **--ms-border** - Full border shorthand _(default: undefined)_\n- **--ms-input-bg** - Input field background _(default: undefined)_\n- **--ms-input-color** - Input text color _(default: undefined)_\n- **--ms-input-border** - Input border _(default: undefined)_\n- **--ms-input-border-hover** - Input border on hover _(default: undefined)_\n- **--ms-input-border-focus** - Input border when focused _(default: undefined)_\n- **--ms-input-placeholder-color** - Placeholder text color _(default: undefined)_\n- **--ms-input-bg-disabled** - Disabled input background _(default: undefined)_\n- **--ms-input-height** - Input height _(default: undefined)_\n- **--ms-input-font-size** - Input font size _(default: undefined)_\n- **--ms-input-border-width** - Input border width _(default: undefined)_\n- **--ms-input-border-radius** - Input border radius _(default: undefined)_\n- **--ms-input-text** - Input text color _(default: undefined)_\n- **--ms-toggle-color** - Toggle icon color _(default: undefined)_\n- **--ms-toggle-icon-color** - Toggle icon color (semantic) _(default: undefined)_\n- **--ms-toggle-icon-color-open** - Toggle icon color when open _(default: undefined)_\n- **--ms-counter-padding** - Counter badge padding _(default: undefined)_\n- **--ms-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-counter-color** - Counter badge text color _(default: undefined)_\n- **--ms-counter-font-size** - Counter badge font size _(default: undefined)_\n- **--ms-counter-font-weight** - Counter badge font weight _(default: undefined)_\n- **--ms-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-counter-bg-hover** - Counter badge hover background _(default: undefined)_\n- **--ms-counter-badge-bg** - Counter badge semantic background _(default: undefined)_\n- **--ms-counter-badge-bg-hover** - Counter badge semantic hover _(default: undefined)_\n- **--ms-counter-badge-color** - Counter badge semantic color _(default: undefined)_\n- **--ms-hint-padding** - Floating hint padding _(default: undefined)_\n- **--ms-hint-border** - Floating hint border _(default: undefined)_\n- **--ms-hint-border-radius** - Floating hint border radius _(default: undefined)_\n- **--ms-hint-box-shadow** - Floating hint shadow _(default: undefined)_\n- **--ms-hint-font-size** - Floating hint font size _(default: undefined)_\n- **--ms-hint-bg** - Floating hint background _(default: undefined)_\n- **--ms-hint-color** - Floating hint text color _(default: undefined)_\n- **--ms-hint-border-color** - Floating hint border color _(default: undefined)_\n- **--ms-dropdown-bg** - Dropdown background _(default: undefined)_\n- **--ms-dropdown-text-color** - Dropdown text color _(default: undefined)_\n- **--ms-dropdown-border** - Dropdown border _(default: undefined)_\n- **--ms-dropdown-border-color** - Dropdown border color _(default: undefined)_\n- **--ms-dropdown-border-radius** - Dropdown border radius _(default: undefined)_\n- **--ms-dropdown-box-shadow** - Dropdown shadow _(default: undefined)_\n- **--ms-dropdown-box-shadow-semantic** - Dropdown semantic shadow _(default: undefined)_\n- **--ms-dropdown-width** - Options dropdown width (defaults to the input width; also set via the dropdown-width attribute) _(default: undefined)_\n- **--ms-options-max-height** - Options list max height _(default: undefined)_\n- **--ms-z-index-dropdown** - Dropdown z-index _(default: undefined)_\n- **--ms-z-index-sticky** - Sticky elements z-index _(default: undefined)_\n- **--ms-actions-gap** - Actions row gap _(default: undefined)_\n- **--ms-actions-padding** - Actions row padding _(default: undefined)_\n- **--ms-actions-border-bottom** - Actions row border _(default: undefined)_\n- **--ms-actions-bg** - Actions row background _(default: undefined)_\n- **--ms-actions-border-color** - Actions row border color _(default: undefined)_\n- **--ms-action-btn-padding** - Action button padding _(default: undefined)_\n- **--ms-action-btn-font-size** - Action button font size _(default: undefined)_\n- **--ms-action-btn-border** - Action button border _(default: undefined)_\n- **--ms-action-btn-border-radius** - Action button border radius _(default: undefined)_\n- **--ms-action-btn-bg** - Action button background _(default: undefined)_\n- **--ms-action-btn-color** - Action button color _(default: undefined)_\n- **--ms-action-btn-bg-hover** - Action button hover background _(default: undefined)_\n- **--ms-action-btn-border-color-hover** - Action button hover border _(default: undefined)_\n- **--ms-action-button-bg** - Semantic action button background _(default: undefined)_\n- **--ms-action-button-bg-hover** - Semantic action button hover _(default: undefined)_\n- **--ms-action-button-border-color** - Semantic action button border _(default: undefined)_\n- **--ms-action-button-border-color-hover** - Semantic action button hover border _(default: undefined)_\n- **--ms-action-button-color** - Semantic action button color _(default: undefined)_\n- **--ms-options-padding** - Options container padding _(default: undefined)_\n- **--ms-group-border-top** - Group border top _(default: undefined)_\n- **--ms-group-margin-top** - Group margin top _(default: undefined)_\n- **--ms-group-padding-top** - Group padding top _(default: undefined)_\n- **--ms-group-border-color** - Group border color _(default: undefined)_\n- **--ms-group-label-padding** - Group label padding _(default: undefined)_\n- **--ms-group-label-font-size** - Group label font size _(default: undefined)_\n- **--ms-group-label-font-weight** - Group label font weight _(default: undefined)_\n- **--ms-group-label-color** - Group label color _(default: undefined)_\n- **--ms-group-label-transform** - Group label text transform _(default: undefined)_\n- **--ms-group-label-letter-spacing** - Group label letter spacing _(default: undefined)_\n- **--ms-option-gap** - Option content gap _(default: undefined)_\n- **--ms-option-padding** - Option padding _(default: undefined)_\n- **--ms-option-padding-h** - Option horizontal padding _(default: undefined)_\n- **--ms-option-color** - Option text color _(default: undefined)_\n- **--ms-option-bg** - Option background _(default: undefined)_\n- **--ms-option-bg-hover** - Option hover background _(default: undefined)_\n- **--ms-option-bg-focused** - Option focused background _(default: undefined)_\n- **--ms-option-outline-focused** - Option focus outline _(default: undefined)_\n- **--ms-option-focus-outline-offset** - Option focus outline offset _(default: undefined)_\n- **--ms-option-bg-matched** - Matched option background _(default: undefined)_\n- **--ms-option-border-matched** - Matched option border _(default: undefined)_\n- **--ms-option-bg-selected** - Selected option background _(default: undefined)_\n- **--ms-option-text-color** - Option text color (semantic) _(default: undefined)_\n- **--ms-option-color-hover** - Option hover color _(default: undefined)_\n- **--ms-option-color-focused** - Option focused color _(default: undefined)_\n- **--ms-option-outline-color-focused** - Option focus outline color _(default: undefined)_\n- **--ms-option-color-matched** - Matched option color _(default: undefined)_\n- **--ms-option-border-matched-color** - Matched option border color _(default: undefined)_\n- **--ms-option-bg-focused-hover** - Focused option hover background _(default: undefined)_\n- **--ms-option-bg-matched-hover** - Matched option hover background _(default: undefined)_\n- **--ms-option-bg-selected-focused** - Selected focused background _(default: undefined)_\n- **--ms-option-bg-selected-matched** - Selected matched background _(default: undefined)_\n- **--ms-option-disabled-bg** - Disabled option background _(default: undefined)_\n- **--ms-option-bg-disabled-selected** - Disabled selected background _(default: undefined)_\n- **--ms-disabled-opacity** - Disabled option opacity _(default: undefined)_\n- **--ms-option-content-gap** - Option content gap _(default: undefined)_\n- **--ms-option-icon-size** - Option icon size _(default: undefined)_\n- **--ms-option-icon-font-size** - Option icon font size _(default: undefined)_\n- **--ms-option-title-font-size** - Option title font size _(default: undefined)_\n- **--ms-option-title-color** - Option title color _(default: undefined)_\n- **--ms-option-subtitle-margin-top** - Option subtitle margin _(default: undefined)_\n- **--ms-option-subtitle-font-size** - Option subtitle font size _(default: undefined)_\n- **--ms-option-subtitle-line-height** - Option subtitle line height _(default: undefined)_\n- **--ms-option-subtitle-color** - Option subtitle color _(default: undefined)_\n- **--ms-option-mark-bg** - Search match highlight background _(default: undefined)_\n- **--ms-option-mark-color** - Search match highlight color _(default: undefined)_\n- **--ms-option-mark-font-weight** - Search match highlight weight _(default: undefined)_\n- **--ms-checkbox-margin-top** - Checkbox margin top _(default: undefined)_\n- **--ms-checkbox-margin-right** - Checkbox margin right _(default: undefined)_\n- **--ms-checkbox-margin-bottom** - Checkbox margin bottom _(default: undefined)_\n- **--ms-checkbox-margin-left** - Checkbox margin left _(default: undefined)_\n- **--ms-checkbox-size** - Checkbox size _(default: undefined)_\n- **--ms-checkbox-scale** - Checkbox scale _(default: undefined)_\n- **--ms-checkbox-align** - Checkbox alignment _(default: undefined)_\n- **--ms-checkbox-bg** - Checkbox background _(default: undefined)_\n- **--ms-checkbox-border** - Checkbox border _(default: undefined)_\n- **--ms-checkbox-border-radius** - Checkbox border radius _(default: undefined)_\n- **--ms-checkbox-checked-bg** - Checked checkbox background _(default: undefined)_\n- **--ms-checkbox-checked-border** - Checked checkbox border _(default: undefined)_\n- **--ms-checkbox-checkmark-color** - Checkmark color _(default: undefined)_\n- **--ms-checkbox-hover-border-color** - Checkbox hover border _(default: undefined)_\n- **--ms-checkbox-disabled-bg** - Disabled checkbox background _(default: undefined)_\n- **--ms-checkbox-disabled-border** - Disabled checkbox border _(default: undefined)_\n- **--ms-checkbox-checked-bg-hover** - Checked checkbox hover background _(default: undefined)_\n- **--ms-checkbox-checked-border-color-hover** - Checked checkbox hover border _(default: undefined)_\n- **--ms-state-min-height** - Shared min-height for the empty and loading states so the dropdown doesn't resize when swapping between them _(default: undefined)_\n- **--ms-empty-padding** - Empty state padding _(default: undefined)_\n- **--ms-empty-font-size** - Empty state font size _(default: undefined)_\n- **--ms-empty-color** - Empty state text color _(default: undefined)_\n- **--ms-loader-padding** - Loader padding _(default: undefined)_\n- **--ms-loader-gap** - Loader gap _(default: undefined)_\n- **--ms-loading-text-font-size** - Loading text font size _(default: undefined)_\n- **--ms-loading-text-color** - Loading text color _(default: undefined)_\n- **--ms-loading-color** - Loading color (semantic) _(default: undefined)_\n- **--ms-badges-gap** - Badges container gap _(default: undefined)_\n- **--ms-badges-margin-bottom** - Badges margin bottom _(default: undefined)_\n- **--ms-badges-margin-top** - Badges margin top _(default: undefined)_\n- **--ms-badges-margin-left** - Badges margin left _(default: undefined)_\n- **--ms-badges-margin-right** - Badges margin right _(default: undefined)_\n- **--ms-badge-gap** - Badge internal gap _(default: undefined)_\n- **--ms-badge-height** - Badge height _(default: undefined)_\n- **--ms-badge-font-size** - Badge font size _(default: undefined)_\n- **--ms-badge-font-weight** - Badge font weight _(default: undefined)_\n- **--ms-badge-border-radius** - Badge border radius _(default: undefined)_\n- **--ms-badge-bg** - Badge background _(default: undefined)_\n- **--ms-badge-bg-hover** - Badge hover background _(default: undefined)_\n- **--ms-badge-bg-active** - Badge active background _(default: undefined)_\n- **--ms-badge-text-padding** - Badge text padding _(default: undefined)_\n- **--ms-badge-text-bg** - Badge text background _(default: undefined)_\n- **--ms-badge-text-color** - Badge text color _(default: undefined)_\n- **--ms-badge-text-border** - Badge text border _(default: undefined)_\n- **--ms-badge-text-bg-hover** - Badge text hover background _(default: undefined)_\n- **--ms-badge-text-color-hover** - Badge text hover color _(default: undefined)_\n- **--ms-badge-remove-width** - Badge remove button width _(default: undefined)_\n- **--ms-badge-remove-bg** - Badge remove button background _(default: undefined)_\n- **--ms-badge-remove-color** - Badge remove button color _(default: undefined)_\n- **--ms-badge-remove-border** - Badge remove button border _(default: undefined)_\n- **--ms-badge-remove-font-size** - Badge remove button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-badge-remove-icon-size** - Badge remove X icon size (mask SVG) _(default: undefined)_\n- **--ms-badge-remove-bg-hover** - Badge remove button hover background _(default: undefined)_\n- **--ms-badge-remove-box-shadow-focus** - Badge remove button focus shadow _(default: undefined)_\n- **--ms-icon-remove** - Remove icon as CSS url() to a mask-friendly SVG; color comes from currentColor _(default: undefined)_\n- **--ms-icon-filter** - Funnel glyph (fullscreen search-mode toggle); chains to --base-icon-filter _(default: undefined)_\n- **--ms-icon-check** - Checkmark glyph (mask) for a checked checkbox/option; chains to --base-icon-check _(default: undefined)_\n- **--ms-icon-indeterminate** - Dash glyph (mask) for a tri-state/partial checkbox; chains to --base-icon-indeterminate _(default: undefined)_\n- **--ms-badge-counter-bg** - Counter badge background _(default: undefined)_\n- **--ms-badge-counter-border** - Counter badge border _(default: undefined)_\n- **--ms-badge-counter-border-color** - Counter badge border color _(default: undefined)_\n- **--ms-badge-counter-border-radius** - Counter badge border radius _(default: undefined)_\n- **--ms-badge-counter-text-color** - Counter badge text color _(default: undefined)_\n- **--ms-badge-counter-text-bg** - Counter badge text background _(default: undefined)_\n- **--ms-badge-counter-remove-bg** - Counter badge remove background _(default: undefined)_\n- **--ms-badge-counter-remove-color** - Counter badge remove color _(default: undefined)_\n- **--ms-badge-counter-remove-bg-hover** - Counter badge remove hover background _(default: undefined)_\n- **--ms-more-badge-bg** - More badge background _(default: undefined)_\n- **--ms-more-badge-hover-bg** - More badge hover background _(default: undefined)_\n- **--ms-more-badge-active-bg** - More badge active background _(default: undefined)_\n- **--ms-count-display-margin-bottom** - Count display margin bottom _(default: undefined)_\n- **--ms-count-display-margin-top** - Count display margin top _(default: undefined)_\n- **--ms-count-display-margin-left** - Count display margin left _(default: undefined)_\n- **--ms-count-display-margin-right** - Count display margin right _(default: undefined)_\n- **--ms-counter-wrapper-bg** - Counter wrapper background _(default: undefined)_\n- **--ms-counter-wrapper-border** - Counter wrapper border _(default: undefined)_\n- **--ms-counter-wrapper-border-radius** - Counter wrapper border radius _(default: undefined)_\n- **--ms-counter-wrapper-padding** - Counter wrapper padding _(default: undefined)_\n- **--ms-counter-wrapper-gap** - Counter wrapper gap _(default: undefined)_\n- **--ms-counter-wrapper-bg-hover** - Counter wrapper hover background _(default: undefined)_\n- **--ms-counter-wrapper-border-color** - Counter wrapper border color _(default: undefined)_\n- **--ms-counter-wrapper-border-color-hover** - Counter wrapper hover border _(default: undefined)_\n- **--ms-count-text-bg** - Count text background _(default: undefined)_\n- **--ms-count-text-border** - Count text border _(default: undefined)_\n- **--ms-count-text-font-size** - Count text font size _(default: undefined)_\n- **--ms-count-text-color** - Count text color _(default: undefined)_\n- **--ms-count-clear-size** - Count clear button size _(default: undefined)_\n- **--ms-count-clear-bg** - Count clear button background _(default: undefined)_\n- **--ms-count-clear-color** - Count clear button color _(default: undefined)_\n- **--ms-count-clear-font-size** - Count clear button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-count-clear-icon-size** - Count clear X icon size (mask SVG) _(default: undefined)_\n- **--ms-count-clear-border-radius** - Count clear button border radius _(default: undefined)_\n- **--ms-count-clear-bg-hover** - Count clear button hover background _(default: undefined)_\n- **--ms-count-clear-color-hover** - Count clear button hover color _(default: undefined)_\n- **--ms-icon-clear** - Clear icon as CSS url() to a mask-friendly SVG; defaults to var(--ms-icon-remove) _(default: undefined)_\n- **--ms-tooltip-bg** - Tooltip background _(default: undefined)_\n- **--ms-tooltip-text-color** - Tooltip text color _(default: undefined)_\n- **--ms-tooltip-color** - Tooltip color _(default: undefined)_\n- **--ms-tooltip-padding** - Tooltip padding _(default: undefined)_\n- **--ms-tooltip-border-radius** - Tooltip border radius _(default: undefined)_\n- **--ms-tooltip-font-size** - Tooltip font size _(default: undefined)_\n- **--ms-tooltip-max-width** - Tooltip max width _(default: undefined)_\n- **--ms-tooltip-shadow** - Tooltip shadow _(default: undefined)_\n- **--ms-tooltip-z-index** - Tooltip z-index _(default: undefined)_\n- **--ms-z-index-popover** - Popover z-index _(default: undefined)_\n- **--ms-selected-popover-width** - Selected popover width _(default: undefined)_\n- **--ms-selected-popover-max-height** - Selected popover max height _(default: undefined)_\n- **--ms-selected-popover-border** - Selected popover border _(default: undefined)_\n- **--ms-selected-popover-border-radius** - Selected popover border radius _(default: undefined)_\n- **--ms-selected-popover-box-shadow** - Selected popover shadow _(default: undefined)_\n- **--ms-selected-popover-bg** - Selected popover background _(default: undefined)_\n- **--ms-selected-popover-border-color** - Selected popover border color _(default: undefined)_\n- **--ms-selected-popover-header-padding** - Popover header padding _(default: undefined)_\n- **--ms-selected-popover-header-bg** - Popover header background _(default: undefined)_\n- **--ms-selected-popover-header-border-bottom** - Popover header border _(default: undefined)_\n- **--ms-selected-popover-header-font-size** - Popover header font size _(default: undefined)_\n- **--ms-selected-popover-header-font-weight** - Popover header font weight _(default: undefined)_\n- **--ms-selected-popover-header-color** - Popover header color _(default: undefined)_\n- **--ms-selected-popover-header-border-color** - Popover header border color _(default: undefined)_\n- **--ms-popover-close-size** - Popover close button size _(default: undefined)_\n- **--ms-selected-popover-close-bg** - Popover close button background _(default: undefined)_\n- **--ms-selected-popover-close-color** - Popover close button color _(default: undefined)_\n- **--ms-selected-popover-close-font-size** - Popover close button font size (unused since 1.10.0 — kept for backward-compat) _(default: undefined)_\n- **--ms-selected-popover-close-icon-size** - Popover close X icon size (mask SVG) _(default: undefined)_\n- **--ms-selected-popover-close-border-radius** - Popover close button border radius _(default: undefined)_\n- **--ms-selected-popover-close-bg-hover** - Popover close button hover background _(default: undefined)_\n- **--ms-selected-popover-close-color-hover** - Popover close button hover color _(default: undefined)_\n- **--ms-selected-popover-body-gap** - Popover body gap _(default: undefined)_\n- **--ms-selected-popover-body-padding** - Popover body padding _(default: undefined)_\n- **--ms-selected-popover-body-max-height** - Popover body max height _(default: undefined)_\n- **--ms-font-size-2xs** - Extra extra small font size _(default: undefined)_\n- **--ms-font-size-xs** - Extra small font size _(default: undefined)_\n- **--ms-font-size-sm** - Small font size _(default: undefined)_\n- **--ms-font-size-base** - Base font size _(default: undefined)_\n- **--ms-font-size-lg** - Large font size _(default: undefined)_\n- **--ms-font-weight-normal** - Normal font weight _(default: undefined)_\n- **--ms-font-weight-medium** - Medium font weight _(default: undefined)_\n- **--ms-font-weight-semibold** - Semibold font weight _(default: undefined)_\n- **--ms-line-height-none** - No line height (1) _(default: undefined)_\n- **--ms-line-height-tight** - Tight line height _(default: undefined)_\n- **--ms-line-height-normal** - Normal line height _(default: undefined)_\n- **--ms-line-height-relaxed** - Relaxed line height _(default: undefined)_\n- **--ms-border-radius-sm** - Small border radius _(default: undefined)_\n- **--ms-border-radius-md** - Medium border radius _(default: undefined)_\n- **--ms-border-radius-lg** - Large border radius _(default: undefined)_\n- **--ms-border-radius** - Default border radius _(default: undefined)_\n- **--ms-spacing-xs** - Extra small spacing _(default: undefined)_\n- **--ms-spacing-sm** - Small spacing _(default: undefined)_\n- **--ms-spacing-md** - Medium spacing _(default: undefined)_\n- **--ms-spacing-lg** - Large spacing _(default: undefined)_\n- **--ms-transition-fast** - Fast transition duration _(default: undefined)_\n- **--ms-transition-normal** - Normal transition duration _(default: undefined)_\n- **--ms-easing-snappy** - Snappy easing function _(default: undefined)_\n- **--ms-placeholder-opacity** - Placeholder opacity _(default: undefined)_\n- **--ms-disabled-input-opacity** - Disabled input opacity _(default: undefined)_\n- **--ms-scrollbar-width** - Scrollbar width _(default: undefined)_\n- **--ms-scrollbar-track-bg** - Scrollbar track background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg** - Scrollbar thumb background _(default: undefined)_\n- **--ms-scrollbar-thumb-bg-hover** - Scrollbar thumb hover background _(default: undefined)_\n- **--ms-scrollbar-thumb-border-radius** - Scrollbar thumb border radius _(default: undefined)_\n- **--ms-debug-bg** - Debug panel background _(default: undefined)_\n- **--ms-debug-border-color** - Debug panel border _(default: undefined)_\n- **--ms-debug-text-color** - Debug panel text _(default: undefined)_\n- **--ms-debug-border-radius** - Debug panel corner radius _(default: undefined)_\n- **--ms-debug-summary-color** - Debug section heading color _(default: undefined)_\n- **--ms-debug-summary-bg-hover** - Debug section heading hover background _(default: undefined)_\n- **--ms-debug-summary-outline-color** - Debug section heading focus outline _(default: undefined)_\n- **--ms-debug-summary-border-radius** - Debug section heading corner radius _(default: undefined)_\n- **--ms-debug-stats-bg** - Debug stats nested panel background _(default: undefined)_\n- **--ms-debug-stats-border-radius** - Debug stats nested panel corner radius _(default: undefined)_\n- **--ms-debug-bullet-color** - Debug stat bullet marker color _(default: undefined)_\n- **--ms-transform-rotate-180** - 180 degree rotation _(default: undefined)_\n- **--ms-transform-scale-hover** - Hover scale transform _(default: undefined)_\n- **--ms-transform-scale-active** - Active scale transform _(default: undefined)_\n- **--ms-order-first** - Order first (-1) _(default: undefined)_",
|
|
12
12
|
"doc-url": "",
|
|
13
13
|
"attributes": [
|
|
14
14
|
{
|
|
@@ -1213,11 +1213,6 @@
|
|
|
1213
1213
|
"name": "--ms-input-bg-disabled",
|
|
1214
1214
|
"description": "Disabled input background"
|
|
1215
1215
|
},
|
|
1216
|
-
{ "name": "--ms-input-padding", "description": "Input padding" },
|
|
1217
|
-
{
|
|
1218
|
-
"name": "--ms-input-padding-right",
|
|
1219
|
-
"description": "Input right padding (for toggle)"
|
|
1220
|
-
},
|
|
1221
1216
|
{ "name": "--ms-input-height", "description": "Input height" },
|
|
1222
1217
|
{ "name": "--ms-input-font-size", "description": "Input font size" },
|
|
1223
1218
|
{
|
|
@@ -1229,75 +1224,6 @@
|
|
|
1229
1224
|
"description": "Input border radius"
|
|
1230
1225
|
},
|
|
1231
1226
|
{ "name": "--ms-input-text", "description": "Input text color" },
|
|
1232
|
-
{ "name": "--ms-input-size-xs-font", "description": "XS size font" },
|
|
1233
|
-
{
|
|
1234
|
-
"name": "--ms-input-size-xs-padding-v",
|
|
1235
|
-
"description": "XS vertical padding"
|
|
1236
|
-
},
|
|
1237
|
-
{
|
|
1238
|
-
"name": "--ms-input-size-xs-padding-h",
|
|
1239
|
-
"description": "XS horizontal padding"
|
|
1240
|
-
},
|
|
1241
|
-
{
|
|
1242
|
-
"name": "--ms-input-size-xs-height",
|
|
1243
|
-
"description": "XS input height"
|
|
1244
|
-
},
|
|
1245
|
-
{ "name": "--ms-input-size-sm-font", "description": "SM size font" },
|
|
1246
|
-
{
|
|
1247
|
-
"name": "--ms-input-size-sm-padding-v",
|
|
1248
|
-
"description": "SM vertical padding"
|
|
1249
|
-
},
|
|
1250
|
-
{
|
|
1251
|
-
"name": "--ms-input-size-sm-padding-h",
|
|
1252
|
-
"description": "SM horizontal padding"
|
|
1253
|
-
},
|
|
1254
|
-
{
|
|
1255
|
-
"name": "--ms-input-size-sm-height",
|
|
1256
|
-
"description": "SM input height"
|
|
1257
|
-
},
|
|
1258
|
-
{ "name": "--ms-input-size-md-font", "description": "MD size font" },
|
|
1259
|
-
{
|
|
1260
|
-
"name": "--ms-input-size-md-padding-v",
|
|
1261
|
-
"description": "MD vertical padding"
|
|
1262
|
-
},
|
|
1263
|
-
{
|
|
1264
|
-
"name": "--ms-input-size-md-padding-h",
|
|
1265
|
-
"description": "MD horizontal padding"
|
|
1266
|
-
},
|
|
1267
|
-
{
|
|
1268
|
-
"name": "--ms-input-size-md-height",
|
|
1269
|
-
"description": "MD input height"
|
|
1270
|
-
},
|
|
1271
|
-
{ "name": "--ms-input-size-lg-font", "description": "LG size font" },
|
|
1272
|
-
{
|
|
1273
|
-
"name": "--ms-input-size-lg-padding-v",
|
|
1274
|
-
"description": "LG vertical padding"
|
|
1275
|
-
},
|
|
1276
|
-
{
|
|
1277
|
-
"name": "--ms-input-size-lg-padding-h",
|
|
1278
|
-
"description": "LG horizontal padding"
|
|
1279
|
-
},
|
|
1280
|
-
{
|
|
1281
|
-
"name": "--ms-input-size-lg-height",
|
|
1282
|
-
"description": "LG input height"
|
|
1283
|
-
},
|
|
1284
|
-
{ "name": "--ms-input-size-xl-font", "description": "XL size font" },
|
|
1285
|
-
{
|
|
1286
|
-
"name": "--ms-input-size-xl-padding-v",
|
|
1287
|
-
"description": "XL vertical padding"
|
|
1288
|
-
},
|
|
1289
|
-
{
|
|
1290
|
-
"name": "--ms-input-size-xl-padding-h",
|
|
1291
|
-
"description": "XL horizontal padding"
|
|
1292
|
-
},
|
|
1293
|
-
{
|
|
1294
|
-
"name": "--ms-input-size-xl-height",
|
|
1295
|
-
"description": "XL input height"
|
|
1296
|
-
},
|
|
1297
|
-
{
|
|
1298
|
-
"name": "--ms-toggle-right",
|
|
1299
|
-
"description": "Toggle icon right position"
|
|
1300
|
-
},
|
|
1301
1227
|
{ "name": "--ms-toggle-color", "description": "Toggle icon color" },
|
|
1302
1228
|
{
|
|
1303
1229
|
"name": "--ms-toggle-icon-color",
|
|
@@ -1307,10 +1233,6 @@
|
|
|
1307
1233
|
"name": "--ms-toggle-icon-color-open",
|
|
1308
1234
|
"description": "Toggle icon color when open"
|
|
1309
1235
|
},
|
|
1310
|
-
{
|
|
1311
|
-
"name": "--ms-counter-offset",
|
|
1312
|
-
"description": "Counter badge offset"
|
|
1313
|
-
},
|
|
1314
1236
|
{
|
|
1315
1237
|
"name": "--ms-counter-padding",
|
|
1316
1238
|
"description": "Counter badge padding"
|
|
@@ -2231,10 +2153,6 @@
|
|
|
2231
2153
|
"name": "--ms-debug-bullet-color",
|
|
2232
2154
|
"description": "Debug stat bullet marker color"
|
|
2233
2155
|
},
|
|
2234
|
-
{
|
|
2235
|
-
"name": "--ms-transform-center-y",
|
|
2236
|
-
"description": "Center Y transform"
|
|
2237
|
-
},
|
|
2238
2156
|
{
|
|
2239
2157
|
"name": "--ms-transform-rotate-180",
|
|
2240
2158
|
"description": "180 degree rotation"
|