@kdcloudjs/shoelace 1.0.0 → 1.0.1

package/dist/custom-elements.json

@@ -2141,12 +2141,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/calendar/calendar.js",
-      "declarations": [],
-      "exports": []
-    },
     {
       "kind": "javascript-module",
       "path": "components/button-group/button-group.js",
@@ -2387,6 +2381,12 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/calendar/calendar.js",
+      "declarations": [],
+      "exports": []
+    },
     {
       "kind": "javascript-module",
       "path": "components/carousel-item/carousel-item.js",
@@ -5106,6 +5106,7 @@
               "type": {
                 "text": "number | string"
               },
+              "default": "'0001-01-01'",
               "description": "The input's minimum value. Only applies to date and number input types.",
               "attribute": "min"
             },
@@ -5115,6 +5116,7 @@
               "type": {
                 "text": "number | string"
               },
+              "default": "'9999-12-31'",
               "description": "The input's maximum value. Only applies to date and number input types.",
               "attribute": "max"
             },
@@ -5131,6 +5133,25 @@
               "kind": "method",
               "name": "handleOpenChange"
             },
+            {
+              "kind": "method",
+              "name": "focus",
+              "parameters": [
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "FocusOptions"
+                  }
+                }
+              ],
+              "description": "Sets focus on the datepicker."
+            },
+            {
+              "kind": "method",
+              "name": "blur",
+              "description": "Removes focus from the datepicker."
+            },
             {
               "kind": "method",
               "name": "checkValidity",
@@ -5253,6 +5274,16 @@
                 }
               ]
             },
+            {
+              "kind": "method",
+              "name": "openCalendar",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleSuffixClick",
+              "privacy": "private"
+            },
             {
               "kind": "method",
               "name": "handleInputChange",
@@ -5292,6 +5323,19 @@
                 }
               ]
             },
+            {
+              "kind": "method",
+              "name": "checkInputValueValid",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "date",
+                  "type": {
+                    "text": "Date | null"
+                  }
+                }
+              ]
+            },
             {
               "kind": "method",
               "name": "handleInputBlur",
@@ -5441,6 +5485,7 @@
               "type": {
                 "text": "number | string"
               },
+              "default": "'0001-01-01'",
               "description": "The input's minimum value. Only applies to date and number input types.",
               "fieldName": "min"
             },
@@ -5449,6 +5494,7 @@
               "type": {
                 "text": "number | string"
               },
+              "default": "'9999-12-31'",
               "description": "The input's maximum value. Only applies to date and number input types.",
               "fieldName": "max"
             },
@@ -6172,38 +6218,88 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/dropdown/dropdown.js",
+      "path": "components/drawer/drawer.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlDropdown",
+          "name": "SlDrawer",
+          "cssProperties": [
+            {
+              "description": "The preferred size of the drawer. This will be applied to the drawer's width or height depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.",
+              "name": "--size"
+            },
+            {
+              "description": "The amount of padding to use for the header.",
+              "name": "--header-spacing"
+            },
+            {
+              "description": "The amount of padding to use for the body.",
+              "name": "--body-spacing"
+            },
+            {
+              "description": "The amount of padding to use for the footer.",
+              "name": "--footer-spacing"
+            }
+          ],
           "cssParts": [
             {
-              "description": "The component's base wrapper, an `<sl-popup>` element.",
+              "description": "The component's base wrapper.",
               "name": "base"
             },
             {
-              "description": "The popup's exported `popup` part. Use this to target the tooltip's popup container.",
-              "name": "base__popup"
+              "description": "The overlay that covers the screen behind the drawer.",
+              "name": "overlay"
             },
             {
-              "description": "The container that wraps the trigger.",
-              "name": "trigger"
+              "description": "The drawer's panel (where the drawer and its content are rendered).",
+              "name": "panel"
             },
             {
-              "description": "The panel that gets shown when the dropdown is open.",
-              "name": "panel"
+              "description": "The drawer's header. This element wraps the title and header actions.",
+              "name": "header"
+            },
+            {
+              "description": "Optional actions to add to the header. Works best with `<sl-icon-button>`.",
+              "name": "header-actions"
+            },
+            {
+              "description": "The drawer's title.",
+              "name": "title"
+            },
+            {
+              "description": "The close button, an `<sl-icon-button>`.",
+              "name": "close-button"
+            },
+            {
+              "description": "The close button's exported `base` part.",
+              "name": "close-button__base"
+            },
+            {
+              "description": "The drawer's body.",
+              "name": "body"
+            },
+            {
+              "description": "The drawer's footer.",
+              "name": "footer"
             }
           ],
           "slots": [
             {
-              "description": "The dropdown's main content.",
+              "description": "The drawer's main content.",
               "name": ""
             },
             {
-              "description": "The dropdown's trigger, usually a `<sl-button>` element.",
-              "name": "trigger"
+              "description": "The drawer's label. Alternatively, you can use the `label` attribute.",
+              "name": "label"
+            },
+            {
+              "description": "Optional actions to add to the header. Works best with `<sl-icon-button>`.",
+              "name": "header-actions"
+            },
+            {
+              "description": "The drawer's footer, usually one or more buttons representing various options.",
+              "name": "footer"
             }
           ],
           "members": [
@@ -6214,35 +6310,36 @@
                 "text": "object"
               },
               "static": true,
-              "default": "{ 'sl-popup': SlPopup }"
+              "default": "{ 'sl-icon-button': SlIconButton }"
             },
             {
               "kind": "field",
-              "name": "popup",
-              "type": {
-                "text": "SlPopup"
-              }
+              "name": "hasSlotController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new HasSlotController(this, 'footer')"
             },
             {
               "kind": "field",
-              "name": "trigger",
-              "type": {
-                "text": "HTMLSlotElement"
-              }
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
             },
             {
               "kind": "field",
-              "name": "panel",
+              "name": "originalTrigger",
               "type": {
-                "text": "HTMLSlotElement"
-              }
+                "text": "HTMLElement | null"
+              },
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
+              "name": "modal",
+              "privacy": "public",
+              "default": "new Modal(this)",
+              "description": "Exposes the internal modal utility that controls focus trapping. To temporarily disable focus trapping and allow third-party modals spawned from an active Shoelace modal, call `modal.activateExternal()` when the third-party modal opens. Upon closing, call `modal.deactivateExternal()` to restore Shoelace's focus trapping."
             },
             {
               "kind": "field",
@@ -6254,108 +6351,101 @@
             },
             {
               "kind": "field",
-              "name": "open",
+              "name": "drawer",
               "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
-              "attribute": "open",
-              "reflects": true
+                "text": "HTMLElement"
+              }
             },
             {
               "kind": "field",
-              "name": "placement",
+              "name": "panel",
               "type": {
-                "text": "| 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end'"
-              },
-              "default": "'bottom-start'",
-              "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
-              "attribute": "placement",
-              "reflects": true
+                "text": "HTMLElement"
+              }
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "overlay",
               "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the dropdown so the panel will not open.",
