@viraui/react 2026.4.1 → 2026.6.0

package/dist/components/accordion/accordion-item.js

@@ -1,5 +1,5 @@
 import { clsx } from "../../core/clsx.js";
-import { infiniteCornerShapeStyle } from "../../core/theme/infinite-radius-style.js";
+import { fullCornerShapeStyle } from "../../core/theme/full-radius-style.js";
 import { resolveThemeValue } from "../../core/theme/resolve-theme-value.js";
 import { ChromeMinus, ChromePlus } from "../../internal/chrome-icons/chrome-icons.js";
 import accordion_module_default from "./accordion.module.js";
@@ -13,8 +13,8 @@ var AccordionItemComponent = ({ border, children, className, color, iconClosed =
 	const iconAtStart = iconPosition === "start";
 	const dynamicStyle = {
 		...radius != null && {
-			"--vui-accordion-radius": resolveThemeValue(radius, "radius", "var(--radius-medium)"),
-			...infiniteCornerShapeStyle(radius)
+			"--vui-accordion-radius": resolveThemeValue(radius, "radius", "var(--radius-m)"),
+			...fullCornerShapeStyle(radius)
 		},
 		...style
 	};
@@ -43,13 +43,13 @@ var AccordionItemComponent = ({ border, children, className, color, iconClosed =
 			children: /* @__PURE__ */ jsxs(Accordion.Trigger, {
 				className: accordion_module_default.Trigger,
 				render: /* @__PURE__ */ jsx(Stack, {
-					columnGap: iconAtStart ? "small" : void 0,
+					columnGap: iconAtStart ? "s" : void 0,
 					direction: iconAtStart ? "row" : "row-reverse",
 					hAlign: iconPosition === "end" ? "space-between" : "start",
-					hPadding: "medium",
+					hPadding: "m",
 					render: /* @__PURE__ */ jsx("button", { type: "button" }),
 					vAlign: "center",
-					vPadding: "medium"
+					vPadding: "m"
 				}),
 				children: [triggerIcon, /* @__PURE__ */ jsx(Text, {
 					weight: "semibold",
@@ -59,8 +59,8 @@ var AccordionItemComponent = ({ border, children, className, color, iconClosed =
 		}), /* @__PURE__ */ jsx(Accordion.Panel, {
 			className: accordion_module_default.Panel,
 			children: /* @__PURE__ */ jsx(Stack, {
-				hPadding: "medium",
-				vPadding: ["2x-small", "medium"],
+				hPadding: "m",
+				vPadding: ["2xs", "m"],
 				children
 			})
 		})]

package/dist/components/accordion/accordion.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-accordion-island-gap{syntax:"<length>";inherits:true;initial-value:0}@property --vui-accordion-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}.viraui__accordion-module__Accordion_wFOlN{--vui-accordion-island-gap:var(--space-medium);--vui-accordion-radius:var(--radius-medium);inline-size:100%;&:dir(rtl) .viraui__accordion-module__Trigger_4HzIb[data-stack-direction=row-reverse]{direction:ltr;flex-direction:row}}.viraui__accordion-module__Trigger_4HzIb{inline-size:100%;border:0;background:#0000;cursor:pointer;text-align:start;color:inherit;&:focus-visible{outline-offset:-4px}&[data-disabled]{cursor:not-allowed;opacity:.5}.viraui__accordion-module__Item_66o2x[data-use-surface=true] &{&:focus-visible{border-radius:var(--radius-large);outline-offset:-4px}}}.viraui__accordion-module__IconSlot_AVQq3{position:relative;flex-shrink:0;inline-size:1rem;block-size:1rem}.viraui__accordion-module__Icon_qdu2v{position:absolute;inset:0;display:grid;place-items:center;transition:opacity var(--duration-fast) var(--easing-standard),rotate var(--duration-fast) var(--easing-standard);&:first-of-type{opacity:1;rotate:0deg}&:last-of-type{opacity:0;rotate:-90deg}.viraui__accordion-module__Trigger_4HzIb[data-panel-open] &:first-of-type{opacity:0;rotate:90deg}.viraui__accordion-module__Trigger_4HzIb[data-panel-open] &:last-of-type{opacity:1;rotate:0deg}}.viraui__accordion-module__Panel_U1Ofk{block-size:var(--accordion-panel-height);overflow:hidden;transition:block-size var(--duration-fast) var(--easing-standard);&[data-ending-style],&[data-starting-style]{block-size:0}}}@layer viraui.overrides{.viraui__accordion-module__Item_66o2x{inline-size:100%;transition:margin var(--duration-fast) var(--easing-standard),border-radius var(--duration-fast) var(--easing-standard);&[data-use-surface=true]{--vui-surface-border-radius-top-left:0;--vui-surface-border-radius-top-right:0;--vui-surface-border-radius-bottom-right:0;--vui-surface-border-radius-bottom-left:0;&:not([data-open]){--vui-surface-background:#0000}&:not([data-open])+&:not([data-open]),&[data-open]+&[data-open]{border-top-width:0}&:first-child,&:not([data-open])+&[data-open],&[data-open]+&:not([data-open]){--vui-surface-border-radius-top-left:var(--vui-accordion-radius);--vui-surface-border-radius-top-right:var(--vui-accordion-radius)}&:last-child,&:not([data-open]):has(+&[data-open]),&[data-open]:has(+&:not([data-open])){--vui-surface-border-radius-bottom-left:var(--vui-accordion-radius);--vui-surface-border-radius-bottom-right:var(--vui-accordion-radius)}&:not(:last-child):not([data-open]):has(+&[data-open]),&:not(:last-child)[data-open]:has(+&:not([data-open])){margin-block-end:var(--vui-accordion-island-gap)}}.viraui__accordion-module__Accordion_wFOlN[data-islands=false] &[data-use-surface=true]{&:not(:first-child){border-top-width:0}&:not([data-open])+&[data-open],&[data-open]+&:not([data-open]){--vui-surface-border-radius-top-left:0;--vui-surface-border-radius-top-right:0}&:not([data-open]):has(+&[data-open]),&[data-open]:has(+&:not([data-open])){--vui-surface-border-radius-bottom-left:0;--vui-surface-border-radius-bottom-right:0}&:not(:last-child):not([data-open]):has(+&[data-open]),&:not(:last-child)[data-open]:has(+&:not([data-open])){margin-block-end:0}}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-accordion-island-gap{syntax:"<length>";inherits:true;initial-value:0}@property --vui-accordion-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}.viraui__accordion-module__Accordion_wFOlN{--vui-accordion-island-gap:var(--space-m);--vui-accordion-radius:var(--radius-m);inline-size:100%;&:dir(rtl) .viraui__accordion-module__Trigger_4HzIb[data-stack-direction=row-reverse]{direction:ltr;flex-direction:row}}.viraui__accordion-module__Trigger_4HzIb{inline-size:100%;border:0;background:#0000;cursor:pointer;text-align:start;color:inherit;&:focus-visible{outline-offset:-4px}&[data-disabled]{cursor:not-allowed;opacity:.5}.viraui__accordion-module__Item_66o2x[data-use-surface=true] &{&:focus-visible{border-radius:var(--radius-l);outline-offset:-4px}}}.viraui__accordion-module__IconSlot_AVQq3{position:relative;flex-shrink:0;inline-size:1rem;block-size:1rem}.viraui__accordion-module__Icon_qdu2v{position:absolute;inset:0;display:grid;place-items:center;transition:opacity var(--duration-fast) var(--easing-standard),rotate var(--duration-fast) var(--easing-standard);&:first-of-type{opacity:1;rotate:0deg}&:last-of-type{opacity:0;rotate:-90deg}.viraui__accordion-module__Trigger_4HzIb[data-panel-open] &:first-of-type{opacity:0;rotate:90deg}.viraui__accordion-module__Trigger_4HzIb[data-panel-open] &:last-of-type{opacity:1;rotate:0deg}}.viraui__accordion-module__Panel_U1Ofk{block-size:var(--accordion-panel-height);overflow:hidden;transition:block-size var(--duration-fast) var(--easing-standard);&[data-ending-style],&[data-starting-style]{block-size:0}}}@layer viraui.overrides{.viraui__accordion-module__Item_66o2x{inline-size:100%;transition:margin var(--duration-fast) var(--easing-standard),border-radius var(--duration-fast) var(--easing-standard);&[data-use-surface=true]{--vui-surface-border-radius-top-left:0;--vui-surface-border-radius-top-right:0;--vui-surface-border-radius-bottom-right:0;--vui-surface-border-radius-bottom-left:0;&:not([data-open]){--vui-surface-background:#0000}&:not([data-open])+&:not([data-open]),&[data-open]+&[data-open]{border-top-width:0}&:first-child,&:not([data-open])+&[data-open],&[data-open]+&:not([data-open]){--vui-surface-border-radius-top-left:var(--vui-accordion-radius);--vui-surface-border-radius-top-right:var(--vui-accordion-radius)}&:last-child,&:not([data-open]):has(+&[data-open]),&[data-open]:has(+&:not([data-open])){--vui-surface-border-radius-bottom-left:var(--vui-accordion-radius);--vui-surface-border-radius-bottom-right:var(--vui-accordion-radius)}&:not(:last-child):not([data-open]):has(+&[data-open]),&:not(:last-child)[data-open]:has(+&:not([data-open])){margin-block-end:var(--vui-accordion-island-gap)}}.viraui__accordion-module__Accordion_wFOlN[data-islands=false] &[data-use-surface=true]{&:not(:first-child){border-top-width:0}&:not([data-open])+&[data-open],&[data-open]+&:not([data-open]){--vui-surface-border-radius-top-left:0;--vui-surface-border-radius-top-right:0}&:not([data-open]):has(+&[data-open]),&[data-open]:has(+&:not([data-open])){--vui-surface-border-radius-bottom-left:0;--vui-surface-border-radius-bottom-right:0}&:not(:last-child):not([data-open]):has(+&[data-open]),&:not(:last-child)[data-open]:has(+&:not([data-open])){margin-block-end:0}}}}

package/dist/components/annotate/annotate.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-annotate-color{syntax:"<color>";inherits:true;initial-value:#d16500}@property --vui-annotate-arrow-x{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-arrow-y{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-text-x{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-text-y{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-rotate{syntax:"<angle>";inherits:true;initial-value:-4deg}@property --vui-annotate-target-gap{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-label-gap{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-label-max-width{syntax:"<length>";inherits:true;initial-value:150px}@property --vui-annotate-z-index{syntax:"*";inherits:true;initial-value:auto}@property --vui-annotate-text-align{syntax:"*";inherits:true;initial-value:start}@property --__annotate-tail-x{syntax:"<length>";inherits:true;initial-value:23px}@property --__annotate-tail-y{syntax:"<length>";inherits:true;initial-value:4px}@property --__annotate-note-align-x{syntax:"<length-percentage>";inherits:true;initial-value:-50%}@property --__annotate-note-align-y{syntax:"<length-percentage>";inherits:true;initial-value:0%}@property --__annotate-arrow-mask{syntax:"*";inherits:true;initial-value:none}.viraui__annotate-module__Annotate_7C36U{--vui-annotate-color:var(--global-foreground);--vui-annotate-target-gap:var(--space-small);--vui-annotate-label-gap:var(--space-x-small);--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap));anchor-name:--vui-annotate-target;anchor-scope:--vui-annotate-target,--vui-annotate-arrow;display:inline-block;overflow:visible;border-radius:var(--radius-x-small)}.viraui__annotate-module__Arrow_T4B-6{position:absolute;z-index:var(--vui-annotate-z-index);position-anchor:--vui-annotate-target;anchor-name:--vui-annotate-arrow;width:46px;height:38px;margin-left:var(--vui-annotate-arrow-x);margin-top:var(--vui-annotate-arrow-y);transform-origin:50% 50%;mask:var(--__annotate-arrow-mask) center /contain no-repeat;background:var(--vui-annotate-color);pointer-events:none}.viraui__annotate-module__Note_8UW-R{position:absolute;z-index:var(--vui-annotate-z-index);position-anchor:--vui-annotate-arrow;left:calc(anchor(left) + var(--__annotate-tail-x));top:calc(anchor(top) + var(--__annotate-tail-y));width:max-content;max-width:var(--vui-annotate-label-max-width);transform:translate(var(--__annotate-note-align-x),var(--__annotate-note-align-y)) rotate(var(--vui-annotate-rotate));font-family:Segoe Print,Chalkboard SE,Marker Felt,Dancing Script,sans-serif,system-ui;font-size:.95rem;line-height:1.05;color:var(--vui-annotate-color);text-align:var(--vui-annotate-text-align);white-space:normal;pointer-events:none}.viraui__annotate-module__NoteNudge_uQbzg{display:block}.viraui__annotate-module__Annotate_7C36U[data-mark=true]{background:oklab(from var(--vui-annotate-color) l a b/30%);box-shadow:-.3em 0 0 0 oklab(from var(--vui-annotate-color) l a b/30%),.3em 0 0 0 oklab(from var(--vui-annotate-color) l a b/30%)}.viraui__annotate-module__Annotate_7C36U[data-side=top]{--__annotate-tail-x:23px;--__annotate-tail-y:4px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap))}.viraui__annotate-module__Annotate_7C36U[data-side=top] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M23%204c-1%209-1%2020%200%2031%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m17%2029%206%207%206-7%22%2F%3E%3C%2Fsvg%3E");position-area:block-start;margin-bottom:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=top-start]{--__annotate-tail-x:6px;--__annotate-tail-y:6px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap))}.viraui__annotate-module__Annotate_7C36U[data-side=top-start] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M6%206c10%202%2022%2014%2034%2026%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m36%2022%204%2010-10-4%22%2F%3E%3C%2Fsvg%3E");position-area:block-start inline-start;margin-bottom:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=top-end]{--__annotate-tail-x:40px;--__annotate-tail-y:6px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap))}.viraui__annotate-module__Annotate_7C36U[data-side=top-end] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M40%206C30%208%2018%2020%206%2032%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M10%2022%206%2032l10-4%22%2F%3E%3C%2Fsvg%3E");position-area:block-start inline-end;margin-bottom:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom]{--__annotate-tail-x:23px;--__annotate-tail-y:35px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:var(--vui-annotate-label-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M23%2035c-1-9-1-20%200-31%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m17%2010%206-7%206%207%22%2F%3E%3C%2Fsvg%3E");position-area:block-end;margin-top:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-start]{--__annotate-tail-x:6px;--__annotate-tail-y:32px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:var(--vui-annotate-label-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-start] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M6%2032c10-2%2022-14%2034-26%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m30%2010%2010-4-4%2010%22%2F%3E%3C%2Fsvg%3E");position-area:block-end inline-start;margin-top:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-end]{--__annotate-tail-x:40px;--__annotate-tail-y:32px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:var(--vui-annotate-label-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-end] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M40%2032C30%2030%2018%2018%206%206%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M16%2010%206%206l4%2010%22%2F%3E%3C%2Fsvg%3E");position-area:block-end inline-end;margin-top:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=start]{--__annotate-tail-x:4px;--__annotate-tail-y:19px;--__annotate-note-align-x:calc(-100% - var(--vui-annotate-label-gap));--__annotate-note-align-y:-50%}.viraui__annotate-module__Annotate_7C36U[data-side=start] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M4%2019c11-1%2027-1%2039%200%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m36%2013%207%206-7%206%22%2F%3E%3C%2Fsvg%3E");position-area:inline-start;margin-inline-end:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=end]{--__annotate-tail-x:43px;--__annotate-tail-y:19px;--__annotate-note-align-x:var(--vui-annotate-label-gap);--__annotate-note-align-y:-50%}.viraui__annotate-module__Annotate_7C36U[data-side=end] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M43%2019c-11-1-28-1-40%200%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m10%2013-7%206%207%206%22%2F%3E%3C%2Fsvg%3E");position-area:inline-end;margin-inline-start:var(--vui-annotate-target-gap)}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-annotate-color{syntax:"<color>";inherits:true;initial-value:#d16500}@property --vui-annotate-arrow-x{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-arrow-y{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-text-x{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-text-y{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-rotate{syntax:"<angle>";inherits:true;initial-value:-4deg}@property --vui-annotate-target-gap{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-label-gap{syntax:"<length>";inherits:true;initial-value:0}@property --vui-annotate-label-max-width{syntax:"<length>";inherits:true;initial-value:150px}@property --vui-annotate-z-index{syntax:"*";inherits:true;initial-value:auto}@property --vui-annotate-text-align{syntax:"*";inherits:true;initial-value:start}@property --__annotate-tail-x{syntax:"<length>";inherits:true;initial-value:23px}@property --__annotate-tail-y{syntax:"<length>";inherits:true;initial-value:4px}@property --__annotate-note-align-x{syntax:"<length-percentage>";inherits:true;initial-value:-50%}@property --__annotate-note-align-y{syntax:"<length-percentage>";inherits:true;initial-value:0%}@property --__annotate-arrow-mask{syntax:"*";inherits:true;initial-value:none}.viraui__annotate-module__Annotate_7C36U{--vui-annotate-color:var(--global-foreground);--vui-annotate-target-gap:var(--space-s);--vui-annotate-label-gap:var(--space-xs);--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap));anchor-name:--vui-annotate-target;anchor-scope:--vui-annotate-target,--vui-annotate-arrow;display:inline-block;overflow:visible;border-radius:var(--radius-xs)}.viraui__annotate-module__Arrow_T4B-6{position:absolute;z-index:var(--vui-annotate-z-index);position-anchor:--vui-annotate-target;anchor-name:--vui-annotate-arrow;width:46px;height:38px;margin-left:var(--vui-annotate-arrow-x);margin-top:var(--vui-annotate-arrow-y);transform-origin:50% 50%;mask:var(--__annotate-arrow-mask) center /contain no-repeat;background:var(--vui-annotate-color);pointer-events:none}.viraui__annotate-module__Note_8UW-R{position:absolute;z-index:var(--vui-annotate-z-index);position-anchor:--vui-annotate-arrow;left:calc(anchor(left) + var(--__annotate-tail-x));top:calc(anchor(top) + var(--__annotate-tail-y));width:max-content;max-width:var(--vui-annotate-label-max-width);transform:translate(var(--__annotate-note-align-x),var(--__annotate-note-align-y)) rotate(var(--vui-annotate-rotate));font-family:Segoe Print,Chalkboard SE,Marker Felt,Dancing Script,sans-serif,system-ui;font-size:.95rem;line-height:1.05;color:var(--vui-annotate-color);text-align:var(--vui-annotate-text-align);white-space:normal;pointer-events:none}.viraui__annotate-module__NoteNudge_uQbzg{display:block}.viraui__annotate-module__Annotate_7C36U[data-mark=true]{background:oklab(from var(--vui-annotate-color) l a b/30%);box-shadow:-.3em 0 0 0 oklab(from var(--vui-annotate-color) l a b/30%),.3em 0 0 0 oklab(from var(--vui-annotate-color) l a b/30%)}.viraui__annotate-module__Annotate_7C36U[data-side=top]{--__annotate-tail-x:23px;--__annotate-tail-y:4px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap))}.viraui__annotate-module__Annotate_7C36U[data-side=top] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M23%204c-1%209-1%2020%200%2031%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m17%2029%206%207%206-7%22%2F%3E%3C%2Fsvg%3E");position-area:block-start;margin-bottom:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=top-start]{--__annotate-tail-x:6px;--__annotate-tail-y:6px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap))}.viraui__annotate-module__Annotate_7C36U[data-side=top-start] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M6%206c10%202%2022%2014%2034%2026%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m36%2022%204%2010-10-4%22%2F%3E%3C%2Fsvg%3E");position-area:block-start inline-start;margin-bottom:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=top-end]{--__annotate-tail-x:40px;--__annotate-tail-y:6px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:calc(-100% - var(--vui-annotate-label-gap))}.viraui__annotate-module__Annotate_7C36U[data-side=top-end] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M40%206C30%208%2018%2020%206%2032%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M10%2022%206%2032l10-4%22%2F%3E%3C%2Fsvg%3E");position-area:block-start inline-end;margin-bottom:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom]{--__annotate-tail-x:23px;--__annotate-tail-y:35px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:var(--vui-annotate-label-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M23%2035c-1-9-1-20%200-31%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m17%2010%206-7%206%207%22%2F%3E%3C%2Fsvg%3E");position-area:block-end;margin-top:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-start]{--__annotate-tail-x:6px;--__annotate-tail-y:32px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:var(--vui-annotate-label-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-start] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M6%2032c10-2%2022-14%2034-26%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m30%2010%2010-4-4%2010%22%2F%3E%3C%2Fsvg%3E");position-area:block-end inline-start;margin-top:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-end]{--__annotate-tail-x:40px;--__annotate-tail-y:32px;--__annotate-note-align-x:-50%;--__annotate-note-align-y:var(--vui-annotate-label-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=bottom-end] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M40%2032C30%2030%2018%2018%206%206%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M16%2010%206%206l4%2010%22%2F%3E%3C%2Fsvg%3E");position-area:block-end inline-end;margin-top:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=start]{--__annotate-tail-x:4px;--__annotate-tail-y:19px;--__annotate-note-align-x:calc(-100% - var(--vui-annotate-label-gap));--__annotate-note-align-y:-50%}.viraui__annotate-module__Annotate_7C36U[data-side=start] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M4%2019c11-1%2027-1%2039%200%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m36%2013%207%206-7%206%22%2F%3E%3C%2Fsvg%3E");position-area:inline-start;margin-inline-end:var(--vui-annotate-target-gap)}.viraui__annotate-module__Annotate_7C36U[data-side=end]{--__annotate-tail-x:43px;--__annotate-tail-y:19px;--__annotate-note-align-x:var(--vui-annotate-label-gap);--__annotate-note-align-y:-50%}.viraui__annotate-module__Annotate_7C36U[data-side=end] .viraui__annotate-module__Arrow_T4B-6{--__annotate-arrow-mask:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2246%22%20height%3D%2238%22%20viewBox%3D%220%200%2046%2038%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M43%2019c-11-1-28-1-40%200%22%2F%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22m10%2013-7%206%207%206%22%2F%3E%3C%2Fsvg%3E");position-area:inline-end;margin-inline-start:var(--vui-annotate-target-gap)}}

package/dist/components/annotate/annotate.d.ts

@@ -69,13 +69,13 @@ export type AnnotateProps = React.ComponentPropsWithRef<'span'> & {
     /**
      * Gap between the target and the arrow via `--vui-annotate-target-gap`.
      *
-     * @default `var(--space-small)`
+     * @default `var(--space-s)`
      */
     targetGap?: string;
     /**
      * Gap between arrow and label on all sides via `--vui-annotate-label-gap`.
      *
-     * @default `var(--space-x-small)`
+     * @default `var(--space-xs)`
      */
     labelGap?: string;
     /**

package/dist/components/autocomplete/autocomplete-group.js

@@ -8,19 +8,19 @@ var AutocompleteGroup = ({ children, className, label, ...otherProps }) => /* @_
 	...otherProps,
 	className,
 	render: /* @__PURE__ */ jsx(Stack, {
-		rowGap: "2x-small",
-		vPadding: "2x-small"
+		rowGap: "2xs",
+		vPadding: "2xs"
 	}),
 	children: [/* @__PURE__ */ jsx(Autocomplete.GroupLabel, {
 		render: /* @__PURE__ */ jsx(Stack, {
-			columnGap: "small",
+			columnGap: "s",
 			direction: "row",
-			hPadding: "small",
+			hPadding: "s",
 			vAlign: "center",
-			vPadding: ["small", "x-small"]
+			vPadding: ["s", "xs"]
 		}),
 		children: /* @__PURE__ */ jsx(Text, {
-			size: "x-small",
+			size: "xs",
 			tone: "muted",
 			weight: "semibold",
 			children: label

package/dist/components/autocomplete/autocomplete-item.js

@@ -13,11 +13,11 @@ var AutocompleteItemPart = ({ addon, addonAlign = "center", children, className,
 	render: /* @__PURE__ */ jsx(Surface, { radius: "auto" }),
 	children: /* @__PURE__ */ jsxs(Stack, {
 		className: autocomplete_module_default.ItemRow,
-		columnGap: "small",
+		columnGap: "s",
 		direction: "row",
-		hPadding: "small",
+		hPadding: "s",
 		vAlign: addonAlign,
-		vPadding: "small",
+		vPadding: "s",
 		children: [addon && /* @__PURE__ */ jsx(Stack, {
 			expandChildren: true,
 			"aria-hidden": "true",
@@ -27,8 +27,8 @@ var AutocompleteItemPart = ({ addon, addonAlign = "center", children, className,
 		}), /* @__PURE__ */ jsx(Text, {
 			"data-grow": "true",
 			"data-shrink": "true",
-			lineHeight: "small",
-			size: "small",
+			lineHeight: "s",
+			size: "s",
 			children
 		})]
 	})

package/dist/components/autocomplete/autocomplete.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-autocomplete-input-height{syntax:"<length>";inherits:true;initial-value:0}@property --vui-autocomplete-control-group-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-autocomplete-control-group-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-autocomplete-control-group-border-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-autocomplete-control-group-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --vui-autocomplete-list-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --vui-autocomplete-list-padding{syntax:"<length>";inherits:true;initial-value:0}@property --__autocomplete-list-appear-offset{syntax:"<length>";inherits:false;initial-value:8px}.viraui__autocomplete-module__Autocomplete_WfXkD{--vui-autocomplete-input-height:var(--space-2x-large);--vui-autocomplete-control-group-background:var(--base-1);--vui-autocomplete-control-group-color:var(--global-foreground);--vui-autocomplete-control-group-border-color:var(--global-contrast);--vui-autocomplete-control-group-border-radius:var(--radius-medium);--vui-field-label-padding-inline:calc(var(--vui-autocomplete-control-group-border-radius) / 2);inline-size:100%;&:has([required]) .viraui__autocomplete-module__Label_aOSjz:after{content:" ＊";color:var(--highlight-red)}}.viraui__autocomplete-module__ControlGroup_AUq7O{box-sizing:border-box;inline-size:100%;min-inline-size:0;block-size:var(--vui-autocomplete-input-height);background:var(--vui-autocomplete-control-group-background);color:var(--vui-autocomplete-control-group-color);border:1px solid var(--vui-autocomplete-control-group-border-color);border-radius:var(--vui-autocomplete-control-group-border-radius);&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4:focus-visible),&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4[data-focused]){outline:var(--outline);outline-offset:var(--outline-offset)}&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4[data-invalid][data-dirty]){--vui-autocomplete-control-group-border-color:var(--highlight-red);box-shadow:none;outline-color:oklab(from var(--highlight-red) l a b/.5)}&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4:disabled),&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4[data-disabled]){--vui-autocomplete-control-group-background:var(--global-disabled-background);--vui-autocomplete-control-group-border-color:#0000;--vui-autocomplete-control-group-color:var(--global-disabled-foreground);box-shadow:none;cursor:not-allowed}&:has(.viraui__autocomplete-module__Addon_6ajrr[data-position=start])>.viraui__autocomplete-module__CustomBasicInput_k7dx4{padding-inline-start:var(--space-x-small)}&:has(.viraui__autocomplete-module__Addon_6ajrr[data-position=end])>.viraui__autocomplete-module__CustomBasicInput_k7dx4{padding-inline-end:var(--space-x-small)}}.viraui__autocomplete-module__Addon_6ajrr{min-inline-size:var(--space-x-large)}.viraui__autocomplete-module__Description_cr8U6{padding-inline:calc(var(--vui-autocomplete-control-group-border-radius) / 2)}.viraui__autocomplete-module__AutocompletePopup_nF49j{--vui-autocomplete-list-border-radius:var(--radius-medium);--vui-autocomplete-list-padding:var(--space-x-small);box-sizing:border-box;min-inline-size:var(--anchor-width);overflow:visible;color:var(--global-foreground);outline:none;position:relative;transform-origin:var(--transform-origin);transition:opacity var(--duration-instant) var(--easing-entrance),scale var(--duration-instant) var(--easing-entrance),translate var(--duration-instant) var(--easing-entrance);&[data-ending-style],&[data-starting-style]{opacity:0;scale:.96}&[data-side=bottom][data-ending-style],&[data-side=bottom][data-starting-style]{translate:0 calc(var(--__autocomplete-list-appear-offset) * -1)}&[data-side=top][data-ending-style],&[data-side=top][data-starting-style]{translate:0 var(--__autocomplete-list-appear-offset)}&[data-side=inline-start][data-ending-style],&[data-side=inline-start][data-starting-style],&[data-side=left][data-ending-style],&[data-side=left][data-starting-style]{translate:var(--__autocomplete-list-appear-offset) 0}&[data-side=inline-end][data-ending-style],&[data-side=inline-end][data-starting-style],&[data-side=right][data-ending-style],&[data-side=right][data-starting-style]{translate:calc(var(--__autocomplete-list-appear-offset) * -1) 0}}.viraui__autocomplete-module__PopupChrome_573fy{box-sizing:border-box;max-block-size:var(--available-height);overscroll-behavior:contain}.viraui__autocomplete-module__List_Tl5j1{box-sizing:border-box;inline-size:100%;scroll-padding-block:var(--vui-autocomplete-list-padding);&:focus,&:focus-visible{outline:none}}.viraui__autocomplete-module__Empty_Xa34u:not(:empty),.viraui__autocomplete-module__Status_XLDvE:not(:empty){padding-inline:var(--space-small);padding-block:var(--space-small)}.viraui__autocomplete-module__ItemRow_ab22I{min-block-size:var(--space-x-large)}}@layer viraui.overrides{.viraui__autocomplete-module__CustomBasicInput_k7dx4{flex:1 1 auto;block-size:100%;line-height:1.2;background:#0000;border-radius:inherit;&:not(:-webkit-autofill){box-shadow:none}&:focus-visible{outline:none}}.viraui__autocomplete-module__Item_TmEz2{cursor:pointer;&:focus{outline:none}&:focus-visible{outline:none;box-shadow:none}&:not([data-disabled]):hover,&:not([data-disabled])[data-highlighted]{background:var(--global-contrast);@container root not style(--effect-vibrancy: initial){background:oklab(from var(--global-contrast) l a b/12%)}}&[data-disabled]{color:var(--global-disabled-foreground);cursor:not-allowed}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-autocomplete-input-height{syntax:"<length>";inherits:true;initial-value:0}@property --vui-autocomplete-control-group-background{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-autocomplete-control-group-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-autocomplete-control-group-border-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-autocomplete-control-group-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --vui-autocomplete-list-border-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --vui-autocomplete-list-padding{syntax:"<length>";inherits:true;initial-value:0}@property --__autocomplete-list-appear-offset{syntax:"<length>";inherits:false;initial-value:8px}.viraui__autocomplete-module__Autocomplete_WfXkD{--vui-autocomplete-input-height:var(--space-2xl);--vui-autocomplete-control-group-background:var(--base-1);--vui-autocomplete-control-group-color:var(--global-foreground);--vui-autocomplete-control-group-border-color:var(--global-contrast);--vui-autocomplete-control-group-border-radius:var(--radius-m);--vui-field-label-padding-inline:calc(var(--vui-autocomplete-control-group-border-radius) / 2);inline-size:100%;&:has([required]) .viraui__autocomplete-module__Label_aOSjz:after{content:" ＊";color:var(--highlight-red)}}.viraui__autocomplete-module__ControlGroup_AUq7O{box-sizing:border-box;inline-size:100%;min-inline-size:0;block-size:var(--vui-autocomplete-input-height);background:var(--vui-autocomplete-control-group-background);color:var(--vui-autocomplete-control-group-color);border:1px solid var(--vui-autocomplete-control-group-border-color);border-radius:var(--vui-autocomplete-control-group-border-radius);&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4:focus-visible),&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4[data-focused]){outline:var(--outline);outline-offset:var(--outline-offset)}&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4[data-invalid][data-dirty]){--vui-autocomplete-control-group-border-color:var(--highlight-red);box-shadow:none;outline-color:oklab(from var(--highlight-red) l a b/.5)}&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4:disabled),&:has(.viraui__autocomplete-module__CustomBasicInput_k7dx4[data-disabled]){--vui-autocomplete-control-group-background:var(--global-disabled-background);--vui-autocomplete-control-group-border-color:#0000;--vui-autocomplete-control-group-color:var(--global-disabled-foreground);box-shadow:none;cursor:not-allowed}&:has(.viraui__autocomplete-module__Addon_6ajrr[data-position=start])>.viraui__autocomplete-module__CustomBasicInput_k7dx4{padding-inline-start:var(--space-xs)}&:has(.viraui__autocomplete-module__Addon_6ajrr[data-position=end])>.viraui__autocomplete-module__CustomBasicInput_k7dx4{padding-inline-end:var(--space-xs)}}.viraui__autocomplete-module__Addon_6ajrr{min-inline-size:var(--space-xl)}.viraui__autocomplete-module__Description_cr8U6{padding-inline:calc(var(--vui-autocomplete-control-group-border-radius) / 2)}.viraui__autocomplete-module__AutocompletePopup_nF49j{--vui-autocomplete-list-border-radius:var(--radius-m);--vui-autocomplete-list-padding:var(--space-xs);box-sizing:border-box;min-inline-size:var(--anchor-width);overflow:visible;color:var(--global-foreground);outline:none;position:relative;transform-origin:var(--transform-origin);transition:opacity var(--duration-instant) var(--easing-entrance),scale var(--duration-instant) var(--easing-entrance),translate var(--duration-instant) var(--easing-entrance);&[data-ending-style],&[data-starting-style]{opacity:0;scale:.96}&[data-side=bottom][data-ending-style],&[data-side=bottom][data-starting-style]{translate:0 calc(var(--__autocomplete-list-appear-offset) * -1)}&[data-side=top][data-ending-style],&[data-side=top][data-starting-style]{translate:0 var(--__autocomplete-list-appear-offset)}&[data-side=inline-start][data-ending-style],&[data-side=inline-start][data-starting-style],&[data-side=left][data-ending-style],&[data-side=left][data-starting-style]{translate:var(--__autocomplete-list-appear-offset) 0}&[data-side=inline-end][data-ending-style],&[data-side=inline-end][data-starting-style],&[data-side=right][data-ending-style],&[data-side=right][data-starting-style]{translate:calc(var(--__autocomplete-list-appear-offset) * -1) 0}}.viraui__autocomplete-module__PopupChrome_573fy{box-sizing:border-box;max-block-size:var(--available-height);overscroll-behavior:contain}.viraui__autocomplete-module__List_Tl5j1{box-sizing:border-box;inline-size:100%;scroll-padding-block:var(--vui-autocomplete-list-padding);&:focus,&:focus-visible{outline:none}}.viraui__autocomplete-module__Empty_Xa34u:not(:empty),.viraui__autocomplete-module__Status_XLDvE:not(:empty){padding-inline:var(--space-s);padding-block:var(--space-s)}.viraui__autocomplete-module__ItemRow_ab22I{min-block-size:var(--space-xl)}}@layer viraui.overrides{.viraui__autocomplete-module__CustomBasicInput_k7dx4{flex:1 1 auto;block-size:100%;line-height:1.2;background:#0000;border-radius:inherit;&:not(:-webkit-autofill){box-shadow:none}&:focus-visible{outline:none}}.viraui__autocomplete-module__Item_TmEz2{cursor:pointer;&:focus{outline:none}&:focus-visible{outline:none;box-shadow:none}&:not([data-disabled]):hover,&:not([data-disabled])[data-highlighted]{background:var(--global-contrast);@container root not style(--effect-vibrancy: initial){background:oklab(from var(--global-contrast) l a b/12%)}}&[data-disabled]{color:var(--global-disabled-foreground);cursor:not-allowed}}}

package/dist/components/autocomplete/autocomplete.js

@@ -37,7 +37,7 @@ function AutocompleteRootComponent({ children, className, container, description
 		validationMode,
 		render: /* @__PURE__ */ jsx(Stack, {
 			expandChildren: true,
-			rowGap: "small"
+			rowGap: "s"
 		}),
 		children: [
 			label && /* @__PURE__ */ jsx(Field.Label, {
@@ -76,15 +76,15 @@ function AutocompleteRootComponent({ children, className, container, description
 									className: autocomplete_module_default.PopupChrome,
 									color: 1,
 									"data-vibrant": true,
-									hPadding: "x-small",
+									hPadding: "xs",
 									overflow: "auto",
-									radius: "medium",
-									vPadding: "x-small",
+									radius: "m",
+									vPadding: "xs",
 									children: [
 										/* @__PURE__ */ jsx(Autocomplete.Status, {
 											className: autocomplete_module_default.Status,
 											children: typeof status === "string" ? /* @__PURE__ */ jsx(Text, {
-												size: "x-small",
+												size: "xs",
 												tone: "muted",
 												children: status
 											}) : status
@@ -92,7 +92,7 @@ function AutocompleteRootComponent({ children, className, container, description
 										/* @__PURE__ */ jsx(Autocomplete.Empty, {
 											className: autocomplete_module_default.Empty,
 											children: typeof empty === "string" ? /* @__PURE__ */ jsx(Text, {
-												size: "small",
+												size: "s",
 												tone: "muted",
 												children: empty
 											}) : empty

package/dist/components/avatar/avatar.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-avatar-size{syntax:"<length>";inherits:false;initial-value:0}@property --vui-avatar-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --vui-avatar-background{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-avatar-foreground{syntax:"<color>";inherits:false;initial-value:#0000}.viraui__avatar-module__Avatar_BRuS3{--vui-avatar-size:var(--space-2x-large);--vui-avatar-background:var(--global-contrast);--vui-avatar-foreground:var(--global-foreground);--vui-avatar-radius:var(--radius-small);display:inline-flex;align-items:center;justify-content:center;inline-size:round(to-zero,var(--vui-avatar-size),2px);block-size:round(to-zero,var(--vui-avatar-size),2px);min-inline-size:round(to-zero,var(--vui-avatar-size),2px);min-block-size:round(to-zero,var(--vui-avatar-size),2px);overflow:hidden;border-radius:var(--vui-avatar-radius);background:var(--vui-avatar-background);color:var(--vui-avatar-foreground);vertical-align:middle;-webkit-user-select:none;user-select:none;container-type:inline-size;&[data-size=x-small]{--vui-avatar-size:var(--space-large);--vui-avatar-radius:var(--radius-small)}&[data-size=medium]{--vui-avatar-size:var(--space-wide)}&[data-size=large]{--vui-avatar-size:var(--space-x-wide);--vui-avatar-radius:var(--radius-large)}}.viraui__avatar-module__Image_Q7bHi{inline-size:100%;block-size:100%;display:block;object-fit:cover}}@layer viraui.overrides{.viraui__avatar-module__Label_QASTF{font-size:30cqw}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-avatar-size{syntax:"<length>";inherits:false;initial-value:0}@property --vui-avatar-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --vui-avatar-background{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-avatar-foreground{syntax:"<color>";inherits:false;initial-value:#0000}.viraui__avatar-module__Avatar_BRuS3{--vui-avatar-size:var(--space-2xl);--vui-avatar-background:var(--global-contrast);--vui-avatar-foreground:var(--global-foreground);--vui-avatar-radius:var(--radius-s);display:inline-flex;align-items:center;justify-content:center;inline-size:round(to-zero,var(--vui-avatar-size),2px);block-size:round(to-zero,var(--vui-avatar-size),2px);min-inline-size:round(to-zero,var(--vui-avatar-size),2px);min-block-size:round(to-zero,var(--vui-avatar-size),2px);overflow:hidden;border-radius:var(--vui-avatar-radius);background:var(--vui-avatar-background);color:var(--vui-avatar-foreground);vertical-align:middle;-webkit-user-select:none;user-select:none;container-type:inline-size;&[data-size=xs]{--vui-avatar-size:var(--space-l);--vui-avatar-radius:var(--radius-s)}&[data-size=m]{--vui-avatar-size:var(--space-3xl)}&[data-size=l]{--vui-avatar-size:var(--space-4xl);--vui-avatar-radius:var(--radius-l)}}.viraui__avatar-module__Image_Q7bHi{inline-size:100%;block-size:100%;display:block;object-fit:cover}}@layer viraui.overrides{.viraui__avatar-module__Label_QASTF{font-size:30cqw}}

package/dist/components/avatar/avatar.d.ts

@@ -29,9 +29,9 @@ export type AvatarProps = React.ComponentPropsWithRef<'span'> & {
     /**
      * Selects the rendered avatar footprint.
      *
-     * @default 'small'
+     * @default 's'
      */
-    size?: 'x-small' | 'small' | 'medium' | 'large';
+    size?: 'xs' | 's' | 'm' | 'l';
     /**
      * Ref forwarded to the rendered avatar root element.
      *

package/dist/components/avatar/avatar.js

@@ -6,12 +6,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Avatar } from "@base-ui/react/avatar";
 //#region src/components/avatar/avatar.tsx
 var fallbackTextSizeByAvatarSize = {
-	"x-small": "x-small",
-	small: "x-small",
-	medium: "small",
-	large: "large"
+	xs: "xs",
+	s: "xs",
+	m: "s",
+	l: "2xl"
 };
-var Avatar$1 = ({ alt = "", className, fallback, ref, size = "small", src, ...otherProps }) => {
+var Avatar$1 = ({ alt = "", className, fallback, ref, size = "s", src, ...otherProps }) => {
 	const hasImage = Boolean(src);
 	return /* @__PURE__ */ jsxs(Avatar.Root, {
 		...otherProps,

package/dist/components/avatar-group/avatar-group.css

@@ -1,4 +1,4 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-avatar-group-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-avatar-group-overlap-distance{syntax:"<length>";inherits:true;initial-value:0}@property --vui-avatar-group-gap-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-avatar-group-item-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --__avatar-group-hole-half{syntax:"<length>";inherits:false;initial-value:0}@property --__avatar-group-hole-r{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-cx{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-cy{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-corner-tl{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-tr{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-br{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-bl{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-inset{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-edge{syntax:"<length-percentage>";inherits:false;initial-value:0}.viraui__avatar-group-module__AvatarGroup_zOrR-{--vui-avatar-group-size:var(--space-2x-large);--vui-avatar-group-overlap-distance:var(--space-small);--vui-avatar-group-gap-size:var(--space-x-small);--vui-avatar-group-item-radius:var(--radius-medium);display:inline-flex;flex-wrap:nowrap;align-items:flex-start;min-inline-size:max-content;vertical-align:middle;&[data-direction=vertical]{flex-direction:column}&[data-size=x-small]{--vui-avatar-group-size:var(--space-large);--vui-avatar-group-overlap-distance:var(--space-small);--vui-avatar-group-gap-size:var(--space-2x-small);--vui-avatar-group-item-radius:var(--radius-small)}&[data-size=medium]{--vui-avatar-group-size:var(--space-wide);--vui-avatar-group-overlap-distance:var(--space-medium);--vui-avatar-group-gap-size:var(--space-x-small)}&[data-size=large]{--vui-avatar-group-size:var(--space-x-wide);--vui-avatar-group-overlap-distance:var(--space-x-large);--vui-avatar-group-gap-size:var(--space-small);--vui-avatar-group-item-radius:var(--radius-large)}}.viraui__avatar-group-module__AvatarWrapper_0opqY{position:relative;display:inline-flex;flex:0 0 auto;inline-size:round(to-zero,var(--vui-avatar-group-size),2px);block-size:round(to-zero,var(--vui-avatar-group-size),2px);.viraui__avatar-group-module__AvatarGroup_zOrR-[data-direction=horizontal] &:not(:first-child){margin-inline-start:calc(var(--vui-avatar-group-overlap-distance) * -1)}.viraui__avatar-group-module__AvatarGroup_zOrR-[data-direction=vertical] &:not(:first-child){margin-block-start:calc(var(--vui-avatar-group-overlap-distance) * -1)}--__avatar-group-hole-half:calc((var(--vui-avatar-group-size) / 2) + var(--vui-avatar-group-gap-size));--__avatar-group-hole-r:calc(
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-avatar-group-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-avatar-group-overlap-distance{syntax:"<length>";inherits:true;initial-value:0}@property --vui-avatar-group-gap-size{syntax:"<length>";inherits:true;initial-value:0}@property --vui-avatar-group-item-radius{syntax:"<length-percentage>";inherits:true;initial-value:0}@property --__avatar-group-hole-half{syntax:"<length>";inherits:false;initial-value:0}@property --__avatar-group-hole-r{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-cx{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-cy{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-corner-tl{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-tr{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-br{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-bl{syntax:"*";inherits:false;initial-value:none}@property --__avatar-group-hole-corner-inset{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --__avatar-group-hole-edge{syntax:"<length-percentage>";inherits:false;initial-value:0}.viraui__avatar-group-module__AvatarGroup_zOrR-{--vui-avatar-group-size:var(--space-2xl);--vui-avatar-group-overlap-distance:var(--space-s);--vui-avatar-group-gap-size:var(--space-xs);--vui-avatar-group-item-radius:var(--radius-m);display:inline-flex;flex-wrap:nowrap;align-items:flex-start;min-inline-size:max-content;vertical-align:middle;&[data-direction=vertical]{flex-direction:column}&[data-size=xs]{--vui-avatar-group-size:var(--space-l);--vui-avatar-group-overlap-distance:var(--space-s);--vui-avatar-group-gap-size:var(--space-2xs);--vui-avatar-group-item-radius:var(--radius-s)}&[data-size=m]{--vui-avatar-group-size:var(--space-3xl);--vui-avatar-group-overlap-distance:var(--space-m);--vui-avatar-group-gap-size:var(--space-xs)}&[data-size=l]{--vui-avatar-group-size:var(--space-4xl);--vui-avatar-group-overlap-distance:var(--space-xl);--vui-avatar-group-gap-size:var(--space-s);--vui-avatar-group-item-radius:var(--radius-l)}}.viraui__avatar-group-module__AvatarWrapper_0opqY{position:relative;display:inline-flex;flex:0 0 auto;inline-size:round(to-zero,var(--vui-avatar-group-size),2px);block-size:round(to-zero,var(--vui-avatar-group-size),2px);.viraui__avatar-group-module__AvatarGroup_zOrR-[data-direction=horizontal] &:not(:first-child){margin-inline-start:calc(var(--vui-avatar-group-overlap-distance) * -1)}.viraui__avatar-group-module__AvatarGroup_zOrR-[data-direction=vertical] &:not(:first-child){margin-block-start:calc(var(--vui-avatar-group-overlap-distance) * -1)}--__avatar-group-hole-half:calc((var(--vui-avatar-group-size) / 2) + var(--vui-avatar-group-gap-size));--__avatar-group-hole-r:calc(
     min(var(--vui-avatar-group-item-radius), var(--vui-avatar-group-size) / 2) + var(--vui-avatar-group-gap-size)
   );.viraui__avatar-group-module__AvatarGroup_zOrR-:dir(ltr)[data-direction=horizontal] &:not(:last-child){--__avatar-group-hole-cx:calc(
       100% + (var(--vui-avatar-group-size) / 2) - var(--vui-avatar-group-overlap-distance)

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

@@ -19,7 +19,7 @@ export type AvatarGroupProps = React.ComponentPropsWithRef<'div'> & {
     /**
      * Selects the shared avatar footprint for every rendered avatar.
      *
-     * @default 'small'
+     * @default 's'
      */
     size?: AvatarProps['size'];
     /**

package/dist/components/avatar-group/avatar-group.js

@@ -8,7 +8,7 @@ import { Surface } from "../surface/surface.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/avatar-group/avatar-group.tsx
 var getAvatarKey = (avatar, index) => `${avatar.src ?? "fallback"}-${typeof avatar.fallback === "string" ? avatar.fallback : "node"}-${index}`;
-var AvatarGroup = ({ avatars, className, direction = "horizontal", maxVisible, overflowText, ref, size = "small", style, ...otherProps }) => {
+var AvatarGroup = ({ avatars, className, direction = "horizontal", maxVisible, overflowText, ref, size = "s", style, ...otherProps }) => {
 	const isOverflowing = typeof maxVisible === "number" && maxVisible > 0 && avatars.length > maxVisible;
 	const hasOverflow = isOverflowing && overflowText !== void 0 && overflowText !== null;
 	const truncatedAvatars = isOverflowing ? avatars.slice(0, maxVisible) : avatars;
@@ -36,7 +36,7 @@ var AvatarGroup = ({ avatars, className, direction = "horizontal", maxVisible, o
 					direction: "row",
 					hAlign: "center",
 					vAlign: "center",
-					hPadding: "medium"
+					hPadding: "m"
 				}),
 				children: /* @__PURE__ */ jsx(Text, {
 					whiteSpace: "nowrap",

package/dist/components/basic-input/basic-input.css

@@ -1 +1 @@
-@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-basic-input-background{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-basic-input-border-radius{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --vui-basic-input-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-basic-input-font-size{syntax:"<length>";inherits:false;initial-value:1rem}@property --vui-basic-input-padding-inline{syntax:"<length>";inherits:false;initial-value:0}@property --vui-basic-input-placeholder-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-field-label-padding-inline{syntax:"<length>";inherits:true;initial-value:0}.viraui__basic-input-module__BasicInput_5uE64{--vui-basic-input-background:var(--base-1);--vui-basic-input-color:var(--global-foreground);--vui-basic-input-placeholder-color:var(--global-disabled-foreground);--vui-basic-input-padding-inline:calc(var(--space-small) + var(--space-x-small));--vui-basic-input-font-size:var(--font-scale-body-small);--vui-basic-input-border-radius:var(--radius-medium);box-sizing:border-box;margin:0;inline-size:100%;min-inline-size:0;padding-inline:var(--vui-basic-input-padding-inline);font-family:inherit;font-size:var(--vui-basic-input-font-size);font-variation-settings:"wght" 400;color:var(--vui-basic-input-color);background:var(--vui-basic-input-background);border:none;border-radius:var(--vui-basic-input-border-radius);appearance:none;caret-color:var(--global-primary);&::-webkit-contacts-auto-fill-button{background-color:var(--vui-basic-input-color)}&:-webkit-autofill,&:-webkit-autofill:active,&:-webkit-autofill:focus,&:-webkit-autofill:hover{-webkit-text-fill-color:var(--vui-basic-input-color);box-shadow:0 0 0 100px var(--vui-basic-input-background) inset,0 0 0 100px var(--vui-basic-input-background) inset;&::selection{background-color:var(--global-primary);color:contrast-color(var(--global-primary));-webkit-text-fill-color:contrast-color(var(--global-primary))}}&::placeholder{color:var(--vui-basic-input-placeholder-color)}&:disabled{--vui-basic-input-background:var(--global-disabled-background);--vui-basic-input-color:var(--global-disabled-foreground);--vui-basic-input-placeholder-color:var(--global-disabled-foreground);cursor:not-allowed}&[data-invalid][data-dirty]{outline-color:oklab(from var(--highlight-red) l a b/.3)}&[data-sizing=content]{field-sizing:content}}}
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{@property --vui-basic-input-background{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-basic-input-border-radius{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --vui-basic-input-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --vui-basic-input-font-size{syntax:"<length>";inherits:false;initial-value:1rem}@property --vui-basic-input-padding-inline{syntax:"<length>";inherits:false;initial-value:0}@property --vui-basic-input-placeholder-color{syntax:"<color>";inherits:true;initial-value:#0000}@property --vui-field-label-padding-inline{syntax:"<length>";inherits:true;initial-value:0}.viraui__basic-input-module__BasicInput_5uE64{--vui-basic-input-background:var(--base-1);--vui-basic-input-color:var(--global-foreground);--vui-basic-input-placeholder-color:var(--global-disabled-foreground);--vui-basic-input-padding-inline:calc(var(--space-s) + var(--space-xs));--vui-basic-input-font-size:var(--font-scale-body-s);--vui-basic-input-border-radius:var(--radius-m);box-sizing:border-box;margin:0;inline-size:100%;min-inline-size:0;padding-inline:var(--vui-basic-input-padding-inline);font-family:inherit;font-size:var(--vui-basic-input-font-size);font-variation-settings:"wght" 400;color:var(--vui-basic-input-color);background:var(--vui-basic-input-background);border:none;border-radius:var(--vui-basic-input-border-radius);appearance:none;caret-color:var(--global-primary);&::-webkit-contacts-auto-fill-button{background-color:var(--vui-basic-input-color)}&:-webkit-autofill,&:-webkit-autofill:active,&:-webkit-autofill:focus,&:-webkit-autofill:hover{-webkit-text-fill-color:var(--vui-basic-input-color);box-shadow:0 0 0 100px var(--vui-basic-input-background) inset,0 0 0 100px var(--vui-basic-input-background) inset;&::selection{background-color:var(--global-primary);color:contrast-color(var(--global-primary));-webkit-text-fill-color:contrast-color(var(--global-primary))}}&::placeholder{color:var(--vui-basic-input-placeholder-color)}&:disabled{--vui-basic-input-background:var(--global-disabled-background);--vui-basic-input-color:var(--global-disabled-foreground);--vui-basic-input-placeholder-color:var(--global-disabled-foreground);cursor:not-allowed}&[data-invalid][data-dirty]{outline-color:oklab(from var(--highlight-red) l a b/.3)}&[data-sizing=content]{field-sizing:content}}}

package/dist/components/basic-input/field-helper-copy.js

@@ -19,7 +19,7 @@ var FieldHelperCopy = ({ className, description, error }) => {
 			match: true,
 			render: /* @__PURE__ */ jsx(Text, {
 				selection: false,
-				size: "small",
+				size: "s",
 				tone: "danger"
 			}),
 			children: error
@@ -28,7 +28,7 @@ var FieldHelperCopy = ({ className, description, error }) => {
 			className,
 			render: /* @__PURE__ */ jsx(Text, {
 				selection: false,
-				size: "small",
+				size: "s",
 				tone: "muted"
 			}),
 			children: description
@@ -37,7 +37,7 @@ var FieldHelperCopy = ({ className, description, error }) => {
 			className,
 			render: /* @__PURE__ */ jsx(Text, {
 				selection: false,
-				size: "small",
+				size: "s",
 				tone: "danger"
 			})
 		});

package/dist/components/basic-input/field-label.js

@@ -11,9 +11,9 @@ import { jsx } from "react/jsx-runtime";
 * label must associate with a control; choice inputs wrap `Field.Label` around the
 * control and render this component for the visible label copy.
 */
-var FieldLabel = ({ children, className, size = "small", ...textProps }) => /* @__PURE__ */ jsx(Text, {
+var FieldLabel = ({ children, className, size = "s", ...textProps }) => /* @__PURE__ */ jsx(Text, {
 	className: clsx(field_label_module_default.FieldLabel, className),
-	lineHeight: "small",
+	lineHeight: "s",
 	selection: false,
 	size,
 	render: /* @__PURE__ */ jsx("span", {}),

package/dist/components/basic-input/input-control-group.js

@@ -14,7 +14,7 @@ var InputControlGroup = ({ addonClassName, children, controlGroupClassName, endA
 			className: addonClassName,
 			"data-position": "start",
 			hAlign: "center",
-			hPadding: ["small", "x-small"],
+			hPadding: ["s", "xs"],
 			inline: true,
 			"data-shrink": "false",
 			vAlign: "center",
@@ -25,7 +25,7 @@ var InputControlGroup = ({ addonClassName, children, controlGroupClassName, endA
 			className: addonClassName,
 			"data-position": "end",
 			hAlign: "center",
-			hPadding: "x-small",
+			hPadding: "xs",
 			inline: true,
 			"data-shrink": "false",
 			vAlign: "center",