@giro-ds/react 3.0.5 → 3.0.6
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/components/Avatar/Avatar.d.ts +1 -1
- package/dist/components/Avatar/Avatar.types.d.ts +21 -5
- package/dist/components/Badge/Badge.types.d.ts +25 -7
- package/dist/components/Button/Button.types.d.ts +41 -8
- package/dist/components/Calendar/Calendar.d.ts +2 -1
- package/dist/components/Calendar/Calendar.types.d.ts +56 -12
- package/dist/components/Callout/Callout.types.d.ts +28 -11
- package/dist/components/Checkbox/Checkbox.types.d.ts +28 -4
- package/dist/components/Chips/Chips.types.d.ts +28 -11
- package/dist/components/Container/Container.types.d.ts +11 -0
- package/dist/components/DatePicker/DatePicker.types.d.ts +36 -18
- package/dist/components/DatePicker/DateUtils.d.ts +1 -1
- package/dist/components/DatePicker/index.d.ts +1 -1
- package/dist/components/Dialog/Dialog.types.d.ts +35 -11
- package/dist/components/Drawer/Drawer.types.d.ts +58 -27
- package/dist/components/Dropdown/Dropdown.types.d.ts +47 -20
- package/dist/components/Filter/Filter.types.d.ts +47 -28
- package/dist/components/ListItem/ListItem.d.ts +0 -5
- package/dist/components/ListItem/ListItem.types.d.ts +35 -17
- package/dist/components/Menu/Menu.d.ts +1 -1
- package/dist/components/Menu/Menu.types.d.ts +60 -2
- package/dist/components/Quantity/Quantity.types.d.ts +31 -13
- package/dist/components/Radio/Radio.types.d.ts +39 -2
- package/dist/components/Search/Search.types.d.ts +34 -5
- package/dist/components/Select/Select.types.d.ts +117 -8
- package/dist/components/Switch/Switch.types.d.ts +26 -2
- package/dist/components/Table/Table.d.ts +1 -1
- package/dist/components/Table/Table.types.d.ts +2 -3
- package/dist/components/Table/TableHeader.d.ts +1 -1
- package/dist/components/Table/TablePagination.d.ts +1 -9
- package/dist/components/TextField/TextField.types.d.ts +49 -11
- package/dist/components/Toast/Toast.types.d.ts +37 -0
- package/dist/components/Tooltip/Tooltip.types.d.ts +32 -4
- package/dist/components/VerificationCode/VerificationCode.types.d.ts +29 -9
- package/dist/components/index.d.ts +1 -1
- package/dist/index.cjs +141 -169
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +860 -250
- package/dist/index.esm.js +134 -180
- package/dist/index.esm.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/types/common.types.d.ts +12 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import React, { useId, useMemo, useRef, useState, useEffect, useCallback, forwardRef, memo, useReducer, createElement, isValidElement, createContext, useContext } from 'react';
|
|
3
2
|
import clsx from 'clsx';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import React__default, { useId, useMemo, useRef, useState, useEffect, useCallback, forwardRef, memo, useReducer, createElement, isValidElement, createContext, useContext } from 'react';
|
|
4
5
|
import { SpinnerIos16Regular, ChevronUp16Regular, ChevronDown16Regular, ChevronLeft16Regular, ChevronRight16Regular, Info12Regular, Dismiss16Regular, Calendar16Regular, Search16Regular, ChevronDownRegular, ChevronRight16Filled, Subtract16Regular, Add16Regular, Info20Filled, Warning20Filled, CheckmarkCircle20Filled } from '@fluentui/react-icons';
|
|
5
6
|
import { initReactI18next, useTranslation } from 'react-i18next';
|
|
6
7
|
import i18n from 'i18next';
|
|
@@ -8,18 +9,18 @@ import { Checkbox as Checkbox$1, Tooltip as Tooltip$1, Label, RadioGroup, Dropdo
|
|
|
8
9
|
|
|
9
10
|
var styles$p = {"zds-avatar__circle":"Avatar-module__zds-avatar__circle___DXcGa","zds-avatar__large":"Avatar-module__zds-avatar__large___G6qoo","zds-avatar__circle__icon":"Avatar-module__zds-avatar__circle__icon___u14vV","zds-avatar__small":"Avatar-module__zds-avatar__small___d-Pj5"};
|
|
10
11
|
|
|
11
|
-
let Avatar = ({ id = '', icon, size = '
|
|
12
|
+
let Avatar = ({ id = '', icon, size = 'sm', className = '', ...rest }) => {
|
|
12
13
|
const componentId = id || useId();
|
|
13
14
|
const AvatarClass = clsx(styles$p['zds-avatar__circle'], {
|
|
14
|
-
[styles$p['zds-avatar__large']]: size === '
|
|
15
|
-
[styles$p['zds-avatar__small']]: size === '
|
|
15
|
+
[styles$p['zds-avatar__large']]: size === 'lg',
|
|
16
|
+
[styles$p['zds-avatar__small']]: size === 'sm',
|
|
16
17
|
}, className);
|
|
17
|
-
return (jsx("div", { className: AvatarClass, id: componentId, role: "img", "aria-label": `Avatar ${size}`, children: jsx("div", { className: styles$p['zds-avatar__circle__icon'], children: icon }) }));
|
|
18
|
+
return (jsx("div", { className: AvatarClass, id: componentId, role: "img", "aria-label": `Avatar ${size}`, ...rest, children: jsx("div", { className: styles$p['zds-avatar__circle__icon'], children: icon }) }));
|
|
18
19
|
};
|
|
19
20
|
|
|
20
21
|
var styles$o = {"zds-badge__container":"Badge-module__zds-badge__container___NMAZD","zds-badge":"Badge-module__zds-badge___TeF7g","zds-badge__status":"Badge-module__zds-badge__status___3rFKE","zds-badge__small":"Badge-module__zds-badge__small___lVA0I","zds-badge__large":"Badge-module__zds-badge__large___yxb6z","zds-badge__status__empty":"Badge-module__zds-badge__status__empty___zWu8n"};
|
|
21
22
|
|
|
22
|
-
const Badge = ({ children, badgeValue = null, type = 'notification', className
|
|
23
|
+
const Badge = ({ children, badgeValue = null, type = 'notification', className, id, 'aria-label': ariaLabel, }) => {
|
|
23
24
|
const isEmpty = badgeValue === null || badgeValue === undefined || badgeValue === '';
|
|
24
25
|
const componentId = id || useId();
|
|
25
26
|
const getDisplayValue = (inputValue) => {
|
|
@@ -52,7 +53,7 @@ const Badge = ({ children, badgeValue = null, type = 'notification', className =
|
|
|
52
53
|
|
|
53
54
|
var styles$n = {"button":"Button-module__button___18Bed","button-lg":"Button-module__button-lg___-A8B9","button-sm":"Button-module__button-sm___L7aT7","button-filled":"Button-module__button-filled___IQx1z","button-outlined":"Button-module__button-outlined___hLkLN","button-text":"Button-module__button-text___8GFeA","buttonWithIcon":"Button-module__buttonWithIcon___8ehK1","buttonIconPosition-left":"Button-module__buttonIconPosition-left___uOY6b","buttonIconPosition-right":"Button-module__buttonIconPosition-right___eswRS","buttonIconPosition-both":"Button-module__buttonIconPosition-both___1Lith","buttonNoContent":"Button-module__buttonNoContent___Tc9jk","buttonIconOnly":"Button-module__buttonIconOnly___aifk4","buttonIconLeft":"Button-module__buttonIconLeft___RICR3","buttonIconRight":"Button-module__buttonIconRight___71lu2","buttonFullWidth":"Button-module__buttonFullWidth___tXuVE","disabled":"Button-module__disabled___UzdWL","buttonLoading":"Button-module__buttonLoading___RGdNw","spin":"Button-module__spin___kQKH9"};
|
|
54
55
|
|
|
55
|
-
const Button =
|
|
56
|
+
const Button = React__default.forwardRef(({ as, children, variant = 'filled', iconPosition = 'left', href, to, external = false, target, rel, disabled = false, onClick, size = 'lg', className, type = 'button', id, icon, fullWidth = false, ariaLabel, iconOnly = false, loading = false, ...restProps }, ref) => {
|
|
56
57
|
const generatedId = useId();
|
|
57
58
|
const componentId = id || generatedId;
|
|
58
59
|
const getComponent = () => {
|
|
@@ -66,7 +67,7 @@ const Button = React.forwardRef(({ as, children, variant = 'filled', iconPositio
|
|
|
66
67
|
};
|
|
67
68
|
const Component = getComponent();
|
|
68
69
|
const hasContent = useMemo(() => {
|
|
69
|
-
return children &&
|
|
70
|
+
return children && React__default.Children.count(children) > 0;
|
|
70
71
|
}, [children]);
|
|
71
72
|
const buttonClasses = clsx(styles$n.button, styles$n[`button-${variant}`], styles$n[`button-${size}`], {
|
|
72
73
|
[styles$n['buttonLoading']]: loading,
|
|
@@ -266,7 +267,7 @@ i18n
|
|
|
266
267
|
/**
|
|
267
268
|
* Calendar component with keyboard navigation support and full TypeScript implementation.
|
|
268
269
|
*/
|
|
269
|
-
const Calendar = ({ currentDate, className, selectedDate = null, onDateChange, onDaySelect, onClear, locale = 'pt-br', format = 'dd/mm/yyyy', id
|
|
270
|
+
const Calendar = ({ currentDate, className, selectedDate = null, onDateChange, onDaySelect, onClear, locale = 'pt-br', format = 'dd/mm/yyyy', id, minDate, maxDate, }) => {
|
|
270
271
|
const { t, i18n } = useTranslation();
|
|
271
272
|
const componentId = id || useId();
|
|
272
273
|
const calendarRef = useRef(null);
|
|
@@ -594,12 +595,12 @@ const Calendar = ({ currentDate, className, selectedDate = null, onDateChange, o
|
|
|
594
595
|
};
|
|
595
596
|
// ✅ Default props integrados na função usando valores padrão dos parâmetros
|
|
596
597
|
Calendar.displayName = 'Calendar';
|
|
597
|
-
const MemoizedCalendar =
|
|
598
|
+
const MemoizedCalendar = React__default.memo(Calendar);
|
|
598
599
|
MemoizedCalendar.displayName = 'Calendar';
|
|
599
600
|
|
|
600
601
|
var styles$l = {"zds-callout__container":"Callout-module__zds-callout__container___EoOQd","zds-callout__container__with-title":"Callout-module__zds-callout__container__with-title___NUq2k","zds-callout__neutral":"Callout-module__zds-callout__neutral___ib9gW","zds-callout__brand":"Callout-module__zds-callout__brand___UYVny","zds-callout__color":"Callout-module__zds-callout__color___6ojEV","zds-callout__alert":"Callout-module__zds-callout__alert___gSOsh","zds-callout__success":"Callout-module__zds-callout__success___6W096","zds-callout__title":"Callout-module__zds-callout__title___jmmqj","zds-callout__text":"Callout-module__zds-callout__text___MTO5R","zds-callout__icon":"Callout-module__zds-callout__icon___-CaUD","zds-callout__content":"Callout-module__zds-callout__content___hh0Mj","zds-callout__subcontent":"Callout-module__zds-callout__subcontent___olIpt"};
|
|
601
602
|
|
|
602
|
-
const Callout = ({ type = 'neutral', title
|
|
603
|
+
const Callout = ({ type = 'neutral', title, text, icon, className, id, ...rest }) => {
|
|
603
604
|
const generatedId = useId();
|
|
604
605
|
const titleId = id || `callout-title-${generatedId}`;
|
|
605
606
|
const componentId = id || generatedId;
|
|
@@ -607,11 +608,9 @@ const Callout = ({ type = 'neutral', title = null, text = '', icon = null, class
|
|
|
607
608
|
[styles$l['zds-callout__container__with-title']]: title,
|
|
608
609
|
[styles$l['zds-callout__no-icon']]: !icon,
|
|
609
610
|
}, className);
|
|
610
|
-
return (jsx("div", { id: componentId, className: calloutClass, "aria-live": "polite", role: "alert", "aria-labelledby": title ? titleId : undefined, children: jsxs("div", { className: styles$l['zds-callout__content'], children: [icon && jsx("span", { className: styles$l['zds-callout__icon'], children: icon }), jsxs("div", { className: styles$l['zds-callout__subcontent'], children: [title && (jsx("span", { id: titleId, className: styles$l['zds-callout__title'], children: title })), text && jsx("span", { className: styles$l['zds-callout__text'], children: text })] })] }) }));
|
|
611
|
+
return (jsx("div", { id: componentId, className: calloutClass, "aria-live": "polite", role: "alert", "aria-labelledby": title ? titleId : undefined, ...rest, children: jsxs("div", { className: styles$l['zds-callout__content'], children: [icon && jsx("span", { className: styles$l['zds-callout__icon'], children: icon }), jsxs("div", { className: styles$l['zds-callout__subcontent'], children: [title && (jsx("span", { id: titleId, className: styles$l['zds-callout__title'], children: title })), text && jsx("span", { className: styles$l['zds-callout__text'], children: text })] })] }) }));
|
|
611
612
|
};
|
|
612
613
|
|
|
613
|
-
var styles$k = {"container":"Checkbox-module__container___pUY-s","root":"Checkbox-module__root___BS5dT","disabled":"Checkbox-module__disabled___WagIC","label":"Checkbox-module__label___JBaRm","indicator":"Checkbox-module__indicator___HXLHH","wrapperCheckbox":"Checkbox-module__wrapperCheckbox___m2qIW"};
|
|
614
|
-
|
|
615
614
|
const CheckSmall = ({ className = '', width = 12, height = 10, fill = 'white', ...restProps }) => {
|
|
616
615
|
return (jsx("svg", { width: width, height: height, viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, "aria-hidden": "true", ...restProps, children: jsx("path", { d: "M4 9.4L0 5.4L1.4 4L4 6.6L10.6 0L12 1.4L4 9.4Z", fill: fill }) }));
|
|
617
616
|
};
|
|
@@ -620,8 +619,10 @@ const CheckHalf = ({ className = '', width = 16, height = 16, fill = 'white', ..
|
|
|
620
619
|
return (jsx("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, "aria-hidden": "true", ...restProps, children: jsx("g", { id: "Icons/check_indeterminate_small", children: jsx("path", { id: "icon", d: "M3 9V7H13V9H3Z", fill: fill }) }) }));
|
|
621
620
|
};
|
|
622
621
|
|
|
623
|
-
|
|
624
|
-
|
|
622
|
+
var styles$k = {"container":"Checkbox-module__container___pUY-s","root":"Checkbox-module__root___BS5dT","disabled":"Checkbox-module__disabled___WagIC","label":"Checkbox-module__label___JBaRm","indicator":"Checkbox-module__indicator___HXLHH","wrapperCheckbox":"Checkbox-module__wrapperCheckbox___m2qIW"};
|
|
623
|
+
|
|
624
|
+
const Checkbox = ({ id, label, onCheckedChange, checked, disabled, className, indeterminate = false, ...rest }) => {
|
|
625
|
+
const componentId = id || React.useId();
|
|
625
626
|
return (jsxs("div", { className: clsx(styles$k.container, className), children: [jsx("div", { className: clsx(styles$k.wrapperCheckbox, {
|
|
626
627
|
[styles$k.disabled]: disabled,
|
|
627
628
|
}), role: "presentation", tabIndex: disabled ? -1 : 0, children: jsx(Checkbox$1.Root, { className: styles$k.root, checked: checked, id: componentId, onCheckedChange: onCheckedChange, disabled: disabled, "data-disabled": disabled, "data-indeterminate": indeterminate, "aria-checked": indeterminate ? 'mixed' : checked ? 'true' : 'false', ...rest, children: jsx(Checkbox$1.Indicator, { className: styles$k.indicator, children: indeterminate ? jsx(CheckHalf, {}) : jsx(CheckSmall, {}) }) }) }), jsx("label", { className: clsx(styles$k.label, { [styles$k.disabled]: disabled }), htmlFor: componentId, children: label })] }));
|
|
@@ -629,10 +630,7 @@ const Checkbox = ({ id, label = '', onCheckedChange, checked, disabled, classNam
|
|
|
629
630
|
|
|
630
631
|
var styles$j = {"zds-chips":"Chips-module__zds-chips___LEq0v","zds-chips__title":"Chips-module__zds-chips__title___JexH8","zds-chips__icon__left":"Chips-module__zds-chips__icon__left___frGxl","zds-chips__icon__right":"Chips-module__zds-chips__icon__right___3EmZr","has-left-icon":"Chips-module__has-left-icon___BNIkr","has-right-icon":"Chips-module__has-right-icon___jhoos","zds-chips--neutral":"Chips-module__zds-chips--neutral___FyRQq","zds-chips--brand":"Chips-module__zds-chips--brand___GbmJv","zds-chips--color":"Chips-module__zds-chips--color___JpMwI","zds-chips--alert":"Chips-module__zds-chips--alert___MHi5a","zds-chips--success":"Chips-module__zds-chips--success___jg4-F","zds-chips--disabled":"Chips-module__zds-chips--disabled___HkRDl"};
|
|
631
632
|
|
|
632
|
-
|
|
633
|
-
* Componente Chips para exibir tags/etiquetas com ícones opcionais
|
|
634
|
-
*/
|
|
635
|
-
const Chips = ({ title, leftIcon = null, rightIcon = null, type = 'neutral', disabled = false, className = '', }) => {
|
|
633
|
+
const Chips = ({ title, leftIcon, rightIcon, type = 'neutral', disabled = false, className, ...rest }) => {
|
|
636
634
|
if (!title || title.trim() === '') {
|
|
637
635
|
console.warn('Chips: title prop is required and cannot be empty');
|
|
638
636
|
return null;
|
|
@@ -642,9 +640,9 @@ const Chips = ({ title, leftIcon = null, rightIcon = null, type = 'neutral', dis
|
|
|
642
640
|
[styles$j['has-left-icon']]: leftIcon,
|
|
643
641
|
[styles$j['has-right-icon']]: rightIcon,
|
|
644
642
|
}, className);
|
|
645
|
-
return (jsxs("div", { className: chipsClass, "aria-label": `Chip: ${title}`, "aria-disabled": disabled, children: [leftIcon && (jsx("span", { className: styles$j['zds-chips__icon__left'], "aria-hidden": "true", children: leftIcon })), jsx("span", { className: styles$j['zds-chips__title'], children: title }), rightIcon && (jsx("span", { className: styles$j['zds-chips__icon__right'], children: rightIcon }))] }));
|
|
643
|
+
return (jsxs("div", { className: chipsClass, "aria-label": `Chip: ${title}`, "aria-disabled": disabled, ...rest, children: [leftIcon && (jsx("span", { className: styles$j['zds-chips__icon__left'], "aria-hidden": "true", children: leftIcon })), jsx("span", { className: styles$j['zds-chips__title'], children: title }), rightIcon && (jsx("span", { className: styles$j['zds-chips__icon__right'], children: rightIcon }))] }));
|
|
646
644
|
};
|
|
647
|
-
const MemoizedChips =
|
|
645
|
+
const MemoizedChips = React__default.memo(Chips);
|
|
648
646
|
MemoizedChips.displayName = 'Chips';
|
|
649
647
|
|
|
650
648
|
var styles$i = {"container":"Container-module__container___exPuE"};
|
|
@@ -653,15 +651,15 @@ function Container({ children }) {
|
|
|
653
651
|
return (jsx("main", { className: `${styles$i['container']} mx-auto`, children: children }));
|
|
654
652
|
}
|
|
655
653
|
|
|
656
|
-
var styles$h = {"wrapperLabel":"index-module__wrapperLabel___XJzZO","requiredLabel":"index-module__requiredLabel___7oZkh","infoIcon":"index-module__infoIcon___lClx4","errorLabel":"index-module__errorLabel___qa6h6","disabledLabel":"index-module__disabledLabel___U9vL8"};
|
|
654
|
+
var styles$h = {"labelContainer":"index-module__labelContainer___WGyDF","wrapperLabel":"index-module__wrapperLabel___XJzZO","requiredLabel":"index-module__requiredLabel___7oZkh","infoIcon":"index-module__infoIcon___lClx4","errorLabel":"index-module__errorLabel___qa6h6","disabledLabel":"index-module__disabledLabel___U9vL8"};
|
|
657
655
|
|
|
658
656
|
var styles$g = {"tooltipContent":"Tooltip-module__tooltipContent___xycUg","triggerWrapper":"Tooltip-module__triggerWrapper___x83XR"};
|
|
659
657
|
|
|
660
|
-
const Tooltip = ({ children, text, side = 'bottom', align = 'start', maxWidth, sideOffset = 10 }) => {
|
|
661
|
-
return (jsx(Tooltip$1.Provider, { children: jsxs(Tooltip$1.Root, { children: [jsx(Tooltip$1.Trigger, { asChild: true, children: jsx("span", { className: styles$g.triggerWrapper, children: children }) }), jsx(Tooltip$1.Portal, { children: jsx(Tooltip$1.Content, { className: styles$g.tooltipContent, side: side, align: align, sideOffset: sideOffset, style: { maxWidth: maxWidth ? `${maxWidth}px` : 'auto' }, children: text }) })] }) }));
|
|
658
|
+
const Tooltip = ({ children, text, side = 'bottom', align = 'start', maxWidth, sideOffset = 10, ...rest }) => {
|
|
659
|
+
return (jsx(Tooltip$1.Provider, { children: jsxs(Tooltip$1.Root, { children: [jsx(Tooltip$1.Trigger, { asChild: true, children: jsx("span", { className: styles$g.triggerWrapper, children: children }) }), jsx(Tooltip$1.Portal, { children: jsx(Tooltip$1.Content, { className: styles$g.tooltipContent, side: side, align: align, sideOffset: sideOffset, style: { maxWidth: maxWidth ? `${maxWidth}px` : 'auto' }, ...rest, children: text }) })] }) }));
|
|
662
660
|
};
|
|
663
661
|
|
|
664
|
-
const LabelComponent = ({ children, htmlFor, required = false, tooltip = false, tooltipText, side = 'bottom', align = 'start', className, error = false, disabled = false }) => (jsx(Fragment, { children: tooltip ? (
|
|
662
|
+
const LabelComponent = ({ children, htmlFor, required = false, tooltip = false, tooltipText, side = 'bottom', align = 'start', className, error = false, disabled = false }) => (jsx(Fragment, { children: tooltip ? (jsxs("div", { className: styles$h.labelContainer, children: [jsxs(Label.Root, { className: clsx(styles$h.wrapperLabel, error && styles$h.errorLabel, className), htmlFor: htmlFor, children: [children, required && jsx("span", { className: styles$h.requiredLabel, children: "*" })] }), jsx(Tooltip, { side: side, align: align, text: tooltipText || '', children: jsx(Info12Regular, { className: styles$h.infoIcon }) })] })) : (jsxs(Label.Root, { className: clsx(styles$h.wrapperLabel, error && !disabled && styles$h.errorLabel, disabled && styles$h.disabledLabel, className), htmlFor: htmlFor, children: [children, required && jsx("span", { className: styles$h.requiredLabel, children: "*" })] })) }));
|
|
665
663
|
|
|
666
664
|
var styles$f = {"container":"TextField-module__container___WJHFR","inputWrapper":"TextField-module__inputWrapper___INjfd","inputContainer":"TextField-module__inputContainer___3EsFJ","icon":"TextField-module__icon___p1vwi","clearButton":"TextField-module__clearButton___kgOot","helperText":"TextField-module__helperText___d5QGC","error":"TextField-module__error___IGQzp","disabled":"TextField-module__disabled___roIKP"};
|
|
667
665
|
|
|
@@ -675,7 +673,7 @@ const validateInput = ({ value, maxLength, errorMessage, required }) => {
|
|
|
675
673
|
return '';
|
|
676
674
|
};
|
|
677
675
|
|
|
678
|
-
const TextField = forwardRef(({ className, value
|
|
676
|
+
const TextField = forwardRef(({ className, value, label, placeholder, type = 'text', onChange, disabled = false, maxLength = 30, required = false, helperText, tooltip = false, tooltipText, side = 'bottom', align = 'start', errorMessage, id, icon, onBlur, onFocus, name, ...inputProps }, ref) => {
|
|
679
677
|
const normalizeValue = (val) => {
|
|
680
678
|
return val === undefined || val === null ? '' : String(val);
|
|
681
679
|
};
|
|
@@ -746,7 +744,7 @@ const TextField = forwardRef(({ className, value = '', label, placeholder, type
|
|
|
746
744
|
}, "aria-label": "Limpar campo", tabIndex: -1, children: jsx(Dismiss16Regular, {}) }))] }), jsx("span", { id: helperId, className: styles$f.helperText, "aria-live": hasError ? 'polite' : undefined, children: displayHelperText })] })] }));
|
|
747
745
|
});
|
|
748
746
|
TextField.displayName = 'TextField';
|
|
749
|
-
var TextField$1 =
|
|
747
|
+
var TextField$1 = React__default.memo(TextField);
|
|
750
748
|
|
|
751
749
|
/**
|
|
752
750
|
* Formata uma data para string conforme o locale.
|
|
@@ -843,7 +841,7 @@ function parseDate(dateString, locale = 'pt-br') {
|
|
|
843
841
|
|
|
844
842
|
var styles$e = {"zds-date-picker":"DatePicker-module__zds-date-picker___FjFTb","zds-date-picker__calendar-popup":"DatePicker-module__zds-date-picker__calendar-popup___hEkq7","zds-calendar--left":"DatePicker-module__zds-calendar--left___5z2UM","zds-calendar--right":"DatePicker-module__zds-calendar--right___NCJtd","zds-date-picker__icon":"DatePicker-module__zds-date-picker__icon___nYEnv","zds-date-picker__icon--disabled":"DatePicker-module__zds-date-picker__icon--disabled___p4Rr2"};
|
|
845
843
|
|
|
846
|
-
const DatePicker = ({ locale = 'pt-br', calendarPosition = 'left', helperText
|
|
844
|
+
const DatePicker = ({ locale = 'pt-br', calendarPosition = 'left', helperText, required = false, label = 'Data', value, defaultValue, onChange, disabled = false, error: externalError, minDate, maxDate, className, 'data-testid': testId, }) => {
|
|
847
845
|
// ✅ IDs únicos para acessibilidade
|
|
848
846
|
const fieldId = useId();
|
|
849
847
|
const calendarId = `${fieldId}-calendar`;
|
|
@@ -1032,7 +1030,7 @@ const DatePicker = ({ locale = 'pt-br', calendarPosition = 'left', helperText =
|
|
|
1032
1030
|
setCurrentDate(new Date());
|
|
1033
1031
|
} })) })] }) }));
|
|
1034
1032
|
};
|
|
1035
|
-
var DatePicker_default =
|
|
1033
|
+
var DatePicker_default = React__default.memo(DatePicker);
|
|
1036
1034
|
|
|
1037
1035
|
var styles$d = {"zds-dialog__overlay":"Dialog-module__zds-dialog__overlay___I0T-Q","zds-dialog__wrapper":"Dialog-module__zds-dialog__wrapper___Va69y","zds-dialog":"Dialog-module__zds-dialog___Bi-9b","zds-dialog__title":"Dialog-module__zds-dialog__title___w9yHe","zds-dialog__text":"Dialog-module__zds-dialog__text___-GmvH","zds-dialog__actions":"Dialog-module__zds-dialog__actions___hHHmN"};
|
|
1038
1036
|
|
|
@@ -1120,7 +1118,7 @@ const Dialog = ({ show, title, text, textConfirm = 'OK', textCancel = 'Cancelar'
|
|
|
1120
1118
|
return (jsxs(Fragment, { children: [jsx("div", { className: styles$d['zds-dialog__overlay'] }), jsx("div", { className: styles$d['zds-dialog__wrapper'], children: jsxs("div", { className: clsx(styles$d['zds-dialog'], className), role: "dialog", "aria-modal": "true", id: id, "aria-labelledby": `zds-dialog-title-${id}`, "aria-describedby": `zds-dialog-desc-${id}`, tabIndex: -1, ref: containerRef, children: [jsx("div", { id: `zds-dialog-title-${id}`, className: styles$d['zds-dialog__title'], children: title }), jsx("div", { id: `zds-dialog-desc-${id}`, className: styles$d['zds-dialog__text'], children: text }), jsxs("div", { className: styles$d['zds-dialog__actions'], children: [!!(textCancel && textCancel.trim()) && (jsx(Button, { variant: "outlined", onClick: handleCancel, children: textCancel })), jsx(Button, { variant: "filled", onClick: handleConfirm, children: textConfirm })] })] }) })] }));
|
|
1121
1119
|
};
|
|
1122
1120
|
// Memoização para otimização de performance
|
|
1123
|
-
const MemoizedDialog =
|
|
1121
|
+
const MemoizedDialog = React__default.memo(Dialog);
|
|
1124
1122
|
MemoizedDialog.displayName = 'Dialog';
|
|
1125
1123
|
|
|
1126
1124
|
var styles$c = {"zds-custom__drawer-shadow":"Drawer-module__zds-custom__drawer-shadow___xoF-q","zds-custom__drawer-shadow--visible":"Drawer-module__zds-custom__drawer-shadow--visible___9JUdU","zds-custom__drawer-sidebar":"Drawer-module__zds-custom__drawer-sidebar___MC8Zt","zds-custom__drawer-sidebar--open":"Drawer-module__zds-custom__drawer-sidebar--open___DiMJb","zds-custom__drawer-sidebar--disabled":"Drawer-module__zds-custom__drawer-sidebar--disabled___6OGsA","zds-drawer__title-close":"Drawer-module__zds-drawer__title-close___g9K3D","zds-drawer__title":"Drawer-module__zds-drawer__title___lqHFw","zds-drawer__children":"Drawer-module__zds-drawer__children___ZnzF6"};
|
|
@@ -1131,7 +1129,7 @@ var styles$c = {"zds-custom__drawer-shadow":"Drawer-module__zds-custom__drawer-s
|
|
|
1131
1129
|
* Segue padrões WCAG 2.1 AA para acessibilidade
|
|
1132
1130
|
*/
|
|
1133
1131
|
const Drawer = ({ children, customWidth = '400px', // ✅ Valor padrão útil
|
|
1134
|
-
onClose, title = 'Título', isOpen = false, onOpen, className
|
|
1132
|
+
onClose, title = 'Título', isOpen = false, onOpen, className, id, disabled = false, onOverlayClick, closeOnOverlayClick = true, closeOnEscape = true, }) => {
|
|
1135
1133
|
const internalClose = useCallback(() => {
|
|
1136
1134
|
if (disabled)
|
|
1137
1135
|
return;
|
|
@@ -1218,7 +1216,7 @@ onClose, title = 'Título', isOpen = false, onOpen, className = '', id, disabled
|
|
|
1218
1216
|
|
|
1219
1217
|
var styles$b = {"zds-search":"Search-module__zds-search___DRIVl","zds-search__leftIcon":"Search-module__zds-search__leftIcon___gBvTI","zds-search__clearIcon":"Search-module__zds-search__clearIcon___wsOBs"};
|
|
1220
1218
|
|
|
1221
|
-
const Search =
|
|
1219
|
+
const Search = React__default.forwardRef(({ placeholder = 'Dica do que deve ser buscado', disabled = false, value, onChange, onKeyDown, onFocus, onBlur, onClear, onClick, onMouseDown, id, className, 'data-testid': testId, ...rest }, ref) => {
|
|
1222
1220
|
const [internalValue, setInternalValue] = useState('');
|
|
1223
1221
|
const isControlled = value !== undefined && onChange !== undefined;
|
|
1224
1222
|
const currentValue = isControlled ? value : internalValue;
|
|
@@ -1263,11 +1261,8 @@ const Search = React.forwardRef(({ placeholder = 'Dica do que deve ser buscado',
|
|
|
1263
1261
|
return;
|
|
1264
1262
|
onKeyDown?.(e);
|
|
1265
1263
|
};
|
|
1266
|
-
const searchClass = clsx(styles$b['zds-search'], {
|
|
1267
|
-
|
|
1268
|
-
[className]: className,
|
|
1269
|
-
});
|
|
1270
|
-
return (jsxs("div", { className: searchClass, onClick: onClick, onMouseDown: onMouseDown, children: [jsx("span", { className: clsx(styles$b['zds-search__leftIcon'], { disabled }), tabIndex: -1, role: "presentation", "aria-hidden": "true", children: jsx(Search16Regular, {}) }), jsx("input", { ref: ref, id: inputId, type: "text", placeholder: placeholder, "aria-label": placeholder, value: currentValue || '', onChange: handleChange, onKeyDown: handleKeyDown, disabled: disabled, onFocus: handleFocus, onBlur: handleBlur, "data-testid": testId }), currentValue && currentValue.length > 0 && (jsx("span", { className: styles$b['zds-search__clearIcon'], "aria-hidden": "true", onClick: clearInputSearch, children: jsx(Dismiss16Regular, {}) }))] }));
|
|
1264
|
+
const searchClass = clsx(styles$b['zds-search'], { disabled }, className);
|
|
1265
|
+
return (jsxs("div", { className: searchClass, onClick: onClick, onMouseDown: onMouseDown, children: [jsx("span", { className: clsx(styles$b['zds-search__leftIcon'], { disabled }), tabIndex: -1, role: "presentation", "aria-hidden": "true", children: jsx(Search16Regular, {}) }), jsx("input", { ref: ref, id: inputId, type: "text", placeholder: placeholder, "aria-label": placeholder, value: currentValue || '', onChange: handleChange, onKeyDown: handleKeyDown, disabled: disabled, onFocus: handleFocus, onBlur: handleBlur, "data-testid": testId, ...rest }), currentValue && currentValue.length > 0 && (jsx("span", { className: styles$b['zds-search__clearIcon'], "aria-hidden": "true", onClick: clearInputSearch, children: jsx(Dismiss16Regular, {}) }))] }));
|
|
1271
1266
|
});
|
|
1272
1267
|
Search.displayName = 'ZdsSearch';
|
|
1273
1268
|
|
|
@@ -1403,7 +1398,7 @@ function useInfiniteScroll({ status, page, lastPage, onLoadMore, threshold = 0.1
|
|
|
1403
1398
|
};
|
|
1404
1399
|
}
|
|
1405
1400
|
|
|
1406
|
-
const Dropdown = ({ className, items
|
|
1401
|
+
const Dropdown = ({ className, items, id, type = 'text', applySearch = false, placeholder, onSelectionChange, showSubText = false, defaultSelectedIds, initialItemsSelected, maxWidth, minWidth, width, maxHeight, filter = false, position, infiniteScroll, }) => {
|
|
1407
1402
|
const [selectedItems, setSelectedItems] = useState(() => {
|
|
1408
1403
|
if (initialItemsSelected && Object.keys(initialItemsSelected).length > 0) {
|
|
1409
1404
|
return initialItemsSelected;
|
|
@@ -1543,7 +1538,7 @@ const Dropdown = ({ className, items = [], id, type = 'text', applySearch = fals
|
|
|
1543
1538
|
setSelectedItems({});
|
|
1544
1539
|
onSelectionChange?.([]);
|
|
1545
1540
|
}, [filter, onSelectionChange]);
|
|
1546
|
-
const isFirstRender =
|
|
1541
|
+
const isFirstRender = React__default.useRef(true);
|
|
1547
1542
|
useEffect(() => {
|
|
1548
1543
|
if (isFirstRender.current) {
|
|
1549
1544
|
isFirstRender.current = false;
|
|
@@ -1686,13 +1681,12 @@ const Dropdown = ({ className, items = [], id, type = 'text', applySearch = fals
|
|
|
1686
1681
|
}, children: renderItemContent(item, index) }, itemId));
|
|
1687
1682
|
})) : (jsx("li", { className: styles$a['zds-dropdown__no-results'], role: "status", "aria-live": "polite", children: "Nenhum item corresponde \u00E0 sua busca" })), filter && (jsxs("div", { className: styles$a['zds-dropdown__container-filter'], children: [jsx(Button, { size: "sm", variant: "outlined", onClick: handleClearFilter, children: "Limpar" }), jsx(Button, { size: "sm", onClick: handleApplyFilter, children: "Aplicar" })] })), infiniteScrollHook && infiniteScrollHook.hasNextPage && (jsx("li", { role: "none", className: styles$a['zds-dropdown__infinite-scroll-trigger'], children: jsx("div", { ref: infiniteScrollHook.observerRef, className: styles$a['zds-dropdown__loading-indicator'], children: infiniteScroll?.status === 'loading' ? (jsx("span", { children: "Carregando..." })) : (jsx("span", { children: "Trigger" })) }) }))] }) }));
|
|
1688
1683
|
};
|
|
1689
|
-
const MemoizedDropdown =
|
|
1684
|
+
const MemoizedDropdown = React__default.memo(Dropdown);
|
|
1690
1685
|
MemoizedDropdown.displayName = 'Dropdown';
|
|
1691
1686
|
|
|
1692
1687
|
var styles$9 = {"zds-filter__container":"Filter-module__zds-filter__container___0E-nC","zds-filter__button":"Filter-module__zds-filter__button___gT9yM","zds-filter__icon":"Filter-module__zds-filter__icon___ypiCu","zds-filter__text":"Filter-module__zds-filter__text___1iywL","zds-filter__arrow":"Filter-module__zds-filter__arrow___xflU2","zds-filter__arrow--up":"Filter-module__zds-filter__arrow--up___R0HR-","zds-filter__arrow--down":"Filter-module__zds-filter__arrow--down___4YMmg","zds-filter__button--open":"Filter-module__zds-filter__button--open___OA6EF","zds-filter__dropdown":"Filter-module__zds-filter__dropdown___-67MJ","zds-filter__dropdown--left":"Filter-module__zds-filter__dropdown--left___GgonW","zds-filter__dropdown--right":"Filter-module__zds-filter__dropdown--right___7GS9L","zds-filter-button__content":"Filter-module__zds-filter-button__content___eNIIz","zds-filter-button__arrow":"Filter-module__zds-filter-button__arrow___ZhymS","zds-filter-button__icon":"Filter-module__zds-filter-button__icon___-42Ey"};
|
|
1693
1688
|
|
|
1694
|
-
|
|
1695
|
-
const Filter = ({ items = [], type = 'checkbox', selectedIds = [], onApplyFilter, placeholder = 'Selecionar...', enableSearch = false, buttonText = 'Filter', icon, variant = 'outlined', onOpen, onClose, position = 'left', disabled = false, className = '', selectedDate, onDateSelect, onClearDate, minDate, maxDate, locale = 'pt-br', }) => {
|
|
1689
|
+
const Filter = ({ items, type = 'checkbox', selectedIds, onApplyFilter, placeholder = 'Selecionar...', enableSearch = false, buttonText = 'Filter', icon, variant = 'outlined', onOpen, onClose, position = 'left', disabled = false, className, selectedDate, onDateSelect, onClearDate, minDate, maxDate, locale = 'pt-br', ...rest }) => {
|
|
1696
1690
|
const [isOpen, setIsOpen] = useState(false);
|
|
1697
1691
|
const [currentCalendarDate, setCurrentCalendarDate] = useState(() => selectedDate || new Date());
|
|
1698
1692
|
const filterRef = useRef(null);
|
|
@@ -1778,36 +1772,27 @@ const Filter = ({ items = [], type = 'checkbox', selectedIds = [], onApplyFilter
|
|
|
1778
1772
|
const dropdownClass = clsx(styles$9['zds-filter__dropdown'], {
|
|
1779
1773
|
[styles$9[`zds-filter__dropdown--${position}`]]: position,
|
|
1780
1774
|
});
|
|
1781
|
-
return (jsxs("div", { ref: filterRef, className: filterClass, children: [jsx(Button, { variant: variant, onClick: handleToggle, disabled: disabled, icon: type === 'calendar' ? jsx(Calendar16Regular, {}) : jsx(ChevronDownRegular, {}), iconPosition: "right", size: "lg", children: jsxs("div", { className: styles$9['zds-filter-button__content'], children: [icon && jsx("span", { className: styles$9['zds-filter-button__icon'], children: icon }), jsx("span", { className: styles$9['zds-filter-button__text'], children: buttonDisplayText }), jsx("span", { className: `${styles$9['zds-filter-button__arrow']} ${isOpen ? styles$9['zds-filter-button__arrow--open'] : ''}`, children: getBadgeValue() && (jsx(Badge, { badgeValue: `+${getBadgeValue()}`, type: "status" })) })] }) }), isOpen && (jsx("div", { className: dropdownClass, children: type === 'calendar' ? (jsx(MemoizedCalendar, { currentDate: currentCalendarDate, selectedDate: selectedDate, onDaySelect: handleDateSelection, onDateChange: handleCalendarNavigation, minDate: minDate, maxDate: maxDate, locale: locale, onClear: handleClear, id: `filter-calendar-${filterRef.current?.id || ''}`, "aria-label": "Selecionar data para filtro" })) : (jsx(MemoizedDropdown, { items: items, type: type, defaultSelectedIds: selectedIds, placeholder: placeholder, applySearch: enableSearch, filter: true, onSelectionChange: handleApplyFilter })) }))] }));
|
|
1775
|
+
return (jsxs("div", { ref: filterRef, className: filterClass, ...rest, children: [jsx(Button, { variant: variant, onClick: handleToggle, disabled: disabled, icon: type === 'calendar' ? jsx(Calendar16Regular, {}) : jsx(ChevronDownRegular, {}), iconPosition: "right", size: "lg", children: jsxs("div", { className: styles$9['zds-filter-button__content'], children: [icon && jsx("span", { className: styles$9['zds-filter-button__icon'], children: icon }), jsx("span", { className: styles$9['zds-filter-button__text'], children: buttonDisplayText }), jsx("span", { className: `${styles$9['zds-filter-button__arrow']} ${isOpen ? styles$9['zds-filter-button__arrow--open'] : ''}`, children: getBadgeValue() && (jsx(Badge, { badgeValue: `+${getBadgeValue()}`, type: "status" })) })] }) }), isOpen && (jsx("div", { className: dropdownClass, children: type === 'calendar' ? (jsx(MemoizedCalendar, { currentDate: currentCalendarDate, selectedDate: selectedDate, onDaySelect: handleDateSelection, onDateChange: handleCalendarNavigation, minDate: minDate, maxDate: maxDate, locale: locale, onClear: handleClear, id: `filter-calendar-${filterRef.current?.id || ''}`, "aria-label": "Selecionar data para filtro" })) : (jsx(MemoizedDropdown, { items: items || [], type: type, defaultSelectedIds: selectedIds, placeholder: placeholder, applySearch: enableSearch, filter: true, onSelectionChange: handleApplyFilter })) }))] }));
|
|
1782
1776
|
};
|
|
1783
1777
|
|
|
1784
|
-
var styles$8 = {"
|
|
1778
|
+
var styles$8 = {"zds-list-item__container":"ListItem-module__zds-list-item__container___mEIUK","zds-list-item--checkbox":"ListItem-module__zds-list-item--checkbox___wfi9-","zds-list-item--icon":"ListItem-module__zds-list-item--icon___h3Ijt","zds-list-item--radio":"ListItem-module__zds-list-item--radio___2l7mK","zds-list-item--text":"ListItem-module__zds-list-item--text___F0PDx","zds-list-item--hovered":"ListItem-module__zds-list-item--hovered___XrDWn","zds-list-item--disabled":"ListItem-module__zds-list-item--disabled___p1xZF","zds-list-item__wrapper-text":"ListItem-module__zds-list-item__wrapper-text___5-TX2","zds-list-item__wrapper-icon":"ListItem-module__zds-list-item__wrapper-icon___S6Fr1","zds-list-item__title":"ListItem-module__zds-list-item__title___AV7nz","zds-list-item__subtext":"ListItem-module__zds-list-item__subtext___nfXky","zds-list-item__text":"ListItem-module__zds-list-item__text___3y0sB"};
|
|
1779
|
+
|
|
1780
|
+
var styles$7 = {"root":"Radio-module__root___7ElY2","wrapper":"Radio-module__wrapper___NYQ1y","disabled":"Radio-module__disabled___RZ0be","labelText":"Radio-module__labelText___Wkb41","item":"Radio-module__item___3Kvj7","itemWrapper":"Radio-module__itemWrapper___5KbM1","labelWrapper":"Radio-module__labelWrapper___LOHmJ","indicator":"Radio-module__indicator___TJ5hz"};
|
|
1785
1781
|
|
|
1786
1782
|
const Radio = ({ items, onValueChange, defaultValue, name, id, ariaLabel, orientation = 'vertical', ...rest }) => {
|
|
1787
1783
|
const componentId = id || useId();
|
|
1788
|
-
return (jsx(RadioGroup.Root, { id: componentId, className: styles$
|
|
1784
|
+
return (jsx(RadioGroup.Root, { id: componentId, className: styles$7.root, defaultValue: defaultValue, onValueChange: onValueChange, name: name, "aria-label": ariaLabel, "data-orientation": orientation, orientation: orientation, ...rest, children: items.map(({ id, value, disabled, label }) => {
|
|
1789
1785
|
const itemKey = id ?? value;
|
|
1790
1786
|
const uniqueId = `${componentId}-item-${value}`;
|
|
1791
|
-
return (jsx("div", { className: clsx(styles$
|
|
1787
|
+
return (jsx("div", { className: clsx(styles$7.wrapper, { [styles$7.disabled]: disabled }), children: jsxs("label", { className: styles$7.labelWrapper, htmlFor: uniqueId, children: [jsx("div", { className: styles$7.itemWrapper, children: jsx(RadioGroup.Item, { disabled: disabled, className: styles$7.item, value: value, id: uniqueId, "data-disabled": disabled, children: jsx(RadioGroup.Indicator, { className: styles$7.indicator }) }) }), jsx("span", { className: styles$7.labelText, children: label })] }) }, itemKey));
|
|
1792
1788
|
}) }));
|
|
1793
1789
|
};
|
|
1794
1790
|
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
/**
|
|
1798
|
-
* Componente ListItem do Zanthus Design System
|
|
1799
|
-
* Implementa item de lista unificado com variações text, checkbox, radio e icon
|
|
1800
|
-
* Segue padrões WCAG 2.1 AA para acessibilidade
|
|
1801
|
-
*/
|
|
1802
|
-
const ListItem = ({ id, className, variant = 'text', text = '', name = '', subText, disabled = false, checked = false, selected = false, onClick, onChange, icon, value = '', showSubText = false, hovered = false }) => {
|
|
1791
|
+
const ListItem = ({ id, className, variant = 'text', text, name, subText, disabled = false, checked = false, selected = false, onClick, onChange, icon, value, showSubText = false, hovered = false, ...rest }) => {
|
|
1803
1792
|
const componentId = useId();
|
|
1804
1793
|
const itemId = id || componentId;
|
|
1805
1794
|
const [internalChecked, setInternalChecked] = useState(checked);
|
|
1806
1795
|
const [internalSelected, setInternalSelected] = useState(selected);
|
|
1807
|
-
/**
|
|
1808
|
-
* Handler para clique em checkbox.
|
|
1809
|
-
* Alterna o estado e dispara o callback onChange.
|
|
1810
|
-
*/
|
|
1811
1796
|
const handleCheckboxClick = useCallback((e) => {
|
|
1812
1797
|
if (disabled)
|
|
1813
1798
|
return;
|
|
@@ -1816,10 +1801,6 @@ const ListItem = ({ id, className, variant = 'text', text = '', name = '', subTe
|
|
|
1816
1801
|
onChange?.(newChecked);
|
|
1817
1802
|
onClick?.(e);
|
|
1818
1803
|
}, [disabled, internalChecked, onChange, onClick]);
|
|
1819
|
-
/**
|
|
1820
|
-
* Handler para clique em radio.
|
|
1821
|
-
* Marca como selecionado se ainda não estiver e dispara o callback onChange.
|
|
1822
|
-
*/
|
|
1823
1804
|
const handleRadioClick = useCallback((e) => {
|
|
1824
1805
|
if (disabled)
|
|
1825
1806
|
return;
|
|
@@ -1829,10 +1810,6 @@ const ListItem = ({ id, className, variant = 'text', text = '', name = '', subTe
|
|
|
1829
1810
|
}
|
|
1830
1811
|
onClick?.(e);
|
|
1831
1812
|
}, [disabled, internalChecked, onChange, onClick]);
|
|
1832
|
-
/**
|
|
1833
|
-
* Handler para clique em variantes text e icon.
|
|
1834
|
-
* Alterna o estado de seleção interno.
|
|
1835
|
-
*/
|
|
1836
1813
|
const handleTextOrIconClick = useCallback((e) => {
|
|
1837
1814
|
if (disabled)
|
|
1838
1815
|
return;
|
|
@@ -1840,10 +1817,6 @@ const ListItem = ({ id, className, variant = 'text', text = '', name = '', subTe
|
|
|
1840
1817
|
setInternalSelected(newSelected);
|
|
1841
1818
|
onClick?.(e);
|
|
1842
1819
|
}, [disabled, internalSelected, onClick]);
|
|
1843
|
-
/**
|
|
1844
|
-
* Handler para eventos de teclado (Enter ou Espaço).
|
|
1845
|
-
* Direciona para o handler correto conforme o variant.
|
|
1846
|
-
*/
|
|
1847
1820
|
const handleKeyDown = useCallback((e) => {
|
|
1848
1821
|
if (!disabled && (e.key === 'Enter' || e.key === ' ')) {
|
|
1849
1822
|
e.preventDefault();
|
|
@@ -1862,39 +1835,35 @@ const ListItem = ({ id, className, variant = 'text', text = '', name = '', subTe
|
|
|
1862
1835
|
}
|
|
1863
1836
|
}
|
|
1864
1837
|
}, [disabled, variant, handleCheckboxClick, handleRadioClick, handleTextOrIconClick]);
|
|
1865
|
-
// ✅ Sincronização com props externas
|
|
1866
1838
|
useEffect(() => {
|
|
1867
1839
|
setInternalChecked(checked);
|
|
1868
1840
|
}, [checked]);
|
|
1869
1841
|
useEffect(() => {
|
|
1870
1842
|
setInternalSelected(selected);
|
|
1871
1843
|
}, [selected]);
|
|
1872
|
-
/**
|
|
1873
|
-
* Renderiza o conteúdo do item conforme o variant.
|
|
1874
|
-
*/
|
|
1875
1844
|
const renderVariantContent = useCallback(() => {
|
|
1876
1845
|
const validVariants = ['text', 'checkbox', 'radio', 'icon'];
|
|
1877
1846
|
const currentVariant = validVariants.includes(variant) ? variant : 'text';
|
|
1878
1847
|
switch (currentVariant) {
|
|
1879
1848
|
case 'checkbox':
|
|
1880
|
-
return (jsxs(Fragment, { children: [jsx(Checkbox, { checked: internalChecked, disabled: disabled, onCheckedChange: () => handleCheckboxClick({}) }), jsxs("div", { className: styles$
|
|
1849
|
+
return (jsxs(Fragment, { children: [jsx(Checkbox, { checked: internalChecked, disabled: disabled, onCheckedChange: () => handleCheckboxClick({}) }), jsxs("div", { className: styles$8['zds-list-item__wrapper-text'], children: [jsx("span", { id: `${itemId}-text`, className: styles$8['zds-list-item__text'], onClick: handleCheckboxClick, children: text }), showSubText && subText && (jsx("span", { id: `${itemId}-subtext`, className: styles$8['zds-list-item__subtext'], onClick: handleCheckboxClick, children: subText }))] })] }));
|
|
1881
1850
|
case 'radio':
|
|
1882
|
-
return (jsxs(Fragment, { children: [jsx("div", { className: styles$
|
|
1883
|
-
value: value,
|
|
1851
|
+
return (jsxs(Fragment, { children: [jsx("div", { className: styles$8['zds-list-item__wrapper-radio'], children: jsx("span", { className: styles$8['zds-list-item__radio'], "aria-hidden": "true", children: jsx(Radio, { name: name, onValueChange: () => handleRadioClick({}), items: [{
|
|
1852
|
+
value: value || '',
|
|
1884
1853
|
label: '',
|
|
1885
1854
|
disabled: disabled
|
|
1886
|
-
}], "aria-labelledby": `${itemId}-text` }) }) }), jsxs("div", { className: styles$
|
|
1855
|
+
}], "aria-labelledby": `${itemId}-text` }) }) }), jsxs("div", { className: styles$8['zds-list-item__wrapper-text'], children: [jsx("span", { id: `${itemId}-text`, className: styles$8['zds-list-item__title'], onClick: handleRadioClick, children: text }), showSubText && subText && (jsx("span", { id: `${itemId}-subtext`, className: styles$8['zds-list-item__subtext'], children: subText }))] })] }));
|
|
1887
1856
|
case 'icon':
|
|
1888
|
-
return (jsxs(Fragment, { children: [jsx("div", { className: styles$
|
|
1857
|
+
return (jsxs(Fragment, { children: [jsx("div", { className: styles$8['zds-list-item__wrapper-icon'], children: icon }), jsxs("div", { className: styles$8['zds-list-item__wrapper-text'], children: [jsx("span", { id: `${itemId}-text`, className: styles$8['zds-list-item__title'], onClick: handleTextOrIconClick, children: text }), showSubText && subText && (jsx("span", { id: `${itemId}-subtext`, className: styles$8['zds-list-item__subtext'], children: subText }))] })] }));
|
|
1889
1858
|
case 'text':
|
|
1890
1859
|
default:
|
|
1891
|
-
return (jsxs("div", { className: styles$
|
|
1860
|
+
return (jsxs("div", { className: styles$8['zds-list-item__wrapper-text'], children: [jsx("span", { id: `${itemId}-text`, className: styles$8['zds-list-item__title'], onClick: handleTextOrIconClick, children: text }), showSubText && subText && (jsx("span", { id: `${itemId}-subtext`, className: styles$8['zds-list-item__subtext'], children: subText }))] }));
|
|
1892
1861
|
}
|
|
1893
1862
|
}, [variant, itemId, internalChecked, disabled, handleCheckboxClick, handleRadioClick, handleTextOrIconClick, value, text, showSubText, subText, icon, name]);
|
|
1894
|
-
const listItemClass = clsx(styles$
|
|
1895
|
-
[styles$
|
|
1896
|
-
[styles$
|
|
1897
|
-
[styles$
|
|
1863
|
+
const listItemClass = clsx(styles$8['zds-list-item__container'], {
|
|
1864
|
+
[styles$8[`zds-list-item--${variant}`]]: variant,
|
|
1865
|
+
[styles$8['zds-list-item--disabled']]: disabled,
|
|
1866
|
+
[styles$8['zds-list-item--hovered']]: hovered,
|
|
1898
1867
|
[className || '']: className
|
|
1899
1868
|
});
|
|
1900
1869
|
const getAriaChecked = useCallback(() => {
|
|
@@ -1903,11 +1872,64 @@ const ListItem = ({ id, className, variant = 'text', text = '', name = '', subTe
|
|
|
1903
1872
|
}
|
|
1904
1873
|
return undefined;
|
|
1905
1874
|
}, [variant, internalChecked]);
|
|
1906
|
-
return (jsx("li", { className: listItemClass, tabIndex: disabled ? -1 : 0, onKeyDown: handleKeyDown, "aria-selected": variant === 'text' || variant === 'icon' ? internalSelected : undefined, "aria-disabled": disabled, "aria-checked": getAriaChecked(), "aria-labelledby": `${itemId}-text`, "aria-describedby": showSubText && subText ? `${itemId}-subtext` : undefined, "data-testid": "list-item", children: renderVariantContent() }));
|
|
1875
|
+
return (jsx("li", { className: listItemClass, tabIndex: disabled ? -1 : 0, onKeyDown: handleKeyDown, "aria-selected": variant === 'text' || variant === 'icon' ? internalSelected : undefined, "aria-disabled": disabled, "aria-checked": getAriaChecked(), "aria-labelledby": `${itemId}-text`, "aria-describedby": showSubText && subText ? `${itemId}-subtext` : undefined, "data-testid": "list-item", ...rest, children: renderVariantContent() }));
|
|
1907
1876
|
};
|
|
1908
1877
|
|
|
1909
1878
|
var styles$6 = {"content":"Menu-module__content___pnDF6","subContent":"Menu-module__subContent___O9T-y","itemsWrapper":"Menu-module__itemsWrapper___Fcg71","item":"Menu-module__item___S3HKY","subTrigger":"Menu-module__subTrigger___CdnJE","itemSubText":"Menu-module__itemSubText___U1HFP","itemIcon":"Menu-module__itemIcon___iyxmZ","itemSelected":"Menu-module__itemSelected___O5Ebi","itemText":"Menu-module__itemText___2fd2B","wrapperText":"Menu-module__wrapperText___PomUe","chevronIcon":"Menu-module__chevronIcon___Gda-U","searchWrapper":"Menu-module__searchWrapper___e0knQ","emptyState":"Menu-module__emptyState___3wh-S","loadingMore":"Menu-module__loadingMore___fUCvH"};
|
|
1910
1879
|
|
|
1880
|
+
const MenuItem = memo(({ item, isSelected, onSelect }) => {
|
|
1881
|
+
const handleSelect = () => {
|
|
1882
|
+
onSelect(item);
|
|
1883
|
+
};
|
|
1884
|
+
return (jsxs(DropdownMenu.Item, { className: clsx(styles$6.item, { [styles$6.itemSelected]: isSelected }), onSelect: handleSelect, disabled: item.disabled, children: [item.icon && jsx("span", { className: styles$6.itemIcon, children: item.icon }), jsxs("div", { className: styles$6.wrapperText, children: [jsx("span", { className: styles$6.itemText, children: item.text }), item.subText && (jsx("span", { className: styles$6.itemSubText, children: item.subText }))] })] }));
|
|
1885
|
+
});
|
|
1886
|
+
MenuItem.displayName = 'MenuItem';
|
|
1887
|
+
|
|
1888
|
+
function useMenuLogic({ selectedItems = [], onItemSelect, onOpenChange, }) {
|
|
1889
|
+
const isControlledRef = useRef(selectedItems !== undefined);
|
|
1890
|
+
const prevSelectedItemsRef = useRef(selectedItems);
|
|
1891
|
+
const [open, setOpenState] = useState(false);
|
|
1892
|
+
const [internalSelectedItems, setInternalSelectedItems] = useState(selectedItems || []);
|
|
1893
|
+
const getItemKey = useCallback((item) => {
|
|
1894
|
+
return item.value ?? item.id ?? item.text ?? '';
|
|
1895
|
+
}, []);
|
|
1896
|
+
useEffect(() => {
|
|
1897
|
+
if (!isControlledRef.current || !selectedItems)
|
|
1898
|
+
return;
|
|
1899
|
+
const prevKeys = prevSelectedItemsRef.current.map(getItemKey).sort().join(',');
|
|
1900
|
+
const currentKeys = selectedItems.map(getItemKey).sort().join(',');
|
|
1901
|
+
if (prevKeys !== currentKeys) {
|
|
1902
|
+
setInternalSelectedItems(selectedItems);
|
|
1903
|
+
prevSelectedItemsRef.current = selectedItems;
|
|
1904
|
+
}
|
|
1905
|
+
}, [selectedItems, getItemKey]);
|
|
1906
|
+
const setOpen = useCallback((newOpen) => {
|
|
1907
|
+
setOpenState(newOpen);
|
|
1908
|
+
onOpenChange?.(newOpen);
|
|
1909
|
+
}, [onOpenChange]);
|
|
1910
|
+
const isItemSelected = useCallback((item) => {
|
|
1911
|
+
const itemKey = getItemKey(item);
|
|
1912
|
+
if (!itemKey)
|
|
1913
|
+
return false;
|
|
1914
|
+
return internalSelectedItems.some((selected) => getItemKey(selected) === itemKey);
|
|
1915
|
+
}, [internalSelectedItems, getItemKey]);
|
|
1916
|
+
const handleItemSelect = useCallback((item) => {
|
|
1917
|
+
const newSelection = [item];
|
|
1918
|
+
setInternalSelectedItems(newSelection);
|
|
1919
|
+
if (onItemSelect) {
|
|
1920
|
+
onItemSelect(item);
|
|
1921
|
+
}
|
|
1922
|
+
setOpen(false);
|
|
1923
|
+
}, [onItemSelect, setOpen]);
|
|
1924
|
+
return {
|
|
1925
|
+
open,
|
|
1926
|
+
internalSelectedItems,
|
|
1927
|
+
setOpen,
|
|
1928
|
+
handleItemSelect,
|
|
1929
|
+
isItemSelected,
|
|
1930
|
+
};
|
|
1931
|
+
}
|
|
1932
|
+
|
|
1911
1933
|
const normalizeText = (text) => {
|
|
1912
1934
|
if (typeof text === 'string')
|
|
1913
1935
|
return text.toLowerCase();
|
|
@@ -1980,60 +2002,7 @@ const useSearchLogic = ({ items, searchValue, searchTerm, enableApiSearch, onApi
|
|
|
1980
2002
|
return { filteredItems: filteredItems() };
|
|
1981
2003
|
};
|
|
1982
2004
|
|
|
1983
|
-
|
|
1984
|
-
const isControlledRef = useRef(selectedItems !== undefined);
|
|
1985
|
-
const prevSelectedItemsRef = useRef(selectedItems);
|
|
1986
|
-
const [open, setOpenState] = useState(false);
|
|
1987
|
-
const [internalSelectedItems, setInternalSelectedItems] = useState(selectedItems || []);
|
|
1988
|
-
const getItemKey = useCallback((item) => {
|
|
1989
|
-
return item.value ?? item.id ?? item.text ?? '';
|
|
1990
|
-
}, []);
|
|
1991
|
-
useEffect(() => {
|
|
1992
|
-
if (!isControlledRef.current || !selectedItems)
|
|
1993
|
-
return;
|
|
1994
|
-
const prevKeys = prevSelectedItemsRef.current.map(getItemKey).sort().join(',');
|
|
1995
|
-
const currentKeys = selectedItems.map(getItemKey).sort().join(',');
|
|
1996
|
-
if (prevKeys !== currentKeys) {
|
|
1997
|
-
setInternalSelectedItems(selectedItems);
|
|
1998
|
-
prevSelectedItemsRef.current = selectedItems;
|
|
1999
|
-
}
|
|
2000
|
-
}, [selectedItems, getItemKey]);
|
|
2001
|
-
const setOpen = useCallback((newOpen) => {
|
|
2002
|
-
setOpenState(newOpen);
|
|
2003
|
-
onOpenChange?.(newOpen);
|
|
2004
|
-
}, [onOpenChange]);
|
|
2005
|
-
const isItemSelected = useCallback((item) => {
|
|
2006
|
-
const itemKey = getItemKey(item);
|
|
2007
|
-
if (!itemKey)
|
|
2008
|
-
return false;
|
|
2009
|
-
return internalSelectedItems.some((selected) => getItemKey(selected) === itemKey);
|
|
2010
|
-
}, [internalSelectedItems, getItemKey]);
|
|
2011
|
-
const handleItemSelect = useCallback((item) => {
|
|
2012
|
-
const newSelection = [item];
|
|
2013
|
-
setInternalSelectedItems(newSelection);
|
|
2014
|
-
if (onItemSelect) {
|
|
2015
|
-
onItemSelect(item);
|
|
2016
|
-
}
|
|
2017
|
-
setOpen(false);
|
|
2018
|
-
}, [onItemSelect, setOpen]);
|
|
2019
|
-
return {
|
|
2020
|
-
open,
|
|
2021
|
-
internalSelectedItems,
|
|
2022
|
-
setOpen,
|
|
2023
|
-
handleItemSelect,
|
|
2024
|
-
isItemSelected,
|
|
2025
|
-
};
|
|
2026
|
-
}
|
|
2027
|
-
|
|
2028
|
-
const MenuItem = memo(({ item, isSelected, onSelect }) => {
|
|
2029
|
-
const handleSelect = () => {
|
|
2030
|
-
onSelect(item);
|
|
2031
|
-
};
|
|
2032
|
-
return (jsxs(DropdownMenu.Item, { className: clsx(styles$6.item, { [styles$6.itemSelected]: isSelected }), onSelect: handleSelect, disabled: item.disabled, children: [item.icon && jsx("span", { className: styles$6.itemIcon, children: item.icon }), jsxs("div", { className: styles$6.wrapperText, children: [jsx("span", { className: styles$6.itemText, children: item.text }), item.subText && (jsx("span", { className: styles$6.itemSubText, children: item.subText }))] })] }));
|
|
2033
|
-
});
|
|
2034
|
-
MenuItem.displayName = 'MenuItem';
|
|
2035
|
-
|
|
2036
|
-
const Menu = ({ items, children, onItemSelect, search, enableInfiniteScroll, onScrollEnd, isLoadingMore, onApiSearch, enableApiSearch, selectedItems = [], onOpenChange, align = 'start', className, maxHeight = 400, ...rest }) => {
|
|
2005
|
+
const Menu = ({ items, children, onItemSelect, search, enableInfiniteScroll, onScrollEnd, isLoadingMore, onApiSearch, enableApiSearch, selectedItems, onOpenChange, align = 'start', className, maxHeight = 400, ...rest }) => {
|
|
2037
2006
|
const itemsWrapperRef = useRef(null);
|
|
2038
2007
|
const hasReachedEndRef = useRef(false);
|
|
2039
2008
|
const observerRef = useRef(null);
|
|
@@ -2153,14 +2122,8 @@ const Menu = ({ items, children, onItemSelect, search, enableInfiniteScroll, onS
|
|
|
2153
2122
|
|
|
2154
2123
|
var styles$5 = {"zds-quantity":"Quantity-module__zds-quantity___AymLj","zds-quantity__input":"Quantity-module__zds-quantity__input___Wlhmo"};
|
|
2155
2124
|
|
|
2156
|
-
|
|
2157
|
-
* Componente Quantity - permite incrementar/decrementar valores numéricos
|
|
2158
|
-
* Suporta modo controlado e não controlado, valores decimais e inteiros
|
|
2159
|
-
*/
|
|
2160
|
-
const Quantity = ({ defaultValue = 0, value: controlledValue, onChange, disabled = false, decimal = false, decimalPlaces = 2, size = 'lg', id, step, className }) => {
|
|
2161
|
-
// Determina se o componente é controlado externamente
|
|
2125
|
+
const Quantity = ({ defaultValue = 0, value: controlledValue, onChange, disabled = false, decimal = false, decimalPlaces = 2, size = 'lg', id, step, className, ...rest }) => {
|
|
2162
2126
|
const isControlled = controlledValue !== undefined;
|
|
2163
|
-
// Estados internos para valor e input
|
|
2164
2127
|
const [value, setValue] = useState(isControlled ? controlledValue : defaultValue);
|
|
2165
2128
|
const [inputValue, setInputValue] = useState(decimal
|
|
2166
2129
|
? (isControlled ? controlledValue : defaultValue).toFixed(decimalPlaces)
|
|
@@ -2230,11 +2193,8 @@ const Quantity = ({ defaultValue = 0, value: controlledValue, onChange, disabled
|
|
|
2230
2193
|
if (disabled)
|
|
2231
2194
|
return;
|
|
2232
2195
|
const rawValue = event.target.value;
|
|
2233
|
-
// ✅ APLICAR: Filtro em tempo real
|
|
2234
2196
|
const filteredValue = filterInput(rawValue);
|
|
2235
|
-
// ✅ SEMPRE: Atualizar input com valor filtrado
|
|
2236
2197
|
setInputValue(filteredValue);
|
|
2237
|
-
// ✅ PROCESSAR: Apenas valores válidos
|
|
2238
2198
|
if (filteredValue === '' || filteredValue === '.') {
|
|
2239
2199
|
if (!isControlled) {
|
|
2240
2200
|
setValue(0);
|
|
@@ -2243,9 +2203,8 @@ const Quantity = ({ defaultValue = 0, value: controlledValue, onChange, disabled
|
|
|
2243
2203
|
return;
|
|
2244
2204
|
}
|
|
2245
2205
|
if (decimal) {
|
|
2246
|
-
// Estados intermediários permitidos
|
|
2247
2206
|
if (filteredValue.endsWith('.')) {
|
|
2248
|
-
return;
|
|
2207
|
+
return;
|
|
2249
2208
|
}
|
|
2250
2209
|
const parsedValue = parseFloat(filteredValue);
|
|
2251
2210
|
if (!isNaN(parsedValue)) {
|
|
@@ -2370,9 +2329,9 @@ const Quantity = ({ defaultValue = 0, value: controlledValue, onChange, disabled
|
|
|
2370
2329
|
}, [disabled, increment, decrement, decimal, decimalPlaces, isControlled, onChange, computedValue]);
|
|
2371
2330
|
const uniqueId = useId();
|
|
2372
2331
|
const inputId = id || uniqueId;
|
|
2373
|
-
return (jsxs("div", { className: clsx(styles$5['zds-quantity'], { disabled }, className), children: [jsx(Button, { variant: 'outlined', size: size, type: 'button', iconOnly: true, icon: jsx(Subtract16Regular, {}), onClick: decrement, disabled: disabled || isMinValue, "aria-label": 'Diminuir quantidade' }), jsx("input", { ref: inputRef, className: clsx(styles$5['zds-quantity__input'], { disabled }), type: 'text', value: inputValue, onChange: handleInputChange, onBlur: handleBlur, onKeyDown: handleInputKeyDown, id: inputId, min: '0', step: stepValue, "aria-label": 'Quantidade', role: 'spinbutton', "aria-valuenow": computedValue, "aria-valuemin": 0, "aria-valuemax": decimal ? undefined : 9999, disabled: disabled, inputMode: decimal ? 'decimal' : 'numeric' }), jsx(Button, { variant: 'outlined', size: size, type: 'button', iconOnly: true, onClick: increment, disabled: disabled, "aria-label": 'Aumentar quantidade', icon: jsx(Add16Regular, {}) })] }));
|
|
2332
|
+
return (jsxs("div", { className: clsx(styles$5['zds-quantity'], { disabled }, className), ...rest, children: [jsx(Button, { variant: 'outlined', size: size, type: 'button', iconOnly: true, icon: jsx(Subtract16Regular, {}), onClick: decrement, disabled: disabled || isMinValue, "aria-label": 'Diminuir quantidade' }), jsx("input", { ref: inputRef, className: clsx(styles$5['zds-quantity__input'], { disabled }), type: 'text', value: inputValue, onChange: handleInputChange, onBlur: handleBlur, onKeyDown: handleInputKeyDown, id: inputId, min: '0', step: stepValue, "aria-label": 'Quantidade', role: 'spinbutton', "aria-valuenow": computedValue, "aria-valuemin": 0, "aria-valuemax": decimal ? undefined : 9999, disabled: disabled, inputMode: decimal ? 'decimal' : 'numeric' }), jsx(Button, { variant: 'outlined', size: size, type: 'button', iconOnly: true, onClick: increment, disabled: disabled, "aria-label": 'Aumentar quantidade', icon: jsx(Add16Regular, {}) })] }));
|
|
2374
2333
|
};
|
|
2375
|
-
const memorizedQuantity =
|
|
2334
|
+
const memorizedQuantity = React__default.memo(Quantity);
|
|
2376
2335
|
memorizedQuantity.displayName = 'Quantity';
|
|
2377
2336
|
|
|
2378
2337
|
var styles$4 = {"fieldContainer":"index-module__fieldContainer___gp5Hz","trigger":"index-module__trigger___rHQJz","disabled":"index-module__disabled___MIJba","open":"index-module__open___bVB-1","error":"index-module__error___nPFjW","hasValue":"index-module__hasValue___a4Sy4","triggerText":"index-module__triggerText___tyjAQ","containerLabel":"index-module__containerLabel___CExNh","content":"index-module__content___9nWeY","viewport":"index-module__viewport___nkVG9","group":"index-module__group___-PiX6","container":"index-module__container___Wg-pd","searchWrapper":"index-module__searchWrapper___umf9d","item":"index-module__item___R-Xle","subTitle":"index-module__subTitle___sXaqd","title":"index-module__title___x1Bia","checkboxItem":"index-module__checkboxItem___FTUbN","checkboxContent":"index-module__checkboxContent___skcd5","itemWrapper":"index-module__itemWrapper___PAglx","selected":"index-module__selected___VFFMN","icon":"index-module__icon___l2Zze","itemIndicator":"index-module__itemIndicator___FhOim","textContent":"index-module__textContent___cBJbp","helper":"index-module__helper___w4VC7","errorMessage":"index-module__errorMessage___gquqW","noResults":"index-module__noResults___qgzod","loadingMore":"index-module__loadingMore___GHc31","expandableItemContainer":"index-module__expandableItemContainer___NexPi","chevron":"index-module__chevron___c6mu-","childrenWrapper":"index-module__childrenWrapper___tj2R-"};
|
|
@@ -2450,7 +2409,7 @@ const ExpandableSelectItem = ({ item, variant, onSelect, selectedValues, level =
|
|
|
2450
2409
|
}, role: "button", tabIndex: item.disabled ? -1 : 0, "data-disabled": item.disabled || undefined, "data-selected": isSelected && !hasChildren ? 'true' : undefined, "data-testid": `select-item-${item.value}`, children: [variant === 'icon' && item.icon && (jsx("span", { className: styles$4.icon, children: item.icon })), jsxs("div", { className: styles$4.textContent, children: [jsx("div", { className: styles$4.title, children: item.text }), item.subTitle && jsx("div", { className: styles$4.subTitle, children: item.subTitle })] }), hasChildren && (jsx("span", { className: styles$4.chevron, children: isExpanded ? jsx(ChevronDown16Regular, {}) : jsx(ChevronRight16Regular, {}) }))] }) }), hasChildren && isExpanded && (jsx("div", { className: styles$4.childrenWrapper, children: item.children.map((child) => (jsx(ExpandableSelectItem, { item: child, variant: variant, onSelect: onSelect, selectedValues: selectedValues, level: level + 1 }, child.id || child.value))) }))] }));
|
|
2451
2410
|
};
|
|
2452
2411
|
|
|
2453
|
-
const SelectItem =
|
|
2412
|
+
const SelectItem = React__default.forwardRef(({ text, subTitle, icon, disabled, value, variant, ...restProps }, ref) => {
|
|
2454
2413
|
return (jsxs("div", { className: clsx(styles$4.itemWrapper, {
|
|
2455
2414
|
[styles$4.disabled]: disabled,
|
|
2456
2415
|
}), "data-disabled": disabled || undefined, "data-testid": `select-item-${value}`, ref: ref, children: [variant === 'icon' && icon && (jsx("span", { className: styles$4.icon, children: icon })), jsxs(Select$1.Item, { className: clsx(styles$4.item, {
|
|
@@ -2789,8 +2748,6 @@ const Select = ({ items, onValueChange, onOpenChange, variant, required = false,
|
|
|
2789
2748
|
};
|
|
2790
2749
|
Select.displayName = 'Select';
|
|
2791
2750
|
|
|
2792
|
-
var styles$3 = {"zds-table__container":"Table-module__zds-table__container___9xeVY","zds-table-header":"Table-module__zds-table-header___uPRjd","zds-table__scroll-wrapper":"Table-module__zds-table__scroll-wrapper___xQZPq","zds-table":"Table-module__zds-table___bPvaS","zds-table__head":"Table-module__zds-table__head___FvQuS","zds-table__th":"Table-module__zds-table__th___R03sj","zds-table__th-content":"Table-module__zds-table__th-content___duR3c","zds-table__td":"Table-module__zds-table__td___aY-Nt","zds-table-header__filters-placeholder":"Table-module__zds-table-header__filters-placeholder___GhVwi","zds-table__body":"Table-module__zds-table__body___kuKXb","zds-table__empty":"Table-module__zds-table__empty___ZM4iu","zds-table__empty__content":"Table-module__zds-table__empty__content___8xl-u","zds-table__empty__title":"Table-module__zds-table__empty__title___7Y9Pj","zds-table__empty__caption":"Table-module__zds-table__empty__caption___toS00","zds-table__row":"Table-module__zds-table__row___8cEjq","zds-table__empty-cell":"Table-module__zds-table__empty-cell___Ldb6Z","zds-table-header__search":"Table-module__zds-table-header__search___yzLxw","zds-table__pagination":"Table-module__zds-table__pagination___FR5GH","zds-table-header__search-container":"Table-module__zds-table-header__search-container___-Fzz1","zds-table-header__filters":"Table-module__zds-table-header__filters___ViH07","zds-table-header__filter-label":"Table-module__zds-table-header__filter-label___c3BWI","zds-table-header__custom-filters":"Table-module__zds-table-header__custom-filters___oTuoM","zds-table-header__filters-content":"Table-module__zds-table-header__filters-content___nKlgL","zds-table-header__filters-wrapper":"Table-module__zds-table-header__filters-wrapper___BrZ9A","zds-table-header__filter-items":"Table-module__zds-table-header__filter-items___Tn8Yv","zds-table__pagination-select":"Table-module__zds-table__pagination-select___TZK-y","zds-table__pagination-info":"Table-module__zds-table__pagination-info___3k-B2","zds-table__pagination-controls":"Table-module__zds-table__pagination-controls___S-zs7","zds-table__pagination-button":"Table-module__zds-table__pagination-button___Wvq9W"};
|
|
2793
|
-
|
|
2794
2751
|
/**
|
|
2795
2752
|
* @module constants
|
|
2796
2753
|
* @summary Useful constants
|
|
@@ -6064,6 +6021,15 @@ const ptBR = {
|
|
|
6064
6021
|
},
|
|
6065
6022
|
};
|
|
6066
6023
|
|
|
6024
|
+
var styles$3 = {"zds-table__container":"Table-module__zds-table__container___9xeVY","zds-table-header":"Table-module__zds-table-header___uPRjd","zds-table__scroll-wrapper":"Table-module__zds-table__scroll-wrapper___xQZPq","zds-table":"Table-module__zds-table___bPvaS","zds-table__head":"Table-module__zds-table__head___FvQuS","zds-table__th":"Table-module__zds-table__th___R03sj","zds-table__th-content":"Table-module__zds-table__th-content___duR3c","zds-table__td":"Table-module__zds-table__td___aY-Nt","zds-table-header__filters-placeholder":"Table-module__zds-table-header__filters-placeholder___GhVwi","zds-table__body":"Table-module__zds-table__body___kuKXb","zds-table__empty":"Table-module__zds-table__empty___ZM4iu","zds-table__empty__content":"Table-module__zds-table__empty__content___8xl-u","zds-table__empty__title":"Table-module__zds-table__empty__title___7Y9Pj","zds-table__empty__caption":"Table-module__zds-table__empty__caption___toS00","zds-table__row":"Table-module__zds-table__row___8cEjq","zds-table__empty-cell":"Table-module__zds-table__empty-cell___Ldb6Z","zds-table-header__search":"Table-module__zds-table-header__search___yzLxw","zds-table__pagination":"Table-module__zds-table__pagination___FR5GH","zds-table-header__search-container":"Table-module__zds-table-header__search-container___-Fzz1","zds-table-header__filters":"Table-module__zds-table-header__filters___ViH07","zds-table-header__filter-label":"Table-module__zds-table-header__filter-label___c3BWI","zds-table-header__custom-filters":"Table-module__zds-table-header__custom-filters___oTuoM","zds-table-header__filters-content":"Table-module__zds-table-header__filters-content___nKlgL","zds-table-header__filters-wrapper":"Table-module__zds-table-header__filters-wrapper___BrZ9A","zds-table-header__filter-items":"Table-module__zds-table-header__filter-items___Tn8Yv","zds-table__pagination-select":"Table-module__zds-table__pagination-select___TZK-y","zds-table__pagination-info":"Table-module__zds-table__pagination-info___3k-B2","zds-table__pagination-controls":"Table-module__zds-table__pagination-controls___S-zs7","zds-table__pagination-button":"Table-module__zds-table__pagination-button___Wvq9W"};
|
|
6025
|
+
|
|
6026
|
+
/**
|
|
6027
|
+
* Componente de ícone SVG para estado vazio da tabela
|
|
6028
|
+
* Exibe um ícone de lupa com design personalizado do Zanthus Design System
|
|
6029
|
+
* @returns Elemento SVG para estado vazio
|
|
6030
|
+
*/
|
|
6031
|
+
const EmptyRows150Color = () => (jsxs("svg", { width: '150', height: '150', viewBox: '0 0 150 150', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', children: [jsx("circle", { cx: '75', cy: '75', r: '75', fill: '#E8E8EE' }), jsx("path", { d: 'M67.6111 63.3889C69.36 63.3889 70.7778 64.8067 70.7778 66.5556V81.3333C70.7778 83.0822 69.36 84.5 67.6111 84.5C65.8622 84.5 64.4444 83.0822 64.4444 81.3333V66.5556C64.4444 64.8067 65.8622 63.3889 67.6111 63.3889ZM67.6111 59.1667C69.943 59.1667 71.8333 57.2763 71.8333 54.9444C71.8333 52.6126 69.943 50.7222 67.6111 50.7222C65.2792 50.7222 63.3889 52.6126 63.3889 54.9444C63.3889 57.2763 65.2792 59.1667 67.6111 59.1667ZM67.6111 37C84.5172 37 98.2222 50.7051 98.2222 67.6111C98.2222 74.9235 95.6583 81.637 91.3803 86.9017L112.073 107.594C113.309 108.831 113.309 110.836 112.073 112.073C110.948 113.197 109.189 113.299 107.949 112.379L107.594 112.073L86.9017 91.3803C81.637 95.6583 74.9235 98.2222 67.6111 98.2222C50.7051 98.2222 37 84.5172 37 67.6111C37 50.7051 50.7051 37 67.6111 37ZM67.6111 43.3333C54.2029 43.3333 43.3333 54.2029 43.3333 67.6111C43.3333 81.0194 54.2029 91.8889 67.6111 91.8889C81.0194 91.8889 91.8889 81.0194 91.8889 67.6111C91.8889 54.2029 81.0194 43.3333 67.6111 43.3333Z', fill: '#3B45F2' })] }));
|
|
6032
|
+
|
|
6067
6033
|
/*! *****************************************************************************
|
|
6068
6034
|
Copyright (c) Microsoft Corporation. All rights reserved.
|
|
6069
6035
|
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
|
|
@@ -6151,13 +6117,6 @@ var ReactContentLoaderFacebook = function (props) { return (createElement(Conten
|
|
|
6151
6117
|
*/
|
|
6152
6118
|
const LoaderList = (props) => (jsxs(ContentLoader, { speed: 1, width: "100%", viewBox: "0 0 1272 652", backgroundColor: "#F5F5F7", foregroundColor: "#FFFFFF", ...props, children: [jsx("rect", { x: "0", y: "0", rx: "8", ry: "8", width: "1272", height: "44" }), jsx("rect", { x: "0", y: "76", rx: "12", ry: "12", width: "402", height: "24" }), jsx("rect", { x: "0", y: "116", rx: "8", ry: "8", width: "280", height: "16" }), jsx("rect", { x: "426", y: "76", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "426", y: "116", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "694", y: "76", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "694", y: "116", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "962", y: "76", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "962", y: "116", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "1129", y: "76", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "1129", y: "116", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "0", y: "164", rx: "12", ry: "12", width: "402", height: "24" }), jsx("rect", { x: "0", y: "204", rx: "8", ry: "8", width: "280", height: "16" }), jsx("rect", { x: "426", y: "164", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "426", y: "204", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "694", y: "164", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "694", y: "204", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "962", y: "164", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "962", y: "204", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "1129", y: "164", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "1129", y: "204", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "0", y: "252", rx: "12", ry: "12", width: "402", height: "24" }), jsx("rect", { x: "0", y: "292", rx: "8", ry: "8", width: "280", height: "16" }), jsx("rect", { x: "426", y: "252", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "426", y: "292", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "694", y: "252", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "694", y: "292", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "962", y: "252", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "962", y: "292", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "1129", y: "252", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "1129", y: "292", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "0", y: "340", rx: "12", ry: "12", width: "402", height: "24" }), jsx("rect", { x: "0", y: "380", rx: "8", ry: "8", width: "280", height: "16" }), jsx("rect", { x: "426", y: "340", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "426", y: "380", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "694", y: "340", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "694", y: "380", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "962", y: "340", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "962", y: "380", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "1129", y: "340", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "1129", y: "380", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "0", y: "428", rx: "12", ry: "12", width: "402", height: "24" }), jsx("rect", { x: "0", y: "468", rx: "8", ry: "8", width: "280", height: "16" }), jsx("rect", { x: "426", y: "428", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "426", y: "468", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "694", y: "428", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "694", y: "468", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "962", y: "428", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "962", y: "468", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "1129", y: "428", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "1129", y: "468", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "0", y: "516", rx: "12", ry: "12", width: "402", height: "24" }), jsx("rect", { x: "0", y: "556", rx: "8", ry: "8", width: "280", height: "16" }), jsx("rect", { x: "426", y: "516", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "426", y: "556", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "694", y: "516", rx: "12", ry: "12", width: "244", height: "24" }), jsx("rect", { x: "694", y: "556", rx: "8", ry: "8", width: "178", height: "16" }), jsx("rect", { x: "962", y: "516", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "962", y: "556", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "1129", y: "516", rx: "12", ry: "12", width: "143", height: "24" }), jsx("rect", { x: "1129", y: "556", rx: "8", ry: "8", width: "90", height: "16" }), jsx("rect", { x: "0", y: "604", rx: "8", ry: "8", width: "1272", height: "48" })] }));
|
|
6153
6119
|
|
|
6154
|
-
/**
|
|
6155
|
-
* Componente de ícone SVG para estado vazio da tabela
|
|
6156
|
-
* Exibe um ícone de lupa com design personalizado do Zanthus Design System
|
|
6157
|
-
* @returns Elemento SVG para estado vazio
|
|
6158
|
-
*/
|
|
6159
|
-
const EmptyRows150Color = () => (jsxs("svg", { width: '150', height: '150', viewBox: '0 0 150 150', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', children: [jsx("circle", { cx: '75', cy: '75', r: '75', fill: '#E8E8EE' }), jsx("path", { d: 'M67.6111 63.3889C69.36 63.3889 70.7778 64.8067 70.7778 66.5556V81.3333C70.7778 83.0822 69.36 84.5 67.6111 84.5C65.8622 84.5 64.4444 83.0822 64.4444 81.3333V66.5556C64.4444 64.8067 65.8622 63.3889 67.6111 63.3889ZM67.6111 59.1667C69.943 59.1667 71.8333 57.2763 71.8333 54.9444C71.8333 52.6126 69.943 50.7222 67.6111 50.7222C65.2792 50.7222 63.3889 52.6126 63.3889 54.9444C63.3889 57.2763 65.2792 59.1667 67.6111 59.1667ZM67.6111 37C84.5172 37 98.2222 50.7051 98.2222 67.6111C98.2222 74.9235 95.6583 81.637 91.3803 86.9017L112.073 107.594C113.309 108.831 113.309 110.836 112.073 112.073C110.948 113.197 109.189 113.299 107.949 112.379L107.594 112.073L86.9017 91.3803C81.637 95.6583 74.9235 98.2222 67.6111 98.2222C50.7051 98.2222 37 84.5172 37 67.6111C37 50.7051 50.7051 37 67.6111 37ZM67.6111 43.3333C54.2029 43.3333 43.3333 54.2029 43.3333 67.6111C43.3333 81.0194 54.2029 91.8889 67.6111 91.8889C81.0194 91.8889 91.8889 81.0194 91.8889 67.6111C91.8889 54.2029 81.0194 43.3333 67.6111 43.3333Z', fill: '#3B45F2' })] }));
|
|
6160
|
-
|
|
6161
6120
|
const useSelection = (dataSource, rowSelection) => {
|
|
6162
6121
|
const [internalKeys, setInternalKeys] = useState([]);
|
|
6163
6122
|
const selectedKeys = rowSelection?.selectedRowKeys ?? internalKeys;
|
|
@@ -6165,11 +6124,9 @@ const useSelection = (dataSource, rowSelection) => {
|
|
|
6165
6124
|
const handleChange = useCallback((newKeys) => {
|
|
6166
6125
|
const newRows = dataSource.filter((_, index) => newKeys.includes(index));
|
|
6167
6126
|
if (rowSelection?.selectedRowKeys !== undefined) {
|
|
6168
|
-
// Controlled
|
|
6169
6127
|
rowSelection.onChange?.(newKeys, newRows);
|
|
6170
6128
|
}
|
|
6171
6129
|
else {
|
|
6172
|
-
// Uncontrolled
|
|
6173
6130
|
setInternalKeys(newKeys);
|
|
6174
6131
|
rowSelection?.onChange?.(newKeys, newRows);
|
|
6175
6132
|
}
|
|
@@ -6216,7 +6173,7 @@ const renderCell = (column, row, index) => {
|
|
|
6216
6173
|
return value;
|
|
6217
6174
|
}
|
|
6218
6175
|
};
|
|
6219
|
-
const Table = ({ columns
|
|
6176
|
+
const Table = ({ columns, dataSource, className, loading = false, rowSelection, locale, onRow, ...rest }) => {
|
|
6220
6177
|
if (!Array.isArray(columns) || !Array.isArray(dataSource)) {
|
|
6221
6178
|
console.warn('Table: columns e dataSource devem ser arrays');
|
|
6222
6179
|
return null;
|
|
@@ -6240,8 +6197,8 @@ const Table = ({ columns = [], dataSource = [], className, loading = false, rowS
|
|
|
6240
6197
|
if (loading) {
|
|
6241
6198
|
return (jsx("div", { className: clsx(styles$3['zds-table__container'], className), children: jsx("div", { className: styles$3['zds-table__loader'], children: jsx(LoaderList, {}) }) }));
|
|
6242
6199
|
}
|
|
6243
|
-
const emptyText = locale
|
|
6244
|
-
return (jsx("div", { className: clsx(styles$3['zds-table__container'], className), children: jsx("div", { className: styles$3['zds-table__scroll-wrapper'], children: jsxs("table", { className: styles$3['zds-table'], role: "table", "aria-label": "Tabela de dados", "aria-describedby": loading ? `${tableId}-loading` : undefined, "aria-rowcount": dataSource.length + 1, children: [jsx("thead", { className: styles$3['zds-table__head'], children: jsx("tr", { children: finalColumns.map((column) => (jsx("th", { className: clsx(styles$3['zds-table__th'], column.align && `text-${column.align}`), style: column.style, children: jsx("div", { className: styles$3['zds-table__th-content'], children: column.label }) }, column.key))) }) }), jsx("tbody", { className: styles$3['zds-table__body'], children: dataSource.length > 0 ? (dataSource.map((row, index) => {
|
|
6200
|
+
const emptyText = locale?.emptyText || (jsxs("div", { className: styles$3['zds-table__empty'], children: [jsx("div", { className: styles$3['zds-table__empty__content'], children: jsx(EmptyRows150Color, {}) }), jsxs("div", { className: styles$3['zds-table__empty__text'], children: [jsx("h3", { className: styles$3['zds-table__empty__title'], children: "Nenhum dado encontrado" }), jsx("p", { className: styles$3['zds-table__empty__caption'], children: "Nenhum registro encontrado" })] })] }));
|
|
6201
|
+
return (jsx("div", { className: clsx(styles$3['zds-table__container'], className), ...rest, children: jsx("div", { className: styles$3['zds-table__scroll-wrapper'], children: jsxs("table", { className: styles$3['zds-table'], role: "table", "aria-label": "Tabela de dados", "aria-describedby": loading ? `${tableId}-loading` : undefined, "aria-rowcount": dataSource.length + 1, children: [jsx("thead", { className: styles$3['zds-table__head'], children: jsx("tr", { children: finalColumns.map((column) => (jsx("th", { className: clsx(styles$3['zds-table__th'], column.align && `text-${column.align}`), style: column.style, children: jsx("div", { className: styles$3['zds-table__th-content'], children: column.label }) }, column.key))) }) }), jsx("tbody", { className: styles$3['zds-table__body'], children: dataSource.length > 0 ? (dataSource.map((row, index) => {
|
|
6245
6202
|
const rowProps = onRow?.(row, index) || {};
|
|
6246
6203
|
return (jsx("tr", { className: clsx(styles$3['zds-table__row'], rowProps.className), onClick: rowProps.onClick, onDoubleClick: rowProps.onDoubleClick, children: finalColumns.map((column) => (jsx("td", { className: clsx(styles$3['zds-table__td'], column.align && `text-${column.align}`), children: renderCell(column, row, index) }, column.key))) }, index));
|
|
6247
6204
|
})) : (jsx("tr", { children: jsx("td", { colSpan: finalColumns.length, className: styles$3['zds-table__empty-cell'], children: emptyText }) })) })] }) }) }));
|
|
@@ -6253,9 +6210,9 @@ const isCalendarFilter = (filter) => {
|
|
|
6253
6210
|
const isCheckboxFilter = (filter) => {
|
|
6254
6211
|
return filter.type === 'checkbox' || filter.type === 'text' || filter.type === 'icon';
|
|
6255
6212
|
};
|
|
6256
|
-
const TableHeader = ({ searchValue = '', onSearchChange, onSearch, searchPlaceholder = 'Pesquisar...', showSearch = true, showFilters = false, filters, filterItems = [], className = '', }) => {
|
|
6213
|
+
const TableHeader = ({ searchValue = '', onSearchChange, onSearch, searchPlaceholder = 'Pesquisar...', showSearch = true, showFilters = false, filters, filterItems = [], className = '', ...rest }) => {
|
|
6257
6214
|
const [internalSearchValue, setInternalSearchValue] = useState(searchValue);
|
|
6258
|
-
|
|
6215
|
+
React__default.useEffect(() => {
|
|
6259
6216
|
setInternalSearchValue(searchValue);
|
|
6260
6217
|
}, [searchValue]);
|
|
6261
6218
|
const handleInputChange = (e) => {
|
|
@@ -6277,7 +6234,7 @@ const TableHeader = ({ searchValue = '', onSearchChange, onSearch, searchPlaceho
|
|
|
6277
6234
|
}
|
|
6278
6235
|
};
|
|
6279
6236
|
const hasFilters = filters || (filterItems && filterItems.length > 0);
|
|
6280
|
-
return (jsxs("div", { className: `${styles$3['zds-table-header']} ${className}`.trim(), children: [showSearch && (onSearchChange || onSearch) && (jsx("div", { className: styles$3['zds-table-header__search-container'], children: jsx(Search, { value: internalSearchValue, onChange: handleInputChange, onKeyDown: handleKeyDown, placeholder: searchPlaceholder, className: styles$3['zds-table-header__search'] }) })), showFilters && (jsx("div", { className: styles$3['zds-table-header__filters'], children: hasFilters ? (jsxs("div", { className: styles$3['zds-table-header__filters-content'], children: [filters && (jsx("div", { className: styles$3['zds-table-header__custom-filters'], children: filters })), jsxs("div", { className: styles$3['zds-table-header__filters-wrapper'], children: [jsx("span", { className: styles$3['zds-table-header__filter-label'], children: "Filtros" }), jsx("div", { className: styles$3['zds-table-header__filter-items'], children: filterItems && filterItems.map((filterItem, index) => {
|
|
6237
|
+
return (jsxs("div", { className: `${styles$3['zds-table-header']} ${className}`.trim(), ...rest, children: [showSearch && (onSearchChange || onSearch) && (jsx("div", { className: styles$3['zds-table-header__search-container'], children: jsx(Search, { value: internalSearchValue, onChange: handleInputChange, onKeyDown: handleKeyDown, placeholder: searchPlaceholder, className: styles$3['zds-table-header__search'] }) })), showFilters && (jsx("div", { className: styles$3['zds-table-header__filters'], children: hasFilters ? (jsxs("div", { className: styles$3['zds-table-header__filters-content'], children: [filters && (jsx("div", { className: styles$3['zds-table-header__custom-filters'], children: filters })), jsxs("div", { className: styles$3['zds-table-header__filters-wrapper'], children: [jsx("span", { className: styles$3['zds-table-header__filter-label'], children: "Filtros" }), jsx("div", { className: styles$3['zds-table-header__filter-items'], children: filterItems && filterItems.map((filterItem, index) => {
|
|
6281
6238
|
const commonProps = {
|
|
6282
6239
|
key: filterItem.id || index,
|
|
6283
6240
|
buttonText: filterItem.buttonText,
|
|
@@ -6299,15 +6256,12 @@ const TableHeader = ({ searchValue = '', onSearchChange, onSearch, searchPlaceho
|
|
|
6299
6256
|
}) })] })] })) : (jsx("div", { className: styles$3['zds-table-header__filters-placeholder'], children: jsx("span", { children: "Nenhum filtro dispon\u00EDvel" }) })) }))] }));
|
|
6300
6257
|
};
|
|
6301
6258
|
|
|
6302
|
-
const TablePagination = ({ currentPage, totalItems, itemsPerPage, onPageChange, onItemsPerPageChange, pageSizeOptions = [10, 25, 50, 100], disabled = false, className
|
|
6303
|
-
// Cálculos
|
|
6259
|
+
const TablePagination = ({ currentPage, totalItems, itemsPerPage, onPageChange, onItemsPerPageChange, pageSizeOptions = [10, 25, 50, 100], disabled = false, className, ...rest }) => {
|
|
6304
6260
|
const totalPages = Math.ceil(totalItems / itemsPerPage);
|
|
6305
6261
|
const startItem = totalItems > 0 ? (currentPage - 1) * itemsPerPage + 1 : 0;
|
|
6306
6262
|
const endItem = Math.min(currentPage * itemsPerPage, totalItems);
|
|
6307
|
-
// Lógica para habilitar/desabilitar botões
|
|
6308
6263
|
const canGoPrev = currentPage > 1 && !disabled;
|
|
6309
6264
|
const canGoNext = currentPage < totalPages && !disabled;
|
|
6310
|
-
// Handlers
|
|
6311
6265
|
const handlePrevious = () => {
|
|
6312
6266
|
if (canGoPrev) {
|
|
6313
6267
|
onPageChange(currentPage - 1);
|
|
@@ -6322,7 +6276,7 @@ const TablePagination = ({ currentPage, totalItems, itemsPerPage, onPageChange,
|
|
|
6322
6276
|
const newItemsPerPage = Number(event.target.value);
|
|
6323
6277
|
onItemsPerPageChange(newItemsPerPage);
|
|
6324
6278
|
};
|
|
6325
|
-
return (jsxs("div", { className: `${styles$3['zds-table__pagination']} ${className}`.trim(), children: [jsxs("div", { className: styles$3['zds-table__pagination-select'], children: [jsx("label", { htmlFor: "items-per-page", className: styles$3['zds-table__pagination-label'], children: "Itens por p\u00E1gina" }), jsx("select", { id: "items-per-page", value: itemsPerPage, onChange: handleItemsPerPageChange, disabled: disabled, className: styles$3['zds-table__pagination-select-input'], children: pageSizeOptions.map((option) => (jsx("option", { value: option, children: option }, option))) })] }), jsx("div", { className: styles$3['zds-table__pagination-info'], children: jsx("span", { children: totalItems > 0
|
|
6279
|
+
return (jsxs("div", { className: `${styles$3['zds-table__pagination']} ${className}`.trim(), ...rest, children: [jsxs("div", { className: styles$3['zds-table__pagination-select'], children: [jsx("label", { htmlFor: "items-per-page", className: styles$3['zds-table__pagination-label'], children: "Itens por p\u00E1gina" }), jsx("select", { id: "items-per-page", value: itemsPerPage, onChange: handleItemsPerPageChange, disabled: disabled, className: styles$3['zds-table__pagination-select-input'], children: pageSizeOptions.map((option) => (jsx("option", { value: option, children: option }, option))) })] }), jsx("div", { className: styles$3['zds-table__pagination-info'], children: jsx("span", { children: totalItems > 0
|
|
6326
6280
|
? `${startItem}–${endItem} de ${totalItems}`
|
|
6327
6281
|
: '0 itens' }) }), jsxs("div", { className: styles$3['zds-table__pagination-controls'], children: [jsx("button", { className: styles$3['zds-table__pagination-button'], onClick: handlePrevious, disabled: !canGoPrev, "aria-label": "P\u00E1gina anterior", children: jsx(ChevronLeft16Regular, {}) }), jsx("button", { className: styles$3['zds-table__pagination-button'], onClick: handleNext, disabled: !canGoNext, "aria-label": "Pr\u00F3xima p\u00E1gina", children: jsx(ChevronRight16Regular, {}) })] })] }));
|
|
6328
6282
|
};
|
|
@@ -6462,7 +6416,7 @@ const useToast = () => {
|
|
|
6462
6416
|
|
|
6463
6417
|
var styles$1 = {"container":"Switch-module__container___BR1OB","switchRoot":"Switch-module__switchRoot___jz2HD","switchThumb":"Switch-module__switchThumb___X3RL7"};
|
|
6464
6418
|
|
|
6465
|
-
const Switch = ({ disabled = false, defaultChecked = false, checked, onCheckedChange,
|
|
6419
|
+
const Switch = ({ disabled = false, defaultChecked = false, checked, onCheckedChange, ...rest }) => (jsx("div", { className: clsx(styles$1.container), children: jsx(Switch$1.Root, { className: styles$1.switchRoot, disabled: disabled, defaultChecked: defaultChecked, checked: checked, onCheckedChange: onCheckedChange, ...rest, children: jsx(Switch$1.Thumb, { className: styles$1.switchThumb }) }) }));
|
|
6466
6420
|
|
|
6467
6421
|
var styles = {"zds-verification-code__container":"VerificationCode-module__zds-verification-code__container___tUNuJ","zds-verification-code__input":"VerificationCode-module__zds-verification-code__input___wDIQ6","zds-verification-code__filled":"VerificationCode-module__zds-verification-code__filled___-2VVb","zds-verification-code__has-error":"VerificationCode-module__zds-verification-code__has-error___eqKAp","zds-verification-code__error":"VerificationCode-module__zds-verification-code__error___T53i5"};
|
|
6468
6422
|
|
|
@@ -6490,7 +6444,7 @@ const REGEX_MAP = {
|
|
|
6490
6444
|
* />
|
|
6491
6445
|
* ```
|
|
6492
6446
|
*/
|
|
6493
|
-
const VerificationCode = ({ length = 6, inputType = 'numeric', onComplete, hasError = false, errorMessage
|
|
6447
|
+
const VerificationCode = ({ length = 6, inputType = 'numeric', onComplete, hasError = false, errorMessage, disabled = false, className, ...rest }) => {
|
|
6494
6448
|
const validLength = Math.min(Math.max(length, 1), 100);
|
|
6495
6449
|
const [values, setValues] = useState(Array(validLength).fill(''));
|
|
6496
6450
|
const inputsRef = useRef([]);
|
|
@@ -6575,7 +6529,7 @@ const VerificationCode = ({ length = 6, inputType = 'numeric', onComplete, hasEr
|
|
|
6575
6529
|
const handleFocus = useCallback((e) => {
|
|
6576
6530
|
e.target.select();
|
|
6577
6531
|
}, []);
|
|
6578
|
-
return (jsxs(Fragment, { children: [jsx("div", { className: clsx(styles['zds-verification-code__container'], className), children: values.map((val, i) => (jsx("input", { id: `zds-verification-code__element-${i}`, ref: (el) => {
|
|
6532
|
+
return (jsxs(Fragment, { children: [jsx("div", { className: clsx(styles['zds-verification-code__container'], className), ...rest, children: values.map((val, i) => (jsx("input", { id: `zds-verification-code__element-${i}`, ref: (el) => {
|
|
6579
6533
|
inputsRef.current[i] = el;
|
|
6580
6534
|
}, type: "text", inputMode: inputType === 'numeric' ? 'numeric' : 'text', maxLength: 1, value: val, onChange: (e) => handleChange(i, e.target.value), onKeyDown: (e) => handleKeyDown(i, e), onKeyUp: (e) => handleKeyUp(i, e), onPaste: i === 0 ? handlePaste : undefined, onFocus: handleFocus, disabled: disabled, className: clsx(styles['zds-verification-code__input'], {
|
|
6581
6535
|
[styles['zds-verification-code__has-error']]: hasError,
|