@vector-business-services/cristal-ds-web 0.19.0 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +780 -171
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +553 -217
- package/dist/index.css.map +1 -1
- package/dist/index.d.cts +140 -3
- package/dist/index.d.ts +140 -3
- package/dist/index.js +778 -173
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -7,17 +7,20 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
7
7
|
var autocomplete = require('primereact/autocomplete');
|
|
8
8
|
var badge = require('primereact/badge');
|
|
9
9
|
var button = require('primereact/button');
|
|
10
|
+
var calendar = require('primereact/calendar');
|
|
11
|
+
var api = require('primereact/api');
|
|
10
12
|
var card = require('primereact/card');
|
|
11
13
|
var chart = require('primereact/chart');
|
|
12
14
|
var tooltip = require('primereact/tooltip');
|
|
13
15
|
var checkbox = require('primereact/checkbox');
|
|
14
16
|
var chip = require('primereact/chip');
|
|
15
17
|
var contextmenu = require('primereact/contextmenu');
|
|
16
|
-
var api = require('primereact/api');
|
|
17
18
|
var menu = require('primereact/menu');
|
|
19
|
+
var overlaypanel = require('primereact/overlaypanel');
|
|
20
|
+
var inputtext = require('primereact/inputtext');
|
|
21
|
+
var radiobutton = require('primereact/radiobutton');
|
|
18
22
|
var divider = require('primereact/divider');
|
|
19
23
|
var sidebar = require('primereact/sidebar');
|
|
20
|
-
var inputtext = require('primereact/inputtext');
|
|
21
24
|
var menubar = require('primereact/menubar');
|
|
22
25
|
var tag = require('primereact/tag');
|
|
23
26
|
var message = require('primereact/message');
|
|
@@ -27,7 +30,6 @@ var tabmenu = require('primereact/tabmenu');
|
|
|
27
30
|
var paginator = require('primereact/paginator');
|
|
28
31
|
var dropdown = require('primereact/dropdown');
|
|
29
32
|
var panel = require('primereact/panel');
|
|
30
|
-
var radiobutton = require('primereact/radiobutton');
|
|
31
33
|
var scrollpanel = require('primereact/scrollpanel');
|
|
32
34
|
var selectbutton = require('primereact/selectbutton');
|
|
33
35
|
var skeleton = require('primereact/skeleton');
|
|
@@ -149,7 +151,7 @@ var AutoComplete = react.forwardRef(function AutoComplete2({
|
|
|
149
151
|
const id = inputId ?? autoId;
|
|
150
152
|
const hintId = `${id}-hint`;
|
|
151
153
|
const supportText = error ?? hint;
|
|
152
|
-
const
|
|
154
|
+
const classes2 = [
|
|
153
155
|
"cr-field",
|
|
154
156
|
"cr-autocomplete",
|
|
155
157
|
dropdown && "cr-autocomplete--dropdown",
|
|
@@ -159,7 +161,7 @@ var AutoComplete = react.forwardRef(function AutoComplete2({
|
|
|
159
161
|
disabled && "cr-field--disabled",
|
|
160
162
|
className
|
|
161
163
|
].filter(Boolean).join(" ");
|
|
162
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
164
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, style, children: [
|
|
163
165
|
label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "cr-field__label", htmlFor: id, children: [
|
|
164
166
|
label,
|
|
165
167
|
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
@@ -216,13 +218,13 @@ var AutoComplete = react.forwardRef(function AutoComplete2({
|
|
|
216
218
|
var Badge = react.forwardRef(function Badge2({ variant = "default", size = "large", className, children, ...props }, ref) {
|
|
217
219
|
const primeRef = react.useRef(null);
|
|
218
220
|
react.useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
219
|
-
const
|
|
221
|
+
const classes2 = ["cr-badge", `cr-badge--${variant}`, `cr-badge--${size}`, className].filter(Boolean).join(" ");
|
|
220
222
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
221
223
|
badge.Badge,
|
|
222
224
|
{
|
|
223
225
|
unstyled: true,
|
|
224
226
|
ref: primeRef,
|
|
225
|
-
className:
|
|
227
|
+
className: classes2,
|
|
226
228
|
value: size === "small" ? null : children,
|
|
227
229
|
...props
|
|
228
230
|
}
|
|
@@ -238,14 +240,14 @@ var Button = react.forwardRef(function Button2({
|
|
|
238
240
|
children,
|
|
239
241
|
...props
|
|
240
242
|
}, ref) {
|
|
241
|
-
const
|
|
243
|
+
const classes2 = ["cr-button", `cr-button--${variant}`, `cr-button--${size}`, className].filter(Boolean).join(" ");
|
|
242
244
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
243
245
|
button.Button,
|
|
244
246
|
{
|
|
245
247
|
unstyled: true,
|
|
246
248
|
ref,
|
|
247
249
|
type,
|
|
248
|
-
className:
|
|
250
|
+
className: classes2,
|
|
249
251
|
...props,
|
|
250
252
|
children: [
|
|
251
253
|
leadingIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-button__icon", "aria-hidden": "true", children: leadingIcon }),
|
|
@@ -255,15 +257,202 @@ var Button = react.forwardRef(function Button2({
|
|
|
255
257
|
}
|
|
256
258
|
);
|
|
257
259
|
});
|
|
260
|
+
var LOCALE = "cr-pt-BR";
|
|
261
|
+
api.addLocale(LOCALE, {
|
|
262
|
+
firstDayOfWeek: 0,
|
|
263
|
+
dayNames: [
|
|
264
|
+
"domingo",
|
|
265
|
+
"segunda-feira",
|
|
266
|
+
"ter\xE7a-feira",
|
|
267
|
+
"quarta-feira",
|
|
268
|
+
"quinta-feira",
|
|
269
|
+
"sexta-feira",
|
|
270
|
+
"s\xE1bado"
|
|
271
|
+
],
|
|
272
|
+
dayNamesShort: ["dom", "seg", "ter", "qua", "qui", "sex", "s\xE1b"],
|
|
273
|
+
dayNamesMin: ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sab"],
|
|
274
|
+
monthNames: [
|
|
275
|
+
"Janeiro",
|
|
276
|
+
"Fevereiro",
|
|
277
|
+
"Mar\xE7o",
|
|
278
|
+
"Abril",
|
|
279
|
+
"Maio",
|
|
280
|
+
"Junho",
|
|
281
|
+
"Julho",
|
|
282
|
+
"Agosto",
|
|
283
|
+
"Setembro",
|
|
284
|
+
"Outubro",
|
|
285
|
+
"Novembro",
|
|
286
|
+
"Dezembro"
|
|
287
|
+
],
|
|
288
|
+
monthNamesShort: [
|
|
289
|
+
"Jan",
|
|
290
|
+
"Fev",
|
|
291
|
+
"Mar",
|
|
292
|
+
"Abr",
|
|
293
|
+
"Mai",
|
|
294
|
+
"Jun",
|
|
295
|
+
"Jul",
|
|
296
|
+
"Ago",
|
|
297
|
+
"Set",
|
|
298
|
+
"Out",
|
|
299
|
+
"Nov",
|
|
300
|
+
"Dez"
|
|
301
|
+
],
|
|
302
|
+
dateFormat: "dd/mm/yy",
|
|
303
|
+
weekHeader: "Sem",
|
|
304
|
+
today: "Hoje",
|
|
305
|
+
clear: "Limpar",
|
|
306
|
+
chooseDate: "Escolher data",
|
|
307
|
+
chooseMonth: "Escolher m\xEAs",
|
|
308
|
+
chooseYear: "Escolher ano",
|
|
309
|
+
prevMonth: "M\xEAs anterior",
|
|
310
|
+
nextMonth: "Pr\xF3ximo m\xEAs",
|
|
311
|
+
prevYear: "Ano anterior",
|
|
312
|
+
nextYear: "Pr\xF3ximo ano",
|
|
313
|
+
prevDecade: "D\xE9cada anterior",
|
|
314
|
+
nextDecade: "Pr\xF3xima d\xE9cada"
|
|
315
|
+
});
|
|
316
|
+
function seguirFocoDoDia(event) {
|
|
317
|
+
const dia2 = event.target;
|
|
318
|
+
if (!(dia2 instanceof HTMLElement) || !dia2.classList.contains("cr-calendar__date")) return;
|
|
319
|
+
const painel = dia2.closest(".cr-calendar");
|
|
320
|
+
const td = dia2.closest("td");
|
|
321
|
+
const mes = dia2.closest(".cr-calendar__month");
|
|
322
|
+
if (!painel || !td || !mes || event.relatedTarget) return;
|
|
323
|
+
const indice = [...painel.querySelectorAll(".cr-calendar__month")].indexOf(mes);
|
|
324
|
+
const { pDay, pMonth, pYear } = td.dataset;
|
|
325
|
+
requestAnimationFrame(() => {
|
|
326
|
+
if (dia2.isConnected || document.activeElement !== document.body) return;
|
|
327
|
+
const novo = painel.querySelectorAll(".cr-calendar__month")[indice]?.querySelector(
|
|
328
|
+
`td[data-p-day="${pDay}"][data-p-month="${pMonth}"][data-p-year="${pYear}"] .cr-calendar__date`
|
|
329
|
+
);
|
|
330
|
+
if (novo) {
|
|
331
|
+
novo.tabIndex = 0;
|
|
332
|
+
novo.focus();
|
|
333
|
+
}
|
|
334
|
+
});
|
|
335
|
+
}
|
|
336
|
+
if (typeof document !== "undefined") document.addEventListener("focusout", seguirFocoDoDia, true);
|
|
337
|
+
var setas = {
|
|
338
|
+
prevIcon: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-icon-button__icon", children: /* @__PURE__ */ jsxRuntime.jsx(react$1.CaretLeft, {}) }),
|
|
339
|
+
nextIcon: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-icon-button__icon", children: /* @__PURE__ */ jsxRuntime.jsx(react$1.CaretRight, {}) })
|
|
340
|
+
};
|
|
341
|
+
var mesmoDia = (data, dia2) => data instanceof Date && data.getDate() === dia2.day && data.getMonth() === dia2.month && data.getFullYear() === dia2.year;
|
|
342
|
+
var chave = (dia2) => dia2.year * 1e4 + dia2.month * 100 + dia2.day;
|
|
343
|
+
var chaveDe = (data) => chave({ day: data.getDate(), month: data.getMonth(), year: data.getFullYear() });
|
|
344
|
+
function escolhido(props, dia2) {
|
|
345
|
+
const { value } = props;
|
|
346
|
+
if (value instanceof Date) return mesmoDia(value, dia2);
|
|
347
|
+
if (!Array.isArray(value)) return false;
|
|
348
|
+
if (props.selectionMode === "range") {
|
|
349
|
+
const [inicio, fim] = value;
|
|
350
|
+
if (!inicio) return false;
|
|
351
|
+
return chave(dia2) >= chaveDe(inicio) && chave(dia2) <= chaveDe(fim ?? inicio);
|
|
352
|
+
}
|
|
353
|
+
return value.some((data) => mesmoDia(data, dia2));
|
|
354
|
+
}
|
|
355
|
+
function noPeriodo(props, dia2) {
|
|
356
|
+
if (props.selectionMode !== "range" || !Array.isArray(props.value)) return void 0;
|
|
357
|
+
const [inicio, fim] = props.value;
|
|
358
|
+
if (mesmoDia(inicio, dia2) || mesmoDia(fim, dia2)) return "cr-calendar__day--edge";
|
|
359
|
+
if (inicio && fim) {
|
|
360
|
+
const data = new Date(dia2.year, dia2.month, dia2.day);
|
|
361
|
+
if (data > inicio && data < fim) return "cr-calendar__day--middle";
|
|
362
|
+
}
|
|
363
|
+
return void 0;
|
|
364
|
+
}
|
|
365
|
+
var classes = (...lista) => lista.filter(Boolean).join(" ");
|
|
366
|
+
function ptDoPainel(offDays = []) {
|
|
367
|
+
return {
|
|
368
|
+
groupContainer: { className: "cr-calendar__months" },
|
|
369
|
+
group: { className: "cr-calendar__month" },
|
|
370
|
+
header: { className: "cr-calendar__header" },
|
|
371
|
+
previousButton: {
|
|
372
|
+
className: "cr-icon-button cr-icon-button--tertiary cr-icon-button--xsmall"
|
|
373
|
+
},
|
|
374
|
+
nextButton: { className: "cr-icon-button cr-icon-button--tertiary cr-icon-button--xsmall" },
|
|
375
|
+
title: { className: "cr-calendar__title" },
|
|
376
|
+
// O nome dos botões do título é o texto que aparece neles (o mês e o ano), não "Escolher mês".
|
|
377
|
+
monthTitle: { className: "cr-calendar__title-button", "aria-label": void 0 },
|
|
378
|
+
yearTitle: { className: "cr-calendar__title-button", "aria-label": void 0 },
|
|
379
|
+
decadeTitle: { className: "cr-calendar__title-text" },
|
|
380
|
+
table: { className: "cr-calendar__table" },
|
|
381
|
+
tableHeaderCell: { className: "cr-calendar__weekday" },
|
|
382
|
+
day: ({ props, context }) => {
|
|
383
|
+
const dia2 = context.date;
|
|
384
|
+
const meses = api.localeOption("monthNames", props.locale ?? LOCALE);
|
|
385
|
+
return {
|
|
386
|
+
// O Prime põe o escolhido e o desabilitado no <span> do dia, que não tem papel: eles vão
|
|
387
|
+
// para a célula da grade (gridcell). O nome da célula inclui o número que aparece nela.
|
|
388
|
+
"aria-selected": escolhido(props, dia2),
|
|
389
|
+
"aria-disabled": dia2.selectable ? void 0 : true,
|
|
390
|
+
"aria-label": `${dia2.day} de ${meses[dia2.month]?.toLowerCase()} de ${dia2.year}`,
|
|
391
|
+
className: classes(
|
|
392
|
+
"cr-calendar__day",
|
|
393
|
+
context.today && "cr-calendar__day--today",
|
|
394
|
+
context.otherMonth && "cr-calendar__day--other-month",
|
|
395
|
+
offDays.some((data) => mesmoDia(data, dia2)) && "cr-calendar__day--off",
|
|
396
|
+
noPeriodo(props, dia2)
|
|
397
|
+
)
|
|
398
|
+
};
|
|
399
|
+
},
|
|
400
|
+
dayLabel: ({ context }) => ({
|
|
401
|
+
"aria-selected": void 0,
|
|
402
|
+
"aria-disabled": void 0,
|
|
403
|
+
className: classes(
|
|
404
|
+
"cr-calendar__date",
|
|
405
|
+
context.selected && "cr-calendar__date--selected",
|
|
406
|
+
context.disabled && "cr-calendar__date--disabled"
|
|
407
|
+
)
|
|
408
|
+
}),
|
|
409
|
+
monthPicker: { className: "cr-calendar__picker cr-calendar__picker--months" },
|
|
410
|
+
month: ({ context }) => ({
|
|
411
|
+
className: classes(
|
|
412
|
+
"cr-calendar__option",
|
|
413
|
+
context.selected && "cr-calendar__option--selected",
|
|
414
|
+
context.disabled && "cr-calendar__option--disabled"
|
|
415
|
+
)
|
|
416
|
+
}),
|
|
417
|
+
yearPicker: { className: "cr-calendar__picker cr-calendar__picker--years" },
|
|
418
|
+
year: ({ context }) => ({
|
|
419
|
+
className: classes(
|
|
420
|
+
"cr-calendar__option",
|
|
421
|
+
context.selected && "cr-calendar__option--selected",
|
|
422
|
+
context.disabled && "cr-calendar__option--disabled"
|
|
423
|
+
)
|
|
424
|
+
})
|
|
425
|
+
};
|
|
426
|
+
}
|
|
427
|
+
function CalendarBase({ offDays, locale = LOCALE, className, ...props }, ref) {
|
|
428
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
429
|
+
calendar.Calendar,
|
|
430
|
+
{
|
|
431
|
+
...setas,
|
|
432
|
+
locale,
|
|
433
|
+
...props,
|
|
434
|
+
ref,
|
|
435
|
+
inline: true,
|
|
436
|
+
unstyled: true,
|
|
437
|
+
className,
|
|
438
|
+
pt: {
|
|
439
|
+
root: { className: "cr-calendar-inline" },
|
|
440
|
+
panel: { className: "cr-calendar" },
|
|
441
|
+
...ptDoPainel(offDays)
|
|
442
|
+
}
|
|
443
|
+
}
|
|
444
|
+
);
|
|
445
|
+
}
|
|
446
|
+
var Calendar = react.forwardRef(CalendarBase);
|
|
258
447
|
var Card = react.forwardRef(function Card2({ padding = "xsmall", outline = false, className, style, children, ...props }, ref) {
|
|
259
|
-
const
|
|
448
|
+
const classes2 = ["cr-card", `cr-card--${padding}`, outline && "cr-card--outline", className].filter(Boolean).join(" ");
|
|
260
449
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
261
450
|
card.Card,
|
|
262
451
|
{
|
|
263
452
|
unstyled: true,
|
|
264
453
|
ref,
|
|
265
454
|
pt: {
|
|
266
|
-
root: { className:
|
|
455
|
+
root: { className: classes2, style },
|
|
267
456
|
body: { className: "cr-card__body" },
|
|
268
457
|
content: { className: "cr-card__content" }
|
|
269
458
|
},
|
|
@@ -323,11 +512,11 @@ function Tooltip({
|
|
|
323
512
|
)
|
|
324
513
|
);
|
|
325
514
|
}, [target, tooltipId, describe]);
|
|
326
|
-
const
|
|
515
|
+
const classes2 = ["cr-tooltip", `cr-tooltip--${type}`, className].filter(Boolean).join(" ");
|
|
327
516
|
const pt = {
|
|
328
517
|
root: (options) => {
|
|
329
518
|
const side = options?.state?.position ?? position;
|
|
330
|
-
return { className: `${
|
|
519
|
+
return { className: `${classes2} cr-tooltip--${side}`, "aria-hidden": false };
|
|
331
520
|
},
|
|
332
521
|
arrow: { className: "cr-tooltip__arrow" },
|
|
333
522
|
text: { className: "cr-tooltip__text" }
|
|
@@ -586,8 +775,8 @@ var Chart = react.forwardRef(function Chart2({
|
|
|
586
775
|
};
|
|
587
776
|
}, [tema, yAxis, y2Axis, temDireita, series, type, stacked]);
|
|
588
777
|
const card = Boolean(title || actions);
|
|
589
|
-
const
|
|
590
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...props, ref: raiz, id, className:
|
|
778
|
+
const classes2 = ["cr-chart", card && "cr-chart--card", className].filter(Boolean).join(" ");
|
|
779
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...props, ref: raiz, id, className: classes2, children: [
|
|
591
780
|
card && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-chart__header", children: [
|
|
592
781
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-chart__title-row", children: [
|
|
593
782
|
title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-chart__title", children: title }),
|
|
@@ -680,7 +869,7 @@ var Checkbox = react.forwardRef(function Checkbox2({
|
|
|
680
869
|
react.useEffect(() => {
|
|
681
870
|
if (inputRef.current) inputRef.current.indeterminate = indeterminate && !checked;
|
|
682
871
|
}, [indeterminate, checked]);
|
|
683
|
-
const
|
|
872
|
+
const classes2 = [
|
|
684
873
|
"cr-checkbox",
|
|
685
874
|
`cr-checkbox--${position}`,
|
|
686
875
|
`cr-checkbox--label-${labelSize}`,
|
|
@@ -688,7 +877,7 @@ var Checkbox = react.forwardRef(function Checkbox2({
|
|
|
688
877
|
disabled && "cr-checkbox--disabled",
|
|
689
878
|
className
|
|
690
879
|
].filter(Boolean).join(" ");
|
|
691
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
880
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, style, children: [
|
|
692
881
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
693
882
|
checkbox.Checkbox,
|
|
694
883
|
{
|
|
@@ -735,7 +924,7 @@ var Chip = react.forwardRef(function Chip2({
|
|
|
735
924
|
className,
|
|
736
925
|
...props
|
|
737
926
|
}, ref) {
|
|
738
|
-
const
|
|
927
|
+
const classes2 = [
|
|
739
928
|
"cr-chip",
|
|
740
929
|
`cr-chip--${variant}`,
|
|
741
930
|
`cr-chip--${size}`,
|
|
@@ -749,7 +938,7 @@ var Chip = react.forwardRef(function Chip2({
|
|
|
749
938
|
{
|
|
750
939
|
unstyled: true,
|
|
751
940
|
pt: { root: { ref, "aria-label": void 0 } },
|
|
752
|
-
className:
|
|
941
|
+
className: classes2,
|
|
753
942
|
label,
|
|
754
943
|
"aria-disabled": disabled || void 0,
|
|
755
944
|
icon: leadingIcon ? () => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-chip__icon cr-chip__icon--leading", "aria-hidden": "true", children: leadingIcon }) : void 0,
|
|
@@ -825,7 +1014,7 @@ var Menu = react.forwardRef(function Menu2({
|
|
|
825
1014
|
template: () => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cr-menu__loading", children: /* @__PURE__ */ jsxRuntime.jsx(react$1.CircleNotch, { className: "cr-menu__spinner", "aria-hidden": "true" }) })
|
|
826
1015
|
}
|
|
827
1016
|
] : itensDoPrime(model);
|
|
828
|
-
const
|
|
1017
|
+
const classes2 = ["cr-lista cr-menu", `cr-menu--${density}`, popup && "cr-menu--popup", className].filter(Boolean).join(" ");
|
|
829
1018
|
const pt = {
|
|
830
1019
|
// O nome acessível vai na lista (role=menu); o Prime lê `ariaLabel`, mas não o declara no tipo.
|
|
831
1020
|
menu: {
|
|
@@ -859,7 +1048,7 @@ var Menu = react.forwardRef(function Menu2({
|
|
|
859
1048
|
unstyled: true,
|
|
860
1049
|
ref: primeRef,
|
|
861
1050
|
id,
|
|
862
|
-
className:
|
|
1051
|
+
className: classes2,
|
|
863
1052
|
model: items,
|
|
864
1053
|
popup,
|
|
865
1054
|
popupAlignment,
|
|
@@ -888,9 +1077,9 @@ var ContextMenu = react.forwardRef(function ContextMenu2({
|
|
|
888
1077
|
hide: (event) => primeRef.current?.hide(event),
|
|
889
1078
|
getElement: () => primeRef.current?.getElement() ?? null
|
|
890
1079
|
}));
|
|
891
|
-
const
|
|
1080
|
+
const classes2 = ["cr-lista cr-menu cr-context-menu", `cr-menu--${density}`, className].filter(Boolean).join(" ");
|
|
892
1081
|
const pt = {
|
|
893
|
-
root: { ...props, className:
|
|
1082
|
+
root: { ...props, className: classes2 },
|
|
894
1083
|
// O nome vai na lista (o Prime dá a ela role=menubar, vertical).
|
|
895
1084
|
menu: {
|
|
896
1085
|
className: "cr-menu__list",
|
|
@@ -923,10 +1112,537 @@ var ContextMenu = react.forwardRef(function ContextMenu2({
|
|
|
923
1112
|
}
|
|
924
1113
|
);
|
|
925
1114
|
});
|
|
1115
|
+
function DatePickerBase({
|
|
1116
|
+
variant = "outline",
|
|
1117
|
+
size = "large",
|
|
1118
|
+
label,
|
|
1119
|
+
hint,
|
|
1120
|
+
error,
|
|
1121
|
+
offDays,
|
|
1122
|
+
locale = LOCALE,
|
|
1123
|
+
placeholder = "dd/mm/aaaa",
|
|
1124
|
+
inputId,
|
|
1125
|
+
required,
|
|
1126
|
+
disabled,
|
|
1127
|
+
className,
|
|
1128
|
+
style,
|
|
1129
|
+
onShow,
|
|
1130
|
+
onHide,
|
|
1131
|
+
...props
|
|
1132
|
+
}, ref) {
|
|
1133
|
+
const autoId = react.useId();
|
|
1134
|
+
const id = inputId ?? autoId;
|
|
1135
|
+
const hintId = `${id}-hint`;
|
|
1136
|
+
const supportText = error ?? hint;
|
|
1137
|
+
const pelaSeta = react.useRef(false);
|
|
1138
|
+
const peloTeclado = react.useRef(false);
|
|
1139
|
+
const calendario = react.useRef(null);
|
|
1140
|
+
react.useImperativeHandle(ref, () => calendario.current, []);
|
|
1141
|
+
const classes2 = [
|
|
1142
|
+
"cr-field",
|
|
1143
|
+
"cr-datepicker",
|
|
1144
|
+
`cr-field--${variant}`,
|
|
1145
|
+
`cr-field--${size}`,
|
|
1146
|
+
error && "cr-field--error",
|
|
1147
|
+
disabled && "cr-field--disabled",
|
|
1148
|
+
className
|
|
1149
|
+
].filter(Boolean).join(" ");
|
|
1150
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, style, children: [
|
|
1151
|
+
label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "cr-field__label", htmlFor: id, children: [
|
|
1152
|
+
label,
|
|
1153
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1154
|
+
] }),
|
|
1155
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1156
|
+
calendar.Calendar,
|
|
1157
|
+
{
|
|
1158
|
+
...setas,
|
|
1159
|
+
locale,
|
|
1160
|
+
placeholder,
|
|
1161
|
+
...props,
|
|
1162
|
+
ref: calendario,
|
|
1163
|
+
unstyled: true,
|
|
1164
|
+
inputId: id,
|
|
1165
|
+
required,
|
|
1166
|
+
disabled,
|
|
1167
|
+
showIcon: true,
|
|
1168
|
+
icon: /* @__PURE__ */ jsxRuntime.jsx(react$1.CalendarDot, { "aria-hidden": "true" }),
|
|
1169
|
+
onShow: () => {
|
|
1170
|
+
if (!pelaSeta.current) document.getElementById(id)?.focus();
|
|
1171
|
+
pelaSeta.current = false;
|
|
1172
|
+
onShow?.();
|
|
1173
|
+
},
|
|
1174
|
+
onHide: () => {
|
|
1175
|
+
const atual = calendario.current;
|
|
1176
|
+
const ativo = document.activeElement;
|
|
1177
|
+
const semFoco = ativo === document.body || atual?.getOverlay()?.contains(ativo);
|
|
1178
|
+
if (peloTeclado.current && semFoco && atual) {
|
|
1179
|
+
atual.focus();
|
|
1180
|
+
atual.hide();
|
|
1181
|
+
}
|
|
1182
|
+
peloTeclado.current = false;
|
|
1183
|
+
pelaSeta.current = false;
|
|
1184
|
+
onHide?.();
|
|
1185
|
+
},
|
|
1186
|
+
pt: {
|
|
1187
|
+
root: { className: "cr-datepicker__root" },
|
|
1188
|
+
input: {
|
|
1189
|
+
root: {
|
|
1190
|
+
className: "cr-field__control cr-datepicker__input",
|
|
1191
|
+
"aria-describedby": supportText ? hintId : void 0,
|
|
1192
|
+
"aria-invalid": error ? true : void 0,
|
|
1193
|
+
onKeyDown: (event) => {
|
|
1194
|
+
if (event.code === "ArrowDown" && !calendario.current?.getOverlay()) {
|
|
1195
|
+
pelaSeta.current = true;
|
|
1196
|
+
}
|
|
1197
|
+
}
|
|
1198
|
+
}
|
|
1199
|
+
},
|
|
1200
|
+
dropdownButton: { root: { className: "cr-datepicker__button" } },
|
|
1201
|
+
panel: {
|
|
1202
|
+
className: "cr-calendar cr-datepicker__panel",
|
|
1203
|
+
onKeyDown: (event) => {
|
|
1204
|
+
if (["Enter", "NumpadEnter", "Space"].includes(event.code))
|
|
1205
|
+
peloTeclado.current = true;
|
|
1206
|
+
}
|
|
1207
|
+
},
|
|
1208
|
+
// Animação de entrada e saída (a do Prime) e o lado do painel, medido logo depois de o
|
|
1209
|
+
// Prime posicionar.
|
|
1210
|
+
transition: transicaoDoPopup(() => {
|
|
1211
|
+
const campo = document.getElementById(id);
|
|
1212
|
+
seguirLado(painelDoCampo(campo, ".cr-datepicker__panel"), campo);
|
|
1213
|
+
}),
|
|
1214
|
+
...ptDoPainel(offDays)
|
|
1215
|
+
}
|
|
1216
|
+
}
|
|
1217
|
+
),
|
|
1218
|
+
supportText && /* @__PURE__ */ jsxRuntime.jsxs("p", { id: hintId, className: `cr-field__hint${error ? " cr-field__hint--error" : ""}`, children: [
|
|
1219
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__hint-icon", "aria-hidden": "true", children: error ? /* @__PURE__ */ jsxRuntime.jsx(react$1.WarningCircle, {}) : /* @__PURE__ */ jsxRuntime.jsx(react$1.Info, {}) }),
|
|
1220
|
+
supportText
|
|
1221
|
+
] })
|
|
1222
|
+
] });
|
|
1223
|
+
}
|
|
1224
|
+
var DatePicker = react.forwardRef(DatePickerBase);
|
|
1225
|
+
var Input = react.forwardRef(function Input2({
|
|
1226
|
+
variant = "outline",
|
|
1227
|
+
size = "large",
|
|
1228
|
+
label,
|
|
1229
|
+
leadingIcon,
|
|
1230
|
+
trailingIcon,
|
|
1231
|
+
hint,
|
|
1232
|
+
error,
|
|
1233
|
+
id,
|
|
1234
|
+
required,
|
|
1235
|
+
disabled,
|
|
1236
|
+
className,
|
|
1237
|
+
...props
|
|
1238
|
+
}, ref) {
|
|
1239
|
+
const autoId = react.useId();
|
|
1240
|
+
const inputId = id ?? autoId;
|
|
1241
|
+
const hintId = `${inputId}-hint`;
|
|
1242
|
+
const supportText = error ?? hint;
|
|
1243
|
+
const classes2 = [
|
|
1244
|
+
"cr-field",
|
|
1245
|
+
`cr-field--${variant}`,
|
|
1246
|
+
`cr-field--${size}`,
|
|
1247
|
+
error && "cr-field--error",
|
|
1248
|
+
disabled && "cr-field--disabled",
|
|
1249
|
+
className
|
|
1250
|
+
].filter(Boolean).join(" ");
|
|
1251
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, children: [
|
|
1252
|
+
label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
1253
|
+
label,
|
|
1254
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1255
|
+
] }),
|
|
1256
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-field__control", children: [
|
|
1257
|
+
leadingIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__icon", "aria-hidden": "true", children: leadingIcon }),
|
|
1258
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1259
|
+
inputtext.InputText,
|
|
1260
|
+
{
|
|
1261
|
+
unstyled: true,
|
|
1262
|
+
ref,
|
|
1263
|
+
id: inputId,
|
|
1264
|
+
className: "cr-field__input",
|
|
1265
|
+
required,
|
|
1266
|
+
disabled,
|
|
1267
|
+
invalid: Boolean(error),
|
|
1268
|
+
"aria-invalid": error ? true : void 0,
|
|
1269
|
+
...props,
|
|
1270
|
+
"aria-describedby": juntarIds(supportText && hintId, props["aria-describedby"])
|
|
1271
|
+
}
|
|
1272
|
+
),
|
|
1273
|
+
trailingIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__icon", children: trailingIcon })
|
|
1274
|
+
] }),
|
|
1275
|
+
supportText && /* @__PURE__ */ jsxRuntime.jsxs("p", { id: hintId, className: `cr-field__hint${error ? " cr-field__hint--error" : ""}`, children: [
|
|
1276
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__hint-icon", "aria-hidden": "true", children: error ? /* @__PURE__ */ jsxRuntime.jsx(react$1.WarningCircle, {}) : /* @__PURE__ */ jsxRuntime.jsx(react$1.Info, {}) }),
|
|
1277
|
+
supportText
|
|
1278
|
+
] })
|
|
1279
|
+
] });
|
|
1280
|
+
});
|
|
1281
|
+
var Radio = react.forwardRef(function Radio2({
|
|
1282
|
+
label,
|
|
1283
|
+
showLabel = true,
|
|
1284
|
+
labelSize = "default",
|
|
1285
|
+
checked = false,
|
|
1286
|
+
value,
|
|
1287
|
+
name,
|
|
1288
|
+
onChange,
|
|
1289
|
+
disabled,
|
|
1290
|
+
required,
|
|
1291
|
+
id,
|
|
1292
|
+
className,
|
|
1293
|
+
style,
|
|
1294
|
+
...props
|
|
1295
|
+
}, ref) {
|
|
1296
|
+
const autoId = react.useId();
|
|
1297
|
+
const inputId = id ?? autoId;
|
|
1298
|
+
const classes2 = [
|
|
1299
|
+
"cr-radio",
|
|
1300
|
+
`cr-radio--label-${labelSize}`,
|
|
1301
|
+
disabled && "cr-radio--disabled",
|
|
1302
|
+
className
|
|
1303
|
+
].filter(Boolean).join(" ");
|
|
1304
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, style, children: [
|
|
1305
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1306
|
+
radiobutton.RadioButton,
|
|
1307
|
+
{
|
|
1308
|
+
unstyled: true,
|
|
1309
|
+
inputRef: ref,
|
|
1310
|
+
inputId,
|
|
1311
|
+
checked,
|
|
1312
|
+
value,
|
|
1313
|
+
name,
|
|
1314
|
+
onChange,
|
|
1315
|
+
disabled,
|
|
1316
|
+
required,
|
|
1317
|
+
pt: {
|
|
1318
|
+
// Marcado pela prop do Cristal, não pelo atributo interno do Prime (data-p-checked).
|
|
1319
|
+
root: { className: `cr-radio__control${checked ? " cr-radio__control--checked" : ""}` },
|
|
1320
|
+
input: { ...props, className: "cr-radio__input" },
|
|
1321
|
+
box: { className: "cr-radio__box" },
|
|
1322
|
+
icon: { className: "cr-radio__icon" }
|
|
1323
|
+
}
|
|
1324
|
+
}
|
|
1325
|
+
),
|
|
1326
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1327
|
+
"label",
|
|
1328
|
+
{
|
|
1329
|
+
className: `cr-radio__label${showLabel ? "" : " cr-radio__label--hidden cr-so-leitor"}`,
|
|
1330
|
+
htmlFor: inputId,
|
|
1331
|
+
children: label
|
|
1332
|
+
}
|
|
1333
|
+
)
|
|
1334
|
+
] });
|
|
1335
|
+
});
|
|
1336
|
+
|
|
1337
|
+
// src/components/DateRangeButton/periodos.ts
|
|
1338
|
+
var dia = (ano, mes, numero) => new Date(ano, mes, numero);
|
|
1339
|
+
var semHora = (data) => dia(data.getFullYear(), data.getMonth(), data.getDate());
|
|
1340
|
+
var menos = (data, dias) => dia(data.getFullYear(), data.getMonth(), data.getDate() - dias);
|
|
1341
|
+
var DATE_PERIODS = {
|
|
1342
|
+
today: { label: "Hoje", range: (hoje) => [semHora(hoje), semHora(hoje)] },
|
|
1343
|
+
yesterday: { label: "Ontem", range: (hoje) => [menos(hoje, 1), menos(hoje, 1)] },
|
|
1344
|
+
last7Days: { label: "\xDAltimos 7 dias", range: (hoje) => [menos(hoje, 6), semHora(hoje)] },
|
|
1345
|
+
last14Days: { label: "\xDAltimos 14 dias", range: (hoje) => [menos(hoje, 13), semHora(hoje)] },
|
|
1346
|
+
last30Days: { label: "\xDAltimos 30 dias", range: (hoje) => [menos(hoje, 29), semHora(hoje)] },
|
|
1347
|
+
thisMonth: {
|
|
1348
|
+
label: "Este m\xEAs",
|
|
1349
|
+
range: (hoje) => [dia(hoje.getFullYear(), hoje.getMonth(), 1), semHora(hoje)]
|
|
1350
|
+
},
|
|
1351
|
+
// A semana começa no domingo, como no calendário.
|
|
1352
|
+
lastWeek: {
|
|
1353
|
+
label: "Semana passada",
|
|
1354
|
+
range: (hoje) => {
|
|
1355
|
+
const domingo = menos(hoje, hoje.getDay() + 7);
|
|
1356
|
+
return [domingo, menos(domingo, -6)];
|
|
1357
|
+
}
|
|
1358
|
+
},
|
|
1359
|
+
lastMonth: {
|
|
1360
|
+
label: "M\xEAs passado",
|
|
1361
|
+
range: (hoje) => [
|
|
1362
|
+
dia(hoje.getFullYear(), hoje.getMonth() - 1, 1),
|
|
1363
|
+
dia(hoje.getFullYear(), hoje.getMonth(), 0)
|
|
1364
|
+
]
|
|
1365
|
+
},
|
|
1366
|
+
thisYear: {
|
|
1367
|
+
label: "Este ano",
|
|
1368
|
+
range: (hoje) => [dia(hoje.getFullYear(), 0, 1), semHora(hoje)]
|
|
1369
|
+
}
|
|
1370
|
+
};
|
|
1371
|
+
var PERIODOS_PADRAO = [
|
|
1372
|
+
DATE_PERIODS.today,
|
|
1373
|
+
DATE_PERIODS.yesterday,
|
|
1374
|
+
DATE_PERIODS.last7Days,
|
|
1375
|
+
DATE_PERIODS.last14Days,
|
|
1376
|
+
DATE_PERIODS.last30Days,
|
|
1377
|
+
DATE_PERIODS.thisMonth
|
|
1378
|
+
];
|
|
1379
|
+
var MESES = ["jan", "fev", "mar", "abr", "mai", "jun", "jul", "ago", "set", "out", "nov", "dez"];
|
|
1380
|
+
var dataPorExtenso = (data) => `${data.getDate()} de ${MESES[data.getMonth()]} de ${data.getFullYear()}`;
|
|
1381
|
+
var periodoPorExtenso = ([inicio, fim]) => `${dataPorExtenso(inicio)} a ${dataPorExtenso(fim)}`;
|
|
1382
|
+
var mesmoDia2 = (a, b) => !!a && !!b && semHora(a).getTime() === semHora(b).getTime();
|
|
1383
|
+
var periodoDe = (periods, range, hoje) => range ? periods.find((period) => {
|
|
1384
|
+
const [inicio, fim] = period.range(hoje);
|
|
1385
|
+
return mesmoDia2(inicio, range[0]) && mesmoDia2(fim, range[1]);
|
|
1386
|
+
}) : void 0;
|
|
1387
|
+
var dataCurta = (data) => data ? `${String(data.getDate()).padStart(2, "0")}/${String(data.getMonth() + 1).padStart(2, "0")}/${data.getFullYear()}` : "";
|
|
1388
|
+
function lerData(texto) {
|
|
1389
|
+
const partes = /^(\d{2})\/(\d{2})\/(\d{4})$/.exec(texto.replace(/\s/g, ""));
|
|
1390
|
+
if (!partes) return null;
|
|
1391
|
+
const [d, m, a] = [Number(partes[1]), Number(partes[2]), Number(partes[3])];
|
|
1392
|
+
const data = dia(a, m - 1, d);
|
|
1393
|
+
return data.getMonth() === m - 1 && data.getDate() === d ? data : null;
|
|
1394
|
+
}
|
|
1395
|
+
function mesDaTela(range, meses, hoje) {
|
|
1396
|
+
const base = (meses > 1 ? range[1] : range[0]) ?? range[0] ?? hoje;
|
|
1397
|
+
return new Date(base.getFullYear(), base.getMonth() - (meses > 1 ? 1 : 0), 1);
|
|
1398
|
+
}
|
|
1399
|
+
function PainelDePeriodo({
|
|
1400
|
+
value,
|
|
1401
|
+
periods,
|
|
1402
|
+
footer,
|
|
1403
|
+
today,
|
|
1404
|
+
numberOfMonths,
|
|
1405
|
+
minDate,
|
|
1406
|
+
maxDate,
|
|
1407
|
+
disabledDates,
|
|
1408
|
+
offDays,
|
|
1409
|
+
onSelect,
|
|
1410
|
+
onClose
|
|
1411
|
+
}) {
|
|
1412
|
+
const grupo = react.useId();
|
|
1413
|
+
const [rascunho, setRascunho] = react.useState(value ?? [null, null]);
|
|
1414
|
+
const [periodo, setPeriodo] = react.useState(() => periodoDe(periods, value, today) ?? null);
|
|
1415
|
+
const [textos, setTextos] = react.useState([
|
|
1416
|
+
dataCurta(value?.[0]),
|
|
1417
|
+
dataCurta(value?.[1])
|
|
1418
|
+
]);
|
|
1419
|
+
const [mes, setMes] = react.useState(() => mesDaTela(rascunho, numberOfMonths, today));
|
|
1420
|
+
const mudar = (novo, novoPeriodo, mudarTextos = true) => {
|
|
1421
|
+
setRascunho(novo);
|
|
1422
|
+
setPeriodo(novoPeriodo);
|
|
1423
|
+
if (mudarTextos) setTextos([dataCurta(novo[0]), dataCurta(novo[1])]);
|
|
1424
|
+
if (!footer && novo[0] && novo[1]) onSelect([novo[0], novo[1]], novoPeriodo);
|
|
1425
|
+
};
|
|
1426
|
+
const escolherPeriodo = (item) => {
|
|
1427
|
+
const range = item.range(today);
|
|
1428
|
+
setMes(mesDaTela(range, numberOfMonths, today));
|
|
1429
|
+
mudar(range, item);
|
|
1430
|
+
};
|
|
1431
|
+
const digitar = (indice, texto) => {
|
|
1432
|
+
const novosTextos = [...textos];
|
|
1433
|
+
novosTextos[indice] = texto;
|
|
1434
|
+
setTextos(novosTextos);
|
|
1435
|
+
const data = lerData(texto);
|
|
1436
|
+
if (!data) return;
|
|
1437
|
+
const novo = [...rascunho];
|
|
1438
|
+
novo[indice] = data;
|
|
1439
|
+
if (novo[0] && novo[1] && novo[0] > novo[1]) novo[indice === 0 ? 1 : 0] = null;
|
|
1440
|
+
setMes(mesDaTela(novo, numberOfMonths, today));
|
|
1441
|
+
mudar(novo, null, false);
|
|
1442
|
+
};
|
|
1443
|
+
const [inicio, fim] = rascunho;
|
|
1444
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-date-range", children: [
|
|
1445
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-date-range__body", children: [
|
|
1446
|
+
periods.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cr-date-range__periods", role: "radiogroup", "aria-label": "Per\xEDodos", children: periods.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
1447
|
+
Radio,
|
|
1448
|
+
{
|
|
1449
|
+
className: "cr-date-range__period",
|
|
1450
|
+
name: grupo,
|
|
1451
|
+
label: item.label,
|
|
1452
|
+
value: item.label,
|
|
1453
|
+
checked: periodo === item,
|
|
1454
|
+
onChange: () => escolherPeriodo(item)
|
|
1455
|
+
},
|
|
1456
|
+
item.label
|
|
1457
|
+
)) }),
|
|
1458
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-date-range__calendars", children: [
|
|
1459
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-date-range__inputs", children: [
|
|
1460
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1461
|
+
Input,
|
|
1462
|
+
{
|
|
1463
|
+
size: "medium",
|
|
1464
|
+
"aria-label": "Data inicial",
|
|
1465
|
+
placeholder: "dd / mm / aaaa",
|
|
1466
|
+
value: textos[0],
|
|
1467
|
+
onChange: (event) => digitar(0, event.target.value)
|
|
1468
|
+
}
|
|
1469
|
+
),
|
|
1470
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-date-range__dash", "aria-hidden": "true", children: "-" }),
|
|
1471
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1472
|
+
Input,
|
|
1473
|
+
{
|
|
1474
|
+
size: "medium",
|
|
1475
|
+
"aria-label": "Data final",
|
|
1476
|
+
placeholder: "dd / mm / aaaa",
|
|
1477
|
+
value: textos[1],
|
|
1478
|
+
onChange: (event) => digitar(1, event.target.value)
|
|
1479
|
+
}
|
|
1480
|
+
)
|
|
1481
|
+
] }),
|
|
1482
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1483
|
+
Calendar,
|
|
1484
|
+
{
|
|
1485
|
+
selectionMode: "range",
|
|
1486
|
+
numberOfMonths,
|
|
1487
|
+
value: rascunho,
|
|
1488
|
+
viewDate: mes,
|
|
1489
|
+
onViewDateChange: (event) => setMes(event.value),
|
|
1490
|
+
onChange: (event) => {
|
|
1491
|
+
const [inicio2 = null, fim2 = null] = event.value ?? [];
|
|
1492
|
+
mudar([inicio2, fim2], null);
|
|
1493
|
+
},
|
|
1494
|
+
minDate,
|
|
1495
|
+
maxDate,
|
|
1496
|
+
disabledDates,
|
|
1497
|
+
offDays
|
|
1498
|
+
}
|
|
1499
|
+
)
|
|
1500
|
+
] })
|
|
1501
|
+
] }),
|
|
1502
|
+
footer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-date-range__footer", children: [
|
|
1503
|
+
/* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "tertiary", size: "medium", onClick: onClose, children: "Fechar" }),
|
|
1504
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1505
|
+
Button,
|
|
1506
|
+
{
|
|
1507
|
+
size: "medium",
|
|
1508
|
+
disabled: !inicio || !fim,
|
|
1509
|
+
onClick: () => inicio && fim && onSelect([inicio, fim], periodo),
|
|
1510
|
+
children: "Selecionar"
|
|
1511
|
+
}
|
|
1512
|
+
)
|
|
1513
|
+
] })
|
|
1514
|
+
] });
|
|
1515
|
+
}
|
|
1516
|
+
var DateRangeButton = react.forwardRef(
|
|
1517
|
+
function DateRangeButton2({
|
|
1518
|
+
value = null,
|
|
1519
|
+
onChange,
|
|
1520
|
+
label,
|
|
1521
|
+
required,
|
|
1522
|
+
placeholder = "Selecione o per\xEDodo",
|
|
1523
|
+
periods = PERIODOS_PADRAO,
|
|
1524
|
+
footer = true,
|
|
1525
|
+
numberOfMonths = 2,
|
|
1526
|
+
minDate,
|
|
1527
|
+
maxDate,
|
|
1528
|
+
disabledDates,
|
|
1529
|
+
offDays,
|
|
1530
|
+
today,
|
|
1531
|
+
disabled,
|
|
1532
|
+
id,
|
|
1533
|
+
className,
|
|
1534
|
+
style
|
|
1535
|
+
}, ref) {
|
|
1536
|
+
const autoId = react.useId();
|
|
1537
|
+
const botaoId = id ?? autoId;
|
|
1538
|
+
const rotuloId = `${botaoId}-rotulo`;
|
|
1539
|
+
const textoId = `${botaoId}-texto`;
|
|
1540
|
+
const painelId = `${botaoId}-painel`;
|
|
1541
|
+
const painel = react.useRef(null);
|
|
1542
|
+
const botao = react.useRef(null);
|
|
1543
|
+
const [aberto, setAberto] = react.useState(false);
|
|
1544
|
+
const [hoje, setHoje] = react.useState(() => today ?? /* @__PURE__ */ new Date());
|
|
1545
|
+
const periodo = periodoDe(periods, value, today ?? hoje);
|
|
1546
|
+
const classes2 = ["cr-field", "cr-date-range-field", disabled && "cr-field--disabled", className].filter(Boolean).join(" ");
|
|
1547
|
+
const fechar = () => painel.current?.hide();
|
|
1548
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, style, children: [
|
|
1549
|
+
label && /* @__PURE__ */ jsxRuntime.jsxs("span", { id: rotuloId, className: "cr-field__label", children: [
|
|
1550
|
+
label,
|
|
1551
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1552
|
+
] }),
|
|
1553
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1554
|
+
button.Button,
|
|
1555
|
+
{
|
|
1556
|
+
unstyled: true,
|
|
1557
|
+
ref: (elemento) => {
|
|
1558
|
+
const el = elemento;
|
|
1559
|
+
botao.current = el;
|
|
1560
|
+
if (typeof ref === "function") ref(el);
|
|
1561
|
+
else if (ref) ref.current = el;
|
|
1562
|
+
},
|
|
1563
|
+
id: botaoId,
|
|
1564
|
+
type: "button",
|
|
1565
|
+
className: "cr-date-range-button",
|
|
1566
|
+
disabled,
|
|
1567
|
+
"aria-haspopup": "dialog",
|
|
1568
|
+
"aria-expanded": aberto,
|
|
1569
|
+
"aria-controls": aberto ? painelId : void 0,
|
|
1570
|
+
"aria-labelledby": label ? `${rotuloId} ${textoId}` : void 0,
|
|
1571
|
+
onClick: (event) => {
|
|
1572
|
+
setHoje(today ?? /* @__PURE__ */ new Date());
|
|
1573
|
+
painel.current?.toggle(event);
|
|
1574
|
+
},
|
|
1575
|
+
children: [
|
|
1576
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-date-range-button__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(react$1.CalendarDots, {}) }),
|
|
1577
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { id: textoId, className: "cr-date-range-button__text", children: value ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1578
|
+
periodo && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cr-date-range-button__period", children: [
|
|
1579
|
+
periodo.label,
|
|
1580
|
+
":"
|
|
1581
|
+
] }),
|
|
1582
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: periodoPorExtenso(value) })
|
|
1583
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-date-range-button__placeholder", children: placeholder }) }),
|
|
1584
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-date-range-button__caret", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(react$1.CaretDown, {}) })
|
|
1585
|
+
]
|
|
1586
|
+
}
|
|
1587
|
+
),
|
|
1588
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1589
|
+
overlaypanel.OverlayPanel,
|
|
1590
|
+
{
|
|
1591
|
+
ref: painel,
|
|
1592
|
+
unstyled: true,
|
|
1593
|
+
id: painelId,
|
|
1594
|
+
onShow: () => {
|
|
1595
|
+
setAberto(true);
|
|
1596
|
+
const raiz = document.getElementById(painelId);
|
|
1597
|
+
const alvo = raiz?.querySelector('input[type="radio"]:checked') ?? raiz?.querySelector('input, button, [tabindex="0"]');
|
|
1598
|
+
alvo?.focus();
|
|
1599
|
+
},
|
|
1600
|
+
onHide: () => {
|
|
1601
|
+
setAberto(false);
|
|
1602
|
+
const ativo = document.activeElement;
|
|
1603
|
+
if (ativo === document.body || document.getElementById(painelId)?.contains(ativo)) {
|
|
1604
|
+
botao.current?.focus();
|
|
1605
|
+
}
|
|
1606
|
+
},
|
|
1607
|
+
pt: {
|
|
1608
|
+
root: {
|
|
1609
|
+
className: "cr-date-range__panel",
|
|
1610
|
+
role: "dialog",
|
|
1611
|
+
"aria-label": label ?? "Escolher per\xEDodo"
|
|
1612
|
+
},
|
|
1613
|
+
// Animação de entrada e saída (a do Prime) e o lado do painel em relação ao botão.
|
|
1614
|
+
transition: transicaoDoPopup(
|
|
1615
|
+
() => seguirLado(document.getElementById(painelId), botao.current)
|
|
1616
|
+
)
|
|
1617
|
+
},
|
|
1618
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1619
|
+
PainelDePeriodo,
|
|
1620
|
+
{
|
|
1621
|
+
value,
|
|
1622
|
+
periods,
|
|
1623
|
+
footer,
|
|
1624
|
+
today: today ?? hoje,
|
|
1625
|
+
numberOfMonths,
|
|
1626
|
+
minDate,
|
|
1627
|
+
maxDate,
|
|
1628
|
+
disabledDates,
|
|
1629
|
+
offDays,
|
|
1630
|
+
onClose: fechar,
|
|
1631
|
+
onSelect: (range, item) => {
|
|
1632
|
+
onChange?.({ value: range, period: item });
|
|
1633
|
+
fechar();
|
|
1634
|
+
}
|
|
1635
|
+
}
|
|
1636
|
+
)
|
|
1637
|
+
}
|
|
1638
|
+
)
|
|
1639
|
+
] });
|
|
1640
|
+
}
|
|
1641
|
+
);
|
|
926
1642
|
var Divider = react.forwardRef(function Divider2({ orientation = "horizontal", variant = "solid", className, style, ...props }, ref) {
|
|
927
1643
|
const primeRef = react.useRef(null);
|
|
928
1644
|
react.useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
929
|
-
const
|
|
1645
|
+
const classes2 = ["cr-divider", `cr-divider--${orientation}`, `cr-divider--${variant}`, className].filter(Boolean).join(" ");
|
|
930
1646
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
931
1647
|
divider.Divider,
|
|
932
1648
|
{
|
|
@@ -934,7 +1650,7 @@ var Divider = react.forwardRef(function Divider2({ orientation = "horizontal", v
|
|
|
934
1650
|
ref: primeRef,
|
|
935
1651
|
layout: orientation,
|
|
936
1652
|
pt: {
|
|
937
|
-
root: { className:
|
|
1653
|
+
root: { className: classes2, style },
|
|
938
1654
|
content: { className: "cr-divider__content" }
|
|
939
1655
|
},
|
|
940
1656
|
...props
|
|
@@ -961,7 +1677,7 @@ var IconButton = react.forwardRef(function IconButton2({
|
|
|
961
1677
|
[ref]
|
|
962
1678
|
);
|
|
963
1679
|
const texto = tooltip ?? props["aria-label"];
|
|
964
|
-
const
|
|
1680
|
+
const classes2 = [
|
|
965
1681
|
"cr-icon-button",
|
|
966
1682
|
`cr-icon-button--${variant}`,
|
|
967
1683
|
`cr-icon-button--${size}`,
|
|
@@ -974,7 +1690,7 @@ var IconButton = react.forwardRef(function IconButton2({
|
|
|
974
1690
|
unstyled: true,
|
|
975
1691
|
ref: ligar,
|
|
976
1692
|
type,
|
|
977
|
-
className:
|
|
1693
|
+
className: classes2,
|
|
978
1694
|
...props,
|
|
979
1695
|
children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-icon-button__icon", "aria-hidden": "true", children: icon })
|
|
980
1696
|
}
|
|
@@ -1051,7 +1767,7 @@ var Drawer = react.forwardRef(function Drawer2({
|
|
|
1051
1767
|
primeiro.focus();
|
|
1052
1768
|
}
|
|
1053
1769
|
};
|
|
1054
|
-
const
|
|
1770
|
+
const classes2 = [
|
|
1055
1771
|
"cr-drawer",
|
|
1056
1772
|
`cr-drawer--${side}`,
|
|
1057
1773
|
`cr-drawer--${behavior}`,
|
|
@@ -1076,7 +1792,7 @@ var Drawer = react.forwardRef(function Drawer2({
|
|
|
1076
1792
|
className: `cr-drawer__mask cr-drawer__mask--${side}${modal ? "" : " cr-drawer__mask--sem-overlay"}`
|
|
1077
1793
|
},
|
|
1078
1794
|
root: {
|
|
1079
|
-
className:
|
|
1795
|
+
className: classes2,
|
|
1080
1796
|
role: "dialog",
|
|
1081
1797
|
"aria-modal": modal || void 0,
|
|
1082
1798
|
"aria-labelledby": titleId,
|
|
@@ -1147,62 +1863,6 @@ var Drawer = react.forwardRef(function Drawer2({
|
|
|
1147
1863
|
}
|
|
1148
1864
|
);
|
|
1149
1865
|
});
|
|
1150
|
-
var Input = react.forwardRef(function Input2({
|
|
1151
|
-
variant = "outline",
|
|
1152
|
-
size = "large",
|
|
1153
|
-
label,
|
|
1154
|
-
leadingIcon,
|
|
1155
|
-
trailingIcon,
|
|
1156
|
-
hint,
|
|
1157
|
-
error,
|
|
1158
|
-
id,
|
|
1159
|
-
required,
|
|
1160
|
-
disabled,
|
|
1161
|
-
className,
|
|
1162
|
-
...props
|
|
1163
|
-
}, ref) {
|
|
1164
|
-
const autoId = react.useId();
|
|
1165
|
-
const inputId = id ?? autoId;
|
|
1166
|
-
const hintId = `${inputId}-hint`;
|
|
1167
|
-
const supportText = error ?? hint;
|
|
1168
|
-
const classes = [
|
|
1169
|
-
"cr-field",
|
|
1170
|
-
`cr-field--${variant}`,
|
|
1171
|
-
`cr-field--${size}`,
|
|
1172
|
-
error && "cr-field--error",
|
|
1173
|
-
disabled && "cr-field--disabled",
|
|
1174
|
-
className
|
|
1175
|
-
].filter(Boolean).join(" ");
|
|
1176
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes, children: [
|
|
1177
|
-
label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
1178
|
-
label,
|
|
1179
|
-
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1180
|
-
] }),
|
|
1181
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-field__control", children: [
|
|
1182
|
-
leadingIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__icon", "aria-hidden": "true", children: leadingIcon }),
|
|
1183
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1184
|
-
inputtext.InputText,
|
|
1185
|
-
{
|
|
1186
|
-
unstyled: true,
|
|
1187
|
-
ref,
|
|
1188
|
-
id: inputId,
|
|
1189
|
-
className: "cr-field__input",
|
|
1190
|
-
required,
|
|
1191
|
-
disabled,
|
|
1192
|
-
invalid: Boolean(error),
|
|
1193
|
-
"aria-invalid": error ? true : void 0,
|
|
1194
|
-
...props,
|
|
1195
|
-
"aria-describedby": juntarIds(supportText && hintId, props["aria-describedby"])
|
|
1196
|
-
}
|
|
1197
|
-
),
|
|
1198
|
-
trailingIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__icon", children: trailingIcon })
|
|
1199
|
-
] }),
|
|
1200
|
-
supportText && /* @__PURE__ */ jsxRuntime.jsxs("p", { id: hintId, className: `cr-field__hint${error ? " cr-field__hint--error" : ""}`, children: [
|
|
1201
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__hint-icon", "aria-hidden": "true", children: error ? /* @__PURE__ */ jsxRuntime.jsx(react$1.WarningCircle, {}) : /* @__PURE__ */ jsxRuntime.jsx(react$1.Info, {}) }),
|
|
1202
|
-
supportText
|
|
1203
|
-
] })
|
|
1204
|
-
] });
|
|
1205
|
-
});
|
|
1206
1866
|
|
|
1207
1867
|
// src/components/Menubar/assets/vector-logo-simbolo.svg
|
|
1208
1868
|
var vector_logo_simbolo_default = 'data:image/svg+xml,<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="42.7061" height="20" viewBox="0 0 42.7061 20" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<g id="Grupo 2380">%0A<path id="Caminho 1049" d="M26.8782 10.21C26.8393 10.1525 26.7869 10.1055 26.7255 10.0731C26.6642 10.0408 26.5958 10.024 26.5264 10.0244H4.21626C4.14666 10.024 4.07803 10.0408 4.0165 10.0733C3.95497 10.1059 3.90244 10.1531 3.8636 10.2109C3.82535 10.2676 3.80224 10.3333 3.79648 10.4015C3.79072 10.4697 3.80251 10.5383 3.8307 10.6007L7.35895 19.7545C7.39283 19.8281 7.44722 19.8905 7.51559 19.934C7.58397 19.9776 7.66345 20.0005 7.74451 20C7.82641 19.9998 7.90647 19.9758 7.97493 19.9308C8.0434 19.8859 8.09731 19.822 8.13007 19.7469L11.5604 13.47H25.3511C25.4325 13.4705 25.5123 13.4474 25.5809 13.4035C25.6494 13.3596 25.7038 13.2969 25.7375 13.2228L26.9086 10.5964C26.9365 10.5347 26.9484 10.4669 26.9431 10.3993C26.9378 10.3318 26.9154 10.2666 26.8782 10.21V10.21Z" fill="%23C1BFBF"/>%0A<g id="Grupo 2378">%0A<path id="Caminho 1050" d="M26.3926 6.06543L24.0666 19.1424C24.0588 19.2502 24.0736 19.3585 24.1103 19.4602C24.1469 19.5619 24.2045 19.6549 24.2792 19.7329C24.3554 19.813 24.447 19.8767 24.5485 19.9202C24.65 19.9637 24.7593 19.9861 24.8698 19.986H30.4229L29.2578 13.5446L26.3926 6.06543Z" fill="%231545DE"/>%0A<g id="Grupo 2377">%0A<path id="Caminho 1051" d="M42.2783 16.0921H42.0598C42.0303 11.9033 41.8911 10.7668 41.2541 10.086C40.167 9.29536 38.9793 8.65329 37.7225 8.17676C37.1378 7.91016 36.4755 7.60812 36.3684 7.52881C36.1102 7.27149 34.8768 5.05179 34.2145 3.85884C33.9378 3.36107 33.6956 2.92488 33.5311 2.63887C33.166 1.80107 32.5487 1.09795 31.7653 0.627372C30.9818 0.15679 30.0712 -0.0578392 29.16 0.0133599H21.1072C21.036 0.0134652 20.966 0.0313585 20.9036 0.0653944C20.8411 0.0994303 20.7881 0.148532 20.7494 0.208251C20.7106 0.268417 20.6872 0.337237 20.6813 0.408613C20.6754 0.479989 20.6872 0.551716 20.7157 0.617433L28.9955 19.7283C29.0285 19.8051 29.0832 19.8705 29.1529 19.9166C29.2226 19.9626 29.3043 19.9872 29.3878 19.9873H30.9849C31.0972 19.9869 31.2048 19.9425 31.2848 19.8637C31.3648 19.7848 31.4107 19.6778 31.4126 19.5655C31.4126 18.581 31.8037 17.6368 32.4999 16.9406C33.1961 16.2444 34.1403 15.8533 35.1248 15.8533C36.1093 15.8533 37.0535 16.2444 37.7497 16.9406C38.4459 17.6368 38.837 18.581 38.837 19.5655C38.839 19.6778 38.8848 19.7848 38.9648 19.8637C39.0447 19.9425 39.1524 19.9869 39.2647 19.9873H41.6396C41.6961 19.9871 41.752 19.9758 41.8041 19.9539C41.8561 19.9321 41.9034 19.9002 41.9431 19.8601C41.9828 19.82 42.0143 19.7724 42.0356 19.7201C42.0569 19.6678 42.0677 19.6119 42.0674 19.5554C42.0674 19.2179 42.0674 18.9015 42.0674 18.5911H42.2783C42.3923 18.5904 42.5013 18.5445 42.5815 18.4636C42.6617 18.3826 42.7065 18.2731 42.7061 18.1591V16.5241C42.7065 16.4101 42.6617 16.3006 42.5815 16.2196C42.5013 16.1386 42.3923 16.0928 42.2783 16.0921V16.0921ZM31.6058 8.33621H27.9359C27.7958 8.33732 27.6591 8.29246 27.547 8.20849C27.4348 8.12452 27.3533 8.00609 27.3149 7.87135L26.0545 3.91029C26.0293 3.8176 26.0262 3.72028 26.0455 3.62619C26.0649 3.5321 26.1061 3.44388 26.1658 3.36866C26.2264 3.29247 26.3034 3.23091 26.391 3.18856C26.4786 3.1462 26.5747 3.12414 26.672 3.124H28.9305C29.2861 3.13975 29.6349 3.22716 29.9558 3.38098C30.2768 3.53479 30.5634 3.75184 30.7984 4.01912C31.7475 5.02307 32.2662 6.35841 32.2437 7.73973C32.2339 7.90191 32.1624 8.05419 32.0437 8.16517C31.925 8.27615 31.7683 8.33736 31.6058 8.33621V8.33621Z" fill="%231545DE"/>%0A</g>%0A</g>%0A<path id="Caminho 1052" d="M18.318 0.208784C18.2779 0.150057 18.224 0.102045 18.1611 0.0689531C18.0981 0.0358617 18.028 0.0186933 17.9569 0.0189526H0.432107C0.361515 0.0187583 0.291932 0.0356991 0.229331 0.0683223C0.166729 0.100945 0.112985 0.148276 0.0727059 0.206248C0.0332923 0.263519 0.00898875 0.329827 0.00205642 0.399002C-0.00487591 0.468178 0.00578389 0.537987 0.0330492 0.601939L1.0404 3.29747C1.07434 3.3749 1.13023 3.44069 1.20115 3.48672C1.27206 3.53275 1.35491 3.55701 1.43945 3.55648H16.5134C16.5968 3.55702 16.6787 3.53341 16.749 3.4885C16.8194 3.44359 16.8753 3.37931 16.9099 3.30338L18.3526 0.607835C18.3813 0.543894 18.3933 0.473655 18.3872 0.403804C18.3812 0.333954 18.3573 0.266823 18.318 0.208784V0.208784Z" fill="%23C1BFBF"/>%0A<path id="Caminho 1053" d="M20.2107 5.18251C20.1706 5.12378 20.1167 5.07577 20.0538 5.04268C19.9908 5.00959 19.9207 4.99242 19.8496 4.99268H2.32482C2.25423 4.99248 2.18465 5.00943 2.12205 5.04205C2.05945 5.07467 2.0057 5.122 1.96542 5.17997C1.92601 5.23725 1.9017 5.30355 1.89477 5.37273C1.88784 5.4419 1.8985 5.51171 1.92577 5.57567L2.93311 8.2712C2.96706 8.34863 3.02294 8.41442 3.09386 8.46045C3.16478 8.50648 3.24763 8.53073 3.33217 8.53021H18.4061C18.4896 8.53075 18.5714 8.50714 18.6417 8.46224C18.7121 8.41733 18.768 8.35304 18.8026 8.27711L20.2453 5.58157C20.274 5.51761 20.2859 5.44738 20.2798 5.37754C20.2738 5.30771 20.25 5.24058 20.2107 5.18251V5.18251Z" fill="%23C1BFBF"/>%0A</g>%0A</svg>%0A';
|
|
@@ -1223,7 +1883,7 @@ function ToolButton({ tool }) {
|
|
|
1223
1883
|
const hasMenu = Boolean(tool.menu?.length);
|
|
1224
1884
|
const hasBadge = tool.badge !== void 0 && tool.badge !== null;
|
|
1225
1885
|
const name = hasBadge ? `${tool.label}, ${tool.badgeLabel ?? String(tool.badge)}` : tool.label;
|
|
1226
|
-
const
|
|
1886
|
+
const classes2 = [
|
|
1227
1887
|
"cr-menubar__tool",
|
|
1228
1888
|
tool.showOnTablet && "cr-menubar__tool--tablet",
|
|
1229
1889
|
open && "cr-menubar__tool--active"
|
|
@@ -1235,7 +1895,7 @@ function ToolButton({ tool }) {
|
|
|
1235
1895
|
unstyled: true,
|
|
1236
1896
|
ref: buttonRef,
|
|
1237
1897
|
type: "button",
|
|
1238
|
-
className:
|
|
1898
|
+
className: classes2,
|
|
1239
1899
|
"aria-label": name,
|
|
1240
1900
|
"aria-haspopup": hasMenu ? "menu" : void 0,
|
|
1241
1901
|
"aria-expanded": hasMenu ? open : void 0,
|
|
@@ -1339,7 +1999,7 @@ var Menubar = react.forwardRef(function Menubar2({
|
|
|
1339
1999
|
event.preventDefault();
|
|
1340
2000
|
onSearch?.(search);
|
|
1341
2001
|
};
|
|
1342
|
-
const
|
|
2002
|
+
const classes2 = ["cr-menubar", !showSearch && "cr-menubar--no-search", className].filter(Boolean).join(" ");
|
|
1343
2003
|
const pt = {
|
|
1344
2004
|
// A área start some do layout (display: contents): o início e a busca viram colunas do grid.
|
|
1345
2005
|
start: { className: "cr-menubar__start" },
|
|
@@ -1394,7 +2054,7 @@ var Menubar = react.forwardRef(function Menubar2({
|
|
|
1394
2054
|
tools.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cr-menubar__tools", children: tools.map((tool) => /* @__PURE__ */ jsxRuntime.jsx(ToolButton, { tool }, tool.label)) }),
|
|
1395
2055
|
user && /* @__PURE__ */ jsxRuntime.jsx(Profile, { user, menu: userMenu })
|
|
1396
2056
|
] }) : null;
|
|
1397
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, id, className:
|
|
2057
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, id, className: classes2, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1398
2058
|
menubar.Menubar,
|
|
1399
2059
|
{
|
|
1400
2060
|
...props,
|
|
@@ -1410,13 +2070,13 @@ var Menubar = react.forwardRef(function Menubar2({
|
|
|
1410
2070
|
var Tag = react.forwardRef(function Tag2({ variant = "default", size = "small", icon, className, children, ...props }, ref) {
|
|
1411
2071
|
const primeRef = react.useRef(null);
|
|
1412
2072
|
react.useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
1413
|
-
const
|
|
2073
|
+
const classes2 = ["cr-tag", `cr-tag--${variant}`, `cr-tag--${size}`, className].filter(Boolean).join(" ");
|
|
1414
2074
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1415
2075
|
tag.Tag,
|
|
1416
2076
|
{
|
|
1417
2077
|
unstyled: true,
|
|
1418
2078
|
ref: primeRef,
|
|
1419
|
-
className:
|
|
2079
|
+
className: classes2,
|
|
1420
2080
|
icon: icon ? () => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-tag__icon", "aria-hidden": "true", children: icon }) : void 0,
|
|
1421
2081
|
value: children,
|
|
1422
2082
|
...props
|
|
@@ -1506,7 +2166,7 @@ var MenuPrincipal = react.forwardRef(
|
|
|
1506
2166
|
);
|
|
1507
2167
|
anterior = entry;
|
|
1508
2168
|
});
|
|
1509
|
-
const
|
|
2169
|
+
const classes2 = ["cr-menu-principal", popup && "cr-menu-principal--popup", className].filter(Boolean).join(" ");
|
|
1510
2170
|
const pt = {
|
|
1511
2171
|
// O nome acessível vai na lista (role=menu), como no Menu.
|
|
1512
2172
|
menu: {
|
|
@@ -1533,7 +2193,7 @@ var MenuPrincipal = react.forwardRef(
|
|
|
1533
2193
|
unstyled: true,
|
|
1534
2194
|
ref: primeRef,
|
|
1535
2195
|
id,
|
|
1536
|
-
className:
|
|
2196
|
+
className: classes2,
|
|
1537
2197
|
style: popup && baseDoAlvo !== void 0 ? { "--cr-menu-principal-topo": `${baseDoAlvo}px` } : void 0,
|
|
1538
2198
|
model: items,
|
|
1539
2199
|
popup,
|
|
@@ -1616,7 +2276,7 @@ var Modal = react.forwardRef(function Modal2({
|
|
|
1616
2276
|
[...body.children].forEach((child) => observer.observe(child));
|
|
1617
2277
|
return () => observer.disconnect();
|
|
1618
2278
|
}, [body, children]);
|
|
1619
|
-
const
|
|
2279
|
+
const classes2 = ["cr-modal", `cr-modal--${size}`, rolavel && "cr-modal--scrollable", className].filter(Boolean).join(" ");
|
|
1620
2280
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1621
2281
|
dialog.Dialog,
|
|
1622
2282
|
{
|
|
@@ -1633,7 +2293,7 @@ var Modal = react.forwardRef(function Modal2({
|
|
|
1633
2293
|
pt: {
|
|
1634
2294
|
mask: { className: "cr-modal__mask" },
|
|
1635
2295
|
root: {
|
|
1636
|
-
className:
|
|
2296
|
+
className: classes2,
|
|
1637
2297
|
"aria-labelledby": titleId,
|
|
1638
2298
|
"aria-describedby": void 0
|
|
1639
2299
|
},
|
|
@@ -1724,7 +2384,7 @@ var MultiSelect = react.forwardRef(function MultiSelect2({
|
|
|
1724
2384
|
const supportText = error ?? hint;
|
|
1725
2385
|
const selected = value ?? [];
|
|
1726
2386
|
const overflow = selected.length > maxChips;
|
|
1727
|
-
const
|
|
2387
|
+
const classes2 = [
|
|
1728
2388
|
"cr-field",
|
|
1729
2389
|
`cr-field--${variant}`,
|
|
1730
2390
|
`cr-field--${size}`,
|
|
@@ -1835,7 +2495,7 @@ var MultiSelect = react.forwardRef(function MultiSelect2({
|
|
|
1835
2495
|
// Animação de entrada e saída da lista, a do Prime (comum.css).
|
|
1836
2496
|
transition: transicaoDoPopup()
|
|
1837
2497
|
};
|
|
1838
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
2498
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, children: [
|
|
1839
2499
|
label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
1840
2500
|
label,
|
|
1841
2501
|
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
@@ -1912,8 +2572,8 @@ var PageHeader = react.forwardRef(function PageHeader2({
|
|
|
1912
2572
|
);
|
|
1913
2573
|
}
|
|
1914
2574
|
);
|
|
1915
|
-
const
|
|
1916
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className:
|
|
2575
|
+
const classes2 = ["cr-page-header", `cr-page-header--${variant}`, className].filter(Boolean).join(" ");
|
|
2576
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: classes2, ...props, children: [
|
|
1917
2577
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1918
2578
|
"div",
|
|
1919
2579
|
{
|
|
@@ -2013,7 +2673,7 @@ var Select = react.forwardRef(function Select2({
|
|
|
2013
2673
|
},
|
|
2014
2674
|
[ref]
|
|
2015
2675
|
);
|
|
2016
|
-
const
|
|
2676
|
+
const classes2 = [
|
|
2017
2677
|
"cr-field",
|
|
2018
2678
|
`cr-field--${variant}`,
|
|
2019
2679
|
`cr-field--${size}`,
|
|
@@ -2055,7 +2715,7 @@ var Select = react.forwardRef(function Select2({
|
|
|
2055
2715
|
}),
|
|
2056
2716
|
emptyMessage: { className: "cr-lista__item cr-select__item cr-select__empty" }
|
|
2057
2717
|
};
|
|
2058
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
2718
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, children: [
|
|
2059
2719
|
label && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
2060
2720
|
label,
|
|
2061
2721
|
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
@@ -2208,61 +2868,6 @@ var Panel = react.forwardRef(function Panel2({ className, style, children, ...pr
|
|
|
2208
2868
|
}
|
|
2209
2869
|
);
|
|
2210
2870
|
});
|
|
2211
|
-
var Radio = react.forwardRef(function Radio2({
|
|
2212
|
-
label,
|
|
2213
|
-
showLabel = true,
|
|
2214
|
-
labelSize = "default",
|
|
2215
|
-
checked = false,
|
|
2216
|
-
value,
|
|
2217
|
-
name,
|
|
2218
|
-
onChange,
|
|
2219
|
-
disabled,
|
|
2220
|
-
required,
|
|
2221
|
-
id,
|
|
2222
|
-
className,
|
|
2223
|
-
style,
|
|
2224
|
-
...props
|
|
2225
|
-
}, ref) {
|
|
2226
|
-
const autoId = react.useId();
|
|
2227
|
-
const inputId = id ?? autoId;
|
|
2228
|
-
const classes = [
|
|
2229
|
-
"cr-radio",
|
|
2230
|
-
`cr-radio--label-${labelSize}`,
|
|
2231
|
-
disabled && "cr-radio--disabled",
|
|
2232
|
-
className
|
|
2233
|
-
].filter(Boolean).join(" ");
|
|
2234
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes, style, children: [
|
|
2235
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2236
|
-
radiobutton.RadioButton,
|
|
2237
|
-
{
|
|
2238
|
-
unstyled: true,
|
|
2239
|
-
inputRef: ref,
|
|
2240
|
-
inputId,
|
|
2241
|
-
checked,
|
|
2242
|
-
value,
|
|
2243
|
-
name,
|
|
2244
|
-
onChange,
|
|
2245
|
-
disabled,
|
|
2246
|
-
required,
|
|
2247
|
-
pt: {
|
|
2248
|
-
// Marcado pela prop do Cristal, não pelo atributo interno do Prime (data-p-checked).
|
|
2249
|
-
root: { className: `cr-radio__control${checked ? " cr-radio__control--checked" : ""}` },
|
|
2250
|
-
input: { ...props, className: "cr-radio__input" },
|
|
2251
|
-
box: { className: "cr-radio__box" },
|
|
2252
|
-
icon: { className: "cr-radio__icon" }
|
|
2253
|
-
}
|
|
2254
|
-
}
|
|
2255
|
-
),
|
|
2256
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2257
|
-
"label",
|
|
2258
|
-
{
|
|
2259
|
-
className: `cr-radio__label${showLabel ? "" : " cr-radio__label--hidden cr-so-leitor"}`,
|
|
2260
|
-
htmlFor: inputId,
|
|
2261
|
-
children: label
|
|
2262
|
-
}
|
|
2263
|
-
)
|
|
2264
|
-
] });
|
|
2265
|
-
});
|
|
2266
2871
|
var porcentagem = (posicao, total, visivel) => total > visivel ? Math.round(posicao / (total - visivel) * 100) : 0;
|
|
2267
2872
|
var ScrollPanel = react.forwardRef(function ScrollPanel2({
|
|
2268
2873
|
children,
|
|
@@ -2324,7 +2929,7 @@ var SegmentControl = react.forwardRef(
|
|
|
2324
2929
|
}, ref) {
|
|
2325
2930
|
const primeRef = react.useRef(null);
|
|
2326
2931
|
react.useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
2327
|
-
const
|
|
2932
|
+
const classes2 = ["cr-segment", `cr-segment--${variant}`, className].filter(Boolean).join(" ");
|
|
2328
2933
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2329
2934
|
selectbutton.SelectButton,
|
|
2330
2935
|
{
|
|
@@ -2349,7 +2954,7 @@ var SegmentControl = react.forwardRef(
|
|
|
2349
2954
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-segment__label", children: option.label })
|
|
2350
2955
|
] }),
|
|
2351
2956
|
pt: {
|
|
2352
|
-
root: { className:
|
|
2957
|
+
root: { className: classes2 },
|
|
2353
2958
|
button: {
|
|
2354
2959
|
className: "cr-segment__item",
|
|
2355
2960
|
// O Prime só ativa com a barra de espaço; um role=button responde também ao Enter.
|
|
@@ -2373,7 +2978,7 @@ var Skeleton = react.forwardRef(function Skeleton2({
|
|
|
2373
2978
|
}, ref) {
|
|
2374
2979
|
const primeRef = react.useRef(null);
|
|
2375
2980
|
react.useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
2376
|
-
const
|
|
2981
|
+
const classes2 = [
|
|
2377
2982
|
"cr-skeleton",
|
|
2378
2983
|
`cr-skeleton--${shape}`,
|
|
2379
2984
|
animated && "cr-skeleton--animated",
|
|
@@ -2389,7 +2994,7 @@ var Skeleton = react.forwardRef(function Skeleton2({
|
|
|
2389
2994
|
height,
|
|
2390
2995
|
size,
|
|
2391
2996
|
animation: animated ? "wave" : "none",
|
|
2392
|
-
pt: { root: { ...props, className:
|
|
2997
|
+
pt: { root: { ...props, className: classes2 } }
|
|
2393
2998
|
}
|
|
2394
2999
|
);
|
|
2395
3000
|
});
|
|
@@ -2409,14 +3014,14 @@ var Switch = react.forwardRef(function Switch2({
|
|
|
2409
3014
|
}, ref) {
|
|
2410
3015
|
const autoId = react.useId();
|
|
2411
3016
|
const inputId = id ?? autoId;
|
|
2412
|
-
const
|
|
3017
|
+
const classes2 = [
|
|
2413
3018
|
"cr-switch",
|
|
2414
3019
|
`cr-switch--${size}`,
|
|
2415
3020
|
`cr-switch--label-${labelPosition}`,
|
|
2416
3021
|
disabled && "cr-switch--disabled",
|
|
2417
3022
|
className
|
|
2418
3023
|
].filter(Boolean).join(" ");
|
|
2419
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
3024
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes2, style, children: [
|
|
2420
3025
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2421
3026
|
inputswitch.InputSwitch,
|
|
2422
3027
|
{
|
|
@@ -2592,7 +3197,7 @@ function coluna(element, index, opcoes) {
|
|
|
2592
3197
|
const { help, header, align, selectionMode, ...props } = element.props;
|
|
2593
3198
|
const { carregando, ajustada, abrirMenu } = opcoes;
|
|
2594
3199
|
const frozen = opcoes.fixada ?? props.frozen;
|
|
2595
|
-
const
|
|
3200
|
+
const chave2 = chaveDaColuna(element.props, index);
|
|
2596
3201
|
const celula = [
|
|
2597
3202
|
"cr-table__cell",
|
|
2598
3203
|
`cr-table__cell--${align ?? "left"}`,
|
|
@@ -2622,7 +3227,7 @@ function coluna(element, index, opcoes) {
|
|
|
2622
3227
|
// Botão direito (ou a tecla de menu) no cabeçalho: o menu de contexto da coluna.
|
|
2623
3228
|
...abrirMenu && !selectionMode && !carregando && {
|
|
2624
3229
|
onContextMenu: (event) => abrirMenu(event, {
|
|
2625
|
-
chave,
|
|
3230
|
+
chave: chave2,
|
|
2626
3231
|
titulo: typeof header === "string" ? header : props.field ?? "",
|
|
2627
3232
|
sortField: props.sortField ?? props.field,
|
|
2628
3233
|
sortable: Boolean(props.sortable),
|
|
@@ -2639,7 +3244,7 @@ function coluna(element, index, opcoes) {
|
|
|
2639
3244
|
rowCheckbox: caixa("Selecionar linha")
|
|
2640
3245
|
}
|
|
2641
3246
|
},
|
|
2642
|
-
element.key ??
|
|
3247
|
+
element.key ?? chave2
|
|
2643
3248
|
);
|
|
2644
3249
|
}
|
|
2645
3250
|
function TableBase({
|
|
@@ -2797,11 +3402,11 @@ function TableBase({
|
|
|
2797
3402
|
}
|
|
2798
3403
|
},
|
|
2799
3404
|
children: elementos.map((element, index) => {
|
|
2800
|
-
const
|
|
3405
|
+
const chave2 = chaveDaColuna(element.props, index);
|
|
2801
3406
|
return coluna(element, index, {
|
|
2802
3407
|
carregando,
|
|
2803
|
-
fixada: fixadas[
|
|
2804
|
-
ajustada: Boolean(ajustadas[
|
|
3408
|
+
fixada: fixadas[chave2],
|
|
3409
|
+
ajustada: Boolean(ajustadas[chave2]),
|
|
2805
3410
|
abrirMenu: columnMenu ? abrirMenu : void 0
|
|
2806
3411
|
});
|
|
2807
3412
|
})
|
|
@@ -2895,7 +3500,7 @@ function BarraDeFiltros({
|
|
|
2895
3500
|
clearLabel
|
|
2896
3501
|
}) {
|
|
2897
3502
|
const chipsRef = react.useRef(null);
|
|
2898
|
-
const [
|
|
3503
|
+
const [setas2, setSetas] = react.useState({ esquerda: false, direita: false });
|
|
2899
3504
|
const medir = react.useCallback(() => {
|
|
2900
3505
|
const chips = chipsRef.current;
|
|
2901
3506
|
if (!chips) return;
|
|
@@ -2918,7 +3523,7 @@ function BarraDeFiltros({
|
|
|
2918
3523
|
behavior: "smooth"
|
|
2919
3524
|
});
|
|
2920
3525
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cr-table-toolbar__filters", children: [
|
|
2921
|
-
|
|
3526
|
+
setas2.esquerda && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2922
3527
|
IconButton,
|
|
2923
3528
|
{
|
|
2924
3529
|
variant: "tertiary",
|
|
@@ -2949,7 +3554,7 @@ function BarraDeFiltros({
|
|
|
2949
3554
|
},
|
|
2950
3555
|
`${filter.label}:${filter.value}`
|
|
2951
3556
|
)) }),
|
|
2952
|
-
|
|
3557
|
+
setas2.direita && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2953
3558
|
IconButton,
|
|
2954
3559
|
{
|
|
2955
3560
|
variant: "tertiary",
|
|
@@ -3166,12 +3771,16 @@ exports.AccordionTab = AccordionTab;
|
|
|
3166
3771
|
exports.AutoComplete = AutoComplete;
|
|
3167
3772
|
exports.Badge = Badge;
|
|
3168
3773
|
exports.Button = Button;
|
|
3774
|
+
exports.Calendar = Calendar;
|
|
3169
3775
|
exports.Card = Card;
|
|
3170
3776
|
exports.Chart = Chart;
|
|
3171
3777
|
exports.Checkbox = Checkbox;
|
|
3172
3778
|
exports.Chip = Chip;
|
|
3173
3779
|
exports.Column = Column;
|
|
3174
3780
|
exports.ContextMenu = ContextMenu;
|
|
3781
|
+
exports.DATE_PERIODS = DATE_PERIODS;
|
|
3782
|
+
exports.DatePicker = DatePicker;
|
|
3783
|
+
exports.DateRangeButton = DateRangeButton;
|
|
3175
3784
|
exports.Divider = Divider;
|
|
3176
3785
|
exports.Drawer = Drawer;
|
|
3177
3786
|
exports.IconButton = IconButton;
|