@ostack.tech/ui 0.5.0 → 0.6.1

package/dist/ostack-ui.js

@@ -1,21 +1,21 @@
-import { forwardRef, createContext, useContext, useCallback, useRef, useEffect, useId, useMemo, useState, memo, isValidElement, cloneElement, Fragment, Children, useImperativeHandle, startTransition, useLayoutEffect as useLayoutEffect$1, createElement, useDeferredValue, useSyncExternalStore } from "react";
+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 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 as Fragment$1 } from "react/jsx-runtime";
+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 { 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, Toast as Toast$1, Collapsible as Collapsible$1, VisuallyHidden as VisuallyHidden$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, 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 { subscribeWithSelector } from "zustand/middleware";
-import { enGB } from "./locales/en-GB.js";
-import { enUS } from "./locales/en-US.js";
-import { fr } from "./locales/fr.js";
-import { pt } from "./locales/pt.js";
+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";
+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";
@@ -282,12 +282,12 @@ function spliceWindow(totalCount, offset, limit, window2, startIndex, deleted =
   }
   return { totalCount: newTotalCount, window: newWindow };
 }
-function matchAgainstFilter(value, filter, locale) {
+function matchAgainstFilter(value, filter, locale7) {
   if (value === "" || filter === "") {
     return null;
   }
-  const normalizedField = value.toLocaleLowerCase(locale);
-  const normalizedFilter = filter.toLocaleLowerCase(locale);
+  const normalizedField = value.toLocaleLowerCase(locale7);
+  const normalizedFilter = filter.toLocaleLowerCase(locale7);
   const index = normalizedField.indexOf(normalizedFilter);
   return index === -1 ? null : {
     before: value.slice(0, index),
@@ -866,6 +866,9 @@ function useFieldControlFocused() {
 function useFieldControlRequired() {
   return useFieldStore((state) => state.controlRequired);
 }
+function useFieldLabel() {
+  return useFieldStore((state) => state.label);
+}
 function useFieldLabelId() {
   return useFieldStore((state) => state.labelId);
 }
@@ -984,11 +987,7 @@ function useCreateTableContext(editable, status, layout, defaultColumnWidth, onT
       subscribeWithSelector((_set) => ({
         scrollPosition: void 0,
         numberOfColumns: void 0,
-        columnWidths: void 0,
-        actions: {
-          setTableMinWidth: onTableMinWidthChange,
-          setTableMaxWidth: onTableMaxWidthChange
-        }
+        columnWidths: void 0
       }))
     )
   );
@@ -998,9 +997,19 @@ function useCreateTableContext(editable, status, layout, defaultColumnWidth, onT
       status,
       layout,
       defaultColumnWidth,
+      onTableMinWidthChange,
+      onTableMaxWidthChange,
       store
     }),
-    [defaultColumnWidth, editable, layout, status, store]
+    [
+      defaultColumnWidth,
+      editable,
+      layout,
+      onTableMaxWidthChange,
+      onTableMinWidthChange,
+      status,
+      store
+    ]
   );
 }
 function useTableContext() {
@@ -1249,15 +1258,15 @@ function LocalizationProvider({
   onLocaleChange,
   children
 }) {
-  const [locale, setLocale] = useControllableState(
+  const [locale7, setLocale] = useControllableState(
     defaultLocale,
     controlledLocale
   );
-  return locale === void 0 ? children : /* @__PURE__ */ jsx(
+  return locale7 === void 0 ? children : /* @__PURE__ */ jsx(
     LocalizationContext.Provider,
     {
       value: {
-        locale,
+        locale: locale7,
         setLocale: combineEventHandlers(setLocale, onLocaleChange)
       },
       children
@@ -1397,6 +1406,7 @@ const Tooltip = forwardRef(function Tooltip2({
   );
 });
 const TooltipProvider = Tooltip$1.Provider;
+const VisuallyHidden = VisuallyHidden$1.Root;
 const IconButton = forwardRef(
   function IconButton2({
     asChild,
@@ -1410,6 +1420,8 @@ const IconButton = forwardRef(
     disabled,
     loading,
     enabledWhenLoading,
+    loadingLabel,
+    disableTooltip,
     iconProps,
     spinnerProps,
     tooltipProps,
@@ -1420,43 +1432,35 @@ const IconButton = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const iconEl = useMemo(
-      () => icon && /* @__PURE__ */ jsx(
-        Slot,
-        {
-          className: cx(prefix("icon-button__icon"), iconProps?.className),
-          children: isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon, { icon, fixedWidth: true, ...iconProps })
-        }
-      ),
-      [icon, iconProps, prefix]
-    );
-    const spinnerEl = useMemo(
-      () => /* @__PURE__ */ jsx(
-        Spinner,
-        {
-          ...spinnerProps,
-          className: cx(
-            prefix("icon-button__spinner"),
-            spinnerProps?.className
-          )
-        }
-      ),
-      [prefix, spinnerProps]
+    const relevantLabel = loading ? loadingLabel ?? label : label;
+    const labelEl = relevantLabel && /* @__PURE__ */ jsx(VisuallyHidden, { children: relevantLabel });
+    const iconEl = icon && !loading && /* @__PURE__ */ jsx(Slot, { className: cx(prefix("icon-button__icon"), iconProps?.className), children: isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon, { icon, fixedWidth: true, ...iconProps }) });
+    const spinnerEl = loading && /* @__PURE__ */ jsx(
+      Spinner,
+      {
+        ...spinnerProps,
+        className: cx(prefix("icon-button__spinner"), spinnerProps?.className)
+      }
     );
-    let content = loading ? spinnerEl : iconEl;
-    if (asChild && children) {
+    let content = /* @__PURE__ */ jsxs(Fragment, { children: [
+      spinnerEl,
+      iconEl,
+      labelEl
+    ] });
+    if (asChild) {
       content = cloneElement(children, void 0, content);
     }
+    const loadingDisabled = loading && !enabledWhenLoading;
+    const visiblyDisabled = disabled || loadingDisabled;
     const handleClick = useCallback(
       (evt) => {
-        if (disabled) {
+        if (visiblyDisabled) {
           return evt.preventDefault();
         }
         return onClick?.(evt);
       },
-      [disabled, onClick]
+      [onClick, visiblyDisabled]
     );
-    const shouldDisable = disabled || loading && !enabledWhenLoading;
     const As = asChild ? Slot : "button";
     const button = /* @__PURE__ */ jsx(
       As,
@@ -1471,23 +1475,23 @@ const IconButton = forwardRef(
         ),
         onClick: handleClick,
         "data-accent": color,
-        disabled: shouldDisable,
-        "data-disabled": boolDataAttr(asChild && shouldDisable),
-        "aria-disabled": asChild && shouldDisable ? "true" : void 0,
+        disabled,
+        "data-disabled": boolDataAttr(loadingDisabled || asChild && disabled),
+        "aria-disabled": loadingDisabled || asChild && disabled ? "true" : void 0,
         "data-active": boolDataAttr(active),
-        tabIndex: asChild && shouldDisable ? -1 : void 0,
+        tabIndex: asChild && disabled ? -1 : void 0,
         ref: forwardedRef,
         ...otherProps,
         children: content
       }
     );
-    return label ? /* @__PURE__ */ jsx(Tooltip, { ...tooltipProps, content: label, children: button }) : button;
+    return relevantLabel && !disableTooltip ? /* @__PURE__ */ jsx(Tooltip, { ...tooltipProps, content: relevantLabel, children: button }) : button;
   }
 );
 const CloseButton = forwardRef(
   function CloseIconButton({ icon, label = null, className, ...otherProps }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
+    const [locale7] = useLocale();
     return /* @__PURE__ */ jsx(
       IconButton,
       {
@@ -1496,7 +1500,7 @@ const CloseButton = forwardRef(
         circle: true,
         icon: icon ?? faClose,
         label,
-        "aria-label": locale.CloseButton["aria-label"],
+        "aria-label": locale7.CloseButton["aria-label"],
         ...otherProps,
         ref: forwardedRef
       }
@@ -1684,33 +1688,27 @@ const Button = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const iconEl = useMemo(
-      () => icon && /* @__PURE__ */ jsx(
-        Slot,
-        {
-          className: cx(
-            prefix("button__icon"),
-            prefix(`button__icon--${iconPlacement}`),
-            iconProps?.className
-          ),
-          children: isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon, { icon, ...iconProps })
-        }
-      ),
-      [icon, iconPlacement, iconProps, prefix]
+    const iconEl = icon && !loading && /* @__PURE__ */ jsx(
+      Slot,
+      {
+        className: cx(
+          prefix("button__icon"),
+          prefix(`button__icon--${iconPlacement}`),
+          iconProps?.className
+        ),
+        children: isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon, { icon, ...iconProps })
+      }
     );
-    const spinnerEl = useMemo(
-      () => /* @__PURE__ */ jsx(
-        Spinner,
-        {
-          ...spinnerProps,
-          className: cx(
-            prefix("button__spinner"),
-            prefix(`button__spinner--${iconPlacement}`),
-            spinnerProps?.className
-          )
-        }
-      ),
-      [iconPlacement, prefix, spinnerProps]
+    const spinnerEl = loading && /* @__PURE__ */ jsx(
+      Spinner,
+      {
+        ...spinnerProps,
+        className: cx(
+          prefix("button__spinner"),
+          prefix(`button__spinner--${iconPlacement}`),
+          spinnerProps?.className
+        )
+      }
     );
     const content = loading && loadingContent ? asChild ? cloneElement(children, void 0, loadingContent) : loadingContent : children;
     const loadingDisabled = loading && !enabledWhenLoading;
@@ -1722,7 +1720,7 @@ const Button = forwardRef(
         }
         return onClick?.(evt);
       },
-      [visiblyDisabled, onClick]
+      [onClick, visiblyDisabled]
     );
     const As = asChild ? Slot : "button";
     return /* @__PURE__ */ jsxs(
@@ -1746,11 +1744,11 @@ const Button = forwardRef(
         ref: forwardedRef,
         ...otherProps,
         children: [
-          loading && iconPlacement === "start" && spinnerEl,
-          !loading && iconPlacement === "start" && iconEl,
+          iconPlacement === "start" && spinnerEl,
+          iconPlacement === "start" && iconEl,
           /* @__PURE__ */ jsx(Slottable, { children: content }),
-          !loading && iconPlacement === "end" && iconEl,
-          loading && iconPlacement === "end" && spinnerEl
+          iconPlacement === "end" && iconEl,
+          iconPlacement === "end" && spinnerEl
         ]
       }
     );
@@ -1758,7 +1756,7 @@ const Button = forwardRef(
 );
 const AlertDialogProviderContext = createContext(void 0);
 function AlertDialogProvider({ children }) {
-  const [locale] = useLocale();
+  const [locale7] = useLocale();
   const [open, setOpen] = useState(false);
   const [content, setContent] = useState(null);
   const resolveRef = useRef(null);
@@ -1772,7 +1770,7 @@ function AlertDialogProvider({ children }) {
       setContent(
         // XXX: This is a slight hack, but it makes sure that component
         // state is not kept between new dialogs
-        /* @__PURE__ */ jsx(Fragment, { children: renderContent(resolve) }, Math.random())
+        /* @__PURE__ */ jsx(Fragment$1, { children: renderContent(resolve) }, Math.random())
       );
       setOpen(true);
     }),
@@ -1786,7 +1784,7 @@ function AlertDialogProvider({ children }) {
       size,
       title,
       extraBodyContent,
-      okText = locale.AlertDialog.okText,
+      okText = locale7.AlertDialog.okText,
       triggerElement,
       contentProps,
       headerProps,
@@ -1826,7 +1824,7 @@ function AlertDialogProvider({ children }) {
         ]
       }
     )),
-    [locale.AlertDialog.okText, prompt]
+    [locale7.AlertDialog.okText, prompt]
   );
   const confirm = useCallback(
     (description, {
@@ -1836,8 +1834,8 @@ function AlertDialogProvider({ children }) {
       size,
       title,
       extraBodyContent,
-      okText = locale.ConfirmDialog.okText ?? locale.AlertDialog.okText,
-      cancelText = locale.ConfirmDialog.cancelText,
+      okText = locale7.ConfirmDialog.okText ?? locale7.AlertDialog.okText,
+      cancelText = locale7.ConfirmDialog.cancelText,
       triggerElement,
       contentProps,
       headerProps,
@@ -1895,9 +1893,9 @@ function AlertDialogProvider({ children }) {
       }
     )),
     [
-      locale.AlertDialog.okText,
-      locale.ConfirmDialog.cancelText,
-      locale.ConfirmDialog.okText,
+      locale7.AlertDialog.okText,
+      locale7.ConfirmDialog.cancelText,
+      locale7.ConfirmDialog.okText,
       prompt
     ]
   );
@@ -2240,8 +2238,8 @@ const Toast = forwardRef(function Toast2({
 });
 const ToastDescription = Toast$1.Description;
 function ToastProvider({ label, ...otherProps }) {
-  const [locale] = useLocale();
-  label ??= locale.ToastProvider.label;
+  const [locale7] = useLocale();
+  label ??= locale7.ToastProvider.label;
   return /* @__PURE__ */ jsx(Toast$1.Provider, { label, ...otherProps });
 }
 const ToastTitle = forwardRef(function ToastTitle2({ className, ...otherProps }, forwardedRef) {
@@ -2257,8 +2255,8 @@ const ToastTitle = forwardRef(function ToastTitle2({ className, ...otherProps },
 });
 const ToastViewport = forwardRef(function ToastViewport2({ label, className, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  label ??= locale.ToastViewport.label;
+  const [locale7] = useLocale();
+  label ??= locale7.ToastViewport.label;
   return /* @__PURE__ */ jsx(
     Toast$1.Viewport,
     {
@@ -2571,11 +2569,11 @@ const ErrorBoundary = forwardRef(function ErrorBoundary2({
   resetButtonProps,
   ...otherProps
 }, forwardedRef) {
-  const [locale] = useLocale();
+  const [locale7] = useLocale();
   const reportError = useErrorReporter();
-  fallbackTitle ??= locale.ErrorBoundary.fallbackTitle;
-  fallbackMessage ??= locale.ErrorBoundary.fallbackMessage;
-  resetButtonLabel ??= locale.ErrorBoundary.resetButtonLabel;
+  fallbackTitle ??= locale7.ErrorBoundary.fallbackTitle;
+  fallbackMessage ??= locale7.ErrorBoundary.fallbackMessage;
+  resetButtonLabel ??= locale7.ErrorBoundary.resetButtonLabel;
   fallback ??= ({ error, resetErrorBoundary }) => /* @__PURE__ */ jsxs(
     Alert,
     {
@@ -2597,11 +2595,11 @@ const ErrorBoundary = forwardRef(function ErrorBoundary2({
         }
       ),
       children: [
-        (!showError || !(error instanceof Error)) && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+        (!showError || !(error instanceof Error)) && /* @__PURE__ */ jsxs(Fragment, { children: [
           fallbackTitle && /* @__PURE__ */ jsx(AlertTitle, { children: typeof fallbackTitle === "function" ? fallbackTitle(error) : fallbackTitle }),
           typeof fallbackMessage === "function" ? fallbackMessage(error) : fallbackMessage
         ] }),
-        showError && error instanceof Error && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+        showError && error instanceof Error && /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(AlertTitle, { children: error.name }),
           error.message,
           /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx(Code, { color: "danger", children: error.stack }) })
@@ -2630,13 +2628,13 @@ const RootElement = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
+    const [locale7] = useLocale();
     const errorBoundChildren = (children2) => /* @__PURE__ */ jsx(ErrorBoundary, { ...errorBoundaryProps, children: children2 });
     const As = asChild ? Slot : "div";
     return /* @__PURE__ */ jsx(
       As,
       {
-        lang: locale.languageTag,
+        lang: locale7.languageTag,
         className: cx(prefix("root"), className),
         ...otherProps,
         ref: forwardedRef,
@@ -2982,7 +2980,6 @@ function useResponsiveValues(options) {
     ]
   );
 }
-const VisuallyHidden = VisuallyHidden$1.Root;
 const ControlCode = forwardRef(
   function ControlCode2({
     asChild,
@@ -2994,8 +2991,8 @@ const ControlCode = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
-    visuallyHiddenPrefix ??= locale.ControlCode.visuallyHiddenPrefix;
+    const [locale7] = useLocale();
+    visuallyHiddenPrefix ??= locale7.ControlCode.visuallyHiddenPrefix;
     const controlContext = useControlContext();
     const As = asChild ? Slot : "div";
     return /* @__PURE__ */ jsx(ControlContext.Provider, { value: null, children: /* @__PURE__ */ jsxs(
@@ -3025,6 +3022,9 @@ function usePrinterContext() {
   }
   return printerContext;
 }
+function usePrinterDocumentTitle() {
+  return usePrinterContext().documentTitle;
+}
 function usePrintInProgress() {
   return useContext(PrinterContext)?.printInProgress ?? false;
 }
@@ -3051,9 +3051,7 @@ function Printer({
   const triggerRef = useRef(null);
   const contentRef = useRef(null);
   const [printInProgress, setPrintInProgress] = useState(false);
-  const [printOptions, setPrintOptions] = useState(
-    void 0
-  );
+  const [printOptions, setPrintOptions] = useState(void 0);
   const resolvePrintRef = useRef(null);
   const rejectPrintRef = useRef(null);
   const pendingPromiseRef = useRef(null);
@@ -3075,7 +3073,7 @@ function Printer({
   };
   const reactToPrintFn = useReactToPrint({
     bodyClass: preview || printInForeground ? prefix("root") : void 0,
-    documentTitle: printOptions?.documentTitle ?? documentTitle ?? document.title,
+    documentTitle: printOptions?.documentTitle ?? document.title,
     pageStyle: printPageStyle({
       pageSize: printOptions?.pageSize ?? pageSize,
       pageMargin: printOptions?.pageMargin ?? pageMargin,
@@ -3104,6 +3102,7 @@ function Printer({
   const latest = useLatestValues({
     printInProgress,
     reactToPrintFn,
+    documentTitle,
     onBeforePrint
   });
   const handlePrint = useCallback(
@@ -3111,13 +3110,16 @@ function Printer({
       if (latest.printInProgress) {
         throw new Error("Printing is already in progress.");
       }
-      const onBeforePrint2 = latest.onBeforePrint;
       flushSync(() => {
         setPrintInProgress(true);
-        setPrintOptions(options);
+        const documentTitleToUse = options?.documentTitle ?? latest.documentTitle;
+        setPrintOptions({
+          ...options,
+          documentTitle: typeof documentTitleToUse === "function" ? documentTitleToUse() : documentTitleToUse
+        });
       });
       await pendingPromiseRef.current;
-      if (onBeforePrint2) {
+      if (latest.onBeforePrint) {
         const event = new Event("ostack-ui.print");
         await latest.onBeforePrint?.(event);
         if (event.defaultPrevented) {
@@ -3154,6 +3156,7 @@ function Printer({
       value: {
         preview,
         printInForeground,
+        documentTitle,
         printInProgress,
         triggerRef,
         contentRef,
@@ -3223,7 +3226,7 @@ const PrinterContent = forwardRef(function PrinterContent2({ asChild, printOnly,
       children
     }
   );
-  return preview || printInForeground ? /* @__PURE__ */ jsx(PrinterContentContext.Provider, { value: contentContext, children: content }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  return preview || printInForeground ? /* @__PURE__ */ jsx(PrinterContentContext.Provider, { value: contentContext, children: content }) : /* @__PURE__ */ jsxs(Fragment, { children: [
     !printOnly && /* @__PURE__ */ jsx(PrinterContentContext.Provider, { value: { printing: false }, children }),
     printInProgress && /* @__PURE__ */ jsx(PrinterContentContext.Provider, { value: contentContext, children: /* @__PURE__ */ jsx(Portal, { container: portalContainer, asChild: true, children: content }) })
   ] });
@@ -3301,6 +3304,9 @@ const Field = forwardRef(function Field2({ asChild, className, ...otherProps },
 const DEFAULT_TABLE_COLUMN_WIDTH = 150;
 const Table = forwardRef(
   function Table2({
+    caption,
+    captionSide = "bottom",
+    visuallyHiddenCaption = caption,
     editable = false,
     variant = editable ? "control" : "default",
     status,
@@ -3309,14 +3315,17 @@ const Table = forwardRef(
     defaultColumnWidth = DEFAULT_TABLE_COLUMN_WIDTH,
     maxHeight,
     containerProps,
+    scrollableProps,
+    captionProps,
+    visuallyHiddenCaptionProps,
     className,
     children,
-    "aria-labelledby": ariaLabelledBy,
     "aria-describedby": ariaDescribedBy,
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const labelId = useFieldLabelId();
+    const label = useFieldLabel();
+    visuallyHiddenCaption ??= label;
     const descriptionIds = useFieldDescriptionIds();
     const errorMessageIds = useFieldErrorMessageIds();
     const { controlId, codeId } = useSetFieldControl(
@@ -3327,20 +3336,25 @@ const Table = forwardRef(
       required
     );
     const tableRef = useRef(null);
-    const [containerEl, setContainerEl] = useState(null);
-    const handleMinWidthChange = (minWidth) => {
+    const [scrollableEl, setScrollableEl] = useState(
+      null
+    );
+    const handleMinWidthChange = useCallback((minWidth) => {
       if (tableRef.current) {
         tableRef.current.style.minWidth = minWidth ?? "";
       }
-    };
-    const handleMaxWidthChange = (maxWidth) => {
-      if (tableRef.current) {
-        tableRef.current.style.maxWidth = maxWidth ?? "";
-      }
-      if (containerEl) {
-        containerEl.style.maxWidth = maxWidth ?? "";
-      }
-    };
+    }, []);
+    const handleMaxWidthChange = useCallback(
+      (maxWidth) => {
+        if (tableRef.current) {
+          tableRef.current.style.maxWidth = maxWidth ?? "";
+        }
+        if (scrollableEl) {
+          scrollableEl.style.maxWidth = maxWidth ? `min(100%, ${maxWidth})` : "";
+        }
+      },
+      [scrollableEl]
+    );
     const tableContextValue = useCreateTableContext(
       editable,
       status,
@@ -3350,63 +3364,89 @@ const Table = forwardRef(
       handleMaxWidthChange
     );
     useScrollPosition(
-      containerEl,
+      scrollableEl,
       useCallback(
         (scrollPosition) => tableContextValue.store.setState({ scrollPosition }),
         [tableContextValue.store]
       )
     );
-    const combinedContainerRef = useCombinedRef(
-      setContainerEl,
-      containerProps?.ref
+    const captionEl = caption && /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...captionProps,
+        className: cx(
+          prefix("table__caption"),
+          prefix(`table__caption--${captionSide}`),
+          captionProps?.className
+        ),
+        children: caption
+      }
+    );
+    const combinedScrollableRef = useCombinedRef(
+      setScrollableEl,
+      scrollableProps?.ref
     );
     const combinedTableRef = useCombinedRef(tableRef, forwardedRef);
-    return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsx(TableContext.Provider, { value: tableContextValue, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(ClearContexts, { children: /* @__PURE__ */ jsx(TableContext.Provider, { value: tableContextValue, children: /* @__PURE__ */ jsxs(
       "div",
       {
-        "data-status": status,
-        "data-accent": controlStatusToAccent(status),
-        tabIndex: 0,
         ...containerProps,
-        id: controlId,
         className: cx(
           prefix("table__container"),
-          prefix(`table__container--${variant}`),
           containerProps?.className
         ),
-        style: {
-          maxHeight,
-          // XXX: Disable Y overflow when a `max-height` isn't specified.
-          // TODO: Investigate why we get a 1px Y overflow sometimes.
-          overflowY: maxHeight != null || containerProps?.style?.maxHeight != null ? void 0 : "hidden",
-          ...containerProps?.style
-        },
-        ref: combinedContainerRef,
-        children: /* @__PURE__ */ jsxs(
-          "table",
-          {
-            className: cx(
-              prefix("table"),
-              prefix(`table--${variant}`),
-              layout === "fixed" && prefix("table--fixed"),
-              className
-            ),
-            "data-status": status,
-            "aria-labelledby": mergeAriaIds(labelId, ariaLabelledBy),
-            "aria-describedby": mergeAriaIds(
-              codeId,
-              descriptionIds,
-              errorMessageIds,
-              ariaDescribedBy
-            ),
-            ...otherProps,
-            ref: combinedTableRef,
-            children: [
-              /* @__PURE__ */ jsx(ColumnWidths, {}),
-              children
-            ]
-          }
-        )
+        children: [
+          captionSide === "top" && captionEl,
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              "data-status": status,
+              "data-accent": controlStatusToAccent(status),
+              tabIndex: 0,
+              ...scrollableProps,
+              id: controlId,
+              className: cx(
+                prefix("table__scrollable"),
+                prefix(`table__scrollable--${variant}`),
+                scrollableProps?.className
+              ),
+              style: {
+                maxHeight,
+                // XXX: Disable Y overflow when a `max-height` isn't specified.
+                // TODO: Investigate why we get a 1px Y overflow sometimes.
+                overflowY: maxHeight != null || scrollableProps?.style?.maxHeight != null ? void 0 : "hidden",
+                ...scrollableProps?.style
+              },
+              ref: combinedScrollableRef,
+              children: /* @__PURE__ */ jsxs(
+                "table",
+                {
+                  className: cx(
+                    prefix("table"),
+                    prefix(`table--${variant}`),
+                    layout === "fixed" && prefix("table--fixed"),
+                    className
+                  ),
+                  "data-status": status,
+                  "aria-describedby": mergeAriaIds(
+                    codeId,
+                    descriptionIds,
+                    errorMessageIds,
+                    ariaDescribedBy
+                  ),
+                  ...otherProps,
+                  ref: combinedTableRef,
+                  children: [
+                    visuallyHiddenCaption && /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx("caption", { ...visuallyHiddenCaptionProps, children: visuallyHiddenCaption }) }),
+                    /* @__PURE__ */ jsx(ColumnWidths, {}),
+                    children
+                  ]
+                }
+              )
+            }
+          ),
+          captionSide === "bottom" && captionEl
+        ]
       }
     ) }) });
   }
@@ -3669,12 +3709,14 @@ const TableHead = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
-    sortByColumnDescription ??= locale.TableHead.sortByColumnDescription;
+    const [locale7] = useLocale();
+    sortByColumnDescription ??= locale7.TableHead.sortByColumnDescription;
     const {
       status: tableStatus,
       layout,
       defaultColumnWidth,
+      onTableMinWidthChange,
+      onTableMaxWidthChange,
       store
     } = useTableContext();
     const columns = useMemo(() => columnsFromChildren(children), [children]);
@@ -3701,12 +3743,18 @@ const TableHead = forwardRef(
         store.setState({
           columnWidths: columnWidths(leaves, defaultColumnWidth)
         });
-        const { setTableMinWidth, setTableMaxWidth } = store.getState().actions;
-        setTableMinWidth(tableMinWidth(leaves, defaultColumnWidth));
-        setTableMaxWidth(tableMaxWidth(leaves, defaultColumnWidth));
+        onTableMinWidthChange(tableMinWidth(leaves, defaultColumnWidth));
+        onTableMaxWidthChange(tableMaxWidth(leaves, defaultColumnWidth));
         return () => store.setState({ columnWidths: void 0 });
       }
-    }, [columns, defaultColumnWidth, layout, store]);
+    }, [
+      columns,
+      defaultColumnWidth,
+      layout,
+      onTableMaxWidthChange,
+      onTableMinWidthChange,
+      store
+    ]);
     const leftMost = useMemo(() => leftMostColumns(columns), [columns]);
     const rightMost = useMemo(() => rightMostColumns(columns), [columns]);
     const combinedTableHeadRef = useCombinedRef(tableHeadRef, forwardedRef);
@@ -3727,7 +3775,7 @@ const TableHead = forwardRef(
                   label,
                   labelText = typeof label === "string" ? label : "",
                   helperText,
-                  helperButtonLabel = locale.TableColumn.helperButtonLabel,
+                  helperButtonLabel = locale7.TableColumn.helperButtonLabel,
                   width,
                   fixed: _fixed,
                   header = true,
@@ -4219,9 +4267,9 @@ const Label = forwardRef(function Label2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  requiredIconLabel ??= locale.Label.requiredIconLabel;
-  helperButtonLabel ??= locale.Label.helperButtonLabel;
+  const [locale7] = useLocale();
+  requiredIconLabel ??= locale7.Label.requiredIconLabel;
+  helperButtonLabel ??= locale7.Label.helperButtonLabel;
   const { printHidden } = usePrintClassNames();
   const labelId = useSetFieldLabel(children, id);
   const controlId = useFieldControlId();
@@ -4693,7 +4741,7 @@ const DataTableRow = memo(
               columnName,
               {
                 filterable,
-                locale,
+                locale: locale7,
                 subColumns: _subColumns,
                 getValue,
                 format: format2,
@@ -4725,9 +4773,9 @@ const DataTableRow = memo(
               const match = !loadingRow && filterable ? matchAgainstFilter(
                 formattedValue,
                 filter,
-                locale ?? "pt-PT"
+                locale7 ?? "pt-PT"
               ) : null;
-              const markedValue = match == null ? formattedValue : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+              const markedValue = match == null ? formattedValue : /* @__PURE__ */ jsxs(Fragment, { children: [
                 match.before,
                 /* @__PURE__ */ jsx(Mark, { children: match.matched }),
                 match.after
@@ -4750,7 +4798,7 @@ const DataTableRow = memo(
                   index
                 }) : markedValue
               };
-              return renderCell ? /* @__PURE__ */ jsx(Fragment, { children: renderCell(props) }, columnName) : /* @__PURE__ */ jsx(DataTableCell, { ...props }, columnName);
+              return renderCell ? /* @__PURE__ */ jsx(Fragment$1, { children: renderCell(props) }, columnName) : /* @__PURE__ */ jsx(DataTableCell, { ...props }, columnName);
             }
           )
         }
@@ -4782,7 +4830,7 @@ function DataTableEmptyOrLoadingRows({
   return loading ? Array.from({ length: loadingCount }, (_, i) => {
     const props = { row: void 0, index: i };
     const key = `loading-${i}`;
-    return renderRow ? /* @__PURE__ */ jsx(Fragment, { children: renderRow(props) }, key) : /* @__PURE__ */ jsx(DataTableRow, { ...props }, key);
+    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",
     {
@@ -4845,7 +4893,7 @@ function PagedDataTableRows() {
   return rowsWindow.map((row, i) => {
     const props = { row, index: pageOffset + i };
     const key = row ? `row-${getRowKey(row, rowKey)}` : `loading-${i}`;
-    return renderRow ? /* @__PURE__ */ jsx(Fragment, { children: renderRow(props) }, key) : /* @__PURE__ */ jsx(DataTableRow, { ...props }, key);
+    return renderRow ? /* @__PURE__ */ jsx(Fragment$1, { children: renderRow(props) }, key) : /* @__PURE__ */ jsx(DataTableRow, { ...props }, key);
   });
 }
 function ScrolledDataTableRows({
@@ -4975,7 +5023,7 @@ function ScrolledDataTableRows({
       });
     });
   }, [endIndex, startIndex, store]);
-  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx("tr", { "aria-hidden": "true", children: /* @__PURE__ */ jsx(
       "td",
       {
@@ -4998,7 +5046,7 @@ function ScrolledDataTableRows({
         ref: dynamicRowHeight ? virtualizer.measureElement : void 0
       };
       const key = rowsWindow[i] ? `row-${getRowKey(rowsWindow[i], rowKey)}` : `loading-${i}`;
-      return renderRow ? /* @__PURE__ */ jsx(Fragment, { children: renderRow(props) }, key) : /* @__PURE__ */ jsx(DataTableRow, { ...props }, key);
+      return renderRow ? /* @__PURE__ */ jsx(Fragment$1, { children: renderRow(props) }, key) : /* @__PURE__ */ jsx(DataTableRow, { ...props }, key);
     }),
     /* @__PURE__ */ jsx("tr", { "aria-hidden": "true", children: /* @__PURE__ */ jsx(
       "td",
@@ -5160,8 +5208,8 @@ const DataTableContent = forwardRef(function DataTable2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  emptyMessage ??= locale.DataTable.emptyMessage;
+  const [locale7] = useLocale();
+  emptyMessage ??= locale7.DataTable.emptyMessage;
   const { displayMode, required, estimatedRowHeight, store } = useDataTableContext();
   const tableRef = useRef(null);
   const containerRef = useRef(null);
@@ -5239,9 +5287,9 @@ const DataTableFilter = forwardRef(function DataTableFilter2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  ariaLabel ??= locale.DataTableFilter["aria-label"];
-  placeholder ??= locale.DataTableFilter.placeholder;
+  const [locale7] = useLocale();
+  ariaLabel ??= locale7.DataTableFilter["aria-label"];
+  placeholder ??= locale7.DataTableFilter.placeholder;
   const { store } = useDataTableContext();
   const filter = useStore(store, (state) => state.filter);
   const handleFilterChange = (value) => {
@@ -5390,10 +5438,10 @@ const DataTablePagination = forwardRef(function DataTablePagination2({
   nextPageButtonProps,
   ...otherProps
 }, forwardedRef) {
-  const [locale] = useLocale();
-  rowsRange ??= locale.DataTablePagination.rowsRange;
-  previousPageButtonLabel ??= locale.DataTablePagination.previousPageButtonLabel;
-  nextPageButtonLabel ??= locale.DataTablePagination.nextPageButtonLabel;
+  const [locale7] = useLocale();
+  rowsRange ??= locale7.DataTablePagination.rowsRange;
+  previousPageButtonLabel ??= locale7.DataTablePagination.previousPageButtonLabel;
+  nextPageButtonLabel ??= locale7.DataTablePagination.nextPageButtonLabel;
   const { displayMode, showAllRowsWhilePrinting } = useDataTableContext();
   const printing = usePrinting();
   return printing && showAllRowsWhilePrinting ? null : displayMode === "paged" ? /* @__PURE__ */ jsx(
@@ -5424,8 +5472,8 @@ const DataTableRowsPerPage = forwardRef(function DataTableRowsPerPage2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  label ??= locale.DataTableRowsPerPage.label;
+  const [locale7] = useLocale();
+  label ??= locale7.DataTableRowsPerPage.label;
   const { store } = useDataTableContext();
   const limit = useStore(store, (state) => state.limit);
   const { setLimit } = useStore(store, (state) => state.actions);
@@ -5529,8 +5577,8 @@ const Input = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
-    clearButtonLabel ??= locale.Input.clearButtonLabel;
+    const [locale7] = useLocale();
+    clearButtonLabel ??= locale7.Input.clearButtonLabel;
     const { responsiveValuesToCssVarsAndDataAttrs } = useResponsiveValues();
     const dataTableColumnLabelId = useDataTableColumnLabelId();
     const descriptionIds = useFieldDescriptionIds();
@@ -6017,12 +6065,12 @@ const CommandMenu = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
-    label ??= locale.CommandMenu.label;
-    searchPlaceholder ??= locale.CommandMenu.searchPlaceholder;
-    emptyMessage ??= locale.CommandMenu.emptyMessage;
-    listLabel ??= locale.CommandMenu.listLabel;
-    loadingLabel ??= locale.CommandMenu.loadingLabel;
+    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,
       {
@@ -6152,9 +6200,9 @@ const CommandMenuDialog = forwardRef(function CommandMenuDialog2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  title ??= locale.CommandMenuDialog.title;
-  description ??= locale.CommandMenuDialog.description;
+  const [locale7] = useLocale();
+  title ??= locale7.CommandMenuDialog.title;
+  description ??= locale7.CommandMenuDialog.description;
   const portalContext = usePortalContext();
   return /* @__PURE__ */ jsx(
     Dialog$1.Root,
@@ -6549,7 +6597,7 @@ function SelectMultipleValue() {
     )
   );
   const valuesList = useMemo(
-    () => valuesOptionStates.map((optionState, i) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    () => valuesOptionStates.map((optionState, i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
       i === 0 ? "" : ", ",
       optionState?.content
     ] }, i)),
@@ -6612,9 +6660,9 @@ function SelectMultipleValue() {
       valuesToRender
     ]
   );
-  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     valuesToRender.length > 0 && readOnly && valuesList,
-    valuesToRender.length > 0 && !readOnly && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+    valuesToRender.length > 0 && !readOnly && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(VisuallyHidden, { children: valuesList }),
       valuesTags
     ] })
@@ -6674,11 +6722,11 @@ const Select = forwardRef(function Select2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  searchPlaceholder ??= locale.Select.searchPlaceholder;
-  emptyMessage ??= locale.Select.emptyMessage;
-  optionsLabel ??= locale.Select.optionsLabel;
-  loadingOptionsLabel ??= locale.Select.loadingOptionsLabel;
+  const [locale7] = useLocale();
+  searchPlaceholder ??= locale7.Select.searchPlaceholder;
+  emptyMessage ??= locale7.Select.emptyMessage;
+  optionsLabel ??= locale7.Select.optionsLabel;
+  loadingOptionsLabel ??= locale7.Select.loadingOptionsLabel;
   const { cssVarStyle } = useCssVars();
   const labelId = useFieldLabelId();
   const { printHidden } = usePrintClassNames();
@@ -6828,7 +6876,7 @@ const Select = forwardRef(function Select2({
                   required,
                   loading: loading || loadingOptions,
                   startAdornment,
-                  endAdornment: /* @__PURE__ */ jsxs(Fragment$1, { children: [
+                  endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
                     !readOnly && /* @__PURE__ */ jsx(
                       Icon,
                       {
@@ -6971,7 +7019,7 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
       onNextClick,
       disableNavigation,
       pagedNavigation,
-      locale
+      locale: locale7
     }
   } = useDayPicker();
   const displayDate = calendarMonth.date;
@@ -7043,7 +7091,7 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
       className: prefix("calendar__caption-label"),
       role: "status",
       "aria-live": "polite",
-      children: format(displayDate, CAPTION_FORMAT, { locale })
+      children: format(displayDate, CAPTION_FORMAT, { locale: locale7 })
     }
   );
   const prevButton = /* @__PURE__ */ jsx(
@@ -7090,15 +7138,15 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
       {
         value: getMonth(monthDate),
         disabled: minAllowedDate && maxAllowedDate && isSameYear(minAllowedDate, maxAllowedDate) && (getMonth(monthDate) < getMonth(minAllowedDate) || getMonth(monthDate) > getMonth(maxAllowedDate)),
-        children: format(monthDate, MONTH_FORMAT, { locale })
+        children: format(monthDate, MONTH_FORMAT, { locale: locale7 })
       },
       getMonth(monthDate)
     )),
-    [locale, maxAllowedDate, minAllowedDate, monthDates]
+    [locale7, maxAllowedDate, minAllowedDate, monthDates]
   );
   const yearOptions = useMemo(
-    () => yearDates.map((yearDate) => /* @__PURE__ */ jsx(Option, { value: getYear(yearDate), children: format(yearDate, YEAR_FORMAT, { locale }) }, getYear(yearDate))),
-    [locale, yearDates]
+    () => yearDates.map((yearDate) => /* @__PURE__ */ jsx(Option, { value: getYear(yearDate), children: format(yearDate, YEAR_FORMAT, { locale: locale7 }) }, getYear(yearDate))),
+    [locale7, yearDates]
   );
   return /* @__PURE__ */ jsxs(
     "div",
@@ -7108,7 +7156,7 @@ const CalendarMonthCaption = memo(function CalendarMonthCaption2({
       className: cx(prefix("calendar__caption"), captionProps?.className),
       children: [
         disableNavigation ? captionLabel : /* @__PURE__ */ jsx(VisuallyHidden, { children: captionLabel }),
-        !disableNavigation && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+        !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(
@@ -7188,10 +7236,10 @@ function Calendar({
   ...otherProps
 }) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  dateFnsLocale ??= locale.dateFnsLocale;
-  previousMonthLabel ??= locale.Calendar.previousMonthLabel;
-  nextMonthLabel ??= locale.Calendar.nextMonthLabel;
+  const [locale7] = useLocale();
+  dateFnsLocale ??= locale7.dateFnsLocale;
+  previousMonthLabel ??= locale7.Calendar.previousMonthLabel;
+  nextMonthLabel ??= locale7.Calendar.nextMonthLabel;
   const minAllowedDate = useMemo(() => {
     const minDates = [
       toValidDate(minDate),
@@ -7593,10 +7641,10 @@ function useDateTransformer({
   shortFormat,
   fullFormat
 } = {}) {
-  const [locale] = useLocale();
-  dateFnsLocale ??= locale.dateFnsLocale;
-  shortFormat ??= locale.DateInput.shortFormat ?? dateFnsLocale.formatLong?.date({ width: "short" }) ?? DEFAULT_SHORT_DATE_FORMAT;
-  fullFormat ??= locale.DateInput.fullFormat ?? dateFnsLocale.formatLong?.date({ width: "full" }) ?? DEFAULT_FULL_DATE_FORMAT;
+  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;
   return useMemo(
     () => ({
       parse: (formattedDate, { width = "short" } = {}) => parseDateStrict(
@@ -7675,11 +7723,11 @@ const DateInput = forwardRef(
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
-    const [locale] = useLocale();
-    dateFnsLocale ??= locale.dateFnsLocale;
-    placeholder ??= locale.DateInput.placeholder;
-    formatDescription ??= locale.DateInput.formatDescription;
-    calendarButtonLabel ??= locale.DateInput.calendarButtonLabel;
+    const [locale7] = useLocale();
+    dateFnsLocale ??= locale7.dateFnsLocale;
+    placeholder ??= locale7.DateInput.placeholder;
+    formatDescription ??= locale7.DateInput.formatDescription;
+    calendarButtonLabel ??= locale7.DateInput.calendarButtonLabel;
     const { printHidden } = usePrintClassNames();
     const { format: formatDate, parse: parseDate } = useDateTransformer({
       locale: dateFnsLocale,
@@ -7843,7 +7891,7 @@ const DateInput = forwardRef(
       popoverContentProps?.ref,
       popoverRef
     );
-    return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsxs(Popover, { open: popoverState.open, modal: popoverState.modal, children: [
         /* @__PURE__ */ jsx(PopoverAnchor, { asChild: true, children: /* @__PURE__ */ jsx(
           InputWithContainerRef,
@@ -7857,7 +7905,7 @@ const DateInput = forwardRef(
             onFocus: combineEventHandlers(onFocus, handleInputFocus),
             onBlurToOutside: handleControlBlur,
             showClearButton,
-            endAdornment: /* @__PURE__ */ jsxs(Fragment$1, { children: [
+            endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
               endAdornment,
               /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsx(
                 "button",
@@ -8109,14 +8157,14 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  clearButtonsLabel ??= locale.Input.clearButtonLabel;
-  dateFnsLocale ??= locale.dateFnsLocale;
-  placeholder ??= locale.DateInput.placeholder;
-  formatDescription ??= locale.DateInput.formatDescription;
-  startInputLabel ??= locale.DateRangeInput.startInputLabel;
-  endInputLabel ??= locale.DateRangeInput.endInputLabel;
-  calendarButtonLabel ??= locale.DateRangeInput.calendarButtonLabel;
+  const [locale7] = useLocale();
+  clearButtonsLabel ??= locale7.Input.clearButtonLabel;
+  dateFnsLocale ??= locale7.dateFnsLocale;
+  placeholder ??= locale7.DateInput.placeholder;
+  formatDescription ??= locale7.DateInput.formatDescription;
+  startInputLabel ??= locale7.DateRangeInput.startInputLabel;
+  endInputLabel ??= locale7.DateRangeInput.endInputLabel;
+  calendarButtonLabel ??= locale7.DateRangeInput.calendarButtonLabel;
   const { format: formatDate, parse: parseDate } = useDateTransformer({
     locale: dateFnsLocale,
     shortFormat,
@@ -9246,8 +9294,8 @@ const FeedbackPopover = forwardRef(function FeedbackPopover2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  label ??= locale.FeedbackPopover.label;
+  const [locale7] = useLocale();
+  label ??= locale7.FeedbackPopover.label;
   const variant = useIsInTableCell() ? "cell" : "default";
   const [feedbacksCount, setFeedbacksCount] = useState({
     success: 0,
@@ -9284,7 +9332,7 @@ const FeedbackPopover = forwardRef(function FeedbackPopover2({
   );
   const inField = controlFocused !== void 0;
   const accent = dominantFeedbackType === "error" ? "danger" : dominantFeedbackType;
-  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       FeedbackPopoverContext.Provider,
       {
@@ -9374,8 +9422,8 @@ const Feedback = forwardRef(
       return () => onRemoveFeedback?.(type);
     }, [onAddFeedback, onRemoveFeedback, type]);
     const isInFeedbackList = useIsInFeedbackList();
-    const [locale] = useLocale();
-    visuallyHiddenPrefix ??= locale.Feedback.visuallyHiddenPrefix;
+    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";
@@ -9456,8 +9504,8 @@ const FieldGroupHeader = forwardRef(function FieldGroupHeader2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  visuallyHiddenCodePrefix ??= locale.FieldGroupHeader.visuallyHiddenCodePrefix;
+  const [locale7] = useLocale();
+  visuallyHiddenCodePrefix ??= locale7.FieldGroupHeader.visuallyHiddenCodePrefix;
   const generatedId = useId();
   const codeId = code ? codeProps?.id ?? prefix(`field-group-code-${generatedId}`) : void 0;
   const { setCodeId } = useFieldGroupContext();
@@ -9764,10 +9812,10 @@ function useNumericTransformer({
   prefix,
   suffix
 } = {}) {
-  const [locale] = useLocale();
-  decimalSeparator ??= locale.NumericInput.decimalSeparator ?? ".";
-  groupingStyle ??= locale.NumericInput.groupingStyle ?? "thousand";
-  groupSeparator ??= locale.NumericInput.groupSeparator ?? ",";
+  const [locale7] = useLocale();
+  decimalSeparator ??= locale7.NumericInput.decimalSeparator ?? ".";
+  groupingStyle ??= locale7.NumericInput.groupingStyle ?? "thousand";
+  groupSeparator ??= locale7.NumericInput.groupSeparator ?? ",";
   const options = useMemo(
     () => ({
       valueIsInteger,
@@ -9893,10 +9941,10 @@ const NumericInput = forwardRef(function DateInput3({
   const maxString = numericToString(max2);
   const exclusiveMinString = numericToString(exclusiveMin);
   const exclusiveMaxString = numericToString(exclusiveMax);
-  const [locale] = useLocale();
-  decimalSeparator ??= locale.NumericInput.decimalSeparator ?? ".";
-  groupingStyle ??= locale.NumericInput.groupingStyle ?? "thousand";
-  groupSeparator ??= locale.NumericInput.groupSeparator ?? ",";
+  const [locale7] = useLocale();
+  decimalSeparator ??= locale7.NumericInput.decimalSeparator ?? ".";
+  groupingStyle ??= locale7.NumericInput.groupingStyle ?? "thousand";
+  groupSeparator ??= locale7.NumericInput.groupSeparator ?? ",";
   if (process.env.NODE_ENV !== "production") {
     validateNumericProps({
       valueIsInteger,
@@ -10198,8 +10246,8 @@ const RadioGroup = forwardRef(function RadioGroup2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const [locale] = useLocale();
-  clearButtonLabel ??= locale.Input.clearButtonLabel;
+  const [locale7] = useLocale();
+  clearButtonLabel ??= locale7.Input.clearButtonLabel;
   const labelId = useFieldLabelId();
   const dataTableColumnLabelId = useDataTableColumnLabelId();
   const descriptionIds = useFieldDescriptionIds();
@@ -10668,7 +10716,7 @@ const TabContent = forwardRef(function TabContent2({ asChild, value, className,
   const { showAllTabsWhilePrinting } = useTabsContext();
   const tabLabel = useTabLabel(stringValue);
   const As = printing && showAllTabsWhilePrinting ? asChild ? Slot : "div" : Tabs$1.TabsContent;
-  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     printing && showAllTabsWhilePrinting && /* @__PURE__ */ jsx(
       "span",
       {
@@ -11312,10 +11360,11 @@ export {
   computed,
   controlStatusToAccent,
   cx,
-  enGB,
-  enUS,
+  locale as enGB,
+  locale2 as enUS,
   formatNumericValue,
-  fr,
+  locale3 as fr,
+  locale4 as frFR,
   ignoreFormControlsKeyboardShortcut,
   isNumericStringNegative,
   matchAgainstFilter,
@@ -11328,7 +11377,8 @@ export {
   numericToString,
   parseDateStrict,
   parseNumericValue,
-  pt,
+  locale5 as pt,
+  locale6 as ptPT,
   registerKeyboardShortcut,
   setBoolDataAttr,
   setDefaultPrefix,
@@ -11353,6 +11403,7 @@ export {
   useFieldControlTagName,
   useFieldDescriptionIds,
   useFieldErrorMessageIds,
+  useFieldLabel,
   useFieldLabelId,
   useIntersectionObserver,
   useIsInFeedbackList,
@@ -11374,6 +11425,7 @@ export {
   usePrint,
   usePrintClassNames,
   usePrintInProgress,
+  usePrinterDocumentTitle,
   usePrinting,
   useResponsiveValues,
   useScrollPosition,