@cimpress-ui/react 1.6.0 → 1.7.1

package/dist/esm/components/app-header/side-nav.d.ts

@@ -0,0 +1,34 @@
+import { type ReactNode } from 'react';
+import type { Href } from '../types.js';
+export interface UNSTABLE_SideNavProps {
+    children: ReactNode;
+    isOpen?: boolean;
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Determines how the side nav is displayed and behaves.
+     * - `overlay`: The side nav slides in as an overlay on top of the main content. This is used when all available screen space is needed for the main content.
+     * - `fixed`: The side nav is fixed to the side and includes an expand button to toggle between a compact icon-only view and an expanded view showing labels. On smaller screens, it slides in as an overlay.
+     *
+     * @default 'fixed'
+     */
+    variant?: 'overlay' | 'fixed';
+}
+export declare function UNSTABLE_SideNav({ children, isOpen, onOpenChange, variant }: UNSTABLE_SideNavProps): import("react/jsx-runtime").JSX.Element;
+export interface UNSTABLE_SideNavListProps {
+    children: ReactNode;
+}
+export declare function UNSTABLE_SideNavList({ children }: UNSTABLE_SideNavListProps): import("react/jsx-runtime").JSX.Element;
+interface UNSTABLE_SideNavListItem {
+    label: string;
+    href: Href;
+    isActive?: boolean;
+    icon?: ReactNode;
+}
+export declare function UNSTABLE_SideNavListItem({ label, href, isActive, icon }: UNSTABLE_SideNavListItem): import("react/jsx-runtime").JSX.Element;
+export interface UNSTABLE_SideNavListSectionProps {
+    children: ReactNode;
+    label?: string;
+}
+export declare function UNSTABLE_SideNavListSection({ children, label }: UNSTABLE_SideNavListSectionProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=side-nav.d.ts.map

package/dist/esm/components/app-header/side-nav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"side-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/side-nav.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAQlE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAKxC,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;CAC/B;AAED,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,OAAiB,EAAE,EAAE,qBAAqB,2CA6B5G;AAED,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,yBAAyB,2CAE3E;AAED,UAAU,wBAAwB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,wBAAwB,2CAajG;AAED,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,gCAAgC,2CAehG"}

package/dist/esm/components/app-header/side-nav.js

@@ -0,0 +1,29 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+import { Link as RACLink } from 'react-aria-components';
+import { UNSTABLE_IconExpand } from '../../icons/index.js';
+import { useIsMobile } from '../../utils/use-is-mobile.js';
+import { IconButton } from '../button/icon-button.js';
+import { Drawer, DrawerBody } from '../drawer/drawer.js';
+import { UNSTABLE_Hidden } from '../hidden/hidden.js';
+import { Tooltip } from '../tooltip/tooltip.js';
+import { Text } from '../typography/text.js';
+const SideNavContext = createContext({ isOpen: false });
+export function UNSTABLE_SideNav({ children, isOpen, onOpenChange, variant = 'fixed' }) {
+    const isMobile = useIsMobile();
+    const drawer = (isMobile || variant === 'overlay') && (_jsx(Drawer, { UNSTABLE_placement: "start", isOpen: isOpen, onOpenChange: onOpenChange, "aria-label": "Side navigation", children: _jsx(DrawerBody, { children: children }) }));
+    return (_jsxs(SideNavContext.Provider, { value: { isOpen: isOpen ?? false }, children: [drawer, variant === 'fixed' && (_jsx(UNSTABLE_Hidden, { hide: { sm: true, md: false }, children: _jsxs("div", { className: "cim-side-nav", "data-expanded": isOpen, children: [_jsx("div", { className: "cim-side-nav-header", children: _jsx(IconButton, { variant: "tertiary", icon: _jsx(UNSTABLE_IconExpand, { UNSAFE_style: isOpen ? { transform: 'rotate(180deg)' } : {} }), "aria-label": "Expand sidebar", onPress: () => onOpenChange?.(!isOpen) }) }), _jsx("div", { className: "cim-side-nav-list-container", children: children })] }) }))] }));
+}
+export function UNSTABLE_SideNavList({ children }) {
+    return _jsx("div", { className: "cim-side-nav-list", children: children });
+}
+export function UNSTABLE_SideNavListItem({ label, href, isActive, icon }) {
+    const { isOpen } = useContext(SideNavContext);
+    return (_jsx(Tooltip, { label: label, placement: "right", isDisabled: isOpen, children: _jsxs(RACLink, { href: href, className: "cim-side-nav-list-item", "data-active": isActive, "data-expanded": isOpen, children: [icon, _jsx(Text, { as: "span", variant: "medium", UNSAFE_className: "cim-side-nav-list-item-label", children: label })] }) }));
+}
+export function UNSTABLE_SideNavListSection({ children, label }) {
+    const { isOpen } = useContext(SideNavContext);
+    return (_jsxs("div", { className: "cim-side-nav-list-section", "data-expanded": isOpen, children: [label && (_jsx("div", { className: "cim-side-nav-list-section-header", children: _jsx(Text, { as: "p", variant: "small-semibold", tone: "subtle", UNSAFE_className: "cim-side-nav-list-section-header-label", children: label }) })), children] }));
+}
+//# sourceMappingURL=side-nav.js.map

package/dist/esm/components/app-header/side-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../../../src/components/app-header/side-nav.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { createContext, useContext, type ReactNode } from 'react';\nimport { Link as RACLink } from 'react-aria-components';\nimport { UNSTABLE_IconExpand } from '../../icons/index.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { Drawer, DrawerBody } from '../drawer/drawer.js';\nimport { UNSTABLE_Hidden } from '../hidden/hidden.js';\nimport { Tooltip } from '../tooltip/tooltip.js';\nimport type { Href } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nconst SideNavContext = createContext<{ isOpen: boolean }>({ isOpen: false });\n\nexport interface UNSTABLE_SideNavProps {\n  children: ReactNode;\n  isOpen?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * Determines how the side nav is displayed and behaves.\n   * - `overlay`: The side nav slides in as an overlay on top of the main content. This is used when all available screen space is needed for the main content.\n   * - `fixed`: The side nav is fixed to the side and includes an expand button to toggle between a compact icon-only view and an expanded view showing labels. On smaller screens, it slides in as an overlay.\n   *\n   * @default 'fixed'\n   */\n  variant?: 'overlay' | 'fixed';\n}\n\nexport function UNSTABLE_SideNav({ children, isOpen, onOpenChange, variant = 'fixed' }: UNSTABLE_SideNavProps) {\n  const isMobile = useIsMobile();\n\n  const drawer = (isMobile || variant === 'overlay') && (\n    <Drawer UNSTABLE_placement=\"start\" isOpen={isOpen} onOpenChange={onOpenChange} aria-label=\"Side navigation\">\n      <DrawerBody>{children}</DrawerBody>\n    </Drawer>\n  );\n\n  return (\n    <SideNavContext.Provider value={{ isOpen: isOpen ?? false }}>\n      {drawer}\n      {variant === 'fixed' && (\n        <UNSTABLE_Hidden hide={{ sm: true, md: false }}>\n          <div className=\"cim-side-nav\" data-expanded={isOpen}>\n            <div className=\"cim-side-nav-header\">\n              <IconButton\n                variant=\"tertiary\"\n                icon={<UNSTABLE_IconExpand UNSAFE_style={isOpen ? { transform: 'rotate(180deg)' } : {}} />}\n                aria-label=\"Expand sidebar\"\n                onPress={() => onOpenChange?.(!isOpen)}\n              />\n            </div>\n            <div className=\"cim-side-nav-list-container\">{children}</div>\n          </div>\n        </UNSTABLE_Hidden>\n      )}\n    </SideNavContext.Provider>\n  );\n}\n\nexport interface UNSTABLE_SideNavListProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_SideNavList({ children }: UNSTABLE_SideNavListProps) {\n  return <div className=\"cim-side-nav-list\">{children}</div>;\n}\n\ninterface UNSTABLE_SideNavListItem {\n  label: string;\n  href: Href;\n  isActive?: boolean;\n  icon?: ReactNode;\n}\n\nexport function UNSTABLE_SideNavListItem({ label, href, isActive, icon }: UNSTABLE_SideNavListItem) {\n  const { isOpen } = useContext(SideNavContext);\n\n  return (\n    <Tooltip label={label} placement=\"right\" isDisabled={isOpen}>\n      <RACLink href={href} className=\"cim-side-nav-list-item\" data-active={isActive} data-expanded={isOpen}>\n        {icon}\n        <Text as=\"span\" variant=\"medium\" UNSAFE_className=\"cim-side-nav-list-item-label\">\n          {label}\n        </Text>\n      </RACLink>\n    </Tooltip>\n  );\n}\n\nexport interface UNSTABLE_SideNavListSectionProps {\n  children: ReactNode;\n  label?: string;\n}\n\nexport function UNSTABLE_SideNavListSection({ children, label }: UNSTABLE_SideNavListSectionProps) {\n  const { isOpen } = useContext(SideNavContext);\n\n  return (\n    <div className=\"cim-side-nav-list-section\" data-expanded={isOpen}>\n      {label && (\n        <div className=\"cim-side-nav-list-section-header\">\n          <Text as=\"p\" variant=\"small-semibold\" tone=\"subtle\" UNSAFE_className=\"cim-side-nav-list-section-header-label\">\n            {label}\n          </Text>\n        </div>\n      )}\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/esm/components/app-shell/app-shell.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from 'react';
+export interface UNSTABLE_AppShellProps {
+    children: ReactNode;
+}
+export declare function UNSTABLE_AppShell({ children }: UNSTABLE_AppShellProps): import("react/jsx-runtime").JSX.Element;
+export interface UNSTABLE_AppShellBodyProps {
+    children: ReactNode;
+}
+export declare function UNSTABLE_AppShellBody({ children }: UNSTABLE_AppShellBodyProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=app-shell.d.ts.map

package/dist/esm/components/app-shell/app-shell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE,sBAAsB,2CAErE;AAED,MAAM,WAAW,0BAA0B;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,qBAAqB,CAAC,EAAE,QAAQ,EAAE,EAAE,0BAA0B,2CAE7E"}

package/dist/esm/components/app-shell/app-shell.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from 'clsx';
+export function UNSTABLE_AppShell({ children }) {
+    return _jsx("div", { className: clsx('cim-app-shell'), children: children });
+}
+export function UNSTABLE_AppShellBody({ children }) {
+    return _jsx("div", { className: "cim-app-shell-main", children: children });
+}
+//# sourceMappingURL=app-shell.js.map

package/dist/esm/components/app-shell/app-shell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-shell.js","sourceRoot":"","sources":["../../../../src/components/app-shell/app-shell.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,UAAU,iBAAiB,CAAC,EAAE,QAAQ,EAA0B;IACpE,OAAO,cAAK,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,YAAG,QAAQ,GAAO,CAAC;AACjE,CAAC;AAMD,MAAM,UAAU,qBAAqB,CAAC,EAAE,QAAQ,EAA8B;IAC5E,OAAO,cAAK,SAAS,EAAC,oBAAoB,YAAE,QAAQ,GAAO,CAAC;AAC9D,CAAC","sourcesContent":["import clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\nexport interface UNSTABLE_AppShellProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_AppShell({ children }: UNSTABLE_AppShellProps) {\n  return <div className={clsx('cim-app-shell')}>{children}</div>;\n}\n\nexport interface UNSTABLE_AppShellBodyProps {\n  children: ReactNode;\n}\n\nexport function UNSTABLE_AppShellBody({ children }: UNSTABLE_AppShellBodyProps) {\n  return <div className=\"cim-app-shell-main\">{children}</div>;\n}\n"]}

