@cimpress-ui/react 0.0.0-20250203144600

package/dist/commonjs/components/radio/radio-group.d.ts

@@ -0,0 +1,21 @@
+import type { ReactNode } from 'react';
+import { type RadioGroupProps as RACRadioGroupProps } from 'react-aria-components';
+import type { Responsive } from '../spacing/types.js';
+import type { Direction, CommonProps, FieldProps, WithRequired } from '../types.js';
+export interface RadioGroupProps extends CommonProps, WithRequired<FieldProps<string | null>, 'label'>, Pick<RACRadioGroupProps, 'isDisabled' | 'isReadOnly' | 'isRequired' | 'isInvalid' | 'value' | 'onChange' | 'defaultValue' | 'name'> {
+    /** Radio buttons belonging to the group. */
+    children: ReactNode;
+    /**
+     * Determines the direction in which radio buttons will be stacked.
+     * @default 'vertical'
+     */
+    direction?: Responsive<Direction>;
+}
+/**
+ * Allows users to select a single item from a visible list.
+ *
+ * See [radio group usage guidelines](https://ui.cimpress.io/components/radio-group/).
+ */
+declare const _RadioGroup: (props: RadioGroupProps & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
+export { _RadioGroup as RadioGroup };
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/commonjs/components/radio/radio-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../../src/components/radio/radio-group.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAA+B,KAAK,eAAe,IAAI,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAKhH,OAAO,KAAK,EAAc,UAAU,EAAW,MAAM,qBAAqB,CAAC;AAC3E,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEpF,MAAM,WAAW,eACf,SAAQ,WAAW,EACjB,YAAY,CAAC,UAAU,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,OAAO,CAAC,EAChD,IAAI,CACF,kBAAkB,EAClB,YAAY,GAAG,YAAY,GAAG,YAAY,GAAG,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,cAAc,GAAG,MAAM,CAC1G;IACH,4CAA4C;IAC5C,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;CACnC;AA2BD;;;;GAIG;AACH,QAAA,MAAM,WAAW,iKAAuD,CAAC;AAEzE,OAAO,EAAE,WAAW,IAAI,UAAU,EAAE,CAAC"}

package/dist/commonjs/components/radio/radio-group.js

@@ -0,0 +1,37 @@
+'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.RadioGroup = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const clsx_1 = __importDefault(require("clsx"));
+const react_aria_components_1 = require("react-aria-components");
+const forward_ref_js_1 = require("../../forward-ref.js");
+const with_style_props_js_1 = require("../../with-style-props.js");
+const form_field_js_1 = require("../internal/form-field/form-field.js");
+const stack_js_1 = require("../spacing/stack/stack.js");
+function RadioGroup({ label, description, error: errorMessage, direction = 'vertical', children, UNSAFE_className, UNSAFE_style, ...props }, ref) {
+    return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.RadioGroup, { ...props, ref: ref, className: (0, clsx_1.default)('cim-radio-group', UNSAFE_className), style: UNSAFE_style, children: [(0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldLabel, { isRequired: props.isRequired, children: label }), (0, jsx_runtime_1.jsx)(stack_js_1.Stack, { gap: getGapFromDirection(direction), direction: direction, children: children }), (0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldError, { children: errorMessage }), (0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldDescription, { children: description })] }));
+}
+/**
+ * Allows users to select a single item from a visible list.
+ *
+ * See [radio group usage guidelines](https://ui.cimpress.io/components/radio-group/).
+ */
+const _RadioGroup = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(RadioGroup), 'RadioGroup');
+exports.RadioGroup = _RadioGroup;
+// Make sure that radio buttons are spaced by 16px when stacked horizontally, and 8px otherwise.
+function getGapFromDirection(direction) {
+    if (typeof direction === 'object') {
+        const gap = { xs: direction.xs === 'horizontal' ? 16 : 8 };
+        Object.entries(direction).reduce((acc, curr) => {
+            gap[curr[0]] = curr[1] === 'horizontal' ? 16 : 8;
+            return acc;
+        }, gap);
+        return gap;
+    }
+    return direction === 'horizontal' ? 16 : 8;
+}
+//# sourceMappingURL=radio-group.js.map

package/dist/commonjs/components/radio/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../../src/components/radio/radio-group.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AAExB,iEAAgH;AAChH,yDAAkD;AAClD,mEAA2D;AAC3D,wEAA4G;AAC5G,wDAAkD;AAoBlD,SAAS,UAAU,CACjB,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,SAAS,GAAG,UAAU,EACtB,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACQ,EAClB,GAAiC;IAEjC,OAAO,CACL,wBAAC,kCAAa,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,iBAAiB,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,aAC3G,uBAAC,8BAAc,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,YAAG,KAAK,GAAkB,EACtE,uBAAC,gBAAK,IAAC,GAAG,EAAE,mBAAmB,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,SAAS,YAC7D,QAAQ,GACH,EACR,uBAAC,8BAAc,cAAE,YAAY,GAAkB,EAC/C,uBAAC,oCAAoB,cAAE,WAAW,GAAwB,IAC5C,CACjB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,WAAW,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,UAAU,CAAC,EAAE,YAAY,CAAC,CAAC;AAEjD,iCAAU;AAElC,gGAAgG;AAChG,SAAS,mBAAmB,CAAC,SAAgC;IAC3D,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE,CAAC;QAClC,MAAM,GAAG,GAAwB,EAAE,EAAE,EAAE,SAAS,CAAC,EAAE,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAE/E,MAAM,CAAC,OAAO,CAAC,SAAS,CAA+B,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;YAC5E,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;YACjD,OAAO,GAAG,CAAC;QACb,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,OAAO,GAAG,CAAC;IACb,CAAC;IAED,OAAO,SAAS,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AAC7C,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef, ReactNode } from 'react';\nimport { RadioGroup as RACRadioGroup, type RadioGroupProps as RACRadioGroupProps } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { Stack } from '../spacing/stack/stack.js';\nimport type { Breakpoint, Responsive, Spacing } from '../spacing/types.js';\nimport type { Direction, CommonProps, FieldProps, WithRequired } from '../types.js';\n\nexport interface RadioGroupProps\n  extends CommonProps,\n    WithRequired<FieldProps<string | null>, 'label'>,\n    Pick<\n      RACRadioGroupProps,\n      'isDisabled' | 'isReadOnly' | 'isRequired' | 'isInvalid' | 'value' | 'onChange' | 'defaultValue' | 'name'\n    > {\n  /** Radio buttons belonging to the group. */\n  children: ReactNode;\n  /**\n   * Determines the direction in which radio buttons will be stacked.\n   * @default 'vertical'\n   */\n  direction?: Responsive<Direction>;\n}\n\nfunction RadioGroup(\n  {\n    label,\n    description,\n    error: errorMessage,\n    direction = 'vertical',\n    children,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: RadioGroupProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <RACRadioGroup {...props} ref={ref} className={clsx('cim-radio-group', UNSAFE_className)} style={UNSAFE_style}>\n      <FormFieldLabel isRequired={props.isRequired}>{label}</FormFieldLabel>\n      <Stack gap={getGapFromDirection(direction)} direction={direction}>\n        {children}\n      </Stack>\n      <FormFieldError>{errorMessage}</FormFieldError>\n      <FormFieldDescription>{description}</FormFieldDescription>\n    </RACRadioGroup>\n  );\n}\n\n/**\n * Allows users to select a single item from a visible list.\n *\n * See [radio group usage guidelines](https://ui.cimpress.io/components/radio-group/).\n */\nconst _RadioGroup = withStyleProps(forwardRef(RadioGroup), 'RadioGroup');\n\nexport { _RadioGroup as RadioGroup };\n\n// Make sure that radio buttons are spaced by 16px when stacked horizontally, and 8px otherwise.\nfunction getGapFromDirection(direction: Responsive<Direction>): Responsive<Spacing> {\n  if (typeof direction === 'object') {\n    const gap: Responsive<Spacing> = { xs: direction.xs === 'horizontal' ? 16 : 8 };\n\n    (Object.entries(direction) as [Breakpoint, Direction][]).reduce((acc, curr) => {\n      gap[curr[0]] = curr[1] === 'horizontal' ? 16 : 8;\n      return acc;\n    }, gap);\n\n    return gap;\n  }\n\n  return direction === 'horizontal' ? 16 : 8;\n}\n"]}

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

