@quidgest/ui 0.22.0 → 0.23.0

package/dist/json/api.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.22.0",
+  "version": "0.23.0",
   "components": [
     {
       "name": "QAccordion",
@@ -76,9 +76,9 @@
             "type": {
               "kind": "enum",
               "values": [
-                "compact",
+                "tight",
                 "comfortable",
-                "loose"
+                "relaxed"
               ]
             },
             "description": "Defines the spacing around the title of each collapsible section.",
@@ -307,12 +307,12 @@
             "type": {
               "kind": "enum",
               "values": [
-                "default",
+                "medium",
+                "small",
                 "large"
               ]
             },
-            "description": "The size of the badge.",
-            "default": "default",
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.",
             "required": false,
             "category": "Presentation"
           },
@@ -336,6 +336,17 @@
             "required": false,
             "category": "State"
           },
+          {
+            "name": "focusable",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "When `false`, the badge and its remove control are excluded from the tab order.\nPointer activation still works. Use inside composite widgets (e.g. QSelect values).",
+            "default": "true",
+            "required": false,
+            "category": "Behavior"
+          },
           {
             "name": "icons",
             "type": {
@@ -421,8 +432,8 @@
         },
         {
           "title": "Size",
-          "description": "Different size options for the badge.",
-          "code": "<q-badge\n\t\t\t\tv-bind=\"args\"\n\t\t\t\ttitle=\"Large Badge\"\n\t\t\t\tsize=\"large\">\n\t\t\t\tLarge Badge\n\t\t\t</q-badge>"
+          "description": "Local size overrides for the badge. Combines with the global density toolbar (product = global × size).",
+          "code": "<div style=\"display: flex; align-items: center; gap: 0.5rem\">\n\t\t\t\t<q-badge v-bind=\"args\" size=\"small\">Small</q-badge>\n\t\t\t\t<q-badge v-bind=\"args\" size=\"medium\">Medium</q-badge>\n\t\t\t\t<q-badge v-bind=\"args\" size=\"large\">Large</q-badge>\n\t\t\t</div>"
         },
         {
           "title": "Clickable",
@@ -627,12 +638,12 @@
             "type": {
               "kind": "enum",
               "values": [
+                "medium",
                 "small",
-                "regular"
+                "large"
               ]
             },
-            "description": "The size of the button, either 'regular' or 'small'.",
-            "default": "regular",
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.",
             "required": false,
             "category": "Presentation"
           },
@@ -681,6 +692,16 @@
             "description": "If true, the button is in a loading state, indicating ongoing activity.",
             "required": false,
             "category": "State"
+          },
+          {
+            "name": "tabindex",
+            "type": {
+              "kind": "primitive",
+              "name": "number"
+            },
+            "description": "Native tab order. Use `-1` to keep the control operable by pointer\nwhile excluding it from sequential keyboard focus.",
+            "required": false,
+            "category": "Behavior"
           }
         ],
         "events": [
@@ -748,9 +769,9 @@
           "code": "<QButton :label=\"Button\" :block=\"true\" />"
         },
         {
-          "title": "Small",
-          "description": "A more compact version of the component. Useful for slotting buttons within other components.",
-          "code": "<div style=\"display: inline-flex; flex-direction: column; gap: 0.5rem;\">\n\t\t\t\t<q-button label=\"Regular\" />\n\t\t\t\t<q-button size=\"small\" label=\"Small\" />\n\t\t\t</div>"
+          "title": "Size",
+          "description": "Local size overrides. Useful for slotting buttons within other components. Combines with the global density toolbar (product = global × size).",
+          "code": "<div style=\"display: flex; align-items: center; gap: 0.5rem\">\n\t\t\t\t<q-button size=\"small\" label=\"Small\" />\n\t\t\t\t<q-button size=\"medium\" label=\"Medium\" />\n\t\t\t\t<q-button size=\"large\" label=\"Large\" />\n\t\t\t</div>"
         }
       ]
     },
@@ -799,6 +820,20 @@
             "required": false,
             "category": "Presentation"
           },
