@viraui/react 1.0.13 → 1.0.14

package/dist/components/textarea/textarea.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-textarea-min-block-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-textarea-padding-block{syntax:"<length>";inherits:true;initial-value:0}@property --vui-textarea-input-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}.viraui__textarea-module__Textarea_mtOUG{--vui-textarea-min-block-size:calc(var(--space-x-large) * 2);--vui-textarea-padding-block:var(--space-small);--vui-textarea-input-border-radius:var(--radius-small);--vui-field-label-padding-inline:calc(var(--vui-textarea-input-border-radius) / 2);inline-size:100%;&:has([required]) .viraui__textarea-module__Label_5dOso:after{content:" ＊";color:var(--highlight-red)}}.viraui__textarea-module__Description_er3zI{padding-inline:calc(var(--vui-textarea-input-border-radius) / 2)}}@layer viraui.overrides{.viraui__textarea-module__CustomBasicInput_Ce7yA{--vui-basic-input-border-radius:var(--vui-textarea-input-border-radius);border:1px solid var(--global-contrast);min-block-size:var(--vui-textarea-min-block-size);padding-block:var(--vui-textarea-padding-block);line-height:1.4;resize:none;&[data-resize=vertical]{resize:vertical}&[data-resize=both]{resize:both}&[data-invalid]{border-color:var(--highlight-red)}&:disabled,&[data-disabled]{border-color:#0000}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-textarea-min-block-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-textarea-padding-block{syntax:"<length>";inherits:true;initial-value:0}@property --vui-textarea-input-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}.viraui__textarea-module__Textarea_mtOUG{--vui-textarea-min-block-size:calc(var(--space-x-large) * 2);--vui-textarea-padding-block:var(--space-small);--vui-textarea-input-border-radius:var(--radius-small);--vui-field-label-padding-inline:calc(var(--vui-textarea-input-border-radius) / 2);inline-size:100%;&:has([required]) .viraui__textarea-module__Label_5dOso:after{content:" ＊";color:var(--highlight-red)}}.viraui__textarea-module__Description_er3zI{padding-inline:var(--vui-field-label-padding-inline)}}@layer viraui.overrides{.viraui__textarea-module__CustomBasicInput_Ce7yA{--vui-basic-input-border-radius:var(--vui-textarea-input-border-radius);border:1px solid var(--global-contrast);min-block-size:var(--vui-textarea-min-block-size);padding-block:var(--vui-textarea-padding-block);line-height:1.4;resize:none;&[data-resize=vertical]{resize:vertical}&[data-resize=horizontal]{resize:horizontal}&[data-resize=both]{resize:both}&[data-resize=block]{resize:block}&[data-resize=inline]{resize:inline}&[data-invalid]{border-color:var(--highlight-red)}&:disabled,&[data-disabled]{border-color:#0000}}}

package/dist/components/textarea/textarea.d.ts

@@ -32,12 +32,13 @@ export type TextareaProps = React.ComponentPropsWithRef<'textarea'> & Omit<Field
      */
     error?: React.ReactNode;
     /**
-     * Resize behavior for the control. Omitted disables resize; `"vertical"` allows vertical resize;
-     * `"both"` allows horizontal and vertical resize.
+     * Native CSS `resize` for the control, serialized to `data-resize`. Omitted keeps resize disabled
+     * (`none`); accepts any valid `CSSProperties['resize']` value such as `"vertical"`, `"horizontal"`,
+     * or `"both"`.
      *
      * @default undefined (no resize)
      */
-    resize?: 'vertical' | 'both';
+    resize?: React.CSSProperties['resize'];
     /**
      * When `true`, sets `field-sizing: content` so the control grows with its value.
      * Still respects `min-block-size` and `resize`. Omitted / `false` keeps the browser fixed default.

package/dist/components/textarea/textarea.guide.json

@@ -4,7 +4,7 @@
   "summary": "Multi-line field control with shared field copy, optional resize, and optional content sizing.",
   "whenToUse": [
     "Multi-line text entry with label, description, and error",
-    "Controlled vertical or bidirectional resize",
+    "Optional native CSS resize (vertical, horizontal, both, and other valid resize values)",
     "Content-sized growth via fitContent",
     "Native textarea attributes through the field control",
     "One or more Textareas inside Fieldset when they belong to a labeled form section with other fields"
@@ -23,19 +23,31 @@
   "related": ["Fieldset", "Textfield", "Text"],
   "properties": {
     "react": {
+      "description": {
+        "description": "Helper copy rendered with `Field.Description` and `Text` while the field is valid."
+      },
+      "error": {
+        "description": "Error copy rendered with `Field.Error` and `Text` in the same slot as `description`. Replaces description while the field is invalid. Validation messages from `validate` are shown by `Field.Error` even when this prop is omitted."
+      },
       "fitContent": {
-        "description": "When true, sets field-sizing: content so the control grows with its value while still respecting min-block-size and resize. Omitted or false keeps the browser fixed default."
+        "description": "When `true`, sets `field-sizing: content` so the control grows with its value. Still respects `min-block-size` and `resize`. Omitted / `false` keeps the browser fixed default."
+      },
+      "label": {
+        "description": "Visible label rendered with shared internal `FieldLabel`."
+      },
+      "resize": {
+        "description": "Native CSS `resize` for the control, serialized to `data-resize`. Omitted keeps resize disabled (`none`); accepts any valid `CSSProperties['resize']` value such as `\"vertical\"`, `\"horizontal\"`, or `\"both\"`."
       }
     },
     "css": {
+      "input-border-radius": {
+        "description": "Corner radius for the BasicInput textarea control (also drives field label/description inline padding)."
+      },
       "min-block-size": {
-        "description": "Minimum block size of the textarea field root."
+        "description": "Minimum block size of the BasicInput textarea control."
       },
       "padding-block": {
-        "description": "Block padding applied through the textarea root."
-      },
-      "input-border-radius": {
-        "description": "Corner radius for the textarea control group."
+        "description": "Block padding on the BasicInput textarea control."
       }
     }
   }

package/dist/components/textfield/textfield.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-textfield-input-height{syntax:"<length>";inherits:true;initial-value:0}@property --vui-textfield-control-group-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-textfield-control-group-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-textfield-control-group-border-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-textfield-control-group-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}.viraui__textfield-module__Textfield_o-70A{--vui-textfield-input-height:var(--space-x-large);--vui-textfield-control-group-background:var(--base-1);--vui-textfield-control-group-color:var(--global-foreground);--vui-textfield-control-group-border-color:var(--global-contrast);--vui-textfield-control-group-border-radius:var(--radius-medium);--vui-field-label-padding-inline:calc(var(--vui-textfield-control-group-border-radius) / 2);inline-size:100%;&:has([required]) .viraui__textfield-module__Label_5rjr0:after{content:" ＊";color:var(--highlight-red)}}.viraui__textfield-module__ControlGroup_2W-OC{box-sizing:border-box;inline-size:100%;min-inline-size:0;block-size:var(--vui-textfield-input-height);background:var(--vui-textfield-control-group-background);border:1px solid var(--vui-textfield-control-group-border-color);border-radius:var(--vui-textfield-control-group-border-radius);&:has(.viraui__textfield-module__CustomBasicInput_oHgtd:focus-visible),&:has(.viraui__textfield-module__CustomBasicInput_oHgtd[data-focused]){outline:var(--outline);outline-offset:var(--outline-offset)}&:has(.viraui__textfield-module__CustomBasicInput_oHgtd[data-invalid]){--vui-textfield-control-group-border-color:var(--highlight-red);box-shadow:none;outline-color:oklab(from var(--highlight-red) l a b/.5)}&:has(.viraui__textfield-module__CustomBasicInput_oHgtd:disabled),&:has(.viraui__textfield-module__CustomBasicInput_oHgtd[data-disabled]){--vui-textfield-control-group-background:var(--global-disabled-background);--vui-textfield-control-group-border-color:#0000;box-shadow:none;cursor:not-allowed}&:has(.viraui__textfield-module__Addon_kK1ef[data-position=start])>.viraui__textfield-module__CustomBasicInput_oHgtd{padding-inline-start:var(--space-x-small)}&:has(.viraui__textfield-module__Addon_kK1ef[data-position=end])>.viraui__textfield-module__CustomBasicInput_oHgtd{padding-inline-end:var(--space-x-small)}}.viraui__textfield-module__Addon_kK1ef{min-inline-size:var(--space-x-large)}.viraui__textfield-module__Description_8Qxot{padding-inline:calc(var(--vui-textfield-control-group-border-radius) / 2)}}@layer viraui.overrides{.viraui__textfield-module__CustomBasicInput_oHgtd{flex:1 1 auto;min-inline-size:0;block-size:100%;line-height:1.2;border:none;background:#0000;box-shadow:none;border-radius:inherit;&:focus-visible{outline:none}&:disabled{cursor:not-allowed}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-textfield-input-height{syntax:"<length>";inherits:true;initial-value:0}@property --vui-textfield-control-group-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-textfield-control-group-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-textfield-control-group-border-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-textfield-control-group-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}.viraui__textfield-module__Textfield_o-70A{--vui-textfield-input-height:var(--space-x-large);--vui-textfield-control-group-background:var(--base-1);--vui-textfield-control-group-color:var(--global-foreground);--vui-textfield-control-group-border-color:var(--global-contrast);--vui-textfield-control-group-border-radius:var(--radius-medium);--vui-field-label-padding-inline:calc(var(--vui-textfield-control-group-border-radius) / 2);inline-size:100%;&:has([required]) .viraui__textfield-module__Label_5rjr0:after{content:" ＊";color:var(--highlight-red)}}.viraui__textfield-module__ControlGroup_2W-OC{box-sizing:border-box;inline-size:100%;min-inline-size:0;block-size:var(--vui-textfield-input-height);background:var(--vui-textfield-control-group-background);color:var(--vui-textfield-control-group-color);border:1px solid var(--vui-textfield-control-group-border-color);border-radius:var(--vui-textfield-control-group-border-radius);&:has(.viraui__textfield-module__CustomBasicInput_oHgtd:focus-visible),&:has(.viraui__textfield-module__CustomBasicInput_oHgtd[data-focused]){outline:var(--outline);outline-offset:var(--outline-offset)}&:has(.viraui__textfield-module__CustomBasicInput_oHgtd[data-invalid]){--vui-textfield-control-group-border-color:var(--highlight-red);box-shadow:none;outline-color:oklab(from var(--highlight-red) l a b/.5)}&:has(.viraui__textfield-module__CustomBasicInput_oHgtd:disabled),&:has(.viraui__textfield-module__CustomBasicInput_oHgtd[data-disabled]){--vui-textfield-control-group-background:var(--global-disabled-background);--vui-textfield-control-group-border-color:#0000;--vui-textfield-control-group-color:var(--global-disabled-foreground);box-shadow:none;cursor:not-allowed}&:has(.viraui__textfield-module__Addon_kK1ef[data-position=start])>.viraui__textfield-module__CustomBasicInput_oHgtd{padding-inline-start:var(--space-x-small)}&:has(.viraui__textfield-module__Addon_kK1ef[data-position=end])>.viraui__textfield-module__CustomBasicInput_oHgtd{padding-inline-end:var(--space-x-small)}}.viraui__textfield-module__Addon_kK1ef{min-inline-size:var(--space-x-large)}.viraui__textfield-module__Description_8Qxot{padding-inline:calc(var(--vui-textfield-control-group-border-radius) / 2)}}@layer viraui.overrides{.viraui__textfield-module__CustomBasicInput_oHgtd{flex:1 1 auto;block-size:100%;line-height:1.2;background:#0000;box-shadow:none;border-radius:inherit;&:focus-visible{outline:none}}}

package/dist/components/textfield/textfield.guide.json

@@ -26,25 +26,40 @@
   "related": ["Fieldset", "Textarea", "Select", "Text"],
   "properties": {
     "react": {
+      "description": {
+        "description": "Helper copy rendered with `Field.Description` and `Text` while the field is valid."
+      },
+      "endAddon": {
+        "description": "Trailing decoration (icon, button). Buttons must use `type=\"button\"`."
+      },
+      "error": {
+        "description": "Error copy rendered with `Field.Error` and `Text` in the same slot as `description`. Replaces description while the field is invalid. Validation messages from `validate` are shown by `Field.Error` even when this prop is omitted."
+      },
       "fitContent": {
-        "description": "When true, sets field-sizing: content so the control grows inline with its value; block chrome stays the fixed textfield input height. Omitted or false keeps the browser fixed default."
+        "description": "When `true`, sets `field-sizing: content` so the control grows inline with its value. Block chrome stays `var(--vui-textfield-input-height)`. Omitted / `false` keeps the browser fixed default."
+      },
+      "label": {
+        "description": "Visible label rendered with shared internal `FieldLabel`."
+      },
+      "startAddon": {
+        "description": "Leading decoration (prefix text, icon). Not a second field control."
       }
     },
     "css": {
-      "input-height": {
-        "description": "Textfield control group block size."
-      },
       "control-group-background": {
         "description": "Textfield control group background."
       },
-      "control-group-color": {
-        "description": "Textfield control group foreground color."
-      },
       "control-group-border-color": {
         "description": "Textfield control group border color."
       },
       "control-group-border-radius": {
         "description": "Textfield control group corner radius."
+      },
+      "control-group-color": {
+        "description": "Textfield control group foreground color."
+      },
+      "input-height": {
+        "description": "Textfield control group block size."
       }
     }
   }

package/dist/components/title/title.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-title-align{syntax:"*";inherits:false;initial-value:start}@property --vui-title-max-width{syntax:"*";inherits:false;initial-value:none}@property --vui-title-literal-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-title-white-space{syntax:"*";inherits:false;initial-value:normal}@property --vui-title-font-weight{syntax:"<number>";inherits:false;initial-value:500}@property --vui-title-font-width{syntax:"<number>";inherits:false;initial-value:100}@property --vui-title-font-opsz{syntax:"<number>";inherits:false;initial-value:16}@property --vui-title-trim{syntax:"*";inherits:false;initial-value:none}@property --vui-title-trim-type{syntax:"*";inherits:false;initial-value:none}@property --vui-title-padding-inline-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-padding-inline-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-padding-block-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-padding-block-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-font-size{syntax:"<length>";inherits:false;initial-value:1rem}@property --vui-title-line-height{syntax:"normal | <number> | <length-percentage>";inherits:false;initial-value:normal}@property --vui-title-letter-spacing{syntax:"normal | <length>";inherits:false;initial-value:-.03em}@property --vui-title-font-family{syntax:"*";inherits:false;initial-value:sans-serif}.viraui__title-module__Title_CXMUX{--title-medium:clamp(var(--font-scale-body-medium),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 12 + 0.24cqi),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 3));--vui-title-font-size:clamp(var(--font-scale-h2),calc(var(--title-medium) * pow(var(--font-heading-typescale), 5)),var(--font-scale-h1));--vui-title-font-family:var(--font-family-heading);--vui-title-line-height:var(--font-leading-standard);margin:0;max-inline-size:var(--vui-title-max-width);font-family:var(--vui-title-font-family);font-size:var(--vui-title-font-size);line-height:var(--vui-title-line-height);letter-spacing:var(--vui-title-letter-spacing);text-align:var(--vui-title-align);white-space:var(--vui-title-white-space);word-break:break-word;font-weight:var(--vui-title-font-weight);font-stretch:calc(var(--vui-title-font-width) * 1%);font-optical-sizing:auto;font-variation-settings:"wght" var(--vui-title-font-weight),"wdth" var(--vui-title-font-width),"opsz" var(--vui-title-font-opsz);text-box:var(--vui-title-trim) var(--vui-title-trim-type);display:inline-flex;&[data-title-balanced=true]{text-wrap:balance}&[data-title-selection=false]{-webkit-user-select:none;user-select:none}&[data-title-has-padding=true]{padding:var(--vui-title-padding-block-start) var(--vui-title-padding-inline-end) var(--vui-title-padding-block-end) var(--vui-title-padding-inline-start)}&[data-title-size=display]{--vui-title-font-size:clamp(var(--font-scale-h1),calc(var(--font-scale-h1) + 4.643cqi - 0.9286rem),var(--font-scale-display))}&[data-title-size="1"]{--vui-title-font-size:clamp(var(--font-scale-h2),calc(var(--title-medium) * pow(var(--font-heading-typescale), 5)),var(--font-scale-h1))}&[data-title-size="2"]{--vui-title-font-size:clamp(var(--font-scale-h3),calc(var(--title-medium) * pow(var(--font-heading-typescale), 4)),var(--font-scale-h2))}&[data-title-size="3"]{--vui-title-font-size:clamp(var(--font-scale-h4),calc(var(--title-medium) * pow(var(--font-heading-typescale), 3)),var(--font-scale-h3))}&[data-title-size="4"]{--vui-title-font-size:clamp(var(--font-scale-h5),calc(var(--title-medium) * pow(var(--font-heading-typescale), 2)),var(--font-scale-h4))}&[data-title-size="5"]{--vui-title-font-size:clamp(var(--font-scale-h6),calc(var(--title-medium) * pow(var(--font-heading-typescale), 1)),var(--font-scale-h5));--vui-title-letter-spacing:-0.02em}&[data-title-size="6"]{--vui-title-font-size:clamp(var(--font-scale-body-medium),var(--title-medium),var(--font-scale-h6));--vui-title-letter-spacing:-0.02em}&[data-title-has-literal-color=true]{color:var(--vui-title-literal-color)}&[data-title-line-height=none]{--vui-title-line-height:0}&[data-title-line-height=x-small]{--vui-title-line-height:var(--font-leading-x-small)}&[data-title-line-height=small]{--vui-title-line-height:var(--font-leading-small)}&[data-title-line-height=large]{--vui-title-line-height:var(--font-leading-large)}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-title-align{syntax:"*";inherits:false;initial-value:start}@property --vui-title-max-width{syntax:"*";inherits:false;initial-value:none}@property --vui-title-literal-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-title-white-space{syntax:"*";inherits:false;initial-value:normal}@property --vui-title-font-weight{syntax:"<number>";inherits:false;initial-value:500}@property --vui-title-font-width{syntax:"<number>";inherits:false;initial-value:100}@property --vui-title-font-opsz{syntax:"<number>";inherits:false;initial-value:16}@property --vui-title-trim{syntax:"*";inherits:false;initial-value:trim-both}@property --vui-title-trim-type{syntax:"*";inherits:false;initial-value:cap alphabetic}@property --vui-title-padding-inline-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-padding-inline-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-padding-block-start{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-padding-block-end{syntax:"<length>";inherits:false;initial-value:0}@property --vui-title-font-size{syntax:"<length>";inherits:false;initial-value:1rem}@property --vui-title-line-height{syntax:"normal | <number> | <length-percentage>";inherits:false;initial-value:normal}@property --vui-title-letter-spacing{syntax:"normal | <length>";inherits:false;initial-value:-.03em}@property --vui-title-font-family{syntax:"*";inherits:false;initial-value:sans-serif}@property --__title-medium{syntax:"*";inherits:false;initial-value:0}.viraui__title-module__Title_CXMUX{--__title-medium:clamp(var(--font-scale-body-medium),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 12 + 0.24cqi),calc(var(--font-scale-body-medium) + var(--font-scale-body-x-small) / 3));--vui-title-font-size:clamp(var(--font-scale-h2),calc(var(--__title-medium) * pow(var(--font-heading-typescale), 5)),var(--font-scale-h1));--vui-title-font-family:var(--font-family-heading);--vui-title-line-height:var(--font-leading-standard);margin:0;max-inline-size:var(--vui-title-max-width);font-family:var(--vui-title-font-family);font-size:var(--vui-title-font-size);line-height:var(--vui-title-line-height);letter-spacing:var(--vui-title-letter-spacing);text-align:var(--vui-title-align);white-space:var(--vui-title-white-space);word-break:break-word;font-weight:var(--vui-title-font-weight);font-stretch:calc(var(--vui-title-font-width) * 1%);font-optical-sizing:auto;font-variation-settings:"wght" var(--vui-title-font-weight),"wdth" var(--vui-title-font-width),"opsz" var(--vui-title-font-opsz);text-box:var(--vui-title-trim) var(--vui-title-trim-type);display:inline-flex;&[data-title-balanced=true]{text-wrap:balance}&[data-title-selection=false]{-webkit-user-select:none;user-select:none}&[data-title-has-padding=true]{padding:var(--vui-title-padding-block-start) var(--vui-title-padding-inline-end) var(--vui-title-padding-block-end) var(--vui-title-padding-inline-start)}&[data-title-size=display]{--vui-title-font-size:clamp(var(--font-scale-h1),calc(var(--font-scale-h1) + 4.643cqi - 0.9286rem),var(--font-scale-display))}&[data-title-size="2"]{--vui-title-font-size:clamp(var(--font-scale-h3),calc(var(--__title-medium) * pow(var(--font-heading-typescale), 4)),var(--font-scale-h2))}&[data-title-size="3"]{--vui-title-font-size:clamp(var(--font-scale-h4),calc(var(--__title-medium) * pow(var(--font-heading-typescale), 3)),var(--font-scale-h3))}&[data-title-size="4"]{--vui-title-font-size:clamp(var(--font-scale-h5),calc(var(--__title-medium) * pow(var(--font-heading-typescale), 2)),var(--font-scale-h4))}&[data-title-size="5"]{--vui-title-font-size:clamp(var(--font-scale-h6),calc(var(--__title-medium) * pow(var(--font-heading-typescale), 1)),var(--font-scale-h5));--vui-title-letter-spacing:-0.02em}&[data-title-size="6"]{--vui-title-font-size:clamp(var(--font-scale-body-medium),var(--__title-medium),var(--font-scale-h6));--vui-title-letter-spacing:-0.02em}&[data-title-has-literal-color=true]{color:var(--vui-title-literal-color)}&[data-title-line-height=none]{--vui-title-line-height:0}&[data-title-line-height=x-small]{--vui-title-line-height:var(--font-leading-x-small)}&[data-title-line-height=small]{--vui-title-line-height:var(--font-leading-small)}&[data-title-line-height=large]{--vui-title-line-height:var(--font-leading-large)}}}

package/dist/components/title/title.guide.json

@@ -27,51 +27,54 @@
         "description": "Aligns text using logical alignment values.",
         "refCss": "align"
       },
-      "maxWidth": {
-        "description": "Constrains the maximum inline size of the rendered title block.",
-        "refCss": "max-width"
+      "balanced": {
+        "description": "Enables balanced wrapping for block-like titles."
       },
       "color": {
-        "description": "Applies a literal color escape hatch when semantic tone is not used.",
-        "refCss": "literal-color"
+        "description": "Applies a literal color escape hatch."
       },
-      "whiteSpace": {
-        "description": "Controls white-space preservation and wrapping behavior.",
-        "refCss": "white-space"
+      "fontWidth": {
+        "description": "Overrides font width as a percentage (100 = normal); maps to `font-stretch` and `wdth`."
       },
-      "weight": {
-        "description": "Numeric font weight; maps to font-weight and the wght variation axis.",
-        "refCss": "font-weight"
+      "hPadding": {
+        "description": "Sets inline padding using one token for both sides or a `[start, end]` tuple."
       },
-      "fontWidth": {
-        "description": "Font width as a percentage (100 = normal); maps to font-stretch and the wdth variation axis.",
-        "refCss": "font-width"
+      "lineHeight": {
+        "description": "Controls line height through foundation leading tokens."
+      },
+      "maxWidth": {
+        "description": "Constrains the maximum inline size of the rendered text block."
       },
       "opticalSize": {
-        "description": "Optical size axis override (variable fonts); static fonts keep font-optical-sizing: auto.",
-        "refCss": "font-opsz"
+        "description": "Overrides the optical size (`opsz`) axis on variable fonts; static fonts keep `font-optical-sizing: auto`."
+      },
+      "ref": {
+        "description": "Ref forwarded to the rendered title root element."
+      },
+      "render": {
+        "description": "Replaces the default `span` root using Base UI render semantics. Pair this with `size` for most headings so DOM semantics and visual preset stay intentionally aligned."
+      },
+      "selection": {
+        "description": "Enables text selection on the rendered copy."
+      },
+      "size": {
+        "description": "Selects a heading or display typography preset from the active theme scale. This controls only the visual preset. Semantic heading choice remains owned by `render`, because `Title` keeps a `span` root unless `render` replaces it."
       },
       "trim": {
-        "description": "Trims text box whitespace at the chosen edge.",
+        "description": "Trims text box whitespace at the chosen edge when the browser supports `text-box`.",
         "refCss": "trim"
       },
       "trimType": {
-        "description": "Selects the text-box trim basis when trim is active.",
-        "refCss": "trim-type"
-      },
-      "hPadding": {
-        "description": "Sets inline padding using one token or a [start, end] tuple."
+        "description": "Selects the `text-box` trim basis when `trim` is active."
       },
       "vPadding": {
-        "description": "Sets block padding using one token or a [start, end] tuple."
+        "description": "Sets block padding using one token for both sides or a `[start, end]` tuple."
       },
-      "size": {
-        "description": "Selects the visual heading appearance preset; does not change semantic heading level.",
-        "refCss": "font-size"
+      "weight": {
+        "description": "Overrides the size preset weight (`font-weight` + `wght` axis)."
       },
-      "lineHeight": {
-        "description": "Controls line height through foundation leading tokens.",
-        "refCss": "line-height"
+      "whiteSpace": {
+        "description": "Controls white-space preservation and wrapping behavior."
       }
     },
     "css": {
@@ -79,67 +82,54 @@
         "description": "Title alignment on the root.",
         "refReact": "align"
       },
-      "max-width": {
-        "description": "Max inline size of the title root.",
-        "refReact": "maxWidth"
+      "font-family": {
+        "description": "Heading font family on the root."
       },
-      "literal-color": {
-        "description": "Literal color override on the root.",
-        "refReact": "color"
+      "font-opsz": {
+        "description": "Optical size axis on the root (variable fonts)."
       },
-      "white-space": {
-        "description": "White-space behavior on the root.",
-        "refReact": "whiteSpace"
+      "font-size": {
+        "description": "Heading font size; size prop presets via data attributes."
       },
       "font-weight": {
-        "description": "Font weight on the root.",
-        "refReact": "weight"
+        "description": "Font weight on the root."
       },
       "font-width": {
-        "description": "Font width percentage on the root (font-stretch + wdth).",
-        "refReact": "fontWidth"
+        "description": "Font width percentage on the root (font-stretch + wdth)."
       },
-      "font-opsz": {
-        "description": "Optical size axis on the root (variable fonts).",
-        "refReact": "opticalSize"
+      "letter-spacing": {
+        "description": "Heading letter spacing; size presets adjust this."
       },
-      "trim": {
-        "description": "Text-box trim mode on the root.",
-        "refReact": "trim"
+      "line-height": {
+        "description": "Line height; lineHeight prop presets via data attributes."
       },
-      "trim-type": {
-        "description": "Text-box trim basis on the root.",
-        "refReact": "trimType"
+      "literal-color": {
+        "description": "Literal color override on the root."
       },
-      "padding-inline-start": {
-        "description": "Inline-start padding when padding is enabled.",
-        "refReact": "hPadding"
+      "max-width": {
+        "description": "Max inline size of the title root."
       },
-      "padding-inline-end": {
-        "description": "Inline-end padding when padding is enabled.",
-        "refReact": "hPadding"
+      "padding-block-end": {
+        "description": "Block-end padding when padding is enabled."
       },
       "padding-block-start": {
-        "description": "Block-start padding when padding is enabled.",
-        "refReact": "vPadding"
+        "description": "Block-start padding when padding is enabled."
       },
-      "padding-block-end": {
-        "description": "Block-end padding when padding is enabled.",
-        "refReact": "vPadding"
+      "padding-inline-end": {
+        "description": "Inline-end padding when padding is enabled."
       },
-      "font-size": {
-        "description": "Heading font size; size prop presets via data attributes.",
-        "refReact": "size"
+      "padding-inline-start": {
+        "description": "Inline-start padding when padding is enabled."
       },
-      "line-height": {
-        "description": "Line height; lineHeight prop presets via data attributes.",
-        "refReact": "lineHeight"
+      "trim": {
+        "description": "Text-box trim mode on the root.",
+        "refReact": "trim"
       },
-      "letter-spacing": {
-        "description": "Heading letter spacing; size presets adjust this."
+      "trim-type": {
+        "description": "Text-box trim basis on the root."
       },
-      "font-family": {
-        "description": "Heading font family on the root."
+      "white-space": {
+        "description": "White-space behavior on the root."
       }
     }
   }

package/dist/components/title/title.js

@@ -27,7 +27,6 @@ var Title = ({ align = "start", balanced = false, selection = true, className, c
 		props: {
 			...otherProps,
 			"data-title-size": size,
-			"data-title-weight": weight !== void 0 ? "custom" : "preset",
 			"data-title-line-height": lineHeight,
 			"data-title-balanced": balanced ? "true" : "false",
 			"data-title-selection": selection ? "true" : "false",

package/dist/components/toast/toast.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{.viraui__toast-module__Viewport_oSF5e{position:fixed;z-index:4;pointer-events:none;outline:0;inline-size:min(24rem,calc(100vw - 2 * var(--space-medium)));&[data-position=bottom-right]{inset-block-end:var(--space-medium);inset-inline-end:var(--space-medium)}&[data-position=bottom-left]{inset-block-end:var(--space-medium);inset-inline-start:var(--space-medium)}&[data-position=bottom-center]{inset-block-end:var(--space-medium);inset-inline:0;margin-inline:auto}&[data-position=top-right]{inset-block-start:var(--space-medium);inset-inline-end:var(--space-medium)}&[data-position=top-left]{inset-block-start:var(--space-medium);inset-inline-start:var(--space-medium)}&[data-position=top-center]{inset-block-start:var(--space-medium);inset-inline:0;margin-inline:auto}&[data-position=anchored]{inset:0;inline-size:auto}&>*{pointer-events:auto}}.viraui__toast-module__Content_5ODZr{overflow:hidden;transition:opacity .25s ease;&[data-behind]{opacity:0}&[data-expanded]{opacity:1}@media (prefers-reduced-motion:reduce){transition:none}}}@layer viraui.overrides{.viraui__toast-module__Banner_QkOlo{--gap:var(--space-small);--peek:var(--space-small);--scale:calc(max(0, 1 - (var(--toast-index, 0) * 0.1)));--shrink:calc(1 - var(--scale));--stack-height:var(--toast-frontmost-height,var(--toast-height,0px));--offset-y:calc(var(--toast-offset-y, 0px) * -1 + (var(--toast-index, 0) * var(--gap) * -1) + var(--toast-swipe-movement-y, 0px));position:absolute;inset-inline-end:0;inset-block-end:0;z-index:calc(1000 - var(--toast-index, 0));inline-size:100%;min-inline-size:16rem;will-change:transform,opacity;block-size:var(--toast-frontmost-height,var(--toast-height,auto));transform-origin:bottom center;transform:scale(var(--scale)) translateX(var(--toast-swipe-movement-x,0)) translateY(calc(var(--toast-swipe-movement-y, 0px) - (var(--toast-index, 0) * var(--peek)) - (var(--shrink) * var(--stack-height))));transition:transform var(--duration-slow) var(--easing-elastic),opacity var(--duration-slow) var(--easing-elastic);-webkit-user-select:none;user-select:none;&[data-swiping]{transition:none}&[data-expanded]{transform:scale(1) translateX(var(--toast-swipe-movement-x,0)) translateY(var(--offset-y));block-size:var(--toast-height,auto)}&[data-starting-style]{transform:scale(1) translateY(150%)}&[data-ending-style]{opacity:0;transform:scale(1) translateY(150%);&[data-swipe-direction=up]{transform:scale(1) translateY(calc(var(--toast-swipe-movement-y, 0px) - 150%))}&[data-swipe-direction=down]{transform:scale(1) translateY(calc(var(--toast-swipe-movement-y, 0px) + 150%))}&[data-swipe-direction=left]{transform:scale(1) translateX(calc(var(--toast-swipe-movement-x, 0px) - 150%)) translateY(var(--offset-y))}&[data-swipe-direction=right]{transform:scale(1) translateX(calc(var(--toast-swipe-movement-x, 0px) + 150%)) translateY(var(--offset-y))}}&[data-limited]{opacity:0}&:after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:0;inline-size:100%;block-size:calc(var(--gap) + 1px)}@media (prefers-reduced-motion:reduce){transition:none}}:is(.viraui__toast-module__Viewport_oSF5e[data-position=bottom-left],.viraui__toast-module__Viewport_oSF5e[data-position=top-left]) .viraui__toast-module__Banner_QkOlo{inset-inline-end:auto;inset-inline-start:0}:is(.viraui__toast-module__Viewport_oSF5e[data-position=bottom-center],.viraui__toast-module__Viewport_oSF5e[data-position=top-center]) .viraui__toast-module__Banner_QkOlo{inset-inline:0;margin-inline:auto}.viraui__toast-module__Viewport_oSF5e[data-position^=top-] .viraui__toast-module__Banner_QkOlo{inset-block-end:auto;inset-block-start:0;transform-origin:top center;--offset-y:calc(var(--toast-offset-y, 0px) + (var(--toast-index, 0) * var(--gap)) + var(--toast-swipe-movement-y, 0px));transform:scale(var(--scale)) translateX(var(--toast-swipe-movement-x,0)) translateY(calc(var(--toast-swipe-movement-y, 0px) + (var(--toast-index, 0) * var(--peek)) + (var(--shrink) * var(--stack-height))));&:after{inset-block-start:auto;inset-block-end:100%}&[data-expanded]{transform:scale(1) translateX(var(--toast-swipe-movement-x,0)) translateY(var(--offset-y))}&[data-ending-style]:not([data-swipe-direction]),&[data-starting-style]{transform:scale(1) translateY(-150%)}}.viraui__toast-module__Viewport_oSF5e[data-position=anchored] .viraui__toast-module__Banner_QkOlo{position:static;z-index:auto;min-inline-size:auto;block-size:auto;transform:none;&:after{content:none}transition:transform var(--duration-slow) var(--easing-elastic),opacity var(--duration-slow) var(--easing-elastic);&[data-ending-style],&[data-starting-style]{opacity:0;transform:scale(1) translateY(var(--space-2x-small))}&[data-expanded]{transform:none}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --__toast-gap{syntax:"<length>";inherits:false;initial-value:0}@property --__toast-peek{syntax:"<length>";inherits:false;initial-value:0}@property --__toast-scale{syntax:"<number>";inherits:false;initial-value:1}@property --__toast-shrink{syntax:"<number>";inherits:false;initial-value:0}@property --__toast-stack-height{syntax:"<length>";inherits:false;initial-value:0}@property --__toast-offset-y{syntax:"<length>";inherits:false;initial-value:0}.viraui__toast-module__Viewport_oSF5e{position:fixed;z-index:4;pointer-events:none;outline:0;inline-size:min(24rem,calc(100vw - 2 * var(--space-medium)));&[data-position=bottom-right]{inset-block-end:var(--space-medium);inset-inline-end:var(--space-medium)}&[data-position=bottom-left]{inset-block-end:var(--space-medium);inset-inline-start:var(--space-medium)}&[data-position=bottom-center]{inset-block-end:var(--space-medium);inset-inline:0;margin-inline:auto}&[data-position=top-right]{inset-block-start:var(--space-medium);inset-inline-end:var(--space-medium)}&[data-position=top-left]{inset-block-start:var(--space-medium);inset-inline-start:var(--space-medium)}&[data-position=top-center]{inset-block-start:var(--space-medium);inset-inline:0;margin-inline:auto}&[data-position=anchored]{inset:0;inline-size:auto}&>*{pointer-events:auto}}.viraui__toast-module__Content_5ODZr{overflow:hidden;transition:opacity .25s ease;&[data-behind]{opacity:0}&[data-expanded]{opacity:1}@media (prefers-reduced-motion:reduce){transition:none}}}@layer viraui.overrides{.viraui__toast-module__Banner_QkOlo{--__toast-gap:var(--space-small);--__toast-peek:var(--space-small);--__toast-scale:calc(max(0, 1 - (var(--toast-index, 0) * 0.1)));--__toast-shrink:calc(1 - var(--__toast-scale));--__toast-stack-height:var(--toast-frontmost-height,var(--toast-height,0px));--__toast-offset-y:calc(var(--toast-offset-y, 0px) * -1 + (var(--toast-index, 0) * var(--__toast-gap) * -1) + var(--toast-swipe-movement-y, 0px));position:absolute;inset-inline-end:0;inset-block-end:0;z-index:calc(1000 - var(--toast-index, 0));inline-size:100%;min-inline-size:16rem;will-change:transform,opacity;block-size:var(--toast-frontmost-height,var(--toast-height,auto));transform-origin:bottom center;transform:scale(var(--__toast-scale)) translateX(var(--toast-swipe-movement-x,0)) translateY(calc(var(--toast-swipe-movement-y, 0px) - (var(--toast-index, 0) * var(--__toast-peek)) - (var(--__toast-shrink) * var(--__toast-stack-height))));transition:transform var(--duration-slow) var(--easing-elastic),opacity var(--duration-slow) var(--easing-elastic);-webkit-user-select:none;user-select:none;&[data-swiping]{transition:none}&[data-expanded]{transform:scale(1) translateX(var(--toast-swipe-movement-x,0)) translateY(var(--__toast-offset-y));block-size:var(--toast-height,auto)}&[data-starting-style]{transform:scale(1) translateY(150%)}&[data-ending-style]{opacity:0;transform:scale(1) translateY(150%);&[data-swipe-direction=up]{transform:scale(1) translateY(calc(var(--toast-swipe-movement-y, 0px) - 150%))}&[data-swipe-direction=down]{transform:scale(1) translateY(calc(var(--toast-swipe-movement-y, 0px) + 150%))}&[data-swipe-direction=left]{transform:scale(1) translateX(calc(var(--toast-swipe-movement-x, 0px) - 150%)) translateY(var(--__toast-offset-y))}&[data-swipe-direction=right]{transform:scale(1) translateX(calc(var(--toast-swipe-movement-x, 0px) + 150%)) translateY(var(--__toast-offset-y))}}&[data-limited]{opacity:0}&:after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:0;inline-size:100%;block-size:calc(var(--__toast-gap) + 1px)}@media (prefers-reduced-motion:reduce){transition:none}}:is(.viraui__toast-module__Viewport_oSF5e[data-position=bottom-left],.viraui__toast-module__Viewport_oSF5e[data-position=top-left]) .viraui__toast-module__Banner_QkOlo{inset-inline-end:auto;inset-inline-start:0}:is(.viraui__toast-module__Viewport_oSF5e[data-position=bottom-center],.viraui__toast-module__Viewport_oSF5e[data-position=top-center]) .viraui__toast-module__Banner_QkOlo{inset-inline:0;margin-inline:auto}.viraui__toast-module__Viewport_oSF5e[data-position^=top-] .viraui__toast-module__Banner_QkOlo{inset-block-end:auto;inset-block-start:0;transform-origin:top center;--__toast-offset-y:calc(var(--toast-offset-y, 0px) + (var(--toast-index, 0) * var(--__toast-gap)) + var(--toast-swipe-movement-y, 0px));transform:scale(var(--__toast-scale)) translateX(var(--toast-swipe-movement-x,0)) translateY(calc(var(--toast-swipe-movement-y, 0px) + (var(--toast-index, 0) * var(--__toast-peek)) + (var(--__toast-shrink) * var(--__toast-stack-height))));&:after{inset-block-start:auto;inset-block-end:100%}&[data-expanded]{transform:scale(1) translateX(var(--toast-swipe-movement-x,0)) translateY(var(--__toast-offset-y))}&[data-ending-style]:not([data-swipe-direction]),&[data-starting-style]{transform:scale(1) translateY(-150%)}}.viraui__toast-module__Viewport_oSF5e[data-position=anchored] .viraui__toast-module__Banner_QkOlo{position:static;z-index:auto;min-inline-size:auto;block-size:auto;transform:none;&:after{content:none}transition:transform var(--duration-slow) var(--easing-elastic),opacity var(--duration-slow) var(--easing-elastic);&[data-ending-style],&[data-starting-style]{opacity:0;transform:scale(1) translateY(var(--space-2x-small))}&[data-expanded]{transform:none}}}

package/dist/components/toast/toast.guide.json

@@ -23,5 +23,36 @@
     "Stacking many simultaneous toasts without a clear limit",
     "Using toasts for critical validation errors that block task completion"
   ],
-  "related": ["Button", "Surface", "Stack", "Dialog"]
+  "related": ["Button", "Surface", "Stack", "Dialog"],
+  "properties": {
+    "react": {
+      "Banner.children": {
+        "description": "Optional action buttons. Accepts a single `Toast.Action` or an array of them."
+      },
+      "Banner.className": {
+        "description": "Class name forwarded to the toast root."
+      },
+      "Banner.description": {
+        "description": "Supporting copy below the title."
+      },
+      "Banner.dismissable": {
+        "description": "Whether to render the dismiss control."
+      },
+      "Banner.dismissLabel": {
+        "description": "Label for the dismiss control."
+      },
+      "Banner.onDismiss": {
+        "description": "Called when the dismiss control is activated, before Base UI closes the toast."
+      },
+      "Banner.title": {
+        "description": "Heading above the description. Falls back to `toast.title` from `toastManager.add`."
+      },
+      "Banner.toast": {
+        "description": "Toast instance from `useToastManager().toasts` or `createToastManager()`."
+      },
+      "Viewport.position": {
+        "description": "Controls viewport placement and stacking layout hooks."
+      }
+    }
+  }
 }

package/dist/components/toggle-button/toggle-button.css

@@ -0,0 +1 @@
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{.viraui__toggle-button-module__IconSlot_8nRbU{position:relative;display:block;flex-shrink:0;inline-size:var(--vui-button-icon-size);block-size:var(--vui-button-icon-size);&[data-pressed]{.viraui__toggle-button-module__Icon_Y1ESH:first-of-type{opacity:0;rotate:30deg}.viraui__toggle-button-module__Icon_Y1ESH:last-of-type{opacity:1;rotate:0deg}}&[data-interpolate=true] .viraui__toggle-button-module__Icon_Y1ESH{transition:opacity var(--duration-fast) var(--easing-standard),rotate var(--duration-fast) var(--easing-standard);@media (prefers-reduced-motion:reduce){transition:none}}}.viraui__toggle-button-module__Icon_Y1ESH{position:absolute;inset:0;display:grid;place-items:center;&>svg{block-size:var(--vui-button-icon-size);inline-size:var(--vui-button-icon-size);flex-shrink:0}&:first-of-type{opacity:1;rotate:0deg}&:last-of-type{opacity:0;rotate:-30deg}}}

package/dist/components/toggle-button/toggle-button.d.ts

@@ -35,5 +35,12 @@ export type ToggleButtonProps = Omit<IconButtonProps, 'icon' | 'render' | 'varia
      * @default When omitted, `variant` is used in both states.
      */
     pressedVariant?: ButtonProps['variant'];
+    /**
+     * When `pressedIcon` is set, crossfade and rotate between resting and pressed icons
+     * (`data-interpolate="true"`). When `false`, swap instantly with no transition.
+     *
+     * @default false
+     */
+    interpolateIcons?: boolean;
 };
 export declare const ToggleButton: React.FC<ToggleButtonProps>;

package/dist/components/toggle-button/toggle-button.guide.json

@@ -1,7 +1,7 @@
 {
   "name": "ToggleButton",
   "structure": "<ToggleButton restingIcon={<Plus />} aria-label=\"Pin\" />",
-  "summary": "Icon-only two-state toggle that swaps resting and optional pressed icons on Base UI Toggle state.",
+  "summary": "Icon-only two-state toggle that swaps resting and optional pressed icons on Base UI Toggle state; `interpolateIcons` (default false) opt-in crossfade + light rotate between dual icons.",
   "whenToUse": [
     "Toolbar pin, favorite, or mute toggles identified only by icon",
     "Compact on/off controls that share IconButton size, variant, and loading model",
@@ -22,5 +22,32 @@
     "Passing icon or render — ToggleButton owns icon swap and Toggle render wiring"
   ],
   "related": ["IconButton", "Button", "Switch", "ToggleGroup"],
-  "properties": {}
+  "properties": {
+    "react": {
+      "interpolateIcons": {
+        "description": "When `pressedIcon` is set, crossfade and rotate between resting and pressed icons (`data-interpolate=\"true\"`). When `false`, swap instantly with no transition."
+      },
+      "loading": {
+        "description": "Shows a centered spinner overlay while preserving the original content width."
+      },
+      "pill": {
+        "description": "Applies a fully rounded pill shape to the button."
+      },
+      "pressedIcon": {
+        "description": "Icon shown while the toggle is pressed."
+      },
+      "pressedVariant": {
+        "description": "Visual variant while the toggle is pressed."
+      },
+      "restingIcon": {
+        "description": "Icon shown while the toggle is not pressed."
+      },
+      "size": {
+        "description": "Controls the visual button size."
+      },
+      "variant": {
+        "description": "Visual variant while the toggle is not pressed."
+      }
+    }
+  }
 }

package/dist/components/toggle-button/toggle-button.js

@@ -1,8 +1,10 @@
+import './toggle-button.css';
 import { IconButton } from "../icon-button/icon-button.js";
-import { jsx } from "react/jsx-runtime";
+import toggle_button_module_default from "./toggle-button.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Toggle } from "@base-ui/react/toggle";
 //#region src/components/toggle-button/toggle-button.tsx
-var ToggleButton = ({ restingIcon, pressedIcon, variant = "flat", pressedVariant, pressed, defaultPressed, onPressedChange, value, disabled, ref, ...otherProps }) => /* @__PURE__ */ jsx(Toggle, {
+var ToggleButton = ({ restingIcon, pressedIcon, variant = "flat", pressedVariant, interpolateIcons = false, pressed, defaultPressed, onPressedChange, value, disabled, ref, ...otherProps }) => /* @__PURE__ */ jsx(Toggle, {
 	ref,
 	value,
 	pressed,
@@ -12,12 +14,25 @@ var ToggleButton = ({ restingIcon, pressedIcon, variant = "flat", pressedVariant
 	nativeButton: true,
 	render: (toggleProps, state) => {
 		const { "aria-label": _toggleAriaLabel, "aria-labelledby": _toggleAriaLabelledBy, ...restToggleProps } = toggleProps;
+		const icon = pressedIcon != null ? /* @__PURE__ */ jsxs("span", {
+			"aria-hidden": true,
+			className: toggle_button_module_default.IconSlot,
+			"data-interpolate": interpolateIcons ? "true" : "false",
+			...state.pressed && { "data-pressed": "" },
+			children: [/* @__PURE__ */ jsx("span", {
+				className: toggle_button_module_default.Icon,
+				children: restingIcon
+			}), /* @__PURE__ */ jsx("span", {
+				className: toggle_button_module_default.Icon,
+				children: pressedIcon
+			})]
+		}) : restingIcon;
 		return /* @__PURE__ */ jsx(IconButton, {
 			...otherProps,
 			...restToggleProps,
 			disabled,
 			variant: state.pressed ? pressedVariant ?? variant : variant,
-			icon: state.pressed ? pressedIcon ?? restingIcon : restingIcon
+			icon
 		});
 	}
 });

package/dist/components/toggle-button/toggle-button.module.js

@@ -0,0 +1,9 @@
+//#region src/components/toggle-button/toggle-button.module.css
+var IconSlot = "viraui__toggle-button-module__IconSlot_8nRbU";
+var Icon = "viraui__toggle-button-module__Icon_Y1ESH";
+var toggle_button_module_default = {
+	IconSlot,
+	Icon
+};
+//#endregion
+export { Icon, IconSlot, toggle_button_module_default as default };

package/dist/components/toggle-group/toggle-group.d.ts

@@ -2,7 +2,8 @@ import { ToggleGroup as ToggleGroupPrimitive } from '@base-ui/react/toggle-group
 /**
  * Public ToggleGroup props.
  *
- * Thin wrapper around Base UI `ToggleGroup` with default toolbar spacing.
+ * Thin wrapper around Base UI `ToggleGroup` with default `Stack` direction
+ * (`row` / `column` from `orientation`) and zero gap — consumers own spacing.
  * Compose `ToggleButton` children each with `value` and an accessible name.
  *
  * @default Base UI pass-through props keep upstream defaults.

package/dist/components/toggle-group/toggle-group.guide.json

@@ -1,7 +1,7 @@
 {
   "name": "ToggleGroup",
   "structure": "<ToggleGroup>\n  <ToggleButton restingIcon={<Plus />} aria-label=\"List\" value=\"list\" />\n</ToggleGroup>",
-  "summary": "Toolbar toggle set with shared selection state and default Stack spacing on Base UI ToggleGroup.",
+  "summary": "Toolbar toggle set with shared selection state; Stack direction follows orientation with zero default gap.",
   "whenToUse": [
     "Segmented icon toolbars such as text alignment or formatting controls",
     "Single- or multi-select pressed states across related ToggleButton items",
@@ -22,6 +22,5 @@
     "Using Switch for icon-only toolbar toggle sets",
     "Embedding Surface chrome in the component — wrap demos or app chrome at the consumer"
   ],
-  "related": ["ToggleButton", "IconButton", "Tabs"],
-  "properties": {}
+  "related": ["ToggleButton", "IconButton", "Tabs"]
 }

package/dist/components/tooltip/tooltip.guide.json

@@ -22,5 +22,12 @@
     "Expecting `Tooltip.Arrow` (it is intentionally not exported or rendered)",
     "Using tooltip for modal or focus-trapped tasks"
   ],
-  "related": ["Surface", "Button", "IconButton", "Stack", "Popover", "Icon"]
+  "related": ["Surface", "Button", "IconButton", "Stack", "Popover", "Icon"],
+  "properties": {
+    "css": {
+      "content-fade-duration": {
+        "description": "content fade duration custom property on the component root."
+      }
+    }
+  }
 }

package/dist/components/typewriter/typewriter.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-typewriter-caret-color{syntax:"<color>";inherits:true;initial-value:currentcolor}.viraui__typewriter-module__Typewriter_R3sbb{display:inline;position:relative;isolation:isolate}.viraui__typewriter-module__Display_-IGJh{display:inline;white-space:pre-wrap}.viraui__typewriter-module__Display_-IGJh[data-preserve-space]{display:inline-grid}.viraui__typewriter-module__Display_-IGJh[data-preserve-space]>:is(.viraui__typewriter-module__Ghost_R-Yy-,.viraui__typewriter-module__Typed_00NZ8){grid-area:1/1}.viraui__typewriter-module__Caret_96Yfs{display:inline-block;vertical-align:initial;color:var(--vui-typewriter-caret-color);animation:viraui__typewriter-module__typewriter-caret-blink_yLCpV 1.1s step-start infinite;@media (prefers-reduced-motion:reduce){animation:none}&[data-type=block]{inline-size:.55em;block-size:.95em;margin-inline-start:.04em;background-color:var(--vui-typewriter-caret-color);transform:translateY(.08em)}&[data-type=pipe]:before{content:"|"}&[data-type=underscore]:before{content:"_"}}.viraui__typewriter-module__Ghost_R-Yy-{visibility:hidden;-webkit-user-select:none;user-select:none}.viraui__typewriter-module__Typed_00NZ8{display:inline}.viraui__typewriter-module__A11y_B-rjF{position:absolute;inset-block-start:0;inset-inline-start:0;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;pointer-events:none}@keyframes viraui__typewriter-module__typewriter-caret-blink_yLCpV{50%{opacity:0}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-typewriter-caret-color{syntax:"<color>";inherits:true;initial-value:currentcolor}.viraui__typewriter-module__Typewriter_R3sbb{position:relative;isolation:isolate}.viraui__typewriter-module__Display_-IGJh{white-space:pre-wrap;&[data-preserve-space]{display:inline-grid;&>.viraui__typewriter-module__Ghost_R-Yy-,&>.viraui__typewriter-module__Typed_00NZ8{grid-area:1/1}}}.viraui__typewriter-module__Caret_96Yfs{display:inline-block;vertical-align:initial;color:var(--vui-typewriter-caret-color);animation:viraui__typewriter-module__typewriter-caret-blink_yLCpV 1.1s step-start infinite;@media (prefers-reduced-motion:reduce){animation:none}&[data-type=block]{inline-size:.55em;block-size:.95em;margin-inline-start:.04em;background-color:var(--vui-typewriter-caret-color);transform:translateY(.08em)}&[data-type=pipe]:before{content:"|"}&[data-type=underscore]:before{content:"_"}}.viraui__typewriter-module__Ghost_R-Yy-{visibility:hidden;-webkit-user-select:none;user-select:none}.viraui__typewriter-module__Typed_00NZ8{display:inline}.viraui__typewriter-module__A11y_B-rjF{position:absolute;inset-block-start:0;inset-inline-start:0;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;pointer-events:none}@keyframes viraui__typewriter-module__typewriter-caret-blink_yLCpV{50%{opacity:0}}}