@vielzeug/refine 3.2.0 → 3.2.1

package/dist/custom-elements.json

@@ -6118,103 +6118,217 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/feedback/password-strength/password-strength.ts",
+      "path": "src/feedback/chip/chip.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "PASSWORD_STRENGTH_TAG",
+          "name": "CHIP_TAG",
           "type": {
-            "text": "'ore-password-strength'"
+            "text": "'ore-chip'"
           },
-          "default": "'ore-password-strength'",
-          "description": "Strong password meter with segmented progress visualization.\n\nBuilt-in scoring is heuristic and conservative:\n- length < 6 => weak\n- length >= 8 with mixed case => fair\n- + digit or symbol => good\n- length >= 12 with mixed case, digit and symbol => strong"
+          "default": "'ore-chip'",
+          "description": "A compact, styled label element. Supports icons, a remove button, colors, sizes, and variants.\nCommonly used to represent tags, filters, or selected options in a multiselect field."
         },
         {
           "kind": "class",
-          "name": "OrePasswordStrengthElement",
-          "tagName": "ore-password-strength",
+          "name": "OreChipElement",
+          "tagName": "ore-chip",
           "customElement": true,
-          "description": "Strong password meter with segmented progress visualization.\nBuilt-in scoring is heuristic and conservative:\n- length < 6 => weak\n- length >= 8 with mixed case => fair\n- + digit or symbol => good\n- length >= 12 with mixed case, digit and symbol => strong",
+          "description": "A compact, styled label element. Supports icons, a remove button, colors, sizes, and variants.\nCommonly used to represent tags, filters, or selected options in a multiselect field.",
           "summary": "",
           "attributes": [
             {
-              "name": "value",
+              "name": "label",
               "type": {
                 "text": "string"
               },
-              "description": "Password string to evaluate"
+              "description": "Accessible label (required for icon-only chips)"
             },
             {
-              "name": "score",
+              "name": "color",
               "type": {
-                "text": "number"
+                "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
               },
-              "description": "Optional score override (0..4). Use -1 for no override (default: -1)",
-              "default": "-1"
+              "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
             },
             {
-              "name": "show-label",
+              "name": "variant",
+              "type": {
+                "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'"
+              },
+              "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "'sm' | 'md' | 'lg'"
+              },
+              "description": "Component size: 'sm' | 'md' | 'lg'"
+            },
+            {
+              "name": "rounded",
+              "type": {
+                "text": "'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
+              },
+              "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
+            },
+            {
+              "name": "mode",
+              "type": {
+                "text": "'static' | 'removable' | 'selectable' | 'action'"
+              },
+              "description": "Interaction mode: 'static' | 'removable' | 'selectable' | 'action'"
+            },
+            {
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
-              "description": "Show visible feedback label (default: true)",
-              "default": "true"
+              "description": "Disable the chip"
             },
             {
-              "name": "label",
+              "name": "value",
               "type": {
                 "text": "string"
               },
-              "description": "Accessible name (default: 'Password strength')",
-              "default": "'Password strength'"
+              "description": "Value included in emitted event detail"
+            },
+            {
+              "name": "checked",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Controlled checked state for selectable chips"
+            },
+            {
+              "name": "default-checked",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Initial checked state for uncontrolled selectable chips"
+            }
+          ],
+          "events": [
+            {
+              "name": "remove",
+              "description": "Fired when the remove button is clicked. detail: { value: string, originalEvent: MouseEvent }",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "change",
+              "description": "Fired when a selectable chip toggles. detail: { checked: boolean, value: string, originalEvent: Event }",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "click",
+              "description": "Fired when an action chip is clicked. detail: { value: string, originalEvent: MouseEvent }",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "Chip label text"
+            },
+            {
+              "name": "icon",
+              "description": "Leading icon or decoration"
+            }
+          ],
+          "cssParts": [
+            {
+              "name": "remove-btn",
+              "description": "Remove action button."
+            },
+            {
+              "name": "chip-btn",
+              "description": "Shadow part for the `chip-btn` element."
+            },
+            {
+              "name": "chip",
+              "description": "Shadow part for the `chip` element."
             }
           ],
           "cssProperties": [
             {
-              "name": "--password-strength-height       Segment bar height",
-              "description": ""
+              "name": "--chip-bg",
+              "description": "Background color"
             },
             {
-              "name": "--password-strength-gap          Gap between segments",
-              "description": ""
+              "name": "--chip-color",
+              "description": "Text color"
             },
             {
-              "name": "--password-strength-radius       Segment corner radius",
-              "description": ""
+              "name": "--chip-border-color",
+              "description": "Border color"
             },
             {
-              "name": "--password-strength-track-bg     Inactive segment color",
-              "description": ""
+              "name": "--chip-radius",
+              "description": "Border radius"
             },
             {
-              "name": "--password-strength-label-size   Visible label font size",
-              "description": ""
+              "name": "--chip-font-size",
+              "description": "Font size"
             },
             {
-              "name": "--password-strength-label-color  Visible label color",
-              "description": ""
+              "name": "--chip-font-weight",
+              "description": "Font weight"
             },
             {
-              "name": "--password-strength-weak-color   Weak state segment color",
-              "description": ""
+              "name": "--chip-padding-x",
+              "description": "Horizontal padding"
             },
             {
-              "name": "--password-strength-fair-color   Fair state segment color",
-              "description": ""
+              "name": "--chip-padding-y",
+              "description": "Vertical padding"
             },
             {
-              "name": "--password-strength-good-color   Good state segment color",
-              "description": ""
+              "name": "--chip-gap",
+              "description": "Gap between icon, label and remove button"
             },
             {
-              "name": "--password-strength-strong-color Strong state segment color",
-              "description": ""
+              "name": "--chip-hover-bg",
+              "description": "Background on hover (interactive modes)"
+            },
+            {
+              "name": "--chip-hover-color",
+              "description": "Text color on hover (interactive modes)"
+            },
+            {
+              "name": "--chip-hover-border-color",
+              "description": "Border color on hover (interactive modes)"
+            },
+            {
+              "name": "--chip-active-bg",
+              "description": "Background when pressed (interactive modes)"
+            },
+            {
+              "name": "--chip-active-color",
+              "description": "Text color when pressed (interactive modes)"
+            },
+            {
+              "name": "--chip-remove-bg",
+              "description": "Remove button background (bordered/outline variants)"
+            },
+            {
+              "name": "--chip-remove-color",
+              "description": "Remove button icon color (bordered/outline variants)"
+            },
+            {
+              "name": "--chip-remove-hover-bg",
+              "description": "Remove button background on hover"
             }
           ],
           "demos": [
             {
               "url": "",
-              "description": "```html\n<!-- Pair with an ore-input to evaluate in real time -->\n<ore-input type=\"password\" label=\"Password\" name=\"password\" id=\"pwd\"></ore-input>\n<ore-password-strength id=\"meter\"></ore-password-strength>\n<script type=\"module\">\n  document.getElementById('pwd').addEventListener('input', (e) => {\n    document.getElementById('meter').value = e.target.value;\n  });\n</script>\n<!-- Fixed score display (e.g. from a server-side score) -->\n<ore-password-strength score=\"3\"></ore-password-strength>\n```"
+              "description": "```html\n<!-- Static chip (read-only) -->\n<ore-chip color=\"primary\">Design</ore-chip>\n<!-- Removable chip -->\n<ore-chip color=\"success\" variant=\"flat\" mode=\"removable\" value=\"ts\">\n  TypeScript\n</ore-chip>\n<!-- Selectable chip (controlled) -->\n<ore-chip color=\"info\" variant=\"flat\" mode=\"selectable\" checked value=\"ui\">\n  UI\n</ore-chip>\n<!-- Selectable chip (uncontrolled) -->\n<ore-chip color=\"info\" variant=\"flat\" mode=\"selectable\" default-checked value=\"ui\">\n  UI\n</ore-chip>\n<!-- Action chip (acts like a button) -->\n<ore-chip color=\"warning\" mode=\"action\" value=\"add\">\n  <svg slot=\"icon\" ...></svg>\n  Add Item\n</ore-chip>\n<!-- Icon-only chip -->\n<ore-chip color=\"error\" mode=\"action\" label=\"Delete\">\n  <svg slot=\"icon\" ...></svg>\n</ore-chip>\n```"
             }
           ]
         }