+          {
+            "name": "size",
+            "type": {
+              "kind": "enum",
+              "values": [
+                "medium",
+                "small",
+                "large"
+              ]
+            },
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.\nPropagated to child `QButton` instances via defaults.",
+            "required": false,
+            "category": "Presentation"
+          },
           {
             "name": "disabled",
             "type": {
@@ -1393,13 +1428,12 @@
             "type": {
               "kind": "enum",
               "values": [
+                "medium",
                 "small",
-                "large",
-                "regular"
+                "large"
               ]
             },
-            "description": "The size of the checkbox, either 'regular', 'small' or 'large.",
-            "default": "regular",
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.",
             "required": false,
             "category": "Presentation"
           },
@@ -1507,9 +1541,9 @@
           "code": "<div style=\"display: flex; gap: 2rem\">\n\t\t\t\t<q-checkbox model-value label=\"Primary Color\" color=\"primary\" />\n\t\t\t\t<q-checkbox model-value label=\"Info Color\" color=\"info\" />\n\t\t\t\t<q-checkbox model-value label=\"Success Color\" color=\"success\" />\n\t\t\t\t<q-checkbox model-value label=\"Warning Color\" color=\"warning\" />\n\t\t\t\t<q-checkbox model-value label=\"Danger Color\" color=\"danger\" />\n\t\t\t</div>"
         },
         {
-          "title": "Sizes",
-          "description": "A demonstration of checkboxes with different sizes. Useful for adjusting to different design requirements or accessibility needs.",
-          "code": "<div style=\"display: flex; align-items: center; gap: 2rem\">\n\t\t\t\t<q-checkbox model-value label=\"Small\" size=\"small\" />\n\t\t\t\t<q-checkbox model-value label=\"Regular\" size=\"regular\" />\n\t\t\t\t<q-checkbox model-value label=\"Large\" size=\"large\" />\n\t\t\t</div>"
+          "title": "Size",
+          "description": "A demonstration of checkboxes with different size overrides. Combines with the global density toolbar (product = global × size).",
+          "code": "<div style=\"display: flex; align-items: center; gap: 2rem\">\n\t\t\t\t<q-checkbox model-value label=\"Small\" size=\"small\" />\n\t\t\t\t<q-checkbox model-value label=\"Medium\" size=\"medium\" />\n\t\t\t\t<q-checkbox model-value label=\"Large\" size=\"large\" />\n\t\t\t</div>"
         },
         {
           "title": "Icons",
@@ -1605,9 +1639,9 @@
             "type": {
               "kind": "enum",
               "values": [
-                "compact",
+                "tight",
                 "comfortable",
-                "loose"
+                "relaxed"
               ]
             },
             "description": "Defines the spacing around the title of each collapsible panel.",
@@ -1715,7 +1749,7 @@
         {
           "title": "Spacing",
           "description": "Different spacing options for the collapsible.",
-          "code": "<div style=\"display: flex; flex-direction: column; gap: 1rem; flex-wrap: wrap;\">\n\t\t\t\t<div style=\"flex: 1\">\n\t\t\t\t\t<q-collapsible v-bind=\"args\" title=\"Compact\" spacing=\"compact\">\n\t\t\t\t\t\t<q-text-field label=\"Text input\" size=\"small\"/>\n\t\t\t\t\t</q-collapsible>\n\t\t\t\t</div>\n\t\t\t\t<div style=\"flex: 1\">\n\t\t\t\t\t<q-collapsible v-bind=\"args\" title=\"Comfortable\" spacing=\"comfortable\">\n\t\t\t\t\t\t<q-text-field label=\"Text input\" size=\"small\"/>\n\t\t\t\t\t</q-collapsible>\n\t\t\t\t</div>\n\t\t\t\t<div style=\"flex: 1\">\n\t\t\t\t\t<q-collapsible v-bind=\"args\" title=\"Loose\" spacing=\"loose\">\n\t\t\t\t\t\t<q-text-field label=\"Text input\" size=\"small\"/>\n\t\t\t\t\t</q-collapsible>\n\t\t\t\t</div>\n\t\t\t</div>"
+          "code": "<div style=\"display: flex; flex-direction: column; gap: 1rem; flex-wrap: wrap;\">\n\t\t\t\t<div style=\"flex: 1\">\n\t\t\t\t\t<q-collapsible v-bind=\"args\" title=\"Tight\" spacing=\"tight\">\n\t\t\t\t\t\t<q-text-field label=\"Text input\" size=\"small\"/>\n\t\t\t\t\t</q-collapsible>\n\t\t\t\t</div>\n\t\t\t\t<div style=\"flex: 1\">\n\t\t\t\t\t<q-collapsible v-bind=\"args\" title=\"Comfortable\" spacing=\"comfortable\">\n\t\t\t\t\t\t<q-text-field label=\"Text input\" size=\"small\"/>\n\t\t\t\t\t</q-collapsible>\n\t\t\t\t</div>\n\t\t\t\t<div style=\"flex: 1\">\n\t\t\t\t\t<q-collapsible v-bind=\"args\" title=\"Relaxed\" spacing=\"relaxed\">\n\t\t\t\t\t\t<q-text-field label=\"Text input\" size=\"small\"/>\n\t\t\t\t\t</q-collapsible>\n\t\t\t\t</div>\n\t\t\t</div>"
         },
         {
           "title": "Variant",
@@ -2731,6 +2765,16 @@
             "required": false,
             "category": "Presentation"
           },
+          {
+            "name": "flush",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "When true, removes body inset padding and section dividers (edge-to-edge\nlayout). `QDialogProvider` always sets this for programmatic dialogs; it is\nnot part of `QDialogOptions`. Omit or set false on template `QDialog` for\nthe default padded inset layout.",
+            "required": false,
+            "category": "Presentation"
+          },
           {
             "name": "centerVertically",
             "type": {
@@ -2947,6 +2991,11 @@
           "description": "Displays a header with a custom title.",
           "code": "<QDialog :text=\"You clicked the button!\" :title=\"What did you do?\" :dismissible=\"true\" />"
         },
+        {
+          "title": "Flush",
+          "description": "Edge-to-edge layout (no body inset or section dividers) — same chrome `QDialogProvider` uses for programmatic dialogs.",
+          "code": "<QDialog :title=\"Confirm\" :text=\"Edge-to-edge body and no section hairlines.\" :flush=\"true\" :dismissible=\"true\" />"
+        },
         {
           "title": "With Icon",
           "description": "Shows a custom icon instead of the default one.",
@@ -2965,7 +3014,7 @@
         {
           "title": "Advanced",
           "description": "The optional **body.append** slot in the dialog allows for greater customization options, such as inputs for information retrieval.",
-          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n\t\t\t<q-dialog v-model=\"modelValue\" v-bind=\"args\">\n\t\t\t\t<template #body.append>\n\t\t\t\t\t<div style=\"padding: 0.25rem 1rem;\">\n\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"example@email.com\"/>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</q-dialog>"
+          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n\t\t\t<q-dialog v-model=\"modelValue\" v-bind=\"args\">\n\t\t\t\t<template #body.append>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"example@email.com\"/>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</q-dialog>"
         },
         {
           "title": "Header Slot",
@@ -2985,7 +3034,7 @@
         {
           "title": "Body Slot",
           "description": "For a fully custom dialog, the **body** slot replaces the entire dialog content, except the header and the footer buttons.",
-          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n\t\t\t<q-dialog v-model=\"modelValue\" v-bind=\"args\">\n\t\t\t\t<template #body>\n\t\t\t\t\t<div style=\"display: flex; flex-direction: column; gap: 0.5rem; padding: 0 1rem\">\n\t\t\t\t\t\t<div style=\"display:flex; flex-direction: row; gap: 0.5rem;\">\n\t\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"First name\"/>\n\t\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"Last name\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"Adress\"/>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</q-dialog>"
+          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n\t\t\t<q-dialog v-model=\"modelValue\" v-bind=\"args\">\n\t\t\t\t<template #body>\n\t\t\t\t\t<div style=\"display: flex; flex-direction: column; gap: 0.5rem\">\n\t\t\t\t\t\t<div style=\"display:flex; flex-direction: row; gap: 0.5rem;\">\n\t\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"First name\"/>\n\t\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"Last name\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<q-text-field size=\"block\" placeholder=\"Adress\"/>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</q-dialog>"
         },
         {
           "title": "Footer Slot",
@@ -2995,12 +3044,12 @@
         {
           "title": "Popup Form",
           "description": "An example of a popup form.",
-          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n\t\t\t<q-dialog v-model=\"modelValue\" v-bind=\"args\">\n\t\t\t\t<template #header>\n\t\t\t\t\t<h2 style=\"font-size: 1.05rem; text-transform: uppercase; margin: 0;\">\n\t\t\t\t\t\tContact\n\t\t\t\t\t</h2>\n\t\t\t\t</template>\n\t\t\t\t<template #body>\n\t\t\t\t\t<hr style=\" height: 1px; background-color: var(--q-theme-neutral-light); margin: 0\" />\n\t\t\t\t\t<div style=\"display: flex; flex-direction: column; gap: 0.5rem; padding: 1rem\">\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"Name\"/>\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"E-mail\"/>\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"Telephone\"/>\n\t\t\t\t\t\t<q-text-area size=\"block\" label=\"Description\"/>\n\t\t\t\t\t\t<q-date-time-picker size=\"medium\" label=\"Date\"/>\n\t\t\t\t\t\t<q-select :items=\"items\" label=\"Select\" />\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"Title\"/>\n\t\t\t\t\t</div>\n\t\t\t\t\t<hr style=\"height: 1px; background-color: var(--q-theme-neutral-light); margin: 0\" />\n\t\t\t\t</template>\n\t\t\t\t<template #footer>\n\t\t\t\t\t<div style=\"display: flex; gap: 0.5rem;\">\n\t\t\t\t\t\t<q-button label=\"Save\" variant=\"bold\" @click=\"modelValue = false\">\n\t\t\t\t\t\t\t<q-icon icon=\"floppy\" />\n\t\t\t\t\t\t</q-button>\n\t\t\t\t\t\t<q-button label=\"Cancel\" @click=\"modelValue = false\">\n\t\t\t\t\t\t\t<q-icon icon=\"cancel\" />\n\t\t\t\t\t\t</q-button>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</q-dialog>"
+          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n\t\t\t<q-dialog v-model=\"modelValue\" v-bind=\"args\">\n\t\t\t\t<template #header>\n\t\t\t\t\t<h2 style=\"font-size: 1.05rem; text-transform: uppercase; margin: 0;\">\n\t\t\t\t\t\tContact\n\t\t\t\t\t</h2>\n\t\t\t\t</template>\n\t\t\t\t<template #body>\n\t\t\t\t\t<div style=\"display: flex; flex-direction: column; gap: 0.5rem\">\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"Name\"/>\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"E-mail\"/>\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"Telephone\"/>\n\t\t\t\t\t\t<q-text-area size=\"block\" label=\"Description\"/>\n\t\t\t\t\t\t<q-date-time-picker size=\"medium\" label=\"Date\"/>\n\t\t\t\t\t\t<q-select :items=\"items\" label=\"Select\" />\n\t\t\t\t\t\t<q-text-field size=\"block\" label=\"Title\"/>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t\t<template #footer>\n\t\t\t\t\t<div style=\"display: flex; gap: 0.5rem;\">\n\t\t\t\t\t\t<q-button label=\"Save\" variant=\"bold\" @click=\"modelValue = false\">\n\t\t\t\t\t\t\t<q-icon icon=\"floppy\" />\n\t\t\t\t\t\t</q-button>\n\t\t\t\t\t\t<q-button label=\"Cancel\" @click=\"modelValue = false\">\n\t\t\t\t\t\t\t<q-icon icon=\"cancel\" />\n\t\t\t\t\t\t</q-button>\n\t\t\t\t\t</div>\n\t\t\t\t</template>\n\t\t\t</q-dialog>"
         },
         {
           "title": "Overflown",
           "description": "When the dialog content overflows, the header and footer remain visible while the body becomes scrollable.",
-          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n      <q-dialog v-model=\"modelValue\" v-bind=\"args\">\n        <template #body>\n          <div style=\"padding: 0 1rem;\">\n            <p v-for=\"i in 100\" :key=\"i\">\n              This is a long paragraph of content to demonstrate scrolling behavior within the dialog. Line {{ i }}.\n            </p>\n          </div>\n        </template>\n      </q-dialog>"
+          "code": "<q-button label=\"Click me\" @click=\"modelValue = true\" />\n      <q-dialog v-model=\"modelValue\" v-bind=\"args\">\n        <template #body>\n          <div>\n            <p v-for=\"i in 100\" :key=\"i\">\n              This is a long paragraph of content to demonstrate scrolling behavior within the dialog. Line {{ i }}.\n            </p>\n          </div>\n        </template>\n      </q-dialog>"
         },
         {
           "title": "Focus On Close",
@@ -4203,17 +4252,17 @@
         {
           "title": "SVG Icon",
           "description": "Example using [Material Design Icons](https://pictogrammers.com/library/mdi/).",
-          "code": "<QIcon :icon=\"home\" :type=\"svg\" :size=\"48\" />"
+          "code": "<QIcon :icon=\"home\" :type=\"svg\" />"
         },
         {
           "title": "Font Icon",
           "description": "Example using [Font Awesome Icons](https://fontawesome.com/).",
-          "code": "<QIcon :icon=\"house\" :type=\"font\" :size=\"48\" />"
+          "code": "<QIcon :icon=\"house\" :type=\"font\" />"
         },
         {
           "title": "Custom Colors",
           "description": "Displays an icon with a custom color, conveying semantic meaning.",
-          "code": "<QIcon :icon=\"check\" :type=\"svg\" :size=\"48\" :color=\"success\" />"
+          "code": "<QIcon :icon=\"check\" :type=\"svg\" :color=\"success\" />"
         }
       ]
     },
@@ -5324,7 +5373,7 @@
                 "step"
               ]
             },
-            "description": "How far each navigation action advances the scroll position.\n\nFor `item`, targets are direct `HTMLElement` children of the content track only\n(see {@link QOverflowScrollMode}).",
+            "description": "How far each navigation action advances the scroll position.\n\nFor `item`, targets are direct `HTMLElement` children of the content track only\n(see {@link QOverflowScrollMode}). Children with `aria-hidden=\"true\"` are skipped.",
             "default": "page",
             "required": false,
             "category": "Behavior"
@@ -5346,11 +5395,32 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "When `true` and `direction` is `horizontal`, dominant vertical wheel / trackpad\ndeltas are mapped onto `scrollLeft` (and may `preventDefault` page scroll while\nthe strip can still move). Default `false` so long-page hosts (e.g. future tabs)\nare not surprised; enable for standalone strips that want trackpad UX.",
+            "description": "When `true` and `direction` is `horizontal`, dominant vertical wheel / trackpad\ndeltas are mapped onto `scrollLeft` (and may `preventDefault` page scroll while\nthe strip can still move). Default `false` so long-page hosts (e.g. tabs)\nare not surprised; enable for standalone strips that want trackpad UX.",
             "default": "false",
             "required": false,
             "category": "Behavior"
           },
+          {
+            "name": "contentClass",
+            "type": {
+              "kind": "union",
+              "types": [
+                {
+                  "name": "string"
+                },
+                {
+                  "name": "array",
+                  "value": {
+                    "name": "other",
+                    "value": "unknown[]"
+                  }
+                }
+              ]
+            },
+            "description": "Extra class(es) applied to the content track (`.q-overflow__content`).\n\nUse when a host needs to style or identify the track (e.g. `q-tabs__tablist`).",
+            "required": false,
+            "category": "Presentation"
+          },
           {
             "name": "icons",
             "type": {
@@ -5541,8 +5611,7 @@
               "kind": "primitive",
               "name": "number"
             },
-            "description": "Offset the overlay in the given amount of pixels.",
-            "default": "8",
+            "description": "Offset the overlay in the given amount of pixels along the main axis.\nWhen omitted, uses the computed `--q-overlay-arrow-gap` (density-scaled 8px)\nso the default gap stays paired with the arrow tip.",
             "required": false,
             "category": "Presentation"
           },
@@ -7554,6 +7623,11 @@
           "description": "Displays the bar in different colors.",
           "code": "<q-progress\n\t\t\t\tv-for=\"(_, idx) in colors\"\n\t\t\t\t:key=\"colors[idx]\"\n\t\t\t\t:color=\"colors[idx]\"\n\t\t\t\tstyle=\"margin: 0.25rem 0\"\n\t\t\t\tv-bind=\"args\" />"
         },
