analytica-frontend-lib 1.1.49 → 1.1.50
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/ThemeToggle/index.d.mts +51 -0
- package/dist/ThemeToggle/index.d.ts +51 -0
- package/dist/ThemeToggle/index.js +236 -0
- package/dist/ThemeToggle/index.js.map +1 -0
- package/dist/ThemeToggle/index.mjs +211 -0
- package/dist/ThemeToggle/index.mjs.map +1 -0
- package/dist/hooks/useTheme/index.d.mts +9 -4
- package/dist/hooks/useTheme/index.d.ts +9 -4
- package/dist/hooks/useTheme/index.js +73 -11
- package/dist/hooks/useTheme/index.js.map +1 -1
- package/dist/hooks/useTheme/index.mjs +74 -12
- package/dist/hooks/useTheme/index.mjs.map +1 -1
- package/dist/index.css +39 -0
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +698 -521
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +667 -491
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +39 -0
- package/dist/styles.css.map +1 -1
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -128,6 +128,7 @@ __export(src_exports, {
|
|
|
128
128
|
Table: () => Table_default,
|
|
129
129
|
Text: () => Text_default,
|
|
130
130
|
TextArea: () => TextArea_default,
|
|
131
|
+
ThemeToggle: () => ThemeToggle,
|
|
131
132
|
Toast: () => Toast_default,
|
|
132
133
|
Toaster: () => Toaster_default,
|
|
133
134
|
VideoPlayer: () => VideoPlayer_default,
|
|
@@ -6072,32 +6073,207 @@ var useMobile = () => {
|
|
|
6072
6073
|
// src/hooks/useTheme.ts
|
|
6073
6074
|
var import_react20 = require("react");
|
|
6074
6075
|
var useTheme = () => {
|
|
6075
|
-
(0, import_react20.
|
|
6076
|
+
const [themeMode, setThemeMode] = (0, import_react20.useState)("system");
|
|
6077
|
+
const [isDark, setIsDark] = (0, import_react20.useState)(false);
|
|
6078
|
+
const themeModeRef = (0, import_react20.useRef)("system");
|
|
6079
|
+
const applyTheme = (0, import_react20.useCallback)((mode) => {
|
|
6076
6080
|
const htmlElement = document.documentElement;
|
|
6077
|
-
const
|
|
6078
|
-
if (
|
|
6079
|
-
htmlElement.setAttribute("data-
|
|
6080
|
-
|
|
6081
|
-
|
|
6082
|
-
|
|
6081
|
+
const originalTheme = htmlElement.getAttribute("data-original-theme");
|
|
6082
|
+
if (mode === "dark") {
|
|
6083
|
+
htmlElement.setAttribute("data-theme", "dark");
|
|
6084
|
+
setIsDark(true);
|
|
6085
|
+
} else if (mode === "light") {
|
|
6086
|
+
if (originalTheme) {
|
|
6087
|
+
htmlElement.setAttribute("data-theme", originalTheme);
|
|
6088
|
+
}
|
|
6089
|
+
setIsDark(false);
|
|
6090
|
+
} else if (mode === "system") {
|
|
6091
|
+
const isSystemDark = window.matchMedia(
|
|
6083
6092
|
"(prefers-color-scheme: dark)"
|
|
6084
6093
|
).matches;
|
|
6085
|
-
|
|
6086
|
-
if (isDarkMode) {
|
|
6094
|
+
if (isSystemDark) {
|
|
6087
6095
|
htmlElement.setAttribute("data-theme", "dark");
|
|
6096
|
+
setIsDark(true);
|
|
6088
6097
|
} else if (originalTheme) {
|
|
6089
6098
|
htmlElement.setAttribute("data-theme", originalTheme);
|
|
6099
|
+
setIsDark(false);
|
|
6090
6100
|
}
|
|
6091
|
-
}
|
|
6092
|
-
applyTheme();
|
|
6101
|
+
}
|
|
6093
6102
|
}, []);
|
|
6103
|
+
const toggleTheme = (0, import_react20.useCallback)(() => {
|
|
6104
|
+
let newMode;
|
|
6105
|
+
if (themeMode === "light") {
|
|
6106
|
+
newMode = "dark";
|
|
6107
|
+
} else if (themeMode === "dark") {
|
|
6108
|
+
newMode = "light";
|
|
6109
|
+
} else {
|
|
6110
|
+
newMode = "dark";
|
|
6111
|
+
}
|
|
6112
|
+
setThemeMode(newMode);
|
|
6113
|
+
themeModeRef.current = newMode;
|
|
6114
|
+
applyTheme(newMode);
|
|
6115
|
+
localStorage.setItem("theme-mode", newMode);
|
|
6116
|
+
}, [themeMode, applyTheme]);
|
|
6117
|
+
const setTheme = (0, import_react20.useCallback)(
|
|
6118
|
+
(mode) => {
|
|
6119
|
+
setThemeMode(mode);
|
|
6120
|
+
themeModeRef.current = mode;
|
|
6121
|
+
applyTheme(mode);
|
|
6122
|
+
localStorage.setItem("theme-mode", mode);
|
|
6123
|
+
},
|
|
6124
|
+
[applyTheme]
|
|
6125
|
+
);
|
|
6126
|
+
(0, import_react20.useEffect)(() => {
|
|
6127
|
+
const htmlElement = document.documentElement;
|
|
6128
|
+
const currentTheme = htmlElement.getAttribute("data-theme");
|
|
6129
|
+
if (currentTheme && !htmlElement.getAttribute("data-original-theme")) {
|
|
6130
|
+
htmlElement.setAttribute("data-original-theme", currentTheme);
|
|
6131
|
+
}
|
|
6132
|
+
const savedThemeMode = localStorage.getItem("theme-mode");
|
|
6133
|
+
const initialMode = savedThemeMode || "system";
|
|
6134
|
+
if (!savedThemeMode) {
|
|
6135
|
+
localStorage.setItem("theme-mode", "system");
|
|
6136
|
+
}
|
|
6137
|
+
setThemeMode(initialMode);
|
|
6138
|
+
themeModeRef.current = initialMode;
|
|
6139
|
+
applyTheme(initialMode);
|
|
6140
|
+
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
6141
|
+
const handleSystemThemeChange = () => {
|
|
6142
|
+
if (themeModeRef.current === "system") {
|
|
6143
|
+
applyTheme("system");
|
|
6144
|
+
}
|
|
6145
|
+
};
|
|
6146
|
+
mediaQuery.addEventListener("change", handleSystemThemeChange);
|
|
6147
|
+
return () => {
|
|
6148
|
+
mediaQuery.removeEventListener("change", handleSystemThemeChange);
|
|
6149
|
+
};
|
|
6150
|
+
}, [applyTheme]);
|
|
6151
|
+
return {
|
|
6152
|
+
themeMode,
|
|
6153
|
+
isDark,
|
|
6154
|
+
toggleTheme,
|
|
6155
|
+
setTheme
|
|
6156
|
+
};
|
|
6094
6157
|
};
|
|
6095
6158
|
|
|
6159
|
+
// src/components/ThemeToggle/ThemeToggle.tsx
|
|
6160
|
+
var import_react21 = require("react");
|
|
6161
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
6162
|
+
var ThemeToggle = (0, import_react21.forwardRef)(
|
|
6163
|
+
({
|
|
6164
|
+
variant = "simple",
|
|
6165
|
+
size = "md",
|
|
6166
|
+
showIcons = true,
|
|
6167
|
+
showLabels = true,
|
|
6168
|
+
className,
|
|
6169
|
+
children,
|
|
6170
|
+
...props
|
|
6171
|
+
}, ref) => {
|
|
6172
|
+
const { themeMode, isDark, toggleTheme, setTheme } = useTheme();
|
|
6173
|
+
const sizeClasses = {
|
|
6174
|
+
sm: "text-sm px-3 py-1.5",
|
|
6175
|
+
md: "text-md px-4 py-2",
|
|
6176
|
+
lg: "text-lg px-5 py-2.5"
|
|
6177
|
+
};
|
|
6178
|
+
const activeClasses = "bg-primary-500 text-white";
|
|
6179
|
+
const inactiveClasses = "bg-gray-200 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-300 dark:hover:bg-gray-600";
|
|
6180
|
+
const baseButtonClasses = "inline-flex items-center justify-center gap-2 rounded-md border border-gray-300 dark:border-gray-600 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500";
|
|
6181
|
+
const smallButtonClasses = "px-3 py-1.5 rounded-md text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500";
|
|
6182
|
+
const renderThemeButton = (theme, icon, label, isActive, buttonSize) => {
|
|
6183
|
+
const buttonClasses = buttonSize ? cn(baseButtonClasses, sizeClasses[buttonSize]) : smallButtonClasses;
|
|
6184
|
+
const stateClasses = isActive ? activeClasses : inactiveClasses;
|
|
6185
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
|
|
6186
|
+
"button",
|
|
6187
|
+
{
|
|
6188
|
+
type: "button",
|
|
6189
|
+
onClick: () => setTheme(theme),
|
|
6190
|
+
className: cn(buttonClasses, stateClasses),
|
|
6191
|
+
...buttonSize ? props : {},
|
|
6192
|
+
children: [
|
|
6193
|
+
showIcons && icon,
|
|
6194
|
+
showLabels && label
|
|
6195
|
+
]
|
|
6196
|
+
}
|
|
6197
|
+
);
|
|
6198
|
+
};
|
|
6199
|
+
if (variant === "simple") {
|
|
6200
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6201
|
+
"button",
|
|
6202
|
+
{
|
|
6203
|
+
type: "button",
|
|
6204
|
+
ref,
|
|
6205
|
+
onClick: toggleTheme,
|
|
6206
|
+
className: cn(
|
|
6207
|
+
"inline-flex items-center justify-center gap-2 rounded-md border border-gray-300 dark:border-gray-600 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500",
|
|
6208
|
+
sizeClasses[size],
|
|
6209
|
+
className
|
|
6210
|
+
),
|
|
6211
|
+
...props,
|
|
6212
|
+
children: children || /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
|
|
6213
|
+
showIcons && (isDark ? "\u2600\uFE0F" : "\u{1F319}"),
|
|
6214
|
+
showLabels && (isDark ? "Claro" : "Escuro")
|
|
6215
|
+
] })
|
|
6216
|
+
}
|
|
6217
|
+
);
|
|
6218
|
+
}
|
|
6219
|
+
if (variant === "detailed") {
|
|
6220
|
+
const getLabel = () => {
|
|
6221
|
+
if (themeMode === "system") return "Sistema";
|
|
6222
|
+
if (isDark) return "Escuro";
|
|
6223
|
+
return "Claro";
|
|
6224
|
+
};
|
|
6225
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cn("flex flex-col gap-2", className), children: [
|
|
6226
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: [
|
|
6227
|
+
"Tema: ",
|
|
6228
|
+
getLabel()
|
|
6229
|
+
] }),
|
|
6230
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex gap-1", children: [
|
|
6231
|
+
renderThemeButton("light", "\u2600\uFE0F ", "Claro", themeMode === "light"),
|
|
6232
|
+
renderThemeButton("dark", "\u{1F319} ", "Escuro", themeMode === "dark"),
|
|
6233
|
+
renderThemeButton(
|
|
6234
|
+
"system",
|
|
6235
|
+
"\u2699\uFE0F ",
|
|
6236
|
+
"Sistema",
|
|
6237
|
+
themeMode === "system"
|
|
6238
|
+
)
|
|
6239
|
+
] })
|
|
6240
|
+
] });
|
|
6241
|
+
}
|
|
6242
|
+
if (variant === "buttons") {
|
|
6243
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cn("flex gap-2", className), children: [
|
|
6244
|
+
renderThemeButton(
|
|
6245
|
+
"light",
|
|
6246
|
+
"\u2600\uFE0F",
|
|
6247
|
+
"Claro",
|
|
6248
|
+
themeMode === "light",
|
|
6249
|
+
size
|
|
6250
|
+
),
|
|
6251
|
+
renderThemeButton(
|
|
6252
|
+
"dark",
|
|
6253
|
+
"\u{1F319}",
|
|
6254
|
+
"Escuro",
|
|
6255
|
+
themeMode === "dark",
|
|
6256
|
+
size
|
|
6257
|
+
),
|
|
6258
|
+
renderThemeButton(
|
|
6259
|
+
"system",
|
|
6260
|
+
"\u2699\uFE0F",
|
|
6261
|
+
"Sistema",
|
|
6262
|
+
themeMode === "system",
|
|
6263
|
+
size
|
|
6264
|
+
)
|
|
6265
|
+
] });
|
|
6266
|
+
}
|
|
6267
|
+
return null;
|
|
6268
|
+
}
|
|
6269
|
+
);
|
|
6270
|
+
ThemeToggle.displayName = "ThemeToggle";
|
|
6271
|
+
|
|
6096
6272
|
// src/components/Select/Select.tsx
|
|
6097
6273
|
var import_zustand5 = require("zustand");
|
|
6098
|
-
var
|
|
6274
|
+
var import_react22 = require("react");
|
|
6099
6275
|
var import_phosphor_react16 = require("phosphor-react");
|
|
6100
|
-
var
|
|
6276
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
6101
6277
|
var VARIANT_CLASSES4 = {
|
|
6102
6278
|
outlined: "border-2 rounded-lg focus:border-primary-950",
|
|
6103
6279
|
underlined: "border-b-2 focus:border-primary-950",
|
|
@@ -6155,13 +6331,13 @@ function getLabelAsNode(children) {
|
|
|
6155
6331
|
if (typeof children === "string" || typeof children === "number") {
|
|
6156
6332
|
return children;
|
|
6157
6333
|
}
|
|
6158
|
-
const flattened =
|
|
6334
|
+
const flattened = import_react22.Children.toArray(children);
|
|
6159
6335
|
if (flattened.length === 1) return flattened[0];
|
|
6160
|
-
return /* @__PURE__ */ (0,
|
|
6336
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, { children: flattened });
|
|
6161
6337
|
}
|
|
6162
6338
|
var injectStore4 = (children, store, size, selectId) => {
|
|
6163
|
-
return
|
|
6164
|
-
if ((0,
|
|
6339
|
+
return import_react22.Children.map(children, (child) => {
|
|
6340
|
+
if ((0, import_react22.isValidElement)(child)) {
|
|
6165
6341
|
const typedChild = child;
|
|
6166
6342
|
const newProps = {
|
|
6167
6343
|
store
|
|
@@ -6178,7 +6354,7 @@ var injectStore4 = (children, store, size, selectId) => {
|
|
|
6178
6354
|
selectId
|
|
6179
6355
|
);
|
|
6180
6356
|
}
|
|
6181
|
-
return (0,
|
|
6357
|
+
return (0, import_react22.cloneElement)(typedChild, newProps);
|
|
6182
6358
|
}
|
|
6183
6359
|
return child;
|
|
6184
6360
|
});
|
|
@@ -6195,18 +6371,18 @@ var Select = ({
|
|
|
6195
6371
|
errorMessage,
|
|
6196
6372
|
id
|
|
6197
6373
|
}) => {
|
|
6198
|
-
const storeRef = (0,
|
|
6374
|
+
const storeRef = (0, import_react22.useRef)(null);
|
|
6199
6375
|
storeRef.current ??= createSelectStore(onValueChange);
|
|
6200
6376
|
const store = storeRef.current;
|
|
6201
|
-
const selectRef = (0,
|
|
6377
|
+
const selectRef = (0, import_react22.useRef)(null);
|
|
6202
6378
|
const { open, setOpen, setValue, selectedLabel } = (0, import_zustand5.useStore)(store, (s) => s);
|
|
6203
|
-
const generatedId = (0,
|
|
6379
|
+
const generatedId = (0, import_react22.useId)();
|
|
6204
6380
|
const selectId = id ?? `select-${generatedId}`;
|
|
6205
6381
|
const findLabelForValue = (children2, targetValue) => {
|
|
6206
6382
|
let found = null;
|
|
6207
6383
|
const search = (nodes) => {
|
|
6208
|
-
|
|
6209
|
-
if (!(0,
|
|
6384
|
+
import_react22.Children.forEach(nodes, (child) => {
|
|
6385
|
+
if (!(0, import_react22.isValidElement)(child)) return;
|
|
6210
6386
|
const typedChild = child;
|
|
6211
6387
|
if (typedChild.type === SelectItem && typedChild.props.value === targetValue) {
|
|
6212
6388
|
if (typeof typedChild.props.children === "string")
|
|
@@ -6219,13 +6395,13 @@ var Select = ({
|
|
|
6219
6395
|
search(children2);
|
|
6220
6396
|
return found;
|
|
6221
6397
|
};
|
|
6222
|
-
(0,
|
|
6398
|
+
(0, import_react22.useEffect)(() => {
|
|
6223
6399
|
if (!selectedLabel && defaultValue) {
|
|
6224
6400
|
const label2 = findLabelForValue(children, defaultValue);
|
|
6225
6401
|
if (label2) store.setState({ selectedLabel: label2 });
|
|
6226
6402
|
}
|
|
6227
6403
|
}, [children, defaultValue, selectedLabel]);
|
|
6228
|
-
(0,
|
|
6404
|
+
(0, import_react22.useEffect)(() => {
|
|
6229
6405
|
const handleClickOutside = (event) => {
|
|
6230
6406
|
if (selectRef.current && !selectRef.current.contains(event.target)) {
|
|
6231
6407
|
setOpen(false);
|
|
@@ -6260,7 +6436,7 @@ var Select = ({
|
|
|
6260
6436
|
document.removeEventListener("keydown", handleArrowKeys);
|
|
6261
6437
|
};
|
|
6262
6438
|
}, [open]);
|
|
6263
|
-
(0,
|
|
6439
|
+
(0, import_react22.useEffect)(() => {
|
|
6264
6440
|
if (propValue) {
|
|
6265
6441
|
setValue(propValue);
|
|
6266
6442
|
const label2 = findLabelForValue(children, propValue);
|
|
@@ -6268,8 +6444,8 @@ var Select = ({
|
|
|
6268
6444
|
}
|
|
6269
6445
|
}, [propValue]);
|
|
6270
6446
|
const sizeClasses = SIZE_CLASSES12[size];
|
|
6271
|
-
return /* @__PURE__ */ (0,
|
|
6272
|
-
label && /* @__PURE__ */ (0,
|
|
6447
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: cn("w-full", className), children: [
|
|
6448
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6273
6449
|
"label",
|
|
6274
6450
|
{
|
|
6275
6451
|
htmlFor: selectId,
|
|
@@ -6277,11 +6453,11 @@ var Select = ({
|
|
|
6277
6453
|
children: label
|
|
6278
6454
|
}
|
|
6279
6455
|
),
|
|
6280
|
-
/* @__PURE__ */ (0,
|
|
6281
|
-
(helperText || errorMessage) && /* @__PURE__ */ (0,
|
|
6282
|
-
helperText && /* @__PURE__ */ (0,
|
|
6283
|
-
errorMessage && /* @__PURE__ */ (0,
|
|
6284
|
-
/* @__PURE__ */ (0,
|
|
6456
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: cn("relative w-full"), ref: selectRef, children: injectStore4(children, store, size, selectId) }),
|
|
6457
|
+
(helperText || errorMessage) && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "mt-1.5 gap-1.5", children: [
|
|
6458
|
+
helperText && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: "text-sm text-text-500", children: helperText }),
|
|
6459
|
+
errorMessage && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("p", { className: "flex gap-1 items-center text-sm text-indicator-error", children: [
|
|
6460
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_phosphor_react16.WarningCircle, { size: 16 }),
|
|
6285
6461
|
" ",
|
|
6286
6462
|
errorMessage
|
|
6287
6463
|
] })
|
|
@@ -6295,9 +6471,9 @@ var SelectValue = ({
|
|
|
6295
6471
|
const store = useSelectStore(externalStore);
|
|
6296
6472
|
const selectedLabel = (0, import_zustand5.useStore)(store, (s) => s.selectedLabel);
|
|
6297
6473
|
const value = (0, import_zustand5.useStore)(store, (s) => s.value);
|
|
6298
|
-
return /* @__PURE__ */ (0,
|
|
6474
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-inherit flex gap-2 items-center", children: selectedLabel || placeholder || value });
|
|
6299
6475
|
};
|
|
6300
|
-
var SelectTrigger = (0,
|
|
6476
|
+
var SelectTrigger = (0, import_react22.forwardRef)(
|
|
6301
6477
|
({
|
|
6302
6478
|
className,
|
|
6303
6479
|
invalid = false,
|
|
@@ -6314,7 +6490,7 @@ var SelectTrigger = (0, import_react21.forwardRef)(
|
|
|
6314
6490
|
const variantClasses = VARIANT_CLASSES4[variant];
|
|
6315
6491
|
const heightClasses = HEIGHT_CLASSES[size];
|
|
6316
6492
|
const paddingClasses = PADDING_CLASSES[size];
|
|
6317
|
-
return /* @__PURE__ */ (0,
|
|
6493
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
6318
6494
|
"button",
|
|
6319
6495
|
{
|
|
6320
6496
|
ref,
|
|
@@ -6336,7 +6512,7 @@ var SelectTrigger = (0, import_react21.forwardRef)(
|
|
|
6336
6512
|
...props,
|
|
6337
6513
|
children: [
|
|
6338
6514
|
props.children,
|
|
6339
|
-
/* @__PURE__ */ (0,
|
|
6515
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6340
6516
|
import_phosphor_react16.CaretDown,
|
|
6341
6517
|
{
|
|
6342
6518
|
className: cn(
|
|
@@ -6351,7 +6527,7 @@ var SelectTrigger = (0, import_react21.forwardRef)(
|
|
|
6351
6527
|
}
|
|
6352
6528
|
);
|
|
6353
6529
|
SelectTrigger.displayName = "SelectTrigger";
|
|
6354
|
-
var SelectContent = (0,
|
|
6530
|
+
var SelectContent = (0, import_react22.forwardRef)(
|
|
6355
6531
|
({
|
|
6356
6532
|
children,
|
|
6357
6533
|
className,
|
|
@@ -6364,7 +6540,7 @@ var SelectContent = (0, import_react21.forwardRef)(
|
|
|
6364
6540
|
const open = (0, import_zustand5.useStore)(store, (s) => s.open);
|
|
6365
6541
|
if (!open) return null;
|
|
6366
6542
|
const getPositionClasses = () => `w-full min-w-full absolute ${SIDE_CLASSES2[side]} ${ALIGN_CLASSES2[align]}`;
|
|
6367
|
-
return /* @__PURE__ */ (0,
|
|
6543
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6368
6544
|
"div",
|
|
6369
6545
|
{
|
|
6370
6546
|
role: "menu",
|
|
@@ -6381,7 +6557,7 @@ var SelectContent = (0, import_react21.forwardRef)(
|
|
|
6381
6557
|
}
|
|
6382
6558
|
);
|
|
6383
6559
|
SelectContent.displayName = "SelectContent";
|
|
6384
|
-
var SelectItem = (0,
|
|
6560
|
+
var SelectItem = (0, import_react22.forwardRef)(
|
|
6385
6561
|
({
|
|
6386
6562
|
className,
|
|
6387
6563
|
children,
|
|
@@ -6408,7 +6584,7 @@ var SelectItem = (0, import_react21.forwardRef)(
|
|
|
6408
6584
|
}
|
|
6409
6585
|
props.onClick?.(e);
|
|
6410
6586
|
};
|
|
6411
|
-
return /* @__PURE__ */ (0,
|
|
6587
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
6412
6588
|
"div",
|
|
6413
6589
|
{
|
|
6414
6590
|
role: "menuitem",
|
|
@@ -6428,7 +6604,7 @@ var SelectItem = (0, import_react21.forwardRef)(
|
|
|
6428
6604
|
tabIndex: disabled ? -1 : 0,
|
|
6429
6605
|
...props,
|
|
6430
6606
|
children: [
|
|
6431
|
-
/* @__PURE__ */ (0,
|
|
6607
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: selectedValue === value && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_phosphor_react16.Check, { className: "" }) }),
|
|
6432
6608
|
children
|
|
6433
6609
|
]
|
|
6434
6610
|
}
|
|
@@ -6440,9 +6616,9 @@ var Select_default = Select;
|
|
|
6440
6616
|
|
|
6441
6617
|
// src/components/Menu/Menu.tsx
|
|
6442
6618
|
var import_zustand6 = require("zustand");
|
|
6443
|
-
var
|
|
6619
|
+
var import_react23 = require("react");
|
|
6444
6620
|
var import_phosphor_react17 = require("phosphor-react");
|
|
6445
|
-
var
|
|
6621
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
6446
6622
|
var createMenuStore = (onValueChange) => (0, import_zustand6.create)((set) => ({
|
|
6447
6623
|
value: "",
|
|
6448
6624
|
setValue: (value) => {
|
|
@@ -6461,7 +6637,7 @@ var VARIANT_CLASSES5 = {
|
|
|
6461
6637
|
"menu-overflow": "",
|
|
6462
6638
|
breadcrumb: "bg-transparent shadow-none !px-0"
|
|
6463
6639
|
};
|
|
6464
|
-
var Menu = (0,
|
|
6640
|
+
var Menu = (0, import_react23.forwardRef)(
|
|
6465
6641
|
({
|
|
6466
6642
|
className,
|
|
6467
6643
|
children,
|
|
@@ -6471,16 +6647,16 @@ var Menu = (0, import_react22.forwardRef)(
|
|
|
6471
6647
|
onValueChange,
|
|
6472
6648
|
...props
|
|
6473
6649
|
}, ref) => {
|
|
6474
|
-
const storeRef = (0,
|
|
6650
|
+
const storeRef = (0, import_react23.useRef)(null);
|
|
6475
6651
|
storeRef.current ??= createMenuStore(onValueChange);
|
|
6476
6652
|
const store = storeRef.current;
|
|
6477
6653
|
const { setValue } = (0, import_zustand6.useStore)(store, (s) => s);
|
|
6478
|
-
(0,
|
|
6654
|
+
(0, import_react23.useEffect)(() => {
|
|
6479
6655
|
setValue(propValue ?? defaultValue);
|
|
6480
6656
|
}, [defaultValue, propValue, setValue]);
|
|
6481
6657
|
const baseClasses = variant === "menu-overflow" ? "w-fit py-2 flex flex-row items-center justify-center" : "w-full py-2 flex flex-row items-center justify-center";
|
|
6482
6658
|
const variantClasses = VARIANT_CLASSES5[variant];
|
|
6483
|
-
return /* @__PURE__ */ (0,
|
|
6659
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6484
6660
|
"div",
|
|
6485
6661
|
{
|
|
6486
6662
|
ref,
|
|
@@ -6496,11 +6672,11 @@ var Menu = (0, import_react22.forwardRef)(
|
|
|
6496
6672
|
}
|
|
6497
6673
|
);
|
|
6498
6674
|
Menu.displayName = "Menu";
|
|
6499
|
-
var MenuContent = (0,
|
|
6675
|
+
var MenuContent = (0, import_react23.forwardRef)(
|
|
6500
6676
|
({ className, children, variant = "menu", ...props }, ref) => {
|
|
6501
6677
|
const baseClasses = "w-full flex flex-row items-center gap-2";
|
|
6502
6678
|
const variantClasses = variant === "menu2" || variant === "menu-overflow" ? "overflow-x-auto scroll-smooth" : "";
|
|
6503
|
-
return /* @__PURE__ */ (0,
|
|
6679
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6504
6680
|
"ul",
|
|
6505
6681
|
{
|
|
6506
6682
|
ref,
|
|
@@ -6518,7 +6694,7 @@ var MenuContent = (0, import_react22.forwardRef)(
|
|
|
6518
6694
|
}
|
|
6519
6695
|
);
|
|
6520
6696
|
MenuContent.displayName = "MenuContent";
|
|
6521
|
-
var MenuItem = (0,
|
|
6697
|
+
var MenuItem = (0, import_react23.forwardRef)(
|
|
6522
6698
|
({
|
|
6523
6699
|
className,
|
|
6524
6700
|
children,
|
|
@@ -6552,7 +6728,7 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6552
6728
|
...props
|
|
6553
6729
|
};
|
|
6554
6730
|
const variants = {
|
|
6555
|
-
menu: /* @__PURE__ */ (0,
|
|
6731
|
+
menu: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6556
6732
|
"li",
|
|
6557
6733
|
{
|
|
6558
6734
|
"data-variant": "menu",
|
|
@@ -6567,7 +6743,7 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6567
6743
|
children
|
|
6568
6744
|
}
|
|
6569
6745
|
),
|
|
6570
|
-
menu2: /* @__PURE__ */ (0,
|
|
6746
|
+
menu2: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6571
6747
|
"li",
|
|
6572
6748
|
{
|
|
6573
6749
|
"data-variant": "menu2",
|
|
@@ -6578,7 +6754,7 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6578
6754
|
`,
|
|
6579
6755
|
...commonProps,
|
|
6580
6756
|
children: [
|
|
6581
|
-
/* @__PURE__ */ (0,
|
|
6757
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6582
6758
|
"span",
|
|
6583
6759
|
{
|
|
6584
6760
|
className: cn(
|
|
@@ -6588,11 +6764,11 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6588
6764
|
children
|
|
6589
6765
|
}
|
|
6590
6766
|
),
|
|
6591
|
-
selectedValue === value && /* @__PURE__ */ (0,
|
|
6767
|
+
selectedValue === value && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "h-1 w-full bg-primary-950 rounded-lg" })
|
|
6592
6768
|
]
|
|
6593
6769
|
}
|
|
6594
6770
|
),
|
|
6595
|
-
"menu-overflow": /* @__PURE__ */ (0,
|
|
6771
|
+
"menu-overflow": /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6596
6772
|
"li",
|
|
6597
6773
|
{
|
|
6598
6774
|
"data-variant": "menu-overflow",
|
|
@@ -6603,7 +6779,7 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6603
6779
|
`,
|
|
6604
6780
|
...commonProps,
|
|
6605
6781
|
children: [
|
|
6606
|
-
/* @__PURE__ */ (0,
|
|
6782
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6607
6783
|
"span",
|
|
6608
6784
|
{
|
|
6609
6785
|
className: cn(
|
|
@@ -6613,11 +6789,11 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6613
6789
|
children
|
|
6614
6790
|
}
|
|
6615
6791
|
),
|
|
6616
|
-
selectedValue === value && /* @__PURE__ */ (0,
|
|
6792
|
+
selectedValue === value && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "h-1 w-full bg-primary-950 rounded-lg" })
|
|
6617
6793
|
]
|
|
6618
6794
|
}
|
|
6619
6795
|
),
|
|
6620
|
-
breadcrumb: /* @__PURE__ */ (0,
|
|
6796
|
+
breadcrumb: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6621
6797
|
"li",
|
|
6622
6798
|
{
|
|
6623
6799
|
"data-variant": "breadcrumb",
|
|
@@ -6629,7 +6805,7 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6629
6805
|
`,
|
|
6630
6806
|
...commonProps,
|
|
6631
6807
|
children: [
|
|
6632
|
-
/* @__PURE__ */ (0,
|
|
6808
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6633
6809
|
"span",
|
|
6634
6810
|
{
|
|
6635
6811
|
className: cn(
|
|
@@ -6639,7 +6815,7 @@ var MenuItem = (0, import_react22.forwardRef)(
|
|
|
6639
6815
|
children
|
|
6640
6816
|
}
|
|
6641
6817
|
),
|
|
6642
|
-
separator && /* @__PURE__ */ (0,
|
|
6818
|
+
separator && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6643
6819
|
import_phosphor_react17.CaretRight,
|
|
6644
6820
|
{
|
|
6645
6821
|
size: 16,
|
|
@@ -6676,10 +6852,10 @@ var MenuOverflow = ({
|
|
|
6676
6852
|
onValueChange,
|
|
6677
6853
|
...props
|
|
6678
6854
|
}) => {
|
|
6679
|
-
const containerRef = (0,
|
|
6680
|
-
const [showLeftArrow, setShowLeftArrow] = (0,
|
|
6681
|
-
const [showRightArrow, setShowRightArrow] = (0,
|
|
6682
|
-
(0,
|
|
6855
|
+
const containerRef = (0, import_react23.useRef)(null);
|
|
6856
|
+
const [showLeftArrow, setShowLeftArrow] = (0, import_react23.useState)(false);
|
|
6857
|
+
const [showRightArrow, setShowRightArrow] = (0, import_react23.useState)(false);
|
|
6858
|
+
(0, import_react23.useEffect)(() => {
|
|
6683
6859
|
const checkScroll = () => internalCheckScroll(
|
|
6684
6860
|
containerRef.current,
|
|
6685
6861
|
setShowLeftArrow,
|
|
@@ -6694,25 +6870,25 @@ var MenuOverflow = ({
|
|
|
6694
6870
|
window.removeEventListener("resize", checkScroll);
|
|
6695
6871
|
};
|
|
6696
6872
|
}, []);
|
|
6697
|
-
return /* @__PURE__ */ (0,
|
|
6873
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6698
6874
|
"div",
|
|
6699
6875
|
{
|
|
6700
6876
|
"data-testid": "menu-overflow-wrapper",
|
|
6701
6877
|
className: cn("relative w-full overflow-hidden", className),
|
|
6702
6878
|
children: [
|
|
6703
|
-
showLeftArrow && /* @__PURE__ */ (0,
|
|
6879
|
+
showLeftArrow && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6704
6880
|
"button",
|
|
6705
6881
|
{
|
|
6706
6882
|
onClick: () => internalScroll(containerRef.current, "left"),
|
|
6707
6883
|
className: "absolute left-0 top-1/2 -translate-y-1/2 z-10 flex h-8 w-8 items-center justify-center rounded-full bg-white shadow-md cursor-pointer",
|
|
6708
6884
|
"data-testid": "scroll-left-button",
|
|
6709
6885
|
children: [
|
|
6710
|
-
/* @__PURE__ */ (0,
|
|
6711
|
-
/* @__PURE__ */ (0,
|
|
6886
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_phosphor_react17.CaretLeft, { size: 16 }),
|
|
6887
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "sr-only", children: "Scroll left" })
|
|
6712
6888
|
]
|
|
6713
6889
|
}
|
|
6714
6890
|
),
|
|
6715
|
-
/* @__PURE__ */ (0,
|
|
6891
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
6716
6892
|
Menu,
|
|
6717
6893
|
{
|
|
6718
6894
|
defaultValue,
|
|
@@ -6720,18 +6896,18 @@ var MenuOverflow = ({
|
|
|
6720
6896
|
value,
|
|
6721
6897
|
variant: "menu2",
|
|
6722
6898
|
...props,
|
|
6723
|
-
children: /* @__PURE__ */ (0,
|
|
6899
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(MenuContent, { ref: containerRef, variant: "menu2", children })
|
|
6724
6900
|
}
|
|
6725
6901
|
),
|
|
6726
|
-
showRightArrow && /* @__PURE__ */ (0,
|
|
6902
|
+
showRightArrow && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6727
6903
|
"button",
|
|
6728
6904
|
{
|
|
6729
6905
|
onClick: () => internalScroll(containerRef.current, "right"),
|
|
6730
6906
|
className: "absolute right-0 top-1/2 -translate-y-1/2 z-10 flex h-8 w-8 items-center justify-center rounded-full bg-white shadow-md cursor-pointer",
|
|
6731
6907
|
"data-testid": "scroll-right-button",
|
|
6732
6908
|
children: [
|
|
6733
|
-
/* @__PURE__ */ (0,
|
|
6734
|
-
/* @__PURE__ */ (0,
|
|
6909
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_phosphor_react17.CaretRight, { size: 16 }),
|
|
6910
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "sr-only", children: "Scroll right" })
|
|
6735
6911
|
]
|
|
6736
6912
|
}
|
|
6737
6913
|
)
|
|
@@ -6739,11 +6915,11 @@ var MenuOverflow = ({
|
|
|
6739
6915
|
}
|
|
6740
6916
|
);
|
|
6741
6917
|
};
|
|
6742
|
-
var injectStore5 = (children, store) =>
|
|
6743
|
-
if (!(0,
|
|
6918
|
+
var injectStore5 = (children, store) => import_react23.Children.map(children, (child) => {
|
|
6919
|
+
if (!(0, import_react23.isValidElement)(child)) return child;
|
|
6744
6920
|
const typedChild = child;
|
|
6745
6921
|
const shouldInject = typedChild.type === MenuItem;
|
|
6746
|
-
return (0,
|
|
6922
|
+
return (0, import_react23.cloneElement)(typedChild, {
|
|
6747
6923
|
...shouldInject ? { store } : {},
|
|
6748
6924
|
...typedChild.props.children ? { children: injectStore5(typedChild.props.children, store) } : {}
|
|
6749
6925
|
});
|
|
@@ -6751,8 +6927,8 @@ var injectStore5 = (children, store) => import_react22.Children.map(children, (c
|
|
|
6751
6927
|
var Menu_default = Menu;
|
|
6752
6928
|
|
|
6753
6929
|
// src/components/Skeleton/Skeleton.tsx
|
|
6754
|
-
var
|
|
6755
|
-
var
|
|
6930
|
+
var import_react24 = require("react");
|
|
6931
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
6756
6932
|
var SKELETON_ANIMATION_CLASSES = {
|
|
6757
6933
|
pulse: "animate-pulse",
|
|
6758
6934
|
none: ""
|
|
@@ -6769,7 +6945,7 @@ var SPACING_CLASSES = {
|
|
|
6769
6945
|
medium: "space-y-2",
|
|
6770
6946
|
large: "space-y-3"
|
|
6771
6947
|
};
|
|
6772
|
-
var Skeleton = (0,
|
|
6948
|
+
var Skeleton = (0, import_react24.forwardRef)(
|
|
6773
6949
|
({
|
|
6774
6950
|
variant = "text",
|
|
6775
6951
|
width,
|
|
@@ -6789,13 +6965,13 @@ var Skeleton = (0, import_react23.forwardRef)(
|
|
|
6789
6965
|
height: typeof height === "number" ? `${height}px` : height
|
|
6790
6966
|
};
|
|
6791
6967
|
if (variant === "text" && lines > 1) {
|
|
6792
|
-
return /* @__PURE__ */ (0,
|
|
6968
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6793
6969
|
"div",
|
|
6794
6970
|
{
|
|
6795
6971
|
ref,
|
|
6796
6972
|
className: cn("flex flex-col", spacingClass, className),
|
|
6797
6973
|
...props,
|
|
6798
|
-
children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0,
|
|
6974
|
+
children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6799
6975
|
"div",
|
|
6800
6976
|
{
|
|
6801
6977
|
className: cn(variantClass, animationClass),
|
|
@@ -6806,7 +6982,7 @@ var Skeleton = (0, import_react23.forwardRef)(
|
|
|
6806
6982
|
}
|
|
6807
6983
|
);
|
|
6808
6984
|
}
|
|
6809
|
-
return /* @__PURE__ */ (0,
|
|
6985
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6810
6986
|
"div",
|
|
6811
6987
|
{
|
|
6812
6988
|
ref,
|
|
@@ -6818,13 +6994,13 @@ var Skeleton = (0, import_react23.forwardRef)(
|
|
|
6818
6994
|
);
|
|
6819
6995
|
}
|
|
6820
6996
|
);
|
|
6821
|
-
var SkeletonText = (0,
|
|
6822
|
-
(props, ref) => /* @__PURE__ */ (0,
|
|
6997
|
+
var SkeletonText = (0, import_react24.forwardRef)(
|
|
6998
|
+
(props, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Skeleton, { ref, variant: "text", ...props })
|
|
6823
6999
|
);
|
|
6824
|
-
var SkeletonCircle = (0,
|
|
6825
|
-
var SkeletonRectangle = (0,
|
|
6826
|
-
var SkeletonRounded = (0,
|
|
6827
|
-
var SkeletonCard = (0,
|
|
7000
|
+
var SkeletonCircle = (0, import_react24.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Skeleton, { ref, variant: "circular", ...props }));
|
|
7001
|
+
var SkeletonRectangle = (0, import_react24.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Skeleton, { ref, variant: "rectangular", ...props }));
|
|
7002
|
+
var SkeletonRounded = (0, import_react24.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Skeleton, { ref, variant: "rounded", ...props }));
|
|
7003
|
+
var SkeletonCard = (0, import_react24.forwardRef)(
|
|
6828
7004
|
({
|
|
6829
7005
|
showAvatar = true,
|
|
6830
7006
|
showTitle = true,
|
|
@@ -6834,7 +7010,7 @@ var SkeletonCard = (0, import_react23.forwardRef)(
|
|
|
6834
7010
|
className = "",
|
|
6835
7011
|
...props
|
|
6836
7012
|
}, ref) => {
|
|
6837
|
-
return /* @__PURE__ */ (0,
|
|
7013
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
6838
7014
|
"div",
|
|
6839
7015
|
{
|
|
6840
7016
|
ref,
|
|
@@ -6844,23 +7020,23 @@ var SkeletonCard = (0, import_react23.forwardRef)(
|
|
|
6844
7020
|
),
|
|
6845
7021
|
...props,
|
|
6846
7022
|
children: [
|
|
6847
|
-
/* @__PURE__ */ (0,
|
|
6848
|
-
showAvatar && /* @__PURE__ */ (0,
|
|
6849
|
-
/* @__PURE__ */ (0,
|
|
6850
|
-
showTitle && /* @__PURE__ */ (0,
|
|
6851
|
-
showDescription && /* @__PURE__ */ (0,
|
|
7023
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-start space-x-3", children: [
|
|
7024
|
+
showAvatar && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonCircle, { width: 40, height: 40 }),
|
|
7025
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex-1 space-y-2", children: [
|
|
7026
|
+
showTitle && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonText, { width: "60%", height: 20 }),
|
|
7027
|
+
showDescription && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonText, { lines, spacing: "small" })
|
|
6852
7028
|
] })
|
|
6853
7029
|
] }),
|
|
6854
|
-
showActions && /* @__PURE__ */ (0,
|
|
6855
|
-
/* @__PURE__ */ (0,
|
|
6856
|
-
/* @__PURE__ */ (0,
|
|
7030
|
+
showActions && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex justify-end space-x-2 mt-4", children: [
|
|
7031
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonRectangle, { width: 80, height: 32 }),
|
|
7032
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonRectangle, { width: 80, height: 32 })
|
|
6857
7033
|
] })
|
|
6858
7034
|
]
|
|
6859
7035
|
}
|
|
6860
7036
|
);
|
|
6861
7037
|
}
|
|
6862
7038
|
);
|
|
6863
|
-
var SkeletonList = (0,
|
|
7039
|
+
var SkeletonList = (0, import_react24.forwardRef)(
|
|
6864
7040
|
({
|
|
6865
7041
|
items = 3,
|
|
6866
7042
|
showAvatar = true,
|
|
@@ -6870,19 +7046,19 @@ var SkeletonList = (0, import_react23.forwardRef)(
|
|
|
6870
7046
|
className = "",
|
|
6871
7047
|
...props
|
|
6872
7048
|
}, ref) => {
|
|
6873
|
-
return /* @__PURE__ */ (0,
|
|
6874
|
-
showAvatar && /* @__PURE__ */ (0,
|
|
6875
|
-
/* @__PURE__ */ (0,
|
|
6876
|
-
showTitle && /* @__PURE__ */ (0,
|
|
6877
|
-
showDescription && /* @__PURE__ */ (0,
|
|
7049
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { ref, className: cn("space-y-3", className), ...props, children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-start space-x-3 p-3", children: [
|
|
7050
|
+
showAvatar && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonCircle, { width: 32, height: 32 }),
|
|
7051
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex-1 space-y-2", children: [
|
|
7052
|
+
showTitle && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonText, { width: "40%", height: 16 }),
|
|
7053
|
+
showDescription && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(SkeletonText, { lines, spacing: "small" })
|
|
6878
7054
|
] })
|
|
6879
7055
|
] }, index)) });
|
|
6880
7056
|
}
|
|
6881
7057
|
);
|
|
6882
|
-
var SkeletonTable = (0,
|
|
7058
|
+
var SkeletonTable = (0, import_react24.forwardRef)(
|
|
6883
7059
|
({ rows = 5, columns = 4, showHeader = true, className = "", ...props }, ref) => {
|
|
6884
|
-
return /* @__PURE__ */ (0,
|
|
6885
|
-
showHeader && /* @__PURE__ */ (0,
|
|
7060
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { ref, className: cn("w-full", className), ...props, children: [
|
|
7061
|
+
showHeader && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex space-x-2 mb-3", children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6886
7062
|
SkeletonText,
|
|
6887
7063
|
{
|
|
6888
7064
|
width: `${100 / columns}%`,
|
|
@@ -6890,7 +7066,7 @@ var SkeletonTable = (0, import_react23.forwardRef)(
|
|
|
6890
7066
|
},
|
|
6891
7067
|
index
|
|
6892
7068
|
)) }),
|
|
6893
|
-
/* @__PURE__ */ (0,
|
|
7069
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "space-y-2", children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex space-x-2", children: Array.from({ length: columns }, (_2, colIndex) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
6894
7070
|
SkeletonText,
|
|
6895
7071
|
{
|
|
6896
7072
|
width: `${100 / columns}%`,
|
|
@@ -6903,7 +7079,7 @@ var SkeletonTable = (0, import_react23.forwardRef)(
|
|
|
6903
7079
|
);
|
|
6904
7080
|
|
|
6905
7081
|
// src/components/NotFound/NotFound.tsx
|
|
6906
|
-
var
|
|
7082
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
6907
7083
|
var NotFound = ({
|
|
6908
7084
|
title,
|
|
6909
7085
|
description,
|
|
@@ -6946,22 +7122,22 @@ var NotFound = ({
|
|
|
6946
7122
|
const errorTitle = title || getDefaultTitle();
|
|
6947
7123
|
const errorDescription = description || getDefaultDescription();
|
|
6948
7124
|
const errorCode = getErrorCode();
|
|
6949
|
-
return /* @__PURE__ */ (0,
|
|
7125
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
6950
7126
|
"div",
|
|
6951
7127
|
{
|
|
6952
7128
|
className: cn(
|
|
6953
7129
|
"flex flex-col w-full h-screen items-center justify-center bg-background-50 px-4",
|
|
6954
7130
|
className
|
|
6955
7131
|
),
|
|
6956
|
-
children: /* @__PURE__ */ (0,
|
|
7132
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
6957
7133
|
"main",
|
|
6958
7134
|
{
|
|
6959
7135
|
role: "main",
|
|
6960
7136
|
"aria-labelledby": "error-title",
|
|
6961
7137
|
"aria-describedby": "error-description",
|
|
6962
7138
|
className: "flex flex-col items-center text-center max-w-md space-y-6",
|
|
6963
|
-
children: /* @__PURE__ */ (0,
|
|
6964
|
-
/* @__PURE__ */ (0,
|
|
7139
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("section", { "aria-label": `Erro ${errorCode}`, children: [
|
|
7140
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
6965
7141
|
"div",
|
|
6966
7142
|
{
|
|
6967
7143
|
className: "text-8xl font-bold text-primary-300 select-none",
|
|
@@ -6969,8 +7145,8 @@ var NotFound = ({
|
|
|
6969
7145
|
children: errorCode
|
|
6970
7146
|
}
|
|
6971
7147
|
),
|
|
6972
|
-
/* @__PURE__ */ (0,
|
|
6973
|
-
/* @__PURE__ */ (0,
|
|
7148
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("header", { className: "space-y-2", children: [
|
|
7149
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
6974
7150
|
Text_default,
|
|
6975
7151
|
{
|
|
6976
7152
|
size: "xl",
|
|
@@ -6981,9 +7157,9 @@ var NotFound = ({
|
|
|
6981
7157
|
children: errorTitle
|
|
6982
7158
|
}
|
|
6983
7159
|
),
|
|
6984
|
-
/* @__PURE__ */ (0,
|
|
7160
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Text_default, { size: "md", className: "text-text-600", id: "error-description", children: errorDescription })
|
|
6985
7161
|
] }),
|
|
6986
|
-
onButtonClick && /* @__PURE__ */ (0,
|
|
7162
|
+
onButtonClick && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("nav", { "aria-label": "Navega\xE7\xE3o de erro", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
6987
7163
|
Button_default,
|
|
6988
7164
|
{
|
|
6989
7165
|
onClick: handleButtonClick,
|
|
@@ -7004,9 +7180,9 @@ var NotFound = ({
|
|
|
7004
7180
|
var NotFound_default = NotFound;
|
|
7005
7181
|
|
|
7006
7182
|
// src/components/VideoPlayer/VideoPlayer.tsx
|
|
7007
|
-
var
|
|
7183
|
+
var import_react25 = require("react");
|
|
7008
7184
|
var import_phosphor_react18 = require("phosphor-react");
|
|
7009
|
-
var
|
|
7185
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
7010
7186
|
var CONTROLS_HIDE_TIMEOUT = 3e3;
|
|
7011
7187
|
var LEAVE_HIDE_TIMEOUT = 1e3;
|
|
7012
7188
|
var INIT_DELAY = 100;
|
|
@@ -7021,7 +7197,7 @@ var ProgressBar2 = ({
|
|
|
7021
7197
|
duration,
|
|
7022
7198
|
progressPercentage,
|
|
7023
7199
|
onSeek
|
|
7024
|
-
}) => /* @__PURE__ */ (0,
|
|
7200
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "px-4 pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7025
7201
|
"input",
|
|
7026
7202
|
{
|
|
7027
7203
|
type: "range",
|
|
@@ -7041,17 +7217,17 @@ var VolumeControls = ({
|
|
|
7041
7217
|
isMuted,
|
|
7042
7218
|
onVolumeChange,
|
|
7043
7219
|
onToggleMute
|
|
7044
|
-
}) => /* @__PURE__ */ (0,
|
|
7045
|
-
/* @__PURE__ */ (0,
|
|
7220
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
7221
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7046
7222
|
IconButton_default,
|
|
7047
7223
|
{
|
|
7048
|
-
icon: isMuted ? /* @__PURE__ */ (0,
|
|
7224
|
+
icon: isMuted ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.SpeakerSlash, { size: 24 }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.SpeakerHigh, { size: 24 }),
|
|
7049
7225
|
onClick: onToggleMute,
|
|
7050
7226
|
"aria-label": isMuted ? "Unmute" : "Mute",
|
|
7051
7227
|
className: "!bg-transparent !text-white hover:!bg-white/20"
|
|
7052
7228
|
}
|
|
7053
7229
|
),
|
|
7054
|
-
/* @__PURE__ */ (0,
|
|
7230
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7055
7231
|
"input",
|
|
7056
7232
|
{
|
|
7057
7233
|
type: "range",
|
|
@@ -7072,17 +7248,17 @@ var SpeedMenu = ({
|
|
|
7072
7248
|
playbackRate,
|
|
7073
7249
|
onToggleMenu,
|
|
7074
7250
|
onSpeedChange
|
|
7075
|
-
}) => /* @__PURE__ */ (0,
|
|
7076
|
-
/* @__PURE__ */ (0,
|
|
7251
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "relative", children: [
|
|
7252
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7077
7253
|
IconButton_default,
|
|
7078
7254
|
{
|
|
7079
|
-
icon: /* @__PURE__ */ (0,
|
|
7255
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.DotsThreeVertical, { size: 24 }),
|
|
7080
7256
|
onClick: onToggleMenu,
|
|
7081
7257
|
"aria-label": "Playback speed",
|
|
7082
7258
|
className: "!bg-transparent !text-white hover:!bg-white/20"
|
|
7083
7259
|
}
|
|
7084
7260
|
),
|
|
7085
|
-
showSpeedMenu && /* @__PURE__ */ (0,
|
|
7261
|
+
showSpeedMenu && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "absolute bottom-12 right-0 bg-black/90 rounded-lg p-2 min-w-20", children: [0.5, 0.75, 1, 1.25, 1.5, 2].map((speed) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
7086
7262
|
"button",
|
|
7087
7263
|
{
|
|
7088
7264
|
onClick: () => onSpeedChange(speed),
|
|
@@ -7109,26 +7285,26 @@ var VideoPlayer = ({
|
|
|
7109
7285
|
autoSave = true,
|
|
7110
7286
|
storageKey = "video-progress"
|
|
7111
7287
|
}) => {
|
|
7112
|
-
const videoRef = (0,
|
|
7113
|
-
const [isPlaying, setIsPlaying] = (0,
|
|
7114
|
-
const [currentTime, setCurrentTime] = (0,
|
|
7115
|
-
const [duration, setDuration] = (0,
|
|
7116
|
-
const [isMuted, setIsMuted] = (0,
|
|
7117
|
-
const [volume, setVolume] = (0,
|
|
7118
|
-
const [isFullscreen, setIsFullscreen] = (0,
|
|
7119
|
-
const [showControls, setShowControls] = (0,
|
|
7120
|
-
const [hasCompleted, setHasCompleted] = (0,
|
|
7121
|
-
const [showCaptions, setShowCaptions] = (0,
|
|
7122
|
-
(0,
|
|
7288
|
+
const videoRef = (0, import_react25.useRef)(null);
|
|
7289
|
+
const [isPlaying, setIsPlaying] = (0, import_react25.useState)(false);
|
|
7290
|
+
const [currentTime, setCurrentTime] = (0, import_react25.useState)(0);
|
|
7291
|
+
const [duration, setDuration] = (0, import_react25.useState)(0);
|
|
7292
|
+
const [isMuted, setIsMuted] = (0, import_react25.useState)(false);
|
|
7293
|
+
const [volume, setVolume] = (0, import_react25.useState)(1);
|
|
7294
|
+
const [isFullscreen, setIsFullscreen] = (0, import_react25.useState)(false);
|
|
7295
|
+
const [showControls, setShowControls] = (0, import_react25.useState)(true);
|
|
7296
|
+
const [hasCompleted, setHasCompleted] = (0, import_react25.useState)(false);
|
|
7297
|
+
const [showCaptions, setShowCaptions] = (0, import_react25.useState)(false);
|
|
7298
|
+
(0, import_react25.useEffect)(() => {
|
|
7123
7299
|
setHasCompleted(false);
|
|
7124
7300
|
}, [src]);
|
|
7125
|
-
const [playbackRate, setPlaybackRate] = (0,
|
|
7126
|
-
const [showSpeedMenu, setShowSpeedMenu] = (0,
|
|
7127
|
-
const lastSaveTimeRef = (0,
|
|
7128
|
-
const trackRef = (0,
|
|
7129
|
-
const controlsTimeoutRef = (0,
|
|
7130
|
-
const lastMousePositionRef = (0,
|
|
7131
|
-
const isUserInteracting = (0,
|
|
7301
|
+
const [playbackRate, setPlaybackRate] = (0, import_react25.useState)(1);
|
|
7302
|
+
const [showSpeedMenu, setShowSpeedMenu] = (0, import_react25.useState)(false);
|
|
7303
|
+
const lastSaveTimeRef = (0, import_react25.useRef)(0);
|
|
7304
|
+
const trackRef = (0, import_react25.useRef)(null);
|
|
7305
|
+
const controlsTimeoutRef = (0, import_react25.useRef)(null);
|
|
7306
|
+
const lastMousePositionRef = (0, import_react25.useRef)({ x: 0, y: 0 });
|
|
7307
|
+
const isUserInteracting = (0, import_react25.useCallback)(() => {
|
|
7132
7308
|
if (showSpeedMenu) {
|
|
7133
7309
|
return true;
|
|
7134
7310
|
}
|
|
@@ -7145,13 +7321,13 @@ var VideoPlayer = ({
|
|
|
7145
7321
|
}
|
|
7146
7322
|
return false;
|
|
7147
7323
|
}, [showSpeedMenu]);
|
|
7148
|
-
const clearControlsTimeout = (0,
|
|
7324
|
+
const clearControlsTimeout = (0, import_react25.useCallback)(() => {
|
|
7149
7325
|
if (controlsTimeoutRef.current) {
|
|
7150
7326
|
clearTimeout(controlsTimeoutRef.current);
|
|
7151
7327
|
controlsTimeoutRef.current = null;
|
|
7152
7328
|
}
|
|
7153
7329
|
}, []);
|
|
7154
|
-
const showControlsWithTimer = (0,
|
|
7330
|
+
const showControlsWithTimer = (0, import_react25.useCallback)(() => {
|
|
7155
7331
|
setShowControls(true);
|
|
7156
7332
|
clearControlsTimeout();
|
|
7157
7333
|
if (isFullscreen) {
|
|
@@ -7166,7 +7342,7 @@ var VideoPlayer = ({
|
|
|
7166
7342
|
}, CONTROLS_HIDE_TIMEOUT);
|
|
7167
7343
|
}
|
|
7168
7344
|
}, [isFullscreen, isPlaying, clearControlsTimeout]);
|
|
7169
|
-
const handleMouseMove = (0,
|
|
7345
|
+
const handleMouseMove = (0, import_react25.useCallback)(
|
|
7170
7346
|
(event) => {
|
|
7171
7347
|
const currentX = event.clientX;
|
|
7172
7348
|
const currentY = event.clientY;
|
|
@@ -7179,10 +7355,10 @@ var VideoPlayer = ({
|
|
|
7179
7355
|
},
|
|
7180
7356
|
[showControlsWithTimer]
|
|
7181
7357
|
);
|
|
7182
|
-
const handleMouseEnter = (0,
|
|
7358
|
+
const handleMouseEnter = (0, import_react25.useCallback)(() => {
|
|
7183
7359
|
showControlsWithTimer();
|
|
7184
7360
|
}, [showControlsWithTimer]);
|
|
7185
|
-
const handleMouseLeave = (0,
|
|
7361
|
+
const handleMouseLeave = (0, import_react25.useCallback)(() => {
|
|
7186
7362
|
const userInteracting = isUserInteracting();
|
|
7187
7363
|
clearControlsTimeout();
|
|
7188
7364
|
if (!isFullscreen && !userInteracting) {
|
|
@@ -7191,13 +7367,13 @@ var VideoPlayer = ({
|
|
|
7191
7367
|
}, LEAVE_HIDE_TIMEOUT);
|
|
7192
7368
|
}
|
|
7193
7369
|
}, [isFullscreen, clearControlsTimeout, isUserInteracting]);
|
|
7194
|
-
(0,
|
|
7370
|
+
(0, import_react25.useEffect)(() => {
|
|
7195
7371
|
if (videoRef.current) {
|
|
7196
7372
|
videoRef.current.volume = volume;
|
|
7197
7373
|
videoRef.current.muted = isMuted;
|
|
7198
7374
|
}
|
|
7199
7375
|
}, [volume, isMuted]);
|
|
7200
|
-
(0,
|
|
7376
|
+
(0, import_react25.useEffect)(() => {
|
|
7201
7377
|
const video = videoRef.current;
|
|
7202
7378
|
if (!video) return;
|
|
7203
7379
|
const onPlay = () => setIsPlaying(true);
|
|
@@ -7212,7 +7388,7 @@ var VideoPlayer = ({
|
|
|
7212
7388
|
video.removeEventListener("ended", onEnded);
|
|
7213
7389
|
};
|
|
7214
7390
|
}, []);
|
|
7215
|
-
(0,
|
|
7391
|
+
(0, import_react25.useEffect)(() => {
|
|
7216
7392
|
if (isPlaying) {
|
|
7217
7393
|
showControlsWithTimer();
|
|
7218
7394
|
} else {
|
|
@@ -7224,7 +7400,7 @@ var VideoPlayer = ({
|
|
|
7224
7400
|
}
|
|
7225
7401
|
}
|
|
7226
7402
|
}, [isPlaying, isFullscreen, showControlsWithTimer, clearControlsTimeout]);
|
|
7227
|
-
(0,
|
|
7403
|
+
(0, import_react25.useEffect)(() => {
|
|
7228
7404
|
const handleFullscreenChange = () => {
|
|
7229
7405
|
const isCurrentlyFullscreen = !!document.fullscreenElement;
|
|
7230
7406
|
setIsFullscreen(isCurrentlyFullscreen);
|
|
@@ -7237,7 +7413,7 @@ var VideoPlayer = ({
|
|
|
7237
7413
|
document.removeEventListener("fullscreenchange", handleFullscreenChange);
|
|
7238
7414
|
};
|
|
7239
7415
|
}, [showControlsWithTimer]);
|
|
7240
|
-
(0,
|
|
7416
|
+
(0, import_react25.useEffect)(() => {
|
|
7241
7417
|
const init = () => {
|
|
7242
7418
|
if (!isFullscreen) {
|
|
7243
7419
|
showControlsWithTimer();
|
|
@@ -7259,7 +7435,7 @@ var VideoPlayer = ({
|
|
|
7259
7435
|
};
|
|
7260
7436
|
}
|
|
7261
7437
|
}, []);
|
|
7262
|
-
const getInitialTime = (0,
|
|
7438
|
+
const getInitialTime = (0, import_react25.useCallback)(() => {
|
|
7263
7439
|
if (!autoSave || !storageKey) {
|
|
7264
7440
|
return Number.isFinite(initialTime) && initialTime >= 0 ? initialTime : void 0;
|
|
7265
7441
|
}
|
|
@@ -7270,14 +7446,14 @@ var VideoPlayer = ({
|
|
|
7270
7446
|
if (hasValidSaved) return saved;
|
|
7271
7447
|
return void 0;
|
|
7272
7448
|
}, [autoSave, storageKey, src, initialTime]);
|
|
7273
|
-
(0,
|
|
7449
|
+
(0, import_react25.useEffect)(() => {
|
|
7274
7450
|
const start = getInitialTime();
|
|
7275
7451
|
if (start !== void 0 && videoRef.current) {
|
|
7276
7452
|
videoRef.current.currentTime = start;
|
|
7277
7453
|
setCurrentTime(start);
|
|
7278
7454
|
}
|
|
7279
7455
|
}, [getInitialTime]);
|
|
7280
|
-
const saveProgress = (0,
|
|
7456
|
+
const saveProgress = (0, import_react25.useCallback)(
|
|
7281
7457
|
(time) => {
|
|
7282
7458
|
if (!autoSave || !storageKey) return;
|
|
7283
7459
|
const now = Date.now();
|
|
@@ -7288,7 +7464,7 @@ var VideoPlayer = ({
|
|
|
7288
7464
|
},
|
|
7289
7465
|
[autoSave, storageKey, src]
|
|
7290
7466
|
);
|
|
7291
|
-
const togglePlayPause = (0,
|
|
7467
|
+
const togglePlayPause = (0, import_react25.useCallback)(async () => {
|
|
7292
7468
|
const video = videoRef.current;
|
|
7293
7469
|
if (!video) return;
|
|
7294
7470
|
if (!video.paused) {
|
|
@@ -7300,7 +7476,7 @@ var VideoPlayer = ({
|
|
|
7300
7476
|
} catch {
|
|
7301
7477
|
}
|
|
7302
7478
|
}, []);
|
|
7303
|
-
const handleVolumeChange = (0,
|
|
7479
|
+
const handleVolumeChange = (0, import_react25.useCallback)(
|
|
7304
7480
|
(newVolume) => {
|
|
7305
7481
|
const video = videoRef.current;
|
|
7306
7482
|
if (!video) return;
|
|
@@ -7319,7 +7495,7 @@ var VideoPlayer = ({
|
|
|
7319
7495
|
},
|
|
7320
7496
|
[isMuted]
|
|
7321
7497
|
);
|
|
7322
|
-
const toggleMute = (0,
|
|
7498
|
+
const toggleMute = (0, import_react25.useCallback)(() => {
|
|
7323
7499
|
const video = videoRef.current;
|
|
7324
7500
|
if (!video) return;
|
|
7325
7501
|
if (isMuted) {
|
|
@@ -7333,13 +7509,13 @@ var VideoPlayer = ({
|
|
|
7333
7509
|
setIsMuted(true);
|
|
7334
7510
|
}
|
|
7335
7511
|
}, [isMuted, volume]);
|
|
7336
|
-
const handleSeek = (0,
|
|
7512
|
+
const handleSeek = (0, import_react25.useCallback)((newTime) => {
|
|
7337
7513
|
const video = videoRef.current;
|
|
7338
7514
|
if (video) {
|
|
7339
7515
|
video.currentTime = newTime;
|
|
7340
7516
|
}
|
|
7341
7517
|
}, []);
|
|
7342
|
-
const toggleFullscreen = (0,
|
|
7518
|
+
const toggleFullscreen = (0, import_react25.useCallback)(() => {
|
|
7343
7519
|
const container = videoRef.current?.parentElement;
|
|
7344
7520
|
if (!container) return;
|
|
7345
7521
|
if (!isFullscreen && container.requestFullscreen) {
|
|
@@ -7348,23 +7524,23 @@ var VideoPlayer = ({
|
|
|
7348
7524
|
document.exitFullscreen();
|
|
7349
7525
|
}
|
|
7350
7526
|
}, [isFullscreen]);
|
|
7351
|
-
const handleSpeedChange = (0,
|
|
7527
|
+
const handleSpeedChange = (0, import_react25.useCallback)((speed) => {
|
|
7352
7528
|
if (videoRef.current) {
|
|
7353
7529
|
videoRef.current.playbackRate = speed;
|
|
7354
7530
|
setPlaybackRate(speed);
|
|
7355
7531
|
setShowSpeedMenu(false);
|
|
7356
7532
|
}
|
|
7357
7533
|
}, []);
|
|
7358
|
-
const toggleSpeedMenu = (0,
|
|
7534
|
+
const toggleSpeedMenu = (0, import_react25.useCallback)(() => {
|
|
7359
7535
|
setShowSpeedMenu(!showSpeedMenu);
|
|
7360
7536
|
}, [showSpeedMenu]);
|
|
7361
|
-
const toggleCaptions = (0,
|
|
7537
|
+
const toggleCaptions = (0, import_react25.useCallback)(() => {
|
|
7362
7538
|
if (!trackRef.current?.track || !subtitles) return;
|
|
7363
7539
|
const newShowCaptions = !showCaptions;
|
|
7364
7540
|
setShowCaptions(newShowCaptions);
|
|
7365
7541
|
trackRef.current.track.mode = newShowCaptions && subtitles ? "showing" : "hidden";
|
|
7366
7542
|
}, [showCaptions, subtitles]);
|
|
7367
|
-
const checkVideoCompletion = (0,
|
|
7543
|
+
const checkVideoCompletion = (0, import_react25.useCallback)(
|
|
7368
7544
|
(progressPercent) => {
|
|
7369
7545
|
if (progressPercent >= 95 && !hasCompleted) {
|
|
7370
7546
|
setHasCompleted(true);
|
|
@@ -7373,7 +7549,7 @@ var VideoPlayer = ({
|
|
|
7373
7549
|
},
|
|
7374
7550
|
[hasCompleted, onVideoComplete]
|
|
7375
7551
|
);
|
|
7376
|
-
const handleTimeUpdate = (0,
|
|
7552
|
+
const handleTimeUpdate = (0, import_react25.useCallback)(() => {
|
|
7377
7553
|
const video = videoRef.current;
|
|
7378
7554
|
if (!video) return;
|
|
7379
7555
|
const current = video.currentTime;
|
|
@@ -7386,17 +7562,17 @@ var VideoPlayer = ({
|
|
|
7386
7562
|
checkVideoCompletion(progressPercent);
|
|
7387
7563
|
}
|
|
7388
7564
|
}, [duration, saveProgress, onTimeUpdate, onProgress, checkVideoCompletion]);
|
|
7389
|
-
const handleLoadedMetadata = (0,
|
|
7565
|
+
const handleLoadedMetadata = (0, import_react25.useCallback)(() => {
|
|
7390
7566
|
if (videoRef.current) {
|
|
7391
7567
|
setDuration(videoRef.current.duration);
|
|
7392
7568
|
}
|
|
7393
7569
|
}, []);
|
|
7394
|
-
(0,
|
|
7570
|
+
(0, import_react25.useEffect)(() => {
|
|
7395
7571
|
if (trackRef.current?.track) {
|
|
7396
7572
|
trackRef.current.track.mode = showCaptions && subtitles ? "showing" : "hidden";
|
|
7397
7573
|
}
|
|
7398
7574
|
}, [subtitles, showCaptions]);
|
|
7399
|
-
(0,
|
|
7575
|
+
(0, import_react25.useEffect)(() => {
|
|
7400
7576
|
const handleVisibilityChange = () => {
|
|
7401
7577
|
if (document.hidden && isPlaying && videoRef.current) {
|
|
7402
7578
|
videoRef.current.pause();
|
|
@@ -7418,13 +7594,13 @@ var VideoPlayer = ({
|
|
|
7418
7594
|
};
|
|
7419
7595
|
}, [isPlaying, clearControlsTimeout]);
|
|
7420
7596
|
const progressPercentage = duration > 0 ? currentTime / duration * 100 : 0;
|
|
7421
|
-
const getTopControlsOpacity = (0,
|
|
7597
|
+
const getTopControlsOpacity = (0, import_react25.useCallback)(() => {
|
|
7422
7598
|
return showControls ? "opacity-100" : "opacity-0";
|
|
7423
7599
|
}, [showControls]);
|
|
7424
|
-
const getBottomControlsOpacity = (0,
|
|
7600
|
+
const getBottomControlsOpacity = (0, import_react25.useCallback)(() => {
|
|
7425
7601
|
return showControls ? "opacity-100" : "opacity-0";
|
|
7426
7602
|
}, [showControls]);
|
|
7427
|
-
const handleVideoKeyDown = (0,
|
|
7603
|
+
const handleVideoKeyDown = (0, import_react25.useCallback)(
|
|
7428
7604
|
(e) => {
|
|
7429
7605
|
if (e.key) {
|
|
7430
7606
|
e.stopPropagation();
|
|
@@ -7479,9 +7655,9 @@ var VideoPlayer = ({
|
|
|
7479
7655
|
toggleFullscreen
|
|
7480
7656
|
]
|
|
7481
7657
|
);
|
|
7482
|
-
return /* @__PURE__ */ (0,
|
|
7483
|
-
(title || subtitleText) && /* @__PURE__ */ (0,
|
|
7484
|
-
title && /* @__PURE__ */ (0,
|
|
7658
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: cn("flex flex-col", className), children: [
|
|
7659
|
+
(title || subtitleText) && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "bg-subject-1 px-8 py-4 flex items-end justify-between min-h-20", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col gap-1", children: [
|
|
7660
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7485
7661
|
Text_default,
|
|
7486
7662
|
{
|
|
7487
7663
|
as: "h2",
|
|
@@ -7492,7 +7668,7 @@ var VideoPlayer = ({
|
|
|
7492
7668
|
children: title
|
|
7493
7669
|
}
|
|
7494
7670
|
),
|
|
7495
|
-
subtitleText && /* @__PURE__ */ (0,
|
|
7671
|
+
subtitleText && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7496
7672
|
Text_default,
|
|
7497
7673
|
{
|
|
7498
7674
|
as: "p",
|
|
@@ -7504,7 +7680,7 @@ var VideoPlayer = ({
|
|
|
7504
7680
|
}
|
|
7505
7681
|
)
|
|
7506
7682
|
] }) }),
|
|
7507
|
-
/* @__PURE__ */ (0,
|
|
7683
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
7508
7684
|
"section",
|
|
7509
7685
|
{
|
|
7510
7686
|
className: cn(
|
|
@@ -7519,7 +7695,7 @@ var VideoPlayer = ({
|
|
|
7519
7695
|
onTouchStart: handleMouseEnter,
|
|
7520
7696
|
onMouseLeave: handleMouseLeave,
|
|
7521
7697
|
children: [
|
|
7522
|
-
/* @__PURE__ */ (0,
|
|
7698
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7523
7699
|
"video",
|
|
7524
7700
|
{
|
|
7525
7701
|
ref: videoRef,
|
|
@@ -7533,7 +7709,7 @@ var VideoPlayer = ({
|
|
|
7533
7709
|
onKeyDown: handleVideoKeyDown,
|
|
7534
7710
|
tabIndex: 0,
|
|
7535
7711
|
"aria-label": title ? `Video: ${title}` : "Video player",
|
|
7536
|
-
children: /* @__PURE__ */ (0,
|
|
7712
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7537
7713
|
"track",
|
|
7538
7714
|
{
|
|
7539
7715
|
ref: trackRef,
|
|
@@ -7546,26 +7722,26 @@ var VideoPlayer = ({
|
|
|
7546
7722
|
)
|
|
7547
7723
|
}
|
|
7548
7724
|
),
|
|
7549
|
-
!isPlaying && /* @__PURE__ */ (0,
|
|
7725
|
+
!isPlaying && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-black/30 transition-opacity", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7550
7726
|
IconButton_default,
|
|
7551
7727
|
{
|
|
7552
|
-
icon: /* @__PURE__ */ (0,
|
|
7728
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.Play, { size: 32, weight: "regular", className: "ml-1" }),
|
|
7553
7729
|
onClick: togglePlayPause,
|
|
7554
7730
|
"aria-label": "Play video",
|
|
7555
7731
|
className: "!bg-transparent !text-white !w-auto !h-auto hover:!bg-transparent hover:!text-gray-200"
|
|
7556
7732
|
}
|
|
7557
7733
|
) }),
|
|
7558
|
-
/* @__PURE__ */ (0,
|
|
7734
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7559
7735
|
"div",
|
|
7560
7736
|
{
|
|
7561
7737
|
className: cn(
|
|
7562
7738
|
"absolute top-0 left-0 right-0 p-4 bg-gradient-to-b from-black/70 to-transparent transition-opacity",
|
|
7563
7739
|
getTopControlsOpacity()
|
|
7564
7740
|
),
|
|
7565
|
-
children: /* @__PURE__ */ (0,
|
|
7741
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex justify-start", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7566
7742
|
IconButton_default,
|
|
7567
7743
|
{
|
|
7568
|
-
icon: isFullscreen ? /* @__PURE__ */ (0,
|
|
7744
|
+
icon: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.ArrowsInSimple, { size: 24 }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.ArrowsOutSimple, { size: 24 }),
|
|
7569
7745
|
onClick: toggleFullscreen,
|
|
7570
7746
|
"aria-label": isFullscreen ? "Exit fullscreen" : "Enter fullscreen",
|
|
7571
7747
|
className: "!bg-transparent !text-white hover:!bg-white/20"
|
|
@@ -7573,7 +7749,7 @@ var VideoPlayer = ({
|
|
|
7573
7749
|
) })
|
|
7574
7750
|
}
|
|
7575
7751
|
),
|
|
7576
|
-
/* @__PURE__ */ (0,
|
|
7752
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
7577
7753
|
"div",
|
|
7578
7754
|
{
|
|
7579
7755
|
className: cn(
|
|
@@ -7581,7 +7757,7 @@ var VideoPlayer = ({
|
|
|
7581
7757
|
getBottomControlsOpacity()
|
|
7582
7758
|
),
|
|
7583
7759
|
children: [
|
|
7584
|
-
/* @__PURE__ */ (0,
|
|
7760
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7585
7761
|
ProgressBar2,
|
|
7586
7762
|
{
|
|
7587
7763
|
currentTime,
|
|
@@ -7590,18 +7766,18 @@ var VideoPlayer = ({
|
|
|
7590
7766
|
onSeek: handleSeek
|
|
7591
7767
|
}
|
|
7592
7768
|
),
|
|
7593
|
-
/* @__PURE__ */ (0,
|
|
7594
|
-
/* @__PURE__ */ (0,
|
|
7595
|
-
/* @__PURE__ */ (0,
|
|
7769
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center justify-between px-4 pb-4", children: [
|
|
7770
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex items-center gap-4", children: [
|
|
7771
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7596
7772
|
IconButton_default,
|
|
7597
7773
|
{
|
|
7598
|
-
icon: isPlaying ? /* @__PURE__ */ (0,
|
|
7774
|
+
icon: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.Pause, { size: 24 }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.Play, { size: 24 }),
|
|
7599
7775
|
onClick: togglePlayPause,
|
|
7600
7776
|
"aria-label": isPlaying ? "Pause" : "Play",
|
|
7601
7777
|
className: "!bg-transparent !text-white hover:!bg-white/20"
|
|
7602
7778
|
}
|
|
7603
7779
|
),
|
|
7604
|
-
/* @__PURE__ */ (0,
|
|
7780
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7605
7781
|
VolumeControls,
|
|
7606
7782
|
{
|
|
7607
7783
|
volume,
|
|
@@ -7610,10 +7786,10 @@ var VideoPlayer = ({
|
|
|
7610
7786
|
onToggleMute: toggleMute
|
|
7611
7787
|
}
|
|
7612
7788
|
),
|
|
7613
|
-
subtitles && /* @__PURE__ */ (0,
|
|
7789
|
+
subtitles && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7614
7790
|
IconButton_default,
|
|
7615
7791
|
{
|
|
7616
|
-
icon: /* @__PURE__ */ (0,
|
|
7792
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_phosphor_react18.ClosedCaptioning, { size: 24 }),
|
|
7617
7793
|
onClick: toggleCaptions,
|
|
7618
7794
|
"aria-label": showCaptions ? "Hide captions" : "Show captions",
|
|
7619
7795
|
className: cn(
|
|
@@ -7622,13 +7798,13 @@ var VideoPlayer = ({
|
|
|
7622
7798
|
)
|
|
7623
7799
|
}
|
|
7624
7800
|
),
|
|
7625
|
-
/* @__PURE__ */ (0,
|
|
7801
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(Text_default, { size: "sm", weight: "medium", color: "text-white", children: [
|
|
7626
7802
|
formatTime(currentTime),
|
|
7627
7803
|
" / ",
|
|
7628
7804
|
formatTime(duration)
|
|
7629
7805
|
] })
|
|
7630
7806
|
] }),
|
|
7631
|
-
/* @__PURE__ */ (0,
|
|
7807
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7632
7808
|
SpeedMenu,
|
|
7633
7809
|
{
|
|
7634
7810
|
showSpeedMenu,
|
|
@@ -7649,9 +7825,9 @@ var VideoPlayer = ({
|
|
|
7649
7825
|
var VideoPlayer_default = VideoPlayer;
|
|
7650
7826
|
|
|
7651
7827
|
// src/components/Whiteboard/Whiteboard.tsx
|
|
7652
|
-
var
|
|
7828
|
+
var import_react26 = require("react");
|
|
7653
7829
|
var import_phosphor_react19 = require("phosphor-react");
|
|
7654
|
-
var
|
|
7830
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
7655
7831
|
var IMAGE_WIDTH = 225;
|
|
7656
7832
|
var IMAGE_HEIGHT = 90;
|
|
7657
7833
|
var Whiteboard = ({
|
|
@@ -7662,8 +7838,8 @@ var Whiteboard = ({
|
|
|
7662
7838
|
imagesPerRow = 2,
|
|
7663
7839
|
...rest
|
|
7664
7840
|
}) => {
|
|
7665
|
-
const [imageErrors, setImageErrors] = (0,
|
|
7666
|
-
const handleDownload = (0,
|
|
7841
|
+
const [imageErrors, setImageErrors] = (0, import_react26.useState)(/* @__PURE__ */ new Set());
|
|
7842
|
+
const handleDownload = (0, import_react26.useCallback)(
|
|
7667
7843
|
(image) => {
|
|
7668
7844
|
if (onDownload) {
|
|
7669
7845
|
onDownload(image);
|
|
@@ -7680,7 +7856,7 @@ var Whiteboard = ({
|
|
|
7680
7856
|
},
|
|
7681
7857
|
[onDownload]
|
|
7682
7858
|
);
|
|
7683
|
-
const handleImageError = (0,
|
|
7859
|
+
const handleImageError = (0, import_react26.useCallback)((imageId) => {
|
|
7684
7860
|
setImageErrors((prev) => new Set(prev).add(imageId));
|
|
7685
7861
|
}, []);
|
|
7686
7862
|
const gridColsClass = images?.length === 1 ? "grid-cols-1" : {
|
|
@@ -7689,7 +7865,7 @@ var Whiteboard = ({
|
|
|
7689
7865
|
4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
|
|
7690
7866
|
}[imagesPerRow];
|
|
7691
7867
|
if (!images || images.length === 0) {
|
|
7692
|
-
return /* @__PURE__ */ (0,
|
|
7868
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7693
7869
|
"div",
|
|
7694
7870
|
{
|
|
7695
7871
|
className: cn(
|
|
@@ -7697,11 +7873,11 @@ var Whiteboard = ({
|
|
|
7697
7873
|
className
|
|
7698
7874
|
),
|
|
7699
7875
|
...rest,
|
|
7700
|
-
children: /* @__PURE__ */ (0,
|
|
7876
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "text-gray-400 text-sm", children: "Nenhuma imagem dispon\xEDvel" })
|
|
7701
7877
|
}
|
|
7702
7878
|
);
|
|
7703
7879
|
}
|
|
7704
|
-
return /* @__PURE__ */ (0,
|
|
7880
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7705
7881
|
"div",
|
|
7706
7882
|
{
|
|
7707
7883
|
className: cn(
|
|
@@ -7709,7 +7885,7 @@ var Whiteboard = ({
|
|
|
7709
7885
|
className
|
|
7710
7886
|
),
|
|
7711
7887
|
...rest,
|
|
7712
|
-
children: /* @__PURE__ */ (0,
|
|
7888
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: cn("grid gap-4", gridColsClass), children: images.map((image) => /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
7713
7889
|
"div",
|
|
7714
7890
|
{
|
|
7715
7891
|
className: "relative group overflow-hidden bg-gray-100 rounded-lg",
|
|
@@ -7717,7 +7893,7 @@ var Whiteboard = ({
|
|
|
7717
7893
|
width: `${IMAGE_WIDTH}px`
|
|
7718
7894
|
},
|
|
7719
7895
|
children: [
|
|
7720
|
-
/* @__PURE__ */ (0,
|
|
7896
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7721
7897
|
"div",
|
|
7722
7898
|
{
|
|
7723
7899
|
className: "relative",
|
|
@@ -7725,8 +7901,8 @@ var Whiteboard = ({
|
|
|
7725
7901
|
width: `${IMAGE_WIDTH}px`,
|
|
7726
7902
|
height: `${IMAGE_HEIGHT}px`
|
|
7727
7903
|
},
|
|
7728
|
-
children: imageErrors.has(image.id) ? /* @__PURE__ */ (0,
|
|
7729
|
-
/* @__PURE__ */ (0,
|
|
7904
|
+
children: imageErrors.has(image.id) ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-gray-200", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: "text-gray-500 text-sm text-center px-2", children: "Imagem indispon\xEDvel" }) }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
|
|
7905
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7730
7906
|
"img",
|
|
7731
7907
|
{
|
|
7732
7908
|
src: image.imageUrl,
|
|
@@ -7736,18 +7912,18 @@ var Whiteboard = ({
|
|
|
7736
7912
|
onError: () => handleImageError(image.id)
|
|
7737
7913
|
}
|
|
7738
7914
|
),
|
|
7739
|
-
/* @__PURE__ */ (0,
|
|
7915
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "absolute inset-0 bg-gradient-to-t from-black/20 to-transparent" })
|
|
7740
7916
|
] })
|
|
7741
7917
|
}
|
|
7742
7918
|
),
|
|
7743
|
-
showDownload && /* @__PURE__ */ (0,
|
|
7919
|
+
showDownload && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7744
7920
|
"button",
|
|
7745
7921
|
{
|
|
7746
7922
|
type: "button",
|
|
7747
7923
|
onClick: () => handleDownload(image),
|
|
7748
7924
|
className: "cursor-pointer absolute bottom-3 right-3 flex items-center justify-center bg-black/20 backdrop-blur-sm rounded hover:bg-black/30 transition-colors duration-200 group/button w-6 h-6",
|
|
7749
7925
|
"aria-label": `Download ${image.title || "imagem"}`,
|
|
7750
|
-
children: /* @__PURE__ */ (0,
|
|
7926
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7751
7927
|
import_phosphor_react19.ArrowsOut,
|
|
7752
7928
|
{
|
|
7753
7929
|
size: 24,
|
|
@@ -7767,10 +7943,10 @@ var Whiteboard = ({
|
|
|
7767
7943
|
var Whiteboard_default = Whiteboard;
|
|
7768
7944
|
|
|
7769
7945
|
// src/components/Auth/Auth.tsx
|
|
7770
|
-
var
|
|
7946
|
+
var import_react27 = require("react");
|
|
7771
7947
|
var import_react_router_dom = require("react-router-dom");
|
|
7772
|
-
var
|
|
7773
|
-
var AuthContext = (0,
|
|
7948
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
7949
|
+
var AuthContext = (0, import_react27.createContext)(void 0);
|
|
7774
7950
|
var AuthProvider = ({
|
|
7775
7951
|
children,
|
|
7776
7952
|
checkAuthFn,
|
|
@@ -7780,12 +7956,12 @@ var AuthProvider = ({
|
|
|
7780
7956
|
getSessionFn,
|
|
7781
7957
|
getTokensFn
|
|
7782
7958
|
}) => {
|
|
7783
|
-
const [authState, setAuthState] = (0,
|
|
7959
|
+
const [authState, setAuthState] = (0, import_react27.useState)({
|
|
7784
7960
|
isAuthenticated: false,
|
|
7785
7961
|
isLoading: true,
|
|
7786
7962
|
...initialAuthState
|
|
7787
7963
|
});
|
|
7788
|
-
const checkAuth = (0,
|
|
7964
|
+
const checkAuth = (0, import_react27.useCallback)(async () => {
|
|
7789
7965
|
try {
|
|
7790
7966
|
setAuthState((prev) => ({ ...prev, isLoading: true }));
|
|
7791
7967
|
if (!checkAuthFn) {
|
|
@@ -7816,7 +7992,7 @@ var AuthProvider = ({
|
|
|
7816
7992
|
return false;
|
|
7817
7993
|
}
|
|
7818
7994
|
}, [checkAuthFn, getUserFn, getSessionFn, getTokensFn]);
|
|
7819
|
-
const signOut = (0,
|
|
7995
|
+
const signOut = (0, import_react27.useCallback)(() => {
|
|
7820
7996
|
if (signOutFn) {
|
|
7821
7997
|
signOutFn();
|
|
7822
7998
|
}
|
|
@@ -7828,10 +8004,10 @@ var AuthProvider = ({
|
|
|
7828
8004
|
tokens: void 0
|
|
7829
8005
|
}));
|
|
7830
8006
|
}, [signOutFn]);
|
|
7831
|
-
(0,
|
|
8007
|
+
(0, import_react27.useEffect)(() => {
|
|
7832
8008
|
checkAuth();
|
|
7833
8009
|
}, [checkAuth]);
|
|
7834
|
-
const contextValue = (0,
|
|
8010
|
+
const contextValue = (0, import_react27.useMemo)(
|
|
7835
8011
|
() => ({
|
|
7836
8012
|
...authState,
|
|
7837
8013
|
checkAuth,
|
|
@@ -7839,10 +8015,10 @@ var AuthProvider = ({
|
|
|
7839
8015
|
}),
|
|
7840
8016
|
[authState, checkAuth, signOut]
|
|
7841
8017
|
);
|
|
7842
|
-
return /* @__PURE__ */ (0,
|
|
8018
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AuthContext.Provider, { value: contextValue, children });
|
|
7843
8019
|
};
|
|
7844
8020
|
var useAuth = () => {
|
|
7845
|
-
const context = (0,
|
|
8021
|
+
const context = (0, import_react27.useContext)(AuthContext);
|
|
7846
8022
|
if (context === void 0) {
|
|
7847
8023
|
throw new Error("useAuth deve ser usado dentro de um AuthProvider");
|
|
7848
8024
|
}
|
|
@@ -7855,9 +8031,9 @@ var ProtectedRoute = ({
|
|
|
7855
8031
|
additionalCheck
|
|
7856
8032
|
}) => {
|
|
7857
8033
|
const { isAuthenticated, isLoading, ...authState } = useAuth();
|
|
7858
|
-
const defaultLoadingComponent = /* @__PURE__ */ (0,
|
|
8034
|
+
const defaultLoadingComponent = /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "text-text-950 text-lg", children: "Carregando..." }) });
|
|
7859
8035
|
if (isLoading) {
|
|
7860
|
-
return /* @__PURE__ */ (0,
|
|
8036
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children: loadingComponent || defaultLoadingComponent });
|
|
7861
8037
|
}
|
|
7862
8038
|
if (!isAuthenticated) {
|
|
7863
8039
|
if (typeof window !== "undefined") {
|
|
@@ -7868,12 +8044,12 @@ var ProtectedRoute = ({
|
|
|
7868
8044
|
return null;
|
|
7869
8045
|
}
|
|
7870
8046
|
}
|
|
7871
|
-
return /* @__PURE__ */ (0,
|
|
8047
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_router_dom.Navigate, { to: redirectTo, replace: true });
|
|
7872
8048
|
}
|
|
7873
8049
|
if (additionalCheck && !additionalCheck({ isAuthenticated, isLoading, ...authState })) {
|
|
7874
|
-
return /* @__PURE__ */ (0,
|
|
8050
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_router_dom.Navigate, { to: redirectTo, replace: true });
|
|
7875
8051
|
}
|
|
7876
|
-
return /* @__PURE__ */ (0,
|
|
8052
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children });
|
|
7877
8053
|
};
|
|
7878
8054
|
var PublicRoute = ({
|
|
7879
8055
|
children,
|
|
@@ -7883,15 +8059,15 @@ var PublicRoute = ({
|
|
|
7883
8059
|
}) => {
|
|
7884
8060
|
const { isAuthenticated, isLoading } = useAuth();
|
|
7885
8061
|
if (checkAuthBeforeRender && isLoading) {
|
|
7886
|
-
return /* @__PURE__ */ (0,
|
|
8062
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "text-text-950 text-lg", children: "Carregando..." }) });
|
|
7887
8063
|
}
|
|
7888
8064
|
if (isAuthenticated && redirectIfAuthenticated) {
|
|
7889
|
-
return /* @__PURE__ */ (0,
|
|
8065
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_router_dom.Navigate, { to: redirectTo, replace: true });
|
|
7890
8066
|
}
|
|
7891
|
-
return /* @__PURE__ */ (0,
|
|
8067
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_jsx_runtime39.Fragment, { children });
|
|
7892
8068
|
};
|
|
7893
8069
|
var withAuth = (Component, options = {}) => {
|
|
7894
|
-
return (props) => /* @__PURE__ */ (0,
|
|
8070
|
+
return (props) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ProtectedRoute, { ...options, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Component, { ...props }) });
|
|
7895
8071
|
};
|
|
7896
8072
|
var useAuthGuard = (options = {}) => {
|
|
7897
8073
|
const authState = useAuth();
|
|
@@ -7906,7 +8082,7 @@ var useAuthGuard = (options = {}) => {
|
|
|
7906
8082
|
var useRouteAuth = (fallbackPath = "/") => {
|
|
7907
8083
|
const { isAuthenticated, isLoading } = useAuth();
|
|
7908
8084
|
const location = (0, import_react_router_dom.useLocation)();
|
|
7909
|
-
const redirectToLogin = () => /* @__PURE__ */ (0,
|
|
8085
|
+
const redirectToLogin = () => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_router_dom.Navigate, { to: fallbackPath, state: { from: location }, replace: true });
|
|
7910
8086
|
return {
|
|
7911
8087
|
isAuthenticated,
|
|
7912
8088
|
isLoading,
|
|
@@ -7982,7 +8158,7 @@ function createZustandAuthAdapter(useAuthStore) {
|
|
|
7982
8158
|
}
|
|
7983
8159
|
|
|
7984
8160
|
// src/components/Auth/useUrlAuthentication.ts
|
|
7985
|
-
var
|
|
8161
|
+
var import_react28 = require("react");
|
|
7986
8162
|
var import_react_router_dom2 = require("react-router-dom");
|
|
7987
8163
|
var getAuthParams = (location, extractParams) => {
|
|
7988
8164
|
const searchParams = new URLSearchParams(location.search);
|
|
@@ -8030,8 +8206,8 @@ var handleUserData = (responseData, setUser) => {
|
|
|
8030
8206
|
};
|
|
8031
8207
|
function useUrlAuthentication(options) {
|
|
8032
8208
|
const location = (0, import_react_router_dom2.useLocation)();
|
|
8033
|
-
const processedRef = (0,
|
|
8034
|
-
(0,
|
|
8209
|
+
const processedRef = (0, import_react28.useRef)(false);
|
|
8210
|
+
(0, import_react28.useEffect)(() => {
|
|
8035
8211
|
const handleAuthentication = async () => {
|
|
8036
8212
|
if (processedRef.current) {
|
|
8037
8213
|
return;
|
|
@@ -8102,9 +8278,9 @@ function useUrlAuthentication(options) {
|
|
|
8102
8278
|
}
|
|
8103
8279
|
|
|
8104
8280
|
// src/components/Auth/useApiConfig.ts
|
|
8105
|
-
var
|
|
8281
|
+
var import_react29 = require("react");
|
|
8106
8282
|
function useApiConfig(api) {
|
|
8107
|
-
return (0,
|
|
8283
|
+
return (0, import_react29.useMemo)(
|
|
8108
8284
|
() => ({
|
|
8109
8285
|
get: (endpoint, config) => api.get(endpoint, config)
|
|
8110
8286
|
}),
|
|
@@ -8114,7 +8290,7 @@ function useApiConfig(api) {
|
|
|
8114
8290
|
|
|
8115
8291
|
// src/components/Quiz/Quiz.tsx
|
|
8116
8292
|
var import_phosphor_react20 = require("phosphor-react");
|
|
8117
|
-
var
|
|
8293
|
+
var import_react30 = require("react");
|
|
8118
8294
|
|
|
8119
8295
|
// src/components/Quiz/useQuizStore.ts
|
|
8120
8296
|
var import_zustand7 = require("zustand");
|
|
@@ -8750,13 +8926,13 @@ var useQuizStore = (0, import_zustand7.create)()(
|
|
|
8750
8926
|
var mock_image_question_default = "./mock-image-question-HEZCLFDL.png";
|
|
8751
8927
|
|
|
8752
8928
|
// src/components/Quiz/Quiz.tsx
|
|
8753
|
-
var
|
|
8929
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
8754
8930
|
var getStatusBadge = (status) => {
|
|
8755
8931
|
switch (status) {
|
|
8756
8932
|
case "correct":
|
|
8757
|
-
return /* @__PURE__ */ (0,
|
|
8933
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "solid", action: "success", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.CheckCircle, {}), children: "Resposta correta" });
|
|
8758
8934
|
case "incorrect":
|
|
8759
|
-
return /* @__PURE__ */ (0,
|
|
8935
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "solid", action: "error", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.XCircle, {}), children: "Resposta incorreta" });
|
|
8760
8936
|
default:
|
|
8761
8937
|
return null;
|
|
8762
8938
|
}
|
|
@@ -8769,18 +8945,18 @@ var getStatusStyles = (variantCorrect) => {
|
|
|
8769
8945
|
return "bg-error-background border-error-300";
|
|
8770
8946
|
}
|
|
8771
8947
|
};
|
|
8772
|
-
var Quiz = (0,
|
|
8948
|
+
var Quiz = (0, import_react30.forwardRef)(({ children, className, variant = "default", ...props }, ref) => {
|
|
8773
8949
|
const { setVariant } = useQuizStore();
|
|
8774
|
-
(0,
|
|
8950
|
+
(0, import_react30.useEffect)(() => {
|
|
8775
8951
|
setVariant(variant);
|
|
8776
8952
|
}, [variant, setVariant]);
|
|
8777
|
-
return /* @__PURE__ */ (0,
|
|
8953
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { ref, className: cn("flex flex-col", className), ...props, children });
|
|
8778
8954
|
});
|
|
8779
|
-
var QuizHeaderResult = (0,
|
|
8955
|
+
var QuizHeaderResult = (0, import_react30.forwardRef)(
|
|
8780
8956
|
({ className, ...props }, ref) => {
|
|
8781
8957
|
const { getQuestionResultByQuestionId, getCurrentQuestion } = useQuizStore();
|
|
8782
|
-
const [status, setStatus] = (0,
|
|
8783
|
-
(0,
|
|
8958
|
+
const [status, setStatus] = (0, import_react30.useState)(void 0);
|
|
8959
|
+
(0, import_react30.useEffect)(() => {
|
|
8784
8960
|
const cq = getCurrentQuestion();
|
|
8785
8961
|
if (!cq) {
|
|
8786
8962
|
setStatus(void 0);
|
|
@@ -8815,7 +8991,7 @@ var QuizHeaderResult = (0, import_react29.forwardRef)(
|
|
|
8815
8991
|
return "N\xE3o foi dessa vez...voc\xEA deixou a resposta em branco";
|
|
8816
8992
|
}
|
|
8817
8993
|
};
|
|
8818
|
-
return /* @__PURE__ */ (0,
|
|
8994
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8819
8995
|
"div",
|
|
8820
8996
|
{
|
|
8821
8997
|
ref,
|
|
@@ -8826,14 +9002,14 @@ var QuizHeaderResult = (0, import_react29.forwardRef)(
|
|
|
8826
9002
|
),
|
|
8827
9003
|
...props,
|
|
8828
9004
|
children: [
|
|
8829
|
-
/* @__PURE__ */ (0,
|
|
8830
|
-
/* @__PURE__ */ (0,
|
|
9005
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-950 font-bold text-lg", children: "Resultado" }),
|
|
9006
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-700 text-md", children: getLabelByAnswersStatus() })
|
|
8831
9007
|
]
|
|
8832
9008
|
}
|
|
8833
9009
|
);
|
|
8834
9010
|
}
|
|
8835
9011
|
);
|
|
8836
|
-
var QuizTitle = (0,
|
|
9012
|
+
var QuizTitle = (0, import_react30.forwardRef)(
|
|
8837
9013
|
({ className, ...props }, ref) => {
|
|
8838
9014
|
const {
|
|
8839
9015
|
currentQuestionIndex,
|
|
@@ -8843,7 +9019,7 @@ var QuizTitle = (0, import_react29.forwardRef)(
|
|
|
8843
9019
|
formatTime: formatTime2,
|
|
8844
9020
|
isStarted
|
|
8845
9021
|
} = useQuizStore();
|
|
8846
|
-
const [showExitConfirmation, setShowExitConfirmation] = (0,
|
|
9022
|
+
const [showExitConfirmation, setShowExitConfirmation] = (0, import_react30.useState)(false);
|
|
8847
9023
|
const totalQuestions = getTotalQuestions();
|
|
8848
9024
|
const quizTitle = getQuizTitle();
|
|
8849
9025
|
const handleBackClick = () => {
|
|
@@ -8860,8 +9036,8 @@ var QuizTitle = (0, import_react29.forwardRef)(
|
|
|
8860
9036
|
const handleCancelExit = () => {
|
|
8861
9037
|
setShowExitConfirmation(false);
|
|
8862
9038
|
};
|
|
8863
|
-
return /* @__PURE__ */ (0,
|
|
8864
|
-
/* @__PURE__ */ (0,
|
|
9039
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9040
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8865
9041
|
"div",
|
|
8866
9042
|
{
|
|
8867
9043
|
ref,
|
|
@@ -8871,24 +9047,24 @@ var QuizTitle = (0, import_react29.forwardRef)(
|
|
|
8871
9047
|
),
|
|
8872
9048
|
...props,
|
|
8873
9049
|
children: [
|
|
8874
|
-
/* @__PURE__ */ (0,
|
|
9050
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8875
9051
|
IconButton_default,
|
|
8876
9052
|
{
|
|
8877
|
-
icon: /* @__PURE__ */ (0,
|
|
9053
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.CaretLeft, { size: 24 }),
|
|
8878
9054
|
size: "md",
|
|
8879
9055
|
"aria-label": "Voltar",
|
|
8880
9056
|
onClick: handleBackClick
|
|
8881
9057
|
}
|
|
8882
9058
|
),
|
|
8883
|
-
/* @__PURE__ */ (0,
|
|
8884
|
-
/* @__PURE__ */ (0,
|
|
8885
|
-
/* @__PURE__ */ (0,
|
|
9059
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("span", { className: "flex flex-col gap-2 text-center", children: [
|
|
9060
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-950 font-bold text-md", children: quizTitle }),
|
|
9061
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-600 text-xs", children: totalQuestions > 0 ? `${currentQuestionIndex + 1} de ${totalQuestions}` : "0 de 0" })
|
|
8886
9062
|
] }),
|
|
8887
|
-
/* @__PURE__ */ (0,
|
|
9063
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "flex flex-row items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "outlined", action: "info", iconLeft: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.Clock, {}), children: isStarted ? formatTime2(timeElapsed) : "00:00" }) })
|
|
8888
9064
|
]
|
|
8889
9065
|
}
|
|
8890
9066
|
),
|
|
8891
|
-
/* @__PURE__ */ (0,
|
|
9067
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8892
9068
|
AlertDialog,
|
|
8893
9069
|
{
|
|
8894
9070
|
isOpen: showExitConfirmation,
|
|
@@ -8904,15 +9080,15 @@ var QuizTitle = (0, import_react29.forwardRef)(
|
|
|
8904
9080
|
] });
|
|
8905
9081
|
}
|
|
8906
9082
|
);
|
|
8907
|
-
var QuizSubTitle = (0,
|
|
9083
|
+
var QuizSubTitle = (0, import_react30.forwardRef)(
|
|
8908
9084
|
({ subTitle, ...props }, ref) => {
|
|
8909
|
-
return /* @__PURE__ */ (0,
|
|
9085
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "px-4 pb-2 pt-6", ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "font-bold text-lg text-text-950", children: subTitle }) });
|
|
8910
9086
|
}
|
|
8911
9087
|
);
|
|
8912
9088
|
var QuizHeader = () => {
|
|
8913
9089
|
const { getCurrentQuestion, currentQuestionIndex } = useQuizStore();
|
|
8914
9090
|
const currentQuestion = getCurrentQuestion();
|
|
8915
|
-
return /* @__PURE__ */ (0,
|
|
9091
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8916
9092
|
HeaderAlternative,
|
|
8917
9093
|
{
|
|
8918
9094
|
title: currentQuestion ? `Quest\xE3o ${currentQuestionIndex + 1}` : "Quest\xE3o",
|
|
@@ -8921,8 +9097,8 @@ var QuizHeader = () => {
|
|
|
8921
9097
|
}
|
|
8922
9098
|
);
|
|
8923
9099
|
};
|
|
8924
|
-
var QuizContainer = (0,
|
|
8925
|
-
return /* @__PURE__ */ (0,
|
|
9100
|
+
var QuizContainer = (0, import_react30.forwardRef)(({ children, className, ...props }, ref) => {
|
|
9101
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8926
9102
|
"div",
|
|
8927
9103
|
{
|
|
8928
9104
|
ref,
|
|
@@ -8935,7 +9111,7 @@ var QuizContainer = (0, import_react29.forwardRef)(({ children, className, ...pr
|
|
|
8935
9111
|
}
|
|
8936
9112
|
);
|
|
8937
9113
|
});
|
|
8938
|
-
var QuizContent = (0,
|
|
9114
|
+
var QuizContent = (0, import_react30.forwardRef)(({ paddingBottom }) => {
|
|
8939
9115
|
const { getCurrentQuestion } = useQuizStore();
|
|
8940
9116
|
const currentQuestion = getCurrentQuestion();
|
|
8941
9117
|
const questionComponents = {
|
|
@@ -8948,7 +9124,7 @@ var QuizContent = (0, import_react29.forwardRef)(({ paddingBottom }) => {
|
|
|
8948
9124
|
["IMAGEM" /* IMAGEM */]: QuizImageQuestion
|
|
8949
9125
|
};
|
|
8950
9126
|
const QuestionComponent = currentQuestion ? questionComponents[currentQuestion.questionType] : null;
|
|
8951
|
-
return QuestionComponent ? /* @__PURE__ */ (0,
|
|
9127
|
+
return QuestionComponent ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuestionComponent, { paddingBottom }) : null;
|
|
8952
9128
|
});
|
|
8953
9129
|
var QuizAlternative = ({ paddingBottom }) => {
|
|
8954
9130
|
const {
|
|
@@ -8985,10 +9161,10 @@ var QuizAlternative = ({ paddingBottom }) => {
|
|
|
8985
9161
|
};
|
|
8986
9162
|
});
|
|
8987
9163
|
if (!alternatives)
|
|
8988
|
-
return /* @__PURE__ */ (0,
|
|
8989
|
-
return /* @__PURE__ */ (0,
|
|
8990
|
-
/* @__PURE__ */ (0,
|
|
8991
|
-
/* @__PURE__ */ (0,
|
|
9164
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { children: "N\xE3o h\xE1 Alternativas" }) });
|
|
9165
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9166
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Alternativas" }),
|
|
9167
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8992
9168
|
AlternativesList,
|
|
8993
9169
|
{
|
|
8994
9170
|
mode: variant === "default" ? "interactive" : "readonly",
|
|
@@ -9020,15 +9196,15 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
|
|
|
9020
9196
|
const currentQuestionResult = getQuestionResultByQuestionId(
|
|
9021
9197
|
currentQuestion?.id || ""
|
|
9022
9198
|
);
|
|
9023
|
-
const prevSelectedValuesRef = (0,
|
|
9024
|
-
const prevQuestionIdRef = (0,
|
|
9025
|
-
const allCurrentAnswerIds = (0,
|
|
9199
|
+
const prevSelectedValuesRef = (0, import_react30.useRef)([]);
|
|
9200
|
+
const prevQuestionIdRef = (0, import_react30.useRef)("");
|
|
9201
|
+
const allCurrentAnswerIds = (0, import_react30.useMemo)(() => {
|
|
9026
9202
|
return allCurrentAnswers?.map((answer) => answer.optionId) || [];
|
|
9027
9203
|
}, [allCurrentAnswers]);
|
|
9028
|
-
const selectedValues = (0,
|
|
9204
|
+
const selectedValues = (0, import_react30.useMemo)(() => {
|
|
9029
9205
|
return allCurrentAnswerIds?.filter((id) => id !== null) || [];
|
|
9030
9206
|
}, [allCurrentAnswerIds]);
|
|
9031
|
-
const stableSelectedValues = (0,
|
|
9207
|
+
const stableSelectedValues = (0, import_react30.useMemo)(() => {
|
|
9032
9208
|
const currentQuestionId = currentQuestion?.id || "";
|
|
9033
9209
|
const hasQuestionChanged = prevQuestionIdRef.current !== currentQuestionId;
|
|
9034
9210
|
if (hasQuestionChanged) {
|
|
@@ -9052,7 +9228,7 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
|
|
|
9052
9228
|
variant,
|
|
9053
9229
|
currentQuestionResult?.selectedOptions
|
|
9054
9230
|
]);
|
|
9055
|
-
const handleSelectedValues = (0,
|
|
9231
|
+
const handleSelectedValues = (0, import_react30.useCallback)(
|
|
9056
9232
|
(values) => {
|
|
9057
9233
|
if (currentQuestion) {
|
|
9058
9234
|
selectMultipleAnswer(currentQuestion.id, values);
|
|
@@ -9060,7 +9236,7 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
|
|
|
9060
9236
|
},
|
|
9061
9237
|
[currentQuestion, selectMultipleAnswer]
|
|
9062
9238
|
);
|
|
9063
|
-
const questionKey = (0,
|
|
9239
|
+
const questionKey = (0, import_react30.useMemo)(
|
|
9064
9240
|
() => `question-${currentQuestion?.id || "1"}`,
|
|
9065
9241
|
[currentQuestion?.id]
|
|
9066
9242
|
);
|
|
@@ -9086,10 +9262,10 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
|
|
|
9086
9262
|
};
|
|
9087
9263
|
});
|
|
9088
9264
|
if (!choices)
|
|
9089
|
-
return /* @__PURE__ */ (0,
|
|
9090
|
-
return /* @__PURE__ */ (0,
|
|
9091
|
-
/* @__PURE__ */ (0,
|
|
9092
|
-
/* @__PURE__ */ (0,
|
|
9265
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { children: "N\xE3o h\xE1 Escolhas Multiplas" }) });
|
|
9266
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9267
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Alternativas" }),
|
|
9268
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9093
9269
|
MultipleChoiceList,
|
|
9094
9270
|
{
|
|
9095
9271
|
choices,
|
|
@@ -9115,13 +9291,13 @@ var QuizDissertative = ({ paddingBottom }) => {
|
|
|
9115
9291
|
currentQuestion?.id || ""
|
|
9116
9292
|
);
|
|
9117
9293
|
const currentAnswer = getCurrentAnswer();
|
|
9118
|
-
const textareaRef = (0,
|
|
9294
|
+
const textareaRef = (0, import_react30.useRef)(null);
|
|
9119
9295
|
const handleAnswerChange = (value) => {
|
|
9120
9296
|
if (currentQuestion) {
|
|
9121
9297
|
selectDissertativeAnswer(currentQuestion.id, value);
|
|
9122
9298
|
}
|
|
9123
9299
|
};
|
|
9124
|
-
const adjustTextareaHeight = (0,
|
|
9300
|
+
const adjustTextareaHeight = (0, import_react30.useCallback)(() => {
|
|
9125
9301
|
if (textareaRef.current) {
|
|
9126
9302
|
textareaRef.current.style.height = "auto";
|
|
9127
9303
|
const scrollHeight = textareaRef.current.scrollHeight;
|
|
@@ -9131,16 +9307,16 @@ var QuizDissertative = ({ paddingBottom }) => {
|
|
|
9131
9307
|
textareaRef.current.style.height = `${newHeight}px`;
|
|
9132
9308
|
}
|
|
9133
9309
|
}, []);
|
|
9134
|
-
(0,
|
|
9310
|
+
(0, import_react30.useEffect)(() => {
|
|
9135
9311
|
adjustTextareaHeight();
|
|
9136
9312
|
}, [currentAnswer, adjustTextareaHeight]);
|
|
9137
9313
|
if (!currentQuestion) {
|
|
9138
|
-
return /* @__PURE__ */ (0,
|
|
9314
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-600 text-md", children: "Nenhuma quest\xE3o dispon\xEDvel" }) });
|
|
9139
9315
|
}
|
|
9140
9316
|
const localAnswer = (variant == "result" ? currentQuestionResult?.answer : currentAnswer?.answer) || "";
|
|
9141
|
-
return /* @__PURE__ */ (0,
|
|
9142
|
-
/* @__PURE__ */ (0,
|
|
9143
|
-
/* @__PURE__ */ (0,
|
|
9317
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9318
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Resposta" }),
|
|
9319
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn(variant != "result" && paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-4 max-h-[600px] overflow-y-auto", children: variant === "default" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9144
9320
|
TextArea_default,
|
|
9145
9321
|
{
|
|
9146
9322
|
ref: textareaRef,
|
|
@@ -9150,10 +9326,10 @@ var QuizDissertative = ({ paddingBottom }) => {
|
|
|
9150
9326
|
rows: 4,
|
|
9151
9327
|
className: "min-h-[120px] max-h-[400px] resize-none overflow-y-auto"
|
|
9152
9328
|
}
|
|
9153
|
-
) }) : /* @__PURE__ */ (0,
|
|
9154
|
-
variant === "result" && currentQuestionResult?.answerStatus == "RESPOSTA_INCORRETA" /* RESPOSTA_INCORRETA */ && /* @__PURE__ */ (0,
|
|
9155
|
-
/* @__PURE__ */ (0,
|
|
9156
|
-
/* @__PURE__ */ (0,
|
|
9329
|
+
) }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-600 text-md whitespace-pre-wrap", children: localAnswer || "Nenhuma resposta fornecida" }) }) }) }),
|
|
9330
|
+
variant === "result" && currentQuestionResult?.answerStatus == "RESPOSTA_INCORRETA" /* RESPOSTA_INCORRETA */ && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9331
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Observa\xE7\xE3o do professor" }),
|
|
9332
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-600 text-md whitespace-pre-wrap", children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, urna eu tincidunt consectetur, nisi nisl aliquam nunc, eget aliquam massa nisl quis neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer euismod, urna eu tincidunt consectetur, nisi nisl aliquam nunc, eget aliquam massa nisl quis neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse potenti. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat, velit mauris egestas quam, ut aliquam massa nisl quis neque. Suspendisse in orci enim. Mauris euismod, urna eu tincidunt consectetur, nisi nisl aliquam nunc, eget aliquam massa nisl quis neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer euismod, urna eu tincidunt consectetur, nisi nisl aliquam nunc, eget aliquam massa nisl quis neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse potenti. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat, velit mauris egestas quam, ut aliquam massa nisl quis neque. Suspendisse in orci enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Integer euismod, urna eu tincidunt consectetur, nisi nisl aliquam nunc, eget aliquam massa nisl quis neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse potenti. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat, velit mauris egestas quam, ut aliquam massa nisl quis neque. Suspendisse in orci enim." }) })
|
|
9157
9333
|
] })
|
|
9158
9334
|
] });
|
|
9159
9335
|
};
|
|
@@ -9179,16 +9355,16 @@ var QuizTrueOrFalse = ({ paddingBottom }) => {
|
|
|
9179
9355
|
];
|
|
9180
9356
|
const getLetterByIndex = (index) => String.fromCharCode(97 + index);
|
|
9181
9357
|
const isDefaultVariant = variant == "default";
|
|
9182
|
-
return /* @__PURE__ */ (0,
|
|
9183
|
-
/* @__PURE__ */ (0,
|
|
9184
|
-
/* @__PURE__ */ (0,
|
|
9358
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9359
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Alternativas" }),
|
|
9360
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-col gap-3.5", children: options.map((option, index) => {
|
|
9185
9361
|
const variantCorrect = option.isCorrect ? "correct" : "incorrect";
|
|
9186
|
-
return /* @__PURE__ */ (0,
|
|
9362
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9187
9363
|
"section",
|
|
9188
9364
|
{
|
|
9189
9365
|
className: "flex flex-col gap-2",
|
|
9190
9366
|
children: [
|
|
9191
|
-
/* @__PURE__ */ (0,
|
|
9367
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9192
9368
|
"div",
|
|
9193
9369
|
{
|
|
9194
9370
|
className: cn(
|
|
@@ -9196,20 +9372,20 @@ var QuizTrueOrFalse = ({ paddingBottom }) => {
|
|
|
9196
9372
|
!isDefaultVariant ? getStatusStyles(variantCorrect) : ""
|
|
9197
9373
|
),
|
|
9198
9374
|
children: [
|
|
9199
|
-
/* @__PURE__ */ (0,
|
|
9200
|
-
isDefaultVariant ? /* @__PURE__ */ (0,
|
|
9201
|
-
/* @__PURE__ */ (0,
|
|
9202
|
-
/* @__PURE__ */ (0,
|
|
9203
|
-
/* @__PURE__ */ (0,
|
|
9204
|
-
/* @__PURE__ */ (0,
|
|
9375
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-900 text-sm", children: getLetterByIndex(index).concat(") ").concat(option.label) }),
|
|
9376
|
+
isDefaultVariant ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(Select_default, { size: "medium", children: [
|
|
9377
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectTrigger, { className: "w-[180px]", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, { placeholder: "Selecione opc\xE3o" }) }),
|
|
9378
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(SelectContent, { children: [
|
|
9379
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: "V", children: "Verdadeiro" }),
|
|
9380
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: "F", children: "Falso" })
|
|
9205
9381
|
] })
|
|
9206
|
-
] }) : /* @__PURE__ */ (0,
|
|
9382
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex-shrink-0", children: getStatusBadge(variantCorrect) })
|
|
9207
9383
|
]
|
|
9208
9384
|
}
|
|
9209
9385
|
),
|
|
9210
|
-
!isDefaultVariant && /* @__PURE__ */ (0,
|
|
9211
|
-
/* @__PURE__ */ (0,
|
|
9212
|
-
!option.isCorrect && /* @__PURE__ */ (0,
|
|
9386
|
+
!isDefaultVariant && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("span", { className: "flex flex-row gap-2 items-center", children: [
|
|
9387
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-800 text-2xs", children: "Resposta selecionada: V" }),
|
|
9388
|
+
!option.isCorrect && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-800 text-2xs", children: "Resposta correta: F" })
|
|
9213
9389
|
] })
|
|
9214
9390
|
]
|
|
9215
9391
|
},
|
|
@@ -9270,7 +9446,7 @@ var QuizConnectDots = ({ paddingBottom }) => {
|
|
|
9270
9446
|
isCorrect: false
|
|
9271
9447
|
}
|
|
9272
9448
|
];
|
|
9273
|
-
const [userAnswers, setUserAnswers] = (0,
|
|
9449
|
+
const [userAnswers, setUserAnswers] = (0, import_react30.useState)(() => {
|
|
9274
9450
|
if (variant === "result") {
|
|
9275
9451
|
return mockUserAnswers;
|
|
9276
9452
|
}
|
|
@@ -9299,13 +9475,13 @@ var QuizConnectDots = ({ paddingBottom }) => {
|
|
|
9299
9475
|
const assignedDots = new Set(
|
|
9300
9476
|
userAnswers.map((a) => a.dotOption).filter(Boolean)
|
|
9301
9477
|
);
|
|
9302
|
-
return /* @__PURE__ */ (0,
|
|
9303
|
-
/* @__PURE__ */ (0,
|
|
9304
|
-
/* @__PURE__ */ (0,
|
|
9478
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9479
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Alternativas" }),
|
|
9480
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-col gap-3.5", children: options.map((option, index) => {
|
|
9305
9481
|
const answer = userAnswers[index];
|
|
9306
9482
|
const variantCorrect = answer.isCorrect ? "correct" : "incorrect";
|
|
9307
|
-
return /* @__PURE__ */ (0,
|
|
9308
|
-
/* @__PURE__ */ (0,
|
|
9483
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("section", { className: "flex flex-col gap-2", children: [
|
|
9484
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9309
9485
|
"div",
|
|
9310
9486
|
{
|
|
9311
9487
|
className: cn(
|
|
@@ -9313,30 +9489,30 @@ var QuizConnectDots = ({ paddingBottom }) => {
|
|
|
9313
9489
|
!isDefaultVariant ? getStatusStyles(variantCorrect) : ""
|
|
9314
9490
|
),
|
|
9315
9491
|
children: [
|
|
9316
|
-
/* @__PURE__ */ (0,
|
|
9317
|
-
isDefaultVariant ? /* @__PURE__ */ (0,
|
|
9492
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-900 text-sm", children: getLetterByIndex(index) + ") " + option.label }),
|
|
9493
|
+
isDefaultVariant ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9318
9494
|
Select_default,
|
|
9319
9495
|
{
|
|
9320
9496
|
size: "medium",
|
|
9321
9497
|
value: answer.dotOption || void 0,
|
|
9322
9498
|
onValueChange: (value) => handleSelectDot(index, value),
|
|
9323
9499
|
children: [
|
|
9324
|
-
/* @__PURE__ */ (0,
|
|
9325
|
-
/* @__PURE__ */ (0,
|
|
9500
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectTrigger, { className: "w-[180px]", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, { placeholder: "Selecione op\xE7\xE3o" }) }),
|
|
9501
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectContent, { children: dotsOptions.filter(
|
|
9326
9502
|
(dot) => !assignedDots.has(dot.label) || answer.dotOption === dot.label
|
|
9327
|
-
).map((dot) => /* @__PURE__ */ (0,
|
|
9503
|
+
).map((dot) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: dot.label, children: dot.label }, dot.label)) })
|
|
9328
9504
|
]
|
|
9329
9505
|
}
|
|
9330
|
-
) : /* @__PURE__ */ (0,
|
|
9506
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex-shrink-0", children: answer.isCorrect === null ? null : getStatusBadge(variantCorrect) })
|
|
9331
9507
|
]
|
|
9332
9508
|
}
|
|
9333
9509
|
),
|
|
9334
|
-
!isDefaultVariant && /* @__PURE__ */ (0,
|
|
9335
|
-
/* @__PURE__ */ (0,
|
|
9510
|
+
!isDefaultVariant && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("span", { className: "flex flex-row gap-2 items-center", children: [
|
|
9511
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("p", { className: "text-text-800 text-2xs", children: [
|
|
9336
9512
|
"Resposta selecionada: ",
|
|
9337
9513
|
answer.dotOption || "Nenhuma"
|
|
9338
9514
|
] }),
|
|
9339
|
-
!answer.isCorrect && /* @__PURE__ */ (0,
|
|
9515
|
+
!answer.isCorrect && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("p", { className: "text-text-800 text-2xs", children: [
|
|
9340
9516
|
"Resposta correta: ",
|
|
9341
9517
|
answer.correctOption
|
|
9342
9518
|
] })
|
|
@@ -9389,8 +9565,8 @@ var QuizFill = ({ paddingBottom }) => {
|
|
|
9389
9565
|
isCorrect: true
|
|
9390
9566
|
}
|
|
9391
9567
|
];
|
|
9392
|
-
const [answers, setAnswers] = (0,
|
|
9393
|
-
const baseId = (0,
|
|
9568
|
+
const [answers, setAnswers] = (0, import_react30.useState)({});
|
|
9569
|
+
const baseId = (0, import_react30.useId)();
|
|
9394
9570
|
const getAvailableOptionsForSelect = (selectId) => {
|
|
9395
9571
|
const usedOptions = Object.entries(answers).filter(([key]) => key !== selectId).map(([, value]) => value);
|
|
9396
9572
|
return options.filter((option) => !usedOptions.includes(option));
|
|
@@ -9403,18 +9579,18 @@ var QuizFill = ({ paddingBottom }) => {
|
|
|
9403
9579
|
const mockAnswer = mockUserAnswers.find(
|
|
9404
9580
|
(answer) => answer.selectId === selectId
|
|
9405
9581
|
);
|
|
9406
|
-
return /* @__PURE__ */ (0,
|
|
9582
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "inline-flex mb-2.5 text-success-600 font-semibold text-md border-b-2 border-success-600", children: mockAnswer?.correctAnswer });
|
|
9407
9583
|
};
|
|
9408
9584
|
const renderDefaultElement = (selectId, startIndex, selectedValue, availableOptionsForThisSelect) => {
|
|
9409
|
-
return /* @__PURE__ */ (0,
|
|
9585
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9410
9586
|
Select_default,
|
|
9411
9587
|
{
|
|
9412
9588
|
value: selectedValue,
|
|
9413
9589
|
onValueChange: (value) => handleSelectChange(selectId, value),
|
|
9414
9590
|
className: "inline-flex mb-2.5",
|
|
9415
9591
|
children: [
|
|
9416
|
-
/* @__PURE__ */ (0,
|
|
9417
|
-
/* @__PURE__ */ (0,
|
|
9592
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectTrigger, { className: "inline-flex w-auto min-w-[140px] h-8 mx-1 bg-white border-gray-300", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, { placeholder: "Selecione op\xE7\xE3o" }) }),
|
|
9593
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectContent, { children: availableOptionsForThisSelect.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: option, children: option }, `${option}-${index}`)) })
|
|
9418
9594
|
]
|
|
9419
9595
|
},
|
|
9420
9596
|
`${selectId}-${startIndex}`
|
|
@@ -9426,8 +9602,8 @@ var QuizFill = ({ paddingBottom }) => {
|
|
|
9426
9602
|
);
|
|
9427
9603
|
if (!mockAnswer) return null;
|
|
9428
9604
|
const action = mockAnswer.isCorrect ? "success" : "error";
|
|
9429
|
-
const icon = mockAnswer.isCorrect ? /* @__PURE__ */ (0,
|
|
9430
|
-
return /* @__PURE__ */ (0,
|
|
9605
|
+
const icon = mockAnswer.isCorrect ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.CheckCircle, {}) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.XCircle, {});
|
|
9606
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9431
9607
|
Badge_default,
|
|
9432
9608
|
{
|
|
9433
9609
|
variant: "solid",
|
|
@@ -9435,7 +9611,7 @@ var QuizFill = ({ paddingBottom }) => {
|
|
|
9435
9611
|
iconRight: icon,
|
|
9436
9612
|
size: "large",
|
|
9437
9613
|
className: "py-3 w-[180px] justify-between mb-2.5",
|
|
9438
|
-
children: /* @__PURE__ */ (0,
|
|
9614
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-text-900", children: mockAnswer.userAnswer })
|
|
9439
9615
|
},
|
|
9440
9616
|
selectId
|
|
9441
9617
|
);
|
|
@@ -9491,25 +9667,25 @@ var QuizFill = ({ paddingBottom }) => {
|
|
|
9491
9667
|
}
|
|
9492
9668
|
return elements;
|
|
9493
9669
|
};
|
|
9494
|
-
return /* @__PURE__ */ (0,
|
|
9495
|
-
/* @__PURE__ */ (0,
|
|
9496
|
-
/* @__PURE__ */ (0,
|
|
9670
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9671
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Alternativas" }),
|
|
9672
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: "h-auto pb-0", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-6 px-4 h-auto", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9497
9673
|
"div",
|
|
9498
9674
|
{
|
|
9499
9675
|
className: cn(
|
|
9500
9676
|
"text-lg text-text-900 leading-8 h-auto",
|
|
9501
9677
|
variant != "result" && paddingBottom
|
|
9502
9678
|
),
|
|
9503
|
-
children: renderTextWithSelects(exampleText).map((element) => /* @__PURE__ */ (0,
|
|
9679
|
+
children: renderTextWithSelects(exampleText).map((element) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { children: element.element }, element.id))
|
|
9504
9680
|
}
|
|
9505
9681
|
) }) }),
|
|
9506
|
-
variant === "result" && /* @__PURE__ */ (0,
|
|
9507
|
-
/* @__PURE__ */ (0,
|
|
9508
|
-
/* @__PURE__ */ (0,
|
|
9682
|
+
variant === "result" && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9683
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Resultado" }),
|
|
9684
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: "h-auto pb-0", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "space-y-6 px-4", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9509
9685
|
"div",
|
|
9510
9686
|
{
|
|
9511
9687
|
className: cn("text-lg text-text-900 leading-8", paddingBottom),
|
|
9512
|
-
children: renderTextWithSelects(exampleText, true).map((element) => /* @__PURE__ */ (0,
|
|
9688
|
+
children: renderTextWithSelects(exampleText, true).map((element) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { children: element.element }, element.id))
|
|
9513
9689
|
}
|
|
9514
9690
|
) }) })
|
|
9515
9691
|
] })
|
|
@@ -9527,7 +9703,7 @@ var QuizImageQuestion = ({ paddingBottom }) => {
|
|
|
9527
9703
|
};
|
|
9528
9704
|
const correctRadiusRelative = calculateCorrectRadiusRelative();
|
|
9529
9705
|
const mockUserAnswerRelative = { x: 0.72, y: 0.348 };
|
|
9530
|
-
const [clickPositionRelative, setClickPositionRelative] = (0,
|
|
9706
|
+
const [clickPositionRelative, setClickPositionRelative] = (0, import_react30.useState)(variant == "result" ? mockUserAnswerRelative : null);
|
|
9531
9707
|
const convertToRelativeCoordinates = (x, y, rect) => {
|
|
9532
9708
|
const safeWidth = Math.max(rect.width, 1e-3);
|
|
9533
9709
|
const safeHeight = Math.max(rect.height, 1e-3);
|
|
@@ -9563,36 +9739,36 @@ var QuizImageQuestion = ({ paddingBottom }) => {
|
|
|
9563
9739
|
}
|
|
9564
9740
|
return "bg-success-600/70 border-white";
|
|
9565
9741
|
};
|
|
9566
|
-
return /* @__PURE__ */ (0,
|
|
9567
|
-
/* @__PURE__ */ (0,
|
|
9568
|
-
/* @__PURE__ */ (0,
|
|
9742
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9743
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizSubTitle, { subTitle: "Clique na \xE1rea correta" }),
|
|
9744
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizContainer, { className: cn("", paddingBottom), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9569
9745
|
"div",
|
|
9570
9746
|
{
|
|
9571
9747
|
"data-testid": "quiz-image-container",
|
|
9572
9748
|
className: "space-y-6 p-3 relative inline-block",
|
|
9573
9749
|
children: [
|
|
9574
|
-
variant == "result" && /* @__PURE__ */ (0,
|
|
9750
|
+
variant == "result" && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9575
9751
|
"div",
|
|
9576
9752
|
{
|
|
9577
9753
|
"data-testid": "quiz-legend",
|
|
9578
9754
|
className: "flex items-center gap-4 text-xs",
|
|
9579
9755
|
children: [
|
|
9580
|
-
/* @__PURE__ */ (0,
|
|
9581
|
-
/* @__PURE__ */ (0,
|
|
9582
|
-
/* @__PURE__ */ (0,
|
|
9756
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
9757
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-3 h-3 rounded-full bg-indicator-primary/70 border border-[#F8CC2E]" }),
|
|
9758
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-text-600 font-medium text-sm", children: "\xC1rea correta" })
|
|
9583
9759
|
] }),
|
|
9584
|
-
/* @__PURE__ */ (0,
|
|
9585
|
-
/* @__PURE__ */ (0,
|
|
9586
|
-
/* @__PURE__ */ (0,
|
|
9760
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
9761
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-3 h-3 rounded-full bg-success-600/70 border border-white" }),
|
|
9762
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-text-600 font-medium text-sm", children: "Resposta correta" })
|
|
9587
9763
|
] }),
|
|
9588
|
-
/* @__PURE__ */ (0,
|
|
9589
|
-
/* @__PURE__ */ (0,
|
|
9590
|
-
/* @__PURE__ */ (0,
|
|
9764
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
9765
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-3 h-3 rounded-full bg-indicator-error/70 border border-white" }),
|
|
9766
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-text-600 font-medium text-sm", children: "Resposta incorreta" })
|
|
9591
9767
|
] })
|
|
9592
9768
|
]
|
|
9593
9769
|
}
|
|
9594
9770
|
),
|
|
9595
|
-
/* @__PURE__ */ (0,
|
|
9771
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
9596
9772
|
"button",
|
|
9597
9773
|
{
|
|
9598
9774
|
"data-testid": "quiz-image-button",
|
|
@@ -9607,7 +9783,7 @@ var QuizImageQuestion = ({ paddingBottom }) => {
|
|
|
9607
9783
|
},
|
|
9608
9784
|
"aria-label": "\xC1rea da imagem interativa",
|
|
9609
9785
|
children: [
|
|
9610
|
-
/* @__PURE__ */ (0,
|
|
9786
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9611
9787
|
"img",
|
|
9612
9788
|
{
|
|
9613
9789
|
"data-testid": "quiz-image",
|
|
@@ -9616,7 +9792,7 @@ var QuizImageQuestion = ({ paddingBottom }) => {
|
|
|
9616
9792
|
className: "w-full h-auto rounded-md"
|
|
9617
9793
|
}
|
|
9618
9794
|
),
|
|
9619
|
-
variant === "result" && /* @__PURE__ */ (0,
|
|
9795
|
+
variant === "result" && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9620
9796
|
"div",
|
|
9621
9797
|
{
|
|
9622
9798
|
"data-testid": "quiz-correct-circle",
|
|
@@ -9631,7 +9807,7 @@ var QuizImageQuestion = ({ paddingBottom }) => {
|
|
|
9631
9807
|
}
|
|
9632
9808
|
}
|
|
9633
9809
|
),
|
|
9634
|
-
clickPositionRelative && /* @__PURE__ */ (0,
|
|
9810
|
+
clickPositionRelative && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9635
9811
|
"div",
|
|
9636
9812
|
{
|
|
9637
9813
|
"data-testid": "quiz-user-circle",
|
|
@@ -9699,18 +9875,18 @@ var QuizQuestionList = ({
|
|
|
9699
9875
|
return "Em branco";
|
|
9700
9876
|
}
|
|
9701
9877
|
};
|
|
9702
|
-
return /* @__PURE__ */ (0,
|
|
9703
|
-
Object.entries(filteredGroupedQuestions).length == 0 && /* @__PURE__ */ (0,
|
|
9878
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "space-y-6 px-4 h-full", children: [
|
|
9879
|
+
Object.entries(filteredGroupedQuestions).length == 0 && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex items-center justify-center text-gray-500 py-8 h-full", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-lg", children: "Nenhum resultado" }) }),
|
|
9704
9880
|
Object.entries(filteredGroupedQuestions).map(
|
|
9705
|
-
([subjectId, questions]) => /* @__PURE__ */ (0,
|
|
9706
|
-
/* @__PURE__ */ (0,
|
|
9707
|
-
/* @__PURE__ */ (0,
|
|
9708
|
-
/* @__PURE__ */ (0,
|
|
9881
|
+
([subjectId, questions]) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("section", { className: "flex flex-col gap-2", children: [
|
|
9882
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("span", { className: "pt-6 pb-4 flex flex-row gap-2", children: [
|
|
9883
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "bg-primary-500 p-1 rounded-sm flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.BookOpen, { size: 17, className: "text-white" }) }),
|
|
9884
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-800 font-bold text-lg", children: questions?.[0]?.knowledgeMatrix?.[0]?.subject?.name ?? "Sem mat\xE9ria" })
|
|
9709
9885
|
] }),
|
|
9710
|
-
/* @__PURE__ */ (0,
|
|
9886
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("ul", { className: "flex flex-col gap-2", children: questions.map((question) => {
|
|
9711
9887
|
const status = getQuestionStatus(question.id);
|
|
9712
9888
|
const questionNumber = getQuestionIndex(question.id);
|
|
9713
|
-
return /* @__PURE__ */ (0,
|
|
9889
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9714
9890
|
CardStatus,
|
|
9715
9891
|
{
|
|
9716
9892
|
header: `Quest\xE3o ${questionNumber.toString().padStart(2, "0")}`,
|
|
@@ -9727,7 +9903,7 @@ var QuizQuestionList = ({
|
|
|
9727
9903
|
)
|
|
9728
9904
|
] });
|
|
9729
9905
|
};
|
|
9730
|
-
var QuizFooter = (0,
|
|
9906
|
+
var QuizFooter = (0, import_react30.forwardRef)(
|
|
9731
9907
|
({
|
|
9732
9908
|
className,
|
|
9733
9909
|
onGoToSimulated,
|
|
@@ -9755,11 +9931,11 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9755
9931
|
const currentAnswer = getCurrentAnswer();
|
|
9756
9932
|
const currentQuestion = getCurrentQuestion();
|
|
9757
9933
|
const isCurrentQuestionSkipped = currentQuestion ? getQuestionStatusFromUserAnswers(currentQuestion.id) === "skipped" : false;
|
|
9758
|
-
const [alertDialogOpen, setAlertDialogOpen] = (0,
|
|
9759
|
-
const [modalResultOpen, setModalResultOpen] = (0,
|
|
9760
|
-
const [modalNavigateOpen, setModalNavigateOpen] = (0,
|
|
9761
|
-
const [modalResolutionOpen, setModalResolutionOpen] = (0,
|
|
9762
|
-
const [filterType, setFilterType] = (0,
|
|
9934
|
+
const [alertDialogOpen, setAlertDialogOpen] = (0, import_react30.useState)(false);
|
|
9935
|
+
const [modalResultOpen, setModalResultOpen] = (0, import_react30.useState)(false);
|
|
9936
|
+
const [modalNavigateOpen, setModalNavigateOpen] = (0, import_react30.useState)(false);
|
|
9937
|
+
const [modalResolutionOpen, setModalResolutionOpen] = (0, import_react30.useState)(false);
|
|
9938
|
+
const [filterType, setFilterType] = (0, import_react30.useState)("all");
|
|
9763
9939
|
const unansweredQuestions = getUnansweredQuestionsFromUserAnswers();
|
|
9764
9940
|
const allQuestions = getTotalQuestions();
|
|
9765
9941
|
const handleFinishQuiz = async () => {
|
|
@@ -9790,8 +9966,8 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9790
9966
|
return;
|
|
9791
9967
|
}
|
|
9792
9968
|
};
|
|
9793
|
-
return /* @__PURE__ */ (0,
|
|
9794
|
-
/* @__PURE__ */ (0,
|
|
9969
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9970
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9795
9971
|
"footer",
|
|
9796
9972
|
{
|
|
9797
9973
|
ref,
|
|
@@ -9800,17 +9976,17 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9800
9976
|
className
|
|
9801
9977
|
),
|
|
9802
9978
|
...props,
|
|
9803
|
-
children: variant === "default" ? /* @__PURE__ */ (0,
|
|
9804
|
-
/* @__PURE__ */ (0,
|
|
9805
|
-
/* @__PURE__ */ (0,
|
|
9979
|
+
children: variant === "default" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
9980
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-row items-center gap-1", children: [
|
|
9981
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9806
9982
|
IconButton_default,
|
|
9807
9983
|
{
|
|
9808
|
-
icon: /* @__PURE__ */ (0,
|
|
9984
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.SquaresFour, { size: 24, className: "text-text-950" }),
|
|
9809
9985
|
size: "md",
|
|
9810
9986
|
onClick: () => setModalNavigateOpen(true)
|
|
9811
9987
|
}
|
|
9812
9988
|
),
|
|
9813
|
-
isFirstQuestion ? /* @__PURE__ */ (0,
|
|
9989
|
+
isFirstQuestion ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9814
9990
|
Button_default,
|
|
9815
9991
|
{
|
|
9816
9992
|
variant: "outline",
|
|
@@ -9821,13 +9997,13 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9821
9997
|
},
|
|
9822
9998
|
children: "Pular"
|
|
9823
9999
|
}
|
|
9824
|
-
) : /* @__PURE__ */ (0,
|
|
10000
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9825
10001
|
Button_default,
|
|
9826
10002
|
{
|
|
9827
10003
|
size: "medium",
|
|
9828
10004
|
variant: "link",
|
|
9829
10005
|
action: "primary",
|
|
9830
|
-
iconLeft: /* @__PURE__ */ (0,
|
|
10006
|
+
iconLeft: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.CaretLeft, { size: 18 }),
|
|
9831
10007
|
onClick: () => {
|
|
9832
10008
|
goToPreviousQuestion();
|
|
9833
10009
|
},
|
|
@@ -9835,7 +10011,7 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9835
10011
|
}
|
|
9836
10012
|
)
|
|
9837
10013
|
] }),
|
|
9838
|
-
!isFirstQuestion && !isLastQuestion && /* @__PURE__ */ (0,
|
|
10014
|
+
!isFirstQuestion && !isLastQuestion && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9839
10015
|
Button_default,
|
|
9840
10016
|
{
|
|
9841
10017
|
size: "small",
|
|
@@ -9848,7 +10024,7 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9848
10024
|
children: "Pular"
|
|
9849
10025
|
}
|
|
9850
10026
|
),
|
|
9851
|
-
isLastQuestion ? /* @__PURE__ */ (0,
|
|
10027
|
+
isLastQuestion ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9852
10028
|
Button_default,
|
|
9853
10029
|
{
|
|
9854
10030
|
size: "medium",
|
|
@@ -9858,13 +10034,13 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9858
10034
|
onClick: handleFinishQuiz,
|
|
9859
10035
|
children: "Finalizar"
|
|
9860
10036
|
}
|
|
9861
|
-
) : /* @__PURE__ */ (0,
|
|
10037
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9862
10038
|
Button_default,
|
|
9863
10039
|
{
|
|
9864
10040
|
size: "medium",
|
|
9865
10041
|
variant: "link",
|
|
9866
10042
|
action: "primary",
|
|
9867
|
-
iconRight: /* @__PURE__ */ (0,
|
|
10043
|
+
iconRight: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.CaretRight, { size: 18 }),
|
|
9868
10044
|
disabled: !currentAnswer && !isCurrentQuestionSkipped,
|
|
9869
10045
|
onClick: () => {
|
|
9870
10046
|
goToNextQuestion();
|
|
@@ -9872,7 +10048,7 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9872
10048
|
children: "Avan\xE7ar"
|
|
9873
10049
|
}
|
|
9874
10050
|
)
|
|
9875
|
-
] }) : /* @__PURE__ */ (0,
|
|
10051
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-row items-center justify-end w-full", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9876
10052
|
Button_default,
|
|
9877
10053
|
{
|
|
9878
10054
|
variant: "solid",
|
|
@@ -9884,7 +10060,7 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9884
10060
|
) })
|
|
9885
10061
|
}
|
|
9886
10062
|
),
|
|
9887
|
-
/* @__PURE__ */ (0,
|
|
10063
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9888
10064
|
AlertDialog,
|
|
9889
10065
|
{
|
|
9890
10066
|
isOpen: alertDialogOpen,
|
|
@@ -9896,7 +10072,7 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9896
10072
|
onSubmit: handleAlertSubmit
|
|
9897
10073
|
}
|
|
9898
10074
|
),
|
|
9899
|
-
/* @__PURE__ */ (0,
|
|
10075
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9900
10076
|
Modal_default,
|
|
9901
10077
|
{
|
|
9902
10078
|
isOpen: modalResultOpen,
|
|
@@ -9906,11 +10082,11 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9906
10082
|
closeOnEscape: false,
|
|
9907
10083
|
hideCloseButton: true,
|
|
9908
10084
|
size: "md",
|
|
9909
|
-
children: /* @__PURE__ */ (0,
|
|
9910
|
-
resultImageComponent ? /* @__PURE__ */ (0,
|
|
9911
|
-
/* @__PURE__ */ (0,
|
|
9912
|
-
/* @__PURE__ */ (0,
|
|
9913
|
-
/* @__PURE__ */ (0,
|
|
10085
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col w-full h-full items-center justify-center gap-4", children: [
|
|
10086
|
+
resultImageComponent ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-[282px] h-auto", children: resultImageComponent }) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "w-[282px] h-[200px] bg-gray-100 rounded-md flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-gray-500 text-sm", children: "Imagem de resultado" }) }),
|
|
10087
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col gap-2 text-center", children: [
|
|
10088
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("h2", { className: "text-text-950 font-bold text-lg", children: "Voc\xEA concluiu o simulado!" }),
|
|
10089
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("p", { className: "text-text-500 font-sm", children: [
|
|
9914
10090
|
"Voc\xEA acertou",
|
|
9915
10091
|
" ",
|
|
9916
10092
|
getQuestionResultStatistics()?.correctAnswers ?? "--",
|
|
@@ -9920,8 +10096,8 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9920
10096
|
" quest\xF5es."
|
|
9921
10097
|
] })
|
|
9922
10098
|
] }),
|
|
9923
|
-
/* @__PURE__ */ (0,
|
|
9924
|
-
/* @__PURE__ */ (0,
|
|
10099
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "px-6 flex flex-row items-center gap-2 w-full", children: [
|
|
10100
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9925
10101
|
Button_default,
|
|
9926
10102
|
{
|
|
9927
10103
|
variant: "outline",
|
|
@@ -9931,38 +10107,38 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9931
10107
|
children: "Ir para simulados"
|
|
9932
10108
|
}
|
|
9933
10109
|
),
|
|
9934
|
-
/* @__PURE__ */ (0,
|
|
10110
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Button_default, { className: "w-full", onClick: onDetailResult, children: "Detalhar resultado" })
|
|
9935
10111
|
] })
|
|
9936
10112
|
] })
|
|
9937
10113
|
}
|
|
9938
10114
|
),
|
|
9939
|
-
/* @__PURE__ */ (0,
|
|
10115
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9940
10116
|
Modal_default,
|
|
9941
10117
|
{
|
|
9942
10118
|
isOpen: modalNavigateOpen,
|
|
9943
10119
|
onClose: () => setModalNavigateOpen(false),
|
|
9944
10120
|
title: "Quest\xF5es",
|
|
9945
10121
|
size: "lg",
|
|
9946
|
-
children: /* @__PURE__ */ (0,
|
|
9947
|
-
/* @__PURE__ */ (0,
|
|
9948
|
-
/* @__PURE__ */ (0,
|
|
9949
|
-
/* @__PURE__ */ (0,
|
|
9950
|
-
/* @__PURE__ */ (0,
|
|
10122
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col w-full not-lg:h-[calc(100vh-200px)] lg:max-h-[687px] lg:h-[687px]", children: [
|
|
10123
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-row justify-between items-center py-6 pt-6 pb-4 border-b border-border-200 flex-shrink-0", children: [
|
|
10124
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-950 font-bold text-lg", children: "Filtrar por" }),
|
|
10125
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "max-w-[266px]", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(Select_default, { value: filterType, onValueChange: setFilterType, children: [
|
|
10126
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9951
10127
|
SelectTrigger,
|
|
9952
10128
|
{
|
|
9953
10129
|
variant: "rounded",
|
|
9954
10130
|
className: "max-w-[266px] min-w-[160px]",
|
|
9955
|
-
children: /* @__PURE__ */ (0,
|
|
10131
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, { placeholder: "Selecione uma op\xE7\xE3o" })
|
|
9956
10132
|
}
|
|
9957
10133
|
),
|
|
9958
|
-
/* @__PURE__ */ (0,
|
|
9959
|
-
/* @__PURE__ */ (0,
|
|
9960
|
-
/* @__PURE__ */ (0,
|
|
9961
|
-
/* @__PURE__ */ (0,
|
|
10134
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(SelectContent, { children: [
|
|
10135
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: "all", children: "Todas" }),
|
|
10136
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: "unanswered", children: "Em branco" }),
|
|
10137
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: "answered", children: "Respondidas" })
|
|
9962
10138
|
] })
|
|
9963
10139
|
] }) })
|
|
9964
10140
|
] }),
|
|
9965
|
-
/* @__PURE__ */ (0,
|
|
10141
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-col gap-2 flex-1 min-h-0 overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9966
10142
|
QuizQuestionList,
|
|
9967
10143
|
{
|
|
9968
10144
|
filterType,
|
|
@@ -9972,7 +10148,7 @@ var QuizFooter = (0, import_react29.forwardRef)(
|
|
|
9972
10148
|
] })
|
|
9973
10149
|
}
|
|
9974
10150
|
),
|
|
9975
|
-
/* @__PURE__ */ (0,
|
|
10151
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
9976
10152
|
Modal_default,
|
|
9977
10153
|
{
|
|
9978
10154
|
isOpen: modalResolutionOpen,
|
|
@@ -9990,40 +10166,40 @@ var QuizBadge = ({
|
|
|
9990
10166
|
}) => {
|
|
9991
10167
|
switch (subtype) {
|
|
9992
10168
|
case "PROVA" /* PROVA */:
|
|
9993
|
-
return /* @__PURE__ */ (0,
|
|
10169
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "examsOutlined", action: "exam2", "data-testid": "quiz-badge", children: "Prova" });
|
|
9994
10170
|
case "ENEM_PROVA_1" /* ENEM_PROVA_1 */:
|
|
9995
10171
|
case "ENEM_PROVA_2" /* ENEM_PROVA_2 */:
|
|
9996
|
-
return /* @__PURE__ */ (0,
|
|
10172
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "examsOutlined", action: "exam1", "data-testid": "quiz-badge", children: "Enem" });
|
|
9997
10173
|
case "VESTIBULAR" /* VESTIBULAR */:
|
|
9998
|
-
return /* @__PURE__ */ (0,
|
|
10174
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "examsOutlined", action: "exam4", "data-testid": "quiz-badge", children: "Vestibular" });
|
|
9999
10175
|
case "SIMULADO" /* SIMULADO */:
|
|
10000
10176
|
case "SIMULADAO" /* SIMULADAO */:
|
|
10001
10177
|
case void 0:
|
|
10002
|
-
return /* @__PURE__ */ (0,
|
|
10178
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "examsOutlined", action: "exam3", "data-testid": "quiz-badge", children: "Simulad\xE3o" });
|
|
10003
10179
|
default:
|
|
10004
|
-
return /* @__PURE__ */ (0,
|
|
10180
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Badge_default, { variant: "solid", action: "info", "data-testid": "quiz-badge", children: subtype });
|
|
10005
10181
|
}
|
|
10006
10182
|
};
|
|
10007
|
-
var QuizResultHeaderTitle = (0,
|
|
10183
|
+
var QuizResultHeaderTitle = (0, import_react30.forwardRef)(({ className, ...props }, ref) => {
|
|
10008
10184
|
const { getActiveQuiz } = useQuizStore();
|
|
10009
10185
|
const activeQuiz = getActiveQuiz();
|
|
10010
|
-
return /* @__PURE__ */ (0,
|
|
10186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
10011
10187
|
"div",
|
|
10012
10188
|
{
|
|
10013
10189
|
ref,
|
|
10014
10190
|
className: cn("flex flex-row pt-4 justify-between", className),
|
|
10015
10191
|
...props,
|
|
10016
10192
|
children: [
|
|
10017
|
-
/* @__PURE__ */ (0,
|
|
10018
|
-
/* @__PURE__ */ (0,
|
|
10193
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-950 font-bold text-2xl", children: "Resultado" }),
|
|
10194
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(QuizBadge, { subtype: activeQuiz?.quiz.subtype || void 0 })
|
|
10019
10195
|
]
|
|
10020
10196
|
}
|
|
10021
10197
|
);
|
|
10022
10198
|
});
|
|
10023
|
-
var QuizResultTitle = (0,
|
|
10199
|
+
var QuizResultTitle = (0, import_react30.forwardRef)(({ className, ...props }, ref) => {
|
|
10024
10200
|
const { getQuizTitle } = useQuizStore();
|
|
10025
10201
|
const quizTitle = getQuizTitle();
|
|
10026
|
-
return /* @__PURE__ */ (0,
|
|
10202
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10027
10203
|
"p",
|
|
10028
10204
|
{
|
|
10029
10205
|
className: cn("pt-6 pb-4 text-text-950 font-bold text-lg", className),
|
|
@@ -10033,7 +10209,7 @@ var QuizResultTitle = (0, import_react29.forwardRef)(({ className, ...props }, r
|
|
|
10033
10209
|
}
|
|
10034
10210
|
);
|
|
10035
10211
|
});
|
|
10036
|
-
var QuizResultPerformance = (0,
|
|
10212
|
+
var QuizResultPerformance = (0, import_react30.forwardRef)(
|
|
10037
10213
|
({ ...props }, ref) => {
|
|
10038
10214
|
const {
|
|
10039
10215
|
getTotalQuestions,
|
|
@@ -10075,15 +10251,15 @@ var QuizResultPerformance = (0, import_react29.forwardRef)(
|
|
|
10075
10251
|
});
|
|
10076
10252
|
}
|
|
10077
10253
|
const percentage = totalQuestions > 0 ? Math.round(correctAnswers / totalQuestions * 100) : 0;
|
|
10078
|
-
return /* @__PURE__ */ (0,
|
|
10254
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
10079
10255
|
"div",
|
|
10080
10256
|
{
|
|
10081
10257
|
className: "flex flex-row gap-6 p-6 rounded-xl bg-background justify-between",
|
|
10082
10258
|
ref,
|
|
10083
10259
|
...props,
|
|
10084
10260
|
children: [
|
|
10085
|
-
/* @__PURE__ */ (0,
|
|
10086
|
-
/* @__PURE__ */ (0,
|
|
10261
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "relative", children: [
|
|
10262
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10087
10263
|
ProgressCircle_default,
|
|
10088
10264
|
{
|
|
10089
10265
|
size: "medium",
|
|
@@ -10093,24 +10269,24 @@ var QuizResultPerformance = (0, import_react29.forwardRef)(
|
|
|
10093
10269
|
label: ""
|
|
10094
10270
|
}
|
|
10095
10271
|
),
|
|
10096
|
-
/* @__PURE__ */ (0,
|
|
10097
|
-
/* @__PURE__ */ (0,
|
|
10098
|
-
/* @__PURE__ */ (0,
|
|
10099
|
-
/* @__PURE__ */ (0,
|
|
10272
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
|
|
10273
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-1 mb-1", children: [
|
|
10274
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_phosphor_react20.Clock, { size: 12, weight: "regular", className: "text-text-800" }),
|
|
10275
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-2xs font-medium text-text-800", children: formatTime2(
|
|
10100
10276
|
(getQuestionResultStatistics()?.timeSpent ?? 0) * 60
|
|
10101
10277
|
) })
|
|
10102
10278
|
] }),
|
|
10103
|
-
/* @__PURE__ */ (0,
|
|
10279
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "text-2xl font-medium text-text-800 leading-7", children: [
|
|
10104
10280
|
getQuestionResultStatistics()?.correctAnswers ?? "--",
|
|
10105
10281
|
" de",
|
|
10106
10282
|
" ",
|
|
10107
10283
|
totalQuestions
|
|
10108
10284
|
] }),
|
|
10109
|
-
/* @__PURE__ */ (0,
|
|
10285
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "text-2xs font-medium text-text-600 mt-1", children: "Corretas" })
|
|
10110
10286
|
] })
|
|
10111
10287
|
] }),
|
|
10112
|
-
/* @__PURE__ */ (0,
|
|
10113
|
-
/* @__PURE__ */ (0,
|
|
10288
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col gap-4 w-full", children: [
|
|
10289
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10114
10290
|
ProgressBar_default,
|
|
10115
10291
|
{
|
|
10116
10292
|
className: "w-full",
|
|
@@ -10124,7 +10300,7 @@ var QuizResultPerformance = (0, import_react29.forwardRef)(
|
|
|
10124
10300
|
percentageClassName: "text-xs font-medium leading-[14px] text-right"
|
|
10125
10301
|
}
|
|
10126
10302
|
),
|
|
10127
|
-
/* @__PURE__ */ (0,
|
|
10303
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10128
10304
|
ProgressBar_default,
|
|
10129
10305
|
{
|
|
10130
10306
|
className: "w-full",
|
|
@@ -10138,7 +10314,7 @@ var QuizResultPerformance = (0, import_react29.forwardRef)(
|
|
|
10138
10314
|
percentageClassName: "text-xs font-medium leading-[14px] text-right"
|
|
10139
10315
|
}
|
|
10140
10316
|
),
|
|
10141
|
-
/* @__PURE__ */ (0,
|
|
10317
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10142
10318
|
ProgressBar_default,
|
|
10143
10319
|
{
|
|
10144
10320
|
className: "w-full",
|
|
@@ -10158,7 +10334,7 @@ var QuizResultPerformance = (0, import_react29.forwardRef)(
|
|
|
10158
10334
|
);
|
|
10159
10335
|
}
|
|
10160
10336
|
);
|
|
10161
|
-
var QuizListResult = (0,
|
|
10337
|
+
var QuizListResult = (0, import_react30.forwardRef)(({ className, onSubjectClick, ...props }, ref) => {
|
|
10162
10338
|
const { getQuestionsGroupedBySubject } = useQuizStore();
|
|
10163
10339
|
const groupedQuestions = getQuestionsGroupedBySubject();
|
|
10164
10340
|
const subjectsStats = Object.entries(groupedQuestions).map(
|
|
@@ -10185,9 +10361,9 @@ var QuizListResult = (0, import_react29.forwardRef)(({ className, onSubjectClick
|
|
|
10185
10361
|
};
|
|
10186
10362
|
}
|
|
10187
10363
|
);
|
|
10188
|
-
return /* @__PURE__ */ (0,
|
|
10189
|
-
/* @__PURE__ */ (0,
|
|
10190
|
-
/* @__PURE__ */ (0,
|
|
10364
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("section", { ref, className, ...props, children: [
|
|
10365
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "pt-6 pb-4 text-text-950 font-bold text-lg", children: "Mat\xE9rias" }),
|
|
10366
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("ul", { className: "flex flex-col gap-2", children: subjectsStats.map((subject) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10191
10367
|
CardResults,
|
|
10192
10368
|
{
|
|
10193
10369
|
onClick: () => onSubjectClick?.(subject.subject.id),
|
|
@@ -10209,16 +10385,16 @@ var QuizListResultByMateria = ({
|
|
|
10209
10385
|
const { getQuestionsGroupedBySubject, getQuestionIndex } = useQuizStore();
|
|
10210
10386
|
const groupedQuestions = getQuestionsGroupedBySubject();
|
|
10211
10387
|
const answeredQuestions = groupedQuestions[subject] || [];
|
|
10212
|
-
return /* @__PURE__ */ (0,
|
|
10213
|
-
/* @__PURE__ */ (0,
|
|
10214
|
-
/* @__PURE__ */ (0,
|
|
10215
|
-
/* @__PURE__ */ (0,
|
|
10216
|
-
/* @__PURE__ */ (0,
|
|
10388
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col", children: [
|
|
10389
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "flex flex-row pt-4 justify-between", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-text-950 font-bold text-2xl", children: answeredQuestions?.[0]?.knowledgeMatrix?.[0]?.subject?.name ?? "Sem mat\xE9ria" }) }),
|
|
10390
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("section", { className: "flex flex-col ", children: [
|
|
10391
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "pt-6 pb-4 text-text-950 font-bold text-lg", children: "Resultado das quest\xF5es" }),
|
|
10392
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("ul", { className: "flex flex-col gap-2 pt-4", children: answeredQuestions.map((question) => {
|
|
10217
10393
|
const questionIndex = getQuestionIndex(
|
|
10218
10394
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10219
10395
|
question.questionId ?? question.id
|
|
10220
10396
|
);
|
|
10221
|
-
return /* @__PURE__ */ (0,
|
|
10397
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
10222
10398
|
CardStatus,
|
|
10223
10399
|
{
|
|
10224
10400
|
className: "max-w-full",
|
|
@@ -10241,12 +10417,12 @@ var QuizListResultByMateria = ({
|
|
|
10241
10417
|
};
|
|
10242
10418
|
|
|
10243
10419
|
// src/components/LoadingModal/loadingModal.tsx
|
|
10244
|
-
var
|
|
10245
|
-
var
|
|
10246
|
-
var LoadingModal = (0,
|
|
10420
|
+
var import_react31 = require("react");
|
|
10421
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
10422
|
+
var LoadingModal = (0, import_react31.forwardRef)(
|
|
10247
10423
|
({ open, title = "Titulo...", subtitle = "Subtitulo...", ...props }, ref) => {
|
|
10248
10424
|
if (!open) return null;
|
|
10249
|
-
return /* @__PURE__ */ (0,
|
|
10425
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10250
10426
|
"div",
|
|
10251
10427
|
{
|
|
10252
10428
|
ref,
|
|
@@ -10255,8 +10431,8 @@ var LoadingModal = (0, import_react30.forwardRef)(
|
|
|
10255
10431
|
"aria-describedby": "loading-modal-subtitle",
|
|
10256
10432
|
className: "fixed inset-0 z-50 flex items-center justify-center bg-background/90 backdrop-blur-xs",
|
|
10257
10433
|
...props,
|
|
10258
|
-
children: /* @__PURE__ */ (0,
|
|
10259
|
-
/* @__PURE__ */ (0,
|
|
10434
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "w-full max-w-[364px] flex flex-col items-center justify-center gap-14", children: [
|
|
10435
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "animate-spin", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10260
10436
|
"svg",
|
|
10261
10437
|
{
|
|
10262
10438
|
width: "102",
|
|
@@ -10267,14 +10443,14 @@ var LoadingModal = (0, import_react30.forwardRef)(
|
|
|
10267
10443
|
"aria-hidden": "true",
|
|
10268
10444
|
focusable: false,
|
|
10269
10445
|
children: [
|
|
10270
|
-
/* @__PURE__ */ (0,
|
|
10446
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10271
10447
|
"path",
|
|
10272
10448
|
{
|
|
10273
10449
|
d: "M101.5 51C101.5 78.8904 78.8904 101.5 51 101.5C23.1096 101.5 0.5 78.8904 0.5 51C0.5 23.1096 23.1096 0.5 51 0.5C78.8904 0.5 101.5 23.1096 101.5 51ZM8.62286 51C8.62286 74.4043 27.5957 93.3771 51 93.3771C74.4043 93.3771 93.3771 74.4043 93.3771 51C93.3771 27.5957 74.4043 8.62286 51 8.62286C27.5957 8.62286 8.62286 27.5957 8.62286 51Z",
|
|
10274
10450
|
className: "fill-primary-100"
|
|
10275
10451
|
}
|
|
10276
10452
|
),
|
|
10277
|
-
/* @__PURE__ */ (0,
|
|
10453
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10278
10454
|
"path",
|
|
10279
10455
|
{
|
|
10280
10456
|
d: "M97.4386 51C99.6816 51 101.517 52.8213 101.337 55.0571C100.754 62.2833 98.6212 69.3162 95.0643 75.6696C90.8444 83.207 84.7616 89.536 77.3975 94.0514C70.0333 98.5668 61.6339 101.118 53.0024 101.46C44.371 101.803 35.7959 99.9255 28.0971 96.0078C20.3982 92.0902 13.833 86.2631 9.02917 79.0838C4.22529 71.9045 1.34332 63.6129 0.658804 55.0017C-0.0257159 46.3906 1.51009 37.7479 5.1194 29.8997C8.16173 23.2845 12.5915 17.4202 18.0904 12.6959C19.7917 11.2341 22.3444 11.6457 23.6647 13.459C24.9851 15.2723 24.5702 17.7988 22.8916 19.2866C18.5048 23.1747 14.9608 27.9413 12.4992 33.2937C9.47048 39.8794 8.1817 47.132 8.75612 54.3581C9.33053 61.5841 11.7489 68.542 15.7801 74.5666C19.8113 80.5911 25.3205 85.4809 31.781 88.7684C38.2414 92.0559 45.4372 93.6312 52.6804 93.3438C59.9235 93.0564 66.9718 90.9158 73.1515 87.1267C79.3311 83.3375 84.4355 78.0266 87.9766 71.7015C90.8546 66.561 92.6217 60.8903 93.1827 55.0553C93.3973 52.8225 95.1955 51 97.4386 51Z",
|
|
@@ -10284,9 +10460,9 @@ var LoadingModal = (0, import_react30.forwardRef)(
|
|
|
10284
10460
|
]
|
|
10285
10461
|
}
|
|
10286
10462
|
) }),
|
|
10287
|
-
/* @__PURE__ */ (0,
|
|
10288
|
-
/* @__PURE__ */ (0,
|
|
10289
|
-
/* @__PURE__ */ (0,
|
|
10463
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("span", { className: "flex flex-col gap-4 text-center", children: [
|
|
10464
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { id: "loading-modal-title", className: "text-text-950 text-lg", children: title }),
|
|
10465
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { id: "loading-modal-subtitle", className: "text-text-600 text-lg", children: subtitle })
|
|
10290
10466
|
] })
|
|
10291
10467
|
] })
|
|
10292
10468
|
}
|
|
@@ -10297,7 +10473,7 @@ var loadingModal_default = LoadingModal;
|
|
|
10297
10473
|
|
|
10298
10474
|
// src/components/NotificationCard/NotificationCard.tsx
|
|
10299
10475
|
var import_phosphor_react21 = require("phosphor-react");
|
|
10300
|
-
var
|
|
10476
|
+
var import_react32 = require("react");
|
|
10301
10477
|
|
|
10302
10478
|
// src/store/notificationStore.ts
|
|
10303
10479
|
var import_zustand8 = require("zustand");
|
|
@@ -10540,14 +10716,14 @@ var createNotificationStore = (apiClient) => {
|
|
|
10540
10716
|
};
|
|
10541
10717
|
|
|
10542
10718
|
// src/components/NotificationCard/NotificationCard.tsx
|
|
10543
|
-
var
|
|
10719
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
10544
10720
|
var NotificationEmpty = ({
|
|
10545
10721
|
emptyStateImage,
|
|
10546
10722
|
emptyStateTitle = "Nenhuma notifica\xE7\xE3o no momento",
|
|
10547
10723
|
emptyStateDescription = "Voc\xEA est\xE1 em dia com todas as novidades. Volte depois para conferir atualiza\xE7\xF5es!"
|
|
10548
10724
|
}) => {
|
|
10549
|
-
return /* @__PURE__ */ (0,
|
|
10550
|
-
emptyStateImage && /* @__PURE__ */ (0,
|
|
10725
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col items-center justify-center gap-4 p-6 w-full", children: [
|
|
10726
|
+
emptyStateImage && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-20 h-20 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10551
10727
|
"img",
|
|
10552
10728
|
{
|
|
10553
10729
|
src: emptyStateImage,
|
|
@@ -10557,17 +10733,17 @@ var NotificationEmpty = ({
|
|
|
10557
10733
|
className: "object-contain"
|
|
10558
10734
|
}
|
|
10559
10735
|
) }),
|
|
10560
|
-
/* @__PURE__ */ (0,
|
|
10561
|
-
/* @__PURE__ */ (0,
|
|
10736
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h3", { className: "text-xl font-semibold text-text-950 text-center leading-[23px]", children: emptyStateTitle }),
|
|
10737
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "text-sm font-normal text-text-400 text-center max-w-[316px] leading-[21px]", children: emptyStateDescription })
|
|
10562
10738
|
] });
|
|
10563
10739
|
};
|
|
10564
10740
|
var NotificationHeader = ({
|
|
10565
10741
|
unreadCount,
|
|
10566
10742
|
variant = "modal"
|
|
10567
10743
|
}) => {
|
|
10568
|
-
return /* @__PURE__ */ (0,
|
|
10569
|
-
variant === "modal" ? /* @__PURE__ */ (0,
|
|
10570
|
-
unreadCount > 0 && /* @__PURE__ */ (0,
|
|
10744
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
10745
|
+
variant === "modal" ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Text_default, { size: "sm", weight: "bold", className: "text-text-950", children: "Notifica\xE7\xF5es" }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h3", { className: "text-sm font-semibold text-text-950", children: "Notifica\xE7\xF5es" }),
|
|
10746
|
+
unreadCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "px-2 py-1 bg-info-100 text-info-700 text-xs rounded-full", children: [
|
|
10571
10747
|
unreadCount,
|
|
10572
10748
|
" n\xE3o lidas"
|
|
10573
10749
|
] })
|
|
@@ -10602,7 +10778,7 @@ var SingleNotificationCard = ({
|
|
|
10602
10778
|
onNavigate();
|
|
10603
10779
|
}
|
|
10604
10780
|
};
|
|
10605
|
-
return /* @__PURE__ */ (0,
|
|
10781
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
10606
10782
|
"div",
|
|
10607
10783
|
{
|
|
10608
10784
|
className: cn(
|
|
@@ -10611,20 +10787,20 @@ var SingleNotificationCard = ({
|
|
|
10611
10787
|
className
|
|
10612
10788
|
),
|
|
10613
10789
|
children: [
|
|
10614
|
-
/* @__PURE__ */ (0,
|
|
10615
|
-
!isRead && /* @__PURE__ */ (0,
|
|
10616
|
-
/* @__PURE__ */ (0,
|
|
10617
|
-
/* @__PURE__ */ (0,
|
|
10618
|
-
/* @__PURE__ */ (0,
|
|
10790
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center gap-2 w-full", children: [
|
|
10791
|
+
!isRead && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-[7px] h-[7px] bg-info-300 rounded-full flex-shrink-0" }),
|
|
10792
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h3", { className: "font-bold text-sm leading-4 text-text-950 flex-grow", children: title }),
|
|
10793
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(DropdownMenu_default, { children: [
|
|
10794
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10619
10795
|
DropdownMenuTrigger,
|
|
10620
10796
|
{
|
|
10621
10797
|
className: "flex-shrink-0 inline-flex items-center justify-center font-medium bg-transparent text-text-950 cursor-pointer hover:bg-info-50 w-6 h-6 rounded-lg",
|
|
10622
10798
|
"aria-label": "Menu de a\xE7\xF5es",
|
|
10623
|
-
children: /* @__PURE__ */ (0,
|
|
10799
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_phosphor_react21.DotsThreeVertical, { size: 24 })
|
|
10624
10800
|
}
|
|
10625
10801
|
),
|
|
10626
|
-
/* @__PURE__ */ (0,
|
|
10627
|
-
!isRead && /* @__PURE__ */ (0,
|
|
10802
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(DropdownMenuContent, { align: "end", className: "min-w-[160px]", children: [
|
|
10803
|
+
!isRead && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10628
10804
|
DropdownMenuItem,
|
|
10629
10805
|
{
|
|
10630
10806
|
onClick: handleMarkAsRead,
|
|
@@ -10632,14 +10808,14 @@ var SingleNotificationCard = ({
|
|
|
10632
10808
|
children: "Marcar como lida"
|
|
10633
10809
|
}
|
|
10634
10810
|
),
|
|
10635
|
-
/* @__PURE__ */ (0,
|
|
10811
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DropdownMenuItem, { onClick: handleDelete, className: "text-error-600", children: "Deletar" })
|
|
10636
10812
|
] })
|
|
10637
10813
|
] })
|
|
10638
10814
|
] }),
|
|
10639
|
-
/* @__PURE__ */ (0,
|
|
10640
|
-
/* @__PURE__ */ (0,
|
|
10641
|
-
/* @__PURE__ */ (0,
|
|
10642
|
-
onNavigate && actionLabel && /* @__PURE__ */ (0,
|
|
10815
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "text-sm leading-[21px] text-text-800 w-full", children: message }),
|
|
10816
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center justify-between w-full", children: [
|
|
10817
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-sm font-medium text-text-400", children: time }),
|
|
10818
|
+
onNavigate && actionLabel && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10643
10819
|
"button",
|
|
10644
10820
|
{
|
|
10645
10821
|
type: "button",
|
|
@@ -10666,9 +10842,9 @@ var NotificationList = ({
|
|
|
10666
10842
|
className
|
|
10667
10843
|
}) => {
|
|
10668
10844
|
if (error) {
|
|
10669
|
-
return /* @__PURE__ */ (0,
|
|
10670
|
-
/* @__PURE__ */ (0,
|
|
10671
|
-
onRetry && /* @__PURE__ */ (0,
|
|
10845
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col items-center gap-4 p-6 w-full", children: [
|
|
10846
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "text-sm text-error-600", children: error }),
|
|
10847
|
+
onRetry && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10672
10848
|
"button",
|
|
10673
10849
|
{
|
|
10674
10850
|
type: "button",
|
|
@@ -10680,8 +10856,8 @@ var NotificationList = ({
|
|
|
10680
10856
|
] });
|
|
10681
10857
|
}
|
|
10682
10858
|
if (loading) {
|
|
10683
|
-
return /* @__PURE__ */ (0,
|
|
10684
|
-
(skeletonId) => /* @__PURE__ */ (0,
|
|
10859
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-col gap-0 w-full", children: ["skeleton-first", "skeleton-second", "skeleton-third"].map(
|
|
10860
|
+
(skeletonId) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10685
10861
|
SkeletonCard,
|
|
10686
10862
|
{
|
|
10687
10863
|
className: "p-4 border-b border-border-200"
|
|
@@ -10691,11 +10867,11 @@ var NotificationList = ({
|
|
|
10691
10867
|
) });
|
|
10692
10868
|
}
|
|
10693
10869
|
if (!groupedNotifications || groupedNotifications.length === 0) {
|
|
10694
|
-
return renderEmpty ? /* @__PURE__ */ (0,
|
|
10870
|
+
return renderEmpty ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "w-full", children: renderEmpty() }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(NotificationEmpty, {});
|
|
10695
10871
|
}
|
|
10696
|
-
return /* @__PURE__ */ (0,
|
|
10697
|
-
/* @__PURE__ */ (0,
|
|
10698
|
-
group.notifications.map((notification) => /* @__PURE__ */ (0,
|
|
10872
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cn("flex flex-col gap-0 w-full", className), children: groupedNotifications.map((group, idx) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col", children: [
|
|
10873
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex items-end px-4 py-6 pb-4", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h4", { className: "text-lg font-bold text-text-500 flex-grow", children: group.label }) }),
|
|
10874
|
+
group.notifications.map((notification) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10699
10875
|
SingleNotificationCard,
|
|
10700
10876
|
{
|
|
10701
10877
|
title: notification.title,
|
|
@@ -10736,7 +10912,7 @@ var NotificationCenter = ({
|
|
|
10736
10912
|
className
|
|
10737
10913
|
}) => {
|
|
10738
10914
|
const { isMobile } = useMobile();
|
|
10739
|
-
const [isModalOpen, setIsModalOpen] = (0,
|
|
10915
|
+
const [isModalOpen, setIsModalOpen] = (0, import_react32.useState)(false);
|
|
10740
10916
|
const handleMobileClick = () => {
|
|
10741
10917
|
setIsModalOpen(true);
|
|
10742
10918
|
onFetchNotifications?.();
|
|
@@ -10744,7 +10920,7 @@ var NotificationCenter = ({
|
|
|
10744
10920
|
const handleDesktopClick = () => {
|
|
10745
10921
|
onToggleActive?.();
|
|
10746
10922
|
};
|
|
10747
|
-
(0,
|
|
10923
|
+
(0, import_react32.useEffect)(() => {
|
|
10748
10924
|
if (isActive) {
|
|
10749
10925
|
onFetchNotifications?.();
|
|
10750
10926
|
}
|
|
@@ -10753,7 +10929,7 @@ var NotificationCenter = ({
|
|
|
10753
10929
|
onCleanup?.();
|
|
10754
10930
|
onNavigateById?.(entityType, entityId);
|
|
10755
10931
|
};
|
|
10756
|
-
const renderEmptyState = () => /* @__PURE__ */ (0,
|
|
10932
|
+
const renderEmptyState = () => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10757
10933
|
NotificationEmpty,
|
|
10758
10934
|
{
|
|
10759
10935
|
emptyStateImage,
|
|
@@ -10762,17 +10938,17 @@ var NotificationCenter = ({
|
|
|
10762
10938
|
}
|
|
10763
10939
|
);
|
|
10764
10940
|
if (isMobile) {
|
|
10765
|
-
return /* @__PURE__ */ (0,
|
|
10766
|
-
/* @__PURE__ */ (0,
|
|
10941
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
|
|
10942
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10767
10943
|
IconButton_default,
|
|
10768
10944
|
{
|
|
10769
10945
|
active: isModalOpen,
|
|
10770
10946
|
onClick: handleMobileClick,
|
|
10771
|
-
icon: /* @__PURE__ */ (0,
|
|
10947
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_phosphor_react21.Bell, { size: 24, className: "text-primary" }),
|
|
10772
10948
|
className
|
|
10773
10949
|
}
|
|
10774
10950
|
),
|
|
10775
|
-
/* @__PURE__ */ (0,
|
|
10951
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10776
10952
|
Modal_default,
|
|
10777
10953
|
{
|
|
10778
10954
|
isOpen: isModalOpen,
|
|
@@ -10782,10 +10958,10 @@ var NotificationCenter = ({
|
|
|
10782
10958
|
hideCloseButton: false,
|
|
10783
10959
|
closeOnBackdropClick: true,
|
|
10784
10960
|
closeOnEscape: true,
|
|
10785
|
-
children: /* @__PURE__ */ (0,
|
|
10786
|
-
/* @__PURE__ */ (0,
|
|
10787
|
-
/* @__PURE__ */ (0,
|
|
10788
|
-
unreadCount > 0 && onMarkAllAsRead && /* @__PURE__ */ (0,
|
|
10961
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col h-full max-h-[80vh]", children: [
|
|
10962
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "px-0 pb-3 border-b border-border-200", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
10963
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(NotificationHeader, { unreadCount, variant: "modal" }),
|
|
10964
|
+
unreadCount > 0 && onMarkAllAsRead && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10789
10965
|
"button",
|
|
10790
10966
|
{
|
|
10791
10967
|
type: "button",
|
|
@@ -10795,7 +10971,7 @@ var NotificationCenter = ({
|
|
|
10795
10971
|
}
|
|
10796
10972
|
)
|
|
10797
10973
|
] }) }),
|
|
10798
|
-
/* @__PURE__ */ (0,
|
|
10974
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10799
10975
|
NotificationList,
|
|
10800
10976
|
{
|
|
10801
10977
|
groupedNotifications,
|
|
@@ -10818,13 +10994,13 @@ var NotificationCenter = ({
|
|
|
10818
10994
|
)
|
|
10819
10995
|
] });
|
|
10820
10996
|
}
|
|
10821
|
-
return /* @__PURE__ */ (0,
|
|
10822
|
-
/* @__PURE__ */ (0,
|
|
10997
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(DropdownMenu_default, { children: [
|
|
10998
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DropdownMenuTrigger, { className: "text-primary cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10823
10999
|
IconButton_default,
|
|
10824
11000
|
{
|
|
10825
11001
|
active: isActive,
|
|
10826
11002
|
onClick: handleDesktopClick,
|
|
10827
|
-
icon: /* @__PURE__ */ (0,
|
|
11003
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10828
11004
|
import_phosphor_react21.Bell,
|
|
10829
11005
|
{
|
|
10830
11006
|
size: 24,
|
|
@@ -10834,22 +11010,22 @@ var NotificationCenter = ({
|
|
|
10834
11010
|
className
|
|
10835
11011
|
}
|
|
10836
11012
|
) }),
|
|
10837
|
-
/* @__PURE__ */ (0,
|
|
11013
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10838
11014
|
DropdownMenuContent,
|
|
10839
11015
|
{
|
|
10840
11016
|
className: "min-w-[320px] max-w-[400px] max-h-[500px] overflow-hidden",
|
|
10841
11017
|
side: "bottom",
|
|
10842
11018
|
align: "end",
|
|
10843
|
-
children: /* @__PURE__ */ (0,
|
|
10844
|
-
/* @__PURE__ */ (0,
|
|
10845
|
-
/* @__PURE__ */ (0,
|
|
11019
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col", children: [
|
|
11020
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "px-4 py-3 border-b border-border-200", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
11021
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10846
11022
|
NotificationHeader,
|
|
10847
11023
|
{
|
|
10848
11024
|
unreadCount,
|
|
10849
11025
|
variant: "dropdown"
|
|
10850
11026
|
}
|
|
10851
11027
|
),
|
|
10852
|
-
unreadCount > 0 && onMarkAllAsRead && /* @__PURE__ */ (0,
|
|
11028
|
+
unreadCount > 0 && onMarkAllAsRead && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10853
11029
|
"button",
|
|
10854
11030
|
{
|
|
10855
11031
|
type: "button",
|
|
@@ -10859,7 +11035,7 @@ var NotificationCenter = ({
|
|
|
10859
11035
|
}
|
|
10860
11036
|
)
|
|
10861
11037
|
] }) }),
|
|
10862
|
-
/* @__PURE__ */ (0,
|
|
11038
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "max-h-[350px] overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10863
11039
|
NotificationList,
|
|
10864
11040
|
{
|
|
10865
11041
|
groupedNotifications,
|
|
@@ -10881,7 +11057,7 @@ var NotificationCenter = ({
|
|
|
10881
11057
|
var NotificationCard = (props) => {
|
|
10882
11058
|
switch (props.mode) {
|
|
10883
11059
|
case "single":
|
|
10884
|
-
return /* @__PURE__ */ (0,
|
|
11060
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10885
11061
|
SingleNotificationCard,
|
|
10886
11062
|
{
|
|
10887
11063
|
title: props.title,
|
|
@@ -10896,7 +11072,7 @@ var NotificationCard = (props) => {
|
|
|
10896
11072
|
}
|
|
10897
11073
|
);
|
|
10898
11074
|
case "list":
|
|
10899
|
-
return /* @__PURE__ */ (0,
|
|
11075
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
10900
11076
|
NotificationList,
|
|
10901
11077
|
{
|
|
10902
11078
|
groupedNotifications: props.groupedNotifications ?? (props.notifications ? [
|
|
@@ -10917,9 +11093,9 @@ var NotificationCard = (props) => {
|
|
|
10917
11093
|
}
|
|
10918
11094
|
);
|
|
10919
11095
|
case "center":
|
|
10920
|
-
return /* @__PURE__ */ (0,
|
|
11096
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(NotificationCenter, { ...props });
|
|
10921
11097
|
default:
|
|
10922
|
-
return /* @__PURE__ */ (0,
|
|
11098
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "flex flex-col items-center gap-4 p-6 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: "text-sm text-text-600", children: "Modo de notifica\xE7\xE3o n\xE3o reconhecido" }) });
|
|
10923
11099
|
}
|
|
10924
11100
|
};
|
|
10925
11101
|
var NotificationCard_default = NotificationCard;
|
|
@@ -10930,7 +11106,7 @@ var createUseNotificationStore = (apiClient) => {
|
|
|
10930
11106
|
};
|
|
10931
11107
|
|
|
10932
11108
|
// src/hooks/useNotifications.ts
|
|
10933
|
-
var
|
|
11109
|
+
var import_react33 = require("react");
|
|
10934
11110
|
var createUseNotifications = (apiClient) => {
|
|
10935
11111
|
const useNotificationStore = createUseNotificationStore(apiClient);
|
|
10936
11112
|
return () => {
|
|
@@ -10949,7 +11125,7 @@ var createUseNotifications = (apiClient) => {
|
|
|
10949
11125
|
resetError,
|
|
10950
11126
|
getGroupedNotifications
|
|
10951
11127
|
} = useNotificationStore();
|
|
10952
|
-
const handleNavigate = (0,
|
|
11128
|
+
const handleNavigate = (0, import_react33.useCallback)(
|
|
10953
11129
|
(entityType, entityId, onAfterNavigate) => {
|
|
10954
11130
|
if (entityType && entityId) {
|
|
10955
11131
|
switch (entityType.toUpperCase()) {
|
|
@@ -10967,7 +11143,7 @@ var createUseNotifications = (apiClient) => {
|
|
|
10967
11143
|
},
|
|
10968
11144
|
[]
|
|
10969
11145
|
);
|
|
10970
|
-
const getActionLabel = (0,
|
|
11146
|
+
const getActionLabel = (0, import_react33.useCallback)(
|
|
10971
11147
|
(entityType) => {
|
|
10972
11148
|
if (!entityType) return void 0;
|
|
10973
11149
|
switch (entityType.toUpperCase()) {
|
|
@@ -10981,7 +11157,7 @@ var createUseNotifications = (apiClient) => {
|
|
|
10981
11157
|
},
|
|
10982
11158
|
[]
|
|
10983
11159
|
);
|
|
10984
|
-
const markAsReadAndNavigate = (0,
|
|
11160
|
+
const markAsReadAndNavigate = (0, import_react33.useCallback)(
|
|
10985
11161
|
async (id, entityType, entityId, onAfterNavigate) => {
|
|
10986
11162
|
await markAsRead(id);
|
|
10987
11163
|
if (entityType && entityId) {
|
|
@@ -10990,11 +11166,11 @@ var createUseNotifications = (apiClient) => {
|
|
|
10990
11166
|
},
|
|
10991
11167
|
[markAsRead, handleNavigate]
|
|
10992
11168
|
);
|
|
10993
|
-
const refreshNotifications = (0,
|
|
11169
|
+
const refreshNotifications = (0, import_react33.useCallback)(async () => {
|
|
10994
11170
|
resetError();
|
|
10995
11171
|
await fetchNotifications();
|
|
10996
11172
|
}, [resetError, fetchNotifications]);
|
|
10997
|
-
const formatNotification = (0,
|
|
11173
|
+
const formatNotification = (0, import_react33.useCallback)(
|
|
10998
11174
|
(notification) => ({
|
|
10999
11175
|
...notification,
|
|
11000
11176
|
time: formatTimeAgo(notification.createdAt),
|
|
@@ -11003,7 +11179,7 @@ var createUseNotifications = (apiClient) => {
|
|
|
11003
11179
|
}),
|
|
11004
11180
|
[]
|
|
11005
11181
|
);
|
|
11006
|
-
const getFormattedGroupedNotifications = (0,
|
|
11182
|
+
const getFormattedGroupedNotifications = (0, import_react33.useCallback)(() => {
|
|
11007
11183
|
const groups = getGroupedNotifications();
|
|
11008
11184
|
return groups.map((group) => ({
|
|
11009
11185
|
...group,
|
|
@@ -11139,6 +11315,7 @@ var createNotificationsHook = (apiClient) => {
|
|
|
11139
11315
|
Table,
|
|
11140
11316
|
Text,
|
|
11141
11317
|
TextArea,
|
|
11318
|
+
ThemeToggle,
|
|
11142
11319
|
Toast,
|
|
11143
11320
|
Toaster,
|
|
11144
11321
|
VideoPlayer,
|