@@ -0,0 +1,14 @@
+import { type RadioProps as RACRadioProps } from 'react-aria-components';
+import type { CommonProps, LabellableProps, StringLikeChildren } from '../types.js';
+export interface RadioProps extends CommonProps, Omit<LabellableProps, 'label'>, Pick<RACRadioProps, 'value' | 'isDisabled' | 'autoFocus'> {
+    /** The label rendered next to the radio. */
+    children?: StringLikeChildren;
+}
+/**
+ * Renders a single option within `RadioGroup`.
+ *
+ * See [radio group usage guidelines](https://ui.cimpress.io/components/radio-group/).
+ */
+declare const _Radio: (props: RadioProps & import("react").RefAttributes<HTMLLabelElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
+export { _Radio as Radio };
+//# sourceMappingURL=radio.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../../src/components/radio/radio.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAqB,KAAK,UAAU,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAG5F,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGpF,MAAM,WAAW,UACf,SAAQ,WAAW,EACjB,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC,EAC9B,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,YAAY,GAAG,WAAW,CAAC;IAC3D,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AA8BD;;;;GAIG;AACH,QAAA,MAAM,MAAM,8JAA6C,CAAC;AAE1D,OAAO,EAAE,MAAM,IAAI,KAAK,EAAE,CAAC"}

package/dist/commonjs/components/radio/radio.js

@@ -0,0 +1,31 @@
+'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.Radio = void 0;
+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 forward_ref_js_1 = require("../../forward-ref.js");
+const with_style_props_js_1 = require("../../with-style-props.js");
+const text_js_1 = require("../typography/text.js");
+function Radio({ children, UNSAFE_className, UNSAFE_style, ...props }, ref) {
+    const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
+    (0, react_1.useEffect)(() => {
+        if (!children && !ariaLabel && !ariaLabelledBy) {
+            console.warn('Radio requires one of children / aria-label / aria-labelledby for accessibility');
+        }
+    }, [children, ariaLabel, ariaLabelledBy]);
+    return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.Radio, { ...props, className: (0, clsx_1.default)('cim-radio', UNSAFE_className), style: UNSAFE_style, ref: ref, children: [(0, jsx_runtime_1.jsx)("div", { className: "cim-radio-toggle-wrapper", children: (0, jsx_runtime_1.jsx)("div", { className: "cim-radio-toggle", children: (0, jsx_runtime_1.jsx)("div", { className: "cim-radio-toggle-inner" }) }) }), children && ((0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "span", variant: "body", children: children }))] }));
+}
+/**
+ * Renders a single option within `RadioGroup`.
+ *
+ * See [radio group usage guidelines](https://ui.cimpress.io/components/radio-group/).
+ */
+const _Radio = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(Radio), 'Radio');
+exports.Radio = _Radio;
+//# sourceMappingURL=radio.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"radio.js","sourceRoot":"","sources":["../../../../src/components/radio/radio.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AACxB,iCAAqD;AACrD,iEAA4F;AAC5F,yDAAkD;AAClD,mEAA2D;AAE3D,mDAA6C;AAU7C,SAAS,KAAK,CACZ,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAc,EAClE,GAAmC;IAEnC,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC/C,OAAO,CAAC,IAAI,CAAC,iFAAiF,CAAC,CAAC;QAClG,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAE1C,OAAO,CACL,wBAAC,6BAAQ,OAAK,KAAK,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,WAAW,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,GAAG,aAChG,gCAAK,SAAS,EAAC,0BAA0B,YACvC,gCAAK,SAAS,EAAC,kBAAkB,YAC/B,gCAAK,SAAS,EAAC,wBAAwB,GAAG,GACtC,GACF,EACL,QAAQ,IAAI,CACX,uBAAC,cAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,MAAM,YAC3B,QAAQ,GACJ,CACR,IACQ,CACZ,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,MAAM,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;AAEvC,uBAAK","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ForwardedRef } from 'react';\nimport { Radio as RACRadio, type RadioProps as RACRadioProps } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps, LabellableProps, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nexport interface RadioProps\n  extends CommonProps,\n    Omit<LabellableProps, 'label'>,\n    Pick<RACRadioProps, 'value' | 'isDisabled' | 'autoFocus'> {\n  /** The label rendered next to the radio. */\n  children?: StringLikeChildren;\n}\n\nfunction Radio(\n  { children, UNSAFE_className, UNSAFE_style, ...props }: RadioProps,\n  ref: ForwardedRef<HTMLLabelElement>,\n) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useEffect(() => {\n    if (!children && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Radio requires one of children / aria-label / aria-labelledby for accessibility');\n    }\n  }, [children, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <RACRadio {...props} className={clsx('cim-radio', UNSAFE_className)} style={UNSAFE_style} ref={ref}>\n      <div className=\"cim-radio-toggle-wrapper\">\n        <div className=\"cim-radio-toggle\">\n          <div className=\"cim-radio-toggle-inner\" />\n        </div>\n      </div>\n      {children && (\n        <Text as=\"span\" variant=\"body\">\n          {children}\n        </Text>\n      )}\n    </RACRadio>\n  );\n}\n\n/**\n * Renders a single option within `RadioGroup`.\n *\n * See [radio group usage guidelines](https://ui.cimpress.io/components/radio-group/).\n */\nconst _Radio = withStyleProps(forwardRef(Radio), 'Radio');\n\nexport { _Radio as Radio };\n"]}

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

