@viraui/react 2026.6.5 → 2026.7.0-next.1

package/dist/components/dialog/dialog-indent-background.d.ts

@@ -6,7 +6,7 @@ import type * as React from 'react';
  * Pass-through to Base UI `Drawer.IndentBackground` with Vira-owned root class applied.
  * Place before `Dialog.Indent` inside `Dialog.Provider` for the indent background layer.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type DialogIndentBackgroundProps = DrawerIndentBackground.Props;
 export declare const DialogIndentBackground: React.FC<DialogIndentBackgroundProps>;

package/dist/components/dialog/dialog-indent.d.ts

@@ -6,7 +6,7 @@ import type * as React from 'react';
  * Pass-through to Base UI `Drawer.Indent` with Vira-owned root class applied.
  * Wrap app shell content inside `Dialog.Provider` to receive `data-active` when a sheet opens.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type DialogIndentProps = DrawerIndent.Props;
 export declare const DialogIndent: React.FC<DialogIndentProps>;

package/dist/components/dialog/dialog-sheet.d.ts

@@ -8,7 +8,7 @@ import type * as React from 'react';
  * and optional body content. Compose `Dialog.Close` inside `children` when a
  * close control is needed.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type DialogSheetProps = {
     /**
@@ -18,49 +18,49 @@ export type DialogSheetProps = {
     /**
      * Supporting copy announced with the title.
      *
-     * @default No description is rendered.
+     * @defaultValue No description is rendered.
      */
     description?: React.ReactNode;
     /**
      * Optional body content rendered below the description.
      *
-     * @default No extra body content is rendered.
+     * @defaultValue No extra body content is rendered.
      */
     children?: React.ReactNode;
     /**
      * Optional maximum width of the content area.
      *
-     * @default `50ch`
+     * @defaultValue `50ch`
      */
     maxContentWidth?: StackProps['maxWidth'];
     /**
      * Aligns the header stack and title/description text (`start` | `center` | `end`).
      *
-     * @default `start`
+     * @defaultValue `start`
      */
     headerAlign?: Extract<StackProps['hAlign'], 'start' | 'center' | 'end'>;
     /**
      * Whether to show the close button.
      *
-     * @default false
+     * @defaultValue false
      */
     showCloseButton?: boolean;
     /**
      * Centers the sheet horizontally within the viewport.
      *
-     * @default false
+     * @defaultValue false
      */
     fitContent?: boolean;
     /**
      * Whether to show the drag handle above the sheet header.
      *
-     * @default true
+     * @defaultValue true
      */
     showHandle?: boolean;
     /**
      * Maximum block size of the sheet panel.
      *
-     * @default `97dvh`
+     * @defaultValue `97dvh`
      */
     maxHeight?: string;
     /**
@@ -68,7 +68,7 @@ export type DialogSheetProps = {
      * Omit for Base UI default (`document.body` from the module window —
      * iframe hosts must pass the iframe document body explicitly).
      *
-     * @default Base UI FloatingPortal resolution
+     * @defaultValue Base UI FloatingPortal resolution
      */
     container?: React.ComponentProps<typeof PrimitiveDrawer.Portal>['container'];
 };

package/dist/components/dialog/dialog-sheet.js

@@ -1,10 +1,10 @@
 import { ChromeXmark } from "../../internal/chrome-icons/chrome-icons.js";
 import { Text } from "../text/text.js";
 import { Stack } from "../stack/stack.js";
+import { Surface } from "../surface/surface.js";
 import dialog_module_default from "./dialog.module.js";
 import { useDialogModal } from "./dialog-modal-context.js";
 import { Elevator } from "../elevator/elevator.js";
-import { Surface } from "../surface/surface.js";
 import { IconButton } from "../icon-button/icon-button.js";
 import { Title } from "../title/title.js";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/dialog/dialog-trigger.d.ts

@@ -7,7 +7,7 @@ import type * as React from 'react';
  * (`Button`, `IconButton`, or another element) and set `nativeButton` when the
  * rendered root is not a native `<button>`.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type DialogTriggerProps = DrawerTrigger.Props;
 export declare const DialogTrigger: React.FC<DialogTriggerProps>;

package/dist/components/dialog/dialog.d.ts