+        {
+          "title": "Animated",
+          "description": "Animated solid fill — sheen sweeps across the bar (no stripes required).",
+          "code": "<q-progress v-bind=\"args\" />"
+        },
         {
           "title": "Animated Striped",
           "description": "Displays an animated, striped progress bar.",
@@ -7767,6 +7841,16 @@
             "required": false,
             "category": "Identification"
           },
+          {
+            "name": "disabled",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "Whether the input is disabled.",
+            "required": false,
+            "category": "State"
+          },
           {
             "name": "label",
             "type": {
@@ -7783,7 +7867,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\n\nThe asterisk is decorative (`aria-hidden`). Required state for assistive\ntech should come from the associated control (e.g. native `required` on inputs).",
+            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\n\nThe asterisk is decorative (`aria-hidden`). Required state for assistive\ntech should come from the associated control (e.g. native `required` on inputs).\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
             "required": false,
             "category": "State"
           },
@@ -7810,9 +7894,30 @@
               ]
             },
             "description": "Position of the label relative to the input field.\n- 'left': Label appears to the left of the input\n- 'center': Label appears above the input, centered\n- 'right': Label appears to the right of the input\n- 'topleft': Label appears above the input, aligned to the left\n- 'topright': Label appears above the input, aligned to the right",
+            "default": "topleft",
             "required": false,
             "category": "Presentation"
           },
