@quidgest/ui 0.17.9 → 0.19.0

package/dist/json/api.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.17.9",
+  "version": "0.19.0",
   "components": [
     {
       "name": "QAccordion",
@@ -1328,7 +1328,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.",
+            "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).",
             "required": false,
             "category": "State"
           },
@@ -1629,7 +1629,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "Show an indicator that there are required elements inside the group.",
+            "description": "Show an indicator that there are required elements inside the group.\n\nThe asterisk is decorative (`aria-hidden`); {@link QRequiredIndicator }\nwith `announce` exposes the state to assistive tech via `.q-sr-only`\n(from `texts.required`).",
             "required": false,
             "category": "State"
           },
@@ -1643,6 +1643,17 @@
             "default": "DEFAULT_ICONS",
             "required": false,
             "category": "Configuration"
+          },
+          {
+            "name": "texts",
+            "type": {
+              "kind": "object",
+              "fields": {}
+            },
+            "description": "Custom accessible strings.",
+            "default": "DEFAULT_TEXTS",
+            "required": false,
+            "category": "Configuration"
           }
         ],
         "events": [
@@ -1993,7 +2004,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -2357,7 +2368,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -3414,7 +3425,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -3569,7 +3580,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -3846,110 +3857,6 @@
         }
       ]
     },
-    {
-      "name": "QGroupBox",
-      "description": "A container with a title that groups related content.",
-      "meta": {
-        "props": [
-          {
-            "name": "id",
-            "type": {
-              "kind": "primitive",
-              "name": "string"
-            },
-            "description": "The component unique identifier.",
-            "required": false,
-            "category": "Identification"
-          },
-          {
-            "name": "title",
-            "type": {
-              "kind": "primitive",
-              "name": "string"
-            },
-            "description": "The title of the group box.",
-            "required": false,
-            "category": "Content"
-          },
-          {
-            "name": "borderless",
-            "type": {
-              "kind": "primitive",
-              "name": "boolean"
-            },
-            "description": "If true, the group box has no borders.",
-            "required": false,
-            "category": "Presentation"
-          },
-          {
-            "name": "variant",
-            "type": {
-              "kind": "enum",
-              "values": [
-                "default",
-                "background",
-                "title-background",
-                "minor",
-                "minor-border-top"
-              ]
-            },
-            "description": "The styling variant of the group box.",
-            "default": "default",
-            "required": false,
-            "category": "Presentation"
-          },
-          {
-            "name": "block",
-            "type": {
-              "kind": "primitive",
-              "name": "boolean"
-            },
-            "description": "If true, the group box spans the full width of its container.",
-            "required": false,
-            "category": "Presentation"
-          }
-        ],
-        "events": [],
-        "slots": [
-          {
-            "name": "default",
-            "description": ""
-          }
-        ]
-      },
-      "examples": [
-        {
-          "title": "Default",
-          "description": "A basic group box with a title and example content.",
-          "code": "<q-group-box v-bind=\"args\">\n\t\t\t\t<span>Example of a group box</span>\n\t\t\t</q-group-box>"
-        },
-        {
-          "title": "No Title",
-          "description": "A group box without a title.",
-          "code": "<QGroupBox  />"
-        },
-        {
-          "title": "Borderless",
-          "description": "A group box without borders.",
-          "code": "<QGroupBox :title=\"Borderless\" :borderless=\"true\" />"
-        },
-        {
-          "title": "Block",
-          "description": "A group box spanning full width of its container.",
-          "code": "<QGroupBox :title=\"Block Group Box\" :block=\"true\" />"
-        },
-        {
-          "title": "Variants",
-          "description": "Group box with different styling variants.",
-          "code": "<div style=\"display: flex; flex-direction: column; gap: 1rem;\">\n\t\t\t\t<q-group-box title=\"Default\" variant=\"default\">\n\t\t\t\t\t<p>Default variant content</p>\n\t\t\t\t</q-group-box>\n\t\t\t\t<q-group-box title=\"Background\" variant=\"background\">\n\t\t\t\t\t<p>Background variant content</p>\n\t\t\t\t</q-group-box>\n\t\t\t\t<q-group-box title=\"Minor\" variant=\"minor\">\n\t\t\t\t\t<p>Minor variant content</p>\n\t\t\t\t</q-group-box>\n\t\t\t\t<q-group-box title=\"Minor Border Top\" variant=\"minor-border-top\">\n\t\t\t\t\t<p>Minor with border top variant content</p>\n\t\t\t\t</q-group-box>\n\t\t\t\t<q-group-box title=\"Title Background\" variant=\"title-background\">\n\t\t\t\t\t<p>Title background variant content</p>\n\t\t\t\t</q-group-box>\n\t\t\t</div>"
-        },
-        {
-          "title": "Nested Groups",
-          "description": "Nested group boxes demonstrating hierarchy.",
-          "code": "<q-group-box v-bind=\"args\">\n\t\t\t\t<p>Top-level content</p>\n\t\t\t\t<q-group-box variant=\"minor\" title=\"Mid Level\">\n\t\t\t\t\t<p>Mid-level content</p>\n\t\t\t\t\t<q-group-box variant=\"minor-border-top\" title=\"Leaf\">\n\t\t\t\t\t\t<p>Leaf content</p>\n\t\t\t\t\t</q-group-box>\n\t\t\t\t</q-group-box>\n\t\t\t</q-group-box>"
-        }
-      ]
-    },
     {
       "name": "QIcon",
       "description": "Displays an icon. Note: This Storybook includes a Material Design Icons v7.3.67 SVG bundle for demonstration purposes. For the complete list of available icons, visit the official [Material Design Icons](https://pictogrammers.com/library/mdi/) page.",
@@ -4063,7 +3970,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -4275,7 +4182,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.",
+            "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).",
             "required": false,
             "category": "State"
           },