@@ -13,7 +13,7 @@ import type * as React from 'react';
  * Portal, backdrop, viewport, popup, title, description, and content parts are
  * internal to `Dialog.Sheet` and are not exposed on `Dialog`.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type DialogProps = DrawerRoot.Props;
 export type DialogSnapPoint = DrawerRoot.SnapPoint;

package/dist/components/disclosure/disclosure-panel.d.ts

@@ -0,0 +1,12 @@
+import { CollapsiblePanel } from '@base-ui/react/collapsible';
+import type * as React from 'react';
+/**
+ * Public Disclosure.Panel props.
+ *
+ * Base UI Collapsible Panel pass-through (`hiddenUntilFound`, `keepMounted`, `render`, …)
+ * plus the animated height shell. No default content padding — builders own children layout.
+ *
+ * @defaultValue Base UI pass-through props keep upstream defaults.
+ */
+export type DisclosurePanelProps = CollapsiblePanel.Props;
+export declare const DisclosurePanel: React.FC<DisclosurePanelProps>;

package/dist/components/disclosure/disclosure-panel.js

@@ -0,0 +1,13 @@
+"use client";
+import { clsx } from "../../core/clsx.js";
+import disclosure_module_default from "./disclosure.module.js";
+import { jsx } from "react/jsx-runtime";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/components/disclosure/disclosure-panel.tsx
+var DisclosurePanel = ({ children, className, ...otherProps }) => /* @__PURE__ */ jsx(Collapsible.Panel, {
+	className: clsx(disclosure_module_default.Panel, className),
+	...otherProps,
+	children
+});
+//#endregion
+export { DisclosurePanel };

package/dist/components/disclosure/disclosure-trigger.d.ts

@@ -0,0 +1,46 @@
+import { CollapsibleTrigger } from '@base-ui/react/collapsible';
+import { SurfaceProps } from '../surface';
+import type * as React from 'react';
+/** Surface chrome on default Trigger path. Host/`render` stay on Trigger. */
+type DisclosureTriggerSurfaceProps = Omit<SurfaceProps, 'ref'>;
+/**
+ * Public Disclosure.Trigger props.
+ *
+ * Default host = `Surface` with `render` → Base UI Collapsible Trigger (Textfield/NumberField
+ * family). Icon pair follows ToggleButton naming (`restingIcon` / `openIcon` / `interpolateIcons`).
+ * Consumer `render` replaces the whole Surface + primitive compose.
+ *
+ * @defaultValue Base UI pass-through props keep upstream defaults. On the default Surface path,
+ * `hoverColor` defaults to `2`, `hPadding` defaults to `'m'`, `vPadding` defaults to `'s'`.
+ * `interpolateIcons` defaults to `false`. `iconPosition` defaults to `'end'`.
+ */
+export type DisclosureTriggerProps = CollapsibleTrigger.Props & DisclosureTriggerSurfaceProps & {
+    /**
+     * Decorative icon while the panel is closed.
+     *
+     * @defaultValue `ChromeChevronEnd` when both icon slots are omitted.
+     */
+    restingIcon?: React.ReactNode;
+    /**
+     * Decorative icon while the panel is open.
+     *
+     * @defaultValue `ChromeChevronDown` when both icon slots are omitted. When only `restingIcon`
+     * is set, that icon shows in both states.
+     */
+    openIcon?: React.ReactNode;
+    /**
+     * When dual icons are present, crossfade and light-rotate between them
+     * (`data-interpolate="true"`). When `false`, swap instantly with no transition.
+     *
+     * @defaultValue false
+     */
+    interpolateIcons?: boolean;
+    /**
+     * Logical side of the label where the icon slot sits.
+     *
+     * @defaultValue 'end'
+     */
+    iconPosition?: 'start' | 'end';
+};
+export declare const DisclosureTrigger: React.FC<DisclosureTriggerProps>;
+export {};

package/dist/components/disclosure/disclosure-trigger.js