+          {
+            "name": "readonly",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "Whether the input is readonly.",
+            "required": false,
+            "category": "State"
+          },
+          {
+            "name": "invalid",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "Whether the input is invalid.",
+            "required": false,
+            "category": "State"
+          },
           {
             "name": "name",
             "type": {
@@ -7842,13 +7947,12 @@
             "type": {
               "kind": "enum",
               "values": [
+                "medium",
                 "small",
-                "large",
-                "regular"
+                "large"
               ]
             },
-            "description": "The size of the checkbox, either 'regular', 'small' or 'large'.",
-            "default": "regular",
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.\nPropagated to child `QRadioButton` instances via defaults.",
             "required": false,
             "category": "Presentation"
           },
@@ -7863,36 +7967,6 @@
             "required": false,
             "category": "Behavior"
           },
-          {
-            "name": "disabled",
-            "type": {
-              "kind": "primitive",
-              "name": "boolean"
-            },
-            "description": "If true, the radio button is disabled and cannot be interacted with.",
-            "required": false,
-            "category": "State"
-          },
-          {
-            "name": "readonly",
-            "type": {
-              "kind": "primitive",
-              "name": "boolean"
-            },
-            "description": "If set to true, the radio button is read-only.",
-            "required": false,
-            "category": "State"
-          },
-          {
-            "name": "invalid",
-            "type": {
-              "kind": "primitive",
-              "name": "boolean"
-            },
-            "description": "Indicates whether the provided value fails the validation criteria.",
-            "required": false,
-            "category": "State"
-          },
           {
             "name": "hasFocusOutline",
             "type": {
@@ -7934,6 +8008,11 @@
           "description": "A radio button group displayed horizontally instead of vertically.",
           "code": "<q-radio-group v-bind=\"args\">\n\t\t\t\t<q-radio-button label=\"Email\" value=\"email\" />\n\t\t\t\t<q-radio-button label=\"Phone\" value=\"phone\" />\n\t\t\t\t<q-radio-button label=\"Mail\" value=\"mail\" />\n\t\t\t</q-radio-group>"
         },
+        {
+          "title": "Label Position",
+          "description": "Field `labelPosition` layouts (via `QField`).",
+          "code": "<div style=\"display: flex; flex-direction: column; gap: 1.5rem;\">\n\t\t\t\t<q-radio-group label=\"Top left\" label-position=\"topleft\" model-value=\"a\">\n\t\t\t\t\t<q-radio-button label=\"A\" value=\"a\" />\n\t\t\t\t\t<q-radio-button label=\"B\" value=\"b\" />\n\t\t\t\t</q-radio-group>\n\t\t\t\t<q-radio-group label=\"Left\" label-position=\"left\" model-value=\"a\">\n\t\t\t\t\t<q-radio-button label=\"A\" value=\"a\" />\n\t\t\t\t\t<q-radio-button label=\"B\" value=\"b\" />\n\t\t\t\t</q-radio-group>\n\t\t\t\t<q-radio-group label=\"Right\" label-position=\"right\" model-value=\"a\">\n\t\t\t\t\t<q-radio-button label=\"A\" value=\"a\" />\n\t\t\t\t\t<q-radio-button label=\"B\" value=\"b\" />\n\t\t\t\t</q-radio-group>\n\t\t\t</div>"
+        },
         {
           "title": "Readonly",
           "description": "A read-only radio button group that displays a fixed selection.",
@@ -7955,9 +8034,9 @@
           "code": "<q-radio-group v-bind=\"args\">\n\t\t\t\t<q-radio-button label=\"Primary\" value=\"primary\" color=\"primary\" />\n\t\t\t\t<q-radio-button label=\"Info\" value=\"info\" color=\"info\" />\n\t\t\t\t<q-radio-button label=\"Success\" value=\"success\" color=\"success\" />\n\t\t\t\t<q-radio-button label=\"Warning\" value=\"warning\" color=\"warning\" />\n\t\t\t\t<q-radio-button label=\"Danger\" value=\"danger\" color=\"danger\" />\n\t\t\t</q-radio-group>"
         },
         {
-          "title": "Sizes",
-          "description": "A demonstration of radio buttons with different sizes.",
-          "code": "<q-radio-group v-bind=\"args\">\n\t\t\t\t<q-radio-button label=\"Small\" value=\"small\" size=\"small\"/>\n\t\t\t\t<q-radio-button label=\"Regular\" value=\"regular\"/>\n\t\t\t\t<q-radio-button label=\"Large\" value=\"large\" size=\"large\"/>\n\t\t\t</q-radio-group>"
+          "title": "Size",
+          "description": "A demonstration of radio buttons with different size overrides. Combines with the global density toolbar (product = global × size).",
+          "code": "<q-radio-group v-bind=\"args\">\n\t\t\t\t<q-radio-button label=\"Small\" value=\"small\" size=\"small\"/>\n\t\t\t\t<q-radio-button label=\"Medium\" value=\"medium\" size=\"medium\"/>\n\t\t\t\t<q-radio-button label=\"Large\" value=\"large\" size=\"large\"/>\n\t\t\t</q-radio-group>"
         },
         {
           "title": "Columns",
@@ -8599,8 +8678,7 @@
               "kind": "primitive",
               "name": "number"
             },
-            "description": "Width of the anchor section (in pixels).",
-            "default": "50",
+            "description": "Width of the anchor section in pixels at regular density. Scaled by\n`--q-density-scale` when applied. Omit to use the density-scaled default\nrail width from CSS.",
             "required": false,
             "category": "Presentation"
           },