@@ -6222,156 +6336,121 @@
       "exports": [
         {
           "kind": "js",
-          "name": "PASSWORD_STRENGTH_TAG",
+          "name": "CHIP_TAG",
           "declaration": {
-            "name": "PASSWORD_STRENGTH_TAG",
-            "module": "src/feedback/password-strength/password-strength.ts"
+            "name": "CHIP_TAG",
+            "module": "src/feedback/chip/chip.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "OrePasswordStrengthElement",
+          "name": "OreChipElement",
           "declaration": {
-            "name": "OrePasswordStrengthElement",
-            "module": "src/feedback/password-strength/password-strength.ts"
+            "name": "OreChipElement",
+            "module": "src/feedback/chip/chip.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/feedback/skeleton/skeleton.ts",
+      "path": "src/feedback/password-strength/password-strength.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "SKELETON_TAG",
+          "name": "PASSWORD_STRENGTH_TAG",
           "type": {
-            "text": "'ore-skeleton'"
+            "text": "'ore-password-strength'"
           },
-          "default": "'ore-skeleton'",
-          "description": "A shimmer placeholder that represents loading content.\nControl dimensions via the `--skeleton-width` and `--skeleton-height` CSS custom properties,\nor via `width` / `height` inline styles. Rectangle and circle bones fill the rendered host box."
+          "default": "'ore-password-strength'",
+          "description": "Strong password meter with segmented progress visualization.\n\nBuilt-in scoring is heuristic and conservative:\n- length < 6 => weak\n- length >= 8 with mixed case => fair\n- + digit or symbol => good\n- length >= 12 with mixed case, digit and symbol => strong"
         },
         {
           "kind": "class",
-          "name": "OreSkeletonElement",
-          "tagName": "ore-skeleton",
+          "name": "OrePasswordStrengthElement",
+          "tagName": "ore-password-strength",
           "customElement": true,
-          "description": "A shimmer placeholder that represents loading content.\nControl dimensions via the `--skeleton-width` and `--skeleton-height` CSS custom properties,\nor via `width` / `height` inline styles. Rectangle and circle bones fill the rendered host box.",
+          "description": "Strong password meter with segmented progress visualization.\nBuilt-in scoring is heuristic and conservative:\n- length < 6 => weak\n- length >= 8 with mixed case => fair\n- + digit or symbol => good\n- length >= 12 with mixed case, digit and symbol => strong",
           "summary": "",
           "attributes": [
             {
-              "name": "variant",
-              "type": {
-                "text": "'circle' | 'text'"
-              },
-              "description": "Shape: 'rect' (default) | 'circle' | 'text'"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "'sm' | 'md' | 'lg'"
-              },
-              "description": "Height/circle preset: 'sm' | 'md' | 'lg'"
-            },
-            {
-              "name": "width",
-              "type": {
-                "text": "string"
-              },
-              "description": "Width override (CSS length/percentage)"
-            },
-            {
-              "name": "height",
+              "name": "value",
               "type": {
                 "text": "string"
               },
-              "description": "Height override (CSS length)"
+              "description": "Password string to evaluate"
             },
             {
-              "name": "radius",
+              "name": "score",
               "type": {
-                "text": "string"
+                "text": "number"
               },
-              "description": "Radius override"
+              "description": "Optional score override (0..4). Use -1 for no override (default: -1)",
+              "default": "-1"
             },
             {
-              "name": "animated",
+              "name": "show-label",
               "type": {
                 "text": "boolean"
               },
-              "description": "Disable with `animated=\"false\"`"
-            },
-            {
-              "name": "lines",
-              "type": {
-                "text": "number"
-              },
-              "description": "Text line count (only for `variant='text'`)"
+              "description": "Show visible feedback label (default: true)",
+              "default": "true"
             },
             {
-              "name": "striped",
+              "name": "label",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "description": "Replace shimmer with diagonal stripes"
-            }
-          ],
-          "cssParts": [
-            {
-              "name": "stack",
-              "description": "Stack container."
-            },
-            {
-              "name": "bone",
-              "description": "Skeleton bone element."
+              "description": "Accessible name (default: 'Password strength')",
+              "default": "'Password strength'"
             }
           ],
           "cssProperties": [
             {
-              "name": "--skeleton-bg",
-              "description": "Base shimmer color"
+              "name": "--password-strength-height       Segment bar height",
+              "description": ""
             },
             {
-              "name": "--skeleton-highlight",
-              "description": "Shimmer highlight color"
+              "name": "--password-strength-gap          Gap between segments",
+              "description": ""
             },
             {
-              "name": "--skeleton-radius",
-              "description": "Border radius"
+              "name": "--password-strength-radius       Segment corner radius",
+              "description": ""
             },
             {
-              "name": "--skeleton-size",
-              "description": "Circle fallback size"
+              "name": "--password-strength-track-bg     Inactive segment color",
+              "description": ""
             },
             {
-              "name": "--skeleton-width",
-              "description": "Width (default: 100%)"
+              "name": "--password-strength-label-size   Visible label font size",
+              "description": ""
             },
             {
-              "name": "--skeleton-height",
-              "description": "Height (default: var(--size-4))"
+              "name": "--password-strength-label-color  Visible label color",
+              "description": ""
             },
             {
-              "name": "--skeleton-line-gap",
-              "description": "Vertical gap between text lines"
+              "name": "--password-strength-weak-color   Weak state segment color",
+              "description": ""
             },
             {
-              "name": "--skeleton-last-line-width",
-              "description": "Width of the final text line"
+              "name": "--password-strength-fair-color   Fair state segment color",
+              "description": ""
             },
             {
-              "name": "--skeleton-duration",
-              "description": "Shimmer animation duration"
+              "name": "--password-strength-good-color   Good state segment color",
+              "description": ""
             },
             {
-              "name": "--skeleton-stripe-size",
-              "description": "Width of each diagonal stripe (default: 6px)"
+              "name": "--password-strength-strong-color Strong state segment color",
+              "description": ""
             }
           ],
           "demos": [
             {
               "url": "",
-              "description": "```html\n<!-- Paragraph lines -->\n<ore-skeleton variant=\"text\" lines=\"3\" width=\"100%\"></ore-skeleton>\n<!-- Avatar -->\n<ore-skeleton variant=\"circle\" size=\"md\"></ore-skeleton>\n<!-- Card image -->\n<ore-skeleton width=\"100%\" height=\"10rem\"></ore-skeleton>\n```"
+              "description": "```html\n<!-- Pair with an ore-input to evaluate in real time -->\n<ore-input type=\"password\" label=\"Password\" name=\"password\" id=\"pwd\"></ore-input>\n<ore-password-strength id=\"meter\"></ore-password-strength>\n<script type=\"module\">\n  document.getElementById('pwd').addEventListener('input', (e) => {\n    document.getElementById('meter').value = e.target.value;\n  });\n</script>\n<!-- Fixed score display (e.g. from a server-side score) -->\n<ore-password-strength score=\"3\"></ore-password-strength>\n```"
             }
           ]
         }
@@ -6379,18 +6458,18 @@
       "exports": [
         {
           "kind": "js",
-          "name": "SKELETON_TAG",
+          "name": "PASSWORD_STRENGTH_TAG",
           "declaration": {
-            "name": "SKELETON_TAG",
-            "module": "src/feedback/skeleton/skeleton.ts"
+            "name": "PASSWORD_STRENGTH_TAG",
+            "module": "src/feedback/password-strength/password-strength.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "OreSkeletonElement",
+          "name": "OrePasswordStrengthElement",
           "declaration": {
-            "name": "OreSkeletonElement",
-            "module": "src/feedback/skeleton/skeleton.ts"
+            "name": "OrePasswordStrengthElement",
+            "module": "src/feedback/password-strength/password-strength.ts"
           }
         }
       ]
@@ -6561,217 +6640,138 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/feedback/chip/chip.ts",
+      "path": "src/feedback/skeleton/skeleton.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "CHIP_TAG",
+          "name": "SKELETON_TAG",
           "type": {
-            "text": "'ore-chip'"
+            "text": "'ore-skeleton'"
           },
-          "default": "'ore-chip'",
-          "description": "A compact, styled label element. Supports icons, a remove button, colors, sizes, and variants.\nCommonly used to represent tags, filters, or selected options in a multiselect field."
+          "default": "'ore-skeleton'",
+          "description": "A shimmer placeholder that represents loading content.\nControl dimensions via the `--skeleton-width` and `--skeleton-height` CSS custom properties,\nor via `width` / `height` inline styles. Rectangle and circle bones fill the rendered host box."
         },
         {
           "kind": "class",
-          "name": "OreChipElement",
-          "tagName": "ore-chip",
+          "name": "OreSkeletonElement",
+          "tagName": "ore-skeleton",
           "customElement": true,
-          "description": "A compact, styled label element. Supports icons, a remove button, colors, sizes, and variants.\nCommonly used to represent tags, filters, or selected options in a multiselect field.",
+          "description": "A shimmer placeholder that represents loading content.\nControl dimensions via the `--skeleton-width` and `--skeleton-height` CSS custom properties,\nor via `width` / `height` inline styles. Rectangle and circle bones fill the rendered host box.",
           "summary": "",
           "attributes": [
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "description": "Accessible label (required for icon-only chips)"
-            },
-            {
-              "name": "color",
-              "type": {
-                "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-              },
-              "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-            },
             {
               "name": "variant",
               "type": {
-                "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'"
+                "text": "'circle' | 'text'"
               },
-              "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'"
+              "description": "Shape: 'rect' (default) | 'circle' | 'text'"
             },
             {
               "name": "size",
               "type": {
                 "text": "'sm' | 'md' | 'lg'"
               },
-              "description": "Component size: 'sm' | 'md' | 'lg'"
-            },
-            {
-              "name": "rounded",
-              "type": {
-                "text": "'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
-              },
-              "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
+              "description": "Height/circle preset: 'sm' | 'md' | 'lg'"
             },
             {
-              "name": "mode",
+              "name": "width",
               "type": {
-                "text": "'static' | 'removable' | 'selectable' | 'action'"
+                "text": "string"
               },
-              "description": "Interaction mode: 'static' | 'removable' | 'selectable' | 'action'"
+              "description": "Width override (CSS length/percentage)"
             },
             {
-              "name": "disabled",
+              "name": "height",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "description": "Disable the chip"
+              "description": "Height override (CSS length)"
             },
             {
-              "name": "value",
+              "name": "radius",
               "type": {
                 "text": "string"
               },
-              "description": "Value included in emitted event detail"
+              "description": "Radius override"
             },
             {
-              "name": "checked",
+              "name": "animated",
               "type": {
                 "text": "boolean"
               },
-              "description": "Controlled checked state for selectable chips"
+              "description": "Disable with `animated=\"false\"`"
             },
             {
-              "name": "default-checked",
+              "name": "lines",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "description": "Initial checked state for uncontrolled selectable chips"
-            }
-          ],
-          "events": [
-            {
-              "name": "remove",
-              "description": "Fired when the remove button is clicked. detail: { value: string, originalEvent: MouseEvent }",
-              "type": {
-                "text": "CustomEvent"
-              }
-            },
-            {
-              "name": "change",
-              "description": "Fired when a selectable chip toggles. detail: { checked: boolean, value: string, originalEvent: Event }",
-              "type": {
-                "text": "CustomEvent"
-              }
+              "description": "Text line count (only for `variant='text'`)"
             },
             {
-              "name": "click",
-              "description": "Fired when an action chip is clicked. detail: { value: string, originalEvent: MouseEvent }",
+              "name": "striped",
               "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "slots": [
-            {
-              "name": "",
-              "description": "Chip label text"
-            },
-            {
-              "name": "icon",
-              "description": "Leading icon or decoration"
+                "text": "boolean"
+              },
+              "description": "Replace shimmer with diagonal stripes"
             }
           ],
           "cssParts": [
             {
-              "name": "remove-btn",
-              "description": "Remove action button."
-            },
-            {
-              "name": "chip-btn",
-              "description": "Shadow part for the `chip-btn` element."
+              "name": "stack",
+              "description": "Stack container."
             },
             {
-              "name": "chip",
-              "description": "Shadow part for the `chip` element."
+              "name": "bone",
+              "description": "Skeleton bone element."
             }
           ],
           "cssProperties": [
             {
-              "name": "--chip-bg",
-              "description": "Background color"
-            },
-            {
-              "name": "--chip-color",
-              "description": "Text color"
+              "name": "--skeleton-bg",
+              "description": "Base shimmer color"
             },
             {
-              "name": "--chip-border-color",
-              "description": "Border color"
+              "name": "--skeleton-highlight",
+              "description": "Shimmer highlight color"
             },
             {
-              "name": "--chip-radius",
+              "name": "--skeleton-radius",
               "description": "Border radius"
             },
             {
-              "name": "--chip-font-size",
-              "description": "Font size"
-            },
-            {
-              "name": "--chip-font-weight",
-              "description": "Font weight"
-            },
-            {
-              "name": "--chip-padding-x",
-              "description": "Horizontal padding"
-            },
-            {
-              "name": "--chip-padding-y",
-              "description": "Vertical padding"
-            },
-            {
-              "name": "--chip-gap",
-              "description": "Gap between icon, label and remove button"
-            },
-            {
-              "name": "--chip-hover-bg",
-              "description": "Background on hover (interactive modes)"
-            },
-            {
-              "name": "--chip-hover-color",
-              "description": "Text color on hover (interactive modes)"
+              "name": "--skeleton-size",
+              "description": "Circle fallback size"
             },
             {
-              "name": "--chip-hover-border-color",
-              "description": "Border color on hover (interactive modes)"
+              "name": "--skeleton-width",
+              "description": "Width (default: 100%)"
             },
             {
-              "name": "--chip-active-bg",
-              "description": "Background when pressed (interactive modes)"
+              "name": "--skeleton-height",
+              "description": "Height (default: var(--size-4))"
             },
             {
-              "name": "--chip-active-color",
-              "description": "Text color when pressed (interactive modes)"
+              "name": "--skeleton-line-gap",
+              "description": "Vertical gap between text lines"
             },
             {
-              "name": "--chip-remove-bg",
-              "description": "Remove button background (bordered/outline variants)"
+              "name": "--skeleton-last-line-width",
+              "description": "Width of the final text line"
             },
             {
-              "name": "--chip-remove-color",
-              "description": "Remove button icon color (bordered/outline variants)"
+              "name": "--skeleton-duration",
+              "description": "Shimmer animation duration"
             },
             {
-              "name": "--chip-remove-hover-bg",
-              "description": "Remove button background on hover"
+              "name": "--skeleton-stripe-size",
+              "description": "Width of each diagonal stripe (default: 6px)"
             }
           ],
           "demos": [
             {
               "url": "",
-              "description": "```html\n<!-- Static chip (read-only) -->\n<ore-chip color=\"primary\">Design</ore-chip>\n<!-- Removable chip -->\n<ore-chip color=\"success\" variant=\"flat\" mode=\"removable\" value=\"ts\">\n  TypeScript\n</ore-chip>\n<!-- Selectable chip (controlled) -->\n<ore-chip color=\"info\" variant=\"flat\" mode=\"selectable\" checked value=\"ui\">\n  UI\n</ore-chip>\n<!-- Selectable chip (uncontrolled) -->\n<ore-chip color=\"info\" variant=\"flat\" mode=\"selectable\" default-checked value=\"ui\">\n  UI\n</ore-chip>\n<!-- Action chip (acts like a button) -->\n<ore-chip color=\"warning\" mode=\"action\" value=\"add\">\n  <svg slot=\"icon\" ...></svg>\n  Add Item\n</ore-chip>\n<!-- Icon-only chip -->\n<ore-chip color=\"error\" mode=\"action\" label=\"Delete\">\n  <svg slot=\"icon\" ...></svg>\n</ore-chip>\n```"
+              "description": "```html\n<!-- Paragraph lines -->\n<ore-skeleton variant=\"text\" lines=\"3\" width=\"100%\"></ore-skeleton>\n<!-- Avatar -->\n<ore-skeleton variant=\"circle\" size=\"md\"></ore-skeleton>\n<!-- Card image -->\n<ore-skeleton width=\"100%\" height=\"10rem\"></ore-skeleton>\n```"
             }
           ]
         }
@@ -6779,18 +6779,18 @@
       "exports": [
         {
           "kind": "js",
-          "name": "CHIP_TAG",
+          "name": "SKELETON_TAG",
           "declaration": {
-            "name": "CHIP_TAG",
-            "module": "src/feedback/chip/chip.ts"
+            "name": "SKELETON_TAG",
+            "module": "src/feedback/skeleton/skeleton.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "OreChipElement",
+          "name": "OreSkeletonElement",
           "declaration": {
-            "name": "OreChipElement",
-            "module": "src/feedback/chip/chip.ts"
+            "name": "OreSkeletonElement",
+            "module": "src/feedback/skeleton/skeleton.ts"
           }
         }
       ]
@@ -10875,254 +10875,26 @@
               "description": "Border color"
             },
             {
-              "name": "--select-radius",
-              "description": "Border radius"
-            },
-            {
-              "name": "--select-padding",
-              "description": "Padding"
-            },
-            {
-              "name": "--select-font-size",
-              "description": "Font size"
-            },
-            {
-              "name": "--select-placeholder-color",
-              "description": "Placeholder text color"
-            }
-          ],
-          "demos": [
-            {
-              "url": "",
-              "description": "```html\n<ore-select label=\"Role\" value=\"admin\">\n  <option value=\"admin\">Administrator</option>\n  <option value=\"editor\">Editor</option>\n  <option value=\"viewer\">Viewer</option>\n</ore-select>\n<ore-select label=\"Tags\" multiple color=\"primary\">\n  <optgroup label=\"Frontend\">\n    <option value=\"react\">React</option>\n    <option value=\"vue\">Vue</option>\n  </optgroup>\n  <optgroup label=\"Backend\">\n    <option value=\"node\">Node.js</option>\n  </optgroup>\n</ore-select>\n```"
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SELECT_TAG",
-          "declaration": {
-            "name": "SELECT_TAG",
-            "module": "src/inputs/select/select.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "OreSelectElement",
-          "declaration": {
-            "name": "OreSelectElement",
-            "module": "src/inputs/select/select.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/inputs/slider/slider.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "SLIDER_TAG",
-          "type": {
-            "text": "'ore-slider'"
-          },
-          "default": "'ore-slider'",
-          "description": "A slider for selecting a single numeric value or a numeric range.\n\nAdd the boolean `range` attribute to activate two-thumb range mode."
-        },
-        {
-          "kind": "class",
-          "name": "OreSliderElement",
-          "tagName": "ore-slider",
-          "customElement": true,
-          "description": "A slider for selecting a single numeric value or a numeric range.\nAdd the boolean `range` attribute to activate two-thumb range mode.",
-          "summary": "",
-          "attributes": [
-            {
-              "name": "min",
-              "type": {
-                "text": "number"
-              },
-              "description": "Minimum value (default: 0)",
-              "default": "0"
-            },
-            {
-              "name": "max",
-              "type": {
-                "text": "number"
-              },
-              "description": "Maximum value (default: 100)",
-              "default": "100"
-            },
-            {
-              "name": "step",
-              "type": {
-                "text": "number"
-              },
-              "description": "Step increment (default: 1)",
-              "default": "1"
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "number"
-              },
-              "description": "Current value (single mode)"
-            },
-            {
-              "name": "from",
-              "type": {
-                "text": "number"
-              },
-              "description": "Lower bound (range mode)"
-            },
-            {
-              "name": "to",
-              "type": {
-                "text": "number"
-              },
-              "description": "Upper bound (range mode)"
-            },
-            {
-              "name": "range",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Activate range mode"
-            },
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Disable interaction"
-            },
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "description": "Form field name (single mode)"
-            },
-            {
-              "name": "color",
-              "type": {
-                "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-              },
-              "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "'sm' | 'md' | 'lg'"
-              },
-              "description": "'sm' | 'md' | 'lg'"
-            },
-            {
-              "name": "helper",
-              "type": {
-                "text": "string"
-              },
-              "description": "Helper text below the slider"
-            },
-            {
-              "name": "error",
-              "type": {
-                "text": "string"
-              },
-              "description": "Error message below the slider"
-            },
-            {
-              "name": "fullwidth",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Stretch to full width of container"
-            }
-          ],
-          "events": [
-            {
-              "name": "input",
-              "description": "Emitted when the slider value changes.",
-              "type": {
-                "text": "CustomEvent"
-              }
-            },
-            {
-              "name": "change",
-              "description": "Emitted when the slider value changes.",
-              "type": {
-                "text": "CustomEvent"
-              }
-            }
-          ],
-          "slots": [
-            {
-              "name": "",
-              "description": "Slider label text"
-            }
-          ],
-          "cssParts": [
-            {
-              "name": "slider",
-              "description": "Slider container"
-            },
-            {
-              "name": "track",
-              "description": "Track element"
-            },
-            {
-              "name": "fill",
-              "description": "Fill element"
-            },
-            {
-              "name": "thumb",
-              "description": "Single-value thumb"
-            },
-            {
-              "name": "thumb-start",
-              "description": "Range start thumb"
-            },
-            {
-              "name": "thumb-end",
-              "description": "Range end thumb"
-            },
-            {
-              "name": "label",
-              "description": "Label element"
-            },
-            {
-              "name": "helper-text",
-              "description": "The helper/error text element"
-            }
-          ],
-          "cssProperties": [
-            {
-              "name": "--slider-height",
-              "description": "Track height"
-            },
-            {
-              "name": "--slider-size",
-              "description": "Thumb dimensions"
+              "name": "--select-radius",
+              "description": "Border radius"
             },
             {
-              "name": "--slider-track-bg",
-              "description": "Track background color"
+              "name": "--select-padding",
+              "description": "Padding"
             },
             {
-              "name": "--slider-fill",
-              "description": "Active fill color"
+              "name": "--select-font-size",
+              "description": "Font size"
             },
             {
-              "name": "--slider-thumb-bg",
-              "description": "Thumb background color"
+              "name": "--select-placeholder-color",
+              "description": "Placeholder text color"
             }
           ],
           "demos": [
             {
               "url": "",
-              "description": "```html\n<ore-slider value=\"50\" name=\"volume\">Volume</ore-slider>\n<ore-slider range from=\"20\" to=\"80\" color=\"primary\">Price range</ore-slider>\n```"
+              "description": "```html\n<ore-select label=\"Role\" value=\"admin\">\n  <option value=\"admin\">Administrator</option>\n  <option value=\"editor\">Editor</option>\n  <option value=\"viewer\">Viewer</option>\n</ore-select>\n<ore-select label=\"Tags\" multiple color=\"primary\">\n  <optgroup label=\"Frontend\">\n    <option value=\"react\">React</option>\n    <option value=\"vue\">Vue</option>\n  </optgroup>\n  <optgroup label=\"Backend\">\n    <option value=\"node\">Node.js</option>\n  </optgroup>\n</ore-select>\n```"
             }
           ]
         }
@@ -11130,18 +10902,18 @@
       "exports": [
         {
           "kind": "js",
-          "name": "SLIDER_TAG",
+          "name": "SELECT_TAG",
           "declaration": {
-            "name": "SLIDER_TAG",
-            "module": "src/inputs/slider/slider.ts"
+            "name": "SELECT_TAG",
+            "module": "src/inputs/select/select.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "OreSliderElement",
+          "name": "OreSelectElement",
           "declaration": {
-            "name": "OreSliderElement",
-            "module": "src/inputs/slider/slider.ts"
+            "name": "OreSelectElement",
+            "module": "src/inputs/select/select.ts"
           }
         }
       ]
@@ -11546,6 +11318,234 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/inputs/slider/slider.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "SLIDER_TAG",
+          "type": {
+            "text": "'ore-slider'"
+          },
+          "default": "'ore-slider'",
+          "description": "A slider for selecting a single numeric value or a numeric range.\n\nAdd the boolean `range` attribute to activate two-thumb range mode."
+        },
+        {
+          "kind": "class",
+          "name": "OreSliderElement",
+          "tagName": "ore-slider",
+          "customElement": true,
+          "description": "A slider for selecting a single numeric value or a numeric range.\nAdd the boolean `range` attribute to activate two-thumb range mode.",
+          "summary": "",
+          "attributes": [
+            {
+              "name": "min",
+              "type": {
+                "text": "number"
+              },
+              "description": "Minimum value (default: 0)",
+              "default": "0"
+            },
+            {
+              "name": "max",
+              "type": {
+                "text": "number"
+              },
+              "description": "Maximum value (default: 100)",
+              "default": "100"
+            },
+            {
+              "name": "step",
+              "type": {
+                "text": "number"
+              },
+              "description": "Step increment (default: 1)",
+              "default": "1"
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "number"
+              },
+              "description": "Current value (single mode)"
+            },
+            {
+              "name": "from",
+              "type": {
+                "text": "number"
+              },
+              "description": "Lower bound (range mode)"
+            },
+            {
+              "name": "to",
+              "type": {
+                "text": "number"
+              },
+              "description": "Upper bound (range mode)"
+            },
+            {
+              "name": "range",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Activate range mode"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Disable interaction"
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "Form field name (single mode)"
+            },
+            {
+              "name": "color",
+              "type": {
+                "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+              },
+              "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "'sm' | 'md' | 'lg'"
+              },
+              "description": "'sm' | 'md' | 'lg'"
+            },
+            {
+              "name": "helper",
+              "type": {
+                "text": "string"
+              },
+              "description": "Helper text below the slider"
+            },
+            {
+              "name": "error",
+              "type": {
+                "text": "string"
+              },
+              "description": "Error message below the slider"
+            },
+            {
+              "name": "fullwidth",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Stretch to full width of container"
+            }
+          ],
+          "events": [
+            {
+              "name": "input",
+              "description": "Emitted when the slider value changes.",
+              "type": {
+                "text": "CustomEvent"
+              }
+            },
+            {
+              "name": "change",
+              "description": "Emitted when the slider value changes.",
+              "type": {
+                "text": "CustomEvent"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "Slider label text"
+            }
+          ],
+          "cssParts": [
+            {
+              "name": "slider",
+              "description": "Slider container"
+            },
+            {
+              "name": "track",
+              "description": "Track element"
+            },
+            {
+              "name": "fill",
+              "description": "Fill element"
+            },
+            {
+              "name": "thumb",
+              "description": "Single-value thumb"
+            },
+            {
+              "name": "thumb-start",
+              "description": "Range start thumb"
+            },
+            {
+              "name": "thumb-end",
+              "description": "Range end thumb"
+            },
+            {
+              "name": "label",
+              "description": "Label element"
+            },
+            {
+              "name": "helper-text",
+              "description": "The helper/error text element"
+            }
+          ],
+          "cssProperties": [
+            {
+              "name": "--slider-height",
+              "description": "Track height"
+            },
+            {
+              "name": "--slider-size",
+              "description": "Thumb dimensions"
+            },
+            {
+              "name": "--slider-track-bg",
+              "description": "Track background color"
+            },
+            {
+              "name": "--slider-fill",
+              "description": "Active fill color"
+            },
+            {
+              "name": "--slider-thumb-bg",
+              "description": "Thumb background color"
+            }
+          ],
+          "demos": [
+            {
+              "url": "",
+              "description": "```html\n<ore-slider value=\"50\" name=\"volume\">Volume</ore-slider>\n<ore-slider range from=\"20\" to=\"80\" color=\"primary\">Price range</ore-slider>\n```"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SLIDER_TAG",
+          "declaration": {
+            "name": "SLIDER_TAG",
+            "module": "src/inputs/slider/slider.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "OreSliderElement",
+          "declaration": {
+            "name": "OreSliderElement",
+            "module": "src/inputs/slider/slider.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/inputs/switch/switch.ts",