@exem-ui/react 0.3.4-next.20261014014656 → 0.3.4-next.20261014050302

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,6 +3,7 @@ import * as React$1 from 'react';
3
3
  import React__default, { ComponentProps } from 'react';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
5
  import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
6
+ import { I as IconBaseProps } from './types-xnO0gkCW.js';
6
7
  import * as SelectPrimitive from '@radix-ui/react-select';
7
8
  import * as class_variance_authority_types from 'class-variance-authority/types';
8
9
  import { VariantProps } from '@exem-ui/core/utils';
@@ -147,13 +148,11 @@ type Icon = React.ReactElement<{
147
148
  className?: string;
148
149
  }>;
149
150
 
150
- type SegmentSize = 'small' | 'medium' | 'large';
151
+ type SegmentSize = 'xsmall' | 'small' | 'medium' | 'large';
151
152
  type SegmentListProps = React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.List>;
152
153
  type SegmentItemProps = React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger> & {
153
154
  /** 텍스트 왼쪽에 표시할 아이콘 요소 */
154
- leftIcon?: React__default.ReactElement<{
155
- className?: string;
156
- }>;
155
+ leftIcon?: React__default.ReactElement<IconBaseProps>;
157
156
  };
158
157
  type SegmentContentProps = React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>;
159
158
  type SegmentRootProps<T extends string = string> = Omit<React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>, 'value' | 'defaultValue' | 'onValueChange'> & {
@@ -3,6 +3,7 @@ import * as React$1 from 'react';
3
3
  import React__default, { ComponentProps } from 'react';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
5
  import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
6
+ import { I as IconBaseProps } from './types-xnO0gkCW.mjs';
6
7
  import * as SelectPrimitive from '@radix-ui/react-select';
7
8
  import * as class_variance_authority_types from 'class-variance-authority/types';
8
9
  import { VariantProps } from '@exem-ui/core/utils';
@@ -147,13 +148,11 @@ type Icon = React.ReactElement<{
147
148
  className?: string;
148
149
  }>;
149
150
 
150
- type SegmentSize = 'small' | 'medium' | 'large';
151
+ type SegmentSize = 'xsmall' | 'small' | 'medium' | 'large';
151
152
  type SegmentListProps = React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.List>;
152
153
  type SegmentItemProps = React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger> & {
153
154
  /** 텍스트 왼쪽에 표시할 아이콘 요소 */
154
- leftIcon?: React__default.ReactElement<{
155
- className?: string;
156
- }>;
155
+ leftIcon?: React__default.ReactElement<IconBaseProps>;
157
156
  };
158
157
  type SegmentContentProps = React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>;
159
158
  type SegmentRootProps<T extends string = string> = Omit<React__default.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>, 'value' | 'defaultValue' | 'onValueChange'> & {
@@ -895,6 +895,7 @@ var segmentListVariants = utils.cva(
895
895
  {
896
896
  variants: {
897
897
  size: {
898
+ xsmall: "h-6 gap-0 p-0.5",
898
899
  small: "h-7 gap-0 p-0.5",
899
900
  medium: "h-8 gap-0 p-0.5",
900
901
  large: "h-10 gap-0 p-0.5"
@@ -911,12 +912,14 @@ var segmentItemVariants = utils.cva(
911
912
  "focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-ring",
912
913
  "disabled:cursor-not-allowed",
913
914
  "data-[state=active]:bg-component-segmentedOption data-[state=active]:text-text-primary data-[state=active]:shadow-weak",
915
+ "[&[data-state=active]>svg]:text-icon-secondary",
914
916
  "data-[state=inactive]:text-text-tertiary data-[state=inactive]:disabled:text-text-disabled",
915
917
  "transition-colors duration-200 ease-in-out"
916
918
  ],
917
919
  {
918
920
  variants: {
919
921
  size: {
922
+ xsmall: "h-5 gap-0.5 text-caption font-medium",
920
923
  small: "h-6 gap-0.5 text-body-3 font-medium",
921
924
  medium: "h-7 gap-1 text-body-2 font-medium",
922
925
  large: "h-9 gap-1.5 text-body-2 font-medium"
@@ -927,18 +930,12 @@ var segmentItemVariants = utils.cva(
927
930
  }
928
931
  }
929
932
  );
930
- var segmentIconVariants = utils.cva("flex items-center justify-center", {
931
- variants: {
932
- size: {
933
- small: "size-4",
934
- medium: "size-4",
935
- large: "size-5"
936
- }
937
- },
938
- defaultVariants: {
939
- size: "medium"
940
- }
941
- });
933
+ var segmentIconSizeMap = {
934
+ xsmall: chunk6NFYQZSK_js.iconSizes.xs,
935
+ small: chunk6NFYQZSK_js.iconSizes.sm,
936
+ medium: chunk6NFYQZSK_js.iconSizes.sm,
937
+ large: chunk6NFYQZSK_js.iconSizes.md
938
+ };
942
939
  var SegmentContext = React.createContext(void 0);
943
940
  var useSegmentContext = () => {
944
941
  const context = React.useContext(SegmentContext);
@@ -973,7 +970,7 @@ Segment.Item = React.forwardRef(
973
970
  className: utils.cn(segmentItemVariants({ size }), className),
974
971
  ...props,
975
972
  children: [
976
- leftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn(segmentIconVariants({ size })), children: leftIcon }),
973
+ leftIcon && React.cloneElement(leftIcon, { size: segmentIconSizeMap[size] }),
977
974
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center", children })
978
975
  ]
979
976
  }
@@ -1,10 +1,10 @@
1
- import { ChevronDown, Search, Check } from './chunk-DKADAZLG.mjs';
1
+ import { iconSizes, ChevronDown, Search, Check } from './chunk-DKADAZLG.mjs';
2
2
  import { cva, cn } from '@exem-ui/core/utils';
3
3
  import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
4
4
  import { jsx, jsxs } from 'react/jsx-runtime';
5
5
  import { Combobox as Combobox$1 } from '@base-ui/react/combobox';
6
6
  import * as React from 'react';
7
- import { createContext, forwardRef, useId, useContext, createElement, useRef, useState } from 'react';
7
+ import { createContext, forwardRef, cloneElement, useId, useContext, createElement, useRef, useState } from 'react';
8
8
  import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
9
9
  import * as TabsPrimitive2 from '@radix-ui/react-tabs';
10
10
  import * as SelectPrimitive from '@radix-ui/react-select';
@@ -869,6 +869,7 @@ var segmentListVariants = cva(
869
869
  {
870
870
  variants: {
871
871
  size: {
872
+ xsmall: "h-6 gap-0 p-0.5",
872
873
  small: "h-7 gap-0 p-0.5",
873
874
  medium: "h-8 gap-0 p-0.5",
874
875
  large: "h-10 gap-0 p-0.5"
@@ -885,12 +886,14 @@ var segmentItemVariants = cva(
885
886
  "focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-ring",
886
887
  "disabled:cursor-not-allowed",
887
888
  "data-[state=active]:bg-component-segmentedOption data-[state=active]:text-text-primary data-[state=active]:shadow-weak",
889
+ "[&[data-state=active]>svg]:text-icon-secondary",
888
890
  "data-[state=inactive]:text-text-tertiary data-[state=inactive]:disabled:text-text-disabled",
889
891
  "transition-colors duration-200 ease-in-out"
890
892
  ],
891
893
  {
892
894
  variants: {
893
895
  size: {
896
+ xsmall: "h-5 gap-0.5 text-caption font-medium",
894
897
  small: "h-6 gap-0.5 text-body-3 font-medium",
895
898
  medium: "h-7 gap-1 text-body-2 font-medium",
896
899
  large: "h-9 gap-1.5 text-body-2 font-medium"
@@ -901,18 +904,12 @@ var segmentItemVariants = cva(
901
904
  }
902
905
  }
903
906
  );
904
- var segmentIconVariants = cva("flex items-center justify-center", {
905
- variants: {
906
- size: {
907
- small: "size-4",
908
- medium: "size-4",
909
- large: "size-5"
910
- }
911
- },
912
- defaultVariants: {
913
- size: "medium"
914
- }
915
- });
907
+ var segmentIconSizeMap = {
908
+ xsmall: iconSizes.xs,
909
+ small: iconSizes.sm,
910
+ medium: iconSizes.sm,
911
+ large: iconSizes.md
912
+ };
916
913
  var SegmentContext = createContext(void 0);
917
914
  var useSegmentContext = () => {
918
915
  const context = useContext(SegmentContext);
@@ -947,7 +944,7 @@ Segment.Item = forwardRef(
947
944
  className: cn(segmentItemVariants({ size }), className),
948
945
  ...props,
949
946
  children: [
950
- leftIcon && /* @__PURE__ */ jsx("span", { className: cn(segmentIconVariants({ size })), children: leftIcon }),
947
+ leftIcon && cloneElement(leftIcon, { size: segmentIconSizeMap[size] }),
951
948
  /* @__PURE__ */ jsx("span", { className: "flex items-center", children })
952
949
  ]
953
950
  }
@@ -1,9 +1,10 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { C as ColorPaletteColor, G as ColorPaletteProps, I as Icon, S as Size, V as Variant, u as SegmentItemProps, w as SegmentRootProps, g as Select, f as TabsTriggerProps, e as TabsRootProps } from '../FlatTooltip-CQYzMWkr.mjs';
3
- export { Q as ConditionalTooltip, a as ConditionalTooltipProps, R as FlatTooltip, O as FlatTooltipProps, P as TooltipConfig } from '../FlatTooltip-CQYzMWkr.mjs';
2
+ import { C as ColorPaletteColor, G as ColorPaletteProps, I as Icon, S as Size, V as Variant, u as SegmentItemProps, w as SegmentRootProps, g as Select, f as TabsTriggerProps, e as TabsRootProps } from '../FlatTooltip-Dur9oGCh.mjs';
3
+ export { Q as ConditionalTooltip, a as ConditionalTooltipProps, R as FlatTooltip, O as FlatTooltipProps, P as TooltipConfig } from '../FlatTooltip-Dur9oGCh.mjs';
4
4
  import { ReactNode, ComponentProps } from 'react';
5
5
  import '@radix-ui/react-tabs';
6
6
  import '@radix-ui/react-radio-group';
7
+ import '../types-xnO0gkCW.mjs';
7
8
  import '@radix-ui/react-select';
8
9
  import 'class-variance-authority/types';
9
10
  import '@exem-ui/core/utils';
@@ -1,9 +1,10 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { C as ColorPaletteColor, G as ColorPaletteProps, I as Icon, S as Size, V as Variant, u as SegmentItemProps, w as SegmentRootProps, g as Select, f as TabsTriggerProps, e as TabsRootProps } from '../FlatTooltip-CQYzMWkr.js';
3
- export { Q as ConditionalTooltip, a as ConditionalTooltipProps, R as FlatTooltip, O as FlatTooltipProps, P as TooltipConfig } from '../FlatTooltip-CQYzMWkr.js';
2
+ import { C as ColorPaletteColor, G as ColorPaletteProps, I as Icon, S as Size, V as Variant, u as SegmentItemProps, w as SegmentRootProps, g as Select, f as TabsTriggerProps, e as TabsRootProps } from '../FlatTooltip-CksJEO8x.js';
3
+ export { Q as ConditionalTooltip, a as ConditionalTooltipProps, R as FlatTooltip, O as FlatTooltipProps, P as TooltipConfig } from '../FlatTooltip-CksJEO8x.js';
4
4
  import { ReactNode, ComponentProps } from 'react';
5
5
  import '@radix-ui/react-tabs';
6
6
  import '@radix-ui/react-radio-group';
7
+ import '../types-xnO0gkCW.js';
7
8
  import '@radix-ui/react-select';
8
9
  import 'class-variance-authority/types';
9
10
  import '@exem-ui/core/utils';
@@ -1,35 +1,35 @@
1
1
  'use strict';
2
2
 
3
- var chunkMC4SYR5X_js = require('../chunk-MC4SYR5X.js');
3
+ var chunk3LVJLFY6_js = require('../chunk-3LVJLFY6.js');
4
4
  require('../chunk-6NFYQZSK.js');
5
5
 
6
6
 
7
7
 
8
8
  Object.defineProperty(exports, "ConditionalTooltip", {
9
9
  enumerable: true,
10
- get: function () { return chunkMC4SYR5X_js.ConditionalTooltip; }
10
+ get: function () { return chunk3LVJLFY6_js.ConditionalTooltip; }
11
11
  });
12
12
  Object.defineProperty(exports, "FlatColorPalette", {
13
13
  enumerable: true,
14
- get: function () { return chunkMC4SYR5X_js.FlatColorPalette; }
14
+ get: function () { return chunk3LVJLFY6_js.FlatColorPalette; }
15
15
  });
16
16
  Object.defineProperty(exports, "FlatCombobox", {
17
17
  enumerable: true,
18
- get: function () { return chunkMC4SYR5X_js.FlatCombobox; }
18
+ get: function () { return chunk3LVJLFY6_js.FlatCombobox; }
19
19
  });
20
20
  Object.defineProperty(exports, "FlatSegment", {
21
21
  enumerable: true,
22
- get: function () { return chunkMC4SYR5X_js.FlatSegment; }
22
+ get: function () { return chunk3LVJLFY6_js.FlatSegment; }
23
23
  });
24
24
  Object.defineProperty(exports, "FlatSelect", {
25
25
  enumerable: true,
26
- get: function () { return chunkMC4SYR5X_js.FlatSelect; }
26
+ get: function () { return chunk3LVJLFY6_js.FlatSelect; }
27
27
  });
28
28
  Object.defineProperty(exports, "FlatTabs", {
29
29
  enumerable: true,
30
- get: function () { return chunkMC4SYR5X_js.FlatTabs; }
30
+ get: function () { return chunk3LVJLFY6_js.FlatTabs; }
31
31
  });
32
32
  Object.defineProperty(exports, "FlatTooltip", {
33
33
  enumerable: true,
34
- get: function () { return chunkMC4SYR5X_js.FlatTooltip; }
34
+ get: function () { return chunk3LVJLFY6_js.FlatTooltip; }
35
35
  });
@@ -1,2 +1,2 @@
1
- export { ConditionalTooltip, FlatColorPalette, FlatCombobox, FlatSegment, FlatSelect, FlatTabs, FlatTooltip } from '../chunk-5SYAB4WP.mjs';
1
+ export { ConditionalTooltip, FlatColorPalette, FlatCombobox, FlatSegment, FlatSelect, FlatTabs, FlatTooltip } from '../chunk-BRB66UJW.mjs';
2
2
  import '../chunk-DKADAZLG.mjs';
package/dist/index.d.mts CHANGED
@@ -2,8 +2,8 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
2
2
  import { VariantProps } from '@exem-ui/core/utils';
3
3
  import * as React$1 from 'react';
4
4
  import React__default, { ComponentProps } from 'react';
5
- import { C as ColorPaletteColor, a as ConditionalTooltipProps, S as Size$1, I as Icon, V as Variant } from './FlatTooltip-CQYzMWkr.mjs';
6
- export { J as ColorPalette, K as ColorPaletteColors, G as ColorPaletteProps, H as ColorPaletteSwatchProps, L as DEFAULT_COLOR, r as Segment, s as SegmentComponent, t as SegmentContentProps, u as SegmentItemProps, v as SegmentListProps, w as SegmentRootProps, g as Select, h as SelectBoxProps, i as SelectComponent, j as SelectDescriptionProps, k as SelectEmptyProps, l as SelectGroupProps, m as SelectItemProps, n as SelectLabelProps, o as SelectListProps, p as SelectRootProps, q as SelectTriggerProps, T as Tabs, b as TabsComponent, c as TabsContentProps, d as TabsListProps, e as TabsRootProps, f as TabsTriggerProps, x as Tooltip, y as TooltipComponent, z as TooltipContentProps, A as TooltipDescriptionProps, B as TooltipProviderProps, D as TooltipRootProps, E as TooltipTitleProps, F as TooltipTriggerProps, M as getColorPaletteColor, N as isInPalette } from './FlatTooltip-CQYzMWkr.mjs';
5
+ import { C as ColorPaletteColor, a as ConditionalTooltipProps, S as Size$1, I as Icon, V as Variant } from './FlatTooltip-Dur9oGCh.mjs';
6
+ export { J as ColorPalette, K as ColorPaletteColors, G as ColorPaletteProps, H as ColorPaletteSwatchProps, L as DEFAULT_COLOR, r as Segment, s as SegmentComponent, t as SegmentContentProps, u as SegmentItemProps, v as SegmentListProps, w as SegmentRootProps, g as Select, h as SelectBoxProps, i as SelectComponent, j as SelectDescriptionProps, k as SelectEmptyProps, l as SelectGroupProps, m as SelectItemProps, n as SelectLabelProps, o as SelectListProps, p as SelectRootProps, q as SelectTriggerProps, T as Tabs, b as TabsComponent, c as TabsContentProps, d as TabsListProps, e as TabsRootProps, f as TabsTriggerProps, x as Tooltip, y as TooltipComponent, z as TooltipContentProps, A as TooltipDescriptionProps, B as TooltipProviderProps, D as TooltipRootProps, E as TooltipTitleProps, F as TooltipTriggerProps, M as getColorPaletteColor, N as isInPalette } from './FlatTooltip-Dur9oGCh.mjs';
7
7
  import * as react_jsx_runtime from 'react/jsx-runtime';
8
8
  import { Button as Button$1 } from '@base-ui/react/button';
9
9
  import { I as IconBaseProps } from './types-xnO0gkCW.mjs';
package/dist/index.d.ts CHANGED
@@ -2,8 +2,8 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
2
2
  import { VariantProps } from '@exem-ui/core/utils';
3
3
  import * as React$1 from 'react';
4
4
  import React__default, { ComponentProps } from 'react';
5
- import { C as ColorPaletteColor, a as ConditionalTooltipProps, S as Size$1, I as Icon, V as Variant } from './FlatTooltip-CQYzMWkr.js';
6
- export { J as ColorPalette, K as ColorPaletteColors, G as ColorPaletteProps, H as ColorPaletteSwatchProps, L as DEFAULT_COLOR, r as Segment, s as SegmentComponent, t as SegmentContentProps, u as SegmentItemProps, v as SegmentListProps, w as SegmentRootProps, g as Select, h as SelectBoxProps, i as SelectComponent, j as SelectDescriptionProps, k as SelectEmptyProps, l as SelectGroupProps, m as SelectItemProps, n as SelectLabelProps, o as SelectListProps, p as SelectRootProps, q as SelectTriggerProps, T as Tabs, b as TabsComponent, c as TabsContentProps, d as TabsListProps, e as TabsRootProps, f as TabsTriggerProps, x as Tooltip, y as TooltipComponent, z as TooltipContentProps, A as TooltipDescriptionProps, B as TooltipProviderProps, D as TooltipRootProps, E as TooltipTitleProps, F as TooltipTriggerProps, M as getColorPaletteColor, N as isInPalette } from './FlatTooltip-CQYzMWkr.js';
5
+ import { C as ColorPaletteColor, a as ConditionalTooltipProps, S as Size$1, I as Icon, V as Variant } from './FlatTooltip-CksJEO8x.js';
6
+ export { J as ColorPalette, K as ColorPaletteColors, G as ColorPaletteProps, H as ColorPaletteSwatchProps, L as DEFAULT_COLOR, r as Segment, s as SegmentComponent, t as SegmentContentProps, u as SegmentItemProps, v as SegmentListProps, w as SegmentRootProps, g as Select, h as SelectBoxProps, i as SelectComponent, j as SelectDescriptionProps, k as SelectEmptyProps, l as SelectGroupProps, m as SelectItemProps, n as SelectLabelProps, o as SelectListProps, p as SelectRootProps, q as SelectTriggerProps, T as Tabs, b as TabsComponent, c as TabsContentProps, d as TabsListProps, e as TabsRootProps, f as TabsTriggerProps, x as Tooltip, y as TooltipComponent, z as TooltipContentProps, A as TooltipDescriptionProps, B as TooltipProviderProps, D as TooltipRootProps, E as TooltipTitleProps, F as TooltipTriggerProps, M as getColorPaletteColor, N as isInPalette } from './FlatTooltip-CksJEO8x.js';
7
7
  import * as react_jsx_runtime from 'react/jsx-runtime';
8
8
  import { Button as Button$1 } from '@base-ui/react/button';
9
9
  import { I as IconBaseProps } from './types-xnO0gkCW.js';
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var chunkMC4SYR5X_js = require('./chunk-MC4SYR5X.js');
3
+ var chunk3LVJLFY6_js = require('./chunk-3LVJLFY6.js');
4
4
  var chunk6NFYQZSK_js = require('./chunk-6NFYQZSK.js');
5
5
  var utils = require('@exem-ui/core/utils');
6
6
  var React = require('react');
@@ -560,7 +560,7 @@ function IconButton({
560
560
  ...props
561
561
  }) {
562
562
  const tooltipLabel = typeof tooltip === "string" ? tooltip : void 0;
563
- return /* @__PURE__ */ jsxRuntime.jsx(chunkMC4SYR5X_js.ConditionalTooltip, { tooltip, children: /* @__PURE__ */ jsxRuntime.jsx(
563
+ return /* @__PURE__ */ jsxRuntime.jsx(chunk3LVJLFY6_js.ConditionalTooltip, { tooltip, children: /* @__PURE__ */ jsxRuntime.jsx(
564
564
  Button,
565
565
  {
566
566
  "aria-label": ariaLabel ?? (ariaLabelledBy === void 0 ? tooltipLabel : void 0),
@@ -624,7 +624,7 @@ function ButtonGroup({
624
624
  item.id
625
625
  );
626
626
  }
627
- return /* @__PURE__ */ jsxRuntime.jsx(chunkMC4SYR5X_js.ConditionalTooltip, { tooltip: item.tooltip, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonBaseProps, leftIcon: item.icon, children: item.label }) }, item.id);
627
+ return /* @__PURE__ */ jsxRuntime.jsx(chunk3LVJLFY6_js.ConditionalTooltip, { tooltip: item.tooltip, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { ...buttonBaseProps, leftIcon: item.icon, children: item.label }) }, item.id);
628
628
  })
629
629
  }
630
630
  );
@@ -1024,12 +1024,12 @@ function DatePicker({ type = "single", showOutsideDays = true, ...rest }) {
1024
1024
  }
1025
1025
  var dropdownVariants = {
1026
1026
  content: utils.cn(
1027
- chunkMC4SYR5X_js.overlayListVariants.content,
1027
+ chunk3LVJLFY6_js.overlayListVariants.content,
1028
1028
  "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
1029
1029
  ),
1030
- viewport: chunkMC4SYR5X_js.overlayListVariants.viewport,
1031
- item: (props) => utils.cn(chunkMC4SYR5X_js.overlayListVariants.item(props), "focus:bg-elevation-elevation-2"),
1032
- slotSize: chunkMC4SYR5X_js.overlayListVariants.slotSize,
1030
+ viewport: chunk3LVJLFY6_js.overlayListVariants.viewport,
1031
+ item: (props) => utils.cn(chunk3LVJLFY6_js.overlayListVariants.item(props), "focus:bg-elevation-elevation-2"),
1032
+ slotSize: chunk3LVJLFY6_js.overlayListVariants.slotSize,
1033
1033
  separator: utils.cn("my-0.5 h-px bg-border-primary"),
1034
1034
  label: utils.cva("px-2 font-medium text-text-secondary", {
1035
1035
  defaultVariants: { size: "medium" },
@@ -1080,9 +1080,9 @@ Dropdown.Item = React.forwardRef(({ className, children, leftSlot, rightSlot, si
1080
1080
  className: utils.cn(dropdownVariants.item({ size }), className),
1081
1081
  ...props,
1082
1082
  children: [
1083
- leftSlot && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkMC4SYR5X_js.overlayListVariants.slotSize({ size }), children: leftSlot }),
1084
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn(chunkMC4SYR5X_js.overlayListVariants.itemText({ size }), "min-w-0 flex-1 truncate"), children }),
1085
- rightSlot && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkMC4SYR5X_js.overlayListVariants.slotSize({ size }), children: rightSlot })
1083
+ leftSlot && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunk3LVJLFY6_js.overlayListVariants.slotSize({ size }), children: leftSlot }),
1084
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn(chunk3LVJLFY6_js.overlayListVariants.itemText({ size }), "min-w-0 flex-1 truncate"), children }),
1085
+ rightSlot && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunk3LVJLFY6_js.overlayListVariants.slotSize({ size }), children: rightSlot })
1086
1086
  ]
1087
1087
  }
1088
1088
  );
@@ -1127,8 +1127,8 @@ var useTextAreaContext = () => {
1127
1127
  return context;
1128
1128
  };
1129
1129
  var textAreaVariants = {
1130
- container: chunkMC4SYR5X_js.commonInputVariants.container,
1131
- label: chunkMC4SYR5X_js.commonInputVariants.label,
1130
+ container: chunk3LVJLFY6_js.commonInputVariants.container,
1131
+ label: chunk3LVJLFY6_js.commonInputVariants.label,
1132
1132
  field: utils.cva(
1133
1133
  "scrollbar-overlay block w-full resize-none rounded-medium border transition-colors focus:outline-none",
1134
1134
  {
@@ -1182,7 +1182,7 @@ var textAreaVariants = {
1182
1182
  },
1183
1183
  defaultVariants: { size: "medium" }
1184
1184
  }),
1185
- description: chunkMC4SYR5X_js.commonInputVariants.description,
1185
+ description: chunk3LVJLFY6_js.commonInputVariants.description,
1186
1186
  counter: utils.cva("text-nowrap font-regular", {
1187
1187
  variants: {
1188
1188
  disabled: {
@@ -1323,7 +1323,7 @@ var TextField = React.forwardRef(
1323
1323
  }, ref) => {
1324
1324
  const uniqueId = React.useId();
1325
1325
  const id = providedId || `text-field-${uniqueId}`;
1326
- return /* @__PURE__ */ jsxRuntime.jsx(TextFieldContext.Provider, { value: { variant, size, error, disabled, id, value, onChange }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: utils.cn(chunkMC4SYR5X_js.textFieldVariants.container(), className), children: children || /* @__PURE__ */ jsxRuntime.jsx(TextField.Input, { ...inputProps }) }) });
1326
+ return /* @__PURE__ */ jsxRuntime.jsx(TextFieldContext.Provider, { value: { variant, size, error, disabled, id, value, onChange }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: utils.cn(chunk3LVJLFY6_js.textFieldVariants.container(), className), children: children || /* @__PURE__ */ jsxRuntime.jsx(TextField.Input, { ...inputProps }) }) });
1327
1327
  }
1328
1328
  );
1329
1329
  TextField.Label = React.forwardRef(
@@ -1334,7 +1334,7 @@ TextField.Label = React.forwardRef(
1334
1334
  {
1335
1335
  ref,
1336
1336
  htmlFor: id,
1337
- className: utils.cn(chunkMC4SYR5X_js.textFieldVariants.label({ size, disabled, required }), className),
1337
+ className: utils.cn(chunk3LVJLFY6_js.textFieldVariants.label({ size, disabled, required }), className),
1338
1338
  children
1339
1339
  }
1340
1340
  );
@@ -1353,11 +1353,11 @@ TextField.Input = React.forwardRef(
1353
1353
  } = useTextFieldContext();
1354
1354
  const state = disabled ? "disabled" : error ? "error" : "default";
1355
1355
  const isControlled = contextValue !== void 0;
1356
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn(chunkMC4SYR5X_js.textFieldVariants.wrapper({ variant, size, state }), className), children: [
1356
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn(chunk3LVJLFY6_js.textFieldVariants.wrapper({ variant, size, state }), className), children: [
1357
1357
  leftIcon && /* @__PURE__ */ jsxRuntime.jsx(
1358
1358
  "span",
1359
1359
  {
1360
- className: utils.cn("flex items-center justify-center", chunkMC4SYR5X_js.textFieldVariants.icon({ size })),
1360
+ className: utils.cn("flex items-center justify-center", chunk3LVJLFY6_js.textFieldVariants.icon({ size })),
1361
1361
  children: leftIcon
1362
1362
  }
1363
1363
  ),
@@ -1368,7 +1368,7 @@ TextField.Input = React.forwardRef(
1368
1368
  ref,
1369
1369
  id,
1370
1370
  disabled,
1371
- className: utils.cn(chunkMC4SYR5X_js.textFieldVariants.input({ size, state })),
1371
+ className: utils.cn(chunk3LVJLFY6_js.textFieldVariants.input({ size, state })),
1372
1372
  onChange: (e) => {
1373
1373
  contextOnChange?.(e);
1374
1374
  },
@@ -1376,12 +1376,12 @@ TextField.Input = React.forwardRef(
1376
1376
  ...isControlled ? { value: contextValue } : {}
1377
1377
  }
1378
1378
  ),
1379
- subText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn(chunkMC4SYR5X_js.textFieldVariants.subText({ size, disabled })), children: subText })
1379
+ subText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn(chunk3LVJLFY6_js.textFieldVariants.subText({ size, disabled })), children: subText })
1380
1380
  ] }),