@@ -8712,12 +8790,12 @@
         {
           "title": "Footer",
           "description": "Use the `footer` slot to add a sticky footer to a sidebar panel.",
-          "code": "<QSidebar v-bind=\"args\">\n\t\t\t\t<q-sidebar-item\n\t\t\t\t\tvalue=\"chat\"\n\t\t\t\t\ttitle=\"Chat\"\n\t\t\t\t\t:icon=\"{ icon: 'robot-happy' }\"\n\t\t\t\t\tinitial-width=\"large\"\n\t\t\t\t\tmin-width=\"medium\"\n\t\t\t\t\tresizable>\n\t\t\t\t\t<template #footer>\n\t\t\t\t\t\t<QCard class=\"prompt\" width=\"block\" elevation=\"low\">\n\t\t\t\t\t\t\t<QTextArea\n\t\t\t\t\t\t\t\tv-model=\"prompt\"\n\t\t\t\t\t\t\t\tclass=\"prompt__textarea\"\n\t\t\t\t\t\t\t\tplaceholder=\"Ask anything\"\n\t\t\t\t\t\t\t\tsize=\"block\"\n\t\t\t\t\t\t\t\t:rows=\"1\"\n\t\t\t\t\t\t\t\tresize=\"none\"\n\t\t\t\t\t\t\t\tautosize\n\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t<template #footer>\n\t\t\t\t\t\t\t\t<div class=\"prompt__actions\">\n\t\t\t\t\t\t\t\t\t<QButton ref=\"upload\" pill>\n\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"plus\" />\n\t\t\t\t\t\t\t\t\t</QButton>\n\t\t\t\t\t\t\t\t\t<QDropdownMenu\n\t\t\t\t\t\t\t\t\t\t:activator=\"uploadRef?.$el\"\n\t\t\t\t\t\t\t\t\t\t:items=\"uploadItems\"\n\t\t\t\t\t\t\t\t\t\t:groups=\"uploadGroups\"\n\t\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t\t<QToggle ref=\"search\" pill>\n\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"earth\" />\n\t\t\t\t\t\t\t\t\t\tSearch\n\t\t\t\t\t\t\t\t\t</QToggle>\n\n\t\t\t\t\t\t\t\t\t<QToggle ref=\"reason\" pill>\n\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"lightbulb-outline\" />\n\t\t\t\t\t\t\t\t\t\tReason\n\t\t\t\t\t\t\t\t\t</QToggle>\n\n\t\t\t\t\t\t\t\t\t<QButton ref=\"more\" pill>\n\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"dots-horizontal\" />\n\t\t\t\t\t\t\t\t\t</QButton>\n\t\t\t\t\t\t\t\t\t<QDropdownMenu :activator=\"moreRef?.$el\" :items=\"moreItems\" />\n\n\t\t\t\t\t\t\t\t\t<QButton ref=\"action\" class=\"prompt__voice-mode\" variant=\"bold\" pill>\n\t\t\t\t\t\t\t\t\t\t<QIcon :icon=\"isPromptEmpty ? 'waveform' : 'arrow-up'\" />\n\t\t\t\t\t\t\t\t\t</QButton>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</QCard>\n\t\t\t\t\t</template>\n\t\t\t\t</q-sidebar-item>\n\t\t\t</QSidebar>"
+          "code": "<div class=\"q-sidebar-stories\">\n\t\t\t\t<QSidebar v-bind=\"args\">\n\t\t\t\t\t<q-sidebar-item\n\t\t\t\t\t\tvalue=\"chat\"\n\t\t\t\t\t\ttitle=\"Chat\"\n\t\t\t\t\t\t:icon=\"{ icon: 'robot-happy' }\"\n\t\t\t\t\t\tinitial-width=\"large\"\n\t\t\t\t\t\tmin-width=\"medium\"\n\t\t\t\t\t\tresizable>\n\t\t\t\t\t\t<template #footer>\n\t\t\t\t\t\t\t<QCard class=\"prompt\" width=\"block\" elevation=\"low\">\n\t\t\t\t\t\t\t\t<QTextArea\n\t\t\t\t\t\t\t\t\tv-model=\"prompt\"\n\t\t\t\t\t\t\t\t\tclass=\"prompt__textarea\"\n\t\t\t\t\t\t\t\t\tplaceholder=\"Ask anything\"\n\t\t\t\t\t\t\t\t\tsize=\"block\"\n\t\t\t\t\t\t\t\t\t:rows=\"1\"\n\t\t\t\t\t\t\t\t\tresize=\"none\"\n\t\t\t\t\t\t\t\t\tautosize\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t<template #footer>\n\t\t\t\t\t\t\t\t\t<div class=\"prompt__actions\">\n\t\t\t\t\t\t\t\t\t\t<QButton ref=\"upload\" pill>\n\t\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"plus\" />\n\t\t\t\t\t\t\t\t\t\t</QButton>\n\t\t\t\t\t\t\t\t\t\t<QDropdownMenu\n\t\t\t\t\t\t\t\t\t\t\t:activator=\"uploadRef?.$el\"\n\t\t\t\t\t\t\t\t\t\t\t:items=\"uploadItems\"\n\t\t\t\t\t\t\t\t\t\t\t:groups=\"uploadGroups\"\n\t\t\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t\t\t<QToggle ref=\"search\" pill>\n\t\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"earth\" />\n\t\t\t\t\t\t\t\t\t\t\tSearch\n\t\t\t\t\t\t\t\t\t\t</QToggle>\n\n\t\t\t\t\t\t\t\t\t\t<QToggle ref=\"reason\" pill>\n\t\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"lightbulb-outline\" />\n\t\t\t\t\t\t\t\t\t\t\tReason\n\t\t\t\t\t\t\t\t\t\t</QToggle>\n\n\t\t\t\t\t\t\t\t\t\t<QButton ref=\"more\" pill>\n\t\t\t\t\t\t\t\t\t\t\t<QIcon icon=\"dots-horizontal\" />\n\t\t\t\t\t\t\t\t\t\t</QButton>\n\t\t\t\t\t\t\t\t\t\t<QDropdownMenu :activator=\"moreRef?.$el\" :items=\"moreItems\" />\n\n\t\t\t\t\t\t\t\t\t\t<QButton ref=\"action\" class=\"prompt__voice-mode\" variant=\"bold\" pill>\n\t\t\t\t\t\t\t\t\t\t\t<QIcon :icon=\"isPromptEmpty ? 'waveform' : 'arrow-up'\" />\n\t\t\t\t\t\t\t\t\t\t</QButton>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t</QCard>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</q-sidebar-item>\n\t\t\t\t</QSidebar>\n\t\t\t</div>"
         },
         {
           "title": "Custom Anchor Items",
           "description": "Use the `anchor` slot to customize items of the sidebar anchor.",
-          "code": "<QSidebar v-bind=\"args\">\n\t\t\t\t<q-sidebar-item value=\"activity\" title=\"Activity\" :icon=\"{ icon: 'bell' }\">\n\t\t\t\t\t<template #anchor>\n\t\t\t\t\t\t<QBadgeIndicator color=\"highlight\">\n\t\t\t\t\t\t\t<QIcon icon=\"bell\" />\n\t\t\t\t\t\t</QBadgeIndicator>\n\t\t\t\t\t</template>\n\t\t\t\t\t<div class=\"alert\">\n\t\t\t\t\t\t<QIcon icon=\"alert\" />\n\t\t\t\t\t\tHeads up!\n\t\t\t\t\t</div>\n\t\t\t\t</q-sidebar-item>\n\t\t\t\t<q-sidebar-item value=\"chat\" title=\"Chat\" :icon=\"{ icon: 'chat' }\" />\n\t\t\t\t<q-sidebar-item value=\"calendar\" title=\"Calendar\" :icon=\"{ icon: 'calendar' }\" />\n\t\t\t\t<q-sidebar-item value=\"calls\" title=\"Calls\" :icon=\"{ icon: 'phone' }\" />\n\t\t\t</QSidebar>"
+          "code": "<div class=\"q-sidebar-stories\">\n\t\t\t\t<QSidebar v-bind=\"args\">\n\t\t\t\t\t<q-sidebar-item value=\"activity\" title=\"Activity\" :icon=\"{ icon: 'bell' }\">\n\t\t\t\t\t\t<template #anchor>\n\t\t\t\t\t\t\t<QBadgeIndicator color=\"highlight\">\n\t\t\t\t\t\t\t\t<QIcon icon=\"bell\" />\n\t\t\t\t\t\t\t</QBadgeIndicator>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<div class=\"alert\">\n\t\t\t\t\t\t\t<QIcon icon=\"alert\" />\n\t\t\t\t\t\t\tHeads up!\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</q-sidebar-item>\n\t\t\t\t\t<q-sidebar-item value=\"chat\" title=\"Chat\" :icon=\"{ icon: 'chat' }\" />\n\t\t\t\t\t<q-sidebar-item value=\"calendar\" title=\"Calendar\" :icon=\"{ icon: 'calendar' }\" />\n\t\t\t\t\t<q-sidebar-item value=\"calls\" title=\"Calls\" :icon=\"{ icon: 'phone' }\" />\n\t\t\t\t</QSidebar>\n\t\t\t</div>"
         }
       ]
     },
