@kdcloudjs/shoelace 1.0.27 → 1.0.28

package/dist/custom-elements.json

@@ -871,115 +871,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/badge/badge.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlBadge",
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The badge's content.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
-              },
-              "default": "'primary'",
-              "description": "The badge's theme variant.",
-              "attribute": "variant",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "pill",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Draws a pill-style badge with rounded edges.",
-              "attribute": "pill",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "pulse",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Makes the badge pulsate to draw attention.",
-              "attribute": "pulse",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "variant",
-              "type": {
-                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
-              },
-              "default": "'primary'",
-              "description": "The badge's theme variant.",
-              "fieldName": "variant"
-            },
-            {
-              "name": "pill",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Draws a pill-style badge with rounded edges.",
-              "fieldName": "pill"
-            },
-            {
-              "name": "pulse",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Makes the badge pulsate to draw attention.",
-              "fieldName": "pulse"
-            }
-          ],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "Badges are used to draw attention and display statuses or counts.",
-          "tagNameWithoutPrefix": "badge",
-          "tagName": "sl-badge",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://shoelace.style/components/badge\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */",
-          "documentation": "https://shoelace.style/components/badge",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlBadge",
-            "module": "components/badge/badge.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/avatar/avatar.js",
@@ -1183,12 +1074,12 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/breadcrumb/breadcrumb.js",
+      "path": "components/badge/badge.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlBreadcrumb",
+          "name": "SlBadge",
           "cssParts": [
             {
               "description": "The component's base wrapper.",
@@ -1197,97 +1088,86 @@
           ],
           "slots": [
             {
-              "description": "One or more breadcrumb items to display.",
+              "description": "The badge's content.",
               "name": ""
-            },
-            {
-              "description": "The separator to use between breadcrumb items. Works best with `<sl-icon>`.",
-              "name": "separator"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "dependencies",
+              "name": "variant",
               "type": {
-                "text": "object"
+                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
               },
-              "static": true,
-              "default": "{ 'sl-icon': SlIcon }"
-            },
-            {
-              "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
-            },
-            {
-              "kind": "field",
-              "name": "separatorDir",
-              "privacy": "private"
+              "default": "'primary'",
+              "description": "The badge's theme variant.",
+              "attribute": "variant",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "defaultSlot",
+              "name": "pill",
               "type": {
-                "text": "HTMLSlotElement"
-              }
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws a pill-style badge with rounded edges.",
+              "attribute": "pill",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "separatorSlot",
+              "name": "pulse",
               "type": {
-                "text": "HTMLSlotElement"
-              }
-            },
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the badge pulsate to draw attention.",
+              "attribute": "pulse",
+              "reflects": true
+            }
+          ],
+          "attributes": [
             {
-              "kind": "field",
-              "name": "label",
+              "name": "variant",
               "type": {
-                "text": "string"
+                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
               },
-              "default": "''",
-              "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
-              "attribute": "label"
+              "default": "'primary'",
+              "description": "The badge's theme variant.",
+              "fieldName": "variant"
             },
             {
-              "kind": "method",
-              "name": "getSeparator",
-              "privacy": "private"
+              "name": "pill",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws a pill-style badge with rounded edges.",
+              "fieldName": "pill"
             },
             {
-              "kind": "method",
-              "name": "handleSlotChange",
-              "privacy": "private"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "label",
+              "name": "pulse",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "''",
-              "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
-              "fieldName": "label"
+              "default": "false",
+              "description": "Makes the badge pulsate to draw attention.",
+              "fieldName": "pulse"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
-          "tagNameWithoutPrefix": "breadcrumb",
-          "tagName": "sl-breadcrumb",
+          "summary": "Badges are used to draw attention and display statuses or counts.",
+          "tagNameWithoutPrefix": "badge",
+          "tagName": "sl-badge",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n * @documentation https://shoelace.style/components/breadcrumb\n * @status stable\n * @since 2.0\n *\n * @slot - One or more breadcrumb items to display.\n * @slot separator - The separator to use between breadcrumb items. Works best with `<sl-icon>`.\n *\n * @dependency sl-icon\n *\n * @csspart base - The component's base wrapper.\n */",
-          "documentation": "https://shoelace.style/components/breadcrumb",
+          "jsDoc": "/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://shoelace.style/components/badge\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */",
+          "documentation": "https://shoelace.style/components/badge",
           "status": "stable",
-          "since": "2.0",
-          "dependencies": [
-            "sl-icon"
-          ]
+          "since": "2.0"
         }
       ],
       "exports": [
@@ -1295,8 +1175,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlBreadcrumb",
-            "module": "components/breadcrumb/breadcrumb.js"
+            "name": "SlBadge",
+            "module": "components/badge/badge.js"
           }
         }
       ]
