@ostack.tech/ui 0.4.1 → 0.5.0

package/dist/ostack-ui.js

@@ -21,6 +21,8 @@ import { Command } from "cmdk";
 import { useShallow } from "zustand/react/shallow";
 import { useVirtualizer, observeElementRect } from "@tanstack/react-virtual";
 import { faCalendar } from "@fortawesome/free-regular-svg-icons";
+import { flushSync } from "react-dom";
+import { useReactToPrint } from "react-to-print";
 const AlertDialog = AlertDialog$1.Root;
 const AlertDialogAction = forwardRef(function AlertDialogAction2(props, forwardedRef) {
   return /* @__PURE__ */ jsx(AlertDialog$1.Action, { ...props, asChild: true, ref: forwardedRef });
@@ -216,6 +218,29 @@ function computed(depsFn, computeFn) {
     return cachedResult;
   };
 }
+const PrinterContentContext = createContext({
+  printing: false
+});
+function usePrinterContentContext() {
+  return useContext(PrinterContentContext);
+}
+function usePrinting() {
+  return usePrinterContentContext().printing;
+}
+function useStartPrintingTask({
+  enabled = true
+} = {}) {
+  const { startPrintingTask, finishPrintingTask } = usePrinterContentContext();
+  useEffect(() => {
+    if (enabled) {
+      startPrintingTask?.();
+    }
+  }, [enabled, startPrintingTask]);
+  return useCallback(
+    () => enabled && finishPrintingTask?.(),
+    [enabled, finishPrintingTask]
+  );
+}
 function spliceWindow(totalCount, offset, limit, window2, startIndex, deleted = 0, added = 0) {
   const deletedCount = Math.min(deleted, totalCount - startIndex);
   const addedCount = typeof added === "number" ? added : added.length;
@@ -387,6 +412,7 @@ function useCreateDataTableContext({
   dynamicRowHeight,
   estimatedRowHeight,
   overscan,
+  showAllRowsWhilePrinting,
   apiRef,
   leafColumns: leafColumns2,
   headCount,
@@ -410,7 +436,10 @@ function useCreateDataTableContext({
   onSelectedRowsChange,
   disabledSelections
 }) {
-  const listeners = useLatestValues({
+  const { startPrintingTask, finishPrintingTask } = usePrinterContentContext();
+  const latest = useLatestValues({
+    startPrintingTask,
+    finishPrintingTask,
     onOffsetChange,
     onLimitChange,
     onSort,
@@ -499,11 +528,11 @@ function useCreateDataTableContext({
           },
           setOffset: (offset2) => {
             set({ updateCounter: get().updateCounter + 1, _offset: offset2 });
-            listeners.onOffsetChange?.(offset2);
+            latest.onOffsetChange?.(offset2);
           },
           setLimit: (limit2) => {
             set({ updateCounter: get().updateCounter + 1, limit: limit2 });
-            listeners.onLimitChange?.(limit2);
+            latest.onLimitChange?.(limit2);
           },
           setFilter: (filter2) => {
             if (get().offset() > 0) {
@@ -511,7 +540,7 @@ function useCreateDataTableContext({
             }
             set({ filter: filter2 });
             get().actions.refresh(null);
-            listeners.onFilterChange?.(filter2);
+            latest.onFilterChange?.(filter2);
           },
           setSort: (sortBy2, sortDirection2) => {
             if (get().offset() > 0) {
@@ -519,7 +548,7 @@ function useCreateDataTableContext({
             }
             set({ sortBy: sortBy2, sortDirection: sortDirection2 });
             get().actions.refresh();
-            listeners.onSort?.(sortBy2, sortDirection2);
+            latest.onSort?.(sortBy2, sortDirection2);
           },
           selectRows: (keys) => {
             const {
@@ -535,7 +564,7 @@ function useCreateDataTableContext({
             }
             if (selected) {
               set({ selectedRows: [selectedRows2] });
-              listeners.onSelectedRowsChange?.(Array.from(selectedRows2).sort());
+              latest.onSelectedRowsChange?.(Array.from(selectedRows2).sort());
             }
           },
           unselectRows: (keys) => {
@@ -551,7 +580,7 @@ function useCreateDataTableContext({
             }
             if (unselected) {
               set({ selectedRows: [selectedRows2] });
-              listeners.onSelectedRowsChange?.(Array.from(selectedRows2).sort());
+              latest.onSelectedRowsChange?.(Array.from(selectedRows2).sort());
             }
           },
           updateWindow: (offset2, limit2) => {
@@ -610,13 +639,17 @@ function useCreateDataTableContext({
                 });
               };
               if (isPromiseLike(result)) {
+                const { startPrintingTask: startPrintingTask2, finishPrintingTask: finishPrintingTask2 } = latest;
+                startPrintingTask2?.();
                 void result.then(
                   (result2) => {
+                    finishPrintingTask2?.();
                     if (!abortController.signal.aborted) {
                       cacheRows(result2);
                     }
                   },
                   (err) => {
+                    finishPrintingTask2?.();
                     if (!(err instanceof DOMException) || err.name !== "AbortError") {
                       throw err;
                     }
@@ -744,6 +777,7 @@ function useCreateDataTableContext({
       estimatedRowHeight,
       overscan,
       generatedId,
+      showAllRowsWhilePrinting,
       apiRef,
       store
     }),
@@ -758,6 +792,7 @@ function useCreateDataTableContext({
       estimatedRowHeight,
       overscan,
       generatedId,
+      showAllRowsWhilePrinting,
       apiRef,
       store
     ]
@@ -889,17 +924,19 @@ function useOnFieldLabelChange(cb, { fireImmediately = true } = {}) {
     if (!store) {
       return;
     }
-    let cleanup;
+    let prevCleanup;
     const unsubscribe = store.subscribe(
       (state) => state.label,
       (label) => {
-        cleanup = cb(label);
+        prevCleanup = cb(label);
       },
       { fireImmediately }
     );
     return () => {
+      if (typeof prevCleanup === "function") {
+        prevCleanup();
+      }
       unsubscribe();
-      cleanup?.();
     };
   }, [cb, fireImmediately, store]);
 }
@@ -1676,16 +1713,17 @@ const Button = forwardRef(
       [iconPlacement, prefix, spinnerProps]
     );
     const content = loading && loadingContent ? asChild ? cloneElement(children, void 0, loadingContent) : loadingContent : children;
+    const loadingDisabled = loading && !enabledWhenLoading;
+    const visiblyDisabled = disabled || loadingDisabled;
     const handleClick = useCallback(
       (evt) => {
-        if (disabled) {
+        if (visiblyDisabled) {
           return evt.preventDefault();
         }
         return onClick?.(evt);
       },
-      [disabled, onClick]
+      [visiblyDisabled, onClick]
     );
-    const shouldDisable = disabled || loading && !enabledWhenLoading;
     const As = asChild ? Slot : "button";
     return /* @__PURE__ */ jsxs(
       As,
@@ -1700,11 +1738,11 @@ const Button = 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: [
@@ -2979,6 +3017,235 @@ const ControlCode = forwardRef(
     ) });
   }
 );
+const PrinterContext = createContext(null);
+function usePrinterContext() {
+  const printerContext = useContext(PrinterContext);
+  if (!printerContext) {
+    throw new Error("Printer context not in scope.");
+  }
+  return printerContext;
+}
+function usePrintInProgress() {
+  return useContext(PrinterContext)?.printInProgress ?? false;
+}
+function usePrint() {
+  return usePrinterContext().print;
+}
+function Printer({
+  preview,
+  printInForeground,
+  documentTitle,
+  pageSize,
+  pageMargin,
+  printColorAdjust = "exact",
+  fonts,
+  copyShadowRoots,
+  nonce,
+  printFn,
+  onBeforePrint,
+  onAfterPrint,
+  iframeProps,
+  children
+}) {
+  const prefix = usePrefix();
+  const triggerRef = useRef(null);
+  const contentRef = useRef(null);
+  const [printInProgress, setPrintInProgress] = useState(false);
+  const [printOptions, setPrintOptions] = useState(
+    void 0
+  );
+  const resolvePrintRef = useRef(null);
+  const rejectPrintRef = useRef(null);
+  const pendingPromiseRef = useRef(null);
+  const resolvePendingRef = useRef(null);
+  const pendingTasksRef = useRef(0);
+  const finishedTasksRef = useRef(0);
+  const finishPrint = (focusTrigger = false) => {
+    setPrintInProgress(false);
+    setPrintOptions(void 0);
+    resolvePrintRef.current = null;
+    rejectPrintRef.current = null;
+    pendingPromiseRef.current = null;
+    resolvePendingRef.current = null;
+    pendingTasksRef.current = 0;
+    finishedTasksRef.current = 0;
+    if (focusTrigger) {
+      setTimeout(() => triggerRef.current?.focus(), 100);
+    }
+  };
+  const reactToPrintFn = useReactToPrint({
+    bodyClass: preview || printInForeground ? prefix("root") : void 0,
+    documentTitle: printOptions?.documentTitle ?? documentTitle ?? document.title,
+    pageStyle: printPageStyle({
+      pageSize: printOptions?.pageSize ?? pageSize,
+      pageMargin: printOptions?.pageMargin ?? pageMargin,
+      printColorAdjust: printOptions?.printColorAdjust ?? printColorAdjust
+    }),
+    fonts: printOptions?.fonts ?? fonts,
+    copyShadowRoots: printOptions?.copyShadowRoots ?? copyShadowRoots,
+    nonce: printOptions?.nonce ?? nonce,
+    printIframeProps: printOptions?.iframeProps ?? iframeProps,
+    suppressErrors: process.env.NODE_ENV !== "production",
+    print: printOptions?.printFn ?? printFn,
+    onAfterPrint: () => {
+      let event;
+      try {
+        onAfterPrint?.(event = new Event("ostack-ui.afterPrint"));
+      } finally {
+        resolvePrintRef.current();
+        finishPrint(!event?.defaultPrevented);
+      }
+    },
+    onPrintError: (_errorLocation, error) => {
+      rejectPrintRef.current(error);
+      finishPrint();
+    }
+  });
+  const latest = useLatestValues({
+    printInProgress,
+    reactToPrintFn,
+    onBeforePrint
+  });
+  const handlePrint = useCallback(
+    async (options) => {
+      if (latest.printInProgress) {
+        throw new Error("Printing is already in progress.");
+      }
+      const onBeforePrint2 = latest.onBeforePrint;
+      flushSync(() => {
+        setPrintInProgress(true);
+        setPrintOptions(options);
+      });
+      await pendingPromiseRef.current;
+      if (onBeforePrint2) {
+        const event = new Event("ostack-ui.print");
+        await latest.onBeforePrint?.(event);
+        if (event.defaultPrevented) {
+          return finishPrint();
+        }
+      }
+      return new Promise((res, rej) => {
+        latest.reactToPrintFn(() => contentRef.current);
+        resolvePrintRef.current = res;
+        rejectPrintRef.current = rej;
+      });
+    },
+    [latest]
+  );
+  const startPrintingTask = useCallback(() => {
+    if (pendingTasksRef.current++ === 0) {
+      pendingPromiseRef.current = new Promise(
+        (res) => resolvePendingRef.current = res
+      );
+    }
+  }, [pendingPromiseRef, resolvePendingRef]);
+  const finishPrintingTask = useCallback(() => {
+    if (++finishedTasksRef.current >= pendingTasksRef.current) {
+      void Promise.resolve().then(() => {
+        if (finishedTasksRef.current >= pendingTasksRef.current) {
+          resolvePendingRef.current();
+        }
+      });
+    }
+  }, [resolvePendingRef]);
+  return /* @__PURE__ */ jsx(
+    PrinterContext.Provider,
+    {
+      value: {
+        preview,
+        printInForeground,
+        printInProgress,
+        triggerRef,
+        contentRef,
+        print: handlePrint,
+        startPrintingTask,
+        finishPrintingTask
+      },
+      children
+    }
+  );
+}
+function printPageStyle({
+  pageSize,
+  pageMargin,
+  printColorAdjust
+}) {
+  let pageStyle = `@media print {
+    html, body { margin: 0 }
+    body {
+      color-adjust: ${printColorAdjust};
+      print-color-adjust: ${printColorAdjust};
+      -webkit-print-color-adjust: ${printColorAdjust};
+    }
+  }`;
+  if (pageSize != null) {
+    pageStyle += `@page { size: ${pageSize} }`;
+  }
+  if (pageMargin != null) {
+    pageStyle += `@page { margin: ${pageMargin} }`;
+  }
+  return pageStyle;
+}
+function usePrintClassNames() {
+  const prefix = usePrefix();
+  return {
+    printOnly: prefix("print-only"),
+    printHidden: prefix("print-hidden")
+  };
+}
+const PrinterContent = forwardRef(function PrinterContent2({ asChild, printOnly, portalContainer, className, children, ...otherProps }, forwardedRef) {
+  const { printOnly: printOnlyClassName } = usePrintClassNames();
+  const {
+    preview,
+    printInForeground,
+    printInProgress,
+    contentRef,
+    startPrintingTask,
+    finishPrintingTask
+  } = usePrinterContext();
+  const printing = preview || printInProgress;
+  const contentContext = useMemo(
+    () => ({
+      printing,
+      startPrintingTask: printing ? startPrintingTask : void 0,
+      finishPrintingTask: printing ? finishPrintingTask : void 0
+    }),
+    [finishPrintingTask, printing, startPrintingTask]
+  );
+  const As = asChild ? Slot : "div";
+  const combinedRef = useCombinedRef(contentRef, forwardedRef);
+  const content = /* @__PURE__ */ jsx(
+    As,
+    {
+      className: cx(!preview && printOnlyClassName, className),
+      ...otherProps,
+      ref: combinedRef,
+      children
+    }
+  );
+  return preview || printInForeground ? /* @__PURE__ */ jsx(PrinterContentContext.Provider, { value: contentContext, children: content }) : /* @__PURE__ */ jsxs(Fragment$1, { 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 }) })
+  ] });
+});
+const PrinterTrigger = forwardRef(function PrinterTrigger2({ showWhenPrinting, className, onClick, ...otherProps }, forwardedRef) {
+  const { printHidden } = usePrintClassNames();
+  const { printInProgress, triggerRef, print } = usePrinterContext();
+  const printing = usePrinting();
+  const combinedRef = useCombinedRef(triggerRef, forwardedRef);
+  return /* @__PURE__ */ jsx(
+    Slot,
+    {
+      className: cx(!showWhenPrinting && printHidden, className),
+      onClick: combineEventHandlers(onClick, () => print(), {
+        checkDefaultPrevented: true
+      }),
+      disabled: printInProgress && !printing,
+      ...otherProps,
+      ref: combinedRef
+    }
+  );
+});
 function useScrollPosition(element, setScrollPosition) {
   useEffect(() => {
     if (!element) {
@@ -3416,6 +3683,7 @@ const TableHead = forwardRef(
       () => Array.from({ length: nRows }, (_, i) => columnsOfRow(columns, i)),
       [columns, nRows]
     );
+    const { printHidden } = usePrintClassNames();
     const generatedId = useId();
     const tableHeadRef = useRef(null);
     useEffect(
@@ -3494,6 +3762,7 @@ const TableHead = forwardRef(
                       ...helperButtonProps,
                       className: cx(
                         prefix("table__column-helper-button"),
+                        printHidden,
                         helperButtonProps?.className
                       )
                     }
@@ -3762,15 +4031,17 @@ const DataTable = forwardRef(
     dynamicRowHeight = false,
     estimatedRowHeight = DEFAULT_TABLE_ROW_HEIGHT,
     overscan = 5,
+    showAllRowsWhilePrinting,
     apiRef,
     className,
     ...otherProps
   }, forwardedRef) {
     const prefix = usePrefix();
+    const printing = usePrinting();
     const leaves = useMemo(() => leafColumns(columns), [columns]);
     const headCount = useMemo(() => numberOfRows(columns), [columns]);
     const dataTableContextValue = useCreateDataTableContext({
-      displayMode,
+      displayMode: printing ? "paged" : displayMode,
       columns,
       rows,
       getRows,
@@ -3783,6 +4054,7 @@ const DataTable = forwardRef(
       dynamicRowHeight,
       estimatedRowHeight,
       overscan,
+      showAllRowsWhilePrinting,
       apiRef,
       leafColumns: leaves,
       headCount,
@@ -3950,6 +4222,7 @@ const Label = forwardRef(function Label2({
   const [locale] = useLocale();
   requiredIconLabel ??= locale.Label.requiredIconLabel;
   helperButtonLabel ??= locale.Label.helperButtonLabel;
+  const { printHidden } = usePrintClassNames();
   const labelId = useSetFieldLabel(children, id);
   const controlId = useFieldControlId();
   const controlTagName = useFieldControlTagName();
@@ -4027,6 +4300,7 @@ const Label = forwardRef(function Label2({
               ...helperButtonProps,
               className: cx(
                 prefix("label__helper-button"),
+                printHidden,
                 helperButtonProps?.className
               )
             }
@@ -4521,7 +4795,9 @@ function DataTableEmptyOrLoadingRows({
   ) }) });
 }
 function PagedDataTableRows() {
-  const { rowKey, renderRow, apiRef, store } = useDataTableContext();
+  const { rowKey, renderRow, showAllRowsWhilePrinting, apiRef, store } = useDataTableContext();
+  const printing = usePrinting();
+  const showAllRows = showAllRowsWhilePrinting && printing;
   const splice = useCallback(
     (startIndex, deleted = 0, added = 0) => {
       const { pageOffset: pageOffset2, limit, actions } = store.getState();
@@ -4553,13 +4829,16 @@ function PagedDataTableRows() {
     ),
     [goTo, store]
   );
-  const pageOffset = useStore(store, (state) => state.pageOffset());
+  const pageOffset = useStore(
+    store,
+    (state) => showAllRows ? 0 : state.pageOffset()
+  );
   const rowsWindow = useStore(
     store,
     useShallow(
       (state) => state.rowsWindow(
-        state.pageOffset(),
-        state.pageLimit() ?? state.loadingCount
+        showAllRows ? 0 : state.pageOffset(),
+        (showAllRows ? state.totalCount() : state.pageLimit()) ?? state.loadingCount
       )
     )
   );
@@ -5115,8 +5394,9 @@ const DataTablePagination = forwardRef(function DataTablePagination2({
   rowsRange ??= locale.DataTablePagination.rowsRange;
   previousPageButtonLabel ??= locale.DataTablePagination.previousPageButtonLabel;
   nextPageButtonLabel ??= locale.DataTablePagination.nextPageButtonLabel;
-  const { displayMode } = useDataTableContext();
-  return displayMode === "paged" ? /* @__PURE__ */ jsx(
+  const { displayMode, showAllRowsWhilePrinting } = useDataTableContext();
+  const printing = usePrinting();
+  return printing && showAllRowsWhilePrinting ? null : displayMode === "paged" ? /* @__PURE__ */ jsx(
     PagedDataTablePagination,
     {
       ...otherProps,
@@ -5255,6 +5535,7 @@ const Input = forwardRef(
     const dataTableColumnLabelId = useDataTableColumnLabelId();
     const descriptionIds = useFieldDescriptionIds();
     const errorMessageIds = useFieldErrorMessageIds();
+    const { printHidden } = usePrintClassNames();
     const [inputEl, setInputEl] = useState(null);
     const { controlId, codeId } = useSetFieldControl(
       id,
@@ -5456,6 +5737,7 @@ const Input = forwardRef(
                         ...clearButtonProps,
                         className: cx(
                           prefix("input__clear-button"),
+                          printHidden,
                           clearButtonProps?.className
                         ),
                         onClick: combineEventHandlers(
@@ -6008,7 +6290,6 @@ const SelectContext = createContext(null);
 function useCreateSelectContext({
   multiple,
   value,
-  setValue,
   onOptionSelect,
   status,
   disabled,
@@ -6039,7 +6320,6 @@ function useCreateSelectContext({
     () => ({
       multiple,
       value,
-      setValue,
       onOptionSelect,
       status,
       disabled,
@@ -6052,7 +6332,6 @@ function useCreateSelectContext({
       multiple,
       onOptionSelect,
       readOnly,
-      setValue,
       status,
       store,
       value,
@@ -6166,6 +6445,7 @@ const Tag = forwardRef(function Tag2({
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
+  const { printHidden } = usePrintClassNames();
   const iconEl = useMemo(
     () => icon && /* @__PURE__ */ jsx(
       Icon,
@@ -6225,6 +6505,7 @@ const Tag = forwardRef(function Tag2({
                     ...closeButtonProps,
                     className: cx(
                       prefix("tag__close-button"),
+                      printHidden,
                       closeButtonProps?.className
                     )
                   }
@@ -6240,14 +6521,22 @@ const Tag = forwardRef(function Tag2({
 const Badge = Tag;
 function SelectMultipleValue() {
   const prefix = usePrefix();
-  const { value, setValue, status, disabled, readOnly, valueTagProps, store } = useSelectContext();
+  const {
+    value,
+    onOptionSelect,
+    status,
+    disabled,
+    readOnly,
+    valueTagProps,
+    store
+  } = useSelectContext();
   useStore(store, (state) => state.actions.getOptionState(value));
   const handleCloseValueTag = useCallback(
     (tagValue, evt) => {
       evt.preventDefault();
-      setValue((value2) => value2.filter((v) => v !== tagValue));
+      onOptionSelect(tagValue);
     },
-    [setValue]
+    [onOptionSelect]
   );
   const valuesToRender = useMemo(
     () => Array.from(new Set(value)),
@@ -6392,6 +6681,7 @@ const Select = forwardRef(function Select2({
   loadingOptionsLabel ??= locale.Select.loadingOptionsLabel;
   const { cssVarStyle } = useCssVars();
   const labelId = useFieldLabelId();
+  const { printHidden } = usePrintClassNames();
   const [open, setOpen] = useControllableState(
     defaultOpen ?? false,
     controlledOpen
@@ -6483,7 +6773,6 @@ const Select = forwardRef(function Select2({
   const selectContext = useCreateSelectContext({
     multiple,
     value: actualValue,
-    setValue,
     onOptionSelect: handleOptionSelect,
     status,
     disabled,
@@ -6546,6 +6835,7 @@ const Select = forwardRef(function Select2({
                         icon: showOpen ? faChevronUp : faChevronDown,
                         className: cx(
                           prefix("select__arrow"),
+                          printHidden,
                           arrowProps?.className
                         ),
                         "data-status": status,
@@ -7390,6 +7680,7 @@ const DateInput = forwardRef(
     placeholder ??= locale.DateInput.placeholder;
     formatDescription ??= locale.DateInput.formatDescription;
     calendarButtonLabel ??= locale.DateInput.calendarButtonLabel;
+    const { printHidden } = usePrintClassNames();
     const { format: formatDate, parse: parseDate } = useDateTransformer({
       locale: dateFnsLocale,
       shortFormat,
@@ -7571,6 +7862,7 @@ const DateInput = forwardRef(
               /* @__PURE__ */ jsx(ControlAddon, { asChild: true, children: /* @__PURE__ */ jsx(PopoverTrigger, { children: /* @__PURE__ */ jsx(
                 "button",
                 {
+                  className: printHidden,
                   "aria-label": calendarButtonLabel?.(
                     fullFormattedValue,
                     !disabled && !readOnly
@@ -7834,6 +8126,7 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
   const labelId = useFieldLabelId();
   const descriptionIds = useFieldDescriptionIds();
   const errorMessageIds = useFieldErrorMessageIds();
+  const { printHidden } = usePrintClassNames();
   const { controlId, codeId } = useSetFieldControl(
     startInputProps?.id,
     "INPUT",
@@ -8300,6 +8593,7 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                           className: cx(
                             prefix("date-range-input__clear-button"),
                             prefix("date-range-input__clear-button--start"),
+                            printHidden,
                             startClearButtonProps?.className
                           ),
                           onClick: combineEventHandlers(
@@ -8413,6 +8707,7 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                           className: cx(
                             prefix("date-range-input__clear-button"),
                             prefix("date-range-input__clear-button--end"),
+                            printHidden,
                             endClearButtonProps?.className
                           ),
                           onClick: combineEventHandlers(
@@ -8452,7 +8747,10 @@ const DateRangeInput = forwardRef(function DateRangeInput2({
                     onClick: handleAddonButtonClick,
                     onBlur: handleControlBlur,
                     "data-state": void 0,
-                    className: cx(prefix("date-range-input__calendar-button")),
+                    className: cx(
+                      prefix("date-range-input__calendar-button"),
+                      printHidden
+                    ),
                     ref: addonButtonRef,
                     children: /* @__PURE__ */ jsx(Icon, { icon: faCalendar })
                   }
@@ -10254,14 +10552,30 @@ const Stepper = forwardRef(function Stepper2({
   ) });
 });
 const TabsContext = createContext(null);
-function useCreateTabsContext(variant, defaultValue, value) {
+function useCreateTabsContext(variant, defaultValue, value, showAllTabsWhilePrinting) {
   const store = useConstant(
     () => createStore()(
-      subscribeWithSelector((_set) => ({
+      subscribeWithSelector((set, get) => ({
         activeTab: value?.toString() ?? defaultValue?.toString(),
         showScrollButtons: false,
         width: 0,
-        scrollPosition: void 0
+        scrollPosition: void 0,
+        tabsLabels: {},
+        actions: {
+          registerTabLabel: (value2, label) => {
+            set(({ tabsLabels }) => ({
+              tabsLabels: { ...tabsLabels, [value2]: label }
+            }));
+            return () => {
+              set(({ tabsLabels: { [value2]: _, ...otherLabels } }) => ({
+                tabsLabels: otherLabels
+              }));
+            };
+          },
+          getTabLabel: (value2) => {
+            return get().tabsLabels[value2];
+          }
+        }
       }))
     )
   );
@@ -10270,7 +10584,10 @@ function useCreateTabsContext(variant, defaultValue, value) {
       store.setState({ activeTab: value.toString() });
     }
   }, [store, value]);
-  return useMemo(() => ({ variant, store }), [store, variant]);
+  return useMemo(
+    () => ({ variant, showAllTabsWhilePrinting, store }),
+    [showAllTabsWhilePrinting, store, variant]
+  );
 }
 function useTabsContext() {
   const tabsContext = useContext(TabsContext);
@@ -10279,11 +10596,26 @@ function useTabsContext() {
   }
   return tabsContext;
 }
+function useRegisterTabLabel(value, label) {
+  const { showAllTabsWhilePrinting, store } = useTabsContext();
+  const needsRegisteredTabLabels = usePrinting() && showAllTabsWhilePrinting;
+  const { registerTabLabel } = useStore(store, (state) => state.actions);
+  useEffect(() => {
+    if (needsRegisteredTabLabels) {
+      return registerTabLabel(value, label);
+    }
+  }, [label, needsRegisteredTabLabels, registerTabLabel, value]);
+}
+function useTabLabel(value) {
+  const { store } = useTabsContext();
+  return useStore(store, (state) => state.actions.getTabLabel(value));
+}
 const Tab = forwardRef(function Tab2({ value, status, tabInnerProps, className, children, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
   const { variant, store } = useTabsContext();
   const stringValue = value.toString();
   const isActive = useStore(store, (state) => state.activeTab === stringValue);
+  useRegisterTabLabel(stringValue, children);
   const tabRef = useRef(null);
   useEffect(() => {
     if (isActive) {
@@ -10329,21 +10661,41 @@ const Tab = forwardRef(function Tab2({ value, status, tabInnerProps, className,
     }
   );
 });
-const TabContent = forwardRef(function TabContent2({ value, className, ...otherProps }, forwardedRef) {
+const TabContent = forwardRef(function TabContent2({ asChild, value, className, tabContentLabelProps, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
-  return /* @__PURE__ */ jsx(
-    Tabs$1.Content,
-    {
-      value: value.toString(),
-      className: cx(prefix("tabs__tab-content"), className),
-      ...otherProps,
-      ref: forwardedRef
-    }
-  );
+  const printing = usePrinting();
+  const stringValue = value.toString();
+  const { showAllTabsWhilePrinting } = useTabsContext();
+  const tabLabel = useTabLabel(stringValue);
+  const As = printing && showAllTabsWhilePrinting ? asChild ? Slot : "div" : Tabs$1.TabsContent;
+  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+    printing && showAllTabsWhilePrinting && /* @__PURE__ */ jsx(
+      "span",
+      {
+        ...tabContentLabelProps,
+        className: cx(
+          prefix("tabs__tab-content-label"),
+          tabContentLabelProps?.className
+        ),
+        children: tabLabel
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      As,
+      {
+        ...!printing || !showAllTabsWhilePrinting ? { asChild } : {},
+        value: stringValue,
+        className: cx(prefix("tabs__tab-content"), className),
+        ...otherProps,
+        ref: forwardedRef
+      }
+    )
+  ] });
 });
 const TabList = forwardRef(function TabList2({ rootProps, containerProps, className, children, ...otherProps }, forwardedRef) {
   const prefix = usePrefix();
-  const { variant, store } = useTabsContext();
+  const { variant, showAllTabsWhilePrinting, store } = useTabsContext();
+  const { printHidden } = usePrintClassNames();
   const [rootEl, setRootEl] = useState(null);
   const [containerEl, setContainerEl] = useState(null);
   useMeasure(
@@ -10421,6 +10773,7 @@ const TabList = forwardRef(function TabList2({ rootProps, containerProps, classN
       className: cx(
         prefix("tabs__tab-list-root"),
         prefix(`tabs__tab-list-root--${variant}`),
+        showAllTabsWhilePrinting && printHidden,
         rootProps?.className
       ),
       ref: combinedRootRef,
@@ -10486,11 +10839,17 @@ const Tabs = forwardRef(function Tabs2({
   defaultValue,
   value,
   onValueChange,
+  showAllTabsWhilePrinting,
   className,
   ...otherProps
 }, forwardedRef) {
   const prefix = usePrefix();
-  const tabsContextValue = useCreateTabsContext(variant, defaultValue, value);
+  const tabsContextValue = useCreateTabsContext(
+    variant,
+    defaultValue,
+    value,
+    showAllTabsWhilePrinting
+  );
   const handleValueChange = useCallback(
     (value2) => tabsContextValue.store.setState({ activeTab: value2 }),
     [tabsContextValue.store]
@@ -10602,6 +10961,7 @@ function registerKeyboardShortcut(keybinds, action, {
   });
 }
 function useKeyboardShortcut(keybinds, action, {
+  enabled = true,
   target = window,
   eventType = "keydown",
   sequenceTimeout = 1e3,
@@ -10612,7 +10972,7 @@ function useKeyboardShortcut(keybinds, action, {
   const shortcutsString = Array.isArray(keybinds) ? keybinds.join("__") : keybinds;
   const latestCallbacks = useLatestValues({ action, ignore });
   useEffect(() => {
-    if (shortcutsString && target !== null) {
+    if (enabled && shortcutsString && target !== null) {
       return registerKeyboardShortcut(
         shortcutsString.split("__"),
         (evt) => latestCallbacks.action(evt),
@@ -10628,6 +10988,7 @@ function useKeyboardShortcut(keybinds, action, {
     }
   }, [
     capture,
+    enabled,
     eventType,
     latestCallbacks,
     preventDefault,
@@ -10904,6 +11265,9 @@ export {
   PortalContext,
   PrefixContext,
   PrefixProvider,
+  Printer,
+  PrinterContent,
+  PrinterTrigger,
   Radio,
   RadioGroup,
   Root,
@@ -11007,6 +11371,10 @@ export {
   useOnFieldLabelChange,
   usePortalContext,
   usePrefix,
+  usePrint,
+  usePrintClassNames,
+  usePrintInProgress,
+  usePrinting,
   useResponsiveValues,
   useScrollPosition,
   useScrollbarSize,
@@ -11018,6 +11386,7 @@ export {
   useSetFieldHelperText,
   useSetFieldLabel,
   useSpacing,
+  useStartPrintingTask,
   useTableNumberOfColumns,
   useToastManager,
   validateNumericTransformerOptions,