@@ -8839,7 +8917,7 @@
     },
     {
       "name": "QSwitch",
-      "description": "The `QSwitch` component is an accessible, customizable toggle control for switching between two states (e.g., on/off, true/false). It supports labels, size variants, custom colors, and disabled states.",
+      "description": "The `QSwitch` component is an accessible, customizable toggle control for switching between two states (e.g., on/off, true/false). It supports labels, size overrides, custom colors, and disabled states.",
       "meta": {
         "props": [
           {
@@ -8959,8 +9037,7 @@
                 "large"
               ]
             },
-            "description": "Size variant of the switch.",
-            "default": "medium",
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.",
             "required": false,
             "category": "Presentation"
           },
@@ -9016,9 +9093,9 @@
           "code": "<QSwitch :readonly=\"true\" />"
         },
         {
-          "title": "Sizes",
-          "description": "Example of the `small`, `medium`, and `large` size variants.",
-          "code": "<div style=\"display: flex; gap: 1rem; align-items: center;\">\n\t\t\t\t<q-switch size=\"small\" />\n\t\t\t\t<q-switch size=\"medium\" />\n\t\t\t\t<q-switch size=\"large\" />\n\t\t\t</div>"
+          "title": "Size",
+          "description": "Example of the `small`, `medium`, and `large` size overrides. Combines with the global density toolbar (product = global × size).",
+          "code": "<div style=\"display: flex; gap: 1rem; align-items: center;\">\n\t\t\t\t<q-switch size=\"small\" label=\"Small\" />\n\t\t\t\t<q-switch size=\"medium\" label=\"Medium\" />\n\t\t\t\t<q-switch size=\"large\" label=\"Large\" />\n\t\t\t</div>"
         },
         {
           "title": "Custom Color",
@@ -9180,6 +9257,16 @@
           "title": "Controlled",
           "description": "Controlled active tab via v-model.",
           "code": "<p>Active: {{ active }}</p>\n\t\t\t<q-tabs v-bind=\"args\" v-model=\"active\">\n\t\t\t\t<q-tab title=\"Details\" value=\"details\">\n\t\t\t\t\tDetails content.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab title=\"History\" value=\"history\">\n\t\t\t\t\tHistory content.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab title=\"Settings\" value=\"settings\">\n\t\t\t\t\tSettings content.\n\t\t\t\t</q-tab>\n\t\t\t</q-tabs>"
+        },
+        {
+          "title": "Overflow",
+          "description": "Many tabs in a narrow strip — overflow arrows scroll one tab at a time.",
+          "code": "<div style=\"max-width: 28rem\">\n\t\t\t\t<q-tabs v-bind=\"args\" v-model=\"active\">\n\t\t\t\t\t<q-tab\n\t\t\t\t\t\tv-for=\"(label, index) in labels\"\n\t\t\t\t\t\t:key=\"label\"\n\t\t\t\t\t\t:title=\"label\"\n\t\t\t\t\t\t:value=\"\\"
+        },
+        {
+          "title": "Overflow Vertical",
+          "description": "Tall vertical rail — overflow arrows scroll one tab at a time.",
+          "code": "<div style=\"height: 16rem; display: flex\">\n\t\t\t\t<q-tabs v-bind=\"args\" v-model=\"active\" style=\"min-height: 0; flex: 1\">\n\t\t\t\t\t<q-tab\n\t\t\t\t\t\tv-for=\"(label, index) in labels\"\n\t\t\t\t\t\t:key=\"label\"\n\t\t\t\t\t\t:title=\"label\"\n\t\t\t\t\t\t:value=\"\\"
         }
       ]
     },
