@vanrot/ui 0.0.0

package/web-types.json

@@ -0,0 +1,542 @@
+{
+  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
+  "name": "@vanrot/ui",
+  "version": "0.0.0",
+  "contributions": {
+    "html": {
+      "elements": [
+        {
+          "name": "vr-alert",
+          "description": "Use <vr-alert> to show important feedback such as info, success, warning, or danger messages. Put the message text inside the element. Vanrot-specific attributes: variant.info, variant.success, variant.warning, variant.danger. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "variant.info", "description": "Info alert variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.success", "description": "Success alert variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.warning", "description": "Warning alert variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.danger", "description": "Danger alert variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-avatar",
+          "description": "Use <vr-avatar> to show a person, team, or account image/fallback. Put initials, an image, or fallback content inside it. Vanrot-specific attributes: variant.default, variant.soft, variant.outline. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "variant.default", "description": "Default avatar variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.soft", "description": "Soft avatar variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.outline", "description": "Outline avatar variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-badge",
+          "description": "Use <vr-badge> for small status labels, counts, and short metadata. Put the label text inside it. Vanrot-specific attributes: variant.default, variant.secondary, variant.success, variant.warning, variant.danger, variant.outline. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "variant.default", "description": "Default badge variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.secondary", "description": "Secondary badge variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.success", "description": "Success badge variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.warning", "description": "Warning badge variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.danger", "description": "Danger badge variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.outline", "description": "Outline badge variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-breadcrumb", "description": "Use <vr-breadcrumb> to show where the current page sits in the app. Put breadcrumb links or items inside it. Vanrot-specific attributes: none. Use normal HTML attributes such as class, id, aria-*, and data-* when needed." },
+        {
+          "name": "vr-button",
+          "description": "Use <vr-button> for clickable actions. Put the button label or icon inside it. Vanrot-specific attributes: variant.default, variant.secondary, variant.outline, variant.ghost, variant.danger, variant.link. Use normal button attributes such as type, disabled, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "variant.default", "description": "Default button variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.secondary", "description": "Secondary button variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.outline", "description": "Outline button variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.ghost", "description": "Ghost button variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.danger", "description": "Danger button variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.link", "description": "Link button variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-card",
+          "description": "Use <vr-card> to group related content and actions in a bordered surface. Put headings, text, media, and controls inside it. Vanrot-specific attributes: variant.default, variant.muted, variant.interactive. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "variant.default", "description": "Default card variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.muted", "description": "Muted card variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.interactive", "description": "Interactive card variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-checkbox",
+          "description": "Use <vr-checkbox> for an on/off form choice. It behaves like a native checkbox and can be controlled by your app state. Vanrot-specific attributes: checked, size.md, disabled, name, value, aria-label. Use normal form and accessibility attributes when needed.",
+          "attributes": [
+            { "name": "checked", "description": "Sets the native checked state.", "value": { "kind": "no-value" } },
+            { "name": "size.md", "description": "Medium checkbox size.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Form field name." },
+            { "name": "value", "description": "Submitted value." },
+            { "name": "aria-label", "description": "Accessible label." }
+          ]
+        },
+        {
+          "name": "vr-command-menu",
+          "description": "Use <vr-command-menu> for a searchable command palette or action picker. Compose it with input, list, group, item, shortcut, and empty-state child elements. Vanrot-specific attributes: aria-label, placeholder. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "aria-label", "description": "Accessible label for the command menu." },
+            { "name": "placeholder", "description": "Search input placeholder text." }
+          ]
+        },
+        { "name": "vr-command-menu-empty", "description": "Use <vr-command-menu-empty> for the message shown when no command matches the search. Put short empty-state text inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-command-menu-group", "description": "Use <vr-command-menu-group> to group related command menu items under one section. Put command items inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-command-menu-input", "description": "Use <vr-command-menu-input> as the search field for a command menu. Bind its value in your app when you need controlled filtering. Vanrot-specific attributes: none. Use normal input attributes when needed." },
+        { "name": "vr-command-menu-item", "description": "Use <vr-command-menu-item> for one selectable command or action. Put the visible label and optional shortcut inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-command-menu-list", "description": "Use <vr-command-menu-list> as the scrollable list that contains command groups and items. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-command-menu-shortcut", "description": "Use <vr-command-menu-shortcut> to show the keyboard shortcut for a command menu item. Put the shortcut text inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-container", "description": "Use <vr-container> to constrain page content to a readable width. Put page or section content inside it. Vanrot-specific attributes: none. Use normal HTML attributes such as class, id, aria-*, and data-* when needed." },
+        {
+          "name": "vr-dialog",
+          "description": "Use <vr-dialog> for modal content that needs focused attention. Compose it with trigger, content, header, title, description, footer, and close child elements. Vanrot-specific attributes: open, size.sm, size.md, size.lg, aria-label, aria-describedby. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "open", "description": "Controls whether the dialog is open." },
+            { "name": "size.sm", "description": "Small dialog size.", "value": { "kind": "no-value" } },
+            { "name": "size.md", "description": "Medium dialog size.", "value": { "kind": "no-value" } },
+            { "name": "size.lg", "description": "Large dialog size.", "value": { "kind": "no-value" } },
+            { "name": "aria-label", "description": "Accessible label for the dialog." },
+            { "name": "aria-describedby", "description": "Id of the dialog description." }
+          ]
+        },
+        { "name": "vr-dialog-close", "description": "Use <vr-dialog-close> for the button or control that closes a dialog. Put an icon or label inside it. Vanrot-specific attributes: none. Use normal button attributes when needed." },
+        { "name": "vr-dialog-content", "description": "Use <vr-dialog-content> for the main body of a dialog. Put the form, message, or task content inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-dialog-description", "description": "Use <vr-dialog-description> for supporting text that explains the dialog. Keep it short and connect it with aria-describedby when needed. Vanrot-specific attributes: none." },
+        { "name": "vr-dialog-footer", "description": "Use <vr-dialog-footer> for dialog actions such as Cancel, Save, or Delete. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-dialog-header", "description": "Use <vr-dialog-header> to group the dialog title and description. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        { "name": "vr-dialog-title", "description": "Use <vr-dialog-title> for the main heading of a dialog. Put the title text inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-dialog-trigger", "description": "Use <vr-dialog-trigger> for the control that opens a dialog. Put a button label or icon inside it. Vanrot-specific attributes: none. Use normal button attributes when needed." },
+        {
+          "name": "vr-drawer",
+          "description": "Use <vr-drawer> for a side, top, or bottom panel that slides over the page. Compose it with trigger, content, header, title, description, footer, and close child elements. Vanrot-specific attributes: open, side.left, side.right, side.top, side.bottom, aria-label. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "open", "description": "Controls whether the drawer is open." },
+            { "name": "side.left", "description": "Left drawer side.", "value": { "kind": "no-value" } },
+            { "name": "side.right", "description": "Right drawer side.", "value": { "kind": "no-value" } },
+            { "name": "side.top", "description": "Top drawer side.", "value": { "kind": "no-value" } },
+            { "name": "side.bottom", "description": "Bottom drawer side.", "value": { "kind": "no-value" } },
+            { "name": "aria-label", "description": "Accessible label for the drawer." }
+          ]
+        },
+        { "name": "vr-drawer-close", "description": "Use <vr-drawer-close> for the button or control that closes a drawer. Put an icon or label inside it. Vanrot-specific attributes: none. Use normal button attributes when needed." },
+        { "name": "vr-drawer-content", "description": "Use <vr-drawer-content> for the main body of a drawer. Put navigation, filters, forms, or detail content inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-drawer-description", "description": "Use <vr-drawer-description> for supporting text that explains the drawer. Keep it short. Vanrot-specific attributes: none." },
+        { "name": "vr-drawer-footer", "description": "Use <vr-drawer-footer> for drawer actions or secondary controls. Vanrot-specific attributes: none." },
+        { "name": "vr-drawer-header", "description": "Use <vr-drawer-header> to group the drawer title and description. Vanrot-specific attributes: none." },
+        { "name": "vr-drawer-title", "description": "Use <vr-drawer-title> for the main heading of a drawer. Put the title text inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-drawer-trigger", "description": "Use <vr-drawer-trigger> for the control that opens a drawer. Put a button label or icon inside it. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-dropdown",
+          "description": "Use <vr-dropdown> for a compact menu of actions or choices. Compose it with trigger, content, item, label, and separator child elements. Vanrot-specific attributes: open, placement.bottom, placement.top, placement.left, placement.right, align.end. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "open", "description": "Controls whether the dropdown is open." },
+            { "name": "placement.bottom", "description": "Bottom dropdown placement.", "value": { "kind": "no-value" } },
+            { "name": "placement.top", "description": "Top dropdown placement.", "value": { "kind": "no-value" } },
+            { "name": "placement.left", "description": "Left dropdown placement.", "value": { "kind": "no-value" } },
+            { "name": "placement.right", "description": "Right dropdown placement.", "value": { "kind": "no-value" } },
+            { "name": "align.end", "description": "End-aligned dropdown content.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-dropdown-content", "description": "Use <vr-dropdown-content> for the menu panel shown by a dropdown. Put labels, items, and separators inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-dropdown-item", "description": "Use <vr-dropdown-item> for one selectable dropdown action. Put the action label inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-dropdown-label", "description": "Use <vr-dropdown-label> for a non-clickable section label inside dropdown content. Vanrot-specific attributes: none." },
+        { "name": "vr-dropdown-separator", "description": "Use <vr-dropdown-separator> to divide groups inside dropdown content. Vanrot-specific attributes: none." },
+        { "name": "vr-dropdown-trigger", "description": "Use <vr-dropdown-trigger> for the control that opens a dropdown. Put a button label or icon inside it. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-empty-state",
+          "description": "Use <vr-empty-state> when a page, list, or search has no content to show. Put the empty message and optional action inside it. Vanrot-specific attributes: tone.muted. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "tone.muted", "description": "Muted empty state tone.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-footer",
+          "description": "Use <vr-footer> for the bottom area of a page or section. Put copyright text, secondary links, or actions inside it. Vanrot-specific attributes: none. Use normal HTML attributes such as class, id, aria-*, and data-* when needed."
+        },
+        {
+          "name": "vr-form",
+          "description": "Use <vr-form> to group related form fields and submit actions. Keep validation and submit logic in your component state. Vanrot-specific attributes: disabled, pending, name. Use normal form attributes when needed.",
+          "attributes": [
+            { "name": "disabled", "description": "Disables all registered fields.", "value": { "kind": "no-value" } },
+            { "name": "pending", "description": "Marks submit as in progress.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Application-owned form name." }
+          ]
+        },
+        {
+          "name": "vr-form-field",
+          "description": "Use <vr-form-field> to pair a label, help text, validation state, and a control. Put the control inside or connect it by name. Vanrot-specific attributes: required, name, label, description. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "required", "description": "Marks the registered field required.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Field name." },
+            { "name": "label", "description": "Field label content." },
+            { "name": "description", "description": "Field help content." }
+          ]
+        },
+        {
+          "name": "vr-grid",
+          "description": "Use <vr-grid> to lay out related cards, fields, or panels in columns. Put grid items inside it. Vanrot-specific attributes: cols.3. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "attributes": [
+            { "name": "cols.3", "description": "Three-column grid layout.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-header",
+          "description": "Use <vr-header> for the top area of a page or section. Put the logo, title, navigation, or actions inside it. It lowers to a native header element with Vanrot styling. Vanrot-specific attributes: none. Use normal HTML attributes such as class, id, aria-*, and data-* when needed.",
+          "source": { "file": "src/primitives/header/ui.header.ts", "offset": 0 }
+        },
+        { "name": "vr-img", "description": "Use <vr-img> for a styled image wrapper. Provide normal image attributes such as src, alt, width, height, loading, and decoding as needed. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-input",
+          "description": "Use <vr-input> for text, email, password, or number fields. Bind value in your app when you need controlled input. Vanrot-specific attributes: type.text, type.email, type.password, type.number, size.sm, size.md, size.lg, size.xl, tone.default, tone.success, tone.warning, tone.danger, disabled, readonly, invalid, name, value, placeholder, aria-label. Use normal input attributes when needed.",
+          "attributes": [
+            { "name": "type.text", "description": "Text input type.", "value": { "kind": "no-value" } },
+            { "name": "type.email", "description": "Email input type.", "value": { "kind": "no-value" } },
+            { "name": "type.password", "description": "Password input type.", "value": { "kind": "no-value" } },
+            { "name": "type.number", "description": "Number input type.", "value": { "kind": "no-value" } },
+            { "name": "size.sm", "description": "Small input size.", "value": { "kind": "no-value" } },
+            { "name": "size.md", "description": "Medium input size.", "value": { "kind": "no-value" } },
+            { "name": "size.lg", "description": "Large input size.", "value": { "kind": "no-value" } },
+            { "name": "size.xl", "description": "Extra-large input size.", "value": { "kind": "no-value" } },
+            { "name": "tone.default", "description": "Default input tone.", "value": { "kind": "no-value" } },
+            { "name": "tone.success", "description": "Success input tone.", "value": { "kind": "no-value" } },
+            { "name": "tone.warning", "description": "Warning input tone.", "value": { "kind": "no-value" } },
+            { "name": "tone.danger", "description": "Danger input tone.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "readonly", "description": "Marks the control read-only.", "value": { "kind": "no-value" } },
+            { "name": "invalid", "description": "Marks the control invalid.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Form field name." },
+            { "name": "value", "description": "Input value." },
+            { "name": "placeholder", "description": "Placeholder text." },
+            { "name": "aria-label", "description": "Accessible label." }
+          ]
+        },
+        { "name": "vr-label", "description": "Use <vr-label> for the visible label of a form control. Put label text inside it and connect it with normal label attributes when needed. Vanrot-specific attributes: none." },
+        { "name": "vr-layout", "description": "Use <vr-layout> as a page-level layout wrapper. Put header, sidebar, main content, and footer regions inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        {
+          "name": "vr-list",
+          "description": "Use <vr-list> for a styled list of related items. Put <vr-list-item> children inside it. Vanrot-specific attributes: marker.check. Use normal list attributes when needed.",
+          "attributes": [
+            { "name": "marker.check", "description": "Checkmark list marker.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-list-item", "description": "Use <vr-list-item> for one item inside a Vanrot list. Put the item content inside it. Vanrot-specific attributes: none. Use normal HTML attributes when needed." },
+        {
+          "name": "vr-loader",
+          "description": "Use <vr-loader> to show work in progress while content is loading. Use an accessible label when the loading state is not obvious. Vanrot-specific attributes: variant.spinner, variant.dots, variant.bar. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "variant.spinner", "description": "Spinner loader variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.dots", "description": "Dots loader variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.bar", "description": "Bar loader variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-nav", "description": "Use <vr-nav> for primary or secondary navigation links. Put route links or buttons inside it. Vanrot-specific attributes: none. Use normal nav and accessibility attributes when needed." },
+        {
+          "name": "vr-pagination",
+          "description": "Use <vr-pagination> to move through pages of data. Put page buttons, previous/next controls, or status text inside it. Vanrot-specific attributes: size.md. Use normal accessibility attributes when needed.",
+          "attributes": [
+            { "name": "size.md", "description": "Medium pagination size.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-popover",
+          "description": "Use <vr-popover> for contextual content attached to a trigger, such as small details or quick controls. Compose it with trigger, content, title, description, and close child elements. Vanrot-specific attributes: open, side.top, side.right, side.bottom, side.left, align.end.",
+          "attributes": [
+            { "name": "open", "description": "Controls whether the popover is open." },
+            { "name": "side.top", "description": "Top popover side.", "value": { "kind": "no-value" } },
+            { "name": "side.right", "description": "Right popover side.", "value": { "kind": "no-value" } },
+            { "name": "side.bottom", "description": "Bottom popover side.", "value": { "kind": "no-value" } },
+            { "name": "side.left", "description": "Left popover side.", "value": { "kind": "no-value" } },
+            { "name": "align.end", "description": "End-aligned popover content.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-popover-close", "description": "Use <vr-popover-close> for the control that closes a popover. Put an icon or label inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-popover-content", "description": "Use <vr-popover-content> for the floating panel shown by a popover. Put contextual content inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-popover-description", "description": "Use <vr-popover-description> for supporting text inside a popover. Vanrot-specific attributes: none." },
+        { "name": "vr-popover-title", "description": "Use <vr-popover-title> for the short heading inside a popover. Vanrot-specific attributes: none." },
+        { "name": "vr-popover-trigger", "description": "Use <vr-popover-trigger> for the control that opens a popover. Put a button label or icon inside it. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-radio",
+          "description": "Use <vr-radio> for one choice in a radio group. Pair radios by name and control selection in your app state when needed. Vanrot-specific attributes: checked, size.md, disabled, name, value.",
+          "attributes": [
+            { "name": "checked", "description": "Sets the native checked state.", "value": { "kind": "no-value" } },
+            { "name": "size.md", "description": "Medium radio size.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Form field name." },
+            { "name": "value", "description": "Submitted value." }
+          ]
+        },
+        {
+          "name": "vr-radio-group",
+          "description": "Use <vr-radio-group> to group related radio choices. Put <vr-radio> items inside it and provide an accessible label. Vanrot-specific attributes: disabled, name, value, aria-label.",
+          "attributes": [
+            { "name": "disabled", "description": "Disables the group.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Group name." },
+            { "name": "value", "description": "Selected value." },
+            { "name": "aria-label", "description": "Accessible label." }
+          ]
+        },
+        { "name": "vr-section", "description": "Use <vr-section> to group a meaningful part of a page. Put a heading and related content inside it. Vanrot-specific attributes: none. Use normal section attributes when needed." },
+        {
+          "name": "vr-select",
+          "description": "Use <vr-select> for a dropdown form choice. Bind value in your app when you need controlled selection. Vanrot-specific attributes: size.md, disabled, name, value, placeholder, aria-label. Use normal select attributes when needed.",
+          "attributes": [
+            { "name": "size.md", "description": "Medium select size.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Form field name." },
+            { "name": "value", "description": "Selected value." },
+            { "name": "placeholder", "description": "Placeholder text." },
+            { "name": "aria-label", "description": "Accessible label." }
+          ]
+        },
+        {
+          "name": "vr-separator",
+          "description": "Use <vr-separator> to visually divide sections or menu groups. Vanrot-specific attributes: variant.horizontal, variant.vertical. Use normal accessibility attributes when the separator has meaning.",
+          "attributes": [
+            { "name": "variant.horizontal", "description": "Horizontal separator variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.vertical", "description": "Vertical separator variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-sidebar",
+          "description": "Use <vr-sidebar> for persistent side navigation or supporting page content. Put navigation, filters, or secondary actions inside it. Vanrot-specific attributes: placement.left. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "placement.left", "description": "Left sidebar placement.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-skeleton",
+          "description": "Use <vr-skeleton> as a placeholder while real content loads. Pick the shape that matches the final content. Vanrot-specific attributes: variant.text, variant.avatar, variant.card, variant.block. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "variant.text", "description": "Text skeleton variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.avatar", "description": "Avatar skeleton variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.card", "description": "Card skeleton variant.", "value": { "kind": "no-value" } },
+            { "name": "variant.block", "description": "Block skeleton variant.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-slider",
+          "description": "Use <vr-slider> for numeric values selected along a range. Bind value in your app when you need controlled state. Vanrot-specific attributes: size.md, disabled, min, max, step, value. Use normal form and accessibility attributes when needed.",
+          "attributes": [
+            { "name": "size.md", "description": "Medium slider size.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "min", "description": "Minimum value." },
+            { "name": "max", "description": "Maximum value." },
+            { "name": "step", "description": "Step value." },
+            { "name": "value", "description": "Current value." }
+          ]
+        },
+        { "name": "vr-src", "description": "Use <vr-src> inside a Vanrot image/picture pattern when you need source-specific media. Provide normal source attributes such as srcset, media, and type. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-stat",
+          "description": "Use <vr-stat> to show one metric, KPI, or compact value summary. Put the value and label inside it. Vanrot-specific attributes: tone.success. Use normal HTML attributes when needed.",
+          "attributes": [
+            { "name": "tone.success", "description": "Success stat tone.", "value": { "kind": "no-value" } }
+          ]
+        },
+        {
+          "name": "vr-switch",
+          "description": "Use <vr-switch> for an on/off setting. It behaves like a form control and can be controlled by your app state. Vanrot-specific attributes: checked, size.md, disabled, name, value, aria-label.",
+          "attributes": [
+            { "name": "checked", "description": "Sets the native checked state.", "value": { "kind": "no-value" } },
+            { "name": "size.md", "description": "Medium switch size.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Form field name." },
+            { "name": "value", "description": "Submitted value." },
+            { "name": "aria-label", "description": "Accessible label." }
+          ]
+        },
+        {
+          "name": "vr-table",
+          "description": "Use <vr-table> for structured rows and columns. Compose it with table header, body, row, head, cell, caption, and footer child elements. Vanrot-specific attributes: density.compact. Use normal table attributes when needed.",
+          "attributes": [
+            { "name": "density.compact", "description": "Compact table density.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-table-body", "description": "Use <vr-table-body> for the main rows of a Vanrot table. Put <vr-table-row> children inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-table-caption", "description": "Use <vr-table-caption> to describe what a table contains. Put short caption text inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-table-cell", "description": "Use <vr-table-cell> for one body cell in a Vanrot table row. Put cell content inside it. Vanrot-specific attributes: none. Use normal table cell attributes when needed." },
+        { "name": "vr-table-footer", "description": "Use <vr-table-footer> for summary rows or table footer content. Vanrot-specific attributes: none." },
+        { "name": "vr-table-head", "description": "Use <vr-table-head> for one header cell in a Vanrot table row. Put the column label inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-table-header", "description": "Use <vr-table-header> for the header area of a Vanrot table. Put header rows inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-table-row", "description": "Use <vr-table-row> for one row in a Vanrot table. Put header or body cells inside it. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-tabs",
+          "description": "Use <vr-tabs> to switch between related panels of content. Compose it with tabs list, trigger, and panel child elements. Vanrot-specific attributes: value, value.overview, orientation.horizontal, orientation.vertical.",
+          "attributes": [
+            { "name": "value", "description": "Selected tab value." },
+            { "name": "value.overview", "description": "Overview tab value.", "value": { "kind": "no-value" } },
+            { "name": "orientation.horizontal", "description": "Horizontal tab orientation.", "value": { "kind": "no-value" } },
+            { "name": "orientation.vertical", "description": "Vertical tab orientation.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-tabs-list", "description": "Use <vr-tabs-list> to group the clickable tab triggers. Put <vr-tabs-trigger> children inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-tabs-panel", "description": "Use <vr-tabs-panel> for the content shown by one selected tab. Vanrot-specific attributes: none. Use normal HTML attributes to connect panel state when needed." },
+        { "name": "vr-tabs-trigger", "description": "Use <vr-tabs-trigger> for one clickable tab choice. Put the tab label inside it. Vanrot-specific attributes: none." },
+        {
+          "name": "vr-textarea",
+          "description": "Use <vr-textarea> for multi-line text input. Bind value in your app when you need controlled input. Vanrot-specific attributes: size.sm, size.md, size.lg, size.xl, disabled, readonly, invalid, name, value, placeholder, aria-label.",
+          "attributes": [
+            { "name": "size.sm", "description": "Small textarea size.", "value": { "kind": "no-value" } },
+            { "name": "size.md", "description": "Medium textarea size.", "value": { "kind": "no-value" } },
+            { "name": "size.lg", "description": "Large textarea size.", "value": { "kind": "no-value" } },
+            { "name": "size.xl", "description": "Extra-large textarea size.", "value": { "kind": "no-value" } },
+            { "name": "disabled", "description": "Disables the control.", "value": { "kind": "no-value" } },
+            { "name": "readonly", "description": "Marks the control read-only.", "value": { "kind": "no-value" } },
+            { "name": "invalid", "description": "Marks the control invalid.", "value": { "kind": "no-value" } },
+            { "name": "name", "description": "Form field name." },
+            { "name": "value", "description": "Textarea value." },
+            { "name": "placeholder", "description": "Placeholder text." },
+            { "name": "aria-label", "description": "Accessible label." }
+          ]
+        },
+        {
+          "name": "vr-toast",
+          "description": "Use <vr-toast> to describe a transient notification. Compose it with item, title, description, close, and viewport child elements. Vanrot-specific attributes: tone.default, tone.success, tone.warning, tone.danger, dismissible.",
+          "attributes": [
+            { "name": "open", "description": "Controls whether the toast is open." },
+            { "name": "tone.default", "description": "Default toast tone.", "value": { "kind": "no-value" } },
+            { "name": "tone.success", "description": "Success toast tone.", "value": { "kind": "no-value" } },
+            { "name": "tone.warning", "description": "Warning toast tone.", "value": { "kind": "no-value" } },
+            { "name": "tone.danger", "description": "Danger toast tone.", "value": { "kind": "no-value" } },
+            { "name": "placement.bottomright", "description": "Bottom-right toast placement.", "value": { "kind": "no-value" } },
+            { "name": "duration", "description": "Toast duration in milliseconds." }
+          ]
+        },
+        { "name": "vr-toast-close", "description": "Use <vr-toast-close> for the control that dismisses a toast. Put an icon or label inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-toast-description", "description": "Use <vr-toast-description> for supporting text inside a toast. Vanrot-specific attributes: none." },
+        { "name": "vr-toast-item", "description": "Use <vr-toast-item> for one toast notification inside a viewport. Put title, description, and close controls inside it. Vanrot-specific attributes: none." },
+        { "name": "vr-toast-title", "description": "Use <vr-toast-title> for the short heading of a toast. Vanrot-specific attributes: none." },
+        { "name": "vr-toast-viewport", "description": "Use <vr-toast-viewport> as the region where toast items are rendered. Vanrot-specific attributes: none. Use aria-live when the toast updates need to be announced." },
+        {
+          "name": "vr-tooltip",
+          "description": "Use <vr-tooltip> for short helper text attached to a trigger. Compose it with trigger and content child elements. Vanrot-specific attributes: open, side.top, side.right, side.bottom, side.left.",
+          "attributes": [
+            { "name": "open", "description": "Controls whether the tooltip is open." },
+            { "name": "side.top", "description": "Top tooltip side.", "value": { "kind": "no-value" } },
+            { "name": "side.right", "description": "Right tooltip side.", "value": { "kind": "no-value" } },
+            { "name": "side.bottom", "description": "Bottom tooltip side.", "value": { "kind": "no-value" } },
+            { "name": "side.left", "description": "Left tooltip side.", "value": { "kind": "no-value" } },
+            { "name": "align.center", "description": "Center-aligned tooltip content.", "value": { "kind": "no-value" } }
+          ]
+        },
+        { "name": "vr-tooltip-content", "description": "Use <vr-tooltip-content> for the short helper text shown by a tooltip. Keep it concise. Vanrot-specific attributes: none." },
+        { "name": "vr-tooltip-trigger", "description": "Use <vr-tooltip-trigger> for the element that shows a tooltip on hover or focus. Vanrot-specific attributes: none. Use normal focusable attributes when needed." }
+      ],
+      "attributes": [
+        { "name": "align.center", "value": { "kind": "no-value" } },
+        { "name": "align.end", "value": { "kind": "no-value" } },
+        { "name": "align.left", "value": { "kind": "no-value" } },
+        { "name": "align.right", "value": { "kind": "no-value" } },
+        { "name": "align.start", "value": { "kind": "no-value" } },
+        { "name": "aria-describedby" },
+        { "name": "aria-label" },
+        { "name": "aria-labelledby" },
+        { "name": "checked", "value": { "kind": "no-value" } },
+        { "name": "cols.1", "value": { "kind": "no-value" } },
+        { "name": "cols.12", "value": { "kind": "no-value" } },
+        { "name": "cols.2", "value": { "kind": "no-value" } },
+        { "name": "cols.3", "value": { "kind": "no-value" } },
+        { "name": "cols.4", "value": { "kind": "no-value" } },
+        { "name": "cols.6", "value": { "kind": "no-value" } },
+        { "name": "delay.instant", "value": { "kind": "no-value" } },
+        { "name": "delay.normal", "value": { "kind": "no-value" } },
+        { "name": "delay.short", "value": { "kind": "no-value" } },
+        { "name": "density.comfortable", "value": { "kind": "no-value" } },
+        { "name": "density.compact", "value": { "kind": "no-value" } },
+        { "name": "density.dense", "value": { "kind": "no-value" } },
+        { "name": "description" },
+        { "name": "disabled", "value": { "kind": "no-value" } },
+        { "name": "filterable", "value": { "kind": "no-value" } },
+        { "name": "for" },
+        { "name": "gap.0", "value": { "kind": "no-value" } },
+        { "name": "gap.1", "value": { "kind": "no-value" } },
+        { "name": "gap.2", "value": { "kind": "no-value" } },
+        { "name": "gap.3", "value": { "kind": "no-value" } },
+        { "name": "gap.4", "value": { "kind": "no-value" } },
+        { "name": "gap.5", "value": { "kind": "no-value" } },
+        { "name": "gap.6", "value": { "kind": "no-value" } },
+        { "name": "gap.8", "value": { "kind": "no-value" } },
+        { "name": "invalid", "value": { "kind": "no-value" } },
+        { "name": "label" },
+        { "name": "loading", "value": { "kind": "no-value" } },
+        { "name": "marker.check", "value": { "kind": "no-value" } },
+        { "name": "marker.decimal", "value": { "kind": "no-value" } },
+        { "name": "marker.disc", "value": { "kind": "no-value" } },
+        { "name": "marker.none", "value": { "kind": "no-value" } },
+        { "name": "max" },
+        { "name": "min" },
+        { "name": "motion.instant", "value": { "kind": "no-value" } },
+        { "name": "motion.subtle", "value": { "kind": "no-value" } },
+        { "name": "name" },
+        { "name": "open" },
+        { "name": "orientation.horizontal", "value": { "kind": "no-value" } },
+        { "name": "orientation.vertical", "value": { "kind": "no-value" } },
+        { "name": "page" },
+        { "name": "pageSize" },
+        { "name": "paginated", "value": { "kind": "no-value" } },
+        { "name": "pending", "value": { "kind": "no-value" } },
+        { "name": "placeholder" },
+        { "name": "placement.bottomleft", "value": { "kind": "no-value" } },
+        { "name": "placement.bottomright", "value": { "kind": "no-value" } },
+        { "name": "placement.left", "value": { "kind": "no-value" } },
+        { "name": "placement.right", "value": { "kind": "no-value" } },
+        { "name": "placement.topleft", "value": { "kind": "no-value" } },
+        { "name": "placement.topright", "value": { "kind": "no-value" } },
+        { "name": "readonly", "value": { "kind": "no-value" } },
+        { "name": "required", "value": { "kind": "no-value" } },
+        { "name": "selectable", "value": { "kind": "no-value" } },
+        { "name": "selected", "value": { "kind": "no-value" } },
+        { "name": "side.bottom", "value": { "kind": "no-value" } },
+        { "name": "side.left", "value": { "kind": "no-value" } },
+        { "name": "side.right", "value": { "kind": "no-value" } },
+        { "name": "side.top", "value": { "kind": "no-value" } },
+        { "name": "size.lg", "value": { "kind": "no-value" } },
+        { "name": "size.md", "value": { "kind": "no-value" } },
+        { "name": "size.sm", "value": { "kind": "no-value" } },
+        { "name": "size.xl", "value": { "kind": "no-value" } },
+        { "name": "size.xs", "value": { "kind": "no-value" } },
+        { "name": "sort" },
+        { "name": "sortable", "value": { "kind": "no-value" } },
+        { "name": "spacing.lg", "value": { "kind": "no-value" } },
+        { "name": "spacing.md", "value": { "kind": "no-value" } },
+        { "name": "spacing.sm", "value": { "kind": "no-value" } },
+        { "name": "step" },
+        { "name": "tone.danger", "value": { "kind": "no-value" } },
+        { "name": "tone.default", "value": { "kind": "no-value" } },
+        { "name": "tone.info", "value": { "kind": "no-value" } },
+        { "name": "tone.muted", "value": { "kind": "no-value" } },
+        { "name": "tone.outline", "value": { "kind": "no-value" } },
+        { "name": "tone.secondary", "value": { "kind": "no-value" } },
+        { "name": "tone.success", "value": { "kind": "no-value" } },
+        { "name": "tone.warning", "value": { "kind": "no-value" } },
+        { "name": "total" },
+        { "name": "type.email", "value": { "kind": "no-value" } },
+        { "name": "type.number", "value": { "kind": "no-value" } },
+        { "name": "type.password", "value": { "kind": "no-value" } },
+        { "name": "type.search", "value": { "kind": "no-value" } },
+        { "name": "type.tel", "value": { "kind": "no-value" } },
+        { "name": "type.text", "value": { "kind": "no-value" } },
+        { "name": "type.url", "value": { "kind": "no-value" } },
+        { "name": "value" },
+        { "name": "variant.avatar", "value": { "kind": "no-value" } },
+        { "name": "variant.bar", "value": { "kind": "no-value" } },
+        { "name": "variant.block", "value": { "kind": "no-value" } },
+        { "name": "variant.card", "value": { "kind": "no-value" } },
+        { "name": "variant.compact", "value": { "kind": "no-value" } },
+        { "name": "variant.danger", "value": { "kind": "no-value" } },
+        { "name": "variant.default", "value": { "kind": "no-value" } },
+        { "name": "variant.dots", "value": { "kind": "no-value" } },
+        { "name": "variant.ghost", "value": { "kind": "no-value" } },
+        { "name": "variant.interactive", "value": { "kind": "no-value" } },
+        { "name": "variant.line", "value": { "kind": "no-value" } },
+        { "name": "variant.link", "value": { "kind": "no-value" } },
+        { "name": "variant.muted", "value": { "kind": "no-value" } },
+        { "name": "variant.numbers", "value": { "kind": "no-value" } },
+        { "name": "variant.outline", "value": { "kind": "no-value" } },
+        { "name": "variant.pill", "value": { "kind": "no-value" } },
+        { "name": "variant.secondary", "value": { "kind": "no-value" } },
+        { "name": "variant.soft", "value": { "kind": "no-value" } },
+        { "name": "variant.spinner", "value": { "kind": "no-value" } },
+        { "name": "variant.text", "value": { "kind": "no-value" } }
+      ]
+    }
+  }
+}