npm - @cimpress-ui/react - Versions diffs - 1.7.1 → 1.8.0 - Mend

@cimpress-ui/react 1.7.1 → 1.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (186) hide show

package/dist/esm/components/menu/menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menu.js","sourceRoot":"","sources":["../../../../src/components/menu/menu.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EACL,UAAU,IAAI,aAAa,EAC3B,MAAM,IAAI,SAAS,EACnB,IAAI,IAAI,OAAO,EACf,QAAQ,IAAI,WAAW,~~EAGvB~~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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\nimport {\n Collection as RACCollection,\n Header as RACHeader,\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n type MenuItemProps as RACMenuItemProps,\n ~~type MenuProps as RACMenuProps,\n~~ MenuSection as RACMenuSection,\n MenuTrigger as RACMenuTrigger,\n type MenuTriggerProps as RACMenuTriggerProps,\n Text as RACText,\n} from 'react-aria-components';\nimport { isProduction } from '../../utils/is-production.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport type { CollectionItem, CollectionProps, Key, NavigationProps, StringLikeChildren } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface MenuRootProps extends Pick<RACMenuTriggerProps, 'onOpenChange' \| 'isOpen' \| 'defaultOpen'> {\n /** The menu trigger with its associated menu. Provide the trigger as the first child, and the menu as the second child. /\n children: ReactNode;\n}\n\n/\n Encapsulates a menu trigger and its associated menu. The trigger can be any Cimpress UI button, and the menu will be displayed when the trigger is activated.\n \n See [menu usage guidelines](https://ui.cimpress.io/components/menu/).\n /\nexport function MenuRoot(props: MenuRootProps) {\n return <RACMenuTrigger {...props} />;\n}\n\nMenuRoot.displayName = 'MenuRoot';\n\nexport interface MenuProps<T extends CollectionItem = CollectionItem~~>\n~~ extends CollectionProps<T~~>,\n Pick<RACMenuProps<T>, 'onScroll'~~> {\n /* Handler that is called when an item is selected. When using `onAction`, all items must have an `id` prop defined. /\n onAction?: (key: Key) => void;\n}\n\n/* Displays a collapsible list of options and actions that users can choose from. /\nexport function Menu<T extends CollectionItem>(props: MenuProps<T>) {\n if (!isProduction() && props.items != null && typeof props.children !== 'function') {\n console.warn('`Menu` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <CollapsibleList\n placement=\"bottom start\"\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n <RACMenu {...props} className=\"cim-menu\" />\n </CollapsibleList>\n );\n}\n\nMenu.displayName = 'Menu';\n\nexport interface MenuSectionProps<T extends CollectionItem = 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 `Menu` into a section. /\nexport function MenuSection<T extends CollectionItem>({ title, children, items, ...props }: MenuSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`MenuSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACMenuSection {...props} className=\"cim-menu-section\">\n <RACHeader className={clsx('cim-menu-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}>\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACMenuSection>\n );\n}\n\nMenuSection.displayName = 'MenuSection';\n\nexport interface MenuItemProps\n extends NavigationProps,\n Pick<RACMenuItemProps, 'isDisabled' \| 'onAction' \| 'onHoverStart' \| 'onHoverEnd'> {\n /* The ID of the item. Has to be unique across all sections and items. /\n id?: Key;\n /* The content to display as the label. /\n children: StringLikeChildren;\n /* Additional description for the menu item. /\n description?: string;\n /* An icon representing the menu item. /\n icon?: ReactNode;\n}\n\n/* Renders a single list item within `Menu`. */\nexport function MenuItem({ children, description, icon, ...props }: MenuItemProps) {\n const textValue =\n typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n return (\n <RACMenuItem {...props} className=\"cim-menu-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n {icon}\n\n <div className=\"cim-menu-item-text\">\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n\n {description && (\n <RACText\n slot=\"description\"\n className={textStyle({ variant: 'small', tone: isDisabled ? 'muted' : 'subtle' })}\n >\n {description}\n </RACText>\n )}\n </div>\n </>\n )}\n </RACMenuItem>\n );\n}\n\nMenuItem.displayName = 'MenuItem';\n"]}
1	+ {"version":3,"file":"menu.js","sourceRoot":"","sources":["../../../../src/components/menu/menu.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ReactNode, UIEventHandler } from 'react';\nimport {\n Collection as RACCollection,\n Header as RACHeader,\n Menu as RACMenu,\n MenuItem as RACMenuItem,\n type MenuItemProps as RACMenuItemProps,\n MenuSection as RACMenuSection,\n MenuTrigger as RACMenuTrigger,\n type MenuTriggerProps as RACMenuTriggerProps,\n Text as RACText,\n} from 'react-aria-components';\nimport { isProduction } from '../../utils/is-production.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport type { CollectionItem, CollectionProps, Key, NavigationProps, StringLikeChildren } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface MenuRootProps extends Pick<RACMenuTriggerProps, 'onOpenChange' \| 'isOpen' \| 'defaultOpen'> {\n /** The menu trigger with its associated menu. Provide the trigger as the first child, and the menu as the second child. /\n children: ReactNode;\n}\n\n/\n Encapsulates a menu trigger and its associated menu. The trigger can be any Cimpress UI button, and the menu will be displayed when the trigger is activated.\n \n See [menu usage guidelines](https://ui.cimpress.io/components/menu/).\n /\nexport function MenuRoot(props: MenuRootProps) {\n return <RACMenuTrigger {...props} />;\n}\n\nMenuRoot.displayName = 'MenuRoot';\n\nexport interface MenuProps<T extends CollectionItem = CollectionItem> extends CollectionProps<T> {\n /* Handler that is called when an item is selected. When using `onAction`, all items must have an `id` prop defined. /\n onAction?: (key: Key) => void;\n /* Handler that is called when the list of items is scrolled. /\n onScroll?: UIEventHandler<HTMLDivElement>;\n}\n\n/* Displays a collapsible list of options and actions that users can choose from. /\nexport function Menu<T extends CollectionItem>(props: MenuProps<T>) {\n if (!isProduction() && props.items != null && typeof props.children !== 'function') {\n console.warn('`Menu` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <CollapsibleList\n placement=\"bottom start\"\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n <RACMenu {...props} className=\"cim-menu\" />\n </CollapsibleList>\n );\n}\n\nMenu.displayName = 'Menu';\n\nexport interface MenuSectionProps<T extends CollectionItem = 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 `Menu` into a section. /\nexport function MenuSection<T extends CollectionItem>({ title, children, items, ...props }: MenuSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`MenuSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACMenuSection {...props} className=\"cim-menu-section\">\n <RACHeader className={clsx('cim-menu-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}>\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACMenuSection>\n );\n}\n\nMenuSection.displayName = 'MenuSection';\n\nexport interface MenuItemProps\n extends NavigationProps,\n Pick<RACMenuItemProps, 'isDisabled' \| 'onAction' \| 'onHoverStart' \| 'onHoverEnd'> {\n /* The ID of the item. Has to be unique across all sections and items. /\n id?: Key;\n /* The content to display as the label. /\n children: StringLikeChildren;\n /* Additional description for the menu item. /\n description?: string;\n /* An icon representing the menu item. /\n icon?: ReactNode;\n}\n\n/* Renders a single list item within `Menu`. */\nexport function MenuItem({ children, description, icon, ...props }: MenuItemProps) {\n const textValue =\n typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n return (\n <RACMenuItem {...props} className=\"cim-menu-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n {icon}\n\n <div className=\"cim-menu-item-text\">\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n\n {description && (\n <RACText\n slot=\"description\"\n className={textStyle({ variant: 'small', tone: isDisabled ? 'muted' : 'subtle' })}\n >\n {description}\n </RACText>\n )}\n </div>\n </>\n )}\n </RACMenuItem>\n );\n}\n\nMenuItem.displayName = 'MenuItem';\n"]}

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

@@ -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' | 'onKeyDown'> {
+import type { ApiProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';
+export interface NumberFieldProps extends CommonProps, FieldWithPlaceholderProps<number>, ApiProps<NumberFieldApi>, 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. */
@@ -8,6 +8,13 @@ export interface NumberFieldProps extends CommonProps, FieldWithPlaceholderProps
     /** Handler that is called when the value changes. A `null` value means an empty field. */
     onChange?: (value: number | null) => void;
 }
