@cimpress-ui/react 0.3.0 → 0.4.0

package/dist/commonjs/components/modal/modal.d.ts

@@ -1,64 +0,0 @@
-import { type ReactNode } from 'react';
-import type { AriaLabelingProps, CommonProps } from '../types.js';
-export interface UNSTABLE_ModalRootProps {
-    children: ReactNode;
-    /** Whether the modal is open (controlled). */
-    isOpen?: boolean;
-    /** Whether the modal is open by default (uncontrolled). */
-    defaultOpen?: boolean;
-    /** Handler that is called when the modal's open state changes. */
-    onOpenChange?: (isOpen: boolean) => void;
-}
-/**
- * Encapsulates a modal trigger and its associated modal.
- * The trigger can be any Cimpress UI button, and the modal will be displayed when the trigger is activated.
- */
-export declare function UNSTABLE_ModalRoot(props: UNSTABLE_ModalRootProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace UNSTABLE_ModalRoot {
-    var displayName: string;
-}
-export interface UNSTABLE_ModalRenderProps {
-    /** Closes the modal when called. */
-    close: () => void;
-}
-export interface UNSTABLE_ModalProps extends CommonProps, AriaLabelingProps {
-    /** The contents of the modal. A function may be provided to access a function to close the modal. */
-    children: ReactNode | ((renderProps: UNSTABLE_ModalRenderProps) => ReactNode);
-    /** The title of the modal. */
-    title?: string;
-    /**
-     * The size of the modal.
-     * @default 'medium'
-     */
-    size?: 'small' | 'medium' | 'large';
-    /**
-     * Whether to close the modal when the user interacts outside of it or presses the Escape key.
-     * @default true
-     */
-    isDismissable?: boolean;
-    /**
-     * Whether the modal is open (controlled).
-     * If using `ModalRoot`, this prop has no effect - provide `isOpen` to `ModalRoot` instead.
-     */
-    isOpen?: boolean;
-    /**
-     * Whether the modal is open by default (uncontrolled).
-     * If using `ModalRoot`, this prop has no effect - provide `defaultOpen` to `ModalRoot` instead.
-     */
-    defaultOpen?: boolean;
-    /**
-     * Handler that is called when the modal's open state changes.
-     * If using `ModalRoot`, this prop has no effect - provide `onOpenChange` to `ModalRoot` instead.
-     */
-    onOpenChange?: (isOpen: boolean) => void;
-}
-/**
- * Displays an overlay element which blocks interaction with outside elements.
- *
- * See [modal usage guidelines](https://ui.cimpress.io/components/modal/).
- */
-export declare function UNSTABLE_Modal({ children, title, size, UNSAFE_className, UNSAFE_style, isDismissable, isOpen, defaultOpen, onOpenChange, ...props }: UNSTABLE_ModalProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace UNSTABLE_Modal {
-    var displayName: string;
-}
-//# sourceMappingURL=modal.d.ts.map

package/dist/commonjs/components/modal/modal.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/modal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAWlD,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAGlE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kEAAkE;IAClE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAEhE;yBAFe,kBAAkB;;;AAMlC,MAAM,WAAW,yBAAyB;IACxC,oCAAoC;IACpC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,mBAAoB,SAAQ,WAAW,EAAE,iBAAiB;IACzE,qGAAqG;IACrG,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,WAAW,EAAE,yBAAyB,KAAK,SAAS,CAAC,CAAC;IAC9E,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;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;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,KAAK,EACL,IAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,aAAoB,EACpB,MAAM,EACN,WAAW,EACX,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAgDrB;yBA3De,cAAc"}

package/dist/commonjs/components/modal/modal.js

@@ -1,40 +0,0 @@
-'use client';
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.UNSTABLE_ModalRoot = UNSTABLE_ModalRoot;
-exports.UNSTABLE_Modal = UNSTABLE_Modal;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const clsx_1 = __importDefault(require("clsx"));
-const react_1 = require("react");
-const react_aria_components_1 = require("react-aria-components");
-const index_js_1 = require("../../icons/index.js");
-const icon_button_js_1 = require("../button/icon-button.js");
-const focusable_container_js_1 = require("../internal/focusable-container/focusable-container.js");
-const utils_js_1 = require("../typography/utils.js");
-/**
- * Encapsulates a modal trigger and its associated modal.
- * The trigger can be any Cimpress UI button, and the modal will be displayed when the trigger is activated.
- */
-function UNSTABLE_ModalRoot(props) {
-    return (0, jsx_runtime_1.jsx)(react_aria_components_1.DialogTrigger, { ...props });
-}
-UNSTABLE_ModalRoot.displayName = 'ModalRoot';
-/**
- * Displays an overlay element which blocks interaction with outside elements.
- *
- * See [modal usage guidelines](https://ui.cimpress.io/components/modal/).
- */
-function UNSTABLE_Modal({ children, title, size = 'medium', UNSAFE_className, UNSAFE_style, isDismissable = true, isOpen, defaultOpen, onOpenChange, ...props }) {
-    const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
-    (0, react_1.useEffect)(() => {
-        if (!title && !ariaLabel && !ariaLabelledBy) {
-            console.warn('Modal requires one of title / aria-label / aria-labelledby for accessibility');
-        }
-    }, [title, ariaLabel, ariaLabelledBy]);
-    return ((0, jsx_runtime_1.jsx)(react_aria_components_1.ModalOverlay, { className: "cim-modal-overlay", isDismissable: isDismissable, isKeyboardDismissDisabled: !isDismissable, isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, "data-cim-style-root": true, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Modal, { className: (0, clsx_1.default)('cim-modal', UNSAFE_className), style: UNSAFE_style, "data-size": size, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Dialog, { ...props, className: "cim-modal-dialog", children: (renderProps) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-modal-header", children: [title && ((0, jsx_runtime_1.jsx)(react_aria_components_1.Heading, { slot: "title", className: (0, clsx_1.default)('cim-modal-title', (0, utils_js_1.textStyle)({ variant: 'title-3' })), children: title })), (0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { slot: "close", UNSAFE_className: "cim-modal-close-button", icon: (0, jsx_runtime_1.jsx)(index_js_1.IconCloseBold, {}), variant: "tertiary", size: "small", "aria-label": "Close modal" })] }), (0, jsx_runtime_1.jsx)(focusable_container_js_1.FocusableContainer, { className: "cim-modal-content", scrollDirection: "vertical", children: typeof children === 'function' ? children(renderProps) : children })] })) }) }) }));
-}
-UNSTABLE_Modal.displayName = 'Modal';
-//# sourceMappingURL=modal.js.map

package/dist/commonjs/components/modal/modal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../../src/components/modal/modal.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;AA+Bb,gDAEC;AA8CD,wCA2DC;;AAxID,gDAAwB;AACxB,iCAAkD;AAClD,iEAM+B;AAC/B,mDAAqD;AACrD,6DAAsD;AACtD,mGAA4F;AAE5F,qDAAmD;AAYnD;;;GAGG;AACH,SAAgB,kBAAkB,CAAC,KAA8B;IAC/D,OAAO,uBAAC,qCAAgB,OAAK,KAAK,GAAI,CAAC;AACzC,CAAC;AAED,kBAAkB,CAAC,WAAW,GAAG,WAAW,CAAC;AAuC7C;;;;GAIG;AACH,SAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,gBAAgB,EAChB,YAAY,EACZ,aAAa,GAAG,IAAI,EACpB,MAAM,EACN,WAAW,EACX,YAAY,EACZ,GAAG,KAAK,EACY;IACpB,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,8EAA8E,CAAC,CAAC;QAC/F,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,OAAO,CACL,uBAAC,oCAAe,IACd,SAAS,EAAC,mBAAmB,EAC7B,aAAa,EAAE,aAAa,EAC5B,yBAAyB,EAAE,CAAC,aAAa,EACzC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,yCAG1B,uBAAC,6BAAQ,IAAC,SAAS,EAAE,IAAA,cAAI,EAAC,WAAW,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,eAAa,IAAI,YAC5F,uBAAC,8BAAS,OAAK,KAAK,EAAE,SAAS,EAAC,kBAAkB,YAC/C,CAAC,WAAW,EAAE,EAAE,CAAC,CAChB,6DACE,iCAAK,SAAS,EAAC,kBAAkB,aAC9B,KAAK,IAAI,CACR,uBAAC,+BAAU,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,IAAA,cAAI,EAAC,iBAAiB,EAAE,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC,YAC3F,KAAK,GACK,CACd,EACD,uBAAC,2BAAU,IACT,IAAI,EAAC,OAAO,EACZ,gBAAgB,EAAC,wBAAwB,EACzC,IAAI,EAAE,uBAAC,wBAAa,KAAG,EACvB,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,gBAED,aAAa,GACxB,IACE,EACN,uBAAC,2CAAkB,IAAC,SAAS,EAAC,mBAAmB,EAAC,eAAe,EAAC,UAAU,YACzE,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,QAAQ,GAC/C,IACpB,CACJ,GACS,GACH,GACK,CACnB,CAAC;AACJ,CAAC;AAED,cAAc,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ReactNode } from 'react';\nimport {\n  Heading as RACHeading,\n  Dialog as RACDialog,\n  DialogTrigger as RACDialogTrigger,\n  Modal as RACModal,\n  ModalOverlay as RACModalOverlay,\n} from 'react-aria-components';\nimport { IconCloseBold } from '../../icons/index.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { FocusableContainer } from '../internal/focusable-container/focusable-container.js';\nimport type { AriaLabelingProps, CommonProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface UNSTABLE_ModalRootProps {\n  children: ReactNode;\n  /** Whether the modal is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the modal is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Handler that is called when the modal's open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\n/**\n * Encapsulates a modal trigger and its associated modal.\n * The trigger can be any Cimpress UI button, and the modal will be displayed when the trigger is activated.\n */\nexport function UNSTABLE_ModalRoot(props: UNSTABLE_ModalRootProps) {\n  return <RACDialogTrigger {...props} />;\n}\n\nUNSTABLE_ModalRoot.displayName = 'ModalRoot';\n\nexport interface UNSTABLE_ModalRenderProps {\n  /** Closes the modal when called. */\n  close: () => void;\n}\n\nexport interface UNSTABLE_ModalProps extends CommonProps, AriaLabelingProps {\n  /** The contents of the modal. A function may be provided to access a function to close the modal. */\n  children: ReactNode | ((renderProps: UNSTABLE_ModalRenderProps) => ReactNode);\n  /** The title of the modal. */\n  title?: string;\n  /**\n   * The size of the modal.\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Whether to close the modal when the user interacts outside of it or presses the Escape key.\n   * @default true\n   */\n  isDismissable?: boolean;\n  /**\n   * Whether the modal is open (controlled).\n   * If using `ModalRoot`, this prop has no effect - provide `isOpen` to `ModalRoot` instead.\n   */\n  isOpen?: boolean;\n  /**\n   * Whether the modal is open by default (uncontrolled).\n   * If using `ModalRoot`, this prop has no effect - provide `defaultOpen` to `ModalRoot` instead.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Handler that is called when the modal's open state changes.\n   * If using `ModalRoot`, this prop has no effect - provide `onOpenChange` to `ModalRoot` instead.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\n/**\n * Displays an overlay element which blocks interaction with outside elements.\n *\n * See [modal usage guidelines](https://ui.cimpress.io/components/modal/).\n */\nexport function UNSTABLE_Modal({\n  children,\n  title,\n  size = 'medium',\n  UNSAFE_className,\n  UNSAFE_style,\n  isDismissable = true,\n  isOpen,\n  defaultOpen,\n  onOpenChange,\n  ...props\n}: UNSTABLE_ModalProps) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useEffect(() => {\n    if (!title && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Modal requires one of title / aria-label / aria-labelledby for accessibility');\n    }\n  }, [title, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <RACModalOverlay\n      className=\"cim-modal-overlay\"\n      isDismissable={isDismissable}\n      isKeyboardDismissDisabled={!isDismissable}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      data-cim-style-root\n    >\n      <RACModal className={clsx('cim-modal', UNSAFE_className)} style={UNSAFE_style} data-size={size}>\n        <RACDialog {...props} className=\"cim-modal-dialog\">\n          {(renderProps) => (\n            <>\n              <div className=\"cim-modal-header\">\n                {title && (\n                  <RACHeading slot=\"title\" className={clsx('cim-modal-title', textStyle({ variant: 'title-3' }))}>\n                    {title}\n                  </RACHeading>\n                )}\n                <IconButton\n                  slot=\"close\"\n                  UNSAFE_className=\"cim-modal-close-button\"\n                  icon={<IconCloseBold />}\n                  variant=\"tertiary\"\n                  size=\"small\"\n                  // TODO: i18n\n                  aria-label=\"Close modal\"\n                />\n              </div>\n              <FocusableContainer className=\"cim-modal-content\" scrollDirection=\"vertical\">\n                {typeof children === 'function' ? children(renderProps) : children}\n              </FocusableContainer>\n            </>\n          )}\n        </RACDialog>\n      </RACModal>\n    </RACModalOverlay>\n  );\n}\n\nUNSTABLE_Modal.displayName = 'Modal';\n"]}

package/dist/esm/components/card/card-context.d.ts

@@ -1,4 +0,0 @@
-export declare const CardContext: import("react").Context<{
-    withBorder: boolean;
-}>;
-//# sourceMappingURL=card-context.d.ts.map

package/dist/esm/components/card/card-context.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"card-context.d.ts","sourceRoot":"","sources":["../../../../src/components/card/card-context.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW;;EAAuC,CAAC"}

package/dist/esm/components/card/card-context.js

@@ -1,3 +0,0 @@
-import { createContext } from 'react';
-export const CardContext = createContext({ withBorder: false });
-//# sourceMappingURL=card-context.js.map

package/dist/esm/components/card/card-context.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"card-context.js","sourceRoot":"","sources":["../../../../src/components/card/card-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nexport const CardContext = createContext({ withBorder: false });\n"]}

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

@@ -1,64 +0,0 @@
-import { type ReactNode } from 'react';
-import type { AriaLabelingProps, CommonProps } from '../types.js';
-export interface UNSTABLE_ModalRootProps {
-    children: ReactNode;
-    /** Whether the modal is open (controlled). */
-    isOpen?: boolean;
-    /** Whether the modal is open by default (uncontrolled). */
-    defaultOpen?: boolean;
-    /** Handler that is called when the modal's open state changes. */
-    onOpenChange?: (isOpen: boolean) => void;
-}
-/**
- * Encapsulates a modal trigger and its associated modal.
- * The trigger can be any Cimpress UI button, and the modal will be displayed when the trigger is activated.
- */
-export declare function UNSTABLE_ModalRoot(props: UNSTABLE_ModalRootProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace UNSTABLE_ModalRoot {
-    var displayName: string;
-}
-export interface UNSTABLE_ModalRenderProps {
-    /** Closes the modal when called. */
-    close: () => void;
-}
-export interface UNSTABLE_ModalProps extends CommonProps, AriaLabelingProps {
-    /** The contents of the modal. A function may be provided to access a function to close the modal. */
-    children: ReactNode | ((renderProps: UNSTABLE_ModalRenderProps) => ReactNode);
-    /** The title of the modal. */
-    title?: string;
-    /**
-     * The size of the modal.
-     * @default 'medium'
-     */
-    size?: 'small' | 'medium' | 'large';
-    /**
-     * Whether to close the modal when the user interacts outside of it or presses the Escape key.
-     * @default true
-     */
-    isDismissable?: boolean;
-    /**
-     * Whether the modal is open (controlled).
-     * If using `ModalRoot`, this prop has no effect - provide `isOpen` to `ModalRoot` instead.
-     */
-    isOpen?: boolean;
-    /**
-     * Whether the modal is open by default (uncontrolled).
-     * If using `ModalRoot`, this prop has no effect - provide `defaultOpen` to `ModalRoot` instead.
-     */
-    defaultOpen?: boolean;
-    /**
-     * Handler that is called when the modal's open state changes.
-     * If using `ModalRoot`, this prop has no effect - provide `onOpenChange` to `ModalRoot` instead.
-     */
-    onOpenChange?: (isOpen: boolean) => void;
-}
-/**
- * Displays an overlay element which blocks interaction with outside elements.
- *
- * See [modal usage guidelines](https://ui.cimpress.io/components/modal/).
- */
-export declare function UNSTABLE_Modal({ children, title, size, UNSAFE_className, UNSAFE_style, isDismissable, isOpen, defaultOpen, onOpenChange, ...props }: UNSTABLE_ModalProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace UNSTABLE_Modal {
-    var displayName: string;
-}
-//# sourceMappingURL=modal.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/modal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAWlD,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAGlE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kEAAkE;IAClE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAEhE;yBAFe,kBAAkB;;;AAMlC,MAAM,WAAW,yBAAyB;IACxC,oCAAoC;IACpC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,mBAAoB,SAAQ,WAAW,EAAE,iBAAiB;IACzE,qGAAqG;IACrG,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,WAAW,EAAE,yBAAyB,KAAK,SAAS,CAAC,CAAC;IAC9E,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;;OAGG;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;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,KAAK,EACL,IAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,aAAoB,EACpB,MAAM,EACN,WAAW,EACX,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAgDrB;yBA3De,cAAc"}

package/dist/esm/components/modal/modal.js

@@ -1,33 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import clsx from 'clsx';
-import { useEffect } from 'react';
-import { Heading as RACHeading, Dialog as RACDialog, DialogTrigger as RACDialogTrigger, Modal as RACModal, ModalOverlay as RACModalOverlay, } from 'react-aria-components';
-import { IconCloseBold } from '../../icons/index.js';
-import { IconButton } from '../button/icon-button.js';
-import { FocusableContainer } from '../internal/focusable-container/focusable-container.js';
-import { textStyle } from '../typography/utils.js';
-/**
- * Encapsulates a modal trigger and its associated modal.
- * The trigger can be any Cimpress UI button, and the modal will be displayed when the trigger is activated.
- */
-export function UNSTABLE_ModalRoot(props) {
-    return _jsx(RACDialogTrigger, { ...props });
-}
-UNSTABLE_ModalRoot.displayName = 'ModalRoot';
-/**
- * Displays an overlay element which blocks interaction with outside elements.
- *
- * See [modal usage guidelines](https://ui.cimpress.io/components/modal/).
- */
-export function UNSTABLE_Modal({ children, title, size = 'medium', UNSAFE_className, UNSAFE_style, isDismissable = true, isOpen, defaultOpen, onOpenChange, ...props }) {
-    const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
-    useEffect(() => {
-        if (!title && !ariaLabel && !ariaLabelledBy) {
-            console.warn('Modal requires one of title / aria-label / aria-labelledby for accessibility');
-        }
-    }, [title, ariaLabel, ariaLabelledBy]);
-    return (_jsx(RACModalOverlay, { className: "cim-modal-overlay", isDismissable: isDismissable, isKeyboardDismissDisabled: !isDismissable, isOpen: isOpen, defaultOpen: defaultOpen, onOpenChange: onOpenChange, "data-cim-style-root": true, children: _jsx(RACModal, { className: clsx('cim-modal', UNSAFE_className), style: UNSAFE_style, "data-size": size, children: _jsx(RACDialog, { ...props, className: "cim-modal-dialog", children: (renderProps) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "cim-modal-header", children: [title && (_jsx(RACHeading, { slot: "title", className: clsx('cim-modal-title', textStyle({ variant: 'title-3' })), children: title })), _jsx(IconButton, { slot: "close", UNSAFE_className: "cim-modal-close-button", icon: _jsx(IconCloseBold, {}), variant: "tertiary", size: "small", "aria-label": "Close modal" })] }), _jsx(FocusableContainer, { className: "cim-modal-content", scrollDirection: "vertical", children: typeof children === 'function' ? children(renderProps) : children })] })) }) }) }));
-}
-UNSTABLE_Modal.displayName = 'Modal';
-//# sourceMappingURL=modal.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../../src/components/modal/modal.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,SAAS,EAAkB,MAAM,OAAO,CAAC;AAClD,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,MAAM,IAAI,SAAS,EACnB,aAAa,IAAI,gBAAgB,EACjC,KAAK,IAAI,QAAQ,EACjB,YAAY,IAAI,eAAe,GAChC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wDAAwD,CAAC;AAE5F,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAYnD;;;GAGG;AACH,MAAM,UAAU,kBAAkB,CAAC,KAA8B;IAC/D,OAAO,KAAC,gBAAgB,OAAK,KAAK,GAAI,CAAC;AACzC,CAAC;AAED,kBAAkB,CAAC,WAAW,GAAG,WAAW,CAAC;AAuC7C;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,QAAQ,EACR,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,gBAAgB,EAChB,YAAY,EACZ,aAAa,GAAG,IAAI,EACpB,MAAM,EACN,WAAW,EACX,YAAY,EACZ,GAAG,KAAK,EACY;IACpB,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,8EAA8E,CAAC,CAAC;QAC/F,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,OAAO,CACL,KAAC,eAAe,IACd,SAAS,EAAC,mBAAmB,EAC7B,aAAa,EAAE,aAAa,EAC5B,yBAAyB,EAAE,CAAC,aAAa,EACzC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,yCAG1B,KAAC,QAAQ,IAAC,SAAS,EAAE,IAAI,CAAC,WAAW,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,eAAa,IAAI,YAC5F,KAAC,SAAS,OAAK,KAAK,EAAE,SAAS,EAAC,kBAAkB,YAC/C,CAAC,WAAW,EAAE,EAAE,CAAC,CAChB,8BACE,eAAK,SAAS,EAAC,kBAAkB,aAC9B,KAAK,IAAI,CACR,KAAC,UAAU,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC,YAC3F,KAAK,GACK,CACd,EACD,KAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,gBAAgB,EAAC,wBAAwB,EACzC,IAAI,EAAE,KAAC,aAAa,KAAG,EACvB,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,gBAED,aAAa,GACxB,IACE,EACN,KAAC,kBAAkB,IAAC,SAAS,EAAC,mBAAmB,EAAC,eAAe,EAAC,UAAU,YACzE,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,QAAQ,GAC/C,IACpB,CACJ,GACS,GACH,GACK,CACnB,CAAC;AACJ,CAAC;AAED,cAAc,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ReactNode } from 'react';\nimport {\n  Heading as RACHeading,\n  Dialog as RACDialog,\n  DialogTrigger as RACDialogTrigger,\n  Modal as RACModal,\n  ModalOverlay as RACModalOverlay,\n} from 'react-aria-components';\nimport { IconCloseBold } from '../../icons/index.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { FocusableContainer } from '../internal/focusable-container/focusable-container.js';\nimport type { AriaLabelingProps, CommonProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface UNSTABLE_ModalRootProps {\n  children: ReactNode;\n  /** Whether the modal is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the modal is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Handler that is called when the modal's open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\n/**\n * Encapsulates a modal trigger and its associated modal.\n * The trigger can be any Cimpress UI button, and the modal will be displayed when the trigger is activated.\n */\nexport function UNSTABLE_ModalRoot(props: UNSTABLE_ModalRootProps) {\n  return <RACDialogTrigger {...props} />;\n}\n\nUNSTABLE_ModalRoot.displayName = 'ModalRoot';\n\nexport interface UNSTABLE_ModalRenderProps {\n  /** Closes the modal when called. */\n  close: () => void;\n}\n\nexport interface UNSTABLE_ModalProps extends CommonProps, AriaLabelingProps {\n  /** The contents of the modal. A function may be provided to access a function to close the modal. */\n  children: ReactNode | ((renderProps: UNSTABLE_ModalRenderProps) => ReactNode);\n  /** The title of the modal. */\n  title?: string;\n  /**\n   * The size of the modal.\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Whether to close the modal when the user interacts outside of it or presses the Escape key.\n   * @default true\n   */\n  isDismissable?: boolean;\n  /**\n   * Whether the modal is open (controlled).\n   * If using `ModalRoot`, this prop has no effect - provide `isOpen` to `ModalRoot` instead.\n   */\n  isOpen?: boolean;\n  /**\n   * Whether the modal is open by default (uncontrolled).\n   * If using `ModalRoot`, this prop has no effect - provide `defaultOpen` to `ModalRoot` instead.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Handler that is called when the modal's open state changes.\n   * If using `ModalRoot`, this prop has no effect - provide `onOpenChange` to `ModalRoot` instead.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\n/**\n * Displays an overlay element which blocks interaction with outside elements.\n *\n * See [modal usage guidelines](https://ui.cimpress.io/components/modal/).\n */\nexport function UNSTABLE_Modal({\n  children,\n  title,\n  size = 'medium',\n  UNSAFE_className,\n  UNSAFE_style,\n  isDismissable = true,\n  isOpen,\n  defaultOpen,\n  onOpenChange,\n  ...props\n}: UNSTABLE_ModalProps) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useEffect(() => {\n    if (!title && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Modal requires one of title / aria-label / aria-labelledby for accessibility');\n    }\n  }, [title, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <RACModalOverlay\n      className=\"cim-modal-overlay\"\n      isDismissable={isDismissable}\n      isKeyboardDismissDisabled={!isDismissable}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      data-cim-style-root\n    >\n      <RACModal className={clsx('cim-modal', UNSAFE_className)} style={UNSAFE_style} data-size={size}>\n        <RACDialog {...props} className=\"cim-modal-dialog\">\n          {(renderProps) => (\n            <>\n              <div className=\"cim-modal-header\">\n                {title && (\n                  <RACHeading slot=\"title\" className={clsx('cim-modal-title', textStyle({ variant: 'title-3' }))}>\n                    {title}\n                  </RACHeading>\n                )}\n                <IconButton\n                  slot=\"close\"\n                  UNSAFE_className=\"cim-modal-close-button\"\n                  icon={<IconCloseBold />}\n                  variant=\"tertiary\"\n                  size=\"small\"\n                  // TODO: i18n\n                  aria-label=\"Close modal\"\n                />\n              </div>\n              <FocusableContainer className=\"cim-modal-content\" scrollDirection=\"vertical\">\n                {typeof children === 'function' ? children(renderProps) : children}\n              </FocusableContainer>\n            </>\n          )}\n        </RACDialog>\n      </RACModal>\n    </RACModalOverlay>\n  );\n}\n\nUNSTABLE_Modal.displayName = 'Modal';\n"]}