@@ -0,0 +1,31 @@
+import { type ListBoxProps as RACListBoxProps, type ListBoxItemProps as RACListBoxItemProps, type SelectProps as RACSelectProps } from 'react-aria-components';
+import type { CollectionItem, CollectionProps, CommonProps, FieldProps, Key, StringLikeChildren } from '../types.js';
+export interface SelectProps<T extends CollectionItem = CollectionItem> extends CommonProps, FieldProps<Key>, CollectionProps<T>, Pick<RACSelectProps<T>, 'name' | 'isDisabled' | 'isRequired' | 'isInvalid' | 'selectedKey' | 'defaultSelectedKey' | 'autoComplete' | 'autoFocus' | 'onSelectionChange' | 'placeholder' | 'onFocus' | 'onBlur' | 'onOpenChange'>, Pick<RACListBoxProps<T>, 'onScroll'> {
+}
+/**
+ * Allows users to select one item from a collapsible list.
+ *
+ * See [select usage guidelines](https://ui.cimpress.io/components/select/).
+ */
+declare const _Select: <T extends CollectionItem>(props: SelectProps<T> & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
+export { _Select as Select };
+export interface SelectItemProps extends Pick<RACListBoxItemProps, 'id' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {
+    children: StringLikeChildren;
+}
+/** Renders a single list item within `Select`. */
+export declare function SelectItem({ children, ...props }: SelectItemProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace SelectItem {
+    var displayName: string;
+}
+export interface SelectSectionProps<T extends CollectionItem> extends CollectionProps<T> {
+    /** The ID of the section. Has to be unique across all sections and items. */
+    id?: Key;
+    /** The content to display as the section title. */
+    title: string;
+}
+/** Groups list items within `Select` into a section. */
+export declare function SelectSection<T extends CollectionItem>({ title, children, items, ...props }: SelectSectionProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare namespace SelectSection {
+    var displayName: string;
+}
+//# sourceMappingURL=select.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAIA,OAAO,EAKL,KAAK,YAAY,IAAI,eAAe,EAMpC,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,WAAW,IAAI,cAAc,EACnC,MAAM,uBAAuB,CAAC;AAM/B,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGrH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACpE,SAAQ,WAAW,EACjB,UAAU,CAAC,GAAG,CAAC,EACf,eAAe,CAAC,CAAC,CAAC,EAClB,IAAI,CACF,cAAc,CAAC,CAAC,CAAC,EACf,MAAM,GACN,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,aAAa,GACb,oBAAoB,GACpB,cAAc,GACd,WAAW,GACX,mBAAmB,GACnB,aAAa,GACb,SAAS,GACT,QAAQ,GACR,cAAc,CACjB,EACD,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC;CAAG;AA6C3C;;;;GAIG;AACH,QAAA,MAAM,OAAO,GAhDG,CAAC,SAAS,cAAc,+JAgDoB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAE7B,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,mBAAmB,EAAE,IAAI,GAAG,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;IACtF,QAAQ,EAAE,kBAAkB,CAAC;CAC9B;AAED,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAiBjE;yBAjBe,UAAU;;;AAqB1B,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACtF,6EAA6E;IAC7E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wDAAwD;AACxD,wBAAgB,aAAa,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,CAAC,CAAC,2CAelH;yBAfe,aAAa"}

package/dist/commonjs/components/select/select.js

@@ -0,0 +1,53 @@
+'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.Select = void 0;
+exports.SelectItem = SelectItem;
+exports.SelectSection = SelectSection;
+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 forward_ref_js_1 = require("../../forward-ref.js");
+const index_js_1 = require("../../icons/index.js");
+const with_style_props_js_1 = require("../../with-style-props.js");
+const collapsible_list_js_1 = require("../internal/collapsible-list/collapsible-list.js");
+const form_field_js_1 = require("../internal/form-field/form-field.js");
+const utils_js_1 = require("../typography/utils.js");
+function Select({ children, items, label, description, error, UNSAFE_className, UNSAFE_style, onScroll, ...props }, ref) {
+    const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
+    (0, react_1.useEffect)(() => {
+        if (!label && !ariaLabel && !ariaLabelledBy) {
+            console.warn('Select requires one of label / aria-label / aria-labelledby for accessibility');
+        }
+    }, [label, ariaLabel, ariaLabelledBy]);
+    if (items != null && typeof children !== 'function') {
+        console.warn('`Select` requires `children` to be a function when using `items` prop');
+    }
+    return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.Select, { ...props, ref: ref, className: (0, clsx_1.default)('cim-select', UNSAFE_className), style: UNSAFE_style, children: [(0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), (0, jsx_runtime_1.jsxs)(react_aria_components_1.Button, { className: "cim-select-button", children: [(0, jsx_runtime_1.jsx)(react_aria_components_1.SelectValue, { className: (values) => (0, clsx_1.default)(values.defaultClassName, (0, utils_js_1.textStyle)({ variant: 'medium', alignment: 'start' })), children: ({ selectedText }) => selectedText }), (0, jsx_runtime_1.jsx)(index_js_1.IconChevronDownFill, {})] }), (0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldError, { children: error }), (0, jsx_runtime_1.jsx)(form_field_js_1.FormFieldDescription, { children: description }), (0, jsx_runtime_1.jsx)(collapsible_list_js_1.CollapsibleList, { offset: 5, maxHeight: 315, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.ListBox, { className: "cim-select-listbox", onScroll: onScroll, items: items, children: children }) })] }));
+}
+/**
+ * Allows users to select one item from a collapsible list.
+ *
+ * See [select usage guidelines](https://ui.cimpress.io/components/select/).
+ */
+const _Select = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(Select), 'Select');
+exports.Select = _Select;
+/** Renders a single list item within `Select`. */
+function SelectItem({ children, ...props }) {
+    const textValue = typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');
+    return ((0, jsx_runtime_1.jsx)(react_aria_components_1.ListBoxItem, { ...props, className: "cim-select-item", textValue: textValue, children: ({ isDisabled }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_js_1.IconCheckmark, {}), (0, jsx_runtime_1.jsx)(react_aria_components_1.Text, { slot: "label", className: (0, utils_js_1.textStyle)({ variant: 'body', tone: isDisabled ? 'muted' : 'base' }), children: children })] })) }));
+}
+SelectItem.displayName = 'SelectItem';
+/** Groups list items within `Select` into a section. */
+function SelectSection({ title, children, items, ...props }) {
+    if (items != null && typeof children !== 'function') {
+        console.warn('`SelectSection` requires `children` to be a function when using `items` prop');
+    }
+    return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.ListBoxSection, { ...props, className: "cim-select-section", children: [(0, jsx_runtime_1.jsx)(react_aria_components_1.Header, { className: (0, clsx_1.default)('cim-select-section-header', (0, utils_js_1.textStyle)({ variant: 'small-semibold', tone: 'subtle' })), children: title }), (0, jsx_runtime_1.jsx)(react_aria_components_1.Collection, { items: items, children: children })] }));
+}
+SelectSection.displayName = 'SelectSection';
+//# sourceMappingURL=select.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useEffect, type ForwardedRef } from 'react';\nimport {\n  Button as RACButton,\n  Collection as RACCollection,\n  Header as RACHeader,\n  ListBox as RACListBox,\n  type ListBoxProps as RACListBoxProps,\n  ListBoxItem as RACListBoxItem,\n  ListBoxSection as RACListBoxSection,\n  Select as RACSelect,\n  SelectValue as RACSelectValue,\n  Text as RACText,\n  type ListBoxItemProps as RACListBoxItemProps,\n  type SelectProps as RACSelectProps,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconCheckmark, IconChevronDownFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport type { CollectionItem, CollectionProps, CommonProps, FieldProps, Key, StringLikeChildren } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface SelectProps<T extends CollectionItem = CollectionItem>\n  extends CommonProps,\n    FieldProps<Key>,\n    CollectionProps<T>,\n    Pick<\n      RACSelectProps<T>,\n      | 'name'\n      | 'isDisabled'\n      | 'isRequired'\n      | 'isInvalid'\n      | 'selectedKey'\n      | 'defaultSelectedKey'\n      | 'autoComplete'\n      | 'autoFocus'\n      | 'onSelectionChange'\n      | 'placeholder'\n      | 'onFocus'\n      | 'onBlur'\n      | 'onOpenChange'\n    >,\n    Pick<RACListBoxProps<T>, 'onScroll'> {}\n\nfunction Select<T extends CollectionItem>(\n  { children, items, label, description, error, UNSAFE_className, UNSAFE_style, onScroll, ...props }: SelectProps<T>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useEffect(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Select requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  if (items != null && typeof children !== 'function') {\n    console.warn('`Select` requires `children` to be a function when using `items` prop');\n  }\n\n  return (\n    <RACSelect {...props} ref={ref} className={clsx('cim-select', UNSAFE_className)} style={UNSAFE_style}>\n      <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n        {label}\n      </FormFieldLabel>\n      <RACButton className=\"cim-select-button\">\n        <RACSelectValue\n          className={(values) => clsx(values.defaultClassName, textStyle({ variant: 'medium', alignment: 'start' }))}\n        >\n          {({ selectedText }) => selectedText}\n        </RACSelectValue>\n        <IconChevronDownFill />\n      </RACButton>\n      <FormFieldError>{error}</FormFieldError>\n      <FormFieldDescription>{description}</FormFieldDescription>\n      <CollapsibleList\n        offset={5} // 1px border + 4px actual offset\n        maxHeight={315}\n      >\n        <RACListBox className=\"cim-select-listbox\" onScroll={onScroll} items={items}>\n          {children}\n        </RACListBox>\n      </CollapsibleList>\n    </RACSelect>\n  );\n}\n\n/**\n * Allows users to select one item from a collapsible list.\n *\n * See [select usage guidelines](https://ui.cimpress.io/components/select/).\n */\nconst _Select = withStyleProps(forwardRef(Select), 'Select');\n\nexport { _Select as Select };\n\nexport interface SelectItemProps\n  extends Pick<RACListBoxItemProps, 'id' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n  children: StringLikeChildren;\n}\n\n/** Renders a single list item within `Select`. */\nexport function SelectItem({ children, ...props }: SelectItemProps) {\n  const textValue =\n    typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n  return (\n    <RACListBoxItem {...props} className=\"cim-select-item\" textValue={textValue}>\n      {({ isDisabled }) => (\n        <>\n          <IconCheckmark />\n\n          <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n            {children}\n          </RACText>\n        </>\n      )}\n    </RACListBoxItem>\n  );\n}\n\nSelectItem.displayName = 'SelectItem';\n\nexport interface SelectSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n  /** The ID of the section. Has to be unique across all sections and items. */\n  id?: Key;\n  /** The content to display as the section title. */\n  title: string;\n}\n\n/** Groups list items within `Select` into a section. */\nexport function SelectSection<T extends CollectionItem>({ title, children, items, ...props }: SelectSectionProps<T>) {\n  if (items != null && typeof children !== 'function') {\n    console.warn('`SelectSection` requires `children` to be a function when using `items` prop');\n  }\n\n  return (\n    <RACListBoxSection {...props} className=\"cim-select-section\">\n      <RACHeader\n        className={clsx('cim-select-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n      >\n        {title}\n      </RACHeader>\n      <RACCollection items={items}>{children}</RACCollection>\n    </RACListBoxSection>\n  );\n}\n\nSelectSection.displayName = 'SelectSection';\n"]}