-              "attribute": "disabled",
-              "reflects": true
+                "text": "HTMLElement"
+              }
             },
             {
               "kind": "field",
-              "name": "stayOpenOnSelect",
+              "name": "open",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
-              "attribute": "stay-open-on-select",
+              "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
+              "attribute": "open",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "containingElement",
-              "type": {
-                "text": "HTMLElement | undefined"
-              },
-              "description": "The dropdown will close when the user interacts outside of this element (e.g. clicking). Useful for composing other\ncomponents that use a dropdown internally."
-            },
-            {
-              "kind": "field",
-              "name": "distance",
+              "name": "label",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "default": "0",
-              "description": "The distance in pixels from which to offset the panel away from its trigger.",
-              "attribute": "distance"
+              "default": "''",
+              "description": "The drawer's label as displayed in the header. You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.",
+              "attribute": "label",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "skidding",
+              "name": "placement",
               "type": {
-                "text": "number"
+                "text": "'top' | 'end' | 'bottom' | 'start'"
               },
-              "default": "0",
-              "description": "The distance in pixels from which to offset the panel along its trigger.",
-              "attribute": "skidding"
+              "default": "'end'",
+              "description": "The direction from which the drawer will open.",
+              "attribute": "placement",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "hoist",
+              "name": "contained",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
-              "attribute": "hoist"
+              "description": "By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\nits parent element, set this attribute and add `position: relative` to the parent.",
+              "attribute": "contained",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "sync",
+              "name": "noHeader",
               "type": {
-                "text": "'width' | 'height' | 'both' | undefined"
+                "text": "boolean"
               },
-              "default": "undefined",
-              "description": "Syncs the popup width or height to that of the trigger element.",
-              "attribute": "sync",
+              "default": "false",
+              "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy,\naccessible way for users to dismiss the drawer.",
+              "attribute": "no-header",
               "reflects": true
             },
             {
               "kind": "method",
-              "name": "focusOnTrigger"
+              "name": "requestClose",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "source",
+                  "type": {
+                    "text": "'close-button' | 'keyboard' | 'overlay'"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "getMenu"
+              "name": "addOpenListeners",
+              "privacy": "private"
             },
             {
-              "kind": "field",
-              "name": "handleKeyDown",
+              "kind": "method",
+              "name": "removeOpenListeners",
               "privacy": "private"
             },
             {
@@ -6363,104 +6453,64 @@
               "name": "handleDocumentKeyDown",
               "privacy": "private"
             },
-            {
-              "kind": "field",
-              "name": "handleDocumentMouseDown",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "handlePanelSelect",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "handleTriggerClick"
-            },
-            {
-              "kind": "method",
-              "name": "handleTriggerKeyDown",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "handleTriggerKeyUp",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
-            },
             {
               "kind": "method",
-              "name": "handleTriggerSlotChange"
+              "name": "handleOpenChange"
             },
             {
               "kind": "method",
-              "name": "updateAccessibleTrigger"
+              "name": "handleNoModalChange"
             },
             {
               "kind": "method",
               "name": "show",
-              "description": "Shows the dropdown panel."
+              "description": "Shows the drawer."
             },
             {
               "kind": "method",
               "name": "hide",
-              "description": "Hides the dropdown panel"
-            },
-            {
-              "kind": "method",
-              "name": "reposition",
-              "description": "Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\nis activated."
-            },
-            {
-              "kind": "method",
-              "name": "addOpenListeners"
-            },
-            {
-              "kind": "method",
-              "name": "removeOpenListeners"
-            },
-            {
-              "kind": "method",
-              "name": "handleOpenChange"
+              "description": "Hides the drawer"
             }
           ],
           "events": [
             {
-              "description": "Emitted when the dropdown opens.",
+              "description": "Emitted when the drawer opens.",
               "name": "sl-show",
               "reactName": "onSlShow",
               "eventName": "SlShowEvent"
             },
             {
-              "description": "Emitted after the dropdown opens and all animations are complete.",
+              "description": "Emitted after the drawer opens and all animations are complete.",
               "name": "sl-after-show",
               "reactName": "onSlAfterShow",
               "eventName": "SlAfterShowEvent"
             },
             {
-              "description": "Emitted when the dropdown closes.",
+              "description": "Emitted when the drawer closes.",
               "name": "sl-hide",
               "reactName": "onSlHide",
               "eventName": "SlHideEvent"
             },
             {
-              "description": "Emitted after the dropdown closes and all animations are complete.",
+              "description": "Emitted after the drawer closes and all animations are complete.",
               "name": "sl-after-hide",
               "reactName": "onSlAfterHide",
               "eventName": "SlAfterHideEvent"
+            },
+            {
+              "description": "Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.",
+              "name": "sl-initial-focus",
+              "reactName": "onSlInitialFocus",
+              "eventName": "SlInitialFocusEvent"
+            },
+            {
+              "type": {
+                "text": "{ source: 'close-button' | 'keyboard' | 'overlay' }"
+              },
+              "description": "Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.",
+              "name": "sl-request-close",
+              "reactName": "onSlRequestClose",
+              "eventName": "SlRequestCloseEvent"
             }
           ],
           "attributes": [
@@ -6470,96 +6520,105 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
+              "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
               "fieldName": "open"
             },
             {
-              "name": "placement",
+              "name": "label",
               "type": {
-                "text": "| 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end'"
+                "text": "string"
               },
-              "default": "'bottom-start'",
-              "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
-              "fieldName": "placement"
+              "default": "''",
+              "description": "The drawer's label as displayed in the header. You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.",
+              "fieldName": "label"
             },
             {
-              "name": "disabled",
+              "name": "placement",
               "type": {
-                "text": "boolean"
+                "text": "'top' | 'end' | 'bottom' | 'start'"
               },
-              "default": "false",
-              "description": "Disables the dropdown so the panel will not open.",
-              "fieldName": "disabled"
+              "default": "'end'",
+              "description": "The direction from which the drawer will open.",
+              "fieldName": "placement"
             },
             {
-              "name": "stay-open-on-select",
+              "name": "contained",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
-              "fieldName": "stayOpenOnSelect"
-            },
-            {
-              "name": "distance",
-              "type": {
-                "text": "number"
-              },
-              "default": "0",
-              "description": "The distance in pixels from which to offset the panel away from its trigger.",
-              "fieldName": "distance"
-            },
-            {
-              "name": "skidding",
-              "type": {
-                "text": "number"
-              },
-              "default": "0",
-              "description": "The distance in pixels from which to offset the panel along its trigger.",
-              "fieldName": "skidding"
+              "description": "By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\nits parent element, set this attribute and add `position: relative` to the parent.",
+              "fieldName": "contained"
             },
             {
-              "name": "hoist",
+              "name": "no-header",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
-              "fieldName": "hoist"
-            },
-            {
-              "name": "sync",
-              "type": {
-                "text": "'width' | 'height' | 'both' | undefined"
-              },
-              "default": "undefined",
-              "description": "Syncs the popup width or height to that of the trigger element.",
-              "fieldName": "sync"
+              "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy,\naccessible way for users to dismiss the drawer.",
+              "fieldName": "noHeader"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Dropdowns expose additional content that \"drops down\" in a panel.",
-          "tagNameWithoutPrefix": "dropdown",
-          "tagName": "sl-dropdown",
+          "summary": "Drawers slide in from a container to expose additional options and information.",
+          "tagNameWithoutPrefix": "drawer",
+          "tagName": "sl-drawer",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Dropdowns expose additional content that \"drops down\" in a panel.\n * @documentation https://shoelace.style/components/dropdown\n * @status stable\n * @since 2.0\n *\n * @dependency sl-popup\n *\n * @slot - The dropdown's main content.\n * @slot trigger - The dropdown's trigger, usually a `<sl-button>` element.\n *\n * @event sl-show - Emitted when the dropdown opens.\n * @event sl-after-show - Emitted after the dropdown opens and all animations are complete.\n * @event sl-hide - Emitted when the dropdown closes.\n * @event sl-after-hide - Emitted after the dropdown closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper, an `<sl-popup>` element.\n * @csspart base__popup - The popup's exported `popup` part. Use this to target the tooltip's popup container.\n * @csspart trigger - The container that wraps the trigger.\n * @csspart panel - The panel that gets shown when the dropdown is open.\n *\n * @animation dropdown.show - The animation to use when showing the dropdown.\n * @animation dropdown.hide - The animation to use when hiding the dropdown.\n */",
-          "documentation": "https://shoelace.style/components/dropdown",
+          "jsDoc": "/**\n * @summary Drawers slide in from a container to expose additional options and information.\n * @documentation https://shoelace.style/components/drawer\n * @status stable\n * @since 2.0\n *\n * @dependency sl-icon-button\n *\n * @slot - The drawer's main content.\n * @slot label - The drawer's label. Alternatively, you can use the `label` attribute.\n * @slot header-actions - Optional actions to add to the header. Works best with `<sl-icon-button>`.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @event sl-show - Emitted when the drawer opens.\n * @event sl-after-show - Emitted after the drawer opens and all animations are complete.\n * @event sl-hide - Emitted when the drawer closes.\n * @event sl-after-hide - Emitted after the drawer closes and all animations are complete.\n * @event sl-initial-focus - Emitted when the drawer opens and is ready to receive focus. Calling\n *   `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n * @event {{ source: 'close-button' | 'keyboard' | 'overlay' }} sl-request-close - Emitted when the user attempts to\n *   close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling\n *   `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in\n *   destructive behavior such as data loss.\n *\n * @csspart base - The component's base wrapper.\n * @csspart overlay - The overlay that covers the screen behind the drawer.\n * @csspart panel - The drawer's panel (where the drawer and its content are rendered).\n * @csspart header - The drawer's header. This element wraps the title and header actions.\n * @csspart header-actions - Optional actions to add to the header. Works best with `<sl-icon-button>`.\n * @csspart title - The drawer's title.\n * @csspart close-button - The close button, an `<sl-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n * @csspart body - The drawer's body.\n * @csspart footer - The drawer's footer.\n *\n * @cssproperty --size - The preferred size of the drawer. This will be applied to the drawer's width or height\n *   depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.\n * @cssproperty --header-spacing - The amount of padding to use for the header.\n * @cssproperty --body-spacing - The amount of padding to use for the body.\n * @cssproperty --footer-spacing - The amount of padding to use for the footer.\n *\n * @animation drawer.showTop - The animation to use when showing a drawer with `top` placement.\n * @animation drawer.showEnd - The animation to use when showing a drawer with `end` placement.\n * @animation drawer.showBottom - The animation to use when showing a drawer with `bottom` placement.\n * @animation drawer.showStart - The animation to use when showing a drawer with `start` placement.\n * @animation drawer.hideTop - The animation to use when hiding a drawer with `top` placement.\n * @animation drawer.hideEnd - The animation to use when hiding a drawer with `end` placement.\n * @animation drawer.hideBottom - The animation to use when hiding a drawer with `bottom` placement.\n * @animation drawer.hideStart - The animation to use when hiding a drawer with `start` placement.\n * @animation drawer.denyClose - The animation to use when a request to close the drawer is denied.\n * @animation drawer.overlay.show - The animation to use when showing the drawer's overlay.\n * @animation drawer.overlay.hide - The animation to use when hiding the drawer's overlay.\n *\n * @property modal - Exposes the internal modal utility that controls focus trapping. To temporarily disable focus\n *   trapping and allow third-party modals spawned from an active Shoelace modal, call `modal.activateExternal()` when\n *   the third-party modal opens. Upon closing, call `modal.deactivateExternal()` to restore Shoelace's focus trapping.\n */",
+          "documentation": "https://shoelace.style/components/drawer",
           "status": "stable",
           "since": "2.0",
           "dependencies": [
-            "sl-popup"
+            "sl-icon-button"
           ],
           "animations": [
             {
-              "name": "dropdown.show",
-              "description": "The animation to use when showing the dropdown."
+              "name": "drawer.showTop",
+              "description": "The animation to use when showing a drawer with `top` placement."
             },
             {
-              "name": "dropdown.hide",
-              "description": "The animation to use when hiding the dropdown."
+              "name": "drawer.showEnd",
+              "description": "The animation to use when showing a drawer with `end` placement."
+            },
+            {
+              "name": "drawer.showBottom",
+              "description": "The animation to use when showing a drawer with `bottom` placement."
+            },
+            {
+              "name": "drawer.showStart",
+              "description": "The animation to use when showing a drawer with `start` placement."
+            },
+            {
+              "name": "drawer.hideTop",
+              "description": "The animation to use when hiding a drawer with `top` placement."
+            },
+            {
+              "name": "drawer.hideEnd",
+              "description": "The animation to use when hiding a drawer with `end` placement."
+            },
+            {
+              "name": "drawer.hideBottom",
+              "description": "The animation to use when hiding a drawer with `bottom` placement."
+            },
+            {
+              "name": "drawer.hideStart",
+              "description": "The animation to use when hiding a drawer with `start` placement."
+            },
+            {
+              "name": "drawer.denyClose",
+              "description": "The animation to use when a request to close the drawer is denied."
+            },
+            {
+              "name": "drawer.overlay.show",
+              "description": "The animation to use when showing the drawer's overlay."
+            },
+            {
+              "name": "drawer.overlay.hide",
+              "description": "The animation to use when hiding the drawer's overlay."
             }
           ]
         }
