@ostack.tech/ui 0.8.1 → 0.9.0

package/dist/ostack-ui.js

@@ -1,17 +1,18 @@
-import { forwardRef, createContext, useContext, useCallback, useRef, useEffect, useId, useMemo, useState, memo, isValidElement, cloneElement, Fragment as Fragment$1, Children, useImperativeHandle, startTransition, useLayoutEffect as useLayoutEffect$1, createElement, useDeferredValue, useSyncExternalStore } from "react";
-import { tinykeys } from "tinykeys";
+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 { 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 { shallow } from "zustand/shallow";
 import { removeNumericFormat, numericFormatter, NumericFormat } from "react-number-format";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { faClose, faTriangleExclamation, faCircleExclamation, faCircleCheck, faCircleInfo, faChevronUp, faChevronDown, faRedo, faCircleQuestion, faSortDown, faSortUp, faAsterisk, faMinus, faCheck, faFilter, faArrowLeft, faArrowRight, faSearch, faChevronLeft, faChevronRight, faArrowUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
+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, AccessibleIcon, Tooltip as Tooltip$1, VisuallyHidden as VisuallyHidden$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 { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+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 { subscribeWithSelector } from "zustand/middleware";
+import { I as IS_APPLE } from "./chunks/platformUtils-C3IHCr90.js";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { locale } from "./locales/en-GB.js";
 import { locale as locale2 } from "./locales/en-US.js";
 import { locale as locale3, locale as locale4 } from "./locales/fr-FR.js";
@@ -50,7 +51,7 @@ function usePrefix() {
 function cx(...args) {
   const classNames = [];
   for (const arg of args) {
-    if (!arg) {
+    if (!arg || typeof arg === "boolean") {
       continue;
     }
     if (Array.isArray(arg)) {
@@ -1296,6 +1297,128 @@ function setBoolDataAttr(element, attr, condition) {
     delete element.dataset[attr];
   }
 }
+const FORM_CONTROLS = ["INPUT", "TEXTAREA", "SELECT"];
+const KEY_CLEAN_UP = /^Key|^Digit/;
+function registerKeyboardShortcut(keybinds, action, {
+  target = window,
+  eventType = "keydown",
+  sequenceTimeout = 1e3,
+  ignore,
+  capture = false,
+  preventDefault
+} = {}) {
+  const ignorableAction = (event) => {
+    if (!ignore?.(event)) {
+      if (preventDefault) {
+        event.preventDefault();
+      }
+      action(event);
+    }
+  };
+  const keybindsMap = typeof keybinds === "string" ? { [keybinds]: ignorableAction } : keybinds.reduce(
+    (keybindsMap2, shortcut) => {
+      keybindsMap2[shortcut] = ignorableAction;
+      return keybindsMap2;
+    },
+    {}
+  );
+  return tinykeys(target, keybindsMap, {
+    event: eventType,
+    timeout: sequenceTimeout,
+    capture
+  });
+}
+function useKeyboardShortcut(keybinds, action, {
+  disabled,
+  target = window,
+  eventType = "keydown",
+  sequenceTimeout = 1e3,
+  ignore,
+  capture = false,
+  preventDefault
+} = {}) {
+  const keybindsString = Array.isArray(keybinds) ? keybinds.join("__") : keybinds;
+  const latestCallbacks = useLatestValues({ action, ignore });
+  useEffect(() => {
+    if (!disabled && keybindsString && target !== null) {
+      return registerKeyboardShortcut(
+        keybindsString.split("__"),
+        (evt) => latestCallbacks.action(evt),
+        {
+          target,
+          eventType,
+          sequenceTimeout,
+          ignore: (evt) => latestCallbacks.ignore?.(evt) ?? false,
+          capture,
+          preventDefault
+        }
+      );
+    }
+  }, [
+    capture,
+    disabled,
+    eventType,
+    latestCallbacks,
+    preventDefault,
+    sequenceTimeout,
+    keybindsString,
+    target
+  ]);
+}
+function ignoreFormControlsKeyboardShortcut(event) {
+  return event.target !== null && event.target instanceof HTMLElement && FORM_CONTROLS.includes(event.target.tagName);
+}
+function normalizeKeybinds(keybinds) {
+  if (keybinds == null) {
+    return [];
+  }
+  if (!Array.isArray(keybinds)) {
+    keybinds = [keybinds];
+  }
+  return keybinds.map(
+    (keybind) => parseKeybinding(keybind).map((keyPress) => {
+      const mods = keyPress[0];
+      let key = keyPress[1];
+      key = key.replace(KEY_CLEAN_UP, "");
+      if (key.length === 1) {
+        key = key.toUpperCase();
+      } else if (key instanceof RegExp) {
+        key = `(${key.source.slice(1, -1)})`;
+      }
+      return [...mods, key];
+    })
+  );
+}
+function keybindsToAriaKeyShortcuts(keybinds) {
+  return normalizeKeybinds(keybinds).map(
+    (keybind) => keybind.map(
+      (keyPresses) => keyPresses.map((key) => key === "+" ? "plus" : key).join("+")
+    ).join(" ")
+  ).join(" ") || void 0;
+}
+const VisuallyHidden = forwardRef(function VisuallyHidden2({
+  asChild,
+  as = "span",
+  focusable,
+  className,
+  ...otherProps
+}, forwardedRef) {
+  const prefix = usePrefix();
+  const As = asChild ? Slot : as;
+  return /* @__PURE__ */ jsx(
+    As,
+    {
+      className: cx(
+        !focusable && prefix("visually-hidden"),
+        focusable && prefix("visually-hidden-focusable"),
+        className
+      ),
+      tabIndex: focusable ? 0 : void 0,
+      ...otherProps,
+      ref: forwardedRef
+    }
+  );
+});
 const Icon = memo(
   forwardRef(function Icon2({ size, color, label, flip, className, ...otherProps }, forwardedRef) {
     const prefix = usePrefix();
@@ -1313,15 +1436,181 @@ const Icon = memo(
         ...otherProps
       }
     );
-    return label ? /* @__PURE__ */ jsx(AccessibleIcon.Root, { label, children: icon }) : icon;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      icon,
+      label && /* @__PURE__ */ jsx(VisuallyHidden, { children: label })
+    ] });
   })
 );
-const Spinner = forwardRef(
-  function Spinner2({ asChild, size, color, label, className, ...otherProps }, forwardedRef) {
+function intersperse(array, separator) {
+  return array.reduce((acc, element, i, array2) => {
+    acc.push(element);
+    if (i < array2.length - 1) {
+      acc.push(
+        typeof separator === "function" ? separator(i) : separator
+      );
+    }
+    return acc;
+  }, []);
+}
+const Keyboard = forwardRef(
+  function Keyboard2({ asChild, className, ...otherProps }, forwardedRef) {
     const prefix = usePrefix();
-    const As = asChild ? Slot : "span";
-    const spinner = /* @__PURE__ */ jsx(
+    const As = asChild ? Slot : "kbd";
+    return /* @__PURE__ */ jsx(
       As,
+      {
+        className: cx(prefix("keyboard"), className),
+        ref: forwardedRef,
+        ...otherProps
+      }
+    );
+  }
+);
+const DEFAULT_KEY_SYMBOLS = {
+  Control: IS_APPLE ? "⌃" : "Ctrl",
+  Alt: IS_APPLE ? "⌥" : "Alt",
+  Option: IS_APPLE ? "⌥" : "Alt",
+  Shift: IS_APPLE ? "⇧" : "Shift",
+  Meta: IS_APPLE ? "⌘" : "Win",
+  CapsLock: IS_APPLE ? "⇪" : "Caps Lock",
+  Tab: IS_APPLE ? "⇥" : "Tab",
+  ArrowUp: /* @__PURE__ */ jsx(Icon, { icon: faArrowUp }),
+  ArrowDown: /* @__PURE__ */ jsx(Icon, { icon: faArrowDown }),
+  ArrowLeft: /* @__PURE__ */ jsx(Icon, { icon: faArrowLeft }),
+  ArrowRight: /* @__PURE__ */ jsx(Icon, { icon: faArrowRight }),
+  Enter: IS_APPLE ? "⏎" : "↵",
+  Escape: "Esc",
+  Backspace: "⌫",
+  Delete: IS_APPLE ? "⌦" : "Del",
+  Insert: "Ins",
+  PageUp: "PgUp",
+  PageDown: "PgDn"
+};
+const DEFAULT_KEY_LABELS = {
+  Alt: IS_APPLE ? "Option" : "Alt",
+  Option: IS_APPLE ? "Option" : "Alt",
+  Meta: IS_APPLE ? "Command" : "Windows",
+  Enter: IS_APPLE ? "Return" : "Enter"
+};
+function Key({ keyName, keyLabels, keySymbols }) {
+  const [locale7] = useLocale();
+  const localeKeySymbols = locale7.Keybinds.keySymbols;
+  const localeKeyLabels = locale7.Keybinds.keyLabels;
+  const symbol = keySymbols?.[keyName] ?? localeKeySymbols?.[keyName] ?? DEFAULT_KEY_SYMBOLS[keyName];
+  const label = keyLabels?.[keyName] ?? localeKeyLabels?.[keyName] ?? DEFAULT_KEY_LABELS[keyName] ?? keyName;
+  return !symbol || symbol === label ? /* @__PURE__ */ jsx(Keyboard, { children: label }) : /* @__PURE__ */ jsxs(Keyboard, { children: [
+    /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: symbol }),
+    /* @__PURE__ */ jsx(VisuallyHidden, { children: label })
+  ] });
+}
+const KEY_SEPARATOR = IS_APPLE ? " " : " ⁠+ ";
+function KeyPress({
+  keyPress,
+  keySymbols,
+  keyLabels
+}) {
+  return intersperse(
+    keyPress.map((key, i) => /* @__PURE__ */ jsx(
+      Key,
+      {
+        keyName: key,
+        keySymbols,
+        keyLabels
+      },
+      `key-${i}`
+    )),
+    (i) => /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: KEY_SEPARATOR }, `key-separator-${i}`)
+  );
+}
+const KEY_PRESS_SEPARATOR = " ";
+function Keybind({
+  keybind,
+  keyPressesSeparatorLabel,
+  keySymbols,
+  keyLabels
+}) {
+  const [locale7] = useLocale();
+  keyPressesSeparatorLabel ??= locale7.Keybinds.keyPressesSeparatorLabel;
+  return intersperse(
+    keybind.map((keyPress, i) => /* @__PURE__ */ jsx(
+      KeyPress,
+      {
+        keyPress,
+        keySymbols,
+        keyLabels
+      },
+      `key-press-${i}`
+    )),
+    (i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: KEY_PRESS_SEPARATOR }),
+      /* @__PURE__ */ jsxs(VisuallyHidden, { children: [
+        " ",
+        keyPressesSeparatorLabel,
+        " "
+      ] })
+    ] }, `key-press-separator-${i}`)
+  );
+}
+const KEYBIND_SEPARATOR = " / ";
+const Keybinds = forwardRef(
+  function Keybinds2({
+    keybinds,
+    limit,
+    keybindsSeparatorLabel,
+    keyPressesSeparatorLabel,
+    keySymbols,
+    keyLabels,
+    className,
+    ...otherProps
+  }, forwardedRef) {
+    if (limit != null) {
+      if (limit < 1) {
+        throw new RangeError("Limit must be >= 1.");
+      }
+      if (Array.isArray(keybinds)) {
+        keybinds = keybinds.slice(0, limit);
+      }
+    }
+    const prefix = usePrefix();
+    const [locale7] = useLocale();
+    keybindsSeparatorLabel ??= locale7.Keybinds.keybindsSeparatorLabel;
+    const normalizedKeybinds = normalizeKeybinds(keybinds);
+    return normalizedKeybinds.length === 0 ? null : /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: cx(prefix("keybinds"), className),
+        ...otherProps,
+        ref: forwardedRef,
+        children: intersperse(
+          normalizedKeybinds.map((keybind, i) => /* @__PURE__ */ jsx(
+            Keybind,
+            {
+              keybind,
+              keyPressesSeparatorLabel,
+              keySymbols,
+              keyLabels
+            },
+            `keybind-${i}`
+          )),
+          (i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
+            /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: KEYBIND_SEPARATOR }),
+            keybindsSeparatorLabel && /* @__PURE__ */ jsxs(VisuallyHidden, { children: [
+              " ",
+              keybindsSeparatorLabel,
+              " "
+            ] })
+          ] }, `keybind-separator-${i}`)
+        )
+      }
+    );
+  }
+);
+const Spinner = forwardRef(
+  function Spinner2({ size, color, label, className, ...otherProps }, forwardedRef) {
+    const prefix = usePrefix();
+    return /* @__PURE__ */ jsx(
+      "span",
       {
         className: cx(
           prefix("spinner"),
@@ -1329,13 +1618,12 @@ const Spinner = forwardRef(
           className
         ),
         "data-accent": color,
-        role: "status",
-        "aria-hidden": true,
+        role: label ? "status" : void 0,
         ref: forwardedRef,
-        ...otherProps
+        ...otherProps,
+        children: label && /* @__PURE__ */ jsx(VisuallyHidden, { children: label })
       }
     );
-    return label ? /* @__PURE__ */ jsx(AccessibleIcon.Root, { label, children: spinner }) : spinner;
   }
 );
 const Tooltip = forwardRef(function Tooltip2({
@@ -1357,7 +1645,7 @@ const Tooltip = forwardRef(function Tooltip2({
 }, forwardedRef) {
   const prefix = usePrefix();
   const portalContext = usePortalContext();
-  return /* @__PURE__ */ jsxs(
+  return content == null || typeof content === "boolean" ? children : /* @__PURE__ */ jsxs(
     Tooltip$1.Root,
     {
       defaultOpen,
@@ -1405,7 +1693,6 @@ const Tooltip = forwardRef(function Tooltip2({
   );
 });
 const TooltipProvider = Tooltip$1.Provider;
-const VisuallyHidden = VisuallyHidden$1.Root;
 const IconButton = forwardRef(function IconButton2({
   as = "button",
   asChild,
@@ -1420,10 +1707,13 @@ const IconButton = forwardRef(function IconButton2({
   loading,
   loadingLabel,
   showSpinner = loading,
-  disableTooltip,
+  tooltipContent,
+  keybinds,
   iconProps,
+  labelProps,
   spinnerProps,
   tooltipProps,
+  keybindsProps,
   type,
   onClick,
   className,
@@ -1432,7 +1722,10 @@ const IconButton = forwardRef(function IconButton2({
 }, forwardedRef) {
   const prefix = usePrefix();
   const relevantLabel = loading ? loadingLabel || label : label;
-  const labelEl = relevantLabel && /* @__PURE__ */ jsx(VisuallyHidden, { children: relevantLabel });
+  if (tooltipContent === void 0) {
+    tooltipContent = relevantLabel;
+  }
+  const labelEl = relevantLabel && /* @__PURE__ */ jsx(VisuallyHidden, { ...labelProps, children: relevantLabel });
   const iconEl = icon && !showSpinner && /* @__PURE__ */ jsx(Slot, { className: cx(prefix("icon-button__icon"), iconProps?.className), children: isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon, { icon, fixedWidth: true, ...iconProps }) });
   const spinnerEl = showSpinner && /* @__PURE__ */ jsx(
     Spinner,
@@ -1478,16 +1771,38 @@ const IconButton = forwardRef(function IconButton2({
       "data-disabled": boolDataAttr(loading || !isButton && disabled),
       "aria-disabled": loading || !isButton && disabled || void 0,
       "data-active": boolDataAttr(active),
+      "aria-keyshortcuts": keybindsToAriaKeyShortcuts(keybinds),
       tabIndex: !isButton && disabled ? -1 : void 0,
       ref: forwardedRef,
       ...otherProps,
       children: content
     }
   );
-  return relevantLabel && !disableTooltip ? /* @__PURE__ */ jsx(Tooltip, { ...tooltipProps, content: relevantLabel, children: button }) : button;
+  return tooltipContent && typeof tooltipContent !== "boolean" || keybinds ? /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      ...tooltipProps,
+      content: /* @__PURE__ */ jsxs(Fragment, { children: [
+        tooltipContent && /* @__PURE__ */ jsx("div", { "aria-hidden": true, children: tooltipContent }),
+        keybinds && /* @__PURE__ */ jsx(
+          Keybinds,
+          {
+            "aria-hidden": true,
+            keybinds,
+            ...keybindsProps,
+            className: cx(
+              prefix("icon-button__keybinds"),
+              keybindsProps?.className
+            )
+          }
+        )
+      ] }),
+      children: button
+    }
+  ) : button;
 });
 const CloseButton = forwardRef(
-  function CloseIconButton({ icon, label, disableTooltip = true, className, ...otherProps }, forwardedRef) {
+  function CloseIconButton({ icon, label, tooltipContent = null, className, ...otherProps }, forwardedRef) {
     const prefix = usePrefix();
     const [locale7] = useLocale();
     label ??= locale7.CloseButton.label;
@@ -1499,7 +1814,7 @@ const CloseButton = forwardRef(
         circle: true,
         icon: icon ?? faClose,
         label,
-        disableTooltip,
+        tooltipContent,
         ...otherProps,
         ref: forwardedRef
       }
@@ -1561,14 +1876,14 @@ const DialogTitle = forwardRef(function DialogTitle2({
 }, forwardedRef) {
   const prefix = usePrefix();
   const As = asChild ? Slot : as;
-  return /* @__PURE__ */ jsx(Dialog$1.Title, { asChild: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(CardTitle, { asChild: true, children: /* @__PURE__ */ jsx(Dialog$1.Title, { asChild: true, children: /* @__PURE__ */ jsx(
     As,
     {
       className: cx(prefix("dialog__title"), className),
       ...otherProps,
       ref: forwardedRef
     }
-  ) });
+  ) }) });
 });
 const DialogTrigger = forwardRef(function DialogTrigger2(props, forwardedRef) {
   return /* @__PURE__ */ jsx(Dialog$1.Trigger, { ...props, asChild: true, ref: forwardedRef });
@@ -1664,14 +1979,14 @@ const AlertDialogTitle = forwardRef(function AlertDialogTitle2({
 }, forwardedRef) {
   const prefix = usePrefix();
   const As = asChild ? Slot : as;
-  return /* @__PURE__ */ jsx(AlertDialog$1.Title, { asChild: true, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(CardTitle, { asChild: true, children: /* @__PURE__ */ jsx(AlertDialog$1.Title, { asChild: true, children: /* @__PURE__ */ jsx(
     As,
     {
       className: cx(prefix("dialog__title"), className),
       ...otherProps,
       ref: forwardedRef
     }
-  ) });
+  ) }) });
 });
 const AlertDialogTrigger = forwardRef(function AlertDialogTrigger2(props, forwardedRef) {
   return /* @__PURE__ */ jsx(AlertDialog$1.Trigger, { ...props, asChild: true, ref: forwardedRef });
@@ -1690,8 +2005,12 @@ const Button = forwardRef(function Button2({
   loading,
   loadingContent,
   showSpinner = loading,
+  tooltipContent,
+  keybinds,
   iconProps,
   spinnerProps,
+  tooltipProps,
+  keybindsProps,
   type,
   onClick,
   className,
@@ -1734,7 +2053,7 @@ const Button = forwardRef(function Button2({
   );
   const isButton = as === "button" && !asChild;
   const As = asChild ? Slot : as;
-  return /* @__PURE__ */ jsxs(
+  const buttonEl = /* @__PURE__ */ jsxs(
     As,
     {
       type: type ?? (isButton ? "button" : void 0),
@@ -1751,6 +2070,7 @@ const Button = forwardRef(function Button2({
       "data-disabled": boolDataAttr(loading || !isButton && disabled),
       "aria-disabled": loading || !isButton && disabled || void 0,
       "data-active": boolDataAttr(active),
+      "aria-keyshortcuts": keybindsToAriaKeyShortcuts(keybinds),
       tabIndex: !isButton && disabled ? -1 : void 0,
       ref: forwardedRef,
       ...otherProps,
@@ -1763,6 +2083,28 @@ const Button = forwardRef(function Button2({
       ]
     }
   );
+  return tooltipContent && typeof tooltipContent !== "boolean" || keybinds ? /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      ...tooltipProps,
+      content: /* @__PURE__ */ jsxs(Fragment, { children: [
+        tooltipContent && /* @__PURE__ */ jsx("div", { children: tooltipContent }),
+        keybinds && /* @__PURE__ */ jsx(
+          Keybinds,
+          {
+            keybinds,
+            "aria-hidden": true,
+            ...keybindsProps,
+            className: cx(
+              prefix("button__keybinds"),
+              keybindsProps?.className
+            )
+          }
+        )
+      ] }),
+      children: buttonEl
+    }
+  ) : buttonEl;
 });
 const AlertDialogProviderContext = createContext(void 0);
 function AlertDialogProvider({ children }) {
@@ -2140,6 +2482,7 @@ const Toast = forwardRef(function Toast2({
   action,
   actionAltText,
   showCloseButton = action === void 0,
+  visuallyHidden,
   rootProps,
   containerProps,
   iconProps,
@@ -2155,7 +2498,7 @@ const Toast = forwardRef(function Toast2({
   const [collapsibleOpen, setCollapsibleOpen] = useState(open);
   useEffect(() => setCollapsibleOpen(open), [open]);
   const accent = severity === "info" ? "primary" : severity;
-  return /* @__PURE__ */ jsx(
+  const toast = /* @__PURE__ */ jsx(
     Toast$1.Root,
     {
       type,
@@ -2245,6 +2588,7 @@ const Toast = forwardRef(function Toast2({
       ) })
     }
   );
+  return visuallyHidden ? /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: toast }) : toast;
 });
 const ToastDescription = Toast$1.Description;
 function ToastProvider({ label, ...otherProps }) {
@@ -2888,7 +3232,7 @@ function combineAriaIds(...args) {
       if (innerIds) {
         args.push(innerIds);
       }
-    } else if (arg) {
+    } else if (arg && typeof arg !== "boolean") {
       ids.push(String(arg));
     }
   }
@@ -3023,7 +3367,8 @@ const ControlCode = forwardRef(
             visuallyHiddenPrefix,
             " "
           ] }),
-          /* @__PURE__ */ jsx(Slottable, { children })
+          /* @__PURE__ */ jsx(Slottable, { children }),
+          /* @__PURE__ */ jsx(VisuallyHidden, { children: ", " })
         ]
       }
     ) });
@@ -3683,21 +4028,13 @@ const Stack = forwardRef(function Stack2({
       ...dataAttrs,
       ref: forwardedRef,
       ...otherProps,
-      children: divider ? divideChildren(children, divider, prefix) : children
+      children: divider ? intersperse(
+        Children.toArray(children).filter(Boolean),
+        (i) => cloneElement(divider, { key: prefix(`stack-divider-${i}`) })
+      ) : children
     }
   ) });
 });
-function divideChildren(children, divider, prefix) {
-  return Children.toArray(children).filter(Boolean).reduce((dividedChildren, child, i, children2) => {
-    dividedChildren.push(child);
-    if (i < children2.length - 1) {
-      dividedChildren.push(
-        cloneElement(divider, { key: prefix(`stack-divider-${i}`) })
-      );
-    }
-    return dividedChildren;
-  }, []);
-}
 const DEFAULT_TABLE_ROW_HEIGHT = 41;
 const TableRow = forwardRef(
   function TableRow2({ className, selected, ...otherProps }, forwardedRef) {
@@ -4253,6 +4590,104 @@ function getRowKey(row, rowKey) {
   return typeof rowKey === "function" ? rowKey(row) : row[rowKey];
 }
 const CheckboxGroupContext = createContext(null);
+function useCreateCheckboxGroupContext({
+  defaultValue,
+  value,
+  onValueChange,
+  name,
+  required,
+  loadingDescriptionId,
+  errorMessageIds,
+  descriptionIds,
+  checkboxGroupRef
+}) {
+  const prefix = usePrefix();
+  const latest = useLatestValues({ onValueChange });
+  const store = useConstant(
+    () => createStore()(
+      subscribeWithSelector((set, get) => ({
+        value: value ?? defaultValue ?? [],
+        firstCheckboxId: void 0,
+        actions: {
+          handleCheckedChange: (checkboxValue, checked) => {
+            const newValue = checked ? [...get().value, checkboxValue] : get().value.filter((v) => v !== checkboxValue);
+            set({ value: newValue });
+            latest.onValueChange?.(newValue);
+          }
+        }
+      }))
+    )
+  );
+  useEffect(() => {
+    if (value !== void 0) {
+      store.setState({ value });
+    }
+  }, [store, value]);
+  useEffect(() => {
+    const checkboxGroup = checkboxGroupRef.current;
+    if (!checkboxGroup) {
+      return;
+    }
+    const setFirstCheckboxId = () => store.setState({
+      firstCheckboxId: checkboxGroup.querySelector(`.${prefix("checkbox")}`)?.id
+    });
+    const observer = new MutationObserver(setFirstCheckboxId);
+    observer.observe(checkboxGroup, { childList: true, subtree: true });
+    setFirstCheckboxId();
+    return () => observer.disconnect();
+  }, [checkboxGroupRef, prefix, store]);
+  return useMemo(
+    () => ({
+      name,
+      required,
+      loadingDescriptionId,
+      errorMessageIds,
+      descriptionIds,
+      store
+    }),
+    [
+      descriptionIds,
+      errorMessageIds,
+      loadingDescriptionId,
+      name,
+      required,
+      store
+    ]
+  );
+}
+function useCheckboxGroupContext() {
+  return useContext(CheckboxGroupContext);
+}
+function useIsCheckedInGroup(checkboxValue) {
+  const store = useCheckboxGroupContext()?.store ?? EMPTY_STORE;
+  const handleCheckedChange = useStore(
+    store,
+    (state) => state.actions?.handleCheckedChange
+  );
+  return [
+    useStore(store, (state) => state.value?.includes(checkboxValue)),
+    useMemo(
+      () => handleCheckedChange && ((checked) => handleCheckedChange(checkboxValue, checked)),
+      [checkboxValue, handleCheckedChange]
+    )
+  ];
+}
+function useIsRequiredInGroup() {
+  const context = useCheckboxGroupContext();
+  const store = context?.store ?? EMPTY_STORE;
+  const required = context?.required;
+  return useStore(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(
+    store,
+    (state) => state.firstCheckboxId === checkboxId
+  );
+  return isFirstCheckbox ? descriptionIds : void 0;
+}
 const NATIVE_CONTROLS = /* @__PURE__ */ new Set([
   "BUTTON",
   "INPUT",
@@ -4266,7 +4701,6 @@ const Label = forwardRef(function Label2({
   asChild,
   required,
   helperText,
-  requiredIconLabel,
   helperButtonLabel,
   htmlFor,
   id,
@@ -4283,7 +4717,6 @@ const Label = forwardRef(function Label2({
 }, forwardedRef) {
   const prefix = usePrefix();
   const [locale7] = useLocale();
-  requiredIconLabel ??= locale7.Label.requiredIconLabel;
   helperButtonLabel ??= locale7.Label.helperButtonLabel;
   const { printHidden } = usePrintClassNames();
   const labelId = useSetFieldLabel(children, id);
@@ -4337,7 +4770,6 @@ const Label = forwardRef(function Label2({
                     /* @__PURE__ */ jsx(
                       Icon,
                       {
-                        label: requiredIconLabel && ` (${requiredIconLabel})`,
                         ...requiredIconProps,
                         className: cx(
                           prefix("label__required-icon"),
@@ -4421,7 +4853,7 @@ const Checkbox = forwardRef(function Checkbox2({
   const [locale7] = useLocale();
   loadingDescription ??= locale7.Input.loadingDescription;
   const controlContext = useControlContext();
-  const checkboxGroupContext = useContext(CheckboxGroupContext);
+  const checkboxGroupContext = useCheckboxGroupContext();
   const fieldLabelId = useFieldLabelId();
   const dataTableColumnLabelId = useDataTableColumnLabelId();
   const descriptionIds = useFieldDescriptionIds();
@@ -4444,27 +4876,24 @@ const Checkbox = forwardRef(function Checkbox2({
   disabled = controlContext?.disabled || disabled;
   loading = controlContext?.loading || loading;
   readOnly = controlContext?.readOnly || readOnly;
+  const requiredInGroup = useIsRequiredInGroup();
+  const groupDescriptionIds = useCheckboxGroupDescriptionIds(controlId);
+  const [checkedInGroup, setCheckedInGroup] = useIsCheckedInGroup(
+    String(value ?? "")
+  );
   const [checked, setChecked] = useControllableState(
     defaultChecked ?? false,
-    controlledChecked ?? checkboxGroupContext?.value.includes(String(value))
+    checkedInGroup ?? controlledChecked
   );
-  const onContextCheckedChange = checkboxGroupContext?.onCheckedChange;
   const handleCheckedChange = useCallback(
     (state) => {
       if (!loading && !readOnly) {
         onCheckedChange?.(state);
         setChecked(state);
-        onContextCheckedChange?.(value?.toString() ?? "", state === true);
+        setCheckedInGroup?.(state === true);
       }
     },
-    [
-      loading,
-      onCheckedChange,
-      onContextCheckedChange,
-      readOnly,
-      setChecked,
-      value
-    ]
+    [loading, onCheckedChange, readOnly, setChecked, setCheckedInGroup]
   );
   const setFieldControlFocused = useSetFieldControlFocused();
   const handleFocus = useCallback(() => {
@@ -4521,7 +4950,7 @@ const Checkbox = forwardRef(function Checkbox2({
           ...rootProps,
           className: cx(prefix("checkbox__root"), rootProps?.className),
           children: [
-            code && /* @__PURE__ */ jsx(
+            code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
               ControlCode,
               {
                 ...codeProps,
@@ -4556,7 +4985,7 @@ const Checkbox = forwardRef(function Checkbox2({
                       name: name ?? checkboxGroupContext?.name,
                       value,
                       checked,
-                      required,
+                      required: requiredInGroup || required || void 0,
                       disabled,
                       "data-loading": boolDataAttr(loading),
                       "data-readonly": boolDataAttr(readOnly),
@@ -4575,9 +5004,8 @@ const Checkbox = forwardRef(function Checkbox2({
                         errorMessageIds,
                         checkboxGroupContext?.errorMessageIds,
                         ariaDescribedBy,
-                        checkboxGroupContext?.ariaDescribedBy,
                         descriptionIds,
-                        checkboxGroupContext?.descriptionIds
+                        groupDescriptionIds
                       ),
                       ...otherProps,
                       ref: combinedCheckboxRef,
@@ -4630,7 +5058,7 @@ const Checkbox = forwardRef(function Checkbox2({
                       )
                     }
                   ),
-                  loadingDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: loadingDescriptionId, children: loadingDescription })
+                  loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
                 ]
               }
             )
@@ -5891,7 +6319,7 @@ const Input = forwardRef(
           )
         }
       ),
-      loadingDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: loadingDescriptionId, children: loadingDescription })
+      loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
     ] });
   }
 );
@@ -6001,6 +6429,7 @@ const MenuListItem = forwardRef(
     showSpinner = loading,
     icon = null,
     iconPlacement,
+    keybinds,
     href,
     target,
     rel,
@@ -6008,6 +6437,7 @@ const MenuListItem = forwardRef(
     contentProps,
     iconProps,
     spinnerProps,
+    keybindsProps,
     className,
     children,
     ...otherProps
@@ -6062,6 +6492,7 @@ const MenuListItem = forwardRef(
         href,
         target,
         rel,
+        "aria-keyshortcuts": type !== "text" ? keybindsToAriaKeyShortcuts(keybinds) : void 0,
         tabIndex: type === "link" && disabled ? -1 : void 0,
         ...actionProps,
         onClick: combineEventHandlers(
@@ -6088,6 +6519,19 @@ const MenuListItem = forwardRef(
               children: loading && loadingContent ? loadingContent : asChild ? children.props.children : children
             }
           ),
+          keybinds && /* @__PURE__ */ jsx(
+            Keybinds,
+            {
+              "aria-hidden": true,
+              keybinds,
+              limit: 1,
+              ...keybindsProps,
+              className: cx(
+                prefix("menu-list__item-keybinds"),
+                keybindsProps?.className
+              )
+            }
+          ),
           iconPlacement === "end" && iconEl,
           iconPlacement === "end" && spinnerEl
         ]
@@ -6098,6 +6542,7 @@ const MenuListItem = forwardRef(
       As,
       {
         className: cx(prefix("menu-list__item"), className),
+        "aria-keyshortcuts": type === "text" ? keybindsToAriaKeyShortcuts(keybinds) : void 0,
         ...otherProps,
         ref: forwardedRef,
         children: asChild ? cloneElement(children, void 0, actionEl) : actionEl
@@ -6339,6 +6784,7 @@ const CommandMenuItem = forwardRef(function CommandMenuItem2({
   showSpinner,
   icon,
   iconPlacement,
+  keybinds,
   href,
   target,
   rel,
@@ -6347,6 +6793,7 @@ const CommandMenuItem = forwardRef(function CommandMenuItem2({
   contentProps,
   iconProps,
   spinnerProps,
+  keybindsProps,
   className,
   children,
   ...otherProps
@@ -6375,6 +6822,7 @@ const CommandMenuItem = forwardRef(function CommandMenuItem2({
       showSpinner,
       icon,
       iconPlacement,
+      keybinds,
       href,
       target,
       rel,
@@ -6389,6 +6837,7 @@ const CommandMenuItem = forwardRef(function CommandMenuItem2({
       contentProps,
       iconProps,
       spinnerProps,
+      keybindsProps,
       asChild: true,
       children: /* @__PURE__ */ jsx(
         Command.Item,
@@ -7069,7 +7518,7 @@ const Select = forwardRef(function Select2({
 const CAPTION_FORMAT = "LLLL y";
 const MONTH_FORMAT = "LLLL";
 const YEAR_FORMAT = "yyyy";
-const CalendarMonthCaption = memo(function CalendarMonthCaption2({
+const CalendarHeader = memo(function CalendarHeader2({
   calendarMonth,
   displayIndex,
   ...otherProps
@@ -7078,9 +7527,12 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
   const {
     minAllowedDate,
     maxAllowedDate,
+    monthSelectLabel,
+    yearSelectLabel,
     previousMonthLabel,
     nextMonthLabel,
-    captionProps,
+    headerProps,
+    headerLabelProps,
     previousButtonProps,
     nextButtonProps,
     monthSelectProps,
@@ -7163,9 +7615,12 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
   const captionLabel = /* @__PURE__ */ jsx(
     "span",
     {
-      className: prefix("calendar__caption-label"),
       role: "status",
-      "aria-live": "polite",
+      ...headerLabelProps,
+      className: cx(
+        prefix("calendar__header-label"),
+        headerLabelProps?.className
+      ),
       children: format(displayDate, CAPTION_FORMAT, { locale: locale7 })
     }
   );
@@ -7224,19 +7679,20 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
     [locale7, yearDates]
   );
   return /* @__PURE__ */ jsxs(
-    "div",
+    "header",
     {
       ...otherProps,
-      ...captionProps,
-      className: cx(prefix("calendar__caption"), captionProps?.className),
+      ...headerProps,
+      className: cx(prefix("calendar__header"), headerProps?.className),
       children: [
-        disableNavigation ? captionLabel : /* @__PURE__ */ jsx(VisuallyHidden, { children: captionLabel }),
+        disableNavigation ? captionLabel : /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: captionLabel }),
         !disableNavigation && /* @__PURE__ */ jsxs(Fragment, { children: [
           months.length > 1 && /* @__PURE__ */ jsx("div", { className: cx(prefix("calendar__navigation")), children: isFirst && prevButton }),
           /* @__PURE__ */ jsx("div", { className: prefix("calendar__selects"), children: /* @__PURE__ */ jsxs(ClearContexts, { children: [
             /* @__PURE__ */ jsx(
               Select,
               {
+                "aria-label": monthSelectLabel,
                 disabled: !allowsPrevMonth && !allowsNextMonth,
                 showClearButton: false,
                 ...monthSelectProps,
@@ -7255,6 +7711,7 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
             /* @__PURE__ */ jsx(
               Select,
               {
+                "aria-label": yearSelectLabel,
                 disabled: yearDates.length < 2,
                 showClearButton: false,
                 ...yearSelectProps,
@@ -7288,6 +7745,8 @@ function Calendar({
   maxMonth,
   minYear,
   maxYear,
+  monthSelectLabel,
+  yearSelectLabel,
   previousMonthLabel,
   nextMonthLabel,
   defaultMonth,
@@ -7299,10 +7758,10 @@ function Calendar({
   showOutsideDays = true,
   fixedWeeks = true,
   disableNavigation,
-  locale: dateFnsLocale,
   disabled,
   modifiers,
-  captionProps,
+  headerProps,
+  headerLabelProps,
   previousButtonProps,
   nextButtonProps,
   monthSelectProps,
@@ -7312,7 +7771,8 @@ function Calendar({
 }) {
   const prefix = usePrefix();
   const [locale7] = useLocale();
-  dateFnsLocale ??= locale7.dateFnsLocale;
+  monthSelectLabel ??= locale7.Calendar.monthSelectLabel;
+  yearSelectLabel ??= locale7.Calendar.yearSelectLabel;
   previousMonthLabel ??= locale7.Calendar.previousMonthLabel;
   nextMonthLabel ??= locale7.Calendar.nextMonthLabel;
   const minAllowedDate = useMemo(() => {
@@ -7400,9 +7860,12 @@ function Calendar({
       value: {
         minAllowedDate,
         maxAllowedDate,
+        monthSelectLabel,
+        yearSelectLabel,
         previousMonthLabel,
         nextMonthLabel,
-        captionProps,
+        headerProps,
+        headerLabelProps,
         previousButtonProps,
         nextButtonProps,
         monthSelectProps,
@@ -7411,11 +7874,11 @@ function Calendar({
       children: /* @__PURE__ */ jsx(
         DayPicker,
         {
-          locale: dateFnsLocale,
+          locale: locale7.dayPickerLocale,
           required,
           disabled: composedDisabled,
           components: {
-            MonthCaption: CalendarMonthCaption,
+            MonthCaption: CalendarHeader,
             Day: CalendarDay,
             Nav: () => null
           },
@@ -7480,7 +7943,7 @@ const CheckboxGroup = forwardRef(function CheckboxGroup2({
   disabled = false,
   readOnly = false,
   defaultValue,
-  value: controlledValue,
+  value,
   onValueChange,
   onBlurToOutside,
   codeProps,
@@ -7496,7 +7959,6 @@ const CheckboxGroup = forwardRef(function CheckboxGroup2({
   children,
   "aria-label": ariaLabel,
   "aria-labelledby": ariaLabelledBy,
-  "aria-describedby": ariaDescribedBy,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
@@ -7518,18 +7980,6 @@ const CheckboxGroup = forwardRef(function CheckboxGroup2({
   const isInTableCell = useIsInTableCell();
   inline ??= isInTableCell;
   variant ??= isInTableCell ? "cell" : "default";
-  const [value, setValue] = useControllableState(
-    defaultValue ?? [],
-    controlledValue
-  );
-  const handleCheckedChange = useCallback(
-    (checkboxValue, checked) => {
-      const newValue = checked ? [...value, checkboxValue] : value.filter((v) => v !== checkboxValue);
-      setValue(newValue);
-      onValueChange?.(newValue);
-    },
-    [onValueChange, setValue, value]
-  );
   const [tabIndex, setTabIndex] = useControllableState(
     disabled ? -1 : 0,
     controlledTabIndex ?? (disabled ? -1 : void 0)
@@ -7568,6 +8018,17 @@ const CheckboxGroup = forwardRef(function CheckboxGroup2({
     },
     [onBlurToOutside, setFieldControlFocused]
   );
+  const checkboxGroupContextValue = useCreateCheckboxGroupContext({
+    defaultValue,
+    value,
+    onValueChange,
+    name,
+    required,
+    loadingDescriptionId,
+    errorMessageIds,
+    descriptionIds,
+    checkboxGroupRef
+  });
   const combinedCheckboxGroupRef = useCombinedRef(
     checkboxGroupRef,
     forwardedRef
@@ -7576,101 +8037,87 @@ const CheckboxGroup = forwardRef(function CheckboxGroup2({
     ControlContext.Provider,
     {
       value: { variant, status, disabled, loading, readOnly },
-      children: /* @__PURE__ */ jsx(
-        CheckboxGroupContext.Provider,
+      children: /* @__PURE__ */ jsx(CheckboxGroupContext.Provider, { value: checkboxGroupContextValue, children: /* @__PURE__ */ jsxs(
+        "div",
         {
-          value: {
-            name,
-            value,
-            onCheckedChange: handleCheckedChange,
-            loadingDescriptionId,
-            errorMessageIds,
-            ariaDescribedBy,
-            descriptionIds
-          },
-          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 && /* @__PURE__ */ jsx(
-                  ControlCode,
-                  {
-                    status,
-                    ...codeProps,
-                    id: codeId,
-                    className: cx(
-                      prefix("checkbox-group__code"),
-                      codeProps?.className
-                    ),
-                    children: code
-                  }
+          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
                 ),
-                /* @__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 })
-                  }
+                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
                 ),
-                showSpinner && /* @__PURE__ */ jsx(
-                  "div",
+                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,
                   {
-                    "data-status": status,
-                    "data-variant": variant,
+                    color: controlStatusToAccent(status, "neutral"),
                     "data-disabled": boolDataAttr(disabled || loading),
-                    "data-readonly": boolDataAttr(readOnly),
-                    ...endContainerProps,
+                    ...spinnerProps,
                     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
-                        )
-                      }
+                      prefix("checkbox-group__spinner"),
+                      spinnerProps?.className
                     )
                   }
-                ),
-                loadingDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: loadingDescriptionId, children: loadingDescription })
-              ]
-            }
-          )
+                )
+              }
+            ),
+            loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
+          ]
         }
-      )
+      ) })
     }
   ) });
 });
@@ -7713,37 +8160,37 @@ const Container = forwardRef(
     );
   }
 );
-const REF_DATE = /* @__PURE__ */ new Date(0);
 function parseDateStrict(dateString, dateFormat, options) {
-  const date = parse(dateString, dateFormat, REF_DATE, options);
+  const date = parse(
+    dateString,
+    dateFormat,
+    options?.referenceDate ?? /* @__PURE__ */ new Date(),
+    options
+  );
   if (isNaN(+date)) {
     return null;
   }
   return format(date, dateFormat, options) === dateString ? date : null;
 }
-const DEFAULT_SHORT_DATE_FORMAT = "yyyy-MM-dd";
-const DEFAULT_FULL_DATE_FORMAT = "EEEE, d MMMM yyyy";
+const DEFAULT_DATE_FORMAT = "yyyy-MM-dd";
 function useDateTransformer({
   locale: dateFnsLocale,
-  shortFormat,
-  fullFormat
+  format: format$1
 } = {}) {
   const [locale7] = useLocale();
-  dateFnsLocale ??= locale7.dateFnsLocale;
-  shortFormat ??= locale7.DateInput.shortFormat ?? dateFnsLocale.formatLong?.date({ width: "short" }) ?? DEFAULT_SHORT_DATE_FORMAT;
-  fullFormat ??= locale7.DateInput.fullFormat ?? dateFnsLocale.formatLong?.date({ width: "full" }) ?? DEFAULT_FULL_DATE_FORMAT;
+  dateFnsLocale ??= locale7.dayPickerLocale;
+  format$1 ??= locale7.DateInput.format ?? dateFnsLocale.formatLong?.date({ width: "short" }) ?? DEFAULT_DATE_FORMAT;
   return useMemo(
     () => ({
-      parse: (formattedDate, { width = "short" } = {}) => parseDateStrict(
-        formattedDate,
-        width === "short" ? shortFormat : fullFormat,
-        { locale: dateFnsLocale }
-      ),
-      format: (date, { width = "short" } = {}) => date != null ? format(date, width === "short" ? shortFormat : fullFormat, {
-        locale: dateFnsLocale
+      parse: (formattedDate, options) => parseDateStrict(formattedDate, options?.format ?? format$1, {
+        locale: options?.locale ?? dateFnsLocale,
+        referenceDate: options?.referenceDate
+      }),
+      format: (date, options) => date != null ? format(date, options?.format ?? format$1, {
+        locale: options?.locale ?? dateFnsLocale
       }) : ""
     }),
-    [dateFnsLocale, fullFormat, shortFormat]
+    [dateFnsLocale, format$1]
   );
 }
 function DatePicker({
@@ -7794,10 +8241,10 @@ const DateInput = forwardRef(
     maxMonth,
     minYear,
     maxYear,
-    locale: dateFnsLocale,
-    shortFormat,
-    fullFormat,
+    format: format2,
+    announcedFormat,
     formatDescription,
+    selectedDateDescription,
     calendarButtonLabel,
     onPopoverOpenChange,
     onBlurToOutside,
@@ -7812,18 +8259,19 @@ const DateInput = forwardRef(
   }, forwardedRef) {
     const prefix = usePrefix();
     const [locale7] = useLocale();
-    dateFnsLocale ??= locale7.dateFnsLocale;
     placeholder ??= locale7.DateInput.placeholder;
+    announcedFormat ??= locale7.dayPickerLocale?.formatLong.date({
+      width: "long"
+    });
     formatDescription ??= locale7.DateInput.formatDescription;
+    selectedDateDescription ??= locale7.DateInput.selectedDateDescription;
     calendarButtonLabel ??= locale7.DateInput.calendarButtonLabel;
     const { printHidden } = usePrintClassNames();
     const { format: formatDate, parse: parseDate } = useDateTransformer({
-      locale: dateFnsLocale,
-      shortFormat,
-      fullFormat
+      format: format2
     });
     const generatedId = useId();
-    const formatDescriptionId = formatDescription && prefix(`control-format-${generatedId}`);
+    const formatDescriptionId = formatDescription && prefix(`date-input-format-${generatedId}`);
     const [formattedValue, setFormattedValue] = useControllableState(
       defaultValue === null || isDate(defaultValue) ? formatDate(defaultValue) : defaultValue?.toString() ?? "",
       controlledValue === null || isDate(controlledValue) ? formatDate(controlledValue) : controlledValue?.toString()
@@ -7966,10 +8414,11 @@ const DateInput = forwardRef(
         setFormattedValue
       ]
     );
-    const fullFormattedValue = useMemo(
-      () => formatDate(dateValue, { width: "full" }),
-      [dateValue, formatDate]
+    const descriptionFormattedValue = useMemo(
+      () => formatDate(dateValue, { format: announcedFormat }),
+      [dateValue, announcedFormat, formatDate]
     );
+    const selectedDateDescriptionId = selectedDateDescription && descriptionFormattedValue && prefix(`date-input-selected-${generatedId}`);
     const combinedClearButtonRef = useCombinedRef(
       clearButtonProps?.ref,
       clearButtonRef
@@ -7996,25 +8445,26 @@ const DateInput = forwardRef(
             showClearButton,
             endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
               endAdornment,
-              /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsx(
+              /* @__PURE__ */ jsx(Tooltip, { content: calendarButtonLabel, children: /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsxs(
                 "button",
                 {
                   className: printHidden,
-                  "aria-label": calendarButtonLabel?.(
-                    fullFormattedValue,
-                    !disabled && !loading && !readOnly
-                  ),
                   onClick: handleAddonButtonClick,
                   onBlur: handleControlBlur,
                   "data-state": void 0,
                   ref: addonButtonRef,
-                  children: /* @__PURE__ */ jsx(Icon, { icon: faCalendar })
+                  "aria-describedby": selectedDateDescriptionId,
+                  children: [
+                    /* @__PURE__ */ jsx(Icon, { icon: faCalendar }),
+                    /* @__PURE__ */ jsx(VisuallyHidden, { children: calendarButtonLabel })
+                  ]
                 }
-              ) }) })
+              ) }) }) })
             ] }),
             "aria-describedby": combineAriaIds(
+              ariaDescribedBy,
               formatDescriptionId,
-              ariaDescribedBy
+              selectedDateDescriptionId
             ),
             containerProps: {
               // Propagate open state to container for styling purposes
@@ -8083,7 +8533,6 @@ const DateInput = forwardRef(
                 maxMonth,
                 minYear,
                 maxYear,
-                locale: dateFnsLocale,
                 monthSelectProps: {
                   ...datePickerProps?.monthSelectProps,
                   popoverProps: {
@@ -8097,13 +8546,18 @@ const DateInput = forwardRef(
                     ...datePickerProps?.yearSelectProps?.popoverProps,
                     ref: yearSelectMenuRef
                   }
+                },
+                headerLabelProps: {
+                  role: popoverState.modal ? "status" : void 0,
+                  ...datePickerProps?.headerLabelProps
                 }
               }
             )
           }
         )
       ] }),
-      formatDescription && /* @__PURE__ */ jsx(VisuallyHidden, { id: formatDescriptionId, children: formatDescription })
+      formatDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: formatDescriptionId, children: formatDescription }),
+      selectedDateDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: selectedDateDescriptionId, children: selectedDateDescription(descriptionFormattedValue) })
     ] });
   }
 );
@@ -8221,12 +8675,13 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
   endAdornment,
   showClearButtons = "auto",
   clearButtonsLabel,
-  locale: dateFnsLocale,
-  shortFormat,
-  fullFormat,
+  format: format2,
+  announcedFormat,
   formatDescription,
   startInputLabel,
   endInputLabel,
+  selectedDateDescription,
+  selectedDateRangeDescription,
   calendarButtonLabel,
   placeholder,
   startPlaceholder,
@@ -8251,16 +8706,18 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
   const [locale7] = useLocale();
   loadingDescription ??= locale7.Input.loadingDescription;
   clearButtonsLabel ??= locale7.Input.clearButtonLabel;
-  dateFnsLocale ??= locale7.dateFnsLocale;
   placeholder ??= locale7.DateInput.placeholder;
+  announcedFormat ??= locale7.dayPickerLocale?.formatLong.date({
+    width: "long"
+  });
   formatDescription ??= locale7.DateInput.formatDescription;
   startInputLabel ??= locale7.DateRangeInput.startInputLabel;
   endInputLabel ??= locale7.DateRangeInput.endInputLabel;
-  calendarButtonLabel ??= locale7.DateRangeInput.calendarButtonLabel;
+  selectedDateDescription ??= locale7.DateInput.selectedDateDescription;
+  selectedDateRangeDescription ??= locale7.DateRangeInput.selectedDateRangeDescription;
+  calendarButtonLabel ??= locale7.DateRangeInput.calendarButtonLabel ?? locale7.DateInput.calendarButtonLabel;
   const { format: formatDate, parse: parseDate } = useDateTransformer({
-    locale: dateFnsLocale,
-    shortFormat,
-    fullFormat
+    format: format2
   });
   const dataTableColumnLabelId = useDataTableColumnLabelId();
   const labelId = useFieldLabelId();
@@ -8278,7 +8735,7 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
   const startInputLabelId = startInputLabel && prefix(`control-start-label-${generatedId}`);
   const endInputLabelId = endInputLabel && prefix(`control-end-label-${generatedId}`);
   const loadingDescriptionId = loading && loadingDescription && prefix(`control-loading-${generatedId}`);
-  const formatDescriptionId = formatDescription && prefix(`control-format-${generatedId}`);
+  const formatDescriptionId = formatDescription && typeof formatDescription !== "boolean" ? prefix(`control-format-${generatedId}`) : void 0;
   const isInTableCell = useIsInTableCell();
   variant ??= isInTableCell ? "cell" : "default";
   const [formattedValue, setFormattedValue] = useControllableState(
@@ -8585,9 +9042,17 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
     "control",
     { align }
   );
-  const fullFormattedStart = dateValue.start && formatDate(dateValue.start, { width: "full" });
-  const fullFormattedEnd = dateValue.end && formatDate(dateValue.end, { width: "full" });
-  const fullFormattedValue = fullFormattedStart && fullFormattedEnd ? `${fullFormattedStart}–${fullFormattedEnd}` : fullFormattedStart || fullFormattedEnd;
+  const descriptionFormattedStart = useMemo(
+    () => formatDate(dateValue.start, { format: announcedFormat }),
+    [dateValue.start, announcedFormat, formatDate]
+  );
+  const descriptionFormattedEnd = useMemo(
+    () => formatDate(dateValue.end, { format: announcedFormat }),
+    [dateValue.end, announcedFormat, formatDate]
+  );
+  const selectedStartDateDescriptionId = selectedDateDescription && descriptionFormattedStart && prefix(`date-range-input-start-selected-${generatedId}`);
+  const selectedEndDateDescriptionId = selectedDateDescription && descriptionFormattedEnd && prefix(`date-range-input-end-selected-${generatedId}`);
+  const selectedDateRangeDescriptionId = selectedDateRangeDescription && (descriptionFormattedStart || descriptionFormattedEnd) && prefix(`date-range-input-selected-${generatedId}`);
   const combinedStartContainerRef = useCombinedRef(
     startContainerRef,
     startContainerProps?.ref
@@ -8633,11 +9098,17 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
           ...otherProps,
           ref: forwardedRef,
           children: [
-            startInputLabelId && /* @__PURE__ */ jsx(VisuallyHidden, { id: startInputLabelId, children: startInputLabel }),
-            endInputLabelId && /* @__PURE__ */ jsx(VisuallyHidden, { id: endInputLabelId, children: endInputLabel }),
-            loadingDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: loadingDescriptionId, children: loadingDescription }),
-            formatDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: formatDescriptionId, children: formatDescription }),
-            code && /* @__PURE__ */ jsx(
+            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,
@@ -8739,8 +9210,9 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                                 loadingDescriptionId,
                                 errorMessageIds,
                                 startInputProps?.["aria-describedby"],
+                                descriptionIds,
                                 formatDescriptionId,
-                                descriptionIds
+                                selectedStartDateDescriptionId
                               ),
                               ref: combinedStartInputRef
                             }
@@ -8853,8 +9325,9 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                                 loadingDescriptionId,
                                 errorMessageIds,
                                 endInputProps?.["aria-describedby"],
+                                descriptionIds,
                                 formatDescriptionId,
-                                descriptionIds
+                                selectedEndDateDescriptionId
                               ),
                               ref: combinedEndInputRef
                             }
@@ -8899,13 +9372,9 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                       }
                     ),
                     endAdornment,
-                    /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsx(
+                    /* @__PURE__ */ jsx(Tooltip, { content: calendarButtonLabel, children: /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsxs(
                       "button",
                       {
-                        "aria-label": calendarButtonLabel?.(
-                          fullFormattedValue,
-                          !disabled && !loading && !readOnly
-                        ),
                         onClick: handleAddonButtonClick,
                         onBlur: handleControlBlur,
                         "data-state": void 0,
@@ -8914,9 +9383,13 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                           printHidden
                         ),
                         ref: addonButtonRef,
-                        children: /* @__PURE__ */ jsx(Icon, { icon: faCalendar })
+                        "aria-describedby": selectedDateRangeDescriptionId,
+                        children: [
+                          /* @__PURE__ */ jsx(Icon, { icon: faCalendar }),
+                          /* @__PURE__ */ jsx(VisuallyHidden, { children: calendarButtonLabel })
+                        ]
                       }
-                    ) }) })
+                    ) }) }) })
                   ]
                 }
               ),
@@ -8975,7 +9448,6 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                       maxMonth,
                       minYear,
                       maxYear,
-                      locale: dateFnsLocale,
                       monthSelectProps: {
                         ...dateRangePickerProps?.monthSelectProps,
                         popoverProps: {
@@ -8989,6 +9461,10 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                           ...dateRangePickerProps?.yearSelectProps?.popoverProps,
                           ref: yearSelectMenuRef
                         }
+                      },
+                      headerLabelProps: {
+                        role: popoverState.modal ? "status" : void 0,
+                        ...dateRangePickerProps?.headerLabelProps
                       }
                     }
                   )
@@ -9014,10 +9490,12 @@ const DropdownMenuCheckboxItem = forwardRef(function DropdownMenuCheckboxItem2({
   loadingContent,
   showSpinner,
   iconPlacement,
+  keybinds,
   actionProps,
   contentProps,
   iconProps,
   spinnerProps,
+  keybindsProps,
   indicatorProps,
   className,
   ...otherProps
@@ -9056,6 +9534,7 @@ const DropdownMenuCheckboxItem = forwardRef(function DropdownMenuCheckboxItem2({
       loadingContent,
       showSpinner,
       iconPlacement,
+      keybinds,
       actionProps,
       contentProps,
       "data-hide-control": boolDataAttr(!showCheckbox),
@@ -9072,6 +9551,7 @@ const DropdownMenuCheckboxItem = forwardRef(function DropdownMenuCheckboxItem2({
       ) }) }) : null,
       iconProps,
       spinnerProps,
+      keybindsProps,
       asChild: true,
       children: /* @__PURE__ */ jsx(
         DropdownMenu$1.CheckboxItem,
@@ -9179,6 +9659,7 @@ const DropdownMenuItem = forwardRef(function DropdownMenuItem2({
   showSpinner,
   icon,
   iconPlacement,
+  keybinds,
   href,
   target,
   rel,
@@ -9186,6 +9667,7 @@ const DropdownMenuItem = forwardRef(function DropdownMenuItem2({
   contentProps,
   iconProps,
   spinnerProps,
+  keybindsProps,
   className,
   ...otherProps
 }, forwardedRef) {
@@ -9215,6 +9697,7 @@ const DropdownMenuItem = forwardRef(function DropdownMenuItem2({
       showSpinner,
       icon,
       iconPlacement,
+      keybinds,
       href,
       target,
       rel,
@@ -9222,6 +9705,7 @@ const DropdownMenuItem = forwardRef(function DropdownMenuItem2({
       contentProps,
       iconProps,
       spinnerProps,
+      keybindsProps,
       asChild: true,
       children: /* @__PURE__ */ jsx(
         DropdownMenu$1.Item,
@@ -9265,10 +9749,12 @@ const DropdownMenuRadioItem = forwardRef(function DropdownMenuRadioItem2({
   loadingContent,
   showSpinner,
   iconPlacement,
+  keybinds,
   actionProps,
   contentProps,
   iconProps,
   spinnerProps,
+  keybindsProps,
   indicatorProps,
   className,
   ...otherProps
@@ -9294,6 +9780,7 @@ const DropdownMenuRadioItem = forwardRef(function DropdownMenuRadioItem2({
       loadingContent,
       showSpinner,
       iconPlacement,
+      keybinds,
       actionProps,
       contentProps,
       "data-hide-control": boolDataAttr(!showRadio),
@@ -9309,6 +9796,7 @@ const DropdownMenuRadioItem = forwardRef(function DropdownMenuRadioItem2({
       ) }) : null,
       iconProps,
       spinnerProps,
+      keybindsProps,
       asChild: true,
       children: /* @__PURE__ */ jsx(
         DropdownMenu$1.RadioItem,
@@ -9405,14 +9893,15 @@ function useIsInFeedbackList() {
   return useContext(FeedbackListContext);
 }
 const FeedbackList = forwardRef(
-  function FeedbackList2({ className, ...otherProps }, forwardedRef) {
+  function FeedbackList2({ className, children, ...otherProps }, forwardedRef) {
     const prefix = usePrefix();
-    return /* @__PURE__ */ jsx(FeedbackListContext.Provider, { value: true, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(FeedbackListContext.Provider, { value: true, children: (!Array.isArray(children) || children.length > 0) && /* @__PURE__ */ jsx(
       "ul",
       {
         className: cx(prefix("feedback-list"), className),
         ...otherProps,
-        ref: forwardedRef
+        ref: forwardedRef,
+        children
       }
     ) });
   }
@@ -9428,7 +9917,7 @@ const FEEDBACK_ICON = {
 };
 const FeedbackPopover = forwardRef(function FeedbackPopover2({
   defaultOpen,
-  open,
+  open: controlledOpen,
   onOpenChange,
   modal,
   icon,
@@ -9445,6 +9934,7 @@ const FeedbackPopover = forwardRef(function FeedbackPopover2({
   const [locale7] = useLocale();
   label ??= locale7.FeedbackPopover.label;
   const variant = useIsInTableCell() ? "cell" : "default";
+  const [open, setOpen] = useControllableState(defaultOpen, controlledOpen);
   const [feedbacksCount, setFeedbacksCount] = useState({
     success: 0,
     error: 0,
@@ -9480,6 +9970,7 @@ const FeedbackPopover = forwardRef(function FeedbackPopover2({
   );
   const inField = controlFocused !== void 0;
   const accent = dominantFeedbackType === "error" ? "danger" : dominantFeedbackType;
+  const childrenIsElement = isValidElement(children);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       FeedbackPopoverContext.Provider,
@@ -9488,16 +9979,15 @@ const FeedbackPopover = forwardRef(function FeedbackPopover2({
           onAddFeedback: handleAddFeedback,
           onRemoveFeedback: handleRemoveFeedback
         },
-        children: /* @__PURE__ */ jsx(VisuallyHidden, { children })
+        children: childrenIsElement ? cloneElement(children, { hidden: true }) : /* @__PURE__ */ jsx("div", { hidden: true, children })
       }
     ),
     /* @__PURE__ */ jsxs(
       Popover,
       {
-        defaultOpen,
         open: hasFeedback && (controlFocused || open || false),
-        onOpenChange,
-        modal: inField ? modal : false,
+        onOpenChange: combineEventHandlers(onOpenChange, setOpen),
+        modal: controlFocused ? false : modal,
         children: [
           hasFeedback && /* @__PURE__ */ jsx(
             "div",
@@ -9545,7 +10035,7 @@ const FeedbackPopover = forwardRef(function FeedbackPopover2({
               ...otherProps,
               "data-accent": accent,
               ref: forwardedRef,
-              children
+              children: childrenIsElement ? cloneElement(children, { id: void 0 }) : children
             }
           ) })
         ]
@@ -9564,14 +10054,14 @@ const Feedback = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
+    const [locale7] = useLocale();
+    visuallyHiddenPrefix ??= locale7.Feedback.visuallyHiddenPrefix;
     const { onAddFeedback, onRemoveFeedback } = useFeedbackPopoverContext() ?? {};
     useLayoutEffect(() => {
       onAddFeedback?.(type);
       return () => onRemoveFeedback?.(type);
     }, [onAddFeedback, onRemoveFeedback, type]);
     const isInFeedbackList = useIsInFeedbackList();
-    const [locale7] = useLocale();
-    visuallyHiddenPrefix ??= locale7.Feedback.visuallyHiddenPrefix;
     const visuallyHiddenPrefixText = typeof visuallyHiddenPrefix === "function" ? visuallyHiddenPrefix(type) : visuallyHiddenPrefix;
     const feedbackId = useSetFieldFeedback(id, type === "error");
     const As = asChild ? Slot : isInFeedbackList ? "li" : "div";
@@ -9581,8 +10071,8 @@ const Feedback = forwardRef(
         id: feedbackId,
         className: cx(prefix("feedback"), className),
         "data-accent": type === "error" ? "danger" : type,
-        ...otherProps,
         "data-type": type,
+        ...otherProps,
         ref: forwardedRef,
         children: [
           visuallyHiddenPrefixText && /* @__PURE__ */ jsxs(VisuallyHidden, { children: [
@@ -9669,7 +10159,7 @@ const FieldGroupHeader = forwardRef(function FieldGroupHeader2({
       ...otherProps,
       ref: forwardedRef,
       children: [
-        code && /* @__PURE__ */ jsxs(
+        code != null && typeof code !== "boolean" && /* @__PURE__ */ jsxs(
           "span",
           {
             ...codeProps,
@@ -9680,7 +10170,8 @@ const FieldGroupHeader = forwardRef(function FieldGroupHeader2({
                 visuallyHiddenCodePrefix,
                 " "
               ] }),
-              code
+              code,
+              /* @__PURE__ */ jsx(VisuallyHidden, { children: ", " })
             ]
           }
         ),
@@ -9822,20 +10313,6 @@ const HelperText = forwardRef(
     );
   }
 );
-const Keyboard = forwardRef(
-  function Keyboard2({ asChild, className, ...otherProps }, forwardedRef) {
-    const prefix = usePrefix();
-    const As = asChild ? Slot : "kbd";
-    return /* @__PURE__ */ jsx(
-      As,
-      {
-        className: cx(prefix("keyboard"), className),
-        ref: forwardedRef,
-        ...otherProps
-      }
-    );
-  }
-);
 const Link = forwardRef(function Link2({
   as = "a",
   asChild,
@@ -10314,7 +10791,7 @@ const Radio = forwardRef(function Radio2({
   const controlContext = useControlContext();
   const generatedId = useId();
   const controlId = id ?? prefix(`control-${generatedId}`);
-  const codeId = code && (codeProps?.id ?? prefix(`control-code-${generatedId}`));
+  const codeId = code != null && typeof code !== "boolean" && (codeProps?.id ?? prefix(`control-code-${generatedId}`));
   const labelId = children && (labelProps?.id ?? prefix(`radio-label-${generatedId}`));
   const loadingDescriptionId = loading && loadingDescription && prefix(`control-loading-${generatedId}`);
   status = controlContext?.status ?? status;
@@ -10399,7 +10876,7 @@ const Radio = forwardRef(function Radio2({
             className: cx(prefix("radio__spinner"), spinnerProps?.className)
           }
         ),
-        loadingDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: loadingDescriptionId, children: loadingDescription })
+        loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
       ]
     }
   );
@@ -10533,7 +11010,7 @@ const RadioGroup = forwardRef(function RadioGroup2({
           ...otherProps,
           ref: combinedRadioGroupRef,
           children: [
-            code && /* @__PURE__ */ jsx(
+            code != null && typeof code !== "boolean" && /* @__PURE__ */ jsx(
               ControlCode,
               {
                 status,
@@ -10613,7 +11090,7 @@ const RadioGroup = forwardRef(function RadioGroup2({
                 ]
               }
             ),
-            loadingDescriptionId && /* @__PURE__ */ jsx(VisuallyHidden, { id: loadingDescriptionId, children: loadingDescription })
+            loadingDescriptionId && /* @__PURE__ */ jsx("span", { hidden: true, id: loadingDescriptionId, children: loadingDescription })
           ]
         }
       )
@@ -10867,7 +11344,7 @@ const Tab = forwardRef(function Tab2({ value, status, tabInnerProps, className,
   const tabRef = useRef(null);
   useEffect(() => {
     if (isActive) {
-      setTimeout(() => tabRef.current.scrollIntoView({ block: "nearest" }));
+      setTimeout(() => tabRef.current?.scrollIntoView({ block: "nearest" }));
     }
   }, [isActive]);
   const combinedTabRef = useCombinedRef(tabRef, forwardedRef);
@@ -10882,6 +11359,7 @@ const Tab = forwardRef(function Tab2({ value, status, tabInnerProps, className,
       ),
       "data-status": status,
       "data-accent": controlStatusToAccent(status),
+      "aria-invalid": status === "invalid" || void 0,
       ...otherProps,
       ref: combinedTabRef,
       children: [
@@ -10940,8 +11418,21 @@ const TabContent = forwardRef(function TabContent2({ asChild, value, className,
     )
   ] });
 });
-const TabList = forwardRef(function TabList2({ rootProps, containerProps, className, children, ...otherProps }, forwardedRef) {
+const TabList = forwardRef(function TabList2({
+  scrollLeftButtonLabel,
+  scrollRightButtonLabel,
+  rootProps,
+  containerProps,
+  scrollLeftButtonProps,
+  scrollRightButtonProps,
+  className,
+  children,
+  ...otherProps
+}, forwardedRef) {
   const prefix = usePrefix();
+  const [locale7] = useLocale();
+  scrollLeftButtonLabel ??= locale7.TabList.scrollLeftButtonLabel;
+  scrollRightButtonLabel ??= locale7.TabList.scrollRightButtonLabel;
   const { variant, showAllTabsWhilePrinting, store } = useTabsContext();
   const { printHidden } = usePrintClassNames();
   const [rootEl, setRootEl] = useState(null);
@@ -11026,7 +11517,18 @@ const TabList = forwardRef(function TabList2({ rootProps, containerProps, classN
       ),
       ref: combinedRootRef,
       children: [
-        /* @__PURE__ */ jsx(TabListScrollButton, { side: "left", onClick: () => scrollTabs("left") }),
+        /* @__PURE__ */ jsx(
+          TabListScrollButton,
+          {
+            side: "left",
+            label: scrollLeftButtonLabel,
+            ...scrollLeftButtonProps,
+            onClick: combineEventHandlers(
+              scrollLeftButtonProps?.onClick,
+              () => scrollTabs("left")
+            )
+          }
+        ),
         /* @__PURE__ */ jsx(
           "div",
           {
@@ -11052,16 +11554,34 @@ const TabList = forwardRef(function TabList2({ rootProps, containerProps, classN
             )
           }
         ),
-        /* @__PURE__ */ jsx(TabListScrollButton, { side: "right", onClick: () => scrollTabs("right") })
+        /* @__PURE__ */ jsx(
+          TabListScrollButton,
+          {
+            side: "right",
+            label: scrollRightButtonLabel,
+            ...scrollRightButtonProps,
+            onClick: combineEventHandlers(
+              scrollRightButtonProps?.onClick,
+              () => scrollTabs("right")
+            )
+          }
+        )
       ]
     }
   );
 });
-function TabListScrollButton({ side, onClick }) {
+function TabListScrollButton({
+  side,
+  label,
+  onClick,
+  disabled,
+  className,
+  ...otherProps
+}) {
   const prefix = usePrefix();
   const { store } = useTabsContext();
   const showScrollButtons = useStore(store, (state) => state.showScrollButtons);
-  const disabled = useStore(
+  const shouldDisable = useStore(
     store,
     ({ scrollPosition }) => scrollPosition && (side === "left" ? scrollPosition.left === 0 : scrollPosition.right <= 1)
   );
@@ -11070,15 +11590,16 @@ function TabListScrollButton({ side, onClick }) {
     {
       variant: "ghost",
       icon: side === "left" ? faChevronLeft : faChevronRight,
-      label: null,
+      label,
       className: cx(
         prefix("tabs__scroll-button"),
-        prefix(`tabs__scroll-button--${side}`)
+        prefix(`tabs__scroll-button--${side}`),
+        className
       ),
-      disabled,
+      disabled: shouldDisable || disabled,
       onClick,
       tabIndex: -1,
-      "aria-hidden": true
+      ...otherProps
     }
   );
 }
@@ -11178,76 +11699,6 @@ function useMediaBreakpointDown(breakpoint, options) {
     options
   );
 }
-const FORM_CONTROLS = ["INPUT", "TEXTAREA", "SELECT"];
-function registerKeyboardShortcut(keybinds, action, {
-  target = window,
-  eventType = "keydown",
-  sequenceTimeout = 1e3,
-  ignore,
-  capture = false,
-  preventDefault
-} = {}) {
-  const ignorableAction = (event) => {
-    if (!ignore?.(event)) {
-      if (preventDefault) {
-        event.preventDefault();
-      }
-      action(event);
-    }
-  };
-  const keybindsMap = typeof keybinds === "string" ? { [keybinds]: ignorableAction } : keybinds.reduce(
-    (keybindsMap2, shortcut) => {
-      keybindsMap2[shortcut] = ignorableAction;
-      return keybindsMap2;
-    },
-    {}
-  );
-  return tinykeys(target, keybindsMap, {
-    event: eventType,
-    timeout: sequenceTimeout,
-    capture
-  });
-}
-function useKeyboardShortcut(keybinds, action, {
-  enabled = true,
-  target = window,
-  eventType = "keydown",
-  sequenceTimeout = 1e3,
-  ignore,
-  capture = false,
-  preventDefault
-} = {}) {
-  const shortcutsString = Array.isArray(keybinds) ? keybinds.join("__") : keybinds;
-  const latestCallbacks = useLatestValues({ action, ignore });
-  useEffect(() => {
-    if (enabled && shortcutsString && target !== null) {
-      return registerKeyboardShortcut(
-        shortcutsString.split("__"),
-        (evt) => latestCallbacks.action(evt),
-        {
-          target,
-          eventType,
-          sequenceTimeout,
-          ignore: (evt) => latestCallbacks.ignore?.(evt) ?? false,
-          capture,
-          preventDefault
-        }
-      );
-    }
-  }, [
-    capture,
-    enabled,
-    eventType,
-    latestCallbacks,
-    preventDefault,
-    sequenceTimeout,
-    shortcutsString,
-    target
-  ]);
-}
-function ignoreFormControlsKeyboardShortcut(event) {
-  return event.target !== null && event.target instanceof HTMLElement && FORM_CONTROLS.includes(event.target.tagName);
-}
 function navigate(url, options) {
   history[options?.replace ? "replaceState" : "pushState"](
     options?.state,
@@ -11429,10 +11880,9 @@ export {
   ControlCode,
   ControlContext,
   DATA_TABLE_SELECTION_COLUMN_WIDTH,
+  DEFAULT_DATE_FORMAT,
   DEFAULT_DOCUMENT_TITLE_BASE_SEPARATOR,
   DEFAULT_DOCUMENT_TITLE_BREADCRUMBS_SEPARATOR,
-  DEFAULT_FULL_DATE_FORMAT,
-  DEFAULT_SHORT_DATE_FORMAT,
   DEFAULT_TABLE_COLUMN_WIDTH,
   DEFAULT_TABLE_ROW_HEIGHT,
   DataTable,
@@ -11490,6 +11940,7 @@ export {
   IconButton,
   Input,
   InputWithContainerRef,
+  Keybinds,
   Keyboard,
   Label,
   Link,
@@ -11568,8 +12019,10 @@ export {
   locale4 as frFR,
   ignoreFormControlsKeyboardShortcut,
   isNumericStringNegative,
+  keybindsToAriaKeyShortcuts,
   matchAgainstFilter,
   navigate,
+  normalizeKeybinds,
   normalizeNumericString,
   numericStringFloatToInt,
   numericStringIntToFloat,