@@ -0,0 +1,82 @@
+"use client";
+import { clsx } from "../../core/clsx.js";
+import { ChromeChevronDown, ChromeChevronEnd } from "../../internal/chrome-icons/chrome-icons.js";
+import { Stack } from "../stack/stack.js";
+import { Surface } from "../surface/surface.js";
+import disclosure_module_default from "./disclosure.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/components/disclosure/disclosure-trigger.tsx
+var resolveIconPair = (restingIcon, openIcon) => {
+	if (restingIcon === void 0 && openIcon === void 0) return {
+		resting: /* @__PURE__ */ jsx(ChromeChevronEnd, { size: "1rem" }),
+		open: /* @__PURE__ */ jsx(ChromeChevronDown, { size: "1rem" })
+	};
+	if (restingIcon !== void 0 && openIcon === void 0) return {
+		resting: restingIcon,
+		open: null
+	};
+	if (restingIcon === void 0 && openIcon !== void 0) return {
+		resting: /* @__PURE__ */ jsx(ChromeChevronEnd, { size: "1rem" }),
+		open: openIcon
+	};
+	return {
+		resting: restingIcon,
+		open: openIcon ?? null
+	};
+};
+var DisclosureTrigger = ({ border, borderStyle, children, className, color, enableContainer, hPadding = "m", vPadding = "s", hoverColor, iconPosition = "end", interpolateIcons = false, nativeButton, openIcon, overflow, radius, render, restingIcon, style, ...otherProps }) => {
+	if (render != null) return /* @__PURE__ */ jsx(Collapsible.Trigger, {
+		className: clsx(disclosure_module_default.Trigger, className),
+		nativeButton,
+		render,
+		style,
+		...otherProps,
+		children
+	});
+	const { resting, open } = resolveIconPair(restingIcon, openIcon);
+	const iconAtStart = iconPosition === "start";
+	return /* @__PURE__ */ jsx(Surface, {
+		border,
+		borderStyle,
+		className: clsx(disclosure_module_default.Trigger, className),
+		color,
+		enableContainer,
+		hoverColor: hoverColor ?? 2,
+		hPadding,
+		vPadding,
+		overflow,
+		radius,
+		render: /* @__PURE__ */ jsx(Collapsible.Trigger, {
+			nativeButton,
+			...otherProps
+		}),
+		style,
+		children: /* @__PURE__ */ jsxs(Stack, {
+			columnGap: iconAtStart ? "s" : void 0,
+			direction: iconAtStart ? "row" : "row-reverse",
+			fullWidth: true,
+			hAlign: iconPosition === "end" ? "space-between" : "start",
+			vAlign: "center",
+			children: [open ? /* @__PURE__ */ jsxs("span", {
+				"aria-hidden": true,
+				className: disclosure_module_default.IconSlot,
+				"data-interpolate": interpolateIcons ? "true" : "false",
+				"data-shrink": "false",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: disclosure_module_default.Icon,
+					children: resting
+				}), /* @__PURE__ */ jsx("span", {
+					className: disclosure_module_default.Icon,
+					children: open
+				})]
+			}) : /* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				"data-shrink": "false",
+				children: resting
+			}), children]
+		})
+	});
+};
+//#endregion
+export { DisclosureTrigger };

package/dist/components/disclosure/disclosure.css

@@ -0,0 +1 @@
+@layer viraui.preflight, viraui.components, viraui.overrides;@layer viraui.components{.viraui__disclosure-module__Trigger_hTIkR{inline-size:100%;cursor:pointer;text-align:start;color:inherit;&:focus-visible{outline-offset:-4px}&[data-disabled]{cursor:not-allowed;opacity:.5}}.viraui__disclosure-module__IconSlot_8gEr5{position:relative;inline-size:1rem;block-size:1rem;.viraui__disclosure-module__Trigger_hTIkR[data-panel-open] &{.viraui__disclosure-module__Icon_w8tYN:first-of-type{opacity:0;rotate:30deg}.viraui__disclosure-module__Icon_w8tYN:last-of-type{opacity:1;rotate:0deg}}&[data-interpolate=true] .viraui__disclosure-module__Icon_w8tYN{transition:opacity var(--duration-fast) var(--easing-standard),rotate var(--duration-fast) var(--easing-standard)}@media (prefers-reduced-motion:reduce){&[data-interpolate=true] .viraui__disclosure-module__Icon_w8tYN{transition:none}}}.viraui__disclosure-module__Icon_w8tYN{position:absolute;inset:0;display:grid;place-items:center;&>svg{block-size:1rem;inline-size:1rem}&:first-of-type{opacity:1;rotate:0deg}&:last-of-type{opacity:0;rotate:-30deg}}.viraui__disclosure-module__Panel_U6Kba{block-size:var(--collapsible-panel-height);overflow:hidden;transition:block-size var(--duration-fast) var(--easing-standard);&[data-ending-style],&[data-starting-style]{block-size:0}@media (prefers-reduced-motion:reduce){transition:none}}}

package/dist/components/disclosure/disclosure.d.ts

@@ -0,0 +1,25 @@
+import { CollapsibleRoot } from '@base-ui/react/collapsible';
+import { DisclosurePanelProps } from './disclosure-panel';
+import { DisclosureTriggerProps } from './disclosure-trigger';
+import type * as React from 'react';
+/**
+ * Public Disclosure root props.
+ *
+ * Base UI Collapsible Root pass-through (`open`, `defaultOpen`, `onOpenChange`, `disabled`, …).
+ * Compose with `Disclosure.Trigger` and `Disclosure.Panel`.
+ *
+ * @defaultValue Base UI pass-through props keep upstream defaults.
+ */
+export type DisclosureProps = CollapsibleRoot.Props;
+type DisclosureComponent = React.FC<DisclosureProps> & {
+    Trigger: React.FC<DisclosureTriggerProps>;
+    Panel: React.FC<DisclosurePanelProps>;
+};
+/**
+ * Single-section expand/collapse compound wrapping Base UI Collapsible.
+ *
+ * Use Accordion for multi-item lists. Default Trigger is Surface with
+ * `render` → Collapsible Trigger; Panel is a height motion shell without padding.
+ */
+export declare const Disclosure: DisclosureComponent;
+export {};

package/dist/components/disclosure/disclosure.js

@@ -0,0 +1,30 @@
+"use client";
+import './disclosure.css';
+import { clsx } from "../../core/clsx.js";
+import { Stack } from "../stack/stack.js";
+import disclosure_module_default from "./disclosure.module.js";
+import { DisclosurePanel } from "./disclosure-panel.js";
+import { DisclosureTrigger } from "./disclosure-trigger.js";
+import { jsx } from "react/jsx-runtime";
+import { Collapsible } from "@base-ui/react/collapsible";
+//#region src/components/disclosure/disclosure.tsx
+var DisclosureRoot = ({ children, className, ...otherProps }) => /* @__PURE__ */ jsx(Collapsible.Root, {
+	render: /* @__PURE__ */ jsx(Stack, {
+		fullWidth: true,
+		className: clsx(disclosure_module_default.Disclosure, className)
+	}),
+	...otherProps,
+	children
+});
+/**
+* Single-section expand/collapse compound wrapping Base UI Collapsible.
+*
+* Use Accordion for multi-item lists. Default Trigger is Surface with
+* `render` → Collapsible Trigger; Panel is a height motion shell without padding.
+*/
+var Disclosure = Object.assign(DisclosureRoot, {
+	Trigger: DisclosureTrigger,
+	Panel: DisclosurePanel
+});
+//#endregion
+export { Disclosure };

package/dist/components/disclosure/disclosure.module.js

@@ -0,0 +1,15 @@
+//#region src/components/disclosure/disclosure.module.css
+var Disclosure = "viraui__disclosure-module__Disclosure_C0zl-";
+var Trigger = "viraui__disclosure-module__Trigger_hTIkR";
+var IconSlot = "viraui__disclosure-module__IconSlot_8gEr5";
+var Icon = "viraui__disclosure-module__Icon_w8tYN";
+var Panel = "viraui__disclosure-module__Panel_U6Kba";
+var disclosure_module_default = {
+	Disclosure,
+	Trigger,
+	IconSlot,
+	Icon,
+	Panel
+};
+//#endregion
+export { Disclosure, Icon, IconSlot, Panel, Trigger, disclosure_module_default as default };

package/dist/components/disclosure/index.d.ts

@@ -0,0 +1,4 @@
+export { Disclosure } from './disclosure';
+export type { DisclosureProps } from './disclosure';
+export type { DisclosureTriggerProps } from './disclosure-trigger';
+export type { DisclosurePanelProps } from './disclosure-panel';

package/dist/components/elevator/elevator.d.ts

@@ -8,43 +8,43 @@ export { getElevationProps } from '../../core/elevation/get-elevation-props';
  *
  * Applies preflight elevation hooks to each valid element child. Invalid nodes pass through unchanged.
  *
- * @default Native child pass-through props are preserved and merged with elevation hooks.
+ * @defaultValue Native child pass-through props are preserved and merged with elevation hooks.
  */
 export type ElevatorProps = {
     /**
      * Element or elements that receive elevation hooks on their rendered root.
      *
-     * @default No default. Consumers must provide at least one child.
+     * @defaultValue No default. Consumers must provide at least one child.
      */
     children: React.ReactNode;
     /**
      * Resting elevation level mapped to `data-elevation`.
      *
-     * @default No default. Consumers must provide a resting level.
+     * @defaultValue No default. Consumers must provide a resting level.
      */
     resting: ElevationLevel;
     /**
      * Hover elevation level mapped to `data-elevation-hover`.
      *
-     * @default No hover elevation override.
+     * @defaultValue No hover elevation override.
      */
     hover?: ElevationLevel;
     /**
      * Shadow cast direction mapped to `data-elevation-direction`.
      *
-     * @default 'bottom'
+     * @defaultValue 'bottom'
      */
     direction?: ElevationDirection;
     /**
      * Shadow color mapped to the `--shadow-color` custom property.
      *
-     * @default 'oklch(0% 0 0)'
+     * @defaultValue 'oklch(0% 0 0)'
      */
     shadowColor?: ElevationShadowColor;
     /**
      * Additional shadow layer mapped to the `--extra-shadow` custom property.
      *
-     * @default Preflight transparent hairline from `elevations.css`.
+     * @defaultValue Preflight transparent hairline from `elevations.css`.
      */
     extraShadow?: string;
 };

package/dist/components/fieldset/fieldset.d.ts

@@ -7,27 +7,27 @@ import type * as React from 'react';
  * legend typography and optional group helper copy. Pass `render` to merge the fieldset
  * root with `RadioGroup`, `CheckboxGroup`, or another compatible root.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type FieldsetProps = FieldsetRoot.Props & {
     /**
      * Visible legend copy rendered with shared internal `FieldLabel`.
      *
-     * @default No legend is rendered.
+     * @defaultValue No legend is rendered.
      */
     label?: React.ReactNode;
     /**
      * Group helper copy rendered below the legend while valid.
      * Requires a `Field.Root` ancestor for `FieldHelperCopy`.
      *
-     * @default No description is rendered.
+     * @defaultValue No description is rendered.
      */
     description?: React.ReactNode;
     /**
      * Group error copy rendered below the legend when invalid.
      * Requires a `Field.Root` ancestor.
      *
-     * @default No static error copy is rendered.
+     * @defaultValue No static error copy is rendered.
      */
     error?: React.ReactNode;
 };

package/dist/components/fit-text/fit-text.d.ts

@@ -5,13 +5,13 @@ import type * as React from 'react';
  * Includes standard `div` attributes such as `children`, `id`, `className`, and event handlers,
  * plus an optional fitted font-size cap.
  *
- * @default Native div pass-through props keep React defaults.
+ * @defaultValue Native div pass-through props keep React defaults.
  */
 export type FitTextProps = React.ComponentPropsWithRef<'div'> & {
     /**
      * Caps the fitted font size using any valid CSS length string.
      *
-     * @default No maximum — fitted size may grow without an upper bound.
+     * @defaultValue No maximum — fitted size may grow without an upper bound.
      */
     maxFontSize?: string;
 };

package/dist/components/glow/glow.d.ts

@@ -6,69 +6,69 @@ import type * as React from 'react';
  * Glow root is a transparent Surface shell that exposes only `radius` (token, per-corner
  * tuple, or `auto`). Put the visual card as children (typically `Surface` with `radius="auto"`).
  *
- * @default Glow-owned props use the defaults below; `radius` keeps Surface defaults when omitted.
+ * @defaultValue Glow-owned props use the defaults below; `radius` keeps Surface defaults when omitted.
  */
 export type GlowProps = React.ComponentProps<'div'> & Pick<SurfaceProps, 'radius'> & {
     /**
      * Distance from the surface edge where the glow becomes fully active.
      *
-     * @default 170
+     * @defaultValue 170
      */
     proximity?: number;
     /**
      * Angular width of the highlighted arc (degrees, used as a unitless CSS number).
      *
-     * @default 250
+     * @defaultValue 250
      */
     spread?: number;
     /**
      * Resting opacity of the glow when the pointer is outside proximity.
      *
-     * @default 0
+     * @defaultValue 0
      */
     opacity?: number;
     /**
      * Shrinks the root to fit its content (`max-width: fit-content`).
      *
-     * @default false
+     * @defaultValue false
      */
     fitContent?: boolean;
     /**
      * Width of the masked glow border ring.
      *
-     * @default 2
+     * @defaultValue 2
      */
     borderWidth?: number;
     /**
      * Color of the masked border ring under the highlight.
      *
-     * @default var(--global-contrast)
+     * @defaultValue var(--global-contrast)
      */
     borderColor?: string;
     /**
      * Offset of the glow ring from the surface edge. Negative values place the ring outside.
      *
-     * @default 5
+     * @defaultValue 5
      */
     borderOffset?: number;
     /**
      * Overrides the glow gradient with a solid color or custom background value.
      * Ignored when `rainbowColors` is true.
      *
-     * @default Theme highlight conic gradient
+     * @defaultValue Theme highlight conic gradient
      */
     glowColor?: string;
     /**
      * Shares the highlight gradient across cards via `background-attachment: fixed`.
      * Forced off when `rainbowColors` is true.
      *
-     * @default true
+     * @defaultValue true
      */
     globalHighlight?: boolean;
     /**
      * Uses the multi-stop rainbow highlight gradient and disables global highlight attachment.
      *
-     * @default false
+     * @defaultValue false
      */
     rainbowColors?: boolean;
     /**
@@ -76,7 +76,7 @@ export type GlowProps = React.ComponentProps<'div'> & Pick<SurfaceProps, 'radius
      * set `0` for instant snap. Tracker writes an unwrapped continuous angle so the
      * transition does not take the long way across the 0° seam.
      *
-     * @default 80
+     * @defaultValue 80
      */
     angleLag?: number;
 };

package/dist/components/grid/grid-item.d.ts

@@ -7,45 +7,45 @@ type GridItemSubgrid = boolean | 'column' | 'row';
  * Includes standard `div` attributes such as `id`, `role`, `title`, and event handlers,
  * plus placement controls and Base UI `render` support for replacing the item root.
  *
- * @default Base UI pass-through props keep upstream defaults.
+ * @defaultValue Base UI pass-through props keep upstream defaults.
  */
 export type GridItemProps = React.ComponentPropsWithoutRef<'div'> & {
     /**
      * Replaces the default `div` root using Base UI render semantics.
      *
-     * @default The item renders a `div` root.
+     * @defaultValue The item renders a `div` root.
      */
     render?: useRender.RenderProp;
     /**
      * Ref forwarded to the rendered item root element.
      *
-     * @default No ref is attached.
+     * @defaultValue No ref is attached.
      */
     ref?: React.Ref<HTMLElement>;
     /**
      * Spans the item across every column track (`grid-column: 1 / -1`).
      * Wins over `column` when both are set.
      *
-     * @default false
+     * @defaultValue false
      */
     fullWidth?: boolean;
     /**
      * Spans the item across every row track (`grid-row: 1 / -1`).
      * Wins over `row` when both are set.
      *
-     * @default false
+     * @defaultValue false
      */
     fullHeight?: boolean;
     /**
      * Sets explicit `grid-column` placement via `--vui-grid-item-column`.
      *
-     * @default No explicit column placement.
+     * @defaultValue No explicit column placement.
      */
     column?: React.CSSProperties['gridColumn'];
     /**
      * Sets explicit `grid-row` placement via `--vui-grid-item-row`.
      *
-     * @default No explicit row placement.
+     * @defaultValue No explicit row placement.
      */
     row?: React.CSSProperties['gridRow'];
     /**
@@ -54,7 +54,7 @@ export type GridItemProps = React.ComponentPropsWithoutRef<'div'> & {
      * Pass `true` for both axes, or `'column'` / `'row'` for one axis.
      * Pair with `fullWidth` / `fullHeight` or a `column` / `row` span so the item covers the tracks to inherit.
      *
-     * @default false
+     * @defaultValue false
      */
     subgrid?: GridItemSubgrid;
 };