@@ -6569,114 +6628,78 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlDropdown",
-            "module": "components/dropdown/dropdown.js"
+            "name": "SlDrawer",
+            "module": "components/drawer/drawer.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "components/drawer/drawer.js",
+      "path": "components/dropdown/dropdown.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlDrawer",
-          "cssProperties": [
+          "name": "SlDropdown",
+          "cssParts": [
             {
-              "description": "The preferred size of the drawer. This will be applied to the drawer's width or height depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.",
-              "name": "--size"
+              "description": "The component's base wrapper, an `<sl-popup>` element.",
+              "name": "base"
             },
             {
-              "description": "The amount of padding to use for the header.",
-              "name": "--header-spacing"
+              "description": "The popup's exported `popup` part. Use this to target the tooltip's popup container.",
+              "name": "base__popup"
             },
             {
-              "description": "The amount of padding to use for the body.",
-              "name": "--body-spacing"
+              "description": "The container that wraps the trigger.",
+              "name": "trigger"
             },
             {
-              "description": "The amount of padding to use for the footer.",
-              "name": "--footer-spacing"
+              "description": "The panel that gets shown when the dropdown is open.",
+              "name": "panel"
             }
           ],
-          "cssParts": [
+          "slots": [
             {
-              "description": "The component's base wrapper.",
-              "name": "base"
+              "description": "The dropdown's main content.",
+              "name": ""
             },
             {
-              "description": "The overlay that covers the screen behind the drawer.",
-              "name": "overlay"
+              "description": "The dropdown's trigger, usually a `<sl-button>` element.",
+              "name": "trigger"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "dependencies",
+              "type": {
+                "text": "object"
+              },
+              "static": true,
+              "default": "{ 'sl-popup': SlPopup }"
             },
             {
-              "description": "The drawer's panel (where the drawer and its content are rendered).",
-              "name": "panel"
+              "kind": "field",
+              "name": "popup",
+              "type": {
+                "text": "SlPopup"
+              }
             },
-            {
-              "description": "The drawer's header. This element wraps the title and header actions.",
-              "name": "header"
-            },
-            {
-              "description": "Optional actions to add to the header. Works best with `<sl-icon-button>`.",
-              "name": "header-actions"
-            },
-            {
-              "description": "The drawer's title.",
-              "name": "title"
-            },
-            {
-              "description": "The close button, an `<sl-icon-button>`.",
-              "name": "close-button"
-            },
-            {
-              "description": "The close button's exported `base` part.",
-              "name": "close-button__base"
-            },
-            {
-              "description": "The drawer's body.",
-              "name": "body"
-            },
-            {
-              "description": "The drawer's footer.",
-              "name": "footer"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The drawer's main content.",
-              "name": ""
-            },
-            {
-              "description": "The drawer's label. Alternatively, you can use the `label` attribute.",
-              "name": "label"
-            },
-            {
-              "description": "Optional actions to add to the header. Works best with `<sl-icon-button>`.",
-              "name": "header-actions"
-            },
-            {
-              "description": "The drawer's footer, usually one or more buttons representing various options.",
-              "name": "footer"
-            }
-          ],
-          "members": [
             {
               "kind": "field",
-              "name": "dependencies",
+              "name": "trigger",
               "type": {
-                "text": "object"
-              },
-              "static": true,
-              "default": "{ 'sl-icon-button': SlIconButton }"
+                "text": "HTMLSlotElement"
+              }
             },
             {
               "kind": "field",
-              "name": "hasSlotController",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new HasSlotController(this, 'footer')"
+              "name": "panel",
+              "type": {
+                "text": "HTMLSlotElement"
+              }
             },
             {
               "kind": "field",
@@ -6685,21 +6708,6 @@
               "readonly": true,
               "default": "new LocalizeController(this)"
             },
-            {
-              "kind": "field",
-              "name": "originalTrigger",
-              "type": {
-                "text": "HTMLElement | null"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "modal",
-              "privacy": "public",
-              "default": "new Modal(this)",
-              "description": "Exposes the internal modal utility that controls focus trapping. To temporarily disable focus trapping and allow third-party modals spawned from an active Shoelace modal, call `modal.activateExternal()` when the third-party modal opens. Upon closing, call `modal.deactivateExternal()` to restore Shoelace's focus trapping."
-            },
             {
               "kind": "field",
               "name": "closeWatcher",
@@ -6710,274 +6718,312 @@
             },
             {
               "kind": "field",
-              "name": "drawer",
+              "name": "open",
               "type": {
-                "text": "HTMLElement"
-              }
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
+              "attribute": "open",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "panel",
+              "name": "placement",
               "type": {
-                "text": "HTMLElement"
-              }
+                "text": "| 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end'"
+              },
+              "default": "'bottom-start'",
+              "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
+              "attribute": "placement",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "overlay",
+              "name": "disabled",
               "type": {
-                "text": "HTMLElement"
-              }
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the dropdown so the panel will not open.",
+              "attribute": "disabled",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "open",
+              "name": "stayOpenOnSelect",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
-              "attribute": "open",
+              "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
+              "attribute": "stay-open-on-select",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "label",
+              "name": "containingElement",
               "type": {
-                "text": "string"
+                "text": "HTMLElement | undefined"
               },
-              "default": "''",
-              "description": "The drawer's label as displayed in the header. You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.",
-              "attribute": "label",
-              "reflects": true
+              "description": "The dropdown will close when the user interacts outside of this element (e.g. clicking). Useful for composing other\ncomponents that use a dropdown internally."
             },
             {
               "kind": "field",
-              "name": "placement",
+              "name": "distance",
               "type": {
-                "text": "'top' | 'end' | 'bottom' | 'start'"
+                "text": "number"
               },
-              "default": "'end'",
-              "description": "The direction from which the drawer will open.",
-              "attribute": "placement",
-              "reflects": true
+              "default": "0",
+              "description": "The distance in pixels from which to offset the panel away from its trigger.",
+              "attribute": "distance"
             },
             {
               "kind": "field",
-              "name": "contained",
+              "name": "skidding",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "default": "false",
-              "description": "By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\nits parent element, set this attribute and add `position: relative` to the parent.",
-              "attribute": "contained",
-              "reflects": true
+              "default": "0",
+              "description": "The distance in pixels from which to offset the panel along its trigger.",
+              "attribute": "skidding"
             },
             {
               "kind": "field",
-              "name": "noHeader",
+              "name": "hoist",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy,\naccessible way for users to dismiss the drawer.",
-              "attribute": "no-header",
+              "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
+              "attribute": "hoist"
+            },
+            {
+              "kind": "field",
+              "name": "sync",
+              "type": {
+                "text": "'width' | 'height' | 'both' | undefined"
+              },
+              "default": "undefined",
+              "description": "Syncs the popup width or height to that of the trigger element.",
+              "attribute": "sync",
               "reflects": true
             },
             {
               "kind": "method",
-              "name": "requestClose",
-              "privacy": "private",
+              "name": "focusOnTrigger"
+            },
+            {
+              "kind": "method",
+              "name": "getMenu"
+            },
+            {
+              "kind": "field",
+              "name": "handleKeyDown",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleDocumentKeyDown",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleDocumentMouseDown",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handlePanelSelect",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleTriggerClick"
+            },
+            {
+              "kind": "method",
+              "name": "handleTriggerKeyDown",
               "parameters": [
                 {
-                  "name": "source",
+                  "name": "event",
                   "type": {
-                    "text": "'close-button' | 'keyboard' | 'overlay'"
+                    "text": "KeyboardEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "addOpenListeners",
-              "privacy": "private"
+              "name": "handleTriggerKeyUp",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "removeOpenListeners",
-              "privacy": "private"
+              "name": "handleTriggerSlotChange"
             },
             {
-              "kind": "field",
-              "name": "handleDocumentKeyDown",
-              "privacy": "private"
+              "kind": "method",
+              "name": "updateAccessibleTrigger"
             },
             {
               "kind": "method",
-              "name": "handleOpenChange"
+              "name": "show",
+              "description": "Shows the dropdown panel."
             },
             {
               "kind": "method",
-              "name": "handleNoModalChange"
+              "name": "hide",
+              "description": "Hides the dropdown panel"
             },
             {
               "kind": "method",
-              "name": "show",
-              "description": "Shows the drawer."
+              "name": "reposition",
+              "description": "Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\nis activated."
             },
             {
               "kind": "method",
-              "name": "hide",
-              "description": "Hides the drawer"
+              "name": "addOpenListeners"
+            },
+            {
+              "kind": "method",
+              "name": "removeOpenListeners"
+            },
+            {
+              "kind": "method",
+              "name": "handleOpenChange"
             }
           ],
           "events": [
             {
-              "description": "Emitted when the drawer opens.",
+              "description": "Emitted when the dropdown opens.",
               "name": "sl-show",
               "reactName": "onSlShow",
               "eventName": "SlShowEvent"
             },
             {
-              "description": "Emitted after the drawer opens and all animations are complete.",
+              "description": "Emitted after the dropdown opens and all animations are complete.",
               "name": "sl-after-show",
               "reactName": "onSlAfterShow",
               "eventName": "SlAfterShowEvent"
             },
             {
-              "description": "Emitted when the drawer closes.",
+              "description": "Emitted when the dropdown closes.",
               "name": "sl-hide",
               "reactName": "onSlHide",
               "eventName": "SlHideEvent"
             },
             {
-              "description": "Emitted after the drawer closes and all animations are complete.",
+              "description": "Emitted after the dropdown closes and all animations are complete.",
               "name": "sl-after-hide",
               "reactName": "onSlAfterHide",
               "eventName": "SlAfterHideEvent"
-            },
+            }
+          ],
+          "attributes": [
             {
-              "description": "Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.",
-              "name": "sl-initial-focus",
-              "reactName": "onSlInitialFocus",
-              "eventName": "SlInitialFocusEvent"
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
+              "fieldName": "open"
             },
             {
+              "name": "placement",
               "type": {
-                "text": "{ source: 'close-button' | 'keyboard' | 'overlay' }"
+                "text": "| 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end'"
               },
-              "description": "Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.",
-              "name": "sl-request-close",
-              "reactName": "onSlRequestClose",
-              "eventName": "SlRequestCloseEvent"
-            }
-          ],
-          "attributes": [
+              "default": "'bottom-start'",
+              "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
+              "fieldName": "placement"
+            },
             {
-              "name": "open",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
-              "fieldName": "open"
+              "description": "Disables the dropdown so the panel will not open.",
+              "fieldName": "disabled"
             },
             {
-              "name": "label",
+              "name": "stay-open-on-select",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "''",
-              "description": "The drawer's label as displayed in the header. You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.",
-              "fieldName": "label"
+              "default": "false",
+              "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
+              "fieldName": "stayOpenOnSelect"
             },
             {
-              "name": "placement",
+              "name": "distance",
               "type": {
-                "text": "'top' | 'end' | 'bottom' | 'start'"
+                "text": "number"
               },
-              "default": "'end'",
-              "description": "The direction from which the drawer will open.",
-              "fieldName": "placement"
+              "default": "0",
+              "description": "The distance in pixels from which to offset the panel away from its trigger.",
+              "fieldName": "distance"
             },
             {
-              "name": "contained",
+              "name": "skidding",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "default": "false",
-              "description": "By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\nits parent element, set this attribute and add `position: relative` to the parent.",
-              "fieldName": "contained"
+              "default": "0",
+              "description": "The distance in pixels from which to offset the panel along its trigger.",
+              "fieldName": "skidding"
             },
             {
-              "name": "no-header",
+              "name": "hoist",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy,\naccessible way for users to dismiss the drawer.",
-              "fieldName": "noHeader"
+              "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
+              "fieldName": "hoist"
+            },
+            {
+              "name": "sync",
+              "type": {
+                "text": "'width' | 'height' | 'both' | undefined"
+              },
+              "default": "undefined",
+              "description": "Syncs the popup width or height to that of the trigger element.",
+              "fieldName": "sync"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Drawers slide in from a container to expose additional options and information.",
-          "tagNameWithoutPrefix": "drawer",
-          "tagName": "sl-drawer",
+          "summary": "Dropdowns expose additional content that \"drops down\" in a panel.",
+          "tagNameWithoutPrefix": "dropdown",
+          "tagName": "sl-dropdown",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Drawers slide in from a container to expose additional options and information.\n * @documentation https://shoelace.style/components/drawer\n * @status stable\n * @since 2.0\n *\n * @dependency sl-icon-button\n *\n * @slot - The drawer's main content.\n * @slot label - The drawer's label. Alternatively, you can use the `label` attribute.\n * @slot header-actions - Optional actions to add to the header. Works best with `<sl-icon-button>`.\n * @slot footer - The drawer's footer, usually one or more buttons representing various options.\n *\n * @event sl-show - Emitted when the drawer opens.\n * @event sl-after-show - Emitted after the drawer opens and all animations are complete.\n * @event sl-hide - Emitted when the drawer closes.\n * @event sl-after-hide - Emitted after the drawer closes and all animations are complete.\n * @event sl-initial-focus - Emitted when the drawer opens and is ready to receive focus. Calling\n *   `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n * @event {{ source: 'close-button' | 'keyboard' | 'overlay' }} sl-request-close - Emitted when the user attempts to\n *   close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling\n *   `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in\n *   destructive behavior such as data loss.\n *\n * @csspart base - The component's base wrapper.\n * @csspart overlay - The overlay that covers the screen behind the drawer.\n * @csspart panel - The drawer's panel (where the drawer and its content are rendered).\n * @csspart header - The drawer's header. This element wraps the title and header actions.\n * @csspart header-actions - Optional actions to add to the header. Works best with `<sl-icon-button>`.\n * @csspart title - The drawer's title.\n * @csspart close-button - The close button, an `<sl-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n * @csspart body - The drawer's body.\n * @csspart footer - The drawer's footer.\n *\n * @cssproperty --size - The preferred size of the drawer. This will be applied to the drawer's width or height\n *   depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens.\n * @cssproperty --header-spacing - The amount of padding to use for the header.\n * @cssproperty --body-spacing - The amount of padding to use for the body.\n * @cssproperty --footer-spacing - The amount of padding to use for the footer.\n *\n * @animation drawer.showTop - The animation to use when showing a drawer with `top` placement.\n * @animation drawer.showEnd - The animation to use when showing a drawer with `end` placement.\n * @animation drawer.showBottom - The animation to use when showing a drawer with `bottom` placement.\n * @animation drawer.showStart - The animation to use when showing a drawer with `start` placement.\n * @animation drawer.hideTop - The animation to use when hiding a drawer with `top` placement.\n * @animation drawer.hideEnd - The animation to use when hiding a drawer with `end` placement.\n * @animation drawer.hideBottom - The animation to use when hiding a drawer with `bottom` placement.\n * @animation drawer.hideStart - The animation to use when hiding a drawer with `start` placement.\n * @animation drawer.denyClose - The animation to use when a request to close the drawer is denied.\n * @animation drawer.overlay.show - The animation to use when showing the drawer's overlay.\n * @animation drawer.overlay.hide - The animation to use when hiding the drawer's overlay.\n *\n * @property modal - Exposes the internal modal utility that controls focus trapping. To temporarily disable focus\n *   trapping and allow third-party modals spawned from an active Shoelace modal, call `modal.activateExternal()` when\n *   the third-party modal opens. Upon closing, call `modal.deactivateExternal()` to restore Shoelace's focus trapping.\n */",
-          "documentation": "https://shoelace.style/components/drawer",
+          "jsDoc": "/**\n * @summary Dropdowns expose additional content that \"drops down\" in a panel.\n * @documentation https://shoelace.style/components/dropdown\n * @status stable\n * @since 2.0\n *\n * @dependency sl-popup\n *\n * @slot - The dropdown's main content.\n * @slot trigger - The dropdown's trigger, usually a `<sl-button>` element.\n *\n * @event sl-show - Emitted when the dropdown opens.\n * @event sl-after-show - Emitted after the dropdown opens and all animations are complete.\n * @event sl-hide - Emitted when the dropdown closes.\n * @event sl-after-hide - Emitted after the dropdown closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper, an `<sl-popup>` element.\n * @csspart base__popup - The popup's exported `popup` part. Use this to target the tooltip's popup container.\n * @csspart trigger - The container that wraps the trigger.\n * @csspart panel - The panel that gets shown when the dropdown is open.\n *\n * @animation dropdown.show - The animation to use when showing the dropdown.\n * @animation dropdown.hide - The animation to use when hiding the dropdown.\n */",
+          "documentation": "https://shoelace.style/components/dropdown",
           "status": "stable",
           "since": "2.0",
           "dependencies": [
-            "sl-icon-button"
+            "sl-popup"
           ],
           "animations": [
             {
-              "name": "drawer.showTop",
-              "description": "The animation to use when showing a drawer with `top` placement."
-            },
-            {
-              "name": "drawer.showEnd",
-              "description": "The animation to use when showing a drawer with `end` placement."
-            },
-            {
-              "name": "drawer.showBottom",
-              "description": "The animation to use when showing a drawer with `bottom` placement."
-            },
-            {
-              "name": "drawer.showStart",
-              "description": "The animation to use when showing a drawer with `start` placement."
-            },
-            {
-              "name": "drawer.hideTop",
-              "description": "The animation to use when hiding a drawer with `top` placement."
-            },
-            {
-              "name": "drawer.hideEnd",
-              "description": "The animation to use when hiding a drawer with `end` placement."
-            },
-            {
-              "name": "drawer.hideBottom",
-              "description": "The animation to use when hiding a drawer with `bottom` placement."
-            },
-            {
-              "name": "drawer.hideStart",
-              "description": "The animation to use when hiding a drawer with `start` placement."
-            },
-            {
-              "name": "drawer.denyClose",
-              "description": "The animation to use when a request to close the drawer is denied."
-            },
-            {
-              "name": "drawer.overlay.show",
-              "description": "The animation to use when showing the drawer's overlay."
+              "name": "dropdown.show",
+              "description": "The animation to use when showing the dropdown."
             },
             {
-              "name": "drawer.overlay.hide",
-              "description": "The animation to use when hiding the drawer's overlay."
+              "name": "dropdown.hide",
+              "description": "The animation to use when hiding the dropdown."
             }
           ]
         }
@@ -6987,8 +7033,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlDrawer",
-            "module": "components/drawer/drawer.js"
+            "name": "SlDropdown",
+            "module": "components/dropdown/dropdown.js"
           }
         }
       ]
