analytica-frontend-lib 1.0.70 → 1.0.71
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/Accordation/index.d.mts +12 -0
- package/dist/Accordation/index.d.ts +12 -0
- package/dist/Accordation/index.js +1663 -0
- package/dist/Accordation/index.js.map +1 -0
- package/dist/Accordation/index.mjs +1654 -0
- package/dist/Accordation/index.mjs.map +1 -0
- package/dist/AlertDialog/index.d.mts +40 -0
- package/dist/AlertDialog/index.d.ts +40 -0
- package/dist/AlertDialog/index.js +233 -0
- package/dist/AlertDialog/index.js.map +1 -0
- package/dist/AlertDialog/index.mjs +212 -0
- package/dist/AlertDialog/index.mjs.map +1 -0
- package/dist/Alternative/index.d.mts +81 -0
- package/dist/Alternative/index.d.ts +81 -0
- package/dist/Alternative/index.js +745 -0
- package/dist/Alternative/index.js.map +1 -0
- package/dist/Alternative/index.mjs +728 -0
- package/dist/Alternative/index.mjs.map +1 -0
- package/dist/Badge/index.js +1 -1
- package/dist/Badge/index.js.map +1 -1
- package/dist/Badge/index.mjs +1 -1
- package/dist/Badge/index.mjs.map +1 -1
- package/dist/Card/index.js +1 -1
- package/dist/Card/index.js.map +1 -1
- package/dist/Card/index.mjs +1 -1
- package/dist/Card/index.mjs.map +1 -1
- package/dist/Radio/index.d.mts +120 -2
- package/dist/Radio/index.d.ts +120 -2
- package/dist/Radio/index.js +176 -3
- package/dist/Radio/index.js.map +1 -1
- package/dist/Radio/index.mjs +176 -4
- package/dist/Radio/index.mjs.map +1 -1
- package/dist/Skeleton/index.d.mts +10 -9
- package/dist/Skeleton/index.d.ts +10 -9
- package/dist/Skeleton/index.js.map +1 -1
- package/dist/Skeleton/index.mjs.map +1 -1
- package/dist/index.css +174 -0
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +4 -1
- package/dist/index.d.ts +4 -1
- package/dist/index.js +2383 -1778
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2441 -1832
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +174 -0
- package/dist/styles.css.map +1 -1
- package/package.json +4 -1
package/dist/index.mjs
CHANGED
|
@@ -112,7 +112,7 @@ import { Bell } from "phosphor-react";
|
|
|
112
112
|
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
113
113
|
var VARIANT_ACTION_CLASSES2 = {
|
|
114
114
|
solid: {
|
|
115
|
-
error: "bg-error text-error-700 focus-visible:outline-none",
|
|
115
|
+
error: "bg-error-background text-error-700 focus-visible:outline-none",
|
|
116
116
|
warning: "bg-warning text-warning-800 focus-visible:outline-none",
|
|
117
117
|
success: "bg-success text-success-800 focus-visible:outline-none",
|
|
118
118
|
info: "bg-info text-info-800 focus-visible:outline-none",
|
|
@@ -770,8 +770,14 @@ var CheckBox_default = CheckBox;
|
|
|
770
770
|
import {
|
|
771
771
|
forwardRef as forwardRef6,
|
|
772
772
|
useState as useState2,
|
|
773
|
-
useId as useId2
|
|
773
|
+
useId as useId2,
|
|
774
|
+
useEffect,
|
|
775
|
+
useRef,
|
|
776
|
+
Children,
|
|
777
|
+
cloneElement,
|
|
778
|
+
isValidElement
|
|
774
779
|
} from "react";
|
|
780
|
+
import { create, useStore } from "zustand";
|
|
775
781
|
import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
776
782
|
var SIZE_CLASSES4 = {
|
|
777
783
|
small: {
|
|
@@ -857,6 +863,7 @@ var Radio = forwardRef6(
|
|
|
857
863
|
}, ref) => {
|
|
858
864
|
const generatedId = useId2();
|
|
859
865
|
const inputId = id ?? `radio-${generatedId}`;
|
|
866
|
+
const inputRef = useRef(null);
|
|
860
867
|
const [internalChecked, setInternalChecked] = useState2(defaultChecked);
|
|
861
868
|
const isControlled = checkedProp !== void 0;
|
|
862
869
|
const checked = isControlled ? checkedProp : internalChecked;
|
|
@@ -865,6 +872,9 @@ var Radio = forwardRef6(
|
|
|
865
872
|
if (!isControlled) {
|
|
866
873
|
setInternalChecked(newChecked);
|
|
867
874
|
}
|
|
875
|
+
if (event.target) {
|
|
876
|
+
event.target.blur();
|
|
877
|
+
}
|
|
868
878
|
onChange?.(event);
|
|
869
879
|
};
|
|
870
880
|
const currentState = disabled ? "disabled" : state;
|
|
@@ -905,7 +915,11 @@ var Radio = forwardRef6(
|
|
|
905
915
|
/* @__PURE__ */ jsx11(
|
|
906
916
|
"input",
|
|
907
917
|
{
|
|
908
|
-
ref
|
|
918
|
+
ref: (node) => {
|
|
919
|
+
inputRef.current = node;
|
|
920
|
+
if (typeof ref === "function") ref(node);
|
|
921
|
+
else if (ref) ref.current = node;
|
|
922
|
+
},
|
|
909
923
|
type: "radio",
|
|
910
924
|
id: inputId,
|
|
911
925
|
checked,
|
|
@@ -914,10 +928,42 @@ var Radio = forwardRef6(
|
|
|
914
928
|
value,
|
|
915
929
|
onChange: handleChange,
|
|
916
930
|
className: "sr-only",
|
|
931
|
+
style: {
|
|
932
|
+
position: "absolute",
|
|
933
|
+
left: "-9999px",
|
|
934
|
+
visibility: "hidden"
|
|
935
|
+
},
|
|
917
936
|
...props
|
|
918
937
|
}
|
|
919
938
|
),
|
|
920
|
-
/* @__PURE__ */ jsx11(
|
|
939
|
+
/* @__PURE__ */ jsx11(
|
|
940
|
+
"button",
|
|
941
|
+
{
|
|
942
|
+
type: "button",
|
|
943
|
+
className: radioClasses,
|
|
944
|
+
disabled,
|
|
945
|
+
"aria-pressed": checked,
|
|
946
|
+
onClick: (e) => {
|
|
947
|
+
e.preventDefault();
|
|
948
|
+
if (!disabled) {
|
|
949
|
+
if (inputRef.current) {
|
|
950
|
+
inputRef.current.click();
|
|
951
|
+
inputRef.current.blur();
|
|
952
|
+
}
|
|
953
|
+
}
|
|
954
|
+
},
|
|
955
|
+
onKeyDown: (e) => {
|
|
956
|
+
if ((e.key === "Enter" || e.key === " ") && !disabled) {
|
|
957
|
+
e.preventDefault();
|
|
958
|
+
if (inputRef.current) {
|
|
959
|
+
inputRef.current.click();
|
|
960
|
+
inputRef.current.blur();
|
|
961
|
+
}
|
|
962
|
+
}
|
|
963
|
+
},
|
|
964
|
+
children: checked && /* @__PURE__ */ jsx11("div", { className: dotClasses })
|
|
965
|
+
}
|
|
966
|
+
),
|
|
921
967
|
label && /* @__PURE__ */ jsx11(
|
|
922
968
|
"div",
|
|
923
969
|
{
|
|
@@ -963,6 +1009,129 @@ var Radio = forwardRef6(
|
|
|
963
1009
|
}
|
|
964
1010
|
);
|
|
965
1011
|
Radio.displayName = "Radio";
|
|
1012
|
+
var createRadioGroupStore = (name, defaultValue, disabled, onValueChange) => create((set, get) => ({
|
|
1013
|
+
value: defaultValue,
|
|
1014
|
+
setValue: (value) => {
|
|
1015
|
+
if (!get().disabled) {
|
|
1016
|
+
set({ value });
|
|
1017
|
+
get().onValueChange?.(value);
|
|
1018
|
+
}
|
|
1019
|
+
},
|
|
1020
|
+
onValueChange,
|
|
1021
|
+
disabled,
|
|
1022
|
+
name
|
|
1023
|
+
}));
|
|
1024
|
+
var useRadioGroupStore = (externalStore) => {
|
|
1025
|
+
if (!externalStore) {
|
|
1026
|
+
throw new Error("RadioGroupItem must be used within a RadioGroup");
|
|
1027
|
+
}
|
|
1028
|
+
return externalStore;
|
|
1029
|
+
};
|
|
1030
|
+
var injectStore = (children, store) => Children.map(children, (child) => {
|
|
1031
|
+
if (!isValidElement(child)) return child;
|
|
1032
|
+
const typedChild = child;
|
|
1033
|
+
const shouldInject = typedChild.type === RadioGroupItem;
|
|
1034
|
+
return cloneElement(typedChild, {
|
|
1035
|
+
...shouldInject ? { store } : {},
|
|
1036
|
+
...typedChild.props.children ? { children: injectStore(typedChild.props.children, store) } : {}
|
|
1037
|
+
});
|
|
1038
|
+
});
|
|
1039
|
+
var RadioGroup = forwardRef6(
|
|
1040
|
+
({
|
|
1041
|
+
value: propValue,
|
|
1042
|
+
defaultValue = "",
|
|
1043
|
+
onValueChange,
|
|
1044
|
+
name: propName,
|
|
1045
|
+
disabled = false,
|
|
1046
|
+
className = "",
|
|
1047
|
+
children,
|
|
1048
|
+
...props
|
|
1049
|
+
}, ref) => {
|
|
1050
|
+
const generatedId = useId2();
|
|
1051
|
+
const name = propName || `radio-group-${generatedId}`;
|
|
1052
|
+
const storeRef = useRef(null);
|
|
1053
|
+
storeRef.current ??= createRadioGroupStore(
|
|
1054
|
+
name,
|
|
1055
|
+
defaultValue,
|
|
1056
|
+
disabled,
|
|
1057
|
+
onValueChange
|
|
1058
|
+
);
|
|
1059
|
+
const store = storeRef.current;
|
|
1060
|
+
const { setValue } = useStore(store, (s) => s);
|
|
1061
|
+
useEffect(() => {
|
|
1062
|
+
const currentValue = store.getState().value;
|
|
1063
|
+
if (currentValue && onValueChange) {
|
|
1064
|
+
onValueChange(currentValue);
|
|
1065
|
+
}
|
|
1066
|
+
}, []);
|
|
1067
|
+
useEffect(() => {
|
|
1068
|
+
if (propValue !== void 0) {
|
|
1069
|
+
setValue(propValue);
|
|
1070
|
+
}
|
|
1071
|
+
}, [propValue, setValue]);
|
|
1072
|
+
useEffect(() => {
|
|
1073
|
+
store.setState({ disabled });
|
|
1074
|
+
}, [disabled, store]);
|
|
1075
|
+
return /* @__PURE__ */ jsx11(
|
|
1076
|
+
"div",
|
|
1077
|
+
{
|
|
1078
|
+
ref,
|
|
1079
|
+
className,
|
|
1080
|
+
role: "radiogroup",
|
|
1081
|
+
"aria-label": name,
|
|
1082
|
+
...props,
|
|
1083
|
+
children: injectStore(children, store)
|
|
1084
|
+
}
|
|
1085
|
+
);
|
|
1086
|
+
}
|
|
1087
|
+
);
|
|
1088
|
+
RadioGroup.displayName = "RadioGroup";
|
|
1089
|
+
var RadioGroupItem = forwardRef6(
|
|
1090
|
+
({
|
|
1091
|
+
value,
|
|
1092
|
+
store: externalStore,
|
|
1093
|
+
disabled: itemDisabled,
|
|
1094
|
+
size = "medium",
|
|
1095
|
+
state = "default",
|
|
1096
|
+
className = "",
|
|
1097
|
+
id,
|
|
1098
|
+
...props
|
|
1099
|
+
}, ref) => {
|
|
1100
|
+
const store = useRadioGroupStore(externalStore);
|
|
1101
|
+
const {
|
|
1102
|
+
value: groupValue,
|
|
1103
|
+
setValue,
|
|
1104
|
+
disabled: groupDisabled,
|
|
1105
|
+
name
|
|
1106
|
+
} = useStore(store);
|
|
1107
|
+
const generatedId = useId2();
|
|
1108
|
+
const inputId = id ?? `radio-item-${generatedId}`;
|
|
1109
|
+
const isChecked = groupValue === value;
|
|
1110
|
+
const isDisabled = groupDisabled || itemDisabled;
|
|
1111
|
+
const currentState = isDisabled ? "disabled" : state;
|
|
1112
|
+
return /* @__PURE__ */ jsx11(
|
|
1113
|
+
Radio,
|
|
1114
|
+
{
|
|
1115
|
+
ref,
|
|
1116
|
+
id: inputId,
|
|
1117
|
+
name,
|
|
1118
|
+
value,
|
|
1119
|
+
checked: isChecked,
|
|
1120
|
+
disabled: isDisabled,
|
|
1121
|
+
size,
|
|
1122
|
+
state: currentState,
|
|
1123
|
+
className,
|
|
1124
|
+
onChange: (e) => {
|
|
1125
|
+
if (e.target.checked && !isDisabled) {
|
|
1126
|
+
setValue(value);
|
|
1127
|
+
}
|
|
1128
|
+
},
|
|
1129
|
+
...props
|
|
1130
|
+
}
|
|
1131
|
+
);
|
|
1132
|
+
}
|
|
1133
|
+
);
|
|
1134
|
+
RadioGroupItem.displayName = "RadioGroupItem";
|
|
966
1135
|
var Radio_default = Radio;
|
|
967
1136
|
|
|
968
1137
|
// src/components/TextArea/TextArea.tsx
|
|
@@ -1172,8 +1341,8 @@ var Toast = ({
|
|
|
1172
1341
|
var Toast_default = Toast;
|
|
1173
1342
|
|
|
1174
1343
|
// src/components/Toast/utils/ToastStore.ts
|
|
1175
|
-
import { create } from "zustand";
|
|
1176
|
-
var useToastStore =
|
|
1344
|
+
import { create as create2 } from "zustand";
|
|
1345
|
+
var useToastStore = create2((set) => ({
|
|
1177
1346
|
toasts: [],
|
|
1178
1347
|
addToast: (toast) => {
|
|
1179
1348
|
const id = crypto.randomUUID();
|
|
@@ -2341,8 +2510,8 @@ var Stepper_default = Stepper;
|
|
|
2341
2510
|
import {
|
|
2342
2511
|
useState as useState5,
|
|
2343
2512
|
useMemo as useMemo2,
|
|
2344
|
-
useEffect,
|
|
2345
|
-
useRef
|
|
2513
|
+
useEffect as useEffect2,
|
|
2514
|
+
useRef as useRef2
|
|
2346
2515
|
} from "react";
|
|
2347
2516
|
import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2348
2517
|
var WEEK_DAYS = ["SEG", "TER", "QUA", "QUI", "SEX", "S\xC1B", "DOM"];
|
|
@@ -2445,9 +2614,9 @@ var Calendar = ({
|
|
|
2445
2614
|
}) => {
|
|
2446
2615
|
const [currentDate, setCurrentDate] = useState5(selectedDate || /* @__PURE__ */ new Date());
|
|
2447
2616
|
const [isMonthPickerOpen, setIsMonthPickerOpen] = useState5(false);
|
|
2448
|
-
const monthPickerRef =
|
|
2449
|
-
const monthPickerContainerRef =
|
|
2450
|
-
|
|
2617
|
+
const monthPickerRef = useRef2(null);
|
|
2618
|
+
const monthPickerContainerRef = useRef2(null);
|
|
2619
|
+
useEffect2(() => {
|
|
2451
2620
|
const handleClickOutside = (event) => {
|
|
2452
2621
|
if (monthPickerContainerRef.current && !monthPickerContainerRef.current.contains(event.target)) {
|
|
2453
2622
|
setIsMonthPickerOpen(false);
|
|
@@ -2840,7 +3009,7 @@ var Calendar = ({
|
|
|
2840
3009
|
var Calendar_default = Calendar;
|
|
2841
3010
|
|
|
2842
3011
|
// src/components/Modal/Modal.tsx
|
|
2843
|
-
import { useEffect as
|
|
3012
|
+
import { useEffect as useEffect3 } from "react";
|
|
2844
3013
|
import { X as X2 } from "phosphor-react";
|
|
2845
3014
|
import { jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2846
3015
|
var SIZE_CLASSES10 = {
|
|
@@ -2862,7 +3031,7 @@ var Modal = ({
|
|
|
2862
3031
|
footer,
|
|
2863
3032
|
hideCloseButton = false
|
|
2864
3033
|
}) => {
|
|
2865
|
-
|
|
3034
|
+
useEffect3(() => {
|
|
2866
3035
|
if (!isOpen || !closeOnEscape) return;
|
|
2867
3036
|
const handleEscape = (event) => {
|
|
2868
3037
|
if (event.key === "Escape") {
|
|
@@ -2872,7 +3041,7 @@ var Modal = ({
|
|
|
2872
3041
|
document.addEventListener("keydown", handleEscape);
|
|
2873
3042
|
return () => document.removeEventListener("keydown", handleEscape);
|
|
2874
3043
|
}, [isOpen, closeOnEscape, onClose]);
|
|
2875
|
-
|
|
3044
|
+
useEffect3(() => {
|
|
2876
3045
|
const originalOverflow = document.body.style.overflow;
|
|
2877
3046
|
if (isOpen) {
|
|
2878
3047
|
document.body.style.overflow = "hidden";
|
|
@@ -2928,1963 +3097,2398 @@ var Modal = ({
|
|
|
2928
3097
|
};
|
|
2929
3098
|
var Modal_default = Modal;
|
|
2930
3099
|
|
|
2931
|
-
// src/components/
|
|
2932
|
-
import {
|
|
3100
|
+
// src/components/Accordation/Accordation.tsx
|
|
3101
|
+
import { forwardRef as forwardRef10, useId as useId5, useState as useState7 } from "react";
|
|
3102
|
+
|
|
3103
|
+
// src/components/Card/Card.tsx
|
|
2933
3104
|
import {
|
|
2934
3105
|
forwardRef as forwardRef9,
|
|
2935
|
-
|
|
2936
|
-
|
|
2937
|
-
|
|
2938
|
-
Children,
|
|
2939
|
-
cloneElement,
|
|
2940
|
-
useState as useState6
|
|
3106
|
+
Fragment as Fragment3,
|
|
3107
|
+
useState as useState6,
|
|
3108
|
+
useRef as useRef3
|
|
2941
3109
|
} from "react";
|
|
2942
|
-
import {
|
|
2943
|
-
|
|
2944
|
-
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2948
|
-
|
|
2949
|
-
|
|
2950
|
-
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
|
|
2957
|
-
|
|
2958
|
-
|
|
2959
|
-
return Children.map(children, (child) => {
|
|
2960
|
-
if (isValidElement(child)) {
|
|
2961
|
-
const typedChild = child;
|
|
2962
|
-
const newProps = {
|
|
2963
|
-
store
|
|
2964
|
-
};
|
|
2965
|
-
if (typedChild.props.children) {
|
|
2966
|
-
newProps.children = injectStore(typedChild.props.children, store);
|
|
2967
|
-
}
|
|
2968
|
-
return cloneElement(typedChild, newProps);
|
|
2969
|
-
}
|
|
2970
|
-
return child;
|
|
2971
|
-
});
|
|
2972
|
-
};
|
|
2973
|
-
var DropdownMenu = ({
|
|
2974
|
-
children,
|
|
2975
|
-
open: propOpen,
|
|
2976
|
-
onOpenChange
|
|
2977
|
-
}) => {
|
|
2978
|
-
const storeRef = useRef2(null);
|
|
2979
|
-
storeRef.current ??= createDropdownStore();
|
|
2980
|
-
const store = storeRef.current;
|
|
2981
|
-
const { open, setOpen: storeSetOpen } = useStore(store, (s) => s);
|
|
2982
|
-
const setOpen = (newOpen) => {
|
|
2983
|
-
storeSetOpen(newOpen);
|
|
2984
|
-
};
|
|
2985
|
-
const menuRef = useRef2(null);
|
|
2986
|
-
const handleArrowDownOrArrowUp = (event) => {
|
|
2987
|
-
const menuContent = menuRef.current?.querySelector('[role="menu"]');
|
|
2988
|
-
if (menuContent) {
|
|
2989
|
-
event.preventDefault();
|
|
2990
|
-
const items = Array.from(
|
|
2991
|
-
menuContent.querySelectorAll(
|
|
2992
|
-
'[role="menuitem"]:not([aria-disabled="true"])'
|
|
2993
|
-
)
|
|
2994
|
-
).filter((el) => el instanceof HTMLElement);
|
|
2995
|
-
if (items.length === 0) return;
|
|
2996
|
-
const focusedItem = document.activeElement;
|
|
2997
|
-
const currentIndex = items.findIndex((item) => item === focusedItem);
|
|
2998
|
-
let nextIndex;
|
|
2999
|
-
if (event.key === "ArrowDown") {
|
|
3000
|
-
nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % items.length;
|
|
3001
|
-
} else {
|
|
3002
|
-
nextIndex = currentIndex === -1 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length;
|
|
3003
|
-
}
|
|
3004
|
-
items[nextIndex]?.focus();
|
|
3005
|
-
}
|
|
3006
|
-
};
|
|
3007
|
-
const handleDownkey = (event) => {
|
|
3008
|
-
if (event.key === "Escape") {
|
|
3009
|
-
setOpen(false);
|
|
3010
|
-
} else if (event.key === "ArrowDown" || event.key === "ArrowUp") {
|
|
3011
|
-
handleArrowDownOrArrowUp(event);
|
|
3012
|
-
}
|
|
3013
|
-
};
|
|
3014
|
-
const handleClickOutside = (event) => {
|
|
3015
|
-
if (menuRef.current && !menuRef.current.contains(event.target)) {
|
|
3016
|
-
setOpen(false);
|
|
3017
|
-
}
|
|
3018
|
-
};
|
|
3019
|
-
useEffect3(() => {
|
|
3020
|
-
if (open) {
|
|
3021
|
-
document.addEventListener("mousedown", handleClickOutside);
|
|
3022
|
-
document.addEventListener("keydown", handleDownkey);
|
|
3023
|
-
}
|
|
3024
|
-
return () => {
|
|
3025
|
-
document.removeEventListener("mousedown", handleClickOutside);
|
|
3026
|
-
document.removeEventListener("keydown", handleDownkey);
|
|
3027
|
-
};
|
|
3028
|
-
}, [open]);
|
|
3029
|
-
useEffect3(() => {
|
|
3030
|
-
setOpen(open);
|
|
3031
|
-
onOpenChange?.(open);
|
|
3032
|
-
}, [open, onOpenChange]);
|
|
3033
|
-
useEffect3(() => {
|
|
3034
|
-
if (propOpen) {
|
|
3035
|
-
setOpen(propOpen);
|
|
3036
|
-
}
|
|
3037
|
-
}, [propOpen]);
|
|
3038
|
-
return /* @__PURE__ */ jsx23("div", { className: "relative", ref: menuRef, children: injectStore(children, store) });
|
|
3039
|
-
};
|
|
3040
|
-
var DropdownMenuTrigger = ({
|
|
3041
|
-
className,
|
|
3042
|
-
children,
|
|
3043
|
-
onClick,
|
|
3044
|
-
store: externalStore,
|
|
3045
|
-
...props
|
|
3046
|
-
}) => {
|
|
3047
|
-
const store = useDropdownStore(externalStore);
|
|
3048
|
-
const open = useStore(store, (s) => s.open);
|
|
3049
|
-
const toggleOpen = () => store.setState({ open: !open });
|
|
3050
|
-
return /* @__PURE__ */ jsx23(
|
|
3051
|
-
"button",
|
|
3052
|
-
{
|
|
3053
|
-
onClick: (e) => {
|
|
3054
|
-
e.stopPropagation();
|
|
3055
|
-
toggleOpen();
|
|
3056
|
-
if (onClick) onClick(e);
|
|
3057
|
-
},
|
|
3058
|
-
"aria-expanded": open,
|
|
3059
|
-
className: `${className}`,
|
|
3060
|
-
...props,
|
|
3061
|
-
children
|
|
3062
|
-
}
|
|
3063
|
-
);
|
|
3110
|
+
import {
|
|
3111
|
+
CaretRight,
|
|
3112
|
+
ChatCircleText,
|
|
3113
|
+
CheckCircle as CheckCircle3,
|
|
3114
|
+
Clock,
|
|
3115
|
+
DotsThreeVertical,
|
|
3116
|
+
Play,
|
|
3117
|
+
SpeakerHigh,
|
|
3118
|
+
SpeakerLow,
|
|
3119
|
+
SpeakerSimpleX,
|
|
3120
|
+
XCircle as XCircle2
|
|
3121
|
+
} from "phosphor-react";
|
|
3122
|
+
import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
3123
|
+
var CARD_BASE_CLASSES = {
|
|
3124
|
+
default: "w-full bg-background border border-border-50 rounded-xl",
|
|
3125
|
+
compact: "w-full bg-background border border-border-50 rounded-lg",
|
|
3126
|
+
minimal: "w-full bg-background border border-border-100 rounded-md"
|
|
3064
3127
|
};
|
|
3065
|
-
|
|
3066
|
-
|
|
3067
|
-
small: "
|
|
3068
|
-
medium: "
|
|
3128
|
+
var CARD_PADDING_CLASSES = {
|
|
3129
|
+
none: "",
|
|
3130
|
+
small: "p-2",
|
|
3131
|
+
medium: "p-4",
|
|
3132
|
+
large: "p-6"
|
|
3069
3133
|
};
|
|
3070
|
-
var
|
|
3071
|
-
|
|
3072
|
-
|
|
3073
|
-
|
|
3074
|
-
|
|
3134
|
+
var CARD_MIN_HEIGHT_CLASSES = {
|
|
3135
|
+
none: "",
|
|
3136
|
+
small: "min-h-16",
|
|
3137
|
+
medium: "min-h-20",
|
|
3138
|
+
large: "min-h-24"
|
|
3075
3139
|
};
|
|
3076
|
-
var
|
|
3077
|
-
|
|
3078
|
-
|
|
3079
|
-
end: "right-0"
|
|
3140
|
+
var CARD_LAYOUT_CLASSES = {
|
|
3141
|
+
horizontal: "flex flex-row",
|
|
3142
|
+
vertical: "flex flex-col"
|
|
3080
3143
|
};
|
|
3081
|
-
var
|
|
3082
|
-
|
|
3083
|
-
|
|
3144
|
+
var CARD_CURSOR_CLASSES = {
|
|
3145
|
+
default: "",
|
|
3146
|
+
pointer: "cursor-pointer"
|
|
3084
3147
|
};
|
|
3085
|
-
var
|
|
3086
|
-
return /* @__PURE__ */ jsx23(
|
|
3087
|
-
"div",
|
|
3088
|
-
{
|
|
3089
|
-
ref,
|
|
3090
|
-
className: `text-sm w-full ${inset ? "pl-8" : ""} ${className ?? ""}`,
|
|
3091
|
-
...props
|
|
3092
|
-
}
|
|
3093
|
-
);
|
|
3094
|
-
});
|
|
3095
|
-
MenuLabel.displayName = "MenuLabel";
|
|
3096
|
-
var DropdownMenuContent = forwardRef9(
|
|
3148
|
+
var CardBase = forwardRef9(
|
|
3097
3149
|
({
|
|
3098
|
-
className,
|
|
3099
|
-
align = "start",
|
|
3100
|
-
side = "bottom",
|
|
3101
|
-
variant = "menu",
|
|
3102
|
-
sideOffset = 4,
|
|
3103
3150
|
children,
|
|
3104
|
-
|
|
3151
|
+
variant = "default",
|
|
3152
|
+
layout = "horizontal",
|
|
3153
|
+
padding = "medium",
|
|
3154
|
+
minHeight = "medium",
|
|
3155
|
+
cursor = "default",
|
|
3156
|
+
className = "",
|
|
3105
3157
|
...props
|
|
3106
3158
|
}, ref) => {
|
|
3107
|
-
const
|
|
3108
|
-
const
|
|
3109
|
-
const
|
|
3110
|
-
|
|
3111
|
-
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
|
|
3120
|
-
|
|
3121
|
-
|
|
3122
|
-
|
|
3123
|
-
|
|
3124
|
-
|
|
3125
|
-
|
|
3159
|
+
const baseClasses = CARD_BASE_CLASSES[variant];
|
|
3160
|
+
const paddingClasses = CARD_PADDING_CLASSES[padding];
|
|
3161
|
+
const minHeightClasses = CARD_MIN_HEIGHT_CLASSES[minHeight];
|
|
3162
|
+
const layoutClasses = CARD_LAYOUT_CLASSES[layout];
|
|
3163
|
+
const cursorClasses = CARD_CURSOR_CLASSES[cursor];
|
|
3164
|
+
const combinedClasses = [
|
|
3165
|
+
baseClasses,
|
|
3166
|
+
paddingClasses,
|
|
3167
|
+
minHeightClasses,
|
|
3168
|
+
layoutClasses,
|
|
3169
|
+
cursorClasses,
|
|
3170
|
+
className
|
|
3171
|
+
].filter(Boolean).join(" ");
|
|
3172
|
+
return /* @__PURE__ */ jsx23("div", { ref, className: combinedClasses, ...props, children });
|
|
3173
|
+
}
|
|
3174
|
+
);
|
|
3175
|
+
var ACTION_CARD_CLASSES = {
|
|
3176
|
+
warning: "bg-warning-background",
|
|
3177
|
+
success: "bg-success-300",
|
|
3178
|
+
error: "bg-error-100",
|
|
3179
|
+
info: "bg-info-background"
|
|
3180
|
+
};
|
|
3181
|
+
var ACTION_ICON_CLASSES = {
|
|
3182
|
+
warning: "bg-warning-300 text-text",
|
|
3183
|
+
success: "bg-yellow-300 text-text-950",
|
|
3184
|
+
error: "bg-error-500 text-text",
|
|
3185
|
+
info: "bg-info-500 text-text"
|
|
3186
|
+
};
|
|
3187
|
+
var ACTION_SUBTITLE_CLASSES = {
|
|
3188
|
+
warning: "text-warning-600",
|
|
3189
|
+
success: "text-success-700",
|
|
3190
|
+
error: "text-error-700",
|
|
3191
|
+
info: "text-info-700"
|
|
3192
|
+
};
|
|
3193
|
+
var ACTION_HEADER_CLASSES = {
|
|
3194
|
+
warning: "text-warning-300",
|
|
3195
|
+
success: "text-success-300",
|
|
3196
|
+
error: "text-error-300",
|
|
3197
|
+
info: "text-info-300"
|
|
3198
|
+
};
|
|
3199
|
+
var CardActivitiesResults = forwardRef9(
|
|
3200
|
+
({
|
|
3201
|
+
icon,
|
|
3202
|
+
title,
|
|
3203
|
+
subTitle,
|
|
3204
|
+
header,
|
|
3205
|
+
extended = false,
|
|
3206
|
+
action = "success",
|
|
3207
|
+
description,
|
|
3208
|
+
className,
|
|
3209
|
+
...props
|
|
3210
|
+
}, ref) => {
|
|
3211
|
+
const actionCardClasses = ACTION_CARD_CLASSES[action];
|
|
3212
|
+
const actionIconClasses = ACTION_ICON_CLASSES[action];
|
|
3213
|
+
const actionSubTitleClasses = ACTION_SUBTITLE_CLASSES[action];
|
|
3214
|
+
const actionHeaderClasses = ACTION_HEADER_CLASSES[action];
|
|
3215
|
+
return /* @__PURE__ */ jsxs18(
|
|
3126
3216
|
"div",
|
|
3127
3217
|
{
|
|
3128
3218
|
ref,
|
|
3129
|
-
|
|
3130
|
-
className: `
|
|
3131
|
-
bg-background z-50 min-w-[210px] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md border-border-100
|
|
3132
|
-
${open ? "animate-in fade-in-0 zoom-in-95" : "animate-out fade-out-0 zoom-out-95"}
|
|
3133
|
-
${getPositionClasses()}
|
|
3134
|
-
${variantClasses}
|
|
3135
|
-
${className}
|
|
3136
|
-
`,
|
|
3137
|
-
style: {
|
|
3138
|
-
marginTop: side === "bottom" ? sideOffset : void 0,
|
|
3139
|
-
marginBottom: side === "top" ? sideOffset : void 0,
|
|
3140
|
-
marginLeft: side === "right" ? sideOffset : void 0,
|
|
3141
|
-
marginRight: side === "left" ? sideOffset : void 0
|
|
3142
|
-
},
|
|
3219
|
+
className: `w-full flex flex-col border border-border-50 bg-background rounded-xl ${className}`,
|
|
3143
3220
|
...props,
|
|
3144
|
-
children
|
|
3221
|
+
children: [
|
|
3222
|
+
/* @__PURE__ */ jsxs18(
|
|
3223
|
+
"div",
|
|
3224
|
+
{
|
|
3225
|
+
className: `
|
|
3226
|
+
flex flex-col gap-1 items-center justify-center p-4
|
|
3227
|
+
${actionCardClasses}
|
|
3228
|
+
${extended ? "rounded-t-xl" : "rounded-xl"}`,
|
|
3229
|
+
children: [
|
|
3230
|
+
/* @__PURE__ */ jsx23(
|
|
3231
|
+
"span",
|
|
3232
|
+
{
|
|
3233
|
+
className: `size-7.5 rounded-full flex items-center justify-center ${actionIconClasses}`,
|
|
3234
|
+
children: icon
|
|
3235
|
+
}
|
|
3236
|
+
),
|
|
3237
|
+
/* @__PURE__ */ jsx23(
|
|
3238
|
+
Text_default,
|
|
3239
|
+
{
|
|
3240
|
+
size: "2xs",
|
|
3241
|
+
weight: "medium",
|
|
3242
|
+
className: "text-text-800 uppercase truncate",
|
|
3243
|
+
children: title
|
|
3244
|
+
}
|
|
3245
|
+
),
|
|
3246
|
+
/* @__PURE__ */ jsx23("p", { className: `text-lg font-bold truncate ${actionSubTitleClasses}`, children: subTitle })
|
|
3247
|
+
]
|
|
3248
|
+
}
|
|
3249
|
+
),
|
|
3250
|
+
extended && /* @__PURE__ */ jsxs18("div", { className: "flex flex-col items-center gap-2.5 pb-9.5 pt-2.5", children: [
|
|
3251
|
+
/* @__PURE__ */ jsx23(
|
|
3252
|
+
"p",
|
|
3253
|
+
{
|
|
3254
|
+
className: `text-2xs font-medium uppercase truncate ${actionHeaderClasses}`,
|
|
3255
|
+
children: header
|
|
3256
|
+
}
|
|
3257
|
+
),
|
|
3258
|
+
/* @__PURE__ */ jsx23(Badge_default, { size: "large", action: "info", children: description })
|
|
3259
|
+
] })
|
|
3260
|
+
]
|
|
3145
3261
|
}
|
|
3146
3262
|
);
|
|
3147
3263
|
}
|
|
3148
3264
|
);
|
|
3149
|
-
|
|
3150
|
-
var DropdownMenuItem = forwardRef9(
|
|
3265
|
+
var CardQuestions = forwardRef9(
|
|
3151
3266
|
({
|
|
3267
|
+
header,
|
|
3268
|
+
state = "undone",
|
|
3152
3269
|
className,
|
|
3153
|
-
|
|
3154
|
-
|
|
3155
|
-
iconRight,
|
|
3156
|
-
iconLeft,
|
|
3157
|
-
disabled = false,
|
|
3158
|
-
onClick,
|
|
3159
|
-
variant = "menu",
|
|
3160
|
-
store: externalStore,
|
|
3270
|
+
onClickButton,
|
|
3271
|
+
valueButton,
|
|
3161
3272
|
...props
|
|
3162
3273
|
}, ref) => {
|
|
3163
|
-
const
|
|
3164
|
-
const
|
|
3165
|
-
const
|
|
3166
|
-
const handleClick = (e) => {
|
|
3167
|
-
if (disabled) {
|
|
3168
|
-
e.preventDefault();
|
|
3169
|
-
e.stopPropagation();
|
|
3170
|
-
return;
|
|
3171
|
-
}
|
|
3172
|
-
onClick?.(e);
|
|
3173
|
-
setOpen(false);
|
|
3174
|
-
};
|
|
3175
|
-
const getVariantClasses = () => {
|
|
3176
|
-
if (variant === "profile") {
|
|
3177
|
-
return "relative flex flex-row justify-between select-none items-center gap-2 rounded-sm p-4 text-sm outline-none transition-colors [&>svg]:size-6 [&>svg]:shrink-0";
|
|
3178
|
-
}
|
|
3179
|
-
return "relative flex select-none items-center gap-2 rounded-sm p-3 text-sm outline-none transition-colors [&>svg]:size-4 [&>svg]:shrink-0";
|
|
3180
|
-
};
|
|
3181
|
-
const getVariantProps = () => {
|
|
3182
|
-
return variant === "profile" ? { "data-variant": "profile" } : {};
|
|
3183
|
-
};
|
|
3274
|
+
const isDone = state === "done";
|
|
3275
|
+
const stateLabel = isDone ? "Realizado" : "N\xE3o Realizado";
|
|
3276
|
+
const buttonLabel = isDone ? "Ver Quest\xE3o" : "Responder";
|
|
3184
3277
|
return /* @__PURE__ */ jsxs18(
|
|
3185
|
-
|
|
3278
|
+
CardBase,
|
|
3186
3279
|
{
|
|
3187
3280
|
ref,
|
|
3188
|
-
|
|
3189
|
-
|
|
3190
|
-
"
|
|
3191
|
-
className: `
|
|
3192
|
-
focus-visible:bg-background-50
|
|
3193
|
-
${getVariantClasses()}
|
|
3194
|
-
${sizeClasses}
|
|
3195
|
-
${className}
|
|
3196
|
-
${disabled ? "cursor-not-allowed text-text-400" : "cursor-pointer hover:bg-background-50 text-text-700 focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground"}
|
|
3197
|
-
`,
|
|
3198
|
-
onClick: handleClick,
|
|
3199
|
-
onKeyDown: (e) => {
|
|
3200
|
-
if (e.key === "Enter" || e.key === " ") handleClick(e);
|
|
3201
|
-
},
|
|
3202
|
-
tabIndex: disabled ? -1 : 0,
|
|
3281
|
+
layout: "horizontal",
|
|
3282
|
+
padding: "medium",
|
|
3283
|
+
minHeight: "medium",
|
|
3284
|
+
className: `justify-between gap-4 ${className}`,
|
|
3203
3285
|
...props,
|
|
3204
3286
|
children: [
|
|
3205
|
-
|
|
3206
|
-
|
|
3207
|
-
|
|
3287
|
+
/* @__PURE__ */ jsxs18("section", { className: "flex flex-col gap-1 flex-1 min-w-0", children: [
|
|
3288
|
+
/* @__PURE__ */ jsx23("p", { className: "font-bold text-xs text-text-950 truncate", children: header }),
|
|
3289
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-row gap-6 items-center", children: [
|
|
3290
|
+
/* @__PURE__ */ jsx23(
|
|
3291
|
+
Badge_default,
|
|
3292
|
+
{
|
|
3293
|
+
size: "medium",
|
|
3294
|
+
variant: "solid",
|
|
3295
|
+
action: isDone ? "success" : "error",
|
|
3296
|
+
children: stateLabel
|
|
3297
|
+
}
|
|
3298
|
+
),
|
|
3299
|
+
/* @__PURE__ */ jsxs18("span", { className: "flex flex-row items-center gap-1 text-text-700 text-xs", children: [
|
|
3300
|
+
isDone ? "Nota" : "Sem nota",
|
|
3301
|
+
isDone && /* @__PURE__ */ jsx23(Badge_default, { size: "medium", action: "success", children: "00" })
|
|
3302
|
+
] })
|
|
3303
|
+
] })
|
|
3304
|
+
] }),
|
|
3305
|
+
/* @__PURE__ */ jsx23("span", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx23(
|
|
3306
|
+
Button_default,
|
|
3307
|
+
{
|
|
3308
|
+
size: "extra-small",
|
|
3309
|
+
onClick: () => onClickButton?.(valueButton),
|
|
3310
|
+
className: "min-w-fit",
|
|
3311
|
+
children: buttonLabel
|
|
3312
|
+
}
|
|
3313
|
+
) })
|
|
3208
3314
|
]
|
|
3209
3315
|
}
|
|
3210
3316
|
);
|
|
3211
3317
|
}
|
|
3212
3318
|
);
|
|
3213
|
-
|
|
3214
|
-
|
|
3215
|
-
|
|
3216
|
-
|
|
3217
|
-
|
|
3218
|
-
|
|
3319
|
+
var CardProgress = forwardRef9(
|
|
3320
|
+
({
|
|
3321
|
+
header,
|
|
3322
|
+
subhead,
|
|
3323
|
+
initialDate,
|
|
3324
|
+
endDate,
|
|
3325
|
+
progress = 0,
|
|
3326
|
+
direction = "horizontal",
|
|
3327
|
+
icon,
|
|
3328
|
+
color = "#B7DFFF",
|
|
3329
|
+
progressVariant = "blue",
|
|
3330
|
+
showDates = true,
|
|
3331
|
+
className,
|
|
3219
3332
|
...props
|
|
3220
|
-
}
|
|
3221
|
-
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3229
|
-
|
|
3230
|
-
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3236
|
-
|
|
3237
|
-
|
|
3238
|
-
|
|
3239
|
-
|
|
3240
|
-
|
|
3241
|
-
|
|
3242
|
-
}
|
|
3243
|
-
|
|
3244
|
-
|
|
3245
|
-
|
|
3246
|
-
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3250
|
-
|
|
3251
|
-
|
|
3252
|
-
|
|
3253
|
-
|
|
3254
|
-
|
|
3255
|
-
|
|
3256
|
-
/* @__PURE__ */ jsx23("span", { className: "size-16 bg-primary-100 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsx23(User, { size: 34, className: "text-primary-950" }) }),
|
|
3257
|
-
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col ", children: [
|
|
3258
|
-
/* @__PURE__ */ jsx23("p", { className: "text-xl font-bold text-text-950", children: name }),
|
|
3259
|
-
/* @__PURE__ */ jsx23("p", { className: "text-md text-text-600", children: email })
|
|
3333
|
+
}, ref) => {
|
|
3334
|
+
const isHorizontal = direction === "horizontal";
|
|
3335
|
+
const contentComponent = {
|
|
3336
|
+
horizontal: /* @__PURE__ */ jsxs18(Fragment4, { children: [
|
|
3337
|
+
showDates && /* @__PURE__ */ jsxs18("div", { className: "flex flex-row gap-6 items-center", children: [
|
|
3338
|
+
initialDate && /* @__PURE__ */ jsxs18("span", { className: "flex flex-row gap-1 items-center text-2xs", children: [
|
|
3339
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-800 font-semibold", children: "In\xEDcio" }),
|
|
3340
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-600", children: initialDate })
|
|
3341
|
+
] }),
|
|
3342
|
+
endDate && /* @__PURE__ */ jsxs18("span", { className: "flex flex-row gap-1 items-center text-2xs", children: [
|
|
3343
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-800 font-semibold", children: "Fim" }),
|
|
3344
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-600", children: endDate })
|
|
3345
|
+
] })
|
|
3346
|
+
] }),
|
|
3347
|
+
/* @__PURE__ */ jsxs18("span", { className: "grid grid-cols-[1fr_auto] items-center gap-2", children: [
|
|
3348
|
+
/* @__PURE__ */ jsx23(
|
|
3349
|
+
ProgressBar_default,
|
|
3350
|
+
{
|
|
3351
|
+
size: "small",
|
|
3352
|
+
value: progress,
|
|
3353
|
+
variant: progressVariant,
|
|
3354
|
+
"data-testid": "progress-bar"
|
|
3355
|
+
}
|
|
3356
|
+
),
|
|
3357
|
+
/* @__PURE__ */ jsxs18(
|
|
3358
|
+
Text_default,
|
|
3359
|
+
{
|
|
3360
|
+
size: "xs",
|
|
3361
|
+
weight: "medium",
|
|
3362
|
+
className: `text-text-950 leading-none tracking-normal text-center flex-none`,
|
|
3363
|
+
children: [
|
|
3364
|
+
Math.round(progress),
|
|
3365
|
+
"%"
|
|
3366
|
+
]
|
|
3367
|
+
}
|
|
3368
|
+
)
|
|
3260
3369
|
] })
|
|
3261
|
-
]
|
|
3262
|
-
|
|
3263
|
-
);
|
|
3264
|
-
});
|
|
3265
|
-
ProfileMenuHeader.displayName = "ProfileMenuHeader";
|
|
3266
|
-
var ProfileMenuSection = forwardRef9(({ className, children, store: _store, ...props }, ref) => {
|
|
3267
|
-
return /* @__PURE__ */ jsx23(
|
|
3268
|
-
"div",
|
|
3269
|
-
{
|
|
3270
|
-
ref,
|
|
3271
|
-
className: `
|
|
3272
|
-
flex flex-col p-2
|
|
3273
|
-
${className}
|
|
3274
|
-
`,
|
|
3275
|
-
...props,
|
|
3276
|
-
children
|
|
3277
|
-
}
|
|
3278
|
-
);
|
|
3279
|
-
});
|
|
3280
|
-
ProfileMenuSection.displayName = "ProfileMenuSection";
|
|
3281
|
-
var ProfileMenuFooter = ({
|
|
3282
|
-
className,
|
|
3283
|
-
disabled = false,
|
|
3284
|
-
onClick,
|
|
3285
|
-
store: externalStore,
|
|
3286
|
-
...props
|
|
3287
|
-
}) => {
|
|
3288
|
-
const store = useDropdownStore(externalStore);
|
|
3289
|
-
const setOpen = useStore(store, (s) => s.setOpen);
|
|
3290
|
-
return /* @__PURE__ */ jsxs18(
|
|
3291
|
-
Button_default,
|
|
3292
|
-
{
|
|
3293
|
-
variant: "outline",
|
|
3294
|
-
className: `w-full ${className}`,
|
|
3295
|
-
disabled,
|
|
3296
|
-
onClick: (e) => {
|
|
3297
|
-
setOpen(false);
|
|
3298
|
-
onClick?.(e);
|
|
3299
|
-
},
|
|
3300
|
-
...props,
|
|
3301
|
-
children: [
|
|
3302
|
-
/* @__PURE__ */ jsx23("span", { className: "mr-2 flex items-center", children: /* @__PURE__ */ jsx23(SignOut, {}) }),
|
|
3303
|
-
/* @__PURE__ */ jsx23("span", { children: "Sair" })
|
|
3304
|
-
]
|
|
3305
|
-
}
|
|
3306
|
-
);
|
|
3307
|
-
};
|
|
3308
|
-
ProfileMenuFooter.displayName = "ProfileMenuFooter";
|
|
3309
|
-
var DropdownMenu_default = DropdownMenu;
|
|
3310
|
-
|
|
3311
|
-
// src/components/Select/Select.tsx
|
|
3312
|
-
import { create as create3, useStore as useStore2 } from "zustand";
|
|
3313
|
-
import {
|
|
3314
|
-
useEffect as useEffect4,
|
|
3315
|
-
useRef as useRef3,
|
|
3316
|
-
forwardRef as forwardRef10,
|
|
3317
|
-
isValidElement as isValidElement2,
|
|
3318
|
-
Children as Children2,
|
|
3319
|
-
cloneElement as cloneElement2,
|
|
3320
|
-
useId as useId5
|
|
3321
|
-
} from "react";
|
|
3322
|
-
import { CaretDown, Check as Check4, WarningCircle as WarningCircle5 } from "phosphor-react";
|
|
3323
|
-
import { Fragment as Fragment3, jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3324
|
-
var VARIANT_CLASSES4 = {
|
|
3325
|
-
outlined: "border rounded-lg focus:border-primary-950",
|
|
3326
|
-
underlined: "border-b focus:border-primary-950",
|
|
3327
|
-
rounded: "border rounded-full focus:border-primary-950"
|
|
3328
|
-
};
|
|
3329
|
-
var SIZE_CLASSES11 = {
|
|
3330
|
-
small: "text-sm",
|
|
3331
|
-
medium: "text-md",
|
|
3332
|
-
large: "text-lg",
|
|
3333
|
-
"extra-large": "text-lg"
|
|
3334
|
-
};
|
|
3335
|
-
var HEIGHT_CLASSES = {
|
|
3336
|
-
small: "h-8",
|
|
3337
|
-
medium: "h-9",
|
|
3338
|
-
large: "h-10",
|
|
3339
|
-
"extra-large": "h-12"
|
|
3340
|
-
};
|
|
3341
|
-
var PADDING_CLASSES = {
|
|
3342
|
-
small: "px-2 py-1",
|
|
3343
|
-
medium: "px-3 py-2",
|
|
3344
|
-
large: "px-4 py-3",
|
|
3345
|
-
"extra-large": "px-5 py-4"
|
|
3346
|
-
};
|
|
3347
|
-
var SIDE_CLASSES2 = {
|
|
3348
|
-
top: "bottom-full -translate-y-1",
|
|
3349
|
-
right: "top-full translate-y-1",
|
|
3350
|
-
bottom: "top-full translate-y-1",
|
|
3351
|
-
left: "top-full translate-y-1"
|
|
3352
|
-
};
|
|
3353
|
-
var ALIGN_CLASSES2 = {
|
|
3354
|
-
start: "left-0",
|
|
3355
|
-
center: "left-1/2 -translate-x-1/2",
|
|
3356
|
-
end: "right-0"
|
|
3357
|
-
};
|
|
3358
|
-
function createSelectStore(onValueChange) {
|
|
3359
|
-
return create3((set) => ({
|
|
3360
|
-
open: false,
|
|
3361
|
-
setOpen: (open) => set({ open }),
|
|
3362
|
-
value: "",
|
|
3363
|
-
setValue: (value) => set({ value }),
|
|
3364
|
-
selectedLabel: "",
|
|
3365
|
-
setSelectedLabel: (label) => set({ selectedLabel: label }),
|
|
3366
|
-
onValueChange
|
|
3367
|
-
}));
|
|
3368
|
-
}
|
|
3369
|
-
var useSelectStore = (externalStore) => {
|
|
3370
|
-
if (!externalStore) {
|
|
3371
|
-
throw new Error(
|
|
3372
|
-
"Component must be used within a Select (store is missing)"
|
|
3373
|
-
);
|
|
3374
|
-
}
|
|
3375
|
-
return externalStore;
|
|
3376
|
-
};
|
|
3377
|
-
function getLabelAsNode(children) {
|
|
3378
|
-
if (typeof children === "string" || typeof children === "number") {
|
|
3379
|
-
return children;
|
|
3380
|
-
}
|
|
3381
|
-
const flattened = Children2.toArray(children);
|
|
3382
|
-
if (flattened.length === 1) return flattened[0];
|
|
3383
|
-
return /* @__PURE__ */ jsx24(Fragment3, { children: flattened });
|
|
3384
|
-
}
|
|
3385
|
-
var injectStore2 = (children, store, size, selectId) => {
|
|
3386
|
-
return Children2.map(children, (child) => {
|
|
3387
|
-
if (isValidElement2(child)) {
|
|
3388
|
-
const typedChild = child;
|
|
3389
|
-
const newProps = {
|
|
3390
|
-
store
|
|
3391
|
-
};
|
|
3392
|
-
if (typedChild.type === SelectTrigger) {
|
|
3393
|
-
newProps.size = size;
|
|
3394
|
-
newProps.selectId = selectId;
|
|
3395
|
-
}
|
|
3396
|
-
if (typedChild.props.children) {
|
|
3397
|
-
newProps.children = injectStore2(
|
|
3398
|
-
typedChild.props.children,
|
|
3399
|
-
store,
|
|
3400
|
-
size,
|
|
3401
|
-
selectId
|
|
3402
|
-
);
|
|
3403
|
-
}
|
|
3404
|
-
return cloneElement2(typedChild, newProps);
|
|
3405
|
-
}
|
|
3406
|
-
return child;
|
|
3407
|
-
});
|
|
3408
|
-
};
|
|
3409
|
-
var Select = ({
|
|
3410
|
-
children,
|
|
3411
|
-
defaultValue = "",
|
|
3412
|
-
value: propValue,
|
|
3413
|
-
onValueChange,
|
|
3414
|
-
size = "small",
|
|
3415
|
-
label,
|
|
3416
|
-
helperText,
|
|
3417
|
-
errorMessage,
|
|
3418
|
-
id
|
|
3419
|
-
}) => {
|
|
3420
|
-
const storeRef = useRef3(null);
|
|
3421
|
-
storeRef.current ??= createSelectStore(onValueChange);
|
|
3422
|
-
const store = storeRef.current;
|
|
3423
|
-
const selectRef = useRef3(null);
|
|
3424
|
-
const { open, setOpen, setValue, selectedLabel } = useStore2(store, (s) => s);
|
|
3425
|
-
const generatedId = useId5();
|
|
3426
|
-
const selectId = id ?? `select-${generatedId}`;
|
|
3427
|
-
const findLabelForValue = (children2, targetValue) => {
|
|
3428
|
-
let found = null;
|
|
3429
|
-
const search = (nodes) => {
|
|
3430
|
-
Children2.forEach(nodes, (child) => {
|
|
3431
|
-
if (!isValidElement2(child)) return;
|
|
3432
|
-
const typedChild = child;
|
|
3433
|
-
if (typedChild.type === SelectItem && typedChild.props.value === targetValue) {
|
|
3434
|
-
if (typeof typedChild.props.children === "string")
|
|
3435
|
-
found = typedChild.props.children;
|
|
3436
|
-
}
|
|
3437
|
-
if (typedChild.props.children && !found)
|
|
3438
|
-
search(typedChild.props.children);
|
|
3439
|
-
});
|
|
3440
|
-
};
|
|
3441
|
-
search(children2);
|
|
3442
|
-
return found;
|
|
3443
|
-
};
|
|
3444
|
-
useEffect4(() => {
|
|
3445
|
-
if (!selectedLabel && defaultValue) {
|
|
3446
|
-
const label2 = findLabelForValue(children, defaultValue);
|
|
3447
|
-
if (label2) store.setState({ selectedLabel: label2 });
|
|
3448
|
-
}
|
|
3449
|
-
}, [children, defaultValue, selectedLabel]);
|
|
3450
|
-
useEffect4(() => {
|
|
3451
|
-
const handleClickOutside = (event) => {
|
|
3452
|
-
if (selectRef.current && !selectRef.current.contains(event.target)) {
|
|
3453
|
-
setOpen(false);
|
|
3454
|
-
}
|
|
3370
|
+
] }),
|
|
3371
|
+
vertical: /* @__PURE__ */ jsx23("p", { className: "text-sm text-text-800", children: subhead })
|
|
3455
3372
|
};
|
|
3456
|
-
|
|
3457
|
-
|
|
3458
|
-
|
|
3459
|
-
|
|
3460
|
-
|
|
3461
|
-
|
|
3462
|
-
|
|
3373
|
+
return /* @__PURE__ */ jsxs18(
|
|
3374
|
+
CardBase,
|
|
3375
|
+
{
|
|
3376
|
+
ref,
|
|
3377
|
+
layout: isHorizontal ? "horizontal" : "vertical",
|
|
3378
|
+
padding: "none",
|
|
3379
|
+
minHeight: "medium",
|
|
3380
|
+
cursor: "pointer",
|
|
3381
|
+
className: `${isHorizontal ? "h-20" : ""} ${className}`,
|
|
3382
|
+
...props,
|
|
3383
|
+
children: [
|
|
3384
|
+
/* @__PURE__ */ jsx23(
|
|
3385
|
+
"div",
|
|
3386
|
+
{
|
|
3387
|
+
className: `
|
|
3388
|
+
flex justify-center items-center [&>svg]:size-6 text-text-950
|
|
3389
|
+
${isHorizontal ? "min-w-[80px] min-h-[80px] rounded-l-xl" : "min-h-[50px] w-full rounded-t-xl"}
|
|
3390
|
+
${!color.startsWith("#") ? `bg-${color}` : ""}
|
|
3391
|
+
`,
|
|
3392
|
+
style: color.startsWith("#") ? { backgroundColor: color } : void 0,
|
|
3393
|
+
"data-testid": "icon-container",
|
|
3394
|
+
children: icon
|
|
3395
|
+
}
|
|
3396
|
+
),
|
|
3397
|
+
/* @__PURE__ */ jsxs18(
|
|
3398
|
+
"div",
|
|
3399
|
+
{
|
|
3400
|
+
className: `
|
|
3401
|
+
p-4 flex flex-col justify-between w-full h-full
|
|
3402
|
+
${!isHorizontal && "gap-4"}
|
|
3403
|
+
`,
|
|
3404
|
+
children: [
|
|
3405
|
+
/* @__PURE__ */ jsx23(Text_default, { size: "sm", weight: "bold", className: "text-text-950 truncate", children: header }),
|
|
3406
|
+
contentComponent[direction]
|
|
3407
|
+
]
|
|
3408
|
+
}
|
|
3463
3409
|
)
|
|
3464
|
-
|
|
3465
|
-
const focused = document.activeElement;
|
|
3466
|
-
const currentIndex = items.findIndex((item) => item === focused);
|
|
3467
|
-
let nextIndex = 0;
|
|
3468
|
-
if (event.key === "ArrowDown") {
|
|
3469
|
-
nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % items.length;
|
|
3470
|
-
} else {
|
|
3471
|
-
nextIndex = currentIndex === -1 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length;
|
|
3472
|
-
}
|
|
3473
|
-
items[nextIndex]?.focus();
|
|
3410
|
+
]
|
|
3474
3411
|
}
|
|
3475
|
-
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
}
|
|
3491
|
-
}, [propValue]);
|
|
3492
|
-
const sizeClasses = SIZE_CLASSES11[size];
|
|
3493
|
-
return /* @__PURE__ */ jsxs19("div", { className: "w-full", children: [
|
|
3494
|
-
label && /* @__PURE__ */ jsx24(
|
|
3495
|
-
"label",
|
|
3412
|
+
);
|
|
3413
|
+
}
|
|
3414
|
+
);
|
|
3415
|
+
var CardTopic = forwardRef9(
|
|
3416
|
+
({
|
|
3417
|
+
header,
|
|
3418
|
+
subHead,
|
|
3419
|
+
progress,
|
|
3420
|
+
showPercentage = false,
|
|
3421
|
+
progressVariant = "blue",
|
|
3422
|
+
className = "",
|
|
3423
|
+
...props
|
|
3424
|
+
}, ref) => {
|
|
3425
|
+
return /* @__PURE__ */ jsxs18(
|
|
3426
|
+
CardBase,
|
|
3496
3427
|
{
|
|
3497
|
-
|
|
3498
|
-
|
|
3499
|
-
|
|
3428
|
+
ref,
|
|
3429
|
+
layout: "vertical",
|
|
3430
|
+
padding: "small",
|
|
3431
|
+
minHeight: "medium",
|
|
3432
|
+
cursor: "pointer",
|
|
3433
|
+
className: `justify-center gap-2 py-2 px-4 ${className}`,
|
|
3434
|
+
...props,
|
|
3435
|
+
children: [
|
|
3436
|
+
subHead && /* @__PURE__ */ jsx23("span", { className: "text-text-600 text-2xs flex flex-row gap-1", children: subHead.map((text, index) => /* @__PURE__ */ jsxs18(Fragment3, { children: [
|
|
3437
|
+
/* @__PURE__ */ jsx23("p", { children: text }),
|
|
3438
|
+
index < subHead.length - 1 && /* @__PURE__ */ jsx23("p", { children: "\u2022" })
|
|
3439
|
+
] }, `${text} - ${index}`)) }),
|
|
3440
|
+
/* @__PURE__ */ jsx23("p", { className: "text-sm text-text-950 font-bold truncate", children: header }),
|
|
3441
|
+
/* @__PURE__ */ jsxs18("span", { className: "grid grid-cols-[1fr_auto] items-center gap-2", children: [
|
|
3442
|
+
/* @__PURE__ */ jsx23(
|
|
3443
|
+
ProgressBar_default,
|
|
3444
|
+
{
|
|
3445
|
+
size: "small",
|
|
3446
|
+
value: progress,
|
|
3447
|
+
variant: progressVariant,
|
|
3448
|
+
"data-testid": "progress-bar"
|
|
3449
|
+
}
|
|
3450
|
+
),
|
|
3451
|
+
showPercentage && /* @__PURE__ */ jsxs18(
|
|
3452
|
+
Text_default,
|
|
3453
|
+
{
|
|
3454
|
+
size: "xs",
|
|
3455
|
+
weight: "medium",
|
|
3456
|
+
className: `text-text-950 leading-none tracking-normal text-center flex-none`,
|
|
3457
|
+
children: [
|
|
3458
|
+
Math.round(progress),
|
|
3459
|
+
"%"
|
|
3460
|
+
]
|
|
3461
|
+
}
|
|
3462
|
+
)
|
|
3463
|
+
] })
|
|
3464
|
+
]
|
|
3500
3465
|
}
|
|
3501
|
-
)
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
|
|
3506
|
-
|
|
3507
|
-
|
|
3508
|
-
|
|
3509
|
-
|
|
3510
|
-
|
|
3511
|
-
|
|
3512
|
-
|
|
3513
|
-
|
|
3514
|
-
|
|
3515
|
-
|
|
3516
|
-
}) => {
|
|
3517
|
-
|
|
3518
|
-
|
|
3519
|
-
|
|
3520
|
-
|
|
3521
|
-
|
|
3522
|
-
|
|
3466
|
+
);
|
|
3467
|
+
}
|
|
3468
|
+
);
|
|
3469
|
+
var CardPerformance = forwardRef9(
|
|
3470
|
+
({
|
|
3471
|
+
header,
|
|
3472
|
+
progress,
|
|
3473
|
+
description = "Sem dados ainda! Voc\xEA ainda n\xE3o fez um question\xE1rio neste assunto.",
|
|
3474
|
+
actionVariant = "button",
|
|
3475
|
+
progressVariant = "blue",
|
|
3476
|
+
labelProgress = "",
|
|
3477
|
+
className = "",
|
|
3478
|
+
onClickButton,
|
|
3479
|
+
valueButton,
|
|
3480
|
+
...props
|
|
3481
|
+
}, ref) => {
|
|
3482
|
+
const hasProgress = progress !== void 0;
|
|
3483
|
+
return /* @__PURE__ */ jsxs18(
|
|
3484
|
+
CardBase,
|
|
3485
|
+
{
|
|
3486
|
+
ref,
|
|
3487
|
+
layout: "horizontal",
|
|
3488
|
+
padding: "medium",
|
|
3489
|
+
minHeight: "none",
|
|
3490
|
+
className: `justify-between gap-2 ${actionVariant == "caret" ? "cursor-pointer" : ""} ${className}`,
|
|
3491
|
+
onClick: () => actionVariant == "caret" && onClickButton?.(valueButton),
|
|
3492
|
+
...props,
|
|
3493
|
+
children: [
|
|
3494
|
+
/* @__PURE__ */ jsxs18("div", { className: "w-full flex flex-col justify-between gap-2", children: [
|
|
3495
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-row justify-between items-center gap-2", children: [
|
|
3496
|
+
/* @__PURE__ */ jsx23("p", { className: "text-lg font-bold text-text-950 truncate flex-1 min-w-0", children: header }),
|
|
3497
|
+
actionVariant === "button" && /* @__PURE__ */ jsx23(
|
|
3498
|
+
Button_default,
|
|
3499
|
+
{
|
|
3500
|
+
variant: "outline",
|
|
3501
|
+
size: "extra-small",
|
|
3502
|
+
onClick: () => onClickButton?.(valueButton),
|
|
3503
|
+
className: "min-w-fit flex-shrink-0",
|
|
3504
|
+
children: "Ver Aula"
|
|
3505
|
+
}
|
|
3506
|
+
)
|
|
3507
|
+
] }),
|
|
3508
|
+
/* @__PURE__ */ jsx23("div", { className: "w-full", children: hasProgress ? /* @__PURE__ */ jsx23(
|
|
3509
|
+
ProgressBar_default,
|
|
3510
|
+
{
|
|
3511
|
+
value: progress,
|
|
3512
|
+
label: `${progress}% ${labelProgress}`,
|
|
3513
|
+
variant: progressVariant
|
|
3514
|
+
}
|
|
3515
|
+
) : /* @__PURE__ */ jsx23("p", { className: "text-xs text-text-600 truncate", children: description }) })
|
|
3516
|
+
] }),
|
|
3517
|
+
actionVariant == "caret" && /* @__PURE__ */ jsx23(
|
|
3518
|
+
CaretRight,
|
|
3519
|
+
{
|
|
3520
|
+
className: "size-4.5 text-text-800 cursor-pointer",
|
|
3521
|
+
"data-testid": "caret-icon"
|
|
3522
|
+
}
|
|
3523
|
+
)
|
|
3524
|
+
]
|
|
3525
|
+
}
|
|
3526
|
+
);
|
|
3527
|
+
}
|
|
3528
|
+
);
|
|
3529
|
+
var CardResults = forwardRef9(
|
|
3523
3530
|
({
|
|
3531
|
+
header,
|
|
3532
|
+
correct_answers,
|
|
3533
|
+
incorrect_answers,
|
|
3534
|
+
icon,
|
|
3535
|
+
direction = "col",
|
|
3536
|
+
color = "#B7DFFF",
|
|
3524
3537
|
className,
|
|
3525
|
-
invalid = false,
|
|
3526
|
-
variant = "outlined",
|
|
3527
|
-
store: externalStore,
|
|
3528
|
-
disabled,
|
|
3529
|
-
size = "medium",
|
|
3530
|
-
selectId,
|
|
3531
3538
|
...props
|
|
3532
3539
|
}, ref) => {
|
|
3533
|
-
const
|
|
3534
|
-
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
|
|
3538
|
-
|
|
3539
|
-
|
|
3540
|
-
|
|
3540
|
+
const isRow = direction == "row";
|
|
3541
|
+
return /* @__PURE__ */ jsxs18(
|
|
3542
|
+
CardBase,
|
|
3543
|
+
{
|
|
3544
|
+
ref,
|
|
3545
|
+
layout: "horizontal",
|
|
3546
|
+
padding: "none",
|
|
3547
|
+
minHeight: "medium",
|
|
3548
|
+
className: `items-center pr-4 ${className}`,
|
|
3549
|
+
...props,
|
|
3550
|
+
children: [
|
|
3551
|
+
/* @__PURE__ */ jsx23(
|
|
3552
|
+
"div",
|
|
3553
|
+
{
|
|
3554
|
+
className: `
|
|
3555
|
+
flex justify-center items-center [&>svg]:size-8 text-text-950 min-w-20 max-w-20 min-h-20 h-full rounded-l-xl
|
|
3556
|
+
`,
|
|
3557
|
+
style: {
|
|
3558
|
+
backgroundColor: color
|
|
3559
|
+
},
|
|
3560
|
+
children: icon
|
|
3561
|
+
}
|
|
3562
|
+
),
|
|
3563
|
+
/* @__PURE__ */ jsxs18(
|
|
3564
|
+
"div",
|
|
3565
|
+
{
|
|
3566
|
+
className: `
|
|
3567
|
+
p-4 flex justify-between w-full h-full
|
|
3568
|
+
${isRow ? "flex-row items-center gap-2" : "flex-col"}
|
|
3569
|
+
`,
|
|
3570
|
+
children: [
|
|
3571
|
+
/* @__PURE__ */ jsx23("p", { className: "text-sm font-bold text-text-950 truncate flex-1 min-w-0", children: header }),
|
|
3572
|
+
/* @__PURE__ */ jsxs18("span", { className: "flex flex-row gap-1 items-center", children: [
|
|
3573
|
+
/* @__PURE__ */ jsxs18(
|
|
3574
|
+
Badge_default,
|
|
3575
|
+
{
|
|
3576
|
+
action: "success",
|
|
3577
|
+
variant: "solid",
|
|
3578
|
+
size: "medium",
|
|
3579
|
+
iconLeft: /* @__PURE__ */ jsx23(CheckCircle3, {}),
|
|
3580
|
+
children: [
|
|
3581
|
+
correct_answers,
|
|
3582
|
+
" Corretas"
|
|
3583
|
+
]
|
|
3584
|
+
}
|
|
3585
|
+
),
|
|
3586
|
+
/* @__PURE__ */ jsxs18(
|
|
3587
|
+
Badge_default,
|
|
3588
|
+
{
|
|
3589
|
+
action: "error",
|
|
3590
|
+
variant: "solid",
|
|
3591
|
+
size: "medium",
|
|
3592
|
+
iconLeft: /* @__PURE__ */ jsx23(XCircle2, {}),
|
|
3593
|
+
children: [
|
|
3594
|
+
incorrect_answers,
|
|
3595
|
+
" Incorretas"
|
|
3596
|
+
]
|
|
3597
|
+
}
|
|
3598
|
+
)
|
|
3599
|
+
] })
|
|
3600
|
+
]
|
|
3601
|
+
}
|
|
3602
|
+
),
|
|
3603
|
+
/* @__PURE__ */ jsx23(CaretRight, { className: "min-w-6 min-h-6 text-text-800 cursor-pointer" })
|
|
3604
|
+
]
|
|
3605
|
+
}
|
|
3606
|
+
);
|
|
3607
|
+
}
|
|
3608
|
+
);
|
|
3609
|
+
var CardStatus = forwardRef9(
|
|
3610
|
+
({ header, className, status, ...props }, ref) => {
|
|
3611
|
+
return /* @__PURE__ */ jsx23(
|
|
3612
|
+
CardBase,
|
|
3613
|
+
{
|
|
3614
|
+
ref,
|
|
3615
|
+
layout: "horizontal",
|
|
3616
|
+
padding: "medium",
|
|
3617
|
+
minHeight: "medium",
|
|
3618
|
+
className: `items-center ${className}`,
|
|
3619
|
+
...props,
|
|
3620
|
+
children: /* @__PURE__ */ jsxs18("div", { className: "flex justify-between w-full h-full flex-row items-center gap-2", children: [
|
|
3621
|
+
/* @__PURE__ */ jsx23("p", { className: "text-sm font-bold text-text-950 truncate flex-1 min-w-0", children: header }),
|
|
3622
|
+
status && /* @__PURE__ */ jsxs18("span", { className: "flex flex-row gap-1 items-center flex-shrink-0", children: [
|
|
3623
|
+
/* @__PURE__ */ jsx23(
|
|
3624
|
+
Badge_default,
|
|
3625
|
+
{
|
|
3626
|
+
action: status == "correct" ? "success" : "error",
|
|
3627
|
+
variant: "solid",
|
|
3628
|
+
size: "medium",
|
|
3629
|
+
iconLeft: /* @__PURE__ */ jsx23(CheckCircle3, {}),
|
|
3630
|
+
children: status == "correct" ? "Correta" : "Incorreta"
|
|
3631
|
+
}
|
|
3632
|
+
),
|
|
3633
|
+
/* @__PURE__ */ jsx23("p", { className: "text-sm text-text-800", children: "Respondida" })
|
|
3634
|
+
] }),
|
|
3635
|
+
/* @__PURE__ */ jsx23(CaretRight, { className: "min-w-6 min-h-6 text-text-800 cursor-pointer flex-shrink-0 ml-2" })
|
|
3636
|
+
] })
|
|
3637
|
+
}
|
|
3638
|
+
);
|
|
3639
|
+
}
|
|
3640
|
+
);
|
|
3641
|
+
var CardSettings = forwardRef9(
|
|
3642
|
+
({ header, className, icon, ...props }, ref) => {
|
|
3643
|
+
return /* @__PURE__ */ jsxs18(
|
|
3644
|
+
CardBase,
|
|
3541
3645
|
{
|
|
3542
3646
|
ref,
|
|
3543
|
-
|
|
3544
|
-
|
|
3545
|
-
|
|
3546
|
-
|
|
3547
|
-
${invalid && `${variant == "underlined" ? "border-b-2" : "border-2"} border-indicator-error text-text-600`}
|
|
3548
|
-
${disabled ? "cursor-not-allowed text-text-400 pointer-events-none opacity-50" : "cursor-pointer hover:bg-background-50 focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground"}
|
|
3549
|
-
${!invalid && !disabled ? "text-text-700" : ""}
|
|
3550
|
-
${variantClasses}
|
|
3551
|
-
${className}
|
|
3552
|
-
`,
|
|
3553
|
-
onClick: toggleOpen,
|
|
3554
|
-
"aria-expanded": open,
|
|
3555
|
-
"aria-haspopup": "listbox",
|
|
3556
|
-
"aria-controls": open ? "select-content" : void 0,
|
|
3647
|
+
layout: "horizontal",
|
|
3648
|
+
padding: "small",
|
|
3649
|
+
minHeight: "none",
|
|
3650
|
+
className: `border-none items-center gap-2 text-text-700 ${className}`,
|
|
3557
3651
|
...props,
|
|
3558
3652
|
children: [
|
|
3559
|
-
|
|
3560
|
-
/* @__PURE__ */
|
|
3561
|
-
|
|
3562
|
-
{
|
|
3563
|
-
className: `h-[1em] w-[1em] opacity-50 transition-transform ${open ? "rotate-180" : ""}`
|
|
3564
|
-
}
|
|
3565
|
-
)
|
|
3653
|
+
/* @__PURE__ */ jsx23("span", { className: "[&>svg]:size-6", children: icon }),
|
|
3654
|
+
/* @__PURE__ */ jsx23("p", { className: "w-full text-sm truncate", children: header }),
|
|
3655
|
+
/* @__PURE__ */ jsx23(CaretRight, { size: 24, className: "cursor-pointer" })
|
|
3566
3656
|
]
|
|
3567
3657
|
}
|
|
3568
3658
|
);
|
|
3569
3659
|
}
|
|
3570
3660
|
);
|
|
3571
|
-
|
|
3572
|
-
|
|
3573
|
-
|
|
3574
|
-
|
|
3575
|
-
className,
|
|
3576
|
-
align = "start",
|
|
3577
|
-
side = "bottom",
|
|
3578
|
-
store: externalStore,
|
|
3579
|
-
...props
|
|
3580
|
-
}, ref) => {
|
|
3581
|
-
const store = useSelectStore(externalStore);
|
|
3582
|
-
const open = useStore2(store, (s) => s.open);
|
|
3583
|
-
if (!open) return null;
|
|
3584
|
-
const getPositionClasses = () => `w-full min-w-full absolute ${SIDE_CLASSES2[side]} ${ALIGN_CLASSES2[align]}`;
|
|
3585
|
-
return /* @__PURE__ */ jsx24(
|
|
3586
|
-
"div",
|
|
3661
|
+
var CardSupport = forwardRef9(
|
|
3662
|
+
({ header, className, direction = "col", children, ...props }, ref) => {
|
|
3663
|
+
return /* @__PURE__ */ jsxs18(
|
|
3664
|
+
CardBase,
|
|
3587
3665
|
{
|
|
3588
|
-
role: "menu",
|
|
3589
3666
|
ref,
|
|
3590
|
-
|
|
3667
|
+
layout: "horizontal",
|
|
3668
|
+
padding: "medium",
|
|
3669
|
+
minHeight: "none",
|
|
3670
|
+
className: `border-none items-center gap-2 text-text-700 ${className}`,
|
|
3591
3671
|
...props,
|
|
3592
|
-
children
|
|
3672
|
+
children: [
|
|
3673
|
+
/* @__PURE__ */ jsxs18(
|
|
3674
|
+
"div",
|
|
3675
|
+
{
|
|
3676
|
+
className: `
|
|
3677
|
+
w-full flex ${direction == "col" ? "flex-col" : "flex-row items-center"} gap-2
|
|
3678
|
+
`,
|
|
3679
|
+
children: [
|
|
3680
|
+
/* @__PURE__ */ jsx23("span", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx23("p", { className: "text-sm text-text-950 font-bold truncate", children: header }) }),
|
|
3681
|
+
/* @__PURE__ */ jsx23("span", { className: "flex flex-row gap-1", children })
|
|
3682
|
+
]
|
|
3683
|
+
}
|
|
3684
|
+
),
|
|
3685
|
+
/* @__PURE__ */ jsx23(CaretRight, { className: "text-text-800 cursor-pointer", size: 24 })
|
|
3686
|
+
]
|
|
3593
3687
|
}
|
|
3594
3688
|
);
|
|
3595
3689
|
}
|
|
3596
3690
|
);
|
|
3597
|
-
|
|
3598
|
-
var SelectItem = forwardRef10(
|
|
3691
|
+
var CardForum = forwardRef9(
|
|
3599
3692
|
({
|
|
3600
|
-
|
|
3601
|
-
|
|
3602
|
-
|
|
3603
|
-
|
|
3604
|
-
|
|
3693
|
+
title,
|
|
3694
|
+
content,
|
|
3695
|
+
comments,
|
|
3696
|
+
onClickComments,
|
|
3697
|
+
valueComments,
|
|
3698
|
+
onClickProfile,
|
|
3699
|
+
valueProfile,
|
|
3700
|
+
className = "",
|
|
3701
|
+
date,
|
|
3702
|
+
hour,
|
|
3605
3703
|
...props
|
|
3606
3704
|
}, ref) => {
|
|
3607
|
-
|
|
3608
|
-
|
|
3609
|
-
value: selectedValue,
|
|
3610
|
-
setValue,
|
|
3611
|
-
setOpen,
|
|
3612
|
-
setSelectedLabel,
|
|
3613
|
-
onValueChange
|
|
3614
|
-
} = useStore2(store, (s) => s);
|
|
3615
|
-
const handleClick = (e) => {
|
|
3616
|
-
const labelNode = getLabelAsNode(children);
|
|
3617
|
-
if (!disabled) {
|
|
3618
|
-
setValue(value);
|
|
3619
|
-
setSelectedLabel(labelNode);
|
|
3620
|
-
setOpen(false);
|
|
3621
|
-
onValueChange?.(value);
|
|
3622
|
-
}
|
|
3623
|
-
props.onClick?.(e);
|
|
3624
|
-
};
|
|
3625
|
-
return /* @__PURE__ */ jsxs19(
|
|
3626
|
-
"div",
|
|
3705
|
+
return /* @__PURE__ */ jsxs18(
|
|
3706
|
+
CardBase,
|
|
3627
3707
|
{
|
|
3628
|
-
role: "menuitem",
|
|
3629
|
-
"aria-disabled": disabled,
|
|
3630
3708
|
ref,
|
|
3631
|
-
|
|
3632
|
-
|
|
3633
|
-
|
|
3634
|
-
|
|
3635
|
-
|
|
3636
|
-
${selectedValue === value && "bg-background-50"}
|
|
3637
|
-
`,
|
|
3638
|
-
onClick: handleClick,
|
|
3639
|
-
onKeyDown: (e) => {
|
|
3640
|
-
if (e.key === "Enter" || e.key === " ") handleClick(e);
|
|
3641
|
-
},
|
|
3642
|
-
tabIndex: disabled ? -1 : 0,
|
|
3709
|
+
layout: "horizontal",
|
|
3710
|
+
padding: "medium",
|
|
3711
|
+
minHeight: "none",
|
|
3712
|
+
variant: "minimal",
|
|
3713
|
+
className: `w-auto h-auto gap-3 ${className}`,
|
|
3643
3714
|
...props,
|
|
3644
3715
|
children: [
|
|
3645
|
-
/* @__PURE__ */
|
|
3646
|
-
|
|
3716
|
+
/* @__PURE__ */ jsx23(
|
|
3717
|
+
"button",
|
|
3718
|
+
{
|
|
3719
|
+
type: "button",
|
|
3720
|
+
"aria-label": "Ver perfil",
|
|
3721
|
+
onClick: () => onClickProfile?.(valueProfile),
|
|
3722
|
+
className: "min-w-8 h-8 rounded-full bg-background-950"
|
|
3723
|
+
}
|
|
3724
|
+
),
|
|
3725
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-2 flex-1 min-w-0", children: [
|
|
3726
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-row gap-1 items-center flex-wrap", children: [
|
|
3727
|
+
/* @__PURE__ */ jsx23("p", { className: "text-xs font-semibold text-primary-700 truncate", children: title }),
|
|
3728
|
+
/* @__PURE__ */ jsxs18("p", { className: "text-xs text-text-600", children: [
|
|
3729
|
+
"\u2022 ",
|
|
3730
|
+
date,
|
|
3731
|
+
" \u2022 ",
|
|
3732
|
+
hour
|
|
3733
|
+
] })
|
|
3734
|
+
] }),
|
|
3735
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-950 text-sm line-clamp-2 truncate", children: content }),
|
|
3736
|
+
/* @__PURE__ */ jsxs18(
|
|
3737
|
+
"button",
|
|
3738
|
+
{
|
|
3739
|
+
type: "button",
|
|
3740
|
+
"aria-label": "Ver coment\xE1rios",
|
|
3741
|
+
onClick: () => onClickComments?.(valueComments),
|
|
3742
|
+
className: "text-text-600 flex flex-row gap-2 items-center",
|
|
3743
|
+
children: [
|
|
3744
|
+
/* @__PURE__ */ jsx23(ChatCircleText, { "aria-hidden": "true", size: 16 }),
|
|
3745
|
+
/* @__PURE__ */ jsxs18("p", { className: "text-xs", children: [
|
|
3746
|
+
comments,
|
|
3747
|
+
" respostas"
|
|
3748
|
+
] })
|
|
3749
|
+
]
|
|
3750
|
+
}
|
|
3751
|
+
)
|
|
3752
|
+
] })
|
|
3647
3753
|
]
|
|
3648
3754
|
}
|
|
3649
3755
|
);
|
|
3650
3756
|
}
|
|
3651
3757
|
);
|
|
3652
|
-
|
|
3653
|
-
var Select_default = Select;
|
|
3654
|
-
|
|
3655
|
-
// src/components/Menu/Menu.tsx
|
|
3656
|
-
import { create as create4, useStore as useStore3 } from "zustand";
|
|
3657
|
-
import {
|
|
3658
|
-
useEffect as useEffect5,
|
|
3659
|
-
useRef as useRef4,
|
|
3660
|
-
forwardRef as forwardRef11,
|
|
3661
|
-
isValidElement as isValidElement3,
|
|
3662
|
-
Children as Children3,
|
|
3663
|
-
cloneElement as cloneElement3,
|
|
3664
|
-
useState as useState7
|
|
3665
|
-
} from "react";
|
|
3666
|
-
import { CaretLeft, CaretRight } from "phosphor-react";
|
|
3667
|
-
import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3668
|
-
var createMenuStore = (onValueChange) => create4((set) => ({
|
|
3669
|
-
value: "",
|
|
3670
|
-
setValue: (value) => {
|
|
3671
|
-
set({ value });
|
|
3672
|
-
onValueChange?.(value);
|
|
3673
|
-
},
|
|
3674
|
-
onValueChange
|
|
3675
|
-
}));
|
|
3676
|
-
var useMenuStore = (externalStore) => {
|
|
3677
|
-
if (!externalStore) throw new Error("MenuItem must be inside Menu");
|
|
3678
|
-
return externalStore;
|
|
3679
|
-
};
|
|
3680
|
-
var VARIANT_CLASSES5 = {
|
|
3681
|
-
menu: "bg-background shadow-soft-shadow-1 px-6",
|
|
3682
|
-
menu2: "",
|
|
3683
|
-
breadcrumb: ""
|
|
3684
|
-
};
|
|
3685
|
-
var Menu = forwardRef11(
|
|
3758
|
+
var CardAudio = forwardRef9(
|
|
3686
3759
|
({
|
|
3760
|
+
src,
|
|
3761
|
+
title,
|
|
3762
|
+
onPlay,
|
|
3763
|
+
onPause,
|
|
3764
|
+
onEnded,
|
|
3765
|
+
onAudioTimeUpdate,
|
|
3766
|
+
loop = false,
|
|
3767
|
+
preload = "metadata",
|
|
3768
|
+
tracks,
|
|
3687
3769
|
className,
|
|
3688
|
-
children,
|
|
3689
|
-
defaultValue,
|
|
3690
|
-
value: propValue,
|
|
3691
|
-
variant = "menu",
|
|
3692
|
-
onValueChange,
|
|
3693
3770
|
...props
|
|
3694
3771
|
}, ref) => {
|
|
3695
|
-
const
|
|
3696
|
-
|
|
3697
|
-
const
|
|
3698
|
-
const
|
|
3699
|
-
|
|
3700
|
-
|
|
3701
|
-
|
|
3702
|
-
|
|
3703
|
-
|
|
3704
|
-
|
|
3705
|
-
|
|
3706
|
-
|
|
3707
|
-
|
|
3708
|
-
|
|
3709
|
-
|
|
3710
|
-
|
|
3711
|
-
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
|
-
|
|
3772
|
+
const [isPlaying, setIsPlaying] = useState6(false);
|
|
3773
|
+
const [currentTime, setCurrentTime] = useState6(0);
|
|
3774
|
+
const [duration, setDuration] = useState6(0);
|
|
3775
|
+
const [volume, setVolume] = useState6(1);
|
|
3776
|
+
const [showVolumeControl, setShowVolumeControl] = useState6(false);
|
|
3777
|
+
const audioRef = useRef3(null);
|
|
3778
|
+
const formatTime = (time) => {
|
|
3779
|
+
const minutes = Math.floor(time / 60);
|
|
3780
|
+
const seconds = Math.floor(time % 60);
|
|
3781
|
+
return `${minutes}:${seconds.toString().padStart(2, "0")}`;
|
|
3782
|
+
};
|
|
3783
|
+
const handlePlayPause = () => {
|
|
3784
|
+
if (isPlaying) {
|
|
3785
|
+
audioRef.current?.pause();
|
|
3786
|
+
setIsPlaying(false);
|
|
3787
|
+
onPause?.();
|
|
3788
|
+
} else {
|
|
3789
|
+
audioRef.current?.play();
|
|
3790
|
+
setIsPlaying(true);
|
|
3791
|
+
onPlay?.();
|
|
3715
3792
|
}
|
|
3716
|
-
|
|
3717
|
-
|
|
3718
|
-
|
|
3719
|
-
|
|
3720
|
-
|
|
3721
|
-
|
|
3722
|
-
|
|
3723
|
-
|
|
3724
|
-
|
|
3725
|
-
|
|
3726
|
-
|
|
3727
|
-
|
|
3728
|
-
|
|
3729
|
-
|
|
3730
|
-
|
|
3731
|
-
|
|
3732
|
-
|
|
3733
|
-
|
|
3734
|
-
|
|
3735
|
-
|
|
3736
|
-
|
|
3793
|
+
};
|
|
3794
|
+
const handleTimeUpdate = () => {
|
|
3795
|
+
const current = audioRef.current?.currentTime ?? 0;
|
|
3796
|
+
const total = audioRef.current?.duration ?? 0;
|
|
3797
|
+
setCurrentTime(current);
|
|
3798
|
+
setDuration(total);
|
|
3799
|
+
onAudioTimeUpdate?.(current, total);
|
|
3800
|
+
};
|
|
3801
|
+
const handleLoadedMetadata = () => {
|
|
3802
|
+
setDuration(audioRef.current?.duration ?? 0);
|
|
3803
|
+
};
|
|
3804
|
+
const handleEnded = () => {
|
|
3805
|
+
setIsPlaying(false);
|
|
3806
|
+
setCurrentTime(0);
|
|
3807
|
+
onEnded?.();
|
|
3808
|
+
};
|
|
3809
|
+
const handleProgressClick = (e) => {
|
|
3810
|
+
const rect = e.currentTarget.getBoundingClientRect();
|
|
3811
|
+
const clickX = e.clientX - rect.left;
|
|
3812
|
+
const width = rect.width;
|
|
3813
|
+
const percentage = clickX / width;
|
|
3814
|
+
const newTime = percentage * duration;
|
|
3815
|
+
if (audioRef.current) {
|
|
3816
|
+
audioRef.current.currentTime = newTime;
|
|
3737
3817
|
}
|
|
3738
|
-
|
|
3739
|
-
|
|
3740
|
-
)
|
|
3741
|
-
|
|
3742
|
-
|
|
3743
|
-
|
|
3744
|
-
|
|
3745
|
-
children,
|
|
3746
|
-
value,
|
|
3747
|
-
disabled = false,
|
|
3748
|
-
store: externalStore,
|
|
3749
|
-
variant = "menu",
|
|
3750
|
-
separator = false,
|
|
3751
|
-
...props
|
|
3752
|
-
}, ref) => {
|
|
3753
|
-
const store = useMenuStore(externalStore);
|
|
3754
|
-
const { value: selectedValue, setValue } = useStore3(store, (s) => s);
|
|
3755
|
-
const handleClick = (e) => {
|
|
3756
|
-
if (!disabled) {
|
|
3757
|
-
setValue(value);
|
|
3818
|
+
setCurrentTime(newTime);
|
|
3819
|
+
};
|
|
3820
|
+
const handleVolumeChange = (e) => {
|
|
3821
|
+
const newVolume = parseFloat(e.target.value);
|
|
3822
|
+
setVolume(newVolume);
|
|
3823
|
+
if (audioRef.current) {
|
|
3824
|
+
audioRef.current.volume = newVolume;
|
|
3758
3825
|
}
|
|
3759
|
-
props.onClick?.(e);
|
|
3760
3826
|
};
|
|
3761
|
-
const
|
|
3762
|
-
|
|
3763
|
-
"aria-disabled": disabled,
|
|
3764
|
-
ref,
|
|
3765
|
-
onClick: handleClick,
|
|
3766
|
-
onKeyDown: (e) => {
|
|
3767
|
-
if (["Enter", " "].includes(e.key)) handleClick(e);
|
|
3768
|
-
},
|
|
3769
|
-
tabIndex: disabled ? -1 : 0,
|
|
3770
|
-
onMouseDown: (e) => {
|
|
3771
|
-
e.preventDefault();
|
|
3772
|
-
},
|
|
3773
|
-
...props
|
|
3827
|
+
const toggleVolumeControl = () => {
|
|
3828
|
+
setShowVolumeControl(!showVolumeControl);
|
|
3774
3829
|
};
|
|
3775
|
-
const
|
|
3776
|
-
|
|
3777
|
-
|
|
3778
|
-
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
|
|
3782
|
-
|
|
3783
|
-
|
|
3784
|
-
|
|
3785
|
-
|
|
3786
|
-
|
|
3787
|
-
|
|
3788
|
-
|
|
3789
|
-
|
|
3790
|
-
|
|
3791
|
-
|
|
3792
|
-
|
|
3793
|
-
|
|
3794
|
-
|
|
3795
|
-
|
|
3796
|
-
|
|
3797
|
-
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
|
|
3806
|
-
|
|
3807
|
-
|
|
3808
|
-
|
|
3809
|
-
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
|
|
3814
|
-
|
|
3815
|
-
|
|
3816
|
-
|
|
3817
|
-
|
|
3818
|
-
|
|
3819
|
-
|
|
3820
|
-
|
|
3821
|
-
|
|
3822
|
-
|
|
3823
|
-
|
|
3824
|
-
|
|
3825
|
-
|
|
3826
|
-
|
|
3830
|
+
const getVolumeIcon = () => {
|
|
3831
|
+
if (volume === 0) {
|
|
3832
|
+
return /* @__PURE__ */ jsx23(SpeakerSimpleX, {});
|
|
3833
|
+
}
|
|
3834
|
+
if (volume < 0.5) {
|
|
3835
|
+
return /* @__PURE__ */ jsx23(SpeakerLow, {});
|
|
3836
|
+
}
|
|
3837
|
+
return /* @__PURE__ */ jsx23(SpeakerHigh, {});
|
|
3838
|
+
};
|
|
3839
|
+
return /* @__PURE__ */ jsxs18(
|
|
3840
|
+
CardBase,
|
|
3841
|
+
{
|
|
3842
|
+
ref,
|
|
3843
|
+
layout: "horizontal",
|
|
3844
|
+
padding: "medium",
|
|
3845
|
+
minHeight: "none",
|
|
3846
|
+
className: `w-auto h-14 items-center gap-2 ${className}`,
|
|
3847
|
+
...props,
|
|
3848
|
+
children: [
|
|
3849
|
+
/* @__PURE__ */ jsx23(
|
|
3850
|
+
"audio",
|
|
3851
|
+
{
|
|
3852
|
+
ref: audioRef,
|
|
3853
|
+
src,
|
|
3854
|
+
loop,
|
|
3855
|
+
preload,
|
|
3856
|
+
onTimeUpdate: handleTimeUpdate,
|
|
3857
|
+
onLoadedMetadata: handleLoadedMetadata,
|
|
3858
|
+
onEnded: handleEnded,
|
|
3859
|
+
"data-testid": "audio-element",
|
|
3860
|
+
"aria-label": title,
|
|
3861
|
+
children: tracks ? tracks.map((track) => /* @__PURE__ */ jsx23(
|
|
3862
|
+
"track",
|
|
3863
|
+
{
|
|
3864
|
+
kind: track.kind,
|
|
3865
|
+
src: track.src,
|
|
3866
|
+
srcLang: track.srcLang,
|
|
3867
|
+
label: track.label,
|
|
3868
|
+
default: track.default
|
|
3869
|
+
},
|
|
3870
|
+
track.src
|
|
3871
|
+
)) : /* @__PURE__ */ jsx23(
|
|
3872
|
+
"track",
|
|
3873
|
+
{
|
|
3874
|
+
kind: "captions",
|
|
3875
|
+
src: "data:text/vtt;base64,",
|
|
3876
|
+
srcLang: "pt",
|
|
3877
|
+
label: "Sem legendas dispon\xEDveis"
|
|
3878
|
+
}
|
|
3879
|
+
)
|
|
3880
|
+
}
|
|
3881
|
+
),
|
|
3882
|
+
/* @__PURE__ */ jsx23(
|
|
3883
|
+
"button",
|
|
3884
|
+
{
|
|
3885
|
+
type: "button",
|
|
3886
|
+
onClick: handlePlayPause,
|
|
3887
|
+
disabled: !src,
|
|
3888
|
+
className: "cursor-pointer text-text-950 hover:text-primary-600 disabled:text-text-400 disabled:cursor-not-allowed",
|
|
3889
|
+
"aria-label": isPlaying ? "Pausar" : "Reproduzir",
|
|
3890
|
+
children: isPlaying ? /* @__PURE__ */ jsx23("div", { className: "w-6 h-6 flex items-center justify-center", children: /* @__PURE__ */ jsxs18("div", { className: "flex gap-0.5", children: [
|
|
3891
|
+
/* @__PURE__ */ jsx23("div", { className: "w-1 h-4 bg-current rounded-sm" }),
|
|
3892
|
+
/* @__PURE__ */ jsx23("div", { className: "w-1 h-4 bg-current rounded-sm" })
|
|
3893
|
+
] }) }) : /* @__PURE__ */ jsx23(Play, { size: 24 })
|
|
3894
|
+
}
|
|
3895
|
+
),
|
|
3896
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-800 text-sm font-medium min-w-[2.5rem]", children: formatTime(currentTime) }),
|
|
3897
|
+
/* @__PURE__ */ jsx23("div", { className: "flex-1 relative", "data-testid": "progress-bar", children: /* @__PURE__ */ jsx23(
|
|
3898
|
+
"button",
|
|
3899
|
+
{
|
|
3900
|
+
type: "button",
|
|
3901
|
+
className: "w-full h-2 bg-border-100 rounded-full cursor-pointer",
|
|
3902
|
+
onClick: handleProgressClick,
|
|
3903
|
+
onKeyDown: (e) => {
|
|
3904
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
3905
|
+
e.preventDefault();
|
|
3906
|
+
handleProgressClick(
|
|
3907
|
+
e
|
|
3908
|
+
);
|
|
3909
|
+
}
|
|
3910
|
+
},
|
|
3911
|
+
"aria-label": "Barra de progresso do \xE1udio",
|
|
3912
|
+
children: /* @__PURE__ */ jsx23(
|
|
3913
|
+
"div",
|
|
3914
|
+
{
|
|
3915
|
+
className: "h-full bg-primary-600 rounded-full transition-all duration-100",
|
|
3916
|
+
style: {
|
|
3917
|
+
width: duration > 0 ? `${currentTime / duration * 100}%` : "0%"
|
|
3918
|
+
}
|
|
3919
|
+
}
|
|
3920
|
+
)
|
|
3921
|
+
}
|
|
3922
|
+
) }),
|
|
3923
|
+
/* @__PURE__ */ jsx23("p", { className: "text-text-800 text-sm font-medium min-w-[2.5rem]", children: formatTime(duration) }),
|
|
3924
|
+
/* @__PURE__ */ jsxs18("div", { className: "relative", children: [
|
|
3925
|
+
/* @__PURE__ */ jsx23(
|
|
3926
|
+
"button",
|
|
3827
3927
|
{
|
|
3828
|
-
|
|
3829
|
-
|
|
3830
|
-
|
|
3831
|
-
|
|
3832
|
-
children
|
|
3928
|
+
type: "button",
|
|
3929
|
+
onClick: toggleVolumeControl,
|
|
3930
|
+
className: "cursor-pointer text-text-950 hover:text-primary-600",
|
|
3931
|
+
"aria-label": "Controle de volume",
|
|
3932
|
+
children: /* @__PURE__ */ jsx23("div", { className: "w-6 h-6 flex items-center justify-center", children: getVolumeIcon() })
|
|
3833
3933
|
}
|
|
3834
3934
|
),
|
|
3835
|
-
|
|
3836
|
-
|
|
3935
|
+
showVolumeControl && /* @__PURE__ */ jsx23(
|
|
3936
|
+
"button",
|
|
3837
3937
|
{
|
|
3838
|
-
|
|
3839
|
-
className: "
|
|
3840
|
-
|
|
3938
|
+
type: "button",
|
|
3939
|
+
className: "absolute bottom-full right-0 mb-2 p-2 bg-background border border-border-100 rounded-lg shadow-lg focus:outline-none focus:ring-2 focus:ring-primary-500",
|
|
3940
|
+
onKeyDown: (e) => {
|
|
3941
|
+
if (e.key === "Escape") {
|
|
3942
|
+
setShowVolumeControl(false);
|
|
3943
|
+
}
|
|
3944
|
+
},
|
|
3945
|
+
children: /* @__PURE__ */ jsx23(
|
|
3946
|
+
"input",
|
|
3947
|
+
{
|
|
3948
|
+
type: "range",
|
|
3949
|
+
min: "0",
|
|
3950
|
+
max: "1",
|
|
3951
|
+
step: "0.1",
|
|
3952
|
+
value: volume,
|
|
3953
|
+
onChange: handleVolumeChange,
|
|
3954
|
+
onKeyDown: (e) => {
|
|
3955
|
+
if (e.key === "ArrowUp" || e.key === "ArrowRight") {
|
|
3956
|
+
e.preventDefault();
|
|
3957
|
+
const newVolume = Math.min(
|
|
3958
|
+
1,
|
|
3959
|
+
Math.round((volume + 0.1) * 10) / 10
|
|
3960
|
+
);
|
|
3961
|
+
setVolume(newVolume);
|
|
3962
|
+
if (audioRef.current) audioRef.current.volume = newVolume;
|
|
3963
|
+
} else if (e.key === "ArrowDown" || e.key === "ArrowLeft") {
|
|
3964
|
+
e.preventDefault();
|
|
3965
|
+
const newVolume = Math.max(
|
|
3966
|
+
0,
|
|
3967
|
+
Math.round((volume - 0.1) * 10) / 10
|
|
3968
|
+
);
|
|
3969
|
+
setVolume(newVolume);
|
|
3970
|
+
if (audioRef.current) audioRef.current.volume = newVolume;
|
|
3971
|
+
}
|
|
3972
|
+
},
|
|
3973
|
+
className: "w-20 h-2 bg-border-100 rounded-lg appearance-none cursor-pointer",
|
|
3974
|
+
style: {
|
|
3975
|
+
background: `linear-gradient(to right, #3b82f6 0%, #3b82f6 ${volume * 100}%, #e5e7eb ${volume * 100}%, #e5e7eb 100%)`
|
|
3976
|
+
},
|
|
3977
|
+
"aria-label": "Volume",
|
|
3978
|
+
"aria-valuenow": Math.round(volume * 100),
|
|
3979
|
+
"aria-valuemin": 0,
|
|
3980
|
+
"aria-valuemax": 100
|
|
3981
|
+
}
|
|
3982
|
+
)
|
|
3841
3983
|
}
|
|
3842
3984
|
)
|
|
3843
|
-
]
|
|
3844
|
-
|
|
3845
|
-
|
|
3846
|
-
|
|
3847
|
-
|
|
3985
|
+
] }),
|
|
3986
|
+
/* @__PURE__ */ jsx23(
|
|
3987
|
+
DotsThreeVertical,
|
|
3988
|
+
{
|
|
3989
|
+
size: 24,
|
|
3990
|
+
className: "text-text-950 cursor-pointer hover:text-primary-600"
|
|
3991
|
+
}
|
|
3992
|
+
)
|
|
3993
|
+
]
|
|
3994
|
+
}
|
|
3995
|
+
);
|
|
3848
3996
|
}
|
|
3849
3997
|
);
|
|
3850
|
-
|
|
3851
|
-
|
|
3852
|
-
|
|
3853
|
-
|
|
3854
|
-
|
|
3855
|
-
behavior: "smooth"
|
|
3856
|
-
});
|
|
3857
|
-
};
|
|
3858
|
-
var internalCheckScroll = (container, setShowLeftArrow, setShowRightArrow) => {
|
|
3859
|
-
if (!container) return;
|
|
3860
|
-
const { scrollLeft, scrollWidth, clientWidth } = container;
|
|
3861
|
-
setShowLeftArrow(scrollLeft > 0);
|
|
3862
|
-
setShowRightArrow(scrollLeft + clientWidth < scrollWidth);
|
|
3998
|
+
var SIMULADO_BACKGROUND_CLASSES = {
|
|
3999
|
+
enem: "bg-exam-1",
|
|
4000
|
+
prova: "bg-exam-2",
|
|
4001
|
+
simuladao: "bg-exam-3",
|
|
4002
|
+
vestibular: "bg-exam-4"
|
|
3863
4003
|
};
|
|
3864
|
-
var
|
|
3865
|
-
|
|
3866
|
-
|
|
3867
|
-
|
|
3868
|
-
|
|
3869
|
-
|
|
3870
|
-
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
3877
|
-
|
|
3878
|
-
|
|
3879
|
-
|
|
4004
|
+
var CardSimulado = forwardRef9(
|
|
4005
|
+
({ title, duration, info, backgroundColor, className, ...props }, ref) => {
|
|
4006
|
+
const backgroundClass = SIMULADO_BACKGROUND_CLASSES[backgroundColor];
|
|
4007
|
+
return /* @__PURE__ */ jsx23(
|
|
4008
|
+
CardBase,
|
|
4009
|
+
{
|
|
4010
|
+
ref,
|
|
4011
|
+
layout: "horizontal",
|
|
4012
|
+
padding: "medium",
|
|
4013
|
+
minHeight: "none",
|
|
4014
|
+
cursor: "pointer",
|
|
4015
|
+
className: `${backgroundClass} hover:shadow-soft-shadow-2 transition-shadow duration-200 ${className}`,
|
|
4016
|
+
...props,
|
|
4017
|
+
children: /* @__PURE__ */ jsxs18("div", { className: "flex justify-between items-center w-full gap-4", children: [
|
|
4018
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-1 flex-1 min-w-0", children: [
|
|
4019
|
+
/* @__PURE__ */ jsx23(Text_default, { size: "lg", weight: "bold", className: "text-text-950 truncate", children: title }),
|
|
4020
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-4 text-text-700", children: [
|
|
4021
|
+
duration && /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-1", children: [
|
|
4022
|
+
/* @__PURE__ */ jsx23(Clock, { size: 16, className: "flex-shrink-0" }),
|
|
4023
|
+
/* @__PURE__ */ jsx23(Text_default, { size: "sm", children: duration })
|
|
4024
|
+
] }),
|
|
4025
|
+
/* @__PURE__ */ jsx23(Text_default, { size: "sm", className: "truncate", children: info })
|
|
4026
|
+
] })
|
|
4027
|
+
] }),
|
|
4028
|
+
/* @__PURE__ */ jsx23(
|
|
4029
|
+
CaretRight,
|
|
4030
|
+
{
|
|
4031
|
+
size: 24,
|
|
4032
|
+
className: "text-text-800 flex-shrink-0",
|
|
4033
|
+
"data-testid": "caret-icon"
|
|
4034
|
+
}
|
|
4035
|
+
)
|
|
4036
|
+
] })
|
|
4037
|
+
}
|
|
3880
4038
|
);
|
|
3881
|
-
|
|
3882
|
-
|
|
3883
|
-
container?.addEventListener("scroll", checkScroll);
|
|
3884
|
-
window.addEventListener("resize", checkScroll);
|
|
3885
|
-
return () => {
|
|
3886
|
-
container?.removeEventListener("scroll", checkScroll);
|
|
3887
|
-
window.removeEventListener("resize", checkScroll);
|
|
3888
|
-
};
|
|
3889
|
-
}, []);
|
|
3890
|
-
return /* @__PURE__ */ jsxs20(
|
|
3891
|
-
"div",
|
|
3892
|
-
{
|
|
3893
|
-
"data-testid": "menu-overflow-wrapper",
|
|
3894
|
-
className: `relative w-full overflow-hidden ${className ?? ""}`,
|
|
3895
|
-
children: [
|
|
3896
|
-
showLeftArrow && /* @__PURE__ */ jsxs20(
|
|
3897
|
-
"button",
|
|
3898
|
-
{
|
|
3899
|
-
onClick: () => internalScroll(containerRef.current, "left"),
|
|
3900
|
-
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",
|
|
3901
|
-
"data-testid": "scroll-left-button",
|
|
3902
|
-
children: [
|
|
3903
|
-
/* @__PURE__ */ jsx25(CaretLeft, { size: 16 }),
|
|
3904
|
-
/* @__PURE__ */ jsx25("span", { className: "sr-only", children: "Scroll left" })
|
|
3905
|
-
]
|
|
3906
|
-
}
|
|
3907
|
-
),
|
|
3908
|
-
/* @__PURE__ */ jsx25(
|
|
3909
|
-
Menu,
|
|
3910
|
-
{
|
|
3911
|
-
defaultValue,
|
|
3912
|
-
onValueChange,
|
|
3913
|
-
value,
|
|
3914
|
-
variant: "menu2",
|
|
3915
|
-
...props,
|
|
3916
|
-
children: /* @__PURE__ */ jsx25(MenuContent, { ref: containerRef, variant: "menu2", children })
|
|
3917
|
-
}
|
|
3918
|
-
),
|
|
3919
|
-
showRightArrow && /* @__PURE__ */ jsxs20(
|
|
3920
|
-
"button",
|
|
3921
|
-
{
|
|
3922
|
-
onClick: () => internalScroll(containerRef.current, "right"),
|
|
3923
|
-
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",
|
|
3924
|
-
"data-testid": "scroll-right-button",
|
|
3925
|
-
children: [
|
|
3926
|
-
/* @__PURE__ */ jsx25(CaretRight, { size: 16 }),
|
|
3927
|
-
/* @__PURE__ */ jsx25("span", { className: "sr-only", children: "Scroll right" })
|
|
3928
|
-
]
|
|
3929
|
-
}
|
|
3930
|
-
)
|
|
3931
|
-
]
|
|
3932
|
-
}
|
|
3933
|
-
);
|
|
3934
|
-
};
|
|
3935
|
-
var injectStore3 = (children, store) => Children3.map(children, (child) => {
|
|
3936
|
-
if (!isValidElement3(child)) return child;
|
|
3937
|
-
const typedChild = child;
|
|
3938
|
-
const shouldInject = typedChild.type === MenuItem;
|
|
3939
|
-
return cloneElement3(typedChild, {
|
|
3940
|
-
...shouldInject ? { store } : {},
|
|
3941
|
-
...typedChild.props.children ? { children: injectStore3(typedChild.props.children, store) } : {}
|
|
3942
|
-
});
|
|
3943
|
-
});
|
|
3944
|
-
var Menu_default = Menu;
|
|
4039
|
+
}
|
|
4040
|
+
);
|
|
3945
4041
|
|
|
3946
|
-
// src/components/
|
|
3947
|
-
import {
|
|
3948
|
-
|
|
3949
|
-
|
|
3950
|
-
useState as useState8,
|
|
3951
|
-
useRef as useRef5
|
|
3952
|
-
} from "react";
|
|
3953
|
-
import {
|
|
3954
|
-
CaretRight as CaretRight2,
|
|
3955
|
-
ChatCircleText,
|
|
3956
|
-
CheckCircle as CheckCircle3,
|
|
3957
|
-
Clock,
|
|
3958
|
-
DotsThreeVertical,
|
|
3959
|
-
Play,
|
|
3960
|
-
SpeakerHigh,
|
|
3961
|
-
SpeakerLow,
|
|
3962
|
-
SpeakerSimpleX,
|
|
3963
|
-
XCircle as XCircle2
|
|
3964
|
-
} from "phosphor-react";
|
|
3965
|
-
import { Fragment as Fragment5, jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3966
|
-
var CARD_BASE_CLASSES = {
|
|
3967
|
-
default: "w-full bg-background border border-border-50 rounded-xl",
|
|
3968
|
-
compact: "w-full bg-background border border-border-50 rounded-lg",
|
|
3969
|
-
minimal: "w-full bg-background border border-border-100 rounded-md"
|
|
3970
|
-
};
|
|
3971
|
-
var CARD_PADDING_CLASSES = {
|
|
3972
|
-
none: "",
|
|
3973
|
-
small: "p-2",
|
|
3974
|
-
medium: "p-4",
|
|
3975
|
-
large: "p-6"
|
|
3976
|
-
};
|
|
3977
|
-
var CARD_MIN_HEIGHT_CLASSES = {
|
|
3978
|
-
none: "",
|
|
3979
|
-
small: "min-h-16",
|
|
3980
|
-
medium: "min-h-20",
|
|
3981
|
-
large: "min-h-24"
|
|
3982
|
-
};
|
|
3983
|
-
var CARD_LAYOUT_CLASSES = {
|
|
3984
|
-
horizontal: "flex flex-row",
|
|
3985
|
-
vertical: "flex flex-col"
|
|
3986
|
-
};
|
|
3987
|
-
var CARD_CURSOR_CLASSES = {
|
|
3988
|
-
default: "",
|
|
3989
|
-
pointer: "cursor-pointer"
|
|
3990
|
-
};
|
|
3991
|
-
var CardBase = forwardRef12(
|
|
4042
|
+
// src/components/Accordation/Accordation.tsx
|
|
4043
|
+
import { CaretRight as CaretRight2 } from "phosphor-react";
|
|
4044
|
+
import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
4045
|
+
var CardAccordation = forwardRef10(
|
|
3992
4046
|
({
|
|
4047
|
+
title,
|
|
3993
4048
|
children,
|
|
3994
|
-
|
|
3995
|
-
|
|
3996
|
-
|
|
3997
|
-
minHeight = "medium",
|
|
3998
|
-
cursor = "default",
|
|
3999
|
-
className = "",
|
|
4049
|
+
className,
|
|
4050
|
+
defaultExpanded = false,
|
|
4051
|
+
onToggleExpanded,
|
|
4000
4052
|
...props
|
|
4001
4053
|
}, ref) => {
|
|
4002
|
-
const
|
|
4003
|
-
const
|
|
4004
|
-
const
|
|
4005
|
-
|
|
4006
|
-
|
|
4007
|
-
|
|
4008
|
-
|
|
4009
|
-
|
|
4010
|
-
|
|
4011
|
-
|
|
4012
|
-
|
|
4013
|
-
|
|
4014
|
-
|
|
4015
|
-
|
|
4054
|
+
const [isExpanded, setIsExpanded] = useState7(defaultExpanded);
|
|
4055
|
+
const contentId = useId5();
|
|
4056
|
+
const handleToggle = () => {
|
|
4057
|
+
const newExpanded = !isExpanded;
|
|
4058
|
+
setIsExpanded(newExpanded);
|
|
4059
|
+
onToggleExpanded?.(newExpanded);
|
|
4060
|
+
};
|
|
4061
|
+
return /* @__PURE__ */ jsxs19(
|
|
4062
|
+
CardBase,
|
|
4063
|
+
{
|
|
4064
|
+
ref,
|
|
4065
|
+
layout: "vertical",
|
|
4066
|
+
padding: "none",
|
|
4067
|
+
minHeight: "none",
|
|
4068
|
+
className: `overflow-hidden ${className}`,
|
|
4069
|
+
...props,
|
|
4070
|
+
children: [
|
|
4071
|
+
/* @__PURE__ */ jsxs19(
|
|
4072
|
+
"button",
|
|
4073
|
+
{
|
|
4074
|
+
onClick: handleToggle,
|
|
4075
|
+
className: "w-full cursor-pointer p-4 flex items-center justify-between gap-3 text-left transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-inset",
|
|
4076
|
+
"aria-expanded": isExpanded,
|
|
4077
|
+
"aria-controls": "accordion-content",
|
|
4078
|
+
children: [
|
|
4079
|
+
/* @__PURE__ */ jsx24(
|
|
4080
|
+
Text_default,
|
|
4081
|
+
{
|
|
4082
|
+
size: "sm",
|
|
4083
|
+
weight: "bold",
|
|
4084
|
+
className: "text-text-950 truncate flex-1",
|
|
4085
|
+
children: title
|
|
4086
|
+
}
|
|
4087
|
+
),
|
|
4088
|
+
/* @__PURE__ */ jsx24(
|
|
4089
|
+
CaretRight2,
|
|
4090
|
+
{
|
|
4091
|
+
size: 20,
|
|
4092
|
+
className: `text-text-700 transition-transform duration-200 flex-shrink-0 ${isExpanded ? "rotate-90" : "rotate-0"}`,
|
|
4093
|
+
"data-testid": "accordion-caret"
|
|
4094
|
+
}
|
|
4095
|
+
)
|
|
4096
|
+
]
|
|
4097
|
+
}
|
|
4098
|
+
),
|
|
4099
|
+
/* @__PURE__ */ jsx24(
|
|
4100
|
+
"div",
|
|
4101
|
+
{
|
|
4102
|
+
id: contentId,
|
|
4103
|
+
className: `transition-all duration-300 ease-in-out overflow-hidden ${isExpanded ? "max-h-screen opacity-100" : "max-h-0 opacity-0"}`,
|
|
4104
|
+
"data-testid": "accordion-content",
|
|
4105
|
+
children: /* @__PURE__ */ jsx24("div", { className: "p-4 pt-0 border-border-50", children })
|
|
4106
|
+
}
|
|
4107
|
+
)
|
|
4108
|
+
]
|
|
4109
|
+
}
|
|
4110
|
+
);
|
|
4111
|
+
}
|
|
4112
|
+
);
|
|
4113
|
+
|
|
4114
|
+
// src/components/Alternative/Alternative.tsx
|
|
4115
|
+
import { CheckCircle as CheckCircle4, XCircle as XCircle3 } from "phosphor-react";
|
|
4116
|
+
import { forwardRef as forwardRef11, useId as useId6 } from "react";
|
|
4117
|
+
import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
4118
|
+
var AlternativesList = ({
|
|
4119
|
+
alternatives,
|
|
4120
|
+
name,
|
|
4121
|
+
defaultValue,
|
|
4122
|
+
value,
|
|
4123
|
+
onValueChange,
|
|
4124
|
+
disabled = false,
|
|
4125
|
+
layout = "default",
|
|
4126
|
+
className = "",
|
|
4127
|
+
mode = "interactive",
|
|
4128
|
+
selectedValue
|
|
4129
|
+
}) => {
|
|
4130
|
+
const uniqueId = useId6();
|
|
4131
|
+
const groupName = name || `alternatives-${uniqueId}`;
|
|
4132
|
+
const isReadonly = mode === "readonly";
|
|
4133
|
+
const getStatusStyles = (status, isReadonly2) => {
|
|
4134
|
+
const hoverClass = isReadonly2 ? "" : "hover:bg-background-50";
|
|
4135
|
+
switch (status) {
|
|
4136
|
+
case "correct":
|
|
4137
|
+
return "bg-success-background border-success-300";
|
|
4138
|
+
case "incorrect":
|
|
4139
|
+
return "bg-error-background border-error-300";
|
|
4140
|
+
default:
|
|
4141
|
+
return `bg-background border-border-100 ${hoverClass}`;
|
|
4142
|
+
}
|
|
4143
|
+
};
|
|
4144
|
+
const getStatusBadge = (status) => {
|
|
4145
|
+
switch (status) {
|
|
4146
|
+
case "correct":
|
|
4147
|
+
return /* @__PURE__ */ jsx25(Badge_default, { variant: "solid", action: "success", iconLeft: /* @__PURE__ */ jsx25(CheckCircle4, {}), children: "Resposta correta" });
|
|
4148
|
+
case "incorrect":
|
|
4149
|
+
return /* @__PURE__ */ jsx25(Badge_default, { variant: "solid", action: "error", iconLeft: /* @__PURE__ */ jsx25(XCircle3, {}), children: "Resposta incorreta" });
|
|
4150
|
+
default:
|
|
4151
|
+
return null;
|
|
4152
|
+
}
|
|
4153
|
+
};
|
|
4154
|
+
const getLayoutClasses = () => {
|
|
4155
|
+
switch (layout) {
|
|
4156
|
+
case "compact":
|
|
4157
|
+
return "gap-2";
|
|
4158
|
+
case "detailed":
|
|
4159
|
+
return "gap-4";
|
|
4160
|
+
default:
|
|
4161
|
+
return "gap-3.5";
|
|
4162
|
+
}
|
|
4163
|
+
};
|
|
4164
|
+
const renderReadonlyAlternative = (alternative) => {
|
|
4165
|
+
const alternativeId = alternative.value;
|
|
4166
|
+
const isUserSelected = selectedValue === alternative.value;
|
|
4167
|
+
const isCorrectAnswer = alternative.status === "correct";
|
|
4168
|
+
let displayStatus = void 0;
|
|
4169
|
+
if (isUserSelected && !isCorrectAnswer) {
|
|
4170
|
+
displayStatus = "incorrect";
|
|
4171
|
+
} else if (isCorrectAnswer) {
|
|
4172
|
+
displayStatus = "correct";
|
|
4173
|
+
}
|
|
4174
|
+
const statusStyles = getStatusStyles(displayStatus, true);
|
|
4175
|
+
const statusBadge = getStatusBadge(displayStatus);
|
|
4176
|
+
const renderRadio = () => {
|
|
4177
|
+
const radioClasses = `w-6 h-6 rounded-full border-2 cursor-default transition-all duration-200 flex items-center justify-center ${isUserSelected ? "border-primary-950 bg-background" : "border-border-400 bg-background"}`;
|
|
4178
|
+
const dotClasses = "w-3 h-3 rounded-full bg-primary-950 transition-all duration-200";
|
|
4179
|
+
return /* @__PURE__ */ jsx25("div", { className: radioClasses, children: isUserSelected && /* @__PURE__ */ jsx25("div", { className: dotClasses }) });
|
|
4180
|
+
};
|
|
4181
|
+
if (layout === "detailed") {
|
|
4182
|
+
return /* @__PURE__ */ jsx25(
|
|
4183
|
+
"div",
|
|
4184
|
+
{
|
|
4185
|
+
className: `border-2 rounded-lg p-4 w-full ${statusStyles} ${alternative.disabled ? "opacity-50" : ""}`,
|
|
4186
|
+
children: /* @__PURE__ */ jsxs20("div", { className: "flex items-start justify-between gap-3", children: [
|
|
4187
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-start gap-3 flex-1", children: [
|
|
4188
|
+
/* @__PURE__ */ jsx25("div", { className: "mt-1", children: renderRadio() }),
|
|
4189
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1", children: [
|
|
4190
|
+
/* @__PURE__ */ jsx25("p", { className: "block font-medium text-text-950", children: alternative.label }),
|
|
4191
|
+
alternative.description && /* @__PURE__ */ jsx25("p", { className: "text-sm text-text-600 mt-1", children: alternative.description })
|
|
4192
|
+
] })
|
|
4193
|
+
] }),
|
|
4194
|
+
statusBadge && /* @__PURE__ */ jsx25("div", { className: "flex-shrink-0", children: statusBadge })
|
|
4195
|
+
] })
|
|
4196
|
+
},
|
|
4197
|
+
alternativeId
|
|
4198
|
+
);
|
|
4199
|
+
}
|
|
4200
|
+
return /* @__PURE__ */ jsxs20(
|
|
4201
|
+
"div",
|
|
4202
|
+
{
|
|
4203
|
+
className: `flex flex-row justify-between items-start gap-2 p-2 rounded-lg w-full ${statusStyles} ${alternative.disabled ? "opacity-50" : ""}`,
|
|
4204
|
+
children: [
|
|
4205
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 flex-1", children: [
|
|
4206
|
+
renderRadio(),
|
|
4207
|
+
/* @__PURE__ */ jsx25("span", { className: "flex-1", children: alternative.label })
|
|
4208
|
+
] }),
|
|
4209
|
+
statusBadge && /* @__PURE__ */ jsx25("div", { className: "flex-shrink-0", children: statusBadge })
|
|
4210
|
+
]
|
|
4211
|
+
},
|
|
4212
|
+
alternativeId
|
|
4213
|
+
);
|
|
4214
|
+
};
|
|
4215
|
+
if (isReadonly) {
|
|
4216
|
+
return /* @__PURE__ */ jsx25(
|
|
4217
|
+
"div",
|
|
4218
|
+
{
|
|
4219
|
+
className: `flex flex-col ${getLayoutClasses()} w-full ${className}`,
|
|
4220
|
+
children: alternatives.map(
|
|
4221
|
+
(alternative) => renderReadonlyAlternative(alternative)
|
|
4222
|
+
)
|
|
4223
|
+
}
|
|
4224
|
+
);
|
|
4225
|
+
}
|
|
4226
|
+
return /* @__PURE__ */ jsx25(
|
|
4227
|
+
RadioGroup,
|
|
4228
|
+
{
|
|
4229
|
+
name: groupName,
|
|
4230
|
+
defaultValue,
|
|
4231
|
+
value,
|
|
4232
|
+
onValueChange,
|
|
4233
|
+
disabled,
|
|
4234
|
+
className: `flex flex-col ${getLayoutClasses()} ${className}`,
|
|
4235
|
+
children: alternatives.map((alternative, index) => {
|
|
4236
|
+
const alternativeId = alternative.value || `alt-${index}`;
|
|
4237
|
+
const statusStyles = getStatusStyles(alternative.status, false);
|
|
4238
|
+
const statusBadge = getStatusBadge(alternative.status);
|
|
4239
|
+
if (layout === "detailed") {
|
|
4240
|
+
return /* @__PURE__ */ jsx25(
|
|
4241
|
+
"div",
|
|
4242
|
+
{
|
|
4243
|
+
className: `border-2 rounded-lg p-4 transition-all ${statusStyles} ${alternative.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"}`,
|
|
4244
|
+
children: /* @__PURE__ */ jsxs20("div", { className: "flex items-start justify-between gap-3", children: [
|
|
4245
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-start gap-3 flex-1", children: [
|
|
4246
|
+
/* @__PURE__ */ jsx25(
|
|
4247
|
+
RadioGroupItem,
|
|
4248
|
+
{
|
|
4249
|
+
value: alternative.value,
|
|
4250
|
+
id: alternativeId,
|
|
4251
|
+
disabled: alternative.disabled,
|
|
4252
|
+
className: "mt-1"
|
|
4253
|
+
}
|
|
4254
|
+
),
|
|
4255
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1", children: [
|
|
4256
|
+
/* @__PURE__ */ jsx25(
|
|
4257
|
+
"label",
|
|
4258
|
+
{
|
|
4259
|
+
htmlFor: alternativeId,
|
|
4260
|
+
className: `block font-medium text-text-950 ${alternative.disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
|
|
4261
|
+
children: alternative.label
|
|
4262
|
+
}
|
|
4263
|
+
),
|
|
4264
|
+
alternative.description && /* @__PURE__ */ jsx25("p", { className: "text-sm text-text-600 mt-1", children: alternative.description })
|
|
4265
|
+
] })
|
|
4266
|
+
] }),
|
|
4267
|
+
statusBadge && /* @__PURE__ */ jsx25("div", { className: "flex-shrink-0", children: statusBadge })
|
|
4268
|
+
] })
|
|
4269
|
+
},
|
|
4270
|
+
alternativeId
|
|
4271
|
+
);
|
|
4272
|
+
}
|
|
4273
|
+
return /* @__PURE__ */ jsxs20(
|
|
4274
|
+
"div",
|
|
4275
|
+
{
|
|
4276
|
+
className: `flex flex-row justify-between gap-2 items-start p-2 rounded-lg transition-all ${statusStyles} ${alternative.disabled ? "opacity-50 cursor-not-allowed" : ""}`,
|
|
4277
|
+
children: [
|
|
4278
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 flex-1", children: [
|
|
4279
|
+
/* @__PURE__ */ jsx25(
|
|
4280
|
+
RadioGroupItem,
|
|
4281
|
+
{
|
|
4282
|
+
value: alternative.value,
|
|
4283
|
+
id: alternativeId,
|
|
4284
|
+
disabled: alternative.disabled
|
|
4285
|
+
}
|
|
4286
|
+
),
|
|
4287
|
+
/* @__PURE__ */ jsx25(
|
|
4288
|
+
"label",
|
|
4289
|
+
{
|
|
4290
|
+
htmlFor: alternativeId,
|
|
4291
|
+
className: `flex-1 ${alternative.disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
|
|
4292
|
+
children: alternative.label
|
|
4293
|
+
}
|
|
4294
|
+
)
|
|
4295
|
+
] }),
|
|
4296
|
+
statusBadge && /* @__PURE__ */ jsx25("div", { className: "flex-shrink-0", children: statusBadge })
|
|
4297
|
+
]
|
|
4298
|
+
},
|
|
4299
|
+
alternativeId
|
|
4300
|
+
);
|
|
4301
|
+
})
|
|
4302
|
+
}
|
|
4303
|
+
);
|
|
4304
|
+
};
|
|
4305
|
+
var HeaderAlternative = forwardRef11(
|
|
4306
|
+
({ className, title, subTitle, content, ...props }, ref) => {
|
|
4307
|
+
return /* @__PURE__ */ jsxs20(
|
|
4308
|
+
"div",
|
|
4309
|
+
{
|
|
4310
|
+
ref,
|
|
4311
|
+
className: `bg-background p-4 flex flex-col gap-4 rounded-xl ${className}`,
|
|
4312
|
+
...props,
|
|
4313
|
+
children: [
|
|
4314
|
+
/* @__PURE__ */ jsxs20("span", { className: "flex flex-col", children: [
|
|
4315
|
+
/* @__PURE__ */ jsx25("p", { className: "text-text-950 font-bold text-lg", children: title }),
|
|
4316
|
+
/* @__PURE__ */ jsx25("p", { className: "text-text-700 text-sm ", children: subTitle })
|
|
4317
|
+
] }),
|
|
4318
|
+
/* @__PURE__ */ jsx25("p", { className: "text-text-950 text-md", children: content })
|
|
4319
|
+
]
|
|
4320
|
+
}
|
|
4321
|
+
);
|
|
4016
4322
|
}
|
|
4017
4323
|
);
|
|
4018
|
-
|
|
4019
|
-
|
|
4020
|
-
|
|
4021
|
-
|
|
4022
|
-
|
|
4023
|
-
|
|
4024
|
-
|
|
4025
|
-
|
|
4026
|
-
|
|
4027
|
-
|
|
4028
|
-
|
|
4029
|
-
|
|
4030
|
-
|
|
4031
|
-
|
|
4032
|
-
success: "text-success-700",
|
|
4033
|
-
error: "text-error-700",
|
|
4034
|
-
info: "text-info-700"
|
|
4035
|
-
};
|
|
4036
|
-
var ACTION_HEADER_CLASSES = {
|
|
4037
|
-
warning: "text-warning-300",
|
|
4038
|
-
success: "text-success-300",
|
|
4039
|
-
error: "text-error-300",
|
|
4040
|
-
info: "text-info-300"
|
|
4324
|
+
|
|
4325
|
+
// src/components/AlertDialog/AlertDialog.tsx
|
|
4326
|
+
import {
|
|
4327
|
+
forwardRef as forwardRef12,
|
|
4328
|
+
useState as useState8,
|
|
4329
|
+
useEffect as useEffect4
|
|
4330
|
+
} from "react";
|
|
4331
|
+
import { Fragment as Fragment5, jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
4332
|
+
var SIZE_CLASSES11 = {
|
|
4333
|
+
"extra-small": "w-screen max-w-[324px]",
|
|
4334
|
+
small: "w-screen max-w-[378px]",
|
|
4335
|
+
medium: "w-screen max-w-[459px]",
|
|
4336
|
+
large: "w-screen max-w-[578px]",
|
|
4337
|
+
"extra-large": "w-screen max-w-[912px]"
|
|
4041
4338
|
};
|
|
4042
|
-
var
|
|
4339
|
+
var AlertDialog = forwardRef12(
|
|
4043
4340
|
({
|
|
4044
|
-
|
|
4045
|
-
title,
|
|
4046
|
-
subTitle,
|
|
4047
|
-
header,
|
|
4048
|
-
extended = false,
|
|
4049
|
-
action = "success",
|
|
4341
|
+
trigger,
|
|
4050
4342
|
description,
|
|
4051
|
-
|
|
4343
|
+
cancelButtonLabel = "Cancelar",
|
|
4344
|
+
submitButtonLabel = "Deletar",
|
|
4345
|
+
title,
|
|
4346
|
+
isOpen: controlledIsOpen,
|
|
4347
|
+
onOpen,
|
|
4348
|
+
onClose,
|
|
4349
|
+
closeOnBackdropClick = true,
|
|
4350
|
+
closeOnEscape = true,
|
|
4351
|
+
className = "",
|
|
4352
|
+
onSubmit,
|
|
4353
|
+
submitValue,
|
|
4354
|
+
onCancel,
|
|
4355
|
+
cancelValue,
|
|
4356
|
+
size = "medium",
|
|
4052
4357
|
...props
|
|
4053
4358
|
}, ref) => {
|
|
4054
|
-
const
|
|
4055
|
-
const
|
|
4056
|
-
const
|
|
4057
|
-
|
|
4058
|
-
|
|
4059
|
-
|
|
4060
|
-
|
|
4061
|
-
|
|
4062
|
-
|
|
4063
|
-
|
|
4064
|
-
|
|
4065
|
-
|
|
4359
|
+
const [internalIsOpen, setInternalIsOpen] = useState8(false);
|
|
4360
|
+
const isOpen = controlledIsOpen ?? internalIsOpen;
|
|
4361
|
+
const setIsOpen = (open) => {
|
|
4362
|
+
if (controlledIsOpen === void 0) {
|
|
4363
|
+
setInternalIsOpen(open);
|
|
4364
|
+
}
|
|
4365
|
+
if (open && onOpen) onOpen();
|
|
4366
|
+
if (!open && onClose) onClose();
|
|
4367
|
+
};
|
|
4368
|
+
useEffect4(() => {
|
|
4369
|
+
if (!isOpen || !closeOnEscape) return;
|
|
4370
|
+
const handleEscape = (event) => {
|
|
4371
|
+
if (event.key === "Escape") {
|
|
4372
|
+
setIsOpen(false);
|
|
4373
|
+
}
|
|
4374
|
+
};
|
|
4375
|
+
document.addEventListener("keydown", handleEscape);
|
|
4376
|
+
return () => document.removeEventListener("keydown", handleEscape);
|
|
4377
|
+
}, [isOpen, closeOnEscape]);
|
|
4378
|
+
useEffect4(() => {
|
|
4379
|
+
if (isOpen) {
|
|
4380
|
+
document.body.style.overflow = "hidden";
|
|
4381
|
+
} else {
|
|
4382
|
+
document.body.style.overflow = "unset";
|
|
4383
|
+
}
|
|
4384
|
+
return () => {
|
|
4385
|
+
document.body.style.overflow = "unset";
|
|
4386
|
+
};
|
|
4387
|
+
}, [isOpen]);
|
|
4388
|
+
const handleBackdropClick = (event) => {
|
|
4389
|
+
if (event.target === event.currentTarget && closeOnBackdropClick) {
|
|
4390
|
+
setIsOpen(false);
|
|
4391
|
+
}
|
|
4392
|
+
};
|
|
4393
|
+
const handleBackdropKeyDown = (event) => {
|
|
4394
|
+
if (event.key === "Escape" && closeOnEscape) {
|
|
4395
|
+
setIsOpen(false);
|
|
4396
|
+
}
|
|
4397
|
+
};
|
|
4398
|
+
const handleTriggerClick = () => {
|
|
4399
|
+
setIsOpen(true);
|
|
4400
|
+
};
|
|
4401
|
+
const handleSubmit = () => {
|
|
4402
|
+
setIsOpen(false);
|
|
4403
|
+
onSubmit?.(submitValue);
|
|
4404
|
+
};
|
|
4405
|
+
const handleCancel = () => {
|
|
4406
|
+
setIsOpen(false);
|
|
4407
|
+
onCancel?.(cancelValue);
|
|
4408
|
+
};
|
|
4409
|
+
const sizeClasses = SIZE_CLASSES11[size];
|
|
4410
|
+
return /* @__PURE__ */ jsxs21(Fragment5, { children: [
|
|
4411
|
+
/* @__PURE__ */ jsx26(
|
|
4412
|
+
"button",
|
|
4413
|
+
{
|
|
4414
|
+
onClick: handleTriggerClick,
|
|
4415
|
+
"aria-label": "Open dialog",
|
|
4416
|
+
type: "button",
|
|
4417
|
+
className: "border-none bg-transparent p-0 cursor-pointer",
|
|
4418
|
+
children: trigger
|
|
4419
|
+
}
|
|
4420
|
+
),
|
|
4421
|
+
isOpen && /* @__PURE__ */ jsx26(
|
|
4422
|
+
"div",
|
|
4423
|
+
{
|
|
4424
|
+
className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",
|
|
4425
|
+
onClick: handleBackdropClick,
|
|
4426
|
+
onKeyDown: handleBackdropKeyDown,
|
|
4427
|
+
"data-testid": "alert-dialog-overlay",
|
|
4428
|
+
children: /* @__PURE__ */ jsxs21(
|
|
4066
4429
|
"div",
|
|
4067
4430
|
{
|
|
4068
|
-
|
|
4069
|
-
|
|
4070
|
-
|
|
4071
|
-
${extended ? "rounded-t-xl" : "rounded-xl"}`,
|
|
4431
|
+
ref,
|
|
4432
|
+
className: `bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`,
|
|
4433
|
+
...props,
|
|
4072
4434
|
children: [
|
|
4073
4435
|
/* @__PURE__ */ jsx26(
|
|
4074
|
-
"
|
|
4436
|
+
"h2",
|
|
4075
4437
|
{
|
|
4076
|
-
|
|
4077
|
-
|
|
4438
|
+
id: "alert-dialog-title",
|
|
4439
|
+
className: "pb-3 text-xl font-semibold",
|
|
4440
|
+
children: title
|
|
4078
4441
|
}
|
|
4079
4442
|
),
|
|
4080
4443
|
/* @__PURE__ */ jsx26(
|
|
4081
|
-
|
|
4444
|
+
"p",
|
|
4082
4445
|
{
|
|
4083
|
-
|
|
4084
|
-
|
|
4085
|
-
|
|
4086
|
-
children: title
|
|
4446
|
+
id: "alert-dialog-description",
|
|
4447
|
+
className: "text-text-700 text-sm",
|
|
4448
|
+
children: description
|
|
4087
4449
|
}
|
|
4088
4450
|
),
|
|
4089
|
-
/* @__PURE__ */
|
|
4451
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-row items-center justify-end pt-4 gap-3", children: [
|
|
4452
|
+
/* @__PURE__ */ jsx26(Button_default, { variant: "outline", size: "small", onClick: handleCancel, children: cancelButtonLabel }),
|
|
4453
|
+
/* @__PURE__ */ jsx26(
|
|
4454
|
+
Button_default,
|
|
4455
|
+
{
|
|
4456
|
+
variant: "solid",
|
|
4457
|
+
size: "small",
|
|
4458
|
+
action: "negative",
|
|
4459
|
+
onClick: handleSubmit,
|
|
4460
|
+
children: submitButtonLabel
|
|
4461
|
+
}
|
|
4462
|
+
)
|
|
4463
|
+
] })
|
|
4090
4464
|
]
|
|
4091
4465
|
}
|
|
4092
|
-
)
|
|
4093
|
-
|
|
4094
|
-
|
|
4095
|
-
|
|
4096
|
-
{
|
|
4097
|
-
className: `text-2xs font-medium uppercase truncate ${actionHeaderClasses}`,
|
|
4098
|
-
children: header
|
|
4099
|
-
}
|
|
4100
|
-
),
|
|
4101
|
-
/* @__PURE__ */ jsx26(Badge_default, { size: "large", action: "info", children: description })
|
|
4102
|
-
] })
|
|
4103
|
-
]
|
|
4104
|
-
}
|
|
4105
|
-
);
|
|
4466
|
+
)
|
|
4467
|
+
}
|
|
4468
|
+
)
|
|
4469
|
+
] });
|
|
4106
4470
|
}
|
|
4107
4471
|
);
|
|
4108
|
-
|
|
4472
|
+
AlertDialog.displayName = "AlertDialog";
|
|
4473
|
+
|
|
4474
|
+
// src/components/DropdownMenu/DropdownMenu.tsx
|
|
4475
|
+
import { SignOut, User } from "phosphor-react";
|
|
4476
|
+
import {
|
|
4477
|
+
forwardRef as forwardRef13,
|
|
4478
|
+
useEffect as useEffect5,
|
|
4479
|
+
useRef as useRef4,
|
|
4480
|
+
isValidElement as isValidElement2,
|
|
4481
|
+
Children as Children2,
|
|
4482
|
+
cloneElement as cloneElement2,
|
|
4483
|
+
useState as useState9
|
|
4484
|
+
} from "react";
|
|
4485
|
+
import { create as create3, useStore as useStore2 } from "zustand";
|
|
4486
|
+
import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
4487
|
+
function createDropdownStore() {
|
|
4488
|
+
return create3((set) => ({
|
|
4489
|
+
open: false,
|
|
4490
|
+
setOpen: (open) => set({ open })
|
|
4491
|
+
}));
|
|
4492
|
+
}
|
|
4493
|
+
var useDropdownStore = (externalStore) => {
|
|
4494
|
+
if (!externalStore) {
|
|
4495
|
+
throw new Error(
|
|
4496
|
+
"Component must be used within a DropdownMenu (store is missing)"
|
|
4497
|
+
);
|
|
4498
|
+
}
|
|
4499
|
+
return externalStore;
|
|
4500
|
+
};
|
|
4501
|
+
var injectStore2 = (children, store) => {
|
|
4502
|
+
return Children2.map(children, (child) => {
|
|
4503
|
+
if (isValidElement2(child)) {
|
|
4504
|
+
const typedChild = child;
|
|
4505
|
+
const newProps = {
|
|
4506
|
+
store
|
|
4507
|
+
};
|
|
4508
|
+
if (typedChild.props.children) {
|
|
4509
|
+
newProps.children = injectStore2(typedChild.props.children, store);
|
|
4510
|
+
}
|
|
4511
|
+
return cloneElement2(typedChild, newProps);
|
|
4512
|
+
}
|
|
4513
|
+
return child;
|
|
4514
|
+
});
|
|
4515
|
+
};
|
|
4516
|
+
var DropdownMenu = ({
|
|
4517
|
+
children,
|
|
4518
|
+
open: propOpen,
|
|
4519
|
+
onOpenChange
|
|
4520
|
+
}) => {
|
|
4521
|
+
const storeRef = useRef4(null);
|
|
4522
|
+
storeRef.current ??= createDropdownStore();
|
|
4523
|
+
const store = storeRef.current;
|
|
4524
|
+
const { open, setOpen: storeSetOpen } = useStore2(store, (s) => s);
|
|
4525
|
+
const setOpen = (newOpen) => {
|
|
4526
|
+
storeSetOpen(newOpen);
|
|
4527
|
+
};
|
|
4528
|
+
const menuRef = useRef4(null);
|
|
4529
|
+
const handleArrowDownOrArrowUp = (event) => {
|
|
4530
|
+
const menuContent = menuRef.current?.querySelector('[role="menu"]');
|
|
4531
|
+
if (menuContent) {
|
|
4532
|
+
event.preventDefault();
|
|
4533
|
+
const items = Array.from(
|
|
4534
|
+
menuContent.querySelectorAll(
|
|
4535
|
+
'[role="menuitem"]:not([aria-disabled="true"])'
|
|
4536
|
+
)
|
|
4537
|
+
).filter((el) => el instanceof HTMLElement);
|
|
4538
|
+
if (items.length === 0) return;
|
|
4539
|
+
const focusedItem = document.activeElement;
|
|
4540
|
+
const currentIndex = items.findIndex((item) => item === focusedItem);
|
|
4541
|
+
let nextIndex;
|
|
4542
|
+
if (event.key === "ArrowDown") {
|
|
4543
|
+
nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % items.length;
|
|
4544
|
+
} else {
|
|
4545
|
+
nextIndex = currentIndex === -1 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length;
|
|
4546
|
+
}
|
|
4547
|
+
items[nextIndex]?.focus();
|
|
4548
|
+
}
|
|
4549
|
+
};
|
|
4550
|
+
const handleDownkey = (event) => {
|
|
4551
|
+
if (event.key === "Escape") {
|
|
4552
|
+
setOpen(false);
|
|
4553
|
+
} else if (event.key === "ArrowDown" || event.key === "ArrowUp") {
|
|
4554
|
+
handleArrowDownOrArrowUp(event);
|
|
4555
|
+
}
|
|
4556
|
+
};
|
|
4557
|
+
const handleClickOutside = (event) => {
|
|
4558
|
+
if (menuRef.current && !menuRef.current.contains(event.target)) {
|
|
4559
|
+
setOpen(false);
|
|
4560
|
+
}
|
|
4561
|
+
};
|
|
4562
|
+
useEffect5(() => {
|
|
4563
|
+
if (open) {
|
|
4564
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
4565
|
+
document.addEventListener("keydown", handleDownkey);
|
|
4566
|
+
}
|
|
4567
|
+
return () => {
|
|
4568
|
+
document.removeEventListener("mousedown", handleClickOutside);
|
|
4569
|
+
document.removeEventListener("keydown", handleDownkey);
|
|
4570
|
+
};
|
|
4571
|
+
}, [open]);
|
|
4572
|
+
useEffect5(() => {
|
|
4573
|
+
setOpen(open);
|
|
4574
|
+
onOpenChange?.(open);
|
|
4575
|
+
}, [open, onOpenChange]);
|
|
4576
|
+
useEffect5(() => {
|
|
4577
|
+
if (propOpen) {
|
|
4578
|
+
setOpen(propOpen);
|
|
4579
|
+
}
|
|
4580
|
+
}, [propOpen]);
|
|
4581
|
+
return /* @__PURE__ */ jsx27("div", { className: "relative", ref: menuRef, children: injectStore2(children, store) });
|
|
4582
|
+
};
|
|
4583
|
+
var DropdownMenuTrigger = ({
|
|
4584
|
+
className,
|
|
4585
|
+
children,
|
|
4586
|
+
onClick,
|
|
4587
|
+
store: externalStore,
|
|
4588
|
+
...props
|
|
4589
|
+
}) => {
|
|
4590
|
+
const store = useDropdownStore(externalStore);
|
|
4591
|
+
const open = useStore2(store, (s) => s.open);
|
|
4592
|
+
const toggleOpen = () => store.setState({ open: !open });
|
|
4593
|
+
return /* @__PURE__ */ jsx27(
|
|
4594
|
+
"button",
|
|
4595
|
+
{
|
|
4596
|
+
onClick: (e) => {
|
|
4597
|
+
e.stopPropagation();
|
|
4598
|
+
toggleOpen();
|
|
4599
|
+
if (onClick) onClick(e);
|
|
4600
|
+
},
|
|
4601
|
+
"aria-expanded": open,
|
|
4602
|
+
className: `${className}`,
|
|
4603
|
+
...props,
|
|
4604
|
+
children
|
|
4605
|
+
}
|
|
4606
|
+
);
|
|
4607
|
+
};
|
|
4608
|
+
DropdownMenuTrigger.displayName = "DropdownMenuTrigger";
|
|
4609
|
+
var ITEM_SIZE_CLASSES = {
|
|
4610
|
+
small: "text-sm",
|
|
4611
|
+
medium: "text-md"
|
|
4612
|
+
};
|
|
4613
|
+
var SIDE_CLASSES = {
|
|
4614
|
+
top: "bottom-full",
|
|
4615
|
+
right: "top-full",
|
|
4616
|
+
bottom: "top-full",
|
|
4617
|
+
left: "top-full"
|
|
4618
|
+
};
|
|
4619
|
+
var ALIGN_CLASSES = {
|
|
4620
|
+
start: "left-0",
|
|
4621
|
+
center: "left-1/2 -translate-x-1/2",
|
|
4622
|
+
end: "right-0"
|
|
4623
|
+
};
|
|
4624
|
+
var MENUCONTENT_VARIANT_CLASSES = {
|
|
4625
|
+
menu: "p-1",
|
|
4626
|
+
profile: "p-6"
|
|
4627
|
+
};
|
|
4628
|
+
var MenuLabel = forwardRef13(({ className, inset, store: _store, ...props }, ref) => {
|
|
4629
|
+
return /* @__PURE__ */ jsx27(
|
|
4630
|
+
"div",
|
|
4631
|
+
{
|
|
4632
|
+
ref,
|
|
4633
|
+
className: `text-sm w-full ${inset ? "pl-8" : ""} ${className ?? ""}`,
|
|
4634
|
+
...props
|
|
4635
|
+
}
|
|
4636
|
+
);
|
|
4637
|
+
});
|
|
4638
|
+
MenuLabel.displayName = "MenuLabel";
|
|
4639
|
+
var DropdownMenuContent = forwardRef13(
|
|
4109
4640
|
({
|
|
4110
|
-
header,
|
|
4111
|
-
state = "undone",
|
|
4112
4641
|
className,
|
|
4113
|
-
|
|
4114
|
-
|
|
4642
|
+
align = "start",
|
|
4643
|
+
side = "bottom",
|
|
4644
|
+
variant = "menu",
|
|
4645
|
+
sideOffset = 4,
|
|
4646
|
+
children,
|
|
4647
|
+
store: externalStore,
|
|
4115
4648
|
...props
|
|
4116
4649
|
}, ref) => {
|
|
4117
|
-
const
|
|
4118
|
-
const
|
|
4119
|
-
const
|
|
4120
|
-
|
|
4121
|
-
|
|
4650
|
+
const store = useDropdownStore(externalStore);
|
|
4651
|
+
const open = useStore2(store, (s) => s.open);
|
|
4652
|
+
const [isVisible, setIsVisible] = useState9(open);
|
|
4653
|
+
useEffect5(() => {
|
|
4654
|
+
if (open) {
|
|
4655
|
+
setIsVisible(true);
|
|
4656
|
+
} else {
|
|
4657
|
+
const timer = setTimeout(() => setIsVisible(false), 200);
|
|
4658
|
+
return () => clearTimeout(timer);
|
|
4659
|
+
}
|
|
4660
|
+
}, [open]);
|
|
4661
|
+
if (!isVisible) return null;
|
|
4662
|
+
const getPositionClasses = () => {
|
|
4663
|
+
const vertical = SIDE_CLASSES[side];
|
|
4664
|
+
const horizontal = ALIGN_CLASSES[align];
|
|
4665
|
+
return `absolute ${vertical} ${horizontal}`;
|
|
4666
|
+
};
|
|
4667
|
+
const variantClasses = MENUCONTENT_VARIANT_CLASSES[variant];
|
|
4668
|
+
return /* @__PURE__ */ jsx27(
|
|
4669
|
+
"div",
|
|
4122
4670
|
{
|
|
4123
4671
|
ref,
|
|
4124
|
-
|
|
4125
|
-
|
|
4126
|
-
|
|
4127
|
-
|
|
4672
|
+
role: "menu",
|
|
4673
|
+
className: `
|
|
4674
|
+
bg-background z-50 min-w-[210px] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md border-border-100
|
|
4675
|
+
${open ? "animate-in fade-in-0 zoom-in-95" : "animate-out fade-out-0 zoom-out-95"}
|
|
4676
|
+
${getPositionClasses()}
|
|
4677
|
+
${variantClasses}
|
|
4678
|
+
${className}
|
|
4679
|
+
`,
|
|
4680
|
+
style: {
|
|
4681
|
+
marginTop: side === "bottom" ? sideOffset : void 0,
|
|
4682
|
+
marginBottom: side === "top" ? sideOffset : void 0,
|
|
4683
|
+
marginLeft: side === "right" ? sideOffset : void 0,
|
|
4684
|
+
marginRight: side === "left" ? sideOffset : void 0
|
|
4685
|
+
},
|
|
4128
4686
|
...props,
|
|
4129
|
-
children
|
|
4130
|
-
/* @__PURE__ */ jsxs21("section", { className: "flex flex-col gap-1 flex-1 min-w-0", children: [
|
|
4131
|
-
/* @__PURE__ */ jsx26("p", { className: "font-bold text-xs text-text-950 truncate", children: header }),
|
|
4132
|
-
/* @__PURE__ */ jsxs21("div", { className: "flex flex-row gap-6 items-center", children: [
|
|
4133
|
-
/* @__PURE__ */ jsx26(
|
|
4134
|
-
Badge_default,
|
|
4135
|
-
{
|
|
4136
|
-
size: "medium",
|
|
4137
|
-
variant: "solid",
|
|
4138
|
-
action: isDone ? "success" : "error",
|
|
4139
|
-
children: stateLabel
|
|
4140
|
-
}
|
|
4141
|
-
),
|
|
4142
|
-
/* @__PURE__ */ jsxs21("span", { className: "flex flex-row items-center gap-1 text-text-700 text-xs", children: [
|
|
4143
|
-
isDone ? "Nota" : "Sem nota",
|
|
4144
|
-
isDone && /* @__PURE__ */ jsx26(Badge_default, { size: "medium", action: "success", children: "00" })
|
|
4145
|
-
] })
|
|
4146
|
-
] })
|
|
4147
|
-
] }),
|
|
4148
|
-
/* @__PURE__ */ jsx26("span", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx26(
|
|
4149
|
-
Button_default,
|
|
4150
|
-
{
|
|
4151
|
-
size: "extra-small",
|
|
4152
|
-
onClick: () => onClickButton?.(valueButton),
|
|
4153
|
-
className: "min-w-fit",
|
|
4154
|
-
children: buttonLabel
|
|
4155
|
-
}
|
|
4156
|
-
) })
|
|
4157
|
-
]
|
|
4687
|
+
children
|
|
4158
4688
|
}
|
|
4159
4689
|
);
|
|
4160
4690
|
}
|
|
4161
4691
|
);
|
|
4162
|
-
|
|
4692
|
+
DropdownMenuContent.displayName = "DropdownMenuContent";
|
|
4693
|
+
var DropdownMenuItem = forwardRef13(
|
|
4163
4694
|
({
|
|
4164
|
-
header,
|
|
4165
|
-
subhead,
|
|
4166
|
-
initialDate,
|
|
4167
|
-
endDate,
|
|
4168
|
-
progress = 0,
|
|
4169
|
-
direction = "horizontal",
|
|
4170
|
-
icon,
|
|
4171
|
-
color = "#B7DFFF",
|
|
4172
|
-
progressVariant = "blue",
|
|
4173
|
-
showDates = true,
|
|
4174
4695
|
className,
|
|
4696
|
+
size = "small",
|
|
4697
|
+
children,
|
|
4698
|
+
iconRight,
|
|
4699
|
+
iconLeft,
|
|
4700
|
+
disabled = false,
|
|
4701
|
+
onClick,
|
|
4702
|
+
variant = "menu",
|
|
4703
|
+
store: externalStore,
|
|
4175
4704
|
...props
|
|
4176
4705
|
}, ref) => {
|
|
4177
|
-
const
|
|
4178
|
-
const
|
|
4179
|
-
|
|
4180
|
-
|
|
4181
|
-
|
|
4182
|
-
|
|
4183
|
-
|
|
4184
|
-
|
|
4185
|
-
|
|
4186
|
-
|
|
4187
|
-
|
|
4188
|
-
] })
|
|
4189
|
-
] }),
|
|
4190
|
-
/* @__PURE__ */ jsxs21("span", { className: "grid grid-cols-[1fr_auto] items-center gap-2", children: [
|
|
4191
|
-
/* @__PURE__ */ jsx26(
|
|
4192
|
-
ProgressBar_default,
|
|
4193
|
-
{
|
|
4194
|
-
size: "small",
|
|
4195
|
-
value: progress,
|
|
4196
|
-
variant: progressVariant,
|
|
4197
|
-
"data-testid": "progress-bar"
|
|
4198
|
-
}
|
|
4199
|
-
),
|
|
4200
|
-
/* @__PURE__ */ jsxs21(
|
|
4201
|
-
Text_default,
|
|
4202
|
-
{
|
|
4203
|
-
size: "xs",
|
|
4204
|
-
weight: "medium",
|
|
4205
|
-
className: `text-text-950 leading-none tracking-normal text-center flex-none`,
|
|
4206
|
-
children: [
|
|
4207
|
-
Math.round(progress),
|
|
4208
|
-
"%"
|
|
4209
|
-
]
|
|
4210
|
-
}
|
|
4211
|
-
)
|
|
4212
|
-
] })
|
|
4213
|
-
] }),
|
|
4214
|
-
vertical: /* @__PURE__ */ jsx26("p", { className: "text-sm text-text-800", children: subhead })
|
|
4706
|
+
const store = useDropdownStore(externalStore);
|
|
4707
|
+
const setOpen = useStore2(store, (s) => s.setOpen);
|
|
4708
|
+
const sizeClasses = ITEM_SIZE_CLASSES[size];
|
|
4709
|
+
const handleClick = (e) => {
|
|
4710
|
+
if (disabled) {
|
|
4711
|
+
e.preventDefault();
|
|
4712
|
+
e.stopPropagation();
|
|
4713
|
+
return;
|
|
4714
|
+
}
|
|
4715
|
+
onClick?.(e);
|
|
4716
|
+
setOpen(false);
|
|
4215
4717
|
};
|
|
4216
|
-
|
|
4217
|
-
|
|
4218
|
-
|
|
4219
|
-
ref,
|
|
4220
|
-
layout: isHorizontal ? "horizontal" : "vertical",
|
|
4221
|
-
padding: "none",
|
|
4222
|
-
minHeight: "medium",
|
|
4223
|
-
cursor: "pointer",
|
|
4224
|
-
className: `${isHorizontal ? "h-20" : ""} ${className}`,
|
|
4225
|
-
...props,
|
|
4226
|
-
children: [
|
|
4227
|
-
/* @__PURE__ */ jsx26(
|
|
4228
|
-
"div",
|
|
4229
|
-
{
|
|
4230
|
-
className: `
|
|
4231
|
-
flex justify-center items-center [&>svg]:size-6 text-text-950
|
|
4232
|
-
${isHorizontal ? "min-w-[80px] min-h-[80px] rounded-l-xl" : "min-h-[50px] w-full rounded-t-xl"}
|
|
4233
|
-
${!color.startsWith("#") ? `bg-${color}` : ""}
|
|
4234
|
-
`,
|
|
4235
|
-
style: color.startsWith("#") ? { backgroundColor: color } : void 0,
|
|
4236
|
-
"data-testid": "icon-container",
|
|
4237
|
-
children: icon
|
|
4238
|
-
}
|
|
4239
|
-
),
|
|
4240
|
-
/* @__PURE__ */ jsxs21(
|
|
4241
|
-
"div",
|
|
4242
|
-
{
|
|
4243
|
-
className: `
|
|
4244
|
-
p-4 flex flex-col justify-between w-full h-full
|
|
4245
|
-
${!isHorizontal && "gap-4"}
|
|
4246
|
-
`,
|
|
4247
|
-
children: [
|
|
4248
|
-
/* @__PURE__ */ jsx26(Text_default, { size: "sm", weight: "bold", className: "text-text-950 truncate", children: header }),
|
|
4249
|
-
contentComponent[direction]
|
|
4250
|
-
]
|
|
4251
|
-
}
|
|
4252
|
-
)
|
|
4253
|
-
]
|
|
4718
|
+
const getVariantClasses = () => {
|
|
4719
|
+
if (variant === "profile") {
|
|
4720
|
+
return "relative flex flex-row justify-between select-none items-center gap-2 rounded-sm p-4 text-sm outline-none transition-colors [&>svg]:size-6 [&>svg]:shrink-0";
|
|
4254
4721
|
}
|
|
4255
|
-
|
|
4256
|
-
|
|
4257
|
-
)
|
|
4258
|
-
|
|
4259
|
-
|
|
4260
|
-
|
|
4261
|
-
|
|
4262
|
-
progress,
|
|
4263
|
-
showPercentage = false,
|
|
4264
|
-
progressVariant = "blue",
|
|
4265
|
-
className = "",
|
|
4266
|
-
...props
|
|
4267
|
-
}, ref) => {
|
|
4268
|
-
return /* @__PURE__ */ jsxs21(
|
|
4269
|
-
CardBase,
|
|
4722
|
+
return "relative flex select-none items-center gap-2 rounded-sm p-3 text-sm outline-none transition-colors [&>svg]:size-4 [&>svg]:shrink-0";
|
|
4723
|
+
};
|
|
4724
|
+
const getVariantProps = () => {
|
|
4725
|
+
return variant === "profile" ? { "data-variant": "profile" } : {};
|
|
4726
|
+
};
|
|
4727
|
+
return /* @__PURE__ */ jsxs22(
|
|
4728
|
+
"div",
|
|
4270
4729
|
{
|
|
4271
4730
|
ref,
|
|
4272
|
-
|
|
4273
|
-
|
|
4274
|
-
|
|
4275
|
-
|
|
4276
|
-
|
|
4731
|
+
role: "menuitem",
|
|
4732
|
+
...getVariantProps(),
|
|
4733
|
+
"aria-disabled": disabled,
|
|
4734
|
+
className: `
|
|
4735
|
+
focus-visible:bg-background-50
|
|
4736
|
+
${getVariantClasses()}
|
|
4737
|
+
${sizeClasses}
|
|
4738
|
+
${className}
|
|
4739
|
+
${disabled ? "cursor-not-allowed text-text-400" : "cursor-pointer hover:bg-background-50 text-text-700 focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground"}
|
|
4740
|
+
`,
|
|
4741
|
+
onClick: handleClick,
|
|
4742
|
+
onKeyDown: (e) => {
|
|
4743
|
+
if (e.key === "Enter" || e.key === " ") handleClick(e);
|
|
4744
|
+
},
|
|
4745
|
+
tabIndex: disabled ? -1 : 0,
|
|
4277
4746
|
...props,
|
|
4278
|
-
children: [
|
|
4279
|
-
|
|
4280
|
-
|
|
4281
|
-
|
|
4282
|
-
] }, `${text} - ${index}`)) }),
|
|
4283
|
-
/* @__PURE__ */ jsx26("p", { className: "text-sm text-text-950 font-bold truncate", children: header }),
|
|
4284
|
-
/* @__PURE__ */ jsxs21("span", { className: "grid grid-cols-[1fr_auto] items-center gap-2", children: [
|
|
4285
|
-
/* @__PURE__ */ jsx26(
|
|
4286
|
-
ProgressBar_default,
|
|
4287
|
-
{
|
|
4288
|
-
size: "small",
|
|
4289
|
-
value: progress,
|
|
4290
|
-
variant: progressVariant,
|
|
4291
|
-
"data-testid": "progress-bar"
|
|
4292
|
-
}
|
|
4293
|
-
),
|
|
4294
|
-
showPercentage && /* @__PURE__ */ jsxs21(
|
|
4295
|
-
Text_default,
|
|
4296
|
-
{
|
|
4297
|
-
size: "xs",
|
|
4298
|
-
weight: "medium",
|
|
4299
|
-
className: `text-text-950 leading-none tracking-normal text-center flex-none`,
|
|
4300
|
-
children: [
|
|
4301
|
-
Math.round(progress),
|
|
4302
|
-
"%"
|
|
4303
|
-
]
|
|
4304
|
-
}
|
|
4305
|
-
)
|
|
4306
|
-
] })
|
|
4747
|
+
children: [
|
|
4748
|
+
iconLeft,
|
|
4749
|
+
/* @__PURE__ */ jsx27("span", { className: "w-full text-md", children }),
|
|
4750
|
+
iconRight
|
|
4307
4751
|
]
|
|
4308
4752
|
}
|
|
4309
4753
|
);
|
|
4310
4754
|
}
|
|
4311
4755
|
);
|
|
4312
|
-
|
|
4313
|
-
|
|
4314
|
-
|
|
4315
|
-
|
|
4316
|
-
|
|
4317
|
-
|
|
4318
|
-
progressVariant = "blue",
|
|
4319
|
-
labelProgress = "",
|
|
4320
|
-
className = "",
|
|
4321
|
-
onClickButton,
|
|
4322
|
-
valueButton,
|
|
4756
|
+
DropdownMenuItem.displayName = "DropdownMenuItem";
|
|
4757
|
+
var DropdownMenuSeparator = forwardRef13(({ className, store: _store, ...props }, ref) => /* @__PURE__ */ jsx27(
|
|
4758
|
+
"div",
|
|
4759
|
+
{
|
|
4760
|
+
ref,
|
|
4761
|
+
className: `my-1 h-px bg-border-200 ${className}`,
|
|
4323
4762
|
...props
|
|
4324
|
-
}
|
|
4325
|
-
|
|
4326
|
-
|
|
4327
|
-
|
|
4328
|
-
|
|
4329
|
-
|
|
4330
|
-
|
|
4331
|
-
|
|
4332
|
-
|
|
4333
|
-
|
|
4334
|
-
|
|
4335
|
-
|
|
4336
|
-
|
|
4337
|
-
|
|
4338
|
-
|
|
4339
|
-
|
|
4340
|
-
|
|
4341
|
-
|
|
4342
|
-
|
|
4343
|
-
|
|
4344
|
-
|
|
4345
|
-
|
|
4346
|
-
|
|
4347
|
-
|
|
4348
|
-
|
|
4349
|
-
|
|
4350
|
-
|
|
4351
|
-
|
|
4352
|
-
|
|
4353
|
-
|
|
4354
|
-
|
|
4355
|
-
|
|
4356
|
-
|
|
4357
|
-
|
|
4358
|
-
|
|
4359
|
-
|
|
4360
|
-
|
|
4361
|
-
|
|
4362
|
-
|
|
4363
|
-
|
|
4364
|
-
|
|
4365
|
-
|
|
4763
|
+
}
|
|
4764
|
+
));
|
|
4765
|
+
DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
|
|
4766
|
+
var ProfileMenuTrigger = forwardRef13(({ className, onClick, store: externalStore, ...props }, ref) => {
|
|
4767
|
+
const store = useDropdownStore(externalStore);
|
|
4768
|
+
const open = useStore2(store, (s) => s.open);
|
|
4769
|
+
const toggleOpen = () => store.setState({ open: !open });
|
|
4770
|
+
return /* @__PURE__ */ jsx27(
|
|
4771
|
+
"button",
|
|
4772
|
+
{
|
|
4773
|
+
ref,
|
|
4774
|
+
className: `rounded-lg size-10 bg-primary-50 flex items-center justify-center cursor-pointer ${className}`,
|
|
4775
|
+
onClick: (e) => {
|
|
4776
|
+
e.stopPropagation();
|
|
4777
|
+
toggleOpen();
|
|
4778
|
+
onClick?.(e);
|
|
4779
|
+
},
|
|
4780
|
+
"aria-expanded": open,
|
|
4781
|
+
...props,
|
|
4782
|
+
children: /* @__PURE__ */ jsx27("span", { className: "size-6 rounded-full bg-primary-100 flex items-center justify-center", children: /* @__PURE__ */ jsx27(User, { className: "text-primary-950", size: 18 }) })
|
|
4783
|
+
}
|
|
4784
|
+
);
|
|
4785
|
+
});
|
|
4786
|
+
ProfileMenuTrigger.displayName = "ProfileMenuTrigger";
|
|
4787
|
+
var ProfileMenuHeader = forwardRef13(({ className, name, email, store: _store, ...props }, ref) => {
|
|
4788
|
+
return /* @__PURE__ */ jsxs22(
|
|
4789
|
+
"div",
|
|
4790
|
+
{
|
|
4791
|
+
ref,
|
|
4792
|
+
"data-component": "ProfileMenuHeader",
|
|
4793
|
+
className: `
|
|
4794
|
+
flex flex-row gap-4 items-center
|
|
4795
|
+
${className}
|
|
4796
|
+
`,
|
|
4797
|
+
...props,
|
|
4798
|
+
children: [
|
|
4799
|
+
/* @__PURE__ */ jsx27("span", { className: "size-16 bg-primary-100 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsx27(User, { size: 34, className: "text-primary-950" }) }),
|
|
4800
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-col ", children: [
|
|
4801
|
+
/* @__PURE__ */ jsx27("p", { className: "text-xl font-bold text-text-950", children: name }),
|
|
4802
|
+
/* @__PURE__ */ jsx27("p", { className: "text-md text-text-600", children: email })
|
|
4803
|
+
] })
|
|
4804
|
+
]
|
|
4805
|
+
}
|
|
4806
|
+
);
|
|
4807
|
+
});
|
|
4808
|
+
ProfileMenuHeader.displayName = "ProfileMenuHeader";
|
|
4809
|
+
var ProfileMenuSection = forwardRef13(({ className, children, store: _store, ...props }, ref) => {
|
|
4810
|
+
return /* @__PURE__ */ jsx27(
|
|
4811
|
+
"div",
|
|
4812
|
+
{
|
|
4813
|
+
ref,
|
|
4814
|
+
className: `
|
|
4815
|
+
flex flex-col p-2
|
|
4816
|
+
${className}
|
|
4817
|
+
`,
|
|
4818
|
+
...props,
|
|
4819
|
+
children
|
|
4820
|
+
}
|
|
4821
|
+
);
|
|
4822
|
+
});
|
|
4823
|
+
ProfileMenuSection.displayName = "ProfileMenuSection";
|
|
4824
|
+
var ProfileMenuFooter = ({
|
|
4825
|
+
className,
|
|
4826
|
+
disabled = false,
|
|
4827
|
+
onClick,
|
|
4828
|
+
store: externalStore,
|
|
4829
|
+
...props
|
|
4830
|
+
}) => {
|
|
4831
|
+
const store = useDropdownStore(externalStore);
|
|
4832
|
+
const setOpen = useStore2(store, (s) => s.setOpen);
|
|
4833
|
+
return /* @__PURE__ */ jsxs22(
|
|
4834
|
+
Button_default,
|
|
4835
|
+
{
|
|
4836
|
+
variant: "outline",
|
|
4837
|
+
className: `w-full ${className}`,
|
|
4838
|
+
disabled,
|
|
4839
|
+
onClick: (e) => {
|
|
4840
|
+
setOpen(false);
|
|
4841
|
+
onClick?.(e);
|
|
4842
|
+
},
|
|
4843
|
+
...props,
|
|
4844
|
+
children: [
|
|
4845
|
+
/* @__PURE__ */ jsx27("span", { className: "mr-2 flex items-center", children: /* @__PURE__ */ jsx27(SignOut, {}) }),
|
|
4846
|
+
/* @__PURE__ */ jsx27("span", { children: "Sair" })
|
|
4847
|
+
]
|
|
4848
|
+
}
|
|
4849
|
+
);
|
|
4850
|
+
};
|
|
4851
|
+
ProfileMenuFooter.displayName = "ProfileMenuFooter";
|
|
4852
|
+
var DropdownMenu_default = DropdownMenu;
|
|
4853
|
+
|
|
4854
|
+
// src/components/Select/Select.tsx
|
|
4855
|
+
import { create as create4, useStore as useStore3 } from "zustand";
|
|
4856
|
+
import {
|
|
4857
|
+
useEffect as useEffect6,
|
|
4858
|
+
useRef as useRef5,
|
|
4859
|
+
forwardRef as forwardRef14,
|
|
4860
|
+
isValidElement as isValidElement3,
|
|
4861
|
+
Children as Children3,
|
|
4862
|
+
cloneElement as cloneElement3,
|
|
4863
|
+
useId as useId7
|
|
4864
|
+
} from "react";
|
|
4865
|
+
import { CaretDown, Check as Check4, WarningCircle as WarningCircle5 } from "phosphor-react";
|
|
4866
|
+
import { Fragment as Fragment6, jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
4867
|
+
var VARIANT_CLASSES4 = {
|
|
4868
|
+
outlined: "border rounded-lg focus:border-primary-950",
|
|
4869
|
+
underlined: "border-b focus:border-primary-950",
|
|
4870
|
+
rounded: "border rounded-full focus:border-primary-950"
|
|
4871
|
+
};
|
|
4872
|
+
var SIZE_CLASSES12 = {
|
|
4873
|
+
small: "text-sm",
|
|
4874
|
+
medium: "text-md",
|
|
4875
|
+
large: "text-lg",
|
|
4876
|
+
"extra-large": "text-lg"
|
|
4877
|
+
};
|
|
4878
|
+
var HEIGHT_CLASSES = {
|
|
4879
|
+
small: "h-8",
|
|
4880
|
+
medium: "h-9",
|
|
4881
|
+
large: "h-10",
|
|
4882
|
+
"extra-large": "h-12"
|
|
4883
|
+
};
|
|
4884
|
+
var PADDING_CLASSES = {
|
|
4885
|
+
small: "px-2 py-1",
|
|
4886
|
+
medium: "px-3 py-2",
|
|
4887
|
+
large: "px-4 py-3",
|
|
4888
|
+
"extra-large": "px-5 py-4"
|
|
4889
|
+
};
|
|
4890
|
+
var SIDE_CLASSES2 = {
|
|
4891
|
+
top: "bottom-full -translate-y-1",
|
|
4892
|
+
right: "top-full translate-y-1",
|
|
4893
|
+
bottom: "top-full translate-y-1",
|
|
4894
|
+
left: "top-full translate-y-1"
|
|
4895
|
+
};
|
|
4896
|
+
var ALIGN_CLASSES2 = {
|
|
4897
|
+
start: "left-0",
|
|
4898
|
+
center: "left-1/2 -translate-x-1/2",
|
|
4899
|
+
end: "right-0"
|
|
4900
|
+
};
|
|
4901
|
+
function createSelectStore(onValueChange) {
|
|
4902
|
+
return create4((set) => ({
|
|
4903
|
+
open: false,
|
|
4904
|
+
setOpen: (open) => set({ open }),
|
|
4905
|
+
value: "",
|
|
4906
|
+
setValue: (value) => set({ value }),
|
|
4907
|
+
selectedLabel: "",
|
|
4908
|
+
setSelectedLabel: (label) => set({ selectedLabel: label }),
|
|
4909
|
+
onValueChange
|
|
4910
|
+
}));
|
|
4911
|
+
}
|
|
4912
|
+
var useSelectStore = (externalStore) => {
|
|
4913
|
+
if (!externalStore) {
|
|
4914
|
+
throw new Error(
|
|
4915
|
+
"Component must be used within a Select (store is missing)"
|
|
4916
|
+
);
|
|
4917
|
+
}
|
|
4918
|
+
return externalStore;
|
|
4919
|
+
};
|
|
4920
|
+
function getLabelAsNode(children) {
|
|
4921
|
+
if (typeof children === "string" || typeof children === "number") {
|
|
4922
|
+
return children;
|
|
4923
|
+
}
|
|
4924
|
+
const flattened = Children3.toArray(children);
|
|
4925
|
+
if (flattened.length === 1) return flattened[0];
|
|
4926
|
+
return /* @__PURE__ */ jsx28(Fragment6, { children: flattened });
|
|
4927
|
+
}
|
|
4928
|
+
var injectStore3 = (children, store, size, selectId) => {
|
|
4929
|
+
return Children3.map(children, (child) => {
|
|
4930
|
+
if (isValidElement3(child)) {
|
|
4931
|
+
const typedChild = child;
|
|
4932
|
+
const newProps = {
|
|
4933
|
+
store
|
|
4934
|
+
};
|
|
4935
|
+
if (typedChild.type === SelectTrigger) {
|
|
4936
|
+
newProps.size = size;
|
|
4937
|
+
newProps.selectId = selectId;
|
|
4938
|
+
}
|
|
4939
|
+
if (typedChild.props.children) {
|
|
4940
|
+
newProps.children = injectStore3(
|
|
4941
|
+
typedChild.props.children,
|
|
4942
|
+
store,
|
|
4943
|
+
size,
|
|
4944
|
+
selectId
|
|
4945
|
+
);
|
|
4946
|
+
}
|
|
4947
|
+
return cloneElement3(typedChild, newProps);
|
|
4948
|
+
}
|
|
4949
|
+
return child;
|
|
4950
|
+
});
|
|
4951
|
+
};
|
|
4952
|
+
var Select = ({
|
|
4953
|
+
children,
|
|
4954
|
+
defaultValue = "",
|
|
4955
|
+
value: propValue,
|
|
4956
|
+
onValueChange,
|
|
4957
|
+
size = "small",
|
|
4958
|
+
label,
|
|
4959
|
+
helperText,
|
|
4960
|
+
errorMessage,
|
|
4961
|
+
id
|
|
4962
|
+
}) => {
|
|
4963
|
+
const storeRef = useRef5(null);
|
|
4964
|
+
storeRef.current ??= createSelectStore(onValueChange);
|
|
4965
|
+
const store = storeRef.current;
|
|
4966
|
+
const selectRef = useRef5(null);
|
|
4967
|
+
const { open, setOpen, setValue, selectedLabel } = useStore3(store, (s) => s);
|
|
4968
|
+
const generatedId = useId7();
|
|
4969
|
+
const selectId = id ?? `select-${generatedId}`;
|
|
4970
|
+
const findLabelForValue = (children2, targetValue) => {
|
|
4971
|
+
let found = null;
|
|
4972
|
+
const search = (nodes) => {
|
|
4973
|
+
Children3.forEach(nodes, (child) => {
|
|
4974
|
+
if (!isValidElement3(child)) return;
|
|
4975
|
+
const typedChild = child;
|
|
4976
|
+
if (typedChild.type === SelectItem && typedChild.props.value === targetValue) {
|
|
4977
|
+
if (typeof typedChild.props.children === "string")
|
|
4978
|
+
found = typedChild.props.children;
|
|
4979
|
+
}
|
|
4980
|
+
if (typedChild.props.children && !found)
|
|
4981
|
+
search(typedChild.props.children);
|
|
4982
|
+
});
|
|
4983
|
+
};
|
|
4984
|
+
search(children2);
|
|
4985
|
+
return found;
|
|
4986
|
+
};
|
|
4987
|
+
useEffect6(() => {
|
|
4988
|
+
if (!selectedLabel && defaultValue) {
|
|
4989
|
+
const label2 = findLabelForValue(children, defaultValue);
|
|
4990
|
+
if (label2) store.setState({ selectedLabel: label2 });
|
|
4991
|
+
}
|
|
4992
|
+
}, [children, defaultValue, selectedLabel]);
|
|
4993
|
+
useEffect6(() => {
|
|
4994
|
+
const handleClickOutside = (event) => {
|
|
4995
|
+
if (selectRef.current && !selectRef.current.contains(event.target)) {
|
|
4996
|
+
setOpen(false);
|
|
4997
|
+
}
|
|
4998
|
+
};
|
|
4999
|
+
const handleArrowKeys = (event) => {
|
|
5000
|
+
const selectContent = selectRef.current?.querySelector('[role="menu"]');
|
|
5001
|
+
if (selectContent) {
|
|
5002
|
+
event.preventDefault();
|
|
5003
|
+
const items = Array.from(
|
|
5004
|
+
selectContent.querySelectorAll(
|
|
5005
|
+
'[role="menuitem"]:not([aria-disabled="true"])'
|
|
4366
5006
|
)
|
|
4367
|
-
|
|
5007
|
+
).filter((el) => el instanceof HTMLElement);
|
|
5008
|
+
const focused = document.activeElement;
|
|
5009
|
+
const currentIndex = items.findIndex((item) => item === focused);
|
|
5010
|
+
let nextIndex = 0;
|
|
5011
|
+
if (event.key === "ArrowDown") {
|
|
5012
|
+
nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % items.length;
|
|
5013
|
+
} else {
|
|
5014
|
+
nextIndex = currentIndex === -1 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length;
|
|
5015
|
+
}
|
|
5016
|
+
items[nextIndex]?.focus();
|
|
4368
5017
|
}
|
|
4369
|
-
|
|
4370
|
-
|
|
4371
|
-
);
|
|
4372
|
-
|
|
5018
|
+
};
|
|
5019
|
+
if (open) {
|
|
5020
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
5021
|
+
document.addEventListener("keydown", handleArrowKeys);
|
|
5022
|
+
}
|
|
5023
|
+
return () => {
|
|
5024
|
+
document.removeEventListener("mousedown", handleClickOutside);
|
|
5025
|
+
document.removeEventListener("keydown", handleArrowKeys);
|
|
5026
|
+
};
|
|
5027
|
+
}, [open]);
|
|
5028
|
+
useEffect6(() => {
|
|
5029
|
+
if (propValue) {
|
|
5030
|
+
setValue(propValue);
|
|
5031
|
+
const label2 = findLabelForValue(children, propValue);
|
|
5032
|
+
if (label2) store.setState({ selectedLabel: label2 });
|
|
5033
|
+
}
|
|
5034
|
+
}, [propValue]);
|
|
5035
|
+
const sizeClasses = SIZE_CLASSES12[size];
|
|
5036
|
+
return /* @__PURE__ */ jsxs23("div", { className: "w-full", children: [
|
|
5037
|
+
label && /* @__PURE__ */ jsx28(
|
|
5038
|
+
"label",
|
|
5039
|
+
{
|
|
5040
|
+
htmlFor: selectId,
|
|
5041
|
+
className: `block font-bold text-text-900 mb-1.5 ${sizeClasses}`,
|
|
5042
|
+
children: label
|
|
5043
|
+
}
|
|
5044
|
+
),
|
|
5045
|
+
/* @__PURE__ */ jsx28("div", { className: `relative ${sizeClasses}`, ref: selectRef, children: injectStore3(children, store, size, selectId) }),
|
|
5046
|
+
/* @__PURE__ */ jsxs23("div", { className: "mt-1.5 gap-1.5", children: [
|
|
5047
|
+
helperText && /* @__PURE__ */ jsx28("p", { className: "text-sm text-text-500", children: helperText }),
|
|
5048
|
+
errorMessage && /* @__PURE__ */ jsxs23("p", { className: "flex gap-1 items-center text-sm text-indicator-error", children: [
|
|
5049
|
+
/* @__PURE__ */ jsx28(WarningCircle5, { size: 16 }),
|
|
5050
|
+
" ",
|
|
5051
|
+
errorMessage
|
|
5052
|
+
] })
|
|
5053
|
+
] })
|
|
5054
|
+
] });
|
|
5055
|
+
};
|
|
5056
|
+
var SelectValue = ({
|
|
5057
|
+
placeholder,
|
|
5058
|
+
store: externalStore
|
|
5059
|
+
}) => {
|
|
5060
|
+
const store = useSelectStore(externalStore);
|
|
5061
|
+
const selectedLabel = useStore3(store, (s) => s.selectedLabel);
|
|
5062
|
+
const value = useStore3(store, (s) => s.value);
|
|
5063
|
+
return /* @__PURE__ */ jsx28("span", { className: "text-inherit", children: selectedLabel || placeholder || value });
|
|
5064
|
+
};
|
|
5065
|
+
var SelectTrigger = forwardRef14(
|
|
4373
5066
|
({
|
|
4374
|
-
header,
|
|
4375
|
-
correct_answers,
|
|
4376
|
-
incorrect_answers,
|
|
4377
|
-
icon,
|
|
4378
|
-
direction = "col",
|
|
4379
|
-
color = "#B7DFFF",
|
|
4380
5067
|
className,
|
|
5068
|
+
invalid = false,
|
|
5069
|
+
variant = "outlined",
|
|
5070
|
+
store: externalStore,
|
|
5071
|
+
disabled,
|
|
5072
|
+
size = "medium",
|
|
5073
|
+
selectId,
|
|
4381
5074
|
...props
|
|
4382
5075
|
}, ref) => {
|
|
4383
|
-
const
|
|
4384
|
-
|
|
4385
|
-
|
|
4386
|
-
|
|
4387
|
-
|
|
4388
|
-
|
|
4389
|
-
|
|
4390
|
-
|
|
4391
|
-
className: `items-center pr-4 ${className}`,
|
|
4392
|
-
...props,
|
|
4393
|
-
children: [
|
|
4394
|
-
/* @__PURE__ */ jsx26(
|
|
4395
|
-
"div",
|
|
4396
|
-
{
|
|
4397
|
-
className: `
|
|
4398
|
-
flex justify-center items-center [&>svg]:size-8 text-text-950 min-w-20 max-w-20 min-h-20 h-full rounded-l-xl
|
|
4399
|
-
`,
|
|
4400
|
-
style: {
|
|
4401
|
-
backgroundColor: color
|
|
4402
|
-
},
|
|
4403
|
-
children: icon
|
|
4404
|
-
}
|
|
4405
|
-
),
|
|
4406
|
-
/* @__PURE__ */ jsxs21(
|
|
4407
|
-
"div",
|
|
4408
|
-
{
|
|
4409
|
-
className: `
|
|
4410
|
-
p-4 flex justify-between w-full h-full
|
|
4411
|
-
${isRow ? "flex-row items-center gap-2" : "flex-col"}
|
|
4412
|
-
`,
|
|
4413
|
-
children: [
|
|
4414
|
-
/* @__PURE__ */ jsx26("p", { className: "text-sm font-bold text-text-950 truncate flex-1 min-w-0", children: header }),
|
|
4415
|
-
/* @__PURE__ */ jsxs21("span", { className: "flex flex-row gap-1 items-center", children: [
|
|
4416
|
-
/* @__PURE__ */ jsxs21(
|
|
4417
|
-
Badge_default,
|
|
4418
|
-
{
|
|
4419
|
-
action: "success",
|
|
4420
|
-
variant: "solid",
|
|
4421
|
-
size: "medium",
|
|
4422
|
-
iconLeft: /* @__PURE__ */ jsx26(CheckCircle3, {}),
|
|
4423
|
-
children: [
|
|
4424
|
-
correct_answers,
|
|
4425
|
-
" Corretas"
|
|
4426
|
-
]
|
|
4427
|
-
}
|
|
4428
|
-
),
|
|
4429
|
-
/* @__PURE__ */ jsxs21(
|
|
4430
|
-
Badge_default,
|
|
4431
|
-
{
|
|
4432
|
-
action: "error",
|
|
4433
|
-
variant: "solid",
|
|
4434
|
-
size: "medium",
|
|
4435
|
-
iconLeft: /* @__PURE__ */ jsx26(XCircle2, {}),
|
|
4436
|
-
children: [
|
|
4437
|
-
incorrect_answers,
|
|
4438
|
-
" Incorretas"
|
|
4439
|
-
]
|
|
4440
|
-
}
|
|
4441
|
-
)
|
|
4442
|
-
] })
|
|
4443
|
-
]
|
|
4444
|
-
}
|
|
4445
|
-
),
|
|
4446
|
-
/* @__PURE__ */ jsx26(CaretRight2, { className: "min-w-6 min-h-6 text-text-800 cursor-pointer" })
|
|
4447
|
-
]
|
|
4448
|
-
}
|
|
4449
|
-
);
|
|
4450
|
-
}
|
|
4451
|
-
);
|
|
4452
|
-
var CardStatus = forwardRef12(
|
|
4453
|
-
({ header, className, status, ...props }, ref) => {
|
|
4454
|
-
return /* @__PURE__ */ jsx26(
|
|
4455
|
-
CardBase,
|
|
4456
|
-
{
|
|
4457
|
-
ref,
|
|
4458
|
-
layout: "horizontal",
|
|
4459
|
-
padding: "medium",
|
|
4460
|
-
minHeight: "medium",
|
|
4461
|
-
className: `items-center ${className}`,
|
|
4462
|
-
...props,
|
|
4463
|
-
children: /* @__PURE__ */ jsxs21("div", { className: "flex justify-between w-full h-full flex-row items-center gap-2", children: [
|
|
4464
|
-
/* @__PURE__ */ jsx26("p", { className: "text-sm font-bold text-text-950 truncate flex-1 min-w-0", children: header }),
|
|
4465
|
-
status && /* @__PURE__ */ jsxs21("span", { className: "flex flex-row gap-1 items-center flex-shrink-0", children: [
|
|
4466
|
-
/* @__PURE__ */ jsx26(
|
|
4467
|
-
Badge_default,
|
|
4468
|
-
{
|
|
4469
|
-
action: status == "correct" ? "success" : "error",
|
|
4470
|
-
variant: "solid",
|
|
4471
|
-
size: "medium",
|
|
4472
|
-
iconLeft: /* @__PURE__ */ jsx26(CheckCircle3, {}),
|
|
4473
|
-
children: status == "correct" ? "Correta" : "Incorreta"
|
|
4474
|
-
}
|
|
4475
|
-
),
|
|
4476
|
-
/* @__PURE__ */ jsx26("p", { className: "text-sm text-text-800", children: "Respondida" })
|
|
4477
|
-
] }),
|
|
4478
|
-
/* @__PURE__ */ jsx26(CaretRight2, { className: "min-w-6 min-h-6 text-text-800 cursor-pointer flex-shrink-0 ml-2" })
|
|
4479
|
-
] })
|
|
4480
|
-
}
|
|
4481
|
-
);
|
|
4482
|
-
}
|
|
4483
|
-
);
|
|
4484
|
-
var CardSettings = forwardRef12(
|
|
4485
|
-
({ header, className, icon, ...props }, ref) => {
|
|
4486
|
-
return /* @__PURE__ */ jsxs21(
|
|
4487
|
-
CardBase,
|
|
4488
|
-
{
|
|
4489
|
-
ref,
|
|
4490
|
-
layout: "horizontal",
|
|
4491
|
-
padding: "small",
|
|
4492
|
-
minHeight: "none",
|
|
4493
|
-
className: `border-none items-center gap-2 text-text-700 ${className}`,
|
|
4494
|
-
...props,
|
|
4495
|
-
children: [
|
|
4496
|
-
/* @__PURE__ */ jsx26("span", { className: "[&>svg]:size-6", children: icon }),
|
|
4497
|
-
/* @__PURE__ */ jsx26("p", { className: "w-full text-sm truncate", children: header }),
|
|
4498
|
-
/* @__PURE__ */ jsx26(CaretRight2, { size: 24, className: "cursor-pointer" })
|
|
4499
|
-
]
|
|
4500
|
-
}
|
|
4501
|
-
);
|
|
4502
|
-
}
|
|
4503
|
-
);
|
|
4504
|
-
var CardSupport = forwardRef12(
|
|
4505
|
-
({ header, className, direction = "col", children, ...props }, ref) => {
|
|
4506
|
-
return /* @__PURE__ */ jsxs21(
|
|
4507
|
-
CardBase,
|
|
5076
|
+
const store = useSelectStore(externalStore);
|
|
5077
|
+
const open = useStore3(store, (s) => s.open);
|
|
5078
|
+
const toggleOpen = () => store.setState({ open: !open });
|
|
5079
|
+
const variantClasses = VARIANT_CLASSES4[variant];
|
|
5080
|
+
const heightClasses = HEIGHT_CLASSES[size];
|
|
5081
|
+
const paddingClasses = PADDING_CLASSES[size];
|
|
5082
|
+
return /* @__PURE__ */ jsxs23(
|
|
5083
|
+
"button",
|
|
4508
5084
|
{
|
|
4509
5085
|
ref,
|
|
4510
|
-
|
|
4511
|
-
|
|
4512
|
-
|
|
4513
|
-
|
|
5086
|
+
id: selectId,
|
|
5087
|
+
className: `
|
|
5088
|
+
flex min-w-[220px] w-full items-center justify-between border-border-300
|
|
5089
|
+
${heightClasses} ${paddingClasses}
|
|
5090
|
+
${invalid && `${variant == "underlined" ? "border-b-2" : "border-2"} border-indicator-error text-text-600`}
|
|
5091
|
+
${disabled ? "cursor-not-allowed text-text-400 pointer-events-none opacity-50" : "cursor-pointer hover:bg-background-50 focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground"}
|
|
5092
|
+
${!invalid && !disabled ? "text-text-700" : ""}
|
|
5093
|
+
${variantClasses}
|
|
5094
|
+
${className}
|
|
5095
|
+
`,
|
|
5096
|
+
onClick: toggleOpen,
|
|
5097
|
+
"aria-expanded": open,
|
|
5098
|
+
"aria-haspopup": "listbox",
|
|
5099
|
+
"aria-controls": open ? "select-content" : void 0,
|
|
4514
5100
|
...props,
|
|
4515
5101
|
children: [
|
|
4516
|
-
|
|
4517
|
-
|
|
5102
|
+
props.children,
|
|
5103
|
+
/* @__PURE__ */ jsx28(
|
|
5104
|
+
CaretDown,
|
|
4518
5105
|
{
|
|
4519
|
-
className: `
|
|
4520
|
-
w-full flex ${direction == "col" ? "flex-col" : "flex-row items-center"} gap-2
|
|
4521
|
-
`,
|
|
4522
|
-
children: [
|
|
4523
|
-
/* @__PURE__ */ jsx26("span", { className: "w-full min-w-0", children: /* @__PURE__ */ jsx26("p", { className: "text-sm text-text-950 font-bold truncate", children: header }) }),
|
|
4524
|
-
/* @__PURE__ */ jsx26("span", { className: "flex flex-row gap-1", children })
|
|
4525
|
-
]
|
|
5106
|
+
className: `h-[1em] w-[1em] opacity-50 transition-transform ${open ? "rotate-180" : ""}`
|
|
4526
5107
|
}
|
|
4527
|
-
)
|
|
4528
|
-
/* @__PURE__ */ jsx26(CaretRight2, { className: "text-text-800 cursor-pointer", size: 24 })
|
|
5108
|
+
)
|
|
4529
5109
|
]
|
|
4530
5110
|
}
|
|
4531
5111
|
);
|
|
4532
5112
|
}
|
|
4533
5113
|
);
|
|
4534
|
-
|
|
5114
|
+
SelectTrigger.displayName = "SelectTrigger";
|
|
5115
|
+
var SelectContent = forwardRef14(
|
|
4535
5116
|
({
|
|
4536
|
-
|
|
4537
|
-
|
|
4538
|
-
|
|
4539
|
-
|
|
4540
|
-
|
|
4541
|
-
onClickProfile,
|
|
4542
|
-
valueProfile,
|
|
4543
|
-
className = "",
|
|
4544
|
-
date,
|
|
4545
|
-
hour,
|
|
5117
|
+
children,
|
|
5118
|
+
className,
|
|
5119
|
+
align = "start",
|
|
5120
|
+
side = "bottom",
|
|
5121
|
+
store: externalStore,
|
|
4546
5122
|
...props
|
|
4547
5123
|
}, ref) => {
|
|
4548
|
-
|
|
4549
|
-
|
|
4550
|
-
|
|
4551
|
-
|
|
4552
|
-
|
|
4553
|
-
|
|
4554
|
-
|
|
4555
|
-
|
|
4556
|
-
|
|
4557
|
-
|
|
4558
|
-
|
|
4559
|
-
|
|
4560
|
-
"button",
|
|
4561
|
-
{
|
|
4562
|
-
type: "button",
|
|
4563
|
-
"aria-label": "Ver perfil",
|
|
4564
|
-
onClick: () => onClickProfile?.(valueProfile),
|
|
4565
|
-
className: "min-w-8 h-8 rounded-full bg-background-950"
|
|
4566
|
-
}
|
|
4567
|
-
),
|
|
4568
|
-
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-2 flex-1 min-w-0", children: [
|
|
4569
|
-
/* @__PURE__ */ jsxs21("div", { className: "flex flex-row gap-1 items-center flex-wrap", children: [
|
|
4570
|
-
/* @__PURE__ */ jsx26("p", { className: "text-xs font-semibold text-primary-700 truncate", children: title }),
|
|
4571
|
-
/* @__PURE__ */ jsxs21("p", { className: "text-xs text-text-600", children: [
|
|
4572
|
-
"\u2022 ",
|
|
4573
|
-
date,
|
|
4574
|
-
" \u2022 ",
|
|
4575
|
-
hour
|
|
4576
|
-
] })
|
|
4577
|
-
] }),
|
|
4578
|
-
/* @__PURE__ */ jsx26("p", { className: "text-text-950 text-sm line-clamp-2 truncate", children: content }),
|
|
4579
|
-
/* @__PURE__ */ jsxs21(
|
|
4580
|
-
"button",
|
|
4581
|
-
{
|
|
4582
|
-
type: "button",
|
|
4583
|
-
"aria-label": "Ver coment\xE1rios",
|
|
4584
|
-
onClick: () => onClickComments?.(valueComments),
|
|
4585
|
-
className: "text-text-600 flex flex-row gap-2 items-center",
|
|
4586
|
-
children: [
|
|
4587
|
-
/* @__PURE__ */ jsx26(ChatCircleText, { "aria-hidden": "true", size: 16 }),
|
|
4588
|
-
/* @__PURE__ */ jsxs21("p", { className: "text-xs", children: [
|
|
4589
|
-
comments,
|
|
4590
|
-
" respostas"
|
|
4591
|
-
] })
|
|
4592
|
-
]
|
|
4593
|
-
}
|
|
4594
|
-
)
|
|
4595
|
-
] })
|
|
4596
|
-
]
|
|
5124
|
+
const store = useSelectStore(externalStore);
|
|
5125
|
+
const open = useStore3(store, (s) => s.open);
|
|
5126
|
+
if (!open) return null;
|
|
5127
|
+
const getPositionClasses = () => `w-full min-w-full absolute ${SIDE_CLASSES2[side]} ${ALIGN_CLASSES2[align]}`;
|
|
5128
|
+
return /* @__PURE__ */ jsx28(
|
|
5129
|
+
"div",
|
|
5130
|
+
{
|
|
5131
|
+
role: "menu",
|
|
5132
|
+
ref,
|
|
5133
|
+
className: `bg-background z-50 min-w-[210px] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md border-border-100 ${getPositionClasses()} ${className}`,
|
|
5134
|
+
...props,
|
|
5135
|
+
children
|
|
4597
5136
|
}
|
|
4598
5137
|
);
|
|
4599
5138
|
}
|
|
4600
5139
|
);
|
|
4601
|
-
|
|
5140
|
+
SelectContent.displayName = "SelectContent";
|
|
5141
|
+
var SelectItem = forwardRef14(
|
|
4602
5142
|
({
|
|
4603
|
-
src,
|
|
4604
|
-
title,
|
|
4605
|
-
onPlay,
|
|
4606
|
-
onPause,
|
|
4607
|
-
onEnded,
|
|
4608
|
-
onAudioTimeUpdate,
|
|
4609
|
-
loop = false,
|
|
4610
|
-
preload = "metadata",
|
|
4611
|
-
tracks,
|
|
4612
5143
|
className,
|
|
5144
|
+
children,
|
|
5145
|
+
value,
|
|
5146
|
+
disabled = false,
|
|
5147
|
+
store: externalStore,
|
|
4613
5148
|
...props
|
|
4614
5149
|
}, ref) => {
|
|
4615
|
-
const
|
|
4616
|
-
const
|
|
4617
|
-
|
|
4618
|
-
|
|
4619
|
-
|
|
4620
|
-
|
|
4621
|
-
|
|
4622
|
-
|
|
4623
|
-
|
|
4624
|
-
|
|
4625
|
-
|
|
4626
|
-
|
|
4627
|
-
|
|
4628
|
-
|
|
4629
|
-
|
|
4630
|
-
onPause?.();
|
|
4631
|
-
} else {
|
|
4632
|
-
audioRef.current?.play();
|
|
4633
|
-
setIsPlaying(true);
|
|
4634
|
-
onPlay?.();
|
|
4635
|
-
}
|
|
4636
|
-
};
|
|
4637
|
-
const handleTimeUpdate = () => {
|
|
4638
|
-
const current = audioRef.current?.currentTime ?? 0;
|
|
4639
|
-
const total = audioRef.current?.duration ?? 0;
|
|
4640
|
-
setCurrentTime(current);
|
|
4641
|
-
setDuration(total);
|
|
4642
|
-
onAudioTimeUpdate?.(current, total);
|
|
4643
|
-
};
|
|
4644
|
-
const handleLoadedMetadata = () => {
|
|
4645
|
-
setDuration(audioRef.current?.duration ?? 0);
|
|
4646
|
-
};
|
|
4647
|
-
const handleEnded = () => {
|
|
4648
|
-
setIsPlaying(false);
|
|
4649
|
-
setCurrentTime(0);
|
|
4650
|
-
onEnded?.();
|
|
4651
|
-
};
|
|
4652
|
-
const handleProgressClick = (e) => {
|
|
4653
|
-
const rect = e.currentTarget.getBoundingClientRect();
|
|
4654
|
-
const clickX = e.clientX - rect.left;
|
|
4655
|
-
const width = rect.width;
|
|
4656
|
-
const percentage = clickX / width;
|
|
4657
|
-
const newTime = percentage * duration;
|
|
4658
|
-
if (audioRef.current) {
|
|
4659
|
-
audioRef.current.currentTime = newTime;
|
|
4660
|
-
}
|
|
4661
|
-
setCurrentTime(newTime);
|
|
4662
|
-
};
|
|
4663
|
-
const handleVolumeChange = (e) => {
|
|
4664
|
-
const newVolume = parseFloat(e.target.value);
|
|
4665
|
-
setVolume(newVolume);
|
|
4666
|
-
if (audioRef.current) {
|
|
4667
|
-
audioRef.current.volume = newVolume;
|
|
4668
|
-
}
|
|
4669
|
-
};
|
|
4670
|
-
const toggleVolumeControl = () => {
|
|
4671
|
-
setShowVolumeControl(!showVolumeControl);
|
|
4672
|
-
};
|
|
4673
|
-
const getVolumeIcon = () => {
|
|
4674
|
-
if (volume === 0) {
|
|
4675
|
-
return /* @__PURE__ */ jsx26(SpeakerSimpleX, {});
|
|
4676
|
-
}
|
|
4677
|
-
if (volume < 0.5) {
|
|
4678
|
-
return /* @__PURE__ */ jsx26(SpeakerLow, {});
|
|
5150
|
+
const store = useSelectStore(externalStore);
|
|
5151
|
+
const {
|
|
5152
|
+
value: selectedValue,
|
|
5153
|
+
setValue,
|
|
5154
|
+
setOpen,
|
|
5155
|
+
setSelectedLabel,
|
|
5156
|
+
onValueChange
|
|
5157
|
+
} = useStore3(store, (s) => s);
|
|
5158
|
+
const handleClick = (e) => {
|
|
5159
|
+
const labelNode = getLabelAsNode(children);
|
|
5160
|
+
if (!disabled) {
|
|
5161
|
+
setValue(value);
|
|
5162
|
+
setSelectedLabel(labelNode);
|
|
5163
|
+
setOpen(false);
|
|
5164
|
+
onValueChange?.(value);
|
|
4679
5165
|
}
|
|
4680
|
-
|
|
5166
|
+
props.onClick?.(e);
|
|
4681
5167
|
};
|
|
4682
|
-
return /* @__PURE__ */
|
|
4683
|
-
|
|
5168
|
+
return /* @__PURE__ */ jsxs23(
|
|
5169
|
+
"div",
|
|
4684
5170
|
{
|
|
5171
|
+
role: "menuitem",
|
|
5172
|
+
"aria-disabled": disabled,
|
|
4685
5173
|
ref,
|
|
4686
|
-
|
|
4687
|
-
|
|
4688
|
-
|
|
4689
|
-
|
|
5174
|
+
className: `
|
|
5175
|
+
focus-visible:bg-background-50
|
|
5176
|
+
relative flex select-none items-center gap-2 rounded-sm p-3 outline-none transition-colors [&>svg]:size-4 [&>svg]:shrink-0
|
|
5177
|
+
${className}
|
|
5178
|
+
${disabled ? "cursor-not-allowed text-text-400 pointer-events-none opacity-50" : "cursor-pointer hover:bg-background-50 text-text-700 focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground"}
|
|
5179
|
+
${selectedValue === value && "bg-background-50"}
|
|
5180
|
+
`,
|
|
5181
|
+
onClick: handleClick,
|
|
5182
|
+
onKeyDown: (e) => {
|
|
5183
|
+
if (e.key === "Enter" || e.key === " ") handleClick(e);
|
|
5184
|
+
},
|
|
5185
|
+
tabIndex: disabled ? -1 : 0,
|
|
4690
5186
|
...props,
|
|
4691
5187
|
children: [
|
|
4692
|
-
/* @__PURE__ */
|
|
4693
|
-
|
|
4694
|
-
{
|
|
4695
|
-
ref: audioRef,
|
|
4696
|
-
src,
|
|
4697
|
-
loop,
|
|
4698
|
-
preload,
|
|
4699
|
-
onTimeUpdate: handleTimeUpdate,
|
|
4700
|
-
onLoadedMetadata: handleLoadedMetadata,
|
|
4701
|
-
onEnded: handleEnded,
|
|
4702
|
-
"data-testid": "audio-element",
|
|
4703
|
-
"aria-label": title,
|
|
4704
|
-
children: tracks ? tracks.map((track) => /* @__PURE__ */ jsx26(
|
|
4705
|
-
"track",
|
|
4706
|
-
{
|
|
4707
|
-
kind: track.kind,
|
|
4708
|
-
src: track.src,
|
|
4709
|
-
srcLang: track.srcLang,
|
|
4710
|
-
label: track.label,
|
|
4711
|
-
default: track.default
|
|
4712
|
-
},
|
|
4713
|
-
track.src
|
|
4714
|
-
)) : /* @__PURE__ */ jsx26(
|
|
4715
|
-
"track",
|
|
4716
|
-
{
|
|
4717
|
-
kind: "captions",
|
|
4718
|
-
src: "data:text/vtt;base64,",
|
|
4719
|
-
srcLang: "pt",
|
|
4720
|
-
label: "Sem legendas dispon\xEDveis"
|
|
4721
|
-
}
|
|
4722
|
-
)
|
|
4723
|
-
}
|
|
4724
|
-
),
|
|
4725
|
-
/* @__PURE__ */ jsx26(
|
|
4726
|
-
"button",
|
|
4727
|
-
{
|
|
4728
|
-
type: "button",
|
|
4729
|
-
onClick: handlePlayPause,
|
|
4730
|
-
disabled: !src,
|
|
4731
|
-
className: "cursor-pointer text-text-950 hover:text-primary-600 disabled:text-text-400 disabled:cursor-not-allowed",
|
|
4732
|
-
"aria-label": isPlaying ? "Pausar" : "Reproduzir",
|
|
4733
|
-
children: isPlaying ? /* @__PURE__ */ jsx26("div", { className: "w-6 h-6 flex items-center justify-center", children: /* @__PURE__ */ jsxs21("div", { className: "flex gap-0.5", children: [
|
|
4734
|
-
/* @__PURE__ */ jsx26("div", { className: "w-1 h-4 bg-current rounded-sm" }),
|
|
4735
|
-
/* @__PURE__ */ jsx26("div", { className: "w-1 h-4 bg-current rounded-sm" })
|
|
4736
|
-
] }) }) : /* @__PURE__ */ jsx26(Play, { size: 24 })
|
|
4737
|
-
}
|
|
4738
|
-
),
|
|
4739
|
-
/* @__PURE__ */ jsx26("p", { className: "text-text-800 text-sm font-medium min-w-[2.5rem]", children: formatTime(currentTime) }),
|
|
4740
|
-
/* @__PURE__ */ jsx26("div", { className: "flex-1 relative", "data-testid": "progress-bar", children: /* @__PURE__ */ jsx26(
|
|
4741
|
-
"button",
|
|
4742
|
-
{
|
|
4743
|
-
type: "button",
|
|
4744
|
-
className: "w-full h-2 bg-border-100 rounded-full cursor-pointer",
|
|
4745
|
-
onClick: handleProgressClick,
|
|
4746
|
-
onKeyDown: (e) => {
|
|
4747
|
-
if (e.key === "Enter" || e.key === " ") {
|
|
4748
|
-
e.preventDefault();
|
|
4749
|
-
handleProgressClick(
|
|
4750
|
-
e
|
|
4751
|
-
);
|
|
4752
|
-
}
|
|
4753
|
-
},
|
|
4754
|
-
"aria-label": "Barra de progresso do \xE1udio",
|
|
4755
|
-
children: /* @__PURE__ */ jsx26(
|
|
4756
|
-
"div",
|
|
4757
|
-
{
|
|
4758
|
-
className: "h-full bg-primary-600 rounded-full transition-all duration-100",
|
|
4759
|
-
style: {
|
|
4760
|
-
width: duration > 0 ? `${currentTime / duration * 100}%` : "0%"
|
|
4761
|
-
}
|
|
4762
|
-
}
|
|
4763
|
-
)
|
|
4764
|
-
}
|
|
4765
|
-
) }),
|
|
4766
|
-
/* @__PURE__ */ jsx26("p", { className: "text-text-800 text-sm font-medium min-w-[2.5rem]", children: formatTime(duration) }),
|
|
4767
|
-
/* @__PURE__ */ jsxs21("div", { className: "relative", children: [
|
|
4768
|
-
/* @__PURE__ */ jsx26(
|
|
4769
|
-
"button",
|
|
4770
|
-
{
|
|
4771
|
-
type: "button",
|
|
4772
|
-
onClick: toggleVolumeControl,
|
|
4773
|
-
className: "cursor-pointer text-text-950 hover:text-primary-600",
|
|
4774
|
-
"aria-label": "Controle de volume",
|
|
4775
|
-
children: /* @__PURE__ */ jsx26("div", { className: "w-6 h-6 flex items-center justify-center", children: getVolumeIcon() })
|
|
4776
|
-
}
|
|
4777
|
-
),
|
|
4778
|
-
showVolumeControl && /* @__PURE__ */ jsx26(
|
|
4779
|
-
"button",
|
|
4780
|
-
{
|
|
4781
|
-
type: "button",
|
|
4782
|
-
className: "absolute bottom-full right-0 mb-2 p-2 bg-background border border-border-100 rounded-lg shadow-lg focus:outline-none focus:ring-2 focus:ring-primary-500",
|
|
4783
|
-
onKeyDown: (e) => {
|
|
4784
|
-
if (e.key === "Escape") {
|
|
4785
|
-
setShowVolumeControl(false);
|
|
4786
|
-
}
|
|
4787
|
-
},
|
|
4788
|
-
children: /* @__PURE__ */ jsx26(
|
|
4789
|
-
"input",
|
|
4790
|
-
{
|
|
4791
|
-
type: "range",
|
|
4792
|
-
min: "0",
|
|
4793
|
-
max: "1",
|
|
4794
|
-
step: "0.1",
|
|
4795
|
-
value: volume,
|
|
4796
|
-
onChange: handleVolumeChange,
|
|
4797
|
-
onKeyDown: (e) => {
|
|
4798
|
-
if (e.key === "ArrowUp" || e.key === "ArrowRight") {
|
|
4799
|
-
e.preventDefault();
|
|
4800
|
-
const newVolume = Math.min(
|
|
4801
|
-
1,
|
|
4802
|
-
Math.round((volume + 0.1) * 10) / 10
|
|
4803
|
-
);
|
|
4804
|
-
setVolume(newVolume);
|
|
4805
|
-
if (audioRef.current) audioRef.current.volume = newVolume;
|
|
4806
|
-
} else if (e.key === "ArrowDown" || e.key === "ArrowLeft") {
|
|
4807
|
-
e.preventDefault();
|
|
4808
|
-
const newVolume = Math.max(
|
|
4809
|
-
0,
|
|
4810
|
-
Math.round((volume - 0.1) * 10) / 10
|
|
4811
|
-
);
|
|
4812
|
-
setVolume(newVolume);
|
|
4813
|
-
if (audioRef.current) audioRef.current.volume = newVolume;
|
|
4814
|
-
}
|
|
4815
|
-
},
|
|
4816
|
-
className: "w-20 h-2 bg-border-100 rounded-lg appearance-none cursor-pointer",
|
|
4817
|
-
style: {
|
|
4818
|
-
background: `linear-gradient(to right, #3b82f6 0%, #3b82f6 ${volume * 100}%, #e5e7eb ${volume * 100}%, #e5e7eb 100%)`
|
|
4819
|
-
},
|
|
4820
|
-
"aria-label": "Volume",
|
|
4821
|
-
"aria-valuenow": Math.round(volume * 100),
|
|
4822
|
-
"aria-valuemin": 0,
|
|
4823
|
-
"aria-valuemax": 100
|
|
4824
|
-
}
|
|
4825
|
-
)
|
|
4826
|
-
}
|
|
4827
|
-
)
|
|
4828
|
-
] }),
|
|
4829
|
-
/* @__PURE__ */ jsx26(
|
|
4830
|
-
DotsThreeVertical,
|
|
4831
|
-
{
|
|
4832
|
-
size: 24,
|
|
4833
|
-
className: "text-text-950 cursor-pointer hover:text-primary-600"
|
|
4834
|
-
}
|
|
4835
|
-
)
|
|
5188
|
+
/* @__PURE__ */ jsx28("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: selectedValue === value && /* @__PURE__ */ jsx28(Check4, { className: "" }) }),
|
|
5189
|
+
children
|
|
4836
5190
|
]
|
|
4837
5191
|
}
|
|
4838
5192
|
);
|
|
4839
5193
|
}
|
|
4840
5194
|
);
|
|
4841
|
-
|
|
4842
|
-
|
|
4843
|
-
|
|
4844
|
-
|
|
4845
|
-
|
|
4846
|
-
|
|
4847
|
-
|
|
4848
|
-
|
|
4849
|
-
|
|
4850
|
-
|
|
4851
|
-
|
|
5195
|
+
SelectItem.displayName = "SelectItem";
|
|
5196
|
+
var Select_default = Select;
|
|
5197
|
+
|
|
5198
|
+
// src/components/Menu/Menu.tsx
|
|
5199
|
+
import { create as create5, useStore as useStore4 } from "zustand";
|
|
5200
|
+
import {
|
|
5201
|
+
useEffect as useEffect7,
|
|
5202
|
+
useRef as useRef6,
|
|
5203
|
+
forwardRef as forwardRef15,
|
|
5204
|
+
isValidElement as isValidElement4,
|
|
5205
|
+
Children as Children4,
|
|
5206
|
+
cloneElement as cloneElement4,
|
|
5207
|
+
useState as useState10
|
|
5208
|
+
} from "react";
|
|
5209
|
+
import { CaretLeft, CaretRight as CaretRight3 } from "phosphor-react";
|
|
5210
|
+
import { jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
5211
|
+
var createMenuStore = (onValueChange) => create5((set) => ({
|
|
5212
|
+
value: "",
|
|
5213
|
+
setValue: (value) => {
|
|
5214
|
+
set({ value });
|
|
5215
|
+
onValueChange?.(value);
|
|
5216
|
+
},
|
|
5217
|
+
onValueChange
|
|
5218
|
+
}));
|
|
5219
|
+
var useMenuStore = (externalStore) => {
|
|
5220
|
+
if (!externalStore) throw new Error("MenuItem must be inside Menu");
|
|
5221
|
+
return externalStore;
|
|
5222
|
+
};
|
|
5223
|
+
var VARIANT_CLASSES5 = {
|
|
5224
|
+
menu: "bg-background shadow-soft-shadow-1 px-6",
|
|
5225
|
+
menu2: "",
|
|
5226
|
+
breadcrumb: ""
|
|
5227
|
+
};
|
|
5228
|
+
var Menu = forwardRef15(
|
|
5229
|
+
({
|
|
5230
|
+
className,
|
|
5231
|
+
children,
|
|
5232
|
+
defaultValue,
|
|
5233
|
+
value: propValue,
|
|
5234
|
+
variant = "menu",
|
|
5235
|
+
onValueChange,
|
|
5236
|
+
...props
|
|
5237
|
+
}, ref) => {
|
|
5238
|
+
const storeRef = useRef6(null);
|
|
5239
|
+
storeRef.current ??= createMenuStore(onValueChange);
|
|
5240
|
+
const store = storeRef.current;
|
|
5241
|
+
const { setValue } = useStore4(store, (s) => s);
|
|
5242
|
+
useEffect7(() => {
|
|
5243
|
+
setValue(propValue ?? defaultValue);
|
|
5244
|
+
}, [defaultValue, propValue, setValue]);
|
|
5245
|
+
const baseClasses = "w-full py-2 flex flex-row items-center justify-center";
|
|
5246
|
+
const variantClasses = VARIANT_CLASSES5[variant];
|
|
5247
|
+
return /* @__PURE__ */ jsx29(
|
|
5248
|
+
"div",
|
|
5249
|
+
{
|
|
5250
|
+
ref,
|
|
5251
|
+
className: `
|
|
5252
|
+
${baseClasses}
|
|
5253
|
+
${variantClasses}
|
|
5254
|
+
${className ?? ""}
|
|
5255
|
+
`,
|
|
5256
|
+
...props,
|
|
5257
|
+
children: injectStore4(children, store)
|
|
5258
|
+
}
|
|
5259
|
+
);
|
|
5260
|
+
}
|
|
5261
|
+
);
|
|
5262
|
+
Menu.displayName = "Menu";
|
|
5263
|
+
var MenuContent = forwardRef15(
|
|
5264
|
+
({ className, children, variant = "menu", ...props }, ref) => {
|
|
5265
|
+
const baseClasses = "w-full flex flex-row items-center gap-2";
|
|
5266
|
+
const variantClasses = variant === "menu2" ? "overflow-x-auto scroll-smooth" : "";
|
|
5267
|
+
return /* @__PURE__ */ jsx29(
|
|
5268
|
+
"ul",
|
|
4852
5269
|
{
|
|
4853
5270
|
ref,
|
|
4854
|
-
|
|
4855
|
-
|
|
4856
|
-
|
|
4857
|
-
|
|
4858
|
-
|
|
5271
|
+
className: `
|
|
5272
|
+
${baseClasses}
|
|
5273
|
+
${variantClasses}
|
|
5274
|
+
${variant == "breadcrumb" ? "flex-wrap" : ""}
|
|
5275
|
+
${className ?? ""}
|
|
5276
|
+
`,
|
|
5277
|
+
style: variant === "menu2" ? { scrollbarWidth: "none", msOverflowStyle: "none" } : void 0,
|
|
4859
5278
|
...props,
|
|
4860
|
-
children
|
|
4861
|
-
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1 flex-1 min-w-0", children: [
|
|
4862
|
-
/* @__PURE__ */ jsx26(Text_default, { size: "lg", weight: "bold", className: "text-text-950 truncate", children: title }),
|
|
4863
|
-
/* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-4 text-text-700", children: [
|
|
4864
|
-
duration && /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-1", children: [
|
|
4865
|
-
/* @__PURE__ */ jsx26(Clock, { size: 16, className: "flex-shrink-0" }),
|
|
4866
|
-
/* @__PURE__ */ jsx26(Text_default, { size: "sm", children: duration })
|
|
4867
|
-
] }),
|
|
4868
|
-
/* @__PURE__ */ jsx26(Text_default, { size: "sm", className: "truncate", children: info })
|
|
4869
|
-
] })
|
|
4870
|
-
] }),
|
|
4871
|
-
/* @__PURE__ */ jsx26(
|
|
4872
|
-
CaretRight2,
|
|
4873
|
-
{
|
|
4874
|
-
size: 24,
|
|
4875
|
-
className: "text-text-800 flex-shrink-0",
|
|
4876
|
-
"data-testid": "caret-icon"
|
|
4877
|
-
}
|
|
4878
|
-
)
|
|
4879
|
-
] })
|
|
5279
|
+
children
|
|
4880
5280
|
}
|
|
4881
5281
|
);
|
|
4882
5282
|
}
|
|
4883
5283
|
);
|
|
5284
|
+
MenuContent.displayName = "MenuContent";
|
|
5285
|
+
var MenuItem = forwardRef15(
|
|
5286
|
+
({
|
|
5287
|
+
className,
|
|
5288
|
+
children,
|
|
5289
|
+
value,
|
|
5290
|
+
disabled = false,
|
|
5291
|
+
store: externalStore,
|
|
5292
|
+
variant = "menu",
|
|
5293
|
+
separator = false,
|
|
5294
|
+
...props
|
|
5295
|
+
}, ref) => {
|
|
5296
|
+
const store = useMenuStore(externalStore);
|
|
5297
|
+
const { value: selectedValue, setValue } = useStore4(store, (s) => s);
|
|
5298
|
+
const handleClick = (e) => {
|
|
5299
|
+
if (!disabled) {
|
|
5300
|
+
setValue(value);
|
|
5301
|
+
}
|
|
5302
|
+
props.onClick?.(e);
|
|
5303
|
+
};
|
|
5304
|
+
const commonProps = {
|
|
5305
|
+
role: "menuitem",
|
|
5306
|
+
"aria-disabled": disabled,
|
|
5307
|
+
ref,
|
|
5308
|
+
onClick: handleClick,
|
|
5309
|
+
onKeyDown: (e) => {
|
|
5310
|
+
if (["Enter", " "].includes(e.key)) handleClick(e);
|
|
5311
|
+
},
|
|
5312
|
+
tabIndex: disabled ? -1 : 0,
|
|
5313
|
+
onMouseDown: (e) => {
|
|
5314
|
+
e.preventDefault();
|
|
5315
|
+
},
|
|
5316
|
+
...props
|
|
5317
|
+
};
|
|
5318
|
+
const variants = {
|
|
5319
|
+
menu: /* @__PURE__ */ jsx29(
|
|
5320
|
+
"li",
|
|
5321
|
+
{
|
|
5322
|
+
"data-variant": "menu",
|
|
5323
|
+
className: `
|
|
5324
|
+
w-full flex flex-col items-center justify-center gap-0.5 py-1 px-2 rounded-sm font-medium text-xs
|
|
5325
|
+
[&>svg]:size-6 cursor-pointer hover:bg-primary-600 hover:text-text
|
|
5326
|
+
focus:outline-none focus:border-indicator-info focus:border-2
|
|
5327
|
+
${selectedValue === value ? "bg-primary-50 text-primary-950" : "text-text-950"}
|
|
5328
|
+
${className ?? ""}
|
|
5329
|
+
`,
|
|
5330
|
+
...commonProps,
|
|
5331
|
+
children
|
|
5332
|
+
}
|
|
5333
|
+
),
|
|
5334
|
+
menu2: /* @__PURE__ */ jsxs24(
|
|
5335
|
+
"li",
|
|
5336
|
+
{
|
|
5337
|
+
"data-variant": "menu2",
|
|
5338
|
+
className: `
|
|
5339
|
+
w-full flex flex-col items-center px-2 pt-4 gap-3 cursor-pointer focus:rounded-sm justify-center hover:bg-background-100 rounded-lg
|
|
5340
|
+
focus:outline-none focus:border-indicator-info focus:border-2
|
|
5341
|
+
${selectedValue === value ? "" : "pb-4"}
|
|
5342
|
+
`,
|
|
5343
|
+
...commonProps,
|
|
5344
|
+
children: [
|
|
5345
|
+
/* @__PURE__ */ jsx29(
|
|
5346
|
+
"span",
|
|
5347
|
+
{
|
|
5348
|
+
className: `flex flex-row items-center gap-2 px-4 text-text-950 text-xs font-bold ${className ?? ""}`,
|
|
5349
|
+
children
|
|
5350
|
+
}
|
|
5351
|
+
),
|
|
5352
|
+
selectedValue === value && /* @__PURE__ */ jsx29("div", { className: "h-1 w-full bg-primary-950 rounded-lg" })
|
|
5353
|
+
]
|
|
5354
|
+
}
|
|
5355
|
+
),
|
|
5356
|
+
breadcrumb: /* @__PURE__ */ jsxs24(
|
|
5357
|
+
"li",
|
|
5358
|
+
{
|
|
5359
|
+
"data-variant": "breadcrumb",
|
|
5360
|
+
className: `
|
|
5361
|
+
flex flex-row gap-2 items-center w-fit p-2 rounded-lg hover:text-primary-600 cursor-pointer font-bold text-xs
|
|
5362
|
+
focus:outline-none focus:border-indicator-info focus:border-2
|
|
5363
|
+
${selectedValue === value ? "text-text-950" : "text-text-600"}
|
|
5364
|
+
${className ?? ""}
|
|
5365
|
+
`,
|
|
5366
|
+
...commonProps,
|
|
5367
|
+
children: [
|
|
5368
|
+
/* @__PURE__ */ jsx29(
|
|
5369
|
+
"span",
|
|
5370
|
+
{
|
|
5371
|
+
className: `
|
|
5372
|
+
border-b border-text-600 hover:border-primary-600 text-inherit text-xs
|
|
5373
|
+
${selectedValue === value ? "border-b-0 font-bold" : "border-b-text-600"}
|
|
5374
|
+
`,
|
|
5375
|
+
children
|
|
5376
|
+
}
|
|
5377
|
+
),
|
|
5378
|
+
separator && /* @__PURE__ */ jsx29(
|
|
5379
|
+
CaretRight3,
|
|
5380
|
+
{
|
|
5381
|
+
size: 16,
|
|
5382
|
+
className: "text-text-600",
|
|
5383
|
+
"data-testid": "separator"
|
|
5384
|
+
}
|
|
5385
|
+
)
|
|
5386
|
+
]
|
|
5387
|
+
}
|
|
5388
|
+
)
|
|
5389
|
+
};
|
|
5390
|
+
return variants[variant] ?? variants["menu"];
|
|
5391
|
+
}
|
|
5392
|
+
);
|
|
5393
|
+
MenuItem.displayName = "MenuItem";
|
|
5394
|
+
var internalScroll = (container, direction) => {
|
|
5395
|
+
if (!container) return;
|
|
5396
|
+
container.scrollBy({
|
|
5397
|
+
left: direction === "left" ? -150 : 150,
|
|
5398
|
+
behavior: "smooth"
|
|
5399
|
+
});
|
|
5400
|
+
};
|
|
5401
|
+
var internalCheckScroll = (container, setShowLeftArrow, setShowRightArrow) => {
|
|
5402
|
+
if (!container) return;
|
|
5403
|
+
const { scrollLeft, scrollWidth, clientWidth } = container;
|
|
5404
|
+
setShowLeftArrow(scrollLeft > 0);
|
|
5405
|
+
setShowRightArrow(scrollLeft + clientWidth < scrollWidth);
|
|
5406
|
+
};
|
|
5407
|
+
var MenuOverflow = ({
|
|
5408
|
+
children,
|
|
5409
|
+
className,
|
|
5410
|
+
defaultValue,
|
|
5411
|
+
value,
|
|
5412
|
+
onValueChange,
|
|
5413
|
+
...props
|
|
5414
|
+
}) => {
|
|
5415
|
+
const containerRef = useRef6(null);
|
|
5416
|
+
const [showLeftArrow, setShowLeftArrow] = useState10(false);
|
|
5417
|
+
const [showRightArrow, setShowRightArrow] = useState10(false);
|
|
5418
|
+
useEffect7(() => {
|
|
5419
|
+
const checkScroll = () => internalCheckScroll(
|
|
5420
|
+
containerRef.current,
|
|
5421
|
+
setShowLeftArrow,
|
|
5422
|
+
setShowRightArrow
|
|
5423
|
+
);
|
|
5424
|
+
checkScroll();
|
|
5425
|
+
const container = containerRef.current;
|
|
5426
|
+
container?.addEventListener("scroll", checkScroll);
|
|
5427
|
+
window.addEventListener("resize", checkScroll);
|
|
5428
|
+
return () => {
|
|
5429
|
+
container?.removeEventListener("scroll", checkScroll);
|
|
5430
|
+
window.removeEventListener("resize", checkScroll);
|
|
5431
|
+
};
|
|
5432
|
+
}, []);
|
|
5433
|
+
return /* @__PURE__ */ jsxs24(
|
|
5434
|
+
"div",
|
|
5435
|
+
{
|
|
5436
|
+
"data-testid": "menu-overflow-wrapper",
|
|
5437
|
+
className: `relative w-full overflow-hidden ${className ?? ""}`,
|
|
5438
|
+
children: [
|
|
5439
|
+
showLeftArrow && /* @__PURE__ */ jsxs24(
|
|
5440
|
+
"button",
|
|
5441
|
+
{
|
|
5442
|
+
onClick: () => internalScroll(containerRef.current, "left"),
|
|
5443
|
+
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",
|
|
5444
|
+
"data-testid": "scroll-left-button",
|
|
5445
|
+
children: [
|
|
5446
|
+
/* @__PURE__ */ jsx29(CaretLeft, { size: 16 }),
|
|
5447
|
+
/* @__PURE__ */ jsx29("span", { className: "sr-only", children: "Scroll left" })
|
|
5448
|
+
]
|
|
5449
|
+
}
|
|
5450
|
+
),
|
|
5451
|
+
/* @__PURE__ */ jsx29(
|
|
5452
|
+
Menu,
|
|
5453
|
+
{
|
|
5454
|
+
defaultValue,
|
|
5455
|
+
onValueChange,
|
|
5456
|
+
value,
|
|
5457
|
+
variant: "menu2",
|
|
5458
|
+
...props,
|
|
5459
|
+
children: /* @__PURE__ */ jsx29(MenuContent, { ref: containerRef, variant: "menu2", children })
|
|
5460
|
+
}
|
|
5461
|
+
),
|
|
5462
|
+
showRightArrow && /* @__PURE__ */ jsxs24(
|
|
5463
|
+
"button",
|
|
5464
|
+
{
|
|
5465
|
+
onClick: () => internalScroll(containerRef.current, "right"),
|
|
5466
|
+
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",
|
|
5467
|
+
"data-testid": "scroll-right-button",
|
|
5468
|
+
children: [
|
|
5469
|
+
/* @__PURE__ */ jsx29(CaretRight3, { size: 16 }),
|
|
5470
|
+
/* @__PURE__ */ jsx29("span", { className: "sr-only", children: "Scroll right" })
|
|
5471
|
+
]
|
|
5472
|
+
}
|
|
5473
|
+
)
|
|
5474
|
+
]
|
|
5475
|
+
}
|
|
5476
|
+
);
|
|
5477
|
+
};
|
|
5478
|
+
var injectStore4 = (children, store) => Children4.map(children, (child) => {
|
|
5479
|
+
if (!isValidElement4(child)) return child;
|
|
5480
|
+
const typedChild = child;
|
|
5481
|
+
const shouldInject = typedChild.type === MenuItem;
|
|
5482
|
+
return cloneElement4(typedChild, {
|
|
5483
|
+
...shouldInject ? { store } : {},
|
|
5484
|
+
...typedChild.props.children ? { children: injectStore4(typedChild.props.children, store) } : {}
|
|
5485
|
+
});
|
|
5486
|
+
});
|
|
5487
|
+
var Menu_default = Menu;
|
|
4884
5488
|
|
|
4885
5489
|
// src/components/Skeleton/Skeleton.tsx
|
|
4886
|
-
import { forwardRef as
|
|
4887
|
-
import { jsx as
|
|
5490
|
+
import { forwardRef as forwardRef16 } from "react";
|
|
5491
|
+
import { jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
4888
5492
|
var SKELETON_ANIMATION_CLASSES = {
|
|
4889
5493
|
pulse: "animate-pulse",
|
|
4890
5494
|
none: ""
|
|
@@ -4901,7 +5505,7 @@ var SPACING_CLASSES = {
|
|
|
4901
5505
|
medium: "space-y-2",
|
|
4902
5506
|
large: "space-y-3"
|
|
4903
5507
|
};
|
|
4904
|
-
var Skeleton =
|
|
5508
|
+
var Skeleton = forwardRef16(
|
|
4905
5509
|
({
|
|
4906
5510
|
variant = "text",
|
|
4907
5511
|
width,
|
|
@@ -4921,13 +5525,13 @@ var Skeleton = forwardRef13(
|
|
|
4921
5525
|
height: typeof height === "number" ? `${height}px` : height
|
|
4922
5526
|
};
|
|
4923
5527
|
if (variant === "text" && lines > 1) {
|
|
4924
|
-
return /* @__PURE__ */
|
|
5528
|
+
return /* @__PURE__ */ jsx30(
|
|
4925
5529
|
"div",
|
|
4926
5530
|
{
|
|
4927
5531
|
ref,
|
|
4928
5532
|
className: `flex flex-col ${spacingClass} ${className}`,
|
|
4929
5533
|
...props,
|
|
4930
|
-
children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */
|
|
5534
|
+
children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ jsx30(
|
|
4931
5535
|
"div",
|
|
4932
5536
|
{
|
|
4933
5537
|
className: `${variantClass} ${animationClass}`,
|
|
@@ -4938,7 +5542,7 @@ var Skeleton = forwardRef13(
|
|
|
4938
5542
|
}
|
|
4939
5543
|
);
|
|
4940
5544
|
}
|
|
4941
|
-
return /* @__PURE__ */
|
|
5545
|
+
return /* @__PURE__ */ jsx30(
|
|
4942
5546
|
"div",
|
|
4943
5547
|
{
|
|
4944
5548
|
ref,
|
|
@@ -4950,13 +5554,13 @@ var Skeleton = forwardRef13(
|
|
|
4950
5554
|
);
|
|
4951
5555
|
}
|
|
4952
5556
|
);
|
|
4953
|
-
var SkeletonText =
|
|
4954
|
-
(props, ref) => /* @__PURE__ */
|
|
5557
|
+
var SkeletonText = forwardRef16(
|
|
5558
|
+
(props, ref) => /* @__PURE__ */ jsx30(Skeleton, { ref, variant: "text", ...props })
|
|
4955
5559
|
);
|
|
4956
|
-
var SkeletonCircle =
|
|
4957
|
-
var SkeletonRectangle =
|
|
4958
|
-
var SkeletonRounded =
|
|
4959
|
-
var SkeletonCard =
|
|
5560
|
+
var SkeletonCircle = forwardRef16((props, ref) => /* @__PURE__ */ jsx30(Skeleton, { ref, variant: "circular", ...props }));
|
|
5561
|
+
var SkeletonRectangle = forwardRef16((props, ref) => /* @__PURE__ */ jsx30(Skeleton, { ref, variant: "rectangular", ...props }));
|
|
5562
|
+
var SkeletonRounded = forwardRef16((props, ref) => /* @__PURE__ */ jsx30(Skeleton, { ref, variant: "rounded", ...props }));
|
|
5563
|
+
var SkeletonCard = forwardRef16(
|
|
4960
5564
|
({
|
|
4961
5565
|
showAvatar = true,
|
|
4962
5566
|
showTitle = true,
|
|
@@ -4966,30 +5570,30 @@ var SkeletonCard = forwardRef13(
|
|
|
4966
5570
|
className = "",
|
|
4967
5571
|
...props
|
|
4968
5572
|
}, ref) => {
|
|
4969
|
-
return /* @__PURE__ */
|
|
5573
|
+
return /* @__PURE__ */ jsxs25(
|
|
4970
5574
|
"div",
|
|
4971
5575
|
{
|
|
4972
5576
|
ref,
|
|
4973
5577
|
className: `w-full p-4 bg-background border border-border-200 rounded-lg ${className}`,
|
|
4974
5578
|
...props,
|
|
4975
5579
|
children: [
|
|
4976
|
-
/* @__PURE__ */
|
|
4977
|
-
showAvatar && /* @__PURE__ */
|
|
4978
|
-
/* @__PURE__ */
|
|
4979
|
-
showTitle && /* @__PURE__ */
|
|
4980
|
-
showDescription && /* @__PURE__ */
|
|
5580
|
+
/* @__PURE__ */ jsxs25("div", { className: "flex items-start space-x-3", children: [
|
|
5581
|
+
showAvatar && /* @__PURE__ */ jsx30(SkeletonCircle, { width: 40, height: 40 }),
|
|
5582
|
+
/* @__PURE__ */ jsxs25("div", { className: "flex-1 space-y-2", children: [
|
|
5583
|
+
showTitle && /* @__PURE__ */ jsx30(SkeletonText, { width: "60%", height: 20 }),
|
|
5584
|
+
showDescription && /* @__PURE__ */ jsx30(SkeletonText, { lines, spacing: "small" })
|
|
4981
5585
|
] })
|
|
4982
5586
|
] }),
|
|
4983
|
-
showActions && /* @__PURE__ */
|
|
4984
|
-
/* @__PURE__ */
|
|
4985
|
-
/* @__PURE__ */
|
|
5587
|
+
showActions && /* @__PURE__ */ jsxs25("div", { className: "flex justify-end space-x-2 mt-4", children: [
|
|
5588
|
+
/* @__PURE__ */ jsx30(SkeletonRectangle, { width: 80, height: 32 }),
|
|
5589
|
+
/* @__PURE__ */ jsx30(SkeletonRectangle, { width: 80, height: 32 })
|
|
4986
5590
|
] })
|
|
4987
5591
|
]
|
|
4988
5592
|
}
|
|
4989
5593
|
);
|
|
4990
5594
|
}
|
|
4991
5595
|
);
|
|
4992
|
-
var SkeletonList =
|
|
5596
|
+
var SkeletonList = forwardRef16(
|
|
4993
5597
|
({
|
|
4994
5598
|
items = 3,
|
|
4995
5599
|
showAvatar = true,
|
|
@@ -4999,19 +5603,19 @@ var SkeletonList = forwardRef13(
|
|
|
4999
5603
|
className = "",
|
|
5000
5604
|
...props
|
|
5001
5605
|
}, ref) => {
|
|
5002
|
-
return /* @__PURE__ */
|
|
5003
|
-
showAvatar && /* @__PURE__ */
|
|
5004
|
-
/* @__PURE__ */
|
|
5005
|
-
showTitle && /* @__PURE__ */
|
|
5006
|
-
showDescription && /* @__PURE__ */
|
|
5606
|
+
return /* @__PURE__ */ jsx30("div", { ref, className: `space-y-3 ${className}`, ...props, children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ jsxs25("div", { className: "flex items-start space-x-3 p-3", children: [
|
|
5607
|
+
showAvatar && /* @__PURE__ */ jsx30(SkeletonCircle, { width: 32, height: 32 }),
|
|
5608
|
+
/* @__PURE__ */ jsxs25("div", { className: "flex-1 space-y-2", children: [
|
|
5609
|
+
showTitle && /* @__PURE__ */ jsx30(SkeletonText, { width: "40%", height: 16 }),
|
|
5610
|
+
showDescription && /* @__PURE__ */ jsx30(SkeletonText, { lines, spacing: "small" })
|
|
5007
5611
|
] })
|
|
5008
5612
|
] }, index)) });
|
|
5009
5613
|
}
|
|
5010
5614
|
);
|
|
5011
|
-
var SkeletonTable =
|
|
5615
|
+
var SkeletonTable = forwardRef16(
|
|
5012
5616
|
({ rows = 5, columns = 4, showHeader = true, className = "", ...props }, ref) => {
|
|
5013
|
-
return /* @__PURE__ */
|
|
5014
|
-
showHeader && /* @__PURE__ */
|
|
5617
|
+
return /* @__PURE__ */ jsxs25("div", { ref, className: `w-full ${className}`, ...props, children: [
|
|
5618
|
+
showHeader && /* @__PURE__ */ jsx30("div", { className: "flex space-x-2 mb-3", children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ jsx30(
|
|
5015
5619
|
SkeletonText,
|
|
5016
5620
|
{
|
|
5017
5621
|
width: `${100 / columns}%`,
|
|
@@ -5019,7 +5623,7 @@ var SkeletonTable = forwardRef13(
|
|
|
5019
5623
|
},
|
|
5020
5624
|
index
|
|
5021
5625
|
)) }),
|
|
5022
|
-
/* @__PURE__ */
|
|
5626
|
+
/* @__PURE__ */ jsx30("div", { className: "space-y-2", children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ jsx30("div", { className: "flex space-x-2", children: Array.from({ length: columns }, (_2, colIndex) => /* @__PURE__ */ jsx30(
|
|
5023
5627
|
SkeletonText,
|
|
5024
5628
|
{
|
|
5025
5629
|
width: `${100 / columns}%`,
|
|
@@ -5035,13 +5639,13 @@ var SkeletonTable = forwardRef13(
|
|
|
5035
5639
|
import {
|
|
5036
5640
|
createContext,
|
|
5037
5641
|
useContext,
|
|
5038
|
-
useEffect as
|
|
5039
|
-
useState as
|
|
5642
|
+
useEffect as useEffect8,
|
|
5643
|
+
useState as useState11,
|
|
5040
5644
|
useCallback,
|
|
5041
5645
|
useMemo as useMemo3
|
|
5042
5646
|
} from "react";
|
|
5043
5647
|
import { useLocation, Navigate } from "react-router-dom";
|
|
5044
|
-
import { Fragment as
|
|
5648
|
+
import { Fragment as Fragment7, jsx as jsx31 } from "react/jsx-runtime";
|
|
5045
5649
|
var AuthContext = createContext(void 0);
|
|
5046
5650
|
var AuthProvider = ({
|
|
5047
5651
|
children,
|
|
@@ -5052,7 +5656,7 @@ var AuthProvider = ({
|
|
|
5052
5656
|
getSessionFn,
|
|
5053
5657
|
getTokensFn
|
|
5054
5658
|
}) => {
|
|
5055
|
-
const [authState, setAuthState] =
|
|
5659
|
+
const [authState, setAuthState] = useState11({
|
|
5056
5660
|
isAuthenticated: false,
|
|
5057
5661
|
isLoading: true,
|
|
5058
5662
|
...initialAuthState
|
|
@@ -5100,7 +5704,7 @@ var AuthProvider = ({
|
|
|
5100
5704
|
tokens: void 0
|
|
5101
5705
|
}));
|
|
5102
5706
|
}, [signOutFn]);
|
|
5103
|
-
|
|
5707
|
+
useEffect8(() => {
|
|
5104
5708
|
checkAuth();
|
|
5105
5709
|
}, [checkAuth]);
|
|
5106
5710
|
const contextValue = useMemo3(
|
|
@@ -5111,7 +5715,7 @@ var AuthProvider = ({
|
|
|
5111
5715
|
}),
|
|
5112
5716
|
[authState, checkAuth, signOut]
|
|
5113
5717
|
);
|
|
5114
|
-
return /* @__PURE__ */
|
|
5718
|
+
return /* @__PURE__ */ jsx31(AuthContext.Provider, { value: contextValue, children });
|
|
5115
5719
|
};
|
|
5116
5720
|
var useAuth = () => {
|
|
5117
5721
|
const context = useContext(AuthContext);
|
|
@@ -5127,17 +5731,17 @@ var ProtectedRoute = ({
|
|
|
5127
5731
|
additionalCheck
|
|
5128
5732
|
}) => {
|
|
5129
5733
|
const { isAuthenticated, isLoading, ...authState } = useAuth();
|
|
5130
|
-
const defaultLoadingComponent = /* @__PURE__ */
|
|
5734
|
+
const defaultLoadingComponent = /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ jsx31("div", { className: "text-text-950 text-lg", children: "Carregando..." }) });
|
|
5131
5735
|
if (isLoading) {
|
|
5132
|
-
return /* @__PURE__ */
|
|
5736
|
+
return /* @__PURE__ */ jsx31(Fragment7, { children: loadingComponent || defaultLoadingComponent });
|
|
5133
5737
|
}
|
|
5134
5738
|
if (!isAuthenticated) {
|
|
5135
|
-
return /* @__PURE__ */
|
|
5739
|
+
return /* @__PURE__ */ jsx31(Navigate, { to: redirectTo, replace: true });
|
|
5136
5740
|
}
|
|
5137
5741
|
if (additionalCheck && !additionalCheck({ isAuthenticated, isLoading, ...authState })) {
|
|
5138
|
-
return /* @__PURE__ */
|
|
5742
|
+
return /* @__PURE__ */ jsx31(Navigate, { to: redirectTo, replace: true });
|
|
5139
5743
|
}
|
|
5140
|
-
return /* @__PURE__ */
|
|
5744
|
+
return /* @__PURE__ */ jsx31(Fragment7, { children });
|
|
5141
5745
|
};
|
|
5142
5746
|
var PublicRoute = ({
|
|
5143
5747
|
children,
|
|
@@ -5147,15 +5751,15 @@ var PublicRoute = ({
|
|
|
5147
5751
|
}) => {
|
|
5148
5752
|
const { isAuthenticated, isLoading } = useAuth();
|
|
5149
5753
|
if (checkAuthBeforeRender && isLoading) {
|
|
5150
|
-
return /* @__PURE__ */
|
|
5754
|
+
return /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ jsx31("div", { className: "text-text-950 text-lg", children: "Carregando..." }) });
|
|
5151
5755
|
}
|
|
5152
5756
|
if (isAuthenticated && redirectIfAuthenticated) {
|
|
5153
|
-
return /* @__PURE__ */
|
|
5757
|
+
return /* @__PURE__ */ jsx31(Navigate, { to: redirectTo, replace: true });
|
|
5154
5758
|
}
|
|
5155
|
-
return /* @__PURE__ */
|
|
5759
|
+
return /* @__PURE__ */ jsx31(Fragment7, { children });
|
|
5156
5760
|
};
|
|
5157
5761
|
var withAuth = (Component, options = {}) => {
|
|
5158
|
-
return (props) => /* @__PURE__ */
|
|
5762
|
+
return (props) => /* @__PURE__ */ jsx31(ProtectedRoute, { ...options, children: /* @__PURE__ */ jsx31(Component, { ...props }) });
|
|
5159
5763
|
};
|
|
5160
5764
|
var useAuthGuard = (options = {}) => {
|
|
5161
5765
|
const authState = useAuth();
|
|
@@ -5170,7 +5774,7 @@ var useAuthGuard = (options = {}) => {
|
|
|
5170
5774
|
var useRouteAuth = (fallbackPath = "/") => {
|
|
5171
5775
|
const { isAuthenticated, isLoading } = useAuth();
|
|
5172
5776
|
const location = useLocation();
|
|
5173
|
-
const redirectToLogin = () => /* @__PURE__ */
|
|
5777
|
+
const redirectToLogin = () => /* @__PURE__ */ jsx31(Navigate, { to: fallbackPath, state: { from: location }, replace: true });
|
|
5174
5778
|
return {
|
|
5175
5779
|
isAuthenticated,
|
|
5176
5780
|
isLoading,
|
|
@@ -5179,8 +5783,8 @@ var useRouteAuth = (fallbackPath = "/") => {
|
|
|
5179
5783
|
};
|
|
5180
5784
|
|
|
5181
5785
|
// src/components/Tab/Tab.tsx
|
|
5182
|
-
import { forwardRef as
|
|
5183
|
-
import { Fragment as
|
|
5786
|
+
import { forwardRef as forwardRef17 } from "react";
|
|
5787
|
+
import { Fragment as Fragment8, jsx as jsx32, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
5184
5788
|
var TAB_SIZE_CLASSES = {
|
|
5185
5789
|
small: {
|
|
5186
5790
|
container: "h-10 gap-1",
|
|
@@ -5205,7 +5809,7 @@ var RESPONSIVE_WIDTH_CLASSES = {
|
|
|
5205
5809
|
fiveTabs: "w-[70px] sm:w-[120px]",
|
|
5206
5810
|
default: "flex-1"
|
|
5207
5811
|
};
|
|
5208
|
-
var Tab =
|
|
5812
|
+
var Tab = forwardRef17(
|
|
5209
5813
|
({
|
|
5210
5814
|
tabs,
|
|
5211
5815
|
activeTab,
|
|
@@ -5281,7 +5885,7 @@ var Tab = forwardRef14(
|
|
|
5281
5885
|
};
|
|
5282
5886
|
const tabWidthClass = getResponsiveWidthClass(tabs.length);
|
|
5283
5887
|
const containerWidth = responsive && tabs.length <= 2 ? "w-[240px] sm:w-[416px]" : "w-full";
|
|
5284
|
-
return /* @__PURE__ */
|
|
5888
|
+
return /* @__PURE__ */ jsx32(
|
|
5285
5889
|
"div",
|
|
5286
5890
|
{
|
|
5287
5891
|
ref,
|
|
@@ -5292,7 +5896,7 @@ var Tab = forwardRef14(
|
|
|
5292
5896
|
const isActive = tab.id === activeTab;
|
|
5293
5897
|
const isDisabled = Boolean(tab.disabled);
|
|
5294
5898
|
const tabClassNames = getTabClassNames(isDisabled, isActive);
|
|
5295
|
-
return /* @__PURE__ */
|
|
5899
|
+
return /* @__PURE__ */ jsxs26(
|
|
5296
5900
|
"button",
|
|
5297
5901
|
{
|
|
5298
5902
|
type: "button",
|
|
@@ -5313,11 +5917,11 @@ var Tab = forwardRef14(
|
|
|
5313
5917
|
disabled: isDisabled,
|
|
5314
5918
|
"data-testid": `tab-${tab.id}`,
|
|
5315
5919
|
children: [
|
|
5316
|
-
/* @__PURE__ */
|
|
5317
|
-
/* @__PURE__ */
|
|
5318
|
-
/* @__PURE__ */
|
|
5920
|
+
/* @__PURE__ */ jsx32("span", { className: "font-bold leading-4 tracking-[0.2px] truncate", children: responsive && tab.mobileLabel ? /* @__PURE__ */ jsxs26(Fragment8, { children: [
|
|
5921
|
+
/* @__PURE__ */ jsx32("span", { className: "sm:hidden", children: tab.mobileLabel }),
|
|
5922
|
+
/* @__PURE__ */ jsx32("span", { className: "hidden sm:inline", children: tab.label })
|
|
5319
5923
|
] }) : tab.label }),
|
|
5320
|
-
isActive && /* @__PURE__ */
|
|
5924
|
+
isActive && /* @__PURE__ */ jsx32(
|
|
5321
5925
|
"div",
|
|
5322
5926
|
{
|
|
5323
5927
|
className: `absolute bottom-0 left-2 right-2 bg-primary-700 rounded-lg z-[2] ${sizeClasses.indicator}`,
|
|
@@ -5337,10 +5941,13 @@ Tab.displayName = "Tab";
|
|
|
5337
5941
|
var Tab_default = Tab;
|
|
5338
5942
|
export {
|
|
5339
5943
|
Alert_default as Alert,
|
|
5944
|
+
AlertDialog,
|
|
5945
|
+
AlternativesList,
|
|
5340
5946
|
AuthProvider,
|
|
5341
5947
|
Badge_default as Badge,
|
|
5342
5948
|
Button_default as Button,
|
|
5343
5949
|
Calendar_default as Calendar,
|
|
5950
|
+
CardAccordation,
|
|
5344
5951
|
CardActivitiesResults,
|
|
5345
5952
|
CardPerformance,
|
|
5346
5953
|
CardProgress,
|
|
@@ -5376,6 +5983,8 @@ export {
|
|
|
5376
5983
|
ProtectedRoute,
|
|
5377
5984
|
PublicRoute,
|
|
5378
5985
|
Radio_default as Radio,
|
|
5986
|
+
RadioGroup,
|
|
5987
|
+
RadioGroupItem,
|
|
5379
5988
|
Select_default as Select,
|
|
5380
5989
|
SelectContent,
|
|
5381
5990
|
SelectItem,
|