@solid-design-system/components 6.25.2 → 6.26.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@solid-design-system/components",
-  "version": "6.25.2",
+  "version": "6.26.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -1263,7 +1263,7 @@
         },
         {
           "name": "sd-checkbox",
-          "description": "Checkboxes allow the user to toggle an option on or off.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the checkbox loses focus.\n- **sd-change** - Emitted when the checked state changes.\n- **sd-focus** - Emitted when the checkbox gains focus.\n- **sd-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **click()** - Simulates a click on the checkbox.\n- **focus(options: _FocusOptions_)** - Sets focus on the checkbox.\n- **blur()** - Removes focus from the checkbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns true when valid and false when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows a validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The checkbox's label.\n\n### **CSS Properties:**\n - **--sd-checkbox-border-width** - The border width of the checkbox. _(default: undefined)_\n- **--sd-form-control-color-border** - The color border for form controls. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the checkbox's checked state.\n- **control--checked** - Matches the control part when the checkbox is checked.\n- **control--indeterminate** - Matches the control part when the checkbox is indeterminate.\n- **checked-icon** - The checked icon, an `<sd-icon>` element.\n- **indeterminate-icon** - The indeterminate icon, an `<sd-icon>` element.\n- **label** - The container that wraps the checkbox's label.",
+          "description": "Checkboxes allow the user to toggle an option on or off.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the checkbox loses focus.\n- **sd-change** - Emitted when the checked state changes.\n- **sd-focus** - Emitted when the checkbox gains focus.\n- **sd-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **click()** - Simulates a click on the checkbox.\n- **focus(options: _FocusOptions_)** - Sets focus on the checkbox.\n- **blur()** - Removes focus from the checkbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns true when valid and false when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows a validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The checkbox's label.\n\n### **CSS Properties:**\n - **--sd-checkbox-border-width** - The border width of the checkbox. _(default: undefined)_\n- **--sd-checkbox--invalid-color-background** - The background color of the checkbox when invalid. _(default: undefined)_\n- **--sd-form-control-color-border** - The color border for form controls. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the checkbox's checked state.\n- **control--checked** - Matches the control part when the checkbox is checked.\n- **control--indeterminate** - Matches the control part when the checkbox is indeterminate.\n- **checked-icon** - The checked icon, an `<sd-icon>` element.\n- **indeterminate-icon** - The indeterminate icon, an `<sd-icon>` element.\n- **label** - The container that wraps the checkbox's label.",
           "doc-url": "",
           "attributes": [
             {
@@ -1534,7 +1534,7 @@
         },
         {
           "name": "sd-combobox",
-          "description": "Comboboxes allow you to choose items from a menu of predefined options.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the control's value changes.\n- **sd-clear** - Emitted when the control's value is cleared.\n- **sd-input** - Emitted when the control receives input.\n- **sd-search** - Emitted when the search button is activated.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-blur** - Emitted when the control loses focus.\n- **sd-show** - Emitted when the combobox's menu opens.\n- **sd-after-show** - Emitted after the combobox's menu opens and all animations are complete.\n- **sd-hide** - Emitted when the combobox's menu closes.\n- **sd-after-hide** - Emitted after the combobox's menu closes and all animations are complete.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **sd-error** - Emitted when the combobox menu fails to open.\n\n### **Methods:**\n - **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message.\nReturns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<sd-option>` elements. You can use `<sd-optgroup>`'s to group items visually.\n- **label** - The combobox's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the combobox. Alternatively, you can use the `help-text` attribute.\n- **left** - Used to prepend a presentational icon or similar element to the combobox.\n- **right** - Used to append a presentational icon or similar element to the combobox.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n\n### **CSS Properties:**\n - **--tag-max-width** - Set the maximum width of the tags and to show an ellipsis. Defaults to \"15ch\" _(default: undefined)_\n- **--sd-form-control--invalid-color-background** - The background color for form controls in invalid state. _(default: undefined)_\n- **--sd-form-control-color-text** - The text color for form controls. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for form controls. _(default: undefined)_\n- **--sd-form-control-color-border** - The border color for default and readonly form controls. _(default: undefined)_\n- **--sd-form-control--filled__floating-label-color-text** - The text color for the floating label when the input is filled. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-left-radius** - The border radius for the bottom left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-right-radius** - The border radius for the bottom right corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-left-radius** - The border radius for the top left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-right-radius** - The border radius for the top right corner of the listbox. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-combobox__tag-border-width** - The border width for the tags for multiple options combobox. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, combobox, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The combobox's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container that wraps the prefix, combobox, clear icon, and expand button.\n- **left** - The container that wraps the left icon slot.\n- **right** - The container that wraps the right icon slot.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where the options are slotted and the filtered options list exists.\n- **filtered-listbox** - The container that wraps the filtered options.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
+          "description": "Comboboxes allow you to choose items from a menu of predefined options.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the control's value changes.\n- **sd-clear** - Emitted when the control's value is cleared.\n- **sd-input** - Emitted when the control receives input.\n- **sd-search** - Emitted when the search button is activated.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-blur** - Emitted when the control loses focus.\n- **sd-show** - Emitted when the combobox's menu opens.\n- **sd-after-show** - Emitted after the combobox's menu opens and all animations are complete.\n- **sd-hide** - Emitted when the combobox's menu closes.\n- **sd-after-hide** - Emitted after the combobox's menu closes and all animations are complete.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **sd-error** - Emitted when the combobox menu fails to open.\n\n### **Methods:**\n - **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message.\nReturns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<sd-option>` elements. You can use `<sd-optgroup>`'s to group items visually.\n- **label** - The combobox's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the combobox. Alternatively, you can use the `help-text` attribute.\n- **left** - Used to prepend a presentational icon or similar element to the combobox.\n- **right** - Used to append a presentational icon or similar element to the combobox.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n\n### **CSS Properties:**\n - **--tag-max-width** - Set the maximum width of the tags and to show an ellipsis. Defaults to \"15ch\" _(default: undefined)_\n- **--sd-form-control--invalid-color-background** - The background color for form controls in invalid state. _(default: undefined)_\n- **--sd-form-control-color-text** - The text color for form controls. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for form controls. _(default: undefined)_\n- **--sd-form-control-color-border** - The border color for default and readonly form controls. _(default: undefined)_\n- **--sd-form-control--filled__floating-label-color-text** - The text color for the floating label when the input is filled. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-left-radius** - The border radius for the bottom left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-right-radius** - The border radius for the bottom right corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-left-radius** - The border radius for the top left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-right-radius** - The border radius for the top right corner of the listbox. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-combobox__tag-border-width** - The border width for the tags for multiple options combobox. _(default: undefined)_\n- **--sd-form-control-color-icon-fill** - The icons color for slots, chevron and search icons. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, combobox, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The combobox's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container that wraps the prefix, combobox, clear icon, and expand button.\n- **left** - The container that wraps the left icon slot.\n- **right** - The container that wraps the right icon slot.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where the options are slotted and the filtered options list exists.\n- **filtered-listbox** - The container that wraps the filtered options.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
           "doc-url": "",
           "attributes": [
             {
@@ -1963,7 +1963,7 @@
         },
         {
           "name": "sd-datepicker",
-          "description": "Used to enter or select a date or a range of dates using a calendar view.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the date selection changes.\n- **sd-range-select** - Emitted when the date range selection changes.\n- **sd-select** - Emitted when the date selection changes.\n- **sd-datepicker-close** - Emitted when the datepicker is closed.\n- **sd-focus** - Emitted when the datepicker is focused.\n- **sd-blur** - Emitted when the datepicker is blurred.\n- **sd-month-change** - Emitted when the month is changed.\n- **sd-month-year** - Emitted when the year is changed.\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The default slot.\n- **label** - The label for the date input.\n- **help-text** - The help text, displayed below the input.\n- **tooltip** - The tooltip icon and content.\n\n### **CSS Properties:**\n - **--sd-form-control-color-text** - The text color for the datepicker. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for the datepicker. _(default: undefined)_\n- **--sd-form-control-color-border** - The default border color for the datepicker. _(default: undefined)_\n- **--sd-form-control--filled__floating-label-color-text** - The text color for the floating label when the input is filled. _(default: undefined)_\n- **--sd-form-control--invalid-color-background** - The background color for the input when it is invalid. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-left-radius** - The border radius for the bottom left corner of the datepicker. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-right-radius** - The border radius for the bottom right corner of the datepicker. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-left-radius** - The border radius for the top left corner of the datepicker. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-right-radius** - The border radius for the top right corner of the datepicker. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-form-control--read-only-color-background** - The background color for read-only form controls. _(default: undefined)_\n- **--sd-datepicker__date-item--default-color-text** - The default text color for date items. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--default-color-background** - The background color for date items in hover state. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--default-color-text** - The text color for date items in hover state. _(default: undefined)_\n- **--sd-datepicker__date-item--default-color-border** - The default border color for date items. _(default: undefined)_\n- **--sd-datepicker__date-item--selected-color-text** - The text color for selected date items. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--prev-next-color-background** - The background color for date items in hover state when they are previous/next month days. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--prev-next-color-text** - The text color for date items in hover state when they are previous/next month days. _(default: undefined)_\n- **--sd-datepicker__date-item--current-font-weight** - The font weight for the current date item. _(default: undefined)_\n- **--sd-datepicker__date-item--selected-color-background** - The background color for selected date items. _(default: undefined)_\n- **--sd-datepicker__date-item--selected--hover-color-background** - The background color for selected date items in hover state. _(default: undefined)_\n- **--sd-datepicker__date-item--range-color-background** - The background color for date items that are within the selected range. _(default: undefined)_\n- **--sd-datepicker__date-item--current-color-text** - The text color for the current date item. _(default: undefined)_\n- **--sd-datepicker__date-item--selected--hover-color-text** - The text color for selected date items in hover state. _(default: undefined)_\n\n### **CSS Parts:**\n - **datepicker** - The component's base wrapper.\n- **header** - The header containing the month/year and navigation buttons.\n- **prev-year-button** - The button to go to the previous year.\n- **prev-month-button** - The button to go to the previous month.\n- **month-label** - The month and year label.\n- **next-month-button** - The button to go to the next month.\n- **next-year-button** - The button to go to the next year.\n- **grid** - The calendar grid container.\n- **weekday** - Each weekday label in the calendar header.\n- **day** - Each day button in the calendar grid.\n- **form-control** - The form control wrapper around the input.\n- **form-control-label** - The label for the input.\n- **form-control-input** - The input element.\n- **border** - The border around the input.\n- **invalid-icon** - The icon shown when the input is invalid.\n- **valid-icon** - The icon shown when the input is valid.\n- **form-control-help-text** - The help text, displayed below the input.",
+          "description": "Used to enter or select a date or a range of dates using a calendar view.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the date selection changes.\n- **sd-range-select** - Emitted when the date range selection changes.\n- **sd-select** - Emitted when the date selection changes.\n- **sd-datepicker-close** - Emitted when the datepicker is closed.\n- **sd-focus** - Emitted when the datepicker is focused.\n- **sd-blur** - Emitted when the datepicker is blurred.\n- **sd-month-change** - Emitted when the month is changed.\n- **sd-month-year** - Emitted when the year is changed.\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The default slot.\n- **label** - The label for the date input.\n- **help-text** - The help text, displayed below the input.\n- **tooltip** - The tooltip icon and content.\n\n### **CSS Properties:**\n - **--sd-form-control-color-text** - The text color for the datepicker. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for the datepicker. _(default: undefined)_\n- **--sd-form-control-color-border** - The default border color for the datepicker. _(default: undefined)_\n- **--sd-form-control--filled__floating-label-color-text** - The text color for the floating label when the input is filled. _(default: undefined)_\n- **--sd-form-control--invalid-color-background** - The background color for the input when it is invalid. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-left-radius** - The border radius for the bottom left corner of the datepicker. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-right-radius** - The border radius for the bottom right corner of the datepicker. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-left-radius** - The border radius for the top left corner of the datepicker. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-right-radius** - The border radius for the top right corner of the datepicker. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-form-control--read-only-color-background** - The background color for read-only form controls. _(default: undefined)_\n- **--sd-form-control-color-icon-fill** - The color for form control icons. _(default: undefined)_\n- **--sd-datepicker__date-item--default-color-text** - The default text color for date items. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--default-color-background** - The background color for date items in hover state. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--default-color-text** - The text color for date items in hover state. _(default: undefined)_\n- **--sd-datepicker__date-item--default-color-border** - The default border color for date items. _(default: undefined)_\n- **--sd-datepicker__date-item--selected-color-text** - The text color for selected date items. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--prev-next-color-background** - The background color for date items in hover state when they are previous/next month days. _(default: undefined)_\n- **--sd-datepicker__date-item--hover--prev-next-color-text** - The text color for date items in hover state when they are previous/next month days. _(default: undefined)_\n- **--sd-datepicker__date-item--current-font-weight** - The font weight for the current date item. _(default: undefined)_\n- **--sd-datepicker__date-item--selected-color-background** - The background color for selected date items. _(default: undefined)_\n- **--sd-datepicker__date-item--selected--hover-color-background** - The background color for selected date items in hover state. _(default: undefined)_\n- **--sd-datepicker__date-item--range-color-background** - The background color for date items that are within the selected range. _(default: undefined)_\n- **--sd-datepicker__date-item--current-color-text** - The text color for the current date item. _(default: undefined)_\n- **--sd-datepicker__date-item--selected--hover-color-text** - The text color for selected date items in hover state. _(default: undefined)_\n\n### **CSS Parts:**\n - **datepicker** - The component's base wrapper.\n- **header** - The header containing the month/year and navigation buttons.\n- **prev-year-button** - The button to go to the previous year.\n- **prev-month-button** - The button to go to the previous month.\n- **month-label** - The month and year label.\n- **next-month-button** - The button to go to the next month.\n- **next-year-button** - The button to go to the next year.\n- **grid** - The calendar grid container.\n- **weekday** - Each weekday label in the calendar header.\n- **day** - Each day button in the calendar grid.\n- **form-control** - The form control wrapper around the input.\n- **form-control-label** - The label for the input.\n- **form-control-input** - The input element.\n- **border** - The border around the input.\n- **invalid-icon** - The icon shown when the input is invalid.\n- **valid-icon** - The icon shown when the input is valid.\n- **form-control-help-text** - The help text, displayed below the input.",
           "doc-url": "",
           "attributes": [
             {
@@ -3348,7 +3348,7 @@
         },
         {
           "name": "sd-input",
-          "description": "Inputs collect data from the user.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the control loses focus.\n- **sd-change** - Emitted when an alteration to the control's value is committed by the user.\n- **sd-clear** - Emitted when the clear button is activated.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-input** - Emitted when the control receives input.\n- **sd-search** - Emitted when the search button is activated.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the input.\n- **blur()** - Removes focus from the input.\n- **select()** - Selects all the text in the input.\n- **setSelectionRange(selectionStart: _number_, selectionEnd: _number_, selectionDirection: _'forward' | 'backward' | 'none'_)** - Sets the start and end positions of the text selection (0-based).\n- **setRangeText(replacement: _string_, start: _number_, end: _number_, selectMode: _'select' | 'start' | 'end' | 'preserve'_)** - Replaces a range of text with a new string.\n- **showPicker()** - Displays the browser picker for an input element (only works if the browser supports it for the input type).\n- **stepUp()** - Increments the value of a numeric input type by the value of the step attribute.\n- **stepDown()** - Decrements the value of a numeric input type by the value of the step attribute.\n- **checkValidity()** - Checks for validity but does not show the browser's validation message.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **left** - Used to prepend a presentational icon or similar element to the input.\n- **right** - Used to append a presentational icon or similar element to the input.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **show-password-icon** - An icon to use in lieu of the default show password icon.\n- **hide-password-icon** - An icon to use in lieu of the default hide password icon.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **tooltip** - An optional tooltip that helps describe the input. Use this slot with the `sd-tooltip` component.\n\n### **CSS Properties:**\n - **--sd-form-control--invalid-color-background** - The background color for form controls in invalid state. _(default: undefined)_\n- **--sd-form-control-color-text** - The text color for form controls. _(default: undefined)_\n- **--sd-form-control--filled__floating-label-color-text** - The floating label text color when active. _(default: undefined)_\n- **--sd-form-control-color-border** - The color border for form controls. _(default: undefined)_\n- **--sd-form-control-color-icon-fill** - The icon color for form controls. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for form controls. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-form-control--read-only-color-background** - The background color read-only for form controls. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **form-control-floating-label** - The floating label text's wrapper.\n- **base** - The component's base wrapper.\n- **border** - The base part's absolutely positioned border. Allows for easy adjustment of border thickness without affecting component dimensions.\n- **input** - The internal `<input>` control.\n- **left** - The container that wraps the left.\n- **clear-button** - The clear button.\n- **password-toggle-button** - The password toggle button.\n- **right** - The container that wraps the right.\n- **invalid-icon** - The invalid icon.\n- **valid-icon** - The valid icon.\n- **invalid-message** - The invalid message.",
+          "description": "Inputs collect data from the user.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the control loses focus.\n- **sd-change** - Emitted when an alteration to the control's value is committed by the user.\n- **sd-clear** - Emitted when the clear button is activated.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-input** - Emitted when the control receives input.\n- **sd-search** - Emitted when the search button is activated.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the input.\n- **blur()** - Removes focus from the input.\n- **select()** - Selects all the text in the input.\n- **setSelectionRange(selectionStart: _number_, selectionEnd: _number_, selectionDirection: _'forward' | 'backward' | 'none'_)** - Sets the start and end positions of the text selection (0-based).\n- **setRangeText(replacement: _string_, start: _number_, end: _number_, selectMode: _'select' | 'start' | 'end' | 'preserve'_)** - Replaces a range of text with a new string.\n- **showPicker()** - Displays the browser picker for an input element (only works if the browser supports it for the input type).\n- **stepUp()** - Increments the value of a numeric input type by the value of the step attribute.\n- **stepDown()** - Decrements the value of a numeric input type by the value of the step attribute.\n- **checkValidity()** - Checks for validity but does not show the browser's validation message.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **left** - Used to prepend a presentational icon or similar element to the input.\n- **right** - Used to append a presentational icon or similar element to the input.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **show-password-icon** - An icon to use in lieu of the default show password icon.\n- **hide-password-icon** - An icon to use in lieu of the default hide password icon.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **tooltip** - An optional tooltip that helps describe the input. Use this slot with the `sd-tooltip` component.\n\n### **CSS Properties:**\n - **--sd-form-control--invalid-color-background** - The background color for form controls in invalid state. _(default: undefined)_\n- **--sd-form-control-color-text** - The text color for form controls. _(default: undefined)_\n- **--sd-form-control--filled__floating-label-color-text** - The floating label text color when active. _(default: undefined)_\n- **--sd-form-control-color-border** - The color border for form controls. _(default: undefined)_\n- **--sd-form-control-color-icon-fill** - The icon color for form controls. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for form controls. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-form-control--read-only-color-background** - The background color read-only for form controls. _(default: undefined)_\n- **--sd-form-control-color-icon-fill** - The color for form control icons. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **form-control-floating-label** - The floating label text's wrapper.\n- **base** - The component's base wrapper.\n- **border** - The base part's absolutely positioned border. Allows for easy adjustment of border thickness without affecting component dimensions.\n- **input** - The internal `<input>` control.\n- **left** - The container that wraps the left.\n- **clear-button** - The clear button.\n- **password-toggle-button** - The password toggle button.\n- **right** - The container that wraps the right.\n- **invalid-icon** - The invalid icon.\n- **valid-icon** - The valid icon.\n- **invalid-message** - The invalid message.",
           "doc-url": "",
           "attributes": [
             {
@@ -4251,7 +4251,7 @@
         },
         {
           "name": "sd-navigation-item",
-          "description": "Flexible button / link component that can be used to quickly build navigations. Takes one of 3 forms: link (overrides all other if 'href' is provided), button (default), or accordion (if 'children' slot defined).\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the navigation item has has children, no href, and is clicked while HTML details are hidden.\n- **sd-hide** - Emitted when the navigation item has has children, no href, and is clicked while HTML details are shown.\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The navigation item's label.\n- **description** - *Vertical only: Slot used to provide a description for the navigation item.\n- **children** - Slot used to provide nested child navigation elements. If provided, details and summary elements will be used. A chevron will be shown on the right side regardless of the chevron property.\n\n### **CSS Properties:**\n - **--sd-navigation-item-color-text** - The navigation-item text color. _(default: undefined)_\n- **--sd-navigable-border-radius** - The navigation-item border radius on hover and active state. _(default: undefined)_\n- **--sd-navigable-font-size** - The navigation-item font size. _(default: undefined)_\n- **--sd-navigable__current-indicator-border-radius** - The navigation-item current indicator border radius value. _(default: undefined)_\n- **--sd-navigable__current-indicator-height** - The horizontal navigation-item current indicator height. _(default: undefined)_\n- **--sd-navigable__current-indicator-width** - The vertical navigation-item current indicator width. _(default: undefined)_\n- **--sd-choice-control-font-weight** - The navigation-item default font weight. _(default: undefined)_\n- **--sd-navigation-item--current-color-text** - This custom property is deprecated. Use `--sd-navigation-item-color-text` instead. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper including children.\n- **content-wrapper** - The component's content wrapper.\n- **content** - The component's content excluding children.\n- **chevron** - The container that wraps the chevron.\n- **description** - The component's description area below its main content.\n- **divider** - The component's optional top divider.",
+          "description": "Flexible button / link component that can be used to quickly build navigations. Takes one of 3 forms: link (overrides all other if 'href' is provided), button (default), or accordion (if 'children' slot defined).\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the navigation item has has children, no href, and is clicked while HTML details are hidden.\n- **sd-hide** - Emitted when the navigation item has has children, no href, and is clicked while HTML details are shown.\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The navigation item's label.\n- **description** - *Vertical only: Slot used to provide a description for the navigation item.\n- **children** - Slot used to provide nested child navigation elements. If provided, details and summary elements will be used. A chevron will be shown on the right side regardless of the chevron property.\n\n### **CSS Properties:**\n - **--sd-navigation-item-color-text** - The navigation-item text color. _(default: undefined)_\n- **--sd-navigation-item--default-color-text** - The default navigation-items text color. _(default: undefined)_\n- **--sd-navigable-border-radius** - The navigation-item border radius on hover and active state. _(default: undefined)_\n- **--sd-navigable-font-size** - The navigation-item font size. _(default: undefined)_\n- **--sd-navigable__current-indicator-border-radius** - The navigation-item current indicator border radius value. _(default: undefined)_\n- **--sd-navigable__current-indicator-height** - The horizontal navigation-item current indicator height. _(default: undefined)_\n- **--sd-navigable__current-indicator-width** - The vertical navigation-item current indicator width. _(default: undefined)_\n- **--sd-choice-control-font-weight** - The navigation-item default font weight. _(default: undefined)_\n- **--sd-navigation-item--current-color-text** - This custom property is deprecated. Use `--sd-navigation-item-color-text` instead. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper including children.\n- **content-wrapper** - The component's content wrapper.\n- **content** - The component's content excluding children.\n- **chevron** - The container that wraps the chevron.\n- **description** - The component's description area below its main content.\n- **divider** - The component's optional top divider.",
           "doc-url": "",
           "attributes": [
             {
@@ -6035,7 +6035,7 @@
         },
         {
           "name": "sd-select",
-          "description": "Selects allow you to choose items from a menu of predefined options.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the control's value changes.\n- **sd-clear** - Emitted when the control's value is cleared.\n- **sd-input** - Emitted when the control receives input.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-blur** - Emitted when the control loses focus.\n- **sd-show** - Emitted when the select's menu opens.\n- **sd-after-show** - Emitted after the select's menu opens and all animations are complete.\n- **sd-hide** - Emitted when the select's menu closes.\n- **sd-after-hide** - Emitted after the select's menu closes and all animations are complete.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<sd-option>` elements. You can use `<sd-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n- **tooltip** - An optional tooltip that helps describe the input. Use this slot with the `sd-tooltip` component.\n\n### **CSS Properties:**\n - **--tag-max-width** - Set the maximum width of the tags and to show an ellipsis. Defaults to \"15ch\" _(default: undefined)_\n- **--sd-form-control--invalid-color-background** - The background color for form controls in invalid state. _(default: undefined)_\n- **--sd-form-control-color-text** - The text color for form controls. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for the select's input. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-left-radius** - The border radius for the bottom left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-right-radius** - The border radius for the bottom right corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-left-radius** - The border radius for the top left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-right-radius** - The border radius for the top right corner of the listbox. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the combobox, clear icon, and expand button.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **tags** - The container that houses option tags when `multiselect` is used.\n- **tag** - The individual tags that represent each multiselect option.\n- **tag__base** - The tag's base part.\n- **tag__content** - The tag's content part.\n- **tag__removable-indicator** - The tag's remove button.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
+          "description": "Selects allow you to choose items from a menu of predefined options.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the control's value changes.\n- **sd-clear** - Emitted when the control's value is cleared.\n- **sd-input** - Emitted when the control receives input.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-blur** - Emitted when the control loses focus.\n- **sd-show** - Emitted when the select's menu opens.\n- **sd-after-show** - Emitted after the select's menu opens and all animations are complete.\n- **sd-hide** - Emitted when the select's menu closes.\n- **sd-after-hide** - Emitted after the select's menu closes and all animations are complete.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<sd-option>` elements. You can use `<sd-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n- **tooltip** - An optional tooltip that helps describe the input. Use this slot with the `sd-tooltip` component.\n\n### **CSS Properties:**\n - **--tag-max-width** - Set the maximum width of the tags and to show an ellipsis. Defaults to \"15ch\" _(default: undefined)_\n- **--sd-form-control--invalid-color-background** - The background color for form controls in invalid state. _(default: undefined)_\n- **--sd-form-control-color-text** - The text color for form controls. _(default: undefined)_\n- **--sd-form-control-border-radius** - The border radius for the select's input. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-left-radius** - The border radius for the bottom left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-bottom-right-radius** - The border radius for the bottom right corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-left-radius** - The border radius for the top left corner of the listbox. _(default: undefined)_\n- **--sd-form-control__listbox-border-top-right-radius** - The border radius for the top right corner of the listbox. _(default: undefined)_\n- **--sd-form-control--hover-color-background** - The background color for form controls on hover. _(default: undefined)_\n- **--sd-form-control-color-icon-fill** - The color for form control icons. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the combobox, clear icon, and expand button.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **tags** - The container that houses option tags when `multiselect` is used.\n- **tag** - The individual tags that represent each multiselect option.\n- **tag__base** - The tag's base part.\n- **tag__content** - The tag's content part.\n- **tag__removable-indicator** - The tag's remove button.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
           "doc-url": "",
           "attributes": [
             {
@@ -7149,7 +7149,7 @@
         },
         {
           "name": "sd-tag",
-          "description": "Tags are used as labels to organize things or to indicate a selection.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the tag loses focus.\n- **sd-focus** - Emitted when the tag gains focus.\n- **sd-remove** - Emitted when the remove button is activated.\n- **sd-hide** - Emitted when the hide method is triggered.\n- **sd-after-hide** - Emitted after the tag is hidden and all animations are complete.\n\n### **Methods:**\n - **click()** - Simulates a click on the tag.\n- **focus(options: _FocusOptions_)** - Sets focus on the tag.\n- **blur()** - Removes focus from the tag.\n- **hide()** - Visually hides the tag\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The tag's content.\n- **icon-left** - A prefix icon or similar element.\n- **removable-indicator** - The tag's removability indicator.\n\n### **CSS Properties:**\n - **--sd-tag--default-color-text** - The default text color for tags in their default state. _(default: undefined)_\n- **--sd-tag--default-color-background** - The default color background for tags in their default state. _(default: undefined)_\n- **--sd-tag--default-color-border** - The default color border for tags in their default state. _(default: undefined)_\n- **--sd-tag--default--hover-color-background** - The background color for tags in default state on hover. _(default: undefined)_\n- **--sd-tag--selected--default-color-background** - The default background color for selected tags. _(default: undefined)_\n- **--sd-tag--selected--default-color-text** - The default text color for selected tags. _(default: undefined)_\n- **--sd-tag--selected--default-color-border** - The border color for selected tags in default state. _(default: undefined)_\n- **--sd-tag--selected--hover-color-background** - The background color for selected tags in hover state. _(default: undefined)_\n- **--sd-tag--selected--hover-color-border** - The border color for selected tags in hover state. _(default: undefined)_\n- **--sd-tag--selected--hover-color-text** - The text color for selected tags in hover state. _(default: undefined)_\n- **--sd-tag--selected-border-width** - The border width for selected tags. _(default: undefined)_\n- **--sd-tag-border-radius** - The border radius for tags. _(default: undefined)_\n- **--sd-tag--size-lg-font-size** - The font size for large tags. _(default: undefined)_\n- **--sd-tag--size-sm-font-size** - The font size for small tags. _(default: undefined)_\n- **--sd-choice-control-font-weight** - The font weight for tags. _(default: undefined)_\n- **--sd-tag--disabled-color-text** - The text color for disabled tags. _(default: undefined)_\n- **--sd-tag--disabled-color-border** - This custom property is deprecated. Use `--sd-color-border-neutral-500` instead. _(default: undefined)_\n- **--sd-tag-font-weight** - This custom property is deprecated. Use `--sd-choice-control-font-weight` instead. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **content** - The tag's content.\n- **removable-indicator** - The tag's removability indicator.\n- **icon-left** - The container that wraps the left icon area.",
+          "description": "Tags are used as labels to organize things or to indicate a selection.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the tag loses focus.\n- **sd-focus** - Emitted when the tag gains focus.\n- **sd-remove** - Emitted when the remove button is activated.\n- **sd-hide** - Emitted when the hide method is triggered.\n- **sd-after-hide** - Emitted after the tag is hidden and all animations are complete.\n\n### **Methods:**\n - **click()** - Simulates a click on the tag.\n- **focus(options: _FocusOptions_)** - Sets focus on the tag.\n- **blur()** - Removes focus from the tag.\n- **hide()** - Visually hides the tag\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - The tag's content.\n- **icon-left** - A prefix icon or similar element.\n- **removable-indicator** - The tag's removability indicator.\n\n### **CSS Properties:**\n - **--sd-tag--default-color-text** - The default text color for tags in their default state. _(default: undefined)_\n- **--sd-tag--default-color-background** - The default color background for tags in their default state. _(default: undefined)_\n- **--sd-tag--default-color-border** - The default color border for tags in their default state. _(default: undefined)_\n- **--sd-tag--default--hover-color-background** - The background color for tags in default state on hover. _(default: undefined)_\n- **--sd-tag--selected--default-color-background** - The default background color for selected tags. _(default: undefined)_\n- **--sd-tag--selected--default-color-text** - The default text color for selected tags. _(default: undefined)_\n- **--sd-tag--selected--default-color-border** - The border color for selected tags in default state. _(default: undefined)_\n- **--sd-tag--selected--hover-color-background** - The background color for selected tags in hover state. _(default: undefined)_\n- **--sd-tag--selected--hover-color-border** - The border color for selected tags in hover state. _(default: undefined)_\n- **--sd-tag--selected--hover-color-text** - The text color for selected tags in hover state. _(default: undefined)_\n- **--sd-tag--selected-border-width** - The border width for selected tags. _(default: undefined)_\n- **--sd-tag-border-radius** - The border radius for tags. _(default: undefined)_\n- **--sd-tag--size-lg-font-size** - The font size for large tags. _(default: undefined)_\n- **--sd-tag--size-sm-font-size** - The font size for small tags. _(default: undefined)_\n- **--sd-choice-control-font-weight** - The font weight for tags. _(default: undefined)_\n- **--sd-tag--disabled-color-text** - The text color for disabled tags. _(default: undefined)_\n- **--sd-tag--size-lg-padding-inline** - The padding inline for large tags. _(default: undefined)_\n- **--sd-tag--size-sm-padding-inline** - The padding inline for small tags. _(default: undefined)_\n- **--sd-tag--removable--size-lg-padding-right** - The padding right for large removable tags. _(default: undefined)_\n- **--sd-tag--removable--size-lg-padding-left** - The padding left for large removable tags. _(default: undefined)_\n- **--sd-tag--removable--size-sm-padding-right** - The padding right for small removable tags. _(default: undefined)_\n- **--sd-tag--removable--size-sm-padding-left** - The padding left for small removable tags. _(default: undefined)_\n- **--sd-tag--disabled-color-border** - This custom property is deprecated. Use `--sd-color-border-neutral-500` instead. _(default: undefined)_\n- **--sd-tag-font-weight** - This custom property is deprecated. Use `--sd-choice-control-font-weight` instead. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **content** - The tag's content.\n- **removable-indicator** - The tag's removability indicator.\n- **icon-left** - The container that wraps the left icon area.",
           "doc-url": "",
           "attributes": [
             {
@@ -7397,7 +7397,7 @@
         },
         {
           "name": "sd-teaser-media",
-          "description": "Teasers group information into flexible containers so users can browse a collection of related items and actions.\n---\n\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - An optional main content slot.\n- **media** - An optional media slot.\n- **meta** - An optional meta slot.\n- **expandable** - An optional expandable slot, <strong>not</strong> shown on small devices.\n- **headline** - headline slot.\n\n### **CSS Properties:**\n - **--sd-teaser-media--white--hover-color-background** - The background color for white teaser media in hover state. _(default: undefined)_\n- **--sd-teaser-media--white-color-background** - The default background color for white teaser media. _(default: undefined)_\n- **--sd-teaser-media--neutral-100--hover-color-background** - The background color for neutral‑100 teaser media in hover state. _(default: undefined)_\n- **--sd-teaser-media--neutral-100-color-background** - The default background color for neutral‑100 teaser media. _(default: undefined)_\n- **--sd-teaser-media--primary-100--hover-color-background** - The background color for primary‑100 teaser media in hover state. _(default: undefined)_\n- **--sd-teaser-media--primary-100-color-background** - The default background color for primary‑100 teaser media. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **media** - The container that wraps the media.\n- **content** - The container that wraps the content.\n- **meta** -  The container that wraps the meta.\n- **headline** - The container that wraps the headline.\n- **expandable** - The container that wraps the expandable.\n- **main** - The container that wraps the main content.\n- **toggle** - The button that toggles the expandable content.",
+          "description": "Teasers group information into flexible containers so users can browse a collection of related items and actions.\n---\n\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - _default_ - An optional main content slot.\n- **media** - An optional media slot.\n- **meta** - An optional meta slot.\n- **expandable** - An optional expandable slot, <strong>not</strong> shown on small devices.\n- **headline** - headline slot.\n\n### **CSS Properties:**\n - **--sd-teaser-media--white--hover-color-background** - The background color for white teaser media in hover state. _(default: undefined)_\n- **--sd-teaser-media--white-color-background** - The default background color for white teaser media. _(default: undefined)_\n- **--sd-teaser-media--neutral-100--hover-color-background** - The background color for neutral‑100 teaser media in hover state. _(default: undefined)_\n- **--sd-teaser-media--neutral-100-color-background** - The default background color for neutral‑100 teaser media. _(default: undefined)_\n- **--sd-teaser-media--primary-100--hover-color-background** - The background color for primary‑100 teaser media in hover state. _(default: undefined)_\n- **--sd-teaser-media--primary-100-color-background** - The default background color for primary‑100 teaser media. _(default: undefined)_\n- **--sd-teaser-media-color-icon-fill** - The default color for the icon in the toggle button. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **media** - The container that wraps the media.\n- **content** - The container that wraps the content.\n- **meta** -  The container that wraps the meta.\n- **headline** - The container that wraps the headline.\n- **expandable** - The container that wraps the expandable.\n- **main** - The container that wraps the main content.\n- **toggle** - The button that toggles the expandable content.",
           "doc-url": "",
           "attributes": [
             {

package/dist-versioned/chunks/{chunk.QYHWWFR7.js → chunk.22QJOKRT.js}

@@ -14,7 +14,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.QSF3ZD6P.js";
+} from "./chunk.PGR6OZIM.js";
 import {
   animateTo,
   shimKeyframesHeightAuto,
@@ -94,7 +94,7 @@ var SdExpandable = class extends SolidElement {
     )}" @click="${this.onToggleClick}" aria-expanded="${this.open}"><div class="${cx("h-full justify-center w-full text-base flex items-center toggle")}"><span part="toggle-icon" class="${cx(
       "flex items-center mr-2 transition-transform duration-medium ease-in-out",
       this.open && "rotate-180"
-    )}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-25-2-icon library="_internal" name="chevron-down" class="text-xl"></sd-6-25-2-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-25-2-icon library="_internal" name="chevron-down" class="text-xl"></sd-6-25-2-icon></slot></span><slot name="toggle-closed" class="${cx(this.open && "hidden")}">${this.localize.term("showMore")}</slot><slot name="toggle-open" class="${cx(!this.open && "hidden")}">${this.localize.term("showLess")}</slot></div></button><details part="details" ?inert="${ifDefined(!this.open)}"><summary part="summary" aria-hidden="true" class="cursor-pointer overflow-hidden list-none"><slot name="clone"></slot></summary><div part="content" class="content content-preview overflow-hidden relative"><slot></slot></div></details></div>`;
+    )}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-26-0-icon library="_internal" name="chevron-down" class="text-xl"></sd-6-26-0-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-26-0-icon library="_internal" name="chevron-down" class="text-xl"></sd-6-26-0-icon></slot></span><slot name="toggle-closed" class="${cx(this.open && "hidden")}">${this.localize.term("showMore")}</slot><slot name="toggle-open" class="${cx(!this.open && "hidden")}">${this.localize.term("showLess")}</slot></div></button><details part="details" ?inert="${ifDefined(!this.open)}"><summary part="summary" aria-hidden="true" class="cursor-pointer overflow-hidden list-none"><slot name="clone"></slot></summary><div part="content" class="content content-preview overflow-hidden relative"><slot></slot></div></details></div>`;
   }
   firstUpdated() {
     this.cloneContentToLightDOM();
@@ -139,7 +139,7 @@ __decorateClass([
   watch("open", { waitUntilFirstUpdate: true })
 ], SdExpandable.prototype, "onOpenChange", 1);
 SdExpandable = __decorateClass([
-  customElement("sd-6-25-2-expandable")
+  customElement("sd-6-26-0-expandable")
 ], SdExpandable);
 setDefaultAnimation("expandable.show", {
   keyframes: [{ height: "var(--component-expandable-max-block-size, 90px)" }, { height: "auto" }],

package/dist-versioned/chunks/{chunk.NGP3FNYQ.js → chunk.2GY5X74S.js}

@@ -26,7 +26,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.QSF3ZD6P.js";
+} from "./chunk.PGR6OZIM.js";
 import {
   animateTo,
   stopAnimations
@@ -77,11 +77,11 @@ var SdSelect = class extends SolidElement {
     this.styleOnValid = false;
     this.hoist = false;
     this.getTag = (option) => {
-      return html`<sd-6-25-2-tag class="relative z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
+      return html`<sd-6-26-0-tag class="relative z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
               base:tag__base,
               content:tag__content,
               removable-indicator:tag__removable-indicator,
-            " size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-25-2-tag>`;
+            " size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagKeyDown(event, option)}" @sd-remove="${(event) => this.handleTagRemove(event, option)}">${option.getTextLabel()}</sd-6-26-0-tag>`;
     };
     this.handleDocumentFocusIn = (event) => {
       const path = event.composedPath();
@@ -92,7 +92,7 @@ var SdSelect = class extends SolidElement {
     this.handleDocumentKeyDown = (event) => {
       const target = event.target;
       const isClearButton = target.closest(".select__clear") !== null;
-      const isIconButton = target.closest("sd-6-25-2-icon-button") !== null;
+      const isIconButton = target.closest("sd-6-26-0-icon-button") !== null;
       if (isClearButton || isIconButton) {
         return;
       }
@@ -227,8 +227,8 @@ var SdSelect = class extends SolidElement {
       event.preventDefault();
       event.stopPropagation();
       const tagParent = (_a = event.currentTarget) == null ? void 0 : _a.parentElement;
-      const previousTag = (_b = tagParent == null ? void 0 : tagParent.previousElementSibling) == null ? void 0 : _b.querySelector("sd-6-25-2-tag");
-      const nextTag = (_c = tagParent == null ? void 0 : tagParent.nextElementSibling) == null ? void 0 : _c.querySelector("sd-6-25-2-tag");
+      const previousTag = (_b = tagParent == null ? void 0 : tagParent.previousElementSibling) == null ? void 0 : _b.querySelector("sd-6-26-0-tag");
+      const nextTag = (_c = tagParent == null ? void 0 : tagParent.nextElementSibling) == null ? void 0 : _c.querySelector("sd-6-26-0-tag");
       this.handleTagRemove(new CustomEvent("sd-remove"), option);
       this.updateComplete.then(() => {
         if (nextTag) {
@@ -248,7 +248,7 @@ var SdSelect = class extends SolidElement {
       this.handleTagRemove(new CustomEvent("sd-remove"), this.selectedOptions[this.selectedOptions.length - 1]);
       this.updateComplete.then(() => {
         var _a;
-        const tags = (_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("sd-6-25-2-tag");
+        const tags = (_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("sd-6-26-0-tag");
         if (tags && tags.length > 0) {
           tags == null ? void 0 : tags[(tags == null ? void 0 : tags.length) - 1].focus();
         } else {
@@ -294,7 +294,7 @@ var SdSelect = class extends SolidElement {
   }
   handleOptionClick(event) {
     const target = event.target;
-    const option = target.closest("sd-6-25-2-option");
+    const option = target.closest("sd-6-26-0-option");
     const oldValue = this.value;
     if (option && !option.disabled) {
       if (this.multiple) {
@@ -319,7 +319,7 @@ var SdSelect = class extends SolidElement {
     const allOptions = this.getAllOptions();
     const value = Array.isArray(this.value) ? this.value : [this.value];
     const values = [];
-    if (customElements.get("sd-6-25-2-option")) {
+    if (customElements.get("sd-6-26-0-option")) {
       allOptions.forEach((option) => {
         if (this.multiple) {
           option.checkbox = true;
@@ -328,7 +328,7 @@ var SdSelect = class extends SolidElement {
       });
       this.setSelectedOptions(allOptions.filter((el) => value.includes(el.value)));
     } else {
-      customElements.whenDefined("sd-6-25-2-option").then(() => this.handleDefaultSlotChange());
+      customElements.whenDefined("sd-6-26-0-option").then(() => this.handleDefaultSlotChange());
     }
   }
   handleTagRemove(event, option) {
@@ -345,13 +345,13 @@ var SdSelect = class extends SolidElement {
       });
     }
   }
-  // Gets an array of all <sd-6-25-2-option> elements
+  // Gets an array of all <sd-6-26-0-option> elements
   getAllOptions() {
-    return [...this.querySelectorAll("sd-6-25-2-option")];
+    return [...this.querySelectorAll("sd-6-26-0-option")];
   }
-  // Gets the first <sd-6-25-2-option> element
+  // Gets the first <sd-6-26-0-option> element
   getFirstOption() {
-    return this.querySelector("sd-6-25-2-option");
+    return this.querySelector("sd-6-26-0-option");
   }
   // Sets the current option, which is the option the user is currently interacting with (e.g. via keyboard). Only one
   // option may be "current" at a time.
@@ -450,11 +450,11 @@ var SdSelect = class extends SolidElement {
       });
     } else {
       return [
-        html`<sd-6-25-2-tag class="z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
+        html`<sd-6-26-0-tag class="z-10 min-w-0 max-w-full" ?disabled="${this.disabled}" part="tag" exportparts="
               base:tag__base,
               content:tag__content,
               removable-indicator:tag__removable-indicator,
-            " size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-25-2-tag>`
+            " size="${this.size === "sm" ? "sm" : "lg"}" removable @keydown="${(event) => this.handleTagMaxOptionsKeyDown(event)}" @sd-remove="${(event) => this.handleTagRemove(event)}">${this.selectedOptions.length} ${this.localize.term("tagsSelected")}</sd-6-26-0-tag>`
       ];
     }
   }
@@ -463,7 +463,7 @@ var SdSelect = class extends SolidElement {
     this.formControlController.emitInvalidEvent(event);
     this.invalidMessage.textContent = event.target.validationMessage;
   }
-  /** Receives incoming event detail from sd-6-25-2-popup and updates local state for conditional styling. */
+  /** Receives incoming event detail from sd-6-26-0-popup and updates local state for conditional styling. */
   handleCurrentPlacement(e) {
     const incomingPlacement = e.detail;
     if (incomingPlacement) {
@@ -472,7 +472,7 @@ var SdSelect = class extends SolidElement {
   }
   handleUseTagsChange() {
     const allOptions = this.getAllOptions();
-    if (customElements.get("sd-6-25-2-option")) {
+    if (customElements.get("sd-6-26-0-option")) {
       allOptions.forEach((option) => {
         option.checkbox = this.multiple;
       });
@@ -629,7 +629,7 @@ var SdSelect = class extends SolidElement {
         default: "form-control-color-border"
       }[selectState],
       this.open && (this.currentPlacement === "bottom" ? "rounded-bl-none rounded-br-none" : "rounded-tl-none rounded-tr-none")
-    )}"></div><sd-6-25-2-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
+    )}"></div><sd-6-26-0-popup @sd-current-placement="${this.handleCurrentPlacement}" class="${cx(
       "inline-flex relative w-full",
       this.currentPlacement === "bottom" ? "origin-top" : "origin-bottom"
     )}" placement="${this.placement}" strategy="${this.hoist ? "fixed" : "absolute"}" flip sync="width" auto-size="vertical" auto-size-padding="10" exportparts="
@@ -656,12 +656,12 @@ var SdSelect = class extends SolidElement {
       "select__clear flex justify-center",
       iconMarginLeft,
       this.value.length > 0 ? "visible" : "hidden"
-    )}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-25-2-icon class="${cx("text-neutral-700 z-10", iconSize)}" library="_internal" name="closing-round"></sd-6-25-2-icon></slot></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-25-2-icon part="invalid-icon" class="${cx(iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-6-25-2-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-25-2-icon part="valid-icon" class="${cx("flex-shrink-0 text-success", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle"></sd-6-25-2-icon>` : ""}<slot name="expand-icon" part="expand-icon" class="${cx(
+    )}" type="button" aria-label="${this.localize.term("clearEntry")}" @mousedown="${this.handleClearMouseDown}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-26-0-icon class="${cx("text-neutral-700 z-10", iconSize)}" library="_internal" name="closing-round"></sd-6-26-0-icon></slot></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-26-0-icon part="invalid-icon" class="${cx(iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-6-26-0-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-26-0-icon part="valid-icon" class="${cx("flex-shrink-0 text-success", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle"></sd-6-26-0-icon>` : ""}<slot name="expand-icon" part="expand-icon" class="${cx(
       "inline-flex ml-2 items-center transition-transform duration-medium ease-in-out",
       this.open ? "rotate-180" : "rotate-0",
       this.disabled || this.visuallyDisabled ? "text-neutral-500" : "icon-color",
       iconSize
-    )}"><sd-6-25-2-icon name="chevron-down" part="chevron" library="_internal" color="currentColor"></sd-6-25-2-icon></slot></div><button part="combobox" class="${cx(
+    )}"><sd-6-26-0-icon name="chevron-down" part="chevron" library="_internal" color="currentColor"></sd-6-26-0-icon></slot></div><button part="combobox" class="${cx(
       "relative w-full px-4 flex flex-row items-center rounded-default focus-visible:outline-none",
       cursorStyles,
       this.open && "shadow transition-shadow duration-medium ease-in-out",
@@ -674,7 +674,7 @@ var SdSelect = class extends SolidElement {
       "bg-white px-2 py-3 relative border-primary overflow-y-auto",
       this.open && "shadow-listbox transition-shadow duration-medium ease-in-out",
       this.currentPlacement === "bottom" ? "border-r-2 border-b-2 border-l-2 form-control__listbox-border-bottom-right-radius form-control__listbox-border-bottom-left-radius" : "border-r-2 border-t-2 border-l-2 form-control__listbox-border-top-right-radius form-control__listbox-border-top-left-radius"
-    )}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-6-25-2-popup></div><div class="${cx("text-sm mt-1", this.visuallyDisabled || this.disabled ? "text-neutral-500" : "text-neutral-700")}" part="form-control-help-text" id="help-text" aria-hidden="${hasHelpText ? "false" : "true"}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage(this.size)}`;
+    )}" tabindex="-1" @mouseup="${this.handleOptionClick}" @slotchange="${this.handleDefaultSlotChange}"><slot></slot></div></sd-6-26-0-popup></div><div class="${cx("text-sm mt-1", this.visuallyDisabled || this.disabled ? "text-neutral-500" : "text-neutral-700")}" part="form-control-help-text" id="help-text" aria-hidden="${hasHelpText ? "false" : "true"}"><slot name="help-text">${this.helpText}</slot></div></div>${this.formControlController.renderInvalidMessage(this.size)}`;
   }
 };
 /**
@@ -683,13 +683,13 @@ var SdSelect = class extends SolidElement {
 SdSelect.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{position:relative;display:block;width:auto}[part=invalid-icon]{color:rgb(var(--sd-color-icon-fill-error,--sd-color-error))}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-6-25-2-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-6-25-2-tag::part(base){border-radius:var(--sd-radius);padding-inline:var(--sd-spacing-1)}sd-6-25-2-tag::part(content){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--tag-max-width,15ch)}sd-6-25-2-tag[size=lg]::part(base){padding-inline:var(--sd-spacing-2)}sd-6-25-2-tag[disabled=false]::part(base):hover{background-color:rgba(var(--sd-color-background-primary-100))}.icon-color{color:rgb(var(--sd-color-icon-fill-primary))}`
+:host{position:relative;display:block;width:auto}[part=invalid-icon]{color:rgb(var(--sd-color-icon-fill-error,--sd-color-error))}:host([required]) #label::after{content:' *'}:host([disabled]) ::-moz-placeholder,:host([visually-disabled]) ::-moz-placeholder{color:rgba(var(--sd-color-text-neutral-500))}:host([disabled]) ::placeholder,:host([visually-disabled]) ::placeholder{color:rgba(var(--sd-color-text-neutral-500))}[part=listbox]{max-height:var(--auto-size-available-height,auto)}.input-container,[part=combobox]{grid-column:1/1;grid-row:1/1}sd-6-26-0-popup::part(popup){z-index:var(--sd-z-index-dropdown,900)}sd-6-26-0-tag::part(base){border-radius:var(--sd-radius);padding-inline:var(--sd-spacing-1)}sd-6-26-0-tag::part(content){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:var(--tag-max-width,15ch)}sd-6-26-0-tag[size=lg]::part(base){padding-inline:var(--sd-spacing-2)}sd-6-26-0-tag[disabled=false]::part(base):hover{background-color:rgba(var(--sd-color-background-primary-100))}.icon-color{color:rgb(var(--sd-form-control-color-icon-fill))}`
 ];
 __decorateClass([
-  queryAssignedElements({ selector: "sd-6-25-2-option" })
+  queryAssignedElements({ selector: "sd-6-26-0-option" })
 ], SdSelect.prototype, "_optionsInDefaultSlot", 2);
 __decorateClass([
-  query("sd-6-25-2-popup")
+  query("sd-6-26-0-popup")
 ], SdSelect.prototype, "popup", 2);
 __decorateClass([
   query('[part="combobox"]')
@@ -817,7 +817,7 @@ __decorateClass([
   watch(["size", "floatingLabel"])
 ], SdSelect.prototype, "handleSizeChange", 1);
 SdSelect = __decorateClass([
-  customElement("sd-6-25-2-select")
+  customElement("sd-6-26-0-select")
 ], SdSelect);
 setDefaultAnimation("select.show", {
   keyframes: [{ opacity: 0 }, { opacity: 1 }],

package/dist-versioned/chunks/{chunk.RALBWDZA.js → chunk.2JVBNRAE.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.QSF3ZD6P.js";
+} from "./chunk.PGR6OZIM.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -58,16 +58,16 @@ var SdMapMarker = class extends SolidElement {
       this.variant === "cluster" && this.state === "hover" && "scale-110",
       this.variant === "cluster" && !this.notInteractive && "transition-transform duration-fast ease-in-out hover:scale-110",
       {
-        cluster: "sd-6-25-2-map-marker--cluster-color-text",
+        cluster: "sd-6-26-0-map-marker--cluster-color-text",
         main: "sd-color-fill-accent",
-        place: "sd-6-25-2-map-marker--pin-color-text"
+        place: "sd-6-26-0-map-marker--pin-color-text"
       }[this.variant]
     )}"><div id="motion-wrapper" part="motion-wrapper" class="${cx(
       "absolute inset-0 overflow-hidden pointer-events-none",
       {
-        cluster: "sd-6-25-2-map-marker--cluster--default-color-background group-hover:sd-6-25-2-map-marker--cluster--hover-color-background",
-        main: "sd-6-25-2-map-marker--main-color-background",
-        place: "sd-6-25-2-map-marker--pin--default-color-background"
+        cluster: "sd-6-26-0-map-marker--cluster--default-color-background group-hover:sd-6-26-0-map-marker--cluster--hover-color-background",
+        main: "sd-6-26-0-map-marker--main-color-background",
+        place: "sd-6-26-0-map-marker--pin--default-color-background"
       }[this.variant]
     )}" style="mask-image:${mask};-webkit-mask-image:${mask}"><div class="${cx(
       "absolute inset-0 transition-transform ease-in-out duration-fast translate-y-full group-hover:translate-y-0 group-active:translate-y-0",
@@ -77,15 +77,15 @@ var SdMapMarker = class extends SolidElement {
       {
         cluster: "",
         main: this.state === "active" ? "bg-accent-700" : this.state === "hover" ? "bg-accent-550" : "group-hover:bg-accent-550 group-active:bg-accent-700",
-        place: this.state === "active" || this.state === "hover" ? "sd-6-25-2-map-marker--pin--hover-color-background" : "group-active:bg-primary-200"
+        place: this.state === "active" || this.state === "hover" ? "sd-6-26-0-map-marker--pin--hover-color-background" : "group-active:bg-primary-200"
       }[this.variant]
     )}"></div></div>${this.variant === "main" ? html`<div id="marker-circle" class="absolute rounded-full"></div>` : ""}</div>${marker} ${this.variant === "cluster" ? html`<div id="cluster-border" class="${cx(
-      "absolute inset-0 sd-6-25-2-map-marker--cluster--default-color-background rounded-full opacity-30 hover:sd-6-25-2-map-marker--cluster--hover-color-background",
-      this.state === "hover" && "sd-6-25-2-map-marker--cluster--hover-color-background"
+      "absolute inset-0 sd-6-26-0-map-marker--cluster--default-color-background rounded-full opacity-30 hover:sd-6-26-0-map-marker--cluster--hover-color-background",
+      this.state === "hover" && "sd-6-26-0-map-marker--cluster--hover-color-background"
     )}"></div>` : ""}</div><div id="content" part="content" class="${cx(
       "absolute self-center pointer-events-none",
-      this.variant === "cluster" && "font-bold sd-6-25-2-map-marker--cluster-color-text",
-      this.variant === "place" && "font-bold sd-6-25-2-map-marker--pin-color-text"
+      this.variant === "cluster" && "font-bold sd-6-26-0-map-marker--cluster-color-text",
+      this.variant === "place" && "font-bold sd-6-26-0-map-marker--pin-color-text"
     )}"><slot></slot></div></${tag}>`;
   }
 };
@@ -119,7 +119,7 @@ __decorateClass([
   property({ reflect: true })
 ], SdMapMarker.prototype, "label", 2);
 SdMapMarker = __decorateClass([
-  customElement("sd-6-25-2-map-marker")
+  customElement("sd-6-26-0-map-marker")
 ], SdMapMarker);
 
 export {

package/dist-versioned/chunks/{chunk.Q3TX3XDZ.js → chunk.2QLV3FGQ.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.QSF3ZD6P.js";
+} from "./chunk.PGR6OZIM.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -53,7 +53,7 @@ SdThemeListener.styles = [
 :host{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}`
 ];
 SdThemeListener = __decorateClass([
-  customElement("sd-6-25-2-theme-listener")
+  customElement("sd-6-26-0-theme-listener")
 ], SdThemeListener);
 
 export {