package/dist/esm/components/drawer/drawer.d.ts

@@ -26,7 +26,7 @@ export interface DrawerProps extends CommonProps, AriaLabelingProps {
     /** The contents of the drawer. A function may be provided to access a function to close the drawer. */
     children: ReactNode | ((renderProps: DrawerRenderProps) => ReactNode);
     /** The title of the drawer. */
-    title: string;
+    title?: string;
     /**
      * The size of the drawer. This prop is ignored on small devices - drawers on small devices will always take up all available width.
      * @default 'small'
@@ -53,6 +53,11 @@ export interface DrawerProps extends CommonProps, AriaLabelingProps {
      * If using `DrawerRoot`, this prop has no effect - provide `onOpenChange` to `DrawerRoot` instead.
      */
     onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * The placement of the drawer.
+     * @default 'end'
+     */
+    UNSTABLE_placement?: 'start' | 'end';
 }
 /**
  * Displays an overlay element which blocks interaction with outside elements.

package/dist/esm/components/drawer/drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAYrD,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAGlE,MAAM,WAAW,eAAe;IAC9B,iIAAiI;IACjI,QAAQ,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mEAAmE;IACnE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAEhD;yBAFe,UAAU;;;AAM1B,MAAM,WAAW,iBAAiB;IAChC,qCAAqC;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,WAAY,SAAQ,WAAW,EAAE,iBAAiB;IACjE,uGAAuG;IACvG,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,WAAW,EAAE,iBAAiB,KAAK,SAAS,CAAC,CAAC;IACtE,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AA6DD;;;;GAIG;AACH,QAAA,MAAM,OAAO,yGAA+B,CAAC;AAE7C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAE7B,MAAM,WAAW,eAAe;IAC9B,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,uCAAuC;AACvC,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAEhD;yBAFe,UAAU;;;AAM1B,MAAM,WAAW,kBAAkB;IACjC,sDAAsD;IACtD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,uCAAuC;AACvC,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAMvE;yBANe,aAAa"}
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAYrD,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAGlE,MAAM,WAAW,eAAe;IAC9B,iIAAiI;IACjI,QAAQ,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mEAAmE;IACnE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAEhD;yBAFe,UAAU;;;AAM1B,MAAM,WAAW,iBAAiB;IAChC,qCAAqC;IACrC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,WAAY,SAAQ,WAAW,EAAE,iBAAiB;IACjE,uGAAuG;IACvG,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,WAAW,EAAE,iBAAiB,KAAK,SAAS,CAAC,CAAC;IACtE,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CACtC;AAoED;;;;GAIG;AACH,QAAA,MAAM,OAAO,yGAA+B,CAAC;AAE7C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAE7B,MAAM,WAAW,eAAe;IAC9B,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,uCAAuC;AACvC,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAEhD;yBAFe,UAAU;;;AAM1B,MAAM,WAAW,kBAAkB;IACjC,sDAAsD;IACtD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,uCAAuC;AACvC,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAMvE;yBANe,aAAa"}

package/dist/esm/components/drawer/drawer.js

@@ -15,7 +15,7 @@ export function DrawerRoot(props) {
     return _jsx(RACDialogTrigger, { ...props });
 }
 DrawerRoot.displayName = 'DrawerRoot';
-function Drawer({ children, title, size = 'small', UNSAFE_className, UNSAFE_style, isDismissible = true, isOpen, defaultOpen, onOpenChange, ...props }, ref) {
+function Drawer({ children, title, size = 'small', UNSAFE_className, UNSAFE_style, isDismissible = true, isOpen, defaultOpen, onOpenChange, UNSTABLE_placement: placement = 'end', ...props }, ref) {
     const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
     useProductionWarning(() => {
         if (!title && !ariaLabel && !ariaLabelledBy) {
@@ -23,7 +23,7 @@ function Drawer({ children, title, size = 'small', UNSAFE_className, UNSAFE_styl
         }
     }, [title, ariaLabel, ariaLabelledBy]);
     const messages = useLocalizedMessages('common');
-    return (_jsx(RACModalOverlay, { className: "cim-drawer-overlay", isDismissable: isDismissible, isKeyboardDismissDisabled: !isDismissible, isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, "data-cim-style-root": true, children: _jsx(RACModal, { className: clsx('cim-drawer', UNSAFE_className), style: UNSAFE_style, "data-size": size, children: _jsx(RACDialog, { ...props, ref: ref, className: "cim-drawer-dialog", children: (renderProps) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "cim-drawer-header", children: [title && (_jsx(RACHeading, { slot: "title", className: clsx('cim-drawer-title', textStyle({ variant: 'title-5', tone: 'base' })), children: title })), isDismissible && _jsx(XButton, { "aria-label": messages.format('dismiss'), slot: "close" })] }), typeof children === 'function' ? children(renderProps) : children] })) }) }) }));
+    return (_jsx(RACModalOverlay, { className: "cim-drawer-overlay", isDismissable: isDismissible, isKeyboardDismissDisabled: !isDismissible, isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, "data-cim-style-root": true, "data-placement": placement, children: _jsx(RACModal, { className: clsx('cim-drawer', UNSAFE_className), style: UNSAFE_style, "data-size": size, "data-placement": placement, children: _jsx(RACDialog, { ...props, ref: ref, className: "cim-drawer-dialog", children: (renderProps) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "cim-drawer-header", children: [title && (_jsx(RACHeading, { slot: "title", className: clsx('cim-drawer-title', textStyle({ variant: 'title-5', tone: 'base' })), children: title })), isDismissible && _jsx(XButton, { "aria-label": messages.format('dismiss'), slot: "close" })] }), typeof children === 'function' ? children(renderProps) : children] })) }) }) }));
 }
 /**
  * Displays an overlay element which blocks interaction with outside elements.

package/dist/esm/components/drawer/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef, ReactNode } from 'react';\nimport {\n  Dialog as RACDialog,\n  DialogTrigger as RACDialogTrigger,\n  Heading as RACHeading,\n  Modal as RACModal,\n  ModalOverlay as RACModalOverlay,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AriaLabelingProps, CommonProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface DrawerRootProps {\n  /** The drawer trigger with its associated drawer. Provide the trigger as the first child, and the drawer as the second child. */\n  children: ReactNode;\n  /** Whether the drawer is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the drawer is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Handler that is called when the drawer's open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\n/**\n * Encapsulates a drawer trigger and its associated drawer.\n * The trigger can be any Cimpress UI button, and the drawer will be displayed when the trigger is activated.\n */\nexport function DrawerRoot(props: DrawerRootProps) {\n  return <RACDialogTrigger {...props} />;\n}\n\nDrawerRoot.displayName = 'DrawerRoot';\n\nexport interface DrawerRenderProps {\n  /** Closes the drawer when called. */\n  close: () => void;\n}\n\nexport interface DrawerProps extends CommonProps, AriaLabelingProps {\n  /** The contents of the drawer. A function may be provided to access a function to close the drawer. */\n  children: ReactNode | ((renderProps: DrawerRenderProps) => ReactNode);\n  /** The title of the drawer. */\n  title: string;\n  /**\n   * The size of the drawer. This prop is ignored on small devices - drawers on small devices will always take up all available width.\n   * @default 'small'\n   */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Whether the drawer can be closed by clicking the close button, clicking outside of the drawer, or pressing the Escape key.\n   * When `false`, the drawer can only be closed programmatically.\n   * @default true\n   */\n  isDismissible?: boolean;\n  /**\n   * Whether the drawer is open (controlled).\n   * If using `DrawerRoot`, this prop has no effect - provide `isOpen` to `DrawerRoot` instead.\n   */\n  isOpen?: boolean;\n  /**\n   * Whether the drawer is open by default (uncontrolled).\n   * If using `DrawerRoot`, this prop has no effect - provide `defaultOpen` to `DrawerRoot` instead.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Handler that is called when the drawer's open state changes.\n   * If using `DrawerRoot`, this prop has no effect - provide `onOpenChange` to `DrawerRoot` instead.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\nfunction Drawer(\n  {\n    children,\n    title,\n    size = 'small',\n    UNSAFE_className,\n    UNSAFE_style,\n    isDismissible = true,\n    isOpen,\n    defaultOpen,\n    onOpenChange,\n    ...props\n  }: DrawerProps,\n  ref: ForwardedRef<HTMLElement>,\n) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useProductionWarning(() => {\n    if (!title && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Drawer requires one of title / aria-label / aria-labelledby for accessibility');\n    }\n  }, [title, ariaLabel, ariaLabelledBy]);\n\n  const messages = useLocalizedMessages('common');\n\n  return (\n    <RACModalOverlay\n      className=\"cim-drawer-overlay\"\n      isDismissable={isDismissible}\n      isKeyboardDismissDisabled={!isDismissible}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      data-cim-style-root\n    >\n      <RACModal className={clsx('cim-drawer', UNSAFE_className)} style={UNSAFE_style} data-size={size}>\n        <RACDialog {...props} ref={ref} className=\"cim-drawer-dialog\">\n          {(renderProps) => (\n            <>\n              <div className=\"cim-drawer-header\">\n                {title && (\n                  <RACHeading\n                    slot=\"title\"\n                    className={clsx('cim-drawer-title', textStyle({ variant: 'title-5', tone: 'base' }))}\n                  >\n                    {title}\n                  </RACHeading>\n                )}\n                {isDismissible && <XButton aria-label={messages.format('dismiss')} slot=\"close\" />}\n              </div>\n              {typeof children === 'function' ? children(renderProps) : children}\n            </>\n          )}\n        </RACDialog>\n      </RACModal>\n    </RACModalOverlay>\n  );\n}\n\n/**\n * Displays an overlay element which blocks interaction with outside elements.\n *\n * See [drawer usage guidelines](https://ui.cimpress.io/components/drawer/).\n */\nconst _Drawer = forwardRef(Drawer, 'Drawer');\n\nexport { _Drawer as Drawer };\n\nexport interface DrawerBodyProps {\n  /** The content to render within the drawer. */\n  children: ReactNode;\n}\n\n/** Renders content within `Drawer`. */\nexport function DrawerBody(props: DrawerBodyProps) {\n  return <div {...props} className=\"cim-drawer-body\" />;\n}\n\nDrawerBody.displayName = 'DrawerBody';\n\nexport interface DrawerActionsProps {\n  /** Actions that should be available in the drawer. */\n  children: ReactNode;\n}\n\n/** Renders actions within `Drawer`. */\nexport function DrawerActions({ children, ...props }: DrawerActionsProps) {\n  return (\n    <div {...props} className=\"cim-drawer-actions\">\n      {children}\n    </div>\n  );\n}\n\nDrawerActions.displayName = 'DrawerActions';\n"]}
+{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef, ReactNode } from 'react';\nimport {\n  Dialog as RACDialog,\n  DialogTrigger as RACDialogTrigger,\n  Heading as RACHeading,\n  Modal as RACModal,\n  ModalOverlay as RACModalOverlay,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AriaLabelingProps, CommonProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface DrawerRootProps {\n  /** The drawer trigger with its associated drawer. Provide the trigger as the first child, and the drawer as the second child. */\n  children: ReactNode;\n  /** Whether the drawer is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the drawer is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Handler that is called when the drawer's open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\n/**\n * Encapsulates a drawer trigger and its associated drawer.\n * The trigger can be any Cimpress UI button, and the drawer will be displayed when the trigger is activated.\n */\nexport function DrawerRoot(props: DrawerRootProps) {\n  return <RACDialogTrigger {...props} />;\n}\n\nDrawerRoot.displayName = 'DrawerRoot';\n\nexport interface DrawerRenderProps {\n  /** Closes the drawer when called. */\n  close: () => void;\n}\n\nexport interface DrawerProps extends CommonProps, AriaLabelingProps {\n  /** The contents of the drawer. A function may be provided to access a function to close the drawer. */\n  children: ReactNode | ((renderProps: DrawerRenderProps) => ReactNode);\n  /** The title of the drawer. */\n  title?: string;\n  /**\n   * The size of the drawer. This prop is ignored on small devices - drawers on small devices will always take up all available width.\n   * @default 'small'\n   */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Whether the drawer can be closed by clicking the close button, clicking outside of the drawer, or pressing the Escape key.\n   * When `false`, the drawer can only be closed programmatically.\n   * @default true\n   */\n  isDismissible?: boolean;\n  /**\n   * Whether the drawer is open (controlled).\n   * If using `DrawerRoot`, this prop has no effect - provide `isOpen` to `DrawerRoot` instead.\n   */\n  isOpen?: boolean;\n  /**\n   * Whether the drawer is open by default (uncontrolled).\n   * If using `DrawerRoot`, this prop has no effect - provide `defaultOpen` to `DrawerRoot` instead.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Handler that is called when the drawer's open state changes.\n   * If using `DrawerRoot`, this prop has no effect - provide `onOpenChange` to `DrawerRoot` instead.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * The placement of the drawer.\n   * @default 'end'\n   */\n  UNSTABLE_placement?: 'start' | 'end';\n}\n\nfunction Drawer(\n  {\n    children,\n    title,\n    size = 'small',\n    UNSAFE_className,\n    UNSAFE_style,\n    isDismissible = true,\n    isOpen,\n    defaultOpen,\n    onOpenChange,\n    UNSTABLE_placement: placement = 'end',\n    ...props\n  }: DrawerProps,\n  ref: ForwardedRef<HTMLElement>,\n) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useProductionWarning(() => {\n    if (!title && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Drawer requires one of title / aria-label / aria-labelledby for accessibility');\n    }\n  }, [title, ariaLabel, ariaLabelledBy]);\n\n  const messages = useLocalizedMessages('common');\n\n  return (\n    <RACModalOverlay\n      className=\"cim-drawer-overlay\"\n      isDismissable={isDismissible}\n      isKeyboardDismissDisabled={!isDismissible}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      data-cim-style-root\n      data-placement={placement}\n    >\n      <RACModal\n        className={clsx('cim-drawer', UNSAFE_className)}\n        style={UNSAFE_style}\n        data-size={size}\n        data-placement={placement}\n      >\n        <RACDialog {...props} ref={ref} className=\"cim-drawer-dialog\">\n          {(renderProps) => (\n            <>\n              <div className=\"cim-drawer-header\">\n                {title && (\n                  <RACHeading\n                    slot=\"title\"\n                    className={clsx('cim-drawer-title', textStyle({ variant: 'title-5', tone: 'base' }))}\n                  >\n                    {title}\n                  </RACHeading>\n                )}\n                {isDismissible && <XButton aria-label={messages.format('dismiss')} slot=\"close\" />}\n              </div>\n              {typeof children === 'function' ? children(renderProps) : children}\n            </>\n          )}\n        </RACDialog>\n      </RACModal>\n    </RACModalOverlay>\n  );\n}\n\n/**\n * Displays an overlay element which blocks interaction with outside elements.\n *\n * See [drawer usage guidelines](https://ui.cimpress.io/components/drawer/).\n */\nconst _Drawer = forwardRef(Drawer, 'Drawer');\n\nexport { _Drawer as Drawer };\n\nexport interface DrawerBodyProps {\n  /** The content to render within the drawer. */\n  children: ReactNode;\n}\n\n/** Renders content within `Drawer`. */\nexport function DrawerBody(props: DrawerBodyProps) {\n  return <div {...props} className=\"cim-drawer-body\" />;\n}\n\nDrawerBody.displayName = 'DrawerBody';\n\nexport interface DrawerActionsProps {\n  /** Actions that should be available in the drawer. */\n  children: ReactNode;\n}\n\n/** Renders actions within `Drawer`. */\nexport function DrawerActions({ children, ...props }: DrawerActionsProps) {\n  return (\n    <div {...props} className=\"cim-drawer-actions\">\n      {children}\n    </div>\n  );\n}\n\nDrawerActions.displayName = 'DrawerActions';\n"]}

package/dist/esm/components/hidden/hidden.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+import type { Responsive } from '../spacing/types.js';
+export declare function UNSTABLE_Hidden({ children, hide }: {
+    children: ReactNode;
+    hide: Responsive<boolean>;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=hidden.d.ts.map

package/dist/esm/components/hidden/hidden.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hidden.d.ts","sourceRoot":"","sources":["../../../../src/components/hidden/hidden.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEtD,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,UAAU,CAAC,OAAO,CAAC,CAAA;CAAE,2CAiBrG"}

package/dist/esm/components/hidden/hidden.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from 'clsx';
+export function UNSTABLE_Hidden({ children, hide }) {
+    const hiddenDataAttributes = typeof hide === 'object'
+        ? Object.fromEntries(Object.entries(hide).map(([breakpoint, value]) => {
+            return [`data-hidden-${breakpoint}`, value];
+        }))
+        : {
+            'data-hidden-sm': hide,
+        };
+    return (_jsx("div", { className: clsx('cim-hidden'), ...hiddenDataAttributes, children: children }));
+}
+//# sourceMappingURL=hidden.js.map

package/dist/esm/components/hidden/hidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hidden.js","sourceRoot":"","sources":["../../../../src/components/hidden/hidden.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAIxB,MAAM,UAAU,eAAe,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAsD;IACpG,MAAM,oBAAoB,GACxB,OAAO,IAAI,KAAK,QAAQ;QACtB,CAAC,CAAC,MAAM,CAAC,WAAW,CAChB,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE;YAC/C,OAAO,CAAC,eAAe,UAAU,EAAE,EAAE,KAAK,CAAC,CAAC;QAC9C,CAAC,CAAC,CACH;QACH,CAAC,CAAC;YACE,gBAAgB,EAAE,IAAI;SACvB,CAAC;IAER,OAAO,CACL,cAAK,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,KAAM,oBAAoB,YACzD,QAAQ,GACL,CACP,CAAC;AACJ,CAAC","sourcesContent":["import clsx from 'clsx';\nimport type { ReactNode } from 'react';\nimport type { Responsive } from '../spacing/types.js';\n\nexport function UNSTABLE_Hidden({ children, hide }: { children: ReactNode; hide: Responsive<boolean> }) {\n  const hiddenDataAttributes =\n    typeof hide === 'object'\n      ? Object.fromEntries(\n          Object.entries(hide).map(([breakpoint, value]) => {\n            return [`data-hidden-${breakpoint}`, value];\n          }),\n        )\n      : {\n          'data-hidden-sm': hide,\n        };\n\n  return (\n    <div className={clsx('cim-hidden')} {...hiddenDataAttributes}>\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/esm/components/number-field/number-field.d.ts

@@ -1,6 +1,6 @@
 import { type NumberFieldProps as RACNumberFieldProps } from 'react-aria-components';
 import type { CommonProps, FieldWithPlaceholderProps } from '../types.js';
-export interface NumberFieldProps extends CommonProps, FieldWithPlaceholderProps<number>, Pick<RACNumberFieldProps, 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'autoFocus' | 'minValue' | 'maxValue' | 'step' | 'formatOptions' | 'onFocus' | 'onBlur'> {
+export interface NumberFieldProps extends CommonProps, FieldWithPlaceholderProps<number>, Pick<RACNumberFieldProps, 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'autoFocus' | 'minValue' | 'maxValue' | 'step' | 'formatOptions' | 'onFocus' | 'onBlur' | 'onKeyDown'> {
     /** The current value (controlled). A `null` value means an empty field. */
     value?: number | null;
     /** The default value (uncontrolled). A `null` value means an empty field. */

package/dist/esm/components/number-field/number-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"number-field.d.ts","sourceRoot":"","sources":["../../../../src/components/number-field/number-field.tsx"],"names":[],"mappings":"AAIA,OAAO,EAGL,KAAK,gBAAgB,IAAI,mBAAmB,EAE7C,MAAM,uBAAuB,CAAC;AAQ/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,gBACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,mBAAmB,EACjB,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,WAAW,GACX,UAAU,GACV,UAAU,GACV,MAAM,GACN,eAAe,GACf,SAAS,GACT,QAAQ,CACX;IACH,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,0FAA0F;IAC1F,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAwED;;;;GAIG;AACH,QAAA,MAAM,YAAY,kKAAyD,CAAC;AAE5E,OAAO,EAAE,YAAY,IAAI,WAAW,EAAE,CAAC"}
+{"version":3,"file":"number-field.d.ts","sourceRoot":"","sources":["../../../../src/components/number-field/number-field.tsx"],"names":[],"mappings":"AAIA,OAAO,EAGL,KAAK,gBAAgB,IAAI,mBAAmB,EAE7C,MAAM,uBAAuB,CAAC;AAQ/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,gBACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,mBAAmB,EACjB,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,WAAW,GACX,UAAU,GACV,UAAU,GACV,MAAM,GACN,eAAe,GACf,SAAS,GACT,QAAQ,GACR,WAAW,CACd;IACH,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,0FAA0F;IAC1F,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAwED;;;;GAIG;AACH,QAAA,MAAM,YAAY,kKAAyD,CAAC;AAE5E,OAAO,EAAE,YAAY,IAAI,WAAW,EAAE,CAAC"}

package/dist/esm/components/number-field/number-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-field.js","sourceRoot":"","sources":["../../../../src/components/number-field/number-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\nimport {\n  Input as RACInput,\n  NumberField as RACNumberField,\n  type NumberFieldProps as RACNumberFieldProps,\n  Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconAdd, IconSubtract } from '../../icons/index.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface NumberFieldProps\n  extends CommonProps,\n    FieldWithPlaceholderProps<number>,\n    Pick<\n      RACNumberFieldProps,\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'isReadOnly'\n      | 'autoFocus'\n      | 'minValue'\n      | 'maxValue'\n      | 'step'\n      | 'formatOptions'\n      | 'onFocus'\n      | 'onBlur'\n    > {\n  /** The current value (controlled). A `null` value means an empty field. */\n  value?: number | null;\n  /** The default value (uncontrolled). A `null` value means an empty field. */\n  defaultValue?: number | null;\n  /** Handler that is called when the value changes. A `null` value means an empty field. */\n  onChange?: (value: number | null) => void;\n}\n\nfunction NumberField(\n  {\n    label,\n    description,\n    error: errorMessage,\n    placeholder,\n    UNSAFE_className,\n    UNSAFE_style,\n    value,\n    defaultValue,\n    onChange,\n    ...props\n  }: NumberFieldProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useProductionWarning(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('NumberField requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  const messages = useLocalizedMessages('numberField');\n\n  return (\n    <RACNumberField\n      {...props}\n      ref={ref}\n      className={clsx('cim-number-field', UNSAFE_className)}\n      style={UNSAFE_style}\n      // NumberField uses `NaN` to signify an empty value, which is unintuitive\n      // https://github.com/adobe/react-spectrum/issues/5524\n      // https://github.com/adobe/react-spectrum/issues/6971\n      value={value === null ? Number.NaN : value}\n      defaultValue={defaultValue === null ? Number.NaN : defaultValue}\n      onChange={onChange ? (value) => onChange(Number.isNaN(value) ? null : value) : undefined}\n    >\n      <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n        {label}\n      </FormFieldLabel>\n      <RACGroup className=\"cim-number-field-input-group\">\n        <RACInput\n          className={clsx('cim-number-field-input', textStyle({ variant: 'body' }))}\n          placeholder={placeholder}\n        />\n        <div className=\"cim-number-field-spinner\">\n          <IconButton\n            slot=\"decrement\"\n            icon={<IconSubtract />}\n            aria-label={messages.format('decrement')}\n            variant=\"tertiary\"\n            size=\"small\"\n          />\n          <div className=\"cim-number-field-spinner-separator\" />\n          <IconButton\n            slot=\"increment\"\n            icon={<IconAdd />}\n            aria-label={messages.format('increment')}\n            variant=\"tertiary\"\n            size=\"small\"\n          />\n        </div>\n      </RACGroup>\n      <FormFieldError>{errorMessage}</FormFieldError>\n      <FormFieldDescription>{description}</FormFieldDescription>\n    </RACNumberField>\n  );\n}\n\n/**\n * Allows users to edit a number with a keyboard or increment/decrement buttons.\n *\n * See [number field usage guidelines](https://ui.cimpress.io/components/number-field/).\n */\nconst _NumberField = withStyleProps(forwardRef(NumberField), 'NumberField');\n\nexport { _NumberField as NumberField };\n"]}
+{"version":3,"file":"number-field.js","sourceRoot":"","sources":["../../../../src/components/number-field/number-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\nimport {\n  Input as RACInput,\n  NumberField as RACNumberField,\n  type NumberFieldProps as RACNumberFieldProps,\n  Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconAdd, IconSubtract } from '../../icons/index.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface NumberFieldProps\n  extends CommonProps,\n    FieldWithPlaceholderProps<number>,\n    Pick<\n      RACNumberFieldProps,\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'isReadOnly'\n      | 'autoFocus'\n      | 'minValue'\n      | 'maxValue'\n      | 'step'\n      | 'formatOptions'\n      | 'onFocus'\n      | 'onBlur'\n      | 'onKeyDown'\n    > {\n  /** The current value (controlled). A `null` value means an empty field. */\n  value?: number | null;\n  /** The default value (uncontrolled). A `null` value means an empty field. */\n  defaultValue?: number | null;\n  /** Handler that is called when the value changes. A `null` value means an empty field. */\n  onChange?: (value: number | null) => void;\n}\n\nfunction NumberField(\n  {\n    label,\n    description,\n    error: errorMessage,\n    placeholder,\n    UNSAFE_className,\n    UNSAFE_style,\n    value,\n    defaultValue,\n    onChange,\n    ...props\n  }: NumberFieldProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useProductionWarning(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('NumberField requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  const messages = useLocalizedMessages('numberField');\n\n  return (\n    <RACNumberField\n      {...props}\n      ref={ref}\n      className={clsx('cim-number-field', UNSAFE_className)}\n      style={UNSAFE_style}\n      // NumberField uses `NaN` to signify an empty value, which is unintuitive\n      // https://github.com/adobe/react-spectrum/issues/5524\n      // https://github.com/adobe/react-spectrum/issues/6971\n      value={value === null ? Number.NaN : value}\n      defaultValue={defaultValue === null ? Number.NaN : defaultValue}\n      onChange={onChange ? (value) => onChange(Number.isNaN(value) ? null : value) : undefined}\n    >\n      <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n        {label}\n      </FormFieldLabel>\n      <RACGroup className=\"cim-number-field-input-group\">\n        <RACInput\n          className={clsx('cim-number-field-input', textStyle({ variant: 'body' }))}\n          placeholder={placeholder}\n        />\n        <div className=\"cim-number-field-spinner\">\n          <IconButton\n            slot=\"decrement\"\n            icon={<IconSubtract />}\n            aria-label={messages.format('decrement')}\n            variant=\"tertiary\"\n            size=\"small\"\n          />\n          <div className=\"cim-number-field-spinner-separator\" />\n          <IconButton\n            slot=\"increment\"\n            icon={<IconAdd />}\n            aria-label={messages.format('increment')}\n            variant=\"tertiary\"\n            size=\"small\"\n          />\n        </div>\n      </RACGroup>\n      <FormFieldError>{errorMessage}</FormFieldError>\n      <FormFieldDescription>{description}</FormFieldDescription>\n    </RACNumberField>\n  );\n}\n\n/**\n * Allows users to edit a number with a keyboard or increment/decrement buttons.\n *\n * See [number field usage guidelines](https://ui.cimpress.io/components/number-field/).\n */\nconst _NumberField = withStyleProps(forwardRef(NumberField), 'NumberField');\n\nexport { _NumberField as NumberField };\n"]}

package/dist/esm/components/text-inputs/text-area.d.ts

@@ -1,6 +1,16 @@
+import { type RefObject } from 'react';
 import { type TextAreaProps as RACTextAreaProps, type TextFieldProps as RACTextFieldProps } from 'react-aria-components';
 import type { CommonProps, FieldWithPlaceholderProps } from '../types.js';
-export interface TextAreaProps extends CommonProps, FieldWithPlaceholderProps<string>, Pick<RACTextFieldProps, 'value' | 'defaultValue' | 'onChange' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'type' | 'autoFocus' | 'autoComplete' | 'inputMode' | 'minLength' | 'maxLength' | 'onFocus' | 'onBlur'>, Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {
+export interface TextAreaProps extends CommonProps, FieldWithPlaceholderProps<string>, Pick<RACTextFieldProps, 'value' | 'defaultValue' | 'onChange' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'type' | 'autoFocus' | 'autoComplete' | 'inputMode' | 'minLength' | 'maxLength' | 'onFocus' | 'onBlur' | 'onKeyDown'>, Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {
+    /** A React ref that allows access to the imperative API of this component. */
+    apiRef?: RefObject<TextAreaApi | null>;
+}
+/** The imperative API exposed by the `TextArea` component. */
+export interface TextAreaApi {
+    /** Focuses the text area. */
+    focus: () => void;
+    /** Selects the contents of the text area. */
+    select: () => void;
 }
 /**
  * Allows users to enter multiple lines of text with a keyboard.

package/dist/esm/components/text-inputs/text-area.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAIA,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,cAAc,IAAI,iBAAiB,EAEzC,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,QAAQ,CACX,EACD,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;CAAG;AAwDhG;;;;GAIG;AACH,QAAA,MAAM,SAAS,+JAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAkD,MAAM,OAAO,CAAC;AACvF,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,cAAc,IAAI,iBAAiB,EAEzC,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAG1E,MAAM,WAAW,aACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,QAAQ,GACR,WAAW,CACd,EACD,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,MAAM,CAAC;IAC3F,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACxC;AAED,8DAA8D;AAC9D,MAAM,WAAW,WAAW;IAC1B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,6CAA6C;IAC7C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAkED;;;;GAIG;AACH,QAAA,MAAM,SAAS,+JAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}

package/dist/esm/components/text-inputs/text-area.js

@@ -1,14 +1,14 @@
 'use client';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from 'clsx';
-import { useRef } from 'react';
+import { useRef, useImperativeHandle } from 'react';
 import { TextArea as RACTextArea, TextField as RACTextField, Group as RACGroup, } from 'react-aria-components';
 import { forwardRef } from '../../forward-ref.js';
 import { useProductionWarning } from '../../utils/use-production-warning.js';
 import { withStyleProps } from '../../with-style-props.js';
 import { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';
 import { textStyle } from '../typography/utils.js';
-function TextArea({ label, description, error: errorMessage, placeholder, autoCapitalize, autoCorrect, rows, spellCheck, wrap, UNSAFE_className, UNSAFE_style, ...props }, ref) {
+function TextArea({ label, description, error: errorMessage, placeholder, autoCapitalize, autoCorrect, rows, spellCheck, wrap, UNSAFE_className, UNSAFE_style, apiRef, ...props }, ref) {
     const textAreaRef = useRef(null);
     const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
     useProductionWarning(() => {
@@ -16,6 +16,10 @@ function TextArea({ label, description, error: errorMessage, placeholder, autoCa
             console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');
         }
     }, [label, ariaLabel, ariaLabelledBy]);
+    useImperativeHandle(apiRef, () => ({
+        focus: () => textAreaRef.current?.focus(),
+        select: () => textAreaRef.current?.select(),
+    }), []);
     return (_jsx(RACTextField, { ...props, ref: ref, className: clsx('cim-text-area', UNSAFE_className), style: UNSAFE_style, children: ({ isDisabled, isRequired }) => (_jsxs(_Fragment, { children: [_jsx(FormFieldLabel, { isRequired: isRequired, isDisabled: isDisabled, children: label }), _jsx(RACGroup, { className: "cim-text-area-input-group", onClick: () => textAreaRef.current?.focus(), children: _jsx(RACTextArea, { ref: textAreaRef, className: clsx('cim-text-area-input', textStyle({ variant: 'body' })), placeholder: placeholder, autoCapitalize: autoCapitalize, autoCorrect: autoCorrect, rows: rows, spellCheck: spellCheck, wrap: wrap }) }), _jsx(FormFieldError, { children: errorMessage }), _jsx(FormFieldDescription, { children: description })] })) }));
 }
 /**

package/dist/esm/components/text-inputs/text-area.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,MAAM,EAAqB,MAAM,OAAO,CAAC;AAClD,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,SAAS,IAAI,YAAY,EAGzB,KAAK,IAAI,QAAQ,GAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAE5G,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAyBnD,SAAS,QAAQ,CACf,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,cAAc,EACd,WAAW,EACX,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACM,EAChB,GAAiC;IAEjC,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEtD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,OAAO,CACL,KAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACvG,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAC/B,8BACE,KAAC,cAAc,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,YAC3D,KAAK,GACS,EACjB,KAAC,QAAQ,IAAC,SAAS,EAAC,2BAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,YACzF,KAAC,WAAW,IACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACtE,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,GACV,GACO,EACX,KAAC,cAAc,cAAE,YAAY,GAAkB,EAC/C,KAAC,oBAAoB,cAAE,WAAW,GAAwB,IACzD,CACJ,GACY,CAChB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,cAAc,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useRef, type ForwardedRef } from 'react';\nimport {\n  TextArea as RACTextArea,\n  TextField as RACTextField,\n  type TextAreaProps as RACTextAreaProps,\n  type TextFieldProps as RACTextFieldProps,\n  Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextAreaProps\n  extends CommonProps,\n    FieldWithPlaceholderProps<string>,\n    Pick<\n      RACTextFieldProps,\n      | 'value'\n      | 'defaultValue'\n      | 'onChange'\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'isReadOnly'\n      | 'type'\n      | 'autoFocus'\n      | 'autoComplete'\n      | 'inputMode'\n      | 'minLength'\n      | 'maxLength'\n      | 'onFocus'\n      | 'onBlur'\n    >,\n    Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {}\n\nfunction TextArea(\n  {\n    label,\n    description,\n    error: errorMessage,\n    placeholder,\n    autoCapitalize,\n    autoCorrect,\n    rows,\n    spellCheck,\n    wrap,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: TextAreaProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useProductionWarning(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <RACTextField {...props} ref={ref} className={clsx('cim-text-area', UNSAFE_className)} style={UNSAFE_style}>\n      {({ isDisabled, isRequired }) => (\n        <>\n          <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n            {label}\n          </FormFieldLabel>\n          <RACGroup className=\"cim-text-area-input-group\" onClick={() => textAreaRef.current?.focus()}>\n            <RACTextArea\n              ref={textAreaRef}\n              className={clsx('cim-text-area-input', textStyle({ variant: 'body' }))}\n              placeholder={placeholder}\n              autoCapitalize={autoCapitalize}\n              autoCorrect={autoCorrect}\n              rows={rows}\n              spellCheck={spellCheck}\n              wrap={wrap}\n            />\n          </RACGroup>\n          <FormFieldError>{errorMessage}</FormFieldError>\n          <FormFieldDescription>{description}</FormFieldDescription>\n        </>\n      )}\n    </RACTextField>\n  );\n}\n\n/**\n * Allows users to enter multiple lines of text with a keyboard.\n *\n * See [text area usage guidelines](https://ui.cimpress.io/components/text-area/).\n */\nconst _TextArea = withStyleProps(forwardRef(TextArea), 'TextArea');\n\nexport { _TextArea as TextArea };\n"]}
+{"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAkB,MAAM,EAAqB,mBAAmB,EAAE,MAAM,OAAO,CAAC;AACvF,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,SAAS,IAAI,YAAY,EAGzB,KAAK,IAAI,QAAQ,GAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAE5G,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAqCnD,SAAS,QAAQ,CACf,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,cAAc,EACd,WAAW,EACX,IAAI,EACJ,UAAU,EACV,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACM,EAChB,GAAiC;IAEjC,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEtD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,mBAAmB,CACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE;QACzC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE;KAC5C,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACvG,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CAC/B,8BACE,KAAC,cAAc,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,YAC3D,KAAK,GACS,EACjB,KAAC,QAAQ,IAAC,SAAS,EAAC,2BAA2B,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,EAAE,YACzF,KAAC,WAAW,IACV,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACtE,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,GACV,GACO,EACX,KAAC,cAAc,cAAE,YAAY,GAAkB,EAC/C,KAAC,oBAAoB,cAAE,WAAW,GAAwB,IACzD,CACJ,GACY,CAChB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,cAAc,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type RefObject, useRef, type ForwardedRef, useImperativeHandle } from 'react';\nimport {\n  TextArea as RACTextArea,\n  TextField as RACTextField,\n  type TextAreaProps as RACTextAreaProps,\n  type TextFieldProps as RACTextFieldProps,\n  Group as RACGroup,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextAreaProps\n  extends CommonProps,\n    FieldWithPlaceholderProps<string>,\n    Pick<\n      RACTextFieldProps,\n      | 'value'\n      | 'defaultValue'\n      | 'onChange'\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'isReadOnly'\n      | 'type'\n      | 'autoFocus'\n      | 'autoComplete'\n      | 'inputMode'\n      | 'minLength'\n      | 'maxLength'\n      | 'onFocus'\n      | 'onBlur'\n      | 'onKeyDown'\n    >,\n    Pick<RACTextAreaProps, 'autoCapitalize' | 'autoCorrect' | 'rows' | 'spellCheck' | 'wrap'> {\n  /** A React ref that allows access to the imperative API of this component. */\n  apiRef?: RefObject<TextAreaApi | null>;\n}\n\n/** The imperative API exposed by the `TextArea` component. */\nexport interface TextAreaApi {\n  /** Focuses the text area. */\n  focus: () => void;\n  /** Selects the contents of the text area. */\n  select: () => void;\n}\n\nfunction TextArea(\n  {\n    label,\n    description,\n    error: errorMessage,\n    placeholder,\n    autoCapitalize,\n    autoCorrect,\n    rows,\n    spellCheck,\n    wrap,\n    UNSAFE_className,\n    UNSAFE_style,\n    apiRef,\n    ...props\n  }: TextAreaProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useProductionWarning(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('TextArea requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  useImperativeHandle(\n    apiRef,\n    () => ({\n      focus: () => textAreaRef.current?.focus(),\n      select: () => textAreaRef.current?.select(),\n    }),\n    [],\n  );\n\n  return (\n    <RACTextField {...props} ref={ref} className={clsx('cim-text-area', UNSAFE_className)} style={UNSAFE_style}>\n      {({ isDisabled, isRequired }) => (\n        <>\n          <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n            {label}\n          </FormFieldLabel>\n          <RACGroup className=\"cim-text-area-input-group\" onClick={() => textAreaRef.current?.focus()}>\n            <RACTextArea\n              ref={textAreaRef}\n              className={clsx('cim-text-area-input', textStyle({ variant: 'body' }))}\n              placeholder={placeholder}\n              autoCapitalize={autoCapitalize}\n              autoCorrect={autoCorrect}\n              rows={rows}\n              spellCheck={spellCheck}\n              wrap={wrap}\n            />\n          </RACGroup>\n          <FormFieldError>{errorMessage}</FormFieldError>\n          <FormFieldDescription>{description}</FormFieldDescription>\n        </>\n      )}\n    </RACTextField>\n  );\n}\n\n/**\n * Allows users to enter multiple lines of text with a keyboard.\n *\n * See [text area usage guidelines](https://ui.cimpress.io/components/text-area/).\n */\nconst _TextArea = withStyleProps(forwardRef(TextArea), 'TextArea');\n\nexport { _TextArea as TextArea };\n"]}

package/dist/esm/components/text-inputs/text-field.d.ts

@@ -1,11 +1,21 @@
+import { type RefObject } from 'react';
 import { type TextFieldProps as RACTextFieldProps } from 'react-aria-components';
 import type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';
-export interface TextFieldProps extends CommonProps, FieldWithPlaceholderProps<string>, AffixProps, Pick<RACTextFieldProps, 'value' | 'defaultValue' | 'onChange' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'type' | 'autoFocus' | 'autoComplete' | 'inputMode' | 'minLength' | 'maxLength' | 'pattern' | 'onFocus' | 'onBlur'> {
+export interface TextFieldProps extends CommonProps, FieldWithPlaceholderProps<string>, AffixProps, Pick<RACTextFieldProps, 'value' | 'defaultValue' | 'onChange' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'isReadOnly' | 'type' | 'autoFocus' | 'autoComplete' | 'inputMode' | 'minLength' | 'maxLength' | 'pattern' | 'onFocus' | 'onBlur' | 'onKeyDown'> {
     /**
      * Whether to render a button that can be used to clear the text field.
      * @default false
      */
     isClearable?: boolean;
+    /** A React ref that allows access to the imperative API of this component. */
+    apiRef?: RefObject<TextFieldApi | null>;
+}
+/** The imperative API exposed by the `TextField` component. */
+export interface TextFieldApi {
+    /** Focuses the input field. */
+    focus: () => void;
+    /** Selects the contents of the input field. */
+    select: () => void;
 }
 /**
  * Allows users to enter a single line of text with a keyboard.

package/dist/esm/components/text-inputs/text-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"AAMA,OAAO,EACL,KAAK,cAAc,IAAI,iBAAiB,EAIzC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,cACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,UAAU,EACV,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,CACX;IACH;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAqHD;;;;GAIG;AACH,QAAA,MAAM,UAAU,gKAAqD,CAAC;AAEtE,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}
+{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAyC,KAAK,SAAS,EAA+B,MAAM,OAAO,CAAC;AAC3G,OAAO,EACL,KAAK,cAAc,IAAI,iBAAiB,EAIzC,MAAM,uBAAuB,CAAC;AAO/B,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,cACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,UAAU,EACV,IAAI,CACF,iBAAiB,EACf,OAAO,GACP,cAAc,GACd,UAAU,GACV,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,WAAW,GACX,WAAW,GACX,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,CACd;IACH;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;CACzC;AAED,+DAA+D;AAC/D,MAAM,WAAW,YAAY;IAC3B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAmID;;;;GAIG;AACH,QAAA,MAAM,UAAU,gKAAqD,CAAC;AAEtE,OAAO,EAAE,UAAU,IAAI,SAAS,EAAE,CAAC"}

package/dist/esm/components/text-inputs/text-field.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useId } from '@react-aria/utils';
 import { useControlledState } from '@react-stately/utils';
 import clsx from 'clsx';
-import { useRef } from 'react';
+import { useImperativeHandle, useRef } from 'react';
 import { Group as RACGroup, Input as RACInput, TextField as RACTextField, } from 'react-aria-components';
 import { forwardRef } from '../../forward-ref.js';
 import { useLocalizedMessages } from '../../i18n/localization-provider.js';
@@ -12,18 +12,23 @@ import { withStyleProps } from '../../with-style-props.js';
 import { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';
 import { XButton } from '../internal/x-button/x-button.js';
 import { textStyle } from '../typography/utils.js';
-function TextField({ label, description, error: errorMessage, placeholder, prefix, suffix, UNSAFE_className, UNSAFE_style, isClearable = false, value: consumerValue, defaultValue: consumerDefaultValue, onChange, ...props }, ref) {
+function TextField({ label, description, error: errorMessage, placeholder, prefix, suffix, UNSAFE_className, UNSAFE_style, isClearable = false, value: consumerValue, defaultValue: consumerDefaultValue, onChange, apiRef, ...props }, ref) {
     const { isDisabled, isReadOnly } = props;
     const inputRef = useRef(null);
     const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);
     const messages = useLocalizedMessages('common');
     const clearDescriptionId = useId();
+    useImperativeHandle(apiRef, () => ({
+        focus: () => inputRef.current?.focus(),
+        select: () => inputRef.current?.select(),
+    }), []);
     const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
+    const isFieldClearable = isClearable && !isDisabled && !isReadOnly;
     function onKeyDown(e) {
-        if (isDisabled || isReadOnly) {
+        if (!isFieldClearable) {
             return;
         }
-        if (e.key === 'Escape' && isClearable) {
+        if (e.key === 'Escape') {
             e.preventDefault();
             setValue('');
         }
@@ -33,9 +38,9 @@ function TextField({ label, description, error: errorMessage, placeholder, prefi
             console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');
         }
     }, [label, ariaLabel, ariaLabelledBy]);
-    return (_jsx(RACTextField, { ...props, ref: ref, className: clsx('cim-text-field', UNSAFE_className), style: UNSAFE_style, value: value, onChange: setValue, "aria-describedby": [props['aria-describedby'], isClearable ? clearDescriptionId : undefined]
+    return (_jsx(RACTextField, { ...props, ref: ref, className: clsx('cim-text-field', UNSAFE_className), style: UNSAFE_style, value: value, onChange: setValue, "aria-describedby": [props['aria-describedby'], isFieldClearable ? clearDescriptionId : undefined]
             .filter(Boolean)
-            .join(' '), children: ({ isDisabled, isRequired }) => (_jsxs(_Fragment, { children: [_jsx(FormFieldLabel, { isRequired: isRequired, isDisabled: isDisabled, children: label }), _jsxs(RACGroup, { className: "cim-text-field-input-group", onClick: () => inputRef.current?.focus(), children: [prefix && (_jsx("div", { className: clsx('cim-text-field-affix', textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' })), "aria-hidden": true, children: prefix })), _jsx(RACInput, { ref: inputRef, className: clsx('cim-text-field-input', textStyle({ variant: 'body' })), placeholder: placeholder, onKeyDown: onKeyDown }), isClearable && value !== '' && !isDisabled && !isReadOnly && (_jsx(XButton, { slot: null, UNSAFE_className: "cim-text-field-clear", "aria-label": messages.format('clearValue'), onPress: () => setValue(''), iconType: "circled", excludeFromTabOrder: true })), suffix && (_jsx("div", { className: clsx('cim-text-field-affix', textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' })), "aria-hidden": true, children: suffix }))] }), _jsx(FormFieldError, { children: errorMessage }), _jsx(FormFieldDescription, { children: description }), _jsx("p", { id: clearDescriptionId, className: "cim-text-field-clear-description", hidden: true, children: messages.format('clearValueDescription') })] })) }));
+            .join(' '), children: ({ isDisabled, isRequired }) => (_jsxs(_Fragment, { children: [_jsx(FormFieldLabel, { isRequired: isRequired, isDisabled: isDisabled, children: label }), _jsxs(RACGroup, { className: "cim-text-field-input-group", onClick: () => inputRef.current?.focus(), children: [prefix && (_jsx("div", { className: clsx('cim-text-field-affix', textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' })), "aria-hidden": true, children: prefix })), _jsx(RACInput, { ref: inputRef, className: clsx('cim-text-field-input', textStyle({ variant: 'body' })), placeholder: placeholder, onKeyDown: onKeyDown }), isFieldClearable && value !== '' && (_jsx(XButton, { slot: null, UNSAFE_className: "cim-text-field-clear", "aria-label": messages.format('clearValue'), onPress: () => setValue(''), iconType: "circled", excludeFromTabOrder: true })), suffix && (_jsx("div", { className: clsx('cim-text-field-affix', textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' })), "aria-hidden": true, children: suffix }))] }), _jsx(FormFieldError, { children: errorMessage }), _jsx(FormFieldDescription, { children: description }), isFieldClearable && (_jsx("p", { id: clearDescriptionId, className: "cim-text-field-clear-description", hidden: true, children: messages.format('clearValueDescription') }))] })) }));
 }
 /**
  * Allows users to enter a single line of text with a keyboard.

package/dist/esm/components/text-inputs/text-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport clsx from 'clsx';\nimport { type ForwardedRef, type KeyboardEvent, useRef } from 'react';\nimport {\n  type TextFieldProps as RACTextFieldProps,\n  Group as RACGroup,\n  Input as RACInput,\n  TextField as RACTextField,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/localization-provider.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextFieldProps\n  extends CommonProps,\n    FieldWithPlaceholderProps<string>,\n    AffixProps,\n    Pick<\n      RACTextFieldProps,\n      | 'value'\n      | 'defaultValue'\n      | 'onChange'\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'isReadOnly'\n      | 'type'\n      | 'autoFocus'\n      | 'autoComplete'\n      | 'inputMode'\n      | 'minLength'\n      | 'maxLength'\n      | 'pattern'\n      | 'onFocus'\n      | 'onBlur'\n    > {\n  /**\n   * Whether to render a button that can be used to clear the text field.\n   * @default false\n   */\n  isClearable?: boolean;\n}\n\nfunction TextField(\n  {\n    label,\n    description,\n    error: errorMessage,\n    placeholder,\n    prefix,\n    suffix,\n    UNSAFE_className,\n    UNSAFE_style,\n    isClearable = false,\n    value: consumerValue,\n    defaultValue: consumerDefaultValue,\n    onChange,\n    ...props\n  }: TextFieldProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { isDisabled, isReadOnly } = props;\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);\n  const messages = useLocalizedMessages('common');\n  const clearDescriptionId = useId();\n\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  function onKeyDown(e: KeyboardEvent) {\n    if (isDisabled || isReadOnly) {\n      return;\n    }\n\n    if (e.key === 'Escape' && isClearable) {\n      e.preventDefault();\n\n      setValue('');\n    }\n  }\n\n  useProductionWarning(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <RACTextField\n      {...props}\n      ref={ref}\n      className={clsx('cim-text-field', UNSAFE_className)}\n      style={UNSAFE_style}\n      value={value}\n      onChange={setValue}\n      aria-describedby={[props['aria-describedby'], isClearable ? clearDescriptionId : undefined]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      {({ isDisabled, isRequired }) => (\n        <>\n          <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n            {label}\n          </FormFieldLabel>\n          <RACGroup className=\"cim-text-field-input-group\" onClick={() => inputRef.current?.focus()}>\n            {prefix && (\n              <div\n                className={clsx(\n                  'cim-text-field-affix',\n                  textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n                )}\n                aria-hidden\n              >\n                {prefix}\n              </div>\n            )}\n\n            <RACInput\n              ref={inputRef}\n              className={clsx('cim-text-field-input', textStyle({ variant: 'body' }))}\n              placeholder={placeholder}\n              onKeyDown={onKeyDown}\n            />\n\n            {isClearable && value !== '' && !isDisabled && !isReadOnly && (\n              <XButton\n                slot={null}\n                UNSAFE_className=\"cim-text-field-clear\"\n                aria-label={messages.format('clearValue')}\n                onPress={() => setValue('')}\n                iconType=\"circled\"\n                excludeFromTabOrder\n              />\n            )}\n\n            {suffix && (\n              <div\n                className={clsx(\n                  'cim-text-field-affix',\n                  textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n                )}\n                aria-hidden\n              >\n                {suffix}\n              </div>\n            )}\n          </RACGroup>\n          <FormFieldError>{errorMessage}</FormFieldError>\n          <FormFieldDescription>{description}</FormFieldDescription>\n          <p id={clearDescriptionId} className=\"cim-text-field-clear-description\" hidden>\n            {messages.format('clearValueDescription')}\n          </p>\n        </>\n      )}\n    </RACTextField>\n  );\n}\n\n/**\n * Allows users to enter a single line of text with a keyboard.\n *\n * See [text field usage guidelines](https://ui.cimpress.io/components/text-field/).\n */\nconst _TextField = withStyleProps(forwardRef(TextField), 'TextField');\n\nexport { _TextField as TextField };\n"]}
+{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../../../src/components/text-inputs/text-field.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useId } from '@react-aria/utils';\nimport { useControlledState } from '@react-stately/utils';\nimport clsx from 'clsx';\nimport { type ForwardedRef, type KeyboardEvent, type RefObject, useImperativeHandle, useRef } from 'react';\nimport {\n  type TextFieldProps as RACTextFieldProps,\n  Group as RACGroup,\n  Input as RACInput,\n  TextField as RACTextField,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/localization-provider.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport type { AffixProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface TextFieldProps\n  extends CommonProps,\n    FieldWithPlaceholderProps<string>,\n    AffixProps,\n    Pick<\n      RACTextFieldProps,\n      | 'value'\n      | 'defaultValue'\n      | 'onChange'\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'isReadOnly'\n      | 'type'\n      | 'autoFocus'\n      | 'autoComplete'\n      | 'inputMode'\n      | 'minLength'\n      | 'maxLength'\n      | 'pattern'\n      | 'onFocus'\n      | 'onBlur'\n      | 'onKeyDown'\n    > {\n  /**\n   * Whether to render a button that can be used to clear the text field.\n   * @default false\n   */\n  isClearable?: boolean;\n  /** A React ref that allows access to the imperative API of this component. */\n  apiRef?: RefObject<TextFieldApi | null>;\n}\n\n/** The imperative API exposed by the `TextField` component. */\nexport interface TextFieldApi {\n  /** Focuses the input field. */\n  focus: () => void;\n  /** Selects the contents of the input field. */\n  select: () => void;\n}\n\nfunction TextField(\n  {\n    label,\n    description,\n    error: errorMessage,\n    placeholder,\n    prefix,\n    suffix,\n    UNSAFE_className,\n    UNSAFE_style,\n    isClearable = false,\n    value: consumerValue,\n    defaultValue: consumerDefaultValue,\n    onChange,\n    apiRef,\n    ...props\n  }: TextFieldProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { isDisabled, isReadOnly } = props;\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [value, setValue] = useControlledState(consumerValue, consumerDefaultValue ?? '', onChange);\n  const messages = useLocalizedMessages('common');\n  const clearDescriptionId = useId();\n\n  useImperativeHandle(\n    apiRef,\n    () => ({\n      focus: () => inputRef.current?.focus(),\n      select: () => inputRef.current?.select(),\n    }),\n    [],\n  );\n\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  const isFieldClearable = isClearable && !isDisabled && !isReadOnly;\n\n  function onKeyDown(e: KeyboardEvent) {\n    if (!isFieldClearable) {\n      return;\n    }\n\n    if (e.key === 'Escape') {\n      e.preventDefault();\n\n      setValue('');\n    }\n  }\n\n  useProductionWarning(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('TextField requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <RACTextField\n      {...props}\n      ref={ref}\n      className={clsx('cim-text-field', UNSAFE_className)}\n      style={UNSAFE_style}\n      value={value}\n      onChange={setValue}\n      aria-describedby={[props['aria-describedby'], isFieldClearable ? clearDescriptionId : undefined]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      {({ isDisabled, isRequired }) => (\n        <>\n          <FormFieldLabel isRequired={isRequired} isDisabled={isDisabled}>\n            {label}\n          </FormFieldLabel>\n          <RACGroup className=\"cim-text-field-input-group\" onClick={() => inputRef.current?.focus()}>\n            {prefix && (\n              <div\n                className={clsx(\n                  'cim-text-field-affix',\n                  textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n                )}\n                aria-hidden\n              >\n                {prefix}\n              </div>\n            )}\n\n            <RACInput\n              ref={inputRef}\n              className={clsx('cim-text-field-input', textStyle({ variant: 'body' }))}\n              placeholder={placeholder}\n              onKeyDown={onKeyDown}\n            />\n\n            {isFieldClearable && value !== '' && (\n              <XButton\n                slot={null}\n                UNSAFE_className=\"cim-text-field-clear\"\n                aria-label={messages.format('clearValue')}\n                onPress={() => setValue('')}\n                iconType=\"circled\"\n                excludeFromTabOrder\n              />\n            )}\n\n            {suffix && (\n              <div\n                className={clsx(\n                  'cim-text-field-affix',\n                  textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'subtle' }),\n                )}\n                aria-hidden\n              >\n                {suffix}\n              </div>\n            )}\n          </RACGroup>\n          <FormFieldError>{errorMessage}</FormFieldError>\n          <FormFieldDescription>{description}</FormFieldDescription>\n          {isFieldClearable && (\n            <p id={clearDescriptionId} className=\"cim-text-field-clear-description\" hidden>\n              {messages.format('clearValueDescription')}\n            </p>\n          )}\n        </>\n      )}\n    </RACTextField>\n  );\n}\n\n/**\n * Allows users to enter a single line of text with a keyboard.\n *\n * See [text field usage guidelines](https://ui.cimpress.io/components/text-field/).\n */\nconst _TextField = withStyleProps(forwardRef(TextField), 'TextField');\n\nexport { _TextField as TextField };\n"]}

package/dist/esm/components/tooltip/tooltip.d.ts

@@ -8,6 +8,8 @@ export interface TooltipProps extends Omit<CommonProps, 'id'>, Pick<RACTooltipPr
     label: string;
     /** The ref for the element which the tooltip positions itself with respect to. */
     triggerRef?: RefObject<Element | null>;
+    /** Whether the tooltip is disabled. */
+    isDisabled?: boolean;
 }
 /**
  * Provides additional information about an element that is hovered or focused.

package/dist/esm/components/tooltip/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltip/tooltip.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAGL,KAAK,YAAY,IAAI,eAAe,EAErC,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,EAC7B,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,QAAQ,GAAG,cAAc,CAAC;IAChE,gFAAgF;IAChF,QAAQ,EAAE,SAAS,CAAC;IACpB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,UAAU,CAAC,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;CACxC;AAgCD;;;;GAIG;AACH,QAAA,MAAM,QAAQ,6GAAiC,CAAC;AAEhD,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,CAAC"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltip/tooltip.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAGL,KAAK,YAAY,IAAI,eAAe,EAErC,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,EAC7B,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,QAAQ,GAAG,cAAc,CAAC;IAChE,gFAAgF;IAChF,QAAQ,EAAE,SAAS,CAAC;IACpB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,UAAU,CAAC,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;IACvC,uCAAuC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAgCD;;;;GAIG;AACH,QAAA,MAAM,QAAQ,6GAAiC,CAAC;AAEhD,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,CAAC"}

package/dist/esm/components/tooltip/tooltip.js

@@ -4,8 +4,8 @@ import clsx from 'clsx';
 import { Tooltip as RACTooltip, OverlayArrow as RACOverlayArrow, TooltipTrigger as RACTooltipTrigger, } from 'react-aria-components';
 import { forwardRef } from '../../forward-ref.js';
 import { Text } from '../typography/text.js';
-function Tooltip({ children, label, isOpen, onOpenChange, UNSAFE_className, UNSAFE_style, ...props }, ref) {
-    return (_jsxs(RACTooltipTrigger, { isOpen: isOpen, onOpenChange: onOpenChange, delay: 300, closeDelay: 300, children: [children, _jsxs(RACTooltip, { ...props, ref: ref, className: clsx('cim-tooltip', UNSAFE_className), style: UNSAFE_style, containerPadding: 16, offset: 5, arrowBoundaryOffset: 4, "data-cim-style-root": true, children: [_jsx(RACOverlayArrow, { className: "cim-tooltip-arrow", children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "10", viewBox: "0 0 16 10", children: _jsx("path", { d: "M0 0H16L8.78087 9.02391C8.38054 9.52432 7.61946 9.52432 7.21913 9.02391L0 0Z" }) }) }), _jsx(Text, { as: "p", variant: "small", children: label })] })] }));
+function Tooltip({ children, label, isOpen, onOpenChange, UNSAFE_className, UNSAFE_style, isDisabled, ...props }, ref) {
+    return (_jsxs(RACTooltipTrigger, { isOpen: isOpen, onOpenChange: onOpenChange, delay: 300, closeDelay: 300, isDisabled: isDisabled, children: [children, _jsxs(RACTooltip, { ...props, ref: ref, className: clsx('cim-tooltip', UNSAFE_className), style: UNSAFE_style, containerPadding: 16, offset: 5, arrowBoundaryOffset: 4, "data-cim-style-root": true, children: [_jsx(RACOverlayArrow, { className: "cim-tooltip-arrow", children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "10", viewBox: "0 0 16 10", children: _jsx("path", { d: "M0 0H16L8.78087 9.02391C8.38054 9.52432 7.61946 9.52432 7.21913 9.02391L0 0Z" }) }) }), _jsx(Text, { as: "p", variant: "small", children: label })] })] }));
 }
 /**
  * Provides additional information about an element that is hovered or focused.