@@ -8760,6 +8806,7 @@
               "type": {
                 "text": "string"
               },
+              "default": "'off'",
               "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
               "attribute": "autocomplete"
             },
@@ -9308,6 +9355,7 @@
               "type": {
                 "text": "string"
               },
+              "default": "'off'",
               "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
               "fieldName": "autocomplete"
             },
@@ -9489,52 +9537,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/menu-label/menu-label.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlMenuLabel",
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The menu label's content.",
-              "name": ""
-            }
-          ],
-          "members": [],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "Menu labels are used to describe a group of menu items.",
-          "tagNameWithoutPrefix": "menu-label",
-          "tagName": "sl-menu-label",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Menu labels are used to describe a group of menu items.\n * @documentation https://shoelace.style/components/menu-label\n * @status stable\n * @since 2.0\n *\n * @slot - The menu label's content.\n *\n * @csspart base - The component's base wrapper.\n */",
-          "documentation": "https://shoelace.style/components/menu-label",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlMenuLabel",
-            "module": "components/menu-label/menu-label.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/menu-item/menu-item.js",
@@ -9824,6 +9826,52 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/menu-label/menu-label.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlMenuLabel",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The menu label's content.",
+              "name": ""
+            }
+          ],
+          "members": [],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "Menu labels are used to describe a group of menu items.",
+          "tagNameWithoutPrefix": "menu-label",
+          "tagName": "sl-menu-label",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Menu labels are used to describe a group of menu items.\n * @documentation https://shoelace.style/components/menu-label\n * @status stable\n * @since 2.0\n *\n * @slot - The menu label's content.\n *\n * @csspart base - The component's base wrapper.\n */",
+          "documentation": "https://shoelace.style/components/menu-label",
+          "status": "stable",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlMenuLabel",
+            "module": "components/menu-label/menu-label.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/mutation-observer/mutation-observer.js",
@@ -10233,31 +10281,240 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/popup/popup.js",
+      "path": "components/pagination/pagination.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlPopup",
-          "cssProperties": [
+          "name": "SlPagination",
+          "members": [
             {
-              "description": "The size of the arrow. Note that an arrow won't be shown unless the `arrow` attribute is used.",
-              "name": "--arrow-size",
-              "default": "6px"
+              "kind": "field",
+              "name": "dependencies",
+              "type": {
+                "text": "object"
+              },
+              "static": true,
+              "default": "{ 'sl-icon': SlIcon }"
             },
             {
-              "description": "The color of the arrow.",
-              "name": "--arrow-color",
-              "default": "var(--sl-color-neutral-0)"
+              "kind": "field",
+              "name": "currentPage",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "attribute": "currentPage"
             },
             {
-              "description": "A read-only custom property that determines the amount of width the popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only available when using `auto-size`.",
-              "name": "--auto-size-available-width"
+              "kind": "field",
+              "name": "pageSize",
+              "type": {
+                "text": "number"
+              },
+              "default": "20",
+              "attribute": "pageSize"
             },
             {
-              "description": "A read-only custom property that determines the amount of height the popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only available when using `auto-size`.",
-              "name": "--auto-size-available-height"
-            }
+              "kind": "field",
+              "name": "pageSizeOpts",
+              "type": {
+                "text": "array"
+              },
+              "default": "[10, 20, 50, 100]",
+              "attribute": "pageSizeOpts"
+            },
+            {
+              "kind": "field",
+              "name": "total",
+              "type": {
+                "text": "number"
+              },
+              "default": "5000",
+              "attribute": "total"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "disabled"
+            },
+            {
+              "kind": "field",
+              "name": "className",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "attribute": "className"
+            },
+            {
+              "kind": "field",
+              "name": "simpleMode",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "simpleMode"
+            },
+            {
+              "kind": "field",
+              "name": "totalPage",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "protected",
+              "default": "1"
+            },
+            {
+              "kind": "method",
+              "name": "updateTotalPages"
+            },
+            {
+              "kind": "method",
+              "name": "handleInputChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handlePageChangePage",
+              "parameters": [
+                {
+                  "name": "page",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handlePageSizeChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "CustomEvent"
+                  }
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "currentPage",
+              "type": {
+                "text": "number"
+              },
+              "default": "1",
+              "fieldName": "currentPage"
+            },
+            {
+              "name": "pageSize",
+              "type": {
+                "text": "number"
+              },
+              "default": "20",
+              "fieldName": "pageSize"
+            },
+            {
+              "name": "pageSizeOpts",
+              "type": {
+                "text": "array"
+              },
+              "default": "[10, 20, 50, 100]",
+              "fieldName": "pageSizeOpts"
+            },
+            {
+              "name": "total",
+              "type": {
+                "text": "number"
+              },
+              "default": "5000",
+              "fieldName": "total"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "disabled"
+            },
+            {
+              "name": "className",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "fieldName": "className"
+            },
+            {
+              "name": "simpleMode",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "simpleMode"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "tagNameWithoutPrefix": "pagination",
+          "tagName": "sl-pagination",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlPagination",
+            "module": "components/pagination/pagination.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/popup/popup.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlPopup",
+          "cssProperties": [
+            {
+              "description": "The size of the arrow. Note that an arrow won't be shown unless the `arrow` attribute is used.",
+              "name": "--arrow-size",
+              "default": "6px"
+            },
+            {
+              "description": "The color of the arrow.",
+              "name": "--arrow-color",
+              "default": "var(--sl-color-neutral-0)"
+            },
+            {
+              "description": "A read-only custom property that determines the amount of width the popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only available when using `auto-size`.",
+              "name": "--auto-size-available-width"
+            },
+            {
+              "description": "A read-only custom property that determines the amount of height the popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only available when using `auto-size`.",
+              "name": "--auto-size-available-height"
+            }
           ],
           "cssParts": [
             {
@@ -13436,72 +13693,290 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/select/select.js",
+      "path": "components/screen/screen.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlSelect",
+          "name": "SlScreen",
           "cssParts": [
             {
-              "description": "The form control that wraps the label, input, and help text.",
-              "name": "form-control"
+              "description": "The grid layout content.",
+              "name": "base"
+            }
+          ],
+          "members": [
+            {
+              "kind": "method",
+              "name": "getGridData",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "description": "获取 GridStack 实例的序列化数据"
             },
             {
-              "description": "The label's wrapper.",
-              "name": "form-control-label"
+              "kind": "method",
+              "name": "getInstance",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "description": "获取 GridStack 实例的序列化数据"
             },
             {
-              "description": "The select's wrapper.",
-              "name": "form-control-input"
+              "kind": "field",
+              "name": "grid",
+              "type": {
+                "text": "GridStack | null"
+              },
+              "privacy": "private",
+              "default": "null"
             },
             {
-              "description": "The help text's wrapper.",
-              "name": "form-control-help-text"
+              "kind": "field",
+              "name": "gridElement",
+              "type": {
+                "text": "HTMLElement"
+              }
             },
             {
-              "description": "The container the wraps the prefix, suffix, combobox, clear icon, and expand button.",
-              "name": "combobox"
+              "kind": "field",
+              "name": "options",
+              "type": {
+                "text": "GridStackOptions"
+              },
+              "default": "{}",
+              "description": "The options for the GridStack instance.",
+              "attribute": "options",
+              "reflects": true
             },
             {
-              "description": "The container that wraps the prefix slot.",
-              "name": "prefix"
+              "kind": "field",
+              "name": "data",
+              "type": {
+                "text": "GridStackNode[]"
+              },
+              "default": "[]",
+              "description": "The initial configuration for the grid.",
+              "attribute": "data"
             },
             {
-              "description": "The container that wraps the suffix slot.",
-              "name": "suffix"
+              "kind": "field",
+              "name": "removable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the items in the grid can be removed.",
+              "attribute": "removable",
+              "reflects": true
             },
             {
-              "description": "The element that displays the selected option's label, an `<input>` element.",
-              "name": "display-input"
+              "kind": "field",
+              "name": "static",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables dragging and resizing of widgets.",
+              "attribute": "static",
+              "reflects": true
             },
             {
-              "description": "The listbox container where options are slotted.",
-              "name": "listbox"
+              "kind": "field",
+              "name": "selector",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The selector for items that can be dragged into the grid from outside.",
+              "attribute": "selector",
+              "reflects": true
             },
             {
-              "description": "The container that houses option tags when `multiselect` is used.",
-              "name": "tags"
+              "kind": "method",
+              "name": "handleDataChange"
             },
             {
-              "description": "The individual tags that represent each multiselect option.",
-              "name": "tag"
+              "kind": "method",
+              "name": "handleSelectorChange"
             },
             {
-              "description": "The tag's base part.",
-              "name": "tag__base"
+              "kind": "method",
+              "name": "handleStaticGridChange"
             },
             {
-              "description": "The tag's content part.",
-              "name": "tag__content"
+              "kind": "method",
+              "name": "setupDragIn",
+              "privacy": "private"
             },
             {
-              "description": "The tag's remove button.",
-              "name": "tag__remove-button"
+              "kind": "method",
+              "name": "initGrid",
+              "privacy": "private"
             },
             {
-              "description": "The tag's remove button base part.",
-              "name": "tag__remove-button__base"
+              "kind": "method",
+              "name": "loadGrid",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "addDeleteButton",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "itemEl",
+                  "type": {
+                    "text": "HTMLElement"
+                  }
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "options",
+              "type": {
+                "text": "GridStackOptions"
+              },
+              "default": "{}",
+              "description": "The options for the GridStack instance.",
+              "fieldName": "options"
+            },
+            {
+              "name": "data",
+              "type": {
+                "text": "GridStackNode[]"
+              },
+              "default": "[]",
+              "description": "The initial configuration for the grid.",
+              "fieldName": "data"
+            },
+            {
+              "name": "removable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the items in the grid can be removed.",
+              "fieldName": "removable"
+            },
+            {
+              "name": "static",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables dragging and resizing of widgets.",
+              "fieldName": "static"
+            },
+            {
+              "name": "selector",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The selector for items that can be dragged into the grid from outside.",
+              "fieldName": "selector"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "Screen is a grid layout component based on gridstack.js and Shoelace.",
+          "tagNameWithoutPrefix": "screen",
+          "tagName": "sl-screen",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Screen is a grid layout component based on gridstack.js and Shoelace.\n * @documentation https://shoelace.style/components/screen\n * @status experimental\n * @csspart base The grid layout content.\n * @since 2.0\n */",
+          "documentation": "https://shoelace.style/components/screen",
+          "status": "experimental",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlScreen",
+            "module": "components/screen/screen.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/select/select.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlSelect",
+          "cssParts": [
+            {
+              "description": "The form control that wraps the label, input, and help text.",
+              "name": "form-control"
+            },
+            {
+              "description": "The label's wrapper.",
+              "name": "form-control-label"
+            },
+            {
+              "description": "The select's wrapper.",
+              "name": "form-control-input"
+            },
+            {
+              "description": "The help text's wrapper.",
+              "name": "form-control-help-text"
+            },
+            {
+              "description": "The container the wraps the prefix, suffix, combobox, clear icon, and expand button.",
+              "name": "combobox"
+            },
+            {
+              "description": "The container that wraps the prefix slot.",
+              "name": "prefix"
+            },
+            {
+              "description": "The container that wraps the suffix slot.",
+              "name": "suffix"
+            },
+            {
+              "description": "The element that displays the selected option's label, an `<input>` element.",
+              "name": "display-input"
+            },
+            {
+              "description": "The listbox container where options are slotted.",
+              "name": "listbox"
+            },
+            {
+              "description": "The container that houses option tags when `multiselect` is used.",
+              "name": "tags"
+            },
+            {
+              "description": "The individual tags that represent each multiselect option.",
+              "name": "tag"
+            },
+            {
+              "description": "The tag's base part.",
+              "name": "tag__base"
+            },
+            {
+              "description": "The tag's content part.",
+              "name": "tag__content"
+            },
+            {
+              "description": "The tag's remove button.",
+              "name": "tag__remove-button"
+            },
+            {
+              "description": "The tag's remove button base part.",
+              "name": "tag__remove-button__base"
             },
             {
               "description": "The clear button.",
@@ -16253,7 +16728,16 @@
                 "text": "object"
               },
               "static": true,
-              "default": "{ 'sl-checkbox': SlCheckBox, 'sl-radio': SlRadio }"
+              "default": "{ 'sl-checkbox': SlCheckBox, 'sl-radio': SlRadio, 'sl-pagination': SlPagination }"
+            },
+            {
+              "kind": "field",
+              "name": "rowKey",
+              "type": {
+                "text": "TableProps<TData>['rowKey']"
+              },
+              "default": "'key'",
+              "attribute": "rowKey"
             },
             {
               "kind": "field",
@@ -16295,7 +16779,7 @@
               "kind": "field",
               "name": "direction",
               "type": {
-                "text": "TableProps<TData>['direction'] | undefined"
+                "text": "TableProps<TData>['direction']"
               },
               "default": "'ltr'",
               "attribute": "direction"
@@ -16307,16 +16791,33 @@
                 "text": "TableProps<TData>['showHeader']"
               },
               "default": "true",
-              "attribute": "show-header"
+              "attribute": "showHeader"
             },
             {
               "kind": "field",
               "name": "rowSelection",
               "type": {
-                "text": "TableRowSelection<TData> | undefined"
+                "text": "TableRowSelection<TData>"
               },
               "attribute": "rowSelection"
             },
+            {
+              "kind": "field",
+              "name": "tableScroll",
+              "type": {
+                "text": "TableProps<TData>['tableScroll']"
+              },
+              "default": "{}",
+              "attribute": "tableScroll"
+            },
+            {
+              "kind": "field",
+              "name": "pagination",
+              "type": {
+                "text": "{\n    total?: number;\n    pageSize?: number;\n    currentPage?: number;\n    pageSizeOpts?: number[];\n    simpleMode?: boolean;\n    className?: string;\n    disabled?: boolean;\n    ['sl-page-change']?: (event: CustomEvent) => void;\n  } | undefined"
+              },
+              "attribute": "pagination"
+            },
             {
               "kind": "field",
               "name": "rowSelectedMap",
@@ -16327,9 +16828,51 @@
             },
             {
               "kind": "field",
-              "name": "tableController",
+              "name": "sorting",
+              "type": {
+                "text": "SortingState"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "columnFilters",
+              "type": {
+                "text": "ColumnFiltersState"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "tableWidth",
+              "type": {
+                "text": "number"
+              },
+              "default": "0"
+            },
+            {
+              "kind": "field",
+              "name": "tableWrapRef",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "headerWrapRef",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "bodyWrapRef",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "syncing",
+              "type": {
+                "text": "boolean"
+              },
               "privacy": "private",
-              "default": "new TableController<TData>(this)"
+              "default": "false"
             },
             {
               "kind": "field",
@@ -16339,6 +16882,31 @@
               },
               "readonly": true
             },
+            {
+              "kind": "field",
+              "name": "warnIfNoKey",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleBodyScroll"
+            },
+            {
+              "kind": "field",
+              "name": "handleBodyScrollLeft"
+            },
+            {
+              "kind": "field",
+              "name": "handleWindowResize"
+            },
+            {
+              "kind": "field",
+              "name": "syncTableWidth"
+            },
+            {
+              "kind": "field",
+              "name": "setScrollPositionClassName"
+            },
             {
               "kind": "method",
               "name": "renderTable",
@@ -16357,6 +16925,11 @@
                 }
               ]
             },
+            {
+              "kind": "method",
+              "name": "renderEmpty",
+              "privacy": "private"
+            },
             {
               "kind": "method",
               "name": "renderMainTable",
@@ -16377,7 +16950,12 @@
             },
             {
               "kind": "method",
-              "name": "generateColumns",
+              "name": "renderPagination",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "buildColumns",
               "privacy": "private",
               "return": {
                 "type": {
@@ -16385,13 +16963,68 @@
                 }
               }
             },
+            {
+              "kind": "field",
+              "name": "handleRowSelectionChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleSortingChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleColumnFiltersChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleFilterDropdownChange"
+            },
             {
               "kind": "method",
               "name": "buildTableState",
               "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "onChange",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "extra",
+                  "optional": true,
+                  "type": {
+                    "text": "Record<string, unknown>"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "handlePaginationChange"
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "reactName": "onChange",
+              "eventName": "ChangeEvent"
             }
           ],
           "attributes": [
+            {
+              "name": "rowKey",
+              "type": {
+                "text": "TableProps<TData>['rowKey']"
+              },
+              "default": "'key'",
+              "fieldName": "rowKey"
+            },
             {
               "name": "columns",
               "type": {
@@ -16401,60 +17034,881 @@
               "fieldName": "columns"
             },
             {
-              "name": "dataSource",
+              "name": "dataSource",
+              "type": {
+                "text": "TableProps<TData>['dataSource']"
+              },
+              "default": "[]",
+              "fieldName": "dataSource"
+            },
+            {
+              "name": "loading",
+              "type": {
+                "text": "TableProps<TData>['loading']"
+              },
+              "default": "false",
+              "fieldName": "loading"
+            },
+            {
+              "name": "bordered",
+              "type": {
+                "text": "TableProps<TData>['bordered']"
+              },
+              "default": "false",
+              "fieldName": "bordered"
+            },
+            {
+              "name": "direction",
+              "type": {
+                "text": "TableProps<TData>['direction']"
+              },
+              "default": "'ltr'",
+              "fieldName": "direction"
+            },
+            {
+              "name": "showHeader",
+              "type": {
+                "text": "TableProps<TData>['showHeader']"
+              },
+              "default": "true",
+              "fieldName": "showHeader"
+            },
+            {
+              "name": "rowSelection",
+              "type": {
+                "text": "TableRowSelection<TData>"
+              },
+              "fieldName": "rowSelection"
+            },
+            {
+              "name": "tableScroll",
+              "type": {
+                "text": "TableProps<TData>['tableScroll']"
+              },
+              "default": "{}",
+              "fieldName": "tableScroll"
+            },
+            {
+              "name": "pagination",
+              "type": {
+                "text": "{\n    total?: number;\n    pageSize?: number;\n    currentPage?: number;\n    pageSizeOpts?: number[];\n    simpleMode?: boolean;\n    className?: string;\n    disabled?: boolean;\n    ['sl-page-change']?: (event: CustomEvent) => void;\n  } | undefined"
+              },
+              "fieldName": "pagination"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "tagNameWithoutPrefix": "table",
+          "tagName": "sl-table",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlTable",
+            "module": "components/table/table.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./spinner-container.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./head-table.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./body-table.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/textarea/textarea.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlTextarea",
+          "cssParts": [
+            {
+              "description": "The form control that wraps the label, input, and help text.",
+              "name": "form-control"
+            },
+            {
+              "description": "The label's wrapper.",
+              "name": "form-control-label"
+            },
+            {
+              "description": "The input's wrapper.",
+              "name": "form-control-input"
+            },
+            {
+              "description": "The help text's wrapper.",
+              "name": "form-control-help-text"
+            },
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            },
+            {
+              "description": "The internal `<textarea>` control.",
+              "name": "textarea"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The textarea's label. Alternatively, you can use the `label` attribute.",
+              "name": "label"
+            },
+            {
+              "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
+              "name": "help-text"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "formControlController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new FormControlController(this, { assumeInteractionOn: ['sl-blur', 'sl-input'] })"
+            },
+            {
+              "kind": "field",
+              "name": "hasSlotController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new HasSlotController(this, 'help-text', 'label')"
+            },
+            {
+              "kind": "field",
+              "name": "resizeObserver",
+              "type": {
+                "text": "ResizeObserver"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "input",
+              "type": {
+                "text": "HTMLTextAreaElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "sizeAdjuster",
+              "type": {
+                "text": "HTMLTextAreaElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "hasFocus",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "attribute": "title"
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name of the textarea, submitted as a name/value pair with form data.",
+              "attribute": "name"
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The current value of the textarea, submitted as a name/value pair with form data.",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "'small' | 'medium' | 'large'"
+              },
+              "default": "'medium'",
+              "description": "The textarea's size.",
+              "attribute": "size",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "filled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws a filled textarea.",
+              "attribute": "filled",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The textarea's label. If you need to display HTML, use the `label` slot instead.",
+              "attribute": "label"
+            },
+            {
+              "kind": "field",
+              "name": "helpText",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The textarea's help text. If you need to display HTML, use the `help-text` slot instead.",
+              "attribute": "help-text"
+            },
+            {
+              "kind": "field",
+              "name": "placeholder",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Placeholder text to show as a hint when the input is empty.",
+              "attribute": "placeholder"
+            },
+            {
+              "kind": "field",
+              "name": "rows",
+              "type": {
+                "text": "number"
+              },
+              "default": "4",
+              "description": "The number of rows to display by default.",
+              "attribute": "rows"
+            },
+            {
+              "kind": "field",
+              "name": "resize",
+              "type": {
+                "text": "'none' | 'vertical' | 'auto'"
+              },
+              "default": "'vertical'",
+              "description": "Controls how the textarea can be resized.",
+              "attribute": "resize"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the textarea.",
+              "attribute": "disabled",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "readonly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the textarea readonly.",
+              "attribute": "readonly",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "form",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
+              "attribute": "form",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the textarea a required field.",
+              "attribute": "required",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "minlength",
+              "type": {
+                "text": "number"
+              },
+              "description": "The minimum length of input that will be considered valid.",
+              "attribute": "minlength"
+            },
+            {
+              "kind": "field",
+              "name": "maxlength",
+              "type": {
+                "text": "number"
+              },
+              "description": "The maximum length of input that will be considered valid.",
+              "attribute": "maxlength"
+            },
+            {
+              "kind": "field",
+              "name": "autocapitalize",
+              "type": {
+                "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
+              },
+              "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
+              "attribute": "autocapitalize"
+            },
+            {
+              "kind": "field",
+              "name": "autocorrect",
+              "type": {
+                "text": "string"
+              },
+              "description": "Indicates whether the browser's autocorrect feature is on or off.",
+              "attribute": "autocorrect"
+            },
+            {
+              "kind": "field",
+              "name": "autocomplete",
+              "type": {
+                "text": "string"
+              },
+              "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
+              "attribute": "autocomplete"
+            },
+            {
+              "kind": "field",
+              "name": "autofocus",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Indicates that the input should receive focus on page load.",
+              "attribute": "autofocus"
+            },
+            {
+              "kind": "field",
+              "name": "enterkeyhint",
+              "type": {
+                "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
+              },
+              "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
+              "attribute": "enterkeyhint"
+            },
+            {
+              "kind": "field",
+              "name": "spellcheck",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "description": "Enables spell checking on the textarea.",
+              "attribute": "spellcheck"
+            },
+            {
+              "kind": "field",
+              "name": "inputmode",
+              "type": {
+                "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
+              },
+              "description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
+              "attribute": "inputmode"
+            },
+            {
+              "kind": "field",
+              "name": "defaultValue",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The default value of the form control. Primarily used for resetting the form control."
+            },
+            {
+              "kind": "field",
+              "name": "validity",
+              "description": "Gets the validity state object",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "validationMessage",
+              "description": "Gets the validation message",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "handleBlur",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleFocus",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleInput",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleInvalid",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "setTextareaHeight",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleDisabledChange"
+            },
+            {
+              "kind": "method",
+              "name": "handleRowsChange"
+            },
+            {
+              "kind": "method",
+              "name": "handleValueChange"
+            },
+            {
+              "kind": "method",
+              "name": "focus",
+              "parameters": [
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "FocusOptions"
+                  }
+                }
+              ],
+              "description": "Sets focus on the textarea."
+            },
+            {
+              "kind": "method",
+              "name": "blur",
+              "description": "Removes focus from the textarea."
+            },
+            {
+              "kind": "method",
+              "name": "select",
+              "description": "Selects all the text in the textarea."
+            },
+            {
+              "kind": "method",
+              "name": "scrollPosition",
+              "return": {
+                "type": {
+                  "text": "{ top: number; left: number } | undefined"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "position",
+                  "optional": true,
+                  "type": {
+                    "text": "{ top?: number; left?: number }"
+                  }
+                }
+              ],
+              "description": "Gets or sets the textarea's scroll position."
+            },
+            {
+              "kind": "method",
+              "name": "setSelectionRange",
+              "parameters": [
+                {
+                  "name": "selectionStart",
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "selectionEnd",
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "selectionDirection",
+                  "default": "'none'",
+                  "type": {
+                    "text": "'forward' | 'backward' | 'none'"
+                  }
+                }
+              ],
+              "description": "Sets the start and end positions of the text selection (0-based)."
+            },
+            {
+              "kind": "method",
+              "name": "setRangeText",
+              "parameters": [
+                {
+                  "name": "replacement",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "start",
+                  "optional": true,
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "end",
+                  "optional": true,
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "selectMode",
+                  "default": "'preserve'",
+                  "type": {
+                    "text": "'select' | 'start' | 'end' | 'preserve'"
+                  }
+                }
+              ],
+              "description": "Replaces a range of text with a new string."
+            },
+            {
+              "kind": "method",
+              "name": "checkValidity",
+              "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
+            },
+            {
+              "kind": "method",
+              "name": "getForm",
+              "return": {
+                "type": {
+                  "text": "HTMLFormElement | null"
+                }
+              },
+              "description": "Gets the associated form, if one exists."
+            },
+            {
+              "kind": "method",
+              "name": "reportValidity",
+              "description": "Checks for validity and shows the browser's validation message if the control is invalid."
+            },
+            {
+              "kind": "method",
+              "name": "setCustomValidity",
+              "parameters": [
+                {
+                  "name": "message",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Sets a custom validation message. Pass an empty string to restore validity."
+            }
+          ],
+          "events": [
+            {
+              "description": "Emitted when the control loses focus.",
+              "name": "sl-blur",
+              "reactName": "onSlBlur",
+              "eventName": "SlBlurEvent"
+            },
+            {
+              "description": "Emitted when an alteration to the control's value is committed by the user.",
+              "name": "sl-change",
+              "reactName": "onSlChange",
+              "eventName": "SlChangeEvent"
+            },
+            {
+              "description": "Emitted when the control gains focus.",
+              "name": "sl-focus",
+              "reactName": "onSlFocus",
+              "eventName": "SlFocusEvent"
+            },
+            {
+              "description": "Emitted when the control receives input.",
+              "name": "sl-input",
+              "reactName": "onSlInput",
+              "eventName": "SlInputEvent"
+            },
+            {
+              "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
+              "name": "sl-invalid",
+              "reactName": "onSlInvalid",
+              "eventName": "SlInvalidEvent"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "fieldName": "title"
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The name of the textarea, submitted as a name/value pair with form data.",
+              "fieldName": "name"
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The current value of the textarea, submitted as a name/value pair with form data.",
+              "fieldName": "value"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "'small' | 'medium' | 'large'"
+              },
+              "default": "'medium'",
+              "description": "The textarea's size.",
+              "fieldName": "size"
+            },
+            {
+              "name": "filled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws a filled textarea.",
+              "fieldName": "filled"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The textarea's label. If you need to display HTML, use the `label` slot instead.",
+              "fieldName": "label"
+            },
+            {
+              "name": "help-text",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The textarea's help text. If you need to display HTML, use the `help-text` slot instead.",
+              "fieldName": "helpText"
+            },
+            {
+              "name": "placeholder",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Placeholder text to show as a hint when the input is empty.",
+              "fieldName": "placeholder"
+            },
+            {
+              "name": "rows",
+              "type": {
+                "text": "number"
+              },
+              "default": "4",
+              "description": "The number of rows to display by default.",
+              "fieldName": "rows"
+            },
+            {
+              "name": "resize",
+              "type": {
+                "text": "'none' | 'vertical' | 'auto'"
+              },
+              "default": "'vertical'",
+              "description": "Controls how the textarea can be resized.",
+              "fieldName": "resize"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the textarea.",
+              "fieldName": "disabled"
+            },
+            {
+              "name": "readonly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the textarea readonly.",
+              "fieldName": "readonly"
+            },
+            {
+              "name": "form",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
+              "fieldName": "form"
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the textarea a required field.",
+              "fieldName": "required"
+            },
+            {
+              "name": "minlength",
+              "type": {
+                "text": "number"
+              },
+              "description": "The minimum length of input that will be considered valid.",
+              "fieldName": "minlength"
+            },
+            {
+              "name": "maxlength",
+              "type": {
+                "text": "number"
+              },
+              "description": "The maximum length of input that will be considered valid.",
+              "fieldName": "maxlength"
+            },
+            {
+              "name": "autocapitalize",
+              "type": {
+                "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
+              },
+              "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
+              "fieldName": "autocapitalize"
+            },
+            {
+              "name": "autocorrect",
               "type": {
-                "text": "TableProps<TData>['dataSource']"
+                "text": "string"
               },
-              "default": "[]",
-              "fieldName": "dataSource"
+              "description": "Indicates whether the browser's autocorrect feature is on or off.",
+              "fieldName": "autocorrect"
             },
             {
-              "name": "loading",
+              "name": "autocomplete",
               "type": {
-                "text": "TableProps<TData>['loading']"
+                "text": "string"
               },
-              "default": "false",
-              "fieldName": "loading"
+              "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
+              "fieldName": "autocomplete"
             },
             {
-              "name": "bordered",
+              "name": "autofocus",
               "type": {
-                "text": "TableProps<TData>['bordered']"
+                "text": "boolean"
               },
-              "default": "false",
-              "fieldName": "bordered"
+              "description": "Indicates that the input should receive focus on page load.",
+              "fieldName": "autofocus"
             },
             {
-              "name": "direction",
+              "name": "enterkeyhint",
               "type": {
-                "text": "TableProps<TData>['direction'] | undefined"
+                "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
               },
-              "default": "'ltr'",
-              "fieldName": "direction"
+              "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
+              "fieldName": "enterkeyhint"
             },
             {
-              "name": "show-header",
+              "name": "spellcheck",
               "type": {
-                "text": "TableProps<TData>['showHeader']"
+                "text": "boolean"
               },
               "default": "true",
-              "fieldName": "showHeader"
+              "description": "Enables spell checking on the textarea.",
+              "fieldName": "spellcheck"
             },
             {
-              "name": "rowSelection",
+              "name": "inputmode",
               "type": {
-                "text": "TableRowSelection<TData> | undefined"
+                "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
               },
-              "fieldName": "rowSelection"
+              "description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
+              "fieldName": "inputmode"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "tagNameWithoutPrefix": "table",
-          "tagName": "sl-table",
-          "customElement": true
+          "summary": "Textareas collect data from the user and allow multiple lines of text.",
+          "tagNameWithoutPrefix": "textarea",
+          "tagName": "sl-textarea",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @documentation https://shoelace.style/components/textarea\n * @status stable\n * @since 2.0\n *\n * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event sl-blur - Emitted when the control loses focus.\n * @event sl-change - Emitted when an alteration to the control's value is committed by the user.\n * @event sl-focus - Emitted when the control gains focus.\n * @event sl-input - Emitted when the control receives input.\n * @event sl-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart textarea - The internal `<textarea>` control.\n */",
+          "documentation": "https://shoelace.style/components/textarea",
+          "status": "stable",
+          "since": "2.0"
         }
       ],
       "exports": [
@@ -16462,32 +17916,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlTable",
-            "module": "components/table/table.js"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./spinner-container.js"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./head-table.js"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./body-table.js"
+            "name": "SlTextarea",
+            "module": "components/textarea/textarea.js"
           }
         }
       ]
@@ -16666,391 +18096,284 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/textarea/textarea.js",
+      "path": "components/time-panel/time-panel.js",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/timepicker/timepicker.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlTextarea",
-          "cssParts": [
-            {
-              "description": "The form control that wraps the label, input, and help text.",
-              "name": "form-control"
-            },
-            {
-              "description": "The label's wrapper.",
-              "name": "form-control-label"
-            },
+          "name": "SlTimePicker",
+          "slots": [
             {
-              "description": "The input's wrapper.",
-              "name": "form-control-input"
+              "description": "The input's label. Alternatively, you can use the `label` attribute.",
+              "name": "label"
             },
             {
-              "description": "The help text's wrapper.",
-              "name": "form-control-help-text"
+              "description": "The input's prefix, to prepend to the input.",
+              "name": "prefix"
             },
             {
-              "description": "The component's base wrapper.",
-              "name": "base"
+              "description": "The input's suffix, to append to the input.",
+              "name": "suffix"
             },
             {
-              "description": "The internal `<textarea>` control.",
-              "name": "textarea"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The textarea's label. Alternatively, you can use the `label` attribute.",
-              "name": "label"
+              "description": "An icon to use in lieu of the default clear icon.",
+              "name": "clear-icon"
             },
             {
-              "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
+              "description": "Help text that describes the input. Alternatively, you can use the `help-text` attribute.",
               "name": "help-text"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "formControlController",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new FormControlController(this, { assumeInteractionOn: ['sl-blur', 'sl-input'] })"
-            },
-            {
-              "kind": "field",
-              "name": "hasSlotController",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new HasSlotController(this, 'help-text', 'label')"
-            },
-            {
-              "kind": "field",
-              "name": "resizeObserver",
+              "name": "dependencies",
               "type": {
-                "text": "ResizeObserver"
+                "text": "object"
               },
-              "privacy": "private"
+              "static": true,
+              "default": "{ 'sl-input': SlInput as unknown as typeof ShoelaceElement, 'sl-popup': SlPopup, 'sl-time-panel': SlTimePanel }"
             },
             {
               "kind": "field",
               "name": "input",
               "type": {
-                "text": "HTMLTextAreaElement"
+                "text": "SlInput"
               }
             },
             {
               "kind": "field",
-              "name": "sizeAdjuster",
+              "name": "timePanel",
               "type": {
-                "text": "HTMLTextAreaElement"
+                "text": "SlTimePanel"
               }
             },
             {
               "kind": "field",
-              "name": "hasFocus",
-              "type": {
-                "text": "boolean"
-              },
+              "name": "formControlController",
               "privacy": "private",
-              "default": "false"
-            },
-            {
-              "kind": "field",
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "attribute": "title"
+              "readonly": true,
+              "default": "new FormControlController(this)"
             },
             {
               "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The name of the textarea, submitted as a name/value pair with form data.",
-              "attribute": "name"
+              "name": "hasSlotController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new HasSlotController( this, 'help-text', 'label', 'prefix', 'suffix', 'clear-icon' )"
             },
             {
               "kind": "field",
-              "name": "value",
+              "name": "lastValidValue",
               "type": {
                 "text": "string"
               },
-              "default": "''",
-              "description": "The current value of the textarea, submitted as a name/value pair with form data.",
-              "attribute": "value"
-            },
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "'small' | 'medium' | 'large'"
-              },
-              "default": "'medium'",
-              "description": "The textarea's size.",
-              "attribute": "size",
-              "reflects": true
+              "privacy": "private",
+              "default": "''"
             },
             {
               "kind": "field",
-              "name": "filled",
+              "name": "open",
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "Draws a filled textarea.",
-              "attribute": "filled",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The textarea's label. If you need to display HTML, use the `label` slot instead.",
-              "attribute": "label"
-            },
-            {
-              "kind": "field",
-              "name": "helpText",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The textarea's help text. If you need to display HTML, use the `help-text` slot instead.",
-              "attribute": "help-text"
+              "privacy": "private",
+              "default": "false"
             },
             {
               "kind": "field",
-              "name": "placeholder",
+              "name": "value",
               "type": {
                 "text": "string"
-              },
-              "default": "''",
-              "description": "Placeholder text to show as a hint when the input is empty.",
-              "attribute": "placeholder"
-            },
-            {
-              "kind": "field",
-              "name": "rows",
-              "type": {
-                "text": "number"
-              },
-              "default": "4",
-              "description": "The number of rows to display by default.",
-              "attribute": "rows"
-            },
-            {
-              "kind": "field",
-              "name": "resize",
-              "type": {
-                "text": "'none' | 'vertical' | 'auto'"
-              },
-              "default": "'vertical'",
-              "description": "Controls how the textarea can be resized.",
-              "attribute": "resize"
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the textarea.",
-              "attribute": "disabled",
-              "reflects": true
+              },
+              "default": "''",
+              "attribute": "value"
             },
             {
               "kind": "field",
-              "name": "readonly",
+              "name": "defaultValue",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Makes the textarea readonly.",
-              "attribute": "readonly",
-              "reflects": true
+              "default": "''"
             },
             {
               "kind": "field",
-              "name": "form",
+              "name": "name",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
-              "attribute": "form",
-              "reflects": true
+              "attribute": "name"
             },
             {
               "kind": "field",
-              "name": "required",
+              "name": "placeholder",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Makes the textarea a required field.",
-              "attribute": "required",
-              "reflects": true
+              "default": "''",
+              "attribute": "placeholder"
             },
             {
               "kind": "field",
-              "name": "minlength",
+              "name": "label",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "description": "The minimum length of input that will be considered valid.",
-              "attribute": "minlength"
+              "default": "''",
+              "attribute": "label"
             },
             {
               "kind": "field",
-              "name": "maxlength",
+              "name": "disabled",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "description": "The maximum length of input that will be considered valid.",
-              "attribute": "maxlength"
+              "default": "false",
+              "attribute": "disabled"
             },
             {
               "kind": "field",
-              "name": "autocapitalize",
+              "name": "readonly",
               "type": {
-                "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
+                "text": "boolean"
               },
-              "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
-              "attribute": "autocapitalize"
+              "default": "false",
+              "attribute": "readonly"
             },
             {
               "kind": "field",
-              "name": "autocorrect",
+              "name": "clearable",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "description": "Indicates whether the browser's autocorrect feature is on or off.",
-              "attribute": "autocorrect"
+              "default": "true",
+              "attribute": "clearable"
             },
             {
               "kind": "field",
-              "name": "autocomplete",
+              "name": "size",
               "type": {
-                "text": "string"
+                "text": "'small' | 'medium' | 'large'"
               },
-              "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
-              "attribute": "autocomplete"
+              "default": "'medium'",
+              "attribute": "size",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "autofocus",
+              "name": "hoist",
               "type": {
                 "text": "boolean"
               },
-              "description": "Indicates that the input should receive focus on page load.",
-              "attribute": "autofocus"
+              "default": "false",
+              "attribute": "hoist"
             },
             {
               "kind": "field",
-              "name": "enterkeyhint",
+              "name": "filled",
               "type": {
-                "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
+                "text": "boolean"
               },
-              "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
-              "attribute": "enterkeyhint"
+              "default": "false",
+              "attribute": "filled",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "spellcheck",
+              "name": "pill",
               "type": {
                 "text": "boolean"
               },
-              "default": "true",
-              "description": "Enables spell checking on the textarea.",
-              "attribute": "spellcheck"
+              "default": "false",
+              "attribute": "pill",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "inputmode",
+              "name": "helpText",
               "type": {
-                "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
+                "text": "string"
               },
-              "description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
-              "attribute": "inputmode"
+              "default": "''",
+              "attribute": "help-text"
             },
             {
               "kind": "field",
-              "name": "defaultValue",
+              "name": "form",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "The default value of the form control. Primarily used for resetting the form control."
+              "attribute": "form",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "validity",
-              "description": "Gets the validity state object",
-              "readonly": true
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "required",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "validationMessage",
-              "description": "Gets the validation message",
-              "readonly": true
+              "name": "format",
+              "type": {
+                "text": "string"
+              },
+              "default": "'HH:mm:ss'",
+              "attribute": "format"
             },
             {
-              "kind": "method",
-              "name": "handleBlur",
-              "privacy": "private"
+              "kind": "field",
+              "name": "autofocus",
+              "type": {
+                "text": "boolean"
+              },
+              "attribute": "autofocus"
             },
             {
               "kind": "method",
-              "name": "handleChange",
-              "privacy": "private"
+              "name": "handleOpenChange"
             },
             {
               "kind": "method",
-              "name": "handleFocus",
-              "privacy": "private"
+              "name": "checkValidity"
             },
             {
               "kind": "method",
-              "name": "handleInput",
-              "privacy": "private"
+              "name": "reportValidity"
             },
             {
               "kind": "method",
-              "name": "handleInvalid",
-              "privacy": "private",
+              "name": "setCustomValidity",
               "parameters": [
                 {
-                  "name": "event",
+                  "name": "message",
                   "type": {
-                    "text": "Event"
+                    "text": "string"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "setTextareaHeight",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "handleDisabledChange"
-            },
-            {
-              "kind": "method",
-              "name": "handleRowsChange"
-            },
-            {
-              "kind": "method",
-              "name": "handleValueChange"
+              "name": "getForm",
+              "return": {
+                "type": {
+                  "text": "HTMLFormElement | null"
+                }
+              }
             },
             {
               "kind": "method",
@@ -17064,144 +18387,172 @@
                   }
                 }
               ],
-              "description": "Sets focus on the textarea."
+              "description": "Sets focus on the datepicker."
             },
             {
               "kind": "method",
               "name": "blur",
-              "description": "Removes focus from the textarea."
+              "description": "Removes focus from the datepicker."
             },
             {
-              "kind": "method",
-              "name": "select",
-              "description": "Selects all the text in the textarea."
+              "kind": "field",
+              "name": "validity",
+              "readonly": true
             },
             {
-              "kind": "method",
-              "name": "scrollPosition",
-              "return": {
-                "type": {
-                  "text": "{ top: number; left: number } | undefined"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "position",
-                  "optional": true,
-                  "type": {
-                    "text": "{ top?: number; left?: number }"
-                  }
-                }
-              ],
-              "description": "Gets or sets the textarea's scroll position."
+              "kind": "field",
+              "name": "validationMessage",
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "setSelectionRange",
+              "name": "updateValue",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "selectionStart",
-                  "type": {
-                    "text": "number"
-                  }
-                },
-                {
-                  "name": "selectionEnd",
+                  "name": "value",
                   "type": {
-                    "text": "number"
+                    "text": "string"
                   }
                 },
                 {
-                  "name": "selectionDirection",
-                  "default": "'none'",
+                  "name": "options",
+                  "optional": true,
                   "type": {
-                    "text": "'forward' | 'backward' | 'none'"
+                    "text": "{ emitInput?: boolean; emitChange?: boolean }"
                   }
                 }
-              ],
-              "description": "Sets the start and end positions of the text selection (0-based)."
+              ]
             },
             {
               "kind": "method",
-              "name": "setRangeText",
+              "name": "parseValue",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "Date | null"
+                }
+              },
               "parameters": [
                 {
-                  "name": "replacement",
+                  "name": "value",
                   "type": {
                     "text": "string"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleTimeChange",
+              "privacy": "private",
+              "parameters": [
                 {
-                  "name": "start",
-                  "optional": true,
+                  "name": "event",
                   "type": {
-                    "text": "number"
+                    "text": "CustomEvent<{ value: Date }>"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleTimeSelect",
+              "privacy": "private",
+              "parameters": [
                 {
-                  "name": "end",
-                  "optional": true,
+                  "name": "event",
                   "type": {
-                    "text": "number"
+                    "text": "CustomEvent<{ value: Date }>"
                   }
-                },
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleTriggerMouseDown",
+              "privacy": "private",
+              "parameters": [
                 {
-                  "name": "selectMode",
-                  "default": "'preserve'",
+                  "name": "event",
                   "type": {
-                    "text": "'select' | 'start' | 'end' | 'preserve'"
+                    "text": "MouseEvent"
                   }
                 }
-              ],
-              "description": "Replaces a range of text with a new string."
+              ]
             },
             {
               "kind": "method",
-              "name": "checkValidity",
-              "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
+              "name": "openCalendar",
+              "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "getForm",
-              "return": {
-                "type": {
-                  "text": "HTMLFormElement | null"
+              "name": "handleSuffixClick",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleInputChange",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "CustomEvent"
+                  }
                 }
-              },
-              "description": "Gets the associated form, if one exists."
+              ]
             },
             {
               "kind": "method",
-              "name": "reportValidity",
-              "description": "Checks for validity and shows the browser's validation message if the control is invalid."
+              "name": "handleInputInput",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "CustomEvent"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "setCustomValidity",
+              "name": "handleInputKeyDown",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "message",
+                  "name": "event",
                   "type": {
-                    "text": "string"
+                    "text": "KeyboardEvent"
                   }
                 }
-              ],
-              "description": "Sets a custom validation message. Pass an empty string to restore validity."
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleInputBlur",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleValueChange"
             }
           ],
           "events": [
             {
-              "description": "Emitted when the control loses focus.",
-              "name": "sl-blur",
-              "reactName": "onSlBlur",
-              "eventName": "SlBlurEvent"
-            },
-            {
-              "description": "Emitted when an alteration to the control's value is committed by the user.",
+              "description": "Emitted when the control's value changes.",
               "name": "sl-change",
               "reactName": "onSlChange",
               "eventName": "SlChangeEvent"
             },
+            {
+              "description": "Emitted when the control's value changes.",
+              "name": "sl-input",
+              "reactName": "onSlInput",
+              "eventName": "SlInputEvent"
+            },
             {
               "description": "Emitted when the control gains focus.",
               "name": "sl-focus",
@@ -17209,26 +18560,26 @@
               "eventName": "SlFocusEvent"
             },
             {
-              "description": "Emitted when the control receives input.",
-              "name": "sl-input",
-              "reactName": "onSlInput",
-              "eventName": "SlInputEvent"
+              "description": "Emitted when the control loses focus.",
+              "name": "sl-blur",
+              "reactName": "onSlBlur",
+              "eventName": "SlBlurEvent"
             },
             {
-              "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
-              "name": "sl-invalid",
-              "reactName": "onSlInvalid",
-              "eventName": "SlInvalidEvent"
+              "description": "Emitted when the clear button is activated.",
+              "name": "sl-clear",
+              "reactName": "onSlClear",
+              "eventName": "SlClearEvent"
             }
           ],
           "attributes": [
             {
-              "name": "title",
+              "name": "value",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "fieldName": "title"
+              "fieldName": "value"
             },
             {
               "name": "name",
@@ -17236,35 +18587,15 @@
                 "text": "string"
               },
               "default": "''",
-              "description": "The name of the textarea, submitted as a name/value pair with form data.",
               "fieldName": "name"
             },
             {
-              "name": "value",
+              "name": "placeholder",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "The current value of the textarea, submitted as a name/value pair with form data.",
-              "fieldName": "value"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "'small' | 'medium' | 'large'"
-              },
-              "default": "'medium'",
-              "description": "The textarea's size.",
-              "fieldName": "size"
-            },
-            {
-              "name": "filled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Draws a filled textarea.",
-              "fieldName": "filled"
+              "fieldName": "placeholder"
             },
             {
               "name": "label",
@@ -17272,52 +18603,14 @@
                 "text": "string"
               },
               "default": "''",
