@viraui/react 1.0.9 → 1.0.11

package/dist/components/meter/meter.js

@@ -1,6 +1,5 @@
 import './meter.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { Text } from "../text/text.js";
 import { FieldLabel } from "../basic-input/field-label.js";
 import { Stack } from "../stack/stack.js";
@@ -8,52 +7,48 @@ import meter_module_default from "./meter.module.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Meter } from "@base-ui/react";
 //#region src/components/meter/meter.tsx
-var Meter$1 = ({ className, description, label, showValue = false, value, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
-	return /* @__PURE__ */ jsxs(Meter.Root, {
-		...componentProps,
-		...intrinsicAttributes,
-		className: clsx(meter_module_default.Meter, className),
-		value,
-		render: /* @__PURE__ */ jsx(Stack, {
-			direction: "column",
+var Meter$1 = ({ className, description, label, showValue = false, value, ...otherProps }) => /* @__PURE__ */ jsxs(Meter.Root, {
+	...otherProps,
+	className: clsx(meter_module_default.Meter, className),
+	value,
+	render: /* @__PURE__ */ jsx(Stack, {
+		direction: "column",
+		fillChildren: false,
+		rowGap: "small",
+		columnGap: "x-small"
+	}),
+	children: [
+		(label || showValue) && /* @__PURE__ */ jsxs(Stack, {
+			direction: "row",
 			fillChildren: false,
-			rowGap: "small",
-			columnGap: "x-small"
-		}),
-		children: [
-			(label || showValue) && /* @__PURE__ */ jsxs(Stack, {
-				direction: "row",
-				fillChildren: false,
-				columnGap: "small",
-				vAlign: "center",
-				hAlign: "space-between",
-				children: [label && /* @__PURE__ */ jsx(Meter.Label, {
-					render: /* @__PURE__ */ jsx(FieldLabel, {}),
-					children: label
-				}), showValue && /* @__PURE__ */ jsx(Text, {
-					size: "small",
-					tone: "muted",
-					family: "mono",
-					whiteSpace: "nowrap",
-					selection: false,
-					align: "end",
-					shrink: false,
-					render: /* @__PURE__ */ jsx(Meter.Value, { render: /* @__PURE__ */ jsx("output", {}) })
-				})]
-			}),
-			/* @__PURE__ */ jsx(Meter.Track, {
-				className: meter_module_default.Track,
-				children: /* @__PURE__ */ jsx(Meter.Indicator, { className: meter_module_default.Indicator })
-			}),
-			description && /* @__PURE__ */ jsx(Text, {
-				className: meter_module_default.Description,
+			columnGap: "small",
+			vAlign: "center",
+			hAlign: "space-between",
+			children: [label && /* @__PURE__ */ jsx(Meter.Label, {
+				render: /* @__PURE__ */ jsx(FieldLabel, {}),
+				children: label
+			}), showValue && /* @__PURE__ */ jsx(Text, {
 				size: "small",
 				tone: "muted",
-				children: description
-			})
-		]
-	});
-};
+				family: "mono",
+				whiteSpace: "nowrap",
+				selection: false,
+				align: "end",
+				"data-shrink": "false",
+				render: /* @__PURE__ */ jsx(Meter.Value, { render: /* @__PURE__ */ jsx("output", {}) })
+			})]
+		}),
+		/* @__PURE__ */ jsx(Meter.Track, {
+			className: meter_module_default.Track,
+			children: /* @__PURE__ */ jsx(Meter.Indicator, { className: meter_module_default.Indicator })
+		}),
+		description && /* @__PURE__ */ jsx(Text, {
+			className: meter_module_default.Description,
+			size: "small",
+			tone: "muted",
+			children: description
+		})
+	]
+});
 //#endregion
 export { Meter$1 as Meter };

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

@@ -25,7 +25,7 @@ var PopoverSheet = ({ unstyled, title, description, children, showCloseButton =
 			color: 1,
 			border: "all",
 			radius: "large",
-			vibrant: true,
+			"data-vibrant": "",
 			render: /* @__PURE__ */ jsx(Stack, {
 				rowGap: "medium",
 				fillChildren: false

package/dist/components/progressive-blur/progressive-blur.d.ts

@@ -1,4 +1,3 @@
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import { ProgressiveBlurDirection, ProgressiveBlurEasing } from './progressive-blur.utils';
 import type * as React from 'react';
 /**
@@ -9,7 +8,7 @@ import type * as React from 'react';
  *
  * @default Native div pass-through props keep React defaults.
  */
-export type ProgressiveBlurProps = React.ComponentPropsWithRef<'div'> & IntrinsicViraProps & {
+export type ProgressiveBlurProps = React.ComponentPropsWithRef<'div'> & {
     /**
      * Sets the maximum blur radius applied to the first layer at the selected edge.
      *

package/dist/components/progressive-blur/progressive-blur.js

@@ -1,12 +1,10 @@
 import './progressive-blur.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import progressive_blur_module_default from "./progressive-blur.module.js";
 import { formatProgressiveBlurMaskGradient, getProgressiveBlurFactor, getProgressiveBlurMaskStops, resolveProgressiveBlurSteps } from "./progressive-blur.utils.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/progressive-blur/progressive-blur.tsx
 var ProgressiveBlur = ({ blur = "16px", className, direction = "bottom", easing = "exponential", ref, steps, style, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const resolvedSteps = resolveProgressiveBlurSteps(steps, easing);
 	const dynamicStyle = {
 		"--vui-progressive-blur-amount": blur,
@@ -25,8 +23,7 @@ var ProgressiveBlur = ({ blur = "16px", className, direction = "bottom", easing
 		}, layerIndex);
 	});
 	return /* @__PURE__ */ jsx("div", {
-		...componentProps,
-		...intrinsicAttributes,
+		...otherProps,
 		ref,
 		"aria-hidden": "true",
 		className: clsx(progressive_blur_module_default.ProgressiveBlur, className),

package/dist/components/progressive-blur/progressive-blur.utils.js

@@ -12,13 +12,10 @@ var resolveProgressiveBlurSteps = (steps, easing) => {
 var getProgressiveBlurFactor = (easing, layerIndex, totalSteps) => {
 	if (easing === "exponential") return .5 ** layerIndex;
 	const progress = layerIndex / (totalSteps - 1);
-	switch (easing) {
-		case "linear": return 1 - progress;
-		case "ease-in": return 1 - progress * progress;
-		case "ease-out": return 1 - (1 - (1 - progress) ** 2);
-		case "ease-in-out": return 1 - (progress < .5 ? 2 * progress * progress : 1 - (-2 * progress + 2) ** 2 / 2);
-		default: return 1 - progress;
-	}
+	if (easing === "linear") return 1 - progress;
+	if (easing === "ease-in") return 1 - progress * progress;
+	if (easing === "ease-out") return 1 - (1 - (1 - progress) ** 2);
+	return 1 - (progress < .5 ? 2 * progress * progress : 1 - (-2 * progress + 2) ** 2 / 2);
 };
 var getProgressiveBlurMaskStops = (layerIndex, totalSteps) => {
 	const increment = 100 / totalSteps;

package/dist/components/select/select-indicator-slot.js

@@ -7,7 +7,7 @@ var indicatorStackRender = /* @__PURE__ */ jsx(Stack, {
 	fillChildren: false,
 	hAlign: "center",
 	inline: true,
-	shrink: false,
+	"data-shrink": "false",
 	vAlign: "center"
 });
 function SelectIndicatorSlot({ children, interactive = false }) {
@@ -21,11 +21,11 @@ function SelectIndicatorSlot({ children, interactive = false }) {
 	return /* @__PURE__ */ jsx(Stack, {
 		"aria-hidden": true,
 		className: select_module_default.Indicator,
-		grow: false,
+		"data-grow": "false",
 		fillChildren: false,
 		hAlign: "center",
 		inline: true,
-		shrink: false,
+		"data-shrink": "false",
 		vAlign: "center"
 	});
 }

package/dist/components/select/select-option.js

@@ -31,8 +31,8 @@ function SelectOption({ addon, addonAlign = "center", children, className, disab
 				children: [addon && /* @__PURE__ */ jsx(Stack, {
 					vPadding: "2x-small",
 					"aria-hidden": "true",
-					grow: false,
-					shrink: false,
+					"data-grow": "false",
+					"data-shrink": "false",
 					children: addon
 				}), /* @__PURE__ */ jsx(Text, {
 					lineHeight: "small",

package/dist/components/select/select.d.ts

@@ -1,6 +1,5 @@
 import { FieldRoot } from '@base-ui/react/field';
 import { SelectRoot } from '@base-ui/react/select';
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import { SelectGroup } from './select-group';
 import { SelectOption } from './select-option';
 import { SelectSeparator } from './select-separator';
@@ -14,7 +13,7 @@ import type * as React from 'react';
  *
  * @default Base UI pass-through props keep upstream defaults.
  */
-export type SelectProps = SelectRoot.Props<string> & Omit<FieldRoot.Props, 'ref'> & IntrinsicViraProps & {
+export type SelectProps = SelectRoot.Props<string> & Omit<FieldRoot.Props, 'ref'> & {
     /**
      * Visible label rendered with shared internal `FieldLabel`.
      *

package/dist/components/select/select.js

@@ -2,7 +2,6 @@
 import './select.css';
 import { clsx } from "../../core/clsx.js";
 import { ChromeChevronDown, ChromeChevronExpandY, ChromeChevronUp } from "../../internal/chrome-icons/chrome-icons.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { Text } from "../text/text.js";
 import { FieldHelperCopy } from "../basic-input/field-helper-copy.js";
 import { FieldLabel } from "../basic-input/field-label.js";
@@ -20,15 +19,13 @@ import { Field } from "@base-ui/react/field";
 import { Select } from "@base-ui/react/select";
 //#region src/components/select/select.tsx
 function SelectRootComponent({ alignListWithTrigger = true, children, className, description, dirty, disabled, error, addon = /* @__PURE__ */ jsx(ChromeChevronExpandY, { size: 16 }), invalid, label, name, placeholder, ref, touched, validate, validationDebounceTime, validationMode, ...selectRootProps }) {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(selectRootProps);
-	const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...restSelectProps } = componentProps;
+	const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...restSelectProps } = selectRootProps;
 	const fieldLabelId = useId();
 	const listAccessibleNameProps = {};
 	if (ariaLabel !== void 0) listAccessibleNameProps["aria-label"] = ariaLabel;
 	else if (ariaLabelledBy !== void 0) listAccessibleNameProps["aria-labelledby"] = ariaLabelledBy;
 	else if (label !== void 0) listAccessibleNameProps["aria-labelledby"] = fieldLabelId;
 	return /* @__PURE__ */ jsxs(Field.Root, {
-		...intrinsicAttributes,
 		className: clsx(select_module_default.Select, className),
 		dirty,
 		disabled,
@@ -78,7 +75,7 @@ function SelectRootComponent({ alignListWithTrigger = true, children, className,
 							hAlign: "center",
 							hPadding: "x-small",
 							inline: true,
-							shrink: false,
+							"data-shrink": "false",
 							vAlign: "center"
 						}),
 						children: addon
@@ -118,7 +115,7 @@ function SelectRootComponent({ alignListWithTrigger = true, children, className,
 										overflow: "auto",
 										radius: "medium",
 										vPadding: "x-small",
-										vibrant: true
+										"data-vibrant": ""
 									}),
 									children
 								})

package/dist/components/separator/separator.d.ts

@@ -1,5 +1,4 @@
 import { useRender } from '@base-ui/react/use-render';
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import { ThemeTypes } from '@viraui/foundation/vira/types';
 import type * as React from 'react';
 type SeparatorAxisPadding = ThemeTypes['space'] | [ThemeTypes['space'] | 0, ThemeTypes['space'] | 0];
@@ -12,7 +11,7 @@ type SeparatorSize = 'small' | 'medium' | 'large';
  *
  * @default Native hr pass-through props keep React defaults.
  */
-export type SeparatorProps = Omit<React.ComponentPropsWithoutRef<'hr'>, 'size'> & IntrinsicViraProps & {
+export type SeparatorProps = Omit<React.ComponentPropsWithoutRef<'hr'>, 'size'> & {
     /**
      * Replaces the default `hr` line root using Base UI render semantics.
      *

package/dist/components/separator/separator.js

@@ -1,6 +1,5 @@
 import './separator.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { Stack } from "../stack/stack.js";
 import separator_module_default from "./separator.module.js";
 import { jsx } from "react/jsx-runtime";
@@ -12,7 +11,6 @@ var separatorSizeValues = {
 	large: 3
 };
 var Separator = ({ className, hPadding, orientation = "horizontal", ref, render, size = "small", style, vPadding, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const dynamicStyle = {
 		"--vui-separator-size": `${separatorSizeValues[size]}px`,
 		...style
@@ -22,7 +20,7 @@ var Separator = ({ className, hPadding, orientation = "horizontal", ref, render,
 		render,
 		ref,
 		props: {
-			...componentProps,
+			...otherProps,
 			"data-separator-orientation": orientation,
 			"aria-orientation": orientation,
 			className: clsx(separator_module_default.Line, className),
@@ -35,7 +33,6 @@ var Separator = ({ className, hPadding, orientation = "horizontal", ref, render,
 		hPadding,
 		vAlign: orientation === "vertical" ? "stretch" : "initial",
 		vPadding,
-		...intrinsicAttributes,
 		children: line
 	});
 };

package/dist/components/shimmer/shimmer.d.ts

@@ -1,4 +1,3 @@
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import type * as React from 'react';
 /**
  * Public Shimmer props.
@@ -8,7 +7,7 @@ import type * as React from 'react';
  *
  * @default Native span pass-through props keep React defaults.
  */
-export type ShimmerProps = React.ComponentPropsWithoutRef<'span'> & IntrinsicViraProps & {
+export type ShimmerProps = React.ComponentPropsWithoutRef<'span'> & {
     /**
      * Sets the shimmer sweep duration using any valid CSS time string.
      *

package/dist/components/shimmer/shimmer.js

@@ -1,11 +1,9 @@
 import './shimmer.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import shimmer_module_default from "./shimmer.module.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/shimmer/shimmer.tsx
 var Shimmer = ({ angle, className, duration, highlightColor, ref, spread, style, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const dynamicStyle = {
 		...duration && { "--vui-shimmer-duration": duration },
 		...spread && { "--vui-shimmer-spread": spread },
@@ -14,8 +12,7 @@ var Shimmer = ({ angle, className, duration, highlightColor, ref, spread, style,
 		...style
 	};
 	return /* @__PURE__ */ jsx("span", {
-		...componentProps,
-		...intrinsicAttributes,
+		...otherProps,
 		ref,
 		className: clsx(shimmer_module_default.Shimmer, className),
 		style: dynamicStyle

package/dist/components/skeleton/skeleton.d.ts

@@ -1,5 +1,4 @@
 import { ThemeTypes } from '@viraui/foundation/vira/types';
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import type * as React from 'react';
 /**
  * Public Skeleton props.
@@ -9,7 +8,7 @@ import type * as React from 'react';
  *
  * @default Native span pass-through props keep React defaults.
  */
-export type SkeletonProps = React.ComponentPropsWithoutRef<'span'> & IntrinsicViraProps & {
+export type SkeletonProps = React.ComponentPropsWithoutRef<'span'> & {
     /**
      * Sets the skeleton inline size using any valid CSS size string.
      *

package/dist/components/skeleton/skeleton.js

@@ -1,12 +1,10 @@
 import './skeleton.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { resolveThemeValue } from "../../core/theme/resolve-theme-value.js";
 import skeleton_module_default from "./skeleton.module.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/skeleton/skeleton.tsx
 var Skeleton = ({ className, height, minHeight, minWidth, radius, ref, style, width, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const dynamicStyle = {
 		...radius != null && { "--vui-skeleton-border-radius": resolveThemeValue(radius, "radius", "var(--radius-small)") },
 		...width && { "--vui-skeleton-inline-size": width },
@@ -16,8 +14,7 @@ var Skeleton = ({ className, height, minHeight, minWidth, radius, ref, style, wi
 		...style
 	};
 	return /* @__PURE__ */ jsx("span", {
-		...componentProps,
-		...intrinsicAttributes,
+		...otherProps,
 		ref,
 		"aria-hidden": "true",
 		className: clsx(skeleton_module_default.Skeleton, className),

package/dist/components/slider/slider.d.ts

@@ -1,6 +1,5 @@
 import { FieldRoot } from '@base-ui/react/field';
 import { SliderRoot } from '@base-ui/react/slider';
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import type * as React from 'react';
 /**
  * Public Slider props.
@@ -11,18 +10,6 @@ import type * as React from 'react';
  * @default Base UI pass-through props keep upstream defaults.
  */
 export type SliderProps = SliderRoot.Props & FieldRoot.Props & {
-    /**
-     * Adds `data-grow="false"` to the field root when false.
-     *
-     * @default The field root does not render a grow attribute.
-     */
-    grow?: IntrinsicViraProps['grow'];
-    /**
-     * Adds `data-shrink="false"` to the field root when false.
-     *
-     * @default The field root does not render a shrink attribute.
-     */
-    shrink?: IntrinsicViraProps['shrink'];
     /**
      * Visible label rendered with shared internal `FieldLabel`.
      *

package/dist/components/slider/slider.js

@@ -1,6 +1,5 @@
 import './slider.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { Text } from "../text/text.js";
 import { FieldHelperCopy } from "../basic-input/field-helper-copy.js";
 import { FieldLabel } from "../basic-input/field-label.js";
@@ -15,9 +14,7 @@ import { Slider } from "@base-ui/react/slider";
 var Slider$1 = ({ className, defaultValue, description, dirty, disabled, error, invalid, label, name, orientation = "horizontal", showValue = false, thumbAriaLabel, touched, validate, validationDebounceTime, validationMode, value, ref, ...sliderRootProps }) => {
 	const isRange = isRangeSlider(value, defaultValue);
 	const isVertical = orientation === "vertical";
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(sliderRootProps);
 	return /* @__PURE__ */ jsxs(Field.Root, {
-		...intrinsicAttributes,
 		className: slider_module_default.Slider,
 		dirty,
 		disabled,
@@ -33,7 +30,7 @@ var Slider$1 = ({ className, defaultValue, description, dirty, disabled, error,
 			rowGap: "small"
 		}),
 		children: [/* @__PURE__ */ jsxs(Slider.Root, {
-			...componentProps,
+			...sliderRootProps,
 			ref,
 			className: clsx(slider_module_default.SliderRoot, className),
 			defaultValue,

package/dist/components/spinner/spinner.d.ts

@@ -1,5 +1,4 @@
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
-export type SpinnerProps = Omit<React.ComponentProps<'svg'>, 'color'> & IntrinsicViraProps & {
+export type SpinnerProps = Omit<React.ComponentProps<'svg'>, 'color'> & {
     /**
      * Sets the rendered spinner size.
      *

package/dist/components/spinner/spinner.js

@@ -1,31 +1,26 @@
 import './spinner.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import spinner_module_default from "./spinner.module.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/spinner/spinner.tsx
-var Spinner = ({ className, color, size = "big", ref, style, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
-	return /* @__PURE__ */ jsx("svg", {
-		...componentProps,
-		...intrinsicAttributes,
-		ref,
-		className: clsx(spinner_module_default.Spinner, className),
-		"data-dimension": size,
-		viewBox: "0 0 16 16",
-		xmlns: "http://www.w3.org/2000/svg",
-		color,
-		style,
-		children: /* @__PURE__ */ jsxs("g", {
-			className: spinner_module_default.Glyph,
-			fill: "currentColor",
-			children: [
-				/* @__PURE__ */ jsx("path", { d: "M0 2h2v12H0z" }),
-				/* @__PURE__ */ jsx("path", { d: "M7 2h2v12H7z" }),
-				/* @__PURE__ */ jsx("path", { d: "M14 2h2v12h-2z" })
-			]
-		})
-	});
-};
+var Spinner = ({ className, color, size = "big", ref, style, ...otherProps }) => /* @__PURE__ */ jsx("svg", {
+	...otherProps,
+	ref,
+	className: clsx(spinner_module_default.Spinner, className),
+	"data-dimension": size,
+	viewBox: "0 0 16 16",
+	xmlns: "http://www.w3.org/2000/svg",
+	color,
+	style,
+	children: /* @__PURE__ */ jsxs("g", {
+		className: spinner_module_default.Glyph,
+		fill: "currentColor",
+		children: [
+			/* @__PURE__ */ jsx("path", { d: "M0 2h2v12H0z" }),
+			/* @__PURE__ */ jsx("path", { d: "M7 2h2v12H7z" }),
+			/* @__PURE__ */ jsx("path", { d: "M14 2h2v12h-2z" })
+		]
+	})
+});
 //#endregion
 export { Spinner };

package/dist/components/stack/stack.d.ts

@@ -1,5 +1,4 @@
 import { useRender } from '@base-ui/react/use-render';
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import { ThemeTypes } from '@viraui/foundation/vira/types';
 import type * as React from 'react';
 type StackAlignment = 'start' | 'center' | 'end' | 'stretch' | 'initial' | 'space-between' | 'space-around' | 'space-evenly';
@@ -13,7 +12,7 @@ type StackAxisPadding = StackSpace | [StackSpace | 0, StackSpace | 0];
  *
  * @default Base UI pass-through props keep upstream defaults.
  */
-export type StackProps = React.ComponentPropsWithoutRef<'div'> & IntrinsicViraProps & {
+export type StackProps = React.ComponentPropsWithoutRef<'div'> & {
     /**
      * Replaces the default `div` root using Base UI render semantics.
      *

package/dist/components/stack/stack.js

@@ -1,6 +1,5 @@
 import './stack.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { resolveThemeValue } from "../../core/theme/resolve-theme-value.js";
 import { resolveAxisPadding } from "../../core/styles/resolve-axis-padding.js";
 import stack_module_default from "./stack.module.js";
@@ -8,7 +7,6 @@ import { useRender } from "@base-ui/react/use-render";
 //#region src/components/stack/stack.tsx
 var Stack = ({ className, direction = "column", fillChildren = true, hAlign = "initial", hPadding, inline = false, maxWidth, minWidth, ref, render, rowGap, columnGap, style, vAlign = "initial", vPadding, wrap = false, ...otherProps }) => {
 	const hasPadding = Boolean(hPadding || vPadding);
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const dynamicStyle = {
 		"--vui-stack-row-gap": resolveThemeValue(rowGap, "space", 0),
 		"--vui-stack-column-gap": resolveThemeValue(columnGap, "space", 0),
@@ -25,8 +23,7 @@ var Stack = ({ className, direction = "column", fillChildren = true, hAlign = "i
 		render,
 		ref,
 		props: {
-			...componentProps,
-			...intrinsicAttributes,
+			...otherProps,
 			"data-stack-direction": direction,
 			"data-stack-inline": inline ? "true" : "false",
 			"data-stack-wrap": wrap ? "true" : "false",

package/dist/components/static-noise/static-noise.d.ts

@@ -1,4 +1,3 @@
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import type * as React from 'react';
 /**
  * Public StaticNoise props.
@@ -8,7 +7,7 @@ import type * as React from 'react';
  *
  * @default Native figure pass-through props keep React defaults.
  */
-export type StaticNoiseProps = React.ComponentPropsWithRef<'figure'> & IntrinsicViraProps & {
+export type StaticNoiseProps = React.ComponentPropsWithRef<'figure'> & {
     /**
      * Sets the SVG turbulence `baseFrequency` for the internal noise filter.
      *

package/dist/components/static-noise/static-noise.js

@@ -1,14 +1,12 @@
 "use client";
 import './static-noise.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import static_noise_module_default from "./static-noise.module.js";
 import { jsx } from "react/jsx-runtime";
 import { useId } from "react";
 //#region src/components/static-noise/static-noise.tsx
 var STATIC_NOISE_SEED_FRAMES = "1;5;2;9;3;7;4;11;6;13;8;15;10;17;12;19;14;16;18;20;3;8;1;13";
 var StaticNoise = ({ animate = false, baseFrequency = .5, className, mixBlendMode = "difference", opacity = .2, ref, style, ...otherProps }) => {
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const reactId = useId();
 	const dynamicStyle = {
 		filter: `url(#${reactId}) grayscale(100%)`,
@@ -17,8 +15,7 @@ var StaticNoise = ({ animate = false, baseFrequency = .5, className, mixBlendMod
 		...style
 	};
 	return /* @__PURE__ */ jsx("figure", {
-		...componentProps,
-		...intrinsicAttributes,
+		...otherProps,
 		ref,
 		"aria-hidden": "true",
 		className: clsx(static_noise_module_default.StaticNoise, className),

package/dist/components/surface/surface.d.ts

@@ -1,5 +1,4 @@
 import { useRender } from '@base-ui/react/use-render';
-import { IntrinsicViraProps } from '../../core/props/intrinsic-vira-props';
 import { SurfacePadding, SurfaceRadiusInput } from './surface-radius-context';
 import type * as React from 'react';
 /** Base ramp layer for nested surfaces; clamped to 1–3 at runtime. */
@@ -13,7 +12,7 @@ type SurfaceColor = string | SurfaceBaseLevel;
  *
  * @default Base UI pass-through props keep upstream defaults.
  */
-export type SurfaceProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> & IntrinsicViraProps & {
+export type SurfaceProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> & {
     /**
      * Replaces the default `div` root using Base UI render semantics.
      *

package/dist/components/surface/surface.js

@@ -1,7 +1,6 @@
 "use client";
 import './surface.css';
 import { clsx } from "../../core/clsx.js";
-import { extractIntrinsicViraProps } from "../../core/props/intrinsic-vira-props.js";
 import { resolveAxisPadding } from "../../core/styles/resolve-axis-padding.js";
 import { SurfaceRadiusContext, useSurfaceRadius } from "./surface-radius-context.js";
 import surface_module_default from "./surface.module.js";
@@ -23,7 +22,6 @@ var surfaceDefaultRadiusProps = {
 var Surface = ({ border, borderStyle = "solid", className, color, hPadding, hoverColor, overflow, radius, ref, render, style, vPadding, ...otherProps }) => {
 	const hasPadding = Boolean(hPadding || vPadding);
 	const hasHoverColor = hoverColor !== void 0;
-	const { componentProps, intrinsicAttributes } = extractIntrinsicViraProps(otherProps);
 	const { contextValue, hasAutoRadius, radiusStyle } = useSurfaceRadius({
 		defaults: surfaceDefaultRadiusProps,
 		hPadding,
@@ -46,8 +44,7 @@ var Surface = ({ border, borderStyle = "solid", className, color, hPadding, hove
 		render,
 		ref,
 		props: {
-			...componentProps,
-			...intrinsicAttributes,
+			...otherProps,
 			...border && { "data-surface-border": border },
 			...hasAutoRadius && { "data-surface-radius": "auto" },
 			"data-surface-has-hover-color": hasHoverColor ? "true" : "false",