@arc-ui/components 12.0.0-beta.23 → 12.0.0-beta.24

package/lib/_shared/esm/{Text-CBlnm5CT.mjs → Text-BAzOkkzN.mjs}

@@ -1,8 +1,9 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import React__default, { useContext } from 'react';
 import { c as classNames } from './index-5C0-U8cc.mjs';
 import { s as suffixModifier } from './suffix-modifier-B_pO0UkF.mjs';
-import { C as Context } from './Surface-Colbp3Zx.mjs';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
+import { C as Context } from './Surface-C69KVzkY.mjs';
 
 /**
  * Use `Text` to display text.

package/lib/_shared/esm/{TextInput-Dk7qNGoh.mjs → TextInput-CjDG2cIX.mjs}

@@ -1,11 +1,12 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import React__default, { forwardRef, useContext, useState } from 'react';
 import { c as classNames } from './index-5C0-U8cc.mjs';
-import { u as useAriaDescribedby, F as FormControl } from './FormControl-CWyrVi1u.mjs';
-import { C as Context } from './Surface-Colbp3Zx.mjs';
-import { V as VisuallyHidden } from './VisuallyHidden-DqAgoqJo.mjs';
-import { T as ThemeIcon } from './ThemeIcon-CN_Ed5b1.mjs';
-import { S as Spinner } from './Spinner-Cd7LiPTy.mjs';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
+import { u as useAriaDescribedby, F as FormControl } from './FormControl-Pc1aHUNM.mjs';
+import { C as Context } from './Surface-C69KVzkY.mjs';
+import { V as VisuallyHidden } from './VisuallyHidden-aSQ4RA1o.mjs';
+import { T as ThemeIcon } from './ThemeIcon-B0SruPZC.mjs';
+import { S as Spinner } from './Spinner-DvngCIwx.mjs';
 
 /**
  * Infer the correct inputMode, pattern and type if specifying a `number` type.
@@ -46,8 +47,8 @@ var TextInputComponent = forwardRef(function (_a, ref) {
     });
     // Although this is used within FormControlWrapper, it's deterministic so we can call it here too
     var ariaDescribedby = useAriaDescribedby({
-        errorMessage: errorMessage,
         id: id,
+        errorMessage: errorMessage,
         helper: helper,
         disclosureText: disclosureText,
     }).ariaDescribedby;

package/lib/_shared/esm/{ThemeIcon-CN_Ed5b1.mjs → ThemeIcon-B0SruPZC.mjs}

@@ -1,8 +1,9 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import React__default, { useContext } from 'react';
 import { c as classNames } from './index-5C0-U8cc.mjs';
 import { s as suffixModifier } from './suffix-modifier-B_pO0UkF.mjs';
-import { C as Context } from './Surface-Colbp3Zx.mjs';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
+import { C as Context } from './Surface-C69KVzkY.mjs';
 
 var ThemeIcon = function (_a) {
     var _b;

package/lib/_shared/esm/{Tooltip-Dc82Ht7G.mjs → Tooltip-BpSzN3Tx.mjs}

@@ -1,5 +1,5 @@
 'use client';
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import * as React from 'react';
 import React__default from 'react';
 import { g as useEscapeKeydown, f as useCallbackRef, b as useLayoutEffect2, c as createContextScope$1, a as useId, u as useControllableState, e as useThemeElement } from './index-Bz2JQq34.mjs';
@@ -7,9 +7,10 @@ import * as ReactDOM from 'react-dom';
 import ReactDOM__default from 'react-dom';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { u as useSize, a as useFloating, b as autoUpdate, o as offset, s as shift, l as limitShift, f as flip, c as size, d as arrow, h as hide } from './index-CWHcEz3_.mjs';
-import { S as Surface } from './Surface-Colbp3Zx.mjs';
-import { I as Icon } from './Icon-CcPOJcQm.mjs';
-import { T as Text } from './Text-CBlnm5CT.mjs';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
+import { S as Surface } from './Surface-C69KVzkY.mjs';
+import { I as Icon } from './Icon-CCUbr_AO.mjs';
+import { T as Text } from './Text-BAzOkkzN.mjs';
 
 // packages/core/primitive/src/primitive.tsx
 function composeEventHandlers(originalEventHandler, ourEventHandler, { checkForDefaultPrevented = true } = {}) {
@@ -1327,12 +1328,12 @@ var Arrow2 = TooltipArrow;
 
 /** Use `Tooltip` to display information related to an element when the element receives keyboard focus or the mouse hovers over it */
 var Tooltip = function (_a) {
-    var children = _a.children, side = _a.side, sideOffset = _a.sideOffset, align = _a.align, alignContent = _a.alignContent, title = _a.title, supportingCopy = _a.supportingCopy, icon = _a.icon, _b = _a.maxWidth, maxWidth = _b === void 0 ? "450px" : _b, _c = _a.delayDuration, delayDuration = _c === void 0 ? 300 : _c, open = _a.open, onOpenChange = _a.onOpenChange, _d = _a.asChild, asChild = _d === void 0 ? false : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = __rest(_a, ["children", "side", "sideOffset", "align", "alignContent", "title", "supportingCopy", "icon", "maxWidth", "delayDuration", "open", "onOpenChange", "asChild", "zIndex"]);
+    var children = _a.children, side = _a.side, sideOffset = _a.sideOffset, align = _a.align, alignContent = _a.alignContent, title = _a.title, supportingCopy = _a.supportingCopy, icon = _a.icon, ariaLabel = _a.ariaLabel, _b = _a.maxWidth, maxWidth = _b === void 0 ? "450px" : _b, _c = _a.delayDuration, delayDuration = _c === void 0 ? 300 : _c, open = _a.open, onOpenChange = _a.onOpenChange, _d = _a.asChild, asChild = _d === void 0 ? false : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = __rest(_a, ["children", "side", "sideOffset", "align", "alignContent", "title", "supportingCopy", "icon", "ariaLabel", "maxWidth", "delayDuration", "open", "onOpenChange", "asChild", "zIndex"]);
     var _f = useThemeElement(), themeElement = _f[0], setThemeElement = _f[1];
     return (React__default.createElement("div", __assign({}, filterAttrs(props)),
         React__default.createElement(TooltipProvider, null,
             React__default.createElement(Root3, __assign({ delayDuration: delayDuration, open: open, onOpenChange: onOpenChange }, filterAttrs(props)),
-                React__default.createElement(Trigger, { asChild: asChild, className: "arc-Tooltip-trigger" }, children),
+                React__default.createElement(Trigger, { asChild: asChild, "aria-label": ariaLabel, className: "arc-Tooltip-trigger" }, children),
                 React__default.createElement("div", { ref: setThemeElement },
                     React__default.createElement(Portal, { container: themeElement },
                         React__default.createElement(Content2, __assign({ side: side, sideOffset: sideOffset, align: align, alignOffset: align === "start" ? -4 : align === "end" ? -4 : undefined, style: { zIndex: zIndex } }, props),

package/lib/_shared/esm/{VerticalSpace-Duhm0zXP.mjs → VerticalSpace-BLWB02I7.mjs}

@@ -1,13 +1,14 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import React__default from 'react';
 import { c as classNames } from './index-5C0-U8cc.mjs';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
 
 /**
  * Use `VerticalSpace` to create vertical space between components.
  */
 var VerticalSpace = function (_a) {
     var _b;
-    var _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? "24" : _d, sizeS = _a.sizeS, sizeM = _a.sizeM, sizeL = _a.sizeL, sizeXL = _a.sizeXL, props = __rest(_a, ["isDebugVisible", "size", "sizeS", "sizeM", "sizeL", "sizeXL"]);
+    var _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? "24" : _d, sizeS = _a.sizeS, sizeM = _a.sizeM, sizeL = _a.sizeL, sizeXL = _a.sizeXL, sizeXXL = _a.sizeXXL, props = __rest(_a, ["isDebugVisible", "size", "sizeS", "sizeM", "sizeL", "sizeXL", "sizeXXL"]);
     return (React__default.createElement("div", __assign({ className: classNames((_b = {
                 "arc-VerticalSpace": true
             },
@@ -16,6 +17,7 @@ var VerticalSpace = function (_a) {
             _b["arc-VerticalSpace--sizeM".concat(sizeM)] = sizeM,
             _b["arc-VerticalSpace--sizeL".concat(sizeL)] = sizeL,
             _b["arc-VerticalSpace--sizeXL".concat(sizeXL)] = sizeXL,
+            _b["arc-VerticalSpace--sizeXXL".concat(sizeXXL)] = sizeXXL,
             _b["arc-VerticalSpace--debugVisible"] = isDebugVisible,
             _b)) }, filterAttrs(props))));
 };

package/lib/_shared/esm/{Visible-B13QJn7R.mjs → Visible-B0d79VWZ.mjs}

@@ -1,6 +1,7 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import React__default from 'react';
 import { c as classNames } from './index-5C0-U8cc.mjs';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
 
 var Visible = function (_a) {
     var children = _a.children, xs = _a.xs, s = _a.s, m = _a.m, l = _a.l, xl = _a.xl, xxl = _a.xxl, props = __rest(_a, ["children", "xs", "s", "m", "l", "xl", "xxl"]);

package/lib/_shared/esm/{VisuallyHidden-DqAgoqJo.mjs → VisuallyHidden-aSQ4RA1o.mjs}

@@ -1,5 +1,6 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from './filter-attrs-B6CM-NUr.mjs';
+import { _ as __rest, a as __assign } from './tslib.es6-w7hdJ3oZ.mjs';
 import React__default from 'react';
+import { f as filterAttrs } from './filter-attrs-v_SweZXP.mjs';
 
 /**
  * Use `VisuallyHidden` to provide text for screen readers that is visually hidden on screen.

package/lib/_shared/esm/{arc-breakpoints-D7Ie4kBt.mjs → arc-breakpoints-Bs-at7wk.mjs}

@@ -1,4 +1,4 @@
-import { A as ArcSizeBreakpointsXxl, a as ArcSizeBreakpointsXl, b as ArcSizeBreakpointsL, c as ArcSizeBreakpointsM, d as ArcSizeBreakpointsS, e as ArcSizeBreakpointsXs } from './index.es-CtRkzfKP.mjs';
+import { A as ArcSizeBreakpointsXxl, a as ArcSizeBreakpointsXl, b as ArcSizeBreakpointsL, c as ArcSizeBreakpointsM, d as ArcSizeBreakpointsS, e as ArcSizeBreakpointsXs } from './index.es-tyrXzvpp.mjs';
 
 /**
  * Provides an object of breakpoints for responsive designs.
@@ -17,5 +17,10 @@ var ArcBreakpoints = {
     s: parseInt(ArcSizeBreakpointsS, 10),
     xs: parseInt(ArcSizeBreakpointsXs, 10),
 };
+var ARC_MIN_S_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsS, ")");
+var ARC_MIN_M_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsM, ")");
+var ARC_MIN_L_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsL, ")");
+var ARC_MIN_XL_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXl, ")");
+var ARC_MIN_XXL_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXxl, ")");
 
-export { ArcBreakpoints as A };
+export { ArcBreakpoints as A, ARC_MIN_S_BREAKPOINT as a, ARC_MIN_M_BREAKPOINT as b, ARC_MIN_L_BREAKPOINT as c, ARC_MIN_XL_BREAKPOINT as d, ARC_MIN_XXL_BREAKPOINT as e };

package/lib/_shared/esm/filter-attrs-v_SweZXP.mjs

@@ -0,0 +1,13 @@
+// src/filter-attrs/filter-attrs.ts
+var attributePrefixes = ["data-", "aria-"];
+var filterAttrs = (props) => {
+  const filteredProps = {};
+  for (const prop in props) {
+    if (Object.prototype.hasOwnProperty.call(props, prop) && attributePrefixes.some((prefix) => prop.startsWith(prefix))) {
+      filteredProps[prop] = props[prop];
+    }
+  }
+  return filteredProps;
+};
+
+export { filterAttrs as f };

package/lib/_shared/esm/{index-DLovItWo.mjs → index-BFKdmv_g.mjs}

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { u as useSize, a as useFloating, b as autoUpdate, o as offset, s as shift, f as flip, c as size, d as arrow, h as hide, l as limitShift } from './index-CWHcEz3_.mjs';
-import { P as Primitive, u as useComposedRefs } from './Combination-BpO6XTeS.mjs';
+import { P as Primitive, u as useComposedRefs } from './Combination-BQ4XBtF-.mjs';
 import { jsx } from 'react/jsx-runtime';
 import { c as createContextScope, f as useCallbackRef, b as useLayoutEffect2 } from './index-Bz2JQq34.mjs';
 

package/lib/_shared/esm/{index-J5IHetgg.mjs → index-CN4hP3Wu.mjs}

@@ -1,8 +1,8 @@
 'use client';
 import * as React from 'react';
-import { u as useComposedRefs, P as Primitive, c as composeEventHandlers, R as ReactRemoveScroll, S as Slot, h as hideOthers, a as useFocusGuards, F as FocusScope, D as DismissableLayer, b as Portal$1 } from './Combination-BpO6XTeS.mjs';
+import { u as useComposedRefs, P as Primitive, c as composeEventHandlers, R as ReactRemoveScroll, S as Slot, h as hideOthers, a as useFocusGuards, F as FocusScope, D as DismissableLayer, b as Portal$1 } from './Combination-BQ4XBtF-.mjs';
 import { c as createContextScope, d as createContext2, u as useControllableState, a as useId } from './index-Bz2JQq34.mjs';
-import { P as Presence } from './index-DXTwueLZ.mjs';
+import { P as Presence } from './index-GCEHSsY8.mjs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var DIALOG_NAME = "Dialog";

package/lib/_shared/esm/{index-CxrL7jIX.mjs → index-Do2wfP-X.mjs}

@@ -1,9 +1,9 @@
 'use client';
 import * as React from 'react';
-import { u as useComposedRefs, P as Primitive, c as composeEventHandlers, h as hideOthers, R as ReactRemoveScroll, S as Slot, a as useFocusGuards, F as FocusScope, D as DismissableLayer, b as Portal$1 } from './Combination-BpO6XTeS.mjs';
+import { u as useComposedRefs, P as Primitive, c as composeEventHandlers, h as hideOthers, R as ReactRemoveScroll, S as Slot, a as useFocusGuards, F as FocusScope, D as DismissableLayer, b as Portal$1 } from './Combination-BQ4XBtF-.mjs';
 import { c as createContextScope, u as useControllableState, a as useId } from './index-Bz2JQq34.mjs';
-import { c as createPopperScope, A as Anchor, C as Content, a as Arrow, R as Root2$1 } from './index-DLovItWo.mjs';
-import { P as Presence } from './index-DXTwueLZ.mjs';
+import { c as createPopperScope, A as Anchor, C as Content, a as Arrow, R as Root2$1 } from './index-BFKdmv_g.mjs';
+import { P as Presence } from './index-GCEHSsY8.mjs';
 import { jsx } from 'react/jsx-runtime';
 
 var POPOVER_NAME = "Popover";

package/lib/_shared/esm/{index-DXTwueLZ.mjs → index-GCEHSsY8.mjs}

@@ -1,6 +1,6 @@
 'use client';
 import * as React from 'react';
-import { u as useComposedRefs } from './Combination-BpO6XTeS.mjs';
+import { u as useComposedRefs } from './Combination-BQ4XBtF-.mjs';
 import { b as useLayoutEffect2 } from './index-Bz2JQq34.mjs';
 
 function useStateMachine(initialState, machine) {

package/lib/_shared/esm/{index-BbAu4d3T.mjs → index-u47CK8Y0.mjs}

@@ -2,7 +2,7 @@
 import * as React from 'react';
 import React__default from 'react';
 import { c as createContextScope } from './index-Bz2JQq34.mjs';
-import { u as useComposedRefs, S as Slot } from './Combination-BpO6XTeS.mjs';
+import { u as useComposedRefs, S as Slot } from './Combination-BQ4XBtF-.mjs';
 import { jsx } from 'react/jsx-runtime';
 
 function createCollection(name) {

package/lib/_shared/esm/{index-CYUcQl4W.mjs → index-vnVJe9rH.mjs}

@@ -1,10 +1,10 @@
 'use client';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { P as Primitive, u as useComposedRefs, c as composeEventHandlers, h as hideOthers, a as useFocusGuards, R as ReactRemoveScroll, S as Slot, F as FocusScope, D as DismissableLayer, b as Portal$1 } from './Combination-BpO6XTeS.mjs';
-import { c as createCollection, u as useDirection } from './index-BbAu4d3T.mjs';
+import { P as Primitive, u as useComposedRefs, c as composeEventHandlers, h as hideOthers, a as useFocusGuards, R as ReactRemoveScroll, S as Slot, F as FocusScope, D as DismissableLayer, b as Portal$1 } from './Combination-BQ4XBtF-.mjs';
+import { c as createCollection, u as useDirection } from './index-u47CK8Y0.mjs';
 import { c as createContextScope, b as useLayoutEffect2, a as useId, f as useCallbackRef, u as useControllableState } from './index-Bz2JQq34.mjs';
-import { c as createPopperScope, A as Anchor, C as Content, a as Arrow, R as Root2$1 } from './index-DLovItWo.mjs';
+import { c as createPopperScope, A as Anchor, C as Content, a as Arrow, R as Root2$1 } from './index-BFKdmv_g.mjs';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 // packages/core/number/src/number.ts

package/lib/_shared/esm/{index.es-CtRkzfKP.mjs → index.es-tyrXzvpp.mjs}

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Sep 2025 09:31:53 GMT
+ * Generated on Fri, 24 Oct 2025 10:49:57 GMT
  */
 var ArcSizeBreakpointsXs = "320px";
 var ArcSizeBreakpointsS = "636px";

package/lib/_shared/esm/{filter-attrs-B6CM-NUr.mjs → tslib.es6-w7hdJ3oZ.mjs}

@@ -53,16 +53,4 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-// src/filter-attrs/filter-attrs.ts
-var attributePrefixes = ["data-", "aria-"];
-var filterAttrs = (props) => {
-  const filteredProps = {};
-  for (const prop in props) {
-    if (Object.prototype.hasOwnProperty.call(props, prop) && attributePrefixes.some((prefix) => prop.startsWith(prefix))) {
-      filteredProps[prop] = props[prop];
-    }
-  }
-  return filteredProps;
-};
-
-export { __rest as _, __assign as a, __spreadArray as b, filterAttrs as f };
+export { __rest as _, __assign as a, __spreadArray as b };

package/lib/_shared/esm/use-media-query-BmsMeo2M.mjs

@@ -0,0 +1,56 @@
+import { useState, useEffect } from 'react';
+
+var IS_SERVER = typeof window === "undefined";
+/**
+ * @typedef MediaQueryOutputs
+ * @param {boolean} matches - does the document match the media query?
+ */
+/**
+ * Handle with care!
+ *
+ * If you need to change something in the browser based on @media query, you
+ * probably don’t need this hook. Use CSS media queries instead.
+ *
+ * Sometimes UI requirements are not achievable with CSS media queries alone. In
+ * these rare cases, use this hook to make media query matches available
+ * to React JavaScript code.
+ *
+ * @param {string} mediaQuery - the media query to parse
+ * @returns {MediaQueryOutputs}
+ */
+var useMediaQuery = function (mediaQuery) {
+    var getMatches = function (query) {
+        if (IS_SERVER) {
+            return false;
+        }
+        return window.matchMedia(query).matches;
+    };
+    var _a = useState(false), matches = _a[0], setMatches = _a[1];
+    // Handles the change event of the media query.
+    var handleChange = function () {
+        setMatches(getMatches(mediaQuery));
+    };
+    useEffect(function () {
+        var matchMedia = window.matchMedia(mediaQuery);
+        // Triggered at the first client-side load and if query changes
+        handleChange();
+        // Use deprecated `addListener` and `removeListener` to support Safari < 14 (#135)
+        if (matchMedia.addListener) {
+            matchMedia.addListener(handleChange);
+        }
+        else {
+            matchMedia.addEventListener("change", handleChange);
+        }
+        return function () {
+            if (matchMedia.removeListener) {
+                matchMedia.removeListener(handleChange);
+            }
+            else {
+                matchMedia.removeEventListener("change", handleChange);
+            }
+        };
+    }, [mediaQuery]);
+    return matches;
+};
+
+export { useMediaQuery as u };