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