@ostack.tech/ui 0.9.1 → 0.10.0

package/dist/ostack-ui.js

@@ -1,15 +1,16 @@
-import { forwardRef, createContext, useContext, useCallback, useRef, useEffect, useId, useMemo, useState, memo, Fragment as Fragment$1, isValidElement, cloneElement, Children, useImperativeHandle, startTransition, useLayoutEffect as useLayoutEffect$1, createElement, useDeferredValue, useSyncExternalStore } from "react";
+import * as React from "react";
+import { forwardRef, createContext, useContext, useCallback, useRef, useEffect, useId, useMemo, useState, memo, Fragment as Fragment$1, isValidElement, cloneElement, Children, useImperativeHandle, startTransition, useLayoutEffect as useLayoutEffect$2, useDeferredValue, useSyncExternalStore } from "react";
 import { tinykeys, parseKeybinding } from "tinykeys";
 import fromExponential from "from-exponential";
 import { isValid, isDate, addMonths, isAfter, isBefore, startOfMonth, setMonth, getYear, setYear, startOfYear, format, isSameYear, getMonth, max, min, lastDayOfMonth, parseISO, parse, isWithinInterval, isEqual } from "date-fns";
-import { createStore, useStore, create } from "zustand";
+import { createStore, useStore as useStore$1, create } from "zustand";
 import { shallow } from "zustand/shallow";
 import { removeNumericFormat, numericFormatter, NumericFormat } from "react-number-format";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { faArrowRight, faArrowLeft, faArrowDown, faArrowUp, faClose, faTriangleExclamation, faCircleExclamation, faCircleCheck, faCircleInfo, faChevronUp, faChevronDown, faRedo, faCircleQuestion, faSortDown, faSortUp, faAsterisk, faMinus, faCheck, faFilter, faSearch, faChevronLeft, faChevronRight, faArrowUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
 import { ErrorBoundary as ErrorBoundary$1 } from "react-error-boundary";
 import { useErrorBoundary } from "react-error-boundary";
-import { AlertDialog as AlertDialog$1, Dialog as Dialog$1, Slot as Slot$1, Portal as Portal$1, Tooltip as Tooltip$1, Toast as Toast$1, Collapsible as Collapsible$1, Popover as Popover$1, Label as Label$1, Checkbox as Checkbox$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, Separator as Separator$1, Tabs as Tabs$1 } from "radix-ui";
+import { AlertDialog as AlertDialog$1, Dialog as Dialog$1, Slot as Slot$1, Portal as Portal$1, Tooltip as Tooltip$1, Toast as Toast$1, Collapsible as Collapsible$1, Popover as Popover$1, Label as Label$1, Checkbox as Checkbox$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, Separator as Separator$2, Tabs as Tabs$1 } from "radix-ui";
 import { subscribeWithSelector } from "zustand/middleware";
 import { I as IS_APPLE } from "./chunks/platformUtils-C3IHCr90.js";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -18,7 +19,6 @@ import { locale as locale2 } from "./locales/en-US.js";
 import { locale as locale3, locale as locale4 } from "./locales/fr-FR.js";
 import { locale as locale5, locale as locale6 } from "./locales/pt-PT.js";
 import { useDayPicker, DayPicker } from "react-day-picker";
-import { Command } from "cmdk";
 import { useShallow } from "zustand/react/shallow";
 import { useVirtualizer, observeElementRect } from "@tanstack/react-virtual";
 import { faCalendar } from "@fortawesome/free-regular-svg-icons";
@@ -41,7 +41,7 @@ function PrefixProvider({ prefix, children }) {
   return prefix === void 0 ? children : /* @__PURE__ */ jsx(PrefixContext.Provider, { value: prefix, children });
 }
 function usePrefix() {
-  const defaultPrefix = useStore(
+  const defaultPrefix = useStore$1(
     defaultPrefixStore,
     ({ defaultPrefix: defaultPrefix2 }) => defaultPrefix2
   );
@@ -421,7 +421,7 @@ function useCreateDataTableContext({
   defaultLimit,
   limit,
   onLimitChange,
-  defaultFilter,
+  defaultFilter: defaultFilter2,
   filter,
   onFilterChange,
   defaultSortBy,
@@ -433,7 +433,9 @@ function useCreateDataTableContext({
   defaultSelectedRows,
   selectedRows,
   onSelectedRowsChange,
-  disabledSelections
+  disabledSelections,
+  selectAllRowsLabel,
+  selectRowLabel
 }) {
   const { startPrintingTask, finishPrintingTask } = usePrinterContentContext();
   const latest = useLatestValues({
@@ -470,7 +472,7 @@ function useCreateDataTableContext({
           () => [get().pageOffset(), get().limit, get().totalCount()],
           (pageOffset, limit2, totalCount) => totalCount == null ? void 0 : Math.min(totalCount - pageOffset, limit2)
         ),
-        filter: filter ?? defaultFilter,
+        filter: filter ?? defaultFilter2,
         sortBy: initialSortBy,
         sortDirection: sortDirection ?? defaultSortDirection ?? (initialSortBy !== null && columns[initialSortBy].defaultSortDirection || "asc"),
         selectedRows: [
@@ -775,6 +777,8 @@ function useCreateDataTableContext({
       dynamicRowHeight,
       estimatedRowHeight,
       overscan,
+      selectAllRowsLabel,
+      selectRowLabel,
       generatedId,
       showAllRowsWhilePrinting,
       apiRef,
@@ -790,6 +794,8 @@ function useCreateDataTableContext({
       dynamicRowHeight,
       estimatedRowHeight,
       overscan,
+      selectAllRowsLabel,
+      selectRowLabel,
       generatedId,
       showAllRowsWhilePrinting,
       apiRef,
@@ -851,7 +857,7 @@ function useFieldContext() {
   return useContext(FieldContext);
 }
 function useFieldStore(selector) {
-  return useStore(useFieldContext() ?? EMPTY_STORE, selector);
+  return useStore$1(useFieldContext() ?? EMPTY_STORE, selector);
 }
 function useFieldControlId() {
   return useFieldStore((state) => state.controlId);
@@ -1021,7 +1027,7 @@ function useTableContext() {
 }
 function useTableNumberOfColumns() {
   const { store } = useTableContext();
-  return useStore(store, (state) => state.numberOfColumns);
+  return useStore$1(store, (state) => state.numberOfColumns);
 }
 const TableHeadContext = createContext(false);
 function useIsInTableHead() {
@@ -1085,6 +1091,7 @@ const Portal = forwardRef(function Portal2({ asChild, children, ...otherProps },
   );
 });
 const DialogContent = forwardRef(function DialogContent2({
+  asChild,
   variant = "solid",
   mergeSections,
   color = "neutral",
@@ -1094,6 +1101,7 @@ const DialogContent = forwardRef(function DialogContent2({
   portalProps,
   overlayProps,
   className,
+  children,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
@@ -1115,27 +1123,29 @@ const DialogContent = forwardRef(function DialogContent2({
           ...overlayProps,
           className: cx(prefix("dialog__overlay"), overlayProps?.className),
           children: /* @__PURE__ */ jsx(
-            Card,
+            Dialog$1.Content,
             {
-              variant,
-              color,
-              mergeSections,
-              asChild: true,
+              asChild: !asChild,
+              onPointerDownOutside: combineEventHandlers(
+                onPointerDownOutside,
+                handlePointerDownOutside,
+                { checkDefaultPrevented: true }
+              ),
+              className: cx(
+                prefix("dialog"),
+                prefix(`dialog--${size}`),
+                className
+              ),
+              ref: forwardedRef,
+              ...otherProps,
               children: /* @__PURE__ */ jsx(
-                Dialog$1.Content,
+                Card,
                 {
-                  onPointerDownOutside: combineEventHandlers(
-                    onPointerDownOutside,
-                    handlePointerDownOutside,
-                    { checkDefaultPrevented: true }
-                  ),
-                  className: cx(
-                    prefix("dialog"),
-                    prefix(`dialog--${size}`),
-                    className
-                  ),
-                  ref: forwardedRef,
-                  ...otherProps
+                  asChild,
+                  variant,
+                  color,
+                  mergeSections,
+                  children
                 }
               )
             }
@@ -1801,10 +1811,12 @@ const IconButton = forwardRef(function IconButton2({
   ) : button;
 });
 const CloseButton = forwardRef(
-  function CloseIconButton({ icon, label, tooltipContent = null, className, ...otherProps }, forwardedRef) {
+  function CloseIconButton({ icon, label, className, ...otherProps }, forwardedRef) {
     const prefix = usePrefix();
     const [locale7] = useLocale();
-    label ??= locale7.CloseButton.label;
+    if (label === void 0) {
+      label = locale7.CloseButton.label;
+    }
     return /* @__PURE__ */ jsx(
       IconButton,
       {
@@ -1813,7 +1825,6 @@ const CloseButton = forwardRef(
         circle: true,
         icon: icon ?? faClose,
         label,
-        tooltipContent,
         ...otherProps,
         ref: forwardedRef
       }
@@ -1894,6 +1905,7 @@ const AlertDialogCancel = forwardRef(function AlertDialogCancel2(props, forwarde
   return /* @__PURE__ */ jsx(AlertDialog$1.Cancel, { ...props, asChild: true, ref: forwardedRef });
 });
 const AlertDialogContent = forwardRef(function AlertDialogContent2({
+  asChild,
   variant = "solid",
   mergeSections,
   color = "neutral",
@@ -1919,22 +1931,23 @@ const AlertDialogContent = forwardRef(function AlertDialogContent2({
           ...overlayProps,
           className: cx(prefix("dialog__overlay"), overlayProps?.className),
           children: /* @__PURE__ */ jsx(
-            Card,
+            AlertDialog$1.Content,
             {
-              variant,
-              color,
-              mergeSections,
-              asChild: true,
+              asChild: !asChild,
+              className: cx(
+                prefix("dialog"),
+                prefix(`dialog--${size}`),
+                className
+              ),
+              ref: forwardedRef,
+              ...otherProps,
               children: /* @__PURE__ */ jsx(
-                AlertDialog$1.Content,
+                Card,
                 {
-                  className: cx(
-                    prefix("dialog"),
-                    prefix(`dialog--${size}`),
-                    className
-                  ),
-                  ref: forwardedRef,
-                  ...otherProps,
+                  asChild,
+                  variant,
+                  color,
+                  mergeSections,
                   children
                 }
               )
@@ -2301,7 +2314,7 @@ function useCreateDocumentTitleStore(breadcrumbs) {
   return store;
 }
 function useDocumentTitleStore(selector) {
-  return useStore(useContext(DocumentTitleContext) ?? EMPTY_STORE, selector);
+  return useStore$1(useContext(DocumentTitleContext) ?? EMPTY_STORE, selector);
 }
 function DocumentTitle({ title, children }) {
   const context = useContext(DocumentTitleProviderContext);
@@ -2480,7 +2493,7 @@ const Toast = forwardRef(function Toast2({
   icon = SEVERITY_ICON$1[severity],
   action,
   actionAltText,
-  showCloseButton = action === void 0,
+  showCloseButton = action == null || typeof action === "boolean",
   visuallyHidden,
   rootProps,
   containerProps,
@@ -2717,11 +2730,11 @@ const CollapsibleContext = createContext(
   null
 );
 function useCollapsibleContext() {
-  const dataTableContext = useContext(CollapsibleContext);
-  if (!dataTableContext) {
+  const collapsibleContent = useContext(CollapsibleContext);
+  if (!collapsibleContent) {
     throw new Error("Collapsible context not in scope.");
   }
-  return dataTableContext;
+  return collapsibleContent;
 }
 const Collapsible = forwardRef(function Collapsible2({
   defaultOpen,
@@ -2774,6 +2787,14 @@ const CollapsibleTrigger = forwardRef(function CollapsibleTrigger2({ children, .
   );
   return /* @__PURE__ */ jsx(Collapsible$1.Trigger, { ...props, asChild: true, ref: forwardedRef, children: typeof children === "function" ? children(open) : children });
 });
+const AlertContext = createContext(null);
+function useAlertContext() {
+  const alertContext = useContext(AlertContext);
+  if (!alertContext) {
+    throw new Error("Alert context not in scope.");
+  }
+  return alertContext;
+}
 const SEVERITY_ICON = {
   neutral: null,
   info: faCircleInfo,
@@ -2784,6 +2805,7 @@ const SEVERITY_ICON = {
 const Alert = forwardRef(function Alert2({
   variant = "subtle",
   severity = "info",
+  announce = "off",
   defaultOpen = true,
   open,
   onOpenChange,
@@ -2798,11 +2820,16 @@ const Alert = forwardRef(function Alert2({
   closeButtonProps,
   children,
   className,
+  role,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
+  const [titleId, setTitleId] = useState();
   const accent = severity === "info" ? "primary" : severity;
-  return /* @__PURE__ */ jsx(
+  const actualRole = role ?? (announce === "assertive" ? "alert" : announce === "polite" ? "status" : void 0);
+  return /* @__PURE__ */ jsx(AlertContext, { value: { setTitleId }, children: /* @__PURE__ */ jsx(
     Collapsible,
     {
       defaultOpen,
@@ -2827,7 +2854,9 @@ const Alert = forwardRef(function Alert2({
                     className
                   ),
                   "data-accent": accent,
-                  role: "alert",
+                  role: actualRole,
+                  "aria-label": ariaLabel,
+                  "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 && (actualRole === "alert" || actualRole === "status") ? titleId : void 0),
                   ...otherProps,
                   ref: forwardedRef,
                   children: [
@@ -2844,7 +2873,10 @@ const Alert = forwardRef(function Alert2({
                       "div",
                       {
                         ...contentProps,
-                        className: cx(prefix("alert__content"), contentProps?.className),
+                        className: cx(
+                          prefix("alert__content"),
+                          contentProps?.className
+                        ),
                         children
                       }
                     ),
@@ -2880,22 +2912,33 @@ const Alert = forwardRef(function Alert2({
         }
       )
     }
-  );
+  ) });
 });
 const AlertTitle = forwardRef(function AlertTitle2({
   as = "div",
   asChild,
+  id,
   className,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
+  const generatedId = useId();
+  const actualId = id ?? prefix(`alert-title-${generatedId}`);
+  const { setTitleId } = useAlertContext();
+  const ref = useCallback(
+    (el) => {
+      setTitleId(el ? actualId : void 0);
+    },
+    [actualId, setTitleId]
+  );
   const As = asChild ? Slot : as;
   return /* @__PURE__ */ jsx(
     As,
     {
+      id: actualId,
       className: cx(prefix("alert__title"), className),
       ...otherProps,
-      ref: forwardedRef
+      ref: combineEventHandlers(ref, forwardedRef)
     }
   );
 });
@@ -3660,6 +3703,10 @@ const Field = forwardRef(function Field2({ asChild, className, ...otherProps },
     }
   ) });
 });
+function FieldProvider({ children }) {
+  const store = useCreateFieldContext();
+  return /* @__PURE__ */ jsx(FieldContext.Provider, { value: store, children });
+}
 const DEFAULT_TABLE_COLUMN_WIDTH = 150;
 const Table = forwardRef(
   function Table2({
@@ -3679,6 +3726,8 @@ const Table = forwardRef(
     visuallyHiddenCaptionProps,
     className,
     children,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
     "aria-describedby": ariaDescribedBy,
     ...otherProps
   }, forwardedRef) {
@@ -3687,13 +3736,14 @@ const Table = forwardRef(
     visuallyHiddenCaption ??= label;
     const descriptionIds = useFieldDescriptionIds();
     const errorMessageIds = useFieldErrorMessageIds();
-    const { controlId, codeId } = useSetFieldControl(
+    const { generatedId, controlId, codeId } = useSetFieldControl(
       containerProps?.id,
       "DIV",
       void 0,
       false,
       required
     );
+    const visuallyHiddenCaptionId = visuallyHiddenCaption ? visuallyHiddenCaptionProps?.id ?? prefix(`table-caption-${generatedId}`) : void 0;
     const tableRef = useRef(null);
     const [scrollableEl, setScrollableEl] = useState(
       null
@@ -3732,6 +3782,7 @@ const Table = forwardRef(
     const captionEl = caption && /* @__PURE__ */ jsx(
       "div",
       {
+        "aria-hidden": true,
         ...captionProps,
         className: cx(
           prefix("table__caption"),
@@ -3787,8 +3838,9 @@ const Table = forwardRef(
                     className
                   ),
                   "data-status": status,
+                  "aria-label": ariaLabel,
+                  "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 && codeId ? combineAriaIds(codeId, visuallyHiddenCaptionId) : void 0),
                   "aria-describedby": combineAriaIds(
-                    codeId,
                     errorMessageIds,
                     ariaDescribedBy,
                     descriptionIds
@@ -3796,7 +3848,14 @@ const Table = forwardRef(
                   ...otherProps,
                   ref: combinedTableRef,
                   children: [
-                    visuallyHiddenCaption && /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx("caption", { ...visuallyHiddenCaptionProps, children: visuallyHiddenCaption }) }),
+                    visuallyHiddenCaptionId && /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx(
+                      "caption",
+                      {
+                        ...visuallyHiddenCaptionProps,
+                        id: visuallyHiddenCaptionId,
+                        children: visuallyHiddenCaption
+                      }
+                    ) }),
                     /* @__PURE__ */ jsx(ColumnWidths, {}),
                     children
                   ]
@@ -3812,7 +3871,7 @@ const Table = forwardRef(
 );
 function ColumnWidths() {
   const { store } = useTableContext();
-  const columnWidths2 = useStore(store, (state) => state.columnWidths);
+  const columnWidths2 = useStore$1(store, (state) => state.columnWidths);
   return columnWidths2 && /* @__PURE__ */ jsx("colgroup", { children: columnWidths2.map((width, i) => /* @__PURE__ */ jsx("col", { style: width != null ? { width } : void 0 }, i)) });
 }
 const TableBody = forwardRef(
@@ -4179,14 +4238,16 @@ const TableHead = forwardRef(
                     }
                   )
                 ] });
+                const rowSpan = numberOfRows$1([column]) > 1 ? 1 : nRows - i;
+                const colSpan = numberOfColumns([column]);
                 return /* @__PURE__ */ jsx(
                   TableCell,
                   {
                     header,
                     scope: header ? column.children.length > 0 ? "colgroup" : "col" : void 0,
                     align,
-                    rowSpan: numberOfRows$1([column]) > 1 ? 1 : nRows - i,
-                    colSpan: numberOfColumns([column]),
+                    rowSpan: rowSpan === 1 ? void 0 : rowSpan,
+                    colSpan: colSpan === 1 ? void 0 : colSpan,
                     style: {
                       width: layout === "fixed" && width != null ? Array.isArray(width) ? width.reduce((sum, width2) => sum + width2, 0) : width : void 0,
                       ...style
@@ -4412,7 +4473,7 @@ const DataTable = forwardRef(
     defaultLimit = 10,
     limit,
     onLimitChange,
-    defaultFilter = "",
+    defaultFilter: defaultFilter2 = "",
     filter,
     onFilterChange,
     defaultSortBy = null,
@@ -4425,6 +4486,8 @@ const DataTable = forwardRef(
     selectedRows,
     onSelectedRowsChange,
     disabledSelections,
+    selectAllRowsLabel,
+    selectRowLabel,
     renderRow,
     renderCell,
     dynamicRowHeight = false,
@@ -4463,7 +4526,7 @@ const DataTable = forwardRef(
       defaultLimit,
       limit,
       onLimitChange,
-      defaultFilter,
+      defaultFilter: defaultFilter2,
       filter,
       onFilterChange,
       defaultSortBy,
@@ -4475,7 +4538,9 @@ const DataTable = forwardRef(
       defaultSelectedRows,
       selectedRows,
       onSelectedRowsChange,
-      disabledSelections
+      disabledSelections,
+      selectAllRowsLabel,
+      selectRowLabel
     });
     return /* @__PURE__ */ jsx(DataTableContext.Provider, { value: dataTableContextValue, children: /* @__PURE__ */ jsx(
       "div",
@@ -4659,12 +4724,12 @@ function useCheckboxGroupContext() {
 }
 function useIsCheckedInGroup(checkboxValue) {
   const store = useCheckboxGroupContext()?.store ?? EMPTY_STORE;
-  const handleCheckedChange = useStore(
+  const handleCheckedChange = useStore$1(
     store,
     (state) => state.actions?.handleCheckedChange
   );
   return [
-    useStore(store, (state) => state.value?.includes(checkboxValue)),
+    useStore$1(store, (state) => state.value?.includes(checkboxValue)),
     useMemo(
       () => handleCheckedChange && ((checked) => handleCheckedChange(checkboxValue, checked)),
       [checkboxValue, handleCheckedChange]
@@ -4675,13 +4740,13 @@ function useIsRequiredInGroup() {
   const context = useCheckboxGroupContext();
   const store = context?.store ?? EMPTY_STORE;
   const required = context?.required;
-  return useStore(store, (state) => required && state.value.length === 0);
+  return useStore$1(store, (state) => required && state.value.length === 0);
 }
 function useCheckboxGroupDescriptionIds(checkboxId) {
   const context = useCheckboxGroupContext();
   const store = context?.store ?? EMPTY_STORE;
   const descriptionIds = context?.descriptionIds;
-  const isFirstCheckbox = useStore(
+  const isFirstCheckbox = useStore$1(
     store,
     (state) => state.firstCheckboxId === checkboxId
   );
@@ -4926,7 +4991,7 @@ const Checkbox = forwardRef(function Checkbox2({
   );
   const combinedCheckboxRef = useCombinedRef(checkboxRef, forwardedRef);
   const combinedLabelRef = useCombinedRef(labelProps?.ref, labelRef);
-  return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsxs(
     ControlContext.Provider,
     {
       value: {
@@ -4940,147 +5005,159 @@ const Checkbox = forwardRef(function Checkbox2({
         loading,
         readOnly
       },
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          "data-status": status,
-          "data-accent": controlStatusToAccent(status),
-          "data-variant": checkboxVariant,
-          ...rootProps,
-          className: cx(prefix("checkbox__root"), rootProps?.className),
-          children: [
-            code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
-              ControlCode,
-              {
-                ...codeProps,
-                id: codeId,
-                className: cx(prefix("checkbox__code"), codeProps?.className),
-                children: code
-              }
-            ),
-            /* @__PURE__ */ jsxs(
-              "div",
-              {
-                "data-status": status,
-                "data-variant": checkboxVariant,
-                "data-disabled": boolDataAttr(disabled || loading),
-                "data-readonly": boolDataAttr(readOnly),
-                ...containerProps,
-                className: cx(
-                  prefix("checkbox__container"),
-                  containerProps?.className
-                ),
-                onBlur: combineEventHandlers(
-                  containerProps?.onBlur,
-                  handleContainerBlur
-                ),
-                ref: combinedContainerRef,
-                children: [
-                  /* @__PURE__ */ jsx(
-                    Checkbox$1.Root,
-                    {
-                      id: controlId,
-                      className: cx(prefix("checkbox"), className),
-                      name: name ?? checkboxGroupContext?.name,
-                      value,
-                      checked,
-                      required: requiredInGroup || required || void 0,
-                      disabled,
-                      "data-loading": boolDataAttr(loading),
-                      "data-readonly": boolDataAttr(readOnly),
-                      "data-status": status,
-                      "data-variant": checkboxVariant,
-                      onCheckedChange: handleCheckedChange,
-                      onFocus: combineEventHandlers(onFocus, handleFocus),
-                      onBlur: combineEventHandlers(onBlur, handleBlur),
-                      "aria-disabled": loading || readOnly || void 0,
-                      "aria-label": ariaLabel,
-                      "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 && combinedLabelIds !== labelId && combinedLabelIds !== fieldLabelId ? combinedLabelIds : void 0),
-                      "aria-invalid": status === "invalid" || void 0,
-                      "aria-describedby": combineAriaIds(
-                        loadingDescriptionId,
-                        checkboxGroupContext?.loadingDescriptionId,
-                        errorMessageIds,
-                        checkboxGroupContext?.errorMessageIds,
-                        ariaDescribedBy,
-                        descriptionIds,
-                        groupDescriptionIds
-                      ),
-                      ...otherProps,
-                      ref: combinedCheckboxRef,
-                      children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { asChild: true, children: /* @__PURE__ */ jsx(
-                        Icon,
-                        {
-                          icon: checked === "indeterminate" ? faMinus : faCheck,
-                          ...indicatorProps,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-status": status,
+            "data-accent": controlStatusToAccent(status),
+            "data-variant": checkboxVariant,
+            ...rootProps,
+            className: cx(prefix("checkbox__root"), rootProps?.className),
+            children: [
+              code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
+                ControlCode,
+                {
+                  ...codeProps,
+                  id: codeId,
+                  className: cx(prefix("checkbox__code"), codeProps?.className),
+                  children: code
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  "data-status": status,
+                  "data-variant": checkboxVariant,
+                  "data-disabled": boolDataAttr(disabled || loading),
+                  "data-readonly": boolDataAttr(readOnly),
+                  ...containerProps,
+                  className: cx(
+                    prefix("checkbox__container"),
+                    containerProps?.className
+                  ),
+                  onBlur: combineEventHandlers(
+                    containerProps?.onBlur,
+                    handleContainerBlur
+                  ),
+                  ref: combinedContainerRef,
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Checkbox$1.Root,
+                      {
+                        id: controlId,
+                        className: cx(prefix("checkbox"), className),
+                        name: name ?? checkboxGroupContext?.name,
+                        value,
+                        checked,
+                        required: requiredInGroup || required || void 0,
+                        disabled,
+                        "data-loading": boolDataAttr(loading),
+                        "data-readonly": boolDataAttr(readOnly),
+                        "data-status": status,
+                        "data-variant": checkboxVariant,
+                        onCheckedChange: handleCheckedChange,
+                        onFocus: combineEventHandlers(onFocus, handleFocus),
+                        onBlur: combineEventHandlers(onBlur, handleBlur),
+                        "aria-disabled": loading || readOnly || void 0,
+                        "aria-label": ariaLabel,
+                        "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 && combinedLabelIds !== labelId && combinedLabelIds !== fieldLabelId ? combinedLabelIds : void 0),
+                        "aria-invalid": status === "invalid" || void 0,
+                        "aria-describedby": combineAriaIds(
+                          loadingDescriptionId,
+                          checkboxGroupContext?.loadingDescriptionId,
+                          errorMessageIds,
+                          checkboxGroupContext?.errorMessageIds,
+                          ariaDescribedBy,
+                          descriptionIds,
+                          groupDescriptionIds
+                        ),
+                        ...otherProps,
+                        ref: combinedCheckboxRef,
+                        children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { asChild: true, children: /* @__PURE__ */ jsx(
+                          Icon,
+                          {
+                            icon: checked === "indeterminate" ? faMinus : faCheck,
+                            ...indicatorProps,
+                            className: cx(
+                              prefix("checkbox__indicator"),
+                              indicatorProps?.className
+                            )
+                          }
+                        ) })
+                      }
+                    ),
+                    labelId && /* @__PURE__ */ jsx(
+                      Label,
+                      {
+                        htmlFor: controlId,
+                        "data-status": status,
+                        ...labelProps,
+                        id: labelId,
+                        className: cx(prefix("checkbox__label"), labelProps?.className),
+                        required,
+                        onMouseDown: combineEventHandlers(
+                          labelProps?.onMouseDown,
+                          handleLabelMouseDown
+                        ),
+                        containerProps: {
+                          ...labelProps?.containerProps,
                           className: cx(
-                            prefix("checkbox__indicator"),
-                            indicatorProps?.className
+                            prefix("checkbox__label-container"),
+                            labelProps?.containerProps?.className
                           )
-                        }
-                      ) })
-                    }
-                  ),
-                  labelId && /* @__PURE__ */ jsx(
-                    Label,
-                    {
-                      htmlFor: controlId,
-                      "data-status": status,
-                      ...labelProps,
-                      id: labelId,
-                      className: cx(prefix("checkbox__label"), labelProps?.className),
-                      required,
-                      onMouseDown: combineEventHandlers(
-                        labelProps?.onMouseDown,
-                        handleLabelMouseDown
-                      ),
-                      containerProps: {
-                        ...labelProps?.containerProps,
+                        },
+                        ref: combinedLabelRef,
+                        children
+                      }
+                    ),
+                    showSpinner && /* @__PURE__ */ jsx(
+                      Spinner,
+                      {
+                        color: controlStatusToAccent(status, "neutral"),
+                        "data-disabled": boolDataAttr(disabled || loading),
+                        ...spinnerProps,
                         className: cx(
-                          prefix("checkbox__label-container"),
-                          labelProps?.containerProps?.className
+                          prefix("checkbox__spinner"),
+                          spinnerProps?.className
                         )
-                      },
-                      ref: combinedLabelRef,
-                      children
-                    }
-                  ),
-                  showSpinner && /* @__PURE__ */ jsx(
-                    Spinner,
-                    {
-                      color: controlStatusToAccent(status, "neutral"),
-                      "data-disabled": boolDataAttr(disabled || loading),
-                      ...spinnerProps,
-                      className: cx(
-                        prefix("checkbox__spinner"),
-                        spinnerProps?.className
-                      )
-                    }
-                  ),
-                  loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
-                ]
-              }
-            )
-          ]
-        }
-      )
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
+      ]
     }
   ) });
 });
 const DATA_TABLE_SELECTION_COLUMN_WIDTH = 42;
 function useDataTableSelectionColumn() {
   const prefix = usePrefix();
-  const { displayMode, rowKey, showSelectionColumn, store } = useDataTableContext();
-  const [selectedRows] = useStore(store, (state) => state.selectedRows);
-  const disabledSelections = useStore(
+  const [locale7] = useLocale();
+  const {
+    displayMode,
+    rowKey,
+    showSelectionColumn,
+    selectAllRowsLabel,
+    selectRowLabel,
+    store
+  } = useDataTableContext();
+  const actualSelectAllRowsLabel = selectAllRowsLabel ?? locale7.DataTable.selectAllRowsLabel;
+  const actualSelectRowLabel = selectRowLabel ?? locale7.DataTable.selectRowLabel;
+  const [selectedRows] = useStore$1(store, (state) => state.selectedRows);
+  const disabledSelections = useStore$1(
     store,
     (state) => state.disabledSelections
   );
-  const { selectRows, unselectRows } = useStore(
+  const { selectRows, unselectRows } = useStore$1(
     store,
     (state) => state.actions
   );
-  const allCheckedStatus = useStore(
+  const allCheckedStatus = useStore$1(
     store,
     useShallow((state) => {
       if (state.loading || !showSelectionColumn) {
@@ -5121,7 +5198,11 @@ function useDataTableSelectionColumn() {
             } else {
               selectRows(keys);
             }
-          }
+          },
+          labelProps: {
+            containerProps: { className: prefix("visually-hidden") }
+          },
+          children: actualSelectAllRowsLabel
         }
       ),
       header: true,
@@ -5143,7 +5224,11 @@ function useDataTableSelectionColumn() {
                 unselectRows([key]);
               }
             },
-            disabled: disabledSelections?.has(key)
+            disabled: disabledSelections?.has(key),
+            labelProps: {
+              containerProps: { className: prefix("visually-hidden") }
+            },
+            children: actualSelectRowLabel
           }
         );
       }
@@ -5174,7 +5259,7 @@ const DataTableRow = memo(
       const { rowKey, renderCell, generatedId, estimatedRowHeight, store } = useDataTableContext();
       const selectionColumn = useDataTableSelectionColumn();
       const dataTableSelectionColumnId = useDataTableSelectionColumnId();
-      const leafColumns2 = useStore(
+      const leafColumns2 = useStore$1(
         store,
         useShallow(
           (state) => selectionColumn ? {
@@ -5183,9 +5268,9 @@ const DataTableRow = memo(
           } : state.leafColumns
         )
       );
-      const headCount = useStore(store, (state) => state.headCount);
-      const filter = useStore(store, (state) => state.filter);
-      const selected = useStore(
+      const headCount = useStore$1(store, (state) => state.headCount);
+      const filter = useStore$1(store, (state) => state.filter);
+      const selected = useStore$1(
         store,
         (state) => row && state.selectedRows[0].has(getRowKey(row, rowKey))
       );
@@ -5274,9 +5359,10 @@ function DataTableEmptyOrLoadingRows({
 }) {
   const prefix = usePrefix();
   const { showSelectionColumn, renderRow, store, apiRef } = useDataTableContext();
-  const loading = useStore(store, (state) => state.loading);
-  const loadingCount = useStore(store, (state) => state.loadingCount);
+  const loading = useStore$1(store, (state) => state.loading);
+  const loadingCount = useStore$1(store, (state) => state.loadingCount);
   const numberOfColumns2 = (useTableNumberOfColumns() ?? 1) + (showSelectionColumn ? 1 : 0);
+  const headCount = useStore$1(store, (state) => state.headCount);
   useImperativeHandle(
     apiRef,
     () => ({
@@ -5293,16 +5379,25 @@ function DataTableEmptyOrLoadingRows({
     const props = { row: void 0, index: i };
     const key = `loading-${i}`;
     return renderRow ? /* @__PURE__ */ jsx(Fragment$1, { children: renderRow(props) }, key) : /* @__PURE__ */ jsx(DataTableRow, { ...props }, key);
-  }) : /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { paddingless: false, colSpan: numberOfColumns2, children: !loading && /* @__PURE__ */ jsx(
-    "div",
+  }) : /* @__PURE__ */ jsx(TableRow, { "aria-rowindex": headCount + 1, children: /* @__PURE__ */ jsx(
+    TableCell,
     {
-      className: cx(
-        prefix("data-table__empty-message"),
-        emptyMessageProps?.className
-      ),
-      children: emptyMessage
+      header: true,
+      variant: "data",
+      paddingless: false,
+      colSpan: numberOfColumns2 === 1 ? void 0 : numberOfColumns2,
+      children: !loading && /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cx(
+            prefix("data-table__empty-message"),
+            emptyMessageProps?.className
+          ),
+          children: emptyMessage
+        }
+      )
     }
-  ) }) });
+  ) });
 }
 function PagedDataTableRows() {
   const { rowKey, renderRow, showAllRowsWhilePrinting, apiRef, store } = useDataTableContext();
@@ -5339,11 +5434,11 @@ function PagedDataTableRows() {
     ),
     [goTo, store]
   );
-  const pageOffset = useStore(
+  const pageOffset = useStore$1(
     store,
     (state) => showAllRows ? 0 : state.pageOffset()
   );
-  const rowsWindow = useStore(
+  const rowsWindow = useStore$1(
     store,
     useShallow(
       (state) => state.rowsWindow(
@@ -5370,8 +5465,8 @@ function ScrolledDataTableRows({
     apiRef,
     store
   } = useDataTableContext();
-  const tableHeadHeight = useStore(store, (state) => state.tableHeadHeight);
-  const bodyCount = useStore(store, (state) => state.bodyCount());
+  const tableHeadHeight = useStore$1(store, (state) => state.tableHeadHeight);
+  const bodyCount = useStore$1(store, (state) => state.bodyCount());
   const virtualizer = useVirtualizer({
     count: bodyCount,
     getScrollElement: useCallback(() => scrollableRef.current, [scrollableRef]),
@@ -5462,7 +5557,7 @@ function ScrolledDataTableRows({
   const virtualItems = virtualizer.getVirtualItems();
   const firstVirtualItem = virtualItems[0];
   const lastVirtualItem = virtualItems[virtualItems.length - 1];
-  const rowsWindow = useStore(
+  const rowsWindow = useStore$1(
     store,
     useShallow(
       (state) => state.rowsWindow(firstVirtualItem?.index ?? 0, virtualItems.length)
@@ -5524,7 +5619,7 @@ function ScrolledDataTableRows({
 }
 const DataTableBody = forwardRef(function DataTableBody2({ emptyMessage, emptyMessageProps, scrollableRef, ...otherProps }, forwardedRef) {
   const { displayMode, store } = useDataTableContext();
-  const isEmptyOrLoading = useStore(
+  const isEmptyOrLoading = useStore$1(
     store,
     (state) => state.loading || state.totalCount() === 0
   );
@@ -5539,10 +5634,10 @@ const DataTableBody = forwardRef(function DataTableBody2({ emptyMessage, emptyMe
     !isEmptyOrLoading && (displayMode === "paged" ? /* @__PURE__ */ jsx(PagedDataTableRows, {}) : /* @__PURE__ */ jsx(ScrolledDataTableRows, { scrollableRef }))
   ] });
 });
-const useLayoutEffect = typeof document !== "undefined" ? useLayoutEffect$1 : () => {
+const useLayoutEffect$1 = typeof document !== "undefined" ? useLayoutEffect$2 : () => {
 };
 function useMeasure(element, setMeasurement) {
-  useLayoutEffect(() => {
+  useLayoutEffect$1(() => {
     if (!element) {
       setMeasurement(void 0);
       return;
@@ -5560,7 +5655,7 @@ function useMeasure(element, setMeasurement) {
 }
 const DataTableFoot = forwardRef(function DataTableFoot2({ showWhenEmpty, ...otherProps }, forwardedRef) {
   const { store } = useDataTableContext();
-  const shouldShow = useStore(
+  const shouldShow = useStore$1(
     store,
     (state) => showWhenEmpty || !state.loading && (state.totalCount() ?? 0) > 0
   );
@@ -5579,7 +5674,7 @@ const DataTableHead = forwardRef(function DataTableHead2({ rowProps, ...otherPro
   const { generatedId, store } = useDataTableContext();
   const selectionColumn = useDataTableSelectionColumn();
   const dataTableSelectionColumnId = useDataTableSelectionColumnId();
-  const columns = useStore(
+  const columns = useStore$1(
     store,
     useShallow(
       (state) => selectionColumn ? {
@@ -5588,9 +5683,9 @@ const DataTableHead = forwardRef(function DataTableHead2({ rowProps, ...otherPro
       } : state.columns
     )
   );
-  const sortBy = useStore(store, (state) => state.sortBy);
-  const sortDirection = useStore(store, (state) => state.sortDirection);
-  const { setSort } = useStore(store, (state) => state.actions);
+  const sortBy = useStore$1(store, (state) => state.sortBy);
+  const sortDirection = useStore$1(store, (state) => state.sortDirection);
+  const { setSort } = useStore$1(store, (state) => state.actions);
   const [tableHeadEl, setTableHeadEl] = useState(null);
   useMeasure(
     tableHeadEl,
@@ -5672,13 +5767,13 @@ const DataTableContent = forwardRef(function DataTable2({
 }, forwardedRef) {
   const prefix = usePrefix();
   const [locale7] = useLocale();
-  emptyMessage ??= locale7.DataTable.emptyMessage;
+  emptyMessage ??= locale7.DataTableContent.emptyMessage;
   const { displayMode, required, estimatedRowHeight, store } = useDataTableContext();
   const tableRef = useRef(null);
   const scrollableRef = useRef(null);
   const { height: scrollbarHeight } = useScrollbarSize();
   const rowHeight = typeof estimatedRowHeight === "number" ? estimatedRowHeight : estimatedRowHeight(0);
-  const maxHeight = useStore(
+  const maxHeight = useStore$1(
     store,
     (state) => displayMode === "scrolled" && !state.loading && (state.totalCount() ?? 0) > state.limit ? (state.tableHeadHeight ?? rowHeight) + (state.tableFootHeight ?? 0) + rowHeight * state.limit + // TODO: Only add this if the container overflows horizontally
     scrollbarHeight : void 0
@@ -5755,12 +5850,12 @@ const DataTableFilter = forwardRef(function DataTableFilter2({
   ariaLabel ??= locale7.DataTableFilter["aria-label"];
   placeholder ??= locale7.DataTableFilter.placeholder;
   const { store } = useDataTableContext();
-  const filter = useStore(store, (state) => state.filter);
+  const filter = useStore$1(store, (state) => state.filter);
   const handleFilterChange = (value) => {
     startTransition(() => store.getState().actions.setFilter(value));
   };
   return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsx(
-    Input,
+    Input$1,
     {
       placeholder,
       showClearButton: "auto",
@@ -5784,27 +5879,33 @@ const DataTableFilter = forwardRef(function DataTableFilter2({
 });
 const PagedDataTablePagination = forwardRef(function PagedDataTablePagination2({
   rowsRange,
+  rowsRangeSelectLabel,
   previousPageButtonLabel,
   nextPageButtonLabel,
   preferRightAlignment,
   previousPageButtonProps,
   nextPageButtonProps,
   className,
+  "aria-label": ariaLabel,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
+  const [locale7] = useLocale();
+  ariaLabel ??= locale7.DataTablePagination["aria-label"];
   const { store } = useDataTableContext();
-  const totalCount = useStore(store, (state) => state.totalCount());
-  const limit = useStore(store, (state) => state.limit);
-  const { setOffset } = useStore(store, (state) => state.actions);
+  const totalCount = useStore$1(store, (state) => state.totalCount());
+  const limit = useStore$1(store, (state) => state.limit);
+  const { setOffset } = useStore$1(store, (state) => state.actions);
   const setOffsetWithTransition = (offset) => startTransition(() => setOffset(offset));
-  const currentPage = useStore(store, (state) => state.currentPage());
+  const currentPage = useStore$1(store, (state) => state.currentPage());
   const numberOfPages = Math.ceil((totalCount ?? 0) / limit);
   const lastPage = Math.max(0, numberOfPages - 1);
   return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsxs(
     "div",
     {
+      role: "group",
       className: cx(prefix("data-table__pagination"), className),
+      "aria-label": ariaLabel,
       ...otherProps,
       "data-prefer-right-alignment": boolDataAttr(preferRightAlignment),
       ref: forwardedRef,
@@ -5819,6 +5920,7 @@ const PagedDataTablePagination = forwardRef(function PagedDataTablePagination2({
                 value: currentPage,
                 onValueChange: (value) => setOffsetWithTransition(+value * limit),
                 showClearButton: false,
+                "aria-label": rowsRangeSelectLabel?.(totalCount),
                 rootProps: {
                   className: prefix("data-table__pagination-select-root")
                 },
@@ -5872,12 +5974,12 @@ const PagedDataTablePagination = forwardRef(function PagedDataTablePagination2({
 const ScrolledDataTablePagination = forwardRef(function ScrolledDataTablePagination2({ rowsRange, preferRightAlignment, className, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
   const { store } = useDataTableContext();
-  const totalCount = useStore(store, (state) => state.totalCount());
-  const scrolledRangeStart = useStore(
+  const totalCount = useStore$1(store, (state) => state.totalCount());
+  const scrolledRangeStart = useStore$1(
     store,
     (state) => state.scrolledRangeStart
   );
-  const scrolledRangeEnd = useStore(store, (state) => state.scrolledRangeEnd);
+  const scrolledRangeEnd = useStore$1(store, (state) => state.scrolledRangeEnd);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -5900,6 +6002,7 @@ const ScrolledDataTablePagination = forwardRef(function ScrolledDataTablePaginat
 });
 const DataTablePagination = forwardRef(function DataTablePagination2({
   rowsRange,
+  rowsRangeSelectLabel,
   previousPageButtonLabel,
   nextPageButtonLabel,
   previousPageButtonProps,
@@ -5909,6 +6012,7 @@ const DataTablePagination = forwardRef(function DataTablePagination2({
 }, forwardedRef) {
   const [locale7] = useLocale();
   rowsRange ??= locale7.DataTablePagination.rowsRange;
+  rowsRangeSelectLabel ??= locale7.DataTablePagination.rowsRangeSelectLabel;
   previousPageButtonLabel ??= locale7.DataTablePagination.previousPageButtonLabel;
   nextPageButtonLabel ??= locale7.DataTablePagination.nextPageButtonLabel;
   const { displayMode, showAllRowsWhilePrinting } = useDataTableContext();
@@ -5918,6 +6022,7 @@ const DataTablePagination = forwardRef(function DataTablePagination2({
     {
       ...otherProps,
       rowsRange,
+      rowsRangeSelectLabel,
       previousPageButtonLabel,
       nextPageButtonLabel,
       previousPageButtonProps,
@@ -5947,12 +6052,11 @@ const DataTableRowsPerPage = forwardRef(function DataTableRowsPerPage2({
   const [locale7] = useLocale();
   label ??= locale7.DataTableRowsPerPage.label;
   const { store } = useDataTableContext();
-  const limit = useStore(store, (state) => state.limit);
-  const { setLimit } = useStore(store, (state) => state.actions);
+  const limit = useStore$1(store, (state) => state.limit);
+  const { setLimit } = useStore$1(store, (state) => state.actions);
   const optionsIncludingLimit = limitOptions.includes(limit) ? [...limitOptions] : [...limitOptions, limit];
   optionsIncludingLimit.sort((v1, v2) => v1 - v2);
-  const selectId = prefix(`data-table-rows-per-page-${useId()}`);
-  return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsx(FieldProvider, { children: /* @__PURE__ */ jsxs(
     "div",
     {
       className: cx(prefix("data-table__rows-per-page"), className),
@@ -5960,22 +6064,11 @@ const DataTableRowsPerPage = forwardRef(function DataTableRowsPerPage2({
       "data-prefer-right-alignment": boolDataAttr(preferRightAlignment),
       ref: forwardedRef,
       children: [
-        /* @__PURE__ */ jsxs(
-          "label",
-          {
-            htmlFor: selectId,
-            className: prefix("data-table__rows-per-page-label"),
-            children: [
-              label,
-              ":"
-            ]
-          }
-        ),
+        /* @__PURE__ */ jsx(Label, { className: prefix("data-table__rows-per-page-label"), children: label }),
         /* @__PURE__ */ jsx(
           Select,
           {
             className: prefix("data-table__rows-per-page-select"),
-            id: selectId,
             value: limit,
             onValueChange: (value) => setLimit(+value),
             showClearButton: false,
@@ -5987,7 +6080,7 @@ const DataTableRowsPerPage = forwardRef(function DataTableRowsPerPage2({
         )
       ]
     }
-  ) });
+  ) }) });
 });
 const DataTableSelectionTrigger = forwardRef(function DataTableSelectionTrigger2({
   preferRightAlignment = true,
@@ -5999,7 +6092,7 @@ const DataTableSelectionTrigger = forwardRef(function DataTableSelectionTrigger2
 }, forwardedRef) {
   const prefix = usePrefix();
   const { store } = useDataTableContext();
-  const hasSelected = useStore(store, (state) => state.selectedRows.length > 0);
+  const hasSelected = useStore$1(store, (state) => state.selectedRows.length > 0);
   const handleClick = useCallback(
     (event) => {
       onClick(Array.from(store.getState().selectedRows[0]).sort(), event);
@@ -6023,7 +6116,7 @@ const DataTableSelectionTrigger = forwardRef(function DataTableSelectionTrigger2
 const REQUIRED_TAGS = ["INPUT", "SELECT", "TEXTAREA"];
 const READ_ONLY_TAGS = ["INPUT", "TEXTAREA"];
 const NON_READONLY_INPUT_TYPES = ["file", "color"];
-const Input = forwardRef(
+const Input$1 = forwardRef(
   function Input2({
     asChild,
     type,
@@ -6039,6 +6132,7 @@ const Input = forwardRef(
     startAdornment,
     endAdornment,
     showClearButton,
+    clearDescription,
     clearButtonLabel,
     onValueChange,
     onBlurToOutside,
@@ -6163,6 +6257,7 @@ const Input = forwardRef(
       }
     }, [inputEl]);
     const hasClearButton = !disabled && !loading && !readOnly && (showClearButton === true || showClearButton === "auto" && (isControlled ? (value?.toString() ?? "")?.length > 0 : shouldShowClearButton));
+    const clearDescriptionId = hasClearButton && clearDescription && prefix(`control-clear-${generatedId}`);
     const { cssVars, dataAttrs } = responsiveValuesToCssVarsAndDataAttrs(
       "control",
       { align }
@@ -6187,12 +6282,12 @@ const Input = forwardRef(
       clearButtonProps?.ref
     );
     const As = asChild ? Slot : "input";
-    return /* @__PURE__ */ jsxs(ClearContexts, { field: false, children: [
-      /* @__PURE__ */ jsx(
-        ControlContext.Provider,
-        {
-          value: { variant, status, disabled, loading, readOnly },
-          children: /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx(ClearContexts, { field: false, children: /* @__PURE__ */ jsxs(
+      ControlContext.Provider,
+      {
+        value: { variant, status, disabled, loading, readOnly },
+        children: [
+          /* @__PURE__ */ jsxs(
             "div",
             {
               "data-status": status,
@@ -6263,7 +6358,8 @@ const Input = forwardRef(
                             loadingDescriptionId,
                             errorMessageIds,
                             ariaDescribedBy,
-                            descriptionIds
+                            descriptionIds,
+                            clearDescriptionId
                           ),
                           ...otherProps,
                           ref: combinedInputRef
@@ -6315,16 +6411,17 @@ const Input = forwardRef(
                 )
               ]
             }
-          )
-        }
-      ),
-      loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
-    ] });
+          ),
+          loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription }),
+          clearDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: clearDescriptionId, children: clearDescription })
+        ]
+      }
+    ) });
   }
 );
 const InputWithContainerRef = forwardRef(function InputWithContainerRef2({ inputRef, containerProps, ...otherProps }, forwardedRef) {
   return /* @__PURE__ */ jsx(
-    Input,
+    Input$1,
     {
       containerProps: {
         ...containerProps,
@@ -6549,60 +6646,906 @@ const MenuListItem = forwardRef(
     );
   }
 );
-const CommandMenu = forwardRef(
-  function CommandMenu2({
-    variant,
-    iconPlacement = "start",
-    label,
-    searchPlaceholder,
-    searchValue,
-    onSearchValueChange,
-    listLabel,
-    loading,
-    loadingLabel,
-    loadingProgress,
-    emptyMessage,
-    className,
-    searchProps,
-    searchAdornmentProps,
-    searchIconProps,
-    listProps,
-    loadingProps,
-    spinnerProps,
-    emptyMessageProps,
-    children,
-    ...otherProps
-  }, forwardedRef) {
-    const prefix = usePrefix();
-    const [locale7] = useLocale();
-    label ??= locale7.CommandMenu.label;
-    searchPlaceholder ??= locale7.CommandMenu.searchPlaceholder;
-    emptyMessage ??= locale7.CommandMenu.emptyMessage;
-    listLabel ??= locale7.CommandMenu.listLabel;
-    loadingLabel ??= locale7.CommandMenu.loadingLabel;
-    const searchAdornmentEl = /* @__PURE__ */ jsx(
-      ControlAddon,
-      {
-        ...searchAdornmentProps,
-        className: cx(
-          prefix("command-menu__search-adornment"),
-          searchAdornmentProps?.className
-        ),
-        children: /* @__PURE__ */ jsx(
-          Icon,
-          {
-            icon: faSearch,
-            ...searchIconProps,
-            className: cx(
-              prefix("command-menu__search-icon"),
-              searchIconProps?.className
-            )
-          }
+var SCORE_CONTINUE_MATCH = 1, SCORE_SPACE_WORD_JUMP = 0.9, SCORE_NON_SPACE_WORD_JUMP = 0.8, SCORE_CHARACTER_JUMP = 0.17, SCORE_TRANSPOSITION = 0.1, PENALTY_SKIPPED = 0.999, PENALTY_CASE_MISMATCH = 0.9999, PENALTY_NOT_COMPLETE = 0.99;
+var IS_GAP_REGEXP = /[\\\/_+.#"@\[\(\{&]/, COUNT_GAPS_REGEXP = /[\\\/_+.#"@\[\(\{&]/g, IS_SPACE_REGEXP = /[\s-]/, COUNT_SPACE_REGEXP = /[\s-]/g;
+function commandScoreInner(string, abbreviation, lowerString, lowerAbbreviation, stringIndex, abbreviationIndex, memoizedResults) {
+  if (abbreviationIndex === abbreviation.length) {
+    if (stringIndex === string.length) {
+      return SCORE_CONTINUE_MATCH;
+    }
+    return PENALTY_NOT_COMPLETE;
+  }
+  var memoizeKey = `${stringIndex},${abbreviationIndex}`;
+  if (memoizedResults[memoizeKey] !== void 0) {
+    return memoizedResults[memoizeKey];
+  }
+  var abbreviationChar = lowerAbbreviation.charAt(abbreviationIndex);
+  var index = lowerString.indexOf(abbreviationChar, stringIndex);
+  var highScore = 0;
+  var score, transposedScore, wordBreaks, spaceBreaks;
+  while (index >= 0) {
+    score = commandScoreInner(
+      string,
+      abbreviation,
+      lowerString,
+      lowerAbbreviation,
+      index + 1,
+      abbreviationIndex + 1,
+      memoizedResults
+    );
+    if (score > highScore) {
+      if (index === stringIndex) {
+        score *= SCORE_CONTINUE_MATCH;
+      } else if (IS_GAP_REGEXP.test(string.charAt(index - 1))) {
+        score *= SCORE_NON_SPACE_WORD_JUMP;
+        wordBreaks = string.slice(stringIndex, index - 1).match(COUNT_GAPS_REGEXP);
+        if (wordBreaks && stringIndex > 0) {
+          score *= Math.pow(PENALTY_SKIPPED, wordBreaks.length);
+        }
+      } else if (IS_SPACE_REGEXP.test(string.charAt(index - 1))) {
+        score *= SCORE_SPACE_WORD_JUMP;
+        spaceBreaks = string.slice(stringIndex, index - 1).match(COUNT_SPACE_REGEXP);
+        if (spaceBreaks && stringIndex > 0) {
+          score *= Math.pow(PENALTY_SKIPPED, spaceBreaks.length);
+        }
+      } else {
+        score *= SCORE_CHARACTER_JUMP;
+        if (stringIndex > 0) {
+          score *= Math.pow(PENALTY_SKIPPED, index - stringIndex);
+        }
+      }
+      if (string.charAt(index) !== abbreviation.charAt(abbreviationIndex)) {
+        score *= PENALTY_CASE_MISMATCH;
+      }
+    }
+    if (score < SCORE_TRANSPOSITION && lowerString.charAt(index - 1) === lowerAbbreviation.charAt(abbreviationIndex + 1) || lowerAbbreviation.charAt(abbreviationIndex + 1) === lowerAbbreviation.charAt(abbreviationIndex) && // allow duplicate letters. Ref #7428
+    lowerString.charAt(index - 1) !== lowerAbbreviation.charAt(abbreviationIndex)) {
+      transposedScore = commandScoreInner(
+        string,
+        abbreviation,
+        lowerString,
+        lowerAbbreviation,
+        index + 1,
+        abbreviationIndex + 2,
+        memoizedResults
+      );
+      if (transposedScore * SCORE_TRANSPOSITION > score) {
+        score = transposedScore * SCORE_TRANSPOSITION;
+      }
+    }
+    if (score > highScore) {
+      highScore = score;
+    }
+    index = lowerString.indexOf(abbreviationChar, index + 1);
+  }
+  memoizedResults[memoizeKey] = highScore;
+  return highScore;
+}
+function formatInput(string) {
+  return string.toLowerCase().replace(COUNT_SPACE_REGEXP, " ");
+}
+function commandScore(string, abbreviation, aliases) {
+  string = aliases && aliases.length > 0 ? `${string + " " + aliases.join(" ")}` : string;
+  return commandScoreInner(
+    string,
+    abbreviation,
+    formatInput(string),
+    formatInput(abbreviation),
+    0,
+    0,
+    {}
+  );
+}
+const GROUP_SELECTOR = `[cmdk-group=""]`;
+const GROUP_ITEMS_SELECTOR = `[cmdk-group-items=""]`;
+const GROUP_HEADING_SELECTOR = `[cmdk-group-heading=""]`;
+const ITEM_SELECTOR = `[cmdk-item=""]`;
+const VALID_ITEM_SELECTOR = `${ITEM_SELECTOR}:not([aria-disabled="true"])`;
+const SELECT_EVENT = `cmdk-item-select`;
+const VALUE_ATTR = `data-value`;
+const defaultFilter = (value, search, keywords) => commandScore(value, search, keywords);
+const CommandContext = React.createContext(void 0);
+const useCommand = () => React.useContext(CommandContext);
+const StoreContext = React.createContext(void 0);
+const useStore = () => React.useContext(StoreContext);
+const GroupContext = React.createContext(void 0);
+const Command = React.forwardRef(
+  (props, forwardedRef) => {
+    const state = useLazyRef(() => ({
+      /** Value of the search query. */
+      search: "",
+      /** Currently selected item value. */
+      value: props.value ?? props.defaultValue ?? "",
+      /** Currently selected item id. */
+      selectedItemId: void 0,
+      filtered: {
+        /** The count of all visible items. */
+        count: 0,
+        /** Map from visible item id to its search score. */
+        items: /* @__PURE__ */ new Map(),
+        /** Set of groups with at least one visible item. */
+        groups: /* @__PURE__ */ new Set()
+      }
+    }));
+    const allItems = useLazyRef(() => /* @__PURE__ */ new Set());
+    const allGroups = useLazyRef(() => /* @__PURE__ */ new Map());
+    const ids = useLazyRef(
+      () => /* @__PURE__ */ new Map()
+    );
+    const listeners = useLazyRef(() => /* @__PURE__ */ new Set());
+    const propsRef = useAsRef(props);
+    const {
+      asChild,
+      label,
+      children,
+      value,
+      onValueChange,
+      filter,
+      shouldFilter,
+      loop,
+      disablePointerSelection = false,
+      ...etc
+    } = props;
+    const listId = React.useId();
+    const labelId = React.useId();
+    const inputId = React.useId();
+    const listInnerRef = React.useRef(null);
+    const schedule = useScheduleLayoutEffect();
+    useLayoutEffect(() => {
+      if (value !== void 0) {
+        const v = value.trim();
+        state.current.value = v;
+        store.emit();
+      }
+    }, [value]);
+    useLayoutEffect(() => {
+      setTimeout(() => {
+        schedule(6, scrollSelectedIntoView);
+      });
+    }, []);
+    const store = React.useMemo(() => {
+      return {
+        subscribe: (cb) => {
+          listeners.current.add(cb);
+          return () => listeners.current.delete(cb);
+        },
+        snapshot: () => {
+          return state.current;
+        },
+        setState: (key, value2, opts) => {
+          if (Object.is(state.current[key], value2)) return;
+          state.current[key] = value2;
+          if (key === "search") {
+            filterItems();
+            sort();
+            schedule(1, selectFirstItem);
+          } else if (key === "value") {
+            if (document.activeElement.hasAttribute("cmdk-input") || document.activeElement.hasAttribute("cmdk-root")) {
+              const input = document.getElementById(inputId);
+              if (input) input.focus();
+              else document.getElementById(listId)?.focus();
+            }
+            schedule(7, () => {
+              state.current.selectedItemId = opts.id;
+              store.emit();
+            });
+            if (!opts.disableScrollIntoView) {
+              schedule(5, () => scrollSelectedIntoView(opts.id));
+            }
+            if (propsRef.current?.value !== void 0) {
+              const newValue = value2 ?? "";
+              propsRef.current.onValueChange?.(newValue);
+              return;
+            }
+          }
+          store.emit();
+        },
+        emit: () => {
+          listeners.current.forEach((l) => l());
+        }
+      };
+    }, []);
+    const context = React.useMemo(
+      () => ({
+        // Keep id → {value, keywords} mapping up-to-date
+        value: (id, value2, keywords) => {
+          if (value2 !== ids.current.get(id)?.value) {
+            ids.current.set(id, { value: value2, keywords });
+            state.current.filtered.items.set(id, score(value2, keywords));
+            schedule(2, () => {
+              sort();
+              store.emit();
+            });
+          }
+        },
+        // Track item lifecycle (mount, unmount)
+        item: (id, groupId) => {
+          allItems.current.add(id);
+          if (groupId) {
+            if (!allGroups.current.has(groupId)) {
+              allGroups.current.set(groupId, /* @__PURE__ */ new Set([id]));
+            } else {
+              allGroups.current.get(groupId).add(id);
+            }
+          }
+          schedule(3, () => {
+            filterItems();
+            sort();
+            if (!state.current.value) {
+              selectFirstItem();
+            }
+            store.emit();
+          });
+          return () => {
+            ids.current.delete(id);
+            allItems.current.delete(id);
+            state.current.filtered.items.delete(id);
+            const selectedItem = getSelectedItem();
+            schedule(4, () => {
+              filterItems();
+              if (selectedItem?.getAttribute("id") === id) selectFirstItem();
+              store.emit();
+            });
+          };
+        },
+        // Track group lifecycle (mount, unmount)
+        group: (id) => {
+          if (!allGroups.current.has(id)) {
+            allGroups.current.set(id, /* @__PURE__ */ new Set());
+          }
+          return () => {
+            ids.current.delete(id);
+            allGroups.current.delete(id);
+          };
+        },
+        filter: () => {
+          return propsRef.current.shouldFilter;
+        },
+        label: label || props["aria-label"],
+        getDisablePointerSelection: () => {
+          return propsRef.current.disablePointerSelection;
+        },
+        listId,
+        inputId,
+        labelId,
+        listInnerRef
+      }),
+      []
+    );
+    function score(value2, keywords) {
+      const filter2 = propsRef.current?.filter ?? defaultFilter;
+      return value2 ? filter2(value2, state.current.search, keywords) : 0;
+    }
+    function sort() {
+      if (!state.current.search || // Explicitly false, because true | undefined is the default
+      propsRef.current.shouldFilter === false) {
+        return;
+      }
+      const scores = state.current.filtered.items;
+      const groups = [];
+      state.current.filtered.groups.forEach((value2) => {
+        const items = allGroups.current.get(value2);
+        let max2 = 0;
+        items.forEach((item) => {
+          const score2 = scores.get(item);
+          max2 = Math.max(score2, max2);
+        });
+        groups.push([value2, max2]);
+      });
+      const listInsertionElement = listInnerRef.current;
+      getValidItems().sort((a, b) => {
+        const valueA = a.getAttribute("id");
+        const valueB = b.getAttribute("id");
+        return (scores.get(valueB) ?? 0) - (scores.get(valueA) ?? 0);
+      }).forEach((item) => {
+        const group = item.closest(GROUP_ITEMS_SELECTOR);
+        if (group) {
+          group.appendChild(
+            item.parentElement === group ? item : item.closest(`${GROUP_ITEMS_SELECTOR} > *`)
+          );
+        } else {
+          listInsertionElement.appendChild(
+            item.parentElement === listInsertionElement ? item : item.closest(`${GROUP_ITEMS_SELECTOR} > *`)
+          );
+        }
+      });
+      groups.sort((a, b) => b[1] - a[1]).forEach((group) => {
+        const element = listInnerRef.current?.querySelector(
+          `${GROUP_SELECTOR}[${VALUE_ATTR}="${encodeURIComponent(group[0])}"]`
+        );
+        element?.parentElement.appendChild(element);
+      });
+    }
+    function selectFirstItem() {
+      const item = getValidItems().find(
+        (item2) => item2.getAttribute("aria-disabled") !== "true"
+      );
+      const value2 = item?.getAttribute(VALUE_ATTR);
+      store.setState("value", value2 || void 0, {
+        id: item?.getAttribute("id")
+      });
+    }
+    function filterItems() {
+      if (!state.current.search || // Explicitly false, because true | undefined is the default
+      propsRef.current.shouldFilter === false) {
+        state.current.filtered.count = allItems.current.size;
+        return;
+      }
+      state.current.filtered.groups = /* @__PURE__ */ new Set();
+      let itemCount = 0;
+      for (const id of allItems.current) {
+        const value2 = ids.current.get(id)?.value ?? "";
+        const keywords = ids.current.get(id)?.keywords ?? [];
+        const rank = score(value2, keywords);
+        state.current.filtered.items.set(id, rank);
+        if (rank > 0) itemCount++;
+      }
+      for (const [groupId, group] of allGroups.current) {
+        for (const itemId of group) {
+          if (state.current.filtered.items.get(itemId) > 0) {
+            state.current.filtered.groups.add(groupId);
+            break;
+          }
+        }
+      }
+      state.current.filtered.count = itemCount;
+    }
+    function scrollSelectedIntoView(itemId) {
+      const item = itemId ? document.getElementById(itemId) : getSelectedItem();
+      if (item) {
+        if (item.parentElement?.firstChild === item) {
+          item.closest(GROUP_SELECTOR)?.querySelector(GROUP_HEADING_SELECTOR)?.scrollIntoView({ block: "nearest" });
+        }
+        item.scrollIntoView({ block: "nearest" });
+      }
+    }
+    function getSelectedItem() {
+      return listInnerRef.current?.querySelector(
+        `${ITEM_SELECTOR}[data-selected]`
+      );
+    }
+    function getValidItems() {
+      return Array.from(
+        listInnerRef.current?.querySelectorAll(VALID_ITEM_SELECTOR) || []
+      );
+    }
+    function updateSelectedToIndex(index) {
+      const items = getValidItems();
+      const item = items[index];
+      if (item)
+        store.setState("value", item.getAttribute(VALUE_ATTR), {
+          id: item.getAttribute("id")
+        });
+    }
+    function updateSelectedByItem(change) {
+      const selected = getSelectedItem();
+      const items = getValidItems();
+      const index = selected ? items.findIndex((item) => item === selected) : -1;
+      let newIndex = index === -1 ? change > 0 ? 0 : items.length - 1 : index + change;
+      if (propsRef.current?.loop) {
+        newIndex = newIndex < 0 ? items.length - 1 : newIndex >= items.length ? 0 : newIndex;
+      } else {
+        newIndex = Math.max(0, Math.min(newIndex, items.length - 1));
+      }
+      let newSelected = items[newIndex];
+      if (newSelected)
+        store.setState("value", newSelected.getAttribute(VALUE_ATTR), {
+          id: newSelected.getAttribute("id")
+        });
+    }
+    function updateSelectedByGroup(change) {
+      const selected = getSelectedItem();
+      let group = selected?.closest(GROUP_SELECTOR);
+      let item;
+      while (group && !item) {
+        group = change > 0 ? findNextSibling(group, GROUP_SELECTOR) : findPreviousSibling(group, GROUP_SELECTOR);
+        item = group?.querySelector(VALID_ITEM_SELECTOR);
+      }
+      if (item) {
+        store.setState("value", item.getAttribute(VALUE_ATTR), {
+          id: item.getAttribute("id")
+        });
+      } else {
+        updateSelectedByItem(change);
+      }
+    }
+    const last = () => updateSelectedToIndex(getValidItems().length - 1);
+    const next = (e) => {
+      e.preventDefault();
+      if (e.metaKey) {
+        last();
+      } else if (e.altKey) {
+        updateSelectedByGroup(1);
+      } else {
+        updateSelectedByItem(1);
+      }
+    };
+    const prev = (e) => {
+      e.preventDefault();
+      if (e.metaKey) {
+        updateSelectedToIndex(0);
+      } else if (e.altKey) {
+        updateSelectedByGroup(-1);
+      } else {
+        updateSelectedByItem(-1);
+      }
+    };
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsxs(
+      As,
+      {
+        ref: forwardedRef,
+        tabIndex: -1,
+        ...etc,
+        "cmdk-root": "",
+        onKeyDown: (e) => {
+          etc.onKeyDown?.(e);
+          const isComposing = e.nativeEvent.isComposing || e.keyCode === 229;
+          if (e.defaultPrevented || isComposing) {
+            return;
+          }
+          switch (e.key) {
+            case "ArrowDown": {
+              next(e);
+              break;
+            }
+            case "ArrowUp": {
+              prev(e);
+              break;
+            }
+            case "Home": {
+              e.preventDefault();
+              updateSelectedToIndex(0);
+              break;
+            }
+            case "End": {
+              e.preventDefault();
+              last();
+              break;
+            }
+            case "Enter": {
+              e.preventDefault();
+              const item = getSelectedItem();
+              if (item) {
+                const event = new Event(SELECT_EVENT);
+                item.dispatchEvent(event);
+              }
+            }
+          }
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            "label",
+            {
+              "cmdk-label": "",
+              htmlFor: context.inputId,
+              id: context.labelId,
+              style: srOnlyStyles,
+              children: label
+            }
+          ),
+          SlottableWithNestedChildren(props, (child) => /* @__PURE__ */ jsx(StoreContext.Provider, { value: store, children: /* @__PURE__ */ jsx(CommandContext.Provider, { value: context, children: child }) }))
+        ]
+      }
+    );
+  }
+);
+const Item = React.forwardRef(
+  (props, forwardedRef) => {
+    const id = React.useId();
+    const ref = React.useRef(null);
+    const groupContext = React.useContext(GroupContext);
+    const context = useCommand();
+    const propsRef = useAsRef(props);
+    const forceMount = propsRef.current?.forceMount ?? groupContext?.forceMount;
+    useLayoutEffect(() => {
+      if (!forceMount) {
+        return context.item(id, groupContext?.id);
+      }
+    }, [forceMount]);
+    const value = useValue(
+      id,
+      ref,
+      [props.value, props.children, ref],
+      props.keywords
+    );
+    const store = useStore();
+    const selected = useCmdk(
+      (state) => state.value && state.value === value.current
+    );
+    const render = useCmdk(
+      (state) => forceMount ? true : context.filter() === false ? true : !state.search ? true : state.filtered.items.get(id) > 0
+    );
+    React.useEffect(() => {
+      const element = ref.current;
+      if (!element || props.disabled) return;
+      element.addEventListener(SELECT_EVENT, onSelect);
+      return () => element.removeEventListener(SELECT_EVENT, onSelect);
+    }, [render, props.onSelect, props.disabled]);
+    function onSelect() {
+      select();
+      propsRef.current.onSelect?.(value.current);
+    }
+    function select() {
+      store.setState("value", value.current, {
+        id,
+        disableScrollIntoView: true
+      });
+    }
+    const combinedRef = useCombinedRef(ref, forwardedRef);
+    if (!render) return null;
+    const {
+      asChild,
+      disabled,
+      value: _,
+      onSelect: __,
+      forceMount: ___,
+      keywords: ____,
+      ...etc
+    } = props;
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(
+      As,
+      {
+        ref: combinedRef,
+        id,
+        "cmdk-item": "",
+        role: "option",
+        "aria-disabled": Boolean(disabled) || void 0,
+        "aria-selected": Boolean(selected) || void 0,
+        "data-disabled": boolDataAttr(disabled),
+        "data-selected": boolDataAttr(selected),
+        ...etc,
+        onPointerMove: disabled || context.getDisablePointerSelection() ? void 0 : select,
+        onClick: disabled ? void 0 : onSelect,
+        children: props.children
+      }
+    );
+  }
+);
+const Group = React.forwardRef(
+  (props, forwardedRef) => {
+    const { asChild, heading, children, forceMount, ...etc } = props;
+    const id = React.useId();
+    const ref = React.useRef(null);
+    const headingRef = React.useRef(null);
+    const headingId = React.useId();
+    const context = useCommand();
+    const render = useCmdk(
+      (state) => forceMount ? true : context.filter() === false ? true : !state.search ? true : state.filtered.groups.has(id)
+    );
+    useLayoutEffect(() => {
+      return context.group(id);
+    }, []);
+    useValue(id, ref, [props.value, props.heading, headingRef]);
+    const contextValue = React.useMemo(
+      () => ({ id, forceMount }),
+      [forceMount]
+    );
+    const combinedRef = useCombinedRef(ref, forwardedRef);
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsxs(
+      As,
+      {
+        ref: combinedRef,
+        "cmdk-group": "",
+        role: "presentation",
+        hidden: render ? void 0 : true,
+        ...etc,
+        children: [
+          heading && /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: headingRef,
+              "cmdk-group-heading": "",
+              "aria-hidden": true,
+              id: headingId,
+              children: heading
+            }
+          ),
+          SlottableWithNestedChildren(props, (child) => /* @__PURE__ */ jsx(
+            "div",
+            {
+              "cmdk-group-items": "",
+              role: "group",
+              "aria-labelledby": heading ? headingId : void 0,
+              children: /* @__PURE__ */ jsx(GroupContext.Provider, { value: contextValue, children: child })
+            }
+          ))
+        ]
+      }
+    );
+  }
+);
+const Separator$1 = React.forwardRef(
+  (props, forwardedRef) => {
+    const { asChild, alwaysRender, ...etc } = props;
+    const ref = React.useRef(null);
+    const render = useCmdk((state) => !state.search);
+    const combinedRef = useCombinedRef(ref, forwardedRef);
+    if (!alwaysRender && !render) return null;
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(As, { ref: combinedRef, "cmdk-separator": "", role: "separator", ...etc });
+  }
+);
+const Input = React.forwardRef(
+  (props, forwardedRef) => {
+    const { asChild, onValueChange, ...etc } = props;
+    const isControlled = props.value != null;
+    const store = useStore();
+    const search = useCmdk((state) => state.search);
+    const selectedItemId = useCmdk((state) => state.selectedItemId);
+    const context = useCommand();
+    React.useEffect(() => {
+      if (props.value != null) {
+        store.setState("search", props.value);
+      }
+    }, [props.value]);
+    const As = asChild ? Slot : "input";
+    return /* @__PURE__ */ jsx(
+      As,
+      {
+        ref: forwardedRef,
+        "cmdk-input": "",
+        autoComplete: "off",
+        autoCorrect: "off",
+        spellCheck: false,
+        "aria-autocomplete": "list",
+        role: "combobox",
+        "aria-expanded": true,
+        "aria-controls": context.listId,
+        "aria-labelledby": context.labelId,
+        "aria-activedescendant": selectedItemId,
+        id: context.inputId,
+        type: "text",
+        value: isControlled ? props.value : search,
+        ...etc,
+        onChange: (e) => {
+          if (!isControlled) {
+            store.setState("search", e.target.value);
+          }
+          onValueChange?.(e.target.value);
+        }
+      }
+    );
+  }
+);
+const List = React.forwardRef(
+  (props, forwardedRef) => {
+    const { asChild, children, label = "Suggestions", ...etc } = props;
+    const ref = React.useRef(null);
+    const height = React.useRef(null);
+    const selectedItemId = useCmdk((state) => state.selectedItemId);
+    const context = useCommand();
+    React.useEffect(() => {
+      if (height.current && ref.current) {
+        const el = height.current;
+        const wrapper = ref.current;
+        let animationFrame;
+        const observer = new ResizeObserver(() => {
+          animationFrame = requestAnimationFrame(() => {
+            const height2 = el.offsetHeight;
+            wrapper.style.setProperty(
+              `--cmdk-list-height`,
+              height2.toFixed(1) + "px"
+            );
+          });
+        });
+        observer.observe(el);
+        return () => {
+          cancelAnimationFrame(animationFrame);
+          observer.unobserve(el);
+        };
+      }
+    }, []);
+    const combinedRef = useCombinedRef(ref, forwardedRef);
+    const combinedListSizerRef = useCombinedRef(height, context.listInnerRef);
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(
+      As,
+      {
+        ref: combinedRef,
+        "cmdk-list": "",
+        role: "listbox",
+        tabIndex: -1,
+        "aria-activedescendant": selectedItemId,
+        "aria-label": label,
+        id: context.listId,
+        ...etc,
+        children: SlottableWithNestedChildren(props, (child) => /* @__PURE__ */ jsx("div", { ref: combinedListSizerRef, "cmdk-list-sizer": "", children: child }))
+      }
+    );
+  }
+);
+const Empty = React.forwardRef(
+  (props, forwardedRef) => {
+    const render = useCmdk((state) => state.filtered.count === 0);
+    if (!render) return null;
+    const { asChild, ...etc } = props;
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(As, { ref: forwardedRef, "cmdk-empty": "", role: "presentation", ...etc });
+  }
+);
+const Loading = React.forwardRef(
+  (props, forwardedRef) => {
+    const { asChild, progress, children, label = "Loading...", ...etc } = props;
+    const As = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(
+      As,
+      {
+        ref: forwardedRef,
+        "cmdk-loading": "",
+        role: "progressbar",
+        "aria-valuenow": progress,
+        "aria-valuemin": 0,
+        "aria-valuemax": 100,
+        "aria-label": label,
+        ...etc,
+        children: SlottableWithNestedChildren(props, (child) => /* @__PURE__ */ jsx("div", { "aria-hidden": true, children: child }))
+      }
+    );
+  }
+);
+const pkg = Object.assign(Command, {
+  List,
+  Item,
+  Input,
+  Group,
+  Separator: Separator$1,
+  Empty,
+  Loading
+});
+function findNextSibling(el, selector) {
+  let sibling = el.nextElementSibling;
+  while (sibling) {
+    if (sibling.matches(selector)) return sibling;
+    sibling = sibling.nextElementSibling;
+  }
+}
+function findPreviousSibling(el, selector) {
+  let sibling = el.previousElementSibling;
+  while (sibling) {
+    if (sibling.matches(selector)) return sibling;
+    sibling = sibling.previousElementSibling;
+  }
+}
+function useAsRef(data) {
+  const ref = React.useRef(data);
+  useLayoutEffect(() => {
+    ref.current = data;
+  });
+  return ref;
+}
+const useLayoutEffect = typeof window === "undefined" ? React.useEffect : React.useLayoutEffect;
+function useLazyRef(fn) {
+  const ref = React.useRef();
+  if (ref.current === void 0) {
+    ref.current = fn();
+  }
+  return ref;
+}
+function useCmdk(selector) {
+  const store = useStore();
+  const cb = () => selector(store.snapshot());
+  return React.useSyncExternalStore(store.subscribe, cb, cb);
+}
+function useValue(id, ref, deps, aliases = []) {
+  const valueRef = React.useRef();
+  const context = useCommand();
+  useLayoutEffect(() => {
+    const value = (() => {
+      for (const part of deps) {
+        if (typeof part === "string") {
+          return part.trim();
+        }
+        if (typeof part === "object" && "current" in part) {
+          if (part.current) {
+            return part.current.textContent?.trim();
+          }
+          return valueRef.current;
+        }
+      }
+    })();
+    const keywords = aliases.map((alias) => alias.trim());
+    context.value(id, value, keywords);
+    ref.current?.setAttribute(VALUE_ATTR, value);
+    valueRef.current = value;
+  });
+  return valueRef;
+}
+const useScheduleLayoutEffect = () => {
+  const [s, ss] = React.useState();
+  const fns = useLazyRef(() => /* @__PURE__ */ new Map());
+  useLayoutEffect(() => {
+    fns.current.forEach((f) => f());
+    fns.current = /* @__PURE__ */ new Map();
+  }, [s]);
+  return (id, cb) => {
+    fns.current.set(id, cb);
+    ss({});
+  };
+};
+function renderChildren(children) {
+  const childrenType = children.type;
+  if (typeof childrenType === "function") return childrenType(children.props);
+  else if ("render" in childrenType) return childrenType.render(children.props);
+  else return children;
+}
+function SlottableWithNestedChildren({ asChild, children }, render) {
+  if (asChild && React.isValidElement(children)) {
+    return React.cloneElement(
+      renderChildren(children),
+      { ref: children.ref },
+      render(children.props.children)
+    );
+  }
+  return render(children);
+}
+const srOnlyStyles = {
+  position: "absolute",
+  width: "1px",
+  height: "1px",
+  padding: "0",
+  margin: "-1px",
+  overflow: "hidden",
+  clip: "rect(0, 0, 0, 0)",
+  whiteSpace: "nowrap",
+  borderWidth: "0"
+};
+const CommandMenu = forwardRef(
+  function CommandMenu2({
+    variant,
+    iconPlacement = "start",
+    label,
+    searchPlaceholder,
+    searchValue,
+    onSearchValueChange,
+    listLabel,
+    loading,
+    loadingLabel,
+    loadingProgress,
+    emptyMessage,
+    className,
+    searchProps,
+    searchAdornmentProps,
+    searchIconProps,
+    listProps,
+    loadingProps,
+    spinnerProps,
+    emptyMessageProps,
+    children,
+    ...otherProps
+  }, forwardedRef) {
+    const prefix = usePrefix();
+    const [locale7] = useLocale();
+    label ??= locale7.CommandMenu.label;
+    searchPlaceholder ??= locale7.CommandMenu.searchPlaceholder;
+    emptyMessage ??= locale7.CommandMenu.emptyMessage;
+    listLabel ??= locale7.CommandMenu.listLabel;
+    loadingLabel ??= locale7.CommandMenu.loadingLabel;
+    const searchAdornmentEl = /* @__PURE__ */ jsx(
+      ControlAddon,
+      {
+        ...searchAdornmentProps,
+        className: cx(
+          prefix("command-menu__search-adornment"),
+          searchAdornmentProps?.className
+        ),
+        children: /* @__PURE__ */ jsx(
+          Icon,
+          {
+            icon: faSearch,
+            ...searchIconProps,
+            className: cx(
+              prefix("command-menu__search-icon"),
+              searchIconProps?.className
+            )
+          }
         )
       }
     );
     return /* @__PURE__ */ jsxs(
-      Command,
+      pkg,
       {
         label,
         className: cx(prefix("command-menu"), className),
@@ -6610,13 +7553,13 @@ const CommandMenu = forwardRef(
         ref: forwardedRef,
         children: [
           /* @__PURE__ */ jsx(
-            Command.Input,
+            pkg.Input,
             {
               asChild: true,
               value: searchValue,
               onValueChange: onSearchValueChange,
               children: /* @__PURE__ */ jsx(
-                Input,
+                Input$1,
                 {
                   variant: "cell",
                   placeholder: searchPlaceholder,
@@ -6651,9 +7594,9 @@ const CommandMenu = forwardRef(
               variant,
               iconPlacement,
               asChild: true,
-              children: /* @__PURE__ */ jsxs(Command.List, { label: listLabel, children: [
+              children: /* @__PURE__ */ jsxs(pkg.List, { label: listLabel, children: [
                 loading && /* @__PURE__ */ jsx(
-                  Command.Loading,
+                  pkg.Loading,
                   {
                     label: loadingLabel,
                     progress: loadingProgress,
@@ -6674,7 +7617,7 @@ const CommandMenu = forwardRef(
                   }
                 ),
                 !loading && /* @__PURE__ */ jsx(
-                  Command.Empty,
+                  pkg.Empty,
                   {
                     ...emptyMessageProps,
                     className: cx(
@@ -6763,7 +7706,7 @@ const CommandMenuDialog = forwardRef(function CommandMenuDialog2({
 const CommandMenuGroup = forwardRef(function CommandMenuGroup2({ label, className, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
   return /* @__PURE__ */ jsx(
-    Command.Group,
+    pkg.Group,
     {
       ...otherProps,
       heading: label,
@@ -6839,7 +7782,7 @@ const CommandMenuItem = forwardRef(function CommandMenuItem2({
       keybindsProps,
       asChild: true,
       children: /* @__PURE__ */ jsx(
-        Command.Item,
+        pkg.Item,
         {
           disabled,
           ...otherProps,
@@ -6861,6 +7804,7 @@ function useCreateSelectContext({
   status,
   disabled,
   readOnly,
+  valueTagCloseButtonLabel,
   valueTagProps
 }) {
   const store = useConstant(
@@ -6891,6 +7835,7 @@ function useCreateSelectContext({
       status,
       disabled,
       readOnly,
+      valueTagCloseButtonLabel,
       valueTagProps,
       store
     }),
@@ -6902,6 +7847,7 @@ function useCreateSelectContext({
       status,
       store,
       value,
+      valueTagCloseButtonLabel,
       valueTagProps
     ]
   );
@@ -6933,7 +7879,7 @@ const Option = memo(
       onOptionSelect,
       store
     } = useSelectContext();
-    const { registerOption, unregisterOption } = useStore(
+    const { registerOption, unregisterOption } = useStore$1(
       store,
       (state) => state.actions
     );
@@ -6962,7 +7908,7 @@ const Option = memo(
         value: textValue,
         onSelect: onOptionSelect,
         selected,
-        "aria-checked": selected,
+        "aria-selected": selected || void 0,
         disabled,
         color,
         icon: selected ? faCheck : void 0,
@@ -7042,7 +7988,8 @@ const Tag = forwardRef(function Tag2({
         {
           ...containerProps,
           className: cx(prefix("tag__container"), containerProps?.className),
-          children: /* @__PURE__ */ jsxs(
+          asChild: true,
+          children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsxs(
             As,
             {
               className: cx(
@@ -7080,7 +8027,7 @@ const Tag = forwardRef(function Tag2({
                 ) })
               ]
             }
-          )
+          ) })
         }
       )
     }
@@ -7095,10 +8042,11 @@ function SelectMultipleValue() {
     status,
     disabled,
     readOnly,
+    valueTagCloseButtonLabel,
     valueTagProps,
     store
   } = useSelectContext();
-  useStore(store, (state) => state.actions.getOptionState(value));
+  useStore$1(store, (state) => state.actions.getOptionState(value));
   const handleCloseValueTag = useCallback(
     (tagValue, evt) => {
       evt.preventDefault();
@@ -7110,7 +8058,7 @@ function SelectMultipleValue() {
     () => Array.from(new Set(value)),
     [value]
   );
-  const valuesOptionStates = useStore(
+  const valuesOptionStates = useStore$1(
     store,
     useShallow(
       (state) => valuesToRender.map((v) => state.actions.getOptionState(v))
@@ -7124,57 +8072,65 @@ function SelectMultipleValue() {
     [valuesOptionStates]
   );
   const valuesTags = useMemo(
-    () => valuesToRender.map((v, i) => {
-      const optionState = valuesOptionStates[i];
-      return optionState && /* @__PURE__ */ createElement(
-        Tag,
-        {
-          variant: "subtle",
-          ...valueTagProps,
-          showCloseButton: !optionState.disabled,
-          closeButtonProps: {
-            asChild: true,
-            children: /* @__PURE__ */ jsx("span", {}),
-            type: void 0,
-            tabIndex: -1,
-            role: "button",
-            disabled,
-            "data-disabled": disabled ? "" : void 0,
-            // Prevent element from gaining focus
-            onMouseDown: (evt) => evt.preventDefault(),
-            onClick: (evt) => handleCloseValueTag(v, evt),
-            ...valueTagProps?.closeButtonProps
-          },
-          key: v,
-          color: optionState.color ?? controlStatusToAccent(status, "primary"),
-          className: cx(
-            prefix("select__value-tag"),
-            valueTagProps?.className
-          ),
-          containerProps: {
-            className: cx(
-              prefix("select__value-tag-container"),
-              valueTagProps?.containerProps?.className
-            ),
-            ...valueTagProps?.containerProps
-          },
-          contentProps: {
+    () => intersperse(
+      valuesToRender.map((v, i) => {
+        const optionState = valuesOptionStates[i];
+        return optionState && /* @__PURE__ */ jsx(
+          Tag,
+          {
+            variant: "subtle",
+            ...valueTagProps,
+            showCloseButton: !optionState.disabled,
+            closeButtonProps: {
+              label: null,
+              tooltipContent: valueTagCloseButtonLabel,
+              asChild: true,
+              children: /* @__PURE__ */ jsx("span", {}),
+              type: void 0,
+              disabled,
+              "data-disabled": boolDataAttr(disabled),
+              // Prevent element from gaining focus
+              onMouseDown: (evt) => evt.preventDefault(),
+              onClick: (evt) => handleCloseValueTag(v, evt),
+              // Override collapsible aria properties
+              "aria-controls": void 0,
+              "aria-expanded": void 0,
+              // Override tooltip aria properties
+              "aria-describedby": void 0,
+              ...valueTagProps?.closeButtonProps
+            },
+            color: optionState.color ?? controlStatusToAccent(status, "primary"),
             className: cx(
-              prefix("select__value-tag-content"),
-              valueTagProps?.contentProps?.className
+              prefix("select__value-tag"),
+              valueTagProps?.className
             ),
-            ...valueTagProps?.contentProps
+            containerProps: {
+              className: cx(
+                prefix("select__value-tag-container"),
+                valueTagProps?.containerProps?.className
+              ),
+              ...valueTagProps?.containerProps
+            },
+            contentProps: {
+              className: cx(
+                prefix("select__value-tag-content"),
+                valueTagProps?.contentProps?.className
+              ),
+              ...valueTagProps?.contentProps
+            },
+            children: optionState.content
           },
-          "aria-hidden": true
-        },
-        optionState.content
-      );
-    }),
+          v
+        );
+      }),
+      (i) => /* @__PURE__ */ jsx(VisuallyHidden, { children: ", " }, `separator-${i}`)
+    ),
     [
       disabled,
       handleCloseValueTag,
       prefix,
       status,
+      valueTagCloseButtonLabel,
       valueTagProps,
       valuesOptionStates,
       valuesToRender
@@ -7182,15 +8138,12 @@ function SelectMultipleValue() {
   );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     valuesToRender.length > 0 && readOnly && valuesList,
-    valuesToRender.length > 0 && !readOnly && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(VisuallyHidden, { children: valuesList }),
-      valuesTags
-    ] })
+    valuesToRender.length > 0 && !readOnly && valuesTags
   ] });
 }
 function SelectSingleValue() {
   const { value, store } = useSelectContext();
-  return useStore(
+  return useStore$1(
     store,
     (state) => state.actions.getOptionState(value)?.content
   );
@@ -7219,12 +8172,15 @@ const Select = forwardRef(function Select2({
   startAdornment,
   endAdornment,
   showClearButton = "auto",
+  clearDescription,
+  searchLabel,
   optionsLabel,
   loadingOptions,
   loadingOptionsLabel,
   loadingOptionsProgress,
   showSpinner = loading || loadingOptions,
   emptyMessage,
+  valueTagCloseButtonLabel,
   valueTagMaxWidth,
   onKeyDown,
   onBlurToOutside,
@@ -7240,17 +8196,28 @@ const Select = forwardRef(function Select2({
   popoverProps,
   commandMenuProps,
   style,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
   children,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
+  const { cssVarStyle } = useCssVars();
   const [locale7] = useLocale();
+  placeholder ??= locale7.Select.placeholder;
+  searchLabel ??= locale7.Select.searchLabel;
   searchPlaceholder ??= locale7.Select.searchPlaceholder;
   emptyMessage ??= locale7.Select.emptyMessage;
+  valueTagCloseButtonLabel ??= locale7.Select.valueTagCloseButtonLabel;
   optionsLabel ??= locale7.Select.optionsLabel;
   loadingOptionsLabel ??= locale7.Select.loadingOptionsLabel;
-  const { cssVarStyle } = useCssVars();
+  clearDescription ??= locale7.Select.clearDescription;
   const labelId = useFieldLabelId();
+  const dataTableColumnLabelId = useDataTableColumnLabelId();
+  const generatedId = useId();
+  const codeId = code ? codeProps?.id ?? prefix(`select-code-${generatedId}`) : void 0;
+  const valueId = valueProps?.id ?? prefix(`select-value-${generatedId}`);
+  const ariaLabelId = ariaLabel && prefix(`select-aria-label-${generatedId}`);
   const { printHidden } = usePrintClassNames();
   const [open, setOpen] = useControllableState(
     defaultOpen ?? false,
@@ -7271,6 +8238,7 @@ const Select = forwardRef(function Select2({
   const isEmpty = multiple ? actualValue.length === 0 : actualValue === "";
   const buttonRef = useRef(null);
   const popoverRef = useRef(null);
+  const searchRef = useRef(null);
   const handleContainerPointerDown = useCallback(
     (evt) => {
       evt.preventDefault();
@@ -7288,6 +8256,11 @@ const Select = forwardRef(function Select2({
         const newValue = actualValue.includes(optionValue) ? actualValue.filter((v) => v !== optionValue) : [...actualValue, optionValue];
         setValue(newValue);
         onValueChange?.(newValue);
+        if (open) {
+          searchRef.current?.focus();
+        } else {
+          buttonRef.current?.focus();
+        }
       } else {
         if (optionValue !== actualValue) {
           setValue(optionValue);
@@ -7303,6 +8276,7 @@ const Select = forwardRef(function Select2({
       multiple,
       onSearchValueChange,
       onValueChange,
+      open,
       setOpen,
       setSearchValue,
       setValue
@@ -7347,6 +8321,7 @@ const Select = forwardRef(function Select2({
     status,
     disabled: disabled || loading,
     readOnly,
+    valueTagCloseButtonLabel,
     valueTagProps
   });
   const registeringOptionsSelectContext = useMemo(
@@ -7360,6 +8335,10 @@ const Select = forwardRef(function Select2({
   );
   const combinedButtonRef = useCombinedRef(buttonRef, forwardedRef);
   const combinedPopoverRef = useCombinedRef(popoverRef, popoverProps?.ref);
+  const combinedSearchRef = useCombinedRef(
+    searchRef,
+    commandMenuProps?.searchProps?.ref
+  );
   return /* @__PURE__ */ jsxs(SelectContext.Provider, { value: selectContext, children: [
     /* @__PURE__ */ jsx(SelectContext.Provider, { value: registeringOptionsSelectContext, children }),
     /* @__PURE__ */ jsxs(
@@ -7372,8 +8351,6 @@ const Select = forwardRef(function Select2({
             PopoverTrigger,
             {
               className: cx(prefix("select"), className),
-              role: "combobox",
-              "aria-autocomplete": "none",
               "data-multiple": boolDataAttr(multiple),
               "data-limit-value-tags-width": boolDataAttr(valueTagMaxWidth != null),
               onKeyDown: combineEventHandlers(onKeyDown, handleKeyDown),
@@ -7417,9 +8394,10 @@ const Select = forwardRef(function Select2({
                     endAdornment
                   ] }),
                   showClearButton: showClearButton === "auto" ? !isEmpty : showClearButton,
+                  clearDescription,
                   onBlurToOutside: handleControlBlur,
                   rootProps,
-                  codeProps,
+                  codeProps: { ...codeProps, id: codeId },
                   containerProps: {
                     // Propagate open state to container for styling purposes
                     ...{ "data-state": showOpen ? "open" : "closed" },
@@ -7446,6 +8424,11 @@ const Select = forwardRef(function Select2({
                     ),
                     ref: combinedClearButtonRef
                   },
+                  ...open ? {} : { "aria-controls": void 0 },
+                  "aria-labelledby": combineAriaIds(
+                    ariaLabelledBy ?? ariaLabelId ?? combineAriaIds(codeId, labelId ?? dataTableColumnLabelId),
+                    valueId
+                  ),
                   spinnerProps: {
                     ...spinnerProps,
                     className: cx(prefix("select__spinner"), spinnerProps?.className)
@@ -7455,8 +8438,10 @@ const Select = forwardRef(function Select2({
                     "span",
                     {
                       ...valueProps,
+                      id: valueId,
                       className: cx(prefix("select__value"), valueProps?.className),
                       children: [
+                        /* @__PURE__ */ jsx(VisuallyHidden, { children: ", " }),
                         isEmpty && placeholder,
                         !isEmpty && !multiple && /* @__PURE__ */ jsx(SelectSingleValue, {}),
                         !isEmpty && multiple && /* @__PURE__ */ jsx(SelectMultipleValue, {})
@@ -7489,6 +8474,7 @@ const Select = forwardRef(function Select2({
                   ...commandMenuProps,
                   searchPlaceholder,
                   emptyMessage,
+                  label: searchLabel,
                   listLabel: optionsLabel,
                   loading: loadingOptions,
                   loadingLabel: loadingOptionsLabel,
@@ -7499,7 +8485,10 @@ const Select = forwardRef(function Select2({
                     onSearchValueChange,
                     setSearchValue
                   ),
-                  searchProps: { "aria-labelledby": labelId },
+                  searchProps: {
+                    ...commandMenuProps?.searchProps,
+                    ref: combinedSearchRef
+                  },
                   listProps: {
                     "aria-multiselectable": multiple ? true : void 0,
                     ...commandMenuProps?.listProps
@@ -7511,7 +8500,8 @@ const Select = forwardRef(function Select2({
           )
         ]
       }
-    )
+    ),
+    ariaLabelId && /* @__PURE__ */ jsx("span", { hidden: true, id: ariaLabelId, children: ariaLabel })
   ] });
 });
 const CAPTION_FORMAT = "LLLL y";
@@ -7736,6 +8726,18 @@ const CalendarHeader = memo(function CalendarHeader2({
     }
   );
 });
+const CalendarMonthGrid = memo(function CalendarMonthGrid2({
+  children,
+  "aria-label": ariaLabel,
+  ...otherProps
+}) {
+  const prefix = usePrefix();
+  const captionId = prefix(`calendar-grid-caption-${useId()}`);
+  return /* @__PURE__ */ jsxs("table", { ...otherProps, "aria-labelledby": captionId, children: [
+    /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx("caption", { id: captionId, children: ariaLabel }) }),
+    children
+  ] });
+});
 function Calendar({
   required,
   minDate,
@@ -7878,6 +8880,7 @@ function Calendar({
           disabled: composedDisabled,
           components: {
             MonthCaption: CalendarHeader,
+            MonthGrid: CalendarMonthGrid,
             Day: CalendarDay,
             Nav: () => null
           },
@@ -8036,87 +9039,89 @@ const CheckboxGroup = forwardRef(function CheckboxGroup2({
     ControlContext.Provider,
     {
       value: { variant, status, disabled, loading, readOnly },
-      children: /* @__PURE__ */ jsx(CheckboxGroupContext.Provider, { value: checkboxGroupContextValue, children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          role: "group",
-          id: controlId,
-          ...otherProps,
-          "data-status": status,
-          "data-accent": controlStatusToAccent(status),
-          "data-variant": variant,
-          className: cx(
-            prefix("checkbox-group"),
-            inline && prefix("checkbox-group--inline"),
-            className
-          ),
-          onMouseDown: combineEventHandlers(onMouseDown, handleMouseDown),
-          onFocus: combineEventHandlers(onFocus, handleFocus),
-          onBlur: combineEventHandlers(onBlur, handleBlur),
-          "aria-disabled": loading || readOnly || void 0,
-          "aria-label": ariaLabel,
-          "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 ? combineAriaIds(codeId, labelId ?? dataTableColumnLabelId) : void 0),
-          tabIndex,
-          ref: combinedCheckboxGroupRef,
-          children: [
-            code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
-              ControlCode,
-              {
-                status,
-                ...codeProps,
-                id: codeId,
-                className: cx(
-                  prefix("checkbox-group__code"),
-                  codeProps?.className
-                ),
-                children: code
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                "data-status": status,
-                "data-variant": variant,
-                "data-disabled": boolDataAttr(disabled || loading),
-                "data-readonly": boolDataAttr(readOnly),
-                ...containerProps,
-                className: cx(
-                  prefix("checkbox-group__container"),
-                  containerProps?.className
-                ),
-                children: /* @__PURE__ */ jsx(ClearContexts, { children })
-              }
-            ),
-            showSpinner && /* @__PURE__ */ jsx(
-              "div",
-              {
-                "data-status": status,
-                "data-variant": variant,
-                "data-disabled": boolDataAttr(disabled || loading),
-                "data-readonly": boolDataAttr(readOnly),
-                ...endContainerProps,
-                className: cx(
-                  prefix("checkbox-group__end-container"),
-                  endContainerProps?.className
-                ),
-                children: /* @__PURE__ */ jsx(
-                  Spinner,
-                  {
-                    color: controlStatusToAccent(status, "neutral"),
-                    "data-disabled": boolDataAttr(disabled || loading),
-                    ...spinnerProps,
-                    className: cx(
-                      prefix("checkbox-group__spinner"),
-                      spinnerProps?.className
-                    )
-                  }
-                )
-              }
+      children: /* @__PURE__ */ jsxs(CheckboxGroupContext.Provider, { value: checkboxGroupContextValue, children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            role: "group",
+            id: controlId,
+            ...otherProps,
+            "data-status": status,
+            "data-accent": controlStatusToAccent(status),
+            "data-variant": variant,
+            className: cx(
+              prefix("checkbox-group"),
+              inline && prefix("checkbox-group--inline"),
+              className
             ),
-            loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
-          ]
-        }
-      ) })
+            onMouseDown: combineEventHandlers(onMouseDown, handleMouseDown),
+            onFocus: combineEventHandlers(onFocus, handleFocus),
+            onBlur: combineEventHandlers(onBlur, handleBlur),
+            "aria-disabled": loading || readOnly || void 0,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 ? combineAriaIds(codeId, labelId ?? dataTableColumnLabelId) : void 0),
+            tabIndex,
+            ref: combinedCheckboxGroupRef,
+            children: [
+              code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
+                ControlCode,
+                {
+                  status,
+                  ...codeProps,
+                  id: codeId,
+                  className: cx(
+                    prefix("checkbox-group__code"),
+                    codeProps?.className
+                  ),
+                  children: code
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "data-status": status,
+                  "data-variant": variant,
+                  "data-disabled": boolDataAttr(disabled || loading),
+                  "data-readonly": boolDataAttr(readOnly),
+                  ...containerProps,
+                  className: cx(
+                    prefix("checkbox-group__container"),
+                    containerProps?.className
+                  ),
+                  children: /* @__PURE__ */ jsx(ClearContexts, { children })
+                }
+              ),
+              showSpinner && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  "data-status": status,
+                  "data-variant": variant,
+                  "data-disabled": boolDataAttr(disabled || loading),
+                  "data-readonly": boolDataAttr(readOnly),
+                  ...endContainerProps,
+                  className: cx(
+                    prefix("checkbox-group__end-container"),
+                    endContainerProps?.className
+                  ),
+                  children: /* @__PURE__ */ jsx(
+                    Spinner,
+                    {
+                      color: controlStatusToAccent(status, "neutral"),
+                      "data-disabled": boolDataAttr(disabled || loading),
+                      ...spinnerProps,
+                      className: cx(
+                        prefix("checkbox-group__spinner"),
+                        spinnerProps?.className
+                      )
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
+      ] })
     }
   ) });
 });
@@ -8444,7 +9449,7 @@ const DateInput = forwardRef(
             showClearButton,
             endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
               endAdornment,
-              /* @__PURE__ */ jsx(Tooltip, { content: calendarButtonLabel, children: /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsxs(
+              /* @__PURE__ */ jsx(Tooltip, { content: calendarButtonLabel, children: /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsx(
                 "button",
                 {
                   className: printHidden,
@@ -8453,10 +9458,7 @@ const DateInput = forwardRef(
                   "data-state": void 0,
                   ref: addonButtonRef,
                   "aria-describedby": selectedDateDescriptionId,
-                  children: [
-                    /* @__PURE__ */ jsx(Icon, { icon: faCalendar }),
-                    /* @__PURE__ */ jsx(VisuallyHidden, { children: calendarButtonLabel })
-                  ]
+                  children: /* @__PURE__ */ jsx(Icon, { icon: faCalendar, label: calendarButtonLabel })
                 }
               ) }) }) })
             ] }),
@@ -9077,402 +10079,401 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
     popoverRef,
     popoverContentProps?.ref
   );
-  return /* @__PURE__ */ jsx(ClearContexts, { field: false, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(ClearContexts, { field: false, children: /* @__PURE__ */ jsxs(
     ControlContext.Provider,
     {
       value: { variant, status, disabled, loading, readOnly },
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          "data-status": status,
-          "data-accent": controlStatusToAccent(status),
-          "data-variant": variant,
-          "data-disabled": boolDataAttr(
-            disabled || loading || startInputProps?.disabled && endInputProps?.disabled
-          ),
-          "data-readonly": boolDataAttr(
-            readOnly || startInputProps?.readOnly && endInputProps?.readOnly
-          ),
-          className: cx(prefix("date-range-input__root"), className),
-          ...otherProps,
-          ref: forwardedRef,
-          children: [
-            startInputLabelId && /* @__PURE__ */ jsx("span", { hidden: true, id: startInputLabelId, children: startInputLabel }),
-            endInputLabelId && /* @__PURE__ */ jsx("span", { hidden: true, id: endInputLabelId, children: endInputLabel }),
-            loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription }),
-            formatDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: formatDescriptionId, children: formatDescription }),
-            selectedStartDateDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedStartDateDescriptionId, children: selectedDateDescription(descriptionFormattedStart) }),
-            selectedEndDateDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedEndDateDescriptionId, children: selectedDateDescription(descriptionFormattedEnd) }),
-            selectedDateRangeDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedDateRangeDescriptionId, children: selectedDateRangeDescription({
-              start: descriptionFormattedStart,
-              end: descriptionFormattedEnd
-            }) }),
-            code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
-              ControlCode,
-              {
-                ...codeProps,
-                id: codeId,
-                className: cx(
-                  prefix("date-range-input__code"),
-                  codeProps?.className
-                ),
-                children: code
-              }
-            ),
-            /* @__PURE__ */ jsxs(Popover, { open: popoverState.open, modal: popoverState.modal, children: [
-              /* @__PURE__ */ jsxs(
-                PopoverAnchor,
-                {
-                  "data-status": status,
-                  "data-accent": controlStatusToAccent(status),
-                  "data-variant": variant,
-                  "data-disabled": boolDataAttr(
-                    disabled || loading || startInputProps?.disabled && endInputProps?.disabled
-                  ),
-                  "data-readonly": boolDataAttr(
-                    readOnly || startInputProps?.readOnly && endInputProps?.readOnly
-                  ),
-                  ...popoverAnchorProps,
-                  className: cx(
-                    prefix("date-range-input__container"),
-                    prefix("date-range-input__popover-anchor"),
-                    popoverAnchorProps?.className
-                  ),
-                  children: [
-                    startAdornment,
-                    /* @__PURE__ */ jsxs(
-                      "div",
-                      {
-                        "data-focused": boolDataAttr(
-                          !disabled && !startInputProps?.disabled && popoverState.open && selectionMode === "start"
-                        ),
-                        "data-status": status,
-                        "data-accent": controlStatusToAccent(status),
-                        "data-variant": variant,
-                        "data-disabled": boolDataAttr(
-                          disabled || loading || startInputProps?.disabled && endInputProps?.disabled
-                        ),
-                        "data-readonly": boolDataAttr(
-                          readOnly || startInputProps?.readOnly && endInputProps?.readOnly
-                        ),
-                        ...startContainerProps,
-                        className: cx(
-                          prefix("date-range-input__container"),
-                          prefix("date-range-input__container--start"),
-                          startContainerProps?.className
-                        ),
-                        onPointerDown: combineEventHandlers(
-                          startContainerProps?.onPointerDown,
-                          handleContainerPointerDown("start")
-                        ),
-                        ref: combinedStartContainerRef,
-                        children: [
-                          /* @__PURE__ */ jsx(
-                            "input",
-                            {
-                              ...startInputProps,
-                              id: controlId,
-                              "data-loading": boolDataAttr(loading),
-                              "data-status": status,
-                              "data-variant": variant,
-                              className: cx(
-                                prefix("date-range-input"),
-                                prefix("date-range-input--start"),
-                                startInputProps?.className
-                              ),
-                              value: formattedValue.start,
-                              placeholder: startInputProps?.placeholder ?? startPlaceholder ?? placeholder,
-                              required: required || startInputProps?.required,
-                              disabled: disabled || startInputProps?.disabled,
-                              readOnly: readOnly || loading || startInputProps?.readOnly,
-                              onChange: combineEventHandlers(
-                                startInputProps?.onChange,
-                                handleStartInputChange
-                              ),
-                              onFocus: combineEventHandlers(
-                                startInputProps?.onFocus,
-                                handleInputFocus("start")
-                              ),
-                              onBlur: combineEventHandlers(
-                                startInputProps?.onBlur,
-                                handleControlBlur
-                              ),
-                              style: { ...cssVars, ...startInputProps?.style },
-                              ...dataAttrs,
-                              "aria-invalid": status === "invalid" || void 0,
-                              "aria-labelledby": startInputProps?.["aria-labelledby"] ?? (startInputProps?.["aria-label"] === void 0 ? combineAriaIds(
-                                codeId,
-                                labelId ?? dataTableColumnLabelId,
-                                startInputLabelId
-                              ) : void 0),
-                              "aria-describedby": combineAriaIds(
-                                loadingDescriptionId,
-                                errorMessageIds,
-                                startInputProps?.["aria-describedby"],
-                                descriptionIds,
-                                formatDescriptionId,
-                                selectedStartDateDescriptionId
-                              ),
-                              ref: combinedStartInputRef
-                            }
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-status": status,
+            "data-accent": controlStatusToAccent(status),
+            "data-variant": variant,
+            "data-disabled": boolDataAttr(
+              disabled || loading || startInputProps?.disabled && endInputProps?.disabled
+            ),
+            "data-readonly": boolDataAttr(
+              readOnly || startInputProps?.readOnly && endInputProps?.readOnly
+            ),
+            className: cx(prefix("date-range-input__root"), className),
+            ...otherProps,
+            ref: forwardedRef,
+            children: [
+              code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
+                ControlCode,
+                {
+                  ...codeProps,
+                  id: codeId,
+                  className: cx(
+                    prefix("date-range-input__code"),
+                    codeProps?.className
+                  ),
+                  children: code
+                }
+              ),
+              /* @__PURE__ */ jsxs(Popover, { open: popoverState.open, modal: popoverState.modal, children: [
+                /* @__PURE__ */ jsxs(
+                  PopoverAnchor,
+                  {
+                    "data-status": status,
+                    "data-accent": controlStatusToAccent(status),
+                    "data-variant": variant,
+                    "data-disabled": boolDataAttr(
+                      disabled || loading || startInputProps?.disabled && endInputProps?.disabled
+                    ),
+                    "data-readonly": boolDataAttr(
+                      readOnly || startInputProps?.readOnly && endInputProps?.readOnly
+                    ),
+                    ...popoverAnchorProps,
+                    className: cx(
+                      prefix("date-range-input__container"),
+                      prefix("date-range-input__popover-anchor"),
+                      popoverAnchorProps?.className
+                    ),
+                    children: [
+                      startAdornment,
+                      /* @__PURE__ */ jsxs(
+                        "div",
+                        {
+                          "data-focused": boolDataAttr(
+                            !disabled && !startInputProps?.disabled && popoverState.open && selectionMode === "start"
                           ),
-                          hasStartClearButton && /* @__PURE__ */ jsx(
-                            CloseButton,
-                            {
-                              size: "sm",
-                              label: clearButtonsLabel,
-                              tabIndex: -1,
-                              ...startClearButtonProps,
-                              className: cx(
-                                prefix("date-range-input__clear-button"),
-                                prefix("date-range-input__clear-button--start"),
-                                printHidden,
-                                startClearButtonProps?.className
-                              ),
-                              onClick: combineEventHandlers(
-                                startClearButtonProps?.onClick,
-                                handleClearButtonClick(startInputRef),
-                                { checkDefaultPrevented: true }
-                              ),
-                              ref: combinedStartClearButtonRef
-                            }
+                          "data-status": status,
+                          "data-accent": controlStatusToAccent(status),
+                          "data-variant": variant,
+                          "data-disabled": boolDataAttr(
+                            disabled || loading || startInputProps?.disabled && endInputProps?.disabled
                           ),
-                          showStartSpinner && /* @__PURE__ */ jsx(
-                            Spinner,
-                            {
-                              color: controlStatusToAccent(status, "neutral"),
-                              "data-disabled": boolDataAttr(
-                                disabled || loading || startInputProps?.disabled
-                              ),
-                              ...spinnerProps,
-                              className: cx(
-                                prefix("date-range-input__spinner"),
-                                prefix("date-range-input__spinner--start"),
-                                spinnerProps?.className
-                              )
-                            }
-                          )
-                        ]
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(ControlAddon, { className: cx(prefix("date-range-input__arrow")), children: /* @__PURE__ */ jsx(Icon, { icon: faArrowRight }) }),
-                    /* @__PURE__ */ jsxs(
-                      "div",
-                      {
-                        "data-focused": boolDataAttr(
-                          !disabled && !endInputProps?.disabled && popoverState.open && selectionMode === "end"
-                        ),
-                        "data-status": status,
-                        "data-accent": controlStatusToAccent(status),
-                        "data-variant": variant,
-                        "data-disabled": boolDataAttr(
-                          disabled || loading || startInputProps?.disabled && endInputProps?.disabled
-                        ),
-                        "data-readonly": boolDataAttr(
-                          readOnly || startInputProps?.readOnly && endInputProps?.readOnly
-                        ),
-                        ...endContainerProps,
-                        className: cx(
-                          prefix("date-range-input__container"),
-                          prefix("date-range-input__container--end"),
-                          endContainerProps?.className
-                        ),
-                        onPointerDown: combineEventHandlers(
-                          endContainerProps?.onPointerDown,
-                          handleContainerPointerDown("end")
-                        ),
-                        ref: combinedEndContainerRef,
-                        children: [
-                          /* @__PURE__ */ jsx(
-                            "input",
-                            {
-                              ...endInputProps,
-                              "data-loading": boolDataAttr(loading),
-                              "data-status": status,
-                              "data-variant": variant,
-                              className: cx(
-                                prefix("date-range-input"),
-                                prefix("date-range-input--end"),
-                                endInputProps?.className
-                              ),
-                              value: formattedValue.end,
-                              placeholder: endInputProps?.placeholder ?? endPlaceholder ?? placeholder,
-                              required: required || endInputProps?.required,
-                              disabled: disabled || endInputProps?.disabled,
-                              readOnly: readOnly || loading || endInputProps?.readOnly,
-                              onChange: combineEventHandlers(
-                                endInputProps?.onChange,
-                                handleEndInputChange
-                              ),
-                              onFocus: combineEventHandlers(
-                                endInputProps?.onFocus,
-                                handleInputFocus("end")
-                              ),
-                              onBlur: combineEventHandlers(
-                                endInputProps?.onBlur,
-                                handleControlBlur
-                              ),
-                              style: { ...cssVars, ...endInputProps?.style },
-                              ...dataAttrs,
-                              "aria-invalid": status === "invalid" || void 0,
-                              "aria-labelledby": endInputProps?.["aria-labelledby"] ?? (endInputProps?.["aria-label"] === void 0 ? combineAriaIds(
-                                codeId,
-                                labelId ?? dataTableColumnLabelId,
-                                endInputLabelId
-                              ) : void 0),
-                              "aria-describedby": combineAriaIds(
-                                loadingDescriptionId,
-                                errorMessageIds,
-                                endInputProps?.["aria-describedby"],
-                                descriptionIds,
-                                formatDescriptionId,
-                                selectedEndDateDescriptionId
-                              ),
-                              ref: combinedEndInputRef
-                            }
+                          "data-readonly": boolDataAttr(
+                            readOnly || startInputProps?.readOnly && endInputProps?.readOnly
                           ),
-                          hasEndClearButton && /* @__PURE__ */ jsx(
-                            CloseButton,
-                            {
-                              size: "sm",
-                              label: clearButtonsLabel,
-                              tabIndex: -1,
-                              ...endClearButtonProps,
-                              className: cx(
-                                prefix("date-range-input__clear-button"),
-                                prefix("date-range-input__clear-button--end"),
-                                printHidden,
-                                endClearButtonProps?.className
-                              ),
-                              onClick: combineEventHandlers(
-                                endClearButtonProps?.onClick,
-                                handleClearButtonClick(endInputRef),
-                                { checkDefaultPrevented: true }
-                              ),
-                              ref: combinedEndClearButtonRef
-                            }
+                          ...startContainerProps,
+                          className: cx(
+                            prefix("date-range-input__container"),
+                            prefix("date-range-input__container--start"),
+                            startContainerProps?.className
                           ),
-                          showEndSpinner && /* @__PURE__ */ jsx(
-                            Spinner,
-                            {
-                              color: controlStatusToAccent(status, "neutral"),
-                              "data-disabled": boolDataAttr(
-                                disabled || loading || endInputProps?.disabled
-                              ),
-                              ...spinnerProps,
-                              className: cx(
-                                prefix("date-range-input__spinner"),
-                                prefix("date-range-input__spinner--end"),
-                                spinnerProps?.className
-                              )
-                            }
-                          )
-                        ]
-                      }
+                          onPointerDown: combineEventHandlers(
+                            startContainerProps?.onPointerDown,
+                            handleContainerPointerDown("start")
+                          ),
+                          ref: combinedStartContainerRef,
+                          children: [
+                            /* @__PURE__ */ jsx(
+                              "input",
+                              {
+                                ...startInputProps,
+                                id: controlId,
+                                "data-loading": boolDataAttr(loading),
+                                "data-status": status,
+                                "data-variant": variant,
+                                className: cx(
+                                  prefix("date-range-input"),
+                                  prefix("date-range-input--start"),
+                                  startInputProps?.className
+                                ),
+                                value: formattedValue.start,
+                                placeholder: startInputProps?.placeholder ?? startPlaceholder ?? placeholder,
+                                required: required || startInputProps?.required,
+                                disabled: disabled || startInputProps?.disabled,
+                                readOnly: readOnly || loading || startInputProps?.readOnly,
+                                onChange: combineEventHandlers(
+                                  startInputProps?.onChange,
+                                  handleStartInputChange
+                                ),
+                                onFocus: combineEventHandlers(
+                                  startInputProps?.onFocus,
+                                  handleInputFocus("start")
+                                ),
+                                onBlur: combineEventHandlers(
+                                  startInputProps?.onBlur,
+                                  handleControlBlur
+                                ),
+                                style: { ...cssVars, ...startInputProps?.style },
+                                ...dataAttrs,
+                                "aria-invalid": status === "invalid" || void 0,
+                                "aria-labelledby": startInputProps?.["aria-labelledby"] ?? (startInputProps?.["aria-label"] === void 0 ? combineAriaIds(
+                                  codeId,
+                                  labelId ?? dataTableColumnLabelId,
+                                  startInputLabelId
+                                ) : void 0),
+                                "aria-describedby": combineAriaIds(
+                                  loadingDescriptionId,
+                                  errorMessageIds,
+                                  startInputProps?.["aria-describedby"],
+                                  descriptionIds,
+                                  formatDescriptionId,
+                                  selectedStartDateDescriptionId
+                                ),
+                                ref: combinedStartInputRef
+                              }
+                            ),
+                            hasStartClearButton && /* @__PURE__ */ jsx(
+                              CloseButton,
+                              {
+                                size: "sm",
+                                label: clearButtonsLabel,
+                                tabIndex: -1,
+                                ...startClearButtonProps,
+                                className: cx(
+                                  prefix("date-range-input__clear-button"),
+                                  prefix("date-range-input__clear-button--start"),
+                                  printHidden,
+                                  startClearButtonProps?.className
+                                ),
+                                onClick: combineEventHandlers(
+                                  startClearButtonProps?.onClick,
+                                  handleClearButtonClick(startInputRef),
+                                  { checkDefaultPrevented: true }
+                                ),
+                                ref: combinedStartClearButtonRef
+                              }
+                            ),
+                            showStartSpinner && /* @__PURE__ */ jsx(
+                              Spinner,
+                              {
+                                color: controlStatusToAccent(status, "neutral"),
+                                "data-disabled": boolDataAttr(
+                                  disabled || loading || startInputProps?.disabled
+                                ),
+                                ...spinnerProps,
+                                className: cx(
+                                  prefix("date-range-input__spinner"),
+                                  prefix("date-range-input__spinner--start"),
+                                  spinnerProps?.className
+                                )
+                              }
+                            )
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(ControlAddon, { className: cx(prefix("date-range-input__arrow")), children: /* @__PURE__ */ jsx(Icon, { icon: faArrowRight }) }),
+                      /* @__PURE__ */ jsxs(
+                        "div",
+                        {
+                          "data-focused": boolDataAttr(
+                            !disabled && !endInputProps?.disabled && popoverState.open && selectionMode === "end"
+                          ),
+                          "data-status": status,
+                          "data-accent": controlStatusToAccent(status),
+                          "data-variant": variant,
+                          "data-disabled": boolDataAttr(
+                            disabled || loading || startInputProps?.disabled && endInputProps?.disabled
+                          ),
+                          "data-readonly": boolDataAttr(
+                            readOnly || startInputProps?.readOnly && endInputProps?.readOnly
+                          ),
+                          ...endContainerProps,
+                          className: cx(
+                            prefix("date-range-input__container"),
+                            prefix("date-range-input__container--end"),
+                            endContainerProps?.className
+                          ),
+                          onPointerDown: combineEventHandlers(
+                            endContainerProps?.onPointerDown,
+                            handleContainerPointerDown("end")
+                          ),
+                          ref: combinedEndContainerRef,
+                          children: [
+                            /* @__PURE__ */ jsx(
+                              "input",
+                              {
+                                ...endInputProps,
+                                "data-loading": boolDataAttr(loading),
+                                "data-status": status,
+                                "data-variant": variant,
+                                className: cx(
+                                  prefix("date-range-input"),
+                                  prefix("date-range-input--end"),
+                                  endInputProps?.className
+                                ),
+                                value: formattedValue.end,
+                                placeholder: endInputProps?.placeholder ?? endPlaceholder ?? placeholder,
+                                required: required || endInputProps?.required,
+                                disabled: disabled || endInputProps?.disabled,
+                                readOnly: readOnly || loading || endInputProps?.readOnly,
+                                onChange: combineEventHandlers(
+                                  endInputProps?.onChange,
+                                  handleEndInputChange
+                                ),
+                                onFocus: combineEventHandlers(
+                                  endInputProps?.onFocus,
+                                  handleInputFocus("end")
+                                ),
+                                onBlur: combineEventHandlers(
+                                  endInputProps?.onBlur,
+                                  handleControlBlur
+                                ),
+                                style: { ...cssVars, ...endInputProps?.style },
+                                ...dataAttrs,
+                                "aria-invalid": status === "invalid" || void 0,
+                                "aria-labelledby": endInputProps?.["aria-labelledby"] ?? (endInputProps?.["aria-label"] === void 0 ? combineAriaIds(
+                                  codeId,
+                                  labelId ?? dataTableColumnLabelId,
+                                  endInputLabelId
+                                ) : void 0),
+                                "aria-describedby": combineAriaIds(
+                                  loadingDescriptionId,
+                                  errorMessageIds,
+                                  endInputProps?.["aria-describedby"],
+                                  descriptionIds,
+                                  formatDescriptionId,
+                                  selectedEndDateDescriptionId
+                                ),
+                                ref: combinedEndInputRef
+                              }
+                            ),
+                            hasEndClearButton && /* @__PURE__ */ jsx(
+                              CloseButton,
+                              {
+                                size: "sm",
+                                label: clearButtonsLabel,
+                                tabIndex: -1,
+                                ...endClearButtonProps,
+                                className: cx(
+                                  prefix("date-range-input__clear-button"),
+                                  prefix("date-range-input__clear-button--end"),
+                                  printHidden,
+                                  endClearButtonProps?.className
+                                ),
+                                onClick: combineEventHandlers(
+                                  endClearButtonProps?.onClick,
+                                  handleClearButtonClick(endInputRef),
+                                  { checkDefaultPrevented: true }
+                                ),
+                                ref: combinedEndClearButtonRef
+                              }
+                            ),
+                            showEndSpinner && /* @__PURE__ */ jsx(
+                              Spinner,
+                              {
+                                color: controlStatusToAccent(status, "neutral"),
+                                "data-disabled": boolDataAttr(
+                                  disabled || loading || endInputProps?.disabled
+                                ),
+                                ...spinnerProps,
+                                className: cx(
+                                  prefix("date-range-input__spinner"),
+                                  prefix("date-range-input__spinner--end"),
+                                  spinnerProps?.className
+                                )
+                              }
+                            )
+                          ]
+                        }
+                      ),
+                      endAdornment,
+                      /* @__PURE__ */ jsx(Tooltip, { content: calendarButtonLabel, children: /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          onClick: handleAddonButtonClick,
+                          onBlur: handleControlBlur,
+                          "data-state": void 0,
+                          className: cx(
+                            prefix("date-range-input__calendar-button"),
+                            printHidden
+                          ),
+                          ref: addonButtonRef,
+                          "aria-describedby": selectedDateRangeDescriptionId,
+                          children: /* @__PURE__ */ jsx(Icon, { icon: faCalendar, label: calendarButtonLabel })
+                        }
+                      ) }) }) })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  PopoverContent,
+                  {
+                    ...popoverContentProps,
+                    className: cx(
+                      prefix("date-range-input__popover"),
+                      popoverContentProps?.className
+                    ),
+                    side: popoverContentProps?.side ?? "bottom",
+                    sideOffset: popoverContentProps?.sideOffset ?? 5,
+                    showArrow: popoverContentProps?.showArrow ?? false,
+                    onOpenAutoFocus: combineEventHandlers(
+                      popoverContentProps?.onOpenAutoFocus,
+                      handlePopoverOpenAutoFocus
                     ),
-                    endAdornment,
-                    /* @__PURE__ */ jsx(Tooltip, { content: calendarButtonLabel, children: /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsxs(
-                      "button",
+                    onEscapeKeyDown: combineEventHandlers(
+                      popoverContentProps?.onEscapeKeyDown,
+                      handlePopoverEscapeKeyDown
+                    ),
+                    onPointerDownOutside: combineEventHandlers(
+                      popoverContentProps?.onPointerDownOutside,
+                      handlePopoverPointerDownOutside
+                    ),
+                    onInteractOutside: combineEventHandlers(
+                      popoverContentProps?.onInteractOutside,
+                      handlePopoverInteractOutside
+                    ),
+                    onBlur: combineEventHandlers(
+                      popoverContentProps?.onBlur,
+                      handleControlBlur
+                    ),
+                    ref: combinedPopoverRef,
+                    children: /* @__PURE__ */ jsx(
+                      DateRangePicker,
                       {
-                        onClick: handleAddonButtonClick,
-                        onBlur: handleControlBlur,
-                        "data-state": void 0,
                         className: cx(
-                          prefix("date-range-input__calendar-button"),
-                          printHidden
+                          prefix("date-range-input__picker"),
+                          dateRangePickerProps?.className
                         ),
-                        ref: addonButtonRef,
-                        "aria-describedby": selectedDateRangeDescriptionId,
-                        children: [
-                          /* @__PURE__ */ jsx(Icon, { icon: faCalendar }),
-                          /* @__PURE__ */ jsx(VisuallyHidden, { children: calendarButtonLabel })
-                        ]
-                      }
-                    ) }) }) })
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                PopoverContent,
-                {
-                  ...popoverContentProps,
-                  className: cx(
-                    prefix("date-range-input__popover"),
-                    popoverContentProps?.className
-                  ),
-                  side: popoverContentProps?.side ?? "bottom",
-                  sideOffset: popoverContentProps?.sideOffset ?? 5,
-                  showArrow: popoverContentProps?.showArrow ?? false,
-                  onOpenAutoFocus: combineEventHandlers(
-                    popoverContentProps?.onOpenAutoFocus,
-                    handlePopoverOpenAutoFocus
-                  ),
-                  onEscapeKeyDown: combineEventHandlers(
-                    popoverContentProps?.onEscapeKeyDown,
-                    handlePopoverEscapeKeyDown
-                  ),
-                  onPointerDownOutside: combineEventHandlers(
-                    popoverContentProps?.onPointerDownOutside,
-                    handlePopoverPointerDownOutside
-                  ),
-                  onInteractOutside: combineEventHandlers(
-                    popoverContentProps?.onInteractOutside,
-                    handlePopoverInteractOutside
-                  ),
-                  onBlur: combineEventHandlers(
-                    popoverContentProps?.onBlur,
-                    handleControlBlur
-                  ),
-                  ref: combinedPopoverRef,
-                  children: /* @__PURE__ */ jsx(
-                    DateRangePicker,
-                    {
-                      className: cx(
-                        prefix("date-range-input__picker"),
-                        dateRangePickerProps?.className
-                      ),
-                      ...dateRangePickerProps,
-                      value: deferredDateValue,
-                      onChange: combineEventHandlers(
-                        dateRangePickerProps?.onChange,
-                        handleDatePickerChange
-                      ),
-                      selectionMode,
-                      month,
-                      onMonthChange: handleMonthChange,
-                      disabled: disabled || loading || readOnly || (startInputProps?.disabled || startInputProps?.readOnly) && (endInputProps?.disabled || endInputProps?.readOnly) || dateRangePickerProps?.disabled,
-                      minDate,
-                      maxDate,
-                      minMonth,
-                      maxMonth,
-                      minYear,
-                      maxYear,
-                      monthSelectProps: {
-                        ...dateRangePickerProps?.monthSelectProps,
-                        popoverProps: {
-                          ...dateRangePickerProps?.monthSelectProps?.popoverProps,
-                          ref: monthSelectMenuRef
-                        }
-                      },
-                      yearSelectProps: {
-                        ...dateRangePickerProps?.yearSelectProps,
-                        popoverProps: {
-                          ...dateRangePickerProps?.yearSelectProps?.popoverProps,
-                          ref: yearSelectMenuRef
+                        ...dateRangePickerProps,
+                        value: deferredDateValue,
+                        onChange: combineEventHandlers(
+                          dateRangePickerProps?.onChange,
+                          handleDatePickerChange
+                        ),
+                        selectionMode,
+                        month,
+                        onMonthChange: handleMonthChange,
+                        disabled: disabled || loading || readOnly || (startInputProps?.disabled || startInputProps?.readOnly) && (endInputProps?.disabled || endInputProps?.readOnly) || dateRangePickerProps?.disabled,
+                        minDate,
+                        maxDate,
+                        minMonth,
+                        maxMonth,
+                        minYear,
+                        maxYear,
+                        monthSelectProps: {
+                          ...dateRangePickerProps?.monthSelectProps,
+                          popoverProps: {
+                            ...dateRangePickerProps?.monthSelectProps?.popoverProps,
+                            ref: monthSelectMenuRef
+                          }
+                        },
+                        yearSelectProps: {
+                          ...dateRangePickerProps?.yearSelectProps,
+                          popoverProps: {
+                            ...dateRangePickerProps?.yearSelectProps?.popoverProps,
+                            ref: yearSelectMenuRef
+                          }
+                        },
+                        headerLabelProps: {
+                          role: popoverState.modal ? "status" : void 0,
+                          ...dateRangePickerProps?.headerLabelProps
                         }
-                      },
-                      headerLabelProps: {
-                        role: popoverState.modal ? "status" : void 0,
-                        ...dateRangePickerProps?.headerLabelProps
                       }
-                    }
-                  )
-                }
-              )
-            ] })
-          ]
-        }
-      )
+                    )
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        startInputLabelId && /* @__PURE__ */ jsx("span", { hidden: true, id: startInputLabelId, children: startInputLabel }),
+        endInputLabelId && /* @__PURE__ */ jsx("span", { hidden: true, id: endInputLabelId, children: endInputLabel }),
+        loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription }),
+        formatDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: formatDescriptionId, children: formatDescription }),
+        selectedStartDateDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedStartDateDescriptionId, children: selectedDateDescription(descriptionFormattedStart) }),
+        selectedEndDateDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedEndDateDescriptionId, children: selectedDateDescription(descriptionFormattedEnd) }),
+        selectedDateRangeDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedDateRangeDescriptionId, children: selectedDateRangeDescription({
+          start: descriptionFormattedStart,
+          end: descriptionFormattedEnd
+        }) })
+      ]
     }
   ) });
 });
@@ -10056,7 +11057,7 @@ const Feedback = forwardRef(
     const [locale7] = useLocale();
     visuallyHiddenPrefix ??= locale7.Feedback.visuallyHiddenPrefix;
     const { onAddFeedback, onRemoveFeedback } = useFeedbackPopoverContext() ?? {};
-    useLayoutEffect(() => {
+    useLayoutEffect$1(() => {
       onAddFeedback?.(type);
       return () => onRemoveFeedback?.(type);
     }, [onAddFeedback, onRemoveFeedback, type]);
@@ -10360,7 +11361,7 @@ const Link = forwardRef(function Link2({
   );
 });
 function numericToString(v) {
-  return typeof v === "string" ? v : v == null || isNaN(v) ? "" : fromExponential(v);
+  return typeof v === "string" ? v : typeof v === "bigint" ? v.toString() : v == null || isNaN(v) ? "" : fromExponential(v);
 }
 function isNumericStringNegative(v) {
   return v.startsWith("-");
@@ -10674,7 +11675,7 @@ const NumericInput = forwardRef(function NumericInput2({
       thousandSeparator: groupDigits ? groupSeparator : "",
       isAllowed,
       allowNegative,
-      customInput: Input,
+      customInput: Input$1,
       getInputRef: forwardedRef,
       ...otherProps
     }
@@ -10747,7 +11748,7 @@ const Output = forwardRef(
   }, forwardedRef) {
     const prefix = usePrefix();
     return /* @__PURE__ */ jsx(
-      Input,
+      Input$1,
       {
         showSpinner,
         "aria-busy": pending || void 0,
@@ -10806,79 +11807,84 @@ const Radio = forwardRef(function Radio2({
     [loading, readOnly]
   );
   const combinedLabelIds = combineAriaIds(codeId, labelId);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-status": status,
-      ...rootProps,
-      className: cx(prefix("radio__root"), rootProps?.className),
-      children: [
-        codeId && /* @__PURE__ */ jsx(
-          ControlCode,
-          {
-            status,
-            ...codeProps,
-            id: codeId,
-            className: cx(prefix("radio__code"), codeProps?.className),
-            children: code
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          RadioGroup$1.Item,
-          {
-            id: controlId,
-            className: cx(prefix("radio"), className),
-            value: value?.toString() ?? "",
-            disabled,
-            "data-loading": boolDataAttr(loading),
-            "data-readonly": boolDataAttr(readOnly),
-            "data-status": status,
-            "aria-disabled": loading || readOnly || void 0,
-            "aria-label": ariaLabel,
-            "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 && combinedLabelIds !== labelId ? combinedLabelIds : void 0),
-            ...otherProps,
-            onClick: combineEventHandlers(onClick, handleClick),
-            ref: forwardedRef,
-            children: /* @__PURE__ */ jsx(
-              RadioGroup$1.Indicator,
-              {
-                ...indicatorProps,
-                className: cx(prefix("radio__indicator"), indicatorProps?.className)
-              }
-            )
-          }
-        ),
-        labelId && /* @__PURE__ */ jsx(
-          Label,
-          {
-            htmlFor: controlId,
-            "data-status": status,
-            ...labelProps,
-            id: labelId,
-            className: cx(prefix("radio__label"), labelProps?.className),
-            containerProps: {
-              ...labelProps?.containerProps,
-              className: cx(
-                prefix("radio__label-container"),
-                labelProps?.containerProps?.className
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-status": status,
+        ...rootProps,
+        className: cx(prefix("radio__root"), rootProps?.className),
+        children: [
+          codeId && /* @__PURE__ */ jsx(
+            ControlCode,
+            {
+              status,
+              ...codeProps,
+              id: codeId,
+              className: cx(prefix("radio__code"), codeProps?.className),
+              children: code
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            RadioGroup$1.Item,
+            {
+              id: controlId,
+              className: cx(prefix("radio"), className),
+              value: value?.toString() ?? "",
+              disabled,
+              "data-loading": boolDataAttr(loading),
+              "data-readonly": boolDataAttr(readOnly),
+              "data-status": status,
+              "aria-disabled": loading || readOnly || void 0,
+              "aria-label": ariaLabel,
+              "aria-labelledby": ariaLabelledBy ?? (ariaLabel === void 0 && combinedLabelIds !== labelId ? combinedLabelIds : void 0),
+              ...otherProps,
+              onClick: combineEventHandlers(onClick, handleClick),
+              ref: forwardedRef,
+              children: /* @__PURE__ */ jsx(
+                RadioGroup$1.Indicator,
+                {
+                  ...indicatorProps,
+                  className: cx(
+                    prefix("radio__indicator"),
+                    indicatorProps?.className
+                  )
+                }
               )
-            },
-            children
-          }
-        ),
-        showSpinner && /* @__PURE__ */ jsx(
-          Spinner,
-          {
-            "data-status": status,
-            "data-disabled": boolDataAttr(disabled || loading),
-            ...spinnerProps,
-            className: cx(prefix("radio__spinner"), spinnerProps?.className)
-          }
-        ),
-        loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
-      ]
-    }
-  );
+            }
+          ),
+          labelId && /* @__PURE__ */ jsx(
+            Label,
+            {
+              htmlFor: controlId,
+              "data-status": status,
+              ...labelProps,
+              id: labelId,
+              className: cx(prefix("radio__label"), labelProps?.className),
+              containerProps: {
+                ...labelProps?.containerProps,
+                className: cx(
+                  prefix("radio__label-container"),
+                  labelProps?.containerProps?.className
+                )
+              },
+              children
+            }
+          ),
+          showSpinner && /* @__PURE__ */ jsx(
+            Spinner,
+            {
+              "data-status": status,
+              "data-disabled": boolDataAttr(disabled || loading),
+              ...spinnerProps,
+              className: cx(prefix("radio__spinner"), spinnerProps?.className)
+            }
+          )
+        ]
+      }
+    ),
+    loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
+  ] });
 });
 const RadioGroup = forwardRef(function RadioGroup2({
   defaultValue,
@@ -10892,6 +11898,7 @@ const RadioGroup = forwardRef(function RadioGroup2({
   showSpinner = loading,
   code,
   showClearButton,
+  clearDescription,
   clearButtonLabel,
   onBlurToOutside,
   codeProps,
@@ -10917,6 +11924,7 @@ const RadioGroup = forwardRef(function RadioGroup2({
   const [locale7] = useLocale();
   loadingDescription ??= locale7.Input.loadingDescription;
   clearButtonLabel ??= locale7.Input.clearButtonLabel;
+  clearDescription ??= locale7.RadioGroup.clearDescription;
   const labelId = useFieldLabelId();
   const dataTableColumnLabelId = useDataTableColumnLabelId();
   const descriptionIds = useFieldDescriptionIds();
@@ -10964,6 +11972,7 @@ const RadioGroup = forwardRef(function RadioGroup2({
     radioGroupRef.current?.focus();
   }, [handleValueChange]);
   const hasClearButton = !disabled && !loading && !readOnly && (showClearButton === true || showClearButton === "auto" && (value?.length ?? 0) > 0);
+  const clearDescriptionId = hasClearButton && clearDescription && prefix(`control-clear-${generatedId}`);
   const handleKeyDown = useCallback(
     (evt) => {
       if (hasClearButton && (evt.code === "Delete" || evt.code === "Backspace")) {
@@ -11001,7 +12010,8 @@ const RadioGroup = forwardRef(function RadioGroup2({
             loadingDescriptionId,
             errorMessageIds,
             ariaDescribedBy,
-            descriptionIds
+            descriptionIds,
+            clearDescriptionId
           ),
           onFocus: combineEventHandlers(onFocus, handleControlFocus),
           onBlur: combineEventHandlers(onBlur, handleControlBlur),
@@ -11089,7 +12099,8 @@ const RadioGroup = forwardRef(function RadioGroup2({
                 ]
               }
             ),
-            loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
+            loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription }),
+            clearDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: clearDescriptionId, children: clearDescription })
           ]
         }
       )
@@ -11099,7 +12110,7 @@ const RadioGroup = forwardRef(function RadioGroup2({
 const Separator = forwardRef(function Separator2({ className, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
   return /* @__PURE__ */ jsx(
-    Separator$1.Root,
+    Separator$2.Root,
     {
       className: cx(prefix("separator"), className),
       ...otherProps,
@@ -11323,7 +12334,7 @@ function useTabsContext() {
 function useRegisterTabLabel(value, label) {
   const { showAllTabsWhilePrinting, store } = useTabsContext();
   const needsRegisteredTabLabels = usePrinting() && showAllTabsWhilePrinting;
-  const { registerTabLabel } = useStore(store, (state) => state.actions);
+  const { registerTabLabel } = useStore$1(store, (state) => state.actions);
   useEffect(() => {
     if (needsRegisteredTabLabels) {
       return registerTabLabel(value, label);
@@ -11332,19 +12343,21 @@ function useRegisterTabLabel(value, label) {
 }
 function useTabLabel(value) {
   const { store } = useTabsContext();
-  return useStore(store, (state) => state.actions.getTabLabel(value));
+  return useStore$1(store, (state) => state.actions.getTabLabel(value));
 }
 const Tab = forwardRef(function Tab2({ value, status, tabInnerProps, className, children, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
   const { variant, store } = useTabsContext();
   const stringValue = value.toString();
-  const isActive = useStore(store, (state) => state.activeTab === stringValue);
+  const isActive = useStore$1(store, (state) => state.activeTab === stringValue);
   useRegisterTabLabel(stringValue, children);
   const tabRef = useRef(null);
+  const prevIsActiveRef = useRef(isActive);
   useEffect(() => {
-    if (isActive) {
+    if (isActive && !prevIsActiveRef.current) {
       setTimeout(() => tabRef.current?.scrollIntoView({ block: "nearest" }));
     }
+    prevIsActiveRef.current = isActive;
   }, [isActive]);
   const combinedTabRef = useCombinedRef(tabRef, forwardedRef);
   return /* @__PURE__ */ jsxs(
@@ -11579,8 +12592,8 @@ function TabListScrollButton({
 }) {
   const prefix = usePrefix();
   const { store } = useTabsContext();
-  const showScrollButtons = useStore(store, (state) => state.showScrollButtons);
-  const shouldDisable = useStore(
+  const showScrollButtons = useStore$1(store, (state) => state.showScrollButtons);
+  const shouldDisable = useStore$1(
     store,
     ({ scrollPosition }) => scrollPosition && (side === "left" ? scrollPosition.left === 0 : scrollPosition.right <= 1)
   );
@@ -11639,7 +12652,7 @@ const TextArea = forwardRef(
   function TextArea2({ rows, ...props }, forwardedRef) {
     const isInTableCell = useIsInTableCell();
     rows ??= isInTableCell ? 1 : DEFAULT_ROWS;
-    return /* @__PURE__ */ jsx(Input, { asChild: true, ...props, children: /* @__PURE__ */ jsx("textarea", { rows, ref: forwardedRef }) });
+    return /* @__PURE__ */ jsx(Input$1, { asChild: true, ...props, children: /* @__PURE__ */ jsx("textarea", { rows, ref: forwardedRef }) });
   }
 );
 function useMediaQuery(query, options) {
@@ -11778,7 +12791,7 @@ function createLocationStore() {
 function useLocation(selector) {
   locationStore ??= createLocationStore();
   useEffect(() => locationStore.getState().actions.subscribe(), []);
-  return useStore(
+  return useStore$1(
     locationStore,
     ({ location: location2 }) => selector ? selector(location2) : location2
   );
@@ -11932,12 +12945,13 @@ export {
   FieldGroupBody,
   FieldGroupHeader,
   FieldGroupTitle,
+  FieldProvider,
   Grid,
   Heading,
   HelperText,
   Icon,
   IconButton,
-  Input,
+  Input$1 as Input,
   InputWithContainerRef,
   Keybinds,
   Keyboard,
@@ -12064,7 +13078,7 @@ export {
   useIsInTableCell,
   useKeyboardShortcut,
   useLatestValues,
-  useLayoutEffect,
+  useLayoutEffect$1 as useLayoutEffect,
   useLocale,
   useLocation,
   useMeasure,