@@ -4647,7 +4554,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.",
+            "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).",
             "required": false,
             "category": "State"
           },
@@ -4779,7 +4686,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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.",
             "default": "false",
             "required": false,
             "category": "State"
@@ -5514,7 +5421,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -6152,7 +6059,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.",
+            "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).",
             "required": false,
             "category": "State"
           },
@@ -6416,6 +6323,110 @@
         }
       ]
     },
+    {
+      "name": "QSection",
+      "description": "A container with a title that groups related content.",
+      "meta": {
+        "props": [
+          {
+            "name": "id",
+            "type": {
+              "kind": "primitive",
+              "name": "string"
+            },
+            "description": "The component unique identifier.",
+            "required": false,
+            "category": "Identification"
+          },
+          {
+            "name": "title",
+            "type": {
+              "kind": "primitive",
+              "name": "string"
+            },
+            "description": "The title of the section.",
+            "required": false,
+            "category": "Content"
+          },
+          {
+            "name": "borderless",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "If true, the section has no borders.",
+            "required": false,
+            "category": "Presentation"
+          },
+          {
+            "name": "variant",
+            "type": {
+              "kind": "enum",
+              "values": [
+                "default",
+                "background",
+                "title-background",
+                "minor",
+                "minor-border-top"
+              ]
+            },
+            "description": "The styling variant of the section.",
+            "default": "default",
+            "required": false,
+            "category": "Presentation"
+          },
+          {
+            "name": "block",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "If true, the section spans the full width of its container.",
+            "required": false,
+            "category": "Presentation"
+          }
+        ],
+        "events": [],
+        "slots": [
+          {
+            "name": "default",
+            "description": ""
+          }
+        ]
+      },
+      "examples": [
+        {
+          "title": "Default",
+          "description": "A basic group box with a title and example content.",
+          "code": "<q-section v-bind=\"args\">\n\t\t\t\t<span>Example of a group box</span>\n\t\t\t</q-section>"
+        },
+        {
+          "title": "No Title",
+          "description": "A group box without a title.",
+          "code": "<QSection  />"
+        },
+        {
+          "title": "Borderless",
+          "description": "A group box without borders.",
+          "code": "<QSection :title=\"Borderless\" :borderless=\"true\" />"
+        },
+        {
+          "title": "Block",
+          "description": "A group box spanning full width of its container.",
+          "code": "<QSection :title=\"Block Group Box\" :block=\"true\" />"
+        },
+        {
+          "title": "Variants",
+          "description": "Group box with different styling variants.",
+          "code": "<div style=\"display: flex; flex-direction: column; gap: 1rem;\">\n\t\t\t\t<q-section title=\"Default\" variant=\"default\">\n\t\t\t\t\t<p>Default variant content</p>\n\t\t\t\t</q-section>\n\t\t\t\t<q-section title=\"Background\" variant=\"background\">\n\t\t\t\t\t<p>Background variant content</p>\n\t\t\t\t</q-section>\n\t\t\t\t<q-section title=\"Minor\" variant=\"minor\">\n\t\t\t\t\t<p>Minor variant content</p>\n\t\t\t\t</q-section>\n\t\t\t\t<q-section title=\"Minor Border Top\" variant=\"minor-border-top\">\n\t\t\t\t\t<p>Minor with border top variant content</p>\n\t\t\t\t</q-section>\n\t\t\t\t<q-section title=\"Title Background\" variant=\"title-background\">\n\t\t\t\t\t<p>Title background variant content</p>\n\t\t\t\t</q-section>\n\t\t\t</div>"
+        },
+        {
+          "title": "Nested Groups",
+          "description": "Nested group boxes demonstrating hierarchy.",
+          "code": "<q-section v-bind=\"args\">\n\t\t\t\t<p>Top-level content</p>\n\t\t\t\t<q-section variant=\"minor\" title=\"Mid Level\">\n\t\t\t\t\t<p>Mid-level content</p>\n\t\t\t\t\t<q-section variant=\"minor-border-top\" title=\"Leaf\">\n\t\t\t\t\t\t<p>Leaf content</p>\n\t\t\t\t\t</q-section>\n\t\t\t\t</q-section>\n\t\t\t</q-section>"
+        }
+      ]
+    },
     {
       "name": "QSelect",
       "description": "A list of selectable items, activated by clicking on the main field.",
@@ -6456,7 +6467,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -6798,17 +6809,14 @@
             "required": false
           },
           {
-            "name": "panels",
+            "name": "id",
             "type": {
-              "kind": "array",
-              "elementType": {
-                "name": "object",
-                "value": {}
-              }
+              "kind": "primitive",
+              "name": "string"
             },
-            "description": "List of panels that can be anchored in the sidebar.",
+            "description": "The component unique identifier.",
             "required": false,
-            "category": "Content"
+            "category": "Identification"
           },
           {
             "name": "anchorWidth",
@@ -6873,13 +6881,18 @@
             "type": "[finalWidth: number]"
           }
         ],
