@gusun/design-system 0.1.0 → 0.1.1

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.
@@ -0,0 +1,1534 @@
1
+ import { T as e, i as t, k as n } from "./tokens-CbcaxhkP.js";
2
+ import { Children as r, Fragment as i, cloneElement as a, forwardRef as o, isValidElement as s, useCallback as c, useEffect as l, useId as u, useLayoutEffect as d, useMemo as f, useRef as p, useState as m } from "react";
3
+ import { ChevronDown as h, ChevronRight as g, LoaderCircle as _, MoreHorizontal as v, RotateCcw as y, Search as b, Trash2 as x, Upload as S } from "lucide-react";
4
+ import { createPortal as C } from "react-dom";
5
+ import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
6
+ //#region src/components/Slot.tsx
7
+ function D(e, t) {
8
+ return (n) => {
9
+ e?.(n), t?.(n);
10
+ };
11
+ }
12
+ function O(...e) {
13
+ return (t) => {
14
+ for (let n of e) n && (typeof n == "function" ? n(t) : n.current = t);
15
+ };
16
+ }
17
+ function k(e, t) {
18
+ let n = { ...t };
19
+ for (let r in e) {
20
+ let i = e[r], a = t[r];
21
+ /^on[A-Z]/.test(r) ? n[r] = a ? D(a, i) : i : r === "className" ? n[r] = [a, i].filter(Boolean).join(" ") : r === "style" ? n[r] = {
22
+ ...a,
23
+ ...i
24
+ } : n[r] = i === void 0 ? a : i;
25
+ }
26
+ return n;
27
+ }
28
+ function A({ children: e, content: t, ref: n, ...r }) {
29
+ if (!s(e)) return console.warn("Slot(asChild): 유효한 단일 엘리먼트 자식 하나가 필요합니다."), null;
30
+ let i = e, o = i.ref, c = k(r, i.props);
31
+ return t !== void 0 && (c.children = t), (n || o) && (c.ref = O(n, o)), a(i, c);
32
+ }
33
+ //#endregion
34
+ //#region src/components/Tooltip.tsx
35
+ var j = {
36
+ error: {
37
+ bg: n["error-tooltip-bg"],
38
+ fg: n["error-tooltip-text"]
39
+ },
40
+ normal: {
41
+ bg: n["normal-tooltip-bg"],
42
+ fg: n["normal-tooltip-text"]
43
+ }
44
+ }, M = {
45
+ top: "-top-spacing-2 left-spacing-5",
46
+ bottom: "-bottom-spacing-2 left-spacing-5"
47
+ };
48
+ function N({ children: e, variant: t = "error", beak: n = "top", className: r = "" }) {
49
+ let i = j[t] ?? j.error;
50
+ return /* @__PURE__ */ E("div", {
51
+ role: "tooltip",
52
+ style: {
53
+ backgroundColor: i.bg,
54
+ color: i.fg
55
+ },
56
+ className: `relative inline-flex items-center rounded-round-4 px-spacing-5 py-spacing-2 drop-shadow-[0px_2px_2px_rgba(13,13,13,0.12)] ${r}`,
57
+ children: [n !== "none" && /* @__PURE__ */ T("span", {
58
+ "aria-hidden": "true",
59
+ style: { backgroundColor: i.bg },
60
+ className: `absolute h-spacing-5 w-spacing-5 rotate-45 rounded-[1px] ${M[n] ?? M.top}`
61
+ }), /* @__PURE__ */ T("p", {
62
+ className: "relative whitespace-nowrap text-12",
63
+ children: e
64
+ })]
65
+ });
66
+ }
67
+ //#endregion
68
+ //#region src/components/TruncatingText.tsx
69
+ function P({ children: e, as: t = "p", className: n = "", ...r }) {
70
+ let i = p(null), a = p(null), [o, s] = m(null), [c, l] = m(null);
71
+ return d(() => {
72
+ if (!o || !a.current) return;
73
+ let e = a.current.offsetWidth, t = a.current.offsetHeight, n = o.top - 6 - t;
74
+ n < 4 && (n = o.bottom + 6);
75
+ let r = o.left;
76
+ r + e > window.innerWidth - 4 && (r = window.innerWidth - e - 4), r < 4 && (r = 4), l({
77
+ top: n,
78
+ left: r
79
+ });
80
+ }, [o]), /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T(t, {
81
+ ref: i,
82
+ onMouseEnter: () => {
83
+ let e = i.current;
84
+ e && e.scrollWidth > e.clientWidth && s(e.getBoundingClientRect());
85
+ },
86
+ onMouseLeave: () => {
87
+ s(null), l(null);
88
+ },
89
+ className: `truncate ${n}`,
90
+ ...r,
91
+ children: e
92
+ }), o && C(/* @__PURE__ */ T("div", {
93
+ ref: a,
94
+ className: "pointer-events-none fixed z-[1000]",
95
+ style: {
96
+ left: c ? c.left : o.left,
97
+ top: c ? c.top : o.top,
98
+ visibility: c ? "visible" : "hidden"
99
+ },
100
+ children: /* @__PURE__ */ T(N, {
101
+ variant: "normal",
102
+ beak: "none",
103
+ children: e
104
+ })
105
+ }), document.body)] });
106
+ }
107
+ //#endregion
108
+ //#region src/components/useHoverTooltip.tsx
109
+ function F(e, { delay: t = 300 } = {}) {
110
+ let [n, r] = m(null), [i, a] = m(null), o = p(null), s = p(void 0), u = !!e;
111
+ l(() => () => clearTimeout(s.current), []);
112
+ let f = c((e) => {
113
+ if (!u) return;
114
+ let n = e.currentTarget;
115
+ clearTimeout(s.current), s.current = setTimeout(() => r(n.getBoundingClientRect()), t);
116
+ }, [u, t]), h = c(() => {
117
+ clearTimeout(s.current), r(null), a(null);
118
+ }, []);
119
+ return d(() => {
120
+ if (!n || !o.current) return;
121
+ let e = o.current.offsetWidth, t = o.current.offsetHeight, r = n.bottom + 6;
122
+ r + t > window.innerHeight - 4 && (r = n.top - 6 - t);
123
+ let i = n.left + n.width / 2 - e / 2;
124
+ i + e > window.innerWidth - 4 && (i = window.innerWidth - e - 4), i < 4 && (i = 4), a({
125
+ top: r,
126
+ left: i
127
+ });
128
+ }, [n]), {
129
+ onMouseEnter: f,
130
+ onMouseLeave: h,
131
+ tooltip: n ? C(/* @__PURE__ */ T("div", {
132
+ ref: o,
133
+ className: "pointer-events-none fixed z-[1000]",
134
+ style: {
135
+ left: i ? i.left : n.left,
136
+ top: i ? i.top : n.bottom,
137
+ visibility: i ? "visible" : "hidden"
138
+ },
139
+ children: /* @__PURE__ */ T(N, {
140
+ variant: "normal",
141
+ beak: "none",
142
+ children: e
143
+ })
144
+ }), document.body) : null
145
+ };
146
+ }
147
+ //#endregion
148
+ //#region src/components/Button.tsx
149
+ function I({ children: e, size: t = "32", variant: n = "fill", color: r = "black", weight: i = "normal", leftIcon: a = null, rightIcon: o = null, icon: c = null, disabled: l = !1, loading: u = !1, truncate: f = !1, width: m = "hug", showTooltip: h = !0, tooltip: g, asChild: v = !1, onClick: y, onMouseEnter: b, onMouseLeave: x, className: S = "", ...C }) {
150
+ let D = l || u, O = !!c, k = F(O && h ? g ?? C["aria-label"] : null), j = t === "18" || t === "24" ? 14 : 16, M = m === "fill" && n !== "underline", N = p(null), I = v && s(e) ? e : null, L = I ? I.props.children : e;
151
+ d(() => {
152
+ let e = N.current;
153
+ if (!e || f || M) {
154
+ e && M && (e.style.width = "");
155
+ return;
156
+ }
157
+ e.style.width = "", e.style.width = e.offsetWidth + "px";
158
+ }, [
159
+ e,
160
+ t,
161
+ n,
162
+ a,
163
+ o,
164
+ c,
165
+ l,
166
+ u,
167
+ f,
168
+ M
169
+ ]);
170
+ let ee = `inline-flex items-center justify-center relative font-pretendard ${n === "underline" && i === "semibold" ? "font-semibold" : "font-normal"} whitespace-nowrap rounded-round-4 transition-colors select-none focus:outline-none`, te = f ? "min-w-0 max-w-full" : "", R = M ? "w-full" : "", z;
171
+ z = n === "underline" ? t === "24" ? "min-h-[24px] text-[12px] leading-5 tracking-[0px]" : "min-h-[32px] text-[14px] leading-6 tracking-[0px]" : O ? t === "18" ? "min-h-[18px] min-w-[18px] p-spacing-2" : t === "24" ? "min-h-[24px] min-w-[24px] p-spacing-2" : "min-h-[32px] min-w-[32px] p-spacing-3" : t === "24" ? "min-h-[24px] min-w-[24px] px-spacing-5 py-spacing-2 text-[12px] leading-5 tracking-[0px]" : "min-h-[32px] min-w-[32px] px-spacing-6 py-spacing-3 text-[14px] leading-6 tracking-[0px]";
172
+ let B;
173
+ if (n === "fill") B = D ? "bg-button-fill-disabled-bg text-button-fill-disabled-fg cursor-not-allowed" : "bg-button-fill-default-bg text-button-fill-default-fg cursor-pointer hover:bg-button-fill-hover-bg focus-visible:bg-button-fill-hover-bg active:bg-button-fill-default-bg";
174
+ else if (n === "line") B = D ? "bg-button-line-disabled-bg text-button-line-disabled-fg cursor-not-allowed" : "bg-button-line-default-bg text-button-line-default-fg ring-1 ring-inset ring-button-line-default-line cursor-pointer hover:bg-button-line-hover-bg hover:ring-button-line-hover-line focus-visible:bg-button-line-hover-bg focus-visible:ring-button-line-hover-line active:bg-button-line-default-bg active:ring-button-line-default-line";
175
+ else if (n === "underline") {
176
+ let e = {
177
+ black: "text-button-underline-black-fg",
178
+ red: "text-button-underline-red-fg",
179
+ blue: "text-button-underline-blue-fg",
180
+ green: "text-button-underline-green-fg",
181
+ violet: "text-button-underline-violet-fg",
182
+ pink: "text-button-underline-pink-fg",
183
+ orange: "text-button-underline-orange-fg"
184
+ };
185
+ B = D ? "bg-transparent text-font-icon-2 cursor-not-allowed" : `bg-transparent ${e[r] ?? e.black} cursor-pointer hover:underline focus-visible:underline active:no-underline`;
186
+ } else B = D ? "bg-transparent text-font-icon-2 cursor-not-allowed" : "bg-transparent text-button-ghost-default-fg cursor-pointer hover:bg-button-ghost-hover-bg focus-visible:bg-button-ghost-hover-bg active:bg-transparent";
187
+ let ne = /* @__PURE__ */ E(w, { children: [u && /* @__PURE__ */ T("span", {
188
+ className: "absolute inset-0 flex items-center justify-center",
189
+ children: /* @__PURE__ */ T(_, {
190
+ size: j,
191
+ strokeWidth: 1.8,
192
+ className: "animate-spin text-font-icon-3"
193
+ })
194
+ }), /* @__PURE__ */ T("span", {
195
+ className: `inline-flex items-center gap-spacing-3 ${f ? "min-w-0" : ""} ${u ? "opacity-0" : ""}`,
196
+ children: O ? /* @__PURE__ */ T(c, {
197
+ size: j,
198
+ strokeWidth: 1.8
199
+ }) : /* @__PURE__ */ E(w, { children: [
200
+ a && /* @__PURE__ */ T(a, {
201
+ size: j,
202
+ strokeWidth: 1.8,
203
+ className: "shrink-0"
204
+ }),
205
+ f ? /* @__PURE__ */ T(P, {
206
+ as: "span",
207
+ className: "min-w-0",
208
+ children: L
209
+ }) : L,
210
+ o && /* @__PURE__ */ T(o, {
211
+ size: j,
212
+ strokeWidth: 1.8,
213
+ className: "shrink-0"
214
+ })
215
+ ] })
216
+ })] }), V = `${ee} ${z} ${B} ${te} ${R} ${S}`, H = (e) => {
217
+ b?.(e), k.onMouseEnter(e);
218
+ }, U = (e) => {
219
+ x?.(e), k.onMouseLeave();
220
+ };
221
+ return /* @__PURE__ */ E(w, { children: [I ? /* @__PURE__ */ T(A, {
222
+ ref: N,
223
+ content: ne,
224
+ className: V,
225
+ "aria-disabled": D || void 0,
226
+ onClick: D ? void 0 : y,
227
+ onMouseEnter: H,
228
+ onMouseLeave: U,
229
+ ...C,
230
+ children: I
231
+ }) : /* @__PURE__ */ T("button", {
232
+ ref: N,
233
+ className: V,
234
+ disabled: D,
235
+ onClick: D ? void 0 : y,
236
+ onMouseEnter: H,
237
+ onMouseLeave: U,
238
+ ...C,
239
+ children: ne
240
+ }), k.tooltip] });
241
+ }
242
+ //#endregion
243
+ //#region src/components/Input.tsx
244
+ var L = "ring-inset ring-text-field-hover-line hover:ring-2 focus-within:ring-2 focus-within:ring-text-field-focused-line", ee = {
245
+ 32: {
246
+ box: "min-h-[32px] px-spacing-6 py-spacing-3",
247
+ text: "text-14"
248
+ },
249
+ 22: {
250
+ box: "min-h-[22px] px-spacing-5 py-spacing-2",
251
+ text: "text-12 leading-18"
252
+ }
253
+ };
254
+ function te({ value: e, defaultValue: t, onChange: n, placeholder: r = "텍스트를 입력하세요", size: i = "32", disabled: a = !1, readOnly: o = !1, error: s = !1, errorMessage: c = "", width: l = 200, className: u = "", inputProps: d = {}, ...f }) {
255
+ let p = !a && !o, m = typeof l == "number" ? `${l}px` : l, h = ee[i] ?? ee[32], g = a ? "text-text-field-disabled-text" : o ? "text-text-field-readonly-text" : "text-text-field-filled-text", _ = a ? "placeholder:text-text-field-disabled-text" : "placeholder:text-text-field-default-text";
256
+ return /* @__PURE__ */ E("div", {
257
+ style: { width: m },
258
+ className: `relative flex items-center gap-spacing-3 rounded-round-4 bg-text-field-default-bg transition-shadow ${h.box} ${p ? L : "cursor-not-allowed"} ${u}`,
259
+ ...f,
260
+ children: [/* @__PURE__ */ T("input", {
261
+ value: e,
262
+ defaultValue: t,
263
+ onChange: n,
264
+ placeholder: r,
265
+ disabled: a,
266
+ readOnly: o,
267
+ "aria-invalid": s || void 0,
268
+ className: `min-w-0 flex-1 bg-transparent outline-none ${h.text} ${_} disabled:cursor-not-allowed read-only:cursor-default ${g}`,
269
+ ...d
270
+ }), s && c && /* @__PURE__ */ T("div", {
271
+ className: "absolute left-0 top-full z-10 mt-spacing-2",
272
+ children: /* @__PURE__ */ T(N, {
273
+ variant: "error",
274
+ beak: "top",
275
+ children: c
276
+ })
277
+ })]
278
+ });
279
+ }
280
+ //#endregion
281
+ //#region src/components/ScrollArea.tsx
282
+ var R = 24, z = 6, B = 16;
283
+ function ne(e, t) {
284
+ let n = e.querySelector("[data-scroll-sticky-top]"), r = n ? n.offsetHeight : 0, i = t && e.scrollWidth > e.clientWidth + 1 ? B : 0;
285
+ return {
286
+ topInset: r,
287
+ trackH: e.clientHeight - r - i - z * 2
288
+ };
289
+ }
290
+ var V = {
291
+ default: {
292
+ base: e["scroll-bar"],
293
+ active: e["scroll-bar-hover"]
294
+ },
295
+ light: {
296
+ base: e["scroll-bar-light"],
297
+ active: e["scroll-bar-light-hover"]
298
+ }
299
+ }, H = "before:absolute before:-inset-spacing-2 before:content-['']";
300
+ function U({ orientation: e, thumb: t, active: n, colors: r, onDown: i, onEnter: a, onLeave: o }) {
301
+ let s = e === "vertical", c = s ? "right-spacing-3 w-spacing-4" : "bottom-spacing-3 h-spacing-4", l = s ? {
302
+ top: `${t.pos}px`,
303
+ height: `${t.size}px`
304
+ } : {
305
+ left: `${t.pos}px`,
306
+ width: `${t.size}px`
307
+ };
308
+ return /* @__PURE__ */ T("div", {
309
+ onMouseDown: i,
310
+ onMouseEnter: a,
311
+ onMouseLeave: o,
312
+ className: `absolute cursor-pointer rounded-round-00 ${H} ${c}`,
313
+ style: {
314
+ ...l,
315
+ opacity: +!!t.visible,
316
+ pointerEvents: t.visible ? "auto" : "none",
317
+ backgroundColor: n ? r.active : r.base
318
+ }
319
+ });
320
+ }
321
+ function W({ children: e, maxHeight: t, horizontal: n = !1, variant: r = "default", onViewport: i, onScroll: a, vScrollEl: o = null, className: s = "", contentClassName: u = "", ...f }) {
322
+ let h = V[r] ?? V.default, g = p(null), _ = p(null), v = c((e) => {
323
+ g.current = e, i?.(e);
324
+ }, [i]), y = p(!1), b = p(!1), [x, S] = m({
325
+ pos: 0,
326
+ size: 0,
327
+ visible: !1
328
+ }), [C, w] = m({
329
+ pos: 0,
330
+ size: 0,
331
+ visible: !1
332
+ }), [D, O] = m(!1), [k, A] = m(!1), j = typeof t == "number" ? `${t}px` : t, M = c(() => {
333
+ let e = g.current;
334
+ if (o) {
335
+ let t = _.current?.getBoundingClientRect().top ?? 0, r = o.getBoundingClientRect().top - t, i = n && e && e.scrollWidth > e.clientWidth + 1 ? B : 0;
336
+ return {
337
+ vEl: o,
338
+ topInset: r,
339
+ sizeInset: 0,
340
+ trackH: o.clientHeight - i - z * 2
341
+ };
342
+ }
343
+ let { topInset: t, trackH: r } = ne(e, n);
344
+ return {
345
+ vEl: e,
346
+ topInset: t,
347
+ sizeInset: t,
348
+ trackH: r
349
+ };
350
+ }, [o, n]), N = c(() => {
351
+ let e = g.current;
352
+ if (!e) return;
353
+ let { scrollWidth: t, clientWidth: r, scrollLeft: i } = e, { vEl: a, topInset: o, sizeInset: s, trackH: c } = M(), { scrollHeight: l, clientHeight: u, scrollTop: d } = a;
354
+ if (l <= u + 1) S((e) => e.visible ? {
355
+ ...e,
356
+ visible: !1
357
+ } : e);
358
+ else {
359
+ let e = Math.max((u - s) / (l - s) * c, R);
360
+ S({
361
+ pos: z + o + d / (l - u) * (c - e),
362
+ size: e,
363
+ visible: !0
364
+ });
365
+ }
366
+ if (!n || t <= r + 1) w((e) => e.visible ? {
367
+ ...e,
368
+ visible: !1
369
+ } : e);
370
+ else {
371
+ let e = r - z * 2, n = Math.max(r / t * e, R);
372
+ w({
373
+ pos: z + i / (t - r) * (e - n),
374
+ size: n,
375
+ visible: !0
376
+ });
377
+ }
378
+ }, [n, M]), P = p(0), F = c(() => {
379
+ P.current ||= requestAnimationFrame(() => {
380
+ P.current = 0, N();
381
+ });
382
+ }, [N]);
383
+ l(() => () => {
384
+ P.current &&= (cancelAnimationFrame(P.current), 0);
385
+ }, []), d(() => {
386
+ F();
387
+ let e = g.current;
388
+ if (!e) return;
389
+ let t = new ResizeObserver(F);
390
+ return t.observe(e), () => t.disconnect();
391
+ }, [F, e]), d(() => {
392
+ if (!o) return;
393
+ o.addEventListener("scroll", F);
394
+ let e = new ResizeObserver(F);
395
+ return e.observe(o), () => {
396
+ o.removeEventListener("scroll", F), e.disconnect();
397
+ };
398
+ }, [o, F]);
399
+ let I = p(null);
400
+ l(() => () => I.current?.(), []);
401
+ let L = (e, t) => {
402
+ e.preventDefault(), e.stopPropagation();
403
+ let n = t === "vertical", r = n ? y : b, i = n ? O : A, a = n ? M().vEl : g.current;
404
+ r.current = !0, i(!0);
405
+ let o = n ? e.clientY : e.clientX, s = n ? a.scrollTop : a.scrollLeft, c = n ? a.scrollHeight - a.clientHeight : a.scrollWidth - a.clientWidth, l = (n ? M().trackH : a.clientWidth - z * 2) - (n ? x.size : C.size), u = l > 0 ? c / l : 0, d = (e) => {
406
+ let t = (n ? e.clientY : e.clientX) - o;
407
+ n ? a.scrollTop = s + t * u : a.scrollLeft = s + t * u;
408
+ }, f = () => {
409
+ r.current = !1, i(!1), document.body.style.userSelect = "", window.removeEventListener("mousemove", d), window.removeEventListener("mouseup", f), I.current = null;
410
+ };
411
+ document.body.style.userSelect = "none", window.addEventListener("mousemove", d), window.addEventListener("mouseup", f), I.current = f;
412
+ };
413
+ return /* @__PURE__ */ E("div", {
414
+ ref: _,
415
+ className: `${/(^|\s)(absolute|fixed|relative|sticky)(\s|$)/.test(s) ? "" : "relative"} ${s}`,
416
+ ...f,
417
+ children: [
418
+ /* @__PURE__ */ T("div", {
419
+ ref: v,
420
+ onScroll: (e) => {
421
+ F(), a?.(e);
422
+ },
423
+ className: `hide-native-scroll ${n ? "overflow-auto" : "overflow-y-auto"} ${u}`,
424
+ style: { maxHeight: j },
425
+ children: e
426
+ }),
427
+ /* @__PURE__ */ T(U, {
428
+ orientation: "vertical",
429
+ thumb: x,
430
+ active: D,
431
+ colors: h,
432
+ onDown: (e) => L(e, "vertical"),
433
+ onEnter: () => O(!0),
434
+ onLeave: () => {
435
+ y.current || O(!1);
436
+ }
437
+ }),
438
+ n && /* @__PURE__ */ T(U, {
439
+ orientation: "horizontal",
440
+ thumb: C,
441
+ active: k,
442
+ colors: h,
443
+ onDown: (e) => L(e, "horizontal"),
444
+ onEnter: () => A(!0),
445
+ onLeave: () => {
446
+ b.current || A(!1);
447
+ }
448
+ })
449
+ ]
450
+ });
451
+ }
452
+ //#endregion
453
+ //#region src/components/chipStyles.ts
454
+ var re = {
455
+ gray: "text-chip-gray-default-text border-chip-gray-default-line bg-chip-gray-default-bg hover:text-chip-gray-hover-text hover:border-chip-gray-hover-line hover:bg-chip-gray-hover-bg focus-visible:text-chip-gray-hover-text focus-visible:border-chip-gray-hover-line focus-visible:bg-chip-gray-hover-bg data-[chain-focus]:text-chip-gray-hover-text data-[chain-focus]:border-chip-gray-hover-line data-[chain-focus]:bg-chip-gray-hover-bg",
456
+ red: "text-chip-red-default-text border-chip-red-default-line bg-chip-red-default-bg hover:text-chip-red-hover-text hover:border-chip-red-hover-line hover:bg-chip-red-hover-bg focus-visible:text-chip-red-hover-text focus-visible:border-chip-red-hover-line focus-visible:bg-chip-red-hover-bg data-[chain-focus]:text-chip-red-hover-text data-[chain-focus]:border-chip-red-hover-line data-[chain-focus]:bg-chip-red-hover-bg",
457
+ blue: "text-chip-blue-default-text border-chip-blue-default-line bg-chip-blue-default-bg hover:text-chip-blue-hover-text hover:border-chip-blue-hover-line hover:bg-chip-blue-hover-bg focus-visible:text-chip-blue-hover-text focus-visible:border-chip-blue-hover-line focus-visible:bg-chip-blue-hover-bg data-[chain-focus]:text-chip-blue-hover-text data-[chain-focus]:border-chip-blue-hover-line data-[chain-focus]:bg-chip-blue-hover-bg",
458
+ black: "text-chip-black-default-text border-chip-black-default-line bg-chip-black-default-bg hover:text-chip-black-hover-text hover:border-chip-black-hover-line hover:bg-chip-black-hover-bg focus-visible:text-chip-black-hover-text focus-visible:border-chip-black-hover-line focus-visible:bg-chip-black-hover-bg data-[chain-focus]:text-chip-black-hover-text data-[chain-focus]:border-chip-black-hover-line data-[chain-focus]:bg-chip-black-hover-bg",
459
+ green: "text-chip-green-default-text border-chip-green-default-line bg-chip-green-default-bg hover:text-chip-green-hover-text hover:border-chip-green-hover-line hover:bg-chip-green-hover-bg focus-visible:text-chip-green-hover-text focus-visible:border-chip-green-hover-line focus-visible:bg-chip-green-hover-bg data-[chain-focus]:text-chip-green-hover-text data-[chain-focus]:border-chip-green-hover-line data-[chain-focus]:bg-chip-green-hover-bg",
460
+ violet: "text-chip-violet-default-text border-chip-violet-default-line bg-chip-violet-default-bg hover:text-chip-violet-hover-text hover:border-chip-violet-hover-line hover:bg-chip-violet-hover-bg focus-visible:text-chip-violet-hover-text focus-visible:border-chip-violet-hover-line focus-visible:bg-chip-violet-hover-bg data-[chain-focus]:text-chip-violet-hover-text data-[chain-focus]:border-chip-violet-hover-line data-[chain-focus]:bg-chip-violet-hover-bg",
461
+ pink: "text-chip-pink-default-text border-chip-pink-default-line bg-chip-pink-default-bg hover:text-chip-pink-hover-text hover:border-chip-pink-hover-line hover:bg-chip-pink-hover-bg focus-visible:text-chip-pink-hover-text focus-visible:border-chip-pink-hover-line focus-visible:bg-chip-pink-hover-bg data-[chain-focus]:text-chip-pink-hover-text data-[chain-focus]:border-chip-pink-hover-line data-[chain-focus]:bg-chip-pink-hover-bg",
462
+ orange: "text-chip-orange-default-text border-chip-orange-default-line bg-chip-orange-default-bg hover:text-chip-orange-hover-text hover:border-chip-orange-hover-line hover:bg-chip-orange-hover-bg focus-visible:text-chip-orange-hover-text focus-visible:border-chip-orange-hover-line focus-visible:bg-chip-orange-hover-bg data-[chain-focus]:text-chip-orange-hover-text data-[chain-focus]:border-chip-orange-hover-line data-[chain-focus]:bg-chip-orange-hover-bg"
463
+ }, ie = o(function({ icon: e = null, children: t, size: n = "24", open: r = !1, disabled: i = !1, readOnly: a = !1, interactive: o, maxWidth: s, fill: c = !1, className: l = "", ...u }, d) {
464
+ let f = o ?? (!i && !a), p = i ? "text-font-icon-2" : r ? "text-font-icon-3" : "text-font-icon-5", m = i || a ? "text-font-icon-2" : "text-font-icon-5", g = n === "20" ? "text-12" : "text-14", _ = n === "20" ? 14 : 16;
465
+ return /* @__PURE__ */ E("span", {
466
+ ref: d,
467
+ className: `group min-w-0 select-none items-center gap-spacing-3 focus:outline-none ${c ? "flex w-full justify-between" : "inline-flex"} ${f ? "cursor-pointer" : i ? "cursor-not-allowed" : "cursor-default"} ${l}`,
468
+ ...u,
469
+ children: [
470
+ e && /* @__PURE__ */ T(e, {
471
+ size: _,
472
+ strokeWidth: 1.8,
473
+ className: `shrink-0 ${m}`
474
+ }),
475
+ /* @__PURE__ */ T(P, {
476
+ style: s ? { maxWidth: s } : void 0,
477
+ className: `min-w-0 font-normal ${c ? "flex-1" : ""} ${g} ${p} ${f ? "group-hover:underline group-focus-visible:underline" : ""}`,
478
+ children: t
479
+ }),
480
+ /* @__PURE__ */ T(h, {
481
+ size: _,
482
+ strokeWidth: 1.8,
483
+ className: `pointer-events-none shrink-0 transition-transform ${m} ${r ? "rotate-180" : ""}`
484
+ })
485
+ ]
486
+ });
487
+ }), ae = "ring-inset ring-text-field-hover-line hover:ring-2 focus-within:ring-2 focus-within:ring-text-field-focused-line";
488
+ function oe({ value: e, defaultValue: t, onChange: n, onSubmit: r, placeholder: i = "검색어를 입력하세요", disabled: a = !1, width: o = 200, className: s = "", inputProps: c = {}, ...l }) {
489
+ return /* @__PURE__ */ E("div", {
490
+ style: { width: typeof o == "number" ? `${o}px` : o },
491
+ className: `group relative flex min-h-[32px] items-center gap-spacing-3 rounded-round-4 bg-text-field-default-bg px-spacing-6 py-spacing-3 transition-shadow ${a ? "cursor-not-allowed" : ae} ${s}`,
492
+ ...l,
493
+ children: [/* @__PURE__ */ T(b, {
494
+ size: 16,
495
+ strokeWidth: 1.8,
496
+ className: `shrink-0 ${a ? "text-text-field-disabled-icon" : "text-text-field-default-text group-focus-within:text-text-field-filled-text"}`
497
+ }), /* @__PURE__ */ T("input", {
498
+ type: "search",
499
+ value: e,
500
+ defaultValue: t,
501
+ onChange: n,
502
+ placeholder: i,
503
+ disabled: a,
504
+ className: "min-w-0 flex-1 bg-transparent text-14 text-text-field-filled-text outline-none placeholder:text-text-field-default-text disabled:cursor-not-allowed disabled:text-text-field-disabled-text disabled:placeholder:text-text-field-disabled-text [&::-webkit-search-cancel-button]:appearance-none",
505
+ ...c,
506
+ onKeyDown: (e) => {
507
+ e.key === "Enter" && r && r(e.currentTarget.value), c?.onKeyDown?.(e);
508
+ }
509
+ })]
510
+ });
511
+ }
512
+ //#endregion
513
+ //#region src/components/Checkbox.tsx
514
+ var se = {
515
+ 3: "gap-spacing-3",
516
+ 4: "gap-spacing-4",
517
+ 5: "gap-spacing-5",
518
+ 6: "gap-spacing-6",
519
+ 7: "gap-spacing-7"
520
+ };
521
+ function ce({ className: e }) {
522
+ return /* @__PURE__ */ T("svg", {
523
+ viewBox: "0 0 8.34188 6.51667",
524
+ fill: "currentColor",
525
+ "aria-hidden": "true",
526
+ className: e,
527
+ children: /* @__PURE__ */ T("path", { d: "M2.84188 4.11667L6.64188 0.316667C6.85299 0.105556 7.08355 0 7.33355 0C7.58355 0 7.8141 0.105556 8.02521 0.316667C8.23633 0.527778 8.34188 0.761111 8.34188 1.01667C8.34188 1.27222 8.23633 1.50556 8.02521 1.71667L3.54188 6.21667C3.34188 6.41667 3.10577 6.51667 2.83355 6.51667C2.56132 6.51667 2.32521 6.41667 2.12521 6.21667L0.308547 4.4C0.0974359 4.18889 -0.00534188 3.95556 0.000213675 3.7C0.00576923 3.44444 0.114103 3.21111 0.325214 3C0.536325 2.78889 0.769658 2.68333 1.02521 2.68333C1.28077 2.68333 1.5141 2.78889 1.72521 3L2.84188 4.11667Z" })
528
+ });
529
+ }
530
+ function G({ checked: e, defaultChecked: t = !1, onChange: n, disabled: r = !1, label: i, className: a = "", ...o }) {
531
+ let s = e !== void 0, [c, l] = m(t), u = s ? e : c, d = (e) => {
532
+ s || l(e.target.checked), n?.(e);
533
+ }, f = "group-hover:ring-2 group-hover:ring-offset-1", p = "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-1", h;
534
+ h = r ? u ? "bg-checkbox-selected-disabled-bg" : "bg-checkbox-disabled-bg" : u ? `bg-checkbox-selected-bg ${f} group-hover:ring-checkbox-selected-hover-outline ${p} peer-focus-visible:ring-checkbox-selected-hover-outline` : `bg-checkbox-unselected-bg ${f} group-hover:ring-checkbox-hover-outline ${p} peer-focus-visible:ring-checkbox-hover-outline`;
535
+ let g = r ? "text-checkbox-disabled-check" : "text-checkbox-check", _ = r ? "text-checkbox-disabled-text" : "text-checkbox-text";
536
+ return /* @__PURE__ */ E("label", {
537
+ className: `group relative inline-flex items-center gap-spacing-4 ${r ? "cursor-not-allowed" : "cursor-pointer"} ${a}`,
538
+ children: [
539
+ /* @__PURE__ */ T("input", {
540
+ type: "checkbox",
541
+ className: "peer sr-only",
542
+ checked: u,
543
+ onChange: d,
544
+ disabled: r,
545
+ ...o
546
+ }),
547
+ /* @__PURE__ */ T("span", {
548
+ className: `flex size-[16px] shrink-0 items-center justify-center rounded-round-3 transition-shadow ${h}`,
549
+ children: /* @__PURE__ */ T(ce, { className: `w-[8px] ${u ? g : "invisible"}` })
550
+ }),
551
+ i != null && /* @__PURE__ */ T("span", {
552
+ className: `text-14 ${_}`,
553
+ children: i
554
+ })
555
+ ]
556
+ });
557
+ }
558
+ function K({ items: e = [], value: t, defaultValue: n = [], onChange: r, direction: i = "vertical", gap: a = "7", disabled: o = !1, className: s = "", ...c }) {
559
+ let l = t !== void 0, [u, d] = m(n), f = t === void 0 ? u : t, p = (e, t) => {
560
+ let n = t ? [...f, e] : f.filter((t) => t !== e);
561
+ l || d(n), r?.(n, {
562
+ value: e,
563
+ checked: t
564
+ });
565
+ }, h = se[a] ?? se[7];
566
+ return /* @__PURE__ */ T("div", {
567
+ role: "group",
568
+ className: `inline-flex ${i === "horizontal" ? "flex-row items-center" : "flex-col items-start"} ${h} ${s}`,
569
+ ...c,
570
+ children: e.map((e) => /* @__PURE__ */ T(G, {
571
+ label: e.label,
572
+ checked: f.includes(e.value),
573
+ disabled: o || e.disabled,
574
+ onChange: (t) => p(e.value, t.target.checked)
575
+ }, e.value))
576
+ });
577
+ }
578
+ //#endregion
579
+ //#region src/components/PopoverMenu.tsx
580
+ function le({ children: e, topArea: t = "none", searchValue: n, onSearchChange: r, searchPlaceholder: i = "검색어를 입력하세요", searchInputProps: a = {}, inputValue: o, onInputChange: s, inputPlaceholder: c = "텍스트를 입력하세요", inputProps: l = {}, footer: u = !1, footerStart: d = null, footerText: f = null, footerCheckbox: p = !1, footerChecked: m = !1, onFooterCheckChange: h, footerCheckLabel: g = "전체 선택", footerReset: _ = !1, onFooterReset: v, footerResetLabel: b = "초기화", footerResetIcon: x = y, cancelText: S = "취소", onCancel: C, confirmText: w = "확인", onConfirm: D, confirmVariant: O = "fill", confirmDisabled: k = !1, confirmLoading: A = !1, showCancel: j = !0, showConfirm: M = !0, footerButtonsFill: N = !1, width: P = 304, className: F = "", ...L }) {
581
+ let ee = typeof P == "number" ? `${P}px` : P, R = null;
582
+ return d == null ? p ? R = /* @__PURE__ */ T(G, {
583
+ label: g,
584
+ checked: m,
585
+ onChange: h
586
+ }) : _ ? R = /* @__PURE__ */ T(I, {
587
+ variant: "underline",
588
+ size: "32",
589
+ leftIcon: x,
590
+ onClick: v,
591
+ children: b
592
+ }) : f != null && (R = /* @__PURE__ */ T("p", {
593
+ className: "text-14 text-font-icon-5",
594
+ children: f
595
+ })) : R = typeof d == "string" ? /* @__PURE__ */ T("p", {
596
+ className: "text-14 text-font-icon-5",
597
+ children: d
598
+ }) : d, /* @__PURE__ */ E("div", {
599
+ style: { width: ee },
600
+ onKeyDown: (e) => {
601
+ !u || !M || e.key !== "Enter" || e.defaultPrevented || k || A || (e.preventDefault(), D?.());
602
+ },
603
+ tabIndex: u && M ? -1 : void 0,
604
+ className: `flex flex-col gap-spacing-1 overflow-hidden rounded-round-4 outline outline-1 outline-list-popover-outline bg-list-popover-bg shadow-[0px_2px_5px_0px_rgba(13,13,13,0.12)] ${F}`,
605
+ ...L,
606
+ children: [
607
+ t === "search" && /* @__PURE__ */ T("div", {
608
+ className: "w-full bg-list-group-bg p-spacing-5",
609
+ children: /* @__PURE__ */ T(oe, {
610
+ value: n,
611
+ onChange: r,
612
+ placeholder: i,
613
+ width: "100%",
614
+ inputProps: a
615
+ })
616
+ }),
617
+ t === "input" && /* @__PURE__ */ T("div", {
618
+ className: "w-full bg-list-group-bg p-spacing-5",
619
+ children: /* @__PURE__ */ T(te, {
620
+ value: o,
621
+ onChange: s,
622
+ placeholder: c,
623
+ width: "100%",
624
+ inputProps: l
625
+ })
626
+ }),
627
+ e,
628
+ u && /* @__PURE__ */ E("div", {
629
+ className: `flex w-full items-center bg-list-group-bg py-spacing-5 ${N ? "px-spacing-5" : "justify-between pl-spacing-6 pr-spacing-5"}`,
630
+ children: [!N && /* @__PURE__ */ T("div", {
631
+ className: "flex min-w-0 items-center",
632
+ children: R
633
+ }), /* @__PURE__ */ E(Ie, {
634
+ gap: "5",
635
+ width: N ? "fill" : "hug",
636
+ className: N ? "" : "shrink-0",
637
+ children: [j && /* @__PURE__ */ T(I, {
638
+ variant: "line",
639
+ size: "32",
640
+ onClick: C,
641
+ children: S
642
+ }), M && /* @__PURE__ */ T(I, {
643
+ variant: O,
644
+ size: "32",
645
+ disabled: k,
646
+ loading: A,
647
+ onClick: D,
648
+ children: w
649
+ })]
650
+ })]
651
+ })
652
+ ]
653
+ });
654
+ }
655
+ function q({ children: e, className: t = "", ...n }) {
656
+ return /* @__PURE__ */ T("div", {
657
+ className: `flex w-full items-stretch gap-spacing-1 ${t}`,
658
+ ...n,
659
+ children: e
660
+ });
661
+ }
662
+ function ue({ children: e, className: t = "", ...n }) {
663
+ return /* @__PURE__ */ T("div", {
664
+ className: `flex min-w-0 flex-1 flex-col gap-spacing-1 ${t}`,
665
+ ...n,
666
+ children: e
667
+ });
668
+ }
669
+ function de({ title: e, children: t, grow: n = !1, className: r = "", ...i }) {
670
+ return /* @__PURE__ */ E("div", {
671
+ className: `w-full bg-list-group-bg py-spacing-4 ${n ? "min-h-0 flex-1" : ""} ${r}`,
672
+ ...i,
673
+ children: [e != null && /* @__PURE__ */ T("p", {
674
+ className: "px-spacing-6 py-spacing-2 text-12 text-font-icon-3",
675
+ children: e
676
+ }), t]
677
+ });
678
+ }
679
+ //#endregion
680
+ //#region src/components/ListEmpty.tsx
681
+ function fe({ message: e = "검색 결과가 없습니다.", className: t = "", ...n }) {
682
+ return /* @__PURE__ */ T("div", {
683
+ className: `flex w-full items-center justify-center bg-list-empty-bg px-spacing-6 py-spacing-9 text-14 text-list-empty-text ${t}`,
684
+ ...n,
685
+ children: e
686
+ });
687
+ }
688
+ //#endregion
689
+ //#region src/components/ListGroup.tsx
690
+ var pe = 32, me = 6, he = {
691
+ 2: "gap-spacing-2",
692
+ 3: "gap-spacing-3"
693
+ }, J = {
694
+ 2: 2,
695
+ 3: 4
696
+ };
697
+ function ge({ children: e, maxVisible: t = 6, gap: n, empty: i = !1, emptyMessage: a, className: o = "", ...s }) {
698
+ let c = n ? J[n] : 0, l = t * pe + c * (t - 1) + me * 2, u = i || r.count(e) === 0;
699
+ return /* @__PURE__ */ T("div", {
700
+ className: `w-full bg-list-group-bg ${o}`,
701
+ ...s,
702
+ children: /* @__PURE__ */ T(W, {
703
+ maxHeight: l,
704
+ contentClassName: `py-spacing-4 ${n ? `flex flex-col ${he[n]}` : ""}`,
705
+ children: u ? /* @__PURE__ */ T(fe, { message: a }) : e
706
+ })
707
+ });
708
+ }
709
+ //#endregion
710
+ //#region src/components/Tag.tsx
711
+ var Y = {
712
+ blue: "bg-tag-blue-bg text-tag-blue-text",
713
+ red: "bg-tag-red-bg text-tag-red-text",
714
+ gray: "bg-tag-gray-bg text-tag-gray-text",
715
+ black: "bg-tag-black-bg text-tag-black-text"
716
+ };
717
+ function X({ children: e = "태그", color: t = "blue", width: n = "hug", className: r = "", ...i }) {
718
+ let a = Y[t] ?? Y.blue;
719
+ return /* @__PURE__ */ T("span", {
720
+ className: `${n === "fill" ? "flex w-full" : "inline-flex shrink-0"} items-center justify-center rounded-round-4 px-spacing-4 py-spacing-1 text-12 ${a} ${r}`,
721
+ ...i,
722
+ children: e
723
+ });
724
+ }
725
+ var _e = {
726
+ blue: "bg-new-tag-blue-bg",
727
+ red: "bg-new-tag-red-bg",
728
+ black: "bg-new-tag-black-bg"
729
+ };
730
+ function Z({ color: e = "blue", children: t = "N", className: n = "", ...r }) {
731
+ return /* @__PURE__ */ T("span", {
732
+ className: `inline-flex h-[18px] w-[18px] shrink-0 items-center justify-center rounded-round-00 text-12 font-semibold text-new-tag-title ${_e[e] ?? _e.blue} ${n}`,
733
+ ...r,
734
+ children: t
735
+ });
736
+ }
737
+ //#endregion
738
+ //#region src/components/Radio.tsx
739
+ var ve = {
740
+ 3: "gap-spacing-3",
741
+ 4: "gap-spacing-4",
742
+ 5: "gap-spacing-5",
743
+ 6: "gap-spacing-6",
744
+ 7: "gap-spacing-7"
745
+ };
746
+ function ye({ checked: e, defaultChecked: t = !1, onChange: n, disabled: r = !1, label: i, name: a, value: o, className: s = "", ...c }) {
747
+ let l = e !== void 0, [u, d] = m(t), f = l ? e : u, p = (e) => {
748
+ l || d(e.target.checked), n?.(e);
749
+ }, h = "group-hover:ring-2 group-hover:ring-offset-1", g = "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-1", _;
750
+ _ = r ? f ? "bg-radio-selected-disabled-bg" : "bg-radio-disabled-bg" : f ? `bg-radio-selected-bg ${h} group-hover:ring-radio-selected-hover-outline ${g} peer-focus-visible:ring-radio-selected-hover-outline` : `bg-radio-unselected-bg ${h} group-hover:ring-radio-hover-outline ${g} peer-focus-visible:ring-radio-hover-outline`;
751
+ let v = r ? "bg-radio-disabled-point" : "bg-radio-point", y = r ? "text-radio-disabled-text" : "text-radio-text";
752
+ return /* @__PURE__ */ E("label", {
753
+ className: `group relative inline-flex items-center gap-spacing-4 ${r ? "cursor-not-allowed" : "cursor-pointer"} ${s}`,
754
+ children: [
755
+ /* @__PURE__ */ T("input", {
756
+ type: "radio",
757
+ className: "peer sr-only",
758
+ checked: f,
759
+ onChange: p,
760
+ disabled: r,
761
+ name: a,
762
+ value: o,
763
+ ...c
764
+ }),
765
+ /* @__PURE__ */ T("span", {
766
+ className: `flex h-spacing-7 w-spacing-7 shrink-0 items-center justify-center rounded-round-00 transition-shadow ${_}`,
767
+ children: /* @__PURE__ */ T("span", { className: `h-spacing-4 w-spacing-4 rounded-round-00 ${v} ${f ? "" : "invisible"}` })
768
+ }),
769
+ i != null && /* @__PURE__ */ T("span", {
770
+ className: `text-14 ${y}`,
771
+ children: i
772
+ })
773
+ ]
774
+ });
775
+ }
776
+ function be({ items: e = [], value: t, defaultValue: n, onChange: r, name: i, direction: a = "vertical", gap: o = "7", disabled: s = !1, className: c = "", ...l }) {
777
+ let d = t !== void 0, [f, p] = m(n), h = t === void 0 ? f : t, g = u(), _ = i ?? `radio-group-${g}`, v = (e) => {
778
+ d || p(e), r?.(e);
779
+ }, y = ve[o] ?? ve[7];
780
+ return /* @__PURE__ */ T("div", {
781
+ role: "radiogroup",
782
+ className: `inline-flex ${a === "horizontal" ? "flex-row items-center" : "flex-col items-start"} ${y} ${c}`,
783
+ ...l,
784
+ children: e.map((e) => /* @__PURE__ */ T(ye, {
785
+ name: i ?? _,
786
+ value: e.value,
787
+ label: e.label,
788
+ checked: h === e.value,
789
+ disabled: s || e.disabled,
790
+ onChange: () => v(e.value)
791
+ }, e.value))
792
+ });
793
+ }
794
+ //#endregion
795
+ //#region src/components/Switch.tsx
796
+ function xe({ checked: e, defaultChecked: t = !1, onChange: n, disabled: r = !1, label: i, className: a = "", ...o }) {
797
+ let s = e !== void 0, [c, l] = m(t), u = s ? e : c, d = (e) => {
798
+ s || l(e.target.checked), n?.(e);
799
+ }, f = "group-hover:ring-2 group-hover:ring-offset-1", p = "peer-focus-visible:ring-2 peer-focus-visible:ring-offset-1", h;
800
+ h = r ? u ? "bg-switch-selected-disabled-bg" : "bg-switch-disabled-bg" : u ? `bg-switch-selected-bg ${f} group-hover:ring-switch-selected-hover-outline ${p} peer-focus-visible:ring-switch-selected-hover-outline` : `bg-switch-unselected-bg ${f} group-hover:ring-switch-hover-outline ${p} peer-focus-visible:ring-switch-hover-outline`;
801
+ let g;
802
+ g = r ? u ? "bg-switch-disabled-thumb" : "bg-switch-disabled-thumb-off" : "bg-switch-thumb shadow";
803
+ let _ = r ? "text-switch-disabled-text" : "text-switch-text";
804
+ return /* @__PURE__ */ E("label", {
805
+ className: `group relative inline-flex items-center gap-spacing-4 ${r ? "cursor-not-allowed" : "cursor-pointer"} ${a}`,
806
+ children: [
807
+ /* @__PURE__ */ T("input", {
808
+ type: "checkbox",
809
+ role: "switch",
810
+ className: "peer sr-only",
811
+ checked: u,
812
+ onChange: d,
813
+ disabled: r,
814
+ ...o
815
+ }),
816
+ /* @__PURE__ */ T("span", {
817
+ className: `relative h-[16px] w-[28px] shrink-0 rounded-round-5 transition-[background-color,box-shadow] ${h}`,
818
+ children: /* @__PURE__ */ T("span", { className: `absolute left-spacing-3 top-1/2 h-[10px] w-[12px] -translate-y-1/2 rounded-round-4 transition-transform ${g} ${u ? "translate-x-spacing-5" : "translate-x-0"}` })
819
+ }),
820
+ i != null && /* @__PURE__ */ T("span", {
821
+ className: `text-14 ${_}`,
822
+ children: i
823
+ })
824
+ ]
825
+ });
826
+ }
827
+ //#endregion
828
+ //#region src/components/List.tsx
829
+ function Se({ title: e = "list", tag: t = !1, tagText: n = "태그", icon: r = null, checkbox: i = !1, radio: a = !1, checked: o = !1, onCheckChange: s, showSwitch: c = !1, switchChecked: l = !1, onSwitchChange: u, rightButton: d = !1, rightButtonIcon: f = v, rightButtonAriaLabel: p = "더보기", endIcon: m = !1, rightSlot: h = null, selected: _ = !1, highlighted: y = !1, disabled: b = !1, onClick: x, onButtonClick: S, className: C = "", ...w }) {
830
+ let D = !b, O = a, k = b ? "bg-list-default-bg cursor-not-allowed" : y && !O ? "bg-list-hover-bg cursor-pointer" : _ || O ? "bg-list-default-bg cursor-pointer" : "bg-list-default-bg cursor-pointer hover:bg-list-hover-bg active:bg-list-pressed-bg", A = b ? "text-list-disabled-text" : _ ? "text-list-selected-text" : "text-list-default-text", j = b ? "text-list-disabled-icon" : "text-list-default-icon", M = b ? "text-list-disabled-icon" : _ ? "text-list-selected-icon" : "text-list-default-icon", N = (e) => e.stopPropagation();
831
+ return /* @__PURE__ */ E("div", {
832
+ role: "option",
833
+ "aria-selected": _ || void 0,
834
+ "aria-disabled": b || void 0,
835
+ onClick: D ? (e) => {
836
+ D && (i ? s?.({ target: { checked: !o } }) : a && !o && s?.({ target: { checked: !0 } }), x?.(e));
837
+ } : void 0,
838
+ className: `flex min-h-[32px] w-full items-center justify-between px-spacing-6 ${O ? "" : "py-spacing-3"} transition-colors ${k} ${C}`,
839
+ ...w,
840
+ children: [/* @__PURE__ */ E("div", {
841
+ className: "flex min-w-0 flex-1 items-center gap-spacing-4",
842
+ children: [
843
+ t && /* @__PURE__ */ T(X, { children: n }),
844
+ i && /* @__PURE__ */ T("span", {
845
+ className: "flex shrink-0 items-center",
846
+ onClick: N,
847
+ children: /* @__PURE__ */ T(G, {
848
+ checked: o,
849
+ onChange: s,
850
+ disabled: b
851
+ })
852
+ }),
853
+ a && !i && /* @__PURE__ */ T("span", {
854
+ className: "flex shrink-0 items-center",
855
+ onClick: N,
856
+ children: /* @__PURE__ */ T(ye, {
857
+ checked: o,
858
+ onChange: s,
859
+ disabled: b
860
+ })
861
+ }),
862
+ r && /* @__PURE__ */ T(r, {
863
+ size: 16,
864
+ strokeWidth: 1.8,
865
+ className: `shrink-0 ${M}`
866
+ }),
867
+ /* @__PURE__ */ T(P, {
868
+ className: `min-w-0 flex-1 text-14 ${A}`,
869
+ children: e
870
+ })
871
+ ]
872
+ }), (h || c || d || m) && /* @__PURE__ */ E("div", {
873
+ className: "flex shrink-0 items-center gap-spacing-2",
874
+ children: [
875
+ h,
876
+ c && /* @__PURE__ */ T("span", {
877
+ className: "flex shrink-0 items-center",
878
+ onClick: N,
879
+ children: /* @__PURE__ */ T(xe, {
880
+ checked: l,
881
+ onChange: u,
882
+ disabled: b
883
+ })
884
+ }),
885
+ d && /* @__PURE__ */ T("button", {
886
+ type: "button",
887
+ disabled: b,
888
+ onClick: (e) => {
889
+ e.stopPropagation(), S?.(e);
890
+ },
891
+ className: "flex min-h-[24px] min-w-[24px] items-center justify-center rounded-round-4 p-spacing-2 opacity-80 transition-colors hover:bg-button-ghost-hover-bg focus:outline-none focus-visible:bg-button-ghost-hover-bg disabled:cursor-not-allowed",
892
+ "aria-label": p,
893
+ children: /* @__PURE__ */ T(f, {
894
+ size: 14,
895
+ strokeWidth: 1.8,
896
+ className: j
897
+ })
898
+ }),
899
+ m && /* @__PURE__ */ T(g, {
900
+ size: 16,
901
+ strokeWidth: 1.8,
902
+ className: M
903
+ })
904
+ ]
905
+ })]
906
+ });
907
+ }
908
+ //#endregion
909
+ //#region src/components/usePopoverPosition.ts
910
+ var Ce = parseInt(t["spacing-3"], 10);
911
+ function we({ open: e, anchorRef: t, menuRef: n, placement: r = "auto", menuWidth: i, deps: a = [] }) {
912
+ let [o, s] = m(null);
913
+ return d(() => {
914
+ if (!e) {
915
+ s(null);
916
+ return;
917
+ }
918
+ let a = () => {
919
+ let e = t.current;
920
+ if (!e) return;
921
+ let a = e.getBoundingClientRect(), o = n.current, c = o?.offsetHeight ?? 0, l = Ce, u = i == null ? a.width : typeof i == "number" ? i : o?.offsetWidth ?? a.width, d = i != null && typeof i != "number" ? i : `${u}px`, f, p;
922
+ if (r === "auto" ? (f = "auto", p = "auto") : [f, p] = r.split("-"), f === "auto") {
923
+ let e = window.innerHeight - a.bottom, t = a.top;
924
+ f = e < c + l && t > e ? "top" : "bottom";
925
+ }
926
+ p === "auto" && (p = a.left + u > window.innerWidth ? "right" : "left");
927
+ let m = f === "top" ? a.top - l - c : a.bottom + l, h = p === "right" ? a.right - u : a.left;
928
+ s((e) => e && e.top === m && e.left === h && e.width === d ? e : {
929
+ position: "fixed",
930
+ top: m,
931
+ left: h,
932
+ width: d
933
+ });
934
+ };
935
+ a();
936
+ let o = 0, c = () => {
937
+ o ||= requestAnimationFrame(() => {
938
+ o = 0, a();
939
+ });
940
+ };
941
+ return window.addEventListener("resize", c), window.addEventListener("scroll", c, !0), () => {
942
+ o && cancelAnimationFrame(o), window.removeEventListener("resize", c), window.removeEventListener("scroll", c, !0);
943
+ };
944
+ }, [
945
+ e,
946
+ r,
947
+ i,
948
+ ...a
949
+ ]), o;
950
+ }
951
+ //#endregion
952
+ //#region src/components/useOutsideDismiss.ts
953
+ function Te({ open: e, refs: t, onDismiss: n, guard: r }) {
954
+ l(() => {
955
+ if (!e) return;
956
+ let i = (e) => {
957
+ if (t.some((t) => t.current && t.current.contains(e.target)) || r && !r(e)) return;
958
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
959
+ let i = (e) => {
960
+ e.stopPropagation(), e.preventDefault();
961
+ };
962
+ document.addEventListener("click", i, {
963
+ capture: !0,
964
+ once: !0
965
+ }), setTimeout(() => document.removeEventListener("click", i, !0), 300);
966
+ let a = document.activeElement;
967
+ a instanceof HTMLElement && t.some((e) => e.current && e.current.contains(a)) && a.blur(), n(e);
968
+ };
969
+ return document.addEventListener("mousedown", i, !0), () => document.removeEventListener("mousedown", i, !0);
970
+ });
971
+ }
972
+ //#endregion
973
+ //#region src/components/popoverLayers.ts
974
+ var Q = [];
975
+ function Ee(e) {
976
+ Q.push(e);
977
+ }
978
+ function De(e) {
979
+ let t = Q.indexOf(e);
980
+ t >= 0 && Q.splice(t, 1);
981
+ }
982
+ function Oe(e) {
983
+ return Q[Q.length - 1] === e;
984
+ }
985
+ function ke() {
986
+ return Q.length > 0;
987
+ }
988
+ //#endregion
989
+ //#region src/components/Select.tsx
990
+ var Ae = "ring-inset ring-text-field-hover-line hover:ring-2 focus-visible:ring-2";
991
+ function je({ className: e = "" }) {
992
+ return /* @__PURE__ */ E("svg", {
993
+ viewBox: "0 0 2 7",
994
+ width: 2,
995
+ height: 7,
996
+ fill: "currentColor",
997
+ "aria-hidden": "true",
998
+ className: `shrink-0 ${e}`,
999
+ children: [/* @__PURE__ */ T("path", { d: "M2 1C2 1.55228 1.55228 2 1 2C0.447715 2 0 1.55228 0 1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1Z" }), /* @__PURE__ */ T("path", { d: "M2 6C2 6.55228 1.55228 7 1 7C0.447715 7 0 6.55228 0 6C0 5.44772 0.447715 5 1 5C1.55228 5 2 5.44772 2 6Z" })]
1000
+ });
1001
+ }
1002
+ function Me({ value: e, defaultValue: t = "", onChange: n, options: r = [], multiple: i = !1, confirm: a = !1, variant: o = "box", size: s = "24", weight: u = "normal", defaultOpen: g = !1, tabOpens: _ = !1, color: v = "gray", label: y = null, placeholder: b = "선택하세요", disabled: x = !1, readOnly: S = !1, error: w = !1, errorMessage: D = "", width: O = 200, maxWidth: k, menuWidth: A, placement: j = "auto", searchable: M = !1, searchPlaceholder: F = "검색어를 입력하세요", emptyMessage: I = "옵션이 없습니다.", noResultMessage: L = "검색 결과가 없습니다.", className: ee = "", ...te }) {
1003
+ let R = n, z = e !== void 0, [B, ne] = m(() => i && !Array.isArray(t) ? [] : t), V = e === void 0 ? B : e, H = f(() => i && Array.isArray(V) ? V : [], [i, V]), [U, W] = m(g), ae = i && a, [oe, se] = m([]), ce = p(null), G = p(!1);
1004
+ l(() => {
1005
+ if (!U || !M) return;
1006
+ let e = setTimeout(() => ce.current?.focus(), 0);
1007
+ return () => clearTimeout(e);
1008
+ }, [U, M]);
1009
+ let [K, q] = m(-1), [ue, de] = m(""), [pe, me] = m(void 0), he = p(null), J = p(null), Y = p(null), X = o === "text", _e = o === "text" && O === "fill", Z = o === "chip", ve = A ?? (X || Z ? 120 : void 0), ye = i ? void 0 : r.find((e) => e.value === V), be = i ? r.filter((e) => H.includes(e.value)).map((e) => e.label) : [], xe = i ? be.length === 0 : !ye, Ce = i ? xe ? b : be.join(", ") : ye ? ye.label : b, Q = !x && !S, ke = O === "hug" ? "fit-content" : typeof O == "number" ? `${O}px` : O, Me = k == null ? void 0 : typeof k == "number" ? `${k}px` : k, $ = M && ue.trim() ? r.filter((e) => String(e.label).toLowerCase().includes(ue.trim().toLowerCase())) : r, Ne = c((e) => {
1010
+ z || ne(e), R?.({ target: { value: e } }), W(!1), J.current?.focus();
1011
+ }, [z, R]), Pe = c((e) => {
1012
+ if (ae) {
1013
+ se((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
1014
+ return;
1015
+ }
1016
+ let t = H.includes(e) ? H.filter((t) => t !== e) : [...H, e];
1017
+ z || ne(t), R?.({ target: { value: t } });
1018
+ }, [
1019
+ ae,
1020
+ z,
1021
+ R,
1022
+ H
1023
+ ]), Fe = c((e) => {
1024
+ z || ne(e), R?.({ target: { value: e } }), W(!1), J.current?.focus();
1025
+ }, [z, R]), Ie = ae ? oe : H, Le = (e) => {
1026
+ if (!e?.disabled) return i ? Pe(e.value) : Ne(e.value);
1027
+ };
1028
+ d(() => {
1029
+ let e = J.current;
1030
+ if (!e || X || Z || O === "hug") {
1031
+ me(void 0);
1032
+ return;
1033
+ }
1034
+ let t = () => {
1035
+ let t = getComputedStyle(e), n = parseFloat(t.paddingLeft) || 0, r = parseFloat(t.paddingRight) || 0, i = parseFloat(t.columnGap) || 0, a = e.clientWidth - n - r;
1036
+ me(Math.max(0, a - 16 - i));
1037
+ };
1038
+ t();
1039
+ let n = new ResizeObserver(t);
1040
+ return n.observe(e), () => n.disconnect();
1041
+ }, [
1042
+ O,
1043
+ X,
1044
+ Z
1045
+ ]), l(() => {
1046
+ if (U) return Ee(Y), () => De(Y);
1047
+ }, [U]), Te({
1048
+ open: U,
1049
+ refs: [he, Y],
1050
+ guard: () => Oe(Y),
1051
+ onDismiss: () => W(!1)
1052
+ }), l(() => {
1053
+ if (!U) return;
1054
+ let e = (e) => {
1055
+ e.key === "Escape" && Oe(Y) && (e.stopPropagation(), W(!1), J.current?.focus());
1056
+ };
1057
+ return document.addEventListener("keydown", e, !0), () => document.removeEventListener("keydown", e, !0);
1058
+ }, [U]), l(() => {
1059
+ if (!U) return;
1060
+ de(""), ae && se(H);
1061
+ let e = r.findIndex((e) => i ? H.includes(e.value) : e.value === V);
1062
+ q(e >= 0 ? e : 0);
1063
+ }, [U]), l(() => {
1064
+ !U || K < 0 || (Y.current?.querySelector(`[data-option-index="${K}"]`))?.scrollIntoView({ block: "nearest" });
1065
+ }, [K, U]);
1066
+ let Re = we({
1067
+ open: U,
1068
+ anchorRef: J,
1069
+ menuRef: Y,
1070
+ placement: j,
1071
+ menuWidth: ve,
1072
+ deps: [$.length, ue]
1073
+ }), ze = (e) => {
1074
+ switch (e.key) {
1075
+ case "Escape":
1076
+ e.preventDefault(), W(!1), J.current?.focus();
1077
+ break;
1078
+ case "ArrowDown":
1079
+ e.preventDefault(), q((e) => Math.min(e + 1, $.length - 1));
1080
+ break;
1081
+ case "ArrowUp":
1082
+ e.preventDefault(), q((e) => Math.max(e - 1, 0));
1083
+ break;
1084
+ case "Enter": {
1085
+ e.preventDefault();
1086
+ let t = $[K];
1087
+ t && Le(t);
1088
+ break;
1089
+ }
1090
+ case "Tab":
1091
+ !e.shiftKey && K < $.length - 1 ? (e.preventDefault(), q((e) => Math.min(e + 1, $.length - 1))) : e.shiftKey && K > 0 ? (e.preventDefault(), q((e) => Math.max(e - 1, 0))) : (W(!1), M && (e.preventDefault(), G.current = !0, J.current?.focus()));
1092
+ break;
1093
+ default: break;
1094
+ }
1095
+ }, Be = (e) => {
1096
+ if (Q) {
1097
+ if (!U) {
1098
+ if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") e.preventDefault(), W(!0);
1099
+ else if (_ && e.key === "Tab" && !e.shiftKey) {
1100
+ if (G.current) {
1101
+ G.current = !1;
1102
+ return;
1103
+ }
1104
+ e.preventDefault(), W(!0);
1105
+ }
1106
+ return;
1107
+ }
1108
+ if (!M) if (e.key === " ") {
1109
+ e.preventDefault();
1110
+ let t = $[K];
1111
+ t && Le(t);
1112
+ } else ze(e);
1113
+ }
1114
+ }, Ve = x ? "text-text-field-disabled-text" : S ? "text-text-field-readonly-text" : xe ? "text-text-field-default-text" : "text-text-field-filled-text", He = x ? "text-text-field-disabled-icon" : "text-text-field-default-text group-focus-within:text-text-field-filled-text";
1115
+ return /* @__PURE__ */ E("div", {
1116
+ ref: he,
1117
+ className: `relative ${_e ? "flex w-full" : X || Z ? "inline-flex max-w-full align-middle" : ""} ${ee}`,
1118
+ style: X || Z ? void 0 : {
1119
+ width: ke,
1120
+ maxWidth: Me
1121
+ },
1122
+ ...te,
1123
+ children: [
1124
+ X ? /* @__PURE__ */ T(ie, {
1125
+ ref: J,
1126
+ role: "combobox",
1127
+ "aria-haspopup": "listbox",
1128
+ "aria-expanded": U,
1129
+ "aria-disabled": x || void 0,
1130
+ "aria-invalid": w || void 0,
1131
+ tabIndex: Q ? 0 : -1,
1132
+ onClick: () => Q && W((e) => !e),
1133
+ onKeyDown: Be,
1134
+ size: s,
1135
+ open: U,
1136
+ disabled: x,
1137
+ readOnly: S,
1138
+ interactive: Q,
1139
+ maxWidth: Me,
1140
+ fill: _e,
1141
+ children: Ce
1142
+ }) : Z ? /* @__PURE__ */ E("div", {
1143
+ ref: J,
1144
+ role: "combobox",
1145
+ "aria-haspopup": "listbox",
1146
+ "aria-expanded": U,
1147
+ "aria-disabled": x || void 0,
1148
+ "aria-invalid": w || void 0,
1149
+ tabIndex: Q ? 0 : -1,
1150
+ onClick: () => Q && W((e) => !e),
1151
+ onKeyDown: Be,
1152
+ style: Me ? { maxWidth: Me } : void 0,
1153
+ className: `inline-flex min-w-0 items-center gap-spacing-3 rounded-round-4 border pl-spacing-4 pr-spacing-3 py-spacing-1 font-pretendard text-12 font-normal transition-colors focus:outline-none ${re[v] ?? re.gray} ${Q ? "cursor-pointer" : "cursor-not-allowed"}`,
1154
+ children: [/* @__PURE__ */ T(P, {
1155
+ className: `min-w-0 text-12 ${u === "semibold" ? "font-semibold" : "font-normal"}`,
1156
+ children: Ce
1157
+ }), /* @__PURE__ */ T(h, {
1158
+ size: 12,
1159
+ strokeWidth: 1.8,
1160
+ className: `pointer-events-none shrink-0 transition-transform ${U ? "rotate-180" : ""}`
1161
+ })]
1162
+ }) : /* @__PURE__ */ E("div", {
1163
+ ref: J,
1164
+ role: "combobox",
1165
+ "aria-haspopup": "listbox",
1166
+ "aria-expanded": U,
1167
+ "aria-disabled": x || void 0,
1168
+ "aria-invalid": w || void 0,
1169
+ tabIndex: Q ? 0 : -1,
1170
+ onClick: () => Q && W((e) => !e),
1171
+ onKeyDown: Be,
1172
+ className: `group relative grid min-h-[32px] grid-cols-[minmax(0,1fr)_auto] items-center gap-spacing-4 rounded-round-4 bg-text-field-default-bg py-spacing-3 pl-spacing-6 pr-spacing-6 transition-shadow focus:outline-none ${Q ? `cursor-pointer ${Ae}` : "cursor-not-allowed"}`,
1173
+ children: [y != null && !xe ? /* @__PURE__ */ E("div", {
1174
+ style: pe == null ? void 0 : { maxWidth: `${pe}px` },
1175
+ className: "flex min-w-0 items-center gap-spacing-3",
1176
+ children: [
1177
+ /* @__PURE__ */ T("span", {
1178
+ className: `shrink-0 text-14 font-normal ${Ve}`,
1179
+ children: y
1180
+ }),
1181
+ /* @__PURE__ */ T(je, { className: "text-font-icon-3" }),
1182
+ /* @__PURE__ */ T(P, {
1183
+ className: `min-w-0 flex-1 text-14 font-normal ${Ve}`,
1184
+ children: Ce
1185
+ })
1186
+ ]
1187
+ }) : /* @__PURE__ */ T(P, {
1188
+ style: pe == null ? void 0 : { maxWidth: `${pe}px` },
1189
+ className: `text-14 font-normal ${Ve}`,
1190
+ children: Ce
1191
+ }), /* @__PURE__ */ T(h, {
1192
+ size: 16,
1193
+ strokeWidth: 1.8,
1194
+ className: `pointer-events-none shrink-0 transition-transform ${He} ${U ? "rotate-180" : ""}`
1195
+ })]
1196
+ }),
1197
+ U && C(/* @__PURE__ */ T("div", {
1198
+ ref: Y,
1199
+ className: "z-[1000]",
1200
+ style: Re ?? {
1201
+ position: "fixed",
1202
+ top: 0,
1203
+ left: 0,
1204
+ visibility: "hidden"
1205
+ },
1206
+ children: /* @__PURE__ */ T(le, {
1207
+ width: "100%",
1208
+ topArea: M ? "search" : "none",
1209
+ searchValue: ue,
1210
+ onSearchChange: (e) => {
1211
+ de(e.target.value), q(0);
1212
+ },
1213
+ searchPlaceholder: F,
1214
+ searchInputProps: M ? {
1215
+ ref: ce,
1216
+ onKeyDown: ze
1217
+ } : {},
1218
+ ...ae ? {
1219
+ footer: !0,
1220
+ footerCheckbox: !0,
1221
+ footerChecked: r.filter((e) => !e.disabled).length > 0 && r.filter((e) => !e.disabled).every((e) => oe.includes(e.value)),
1222
+ onFooterCheckChange: () => se((e) => {
1223
+ let t = r.filter((e) => !e.disabled).map((e) => e.value);
1224
+ return t.every((t) => e.includes(t)) ? [] : t;
1225
+ }),
1226
+ onCancel: () => {
1227
+ W(!1), J.current?.focus();
1228
+ },
1229
+ onConfirm: () => Fe(oe)
1230
+ } : {},
1231
+ children: $.length > 0 ? /* @__PURE__ */ T(ge, { children: $.map((e, t) => i ? /* @__PURE__ */ T(Se, {
1232
+ title: e.label,
1233
+ checkbox: !0,
1234
+ disabled: e.disabled,
1235
+ checked: Ie.includes(e.value),
1236
+ onCheckChange: e.disabled ? void 0 : () => Pe(e.value),
1237
+ highlighted: !e.disabled && t === K,
1238
+ onMouseEnter: () => !e.disabled && q(t),
1239
+ "data-option-index": t
1240
+ }, e.value) : /* @__PURE__ */ T(Se, {
1241
+ title: e.label,
1242
+ disabled: e.disabled,
1243
+ selected: e.value === V,
1244
+ highlighted: !e.disabled && t === K,
1245
+ onClick: e.disabled ? void 0 : () => Ne(e.value),
1246
+ onMouseEnter: () => !e.disabled && q(t),
1247
+ "data-option-index": t
1248
+ }, e.value)) }) : /* @__PURE__ */ T(fe, { message: M && ue.trim() ? L : I })
1249
+ })
1250
+ }), document.body),
1251
+ w && D && !U && /* @__PURE__ */ T("div", {
1252
+ className: "absolute left-0 top-full z-10 mt-spacing-2",
1253
+ children: /* @__PURE__ */ T(N, {
1254
+ variant: "error",
1255
+ beak: "top",
1256
+ children: D
1257
+ })
1258
+ })
1259
+ ]
1260
+ });
1261
+ }
1262
+ function $(e) {
1263
+ return /* @__PURE__ */ T(Me, {
1264
+ variant: "chip",
1265
+ ...e
1266
+ });
1267
+ }
1268
+ //#endregion
1269
+ //#region src/components/ButtonGroup.tsx
1270
+ var Ne = {
1271
+ 3: "gap-spacing-3",
1272
+ 4: "gap-spacing-4",
1273
+ 5: "gap-spacing-5",
1274
+ 6: "gap-spacing-6",
1275
+ 7: "gap-spacing-7"
1276
+ };
1277
+ function Pe(e) {
1278
+ let t = [];
1279
+ return r.forEach(e, (e) => {
1280
+ s(e) && e.type === i ? t.push(...Pe(e.props.children)) : e != null && typeof e != "boolean" && t.push(e);
1281
+ }), t;
1282
+ }
1283
+ var Fe = (e) => s(e) && e.type === Me;
1284
+ function Ie({ children: e, direction: t = "horizontal", gap: n = "5", width: r = "hug", className: i = "", ...o }) {
1285
+ let c = t === "vertical" ? "flex-col" : "flex-row", l = Ne[n] ?? Ne[5], u = r === "fill", d = Pe(e), f = d.filter(Fe), p = d.filter((e) => !Fe(e)), m = (f.length ? [...f, ...p] : d).map((e, t) => {
1286
+ if (!s(e)) return e;
1287
+ let n = u && e.type === I ? { width: e.props.width ?? "fill" } : {};
1288
+ return a(e, {
1289
+ key: e.key ?? `bg-${t}`,
1290
+ ...n
1291
+ });
1292
+ });
1293
+ return /* @__PURE__ */ T("div", {
1294
+ className: `${u ? "flex w-full" : "inline-flex"} ${c} ${l} ${i}`,
1295
+ ...o,
1296
+ children: m
1297
+ });
1298
+ }
1299
+ //#endregion
1300
+ //#region src/components/Popover.tsx
1301
+ function Le({ trigger: e, children: t, placement: n = "auto", menuWidth: r, open: i, onOpenChange: a, disabled: o = !1, className: s = "", ...u }) {
1302
+ let d = i !== void 0, [f, h] = m(!1), g = d ? i : f, _ = p(null), v = p(null), y = c((e) => {
1303
+ d || h(e), a?.(e);
1304
+ }, [d, a]), b = c(() => y(!1), [y]);
1305
+ l(() => {
1306
+ if (g) return Ee(v), () => De(v);
1307
+ }, [g]), Te({
1308
+ open: g,
1309
+ refs: [_, v],
1310
+ guard: () => Oe(v),
1311
+ onDismiss: b
1312
+ }), l(() => {
1313
+ if (!g) return;
1314
+ let e = (e) => {
1315
+ e.key === "Escape" && Oe(v) && (e.stopPropagation(), b());
1316
+ };
1317
+ return document.addEventListener("keydown", e, !0), () => document.removeEventListener("keydown", e, !0);
1318
+ }, [g, b]);
1319
+ let x = we({
1320
+ open: g,
1321
+ anchorRef: _,
1322
+ menuRef: v,
1323
+ placement: n,
1324
+ menuWidth: r
1325
+ });
1326
+ return /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T("span", {
1327
+ ref: _,
1328
+ ...u,
1329
+ className: `inline-flex ${s}`,
1330
+ "aria-haspopup": "menu",
1331
+ "aria-expanded": g,
1332
+ onClick: (e) => {
1333
+ u.onClick?.(e), o || y(!g);
1334
+ },
1335
+ children: e
1336
+ }), g && C(/* @__PURE__ */ T("div", {
1337
+ ref: v,
1338
+ className: "z-[1000]",
1339
+ style: x ?? {
1340
+ position: "fixed",
1341
+ top: 0,
1342
+ left: 0,
1343
+ visibility: "hidden"
1344
+ },
1345
+ children: typeof t == "function" ? t(b) : t
1346
+ }), document.body)] });
1347
+ }
1348
+ //#endregion
1349
+ //#region src/components/FileUploadMenu.tsx
1350
+ function Re({ files: e = [], guide: t, maxCount: n = 5, accept: r, multiple: i = !0, onAdd: a, onDelete: o, findText: s = "파일 찾기", maxText: c, width: l = 420, className: u = "", ...d }) {
1351
+ let f = p(null), m = e.length >= n, h = () => f.current?.click(), g = (e) => {
1352
+ e.target.files?.length && a?.(e.target.files), e.target.value = "";
1353
+ }, _ = (e) => typeof e == "number" ? `${e}MB - ` : e ? `${e} - ` : "";
1354
+ return /* @__PURE__ */ E(le, {
1355
+ width: l,
1356
+ className: u,
1357
+ footer: !0,
1358
+ footerButtonsFill: !0,
1359
+ showCancel: !1,
1360
+ confirmText: m ? c ?? `최대 ${n}개까지 업로드할 수 있습니다` : s,
1361
+ confirmDisabled: m,
1362
+ onConfirm: h,
1363
+ ...d,
1364
+ children: [
1365
+ t != null && /* @__PURE__ */ T("div", {
1366
+ className: "bg-list-group-bg px-spacing-6 py-spacing-5",
1367
+ children: /* @__PURE__ */ T("p", {
1368
+ className: "whitespace-pre-line text-14 text-list-default-text",
1369
+ children: t
1370
+ })
1371
+ }),
1372
+ e.length > 0 && /* @__PURE__ */ T(ge, { children: e.map((e, t) => /* @__PURE__ */ T(Se, {
1373
+ title: `${_(e.size)}${e.name}`,
1374
+ rightButton: !0,
1375
+ rightButtonIcon: x,
1376
+ rightButtonAriaLabel: "삭제",
1377
+ onButtonClick: () => o?.(e, t)
1378
+ }, e.id ?? `${e.name}-${t}`)) }),
1379
+ /* @__PURE__ */ T("input", {
1380
+ ref: f,
1381
+ type: "file",
1382
+ accept: r,
1383
+ multiple: i,
1384
+ hidden: !0,
1385
+ onChange: g
1386
+ })
1387
+ ]
1388
+ });
1389
+ }
1390
+ //#endregion
1391
+ //#region src/components/FileUploadButton.tsx
1392
+ function ze({ files: e = [], triggerText: t = "파일 업로드", countSuffix: n = "개 등록됨", showCount: r = !0, buttonProps: i = {}, placement: a = "bottom-left", menuWidth: o = 420, open: s, onOpenChange: c, disabled: l = !1, className: u = "", ...d }) {
1393
+ let f = e.length, p = r && f > 0 ? `${t} (${f}${n})` : t, { leftIcon: m = S, variant: h = "line", ...g } = i;
1394
+ return /* @__PURE__ */ T(Le, {
1395
+ placement: a,
1396
+ menuWidth: o,
1397
+ open: s,
1398
+ onOpenChange: c,
1399
+ disabled: l,
1400
+ className: u,
1401
+ trigger: /* @__PURE__ */ T(I, {
1402
+ variant: h,
1403
+ leftIcon: m,
1404
+ disabled: l,
1405
+ ...g,
1406
+ children: p
1407
+ }),
1408
+ children: /* @__PURE__ */ T(Re, {
1409
+ files: e,
1410
+ width: "100%",
1411
+ ...d
1412
+ })
1413
+ });
1414
+ }
1415
+ //#endregion
1416
+ //#region src/components/SegmentControl.tsx
1417
+ var Be = {
1418
+ 3: "gap-spacing-3",
1419
+ 4: "gap-spacing-4",
1420
+ 5: "gap-spacing-5",
1421
+ 6: "gap-spacing-6",
1422
+ 7: "gap-spacing-7"
1423
+ };
1424
+ function Ve({ children: e, size: t = "32", selected: n = !1, disabled: r = !1, leftIcon: i = null, rightIcon: a = null, icon: o = null, onClick: s, className: c = "", ...l }) {
1425
+ let u = !!o, d = t === "24" ? 14 : 16, f;
1426
+ f = u ? t === "24" ? "min-h-[24px] min-w-[24px] p-spacing-2" : "min-h-[32px] min-w-[32px] px-spacing-5 py-spacing-3" : t === "24" ? "min-h-[24px] min-w-[24px] px-spacing-5 py-spacing-2 text-12" : "min-h-[32px] min-w-[32px] px-spacing-6 py-spacing-3 text-14";
1427
+ let p;
1428
+ return p = r ? "bg-transparent text-font-icon-2 cursor-not-allowed" : n ? "bg-button-ghost-hover-bg text-font-icon-5 cursor-pointer" : "bg-transparent text-font-icon-3 cursor-pointer hover:bg-button-ghost-hover-bg hover:text-font-icon-5 active:bg-transparent focus-visible:bg-button-ghost-hover-bg focus-visible:text-font-icon-5", /* @__PURE__ */ T("button", {
1429
+ type: "button",
1430
+ role: "tab",
1431
+ "aria-selected": n,
1432
+ className: `inline-flex items-center justify-center relative font-pretendard font-normal whitespace-nowrap rounded-round-4 transition-colors select-none focus:outline-none ${f} ${p} ${c}`,
1433
+ disabled: r,
1434
+ onClick: r ? void 0 : s,
1435
+ ...l,
1436
+ children: /* @__PURE__ */ T("span", {
1437
+ className: "inline-flex items-center gap-spacing-3",
1438
+ children: u ? /* @__PURE__ */ T(o, {
1439
+ size: d,
1440
+ strokeWidth: 1.8
1441
+ }) : /* @__PURE__ */ E(w, { children: [
1442
+ i && /* @__PURE__ */ T(i, {
1443
+ size: d,
1444
+ strokeWidth: 1.8,
1445
+ className: "shrink-0"
1446
+ }),
1447
+ e,
1448
+ a && /* @__PURE__ */ T(a, {
1449
+ size: d,
1450
+ strokeWidth: 1.8,
1451
+ className: "shrink-0"
1452
+ })
1453
+ ] })
1454
+ })
1455
+ });
1456
+ }
1457
+ function He({ items: e = [], value: t, defaultValue: n, onChange: r, size: i = "32", gap: a = "5", disabled: o = !1, className: s = "", ...c }) {
1458
+ let l = t !== void 0, [u, d] = m(n), f = l ? t : u, p = (e) => {
1459
+ l || d(e), r?.(e);
1460
+ };
1461
+ return /* @__PURE__ */ T("div", {
1462
+ role: "tablist",
1463
+ className: `inline-flex items-center ${Be[a] ?? Be[5]} ${s}`,
1464
+ ...c,
1465
+ children: e.map((e) => /* @__PURE__ */ T(Ve, {
1466
+ size: i,
1467
+ selected: f === e.value,
1468
+ disabled: o || e.disabled,
1469
+ leftIcon: e.leftIcon,
1470
+ rightIcon: e.rightIcon,
1471
+ icon: e.icon,
1472
+ "aria-label": e.ariaLabel,
1473
+ onClick: () => p(e.value),
1474
+ children: e.label
1475
+ }, e.value))
1476
+ });
1477
+ }
1478
+ //#endregion
1479
+ //#region src/components/Tabs.tsx
1480
+ function Ue({ children: e, icon: t = null, tag: n = !1, tagText: r = "태그", tagType: i = "blue", selected: a = !1, disabled: o = !1, onClick: s, className: c = "", ...l }) {
1481
+ let u;
1482
+ return u = o ? "text-tab-disabled-text border-transparent cursor-not-allowed" : a ? "text-tab-selected-text border-tab-selected-underline cursor-pointer" : "text-tab-default-text border-transparent cursor-pointer hover:text-tab-hover-text hover:border-tab-hover-underline focus-visible:text-tab-hover-text focus-visible:border-tab-hover-underline", /* @__PURE__ */ E("button", {
1483
+ type: "button",
1484
+ role: "tab",
1485
+ "aria-selected": a,
1486
+ disabled: o,
1487
+ onClick: o ? void 0 : s,
1488
+ className: `relative inline-flex h-[32px] items-center justify-center gap-spacing-4 px-spacing-5 border-b-2 -mb-px font-pretendard text-14 whitespace-nowrap transition-colors select-none focus:outline-none ${u} ${c}`,
1489
+ ...l,
1490
+ children: [
1491
+ t && /* @__PURE__ */ T(t, {
1492
+ size: 16,
1493
+ strokeWidth: 1.8,
1494
+ className: "shrink-0"
1495
+ }),
1496
+ e,
1497
+ n && /* @__PURE__ */ T(X, {
1498
+ color: i,
1499
+ children: r
1500
+ })
1501
+ ]
1502
+ });
1503
+ }
1504
+ function We({ items: e = [], value: t, defaultValue: n, onChange: r, variant: i = "hug", rightSlot: a = null, className: o = "", ...s }) {
1505
+ let c = t !== void 0, [l, u] = m(n), d = c ? t : l ?? e[0]?.value, f = (e) => {
1506
+ c || u(e), r?.(e);
1507
+ }, p = i === "fill", h = e.map((e) => /* @__PURE__ */ T(Ue, {
1508
+ icon: e.icon,
1509
+ tag: e.tag,
1510
+ tagText: e.tagText,
1511
+ tagType: e.tagType,
1512
+ selected: d === e.value,
1513
+ disabled: e.disabled,
1514
+ onClick: () => f(e.value),
1515
+ className: p ? "flex-1 min-w-px" : "",
1516
+ children: e.label
1517
+ }, e.value));
1518
+ return /* @__PURE__ */ E("div", {
1519
+ role: "tablist",
1520
+ className: `flex w-full border-b border-tab-group-underline ${a ? "items-center justify-between" : ""} ${o}`,
1521
+ ...s,
1522
+ children: [/* @__PURE__ */ T("div", {
1523
+ className: `flex items-center gap-spacing-5 ${p ? "w-full" : ""}`,
1524
+ children: h
1525
+ }), a && /* @__PURE__ */ T("div", {
1526
+ className: "flex shrink-0 items-center",
1527
+ children: a
1528
+ })]
1529
+ });
1530
+ }
1531
+ //#endregion
1532
+ export { K as A, A as B, ge as C, q as D, ue as E, te as F, I, F as L, ie as M, re as N, de as O, W as P, P as R, X as S, le as T, Se as _, ze as a, be as b, Ie as c, ke as d, Oe as f, we as g, Te as h, He as i, oe as j, G as k, Me as l, De as m, We as n, Re as o, Ee as p, Ve as r, Le as s, Ue as t, $ as u, xe as v, fe as w, Z as x, ye as y, N as z };
1533
+
1534
+ //# sourceMappingURL=Tabs-C_N6MDdv.js.map