analytica-frontend-lib 1.0.44 → 1.0.46
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/Calendar/index.js +12 -12
- package/dist/Calendar/index.js.map +1 -1
- package/dist/Calendar/index.mjs +18 -13
- package/dist/Calendar/index.mjs.map +1 -1
- package/dist/Card/index.d.mts +62 -0
- package/dist/Card/index.d.ts +62 -0
- package/dist/Card/index.js +1085 -0
- package/dist/Card/index.js.map +1 -0
- package/dist/Card/index.mjs +1054 -0
- package/dist/Card/index.mjs.map +1 -0
- package/dist/DropdownMenu/index.d.mts +1 -1
- package/dist/DropdownMenu/index.d.ts +1 -1
- package/dist/DropdownMenu/index.js +16 -12
- package/dist/DropdownMenu/index.js.map +1 -1
- package/dist/DropdownMenu/index.mjs +16 -12
- package/dist/DropdownMenu/index.mjs.map +1 -1
- package/dist/Select/index.js +15 -8
- package/dist/Select/index.js.map +1 -1
- package/dist/Select/index.mjs +15 -8
- package/dist/Select/index.mjs.map +1 -1
- package/dist/Stepper/index.d.mts +169 -0
- package/dist/Stepper/index.d.ts +169 -0
- package/dist/Stepper/index.js +381 -0
- package/dist/Stepper/index.js.map +1 -0
- package/dist/Stepper/index.mjs +354 -0
- package/dist/Stepper/index.mjs.map +1 -0
- package/dist/index.css +501 -6
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +68 -2
- package/dist/index.d.ts +68 -2
- package/dist/index.js +998 -166
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +962 -134
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +501 -6
- package/dist/styles.css.map +1 -1
- package/package.json +4 -1
package/dist/index.js
CHANGED
|
@@ -24,6 +24,13 @@ __export(src_exports, {
|
|
|
24
24
|
Badge: () => Badge_default,
|
|
25
25
|
Button: () => Button_default,
|
|
26
26
|
Calendar: () => Calendar_default,
|
|
27
|
+
CardActivesResults: () => CardActivesResults,
|
|
28
|
+
CardPerformance: () => CardPerformance,
|
|
29
|
+
CardProgress: () => CardProgress,
|
|
30
|
+
CardQuestions: () => CardQuestions,
|
|
31
|
+
CardResults: () => CardResults,
|
|
32
|
+
CardStatus: () => CardStatus,
|
|
33
|
+
CardTopic: () => CardTopic,
|
|
27
34
|
CheckBox: () => CheckBox_default,
|
|
28
35
|
Chips: () => Chips_default,
|
|
29
36
|
Divider: () => Divider_default,
|
|
@@ -39,6 +46,7 @@ __export(src_exports, {
|
|
|
39
46
|
MenuItem: () => MenuItem,
|
|
40
47
|
MenuLabel: () => MenuLabel,
|
|
41
48
|
MenuSeparator: () => MenuSeparator,
|
|
49
|
+
Modal: () => Modal_default,
|
|
42
50
|
NavButton: () => NavButton_default,
|
|
43
51
|
ProfileMenuFooter: () => ProfileMenuFooter,
|
|
44
52
|
ProfileMenuHeader: () => ProfileMenuHeader,
|
|
@@ -53,6 +61,7 @@ __export(src_exports, {
|
|
|
53
61
|
SelectTrigger: () => SelectTrigger,
|
|
54
62
|
SelectValue: () => SelectValue,
|
|
55
63
|
SelectionButton: () => SelectionButton_default,
|
|
64
|
+
Stepper: () => Stepper_default,
|
|
56
65
|
Table: () => Table_default,
|
|
57
66
|
Text: () => Text_default,
|
|
58
67
|
TextArea: () => TextArea_default,
|
|
@@ -2088,9 +2097,308 @@ var ProgressCircle = ({
|
|
|
2088
2097
|
};
|
|
2089
2098
|
var ProgressCircle_default = ProgressCircle;
|
|
2090
2099
|
|
|
2100
|
+
// src/components/Stepper/Stepper.tsx
|
|
2101
|
+
var import_phosphor_react7 = require("phosphor-react");
|
|
2102
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
2103
|
+
var SIZE_CLASSES9 = {
|
|
2104
|
+
small: {
|
|
2105
|
+
container: "gap-2",
|
|
2106
|
+
// 8px gap as specified in CSS
|
|
2107
|
+
stepWidth: "w-[58px]",
|
|
2108
|
+
// exact 58px from CSS
|
|
2109
|
+
stepHeight: "h-[38px]",
|
|
2110
|
+
// exact 38px from CSS
|
|
2111
|
+
indicator: "w-5 h-5",
|
|
2112
|
+
// 20px as specified
|
|
2113
|
+
progressBar: "h-0.5",
|
|
2114
|
+
// 2px as specified
|
|
2115
|
+
indicatorTextSize: "2xs",
|
|
2116
|
+
// 10px as specified
|
|
2117
|
+
labelTextSize: "xs",
|
|
2118
|
+
// 12px as specified
|
|
2119
|
+
iconSize: "w-3 h-3"
|
|
2120
|
+
// 12px
|
|
2121
|
+
},
|
|
2122
|
+
medium: {
|
|
2123
|
+
container: "gap-3",
|
|
2124
|
+
// 12px (8px + 4px progression)
|
|
2125
|
+
stepWidth: "w-[110px]",
|
|
2126
|
+
// 110px (increased from 90px to fit "Endereço Residencial")
|
|
2127
|
+
stepHeight: "h-[48px]",
|
|
2128
|
+
// 48px (increased from 46px for better proportion)
|
|
2129
|
+
indicator: "w-6 h-6",
|
|
2130
|
+
// 24px (20px + 4px progression)
|
|
2131
|
+
progressBar: "h-0.5",
|
|
2132
|
+
// 2px maintained for consistency
|
|
2133
|
+
indicatorTextSize: "2xs",
|
|
2134
|
+
// 10px maintained for readability
|
|
2135
|
+
labelTextSize: "xs",
|
|
2136
|
+
// 12px maintained
|
|
2137
|
+
iconSize: "w-3.5 h-3.5"
|
|
2138
|
+
// 14px
|
|
2139
|
+
},
|
|
2140
|
+
large: {
|
|
2141
|
+
container: "gap-4",
|
|
2142
|
+
// 16px (12px + 4px progression)
|
|
2143
|
+
stepWidth: "w-[160px]",
|
|
2144
|
+
// 160px (increased from 140px to fit "Endereço Residencial")
|
|
2145
|
+
stepHeight: "h-[58px]",
|
|
2146
|
+
// 58px (increased from 54px for better proportion)
|
|
2147
|
+
indicator: "w-7 h-7",
|
|
2148
|
+
// 28px (24px + 4px progression)
|
|
2149
|
+
progressBar: "h-1",
|
|
2150
|
+
// 4px (increased for better visibility)
|
|
2151
|
+
indicatorTextSize: "xs",
|
|
2152
|
+
// 12px (increased for larger size)
|
|
2153
|
+
labelTextSize: "sm",
|
|
2154
|
+
// 14px (increased for larger size)
|
|
2155
|
+
iconSize: "w-4 h-4"
|
|
2156
|
+
// 16px
|
|
2157
|
+
},
|
|
2158
|
+
extraLarge: {
|
|
2159
|
+
container: "gap-5",
|
|
2160
|
+
// 20px (16px + 4px progression)
|
|
2161
|
+
stepWidth: "w-[200px]",
|
|
2162
|
+
// 200px (increased from 180px to ensure "Endereço Residencial" fits)
|
|
2163
|
+
stepHeight: "h-[68px]",
|
|
2164
|
+
// 68px (increased from 62px for better proportion)
|
|
2165
|
+
indicator: "w-8 h-8",
|
|
2166
|
+
// 32px (28px + 4px progression)
|
|
2167
|
+
progressBar: "h-1",
|
|
2168
|
+
// 4px maintained
|
|
2169
|
+
indicatorTextSize: "xs",
|
|
2170
|
+
// 12px maintained for readability
|
|
2171
|
+
labelTextSize: "sm",
|
|
2172
|
+
// 14px maintained
|
|
2173
|
+
iconSize: "w-[18px] h-[18px]"
|
|
2174
|
+
// 18px
|
|
2175
|
+
}
|
|
2176
|
+
};
|
|
2177
|
+
var STATE_CLASSES6 = {
|
|
2178
|
+
pending: {
|
|
2179
|
+
progressBar: "bg-text-400",
|
|
2180
|
+
// #A3A3A3
|
|
2181
|
+
indicator: "bg-text-400",
|
|
2182
|
+
// #A3A3A3
|
|
2183
|
+
indicatorText: "text-white",
|
|
2184
|
+
// Branco para contraste com background cinza
|
|
2185
|
+
label: "text-text-400"
|
|
2186
|
+
// #A3A3A3
|
|
2187
|
+
},
|
|
2188
|
+
current: {
|
|
2189
|
+
progressBar: "bg-primary-800",
|
|
2190
|
+
// #1C61B2 usando classe Tailwind padrão
|
|
2191
|
+
indicator: "bg-primary-800",
|
|
2192
|
+
// #1C61B2 usando classe Tailwind padrão
|
|
2193
|
+
indicatorText: "text-white",
|
|
2194
|
+
// Branco usando classe Tailwind padrão
|
|
2195
|
+
label: "text-primary-800"
|
|
2196
|
+
// #1C61B2 usando classe Tailwind padrão
|
|
2197
|
+
},
|
|
2198
|
+
completed: {
|
|
2199
|
+
progressBar: "bg-primary-400",
|
|
2200
|
+
// #48A0E8 para barra quando checked (completed)
|
|
2201
|
+
indicator: "bg-primary-400",
|
|
2202
|
+
// #48A0E8 para corresponder à barra de progresso
|
|
2203
|
+
indicatorText: "text-white",
|
|
2204
|
+
// Branco usando classe Tailwind padrão
|
|
2205
|
+
label: "text-primary-400"
|
|
2206
|
+
// #48A0E8 para corresponder à barra de progresso
|
|
2207
|
+
}
|
|
2208
|
+
};
|
|
2209
|
+
var Step = ({
|
|
2210
|
+
step,
|
|
2211
|
+
index,
|
|
2212
|
+
size: _size,
|
|
2213
|
+
sizeClasses,
|
|
2214
|
+
stateClasses,
|
|
2215
|
+
isLast: _isLast,
|
|
2216
|
+
className = ""
|
|
2217
|
+
}) => {
|
|
2218
|
+
const stepNumber = index + 1;
|
|
2219
|
+
const isCompleted = step.state === "completed";
|
|
2220
|
+
const getAriaLabel = () => {
|
|
2221
|
+
let suffix = "";
|
|
2222
|
+
if (step.state === "completed") {
|
|
2223
|
+
suffix = " (conclu\xEDdo)";
|
|
2224
|
+
} else if (step.state === "current") {
|
|
2225
|
+
suffix = " (atual)";
|
|
2226
|
+
}
|
|
2227
|
+
return `${step.label}${suffix}`;
|
|
2228
|
+
};
|
|
2229
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
2230
|
+
"div",
|
|
2231
|
+
{
|
|
2232
|
+
className: `
|
|
2233
|
+
flex flex-col justify-center items-center pb-2 gap-2
|
|
2234
|
+
${sizeClasses.stepWidth} ${sizeClasses.stepHeight}
|
|
2235
|
+
flex-none flex-grow
|
|
2236
|
+
${className}
|
|
2237
|
+
sm:max-w-[100px] md:max-w-[120px] lg:max-w-none xl:max-w-none
|
|
2238
|
+
sm:min-h-[40px] md:min-h-[45px] lg:min-h-none
|
|
2239
|
+
overflow-visible
|
|
2240
|
+
`,
|
|
2241
|
+
children: [
|
|
2242
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2243
|
+
"div",
|
|
2244
|
+
{
|
|
2245
|
+
className: `
|
|
2246
|
+
w-full ${sizeClasses.progressBar} ${stateClasses.progressBar}
|
|
2247
|
+
rounded-sm flex-none
|
|
2248
|
+
`
|
|
2249
|
+
}
|
|
2250
|
+
),
|
|
2251
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
2252
|
+
"div",
|
|
2253
|
+
{
|
|
2254
|
+
className: `
|
|
2255
|
+
flex flex-col sm:flex-row items-center
|
|
2256
|
+
gap-1 sm:gap-2 w-full sm:w-auto
|
|
2257
|
+
h-auto sm:h-5 flex-none
|
|
2258
|
+
overflow-visible
|
|
2259
|
+
`,
|
|
2260
|
+
children: [
|
|
2261
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2262
|
+
"div",
|
|
2263
|
+
{
|
|
2264
|
+
className: `
|
|
2265
|
+
${sizeClasses.indicator} ${stateClasses.indicator}
|
|
2266
|
+
rounded-full flex items-center justify-center relative
|
|
2267
|
+
flex-none transition-all duration-300 ease-out
|
|
2268
|
+
w-4 h-4 sm:w-5 sm:h-5 md:w-5 md:h-5 lg:w-6 lg:h-6
|
|
2269
|
+
`,
|
|
2270
|
+
"aria-label": getAriaLabel(),
|
|
2271
|
+
children: isCompleted ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2272
|
+
import_phosphor_react7.Check,
|
|
2273
|
+
{
|
|
2274
|
+
weight: "bold",
|
|
2275
|
+
className: `
|
|
2276
|
+
${stateClasses.indicatorText}
|
|
2277
|
+
w-2.5 h-2.5 sm:w-3 sm:h-3 md:w-3 md:h-3 lg:w-3.5 lg:h-3.5
|
|
2278
|
+
`
|
|
2279
|
+
}
|
|
2280
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2281
|
+
Text_default,
|
|
2282
|
+
{
|
|
2283
|
+
size: sizeClasses.indicatorTextSize,
|
|
2284
|
+
weight: "medium",
|
|
2285
|
+
color: "",
|
|
2286
|
+
className: `${stateClasses.indicatorText} leading-none text-2xs sm:text-xs`,
|
|
2287
|
+
children: stepNumber
|
|
2288
|
+
}
|
|
2289
|
+
)
|
|
2290
|
+
}
|
|
2291
|
+
),
|
|
2292
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2293
|
+
Text_default,
|
|
2294
|
+
{
|
|
2295
|
+
size: sizeClasses.labelTextSize,
|
|
2296
|
+
weight: "medium",
|
|
2297
|
+
color: "",
|
|
2298
|
+
className: `
|
|
2299
|
+
${stateClasses.label} leading-tight flex-none
|
|
2300
|
+
text-center sm:text-left break-words
|
|
2301
|
+
px-1 sm:px-0 max-w-full
|
|
2302
|
+
text-2xs sm:text-xs md:text-xs lg:text-sm
|
|
2303
|
+
whitespace-normal
|
|
2304
|
+
`,
|
|
2305
|
+
children: step.label
|
|
2306
|
+
}
|
|
2307
|
+
)
|
|
2308
|
+
]
|
|
2309
|
+
}
|
|
2310
|
+
)
|
|
2311
|
+
]
|
|
2312
|
+
}
|
|
2313
|
+
);
|
|
2314
|
+
};
|
|
2315
|
+
var calculateStepStates = (steps, currentStep) => {
|
|
2316
|
+
return steps.map((step, index) => {
|
|
2317
|
+
let stepState;
|
|
2318
|
+
if (index < currentStep) {
|
|
2319
|
+
stepState = "completed";
|
|
2320
|
+
} else if (index === currentStep) {
|
|
2321
|
+
stepState = "current";
|
|
2322
|
+
} else {
|
|
2323
|
+
stepState = "pending";
|
|
2324
|
+
}
|
|
2325
|
+
return {
|
|
2326
|
+
...step,
|
|
2327
|
+
state: stepState
|
|
2328
|
+
};
|
|
2329
|
+
});
|
|
2330
|
+
};
|
|
2331
|
+
var getProgressText = (currentStep, totalSteps, customText) => {
|
|
2332
|
+
if (customText) return customText;
|
|
2333
|
+
return `Etapa ${currentStep + 1} de ${totalSteps}`;
|
|
2334
|
+
};
|
|
2335
|
+
var Stepper = ({
|
|
2336
|
+
steps: initialSteps,
|
|
2337
|
+
size = "medium",
|
|
2338
|
+
currentStep,
|
|
2339
|
+
className = "",
|
|
2340
|
+
stepClassName = "",
|
|
2341
|
+
showProgress = false,
|
|
2342
|
+
progressText,
|
|
2343
|
+
responsive = true
|
|
2344
|
+
}) => {
|
|
2345
|
+
const sizeClasses = SIZE_CLASSES9[size];
|
|
2346
|
+
const steps = currentStep !== void 0 ? calculateStepStates(initialSteps, currentStep) : initialSteps;
|
|
2347
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
2348
|
+
"fieldset",
|
|
2349
|
+
{
|
|
2350
|
+
className: `flex flex-col gap-4 sm:gap-5 md:gap-6 ${className} border-0 p-0 m-0`,
|
|
2351
|
+
children: [
|
|
2352
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("legend", { className: "absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0", children: "Stepper de formul\xE1rio" }),
|
|
2353
|
+
showProgress && currentStep !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2354
|
+
Text_default,
|
|
2355
|
+
{
|
|
2356
|
+
size: "sm",
|
|
2357
|
+
weight: "medium",
|
|
2358
|
+
className: "text-text-600 text-center sm:text-left text-xs sm:text-sm",
|
|
2359
|
+
children: getProgressText(currentStep, steps.length, progressText)
|
|
2360
|
+
}
|
|
2361
|
+
),
|
|
2362
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2363
|
+
"div",
|
|
2364
|
+
{
|
|
2365
|
+
className: `
|
|
2366
|
+
flex items-center
|
|
2367
|
+
${sizeClasses.container}
|
|
2368
|
+
${responsive ? "flex-row overflow-x-auto overflow-y-hidden scrollbar-hide justify-start sm:justify-center md:justify-center lg:justify-center" : "flex-row justify-center"}
|
|
2369
|
+
px-2 sm:px-4 md:px-6 lg:px-0
|
|
2370
|
+
max-w-full min-w-0
|
|
2371
|
+
gap-2 sm:gap-3 md:gap-4 lg:gap-4
|
|
2372
|
+
`,
|
|
2373
|
+
role: "tablist",
|
|
2374
|
+
"aria-label": "Progress steps",
|
|
2375
|
+
children: steps.map((step, index) => {
|
|
2376
|
+
const stateClasses = STATE_CLASSES6[step.state];
|
|
2377
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2378
|
+
Step,
|
|
2379
|
+
{
|
|
2380
|
+
step,
|
|
2381
|
+
index,
|
|
2382
|
+
size,
|
|
2383
|
+
sizeClasses,
|
|
2384
|
+
stateClasses,
|
|
2385
|
+
isLast: index === steps.length - 1,
|
|
2386
|
+
className: stepClassName
|
|
2387
|
+
},
|
|
2388
|
+
step.id
|
|
2389
|
+
);
|
|
2390
|
+
})
|
|
2391
|
+
}
|
|
2392
|
+
)
|
|
2393
|
+
]
|
|
2394
|
+
}
|
|
2395
|
+
);
|
|
2396
|
+
};
|
|
2397
|
+
var Stepper_default = Stepper;
|
|
2398
|
+
|
|
2091
2399
|
// src/components/Calendar/Calendar.tsx
|
|
2092
2400
|
var import_react9 = require("react");
|
|
2093
|
-
var
|
|
2401
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
2094
2402
|
var WEEK_DAYS = ["SEG", "TER", "QUA", "QUI", "SEX", "S\xC1B", "DOM"];
|
|
2095
2403
|
var WEEK_DAYS_SHORT = ["S", "T", "Q", "Q", "S", "S", "D"];
|
|
2096
2404
|
var MONTH_NAMES = [
|
|
@@ -2113,15 +2421,15 @@ var MonthYearPicker = ({
|
|
|
2113
2421
|
currentDate,
|
|
2114
2422
|
onYearChange,
|
|
2115
2423
|
onMonthChange
|
|
2116
|
-
}) => /* @__PURE__ */ (0,
|
|
2424
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
2117
2425
|
"div",
|
|
2118
2426
|
{
|
|
2119
2427
|
ref: monthPickerRef,
|
|
2120
2428
|
className: "absolute top-full left-0 z-50 mt-1 bg-white rounded-lg shadow-lg border border-border-200 p-4 min-w-[280px]",
|
|
2121
2429
|
children: [
|
|
2122
|
-
/* @__PURE__ */ (0,
|
|
2123
|
-
/* @__PURE__ */ (0,
|
|
2124
|
-
/* @__PURE__ */ (0,
|
|
2430
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mb-4", children: [
|
|
2431
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h3", { className: "text-sm font-medium text-text-700 mb-2", children: "Selecionar Ano" }),
|
|
2432
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-4 gap-1 max-h-32 overflow-y-auto", children: availableYears.map((year) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2125
2433
|
"button",
|
|
2126
2434
|
{
|
|
2127
2435
|
onClick: () => onYearChange(year),
|
|
@@ -2134,9 +2442,9 @@ var MonthYearPicker = ({
|
|
|
2134
2442
|
year
|
|
2135
2443
|
)) })
|
|
2136
2444
|
] }),
|
|
2137
|
-
/* @__PURE__ */ (0,
|
|
2138
|
-
/* @__PURE__ */ (0,
|
|
2139
|
-
/* @__PURE__ */ (0,
|
|
2445
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
|
|
2446
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h3", { className: "text-sm font-medium text-text-700 mb-2", children: "Selecionar M\xEAs" }),
|
|
2447
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-3 gap-1", children: MONTH_NAMES.map((month, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2140
2448
|
"button",
|
|
2141
2449
|
{
|
|
2142
2450
|
onClick: () => onMonthChange(index, currentDate.getFullYear()),
|
|
@@ -2159,7 +2467,7 @@ var getDayStyles = (day, variant, showActivities) => {
|
|
|
2159
2467
|
dayStyle = "bg-primary-800";
|
|
2160
2468
|
textStyle = "text-white";
|
|
2161
2469
|
} else if (day.isToday) {
|
|
2162
|
-
textStyle = "text-
|
|
2470
|
+
textStyle = "text-primary-800";
|
|
2163
2471
|
} else if (variant === "navigation" && showActivities && day.activities?.length) {
|
|
2164
2472
|
const primaryActivity = day.activities[0];
|
|
2165
2473
|
if (primaryActivity.status === "near-deadline") {
|
|
@@ -2268,28 +2576,28 @@ var Calendar = ({
|
|
|
2268
2576
|
onDateSelect?.(day.date);
|
|
2269
2577
|
};
|
|
2270
2578
|
if (variant === "navigation") {
|
|
2271
|
-
return /* @__PURE__ */ (0,
|
|
2272
|
-
/* @__PURE__ */ (0,
|
|
2273
|
-
/* @__PURE__ */ (0,
|
|
2274
|
-
/* @__PURE__ */ (0,
|
|
2579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `bg-background rounded-xl p-3 ${className}`, children: [
|
|
2580
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center justify-between mb-4 px-6", children: [
|
|
2581
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative", ref: monthPickerContainerRef, children: [
|
|
2582
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
2275
2583
|
"button",
|
|
2276
2584
|
{
|
|
2277
2585
|
onClick: toggleMonthPicker,
|
|
2278
2586
|
className: "flex items-center gap-1 hover:bg-background-100 rounded px-2 py-1 transition-colors",
|
|
2279
2587
|
children: [
|
|
2280
|
-
/* @__PURE__ */ (0,
|
|
2588
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "text-sm font-medium text-text-600", children: [
|
|
2281
2589
|
MONTH_NAMES[currentDate.getMonth()],
|
|
2282
2590
|
" ",
|
|
2283
2591
|
currentDate.getFullYear()
|
|
2284
2592
|
] }),
|
|
2285
|
-
/* @__PURE__ */ (0,
|
|
2593
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2286
2594
|
"svg",
|
|
2287
2595
|
{
|
|
2288
2596
|
className: `w-4 h-4 text-primary-950 transition-transform ${isMonthPickerOpen ? "rotate-180" : ""}`,
|
|
2289
2597
|
fill: "none",
|
|
2290
2598
|
stroke: "currentColor",
|
|
2291
2599
|
viewBox: "0 0 24 24",
|
|
2292
|
-
children: /* @__PURE__ */ (0,
|
|
2600
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2293
2601
|
"path",
|
|
2294
2602
|
{
|
|
2295
2603
|
strokeLinecap: "round",
|
|
@@ -2303,7 +2611,7 @@ var Calendar = ({
|
|
|
2303
2611
|
]
|
|
2304
2612
|
}
|
|
2305
2613
|
),
|
|
2306
|
-
isMonthPickerOpen && /* @__PURE__ */ (0,
|
|
2614
|
+
isMonthPickerOpen && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2307
2615
|
MonthYearPicker,
|
|
2308
2616
|
{
|
|
2309
2617
|
monthPickerRef,
|
|
@@ -2314,21 +2622,21 @@ var Calendar = ({
|
|
|
2314
2622
|
}
|
|
2315
2623
|
)
|
|
2316
2624
|
] }),
|
|
2317
|
-
/* @__PURE__ */ (0,
|
|
2318
|
-
/* @__PURE__ */ (0,
|
|
2625
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-10", children: [
|
|
2626
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2319
2627
|
"button",
|
|
2320
2628
|
{
|
|
2321
2629
|
onClick: goToPreviousMonth,
|
|
2322
2630
|
className: "p-1 rounded hover:bg-background-100 transition-colors",
|
|
2323
2631
|
"aria-label": "M\xEAs anterior",
|
|
2324
|
-
children: /* @__PURE__ */ (0,
|
|
2632
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2325
2633
|
"svg",
|
|
2326
2634
|
{
|
|
2327
2635
|
className: "w-6 h-6 text-primary-950",
|
|
2328
2636
|
fill: "none",
|
|
2329
2637
|
stroke: "currentColor",
|
|
2330
2638
|
viewBox: "0 0 24 24",
|
|
2331
|
-
children: /* @__PURE__ */ (0,
|
|
2639
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2332
2640
|
"path",
|
|
2333
2641
|
{
|
|
2334
2642
|
strokeLinecap: "round",
|
|
@@ -2341,20 +2649,20 @@ var Calendar = ({
|
|
|
2341
2649
|
)
|
|
2342
2650
|
}
|
|
2343
2651
|
),
|
|
2344
|
-
/* @__PURE__ */ (0,
|
|
2652
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2345
2653
|
"button",
|
|
2346
2654
|
{
|
|
2347
2655
|
onClick: goToNextMonth,
|
|
2348
2656
|
className: "p-1 rounded hover:bg-background-100 transition-colors",
|
|
2349
2657
|
"aria-label": "Pr\xF3ximo m\xEAs",
|
|
2350
|
-
children: /* @__PURE__ */ (0,
|
|
2658
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2351
2659
|
"svg",
|
|
2352
2660
|
{
|
|
2353
2661
|
className: "w-6 h-6 text-primary-950",
|
|
2354
2662
|
fill: "none",
|
|
2355
2663
|
stroke: "currentColor",
|
|
2356
2664
|
viewBox: "0 0 24 24",
|
|
2357
|
-
children: /* @__PURE__ */ (0,
|
|
2665
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2358
2666
|
"path",
|
|
2359
2667
|
{
|
|
2360
2668
|
strokeLinecap: "round",
|
|
@@ -2369,7 +2677,7 @@ var Calendar = ({
|
|
|
2369
2677
|
)
|
|
2370
2678
|
] })
|
|
2371
2679
|
] }),
|
|
2372
|
-
/* @__PURE__ */ (0,
|
|
2680
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-7 gap-1 mb-2", children: WEEK_DAYS_SHORT.map((day, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2373
2681
|
"div",
|
|
2374
2682
|
{
|
|
2375
2683
|
className: "h-9 flex items-center justify-center text-xs font-normal text-text-600",
|
|
@@ -2377,13 +2685,13 @@ var Calendar = ({
|
|
|
2377
2685
|
},
|
|
2378
2686
|
`${day}-${index}`
|
|
2379
2687
|
)) }),
|
|
2380
|
-
/* @__PURE__ */ (0,
|
|
2688
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-7 gap-1", children: calendarData.map((day) => {
|
|
2381
2689
|
if (!day.isCurrentMonth) {
|
|
2382
|
-
return /* @__PURE__ */ (0,
|
|
2690
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2383
2691
|
"div",
|
|
2384
2692
|
{
|
|
2385
2693
|
className: "flex items-center justify-center",
|
|
2386
|
-
children: /* @__PURE__ */ (0,
|
|
2694
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-9 h-9" })
|
|
2387
2695
|
},
|
|
2388
2696
|
day.date.getTime()
|
|
2389
2697
|
);
|
|
@@ -2395,31 +2703,31 @@ var Calendar = ({
|
|
|
2395
2703
|
);
|
|
2396
2704
|
let spanClass = "";
|
|
2397
2705
|
if (day.isSelected && day.isToday) {
|
|
2398
|
-
spanClass = "h-6 w-6 rounded-full bg-
|
|
2706
|
+
spanClass = "h-6 w-6 rounded-full bg-primary-800 text-text";
|
|
2399
2707
|
} else if (day.isSelected) {
|
|
2400
2708
|
spanClass = "h-6 w-6 rounded-full bg-primary-950 text-text";
|
|
2401
2709
|
}
|
|
2402
|
-
return /* @__PURE__ */ (0,
|
|
2710
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2403
2711
|
"div",
|
|
2404
2712
|
{
|
|
2405
2713
|
className: "flex items-center justify-center",
|
|
2406
|
-
children: /* @__PURE__ */ (0,
|
|
2714
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2407
2715
|
"button",
|
|
2408
2716
|
{
|
|
2409
2717
|
className: `
|
|
2410
|
-
w-9 h-9
|
|
2411
|
-
flex items-center justify-center
|
|
2412
|
-
text-md font-normal
|
|
2413
|
-
cursor-pointer
|
|
2718
|
+
w-9 h-9
|
|
2719
|
+
flex items-center justify-center
|
|
2720
|
+
text-md font-normal
|
|
2721
|
+
cursor-pointer
|
|
2414
2722
|
rounded-full
|
|
2415
|
-
${dayStyle}
|
|
2723
|
+
${dayStyle}
|
|
2416
2724
|
${textStyle}
|
|
2417
2725
|
`,
|
|
2418
2726
|
onClick: () => handleDateSelect(day),
|
|
2419
2727
|
"aria-label": `${day.date.getDate()} de ${MONTH_NAMES[day.date.getMonth()]}`,
|
|
2420
2728
|
"aria-current": day.isToday ? "date" : void 0,
|
|
2421
2729
|
tabIndex: 0,
|
|
2422
|
-
children: /* @__PURE__ */ (0,
|
|
2730
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: spanClass, children: day.date.getDate() })
|
|
2423
2731
|
}
|
|
2424
2732
|
)
|
|
2425
2733
|
},
|
|
@@ -2428,28 +2736,28 @@ var Calendar = ({
|
|
|
2428
2736
|
}) })
|
|
2429
2737
|
] });
|
|
2430
2738
|
}
|
|
2431
|
-
return /* @__PURE__ */ (0,
|
|
2432
|
-
/* @__PURE__ */ (0,
|
|
2433
|
-
/* @__PURE__ */ (0,
|
|
2434
|
-
/* @__PURE__ */ (0,
|
|
2739
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `bg-background rounded-xl p-4 ${className}`, children: [
|
|
2740
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center justify-between mb-3.5", children: [
|
|
2741
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative", ref: monthPickerContainerRef, children: [
|
|
2742
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
2435
2743
|
"button",
|
|
2436
2744
|
{
|
|
2437
2745
|
onClick: toggleMonthPicker,
|
|
2438
2746
|
className: "flex items-center gap-2 hover:bg-background-100 rounded px-2 py-1 transition-colors",
|
|
2439
2747
|
children: [
|
|
2440
|
-
/* @__PURE__ */ (0,
|
|
2748
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("h2", { className: "text-lg font-semibold text-text-950", children: [
|
|
2441
2749
|
MONTH_NAMES[currentDate.getMonth()],
|
|
2442
2750
|
" ",
|
|
2443
2751
|
currentDate.getFullYear()
|
|
2444
2752
|
] }),
|
|
2445
|
-
/* @__PURE__ */ (0,
|
|
2753
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2446
2754
|
"svg",
|
|
2447
2755
|
{
|
|
2448
2756
|
className: `w-4 h-4 text-text-400 transition-transform ${isMonthPickerOpen ? "rotate-180" : ""}`,
|
|
2449
2757
|
fill: "none",
|
|
2450
2758
|
stroke: "currentColor",
|
|
2451
2759
|
viewBox: "0 0 24 24",
|
|
2452
|
-
children: /* @__PURE__ */ (0,
|
|
2760
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2453
2761
|
"path",
|
|
2454
2762
|
{
|
|
2455
2763
|
strokeLinecap: "round",
|
|
@@ -2463,7 +2771,7 @@ var Calendar = ({
|
|
|
2463
2771
|
]
|
|
2464
2772
|
}
|
|
2465
2773
|
),
|
|
2466
|
-
isMonthPickerOpen && /* @__PURE__ */ (0,
|
|
2774
|
+
isMonthPickerOpen && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2467
2775
|
MonthYearPicker,
|
|
2468
2776
|
{
|
|
2469
2777
|
monthPickerRef,
|
|
@@ -2474,21 +2782,21 @@ var Calendar = ({
|
|
|
2474
2782
|
}
|
|
2475
2783
|
)
|
|
2476
2784
|
] }),
|
|
2477
|
-
/* @__PURE__ */ (0,
|
|
2478
|
-
/* @__PURE__ */ (0,
|
|
2785
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
2786
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2479
2787
|
"button",
|
|
2480
2788
|
{
|
|
2481
2789
|
onClick: goToPreviousMonth,
|
|
2482
2790
|
className: "p-1 rounded-md hover:bg-background-100 transition-colors",
|
|
2483
2791
|
"aria-label": "M\xEAs anterior",
|
|
2484
|
-
children: /* @__PURE__ */ (0,
|
|
2792
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2485
2793
|
"svg",
|
|
2486
2794
|
{
|
|
2487
2795
|
className: "w-6 h-6 text-primary-950",
|
|
2488
2796
|
fill: "none",
|
|
2489
2797
|
stroke: "currentColor",
|
|
2490
2798
|
viewBox: "0 0 24 24",
|
|
2491
|
-
children: /* @__PURE__ */ (0,
|
|
2799
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2492
2800
|
"path",
|
|
2493
2801
|
{
|
|
2494
2802
|
strokeLinecap: "round",
|
|
@@ -2501,20 +2809,20 @@ var Calendar = ({
|
|
|
2501
2809
|
)
|
|
2502
2810
|
}
|
|
2503
2811
|
),
|
|
2504
|
-
/* @__PURE__ */ (0,
|
|
2812
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2505
2813
|
"button",
|
|
2506
2814
|
{
|
|
2507
2815
|
onClick: goToNextMonth,
|
|
2508
2816
|
className: "p-1 rounded-md hover:bg-background-100 transition-colors",
|
|
2509
2817
|
"aria-label": "Pr\xF3ximo m\xEAs",
|
|
2510
|
-
children: /* @__PURE__ */ (0,
|
|
2818
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2511
2819
|
"svg",
|
|
2512
2820
|
{
|
|
2513
2821
|
className: "w-6 h-6 text-primary-950",
|
|
2514
2822
|
fill: "none",
|
|
2515
2823
|
stroke: "currentColor",
|
|
2516
2824
|
viewBox: "0 0 24 24",
|
|
2517
|
-
children: /* @__PURE__ */ (0,
|
|
2825
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2518
2826
|
"path",
|
|
2519
2827
|
{
|
|
2520
2828
|
strokeLinecap: "round",
|
|
@@ -2529,7 +2837,7 @@ var Calendar = ({
|
|
|
2529
2837
|
)
|
|
2530
2838
|
] })
|
|
2531
2839
|
] }),
|
|
2532
|
-
/* @__PURE__ */ (0,
|
|
2840
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-7 gap-1 mb-2", children: WEEK_DAYS.map((day) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2533
2841
|
"div",
|
|
2534
2842
|
{
|
|
2535
2843
|
className: "h-4 flex items-center justify-center text-xs font-semibold text-text-500",
|
|
@@ -2537,13 +2845,13 @@ var Calendar = ({
|
|
|
2537
2845
|
},
|
|
2538
2846
|
day
|
|
2539
2847
|
)) }),
|
|
2540
|
-
/* @__PURE__ */ (0,
|
|
2848
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-7 gap-1", children: calendarData.map((day) => {
|
|
2541
2849
|
if (!day.isCurrentMonth) {
|
|
2542
|
-
return /* @__PURE__ */ (0,
|
|
2850
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2543
2851
|
"div",
|
|
2544
2852
|
{
|
|
2545
2853
|
className: "flex items-center justify-center",
|
|
2546
|
-
children: /* @__PURE__ */ (0,
|
|
2854
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-10 h-10" })
|
|
2547
2855
|
},
|
|
2548
2856
|
day.date.getTime()
|
|
2549
2857
|
);
|
|
@@ -2553,21 +2861,21 @@ var Calendar = ({
|
|
|
2553
2861
|
variant,
|
|
2554
2862
|
showActivities
|
|
2555
2863
|
);
|
|
2556
|
-
return /* @__PURE__ */ (0,
|
|
2864
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2557
2865
|
"div",
|
|
2558
2866
|
{
|
|
2559
2867
|
className: "flex items-center justify-center",
|
|
2560
|
-
children: /* @__PURE__ */ (0,
|
|
2868
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2561
2869
|
"button",
|
|
2562
2870
|
{
|
|
2563
2871
|
className: `
|
|
2564
|
-
w-10 h-10
|
|
2565
|
-
flex items-center justify-center
|
|
2566
|
-
text-xl font-normal
|
|
2567
|
-
cursor-pointer
|
|
2872
|
+
w-10 h-10
|
|
2873
|
+
flex items-center justify-center
|
|
2874
|
+
text-xl font-normal
|
|
2875
|
+
cursor-pointer
|
|
2568
2876
|
rounded-full
|
|
2569
2877
|
focus:outline-none focus:ring-2 focus:ring-primary-600 focus:ring-offset-1
|
|
2570
|
-
${dayStyle}
|
|
2878
|
+
${dayStyle}
|
|
2571
2879
|
${textStyle}
|
|
2572
2880
|
`,
|
|
2573
2881
|
onClick: () => handleDateSelect(day),
|
|
@@ -2585,11 +2893,107 @@ var Calendar = ({
|
|
|
2585
2893
|
};
|
|
2586
2894
|
var Calendar_default = Calendar;
|
|
2587
2895
|
|
|
2588
|
-
// src/components/
|
|
2589
|
-
var import_phosphor_react7 = require("phosphor-react");
|
|
2896
|
+
// src/components/Modal/Modal.tsx
|
|
2590
2897
|
var import_react10 = require("react");
|
|
2898
|
+
var import_phosphor_react8 = require("phosphor-react");
|
|
2899
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
2900
|
+
var SIZE_CLASSES10 = {
|
|
2901
|
+
xs: "max-w-[360px]",
|
|
2902
|
+
sm: "max-w-[420px]",
|
|
2903
|
+
md: "max-w-[510px]",
|
|
2904
|
+
lg: "max-w-[640px]",
|
|
2905
|
+
xl: "max-w-[970px]"
|
|
2906
|
+
};
|
|
2907
|
+
var Modal = ({
|
|
2908
|
+
isOpen,
|
|
2909
|
+
onClose,
|
|
2910
|
+
title,
|
|
2911
|
+
children,
|
|
2912
|
+
size = "md",
|
|
2913
|
+
className = "",
|
|
2914
|
+
closeOnBackdropClick = true,
|
|
2915
|
+
closeOnEscape = true,
|
|
2916
|
+
footer,
|
|
2917
|
+
hideCloseButton = false
|
|
2918
|
+
}) => {
|
|
2919
|
+
(0, import_react10.useEffect)(() => {
|
|
2920
|
+
if (!isOpen || !closeOnEscape) return;
|
|
2921
|
+
const handleEscape = (event) => {
|
|
2922
|
+
if (event.key === "Escape") {
|
|
2923
|
+
onClose();
|
|
2924
|
+
}
|
|
2925
|
+
};
|
|
2926
|
+
document.addEventListener("keydown", handleEscape);
|
|
2927
|
+
return () => document.removeEventListener("keydown", handleEscape);
|
|
2928
|
+
}, [isOpen, closeOnEscape, onClose]);
|
|
2929
|
+
(0, import_react10.useEffect)(() => {
|
|
2930
|
+
const originalOverflow = document.body.style.overflow;
|
|
2931
|
+
if (isOpen) {
|
|
2932
|
+
document.body.style.overflow = "hidden";
|
|
2933
|
+
} else {
|
|
2934
|
+
document.body.style.overflow = originalOverflow;
|
|
2935
|
+
}
|
|
2936
|
+
return () => {
|
|
2937
|
+
document.body.style.overflow = originalOverflow;
|
|
2938
|
+
};
|
|
2939
|
+
}, [isOpen]);
|
|
2940
|
+
const handleBackdropClick = (event) => {
|
|
2941
|
+
if (closeOnBackdropClick && event.target === event.currentTarget) {
|
|
2942
|
+
onClose();
|
|
2943
|
+
}
|
|
2944
|
+
};
|
|
2945
|
+
const handleBackdropKeyDown = (event) => {
|
|
2946
|
+
if (closeOnBackdropClick && (event.key === "Enter" || event.key === " ")) {
|
|
2947
|
+
onClose();
|
|
2948
|
+
}
|
|
2949
|
+
};
|
|
2950
|
+
if (!isOpen) return null;
|
|
2951
|
+
const sizeClasses = SIZE_CLASSES10[size];
|
|
2952
|
+
const baseClasses = "bg-background rounded-3xl shadow-hard-shadow-2 border border-border-100 w-full mx-4";
|
|
2953
|
+
const modalClasses = `${baseClasses} ${sizeClasses} ${className}`;
|
|
2954
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2955
|
+
"div",
|
|
2956
|
+
{
|
|
2957
|
+
className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-xs",
|
|
2958
|
+
onClick: handleBackdropClick,
|
|
2959
|
+
onKeyDown: handleBackdropKeyDown,
|
|
2960
|
+
role: "none",
|
|
2961
|
+
"aria-hidden": "true",
|
|
2962
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
|
|
2963
|
+
"div",
|
|
2964
|
+
{
|
|
2965
|
+
className: modalClasses,
|
|
2966
|
+
role: "dialog",
|
|
2967
|
+
"aria-modal": "true",
|
|
2968
|
+
"aria-labelledby": "modal-title",
|
|
2969
|
+
children: [
|
|
2970
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center justify-between px-6 py-6", children: [
|
|
2971
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h2", { id: "modal-title", className: "text-lg font-semibold text-text-950", children: title }),
|
|
2972
|
+
!hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2973
|
+
"button",
|
|
2974
|
+
{
|
|
2975
|
+
onClick: onClose,
|
|
2976
|
+
className: "p-1 text-text-500 hover:text-text-700 hover:bg-background-50 rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-indicator-info focus:ring-offset-2",
|
|
2977
|
+
"aria-label": "Fechar modal",
|
|
2978
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_phosphor_react8.X, { size: 18 })
|
|
2979
|
+
}
|
|
2980
|
+
)
|
|
2981
|
+
] }),
|
|
2982
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "px-6 pb-6", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "text-text-500 font-normal text-sm leading-6", children }) }),
|
|
2983
|
+
footer && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex justify-end gap-3 px-6 pb-6", children: footer })
|
|
2984
|
+
]
|
|
2985
|
+
}
|
|
2986
|
+
)
|
|
2987
|
+
}
|
|
2988
|
+
);
|
|
2989
|
+
};
|
|
2990
|
+
var Modal_default = Modal;
|
|
2991
|
+
|
|
2992
|
+
// src/components/DropdownMenu/DropdownMenu.tsx
|
|
2993
|
+
var import_phosphor_react9 = require("phosphor-react");
|
|
2994
|
+
var import_react11 = require("react");
|
|
2591
2995
|
var import_zustand2 = require("zustand");
|
|
2592
|
-
var
|
|
2996
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
2593
2997
|
function createDropdownStore() {
|
|
2594
2998
|
return (0, import_zustand2.create)((set) => ({
|
|
2595
2999
|
open: false,
|
|
@@ -2605,8 +3009,8 @@ var useDropdownStore = (externalStore) => {
|
|
|
2605
3009
|
return externalStore;
|
|
2606
3010
|
};
|
|
2607
3011
|
var injectStore = (children, store) => {
|
|
2608
|
-
return
|
|
2609
|
-
if ((0,
|
|
3012
|
+
return import_react11.Children.map(children, (child) => {
|
|
3013
|
+
if ((0, import_react11.isValidElement)(child)) {
|
|
2610
3014
|
const typedChild = child;
|
|
2611
3015
|
const newProps = {
|
|
2612
3016
|
store
|
|
@@ -2614,23 +3018,24 @@ var injectStore = (children, store) => {
|
|
|
2614
3018
|
if (typedChild.props.children) {
|
|
2615
3019
|
newProps.children = injectStore(typedChild.props.children, store);
|
|
2616
3020
|
}
|
|
2617
|
-
return (0,
|
|
3021
|
+
return (0, import_react11.cloneElement)(typedChild, newProps);
|
|
2618
3022
|
}
|
|
2619
3023
|
return child;
|
|
2620
3024
|
});
|
|
2621
3025
|
};
|
|
2622
|
-
var DropdownMenu = ({
|
|
2623
|
-
|
|
3026
|
+
var DropdownMenu = ({
|
|
3027
|
+
children,
|
|
3028
|
+
open: propOpen,
|
|
3029
|
+
onOpenChange
|
|
3030
|
+
}) => {
|
|
3031
|
+
const storeRef = (0, import_react11.useRef)(null);
|
|
2624
3032
|
storeRef.current ??= createDropdownStore();
|
|
2625
3033
|
const store = storeRef.current;
|
|
2626
|
-
const
|
|
2627
|
-
const uncontrolledOpen = (0, import_zustand2.useStore)(store, (s) => s.open);
|
|
2628
|
-
const currentOpen = isControlled ? open : uncontrolledOpen;
|
|
3034
|
+
const { open, setOpen: storeSetOpen } = (0, import_zustand2.useStore)(store, (s) => s);
|
|
2629
3035
|
const setOpen = (newOpen) => {
|
|
2630
|
-
|
|
2631
|
-
if (!isControlled) store.setState({ open: newOpen });
|
|
3036
|
+
storeSetOpen(newOpen);
|
|
2632
3037
|
};
|
|
2633
|
-
const menuRef = (0,
|
|
3038
|
+
const menuRef = (0, import_react11.useRef)(null);
|
|
2634
3039
|
const handleArrowDownOrArrowUp = (event) => {
|
|
2635
3040
|
const menuContent = menuRef.current?.querySelector('[role="menu"]');
|
|
2636
3041
|
if (menuContent) {
|
|
@@ -2664,9 +3069,8 @@ var DropdownMenu = ({ children, open, onOpenChange }) => {
|
|
|
2664
3069
|
setOpen(false);
|
|
2665
3070
|
}
|
|
2666
3071
|
};
|
|
2667
|
-
(0,
|
|
2668
|
-
|
|
2669
|
-
if (currentOpen) {
|
|
3072
|
+
(0, import_react11.useEffect)(() => {
|
|
3073
|
+
if (open) {
|
|
2670
3074
|
document.addEventListener("mousedown", handleClickOutside);
|
|
2671
3075
|
document.addEventListener("keydown", handleDownkey);
|
|
2672
3076
|
}
|
|
@@ -2674,13 +3078,17 @@ var DropdownMenu = ({ children, open, onOpenChange }) => {
|
|
|
2674
3078
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
2675
3079
|
document.removeEventListener("keydown", handleDownkey);
|
|
2676
3080
|
};
|
|
2677
|
-
}, [
|
|
2678
|
-
(0,
|
|
2679
|
-
|
|
2680
|
-
|
|
3081
|
+
}, [open]);
|
|
3082
|
+
(0, import_react11.useEffect)(() => {
|
|
3083
|
+
setOpen(open);
|
|
3084
|
+
onOpenChange?.(open);
|
|
3085
|
+
}, [open, onOpenChange]);
|
|
3086
|
+
(0, import_react11.useEffect)(() => {
|
|
3087
|
+
if (propOpen) {
|
|
3088
|
+
setOpen(propOpen);
|
|
2681
3089
|
}
|
|
2682
|
-
}, []);
|
|
2683
|
-
return /* @__PURE__ */ (0,
|
|
3090
|
+
}, [propOpen]);
|
|
3091
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "relative", ref: menuRef, children: injectStore(children, store) });
|
|
2684
3092
|
};
|
|
2685
3093
|
var DropdownMenuTrigger = ({
|
|
2686
3094
|
className,
|
|
@@ -2692,7 +3100,7 @@ var DropdownMenuTrigger = ({
|
|
|
2692
3100
|
const store = useDropdownStore(externalStore);
|
|
2693
3101
|
const open = (0, import_zustand2.useStore)(store, (s) => s.open);
|
|
2694
3102
|
const toggleOpen = () => store.setState({ open: !open });
|
|
2695
|
-
return /* @__PURE__ */ (0,
|
|
3103
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2696
3104
|
Button_default,
|
|
2697
3105
|
{
|
|
2698
3106
|
variant: "outline",
|
|
@@ -2728,8 +3136,8 @@ var MENUCONTENT_VARIANT_CLASSES = {
|
|
|
2728
3136
|
menu: "p-1",
|
|
2729
3137
|
profile: "p-6"
|
|
2730
3138
|
};
|
|
2731
|
-
var MenuLabel = (0,
|
|
2732
|
-
return /* @__PURE__ */ (0,
|
|
3139
|
+
var MenuLabel = (0, import_react11.forwardRef)(({ className, inset, store: _store, ...props }, ref) => {
|
|
3140
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2733
3141
|
"div",
|
|
2734
3142
|
{
|
|
2735
3143
|
ref,
|
|
@@ -2739,7 +3147,7 @@ var MenuLabel = (0, import_react10.forwardRef)(({ className, inset, store: _stor
|
|
|
2739
3147
|
);
|
|
2740
3148
|
});
|
|
2741
3149
|
MenuLabel.displayName = "MenuLabel";
|
|
2742
|
-
var MenuContent = (0,
|
|
3150
|
+
var MenuContent = (0, import_react11.forwardRef)(
|
|
2743
3151
|
({
|
|
2744
3152
|
className,
|
|
2745
3153
|
align = "start",
|
|
@@ -2752,8 +3160,8 @@ var MenuContent = (0, import_react10.forwardRef)(
|
|
|
2752
3160
|
}, ref) => {
|
|
2753
3161
|
const store = useDropdownStore(externalStore);
|
|
2754
3162
|
const open = (0, import_zustand2.useStore)(store, (s) => s.open);
|
|
2755
|
-
const [isVisible, setIsVisible] = (0,
|
|
2756
|
-
(0,
|
|
3163
|
+
const [isVisible, setIsVisible] = (0, import_react11.useState)(open);
|
|
3164
|
+
(0, import_react11.useEffect)(() => {
|
|
2757
3165
|
if (open) {
|
|
2758
3166
|
setIsVisible(true);
|
|
2759
3167
|
} else {
|
|
@@ -2768,7 +3176,7 @@ var MenuContent = (0, import_react10.forwardRef)(
|
|
|
2768
3176
|
return `absolute ${vertical} ${horizontal}`;
|
|
2769
3177
|
};
|
|
2770
3178
|
const variantClasses = MENUCONTENT_VARIANT_CLASSES[variant];
|
|
2771
|
-
return /* @__PURE__ */ (0,
|
|
3179
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2772
3180
|
"div",
|
|
2773
3181
|
{
|
|
2774
3182
|
ref,
|
|
@@ -2793,7 +3201,7 @@ var MenuContent = (0, import_react10.forwardRef)(
|
|
|
2793
3201
|
}
|
|
2794
3202
|
);
|
|
2795
3203
|
MenuContent.displayName = "MenuContent";
|
|
2796
|
-
var DropdownMenuItem = (0,
|
|
3204
|
+
var DropdownMenuItem = (0, import_react11.forwardRef)(
|
|
2797
3205
|
({
|
|
2798
3206
|
className,
|
|
2799
3207
|
size = "small",
|
|
@@ -2827,7 +3235,7 @@ var DropdownMenuItem = (0, import_react10.forwardRef)(
|
|
|
2827
3235
|
const getVariantProps = () => {
|
|
2828
3236
|
return variant === "profile" ? { "data-variant": "profile" } : {};
|
|
2829
3237
|
};
|
|
2830
|
-
return /* @__PURE__ */ (0,
|
|
3238
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
|
2831
3239
|
"div",
|
|
2832
3240
|
{
|
|
2833
3241
|
ref,
|
|
@@ -2849,7 +3257,7 @@ var DropdownMenuItem = (0, import_react10.forwardRef)(
|
|
|
2849
3257
|
...props,
|
|
2850
3258
|
children: [
|
|
2851
3259
|
iconLeft,
|
|
2852
|
-
/* @__PURE__ */ (0,
|
|
3260
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "w-full text-md", children }),
|
|
2853
3261
|
iconRight
|
|
2854
3262
|
]
|
|
2855
3263
|
}
|
|
@@ -2857,7 +3265,7 @@ var DropdownMenuItem = (0, import_react10.forwardRef)(
|
|
|
2857
3265
|
}
|
|
2858
3266
|
);
|
|
2859
3267
|
DropdownMenuItem.displayName = "DropdownMenuItem";
|
|
2860
|
-
var DropdownMenuSeparator = (0,
|
|
3268
|
+
var DropdownMenuSeparator = (0, import_react11.forwardRef)(({ className, store: _store, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2861
3269
|
"div",
|
|
2862
3270
|
{
|
|
2863
3271
|
ref,
|
|
@@ -2866,11 +3274,11 @@ var DropdownMenuSeparator = (0, import_react10.forwardRef)(({ className, store:
|
|
|
2866
3274
|
}
|
|
2867
3275
|
));
|
|
2868
3276
|
DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
|
|
2869
|
-
var ProfileMenuTrigger = (0,
|
|
3277
|
+
var ProfileMenuTrigger = (0, import_react11.forwardRef)(({ className, onClick, store: externalStore, ...props }, ref) => {
|
|
2870
3278
|
const store = useDropdownStore(externalStore);
|
|
2871
3279
|
const open = (0, import_zustand2.useStore)(store, (s) => s.open);
|
|
2872
3280
|
const toggleOpen = () => store.setState({ open: !open });
|
|
2873
|
-
return /* @__PURE__ */ (0,
|
|
3281
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2874
3282
|
"button",
|
|
2875
3283
|
{
|
|
2876
3284
|
ref,
|
|
@@ -2882,13 +3290,13 @@ var ProfileMenuTrigger = (0, import_react10.forwardRef)(({ className, onClick, s
|
|
|
2882
3290
|
},
|
|
2883
3291
|
"aria-expanded": open,
|
|
2884
3292
|
...props,
|
|
2885
|
-
children: /* @__PURE__ */ (0,
|
|
3293
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "size-6 rounded-full bg-background-100 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_phosphor_react9.User, { className: "text-background-950", size: 18 }) })
|
|
2886
3294
|
}
|
|
2887
3295
|
);
|
|
2888
3296
|
});
|
|
2889
3297
|
ProfileMenuTrigger.displayName = "ProfileMenuTrigger";
|
|
2890
|
-
var ProfileMenuHeader = (0,
|
|
2891
|
-
return /* @__PURE__ */ (0,
|
|
3298
|
+
var ProfileMenuHeader = (0, import_react11.forwardRef)(({ className, name, email, store: _store, ...props }, ref) => {
|
|
3299
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
|
2892
3300
|
"div",
|
|
2893
3301
|
{
|
|
2894
3302
|
ref,
|
|
@@ -2899,18 +3307,18 @@ var ProfileMenuHeader = (0, import_react10.forwardRef)(({ className, name, email
|
|
|
2899
3307
|
`,
|
|
2900
3308
|
...props,
|
|
2901
3309
|
children: [
|
|
2902
|
-
/* @__PURE__ */ (0,
|
|
2903
|
-
/* @__PURE__ */ (0,
|
|
2904
|
-
/* @__PURE__ */ (0,
|
|
2905
|
-
/* @__PURE__ */ (0,
|
|
3310
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "size-16 bg-background-100 rounded-full flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_phosphor_react9.User, { size: 34, className: "text-background-950" }) }),
|
|
3311
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col ", children: [
|
|
3312
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-xl font-bold text-text-950", children: name }),
|
|
3313
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-md text-text-600", children: email })
|
|
2906
3314
|
] })
|
|
2907
3315
|
]
|
|
2908
3316
|
}
|
|
2909
3317
|
);
|
|
2910
3318
|
});
|
|
2911
3319
|
ProfileMenuHeader.displayName = "ProfileMenuHeader";
|
|
2912
|
-
var ProfileMenuSection = (0,
|
|
2913
|
-
return /* @__PURE__ */ (0,
|
|
3320
|
+
var ProfileMenuSection = (0, import_react11.forwardRef)(({ className, children, store: _store, ...props }, ref) => {
|
|
3321
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2914
3322
|
"div",
|
|
2915
3323
|
{
|
|
2916
3324
|
ref,
|
|
@@ -2933,7 +3341,7 @@ var ProfileMenuFooter = ({
|
|
|
2933
3341
|
}) => {
|
|
2934
3342
|
const store = useDropdownStore(externalStore);
|
|
2935
3343
|
const setOpen = (0, import_zustand2.useStore)(store, (s) => s.setOpen);
|
|
2936
|
-
return /* @__PURE__ */ (0,
|
|
3344
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
|
2937
3345
|
Button_default,
|
|
2938
3346
|
{
|
|
2939
3347
|
variant: "outline",
|
|
@@ -2945,8 +3353,8 @@ var ProfileMenuFooter = ({
|
|
|
2945
3353
|
},
|
|
2946
3354
|
...props,
|
|
2947
3355
|
children: [
|
|
2948
|
-
/* @__PURE__ */ (0,
|
|
2949
|
-
/* @__PURE__ */ (0,
|
|
3356
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "mr-2 flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_phosphor_react9.SignOut, {}) }),
|
|
3357
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: "Sair" })
|
|
2950
3358
|
]
|
|
2951
3359
|
}
|
|
2952
3360
|
);
|
|
@@ -2956,15 +3364,15 @@ var DropdownMenu_default = DropdownMenu;
|
|
|
2956
3364
|
|
|
2957
3365
|
// src/components/Select/Select.tsx
|
|
2958
3366
|
var import_zustand3 = require("zustand");
|
|
2959
|
-
var
|
|
2960
|
-
var
|
|
2961
|
-
var
|
|
3367
|
+
var import_react12 = require("react");
|
|
3368
|
+
var import_phosphor_react10 = require("phosphor-react");
|
|
3369
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
2962
3370
|
var VARIANT_CLASSES4 = {
|
|
2963
3371
|
outlined: "border-2 rounded-sm focus:border-primary-950",
|
|
2964
3372
|
underlined: "border-b-2 focus:border-primary-950",
|
|
2965
3373
|
rounded: "border-2 rounded-4xl focus:border-primary-950"
|
|
2966
3374
|
};
|
|
2967
|
-
var
|
|
3375
|
+
var SIZE_CLASSES11 = {
|
|
2968
3376
|
small: "text-sm",
|
|
2969
3377
|
medium: "text-md",
|
|
2970
3378
|
large: "text-lg"
|
|
@@ -3002,13 +3410,13 @@ function getLabelAsNode(children) {
|
|
|
3002
3410
|
if (typeof children === "string" || typeof children === "number") {
|
|
3003
3411
|
return children;
|
|
3004
3412
|
}
|
|
3005
|
-
const flattened =
|
|
3413
|
+
const flattened = import_react12.Children.toArray(children);
|
|
3006
3414
|
if (flattened.length === 1) return flattened[0];
|
|
3007
|
-
return /* @__PURE__ */ (0,
|
|
3415
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: flattened });
|
|
3008
3416
|
}
|
|
3009
3417
|
var injectStore2 = (children, store) => {
|
|
3010
|
-
return
|
|
3011
|
-
if ((0,
|
|
3418
|
+
return import_react12.Children.map(children, (child) => {
|
|
3419
|
+
if ((0, import_react12.isValidElement)(child)) {
|
|
3012
3420
|
const typedChild = child;
|
|
3013
3421
|
const newProps = {
|
|
3014
3422
|
store
|
|
@@ -3016,7 +3424,7 @@ var injectStore2 = (children, store) => {
|
|
|
3016
3424
|
if (typedChild.props.children) {
|
|
3017
3425
|
newProps.children = injectStore2(typedChild.props.children, store);
|
|
3018
3426
|
}
|
|
3019
|
-
return (0,
|
|
3427
|
+
return (0, import_react12.cloneElement)(typedChild, newProps);
|
|
3020
3428
|
}
|
|
3021
3429
|
return child;
|
|
3022
3430
|
});
|
|
@@ -3028,21 +3436,19 @@ var Select = ({
|
|
|
3028
3436
|
onValueChange,
|
|
3029
3437
|
size = "small"
|
|
3030
3438
|
}) => {
|
|
3031
|
-
const storeRef = (0,
|
|
3439
|
+
const storeRef = (0, import_react12.useRef)(null);
|
|
3032
3440
|
storeRef.current ??= createSelectStore();
|
|
3033
3441
|
const store = storeRef.current;
|
|
3034
|
-
const selectRef = (0,
|
|
3442
|
+
const selectRef = (0, import_react12.useRef)(null);
|
|
3035
3443
|
const { open, setOpen, setValue, value, selectedLabel } = (0, import_zustand3.useStore)(
|
|
3036
3444
|
store,
|
|
3037
3445
|
(s) => s
|
|
3038
3446
|
);
|
|
3039
|
-
const isControlled = propValue !== void 0;
|
|
3040
|
-
const currentValue = isControlled ? propValue : value;
|
|
3041
3447
|
const findLabelForValue = (children2, targetValue) => {
|
|
3042
3448
|
let found = null;
|
|
3043
3449
|
const search = (nodes) => {
|
|
3044
|
-
|
|
3045
|
-
if (!(0,
|
|
3450
|
+
import_react12.Children.forEach(nodes, (child) => {
|
|
3451
|
+
if (!(0, import_react12.isValidElement)(child)) return;
|
|
3046
3452
|
const typedChild = child;
|
|
3047
3453
|
if (typedChild.type === SelectItem && typedChild.props.value === targetValue) {
|
|
3048
3454
|
if (typeof typedChild.props.children === "string")
|
|
@@ -3055,14 +3461,13 @@ var Select = ({
|
|
|
3055
3461
|
search(children2);
|
|
3056
3462
|
return found;
|
|
3057
3463
|
};
|
|
3058
|
-
(0,
|
|
3464
|
+
(0, import_react12.useEffect)(() => {
|
|
3059
3465
|
if (!selectedLabel && defaultValue) {
|
|
3060
3466
|
const label = findLabelForValue(children, defaultValue);
|
|
3061
3467
|
if (label) store.setState({ selectedLabel: label });
|
|
3062
3468
|
}
|
|
3063
3469
|
}, [children, defaultValue, selectedLabel]);
|
|
3064
|
-
(0,
|
|
3065
|
-
setValue(currentValue);
|
|
3470
|
+
(0, import_react12.useEffect)(() => {
|
|
3066
3471
|
const handleClickOutside = (event) => {
|
|
3067
3472
|
if (selectRef.current && !selectRef.current.contains(event.target)) {
|
|
3068
3473
|
setOpen(false);
|
|
@@ -3097,13 +3502,19 @@ var Select = ({
|
|
|
3097
3502
|
document.removeEventListener("keydown", handleArrowKeys);
|
|
3098
3503
|
};
|
|
3099
3504
|
}, [open]);
|
|
3100
|
-
(0,
|
|
3101
|
-
|
|
3102
|
-
|
|
3505
|
+
(0, import_react12.useEffect)(() => {
|
|
3506
|
+
setValue(value);
|
|
3507
|
+
onValueChange?.(value);
|
|
3508
|
+
}, [value, onValueChange]);
|
|
3509
|
+
(0, import_react12.useEffect)(() => {
|
|
3510
|
+
if (propValue) {
|
|
3511
|
+
setValue(propValue);
|
|
3512
|
+
const label = findLabelForValue(children, propValue);
|
|
3513
|
+
if (label) store.setState({ selectedLabel: label });
|
|
3103
3514
|
}
|
|
3104
|
-
}, [
|
|
3105
|
-
const sizeClasses =
|
|
3106
|
-
return /* @__PURE__ */ (0,
|
|
3515
|
+
}, [propValue]);
|
|
3516
|
+
const sizeClasses = SIZE_CLASSES11[size];
|
|
3517
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: `relative ${sizeClasses} w-[288px]`, ref: selectRef, children: injectStore2(children, store) });
|
|
3107
3518
|
};
|
|
3108
3519
|
var SelectValue = ({
|
|
3109
3520
|
placeholder,
|
|
@@ -3112,9 +3523,9 @@ var SelectValue = ({
|
|
|
3112
3523
|
const store = useSelectStore(externalStore);
|
|
3113
3524
|
const selectedLabel = (0, import_zustand3.useStore)(store, (s) => s.selectedLabel);
|
|
3114
3525
|
const value = (0, import_zustand3.useStore)(store, (s) => s.value);
|
|
3115
|
-
return /* @__PURE__ */ (0,
|
|
3526
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-inherit", children: selectedLabel || placeholder || value });
|
|
3116
3527
|
};
|
|
3117
|
-
var SelectTrigger = (0,
|
|
3528
|
+
var SelectTrigger = (0, import_react12.forwardRef)(
|
|
3118
3529
|
({
|
|
3119
3530
|
className,
|
|
3120
3531
|
invalid = false,
|
|
@@ -3127,7 +3538,7 @@ var SelectTrigger = (0, import_react11.forwardRef)(
|
|
|
3127
3538
|
const open = (0, import_zustand3.useStore)(store, (s) => s.open);
|
|
3128
3539
|
const toggleOpen = () => store.setState({ open: !open });
|
|
3129
3540
|
const variantClasses = VARIANT_CLASSES4[variant];
|
|
3130
|
-
return /* @__PURE__ */ (0,
|
|
3541
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
3131
3542
|
"button",
|
|
3132
3543
|
{
|
|
3133
3544
|
ref,
|
|
@@ -3146,8 +3557,8 @@ var SelectTrigger = (0, import_react11.forwardRef)(
|
|
|
3146
3557
|
...props,
|
|
3147
3558
|
children: [
|
|
3148
3559
|
props.children,
|
|
3149
|
-
/* @__PURE__ */ (0,
|
|
3150
|
-
|
|
3560
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3561
|
+
import_phosphor_react10.CaretDown,
|
|
3151
3562
|
{
|
|
3152
3563
|
className: `h-[1em] w-[1em] opacity-50 transition-transform ${open ? "rotate-180" : ""}`
|
|
3153
3564
|
}
|
|
@@ -3158,7 +3569,7 @@ var SelectTrigger = (0, import_react11.forwardRef)(
|
|
|
3158
3569
|
}
|
|
3159
3570
|
);
|
|
3160
3571
|
SelectTrigger.displayName = "SelectTrigger";
|
|
3161
|
-
var SelectContent = (0,
|
|
3572
|
+
var SelectContent = (0, import_react12.forwardRef)(
|
|
3162
3573
|
({
|
|
3163
3574
|
children,
|
|
3164
3575
|
className,
|
|
@@ -3171,7 +3582,7 @@ var SelectContent = (0, import_react11.forwardRef)(
|
|
|
3171
3582
|
const open = (0, import_zustand3.useStore)(store, (s) => s.open);
|
|
3172
3583
|
if (!open) return null;
|
|
3173
3584
|
const getPositionClasses = () => `w-full min-w-full absolute ${SIDE_CLASSES2[side]} ${ALIGN_CLASSES2[align]}`;
|
|
3174
|
-
return /* @__PURE__ */ (0,
|
|
3585
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3175
3586
|
"div",
|
|
3176
3587
|
{
|
|
3177
3588
|
role: "menu",
|
|
@@ -3184,7 +3595,7 @@ var SelectContent = (0, import_react11.forwardRef)(
|
|
|
3184
3595
|
}
|
|
3185
3596
|
);
|
|
3186
3597
|
SelectContent.displayName = "SelectContent";
|
|
3187
|
-
var SelectItem = (0,
|
|
3598
|
+
var SelectItem = (0, import_react12.forwardRef)(
|
|
3188
3599
|
({
|
|
3189
3600
|
className,
|
|
3190
3601
|
children,
|
|
@@ -3194,8 +3605,12 @@ var SelectItem = (0, import_react11.forwardRef)(
|
|
|
3194
3605
|
...props
|
|
3195
3606
|
}, ref) => {
|
|
3196
3607
|
const store = useSelectStore(externalStore);
|
|
3197
|
-
const
|
|
3198
|
-
|
|
3608
|
+
const {
|
|
3609
|
+
value: selectedValue,
|
|
3610
|
+
setValue,
|
|
3611
|
+
setOpen,
|
|
3612
|
+
setSelectedLabel
|
|
3613
|
+
} = (0, import_zustand3.useStore)(store, (s) => s);
|
|
3199
3614
|
const handleClick = (e) => {
|
|
3200
3615
|
const labelNode = getLabelAsNode(children);
|
|
3201
3616
|
if (!disabled) {
|
|
@@ -3205,7 +3620,7 @@ var SelectItem = (0, import_react11.forwardRef)(
|
|
|
3205
3620
|
}
|
|
3206
3621
|
props.onClick?.(e);
|
|
3207
3622
|
};
|
|
3208
|
-
return /* @__PURE__ */ (0,
|
|
3623
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
3209
3624
|
"div",
|
|
3210
3625
|
{
|
|
3211
3626
|
role: "menuitem",
|
|
@@ -3225,7 +3640,7 @@ var SelectItem = (0, import_react11.forwardRef)(
|
|
|
3225
3640
|
tabIndex: disabled ? -1 : 0,
|
|
3226
3641
|
...props,
|
|
3227
3642
|
children: [
|
|
3228
|
-
/* @__PURE__ */ (0,
|
|
3643
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: selectedValue === value && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_phosphor_react10.Check, { className: "" }) }),
|
|
3229
3644
|
children
|
|
3230
3645
|
]
|
|
3231
3646
|
}
|
|
@@ -3237,9 +3652,9 @@ var Select_default = Select;
|
|
|
3237
3652
|
|
|
3238
3653
|
// src/components/Menu/Menu.tsx
|
|
3239
3654
|
var import_zustand4 = require("zustand");
|
|
3240
|
-
var
|
|
3241
|
-
var
|
|
3242
|
-
var
|
|
3655
|
+
var import_react13 = require("react");
|
|
3656
|
+
var import_phosphor_react11 = require("phosphor-react");
|
|
3657
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
3243
3658
|
var createMenuStore = () => (0, import_zustand4.create)((set) => ({
|
|
3244
3659
|
value: "",
|
|
3245
3660
|
setValue: (value) => set({ value })
|
|
@@ -3253,7 +3668,7 @@ var VARIANT_CLASSES5 = {
|
|
|
3253
3668
|
menu2: "overflow-x-auto scroll-smooth",
|
|
3254
3669
|
breadcrumb: ""
|
|
3255
3670
|
};
|
|
3256
|
-
var Menu = (0,
|
|
3671
|
+
var Menu = (0, import_react13.forwardRef)(
|
|
3257
3672
|
({
|
|
3258
3673
|
className,
|
|
3259
3674
|
children,
|
|
@@ -3263,19 +3678,19 @@ var Menu = (0, import_react12.forwardRef)(
|
|
|
3263
3678
|
onValueChange,
|
|
3264
3679
|
...props
|
|
3265
3680
|
}, ref) => {
|
|
3266
|
-
const storeRef = (0,
|
|
3681
|
+
const storeRef = (0, import_react13.useRef)(null);
|
|
3267
3682
|
storeRef.current ??= createMenuStore();
|
|
3268
3683
|
const store = storeRef.current;
|
|
3269
3684
|
const { setValue, value } = (0, import_zustand4.useStore)(store, (s) => s);
|
|
3270
|
-
(0,
|
|
3685
|
+
(0, import_react13.useEffect)(() => {
|
|
3271
3686
|
setValue(propValue ?? defaultValue);
|
|
3272
3687
|
}, [defaultValue, propValue, setValue]);
|
|
3273
|
-
(0,
|
|
3688
|
+
(0, import_react13.useEffect)(() => {
|
|
3274
3689
|
onValueChange?.(value);
|
|
3275
3690
|
}, [value, onValueChange]);
|
|
3276
3691
|
const baseClasses = "w-full flex flex-row items-center gap-2 py-2 px-6";
|
|
3277
3692
|
const variantClasses = VARIANT_CLASSES5[variant];
|
|
3278
|
-
return /* @__PURE__ */ (0,
|
|
3693
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3279
3694
|
"ul",
|
|
3280
3695
|
{
|
|
3281
3696
|
ref,
|
|
@@ -3292,7 +3707,7 @@ var Menu = (0, import_react12.forwardRef)(
|
|
|
3292
3707
|
}
|
|
3293
3708
|
);
|
|
3294
3709
|
Menu.displayName = "Menu";
|
|
3295
|
-
var MenuItem = (0,
|
|
3710
|
+
var MenuItem = (0, import_react13.forwardRef)(
|
|
3296
3711
|
({
|
|
3297
3712
|
className,
|
|
3298
3713
|
children,
|
|
@@ -3320,7 +3735,7 @@ var MenuItem = (0, import_react12.forwardRef)(
|
|
|
3320
3735
|
...props
|
|
3321
3736
|
};
|
|
3322
3737
|
const variants = {
|
|
3323
|
-
menu: /* @__PURE__ */ (0,
|
|
3738
|
+
menu: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3324
3739
|
"li",
|
|
3325
3740
|
{
|
|
3326
3741
|
"data-variant": "menu",
|
|
@@ -3335,7 +3750,7 @@ var MenuItem = (0, import_react12.forwardRef)(
|
|
|
3335
3750
|
children
|
|
3336
3751
|
}
|
|
3337
3752
|
),
|
|
3338
|
-
menu2: /* @__PURE__ */ (0,
|
|
3753
|
+
menu2: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3339
3754
|
"li",
|
|
3340
3755
|
{
|
|
3341
3756
|
"data-variant": "menu2",
|
|
@@ -3347,7 +3762,7 @@ var MenuItem = (0, import_react12.forwardRef)(
|
|
|
3347
3762
|
children
|
|
3348
3763
|
}
|
|
3349
3764
|
),
|
|
3350
|
-
breadcrumb: /* @__PURE__ */ (0,
|
|
3765
|
+
breadcrumb: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3351
3766
|
"li",
|
|
3352
3767
|
{
|
|
3353
3768
|
"data-variant": "breadcrumb",
|
|
@@ -3358,7 +3773,7 @@ var MenuItem = (0, import_react12.forwardRef)(
|
|
|
3358
3773
|
${className ?? ""}
|
|
3359
3774
|
`,
|
|
3360
3775
|
...commonProps,
|
|
3361
|
-
children: /* @__PURE__ */ (0,
|
|
3776
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3362
3777
|
"span",
|
|
3363
3778
|
{
|
|
3364
3779
|
className: `
|
|
@@ -3375,35 +3790,450 @@ var MenuItem = (0, import_react12.forwardRef)(
|
|
|
3375
3790
|
}
|
|
3376
3791
|
);
|
|
3377
3792
|
MenuItem.displayName = "MenuItem";
|
|
3378
|
-
var MenuSeparator = (0,
|
|
3379
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */ (0,
|
|
3793
|
+
var MenuSeparator = (0, import_react13.forwardRef)(
|
|
3794
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3380
3795
|
"li",
|
|
3381
3796
|
{
|
|
3382
3797
|
ref,
|
|
3383
3798
|
"aria-hidden": "true",
|
|
3384
3799
|
className: `[&>svg]:w-4 [&>svg]:h-4 text-text-600 ${className ?? ""}`,
|
|
3385
3800
|
...props,
|
|
3386
|
-
children: children ?? /* @__PURE__ */ (0,
|
|
3801
|
+
children: children ?? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_phosphor_react11.CaretRight, {})
|
|
3387
3802
|
}
|
|
3388
3803
|
)
|
|
3389
3804
|
);
|
|
3390
3805
|
MenuSeparator.displayName = "MenuSeparator";
|
|
3391
|
-
var injectStore3 = (children, store) =>
|
|
3392
|
-
if (!(0,
|
|
3806
|
+
var injectStore3 = (children, store) => import_react13.Children.map(children, (child) => {
|
|
3807
|
+
if (!(0, import_react13.isValidElement)(child)) return child;
|
|
3393
3808
|
const typedChild = child;
|
|
3394
3809
|
const shouldInject = typedChild.type === MenuItem;
|
|
3395
|
-
return (0,
|
|
3810
|
+
return (0, import_react13.cloneElement)(typedChild, {
|
|
3396
3811
|
...shouldInject ? { store } : {},
|
|
3397
3812
|
...typedChild.props.children ? { children: injectStore3(typedChild.props.children, store) } : {}
|
|
3398
3813
|
});
|
|
3399
3814
|
});
|
|
3400
3815
|
var Menu_default = Menu;
|
|
3816
|
+
|
|
3817
|
+
// src/components/Card/Card.tsx
|
|
3818
|
+
var import_react14 = require("react");
|
|
3819
|
+
var import_phosphor_react12 = require("phosphor-react");
|
|
3820
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
3821
|
+
var ACTION_CARD_CLASSES = {
|
|
3822
|
+
warning: "bg-warning-background",
|
|
3823
|
+
success: "bg-success-300",
|
|
3824
|
+
error: "bg-error-100",
|
|
3825
|
+
info: "bg-info-background"
|
|
3826
|
+
};
|
|
3827
|
+
var ACTION_ICON_CLASSES = {
|
|
3828
|
+
warning: "bg-warning-300 text-text",
|
|
3829
|
+
success: "bg-yellow-300 text-text-950",
|
|
3830
|
+
error: "bg-error-500 text-text",
|
|
3831
|
+
info: "bg-info-500 text-text"
|
|
3832
|
+
};
|
|
3833
|
+
var ACTION_SUBTITLE_CLASSES = {
|
|
3834
|
+
warning: "text-warning-600",
|
|
3835
|
+
success: "text-success-700",
|
|
3836
|
+
error: "text-error-700",
|
|
3837
|
+
info: "text-info-700"
|
|
3838
|
+
};
|
|
3839
|
+
var ACTION_HEADER_CLASSES = {
|
|
3840
|
+
warning: "text-warning-300",
|
|
3841
|
+
success: "text-success-300",
|
|
3842
|
+
error: "text-error-300",
|
|
3843
|
+
info: "text-info-300"
|
|
3844
|
+
};
|
|
3845
|
+
var CardActivesResults = (0, import_react14.forwardRef)(
|
|
3846
|
+
({
|
|
3847
|
+
icon,
|
|
3848
|
+
title,
|
|
3849
|
+
subTitle,
|
|
3850
|
+
header,
|
|
3851
|
+
extended = false,
|
|
3852
|
+
action = "success",
|
|
3853
|
+
description,
|
|
3854
|
+
className,
|
|
3855
|
+
...props
|
|
3856
|
+
}, ref) => {
|
|
3857
|
+
const actionCardClasses = ACTION_CARD_CLASSES[action];
|
|
3858
|
+
const actionIconClasses = ACTION_ICON_CLASSES[action];
|
|
3859
|
+
const actionSubTitleClasses = ACTION_SUBTITLE_CLASSES[action];
|
|
3860
|
+
const actionHeaderClasses = ACTION_HEADER_CLASSES[action];
|
|
3861
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
3862
|
+
"div",
|
|
3863
|
+
{
|
|
3864
|
+
ref,
|
|
3865
|
+
className: `w-full flex flex-col border border-border-50 bg-background rounded-xl ${className}`,
|
|
3866
|
+
...props,
|
|
3867
|
+
children: [
|
|
3868
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
3869
|
+
"div",
|
|
3870
|
+
{
|
|
3871
|
+
className: `
|
|
3872
|
+
flex flex-col gap-1 items-center justify-center p-4
|
|
3873
|
+
${actionCardClasses}
|
|
3874
|
+
${extended ? "rounded-t-xl" : "rounded-xl"}`,
|
|
3875
|
+
children: [
|
|
3876
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3877
|
+
"span",
|
|
3878
|
+
{
|
|
3879
|
+
className: `size-7.5 rounded-full flex items-center justify-center ${actionIconClasses}`,
|
|
3880
|
+
children: icon
|
|
3881
|
+
}
|
|
3882
|
+
),
|
|
3883
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-text-800 font-medium uppercase text-2xs", children: title }),
|
|
3884
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: `text-lg font-bold ${actionSubTitleClasses}`, children: subTitle })
|
|
3885
|
+
]
|
|
3886
|
+
}
|
|
3887
|
+
),
|
|
3888
|
+
extended && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col items-center gap-2.5 pb-9.5 pt-2.5", children: [
|
|
3889
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3890
|
+
"p",
|
|
3891
|
+
{
|
|
3892
|
+
className: `text-2xs font-medium uppercase ${actionHeaderClasses}`,
|
|
3893
|
+
children: header
|
|
3894
|
+
}
|
|
3895
|
+
),
|
|
3896
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-sm text-info-800 text-center", children: description })
|
|
3897
|
+
] })
|
|
3898
|
+
]
|
|
3899
|
+
}
|
|
3900
|
+
);
|
|
3901
|
+
}
|
|
3902
|
+
);
|
|
3903
|
+
var CardQuestions = (0, import_react14.forwardRef)(
|
|
3904
|
+
({
|
|
3905
|
+
header,
|
|
3906
|
+
state = "undone",
|
|
3907
|
+
className,
|
|
3908
|
+
onClickButton,
|
|
3909
|
+
valueButton,
|
|
3910
|
+
...props
|
|
3911
|
+
}, ref) => {
|
|
3912
|
+
const isDone = state === "done";
|
|
3913
|
+
const stateLabel = isDone ? "Realizado" : "N\xE3o Realizado";
|
|
3914
|
+
const buttonLabel = isDone ? "Ver Quest\xE3o" : "Responder";
|
|
3915
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
3916
|
+
"div",
|
|
3917
|
+
{
|
|
3918
|
+
ref,
|
|
3919
|
+
className: `
|
|
3920
|
+
w-full flex flex-row justify-between rounded-xl p-4 gap-4 bg-background border border-border-50
|
|
3921
|
+
${className}
|
|
3922
|
+
`,
|
|
3923
|
+
...props,
|
|
3924
|
+
children: [
|
|
3925
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("section", { className: "flex flex-col gap-1", children: [
|
|
3926
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "font-bold text-xs text-text-950", children: header }),
|
|
3927
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-row gap-6 items-center", children: [
|
|
3928
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3929
|
+
Badge_default,
|
|
3930
|
+
{
|
|
3931
|
+
size: "medium",
|
|
3932
|
+
variant: "solid",
|
|
3933
|
+
action: isDone ? "success" : "error",
|
|
3934
|
+
children: stateLabel
|
|
3935
|
+
}
|
|
3936
|
+
),
|
|
3937
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "flex flex-row items-center gap-1 text-text-700 text-xs", children: [
|
|
3938
|
+
isDone ? "Nota" : "Sem nota",
|
|
3939
|
+
isDone && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Badge_default, { size: "medium", action: "success", children: "00" })
|
|
3940
|
+
] })
|
|
3941
|
+
] })
|
|
3942
|
+
] }),
|
|
3943
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Button_default, { size: "extra-small", onClick: () => onClickButton?.(valueButton), children: buttonLabel })
|
|
3944
|
+
]
|
|
3945
|
+
}
|
|
3946
|
+
);
|
|
3947
|
+
}
|
|
3948
|
+
);
|
|
3949
|
+
var CardProgress = (0, import_react14.forwardRef)(
|
|
3950
|
+
({
|
|
3951
|
+
header,
|
|
3952
|
+
subhead,
|
|
3953
|
+
initialDate,
|
|
3954
|
+
endDate,
|
|
3955
|
+
progress = 0,
|
|
3956
|
+
direction = "horizontal",
|
|
3957
|
+
icon,
|
|
3958
|
+
color = "#B7DFFF",
|
|
3959
|
+
className,
|
|
3960
|
+
...props
|
|
3961
|
+
}, ref) => {
|
|
3962
|
+
const isHorizontal = direction === "horizontal";
|
|
3963
|
+
const contentComponent = {
|
|
3964
|
+
horizontal: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
|
|
3965
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-row gap-6 items-center", children: [
|
|
3966
|
+
initialDate && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "flex flex-row gap-1 items-center text-2xs", children: [
|
|
3967
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-text-800 font-semibold", children: "In\xEDcio" }),
|
|
3968
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-text-600", children: initialDate })
|
|
3969
|
+
] }),
|
|
3970
|
+
endDate && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "flex flex-row gap-1 items-center text-2xs", children: [
|
|
3971
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-text-800 font-semibold", children: "Fim" }),
|
|
3972
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-text-600", children: endDate })
|
|
3973
|
+
] })
|
|
3974
|
+
] }),
|
|
3975
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3976
|
+
ProgressBar_default,
|
|
3977
|
+
{
|
|
3978
|
+
size: "medium",
|
|
3979
|
+
showPercentage: true,
|
|
3980
|
+
value: progress,
|
|
3981
|
+
"data-testid": "progress-bar"
|
|
3982
|
+
}
|
|
3983
|
+
)
|
|
3984
|
+
] }),
|
|
3985
|
+
vertical: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-sm text-text-800", children: subhead })
|
|
3986
|
+
};
|
|
3987
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
3988
|
+
"div",
|
|
3989
|
+
{
|
|
3990
|
+
ref,
|
|
3991
|
+
className: `
|
|
3992
|
+
w-full flex border border-border-50 rounded-xl
|
|
3993
|
+
${isHorizontal ? "flex-row h-20" : "flex-col"}
|
|
3994
|
+
${className}
|
|
3995
|
+
`,
|
|
3996
|
+
...props,
|
|
3997
|
+
children: [
|
|
3998
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3999
|
+
"div",
|
|
4000
|
+
{
|
|
4001
|
+
className: `
|
|
4002
|
+
flex justify-center items-center [&>svg]:size-8 text-text-950
|
|
4003
|
+
${isHorizontal ? "w-20 h-full rounded-l-xl" : "min-h-[50px] w-full rounded-t-xl"}
|
|
4004
|
+
`,
|
|
4005
|
+
style: {
|
|
4006
|
+
backgroundColor: color
|
|
4007
|
+
},
|
|
4008
|
+
children: icon
|
|
4009
|
+
}
|
|
4010
|
+
),
|
|
4011
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4012
|
+
"div",
|
|
4013
|
+
{
|
|
4014
|
+
className: `
|
|
4015
|
+
p-4 flex flex-col justify-between w-full h-full
|
|
4016
|
+
${!isHorizontal && "gap-4"}
|
|
4017
|
+
`,
|
|
4018
|
+
children: [
|
|
4019
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-xs font-bold text-text-950", children: header }),
|
|
4020
|
+
contentComponent[direction]
|
|
4021
|
+
]
|
|
4022
|
+
}
|
|
4023
|
+
)
|
|
4024
|
+
]
|
|
4025
|
+
}
|
|
4026
|
+
);
|
|
4027
|
+
}
|
|
4028
|
+
);
|
|
4029
|
+
var CardTopic = (0, import_react14.forwardRef)(
|
|
4030
|
+
({
|
|
4031
|
+
header,
|
|
4032
|
+
subHead,
|
|
4033
|
+
progress,
|
|
4034
|
+
showPercentage = false,
|
|
4035
|
+
className = "",
|
|
4036
|
+
...props
|
|
4037
|
+
}, ref) => {
|
|
4038
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4039
|
+
"div",
|
|
4040
|
+
{
|
|
4041
|
+
ref,
|
|
4042
|
+
className: `w-full py-2 px-4 flex flex-col justify-center gap-2 border border-border-50 rounded-xl min-h-20 ${className}`,
|
|
4043
|
+
...props,
|
|
4044
|
+
children: [
|
|
4045
|
+
subHead && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-text-600 text-2xs flex flex-row gap-1", children: subHead.map((text, index) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react14.Fragment, { children: [
|
|
4046
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { children: text }),
|
|
4047
|
+
index < subHead.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { children: "\u2022" })
|
|
4048
|
+
] }, `${text} - ${index}`)) }),
|
|
4049
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-xs text-text-950 font-bold", children: header }),
|
|
4050
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ProgressBar_default, { showPercentage, value: progress })
|
|
4051
|
+
]
|
|
4052
|
+
}
|
|
4053
|
+
);
|
|
4054
|
+
}
|
|
4055
|
+
);
|
|
4056
|
+
var CardPerformance = (0, import_react14.forwardRef)(
|
|
4057
|
+
({
|
|
4058
|
+
header,
|
|
4059
|
+
progress,
|
|
4060
|
+
description = "Sem dados ainda! Voc\xEA ainda n\xE3o fez um question\xE1rio neste assunto.",
|
|
4061
|
+
className = "",
|
|
4062
|
+
onClickButton,
|
|
4063
|
+
valueButton,
|
|
4064
|
+
...props
|
|
4065
|
+
}, ref) => {
|
|
4066
|
+
const hasProgress = progress !== void 0;
|
|
4067
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4068
|
+
"div",
|
|
4069
|
+
{
|
|
4070
|
+
ref,
|
|
4071
|
+
className: `w-full h-20.5 flex flex-row justify-between p-4 gap-2 bg-background border border-border-50 ${className}`,
|
|
4072
|
+
...props,
|
|
4073
|
+
children: [
|
|
4074
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "w-full flex flex-col justify-between gap-2", children: [
|
|
4075
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-row justify-between items-center", children: [
|
|
4076
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-md font-bold text-text-950", children: header }),
|
|
4077
|
+
hasProgress && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
4078
|
+
Button_default,
|
|
4079
|
+
{
|
|
4080
|
+
variant: "outline",
|
|
4081
|
+
size: "extra-small",
|
|
4082
|
+
onClick: () => onClickButton?.(valueButton),
|
|
4083
|
+
children: "Ver Aula"
|
|
4084
|
+
}
|
|
4085
|
+
)
|
|
4086
|
+
] }),
|
|
4087
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "w-full", children: hasProgress ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ProgressBar_default, { value: progress, label: `${progress}% corretas` }) : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-xs text-text-600", children: description }) })
|
|
4088
|
+
] }),
|
|
4089
|
+
!hasProgress && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
4090
|
+
import_phosphor_react12.CaretRight,
|
|
4091
|
+
{
|
|
4092
|
+
className: "size-4.5",
|
|
4093
|
+
"data-testid": "caret-icon",
|
|
4094
|
+
onClick: () => onClickButton?.(valueButton)
|
|
4095
|
+
}
|
|
4096
|
+
)
|
|
4097
|
+
]
|
|
4098
|
+
}
|
|
4099
|
+
);
|
|
4100
|
+
}
|
|
4101
|
+
);
|
|
4102
|
+
var CardResults = (0, import_react14.forwardRef)(
|
|
4103
|
+
({
|
|
4104
|
+
header,
|
|
4105
|
+
correct_answers,
|
|
4106
|
+
incorrect_answers,
|
|
4107
|
+
icon,
|
|
4108
|
+
direction = "col",
|
|
4109
|
+
color = "#B7DFFF",
|
|
4110
|
+
className,
|
|
4111
|
+
...props
|
|
4112
|
+
}, ref) => {
|
|
4113
|
+
const isRow = direction == "row";
|
|
4114
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4115
|
+
"div",
|
|
4116
|
+
{
|
|
4117
|
+
ref,
|
|
4118
|
+
className: `
|
|
4119
|
+
w-full flex border border-border-50 rounded-xl min-h-20 flex-row items-center pr-4
|
|
4120
|
+
${className}
|
|
4121
|
+
`,
|
|
4122
|
+
...props,
|
|
4123
|
+
children: [
|
|
4124
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
4125
|
+
"div",
|
|
4126
|
+
{
|
|
4127
|
+
className: `
|
|
4128
|
+
flex justify-center items-center [&>svg]:size-8 text-text-950 min-w-20 max-w-20 h-full rounded-l-xl
|
|
4129
|
+
`,
|
|
4130
|
+
style: {
|
|
4131
|
+
backgroundColor: color
|
|
4132
|
+
},
|
|
4133
|
+
children: icon
|
|
4134
|
+
}
|
|
4135
|
+
),
|
|
4136
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4137
|
+
"div",
|
|
4138
|
+
{
|
|
4139
|
+
className: `
|
|
4140
|
+
p-4 flex justify-between w-full h-full
|
|
4141
|
+
${isRow ? "flex-row items-center" : "flex-col"}
|
|
4142
|
+
`,
|
|
4143
|
+
children: [
|
|
4144
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-xs font-bold text-text-950", children: header }),
|
|
4145
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "flex flex-row gap-1 items-center", children: [
|
|
4146
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4147
|
+
Badge_default,
|
|
4148
|
+
{
|
|
4149
|
+
action: "success",
|
|
4150
|
+
variant: "solid",
|
|
4151
|
+
size: "medium",
|
|
4152
|
+
iconLeft: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_phosphor_react12.CheckCircle, {}),
|
|
4153
|
+
children: [
|
|
4154
|
+
correct_answers,
|
|
4155
|
+
" Corretas"
|
|
4156
|
+
]
|
|
4157
|
+
}
|
|
4158
|
+
),
|
|
4159
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4160
|
+
Badge_default,
|
|
4161
|
+
{
|
|
4162
|
+
action: "error",
|
|
4163
|
+
variant: "solid",
|
|
4164
|
+
size: "medium",
|
|
4165
|
+
iconLeft: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_phosphor_react12.XCircle, {}),
|
|
4166
|
+
children: [
|
|
4167
|
+
incorrect_answers,
|
|
4168
|
+
" Incorretas"
|
|
4169
|
+
]
|
|
4170
|
+
}
|
|
4171
|
+
)
|
|
4172
|
+
] })
|
|
4173
|
+
]
|
|
4174
|
+
}
|
|
4175
|
+
),
|
|
4176
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_phosphor_react12.CaretRight, { className: "min-w-6 min-h-6" })
|
|
4177
|
+
]
|
|
4178
|
+
}
|
|
4179
|
+
);
|
|
4180
|
+
}
|
|
4181
|
+
);
|
|
4182
|
+
var CardStatus = (0, import_react14.forwardRef)(
|
|
4183
|
+
({ header, className, status, ...props }, ref) => {
|
|
4184
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4185
|
+
"div",
|
|
4186
|
+
{
|
|
4187
|
+
ref,
|
|
4188
|
+
className: `
|
|
4189
|
+
w-full flex border border-border-50 rounded-xl min-h-20 flex-row items-center pr-4
|
|
4190
|
+
${className}
|
|
4191
|
+
`,
|
|
4192
|
+
...props,
|
|
4193
|
+
children: [
|
|
4194
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
4195
|
+
"div",
|
|
4196
|
+
{
|
|
4197
|
+
className: `
|
|
4198
|
+
p-4 flex justify-between w-full h-full flex-row items-center
|
|
4199
|
+
`,
|
|
4200
|
+
children: [
|
|
4201
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-xs font-bold text-text-950", children: header }),
|
|
4202
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("span", { className: "flex flex-row gap-1 items-center", children: [
|
|
4203
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
4204
|
+
Badge_default,
|
|
4205
|
+
{
|
|
4206
|
+
action: status == "correct" ? "success" : "error",
|
|
4207
|
+
variant: "solid",
|
|
4208
|
+
size: "medium",
|
|
4209
|
+
iconLeft: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_phosphor_react12.CheckCircle, {}),
|
|
4210
|
+
children: status == "correct" ? "Correta" : "Incorreta"
|
|
4211
|
+
}
|
|
4212
|
+
),
|
|
4213
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { className: "text-sm text-text-800", children: "Respondida" })
|
|
4214
|
+
] })
|
|
4215
|
+
]
|
|
4216
|
+
}
|
|
4217
|
+
),
|
|
4218
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_phosphor_react12.CaretRight, { className: "min-w-6 min-h-6" })
|
|
4219
|
+
]
|
|
4220
|
+
}
|
|
4221
|
+
);
|
|
4222
|
+
}
|
|
4223
|
+
);
|
|
3401
4224
|
// Annotate the CommonJS export names for ESM import in node:
|
|
3402
4225
|
0 && (module.exports = {
|
|
3403
4226
|
Alert,
|
|
3404
4227
|
Badge,
|
|
3405
4228
|
Button,
|
|
3406
4229
|
Calendar,
|
|
4230
|
+
CardActivesResults,
|
|
4231
|
+
CardPerformance,
|
|
4232
|
+
CardProgress,
|
|
4233
|
+
CardQuestions,
|
|
4234
|
+
CardResults,
|
|
4235
|
+
CardStatus,
|
|
4236
|
+
CardTopic,
|
|
3407
4237
|
CheckBox,
|
|
3408
4238
|
Chips,
|
|
3409
4239
|
Divider,
|
|
@@ -3419,6 +4249,7 @@ var Menu_default = Menu;
|
|
|
3419
4249
|
MenuItem,
|
|
3420
4250
|
MenuLabel,
|
|
3421
4251
|
MenuSeparator,
|
|
4252
|
+
Modal,
|
|
3422
4253
|
NavButton,
|
|
3423
4254
|
ProfileMenuFooter,
|
|
3424
4255
|
ProfileMenuHeader,
|
|
@@ -3433,6 +4264,7 @@ var Menu_default = Menu;
|
|
|
3433
4264
|
SelectTrigger,
|
|
3434
4265
|
SelectValue,
|
|
3435
4266
|
SelectionButton,
|
|
4267
|
+
Stepper,
|
|
3436
4268
|
Table,
|
|
3437
4269
|
Text,
|
|
3438
4270
|
TextArea,
|