1381
1381
  rightIcon && /* @__PURE__ */ jsxRuntime.jsx(
1382
1382
  "span",
1383
1383
  {
1384
- className: utils.cn("flex items-center justify-center", chunkMC4SYR5X_js.textFieldVariants.icon({ size })),
1384
+ className: utils.cn("flex items-center justify-center", chunk3LVJLFY6_js.textFieldVariants.icon({ size })),
1385
1385
  children: rightIcon
1386
1386
  }
1387
1387
  )
@@ -1395,7 +1395,7 @@ TextField.Description = React.forwardRef(
1395
1395
  "p",
1396
1396
  {
1397
1397
  ref,
1398
- className: utils.cn(chunkMC4SYR5X_js.textFieldVariants.description({ size, error, disabled }), className),
1398
+ className: utils.cn(chunk3LVJLFY6_js.textFieldVariants.description({ size, error, disabled }), className),
1399
1399
  children
1400
1400
  }
1401
1401
  );
@@ -1514,7 +1514,7 @@ function ModalBody({
1514
1514
  scroll && "h-full [&_[data-slot=scroll-area-viewport]>div]:h-full"
1515
1515
  ),
1516
1516
  ...props,
1517
- children: scroll ? /* @__PURE__ */ jsxRuntime.jsx(chunkMC4SYR5X_js.ScrollArea, { className: "h-full flex flex-col", disableHorizontalScroll: !horizontalScroll, children: content }) : content
1517
+ children: scroll ? /* @__PURE__ */ jsxRuntime.jsx(chunk3LVJLFY6_js.ScrollArea, { className: "h-full flex flex-col", disableHorizontalScroll: !horizontalScroll, children: content }) : content
1518
1518
  }