-        "slots": []
+        "slots": [
+          {
+            "name": "default",
+            "description": ""
+          }
+        ]
       },
       "examples": [
         {
           "title": "Default",
           "description": "Default sidebar with four panels and basic slot content.",
-          "code": "<QSidebar :panels=\"[\n\t\t\t{ id: 'activity', icon: { icon: 'bell' }, title: 'Activity' },\n\t\t\t{ id: 'chat', icon: { icon: 'chat' }, title: 'Chat' },\n\t\t\t{ id: 'calendar', icon: { icon: 'calendar' }, title: 'Calendar' },\n\t\t\t{ id: 'calls', icon: { icon: 'phone' }, title: 'Calls' }\n\t\t]\" />"
+          "code": "<QSidebar v-bind=\"args\">\n\t\t\t\t${defaultItems}\n\t\t\t</QSidebar>"
         },
         {
           "title": "With Labels",
@@ -6889,42 +6902,47 @@
         {
           "title": "Right",
           "description": "Sidebar positioned on the right side of the screen.",
-          "code": "<QSidebar :position=\"right\" />"
+          "code": "<QSidebar :show-labels=\"true\" :position=\"right\" />"
         },
         {
           "title": "Starts Expanded",
           "description": "Sidebar with a panel expanded by default.",
-          "code": "<QSidebar :model-value=\"activity\" />"
+          "code": "<QSidebar :show-labels=\"true\" :model-value=\"activity\" />"
         },
         {
           "title": "Panel Size",
           "description": "Sidebar panels with different predefined initial widths.",
-          "code": "<QSidebar v-bind=\"args\">\n                <template #content:activity>\n\t\t\t\t\t<div style=\"padding: 0 1rem;\">\n\t\t\t\t\t\t<p>Resize this panel to see how it behaves. Use the toggle group below to set the width of this panel.</p>\n\t\t\t\t\t\t<QToggleGroup v-model=\"args.panels[0].initialWidth\">\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"small\" label=\"Small\" />\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"medium\" label=\"Medium\" />\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"large\" label=\"Large\" />\n\t\t\t\t\t\t</QToggleGroup>\n\t\t\t\t\t</div>\n                </template>\n            </QSidebar>"
+          "code": "<QSidebar v-bind=\"args\">\n\t\t\t\t<q-sidebar-item\n\t\t\t\t\tvalue=\"activity\"\n\t\t\t\t\ttitle=\"Activity\"\n\t\t\t\t\t:icon=\"{ icon: 'bell' }\"\n\t\t\t\t\t:initial-width=\"activityWidth\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<p>Resize this panel to see how it behaves. Use the toggle group below to set the width of this panel.</p>\n\t\t\t\t\t\t<QToggleGroup v-model=\"activityWidth\">\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"small\" label=\"Small\" />\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"medium\" label=\"Medium\" />\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"large\" label=\"Large\" />\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"xlarge\" label=\"XLarge\" />\n\t\t\t\t\t\t\t<QToggleGroupItem value=\"block\" label=\"Block\" />\n\t\t\t\t\t\t</QToggleGroup>\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' }\" initial-width=\"large\" />\n\t\t\t\t<q-sidebar-item value=\"calendar\" title=\"Calendar\" :icon=\"{ icon: 'calendar' }\" initial-width=\"medium\" />\n\t\t\t\t<q-sidebar-item value=\"calls\" title=\"Calls\" :icon=\"{ icon: 'phone' }\" initial-width=\"small\" />\n\t\t\t</QSidebar>"
+        },
+        {
+          "title": "Fluid Sizes",
+          "description": "Sidebar with fluid panel sizes that fill half or all of the container.",
+          "code": "<QSidebar v-bind=\"args\" show-labels>\n\t\t\t\t<q-sidebar-item value=\"half\" title=\"Half\" :icon=\"{ icon: 'resize' }\" initial-width=\"xlarge\">\n\t\t\t\t\tThis panel occupies half of the container width.\n\t\t\t\t</q-sidebar-item>\n\t\t\t\t<q-sidebar-item value=\"full\" title=\"Full\" :icon=\"{ icon: 'arrow-expand' }\" initial-width=\"block\">\n\t\t\t\t\tThis panel occupies the full container width.\n\t\t\t\t</q-sidebar-item>\n\t\t\t</QSidebar>"
         },
         {
           "title": "Resizable",
           "description": "Sidebar with resizable panels enabled.",
-          "code": "<QSidebar :panels=\"[\n\t\t\t{ id: 'activity', icon: { icon: 'bell' }, title: 'Activity', resizable: true },\n\t\t\t{ id: 'chat', icon: { icon: 'chat' }, title: 'Chat', resizable: true },\n\t\t\t{ id: 'calendar', icon: { icon: 'calendar' }, title: 'Calendar', resizable: true },\n\t\t\t{ id: 'calls', icon: { icon: 'phone' }, title: 'Calls', resizable: true }\n\t\t]\" :model-value=\"activity\" />"
+          "code": "<QSidebar v-bind=\"args\">\n\t\t\t\t<q-sidebar-item value=\"activity\" title=\"Activity\" :icon=\"{ icon: 'bell' }\" resizable />\n\t\t\t\t<q-sidebar-item value=\"chat\" title=\"Chat\" :icon=\"{ icon: 'chat' }\" resizable />\n\t\t\t\t<q-sidebar-item value=\"calendar\" title=\"Calendar\" :icon=\"{ icon: 'calendar' }\" resizable />\n\t\t\t\t<q-sidebar-item value=\"calls\" title=\"Calls\" :icon=\"{ icon: 'phone' }\" resizable />\n\t\t\t</QSidebar>"
         },
         {
           "title": "Header",
-          "description": "Use the `header:${id}` slot to add a sticky header to a sidebar panel.",
-          "code": "<QSidebar v-bind=\"args\">\n                <template #header:activity>\n                    <img src=\"/logo.png\" style=\"max-height: 100px; max-width: 150px;\" />\n                </template>\n            </QSidebar>"
+          "description": "Use the `header` slot to add a sticky header to a sidebar panel.",
+          "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 #header>\n\t\t\t\t\t\t<img src=\"/logo.png\" style=\"max-height: 100px; max-width: 150px;\" />\n\t\t\t\t\t</template>\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>"
         },
         {
           "title": "Content",
-          "description": "Use the `content:${id}` slot to add main content to a sidebar panel.",
-          "code": "<QSidebar v-bind=\"args\">\n                <template #content:activity>\n\t\t\t\t\t<div style=\"padding: 0 1rem;\">\n                    \tActivity content goes here.\n\t\t\t\t\t</div>\n                </template>\n            </QSidebar>"
+          "description": "Use the default slot to add main content to a sidebar panel.",
+          "code": "<QSidebar :model-value=\"activity\" />"
         },
         {
           "title": "Footer",
-          "description": "Use the `footer:${id}` slot to add a sticky footer to a sidebar panel.",
-          "code": "<QSidebar v-bind=\"args\">\n              <template #footer:chat>\n                <QCard\n\t\t\t\t\tclass=\"prompt\"\n\t\t\t\t\twidth=\"block\"\n\t\t\t\t\televation=\"low\">\n                  <QTextArea\n                    v-model=\"prompt\"\n                    class=\"prompt__textarea\"\n                    placeholder=\"Ask anything\"\n                    size=\"block\"\n                    :rows=\"1\"\n                    resize=\"none\"\n                    autosize\n                  />\n\n                  <template #footer>\n                    <div class=\"prompt__actions\">\n                      <QButton ref=\"upload\" pill>\n                        <QIcon icon=\"plus\" />\n                      </QButton>\n                      <QDropdownMenu\n                        :activator=\"uploadRef?.$el\"\n                        :items=\"uploadItems\"\n                        :groups=\"uploadGroups\"\n                      />\n\n                      <QToggle ref=\"search\" pill>\n                        <QIcon icon=\"earth\" />\n                        Search\n                      </QToggle>\n\n                      <QToggle ref=\"reason\" pill>\n                        <QIcon icon=\"lightbulb-outline\" />\n                        Reason\n                      </QToggle>\n\n                      <QButton ref=\"more\" pill>\n                        <QIcon icon=\"dots-horizontal\" />\n                      </QButton>\n                      <QDropdownMenu :activator=\"moreRef?.$el\" :items=\"moreItems\" />\n\n                      <QButton\n                        ref=\"action\"\n                        class=\"prompt__voice-mode\"\n                        variant=\"bold\"\n                        pill\n                      >\n                        <QIcon :icon=\"isPromptEmpty ? 'waveform' : 'arrow-up'\" />\n                      </QButton>\n                    </div>\n                  </template>\n                </QCard>\n              </template>\n            </QSidebar>"
+          "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>"
         },
         {
           "title": "Custom Anchor Items",
-          "description": "Use the `anchor:${id}` slot to customize items of the sidebar anchor.",
-          "code": "<QSidebar v-bind=\"args\">\n                <template #anchor:activity=\"{ item }\">\n\t\t\t\t\t<QBadgeIndicator color=\"highlight\">\n\t\t\t\t\t\t<QIcon v-bind=\"item.icon\" />\n\t\t\t\t\t</QBadgeIndicator>\n                </template>\n\t\t\t\t<template #content:activity>\n\t\t\t\t\t<div style=\"padding: 0 1rem;\">\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</div>\n                </template>\n            </QSidebar>"
+          "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>"
         }
       ]
     },
