@raystack/apsara 0.54.0 → 0.55.0-rc.4

package/dist/components/dropdown-menu/dropdown-menu-trigger.js

@@ -1,15 +1,15 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { MenuButton } from '../../node_modules/.pnpm/@ariakit_react-core@0.4.16_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ariakit/react-core/esm/menu/menu-button.js';
+import { MenuButton } from '@ariakit/react';
+import { Slot } from 'radix-ui';
 import { forwardRef } from 'react';
 import { ReactComponent as SvgTriangleRight } from '../../icons/assets/triangle-right.svg.js';
 import { DropdownMenuItem } from './dropdown-menu-item.js';
 import { useDropdownContext } from './dropdown-menu-root.js';
 import { getMatch } from './utils.js';
-import { Root as Slot } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.9_react@19.2.1/node_modules/@radix-ui/react-slot/dist/index.js';
 
 const DropdownMenuTrigger = forwardRef(({ children, asChild, stopPropagation = true, onClick, ...props }, ref) => {
-    return (jsx(MenuButton, { ref: ref, render: asChild ? jsx(Slot, {}) : undefined, onClick: (e) => {
+    return (jsx(MenuButton, { ref: ref, render: asChild ? jsx(Slot.Root, {}) : undefined, onClick: (e) => {
             if (stopPropagation)
                 e.stopPropagation();
             onClick?.(e);

package/dist/components/empty-state/empty-state.cjs

@@ -1,16 +1,16 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var flex = require('../flex/flex.cjs');
 var text = require('../text/text.cjs');
 var emptyState_module = require('./empty-state.module.css.cjs');
 
 const EmptyState = ({ icon, heading, subHeading, primaryAction, secondaryAction, classNames, variant = 'empty1' }) => {
     if (variant === 'empty2') {
-        return (jsxRuntime.jsx(flex.Flex, { align: 'center', justify: 'center', className: emptyState_module.default.emptyStatePage, children: jsxRuntime.jsxs(flex.Flex, { direction: 'column', align: 'start', gap: 'medium', className: index.cx(emptyState_module.default.emptyStateContent, classNames?.container), children: [jsxRuntime.jsx("div", { className: index.cx(emptyState_module.default.iconContainer, classNames?.iconContainer), children: jsxRuntime.jsx("div", { className: index.cx(emptyState_module.default.icon, emptyState_module.default.iconLarge, classNames?.icon), children: icon }) }), heading && (jsxRuntime.jsx(text.Text, { size: 5, weight: 500, className: index.cx(emptyState_module.default.headerText, classNames?.heading), children: heading })), subHeading && (jsxRuntime.jsx(text.Text, { size: 4, weight: 400, className: index.cx(emptyState_module.default.subHeaderText, classNames?.subHeading), children: subHeading })), jsxRuntime.jsxs(flex.Flex, { gap: 'medium', children: [primaryAction, secondaryAction] })] }) }));
+        return (jsxRuntime.jsx(flex.Flex, { align: 'center', justify: 'center', className: emptyState_module.default.emptyStatePage, children: jsxRuntime.jsxs(flex.Flex, { direction: 'column', align: 'start', gap: 'medium', className: classVarianceAuthority.cx(emptyState_module.default.emptyStateContent, classNames?.container), children: [jsxRuntime.jsx("div", { className: classVarianceAuthority.cx(emptyState_module.default.iconContainer, classNames?.iconContainer), children: jsxRuntime.jsx("div", { className: classVarianceAuthority.cx(emptyState_module.default.icon, emptyState_module.default.iconLarge, classNames?.icon), children: icon }) }), heading && (jsxRuntime.jsx(text.Text, { size: 5, weight: 500, className: classVarianceAuthority.cx(emptyState_module.default.headerText, classNames?.heading), children: heading })), subHeading && (jsxRuntime.jsx(text.Text, { size: 4, weight: 400, className: classVarianceAuthority.cx(emptyState_module.default.subHeaderText, classNames?.subHeading), children: subHeading })), jsxRuntime.jsxs(flex.Flex, { gap: 'medium', children: [primaryAction, secondaryAction] })] }) }));
     }
-    return (jsxRuntime.jsxs(flex.Flex, { direction: 'column', align: 'center', gap: 'medium', className: index.cx(emptyState_module.default.emptyState, classNames?.container), children: [jsxRuntime.jsx("div", { className: index.cx(emptyState_module.default.iconContainer, classNames?.iconContainer), children: jsxRuntime.jsx("div", { className: index.cx(emptyState_module.default.icon, classNames?.icon), children: icon }) }), jsxRuntime.jsxs(flex.Flex, { direction: 'column', gap: 'small', align: 'center', children: [heading && (jsxRuntime.jsx(text.Text, { size: 5, weight: 500, className: index.cx(emptyState_module.default.headerText, classNames?.heading), children: heading })), subHeading && (jsxRuntime.jsx(text.Text, { size: 4, weight: 400, className: index.cx(emptyState_module.default.subHeaderText, classNames?.subHeading), children: subHeading }))] }), primaryAction, secondaryAction] }));
+    return (jsxRuntime.jsxs(flex.Flex, { direction: 'column', align: 'center', gap: 'medium', className: classVarianceAuthority.cx(emptyState_module.default.emptyState, classNames?.container), children: [jsxRuntime.jsx("div", { className: classVarianceAuthority.cx(emptyState_module.default.iconContainer, classNames?.iconContainer), children: jsxRuntime.jsx("div", { className: classVarianceAuthority.cx(emptyState_module.default.icon, classNames?.icon), children: icon }) }), jsxRuntime.jsxs(flex.Flex, { direction: 'column', gap: 'small', align: 'center', children: [heading && (jsxRuntime.jsx(text.Text, { size: 5, weight: 500, className: classVarianceAuthority.cx(emptyState_module.default.headerText, classNames?.heading), children: heading })), subHeading && (jsxRuntime.jsx(text.Text, { size: 4, weight: 400, className: classVarianceAuthority.cx(emptyState_module.default.subHeaderText, classNames?.subHeading), children: subHeading }))] }), primaryAction, secondaryAction] }));
 };
 
 exports.EmptyState = EmptyState;

package/dist/components/empty-state/empty-state.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty-state.cjs","sources":["../../../components/empty-state/empty-state.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { Flex } from '../flex';\nimport { Text } from '../text';\nimport styles from './empty-state.module.css';\n\ntype classNameKeys =\n  | 'container'\n  | 'iconContainer'\n  | 'icon'\n  | 'heading'\n  | 'subHeading';\n\ninterface EmptyStateProps {\n  icon: React.ReactNode;\n  heading?: React.ReactNode;\n  subHeading?: React.ReactNode;\n  primaryAction?: React.ReactNode;\n  secondaryAction?: React.ReactNode;\n  classNames?: Partial<Record<classNameKeys, string>>;\n  variant?: 'empty1' | 'empty2';\n}\n\nexport const EmptyState = ({\n  icon,\n  heading,\n  subHeading,\n  primaryAction,\n  secondaryAction,\n  classNames,\n  variant = 'empty1'\n}: EmptyStateProps) => {\n  if (variant === 'empty2') {\n    return (\n      <Flex align='center' justify='center' className={styles.emptyStatePage}>\n        <Flex\n          direction='column'\n          align='start'\n          gap='medium'\n          className={cx(styles.emptyStateContent, classNames?.container)}\n        >\n          <div className={cx(styles.iconContainer, classNames?.iconContainer)}>\n            <div\n              className={cx(styles.icon, styles.iconLarge, classNames?.icon)}\n            >\n              {icon}\n            </div>\n          </div>\n\n          {heading && (\n            <Text\n              size={5}\n              weight={500}\n              className={cx(styles.headerText, classNames?.heading)}\n            >\n              {heading}\n            </Text>\n          )}\n\n          {subHeading && (\n            <Text\n              size={4}\n              weight={400}\n              className={cx(styles.subHeaderText, classNames?.subHeading)}\n            >\n              {subHeading}\n            </Text>\n          )}\n\n          <Flex gap='medium'>\n            {primaryAction}\n            {secondaryAction}\n          </Flex>\n        </Flex>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex\n      direction='column'\n      align='center'\n      gap='medium'\n      className={cx(styles.emptyState, classNames?.container)}\n    >\n      <div className={cx(styles.iconContainer, classNames?.iconContainer)}>\n        <div className={cx(styles.icon, classNames?.icon)}>{icon}</div>\n      </div>\n\n      <Flex direction='column' gap='small' align='center'>\n        {heading && (\n          <Text\n            size={5}\n            weight={500}\n            className={cx(styles.headerText, classNames?.heading)}\n          >\n            {heading}\n          </Text>\n        )}\n\n        {subHeading && (\n          <Text\n            size={4}\n            weight={400}\n            className={cx(styles.subHeaderText, classNames?.subHeading)}\n          >\n            {subHeading}\n          </Text>\n        )}\n      </Flex>\n\n      {primaryAction}\n\n      {secondaryAction}\n    </Flex>\n  );\n};\n"],"names":["_jsx","Flex","styles","_jsxs","cx","Text"],"mappings":"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"}
+{"version":3,"file":"empty-state.cjs","sources":["../../../components/empty-state/empty-state.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { Flex } from '../flex';\nimport { Text } from '../text';\nimport styles from './empty-state.module.css';\n\ntype classNameKeys =\n  | 'container'\n  | 'iconContainer'\n  | 'icon'\n  | 'heading'\n  | 'subHeading';\n\ninterface EmptyStateProps {\n  icon: React.ReactNode;\n  heading?: React.ReactNode;\n  subHeading?: React.ReactNode;\n  primaryAction?: React.ReactNode;\n  secondaryAction?: React.ReactNode;\n  classNames?: Partial<Record<classNameKeys, string>>;\n  variant?: 'empty1' | 'empty2';\n}\n\nexport const EmptyState = ({\n  icon,\n  heading,\n  subHeading,\n  primaryAction,\n  secondaryAction,\n  classNames,\n  variant = 'empty1'\n}: EmptyStateProps) => {\n  if (variant === 'empty2') {\n    return (\n      <Flex align='center' justify='center' className={styles.emptyStatePage}>\n        <Flex\n          direction='column'\n          align='start'\n          gap='medium'\n          className={cx(styles.emptyStateContent, classNames?.container)}\n        >\n          <div className={cx(styles.iconContainer, classNames?.iconContainer)}>\n            <div\n              className={cx(styles.icon, styles.iconLarge, classNames?.icon)}\n            >\n              {icon}\n            </div>\n          </div>\n\n          {heading && (\n            <Text\n              size={5}\n              weight={500}\n              className={cx(styles.headerText, classNames?.heading)}\n            >\n              {heading}\n            </Text>\n          )}\n\n          {subHeading && (\n            <Text\n              size={4}\n              weight={400}\n              className={cx(styles.subHeaderText, classNames?.subHeading)}\n            >\n              {subHeading}\n            </Text>\n          )}\n\n          <Flex gap='medium'>\n            {primaryAction}\n            {secondaryAction}\n          </Flex>\n        </Flex>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex\n      direction='column'\n      align='center'\n      gap='medium'\n      className={cx(styles.emptyState, classNames?.container)}\n    >\n      <div className={cx(styles.iconContainer, classNames?.iconContainer)}>\n        <div className={cx(styles.icon, classNames?.icon)}>{icon}</div>\n      </div>\n\n      <Flex direction='column' gap='small' align='center'>\n        {heading && (\n          <Text\n            size={5}\n            weight={500}\n            className={cx(styles.headerText, classNames?.heading)}\n          >\n            {heading}\n          </Text>\n        )}\n\n        {subHeading && (\n          <Text\n            size={4}\n            weight={400}\n            className={cx(styles.subHeaderText, classNames?.subHeading)}\n          >\n            {subHeading}\n          </Text>\n        )}\n      </Flex>\n\n      {primaryAction}\n\n      {secondaryAction}\n    </Flex>\n  );\n};\n"],"names":["_jsx","Flex","styles","_jsxs","cx","Text"],"mappings":";;;;;;;;MAsBa,UAAU,GAAG,CAAC,EACzB,IAAI,EACJ,OAAO,EACP,UAAU,EACV,aAAa,EACb,eAAe,EACf,UAAU,EACV,OAAO,GAAG,QAAQ,EACF,KAAI;AACpB,IAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;AACxB,QAAA,QACEA,cAAC,CAAAC,SAAI,EAAC,EAAA,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,EAAC,SAAS,EAAEC,yBAAM,CAAC,cAAc,EAAA,QAAA,EACpEC,eAAC,CAAAF,SAAI,IACH,SAAS,EAAC,QAAQ,EAClB,KAAK,EAAC,OAAO,EACb,GAAG,EAAC,QAAQ,EACZ,SAAS,EAAEG,yBAAE,CAACF,yBAAM,CAAC,iBAAiB,EAAE,UAAU,EAAE,SAAS,CAAC,aAE9DF,cAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEI,yBAAE,CAACF,yBAAM,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,EAAA,QAAA,EACjEF,wBACE,SAAS,EAAEI,yBAAE,CAACF,yBAAM,CAAC,IAAI,EAAEA,yBAAM,CAAC,SAAS,EAAE,UAAU,EAAE,IAAI,CAAC,EAE7D,QAAA,EAAA,IAAI,EACD,CAAA,EAAA,CACF,EAEL,OAAO,KACNF,cAAA,CAACK,SAAI,EACH,EAAA,IAAI,EAAE,CAAC,EACP,MAAM,EAAE,GAAG,EACX,SAAS,EAAED,yBAAE,CAACF,yBAAM,CAAC,UAAU,EAAE,UAAU,EAAE,OAAO,CAAC,EAAA,QAAA,EAEpD,OAAO,EAAA,CACH,CACR,EAEA,UAAU,KACTF,eAACK,SAAI,EAAA,EACH,IAAI,EAAE,CAAC,EACP,MAAM,EAAE,GAAG,EACX,SAAS,EAAED,yBAAE,CAACF,yBAAM,CAAC,aAAa,EAAE,UAAU,EAAE,UAAU,CAAC,EAE1D,QAAA,EAAA,UAAU,GACN,CACR,EAEDC,eAAC,CAAAF,SAAI,IAAC,GAAG,EAAC,QAAQ,EAAA,QAAA,EAAA,CACf,aAAa,EACb,eAAe,IACX,CACF,EAAA,CAAA,EAAA,CACF,EACP;KACH;AAED,IAAA,QACEE,eAAA,CAACF,SAAI,EAAA,EACH,SAAS,EAAC,QAAQ,EAClB,KAAK,EAAC,QAAQ,EACd,GAAG,EAAC,QAAQ,EACZ,SAAS,EAAEG,yBAAE,CAACF,yBAAM,CAAC,UAAU,EAAE,UAAU,EAAE,SAAS,CAAC,EAEvD,QAAA,EAAA,CAAAF,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEI,yBAAE,CAACF,yBAAM,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,EACjE,QAAA,EAAAF,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEI,yBAAE,CAACF,yBAAM,CAAC,IAAI,EAAE,UAAU,EAAE,IAAI,CAAC,EAAA,QAAA,EAAG,IAAI,EAAA,CAAO,GAC3D,EAENC,eAAA,CAACF,SAAI,EAAA,EAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAC,QAAQ,EAAA,QAAA,EAAA,CAChD,OAAO,KACND,cAAC,CAAAK,SAAI,EACH,EAAA,IAAI,EAAE,CAAC,EACP,MAAM,EAAE,GAAG,EACX,SAAS,EAAED,yBAAE,CAACF,yBAAM,CAAC,UAAU,EAAE,UAAU,EAAE,OAAO,CAAC,EAEpD,QAAA,EAAA,OAAO,EACH,CAAA,CACR,EAEA,UAAU,KACTF,cAAA,CAACK,SAAI,EAAA,EACH,IAAI,EAAE,CAAC,EACP,MAAM,EAAE,GAAG,EACX,SAAS,EAAED,yBAAE,CAACF,yBAAM,CAAC,aAAa,EAAE,UAAU,EAAE,UAAU,CAAC,YAE1D,UAAU,EAAA,CACN,CACR,CAAA,EAAA,CACI,EAEN,aAAa,EAEb,eAAe,CAAA,EAAA,CACX,EACP;AACJ;;;;"}

package/dist/components/empty-state/empty-state.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { cx } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { cx } from 'class-variance-authority';
 import { Flex } from '../flex/flex.js';
 import { Text } from '../text/text.js';
 import styles from './empty-state.module.css.js';

package/dist/components/filter-chip/filter-chip-operation.cjs

@@ -2,7 +2,7 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var React = require('react');
 var select = require('../select/select.cjs');
 var text = require('../text/text.cjs');
@@ -16,8 +16,8 @@ const Operation = ({ label, value, onChange, operations, showAlternateLabel = fa
             onChange(operation);
     }, [operations, onChange]);
     if (operations.length === 1)
-        return (jsxRuntime.jsx(text.Text, { variant: 'secondary', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), children: operations[0].label }));
-    return (jsxRuntime.jsxs(select.Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsx(select.Select.Trigger, { variant: 'text', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), "aria-label": `${label} filter operation`, iconProps: {
+        return (jsxRuntime.jsx(text.Text, { variant: 'secondary', className: classVarianceAuthority.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), children: operations[0].label }));
+    return (jsxRuntime.jsxs(select.Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsx(select.Select.Trigger, { variant: 'text', className: classVarianceAuthority.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), "aria-label": `${label} filter operation`, iconProps: {
                     style: {
                         display: 'none'
                     }

package/dist/components/filter-chip/filter-chip-operation.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { cx } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { cx } from 'class-variance-authority';
 import { useCallback } from 'react';
 import { Select } from '../select/select.js';
 import { Text } from '../text/text.js';

package/dist/components/filter-chip/filter-chip.cjs

@@ -2,24 +2,22 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var reactIcons_esm = require('../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.2.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var reactIcons = require('@radix-ui/react-icons');
+var classVarianceAuthority = require('class-variance-authority');
 var React = require('react');
 var filters = require('../../types/filters.cjs');
-var flex = require('../flex/flex.cjs');
-require('../icon-button/icon-button.cjs');
-var select = require('../select/select.cjs');
-require('../skeleton/skeleton.cjs');
-require('../tooltip/tooltip.cjs');
+require('../calendar/calendar.cjs');
 var datePicker = require('../calendar/date-picker.cjs');
-require('../../node_modules/.pnpm/dayjs@1.11.11/node_modules/dayjs/dayjs.min.cjs');
+require('dayjs');
+var flex = require('../flex/flex.cjs');
 var inputField = require('../input-field/input-field.cjs');
 require('../popover/popover.cjs');
+var select = require('../select/select.cjs');
 var text = require('../text/text.cjs');
 var filterChipOperation = require('./filter-chip-operation.cjs');
 var filterChip_module = require('./filter-chip.module.css.cjs');
 
-const chip = index.cva(filterChip_module.default.chip, {
+const chip = classVarianceAuthority.cva(filterChip_module.default.chip, {
     variants: {
         variant: {
             default: filterChip_module.default['chip-default'],
@@ -55,7 +53,7 @@ const FilterChip = ({ label, value, onRemove, className, ref, columnType = filte
                                 style: {
                                     display: 'none'
                                 }
-                            }, variant: 'text', className: index.cx(filterChip_module.default.selectValue, !showOnRemove && filterChip_module.default.selectColumn), children: jsxRuntime.jsx(select.Select.Value, { placeholder: 'Select value', children: isMultiSelectColumn && filterValue.length > 1
+                            }, variant: 'text', className: classVarianceAuthority.cx(filterChip_module.default.selectValue, !showOnRemove && filterChip_module.default.selectColumn), children: jsxRuntime.jsx(select.Select.Value, { placeholder: 'Select value', children: isMultiSelectColumn && filterValue.length > 1
                                     ? `${filterValue.length} selected`
                                     : undefined }) }), jsxRuntime.jsx(select.Select.Content, { "data-variant": 'filter', children: options.map(opt => (jsxRuntime.jsx(select.Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
             case filters.FilterType.date:
@@ -64,7 +62,7 @@ const FilterChip = ({ label, value, onRemove, className, ref, columnType = filte
                 return (jsxRuntime.jsx("div", { className: filterChip_module.default.inputFieldWrapper, children: jsxRuntime.jsx(inputField.InputField, { variant: variant === 'text' ? 'borderless' : 'default', className: filterChip_module.default.inputField, value: filterValue, onChange: e => handleFilterValueChange(e.target.value) }) }));
         }
     };
-    return (jsxRuntime.jsxs(flex.Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, "data-variant": variant, ...props, children: [jsxRuntime.jsxs(flex.Flex, { align: 'center', gap: 2, className: filterChip_module.default['chip-label'], children: [leadingIcon && (jsxRuntime.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntime.jsx(text.Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntime.jsx(filterChipOperation.Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange, showAlternateLabel: isMultiSelectColumn && filterValue.length <= 1 }), renderValueInput(), showOnRemove && (jsxRuntime.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsx(reactIcons_esm.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }));
+    return (jsxRuntime.jsxs(flex.Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, "data-variant": variant, ...props, children: [jsxRuntime.jsxs(flex.Flex, { align: 'center', gap: 2, className: filterChip_module.default['chip-label'], children: [leadingIcon && (jsxRuntime.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntime.jsx(text.Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntime.jsx(filterChipOperation.Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange, showAlternateLabel: isMultiSelectColumn && filterValue.length <= 1 }), renderValueInput(), showOnRemove && (jsxRuntime.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsx(reactIcons.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }));
 };
 FilterChip.displayName = 'FilterChip';
 

package/dist/components/filter-chip/filter-chip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter-chip.cjs","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["'use client';\n\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n  FilterOperation,\n  FilterOperator,\n  FilterSelectOption,\n  FilterType,\n  FilterTypes,\n  filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { InputField } from '../input-field';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n  variants: {\n    variant: {\n      default: styles['chip-default'],\n      text: null\n    }\n  },\n  defaultVariants: {\n    variant: 'default'\n  }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n  label: string;\n  value?: string;\n  onRemove?: () => void;\n  className?: string;\n  ref?: React.RefObject<HTMLDivElement>;\n  children?: ReactNode;\n  columnType?: FilterTypes;\n  options?: FilterSelectOption[];\n  onValueChange?: (value: any, operation: string) => void;\n  onOperationChange?: (operation: string) => void;\n  leadingIcon?: ReactElement;\n  operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n  label,\n  value,\n  onRemove,\n  className,\n  ref,\n  columnType = FilterType.string,\n  options = [],\n  onValueChange,\n  onOperationChange,\n  leadingIcon,\n  variant,\n  operations,\n  ...props\n}: FilterChipProps) => {\n  const computedOperations = operations?.length\n    ? operations\n    : filterOperators[columnType];\n\n  const [operation, setOperation] = useState<FilterOperation | undefined>(\n    computedOperations?.[0]\n  );\n  const [filterValue, setFilterValue] = useState<any>(value || '');\n\n  const showOnRemove = typeof onRemove === 'function';\n  const isMultiSelectColumn = columnType === FilterType.multiselect;\n\n  const handleOperationChange = useCallback(\n    (operation: FilterOperation) => {\n      setOperation(operation);\n      if (operation?.value) onOperationChange?.(operation.value);\n    },\n    [onOperationChange]\n  );\n\n  const handleFilterValueChange = useCallback(\n    (value: any) => {\n      setFilterValue(value);\n      onValueChange?.(value, operation?.value ?? '');\n    },\n    [operation, onValueChange]\n  );\n\n  const renderValueInput = () => {\n    switch (columnType) {\n      case FilterType.multiselect:\n      case FilterType.select:\n        return (\n          <Select\n            value={isMultiSelectColumn ? filterValue : filterValue.toString()}\n            onValueChange={handleFilterValueChange}\n            multiple={isMultiSelectColumn}\n          >\n            <Select.Trigger\n              iconProps={{\n                style: {\n                  display: 'none'\n                }\n              }}\n              variant='text'\n              className={cx(\n                styles.selectValue,\n                !showOnRemove && styles.selectColumn\n              )}\n            >\n              <Select.Value placeholder='Select value'>\n                {isMultiSelectColumn && filterValue.length > 1\n                  ? `${filterValue.length} selected`\n                  : undefined}\n              </Select.Value>\n            </Select.Trigger>\n            <Select.Content data-variant='filter'>\n              {options.map(opt => (\n                <Select.Item\n                  key={opt.value.toString()}\n                  value={opt.value.toString()}\n                >\n                  {opt.label}\n                </Select.Item>\n              ))}\n            </Select.Content>\n          </Select>\n        );\n      case FilterType.date:\n        return (\n          <div className={styles.dateFieldWrapper}>\n            <DatePicker\n              value={filterValue}\n              onSelect={date => handleFilterValueChange(date)}\n              showCalendarIcon={false}\n              inputFieldProps={{ className: styles.dateField }}\n            />\n          </div>\n        );\n      default:\n        return (\n          <div className={styles.inputFieldWrapper}>\n            <InputField\n              variant={variant === 'text' ? 'borderless' : 'default'}\n              className={styles.inputField}\n              value={filterValue}\n              onChange={e => handleFilterValueChange(e.target.value)}\n            />\n          </div>\n        );\n    }\n  };\n\n  return (\n    <Flex\n      align='center'\n      ref={ref}\n      className={chip({ variant, className })}\n      role='group'\n      aria-label={`Filter by ${label}`}\n      data-variant={variant}\n      {...props}\n    >\n      <Flex align='center' gap={2} className={styles['chip-label']}>\n        {leadingIcon && (\n          <span className={styles.leadingIcon} aria-hidden='true'>\n            {leadingIcon}\n          </span>\n        )}\n        <Text size={2} weight='normal'>\n          {label}\n        </Text>\n      </Flex>\n      <Operation\n        operations={computedOperations}\n        label={label}\n        value={operation}\n        onChange={handleOperationChange}\n        showAlternateLabel={isMultiSelectColumn && filterValue.length <= 1}\n      />\n      {renderValueInput()}\n      {showOnRemove && (\n        <button\n          className={styles.removeIconContainer}\n          aria-label={`Remove ${label} filter`}\n          onClick={onRemove}\n        >\n          <Cross1Icon className={styles.removeIcon} />\n        </button>\n      )}\n    </Flex>\n  );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AAiBY;AAeX;AACE;AACA;AAEF;AAGA;AAEA;AACA;AAEA;;;AAG0B;AACxB;AAIF;;;AAIE;;;;;AAQI;AAQQ;AACE;AACD;AACF;AASG;;;AAiBV;AAUF;;;AAYJ;AAEA;AAuCF;AAEA;;"}
+{"version":3,"file":"filter-chip.cjs","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["'use client';\n\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n  FilterOperation,\n  FilterOperator,\n  FilterSelectOption,\n  FilterType,\n  FilterTypes,\n  filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { InputField } from '../input-field';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n  variants: {\n    variant: {\n      default: styles['chip-default'],\n      text: null\n    }\n  },\n  defaultVariants: {\n    variant: 'default'\n  }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n  label: string;\n  value?: string;\n  onRemove?: () => void;\n  className?: string;\n  ref?: React.RefObject<HTMLDivElement>;\n  children?: ReactNode;\n  columnType?: FilterTypes;\n  options?: FilterSelectOption[];\n  onValueChange?: (value: any, operation: string) => void;\n  onOperationChange?: (operation: string) => void;\n  leadingIcon?: ReactElement;\n  operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n  label,\n  value,\n  onRemove,\n  className,\n  ref,\n  columnType = FilterType.string,\n  options = [],\n  onValueChange,\n  onOperationChange,\n  leadingIcon,\n  variant,\n  operations,\n  ...props\n}: FilterChipProps) => {\n  const computedOperations = operations?.length\n    ? operations\n    : filterOperators[columnType];\n\n  const [operation, setOperation] = useState<FilterOperation | undefined>(\n    computedOperations?.[0]\n  );\n  const [filterValue, setFilterValue] = useState<any>(value || '');\n\n  const showOnRemove = typeof onRemove === 'function';\n  const isMultiSelectColumn = columnType === FilterType.multiselect;\n\n  const handleOperationChange = useCallback(\n    (operation: FilterOperation) => {\n      setOperation(operation);\n      if (operation?.value) onOperationChange?.(operation.value);\n    },\n    [onOperationChange]\n  );\n\n  const handleFilterValueChange = useCallback(\n    (value: any) => {\n      setFilterValue(value);\n      onValueChange?.(value, operation?.value ?? '');\n    },\n    [operation, onValueChange]\n  );\n\n  const renderValueInput = () => {\n    switch (columnType) {\n      case FilterType.multiselect:\n      case FilterType.select:\n        return (\n          <Select\n            value={isMultiSelectColumn ? filterValue : filterValue.toString()}\n            onValueChange={handleFilterValueChange}\n            multiple={isMultiSelectColumn}\n          >\n            <Select.Trigger\n              iconProps={{\n                style: {\n                  display: 'none'\n                }\n              }}\n              variant='text'\n              className={cx(\n                styles.selectValue,\n                !showOnRemove && styles.selectColumn\n              )}\n            >\n              <Select.Value placeholder='Select value'>\n                {isMultiSelectColumn && filterValue.length > 1\n                  ? `${filterValue.length} selected`\n                  : undefined}\n              </Select.Value>\n            </Select.Trigger>\n            <Select.Content data-variant='filter'>\n              {options.map(opt => (\n                <Select.Item\n                  key={opt.value.toString()}\n                  value={opt.value.toString()}\n                >\n                  {opt.label}\n                </Select.Item>\n              ))}\n            </Select.Content>\n          </Select>\n        );\n      case FilterType.date:\n        return (\n          <div className={styles.dateFieldWrapper}>\n            <DatePicker\n              value={filterValue}\n              onSelect={date => handleFilterValueChange(date)}\n              showCalendarIcon={false}\n              inputFieldProps={{ className: styles.dateField }}\n            />\n          </div>\n        );\n      default:\n        return (\n          <div className={styles.inputFieldWrapper}>\n            <InputField\n              variant={variant === 'text' ? 'borderless' : 'default'}\n              className={styles.inputField}\n              value={filterValue}\n              onChange={e => handleFilterValueChange(e.target.value)}\n            />\n          </div>\n        );\n    }\n  };\n\n  return (\n    <Flex\n      align='center'\n      ref={ref}\n      className={chip({ variant, className })}\n      role='group'\n      aria-label={`Filter by ${label}`}\n      data-variant={variant}\n      {...props}\n    >\n      <Flex align='center' gap={2} className={styles['chip-label']}>\n        {leadingIcon && (\n          <span className={styles.leadingIcon} aria-hidden='true'>\n            {leadingIcon}\n          </span>\n        )}\n        <Text size={2} weight='normal'>\n          {label}\n        </Text>\n      </Flex>\n      <Operation\n        operations={computedOperations}\n        label={label}\n        value={operation}\n        onChange={handleOperationChange}\n        showAlternateLabel={isMultiSelectColumn && filterValue.length <= 1}\n      />\n      {renderValueInput()}\n      {showOnRemove && (\n        <button\n          className={styles.removeIconContainer}\n          aria-label={`Remove ${label} filter`}\n          onClick={onRemove}\n        >\n          <Cross1Icon className={styles.removeIcon} />\n        </button>\n      )}\n    </Flex>\n  );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AAiBY;AAeX;AACE;AACA;AAEF;AAGA;AAEA;AACA;AAEA;;;AAG0B;AACxB;AAIF;;;AAIE;;;;;AAQI;AAQQ;AACE;AACD;AACF;AASG;;;AAiBV;AAUF;;;AAYJ;AAEA;AAuCF;AAEA;;"}

package/dist/components/filter-chip/filter-chip.js

@@ -1,18 +1,16 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Cross1Icon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.2.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
-import { cva, cx } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { Cross1Icon } from '@radix-ui/react-icons';
+import { cva, cx } from 'class-variance-authority';
 import { useState, useCallback } from 'react';
 import { filterOperators, FilterType } from '../../types/filters.js';
-import { Flex } from '../flex/flex.js';
-import '../icon-button/icon-button.js';
-import { Select } from '../select/select.js';
-import '../skeleton/skeleton.js';
-import '../tooltip/tooltip.js';
+import '../calendar/calendar.js';
 import { DatePicker } from '../calendar/date-picker.js';
-import '../../node_modules/.pnpm/dayjs@1.11.11/node_modules/dayjs/dayjs.min.js';
+import 'dayjs';
+import { Flex } from '../flex/flex.js';
 import { InputField } from '../input-field/input-field.js';
 import '../popover/popover.js';
+import { Select } from '../select/select.js';
 import { Text } from '../text/text.js';
 import { Operation } from './filter-chip-operation.js';
 import styles from './filter-chip.module.css.js';

package/dist/components/filter-chip/filter-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-chip.js","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["'use client';\n\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n  FilterOperation,\n  FilterOperator,\n  FilterSelectOption,\n  FilterType,\n  FilterTypes,\n  filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { InputField } from '../input-field';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n  variants: {\n    variant: {\n      default: styles['chip-default'],\n      text: null\n    }\n  },\n  defaultVariants: {\n    variant: 'default'\n  }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n  label: string;\n  value?: string;\n  onRemove?: () => void;\n  className?: string;\n  ref?: React.RefObject<HTMLDivElement>;\n  children?: ReactNode;\n  columnType?: FilterTypes;\n  options?: FilterSelectOption[];\n  onValueChange?: (value: any, operation: string) => void;\n  onOperationChange?: (operation: string) => void;\n  leadingIcon?: ReactElement;\n  operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n  label,\n  value,\n  onRemove,\n  className,\n  ref,\n  columnType = FilterType.string,\n  options = [],\n  onValueChange,\n  onOperationChange,\n  leadingIcon,\n  variant,\n  operations,\n  ...props\n}: FilterChipProps) => {\n  const computedOperations = operations?.length\n    ? operations\n    : filterOperators[columnType];\n\n  const [operation, setOperation] = useState<FilterOperation | undefined>(\n    computedOperations?.[0]\n  );\n  const [filterValue, setFilterValue] = useState<any>(value || '');\n\n  const showOnRemove = typeof onRemove === 'function';\n  const isMultiSelectColumn = columnType === FilterType.multiselect;\n\n  const handleOperationChange = useCallback(\n    (operation: FilterOperation) => {\n      setOperation(operation);\n      if (operation?.value) onOperationChange?.(operation.value);\n    },\n    [onOperationChange]\n  );\n\n  const handleFilterValueChange = useCallback(\n    (value: any) => {\n      setFilterValue(value);\n      onValueChange?.(value, operation?.value ?? '');\n    },\n    [operation, onValueChange]\n  );\n\n  const renderValueInput = () => {\n    switch (columnType) {\n      case FilterType.multiselect:\n      case FilterType.select:\n        return (\n          <Select\n            value={isMultiSelectColumn ? filterValue : filterValue.toString()}\n            onValueChange={handleFilterValueChange}\n            multiple={isMultiSelectColumn}\n          >\n            <Select.Trigger\n              iconProps={{\n                style: {\n                  display: 'none'\n                }\n              }}\n              variant='text'\n              className={cx(\n                styles.selectValue,\n                !showOnRemove && styles.selectColumn\n              )}\n            >\n              <Select.Value placeholder='Select value'>\n                {isMultiSelectColumn && filterValue.length > 1\n                  ? `${filterValue.length} selected`\n                  : undefined}\n              </Select.Value>\n            </Select.Trigger>\n            <Select.Content data-variant='filter'>\n              {options.map(opt => (\n                <Select.Item\n                  key={opt.value.toString()}\n                  value={opt.value.toString()}\n                >\n                  {opt.label}\n                </Select.Item>\n              ))}\n            </Select.Content>\n          </Select>\n        );\n      case FilterType.date:\n        return (\n          <div className={styles.dateFieldWrapper}>\n            <DatePicker\n              value={filterValue}\n              onSelect={date => handleFilterValueChange(date)}\n              showCalendarIcon={false}\n              inputFieldProps={{ className: styles.dateField }}\n            />\n          </div>\n        );\n      default:\n        return (\n          <div className={styles.inputFieldWrapper}>\n            <InputField\n              variant={variant === 'text' ? 'borderless' : 'default'}\n              className={styles.inputField}\n              value={filterValue}\n              onChange={e => handleFilterValueChange(e.target.value)}\n            />\n          </div>\n        );\n    }\n  };\n\n  return (\n    <Flex\n      align='center'\n      ref={ref}\n      className={chip({ variant, className })}\n      role='group'\n      aria-label={`Filter by ${label}`}\n      data-variant={variant}\n      {...props}\n    >\n      <Flex align='center' gap={2} className={styles['chip-label']}>\n        {leadingIcon && (\n          <span className={styles.leadingIcon} aria-hidden='true'>\n            {leadingIcon}\n          </span>\n        )}\n        <Text size={2} weight='normal'>\n          {label}\n        </Text>\n      </Flex>\n      <Operation\n        operations={computedOperations}\n        label={label}\n        value={operation}\n        onChange={handleOperationChange}\n        showAlternateLabel={isMultiSelectColumn && filterValue.length <= 1}\n      />\n      {renderValueInput()}\n      {showOnRemove && (\n        <button\n          className={styles.removeIconContainer}\n          aria-label={`Remove ${label} filter`}\n          onClick={onRemove}\n        >\n          <Cross1Icon className={styles.removeIcon} />\n        </button>\n      )}\n    </Flex>\n  );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AAiBY;AAeX;AACE;AACA;AAEF;AAGA;AAEA;AACA;AAEA;;;AAG0B;AACxB;AAIF;;;AAIE;;;;;AAQI;AAQQ;AACE;AACD;AACF;AASG;;;AAiBV;AAUF;;;AAYJ;AAEA;AAuCF;AAEA;;"}
+{"version":3,"file":"filter-chip.js","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["'use client';\n\nimport { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n  FilterOperation,\n  FilterOperator,\n  FilterSelectOption,\n  FilterType,\n  FilterTypes,\n  filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { InputField } from '../input-field';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n  variants: {\n    variant: {\n      default: styles['chip-default'],\n      text: null\n    }\n  },\n  defaultVariants: {\n    variant: 'default'\n  }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n  label: string;\n  value?: string;\n  onRemove?: () => void;\n  className?: string;\n  ref?: React.RefObject<HTMLDivElement>;\n  children?: ReactNode;\n  columnType?: FilterTypes;\n  options?: FilterSelectOption[];\n  onValueChange?: (value: any, operation: string) => void;\n  onOperationChange?: (operation: string) => void;\n  leadingIcon?: ReactElement;\n  operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n  label,\n  value,\n  onRemove,\n  className,\n  ref,\n  columnType = FilterType.string,\n  options = [],\n  onValueChange,\n  onOperationChange,\n  leadingIcon,\n  variant,\n  operations,\n  ...props\n}: FilterChipProps) => {\n  const computedOperations = operations?.length\n    ? operations\n    : filterOperators[columnType];\n\n  const [operation, setOperation] = useState<FilterOperation | undefined>(\n    computedOperations?.[0]\n  );\n  const [filterValue, setFilterValue] = useState<any>(value || '');\n\n  const showOnRemove = typeof onRemove === 'function';\n  const isMultiSelectColumn = columnType === FilterType.multiselect;\n\n  const handleOperationChange = useCallback(\n    (operation: FilterOperation) => {\n      setOperation(operation);\n      if (operation?.value) onOperationChange?.(operation.value);\n    },\n    [onOperationChange]\n  );\n\n  const handleFilterValueChange = useCallback(\n    (value: any) => {\n      setFilterValue(value);\n      onValueChange?.(value, operation?.value ?? '');\n    },\n    [operation, onValueChange]\n  );\n\n  const renderValueInput = () => {\n    switch (columnType) {\n      case FilterType.multiselect:\n      case FilterType.select:\n        return (\n          <Select\n            value={isMultiSelectColumn ? filterValue : filterValue.toString()}\n            onValueChange={handleFilterValueChange}\n            multiple={isMultiSelectColumn}\n          >\n            <Select.Trigger\n              iconProps={{\n                style: {\n                  display: 'none'\n                }\n              }}\n              variant='text'\n              className={cx(\n                styles.selectValue,\n                !showOnRemove && styles.selectColumn\n              )}\n            >\n              <Select.Value placeholder='Select value'>\n                {isMultiSelectColumn && filterValue.length > 1\n                  ? `${filterValue.length} selected`\n                  : undefined}\n              </Select.Value>\n            </Select.Trigger>\n            <Select.Content data-variant='filter'>\n              {options.map(opt => (\n                <Select.Item\n                  key={opt.value.toString()}\n                  value={opt.value.toString()}\n                >\n                  {opt.label}\n                </Select.Item>\n              ))}\n            </Select.Content>\n          </Select>\n        );\n      case FilterType.date:\n        return (\n          <div className={styles.dateFieldWrapper}>\n            <DatePicker\n              value={filterValue}\n              onSelect={date => handleFilterValueChange(date)}\n              showCalendarIcon={false}\n              inputFieldProps={{ className: styles.dateField }}\n            />\n          </div>\n        );\n      default:\n        return (\n          <div className={styles.inputFieldWrapper}>\n            <InputField\n              variant={variant === 'text' ? 'borderless' : 'default'}\n              className={styles.inputField}\n              value={filterValue}\n              onChange={e => handleFilterValueChange(e.target.value)}\n            />\n          </div>\n        );\n    }\n  };\n\n  return (\n    <Flex\n      align='center'\n      ref={ref}\n      className={chip({ variant, className })}\n      role='group'\n      aria-label={`Filter by ${label}`}\n      data-variant={variant}\n      {...props}\n    >\n      <Flex align='center' gap={2} className={styles['chip-label']}>\n        {leadingIcon && (\n          <span className={styles.leadingIcon} aria-hidden='true'>\n            {leadingIcon}\n          </span>\n        )}\n        <Text size={2} weight='normal'>\n          {label}\n        </Text>\n      </Flex>\n      <Operation\n        operations={computedOperations}\n        label={label}\n        value={operation}\n        onChange={handleOperationChange}\n        showAlternateLabel={isMultiSelectColumn && filterValue.length <= 1}\n      />\n      {renderValueInput()}\n      {showOnRemove && (\n        <button\n          className={styles.removeIconContainer}\n          aria-label={`Remove ${label} filter`}\n          onClick={onRemove}\n        >\n          <Cross1Icon className={styles.removeIcon} />\n        </button>\n      )}\n    </Flex>\n  );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAqBA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AAiBY;AAeX;AACE;AACA;AAEF;AAGA;AAEA;AACA;AAEA;;;AAG0B;AACxB;AAIF;;;AAIE;;;;;AAQI;AAQQ;AACE;AACD;AACF;AASG;;;AAiBV;AAUF;;;AAYJ;AAEA;AAuCF;AAEA;;"}

package/dist/components/flex/flex.cjs

@@ -1,11 +1,11 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var React = require('react');
 var flex_module = require('./flex.module.css.cjs');
 
-const flex = index.cva(flex_module.default.flex, {
+const flex = classVarianceAuthority.cva(flex_module.default.flex, {
     variants: {
         direction: {
             row: flex_module.default['direction-row'],

package/dist/components/flex/flex.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"flex.cjs","sources":["../../../components/flex/flex.tsx"],"sourcesContent":["import { VariantProps, cva } from 'class-variance-authority';\nimport { HTMLAttributes, PropsWithChildren, forwardRef } from 'react';\n\nimport styles from './flex.module.css';\n\nconst flex = cva(styles.flex, {\n  variants: {\n    direction: {\n      row: styles['direction-row'],\n      column: styles['direction-column'],\n      rowReverse: styles['direction-rowReverse'],\n      columnReverse: styles['direction-columnReverse']\n    },\n    align: {\n      start: styles['align-start'],\n      center: styles['align-center'],\n      end: styles['align-end'],\n      stretch: styles['align-stretch'],\n      baseline: styles['align-baseline']\n    },\n    justify: {\n      start: styles['justify-start'],\n      center: styles['justify-center'],\n      end: styles['justify-end'],\n      between: styles['justify-between']\n    },\n    wrap: {\n      noWrap: styles['wrap-noWrap'],\n      wrap: styles['wrap-wrap'],\n      wrapReverse: styles['wrap-wrapReverse']\n    },\n    gap: {\n      1: styles['gap-1'],\n      2: styles['gap-2'],\n      3: styles['gap-3'],\n      4: styles['gap-4'],\n      5: styles['gap-5'],\n      6: styles['gap-6'],\n      7: styles['gap-7'],\n      8: styles['gap-8'],\n      9: styles['gap-9'],\n      'extra-small': styles['gap-xs'],\n      small: styles['gap-sm'],\n      medium: styles['gap-md'],\n      large: styles['gap-lg'],\n      'extra-large': styles['gap-xl']\n    },\n    width: {\n      full: styles['width-full']\n    }\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap'\n  }\n});\n\ntype BoxProps = PropsWithChildren<VariantProps<typeof flex>> &\n  HTMLAttributes<HTMLDivElement>;\n\nexport const Flex = forwardRef<HTMLDivElement, BoxProps>(\n  (\n    {\n      children,\n      direction,\n      align,\n      justify,\n      wrap,\n      gap,\n      className,\n      width,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <div\n        className={flex({\n          direction,\n          align,\n          justify,\n          wrap,\n          gap,\n          className,\n          width\n        })}\n        {...props}\n        ref={ref}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["cva","styles","forwardRef","_jsx"],"mappings":"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"}
+{"version":3,"file":"flex.cjs","sources":["../../../components/flex/flex.tsx"],"sourcesContent":["import { VariantProps, cva } from 'class-variance-authority';\nimport { HTMLAttributes, PropsWithChildren, forwardRef } from 'react';\n\nimport styles from './flex.module.css';\n\nconst flex = cva(styles.flex, {\n  variants: {\n    direction: {\n      row: styles['direction-row'],\n      column: styles['direction-column'],\n      rowReverse: styles['direction-rowReverse'],\n      columnReverse: styles['direction-columnReverse']\n    },\n    align: {\n      start: styles['align-start'],\n      center: styles['align-center'],\n      end: styles['align-end'],\n      stretch: styles['align-stretch'],\n      baseline: styles['align-baseline']\n    },\n    justify: {\n      start: styles['justify-start'],\n      center: styles['justify-center'],\n      end: styles['justify-end'],\n      between: styles['justify-between']\n    },\n    wrap: {\n      noWrap: styles['wrap-noWrap'],\n      wrap: styles['wrap-wrap'],\n      wrapReverse: styles['wrap-wrapReverse']\n    },\n    gap: {\n      1: styles['gap-1'],\n      2: styles['gap-2'],\n      3: styles['gap-3'],\n      4: styles['gap-4'],\n      5: styles['gap-5'],\n      6: styles['gap-6'],\n      7: styles['gap-7'],\n      8: styles['gap-8'],\n      9: styles['gap-9'],\n      'extra-small': styles['gap-xs'],\n      small: styles['gap-sm'],\n      medium: styles['gap-md'],\n      large: styles['gap-lg'],\n      'extra-large': styles['gap-xl']\n    },\n    width: {\n      full: styles['width-full']\n    }\n  },\n  defaultVariants: {\n    direction: 'row',\n    align: 'stretch',\n    justify: 'start',\n    wrap: 'noWrap'\n  }\n});\n\ntype BoxProps = PropsWithChildren<VariantProps<typeof flex>> &\n  HTMLAttributes<HTMLDivElement>;\n\nexport const Flex = forwardRef<HTMLDivElement, BoxProps>(\n  (\n    {\n      children,\n      direction,\n      align,\n      justify,\n      wrap,\n      gap,\n      className,\n      width,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <div\n        className={flex({\n          direction,\n          align,\n          justify,\n          wrap,\n          gap,\n          className,\n          width\n        })}\n        {...props}\n        ref={ref}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["cva","styles","forwardRef","_jsx"],"mappings":"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"}

package/dist/components/flex/flex.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { cva } from 'class-variance-authority';
 import { forwardRef } from 'react';
 import styles from './flex.module.css.js';
 

package/dist/components/grid/grid-item.cjs

@@ -1,11 +1,11 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
+var radixUi = require('radix-ui');
 var React = require('react');
-var index = require('../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.9_react@19.2.1/node_modules/@radix-ui/react-slot/dist/index.cjs');
 
 const GridItem = React.forwardRef(({ area, colStart, colEnd, rowStart, rowEnd, colSpan, rowSpan, justifySelf, alignSelf, style, asChild, ...props }, ref) => {
-    const Comp = asChild ? index.Root : 'div';
+    const Comp = asChild ? radixUi.Slot.Root : 'div';
     return (jsxRuntime.jsx(Comp, { ref: ref, style: {
             gridArea: area,
             gridColumnStart: colStart,

package/dist/components/grid/grid-item.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"grid-item.cjs","sources":["../../../components/grid/grid-item.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef } from 'react';\nimport { AlignType } from './types';\n\ntype GridItemProps = HTMLAttributes<HTMLDivElement> & {\n  area?: string;\n  colStart?: number | string;\n  colEnd?: number | string;\n  rowStart?: number | string;\n  rowEnd?: number | string;\n  colSpan?: number | string;\n  rowSpan?: number | string;\n  justifySelf?: AlignType;\n  alignSelf?: AlignType;\n  asChild?: boolean;\n};\n\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  (\n    {\n      area,\n      colStart,\n      colEnd,\n      rowStart,\n      rowEnd,\n      colSpan,\n      rowSpan,\n      justifySelf,\n      alignSelf,\n      style,\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          gridArea: area,\n          gridColumnStart: colStart,\n          gridColumnEnd: colEnd,\n          gridRowStart: rowStart,\n          gridRowEnd: rowEnd,\n          gridColumn: colSpan ? `span ${colSpan}` : undefined,\n          gridRow: rowSpan ? `span ${rowSpan}` : undefined,\n          justifySelf,\n          alignSelf,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGridItem.displayName = 'GridItem';\n"],"names":["forwardRef","Slot.Root","_jsx"],"mappings":";;;;;;AAiBa,MAAA,QAAQ,GAAGA,gBAAU,CAChC,CACE,EACE,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,IAAI,GAAG,OAAO,GAAGC,UAAS,GAAG,KAAK,CAAC;IAEzC,QACEC,eAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,aAAa,EAAE,MAAM;AACrB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,UAAU,EAAE,MAAM;YAClB,UAAU,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YACnD,OAAO,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YAChD,WAAW;YACX,SAAS;AACT,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"grid-item.cjs","sources":["../../../components/grid/grid-item.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef } from 'react';\nimport { AlignType } from './types';\n\ntype GridItemProps = HTMLAttributes<HTMLDivElement> & {\n  area?: string;\n  colStart?: number | string;\n  colEnd?: number | string;\n  rowStart?: number | string;\n  rowEnd?: number | string;\n  colSpan?: number | string;\n  rowSpan?: number | string;\n  justifySelf?: AlignType;\n  alignSelf?: AlignType;\n  asChild?: boolean;\n};\n\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  (\n    {\n      area,\n      colStart,\n      colEnd,\n      rowStart,\n      rowEnd,\n      colSpan,\n      rowSpan,\n      justifySelf,\n      alignSelf,\n      style,\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          gridArea: area,\n          gridColumnStart: colStart,\n          gridColumnEnd: colEnd,\n          gridRowStart: rowStart,\n          gridRowEnd: rowEnd,\n          gridColumn: colSpan ? `span ${colSpan}` : undefined,\n          gridRow: rowSpan ? `span ${rowSpan}` : undefined,\n          justifySelf,\n          alignSelf,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGridItem.displayName = 'GridItem';\n"],"names":["forwardRef","Slot","_jsx"],"mappings":";;;;;;AAiBa,MAAA,QAAQ,GAAGA,gBAAU,CAChC,CACE,EACE,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,IAAI,GAAG,OAAO,GAAGC,YAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAEzC,QACEC,eAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,aAAa,EAAE,MAAM;AACrB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,UAAU,EAAE,MAAM;YAClB,UAAU,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YACnD,OAAO,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YAChD,WAAW;YACX,SAAS;AACT,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}

package/dist/components/grid/grid-item.js

@@ -1,9 +1,9 @@
 import { jsx } from 'react/jsx-runtime';
+import { Slot } from 'radix-ui';
 import { forwardRef } from 'react';
-import { Root as Slot } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.9_react@19.2.1/node_modules/@radix-ui/react-slot/dist/index.js';
 
 const GridItem = forwardRef(({ area, colStart, colEnd, rowStart, rowEnd, colSpan, rowSpan, justifySelf, alignSelf, style, asChild, ...props }, ref) => {
-    const Comp = asChild ? Slot : 'div';
+    const Comp = asChild ? Slot.Root : 'div';
     return (jsx(Comp, { ref: ref, style: {
             gridArea: area,
             gridColumnStart: colStart,

package/dist/components/grid/grid-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid-item.js","sources":["../../../components/grid/grid-item.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef } from 'react';\nimport { AlignType } from './types';\n\ntype GridItemProps = HTMLAttributes<HTMLDivElement> & {\n  area?: string;\n  colStart?: number | string;\n  colEnd?: number | string;\n  rowStart?: number | string;\n  rowEnd?: number | string;\n  colSpan?: number | string;\n  rowSpan?: number | string;\n  justifySelf?: AlignType;\n  alignSelf?: AlignType;\n  asChild?: boolean;\n};\n\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  (\n    {\n      area,\n      colStart,\n      colEnd,\n      rowStart,\n      rowEnd,\n      colSpan,\n      rowSpan,\n      justifySelf,\n      alignSelf,\n      style,\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          gridArea: area,\n          gridColumnStart: colStart,\n          gridColumnEnd: colEnd,\n          gridRowStart: rowStart,\n          gridRowEnd: rowEnd,\n          gridColumn: colSpan ? `span ${colSpan}` : undefined,\n          gridRow: rowSpan ? `span ${rowSpan}` : undefined,\n          justifySelf,\n          alignSelf,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGridItem.displayName = 'GridItem';\n"],"names":["Slot.Root","_jsx"],"mappings":";;;;AAiBa,MAAA,QAAQ,GAAG,UAAU,CAChC,CACE,EACE,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,IAAI,GAAG,OAAO,GAAGA,IAAS,GAAG,KAAK,CAAC;IAEzC,QACEC,IAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,aAAa,EAAE,MAAM;AACrB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,UAAU,EAAE,MAAM;YAClB,UAAU,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YACnD,OAAO,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YAChD,WAAW;YACX,SAAS;AACT,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"grid-item.js","sources":["../../../components/grid/grid-item.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef } from 'react';\nimport { AlignType } from './types';\n\ntype GridItemProps = HTMLAttributes<HTMLDivElement> & {\n  area?: string;\n  colStart?: number | string;\n  colEnd?: number | string;\n  rowStart?: number | string;\n  rowEnd?: number | string;\n  colSpan?: number | string;\n  rowSpan?: number | string;\n  justifySelf?: AlignType;\n  alignSelf?: AlignType;\n  asChild?: boolean;\n};\n\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  (\n    {\n      area,\n      colStart,\n      colEnd,\n      rowStart,\n      rowEnd,\n      colSpan,\n      rowSpan,\n      justifySelf,\n      alignSelf,\n      style,\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          gridArea: area,\n          gridColumnStart: colStart,\n          gridColumnEnd: colEnd,\n          gridRowStart: rowStart,\n          gridRowEnd: rowEnd,\n          gridColumn: colSpan ? `span ${colSpan}` : undefined,\n          gridRow: rowSpan ? `span ${rowSpan}` : undefined,\n          justifySelf,\n          alignSelf,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGridItem.displayName = 'GridItem';\n"],"names":["_jsx"],"mappings":";;;;AAiBa,MAAA,QAAQ,GAAG,UAAU,CAChC,CACE,EACE,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAEzC,QACEA,IAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,aAAa,EAAE,MAAM;AACrB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,UAAU,EAAE,MAAM;YAClB,UAAU,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YACnD,OAAO,EAAE,OAAO,GAAG,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,GAAG,SAAS;YAChD,WAAW;YACX,SAAS;AACT,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}

package/dist/components/grid/grid.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
+var radixUi = require('radix-ui');
 var React = require('react');
-var index = require('../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.9_react@19.2.1/node_modules/@radix-ui/react-slot/dist/index.cjs');
 
 const GAPS = {
     'extra-small': 'var(--rs-space-2)',
@@ -23,7 +23,7 @@ const Grid = React.forwardRef(({ templateAreas, autoFlow, autoColumns, autoRows,
         }
         return templateAreas;
     }, [templateAreas]);
-    const Comp = asChild ? index.Root : 'div';
+    const Comp = asChild ? radixUi.Slot.Root : 'div';
     return (jsxRuntime.jsx(Comp, { ref: ref, style: {
             display: inline ? 'inline-grid' : 'grid',
             gridTemplateAreas,

package/dist/components/grid/grid.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"grid.cjs","sources":["../../../components/grid/grid.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef, useMemo } from 'react';\nimport { AlignExtendedType, AlignType } from './types';\n\nconst GAPS = {\n  'extra-small': 'var(--rs-space-2)',\n  small: 'var(--rs-space-3)',\n  medium: 'var(--rs-space-5)',\n  large: 'var(--rs-space-9)',\n  'extra-large': 'var(--rs-space-11)'\n} as const;\n\ntype GapType = keyof typeof GAPS;\n\ntype GridProps = HTMLAttributes<HTMLDivElement> & {\n  /**\n   * Supports CSS Grid template areas syntax.\n   *\n   * @example\n   * <Grid templateAreas=\"header header header\" />\n   * <Grid templateAreas={[\"header header header\", \"sidebar main main\", \"footer footer footer\"]} />\n   */\n  templateAreas?: string | string[];\n  autoFlow?: 'row' | 'column' | 'dense' | 'row dense' | 'column dense';\n  autoColumns?: string;\n  autoRows?: string;\n\n  /**\n   * Supports CSS Grid template columns syntax.\n   *\n   * If you pass a number, columns will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid columns=\"1fr 1fr 1fr\" />\n   * <Grid columns={3} />\n   */\n  columns?: string | number;\n\n  /**\n   * Supports CSS Grid template rows syntax.\n   *\n   * If you pass a number, rows will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid rows=\"1fr 1fr 1fr\" />\n   * <Grid rows={3} />\n   */\n  rows?: string | number;\n  gap?: GapType;\n  columnGap?: GapType;\n  rowGap?: GapType;\n  justifyItems?: AlignType;\n  alignItems?: AlignType;\n  justifyContent?: AlignExtendedType;\n  alignContent?: AlignExtendedType;\n  inline?: boolean;\n  asChild?: boolean;\n};\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    {\n      templateAreas,\n      autoFlow,\n      autoColumns,\n      autoRows,\n      columns,\n      rows,\n      gap,\n      columnGap,\n      rowGap,\n      justifyItems,\n      alignItems,\n      justifyContent,\n      alignContent,\n      inline = false,\n      style = {},\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const gridTemplateColumns =\n      typeof columns === 'number' ? `repeat(${columns}, 1fr)` : columns;\n    const gridTemplateRows =\n      typeof rows === 'number' ? `repeat(${rows}, 1fr)` : rows;\n\n    const gridTemplateAreas = useMemo(() => {\n      if (Array.isArray(templateAreas)) {\n        return templateAreas\n          .map(area => `\"${area}\"`)\n          .join(' ')\n          .trim();\n      }\n      return templateAreas;\n    }, [templateAreas]);\n\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          display: inline ? 'inline-grid' : 'grid',\n          gridTemplateAreas,\n          gridAutoFlow: autoFlow,\n          gridAutoColumns: autoColumns,\n          gridAutoRows: autoRows,\n          gridTemplateColumns,\n          gridTemplateRows,\n          gap: gap && GAPS[gap],\n          columnGap: columnGap && GAPS[columnGap],\n          rowGap: rowGap && GAPS[rowGap],\n          justifyItems,\n          alignItems,\n          justifyContent,\n          alignContent,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGrid.displayName = 'Grid';\n"],"names":["forwardRef","useMemo","Slot.Root","_jsx"],"mappings":";;;;;;AAIA,MAAM,IAAI,GAAG;AACX,IAAA,aAAa,EAAE,mBAAmB;AAClC,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,MAAM,EAAE,mBAAmB;AAC3B,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,aAAa,EAAE,oBAAoB;CAC3B,CAAC;MAiDE,IAAI,GAAGA,gBAAU,CAC5B,CACE,EACE,aAAa,EACb,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,GAAG,EACH,SAAS,EACT,MAAM,EACN,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,MAAM,GAAG,KAAK,EACd,KAAK,GAAG,EAAE,EACV,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,mBAAmB,GACvB,OAAO,OAAO,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,OAAO,CAAQ,MAAA,CAAA,GAAG,OAAO,CAAC;AACpE,IAAA,MAAM,gBAAgB,GACpB,OAAO,IAAI,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,IAAI,CAAQ,MAAA,CAAA,GAAG,IAAI,CAAC;AAE3D,IAAA,MAAM,iBAAiB,GAAGC,aAAO,CAAC,MAAK;AACrC,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;AAChC,YAAA,OAAO,aAAa;iBACjB,GAAG,CAAC,IAAI,IAAI,CAAI,CAAA,EAAA,IAAI,GAAG,CAAC;iBACxB,IAAI,CAAC,GAAG,CAAC;AACT,iBAAA,IAAI,EAAE,CAAC;SACX;AACD,QAAA,OAAO,aAAa,CAAC;AACvB,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AAEpB,IAAA,MAAM,IAAI,GAAG,OAAO,GAAGC,UAAS,GAAG,KAAK,CAAC;IAEzC,QACEC,eAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACL,OAAO,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM;YACxC,iBAAiB;AACjB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,eAAe,EAAE,WAAW;AAC5B,YAAA,YAAY,EAAE,QAAQ;YACtB,mBAAmB;YACnB,gBAAgB;AAChB,YAAA,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC;AACrB,YAAA,SAAS,EAAE,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC;AACvC,YAAA,MAAM,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC;YAC9B,YAAY;YACZ,UAAU;YACV,cAAc;YACd,YAAY;AACZ,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}
+{"version":3,"file":"grid.cjs","sources":["../../../components/grid/grid.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef, useMemo } from 'react';\nimport { AlignExtendedType, AlignType } from './types';\n\nconst GAPS = {\n  'extra-small': 'var(--rs-space-2)',\n  small: 'var(--rs-space-3)',\n  medium: 'var(--rs-space-5)',\n  large: 'var(--rs-space-9)',\n  'extra-large': 'var(--rs-space-11)'\n} as const;\n\ntype GapType = keyof typeof GAPS;\n\ntype GridProps = HTMLAttributes<HTMLDivElement> & {\n  /**\n   * Supports CSS Grid template areas syntax.\n   *\n   * @example\n   * <Grid templateAreas=\"header header header\" />\n   * <Grid templateAreas={[\"header header header\", \"sidebar main main\", \"footer footer footer\"]} />\n   */\n  templateAreas?: string | string[];\n  autoFlow?: 'row' | 'column' | 'dense' | 'row dense' | 'column dense';\n  autoColumns?: string;\n  autoRows?: string;\n\n  /**\n   * Supports CSS Grid template columns syntax.\n   *\n   * If you pass a number, columns will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid columns=\"1fr 1fr 1fr\" />\n   * <Grid columns={3} />\n   */\n  columns?: string | number;\n\n  /**\n   * Supports CSS Grid template rows syntax.\n   *\n   * If you pass a number, rows will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid rows=\"1fr 1fr 1fr\" />\n   * <Grid rows={3} />\n   */\n  rows?: string | number;\n  gap?: GapType;\n  columnGap?: GapType;\n  rowGap?: GapType;\n  justifyItems?: AlignType;\n  alignItems?: AlignType;\n  justifyContent?: AlignExtendedType;\n  alignContent?: AlignExtendedType;\n  inline?: boolean;\n  asChild?: boolean;\n};\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    {\n      templateAreas,\n      autoFlow,\n      autoColumns,\n      autoRows,\n      columns,\n      rows,\n      gap,\n      columnGap,\n      rowGap,\n      justifyItems,\n      alignItems,\n      justifyContent,\n      alignContent,\n      inline = false,\n      style = {},\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const gridTemplateColumns =\n      typeof columns === 'number' ? `repeat(${columns}, 1fr)` : columns;\n    const gridTemplateRows =\n      typeof rows === 'number' ? `repeat(${rows}, 1fr)` : rows;\n\n    const gridTemplateAreas = useMemo(() => {\n      if (Array.isArray(templateAreas)) {\n        return templateAreas\n          .map(area => `\"${area}\"`)\n          .join(' ')\n          .trim();\n      }\n      return templateAreas;\n    }, [templateAreas]);\n\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          display: inline ? 'inline-grid' : 'grid',\n          gridTemplateAreas,\n          gridAutoFlow: autoFlow,\n          gridAutoColumns: autoColumns,\n          gridAutoRows: autoRows,\n          gridTemplateColumns,\n          gridTemplateRows,\n          gap: gap && GAPS[gap],\n          columnGap: columnGap && GAPS[columnGap],\n          rowGap: rowGap && GAPS[rowGap],\n          justifyItems,\n          alignItems,\n          justifyContent,\n          alignContent,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGrid.displayName = 'Grid';\n"],"names":["forwardRef","useMemo","Slot","_jsx"],"mappings":";;;;;;AAIA,MAAM,IAAI,GAAG;AACX,IAAA,aAAa,EAAE,mBAAmB;AAClC,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,MAAM,EAAE,mBAAmB;AAC3B,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,aAAa,EAAE,oBAAoB;CAC3B,CAAC;MAiDE,IAAI,GAAGA,gBAAU,CAC5B,CACE,EACE,aAAa,EACb,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,GAAG,EACH,SAAS,EACT,MAAM,EACN,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,MAAM,GAAG,KAAK,EACd,KAAK,GAAG,EAAE,EACV,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,mBAAmB,GACvB,OAAO,OAAO,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,OAAO,CAAQ,MAAA,CAAA,GAAG,OAAO,CAAC;AACpE,IAAA,MAAM,gBAAgB,GACpB,OAAO,IAAI,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,IAAI,CAAQ,MAAA,CAAA,GAAG,IAAI,CAAC;AAE3D,IAAA,MAAM,iBAAiB,GAAGC,aAAO,CAAC,MAAK;AACrC,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;AAChC,YAAA,OAAO,aAAa;iBACjB,GAAG,CAAC,IAAI,IAAI,CAAI,CAAA,EAAA,IAAI,GAAG,CAAC;iBACxB,IAAI,CAAC,GAAG,CAAC;AACT,iBAAA,IAAI,EAAE,CAAC;SACX;AACD,QAAA,OAAO,aAAa,CAAC;AACvB,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AAEpB,IAAA,MAAM,IAAI,GAAG,OAAO,GAAGC,YAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAEzC,QACEC,eAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACL,OAAO,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM;YACxC,iBAAiB;AACjB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,eAAe,EAAE,WAAW;AAC5B,YAAA,YAAY,EAAE,QAAQ;YACtB,mBAAmB;YACnB,gBAAgB;AAChB,YAAA,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC;AACrB,YAAA,SAAS,EAAE,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC;AACvC,YAAA,MAAM,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC;YAC9B,YAAY;YACZ,UAAU;YACV,cAAc;YACd,YAAY;AACZ,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}

package/dist/components/grid/grid.js

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
+import { Slot } from 'radix-ui';
 import { forwardRef, useMemo } from 'react';
-import { Root as Slot } from '../../node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.9_react@19.2.1/node_modules/@radix-ui/react-slot/dist/index.js';
 
 const GAPS = {
     'extra-small': 'var(--rs-space-2)',
@@ -21,7 +21,7 @@ const Grid = forwardRef(({ templateAreas, autoFlow, autoColumns, autoRows, colum
         }
         return templateAreas;
     }, [templateAreas]);
-    const Comp = asChild ? Slot : 'div';
+    const Comp = asChild ? Slot.Root : 'div';
     return (jsx(Comp, { ref: ref, style: {
             display: inline ? 'inline-grid' : 'grid',
             gridTemplateAreas,

package/dist/components/grid/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","sources":["../../../components/grid/grid.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef, useMemo } from 'react';\nimport { AlignExtendedType, AlignType } from './types';\n\nconst GAPS = {\n  'extra-small': 'var(--rs-space-2)',\n  small: 'var(--rs-space-3)',\n  medium: 'var(--rs-space-5)',\n  large: 'var(--rs-space-9)',\n  'extra-large': 'var(--rs-space-11)'\n} as const;\n\ntype GapType = keyof typeof GAPS;\n\ntype GridProps = HTMLAttributes<HTMLDivElement> & {\n  /**\n   * Supports CSS Grid template areas syntax.\n   *\n   * @example\n   * <Grid templateAreas=\"header header header\" />\n   * <Grid templateAreas={[\"header header header\", \"sidebar main main\", \"footer footer footer\"]} />\n   */\n  templateAreas?: string | string[];\n  autoFlow?: 'row' | 'column' | 'dense' | 'row dense' | 'column dense';\n  autoColumns?: string;\n  autoRows?: string;\n\n  /**\n   * Supports CSS Grid template columns syntax.\n   *\n   * If you pass a number, columns will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid columns=\"1fr 1fr 1fr\" />\n   * <Grid columns={3} />\n   */\n  columns?: string | number;\n\n  /**\n   * Supports CSS Grid template rows syntax.\n   *\n   * If you pass a number, rows will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid rows=\"1fr 1fr 1fr\" />\n   * <Grid rows={3} />\n   */\n  rows?: string | number;\n  gap?: GapType;\n  columnGap?: GapType;\n  rowGap?: GapType;\n  justifyItems?: AlignType;\n  alignItems?: AlignType;\n  justifyContent?: AlignExtendedType;\n  alignContent?: AlignExtendedType;\n  inline?: boolean;\n  asChild?: boolean;\n};\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    {\n      templateAreas,\n      autoFlow,\n      autoColumns,\n      autoRows,\n      columns,\n      rows,\n      gap,\n      columnGap,\n      rowGap,\n      justifyItems,\n      alignItems,\n      justifyContent,\n      alignContent,\n      inline = false,\n      style = {},\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const gridTemplateColumns =\n      typeof columns === 'number' ? `repeat(${columns}, 1fr)` : columns;\n    const gridTemplateRows =\n      typeof rows === 'number' ? `repeat(${rows}, 1fr)` : rows;\n\n    const gridTemplateAreas = useMemo(() => {\n      if (Array.isArray(templateAreas)) {\n        return templateAreas\n          .map(area => `\"${area}\"`)\n          .join(' ')\n          .trim();\n      }\n      return templateAreas;\n    }, [templateAreas]);\n\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          display: inline ? 'inline-grid' : 'grid',\n          gridTemplateAreas,\n          gridAutoFlow: autoFlow,\n          gridAutoColumns: autoColumns,\n          gridAutoRows: autoRows,\n          gridTemplateColumns,\n          gridTemplateRows,\n          gap: gap && GAPS[gap],\n          columnGap: columnGap && GAPS[columnGap],\n          rowGap: rowGap && GAPS[rowGap],\n          justifyItems,\n          alignItems,\n          justifyContent,\n          alignContent,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGrid.displayName = 'Grid';\n"],"names":["Slot.Root","_jsx"],"mappings":";;;;AAIA,MAAM,IAAI,GAAG;AACX,IAAA,aAAa,EAAE,mBAAmB;AAClC,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,MAAM,EAAE,mBAAmB;AAC3B,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,aAAa,EAAE,oBAAoB;CAC3B,CAAC;MAiDE,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,aAAa,EACb,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,GAAG,EACH,SAAS,EACT,MAAM,EACN,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,MAAM,GAAG,KAAK,EACd,KAAK,GAAG,EAAE,EACV,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,mBAAmB,GACvB,OAAO,OAAO,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,OAAO,CAAQ,MAAA,CAAA,GAAG,OAAO,CAAC;AACpE,IAAA,MAAM,gBAAgB,GACpB,OAAO,IAAI,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,IAAI,CAAQ,MAAA,CAAA,GAAG,IAAI,CAAC;AAE3D,IAAA,MAAM,iBAAiB,GAAG,OAAO,CAAC,MAAK;AACrC,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;AAChC,YAAA,OAAO,aAAa;iBACjB,GAAG,CAAC,IAAI,IAAI,CAAI,CAAA,EAAA,IAAI,GAAG,CAAC;iBACxB,IAAI,CAAC,GAAG,CAAC;AACT,iBAAA,IAAI,EAAE,CAAC;SACX;AACD,QAAA,OAAO,aAAa,CAAC;AACvB,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AAEpB,IAAA,MAAM,IAAI,GAAG,OAAO,GAAGA,IAAS,GAAG,KAAK,CAAC;IAEzC,QACEC,IAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACL,OAAO,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM;YACxC,iBAAiB;AACjB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,eAAe,EAAE,WAAW;AAC5B,YAAA,YAAY,EAAE,QAAQ;YACtB,mBAAmB;YACnB,gBAAgB;AAChB,YAAA,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC;AACrB,YAAA,SAAS,EAAE,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC;AACvC,YAAA,MAAM,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC;YAC9B,YAAY;YACZ,UAAU;YACV,cAAc;YACd,YAAY;AACZ,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}
+{"version":3,"file":"grid.js","sources":["../../../components/grid/grid.tsx"],"sourcesContent":["import { Slot } from 'radix-ui';\nimport { HTMLAttributes, forwardRef, useMemo } from 'react';\nimport { AlignExtendedType, AlignType } from './types';\n\nconst GAPS = {\n  'extra-small': 'var(--rs-space-2)',\n  small: 'var(--rs-space-3)',\n  medium: 'var(--rs-space-5)',\n  large: 'var(--rs-space-9)',\n  'extra-large': 'var(--rs-space-11)'\n} as const;\n\ntype GapType = keyof typeof GAPS;\n\ntype GridProps = HTMLAttributes<HTMLDivElement> & {\n  /**\n   * Supports CSS Grid template areas syntax.\n   *\n   * @example\n   * <Grid templateAreas=\"header header header\" />\n   * <Grid templateAreas={[\"header header header\", \"sidebar main main\", \"footer footer footer\"]} />\n   */\n  templateAreas?: string | string[];\n  autoFlow?: 'row' | 'column' | 'dense' | 'row dense' | 'column dense';\n  autoColumns?: string;\n  autoRows?: string;\n\n  /**\n   * Supports CSS Grid template columns syntax.\n   *\n   * If you pass a number, columns will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid columns=\"1fr 1fr 1fr\" />\n   * <Grid columns={3} />\n   */\n  columns?: string | number;\n\n  /**\n   * Supports CSS Grid template rows syntax.\n   *\n   * If you pass a number, rows will be created using repeat(n, 1fr).\n   *\n   * @example\n   * <Grid rows=\"1fr 1fr 1fr\" />\n   * <Grid rows={3} />\n   */\n  rows?: string | number;\n  gap?: GapType;\n  columnGap?: GapType;\n  rowGap?: GapType;\n  justifyItems?: AlignType;\n  alignItems?: AlignType;\n  justifyContent?: AlignExtendedType;\n  alignContent?: AlignExtendedType;\n  inline?: boolean;\n  asChild?: boolean;\n};\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    {\n      templateAreas,\n      autoFlow,\n      autoColumns,\n      autoRows,\n      columns,\n      rows,\n      gap,\n      columnGap,\n      rowGap,\n      justifyItems,\n      alignItems,\n      justifyContent,\n      alignContent,\n      inline = false,\n      style = {},\n      asChild,\n      ...props\n    },\n    ref\n  ) => {\n    const gridTemplateColumns =\n      typeof columns === 'number' ? `repeat(${columns}, 1fr)` : columns;\n    const gridTemplateRows =\n      typeof rows === 'number' ? `repeat(${rows}, 1fr)` : rows;\n\n    const gridTemplateAreas = useMemo(() => {\n      if (Array.isArray(templateAreas)) {\n        return templateAreas\n          .map(area => `\"${area}\"`)\n          .join(' ')\n          .trim();\n      }\n      return templateAreas;\n    }, [templateAreas]);\n\n    const Comp = asChild ? Slot.Root : 'div';\n\n    return (\n      <Comp\n        ref={ref}\n        style={{\n          display: inline ? 'inline-grid' : 'grid',\n          gridTemplateAreas,\n          gridAutoFlow: autoFlow,\n          gridAutoColumns: autoColumns,\n          gridAutoRows: autoRows,\n          gridTemplateColumns,\n          gridTemplateRows,\n          gap: gap && GAPS[gap],\n          columnGap: columnGap && GAPS[columnGap],\n          rowGap: rowGap && GAPS[rowGap],\n          justifyItems,\n          alignItems,\n          justifyContent,\n          alignContent,\n          ...style\n        }}\n        {...props}\n      />\n    );\n  }\n);\n\nGrid.displayName = 'Grid';\n"],"names":["_jsx"],"mappings":";;;;AAIA,MAAM,IAAI,GAAG;AACX,IAAA,aAAa,EAAE,mBAAmB;AAClC,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,MAAM,EAAE,mBAAmB;AAC3B,IAAA,KAAK,EAAE,mBAAmB;AAC1B,IAAA,aAAa,EAAE,oBAAoB;CAC3B,CAAC;MAiDE,IAAI,GAAG,UAAU,CAC5B,CACE,EACE,aAAa,EACb,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,GAAG,EACH,SAAS,EACT,MAAM,EACN,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,MAAM,GAAG,KAAK,EACd,KAAK,GAAG,EAAE,EACV,OAAO,EACP,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,mBAAmB,GACvB,OAAO,OAAO,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,OAAO,CAAQ,MAAA,CAAA,GAAG,OAAO,CAAC;AACpE,IAAA,MAAM,gBAAgB,GACpB,OAAO,IAAI,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAU,IAAI,CAAQ,MAAA,CAAA,GAAG,IAAI,CAAC;AAE3D,IAAA,MAAM,iBAAiB,GAAG,OAAO,CAAC,MAAK;AACrC,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;AAChC,YAAA,OAAO,aAAa;iBACjB,GAAG,CAAC,IAAI,IAAI,CAAI,CAAA,EAAA,IAAI,GAAG,CAAC;iBACxB,IAAI,CAAC,GAAG,CAAC;AACT,iBAAA,IAAI,EAAE,CAAC;SACX;AACD,QAAA,OAAO,aAAa,CAAC;AACvB,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AAEpB,IAAA,MAAM,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAEzC,QACEA,IAAC,IAAI,EAAA,EACH,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACL,OAAO,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM;YACxC,iBAAiB;AACjB,YAAA,YAAY,EAAE,QAAQ;AACtB,YAAA,eAAe,EAAE,WAAW;AAC5B,YAAA,YAAY,EAAE,QAAQ;YACtB,mBAAmB;YACnB,gBAAgB;AAChB,YAAA,GAAG,EAAE,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC;AACrB,YAAA,SAAS,EAAE,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC;AACvC,YAAA,MAAM,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC;YAC9B,YAAY;YACZ,UAAU;YACV,cAAc;YACd,YAAY;AACZ,YAAA,GAAG,KAAK;SACT,EACG,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}

package/dist/components/headline/headline.cjs

@@ -1,11 +1,11 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var React = require('react');
 var headline_module = require('./headline.module.css.cjs');
 
-const headline = index.cva(headline_module.default.headline, {
+const headline = classVarianceAuthority.cva(headline_module.default.headline, {
     variants: {
         size: {
             t1: headline_module.default['headline-t1'],

package/dist/components/headline/headline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"headline.cjs","sources":["../../../components/headline/headline.tsx"],"sourcesContent":["import { type VariantProps, cva } from 'class-variance-authority';\nimport { HTMLAttributes, forwardRef } from 'react';\n\nimport styles from './headline.module.css';\n\nconst headline = cva(styles.headline, {\n  variants: {\n    size: {\n      t1: styles['headline-t1'],\n      t2: styles['headline-t2'],\n      t3: styles['headline-t3'],\n      t4: styles['headline-t4'],\n      small: styles['headline-small'],\n      medium: styles['headline-medium'],\n      large: styles['headline-large']\n    },\n    weight: {\n      regular: styles['headline-weight-regular'],\n      medium: styles['headline-weight-medium']\n    },\n    align: {\n      left: styles['headline-align-left'],\n      center: styles['headline-align-center'],\n      right: styles['headline-align-right']\n    },\n    truncate: {\n      true: styles['headline-truncate']\n    }\n  },\n  defaultVariants: {\n    size: 't2',\n    weight: 'medium',\n    align: 'left',\n    truncate: false\n  }\n});\n\nexport type HeadlineBaseProps = VariantProps<typeof headline> & {\n  /**\n   * @remarks Use \"t1\" | \"t2\" | \"t3\" | \"t4\"\n   */\n  size?: 't1' | 't2' | 't3' | 't4' | 'small' | 'medium' | 'large';\n};\n\ntype HeadlineProps = HeadlineBaseProps &\n  HTMLAttributes<HTMLHeadingElement> & {\n    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  };\n\nexport const Headline = forwardRef<HTMLHeadingElement, HeadlineProps>(\n  (\n    {\n      className,\n      size,\n      weight,\n      align,\n      truncate,\n      as: Component = 'h2',\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <Component\n        ref={ref}\n        className={headline({ size, weight, align, truncate, className })}\n        {...props}\n      />\n    );\n  }\n);\n\nHeadline.displayName = 'Headline';\n"],"names":["cva","styles","forwardRef","_jsx"],"mappings":";;;;;;;AAKA,MAAM,QAAQ,GAAGA,SAAG,CAACC,uBAAM,CAAC,QAAQ,EAAE;AACpC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,KAAK,EAAEA,uBAAM,CAAC,gBAAgB,CAAC;AAC/B,YAAA,MAAM,EAAEA,uBAAM,CAAC,iBAAiB,CAAC;AACjC,YAAA,KAAK,EAAEA,uBAAM,CAAC,gBAAgB,CAAC;AAChC,SAAA;AACD,QAAA,MAAM,EAAE;AACN,YAAA,OAAO,EAAEA,uBAAM,CAAC,yBAAyB,CAAC;AAC1C,YAAA,MAAM,EAAEA,uBAAM,CAAC,wBAAwB,CAAC;AACzC,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAEA,uBAAM,CAAC,qBAAqB,CAAC;AACnC,YAAA,MAAM,EAAEA,uBAAM,CAAC,uBAAuB,CAAC;AACvC,YAAA,KAAK,EAAEA,uBAAM,CAAC,sBAAsB,CAAC;AACtC,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAEA,uBAAM,CAAC,mBAAmB,CAAC;AAClC,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,MAAM,EAAE,QAAQ;AAChB,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,QAAQ,EAAE,KAAK;AAChB,KAAA;AACF,CAAA,CAAC,CAAC;AAcI,MAAM,QAAQ,GAAGC,gBAAU,CAChC,CACE,EACE,SAAS,EACT,IAAI,EACJ,MAAM,EACN,KAAK,EACL,QAAQ,EACR,EAAE,EAAE,SAAS,GAAG,IAAI,EACpB,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,QACEC,cAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAC7D,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"headline.cjs","sources":["../../../components/headline/headline.tsx"],"sourcesContent":["import { type VariantProps, cva } from 'class-variance-authority';\nimport { HTMLAttributes, forwardRef } from 'react';\n\nimport styles from './headline.module.css';\n\nconst headline = cva(styles.headline, {\n  variants: {\n    size: {\n      t1: styles['headline-t1'],\n      t2: styles['headline-t2'],\n      t3: styles['headline-t3'],\n      t4: styles['headline-t4'],\n      small: styles['headline-small'],\n      medium: styles['headline-medium'],\n      large: styles['headline-large']\n    },\n    weight: {\n      regular: styles['headline-weight-regular'],\n      medium: styles['headline-weight-medium']\n    },\n    align: {\n      left: styles['headline-align-left'],\n      center: styles['headline-align-center'],\n      right: styles['headline-align-right']\n    },\n    truncate: {\n      true: styles['headline-truncate']\n    }\n  },\n  defaultVariants: {\n    size: 't2',\n    weight: 'medium',\n    align: 'left',\n    truncate: false\n  }\n});\n\nexport type HeadlineBaseProps = VariantProps<typeof headline> & {\n  /**\n   * @remarks Use \"t1\" | \"t2\" | \"t3\" | \"t4\"\n   */\n  size?: 't1' | 't2' | 't3' | 't4' | 'small' | 'medium' | 'large';\n};\n\ntype HeadlineProps = HeadlineBaseProps &\n  HTMLAttributes<HTMLHeadingElement> & {\n    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  };\n\nexport const Headline = forwardRef<HTMLHeadingElement, HeadlineProps>(\n  (\n    {\n      className,\n      size,\n      weight,\n      align,\n      truncate,\n      as: Component = 'h2',\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <Component\n        ref={ref}\n        className={headline({ size, weight, align, truncate, className })}\n        {...props}\n      />\n    );\n  }\n);\n\nHeadline.displayName = 'Headline';\n"],"names":["cva","styles","forwardRef","_jsx"],"mappings":";;;;;;;AAKA,MAAM,QAAQ,GAAGA,0BAAG,CAACC,uBAAM,CAAC,QAAQ,EAAE;AACpC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,EAAE,EAAEA,uBAAM,CAAC,aAAa,CAAC;AACzB,YAAA,KAAK,EAAEA,uBAAM,CAAC,gBAAgB,CAAC;AAC/B,YAAA,MAAM,EAAEA,uBAAM,CAAC,iBAAiB,CAAC;AACjC,YAAA,KAAK,EAAEA,uBAAM,CAAC,gBAAgB,CAAC;AAChC,SAAA;AACD,QAAA,MAAM,EAAE;AACN,YAAA,OAAO,EAAEA,uBAAM,CAAC,yBAAyB,CAAC;AAC1C,YAAA,MAAM,EAAEA,uBAAM,CAAC,wBAAwB,CAAC;AACzC,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAEA,uBAAM,CAAC,qBAAqB,CAAC;AACnC,YAAA,MAAM,EAAEA,uBAAM,CAAC,uBAAuB,CAAC;AACvC,YAAA,KAAK,EAAEA,uBAAM,CAAC,sBAAsB,CAAC;AACtC,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAEA,uBAAM,CAAC,mBAAmB,CAAC;AAClC,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,MAAM,EAAE,QAAQ;AAChB,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,QAAQ,EAAE,KAAK;AAChB,KAAA;AACF,CAAA,CAAC,CAAC;AAcI,MAAM,QAAQ,GAAGC,gBAAU,CAChC,CACE,EACE,SAAS,EACT,IAAI,EACJ,MAAM,EACN,KAAK,EACL,QAAQ,EACR,EAAE,EAAE,SAAS,GAAG,IAAI,EACpB,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,QACEC,cAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAC7D,GAAA,KAAK,EACT,CAAA,EACF;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}

package/dist/components/headline/headline.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { cva } from 'class-variance-authority';
 import { forwardRef } from 'react';
 import styles from './headline.module.css.js';
 

package/dist/components/icon-button/icon-button.cjs

@@ -1,12 +1,12 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var React = require('react');
 var flex = require('../flex/flex.cjs');
 var iconButton_module = require('./icon-button.module.css.cjs');
 
-const iconButton = index.cva(iconButton_module.default.iconButton, {
+const iconButton = classVarianceAuthority.cva(iconButton_module.default.iconButton, {
     variants: {
         size: {
             1: iconButton_module.default['iconButton-size-1'],

package/dist/components/icon-button/icon-button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.cjs","sources":["../../../components/icon-button/icon-button.tsx"],"sourcesContent":["import { VariantProps, cva } from 'class-variance-authority';\nimport { ElementRef, forwardRef } from 'react';\nimport { Flex } from '../flex';\n\nimport styles from './icon-button.module.css';\n\nconst iconButton = cva(styles.iconButton, {\n  variants: {\n    size: {\n      1: styles['iconButton-size-1'],\n      2: styles['iconButton-size-2'],\n      3: styles['iconButton-size-3'],\n      4: styles['iconButton-size-4']\n    }\n  },\n  defaultVariants: {\n    size: 2\n  }\n});\n\nexport interface IconButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof iconButton> {\n  size?: 1 | 2 | 3 | 4;\n  'aria-label'?: string;\n}\n\nexport const IconButton = forwardRef<ElementRef<'button'>, IconButtonProps>(\n  (\n    {\n      className,\n      size,\n      disabled,\n      children,\n      'aria-label': ariaLabel,\n      style,\n      ...props\n    },\n    ref\n  ) => (\n    <button\n      ref={ref}\n      className={iconButton({ size, className })}\n      disabled={disabled}\n      type='button'\n      aria-label={ariaLabel}\n      aria-disabled={disabled}\n      style={style}\n      {...props}\n    >\n      <Flex aria-hidden='true' align='center' justify='center'>\n        {children}\n      </Flex>\n    </button>\n  )\n);\n\nIconButton.displayName = 'IconButton';\n"],"names":["cva","styles","forwardRef","_jsx","Flex"],"mappings":";;;;;;;;AAMA,MAAM,UAAU,GAAGA,SAAG,CAACC,yBAAM,CAAC,UAAU,EAAE;AACxC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC9B,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC9B,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC9B,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC/B,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,CAAC;AACR,KAAA;AACF,CAAA,CAAC,CAAC;AASU,MAAA,UAAU,GAAGC,gBAAU,CAClC,CACE,EACE,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,MAEHC,cAAA,CAAA,QAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAC1C,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,gBACD,SAAS,EAAA,eAAA,EACN,QAAQ,EACvB,KAAK,EAAE,KAAK,EAAA,GACR,KAAK,EAAA,QAAA,EAETA,eAACC,SAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,EACrD,QAAA,EAAA,QAAQ,GACJ,EACA,CAAA,CACV,EACD;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
+{"version":3,"file":"icon-button.cjs","sources":["../../../components/icon-button/icon-button.tsx"],"sourcesContent":["import { VariantProps, cva } from 'class-variance-authority';\nimport { ElementRef, forwardRef } from 'react';\nimport { Flex } from '../flex';\n\nimport styles from './icon-button.module.css';\n\nconst iconButton = cva(styles.iconButton, {\n  variants: {\n    size: {\n      1: styles['iconButton-size-1'],\n      2: styles['iconButton-size-2'],\n      3: styles['iconButton-size-3'],\n      4: styles['iconButton-size-4']\n    }\n  },\n  defaultVariants: {\n    size: 2\n  }\n});\n\nexport interface IconButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof iconButton> {\n  size?: 1 | 2 | 3 | 4;\n  'aria-label'?: string;\n}\n\nexport const IconButton = forwardRef<ElementRef<'button'>, IconButtonProps>(\n  (\n    {\n      className,\n      size,\n      disabled,\n      children,\n      'aria-label': ariaLabel,\n      style,\n      ...props\n    },\n    ref\n  ) => (\n    <button\n      ref={ref}\n      className={iconButton({ size, className })}\n      disabled={disabled}\n      type='button'\n      aria-label={ariaLabel}\n      aria-disabled={disabled}\n      style={style}\n      {...props}\n    >\n      <Flex aria-hidden='true' align='center' justify='center'>\n        {children}\n      </Flex>\n    </button>\n  )\n);\n\nIconButton.displayName = 'IconButton';\n"],"names":["cva","styles","forwardRef","_jsx","Flex"],"mappings":";;;;;;;;AAMA,MAAM,UAAU,GAAGA,0BAAG,CAACC,yBAAM,CAAC,UAAU,EAAE;AACxC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC9B,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC9B,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC9B,YAAA,CAAC,EAAEA,yBAAM,CAAC,mBAAmB,CAAC;AAC/B,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,CAAC;AACR,KAAA;AACF,CAAA,CAAC,CAAC;AASU,MAAA,UAAU,GAAGC,gBAAU,CAClC,CACE,EACE,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,MAEHC,cAAA,CAAA,QAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAC1C,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,gBACD,SAAS,EAAA,eAAA,EACN,QAAQ,EACvB,KAAK,EAAE,KAAK,EAAA,GACR,KAAK,EAAA,QAAA,EAETA,eAACC,SAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,EACrD,QAAA,EAAA,QAAQ,GACJ,EACA,CAAA,CACV,EACD;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}

package/dist/components/icon-button/icon-button.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { cva } from 'class-variance-authority';
 import { forwardRef } from 'react';
 import { Flex } from '../flex/flex.js';
 import styles from './icon-button.module.css.js';

package/dist/components/image/image.cjs

@@ -2,10 +2,10 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var image_module = require('./image.module.css.cjs');
 
-const image = index.cva(image_module.default.image, {
+const image = classVarianceAuthority.cva(image_module.default.image, {
     variants: {
         fit: {
             contain: image_module.default['image-contain'],

package/dist/components/image/image.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
+import { cva } from 'class-variance-authority';
 import styles from './image.module.css.js';
 
 const image = cva(styles.image, {

package/dist/components/indicator/indicator.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var classVarianceAuthority = require('class-variance-authority');
 var indicator_module = require('./indicator.module.css.cjs');
 
-const indicator = index.cva(indicator_module.default.indicator, {
+const indicator = classVarianceAuthority.cva(indicator_module.default.indicator, {
     variants: {
         variant: {
             accent: indicator_module.default["indicator-variant-accent"],