1519
1519
  );
1520
1520
  }
@@ -1900,7 +1900,7 @@ Sheet.Body = React.forwardRef(
1900
1900
  ),
1901
1901
  ...props,
1902
1902
  children: /* @__PURE__ */ jsxRuntime.jsx(
1903
- chunkMC4SYR5X_js.ScrollArea,
1903
+ chunk3LVJLFY6_js.ScrollArea,
1904
1904
  {
1905
1905
  className: "h-full flex flex-col",
1906
1906
  disableHorizontalScroll,
@@ -2554,95 +2554,95 @@ var buttonize = (fn) => {
2554
2554
 
2555
2555
  Object.defineProperty(exports, "ColorPalette", {
2556
2556
  enumerable: true,
2557
- get: function () { return chunkMC4SYR5X_js.ColorPalette; }
2557
+ get: function () { return chunk3LVJLFY6_js.ColorPalette; }
2558
2558
  });
2559
2559
  Object.defineProperty(exports, "ColorPaletteColors", {
2560
2560
  enumerable: true,
2561
- get: function () { return chunkMC4SYR5X_js.ColorPaletteColors; }
2561
+ get: function () { return chunk3LVJLFY6_js.ColorPaletteColors; }
2562
2562
  });
2563
2563
  Object.defineProperty(exports, "Combobox", {
2564
2564
  enumerable: true,
2565
- get: function () { return chunkMC4SYR5X_js.Combobox; }
2565
+ get: function () { return chunk3LVJLFY6_js.Combobox; }
2566
2566
  });
2567
2567
  Object.defineProperty(exports, "ComboboxContent", {
2568
2568
  enumerable: true,
2569
- get: function () { return chunkMC4SYR5X_js.ComboboxContent; }
2569
+ get: function () { return chunk3LVJLFY6_js.ComboboxContent; }
2570
2570
  });
2571
2571
  Object.defineProperty(exports, "ComboboxDescription", {
2572
2572
  enumerable: true,
2573
- get: function () { return chunkMC4SYR5X_js.ComboboxDescription; }
2573
+ get: function () { return chunk3LVJLFY6_js.ComboboxDescription; }
2574
2574
  });
2575
2575
  Object.defineProperty(exports, "ComboboxEmpty", {
2576
2576
  enumerable: true,
2577
- get: function () { return chunkMC4SYR5X_js.ComboboxEmpty; }
2577
+ get: function () { return chunk3LVJLFY6_js.ComboboxEmpty; }
2578
2578
  });
2579
2579
  Object.defineProperty(exports, "ComboboxInput", {
2580
2580
  enumerable: true,
2581
- get: function () { return chunkMC4SYR5X_js.ComboboxInput; }
2581
+ get: function () { return chunk3LVJLFY6_js.ComboboxInput; }
2582
2582
  });
2583
2583
  Object.defineProperty(exports, "ComboboxItem", {
2584
2584
  enumerable: true,
2585
- get: function () { return chunkMC4SYR5X_js.ComboboxItem; }
2585
+ get: function () { return chunk3LVJLFY6_js.ComboboxItem; }
2586
2586
  });
2587
2587
  Object.defineProperty(exports, "ComboboxLabel", {
2588
2588
  enumerable: true,
2589
- get: function () { return chunkMC4SYR5X_js.ComboboxLabel; }
2589
+ get: function () { return chunk3LVJLFY6_js.ComboboxLabel; }
2590
2590
  });
2591
2591
  Object.defineProperty(exports, "ComboboxList", {
2592
2592
  enumerable: true,
2593
- get: function () { return chunkMC4SYR5X_js.ComboboxList; }
2593
+ get: function () { return chunk3LVJLFY6_js.ComboboxList; }
2594
2594
  });
2595
2595
  Object.defineProperty(exports, "ComboboxSearch", {
2596
2596
  enumerable: true,
2597
- get: function () { return chunkMC4SYR5X_js.ComboboxSearch; }
2597
+ get: function () { return chunk3LVJLFY6_js.ComboboxSearch; }
2598
2598
  });
2599
2599
  Object.defineProperty(exports, "ComboboxTrigger", {
2600
2600
  enumerable: true,
2601
- get: function () { return chunkMC4SYR5X_js.ComboboxTrigger; }
2601
+ get: function () { return chunk3LVJLFY6_js.ComboboxTrigger; }
2602
2602
  });
2603
2603
  Object.defineProperty(exports, "ComboboxValue", {
2604
2604
  enumerable: true,
2605
- get: function () { return chunkMC4SYR5X_js.ComboboxValue; }
2605
+ get: function () { return chunk3LVJLFY6_js.ComboboxValue; }
2606
2606
  });
2607
2607
  Object.defineProperty(exports, "DEFAULT_COLOR", {
2608
2608
  enumerable: true,
2609
- get: function () { return chunkMC4SYR5X_js.DEFAULT_COLOR; }
2609
+ get: function () { return chunk3LVJLFY6_js.DEFAULT_COLOR; }
2610
2610
  });
2611
2611
  Object.defineProperty(exports, "ScrollArea", {
2612
2612
  enumerable: true,
2613
- get: function () { return chunkMC4SYR5X_js.ScrollArea; }
2613
+ get: function () { return chunk3LVJLFY6_js.ScrollArea; }
2614
2614
  });
2615
2615
  Object.defineProperty(exports, "ScrollBar", {
2616
2616
  enumerable: true,
2617
- get: function () { return chunkMC4SYR5X_js.ScrollBar; }
2617
+ get: function () { return chunk3LVJLFY6_js.ScrollBar; }
2618
2618
  });
2619
2619
  Object.defineProperty(exports, "Segment", {
2620
2620
  enumerable: true,
2621
- get: function () { return chunkMC4SYR5X_js.Segment; }
2621
+ get: function () { return chunk3LVJLFY6_js.Segment; }
2622
2622
  });
2623
2623
  Object.defineProperty(exports, "Select", {
2624
2624
  enumerable: true,
2625
- get: function () { return chunkMC4SYR5X_js.Select; }
2625
+ get: function () { return chunk3LVJLFY6_js.Select; }
2626
2626
  });
2627
2627
  Object.defineProperty(exports, "Tabs", {
2628
2628
  enumerable: true,
2629
- get: function () { return chunkMC4SYR5X_js.Tabs; }
2629
+ get: function () { return chunk3LVJLFY6_js.Tabs; }
2630
2630
  });
2631
2631
  Object.defineProperty(exports, "Tooltip", {
2632
2632
  enumerable: true,
2633
- get: function () { return chunkMC4SYR5X_js.Tooltip; }
2633
+ get: function () { return chunk3LVJLFY6_js.Tooltip; }
2634
2634
  });
2635
2635
  Object.defineProperty(exports, "colorPaletteColorClasses", {
2636
2636
  enumerable: true,
2637
- get: function () { return chunkMC4SYR5X_js.colorPaletteColorClasses; }
2637
+ get: function () { return chunk3LVJLFY6_js.colorPaletteColorClasses; }
2638
2638
  });
2639
2639
  Object.defineProperty(exports, "getColorPaletteColor", {
2640
2640
  enumerable: true,
2641
- get: function () { return chunkMC4SYR5X_js.getColorPaletteColor; }
2641
+ get: function () { return chunk3LVJLFY6_js.getColorPaletteColor; }
2642
2642
  });
2643
2643
  Object.defineProperty(exports, "isInPalette", {
2644
2644
  enumerable: true,
2645
- get: function () { return chunkMC4SYR5X_js.isInPalette; }
2645
+ get: function () { return chunk3LVJLFY6_js.isInPalette; }
2646
2646
  });
2647
2647
  exports.Avatar = Avatar;
2648
2648
  exports.Badge = Badge;
package/dist/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
- import { overlayListVariants, commonInputVariants, textFieldVariants, ScrollArea, ConditionalTooltip } from './chunk-5SYAB4WP.mjs';
2
- export { ColorPalette, ColorPaletteColors, Combobox, ComboboxContent, ComboboxDescription, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSearch, ComboboxTrigger, ComboboxValue, DEFAULT_COLOR, ScrollArea, ScrollBar, Segment, Select, Tabs, Tooltip, colorPaletteColorClasses, getColorPaletteColor, isInPalette } from './chunk-5SYAB4WP.mjs';
1
+ import { overlayListVariants, commonInputVariants, textFieldVariants, ScrollArea, ConditionalTooltip } from './chunk-BRB66UJW.mjs';
2
+ export { ColorPalette, ColorPaletteColors, Combobox, ComboboxContent, ComboboxDescription, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSearch, ComboboxTrigger, ComboboxValue, DEFAULT_COLOR, ScrollArea, ScrollBar, Segment, Select, Tabs, Tooltip, colorPaletteColorClasses, getColorPaletteColor, isInPalette } from './chunk-BRB66UJW.mjs';
3
3
  import { X, MoreHorizontal, iconSizes, Minus, Check, Person, Loading, Warning, Info, Error as Error$1, ChevronLeft, ChevronRight } from './chunk-DKADAZLG.mjs';
4
4
  import { cva, cn } from '@exem-ui/core/utils';
5
5
  import * as React from 'react';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@exem-ui/react",
3
- "version": "0.3.4-next.20261014014656",
3
+ "version": "0.3.4-next.20261014050302",
4
4
  "description": "Exem Design System - React Components",
5
5
  "author": "Exem Design Team",
6
6
  "license": "Apache-2.0",
@@ -100,7 +100,7 @@
100
100
  "tailwind-merge": "^3.3.1",
101
101
  "tailwind-scrollbar-hide": "^4.0.0",
102
102
  "tiny-invariant": "^1.3.3",
103
- "@exem-ui/core": "0.3.3-next.20261014014656"
103
+ "@exem-ui/core": "0.3.3-next.20261014050302"
104
104
  },
105
105
  "devDependencies": {
106
106
  "@eslint/js": "^9.15.0",
@@ -136,7 +136,7 @@
136
136
  "tsup": "^8.5.0",
137
137
  "typescript": "^5.8.2",
138
138
  "typescript-eslint": "^8.16.0",
139
- "@exem-ui/tailwindcss3": "0.3.2-next.20261014014656"
139
+ "@exem-ui/tailwindcss3": "0.3.2-next.20261014050302"
140
140
  },
141
141
  "scripts": {
142
142
  "generate": "node scripts/generate-icons.js",