evelearn-theme 2.0.2 → 2.0.3
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.d.mts +76 -3
- package/dist/index.d.ts +76 -3
- package/dist/index.js +1901 -1405
- package/dist/index.mjs +1734 -1207
- package/package.json +5 -10
package/dist/index.mjs
CHANGED
|
@@ -1,1333 +1,1860 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
headerTippyClass,
|
|
21
|
-
tippyClassname,
|
|
22
|
-
toolbarExerciseButton,
|
|
23
|
-
xIconButton
|
|
24
|
-
} from "./chunk-XLPRFXMF.mjs";
|
|
25
|
-
|
|
26
|
-
// src/Backdrop/Overlay.tsx
|
|
27
|
-
import { useEffect, useState } from "react";
|
|
28
|
-
import ReactDOM from "react-dom";
|
|
29
|
-
import { jsx } from "react/jsx-runtime";
|
|
30
|
-
var Overlay = ({ visible, onDismissed, onClick, zIndex, isDark, children, opacity, withContainer = true }) => {
|
|
31
|
-
const [modalRoot, setModalRoot] = useState(null);
|
|
32
|
-
useEffect(() => {
|
|
33
|
-
let root = document.getElementById("modal-root");
|
|
34
|
-
if (!root) {
|
|
35
|
-
root = document.createElement("div");
|
|
36
|
-
root.id = "modal-root";
|
|
37
|
-
document.body.appendChild(root);
|
|
1
|
+
// src/constants.tsx
|
|
2
|
+
function _array_like_to_array(arr, len) {
|
|
3
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
4
|
+
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
5
|
+
return arr2;
|
|
6
|
+
}
|
|
7
|
+
function _array_with_holes(arr) {
|
|
8
|
+
if (Array.isArray(arr)) return arr;
|
|
9
|
+
}
|
|
10
|
+
function _define_property(obj, key, value) {
|
|
11
|
+
if (key in obj) {
|
|
12
|
+
Object.defineProperty(obj, key, {
|
|
13
|
+
value: value,
|
|
14
|
+
enumerable: true,
|
|
15
|
+
configurable: true,
|
|
16
|
+
writable: true
|
|
17
|
+
});
|
|
18
|
+
} else {
|
|
19
|
+
obj[key] = value;
|
|
38
20
|
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
21
|
+
return obj;
|
|
22
|
+
}
|
|
23
|
+
function _iterable_to_array_limit(arr, i) {
|
|
24
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
25
|
+
if (_i == null) return;
|
|
26
|
+
var _arr = [];
|
|
27
|
+
var _n = true;
|
|
28
|
+
var _d = false;
|
|
29
|
+
var _s, _e;
|
|
30
|
+
try {
|
|
31
|
+
for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
|
|
32
|
+
_arr.push(_s.value);
|
|
33
|
+
if (i && _arr.length === i) break;
|
|
34
|
+
}
|
|
35
|
+
} catch (err) {
|
|
36
|
+
_d = true;
|
|
37
|
+
_e = err;
|
|
38
|
+
} finally{
|
|
39
|
+
try {
|
|
40
|
+
if (!_n && _i["return"] != null) _i["return"]();
|
|
41
|
+
} finally{
|
|
42
|
+
if (_d) throw _e;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
return _arr;
|
|
46
|
+
}
|
|
47
|
+
function _non_iterable_rest() {
|
|
48
|
+
throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
49
|
+
}
|
|
50
|
+
function _object_destructuring_empty(o) {
|
|
51
|
+
if (o === null || o === void 0) throw new TypeError("Cannot destructure " + o);
|
|
52
|
+
return o;
|
|
53
|
+
}
|
|
54
|
+
function _object_spread(target) {
|
|
55
|
+
for(var i = 1; i < arguments.length; i++){
|
|
56
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
57
|
+
var ownKeys = Object.keys(source);
|
|
58
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
59
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
60
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
61
|
+
}));
|
|
62
|
+
}
|
|
63
|
+
ownKeys.forEach(function(key) {
|
|
64
|
+
_define_property(target, key, source[key]);
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
return target;
|
|
68
|
+
}
|
|
69
|
+
function ownKeys(object, enumerableOnly) {
|
|
70
|
+
var keys = Object.keys(object);
|
|
71
|
+
if (Object.getOwnPropertySymbols) {
|
|
72
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
73
|
+
if (enumerableOnly) {
|
|
74
|
+
symbols = symbols.filter(function(sym) {
|
|
75
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
keys.push.apply(keys, symbols);
|
|
79
|
+
}
|
|
80
|
+
return keys;
|
|
81
|
+
}
|
|
82
|
+
function _object_spread_props(target, source) {
|
|
83
|
+
source = source != null ? source : {};
|
|
84
|
+
if (Object.getOwnPropertyDescriptors) {
|
|
85
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
86
|
+
} else {
|
|
87
|
+
ownKeys(Object(source)).forEach(function(key) {
|
|
88
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
89
|
+
});
|
|
90
|
+
}
|
|
91
|
+
return target;
|
|
92
|
+
}
|
|
93
|
+
function _object_without_properties(source, excluded) {
|
|
94
|
+
if (source == null) return {};
|
|
95
|
+
var target = _object_without_properties_loose(source, excluded);
|
|
96
|
+
var key, i;
|
|
97
|
+
if (Object.getOwnPropertySymbols) {
|
|
98
|
+
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
99
|
+
for(i = 0; i < sourceSymbolKeys.length; i++){
|
|
100
|
+
key = sourceSymbolKeys[i];
|
|
101
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
102
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
103
|
+
target[key] = source[key];
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
return target;
|
|
107
|
+
}
|
|
108
|
+
function _object_without_properties_loose(source, excluded) {
|
|
109
|
+
if (source == null) return {};
|
|
110
|
+
var target = {};
|
|
111
|
+
var sourceKeys = Object.keys(source);
|
|
112
|
+
var key, i;
|
|
113
|
+
for(i = 0; i < sourceKeys.length; i++){
|
|
114
|
+
key = sourceKeys[i];
|
|
115
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
116
|
+
target[key] = source[key];
|
|
117
|
+
}
|
|
118
|
+
return target;
|
|
119
|
+
}
|
|
120
|
+
function _sliced_to_array(arr, i) {
|
|
121
|
+
return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
|
|
122
|
+
}
|
|
123
|
+
function _unsupported_iterable_to_array(o, minLen) {
|
|
124
|
+
if (!o) return;
|
|
125
|
+
if (typeof o === "string") return _array_like_to_array(o, minLen);
|
|
126
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
127
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
128
|
+
if (n === "Map" || n === "Set") return Array.from(n);
|
|
129
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
|
|
130
|
+
}
|
|
131
|
+
var PRIMARY_COLOR = "#00b4d8";
|
|
132
|
+
// src/Common/ErrorText.tsx
|
|
133
|
+
import { jsx } from "react/jsx-runtime";
|
|
134
|
+
var ErrorText = function(param) {
|
|
135
|
+
var text = param.text, style = param.style, classNames = param.classNames;
|
|
136
|
+
return /* @__PURE__ */ jsx("p", {
|
|
137
|
+
className: classNames ? classNames : "text-red-500 font-semibold text-wrap py-auto",
|
|
138
|
+
style: style,
|
|
139
|
+
children: text
|
|
140
|
+
});
|
|
141
|
+
};
|
|
142
|
+
var ErrorText_default = ErrorText;
|
|
143
|
+
// src/Common/fieldStyle.ts
|
|
144
|
+
var baseFieldStyle = "font-sans form-input h-11 w-full bg-white border-gray-200 dark:border-gray-500 dark:bg-slate-800 dark:text-gray-200 text-gray-700 dark:placeholder-gray-400 placeholder-gray-400 rounded-md px-2 py-1 focus:outline-none focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50";
|
|
145
|
+
var createExerciseElementStyle = "flex flex-col justify-between space-y-2 w-full p-4 bg-white dark:bg-slate-800 rounded-xl text-gray-800 dark:text-gray-200 border-2 border-slate-200 dark:border-slate-400 overflow-hidden transition-all";
|
|
146
|
+
var exerciseDeleteButton = "w-6 h-6 flex justify-center text-gray-700 dark:text-gray-200 hover:text-red-600 dark:hover:text-red-500 transition-all duration-150 hover:scale-125";
|
|
147
|
+
var xIconButton = "w-6 h-6 flex justify-center text-gray-700 dark:text-gray-200 hover:text-gray-950 dark:hover:text-gray-100 transition-all duration-150 hover:scale-125";
|
|
148
|
+
var exerciseEditButton = "w-6 h-6 flex justify-center text-gray-700 dark:text-gray-200 hover:text-red-600 dark:hover:text-green-500 transition-all duration-150 hover:scale-125";
|
|
149
|
+
var tippyClassname = "p-2 bg-slate-600 dark:bg-slate-900 opacity-90 text-white font-medium font-header rounded-lg";
|
|
150
|
+
var headerTippyClass = "rounded-lg p-2 bg-slate-950 opacity-95 text-white font-medium";
|
|
151
|
+
var headerButtonClass = "w-10 h-10 rounded-full dark:hover:bg-slate-600 hover:bg-slate-200 bg-transparent flex justify-center items-center flex justify-center items-center text-slate-600 dark:text-slate-100 hover:text-primary dark:hover:text-primary transition-colors duration-50";
|
|
152
|
+
var toolbarExerciseButton = "flex bg-gray-50/90 items-center sm:justify-between p-4 shadow-sm w-full rounded-xl border-4 border-transparent hover:border-white text-gray-700 hover:text-white hover:bg-indigo-500 transition-colors duration-75";
|
|
153
|
+
// src/Spinners/Spinner.tsx
|
|
154
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
155
|
+
var Spinner = function(param) {
|
|
156
|
+
var _param_visible = param.visible, visible = _param_visible === void 0 ? true : _param_visible, size = param.size, white = param.white, isDark = param.isDark;
|
|
157
|
+
if (visible === false) return null;
|
|
158
|
+
var isWhite = white || isDark;
|
|
159
|
+
var color = isWhite ? "stroke-white/90" : "stroke-slate-600/80";
|
|
160
|
+
var bgColor = isWhite ? "stroke-white/20" : "stroke-slate-500/20";
|
|
161
|
+
var dimensions = size === "small" ? "w-5 h-5" : "w-8 h-8";
|
|
162
|
+
var spinnerClasses = "\n absolute\n top-0\n animate-spin\n ".concat(dimensions, "\n ");
|
|
163
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
164
|
+
className: "relative h-8 w-8 flex justify-center items-center",
|
|
165
|
+
children: [
|
|
166
|
+
/* @__PURE__ */ jsx2("svg", {
|
|
167
|
+
className: "absolute top-0 ".concat(dimensions, " ").concat(bgColor),
|
|
168
|
+
viewBox: "0 0 24 24",
|
|
169
|
+
fill: "none",
|
|
170
|
+
strokeWidth: "2.4",
|
|
171
|
+
children: /* @__PURE__ */ jsx2("circle", {
|
|
172
|
+
cx: "12",
|
|
173
|
+
cy: "12",
|
|
174
|
+
r: "10"
|
|
175
|
+
})
|
|
176
|
+
}),
|
|
177
|
+
/* @__PURE__ */ jsx2("svg", {
|
|
178
|
+
className: spinnerClasses,
|
|
179
|
+
viewBox: "0 0 24 24",
|
|
180
|
+
fill: "none",
|
|
181
|
+
strokeWidth: "2.4",
|
|
182
|
+
strokeLinecap: "round",
|
|
183
|
+
children: /* @__PURE__ */ jsx2("path", {
|
|
184
|
+
d: "\n M 12 2 \n A 10 10 0 0 1 22 12 \n A 10 10 0 0 1 12 22 \n A 10 10 0 0 1 2 12 \n A 10 10 0 0 1 12 2\n ",
|
|
185
|
+
strokeDasharray: "13 18.4",
|
|
186
|
+
stroke: "inherit",
|
|
187
|
+
className: color
|
|
188
|
+
})
|
|
189
|
+
})
|
|
190
|
+
]
|
|
191
|
+
});
|
|
192
|
+
};
|
|
193
|
+
var SpinnerCentered = function(props) {
|
|
194
|
+
if (props.visible === false) return null;
|
|
195
|
+
return /* @__PURE__ */ jsx2("div", {
|
|
196
|
+
className: "w-full flex justify-center items-center",
|
|
197
|
+
children: /* @__PURE__ */ jsx2(Spinner, _object_spread({}, props))
|
|
198
|
+
});
|
|
199
|
+
};
|
|
200
|
+
Spinner.displayName = "Spinner";
|
|
201
|
+
SpinnerCentered.displayName = "Spinner.Centered";
|
|
202
|
+
Spinner.Centered = SpinnerCentered;
|
|
203
|
+
var Spinner_default = Spinner;
|
|
204
|
+
// src/Common/NoResults.tsx
|
|
205
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
206
|
+
var HEIGHT = 160;
|
|
207
|
+
var WIDTH = HEIGHT * (16 / 9);
|
|
208
|
+
var NoResults = function(param) {
|
|
209
|
+
var loading = param.loading, message = param.message;
|
|
210
|
+
return /* @__PURE__ */ jsxs2("div", {
|
|
211
|
+
className: "relative w-full flex justify-center items-center",
|
|
212
|
+
children: [
|
|
213
|
+
/* @__PURE__ */ jsxs2("div", {
|
|
214
|
+
className: "flex justify-start w-full space-x-2 py-3 p-4 bg-slate-100 dark:bg-slate-800 rounded-md",
|
|
215
|
+
children: [
|
|
216
|
+
/* @__PURE__ */ jsx3("div", {
|
|
217
|
+
style: {
|
|
218
|
+
width: "calc(".concat(WIDTH, "px + 1rem)"),
|
|
219
|
+
height: 320
|
|
220
|
+
},
|
|
221
|
+
className: "rounded-lg overflow-hidden cursor-pointer hover:shadow-md transition-shadow duration-150 px-2 pt-2 bg-slate-200 dark:bg-slate-700 animate-pulse"
|
|
222
|
+
}),
|
|
223
|
+
/* @__PURE__ */ jsx3("div", {
|
|
224
|
+
style: {
|
|
225
|
+
width: "calc(".concat(WIDTH, "px + 1rem)"),
|
|
226
|
+
height: 320
|
|
227
|
+
},
|
|
228
|
+
className: "rounded-lg overflow-hidden cursor-pointer hover:shadow-md transition-shadow duration-150 px-2 pt-2 bg-slate-200 dark:bg-slate-700 animate-pulse"
|
|
229
|
+
})
|
|
230
|
+
]
|
|
231
|
+
}),
|
|
232
|
+
!loading && /* @__PURE__ */ jsx3("div", {
|
|
233
|
+
className: "absolute w-full h-full flex justify-center items-center m-auto",
|
|
234
|
+
children: /* @__PURE__ */ jsx3("div", {
|
|
235
|
+
className: "p-4 rounded-lg bg-white dark:bg-slate-700 shadow-xl",
|
|
236
|
+
children: /* @__PURE__ */ jsx3("p", {
|
|
237
|
+
className: "font-semibold text-lg text-gray-700 dark:text-gray-300",
|
|
238
|
+
children: message || "No results"
|
|
239
|
+
})
|
|
240
|
+
})
|
|
241
|
+
})
|
|
242
|
+
]
|
|
243
|
+
});
|
|
244
|
+
};
|
|
245
|
+
var NoResults_default = NoResults;
|
|
246
|
+
// src/Common/Pill.tsx
|
|
247
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
248
|
+
var Pill = function(param) {
|
|
249
|
+
var text = param.text;
|
|
250
|
+
return /* @__PURE__ */ jsx4("span", {
|
|
251
|
+
className: "rounded-full px-3 py-1 text-sm font-header font-medium bg-white dark:bg-slate-900 text-gray-700 dark:text-gray-300 mr-2 mb-2",
|
|
252
|
+
children: text
|
|
253
|
+
});
|
|
254
|
+
};
|
|
255
|
+
var Pill_default = Pill;
|
|
256
|
+
// src/Common/StepsComponent.tsx
|
|
257
|
+
import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
258
|
+
var StepsComponent = function(param) {
|
|
259
|
+
var steps = param.steps, activeStep = param.activeStep, onStepPress = param.onStepPress;
|
|
260
|
+
return /* @__PURE__ */ jsx5("div", {
|
|
261
|
+
className: "flex justify-between items-center w-full p-1 mb-2",
|
|
262
|
+
children: steps.map(function(step, index) {
|
|
263
|
+
return /* @__PURE__ */ jsx5("div", {
|
|
264
|
+
className: "flex justify-center items-center space-x-2 w-full",
|
|
265
|
+
children: /* @__PURE__ */ jsx5("div", {
|
|
266
|
+
className: "flex flex-col items-center",
|
|
267
|
+
children: /* @__PURE__ */ jsx5("button", {
|
|
268
|
+
type: "button",
|
|
269
|
+
onClick: function() {
|
|
270
|
+
return onStepPress(index);
|
|
271
|
+
},
|
|
272
|
+
className: "flex items-center space-x-2 px-4 py-2 rounded-lg min-w-10 md:min-w-20 sm:min-w-40 font-header transition-all duration-150\n ".concat(activeStep === index ? "bg-primary text-white shadow-lg scale-110 border-2 border-primary" : "bg-gray-100 dark:bg-slate-800 text-gray-700 dark:text-gray-200 hover:bg-gray-200 dark:hover:bg-slate-700 border-2 border-transparent hover:border-primary/30"),
|
|
273
|
+
children: /* @__PURE__ */ jsxs3("span", {
|
|
274
|
+
className: "font-medium truncate",
|
|
275
|
+
children: [
|
|
276
|
+
index + 1,
|
|
277
|
+
". ",
|
|
278
|
+
step.label
|
|
279
|
+
]
|
|
280
|
+
})
|
|
281
|
+
})
|
|
282
|
+
})
|
|
283
|
+
}, "step_".concat(index, "_").concat(step.label));
|
|
284
|
+
})
|
|
285
|
+
});
|
|
286
|
+
};
|
|
287
|
+
var StepsComponent_default = StepsComponent;
|
|
288
|
+
// src/Fade/Fade.tsx
|
|
289
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
290
|
+
var Fade = function(param) {
|
|
291
|
+
var children = param.children, inProp = param.inProp;
|
|
292
|
+
return /* @__PURE__ */ jsx6("div", {
|
|
293
|
+
className: "animate-fade-in",
|
|
294
|
+
children: children
|
|
295
|
+
});
|
|
296
|
+
};
|
|
297
|
+
var Fade_default = Fade;
|
|
298
|
+
// src/Backdrop/Backdrop.tsx
|
|
299
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
300
|
+
var Backdrop = function(param) {
|
|
301
|
+
var visible = param.visible, onClick = param.onClick, opacity = param.opacity;
|
|
302
|
+
if (!visible) return null;
|
|
303
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
54
304
|
style: {
|
|
55
|
-
|
|
56
|
-
|
|
305
|
+
opacity: opacity ? opacity : 90,
|
|
306
|
+
zIndex: 21
|
|
57
307
|
},
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
308
|
+
className: "fixed top-0 left-0 w-full h-screen bg-gray-100 dark:bg-slate-900",
|
|
309
|
+
onClick: onClick
|
|
310
|
+
});
|
|
311
|
+
};
|
|
312
|
+
var Backdrop_default = Backdrop;
|
|
313
|
+
// src/Breakpoint/Breakpoint.tsx
|
|
314
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
315
|
+
var Breakpoint = function(param) {
|
|
316
|
+
var children = param.children, fromSize = param.fromSize, toSize = param.toSize;
|
|
317
|
+
var className = "";
|
|
318
|
+
if (fromSize && toSize) {
|
|
319
|
+
className = "hidden ".concat(fromSize, ":block ").concat(toSize, ":hidden");
|
|
320
|
+
} else if (fromSize) {
|
|
321
|
+
className = "hidden ".concat(fromSize, ":block");
|
|
322
|
+
} else if (toSize) {
|
|
323
|
+
className = "block ".concat(toSize, ":hidden");
|
|
324
|
+
}
|
|
325
|
+
return /* @__PURE__ */ jsx8("div", {
|
|
326
|
+
className: className,
|
|
327
|
+
children: children
|
|
328
|
+
});
|
|
329
|
+
};
|
|
330
|
+
var Breakpoint_default = Breakpoint;
|
|
331
|
+
// src/Backdrop/Overlay.tsx
|
|
332
|
+
import { useEffect, useState } from "react";
|
|
333
|
+
import ReactDOM from "react-dom";
|
|
334
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
335
|
+
var Overlay = function(param) {
|
|
336
|
+
var visible = param.visible, onDismissed = param.onDismissed, onClick = param.onClick, zIndex = param.zIndex, isDark = param.isDark, children = param.children, opacity = param.opacity, _param_withContainer = param.withContainer, withContainer = _param_withContainer === void 0 ? true : _param_withContainer;
|
|
337
|
+
var _useState = _sliced_to_array(useState(null), 2), modalRoot = _useState[0], setModalRoot = _useState[1];
|
|
338
|
+
useEffect(function() {
|
|
339
|
+
var root = document.getElementById("modal-root");
|
|
340
|
+
if (!root) {
|
|
341
|
+
root = document.createElement("div");
|
|
342
|
+
root.id = "modal-root";
|
|
343
|
+
document.body.appendChild(root);
|
|
344
|
+
}
|
|
345
|
+
setModalRoot(root);
|
|
346
|
+
return function() {
|
|
347
|
+
var root2 = document.getElementById("modal-root");
|
|
348
|
+
if (root2) {
|
|
349
|
+
document.body.removeChild(root2);
|
|
350
|
+
}
|
|
351
|
+
};
|
|
352
|
+
}, [
|
|
353
|
+
visible
|
|
354
|
+
]);
|
|
355
|
+
if (!visible || !modalRoot) return null;
|
|
356
|
+
return ReactDOM.createPortal(/* @__PURE__ */ jsx9("div", {
|
|
357
|
+
className: "animate-fade-in",
|
|
358
|
+
children: withContainer ? /* @__PURE__ */ jsx9("div", {
|
|
359
|
+
onClick: onDismissed || onClick,
|
|
360
|
+
className: "top-0 left-0 fixed w-full h-screen flex items-center justify-center",
|
|
361
|
+
style: {
|
|
362
|
+
background: isDark ? "rgba(0, 0, 0, ".concat(opacity || "0.7", ")") : "rgba(255, 255, 255, ".concat(opacity || "0.6", ")"),
|
|
363
|
+
zIndex: zIndex || 9999
|
|
364
|
+
},
|
|
365
|
+
children: children
|
|
366
|
+
}) : children
|
|
367
|
+
}), modalRoot);
|
|
63
368
|
};
|
|
64
369
|
var Overlay_default = Overlay;
|
|
65
|
-
|
|
66
370
|
// src/Button/Button.tsx
|
|
67
|
-
import { jsx as
|
|
68
|
-
var Button = (
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
371
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
372
|
+
var Button = function(param) {
|
|
373
|
+
var _param_disabled = param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, loading = param.loading, onClick = param.onClick, _param_kind = param.kind, kind = _param_kind === void 0 ? "primary" : _param_kind, _param_size = param.size, size = _param_size === void 0 ? "small" : _param_size, _param_type = param.type, type = _param_type === void 0 ? "button" : _param_type, children = param.children;
|
|
374
|
+
var styled = function() {
|
|
375
|
+
switch(kind){
|
|
376
|
+
case "primary":
|
|
377
|
+
return "bg-primary font-header text-white font-medium transition-all duration-75 ".concat(disabled ? "bg-white/50" : "hover:bg-black/10");
|
|
378
|
+
case "indigo":
|
|
379
|
+
return "bg-indigo-500 font-header text-white font-medium transition-all duration-75 ".concat(disabled ? "bg-white/50" : "hover:bg-black/10");
|
|
380
|
+
case "green":
|
|
381
|
+
return "bg-green-500 font-header text-white font-medium transition-all duration-75 ".concat(disabled ? "bg-white/50" : "hover:bg-black/10");
|
|
382
|
+
case "teal":
|
|
383
|
+
return "bg-teal-500 font-header text-white font-medium transition-all duration-75 ".concat(disabled ? "bg-white/50" : "hover:bg-black/10");
|
|
384
|
+
case "secondary":
|
|
385
|
+
return "bg-secondary text-white font-header font-medium hover:bg-black/10 transition-all duration-75";
|
|
386
|
+
case "base":
|
|
387
|
+
return "bg-white border-1 font-header border-gray-200 dark:bg-slate-600 dark:text-gray-100 dark:hover:bg-slate-400 hover:bg-slate-100 transition-all duration-75";
|
|
388
|
+
case "gray":
|
|
389
|
+
return "bg-slate-400 dark:bg-slate-700 font-header text-white border-1 font-medium hover:bg-black/10 transition-opacity duration-75";
|
|
390
|
+
case "alert":
|
|
391
|
+
return "bg-amber-500 font-header text-white transition-all hover:bg-black/10 duration-75";
|
|
392
|
+
case "warning":
|
|
393
|
+
return "bg-red-500 font-header text-white font-medium hover:bg-black/10 transition-opacity duration-100";
|
|
394
|
+
default:
|
|
395
|
+
break;
|
|
396
|
+
}
|
|
397
|
+
};
|
|
398
|
+
var sized = function() {
|
|
399
|
+
switch(size){
|
|
400
|
+
case "small":
|
|
401
|
+
return "p-1";
|
|
402
|
+
case "fixed":
|
|
403
|
+
return "box-border w-32 h-11";
|
|
404
|
+
case "large":
|
|
405
|
+
return "px-2 h-11";
|
|
406
|
+
default:
|
|
407
|
+
return "px-2 py-1";
|
|
408
|
+
}
|
|
409
|
+
};
|
|
410
|
+
return /* @__PURE__ */ jsx10("button", {
|
|
411
|
+
type: type || "button",
|
|
412
|
+
disabled: disabled,
|
|
413
|
+
className: "rounded-lg focus:outline-none transition duration-100 ".concat(styled(), " ").concat(sized()),
|
|
414
|
+
onClick: onClick,
|
|
415
|
+
children: /* @__PURE__ */ jsx10("div", {
|
|
416
|
+
className: "w-full max-h-11",
|
|
417
|
+
children: loading ? /* @__PURE__ */ jsx10("div", {
|
|
418
|
+
className: "flex w-full justify-center items-center",
|
|
419
|
+
children: /* @__PURE__ */ jsx10(Spinner_default, {
|
|
420
|
+
white: true
|
|
421
|
+
})
|
|
422
|
+
}) : children
|
|
423
|
+
})
|
|
424
|
+
});
|
|
106
425
|
};
|
|
107
426
|
var Button_default = Button;
|
|
108
|
-
|
|
109
427
|
// src/Button/FunButton.tsx
|
|
110
428
|
import { useMemo } from "react";
|
|
111
429
|
import { motion } from "framer-motion";
|
|
112
|
-
import { jsx as
|
|
113
|
-
var FunButton = ({
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
}, [size]);
|
|
158
|
-
const computedClassName = useMemo(() => {
|
|
159
|
-
const cName = className + " rounded-lg border-none p-0 cursor-pointer opacity-90 hover:bg-black/30 transition-opacity";
|
|
160
|
-
return cName + (disabled ? " opacity-70 cursor-default" : "");
|
|
161
|
-
}, [className, disabled]);
|
|
162
|
-
const computedClassStyle = useMemo(() => {
|
|
163
|
-
const cName = classStyle;
|
|
164
|
-
return cName + (disabled ? " opacity-70 cursor-default hover:bg-black/70" : "");
|
|
165
|
-
}, [classStyle, disabled]);
|
|
166
|
-
return /* @__PURE__ */ jsx3(
|
|
167
|
-
motion.button,
|
|
168
|
-
{
|
|
169
|
-
className: `${computedClassName}`,
|
|
170
|
-
style: { background: front, outlineOffset: "4px" },
|
|
171
|
-
type,
|
|
172
|
-
onMouseDown: onClick,
|
|
173
|
-
whileTap: { y: disabled ? 0 : 2 },
|
|
174
|
-
transition: { duration: 0.1, ease: "easeInOut" },
|
|
175
|
-
children: /* @__PURE__ */ jsx3(
|
|
176
|
-
motion.span,
|
|
177
|
-
{
|
|
178
|
-
className: computedClassStyle,
|
|
179
|
-
style: {
|
|
180
|
-
background: bottom,
|
|
181
|
-
opacity: 1
|
|
182
|
-
},
|
|
183
|
-
initial: { y: active ? 0 : -6 },
|
|
184
|
-
animate: { y: active ? 0 : -6 },
|
|
185
|
-
whileTap: { y: disabled ? -6 : 0 },
|
|
186
|
-
transition: { duration: 0.1, ease: "easeInOut" },
|
|
187
|
-
children: loading ? /* @__PURE__ */ jsx3("div", { className: size === "small" ? "min-h-6" : "min-h-10", children: /* @__PURE__ */ jsx3(Spinner_default.Centered, { visible: true, size: size === "small" ? "small" : "base", white: true }) }) : children
|
|
430
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
431
|
+
var FunButton = function(param) {
|
|
432
|
+
var onClick = param.onClick, disabled = param.disabled, type = param.type, children = param.children, _param_color = param.color, color = _param_color === void 0 ? "primary" : _param_color, loading = param.loading, active = param.active, className = param.className, _param_size = param.size, size = _param_size === void 0 ? "base" : _param_size;
|
|
433
|
+
var _useMemo = useMemo(function() {
|
|
434
|
+
switch(color){
|
|
435
|
+
case "primary":
|
|
436
|
+
return {
|
|
437
|
+
bottom: "#00b4d8",
|
|
438
|
+
front: "#0284c7"
|
|
439
|
+
};
|
|
440
|
+
case "red":
|
|
441
|
+
return {
|
|
442
|
+
bottom: "#f00f0f",
|
|
443
|
+
front: "#b91c1c"
|
|
444
|
+
};
|
|
445
|
+
case "green":
|
|
446
|
+
return {
|
|
447
|
+
bottom: "#22c55e",
|
|
448
|
+
front: "#16a34a"
|
|
449
|
+
};
|
|
450
|
+
case "purple":
|
|
451
|
+
return {
|
|
452
|
+
bottom: "#6366f1",
|
|
453
|
+
front: "#4f46e5"
|
|
454
|
+
};
|
|
455
|
+
case "teal":
|
|
456
|
+
return {
|
|
457
|
+
bottom: "#14b8a6",
|
|
458
|
+
front: "#0d9488"
|
|
459
|
+
};
|
|
460
|
+
case "cyan":
|
|
461
|
+
return {
|
|
462
|
+
bottom: "#06b6d4",
|
|
463
|
+
front: "#0891b2"
|
|
464
|
+
};
|
|
465
|
+
case "yellow":
|
|
466
|
+
return {
|
|
467
|
+
bottom: "#eab308",
|
|
468
|
+
front: "#ca8a04"
|
|
469
|
+
};
|
|
470
|
+
default:
|
|
471
|
+
return {
|
|
472
|
+
bottom: "#00b4d8",
|
|
473
|
+
front: "#0369a1"
|
|
474
|
+
};
|
|
188
475
|
}
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
476
|
+
}, [
|
|
477
|
+
color
|
|
478
|
+
]), front = _useMemo.front, bottom = _useMemo.bottom;
|
|
479
|
+
var classStyle = useMemo(function() {
|
|
480
|
+
switch(size){
|
|
481
|
+
case "base":
|
|
482
|
+
return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
|
|
483
|
+
case "big":
|
|
484
|
+
return "relative block px-12 py-4 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
|
|
485
|
+
case "small":
|
|
486
|
+
return "relative block px-6 py-1 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
|
|
487
|
+
case "square":
|
|
488
|
+
return "relative block h-12 w-12 rounded text-lg flex items-center justify-center text-white font-medium font-header hover:bg-slate-900/20";
|
|
489
|
+
default:
|
|
490
|
+
return "relative block px-8 py-3 rounded-lg text-lg text-white font-medium font-header hover:bg-slate-900/20";
|
|
491
|
+
}
|
|
492
|
+
}, [
|
|
493
|
+
size
|
|
494
|
+
]);
|
|
495
|
+
var computedClassName = useMemo(function() {
|
|
496
|
+
var cName = className + " rounded-lg border-none p-0 cursor-pointer opacity-90 hover:bg-black/30 transition-opacity";
|
|
497
|
+
return cName + (disabled ? " opacity-70 cursor-default" : "");
|
|
498
|
+
}, [
|
|
499
|
+
className,
|
|
500
|
+
disabled
|
|
501
|
+
]);
|
|
502
|
+
var computedClassStyle = useMemo(function() {
|
|
503
|
+
var cName = classStyle;
|
|
504
|
+
return cName + (disabled ? " opacity-70 cursor-default hover:bg-black/70" : "");
|
|
505
|
+
}, [
|
|
506
|
+
classStyle,
|
|
507
|
+
disabled
|
|
508
|
+
]);
|
|
509
|
+
return /* @__PURE__ */ jsx11(motion.button, {
|
|
510
|
+
className: "".concat(computedClassName),
|
|
511
|
+
style: {
|
|
512
|
+
background: front,
|
|
513
|
+
outlineOffset: "4px"
|
|
514
|
+
},
|
|
515
|
+
type: type,
|
|
516
|
+
onMouseDown: onClick,
|
|
517
|
+
whileTap: {
|
|
518
|
+
y: disabled ? 0 : 2
|
|
519
|
+
},
|
|
520
|
+
transition: {
|
|
521
|
+
duration: 0.1,
|
|
522
|
+
ease: "easeInOut"
|
|
523
|
+
},
|
|
524
|
+
children: /* @__PURE__ */ jsx11(motion.span, {
|
|
525
|
+
className: computedClassStyle,
|
|
526
|
+
style: {
|
|
527
|
+
background: bottom,
|
|
528
|
+
opacity: 1
|
|
529
|
+
},
|
|
530
|
+
initial: {
|
|
531
|
+
y: active ? 0 : -6
|
|
532
|
+
},
|
|
533
|
+
animate: {
|
|
534
|
+
y: active ? 0 : -6
|
|
535
|
+
},
|
|
536
|
+
whileTap: {
|
|
537
|
+
y: disabled ? -6 : 0
|
|
538
|
+
},
|
|
539
|
+
transition: {
|
|
540
|
+
duration: 0.1,
|
|
541
|
+
ease: "easeInOut"
|
|
542
|
+
},
|
|
543
|
+
children: loading ? /* @__PURE__ */ jsx11("div", {
|
|
544
|
+
className: size === "small" ? "min-h-6" : "min-h-10",
|
|
545
|
+
children: /* @__PURE__ */ jsx11(Spinner_default.Centered, {
|
|
546
|
+
visible: true,
|
|
547
|
+
size: size === "small" ? "small" : "base",
|
|
548
|
+
white: true
|
|
549
|
+
})
|
|
550
|
+
}) : children
|
|
551
|
+
})
|
|
552
|
+
});
|
|
192
553
|
};
|
|
193
554
|
var FunButton_default = FunButton;
|
|
194
|
-
|
|
195
555
|
// src/Button/FunRoundButton.tsx
|
|
196
556
|
import { useMemo as useMemo2 } from "react";
|
|
197
557
|
import { motion as motion2 } from "framer-motion";
|
|
198
|
-
import { jsx as
|
|
199
|
-
var FunRoundButton = (
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
558
|
+
import { jsx as jsx12 } from "react/jsx-runtime";
|
|
559
|
+
var FunRoundButton = function(param) {
|
|
560
|
+
var onClick = param.onClick, disabled = param.disabled, type = param.type, children = param.children, color = param.color, active = param.active, className = param.className, _param_size = param.size, size = _param_size === void 0 ? 44 : _param_size;
|
|
561
|
+
var _useMemo2 = useMemo2(function() {
|
|
562
|
+
switch(color){
|
|
563
|
+
case "primary":
|
|
564
|
+
return {
|
|
565
|
+
bottom: "#00b4d8",
|
|
566
|
+
front: "#0284c7"
|
|
567
|
+
};
|
|
568
|
+
case "red":
|
|
569
|
+
return {
|
|
570
|
+
bottom: disabled ? "hsl(340deg 100% 42%)" : "hsl(345deg 100% 47%)",
|
|
571
|
+
front: disabled ? "hsl(340deg 100% 52%)" : "hsl(340deg 100% 32%)"
|
|
572
|
+
};
|
|
573
|
+
case "green":
|
|
574
|
+
return {
|
|
575
|
+
bottom: disabled ? "#86efac" : "#22c55e",
|
|
576
|
+
front: disabled ? "#4ade80" : "#16a34a"
|
|
577
|
+
};
|
|
578
|
+
case "purple":
|
|
579
|
+
return {
|
|
580
|
+
bottom: disabled ? "#a5b4fc" : "#6366f1",
|
|
581
|
+
front: disabled ? "#818cf8" : "#4f46e5"
|
|
582
|
+
};
|
|
583
|
+
case "teal":
|
|
584
|
+
return {
|
|
585
|
+
bottom: disabled ? "#5eead4" : "#14b8a6",
|
|
586
|
+
front: disabled ? "#2dd4bf" : "#0d9488"
|
|
587
|
+
};
|
|
588
|
+
case "yellow":
|
|
589
|
+
return {
|
|
590
|
+
bottom: disabled ? "#fde047" : "#eab308",
|
|
591
|
+
front: disabled ? "#facc15" : "#ca8a04"
|
|
592
|
+
};
|
|
593
|
+
default:
|
|
594
|
+
return {
|
|
595
|
+
bottom: disabled ? "#d1d5db" : "#00b4d8",
|
|
596
|
+
front: disabled ? "#38bdf8" : "#0369a1"
|
|
597
|
+
};
|
|
598
|
+
}
|
|
599
|
+
}, [
|
|
600
|
+
color,
|
|
601
|
+
disabled
|
|
602
|
+
]), front = _useMemo2.front, bottom = _useMemo2.bottom;
|
|
603
|
+
return /* @__PURE__ */ jsx12(motion2.button, {
|
|
604
|
+
className: "".concat(className || "border-none p-0 flex justify-center items-center cursor-pointer z-10", " ").concat(disabled ? "opacity-70 cursor-default" : "hover:opacity-95"),
|
|
605
|
+
style: {
|
|
606
|
+
background: front,
|
|
240
607
|
height: size,
|
|
241
608
|
width: size + 2,
|
|
242
|
-
borderRadius: (size + 2) / 2
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
}
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
609
|
+
borderRadius: (size + 2) / 2,
|
|
610
|
+
outlineOffset: 0
|
|
611
|
+
},
|
|
612
|
+
type: type,
|
|
613
|
+
disabled: disabled,
|
|
614
|
+
onClick: onClick,
|
|
615
|
+
whileHover: {
|
|
616
|
+
opacity: 0.95
|
|
617
|
+
},
|
|
618
|
+
whileTap: {
|
|
619
|
+
y: disabled ? 0 : 2
|
|
620
|
+
},
|
|
621
|
+
children: /* @__PURE__ */ jsx12(motion2.span, {
|
|
622
|
+
className: "flex justify-center items-center z-10",
|
|
623
|
+
style: {
|
|
624
|
+
background: bottom,
|
|
625
|
+
height: size,
|
|
626
|
+
width: size + 2,
|
|
627
|
+
borderRadius: (size + 2) / 2
|
|
628
|
+
},
|
|
629
|
+
initial: {
|
|
630
|
+
y: active ? 0 : -6
|
|
631
|
+
},
|
|
632
|
+
animate: {
|
|
633
|
+
y: active ? 0 : -6
|
|
634
|
+
},
|
|
635
|
+
transition: {
|
|
636
|
+
duration: 0.1,
|
|
637
|
+
ease: "easeInOut"
|
|
638
|
+
},
|
|
639
|
+
whileHover: {
|
|
640
|
+
opacity: 0.95
|
|
641
|
+
},
|
|
642
|
+
whileTap: {
|
|
643
|
+
y: disabled ? active ? 0 : -6 : 0
|
|
644
|
+
},
|
|
645
|
+
children: children
|
|
646
|
+
})
|
|
647
|
+
});
|
|
254
648
|
};
|
|
255
649
|
var FunRoundButton_default = FunRoundButton;
|
|
256
|
-
|
|
257
650
|
// src/Checkbox/Checkbox.tsx
|
|
258
651
|
import { useMemo as useMemo3 } from "react";
|
|
259
652
|
import { useField } from "formik";
|
|
260
|
-
import { jsx as
|
|
261
|
-
var Checkbox = (
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
/* @__PURE__ */
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
653
|
+
import { jsx as jsx13, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
654
|
+
var Checkbox = function(param) {
|
|
655
|
+
var name = param.name, labelText = param.labelText, isLarge = param.isLarge, onChange = param.onChange, isDisabled = param.isDisabled;
|
|
656
|
+
var _useField = _sliced_to_array(useField(name), 3), value = _useField[0].value, error = _useField[1].error, _useField_ = _useField[2], setValue = _useField_.setValue, setTouched = _useField_.setTouched;
|
|
657
|
+
var onCheck = function(e) {
|
|
658
|
+
setTouched(true);
|
|
659
|
+
setValue(!value, true);
|
|
660
|
+
};
|
|
661
|
+
var rand = useMemo3(function() {
|
|
662
|
+
return Math.random();
|
|
663
|
+
}, []);
|
|
664
|
+
return /* @__PURE__ */ jsxs4("div", {
|
|
665
|
+
className: "relative flex flex-col justify-center items-center",
|
|
666
|
+
children: [
|
|
667
|
+
/* @__PURE__ */ jsxs4("div", {
|
|
668
|
+
className: "flex items-center",
|
|
669
|
+
children: [
|
|
670
|
+
/* @__PURE__ */ jsx13("input", {
|
|
671
|
+
disabled: !!isDisabled,
|
|
672
|
+
onChange: function(e) {
|
|
673
|
+
onCheck(e);
|
|
674
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(Boolean(e.target.value));
|
|
675
|
+
},
|
|
676
|
+
value: value ? "true" : "false",
|
|
677
|
+
id: "".concat(name).concat(rand),
|
|
678
|
+
name: name,
|
|
679
|
+
type: "checkbox",
|
|
680
|
+
checked: !!value,
|
|
681
|
+
className: "form-checkbox text-blue-600 focus:ring-blue-500 border-gray-300 rounded ".concat(isLarge ? "h-5 w-5" : "h-4 w-4")
|
|
682
|
+
}),
|
|
683
|
+
typeof labelText === "string" ? /* @__PURE__ */ jsx13("label", {
|
|
684
|
+
htmlFor: "".concat(name).concat(rand),
|
|
685
|
+
className: "ml-2 block text-sm text-gray-800 dark:text-gray-200",
|
|
686
|
+
children: labelText
|
|
687
|
+
}) : /* @__PURE__ */ jsx13("label", {
|
|
688
|
+
htmlFor: "".concat(name).concat(rand),
|
|
689
|
+
children: labelText
|
|
690
|
+
})
|
|
691
|
+
]
|
|
692
|
+
}),
|
|
693
|
+
error && /* @__PURE__ */ jsx13(ErrorText_default, {
|
|
694
|
+
classNames: "absolute w-64 left-6 top-4 text-xs text-red-500",
|
|
695
|
+
text: error
|
|
696
|
+
})
|
|
697
|
+
]
|
|
698
|
+
});
|
|
292
699
|
};
|
|
293
|
-
var MultiChoiceCheckBox = (
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
700
|
+
var MultiChoiceCheckBox = function(param) {
|
|
701
|
+
var name = param.name, hasMultipleAnswers = param.hasMultipleAnswers, index = param.index, isLarge = param.isLarge, allOptionsName = param.allOptionsName;
|
|
702
|
+
var _useField = _sliced_to_array(useField(name), 3), value = _useField[0].value, ref = _object_destructuring_empty(_useField[1]), _useField_ = _useField[2], setValue = _useField_.setValue, setTouched = _useField_.setTouched;
|
|
703
|
+
var _useField1 = _sliced_to_array(useField(allOptionsName), 3), _useField_1 = _useField1[0], optionsValue = _useField_1.value, _useField_2 = _useField1[2], setOptionsValue = _useField_2.setValue;
|
|
704
|
+
var onCheck = function(e) {
|
|
705
|
+
setTouched(true);
|
|
706
|
+
if (hasMultipleAnswers) {
|
|
707
|
+
setValue(!value);
|
|
708
|
+
return;
|
|
709
|
+
}
|
|
710
|
+
setOptionsValue(optionsValue === null || optionsValue === void 0 ? void 0 : optionsValue.map(function(el, idx) {
|
|
711
|
+
return {
|
|
712
|
+
option: el.option,
|
|
713
|
+
id: el.id,
|
|
714
|
+
isCorrectAnswer: index === idx ? !el.isCorrectAnswer : false
|
|
715
|
+
};
|
|
716
|
+
}));
|
|
717
|
+
};
|
|
718
|
+
return /* @__PURE__ */ jsx13("div", {
|
|
719
|
+
className: "flex flex-col justify-center items-center",
|
|
720
|
+
children: /* @__PURE__ */ jsx13("div", {
|
|
721
|
+
className: "flex items-center",
|
|
722
|
+
children: /* @__PURE__ */ jsx13("input", {
|
|
723
|
+
onChange: function(e) {
|
|
724
|
+
return onCheck(e);
|
|
725
|
+
},
|
|
726
|
+
value: index,
|
|
727
|
+
checked: !!value,
|
|
728
|
+
id: name,
|
|
729
|
+
name: name,
|
|
730
|
+
type: "checkbox",
|
|
731
|
+
className: "form-checkbox text-blue-600 focus:ring-blue-500 border-gray-300 rounded ".concat(isLarge ? "h-5 w-5" : "h-4 w-4")
|
|
732
|
+
})
|
|
733
|
+
})
|
|
734
|
+
});
|
|
316
735
|
};
|
|
317
736
|
Checkbox.Multi = MultiChoiceCheckBox;
|
|
318
737
|
var Checkbox_default = Checkbox;
|
|
319
|
-
|
|
320
738
|
// src/Checkbox/RadioOption.tsx
|
|
321
739
|
import { useField as useField2 } from "formik";
|
|
322
|
-
import { jsx as
|
|
323
|
-
var RadioOption = (
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
/* @__PURE__ */
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
740
|
+
import { jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
741
|
+
var RadioOption = function(param) {
|
|
742
|
+
var name = param.name, isLarge = param.isLarge, labelText = param.labelText, option = param.option, onSelect = param.onSelect;
|
|
743
|
+
var _useField2 = _sliced_to_array(useField2(name), 3), value = _useField2[0].value, ref = _object_destructuring_empty(_useField2[1]), setValue = _useField2[2].setValue;
|
|
744
|
+
return /* @__PURE__ */ jsxs5("div", {
|
|
745
|
+
className: "flex items-center",
|
|
746
|
+
children: [
|
|
747
|
+
/* @__PURE__ */ jsx14("input", {
|
|
748
|
+
onChange: function() {
|
|
749
|
+
setValue(option);
|
|
750
|
+
onSelect === null || onSelect === void 0 ? void 0 : onSelect();
|
|
751
|
+
},
|
|
752
|
+
value: option,
|
|
753
|
+
id: option,
|
|
754
|
+
name: name,
|
|
755
|
+
type: "checkbox",
|
|
756
|
+
checked: value === option,
|
|
757
|
+
className: "form-checkbox text-blue-600 focus:ring-blue-500 border-gray-300 rounded ".concat(isLarge ? "h-5 w-5" : "h-4 w-4")
|
|
758
|
+
}),
|
|
759
|
+
typeof labelText === "string" ? /* @__PURE__ */ jsx14("label", {
|
|
760
|
+
htmlFor: option,
|
|
761
|
+
className: "ml-2 block text-sm text-gray-900",
|
|
762
|
+
children: labelText
|
|
763
|
+
}) : /* @__PURE__ */ jsx14("label", {
|
|
764
|
+
htmlFor: option,
|
|
765
|
+
children: labelText
|
|
766
|
+
})
|
|
767
|
+
]
|
|
768
|
+
});
|
|
343
769
|
};
|
|
344
770
|
var RadioOption_default = RadioOption;
|
|
345
|
-
|
|
346
771
|
// src/Common/BottomAlert.tsx
|
|
347
772
|
import ReactDOM2 from "react-dom";
|
|
348
|
-
import { jsx as
|
|
349
|
-
var BottomAlert = (
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
"div",
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
773
|
+
import { jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
774
|
+
var BottomAlert = function(param) {
|
|
775
|
+
var isDark = param.isDark, setDontShowAgain = param.setDontShowAgain, dontShowAgain = param.dontShowAgain, title = param.title, borderColor = param.borderColor, onDismissed = param.onDismissed, cancelText = param.cancelText, confirmText = param.confirmText, onConfirm = param.onConfirm, onCancel = param.onCancel, isSingleAction = param.isSingleAction, children = param.children, buttonColor = param.buttonColor;
|
|
776
|
+
var dismiss = function() {
|
|
777
|
+
onDismissed === null || onDismissed === void 0 ? void 0 : onDismissed();
|
|
778
|
+
};
|
|
779
|
+
return /* @__PURE__ */ jsx15("div", {
|
|
780
|
+
className: "top-0 left-0 fixed w-full h-screen flex justify-center",
|
|
781
|
+
style: {
|
|
782
|
+
background: isDark ? "rgba(0, 0, 0, 0.1)" : "rgba(255, 255, 255, 0.1)",
|
|
783
|
+
zIndex: 9999
|
|
784
|
+
},
|
|
785
|
+
children: /* @__PURE__ */ jsx15("div", {
|
|
786
|
+
className: "absolute top-0 w-full h-screen flex justify-center bg-gray-200/90 dark:bg-slate-800/50",
|
|
787
|
+
children: /* @__PURE__ */ jsx15("div", {
|
|
788
|
+
className: "absolute sm:w-1/2 w-full mx-auto shadow-xl rounded-md p-6 flex z-50 flex-col top-24 bg-white dark:bg-slate-900 overflow-clip rounded-bl-lg rounded-br-lg border-b-8 border-b-blue-500",
|
|
789
|
+
children: /* @__PURE__ */ jsxs6("div", {
|
|
790
|
+
style: {
|
|
791
|
+
borderColor: borderColor || "#0ea5e9"
|
|
792
|
+
},
|
|
793
|
+
children: [
|
|
794
|
+
/* @__PURE__ */ jsx15("h3", {
|
|
795
|
+
className: "font-semibold font-header text-gray-700 dark:text-gray-300 text-xl",
|
|
796
|
+
children: title
|
|
797
|
+
}),
|
|
798
|
+
/* @__PURE__ */ jsx15("div", {
|
|
799
|
+
className: "mt-2 text-lg",
|
|
800
|
+
children: children
|
|
801
|
+
}),
|
|
802
|
+
setDontShowAgain ? /* @__PURE__ */ jsxs6("div", {
|
|
803
|
+
className: "flex items-center space-x-1",
|
|
804
|
+
children: [
|
|
805
|
+
/* @__PURE__ */ jsx15("input", {
|
|
806
|
+
onChange: function() {
|
|
807
|
+
setDontShowAgain(function(s) {
|
|
808
|
+
return !s;
|
|
809
|
+
});
|
|
810
|
+
},
|
|
811
|
+
id: "show_again_check",
|
|
812
|
+
checked: !!dontShowAgain,
|
|
813
|
+
type: "checkbox",
|
|
814
|
+
className: "form-checkbox text-blue-600 focus:ring-blue-500 border-gray-300 rounded h-4 w-4"
|
|
815
|
+
}),
|
|
816
|
+
/* @__PURE__ */ jsx15("label", {
|
|
817
|
+
htmlFor: "show_again_check",
|
|
818
|
+
className: "dark:text-gray-200 text-gray-700",
|
|
819
|
+
children: "Don't show again"
|
|
820
|
+
})
|
|
821
|
+
]
|
|
822
|
+
}) : null,
|
|
823
|
+
/* @__PURE__ */ jsx15("div", {
|
|
824
|
+
className: "mt-4 flex items-center justify-end space-x-4 z-10",
|
|
825
|
+
children: isSingleAction ? /* @__PURE__ */ jsx15(Button_default, {
|
|
826
|
+
type: "button",
|
|
827
|
+
kind: buttonColor,
|
|
828
|
+
onClick: function() {
|
|
829
|
+
onConfirm(true);
|
|
830
|
+
dismiss();
|
|
831
|
+
},
|
|
832
|
+
children: confirmText || "Okay"
|
|
833
|
+
}) : /* @__PURE__ */ jsxs6("div", {
|
|
834
|
+
className: "w-1/3 flex justify-end space-x-4",
|
|
835
|
+
children: [
|
|
836
|
+
/* @__PURE__ */ jsx15("div", {
|
|
837
|
+
className: "w-full flex flex-col",
|
|
838
|
+
children: /* @__PURE__ */ jsx15(Button_default, {
|
|
839
|
+
type: "button",
|
|
840
|
+
kind: "secondary",
|
|
841
|
+
onClick: function() {
|
|
842
|
+
onCancel === null || onCancel === void 0 ? void 0 : onCancel();
|
|
843
|
+
dismiss();
|
|
844
|
+
},
|
|
845
|
+
children: cancelText || "Cancel"
|
|
846
|
+
})
|
|
847
|
+
}),
|
|
848
|
+
/* @__PURE__ */ jsx15("div", {
|
|
849
|
+
className: "w-full flex flex-col",
|
|
850
|
+
children: /* @__PURE__ */ jsx15(Button_default, {
|
|
851
|
+
type: "button",
|
|
852
|
+
kind: buttonColor,
|
|
853
|
+
onClick: function() {
|
|
854
|
+
onConfirm(true);
|
|
855
|
+
dismiss();
|
|
856
|
+
},
|
|
857
|
+
children: confirmText || "Confirm"
|
|
858
|
+
})
|
|
859
|
+
})
|
|
860
|
+
]
|
|
861
|
+
})
|
|
862
|
+
})
|
|
863
|
+
]
|
|
864
|
+
})
|
|
865
|
+
})
|
|
866
|
+
})
|
|
867
|
+
});
|
|
419
868
|
};
|
|
420
|
-
var BAWrapper = (props)
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
/* @__PURE__ */ jsx7(BottomAlert, __spreadValues({}, props)),
|
|
424
|
-
document.body
|
|
425
|
-
);
|
|
869
|
+
var BAWrapper = function(props) {
|
|
870
|
+
if (!props.isVisible) return null;
|
|
871
|
+
return ReactDOM2.createPortal(/* @__PURE__ */ jsx15(BottomAlert, _object_spread({}, props)), document.body);
|
|
426
872
|
};
|
|
427
873
|
var BottomAlert_default = BAWrapper;
|
|
428
|
-
|
|
429
874
|
// src/Common/Tippy.tsx
|
|
430
875
|
import { useState as useState2, useRef, useEffect as useEffect2 } from "react";
|
|
431
|
-
import {
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
arrow,
|
|
441
|
-
FloatingArrow,
|
|
442
|
-
FloatingPortal
|
|
443
|
-
} from "@floating-ui/react";
|
|
444
|
-
import { Fragment, jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
445
|
-
var Tippy = ({ children, content, placement = "top", className = "", wrapperClassname = "", disabled = false, arrow: useArrow = false, visible }) => {
|
|
446
|
-
const [isOpen, setIsOpen] = useState2(false);
|
|
447
|
-
const arrowRef = useRef(null);
|
|
448
|
-
useEffect2(() => {
|
|
449
|
-
if (visible) {
|
|
450
|
-
setIsOpen(true);
|
|
451
|
-
}
|
|
452
|
-
}, [visible]);
|
|
453
|
-
const {
|
|
454
|
-
x,
|
|
455
|
-
y,
|
|
456
|
-
strategy,
|
|
457
|
-
refs,
|
|
458
|
-
context
|
|
459
|
-
} = useFloating({
|
|
460
|
-
placement,
|
|
461
|
-
open: isOpen,
|
|
462
|
-
onOpenChange: setIsOpen,
|
|
463
|
-
middleware: [
|
|
464
|
-
offset(8),
|
|
465
|
-
flip(),
|
|
466
|
-
shift(),
|
|
467
|
-
arrow({ element: arrowRef })
|
|
468
|
-
]
|
|
469
|
-
});
|
|
470
|
-
const hover = useHover(context, {
|
|
471
|
-
enabled: !disabled
|
|
472
|
-
});
|
|
473
|
-
const dismiss = useDismiss(context);
|
|
474
|
-
const role = useRole(context);
|
|
475
|
-
const { getReferenceProps, getFloatingProps } = useInteractions([
|
|
476
|
-
hover,
|
|
477
|
-
dismiss,
|
|
478
|
-
role
|
|
479
|
-
]);
|
|
480
|
-
return /* @__PURE__ */ jsxs4(Fragment, { children: [
|
|
481
|
-
isOpen && /* @__PURE__ */ jsxs4(FloatingPortal, { children: [
|
|
482
|
-
/* @__PURE__ */ jsx8(
|
|
483
|
-
"div",
|
|
484
|
-
__spreadProps(__spreadValues({
|
|
485
|
-
ref: refs.setFloating,
|
|
486
|
-
className: `z-[9999] ${className || tippyClassname}`
|
|
487
|
-
}, getFloatingProps()), {
|
|
488
|
-
style: {
|
|
489
|
-
position: strategy,
|
|
490
|
-
top: y != null ? y : 0,
|
|
491
|
-
left: x != null ? x : 0,
|
|
492
|
-
width: "max-content"
|
|
493
|
-
},
|
|
494
|
-
children: content
|
|
495
|
-
})
|
|
496
|
-
),
|
|
497
|
-
useArrow && /* @__PURE__ */ jsx8(
|
|
498
|
-
FloatingArrow,
|
|
499
|
-
{
|
|
500
|
-
ref: arrowRef,
|
|
501
|
-
context,
|
|
502
|
-
className: "fill-gray-900",
|
|
503
|
-
tipRadius: 2
|
|
876
|
+
import { useFloating, useInteractions, useHover, useRole, useDismiss, offset, flip, shift, arrow, FloatingArrow, FloatingPortal } from "@floating-ui/react";
|
|
877
|
+
import { Fragment, jsx as jsx16, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
878
|
+
var Tippy = function(param) {
|
|
879
|
+
var children = param.children, content = param.content, _param_placement = param.placement, placement = _param_placement === void 0 ? "top" : _param_placement, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_wrapperClassname = param.wrapperClassname, wrapperClassname = _param_wrapperClassname === void 0 ? "" : _param_wrapperClassname, _param_disabled = param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, tmp = param.arrow, useArrow = tmp === void 0 ? false : tmp, visible = param.visible;
|
|
880
|
+
var _useState2 = _sliced_to_array(useState2(false), 2), isOpen = _useState2[0], setIsOpen = _useState2[1];
|
|
881
|
+
var arrowRef = useRef(null);
|
|
882
|
+
useEffect2(function() {
|
|
883
|
+
if (visible) {
|
|
884
|
+
setIsOpen(true);
|
|
504
885
|
}
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
886
|
+
}, [
|
|
887
|
+
visible
|
|
888
|
+
]);
|
|
889
|
+
var _useFloating = useFloating({
|
|
890
|
+
placement: placement,
|
|
891
|
+
open: isOpen,
|
|
892
|
+
onOpenChange: setIsOpen,
|
|
893
|
+
middleware: [
|
|
894
|
+
offset(8),
|
|
895
|
+
flip(),
|
|
896
|
+
shift(),
|
|
897
|
+
arrow({
|
|
898
|
+
element: arrowRef
|
|
899
|
+
})
|
|
900
|
+
]
|
|
901
|
+
}), x = _useFloating.x, y = _useFloating.y, strategy = _useFloating.strategy, refs = _useFloating.refs, context = _useFloating.context;
|
|
902
|
+
var hover = useHover(context, {
|
|
903
|
+
enabled: !disabled
|
|
904
|
+
});
|
|
905
|
+
var dismiss = useDismiss(context);
|
|
906
|
+
var role = useRole(context);
|
|
907
|
+
var _useInteractions = useInteractions([
|
|
908
|
+
hover,
|
|
909
|
+
dismiss,
|
|
910
|
+
role
|
|
911
|
+
]), getReferenceProps = _useInteractions.getReferenceProps, getFloatingProps = _useInteractions.getFloatingProps;
|
|
912
|
+
return /* @__PURE__ */ jsxs7(Fragment, {
|
|
913
|
+
children: [
|
|
914
|
+
isOpen && /* @__PURE__ */ jsxs7(FloatingPortal, {
|
|
915
|
+
children: [
|
|
916
|
+
/* @__PURE__ */ jsx16("div", _object_spread_props(_object_spread({
|
|
917
|
+
ref: refs.setFloating,
|
|
918
|
+
className: "z-[9999] ".concat(className || tippyClassname)
|
|
919
|
+
}, getFloatingProps()), {
|
|
920
|
+
style: {
|
|
921
|
+
position: strategy,
|
|
922
|
+
top: y !== null && y !== void 0 ? y : 0,
|
|
923
|
+
left: x !== null && x !== void 0 ? x : 0,
|
|
924
|
+
width: "max-content"
|
|
925
|
+
},
|
|
926
|
+
children: content
|
|
927
|
+
})),
|
|
928
|
+
useArrow && /* @__PURE__ */ jsx16(FloatingArrow, {
|
|
929
|
+
ref: arrowRef,
|
|
930
|
+
context: context,
|
|
931
|
+
className: "fill-gray-900",
|
|
932
|
+
tipRadius: 2
|
|
933
|
+
})
|
|
934
|
+
]
|
|
935
|
+
}),
|
|
936
|
+
/* @__PURE__ */ jsx16("div", _object_spread_props(_object_spread({
|
|
937
|
+
ref: refs.setReference
|
|
938
|
+
}, getReferenceProps()), {
|
|
939
|
+
className: wrapperClassname,
|
|
940
|
+
children: children
|
|
941
|
+
}))
|
|
942
|
+
]
|
|
943
|
+
});
|
|
509
944
|
};
|
|
510
945
|
var Tippy_default = Tippy;
|
|
511
|
-
|
|
512
946
|
// src/Common/IconInfo.tsx
|
|
513
|
-
import { jsx as
|
|
514
|
-
var IconInfo = (
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
947
|
+
import { jsx as jsx17, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
948
|
+
var IconInfo = function(param) {
|
|
949
|
+
var content = param.content, icon = param.icon, number = param.number, color = param.color;
|
|
950
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
951
|
+
className: "flex flex-shrink-0 items-center justify-center w-8 h-8 rounded-full bg-slate-400 dark:bg-slate-600 dark:border dark:border-white",
|
|
952
|
+
children: /* @__PURE__ */ jsx17(Tippy_default, {
|
|
953
|
+
className: tippyClassname,
|
|
954
|
+
content: content,
|
|
955
|
+
children: /* @__PURE__ */ jsxs8("div", {
|
|
956
|
+
className: "relative",
|
|
957
|
+
children: [
|
|
958
|
+
icon,
|
|
959
|
+
/* @__PURE__ */ jsx17("p", {
|
|
960
|
+
className: "absolute -bottom-1 ".concat(number > 9 ? number > 99 ? number > 999 ? "w-8 h-8 -right-6 -bottom-3" : "w-6 h-6 -right-5 -bottom-2" : "w-5 h-5 -right-3" : "w-4 -right-3", " flex justify-center items-center text-xs font-sans rounded-full text-white ").concat(color || "bg-secondary"),
|
|
961
|
+
children: number
|
|
962
|
+
})
|
|
963
|
+
]
|
|
964
|
+
})
|
|
965
|
+
})
|
|
966
|
+
});
|
|
526
967
|
};
|
|
527
968
|
var IconInfo_default = IconInfo;
|
|
528
|
-
|
|
529
969
|
// src/Common/Modal.tsx
|
|
530
970
|
import Link from "next/link";
|
|
531
|
-
|
|
532
971
|
// src/Icons/XIcon.tsx
|
|
533
|
-
import { jsx as
|
|
534
|
-
var XIcon = (
|
|
535
|
-
|
|
972
|
+
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
973
|
+
var XIcon = function(param) {
|
|
974
|
+
var className = param.className;
|
|
975
|
+
return /* @__PURE__ */ jsx18("svg", {
|
|
976
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
977
|
+
className: className || "h-5 w-5",
|
|
978
|
+
viewBox: "0 0 20 20",
|
|
979
|
+
fill: "currentColor",
|
|
980
|
+
children: /* @__PURE__ */ jsx18("path", {
|
|
981
|
+
fillRule: "evenodd",
|
|
982
|
+
d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
|
|
983
|
+
clipRule: "evenodd"
|
|
984
|
+
})
|
|
985
|
+
});
|
|
536
986
|
};
|
|
537
987
|
var XIcon_default = XIcon;
|
|
538
|
-
|
|
539
988
|
// src/Common/Modal.tsx
|
|
540
|
-
import { Fragment as Fragment2, jsx as
|
|
541
|
-
var Modal = (
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
989
|
+
import { Fragment as Fragment2, jsx as jsx19, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
990
|
+
var Modal = function(_param) {
|
|
991
|
+
var visible = _param.visible, children = _param.children, fullscreen = _param.fullscreen, displayDark = _param.displayDark, dismissLink = _param.dismissLink, bgOpacity = _param.bgOpacity, onDismissed = _param.onDismissed, _param_dismissable = _param.dismissable, dismissable = _param_dismissable === void 0 ? true : _param_dismissable, _param_dismissOnBackdropClick = _param.dismissOnBackdropClick, dismissOnBackdropClick = _param_dismissOnBackdropClick === void 0 ? true : _param_dismissOnBackdropClick, style = _param.style, props = _object_without_properties(_param, [
|
|
992
|
+
"visible",
|
|
993
|
+
"children",
|
|
994
|
+
"fullscreen",
|
|
995
|
+
"displayDark",
|
|
996
|
+
"dismissLink",
|
|
997
|
+
"bgOpacity",
|
|
998
|
+
"onDismissed",
|
|
999
|
+
"dismissable",
|
|
1000
|
+
"dismissOnBackdropClick",
|
|
1001
|
+
"style"
|
|
1002
|
+
]);
|
|
1003
|
+
if (!visible) return null;
|
|
1004
|
+
return /* @__PURE__ */ jsx19(Overlay_default, _object_spread_props(_object_spread({
|
|
1005
|
+
visible: visible,
|
|
1006
|
+
onClick: dismissOnBackdropClick ? onDismissed : void 0,
|
|
1007
|
+
isDark: displayDark,
|
|
1008
|
+
withContainer: true
|
|
1009
|
+
}, props), {
|
|
1010
|
+
children: /* @__PURE__ */ jsx19("div", {
|
|
1011
|
+
className: "".concat(displayDark && "dark", " bg-slate-900/20 fixed inset-0 flex items-center justify-center"),
|
|
1012
|
+
style: {
|
|
1013
|
+
zIndex: 1e4
|
|
1014
|
+
},
|
|
1015
|
+
children: /* @__PURE__ */ jsxs9("div", {
|
|
1016
|
+
className: [
|
|
1017
|
+
"relative mx-1 w-full md:mx-auto md:w-3/4 lg:w-1/2",
|
|
1018
|
+
fullscreen && "md:w-5/6 lg:w-5/6"
|
|
1019
|
+
].join(" "),
|
|
1020
|
+
children: [
|
|
1021
|
+
/* @__PURE__ */ jsx19(Fragment2, {
|
|
1022
|
+
children: dismissLink ? /* @__PURE__ */ jsx19(Link, {
|
|
1023
|
+
href: dismissLink,
|
|
1024
|
+
scroll: false,
|
|
1025
|
+
children: /* @__PURE__ */ jsx19("div", {
|
|
1026
|
+
onClick: onDismissed,
|
|
1027
|
+
children: /* @__PURE__ */ jsx19(XIcon_default, {
|
|
1028
|
+
className: "absolute h-5 w-5 top-5 sm:top-20 right-4 transition-colors cursor-pointer duration-75 hover:text-blue-500 dark:text-gray-200 dark:hover:text-blue-500"
|
|
1029
|
+
})
|
|
1030
|
+
})
|
|
1031
|
+
}) : dismissable ? /* @__PURE__ */ jsx19("button", {
|
|
1032
|
+
className: "absolute top-5 sm:top-20 right-4 transition-colors cursor-pointer duration-75 hover:text-blue-500 dark:text-gray-200 dark:hover:text-blue-500",
|
|
1033
|
+
type: "button",
|
|
1034
|
+
onClick: onDismissed,
|
|
1035
|
+
children: /* @__PURE__ */ jsx19(XIcon_default, {
|
|
1036
|
+
className: "h-5 w-5"
|
|
1037
|
+
})
|
|
1038
|
+
}) : null
|
|
1039
|
+
}),
|
|
1040
|
+
/* @__PURE__ */ jsx19("div", {
|
|
1041
|
+
className: "my-1 sm:mt-16 bg-white dark:bg-slate-900 shadow-lg border border-gray-100 dark:border-none rounded-xl overflow-x-visible overflow-y-visible no-scrollbar",
|
|
1042
|
+
onClick: function(e) {
|
|
1043
|
+
return e.stopPropagation();
|
|
1044
|
+
},
|
|
1045
|
+
style: _object_spread({
|
|
1046
|
+
maxHeight: "calc(100vh - 6rem)"
|
|
1047
|
+
}, style),
|
|
1048
|
+
children: /* @__PURE__ */ jsx19("div", {
|
|
1049
|
+
className: "p-4 sm:p-10",
|
|
1050
|
+
children: /* @__PURE__ */ jsx19("div", {
|
|
1051
|
+
className: "mt-8 sm:mt-0",
|
|
1052
|
+
children: children
|
|
1053
|
+
})
|
|
1054
|
+
})
|
|
1055
|
+
})
|
|
1056
|
+
]
|
|
1057
|
+
})
|
|
1058
|
+
})
|
|
1059
|
+
}));
|
|
583
1060
|
};
|
|
584
1061
|
var Modal_default = Modal;
|
|
585
|
-
|
|
586
1062
|
// src/Common/NoticeBox.tsx
|
|
587
1063
|
import { useEffect as useEffect3, useMemo as useMemo4, useState as useState3 } from "react";
|
|
588
|
-
import { jsx as
|
|
589
|
-
var NoticeBox = (
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
1064
|
+
import { jsx as jsx20, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1065
|
+
var NoticeBox = function(param) {
|
|
1066
|
+
var children = param.children, type = param.type, isDismissible = param.isDismissible, isVisible = param.isVisible, onDismiss = param.onDismiss;
|
|
1067
|
+
var _useState3 = _sliced_to_array(useState3(true), 2), visible = _useState3[0], setVisible = _useState3[1];
|
|
1068
|
+
var styles = useMemo4(function() {
|
|
1069
|
+
var base = "relative text-base rounded-md p-2 ";
|
|
1070
|
+
if (!visible) return "hidden";
|
|
1071
|
+
switch(type){
|
|
1072
|
+
case "error":
|
|
1073
|
+
return base.concat("w-full absolute top-50 text-red-500 border-red-400 border-2");
|
|
1074
|
+
case "info":
|
|
1075
|
+
return base.concat("text-green-800 border-green-400 bg-green-100");
|
|
1076
|
+
case "warning":
|
|
1077
|
+
return base.concat("text-orange-500 border border-orange-400 bg-white");
|
|
1078
|
+
default:
|
|
1079
|
+
return base.concat("w-full absolute top-0 text-red-500 border-red-500 bg-white p-3 border-2");
|
|
1080
|
+
}
|
|
1081
|
+
}, [
|
|
1082
|
+
type,
|
|
1083
|
+
visible
|
|
1084
|
+
]);
|
|
1085
|
+
useEffect3(function() {
|
|
1086
|
+
setVisible(isVisible);
|
|
1087
|
+
}, [
|
|
1088
|
+
isVisible
|
|
1089
|
+
]);
|
|
1090
|
+
if (!isVisible) return null;
|
|
1091
|
+
return /* @__PURE__ */ jsx20("div", {
|
|
1092
|
+
style: {
|
|
1093
|
+
zIndex: 100
|
|
1094
|
+
},
|
|
1095
|
+
className: styles,
|
|
1096
|
+
children: /* @__PURE__ */ jsxs10("div", {
|
|
1097
|
+
className: "relative",
|
|
1098
|
+
children: [
|
|
1099
|
+
isDismissible && /* @__PURE__ */ jsx20("button", {
|
|
1100
|
+
type: "button",
|
|
1101
|
+
onClick: function() {
|
|
1102
|
+
setVisible(function(s) {
|
|
1103
|
+
return !s;
|
|
1104
|
+
});
|
|
1105
|
+
onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss();
|
|
1106
|
+
},
|
|
1107
|
+
className: "absolute bottom-1 right-1 transition-colors cursor-pointer duration-75 hover:text-blue-500",
|
|
1108
|
+
children: /* @__PURE__ */ jsx20(XIcon_default, {
|
|
1109
|
+
className: "h-5 w-5"
|
|
1110
|
+
})
|
|
1111
|
+
}),
|
|
1112
|
+
children
|
|
1113
|
+
]
|
|
1114
|
+
})
|
|
1115
|
+
});
|
|
633
1116
|
};
|
|
634
1117
|
var NoticeBox_default = NoticeBox;
|
|
635
|
-
|
|
636
1118
|
// src/Icons/StarIcon.tsx
|
|
637
|
-
import { jsx as
|
|
638
|
-
var StarIcon = (
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
1119
|
+
import { jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1120
|
+
var StarIcon = function(param) {
|
|
1121
|
+
var className = param.className, percentage = param.percentage, color = param.color;
|
|
1122
|
+
return /* @__PURE__ */ jsxs11("svg", {
|
|
1123
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1124
|
+
className: className || "h-5 w-5",
|
|
1125
|
+
viewBox: "0 0 20 20",
|
|
1126
|
+
fill: "currentColor",
|
|
1127
|
+
children: [
|
|
1128
|
+
/* @__PURE__ */ jsx21("defs", {
|
|
1129
|
+
children: /* @__PURE__ */ jsxs11("linearGradient", {
|
|
1130
|
+
id: "grad",
|
|
1131
|
+
children: [
|
|
1132
|
+
/* @__PURE__ */ jsx21("stop", {
|
|
1133
|
+
offset: "".concat((percentage || 0.5) * 100, "%"),
|
|
1134
|
+
"stop-color": color ? color : "#4b5563"
|
|
1135
|
+
}),
|
|
1136
|
+
/* @__PURE__ */ jsx21("stop", {
|
|
1137
|
+
offset: "".concat(100 - (percentage || 0.5) * 100, "%"),
|
|
1138
|
+
"stop-color": "white"
|
|
1139
|
+
})
|
|
1140
|
+
]
|
|
1141
|
+
})
|
|
1142
|
+
}),
|
|
1143
|
+
/* @__PURE__ */ jsx21("path", {
|
|
1144
|
+
fill: "url(#grad)",
|
|
1145
|
+
d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"
|
|
1146
|
+
})
|
|
1147
|
+
]
|
|
1148
|
+
});
|
|
646
1149
|
};
|
|
647
1150
|
var StarIcon_default = StarIcon;
|
|
648
|
-
|
|
649
1151
|
// src/Icons/StarIconSolid.tsx
|
|
650
|
-
import { jsx as
|
|
651
|
-
var StartIconSolid = (
|
|
652
|
-
|
|
1152
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
1153
|
+
var StartIconSolid = function(param) {
|
|
1154
|
+
var className = param.className;
|
|
1155
|
+
return /* @__PURE__ */ jsx22("svg", {
|
|
1156
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1157
|
+
className: className || "h-5 w-5",
|
|
1158
|
+
viewBox: "0 0 20 20",
|
|
1159
|
+
fill: "currentColor",
|
|
1160
|
+
children: /* @__PURE__ */ jsx22("path", {
|
|
1161
|
+
d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"
|
|
1162
|
+
})
|
|
1163
|
+
});
|
|
653
1164
|
};
|
|
654
1165
|
var StarIconSolid_default = StartIconSolid;
|
|
655
|
-
|
|
656
1166
|
// src/Common/RatingStars.tsx
|
|
657
|
-
import { jsx as
|
|
658
|
-
var RatingStars = (
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
1167
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
1168
|
+
var RatingStars = function(param) {
|
|
1169
|
+
var avgRating = param.avgRating, large = param.large;
|
|
1170
|
+
var icons = [
|
|
1171
|
+
1,
|
|
1172
|
+
2,
|
|
1173
|
+
3,
|
|
1174
|
+
4,
|
|
1175
|
+
5
|
|
1176
|
+
].map(function(el) {
|
|
1177
|
+
if (avgRating === 0) {
|
|
1178
|
+
return /* @__PURE__ */ jsx23(StarIconSolid_default, {
|
|
1179
|
+
className: "".concat(large ? "h-5 w-5" : "h-3 w-3", " text-gray-200 dark:text-gray-400")
|
|
1180
|
+
}, "rating_star_".concat(el));
|
|
1181
|
+
}
|
|
1182
|
+
if (Number.isInteger(avgRating)) {
|
|
1183
|
+
if (el <= avgRating) {
|
|
1184
|
+
return /* @__PURE__ */ jsx23(StarIconSolid_default, {
|
|
1185
|
+
className: "".concat(large ? "h-5 w-5" : "h-3 w-3", " text-blue-500")
|
|
1186
|
+
}, "rating_star_".concat(el));
|
|
1187
|
+
}
|
|
1188
|
+
return /* @__PURE__ */ jsx23(StarIconSolid_default, {
|
|
1189
|
+
className: "".concat(large ? "h-5 w-5" : "h-3 w-3", " text-gray-200 dark:text-gray-400")
|
|
1190
|
+
}, "rating_star_".concat(el));
|
|
1191
|
+
}
|
|
1192
|
+
var whole = Math.floor(avgRating);
|
|
1193
|
+
if (el <= whole) {
|
|
1194
|
+
return /* @__PURE__ */ jsx23(StarIconSolid_default, {
|
|
1195
|
+
className: "".concat(large ? "h-5 w-5" : "h-3 w-3", " text-blue-500")
|
|
1196
|
+
}, "rating_star_".concat(el));
|
|
1197
|
+
}
|
|
1198
|
+
return /* @__PURE__ */ jsx23(StarIcon_default, {
|
|
1199
|
+
percentage: avgRating - whole,
|
|
1200
|
+
color: "#00b4d8",
|
|
1201
|
+
className: "".concat(large ? "h-5 w-5" : "h-3 w-3")
|
|
1202
|
+
}, "rating_star_".concat(el));
|
|
1203
|
+
});
|
|
1204
|
+
return /* @__PURE__ */ jsx23(Tippy_default, {
|
|
1205
|
+
content: avgRating === 0 ? "No ratings" : "Average Rating " + avgRating,
|
|
1206
|
+
className: "bg-gray-800 opacity-90 text-white rounded-md px-2 py-1 cursor-pointer h-fit",
|
|
1207
|
+
children: /* @__PURE__ */ jsx23("div", {
|
|
1208
|
+
className: "flex items-center space-x-0 justify-start",
|
|
1209
|
+
children: icons
|
|
1210
|
+
})
|
|
1211
|
+
});
|
|
683
1212
|
};
|
|
684
1213
|
var RatingStars_default = RatingStars;
|
|
685
|
-
|
|
686
1214
|
// src/Common/Slider.tsx
|
|
687
1215
|
import { useState as useState4 } from "react";
|
|
688
1216
|
import { useDebouncedCallback } from "use-debounce";
|
|
689
|
-
import { jsx as
|
|
690
|
-
var Slider = (
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
"input",
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
}
|
|
705
|
-
);
|
|
1217
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
1218
|
+
var Slider = function(param) {
|
|
1219
|
+
var min = param.min, max = param.max, step = param.step, value = param.value, onChange = param.onChange;
|
|
1220
|
+
var handleChange = function(event) {
|
|
1221
|
+
onChange(parseFloat(event.target.value));
|
|
1222
|
+
};
|
|
1223
|
+
return /* @__PURE__ */ jsx24("input", {
|
|
1224
|
+
type: "range",
|
|
1225
|
+
min: min,
|
|
1226
|
+
max: max,
|
|
1227
|
+
step: step,
|
|
1228
|
+
value: value,
|
|
1229
|
+
onChange: handleChange,
|
|
1230
|
+
className: "w-full h-2 rounded-lg range-input"
|
|
1231
|
+
});
|
|
706
1232
|
};
|
|
707
|
-
var DebouncedSlider = (
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
1233
|
+
var DebouncedSlider = function(param) {
|
|
1234
|
+
var min = param.min, max = param.max, handleUpdate = param.handleUpdate, initialValue = param.initialValue;
|
|
1235
|
+
var _useState4 = _sliced_to_array(useState4(initialValue), 2), value = _useState4[0], setValue = _useState4[1];
|
|
1236
|
+
var debouncedUpdate = useDebouncedCallback(function(v) {
|
|
1237
|
+
handleUpdate(v);
|
|
1238
|
+
}, 120, {
|
|
1239
|
+
trailing: true,
|
|
1240
|
+
leading: false
|
|
1241
|
+
});
|
|
1242
|
+
return /* @__PURE__ */ jsx24(Slider, {
|
|
1243
|
+
min: min,
|
|
1244
|
+
max: max,
|
|
1245
|
+
step: 1,
|
|
1246
|
+
value: value,
|
|
1247
|
+
onChange: function(v) {
|
|
1248
|
+
setValue(v);
|
|
1249
|
+
debouncedUpdate(v);
|
|
1250
|
+
}
|
|
1251
|
+
});
|
|
725
1252
|
};
|
|
726
1253
|
Slider.Debounced = DebouncedSlider;
|
|
727
1254
|
var Slider_default = Slider;
|
|
728
|
-
|
|
729
1255
|
// src/Common/ToggleSwitch.tsx
|
|
730
1256
|
import { useField as useField3 } from "formik";
|
|
731
1257
|
import { motion as motion3 } from "framer-motion";
|
|
732
|
-
import { jsx as
|
|
733
|
-
var Formik = (
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
/* @__PURE__ */
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
1258
|
+
import { jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1259
|
+
var Formik = function(param) {
|
|
1260
|
+
var label = param.label, name = param.name;
|
|
1261
|
+
var _useField3 = _sliced_to_array(useField3(name), 3), value = _useField3[0].value, setValue = _useField3[2].setValue;
|
|
1262
|
+
var handleChange = function(e) {
|
|
1263
|
+
setValue(e.target.checked);
|
|
1264
|
+
};
|
|
1265
|
+
return /* @__PURE__ */ jsxs12("label", {
|
|
1266
|
+
className: "flex items-center space-x-2 cursor-pointer",
|
|
1267
|
+
children: [
|
|
1268
|
+
/* @__PURE__ */ jsxs12("div", {
|
|
1269
|
+
className: "relative",
|
|
1270
|
+
children: [
|
|
1271
|
+
/* @__PURE__ */ jsx25("input", {
|
|
1272
|
+
type: "checkbox",
|
|
1273
|
+
className: "opacity-0 absolute",
|
|
1274
|
+
checked: value,
|
|
1275
|
+
onChange: handleChange
|
|
1276
|
+
}),
|
|
1277
|
+
/* @__PURE__ */ jsx25("div", {
|
|
1278
|
+
className: "w-10 h-6 rounded-full p-[4px] transition-colors duration-300 ".concat(value ? "bg-[#00b4d8]" : "bg-[#64748b]"),
|
|
1279
|
+
children: /* @__PURE__ */ jsx25(motion3.div, {
|
|
1280
|
+
className: "w-4 h-4 bg-white rounded-full absolute top-1",
|
|
1281
|
+
initial: false,
|
|
1282
|
+
animate: {
|
|
1283
|
+
x: value ? 16 : 0
|
|
1284
|
+
},
|
|
1285
|
+
transition: {
|
|
1286
|
+
type: "spring",
|
|
1287
|
+
stiffness: 500,
|
|
1288
|
+
damping: 30
|
|
1289
|
+
}
|
|
1290
|
+
})
|
|
1291
|
+
})
|
|
1292
|
+
]
|
|
1293
|
+
}),
|
|
1294
|
+
/* @__PURE__ */ jsx25("span", {
|
|
1295
|
+
className: "text-sm font-medium text-gray-800 dark:text-gray-200",
|
|
1296
|
+
children: label
|
|
1297
|
+
})
|
|
1298
|
+
]
|
|
1299
|
+
});
|
|
763
1300
|
};
|
|
764
|
-
var ToggleSwitch = (
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
/* @__PURE__ */
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
1301
|
+
var ToggleSwitch = function(param) {
|
|
1302
|
+
var label = param.label, onChange = param.onChange, value = param.value;
|
|
1303
|
+
var handleChange = function(e) {
|
|
1304
|
+
onChange(e.target.checked);
|
|
1305
|
+
};
|
|
1306
|
+
return /* @__PURE__ */ jsxs12("label", {
|
|
1307
|
+
className: "flex items-center space-x-2 cursor-pointer",
|
|
1308
|
+
children: [
|
|
1309
|
+
/* @__PURE__ */ jsxs12("div", {
|
|
1310
|
+
className: "relative",
|
|
1311
|
+
children: [
|
|
1312
|
+
/* @__PURE__ */ jsx25("input", {
|
|
1313
|
+
type: "checkbox",
|
|
1314
|
+
className: "opacity-0 absolute",
|
|
1315
|
+
checked: value,
|
|
1316
|
+
onChange: handleChange
|
|
1317
|
+
}),
|
|
1318
|
+
/* @__PURE__ */ jsx25("div", {
|
|
1319
|
+
className: "w-10 h-6 rounded-full p-[4px] transition-colors duration-300 ".concat(value ? "bg-[#00b4d8]" : "bg-[#64748b]"),
|
|
1320
|
+
children: /* @__PURE__ */ jsx25(motion3.div, {
|
|
1321
|
+
className: "w-4 h-4 bg-white rounded-full absolute top-1",
|
|
1322
|
+
initial: false,
|
|
1323
|
+
animate: {
|
|
1324
|
+
x: value ? 16 : 0
|
|
1325
|
+
},
|
|
1326
|
+
transition: {
|
|
1327
|
+
type: "spring",
|
|
1328
|
+
stiffness: 500,
|
|
1329
|
+
damping: 30
|
|
1330
|
+
}
|
|
1331
|
+
})
|
|
1332
|
+
})
|
|
1333
|
+
]
|
|
1334
|
+
}),
|
|
1335
|
+
/* @__PURE__ */ jsx25("span", {
|
|
1336
|
+
className: "text-sm font-medium text-gray-800 dark:text-gray-200",
|
|
1337
|
+
children: label
|
|
1338
|
+
})
|
|
1339
|
+
]
|
|
1340
|
+
});
|
|
793
1341
|
};
|
|
794
1342
|
ToggleSwitch.Formik = Formik;
|
|
795
1343
|
var ToggleSwitch_default = ToggleSwitch;
|
|
796
|
-
|
|
797
1344
|
// src/Common/UserContentSwitcher.tsx
|
|
798
1345
|
import { motion as motion4 } from "framer-motion";
|
|
799
|
-
|
|
800
1346
|
// src/Icons/PlusCircleIcon.tsx
|
|
801
|
-
import { jsx as
|
|
802
|
-
var PlusCircleIcon = (
|
|
803
|
-
|
|
1347
|
+
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
1348
|
+
var PlusCircleIcon = function(param) {
|
|
1349
|
+
var className = param.className;
|
|
1350
|
+
return /* @__PURE__ */ jsx26("svg", {
|
|
1351
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1352
|
+
className: className || "h-5 w-5",
|
|
1353
|
+
fill: "none",
|
|
1354
|
+
viewBox: "0 0 24 24",
|
|
1355
|
+
stroke: "currentColor",
|
|
1356
|
+
strokeWidth: 2,
|
|
1357
|
+
children: /* @__PURE__ */ jsx26("path", {
|
|
1358
|
+
strokeLinecap: "round",
|
|
1359
|
+
strokeLinejoin: "round",
|
|
1360
|
+
d: "M12 9v3m0 0v3m0-3h3m-3 0H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
1361
|
+
})
|
|
1362
|
+
});
|
|
804
1363
|
};
|
|
805
1364
|
var PlusCircleIcon_default = PlusCircleIcon;
|
|
806
|
-
|
|
807
1365
|
// src/Icons/ArrowCircleRight.tsx
|
|
808
|
-
import { jsx as
|
|
809
|
-
var StartIconSolid2 = (
|
|
810
|
-
|
|
1366
|
+
import { jsx as jsx27 } from "react/jsx-runtime";
|
|
1367
|
+
var StartIconSolid2 = function(param) {
|
|
1368
|
+
var className = param.className;
|
|
1369
|
+
return /* @__PURE__ */ jsx27("svg", {
|
|
1370
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1371
|
+
className: className || "h-5 w-5",
|
|
1372
|
+
fill: "none",
|
|
1373
|
+
viewBox: "0 0 24 24",
|
|
1374
|
+
stroke: "currentColor",
|
|
1375
|
+
strokeWidth: 2,
|
|
1376
|
+
children: /* @__PURE__ */ jsx27("path", {
|
|
1377
|
+
strokeLinecap: "round",
|
|
1378
|
+
strokeLinejoin: "round",
|
|
1379
|
+
d: "M13 9l3 3m0 0l-3 3m3-3H8m13 0a9 9 0 11-18 0 9 9 0 0118 0z"
|
|
1380
|
+
})
|
|
1381
|
+
});
|
|
811
1382
|
};
|
|
812
1383
|
var ArrowCircleRight_default = StartIconSolid2;
|
|
813
|
-
|
|
814
1384
|
// src/Common/UserContentSwitcher.tsx
|
|
815
|
-
import { jsx as
|
|
816
|
-
var UserContentSwitcher = (
|
|
817
|
-
|
|
818
|
-
/* @__PURE__ */
|
|
819
|
-
|
|
820
|
-
{
|
|
821
|
-
className: "absolute w-1/2 h-11 rounded-md bg-white dark:bg-slate-600",
|
|
822
|
-
animate: {
|
|
823
|
-
x: galleryMode === title1.toLowerCase() ? "1%" : "99%"
|
|
824
|
-
},
|
|
825
|
-
transition: {
|
|
826
|
-
type: "spring",
|
|
827
|
-
damping: 20,
|
|
828
|
-
stiffness: 200
|
|
829
|
-
}
|
|
830
|
-
}
|
|
831
|
-
),
|
|
832
|
-
/* @__PURE__ */ jsxs10(
|
|
833
|
-
"button",
|
|
834
|
-
{
|
|
835
|
-
onClick: () => setGalleryMode(title1.toLowerCase()),
|
|
836
|
-
className: "py-2 flex flex-row w-1/2 justify-center items-center gap-1 z-10",
|
|
837
|
-
children: [
|
|
838
|
-
/* @__PURE__ */ jsx20(
|
|
839
|
-
"span",
|
|
840
|
-
{
|
|
841
|
-
className: `truncate ${galleryMode === title1.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90"}`,
|
|
842
|
-
children: title1.toLocaleUpperCase()
|
|
843
|
-
}
|
|
844
|
-
),
|
|
845
|
-
Icon1 ? /* @__PURE__ */ jsx20(
|
|
846
|
-
Icon1,
|
|
847
|
-
{
|
|
848
|
-
className: `h-5 w-5 ${galleryMode === title1.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90"}`
|
|
849
|
-
}
|
|
850
|
-
) : /* @__PURE__ */ jsx20(
|
|
851
|
-
PlusCircleIcon_default,
|
|
852
|
-
{
|
|
853
|
-
className: `h-5 w-5 ${galleryMode === title1.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90"}`
|
|
854
|
-
}
|
|
855
|
-
)
|
|
856
|
-
]
|
|
857
|
-
}
|
|
858
|
-
),
|
|
859
|
-
/* @__PURE__ */ jsxs10(
|
|
860
|
-
"button",
|
|
861
|
-
{
|
|
862
|
-
onClick: () => setGalleryMode(title2.toLowerCase()),
|
|
863
|
-
className: "py-2 flex flex-row w-1/2 justify-center items-center gap-1 z-10",
|
|
1385
|
+
import { jsx as jsx28, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1386
|
+
var UserContentSwitcher = function(param) {
|
|
1387
|
+
var Icon1 = param.icon1, Icon2 = param.icon2, setGalleryMode = param.setGalleryMode, galleryMode = param.galleryMode, title1 = param.title1, title2 = param.title2;
|
|
1388
|
+
return /* @__PURE__ */ jsxs13("div", {
|
|
1389
|
+
className: "relative flex flex-row items-center my-2 bg-slate-100 dark:bg-slate-900 w-full h-14 rounded-lg",
|
|
864
1390
|
children: [
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
1391
|
+
/* @__PURE__ */ jsx28(motion4.div, {
|
|
1392
|
+
className: "absolute w-1/2 h-11 rounded-md bg-white dark:bg-slate-600",
|
|
1393
|
+
animate: {
|
|
1394
|
+
x: galleryMode === title1.toLowerCase() ? "1%" : "99%"
|
|
1395
|
+
},
|
|
1396
|
+
transition: {
|
|
1397
|
+
type: "spring",
|
|
1398
|
+
damping: 20,
|
|
1399
|
+
stiffness: 200
|
|
1400
|
+
}
|
|
1401
|
+
}),
|
|
1402
|
+
/* @__PURE__ */ jsxs13("button", {
|
|
1403
|
+
onClick: function() {
|
|
1404
|
+
return setGalleryMode(title1.toLowerCase());
|
|
1405
|
+
},
|
|
1406
|
+
className: "py-2 flex flex-row w-1/2 justify-center items-center gap-1 z-10",
|
|
1407
|
+
children: [
|
|
1408
|
+
/* @__PURE__ */ jsx28("span", {
|
|
1409
|
+
className: "truncate ".concat(galleryMode === title1.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90"),
|
|
1410
|
+
children: title1.toLocaleUpperCase()
|
|
1411
|
+
}),
|
|
1412
|
+
Icon1 ? /* @__PURE__ */ jsx28(Icon1, {
|
|
1413
|
+
className: "h-5 w-5 ".concat(galleryMode === title1.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90")
|
|
1414
|
+
}) : /* @__PURE__ */ jsx28(PlusCircleIcon_default, {
|
|
1415
|
+
className: "h-5 w-5 ".concat(galleryMode === title1.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90")
|
|
1416
|
+
})
|
|
1417
|
+
]
|
|
1418
|
+
}),
|
|
1419
|
+
/* @__PURE__ */ jsxs13("button", {
|
|
1420
|
+
onClick: function() {
|
|
1421
|
+
return setGalleryMode(title2.toLowerCase());
|
|
1422
|
+
},
|
|
1423
|
+
className: "py-2 flex flex-row w-1/2 justify-center items-center gap-1 z-10",
|
|
1424
|
+
children: [
|
|
1425
|
+
/* @__PURE__ */ jsx28("span", {
|
|
1426
|
+
className: "truncate ".concat(galleryMode === title2.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90"),
|
|
1427
|
+
children: title2.toLocaleUpperCase()
|
|
1428
|
+
}),
|
|
1429
|
+
Icon2 ? /* @__PURE__ */ jsx28(Icon2, {
|
|
1430
|
+
className: "h-5 w-5 ".concat(galleryMode === title2.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90")
|
|
1431
|
+
}) : /* @__PURE__ */ jsx28(ArrowCircleRight_default, {
|
|
1432
|
+
className: "h-5 w-5 ".concat(galleryMode === title2.toLowerCase() ? "text-primary dark:text-blue-400" : "text-slate-500 dark:text-slate-400 opacity-90")
|
|
1433
|
+
})
|
|
1434
|
+
]
|
|
1435
|
+
})
|
|
883
1436
|
]
|
|
884
|
-
|
|
885
|
-
)
|
|
886
|
-
] });
|
|
1437
|
+
});
|
|
887
1438
|
};
|
|
888
1439
|
var UserContentSwitcher_default = UserContentSwitcher;
|
|
889
|
-
|
|
890
1440
|
// src/ProgressBar/ProgressBarSimple.tsx
|
|
891
|
-
import { jsx as
|
|
892
|
-
var ProgressBarSimple = (
|
|
893
|
-
|
|
894
|
-
"div",
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
}
|
|
913
|
-
|
|
914
|
-
}
|
|
915
|
-
) });
|
|
1441
|
+
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
1442
|
+
var ProgressBarSimple = function(param) {
|
|
1443
|
+
var progress = param.progress, color = param.color, _param_height = param.height, height = _param_height === void 0 ? 10 : _param_height, _param_backgroundColor = param.backgroundColor, backgroundColor = _param_backgroundColor === void 0 ? "#ccc" : _param_backgroundColor;
|
|
1444
|
+
return /* @__PURE__ */ jsx29("div", {
|
|
1445
|
+
className: "w-full",
|
|
1446
|
+
children: /* @__PURE__ */ jsx29("div", {
|
|
1447
|
+
className: "w-full overflow-hidden transition-all duration-150 ease-in-out",
|
|
1448
|
+
style: {
|
|
1449
|
+
backgroundColor: backgroundColor,
|
|
1450
|
+
height: "".concat(height, "px"),
|
|
1451
|
+
borderRadius: "".concat(height / 2, "px")
|
|
1452
|
+
},
|
|
1453
|
+
children: /* @__PURE__ */ jsx29("div", {
|
|
1454
|
+
className: "transition-all duration-150 ease-in-out",
|
|
1455
|
+
style: {
|
|
1456
|
+
width: "".concat(progress, "%"),
|
|
1457
|
+
backgroundColor: color,
|
|
1458
|
+
height: "".concat(height, "px"),
|
|
1459
|
+
borderRadius: "".concat(height / 2, "px")
|
|
1460
|
+
}
|
|
1461
|
+
})
|
|
1462
|
+
})
|
|
1463
|
+
});
|
|
916
1464
|
};
|
|
917
1465
|
var ProgressBarSimple_default = ProgressBarSimple;
|
|
918
|
-
|
|
919
1466
|
// src/ProgressBar/ProgressBar.tsx
|
|
920
|
-
import { jsx as
|
|
921
|
-
var ProgressBar = (
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
1467
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
1468
|
+
var ProgressBar = function(param) {
|
|
1469
|
+
var progress = param.progress;
|
|
1470
|
+
return /* @__PURE__ */ jsx30("div", {
|
|
1471
|
+
children: /* @__PURE__ */ jsx30("div", {
|
|
1472
|
+
className: "-mt-2 mb-6",
|
|
1473
|
+
children: /* @__PURE__ */ jsx30("div", {
|
|
1474
|
+
className: "bg-gray-100 rounded-full h-2",
|
|
1475
|
+
children: /* @__PURE__ */ jsx30("div", {
|
|
1476
|
+
className: "rounded-full h-2 ".concat(progress === 100 ? "bg-green-400" : "bg-gray-100"),
|
|
1477
|
+
style: {
|
|
1478
|
+
width: "".concat(progress, "%"),
|
|
1479
|
+
minWidth: "100%",
|
|
1480
|
+
position: "absolute"
|
|
1481
|
+
}
|
|
1482
|
+
})
|
|
1483
|
+
})
|
|
1484
|
+
})
|
|
1485
|
+
});
|
|
1486
|
+
};
|
|
1487
|
+
var ProgressStepBar = function(param) {
|
|
1488
|
+
var steps = param.steps, stepIndex = param.stepIndex, onStepClick = param.onStepClick, color = param.color;
|
|
1489
|
+
return /* @__PURE__ */ jsx30("div", {
|
|
1490
|
+
className: "flex w-full items-center space-x-0.5 -mt-1 overflow-hidden",
|
|
1491
|
+
children: steps.map(function(el, i) {
|
|
1492
|
+
return /* @__PURE__ */ jsx30("div", {
|
|
1493
|
+
className: "flex-1 relative",
|
|
1494
|
+
children: /* @__PURE__ */ jsx30(Tippy_default, {
|
|
1495
|
+
content: el.label,
|
|
1496
|
+
className: tippyClassname,
|
|
1497
|
+
children: /* @__PURE__ */ jsx30("div", {
|
|
1498
|
+
className: "mb-4",
|
|
1499
|
+
children: /* @__PURE__ */ jsx30("div", {
|
|
1500
|
+
onClick: function() {
|
|
1501
|
+
return onStepClick === null || onStepClick === void 0 ? void 0 : onStepClick(i);
|
|
1502
|
+
},
|
|
1503
|
+
className: "cursor-pointer bg-gray-100 rounded-full h-2 overflow-hidden",
|
|
1504
|
+
children: /* @__PURE__ */ jsx30("div", {
|
|
1505
|
+
className: "cursor-pointer rounded-full h-2 ".concat(stepIndex >= i ? "bg-green-400" : "bg-gray-100"),
|
|
1506
|
+
style: {
|
|
1507
|
+
width: "".concat(stepIndex >= i ? 100 : 0, "%"),
|
|
1508
|
+
transition: "width 0.3s ease"
|
|
1509
|
+
}
|
|
1510
|
+
})
|
|
1511
|
+
})
|
|
1512
|
+
})
|
|
1513
|
+
})
|
|
1514
|
+
}, "index_progress_".concat(el.label));
|
|
1515
|
+
})
|
|
1516
|
+
});
|
|
959
1517
|
};
|
|
960
1518
|
ProgressBar.Step = ProgressStepBar;
|
|
961
1519
|
var ProgressBar_default = ProgressBar;
|
|
962
|
-
|
|
963
1520
|
// src/ProgressBar/CircleProgress.tsx
|
|
964
|
-
import { jsx as
|
|
965
|
-
var CircleProgress = (
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
/* @__PURE__ */
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1521
|
+
import { jsx as jsx31, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1522
|
+
var CircleProgress = function(param) {
|
|
1523
|
+
var twColor = param.twColor, percentage = param.percentage, radius = param.radius, fill = param.fill, strokeWidth = param.strokeWidth;
|
|
1524
|
+
var r = radius;
|
|
1525
|
+
var cx = "50%";
|
|
1526
|
+
var cy = "50%";
|
|
1527
|
+
var w = Math.round(radius / 16);
|
|
1528
|
+
var strokeWidthCalc = strokeWidth ? strokeWidth : w < 8 ? 8 : w;
|
|
1529
|
+
var size = radius * 2 + strokeWidthCalc;
|
|
1530
|
+
return /* @__PURE__ */ jsx31("div", {
|
|
1531
|
+
style: {
|
|
1532
|
+
height: size,
|
|
1533
|
+
width: size
|
|
1534
|
+
},
|
|
1535
|
+
children: /* @__PURE__ */ jsxs14("svg", {
|
|
1536
|
+
viewBox: "0 0 ".concat(size, " ").concat(size),
|
|
1537
|
+
className: "-rotate-90",
|
|
1538
|
+
children: [
|
|
1539
|
+
/* @__PURE__ */ jsx31("circle", {
|
|
1540
|
+
className: "text-white/50 dark:text-slate-200/50",
|
|
1541
|
+
strokeWidth: strokeWidthCalc - 0.5,
|
|
1542
|
+
stroke: "currentColor",
|
|
1543
|
+
fill: fill || "transparent",
|
|
1544
|
+
r: r,
|
|
1545
|
+
cx: cx,
|
|
1546
|
+
cy: cy
|
|
1547
|
+
}),
|
|
1548
|
+
/* @__PURE__ */ jsx31("circle", {
|
|
1549
|
+
strokeDasharray: 2 * Math.PI * r,
|
|
1550
|
+
strokeDashoffset: 2 * Math.PI * r - percentage / 100 * 2 * Math.PI * r,
|
|
1551
|
+
stroke: twColor || "white/50",
|
|
1552
|
+
strokeWidth: strokeWidthCalc,
|
|
1553
|
+
strokeLinecap: "round",
|
|
1554
|
+
fill: "transparent",
|
|
1555
|
+
r: r,
|
|
1556
|
+
cx: cx,
|
|
1557
|
+
cy: cy
|
|
1558
|
+
})
|
|
1559
|
+
]
|
|
1560
|
+
})
|
|
1561
|
+
});
|
|
1000
1562
|
};
|
|
1001
1563
|
var CircleProgress_default = CircleProgress;
|
|
1002
|
-
|
|
1003
1564
|
// src/ProgressBar/CourseProgress.tsx
|
|
1004
|
-
import { jsx as
|
|
1565
|
+
import { jsx as jsx32, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1005
1566
|
var PRIMARY_COLOR2 = "#00b4d8";
|
|
1006
|
-
var CourseProgress = (
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
/* @__PURE__ */
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1567
|
+
var CourseProgress = function(param) {
|
|
1568
|
+
var twColor = param.twColor, percentage = param.percentage, label = param.label;
|
|
1569
|
+
var cx = "50%";
|
|
1570
|
+
var cy = "50%";
|
|
1571
|
+
var r = 50;
|
|
1572
|
+
var strokeWidth = 10;
|
|
1573
|
+
var fullLength = 2 * Math.PI * r;
|
|
1574
|
+
var length = fullLength * (percentage < 1 ? 1 - percentage : 0.01);
|
|
1575
|
+
var strokeDashoffset = 2 * Math.PI * r - percentage / 100 * 2 * Math.PI * r;
|
|
1576
|
+
return /* @__PURE__ */ jsxs15("div", {
|
|
1577
|
+
className: "flex items-center flex-col justify-center space-y-0 dark:bg-inherit dark:text-gray-300",
|
|
1578
|
+
children: [
|
|
1579
|
+
/* @__PURE__ */ jsxs15("div", {
|
|
1580
|
+
className: "relative flex items-center justify-center -my-2 -mt-1 overflow-hidden rounded-full",
|
|
1581
|
+
children: [
|
|
1582
|
+
/* @__PURE__ */ jsxs15("svg", {
|
|
1583
|
+
className: "-rotate-90",
|
|
1584
|
+
children: [
|
|
1585
|
+
/* @__PURE__ */ jsx32("circle", {
|
|
1586
|
+
className: "text-gray-300",
|
|
1587
|
+
strokeWidth: strokeWidth,
|
|
1588
|
+
stroke: "currentColor",
|
|
1589
|
+
fill: "transparent",
|
|
1590
|
+
r: r,
|
|
1591
|
+
cx: cx,
|
|
1592
|
+
cy: cy
|
|
1593
|
+
}),
|
|
1594
|
+
/* @__PURE__ */ jsx32("circle", {
|
|
1595
|
+
style: {
|
|
1596
|
+
strokeDashoffset: strokeDashoffset
|
|
1597
|
+
},
|
|
1598
|
+
color: twColor || PRIMARY_COLOR2,
|
|
1599
|
+
ref: function(ref) {
|
|
1600
|
+
if (ref) {}
|
|
1601
|
+
},
|
|
1602
|
+
strokeWidth: strokeWidth,
|
|
1603
|
+
strokeLinecap: "round",
|
|
1604
|
+
stroke: "currentColor",
|
|
1605
|
+
fill: "transparent",
|
|
1606
|
+
r: r,
|
|
1607
|
+
cx: cx,
|
|
1608
|
+
cy: cy,
|
|
1609
|
+
strokeDasharray: fullLength,
|
|
1610
|
+
strokeDashoffset: length
|
|
1611
|
+
})
|
|
1612
|
+
]
|
|
1613
|
+
}),
|
|
1614
|
+
/* @__PURE__ */ jsx32("span", {
|
|
1615
|
+
className: "absolute top-[".concat(50 / 2, "] text-xl leading-none font-medium font-header hidden sm:block"),
|
|
1616
|
+
children: percentage.toString() + "%"
|
|
1617
|
+
})
|
|
1618
|
+
]
|
|
1619
|
+
}),
|
|
1620
|
+
/* @__PURE__ */ jsx32("p", {
|
|
1621
|
+
className: "font-medium sm:text-xl font-header text-center w-full",
|
|
1622
|
+
children: label
|
|
1623
|
+
})
|
|
1624
|
+
]
|
|
1625
|
+
});
|
|
1054
1626
|
};
|
|
1055
|
-
var Small = (
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
/* @__PURE__ */
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1627
|
+
var Small = function(param) {
|
|
1628
|
+
var twColor = param.twColor, percentage = param.percentage, label = param.label;
|
|
1629
|
+
var cx = 18;
|
|
1630
|
+
var cy = 18;
|
|
1631
|
+
var r = 14;
|
|
1632
|
+
var strokeWidth = 4;
|
|
1633
|
+
var strokeDashoffset = 2 * Math.PI * r - percentage / 100 * 2 * Math.PI * r;
|
|
1634
|
+
return /* @__PURE__ */ jsxs15("div", {
|
|
1635
|
+
className: "flex items-center space-x-2 rounded-full bg-transparent border-2 border-slate-100 w-full",
|
|
1636
|
+
children: [
|
|
1637
|
+
/* @__PURE__ */ jsx32("div", {
|
|
1638
|
+
className: "flex items-center justify-center overflow-hidden",
|
|
1639
|
+
children: /* @__PURE__ */ jsxs15("svg", {
|
|
1640
|
+
className: "w-10 h-11 transform translate-x-1 translate-y-1",
|
|
1641
|
+
children: [
|
|
1642
|
+
/* @__PURE__ */ jsx32("circle", {
|
|
1643
|
+
className: "text-gray-300",
|
|
1644
|
+
strokeWidth: strokeWidth,
|
|
1645
|
+
stroke: "currentColor",
|
|
1646
|
+
fill: "transparent",
|
|
1647
|
+
r: r,
|
|
1648
|
+
cx: cx,
|
|
1649
|
+
cy: cy
|
|
1650
|
+
}),
|
|
1651
|
+
/* @__PURE__ */ jsx32("circle", {
|
|
1652
|
+
style: {
|
|
1653
|
+
strokeDashoffset: strokeDashoffset
|
|
1654
|
+
},
|
|
1655
|
+
className: twColor || "text-blue-500",
|
|
1656
|
+
ref: function(ref) {
|
|
1657
|
+
if (ref) {}
|
|
1658
|
+
},
|
|
1659
|
+
strokeWidth: strokeWidth,
|
|
1660
|
+
strokeLinecap: "round",
|
|
1661
|
+
stroke: "currentColor",
|
|
1662
|
+
fill: "transparent",
|
|
1663
|
+
r: r,
|
|
1664
|
+
cx: cx,
|
|
1665
|
+
cy: cy
|
|
1666
|
+
})
|
|
1667
|
+
]
|
|
1668
|
+
})
|
|
1669
|
+
}),
|
|
1670
|
+
/* @__PURE__ */ jsxs15("p", {
|
|
1671
|
+
className: "font-medium dark:text-gray-300 text-gray-600 text-sm font-header mt-1",
|
|
1672
|
+
children: [
|
|
1673
|
+
label,
|
|
1674
|
+
" ",
|
|
1675
|
+
percentage.toString() + "%"
|
|
1676
|
+
]
|
|
1677
|
+
})
|
|
1678
|
+
]
|
|
1679
|
+
});
|
|
1100
1680
|
};
|
|
1101
1681
|
CourseProgress.Small = Small;
|
|
1102
1682
|
var CourseProgress_default = CourseProgress;
|
|
1103
|
-
|
|
1104
1683
|
// src/ProgressBar/ScrollProgress.tsx
|
|
1105
1684
|
import { useEffect as useEffect4, useState as useState5 } from "react";
|
|
1106
|
-
import { jsx as
|
|
1685
|
+
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
1107
1686
|
var PRIMARY_COLOR3 = "#00b4d8";
|
|
1108
|
-
var ScrollProgress = ()
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
style: {
|
|
1127
|
-
height: "4px",
|
|
1128
|
-
borderRadius: 2,
|
|
1129
|
-
width: "100%",
|
|
1130
|
-
// backgroundColor: '#d1dced',
|
|
1131
|
-
position: "fixed",
|
|
1132
|
-
top: "62px",
|
|
1133
|
-
left: "0px",
|
|
1134
|
-
right: "0px"
|
|
1135
|
-
},
|
|
1136
|
-
children: /* @__PURE__ */ jsx25(
|
|
1137
|
-
"div",
|
|
1138
|
-
{
|
|
1139
|
-
style: {
|
|
1140
|
-
height: "100%",
|
|
1141
|
-
backgroundColor: PRIMARY_COLOR3,
|
|
1687
|
+
var ScrollProgress = function() {
|
|
1688
|
+
var _useState5 = _sliced_to_array(useState5(0), 2), scrollPercentage = _useState5[0], setScrollPercentage = _useState5[1];
|
|
1689
|
+
useEffect4(function() {
|
|
1690
|
+
var handleScroll = function() {
|
|
1691
|
+
var windowHeight = window.innerHeight;
|
|
1692
|
+
var documentHeight = document.documentElement.scrollHeight;
|
|
1693
|
+
var scrollY = window.scrollY;
|
|
1694
|
+
var scrollPercent = scrollY / (documentHeight - windowHeight) * 100;
|
|
1695
|
+
setScrollPercentage(scrollPercent);
|
|
1696
|
+
};
|
|
1697
|
+
window.addEventListener("scroll", handleScroll);
|
|
1698
|
+
return function() {
|
|
1699
|
+
window.removeEventListener("scroll", handleScroll);
|
|
1700
|
+
};
|
|
1701
|
+
}, []);
|
|
1702
|
+
return /* @__PURE__ */ jsx33("div", {
|
|
1703
|
+
style: {
|
|
1704
|
+
height: "4px",
|
|
1142
1705
|
borderRadius: 2,
|
|
1143
|
-
width:
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1706
|
+
width: "100%",
|
|
1707
|
+
// backgroundColor: '#d1dced',
|
|
1708
|
+
position: "fixed",
|
|
1709
|
+
top: "62px",
|
|
1710
|
+
left: "0px",
|
|
1711
|
+
right: "0px"
|
|
1712
|
+
},
|
|
1713
|
+
children: /* @__PURE__ */ jsx33("div", {
|
|
1714
|
+
style: {
|
|
1715
|
+
height: "100%",
|
|
1716
|
+
backgroundColor: PRIMARY_COLOR3,
|
|
1717
|
+
borderRadius: 2,
|
|
1718
|
+
width: "".concat(scrollPercentage, "%")
|
|
1719
|
+
}
|
|
1720
|
+
})
|
|
1721
|
+
});
|
|
1149
1722
|
};
|
|
1150
1723
|
var ScrollProgress_default = ScrollProgress;
|
|
1151
|
-
|
|
1152
1724
|
// src/Icons/AnimateLogo.tsx
|
|
1153
1725
|
import { useEffect as useEffect5, useState as useState6 } from "react";
|
|
1154
|
-
import { jsx as
|
|
1155
|
-
var AnimateLogo = ()
|
|
1156
|
-
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
|
|
1162
|
-
|
|
1163
|
-
|
|
1164
|
-
|
|
1165
|
-
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
|
-
{
|
|
1212
|
-
style: {
|
|
1213
|
-
transformOrigin: "center"
|
|
1214
|
-
},
|
|
1215
|
-
transform: "translate(300 300) rotate(0)",
|
|
1216
|
-
height: 176,
|
|
1217
|
-
width: 176,
|
|
1218
|
-
children: [
|
|
1219
|
-
/* @__PURE__ */ jsx26(
|
|
1220
|
-
"path",
|
|
1221
|
-
{
|
|
1222
|
-
className: "stroke-black dark:stroke-white text-gray-900 dark:text-gray-50",
|
|
1223
|
-
stroke: "currentColor",
|
|
1224
|
-
id: "motionPath",
|
|
1225
|
-
fill: "none",
|
|
1226
|
-
strokeLinecap: "round",
|
|
1227
|
-
height: 600,
|
|
1228
|
-
width: 600,
|
|
1726
|
+
import { jsx as jsx34, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1727
|
+
var AnimateLogo = function() {
|
|
1728
|
+
var _useState6 = _sliced_to_array(useState6(false), 2), isFirefox = _useState6[0], setIsFirefox = _useState6[1];
|
|
1729
|
+
useEffect5(function() {
|
|
1730
|
+
var userAgent = window.navigator.userAgent;
|
|
1731
|
+
setIsFirefox(userAgent.indexOf("Firefox") > -1);
|
|
1732
|
+
}, []);
|
|
1733
|
+
if (isFirefox) {
|
|
1734
|
+
return /* @__PURE__ */ jsx34("svg", {
|
|
1735
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1736
|
+
className: "animate-pulse",
|
|
1737
|
+
viewBox: "0 0 600 600",
|
|
1738
|
+
children: /* @__PURE__ */ jsx34("g", {
|
|
1739
|
+
children: /* @__PURE__ */ jsxs16("path", {
|
|
1740
|
+
className: "stroke-black dark:stroke-white text-gray-900 dark:text-gray-50",
|
|
1741
|
+
stroke: "currentColor",
|
|
1742
|
+
fill: "none",
|
|
1743
|
+
strokeLinecap: "round",
|
|
1744
|
+
strokeMiterlimit: "10",
|
|
1745
|
+
strokeWidth: "82",
|
|
1746
|
+
strokeDasharray: "1600",
|
|
1747
|
+
d: "M466.49 164.79c17.79 34.76 25.48 75.66 19.08 118.96-11.28 76.36-67.11 139.06-141.89 158.25-127.11 32.61-243.49-61.27-245.86-184.81C95.79 150.86 182.9 60.52 289.23 58.56c33.95-.63 66.08 7.48 94.22 22.29 0 0 15.68 6.34 10.14 23.19 0 0-68.52 219.82-352.61 268.06",
|
|
1748
|
+
children: [
|
|
1749
|
+
/* @__PURE__ */ jsx34("animate", {
|
|
1750
|
+
attributeName: "stroke-dashoffset",
|
|
1751
|
+
to: "0",
|
|
1752
|
+
from: "1600",
|
|
1753
|
+
dur: "4s",
|
|
1754
|
+
fill: "freeze",
|
|
1755
|
+
repeatCount: "indefinite",
|
|
1756
|
+
calcMode: "cubic",
|
|
1757
|
+
keyTimes: "0;0.375;0.5;0.875;1",
|
|
1758
|
+
keySplines: "0 0.26 0 1;0 0.26 0 1;0 0.26 0 1;0 0.26 0 1",
|
|
1759
|
+
values: "1600;0;0;1600;1600"
|
|
1760
|
+
}),
|
|
1761
|
+
/* @__PURE__ */ jsx34("animateTransform", {
|
|
1762
|
+
attributeName: "transform",
|
|
1763
|
+
type: "rotate",
|
|
1764
|
+
from: "0 300 300",
|
|
1765
|
+
to: "360 300 300",
|
|
1766
|
+
dur: "2s",
|
|
1767
|
+
fill: "freeze",
|
|
1768
|
+
repeatCount: "indefinite",
|
|
1769
|
+
calcMode: "cubic",
|
|
1770
|
+
keyTimes: "0;0.75;1",
|
|
1771
|
+
keySplines: "0 0.26 0 1",
|
|
1772
|
+
values: "0 300 300;360 300 300;360 300 300;"
|
|
1773
|
+
})
|
|
1774
|
+
]
|
|
1775
|
+
})
|
|
1776
|
+
})
|
|
1777
|
+
});
|
|
1778
|
+
}
|
|
1779
|
+
return /* @__PURE__ */ jsx34("svg", {
|
|
1780
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1781
|
+
viewBox: "0 0 600 600",
|
|
1782
|
+
children: /* @__PURE__ */ jsxs16("g", {
|
|
1229
1783
|
style: {
|
|
1230
|
-
|
|
1784
|
+
transformOrigin: "center"
|
|
1231
1785
|
},
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1252
|
-
|
|
1253
|
-
|
|
1254
|
-
|
|
1255
|
-
|
|
1256
|
-
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1786
|
+
transform: "translate(300 300) rotate(0)",
|
|
1787
|
+
height: 176,
|
|
1788
|
+
width: 176,
|
|
1789
|
+
children: [
|
|
1790
|
+
/* @__PURE__ */ jsx34("path", {
|
|
1791
|
+
className: "stroke-black dark:stroke-white text-gray-900 dark:text-gray-50",
|
|
1792
|
+
stroke: "currentColor",
|
|
1793
|
+
id: "motionPath",
|
|
1794
|
+
fill: "none",
|
|
1795
|
+
strokeLinecap: "round",
|
|
1796
|
+
height: 600,
|
|
1797
|
+
width: 600,
|
|
1798
|
+
style: {
|
|
1799
|
+
transformOrigin: "center"
|
|
1800
|
+
},
|
|
1801
|
+
strokeMiterlimit: "10",
|
|
1802
|
+
strokeWidth: "82",
|
|
1803
|
+
strokeDasharray: "1600",
|
|
1804
|
+
d: "M466.49 164.79c17.79 34.76 25.48 75.66 19.08 118.96-11.28 76.36-67.11 139.06-141.89 158.25-127.11 32.61-243.49-61.27-245.86-184.81C95.79 150.86 182.9 60.52 289.23 58.56c33.95-.63 66.08 7.48 94.22 22.29 0 0 15.68 6.34 10.14 23.19 0 0-68.52 219.82-352.61 268.06",
|
|
1805
|
+
children: /* @__PURE__ */ jsx34("animate", {
|
|
1806
|
+
attributeName: "stroke-dashoffset",
|
|
1807
|
+
to: "0",
|
|
1808
|
+
from: "1600",
|
|
1809
|
+
dur: "4s",
|
|
1810
|
+
fill: "freeze",
|
|
1811
|
+
repeatCount: "indefinite",
|
|
1812
|
+
calcMode: "cubic",
|
|
1813
|
+
keyTimes: "0;0.375;0.5;0.875;1",
|
|
1814
|
+
keySplines: "0 0.26 0 1;0 0.26 0 1;0 0.26 0 1;0 0.26 0 1",
|
|
1815
|
+
values: "1600;0;0;1600;1600"
|
|
1816
|
+
})
|
|
1817
|
+
}),
|
|
1818
|
+
/* @__PURE__ */ jsx34("animateTransform", {
|
|
1819
|
+
attributeName: "transform",
|
|
1820
|
+
type: "rotate",
|
|
1821
|
+
from: "0",
|
|
1822
|
+
to: "360",
|
|
1823
|
+
dur: "2s",
|
|
1824
|
+
fill: "freeze",
|
|
1825
|
+
repeatCount: "indefinite",
|
|
1826
|
+
calcMode: "cubic",
|
|
1827
|
+
keyTimes: "0;0.75;1",
|
|
1828
|
+
keySplines: "0 0.26 0 1",
|
|
1829
|
+
values: "0;360;360;"
|
|
1830
|
+
})
|
|
1831
|
+
]
|
|
1832
|
+
})
|
|
1833
|
+
});
|
|
1272
1834
|
};
|
|
1273
1835
|
var AnimateLogo_default = AnimateLogo;
|
|
1274
|
-
|
|
1275
1836
|
// src/Spinners/OverlaySpinner.tsx
|
|
1276
1837
|
import { useEffect as useEffect6, useState as useState7 } from "react";
|
|
1277
1838
|
import { createPortal } from "react-dom";
|
|
1278
|
-
import { jsx as
|
|
1279
|
-
var OverlaySpinner = (
|
|
1280
|
-
|
|
1281
|
-
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
"
|
|
1288
|
-
|
|
1839
|
+
import { jsx as jsx35 } from "react/jsx-runtime";
|
|
1840
|
+
var OverlaySpinner = function(param) {
|
|
1841
|
+
var visible = param.visible;
|
|
1842
|
+
var _useState7 = _sliced_to_array(useState7(false), 2), mounted = _useState7[0], setMounted = _useState7[1];
|
|
1843
|
+
useEffect6(function() {
|
|
1844
|
+
return setMounted(true);
|
|
1845
|
+
}, []);
|
|
1846
|
+
if (!mounted) return null;
|
|
1847
|
+
if (!visible) return null;
|
|
1848
|
+
return createPortal(/* @__PURE__ */ jsx35("div", {
|
|
1849
|
+
className: "animate-fade-in",
|
|
1850
|
+
children: /* @__PURE__ */ jsx35("div", {
|
|
1851
|
+
className: "fixed top-0 left-0 w-full h-screen flex items-center justify-center z-50 dark:bg-black/70 bg-white/60",
|
|
1852
|
+
children: /* @__PURE__ */ jsx35("div", {
|
|
1853
|
+
className: "h-44 w-44 overflow-visible",
|
|
1854
|
+
children: /* @__PURE__ */ jsx35(AnimateLogo_default, {})
|
|
1855
|
+
})
|
|
1856
|
+
})
|
|
1857
|
+
}), typeof window !== "undefined" ? document.body : {}, "spinner");
|
|
1289
1858
|
};
|
|
1290
1859
|
var OverlaySpinner_default = OverlaySpinner;
|
|
1291
|
-
export {
|
|
1292
|
-
AnimateLogo_default as AnimateLogo,
|
|
1293
|
-
Backdrop_default as Backdrop,
|
|
1294
|
-
BottomAlert_default as BottomAlert,
|
|
1295
|
-
Breakpoint_default as Breakpoint,
|
|
1296
|
-
Button_default as Button,
|
|
1297
|
-
Checkbox_default as Checkbox,
|
|
1298
|
-
CircleProgress_default as CircleProgress,
|
|
1299
|
-
Container_default as Container,
|
|
1300
|
-
CourseProgress_default as CourseProgress,
|
|
1301
|
-
ErrorText_default as ErrorText,
|
|
1302
|
-
Fade_default as Fade,
|
|
1303
|
-
FunButton_default as FunButton,
|
|
1304
|
-
FunRoundButton_default as FunRoundButton,
|
|
1305
|
-
IconInfo_default as IconInfo,
|
|
1306
|
-
Modal_default as Modal,
|
|
1307
|
-
NoResults_default as NoResults,
|
|
1308
|
-
NoticeBox_default as NoticeBox,
|
|
1309
|
-
Overlay_default as Overlay,
|
|
1310
|
-
OverlaySpinner_default as OverlaySpinner,
|
|
1311
|
-
PRIMARY_COLOR,
|
|
1312
|
-
Pill_default as Pill,
|
|
1313
|
-
ProgressBar_default as ProgressBar,
|
|
1314
|
-
ProgressBarSimple_default as ProgressBarSimple,
|
|
1315
|
-
RadioOption_default as RadioOption,
|
|
1316
|
-
RatingStars_default as RatingStars,
|
|
1317
|
-
ScrollProgress_default as ScrollProgress,
|
|
1318
|
-
Slider_default as Slider,
|
|
1319
|
-
Spinner_default as Spinner,
|
|
1320
|
-
StepsComponent_default as StepsComponent,
|
|
1321
|
-
Tippy_default as Tippy,
|
|
1322
|
-
ToggleSwitch_default as ToggleSwitch,
|
|
1323
|
-
UserContentSwitcher_default as UserContentSwitcher,
|
|
1324
|
-
baseFieldStyle,
|
|
1325
|
-
createExerciseElementStyle,
|
|
1326
|
-
exerciseDeleteButton,
|
|
1327
|
-
exerciseEditButton,
|
|
1328
|
-
headerButtonClass,
|
|
1329
|
-
headerTippyClass,
|
|
1330
|
-
tippyClassname,
|
|
1331
|
-
toolbarExerciseButton,
|
|
1332
|
-
xIconButton
|
|
1333
|
-
};
|
|
1860
|
+
export { AnimateLogo_default as AnimateLogo, Backdrop_default as Backdrop, BottomAlert_default as BottomAlert, Breakpoint_default as Breakpoint, Button_default as Button, Checkbox_default as Checkbox, CircleProgress_default as CircleProgress, CourseProgress_default as CourseProgress, ErrorText_default as ErrorText, Fade_default as Fade, FunButton_default as FunButton, FunRoundButton_default as FunRoundButton, IconInfo_default as IconInfo, Modal_default as Modal, NoResults_default as NoResults, NoticeBox_default as NoticeBox, Overlay_default as Overlay, OverlaySpinner_default as OverlaySpinner, PRIMARY_COLOR, Pill_default as Pill, ProgressBar_default as ProgressBar, ProgressBarSimple_default as ProgressBarSimple, RadioOption_default as RadioOption, RatingStars_default as RatingStars, ScrollProgress_default as ScrollProgress, Slider_default as Slider, Spinner_default as Spinner, StepsComponent_default as StepsComponent, Tippy_default as Tippy, ToggleSwitch_default as ToggleSwitch, UserContentSwitcher_default as UserContentSwitcher, baseFieldStyle, createExerciseElementStyle, exerciseDeleteButton, exerciseEditButton, headerButtonClass, headerTippyClass, tippyClassname, toolbarExerciseButton, xIconButton };
|