@bestow-ui/react 0.11.0 → 1.0.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/dist/client.js ADDED
@@ -0,0 +1,3112 @@
1
+ "use client";
2
+ import {
3
+ KOREAN_WEEKDAYS,
4
+ addDays,
5
+ addMonths,
6
+ compareDays,
7
+ formatBusinessNumber,
8
+ formatKoreanAmount,
9
+ formatPhoneNumber,
10
+ getCalendarWeeks,
11
+ isSameDay,
12
+ isSameMonth,
13
+ isValidBusinessNumber,
14
+ kakaoPostcodeProvider,
15
+ mergeThemes,
16
+ parseISODate,
17
+ phoneNumberMaxDigits,
18
+ themeClass,
19
+ themeToStyle,
20
+ toISODate
21
+ } from "./chunk-PFEZ3D2H.js";
22
+
23
+ // src/theme/ThemeProvider.tsx
24
+ import { createContext, forwardRef, useContext, useMemo } from "react";
25
+
26
+ // src/utils/cx.ts
27
+ function cx(...classNames) {
28
+ return classNames.filter(Boolean).join(" ");
29
+ }
30
+
31
+ // src/theme/ThemeProvider.css.ts
32
+ var portal = "sfyhlv0";
33
+ var root = "sfyhlv1 sfyhlv0";
34
+
35
+ // src/theme/ThemeProvider.tsx
36
+ import { jsx } from "react/jsx-runtime";
37
+ var ThemeContext = /* @__PURE__ */ createContext({ theme: "light" });
38
+ var ThemeProvider = /* @__PURE__ */ forwardRef(function ThemeProvider2({ theme: themeProp, overrides, className, style, children, ...rest }, ref) {
39
+ const parent = useContext(ThemeContext);
40
+ const theme = themeProp ?? parent.theme;
41
+ const merged = useMemo(() => mergeThemes(parent.overrides, overrides), [parent.overrides, overrides]);
42
+ const value4 = useMemo(
43
+ () => ({ theme, overrides: merged, style: themeToStyle(merged, theme) }),
44
+ [theme, merged]
45
+ );
46
+ return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: value4, children: /* @__PURE__ */ jsx(
47
+ "div",
48
+ {
49
+ ref,
50
+ "data-theme": theme,
51
+ className: cx(themeClass[theme], root, className),
52
+ style: value4.style ? { ...value4.style, ...style } : style,
53
+ ...rest,
54
+ children
55
+ }
56
+ ) });
57
+ });
58
+ function useTheme() {
59
+ return useContext(ThemeContext).theme;
60
+ }
61
+ function usePortalProps() {
62
+ const { theme, style } = useContext(ThemeContext);
63
+ return { className: cx(themeClass[theme], portal), style };
64
+ }
65
+
66
+ // src/i18n/LocaleProvider.tsx
67
+ import { createContext as createContext2, useContext as useContext2, useMemo as useMemo2 } from "react";
68
+ import { jsx as jsx2 } from "react/jsx-runtime";
69
+ var MessagesContext = /* @__PURE__ */ createContext2({});
70
+ function LocaleProvider({ messages, children }) {
71
+ const parent = useContext2(MessagesContext);
72
+ const value4 = useMemo2(() => ({ ...parent, ...messages }), [parent, messages]);
73
+ return /* @__PURE__ */ jsx2(MessagesContext.Provider, { value: value4, children });
74
+ }
75
+ function useMessages() {
76
+ return useContext2(MessagesContext);
77
+ }
78
+
79
+ // src/components/Accordion/Accordion.tsx
80
+ import * as RadixAccordion from "@radix-ui/react-accordion";
81
+ import { ChevronDownIcon } from "@bestow-ui/icons";
82
+ import { forwardRef as forwardRef2 } from "react";
83
+
84
+ // src/components/Accordion/Accordion.css.ts
85
+ var chevron = "v58j0l4";
86
+ var content = "v58j0l5";
87
+ var contentInner = "v58j0l6";
88
+ var header = "v58j0l2";
89
+ var item = "v58j0l1";
90
+ var root2 = "v58j0l0";
91
+ var trigger = "v58j0l3";
92
+
93
+ // src/components/Accordion/Accordion.tsx
94
+ import { jsx as jsx3, jsxs } from "react/jsx-runtime";
95
+ var Accordion = /* @__PURE__ */ forwardRef2(function Accordion2({ className, ...props }, ref) {
96
+ const { collapsible, ...multipleProps } = props;
97
+ const typedProps = props.type === "multiple" ? multipleProps : { ...multipleProps, collapsible };
98
+ const rootProps = "value" in props ? { ...typedProps, value: props.value ?? (props.type === "multiple" ? [] : "") } : typedProps;
99
+ return /* @__PURE__ */ jsx3(RadixAccordion.Root, { ref, className: cx(root2, className), ...rootProps });
100
+ });
101
+ var AccordionItem = /* @__PURE__ */ forwardRef2(function AccordionItem2({ title: title6, headingLevel = 3, className, children, ...rest }, ref) {
102
+ const Heading = `h${headingLevel}`;
103
+ return /* @__PURE__ */ jsxs(RadixAccordion.Item, { ref, className: cx(item, className), ...rest, children: [
104
+ /* @__PURE__ */ jsx3(RadixAccordion.Header, { asChild: true, children: /* @__PURE__ */ jsx3(Heading, { className: header, children: /* @__PURE__ */ jsxs(RadixAccordion.Trigger, { className: trigger, children: [
105
+ title6,
106
+ /* @__PURE__ */ jsx3(ChevronDownIcon, { size: 18, className: chevron })
107
+ ] }) }) }),
108
+ /* @__PURE__ */ jsx3(RadixAccordion.Content, { className: content, children: /* @__PURE__ */ jsx3("div", { className: contentInner, children }) })
109
+ ] });
110
+ });
111
+
112
+ // src/components/AddressInput/AddressInput.tsx
113
+ import { forwardRef as forwardRef7, useEffect, useId as useId2, useRef as useRef2, useState } from "react";
114
+
115
+ // src/components/Button/Button.tsx
116
+ import { forwardRef as forwardRef4 } from "react";
117
+
118
+ // src/components/Spinner/Spinner.tsx
119
+ import { LoaderIcon } from "@bestow-ui/icons";
120
+ import { forwardRef as forwardRef3 } from "react";
121
+
122
+ // src/styles/visuallyHidden.css.ts
123
+ var visuallyHidden = "_1kdtbw10";
124
+
125
+ // src/components/Spinner/Spinner.css.ts
126
+ import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
127
+ var spinner = /* @__PURE__ */ _7a468({ defaultClassName: "_4b5tg40", variantClassNames: { color: { inherit: "_4b5tg41", primary: "_4b5tg42", neutral: "_4b5tg43", danger: "_4b5tg44" }, size: { sm: "_4b5tg45", md: "_4b5tg46", lg: "_4b5tg47" } }, defaultVariants: { color: "inherit", size: "md" }, compoundVariants: [] });
128
+
129
+ // src/components/Spinner/Spinner.tsx
130
+ import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
131
+ var Spinner = /* @__PURE__ */ forwardRef3(function Spinner2({ size, color, label: labelProp, className, ...rest }, ref) {
132
+ const m = useMessages();
133
+ const label6 = labelProp ?? m.loading ?? "\uB85C\uB529 \uC911";
134
+ const a11y = label6 ? { role: "status" } : { "aria-hidden": true };
135
+ return /* @__PURE__ */ jsxs2("span", { ref, className: cx(spinner({ size, color }), className), ...a11y, ...rest, children: [
136
+ /* @__PURE__ */ jsx4(LoaderIcon, { size: "100%" }),
137
+ label6 && /* @__PURE__ */ jsx4("span", { className: visuallyHidden, children: label6 })
138
+ ] });
139
+ });
140
+
141
+ // src/components/Button/Button.css.ts
142
+ import { createRuntimeFn as _7a4682 } from "@vanilla-extract/recipes/createRuntimeFn";
143
+ var button = /* @__PURE__ */ _7a4682({ defaultClassName: "xcekda6", variantClassNames: { variant: { solid: "xcekda7", soft: "xcekda8", outline: "xcekda9", ghost: "xcekdaa" }, color: { primary: "xcekdab", neutral: "xcekdac", danger: "xcekdad" }, size: { sm: "xcekdae", md: "xcekdaf", lg: "xcekdag" }, fullWidth: { true: "xcekdah" } }, defaultVariants: { variant: "solid", color: "primary", size: "md" }, compoundVariants: [] });
144
+ var icon = "xcekdai";
145
+
146
+ // src/components/Button/Button.tsx
147
+ import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
148
+ var Button = /* @__PURE__ */ forwardRef4(function Button2({
149
+ variant,
150
+ color,
151
+ size,
152
+ fullWidth,
153
+ startIcon,
154
+ endIcon,
155
+ loading,
156
+ className,
157
+ type = "button",
158
+ onClick,
159
+ children,
160
+ ...rest
161
+ }, ref) {
162
+ const handleClick = (event) => {
163
+ if (loading) {
164
+ event.preventDefault();
165
+ return;
166
+ }
167
+ onClick?.(event);
168
+ };
169
+ const leading = loading ? /* @__PURE__ */ jsx5(Spinner, { size: "sm", label: "" }) : startIcon;
170
+ return /* @__PURE__ */ jsxs3(
171
+ "button",
172
+ {
173
+ ref,
174
+ type,
175
+ className: cx(button({ variant, color, size, fullWidth }), className),
176
+ "aria-busy": loading || void 0,
177
+ "aria-disabled": loading || void 0,
178
+ onClick: handleClick,
179
+ ...rest,
180
+ children: [
181
+ leading && /* @__PURE__ */ jsx5("span", { className: icon, children: leading }),
182
+ children,
183
+ endIcon && /* @__PURE__ */ jsx5("span", { className: icon, children: endIcon })
184
+ ]
185
+ }
186
+ );
187
+ });
188
+
189
+ // src/components/Input/Input.css.ts
190
+ import { createRuntimeFn as _7a4683 } from "@vanilla-extract/recipes/createRuntimeFn";
191
+ var adornment = "_19p5zvh6";
192
+ var field = "_19p5zvh7";
193
+ var fieldFullWidth = "_19p5zvh8";
194
+ var helperText = /* @__PURE__ */ _7a4683({ defaultClassName: "_19p5zvhb", variantClassNames: { error: { true: "_19p5zvhc" } }, defaultVariants: {}, compoundVariants: [] });
195
+ var input = "_19p5zvh5";
196
+ var label = "_19p5zvh9";
197
+ var requiredMark = "_19p5zvha";
198
+ var root3 = /* @__PURE__ */ _7a4683({ defaultClassName: "_19p5zvh0", variantClassNames: { size: { sm: "_19p5zvh1", md: "_19p5zvh2", lg: "_19p5zvh3" }, fullWidth: { true: "_19p5zvh4" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
199
+
200
+ // src/components/Input/Input.tsx
201
+ import { forwardRef as forwardRef5 } from "react";
202
+ import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
203
+ var Input = /* @__PURE__ */ forwardRef5(function Input2({ size, invalid, fullWidth, startAdornment, endAdornment, rootClassName, className, disabled, ...rest }, ref) {
204
+ return /* @__PURE__ */ jsxs4(
205
+ "div",
206
+ {
207
+ className: cx(root3({ size, fullWidth }), rootClassName),
208
+ "data-invalid": invalid || void 0,
209
+ "data-disabled": disabled || void 0,
210
+ children: [
211
+ startAdornment && /* @__PURE__ */ jsx6("span", { className: adornment, children: startAdornment }),
212
+ /* @__PURE__ */ jsx6(
213
+ "input",
214
+ {
215
+ ref,
216
+ className: cx(input, className),
217
+ disabled,
218
+ "aria-invalid": invalid || void 0,
219
+ ...rest
220
+ }
221
+ ),
222
+ endAdornment && /* @__PURE__ */ jsx6("span", { className: adornment, children: endAdornment })
223
+ ]
224
+ }
225
+ );
226
+ });
227
+
228
+ // src/components/Input/TextField.tsx
229
+ import { forwardRef as forwardRef6, useId } from "react";
230
+ import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
231
+ var TextField = /* @__PURE__ */ forwardRef6(function TextField2({ label: label6, helperText: helperText3, error, required, fullWidth, id, "aria-describedby": ariaDescribedBy, ...rest }, ref) {
232
+ const generatedId = useId();
233
+ const inputId = id ?? generatedId;
234
+ const helperId = helperText3 ? `${inputId}-helper` : void 0;
235
+ return /* @__PURE__ */ jsxs5("div", { className: cx(field, fullWidth && fieldFullWidth), children: [
236
+ label6 && /* @__PURE__ */ jsxs5("label", { htmlFor: inputId, className: label, children: [
237
+ label6,
238
+ required && /* @__PURE__ */ jsx7("span", { className: requiredMark, "aria-hidden": true, children: "*" })
239
+ ] }),
240
+ /* @__PURE__ */ jsx7(
241
+ Input,
242
+ {
243
+ ref,
244
+ id: inputId,
245
+ invalid: error,
246
+ required,
247
+ fullWidth,
248
+ "aria-describedby": cx(helperId, ariaDescribedBy) || void 0,
249
+ ...rest
250
+ }
251
+ ),
252
+ helperText3 && /* @__PURE__ */ jsx7("p", { id: helperId, className: helperText({ error }), children: helperText3 })
253
+ ] });
254
+ });
255
+
256
+ // src/components/Modal/Modal.tsx
257
+ import * as Dialog from "@radix-ui/react-dialog";
258
+ import { XIcon } from "@bestow-ui/icons";
259
+
260
+ // src/utils/useReturnFocus.ts
261
+ import { useRef } from "react";
262
+ function useReturnFocus(hasTrigger, onCloseAutoFocus) {
263
+ const returnTo = useRef(null);
264
+ return {
265
+ onOpenAutoFocus: () => {
266
+ returnTo.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
267
+ },
268
+ onCloseAutoFocus: (event) => {
269
+ onCloseAutoFocus?.(event);
270
+ if (event.defaultPrevented || hasTrigger) return;
271
+ const target = returnTo.current;
272
+ if (target && target.isConnected && target !== document.body) {
273
+ event.preventDefault();
274
+ target.focus();
275
+ }
276
+ }
277
+ };
278
+ }
279
+
280
+ // src/components/Modal/Modal.css.ts
281
+ import { createRuntimeFn as _7a4684 } from "@vanilla-extract/recipes/createRuntimeFn";
282
+ var body = "_1pdsmv0a";
283
+ var closeButton = "_1pdsmv09";
284
+ var content2 = /* @__PURE__ */ _7a4684({ defaultClassName: "_1pdsmv01", variantClassNames: { size: { sm: "_1pdsmv02", md: "_1pdsmv03", lg: "_1pdsmv04" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
285
+ var description = "_1pdsmv08";
286
+ var footer = "_1pdsmv0b";
287
+ var header2 = "_1pdsmv05";
288
+ var headings = "_1pdsmv06";
289
+ var overlay = "_1pdsmv00";
290
+ var title = "_1pdsmv07";
291
+
292
+ // src/components/Modal/Modal.tsx
293
+ import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
294
+ function Modal({
295
+ open,
296
+ defaultOpen,
297
+ onOpenChange,
298
+ trigger: trigger4,
299
+ title: title6,
300
+ description: description6,
301
+ children,
302
+ footer: footer6,
303
+ size,
304
+ hideCloseButton = false,
305
+ closeOnOverlayClick = true,
306
+ className,
307
+ onCloseAutoFocus
308
+ }) {
309
+ const portal2 = usePortalProps();
310
+ const m = useMessages();
311
+ const focus = useReturnFocus(Boolean(trigger4), onCloseAutoFocus);
312
+ return /* @__PURE__ */ jsxs6(Dialog.Root, { open, defaultOpen, onOpenChange, children: [
313
+ trigger4 && /* @__PURE__ */ jsx8(Dialog.Trigger, { asChild: true, children: trigger4 }),
314
+ /* @__PURE__ */ jsxs6(Dialog.Portal, { children: [
315
+ /* @__PURE__ */ jsx8(Dialog.Overlay, { className: cx(portal2.className, overlay), style: portal2.style }),
316
+ /* @__PURE__ */ jsxs6(
317
+ Dialog.Content,
318
+ {
319
+ className: cx(portal2.className, content2({ size }), className),
320
+ style: portal2.style,
321
+ onPointerDownOutside: closeOnOverlayClick ? void 0 : (event) => event.preventDefault(),
322
+ onOpenAutoFocus: focus.onOpenAutoFocus,
323
+ onCloseAutoFocus: focus.onCloseAutoFocus,
324
+ ...description6 ? {} : { "aria-describedby": void 0 },
325
+ children: [
326
+ /* @__PURE__ */ jsxs6("div", { className: header2, children: [
327
+ /* @__PURE__ */ jsxs6("div", { className: headings, children: [
328
+ /* @__PURE__ */ jsx8(Dialog.Title, { className: title, children: title6 }),
329
+ description6 && /* @__PURE__ */ jsx8(Dialog.Description, { className: description, children: description6 })
330
+ ] }),
331
+ !hideCloseButton && /* @__PURE__ */ jsx8(Dialog.Close, { className: closeButton, "aria-label": m.close ?? "\uB2EB\uAE30", children: /* @__PURE__ */ jsx8(XIcon, { size: 16 }) })
332
+ ] }),
333
+ children && /* @__PURE__ */ jsx8("div", { className: body, children }),
334
+ footer6 && /* @__PURE__ */ jsx8("div", { className: footer, children: footer6 })
335
+ ]
336
+ }
337
+ )
338
+ ] })
339
+ ] });
340
+ }
341
+ var ModalClose = Dialog.Close;
342
+
343
+ // src/components/AddressInput/AddressInput.css.ts
344
+ var fieldset = "_16fi7uy0";
345
+ var legend = "_16fi7uy1";
346
+ var row = "_16fi7uy2";
347
+ var searchArea = "_16fi7uy4";
348
+ var searchStatus = "_16fi7uy5";
349
+ var zonecode = "_16fi7uy3";
350
+
351
+ // src/components/AddressInput/AddressInput.tsx
352
+ import { Fragment, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
353
+ var EMPTY = { zonecode: "", address: "", extraAddress: "", detail: "" };
354
+ function SearchArea({
355
+ provider,
356
+ onSelect,
357
+ loadErrorText,
358
+ loadingText
359
+ }) {
360
+ const containerRef = useRef2(null);
361
+ const [status, setStatus] = useState("loading");
362
+ const onSelectRef = useRef2(onSelect);
363
+ useEffect(() => {
364
+ onSelectRef.current = onSelect;
365
+ });
366
+ useEffect(() => {
367
+ const container2 = containerRef.current;
368
+ if (!container2) return;
369
+ let cleanup;
370
+ let cancelled = false;
371
+ Promise.resolve().then(() => provider(container2, (result) => onSelectRef.current(result))).then((fn) => {
372
+ if (cancelled) fn?.();
373
+ else {
374
+ cleanup = fn;
375
+ setStatus("ready");
376
+ }
377
+ }).catch(() => !cancelled && setStatus("error"));
378
+ return () => {
379
+ cancelled = true;
380
+ cleanup?.();
381
+ };
382
+ }, [provider]);
383
+ return /* @__PURE__ */ jsxs7("div", { className: searchArea, children: [
384
+ /* @__PURE__ */ jsx9("div", { ref: containerRef, style: { width: "100%", height: "100%" } }),
385
+ status !== "ready" && /* @__PURE__ */ jsx9("div", { className: searchStatus, role: "status", children: status === "loading" ? /* @__PURE__ */ jsx9(Spinner, { label: loadingText }) : loadErrorText })
386
+ ] });
387
+ }
388
+ var AddressInput = /* @__PURE__ */ forwardRef7(
389
+ function AddressInput2(props, ref) {
390
+ const {
391
+ value: value4,
392
+ defaultValue,
393
+ onValueChange,
394
+ label: labelProp,
395
+ required,
396
+ helperText: helperText3,
397
+ error,
398
+ disabled,
399
+ provider = kakaoPostcodeProvider,
400
+ searchLabel: searchLabelProp,
401
+ detailPlaceholder: detailPlaceholderProp,
402
+ loadErrorText: loadErrorTextProp,
403
+ name,
404
+ className
405
+ } = props;
406
+ const m = useMessages();
407
+ const label6 = labelProp ?? m.address ?? "\uC8FC\uC18C";
408
+ const searchLabel = searchLabelProp ?? m.addressSearch ?? "\uC8FC\uC18C \uAC80\uC0C9";
409
+ const detailPlaceholder = detailPlaceholderProp ?? m.detailAddressPlaceholder ?? "\uC0C1\uC138 \uC8FC\uC18C (\uB3D9\xB7\uD638\uC218 \uB4F1)";
410
+ const loadErrorText = loadErrorTextProp ?? m.addressLoadError ?? "\uC8FC\uC18C \uAC80\uC0C9\uC744 \uBD88\uB7EC\uC624\uC9C0 \uBABB\uD588\uC5B4\uC694. \uC7A0\uC2DC \uB4A4 \uB2E4\uC2DC \uC2DC\uB3C4\uD574 \uC8FC\uC138\uC694.";
411
+ const baseId = useId2();
412
+ const helperId = helperText3 ? `${baseId}-helper` : void 0;
413
+ const detailRef = useRef2(null);
414
+ const selectedRef = useRef2(false);
415
+ const [open, setOpen] = useState(false);
416
+ const isControlled = "value" in props;
417
+ const [innerValue, setInnerValue] = useState(defaultValue ?? EMPTY);
418
+ const current2 = isControlled ? value4 ?? EMPTY : innerValue;
419
+ const update = (next) => {
420
+ if (!isControlled) setInnerValue(next);
421
+ onValueChange?.(next);
422
+ };
423
+ const openSearch = () => {
424
+ if (disabled) return;
425
+ selectedRef.current = false;
426
+ setOpen(true);
427
+ };
428
+ const handleSelect = (result) => {
429
+ selectedRef.current = true;
430
+ update({
431
+ ...current2,
432
+ zonecode: result.zonecode,
433
+ address: result.address,
434
+ extraAddress: result.extraAddress ?? ""
435
+ });
436
+ setOpen(false);
437
+ };
438
+ const fullAddress = `${current2.address}${current2.extraAddress ?? ""}`;
439
+ return /* @__PURE__ */ jsxs7("fieldset", { ref, className: cx(fieldset, className), disabled, "aria-describedby": helperId, children: [
440
+ /* @__PURE__ */ jsxs7("legend", { className: legend, children: [
441
+ label6,
442
+ required && /* @__PURE__ */ jsx9("span", { className: requiredMark, "aria-hidden": true, children: "*" })
443
+ ] }),
444
+ /* @__PURE__ */ jsxs7("div", { className: row, children: [
445
+ /* @__PURE__ */ jsx9(
446
+ TextField,
447
+ {
448
+ "aria-label": m.postalCode ?? "\uC6B0\uD3B8\uBC88\uD638",
449
+ readOnly: true,
450
+ value: current2.zonecode,
451
+ placeholder: m.postalCode ?? "\uC6B0\uD3B8\uBC88\uD638",
452
+ error: error && !current2.zonecode,
453
+ "aria-required": required || void 0,
454
+ rootClassName: zonecode,
455
+ onClick: openSearch
456
+ }
457
+ ),
458
+ /* @__PURE__ */ jsx9(Button, { variant: "outline", color: "neutral", onClick: openSearch, disabled, children: searchLabel })
459
+ ] }),
460
+ /* @__PURE__ */ jsx9(
461
+ TextField,
462
+ {
463
+ "aria-label": m.baseAddress ?? "\uAE30\uBCF8 \uC8FC\uC18C",
464
+ readOnly: true,
465
+ value: fullAddress,
466
+ placeholder: m.baseAddressPlaceholder ?? `${searchLabel}\uC744 \uB20C\uB7EC \uC8FC\uC18C\uB97C \uACE0\uB974\uC138\uC694`,
467
+ error: error && !current2.address,
468
+ "aria-required": required || void 0,
469
+ fullWidth: true,
470
+ onClick: openSearch
471
+ }
472
+ ),
473
+ /* @__PURE__ */ jsx9(
474
+ TextField,
475
+ {
476
+ ref: detailRef,
477
+ "aria-label": m.detailAddress ?? "\uC0C1\uC138 \uC8FC\uC18C",
478
+ value: current2.detail,
479
+ placeholder: detailPlaceholder,
480
+ onChange: (event) => update({ ...current2, detail: event.target.value }),
481
+ autoComplete: "address-line2",
482
+ fullWidth: true
483
+ }
484
+ ),
485
+ helperText3 && /* @__PURE__ */ jsx9("p", { id: helperId, className: helperText({ error }), children: helperText3 }),
486
+ name && /* @__PURE__ */ jsxs7(Fragment, { children: [
487
+ /* @__PURE__ */ jsx9("input", { type: "hidden", name: `${name}[zonecode]`, value: current2.zonecode }),
488
+ /* @__PURE__ */ jsx9("input", { type: "hidden", name: `${name}[address]`, value: fullAddress }),
489
+ /* @__PURE__ */ jsx9("input", { type: "hidden", name: `${name}[detail]`, value: current2.detail })
490
+ ] }),
491
+ /* @__PURE__ */ jsx9(
492
+ Modal,
493
+ {
494
+ open,
495
+ onOpenChange: setOpen,
496
+ title: searchLabel,
497
+ description: m.addressSearchDescription ?? "\uB3C4\uB85C\uBA85, \uAC74\uBB3C\uBA85, \uC9C0\uBC88\uC73C\uB85C \uAC80\uC0C9\uD560 \uC218 \uC788\uC5B4\uC694.",
498
+ onCloseAutoFocus: (event) => {
499
+ if (selectedRef.current) {
500
+ event.preventDefault();
501
+ detailRef.current?.focus();
502
+ }
503
+ },
504
+ children: /* @__PURE__ */ jsx9(
505
+ SearchArea,
506
+ {
507
+ provider,
508
+ onSelect: handleSelect,
509
+ loadErrorText,
510
+ loadingText: m.addressLoading ?? "\uC8FC\uC18C \uAC80\uC0C9\uC744 \uBD88\uB7EC\uC624\uB294 \uC911"
511
+ }
512
+ )
513
+ }
514
+ )
515
+ ] });
516
+ }
517
+ );
518
+
519
+ // src/components/AgreementGroup/AgreementGroup.tsx
520
+ import { forwardRef as forwardRef9, useId as useId3, useState as useState2 } from "react";
521
+ import { ChevronDownIcon as ChevronDownIcon2 } from "@bestow-ui/icons";
522
+
523
+ // src/components/Checkbox/Checkbox.tsx
524
+ import { forwardRef as forwardRef8, useEffect as useEffect2, useRef as useRef3 } from "react";
525
+
526
+ // src/utils/mergeRefs.ts
527
+ function mergeRefs(...refs) {
528
+ return (value4) => {
529
+ for (const ref of refs) {
530
+ if (typeof ref === "function") ref(value4);
531
+ else if (ref) ref.current = value4;
532
+ }
533
+ };
534
+ }
535
+
536
+ // src/components/Checkbox/Checkbox.css.ts
537
+ import { createRuntimeFn as _7a4685 } from "@vanilla-extract/recipes/createRuntimeFn";
538
+ var checkIcon = "_1y7mzsn8 _1y7mzsn7";
539
+ var control = /* @__PURE__ */ _7a4685({ defaultClassName: "_1y7mzsn3", variantClassNames: { size: { sm: "_1y7mzsn4", md: "_1y7mzsn5" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
540
+ var indeterminateIcon = "_1y7mzsn9 _1y7mzsn7";
541
+ var input2 = "_1y7mzsn6";
542
+ var root4 = /* @__PURE__ */ _7a4685({ defaultClassName: "_1y7mzsn0", variantClassNames: { size: { sm: "_1y7mzsn1", md: "_1y7mzsn2" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
543
+
544
+ // src/components/Checkbox/Checkbox.tsx
545
+ import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
546
+ var Checkbox = /* @__PURE__ */ forwardRef8(function Checkbox2({ label: label6, size, indeterminate = false, invalid, disabled, onChange, onCheckedChange, className, ...rest }, ref) {
547
+ const innerRef = useRef3(null);
548
+ useEffect2(() => {
549
+ if (innerRef.current) innerRef.current.indeterminate = indeterminate;
550
+ }, [indeterminate]);
551
+ return /* @__PURE__ */ jsxs8("label", { className: cx(root4({ size }), className), "data-disabled": disabled || void 0, children: [
552
+ /* @__PURE__ */ jsxs8("span", { className: control({ size }), children: [
553
+ /* @__PURE__ */ jsx10(
554
+ "input",
555
+ {
556
+ ref: mergeRefs(innerRef, ref),
557
+ type: "checkbox",
558
+ className: input2,
559
+ disabled,
560
+ "aria-invalid": invalid || void 0,
561
+ onChange: (event) => {
562
+ onChange?.(event);
563
+ onCheckedChange?.(event.target.checked);
564
+ },
565
+ ...rest
566
+ }
567
+ ),
568
+ /* @__PURE__ */ jsx10("svg", { className: checkIcon, viewBox: "0 0 20 20", fill: "none", "aria-hidden": true, children: /* @__PURE__ */ jsx10(
569
+ "path",
570
+ {
571
+ d: "M5 10.5l3.2 3L15 7",
572
+ stroke: "currentColor",
573
+ strokeWidth: "2",
574
+ strokeLinecap: "round",
575
+ strokeLinejoin: "round"
576
+ }
577
+ ) }),
578
+ /* @__PURE__ */ jsx10("svg", { className: indeterminateIcon, viewBox: "0 0 20 20", fill: "none", "aria-hidden": true, children: /* @__PURE__ */ jsx10("path", { d: "M6 10h8", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) })
579
+ ] }),
580
+ label6
581
+ ] });
582
+ });
583
+
584
+ // src/components/AgreementGroup/AgreementGroup.css.ts
585
+ var all = "j3uxdc3";
586
+ var box = "j3uxdc2";
587
+ var chevron2 = "j3uxdc9";
588
+ var content3 = "j3uxdca";
589
+ var fieldset2 = "j3uxdc0";
590
+ var item2 = "j3uxdc5";
591
+ var legend2 = "j3uxdc1";
592
+ var list = "j3uxdc4";
593
+ var row2 = "j3uxdc6";
594
+ var tag = "j3uxdc7";
595
+ var toggle = "j3uxdc8";
596
+
597
+ // src/components/AgreementGroup/AgreementGroup.tsx
598
+ import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
599
+ var AgreementGroup = /* @__PURE__ */ forwardRef9(
600
+ function AgreementGroup2(props, ref) {
601
+ const {
602
+ items: items2,
603
+ value: value4,
604
+ defaultValue,
605
+ onValueChange,
606
+ label: label6,
607
+ allLabel: allLabelProp,
608
+ helperText: helperText3,
609
+ error,
610
+ disabled,
611
+ requiredText: requiredTextProp,
612
+ optionalText: optionalTextProp,
613
+ showText: showTextProp,
614
+ hideText: hideTextProp,
615
+ name,
616
+ className
617
+ } = props;
618
+ const m = useMessages();
619
+ const allLabel = allLabelProp ?? m.agreeAll ?? "\uC804\uCCB4 \uB3D9\uC758";
620
+ const requiredText = requiredTextProp ?? m.required ?? "\uD544\uC218";
621
+ const optionalText = optionalTextProp ?? m.optional ?? "\uC120\uD0DD";
622
+ const showText = showTextProp ?? m.show ?? "\uBCF4\uAE30";
623
+ const hideText = hideTextProp ?? m.hide ?? "\uC811\uAE30";
624
+ const baseId = useId3();
625
+ const helperId = helperText3 ? `${baseId}-helper` : void 0;
626
+ const isControlled = "value" in props;
627
+ const [innerValue, setInnerValue] = useState2(defaultValue ?? []);
628
+ const agreed = isControlled ? value4 ?? [] : innerValue;
629
+ const [expanded, setExpanded] = useState2([]);
630
+ const update = (next) => {
631
+ if (!isControlled) setInnerValue(next);
632
+ onValueChange?.(next);
633
+ };
634
+ const allValues = items2.map((item7) => item7.value);
635
+ const agreedCount = allValues.filter((v) => agreed.includes(v)).length;
636
+ const allChecked = items2.length > 0 && agreedCount === items2.length;
637
+ const toggleItem = (itemValue, checked) => update(checked ? [...agreed.filter((v) => v !== itemValue), itemValue] : agreed.filter((v) => v !== itemValue));
638
+ return /* @__PURE__ */ jsxs9(
639
+ "fieldset",
640
+ {
641
+ ref,
642
+ className: cx(fieldset2, className),
643
+ disabled,
644
+ "aria-describedby": helperId,
645
+ "data-invalid": error || void 0,
646
+ children: [
647
+ label6 && /* @__PURE__ */ jsx11("legend", { className: legend2, children: label6 }),
648
+ /* @__PURE__ */ jsxs9("div", { className: box, children: [
649
+ /* @__PURE__ */ jsx11("div", { className: all, children: /* @__PURE__ */ jsx11(
650
+ Checkbox,
651
+ {
652
+ label: allLabel,
653
+ checked: allChecked,
654
+ indeterminate: agreedCount > 0 && !allChecked,
655
+ onChange: (event) => update(event.target.checked ? allValues : [])
656
+ }
657
+ ) }),
658
+ /* @__PURE__ */ jsx11("ul", { className: list, children: items2.map((item7) => {
659
+ const labelId = `${baseId}-${item7.value}-label`;
660
+ const toggleTextId = `${baseId}-${item7.value}-toggle`;
661
+ const contentId = `${baseId}-${item7.value}-content`;
662
+ const isOpen = expanded.includes(item7.value);
663
+ return /* @__PURE__ */ jsxs9("li", { className: item2, children: [
664
+ /* @__PURE__ */ jsxs9("div", { className: row2, children: [
665
+ /* @__PURE__ */ jsx11(
666
+ Checkbox,
667
+ {
668
+ size: "sm",
669
+ checked: agreed.includes(item7.value),
670
+ invalid: error && item7.required && !agreed.includes(item7.value),
671
+ onChange: (event) => toggleItem(item7.value, event.target.checked),
672
+ label: /* @__PURE__ */ jsxs9("span", { id: labelId, children: [
673
+ /* @__PURE__ */ jsx11("span", { className: tag, "data-required": item7.required || void 0, children: item7.required ? requiredText : optionalText }),
674
+ " ",
675
+ item7.label
676
+ ] })
677
+ }
678
+ ),
679
+ item7.content && /* @__PURE__ */ jsxs9(
680
+ "button",
681
+ {
682
+ type: "button",
683
+ className: toggle,
684
+ "aria-expanded": isOpen,
685
+ "aria-controls": contentId,
686
+ "aria-labelledby": `${labelId} ${toggleTextId}`,
687
+ onClick: () => setExpanded((prev) => isOpen ? prev.filter((v) => v !== item7.value) : [...prev, item7.value]),
688
+ children: [
689
+ /* @__PURE__ */ jsx11("span", { id: toggleTextId, children: isOpen ? hideText : showText }),
690
+ /* @__PURE__ */ jsx11(ChevronDownIcon2, { size: 14, className: chevron2 })
691
+ ]
692
+ }
693
+ )
694
+ ] }),
695
+ item7.content && isOpen && // 내용이 길면 스크롤된다 — 키보드로도 스크롤할 수 있게 포커스를 받는 이름 있는 영역으로 둔다
696
+ // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
697
+ /* @__PURE__ */ jsx11("div", { id: contentId, role: "region", "aria-labelledby": labelId, tabIndex: 0, className: content3, children: item7.content })
698
+ ] }, item7.value);
699
+ }) })
700
+ ] }),
701
+ name && agreed.map((v) => /* @__PURE__ */ jsx11("input", { type: "hidden", name, value: v }, v)),
702
+ helperText3 && /* @__PURE__ */ jsx11("p", { id: helperId, className: helperText({ error }), children: helperText3 })
703
+ ]
704
+ }
705
+ );
706
+ }
707
+ );
708
+
709
+ // src/components/Alert/Alert.tsx
710
+ import { forwardRef as forwardRef10 } from "react";
711
+ import { CircleAlertIcon, CircleCheckIcon, InfoIcon, TriangleAlertIcon, XIcon as XIcon2 } from "@bestow-ui/icons";
712
+
713
+ // src/components/Alert/Alert.css.ts
714
+ import { createRuntimeFn as _7a4686 } from "@vanilla-extract/recipes/createRuntimeFn";
715
+ var action = "bsmpc0j";
716
+ var alert = /* @__PURE__ */ _7a4686({ defaultClassName: "bsmpc06", variantClassNames: { variant: { soft: "bsmpc07", outline: "bsmpc08", solid: "bsmpc09" }, color: { primary: "bsmpc0a", neutral: "bsmpc0b", danger: "bsmpc0c", success: "bsmpc0d", warning: "bsmpc0e" } }, defaultVariants: { variant: "soft", color: "primary" }, compoundVariants: [] });
717
+ var closeButton2 = "bsmpc0k";
718
+ var content4 = "bsmpc0g";
719
+ var description2 = "bsmpc0i";
720
+ var icon2 = "bsmpc0f";
721
+ var title2 = "bsmpc0h";
722
+
723
+ // src/components/Alert/Alert.tsx
724
+ import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
725
+ var defaultIcons = {
726
+ primary: InfoIcon,
727
+ neutral: InfoIcon,
728
+ success: CircleCheckIcon,
729
+ warning: TriangleAlertIcon,
730
+ danger: CircleAlertIcon
731
+ };
732
+ var Alert = /* @__PURE__ */ forwardRef10(function Alert2({
733
+ variant,
734
+ color = "primary",
735
+ title: title6,
736
+ icon: icon6,
737
+ action: action3,
738
+ onClose,
739
+ closeLabel: closeLabelProp,
740
+ className,
741
+ children,
742
+ ...rest
743
+ }, ref) {
744
+ const m = useMessages();
745
+ const closeLabel = closeLabelProp ?? m.close ?? "\uB2EB\uAE30";
746
+ const DefaultIcon = defaultIcons[color];
747
+ const iconNode = icon6 === void 0 ? /* @__PURE__ */ jsx12(DefaultIcon, { size: 18 }) : icon6;
748
+ return /* @__PURE__ */ jsxs10("div", { ref, className: cx(alert({ variant, color }), className), ...rest, children: [
749
+ iconNode !== false && iconNode !== null && /* @__PURE__ */ jsx12("span", { className: icon2, "aria-hidden": true, children: iconNode }),
750
+ /* @__PURE__ */ jsxs10("div", { className: content4, children: [
751
+ title6 && /* @__PURE__ */ jsx12("div", { className: title2, children: title6 }),
752
+ children && /* @__PURE__ */ jsx12("div", { className: description2, children })
753
+ ] }),
754
+ action3 && /* @__PURE__ */ jsx12("div", { className: action, children: action3 }),
755
+ onClose && /* @__PURE__ */ jsx12("button", { type: "button", className: closeButton2, "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ jsx12(XIcon2, { size: 16 }) })
756
+ ] });
757
+ });
758
+
759
+ // src/components/AmountInput/AmountInput.tsx
760
+ import { forwardRef as forwardRef11, useRef as useRef5 } from "react";
761
+
762
+ // src/utils/useFormattedInput.ts
763
+ import { useRef as useRef4, useState as useState3 } from "react";
764
+
765
+ // src/utils/useIsomorphicLayoutEffect.ts
766
+ import { useEffect as useEffect3, useLayoutEffect } from "react";
767
+ var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect3;
768
+
769
+ // src/utils/useFormattedInput.ts
770
+ function caretAfter(display, count2, isMeaningful) {
771
+ if (count2 <= 0) return 0;
772
+ let seen = 0;
773
+ for (let i = 0; i < display.length; i++) {
774
+ if (isMeaningful(display[i])) seen++;
775
+ if (seen === count2) return i + 1;
776
+ }
777
+ return display.length;
778
+ }
779
+ function useFormattedInput({
780
+ isControlled,
781
+ value: value4,
782
+ defaultValue,
783
+ onValueChange,
784
+ sanitize: sanitize4,
785
+ format: format2,
786
+ isMeaningful,
787
+ inputRef
788
+ }) {
789
+ const [innerValue, setInnerValue] = useState3(() => sanitize4(defaultValue ?? ""));
790
+ const raw = isControlled ? sanitize4(value4 ?? "") : innerValue;
791
+ const display = format2(raw);
792
+ const pendingCaret = useRef4(null);
793
+ useIsomorphicLayoutEffect(() => {
794
+ const input5 = inputRef.current;
795
+ if (pendingCaret.current === null || !input5 || document.activeElement !== input5) return;
796
+ const position = caretAfter(input5.value, pendingCaret.current, isMeaningful);
797
+ input5.setSelectionRange(position, position);
798
+ pendingCaret.current = null;
799
+ });
800
+ const commit = (next, caretCount) => {
801
+ pendingCaret.current = caretCount;
802
+ if (!isControlled) setInnerValue(next);
803
+ if (next !== raw) onValueChange?.(next);
804
+ };
805
+ const onChange = (event) => {
806
+ const { value: typed, selectionStart } = event.target;
807
+ const next = sanitize4(typed);
808
+ const before = sanitize4(typed.slice(0, selectionStart ?? typed.length));
809
+ commit(next, Math.min(before.length, next.length));
810
+ };
811
+ const onKeyDown = (event) => {
812
+ const input5 = event.currentTarget;
813
+ const { selectionStart: start, selectionEnd: end } = input5;
814
+ if (start === null || start !== end) return;
815
+ const countBefore = (text2) => [...text2].filter(isMeaningful).length;
816
+ if (event.key === "Backspace" && start > 0 && !isMeaningful(input5.value[start - 1])) {
817
+ const index = countBefore(input5.value.slice(0, start)) - 1;
818
+ if (index < 0) return;
819
+ event.preventDefault();
820
+ commit(raw.slice(0, index) + raw.slice(index + 1), index);
821
+ } else if (event.key === "Delete" && start < input5.value.length && !isMeaningful(input5.value[start])) {
822
+ const index = countBefore(input5.value.slice(0, start));
823
+ if (index >= raw.length) return;
824
+ event.preventDefault();
825
+ commit(raw.slice(0, index) + raw.slice(index + 1), index);
826
+ }
827
+ };
828
+ const setRaw = (next) => setInnerValue(sanitize4(next));
829
+ return { raw, display, onChange, onKeyDown, setRaw };
830
+ }
831
+
832
+ // src/components/AmountInput/AmountInput.css.ts
833
+ var input3 = "_70qkav0";
834
+
835
+ // src/components/AmountInput/AmountInput.tsx
836
+ import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
837
+ var MAX_DIGITS = 15;
838
+ var isDigit = (char) => /\d/.test(char);
839
+ var AmountInput = /* @__PURE__ */ forwardRef11(
840
+ function AmountInput2(props, ref) {
841
+ const {
842
+ value: value4,
843
+ defaultValue,
844
+ onValueChange,
845
+ max,
846
+ unit: unitProp,
847
+ showKoreanAmount = true,
848
+ label: labelProp,
849
+ placeholder = "0",
850
+ helperText: helperText3,
851
+ onKeyDown,
852
+ className,
853
+ ...rest
854
+ } = props;
855
+ const inputRef = useRef5(null);
856
+ const m = useMessages();
857
+ const unit = unitProp ?? m.currencyUnit ?? "\uC6D0";
858
+ const label6 = labelProp ?? m.amount ?? "\uAE08\uC561";
859
+ const sanitize4 = (input5) => {
860
+ let digits = input5.replace(/\D/g, "").replace(/^0+(?=\d)/, "").slice(0, MAX_DIGITS);
861
+ if (max !== void 0 && digits && Number(digits) > max) digits = String(Math.floor(max));
862
+ return digits;
863
+ };
864
+ const toRaw = (amount) => amount === null || amount === void 0 ? "" : String(Math.floor(Math.abs(amount)));
865
+ const field3 = useFormattedInput({
866
+ isControlled: "value" in props,
867
+ value: toRaw(value4),
868
+ defaultValue: toRaw(defaultValue),
869
+ onValueChange: (digits) => onValueChange?.(digits === "" ? null : Number(digits)),
870
+ sanitize: sanitize4,
871
+ format: (digits) => digits === "" ? "" : Number(digits).toLocaleString("ko-KR"),
872
+ isMeaningful: isDigit,
873
+ inputRef
874
+ });
875
+ const reading = showKoreanAmount && field3.raw !== "" ? formatKoreanAmount(Number(field3.raw), unit) : null;
876
+ return /* @__PURE__ */ jsx13(
877
+ TextField,
878
+ {
879
+ ref: mergeRefs(ref, inputRef),
880
+ label: label6,
881
+ placeholder,
882
+ inputMode: "numeric",
883
+ value: field3.display,
884
+ onChange: field3.onChange,
885
+ onKeyDown: (event) => {
886
+ field3.onKeyDown(event);
887
+ onKeyDown?.(event);
888
+ },
889
+ endAdornment: unit,
890
+ helperText: reading && helperText3 ? /* @__PURE__ */ jsxs11(Fragment2, { children: [
891
+ reading,
892
+ /* @__PURE__ */ jsx13("br", {}),
893
+ helperText3
894
+ ] }) : reading ?? helperText3,
895
+ className: cx(input3, className),
896
+ ...rest
897
+ }
898
+ );
899
+ }
900
+ );
901
+
902
+ // src/components/Avatar/Avatar.tsx
903
+ import * as RadixAvatar from "@radix-ui/react-avatar";
904
+ import { UserIcon } from "@bestow-ui/icons";
905
+ import { forwardRef as forwardRef12 } from "react";
906
+
907
+ // src/components/Avatar/Avatar.css.ts
908
+ import { createRuntimeFn as _7a4687 } from "@vanilla-extract/recipes/createRuntimeFn";
909
+ var fallback = "_1fd2kp27";
910
+ var image = "_1fd2kp26";
911
+ var root5 = /* @__PURE__ */ _7a4687({ defaultClassName: "_1fd2kp20", variantClassNames: { size: { sm: "_1fd2kp21", md: "_1fd2kp22", lg: "_1fd2kp23" }, shape: { circle: "_1fd2kp24", square: "_1fd2kp25" } }, defaultVariants: { size: "md", shape: "circle" }, compoundVariants: [] });
912
+
913
+ // src/components/Avatar/Avatar.tsx
914
+ import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
915
+ function getInitials(name) {
916
+ const [a = "", b = ""] = name.trim().split(/\s+/);
917
+ const first = (word) => Array.from(word)[0] ?? "";
918
+ return (first(a) + first(b)).toUpperCase();
919
+ }
920
+ var Avatar = /* @__PURE__ */ forwardRef12(function Avatar2({ src, alt, name, fallback: fallback2, size, shape, className, ...rest }, ref) {
921
+ const label6 = alt ?? name;
922
+ const a11y = label6 ? { role: "img", "aria-label": label6 } : { "aria-hidden": true };
923
+ const initials = name ? getInitials(name) : "";
924
+ return /* @__PURE__ */ jsxs12(RadixAvatar.Root, { ref, className: cx(root5({ size, shape }), className), ...a11y, ...rest, children: [
925
+ src && /* @__PURE__ */ jsx14(RadixAvatar.Image, { src, alt: "", className: image }),
926
+ /* @__PURE__ */ jsx14(RadixAvatar.Fallback, { className: fallback, children: fallback2 ?? (initials || /* @__PURE__ */ jsx14(UserIcon, { size: "60%" })) })
927
+ ] });
928
+ });
929
+
930
+ // src/components/Badge/Badge.tsx
931
+ import { forwardRef as forwardRef13 } from "react";
932
+
933
+ // src/components/Badge/Badge.css.ts
934
+ import { createRuntimeFn as _7a4688 } from "@vanilla-extract/recipes/createRuntimeFn";
935
+ var badge = /* @__PURE__ */ _7a4688({ defaultClassName: "_1295cfn4", variantClassNames: { variant: { solid: "_1295cfn5", soft: "_1295cfn6", outline: "_1295cfn7" }, color: { primary: "_1295cfn8", neutral: "_1295cfn9", danger: "_1295cfna", success: "_1295cfnb", warning: "_1295cfnc" }, size: { sm: "_1295cfnd", md: "_1295cfne", lg: "_1295cfnf" } }, defaultVariants: { variant: "soft", color: "neutral", size: "md" }, compoundVariants: [] });
936
+ var icon3 = "_1295cfng";
937
+
938
+ // src/components/Badge/Badge.tsx
939
+ import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
940
+ var Badge = /* @__PURE__ */ forwardRef13(function Badge2({ variant, color, size, startIcon, className, children, ...rest }, ref) {
941
+ return /* @__PURE__ */ jsxs13("span", { ref, className: cx(badge({ variant, color, size }), className), ...rest, children: [
942
+ startIcon && /* @__PURE__ */ jsx15("span", { className: icon3, children: startIcon }),
943
+ children
944
+ ] });
945
+ });
946
+
947
+ // src/components/Breadcrumb/Breadcrumb.tsx
948
+ import { forwardRef as forwardRef15 } from "react";
949
+ import { ChevronRightIcon } from "@bestow-ui/icons";
950
+
951
+ // src/components/Link/Link.tsx
952
+ import { Slot } from "@radix-ui/react-slot";
953
+ import { forwardRef as forwardRef14 } from "react";
954
+ import { ExternalLinkIcon } from "@bestow-ui/icons";
955
+
956
+ // src/components/Link/Link.css.ts
957
+ import { createRuntimeFn as _7a4689 } from "@vanilla-extract/recipes/createRuntimeFn";
958
+ var externalIcon = "_1t4hlp6";
959
+ var link = /* @__PURE__ */ _7a4689({ defaultClassName: "_1t4hlp0", variantClassNames: { color: { primary: "_1t4hlp1", neutral: "_1t4hlp2", inherit: "_1t4hlp3" }, underline: { always: "_1t4hlp4", hover: "_1t4hlp5" } }, defaultVariants: { color: "primary", underline: "always" }, compoundVariants: [] });
960
+
961
+ // src/components/Link/Link.tsx
962
+ import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
963
+ var Link = /* @__PURE__ */ forwardRef14(function Link2({
964
+ as: Component = "a",
965
+ asChild,
966
+ color,
967
+ underline,
968
+ external,
969
+ externalLabel: externalLabelProp,
970
+ target,
971
+ rel,
972
+ className,
973
+ children,
974
+ ...rest
975
+ }, ref) {
976
+ const m = useMessages();
977
+ const externalLabel = externalLabelProp ?? m.newWindow ?? "(\uC0C8 \uCC3D)";
978
+ const linkClassName = cx(link({ color, underline }), className);
979
+ if (asChild) {
980
+ return (
981
+ // Slot 의 props 타입은 HTMLElement 기준이라 <a> 전용 속성(target·rel 등)은 그대로 넘기도록 단언한다
982
+ /* @__PURE__ */ jsx16(Slot, { ref, className: linkClassName, ...{ target, rel, ...rest }, children })
983
+ );
984
+ }
985
+ return /* @__PURE__ */ jsxs14(
986
+ Component,
987
+ {
988
+ ref,
989
+ className: linkClassName,
990
+ target: external ? target ?? "_blank" : target,
991
+ rel: external ? rel ?? "noopener noreferrer" : rel,
992
+ ...rest,
993
+ children: [
994
+ children,
995
+ external && /* @__PURE__ */ jsxs14(Fragment3, { children: [
996
+ " ",
997
+ /* @__PURE__ */ jsx16(ExternalLinkIcon, { className: externalIcon }),
998
+ /* @__PURE__ */ jsx16("span", { className: visuallyHidden, children: externalLabel })
999
+ ] })
1000
+ ]
1001
+ }
1002
+ );
1003
+ });
1004
+
1005
+ // src/components/Breadcrumb/Breadcrumb.css.ts
1006
+ var current = "_18t8ztt3";
1007
+ var item3 = "_18t8ztt1";
1008
+ var link2 = "_18t8ztt2";
1009
+ var list2 = "_18t8ztt0";
1010
+ var separator = "_18t8ztt4";
1011
+
1012
+ // src/components/Breadcrumb/Breadcrumb.tsx
1013
+ import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
1014
+ var Breadcrumb = /* @__PURE__ */ forwardRef15(function Breadcrumb2({ items: items2, linkAs, separator: separator3, "aria-label": ariaLabelProp, className, ...rest }, ref) {
1015
+ const m = useMessages();
1016
+ const ariaLabel = ariaLabelProp ?? m.breadcrumb ?? "\uC774\uB3D9 \uACBD\uB85C";
1017
+ const sep = separator3 ?? /* @__PURE__ */ jsx17(ChevronRightIcon, { size: 14 });
1018
+ return /* @__PURE__ */ jsx17("nav", { ref, "aria-label": ariaLabel, className, ...rest, children: /* @__PURE__ */ jsx17("ol", { className: list2, children: items2.map((item7, index) => {
1019
+ const isCurrent = index === items2.length - 1;
1020
+ return /* @__PURE__ */ jsxs15("li", { className: item3, children: [
1021
+ index > 0 && /* @__PURE__ */ jsx17("span", { className: separator, "aria-hidden": true, children: sep }),
1022
+ isCurrent || item7.href === void 0 ? /* @__PURE__ */ jsx17("span", { className: isCurrent ? current : void 0, "aria-current": isCurrent ? "page" : void 0, children: item7.label }) : /* @__PURE__ */ jsx17(Link, { as: linkAs, href: item7.href, color: "neutral", underline: "hover", className: link2, children: item7.label })
1023
+ ] }, index);
1024
+ }) }) });
1025
+ });
1026
+
1027
+ // src/components/BusinessNumberInput/BusinessNumberInput.tsx
1028
+ import { forwardRef as forwardRef16, useRef as useRef6, useState as useState4 } from "react";
1029
+ import { jsx as jsx18 } from "react/jsx-runtime";
1030
+ var sanitize = (input5) => input5.replace(/\D/g, "").slice(0, 10);
1031
+ var isDigit2 = (char) => /\d/.test(char);
1032
+ var BusinessNumberInput = /* @__PURE__ */ forwardRef16(
1033
+ function BusinessNumberInput2(props, ref) {
1034
+ const {
1035
+ value: value4,
1036
+ defaultValue,
1037
+ onValueChange,
1038
+ validate = true,
1039
+ invalidText: invalidTextProp,
1040
+ label: labelProp,
1041
+ placeholder = "000-00-00000",
1042
+ error,
1043
+ helperText: helperText3,
1044
+ onBlur,
1045
+ onKeyDown,
1046
+ ...rest
1047
+ } = props;
1048
+ const inputRef = useRef6(null);
1049
+ const m = useMessages();
1050
+ const invalidText = invalidTextProp ?? m.businessNumberInvalid ?? "\uC62C\uBC14\uB978 \uC0AC\uC5C5\uC790\uB4F1\uB85D\uBC88\uD638\uAC00 \uC544\uB2C8\uC5D0\uC694. \uBC88\uD638\uB97C \uB2E4\uC2DC \uD655\uC778\uD574 \uC8FC\uC138\uC694.";
1051
+ const label6 = labelProp ?? m.businessNumber ?? "\uC0AC\uC5C5\uC790\uB4F1\uB85D\uBC88\uD638";
1052
+ const incompleteText = m.businessNumberIncomplete ?? "10\uC790\uB9AC\uB97C \uBAA8\uB450 \uC785\uB825\uD574 \uC8FC\uC138\uC694.";
1053
+ const [touched, setTouched] = useState4(false);
1054
+ const field3 = useFormattedInput({
1055
+ isControlled: "value" in props,
1056
+ value: value4,
1057
+ defaultValue,
1058
+ onValueChange: (digits) => onValueChange?.(digits, digits.length === 10 ? isValidBusinessNumber(digits) : null),
1059
+ sanitize,
1060
+ format: formatBusinessNumber,
1061
+ isMeaningful: isDigit2,
1062
+ inputRef
1063
+ });
1064
+ const complete = field3.raw.length === 10;
1065
+ const autoInvalid = validate && field3.raw.length > 0 && (complete ? !isValidBusinessNumber(field3.raw) : touched);
1066
+ const showAuto = autoInvalid && error === void 0;
1067
+ return /* @__PURE__ */ jsx18(
1068
+ TextField,
1069
+ {
1070
+ ref: mergeRefs(ref, inputRef),
1071
+ label: label6,
1072
+ placeholder,
1073
+ inputMode: "numeric",
1074
+ value: field3.display,
1075
+ onChange: field3.onChange,
1076
+ onKeyDown: (event) => {
1077
+ field3.onKeyDown(event);
1078
+ onKeyDown?.(event);
1079
+ },
1080
+ onBlur: (event) => {
1081
+ setTouched(true);
1082
+ onBlur?.(event);
1083
+ },
1084
+ error: error ?? autoInvalid,
1085
+ helperText: showAuto ? complete ? invalidText : incompleteText : helperText3,
1086
+ ...rest
1087
+ }
1088
+ );
1089
+ }
1090
+ );
1091
+
1092
+ // src/components/Calendar/Calendar.tsx
1093
+ import { forwardRef as forwardRef18, useEffect as useEffect4, useId as useId4, useRef as useRef7, useState as useState5 } from "react";
1094
+ import { ChevronLeftIcon, ChevronRightIcon as ChevronRightIcon2 } from "@bestow-ui/icons";
1095
+
1096
+ // src/utils/useIsClient.ts
1097
+ import { useSyncExternalStore } from "react";
1098
+ var subscribeNothing = () => () => {
1099
+ };
1100
+ function useIsClient() {
1101
+ return useSyncExternalStore(
1102
+ subscribeNothing,
1103
+ () => true,
1104
+ () => false
1105
+ );
1106
+ }
1107
+
1108
+ // src/components/IconButton/IconButton.tsx
1109
+ import { forwardRef as forwardRef17 } from "react";
1110
+
1111
+ // src/components/IconButton/IconButton.css.ts
1112
+ import { createRuntimeFn as _7a46810 } from "@vanilla-extract/recipes/createRuntimeFn";
1113
+ var iconButton = /* @__PURE__ */ _7a46810({ defaultClassName: "ip9et20", variantClassNames: { size: { sm: "ip9et21", md: "ip9et22", lg: "ip9et23" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
1114
+
1115
+ // src/components/IconButton/IconButton.tsx
1116
+ import { jsx as jsx19 } from "react/jsx-runtime";
1117
+ var IconButton = /* @__PURE__ */ forwardRef17(function IconButton2({ variant = "ghost", color = "neutral", size, loading, className, children, ...rest }, ref) {
1118
+ return /* @__PURE__ */ jsx19(
1119
+ Button,
1120
+ {
1121
+ ref,
1122
+ variant,
1123
+ color,
1124
+ size,
1125
+ loading,
1126
+ className: cx(iconButton({ size }), className),
1127
+ ...rest,
1128
+ children: !loading && children
1129
+ }
1130
+ );
1131
+ });
1132
+
1133
+ // src/components/Calendar/Calendar.css.ts
1134
+ var cell = "_1qyq67b5";
1135
+ var day = "_1qyq67b6";
1136
+ var grid = "_1qyq67b3";
1137
+ var header3 = "_1qyq67b1";
1138
+ var heading = "_1qyq67b2";
1139
+ var root6 = "_1qyq67b0";
1140
+ var weekday = "_1qyq67b4";
1141
+
1142
+ // src/components/Calendar/Calendar.tsx
1143
+ import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
1144
+ var Calendar = /* @__PURE__ */ forwardRef18(function Calendar2(props, ref) {
1145
+ const {
1146
+ value: value4,
1147
+ defaultValue,
1148
+ onValueChange,
1149
+ min,
1150
+ max,
1151
+ isDateDisabled,
1152
+ isHoliday,
1153
+ today: todayProp,
1154
+ initialFocus,
1155
+ prevMonthLabel: prevMonthLabelProp,
1156
+ nextMonthLabel: nextMonthLabelProp,
1157
+ className
1158
+ } = props;
1159
+ const m = useMessages();
1160
+ const prevMonthLabel = prevMonthLabelProp ?? m.previousMonth ?? "\uC774\uC804 \uB2EC";
1161
+ const nextMonthLabel = nextMonthLabelProp ?? m.nextMonth ?? "\uB2E4\uC74C \uB2EC";
1162
+ const weekdaysShort = m.weekdaysShort ?? KOREAN_WEEKDAYS;
1163
+ const weekdaysLong = m.weekdaysLong ?? KOREAN_WEEKDAYS.map((name) => `${name}\uC694\uC77C`);
1164
+ const headingId = useId4();
1165
+ const gridRef = useRef7(null);
1166
+ const isControlled = "value" in props;
1167
+ const [innerValue, setInnerValue] = useState5(defaultValue ?? "");
1168
+ const selected = parseISODate(isControlled ? value4 : innerValue);
1169
+ const isClient = useIsClient();
1170
+ const today = parseISODate(todayProp) ?? (isClient ? /* @__PURE__ */ new Date() : null);
1171
+ const minDate = parseISODate(min);
1172
+ const maxDate = parseISODate(max);
1173
+ const clamp = (date) => {
1174
+ if (minDate && compareDays(date, minDate) < 0) return minDate;
1175
+ if (maxDate && compareDays(date, maxDate) > 0) return maxDate;
1176
+ return date;
1177
+ };
1178
+ const isDisabled = (date) => minDate !== null && compareDays(date, minDate) < 0 || maxDate !== null && compareDays(date, maxDate) > 0 || !!isDateDisabled?.(date);
1179
+ const [focusedState, setFocused] = useState5(null);
1180
+ const base = selected ?? today;
1181
+ const focused = focusedState ?? (base ? clamp(base) : null);
1182
+ const moveFocus = useRef7(initialFocus ?? false);
1183
+ const selectedIso = selected ? toISODate(selected) : "";
1184
+ useEffect4(() => {
1185
+ const date = parseISODate(selectedIso);
1186
+ if (date) setFocused((prev) => isSameDay(prev, date) ? prev : date);
1187
+ }, [selectedIso]);
1188
+ useEffect4(() => {
1189
+ if (!moveFocus.current || !focused) return;
1190
+ moveFocus.current = false;
1191
+ gridRef.current?.querySelector(`[data-date="${toISODate(focused)}"]`)?.focus();
1192
+ }, [focused]);
1193
+ const focusDate = (date) => {
1194
+ moveFocus.current = true;
1195
+ setFocused(clamp(date));
1196
+ };
1197
+ const select = (date) => {
1198
+ if (isDisabled(date)) return;
1199
+ const iso = toISODate(date);
1200
+ if (!isControlled) setInnerValue(iso);
1201
+ onValueChange?.(iso);
1202
+ setFocused(date);
1203
+ };
1204
+ const handleKeyDown = (event) => {
1205
+ if (!focused) return;
1206
+ const moves = {
1207
+ ArrowLeft: () => addDays(focused, -1),
1208
+ ArrowRight: () => addDays(focused, 1),
1209
+ ArrowUp: () => addDays(focused, -7),
1210
+ ArrowDown: () => addDays(focused, 7),
1211
+ Home: () => addDays(focused, -focused.getDay()),
1212
+ End: () => addDays(focused, 6 - focused.getDay()),
1213
+ PageUp: () => addMonths(focused, event.shiftKey ? -12 : -1),
1214
+ PageDown: () => addMonths(focused, event.shiftKey ? 12 : 1)
1215
+ };
1216
+ const move = moves[event.key];
1217
+ if (move) {
1218
+ event.preventDefault();
1219
+ focusDate(move());
1220
+ }
1221
+ };
1222
+ const visible = focused;
1223
+ const weeks = visible ? getCalendarWeeks(visible.getFullYear(), visible.getMonth()).filter(
1224
+ (week) => week.some((date) => isSameMonth(date, visible))
1225
+ ) : [];
1226
+ const canPrev = !!visible && (!minDate || compareDays(new Date(visible.getFullYear(), visible.getMonth(), 0), minDate) >= 0);
1227
+ const canNext = !!visible && (!maxDate || compareDays(new Date(visible.getFullYear(), visible.getMonth() + 1, 1), maxDate) <= 0);
1228
+ return /* @__PURE__ */ jsxs16("div", { ref, className: cx(root6, className), children: [
1229
+ /* @__PURE__ */ jsxs16("div", { className: header3, children: [
1230
+ /* @__PURE__ */ jsx20(
1231
+ IconButton,
1232
+ {
1233
+ "aria-label": prevMonthLabel,
1234
+ size: "sm",
1235
+ disabled: !canPrev,
1236
+ onClick: () => visible && setFocused(clamp(addMonths(visible, -1))),
1237
+ children: /* @__PURE__ */ jsx20(ChevronLeftIcon, {})
1238
+ }
1239
+ ),
1240
+ /* @__PURE__ */ jsx20("div", { id: headingId, className: heading, "aria-live": "polite", children: visible && (m.monthTitle?.(visible.getFullYear(), visible.getMonth() + 1) ?? `${visible.getFullYear()}\uB144 ${visible.getMonth() + 1}\uC6D4`) }),
1241
+ /* @__PURE__ */ jsx20(
1242
+ IconButton,
1243
+ {
1244
+ "aria-label": nextMonthLabel,
1245
+ size: "sm",
1246
+ disabled: !canNext,
1247
+ onClick: () => visible && setFocused(clamp(addMonths(visible, 1))),
1248
+ children: /* @__PURE__ */ jsx20(ChevronRightIcon2, {})
1249
+ }
1250
+ )
1251
+ ] }),
1252
+ /* @__PURE__ */ jsxs16("table", { ref: gridRef, role: "grid", "aria-labelledby": headingId, className: grid, onKeyDown: handleKeyDown, children: [
1253
+ /* @__PURE__ */ jsx20("thead", { children: /* @__PURE__ */ jsx20("tr", { children: weekdaysShort.map((name, index) => /* @__PURE__ */ jsx20("th", { scope: "col", abbr: weekdaysLong[index], className: weekday, "data-weekday": index, children: name }, index)) }) }),
1254
+ /* @__PURE__ */ jsx20("tbody", { children: weeks.map((week) => /* @__PURE__ */ jsx20("tr", { children: week.map((date) => {
1255
+ const iso = toISODate(date);
1256
+ if (!visible || !isSameMonth(date, visible))
1257
+ return /* @__PURE__ */ jsx20("td", { role: "gridcell", className: cell }, iso);
1258
+ const isSelected = isSameDay(date, selected);
1259
+ const isToday = isSameDay(date, today);
1260
+ const holiday = !!isHoliday?.(date);
1261
+ const disabled = isDisabled(date);
1262
+ const label6 = [
1263
+ m.dayLabel?.(date, weekdaysLong[date.getDay()]) ?? `${date.getDate()}, ${date.getFullYear()}\uB144 ${date.getMonth() + 1}\uC6D4 ${weekdaysLong[date.getDay()]}`,
1264
+ holiday && (m.holiday ?? "\uACF5\uD734\uC77C"),
1265
+ isToday && (m.today ?? "\uC624\uB298")
1266
+ ].filter(Boolean).join(", ");
1267
+ return /* @__PURE__ */ jsx20("td", { role: "gridcell", "aria-selected": isSelected, className: cell, children: /* @__PURE__ */ jsx20(
1268
+ "button",
1269
+ {
1270
+ type: "button",
1271
+ className: day,
1272
+ "data-date": iso,
1273
+ "data-weekday": date.getDay(),
1274
+ "data-holiday": holiday || void 0,
1275
+ "data-selected": isSelected || void 0,
1276
+ tabIndex: isSameDay(date, focused) ? 0 : -1,
1277
+ "aria-label": label6,
1278
+ "aria-current": isToday ? "date" : void 0,
1279
+ "aria-disabled": disabled || void 0,
1280
+ onClick: () => select(date),
1281
+ onFocus: () => !isSameDay(date, focused) && setFocused(date),
1282
+ children: date.getDate()
1283
+ }
1284
+ ) }, iso);
1285
+ }) }, toISODate(week[0]))) })
1286
+ ] })
1287
+ ] });
1288
+ });
1289
+
1290
+ // src/components/Card/Card.tsx
1291
+ import { forwardRef as forwardRef19 } from "react";
1292
+
1293
+ // src/components/Card/Card.css.ts
1294
+ import { createRuntimeFn as _7a46811 } from "@vanilla-extract/recipes/createRuntimeFn";
1295
+ var body2 = "dnuf1u9";
1296
+ var card = /* @__PURE__ */ _7a46811({ defaultClassName: "dnuf1u0", variantClassNames: { variant: { outline: "dnuf1u1", elevated: "dnuf1u2", soft: "dnuf1u3" }, padding: { none: "dnuf1u4", sm: "dnuf1u5", md: "dnuf1u6", lg: "dnuf1u7" } }, defaultVariants: { variant: "outline", padding: "md" }, compoundVariants: [] });
1297
+ var footer2 = "dnuf1ua";
1298
+ var header4 = "dnuf1u8";
1299
+
1300
+ // src/components/Card/Card.tsx
1301
+ import { jsx as jsx21 } from "react/jsx-runtime";
1302
+ var Card = /* @__PURE__ */ forwardRef19(function Card2({ variant, padding, as: Component = "div", className, ...rest }, ref) {
1303
+ return /* @__PURE__ */ jsx21(Component, { ref, className: cx(card({ variant, padding }), className), ...rest });
1304
+ });
1305
+ var CardHeader = /* @__PURE__ */ forwardRef19(function CardHeader2({ className, ...rest }, ref) {
1306
+ return /* @__PURE__ */ jsx21("div", { ref, className: cx(header4, className), ...rest });
1307
+ });
1308
+ var CardBody = /* @__PURE__ */ forwardRef19(function CardBody2({ className, ...rest }, ref) {
1309
+ return /* @__PURE__ */ jsx21("div", { ref, className: cx(body2, className), ...rest });
1310
+ });
1311
+ var CardFooter = /* @__PURE__ */ forwardRef19(function CardFooter2({ className, ...rest }, ref) {
1312
+ return /* @__PURE__ */ jsx21("div", { ref, className: cx(footer2, className), ...rest });
1313
+ });
1314
+
1315
+ // src/components/Combobox/Combobox.tsx
1316
+ import * as Popover from "@radix-ui/react-popover";
1317
+ import {
1318
+ forwardRef as forwardRef20,
1319
+ useEffect as useEffect5,
1320
+ useId as useId5,
1321
+ useMemo as useMemo3,
1322
+ useRef as useRef8,
1323
+ useState as useState6
1324
+ } from "react";
1325
+ import { CheckIcon, ChevronDownIcon as ChevronDownIcon3 } from "@bestow-ui/icons";
1326
+
1327
+ // src/components/Select/Select.css.ts
1328
+ var content5 = "_1kx81e83";
1329
+ var icon4 = "_1kx81e82";
1330
+ var item4 = "_1kx81e85";
1331
+ var itemIndicator = "_1kx81e86";
1332
+ var trigger2 = "_1kx81e80";
1333
+ var value = "_1kx81e81";
1334
+ var viewport = "_1kx81e84";
1335
+
1336
+ // src/components/Combobox/Combobox.css.ts
1337
+ var content6 = "c2pbq71";
1338
+ var empty = "c2pbq72";
1339
+ var toggle2 = "c2pbq70";
1340
+
1341
+ // src/components/Combobox/Combobox.tsx
1342
+ import { jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
1343
+ var defaultFilter = (option2, query) => option2.label.toLowerCase().includes(query.trim().toLowerCase());
1344
+ var Combobox = /* @__PURE__ */ forwardRef20(function Combobox2(props, ref) {
1345
+ const {
1346
+ options,
1347
+ value: value4,
1348
+ defaultValue,
1349
+ onValueChange,
1350
+ filter = defaultFilter,
1351
+ emptyMessage: emptyMessageProp,
1352
+ placeholder,
1353
+ label: label6,
1354
+ helperText: helperText3,
1355
+ error,
1356
+ size,
1357
+ fullWidth,
1358
+ disabled,
1359
+ required,
1360
+ name,
1361
+ id,
1362
+ "aria-label": ariaLabel,
1363
+ toggleLabel: toggleLabelProp,
1364
+ className
1365
+ } = props;
1366
+ const m = useMessages();
1367
+ const emptyMessage = emptyMessageProp ?? m.noResults ?? "\uACB0\uACFC\uAC00 \uC5C6\uC5B4\uC694";
1368
+ const toggleLabel = toggleLabelProp ?? m.openList ?? "\uBAA9\uB85D \uC5F4\uAE30";
1369
+ const generatedId = useId5();
1370
+ const inputId = id ?? generatedId;
1371
+ const labelId = `${inputId}-label`;
1372
+ const listId = `${inputId}-listbox`;
1373
+ const helperId = helperText3 ? `${inputId}-helper` : void 0;
1374
+ const optionId = (index) => `${inputId}-option-${index}`;
1375
+ const portal2 = usePortalProps();
1376
+ const inputRef = useRef8(null);
1377
+ const anchorRef = useRef8(null);
1378
+ const isControlled = "value" in props;
1379
+ const [innerValue, setInnerValue] = useState6(defaultValue);
1380
+ const selectedValue = isControlled ? value4 : innerValue;
1381
+ const selectedOption = options.find((o) => o.value === selectedValue);
1382
+ const [open, setOpen] = useState6(false);
1383
+ const [query, setQuery] = useState6(null);
1384
+ const [activeIndex, setActiveIndex] = useState6(-1);
1385
+ const filtered = useMemo3(() => query ? options.filter((o) => filter(o, query)) : options, [options, filter, query]);
1386
+ const inputText = query ?? selectedOption?.label ?? "";
1387
+ const firstEnabled = (list5, from = 0, step = 1) => {
1388
+ for (let i = from; i >= 0 && i < list5.length; i += step) if (!list5[i].disabled) return i;
1389
+ return -1;
1390
+ };
1391
+ const openList = (list5 = filtered, preferLast = false) => {
1392
+ setOpen(true);
1393
+ const selectedIndex = list5.findIndex((o) => o.value === selectedValue);
1394
+ setActiveIndex(
1395
+ selectedIndex >= 0 && !list5[selectedIndex].disabled ? selectedIndex : preferLast ? firstEnabled(list5, list5.length - 1, -1) : firstEnabled(list5)
1396
+ );
1397
+ };
1398
+ const close2 = () => {
1399
+ setOpen(false);
1400
+ setQuery(null);
1401
+ setActiveIndex(-1);
1402
+ };
1403
+ const select = (option2) => {
1404
+ if (option2.disabled) return;
1405
+ if (!isControlled) setInnerValue(option2.value);
1406
+ if (option2.value !== selectedValue) onValueChange?.(option2.value);
1407
+ close2();
1408
+ };
1409
+ const move = (step) => {
1410
+ const start = activeIndex < 0 ? step === 1 ? 0 : filtered.length - 1 : activeIndex + step;
1411
+ const next = firstEnabled(filtered, start, step);
1412
+ if (next >= 0) setActiveIndex(next);
1413
+ };
1414
+ const handleChange = (event) => {
1415
+ const nextQuery = event.target.value;
1416
+ const nextList = nextQuery ? options.filter((o) => filter(o, nextQuery)) : options;
1417
+ setQuery(nextQuery);
1418
+ setOpen(true);
1419
+ setActiveIndex(firstEnabled(nextList));
1420
+ };
1421
+ const handleKeyDown = (event) => {
1422
+ switch (event.key) {
1423
+ case "ArrowDown":
1424
+ event.preventDefault();
1425
+ if (!open) openList();
1426
+ else move(1);
1427
+ break;
1428
+ case "ArrowUp":
1429
+ event.preventDefault();
1430
+ if (!open) openList(filtered, true);
1431
+ else move(-1);
1432
+ break;
1433
+ case "Enter":
1434
+ if (open) {
1435
+ event.preventDefault();
1436
+ const option2 = filtered[activeIndex];
1437
+ if (option2) select(option2);
1438
+ }
1439
+ break;
1440
+ case "Escape":
1441
+ if (open) {
1442
+ event.preventDefault();
1443
+ close2();
1444
+ }
1445
+ break;
1446
+ case "Tab":
1447
+ if (open) close2();
1448
+ break;
1449
+ }
1450
+ };
1451
+ useEffect5(() => {
1452
+ if (!open || activeIndex < 0) return;
1453
+ document.getElementById(optionId(activeIndex))?.scrollIntoView?.({ block: "nearest" });
1454
+ }, [open, activeIndex]);
1455
+ const hasOptions = filtered.length > 0;
1456
+ return /* @__PURE__ */ jsxs17("div", { className: cx(field, fullWidth && fieldFullWidth), children: [
1457
+ label6 && /* @__PURE__ */ jsxs17("label", { id: labelId, htmlFor: inputId, className: label, children: [
1458
+ label6,
1459
+ required && /* @__PURE__ */ jsx22("span", { className: requiredMark, "aria-hidden": true, children: "*" })
1460
+ ] }),
1461
+ /* @__PURE__ */ jsxs17(Popover.Root, { open: open && !disabled, onOpenChange: (next) => next ? openList() : close2(), children: [
1462
+ /* @__PURE__ */ jsx22(Popover.Anchor, { asChild: true, children: /* @__PURE__ */ jsxs17(
1463
+ "div",
1464
+ {
1465
+ ref: anchorRef,
1466
+ className: cx(root3({ size, fullWidth }), className),
1467
+ "data-invalid": error || void 0,
1468
+ "data-disabled": disabled || void 0,
1469
+ children: [
1470
+ /* @__PURE__ */ jsx22(
1471
+ "input",
1472
+ {
1473
+ ref: mergeRefs(ref, inputRef),
1474
+ id: inputId,
1475
+ type: "text",
1476
+ role: "combobox",
1477
+ "aria-expanded": open,
1478
+ "aria-controls": open && hasOptions ? listId : void 0,
1479
+ "aria-autocomplete": "list",
1480
+ "aria-activedescendant": open && activeIndex >= 0 ? optionId(activeIndex) : void 0,
1481
+ "aria-label": label6 ? void 0 : ariaLabel,
1482
+ "aria-invalid": error || void 0,
1483
+ "aria-required": required || void 0,
1484
+ "aria-describedby": helperId,
1485
+ autoComplete: "off",
1486
+ placeholder,
1487
+ disabled,
1488
+ value: inputText,
1489
+ onChange: handleChange,
1490
+ onKeyDown: handleKeyDown,
1491
+ onBlur: () => {
1492
+ if (open) close2();
1493
+ },
1494
+ className: input
1495
+ }
1496
+ ),
1497
+ /* @__PURE__ */ jsx22(
1498
+ "button",
1499
+ {
1500
+ type: "button",
1501
+ tabIndex: -1,
1502
+ "aria-label": toggleLabel,
1503
+ "aria-expanded": open,
1504
+ disabled,
1505
+ className: toggle2,
1506
+ onMouseDown: (event) => event.preventDefault(),
1507
+ onClick: () => {
1508
+ if (open) close2();
1509
+ else openList(options);
1510
+ inputRef.current?.focus();
1511
+ },
1512
+ children: /* @__PURE__ */ jsx22(ChevronDownIcon3, { size: 16 })
1513
+ }
1514
+ )
1515
+ ]
1516
+ }
1517
+ ) }),
1518
+ /* @__PURE__ */ jsx22(Popover.Portal, { children: /* @__PURE__ */ jsx22(
1519
+ Popover.Content,
1520
+ {
1521
+ role: "presentation",
1522
+ align: "start",
1523
+ sideOffset: 4,
1524
+ collisionPadding: 8,
1525
+ className: cx(portal2.className, content6),
1526
+ style: portal2.style,
1527
+ onOpenAutoFocus: (event) => event.preventDefault(),
1528
+ onCloseAutoFocus: (event) => event.preventDefault(),
1529
+ onMouseDown: (event) => event.preventDefault(),
1530
+ onInteractOutside: (event) => {
1531
+ if (anchorRef.current?.contains(event.target)) event.preventDefault();
1532
+ },
1533
+ children: hasOptions ? /* @__PURE__ */ jsx22(
1534
+ "div",
1535
+ {
1536
+ id: listId,
1537
+ role: "listbox",
1538
+ "aria-labelledby": label6 ? labelId : void 0,
1539
+ "aria-label": label6 ? void 0 : ariaLabel,
1540
+ children: filtered.map((option2, index) => {
1541
+ const isSelected = option2.value === selectedValue;
1542
+ return (
1543
+ // aria-activedescendant 패턴: 포커스·키보드는 입력창이 맡고 항목은 포커스를 받지 않는다 (WAI-ARIA combobox)
1544
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/interactive-supports-focus
1545
+ /* @__PURE__ */ jsxs17(
1546
+ "div",
1547
+ {
1548
+ id: optionId(index),
1549
+ role: "option",
1550
+ "aria-selected": isSelected,
1551
+ "aria-disabled": option2.disabled || void 0,
1552
+ "data-highlighted": index === activeIndex ? "" : void 0,
1553
+ "data-state": isSelected ? "checked" : "unchecked",
1554
+ "data-disabled": option2.disabled ? "" : void 0,
1555
+ className: item4,
1556
+ onMouseDown: (event) => event.preventDefault(),
1557
+ onMouseMove: () => !option2.disabled && setActiveIndex(index),
1558
+ onClick: () => select(option2),
1559
+ children: [
1560
+ option2.label,
1561
+ isSelected && /* @__PURE__ */ jsx22("span", { className: itemIndicator, "aria-hidden": true, children: /* @__PURE__ */ jsx22(CheckIcon, { size: 16 }) })
1562
+ ]
1563
+ },
1564
+ option2.value
1565
+ )
1566
+ );
1567
+ })
1568
+ }
1569
+ ) : /* @__PURE__ */ jsx22("div", { className: empty, role: "status", children: emptyMessage })
1570
+ }
1571
+ ) })
1572
+ ] }),
1573
+ name && /* @__PURE__ */ jsx22("input", { type: "hidden", name, value: selectedValue ?? "" }),
1574
+ helperText3 && /* @__PURE__ */ jsx22("p", { id: helperId, className: helperText({ error }), children: helperText3 })
1575
+ ] });
1576
+ });
1577
+
1578
+ // src/components/DatePicker/DatePicker.tsx
1579
+ import { forwardRef as forwardRef21, useEffect as useEffect6, useRef as useRef9, useState as useState7 } from "react";
1580
+ import { CalendarIcon } from "@bestow-ui/icons";
1581
+
1582
+ // src/components/Popover/Popover.tsx
1583
+ import * as RadixPopover from "@radix-ui/react-popover";
1584
+ import { XIcon as XIcon3 } from "@bestow-ui/icons";
1585
+ import { useId as useId6 } from "react";
1586
+
1587
+ // src/components/Popover/Popover.css.ts
1588
+ var arrow = "_1j99p8x4";
1589
+ var closeButton3 = "_1j99p8x3";
1590
+ var content7 = "_1j99p8x0";
1591
+ var header5 = "_1j99p8x1";
1592
+ var title3 = "_1j99p8x2";
1593
+
1594
+ // src/components/Popover/Popover.tsx
1595
+ import { jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
1596
+ function Popover2({
1597
+ content: content12,
1598
+ children,
1599
+ title: title6,
1600
+ "aria-label": ariaLabel,
1601
+ showClose = false,
1602
+ showArrow = false,
1603
+ side = "bottom",
1604
+ align = "center",
1605
+ open,
1606
+ defaultOpen,
1607
+ onOpenChange,
1608
+ modal,
1609
+ className,
1610
+ style,
1611
+ onOpenAutoFocus
1612
+ }) {
1613
+ const portal2 = usePortalProps();
1614
+ const m = useMessages();
1615
+ const titleId = useId6();
1616
+ return /* @__PURE__ */ jsxs18(RadixPopover.Root, { open, defaultOpen, onOpenChange, modal, children: [
1617
+ /* @__PURE__ */ jsx23(RadixPopover.Trigger, { asChild: true, children }),
1618
+ /* @__PURE__ */ jsx23(RadixPopover.Portal, { children: /* @__PURE__ */ jsxs18(
1619
+ RadixPopover.Content,
1620
+ {
1621
+ side,
1622
+ align,
1623
+ sideOffset: 6,
1624
+ onOpenAutoFocus,
1625
+ collisionPadding: 8,
1626
+ "aria-labelledby": title6 ? titleId : void 0,
1627
+ "aria-label": title6 ? void 0 : ariaLabel,
1628
+ className: cx(portal2.className, content7, className),
1629
+ style: { ...portal2.style, ...style },
1630
+ children: [
1631
+ (title6 || showClose) && /* @__PURE__ */ jsxs18("div", { className: header5, children: [
1632
+ title6 && /* @__PURE__ */ jsx23("h2", { id: titleId, className: title3, children: title6 }),
1633
+ showClose && /* @__PURE__ */ jsx23(RadixPopover.Close, { className: closeButton3, "aria-label": m.close ?? "\uB2EB\uAE30", children: /* @__PURE__ */ jsx23(XIcon3, { size: 16 }) })
1634
+ ] }),
1635
+ content12,
1636
+ showArrow && /* @__PURE__ */ jsx23(RadixPopover.Arrow, { className: arrow, width: 12, height: 6 })
1637
+ ]
1638
+ }
1639
+ ) })
1640
+ ] });
1641
+ }
1642
+ var PopoverClose = RadixPopover.Close;
1643
+
1644
+ // src/components/DatePicker/DatePicker.tsx
1645
+ import { Fragment as Fragment4, jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
1646
+ var sanitize2 = (input5) => input5.replace(/\D/g, "").slice(0, 8);
1647
+ var format = (digits) => digits.length <= 4 ? digits : digits.length <= 6 ? `${digits.slice(0, 4)}-${digits.slice(4)}` : `${digits.slice(0, 4)}-${digits.slice(4, 6)}-${digits.slice(6)}`;
1648
+ var isDigit3 = (char) => /\d/.test(char);
1649
+ var DatePicker = /* @__PURE__ */ forwardRef21(
1650
+ function DatePicker2(props, ref) {
1651
+ const {
1652
+ value: value4,
1653
+ defaultValue,
1654
+ onValueChange,
1655
+ min,
1656
+ max,
1657
+ isDateDisabled,
1658
+ isHoliday,
1659
+ today,
1660
+ label: labelProp,
1661
+ helperText: helperText3,
1662
+ error,
1663
+ required,
1664
+ disabled,
1665
+ fullWidth,
1666
+ placeholder = "YYYY-MM-DD",
1667
+ calendarLabel: calendarLabelProp,
1668
+ invalidText: invalidTextProp,
1669
+ unavailableText: unavailableTextProp,
1670
+ incompleteText: incompleteTextProp,
1671
+ name,
1672
+ id,
1673
+ className
1674
+ } = props;
1675
+ const inputRef = useRef9(null);
1676
+ const m = useMessages();
1677
+ const label6 = labelProp ?? m.date ?? "\uB0A0\uC9DC";
1678
+ const calendarLabel = calendarLabelProp ?? m.openCalendar ?? "\uB2EC\uB825 \uC5F4\uAE30";
1679
+ const invalidText = invalidTextProp ?? m.dateInvalid ?? "\uC62C\uBC14\uB978 \uB0A0\uC9DC\uAC00 \uC544\uB2C8\uC5D0\uC694.";
1680
+ const unavailableText = unavailableTextProp ?? m.dateUnavailable ?? "\uACE0\uB97C \uC218 \uC5C6\uB294 \uB0A0\uC9DC\uC608\uC694.";
1681
+ const incompleteText = incompleteTextProp ?? m.dateIncomplete ?? "\uB0A0\uC9DC\uB97C YYYY-MM-DD \uD615\uC2DD\uC73C\uB85C \uC785\uB825\uD574 \uC8FC\uC138\uC694.";
1682
+ const [open, setOpen] = useState7(false);
1683
+ const [touched, setTouched] = useState7(false);
1684
+ const isControlled = "value" in props;
1685
+ const lastEmitted = useRef9(isControlled ? value4 ?? "" : defaultValue ?? "");
1686
+ const minDate = parseISODate(min);
1687
+ const maxDate = parseISODate(max);
1688
+ const toIso = (digits) => digits.length === 8 ? `${digits.slice(0, 4)}-${digits.slice(4, 6)}-${digits.slice(6)}` : "";
1689
+ const isUnavailable = (date2) => minDate !== null && compareDays(date2, minDate) < 0 || maxDate !== null && compareDays(date2, maxDate) > 0 || !!isDateDisabled?.(date2);
1690
+ const emit = (iso) => {
1691
+ if (iso === lastEmitted.current) return;
1692
+ lastEmitted.current = iso;
1693
+ onValueChange?.(iso);
1694
+ };
1695
+ const field3 = useFormattedInput({
1696
+ isControlled: false,
1697
+ value: void 0,
1698
+ defaultValue: (isControlled ? value4 : defaultValue)?.replace(/\D/g, ""),
1699
+ onValueChange: (digits) => {
1700
+ const date2 = parseISODate(toIso(digits));
1701
+ emit(date2 && !isUnavailable(date2) ? toIso(digits) : "");
1702
+ },
1703
+ sanitize: sanitize2,
1704
+ format,
1705
+ isMeaningful: isDigit3,
1706
+ inputRef
1707
+ });
1708
+ const textIso = toIso(field3.raw);
1709
+ const { setRaw } = field3;
1710
+ useEffect6(() => {
1711
+ if (!isControlled) return;
1712
+ const next = value4 ?? "";
1713
+ lastEmitted.current = next;
1714
+ if (next === textIso) return;
1715
+ const textDate = parseISODate(textIso);
1716
+ const textIsValid = textDate !== null && !isUnavailable(textDate);
1717
+ if (next === "" && !textIsValid) return;
1718
+ setRaw(next.replace(/\D/g, ""));
1719
+ }, [value4]);
1720
+ const date = parseISODate(textIso);
1721
+ const complete = field3.raw.length === 8;
1722
+ const autoError = complete ? !date ? invalidText : isUnavailable(date) ? unavailableText : null : touched && field3.raw.length > 0 ? incompleteText : null;
1723
+ const showAuto = autoError !== null && error === void 0;
1724
+ const selectedIso = date && !isUnavailable(date) ? textIso : "";
1725
+ return /* @__PURE__ */ jsxs19(Fragment4, { children: [
1726
+ /* @__PURE__ */ jsx24(
1727
+ TextField,
1728
+ {
1729
+ ref: mergeRefs(ref, inputRef),
1730
+ id,
1731
+ label: label6,
1732
+ placeholder,
1733
+ inputMode: "numeric",
1734
+ autoComplete: "off",
1735
+ value: field3.display,
1736
+ onChange: field3.onChange,
1737
+ onKeyDown: field3.onKeyDown,
1738
+ onBlur: () => setTouched(true),
1739
+ error: error ?? autoError !== null,
1740
+ helperText: showAuto ? autoError : helperText3,
1741
+ required,
1742
+ disabled,
1743
+ fullWidth,
1744
+ rootClassName: className,
1745
+ endAdornment: /* @__PURE__ */ jsx24(
1746
+ Popover2,
1747
+ {
1748
+ open,
1749
+ onOpenChange: setOpen,
1750
+ modal: true,
1751
+ align: "end",
1752
+ "aria-label": m.calendar ?? "\uB2EC\uB825",
1753
+ onOpenAutoFocus: (event) => event.preventDefault(),
1754
+ content: /* @__PURE__ */ jsx24(
1755
+ Calendar,
1756
+ {
1757
+ value: selectedIso,
1758
+ onValueChange: (iso) => {
1759
+ setRaw(iso.replace(/\D/g, ""));
1760
+ emit(iso);
1761
+ setOpen(false);
1762
+ },
1763
+ min,
1764
+ max,
1765
+ isDateDisabled,
1766
+ isHoliday,
1767
+ today,
1768
+ initialFocus: true
1769
+ }
1770
+ ),
1771
+ children: /* @__PURE__ */ jsx24(IconButton, { "aria-label": calendarLabel, size: "sm", disabled, children: /* @__PURE__ */ jsx24(CalendarIcon, {}) })
1772
+ }
1773
+ )
1774
+ }
1775
+ ),
1776
+ name && /* @__PURE__ */ jsx24("input", { type: "hidden", name, value: selectedIso })
1777
+ ] });
1778
+ }
1779
+ );
1780
+
1781
+ // src/components/Divider/Divider.tsx
1782
+ import { forwardRef as forwardRef22 } from "react";
1783
+
1784
+ // src/components/Divider/Divider.css.ts
1785
+ import { createRuntimeFn as _7a46812 } from "@vanilla-extract/recipes/createRuntimeFn";
1786
+ var divider = /* @__PURE__ */ _7a46812({ defaultClassName: "_1t3gq8v0", variantClassNames: { orientation: { horizontal: "_1t3gq8v1", vertical: "_1t3gq8v2" } }, defaultVariants: { orientation: "horizontal" }, compoundVariants: [] });
1787
+ var labeled = "_1t3gq8v3";
1788
+ var line = "_1t3gq8v4";
1789
+
1790
+ // src/components/Divider/Divider.tsx
1791
+ import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
1792
+ var Divider = /* @__PURE__ */ forwardRef22(function Divider2({ orientation = "horizontal", decorative, className, children, ...rest }, ref) {
1793
+ if (children && orientation === "horizontal") {
1794
+ return /* @__PURE__ */ jsxs20("div", { ref, className: cx(labeled, className), ...rest, children: [
1795
+ /* @__PURE__ */ jsx25("span", { className: line, "aria-hidden": true }),
1796
+ children,
1797
+ /* @__PURE__ */ jsx25("span", { className: line, "aria-hidden": true })
1798
+ ] });
1799
+ }
1800
+ const a11y = decorative ? { role: "none" } : { role: "separator", "aria-orientation": orientation === "vertical" ? "vertical" : void 0 };
1801
+ return /* @__PURE__ */ jsx25("div", { ref, className: cx(divider({ orientation }), className), ...a11y, ...rest });
1802
+ });
1803
+
1804
+ // src/components/Drawer/Drawer.tsx
1805
+ import * as Dialog2 from "@radix-ui/react-dialog";
1806
+ import { XIcon as XIcon4 } from "@bestow-ui/icons";
1807
+
1808
+ // src/components/Drawer/Drawer.css.ts
1809
+ import { createRuntimeFn as _7a46813 } from "@vanilla-extract/recipes/createRuntimeFn";
1810
+ var body3 = "nmobyvy";
1811
+ var closeButton4 = "nmobyvx";
1812
+ var content8 = /* @__PURE__ */ _7a46813({ defaultClassName: "nmobyv9", variantClassNames: { side: { right: "nmobyva", left: "nmobyvb", top: "nmobyvc", bottom: "nmobyvd" }, size: { sm: "nmobyve", md: "nmobyvf", lg: "nmobyvg" } }, defaultVariants: { side: "right", size: "md" }, compoundVariants: [[{ side: "right", size: "sm" }, "nmobyvh"], [{ side: "right", size: "md" }, "nmobyvi"], [{ side: "right", size: "lg" }, "nmobyvj"], [{ side: "left", size: "sm" }, "nmobyvk"], [{ side: "left", size: "md" }, "nmobyvl"], [{ side: "left", size: "lg" }, "nmobyvm"], [{ side: "top", size: "sm" }, "nmobyvn"], [{ side: "top", size: "md" }, "nmobyvo"], [{ side: "top", size: "lg" }, "nmobyvp"], [{ side: "bottom", size: "sm" }, "nmobyvq"], [{ side: "bottom", size: "md" }, "nmobyvr"], [{ side: "bottom", size: "lg" }, "nmobyvs"]] });
1813
+ var description3 = "nmobyvw";
1814
+ var footer3 = "nmobyvz";
1815
+ var header6 = "nmobyvt";
1816
+ var headings2 = "nmobyvu";
1817
+ var overlay2 = "nmobyv0";
1818
+ var title4 = "nmobyvv";
1819
+
1820
+ // src/components/Drawer/Drawer.tsx
1821
+ import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
1822
+ function Drawer({
1823
+ open,
1824
+ defaultOpen,
1825
+ onOpenChange,
1826
+ trigger: trigger4,
1827
+ title: title6,
1828
+ description: description6,
1829
+ children,
1830
+ footer: footer6,
1831
+ side,
1832
+ size,
1833
+ hideCloseButton = false,
1834
+ closeOnOverlayClick = true,
1835
+ className
1836
+ }) {
1837
+ const portal2 = usePortalProps();
1838
+ const m = useMessages();
1839
+ const focus = useReturnFocus(Boolean(trigger4));
1840
+ return /* @__PURE__ */ jsxs21(Dialog2.Root, { open, defaultOpen, onOpenChange, children: [
1841
+ trigger4 && /* @__PURE__ */ jsx26(Dialog2.Trigger, { asChild: true, children: trigger4 }),
1842
+ /* @__PURE__ */ jsxs21(Dialog2.Portal, { children: [
1843
+ /* @__PURE__ */ jsx26(Dialog2.Overlay, { className: cx(portal2.className, overlay2), style: portal2.style }),
1844
+ /* @__PURE__ */ jsxs21(
1845
+ Dialog2.Content,
1846
+ {
1847
+ className: cx(portal2.className, content8({ side, size }), className),
1848
+ style: portal2.style,
1849
+ "data-side": side ?? "right",
1850
+ onPointerDownOutside: closeOnOverlayClick ? void 0 : (event) => event.preventDefault(),
1851
+ onOpenAutoFocus: focus.onOpenAutoFocus,
1852
+ onCloseAutoFocus: focus.onCloseAutoFocus,
1853
+ ...description6 ? {} : { "aria-describedby": void 0 },
1854
+ children: [
1855
+ /* @__PURE__ */ jsxs21("div", { className: header6, children: [
1856
+ /* @__PURE__ */ jsxs21("div", { className: headings2, children: [
1857
+ /* @__PURE__ */ jsx26(Dialog2.Title, { className: title4, children: title6 }),
1858
+ description6 && /* @__PURE__ */ jsx26(Dialog2.Description, { className: description3, children: description6 })
1859
+ ] }),
1860
+ !hideCloseButton && /* @__PURE__ */ jsx26(Dialog2.Close, { asChild: true, children: /* @__PURE__ */ jsx26(IconButton, { "aria-label": m.close ?? "\uB2EB\uAE30", size: "sm", className: closeButton4, children: /* @__PURE__ */ jsx26(XIcon4, {}) }) })
1861
+ ] }),
1862
+ children && /* @__PURE__ */ jsx26("div", { className: body3, children }),
1863
+ footer6 && /* @__PURE__ */ jsx26("div", { className: footer3, children: footer6 })
1864
+ ]
1865
+ }
1866
+ )
1867
+ ] })
1868
+ ] });
1869
+ }
1870
+ var DrawerClose = Dialog2.Close;
1871
+
1872
+ // src/components/DropdownMenu/DropdownMenu.tsx
1873
+ import * as RadixMenu from "@radix-ui/react-dropdown-menu";
1874
+ import { forwardRef as forwardRef23 } from "react";
1875
+
1876
+ // src/components/DropdownMenu/DropdownMenu.css.ts
1877
+ var content9 = "_1d7ahux0";
1878
+ var danger = "_1d7ahux2";
1879
+ var icon5 = "_1d7ahux3";
1880
+ var item5 = "_1d7ahux1";
1881
+ var label2 = "_1d7ahux5";
1882
+ var separator2 = "_1d7ahux6";
1883
+ var shortcut = "_1d7ahux4";
1884
+
1885
+ // src/components/DropdownMenu/DropdownMenu.tsx
1886
+ import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
1887
+ var DropdownMenu = RadixMenu.Root;
1888
+ var DropdownMenuTrigger = RadixMenu.Trigger;
1889
+ var DropdownMenuGroup = RadixMenu.Group;
1890
+ var DropdownMenuContent = /* @__PURE__ */ forwardRef23(
1891
+ function DropdownMenuContent2({ className, style, side = "bottom", align = "start", sideOffset = 4, collisionPadding = 8, ...rest }, ref) {
1892
+ const portal2 = usePortalProps();
1893
+ return /* @__PURE__ */ jsx27(RadixMenu.Portal, { children: /* @__PURE__ */ jsx27(
1894
+ RadixMenu.Content,
1895
+ {
1896
+ ref,
1897
+ side,
1898
+ align,
1899
+ sideOffset,
1900
+ collisionPadding,
1901
+ className: cx(portal2.className, content9, className),
1902
+ style: { ...portal2.style, ...style },
1903
+ ...rest
1904
+ }
1905
+ ) });
1906
+ }
1907
+ );
1908
+ var DropdownMenuItem = /* @__PURE__ */ forwardRef23(
1909
+ function DropdownMenuItem2({ icon: icon6, shortcut: shortcut2, color = "neutral", className, children, ...rest }, ref) {
1910
+ return /* @__PURE__ */ jsxs22(RadixMenu.Item, { ref, className: cx(item5, color === "danger" && danger, className), ...rest, children: [
1911
+ icon6 && /* @__PURE__ */ jsx27("span", { className: icon5, "aria-hidden": true, children: icon6 }),
1912
+ children,
1913
+ shortcut2 && /* @__PURE__ */ jsx27("span", { className: shortcut, "aria-hidden": true, children: shortcut2 })
1914
+ ] });
1915
+ }
1916
+ );
1917
+ var DropdownMenuLabel = /* @__PURE__ */ forwardRef23(
1918
+ function DropdownMenuLabel2({ className, ...rest }, ref) {
1919
+ return /* @__PURE__ */ jsx27(RadixMenu.Label, { ref, className: cx(label2, className), ...rest });
1920
+ }
1921
+ );
1922
+ var DropdownMenuSeparator = /* @__PURE__ */ forwardRef23(
1923
+ function DropdownMenuSeparator2({ className, ...rest }, ref) {
1924
+ return /* @__PURE__ */ jsx27(RadixMenu.Separator, { ref, className: cx(separator2, className), ...rest });
1925
+ }
1926
+ );
1927
+
1928
+ // src/components/Pagination/Pagination.tsx
1929
+ import { ChevronLeftIcon as ChevronLeftIcon2, ChevronRightIcon as ChevronRightIcon3 } from "@bestow-ui/icons";
1930
+ import { forwardRef as forwardRef24, useState as useState8 } from "react";
1931
+
1932
+ // src/components/Pagination/getPaginationItems.ts
1933
+ var range = (start, end) => end < start ? [] : Array.from({ length: end - start + 1 }, (_, i) => start + i);
1934
+ function getPaginationItems(page, totalPages, siblingCount = 1, boundaryCount = 1) {
1935
+ if (totalPages < 1) return [];
1936
+ const startPages = range(1, Math.min(boundaryCount, totalPages));
1937
+ const endPages = range(Math.max(totalPages - boundaryCount + 1, boundaryCount + 1), totalPages);
1938
+ const siblingsStart = Math.max(
1939
+ Math.min(page - siblingCount, totalPages - boundaryCount - siblingCount * 2 - 1),
1940
+ boundaryCount + 2
1941
+ );
1942
+ const siblingsEnd = Math.min(
1943
+ Math.max(page + siblingCount, boundaryCount + siblingCount * 2 + 2),
1944
+ endPages.length > 0 ? endPages[0] - 2 : totalPages - 1
1945
+ );
1946
+ const items2 = [...startPages];
1947
+ if (siblingsStart > boundaryCount + 2) items2.push("ellipsis-start");
1948
+ else if (boundaryCount + 1 < totalPages - boundaryCount) items2.push(boundaryCount + 1);
1949
+ items2.push(...range(siblingsStart, siblingsEnd));
1950
+ if (siblingsEnd < totalPages - boundaryCount - 1) items2.push("ellipsis-end");
1951
+ else if (totalPages - boundaryCount > boundaryCount) items2.push(totalPages - boundaryCount);
1952
+ items2.push(...endPages);
1953
+ return items2;
1954
+ }
1955
+
1956
+ // src/components/Pagination/Pagination.css.ts
1957
+ import { createRuntimeFn as _7a46814 } from "@vanilla-extract/recipes/createRuntimeFn";
1958
+ var ellipsis = "_1iraoak4";
1959
+ var item6 = /* @__PURE__ */ _7a46814({ defaultClassName: "_1iraoak1", variantClassNames: { size: { sm: "_1iraoak2", md: "_1iraoak3" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
1960
+ var list3 = "_1iraoak0";
1961
+
1962
+ // src/components/Pagination/Pagination.tsx
1963
+ import { jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
1964
+ var Pagination = /* @__PURE__ */ forwardRef24(function Pagination2({
1965
+ totalPages,
1966
+ page: pageProp,
1967
+ defaultPage = 1,
1968
+ onPageChange,
1969
+ siblingCount = 1,
1970
+ boundaryCount = 1,
1971
+ size,
1972
+ getItemLabel: getItemLabelProp,
1973
+ className,
1974
+ "aria-label": ariaLabelProp,
1975
+ ...rest
1976
+ }, ref) {
1977
+ const [uncontrolledPage, setUncontrolledPage] = useState8(defaultPage);
1978
+ const m = useMessages();
1979
+ const ariaLabel = ariaLabelProp ?? m.pagination ?? "\uD398\uC774\uC9C0 \uD0D0\uC0C9";
1980
+ const getItemLabel = getItemLabelProp ?? ((type, n) => type === "previous" ? m.paginationPrevious ?? "\uC774\uC804 \uD398\uC774\uC9C0" : type === "next" ? m.paginationNext ?? "\uB2E4\uC74C \uD398\uC774\uC9C0" : m.paginationPage?.(n) ?? `${n} \uD398\uC774\uC9C0`);
1981
+ if (totalPages < 1) return null;
1982
+ const page = Math.min(Math.max(pageProp ?? uncontrolledPage, 1), totalPages);
1983
+ const goTo = (next) => {
1984
+ if (next === page || next < 1 || next > totalPages) return;
1985
+ if (pageProp === void 0) setUncontrolledPage(next);
1986
+ onPageChange?.(next);
1987
+ };
1988
+ const itemClass = item6({ size });
1989
+ return /* @__PURE__ */ jsx28("nav", { ref, "aria-label": ariaLabel, className, ...rest, children: /* @__PURE__ */ jsxs23("ul", { className: list3, children: [
1990
+ /* @__PURE__ */ jsx28("li", { children: /* @__PURE__ */ jsx28(
1991
+ "button",
1992
+ {
1993
+ type: "button",
1994
+ className: itemClass,
1995
+ "aria-label": getItemLabel("previous", page - 1),
1996
+ disabled: page <= 1,
1997
+ onClick: () => goTo(page - 1),
1998
+ children: /* @__PURE__ */ jsx28(ChevronLeftIcon2, { size: 16 })
1999
+ }
2000
+ ) }),
2001
+ getPaginationItems(page, totalPages, siblingCount, boundaryCount).map(
2002
+ (item7) => typeof item7 === "number" ? /* @__PURE__ */ jsx28("li", { children: /* @__PURE__ */ jsx28(
2003
+ "button",
2004
+ {
2005
+ type: "button",
2006
+ className: itemClass,
2007
+ "aria-label": getItemLabel("page", item7),
2008
+ "aria-current": item7 === page ? "page" : void 0,
2009
+ onClick: () => goTo(item7),
2010
+ children: item7
2011
+ }
2012
+ ) }, item7) : /* @__PURE__ */ jsx28("li", { "aria-hidden": true, className: cx(itemClass, ellipsis), children: "\u2026" }, item7)
2013
+ ),
2014
+ /* @__PURE__ */ jsx28("li", { children: /* @__PURE__ */ jsx28(
2015
+ "button",
2016
+ {
2017
+ type: "button",
2018
+ className: itemClass,
2019
+ "aria-label": getItemLabel("next", page + 1),
2020
+ disabled: page >= totalPages,
2021
+ onClick: () => goTo(page + 1),
2022
+ children: /* @__PURE__ */ jsx28(ChevronRightIcon3, { size: 16 })
2023
+ }
2024
+ ) })
2025
+ ] }) });
2026
+ });
2027
+
2028
+ // src/components/PhoneNumberInput/PhoneNumberInput.tsx
2029
+ import { forwardRef as forwardRef25, useRef as useRef10 } from "react";
2030
+ import { jsx as jsx29 } from "react/jsx-runtime";
2031
+ var sanitize3 = (input5) => {
2032
+ const digits = input5.replace(/\D/g, "");
2033
+ return digits.slice(0, phoneNumberMaxDigits(digits));
2034
+ };
2035
+ var isDigit4 = (char) => /\d/.test(char);
2036
+ var PhoneNumberInput = /* @__PURE__ */ forwardRef25(
2037
+ function PhoneNumberInput2(props, ref) {
2038
+ const {
2039
+ value: value4,
2040
+ defaultValue,
2041
+ onValueChange,
2042
+ label: labelProp,
2043
+ placeholder = "010-0000-0000",
2044
+ onKeyDown,
2045
+ ...rest
2046
+ } = props;
2047
+ const inputRef = useRef10(null);
2048
+ const m = useMessages();
2049
+ const label6 = labelProp ?? m.phoneNumber ?? "\uD734\uB300\uD3F0 \uBC88\uD638";
2050
+ const field3 = useFormattedInput({
2051
+ isControlled: "value" in props,
2052
+ value: value4,
2053
+ defaultValue,
2054
+ onValueChange,
2055
+ sanitize: sanitize3,
2056
+ format: formatPhoneNumber,
2057
+ isMeaningful: isDigit4,
2058
+ inputRef
2059
+ });
2060
+ return /* @__PURE__ */ jsx29(
2061
+ TextField,
2062
+ {
2063
+ ref: mergeRefs(ref, inputRef),
2064
+ label: label6,
2065
+ placeholder,
2066
+ type: "tel",
2067
+ inputMode: "tel",
2068
+ autoComplete: "tel-national",
2069
+ value: field3.display,
2070
+ onChange: field3.onChange,
2071
+ onKeyDown: (event) => {
2072
+ field3.onKeyDown(event);
2073
+ onKeyDown?.(event);
2074
+ },
2075
+ ...rest
2076
+ }
2077
+ );
2078
+ }
2079
+ );
2080
+
2081
+ // src/components/Progress/Progress.tsx
2082
+ import { forwardRef as forwardRef26, useId as useId7 } from "react";
2083
+
2084
+ // src/components/Progress/Progress.css.ts
2085
+ import { createRuntimeFn as _7a46815 } from "@vanilla-extract/recipes/createRuntimeFn";
2086
+ var header7 = "_1tvkq001";
2087
+ var indicator = /* @__PURE__ */ _7a46815({ defaultClassName: "_1tvkq008", variantClassNames: { color: { primary: "_1tvkq009", neutral: "_1tvkq00a", success: "_1tvkq00b", warning: "_1tvkq00c", danger: "_1tvkq00d" } }, defaultVariants: { color: "primary" }, compoundVariants: [] });
2088
+ var label3 = "_1tvkq002";
2089
+ var root7 = "_1tvkq000";
2090
+ var track = /* @__PURE__ */ _7a46815({ defaultClassName: "_1tvkq004", variantClassNames: { size: { sm: "_1tvkq005", md: "_1tvkq006", lg: "_1tvkq007" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2091
+ var value2 = "_1tvkq003";
2092
+
2093
+ // src/components/Progress/Progress.tsx
2094
+ import { jsx as jsx30, jsxs as jsxs24 } from "react/jsx-runtime";
2095
+ var defaultFormat = (value4, max) => `${Math.round(value4 / max * 100)}%`;
2096
+ var Progress = /* @__PURE__ */ forwardRef26(function Progress2({
2097
+ value: value4,
2098
+ max = 100,
2099
+ label: label6,
2100
+ "aria-label": ariaLabel,
2101
+ showValue,
2102
+ formatValue = defaultFormat,
2103
+ size,
2104
+ color,
2105
+ className,
2106
+ ...rest
2107
+ }, ref) {
2108
+ const labelId = useId7();
2109
+ const isIndeterminate = value4 === void 0 || value4 === null;
2110
+ const safeMax = max > 0 ? max : 100;
2111
+ const clamped = isIndeterminate ? 0 : Math.min(safeMax, Math.max(0, value4));
2112
+ const valueText = isIndeterminate ? void 0 : formatValue(clamped, safeMax);
2113
+ return /* @__PURE__ */ jsxs24("div", { ref, className: cx(root7, className), ...rest, children: [
2114
+ (label6 || showValue && valueText) && /* @__PURE__ */ jsxs24("div", { className: header7, children: [
2115
+ label6 && /* @__PURE__ */ jsx30("span", { id: labelId, className: label3, children: label6 }),
2116
+ showValue && valueText && /* @__PURE__ */ jsx30("span", { className: value2, "aria-hidden": true, children: valueText })
2117
+ ] }),
2118
+ /* @__PURE__ */ jsx30(
2119
+ "div",
2120
+ {
2121
+ role: "progressbar",
2122
+ "aria-labelledby": label6 ? labelId : void 0,
2123
+ "aria-label": label6 ? void 0 : ariaLabel,
2124
+ "aria-valuemin": 0,
2125
+ "aria-valuemax": safeMax,
2126
+ "aria-valuenow": isIndeterminate ? void 0 : clamped,
2127
+ "aria-valuetext": valueText,
2128
+ className: track({ size }),
2129
+ children: /* @__PURE__ */ jsx30(
2130
+ "div",
2131
+ {
2132
+ className: indicator({ color }),
2133
+ "data-state": isIndeterminate ? "indeterminate" : clamped >= safeMax ? "complete" : "loading",
2134
+ style: isIndeterminate ? void 0 : { width: `${clamped / safeMax * 100}%` }
2135
+ }
2136
+ )
2137
+ }
2138
+ )
2139
+ ] });
2140
+ });
2141
+
2142
+ // src/components/RadioGroup/RadioGroup.tsx
2143
+ import * as RadixRadioGroup from "@radix-ui/react-radio-group";
2144
+ import { forwardRef as forwardRef27, useId as useId8 } from "react";
2145
+
2146
+ // src/components/RadioGroup/RadioGroup.css.ts
2147
+ import { createRuntimeFn as _7a46816 } from "@vanilla-extract/recipes/createRuntimeFn";
2148
+ var description4 = "_1w9iwjmd";
2149
+ var groupLabel = "_1w9iwjme";
2150
+ var indicator2 = "_1w9iwjma";
2151
+ var items = /* @__PURE__ */ _7a46816({ defaultClassName: "_1w9iwjm0", variantClassNames: { orientation: { vertical: "_1w9iwjm1", horizontal: "_1w9iwjm2" } }, defaultVariants: { orientation: "vertical" }, compoundVariants: [] });
2152
+ var labelText = "_1w9iwjmc";
2153
+ var option = /* @__PURE__ */ _7a46816({ defaultClassName: "_1w9iwjm3", variantClassNames: { size: { sm: "_1w9iwjm4", md: "_1w9iwjm5" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2154
+ var radio = /* @__PURE__ */ _7a46816({ defaultClassName: "_1w9iwjm7", variantClassNames: { size: { sm: "_1w9iwjm8", md: "_1w9iwjm9" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2155
+ var text = "_1w9iwjmb";
2156
+
2157
+ // src/components/RadioGroup/RadioGroup.tsx
2158
+ import { jsx as jsx31, jsxs as jsxs25 } from "react/jsx-runtime";
2159
+ var RadioGroup = /* @__PURE__ */ forwardRef27(function RadioGroup2(props, ref) {
2160
+ const {
2161
+ options,
2162
+ value: value4,
2163
+ defaultValue,
2164
+ onValueChange,
2165
+ label: label6,
2166
+ helperText: helperText3,
2167
+ error,
2168
+ orientation = "vertical",
2169
+ size,
2170
+ disabled,
2171
+ required,
2172
+ name,
2173
+ id,
2174
+ "aria-label": ariaLabel,
2175
+ className
2176
+ } = props;
2177
+ const isControlled = "value" in props;
2178
+ const generatedId = useId8();
2179
+ const baseId = id ?? generatedId;
2180
+ const labelId = label6 ? `${baseId}-label` : void 0;
2181
+ const helperId = helperText3 ? `${baseId}-helper` : void 0;
2182
+ return /* @__PURE__ */ jsxs25("div", { className: cx(field, className), children: [
2183
+ label6 && /* @__PURE__ */ jsxs25("span", { id: labelId, className: cx(label, groupLabel), children: [
2184
+ label6,
2185
+ required && /* @__PURE__ */ jsx31("span", { className: requiredMark, "aria-hidden": true, children: "*" })
2186
+ ] }),
2187
+ /* @__PURE__ */ jsx31(
2188
+ RadixRadioGroup.Root,
2189
+ {
2190
+ ref,
2191
+ id: baseId,
2192
+ value: isControlled ? value4 ?? "" : void 0,
2193
+ defaultValue,
2194
+ onValueChange,
2195
+ orientation,
2196
+ disabled,
2197
+ required,
2198
+ name,
2199
+ "aria-label": ariaLabel,
2200
+ "aria-labelledby": labelId,
2201
+ "aria-describedby": helperId,
2202
+ "aria-invalid": error || void 0,
2203
+ className: items({ orientation }),
2204
+ children: options.map((option2) => {
2205
+ const itemId = `${baseId}-${option2.value}`;
2206
+ const descriptionId = option2.description ? `${itemId}-description` : void 0;
2207
+ const itemDisabled = disabled || option2.disabled;
2208
+ return /* @__PURE__ */ jsxs25("div", { className: option({ size }), "data-disabled": itemDisabled || void 0, children: [
2209
+ /* @__PURE__ */ jsx31(
2210
+ RadixRadioGroup.Item,
2211
+ {
2212
+ id: itemId,
2213
+ value: option2.value,
2214
+ disabled: option2.disabled,
2215
+ "aria-describedby": descriptionId,
2216
+ className: radio({ size }),
2217
+ children: /* @__PURE__ */ jsx31(RadixRadioGroup.Indicator, { className: indicator2 })
2218
+ }
2219
+ ),
2220
+ /* @__PURE__ */ jsxs25("span", { className: text, children: [
2221
+ /* @__PURE__ */ jsx31("label", { htmlFor: itemId, className: labelText, children: option2.label }),
2222
+ option2.description && /* @__PURE__ */ jsx31("span", { id: descriptionId, className: description4, children: option2.description })
2223
+ ] })
2224
+ ] }, option2.value);
2225
+ })
2226
+ }
2227
+ ),
2228
+ helperText3 && /* @__PURE__ */ jsx31("p", { id: helperId, className: helperText({ error }), children: helperText3 })
2229
+ ] });
2230
+ });
2231
+
2232
+ // src/components/Select/Select.tsx
2233
+ import * as RadixSelect from "@radix-ui/react-select";
2234
+ import { forwardRef as forwardRef28, useId as useId9 } from "react";
2235
+ import { CheckIcon as CheckIcon2, ChevronDownIcon as ChevronDownIcon4 } from "@bestow-ui/icons";
2236
+ import { jsx as jsx32, jsxs as jsxs26 } from "react/jsx-runtime";
2237
+ var Select = /* @__PURE__ */ forwardRef28(function Select2(props, ref) {
2238
+ const {
2239
+ options,
2240
+ value: value4,
2241
+ defaultValue,
2242
+ onValueChange,
2243
+ placeholder,
2244
+ label: label6,
2245
+ helperText: helperText3,
2246
+ error,
2247
+ size,
2248
+ fullWidth,
2249
+ disabled,
2250
+ required,
2251
+ name,
2252
+ id,
2253
+ "aria-label": ariaLabel,
2254
+ className
2255
+ } = props;
2256
+ const isControlled = "value" in props;
2257
+ const generatedId = useId9();
2258
+ const triggerId = id ?? generatedId;
2259
+ const helperId = helperText3 ? `${triggerId}-helper` : void 0;
2260
+ const portal2 = usePortalProps();
2261
+ return /* @__PURE__ */ jsxs26("div", { className: cx(field, fullWidth && fieldFullWidth), children: [
2262
+ label6 && /* @__PURE__ */ jsxs26("label", { htmlFor: triggerId, className: label, children: [
2263
+ label6,
2264
+ required && /* @__PURE__ */ jsx32("span", { className: requiredMark, "aria-hidden": true, children: "*" })
2265
+ ] }),
2266
+ /* @__PURE__ */ jsxs26(
2267
+ RadixSelect.Root,
2268
+ {
2269
+ value: isControlled ? value4 ?? "" : void 0,
2270
+ defaultValue,
2271
+ onValueChange,
2272
+ disabled,
2273
+ required,
2274
+ name,
2275
+ children: [
2276
+ /* @__PURE__ */ jsxs26(
2277
+ RadixSelect.Trigger,
2278
+ {
2279
+ ref,
2280
+ id: triggerId,
2281
+ "aria-label": ariaLabel,
2282
+ "aria-invalid": error || void 0,
2283
+ "aria-describedby": helperId,
2284
+ "data-invalid": error || void 0,
2285
+ className: cx(root3({ size, fullWidth }), trigger2, className),
2286
+ children: [
2287
+ /* @__PURE__ */ jsx32("span", { className: value, children: /* @__PURE__ */ jsx32(RadixSelect.Value, { placeholder }) }),
2288
+ /* @__PURE__ */ jsx32(RadixSelect.Icon, { className: icon4, children: /* @__PURE__ */ jsx32(ChevronDownIcon4, { size: 16 }) })
2289
+ ]
2290
+ }
2291
+ ),
2292
+ /* @__PURE__ */ jsx32(RadixSelect.Portal, { children: /* @__PURE__ */ jsx32(
2293
+ RadixSelect.Content,
2294
+ {
2295
+ position: "popper",
2296
+ sideOffset: 4,
2297
+ collisionPadding: 8,
2298
+ className: cx(portal2.className, content5),
2299
+ style: portal2.style,
2300
+ children: /* @__PURE__ */ jsx32(RadixSelect.Viewport, { className: viewport, children: options.map((option2) => /* @__PURE__ */ jsxs26(
2301
+ RadixSelect.Item,
2302
+ {
2303
+ value: option2.value,
2304
+ disabled: option2.disabled,
2305
+ className: item4,
2306
+ children: [
2307
+ /* @__PURE__ */ jsx32(RadixSelect.ItemText, { children: option2.label }),
2308
+ /* @__PURE__ */ jsx32(RadixSelect.ItemIndicator, { className: itemIndicator, children: /* @__PURE__ */ jsx32(CheckIcon2, { size: 16 }) })
2309
+ ]
2310
+ },
2311
+ option2.value
2312
+ )) })
2313
+ }
2314
+ ) })
2315
+ ]
2316
+ }
2317
+ ),
2318
+ helperText3 && /* @__PURE__ */ jsx32("p", { id: helperId, className: helperText({ error }), children: helperText3 })
2319
+ ] });
2320
+ });
2321
+
2322
+ // src/components/Skeleton/Skeleton.tsx
2323
+ import { assignInlineVars } from "@vanilla-extract/dynamic";
2324
+ import { forwardRef as forwardRef29 } from "react";
2325
+
2326
+ // src/components/Skeleton/Skeleton.css.ts
2327
+ import { createRuntimeFn as _7a46817 } from "@vanilla-extract/recipes/createRuntimeFn";
2328
+ var height = "var(--_1s8datd1)";
2329
+ var lines = "_1s8datd6";
2330
+ var skeleton = /* @__PURE__ */ _7a46817({ defaultClassName: "_1s8datd2", variantClassNames: { variant: { text: "_1s8datd3", rect: "_1s8datd4", circle: "_1s8datd5" } }, defaultVariants: { variant: "text" }, compoundVariants: [] });
2331
+ var width = "var(--_1s8datd0)";
2332
+
2333
+ // src/components/Skeleton/Skeleton.tsx
2334
+ import { jsx as jsx33 } from "react/jsx-runtime";
2335
+ var toCss = (value4) => typeof value4 === "number" ? `${value4}px` : value4;
2336
+ var Skeleton = /* @__PURE__ */ forwardRef29(function Skeleton2({ variant = "text", width: width2, height: height2, lines: lines2 = 1, className, style, ...rest }, ref) {
2337
+ const w = toCss(width2 ?? (variant === "circle" ? 40 : "100%"));
2338
+ const h = toCss(height2 ?? (variant === "circle" ? w : variant === "rect" ? 100 : "1em"));
2339
+ if (variant === "text" && lines2 > 1) {
2340
+ return /* @__PURE__ */ jsx33(
2341
+ "span",
2342
+ {
2343
+ ref,
2344
+ "aria-hidden": true,
2345
+ className: cx(lines, className),
2346
+ style: { ...assignInlineVars({ [width]: w }), ...style },
2347
+ ...rest,
2348
+ children: Array.from({ length: lines2 }, (_, i) => /* @__PURE__ */ jsx33(
2349
+ "span",
2350
+ {
2351
+ className: skeleton({ variant }),
2352
+ style: assignInlineVars({ [width]: i === lines2 - 1 ? "60%" : "100%", [height]: h })
2353
+ },
2354
+ i
2355
+ ))
2356
+ }
2357
+ );
2358
+ }
2359
+ return /* @__PURE__ */ jsx33(
2360
+ "span",
2361
+ {
2362
+ ref,
2363
+ "aria-hidden": true,
2364
+ className: cx(skeleton({ variant }), className),
2365
+ style: { ...assignInlineVars({ [width]: w, [height]: h }), ...style },
2366
+ ...rest
2367
+ }
2368
+ );
2369
+ });
2370
+
2371
+ // src/components/Slider/Slider.tsx
2372
+ import * as RadixSlider from "@radix-ui/react-slider";
2373
+ import { forwardRef as forwardRef30, useId as useId10, useState as useState9 } from "react";
2374
+
2375
+ // src/components/Slider/Slider.css.ts
2376
+ import { createRuntimeFn as _7a46818 } from "@vanilla-extract/recipes/createRuntimeFn";
2377
+ var field2 = "_126mzjm0";
2378
+ var header8 = "_126mzjm1";
2379
+ var helperText2 = "_126mzjm4";
2380
+ var label4 = "_126mzjm2";
2381
+ var range2 = "_126mzjmb";
2382
+ var root8 = /* @__PURE__ */ _7a46818({ defaultClassName: "_126mzjm5", variantClassNames: { size: { sm: "_126mzjm6", md: "_126mzjm7" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2383
+ var thumb = /* @__PURE__ */ _7a46818({ defaultClassName: "_126mzjmc", variantClassNames: { size: { sm: "_126mzjmd", md: "_126mzjme" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2384
+ var track2 = /* @__PURE__ */ _7a46818({ defaultClassName: "_126mzjm8", variantClassNames: { size: { sm: "_126mzjm9", md: "_126mzjma" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2385
+ var value3 = "_126mzjm3";
2386
+
2387
+ // src/components/Slider/Slider.tsx
2388
+ import { jsx as jsx34, jsxs as jsxs27 } from "react/jsx-runtime";
2389
+ var Slider = /* @__PURE__ */ forwardRef30(function Slider2(props, ref) {
2390
+ const {
2391
+ value: value4,
2392
+ defaultValue,
2393
+ onValueChange,
2394
+ min = 0,
2395
+ max = 100,
2396
+ label: label6,
2397
+ "aria-label": ariaLabel,
2398
+ helperText: helperText3,
2399
+ showValue,
2400
+ formatValue = String,
2401
+ thumbLabels: thumbLabelsProp,
2402
+ size,
2403
+ id,
2404
+ className,
2405
+ disabled,
2406
+ ...rest
2407
+ } = props;
2408
+ const m = useMessages();
2409
+ const thumbLabels = thumbLabelsProp ?? [m.rangeStart ?? "\uCD5C\uC18C", m.rangeEnd ?? "\uCD5C\uB300"];
2410
+ const generatedId = useId10();
2411
+ const baseId = id ?? generatedId;
2412
+ const labelId = `${baseId}-label`;
2413
+ const helperId = `${baseId}-helper`;
2414
+ const isControlled = "value" in props;
2415
+ const [innerValue, setInnerValue] = useState9(defaultValue ?? [min]);
2416
+ const current2 = isControlled ? value4 ?? [min] : innerValue;
2417
+ const isRange = current2.length > 1;
2418
+ const handleChange = (next) => {
2419
+ if (!isControlled) setInnerValue(next);
2420
+ onValueChange?.(next);
2421
+ };
2422
+ const valueText = current2.map(formatValue).join(" \u2013 ");
2423
+ return /* @__PURE__ */ jsxs27("div", { className: cx(field2, className), children: [
2424
+ (label6 || showValue) && /* @__PURE__ */ jsxs27("div", { className: header8, children: [
2425
+ label6 && /* @__PURE__ */ jsx34("span", { id: labelId, className: label4, children: label6 }),
2426
+ showValue && /* @__PURE__ */ jsx34("span", { className: value3, "aria-hidden": true, children: valueText })
2427
+ ] }),
2428
+ /* @__PURE__ */ jsxs27(
2429
+ RadixSlider.Root,
2430
+ {
2431
+ ref,
2432
+ id: baseId,
2433
+ min,
2434
+ max,
2435
+ disabled,
2436
+ value: current2,
2437
+ onValueChange: handleChange,
2438
+ className: root8({ size }),
2439
+ ...rest,
2440
+ children: [
2441
+ /* @__PURE__ */ jsx34(RadixSlider.Track, { className: track2({ size }), children: /* @__PURE__ */ jsx34(RadixSlider.Range, { className: range2 }) }),
2442
+ current2.map((thumbValue, index) => {
2443
+ const thumbLabelId = `${baseId}-thumb-${index}`;
2444
+ return /* @__PURE__ */ jsx34(
2445
+ RadixSlider.Thumb,
2446
+ {
2447
+ className: thumb({ size }),
2448
+ "aria-labelledby": label6 ? isRange ? `${labelId} ${thumbLabelId}` : labelId : isRange ? thumbLabelId : void 0,
2449
+ "aria-label": label6 ? void 0 : isRange ? void 0 : ariaLabel,
2450
+ "aria-valuetext": formatValue(thumbValue),
2451
+ "aria-describedby": helperText3 ? helperId : void 0
2452
+ },
2453
+ index
2454
+ );
2455
+ })
2456
+ ]
2457
+ }
2458
+ ),
2459
+ isRange && current2.map((_, index) => /* @__PURE__ */ jsxs27("span", { id: `${baseId}-thumb-${index}`, hidden: true, children: [
2460
+ label6 ? "" : ariaLabel ? `${ariaLabel} ` : "",
2461
+ thumbLabels[index] ?? `${index + 1}`
2462
+ ] }, index)),
2463
+ helperText3 && /* @__PURE__ */ jsx34("span", { id: helperId, className: helperText2, children: helperText3 })
2464
+ ] });
2465
+ });
2466
+
2467
+ // src/components/Stack/Stack.tsx
2468
+ import { forwardRef as forwardRef31 } from "react";
2469
+
2470
+ // src/components/Stack/Stack.css.ts
2471
+ import { createRuntimeFn as _7a46819 } from "@vanilla-extract/recipes/createRuntimeFn";
2472
+ var stack = /* @__PURE__ */ _7a46819({ defaultClassName: "_1jz9hj90", variantClassNames: { direction: { row: "_1jz9hj91", column: "_1jz9hj92", "row-reverse": "_1jz9hj93", "column-reverse": "_1jz9hj94" }, gap: { "0": "_1jz9hj95", "1": "_1jz9hj96", "2": "_1jz9hj97", "3": "_1jz9hj98", "4": "_1jz9hj99", "5": "_1jz9hj9a", "6": "_1jz9hj9b", "8": "_1jz9hj9c", "10": "_1jz9hj9d", "12": "_1jz9hj9e", "16": "_1jz9hj9f" }, align: { start: "_1jz9hj9g", center: "_1jz9hj9h", end: "_1jz9hj9i", stretch: "_1jz9hj9j", baseline: "_1jz9hj9k" }, justify: { start: "_1jz9hj9l", center: "_1jz9hj9m", end: "_1jz9hj9n", between: "_1jz9hj9o", around: "_1jz9hj9p", evenly: "_1jz9hj9q" }, wrap: { true: "_1jz9hj9r" } }, defaultVariants: { direction: "column" }, compoundVariants: [] });
2473
+
2474
+ // src/components/Stack/Stack.tsx
2475
+ import { jsx as jsx35 } from "react/jsx-runtime";
2476
+ var Stack = /* @__PURE__ */ forwardRef31(function Stack2({ as: Component = "div", direction, gap, align, justify, wrap, className, ...rest }, ref) {
2477
+ return /* @__PURE__ */ jsx35(Component, { ref, className: cx(stack({ direction, gap, align, justify, wrap }), className), ...rest });
2478
+ });
2479
+
2480
+ // src/components/Switch/Switch.tsx
2481
+ import * as RadixSwitch from "@radix-ui/react-switch";
2482
+ import { forwardRef as forwardRef32, useId as useId11 } from "react";
2483
+
2484
+ // src/components/Switch/Switch.css.ts
2485
+ import { createRuntimeFn as _7a46820 } from "@vanilla-extract/recipes/createRuntimeFn";
2486
+ var label5 = "o33ul29";
2487
+ var root9 = /* @__PURE__ */ _7a46820({ defaultClassName: "o33ul20", variantClassNames: { size: { sm: "o33ul21", md: "o33ul22" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2488
+ var thumb2 = /* @__PURE__ */ _7a46820({ defaultClassName: "o33ul26", variantClassNames: { size: { sm: "o33ul27", md: "o33ul28" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2489
+ var track3 = /* @__PURE__ */ _7a46820({ defaultClassName: "o33ul23", variantClassNames: { size: { sm: "o33ul24", md: "o33ul25" } }, defaultVariants: { size: "md" }, compoundVariants: [] });
2490
+
2491
+ // src/components/Switch/Switch.tsx
2492
+ import { jsx as jsx36, jsxs as jsxs28 } from "react/jsx-runtime";
2493
+ var Switch = /* @__PURE__ */ forwardRef32(function Switch2({ label: label6, size, id, className, disabled, "aria-label": ariaLabel, ...rest }, ref) {
2494
+ const generatedId = useId11();
2495
+ const switchId = id ?? generatedId;
2496
+ return /* @__PURE__ */ jsxs28("span", { className: cx(root9({ size }), className), "data-disabled": disabled || void 0, children: [
2497
+ /* @__PURE__ */ jsx36(
2498
+ RadixSwitch.Root,
2499
+ {
2500
+ ref,
2501
+ id: switchId,
2502
+ disabled,
2503
+ "aria-label": ariaLabel,
2504
+ className: track3({ size }),
2505
+ ...rest,
2506
+ children: /* @__PURE__ */ jsx36(RadixSwitch.Thumb, { className: thumb2({ size }) })
2507
+ }
2508
+ ),
2509
+ label6 && /* @__PURE__ */ jsx36("label", { htmlFor: switchId, className: label5, children: label6 })
2510
+ ] });
2511
+ });
2512
+
2513
+ // src/components/Table/Table.tsx
2514
+ import {
2515
+ createContext as createContext3,
2516
+ forwardRef as forwardRef33,
2517
+ useContext as useContext3,
2518
+ useId as useId12
2519
+ } from "react";
2520
+ import { ArrowDownIcon, ArrowUpIcon } from "@bestow-ui/icons";
2521
+
2522
+ // src/components/Table/Table.css.ts
2523
+ import { createRuntimeFn as _7a46821 } from "@vanilla-extract/recipes/createRuntimeFn";
2524
+ var body4 = "l3ploy5";
2525
+ var caption = "l3ploy2";
2526
+ var cell2 = /* @__PURE__ */ _7a46821({ defaultClassName: "l3ploy9", variantClassNames: { size: { sm: "l3ploya", md: "l3ployb" }, align: { left: "l3ployc", center: "l3ployd", right: "l3ploye" } }, defaultVariants: { size: "md", align: "left" }, compoundVariants: [] });
2527
+ var container = "l3ploy0";
2528
+ var footer4 = "l3ploy7";
2529
+ var footerCell = "l3ployg";
2530
+ var head = "l3ployf";
2531
+ var header9 = "l3ploy3";
2532
+ var row3 = "l3ploy8";
2533
+ var sortButton = "l3ployh";
2534
+ var sortIcon = "l3ployi";
2535
+ var stickyHeader = "l3ploy4";
2536
+ var striped = "l3ploy6";
2537
+ var table = "l3ploy1";
2538
+
2539
+ // src/components/Table/Table.tsx
2540
+ import { jsx as jsx37, jsxs as jsxs29 } from "react/jsx-runtime";
2541
+ var TableSizeContext = /* @__PURE__ */ createContext3("md");
2542
+ var TableSectionContext = /* @__PURE__ */ createContext3("body");
2543
+ var Table = /* @__PURE__ */ forwardRef33(function Table2({
2544
+ size = "md",
2545
+ striped: striped2,
2546
+ stickyHeader: stickyHeader2,
2547
+ caption: caption2,
2548
+ "aria-label": ariaLabel,
2549
+ containerClassName,
2550
+ containerStyle,
2551
+ className,
2552
+ children,
2553
+ ...rest
2554
+ }, ref) {
2555
+ const captionId = useId12();
2556
+ return /* @__PURE__ */ jsx37(TableSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx37(
2557
+ "div",
2558
+ {
2559
+ className: cx(container, containerClassName),
2560
+ style: containerStyle,
2561
+ tabIndex: 0,
2562
+ role: "region",
2563
+ "aria-labelledby": caption2 ? captionId : void 0,
2564
+ "aria-label": caption2 ? void 0 : ariaLabel,
2565
+ children: /* @__PURE__ */ jsxs29(
2566
+ "table",
2567
+ {
2568
+ ref,
2569
+ className: cx(table, striped2 && striped, stickyHeader2 && stickyHeader, className),
2570
+ "aria-label": caption2 ? void 0 : ariaLabel,
2571
+ ...rest,
2572
+ children: [
2573
+ caption2 && /* @__PURE__ */ jsx37("caption", { id: captionId, className: caption, children: caption2 }),
2574
+ children
2575
+ ]
2576
+ }
2577
+ )
2578
+ }
2579
+ ) });
2580
+ });
2581
+ var TableHeader = /* @__PURE__ */ forwardRef33(
2582
+ function TableHeader2({ className, ...rest }, ref) {
2583
+ return /* @__PURE__ */ jsx37(TableSectionContext.Provider, { value: "header", children: /* @__PURE__ */ jsx37("thead", { ref, className: cx(header9, className), ...rest }) });
2584
+ }
2585
+ );
2586
+ var TableBody = /* @__PURE__ */ forwardRef33(
2587
+ function TableBody2({ className, ...rest }, ref) {
2588
+ return /* @__PURE__ */ jsx37(TableSectionContext.Provider, { value: "body", children: /* @__PURE__ */ jsx37("tbody", { ref, className: cx(body4, className), ...rest }) });
2589
+ }
2590
+ );
2591
+ var TableFooter = /* @__PURE__ */ forwardRef33(
2592
+ function TableFooter2({ className, ...rest }, ref) {
2593
+ return /* @__PURE__ */ jsx37(TableSectionContext.Provider, { value: "footer", children: /* @__PURE__ */ jsx37("tfoot", { ref, className: cx(footer4, className), ...rest }) });
2594
+ }
2595
+ );
2596
+ var TableRow = /* @__PURE__ */ forwardRef33(function TableRow2({ selected, className, ...rest }, ref) {
2597
+ return /* @__PURE__ */ jsx37("tr", { ref, className: cx(row3, className), "data-state": selected ? "selected" : void 0, ...rest });
2598
+ });
2599
+ var TableHead = /* @__PURE__ */ forwardRef33(function TableHead2({ align, sortDirection, onSort, scope, className, children, ...rest }, ref) {
2600
+ const size = useContext3(TableSizeContext);
2601
+ const section = useContext3(TableSectionContext);
2602
+ const sortable = onSort !== void 0;
2603
+ const direction = sortDirection ?? "none";
2604
+ const SortIcon = direction === "descending" ? ArrowDownIcon : ArrowUpIcon;
2605
+ return /* @__PURE__ */ jsx37(
2606
+ "th",
2607
+ {
2608
+ ref,
2609
+ scope: scope ?? (section === "header" ? "col" : "row"),
2610
+ "aria-sort": sortable && direction !== "none" ? direction : void 0,
2611
+ className: cx(
2612
+ cell2({ size, align }),
2613
+ section === "header" ? head : section === "footer" ? footerCell : void 0,
2614
+ className
2615
+ ),
2616
+ ...rest,
2617
+ children: sortable ? /* @__PURE__ */ jsxs29("button", { type: "button", className: sortButton, onClick: onSort, children: [
2618
+ children,
2619
+ /* @__PURE__ */ jsx37(SortIcon, { size: 14, className: sortIcon, "data-active": direction !== "none", "aria-hidden": true })
2620
+ ] }) : children
2621
+ }
2622
+ );
2623
+ });
2624
+ var TableCell = /* @__PURE__ */ forwardRef33(function TableCell2({ align, className, ...rest }, ref) {
2625
+ const size = useContext3(TableSizeContext);
2626
+ const section = useContext3(TableSectionContext);
2627
+ return /* @__PURE__ */ jsx37(
2628
+ "td",
2629
+ {
2630
+ ref,
2631
+ className: cx(cell2({ size, align }), section === "footer" && footerCell, className),
2632
+ ...rest
2633
+ }
2634
+ );
2635
+ });
2636
+
2637
+ // src/components/Tabs/Tabs.tsx
2638
+ import * as RadixTabs from "@radix-ui/react-tabs";
2639
+ import { createContext as createContext4, forwardRef as forwardRef34, useContext as useContext4 } from "react";
2640
+
2641
+ // src/components/Tabs/Tabs.css.ts
2642
+ import { createRuntimeFn as _7a46822 } from "@vanilla-extract/recipes/createRuntimeFn";
2643
+ var content10 = "fvhbtda";
2644
+ var list4 = /* @__PURE__ */ _7a46822({ defaultClassName: "fvhbtd0", variantClassNames: { variant: { line: "fvhbtd1", soft: "fvhbtd2" } }, defaultVariants: { variant: "line" }, compoundVariants: [] });
2645
+ var trigger3 = /* @__PURE__ */ _7a46822({ defaultClassName: "fvhbtd3", variantClassNames: { variant: { line: "fvhbtd4", soft: "fvhbtd5" }, size: { sm: "fvhbtd6", md: "fvhbtd7" } }, defaultVariants: { variant: "line", size: "md" }, compoundVariants: [[{ variant: "soft", size: "sm" }, "fvhbtd8"], [{ variant: "soft", size: "md" }, "fvhbtd9"]] });
2646
+
2647
+ // src/components/Tabs/Tabs.tsx
2648
+ import { jsx as jsx38 } from "react/jsx-runtime";
2649
+ var TabsStyleContext = /* @__PURE__ */ createContext4({ variant: "line", size: "md" });
2650
+ var Tabs = /* @__PURE__ */ forwardRef34(function Tabs2({ variant = "line", size = "md", ...props }, ref) {
2651
+ const controlled = "value" in props ? { value: props.value ?? "" } : {};
2652
+ return /* @__PURE__ */ jsx38(TabsStyleContext.Provider, { value: { variant, size }, children: /* @__PURE__ */ jsx38(RadixTabs.Root, { ref, ...props, ...controlled }) });
2653
+ });
2654
+ var TabsList = /* @__PURE__ */ forwardRef34(function TabsList2({ className, ...rest }, ref) {
2655
+ const { variant } = useContext4(TabsStyleContext);
2656
+ return /* @__PURE__ */ jsx38(RadixTabs.List, { ref, className: cx(list4({ variant }), className), ...rest });
2657
+ });
2658
+ var TabsTrigger = /* @__PURE__ */ forwardRef34(function TabsTrigger2({ className, ...rest }, ref) {
2659
+ const { variant, size } = useContext4(TabsStyleContext);
2660
+ return /* @__PURE__ */ jsx38(RadixTabs.Trigger, { ref, className: cx(trigger3({ variant, size }), className), ...rest });
2661
+ });
2662
+ var TabsContent = /* @__PURE__ */ forwardRef34(function TabsContent2({ className, ...rest }, ref) {
2663
+ return /* @__PURE__ */ jsx38(RadixTabs.Content, { ref, className: cx(content10, className), ...rest });
2664
+ });
2665
+
2666
+ // src/components/Textarea/Textarea.tsx
2667
+ import {
2668
+ forwardRef as forwardRef35,
2669
+ useCallback,
2670
+ useId as useId13,
2671
+ useRef as useRef11,
2672
+ useState as useState10
2673
+ } from "react";
2674
+
2675
+ // src/components/Textarea/Textarea.css.ts
2676
+ import { createRuntimeFn as _7a46823 } from "@vanilla-extract/recipes/createRuntimeFn";
2677
+ var count = "_1koawa9";
2678
+ var countOver = "_1koawaa";
2679
+ var defaultWidth = "_1koawa7";
2680
+ var footer5 = "_1koawa8";
2681
+ var textarea = /* @__PURE__ */ _7a46823({ defaultClassName: "_1koawa0", variantClassNames: { size: { sm: "_1koawa1", md: "_1koawa2", lg: "_1koawa3" }, resize: { none: "_1koawa4", vertical: "_1koawa5", both: "_1koawa6" } }, defaultVariants: { size: "md", resize: "vertical" }, compoundVariants: [] });
2682
+
2683
+ // src/components/Textarea/Textarea.tsx
2684
+ import { jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
2685
+ var Textarea = /* @__PURE__ */ forwardRef35(function Textarea2({
2686
+ label: label6,
2687
+ helperText: helperText3,
2688
+ error,
2689
+ size,
2690
+ fullWidth,
2691
+ resize,
2692
+ autoResize,
2693
+ showCount,
2694
+ required,
2695
+ id,
2696
+ rows = 3,
2697
+ value: value4,
2698
+ defaultValue,
2699
+ onChange,
2700
+ maxLength,
2701
+ className,
2702
+ style,
2703
+ "aria-describedby": ariaDescribedBy,
2704
+ ...rest
2705
+ }, ref) {
2706
+ const generatedId = useId13();
2707
+ const textareaId = id ?? generatedId;
2708
+ const helperId = helperText3 ? `${textareaId}-helper` : void 0;
2709
+ const innerRef = useRef11(null);
2710
+ const [uncontrolledLength, setUncontrolledLength] = useState10(() => String(defaultValue ?? "").length);
2711
+ const length = value4 !== void 0 ? String(value4).length : uncontrolledLength;
2712
+ const fitHeight = useCallback(() => {
2713
+ const el = innerRef.current;
2714
+ if (!autoResize || !el) return;
2715
+ el.style.height = "auto";
2716
+ const borders = el.offsetHeight - el.clientHeight;
2717
+ el.style.height = `${el.scrollHeight + borders}px`;
2718
+ }, [autoResize]);
2719
+ useIsomorphicLayoutEffect(fitHeight, [fitHeight, value4]);
2720
+ const handleChange = (event) => {
2721
+ if (value4 === void 0) setUncontrolledLength(event.target.value.length);
2722
+ fitHeight();
2723
+ onChange?.(event);
2724
+ };
2725
+ return /* @__PURE__ */ jsxs30("div", { className: cx(field, fullWidth && fieldFullWidth), children: [
2726
+ label6 && /* @__PURE__ */ jsxs30("label", { htmlFor: textareaId, className: label, children: [
2727
+ label6,
2728
+ required && /* @__PURE__ */ jsx39("span", { className: requiredMark, "aria-hidden": true, children: "*" })
2729
+ ] }),
2730
+ /* @__PURE__ */ jsx39(
2731
+ "textarea",
2732
+ {
2733
+ ref: mergeRefs(innerRef, ref),
2734
+ id: textareaId,
2735
+ rows,
2736
+ value: value4,
2737
+ defaultValue,
2738
+ onChange: handleChange,
2739
+ maxLength,
2740
+ required,
2741
+ "aria-invalid": error || void 0,
2742
+ "aria-describedby": cx(helperId, ariaDescribedBy) || void 0,
2743
+ className: cx(
2744
+ textarea({ size, resize: autoResize ? "none" : resize }),
2745
+ !fullWidth && defaultWidth,
2746
+ className
2747
+ ),
2748
+ style: autoResize ? { overflowY: "auto", ...style } : style,
2749
+ ...rest
2750
+ }
2751
+ ),
2752
+ (helperText3 || showCount) && /* @__PURE__ */ jsxs30("div", { className: footer5, children: [
2753
+ helperText3 && /* @__PURE__ */ jsx39("p", { id: helperId, className: helperText({ error }), children: helperText3 }),
2754
+ showCount && /* @__PURE__ */ jsx39("span", { className: cx(count, maxLength !== void 0 && length >= maxLength && countOver), children: maxLength !== void 0 ? `${length}/${maxLength}` : length })
2755
+ ] })
2756
+ ] });
2757
+ });
2758
+
2759
+ // src/components/Toast/Toast.tsx
2760
+ import * as RadixToast from "@radix-ui/react-toast";
2761
+ import { createContext as createContext5, useCallback as useCallback2, useContext as useContext5, useMemo as useMemo4, useRef as useRef12, useState as useState11 } from "react";
2762
+ import { XIcon as XIcon5 } from "@bestow-ui/icons";
2763
+
2764
+ // src/components/Toast/Toast.css.ts
2765
+ import { createRuntimeFn as _7a46824 } from "@vanilla-extract/recipes/createRuntimeFn";
2766
+ var action2 = "_1g11zvx9";
2767
+ var close = "_1g11zvxa";
2768
+ var description5 = "_1g11zvx8";
2769
+ var title5 = "_1g11zvx7";
2770
+ var toast = /* @__PURE__ */ _7a46824({ defaultClassName: "_1g11zvx1", variantClassNames: { color: { primary: "_1g11zvx2", neutral: "_1g11zvx3", success: "_1g11zvx4", warning: "_1g11zvx5", danger: "_1g11zvx6" } }, defaultVariants: { color: "neutral" }, compoundVariants: [] });
2771
+ var viewport2 = "_1g11zvx0";
2772
+
2773
+ // src/components/Toast/Toast.tsx
2774
+ import { jsx as jsx40, jsxs as jsxs31 } from "react/jsx-runtime";
2775
+ var REMOVE_DELAY = 500;
2776
+ var ToastContext = /* @__PURE__ */ createContext5(null);
2777
+ function ToastProvider({ children, duration = 5e3, label: labelProp }) {
2778
+ const m = useMessages();
2779
+ const label6 = labelProp ?? m.notifications ?? "\uC54C\uB9BC";
2780
+ const [toasts, setToasts] = useState11([]);
2781
+ const nextId = useRef12(0);
2782
+ const portal2 = usePortalProps();
2783
+ const toast2 = useCallback2((options) => {
2784
+ const id = nextId.current++;
2785
+ setToasts((prev) => [...prev, { ...options, id, open: true }]);
2786
+ return id;
2787
+ }, []);
2788
+ const dismiss = useCallback2((id) => {
2789
+ const isTarget = (t) => id === void 0 || t.id === id;
2790
+ setToasts((prev) => prev.map((t) => isTarget(t) ? { ...t, open: false } : t));
2791
+ setTimeout(() => setToasts((prev) => prev.filter((t) => t.open || !isTarget(t))), REMOVE_DELAY);
2792
+ }, []);
2793
+ const value4 = useMemo4(() => ({ toast: toast2, dismiss }), [toast2, dismiss]);
2794
+ return /* @__PURE__ */ jsx40(ToastContext.Provider, { value: value4, children: /* @__PURE__ */ jsxs31(RadixToast.Provider, { duration, label: label6, swipeDirection: "right", children: [
2795
+ children,
2796
+ toasts.map(({ id, open, title: title6, description: description6, color, duration: itemDuration, action: action3 }) => /* @__PURE__ */ jsxs31(
2797
+ RadixToast.Root,
2798
+ {
2799
+ open,
2800
+ duration: itemDuration,
2801
+ onOpenChange: (nextOpen) => {
2802
+ if (!nextOpen) dismiss(id);
2803
+ },
2804
+ className: toast({ color }),
2805
+ children: [
2806
+ /* @__PURE__ */ jsx40(RadixToast.Title, { className: title5, children: title6 }),
2807
+ description6 && /* @__PURE__ */ jsx40(RadixToast.Description, { className: description5, children: description6 }),
2808
+ action3 && /* @__PURE__ */ jsx40(RadixToast.Action, { asChild: true, altText: action3.altText ?? action3.label, className: action2, children: /* @__PURE__ */ jsx40(Button, { size: "sm", variant: "soft", color: "neutral", onClick: action3.onClick, children: action3.label }) }),
2809
+ /* @__PURE__ */ jsx40(RadixToast.Close, { className: close, "aria-label": m.close ?? "\uB2EB\uAE30", children: /* @__PURE__ */ jsx40(XIcon5, { size: 16 }) })
2810
+ ]
2811
+ },
2812
+ id
2813
+ )),
2814
+ /* @__PURE__ */ jsx40(RadixToast.Viewport, { className: cx(portal2.className, viewport2), style: portal2.style })
2815
+ ] }) });
2816
+ }
2817
+ function useToast() {
2818
+ const context = useContext5(ToastContext);
2819
+ if (!context) throw new Error("useToast \uB294 ToastProvider \uC548\uC5D0\uC11C \uC0AC\uC6A9\uD574\uC57C \uD569\uB2C8\uB2E4.");
2820
+ return context;
2821
+ }
2822
+
2823
+ // src/components/Tooltip/Tooltip.tsx
2824
+ import * as RadixTooltip from "@radix-ui/react-tooltip";
2825
+
2826
+ // src/components/Tooltip/Tooltip.css.ts
2827
+ var arrow2 = "z7rufs1";
2828
+ var content11 = "z7rufs0";
2829
+
2830
+ // src/components/Tooltip/Tooltip.tsx
2831
+ import { jsx as jsx41, jsxs as jsxs32 } from "react/jsx-runtime";
2832
+ function Tooltip({
2833
+ content: content12,
2834
+ children,
2835
+ side = "top",
2836
+ align = "center",
2837
+ delay = 300,
2838
+ open,
2839
+ defaultOpen,
2840
+ onOpenChange,
2841
+ disabled,
2842
+ className
2843
+ }) {
2844
+ const portal2 = usePortalProps();
2845
+ if (disabled || content12 == null || content12 === "") return children;
2846
+ return /* @__PURE__ */ jsx41(RadixTooltip.Provider, { delayDuration: delay, children: /* @__PURE__ */ jsxs32(RadixTooltip.Root, { open, defaultOpen, onOpenChange, children: [
2847
+ /* @__PURE__ */ jsx41(RadixTooltip.Trigger, { asChild: true, children }),
2848
+ /* @__PURE__ */ jsx41(RadixTooltip.Portal, { children: /* @__PURE__ */ jsxs32(
2849
+ RadixTooltip.Content,
2850
+ {
2851
+ side,
2852
+ align,
2853
+ sideOffset: 6,
2854
+ collisionPadding: 8,
2855
+ className: cx(portal2.className, content11, className),
2856
+ style: portal2.style,
2857
+ children: [
2858
+ content12,
2859
+ /* @__PURE__ */ jsx41(RadixTooltip.Arrow, { className: arrow2, width: 10, height: 5 })
2860
+ ]
2861
+ }
2862
+ ) })
2863
+ ] }) });
2864
+ }
2865
+
2866
+ // src/components/Typography/Typography.tsx
2867
+ import { forwardRef as forwardRef36 } from "react";
2868
+
2869
+ // src/components/Typography/Typography.css.ts
2870
+ import { createRuntimeFn as _7a46825 } from "@vanilla-extract/recipes/createRuntimeFn";
2871
+ var typography = /* @__PURE__ */ _7a46825({ defaultClassName: "kiolio0", variantClassNames: { variant: { display: "kiolio1", h1: "kiolio2", h2: "kiolio3", h3: "kiolio4", h4: "kiolio5", "body-lg": "kiolio6", body: "kiolio7", "body-sm": "kiolio8", caption: "kiolio9" }, color: { "default": "kiolioa", muted: "kioliob", subtle: "kiolioc", primary: "kioliod", danger: "kiolioe", success: "kioliof", warning: "kioliog", inherit: "kiolioh" }, weight: { regular: "kiolioi", medium: "kiolioj", semibold: "kioliok", bold: "kioliol" }, align: { start: "kioliom", center: "kiolion", end: "kiolioo" }, truncate: { true: "kioliop" } }, defaultVariants: { variant: "body", color: "default" }, compoundVariants: [] });
2872
+
2873
+ // src/components/Typography/Typography.tsx
2874
+ import { jsx as jsx42 } from "react/jsx-runtime";
2875
+ var defaultElement = {
2876
+ display: "h1",
2877
+ h1: "h1",
2878
+ h2: "h2",
2879
+ h3: "h3",
2880
+ h4: "h4",
2881
+ "body-lg": "p",
2882
+ body: "p",
2883
+ "body-sm": "p",
2884
+ caption: "span"
2885
+ };
2886
+ var Typography = /* @__PURE__ */ forwardRef36(function Typography2({ variant = "body", as, color, weight, align, truncate, className, ...rest }, ref) {
2887
+ const Component = as ?? defaultElement[variant];
2888
+ return /* @__PURE__ */ jsx42(
2889
+ Component,
2890
+ {
2891
+ ref,
2892
+ className: cx(typography({ variant, color, weight, align, truncate }), className),
2893
+ ...rest
2894
+ }
2895
+ );
2896
+ });
2897
+
2898
+ // src/components/VerificationCodeInput/VerificationCodeInput.tsx
2899
+ import { forwardRef as forwardRef37, useEffect as useEffect7, useId as useId14, useRef as useRef13, useState as useState12 } from "react";
2900
+
2901
+ // src/components/VerificationCodeInput/VerificationCodeInput.css.ts
2902
+ var input4 = "ea01812";
2903
+ var row4 = "ea01810";
2904
+ var slot = "ea01813";
2905
+ var slots = "ea01811";
2906
+ var timer = "ea01814";
2907
+
2908
+ // src/components/VerificationCodeInput/VerificationCodeInput.tsx
2909
+ import { jsx as jsx43, jsxs as jsxs33 } from "react/jsx-runtime";
2910
+ var formatTime = (seconds) => `${String(Math.floor(seconds / 60)).padStart(2, "0")}:${String(seconds % 60).padStart(2, "0")}`;
2911
+ var VerificationCodeInput = /* @__PURE__ */ forwardRef37(
2912
+ function VerificationCodeInput2(props, ref) {
2913
+ const {
2914
+ length = 6,
2915
+ value: value4,
2916
+ defaultValue,
2917
+ onValueChange,
2918
+ onComplete,
2919
+ type = "numeric",
2920
+ label: labelProp,
2921
+ helperText: helperText3,
2922
+ error,
2923
+ disabled,
2924
+ autoFocus,
2925
+ expiresIn,
2926
+ onExpire,
2927
+ onResend,
2928
+ resendText: resendTextProp,
2929
+ expiredText: expiredTextProp,
2930
+ name,
2931
+ id,
2932
+ className
2933
+ } = props;
2934
+ const m = useMessages();
2935
+ const label6 = labelProp ?? m.verificationCode ?? "\uC778\uC99D\uBC88\uD638";
2936
+ const resendText = resendTextProp ?? m.resend ?? "\uC7AC\uC804\uC1A1";
2937
+ const expiredText = expiredTextProp ?? m.verificationExpired ?? "\uC778\uC99D \uC2DC\uAC04\uC774 \uC9C0\uB0AC\uC5B4\uC694. \uC7AC\uC804\uC1A1\uD574 \uC8FC\uC138\uC694.";
2938
+ const generatedId = useId14();
2939
+ const inputId = id ?? generatedId;
2940
+ const helperId = `${inputId}-helper`;
2941
+ const statusId = `${inputId}-status`;
2942
+ const inputRef = useRef13(null);
2943
+ const isControlled = "value" in props;
2944
+ const [innerValue, setInnerValue] = useState12(defaultValue ?? "");
2945
+ const code = (isControlled ? value4 ?? "" : innerValue).slice(0, length);
2946
+ const [focused, setFocused] = useState12(false);
2947
+ const [endAt, setEndAt] = useState12(() => expiresIn ? Date.now() + expiresIn * 1e3 : null);
2948
+ const [remaining, setRemaining] = useState12(expiresIn ?? 0);
2949
+ const expired = expiresIn !== void 0 && remaining <= 0;
2950
+ const onExpireRef = useRef13(onExpire);
2951
+ useEffect7(() => {
2952
+ onExpireRef.current = onExpire;
2953
+ });
2954
+ useEffect7(() => {
2955
+ if (endAt === null) return;
2956
+ const tick = () => {
2957
+ const left = Math.max(0, Math.ceil((endAt - Date.now()) / 1e3));
2958
+ setRemaining(left);
2959
+ if (left === 0) {
2960
+ clearInterval(timer2);
2961
+ onExpireRef.current?.();
2962
+ }
2963
+ };
2964
+ const timer2 = setInterval(tick, 250);
2965
+ tick();
2966
+ return () => clearInterval(timer2);
2967
+ }, [endAt]);
2968
+ const setCode = (next) => {
2969
+ if (!isControlled) setInnerValue(next);
2970
+ onValueChange?.(next);
2971
+ if (next.length === length && code.length !== length) onComplete?.(next);
2972
+ };
2973
+ const handleChange = (event) => {
2974
+ const raw = event.target.value;
2975
+ const cleaned = (type === "numeric" ? raw.replace(/\D/g, "") : raw.replace(/[^0-9a-z]/gi, "").toUpperCase()).slice(0, length);
2976
+ setCode(cleaned);
2977
+ };
2978
+ const resend = () => {
2979
+ onResend?.();
2980
+ setCode("");
2981
+ if (expiresIn) {
2982
+ setEndAt(Date.now() + expiresIn * 1e3);
2983
+ setRemaining(expiresIn);
2984
+ }
2985
+ inputRef.current?.focus();
2986
+ };
2987
+ const description6 = helperText3 ?? m.verificationCodeHint?.(length, type) ?? `${length}\uC790\uB9AC ${type === "numeric" ? "\uC22B\uC790" : "\uBB38\uC790"}\uB97C \uC785\uB825\uD558\uC138\uC694.`;
2988
+ const activeIndex = Math.min(code.length, length - 1);
2989
+ return /* @__PURE__ */ jsxs33(
2990
+ "div",
2991
+ {
2992
+ className: cx(field, className),
2993
+ "data-invalid": error || void 0,
2994
+ "data-disabled": disabled || void 0,
2995
+ children: [
2996
+ /* @__PURE__ */ jsx43("label", { htmlFor: inputId, className: label, children: label6 }),
2997
+ /* @__PURE__ */ jsxs33("div", { className: row4, children: [
2998
+ /* @__PURE__ */ jsxs33("div", { className: slots, children: [
2999
+ /* @__PURE__ */ jsx43(
3000
+ "input",
3001
+ {
3002
+ ref: mergeRefs(ref, inputRef),
3003
+ id: inputId,
3004
+ type: "text",
3005
+ inputMode: type === "numeric" ? "numeric" : "text",
3006
+ autoComplete: "one-time-code",
3007
+ pattern: type === "numeric" ? "[0-9]*" : void 0,
3008
+ value: code,
3009
+ onChange: handleChange,
3010
+ onFocus: () => setFocused(true),
3011
+ onBlur: () => setFocused(false),
3012
+ disabled,
3013
+ autoFocus,
3014
+ "aria-invalid": error || void 0,
3015
+ "aria-describedby": `${helperId} ${statusId}`,
3016
+ className: input4
3017
+ }
3018
+ ),
3019
+ Array.from({ length }, (_, index) => /* @__PURE__ */ jsx43(
3020
+ "div",
3021
+ {
3022
+ className: slot,
3023
+ "data-active": focused && index === activeIndex ? "" : void 0,
3024
+ "aria-hidden": true,
3025
+ children: code[index] ?? ""
3026
+ },
3027
+ index
3028
+ ))
3029
+ ] }),
3030
+ expiresIn !== void 0 && /* @__PURE__ */ jsx43("span", { role: "timer", className: timer, children: formatTime(remaining) }),
3031
+ onResend && /* @__PURE__ */ jsx43(Button, { size: "sm", variant: "outline", color: "neutral", onClick: resend, disabled, children: resendText })
3032
+ ] }),
3033
+ /* @__PURE__ */ jsx43("p", { id: helperId, className: helperText({ error }), children: description6 }),
3034
+ /* @__PURE__ */ jsx43("p", { id: statusId, role: "status", className: helperText({ error: true }), children: expired ? expiredText : "" }),
3035
+ name && /* @__PURE__ */ jsx43("input", { type: "hidden", name, value: code })
3036
+ ]
3037
+ }
3038
+ );
3039
+ }
3040
+ );
3041
+ export {
3042
+ Accordion,
3043
+ AccordionItem,
3044
+ AddressInput,
3045
+ AgreementGroup,
3046
+ Alert,
3047
+ AmountInput,
3048
+ Avatar,
3049
+ Badge,
3050
+ Breadcrumb,
3051
+ BusinessNumberInput,
3052
+ Button,
3053
+ Calendar,
3054
+ Card,
3055
+ CardBody,
3056
+ CardFooter,
3057
+ CardHeader,
3058
+ Checkbox,
3059
+ Combobox,
3060
+ DatePicker,
3061
+ Divider,
3062
+ Drawer,
3063
+ DrawerClose,
3064
+ DropdownMenu,
3065
+ DropdownMenuContent,
3066
+ DropdownMenuGroup,
3067
+ DropdownMenuItem,
3068
+ DropdownMenuLabel,
3069
+ DropdownMenuSeparator,
3070
+ DropdownMenuTrigger,
3071
+ IconButton,
3072
+ Input,
3073
+ Link,
3074
+ LocaleProvider,
3075
+ Modal,
3076
+ ModalClose,
3077
+ Pagination,
3078
+ PhoneNumberInput,
3079
+ Popover2 as Popover,
3080
+ PopoverClose,
3081
+ Progress,
3082
+ RadioGroup,
3083
+ Select,
3084
+ Skeleton,
3085
+ Slider,
3086
+ Spinner,
3087
+ Stack,
3088
+ Switch,
3089
+ Table,
3090
+ TableBody,
3091
+ TableCell,
3092
+ TableFooter,
3093
+ TableHead,
3094
+ TableHeader,
3095
+ TableRow,
3096
+ Tabs,
3097
+ TabsContent,
3098
+ TabsList,
3099
+ TabsTrigger,
3100
+ TextField,
3101
+ Textarea,
3102
+ ThemeProvider,
3103
+ ToastProvider,
3104
+ Tooltip,
3105
+ Typography,
3106
+ VerificationCodeInput,
3107
+ useMessages,
3108
+ usePortalProps,
3109
+ useTheme,
3110
+ useToast
3111
+ };
3112
+ //# sourceMappingURL=client.js.map