@@ -10072,11 +10159,12 @@
             "type": {
               "kind": "enum",
               "values": [
+                "medium",
                 "small",
-                "regular"
+                "large"
               ]
             },
-            "description": "The size of the button, either 'regular' or 'small'.",
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.",
             "required": false,
             "category": "Presentation"
           },
@@ -10124,6 +10212,16 @@
             "description": "If true, the button is in a loading state, indicating ongoing activity.",
             "required": false,
             "category": "State"
+          },
+          {
+            "name": "tabindex",
+            "type": {
+              "kind": "primitive",
+              "name": "number"
+            },
+            "description": "Native tab order. Use `-1` to keep the control operable by pointer\nwhile excluding it from sequential keyboard focus.",
+            "required": false,
+            "category": "Behavior"
           }
         ],
         "events": [
@@ -10235,6 +10333,20 @@
             "required": false,
             "category": "Presentation"
           },
+          {
+            "name": "size",
+            "type": {
+              "kind": "enum",
+              "values": [
+                "medium",
+                "small",
+                "large"
+              ]
+            },
+            "description": "Local chrome size. Multiplies the inherited global density scale\n(`small` ×0.8, `medium` ×1, `large` ×1.2). Omit to inherit global density only.\nPropagated to child `QButton` instances via defaults.",
+            "required": false,
+            "category": "Presentation"
+          },
           {
             "name": "disabled",
             "type": {