@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.js
CHANGED
|
@@ -1,21 +1,24 @@
|
|
|
1
1
|
import { forwardRef, useRef, useImperativeHandle, useState, Children, isValidElement, useId, useLayoutEffect, useMemo, useCallback, useEffect, useContext, cloneElement } from 'react';
|
|
2
2
|
import { Accordion as Accordion$1, AccordionTab as AccordionTab$1 } from 'primereact/accordion';
|
|
3
|
-
import { CaretDown, WarningCircle, Info, Question, Check, CircleNotch, ArrowLeft, X, MagnifyingGlass, ArrowsInSimple, ArrowsOutSimple, CaretUp, Funnel, List, DribbbleLogo, SealWarning, XCircle, CheckCircle, Warning, Note, ArrowsInLineHorizontal, SortAscending, SortDescending, DotsThreeVertical, CaretLeft, CaretRight, Trash, CaretDoubleRight, CaretDoubleLeft, GearSix } from '@phosphor-icons/react';
|
|
3
|
+
import { CaretDown, WarningCircle, Info, Question, Check, CircleNotch, CalendarDots, ArrowLeft, X, MagnifyingGlass, ArrowsInSimple, ArrowsOutSimple, CaretUp, Funnel, CalendarDot, List, DribbbleLogo, SealWarning, XCircle, CheckCircle, Warning, Note, ArrowsInLineHorizontal, SortAscending, SortDescending, DotsThreeVertical, CaretLeft, CaretRight, Trash, CaretDoubleRight, CaretDoubleLeft, GearSix } from '@phosphor-icons/react';
|
|
4
4
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
5
|
import { AutoComplete as AutoComplete$1 } from 'primereact/autocomplete';
|
|
6
6
|
import { Badge as Badge$1 } from 'primereact/badge';
|
|
7
7
|
import { Button as Button$1 } from 'primereact/button';
|
|
8
|
+
import { Calendar as Calendar$1 } from 'primereact/calendar';
|
|
9
|
+
import { addLocale, PrimeReactContext, PrimeReactProvider, localeOption } from 'primereact/api';
|
|
8
10
|
import { Card as Card$1 } from 'primereact/card';
|
|
9
11
|
import { Chart as Chart$1 } from 'primereact/chart';
|
|
10
12
|
import { Tooltip as Tooltip$1 } from 'primereact/tooltip';
|
|
11
13
|
import { Checkbox as Checkbox$1 } from 'primereact/checkbox';
|
|
12
14
|
import { Chip as Chip$1 } from 'primereact/chip';
|
|
13
15
|
import { ContextMenu as ContextMenu$1 } from 'primereact/contextmenu';
|
|
14
|
-
import { PrimeReactContext, PrimeReactProvider } from 'primereact/api';
|
|
15
16
|
import { Menu as Menu$1 } from 'primereact/menu';
|
|
17
|
+
import { OverlayPanel } from 'primereact/overlaypanel';
|
|
18
|
+
import { InputText } from 'primereact/inputtext';
|
|
19
|
+
import { RadioButton } from 'primereact/radiobutton';
|
|
16
20
|
import { Divider as Divider$1 } from 'primereact/divider';
|
|
17
21
|
import { Sidebar } from 'primereact/sidebar';
|
|
18
|
-
import { InputText } from 'primereact/inputtext';
|
|
19
22
|
import { Menubar as Menubar$1 } from 'primereact/menubar';
|
|
20
23
|
import { Tag as Tag$1 } from 'primereact/tag';
|
|
21
24
|
import { Message as Message$1 } from 'primereact/message';
|
|
@@ -25,7 +28,6 @@ import { TabMenu } from 'primereact/tabmenu';
|
|
|
25
28
|
import { Paginator as Paginator$1 } from 'primereact/paginator';
|
|
26
29
|
import { Dropdown } from 'primereact/dropdown';
|
|
27
30
|
import { Panel as Panel$1 } from 'primereact/panel';
|
|
28
|
-
import { RadioButton } from 'primereact/radiobutton';
|
|
29
31
|
import { ScrollPanel as ScrollPanel$1 } from 'primereact/scrollpanel';
|
|
30
32
|
import { SelectButton } from 'primereact/selectbutton';
|
|
31
33
|
import { Skeleton as Skeleton$1 } from 'primereact/skeleton';
|
|
@@ -147,7 +149,7 @@ var AutoComplete = forwardRef(function AutoComplete2({
|
|
|
147
149
|
const id = inputId ?? autoId;
|
|
148
150
|
const hintId = `${id}-hint`;
|
|
149
151
|
const supportText = error ?? hint;
|
|
150
|
-
const
|
|
152
|
+
const classes2 = [
|
|
151
153
|
"cr-field",
|
|
152
154
|
"cr-autocomplete",
|
|
153
155
|
dropdown && "cr-autocomplete--dropdown",
|
|
@@ -157,7 +159,7 @@ var AutoComplete = forwardRef(function AutoComplete2({
|
|
|
157
159
|
disabled && "cr-field--disabled",
|
|
158
160
|
className
|
|
159
161
|
].filter(Boolean).join(" ");
|
|
160
|
-
return /* @__PURE__ */ jsxs("div", { className:
|
|
162
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, style, children: [
|
|
161
163
|
label && /* @__PURE__ */ jsxs("label", { className: "cr-field__label", htmlFor: id, children: [
|
|
162
164
|
label,
|
|
163
165
|
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
@@ -214,13 +216,13 @@ var AutoComplete = forwardRef(function AutoComplete2({
|
|
|
214
216
|
var Badge = forwardRef(function Badge2({ variant = "default", size = "large", className, children, ...props }, ref) {
|
|
215
217
|
const primeRef = useRef(null);
|
|
216
218
|
useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
217
|
-
const
|
|
219
|
+
const classes2 = ["cr-badge", `cr-badge--${variant}`, `cr-badge--${size}`, className].filter(Boolean).join(" ");
|
|
218
220
|
return /* @__PURE__ */ jsx(
|
|
219
221
|
Badge$1,
|
|
220
222
|
{
|
|
221
223
|
unstyled: true,
|
|
222
224
|
ref: primeRef,
|
|
223
|
-
className:
|
|
225
|
+
className: classes2,
|
|
224
226
|
value: size === "small" ? null : children,
|
|
225
227
|
...props
|
|
226
228
|
}
|
|
@@ -236,14 +238,14 @@ var Button = forwardRef(function Button2({
|
|
|
236
238
|
children,
|
|
237
239
|
...props
|
|
238
240
|
}, ref) {
|
|
239
|
-
const
|
|
241
|
+
const classes2 = ["cr-button", `cr-button--${variant}`, `cr-button--${size}`, className].filter(Boolean).join(" ");
|
|
240
242
|
return /* @__PURE__ */ jsxs(
|
|
241
243
|
Button$1,
|
|
242
244
|
{
|
|
243
245
|
unstyled: true,
|
|
244
246
|
ref,
|
|
245
247
|
type,
|
|
246
|
-
className:
|
|
248
|
+
className: classes2,
|
|
247
249
|
...props,
|
|
248
250
|
children: [
|
|
249
251
|
leadingIcon && /* @__PURE__ */ jsx("span", { className: "cr-button__icon", "aria-hidden": "true", children: leadingIcon }),
|
|
@@ -253,15 +255,202 @@ var Button = forwardRef(function Button2({
|
|
|
253
255
|
}
|
|
254
256
|
);
|
|
255
257
|
});
|
|
258
|
+
var LOCALE = "cr-pt-BR";
|
|
259
|
+
addLocale(LOCALE, {
|
|
260
|
+
firstDayOfWeek: 0,
|
|
261
|
+
dayNames: [
|
|
262
|
+
"domingo",
|
|
263
|
+
"segunda-feira",
|
|
264
|
+
"ter\xE7a-feira",
|
|
265
|
+
"quarta-feira",
|
|
266
|
+
"quinta-feira",
|
|
267
|
+
"sexta-feira",
|
|
268
|
+
"s\xE1bado"
|
|
269
|
+
],
|
|
270
|
+
dayNamesShort: ["dom", "seg", "ter", "qua", "qui", "sex", "s\xE1b"],
|
|
271
|
+
dayNamesMin: ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sab"],
|
|
272
|
+
monthNames: [
|
|
273
|
+
"Janeiro",
|
|
274
|
+
"Fevereiro",
|
|
275
|
+
"Mar\xE7o",
|
|
276
|
+
"Abril",
|
|
277
|
+
"Maio",
|
|
278
|
+
"Junho",
|
|
279
|
+
"Julho",
|
|
280
|
+
"Agosto",
|
|
281
|
+
"Setembro",
|
|
282
|
+
"Outubro",
|
|
283
|
+
"Novembro",
|
|
284
|
+
"Dezembro"
|
|
285
|
+
],
|
|
286
|
+
monthNamesShort: [
|
|
287
|
+
"Jan",
|
|
288
|
+
"Fev",
|
|
289
|
+
"Mar",
|
|
290
|
+
"Abr",
|
|
291
|
+
"Mai",
|
|
292
|
+
"Jun",
|
|
293
|
+
"Jul",
|
|
294
|
+
"Ago",
|
|
295
|
+
"Set",
|
|
296
|
+
"Out",
|
|
297
|
+
"Nov",
|
|
298
|
+
"Dez"
|
|
299
|
+
],
|
|
300
|
+
dateFormat: "dd/mm/yy",
|
|
301
|
+
weekHeader: "Sem",
|
|
302
|
+
today: "Hoje",
|
|
303
|
+
clear: "Limpar",
|
|
304
|
+
chooseDate: "Escolher data",
|
|
305
|
+
chooseMonth: "Escolher m\xEAs",
|
|
306
|
+
chooseYear: "Escolher ano",
|
|
307
|
+
prevMonth: "M\xEAs anterior",
|
|
308
|
+
nextMonth: "Pr\xF3ximo m\xEAs",
|
|
309
|
+
prevYear: "Ano anterior",
|
|
310
|
+
nextYear: "Pr\xF3ximo ano",
|
|
311
|
+
prevDecade: "D\xE9cada anterior",
|
|
312
|
+
nextDecade: "Pr\xF3xima d\xE9cada"
|
|
313
|
+
});
|
|
314
|
+
function seguirFocoDoDia(event) {
|
|
315
|
+
const dia2 = event.target;
|
|
316
|
+
if (!(dia2 instanceof HTMLElement) || !dia2.classList.contains("cr-calendar__date")) return;
|
|
317
|
+
const painel = dia2.closest(".cr-calendar");
|
|
318
|
+
const td = dia2.closest("td");
|
|
319
|
+
const mes = dia2.closest(".cr-calendar__month");
|
|
320
|
+
if (!painel || !td || !mes || event.relatedTarget) return;
|
|
321
|
+
const indice = [...painel.querySelectorAll(".cr-calendar__month")].indexOf(mes);
|
|
322
|
+
const { pDay, pMonth, pYear } = td.dataset;
|
|
323
|
+
requestAnimationFrame(() => {
|
|
324
|
+
if (dia2.isConnected || document.activeElement !== document.body) return;
|
|
325
|
+
const novo = painel.querySelectorAll(".cr-calendar__month")[indice]?.querySelector(
|
|
326
|
+
`td[data-p-day="${pDay}"][data-p-month="${pMonth}"][data-p-year="${pYear}"] .cr-calendar__date`
|
|
327
|
+
);
|
|
328
|
+
if (novo) {
|
|
329
|
+
novo.tabIndex = 0;
|
|
330
|
+
novo.focus();
|
|
331
|
+
}
|
|
332
|
+
});
|
|
333
|
+
}
|
|
334
|
+
if (typeof document !== "undefined") document.addEventListener("focusout", seguirFocoDoDia, true);
|
|
335
|
+
var setas = {
|
|
336
|
+
prevIcon: /* @__PURE__ */ jsx("span", { className: "cr-icon-button__icon", children: /* @__PURE__ */ jsx(CaretLeft, {}) }),
|
|
337
|
+
nextIcon: /* @__PURE__ */ jsx("span", { className: "cr-icon-button__icon", children: /* @__PURE__ */ jsx(CaretRight, {}) })
|
|
338
|
+
};
|
|
339
|
+
var mesmoDia = (data, dia2) => data instanceof Date && data.getDate() === dia2.day && data.getMonth() === dia2.month && data.getFullYear() === dia2.year;
|
|
340
|
+
var chave = (dia2) => dia2.year * 1e4 + dia2.month * 100 + dia2.day;
|
|
341
|
+
var chaveDe = (data) => chave({ day: data.getDate(), month: data.getMonth(), year: data.getFullYear() });
|
|
342
|
+
function escolhido(props, dia2) {
|
|
343
|
+
const { value } = props;
|
|
344
|
+
if (value instanceof Date) return mesmoDia(value, dia2);
|
|
345
|
+
if (!Array.isArray(value)) return false;
|
|
346
|
+
if (props.selectionMode === "range") {
|
|
347
|
+
const [inicio, fim] = value;
|
|
348
|
+
if (!inicio) return false;
|
|
349
|
+
return chave(dia2) >= chaveDe(inicio) && chave(dia2) <= chaveDe(fim ?? inicio);
|
|
350
|
+
}
|
|
351
|
+
return value.some((data) => mesmoDia(data, dia2));
|
|
352
|
+
}
|
|
353
|
+
function noPeriodo(props, dia2) {
|
|
354
|
+
if (props.selectionMode !== "range" || !Array.isArray(props.value)) return void 0;
|
|
355
|
+
const [inicio, fim] = props.value;
|
|
356
|
+
if (mesmoDia(inicio, dia2) || mesmoDia(fim, dia2)) return "cr-calendar__day--edge";
|
|
357
|
+
if (inicio && fim) {
|
|
358
|
+
const data = new Date(dia2.year, dia2.month, dia2.day);
|
|
359
|
+
if (data > inicio && data < fim) return "cr-calendar__day--middle";
|
|
360
|
+
}
|
|
361
|
+
return void 0;
|
|
362
|
+
}
|
|
363
|
+
var classes = (...lista) => lista.filter(Boolean).join(" ");
|
|
364
|
+
function ptDoPainel(offDays = []) {
|
|
365
|
+
return {
|
|
366
|
+
groupContainer: { className: "cr-calendar__months" },
|
|
367
|
+
group: { className: "cr-calendar__month" },
|
|
368
|
+
header: { className: "cr-calendar__header" },
|
|
369
|
+
previousButton: {
|
|
370
|
+
className: "cr-icon-button cr-icon-button--tertiary cr-icon-button--xsmall"
|
|
371
|
+
},
|
|
372
|
+
nextButton: { className: "cr-icon-button cr-icon-button--tertiary cr-icon-button--xsmall" },
|
|
373
|
+
title: { className: "cr-calendar__title" },
|
|
374
|
+
// O nome dos botões do título é o texto que aparece neles (o mês e o ano), não "Escolher mês".
|
|
375
|
+
monthTitle: { className: "cr-calendar__title-button", "aria-label": void 0 },
|
|
376
|
+
yearTitle: { className: "cr-calendar__title-button", "aria-label": void 0 },
|
|
377
|
+
decadeTitle: { className: "cr-calendar__title-text" },
|
|
378
|
+
table: { className: "cr-calendar__table" },
|
|
379
|
+
tableHeaderCell: { className: "cr-calendar__weekday" },
|
|
380
|
+
day: ({ props, context }) => {
|
|
381
|
+
const dia2 = context.date;
|
|
382
|
+
const meses = localeOption("monthNames", props.locale ?? LOCALE);
|
|
383
|
+
return {
|
|
384
|
+
// O Prime põe o escolhido e o desabilitado no <span> do dia, que não tem papel: eles vão
|
|
385
|
+
// para a célula da grade (gridcell). O nome da célula inclui o número que aparece nela.
|
|
386
|
+
"aria-selected": escolhido(props, dia2),
|
|
387
|
+
"aria-disabled": dia2.selectable ? void 0 : true,
|
|
388
|
+
"aria-label": `${dia2.day} de ${meses[dia2.month]?.toLowerCase()} de ${dia2.year}`,
|
|
389
|
+
className: classes(
|
|
390
|
+
"cr-calendar__day",
|
|
391
|
+
context.today && "cr-calendar__day--today",
|
|
392
|
+
context.otherMonth && "cr-calendar__day--other-month",
|
|
393
|
+
offDays.some((data) => mesmoDia(data, dia2)) && "cr-calendar__day--off",
|
|
394
|
+
noPeriodo(props, dia2)
|
|
395
|
+
)
|
|
396
|
+
};
|
|
397
|
+
},
|
|
398
|
+
dayLabel: ({ context }) => ({
|
|
399
|
+
"aria-selected": void 0,
|
|
400
|
+
"aria-disabled": void 0,
|
|
401
|
+
className: classes(
|
|
402
|
+
"cr-calendar__date",
|
|
403
|
+
context.selected && "cr-calendar__date--selected",
|
|
404
|
+
context.disabled && "cr-calendar__date--disabled"
|
|
405
|
+
)
|
|
406
|
+
}),
|
|
407
|
+
monthPicker: { className: "cr-calendar__picker cr-calendar__picker--months" },
|
|
408
|
+
month: ({ context }) => ({
|
|
409
|
+
className: classes(
|
|
410
|
+
"cr-calendar__option",
|
|
411
|
+
context.selected && "cr-calendar__option--selected",
|
|
412
|
+
context.disabled && "cr-calendar__option--disabled"
|
|
413
|
+
)
|
|
414
|
+
}),
|
|
415
|
+
yearPicker: { className: "cr-calendar__picker cr-calendar__picker--years" },
|
|
416
|
+
year: ({ context }) => ({
|
|
417
|
+
className: classes(
|
|
418
|
+
"cr-calendar__option",
|
|
419
|
+
context.selected && "cr-calendar__option--selected",
|
|
420
|
+
context.disabled && "cr-calendar__option--disabled"
|
|
421
|
+
)
|
|
422
|
+
})
|
|
423
|
+
};
|
|
424
|
+
}
|
|
425
|
+
function CalendarBase({ offDays, locale = LOCALE, className, ...props }, ref) {
|
|
426
|
+
return /* @__PURE__ */ jsx(
|
|
427
|
+
Calendar$1,
|
|
428
|
+
{
|
|
429
|
+
...setas,
|
|
430
|
+
locale,
|
|
431
|
+
...props,
|
|
432
|
+
ref,
|
|
433
|
+
inline: true,
|
|
434
|
+
unstyled: true,
|
|
435
|
+
className,
|
|
436
|
+
pt: {
|
|
437
|
+
root: { className: "cr-calendar-inline" },
|
|
438
|
+
panel: { className: "cr-calendar" },
|
|
439
|
+
...ptDoPainel(offDays)
|
|
440
|
+
}
|
|
441
|
+
}
|
|
442
|
+
);
|
|
443
|
+
}
|
|
444
|
+
var Calendar = forwardRef(CalendarBase);
|
|
256
445
|
var Card = forwardRef(function Card2({ padding = "xsmall", outline = false, className, style, children, ...props }, ref) {
|
|
257
|
-
const
|
|
446
|
+
const classes2 = ["cr-card", `cr-card--${padding}`, outline && "cr-card--outline", className].filter(Boolean).join(" ");
|
|
258
447
|
return /* @__PURE__ */ jsx(
|
|
259
448
|
Card$1,
|
|
260
449
|
{
|
|
261
450
|
unstyled: true,
|
|
262
451
|
ref,
|
|
263
452
|
pt: {
|
|
264
|
-
root: { className:
|
|
453
|
+
root: { className: classes2, style },
|
|
265
454
|
body: { className: "cr-card__body" },
|
|
266
455
|
content: { className: "cr-card__content" }
|
|
267
456
|
},
|
|
@@ -321,11 +510,11 @@ function Tooltip({
|
|
|
321
510
|
)
|
|
322
511
|
);
|
|
323
512
|
}, [target, tooltipId, describe]);
|
|
324
|
-
const
|
|
513
|
+
const classes2 = ["cr-tooltip", `cr-tooltip--${type}`, className].filter(Boolean).join(" ");
|
|
325
514
|
const pt = {
|
|
326
515
|
root: (options) => {
|
|
327
516
|
const side = options?.state?.position ?? position;
|
|
328
|
-
return { className: `${
|
|
517
|
+
return { className: `${classes2} cr-tooltip--${side}`, "aria-hidden": false };
|
|
329
518
|
},
|
|
330
519
|
arrow: { className: "cr-tooltip__arrow" },
|
|
331
520
|
text: { className: "cr-tooltip__text" }
|
|
@@ -584,8 +773,8 @@ var Chart = forwardRef(function Chart2({
|
|
|
584
773
|
};
|
|
585
774
|
}, [tema, yAxis, y2Axis, temDireita, series, type, stacked]);
|
|
586
775
|
const card = Boolean(title || actions);
|
|
587
|
-
const
|
|
588
|
-
return /* @__PURE__ */ jsxs("div", { ...props, ref: raiz, id, className:
|
|
776
|
+
const classes2 = ["cr-chart", card && "cr-chart--card", className].filter(Boolean).join(" ");
|
|
777
|
+
return /* @__PURE__ */ jsxs("div", { ...props, ref: raiz, id, className: classes2, children: [
|
|
589
778
|
card && /* @__PURE__ */ jsxs("div", { className: "cr-chart__header", children: [
|
|
590
779
|
/* @__PURE__ */ jsxs("div", { className: "cr-chart__title-row", children: [
|
|
591
780
|
title && /* @__PURE__ */ jsx("span", { className: "cr-chart__title", children: title }),
|
|
@@ -678,7 +867,7 @@ var Checkbox = forwardRef(function Checkbox2({
|
|
|
678
867
|
useEffect(() => {
|
|
679
868
|
if (inputRef.current) inputRef.current.indeterminate = indeterminate && !checked;
|
|
680
869
|
}, [indeterminate, checked]);
|
|
681
|
-
const
|
|
870
|
+
const classes2 = [
|
|
682
871
|
"cr-checkbox",
|
|
683
872
|
`cr-checkbox--${position}`,
|
|
684
873
|
`cr-checkbox--label-${labelSize}`,
|
|
@@ -686,7 +875,7 @@ var Checkbox = forwardRef(function Checkbox2({
|
|
|
686
875
|
disabled && "cr-checkbox--disabled",
|
|
687
876
|
className
|
|
688
877
|
].filter(Boolean).join(" ");
|
|
689
|
-
return /* @__PURE__ */ jsxs("div", { className:
|
|
878
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, style, children: [
|
|
690
879
|
/* @__PURE__ */ jsx(
|
|
691
880
|
Checkbox$1,
|
|
692
881
|
{
|
|
@@ -733,7 +922,7 @@ var Chip = forwardRef(function Chip2({
|
|
|
733
922
|
className,
|
|
734
923
|
...props
|
|
735
924
|
}, ref) {
|
|
736
|
-
const
|
|
925
|
+
const classes2 = [
|
|
737
926
|
"cr-chip",
|
|
738
927
|
`cr-chip--${variant}`,
|
|
739
928
|
`cr-chip--${size}`,
|
|
@@ -747,7 +936,7 @@ var Chip = forwardRef(function Chip2({
|
|
|
747
936
|
{
|
|
748
937
|
unstyled: true,
|
|
749
938
|
pt: { root: { ref, "aria-label": void 0 } },
|
|
750
|
-
className:
|
|
939
|
+
className: classes2,
|
|
751
940
|
label,
|
|
752
941
|
"aria-disabled": disabled || void 0,
|
|
753
942
|
icon: leadingIcon ? () => /* @__PURE__ */ jsx("span", { className: "cr-chip__icon cr-chip__icon--leading", "aria-hidden": "true", children: leadingIcon }) : void 0,
|
|
@@ -823,7 +1012,7 @@ var Menu = forwardRef(function Menu2({
|
|
|
823
1012
|
template: () => /* @__PURE__ */ jsx("div", { className: "cr-menu__loading", children: /* @__PURE__ */ jsx(CircleNotch, { className: "cr-menu__spinner", "aria-hidden": "true" }) })
|
|
824
1013
|
}
|
|
825
1014
|
] : itensDoPrime(model);
|
|
826
|
-
const
|
|
1015
|
+
const classes2 = ["cr-lista cr-menu", `cr-menu--${density}`, popup && "cr-menu--popup", className].filter(Boolean).join(" ");
|
|
827
1016
|
const pt = {
|
|
828
1017
|
// O nome acessível vai na lista (role=menu); o Prime lê `ariaLabel`, mas não o declara no tipo.
|
|
829
1018
|
menu: {
|
|
@@ -857,7 +1046,7 @@ var Menu = forwardRef(function Menu2({
|
|
|
857
1046
|
unstyled: true,
|
|
858
1047
|
ref: primeRef,
|
|
859
1048
|
id,
|
|
860
|
-
className:
|
|
1049
|
+
className: classes2,
|
|
861
1050
|
model: items,
|
|
862
1051
|
popup,
|
|
863
1052
|
popupAlignment,
|
|
@@ -886,9 +1075,9 @@ var ContextMenu = forwardRef(function ContextMenu2({
|
|
|
886
1075
|
hide: (event) => primeRef.current?.hide(event),
|
|
887
1076
|
getElement: () => primeRef.current?.getElement() ?? null
|
|
888
1077
|
}));
|
|
889
|
-
const
|
|
1078
|
+
const classes2 = ["cr-lista cr-menu cr-context-menu", `cr-menu--${density}`, className].filter(Boolean).join(" ");
|
|
890
1079
|
const pt = {
|
|
891
|
-
root: { ...props, className:
|
|
1080
|
+
root: { ...props, className: classes2 },
|
|
892
1081
|
// O nome vai na lista (o Prime dá a ela role=menubar, vertical).
|
|
893
1082
|
menu: {
|
|
894
1083
|
className: "cr-menu__list",
|
|
@@ -921,10 +1110,537 @@ var ContextMenu = forwardRef(function ContextMenu2({
|
|
|
921
1110
|
}
|
|
922
1111
|
);
|
|
923
1112
|
});
|
|
1113
|
+
function DatePickerBase({
|
|
1114
|
+
variant = "outline",
|
|
1115
|
+
size = "large",
|
|
1116
|
+
label,
|
|
1117
|
+
hint,
|
|
1118
|
+
error,
|
|
1119
|
+
offDays,
|
|
1120
|
+
locale = LOCALE,
|
|
1121
|
+
placeholder = "dd/mm/aaaa",
|
|
1122
|
+
inputId,
|
|
1123
|
+
required,
|
|
1124
|
+
disabled,
|
|
1125
|
+
className,
|
|
1126
|
+
style,
|
|
1127
|
+
onShow,
|
|
1128
|
+
onHide,
|
|
1129
|
+
...props
|
|
1130
|
+
}, ref) {
|
|
1131
|
+
const autoId = useId();
|
|
1132
|
+
const id = inputId ?? autoId;
|
|
1133
|
+
const hintId = `${id}-hint`;
|
|
1134
|
+
const supportText = error ?? hint;
|
|
1135
|
+
const pelaSeta = useRef(false);
|
|
1136
|
+
const peloTeclado = useRef(false);
|
|
1137
|
+
const calendario = useRef(null);
|
|
1138
|
+
useImperativeHandle(ref, () => calendario.current, []);
|
|
1139
|
+
const classes2 = [
|
|
1140
|
+
"cr-field",
|
|
1141
|
+
"cr-datepicker",
|
|
1142
|
+
`cr-field--${variant}`,
|
|
1143
|
+
`cr-field--${size}`,
|
|
1144
|
+
error && "cr-field--error",
|
|
1145
|
+
disabled && "cr-field--disabled",
|
|
1146
|
+
className
|
|
1147
|
+
].filter(Boolean).join(" ");
|
|
1148
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, style, children: [
|
|
1149
|
+
label && /* @__PURE__ */ jsxs("label", { className: "cr-field__label", htmlFor: id, children: [
|
|
1150
|
+
label,
|
|
1151
|
+
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1152
|
+
] }),
|
|
1153
|
+
/* @__PURE__ */ jsx(
|
|
1154
|
+
Calendar$1,
|
|
1155
|
+
{
|
|
1156
|
+
...setas,
|
|
1157
|
+
locale,
|
|
1158
|
+
placeholder,
|
|
1159
|
+
...props,
|
|
1160
|
+
ref: calendario,
|
|
1161
|
+
unstyled: true,
|
|
1162
|
+
inputId: id,
|
|
1163
|
+
required,
|
|
1164
|
+
disabled,
|
|
1165
|
+
showIcon: true,
|
|
1166
|
+
icon: /* @__PURE__ */ jsx(CalendarDot, { "aria-hidden": "true" }),
|
|
1167
|
+
onShow: () => {
|
|
1168
|
+
if (!pelaSeta.current) document.getElementById(id)?.focus();
|
|
1169
|
+
pelaSeta.current = false;
|
|
1170
|
+
onShow?.();
|
|
1171
|
+
},
|
|
1172
|
+
onHide: () => {
|
|
1173
|
+
const atual = calendario.current;
|
|
1174
|
+
const ativo = document.activeElement;
|
|
1175
|
+
const semFoco = ativo === document.body || atual?.getOverlay()?.contains(ativo);
|
|
1176
|
+
if (peloTeclado.current && semFoco && atual) {
|
|
1177
|
+
atual.focus();
|
|
1178
|
+
atual.hide();
|
|
1179
|
+
}
|
|
1180
|
+
peloTeclado.current = false;
|
|
1181
|
+
pelaSeta.current = false;
|
|
1182
|
+
onHide?.();
|
|
1183
|
+
},
|
|
1184
|
+
pt: {
|
|
1185
|
+
root: { className: "cr-datepicker__root" },
|
|
1186
|
+
input: {
|
|
1187
|
+
root: {
|
|
1188
|
+
className: "cr-field__control cr-datepicker__input",
|
|
1189
|
+
"aria-describedby": supportText ? hintId : void 0,
|
|
1190
|
+
"aria-invalid": error ? true : void 0,
|
|
1191
|
+
onKeyDown: (event) => {
|
|
1192
|
+
if (event.code === "ArrowDown" && !calendario.current?.getOverlay()) {
|
|
1193
|
+
pelaSeta.current = true;
|
|
1194
|
+
}
|
|
1195
|
+
}
|
|
1196
|
+
}
|
|
1197
|
+
},
|
|
1198
|
+
dropdownButton: { root: { className: "cr-datepicker__button" } },
|
|
1199
|
+
panel: {
|
|
1200
|
+
className: "cr-calendar cr-datepicker__panel",
|
|
1201
|
+
onKeyDown: (event) => {
|
|
1202
|
+
if (["Enter", "NumpadEnter", "Space"].includes(event.code))
|
|
1203
|
+
peloTeclado.current = true;
|
|
1204
|
+
}
|
|
1205
|
+
},
|
|
1206
|
+
// Animação de entrada e saída (a do Prime) e o lado do painel, medido logo depois de o
|
|
1207
|
+
// Prime posicionar.
|
|
1208
|
+
transition: transicaoDoPopup(() => {
|
|
1209
|
+
const campo = document.getElementById(id);
|
|
1210
|
+
seguirLado(painelDoCampo(campo, ".cr-datepicker__panel"), campo);
|
|
1211
|
+
}),
|
|
1212
|
+
...ptDoPainel(offDays)
|
|
1213
|
+
}
|
|
1214
|
+
}
|
|
1215
|
+
),
|
|
1216
|
+
supportText && /* @__PURE__ */ jsxs("p", { id: hintId, className: `cr-field__hint${error ? " cr-field__hint--error" : ""}`, children: [
|
|
1217
|
+
/* @__PURE__ */ jsx("span", { className: "cr-field__hint-icon", "aria-hidden": "true", children: error ? /* @__PURE__ */ jsx(WarningCircle, {}) : /* @__PURE__ */ jsx(Info, {}) }),
|
|
1218
|
+
supportText
|
|
1219
|
+
] })
|
|
1220
|
+
] });
|
|
1221
|
+
}
|
|
1222
|
+
var DatePicker = forwardRef(DatePickerBase);
|
|
1223
|
+
var Input = forwardRef(function Input2({
|
|
1224
|
+
variant = "outline",
|
|
1225
|
+
size = "large",
|
|
1226
|
+
label,
|
|
1227
|
+
leadingIcon,
|
|
1228
|
+
trailingIcon,
|
|
1229
|
+
hint,
|
|
1230
|
+
error,
|
|
1231
|
+
id,
|
|
1232
|
+
required,
|
|
1233
|
+
disabled,
|
|
1234
|
+
className,
|
|
1235
|
+
...props
|
|
1236
|
+
}, ref) {
|
|
1237
|
+
const autoId = useId();
|
|
1238
|
+
const inputId = id ?? autoId;
|
|
1239
|
+
const hintId = `${inputId}-hint`;
|
|
1240
|
+
const supportText = error ?? hint;
|
|
1241
|
+
const classes2 = [
|
|
1242
|
+
"cr-field",
|
|
1243
|
+
`cr-field--${variant}`,
|
|
1244
|
+
`cr-field--${size}`,
|
|
1245
|
+
error && "cr-field--error",
|
|
1246
|
+
disabled && "cr-field--disabled",
|
|
1247
|
+
className
|
|
1248
|
+
].filter(Boolean).join(" ");
|
|
1249
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, children: [
|
|
1250
|
+
label && /* @__PURE__ */ jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
1251
|
+
label,
|
|
1252
|
+
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1253
|
+
] }),
|
|
1254
|
+
/* @__PURE__ */ jsxs("div", { className: "cr-field__control", children: [
|
|
1255
|
+
leadingIcon && /* @__PURE__ */ jsx("span", { className: "cr-field__icon", "aria-hidden": "true", children: leadingIcon }),
|
|
1256
|
+
/* @__PURE__ */ jsx(
|
|
1257
|
+
InputText,
|
|
1258
|
+
{
|
|
1259
|
+
unstyled: true,
|
|
1260
|
+
ref,
|
|
1261
|
+
id: inputId,
|
|
1262
|
+
className: "cr-field__input",
|
|
1263
|
+
required,
|
|
1264
|
+
disabled,
|
|
1265
|
+
invalid: Boolean(error),
|
|
1266
|
+
"aria-invalid": error ? true : void 0,
|
|
1267
|
+
...props,
|
|
1268
|
+
"aria-describedby": juntarIds(supportText && hintId, props["aria-describedby"])
|
|
1269
|
+
}
|
|
1270
|
+
),
|
|
1271
|
+
trailingIcon && /* @__PURE__ */ jsx("span", { className: "cr-field__icon", children: trailingIcon })
|
|
1272
|
+
] }),
|
|
1273
|
+
supportText && /* @__PURE__ */ jsxs("p", { id: hintId, className: `cr-field__hint${error ? " cr-field__hint--error" : ""}`, children: [
|
|
1274
|
+
/* @__PURE__ */ jsx("span", { className: "cr-field__hint-icon", "aria-hidden": "true", children: error ? /* @__PURE__ */ jsx(WarningCircle, {}) : /* @__PURE__ */ jsx(Info, {}) }),
|
|
1275
|
+
supportText
|
|
1276
|
+
] })
|
|
1277
|
+
] });
|
|
1278
|
+
});
|
|
1279
|
+
var Radio = forwardRef(function Radio2({
|
|
1280
|
+
label,
|
|
1281
|
+
showLabel = true,
|
|
1282
|
+
labelSize = "default",
|
|
1283
|
+
checked = false,
|
|
1284
|
+
value,
|
|
1285
|
+
name,
|
|
1286
|
+
onChange,
|
|
1287
|
+
disabled,
|
|
1288
|
+
required,
|
|
1289
|
+
id,
|
|
1290
|
+
className,
|
|
1291
|
+
style,
|
|
1292
|
+
...props
|
|
1293
|
+
}, ref) {
|
|
1294
|
+
const autoId = useId();
|
|
1295
|
+
const inputId = id ?? autoId;
|
|
1296
|
+
const classes2 = [
|
|
1297
|
+
"cr-radio",
|
|
1298
|
+
`cr-radio--label-${labelSize}`,
|
|
1299
|
+
disabled && "cr-radio--disabled",
|
|
1300
|
+
className
|
|
1301
|
+
].filter(Boolean).join(" ");
|
|
1302
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, style, children: [
|
|
1303
|
+
/* @__PURE__ */ jsx(
|
|
1304
|
+
RadioButton,
|
|
1305
|
+
{
|
|
1306
|
+
unstyled: true,
|
|
1307
|
+
inputRef: ref,
|
|
1308
|
+
inputId,
|
|
1309
|
+
checked,
|
|
1310
|
+
value,
|
|
1311
|
+
name,
|
|
1312
|
+
onChange,
|
|
1313
|
+
disabled,
|
|
1314
|
+
required,
|
|
1315
|
+
pt: {
|
|
1316
|
+
// Marcado pela prop do Cristal, não pelo atributo interno do Prime (data-p-checked).
|
|
1317
|
+
root: { className: `cr-radio__control${checked ? " cr-radio__control--checked" : ""}` },
|
|
1318
|
+
input: { ...props, className: "cr-radio__input" },
|
|
1319
|
+
box: { className: "cr-radio__box" },
|
|
1320
|
+
icon: { className: "cr-radio__icon" }
|
|
1321
|
+
}
|
|
1322
|
+
}
|
|
1323
|
+
),
|
|
1324
|
+
/* @__PURE__ */ jsx(
|
|
1325
|
+
"label",
|
|
1326
|
+
{
|
|
1327
|
+
className: `cr-radio__label${showLabel ? "" : " cr-radio__label--hidden cr-so-leitor"}`,
|
|
1328
|
+
htmlFor: inputId,
|
|
1329
|
+
children: label
|
|
1330
|
+
}
|
|
1331
|
+
)
|
|
1332
|
+
] });
|
|
1333
|
+
});
|
|
1334
|
+
|
|
1335
|
+
// src/components/DateRangeButton/periodos.ts
|
|
1336
|
+
var dia = (ano, mes, numero) => new Date(ano, mes, numero);
|
|
1337
|
+
var semHora = (data) => dia(data.getFullYear(), data.getMonth(), data.getDate());
|
|
1338
|
+
var menos = (data, dias) => dia(data.getFullYear(), data.getMonth(), data.getDate() - dias);
|
|
1339
|
+
var DATE_PERIODS = {
|
|
1340
|
+
today: { label: "Hoje", range: (hoje) => [semHora(hoje), semHora(hoje)] },
|
|
1341
|
+
yesterday: { label: "Ontem", range: (hoje) => [menos(hoje, 1), menos(hoje, 1)] },
|
|
1342
|
+
last7Days: { label: "\xDAltimos 7 dias", range: (hoje) => [menos(hoje, 6), semHora(hoje)] },
|
|
1343
|
+
last14Days: { label: "\xDAltimos 14 dias", range: (hoje) => [menos(hoje, 13), semHora(hoje)] },
|
|
1344
|
+
last30Days: { label: "\xDAltimos 30 dias", range: (hoje) => [menos(hoje, 29), semHora(hoje)] },
|
|
1345
|
+
thisMonth: {
|
|
1346
|
+
label: "Este m\xEAs",
|
|
1347
|
+
range: (hoje) => [dia(hoje.getFullYear(), hoje.getMonth(), 1), semHora(hoje)]
|
|
1348
|
+
},
|
|
1349
|
+
// A semana começa no domingo, como no calendário.
|
|
1350
|
+
lastWeek: {
|
|
1351
|
+
label: "Semana passada",
|
|
1352
|
+
range: (hoje) => {
|
|
1353
|
+
const domingo = menos(hoje, hoje.getDay() + 7);
|
|
1354
|
+
return [domingo, menos(domingo, -6)];
|
|
1355
|
+
}
|
|
1356
|
+
},
|
|
1357
|
+
lastMonth: {
|
|
1358
|
+
label: "M\xEAs passado",
|
|
1359
|
+
range: (hoje) => [
|
|
1360
|
+
dia(hoje.getFullYear(), hoje.getMonth() - 1, 1),
|
|
1361
|
+
dia(hoje.getFullYear(), hoje.getMonth(), 0)
|
|
1362
|
+
]
|
|
1363
|
+
},
|
|
1364
|
+
thisYear: {
|
|
1365
|
+
label: "Este ano",
|
|
1366
|
+
range: (hoje) => [dia(hoje.getFullYear(), 0, 1), semHora(hoje)]
|
|
1367
|
+
}
|
|
1368
|
+
};
|
|
1369
|
+
var PERIODOS_PADRAO = [
|
|
1370
|
+
DATE_PERIODS.today,
|
|
1371
|
+
DATE_PERIODS.yesterday,
|
|
1372
|
+
DATE_PERIODS.last7Days,
|
|
1373
|
+
DATE_PERIODS.last14Days,
|
|
1374
|
+
DATE_PERIODS.last30Days,
|
|
1375
|
+
DATE_PERIODS.thisMonth
|
|
1376
|
+
];
|
|
1377
|
+
var MESES = ["jan", "fev", "mar", "abr", "mai", "jun", "jul", "ago", "set", "out", "nov", "dez"];
|
|
1378
|
+
var dataPorExtenso = (data) => `${data.getDate()} de ${MESES[data.getMonth()]} de ${data.getFullYear()}`;
|
|
1379
|
+
var periodoPorExtenso = ([inicio, fim]) => `${dataPorExtenso(inicio)} a ${dataPorExtenso(fim)}`;
|
|
1380
|
+
var mesmoDia2 = (a, b) => !!a && !!b && semHora(a).getTime() === semHora(b).getTime();
|
|
1381
|
+
var periodoDe = (periods, range, hoje) => range ? periods.find((period) => {
|
|
1382
|
+
const [inicio, fim] = period.range(hoje);
|
|
1383
|
+
return mesmoDia2(inicio, range[0]) && mesmoDia2(fim, range[1]);
|
|
1384
|
+
}) : void 0;
|
|
1385
|
+
var dataCurta = (data) => data ? `${String(data.getDate()).padStart(2, "0")}/${String(data.getMonth() + 1).padStart(2, "0")}/${data.getFullYear()}` : "";
|
|
1386
|
+
function lerData(texto) {
|
|
1387
|
+
const partes = /^(\d{2})\/(\d{2})\/(\d{4})$/.exec(texto.replace(/\s/g, ""));
|
|
1388
|
+
if (!partes) return null;
|
|
1389
|
+
const [d, m, a] = [Number(partes[1]), Number(partes[2]), Number(partes[3])];
|
|
1390
|
+
const data = dia(a, m - 1, d);
|
|
1391
|
+
return data.getMonth() === m - 1 && data.getDate() === d ? data : null;
|
|
1392
|
+
}
|
|
1393
|
+
function mesDaTela(range, meses, hoje) {
|
|
1394
|
+
const base = (meses > 1 ? range[1] : range[0]) ?? range[0] ?? hoje;
|
|
1395
|
+
return new Date(base.getFullYear(), base.getMonth() - (meses > 1 ? 1 : 0), 1);
|
|
1396
|
+
}
|
|
1397
|
+
function PainelDePeriodo({
|
|
1398
|
+
value,
|
|
1399
|
+
periods,
|
|
1400
|
+
footer,
|
|
1401
|
+
today,
|
|
1402
|
+
numberOfMonths,
|
|
1403
|
+
minDate,
|
|
1404
|
+
maxDate,
|
|
1405
|
+
disabledDates,
|
|
1406
|
+
offDays,
|
|
1407
|
+
onSelect,
|
|
1408
|
+
onClose
|
|
1409
|
+
}) {
|
|
1410
|
+
const grupo = useId();
|
|
1411
|
+
const [rascunho, setRascunho] = useState(value ?? [null, null]);
|
|
1412
|
+
const [periodo, setPeriodo] = useState(() => periodoDe(periods, value, today) ?? null);
|
|
1413
|
+
const [textos, setTextos] = useState([
|
|
1414
|
+
dataCurta(value?.[0]),
|
|
1415
|
+
dataCurta(value?.[1])
|
|
1416
|
+
]);
|
|
1417
|
+
const [mes, setMes] = useState(() => mesDaTela(rascunho, numberOfMonths, today));
|
|
1418
|
+
const mudar = (novo, novoPeriodo, mudarTextos = true) => {
|
|
1419
|
+
setRascunho(novo);
|
|
1420
|
+
setPeriodo(novoPeriodo);
|
|
1421
|
+
if (mudarTextos) setTextos([dataCurta(novo[0]), dataCurta(novo[1])]);
|
|
1422
|
+
if (!footer && novo[0] && novo[1]) onSelect([novo[0], novo[1]], novoPeriodo);
|
|
1423
|
+
};
|
|
1424
|
+
const escolherPeriodo = (item) => {
|
|
1425
|
+
const range = item.range(today);
|
|
1426
|
+
setMes(mesDaTela(range, numberOfMonths, today));
|
|
1427
|
+
mudar(range, item);
|
|
1428
|
+
};
|
|
1429
|
+
const digitar = (indice, texto) => {
|
|
1430
|
+
const novosTextos = [...textos];
|
|
1431
|
+
novosTextos[indice] = texto;
|
|
1432
|
+
setTextos(novosTextos);
|
|
1433
|
+
const data = lerData(texto);
|
|
1434
|
+
if (!data) return;
|
|
1435
|
+
const novo = [...rascunho];
|
|
1436
|
+
novo[indice] = data;
|
|
1437
|
+
if (novo[0] && novo[1] && novo[0] > novo[1]) novo[indice === 0 ? 1 : 0] = null;
|
|
1438
|
+
setMes(mesDaTela(novo, numberOfMonths, today));
|
|
1439
|
+
mudar(novo, null, false);
|
|
1440
|
+
};
|
|
1441
|
+
const [inicio, fim] = rascunho;
|
|
1442
|
+
return /* @__PURE__ */ jsxs("div", { className: "cr-date-range", children: [
|
|
1443
|
+
/* @__PURE__ */ jsxs("div", { className: "cr-date-range__body", children: [
|
|
1444
|
+
periods.length > 0 && /* @__PURE__ */ jsx("div", { className: "cr-date-range__periods", role: "radiogroup", "aria-label": "Per\xEDodos", children: periods.map((item) => /* @__PURE__ */ jsx(
|
|
1445
|
+
Radio,
|
|
1446
|
+
{
|
|
1447
|
+
className: "cr-date-range__period",
|
|
1448
|
+
name: grupo,
|
|
1449
|
+
label: item.label,
|
|
1450
|
+
value: item.label,
|
|
1451
|
+
checked: periodo === item,
|
|
1452
|
+
onChange: () => escolherPeriodo(item)
|
|
1453
|
+
},
|
|
1454
|
+
item.label
|
|
1455
|
+
)) }),
|
|
1456
|
+
/* @__PURE__ */ jsxs("div", { className: "cr-date-range__calendars", children: [
|
|
1457
|
+
/* @__PURE__ */ jsxs("div", { className: "cr-date-range__inputs", children: [
|
|
1458
|
+
/* @__PURE__ */ jsx(
|
|
1459
|
+
Input,
|
|
1460
|
+
{
|
|
1461
|
+
size: "medium",
|
|
1462
|
+
"aria-label": "Data inicial",
|
|
1463
|
+
placeholder: "dd / mm / aaaa",
|
|
1464
|
+
value: textos[0],
|
|
1465
|
+
onChange: (event) => digitar(0, event.target.value)
|
|
1466
|
+
}
|
|
1467
|
+
),
|
|
1468
|
+
/* @__PURE__ */ jsx("span", { className: "cr-date-range__dash", "aria-hidden": "true", children: "-" }),
|
|
1469
|
+
/* @__PURE__ */ jsx(
|
|
1470
|
+
Input,
|
|
1471
|
+
{
|
|
1472
|
+
size: "medium",
|
|
1473
|
+
"aria-label": "Data final",
|
|
1474
|
+
placeholder: "dd / mm / aaaa",
|
|
1475
|
+
value: textos[1],
|
|
1476
|
+
onChange: (event) => digitar(1, event.target.value)
|
|
1477
|
+
}
|
|
1478
|
+
)
|
|
1479
|
+
] }),
|
|
1480
|
+
/* @__PURE__ */ jsx(
|
|
1481
|
+
Calendar,
|
|
1482
|
+
{
|
|
1483
|
+
selectionMode: "range",
|
|
1484
|
+
numberOfMonths,
|
|
1485
|
+
value: rascunho,
|
|
1486
|
+
viewDate: mes,
|
|
1487
|
+
onViewDateChange: (event) => setMes(event.value),
|
|
1488
|
+
onChange: (event) => {
|
|
1489
|
+
const [inicio2 = null, fim2 = null] = event.value ?? [];
|
|
1490
|
+
mudar([inicio2, fim2], null);
|
|
1491
|
+
},
|
|
1492
|
+
minDate,
|
|
1493
|
+
maxDate,
|
|
1494
|
+
disabledDates,
|
|
1495
|
+
offDays
|
|
1496
|
+
}
|
|
1497
|
+
)
|
|
1498
|
+
] })
|
|
1499
|
+
] }),
|
|
1500
|
+
footer && /* @__PURE__ */ jsxs("div", { className: "cr-date-range__footer", children: [
|
|
1501
|
+
/* @__PURE__ */ jsx(Button, { variant: "tertiary", size: "medium", onClick: onClose, children: "Fechar" }),
|
|
1502
|
+
/* @__PURE__ */ jsx(
|
|
1503
|
+
Button,
|
|
1504
|
+
{
|
|
1505
|
+
size: "medium",
|
|
1506
|
+
disabled: !inicio || !fim,
|
|
1507
|
+
onClick: () => inicio && fim && onSelect([inicio, fim], periodo),
|
|
1508
|
+
children: "Selecionar"
|
|
1509
|
+
}
|
|
1510
|
+
)
|
|
1511
|
+
] })
|
|
1512
|
+
] });
|
|
1513
|
+
}
|
|
1514
|
+
var DateRangeButton = forwardRef(
|
|
1515
|
+
function DateRangeButton2({
|
|
1516
|
+
value = null,
|
|
1517
|
+
onChange,
|
|
1518
|
+
label,
|
|
1519
|
+
required,
|
|
1520
|
+
placeholder = "Selecione o per\xEDodo",
|
|
1521
|
+
periods = PERIODOS_PADRAO,
|
|
1522
|
+
footer = true,
|
|
1523
|
+
numberOfMonths = 2,
|
|
1524
|
+
minDate,
|
|
1525
|
+
maxDate,
|
|
1526
|
+
disabledDates,
|
|
1527
|
+
offDays,
|
|
1528
|
+
today,
|
|
1529
|
+
disabled,
|
|
1530
|
+
id,
|
|
1531
|
+
className,
|
|
1532
|
+
style
|
|
1533
|
+
}, ref) {
|
|
1534
|
+
const autoId = useId();
|
|
1535
|
+
const botaoId = id ?? autoId;
|
|
1536
|
+
const rotuloId = `${botaoId}-rotulo`;
|
|
1537
|
+
const textoId = `${botaoId}-texto`;
|
|
1538
|
+
const painelId = `${botaoId}-painel`;
|
|
1539
|
+
const painel = useRef(null);
|
|
1540
|
+
const botao = useRef(null);
|
|
1541
|
+
const [aberto, setAberto] = useState(false);
|
|
1542
|
+
const [hoje, setHoje] = useState(() => today ?? /* @__PURE__ */ new Date());
|
|
1543
|
+
const periodo = periodoDe(periods, value, today ?? hoje);
|
|
1544
|
+
const classes2 = ["cr-field", "cr-date-range-field", disabled && "cr-field--disabled", className].filter(Boolean).join(" ");
|
|
1545
|
+
const fechar = () => painel.current?.hide();
|
|
1546
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, style, children: [
|
|
1547
|
+
label && /* @__PURE__ */ jsxs("span", { id: rotuloId, className: "cr-field__label", children: [
|
|
1548
|
+
label,
|
|
1549
|
+
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1550
|
+
] }),
|
|
1551
|
+
/* @__PURE__ */ jsxs(
|
|
1552
|
+
Button$1,
|
|
1553
|
+
{
|
|
1554
|
+
unstyled: true,
|
|
1555
|
+
ref: (elemento) => {
|
|
1556
|
+
const el = elemento;
|
|
1557
|
+
botao.current = el;
|
|
1558
|
+
if (typeof ref === "function") ref(el);
|
|
1559
|
+
else if (ref) ref.current = el;
|
|
1560
|
+
},
|
|
1561
|
+
id: botaoId,
|
|
1562
|
+
type: "button",
|
|
1563
|
+
className: "cr-date-range-button",
|
|
1564
|
+
disabled,
|
|
1565
|
+
"aria-haspopup": "dialog",
|
|
1566
|
+
"aria-expanded": aberto,
|
|
1567
|
+
"aria-controls": aberto ? painelId : void 0,
|
|
1568
|
+
"aria-labelledby": label ? `${rotuloId} ${textoId}` : void 0,
|
|
1569
|
+
onClick: (event) => {
|
|
1570
|
+
setHoje(today ?? /* @__PURE__ */ new Date());
|
|
1571
|
+
painel.current?.toggle(event);
|
|
1572
|
+
},
|
|
1573
|
+
children: [
|
|
1574
|
+
/* @__PURE__ */ jsx("span", { className: "cr-date-range-button__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx(CalendarDots, {}) }),
|
|
1575
|
+
/* @__PURE__ */ jsx("span", { id: textoId, className: "cr-date-range-button__text", children: value ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1576
|
+
periodo && /* @__PURE__ */ jsxs("span", { className: "cr-date-range-button__period", children: [
|
|
1577
|
+
periodo.label,
|
|
1578
|
+
":"
|
|
1579
|
+
] }),
|
|
1580
|
+
/* @__PURE__ */ jsx("span", { children: periodoPorExtenso(value) })
|
|
1581
|
+
] }) : /* @__PURE__ */ jsx("span", { className: "cr-date-range-button__placeholder", children: placeholder }) }),
|
|
1582
|
+
/* @__PURE__ */ jsx("span", { className: "cr-date-range-button__caret", "aria-hidden": "true", children: /* @__PURE__ */ jsx(CaretDown, {}) })
|
|
1583
|
+
]
|
|
1584
|
+
}
|
|
1585
|
+
),
|
|
1586
|
+
/* @__PURE__ */ jsx(
|
|
1587
|
+
OverlayPanel,
|
|
1588
|
+
{
|
|
1589
|
+
ref: painel,
|
|
1590
|
+
unstyled: true,
|
|
1591
|
+
id: painelId,
|
|
1592
|
+
onShow: () => {
|
|
1593
|
+
setAberto(true);
|
|
1594
|
+
const raiz = document.getElementById(painelId);
|
|
1595
|
+
const alvo = raiz?.querySelector('input[type="radio"]:checked') ?? raiz?.querySelector('input, button, [tabindex="0"]');
|
|
1596
|
+
alvo?.focus();
|
|
1597
|
+
},
|
|
1598
|
+
onHide: () => {
|
|
1599
|
+
setAberto(false);
|
|
1600
|
+
const ativo = document.activeElement;
|
|
1601
|
+
if (ativo === document.body || document.getElementById(painelId)?.contains(ativo)) {
|
|
1602
|
+
botao.current?.focus();
|
|
1603
|
+
}
|
|
1604
|
+
},
|
|
1605
|
+
pt: {
|
|
1606
|
+
root: {
|
|
1607
|
+
className: "cr-date-range__panel",
|
|
1608
|
+
role: "dialog",
|
|
1609
|
+
"aria-label": label ?? "Escolher per\xEDodo"
|
|
1610
|
+
},
|
|
1611
|
+
// Animação de entrada e saída (a do Prime) e o lado do painel em relação ao botão.
|
|
1612
|
+
transition: transicaoDoPopup(
|
|
1613
|
+
() => seguirLado(document.getElementById(painelId), botao.current)
|
|
1614
|
+
)
|
|
1615
|
+
},
|
|
1616
|
+
children: /* @__PURE__ */ jsx(
|
|
1617
|
+
PainelDePeriodo,
|
|
1618
|
+
{
|
|
1619
|
+
value,
|
|
1620
|
+
periods,
|
|
1621
|
+
footer,
|
|
1622
|
+
today: today ?? hoje,
|
|
1623
|
+
numberOfMonths,
|
|
1624
|
+
minDate,
|
|
1625
|
+
maxDate,
|
|
1626
|
+
disabledDates,
|
|
1627
|
+
offDays,
|
|
1628
|
+
onClose: fechar,
|
|
1629
|
+
onSelect: (range, item) => {
|
|
1630
|
+
onChange?.({ value: range, period: item });
|
|
1631
|
+
fechar();
|
|
1632
|
+
}
|
|
1633
|
+
}
|
|
1634
|
+
)
|
|
1635
|
+
}
|
|
1636
|
+
)
|
|
1637
|
+
] });
|
|
1638
|
+
}
|
|
1639
|
+
);
|
|
924
1640
|
var Divider = forwardRef(function Divider2({ orientation = "horizontal", variant = "solid", className, style, ...props }, ref) {
|
|
925
1641
|
const primeRef = useRef(null);
|
|
926
1642
|
useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
927
|
-
const
|
|
1643
|
+
const classes2 = ["cr-divider", `cr-divider--${orientation}`, `cr-divider--${variant}`, className].filter(Boolean).join(" ");
|
|
928
1644
|
return /* @__PURE__ */ jsx(
|
|
929
1645
|
Divider$1,
|
|
930
1646
|
{
|
|
@@ -932,7 +1648,7 @@ var Divider = forwardRef(function Divider2({ orientation = "horizontal", variant
|
|
|
932
1648
|
ref: primeRef,
|
|
933
1649
|
layout: orientation,
|
|
934
1650
|
pt: {
|
|
935
|
-
root: { className:
|
|
1651
|
+
root: { className: classes2, style },
|
|
936
1652
|
content: { className: "cr-divider__content" }
|
|
937
1653
|
},
|
|
938
1654
|
...props
|
|
@@ -959,7 +1675,7 @@ var IconButton = forwardRef(function IconButton2({
|
|
|
959
1675
|
[ref]
|
|
960
1676
|
);
|
|
961
1677
|
const texto = tooltip ?? props["aria-label"];
|
|
962
|
-
const
|
|
1678
|
+
const classes2 = [
|
|
963
1679
|
"cr-icon-button",
|
|
964
1680
|
`cr-icon-button--${variant}`,
|
|
965
1681
|
`cr-icon-button--${size}`,
|
|
@@ -972,7 +1688,7 @@ var IconButton = forwardRef(function IconButton2({
|
|
|
972
1688
|
unstyled: true,
|
|
973
1689
|
ref: ligar,
|
|
974
1690
|
type,
|
|
975
|
-
className:
|
|
1691
|
+
className: classes2,
|
|
976
1692
|
...props,
|
|
977
1693
|
children: /* @__PURE__ */ jsx("span", { className: "cr-icon-button__icon", "aria-hidden": "true", children: icon })
|
|
978
1694
|
}
|
|
@@ -1049,7 +1765,7 @@ var Drawer = forwardRef(function Drawer2({
|
|
|
1049
1765
|
primeiro.focus();
|
|
1050
1766
|
}
|
|
1051
1767
|
};
|
|
1052
|
-
const
|
|
1768
|
+
const classes2 = [
|
|
1053
1769
|
"cr-drawer",
|
|
1054
1770
|
`cr-drawer--${side}`,
|
|
1055
1771
|
`cr-drawer--${behavior}`,
|
|
@@ -1074,7 +1790,7 @@ var Drawer = forwardRef(function Drawer2({
|
|
|
1074
1790
|
className: `cr-drawer__mask cr-drawer__mask--${side}${modal ? "" : " cr-drawer__mask--sem-overlay"}`
|
|
1075
1791
|
},
|
|
1076
1792
|
root: {
|
|
1077
|
-
className:
|
|
1793
|
+
className: classes2,
|
|
1078
1794
|
role: "dialog",
|
|
1079
1795
|
"aria-modal": modal || void 0,
|
|
1080
1796
|
"aria-labelledby": titleId,
|
|
@@ -1145,62 +1861,6 @@ var Drawer = forwardRef(function Drawer2({
|
|
|
1145
1861
|
}
|
|
1146
1862
|
);
|
|
1147
1863
|
});
|
|
1148
|
-
var Input = forwardRef(function Input2({
|
|
1149
|
-
variant = "outline",
|
|
1150
|
-
size = "large",
|
|
1151
|
-
label,
|
|
1152
|
-
leadingIcon,
|
|
1153
|
-
trailingIcon,
|
|
1154
|
-
hint,
|
|
1155
|
-
error,
|
|
1156
|
-
id,
|
|
1157
|
-
required,
|
|
1158
|
-
disabled,
|
|
1159
|
-
className,
|
|
1160
|
-
...props
|
|
1161
|
-
}, ref) {
|
|
1162
|
-
const autoId = useId();
|
|
1163
|
-
const inputId = id ?? autoId;
|
|
1164
|
-
const hintId = `${inputId}-hint`;
|
|
1165
|
-
const supportText = error ?? hint;
|
|
1166
|
-
const classes = [
|
|
1167
|
-
"cr-field",
|
|
1168
|
-
`cr-field--${variant}`,
|
|
1169
|
-
`cr-field--${size}`,
|
|
1170
|
-
error && "cr-field--error",
|
|
1171
|
-
disabled && "cr-field--disabled",
|
|
1172
|
-
className
|
|
1173
|
-
].filter(Boolean).join(" ");
|
|
1174
|
-
return /* @__PURE__ */ jsxs("div", { className: classes, children: [
|
|
1175
|
-
label && /* @__PURE__ */ jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
1176
|
-
label,
|
|
1177
|
-
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
1178
|
-
] }),
|
|
1179
|
-
/* @__PURE__ */ jsxs("div", { className: "cr-field__control", children: [
|
|
1180
|
-
leadingIcon && /* @__PURE__ */ jsx("span", { className: "cr-field__icon", "aria-hidden": "true", children: leadingIcon }),
|
|
1181
|
-
/* @__PURE__ */ jsx(
|
|
1182
|
-
InputText,
|
|
1183
|
-
{
|
|
1184
|
-
unstyled: true,
|
|
1185
|
-
ref,
|
|
1186
|
-
id: inputId,
|
|
1187
|
-
className: "cr-field__input",
|
|
1188
|
-
required,
|
|
1189
|
-
disabled,
|
|
1190
|
-
invalid: Boolean(error),
|
|
1191
|
-
"aria-invalid": error ? true : void 0,
|
|
1192
|
-
...props,
|
|
1193
|
-
"aria-describedby": juntarIds(supportText && hintId, props["aria-describedby"])
|
|
1194
|
-
}
|
|
1195
|
-
),
|
|
1196
|
-
trailingIcon && /* @__PURE__ */ jsx("span", { className: "cr-field__icon", children: trailingIcon })
|
|
1197
|
-
] }),
|
|
1198
|
-
supportText && /* @__PURE__ */ jsxs("p", { id: hintId, className: `cr-field__hint${error ? " cr-field__hint--error" : ""}`, children: [
|
|
1199
|
-
/* @__PURE__ */ jsx("span", { className: "cr-field__hint-icon", "aria-hidden": "true", children: error ? /* @__PURE__ */ jsx(WarningCircle, {}) : /* @__PURE__ */ jsx(Info, {}) }),
|
|
1200
|
-
supportText
|
|
1201
|
-
] })
|
|
1202
|
-
] });
|
|
1203
|
-
});
|
|
1204
1864
|
|
|
1205
1865
|
// src/components/Menubar/assets/vector-logo-simbolo.svg
|
|
1206
1866
|
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';
|
|
@@ -1221,7 +1881,7 @@ function ToolButton({ tool }) {
|
|
|
1221
1881
|
const hasMenu = Boolean(tool.menu?.length);
|
|
1222
1882
|
const hasBadge = tool.badge !== void 0 && tool.badge !== null;
|
|
1223
1883
|
const name = hasBadge ? `${tool.label}, ${tool.badgeLabel ?? String(tool.badge)}` : tool.label;
|
|
1224
|
-
const
|
|
1884
|
+
const classes2 = [
|
|
1225
1885
|
"cr-menubar__tool",
|
|
1226
1886
|
tool.showOnTablet && "cr-menubar__tool--tablet",
|
|
1227
1887
|
open && "cr-menubar__tool--active"
|
|
@@ -1233,7 +1893,7 @@ function ToolButton({ tool }) {
|
|
|
1233
1893
|
unstyled: true,
|
|
1234
1894
|
ref: buttonRef,
|
|
1235
1895
|
type: "button",
|
|
1236
|
-
className:
|
|
1896
|
+
className: classes2,
|
|
1237
1897
|
"aria-label": name,
|
|
1238
1898
|
"aria-haspopup": hasMenu ? "menu" : void 0,
|
|
1239
1899
|
"aria-expanded": hasMenu ? open : void 0,
|
|
@@ -1337,7 +1997,7 @@ var Menubar = forwardRef(function Menubar2({
|
|
|
1337
1997
|
event.preventDefault();
|
|
1338
1998
|
onSearch?.(search);
|
|
1339
1999
|
};
|
|
1340
|
-
const
|
|
2000
|
+
const classes2 = ["cr-menubar", !showSearch && "cr-menubar--no-search", className].filter(Boolean).join(" ");
|
|
1341
2001
|
const pt = {
|
|
1342
2002
|
// A área start some do layout (display: contents): o início e a busca viram colunas do grid.
|
|
1343
2003
|
start: { className: "cr-menubar__start" },
|
|
@@ -1392,7 +2052,7 @@ var Menubar = forwardRef(function Menubar2({
|
|
|
1392
2052
|
tools.length > 0 && /* @__PURE__ */ jsx("div", { className: "cr-menubar__tools", children: tools.map((tool) => /* @__PURE__ */ jsx(ToolButton, { tool }, tool.label)) }),
|
|
1393
2053
|
user && /* @__PURE__ */ jsx(Profile, { user, menu: userMenu })
|
|
1394
2054
|
] }) : null;
|
|
1395
|
-
return /* @__PURE__ */ jsx("div", { ref, id, className:
|
|
2055
|
+
return /* @__PURE__ */ jsx("div", { ref, id, className: classes2, children: /* @__PURE__ */ jsx(
|
|
1396
2056
|
Menubar$1,
|
|
1397
2057
|
{
|
|
1398
2058
|
...props,
|
|
@@ -1408,13 +2068,13 @@ var Menubar = forwardRef(function Menubar2({
|
|
|
1408
2068
|
var Tag = forwardRef(function Tag2({ variant = "default", size = "small", icon, className, children, ...props }, ref) {
|
|
1409
2069
|
const primeRef = useRef(null);
|
|
1410
2070
|
useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
1411
|
-
const
|
|
2071
|
+
const classes2 = ["cr-tag", `cr-tag--${variant}`, `cr-tag--${size}`, className].filter(Boolean).join(" ");
|
|
1412
2072
|
return /* @__PURE__ */ jsx(
|
|
1413
2073
|
Tag$1,
|
|
1414
2074
|
{
|
|
1415
2075
|
unstyled: true,
|
|
1416
2076
|
ref: primeRef,
|
|
1417
|
-
className:
|
|
2077
|
+
className: classes2,
|
|
1418
2078
|
icon: icon ? () => /* @__PURE__ */ jsx("span", { className: "cr-tag__icon", "aria-hidden": "true", children: icon }) : void 0,
|
|
1419
2079
|
value: children,
|
|
1420
2080
|
...props
|
|
@@ -1504,7 +2164,7 @@ var MenuPrincipal = forwardRef(
|
|
|
1504
2164
|
);
|
|
1505
2165
|
anterior = entry;
|
|
1506
2166
|
});
|
|
1507
|
-
const
|
|
2167
|
+
const classes2 = ["cr-menu-principal", popup && "cr-menu-principal--popup", className].filter(Boolean).join(" ");
|
|
1508
2168
|
const pt = {
|
|
1509
2169
|
// O nome acessível vai na lista (role=menu), como no Menu.
|
|
1510
2170
|
menu: {
|
|
@@ -1531,7 +2191,7 @@ var MenuPrincipal = forwardRef(
|
|
|
1531
2191
|
unstyled: true,
|
|
1532
2192
|
ref: primeRef,
|
|
1533
2193
|
id,
|
|
1534
|
-
className:
|
|
2194
|
+
className: classes2,
|
|
1535
2195
|
style: popup && baseDoAlvo !== void 0 ? { "--cr-menu-principal-topo": `${baseDoAlvo}px` } : void 0,
|
|
1536
2196
|
model: items,
|
|
1537
2197
|
popup,
|
|
@@ -1614,7 +2274,7 @@ var Modal = forwardRef(function Modal2({
|
|
|
1614
2274
|
[...body.children].forEach((child) => observer.observe(child));
|
|
1615
2275
|
return () => observer.disconnect();
|
|
1616
2276
|
}, [body, children]);
|
|
1617
|
-
const
|
|
2277
|
+
const classes2 = ["cr-modal", `cr-modal--${size}`, rolavel && "cr-modal--scrollable", className].filter(Boolean).join(" ");
|
|
1618
2278
|
return /* @__PURE__ */ jsx(
|
|
1619
2279
|
Dialog,
|
|
1620
2280
|
{
|
|
@@ -1631,7 +2291,7 @@ var Modal = forwardRef(function Modal2({
|
|
|
1631
2291
|
pt: {
|
|
1632
2292
|
mask: { className: "cr-modal__mask" },
|
|
1633
2293
|
root: {
|
|
1634
|
-
className:
|
|
2294
|
+
className: classes2,
|
|
1635
2295
|
"aria-labelledby": titleId,
|
|
1636
2296
|
"aria-describedby": void 0
|
|
1637
2297
|
},
|
|
@@ -1722,7 +2382,7 @@ var MultiSelect = forwardRef(function MultiSelect2({
|
|
|
1722
2382
|
const supportText = error ?? hint;
|
|
1723
2383
|
const selected = value ?? [];
|
|
1724
2384
|
const overflow = selected.length > maxChips;
|
|
1725
|
-
const
|
|
2385
|
+
const classes2 = [
|
|
1726
2386
|
"cr-field",
|
|
1727
2387
|
`cr-field--${variant}`,
|
|
1728
2388
|
`cr-field--${size}`,
|
|
@@ -1833,7 +2493,7 @@ var MultiSelect = forwardRef(function MultiSelect2({
|
|
|
1833
2493
|
// Animação de entrada e saída da lista, a do Prime (comum.css).
|
|
1834
2494
|
transition: transicaoDoPopup()
|
|
1835
2495
|
};
|
|
1836
|
-
return /* @__PURE__ */ jsxs("div", { className:
|
|
2496
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, children: [
|
|
1837
2497
|
label && /* @__PURE__ */ jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
1838
2498
|
label,
|
|
1839
2499
|
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
@@ -1910,8 +2570,8 @@ var PageHeader = forwardRef(function PageHeader2({
|
|
|
1910
2570
|
);
|
|
1911
2571
|
}
|
|
1912
2572
|
);
|
|
1913
|
-
const
|
|
1914
|
-
return /* @__PURE__ */ jsxs("div", { ref, className:
|
|
2573
|
+
const classes2 = ["cr-page-header", `cr-page-header--${variant}`, className].filter(Boolean).join(" ");
|
|
2574
|
+
return /* @__PURE__ */ jsxs("div", { ref, className: classes2, ...props, children: [
|
|
1915
2575
|
/* @__PURE__ */ jsxs(
|
|
1916
2576
|
"div",
|
|
1917
2577
|
{
|
|
@@ -2011,7 +2671,7 @@ var Select = forwardRef(function Select2({
|
|
|
2011
2671
|
},
|
|
2012
2672
|
[ref]
|
|
2013
2673
|
);
|
|
2014
|
-
const
|
|
2674
|
+
const classes2 = [
|
|
2015
2675
|
"cr-field",
|
|
2016
2676
|
`cr-field--${variant}`,
|
|
2017
2677
|
`cr-field--${size}`,
|
|
@@ -2053,7 +2713,7 @@ var Select = forwardRef(function Select2({
|
|
|
2053
2713
|
}),
|
|
2054
2714
|
emptyMessage: { className: "cr-lista__item cr-select__item cr-select__empty" }
|
|
2055
2715
|
};
|
|
2056
|
-
return /* @__PURE__ */ jsxs("div", { className:
|
|
2716
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, children: [
|
|
2057
2717
|
label && /* @__PURE__ */ jsxs("label", { className: "cr-field__label", htmlFor: inputId, children: [
|
|
2058
2718
|
label,
|
|
2059
2719
|
required && /* @__PURE__ */ jsx("span", { className: "cr-field__required", "aria-hidden": "true", children: "*" })
|
|
@@ -2206,61 +2866,6 @@ var Panel = forwardRef(function Panel2({ className, style, children, ...props },
|
|
|
2206
2866
|
}
|
|
2207
2867
|
);
|
|
2208
2868
|
});
|
|
2209
|
-
var Radio = forwardRef(function Radio2({
|
|
2210
|
-
label,
|
|
2211
|
-
showLabel = true,
|
|
2212
|
-
labelSize = "default",
|
|
2213
|
-
checked = false,
|
|
2214
|
-
value,
|
|
2215
|
-
name,
|
|
2216
|
-
onChange,
|
|
2217
|
-
disabled,
|
|
2218
|
-
required,
|
|
2219
|
-
id,
|
|
2220
|
-
className,
|
|
2221
|
-
style,
|
|
2222
|
-
...props
|
|
2223
|
-
}, ref) {
|
|
2224
|
-
const autoId = useId();
|
|
2225
|
-
const inputId = id ?? autoId;
|
|
2226
|
-
const classes = [
|
|
2227
|
-
"cr-radio",
|
|
2228
|
-
`cr-radio--label-${labelSize}`,
|
|
2229
|
-
disabled && "cr-radio--disabled",
|
|
2230
|
-
className
|
|
2231
|
-
].filter(Boolean).join(" ");
|
|
2232
|
-
return /* @__PURE__ */ jsxs("div", { className: classes, style, children: [
|
|
2233
|
-
/* @__PURE__ */ jsx(
|
|
2234
|
-
RadioButton,
|
|
2235
|
-
{
|
|
2236
|
-
unstyled: true,
|
|
2237
|
-
inputRef: ref,
|
|
2238
|
-
inputId,
|
|
2239
|
-
checked,
|
|
2240
|
-
value,
|
|
2241
|
-
name,
|
|
2242
|
-
onChange,
|
|
2243
|
-
disabled,
|
|
2244
|
-
required,
|
|
2245
|
-
pt: {
|
|
2246
|
-
// Marcado pela prop do Cristal, não pelo atributo interno do Prime (data-p-checked).
|
|
2247
|
-
root: { className: `cr-radio__control${checked ? " cr-radio__control--checked" : ""}` },
|
|
2248
|
-
input: { ...props, className: "cr-radio__input" },
|
|
2249
|
-
box: { className: "cr-radio__box" },
|
|
2250
|
-
icon: { className: "cr-radio__icon" }
|
|
2251
|
-
}
|
|
2252
|
-
}
|
|
2253
|
-
),
|
|
2254
|
-
/* @__PURE__ */ jsx(
|
|
2255
|
-
"label",
|
|
2256
|
-
{
|
|
2257
|
-
className: `cr-radio__label${showLabel ? "" : " cr-radio__label--hidden cr-so-leitor"}`,
|
|
2258
|
-
htmlFor: inputId,
|
|
2259
|
-
children: label
|
|
2260
|
-
}
|
|
2261
|
-
)
|
|
2262
|
-
] });
|
|
2263
|
-
});
|
|
2264
2869
|
var porcentagem = (posicao, total, visivel) => total > visivel ? Math.round(posicao / (total - visivel) * 100) : 0;
|
|
2265
2870
|
var ScrollPanel = forwardRef(function ScrollPanel2({
|
|
2266
2871
|
children,
|
|
@@ -2322,7 +2927,7 @@ var SegmentControl = forwardRef(
|
|
|
2322
2927
|
}, ref) {
|
|
2323
2928
|
const primeRef = useRef(null);
|
|
2324
2929
|
useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
2325
|
-
const
|
|
2930
|
+
const classes2 = ["cr-segment", `cr-segment--${variant}`, className].filter(Boolean).join(" ");
|
|
2326
2931
|
return /* @__PURE__ */ jsx(
|
|
2327
2932
|
SelectButton,
|
|
2328
2933
|
{
|
|
@@ -2347,7 +2952,7 @@ var SegmentControl = forwardRef(
|
|
|
2347
2952
|
/* @__PURE__ */ jsx("span", { className: "cr-segment__label", children: option.label })
|
|
2348
2953
|
] }),
|
|
2349
2954
|
pt: {
|
|
2350
|
-
root: { className:
|
|
2955
|
+
root: { className: classes2 },
|
|
2351
2956
|
button: {
|
|
2352
2957
|
className: "cr-segment__item",
|
|
2353
2958
|
// O Prime só ativa com a barra de espaço; um role=button responde também ao Enter.
|
|
@@ -2371,7 +2976,7 @@ var Skeleton = forwardRef(function Skeleton2({
|
|
|
2371
2976
|
}, ref) {
|
|
2372
2977
|
const primeRef = useRef(null);
|
|
2373
2978
|
useImperativeHandle(ref, () => primeRef.current?.getElement());
|
|
2374
|
-
const
|
|
2979
|
+
const classes2 = [
|
|
2375
2980
|
"cr-skeleton",
|
|
2376
2981
|
`cr-skeleton--${shape}`,
|
|
2377
2982
|
animated && "cr-skeleton--animated",
|
|
@@ -2387,7 +2992,7 @@ var Skeleton = forwardRef(function Skeleton2({
|
|
|
2387
2992
|
height,
|
|
2388
2993
|
size,
|
|
2389
2994
|
animation: animated ? "wave" : "none",
|
|
2390
|
-
pt: { root: { ...props, className:
|
|
2995
|
+
pt: { root: { ...props, className: classes2 } }
|
|
2391
2996
|
}
|
|
2392
2997
|
);
|
|
2393
2998
|
});
|
|
@@ -2407,14 +3012,14 @@ var Switch = forwardRef(function Switch2({
|
|
|
2407
3012
|
}, ref) {
|
|
2408
3013
|
const autoId = useId();
|
|
2409
3014
|
const inputId = id ?? autoId;
|
|
2410
|
-
const
|
|
3015
|
+
const classes2 = [
|
|
2411
3016
|
"cr-switch",
|
|
2412
3017
|
`cr-switch--${size}`,
|
|
2413
3018
|
`cr-switch--label-${labelPosition}`,
|
|
2414
3019
|
disabled && "cr-switch--disabled",
|
|
2415
3020
|
className
|
|
2416
3021
|
].filter(Boolean).join(" ");
|
|
2417
|
-
return /* @__PURE__ */ jsxs("div", { className:
|
|
3022
|
+
return /* @__PURE__ */ jsxs("div", { className: classes2, style, children: [
|
|
2418
3023
|
/* @__PURE__ */ jsx(
|
|
2419
3024
|
InputSwitch,
|
|
2420
3025
|
{
|
|
@@ -2590,7 +3195,7 @@ function coluna(element, index, opcoes) {
|
|
|
2590
3195
|
const { help, header, align, selectionMode, ...props } = element.props;
|
|
2591
3196
|
const { carregando, ajustada, abrirMenu } = opcoes;
|
|
2592
3197
|
const frozen = opcoes.fixada ?? props.frozen;
|
|
2593
|
-
const
|
|
3198
|
+
const chave2 = chaveDaColuna(element.props, index);
|
|
2594
3199
|
const celula = [
|
|
2595
3200
|
"cr-table__cell",
|
|
2596
3201
|
`cr-table__cell--${align ?? "left"}`,
|
|
@@ -2620,7 +3225,7 @@ function coluna(element, index, opcoes) {
|
|
|
2620
3225
|
// Botão direito (ou a tecla de menu) no cabeçalho: o menu de contexto da coluna.
|
|
2621
3226
|
...abrirMenu && !selectionMode && !carregando && {
|
|
2622
3227
|
onContextMenu: (event) => abrirMenu(event, {
|
|
2623
|
-
chave,
|
|
3228
|
+
chave: chave2,
|
|
2624
3229
|
titulo: typeof header === "string" ? header : props.field ?? "",
|
|
2625
3230
|
sortField: props.sortField ?? props.field,
|
|
2626
3231
|
sortable: Boolean(props.sortable),
|
|
@@ -2637,7 +3242,7 @@ function coluna(element, index, opcoes) {
|
|
|
2637
3242
|
rowCheckbox: caixa("Selecionar linha")
|
|
2638
3243
|
}
|
|
2639
3244
|
},
|
|
2640
|
-
element.key ??
|
|
3245
|
+
element.key ?? chave2
|
|
2641
3246
|
);
|
|
2642
3247
|
}
|
|
2643
3248
|
function TableBase({
|
|
@@ -2795,11 +3400,11 @@ function TableBase({
|
|
|
2795
3400
|
}
|
|
2796
3401
|
},
|
|
2797
3402
|
children: elementos.map((element, index) => {
|
|
2798
|
-
const
|
|
3403
|
+
const chave2 = chaveDaColuna(element.props, index);
|
|
2799
3404
|
return coluna(element, index, {
|
|
2800
3405
|
carregando,
|
|
2801
|
-
fixada: fixadas[
|
|
2802
|
-
ajustada: Boolean(ajustadas[
|
|
3406
|
+
fixada: fixadas[chave2],
|
|
3407
|
+
ajustada: Boolean(ajustadas[chave2]),
|
|
2803
3408
|
abrirMenu: columnMenu ? abrirMenu : void 0
|
|
2804
3409
|
});
|
|
2805
3410
|
})
|
|
@@ -2893,7 +3498,7 @@ function BarraDeFiltros({
|
|
|
2893
3498
|
clearLabel
|
|
2894
3499
|
}) {
|
|
2895
3500
|
const chipsRef = useRef(null);
|
|
2896
|
-
const [
|
|
3501
|
+
const [setas2, setSetas] = useState({ esquerda: false, direita: false });
|
|
2897
3502
|
const medir = useCallback(() => {
|
|
2898
3503
|
const chips = chipsRef.current;
|
|
2899
3504
|
if (!chips) return;
|
|
@@ -2916,7 +3521,7 @@ function BarraDeFiltros({
|
|
|
2916
3521
|
behavior: "smooth"
|
|
2917
3522
|
});
|
|
2918
3523
|
return /* @__PURE__ */ jsxs("div", { className: "cr-table-toolbar__filters", children: [
|
|
2919
|
-
|
|
3524
|
+
setas2.esquerda && /* @__PURE__ */ jsx(
|
|
2920
3525
|
IconButton,
|
|
2921
3526
|
{
|
|
2922
3527
|
variant: "tertiary",
|
|
@@ -2947,7 +3552,7 @@ function BarraDeFiltros({
|
|
|
2947
3552
|
},
|
|
2948
3553
|
`${filter.label}:${filter.value}`
|
|
2949
3554
|
)) }),
|
|
2950
|
-
|
|
3555
|
+
setas2.direita && /* @__PURE__ */ jsx(
|
|
2951
3556
|
IconButton,
|
|
2952
3557
|
{
|
|
2953
3558
|
variant: "tertiary",
|
|
@@ -3159,6 +3764,6 @@ var Toast = forwardRef(function Toast2({ position = "top-right", closeLabel = "F
|
|
|
3159
3764
|
);
|
|
3160
3765
|
});
|
|
3161
3766
|
|
|
3162
|
-
export { Accordion, AccordionTab, AutoComplete, Badge, Button, Card, Chart, Checkbox, Chip, Column, ContextMenu, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Message, Modal, MultiSelect, PageHeader, Paginator, Panel, Radio, ScrollPanel, SegmentControl, Select, Skeleton, Switch, TabPanel, Table, TableRowActions, TableToolbar, Tabs, Tag, Toast, Tooltip };
|
|
3767
|
+
export { Accordion, AccordionTab, AutoComplete, Badge, Button, Calendar, Card, Chart, Checkbox, Chip, Column, ContextMenu, DATE_PERIODS, DatePicker, DateRangeButton, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Message, Modal, MultiSelect, PageHeader, Paginator, Panel, Radio, ScrollPanel, SegmentControl, Select, Skeleton, Switch, TabPanel, Table, TableRowActions, TableToolbar, Tabs, Tag, Toast, Tooltip };
|
|
3163
3768
|
//# sourceMappingURL=index.js.map
|
|
3164
3769
|
//# sourceMappingURL=index.js.map
|