-              "description": "The textarea's label. If you need to display HTML, use the `label` slot instead.",
               "fieldName": "label"
             },
-            {
-              "name": "help-text",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The textarea's help text. If you need to display HTML, use the `help-text` slot instead.",
-              "fieldName": "helpText"
-            },
-            {
-              "name": "placeholder",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Placeholder text to show as a hint when the input is empty.",
-              "fieldName": "placeholder"
-            },
-            {
-              "name": "rows",
-              "type": {
-                "text": "number"
-              },
-              "default": "4",
-              "description": "The number of rows to display by default.",
-              "fieldName": "rows"
-            },
-            {
-              "name": "resize",
-              "type": {
-                "text": "'none' | 'vertical' | 'auto'"
-              },
-              "default": "'vertical'",
-              "description": "Controls how the textarea can be resized.",
-              "fieldName": "resize"
-            },
             {
               "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables the textarea.",
               "fieldName": "disabled"
             },
             {
@@ -17326,113 +18619,104 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Makes the textarea readonly.",
               "fieldName": "readonly"
             },
             {
-              "name": "form",
+              "name": "clearable",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "''",
-              "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
-              "fieldName": "form"
+              "default": "true",
+              "fieldName": "clearable"
             },
             {
-              "name": "required",
+              "name": "size",
               "type": {
-                "text": "boolean"
+                "text": "'small' | 'medium' | 'large'"
               },
-              "default": "false",
-              "description": "Makes the textarea a required field.",
-              "fieldName": "required"
+              "default": "'medium'",
+              "fieldName": "size"
             },
             {
-              "name": "minlength",
+              "name": "hoist",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "description": "The minimum length of input that will be considered valid.",
-              "fieldName": "minlength"
+              "default": "false",
+              "fieldName": "hoist"
             },
             {
-              "name": "maxlength",
+              "name": "filled",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "description": "The maximum length of input that will be considered valid.",
-              "fieldName": "maxlength"
+              "default": "false",
+              "fieldName": "filled"
             },
             {
-              "name": "autocapitalize",
+              "name": "pill",
               "type": {
-                "text": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'"
+                "text": "boolean"
               },
-              "description": "Controls whether and how text input is automatically capitalized as it is entered by the user.",
-              "fieldName": "autocapitalize"
+              "default": "false",
+              "fieldName": "pill"
             },
             {
-              "name": "autocorrect",
+              "name": "help-text",
               "type": {
                 "text": "string"
               },
-              "description": "Indicates whether the browser's autocorrect feature is on or off.",
-              "fieldName": "autocorrect"
+              "default": "''",
+              "fieldName": "helpText"
             },
             {
-              "name": "autocomplete",
+              "name": "form",
               "type": {
                 "text": "string"
               },
-              "description": "Specifies what permission the browser has to provide assistance in filling out form field values. Refer to\n[this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.",
-              "fieldName": "autocomplete"
+              "default": "''",
+              "fieldName": "form"
             },
             {
-              "name": "autofocus",
+              "name": "required",
               "type": {
                 "text": "boolean"
               },
-              "description": "Indicates that the input should receive focus on page load.",
-              "fieldName": "autofocus"
+              "default": "false",
+              "fieldName": "required"
             },
             {
-              "name": "enterkeyhint",
+              "name": "format",
               "type": {
-                "text": "'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send'"
+                "text": "string"
               },
-              "description": "Used to customize the label or icon of the Enter key on virtual keyboards.",
-              "fieldName": "enterkeyhint"
+              "default": "'HH:mm:ss'",
+              "fieldName": "format"
             },
             {
-              "name": "spellcheck",
+              "name": "autofocus",
               "type": {
                 "text": "boolean"
               },
-              "default": "true",
-              "description": "Enables spell checking on the textarea.",
-              "fieldName": "spellcheck"
-            },
-            {
-              "name": "inputmode",
-              "type": {
-                "text": "'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'"
-              },
-              "description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
-              "fieldName": "inputmode"
+              "fieldName": "autofocus"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Textareas collect data from the user and allow multiple lines of text.",
-          "tagNameWithoutPrefix": "textarea",
-          "tagName": "sl-textarea",
+          "tagName": "sl-timepicker",
+          "summary": "A time picker component that provides a time selection interface.",
+          "tagNameWithoutPrefix": "timepicker",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Textareas collect data from the user and allow multiple lines of text.\n * @documentation https://shoelace.style/components/textarea\n * @status stable\n * @since 2.0\n *\n * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.\n * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event sl-blur - Emitted when the control loses focus.\n * @event sl-change - Emitted when an alteration to the control's value is committed by the user.\n * @event sl-focus - Emitted when the control gains focus.\n * @event sl-input - Emitted when the control receives input.\n * @event sl-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart form-control - The form control that wraps the label, input, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The input's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart base - The component's base wrapper.\n * @csspart textarea - The internal `<textarea>` control.\n */",
-          "documentation": "https://shoelace.style/components/textarea",
-          "status": "stable",
-          "since": "2.0"
+          "jsDoc": "/**\n * @summary A time picker component that provides a time selection interface.\n * @documentation https://shoelace.style/components/timepicker\n * @tag sl-timepicker\n * @since 2.0\n *\n * @dependency sl-input\n * @dependency sl-popup\n * @dependency sl-time-panel\n *\n * @slot label - The input's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - The input's prefix, to prepend to the input.\n * @slot suffix - The input's suffix, to append to the input.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot help-text - Help text that describes the input. Alternatively, you can use the `help-text` attribute.\n *\n * @event sl-change - Emitted when the control's value changes.\n * @event sl-input - Emitted when the control's value changes.\n * @event sl-focus - Emitted when the control gains focus.\n * @event sl-blur - Emitted when the control loses focus.\n * @event sl-clear - Emitted when the clear button is activated.\n */",
+          "documentation": "https://shoelace.style/components/timepicker",
+          "since": "2.0",
+          "dependencies": [
+            "sl-input",
+            "sl-popup",
+            "sl-time-panel"
+          ]
         }
       ],
       "exports": [
@@ -17440,8 +18724,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlTextarea",
-            "module": "components/textarea/textarea.js"
+            "name": "SlTimePicker",
+            "module": "components/timepicker/timepicker.js"
           }
         }
       ]
@@ -18579,7 +19863,7 @@
   "package": {
     "name": "@kdcloudjs/shoelace",
     "description": "A forward-thinking library of web components.",
-    "version": "1.0.0",
+    "version": "1.0.1",
     "license": "MIT"
   }
 }