@@ -2143,12 +2023,12 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/button-group/button-group.js",
+      "path": "components/breadcrumb/breadcrumb.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlButtonGroup",
+          "name": "SlBreadcrumb",
           "cssParts": [
             {
               "description": "The component's base wrapper.",
@@ -2157,29 +2037,149 @@
           ],
           "slots": [
             {
-              "description": "One or more `<sl-button>` elements to display in the button group.",
+              "description": "One or more breadcrumb items to display.",
               "name": ""
+            },
+            {
+              "description": "The separator to use between breadcrumb items. Works best with `<sl-icon>`.",
+              "name": "separator"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "defaultSlot",
+              "name": "dependencies",
               "type": {
-                "text": "HTMLSlotElement"
-              }
+                "text": "object"
+              },
+              "static": true,
+              "default": "{ 'sl-icon': SlIcon }"
             },
             {
               "kind": "field",
-              "name": "disableRole",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
             },
             {
               "kind": "field",
-              "name": "label",
+              "name": "separatorDir",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "defaultSlot",
+              "type": {
+                "text": "HTMLSlotElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "separatorSlot",
+              "type": {
+                "text": "HTMLSlotElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
+              "attribute": "label"
+            },
+            {
+              "kind": "method",
+              "name": "getSeparator",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleSlotChange",
+              "privacy": "private"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
+              "fieldName": "label"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
+          "tagNameWithoutPrefix": "breadcrumb",
+          "tagName": "sl-breadcrumb",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n * @documentation https://shoelace.style/components/breadcrumb\n * @status stable\n * @since 2.0\n *\n * @slot - One or more breadcrumb items to display.\n * @slot separator - The separator to use between breadcrumb items. Works best with `<sl-icon>`.\n *\n * @dependency sl-icon\n *\n * @csspart base - The component's base wrapper.\n */",
+          "documentation": "https://shoelace.style/components/breadcrumb",
+          "status": "stable",
+          "since": "2.0",
+          "dependencies": [
+            "sl-icon"
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlBreadcrumb",
+            "module": "components/breadcrumb/breadcrumb.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/button-group/button-group.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlButtonGroup",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
+          "slots": [
+            {
+              "description": "One or more `<sl-button>` elements to display in the button group.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "defaultSlot",
+              "type": {
+                "text": "HTMLSlotElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disableRole",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "label",
               "type": {
                 "text": "string"
               },
@@ -2281,6 +2281,12 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/calendar/calendar.js",
+      "declarations": [],
+      "exports": []
+    },
     {
       "kind": "javascript-module",
       "path": "components/card/card.js",
@@ -2381,12 +2387,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/calendar/calendar.js",
-      "declarations": [],
-      "exports": []
-    },
     {
       "kind": "javascript-module",
       "path": "components/carousel/carousel.js",
@@ -5844,6 +5844,44 @@
               "privacy": "private"
             }
           ],
+          "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"
+            },
+            {
+              "description": "Emitted when the clear button is activated.",
+              "name": "sl-clear",
+              "reactName": "onSlClear",
+              "eventName": "SlClearEvent"
+            }
+          ],
           "attributes": [
             {
               "name": "type",
@@ -5881,9 +5919,22 @@
             "name": "PickerBase",
             "module": "/src/internal/picker.js"
           },
+          "summary": "Datepickers allow users to select a date using a calendar interface.",
           "tagNameWithoutPrefix": "datepicker",
           "tagName": "sl-datepicker",
-          "customElement": true
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Datepickers allow users to select a date using a calendar interface.\n * @documentation https://shoelace.style/components/datepicker\n * @status experimental\n * @since 2.0\n *\n * @dependency sl-button\n * @dependency sl-calendar\n * @dependency sl-date-panel\n * @dependency sl-drawer\n * @dependency sl-popup\n * @dependency sl-input\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 * @event sl-clear - Emitted when the clear button is activated.\n */",
+          "documentation": "https://shoelace.style/components/datepicker",
+          "status": "experimental",
+          "since": "2.0",
+          "dependencies": [
+            "sl-button",
+            "sl-calendar",
+            "sl-date-panel",
+            "sl-drawer",
+            "sl-popup",
+            "sl-input"
+          ]
         }
       ],
       "exports": [
@@ -9486,200 +9537,74 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/include/include.js",
+      "path": "components/icon-button/icon-button.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlInclude",
+          "name": "SlIconButton",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
           "members": [
             {
               "kind": "field",
-              "name": "src",
+              "name": "dependencies",
               "type": {
-                "text": "string"
+                "text": "object"
               },
-              "description": "The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
-              "attribute": "src"
+              "static": true,
+              "default": "{ 'sl-icon': SlIcon }"
             },
             {
               "kind": "field",
-              "name": "mode",
+              "name": "button",
               "type": {
-                "text": "'cors' | 'no-cors' | 'same-origin'"
-              },
-              "default": "'cors'",
-              "description": "The fetch mode to use.",
-              "attribute": "mode"
+                "text": "HTMLButtonElement | HTMLLinkElement"
+              }
             },
             {
               "kind": "field",
-              "name": "allowScripts",
+              "name": "hasFocus",
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
-              "attribute": "allow-scripts"
-            },
-            {
-              "kind": "method",
-              "name": "executeScript",
               "privacy": "private",
-              "parameters": [
-                {
-                  "name": "script",
-                  "type": {
-                    "text": "HTMLScriptElement"
-                  }
-                }
-              ]
+              "default": "false"
             },
             {
-              "kind": "method",
-              "name": "handleSrcChange"
-            }
-          ],
-          "events": [
-            {
-              "description": "Emitted when the included file is loaded.",
-              "name": "sl-load",
-              "reactName": "onSlLoad",
-              "eventName": "SlLoadEvent"
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The name of the icon to draw. Available names depend on the icon library being used.",
+              "attribute": "name"
             },
             {
+              "kind": "field",
+              "name": "library",
               "type": {
-                "text": "{ status: number }"
+                "text": "string | undefined"
               },
-              "description": "Emitted when the included file fails to load due to an error.",
-              "name": "sl-error",
-              "reactName": "onSlError",
-              "eventName": "SlErrorEvent"
-            }
-          ],
-          "attributes": [
+              "description": "The name of a registered custom icon library.",
+              "attribute": "library"
+            },
             {
+              "kind": "field",
               "name": "src",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "description": "The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
-              "fieldName": "src"
+              "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
+              "attribute": "src"
             },
             {
-              "name": "mode",
-              "type": {
-                "text": "'cors' | 'no-cors' | 'same-origin'"
-              },
-              "default": "'cors'",
-              "description": "The fetch mode to use.",
-              "fieldName": "mode"
-            },
-            {
-              "name": "allow-scripts",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
-              "fieldName": "allowScripts"
-            }
-          ],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "Includes give you the power to embed external HTML files into the page.",
-          "tagNameWithoutPrefix": "include",
-          "tagName": "sl-include",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Includes give you the power to embed external HTML files into the page.\n * @documentation https://shoelace.style/components/include\n * @status stable\n * @since 2.0\n *\n * @event sl-load - Emitted when the included file is loaded.\n * @event {{ status: number }} sl-error - Emitted when the included file fails to load due to an error.\n */",
-          "documentation": "https://shoelace.style/components/include",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlInclude",
-            "module": "components/include/include.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/icon-button/icon-button.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlIconButton",
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "dependencies",
-              "type": {
-                "text": "object"
-              },
-              "static": true,
-              "default": "{ 'sl-icon': SlIcon }"
-            },
-            {
-              "kind": "field",
-              "name": "button",
-              "type": {
-                "text": "HTMLButtonElement | HTMLLinkElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "hasFocus",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "private",
-              "default": "false"
-            },
-            {
-              "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The name of the icon to draw. Available names depend on the icon library being used.",
-              "attribute": "name"
-            },
-            {
-              "kind": "field",
-              "name": "library",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The name of a registered custom icon library.",
-              "attribute": "library"
-            },
-            {
-              "kind": "field",
-              "name": "src",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and\ncan result in XSS attacks.",
-              "attribute": "src"
-            },
-            {
-              "kind": "field",
-              "name": "href",
+              "kind": "field",
+              "name": "href",
               "type": {
                 "text": "string | undefined"
               },
@@ -9883,6 +9808,132 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/include/include.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlInclude",
+          "members": [
+            {
+              "kind": "field",
+              "name": "src",
+              "type": {
+                "text": "string"
+              },
+              "description": "The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
+              "attribute": "src"
+            },
+            {
+              "kind": "field",
+              "name": "mode",
+              "type": {
+                "text": "'cors' | 'no-cors' | 'same-origin'"
+              },
+              "default": "'cors'",
+              "description": "The fetch mode to use.",
+              "attribute": "mode"
+            },
+            {
+              "kind": "field",
+              "name": "allowScripts",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
+              "attribute": "allow-scripts"
+            },
+            {
+              "kind": "method",
+              "name": "executeScript",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "script",
+                  "type": {
+                    "text": "HTMLScriptElement"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleSrcChange"
+            }
+          ],
+          "events": [
+            {
+              "description": "Emitted when the included file is loaded.",
+              "name": "sl-load",
+              "reactName": "onSlLoad",
+              "eventName": "SlLoadEvent"
+            },
+            {
+              "type": {
+                "text": "{ status: number }"
+              },
+              "description": "Emitted when the included file fails to load due to an error.",
+              "name": "sl-error",
+              "reactName": "onSlError",
+              "eventName": "SlErrorEvent"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "src",
+              "type": {
+                "text": "string"
+              },
+              "description": "The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
+              "fieldName": "src"
+            },
+            {
+              "name": "mode",
+              "type": {
+                "text": "'cors' | 'no-cors' | 'same-origin'"
+              },
+              "default": "'cors'",
+              "description": "The fetch mode to use.",
+              "fieldName": "mode"
+            },
+            {
+              "name": "allow-scripts",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as\ncode and can result in XSS attacks.",
+              "fieldName": "allowScripts"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "Includes give you the power to embed external HTML files into the page.",
+          "tagNameWithoutPrefix": "include",
+          "tagName": "sl-include",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Includes give you the power to embed external HTML files into the page.\n * @documentation https://shoelace.style/components/include\n * @status stable\n * @since 2.0\n *\n * @event sl-load - Emitted when the included file is loaded.\n * @event {{ status: number }} sl-error - Emitted when the included file fails to load due to an error.\n */",
+          "documentation": "https://shoelace.style/components/include",
+          "status": "stable",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlInclude",
+            "module": "components/include/include.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/input/input.js",
@@ -10948,136 +10999,20 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/menu/menu.js",
+      "path": "components/menu-item/menu-item.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlMenu",
-          "slots": [
+          "name": "SlMenuItem",
+          "cssProperties": [
             {
-              "description": "The menu's content, including menu items, menu labels, and dividers.",
-              "name": ""
+              "description": "The distance submenus shift to overlap the parent menu.",
+              "name": "--submenu-offset",
+              "default": "-2px"
             }
           ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "defaultSlot",
-              "type": {
-                "text": "HTMLSlotElement"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "handleClick",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "MouseEvent"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "handleMouseDown",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "MouseEvent"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "handleSlotChange",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "isMenuItem",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "item",
-                  "type": {
-                    "text": "HTMLElement"
-                  }
-                }
-              ]
-            }
-          ],
-          "events": [
-            {
-              "type": {
-                "text": "{ item: SlMenuItem }"
-              },
-              "description": "Emitted when a menu item is selected.",
-              "name": "sl-select",
-              "reactName": "onSlSelect",
-              "eventName": "SlSelectEvent"
-            }
-          ],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "Menus provide a list of options for the user to choose from.",
-          "tagNameWithoutPrefix": "menu",
-          "tagName": "sl-menu",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Menus provide a list of options for the user to choose from.\n * @documentation https://shoelace.style/components/menu\n * @status stable\n * @since 2.0\n *\n * @slot - The menu's content, including menu items, menu labels, and dividers.\n *\n * @event {{ item: SlMenuItem }} sl-select - Emitted when a menu item is selected.\n */",
-          "documentation": "https://shoelace.style/components/menu",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlMenu",
-            "module": "components/menu/menu.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/menu-item/menu-item.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlMenuItem",
-          "cssProperties": [
-            {
-              "description": "The distance submenus shift to overlap the parent menu.",
-              "name": "--submenu-offset",
-              "default": "-2px"
-            }
-          ],
-          "cssParts": [
+          "cssParts": [
             {
               "description": "The component's base wrapper.",
               "name": "base"
@@ -11353,35 +11288,105 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/menu-label/menu-label.js",
+      "path": "components/menu/menu.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlMenuLabel",
-          "cssParts": [
+          "name": "SlMenu",
+          "slots": [
             {
-              "description": "The component's base wrapper.",
-              "name": "base"
+              "description": "The menu's content, including menu items, menu labels, and dividers.",
+              "name": ""
             }
           ],
-          "slots": [
+          "members": [
             {
-              "description": "The menu label's content.",
-              "name": ""
+              "kind": "field",
+              "name": "defaultSlot",
+              "type": {
+                "text": "HTMLSlotElement"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "handleClick",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleKeyDown",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleMouseDown",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "MouseEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "handleSlotChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "isMenuItem",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "item",
+                  "type": {
+                    "text": "HTMLElement"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "type": {
+                "text": "{ item: SlMenuItem }"
+              },
+              "description": "Emitted when a menu item is selected.",
+              "name": "sl-select",
+              "reactName": "onSlSelect",
+              "eventName": "SlSelectEvent"
             }
           ],
-          "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",
+          "summary": "Menus provide a list of options for the user to choose from.",
+          "tagNameWithoutPrefix": "menu",
+          "tagName": "sl-menu",
           "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",
+          "jsDoc": "/**\n * @summary Menus provide a list of options for the user to choose from.\n * @documentation https://shoelace.style/components/menu\n * @status stable\n * @since 2.0\n *\n * @slot - The menu's content, including menu items, menu labels, and dividers.\n *\n * @event {{ item: SlMenuItem }} sl-select - Emitted when a menu item is selected.\n */",
+          "documentation": "https://shoelace.style/components/menu",
           "status": "stable",
           "since": "2.0"
         }
@@ -11391,8 +11396,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlMenuLabel",
-            "module": "components/menu-label/menu-label.js"
+            "name": "SlMenu",
+            "module": "components/menu/menu.js"
           }
         }
       ]
@@ -11602,165 +11607,49 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/nav-group/nav-group.js",
+      "path": "components/nav/nav.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlNavGroup",
+          "name": "SlNav",
           "cssParts": [
             {
               "description": "The component's base wrapper.",
               "name": "base"
-            },
-            {
-              "description": "The nav group title.",
-              "name": "title"
-            },
-            {
-              "description": "The nav group body.",
-              "name": "body"
             }
           ],
           "slots": [
             {
-              "description": "The nav items within the group.",
+              "description": "The nav items.",
               "name": ""
-            },
-            {
-              "description": "The nav group's title.",
-              "name": "title"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "hasSlotController",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new HasSlotController(this, 'title')"
+              "name": "dependencies",
+              "type": {
+                "text": "object"
+              },
+              "static": true,
+              "default": "{ 'sl-divider': SlDivider, 'sl-nav-group': SlNavGroup, 'sl-nav-item': SlNavItem, 'sl-nav-submenu': SlNavSubmenu }"
             },
             {
               "kind": "field",
-              "name": "label",
+              "name": "defaultSlot",
               "type": {
-                "text": "unknown | undefined"
-              },
-              "description": "Matches Antd's item group label."
+                "text": "HTMLSlotElement | undefined"
+              }
             },
             {
               "kind": "field",
-              "name": "active",
+              "name": "hasInitializedState",
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "Draws the nav group in an active (selected) state.",
-              "attribute": "active",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "mode",
-              "type": {
-                "text": "'horizontal' | 'inline' | 'vertical'"
-              },
-              "default": "'inline'",
-              "description": "The mode of navigation.",
-              "attribute": "mode",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "active",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Draws the nav group in an active (selected) state.",
-              "fieldName": "active"
-            },
-            {
-              "name": "mode",
-              "type": {
-                "text": "'horizontal' | 'inline' | 'vertical'"
-              },
-              "default": "'inline'",
-              "description": "The mode of navigation.",
-              "fieldName": "mode"
-            }
-          ],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "Nav groups are used to group related nav items.",
-          "tagNameWithoutPrefix": "nav-group",
-          "tagName": "sl-nav-group",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Nav groups are used to group related nav items.\n * @documentation https://shoelace.style/components/nav-group\n * @status experimental\n * @since 2.16\n *\n * @slot - The nav items within the group.\n * @slot title - The nav group's title.\n *\n * @csspart base - The component's base wrapper.\n * @csspart title - The nav group title.\n * @csspart body - The nav group body.\n */",
-          "documentation": "https://shoelace.style/components/nav-group",
-          "status": "experimental",
-          "since": "2.16"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlNavGroup",
-            "module": "components/nav-group/nav-group.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/nav/nav.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlNav",
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The nav items.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "dependencies",
-              "type": {
-                "text": "object"
-              },
-              "static": true,
-              "default": "{ 'sl-divider': SlDivider, 'sl-nav-group': SlNavGroup, 'sl-nav-item': SlNavItem, 'sl-nav-submenu': SlNavSubmenu }"
-            },
-            {
-              "kind": "field",
-              "name": "defaultSlot",
-              "type": {
-                "text": "HTMLSlotElement | undefined"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "hasInitializedState",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "private",
-              "default": "false"
+              "privacy": "private",
+              "default": "false"
             },
             {
               "kind": "field",
@@ -12537,42 +12426,80 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/nav-item/nav-item.js",
+      "path": "components/menu-label/menu-label.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlNavItem",
+          "name": "SlMenuLabel",
           "cssParts": [
             {
               "description": "The component's base wrapper.",
               "name": "base"
-            },
+            }
+          ],
+          "slots": [
             {
-              "description": "The prefix container.",
-              "name": "prefix"
+              "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/nav-group/nav-group.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlNavGroup",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
             },
             {
-              "description": "The nav item label.",
-              "name": "label"
+              "description": "The nav group title.",
+              "name": "title"
             },
             {
-              "description": "The suffix container.",
-              "name": "suffix"
+              "description": "The nav group body.",
+              "name": "body"
             }
           ],
           "slots": [
             {
-              "description": "The nav item's label.",
+              "description": "The nav items within the group.",
               "name": ""
             },
             {
-              "description": "Used to prepend an icon or similar element to the nav item.",
-              "name": "prefix"
-            },
-            {
-              "description": "Used to append an icon or similar element to the nav item.",
-              "name": "suffix"
+              "description": "The nav group's title.",
+              "name": "title"
             }
           ],
           "members": [
@@ -12581,27 +12508,7 @@
               "name": "hasSlotController",
               "privacy": "private",
               "readonly": true,
-              "default": "new HasSlotController(this, 'prefix', 'suffix')"
-            },
-            {
-              "kind": "field",
-              "name": "key",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "A stable key used by `sl-nav` to track selection.",
-              "attribute": "key"
-            },
-            {
-              "kind": "field",
-              "name": "itemKey",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "React-safe alias for `key`.\n\nReact reserves `key` and won't forward it to custom elements, so wrapper users can pass `itemKey` instead.",
-              "attribute": "item-key"
+              "default": "new HasSlotController(this, 'title')"
             },
             {
               "kind": "field",
@@ -12609,75 +12516,219 @@
               "type": {
                 "text": "unknown | undefined"
               },
-              "description": "Alternate label content when using Antd-style `items` configuration."
-            },
-            {
-              "kind": "field",
-              "name": "icon",
-              "type": {
-                "text": "unknown | undefined"
-              },
-              "description": "Alternate icon content when using Antd-style `items` configuration."
-            },
-            {
-              "kind": "field",
-              "name": "extra",
-              "type": {
-                "text": "unknown | undefined"
-              },
-              "description": "Extra content shown at the end of the item."
+              "description": "Matches Antd's item group label."
             },
             {
               "kind": "field",
-              "name": "danger",
+              "name": "active",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Matches Antd's `danger` item flag.",
-              "attribute": "danger",
+              "description": "Draws the nav group in an active (selected) state.",
+              "attribute": "active",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Tooltip text, primarily used when the menu is collapsed.",
-              "attribute": "title"
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
+              "name": "mode",
               "type": {
-                "text": "boolean"
+                "text": "'horizontal' | 'inline' | 'vertical'"
               },
-              "default": "false",
-              "description": "Draws the nav item in a disabled state.",
-              "attribute": "disabled",
+              "default": "'inline'",
+              "description": "The mode of navigation.",
+              "attribute": "mode",
               "reflects": true
-            },
+            }
+          ],
+          "attributes": [
             {
-              "kind": "field",
               "name": "active",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Draws the nav item in an active (selected) state.",
-              "attribute": "active",
-              "reflects": true
+              "description": "Draws the nav group in an active (selected) state.",
+              "fieldName": "active"
             },
             {
-              "kind": "field",
-              "name": "href",
+              "name": "mode",
               "type": {
-                "text": "string"
+                "text": "'horizontal' | 'inline' | 'vertical'"
               },
-              "default": "''",
-              "description": "The URL to link to. If set, the nav item will render as an anchor tag.",
+              "default": "'inline'",
+              "description": "The mode of navigation.",
+              "fieldName": "mode"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "Nav groups are used to group related nav items.",
+          "tagNameWithoutPrefix": "nav-group",
+          "tagName": "sl-nav-group",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Nav groups are used to group related nav items.\n * @documentation https://shoelace.style/components/nav-group\n * @status experimental\n * @since 2.16\n *\n * @slot - The nav items within the group.\n * @slot title - The nav group's title.\n *\n * @csspart base - The component's base wrapper.\n * @csspart title - The nav group title.\n * @csspart body - The nav group body.\n */",
+          "documentation": "https://shoelace.style/components/nav-group",
+          "status": "experimental",
+          "since": "2.16"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlNavGroup",
+            "module": "components/nav-group/nav-group.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/nav-item/nav-item.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlNavItem",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            },
+            {
+              "description": "The prefix container.",
+              "name": "prefix"
+            },
+            {
+              "description": "The nav item label.",
+              "name": "label"
+            },
+            {
+              "description": "The suffix container.",
+              "name": "suffix"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The nav item's label.",
+              "name": ""
+            },
+            {
+              "description": "Used to prepend an icon or similar element to the nav item.",
+              "name": "prefix"
+            },
+            {
+              "description": "Used to append an icon or similar element to the nav item.",
+              "name": "suffix"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "hasSlotController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new HasSlotController(this, 'prefix', 'suffix')"
+            },
+            {
+              "kind": "field",
+              "name": "key",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "A stable key used by `sl-nav` to track selection.",
+              "attribute": "key"
+            },
+            {
+              "kind": "field",
+              "name": "itemKey",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "React-safe alias for `key`.\n\nReact reserves `key` and won't forward it to custom elements, so wrapper users can pass `itemKey` instead.",
+              "attribute": "item-key"
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "unknown | undefined"
+              },
+              "description": "Alternate label content when using Antd-style `items` configuration."
+            },
+            {
+              "kind": "field",
+              "name": "icon",
+              "type": {
+                "text": "unknown | undefined"
+              },
+              "description": "Alternate icon content when using Antd-style `items` configuration."
+            },
+            {
+              "kind": "field",
+              "name": "extra",
+              "type": {
+                "text": "unknown | undefined"
+              },
+              "description": "Extra content shown at the end of the item."
+            },
+            {
+              "kind": "field",
+              "name": "danger",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Matches Antd's `danger` item flag.",
+              "attribute": "danger",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Tooltip text, primarily used when the menu is collapsed.",
+              "attribute": "title"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws the nav item in a disabled state.",
+              "attribute": "disabled",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "active",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws the nav item in an active (selected) state.",
+              "attribute": "active",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "href",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The URL to link to. If set, the nav item will render as an anchor tag.",
               "attribute": "href"
             },
             {
@@ -13937,73 +13988,51 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/popup/popup.js",
+      "path": "components/progress-bar/progress-bar.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlPopup",
+          "name": "SlProgressBar",
           "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 progress bar's height.",
+              "name": "--height"
             },
             {
-              "description": "The color of the arrow.",
-              "name": "--arrow-color",
-              "default": "var(--sl-color-neutral-0)"
+              "description": "The color of the track.",
+              "name": "--track-color"
             },
             {
-              "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": "The color of the indicator.",
+              "name": "--indicator-color"
             },
             {
-              "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"
+              "description": "The color of the label.",
+              "name": "--label-color"
             }
           ],
           "cssParts": [
             {
-              "description": "The arrow's container. Avoid setting `top|bottom|left|right` properties, as these values are assigned dynamically as the popup moves. This is most useful for applying a background color to match the popup, and maybe a border or box shadow.",
-              "name": "arrow"
+              "description": "The component's base wrapper.",
+              "name": "base"
             },
             {
-              "description": "The popup's container. Useful for setting a background color, box shadow, etc.",
-              "name": "popup"
+              "description": "The progress bar's indicator.",
+              "name": "indicator"
             },
             {
-              "description": "The hover bridge element. Only available when the `hover-bridge` option is enabled.",
-              "name": "hover-bridge"
+              "description": "The progress bar's label.",
+              "name": "label"
             }
           ],
           "slots": [
             {
-              "description": "The popup's content.",
+              "description": "A label to show inside the progress indicator.",
               "name": ""
-            },
-            {
-              "description": "The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the `anchor` attribute or property instead.",
-              "name": "anchor"
             }
           ],
           "members": [
-            {
-              "kind": "field",
-              "name": "anchorEl",
-              "type": {
-                "text": "Element | VirtualElement | null"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "cleanup",
-              "type": {
-                "text": "ReturnType<typeof autoUpdate> | undefined"
-              },
-              "privacy": "private"
-            },
             {
               "kind": "field",
               "name": "localize",
@@ -14013,31 +14042,194 @@
             },
             {
               "kind": "field",
-              "name": "popup",
+              "name": "value",
               "type": {
-                "text": "HTMLElement"
+                "text": "number"
               },
-              "description": "A reference to the internal popup container. Useful for animating and styling the popup with JavaScript."
+              "default": "0",
+              "description": "The current progress as a percentage, 0 to 100.",
+              "attribute": "value",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "arrowEl",
+              "name": "indeterminate",
               "type": {
-                "text": "HTMLElement"
+                "text": "boolean"
               },
-              "privacy": "private"
+              "default": "false",
+              "description": "When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.",
+              "attribute": "indeterminate",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "anchor",
+              "name": "label",
               "type": {
-                "text": "Element | string | VirtualElement"
+                "text": "string"
               },
-              "description": "The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor\nelement `id`, a DOM element reference, or a `VirtualElement`. If the anchor lives inside the popup, use the\n`anchor` slot instead.",
-              "attribute": "anchor"
-            },
-            {
-              "kind": "field",
+              "default": "''",
+              "description": "A custom label for assistive devices.",
+              "attribute": "label"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "The current progress as a percentage, 0 to 100.",
+              "fieldName": "value"
+            },
+            {
+              "name": "indeterminate",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.",
+              "fieldName": "indeterminate"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "A custom label for assistive devices.",
+              "fieldName": "label"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "Progress bars are used to show the status of an ongoing operation.",
+          "tagNameWithoutPrefix": "progress-bar",
+          "tagName": "sl-progress-bar",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Progress bars are used to show the status of an ongoing operation.\n * @documentation https://shoelace.style/components/progress-bar\n * @status stable\n * @since 2.0\n *\n * @slot - A label to show inside the progress indicator.\n *\n * @csspart base - The component's base wrapper.\n * @csspart indicator - The progress bar's indicator.\n * @csspart label - The progress bar's label.\n *\n * @cssproperty --height - The progress bar's height.\n * @cssproperty --track-color - The color of the track.\n * @cssproperty --indicator-color - The color of the indicator.\n * @cssproperty --label-color - The color of the label.\n */",
+          "documentation": "https://shoelace.style/components/progress-bar",
+          "status": "stable",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlProgressBar",
+            "module": "components/progress-bar/progress-bar.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": [
+            {
+              "description": "The arrow's container. Avoid setting `top|bottom|left|right` properties, as these values are assigned dynamically as the popup moves. This is most useful for applying a background color to match the popup, and maybe a border or box shadow.",
+              "name": "arrow"
+            },
+            {
+              "description": "The popup's container. Useful for setting a background color, box shadow, etc.",
+              "name": "popup"
+            },
+            {
+              "description": "The hover bridge element. Only available when the `hover-bridge` option is enabled.",
+              "name": "hover-bridge"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The popup's content.",
+              "name": ""
+            },
+            {
+              "description": "The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the `anchor` attribute or property instead.",
+              "name": "anchor"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "anchorEl",
+              "type": {
+                "text": "Element | VirtualElement | null"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "cleanup",
+              "type": {
+                "text": "ReturnType<typeof autoUpdate> | undefined"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "popup",
+              "type": {
+                "text": "HTMLElement"
+              },
+              "description": "A reference to the internal popup container. Useful for animating and styling the popup with JavaScript."
+            },
+            {
+              "kind": "field",
+              "name": "arrowEl",
+              "type": {
+                "text": "HTMLElement"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "anchor",
+              "type": {
+                "text": "Element | string | VirtualElement"
+              },
+              "description": "The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor\nelement `id`, a DOM element reference, or a `VirtualElement`. If the anchor lives inside the popup, use the\n`anchor` slot instead.",
+              "attribute": "anchor"
+            },
+            {
+              "kind": "field",
               "name": "active",
               "type": {
                 "text": "boolean"
@@ -14504,28 +14696,36 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/progress-bar/progress-bar.js",
+      "path": "components/progress-ring/progress-ring.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlProgressBar",
+          "name": "SlProgressRing",
           "cssProperties": [
             {
-              "description": "The progress bar's height.",
-              "name": "--height"
+              "description": "The diameter of the progress ring (cannot be a percentage).",
+              "name": "--size"
+            },
+            {
+              "description": "The width of the track.",
+              "name": "--track-width"
             },
             {
               "description": "The color of the track.",
               "name": "--track-color"
             },
+            {
+              "description": "The width of the indicator. Defaults to the track width.",
+              "name": "--indicator-width"
+            },
             {
               "description": "The color of the indicator.",
               "name": "--indicator-color"
             },
             {
-              "description": "The color of the label.",
-              "name": "--label-color"
+              "description": "The duration of the indicator's transition when the value changes.",
+              "name": "--indicator-transition-duration"
             }
           ],
           "cssParts": [
@@ -14534,17 +14734,13 @@
               "name": "base"
             },
             {
-              "description": "The progress bar's indicator.",
-              "name": "indicator"
-            },
-            {
-              "description": "The progress bar's label.",
+              "description": "The progress ring label.",
               "name": "label"
             }
           ],
           "slots": [
             {
-              "description": "A label to show inside the progress indicator.",
+              "description": "A label to show inside the ring.",
               "name": ""
             }
           ],
@@ -14556,6 +14752,20 @@
               "readonly": true,
               "default": "new LocalizeController(this)"
             },
+            {
+              "kind": "field",
+              "name": "indicator",
+              "type": {
+                "text": "SVGCircleElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "indicatorOffset",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "kind": "field",
               "name": "value",
@@ -14567,17 +14777,6 @@
               "attribute": "value",
               "reflects": true
             },
-            {
-              "kind": "field",
-              "name": "indeterminate",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.",
-              "attribute": "indeterminate",
-              "reflects": true
-            },
             {
               "kind": "field",
               "name": "label",
@@ -14599,15 +14798,6 @@
               "description": "The current progress as a percentage, 0 to 100.",
               "fieldName": "value"
             },
-            {
-              "name": "indeterminate",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.",
-              "fieldName": "indeterminate"
-            },
             {
               "name": "label",
               "type": {
@@ -14622,12 +14812,12 @@
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Progress bars are used to show the status of an ongoing operation.",
-          "tagNameWithoutPrefix": "progress-bar",
-          "tagName": "sl-progress-bar",
+          "summary": "Progress rings are used to show the progress of a determinate operation in a circular fashion.",
+          "tagNameWithoutPrefix": "progress-ring",
+          "tagName": "sl-progress-ring",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Progress bars are used to show the status of an ongoing operation.\n * @documentation https://shoelace.style/components/progress-bar\n * @status stable\n * @since 2.0\n *\n * @slot - A label to show inside the progress indicator.\n *\n * @csspart base - The component's base wrapper.\n * @csspart indicator - The progress bar's indicator.\n * @csspart label - The progress bar's label.\n *\n * @cssproperty --height - The progress bar's height.\n * @cssproperty --track-color - The color of the track.\n * @cssproperty --indicator-color - The color of the indicator.\n * @cssproperty --label-color - The color of the label.\n */",
-          "documentation": "https://shoelace.style/components/progress-bar",
+          "jsDoc": "/**\n * @summary Progress rings are used to show the progress of a determinate operation in a circular fashion.\n * @documentation https://shoelace.style/components/progress-ring\n * @status stable\n * @since 2.0\n *\n * @slot - A label to show inside the ring.\n *\n * @csspart base - The component's base wrapper.\n * @csspart label - The progress ring label.\n *\n * @cssproperty --size - The diameter of the progress ring (cannot be a percentage).\n * @cssproperty --track-width - The width of the track.\n * @cssproperty --track-color - The color of the track.\n * @cssproperty --indicator-width - The width of the indicator. Defaults to the track width.\n * @cssproperty --indicator-color - The color of the indicator.\n * @cssproperty --indicator-transition-duration - The duration of the indicator's transition when the value changes.\n */",
+          "documentation": "https://shoelace.style/components/progress-ring",
           "status": "stable",
           "since": "2.0"
         }
@@ -14637,166 +14827,27 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlProgressBar",
-            "module": "components/progress-bar/progress-bar.js"
+            "name": "SlProgressRing",
+            "module": "components/progress-ring/progress-ring.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "components/progress-ring/progress-ring.js",
+      "path": "components/qr-code/qr-code.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlProgressRing",
-          "cssProperties": [
-            {
-              "description": "The diameter of the progress ring (cannot be a percentage).",
-              "name": "--size"
-            },
+          "name": "SlQrCode",
+          "cssParts": [
             {
-              "description": "The width of the track.",
-              "name": "--track-width"
-            },
-            {
-              "description": "The color of the track.",
-              "name": "--track-color"
-            },
-            {
-              "description": "The width of the indicator. Defaults to the track width.",
-              "name": "--indicator-width"
-            },
-            {
-              "description": "The color of the indicator.",
-              "name": "--indicator-color"
-            },
-            {
-              "description": "The duration of the indicator's transition when the value changes.",
-              "name": "--indicator-transition-duration"
-            }
-          ],
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            },
-            {
-              "description": "The progress ring label.",
-              "name": "label"
-            }
-          ],
-          "slots": [
-            {
-              "description": "A label to show inside the ring.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
-            },
-            {
-              "kind": "field",
-              "name": "indicator",
-              "type": {
-                "text": "SVGCircleElement"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "indicatorOffset",
-              "type": {
-                "text": "string"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "number"
-              },
-              "default": "0",
-              "description": "The current progress as a percentage, 0 to 100.",
-              "attribute": "value",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "A custom label for assistive devices.",
-              "attribute": "label"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "value",
-              "type": {
-                "text": "number"
-              },
-              "default": "0",
-              "description": "The current progress as a percentage, 0 to 100.",
-              "fieldName": "value"
-            },
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "A custom label for assistive devices.",
-              "fieldName": "label"
-            }
-          ],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "Progress rings are used to show the progress of a determinate operation in a circular fashion.",
-          "tagNameWithoutPrefix": "progress-ring",
-          "tagName": "sl-progress-ring",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Progress rings are used to show the progress of a determinate operation in a circular fashion.\n * @documentation https://shoelace.style/components/progress-ring\n * @status stable\n * @since 2.0\n *\n * @slot - A label to show inside the ring.\n *\n * @csspart base - The component's base wrapper.\n * @csspart label - The progress ring label.\n *\n * @cssproperty --size - The diameter of the progress ring (cannot be a percentage).\n * @cssproperty --track-width - The width of the track.\n * @cssproperty --track-color - The color of the track.\n * @cssproperty --indicator-width - The width of the indicator. Defaults to the track width.\n * @cssproperty --indicator-color - The color of the indicator.\n * @cssproperty --indicator-transition-duration - The duration of the indicator's transition when the value changes.\n */",
-          "documentation": "https://shoelace.style/components/progress-ring",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlProgressRing",
-            "module": "components/progress-ring/progress-ring.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/qr-code/qr-code.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlQrCode",
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "members": [
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
+          "members": [
             {
               "kind": "field",
               "name": "canvas",
@@ -17028,116 +17079,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/resize-observer/resize-observer.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlResizeObserver",
-          "slots": [
-            {
-              "description": "One or more elements to watch for resizing.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "resizeObserver",
-              "type": {
-                "text": "ResizeObserver"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "observedElements",
-              "type": {
-                "text": "HTMLElement[]"
-              },
-              "privacy": "private",
-              "default": "[]"
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the observer.",
-              "attribute": "disabled",
-              "reflects": true
-            },
-            {
-              "kind": "method",
-              "name": "handleSlotChange",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "startObserver",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "stopObserver",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "handleDisabledChange"
-            }
-          ],
-          "events": [
-            {
-              "type": {
-                "text": "{ entries: ResizeObserverEntry[] }"
-              },
-              "description": "Emitted when the element is resized.",
-              "name": "sl-resize",
-              "reactName": "onSlResize",
-              "eventName": "SlResizeEvent"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the observer.",
-              "fieldName": "disabled"
-            }
-          ],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).",
-          "tagNameWithoutPrefix": "resize-observer",
-          "tagName": "sl-resize-observer",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).\n * @documentation https://shoelace.style/components/resize-observer\n * @status stable\n * @since 2.0\n *\n * @slot - One or more elements to watch for resizing.\n *\n * @event {{ entries: ResizeObserverEntry[] }} sl-resize - Emitted when the element is resized.\n */",
-          "documentation": "https://shoelace.style/components/resize-observer",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlResizeObserver",
-            "module": "components/resize-observer/resize-observer.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/row/row.js",
@@ -17329,17 +17270,127 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/screen/screen.js",
+      "path": "components/resize-observer/resize-observer.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlScreen",
-          "cssParts": [
+          "name": "SlResizeObserver",
+          "slots": [
             {
-              "description": "The grid layout content.",
-              "name": "base"
-            }
+              "description": "One or more elements to watch for resizing.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "resizeObserver",
+              "type": {
+                "text": "ResizeObserver"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "observedElements",
+              "type": {
+                "text": "HTMLElement[]"
+              },
+              "privacy": "private",
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the observer.",
+              "attribute": "disabled",
+              "reflects": true
+            },
+            {
+              "kind": "method",
+              "name": "handleSlotChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "startObserver",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "stopObserver",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "handleDisabledChange"
+            }
+          ],
+          "events": [
+            {
+              "type": {
+                "text": "{ entries: ResizeObserverEntry[] }"
+              },
+              "description": "Emitted when the element is resized.",
+              "name": "sl-resize",
+              "reactName": "onSlResize",
+              "eventName": "SlResizeEvent"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the observer.",
+              "fieldName": "disabled"
+            }
+          ],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).",
+          "tagNameWithoutPrefix": "resize-observer",
+          "tagName": "sl-resize-observer",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).\n * @documentation https://shoelace.style/components/resize-observer\n * @status stable\n * @since 2.0\n *\n * @slot - One or more elements to watch for resizing.\n *\n * @event {{ entries: ResizeObserverEntry[] }} sl-resize - Emitted when the element is resized.\n */",
+          "documentation": "https://shoelace.style/components/resize-observer",
+          "status": "stable",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlResizeObserver",
+            "module": "components/resize-observer/resize-observer.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "components/screen/screen.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlScreen",
+          "cssParts": [
+            {
+              "description": "The grid layout content.",
+              "name": "base"
+            }
           ],
           "members": [
             {
@@ -18686,280 +18737,235 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/split-panel/split-panel.js",
+      "path": "components/switch/switch.js",
       "declarations": [
-        {
-          "kind": "function",
-          "name": "SNAP_NONE",
-          "description": "A SnapFunction which performs no snapping."
-        },
         {
           "kind": "class",
           "description": "",
-          "name": "SlSplitPanel",
+          "name": "SlSwitch",
           "cssProperties": [
             {
-              "description": "The width of the visible divider.",
-              "name": "--divider-width",
-              "default": "4px"
-            },
-            {
-              "description": "The invisible region around the divider where dragging can occur. This is usually wider than the divider to facilitate easier dragging.",
-              "name": "--divider-hit-area",
-              "default": "12px"
+              "description": "The width of the switch.",
+              "name": "--width"
             },
             {
-              "description": "The minimum allowed size of the primary panel.",
-              "name": "--min",
-              "default": "0"
+              "description": "The height of the switch.",
+              "name": "--height"
             },
             {
-              "description": "The maximum allowed size of the primary panel.",
-              "name": "--max",
-              "default": "100%"
+              "description": "The size of the thumb.",
+              "name": "--thumb-size"
             }
           ],
           "cssParts": [
             {
-              "description": "The start panel.",
-              "name": "start"
+              "description": "The component's base wrapper.",
+              "name": "base"
             },
             {
-              "description": "The end panel.",
-              "name": "end"
+              "description": "The control that houses the switch's thumb.",
+              "name": "control"
             },
             {
-              "description": "Targets both the start and end panels.",
-              "name": "panel"
+              "description": "The switch's thumb.",
+              "name": "thumb"
             },
             {
-              "description": "The divider that separates the start and end panels.",
-              "name": "divider"
+              "description": "The switch's label.",
+              "name": "label"
+            },
+            {
+              "description": "The help text's wrapper.",
+              "name": "form-control-help-text"
             }
           ],
           "slots": [
             {
-              "description": "Content to place in the start panel.",
-              "name": "start"
-            },
-            {
-              "description": "Content to place in the end panel.",
-              "name": "end"
+              "description": "The switch's label.",
+              "name": ""
             },
             {
-              "description": "The divider. Useful for slotting in a custom icon that renders as a handle.",
-              "name": "divider"
+              "description": "Text that describes how to use the switch. Alternatively, you can use the `help-text` attribute.",
+              "name": "help-text"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "cachedPositionInPixels",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private"
+              "name": "formControlController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new FormControlController(this, { value: (control: SlSwitch) => (control.checked ? control.value || 'on' : undefined), defaultValue: (control: SlSwitch) => control.defaultChecked, setValue: (control: SlSwitch, checked: boolean) => (control.checked = checked) })"
             },
             {
               "kind": "field",
-              "name": "isCollapsed",
-              "type": {
-                "text": "boolean"
-              },
+              "name": "hasSlotController",
               "privacy": "private",
-              "default": "false"
+              "readonly": true,
+              "default": "new HasSlotController(this, 'help-text')"
             },
             {
               "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
+              "name": "input",
+              "type": {
+                "text": "HTMLInputElement"
+              }
             },
             {
               "kind": "field",
-              "name": "positionBeforeCollapsing",
+              "name": "hasFocus",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
               "privacy": "private",
-              "default": "0"
+              "default": "false"
             },
             {
               "kind": "field",
-              "name": "resizeObserver",
+              "name": "title",
               "type": {
-                "text": "ResizeObserver"
+                "text": "string"
               },
-              "privacy": "private"
+              "default": "''",
+              "attribute": "title"
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "name",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "privacy": "private"
+              "default": "''",
+              "description": "The name of the switch, submitted as a name/value pair with form data.",
+              "attribute": "name"
             },
             {
               "kind": "field",
-              "name": "divider",
+              "name": "value",
               "type": {
-                "text": "HTMLElement"
-              }
+                "text": "string"
+              },
+              "description": "The current value of the switch, submitted as a name/value pair with form data.",
+              "attribute": "value"
             },
             {
               "kind": "field",
-              "name": "position",
+              "name": "size",
               "type": {
-                "text": "number"
+                "text": "'small' | 'medium' | 'large'"
               },
-              "default": "50",
-              "description": "The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\ncontainer's initial size.",
-              "attribute": "position",
+              "default": "'medium'",
+              "description": "The switch's size.",
+              "attribute": "size",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "positionInPixels",
+              "name": "disabled",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "description": "The current position of the divider from the primary panel's edge in pixels.",
-              "attribute": "position-in-pixels"
+              "default": "false",
+              "description": "Disables the switch.",
+              "attribute": "disabled",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "vertical",
+              "name": "checked",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Draws the split panel in a vertical orientation with the start and end panels stacked.",
-              "attribute": "vertical",
+              "description": "Draws the switch in a checked state.",
+              "attribute": "checked",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "defaultChecked",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables resizing. Note that the position may still change as a result of resizing the host element.",
-              "attribute": "disabled",
-              "reflects": true
+              "description": "The default value of the form control. Primarily used for resetting the form control."
             },
             {
               "kind": "field",
-              "name": "primary",
+              "name": "form",
               "type": {
-                "text": "'start' | 'end' | undefined"
+                "text": "string"
               },
-              "description": "If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\nprimary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\nhost element is resized.",
-              "attribute": "primary"
+              "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": "snapValue",
+              "name": "required",
               "type": {
-                "text": "string | SnapFunction"
+                "text": "boolean"
               },
-              "privacy": "private",
-              "default": "''"
+              "default": "false",
+              "description": "Makes the switch a required field.",
+              "attribute": "required",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "snapFunction",
+              "name": "helpText",
               "type": {
-                "text": "SnapFunction"
+                "text": "string"
               },
-              "privacy": "private",
-              "default": "SNAP_NONE"
+              "default": "''",
+              "description": "The switch's help text. If you need to display HTML, use the `help-text` slot instead.",
+              "attribute": "help-text"
             },
             {
-              "kind": "method",
-              "name": "toSnapFunction",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "snap",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The snap string."
-                }
-              ],
-              "description": "Converts a string containing either a series of fixed/repeated snap points (e.g. \"repeat(20%)\", \"100px 200px 800px\", or \"10% 50% repeat(10px)\") into a SnapFunction. `SnapFunction`s take in a `SnapFunctionOpts` and return the position that the split panel should snap to."
+              "kind": "field",
+              "name": "validity",
+              "description": "Gets the validity state object",
+              "readonly": true
             },
             {
               "kind": "field",
-              "name": "snap",
-              "description": "Either one or more space-separated values at which the divider should snap, in pixels, percentages, or repeat expressions e.g. `'100px 50% 500px' or `repeat(50%) 10px`,\nor a function which takes in a `SnapFunctionParams`, and returns a position to snap to, e.g. `({ pos }) => Math.round(pos / 8) * 8`.",
-              "type": {
-                "text": "string | SnapFunction"
-              },
-              "attribute": "snap",
-              "reflects": true
+              "name": "validationMessage",
+              "description": "Gets the validation message",
+              "readonly": true
             },
             {
-              "kind": "field",
-              "name": "snapThreshold",
-              "type": {
-                "text": "number"
-              },
-              "default": "12",
-              "description": "How close the divider must be to a snap point until snapping occurs.",
-              "attribute": "snap-threshold"
+              "kind": "method",
+              "name": "handleBlur",
+              "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "detectSize",
+              "name": "handleInput",
               "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "percentageToPixels",
+              "name": "handleInvalid",
               "privacy": "private",
               "parameters": [
                 {
-                  "name": "value",
+                  "name": "event",
                   "type": {
-                    "text": "number"
+                    "text": "Event"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "pixelsToPercentage",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "value",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ]
+              "name": "handleClick",
+              "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "handleDrag",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "PointerEvent"
-                  }
-                }
-              ]
+              "name": "handleFocus",
+              "privacy": "private"
             },
             {
               "kind": "method",
@@ -18976,64 +18982,136 @@
             },
             {
               "kind": "method",
-              "name": "handleResize",
-              "privacy": "private",
+              "name": "handleCheckedChange"
+            },
+            {
+              "kind": "method",
+              "name": "handleDisabledChange"
+            },
+            {
+              "kind": "method",
+              "name": "click",
+              "description": "Simulates a click on the switch."
+            },
+            {
+              "kind": "method",
+              "name": "focus",
               "parameters": [
                 {
-                  "name": "entries",
+                  "name": "options",
+                  "optional": true,
                   "type": {
-                    "text": "ResizeObserverEntry[]"
+                    "text": "FocusOptions"
                   }
                 }
-              ]
+              ],
+              "description": "Sets focus on the switch."
             },
             {
               "kind": "method",
-              "name": "handlePositionChange"
+              "name": "blur",
+              "description": "Removes focus from the switch."
             },
             {
               "kind": "method",
-              "name": "handlePositionInPixelsChange"
+              "name": "checkValidity",
+              "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
             },
             {
               "kind": "method",
-              "name": "handleVerticalChange"
+              "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 divider's position changes.",
-              "name": "sl-reposition",
-              "reactName": "onSlReposition",
-              "eventName": "SlRepositionEvent"
+              "description": "Emitted when the control loses focus.",
+              "name": "sl-blur",
+              "reactName": "onSlBlur",
+              "eventName": "SlBlurEvent"
+            },
+            {
+              "description": "Emitted when the control's checked state changes.",
+              "name": "sl-change",
+              "reactName": "onSlChange",
+              "eventName": "SlChangeEvent"
+            },
+            {
+              "description": "Emitted when the control receives input.",
+              "name": "sl-input",
+              "reactName": "onSlInput",
+              "eventName": "SlInputEvent"
+            },
+            {
+              "description": "Emitted when the control gains focus.",
+              "name": "sl-focus",
+              "reactName": "onSlFocus",
+              "eventName": "SlFocusEvent"
+            },
+            {
+              "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": "position",
+              "name": "title",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "default": "50",
-              "description": "The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\ncontainer's initial size.",
-              "fieldName": "position"
+              "default": "''",
+              "fieldName": "title"
             },
             {
-              "name": "position-in-pixels",
+              "name": "name",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "description": "The current position of the divider from the primary panel's edge in pixels.",
-              "fieldName": "positionInPixels"
+              "default": "''",
+              "description": "The name of the switch, submitted as a name/value pair with form data.",
+              "fieldName": "name"
             },
             {
-              "name": "vertical",
+              "name": "value",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Draws the split panel in a vertical orientation with the start and end panels stacked.",
-              "fieldName": "vertical"
+              "description": "The current value of the switch, submitted as a name/value pair with form data.",
+              "fieldName": "value"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "'small' | 'medium' | 'large'"
+              },
+              "default": "'medium'",
+              "description": "The switch's size.",
+              "fieldName": "size"
             },
             {
               "name": "disabled",
@@ -19041,562 +19119,517 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables resizing. Note that the position may still change as a result of resizing the host element.",
+              "description": "Disables the switch.",
               "fieldName": "disabled"
             },
             {
-              "name": "primary",
+              "name": "checked",
               "type": {
-                "text": "'start' | 'end' | undefined"
+                "text": "boolean"
               },
-              "description": "If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\nprimary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\nhost element is resized.",
-              "fieldName": "primary"
+              "default": "false",
+              "description": "Draws the switch in a checked state.",
+              "fieldName": "checked"
             },
             {
-              "name": "snap",
-              "description": "Either one or more space-separated values at which the divider should snap, in pixels, percentages, or repeat expressions e.g. `'100px 50% 500px' or `repeat(50%) 10px`,\nor a function which takes in a `SnapFunctionParams`, and returns a position to snap to, e.g. `({ pos }) => Math.round(pos / 8) * 8`.",
+              "name": "form",
               "type": {
-                "text": "string | SnapFunction"
+                "text": "string"
               },
-              "fieldName": "snap"
+              "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": "snap-threshold",
+              "name": "required",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "default": "12",
-              "description": "How close the divider must be to a snap point until snapping occurs.",
-              "fieldName": "snapThreshold"
+              "default": "false",
+              "description": "Makes the switch a required field.",
+              "fieldName": "required"
+            },
+            {
+              "name": "help-text",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The switch's help text. If you need to display HTML, use the `help-text` slot instead.",
+              "fieldName": "helpText"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Split panels display two adjacent panels, allowing the user to reposition them.",
-          "tagNameWithoutPrefix": "split-panel",
-          "tagName": "sl-split-panel",
+          "summary": "Switches allow the user to toggle an option on or off.",
+          "tagNameWithoutPrefix": "switch",
+          "tagName": "sl-switch",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Split panels display two adjacent panels, allowing the user to reposition them.\n * @documentation https://shoelace.style/components/split-panel\n * @status stable\n * @since 2.0\n *\n * @event sl-reposition - Emitted when the divider's position changes.\n *\n * @slot start - Content to place in the start panel.\n * @slot end - Content to place in the end panel.\n * @slot divider - The divider. Useful for slotting in a custom icon that renders as a handle.\n *\n * @csspart start - The start panel.\n * @csspart end - The end panel.\n * @csspart panel - Targets both the start and end panels.\n * @csspart divider - The divider that separates the start and end panels.\n *\n * @cssproperty [--divider-width=4px] - The width of the visible divider.\n * @cssproperty [--divider-hit-area=12px] - The invisible region around the divider where dragging can occur. This is\n *  usually wider than the divider to facilitate easier dragging.\n * @cssproperty [--min=0] - The minimum allowed size of the primary panel.\n * @cssproperty [--max=100%] - The maximum allowed size of the primary panel.\n */",
-          "documentation": "https://shoelace.style/components/split-panel",
+          "jsDoc": "/**\n * @summary Switches allow the user to toggle an option on or off.\n * @documentation https://shoelace.style/components/switch\n * @status stable\n * @since 2.0\n *\n * @slot - The switch's label.\n * @slot help-text - Text that describes how to use the switch. 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 the control's checked state changes.\n * @event sl-input - Emitted when the control receives input.\n * @event sl-focus - Emitted when the control gains focus.\n * @event sl-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart base - The component's base wrapper.\n * @csspart control - The control that houses the switch's thumb.\n * @csspart thumb - The switch's thumb.\n * @csspart label - The switch's label.\n * @csspart form-control-help-text - The help text's wrapper.\n *\n * @cssproperty --width - The width of the switch.\n * @cssproperty --height - The height of the switch.\n * @cssproperty --thumb-size - The size of the thumb.\n */",
+          "documentation": "https://shoelace.style/components/switch",
           "status": "stable",
           "since": "2.0"
         }
       ],
       "exports": [
-        {
-          "kind": "js",
-          "name": "SNAP_NONE",
-          "declaration": {
-            "name": "SNAP_NONE",
-            "module": "components/split-panel/split-panel.js"
-          }
-        },
         {
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlSplitPanel",
-            "module": "components/split-panel/split-panel.js"
+            "name": "SlSwitch",
+            "module": "components/switch/switch.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "components/switch/switch.js",
+      "path": "components/split-panel/split-panel.js",
       "declarations": [
+        {
+          "kind": "function",
+          "name": "SNAP_NONE",
+          "description": "A SnapFunction which performs no snapping."
+        },
         {
           "kind": "class",
           "description": "",
-          "name": "SlSwitch",
+          "name": "SlSplitPanel",
           "cssProperties": [
             {
-              "description": "The width of the switch.",
-              "name": "--width"
+              "description": "The width of the visible divider.",
+              "name": "--divider-width",
+              "default": "4px"
             },
             {
-              "description": "The height of the switch.",
-              "name": "--height"
+              "description": "The invisible region around the divider where dragging can occur. This is usually wider than the divider to facilitate easier dragging.",
+              "name": "--divider-hit-area",
+              "default": "12px"
             },
             {
-              "description": "The size of the thumb.",
-              "name": "--thumb-size"
+              "description": "The minimum allowed size of the primary panel.",
+              "name": "--min",
+              "default": "0"
+            },
+            {
+              "description": "The maximum allowed size of the primary panel.",
+              "name": "--max",
+              "default": "100%"
             }
           ],
           "cssParts": [
             {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            },
-            {
-              "description": "The control that houses the switch's thumb.",
-              "name": "control"
+              "description": "The start panel.",
+              "name": "start"
             },
             {
-              "description": "The switch's thumb.",
-              "name": "thumb"
+              "description": "The end panel.",
+              "name": "end"
             },
             {
-              "description": "The switch's label.",
-              "name": "label"
+              "description": "Targets both the start and end panels.",
+              "name": "panel"
             },
             {
-              "description": "The help text's wrapper.",
-              "name": "form-control-help-text"
+              "description": "The divider that separates the start and end panels.",
+              "name": "divider"
             }
           ],
           "slots": [
             {
-              "description": "The switch's label.",
-              "name": ""
+              "description": "Content to place in the start panel.",
+              "name": "start"
             },
             {
-              "description": "Text that describes how to use the switch. Alternatively, you can use the `help-text` attribute.",
-              "name": "help-text"
+              "description": "Content to place in the end panel.",
+              "name": "end"
+            },
+            {
+              "description": "The divider. Useful for slotting in a custom icon that renders as a handle.",
+              "name": "divider"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "formControlController",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new FormControlController(this, { value: (control: SlSwitch) => (control.checked ? control.value || 'on' : undefined), defaultValue: (control: SlSwitch) => control.defaultChecked, setValue: (control: SlSwitch, checked: boolean) => (control.checked = checked) })"
+              "name": "cachedPositionInPixels",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "hasSlotController",
+              "name": "isCollapsed",
+              "type": {
+                "text": "boolean"
+              },
               "privacy": "private",
-              "readonly": true,
-              "default": "new HasSlotController(this, 'help-text')"
+              "default": "false"
             },
             {
               "kind": "field",
-              "name": "input",
-              "type": {
-                "text": "HTMLInputElement"
-              }
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
             },
             {
               "kind": "field",
-              "name": "hasFocus",
+              "name": "positionBeforeCollapsing",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
               "privacy": "private",
-              "default": "false"
+              "default": "0"
             },
             {
               "kind": "field",
-              "name": "title",
+              "name": "resizeObserver",
               "type": {
-                "text": "string"
+                "text": "ResizeObserver"
               },
-              "default": "''",
-              "attribute": "title"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "size",
               "type": {
-                "text": "string"
+                "text": "number"
               },
-              "default": "''",
-              "description": "The name of the switch, submitted as a name/value pair with form data.",
-              "attribute": "name"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "value",
+              "name": "divider",
               "type": {
-                "text": "string"
-              },
-              "description": "The current value of the switch, submitted as a name/value pair with form data.",
-              "attribute": "value"
+                "text": "HTMLElement"
+              }
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "position",
               "type": {
-                "text": "'small' | 'medium' | 'large'"
+                "text": "number"
               },
-              "default": "'medium'",
-              "description": "The switch's size.",
-              "attribute": "size",
+              "default": "50",
+              "description": "The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\ncontainer's initial size.",
+              "attribute": "position",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "positionInPixels",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "default": "false",
-              "description": "Disables the switch.",
-              "attribute": "disabled",
-              "reflects": true
+              "description": "The current position of the divider from the primary panel's edge in pixels.",
+              "attribute": "position-in-pixels"
             },
             {
               "kind": "field",
-              "name": "checked",
+              "name": "vertical",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Draws the switch in a checked state.",
-              "attribute": "checked",
+              "description": "Draws the split panel in a vertical orientation with the start and end panels stacked.",
+              "attribute": "vertical",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "defaultChecked",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "The default value of the form control. Primarily used for resetting the form control."
+              "description": "Disables resizing. Note that the position may still change as a result of resizing the host element.",
+              "attribute": "disabled",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "form",
+              "name": "primary",
               "type": {
-                "text": "string"
+                "text": "'start' | 'end' | undefined"
               },
-              "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
+              "description": "If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\nprimary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\nhost element is resized.",
+              "attribute": "primary"
             },
             {
               "kind": "field",
-              "name": "required",
+              "name": "snapValue",
               "type": {
-                "text": "boolean"
+                "text": "string | SnapFunction"
               },
-              "default": "false",
-              "description": "Makes the switch a required field.",
-              "attribute": "required",
-              "reflects": true
+              "privacy": "private",
+              "default": "''"
             },
             {
               "kind": "field",
-              "name": "helpText",
+              "name": "snapFunction",
               "type": {
-                "text": "string"
+                "text": "SnapFunction"
               },
-              "default": "''",
-              "description": "The switch's help text. If you need to display HTML, use the `help-text` slot instead.",
-              "attribute": "help-text"
+              "privacy": "private",
+              "default": "SNAP_NONE"
             },
             {
-              "kind": "field",
-              "name": "validity",
-              "description": "Gets the validity state object",
-              "readonly": true
+              "kind": "method",
+              "name": "toSnapFunction",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "parameters": [
+                {
+                  "name": "snap",
+                  "type": {
+                    "text": "string"
+                  },
+                  "description": "The snap string."
+                }
+              ],
+              "description": "Converts a string containing either a series of fixed/repeated snap points (e.g. \"repeat(20%)\", \"100px 200px 800px\", or \"10% 50% repeat(10px)\") into a SnapFunction. `SnapFunction`s take in a `SnapFunctionOpts` and return the position that the split panel should snap to."
             },
             {
               "kind": "field",
-              "name": "validationMessage",
-              "description": "Gets the validation message",
-              "readonly": true
+              "name": "snap",
+              "description": "Either one or more space-separated values at which the divider should snap, in pixels, percentages, or repeat expressions e.g. `'100px 50% 500px' or `repeat(50%) 10px`,\nor a function which takes in a `SnapFunctionParams`, and returns a position to snap to, e.g. `({ pos }) => Math.round(pos / 8) * 8`.",
+              "type": {
+                "text": "string | SnapFunction"
+              },
+              "attribute": "snap",
+              "reflects": true
             },
             {
-              "kind": "method",
-              "name": "handleBlur",
-              "privacy": "private"
+              "kind": "field",
+              "name": "snapThreshold",
+              "type": {
+                "text": "number"
+              },
+              "default": "12",
+              "description": "How close the divider must be to a snap point until snapping occurs.",
+              "attribute": "snap-threshold"
             },
             {
               "kind": "method",
-              "name": "handleInput",
+              "name": "detectSize",
               "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "handleInvalid",
+              "name": "percentageToPixels",
               "privacy": "private",
               "parameters": [
                 {
-                  "name": "event",
+                  "name": "value",
                   "type": {
-                    "text": "Event"
+                    "text": "number"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "handleClick",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "handleFocus",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "handleKeyDown",
+              "name": "pixelsToPercentage",
               "privacy": "private",
               "parameters": [
                 {
-                  "name": "event",
+                  "name": "value",
                   "type": {
-                    "text": "KeyboardEvent"
+                    "text": "number"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "handleCheckedChange"
-            },
-            {
-              "kind": "method",
-              "name": "handleDisabledChange"
-            },
-            {
-              "kind": "method",
-              "name": "click",
-              "description": "Simulates a click on the switch."
-            },
-            {
-              "kind": "method",
-              "name": "focus",
+              "name": "handleDrag",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "options",
-                  "optional": true,
+                  "name": "event",
                   "type": {
-                    "text": "FocusOptions"
+                    "text": "PointerEvent"
                   }
                 }
-              ],
-              "description": "Sets focus on the switch."
-            },
-            {
-              "kind": "method",
-              "name": "blur",
-              "description": "Removes focus from the switch."
-            },
-            {
-              "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",
+              "name": "handleKeyDown",
+              "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."
-            }
-          ],
-          "events": [
+              ]
+            },
             {
-              "description": "Emitted when the control loses focus.",
-              "name": "sl-blur",
-              "reactName": "onSlBlur",
-              "eventName": "SlBlurEvent"
+              "kind": "method",
+              "name": "handleResize",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "entries",
+                  "type": {
+                    "text": "ResizeObserverEntry[]"
+                  }
+                }
+              ]
             },
             {
-              "description": "Emitted when the control's checked state changes.",
-              "name": "sl-change",
-              "reactName": "onSlChange",
-              "eventName": "SlChangeEvent"
+              "kind": "method",
+              "name": "handlePositionChange"
             },
             {
-              "description": "Emitted when the control receives input.",
-              "name": "sl-input",
-              "reactName": "onSlInput",
-              "eventName": "SlInputEvent"
+              "kind": "method",
+              "name": "handlePositionInPixelsChange"
             },
             {
-              "description": "Emitted when the control gains focus.",
-              "name": "sl-focus",
-              "reactName": "onSlFocus",
-              "eventName": "SlFocusEvent"
-            },
+              "kind": "method",
+              "name": "handleVerticalChange"
+            }
+          ],
+          "events": [
             {
-              "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 divider's position changes.",
+              "name": "sl-reposition",
+              "reactName": "onSlReposition",
+              "eventName": "SlRepositionEvent"
             }
           ],
           "attributes": [
             {
-              "name": "title",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "fieldName": "title"
-            },
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The name of the switch, submitted as a name/value pair with form data.",
-              "fieldName": "name"
-            },
-            {
-              "name": "value",
+              "name": "position",
               "type": {
-                "text": "string"
+                "text": "number"
               },
-              "description": "The current value of the switch, submitted as a name/value pair with form data.",
-              "fieldName": "value"
+              "default": "50",
+              "description": "The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\ncontainer's initial size.",
+              "fieldName": "position"
             },
             {
-              "name": "size",
+              "name": "position-in-pixels",
               "type": {
-                "text": "'small' | 'medium' | 'large'"
+                "text": "number"
               },
-              "default": "'medium'",
-              "description": "The switch's size.",
-              "fieldName": "size"
+              "description": "The current position of the divider from the primary panel's edge in pixels.",
+              "fieldName": "positionInPixels"
             },
             {
-              "name": "disabled",
+              "name": "vertical",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables the switch.",
-              "fieldName": "disabled"
+              "description": "Draws the split panel in a vertical orientation with the start and end panels stacked.",
+              "fieldName": "vertical"
             },
             {
-              "name": "checked",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Draws the switch in a checked state.",
-              "fieldName": "checked"
+              "description": "Disables resizing. Note that the position may still change as a result of resizing the host element.",
+              "fieldName": "disabled"
             },
             {
-              "name": "form",
+              "name": "primary",
               "type": {
-                "text": "string"
+                "text": "'start' | 'end' | undefined"
               },
-              "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"
+              "description": "If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\nprimary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\nhost element is resized.",
+              "fieldName": "primary"
             },
             {
-              "name": "required",
+              "name": "snap",
+              "description": "Either one or more space-separated values at which the divider should snap, in pixels, percentages, or repeat expressions e.g. `'100px 50% 500px' or `repeat(50%) 10px`,\nor a function which takes in a `SnapFunctionParams`, and returns a position to snap to, e.g. `({ pos }) => Math.round(pos / 8) * 8`.",
               "type": {
-                "text": "boolean"
+                "text": "string | SnapFunction"
               },
-              "default": "false",
-              "description": "Makes the switch a required field.",
-              "fieldName": "required"
+              "fieldName": "snap"
             },
             {
-              "name": "help-text",
+              "name": "snap-threshold",
               "type": {
-                "text": "string"
+                "text": "number"
               },
-              "default": "''",
-              "description": "The switch's help text. If you need to display HTML, use the `help-text` slot instead.",
-              "fieldName": "helpText"
+              "default": "12",
+              "description": "How close the divider must be to a snap point until snapping occurs.",
+              "fieldName": "snapThreshold"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Switches allow the user to toggle an option on or off.",
-          "tagNameWithoutPrefix": "switch",
-          "tagName": "sl-switch",
+          "summary": "Split panels display two adjacent panels, allowing the user to reposition them.",
+          "tagNameWithoutPrefix": "split-panel",
+          "tagName": "sl-split-panel",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Switches allow the user to toggle an option on or off.\n * @documentation https://shoelace.style/components/switch\n * @status stable\n * @since 2.0\n *\n * @slot - The switch's label.\n * @slot help-text - Text that describes how to use the switch. 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 the control's checked state changes.\n * @event sl-input - Emitted when the control receives input.\n * @event sl-focus - Emitted when the control gains focus.\n * @event sl-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @csspart base - The component's base wrapper.\n * @csspart control - The control that houses the switch's thumb.\n * @csspart thumb - The switch's thumb.\n * @csspart label - The switch's label.\n * @csspart form-control-help-text - The help text's wrapper.\n *\n * @cssproperty --width - The width of the switch.\n * @cssproperty --height - The height of the switch.\n * @cssproperty --thumb-size - The size of the thumb.\n */",
-          "documentation": "https://shoelace.style/components/switch",
+          "jsDoc": "/**\n * @summary Split panels display two adjacent panels, allowing the user to reposition them.\n * @documentation https://shoelace.style/components/split-panel\n * @status stable\n * @since 2.0\n *\n * @event sl-reposition - Emitted when the divider's position changes.\n *\n * @slot start - Content to place in the start panel.\n * @slot end - Content to place in the end panel.\n * @slot divider - The divider. Useful for slotting in a custom icon that renders as a handle.\n *\n * @csspart start - The start panel.\n * @csspart end - The end panel.\n * @csspart panel - Targets both the start and end panels.\n * @csspart divider - The divider that separates the start and end panels.\n *\n * @cssproperty [--divider-width=4px] - The width of the visible divider.\n * @cssproperty [--divider-hit-area=12px] - The invisible region around the divider where dragging can occur. This is\n *  usually wider than the divider to facilitate easier dragging.\n * @cssproperty [--min=0] - The minimum allowed size of the primary panel.\n * @cssproperty [--max=100%] - The maximum allowed size of the primary panel.\n */",
+          "documentation": "https://shoelace.style/components/split-panel",
           "status": "stable",
           "since": "2.0"
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "SNAP_NONE",
+          "declaration": {
+            "name": "SNAP_NONE",
+            "module": "components/split-panel/split-panel.js"
+          }
+        },
         {
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlSwitch",
-            "module": "components/switch/switch.js"
+            "name": "SlSplitPanel",
+            "module": "components/split-panel/split-panel.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "components/tab/tab.js",
+      "path": "components/tab-panel/tab-panel.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlTab",
+          "name": "SlTabPanel",
+          "cssProperties": [
+            {
+              "description": "The tab panel's padding.",
+              "name": "--padding"
+            }
+          ],
           "cssParts": [
             {
               "description": "The component's base wrapper.",
               "name": "base"
-            },
-            {
-              "description": "The close button, an `<sl-icon-button>`.",
-              "name": "close-button"
-            },
-            {
-              "description": "The close button's exported `base` part.",
-              "name": "close-button__base"
             }
           ],
           "slots": [
             {
-              "description": "The tab's label.",
+              "description": "The tab panel's content.",
               "name": ""
             }
           ],
           "members": [
-            {
-              "kind": "field",
-              "name": "dependencies",
-              "type": {
-                "text": "object"
-              },
-              "static": true,
-              "default": "{ 'sl-icon-button': SlIconButton }"
-            },
-            {
-              "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
-            },
             {
               "kind": "field",
               "name": "attrId",
@@ -19612,24 +19645,17 @@
               "name": "componentId",
               "privacy": "private",
               "readonly": true,
-              "default": "`sl-tab-${this.attrId}`"
-            },
-            {
-              "kind": "field",
-              "name": "tab",
-              "type": {
-                "text": "HTMLElement"
-              }
+              "default": "`sl-tab-panel-${this.attrId}`"
             },
             {
               "kind": "field",
-              "name": "panel",
+              "name": "name",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "The name of the tab panel this tab is associated with. The panel must be located in the same tab group.",
-              "attribute": "panel",
+              "description": "The tab panel's name.",
+              "attribute": "name",
               "reflects": true
             },
             {
@@ -19639,115 +19665,47 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Draws the tab in an active state.",
+              "description": "When true, the tab panel will be shown.",
               "attribute": "active",
               "reflects": true
             },
-            {
-              "kind": "field",
-              "name": "closable",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Makes the tab closable and shows a close button.",
-              "attribute": "closable",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables the tab and prevents selection.",
-              "attribute": "disabled",
-              "reflects": true
-            },
-            {
-              "kind": "method",
-              "name": "handleCloseClick",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            },
             {
               "kind": "method",
               "name": "handleActiveChange"
-            },
-            {
-              "kind": "method",
-              "name": "handleDisabledChange"
-            }
-          ],
-          "events": [
-            {
-              "description": "Emitted when the tab is closable and the close button is activated.",
-              "name": "sl-close",
-              "reactName": "onSlClose",
-              "eventName": "SlCloseEvent"
             }
           ],
           "attributes": [
             {
-              "name": "panel",
+              "name": "name",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "The name of the tab panel this tab is associated with. The panel must be located in the same tab group.",
-              "fieldName": "panel"
-            },
-            {
-              "name": "active",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Draws the tab in an active state.",
-              "fieldName": "active"
-            },
-            {
-              "name": "closable",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Makes the tab closable and shows a close button.",
-              "fieldName": "closable"
+              "description": "The tab panel's name.",
+              "fieldName": "name"
             },
             {
-              "name": "disabled",
+              "name": "active",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables the tab and prevents selection.",
-              "fieldName": "disabled"
+              "description": "When true, the tab panel will be shown.",
+              "fieldName": "active"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Tabs are used inside [tab groups](/components/tab-group) to represent and activate [tab panels](/components/tab-panel).",
-          "tagNameWithoutPrefix": "tab",
-          "tagName": "sl-tab",
+          "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
+          "tagNameWithoutPrefix": "tab-panel",
+          "tagName": "sl-tab-panel",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Tabs are used inside [tab groups](/components/tab-group) to represent and activate [tab panels](/components/tab-panel).\n * @documentation https://shoelace.style/components/tab\n * @status stable\n * @since 2.0\n *\n * @dependency sl-icon-button\n *\n * @slot - The tab's label.\n *\n * @event sl-close - Emitted when the tab is closable and the close button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart close-button - The close button, an `<sl-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n */",
-          "documentation": "https://shoelace.style/components/tab",
+          "jsDoc": "/**\n * @summary Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.\n * @documentation https://shoelace.style/components/tab-panel\n * @status stable\n * @since 2.0\n *\n * @slot - The tab panel's content.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --padding - The tab panel's padding.\n */",
+          "documentation": "https://shoelace.style/components/tab-panel",
           "status": "stable",
-          "since": "2.0",
-          "dependencies": [
-            "sl-icon-button"
-          ]
+          "since": "2.0"
         }
       ],
       "exports": [
@@ -19755,8 +19713,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlTab",
-            "module": "components/tab/tab.js"
+            "name": "SlTabPanel",
+            "module": "components/tab-panel/tab-panel.js"
           }
         }
       ]
@@ -20234,31 +20192,49 @@
     },
     {
       "kind": "javascript-module",
-      "path": "components/tab-panel/tab-panel.js",
+      "path": "components/tab/tab.js",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SlTabPanel",
-          "cssProperties": [
-            {
-              "description": "The tab panel's padding.",
-              "name": "--padding"
-            }
-          ],
+          "name": "SlTab",
           "cssParts": [
             {
               "description": "The component's base wrapper.",
               "name": "base"
+            },
+            {
+              "description": "The close button, an `<sl-icon-button>`.",
+              "name": "close-button"
+            },
+            {
+              "description": "The close button's exported `base` part.",
+              "name": "close-button__base"
             }
           ],
           "slots": [
             {
-              "description": "The tab panel's content.",
+              "description": "The tab's label.",
               "name": ""
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "dependencies",
+              "type": {
+                "text": "object"
+              },
+              "static": true,
+              "default": "{ 'sl-icon-button': SlIconButton }"
+            },
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
             {
               "kind": "field",
               "name": "attrId",
@@ -20274,17 +20250,24 @@
               "name": "componentId",
               "privacy": "private",
               "readonly": true,
-              "default": "`sl-tab-panel-${this.attrId}`"
+              "default": "`sl-tab-${this.attrId}`"
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "tab",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "panel",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "The tab panel's name.",
-              "attribute": "name",
+              "description": "The name of the tab panel this tab is associated with. The panel must be located in the same tab group.",
+              "attribute": "panel",
               "reflects": true
             },
             {
@@ -20294,24 +20277,71 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the tab panel will be shown.",
+              "description": "Draws the tab in an active state.",
               "attribute": "active",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "closable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the tab closable and shows a close button.",
+              "attribute": "closable",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the tab and prevents selection.",
+              "attribute": "disabled",
+              "reflects": true
+            },
+            {
+              "kind": "method",
+              "name": "handleCloseClick",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            },
             {
               "kind": "method",
               "name": "handleActiveChange"
+            },
+            {
+              "kind": "method",
+              "name": "handleDisabledChange"
+            }
+          ],
+          "events": [
+            {
+              "description": "Emitted when the tab is closable and the close button is activated.",
+              "name": "sl-close",
+              "reactName": "onSlClose",
+              "eventName": "SlCloseEvent"
             }
           ],
           "attributes": [
             {
-              "name": "name",
+              "name": "panel",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "The tab panel's name.",
-              "fieldName": "name"
+              "description": "The name of the tab panel this tab is associated with. The panel must be located in the same tab group.",
+              "fieldName": "panel"
             },
             {
               "name": "active",
@@ -20319,22 +20349,43 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the tab panel will be shown.",
+              "description": "Draws the tab in an active state.",
               "fieldName": "active"
+            },
+            {
+              "name": "closable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the tab closable and shows a close button.",
+              "fieldName": "closable"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the tab and prevents selection.",
+              "fieldName": "disabled"
             }
           ],
           "superclass": {
             "name": "ShoelaceElement",
             "module": "/src/internal/shoelace-element.js"
           },
-          "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
-          "tagNameWithoutPrefix": "tab-panel",
-          "tagName": "sl-tab-panel",
+          "summary": "Tabs are used inside [tab groups](/components/tab-group) to represent and activate [tab panels](/components/tab-panel).",
+          "tagNameWithoutPrefix": "tab",
+          "tagName": "sl-tab",
           "customElement": true,
-          "jsDoc": "/**\n * @summary Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.\n * @documentation https://shoelace.style/components/tab-panel\n * @status stable\n * @since 2.0\n *\n * @slot - The tab panel's content.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --padding - The tab panel's padding.\n */",
-          "documentation": "https://shoelace.style/components/tab-panel",
+          "jsDoc": "/**\n * @summary Tabs are used inside [tab groups](/components/tab-group) to represent and activate [tab panels](/components/tab-panel).\n * @documentation https://shoelace.style/components/tab\n * @status stable\n * @since 2.0\n *\n * @dependency sl-icon-button\n *\n * @slot - The tab's label.\n *\n * @event sl-close - Emitted when the tab is closable and the close button is activated.\n *\n * @csspart base - The component's base wrapper.\n * @csspart close-button - The close button, an `<sl-icon-button>`.\n * @csspart close-button__base - The close button's exported `base` part.\n */",
+          "documentation": "https://shoelace.style/components/tab",
           "status": "stable",
-          "since": "2.0"
+          "since": "2.0",
+          "dependencies": [
+            "sl-icon-button"
+          ]
         }
       ],
       "exports": [
@@ -20342,8 +20393,8 @@
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SlTabPanel",
-            "module": "components/tab-panel/tab-panel.js"
+            "name": "SlTab",
+            "module": "components/tab/tab.js"
           }
         }
       ]
@@ -23401,6 +23452,12 @@
               "name": "sl-clear",
               "reactName": "onSlClear",
               "eventName": "SlClearEvent"
+            },
+            {
+              "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": [
@@ -23428,7 +23485,7 @@
           "customElement": true,
           "summary": "A time picker component that provides a time selection interface.",
           "tagNameWithoutPrefix": "timepicker",
-          "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 * @dependency sl-date-panel\n * @dependency sl-drawer\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 */",
+          "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 * @dependency sl-date-panel\n * @dependency sl-drawer\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 * @event sl-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n */",
           "documentation": "https://shoelace.style/components/timepicker",
           "since": "2.0",
           "dependencies": [
@@ -23841,6 +23898,46 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/visually-hidden/visually-hidden.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SlVisuallyHidden",
+          "slots": [
+            {
+              "description": "The content to be visually hidden.",
+              "name": ""
+            }
+          ],
+          "members": [],
+          "superclass": {
+            "name": "ShoelaceElement",
+            "module": "/src/internal/shoelace-element.js"
+          },
+          "summary": "The visually hidden utility makes content accessible to assistive devices without displaying it on the screen.",
+          "tagNameWithoutPrefix": "visually-hidden",
+          "tagName": "sl-visually-hidden",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary The visually hidden utility makes content accessible to assistive devices without displaying it on the screen.\n * @documentation https://shoelace.style/components/visually-hidden\n * @status stable\n * @since 2.0\n *\n * @slot - The content to be visually hidden.\n */",
+          "documentation": "https://shoelace.style/components/visually-hidden",
+          "status": "stable",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SlVisuallyHidden",
+            "module": "components/visually-hidden/visually-hidden.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/tree/tree.js",
@@ -24539,52 +24636,12 @@
           }
         }
       ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "components/visually-hidden/visually-hidden.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SlVisuallyHidden",
-          "slots": [
-            {
-              "description": "The content to be visually hidden.",
-              "name": ""
-            }
-          ],
-          "members": [],
-          "superclass": {
-            "name": "ShoelaceElement",
-            "module": "/src/internal/shoelace-element.js"
-          },
-          "summary": "The visually hidden utility makes content accessible to assistive devices without displaying it on the screen.",
-          "tagNameWithoutPrefix": "visually-hidden",
-          "tagName": "sl-visually-hidden",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary The visually hidden utility makes content accessible to assistive devices without displaying it on the screen.\n * @documentation https://shoelace.style/components/visually-hidden\n * @status stable\n * @since 2.0\n *\n * @slot - The content to be visually hidden.\n */",
-          "documentation": "https://shoelace.style/components/visually-hidden",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SlVisuallyHidden",
-            "module": "components/visually-hidden/visually-hidden.js"
-          }
-        }
-      ]
     }
   ],
   "package": {
     "name": "@kdcloudjs/shoelace",
     "description": "A forward-thinking library of web components.",
-    "version": "1.0.27",
+    "version": "1.0.28",
     "license": "MIT"
   }
 }