@refinn/core-ui 0.1.4 → 0.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{index.mjs → index.cjs} +401 -383
- package/dist/index.js +384 -400
- package/dist/theme.css +4 -5
- package/package.json +4 -6
|
@@ -1,7 +1,13 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
var __create = Object.create;
|
|
1
4
|
var __defProp = Object.defineProperty;
|
|
2
5
|
var __defProps = Object.defineProperties;
|
|
6
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
7
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
8
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
9
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
10
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
5
11
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
12
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
13
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
@@ -29,17 +35,63 @@ var __objRest = (source, exclude) => {
|
|
|
29
35
|
}
|
|
30
36
|
return target;
|
|
31
37
|
};
|
|
38
|
+
var __export = (target, all) => {
|
|
39
|
+
for (var name in all)
|
|
40
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
41
|
+
};
|
|
42
|
+
var __copyProps = (to, from, except, desc) => {
|
|
43
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
44
|
+
for (let key of __getOwnPropNames(from))
|
|
45
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
46
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
47
|
+
}
|
|
48
|
+
return to;
|
|
49
|
+
};
|
|
50
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
51
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
52
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
53
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
54
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
55
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
56
|
+
mod
|
|
57
|
+
));
|
|
58
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
59
|
+
|
|
60
|
+
// src/components/index.ts
|
|
61
|
+
var index_exports = {};
|
|
62
|
+
__export(index_exports, {
|
|
63
|
+
Accordion: () => Accordion,
|
|
64
|
+
AlertBanner: () => AlertBanner,
|
|
65
|
+
Avatar: () => Avatar,
|
|
66
|
+
Badge: () => Badge,
|
|
67
|
+
BottomSheet: () => BottomSheet,
|
|
68
|
+
Branding: () => Branding,
|
|
69
|
+
Button: () => Button,
|
|
70
|
+
Checkbox: () => Checkbox,
|
|
71
|
+
Chip: () => Chip,
|
|
72
|
+
Dialog: () => Dialog,
|
|
73
|
+
Dropdown: () => Dropdown,
|
|
74
|
+
FinancialLogo: () => FinancialLogo,
|
|
75
|
+
Icon: () => Icon,
|
|
76
|
+
Link: () => Link,
|
|
77
|
+
Loading: () => Loading,
|
|
78
|
+
Radio: () => Radio,
|
|
79
|
+
SegmentControl: () => SegmentControl,
|
|
80
|
+
Slider: () => Slider,
|
|
81
|
+
Tab: () => Tab,
|
|
82
|
+
TextArea: () => TextArea,
|
|
83
|
+
TextField: () => TextField,
|
|
84
|
+
Toast: () => Toast,
|
|
85
|
+
ToggleSwitch: () => ToggleSwitch,
|
|
86
|
+
Tooltip: () => Tooltip
|
|
87
|
+
});
|
|
88
|
+
module.exports = __toCommonJS(index_exports);
|
|
32
89
|
|
|
33
90
|
// src/components/Accordion/Accordion.tsx
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
useCallback,
|
|
37
|
-
useId,
|
|
38
|
-
useState
|
|
39
|
-
} from "react";
|
|
40
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
91
|
+
var import_react = require("react");
|
|
92
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
41
93
|
function ChevronIcon({ className }) {
|
|
42
|
-
return /* @__PURE__ */ jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
|
|
94
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
43
95
|
"path",
|
|
44
96
|
{
|
|
45
97
|
d: "M5 7.5L10 12.5L15 7.5",
|
|
@@ -58,8 +110,8 @@ function AccordionItem({ item, isOpen, onToggle, generatedId }) {
|
|
|
58
110
|
isOpen ? "rotate-180" : "",
|
|
59
111
|
item.disabled ? "text-static-icon-disabled" : "text-static-icon-primary"
|
|
60
112
|
].join(" ");
|
|
61
|
-
return /* @__PURE__ */ jsxs("div", { children: [
|
|
62
|
-
/* @__PURE__ */ jsxs(
|
|
113
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
114
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
63
115
|
"button",
|
|
64
116
|
{
|
|
65
117
|
id: triggerId,
|
|
@@ -70,8 +122,8 @@ function AccordionItem({ item, isOpen, onToggle, generatedId }) {
|
|
|
70
122
|
className: "flex flex-row items-center justify-between w-full pl-16 pr-8 py-8 lg:pl-24 lg:py-16 lg:pr-12",
|
|
71
123
|
onClick: onToggle,
|
|
72
124
|
children: [
|
|
73
|
-
/* @__PURE__ */ jsxs("span", { className: `flex flex-col`, children: [
|
|
74
|
-
/* @__PURE__ */ jsx(
|
|
125
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: `flex flex-col`, children: [
|
|
126
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
75
127
|
"span",
|
|
76
128
|
{
|
|
77
129
|
className: `
|
|
@@ -83,16 +135,16 @@ function AccordionItem({ item, isOpen, onToggle, generatedId }) {
|
|
|
83
135
|
children: item.title
|
|
84
136
|
}
|
|
85
137
|
),
|
|
86
|
-
item.subtitle && /* @__PURE__ */ jsx("span", { className: [
|
|
138
|
+
item.subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: [
|
|
87
139
|
"text-body-small",
|
|
88
140
|
item.disabled ? "text-accordion-text-disabled" : "text-accordion-text-secondary"
|
|
89
141
|
].join(" "), children: item.subtitle })
|
|
90
142
|
] }),
|
|
91
|
-
/* @__PURE__ */ jsx(ChevronIcon, { className: iconClasses })
|
|
143
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronIcon, { className: iconClasses })
|
|
92
144
|
]
|
|
93
145
|
}
|
|
94
146
|
),
|
|
95
|
-
/* @__PURE__ */ jsx(
|
|
147
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
96
148
|
"div",
|
|
97
149
|
{
|
|
98
150
|
id: panelId,
|
|
@@ -100,12 +152,12 @@ function AccordionItem({ item, isOpen, onToggle, generatedId }) {
|
|
|
100
152
|
"aria-labelledby": triggerId,
|
|
101
153
|
className: "overflow-hidden transition-[grid-template-rows] duration-200",
|
|
102
154
|
style: { display: "grid", gridTemplateRows: isOpen ? "1fr" : "0fr" },
|
|
103
|
-
children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: `text-accordion-text-secondary text-body-small pt-8 pb-16 px-16 lg:text-body-regular lg:pl-24 lg:pr-64 lg:pb-24 lg:pt-12`, children: item.content }) })
|
|
155
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `text-accordion-text-secondary text-body-small pt-8 pb-16 px-16 lg:text-body-regular lg:pl-24 lg:pr-64 lg:pb-24 lg:pt-12`, children: item.content }) })
|
|
104
156
|
}
|
|
105
157
|
)
|
|
106
158
|
] });
|
|
107
159
|
}
|
|
108
|
-
var Accordion = forwardRef(
|
|
160
|
+
var Accordion = (0, import_react.forwardRef)(
|
|
109
161
|
(_a, ref) => {
|
|
110
162
|
var _b = _a, {
|
|
111
163
|
items,
|
|
@@ -118,7 +170,7 @@ var Accordion = forwardRef(
|
|
|
118
170
|
"loading",
|
|
119
171
|
"className"
|
|
120
172
|
]);
|
|
121
|
-
const baseId = useId();
|
|
173
|
+
const baseId = (0, import_react.useId)();
|
|
122
174
|
const defaultOpen = () => {
|
|
123
175
|
const set = /* @__PURE__ */ new Set();
|
|
124
176
|
items.forEach((item, i) => {
|
|
@@ -127,8 +179,8 @@ var Accordion = forwardRef(
|
|
|
127
179
|
});
|
|
128
180
|
return set;
|
|
129
181
|
};
|
|
130
|
-
const [openItems, setOpenItems] = useState(defaultOpen);
|
|
131
|
-
const handleToggle = useCallback(
|
|
182
|
+
const [openItems, setOpenItems] = (0, import_react.useState)(defaultOpen);
|
|
183
|
+
const handleToggle = (0, import_react.useCallback)(
|
|
132
184
|
(itemId) => {
|
|
133
185
|
setOpenItems((prev) => {
|
|
134
186
|
const next = new Set(multiple ? prev : []);
|
|
@@ -148,15 +200,15 @@ var Accordion = forwardRef(
|
|
|
148
200
|
className
|
|
149
201
|
].filter(Boolean).join(" ");
|
|
150
202
|
if (loading) {
|
|
151
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ jsxs("div", { className: `flex items-center justify-between gap-8 pl-16 pr-8 py-8`, children: [
|
|
152
|
-
/* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col gap-4", children: /* @__PURE__ */ jsx("div", { className: "h-16 w-3/4 rounded bg-gray-200 animate-pulse" }) }),
|
|
153
|
-
/* @__PURE__ */ jsx(ChevronIcon, { className: `shrink-0 text-accordion-icon w-20 h-20 my-8 mx-12` })
|
|
203
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `flex items-center justify-between gap-8 pl-16 pr-8 py-8`, children: [
|
|
204
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex-1 flex flex-col gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-16 w-3/4 rounded bg-gray-200 animate-pulse" }) }),
|
|
205
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronIcon, { className: `shrink-0 text-accordion-icon w-20 h-20 my-8 mx-12` })
|
|
154
206
|
] }) }));
|
|
155
207
|
}
|
|
156
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: items.map((item, i) => {
|
|
208
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: items.map((item, i) => {
|
|
157
209
|
var _a2;
|
|
158
210
|
const itemId = (_a2 = item.id) != null ? _a2 : String(i);
|
|
159
|
-
return /* @__PURE__ */ jsx(
|
|
211
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
160
212
|
AccordionItem,
|
|
161
213
|
{
|
|
162
214
|
item,
|
|
@@ -172,8 +224,8 @@ var Accordion = forwardRef(
|
|
|
172
224
|
Accordion.displayName = "Accordion";
|
|
173
225
|
|
|
174
226
|
// src/components/AlertBanner/AlertBanner.tsx
|
|
175
|
-
|
|
176
|
-
|
|
227
|
+
var import_react2 = require("react");
|
|
228
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
177
229
|
var pageClasses = {
|
|
178
230
|
info: "bg-alert-page-info-bg text-alert-text-primary-inverse",
|
|
179
231
|
success: "bg-alert-page-success-bg text-alert-text-primary-inverse",
|
|
@@ -210,25 +262,25 @@ var inlineIconClasses = {
|
|
|
210
262
|
none: "text-alert-inline-common-icon"
|
|
211
263
|
};
|
|
212
264
|
function InfoIcon({ className }) {
|
|
213
|
-
return /* @__PURE__ */
|
|
265
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM10 6h.01M9 10h1v4h1", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
214
266
|
}
|
|
215
267
|
function SuccessIcon({ className }) {
|
|
216
|
-
return /* @__PURE__ */
|
|
217
|
-
/* @__PURE__ */
|
|
218
|
-
/* @__PURE__ */
|
|
268
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
|
|
269
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
270
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
|
|
219
271
|
] });
|
|
220
272
|
}
|
|
221
273
|
function WarningIcon({ className }) {
|
|
222
|
-
return /* @__PURE__ */
|
|
274
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M8.57 3.22 1.53 15.5a1.67 1.67 0 0 0 1.43 2.5h14.08a1.67 1.67 0 0 0 1.43-2.5L11.43 3.22a1.67 1.67 0 0 0-2.86 0ZM10 7.5v3.33M10 14.17h.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
223
275
|
}
|
|
224
276
|
function DangerIcon({ className }) {
|
|
225
|
-
return /* @__PURE__ */
|
|
277
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM12.5 7.5l-5 5M7.5 7.5l5 5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
226
278
|
}
|
|
227
279
|
function NoneIcon({ className }) {
|
|
228
|
-
return /* @__PURE__ */
|
|
280
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, {});
|
|
229
281
|
}
|
|
230
282
|
function CloseIcon({ className }) {
|
|
231
|
-
return /* @__PURE__ */
|
|
283
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className, width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 4 4 12M4 4l8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
232
284
|
}
|
|
233
285
|
var defaultIcons = {
|
|
234
286
|
info: InfoIcon,
|
|
@@ -237,7 +289,7 @@ var defaultIcons = {
|
|
|
237
289
|
danger: DangerIcon,
|
|
238
290
|
none: NoneIcon
|
|
239
291
|
};
|
|
240
|
-
var AlertBanner =
|
|
292
|
+
var AlertBanner = (0, import_react2.forwardRef)(
|
|
241
293
|
(_a, ref) => {
|
|
242
294
|
var _b = _a, {
|
|
243
295
|
variant = "info",
|
|
@@ -274,25 +326,25 @@ var AlertBanner = forwardRef2(
|
|
|
274
326
|
variantClass,
|
|
275
327
|
className
|
|
276
328
|
].filter(Boolean).join(" ");
|
|
277
|
-
return /* @__PURE__ */
|
|
278
|
-
/* @__PURE__ */
|
|
279
|
-
icon != null ? icon : /* @__PURE__ */
|
|
280
|
-
/* @__PURE__ */
|
|
281
|
-
title && /* @__PURE__ */
|
|
282
|
-
description && /* @__PURE__ */
|
|
329
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", __spreadProps(__spreadValues({ ref, role: "alert", className: classes }, rest), { children: [
|
|
330
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-start gap-8", children: [
|
|
331
|
+
icon != null ? icon : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(DefaultIcon, { className: `h-20 w-20 ${iconColorClass}` }),
|
|
332
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex-1 min-w-0 flex flex-col", children: [
|
|
333
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "text-label-medium", children: title }),
|
|
334
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: `text-body-small ${descColorClass} ${title ? "mt-2" : ""} ${children ? "mb-8" : ""}`, children: description }),
|
|
283
335
|
children
|
|
284
336
|
] })
|
|
285
337
|
] }),
|
|
286
|
-
/* @__PURE__ */
|
|
287
|
-
(action == null ? void 0 : action[0]) && /* @__PURE__ */
|
|
288
|
-
onClose && /* @__PURE__ */
|
|
338
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: `flex ${children ? "items-start" : "self-center"} gap-24`, children: [
|
|
339
|
+
(action == null ? void 0 : action[0]) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("a", { className: `${actionClass} underline text-sm font-medium`, href: action[1], children: action[0] }),
|
|
340
|
+
onClose && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
289
341
|
"button",
|
|
290
342
|
{
|
|
291
343
|
type: "button",
|
|
292
344
|
onClick: onClose,
|
|
293
345
|
className: `shrink-0 p-2 rounded transition-colors ${closeColorClass}`,
|
|
294
346
|
"aria-label": "Close",
|
|
295
|
-
children: /* @__PURE__ */
|
|
347
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(CloseIcon, { className: "h-16 w-16" })
|
|
296
348
|
}
|
|
297
349
|
)
|
|
298
350
|
] })
|
|
@@ -302,8 +354,8 @@ var AlertBanner = forwardRef2(
|
|
|
302
354
|
AlertBanner.displayName = "AlertBanner";
|
|
303
355
|
|
|
304
356
|
// src/components/Avatar/Avatar.tsx
|
|
305
|
-
|
|
306
|
-
|
|
357
|
+
var import_react3 = require("react");
|
|
358
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
307
359
|
var sizeClasses = {
|
|
308
360
|
sm: { container: "h-24 w-24", text: "text-sm", status: "h-6 w-6", statusRing: "ring-1" },
|
|
309
361
|
md: { container: "h-32 w-32", text: "text-base", status: "h-8 w-8", statusRing: "ring-[1.5px]" },
|
|
@@ -322,9 +374,9 @@ function getInitials(name) {
|
|
|
322
374
|
return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
|
|
323
375
|
}
|
|
324
376
|
function PersonIcon({ className }) {
|
|
325
|
-
return /* @__PURE__ */
|
|
377
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { className, viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M10 10a3.75 3.75 0 1 0 0-7.5 3.75 3.75 0 0 0 0 7.5ZM3.75 17.5a6.25 6.25 0 0 1 12.5 0" }) });
|
|
326
378
|
}
|
|
327
|
-
var Avatar =
|
|
379
|
+
var Avatar = (0, import_react3.forwardRef)(
|
|
328
380
|
(_a, ref) => {
|
|
329
381
|
var _b = _a, {
|
|
330
382
|
size = "md",
|
|
@@ -354,7 +406,7 @@ var Avatar = forwardRef3(
|
|
|
354
406
|
].filter(Boolean).join(" ");
|
|
355
407
|
let content;
|
|
356
408
|
if (src) {
|
|
357
|
-
content = /* @__PURE__ */
|
|
409
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
358
410
|
"img",
|
|
359
411
|
{
|
|
360
412
|
src,
|
|
@@ -365,13 +417,13 @@ var Avatar = forwardRef3(
|
|
|
365
417
|
} else if (icon) {
|
|
366
418
|
content = icon;
|
|
367
419
|
} else if (name) {
|
|
368
|
-
content = /* @__PURE__ */
|
|
420
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: sz.text, children: getInitials(name) });
|
|
369
421
|
} else {
|
|
370
|
-
content = /* @__PURE__ */
|
|
422
|
+
content = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PersonIcon, { className: `${sz.text} h-[60%] w-[60%]` });
|
|
371
423
|
}
|
|
372
|
-
return /* @__PURE__ */
|
|
424
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: [
|
|
373
425
|
content,
|
|
374
|
-
status && /* @__PURE__ */
|
|
426
|
+
status && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
375
427
|
"span",
|
|
376
428
|
{
|
|
377
429
|
className: [
|
|
@@ -389,8 +441,8 @@ var Avatar = forwardRef3(
|
|
|
389
441
|
Avatar.displayName = "Avatar";
|
|
390
442
|
|
|
391
443
|
// src/components/Badge/Badge.tsx
|
|
392
|
-
|
|
393
|
-
|
|
444
|
+
var import_react4 = require("react");
|
|
445
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
394
446
|
var sizeClasses2 = {
|
|
395
447
|
sm: "h-20 px-8 py-2 text-label-small gap-4",
|
|
396
448
|
md: "h-28 px-10 py-4 text-label-medium gap-4",
|
|
@@ -430,7 +482,7 @@ var styleMap = {
|
|
|
430
482
|
subtle: subtleClasses,
|
|
431
483
|
bold: boldClasses
|
|
432
484
|
};
|
|
433
|
-
var Badge =
|
|
485
|
+
var Badge = (0, import_react4.forwardRef)(
|
|
434
486
|
(_a, ref) => {
|
|
435
487
|
var _b = _a, {
|
|
436
488
|
status = "common",
|
|
@@ -457,8 +509,8 @@ var Badge = forwardRef4(
|
|
|
457
509
|
styleMap[badgeStyle][status],
|
|
458
510
|
className
|
|
459
511
|
].filter(Boolean).join(" ");
|
|
460
|
-
return /* @__PURE__ */
|
|
461
|
-
icon && /* @__PURE__ */
|
|
512
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", __spreadProps(__spreadValues({ ref, className: classes }, rest), { children: [
|
|
513
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: `shrink-0 ${iconSizeClasses[size]}`, children: icon }),
|
|
462
514
|
children
|
|
463
515
|
] }));
|
|
464
516
|
}
|
|
@@ -466,20 +518,18 @@ var Badge = forwardRef4(
|
|
|
466
518
|
Badge.displayName = "Badge";
|
|
467
519
|
|
|
468
520
|
// src/components/Branding/Branding.tsx
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
473
|
-
var Branding = forwardRef5(
|
|
521
|
+
var import_react5 = require("react");
|
|
522
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
523
|
+
var Branding = (0, import_react5.forwardRef)(
|
|
474
524
|
(_a, ref) => {
|
|
475
525
|
var _b = _a, { type = "brand", className = "" } = _b, rest = __objRest(_b, ["type", "className"]);
|
|
476
|
-
return /* @__PURE__ */
|
|
526
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
477
527
|
"div",
|
|
478
528
|
__spreadProps(__spreadValues({
|
|
479
529
|
ref,
|
|
480
530
|
className: `${type === "black" ? "text-gray-900" : type === "white" ? "text-white-100" : "text-blue-600"} ${className}`
|
|
481
531
|
}, rest), {
|
|
482
|
-
children: /* @__PURE__ */
|
|
532
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
483
533
|
"svg",
|
|
484
534
|
{
|
|
485
535
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -488,8 +538,8 @@ var Branding = forwardRef5(
|
|
|
488
538
|
viewBox: "0 0 89 20",
|
|
489
539
|
fill: "currentColor",
|
|
490
540
|
children: [
|
|
491
|
-
/* @__PURE__ */
|
|
492
|
-
/* @__PURE__ */
|
|
541
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("g", { "clip-path": "url(#clip0_828_998)", children: [
|
|
542
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
493
543
|
"path",
|
|
494
544
|
{
|
|
495
545
|
"fill-rule": "evenodd",
|
|
@@ -498,14 +548,14 @@ var Branding = forwardRef5(
|
|
|
498
548
|
fill: "currentColor"
|
|
499
549
|
}
|
|
500
550
|
),
|
|
501
|
-
/* @__PURE__ */
|
|
551
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
502
552
|
"path",
|
|
503
553
|
{
|
|
504
554
|
d: "M30.3851 15.1575C31.5816 13.5 34.0989 15.2805 32.9023 16.9379C31.9828 18.1966 30.3241 19.854 27.2241 19.823C23.6241 19.823 20.5575 16.7195 20.4736 12.6379C20.4671 12.5169 20.4671 12.3957 20.4736 12.2747C20.5621 8.18966 23.6241 5.08966 27.1931 5.08966H27.2241C30.815 5.08966 33.977 8.28162 33.977 12.4563C33.979 12.6584 33.9407 12.8588 33.8643 13.0459C33.7879 13.233 33.6749 13.4029 33.532 13.5458C33.3891 13.6887 33.2192 13.8017 33.0321 13.8781C32.845 13.9545 32.6446 13.9928 32.4425 13.9908H23.7851C24.3046 15.5667 25.6023 16.7494 27.223 16.7494H27.254C28.9736 16.7816 29.8943 15.8621 30.3851 15.1575ZM23.7851 10.9195H30.9115C30.9115 10.1828 29.346 8.16093 27.2333 8.16093C25.6023 8.16093 24.3046 9.34598 23.7851 10.9195Z",
|
|
505
555
|
fill: "currentColor"
|
|
506
556
|
}
|
|
507
557
|
),
|
|
508
|
-
/* @__PURE__ */
|
|
558
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
509
559
|
"path",
|
|
510
560
|
{
|
|
511
561
|
"fill-rule": "evenodd",
|
|
@@ -514,7 +564,7 @@ var Branding = forwardRef5(
|
|
|
514
564
|
fill: "currentColor"
|
|
515
565
|
}
|
|
516
566
|
),
|
|
517
|
-
/* @__PURE__ */
|
|
567
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
518
568
|
"path",
|
|
519
569
|
{
|
|
520
570
|
"fill-rule": "evenodd",
|
|
@@ -523,7 +573,7 @@ var Branding = forwardRef5(
|
|
|
523
573
|
fill: "currentColor"
|
|
524
574
|
}
|
|
525
575
|
),
|
|
526
|
-
/* @__PURE__ */
|
|
576
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
527
577
|
"path",
|
|
528
578
|
{
|
|
529
579
|
"fill-rule": "evenodd",
|
|
@@ -532,7 +582,7 @@ var Branding = forwardRef5(
|
|
|
532
582
|
fill: "currentColor"
|
|
533
583
|
}
|
|
534
584
|
),
|
|
535
|
-
/* @__PURE__ */
|
|
585
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
536
586
|
"path",
|
|
537
587
|
{
|
|
538
588
|
"fill-rule": "evenodd",
|
|
@@ -541,7 +591,7 @@ var Branding = forwardRef5(
|
|
|
541
591
|
fill: "currentColor"
|
|
542
592
|
}
|
|
543
593
|
),
|
|
544
|
-
/* @__PURE__ */
|
|
594
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
545
595
|
"path",
|
|
546
596
|
{
|
|
547
597
|
"fill-rule": "evenodd",
|
|
@@ -551,7 +601,7 @@ var Branding = forwardRef5(
|
|
|
551
601
|
}
|
|
552
602
|
)
|
|
553
603
|
] }),
|
|
554
|
-
/* @__PURE__ */
|
|
604
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("clipPath", { id: "clip0_828_998", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { width: "88.892", height: "20", fill: "currentColor" }) }) })
|
|
555
605
|
]
|
|
556
606
|
}
|
|
557
607
|
)
|
|
@@ -562,19 +612,19 @@ var Branding = forwardRef5(
|
|
|
562
612
|
Branding.displayName = "Branding";
|
|
563
613
|
|
|
564
614
|
// src/components/Button/Button.tsx
|
|
565
|
-
|
|
615
|
+
var import_react7 = require("react");
|
|
566
616
|
|
|
567
617
|
// src/components/Loading/Loading.tsx
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
var Loading =
|
|
618
|
+
var import_react6 = require("react");
|
|
619
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
620
|
+
var Loading = (0, import_react6.forwardRef)(
|
|
571
621
|
(_a, ref) => {
|
|
572
622
|
var _b = _a, { size = "sm", isDark = false, className = "" } = _b, rest = __objRest(_b, ["size", "isDark", "className"]);
|
|
573
623
|
const containerClasses = [
|
|
574
624
|
isDark ? "text-white-100" : "text-blue-600",
|
|
575
625
|
className
|
|
576
626
|
].filter(Boolean).join(" ");
|
|
577
|
-
return size === "sm" && !isDark ? /* @__PURE__ */
|
|
627
|
+
return size === "sm" && !isDark ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
578
628
|
"svg",
|
|
579
629
|
{
|
|
580
630
|
className: "animate-spin",
|
|
@@ -584,7 +634,7 @@ var Loading = forwardRef6(
|
|
|
584
634
|
viewBox: "0 0 18 18",
|
|
585
635
|
fill: "none",
|
|
586
636
|
children: [
|
|
587
|
-
/* @__PURE__ */
|
|
637
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
588
638
|
"path",
|
|
589
639
|
{
|
|
590
640
|
d: "M1 9C1 6.87827 1.84286 4.84344 3.34315 3.34315C4.84344 1.84285 6.87827 1 9 1C11.1217 1 13.1566 1.84286 14.6569 3.34315C16.1571 4.84344 17 6.87827 17 9C17 11.1217 16.1571 13.1566 14.6569 14.6569C13.1566 16.1571 11.1217 17 9 17C6.87827 17 4.84344 16.1571 3.34315 14.6569C1.84285 13.1566 1 11.1217 1 9L1 9Z",
|
|
@@ -592,7 +642,7 @@ var Loading = forwardRef6(
|
|
|
592
642
|
"stroke-width": "2"
|
|
593
643
|
}
|
|
594
644
|
),
|
|
595
|
-
/* @__PURE__ */
|
|
645
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
596
646
|
"path",
|
|
597
647
|
{
|
|
598
648
|
d: "M1 9C1 7.31057 1.53484 5.6645 2.52786 4.29772C3.52089 2.93094 4.92112 1.91361 6.52787 1.39155C8.13461 0.869484 9.86539 0.869484 11.4721 1.39155C13.0789 1.91361 14.4791 2.93094 15.4721 4.29772",
|
|
@@ -602,7 +652,7 @@ var Loading = forwardRef6(
|
|
|
602
652
|
)
|
|
603
653
|
]
|
|
604
654
|
}
|
|
605
|
-
) })) : /* @__PURE__ */
|
|
655
|
+
) })) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", __spreadProps(__spreadValues({ ref, className: containerClasses }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
606
656
|
"svg",
|
|
607
657
|
{
|
|
608
658
|
className: "animate-spin",
|
|
@@ -610,7 +660,7 @@ var Loading = forwardRef6(
|
|
|
610
660
|
height: size === "sm" ? 18 : 88,
|
|
611
661
|
viewBox: "0 0 20 20",
|
|
612
662
|
fill: "none",
|
|
613
|
-
children: /* @__PURE__ */
|
|
663
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
614
664
|
"path",
|
|
615
665
|
{
|
|
616
666
|
d: "M10 2.5a7.5 7.5 0 1 0 7.5 7.5",
|
|
@@ -626,7 +676,7 @@ var Loading = forwardRef6(
|
|
|
626
676
|
Loading.displayName = "Loading";
|
|
627
677
|
|
|
628
678
|
// src/components/Button/Button.tsx
|
|
629
|
-
|
|
679
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
630
680
|
var variantClasses = {
|
|
631
681
|
primary: [
|
|
632
682
|
"bg-blue-600 text-white-100",
|
|
@@ -670,7 +720,7 @@ var sizeClasses3 = {
|
|
|
670
720
|
lg: "px-24 py-12 text-label-large",
|
|
671
721
|
xl: "px-32 py-16 text-label-large"
|
|
672
722
|
};
|
|
673
|
-
var Button =
|
|
723
|
+
var Button = (0, import_react7.forwardRef)(
|
|
674
724
|
(_a, ref) => {
|
|
675
725
|
var _b = _a, {
|
|
676
726
|
variant = "primary",
|
|
@@ -705,8 +755,8 @@ var Button = forwardRef7(
|
|
|
705
755
|
rounded ? "rounded-full" : size === "sm" ? "rounded-6" : size === "xl" ? "rounded-12" : "rounded-8",
|
|
706
756
|
className
|
|
707
757
|
].filter(Boolean).join(" ");
|
|
708
|
-
return /* @__PURE__ */
|
|
709
|
-
loading ? /* @__PURE__ */
|
|
758
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", __spreadProps(__spreadValues({ ref, disabled: isDisabled, className: classes }, rest), { children: [
|
|
759
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Loading, { size: "sm", isDark: variant === "primary" || variant === "transparent" }) : startIcon,
|
|
710
760
|
children,
|
|
711
761
|
!loading && endIcon
|
|
712
762
|
] }));
|
|
@@ -715,10 +765,10 @@ var Button = forwardRef7(
|
|
|
715
765
|
Button.displayName = "Button";
|
|
716
766
|
|
|
717
767
|
// src/components/BottomSheet/BottomSheet.tsx
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
var BottomSheet =
|
|
768
|
+
var import_react8 = __toESM(require("react"));
|
|
769
|
+
var import_react_dom = require("react-dom");
|
|
770
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
771
|
+
var BottomSheet = (0, import_react8.forwardRef)(
|
|
722
772
|
(_a, ref) => {
|
|
723
773
|
var _b = _a, {
|
|
724
774
|
isForceOpen = false,
|
|
@@ -745,10 +795,10 @@ var BottomSheet = forwardRef8(
|
|
|
745
795
|
"modalDesc",
|
|
746
796
|
"className"
|
|
747
797
|
]);
|
|
748
|
-
const [isOpen, setIsOpen] =
|
|
749
|
-
const [shouldRender, setShouldRender] =
|
|
750
|
-
const [animate, setAnimate] =
|
|
751
|
-
useEffect(() => {
|
|
798
|
+
const [isOpen, setIsOpen] = (0, import_react8.useState)(false);
|
|
799
|
+
const [shouldRender, setShouldRender] = (0, import_react8.useState)(false);
|
|
800
|
+
const [animate, setAnimate] = (0, import_react8.useState)(false);
|
|
801
|
+
(0, import_react8.useEffect)(() => {
|
|
752
802
|
if (isOpen) {
|
|
753
803
|
setShouldRender(true);
|
|
754
804
|
setTimeout(() => setAnimate(true), 10);
|
|
@@ -758,14 +808,14 @@ var BottomSheet = forwardRef8(
|
|
|
758
808
|
return () => clearTimeout(timer);
|
|
759
809
|
}
|
|
760
810
|
}, [isOpen]);
|
|
761
|
-
useEffect(() => {
|
|
811
|
+
(0, import_react8.useEffect)(() => {
|
|
762
812
|
if (isForceOpen) {
|
|
763
813
|
setIsOpen(true);
|
|
764
814
|
} else {
|
|
765
815
|
setIsOpen(false);
|
|
766
816
|
}
|
|
767
817
|
}, [isForceOpen]);
|
|
768
|
-
const handleStartClick =
|
|
818
|
+
const handleStartClick = (0, import_react8.useCallback)(
|
|
769
819
|
(e) => {
|
|
770
820
|
var _a2, _b2;
|
|
771
821
|
(_b2 = startModalBtn == null ? void 0 : (_a2 = startModalBtn.props).onClick) == null ? void 0 : _b2.call(_a2, e);
|
|
@@ -774,7 +824,7 @@ var BottomSheet = forwardRef8(
|
|
|
774
824
|
},
|
|
775
825
|
[startModalBtn]
|
|
776
826
|
);
|
|
777
|
-
const handleStopClick =
|
|
827
|
+
const handleStopClick = (0, import_react8.useCallback)(
|
|
778
828
|
(e) => {
|
|
779
829
|
var _a2, _b2;
|
|
780
830
|
(_b2 = stopModalBtn == null ? void 0 : (_a2 = stopModalBtn.props).onClick) == null ? void 0 : _b2.call(_a2, e);
|
|
@@ -787,19 +837,19 @@ var BottomSheet = forwardRef8(
|
|
|
787
837
|
setIsForceOpen == null ? void 0 : setIsForceOpen(false);
|
|
788
838
|
setIsOpen(false);
|
|
789
839
|
};
|
|
790
|
-
return /* @__PURE__ */
|
|
791
|
-
startModalBtn &&
|
|
840
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { ref, style: { display: "contents" }, children: [
|
|
841
|
+
startModalBtn && import_react8.default.cloneElement(startModalBtn, {
|
|
792
842
|
onClick: handleStartClick
|
|
793
843
|
}),
|
|
794
|
-
shouldRender && createPortal(
|
|
795
|
-
/* @__PURE__ */
|
|
844
|
+
shouldRender && (0, import_react_dom.createPortal)(
|
|
845
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
796
846
|
"div",
|
|
797
847
|
{
|
|
798
848
|
className: `fixed inset-0 z-50 flex items-end justify-center transition-opacity duration-300 ${animate ? "opacity-100" : "opacity-0"}`,
|
|
799
849
|
"aria-modal": "true",
|
|
800
850
|
role: "dialog",
|
|
801
851
|
children: [
|
|
802
|
-
/* @__PURE__ */
|
|
852
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
803
853
|
"div",
|
|
804
854
|
{
|
|
805
855
|
className: "absolute inset-0 bg-black/40",
|
|
@@ -807,26 +857,26 @@ var BottomSheet = forwardRef8(
|
|
|
807
857
|
"aria-label": "Close modal"
|
|
808
858
|
}
|
|
809
859
|
),
|
|
810
|
-
/* @__PURE__ */
|
|
860
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
811
861
|
"div",
|
|
812
862
|
{
|
|
813
863
|
className: `flex flex-col z-10 w-full rounded-t-xl bg-white pt-8 pb-16 px-16 shadow-lg transform transition-all duration-300
|
|
814
864
|
${size === "sm" ? "h-auto max-h-auto" : size === "md" ? "h-full max-h-[85vh]" : "h-full max-h-screen rounded-t-none!"}
|
|
815
865
|
${animate ? "scale-100 translate-y-0" : "scale-95 translate-y-full"}`,
|
|
816
866
|
children: [
|
|
817
|
-
/* @__PURE__ */
|
|
818
|
-
/* @__PURE__ */
|
|
819
|
-
/* @__PURE__ */
|
|
820
|
-
/* @__PURE__ */
|
|
867
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "w-full flex flex-row relative items-center pt-8 pb-16", children: [
|
|
868
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-col px-8 max-w-225", children: [
|
|
869
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "text-heading-3 text-button-sheet-text-primary", children: modalTitle }),
|
|
870
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "text-body-small text-button-sheet-text-secondary", children: modalDesc })
|
|
821
871
|
] }),
|
|
822
|
-
/* @__PURE__ */
|
|
872
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
823
873
|
"i",
|
|
824
874
|
{
|
|
825
875
|
className: "fi fi-br-cross-small flex text-xl text-gray-600 w-44 h-44 absolute top-0 right-0 p-12",
|
|
826
876
|
onClick: () => handleCloseClick()
|
|
827
877
|
}
|
|
828
878
|
),
|
|
829
|
-
/* @__PURE__ */
|
|
879
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
830
880
|
"div",
|
|
831
881
|
{
|
|
832
882
|
className: "text-gray-600 text-xl absolute top-0 right-0 p-12",
|
|
@@ -835,9 +885,9 @@ var BottomSheet = forwardRef8(
|
|
|
835
885
|
}
|
|
836
886
|
)
|
|
837
887
|
] }),
|
|
838
|
-
/* @__PURE__ */
|
|
888
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "w-full h-full grow overflow-y-auto overflow-x-visible", children: [
|
|
839
889
|
children,
|
|
840
|
-
stopModalBtn &&
|
|
890
|
+
stopModalBtn && import_react8.default.cloneElement(stopModalBtn, {
|
|
841
891
|
onClick: handleStopClick
|
|
842
892
|
}),
|
|
843
893
|
afterStopBtn && afterStopBtn
|
|
@@ -856,21 +906,17 @@ var BottomSheet = forwardRef8(
|
|
|
856
906
|
BottomSheet.displayName = "BottomSheet";
|
|
857
907
|
|
|
858
908
|
// src/components/Checkbox/Checkbox.tsx
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
useId as useId2,
|
|
862
|
-
useState as useState3
|
|
863
|
-
} from "react";
|
|
864
|
-
import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
909
|
+
var import_react9 = require("react");
|
|
910
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
865
911
|
function CheckIcon({ className }) {
|
|
866
|
-
return /* @__PURE__ */
|
|
912
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
867
913
|
"svg",
|
|
868
914
|
{
|
|
869
915
|
className,
|
|
870
916
|
viewBox: "0 0 16 16",
|
|
871
917
|
fill: "none",
|
|
872
918
|
"aria-hidden": "true",
|
|
873
|
-
children: /* @__PURE__ */
|
|
919
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
874
920
|
"path",
|
|
875
921
|
{
|
|
876
922
|
d: "M13.333 4.667 6 12l-3.333-3.333",
|
|
@@ -884,14 +930,14 @@ function CheckIcon({ className }) {
|
|
|
884
930
|
);
|
|
885
931
|
}
|
|
886
932
|
function IndeterminateIcon({ className }) {
|
|
887
|
-
return /* @__PURE__ */
|
|
933
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
888
934
|
"svg",
|
|
889
935
|
{
|
|
890
936
|
className,
|
|
891
937
|
viewBox: "0 0 16 16",
|
|
892
938
|
fill: "none",
|
|
893
939
|
"aria-hidden": "true",
|
|
894
|
-
children: /* @__PURE__ */
|
|
940
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
895
941
|
"path",
|
|
896
942
|
{
|
|
897
943
|
d: "M3.333 8h9.334",
|
|
@@ -903,7 +949,7 @@ function IndeterminateIcon({ className }) {
|
|
|
903
949
|
}
|
|
904
950
|
);
|
|
905
951
|
}
|
|
906
|
-
var Checkbox =
|
|
952
|
+
var Checkbox = (0, import_react9.forwardRef)(
|
|
907
953
|
(_a, ref) => {
|
|
908
954
|
var _b = _a, {
|
|
909
955
|
label,
|
|
@@ -926,17 +972,17 @@ var Checkbox = forwardRef9(
|
|
|
926
972
|
"id",
|
|
927
973
|
"defaultChecked"
|
|
928
974
|
]);
|
|
929
|
-
const reactId =
|
|
975
|
+
const reactId = (0, import_react9.useId)();
|
|
930
976
|
const inputId = id != null ? id : reactId;
|
|
931
|
-
const [isChecked, setIsChecked] =
|
|
932
|
-
return /* @__PURE__ */
|
|
977
|
+
const [isChecked, setIsChecked] = (0, import_react9.useState)(defaultChecked != null ? defaultChecked : false);
|
|
978
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
933
979
|
"label",
|
|
934
980
|
{
|
|
935
981
|
htmlFor: inputId,
|
|
936
982
|
className: `flex select-none font-sans ${disabled ? "cursor-not-allowed" : "cursor-pointer"} ${className}`,
|
|
937
983
|
children: [
|
|
938
|
-
/* @__PURE__ */
|
|
939
|
-
/* @__PURE__ */
|
|
984
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "relative mr-16", children: [
|
|
985
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
940
986
|
"input",
|
|
941
987
|
__spreadValues({
|
|
942
988
|
ref,
|
|
@@ -953,16 +999,16 @@ var Checkbox = forwardRef9(
|
|
|
953
999
|
className: "sr-only"
|
|
954
1000
|
}, rest)
|
|
955
1001
|
),
|
|
956
|
-
/* @__PURE__ */
|
|
1002
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
957
1003
|
"div",
|
|
958
1004
|
{
|
|
959
1005
|
className: `box m-6 flex h-20 w-20 rounded-md items-center justify-center border ${contrast ? isChecked || indeterminate ? "border-white bg-white" : "border-white" : isChecked || indeterminate ? "bg-static-icon-brand border-static-icon-brand" : "border-static-icon-primary"}`,
|
|
960
|
-
children: isChecked ? /* @__PURE__ */
|
|
1006
|
+
children: isChecked ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
961
1007
|
CheckIcon,
|
|
962
1008
|
{
|
|
963
1009
|
className: `h-20 ${contrast ? "text-static-icon-brand" : "text-white"}`
|
|
964
1010
|
}
|
|
965
|
-
) : indeterminate ? /* @__PURE__ */
|
|
1011
|
+
) : indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
966
1012
|
IndeterminateIcon,
|
|
967
1013
|
{
|
|
968
1014
|
className: `h-20 ${contrast ? "text-static-icon-brand" : "text-white"}`
|
|
@@ -971,15 +1017,15 @@ var Checkbox = forwardRef9(
|
|
|
971
1017
|
}
|
|
972
1018
|
)
|
|
973
1019
|
] }),
|
|
974
|
-
(label || description) && /* @__PURE__ */
|
|
975
|
-
label && /* @__PURE__ */
|
|
1020
|
+
(label || description) && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "flex flex-col", children: [
|
|
1021
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
976
1022
|
"span",
|
|
977
1023
|
{
|
|
978
1024
|
className: `text-label-large ${disabled ? "text-checkbox-text-disabled" : contrast ? "text-checkbox-text-primary-inverse" : "text-checkbox-text-primary"}`,
|
|
979
1025
|
children: label
|
|
980
1026
|
}
|
|
981
1027
|
),
|
|
982
|
-
description && /* @__PURE__ */
|
|
1028
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
983
1029
|
"span",
|
|
984
1030
|
{
|
|
985
1031
|
className: `text-body-small ${error ? "text-checkbox-text-danger" : disabled ? "text-checkbox-text-disabled" : contrast ? "text-checkbox-text-primary-inverse" : "text-checkbox-text-secondary"}`,
|
|
@@ -995,11 +1041,8 @@ var Checkbox = forwardRef9(
|
|
|
995
1041
|
Checkbox.displayName = "Checkbox";
|
|
996
1042
|
|
|
997
1043
|
// src/components/Chip/Chip.tsx
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
useState as useState4
|
|
1001
|
-
} from "react";
|
|
1002
|
-
import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1044
|
+
var import_react10 = require("react");
|
|
1045
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
1003
1046
|
var sizeClasses4 = {
|
|
1004
1047
|
sm: "h-32 text-label-medium px-12 py-6",
|
|
1005
1048
|
md: "h-40 text-label-large px-16 py-10",
|
|
@@ -1018,7 +1061,7 @@ var isDarkClasses = {
|
|
|
1018
1061
|
true: "!bg-chip-background-black-active !text-chip-text-inverse",
|
|
1019
1062
|
false: "!bg-chip-background-active !text-chip-text-inverse"
|
|
1020
1063
|
};
|
|
1021
|
-
var Chip =
|
|
1064
|
+
var Chip = (0, import_react10.forwardRef)(
|
|
1022
1065
|
(_a, ref) => {
|
|
1023
1066
|
var _b = _a, {
|
|
1024
1067
|
size = "md",
|
|
@@ -1043,7 +1086,7 @@ var Chip = forwardRef10(
|
|
|
1043
1086
|
"disabled",
|
|
1044
1087
|
"className"
|
|
1045
1088
|
]);
|
|
1046
|
-
const [selected, setSelected] =
|
|
1089
|
+
const [selected, setSelected] = (0, import_react10.useState)(defaultSelected);
|
|
1047
1090
|
const sz = sizeClasses4[size];
|
|
1048
1091
|
const outlinedClass = isOutlinedClasses[String(isOutlined)];
|
|
1049
1092
|
const darkClass = isDarkClasses[String(isDark)];
|
|
@@ -1055,7 +1098,7 @@ var Chip = forwardRef10(
|
|
|
1055
1098
|
className,
|
|
1056
1099
|
selected ? darkClass : ""
|
|
1057
1100
|
].filter(Boolean).join(" ");
|
|
1058
|
-
return /* @__PURE__ */
|
|
1101
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
|
|
1059
1102
|
"div",
|
|
1060
1103
|
__spreadProps(__spreadValues({
|
|
1061
1104
|
ref,
|
|
@@ -1063,7 +1106,7 @@ var Chip = forwardRef10(
|
|
|
1063
1106
|
}, rest), {
|
|
1064
1107
|
onClick: () => !disabled && setSelected(!selected),
|
|
1065
1108
|
children: [
|
|
1066
|
-
icon ? icon : src && /* @__PURE__ */
|
|
1109
|
+
icon ? icon : src && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("img", { src, alt, className: `${marginImgClasses[size]} rounded-full` }),
|
|
1067
1110
|
label
|
|
1068
1111
|
]
|
|
1069
1112
|
})
|
|
@@ -1073,15 +1116,10 @@ var Chip = forwardRef10(
|
|
|
1073
1116
|
Chip.displayName = "Chip";
|
|
1074
1117
|
|
|
1075
1118
|
// src/components/Dialog/Dialog.tsx
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
forwardRef as forwardRef11
|
|
1081
|
-
} from "react";
|
|
1082
|
-
import { createPortal as createPortal2 } from "react-dom";
|
|
1083
|
-
import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1084
|
-
var Dialog = forwardRef11(
|
|
1119
|
+
var import_react11 = __toESM(require("react"));
|
|
1120
|
+
var import_react_dom2 = require("react-dom");
|
|
1121
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1122
|
+
var Dialog = (0, import_react11.forwardRef)(
|
|
1085
1123
|
({
|
|
1086
1124
|
isForceOpen = false,
|
|
1087
1125
|
setIsForceOpen,
|
|
@@ -1094,10 +1132,10 @@ var Dialog = forwardRef11(
|
|
|
1094
1132
|
p = "20",
|
|
1095
1133
|
maxW = "md"
|
|
1096
1134
|
}, ref) => {
|
|
1097
|
-
const [isOpen, setIsOpen] =
|
|
1098
|
-
const [isRender, setIsRender] =
|
|
1099
|
-
const [animate, setAnimate] =
|
|
1100
|
-
|
|
1135
|
+
const [isOpen, setIsOpen] = (0, import_react11.useState)(false);
|
|
1136
|
+
const [isRender, setIsRender] = (0, import_react11.useState)(false);
|
|
1137
|
+
const [animate, setAnimate] = (0, import_react11.useState)(false);
|
|
1138
|
+
(0, import_react11.useEffect)(() => {
|
|
1101
1139
|
if (isOpen) {
|
|
1102
1140
|
setIsRender(true);
|
|
1103
1141
|
setTimeout(() => setAnimate(true), 10);
|
|
@@ -1107,14 +1145,14 @@ var Dialog = forwardRef11(
|
|
|
1107
1145
|
return () => clearTimeout(timer);
|
|
1108
1146
|
}
|
|
1109
1147
|
}, [isOpen]);
|
|
1110
|
-
|
|
1148
|
+
(0, import_react11.useEffect)(() => {
|
|
1111
1149
|
if (isForceOpen) {
|
|
1112
1150
|
setIsOpen(true);
|
|
1113
1151
|
} else {
|
|
1114
1152
|
setIsOpen(false);
|
|
1115
1153
|
}
|
|
1116
1154
|
}, [isForceOpen]);
|
|
1117
|
-
const handleStartClick =
|
|
1155
|
+
const handleStartClick = (0, import_react11.useCallback)(
|
|
1118
1156
|
(e) => {
|
|
1119
1157
|
var _a, _b;
|
|
1120
1158
|
(_b = startModalBtn == null ? void 0 : (_a = startModalBtn.props).onClick) == null ? void 0 : _b.call(_a, e);
|
|
@@ -1123,7 +1161,7 @@ var Dialog = forwardRef11(
|
|
|
1123
1161
|
},
|
|
1124
1162
|
[startModalBtn]
|
|
1125
1163
|
);
|
|
1126
|
-
const handleStopClick =
|
|
1164
|
+
const handleStopClick = (0, import_react11.useCallback)(
|
|
1127
1165
|
(e) => {
|
|
1128
1166
|
var _a, _b;
|
|
1129
1167
|
(_b = stopModalBtn == null ? void 0 : (_a = stopModalBtn.props).onClick) == null ? void 0 : _b.call(_a, e);
|
|
@@ -1136,19 +1174,19 @@ var Dialog = forwardRef11(
|
|
|
1136
1174
|
setIsForceOpen == null ? void 0 : setIsForceOpen(false);
|
|
1137
1175
|
setIsOpen(false);
|
|
1138
1176
|
};
|
|
1139
|
-
return /* @__PURE__ */
|
|
1140
|
-
startModalBtn &&
|
|
1177
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { ref, style: { display: "contents" }, children: [
|
|
1178
|
+
startModalBtn && import_react11.default.cloneElement(startModalBtn, {
|
|
1141
1179
|
onClick: handleStartClick
|
|
1142
1180
|
}),
|
|
1143
|
-
isRender &&
|
|
1144
|
-
/* @__PURE__ */
|
|
1181
|
+
isRender && (0, import_react_dom2.createPortal)(
|
|
1182
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
|
|
1145
1183
|
"div",
|
|
1146
1184
|
{
|
|
1147
1185
|
className: `fixed inset-0 z-50 flex items-center justify-center transition-opacity duration-300 ${animate ? "opacity-100" : "opacity-0"}`,
|
|
1148
1186
|
"aria-modal": "true",
|
|
1149
1187
|
role: "dialog",
|
|
1150
1188
|
children: [
|
|
1151
|
-
/* @__PURE__ */
|
|
1189
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1152
1190
|
"div",
|
|
1153
1191
|
{
|
|
1154
1192
|
className: "absolute inset-0 bg-black/40",
|
|
@@ -1156,12 +1194,12 @@ var Dialog = forwardRef11(
|
|
|
1156
1194
|
"aria-label": "Close modal"
|
|
1157
1195
|
}
|
|
1158
1196
|
),
|
|
1159
|
-
/* @__PURE__ */
|
|
1197
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
|
|
1160
1198
|
"div",
|
|
1161
1199
|
{
|
|
1162
1200
|
className: `relative z-10 w-[calc(100%-40px)] max-w-${maxW} rounded-xl bg-white p-${p || "20"} shadow-lg transform transition-all duration-300 ${animate ? "scale-100 opacity-100" : "scale-95 opacity-0"}`,
|
|
1163
1201
|
children: [
|
|
1164
|
-
isCloseIcon && /* @__PURE__ */
|
|
1202
|
+
isCloseIcon && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1165
1203
|
"svg",
|
|
1166
1204
|
{
|
|
1167
1205
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1174,7 +1212,7 @@ var Dialog = forwardRef11(
|
|
|
1174
1212
|
e.preventDefault();
|
|
1175
1213
|
handleCloseClick();
|
|
1176
1214
|
},
|
|
1177
|
-
children: /* @__PURE__ */
|
|
1215
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1178
1216
|
"path",
|
|
1179
1217
|
{
|
|
1180
1218
|
d: "M14.7119 6.0625L10.7744 10L14.7119 13.9375L13.9375 14.7119L10 10.7744L6.0625 14.7119L5.28809 13.9375L9.22559 10L5.28809 6.0625L6.0625 5.28809L10 9.22559L13.9375 5.28809L14.7119 6.0625Z",
|
|
@@ -1184,7 +1222,7 @@ var Dialog = forwardRef11(
|
|
|
1184
1222
|
}
|
|
1185
1223
|
),
|
|
1186
1224
|
children,
|
|
1187
|
-
stopModalBtn &&
|
|
1225
|
+
stopModalBtn && import_react11.default.cloneElement(stopModalBtn, {
|
|
1188
1226
|
onClick: handleStopClick
|
|
1189
1227
|
}),
|
|
1190
1228
|
afterStopBtn && afterStopBtn
|
|
@@ -1202,9 +1240,9 @@ var Dialog = forwardRef11(
|
|
|
1202
1240
|
Dialog.displayName = "Dialog";
|
|
1203
1241
|
|
|
1204
1242
|
// src/components/Dropdown/Dropdown.tsx
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
var IconDanger = () => /* @__PURE__ */
|
|
1243
|
+
var import_react12 = require("react");
|
|
1244
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
1245
|
+
var IconDanger = () => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1208
1246
|
"svg",
|
|
1209
1247
|
{
|
|
1210
1248
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1212,7 +1250,7 @@ var IconDanger = () => /* @__PURE__ */ jsx12(
|
|
|
1212
1250
|
height: "20",
|
|
1213
1251
|
viewBox: "0 0 20 20",
|
|
1214
1252
|
fill: "none",
|
|
1215
|
-
children: /* @__PURE__ */
|
|
1253
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1216
1254
|
"path",
|
|
1217
1255
|
{
|
|
1218
1256
|
d: "M10.0078 2.41699C11.0548 2.41699 12.0363 2.61407 12.9512 3.00879C13.8657 3.40341 14.6687 3.94646 15.3604 4.6377C16.0522 5.32922 16.5962 6.13426 16.9912 7.05176C17.386 7.96936 17.583 8.95002 17.583 9.99316C17.583 11.0363 17.3859 12.0187 16.9912 12.9404C16.5966 13.862 16.0536 14.6687 15.3623 15.3604C14.6708 16.0522 13.8657 16.5962 12.9482 16.9912C12.0306 17.386 11.05 17.583 10.0068 17.583C8.96373 17.583 7.9813 17.3859 7.05957 16.9912C6.13798 16.5966 5.33135 16.0536 4.63965 15.3623C3.94784 14.6708 3.40379 13.8642 3.00879 12.9434C2.61398 12.0228 2.41703 11.039 2.41699 9.99219C2.41699 8.94524 2.61407 7.96369 3.00879 7.04883C3.40341 6.13429 3.94646 5.33128 4.6377 4.63965C5.32922 3.94784 6.13581 3.40379 7.05664 3.00879C7.97723 2.61398 8.961 2.41703 10.0078 2.41699ZM10.0039 12.5967C9.83828 12.5968 9.69804 12.6527 9.58301 12.7646C9.46793 12.8769 9.41016 13.0159 9.41016 13.1816C9.4102 13.3472 9.46621 13.4875 9.57812 13.6025C9.69035 13.7177 9.83026 13.7754 9.99609 13.7754C10.1617 13.7753 10.302 13.7195 10.417 13.6074C10.5321 13.4952 10.5898 13.3562 10.5898 13.1904C10.5898 13.0246 10.534 12.8837 10.4219 12.7686C10.3097 12.6536 10.1697 12.5967 10.0039 12.5967ZM9.45801 11.0645H10.542V6.06445H9.45801V11.0645Z",
|
|
@@ -1222,7 +1260,7 @@ var IconDanger = () => /* @__PURE__ */ jsx12(
|
|
|
1222
1260
|
}
|
|
1223
1261
|
);
|
|
1224
1262
|
function IconCheck({ className }) {
|
|
1225
|
-
return /* @__PURE__ */
|
|
1263
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1226
1264
|
"svg",
|
|
1227
1265
|
{
|
|
1228
1266
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1231,7 +1269,7 @@ function IconCheck({ className }) {
|
|
|
1231
1269
|
viewBox: "0 0 20 20",
|
|
1232
1270
|
fill: "none",
|
|
1233
1271
|
className,
|
|
1234
|
-
children: /* @__PURE__ */
|
|
1272
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1235
1273
|
"path",
|
|
1236
1274
|
{
|
|
1237
1275
|
d: "M15.6328 6.64062L8.10449 14.1494L4.36719 10.4326L5.13281 9.64551L8.10449 12.6172L14.8672 5.875L15.6328 6.64062Z",
|
|
@@ -1242,7 +1280,7 @@ function IconCheck({ className }) {
|
|
|
1242
1280
|
);
|
|
1243
1281
|
}
|
|
1244
1282
|
function ChevronDown({ className }) {
|
|
1245
|
-
return /* @__PURE__ */
|
|
1283
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1246
1284
|
"svg",
|
|
1247
1285
|
{
|
|
1248
1286
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1251,7 +1289,7 @@ function ChevronDown({ className }) {
|
|
|
1251
1289
|
viewBox: "0 0 20 20",
|
|
1252
1290
|
fill: "none",
|
|
1253
1291
|
className,
|
|
1254
|
-
children: /* @__PURE__ */
|
|
1292
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1255
1293
|
"path",
|
|
1256
1294
|
{
|
|
1257
1295
|
d: "M14.7119 8.0625L10 12.7744L5.28809 8.0625L6.0625 7.28809L10 11.2256L13.9375 7.28809L14.7119 8.0625Z",
|
|
@@ -1278,13 +1316,13 @@ var Dropdown = ({
|
|
|
1278
1316
|
{ label: "Maria Garcia", value: "Maria Garcia" }
|
|
1279
1317
|
]
|
|
1280
1318
|
}) => {
|
|
1281
|
-
const [isOpen, setIsOpen] =
|
|
1282
|
-
const [search, setSearch] =
|
|
1283
|
-
const dropdownRef = useRef(null);
|
|
1319
|
+
const [isOpen, setIsOpen] = (0, import_react12.useState)(false);
|
|
1320
|
+
const [search, setSearch] = (0, import_react12.useState)("");
|
|
1321
|
+
const dropdownRef = (0, import_react12.useRef)(null);
|
|
1284
1322
|
const filteredItems = dropDownItems.filter(
|
|
1285
1323
|
(item) => item.label.toLowerCase().includes(search.toLowerCase())
|
|
1286
1324
|
);
|
|
1287
|
-
|
|
1325
|
+
(0, import_react12.useEffect)(() => {
|
|
1288
1326
|
function handleClickOutside(event) {
|
|
1289
1327
|
if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
1290
1328
|
setIsOpen(false);
|
|
@@ -1295,16 +1333,16 @@ var Dropdown = ({
|
|
|
1295
1333
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
1296
1334
|
};
|
|
1297
1335
|
}, []);
|
|
1298
|
-
return /* @__PURE__ */
|
|
1299
|
-
label ? /* @__PURE__ */
|
|
1336
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "w-full", children: [
|
|
1337
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1300
1338
|
"p",
|
|
1301
1339
|
{
|
|
1302
1340
|
className: `text-label-medium text-left items-left font-medium mb-4 ${isDisabled ? "text-dropdown-text-disabled" : "text-dropdown-text-primary"}`,
|
|
1303
1341
|
children: label
|
|
1304
1342
|
}
|
|
1305
|
-
) : /* @__PURE__ */
|
|
1306
|
-
/* @__PURE__ */
|
|
1307
|
-
/* @__PURE__ */
|
|
1343
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, {}),
|
|
1344
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "w-full flex flex-col relative", ref: dropdownRef, children: [
|
|
1345
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
1308
1346
|
"button",
|
|
1309
1347
|
{
|
|
1310
1348
|
onClick: () => !isDisabled && setIsOpen(!isOpen),
|
|
@@ -1312,10 +1350,10 @@ var Dropdown = ({
|
|
|
1312
1350
|
${isDisabled ? "pointer-events-none bg-dropdown-background-disabled text-dropdown-text-disabled border-dropdown-border-disabled" : error ? "border-red-600 bg-dropdown-background-enabled focus:border-red-600" : value ? "text-dropdown-text-primary bg-dropdown-background-enabled border-dropdown-border-enabled focus:border-dropdown-border-active " : "text-dropdown-text-secondary bg-dropdown-background-enabled border-dropdown-border-enabled focus:border-dropdown-border-active "} `,
|
|
1313
1351
|
type: "button",
|
|
1314
1352
|
children: [
|
|
1315
|
-
/* @__PURE__ */
|
|
1316
|
-
/* @__PURE__ */
|
|
1317
|
-
isDisabled ? /* @__PURE__ */
|
|
1318
|
-
/* @__PURE__ */
|
|
1353
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: `grow ${isTextCenter ? "text-center" : "text-start"}`, children: value.label || placeholder }),
|
|
1354
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center gap-8", children: [
|
|
1355
|
+
isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, {}) : error ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconDanger, {}) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, {}),
|
|
1356
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1319
1357
|
ChevronDown,
|
|
1320
1358
|
{
|
|
1321
1359
|
className: `h-20 w-20 duration-300 ${isOpen ? "rotate-180" : ""}`
|
|
@@ -1325,16 +1363,16 @@ var Dropdown = ({
|
|
|
1325
1363
|
]
|
|
1326
1364
|
}
|
|
1327
1365
|
),
|
|
1328
|
-
/* @__PURE__ */
|
|
1366
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
1329
1367
|
"div",
|
|
1330
1368
|
{
|
|
1331
1369
|
id: "dropdownSearch",
|
|
1332
1370
|
className: `${isOpen ? "flex" : "hidden"} top-[calc(100%+4px)] left-8 absolute z-10000 bg-white-100 rounded-lg shadow-base w-9/10 min-w-fit flex-col`,
|
|
1333
1371
|
children: [
|
|
1334
|
-
isSearchable ? /* @__PURE__ */
|
|
1335
|
-
/* @__PURE__ */
|
|
1336
|
-
/* @__PURE__ */
|
|
1337
|
-
/* @__PURE__ */
|
|
1372
|
+
isSearchable ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "p-3", children: [
|
|
1373
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("label", { htmlFor: "input-group-search", className: "sr-only", children: "Search" }),
|
|
1374
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "relative", children: [
|
|
1375
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "absolute inset-y-0 rtl:inset-r-0 inset-s-0 flex items-center ps-12 pointer-events-none", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
1338
1376
|
"svg",
|
|
1339
1377
|
{
|
|
1340
1378
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1343,7 +1381,7 @@ var Dropdown = ({
|
|
|
1343
1381
|
viewBox: "0 0 20 20",
|
|
1344
1382
|
fill: "none",
|
|
1345
1383
|
children: [
|
|
1346
|
-
/* @__PURE__ */
|
|
1384
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1347
1385
|
"mask",
|
|
1348
1386
|
{
|
|
1349
1387
|
id: "mask0_3218_5077",
|
|
@@ -1353,10 +1391,10 @@ var Dropdown = ({
|
|
|
1353
1391
|
y: "0",
|
|
1354
1392
|
width: "20",
|
|
1355
1393
|
height: "20",
|
|
1356
|
-
children: /* @__PURE__ */
|
|
1394
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("rect", { width: "20", height: "20", fill: "#D9D9D9" })
|
|
1357
1395
|
}
|
|
1358
1396
|
),
|
|
1359
|
-
/* @__PURE__ */
|
|
1397
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("g", { mask: "url(#mask0_3218_5077)", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1360
1398
|
"path",
|
|
1361
1399
|
{
|
|
1362
1400
|
d: "M15.8894 16.6476L10.9263 11.6842C10.5096 12.0005 10.0527 12.2454 9.55563 12.419C9.05855 12.5926 8.54556 12.6794 8.01667 12.6794C6.7182 12.6794 5.61354 12.2241 4.70271 11.3134C3.79202 10.4026 3.33667 9.29811 3.33667 8.00005C3.33667 6.702 3.79202 5.59755 4.70271 4.68672C5.61354 3.77603 6.71799 3.32068 8.01604 3.32068C9.3141 3.32068 10.4185 3.77603 11.3294 4.68672C12.2401 5.59755 12.6954 6.70221 12.6954 8.00068C12.6954 8.54554 12.606 9.06651 12.4271 9.56359C12.2481 10.0608 12.0058 10.5097 11.7002 10.9103L16.6633 15.8734L15.8894 16.6476ZM8.01604 11.5963C9.02035 11.5963 9.87077 11.248 10.5673 10.5513C11.264 9.85478 11.6123 9.00436 11.6123 8.00005C11.6123 6.99575 11.264 6.14533 10.5673 5.4488C9.87077 4.75214 9.02035 4.4038 8.01604 4.4038C7.01174 4.4038 6.16132 4.75214 5.46479 5.4488C4.76813 6.14533 4.41979 6.99575 4.41979 8.00005C4.41979 9.00436 4.76813 9.85478 5.46479 10.5513C6.16132 11.248 7.01174 11.5963 8.01604 11.5963Z",
|
|
@@ -1366,7 +1404,7 @@ var Dropdown = ({
|
|
|
1366
1404
|
]
|
|
1367
1405
|
}
|
|
1368
1406
|
) }),
|
|
1369
|
-
/* @__PURE__ */
|
|
1407
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1370
1408
|
"input",
|
|
1371
1409
|
{
|
|
1372
1410
|
type: "text",
|
|
@@ -1377,13 +1415,13 @@ var Dropdown = ({
|
|
|
1377
1415
|
}
|
|
1378
1416
|
)
|
|
1379
1417
|
] })
|
|
1380
|
-
] }) : /* @__PURE__ */
|
|
1381
|
-
/* @__PURE__ */
|
|
1418
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, {}),
|
|
1419
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1382
1420
|
"ul",
|
|
1383
1421
|
{
|
|
1384
1422
|
className: "h-auto max-h-392 overflow-y-auto cursor-pointer",
|
|
1385
1423
|
"aria-labelledby": "dropdownSearchButton",
|
|
1386
|
-
children: filteredItems.length > 0 ? filteredItems.map((item, idx) => /* @__PURE__ */
|
|
1424
|
+
children: filteredItems.length > 0 ? filteredItems.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
1387
1425
|
"div",
|
|
1388
1426
|
{
|
|
1389
1427
|
onClick: () => {
|
|
@@ -1394,30 +1432,30 @@ var Dropdown = ({
|
|
|
1394
1432
|
className: "relative text-gray-900 py-12 px-16 rounded-sm text-label-medium hover:bg-gray-100",
|
|
1395
1433
|
children: [
|
|
1396
1434
|
item.label,
|
|
1397
|
-
value.value === item.value && /* @__PURE__ */
|
|
1435
|
+
value.value === item.value && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconCheck, { className: "absolute h-20 w-20 right-24 top-2 translate-y-1/2" })
|
|
1398
1436
|
]
|
|
1399
1437
|
}
|
|
1400
|
-
) }, idx)) : /* @__PURE__ */
|
|
1438
|
+
) }, idx)) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("li", { className: "px-8 py-8 text-label-medium text-gray-900", children: "No results found" })
|
|
1401
1439
|
}
|
|
1402
1440
|
)
|
|
1403
1441
|
]
|
|
1404
1442
|
}
|
|
1405
1443
|
)
|
|
1406
1444
|
] }),
|
|
1407
|
-
error ? /* @__PURE__ */
|
|
1445
|
+
error ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1408
1446
|
"p",
|
|
1409
1447
|
{
|
|
1410
1448
|
className: `text-caption-caption text-left items-left text-dropdown-text-danger mt-4 ${isDisabled ? "hidden" : ""}`,
|
|
1411
1449
|
children: error
|
|
1412
1450
|
}
|
|
1413
|
-
) : /* @__PURE__ */
|
|
1451
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, {})
|
|
1414
1452
|
] });
|
|
1415
1453
|
};
|
|
1416
1454
|
Dropdown.displayName = "Dropdown";
|
|
1417
1455
|
|
|
1418
1456
|
// src/components/FinancialLogo/FinancialLogo.tsx
|
|
1419
|
-
|
|
1420
|
-
|
|
1457
|
+
var import_react13 = require("react");
|
|
1458
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
1421
1459
|
var inlineClasses2 = {
|
|
1422
1460
|
info: "bg-alert-inline-info-bg border-alert-inline-info-border text-alert-text-primary",
|
|
1423
1461
|
success: "bg-alert-inline-success-bg border-alert-inline-success-border text-alert-text-primary",
|
|
@@ -1447,25 +1485,25 @@ var inlineIconClasses2 = {
|
|
|
1447
1485
|
common: "text-alert-inline-common-icon"
|
|
1448
1486
|
};
|
|
1449
1487
|
function InfoIcon2({ className }) {
|
|
1450
|
-
return /* @__PURE__ */
|
|
1488
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM10 6h.01M9 10h1v4h1", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
1451
1489
|
}
|
|
1452
1490
|
function SuccessIcon2({ className }) {
|
|
1453
|
-
return /* @__PURE__ */
|
|
1454
|
-
/* @__PURE__ */
|
|
1455
|
-
/* @__PURE__ */
|
|
1491
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
|
|
1492
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
1493
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
|
|
1456
1494
|
] });
|
|
1457
1495
|
}
|
|
1458
1496
|
function WarningIcon2({ className }) {
|
|
1459
|
-
return /* @__PURE__ */
|
|
1497
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M8.57 3.22 1.53 15.5a1.67 1.67 0 0 0 1.43 2.5h14.08a1.67 1.67 0 0 0 1.43-2.5L11.43 3.22a1.67 1.67 0 0 0-2.86 0ZM10 7.5v3.33M10 14.17h.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
1460
1498
|
}
|
|
1461
1499
|
function DangerIcon2({ className }) {
|
|
1462
|
-
return /* @__PURE__ */
|
|
1500
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM12.5 7.5l-5 5M7.5 7.5l5 5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
1463
1501
|
}
|
|
1464
1502
|
function CommonIcon({ className }) {
|
|
1465
|
-
return /* @__PURE__ */
|
|
1503
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM10 6v4M10 14h.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
1466
1504
|
}
|
|
1467
1505
|
function CloseIcon2({ className }) {
|
|
1468
|
-
return /* @__PURE__ */
|
|
1506
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className, width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M12 4 4 12M4 4l8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
1469
1507
|
}
|
|
1470
1508
|
var defaultIcons2 = {
|
|
1471
1509
|
info: InfoIcon2,
|
|
@@ -1474,7 +1512,7 @@ var defaultIcons2 = {
|
|
|
1474
1512
|
danger: DangerIcon2,
|
|
1475
1513
|
common: CommonIcon
|
|
1476
1514
|
};
|
|
1477
|
-
var FinancialLogo =
|
|
1515
|
+
var FinancialLogo = (0, import_react13.forwardRef)(
|
|
1478
1516
|
(_a, ref) => {
|
|
1479
1517
|
var _b = _a, {
|
|
1480
1518
|
variant = "info",
|
|
@@ -1510,22 +1548,22 @@ var FinancialLogo = forwardRef12(
|
|
|
1510
1548
|
variantClass,
|
|
1511
1549
|
className
|
|
1512
1550
|
].filter(Boolean).join(" ");
|
|
1513
|
-
return /* @__PURE__ */
|
|
1514
|
-
/* @__PURE__ */
|
|
1515
|
-
/* @__PURE__ */
|
|
1516
|
-
title && /* @__PURE__ */
|
|
1517
|
-
description && /* @__PURE__ */
|
|
1551
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", __spreadProps(__spreadValues({ ref, role: "alert", className: classes }, rest), { children: [
|
|
1552
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: `shrink-0 mt-2 ${iconColorClass}`, children: icon != null ? icon : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DefaultIcon, { className: "h-20 w-20" }) }),
|
|
1553
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex-1 min-w-0", children: [
|
|
1554
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-sm font-medium leading-20", children: title }),
|
|
1555
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: `text-sm leading-20 ${descColorClass} ${title ? "mt-4" : ""}`, children: description }),
|
|
1518
1556
|
children
|
|
1519
1557
|
] }),
|
|
1520
|
-
action && /* @__PURE__ */
|
|
1521
|
-
onClose && /* @__PURE__ */
|
|
1558
|
+
action && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: `${actionClass} underline text-sm font-medium`, children: action }),
|
|
1559
|
+
onClose && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
1522
1560
|
"button",
|
|
1523
1561
|
{
|
|
1524
1562
|
type: "button",
|
|
1525
1563
|
onClick: onClose,
|
|
1526
1564
|
className: `shrink-0 p-2 rounded transition-colors ${closeColorClass}`,
|
|
1527
1565
|
"aria-label": "Close",
|
|
1528
|
-
children: /* @__PURE__ */
|
|
1566
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CloseIcon2, { className: "h-16 w-16" })
|
|
1529
1567
|
}
|
|
1530
1568
|
)
|
|
1531
1569
|
] }));
|
|
@@ -1534,9 +1572,9 @@ var FinancialLogo = forwardRef12(
|
|
|
1534
1572
|
FinancialLogo.displayName = "FinancialLogo";
|
|
1535
1573
|
|
|
1536
1574
|
// src/components/Icon/Icon.tsx
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
var Icon =
|
|
1575
|
+
var import_react14 = require("react");
|
|
1576
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
1577
|
+
var Icon = (0, import_react14.forwardRef)(
|
|
1540
1578
|
(_a, ref) => {
|
|
1541
1579
|
var _b = _a, {
|
|
1542
1580
|
name,
|
|
@@ -1564,7 +1602,7 @@ var Icon = forwardRef13(
|
|
|
1564
1602
|
"material-symbols-outlined select-none shrink-0 inline-block leading-none",
|
|
1565
1603
|
className
|
|
1566
1604
|
].filter(Boolean).join(" ");
|
|
1567
|
-
return /* @__PURE__ */
|
|
1605
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
1568
1606
|
"span",
|
|
1569
1607
|
__spreadProps(__spreadValues({
|
|
1570
1608
|
ref,
|
|
@@ -1587,8 +1625,8 @@ var Icon = forwardRef13(
|
|
|
1587
1625
|
Icon.displayName = "Icon";
|
|
1588
1626
|
|
|
1589
1627
|
// src/components/Link/Link.tsx
|
|
1590
|
-
|
|
1591
|
-
|
|
1628
|
+
var import_react15 = require("react");
|
|
1629
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
1592
1630
|
var linkStyleClasses = {
|
|
1593
1631
|
brand: "font-sans text-link-text-enabled",
|
|
1594
1632
|
white: "font-sans text-link-text-enabled-inverse",
|
|
@@ -1610,12 +1648,12 @@ var iconVariantClasses = {
|
|
|
1610
1648
|
lg: "w-24 h-24"
|
|
1611
1649
|
};
|
|
1612
1650
|
function SuccessIcon3({ className }) {
|
|
1613
|
-
return /* @__PURE__ */
|
|
1614
|
-
/* @__PURE__ */
|
|
1615
|
-
/* @__PURE__ */
|
|
1651
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
|
|
1652
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
1653
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
|
|
1616
1654
|
] });
|
|
1617
1655
|
}
|
|
1618
|
-
var Link =
|
|
1656
|
+
var Link = (0, import_react15.forwardRef)(
|
|
1619
1657
|
(_a, ref) => {
|
|
1620
1658
|
var _b = _a, {
|
|
1621
1659
|
variant = "sm",
|
|
@@ -1646,21 +1684,18 @@ var Link = forwardRef14(
|
|
|
1646
1684
|
variantClass,
|
|
1647
1685
|
className
|
|
1648
1686
|
].filter(Boolean).join(" ");
|
|
1649
|
-
return /* @__PURE__ */
|
|
1650
|
-
/* @__PURE__ */
|
|
1651
|
-
icon && !isInline ? /* @__PURE__ */
|
|
1687
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", __spreadProps(__spreadValues({ ref, role: "link", className: classes }, rest), { children: [
|
|
1688
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("a", { className: "", href, children: text }),
|
|
1689
|
+
icon && !isInline ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SuccessIcon3, { className: iconClass }) : null
|
|
1652
1690
|
] }));
|
|
1653
1691
|
}
|
|
1654
1692
|
);
|
|
1655
1693
|
Link.displayName = "Link";
|
|
1656
1694
|
|
|
1657
1695
|
// src/components/Radio/Radio.tsx
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
} from "react";
|
|
1662
|
-
import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1663
|
-
var Radio = forwardRef15(
|
|
1696
|
+
var import_react16 = require("react");
|
|
1697
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
1698
|
+
var Radio = (0, import_react16.forwardRef)(
|
|
1664
1699
|
(_a, ref) => {
|
|
1665
1700
|
var _b = _a, {
|
|
1666
1701
|
size = "sm",
|
|
@@ -1685,20 +1720,20 @@ var Radio = forwardRef15(
|
|
|
1685
1720
|
"id",
|
|
1686
1721
|
"name"
|
|
1687
1722
|
]);
|
|
1688
|
-
const reactId =
|
|
1723
|
+
const reactId = (0, import_react16.useId)();
|
|
1689
1724
|
const inputId = id != null ? id : reactId;
|
|
1690
|
-
return /* @__PURE__ */
|
|
1725
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1691
1726
|
"div",
|
|
1692
1727
|
{
|
|
1693
1728
|
className: `${disabled ? "cursor-not-allowed" : "cursor-pointer"} ${className}`,
|
|
1694
|
-
children: /* @__PURE__ */
|
|
1729
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
1695
1730
|
"label",
|
|
1696
1731
|
{
|
|
1697
1732
|
htmlFor: inputId,
|
|
1698
1733
|
className: `flex gap-4 ${disabled ? "pointer-events-none text-gray-400" : "text-gray-900 cursor-pointer"}`,
|
|
1699
1734
|
children: [
|
|
1700
|
-
/* @__PURE__ */
|
|
1701
|
-
/* @__PURE__ */
|
|
1735
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { children: [
|
|
1736
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1702
1737
|
"input",
|
|
1703
1738
|
__spreadValues({
|
|
1704
1739
|
ref,
|
|
@@ -1711,14 +1746,14 @@ var Radio = forwardRef15(
|
|
|
1711
1746
|
name
|
|
1712
1747
|
}, rest)
|
|
1713
1748
|
),
|
|
1714
|
-
/* @__PURE__ */
|
|
1749
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1715
1750
|
"div",
|
|
1716
1751
|
{
|
|
1717
1752
|
className: `relative box flex items-center justify-center rounded-full border-2 group bg-white
|
|
1718
1753
|
${size === "sm" ? "h-16 w-16 my-4 ml-3 mr-3" : "m-3 h-20 w-20 text-label-large"}
|
|
1719
1754
|
${error ? "border-red-500" : "border-gray-600 peer-checked:border-blue-600 peer-disabled:border-gray-400!"}
|
|
1720
1755
|
`,
|
|
1721
|
-
children: /* @__PURE__ */
|
|
1756
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1722
1757
|
"span",
|
|
1723
1758
|
{
|
|
1724
1759
|
className: `absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2
|
|
@@ -1729,12 +1764,12 @@ var Radio = forwardRef15(
|
|
|
1729
1764
|
}
|
|
1730
1765
|
)
|
|
1731
1766
|
] }),
|
|
1732
|
-
/* @__PURE__ */
|
|
1767
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
1733
1768
|
"div",
|
|
1734
1769
|
{
|
|
1735
1770
|
className: `flex flex-col gap-1 ${size === "sm" ? "mt-2" : "mt-4"}`,
|
|
1736
1771
|
children: [
|
|
1737
|
-
/* @__PURE__ */
|
|
1772
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1738
1773
|
"p",
|
|
1739
1774
|
{
|
|
1740
1775
|
className: `
|
|
@@ -1744,7 +1779,7 @@ var Radio = forwardRef15(
|
|
|
1744
1779
|
children: label
|
|
1745
1780
|
}
|
|
1746
1781
|
),
|
|
1747
|
-
/* @__PURE__ */
|
|
1782
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
1748
1783
|
"p",
|
|
1749
1784
|
{
|
|
1750
1785
|
className: `text-caption-caption ${disabled ? "text-gray-400" : error ? "text-red-600" : "text-gray-600"}`,
|
|
@@ -1764,20 +1799,18 @@ var Radio = forwardRef15(
|
|
|
1764
1799
|
Radio.displayName = "Radio";
|
|
1765
1800
|
|
|
1766
1801
|
// src/components/SegmentControl/SegmentControl.tsx
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
1771
|
-
var SegmentControl = forwardRef16(
|
|
1802
|
+
var import_react17 = require("react");
|
|
1803
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
1804
|
+
var SegmentControl = (0, import_react17.forwardRef)(
|
|
1772
1805
|
(_a, ref) => {
|
|
1773
1806
|
var _b = _a, { size = "md", items, selected, setSelected, className = "" } = _b, rest = __objRest(_b, ["size", "items", "selected", "setSelected", "className"]);
|
|
1774
|
-
return /* @__PURE__ */
|
|
1807
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1775
1808
|
"div",
|
|
1776
1809
|
__spreadProps(__spreadValues({
|
|
1777
1810
|
ref,
|
|
1778
1811
|
className: `bg-background-tertiary rounded-full flex flex-row items-center justify-center p-4 gap-4 ${className}`
|
|
1779
1812
|
}, rest), {
|
|
1780
|
-
children: items.map((item) => /* @__PURE__ */
|
|
1813
|
+
children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1781
1814
|
"div",
|
|
1782
1815
|
{
|
|
1783
1816
|
onClick: () => setSelected == null ? void 0 : setSelected(item.value),
|
|
@@ -1794,13 +1827,8 @@ var SegmentControl = forwardRef16(
|
|
|
1794
1827
|
SegmentControl.displayName = "SegmentControl";
|
|
1795
1828
|
|
|
1796
1829
|
// src/components/Slider/Slider.tsx
|
|
1797
|
-
|
|
1798
|
-
|
|
1799
|
-
useCallback as useCallback4,
|
|
1800
|
-
useId as useId4,
|
|
1801
|
-
useState as useState8
|
|
1802
|
-
} from "react";
|
|
1803
|
-
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1830
|
+
var import_react18 = require("react");
|
|
1831
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1804
1832
|
var sizeConfig = {
|
|
1805
1833
|
small: {
|
|
1806
1834
|
trackH: "h-4",
|
|
@@ -1831,7 +1859,7 @@ var sizeConfig = {
|
|
|
1831
1859
|
}
|
|
1832
1860
|
};
|
|
1833
1861
|
function ChevronGlyphs({ size, color }) {
|
|
1834
|
-
return /* @__PURE__ */
|
|
1862
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
1835
1863
|
"svg",
|
|
1836
1864
|
{
|
|
1837
1865
|
width: size,
|
|
@@ -1841,7 +1869,7 @@ function ChevronGlyphs({ size, color }) {
|
|
|
1841
1869
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1842
1870
|
"aria-hidden": "true",
|
|
1843
1871
|
children: [
|
|
1844
|
-
/* @__PURE__ */
|
|
1872
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1845
1873
|
"path",
|
|
1846
1874
|
{
|
|
1847
1875
|
d: "M4.75 3.25L2.25 6L4.75 8.75",
|
|
@@ -1851,7 +1879,7 @@ function ChevronGlyphs({ size, color }) {
|
|
|
1851
1879
|
strokeLinejoin: "round"
|
|
1852
1880
|
}
|
|
1853
1881
|
),
|
|
1854
|
-
/* @__PURE__ */
|
|
1882
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1855
1883
|
"path",
|
|
1856
1884
|
{
|
|
1857
1885
|
d: "M7.25 3.25L9.75 6L7.25 8.75",
|
|
@@ -1865,7 +1893,7 @@ function ChevronGlyphs({ size, color }) {
|
|
|
1865
1893
|
}
|
|
1866
1894
|
);
|
|
1867
1895
|
}
|
|
1868
|
-
var Slider =
|
|
1896
|
+
var Slider = (0, import_react18.forwardRef)(
|
|
1869
1897
|
(_a, ref) => {
|
|
1870
1898
|
var _b = _a, {
|
|
1871
1899
|
size = "medium",
|
|
@@ -1900,15 +1928,15 @@ var Slider = forwardRef17(
|
|
|
1900
1928
|
"onChange",
|
|
1901
1929
|
"aria-label"
|
|
1902
1930
|
]);
|
|
1903
|
-
const reactId =
|
|
1931
|
+
const reactId = (0, import_react18.useId)();
|
|
1904
1932
|
const inputId = id != null ? id : reactId;
|
|
1905
1933
|
const sz = sizeConfig[size];
|
|
1906
1934
|
const ariaLabel = ariaLabelProp != null ? ariaLabelProp : typeof label === "string" ? void 0 : "Slider";
|
|
1907
1935
|
const ariaDescriptionId = description ? `${inputId}-description` : void 0;
|
|
1908
1936
|
const isControlled = controlledValue !== void 0;
|
|
1909
|
-
const [internalValue, setInternalValue] =
|
|
1937
|
+
const [internalValue, setInternalValue] = (0, import_react18.useState)(defaultValue != null ? defaultValue : min);
|
|
1910
1938
|
const currentValue = isControlled ? controlledValue : internalValue;
|
|
1911
|
-
const handleChange =
|
|
1939
|
+
const handleChange = (0, import_react18.useCallback)(
|
|
1912
1940
|
(e) => {
|
|
1913
1941
|
const val = Number(e.target.value);
|
|
1914
1942
|
if (!isControlled) {
|
|
@@ -1928,13 +1956,13 @@ var Slider = forwardRef17(
|
|
|
1928
1956
|
const descriptionColor = disabled ? "text-slider-label-disabled" : "text-slider-description";
|
|
1929
1957
|
const thumbOffset = percent * sz.thumbPx / 100;
|
|
1930
1958
|
const fillOffset = sz.thumbPx / 2 - thumbOffset;
|
|
1931
|
-
return /* @__PURE__ */
|
|
1959
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
1932
1960
|
"div",
|
|
1933
1961
|
{
|
|
1934
1962
|
className: ["flex w-full flex-col gap-8 font-sans", className].filter(Boolean).join(" "),
|
|
1935
1963
|
children: [
|
|
1936
|
-
(label || showValue && !disabled) && /* @__PURE__ */
|
|
1937
|
-
label && /* @__PURE__ */
|
|
1964
|
+
(label || showValue && !disabled) && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
1965
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1938
1966
|
"label",
|
|
1939
1967
|
{
|
|
1940
1968
|
htmlFor: inputId,
|
|
@@ -1947,7 +1975,7 @@ var Slider = forwardRef17(
|
|
|
1947
1975
|
children: label
|
|
1948
1976
|
}
|
|
1949
1977
|
),
|
|
1950
|
-
showValue && /* @__PURE__ */
|
|
1978
|
+
showValue && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1951
1979
|
"span",
|
|
1952
1980
|
{
|
|
1953
1981
|
className: [sz.description, "tabular-nums", labelColor].join(" "),
|
|
@@ -1955,7 +1983,7 @@ var Slider = forwardRef17(
|
|
|
1955
1983
|
}
|
|
1956
1984
|
)
|
|
1957
1985
|
] }),
|
|
1958
|
-
/* @__PURE__ */
|
|
1986
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
1959
1987
|
"div",
|
|
1960
1988
|
{
|
|
1961
1989
|
className: [
|
|
@@ -1964,7 +1992,7 @@ var Slider = forwardRef17(
|
|
|
1964
1992
|
disabled ? "cursor-not-allowed" : "cursor-pointer"
|
|
1965
1993
|
].join(" "),
|
|
1966
1994
|
children: [
|
|
1967
|
-
/* @__PURE__ */
|
|
1995
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1968
1996
|
"div",
|
|
1969
1997
|
{
|
|
1970
1998
|
className: [
|
|
@@ -1974,14 +2002,14 @@ var Slider = forwardRef17(
|
|
|
1974
2002
|
].join(" ")
|
|
1975
2003
|
}
|
|
1976
2004
|
),
|
|
1977
|
-
/* @__PURE__ */
|
|
2005
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1978
2006
|
"div",
|
|
1979
2007
|
{
|
|
1980
2008
|
className: ["absolute left-0 rounded-full", sz.trackH, fillBg].join(" "),
|
|
1981
2009
|
style: { width: `calc(${percent}% + ${fillOffset}px)` }
|
|
1982
2010
|
}
|
|
1983
2011
|
),
|
|
1984
|
-
/* @__PURE__ */
|
|
2012
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1985
2013
|
"input",
|
|
1986
2014
|
__spreadValues({
|
|
1987
2015
|
ref,
|
|
@@ -2002,7 +2030,7 @@ var Slider = forwardRef17(
|
|
|
2002
2030
|
].join(" ")
|
|
2003
2031
|
}, rest)
|
|
2004
2032
|
),
|
|
2005
|
-
/* @__PURE__ */
|
|
2033
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2006
2034
|
"div",
|
|
2007
2035
|
{
|
|
2008
2036
|
className: [
|
|
@@ -2015,13 +2043,13 @@ var Slider = forwardRef17(
|
|
|
2015
2043
|
!disabled && "peer-hover:shadow-medium"
|
|
2016
2044
|
].filter(Boolean).join(" "),
|
|
2017
2045
|
style: { left: `calc(${percent}% - ${thumbOffset}px)` },
|
|
2018
|
-
children: /* @__PURE__ */
|
|
2046
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChevronGlyphs, { size: sz.iconPx, color: iconColor })
|
|
2019
2047
|
}
|
|
2020
2048
|
)
|
|
2021
2049
|
]
|
|
2022
2050
|
}
|
|
2023
2051
|
),
|
|
2024
|
-
description && /* @__PURE__ */
|
|
2052
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2025
2053
|
"span",
|
|
2026
2054
|
{
|
|
2027
2055
|
id: ariaDescriptionId,
|
|
@@ -2037,9 +2065,9 @@ var Slider = forwardRef17(
|
|
|
2037
2065
|
Slider.displayName = "Slider";
|
|
2038
2066
|
|
|
2039
2067
|
// src/components/Tab/Tab.tsx
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
var Tab =
|
|
2068
|
+
var import_react19 = require("react");
|
|
2069
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
2070
|
+
var Tab = (0, import_react19.forwardRef)(
|
|
2043
2071
|
(_a, ref) => {
|
|
2044
2072
|
var _b = _a, {
|
|
2045
2073
|
size = "md",
|
|
@@ -2058,7 +2086,7 @@ var Tab = forwardRef18(
|
|
|
2058
2086
|
"setSelected",
|
|
2059
2087
|
"className"
|
|
2060
2088
|
]);
|
|
2061
|
-
return /* @__PURE__ */
|
|
2089
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
2062
2090
|
"div",
|
|
2063
2091
|
__spreadProps(__spreadValues({
|
|
2064
2092
|
ref,
|
|
@@ -2076,12 +2104,9 @@ var Tab = forwardRef18(
|
|
|
2076
2104
|
Tab.displayName = "Tab";
|
|
2077
2105
|
|
|
2078
2106
|
// src/components/TextArea/TextArea.tsx
|
|
2079
|
-
|
|
2080
|
-
|
|
2081
|
-
|
|
2082
|
-
} from "react";
|
|
2083
|
-
import { Fragment as Fragment3, jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2084
|
-
var TextArea = forwardRef19(
|
|
2107
|
+
var import_react20 = require("react");
|
|
2108
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
2109
|
+
var TextArea = (0, import_react20.forwardRef)(
|
|
2085
2110
|
(_a, ref) => {
|
|
2086
2111
|
var _b = _a, {
|
|
2087
2112
|
maxText = 500,
|
|
@@ -2114,25 +2139,25 @@ var TextArea = forwardRef19(
|
|
|
2114
2139
|
"value",
|
|
2115
2140
|
"onChange"
|
|
2116
2141
|
]);
|
|
2117
|
-
const [isFocused, setIsFocused] =
|
|
2118
|
-
return /* @__PURE__ */
|
|
2119
|
-
/* @__PURE__ */
|
|
2120
|
-
label ? /* @__PURE__ */
|
|
2142
|
+
const [isFocused, setIsFocused] = (0, import_react20.useState)(false);
|
|
2143
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "w-full flex flex-col gap-4", children: [
|
|
2144
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "w-full flex justify-between items-center ", children: [
|
|
2145
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2121
2146
|
"p",
|
|
2122
2147
|
{
|
|
2123
2148
|
className: `text-label-medium text-left items-left ${isDisabled || disabled ? "text-gray-400" : "text-gray-900"}`,
|
|
2124
2149
|
children: label
|
|
2125
2150
|
}
|
|
2126
|
-
) : /* @__PURE__ */
|
|
2127
|
-
maxText ? /* @__PURE__ */
|
|
2151
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, {}),
|
|
2152
|
+
maxText ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("p", { className: "text-gray-400 text-caption-caption", children: [
|
|
2128
2153
|
" ",
|
|
2129
2154
|
(value == null ? void 0 : value.length) || 0,
|
|
2130
2155
|
" / ",
|
|
2131
2156
|
maxText
|
|
2132
|
-
] }) : /* @__PURE__ */
|
|
2157
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, {})
|
|
2133
2158
|
] }),
|
|
2134
|
-
/* @__PURE__ */
|
|
2135
|
-
/* @__PURE__ */
|
|
2159
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "relative w-full", children: [
|
|
2160
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2136
2161
|
"textarea",
|
|
2137
2162
|
__spreadValues({
|
|
2138
2163
|
ref,
|
|
@@ -2146,13 +2171,13 @@ var TextArea = forwardRef19(
|
|
|
2146
2171
|
className: `w-full min-h-${height} focus:min-h-${height - 2} pt-12 pb-8 pr-44 pl-16 focus:pt-11 focus:pb-7 focus:pr-43 focus:pl-15 border border-gray-300 text-base rounded-md focus:outline-none focus:ring-1 focus:m-1 focus:w-[calc(100%-2px)] ${isDisabled || disabled ? "bg-gray-50 text-gray-400" : error ? "bg-white text-gray-900 border-red-500 focus:border-red-500 focus:ring-red-500" : "bg-white text-gray-900 focus:border-blue-600 focus:ring-blue-600"}`
|
|
2147
2172
|
}, props)
|
|
2148
2173
|
),
|
|
2149
|
-
isLoading ? /* @__PURE__ */
|
|
2174
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2150
2175
|
Loading,
|
|
2151
2176
|
{
|
|
2152
2177
|
size: "sm",
|
|
2153
2178
|
className: `absolute right-12 top-12`
|
|
2154
2179
|
}
|
|
2155
|
-
) : isClearable && isFocused && value ? /* @__PURE__ */
|
|
2180
|
+
) : isClearable && isFocused && value ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2156
2181
|
"svg",
|
|
2157
2182
|
{
|
|
2158
2183
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2165,7 +2190,7 @@ var TextArea = forwardRef19(
|
|
|
2165
2190
|
e.preventDefault();
|
|
2166
2191
|
onChange == null ? void 0 : onChange({ target: { value: "" } });
|
|
2167
2192
|
},
|
|
2168
|
-
children: /* @__PURE__ */
|
|
2193
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2169
2194
|
"path",
|
|
2170
2195
|
{
|
|
2171
2196
|
d: "M14.7119 6.0625L10.7744 10L14.7119 13.9375L13.9375 14.7119L10 10.7744L6.0625 14.7119L5.28809 13.9375L9.22559 10L5.28809 6.0625L6.0625 5.28809L10 9.22559L13.9375 5.28809L14.7119 6.0625Z",
|
|
@@ -2173,7 +2198,7 @@ var TextArea = forwardRef19(
|
|
|
2173
2198
|
}
|
|
2174
2199
|
)
|
|
2175
2200
|
}
|
|
2176
|
-
) : isVertify ? /* @__PURE__ */
|
|
2201
|
+
) : isVertify ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2177
2202
|
"svg",
|
|
2178
2203
|
{
|
|
2179
2204
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2182,7 +2207,7 @@ var TextArea = forwardRef19(
|
|
|
2182
2207
|
viewBox: "0 0 20 20",
|
|
2183
2208
|
fill: "none",
|
|
2184
2209
|
className: "text-green-600 flex h-20 w-20 items-center justify-center absolute right-12 top-12",
|
|
2185
|
-
children: /* @__PURE__ */
|
|
2210
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2186
2211
|
"path",
|
|
2187
2212
|
{
|
|
2188
2213
|
"fill-rule": "evenodd",
|
|
@@ -2192,7 +2217,7 @@ var TextArea = forwardRef19(
|
|
|
2192
2217
|
}
|
|
2193
2218
|
)
|
|
2194
2219
|
}
|
|
2195
|
-
) : error ? /* @__PURE__ */
|
|
2220
|
+
) : error ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2196
2221
|
"svg",
|
|
2197
2222
|
{
|
|
2198
2223
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2201,7 +2226,7 @@ var TextArea = forwardRef19(
|
|
|
2201
2226
|
viewBox: "0 0 20 20",
|
|
2202
2227
|
fill: "none",
|
|
2203
2228
|
className: "text-red-500 flex h-20 w-20 items-center justify-center absolute right-12 top-12",
|
|
2204
|
-
children: /* @__PURE__ */
|
|
2229
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2205
2230
|
"path",
|
|
2206
2231
|
{
|
|
2207
2232
|
d: "M10.0078 2.41699C11.0548 2.41699 12.0363 2.61407 12.9512 3.00879C13.8657 3.40341 14.6687 3.94646 15.3604 4.6377C16.0522 5.32922 16.5962 6.13426 16.9912 7.05176C17.386 7.96936 17.583 8.95002 17.583 9.99316C17.583 11.0363 17.3859 12.0187 16.9912 12.9404C16.5966 13.862 16.0536 14.6687 15.3623 15.3604C14.6708 16.0522 13.8657 16.5962 12.9482 16.9912C12.0306 17.386 11.05 17.583 10.0068 17.583C8.96373 17.583 7.9813 17.3859 7.05957 16.9912C6.13798 16.5966 5.33135 16.0536 4.63965 15.3623C3.94784 14.6708 3.40379 13.8642 3.00879 12.9434C2.61398 12.0228 2.41703 11.039 2.41699 9.99219C2.41699 8.94524 2.61407 7.96369 3.00879 7.04883C3.40341 6.13429 3.94646 5.33128 4.6377 4.63965C5.32922 3.94784 6.13581 3.40379 7.05664 3.00879C7.97723 2.61398 8.961 2.41703 10.0078 2.41699ZM10.0039 12.5967C9.83828 12.5968 9.69804 12.6527 9.58301 12.7646C9.46793 12.8769 9.41016 13.0159 9.41016 13.1816C9.4102 13.3472 9.46621 13.4875 9.57812 13.6025C9.69035 13.7177 9.83026 13.7754 9.99609 13.7754C10.1617 13.7753 10.302 13.7195 10.417 13.6074C10.5321 13.4952 10.5898 13.3562 10.5898 13.1904C10.5898 13.0246 10.534 12.8837 10.4219 12.7686C10.3097 12.6536 10.1697 12.5967 10.0039 12.5967ZM9.45801 11.0645H10.542V6.06445H9.45801V11.0645Z",
|
|
@@ -2209,21 +2234,18 @@ var TextArea = forwardRef19(
|
|
|
2209
2234
|
}
|
|
2210
2235
|
)
|
|
2211
2236
|
}
|
|
2212
|
-
) : /* @__PURE__ */
|
|
2237
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, {})
|
|
2213
2238
|
] }),
|
|
2214
|
-
error ? /* @__PURE__ */
|
|
2239
|
+
error ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-caption-caption text-left items-left text-red-600", children: error }) : description ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-caption-caption text-left items-left text-gray-600", children: description }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, {})
|
|
2215
2240
|
] });
|
|
2216
2241
|
}
|
|
2217
2242
|
);
|
|
2218
2243
|
TextArea.displayName = "TextArea";
|
|
2219
2244
|
|
|
2220
2245
|
// src/components/TextField/TextField.tsx
|
|
2221
|
-
|
|
2222
|
-
|
|
2223
|
-
|
|
2224
|
-
} from "react";
|
|
2225
|
-
import { Fragment as Fragment4, jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2226
|
-
var TextField = forwardRef20(
|
|
2246
|
+
var import_react21 = require("react");
|
|
2247
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
2248
|
+
var TextField = (0, import_react21.forwardRef)(
|
|
2227
2249
|
(_a, ref) => {
|
|
2228
2250
|
var _b = _a, {
|
|
2229
2251
|
inputSize,
|
|
@@ -2256,21 +2278,21 @@ var TextField = forwardRef20(
|
|
|
2256
2278
|
"value",
|
|
2257
2279
|
"onChange"
|
|
2258
2280
|
]);
|
|
2259
|
-
const [isFocused, setIsFocused] =
|
|
2260
|
-
return /* @__PURE__ */
|
|
2261
|
-
label ? /* @__PURE__ */
|
|
2281
|
+
const [isFocused, setIsFocused] = (0, import_react21.useState)(false);
|
|
2282
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "w-full flex flex-col gap-4", children: [
|
|
2283
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
2262
2284
|
"p",
|
|
2263
2285
|
{
|
|
2264
2286
|
className: `text-label-medium text-left items-left ${isDisabled || disabled ? "text-gray-400" : "text-gray-900"}`,
|
|
2265
2287
|
children: [
|
|
2266
2288
|
label,
|
|
2267
2289
|
" ",
|
|
2268
|
-
isUnrequired && /* @__PURE__ */
|
|
2290
|
+
isUnrequired && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-gray-400", children: `(\u0E44\u0E21\u0E48\u0E1A\u0E31\u0E07\u0E04\u0E31\u0E1A)` })
|
|
2269
2291
|
]
|
|
2270
2292
|
}
|
|
2271
|
-
) : /* @__PURE__ */
|
|
2272
|
-
/* @__PURE__ */
|
|
2273
|
-
/* @__PURE__ */
|
|
2293
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, {}),
|
|
2294
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative w-full", children: [
|
|
2295
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2274
2296
|
"input",
|
|
2275
2297
|
__spreadValues({
|
|
2276
2298
|
ref,
|
|
@@ -2285,13 +2307,13 @@ var TextField = forwardRef20(
|
|
|
2285
2307
|
className: `w-full ${inputSize === "md" ? "px-16 py-12 focus:px-15 focus:py-11" : "p-16 focus:p-15"} border border-gray-300 text-base rounded-md focus:outline-none focus:ring-1 focus:m-1 focus:w-[calc(100%-2px)] ${isDisabled || disabled ? "bg-gray-50 text-gray-400" : error ? "bg-white text-gray-900 border-red-500 focus:border-red-500 focus:ring-red-500" : "bg-white text-gray-900 focus:border-blue-600 focus:ring-blue-600"}`
|
|
2286
2308
|
}, props)
|
|
2287
2309
|
),
|
|
2288
|
-
isLoading ? /* @__PURE__ */
|
|
2310
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2289
2311
|
Loading,
|
|
2290
2312
|
{
|
|
2291
2313
|
size: "sm",
|
|
2292
2314
|
className: `absolute right-16 top-1/2 -translate-y-1/2`
|
|
2293
2315
|
}
|
|
2294
|
-
) : isClearable && isFocused && value ? /* @__PURE__ */
|
|
2316
|
+
) : isClearable && isFocused && value ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2295
2317
|
"svg",
|
|
2296
2318
|
{
|
|
2297
2319
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2304,7 +2326,7 @@ var TextField = forwardRef20(
|
|
|
2304
2326
|
e.preventDefault();
|
|
2305
2327
|
onChange == null ? void 0 : onChange({ target: { value: "" } });
|
|
2306
2328
|
},
|
|
2307
|
-
children: /* @__PURE__ */
|
|
2329
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2308
2330
|
"path",
|
|
2309
2331
|
{
|
|
2310
2332
|
d: "M14.7119 6.0625L10.7744 10L14.7119 13.9375L13.9375 14.7119L10 10.7744L6.0625 14.7119L5.28809 13.9375L9.22559 10L5.28809 6.0625L6.0625 5.28809L10 9.22559L13.9375 5.28809L14.7119 6.0625Z",
|
|
@@ -2312,7 +2334,7 @@ var TextField = forwardRef20(
|
|
|
2312
2334
|
}
|
|
2313
2335
|
)
|
|
2314
2336
|
}
|
|
2315
|
-
) : isVertify ? /* @__PURE__ */
|
|
2337
|
+
) : isVertify ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2316
2338
|
"svg",
|
|
2317
2339
|
{
|
|
2318
2340
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2321,7 +2343,7 @@ var TextField = forwardRef20(
|
|
|
2321
2343
|
viewBox: "0 0 20 20",
|
|
2322
2344
|
fill: "none",
|
|
2323
2345
|
className: "text-green-600 flex h-20 w-20 items-center justify-center absolute right-16 top-1/2 -translate-y-1/2",
|
|
2324
|
-
children: /* @__PURE__ */
|
|
2346
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2325
2347
|
"path",
|
|
2326
2348
|
{
|
|
2327
2349
|
"fill-rule": "evenodd",
|
|
@@ -2331,7 +2353,7 @@ var TextField = forwardRef20(
|
|
|
2331
2353
|
}
|
|
2332
2354
|
)
|
|
2333
2355
|
}
|
|
2334
|
-
) : error ? /* @__PURE__ */
|
|
2356
|
+
) : error ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2335
2357
|
"svg",
|
|
2336
2358
|
{
|
|
2337
2359
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2340,7 +2362,7 @@ var TextField = forwardRef20(
|
|
|
2340
2362
|
viewBox: "0 0 20 20",
|
|
2341
2363
|
fill: "none",
|
|
2342
2364
|
className: "text-red-500 flex h-20 w-20 items-center justify-center absolute right-16 top-1/2 -translate-y-1/2",
|
|
2343
|
-
children: /* @__PURE__ */
|
|
2365
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2344
2366
|
"path",
|
|
2345
2367
|
{
|
|
2346
2368
|
d: "M10.0078 2.41699C11.0548 2.41699 12.0363 2.61407 12.9512 3.00879C13.8657 3.40341 14.6687 3.94646 15.3604 4.6377C16.0522 5.32922 16.5962 6.13426 16.9912 7.05176C17.386 7.96936 17.583 8.95002 17.583 9.99316C17.583 11.0363 17.3859 12.0187 16.9912 12.9404C16.5966 13.862 16.0536 14.6687 15.3623 15.3604C14.6708 16.0522 13.8657 16.5962 12.9482 16.9912C12.0306 17.386 11.05 17.583 10.0068 17.583C8.96373 17.583 7.9813 17.3859 7.05957 16.9912C6.13798 16.5966 5.33135 16.0536 4.63965 15.3623C3.94784 14.6708 3.40379 13.8642 3.00879 12.9434C2.61398 12.0228 2.41703 11.039 2.41699 9.99219C2.41699 8.94524 2.61407 7.96369 3.00879 7.04883C3.40341 6.13429 3.94646 5.33128 4.6377 4.63965C5.32922 3.94784 6.13581 3.40379 7.05664 3.00879C7.97723 2.61398 8.961 2.41703 10.0078 2.41699ZM10.0039 12.5967C9.83828 12.5968 9.69804 12.6527 9.58301 12.7646C9.46793 12.8769 9.41016 13.0159 9.41016 13.1816C9.4102 13.3472 9.46621 13.4875 9.57812 13.6025C9.69035 13.7177 9.83026 13.7754 9.99609 13.7754C10.1617 13.7753 10.302 13.7195 10.417 13.6074C10.5321 13.4952 10.5898 13.3562 10.5898 13.1904C10.5898 13.0246 10.534 12.8837 10.4219 12.7686C10.3097 12.6536 10.1697 12.5967 10.0039 12.5967ZM9.45801 11.0645H10.542V6.06445H9.45801V11.0645Z",
|
|
@@ -2348,37 +2370,37 @@ var TextField = forwardRef20(
|
|
|
2348
2370
|
}
|
|
2349
2371
|
)
|
|
2350
2372
|
}
|
|
2351
|
-
) : /* @__PURE__ */
|
|
2373
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, {})
|
|
2352
2374
|
] }),
|
|
2353
|
-
error ? /* @__PURE__ */
|
|
2375
|
+
error ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-caption-caption text-left items-left text-red-600", children: error }) : description ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-caption-caption text-left items-left text-gray-600", children: description }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, {})
|
|
2354
2376
|
] });
|
|
2355
2377
|
}
|
|
2356
2378
|
);
|
|
2357
2379
|
TextField.displayName = "TextField";
|
|
2358
2380
|
|
|
2359
2381
|
// src/components/Toast/Toast.tsx
|
|
2360
|
-
|
|
2361
|
-
|
|
2382
|
+
var import_react22 = require("react");
|
|
2383
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
2362
2384
|
function CheckCircleIcon({ className }) {
|
|
2363
|
-
return /* @__PURE__ */
|
|
2364
|
-
/* @__PURE__ */
|
|
2365
|
-
/* @__PURE__ */
|
|
2385
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
|
|
2386
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
2387
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
|
|
2366
2388
|
] });
|
|
2367
2389
|
}
|
|
2368
2390
|
function ProgressIcon({ className }) {
|
|
2369
|
-
return /* @__PURE__ */
|
|
2370
|
-
/* @__PURE__ */
|
|
2371
|
-
/* @__PURE__ */
|
|
2391
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
|
|
2392
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "1.5", opacity: "0.3" }),
|
|
2393
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M10 2a8 8 0 0 1 8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("animateTransform", { attributeName: "transform", type: "rotate", from: "0 10 10", to: "360 10 10", dur: "1s", repeatCount: "indefinite" }) })
|
|
2372
2394
|
] });
|
|
2373
2395
|
}
|
|
2374
2396
|
function ErrorIcon({ className }) {
|
|
2375
|
-
return /* @__PURE__ */
|
|
2376
|
-
/* @__PURE__ */
|
|
2377
|
-
/* @__PURE__ */
|
|
2397
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
|
|
2398
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("circle", { cx: "10", cy: "10", r: "8", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
2399
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M10 6.5v4M10 13.5h.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
|
|
2378
2400
|
] });
|
|
2379
2401
|
}
|
|
2380
2402
|
function CloseIcon3({ className }) {
|
|
2381
|
-
return /* @__PURE__ */
|
|
2403
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("svg", { className, width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M12 4 4 12M4 4l8 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
2382
2404
|
}
|
|
2383
2405
|
var defaultIcons3 = {
|
|
2384
2406
|
default: CheckCircleIcon,
|
|
@@ -2395,7 +2417,7 @@ var iconColorClasses = {
|
|
|
2395
2417
|
progress: "text-toast-progress-icon",
|
|
2396
2418
|
error: "text-toast-error-icon"
|
|
2397
2419
|
};
|
|
2398
|
-
var Toast =
|
|
2420
|
+
var Toast = (0, import_react22.forwardRef)(
|
|
2399
2421
|
(_a, ref) => {
|
|
2400
2422
|
var _b = _a, {
|
|
2401
2423
|
type = "default",
|
|
@@ -2423,10 +2445,10 @@ var Toast = forwardRef21(
|
|
|
2423
2445
|
typeClasses[type],
|
|
2424
2446
|
className
|
|
2425
2447
|
].filter(Boolean).join(" ");
|
|
2426
|
-
return /* @__PURE__ */
|
|
2427
|
-
icon && /* @__PURE__ */
|
|
2428
|
-
/* @__PURE__ */
|
|
2429
|
-
actionLabel && onAction && /* @__PURE__ */
|
|
2448
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", __spreadProps(__spreadValues({ ref, role: "alert", className: classes }, rest), { children: [
|
|
2449
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: `shrink-0 ${iconColorClasses[type]}`, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DefaultIcon, { className: "h-20 w-20" }) }),
|
|
2450
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "flex-1 text-sm font-medium leading-20 truncate", children }),
|
|
2451
|
+
actionLabel && onAction && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2430
2452
|
"button",
|
|
2431
2453
|
{
|
|
2432
2454
|
type: "button",
|
|
@@ -2435,14 +2457,14 @@ var Toast = forwardRef21(
|
|
|
2435
2457
|
children: actionLabel
|
|
2436
2458
|
}
|
|
2437
2459
|
),
|
|
2438
|
-
onDismiss && /* @__PURE__ */
|
|
2460
|
+
onDismiss && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2439
2461
|
"button",
|
|
2440
2462
|
{
|
|
2441
2463
|
type: "button",
|
|
2442
2464
|
onClick: onDismiss,
|
|
2443
2465
|
className: "shrink-0 p-4 rounded-md text-toast-dismiss hover:text-toast-dismiss-hover transition-colors",
|
|
2444
2466
|
"aria-label": "Dismiss",
|
|
2445
|
-
children: /* @__PURE__ */
|
|
2467
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CloseIcon3, { className: "h-16 w-16" })
|
|
2446
2468
|
}
|
|
2447
2469
|
)
|
|
2448
2470
|
] }));
|
|
@@ -2451,9 +2473,9 @@ var Toast = forwardRef21(
|
|
|
2451
2473
|
Toast.displayName = "Toast";
|
|
2452
2474
|
|
|
2453
2475
|
// src/components/ToggleSwitch/ToggleSwitch.tsx
|
|
2454
|
-
|
|
2455
|
-
|
|
2456
|
-
var ToggleSwitch =
|
|
2476
|
+
var import_react23 = require("react");
|
|
2477
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
2478
|
+
var ToggleSwitch = (0, import_react23.forwardRef)(
|
|
2457
2479
|
(_a, ref) => {
|
|
2458
2480
|
var _b = _a, {
|
|
2459
2481
|
value,
|
|
@@ -2468,14 +2490,14 @@ var ToggleSwitch = forwardRef22(
|
|
|
2468
2490
|
"setIsSelected",
|
|
2469
2491
|
"className"
|
|
2470
2492
|
]);
|
|
2471
|
-
return /* @__PURE__ */
|
|
2493
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
|
2472
2494
|
"label",
|
|
2473
2495
|
__spreadProps(__spreadValues({
|
|
2474
2496
|
ref,
|
|
2475
2497
|
className: `inline-flex items-center ${className}`
|
|
2476
2498
|
}, rest), {
|
|
2477
2499
|
children: [
|
|
2478
|
-
/* @__PURE__ */
|
|
2500
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2479
2501
|
"input",
|
|
2480
2502
|
{
|
|
2481
2503
|
type: "checkbox",
|
|
@@ -2485,7 +2507,7 @@ var ToggleSwitch = forwardRef22(
|
|
|
2485
2507
|
onChange: () => !isDisabled && (setIsSelected == null ? void 0 : setIsSelected(!isSelected))
|
|
2486
2508
|
}
|
|
2487
2509
|
),
|
|
2488
|
-
/* @__PURE__ */
|
|
2510
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2489
2511
|
"div",
|
|
2490
2512
|
{
|
|
2491
2513
|
className: `${isDisabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-gray-300 hover:peer-checked:bg-green-700"} relative w-48 h-26 bg-gray-200 rounded-full peer-checked:after:translate-x-22 rtl:peer-checked:after:-translate-x-22 peer-checked:after:border-white after:content-[''] after:absolute after:top-4 after:left-4 after:bg-white after:border-gray-300 after:border after:rounded-full after:h-18 after:w-18 after:transition-all peer-checked:bg-green-600 `
|
|
@@ -2499,14 +2521,9 @@ var ToggleSwitch = forwardRef22(
|
|
|
2499
2521
|
ToggleSwitch.displayName = "ToggleSwitch";
|
|
2500
2522
|
|
|
2501
2523
|
// src/components/Tooltip/Tooltip.tsx
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
|
|
2505
|
-
useRef as useRef4,
|
|
2506
|
-
forwardRef as forwardRef23
|
|
2507
|
-
} from "react";
|
|
2508
|
-
import { Fragment as Fragment5, jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2509
|
-
var Tooltip = forwardRef23(
|
|
2524
|
+
var import_react24 = require("react");
|
|
2525
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
2526
|
+
var Tooltip = (0, import_react24.forwardRef)(
|
|
2510
2527
|
(_a, ref) => {
|
|
2511
2528
|
var _b = _a, {
|
|
2512
2529
|
size = "md",
|
|
@@ -2523,10 +2540,10 @@ var Tooltip = forwardRef23(
|
|
|
2523
2540
|
"position",
|
|
2524
2541
|
"className"
|
|
2525
2542
|
]);
|
|
2526
|
-
const wrapperRef =
|
|
2527
|
-
const [isVisible, setIsVisible] =
|
|
2528
|
-
const [isHovered, setIsHovered] =
|
|
2529
|
-
|
|
2543
|
+
const wrapperRef = (0, import_react24.useRef)(null);
|
|
2544
|
+
const [isVisible, setIsVisible] = (0, import_react24.useState)(false);
|
|
2545
|
+
const [isHovered, setIsHovered] = (0, import_react24.useState)(false);
|
|
2546
|
+
(0, import_react24.useEffect)(() => {
|
|
2530
2547
|
const handleClickOutside = (event) => {
|
|
2531
2548
|
if (wrapperRef.current && !wrapperRef.current.contains(event.target)) {
|
|
2532
2549
|
setIsVisible(false);
|
|
@@ -2538,14 +2555,14 @@ var Tooltip = forwardRef23(
|
|
|
2538
2555
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
2539
2556
|
};
|
|
2540
2557
|
}, []);
|
|
2541
|
-
return /* @__PURE__ */
|
|
2558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
2542
2559
|
"div",
|
|
2543
2560
|
__spreadProps(__spreadValues({
|
|
2544
2561
|
className: `group relative inline-block ${className}`,
|
|
2545
2562
|
ref
|
|
2546
2563
|
}, rest), {
|
|
2547
2564
|
children: [
|
|
2548
|
-
/* @__PURE__ */
|
|
2565
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
2549
2566
|
"div",
|
|
2550
2567
|
{
|
|
2551
2568
|
ref: wrapperRef,
|
|
@@ -2562,25 +2579,25 @@ var Tooltip = forwardRef23(
|
|
|
2562
2579
|
children
|
|
2563
2580
|
}
|
|
2564
2581
|
),
|
|
2565
|
-
/* @__PURE__ */
|
|
2582
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
2566
2583
|
"div",
|
|
2567
2584
|
{
|
|
2568
2585
|
className: `min-w-100 max-w-300 whitespace-nowrap rounded bg-gray-900 text-white ${size === "lg" ? "text-body-regular py-12 px-16" : size === "md" ? "text-body-small px-12 pt-10 pb-8" : "text-body-small px-8 pt-6 pb-4"} ${position === "right" && `absolute left-full top-1/2 z-20 ml-8 -translate-y-1/2 ${isVisible || isHovered ? "opacity-100" : "opacity-0"}` || position === "top" && `absolute bottom-full left-1/2 z-20 mb-8 -translate-x-1/2 ${isVisible || isHovered ? "opacity-100" : "opacity-0"}` || position === "left" && `absolute right-full top-1/2 z-20 mr-8 -translate-y-1/2 ${isVisible || isHovered ? "opacity-100" : "opacity-0"}` || position === "bottom" && `absolute left-1/2 top-full z-20 mt-8 -translate-x-1/2 ${isVisible || isHovered ? "opacity-100" : "opacity-0"}`}`,
|
|
2569
2586
|
children: [
|
|
2570
|
-
/* @__PURE__ */
|
|
2587
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
2571
2588
|
"span",
|
|
2572
2589
|
{
|
|
2573
2590
|
className: ` ${position === "right" && `absolute -left-3 top-1/2 -z-10 h-8 w-8 -translate-y-1/2 rotate-45 rounded-xs bg-black` || position === "top" && `absolute -bottom-3 left-1/2 -z-10 h-8 w-8 -translate-x-1/2 rotate-45 rounded-xs bg-black` || position === "left" && `absolute -right-3 top-1/2 -z-10 h-8 w-8 -translate-y-1/2 rotate-45 rounded-xs bg-black` || position === "bottom" && `absolute left-1/2 -top-3 -z-10 h-8 w-8 -translate-x-1/2 rotate-45 rounded-xs bg-black`} `
|
|
2574
2591
|
}
|
|
2575
2592
|
),
|
|
2576
|
-
headText ? /* @__PURE__ */
|
|
2593
|
+
headText ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
2577
2594
|
"p",
|
|
2578
2595
|
{
|
|
2579
2596
|
className: `text-sm text-white font-semibold text-center ${text ? "mb-5" : ""}`,
|
|
2580
2597
|
children: headText
|
|
2581
2598
|
}
|
|
2582
|
-
) : /* @__PURE__ */
|
|
2583
|
-
text ? /* @__PURE__ */
|
|
2599
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, {}),
|
|
2600
|
+
text ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-xs text-white font-normal text-center text-wrap", children: text }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, {})
|
|
2584
2601
|
]
|
|
2585
2602
|
}
|
|
2586
2603
|
)
|
|
@@ -2590,7 +2607,8 @@ var Tooltip = forwardRef23(
|
|
|
2590
2607
|
}
|
|
2591
2608
|
);
|
|
2592
2609
|
Tooltip.displayName = "Tooltip";
|
|
2593
|
-
export
|
|
2610
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
2611
|
+
0 && (module.exports = {
|
|
2594
2612
|
Accordion,
|
|
2595
2613
|
AlertBanner,
|
|
2596
2614
|
Avatar,
|
|
@@ -2615,4 +2633,4 @@ export {
|
|
|
2615
2633
|
Toast,
|
|
2616
2634
|
ToggleSwitch,
|
|
2617
2635
|
Tooltip
|
|
2618
|
-
};
|
|
2636
|
+
});
|