+/** The imperative API exposed by the `NumberField` component. */
+export interface NumberFieldApi {
+    /** Focuses the input field. */
+    focus: () => void;
+    /** Selects the contents of the input field. */
+    select: () => void;
+}
 /**
  * Allows users to edit a number with a keyboard or increment/decrement buttons.
  *

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

	@@ -1 +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,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"}
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,QAAQ,EAAE,WAAW,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAGpF,MAAM,WAAW,gBACf,SAAQ,WAAW,EACjB,yBAAyB,CAAC,MAAM,CAAC,EACjC,QAAQ,CAAC,cAAc,CAAC,EACxB,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;AAED,iEAAiE;AACjE,MAAM,WAAW,cAAc;IAC7B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAqFD;;;;GAIG;AACH,QAAA,MAAM,YAAY,kKAAyD,CAAC;AAE5E,OAAO,EAAE,YAAY,IAAI,WAAW,EAAE,CAAC"}

package/dist/esm/components/number-field/number-field.js CHANGED Viewed

@@ -1,6 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from 'clsx';
+import { useImperativeHandle, useRef } from 'react';
 import { Input as RACInput, NumberField as RACNumberField, Group as RACGroup, } from 'react-aria-components';
 import { forwardRef } from '../../forward-ref.js';
 import { useLocalizedMessages } from '../../i18n/index.js';
@@ -10,7 +11,8 @@ import { withStyleProps } from '../../with-style-props.js';
 import { IconButton } from '../button/icon-button.js';
 import { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';
 import { textStyle } from '../typography/utils.js';
-function NumberField({ label, description, error: errorMessage, placeholder, UNSAFE_className, UNSAFE_style, value, defaultValue, onChange, ...props }, ref) {
+function NumberField({ label, description, error: errorMessage, placeholder, UNSAFE_className, UNSAFE_style, value, defaultValue, onChange, apiRef, ...props }, ref) {
+    const inputRef = useRef(null);
     const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
     useProductionWarning(() => {
         if (!label && !ariaLabel && !ariaLabelledBy) {
@@ -18,11 +20,15 @@ function NumberField({ label, description, error: errorMessage, placeholder, UNS
         }
     }, [label, ariaLabel, ariaLabelledBy]);
     const messages = useLocalizedMessages('numberField');
+    useImperativeHandle(apiRef, () => ({
+        focus: () => inputRef.current?.focus(),
+        select: () => inputRef.current?.select(),
+    }), []);
     return (_jsxs(RACNumberField, { ...props, ref: ref, className: clsx('cim-number-field', UNSAFE_className), style: UNSAFE_style,
         // NumberField uses `NaN` to signify an empty value, which is unintuitive
         // https://github.com/adobe/react-spectrum/issues/5524
         // https://github.com/adobe/react-spectrum/issues/6971
-        value: value === null ? Number.NaN : value, defaultValue: defaultValue === null ? Number.NaN : defaultValue, onChange: onChange ? (value) => onChange(Number.isNaN(value) ? null : value) : undefined, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACGroup, { className: "cim-number-field-input-group", children: [_jsx(RACInput, { className: clsx('cim-number-field-input', textStyle({ variant: 'body' })), placeholder: placeholder }), _jsxs("div", { className: "cim-number-field-spinner", children: [_jsx(IconButton, { slot: "decrement", icon: _jsx(IconSubtract, {}), "aria-label": messages.format('decrement'), variant: "tertiary", size: "small" }), _jsx("div", { className: "cim-number-field-spinner-separator" }), _jsx(IconButton, { slot: "increment", icon: _jsx(IconAdd, {}), "aria-label": messages.format('increment'), variant: "tertiary", size: "small" })] })] }), _jsx(FormFieldError, { children: errorMessage }), _jsx(FormFieldDescription, { children: description })] }));
+        value: value === null ? Number.NaN : value, defaultValue: defaultValue === null ? Number.NaN : defaultValue, onChange: onChange ? (value) => onChange(Number.isNaN(value) ? null : value) : undefined, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACGroup, { className: "cim-number-field-input-group", children: [_jsx(RACInput, { ref: inputRef, className: clsx('cim-number-field-input', textStyle({ variant: 'body' })), placeholder: placeholder }), _jsxs("div", { className: "cim-number-field-spinner", children: [_jsx(IconButton, { slot: "decrement", icon: _jsx(IconSubtract, {}), "aria-label": messages.format('decrement'), variant: "tertiary", size: "small" }), _jsx("div", { className: "cim-number-field-spinner-separator" }), _jsx(IconButton, { slot: "increment", icon: _jsx(IconAdd, {}), "aria-label": messages.format('increment'), variant: "tertiary", size: "small" })] })] }), _jsx(FormFieldError, { children: errorMessage }), _jsx(FormFieldDescription, { children: description })] }));
 }
 /**
  * Allows users to edit a number with a keyboard or increment/decrement buttons.

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

	@@ -1 +1 @@
1	- {"version":3,"file":"number-field.js","sourceRoot":"","sources":["../../../../src/components/number-field/number-field.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;~~AAExB~~,OAAO,EACL,KAAK,IAAI,QAAQ,EACjB,WAAW,IAAI,cAAc,EAE7B,KAAK,IAAI,QAAQ,GAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAE5G,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;~~AA4BnD~~,SAAS,WAAW,CAClB,EACE,KAAK,EACL,WAAW,EACX,KAAK,EAAE,YAAY,EACnB,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACS,EACnB,GAAiC;IAEjC,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,oFAAoF,CAAC,CAAC;QACrG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,MAAM,QAAQ,GAAG,oBAAoB,CAAC,aAAa,CAAC,CAAC;IAErD,OAAO,CACL,MAAC,cAAc,OACT,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,EACrD,KAAK,EAAE,YAAY;QACnB,yEAAyE;QACzE,sDAAsD;QACtD,sDAAsD;QACtD,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAC1C,YAAY,EAAE,YAAY,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,YAAY,EAC/D,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,aAExF,KAAC,cAAc,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,YACvE,KAAK,GACS,EACjB,MAAC,QAAQ,IAAC,SAAS,EAAC,8BAA8B,aAChD,KAAC,QAAQ,IACP,SAAS,EAAE,IAAI,CAAC,wBAAwB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,EACzE,WAAW,EAAE,WAAW,GACxB,EACF,eAAK,SAAS,EAAC,0BAA0B,aACvC,KAAC,UAAU,IACT,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,KAAC,YAAY,KAAG,gBACV,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,EACxC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,EACF,cAAK,SAAS,EAAC,oCAAoC,GAAG,EACtD,KAAC,UAAU,IACT,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,KAAC,OAAO,KAAG,gBACL,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,EACxC,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,IACE,IACG,EACX,KAAC,cAAc,cAAE,YAAY,GAAkB,EAC/C,KAAC,oBAAoB,cAAE,WAAW,GAAwB,IAC3C,CAClB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,YAAY,GAAG,cAAc,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,aAAa,CAAC,CAAC;AAE5E,OAAO,EAAE,YAAY,IAAI,WAAW,EAAE,CAAC","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"]}
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, useImperativeHandle, useRef } 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 { ApiProps, CommonProps, FieldWithPlaceholderProps } from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nexport interface NumberFieldProps\n extends CommonProps,\n FieldWithPlaceholderProps<number>,\n ApiProps<NumberFieldApi>,\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\n/* The imperative API exposed by the `NumberField` component. /\nexport interface NumberFieldApi {\n /* Focuses the input field. /\n focus: () => void;\n /* Selects the contents of the input field. /\n select: () => 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 apiRef,\n ...props\n }: NumberFieldProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\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 useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\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 ref={inputRef}\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/select/select.d.ts CHANGED Viewed

@@ -1,11 +1,19 @@
-import { type ListBoxProps as RACListBoxProps, type ListBoxItemProps as RACListBoxItemProps, type SelectProps as RACSelectProps } from 'react-aria-components';
-import type { AsyncItemLoadingProps, CollectionItem, CollectionProps, CommonProps, FieldProps, Key, StringLikeChildren } from '../types.js';
-export interface SelectProps<T extends CollectionItem = CollectionItem> extends CommonProps, FieldProps<Key>, CollectionProps<T>, AsyncItemLoadingProps, Pick<RACSelectProps<T>, 'isDisabled' | 'isRequired' | 'isInvalid' | 'selectedKey' | 'defaultSelectedKey' | 'autoComplete' | 'autoFocus' | 'onSelectionChange' | 'placeholder' | 'onFocus' | 'onBlur' | 'onOpenChange'>, Pick<RACListBoxProps<T>, 'onScroll'> {
+import { type UIEventHandler } from 'react';
+import { type ListBoxItemProps as RACListBoxItemProps, type SelectProps as RACSelectProps } from 'react-aria-components';
+import type { ApiProps, AsyncItemLoadingProps, CollectionItem, CollectionProps, CommonProps, FieldProps, Key, StringLikeChildren } from '../types.js';
+export interface SelectProps<T extends CollectionItem = CollectionItem> extends CommonProps, FieldProps<Key>, CollectionProps<T>, AsyncItemLoadingProps, ApiProps<SelectApi>, Pick<RACSelectProps<T>, 'isDisabled' | 'isRequired' | 'isInvalid' | 'selectedKey' | 'defaultSelectedKey' | 'autoComplete' | 'autoFocus' | 'onSelectionChange' | 'placeholder' | 'onFocus' | 'onBlur' | 'onOpenChange'> {
     /**
      * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.
      * @default false
      */
     isVirtualized?: boolean;