@@ -7084,7 +7102,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.",
+            "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).",
             "required": false,
             "category": "State"
           },
@@ -7249,6 +7267,147 @@
         }
       ]
     },
+    {
+      "name": "QTabs",
+      "description": "Displays a set of tabbed panels. Only one panel is visible at a time.",
+      "meta": {
+        "props": [
+          {
+            "name": "modelValue",
+            "type": {
+              "kind": "primitive",
+              "name": "string"
+            },
+            "description": "",
+            "required": false
+          },
+          {
+            "name": "id",
+            "type": {
+              "kind": "primitive",
+              "name": "string"
+            },
+            "description": "The component unique identifier.",
+            "required": false,
+            "category": "Identification"
+          },
+          {
+            "name": "direction",
+            "type": {
+              "kind": "enum",
+              "values": [
+                "horizontal",
+                "vertical"
+              ]
+            },
+            "description": "Orientation of the tab list.\n\nAlso mapped to `aria-orientation` on the tablist.",
+            "default": "horizontal",
+            "required": false,
+            "category": "Presentation"
+          },
+          {
+            "name": "align",
+            "type": {
+              "kind": "enum",
+              "values": [
+                "start",
+                "end",
+                "center",
+                "justify"
+              ]
+            },
+            "description": "Distribution of tabs along the tab list main axis.",
+            "default": "start",
+            "required": false,
+            "category": "Presentation"
+          },
+          {
+            "name": "variant",
+            "type": {
+              "kind": "enum",
+              "values": [
+                "line",
+                "card"
+              ]
+            },
+            "description": "Visual style of the tabs.",
+            "default": "line",
+            "required": false,
+            "category": "Presentation"
+          },
+          {
+            "name": "disabled",
+            "type": {
+              "kind": "primitive",
+              "name": "boolean"
+            },
+            "description": "If true, disables all nested tabs via defaults cascade.",
+            "required": false,
+            "category": "State"
+          }
+        ],
+        "events": [
+          {
+            "name": "update:modelValue",
+            "description": "",
+            "type": "[value: string]"
+          }
+        ],
+        "slots": [
+          {
+            "name": "default",
+            "description": ""
+          }
+        ]
+      },
+      "examples": [
+        {
+          "title": "Default",
+          "description": "Default horizontal tabs.",
+          "code": "<q-tabs v-bind=\"args\">\n\t\t\t\t<q-tab title=\"Details\" value=\"details\">\n\t\t\t\t\tContent for the details tab.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab title=\"History\" value=\"history\">\n\t\t\t\t\tContent for the history tab.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab title=\"Settings\" value=\"settings\">\n\t\t\t\t\tContent for the settings tab.\n\t\t\t\t</q-tab>\n\t\t\t</q-tabs>"
+        },
+        {
+          "title": "Vertical",
+          "description": "Vertical tab list beside the panels.",
+          "code": "<QTabs :direction=\"vertical\" />"
+        },
+        {
+          "title": "Card",
+          "description": "Card-style folder tabs that merge into the panel.",
+          "code": "<QTabs :variant=\"card\" />"
+        },
+        {
+          "title": "Card Vertical",
+          "description": "Card-style tabs in a vertical layout.",
+          "code": "<QTabs :variant=\"card\" :direction=\"vertical\" />"
+        },
+        {
+          "title": "Align",
+          "description": "Tabs distributed across the tab list.",
+          "code": "<QTabs :align=\"justify\" />"
+        },
+        {
+          "title": "With Required",
+          "description": "Tab with a required asterisk on the label.",
+          "code": "<q-tabs v-bind=\"args\">\n\t\t\t\t<q-tab title=\"Details\" value=\"details\" required>\n\t\t\t\t\tRequired section content.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab title=\"History\" value=\"history\">\n\t\t\t\t\tOptional section content.\n\t\t\t\t</q-tab>\n\t\t\t</q-tabs>"
+        },
+        {
+          "title": "With Title Slots",
+          "description": "Tabs with title, prepend, and append slots.",
+          "code": "<q-tabs v-bind=\"args\">\n\t\t\t\t<q-tab title=\"Inbox\" value=\"inbox\">\n\t\t\t\t\t<template #title.prepend>📥</template>\n\t\t\t\t\t<template #title.append>(3)</template>\n\t\t\t\t\tInbox messages.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab title=\"Sent\" value=\"sent\">\n\t\t\t\t\t<template #title.prepend>📤</template>\n\t\t\t\t\tSent messages.\n\t\t\t\t</q-tab>\n\t\t\t\t<q-tab value=\"alerts\">\n\t\t\t\t\t<template #title>\n\t\t\t\t\t\t<q-badge\n\t\t\t\t\t\t\tvariant=\"bold\"\n\t\t\t\t\t\t\tpill\n\t\t\t\t\t\t\tstyle=\"height: 1.25rem; margin-block: -0.25rem\">\n\t\t\t\t\t\t\tAlerts\n\t\t\t\t\t\t</q-badge>\n\t\t\t\t\t</template>\n\t\t\t\t\tAlert notifications.\n\t\t\t\t</q-tab>\n\t\t\t</q-tabs>"
+        },
+        {
+          "title": "Disabled",
+          "description": "Disabled tab and parent-level disable cascade.",
+          "code": "<q-tabs v-bind=\"args\">\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\" disabled>\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": "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>"
+        }
+      ]
+    },
     {
       "name": "QTextArea",
       "description": "An extension of the `QField` component, providing a specialized field for textual data with multiple lines.",
@@ -7289,7 +7448,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },
@@ -7578,7 +7737,7 @@
               "kind": "primitive",
               "name": "boolean"
             },
-            "description": "If set to true, an asterisk (*) is displayed\nto indicate that the associated field is required.\nIf set to true, an asterisk (*) is displayed\nto indicate that the field is required.",
+            "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"
           },