@exem-ui/react 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +190 -0
- package/README.en.md +142 -0
- package/README.md +156 -18
- package/dist/index.d.mts +1166 -37
- package/dist/index.d.ts +1166 -37
- package/dist/index.js +3055 -130
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3016 -27
- package/dist/index.mjs.map +1 -1
- package/package.json +24 -143
- package/dist/Button-CMenVfb7.d.mts +0 -35
- package/dist/Button-CMenVfb7.d.ts +0 -35
- package/dist/Select-DMvWV_rF.d.mts +0 -94
- package/dist/Select-DMvWV_rF.d.ts +0 -94
- package/dist/avatar/index.d.mts +0 -37
- package/dist/avatar/index.d.ts +0 -37
- package/dist/avatar/index.js +0 -13
- package/dist/avatar/index.js.map +0 -1
- package/dist/avatar/index.mjs +0 -4
- package/dist/avatar/index.mjs.map +0 -1
- package/dist/badge/index.d.mts +0 -29
- package/dist/badge/index.d.ts +0 -29
- package/dist/badge/index.js +0 -12
- package/dist/badge/index.js.map +0 -1
- package/dist/badge/index.mjs +0 -3
- package/dist/badge/index.mjs.map +0 -1
- package/dist/breadcrumb/index.d.mts +0 -43
- package/dist/breadcrumb/index.d.ts +0 -43
- package/dist/breadcrumb/index.js +0 -13
- package/dist/breadcrumb/index.js.map +0 -1
- package/dist/breadcrumb/index.mjs +0 -4
- package/dist/breadcrumb/index.mjs.map +0 -1
- package/dist/button/index.d.mts +0 -9
- package/dist/button/index.d.ts +0 -9
- package/dist/button/index.js +0 -29
- package/dist/button/index.js.map +0 -1
- package/dist/button/index.mjs +0 -12
- package/dist/button/index.mjs.map +0 -1
- package/dist/checkbox/index.d.mts +0 -54
- package/dist/checkbox/index.d.ts +0 -54
- package/dist/checkbox/index.js +0 -13
- package/dist/checkbox/index.js.map +0 -1
- package/dist/checkbox/index.mjs +0 -4
- package/dist/checkbox/index.mjs.map +0 -1
- package/dist/chunk-34QIGWCT.mjs +0 -10
- package/dist/chunk-34QIGWCT.mjs.map +0 -1
- package/dist/chunk-3FPMWAQT.js +0 -30
- package/dist/chunk-3FPMWAQT.js.map +0 -1
- package/dist/chunk-3HMT3DQV.js +0 -104
- package/dist/chunk-3HMT3DQV.js.map +0 -1
- package/dist/chunk-4WAO7CUT.mjs +0 -95
- package/dist/chunk-4WAO7CUT.mjs.map +0 -1
- package/dist/chunk-5QX4TO4F.js +0 -61
- package/dist/chunk-5QX4TO4F.js.map +0 -1
- package/dist/chunk-5TEFN2CW.js +0 -97
- package/dist/chunk-5TEFN2CW.js.map +0 -1
- package/dist/chunk-5TES5PG6.js +0 -41
- package/dist/chunk-5TES5PG6.js.map +0 -1
- package/dist/chunk-5TVMECVF.js +0 -148
- package/dist/chunk-5TVMECVF.js.map +0 -1
- package/dist/chunk-5WGNZX7Z.mjs +0 -27
- package/dist/chunk-5WGNZX7Z.mjs.map +0 -1
- package/dist/chunk-AQ3OIM2T.js +0 -103
- package/dist/chunk-AQ3OIM2T.js.map +0 -1
- package/dist/chunk-AU5NTBK3.js +0 -361
- package/dist/chunk-AU5NTBK3.js.map +0 -1
- package/dist/chunk-DJHGCJR4.mjs +0 -224
- package/dist/chunk-DJHGCJR4.mjs.map +0 -1
- package/dist/chunk-DPUTW5KD.mjs +0 -74
- package/dist/chunk-DPUTW5KD.mjs.map +0 -1
- package/dist/chunk-E53FHDVN.mjs +0 -336
- package/dist/chunk-E53FHDVN.mjs.map +0 -1
- package/dist/chunk-ECRQD7UU.js +0 -82
- package/dist/chunk-ECRQD7UU.js.map +0 -1
- package/dist/chunk-FB4ESGOX.mjs +0 -59
- package/dist/chunk-FB4ESGOX.mjs.map +0 -1
- package/dist/chunk-FDX4IQK5.js +0 -76
- package/dist/chunk-FDX4IQK5.js.map +0 -1
- package/dist/chunk-FOMIUDRM.js +0 -96
- package/dist/chunk-FOMIUDRM.js.map +0 -1
- package/dist/chunk-FR5F3VTU.js +0 -139
- package/dist/chunk-FR5F3VTU.js.map +0 -1
- package/dist/chunk-GW53LH3I.mjs +0 -81
- package/dist/chunk-GW53LH3I.mjs.map +0 -1
- package/dist/chunk-GXMRIT5E.mjs +0 -94
- package/dist/chunk-GXMRIT5E.mjs.map +0 -1
- package/dist/chunk-IANSI7F7.mjs +0 -393
- package/dist/chunk-IANSI7F7.mjs.map +0 -1
- package/dist/chunk-IDM6MZHF.js +0 -415
- package/dist/chunk-IDM6MZHF.js.map +0 -1
- package/dist/chunk-J5ZYQ3TP.js +0 -104
- package/dist/chunk-J5ZYQ3TP.js.map +0 -1
- package/dist/chunk-KPAUBWZA.mjs +0 -39
- package/dist/chunk-KPAUBWZA.mjs.map +0 -1
- package/dist/chunk-L7P2NDST.mjs +0 -124
- package/dist/chunk-L7P2NDST.mjs.map +0 -1
- package/dist/chunk-M6OWN7QH.js +0 -118
- package/dist/chunk-M6OWN7QH.js.map +0 -1
- package/dist/chunk-MQVHREEI.js +0 -448
- package/dist/chunk-MQVHREEI.js.map +0 -1
- package/dist/chunk-MT47ECUN.js +0 -127
- package/dist/chunk-MT47ECUN.js.map +0 -1
- package/dist/chunk-N6U54JI4.mjs +0 -126
- package/dist/chunk-N6U54JI4.mjs.map +0 -1
- package/dist/chunk-NDG4LR3Q.js +0 -139
- package/dist/chunk-NDG4LR3Q.js.map +0 -1
- package/dist/chunk-PPD4BU4W.mjs +0 -80
- package/dist/chunk-PPD4BU4W.mjs.map +0 -1
- package/dist/chunk-PU5NO5EZ.js +0 -4
- package/dist/chunk-PU5NO5EZ.js.map +0 -1
- package/dist/chunk-Q442ZDTI.mjs +0 -117
- package/dist/chunk-Q442ZDTI.mjs.map +0 -1
- package/dist/chunk-QH23RO3C.mjs +0 -137
- package/dist/chunk-QH23RO3C.mjs.map +0 -1
- package/dist/chunk-REBHUF4L.js +0 -226
- package/dist/chunk-REBHUF4L.js.map +0 -1
- package/dist/chunk-RGB3QLQT.js +0 -275
- package/dist/chunk-RGB3QLQT.js.map +0 -1
- package/dist/chunk-T7U2QRLC.js +0 -94
- package/dist/chunk-T7U2QRLC.js.map +0 -1
- package/dist/chunk-TEHHJ3CS.mjs +0 -73
- package/dist/chunk-TEHHJ3CS.mjs.map +0 -1
- package/dist/chunk-TJY4MIBC.js +0 -117
- package/dist/chunk-TJY4MIBC.js.map +0 -1
- package/dist/chunk-VCMZQOQM.mjs +0 -102
- package/dist/chunk-VCMZQOQM.mjs.map +0 -1
- package/dist/chunk-VKN4H4WI.mjs +0 -3
- package/dist/chunk-VKN4H4WI.mjs.map +0 -1
- package/dist/chunk-VSB25XTY.js +0 -12
- package/dist/chunk-VSB25XTY.js.map +0 -1
- package/dist/chunk-VWTE74UT.mjs +0 -96
- package/dist/chunk-VWTE74UT.mjs.map +0 -1
- package/dist/chunk-WBTL7PBV.js +0 -105
- package/dist/chunk-WBTL7PBV.js.map +0 -1
- package/dist/chunk-WOK3EP3O.js +0 -83
- package/dist/chunk-WOK3EP3O.js.map +0 -1
- package/dist/chunk-WWT73GGM.mjs +0 -83
- package/dist/chunk-WWT73GGM.mjs.map +0 -1
- package/dist/chunk-XBDXTRK3.mjs +0 -102
- package/dist/chunk-XBDXTRK3.mjs.map +0 -1
- package/dist/chunk-YGBEKZWU.mjs +0 -81
- package/dist/chunk-YGBEKZWU.mjs.map +0 -1
- package/dist/chunk-YVFLRPFV.mjs +0 -72
- package/dist/chunk-YVFLRPFV.mjs.map +0 -1
- package/dist/chunk-ZMVBIQ2Z.mjs +0 -253
- package/dist/chunk-ZMVBIQ2Z.mjs.map +0 -1
- package/dist/chunk-ZWCMSHDP.mjs +0 -425
- package/dist/chunk-ZWCMSHDP.mjs.map +0 -1
- package/dist/flat/index.d.mts +0 -13
- package/dist/flat/index.d.ts +0 -13
- package/dist/flat/index.js +0 -31
- package/dist/flat/index.js.map +0 -1
- package/dist/flat/index.mjs +0 -10
- package/dist/flat/index.mjs.map +0 -1
- package/dist/flat/segment.d.mts +0 -39
- package/dist/flat/segment.d.ts +0 -39
- package/dist/flat/segment.js +0 -13
- package/dist/flat/segment.js.map +0 -1
- package/dist/flat/segment.mjs +0 -4
- package/dist/flat/segment.mjs.map +0 -1
- package/dist/flat/select.d.mts +0 -58
- package/dist/flat/select.d.ts +0 -58
- package/dist/flat/select.js +0 -14
- package/dist/flat/select.js.map +0 -1
- package/dist/flat/select.mjs +0 -5
- package/dist/flat/select.mjs.map +0 -1
- package/dist/flat/tooltip.d.mts +0 -98
- package/dist/flat/tooltip.d.ts +0 -98
- package/dist/flat/tooltip.js +0 -17
- package/dist/flat/tooltip.js.map +0 -1
- package/dist/flat/tooltip.mjs +0 -4
- package/dist/flat/tooltip.mjs.map +0 -1
- package/dist/index-CXip5Wb1.d.mts +0 -62
- package/dist/index-Drz3P-6Y.d.ts +0 -62
- package/dist/input/index.d.mts +0 -82
- package/dist/input/index.d.ts +0 -82
- package/dist/input/index.js +0 -22
- package/dist/input/index.js.map +0 -1
- package/dist/input/index.mjs +0 -5
- package/dist/input/index.mjs.map +0 -1
- package/dist/loading/index.d.mts +0 -54
- package/dist/loading/index.d.ts +0 -54
- package/dist/loading/index.js +0 -12
- package/dist/loading/index.js.map +0 -1
- package/dist/loading/index.mjs +0 -3
- package/dist/loading/index.mjs.map +0 -1
- package/dist/messageBox/index.d.mts +0 -33
- package/dist/messageBox/index.d.ts +0 -33
- package/dist/messageBox/index.js +0 -13
- package/dist/messageBox/index.js.map +0 -1
- package/dist/messageBox/index.mjs +0 -4
- package/dist/messageBox/index.mjs.map +0 -1
- package/dist/modal/index.d.mts +0 -97
- package/dist/modal/index.d.ts +0 -97
- package/dist/modal/index.js +0 -15
- package/dist/modal/index.js.map +0 -1
- package/dist/modal/index.mjs +0 -6
- package/dist/modal/index.mjs.map +0 -1
- package/dist/picker/index.d.mts +0 -12
- package/dist/picker/index.d.ts +0 -12
- package/dist/picker/index.js +0 -13
- package/dist/picker/index.js.map +0 -1
- package/dist/picker/index.mjs +0 -4
- package/dist/picker/index.mjs.map +0 -1
- package/dist/progress/index.d.mts +0 -36
- package/dist/progress/index.d.ts +0 -36
- package/dist/progress/index.js +0 -12
- package/dist/progress/index.js.map +0 -1
- package/dist/progress/index.mjs +0 -3
- package/dist/progress/index.mjs.map +0 -1
- package/dist/radio/index.d.mts +0 -39
- package/dist/radio/index.d.ts +0 -39
- package/dist/radio/index.js +0 -12
- package/dist/radio/index.js.map +0 -1
- package/dist/radio/index.mjs +0 -3
- package/dist/radio/index.mjs.map +0 -1
- package/dist/scrollArea/index.d.mts +0 -31
- package/dist/scrollArea/index.d.ts +0 -31
- package/dist/scrollArea/index.js +0 -16
- package/dist/scrollArea/index.js.map +0 -1
- package/dist/scrollArea/index.mjs +0 -3
- package/dist/scrollArea/index.mjs.map +0 -1
- package/dist/segment/index.d.mts +0 -46
- package/dist/segment/index.d.ts +0 -46
- package/dist/segment/index.js +0 -12
- package/dist/segment/index.js.map +0 -1
- package/dist/segment/index.mjs +0 -3
- package/dist/segment/index.mjs.map +0 -1
- package/dist/star/index.d.mts +0 -30
- package/dist/star/index.d.ts +0 -30
- package/dist/star/index.js +0 -12
- package/dist/star/index.js.map +0 -1
- package/dist/star/index.mjs +0 -3
- package/dist/star/index.mjs.map +0 -1
- package/dist/switch/index.d.mts +0 -32
- package/dist/switch/index.d.ts +0 -32
- package/dist/switch/index.js +0 -12
- package/dist/switch/index.js.map +0 -1
- package/dist/switch/index.mjs +0 -3
- package/dist/switch/index.mjs.map +0 -1
- package/dist/tabs/index.d.mts +0 -52
- package/dist/tabs/index.d.ts +0 -52
- package/dist/tabs/index.js +0 -12
- package/dist/tabs/index.js.map +0 -1
- package/dist/tabs/index.mjs +0 -3
- package/dist/tabs/index.mjs.map +0 -1
- package/dist/tag/index.d.mts +0 -68
- package/dist/tag/index.d.ts +0 -68
- package/dist/tag/index.js +0 -17
- package/dist/tag/index.js.map +0 -1
- package/dist/tag/index.mjs +0 -4
- package/dist/tag/index.mjs.map +0 -1
- package/dist/toast/index.d.mts +0 -175
- package/dist/toast/index.d.ts +0 -175
- package/dist/toast/index.js +0 -25
- package/dist/toast/index.js.map +0 -1
- package/dist/toast/index.mjs +0 -4
- package/dist/toast/index.mjs.map +0 -1
- package/dist/tooltip/index.d.mts +0 -26
- package/dist/tooltip/index.d.ts +0 -26
- package/dist/tooltip/index.js +0 -12
- package/dist/tooltip/index.js.map +0 -1
- package/dist/tooltip/index.mjs +0 -3
- package/dist/tooltip/index.mjs.map +0 -1
package/dist/chunk-IDM6MZHF.js
DELETED
|
@@ -1,415 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var chunkMQVHREEI_js = require('./chunk-MQVHREEI.js');
|
|
4
|
-
var utils = require('@exem-ui/core/utils');
|
|
5
|
-
var React = require('react');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
|
|
8
|
-
function _interopNamespace(e) {
|
|
9
|
-
if (e && e.__esModule) return e;
|
|
10
|
-
var n = Object.create(null);
|
|
11
|
-
if (e) {
|
|
12
|
-
Object.keys(e).forEach(function (k) {
|
|
13
|
-
if (k !== 'default') {
|
|
14
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
15
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
16
|
-
enumerable: true,
|
|
17
|
-
get: function () { return e[k]; }
|
|
18
|
-
});
|
|
19
|
-
}
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
n.default = e;
|
|
23
|
-
return Object.freeze(n);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
27
|
-
|
|
28
|
-
var TextAreaContext = React.createContext(null);
|
|
29
|
-
var useTextAreaContext = () => {
|
|
30
|
-
const context = React.useContext(TextAreaContext);
|
|
31
|
-
if (!context) {
|
|
32
|
-
throw new Error("TextArea components must be used within a TextArea");
|
|
33
|
-
}
|
|
34
|
-
return context;
|
|
35
|
-
};
|
|
36
|
-
var textAreaVariants = {
|
|
37
|
-
container: chunkMQVHREEI_js.commonInputVariants.container,
|
|
38
|
-
label: chunkMQVHREEI_js.commonInputVariants.label,
|
|
39
|
-
field: utils.cva(
|
|
40
|
-
"scrollbar-overlay block w-full resize-none rounded-medium border transition-colors focus:outline-none",
|
|
41
|
-
{
|
|
42
|
-
variants: {
|
|
43
|
-
variant: {
|
|
44
|
-
fill: "border-transparent bg-elevation-elevation-2",
|
|
45
|
-
line: "border-border-primary"
|
|
46
|
-
},
|
|
47
|
-
size: {
|
|
48
|
-
xsmall: "min-h-[60px] px-1.5 py-[3.5px] text-body-3",
|
|
49
|
-
small: "min-h-[80px] px-2 py-1 text-body-2",
|
|
50
|
-
medium: "min-h-[100px] px-2.5 py-1.5 text-body-2",
|
|
51
|
-
large: "min-h-[120px] px-3 py-[9px] text-body-1"
|
|
52
|
-
},
|
|
53
|
-
state: {
|
|
54
|
-
default: "text-text-primary placeholder:text-text-tertiary",
|
|
55
|
-
focused: "text-text-primary placeholder:text-text-tertiary",
|
|
56
|
-
error: "text-text-primary placeholder:text-text-tertiary",
|
|
57
|
-
disabled: "cursor-not-allowed text-text-disabled placeholder:text-text-disabled"
|
|
58
|
-
}
|
|
59
|
-
},
|
|
60
|
-
compoundVariants: [
|
|
61
|
-
{ variant: "fill", state: "focused", class: "border-border-focused" },
|
|
62
|
-
{ variant: "fill", state: "error", class: "border-border-critical" },
|
|
63
|
-
{
|
|
64
|
-
variant: "fill",
|
|
65
|
-
state: "disabled",
|
|
66
|
-
class: "bg-elevation-elevation-2 border-transparent"
|
|
67
|
-
},
|
|
68
|
-
{ variant: "line", state: "focused", class: "border-border-focused" },
|
|
69
|
-
{ variant: "line", state: "error", class: "border-border-critical" },
|
|
70
|
-
{ variant: "line", state: "disabled", class: "border-border-primary" }
|
|
71
|
-
],
|
|
72
|
-
defaultVariants: { variant: "fill", size: "medium", state: "default" }
|
|
73
|
-
}
|
|
74
|
-
),
|
|
75
|
-
descriptionContainer: utils.cva("flex flex-row items-center justify-between", {
|
|
76
|
-
variants: {
|
|
77
|
-
size: {
|
|
78
|
-
xsmall: "gap-0.5 text-caption",
|
|
79
|
-
small: "gap-1 text-body-3",
|
|
80
|
-
medium: "gap-1 text-body-3",
|
|
81
|
-
large: "gap-1 text-body-2"
|
|
82
|
-
}
|
|
83
|
-
},
|
|
84
|
-
defaultVariants: { size: "medium" }
|
|
85
|
-
}),
|
|
86
|
-
description: chunkMQVHREEI_js.commonInputVariants.description,
|
|
87
|
-
counter: utils.cva("text-nowrap font-regular", {
|
|
88
|
-
variants: {
|
|
89
|
-
disabled: {
|
|
90
|
-
true: "text-gray-04",
|
|
91
|
-
false: "text-text-tertiary"
|
|
92
|
-
}
|
|
93
|
-
},
|
|
94
|
-
defaultVariants: { disabled: false }
|
|
95
|
-
})
|
|
96
|
-
};
|
|
97
|
-
var TextArea = React__namespace.forwardRef(
|
|
98
|
-
({
|
|
99
|
-
children,
|
|
100
|
-
variant = "fill",
|
|
101
|
-
size = "medium",
|
|
102
|
-
error = false,
|
|
103
|
-
disabled = false,
|
|
104
|
-
value = "",
|
|
105
|
-
maxLength,
|
|
106
|
-
className,
|
|
107
|
-
...textAreaProps
|
|
108
|
-
}, ref) => {
|
|
109
|
-
const uniqueId = React.useId();
|
|
110
|
-
const id = `text-area-${uniqueId}`;
|
|
111
|
-
const { onChange, ...restTextAreaProps } = textAreaProps;
|
|
112
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
113
|
-
TextAreaContext.Provider,
|
|
114
|
-
{
|
|
115
|
-
value: { variant, size, error, disabled, id, value, maxLength, onChange },
|
|
116
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: utils.cn(textAreaVariants.container, className), children: children || /* @__PURE__ */ jsxRuntime.jsx(TextArea.Field, { ...restTextAreaProps }) })
|
|
117
|
-
}
|
|
118
|
-
);
|
|
119
|
-
}
|
|
120
|
-
);
|
|
121
|
-
TextArea.Label = React__namespace.forwardRef(
|
|
122
|
-
({ children, required = false, className }, ref) => {
|
|
123
|
-
const { size, disabled, id } = useTextAreaContext();
|
|
124
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
125
|
-
"label",
|
|
126
|
-
{
|
|
127
|
-
ref,
|
|
128
|
-
htmlFor: id,
|
|
129
|
-
className: utils.cn(textAreaVariants.label({ size, disabled, required }), className),
|
|
130
|
-
children
|
|
131
|
-
}
|
|
132
|
-
);
|
|
133
|
-
}
|
|
134
|
-
);
|
|
135
|
-
TextArea.Field = React__namespace.forwardRef(
|
|
136
|
-
({ className, onFocus, onBlur, ...props }, ref) => {
|
|
137
|
-
const {
|
|
138
|
-
variant,
|
|
139
|
-
size,
|
|
140
|
-
error,
|
|
141
|
-
disabled,
|
|
142
|
-
id,
|
|
143
|
-
maxLength,
|
|
144
|
-
value: contextValue,
|
|
145
|
-
onChange: contextOnChange
|
|
146
|
-
} = useTextAreaContext();
|
|
147
|
-
const [focused, setFocused] = React__namespace.useState(false);
|
|
148
|
-
const handleFocus = (e) => {
|
|
149
|
-
setFocused(true);
|
|
150
|
-
onFocus?.(e);
|
|
151
|
-
};
|
|
152
|
-
const handleBlur = (e) => {
|
|
153
|
-
setFocused(false);
|
|
154
|
-
onBlur?.(e);
|
|
155
|
-
};
|
|
156
|
-
const state = disabled ? "disabled" : error ? "error" : focused ? "focused" : "default";
|
|
157
|
-
const isControlled = contextValue !== void 0;
|
|
158
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
159
|
-
"textarea",
|
|
160
|
-
{
|
|
161
|
-
ref,
|
|
162
|
-
id,
|
|
163
|
-
disabled,
|
|
164
|
-
maxLength,
|
|
165
|
-
className: utils.cn(textAreaVariants.field({ variant, size, state }), className),
|
|
166
|
-
onFocus: handleFocus,
|
|
167
|
-
onBlur: handleBlur,
|
|
168
|
-
onChange: (e) => {
|
|
169
|
-
contextOnChange?.(e);
|
|
170
|
-
},
|
|
171
|
-
...isControlled ? { value: contextValue } : {},
|
|
172
|
-
...props
|
|
173
|
-
}
|
|
174
|
-
);
|
|
175
|
-
}
|
|
176
|
-
);
|
|
177
|
-
TextArea.Description = React__namespace.forwardRef(
|
|
178
|
-
({ children, showCounter = true, className }, ref) => {
|
|
179
|
-
const { size, error, disabled, value = "", maxLength } = useTextAreaContext();
|
|
180
|
-
if (!children && (!showCounter || !maxLength)) {
|
|
181
|
-
return null;
|
|
182
|
-
}
|
|
183
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: utils.cn(textAreaVariants.descriptionContainer({ size }), className), children: [
|
|
184
|
-
children && /* @__PURE__ */ jsxRuntime.jsx("p", { className: utils.cn(textAreaVariants.description({ size, error, disabled }), "flex-1"), children }),
|
|
185
|
-
showCounter && maxLength && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: utils.cn(textAreaVariants.counter({ disabled })), children: [
|
|
186
|
-
value.length,
|
|
187
|
-
"/",
|
|
188
|
-
maxLength
|
|
189
|
-
] })
|
|
190
|
-
] });
|
|
191
|
-
}
|
|
192
|
-
);
|
|
193
|
-
TextArea.displayName = "TextArea";
|
|
194
|
-
TextArea.Label.displayName = "TextArea.Label";
|
|
195
|
-
TextArea.Field.displayName = "TextArea.Field";
|
|
196
|
-
TextArea.Description.displayName = "TextArea.Description";
|
|
197
|
-
var TextFieldContext = React.createContext(null);
|
|
198
|
-
var useTextFieldContext = () => {
|
|
199
|
-
const context = React.useContext(TextFieldContext);
|
|
200
|
-
if (!context) {
|
|
201
|
-
throw new Error("TextField components must be used within a TextField");
|
|
202
|
-
}
|
|
203
|
-
return context;
|
|
204
|
-
};
|
|
205
|
-
var textFieldVariants = {
|
|
206
|
-
container: chunkMQVHREEI_js.commonInputVariants.container,
|
|
207
|
-
label: chunkMQVHREEI_js.commonInputVariants.label,
|
|
208
|
-
wrapper: utils.cva(
|
|
209
|
-
"flex w-full flex-row items-center rounded-medium border transition-colors focus-within:border-border-focused focus-within:outline-none",
|
|
210
|
-
{
|
|
211
|
-
variants: {
|
|
212
|
-
variant: {
|
|
213
|
-
fill: "border-transparent bg-elevation-elevation-2",
|
|
214
|
-
line: "border-border-primary"
|
|
215
|
-
},
|
|
216
|
-
size: {
|
|
217
|
-
xsmall: "h-6 gap-0 px-1",
|
|
218
|
-
small: "h-7 gap-0.5 px-1.5",
|
|
219
|
-
medium: "h-8 gap-0.5 px-2",
|
|
220
|
-
large: "h-10 gap-1 px-2.5"
|
|
221
|
-
},
|
|
222
|
-
state: {
|
|
223
|
-
default: "text-text-primary",
|
|
224
|
-
error: "text-text-primary",
|
|
225
|
-
disabled: "cursor-not-allowed text-text-disabled"
|
|
226
|
-
}
|
|
227
|
-
},
|
|
228
|
-
compoundVariants: [
|
|
229
|
-
{ variant: "fill", state: "error", class: "border-border-critical" },
|
|
230
|
-
{
|
|
231
|
-
variant: "fill",
|
|
232
|
-
state: "disabled",
|
|
233
|
-
class: "bg-elevation-elevation-2 border-transparent"
|
|
234
|
-
},
|
|
235
|
-
{ variant: "line", state: "error", class: "border-border-critical" },
|
|
236
|
-
{ variant: "line", state: "disabled", class: "border-border-primary" }
|
|
237
|
-
],
|
|
238
|
-
defaultVariants: { variant: "fill", size: "medium", state: "default" }
|
|
239
|
-
}
|
|
240
|
-
),
|
|
241
|
-
input: utils.cva(
|
|
242
|
-
"w-full border-none bg-transparent p-0 focus:outline-none focus:ring-0 disabled:cursor-not-allowed",
|
|
243
|
-
{
|
|
244
|
-
variants: {
|
|
245
|
-
size: {
|
|
246
|
-
xsmall: "text-body-3 placeholder:text-body-3",
|
|
247
|
-
small: "text-body-2 placeholder:text-body-2",
|
|
248
|
-
medium: "text-body-2 placeholder:text-body-2",
|
|
249
|
-
large: "text-body-1 placeholder:text-body-1"
|
|
250
|
-
},
|
|
251
|
-
state: {
|
|
252
|
-
default: "text-text-primary placeholder:text-text-tertiary",
|
|
253
|
-
error: "text-text-primary placeholder:text-text-tertiary",
|
|
254
|
-
disabled: "text-text-disabled placeholder:text-text-disabled"
|
|
255
|
-
}
|
|
256
|
-
},
|
|
257
|
-
defaultVariants: { size: "medium", state: "default" }
|
|
258
|
-
}
|
|
259
|
-
),
|
|
260
|
-
description: utils.cva("mt-0.5 font-regular text-text-tertiary", {
|
|
261
|
-
variants: {
|
|
262
|
-
size: {
|
|
263
|
-
xsmall: "text-caption",
|
|
264
|
-
small: "text-body-3",
|
|
265
|
-
medium: "text-body-3",
|
|
266
|
-
large: "text-body-2"
|
|
267
|
-
},
|
|
268
|
-
error: {
|
|
269
|
-
true: "text-text-critical",
|
|
270
|
-
false: ""
|
|
271
|
-
},
|
|
272
|
-
disabled: {
|
|
273
|
-
true: "text-text-disabled",
|
|
274
|
-
false: ""
|
|
275
|
-
}
|
|
276
|
-
},
|
|
277
|
-
compoundVariants: [
|
|
278
|
-
{
|
|
279
|
-
disabled: true,
|
|
280
|
-
error: true,
|
|
281
|
-
class: "text-text-disabled"
|
|
282
|
-
// disabled가 error보다 우선
|
|
283
|
-
}
|
|
284
|
-
],
|
|
285
|
-
defaultVariants: { size: "medium", error: false, disabled: false }
|
|
286
|
-
}),
|
|
287
|
-
subText: utils.cva("ml-1 shrink-0 font-regular", {
|
|
288
|
-
variants: {
|
|
289
|
-
size: {
|
|
290
|
-
xsmall: "text-body-3",
|
|
291
|
-
small: "text-body-2",
|
|
292
|
-
medium: "text-body-2",
|
|
293
|
-
large: "text-body-1"
|
|
294
|
-
},
|
|
295
|
-
disabled: {
|
|
296
|
-
true: "text-text-disabled",
|
|
297
|
-
false: "text-text-tertiary"
|
|
298
|
-
}
|
|
299
|
-
},
|
|
300
|
-
defaultVariants: { size: "medium", disabled: false }
|
|
301
|
-
}),
|
|
302
|
-
icon: utils.cva("shrink-0 text-icon-tertiary", {
|
|
303
|
-
variants: {
|
|
304
|
-
size: {
|
|
305
|
-
xsmall: "size-4",
|
|
306
|
-
small: "size-4",
|
|
307
|
-
medium: "size-4",
|
|
308
|
-
large: "size-5"
|
|
309
|
-
}
|
|
310
|
-
},
|
|
311
|
-
defaultVariants: { size: "medium" }
|
|
312
|
-
})
|
|
313
|
-
};
|
|
314
|
-
var TextField = React.forwardRef(
|
|
315
|
-
({
|
|
316
|
-
children,
|
|
317
|
-
variant = "fill",
|
|
318
|
-
size = "medium",
|
|
319
|
-
error = false,
|
|
320
|
-
disabled = false,
|
|
321
|
-
className,
|
|
322
|
-
id: providedId,
|
|
323
|
-
value,
|
|
324
|
-
onChange,
|
|
325
|
-
...inputProps
|
|
326
|
-
}, ref) => {
|
|
327
|
-
const uniqueId = React.useId();
|
|
328
|
-
const id = providedId || `text-field-${uniqueId}`;
|
|
329
|
-
return /* @__PURE__ */ jsxRuntime.jsx(TextFieldContext.Provider, { value: { variant, size, error, disabled, id, value, onChange }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: utils.cn(textFieldVariants.container, className), children: children || /* @__PURE__ */ jsxRuntime.jsx(TextField.Input, { ...inputProps }) }) });
|
|
330
|
-
}
|
|
331
|
-
);
|
|
332
|
-
TextField.Label = React.forwardRef(
|
|
333
|
-
({ children, required = false, className }, ref) => {
|
|
334
|
-
const { size, disabled, id } = useTextFieldContext();
|
|
335
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
336
|
-
"label",
|
|
337
|
-
{
|
|
338
|
-
ref,
|
|
339
|
-
htmlFor: id,
|
|
340
|
-
className: utils.cn(textFieldVariants.label({ size, disabled, required }), className),
|
|
341
|
-
children
|
|
342
|
-
}
|
|
343
|
-
);
|
|
344
|
-
}
|
|
345
|
-
);
|
|
346
|
-
TextField.Input = React.forwardRef(
|
|
347
|
-
({ className, leftIcon, rightIcon, subText, ...props }, ref) => {
|
|
348
|
-
const {
|
|
349
|
-
variant,
|
|
350
|
-
size,
|
|
351
|
-
error,
|
|
352
|
-
disabled,
|
|
353
|
-
id,
|
|
354
|
-
value: contextValue,
|
|
355
|
-
onChange: contextOnChange
|
|
356
|
-
} = useTextFieldContext();
|
|
357
|
-
const state = disabled ? "disabled" : error ? "error" : "default";
|
|
358
|
-
const isControlled = contextValue !== void 0;
|
|
359
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn(textFieldVariants.wrapper({ variant, size, state }), className), children: [
|
|
360
|
-
leftIcon && /* @__PURE__ */ jsxRuntime.jsx(
|
|
361
|
-
"span",
|
|
362
|
-
{
|
|
363
|
-
className: utils.cn("flex items-center justify-center", textFieldVariants.icon({ size })),
|
|
364
|
-
children: leftIcon
|
|
365
|
-
}
|
|
366
|
-
),
|
|
367
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-row items-center justify-center", children: [
|
|
368
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
369
|
-
"input",
|
|
370
|
-
{
|
|
371
|
-
ref,
|
|
372
|
-
id,
|
|
373
|
-
disabled,
|
|
374
|
-
className: utils.cn(textFieldVariants.input({ size, state })),
|
|
375
|
-
onChange: (e) => {
|
|
376
|
-
contextOnChange?.(e);
|
|
377
|
-
},
|
|
378
|
-
...props,
|
|
379
|
-
...isControlled ? { value: contextValue } : {}
|
|
380
|
-
}
|
|
381
|
-
),
|
|
382
|
-
subText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn(textFieldVariants.subText({ size, disabled })), children: subText })
|
|
383
|
-
] }),
|
|
384
|
-
rightIcon && /* @__PURE__ */ jsxRuntime.jsx(
|
|
385
|
-
"span",
|
|
386
|
-
{
|
|
387
|
-
className: utils.cn("flex items-center justify-center", textFieldVariants.icon({ size })),
|
|
388
|
-
children: rightIcon
|
|
389
|
-
}
|
|
390
|
-
)
|
|
391
|
-
] });
|
|
392
|
-
}
|
|
393
|
-
);
|
|
394
|
-
TextField.Description = React.forwardRef(
|
|
395
|
-
({ children, className }, ref) => {
|
|
396
|
-
const { size, error, disabled } = useTextFieldContext();
|
|
397
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
398
|
-
"p",
|
|
399
|
-
{
|
|
400
|
-
ref,
|
|
401
|
-
className: utils.cn(textFieldVariants.description({ size, error, disabled }), className),
|
|
402
|
-
children
|
|
403
|
-
}
|
|
404
|
-
);
|
|
405
|
-
}
|
|
406
|
-
);
|
|
407
|
-
TextField.displayName = "TextField";
|
|
408
|
-
TextField.Label.displayName = "TextField.Label";
|
|
409
|
-
TextField.Input.displayName = "TextField.Input";
|
|
410
|
-
TextField.Description.displayName = "TextField.Description";
|
|
411
|
-
|
|
412
|
-
exports.TextArea = TextArea;
|
|
413
|
-
exports.TextField = TextField;
|
|
414
|
-
//# sourceMappingURL=chunk-IDM6MZHF.js.map
|
|
415
|
-
//# sourceMappingURL=chunk-IDM6MZHF.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/input/TextArea.tsx","../src/input/TextField.tsx"],"names":["createContext","useContext","commonInputVariants","cva","React","useId","jsx","cn","jsxs","forwardRef"],"mappings":"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","file":"chunk-IDM6MZHF.js","sourcesContent":["import { cn, cva } from '@exem-ui/core/utils';\nimport * as React from 'react';\nimport { createContext, useContext, useId } from 'react';\n\nimport { commonInputVariants, type Size, type Variant } from './inputVariants';\n\ntype TextAreaLabelProps = {\n children: React.ReactNode;\n required?: boolean;\n className?: string;\n};\n\ntype TextAreaFieldProps = Omit<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n 'size' | 'disabled' | 'id' | 'value' | 'onChange' | 'maxLength'\n>;\n\ntype TextAreaDescriptionProps = {\n children?: React.ReactNode;\n showCounter?: boolean;\n className?: string;\n};\n\ntype TextAreaRootProps = {\n children?: React.ReactNode;\n /**\n * 입력 필드 스타일 유형\n * @default 'fill'\n */\n variant?: Variant;\n size?: Size;\n error?: boolean;\n disabled?: boolean;\n /**\n * TextArea의 기본값. Context를 통해 하위 컴포넌트로 전달됩니다.\n * TextArea.Field에서 value prop이 전달되면 Field의 value가 우선 적용됩니다.\n *\n * 사용 패턴:\n * - 통합 관리: <TextArea value={state}> - Context로 모든 Field에 적용\n * - 개별 제어: <TextArea.Field value={localState}> - 특정 Field만 개별 제어\n */\n value?: string;\n maxLength?: number;\n className?: string;\n} & Omit<\n React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n 'size' | 'disabled' | 'id' | 'className'\n>;\n\ntype TextAreaComponent = React.ForwardRefExoticComponent<\n TextAreaRootProps & React.RefAttributes<HTMLDivElement>\n> & {\n Label: React.ForwardRefExoticComponent<\n TextAreaLabelProps & React.RefAttributes<HTMLLabelElement>\n >;\n Field: React.ForwardRefExoticComponent<\n TextAreaFieldProps & React.RefAttributes<HTMLTextAreaElement>\n >;\n Description: React.ForwardRefExoticComponent<\n TextAreaDescriptionProps & React.RefAttributes<HTMLDivElement>\n >;\n};\n\ntype TextAreaContextType = {\n variant: Variant;\n size?: Size;\n error?: boolean;\n disabled?: boolean;\n id: string;\n value?: string;\n maxLength?: number;\n onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;\n};\n\nconst TextAreaContext = createContext<TextAreaContextType | null>(null);\n\nconst useTextAreaContext = () => {\n const context = useContext(TextAreaContext);\n if (!context) {\n throw new Error('TextArea components must be used within a TextArea');\n }\n return context;\n};\n\nconst textAreaVariants = {\n container: commonInputVariants.container,\n label: commonInputVariants.label,\n\n field: cva(\n 'scrollbar-overlay block w-full resize-none rounded-medium border transition-colors focus:outline-none',\n {\n variants: {\n variant: {\n fill: 'border-transparent bg-elevation-elevation-2',\n line: 'border-border-primary',\n },\n size: {\n xsmall: 'min-h-[60px] px-1.5 py-[3.5px] text-body-3',\n small: 'min-h-[80px] px-2 py-1 text-body-2',\n medium: 'min-h-[100px] px-2.5 py-1.5 text-body-2',\n large: 'min-h-[120px] px-3 py-[9px] text-body-1',\n },\n state: {\n default: 'text-text-primary placeholder:text-text-tertiary',\n focused: 'text-text-primary placeholder:text-text-tertiary',\n error: 'text-text-primary placeholder:text-text-tertiary',\n disabled: 'cursor-not-allowed text-text-disabled placeholder:text-text-disabled',\n },\n },\n compoundVariants: [\n { variant: 'fill', state: 'focused', class: 'border-border-focused' },\n { variant: 'fill', state: 'error', class: 'border-border-critical' },\n {\n variant: 'fill',\n state: 'disabled',\n class: 'bg-elevation-elevation-2 border-transparent',\n },\n { variant: 'line', state: 'focused', class: 'border-border-focused' },\n { variant: 'line', state: 'error', class: 'border-border-critical' },\n { variant: 'line', state: 'disabled', class: 'border-border-primary' },\n ],\n defaultVariants: { variant: 'fill', size: 'medium', state: 'default' },\n },\n ),\n\n descriptionContainer: cva('flex flex-row items-center justify-between', {\n variants: {\n size: {\n xsmall: 'gap-0.5 text-caption',\n small: 'gap-1 text-body-3',\n medium: 'gap-1 text-body-3',\n large: 'gap-1 text-body-2',\n },\n },\n defaultVariants: { size: 'medium' },\n }),\n\n description: commonInputVariants.description,\n\n counter: cva('text-nowrap font-regular', {\n variants: {\n disabled: {\n true: 'text-gray-04',\n false: 'text-text-tertiary',\n },\n },\n defaultVariants: { disabled: false },\n }),\n};\n\nconst TextArea = React.forwardRef<HTMLDivElement, TextAreaRootProps>(\n (\n {\n children,\n variant = 'fill',\n size = 'medium',\n error = false,\n disabled = false,\n value = '',\n maxLength,\n className,\n ...textAreaProps\n },\n ref,\n ) => {\n const uniqueId = useId();\n const id = `text-area-${uniqueId}`;\n const { onChange, ...restTextAreaProps } = textAreaProps;\n\n return (\n <TextAreaContext.Provider\n value={{ variant, size, error, disabled, id, value, maxLength, onChange }}\n >\n <div ref={ref} className={cn(textAreaVariants.container, className)}>\n {children || <TextArea.Field {...restTextAreaProps} />}\n </div>\n </TextAreaContext.Provider>\n );\n },\n) as TextAreaComponent;\n\nTextArea.Label = React.forwardRef<HTMLLabelElement, TextAreaLabelProps>(\n ({ children, required = false, className }, ref) => {\n const { size, disabled, id } = useTextAreaContext();\n\n return (\n <label\n ref={ref}\n htmlFor={id}\n className={cn(textAreaVariants.label({ size, disabled, required }), className)}\n >\n {children}\n </label>\n );\n },\n) as TextAreaComponent['Label'];\n\nTextArea.Field = React.forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(\n ({ className, onFocus, onBlur, ...props }, ref) => {\n const {\n variant,\n size,\n error,\n disabled,\n id,\n maxLength,\n value: contextValue,\n onChange: contextOnChange,\n } = useTextAreaContext();\n const [focused, setFocused] = React.useState(false);\n\n const handleFocus = (e: React.FocusEvent<HTMLTextAreaElement>) => {\n setFocused(true);\n onFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLTextAreaElement>) => {\n setFocused(false);\n onBlur?.(e);\n };\n\n const state = disabled ? 'disabled' : error ? 'error' : focused ? 'focused' : 'default';\n\n const isControlled = contextValue !== undefined;\n\n return (\n <textarea\n ref={ref}\n id={id}\n disabled={disabled}\n maxLength={maxLength}\n className={cn(textAreaVariants.field({ variant, size, state }), className)}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChange={(e) => {\n contextOnChange?.(e);\n }}\n {...(isControlled ? { value: contextValue } : {})}\n {...props}\n />\n );\n },\n) as TextAreaComponent['Field'];\n\nTextArea.Description = React.forwardRef<HTMLDivElement, TextAreaDescriptionProps>(\n ({ children, showCounter = true, className }, ref) => {\n const { size, error, disabled, value = '', maxLength } = useTextAreaContext();\n\n if (!children && (!showCounter || !maxLength)) {\n return null;\n }\n\n return (\n <div ref={ref} className={cn(textAreaVariants.descriptionContainer({ size }), className)}>\n {children && (\n <p className={cn(textAreaVariants.description({ size, error, disabled }), 'flex-1')}>\n {children}\n </p>\n )}\n {showCounter && maxLength && (\n <span className={cn(textAreaVariants.counter({ disabled }))}>\n {value.length}/{maxLength}\n </span>\n )}\n </div>\n );\n },\n) as TextAreaComponent['Description'];\n\nTextArea.displayName = 'TextArea';\nTextArea.Label.displayName = 'TextArea.Label';\nTextArea.Field.displayName = 'TextArea.Field';\nTextArea.Description.displayName = 'TextArea.Description';\n\nexport { TextArea };\nexport type {\n TextAreaComponent,\n TextAreaRootProps,\n TextAreaLabelProps,\n TextAreaFieldProps,\n TextAreaDescriptionProps,\n};\n","import { cn, cva } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { createContext, forwardRef, useContext, useId } from 'react';\nimport { commonInputVariants, type Icon, type Size, type Variant } from './inputVariants';\n\ntype TextFieldContextType = {\n variant: Variant;\n size: Size;\n error: boolean;\n disabled: boolean;\n id: string;\n value?: string;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n};\n\ntype TextFieldRootProps = {\n children?: React.ReactNode;\n /**\n * 입력 필드 스타일 유형\n * @default 'fill'\n */\n variant?: Variant;\n size?: Size;\n error?: boolean;\n disabled?: boolean;\n className?: string;\n value?: string;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n} & Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'size' | 'disabled' | 'className' | 'value' | 'onChange'\n>;\n\ntype TextFieldLabelProps = {\n children: React.ReactNode;\n required?: boolean;\n className?: string;\n};\n\ntype TextFieldInputProps = Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'size' | 'disabled' | 'id' | 'value' | 'onChange'\n> & {\n leftIcon?: Icon;\n rightIcon?: Icon;\n subText?: string;\n};\n\ntype TextFieldDescriptionProps = {\n children: React.ReactNode;\n className?: string;\n};\n\ntype TextFieldComponent = React.ForwardRefExoticComponent<\n TextFieldRootProps & React.RefAttributes<HTMLDivElement>\n> & {\n Label: React.ForwardRefExoticComponent<\n TextFieldLabelProps & React.RefAttributes<HTMLLabelElement>\n >;\n Input: React.ForwardRefExoticComponent<\n TextFieldInputProps & React.RefAttributes<HTMLInputElement>\n >;\n Description: React.ForwardRefExoticComponent<\n TextFieldDescriptionProps & React.RefAttributes<HTMLParagraphElement>\n >;\n};\n\nconst TextFieldContext = createContext<TextFieldContextType | null>(null);\n\nconst useTextFieldContext = () => {\n const context = useContext(TextFieldContext);\n if (!context) {\n throw new Error('TextField components must be used within a TextField');\n }\n return context;\n};\n\nconst textFieldVariants = {\n container: commonInputVariants.container,\n label: commonInputVariants.label,\n\n wrapper: cva(\n 'flex w-full flex-row items-center rounded-medium border transition-colors focus-within:border-border-focused focus-within:outline-none',\n {\n variants: {\n variant: {\n fill: 'border-transparent bg-elevation-elevation-2',\n line: 'border-border-primary',\n },\n size: {\n xsmall: 'h-6 gap-0 px-1',\n small: 'h-7 gap-0.5 px-1.5',\n medium: 'h-8 gap-0.5 px-2',\n large: 'h-10 gap-1 px-2.5',\n },\n state: {\n default: 'text-text-primary',\n error: 'text-text-primary',\n disabled: 'cursor-not-allowed text-text-disabled',\n },\n },\n compoundVariants: [\n { variant: 'fill', state: 'error', class: 'border-border-critical' },\n {\n variant: 'fill',\n state: 'disabled',\n class: 'bg-elevation-elevation-2 border-transparent',\n },\n { variant: 'line', state: 'error', class: 'border-border-critical' },\n { variant: 'line', state: 'disabled', class: 'border-border-primary' },\n ],\n defaultVariants: { variant: 'fill', size: 'medium', state: 'default' },\n },\n ),\n\n input: cva(\n 'w-full border-none bg-transparent p-0 focus:outline-none focus:ring-0 disabled:cursor-not-allowed',\n {\n variants: {\n size: {\n xsmall: 'text-body-3 placeholder:text-body-3',\n small: 'text-body-2 placeholder:text-body-2',\n medium: 'text-body-2 placeholder:text-body-2',\n large: 'text-body-1 placeholder:text-body-1',\n },\n state: {\n default: 'text-text-primary placeholder:text-text-tertiary',\n error: 'text-text-primary placeholder:text-text-tertiary',\n disabled: 'text-text-disabled placeholder:text-text-disabled',\n },\n },\n defaultVariants: { size: 'medium', state: 'default' },\n },\n ),\n\n description: cva('mt-0.5 font-regular text-text-tertiary', {\n variants: {\n size: {\n xsmall: 'text-caption',\n small: 'text-body-3',\n medium: 'text-body-3',\n large: 'text-body-2',\n },\n error: {\n true: 'text-text-critical',\n false: '',\n },\n disabled: {\n true: 'text-text-disabled',\n false: '',\n },\n },\n compoundVariants: [\n {\n disabled: true,\n error: true,\n class: 'text-text-disabled', // disabled가 error보다 우선\n },\n ],\n defaultVariants: { size: 'medium', error: false, disabled: false },\n }),\n\n subText: cva('ml-1 shrink-0 font-regular', {\n variants: {\n size: {\n xsmall: 'text-body-3',\n small: 'text-body-2',\n medium: 'text-body-2',\n large: 'text-body-1',\n },\n disabled: {\n true: 'text-text-disabled',\n false: 'text-text-tertiary',\n },\n },\n defaultVariants: { size: 'medium', disabled: false },\n }),\n\n icon: cva('shrink-0 text-icon-tertiary', {\n variants: {\n size: {\n xsmall: 'size-4',\n small: 'size-4',\n medium: 'size-4',\n large: 'size-5',\n },\n },\n defaultVariants: { size: 'medium' },\n }),\n};\n\nconst TextField = forwardRef<HTMLDivElement, TextFieldRootProps>(\n (\n {\n children,\n variant = 'fill',\n size = 'medium',\n error = false,\n disabled = false,\n className,\n id: providedId,\n value,\n onChange,\n ...inputProps\n },\n ref,\n ) => {\n const uniqueId = useId();\n const id = providedId || `text-field-${uniqueId}`;\n\n return (\n <TextFieldContext.Provider value={{ variant, size, error, disabled, id, value, onChange }}>\n <div ref={ref} className={cn(textFieldVariants.container, className)}>\n {children || <TextField.Input {...inputProps} />}\n </div>\n </TextFieldContext.Provider>\n );\n },\n) as TextFieldComponent;\n\nTextField.Label = forwardRef<HTMLLabelElement, TextFieldLabelProps>(\n ({ children, required = false, className }, ref) => {\n const { size, disabled, id } = useTextFieldContext();\n\n return (\n <label\n ref={ref}\n htmlFor={id}\n className={cn(textFieldVariants.label({ size, disabled, required }), className)}\n >\n {children}\n </label>\n );\n },\n) as TextFieldComponent['Label'];\n\nTextField.Input = forwardRef<HTMLInputElement, TextFieldInputProps>(\n ({ className, leftIcon, rightIcon, subText, ...props }, ref) => {\n const {\n variant,\n size,\n error,\n disabled,\n id,\n value: contextValue,\n onChange: contextOnChange,\n } = useTextFieldContext();\n const state = disabled ? 'disabled' : error ? 'error' : 'default';\n const isControlled = contextValue !== undefined;\n\n return (\n <div className={cn(textFieldVariants.wrapper({ variant, size, state }), className)}>\n {leftIcon && (\n <span\n className={cn('flex items-center justify-center', textFieldVariants.icon({ size }))}\n >\n {leftIcon}\n </span>\n )}\n\n <div className=\"flex flex-1 flex-row items-center justify-center\">\n <input\n ref={ref}\n id={id}\n disabled={disabled}\n className={cn(textFieldVariants.input({ size, state }))}\n onChange={(e) => {\n contextOnChange?.(e);\n }}\n {...props}\n {...(isControlled ? { value: contextValue } : {})}\n />\n {subText && (\n <span className={cn(textFieldVariants.subText({ size, disabled }))}>{subText}</span>\n )}\n </div>\n\n {rightIcon && (\n <span\n className={cn('flex items-center justify-center', textFieldVariants.icon({ size }))}\n >\n {rightIcon}\n </span>\n )}\n </div>\n );\n },\n) as TextFieldComponent['Input'];\n\nTextField.Description = forwardRef<HTMLParagraphElement, TextFieldDescriptionProps>(\n ({ children, className }, ref) => {\n const { size, error, disabled } = useTextFieldContext();\n\n return (\n <p\n ref={ref}\n className={cn(textFieldVariants.description({ size, error, disabled }), className)}\n >\n {children}\n </p>\n );\n },\n) as TextFieldComponent['Description'];\n\nTextField.displayName = 'TextField';\nTextField.Label.displayName = 'TextField.Label';\nTextField.Input.displayName = 'TextField.Input';\nTextField.Description.displayName = 'TextField.Description';\n\nexport { TextField };\nexport type {\n TextFieldComponent,\n TextFieldRootProps,\n TextFieldLabelProps,\n TextFieldInputProps,\n TextFieldDescriptionProps,\n};\n"]}
|
package/dist/chunk-J5ZYQ3TP.js
DELETED
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var chunk5M47B2XJ_js = require('./chunk-5M47B2XJ.js');
|
|
4
|
-
var utils = require('@exem-ui/core/utils');
|
|
5
|
-
var react = require('react');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
|
|
8
|
-
var SIZE_CONFIG = {
|
|
9
|
-
xsmall: {
|
|
10
|
-
container: "size-[16px] text-body-3",
|
|
11
|
-
initialPadding: "px-[2.5px] leading-none tracking-tight",
|
|
12
|
-
imagePadding: "p-[2px]",
|
|
13
|
-
iconSize: "size-[12px]"
|
|
14
|
-
},
|
|
15
|
-
small: {
|
|
16
|
-
container: "size-[20px] text-body-2",
|
|
17
|
-
initialPadding: "px-[3.5px]",
|
|
18
|
-
imagePadding: "p-[3px]",
|
|
19
|
-
iconSize: "size-[14px]"
|
|
20
|
-
},
|
|
21
|
-
medium: {
|
|
22
|
-
container: "size-[24px] text-body-2",
|
|
23
|
-
initialPadding: "px-[5.5px] py-[2px]",
|
|
24
|
-
imagePadding: "p-[4px]",
|
|
25
|
-
iconSize: "size-[16px]"
|
|
26
|
-
},
|
|
27
|
-
large: {
|
|
28
|
-
container: "size-[32px] text-title-2",
|
|
29
|
-
initialPadding: "px-[8px] py-[3.5px]",
|
|
30
|
-
imagePadding: "p-[6px]",
|
|
31
|
-
iconSize: "size-[20px]"
|
|
32
|
-
}
|
|
33
|
-
};
|
|
34
|
-
var avatarVariants = utils.cva(
|
|
35
|
-
"flex items-center justify-center rounded-[28px] text-center font-semibold",
|
|
36
|
-
{
|
|
37
|
-
variants: {
|
|
38
|
-
size: {
|
|
39
|
-
xsmall: SIZE_CONFIG.xsmall.container,
|
|
40
|
-
small: SIZE_CONFIG.small.container,
|
|
41
|
-
medium: SIZE_CONFIG.medium.container,
|
|
42
|
-
large: SIZE_CONFIG.large.container
|
|
43
|
-
},
|
|
44
|
-
type: {
|
|
45
|
-
initial: "bg-elevation-elevation-5 text-elevation-elevation-0",
|
|
46
|
-
image: "bg-elevation-elevation-4 text-elevation-elevation-0"
|
|
47
|
-
}
|
|
48
|
-
},
|
|
49
|
-
compoundVariants: [
|
|
50
|
-
// Initial type variants
|
|
51
|
-
{ type: "initial", size: "xsmall", class: SIZE_CONFIG.xsmall.initialPadding },
|
|
52
|
-
{ type: "initial", size: "small", class: SIZE_CONFIG.small.initialPadding },
|
|
53
|
-
{ type: "initial", size: "medium", class: SIZE_CONFIG.medium.initialPadding },
|
|
54
|
-
{ type: "initial", size: "large", class: SIZE_CONFIG.large.initialPadding }
|
|
55
|
-
],
|
|
56
|
-
defaultVariants: {
|
|
57
|
-
size: "medium",
|
|
58
|
-
type: "initial"
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
);
|
|
62
|
-
var getInitial = (name) => {
|
|
63
|
-
return name ? name.charAt(0).toUpperCase() : "";
|
|
64
|
-
};
|
|
65
|
-
var renderInitialContent = (name) => {
|
|
66
|
-
return /* @__PURE__ */ jsxRuntime.jsx("span", { children: getInitial(name) });
|
|
67
|
-
};
|
|
68
|
-
var renderImageContent = (src, alt, name) => {
|
|
69
|
-
return /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt: alt || name || "Avatar", className: "size-full rounded-full object-cover" });
|
|
70
|
-
};
|
|
71
|
-
var renderIconContent = (size = "medium") => {
|
|
72
|
-
const iconSize = SIZE_CONFIG[size].iconSize;
|
|
73
|
-
return /* @__PURE__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.Person, { className: utils.cn("shrink-0", iconSize) });
|
|
74
|
-
};
|
|
75
|
-
var Avatar = react.forwardRef(
|
|
76
|
-
({ className, size = "medium", type = "initial", name, src, alt, ...props }, ref) => {
|
|
77
|
-
const resolvedSize = size || "medium";
|
|
78
|
-
const isFallback = type === "image" && !src;
|
|
79
|
-
const fallbackPadding = isFallback ? SIZE_CONFIG[resolvedSize].imagePadding : void 0;
|
|
80
|
-
const renderContent = () => {
|
|
81
|
-
if (type === "initial") {
|
|
82
|
-
return renderInitialContent(name);
|
|
83
|
-
}
|
|
84
|
-
if (type === "image") {
|
|
85
|
-
return src ? renderImageContent(src, alt, name) : renderIconContent(resolvedSize);
|
|
86
|
-
}
|
|
87
|
-
return null;
|
|
88
|
-
};
|
|
89
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
90
|
-
"div",
|
|
91
|
-
{
|
|
92
|
-
ref,
|
|
93
|
-
className: utils.cn(avatarVariants({ size, type }), fallbackPadding, className),
|
|
94
|
-
...props,
|
|
95
|
-
children: renderContent()
|
|
96
|
-
}
|
|
97
|
-
);
|
|
98
|
-
}
|
|
99
|
-
);
|
|
100
|
-
Avatar.displayName = "Avatar";
|
|
101
|
-
|
|
102
|
-
exports.Avatar = Avatar;
|
|
103
|
-
//# sourceMappingURL=chunk-J5ZYQ3TP.js.map
|
|
104
|
-
//# sourceMappingURL=chunk-J5ZYQ3TP.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/avatar/Avatar.tsx"],"names":["cva","jsx","Person","cn","forwardRef"],"mappings":"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","file":"chunk-J5ZYQ3TP.js","sourcesContent":["import { cn, cva, type VariantProps } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { forwardRef } from 'react';\nimport { PersonIcon } from '../icon';\n\ninterface AvatarProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof avatarVariants> {\n /** 사용자 이름. 이미지가 없을 때 이니셜 폴백에 사용됩니다. */\n name?: string;\n /** 아바타 이미지 URL */\n src?: string;\n /** 이미지 대체 텍스트 */\n alt?: string;\n}\n\ntype AvatarComponent = React.ForwardRefExoticComponent<\n AvatarProps & React.RefAttributes<HTMLDivElement>\n>;\n\n// 크기별 설정 상수\nconst SIZE_CONFIG = {\n xsmall: {\n container: 'size-[16px] text-body-3',\n initialPadding: 'px-[2.5px] leading-none tracking-tight',\n imagePadding: 'p-[2px]',\n iconSize: 'size-[12px]',\n },\n small: {\n container: 'size-[20px] text-body-2',\n initialPadding: 'px-[3.5px]',\n imagePadding: 'p-[3px]',\n iconSize: 'size-[14px]',\n },\n medium: {\n container: 'size-[24px] text-body-2',\n initialPadding: 'px-[5.5px] py-[2px]',\n imagePadding: 'p-[4px]',\n iconSize: 'size-[16px]',\n },\n large: {\n container: 'size-[32px] text-title-2',\n initialPadding: 'px-[8px] py-[3.5px]',\n imagePadding: 'p-[6px]',\n iconSize: 'size-[20px]',\n },\n} as const;\n\nconst avatarVariants = cva(\n 'flex items-center justify-center rounded-[28px] text-center font-semibold',\n {\n variants: {\n size: {\n xsmall: SIZE_CONFIG.xsmall.container,\n small: SIZE_CONFIG.small.container,\n medium: SIZE_CONFIG.medium.container,\n large: SIZE_CONFIG.large.container,\n },\n type: {\n initial: 'bg-elevation-elevation-5 text-elevation-elevation-0',\n image: 'bg-elevation-elevation-4 text-elevation-elevation-0',\n },\n },\n compoundVariants: [\n // Initial type variants\n { type: 'initial', size: 'xsmall', class: SIZE_CONFIG.xsmall.initialPadding },\n { type: 'initial', size: 'small', class: SIZE_CONFIG.small.initialPadding },\n { type: 'initial', size: 'medium', class: SIZE_CONFIG.medium.initialPadding },\n { type: 'initial', size: 'large', class: SIZE_CONFIG.large.initialPadding },\n ],\n defaultVariants: {\n size: 'medium',\n type: 'initial',\n },\n },\n);\n\nconst getInitial = (name?: string): string => {\n return name ? name.charAt(0).toUpperCase() : '';\n};\n\nconst renderInitialContent = (name?: string) => {\n return <span>{getInitial(name)}</span>;\n};\n\nconst renderImageContent = (src: string, alt?: string, name?: string) => {\n return (\n <img src={src} alt={alt || name || 'Avatar'} className=\"size-full rounded-full object-cover\" />\n );\n};\n\nconst renderIconContent = (size: keyof typeof SIZE_CONFIG = 'medium') => {\n const iconSize = SIZE_CONFIG[size].iconSize;\n return <PersonIcon className={cn('shrink-0', iconSize)} />;\n};\n\n/**\n * 사용자 아바타를 표시하는 컴포넌트입니다. 이니셜, 이미지, 아이콘 폴백을 지원합니다.\n *\n * @example\n * ```tsx\n * // 이니셜 표시\n * <Avatar name=\"홍길동\" size=\"large\" />\n *\n * // 이미지 표시\n * <Avatar type=\"image\" src=\"/avatar.png\" name=\"홍길동\" />\n *\n * // 이미지 없을 때 아이콘 폴백\n * <Avatar type=\"image\" name=\"홍길동\" />\n * ```\n *\n * @see {@link AvatarProps} props 상세\n */\nconst Avatar = forwardRef<HTMLDivElement, AvatarProps>(\n ({ className, size = 'medium', type = 'initial', name, src, alt, ...props }, ref) => {\n const resolvedSize = size || 'medium';\n const isFallback = type === 'image' && !src;\n const fallbackPadding = isFallback ? SIZE_CONFIG[resolvedSize].imagePadding : undefined;\n\n const renderContent = () => {\n if (type === 'initial') {\n return renderInitialContent(name);\n }\n\n if (type === 'image') {\n return src ? renderImageContent(src, alt, name) : renderIconContent(resolvedSize);\n }\n\n return null;\n };\n\n return (\n <div\n ref={ref}\n className={cn(avatarVariants({ size, type }), fallbackPadding, className)}\n {...props}\n >\n {renderContent()}\n </div>\n );\n },\n) as AvatarComponent;\n\nAvatar.displayName = 'Avatar';\n\nexport { Avatar };\nexport type { AvatarComponent, AvatarProps };\n"]}
|
package/dist/chunk-KPAUBWZA.mjs
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { cva, cn } from '@exem-ui/core/utils';
|
|
2
|
-
import { forwardRef } from 'react';
|
|
3
|
-
import { jsx } from 'react/jsx-runtime';
|
|
4
|
-
|
|
5
|
-
// src/badge/Badge.tsx
|
|
6
|
-
var badgeVariants = cva(
|
|
7
|
-
"inline-flex items-center rounded-strong border px-[4px] text-body-3 font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
|
8
|
-
{
|
|
9
|
-
variants: {
|
|
10
|
-
variant: {
|
|
11
|
-
accent: "border-transparent bg-solid-accent-default text-text-static-light",
|
|
12
|
-
"accent-disabled": "border-transparent bg-solid-accent-disabled text-text-inverse-disabled",
|
|
13
|
-
default: "border-transparent bg-elevation-elevation-3 text-text-secondary",
|
|
14
|
-
"default-disabled": "border-transparent bg-elevation-elevation-2 text-text-disabled"
|
|
15
|
-
}
|
|
16
|
-
},
|
|
17
|
-
defaultVariants: {
|
|
18
|
-
variant: "default"
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
);
|
|
22
|
-
var Badge = forwardRef(
|
|
23
|
-
({ className, variant = "default", disabled = false, ...props }, ref) => {
|
|
24
|
-
const finalVariant = disabled ? `${variant}-disabled` : variant;
|
|
25
|
-
return /* @__PURE__ */ jsx(
|
|
26
|
-
"div",
|
|
27
|
-
{
|
|
28
|
-
ref,
|
|
29
|
-
className: cn(badgeVariants({ variant: finalVariant }), className),
|
|
30
|
-
...props
|
|
31
|
-
}
|
|
32
|
-
);
|
|
33
|
-
}
|
|
34
|
-
);
|
|
35
|
-
Badge.displayName = "Badge";
|
|
36
|
-
|
|
37
|
-
export { Badge };
|
|
38
|
-
//# sourceMappingURL=chunk-KPAUBWZA.mjs.map
|
|
39
|
-
//# sourceMappingURL=chunk-KPAUBWZA.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/badge/Badge.tsx"],"names":[],"mappings":";;;;;AAqBA,IAAM,aAAA,GAAgB,GAAA;AAAA,EACpB,uKAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,MAAA,EAAQ,mEAAA;AAAA,QACR,iBAAA,EAAmB,wEAAA;AAAA,QACnB,OAAA,EAAS,iEAAA;AAAA,QACT,kBAAA,EAAoB;AAAA;AACtB,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ,CAAA;AAaA,IAAM,KAAA,GAAQ,UAAA;AAAA,EACZ,CAAC,EAAE,SAAA,EAAW,OAAA,GAAU,SAAA,EAAW,WAAW,KAAA,EAAO,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACvE,IAAA,MAAM,YAAA,GAAe,QAAA,GAAY,CAAA,EAAG,OAAO,CAAA,SAAA,CAAA,GAAwB,OAAA;AAEnE,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,GAAG,aAAA,CAAc,EAAE,SAAS,YAAA,EAAc,GAAG,SAAS,CAAA;AAAA,QAChE,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-KPAUBWZA.mjs","sourcesContent":["import { cn, cva } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { forwardRef } from 'react';\n\ninterface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * 배지 스타일 변형\n * @default 'default'\n */\n variant?: 'default' | 'accent';\n /**\n * 비활성화 상태\n * @default false\n */\n disabled?: boolean;\n}\n\ntype BadgeComponent = React.ForwardRefExoticComponent<\n BadgeProps & React.RefAttributes<HTMLDivElement>\n>;\n\nconst badgeVariants = cva(\n 'inline-flex items-center rounded-strong border px-[4px] text-body-3 font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',\n {\n variants: {\n variant: {\n accent: 'border-transparent bg-solid-accent-default text-text-static-light',\n 'accent-disabled': 'border-transparent bg-solid-accent-disabled text-text-inverse-disabled',\n default: 'border-transparent bg-elevation-elevation-3 text-text-secondary',\n 'default-disabled': 'border-transparent bg-elevation-elevation-2 text-text-disabled',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n },\n);\n\n/**\n * 상태나 카운트를 표시하는 배지 컴포넌트입니다.\n *\n * @example\n * ```tsx\n * <Badge variant=\"accent\">3</Badge>\n * <Badge variant=\"default\" disabled>0</Badge>\n * ```\n *\n * @see {@link BadgeProps} props 상세\n */\nconst Badge = forwardRef<HTMLDivElement, BadgeProps>(\n ({ className, variant = 'default', disabled = false, ...props }, ref) => {\n const finalVariant = disabled ? (`${variant}-disabled` as const) : variant;\n\n return (\n <div\n ref={ref}\n className={cn(badgeVariants({ variant: finalVariant }), className)}\n {...props}\n />\n );\n },\n) as BadgeComponent;\n\nBadge.displayName = 'Badge';\n\nexport { Badge };\nexport type { BadgeComponent, BadgeProps };\n"]}
|