package/dist/commonjs/components/spacing/box/box.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from 'react';
+import type { CommonProps } from '../../types.js';
+export interface BoxProps extends CommonProps {
+    /** The contents of the box. */
+    children: ReactNode;
+}
+/** A primitive layout component that exposes style props. */
+declare const _Box: (props: BoxProps & import("react").RefAttributes<HTMLDivElement> & import("../../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
+export { _Box as Box };
+//# sourceMappingURL=box.d.ts.map

package/dist/commonjs/components/spacing/box/box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../../../../../src/components/spacing/box/box.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,WAAW,QAAS,SAAQ,WAAW;IAC3C,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAUD,6DAA6D;AAC7D,QAAA,MAAM,IAAI,6JAAyC,CAAC;AAEpD,OAAO,EAAE,IAAI,IAAI,GAAG,EAAE,CAAC"}

package/dist/commonjs/components/spacing/box/box.js

@@ -0,0 +1,14 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Box = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const forward_ref_js_1 = require("../../../forward-ref.js");
+const with_style_props_js_1 = require("../../../with-style-props.js");
+function Box({ children, UNSAFE_className, UNSAFE_style, ...props }, ref) {
+    return ((0, jsx_runtime_1.jsx)("div", { ...props, ref: ref, className: UNSAFE_className, style: UNSAFE_style, role: "presentation", children: children }));
+}
+/** A primitive layout component that exposes style props. */
+const _Box = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(Box), 'Box');
+exports.Box = _Box;
+//# sourceMappingURL=box.js.map

package/dist/commonjs/components/spacing/box/box.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"box.js","sourceRoot":"","sources":["../../../../../src/components/spacing/box/box.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;AAGb,4DAAqD;AACrD,sEAA8D;AAQ9D,SAAS,GAAG,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAY,EAAE,GAAiC;IAC9G,OAAO,CACL,mCAAS,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,gBAAgB,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAC,cAAc,YAC5F,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,6DAA6D;AAC7D,MAAM,IAAI,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC;AAEnC,mBAAG","sourcesContent":["'use client';\n\nimport type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from '../../../forward-ref.js';\nimport { withStyleProps } from '../../../with-style-props.js';\nimport type { CommonProps } from '../../types.js';\n\nexport interface BoxProps extends CommonProps {\n  /** The contents of the box. */\n  children: ReactNode;\n}\n\nfunction Box({ children, UNSAFE_className, UNSAFE_style, ...props }: BoxProps, ref: ForwardedRef<HTMLDivElement>) {\n  return (\n    <div {...props} ref={ref} className={UNSAFE_className} style={UNSAFE_style} role=\"presentation\">\n      {children}\n    </div>\n  );\n}\n\n/** A primitive layout component that exposes style props. */\nconst _Box = withStyleProps(forwardRef(Box), 'Box');\n\nexport { _Box as Box };\n"]}

package/dist/commonjs/components/spacing/stack/stack.d.ts

@@ -0,0 +1,35 @@
+import type { ReactNode } from 'react';
+import type { Direction, CommonProps } from '../../types.js';
+import { type Responsive, type Spacing } from '../types.js';
+export type Alignment = 'start' | 'center' | 'end' | 'stretch';
+export type Justify = 'start' | 'center' | 'end' | 'space-around' | 'space-between' | 'space-evenly';
+export interface StackProps extends CommonProps {
+    /** The items to stack. */
+    children: ReactNode;
+    /**
+     * Determines the stacking direction (ie. which direction is the primary axis)
+     * @default 'vertical'
+     */
+    direction?: Responsive<Direction>;
+    /** The amount of space between items. */
+    gap: Responsive<Spacing>;
+    /**
+     * Determines how items are distributed along the primary axis.
+     * @default 'start'
+     */
+    justify?: Responsive<Justify>;
+    /**
+     * Determines how each item is aligned along the cross axis.
+     * @default 'stretch'
+     */
+    align?: Responsive<Alignment>;
+    /**
+     * Determines whether items will wrap to a new line if stack size is too small.
+     * @default true
+     */
+    wrap?: Responsive<boolean>;
+}
+/** Stacks its children with a specified amount of space between them. */
+declare const _Stack: (props: StackProps & import("react").RefAttributes<HTMLDivElement> & import("../../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
+export { _Stack as Stack };
+//# sourceMappingURL=stack.d.ts.map

package/dist/commonjs/components/spacing/stack/stack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.d.ts","sourceRoot":"","sources":["../../../../../src/components/spacing/stack/stack.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAgB,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAA0B,KAAK,UAAU,EAAE,KAAK,OAAO,EAAE,MAAM,aAAa,CAAC;AAEpF,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;AAC/D,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,cAAc,GAAG,eAAe,GAAG,cAAc,CAAC;AAErG,MAAM,WAAW,UAAW,SAAQ,WAAW;IAC7C,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IAClC,yCAAyC;IACzC,GAAG,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC9B;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAC5B;AA0CD,yEAAyE;AACzE,QAAA,MAAM,MAAM,+JAA6C,CAAC;AAE1D,OAAO,EAAE,MAAM,IAAI,KAAK,EAAE,CAAC"}

package/dist/commonjs/components/spacing/stack/stack.js

@@ -0,0 +1,31 @@
+'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.Stack = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const clsx_1 = __importDefault(require("clsx"));
+const forward_ref_js_1 = require("../../../forward-ref.js");
+const with_style_props_js_1 = require("../../../with-style-props.js");
+const types_js_1 = require("../types.js");
+function Stack({ children, direction: responsiveDirection, gap: responsiveGap, justify: responsiveJustify, align: responsiveAlign, wrap: responsiveWrap, UNSAFE_className, UNSAFE_style, ...props }, ref) {
+    const gap = (0, types_js_1.getResponsiveVariables)('stack-gap', 'space', responsiveGap, 0);
+    const direction = (0, types_js_1.getResponsiveVariables)('stack-fd', 'stack-direction', responsiveDirection, 'vertical');
+    const justify = (0, types_js_1.getResponsiveVariables)('stack-jc', 'stack-justify', responsiveJustify, 'start');
+    const align = (0, types_js_1.getResponsiveVariables)('stack-ai', 'stack-align', responsiveAlign, 'stretch');
+    const wrap = (0, types_js_1.getResponsiveVariables)('stack-fw', 'stack-wrap', responsiveWrap, true);
+    return ((0, jsx_runtime_1.jsx)("div", { ...props, ref: ref, className: (0, clsx_1.default)('cim-stack', UNSAFE_className), style: {
+            ...UNSAFE_style,
+            ...gap,
+            ...direction,
+            ...justify,
+            ...align,
+            ...wrap,
+        }, role: "presentation", children: children }));
+}
+/** Stacks its children with a specified amount of space between them. */
+const _Stack = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(Stack), 'Stack');
+exports.Stack = _Stack;
+//# sourceMappingURL=stack.js.map

package/dist/commonjs/components/spacing/stack/stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.js","sourceRoot":"","sources":["../../../../../src/components/spacing/stack/stack.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;AAEb,gDAAwB;AAExB,4DAAqD;AACrD,sEAA8D;AAE9D,0CAAoF;AAgCpF,SAAS,KAAK,CACZ,EACE,QAAQ,EACR,SAAS,EAAE,mBAAmB,EAC9B,GAAG,EAAE,aAAa,EAClB,OAAO,EAAE,iBAAiB,EAC1B,KAAK,EAAE,eAAe,EACtB,IAAI,EAAE,cAAc,EACpB,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACG,EACb,GAAiC;IAEjC,MAAM,GAAG,GAAG,IAAA,iCAAsB,EAAC,WAAW,EAAE,OAAO,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC;IAC3E,MAAM,SAAS,GAAG,IAAA,iCAAsB,EAAC,UAAU,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,UAAU,CAAC,CAAC;IACzG,MAAM,OAAO,GAAG,IAAA,iCAAsB,EAAC,UAAU,EAAE,eAAe,EAAE,iBAAiB,EAAE,OAAO,CAAC,CAAC;IAChG,MAAM,KAAK,GAAG,IAAA,iCAAsB,EAAC,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC;IAC5F,MAAM,IAAI,GAAG,IAAA,iCAAsB,EAAC,UAAU,EAAE,YAAY,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC;IAEpF,OAAO,CACL,mCACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,WAAW,EAAE,gBAAgB,CAAC,EAC9C,KAAK,EAAE;YACL,GAAG,YAAY;YACf,GAAG,GAAG;YACN,GAAG,SAAS;YACZ,GAAG,OAAO;YACV,GAAG,KAAK;YACR,GAAG,IAAI;SACR,EACD,IAAI,EAAC,cAAc,YAElB,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED,yEAAyE;AACzE,MAAM,MAAM,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;AAEvC,uBAAK","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ReactNode, ForwardedRef } from 'react';\nimport { forwardRef } from '../../../forward-ref.js';\nimport { withStyleProps } from '../../../with-style-props.js';\nimport type { Direction, CommonProps } from '../../types.js';\nimport { getResponsiveVariables, type Responsive, type Spacing } from '../types.js';\n\nexport type Alignment = 'start' | 'center' | 'end' | 'stretch';\nexport type Justify = 'start' | 'center' | 'end' | 'space-around' | 'space-between' | 'space-evenly';\n\nexport interface StackProps extends CommonProps {\n  /** The items to stack. */\n  children: ReactNode;\n  /**\n   * Determines the stacking direction (ie. which direction is the primary axis)\n   * @default 'vertical'\n   */\n  direction?: Responsive<Direction>;\n  /** The amount of space between items. */\n  gap: Responsive<Spacing>;\n  /**\n   * Determines how items are distributed along the primary axis.\n   * @default 'start'\n   */\n  justify?: Responsive<Justify>;\n  /**\n   * Determines how each item is aligned along the cross axis.\n   * @default 'stretch'\n   */\n  align?: Responsive<Alignment>;\n  /**\n   * Determines whether items will wrap to a new line if stack size is too small.\n   * @default true\n   */\n  wrap?: Responsive<boolean>;\n}\n\nfunction Stack(\n  {\n    children,\n    direction: responsiveDirection,\n    gap: responsiveGap,\n    justify: responsiveJustify,\n    align: responsiveAlign,\n    wrap: responsiveWrap,\n    UNSAFE_className,\n    UNSAFE_style,\n    ...props\n  }: StackProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const gap = getResponsiveVariables('stack-gap', 'space', responsiveGap, 0);\n  const direction = getResponsiveVariables('stack-fd', 'stack-direction', responsiveDirection, 'vertical');\n  const justify = getResponsiveVariables('stack-jc', 'stack-justify', responsiveJustify, 'start');\n  const align = getResponsiveVariables('stack-ai', 'stack-align', responsiveAlign, 'stretch');\n  const wrap = getResponsiveVariables('stack-fw', 'stack-wrap', responsiveWrap, true);\n\n  return (\n    <div\n      {...props}\n      ref={ref}\n      className={clsx('cim-stack', UNSAFE_className)}\n      style={{\n        ...UNSAFE_style,\n        ...gap,\n        ...direction,\n        ...justify,\n        ...align,\n        ...wrap,\n      }}\n      role=\"presentation\"\n    >\n      {children}\n    </div>\n  );\n}\n\n/** Stacks its children with a specified amount of space between them. */\nconst _Stack = withStyleProps(forwardRef(Stack), 'Stack');\n\nexport { _Stack as Stack };\n"]}

package/dist/commonjs/components/spacing/types.d.ts

@@ -0,0 +1,32 @@
+/** Represents a valid spacing amount within the design system. */
+export type Spacing = 0 | 2 | 4 | 8 | 12 | 16 | 24 | 32 | 40 | 48 | 64 | 96;
+/** Represents a screen size breakpoint for responsive design. */
+export type Breakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/** Represents a primitive value that can change based on screen size. */
+export type Responsive<T extends string | number | boolean> = T | Partial<Record<Breakpoint, T>>;
+/**
+ * Given params like so:
+ *
+ * ```ts
+ * (
+ *   'box-ml',
+ *   'space',
+ *   {
+ *     sm: 4,
+ *     lg: 6,
+ *   }
+ * )
+ * ```
+ *
+ * Creates an object like so:
+ *
+ * ```ts
+ * {
+ *   '--cim-box-ml-sm': 'var(--cim-space-4)',
+ *   '--cim-box-ml-lg': 'var(--cim-space-6)',
+ * }
+ * ```
+ *
+ */
+export declare function getResponsiveVariables<T extends string | number | boolean>(targetTokenGroup: string, sourceTokenGroup: string, data?: Responsive<T>, defaultValue?: T): Record<string, string> | undefined;
+//# sourceMappingURL=types.d.ts.map

package/dist/commonjs/components/spacing/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/spacing/types.ts"],"names":[],"mappings":"AAAA,kEAAkE;AAClE,MAAM,MAAM,OAAO,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAE5E,iEAAiE;AACjE,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE1D,yEAAyE;AACzE,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,OAAO,IAAI,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC;AAEjG;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,OAAO,EACxE,gBAAgB,EAAE,MAAM,EACxB,gBAAgB,EAAE,MAAM,EACxB,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EACpB,YAAY,CAAC,EAAE,CAAC,GACf,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAqBpC"}

package/dist/commonjs/components/spacing/types.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getResponsiveVariables = getResponsiveVariables;
+/**
+ * Given params like so:
+ *
+ * ```ts
+ * (
+ *   'box-ml',
+ *   'space',
+ *   {
+ *     sm: 4,
+ *     lg: 6,
+ *   }
+ * )
+ * ```
+ *
+ * Creates an object like so:
+ *
+ * ```ts
+ * {
+ *   '--cim-box-ml-sm': 'var(--cim-space-4)',
+ *   '--cim-box-ml-lg': 'var(--cim-space-6)',
+ * }
+ * ```
+ *
+ */
+function getResponsiveVariables(targetTokenGroup, sourceTokenGroup, data, defaultValue) {
+    if (data === undefined && defaultValue === undefined) {
+        return undefined;
+    }
+    if (typeof data !== 'object') {
+        return {
+            [`--cim-${targetTokenGroup}-xs`]: `var(--cim-${sourceTokenGroup}-${data ?? defaultValue})`,
+        };
+    }
+    const result = {
+        // Default value in case the smallest breakpoint isn't defined
+        [`--cim-${targetTokenGroup}-xs`]: `var(--cim-${sourceTokenGroup}-${defaultValue})`,
+    };
+    Object.entries(data).forEach(([breakpoint, value]) => {
+        result[`--cim-${targetTokenGroup}-${breakpoint}`] = `var(--cim-${sourceTokenGroup}-${value})`;
+    });
+    return result;
+}
+//# sourceMappingURL=types.js.map

package/dist/commonjs/components/spacing/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/spacing/types.ts"],"names":[],"mappings":";;AAiCA,wDA0BC;AAlDD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,SAAgB,sBAAsB,CACpC,gBAAwB,EACxB,gBAAwB,EACxB,IAAoB,EACpB,YAAgB;IAEhB,IAAI,IAAI,KAAK,SAAS,IAAI,YAAY,KAAK,SAAS,EAAE,CAAC;QACrD,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE,CAAC;QAC7B,OAAO;YACL,CAAC,SAAS,gBAAgB,KAAK,CAAC,EAAE,aAAa,gBAAgB,IAAI,IAAI,IAAI,YAAY,GAAG;SAC3F,CAAC;IACJ,CAAC;IAED,MAAM,MAAM,GAA2B;QACrC,8DAA8D;QAC9D,CAAC,SAAS,gBAAgB,KAAK,CAAC,EAAE,aAAa,gBAAgB,IAAI,YAAY,GAAG;KACnF,CAAC;IAEF,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE;QACnD,MAAM,CAAC,SAAS,gBAAgB,IAAI,UAAU,EAAE,CAAC,GAAG,aAAa,gBAAgB,IAAI,KAAK,GAAG,CAAC;IAChG,CAAC,CAAC,CAAC;IAEH,OAAO,MAAM,CAAC;AAChB,CAAC","sourcesContent":["/** Represents a valid spacing amount within the design system. */\nexport type Spacing = 0 | 2 | 4 | 8 | 12 | 16 | 24 | 32 | 40 | 48 | 64 | 96;\n\n/** Represents a screen size breakpoint for responsive design. */\nexport type Breakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\n/** Represents a primitive value that can change based on screen size. */\nexport type Responsive<T extends string | number | boolean> = T | Partial<Record<Breakpoint, T>>;\n\n/**\n * Given params like so:\n *\n * ```ts\n * (\n *   'box-ml',\n *   'space',\n *   {\n *     sm: 4,\n *     lg: 6,\n *   }\n * )\n * ```\n *\n * Creates an object like so:\n *\n * ```ts\n * {\n *   '--cim-box-ml-sm': 'var(--cim-space-4)',\n *   '--cim-box-ml-lg': 'var(--cim-space-6)',\n * }\n * ```\n *\n */\nexport function getResponsiveVariables<T extends string | number | boolean>(\n  targetTokenGroup: string,\n  sourceTokenGroup: string,\n  data?: Responsive<T>,\n  defaultValue?: T,\n): Record<string, string> | undefined {\n  if (data === undefined && defaultValue === undefined) {\n    return undefined;\n  }\n\n  if (typeof data !== 'object') {\n    return {\n      [`--cim-${targetTokenGroup}-xs`]: `var(--cim-${sourceTokenGroup}-${data ?? defaultValue})`,\n    };\n  }\n\n  const result: Record<string, string> = {\n    // Default value in case the smallest breakpoint isn't defined\n    [`--cim-${targetTokenGroup}-xs`]: `var(--cim-${sourceTokenGroup}-${defaultValue})`,\n  };\n\n  Object.entries(data).forEach(([breakpoint, value]) => {\n    result[`--cim-${targetTokenGroup}-${breakpoint}`] = `var(--cim-${sourceTokenGroup}-${value})`;\n  });\n\n  return result;\n}\n"]}

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

@@ -0,0 +1,16 @@
+import type { CommonProps, LabellableProps } from '../types.js';
+export interface SpinnerProps extends CommonProps, LabellableProps {
+    /**
+     * Determines the size of the spinner.
+     * @default 'medium'
+     */
+    size?: 'small' | 'medium' | 'large';
+}
+/**
+ * Displays a loading indicator to represent an ongoing operation.
+ *
+ * See [spinner usage guidelines](https://ui.cimpress.io/components/spinner/).
+ */
+declare const _Spinner: (props: SpinnerProps & import("react").RefAttributes<HTMLDivElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
+export { _Spinner as Spinner };
+//# sourceMappingURL=spinner.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAIhE,MAAM,WAAW,YAAa,SAAQ,WAAW,EAAE,eAAe;IAChE;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AA8BD;;;;GAIG;AACH,QAAA,MAAM,QAAQ,8JAAiD,CAAC;AAEhE,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,CAAC"}

package/dist/commonjs/components/spinner/spinner.js

@@ -0,0 +1,38 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Spinner = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_aria_components_1 = require("react-aria-components");
+const forward_ref_js_1 = require("../../forward-ref.js");
+const with_style_props_js_1 = require("../../with-style-props.js");
+const spinner_js_1 = require("../internal/spinner/spinner.js");
+const utils_js_1 = require("../typography/utils.js");
+const ringSizes = {
+    small: '24px',
+    medium: '48px',
+    large: '80px',
+};
+const labelVariants = {
+    small: 'small',
+    medium: 'medium',
+    large: 'body',
+};
+function Spinner({ size = 'medium', label, ...props }, ref) {
+    const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
+    (0, react_1.useEffect)(() => {
+        if (!label && !ariaLabel && !ariaLabelledBy) {
+            console.warn('Spinner requires one of label / aria-label / aria-labelledby for accessibility');
+        }
+    }, [label, ariaLabel, ariaLabelledBy]);
+    return ((0, jsx_runtime_1.jsx)(spinner_js_1.InternalSpinner, { ...props, size: ringSizes[size], spinnerRef: ref, children: label && (0, jsx_runtime_1.jsx)(react_aria_components_1.Label, { className: (0, utils_js_1.textStyle)({ variant: labelVariants[size], tone: 'title' }), children: label }) }));
+}
+/**
+ * Displays a loading indicator to represent an ongoing operation.
+ *
+ * See [spinner usage guidelines](https://ui.cimpress.io/components/spinner/).
+ */
+const _Spinner = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(Spinner), 'Spinner');
+exports.Spinner = _Spinner;
+//# sourceMappingURL=spinner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.js","sourceRoot":"","sources":["../../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;AAEb,iCAAqD;AACrD,iEAA0D;AAC1D,yDAAkD;AAClD,mEAA2D;AAC3D,+DAAiE;AAGjE,qDAAmD;AAUnD,MAAM,SAAS,GAAsD;IACnE,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,aAAa,GAA2E;IAC5F,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,SAAS,OAAO,CAAC,EAAE,IAAI,GAAG,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAgB,EAAE,GAAiC;IACpG,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,gFAAgF,CAAC,CAAC;QACjG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,OAAO,CACL,uBAAC,4BAAe,OAAK,KAAK,EAAE,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,GAAG,YAC/D,KAAK,IAAI,uBAAC,6BAAQ,IAAC,SAAS,EAAE,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,YAAG,KAAK,GAAY,GAC7F,CACnB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,QAAQ,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,OAAO,CAAC,EAAE,SAAS,CAAC,CAAC;AAE3C,2BAAO","sourcesContent":["'use client';\n\nimport { useEffect, type ForwardedRef } from 'react';\nimport { Label as RACLabel } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { InternalSpinner } from '../internal/spinner/spinner.js';\nimport type { CommonProps, LabellableProps } from '../types.js';\nimport type { TextStyleOptions } from '../typography/types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface SpinnerProps extends CommonProps, LabellableProps {\n  /**\n   * Determines the size of the spinner.\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n}\n\nconst ringSizes: Record<NonNullable<SpinnerProps['size']>, string> = {\n  small: '24px',\n  medium: '48px',\n  large: '80px',\n};\n\nconst labelVariants: Record<NonNullable<SpinnerProps['size']>, TextStyleOptions['variant']> = {\n  small: 'small',\n  medium: 'medium',\n  large: 'body',\n};\n\nfunction Spinner({ size = 'medium', label, ...props }: SpinnerProps, ref: ForwardedRef<HTMLDivElement>) {\n  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n  useEffect(() => {\n    if (!label && !ariaLabel && !ariaLabelledBy) {\n      console.warn('Spinner requires one of label / aria-label / aria-labelledby for accessibility');\n    }\n  }, [label, ariaLabel, ariaLabelledBy]);\n\n  return (\n    <InternalSpinner {...props} size={ringSizes[size]} spinnerRef={ref}>\n      {label && <RACLabel className={textStyle({ variant: labelVariants[size], tone: 'title' })}>{label}</RACLabel>}\n    </InternalSpinner>\n  );\n}\n\n/**\n * Displays a loading indicator to represent an ongoing operation.\n *\n * See [spinner usage guidelines](https://ui.cimpress.io/components/spinner/).\n */\nconst _Spinner = withStyleProps(forwardRef(Spinner), 'Spinner');\n\nexport { _Spinner as Spinner };\n"]}

package/dist/commonjs/components/table/contexts/focus.d.ts

@@ -0,0 +1,11 @@
+import { type ReactNode } from 'react';
+export interface TableFocus {
+    focusedRowKey: string;
+    focusedColumnKey: string;
+    setFocus: (rowKey: string, columnKey: string) => void;
+}
+export declare function TableFocusProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useTableFocus(): TableFocus;
+//# sourceMappingURL=focus.d.ts.map

package/dist/commonjs/components/table/contexts/focus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/contexts/focus.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAyC,MAAM,OAAO,CAAC;AAE7F,MAAM,WAAW,UAAU;IACzB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACvD;AAID,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CA8BvE;AAGD,wBAAgB,aAAa,IAAI,UAAU,CAO1C"}

package/dist/commonjs/components/table/contexts/focus.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableFocusProvider = TableFocusProvider;
+exports.useTableFocus = useTableFocus;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const TableFocusContext = (0, react_1.createContext)(null);
+function TableFocusProvider({ children }) {
+    // When table focus is updated, we want to trigger a re-render,
+    // but we also want immediate access to the new values.
+    // Hence why they are stored as both a ref and a state.
+    const focusedRowKeyRef = (0, react_1.useRef)('');
+    const [_focusedRowKey, setFocusedRowKey] = (0, react_1.useState)('');
+    const focusedColumnKeyRef = (0, react_1.useRef)('');
+    const [_focusedColumnKey, setFocusedColumnKey] = (0, react_1.useState)('');
+    const tableFocus = (0, react_1.useMemo)(() => ({
+        get focusedRowKey() {
+            return focusedRowKeyRef.current;
+        },
+        get focusedColumnKey() {
+            return focusedColumnKeyRef.current;
+        },
+        setFocus: (rowKey, columnKey) => {
+            focusedRowKeyRef.current = rowKey;
+            setFocusedRowKey(rowKey);
+            focusedColumnKeyRef.current = columnKey;
+            setFocusedColumnKey(columnKey);
+        },
+    }), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [_focusedRowKey, _focusedColumnKey]);
+    return (0, jsx_runtime_1.jsx)(TableFocusContext.Provider, { value: tableFocus, children: children });
+}
+// eslint-disable-next-line react-refresh/only-export-components
+function useTableFocus() {
+    const tableFocus = (0, react_1.useContext)(TableFocusContext);
+    if (!tableFocus) {
+        throw new Error('Cannot use table focus outside of a table');
+    }
+    return tableFocus;
+}
+//# sourceMappingURL=focus.js.map