+    /** Handler that is called when the list of items is scrolled. */
+    onScroll?: UIEventHandler<HTMLDivElement>;
+}
+/** The imperative API exposed by the `Select` component. */
+export interface SelectApi {
+    /** Focuses the trigger button and opens the list of items. */
+    focus: () => void;
 }
 /**
  * Allows users to select one item from a collapsible list.
@@ -14,7 +22,9 @@ export interface SelectProps<T extends CollectionItem = CollectionItem> extends
  */
 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'> {
+export interface SelectItemProps extends Pick<RACListBoxItemProps, 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {
+    /** The ID of the item. Has to be unique across all sections and items. */
+    id?: Key;
     /** The content to display as the label. */
     children: StringLikeChildren;
 }

package/dist/esm/components/select/select.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"~~AAIA~~,OAAO,~~EAKL~~,KAAK,~~YAAY~~,~~IAAI~~,~~eAAe~~,~~EASpC~~,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,WAAW,IAAI,cAAc,EAEnC,MAAM,uBAAuB,CAAC;~~AAU~~/B,OAAO,KAAK,EACV,qBAAqB,EACrB,cAAc,EACd,eAAe,EACf,WAAW,EACX,UAAU,EACV,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAWrB,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACpE,SAAQ,WAAW,EACjB,UAAU,CAAC,GAAG,CAAC,EACf,eAAe,CAAC,CAAC,CAAC,EAClB,qBAAqB,EACrB,IAAI,CACF,cAAc,CAAC,CAAC,CAAC,EACf,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;~~IACtC;;;OAGG~~;~~IACH~~,~~aAAa~~,~~CAAC~~,EAAE,~~OAAO~~,CAAC;~~CACzB~~;~~AA+ED~~;;;;GAIG;AACH,QAAA,MAAM,OAAO,~~GAlFG~~,CAAC,SAAS,cAAc,+~~JAkFoB~~,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~~,2CAA2C;IAC3C,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"}
1	+ {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,KAAK,cAAc,EAA+B,MAAM,OAAO,CAAC;AAC5F,OAAO,EAaL,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,WAAW,IAAI,cAAc,EAEnC,MAAM,uBAAuB,CAAC;AAW/B,OAAO,KAAK,EACV,QAAQ,EACR,qBAAqB,EACrB,cAAc,EACd,eAAe,EACf,WAAW,EACX,UAAU,EACV,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAWrB,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACpE,SAAQ,WAAW,EACjB,UAAU,CAAC,GAAG,CAAC,EACf,eAAe,CAAC,CAAC,CAAC,EAClB,qBAAqB,EACrB,QAAQ,CAAC,SAAS,CAAC,EACnB,IAAI,CACF,cAAc,CAAC,CAAC,CAAC,EACf,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,aAAa,GACb,oBAAoB,GACpB,cAAc,GACd,WAAW,GACX,mBAAmB,GACnB,aAAa,GACb,SAAS,GACT,QAAQ,GACR,cAAc,CACjB;IACH;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CAC3C;AAED,4DAA4D;AAC5D,MAAM,WAAW,SAAS;IACxB,8DAA8D;IAC9D,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AA0FD;;;;GAIG;AACH,QAAA,MAAM,OAAO,GA7FG,CAAC,SAAS,cAAc,+JA6FoB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAE7B,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;IAC9G,0EAA0E;IAC1E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,2CAA2C;IAC3C,QAAQ,EAAE,kBAAkB,CAAC;CAC9B;AAED,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAgBjE;yBAhBe,UAAU;;;AAoB1B,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/esm/components/select/select.js CHANGED Viewed

@@ -1,11 +1,13 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import clsx from 'clsx';
+import { useImperativeHandle, useRef } from 'react';
 import { Button as RACButton, Collection as RACCollection, Header as RACHeader, ListBox as RACListBox, ListBoxLoadMoreItem as RACListBoxLoadMoreItem, ListBoxItem as RACListBoxItem, ListBoxSection as RACListBoxSection, ListLayout as RACListLayout, Select as RACSelect, SelectValue as RACSelectValue, Text as RACText, Virtualizer as RACVirtualizer, } from 'react-aria-components';
 import { forwardRef } from '../../forward-ref.js';
 import { useLocalizedMessages } from '../../i18n/index.js';
 import { IconCheck, IconChevronDown } from '../../icons/index.js';
 import { isProduction } from '../../utils/is-production.js';
+import { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';
 import { useProductionWarning } from '../../utils/use-production-warning.js';
 import { withStyleProps } from '../../with-style-props.js';
 import { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';
@@ -19,7 +21,8 @@ const VIRTUAL_LAYOUT_OPTIONS = {
     padding: 0,
     gap: 0,
 };
-function Select({ children, items, label, description, error, UNSAFE_className, UNSAFE_style, onScroll, isVirtualized = false, UNSTABLE_isLoading: isLoading, UNSTABLE_onLoadMore: onLoadMore, ...props }, ref) {
+function Select({ children, items, label, description, error, UNSAFE_className, UNSAFE_style, onScroll, isVirtualized = false, apiRef, UNSTABLE_isLoading: isLoading, UNSTABLE_onLoadMore: onLoadMore, ...props }, ref) {
+    const triggerRef = useRef(null);
     const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
     useProductionWarning(() => {
         if (!label && !ariaLabel && !ariaLabelledBy) {
@@ -30,8 +33,11 @@ function Select({ children, items, label, description, error, UNSAFE_className,
         console.warn('`Select` requires `children` to be a function when using `items` prop');
     }
     const collectionMessages = useLocalizedMessages('UNSTABLE_collection');
+    useImperativeHandle(apiRef, () => ({
+        focus: () => triggerRef.current?.focus(),
+    }), []);
     const listBox = (_jsxs(RACListBox, { className: "cim-select-listbox", onScroll: onScroll, renderEmptyState: () => isLoading ? _jsx(Spinner, { "aria-label": collectionMessages.format('loading'), size: "small", marginY: 8 }) : null, children: [_jsx(RACCollection, { items: items, children: children }), _jsx(RACListBoxLoadMoreItem, { onLoadMore: onLoadMore, isLoading: isLoading, children: _jsx(Spinner, { "aria-label": collectionMessages.format('loadingMore'), size: "small", marginY: 8 }) })] }));
-    return (_jsxs(RACSelect, { ...props, ref: ref, className: clsx('cim-select', UNSAFE_className), style: UNSAFE_style, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACButton, { className: "cim-select-button", children: [_jsx(RACSelectValue, { className: (values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' })), children: ({ selectedText }) => selectedText }), _jsx(IconChevronDown, {})] }), _jsx(FormFieldError, { children: error }), _jsx(FormFieldDescription, { children: description }), _jsx(CollapsibleList, { offset: 5, maxHeight: 315, children: isVirtualized ? (_jsx(RACVirtualizer, { layout: RACListLayout, layoutOptions: VIRTUAL_LAYOUT_OPTIONS, children: listBox })) : (listBox) })] }));
+    return (_jsxs(RACSelect, { ...props, ref: ref, className: clsx('cim-select', UNSAFE_className), style: UNSAFE_style, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACButton, { ref: triggerRef, className: "cim-select-button", children: [_jsx(RACSelectValue, { className: (values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' })), children: ({ selectedText }) => selectedText }), _jsx(IconChevronDown, {})] }), _jsx(FormFieldError, { children: error }), _jsx(FormFieldDescription, { children: description }), _jsx(CollapsibleList, { offset: 5, maxHeight: 315, children: isVirtualized ? (_jsx(RACVirtualizer, { layout: RACListLayout, layoutOptions: VIRTUAL_LAYOUT_OPTIONS, children: listBox })) : (listBox) })] }));
 }
 /**
  * Allows users to select one item from a collapsible list.
@@ -42,7 +48,7 @@ const _Select = withStyleProps(forwardRef(Select), 'Select');
 export { _Select as Select };
 /** Renders a single list item within `Select`. */
 export function SelectItem({ children, ...props }) {
-    const textValue = typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');
+    const textValue = stringLikeChildrenToString(children);
     return (_jsx(RACListBoxItem, { ...props, className: "cim-select-item", textValue: textValue, children: ({ isDisabled }) => (_jsxs(_Fragment, { children: [_jsx(IconCheck, {}), _jsx(RACText, { slot: "label", className: textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' }), children: children })] })) }));
 }
 SelectItem.displayName = 'SelectItem';

package/dist/esm/components/select/select.js.map CHANGED Viewed

	@@ -1 +1 @@
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 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 ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n Text as RACText,\n type ListBoxItemProps as RACListBoxItemProps,\n type SelectProps as RACSelectProps,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheck, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.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 { Spinner } from '../spinner/spinner.js';\nimport type {\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n rowHeight: 40,\n headingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\nexport interface SelectProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n FieldProps<Key>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n Pick<\n RACSelectProps<T>,\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 /*\n Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n /\n isVirtualized?: boolean;\n}\n\nfunction Select<T extends CollectionItem>(\n {\n children,\n items,\n label,\n description,\n error,\n UNSAFE_className,\n UNSAFE_style,\n onScroll,\n isVirtualized = false,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n ...props\n }: SelectProps<T>,\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('Select requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`Select` requires `children` to be a function when using `items` prop');\n }\n\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n const listBox = (\n <RACListBox\n className=\"cim-select-listbox\"\n onScroll={onScroll}\n renderEmptyState={() =>\n isLoading ? <Spinner aria-label={collectionMessages.format('loading')} size=\"small\" marginY={8} /> : null\n }\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format('loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\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: 'body', alignment: 'start' }))}\n >\n {({ selectedText }) => selectedText}\n </RACSelectValue>\n <IconChevronDown />\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 {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\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 /* The content to display as the label. /\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 <IconCheck />\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 (!isProduction() && 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"]}
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 { type ForwardedRef, type UIEventHandler, useImperativeHandle, useRef } from 'react';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n Header as RACHeader,\n ListBox as RACListBox,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n Text as RACText,\n type ListBoxItemProps as RACListBoxItemProps,\n type SelectProps as RACSelectProps,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheck, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.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 { Spinner } from '../spinner/spinner.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n rowHeight: 40,\n headingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\nexport interface SelectProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n FieldProps<Key>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<SelectApi>,\n Pick<\n RACSelectProps<T>,\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 /*\n Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n /\n isVirtualized?: boolean;\n /* Handler that is called when the list of items is scrolled. /\n onScroll?: UIEventHandler<HTMLDivElement>;\n}\n\n/* The imperative API exposed by the `Select` component. /\nexport interface SelectApi {\n /* Focuses the trigger button and opens the list of items. /\n focus: () => void;\n}\n\nfunction Select<T extends CollectionItem>(\n {\n children,\n items,\n label,\n description,\n error,\n UNSAFE_className,\n UNSAFE_style,\n onScroll,\n isVirtualized = false,\n apiRef,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n ...props\n }: SelectProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const triggerRef = useRef<HTMLButtonElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\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 (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`Select` requires `children` to be a function when using `items` prop');\n }\n\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => triggerRef.current?.focus(),\n }),\n [],\n );\n\n const listBox = (\n <RACListBox\n className=\"cim-select-listbox\"\n onScroll={onScroll}\n renderEmptyState={() =>\n isLoading ? <Spinner aria-label={collectionMessages.format('loading')} size=\"small\" marginY={8} /> : null\n }\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format('loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\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 ref={triggerRef} className=\"cim-select-button\">\n <RACSelectValue\n className={(values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' }))}\n >\n {({ selectedText }) => selectedText}\n </RACSelectValue>\n <IconChevronDown />\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 {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\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 extends Pick<RACListBoxItemProps, 'isDisabled' \| 'onHoverStart' \| 'onHoverEnd'> {\n /* The ID of the item. Has to be unique across all sections and items. /\n id?: Key;\n /* The content to display as the label. /\n children: StringLikeChildren;\n}\n\n/* Renders a single list item within `Select`. /\nexport function SelectItem({ children, ...props }: SelectItemProps) {\n const textValue = stringLikeChildrenToString(children);\n\n return (\n <RACListBoxItem {...props} className=\"cim-select-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheck />\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 (!isProduction() && 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/esm/components/spacing/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
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,CAAC;AAEnD,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~~"}
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,CAAC;AAEnD,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,CAwBpC"}

package/dist/esm/components/spacing/types.js CHANGED Viewed

@@ -31,10 +31,12 @@ export function getResponsiveVariables(targetTokenGroup, sourceTokenGroup, data,
             [`--cim-${targetTokenGroup}-sm`]: `var(--cim-${sourceTokenGroup}-${data ?? defaultValue})`,
         };
     }
-    const result = {
-        // Default value in case the smallest breakpoint isn't defined
-        [`--cim-${targetTokenGroup}-sm`]: `var(--cim-${sourceTokenGroup}-${defaultValue})`,
-    };
+    const result = defaultValue !== undefined
+        ? {
+            // Default value in case the smallest breakpoint isn't defined
+            [`--cim-${targetTokenGroup}-sm`]: `var(--cim-${sourceTokenGroup}-${defaultValue})`,
+        }
+        : {};
     Object.entries(data).forEach(([breakpoint, value]) => {
         result[`--cim-${targetTokenGroup}-${breakpoint}`] = `var(--cim-${sourceTokenGroup}-${value})`;
     });

package/dist/esm/components/spacing/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/spacing/types.ts"],"names":[],"mappings":"AASA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,UAAU,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 = '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}-sm`]: `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}-sm`]: `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"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/spacing/types.ts"],"names":[],"mappings":"AASA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,UAAU,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,GACV,YAAY,KAAK,SAAS;QACxB,CAAC,CAAC;YACE,8DAA8D;YAC9D,CAAC,SAAS,gBAAgB,KAAK,CAAC,EAAE,aAAa,gBAAgB,IAAI,YAAY,GAAG;SACnF;QACH,CAAC,CAAC,EAAE,CAAC;IAET,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 = '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}-sm`]: `var(--cim-${sourceTokenGroup}-${data ?? defaultValue})`,\n };\n }\n\n const result: Record<string, string> =\n defaultValue !== undefined\n ? {\n // Default value in case the smallest breakpoint isn't defined\n [`--cim-${targetTokenGroup}-sm`]: `var(--cim-${sourceTokenGroup}-${defaultValue})`,\n }\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/esm/components/stepper/context.d.ts CHANGED Viewed

@@ -1,4 +1,6 @@
 export declare const StepContext: import("react").Context<{
+    orientation: "vertical" | "horizontal";
+    stepCount: number;
     currentStep: number;
     stepIndex: number;
     onChange?: () => void;

package/dist/esm/components/stepper/context.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/components/stepper/context.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW;iBACT,MAAM;eACR,MAAM;eACN,MAAM,IAAI;~~EAIrB~~,CAAC"}
1	+ {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/components/stepper/context.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW;iBACT,UAAU,GAAG,YAAY;eAC3B,MAAM;iBACJ,MAAM;eACR,MAAM;eACN,MAAM,IAAI;EAMrB,CAAC"}

package/dist/esm/components/stepper/context.js CHANGED Viewed

@@ -1,5 +1,7 @@
 import { createContext } from 'react';
 export const StepContext = createContext({
+    orientation: 'horizontal',
+    stepCount: 0,
     currentStep: 0,
     stepIndex: 0,
 });

package/dist/esm/components/stepper/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../src/components/stepper/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,~~CAIrC~~;IACD,WAAW,EAAE,CAAC;IACd,SAAS,EAAE,CAAC;CACb,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nexport const StepContext = createContext<{\n currentStep: number;\n stepIndex: number;\n onChange?: () => void;\n}>({\n currentStep: 0,\n stepIndex: 0,\n});\n"]}
1	+ {"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../src/components/stepper/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAMrC;IACD,WAAW,EAAE,YAAY;IACzB,SAAS,EAAE,CAAC;IACZ,WAAW,EAAE,CAAC;IACd,SAAS,EAAE,CAAC;CACb,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nexport const StepContext = createContext<{\n orientation: 'vertical' \| 'horizontal';\n stepCount: number;\n currentStep: number;\n stepIndex: number;\n onChange?: () => void;\n}>({\n orientation: 'horizontal',\n stepCount: 0,\n currentStep: 0,\n stepIndex: 0,\n});\n"]}

package/dist/esm/components/stepper/stepper-item.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stepper-item.d.ts","sourceRoot":"","sources":["../../../../src/components/stepper/stepper-item.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAEhD,MAAM,WAAW,yBAA0B,SAAQ,WAAW;IAC5D,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB;~~AAmED~~;;GAEG;AACH,QAAA,MAAM,qBAAqB,0KAAkE,CAAC;AAE9F,OAAO,EAAE,qBAAqB,IAAI,oBAAoB,EAAE,CAAC"}
1	+ {"version":3,"file":"stepper-item.d.ts","sourceRoot":"","sources":["../../../../src/components/stepper/stepper-item.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAEhD,MAAM,WAAW,yBAA0B,SAAQ,WAAW;IAC5D,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB;AAoED;;GAEG;AACH,QAAA,MAAM,qBAAqB,0KAAkE,CAAC;AAE9F,OAAO,EAAE,qBAAqB,IAAI,oBAAoB,EAAE,CAAC"}

package/dist/esm/components/stepper/stepper-item.js CHANGED Viewed

@@ -10,14 +10,15 @@ import { Text } from '../typography/text.js';
 import { StepContext } from './context.js';
 function UNSTABLE_StepperItem({ title, description, status: overrideStatus, UNSAFE_className, UNSAFE_style, ...props }, ref) {
     const labelId = useId();
-    const { currentStep, stepIndex, onChange } = useContext(StepContext);
+    const { currentStep, stepIndex, onChange, stepCount, orientation } = useContext(StepContext);
     const isCurrent = stepIndex === currentStep;
     const isPrevious = stepIndex < currentStep;
+    const isLast = stepIndex === stepCount - 1;
     const status = overrideStatus ?? (isCurrent ? 'in-progress' : isPrevious ? 'complete' : undefined);
     const isNavigable = !isCurrent && onChange && (status != null || isPrevious);
     const titleElement = (_jsx(Text, { id: labelId, as: "span", variant: isCurrent ? 'body-semibold' : 'body', UNSAFE_className: "cim-stepper-item-title", children: title }));
     const iconElement = (_jsx("div", { className: "cim-stepper-item-icon", children: status && _jsx(StepperItemIcon, { status: status, isCurrent: isCurrent }) }));
-    return (_jsxs("li", { ...props, ref: ref, className: clsx('cim-stepper-item', UNSAFE_className), style: UNSAFE_style, "data-status": status, "aria-current": isCurrent, children: [_jsxs("div", { className: "cim-stepper-item-icon-container", children: [isNavigable ? (_jsx("button", { className: "cim-stepper-item-icon-button", type: "button", onClick: onChange, "aria-labelledby": labelId, children: iconElement })) : (iconElement), _jsx("div", { className: "cim-stepper-item-tail" })] }), _jsxs("div", { className: "cim-stepper-item-content", children: [isNavigable ? (_jsx("button", { className: "cim-stepper-item-title-button", type: "button", onClick: onChange, tabIndex: -1, children: titleElement })) : (titleElement), description && (_jsx(Text, { as: "div", UNSAFE_className: "cim-stepper-item-description", variant: "medium", tone: "muted", children: description }))] })] }));
+    return (_jsxs("li", { ...props, ref: ref, className: clsx('cim-stepper-item', UNSAFE_className), style: UNSAFE_style, "data-status": status, "aria-current": isCurrent, children: [_jsxs("div", { className: "cim-stepper-item-icon-container", children: [isNavigable ? (_jsx("button", { className: "cim-stepper-item-icon-button", type: "button", onClick: onChange, "aria-labelledby": labelId, children: iconElement })) : (iconElement), !isLast && orientation === 'vertical' && _jsx("div", { className: "cim-stepper-item-tail" })] }), _jsxs("div", { className: "cim-stepper-item-content", children: [isNavigable ? (_jsx("button", { className: "cim-stepper-item-title-button", type: "button", onClick: onChange, tabIndex: -1, children: titleElement })) : (titleElement), description && (_jsx(Text, { as: "div", UNSAFE_className: "cim-stepper-item-description", variant: "medium", tone: "muted", children: description }))] })] }));
 }
 /**
  * Represents a single step in a stepper component.

package/dist/esm/components/stepper/stepper-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stepper-item.js","sourceRoot":"","sources":["../../../../src/components/stepper/stepper-item.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,UAAU,EAAqB,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAY3C,SAAS,oBAAoB,CAC3B,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAA6B,EACnH,GAAgC;IAEhC,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IAExB,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;~~IACrE~~,MAAM,SAAS,GAAG,SAAS,KAAK,WAAW,CAAC;IAC5C,MAAM,UAAU,GAAG,SAAS,GAAG,WAAW,CAAC;IAE3C,MAAM,MAAM,GAAG,cAAc,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAEnG,MAAM,WAAW,GAAG,CAAC,SAAS,IAAI,QAAQ,IAAI,CAAC,MAAM,IAAI,IAAI,IAAI,UAAU,CAAC,CAAC;IAE7E,MAAM,YAAY,GAAG,CACnB,KAAC,IAAI,IACH,EAAE,EAAE,OAAO,EACX,EAAE,EAAC,MAAM,EACT,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,EAC7C,gBAAgB,EAAC,wBAAwB,YAExC,KAAK,GACD,CACR,CAAC;IACF,MAAM,WAAW,GAAG,CAClB,cAAK,SAAS,EAAC,uBAAuB,YAAE,MAAM,IAAI,KAAC,eAAe,IAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,GAAO,CACnH,CAAC;IAEF,OAAO,CACL,iBACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,EACrD,KAAK,EAAE,YAAY,iBACN,MAAM,kBACL,SAAS,aAEvB,eAAK,SAAS,EAAC,iCAAiC,aAC7C,WAAW,CAAC,CAAC,CAAC,CACb,iBAAQ,SAAS,EAAC,8BAA8B,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,QAAQ,qBAAmB,OAAO,YACvG,WAAW,GACL,CACV,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,~~EACD~~,cAAK,SAAS,EAAC,uBAAuB,GAAG,~~IACrC~~,EACN,eAAK,SAAS,EAAC,0BAA0B,aACtC,WAAW,CAAC,CAAC,CAAC,CACb,iBAAQ,SAAS,EAAC,+BAA+B,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,YAC5F,YAAY,GACN,CACV,CAAC,CAAC,CAAC,CACF,YAAY,CACb,EACA,WAAW,IAAI,CACd,KAAC,IAAI,IAAC,EAAE,EAAC,KAAK,EAAC,gBAAgB,EAAC,8BAA8B,EAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YACzF,WAAW,GACP,CACR,IACG,IACH,CACN,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,qBAAqB,GAAG,cAAc,CAAC,UAAU,CAAC,oBAAoB,CAAC,EAAE,aAAa,CAAC,CAAC;AAE9F,OAAO,EAAE,qBAAqB,IAAI,oBAAoB,EAAE,CAAC;AAEzD,MAAM,YAAY,GAAG;IACnB,QAAQ,EAAE,aAAa;IACvB,sDAAsD;IACtD,KAAK,EAAE,GAAG,EAAE,CAAC,CACX,eAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,aAC5F,eACE,CAAC,EAAC,mPAAmP,EACrP,IAAI,EAAC,cAAc,GACnB,EACF,eACE,CAAC,EAAC,mPAAmP,EACrP,IAAI,EAAC,cAAc,GACnB,IACE,CACP;IACD,sDAAsD;IACtD,OAAO,EAAE,GAAG,EAAE,CAAC,CACb,eAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,aAC5F,eACE,CAAC,EAAC,yHAAyH,EAC3H,IAAI,EAAC,cAAc,GACnB,EACF,eAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,MAAM,EAAC,cAAc,EAAC,WAAW,EAAC,GAAG,EAAC,aAAa,EAAC,OAAO,GAAG,IAC/F,CACP;IACD,aAAa,EAAE,kBAAkB;CAClC,CAAC;AAEF,gEAAgE;AAChE,SAAS,eAAe,CAAC,EAAE,MAAM,EAAE,SAAS,EAAiD;IAC3F,MAAM,IAAI,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;IAElC,IAAI,MAAM,KAAK,aAAa,IAAI,CAAC,SAAS,EAAE,CAAC;QAC3C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,KAAC,IAAI,0BAAe,CAAC;AAC9B,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, type ForwardedRef } from 'react';\nimport { useId } from 'react-aria';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconCheckBold, IconCircleBoldFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\nimport { Text } from '../typography/text.js';\nimport { StepContext } from './context.js';\nimport type { StepperStatus } from './types.js';\n\nexport interface UNSTABLE_StepperItemProps extends CommonProps {\n /** The title of the step. /\n title: string;\n /* The description of the step. /\n description?: string;\n /* The status of the step. /\n status?: StepperStatus;\n}\n\nfunction UNSTABLE_StepperItem(\n { title, description, status: overrideStatus, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_StepperItemProps,\n ref: ForwardedRef<HTMLLIElement>,\n) {\n const labelId = useId();\n\n const { currentStep, stepIndex, onChange } = useContext(StepContext);\n const isCurrent = stepIndex === currentStep;\n const isPrevious = stepIndex < currentStep;\n\n const status = overrideStatus ?? (isCurrent ? 'in-progress' : isPrevious ? 'complete' : undefined);\n\n const isNavigable = !isCurrent && onChange && (status != null \|\| isPrevious);\n\n const titleElement = (\n <Text\n id={labelId}\n as=\"span\"\n variant={isCurrent ? 'body-semibold' : 'body'}\n UNSAFE_className=\"cim-stepper-item-title\"\n >\n {title}\n </Text>\n );\n const iconElement = (\n <div className=\"cim-stepper-item-icon\">{status && <StepperItemIcon status={status} isCurrent={isCurrent} />}</div>\n );\n\n return (\n <li\n {...props}\n ref={ref}\n className={clsx('cim-stepper-item', UNSAFE_className)}\n style={UNSAFE_style}\n data-status={status}\n aria-current={isCurrent}\n >\n <div className=\"cim-stepper-item-icon-container\">\n {isNavigable ? (\n <button className=\"cim-stepper-item-icon-button\" type=\"button\" onClick={onChange} aria-labelledby={labelId}>\n {iconElement}\n </button>\n ) : (\n iconElement\n )}\n <div className=\"cim-stepper-item-tail\" ~~/>\~~n </div>\n <div className=\"cim-stepper-item-content\">\n {isNavigable ? (\n <button className=\"cim-stepper-item-title-button\" type=\"button\" onClick={onChange} tabIndex={-1}>\n {titleElement}\n </button>\n ) : (\n titleElement\n )}\n {description && (\n <Text as=\"div\" UNSAFE_className=\"cim-stepper-item-description\" variant=\"medium\" tone=\"muted\">\n {description}\n </Text>\n )}\n </div>\n </li>\n );\n}\n\n/\n Represents a single step in a stepper component.\n */\nconst _UNSTABLE_StepperItem = withStyleProps(forwardRef(UNSTABLE_StepperItem), 'StepperItem');\n\nexport { _UNSTABLE_StepperItem as UNSTABLE_StepperItem };\n\nconst statusToIcon = {\n complete: IconCheckBold,\n // TODO: replace with icon from library when available\n error: () => (\n <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M24.1421 21.1421C24.9232 21.9232 24.9232 23.1895 24.1421 23.9706C23.3611 24.7516 22.0948 24.7516 21.3137 23.9706L8.58579 11.2426C7.80474 10.4616 7.80474 9.19526 8.58579 8.41421C9.36684 7.63316 10.6332 7.63316 11.4142 8.41421L24.1421 21.1421Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M21.1421 8.85786C21.9232 8.07682 23.1895 8.07682 23.9706 8.85786C24.7516 9.63891 24.7516 10.9052 23.9706 11.6863L11.2426 24.4142C10.4616 25.1953 9.19526 25.1953 8.41421 24.4142C7.63316 23.6332 7.63316 22.3668 8.41421 21.5858L21.1421 8.85786Z\"\n fill=\"currentColor\"\n />\n </svg>\n ),\n // TODO: replace with icon from library when available\n warning: () => (\n <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M18 24C18 25.1046 17.1046 26 16 26C14.8954 26 14 25.1046 14 24C14 22.8954 14.8954 22 16 22C17.1046 22 18 22.8954 18 24Z\"\n fill=\"currentColor\"\n />\n <line x1=\"16\" y1=\"8\" x2=\"16\" y2=\"18\" stroke=\"currentColor\" strokeWidth=\"4\" strokeLinecap=\"round\" />\n </svg>\n ),\n 'in-progress': IconCircleBoldFill,\n};\n\n// eslint-disable-next-line react-refresh/only-export-components\nfunction StepperItemIcon({ status, isCurrent }: { status: StepperStatus; isCurrent: boolean }) {\n const Icon = statusToIcon[status];\n\n if (status === 'in-progress' && !isCurrent) {\n return null;\n }\n\n return <Icon aria-hidden />;\n}\n"]}
1	+ {"version":3,"file":"stepper-item.js","sourceRoot":"","sources":["../../../../src/components/stepper/stepper-item.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { useContext, type ForwardedRef } from 'react';\nimport { useId } from 'react-aria';\nimport { forwardRef } from '../../forward-ref.js';\nimport { IconCheckBold, IconCircleBoldFill } from '../../icons/index.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\nimport { Text } from '../typography/text.js';\nimport { StepContext } from './context.js';\nimport type { StepperStatus } from './types.js';\n\nexport interface UNSTABLE_StepperItemProps extends CommonProps {\n /** The title of the step. /\n title: string;\n /* The description of the step. /\n description?: string;\n /* The status of the step. /\n status?: StepperStatus;\n}\n\nfunction UNSTABLE_StepperItem(\n { title, description, status: overrideStatus, UNSAFE_className, UNSAFE_style, ...props }: UNSTABLE_StepperItemProps,\n ref: ForwardedRef<HTMLLIElement>,\n) {\n const labelId = useId();\n\n const { currentStep, stepIndex, onChange, stepCount, orientation } = useContext(StepContext);\n const isCurrent = stepIndex === currentStep;\n const isPrevious = stepIndex < currentStep;\n const isLast = stepIndex === stepCount - 1;\n\n const status = overrideStatus ?? (isCurrent ? 'in-progress' : isPrevious ? 'complete' : undefined);\n\n const isNavigable = !isCurrent && onChange && (status != null \|\| isPrevious);\n\n const titleElement = (\n <Text\n id={labelId}\n as=\"span\"\n variant={isCurrent ? 'body-semibold' : 'body'}\n UNSAFE_className=\"cim-stepper-item-title\"\n >\n {title}\n </Text>\n );\n const iconElement = (\n <div className=\"cim-stepper-item-icon\">{status && <StepperItemIcon status={status} isCurrent={isCurrent} />}</div>\n );\n\n return (\n <li\n {...props}\n ref={ref}\n className={clsx('cim-stepper-item', UNSAFE_className)}\n style={UNSAFE_style}\n data-status={status}\n aria-current={isCurrent}\n >\n <div className=\"cim-stepper-item-icon-container\">\n {isNavigable ? (\n <button className=\"cim-stepper-item-icon-button\" type=\"button\" onClick={onChange} aria-labelledby={labelId}>\n {iconElement}\n </button>\n ) : (\n iconElement\n )}\n {!isLast && orientation === 'vertical' && <div className=\"cim-stepper-item-tail\" />}\n </div>\n <div className=\"cim-stepper-item-content\">\n {isNavigable ? (\n <button className=\"cim-stepper-item-title-button\" type=\"button\" onClick={onChange} tabIndex={-1}>\n {titleElement}\n </button>\n ) : (\n titleElement\n )}\n {description && (\n <Text as=\"div\" UNSAFE_className=\"cim-stepper-item-description\" variant=\"medium\" tone=\"muted\">\n {description}\n </Text>\n )}\n </div>\n </li>\n );\n}\n\n/\n Represents a single step in a stepper component.\n */\nconst _UNSTABLE_StepperItem = withStyleProps(forwardRef(UNSTABLE_StepperItem), 'StepperItem');\n\nexport { _UNSTABLE_StepperItem as UNSTABLE_StepperItem };\n\nconst statusToIcon = {\n complete: IconCheckBold,\n // TODO: replace with icon from library when available\n error: () => (\n <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M24.1421 21.1421C24.9232 21.9232 24.9232 23.1895 24.1421 23.9706C23.3611 24.7516 22.0948 24.7516 21.3137 23.9706L8.58579 11.2426C7.80474 10.4616 7.80474 9.19526 8.58579 8.41421C9.36684 7.63316 10.6332 7.63316 11.4142 8.41421L24.1421 21.1421Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M21.1421 8.85786C21.9232 8.07682 23.1895 8.07682 23.9706 8.85786C24.7516 9.63891 24.7516 10.9052 23.9706 11.6863L11.2426 24.4142C10.4616 25.1953 9.19526 25.1953 8.41421 24.4142C7.63316 23.6332 7.63316 22.3668 8.41421 21.5858L21.1421 8.85786Z\"\n fill=\"currentColor\"\n />\n </svg>\n ),\n // TODO: replace with icon from library when available\n warning: () => (\n <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M18 24C18 25.1046 17.1046 26 16 26C14.8954 26 14 25.1046 14 24C14 22.8954 14.8954 22 16 22C17.1046 22 18 22.8954 18 24Z\"\n fill=\"currentColor\"\n />\n <line x1=\"16\" y1=\"8\" x2=\"16\" y2=\"18\" stroke=\"currentColor\" strokeWidth=\"4\" strokeLinecap=\"round\" />\n </svg>\n ),\n 'in-progress': IconCircleBoldFill,\n};\n\n// eslint-disable-next-line react-refresh/only-export-components\nfunction StepperItemIcon({ status, isCurrent }: { status: StepperStatus; isCurrent: boolean }) {\n const Icon = statusToIcon[status];\n\n if (status === 'in-progress' && !isCurrent) {\n return null;\n }\n\n return <Icon aria-hidden />;\n}\n"]}

package/dist/esm/components/stepper/stepper.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../../src/components/stepper/stepper.tsx"],"names":[],"mappings":"AAGA,OAAO,~~EAA+B~~,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;~~AAGpE~~,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,2CAA2C;IAC3C,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;CACzC;~~AAyCD~~;;GAEG;AACH,QAAA,MAAM,iBAAiB,yKAA0D,CAAC;AAElF,OAAO,EAAE,iBAAiB,IAAI,gBAAgB,EAAE,CAAC"}
1	+ {"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../../src/components/stepper/stepper.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,2CAA2C;IAC3C,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;CACzC;AAoDD;;GAEG;AACH,QAAA,MAAM,iBAAiB,yKAA0D,CAAC;AAElF,OAAO,EAAE,iBAAiB,IAAI,gBAAgB,EAAE,CAAC"}

package/dist/esm/components/stepper/stepper.js CHANGED Viewed

@@ -1,19 +1,25 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from 'clsx';
 import { Children } from 'react';
 import { forwardRef } from '../../forward-ref.js';
 import { withStyleProps } from '../../with-style-props.js';
 import { StepContext } from './context.js';
 function UNSTABLE_Stepper({ children, currentStep, onChange, orientation = 'horizontal', UNSAFE_className, UNSAFE_style, ...props }, ref) {
-    return (_jsx("ol", { ...props, ref: ref, className: clsx('cim-stepper', UNSAFE_className), style: UNSAFE_style, "data-orientation": orientation, children: Children.map(children, (child, stepIndex) => (_jsx(StepContext.Provider, { value: {
-                currentStep: currentStep ?? -1,
-                stepIndex,
-                onChange: onChange &&
-                    (() => {
-                        onChange(stepIndex);
-                    }),
-            }, children: child }))) }));
+    const stepCount = Children.count(children);
+    return (_jsx("ol", { ...props, ref: ref, className: clsx('cim-stepper', UNSAFE_className), style: { ...UNSAFE_style, '--cim-stepper-step-count': stepCount }, "data-orientation": orientation, children: Children.map(children, (child, stepIndex) => {
+            const isLast = stepIndex === stepCount - 1;
+            return (_jsxs(_Fragment, { children: [_jsx(StepContext.Provider, { value: {
+                            orientation,
+                            stepCount: Children.count(children),
+                            currentStep: currentStep ?? -1,
+                            stepIndex,
+                            onChange: onChange &&
+                                (() => {
+                                    onChange(stepIndex);
+                                }),
+                        }, children: child }), !isLast && orientation === 'horizontal' && _jsx("div", { className: "cim-stepper-item-tail" })] }));
+        }) }));
 }
 /**
  * Displays a series of steps in a process.

package/dist/esm/components/stepper/stepper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../../src/components/stepper/stepper.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,QAAQ,~~EAAqC~~,MAAM,OAAO,CAAC;~~AACpE~~,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAgB3C,SAAS,gBAAgB,CACvB,EACE,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,WAAW,GAAG,YAAY,EAC1B,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACc,EACxB,GAAmC;IAEnC,OAAO,CACL,gBACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,gBAAgB,CAAC,EAChD,KAAK,EAAE,YAAY,~~sBACD~~,WAAW,YAE5B,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,~~CAC5C~~,KAAC,WAAW,CAAC,QAAQ,IACnB,KAAK,EAAE;~~gBACL~~,WAAW,EAAE,WAAW,IAAI,CAAC,CAAC;~~gBAC9B~~,SAAS;~~gBACT~~,QAAQ,EACN,QAAQ;~~oBACR~~,CAAC,GAAG,EAAE;~~wBACJ~~,QAAQ,CAAC,SAAS,CAAC,CAAC;~~oBACtB~~,CAAC,CAAC;~~aACL~~,YAEA,KAAK,GACe,~~CACxB~~,CAAC,GACC,CACN,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,iBAAiB,GAAG,cAAc,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAAE,SAAS,CAAC,CAAC;AAElF,OAAO,EAAE,iBAAiB,IAAI,gBAAgB,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { Children, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\nimport { StepContext } from './context.js';\n\nexport interface UNSTABLE_StepperProps extends CommonProps {\n /** The steps to display in the stepper. /\n children: ReactNode;\n /* The index of the active step. /\n currentStep?: number;\n /* The callback to call when the current step changes. /\n onChange?: (step: number) => void;\n /* The orientation of the stepper.\n \n @default 'horizontal'\n /\n orientation?: 'vertical' \| 'horizontal';\n}\n\nfunction UNSTABLE_Stepper(\n {\n children,\n currentStep,\n onChange,\n orientation = 'horizontal',\n UNSAFE_className,\n UNSAFE_style,\n ...props\n }: UNSTABLE_StepperProps,\n ref: ForwardedRef<HTMLOListElement>,\n) {\n return (\n <ol\n {...props}\n ref={ref}\n className={clsx('cim-stepper', UNSAFE_className)}\n style={UNSAFE_style}\n data-orientation={orientation}\n >\n {Children.map(children, (child, stepIndex) => (\n <StepContext.Provider\n value={{\n currentStep: currentStep ?? -1,\n stepIndex,\n onChange:\n onChange &&\n (() => {\n onChange(stepIndex);\n }),\n }}\n >\n {child}\n </StepContext.Provider>\n ))}\n </ol>\n );\n}\n\n/\n Displays a series of steps in a process.\n */\nconst _UNSTABLE_Stepper = withStyleProps(forwardRef(UNSTABLE_Stepper), 'Stepper');\n\nexport { _UNSTABLE_Stepper as UNSTABLE_Stepper };\n"]}
1	+ {"version":3,"file":"stepper.js","sourceRoot":"","sources":["../../../../src/components/stepper/stepper.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAyD,MAAM,OAAO,CAAC;AACxF,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAgB3C,SAAS,gBAAgB,CACvB,EACE,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,WAAW,GAAG,YAAY,EAC1B,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACc,EACxB,GAAmC;IAEnC,MAAM,SAAS,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAE3C,OAAO,CACL,gBACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,gBAAgB,CAAC,EAChD,KAAK,EAAE,EAAE,GAAG,YAAY,EAAE,0BAA0B,EAAE,SAAS,EAAmB,sBAChE,WAAW,YAE5B,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,EAAE;YAC3C,MAAM,MAAM,GAAG,SAAS,KAAK,SAAS,GAAG,CAAC,CAAC;YAE3C,OAAO,CACL,8BACE,KAAC,WAAW,CAAC,QAAQ,IACnB,KAAK,EAAE;4BACL,WAAW;4BACX,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC;4BACnC,WAAW,EAAE,WAAW,IAAI,CAAC,CAAC;4BAC9B,SAAS;4BACT,QAAQ,EACN,QAAQ;gCACR,CAAC,GAAG,EAAE;oCACJ,QAAQ,CAAC,SAAS,CAAC,CAAC;gCACtB,CAAC,CAAC;yBACL,YAEA,KAAK,GACe,EACtB,CAAC,MAAM,IAAI,WAAW,KAAK,YAAY,IAAI,cAAK,SAAS,EAAC,uBAAuB,GAAG,IACpF,CACJ,CAAC;QACJ,CAAC,CAAC,GACC,CACN,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,iBAAiB,GAAG,cAAc,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAAE,SAAS,CAAC,CAAC;AAElF,OAAO,EAAE,iBAAiB,IAAI,gBAAgB,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { Children, type CSSProperties, type ForwardedRef, type ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\nimport { StepContext } from './context.js';\n\nexport interface UNSTABLE_StepperProps extends CommonProps {\n /** The steps to display in the stepper. /\n children: ReactNode;\n /* The index of the active step. /\n currentStep?: number;\n /* The callback to call when the current step changes. /\n onChange?: (step: number) => void;\n /* The orientation of the stepper.\n \n @default 'horizontal'\n /\n orientation?: 'vertical' \| 'horizontal';\n}\n\nfunction UNSTABLE_Stepper(\n {\n children,\n currentStep,\n onChange,\n orientation = 'horizontal',\n UNSAFE_className,\n UNSAFE_style,\n ...props\n }: UNSTABLE_StepperProps,\n ref: ForwardedRef<HTMLOListElement>,\n) {\n const stepCount = Children.count(children);\n\n return (\n <ol\n {...props}\n ref={ref}\n className={clsx('cim-stepper', UNSAFE_className)}\n style={{ ...UNSAFE_style, '--cim-stepper-step-count': stepCount } as CSSProperties}\n data-orientation={orientation}\n >\n {Children.map(children, (child, stepIndex) => {\n const isLast = stepIndex === stepCount - 1;\n\n return (\n <>\n <StepContext.Provider\n value={{\n orientation,\n stepCount: Children.count(children),\n currentStep: currentStep ?? -1,\n stepIndex,\n onChange:\n onChange &&\n (() => {\n onChange(stepIndex);\n }),\n }}\n >\n {child}\n </StepContext.Provider>\n {!isLast && orientation === 'horizontal' && <div className=\"cim-stepper-item-tail\" />}\n </>\n );\n })}\n </ol>\n );\n}\n\n/\n Displays a series of steps in a process.\n */\nconst _UNSTABLE_Stepper = withStyleProps(forwardRef(UNSTABLE_Stepper), 'Stepper');\n\nexport { _UNSTABLE_Stepper as UNSTABLE_Stepper };\n"]}

package/dist/esm/components/tabs/tabs.d.ts CHANGED Viewed

@@ -19,7 +19,9 @@ export declare function TabList<T extends CollectionItem>({ children, ...props }
 export declare namespace TabList {
     var displayName: string;
 }
-export interface TabProps extends Pick<RACTabProps, 'id' | 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {
+export interface TabProps extends Pick<RACTabProps, 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {
+    /** The unique ID of the tab. */
+    id?: Key;
     /** The text to display as the tab title. */
     children: StringLikeChildren;
     /** An icon displayed before the tab title. */

package/dist/esm/components/tabs/tabs.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAgD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACrF,OAAO,EAML,KAAK,SAAS,IAAI,YAAY,EAC9B,KAAK,QAAQ,IAAI,WAAW,EAC7B,MAAM,uBAAuB,CAAC;AAI/B,OAAO,KAAK,EACV,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,WAAW,EACX,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AASrB,MAAM,WAAW,SACf,SAAQ,WAAW,EACjB,iBAAiB,EACjB,IAAI,CAAC,YAAY,EAAE,aAAa,GAAG,oBAAoB,GAAG,cAAc,GAAG,mBAAmB,CAAC;IACjG,mGAAmG;IACnG,QAAQ,EAAE,SAAS,CAAC;CACrB;AAgDD;;;;GAIG;AACH,QAAA,MAAM,KAAK,2JAA2C,CAAC;AAEvD,OAAO,EAAE,KAAK,IAAI,IAAI,EAAE,CAAC;AAEzB,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;CAAG;AAErF,8DAA8D;AAC9D,wBAAgB,OAAO,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC,2CAqBxF;yBArBe,OAAO;;;AAyBvB,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,WAAW,EAAE,~~IAAI,GAAG,~~YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;~~IACtG~~,4CAA4C;IAC5C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,8CAA8C;IAC9C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,6CAA6C;AAC7C,wBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,2CAUrE;yBAVe,GAAG;;;AAcnB,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;CAAG;AAEvF,mEAAmE;AACnE,wBAAgB,SAAS,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,CAAC,CAAC,2CAElF;yBAFe,SAAS;;;AAMzB,MAAM,WAAW,aAAa;IAC5B,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,2CAA2C;IAC3C,EAAE,CAAC,EAAE,GAAG,CAAC;CACV;AAED,qDAAqD;AACrD,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAM7D;yBANe,QAAQ"}
1	+ {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAgD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACrF,OAAO,EAML,KAAK,SAAS,IAAI,YAAY,EAC9B,KAAK,QAAQ,IAAI,WAAW,EAC7B,MAAM,uBAAuB,CAAC;AAI/B,OAAO,KAAK,EACV,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,WAAW,EACX,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AASrB,MAAM,WAAW,SACf,SAAQ,WAAW,EACjB,iBAAiB,EACjB,IAAI,CAAC,YAAY,EAAE,aAAa,GAAG,oBAAoB,GAAG,cAAc,GAAG,mBAAmB,CAAC;IACjG,mGAAmG;IACnG,QAAQ,EAAE,SAAS,CAAC;CACrB;AAgDD;;;;GAIG;AACH,QAAA,MAAM,KAAK,2JAA2C,CAAC;AAEvD,OAAO,EAAE,KAAK,IAAI,IAAI,EAAE,CAAC;AAEzB,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;CAAG;AAErF,8DAA8D;AAC9D,wBAAgB,OAAO,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC,2CAqBxF;yBArBe,OAAO;;;AAyBvB,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,WAAW,EAAE,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;IAC/F,gCAAgC;IAChC,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,4CAA4C;IAC5C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,8CAA8C;IAC9C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,6CAA6C;AAC7C,wBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,2CAUrE;yBAVe,GAAG;;;AAcnB,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;CAAG;AAEvF,mEAAmE;AACnE,wBAAgB,SAAS,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,CAAC,CAAC,2CAElF;yBAFe,SAAS;;;AAMzB,MAAM,WAAW,aAAa;IAC5B,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,2CAA2C;IAC3C,EAAE,CAAC,EAAE,GAAG,CAAC;CACV;AAED,qDAAqD;AACrD,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAM7D;yBANe,QAAQ"}