@giro-ds/react 8.0.0 → 9.0.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.esm.js CHANGED
@@ -3,11 +3,11 @@ import clsx from 'clsx';
3
3
  import { Avatar as Avatar$1, Tooltip as Tooltip$1, Checkbox as Checkbox$1, Popover as Popover$1, Label, AlertDialog, RadioGroup, DropdownMenu, Dialog as Dialog$1, Select as Select$1, Toast as Toast$1, Switch as Switch$1 } from 'radix-ui';
4
4
  import * as React from 'react';
5
5
  import React__default, { useId, useMemo, createContext, useState, useContext, forwardRef, useEffect, useCallback, useRef, memo, useReducer, createElement, isValidElement } from 'react';
6
- import { SpinnerIos16Regular, ChevronUp16Regular, ChevronLeft16Regular, ChevronRight16Regular, ChevronDown16Regular, Dismiss24Regular, Info12Regular, Dismiss16Regular, Calendar16Regular, Search16Regular, ChevronDownRegular, ChevronRight16Filled, Subtract16Regular, Add16Regular, SearchInfo20Regular, ArrowSortUp16Regular, ArrowSortDown16Regular, ArrowSort16Regular, Info20Filled, CheckmarkCircle20Filled, Warning20Filled, Dismiss16Filled } from '@fluentui/react-icons';
6
+ import { SpinnerIos16Regular, ChevronUp16Regular, ChevronLeft16Regular, ChevronRight16Regular, ChevronDown16Regular, Dismiss24Regular, Info12Regular, Dismiss16Regular, Calendar16Regular, FilterRegular, Search16Regular, ChevronDownRegular, ChevronRight16Filled, Subtract16Regular, Add16Regular, SearchInfo20Regular, ArrowSortUp16Regular, ArrowSortDown16Regular, ArrowSort16Regular, Info20Filled, CheckmarkCircle20Filled, Warning20Filled, Dismiss16Filled } from '@fluentui/react-icons';
7
7
  import { DayPicker } from 'react-day-picker';
8
8
  import { format, addDays, addMonths, addWeeks, addYears, differenceInCalendarDays, differenceInCalendarMonths, eachMonthOfInterval, eachYearOfInterval, endOfISOWeek, endOfMonth, endOfWeek, endOfYear, getISOWeek, getMonth, getYear, getWeek, isAfter, isBefore, isDate, isSameDay, isSameMonth, isSameYear, max, min, setMonth, setYear, startOfDay, startOfISOWeek, startOfMonth, startOfWeek, startOfYear } from 'date-fns';
9
9
  import { createPortal } from 'react-dom';
10
- import { useReactTable, getSortedRowModel, getPaginationRowModel, getFilteredRowModel, getCoreRowModel, flexRender } from '@tanstack/react-table';
10
+ import { useReactTable, getSortedRowModel, getCoreRowModel, flexRender } from '@tanstack/react-table';
11
11
  export { createColumnHelper as createTableColumnHelper } from '@tanstack/react-table';
12
12
  import Skeleton from 'react-loading-skeleton';
13
13
 
@@ -2616,8 +2616,14 @@ const validateInput = ({ value, maxLength, errorMessage, required }) => {
2616
2616
 
2617
2617
  var styles$h = {"labelContainer":"index-module__labelContainer___WGyDF","wrapperLabel":"index-module__wrapperLabel___XJzZO","requiredLabel":"index-module__requiredLabel___7oZkh","infoIcon":"index-module__infoIcon___lClx4","errorIcon":"index-module__errorIcon___yN-lq","disabledIcon":"index-module__disabledIcon___89Os7","errorLabel":"index-module__errorLabel___qa6h6","disabledLabel":"index-module__disabledLabel___U9vL8","disabledContainer":"index-module__disabledContainer___MtOvy"};
2618
2618
 
2619
- const LabelComponent = ({ children, htmlFor, required = false, tooltip = false, tooltipText, side = 'bottom', align = 'start', className, error = false, disabled = false }) => (jsxs("div", { className: clsx(styles$h.labelContainer, disabled && styles$h.disabledContainer), children: [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: "*" })] }), tooltip && (jsx(Tooltip, { side: side, align: align, text: tooltipText || '', children: jsx("span", { className: disabled ? styles$h.disabledIcon : error ?
2620
- styles$h.errorIcon : styles$h.infoIcon, children: jsx(Info12Regular, {}) }) }))] }));
2619
+ const LabelComponent = ({ children, htmlFor, required = false, tooltip = false, tooltipText, side = 'bottom', align = 'start', className, error = false, disabled = false }) => {
2620
+ const container = (jsxs("div", { className: clsx(styles$h.labelContainer, disabled && styles$h.disabledContainer), children: [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: "*" })] }), tooltip && (jsx("span", { className: disabled ? styles$h.disabledIcon : error ?
2621
+ styles$h.errorIcon : styles$h.infoIcon, children: jsx(Info12Regular, {}) }))] }));
2622
+ if (tooltip) {
2623
+ return (jsx(Tooltip, { side: side, align: align, text: tooltipText || '', children: container }));
2624
+ }
2625
+ return container;
2626
+ };
2621
2627
 
2622
2628
  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, error, id, icon, onBlur, onFocus, name, persistIcon = false, ...rest }, ref) => {
2623
2629
  const normalizeValue = (val) => {
@@ -2930,7 +2936,7 @@ const Dialog = ({ show = false, title, bodyContent, textPrimaryAction, textSecon
2930
2936
 
2931
2937
  var styles$e = {"drawerShadow":"Drawer-module__drawerShadow___0Z6iL","drawerShadow--visible":"Drawer-module__drawerShadow--visible___FspoH","drawerSidebar":"Drawer-module__drawerSidebar___cdyyb","drawerSidebar--open":"Drawer-module__drawerSidebar--open___ee2-Y","drawerSidebar--disabled":"Drawer-module__drawerSidebar--disabled___MYrBI","drawerTitleClose":"Drawer-module__drawerTitleClose___QzqN-","drawerTitle":"Drawer-module__drawerTitle___naMX0","drawerChildren":"Drawer-module__drawerChildren___xGdg9","drawerHeaderContent":"Drawer-module__drawerHeaderContent___NLSwj"};
2932
2938
 
2933
- const Drawer = ({ children, headerContent, customWidth = '400px', onClose, title = 'Título', isOpen = false, onOpen, className, id, disabled = false, onOverlayClick, closeOnOverlayClick = true, closeOnEscape = true, ...rest }) => {
2939
+ const Drawer = ({ children, headerContent, footer, customWidth = '400px', onClose, title = 'Título', isOpen = false, onOpen, className, id, disabled = false, onOverlayClick, closeOnOverlayClick = true, closeOnEscape = true, ...rest }) => {
2934
2940
  const internalClose = useCallback(() => {
2935
2941
  if (disabled)
2936
2942
  return;
@@ -2984,12 +2990,34 @@ const Drawer = ({ children, headerContent, customWidth = '400px', onClose, title
2984
2990
  [styles$e['drawerSidebar--disabled']]: disabled,
2985
2991
  }, className), style: {
2986
2992
  '--drawer-custom-width': customWidth,
2987
- }, onClick: handleDrawerClick, role: "dialog", "aria-modal": "true", "aria-labelledby": id ? `${id}-title` : 'drawer-title', "aria-hidden": !isOpen, "data-testid": "drawer-panel", id: id, ...rest, children: [jsxs("div", { className: styles$e.drawerTitleClose, children: [jsx("div", { className: styles$e.drawerTitle, id: id ? `${id}-title` : 'drawer-title', children: title }), headerContent && (jsx("div", { className: styles$e.drawerHeaderContent, children: headerContent })), jsx(Button, { onClick: handleCloseClick, variant: 'outlined', iconOnly: true, icon: jsx(Dismiss16Regular, {}), size: 'lg', tooltipText: 'Fechar' })] }), jsx("div", { className: styles$e.drawerChildren, "data-testid": "drawer-content", children: children })] })] }), document.body);
2993
+ }, onClick: handleDrawerClick, role: "dialog", "aria-modal": "true", "aria-labelledby": id ? `${id}-title` : 'drawer-title', "aria-hidden": !isOpen, "data-testid": "drawer-panel", id: id, ...rest, children: [jsxs("div", { className: styles$e.drawerTitleClose, children: [jsx("div", { className: styles$e.drawerTitle, id: id ? `${id}-title` : 'drawer-title', children: title }), headerContent && (jsx("div", { className: styles$e.drawerHeaderContent, children: headerContent })), jsx(Button, { onClick: handleCloseClick, variant: 'outlined', iconOnly: true, icon: jsx(Dismiss16Regular, {}), size: 'lg', tooltipText: 'Fechar' })] }), jsx("div", { className: styles$e.drawerChildren, "data-testid": "drawer-content", children: children }), footer] })] }), document.body);
2994
+ };
2995
+
2996
+ var styles$d = {"container":"Filter-module__container___cqntK","panel":"Filter-module__panel___19HqD","search":"Filter-module__search___f0gzj","list":"Filter-module__list___UpBk1","item":"Filter-module__item___oNdeY","itemSelected":"Filter-module__itemSelected___JIpJV","itemText":"Filter-module__itemText___RS--0","itemDisabled":"Filter-module__itemDisabled___X-ktg","itemIcon":"Filter-module__itemIcon___RjJSa","noResults":"Filter-module__noResults___3m6pn","footer":"Filter-module__footer___yYS5j","buttonContent":"Filter-module__buttonContent___28fKe","buttonArrow":"Filter-module__buttonArrow___VJlpc","buttonIcon":"Filter-module__buttonIcon___OOBpZ","triggerWrapper":"Filter-module__triggerWrapper___ptPRL","triggerContent":"Filter-module__triggerContent___LYo9j","body":"Filter-module__body___qsyhk","combinedFooter":"Filter-module__combinedFooter___kTnHP"};
2997
+
2998
+ const Combined = ({ buttonText = 'Filtrar', icon, variant = 'outlined', disabled = false, className, title = 'Filtrar', drawerWidth = "fit-content", activeCount = 0, drawerHeaderContent, children, onApply, onClear, onOpen, onClose, id, ...rest }) => {
2999
+ const [isOpen, setIsOpen] = useState(false);
3000
+ const handleOpen = useCallback(() => {
3001
+ setIsOpen(true);
3002
+ onOpen?.();
3003
+ }, [onOpen]);
3004
+ const handleClose = useCallback(() => {
3005
+ setIsOpen(false);
3006
+ onClose?.();
3007
+ }, [onClose]);
3008
+ const handleApply = useCallback(() => {
3009
+ onApply?.();
3010
+ handleClose();
3011
+ }, [onApply, handleClose]);
3012
+ const handleClear = useCallback(() => {
3013
+ onClear?.();
3014
+ }, [onClear]);
3015
+ return (jsxs("div", { className: clsx(styles$d.triggerWrapper, className), id: id, ...rest, children: [jsx(Button, { variant: variant, disabled: disabled, icon: icon ?? jsx(FilterRegular, {}), iconPosition: "left", onClick: handleOpen, children: jsxs("span", { className: styles$d.triggerContent, children: [buttonText, activeCount > 0 && (jsx(Badge, { badgeValue: activeCount, filterVariant: true }))] }) }), jsx(Drawer, { isOpen: isOpen, onClose: handleClose, title: title, customWidth: drawerWidth, closeOnOverlayClick: true, closeOnEscape: true, headerContent: drawerHeaderContent, footer: jsxs("div", { className: styles$d.combinedFooter, children: [jsx(Button, { variant: "outlined", onClick: handleClear, children: "Limpar" }), jsx(Button, { onClick: handleApply, children: "Aplicar" })] }), children: jsx("div", { className: styles$d.body, children: children }) })] }));
2988
3016
  };
2989
3017
 
2990
- var styles$d = {"search":"Search-module__search___u3QsV","searchLeftIcon":"Search-module__searchLeftIcon___OKOBq","disabled":"Search-module__disabled___adbxO","inputWithClearIcon":"Search-module__inputWithClearIcon___cqvkq","searchClearIcon":"Search-module__searchClearIcon___qX9-h"};
3018
+ var styles$c = {"search":"Search-module__search___u3QsV","searchLeftIcon":"Search-module__searchLeftIcon___OKOBq","disabled":"Search-module__disabled___adbxO","inputWithClearIcon":"Search-module__inputWithClearIcon___cqvkq","searchClearIcon":"Search-module__searchClearIcon___qX9-h"};
2991
3019
 
2992
- 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) => {
3020
+ const Search = React__default.forwardRef(({ placeholder = 'Dica do que deve ser buscado', disabled = false, value, onChange, onKeyDown, onFocus, onBlur, onClear, onClick, onMouseDown, searchMode = 'instant', onSearch, id, className, 'data-testid': testId, ...rest }, ref) => {
2993
3021
  const [internalValue, setInternalValue] = useState('');
2994
3022
  const isControlled = value !== undefined && onChange !== undefined;
2995
3023
  const currentValue = isControlled ? value : internalValue;
@@ -3004,6 +3032,9 @@ const Search = React__default.forwardRef(({ placeholder = 'Dica do que deve ser
3004
3032
  else {
3005
3033
  setInternalValue(e.target.value);
3006
3034
  }
3035
+ if (searchMode === 'instant') {
3036
+ onSearch?.(e.target.value);
3037
+ }
3007
3038
  };
3008
3039
  const handleFocus = (e) => {
3009
3040
  if (disabled)
@@ -3033,20 +3064,21 @@ const Search = React__default.forwardRef(({ placeholder = 'Dica do que deve ser
3033
3064
  const handleKeyDown = (e) => {
3034
3065
  if (disabled)
3035
3066
  return;
3067
+ if (searchMode === 'on-enter' && e.key === 'Enter') {
3068
+ onSearch?.(currentValue || '');
3069
+ }
3036
3070
  onKeyDown?.(e);
3037
3071
  };
3038
- return (jsxs("div", { className: clsx(styles$d.search, { [styles$d.disabled]: disabled }, className), onClick: onClick, onMouseDown: onMouseDown, role: onClick || onMouseDown ? "button" : undefined, tabIndex: onClick || onMouseDown ? 0 : undefined, onKeyDown: onClick || onMouseDown ? (e) => {
3072
+ return (jsxs("div", { className: clsx(styles$c.search, { [styles$c.disabled]: disabled }, className), onClick: onClick, onMouseDown: onMouseDown, role: onClick || onMouseDown ? "button" : undefined, tabIndex: onClick || onMouseDown ? 0 : undefined, onKeyDown: onClick || onMouseDown ? (e) => {
3039
3073
  if (e.key === 'Enter' || e.key === ' ') {
3040
3074
  e.preventDefault();
3041
3075
  onClick?.(e);
3042
3076
  }
3043
- } : undefined, children: [jsx("span", { className: clsx(styles$d.searchLeftIcon, { [styles$d.disabled]: 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, className: clsx({ [styles$d.inputWithClearIcon]: currentValue && currentValue.length > 0 }) }), currentValue && currentValue.length > 0 && (jsx("span", { className: styles$d.searchClearIcon, "aria-hidden": "true", onClick: clearInputSearch, children: jsx(Dismiss16Regular, {}) }))] }));
3077
+ } : undefined, children: [jsx("span", { className: clsx(styles$c.searchLeftIcon, { [styles$c.disabled]: 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, className: clsx({ [styles$c.inputWithClearIcon]: currentValue && currentValue.length > 0 }) }), currentValue && currentValue.length > 0 && (jsx("span", { className: styles$c.searchClearIcon, "aria-hidden": "true", onClick: clearInputSearch, children: jsx(Dismiss16Regular, {}) }))] }));
3044
3078
  });
3045
3079
  Search.displayName = 'Search';
3046
3080
 
3047
- var styles$c = {"container":"Filter-module__container___cqntK","panel":"Filter-module__panel___19HqD","search":"Filter-module__search___f0gzj","list":"Filter-module__list___UpBk1","item":"Filter-module__item___oNdeY","itemSelected":"Filter-module__itemSelected___JIpJV","itemText":"Filter-module__itemText___RS--0","itemDisabled":"Filter-module__itemDisabled___X-ktg","itemIcon":"Filter-module__itemIcon___RjJSa","noResults":"Filter-module__noResults___3m6pn","footer":"Filter-module__footer___yYS5j","buttonContent":"Filter-module__buttonContent___28fKe","buttonArrow":"Filter-module__buttonArrow___VJlpc","buttonIcon":"Filter-module__buttonIcon___OOBpZ"};
3048
-
3049
- const Filter = ({ items, type = 'checkbox', selectedIds, onApplyFilter, placeholder = 'Selecionar...', enableSearch = false, buttonText = 'Filter', icon, variant = 'outlined', onOpen, onClose, side = 'bottom', align = 'start', disabled = false, className, selectedDate, onDateSelect, onClearDate, minDate, maxDate, locale = 'pt-br', id, ...rest }) => {
3081
+ const Simple = ({ items, type = 'multiple', selectedIds, onApplyFilter, placeholder = 'Selecionar...', enableSearch = false, buttonText = 'Filter', icon, variant = 'outlined', onOpen, onClose, side = 'bottom', align = 'start', disabled = false, className, selectedDate, onDateSelect, onClearDate, minDate, maxDate, locale = 'pt-br', id, ...rest }) => {
3050
3082
  const [isOpen, setIsOpen] = useState(false);
3051
3083
  const [tempSelectedItems, setTempSelectedItems] = useState({});
3052
3084
  const [searchQuery, setSearchQuery] = useState('');
@@ -3089,7 +3121,7 @@ const Filter = ({ items, type = 'checkbox', selectedIds, onApplyFilter, placehol
3089
3121
  if (item.disabled)
3090
3122
  return;
3091
3123
  setTempSelectedItems((prev) => {
3092
- if (type === 'checkbox') {
3124
+ if (type === 'multiple') {
3093
3125
  return { ...prev, [itemId]: !prev[itemId] };
3094
3126
  }
3095
3127
  return prev[itemId] ? {} : { [itemId]: true };
@@ -3137,24 +3169,31 @@ const Filter = ({ items, type = 'checkbox', selectedIds, onApplyFilter, placehol
3137
3169
  return null;
3138
3170
  return selectedIds.length - 1;
3139
3171
  }, [selectedIds]);
3140
- const filterClass = clsx(styles$c.container, className);
3141
- const triggerButton = (jsx(Button, { variant: variant, disabled: disabled, icon: type === 'calendar' ? jsx(Calendar16Regular, {}) : jsx(ChevronDownRegular, {}), iconPosition: "right", size: "lg", children: jsxs("div", { className: styles$c.buttonContent, children: [icon && jsx("span", { className: styles$c.buttonIcon, children: icon }), jsx("span", { className: styles$c.buttonText, children: buttonDisplayText }), jsx("span", { className: clsx(styles$c.buttonArrow, { [styles$c.buttonArrowOpen]: isOpen }), children: getBadgeValue() && (jsx(Badge, { badgeValue: `+${getBadgeValue()}`, filterVariant: true })) })] }) }));
3142
- const popoverContent = type === 'calendar' ? (jsx(Calendar, { currentDate: currentCalendarDate, selected: selectedDate, onDaySelect: handleDateSelection, onDateChange: handleCalendarNavigation, minDate: minDate, maxDate: maxDate, locale: locale, onClear: handleClear, id: `filter-calendar-${id || ''}`, "aria-label": "Selecionar data para filtro" })) : (jsxs("div", { className: styles$c.panel, children: [searchVisible && (jsx("div", { className: styles$c.search, children: jsx(Search, { value: searchQuery, placeholder: placeholder, onChange: handleSearchChange, onKeyDown: handleSearchKeyDown, onClear: () => setSearchQuery('') }) })), jsx("ul", { className: styles$c.list, role: "listbox", "aria-multiselectable": type === 'checkbox', children: filteredItems.length > 0 ? (filteredItems.map((item, index) => {
3172
+ const filterClass = clsx(styles$d.container, className);
3173
+ const triggerButton = (jsx(Button, { variant: variant, disabled: disabled, icon: type === 'calendar' ? jsx(Calendar16Regular, {}) : jsx(ChevronDownRegular, {}), iconPosition: "right", size: "lg", children: jsxs("div", { className: styles$d.buttonContent, children: [icon && jsx("span", { className: styles$d.buttonIcon, children: icon }), jsx("span", { className: styles$d.buttonText, children: buttonDisplayText }), jsx("span", { className: clsx(styles$d.buttonArrow, { [styles$d.buttonArrowOpen]: isOpen }), children: getBadgeValue() && (jsx(Badge, { badgeValue: `+${getBadgeValue()}`, filterVariant: true })) })] }) }));
3174
+ const popoverContent = type === 'calendar' ? (jsx(Calendar, { currentDate: currentCalendarDate, selected: selectedDate, onDaySelect: handleDateSelection, onDateChange: handleCalendarNavigation, minDate: minDate, maxDate: maxDate, locale: locale, onClear: handleClear, id: `filter-calendar-${id || ''}`, "aria-label": "Selecionar data para filtro" })) : (jsxs("div", { className: styles$d.panel, children: [searchVisible && (jsx("div", { className: styles$d.search, children: jsx(Search, { value: searchQuery, placeholder: placeholder, onChange: handleSearchChange, onKeyDown: handleSearchKeyDown, onClear: () => setSearchQuery('') }) })), jsx("ul", { className: styles$d.list, role: "listbox", "aria-multiselectable": type === 'multiple', children: filteredItems.length > 0 ? (filteredItems.map((item, index) => {
3143
3175
  const itemId = item.id || `filter-item-${index}`;
3144
3176
  const isSelected = !!tempSelectedItems[itemId];
3145
- return (jsxs("li", { role: "option", "aria-selected": isSelected, "aria-disabled": item.disabled, className: clsx(styles$c.item, {
3146
- [styles$c.itemSelected]: isSelected,
3147
- [styles$c.itemDisabled]: item.disabled,
3177
+ return (jsxs("li", { role: "option", "aria-selected": isSelected, "aria-disabled": item.disabled, className: clsx(styles$d.item, {
3178
+ [styles$d.itemSelected]: isSelected,
3179
+ [styles$d.itemDisabled]: item.disabled,
3148
3180
  }), onMouseDown: (e) => e.preventDefault(), onClick: () => toggleItem(itemId, item), onKeyDown: (e) => {
3149
3181
  if (e.key === 'Enter' || e.key === ' ') {
3150
3182
  e.preventDefault();
3151
3183
  toggleItem(itemId, item);
3152
3184
  }
3153
- }, children: [type === 'checkbox' && (jsx(Checkbox, { checked: isSelected, disabled: item.disabled, label: "" })), type === 'icon' && item.icon && (jsx("span", { className: styles$c.itemIcon, children: item.icon })), jsx("span", { className: styles$c.itemText, children: item.text })] }, itemId));
3154
- })) : (jsx("li", { className: styles$c.noResults, role: "status", "aria-live": "polite", children: "Nenhum item encontrado" })) }), jsxs("div", { className: styles$c.footer, children: [jsx(Button, { fullWidth: true, variant: "outlined", onClick: handleClearFilter, children: "Limpar" }), jsx(Button, { fullWidth: true, onClick: handleApplyFilter, children: "Aplicar" })] })] }));
3185
+ }, children: [type === 'multiple' && (jsx(Checkbox, { checked: isSelected, disabled: item.disabled, label: "" })), item.icon && (jsx("span", { className: styles$d.itemIcon, children: item.icon })), jsx("span", { className: styles$d.itemText, children: item.text })] }, itemId));
3186
+ })) : (jsx("li", { className: styles$d.noResults, role: "status", "aria-live": "polite", children: "Nenhum item encontrado" })) }), jsxs("div", { className: styles$d.footer, children: [jsx(Button, { fullWidth: true, variant: "outlined", onClick: handleClearFilter, children: "Limpar" }), jsx(Button, { fullWidth: true, onClick: handleApplyFilter, children: "Aplicar" })] })] }));
3155
3187
  return (jsx("div", { className: filterClass, id: id, ...rest, children: jsx(Popover, { open: isOpen, onOpenChange: handleOpenChange, side: side, align: align, onOpenAutoFocus: (e) => e.preventDefault(), trigger: triggerButton, content: popoverContent }) }));
3156
3188
  };
3157
3189
 
3190
+ const Filter = ({ mode = 'simple', ...props }) => {
3191
+ if (mode === 'combined') {
3192
+ return jsx(Combined, { ...props });
3193
+ }
3194
+ return jsx(Simple, { ...props });
3195
+ };
3196
+
3158
3197
  var styles$b = {"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"};
3159
3198
 
3160
3199
  var styles$a = {"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"};
@@ -4317,7 +4356,7 @@ const isCalendarFilter = (filter) => {
4317
4356
  return filter.type === 'calendar';
4318
4357
  };
4319
4358
  const isCheckboxFilter = (filter) => {
4320
- return filter.type === 'checkbox' || filter.type === 'text' || filter.type === 'icon';
4359
+ return filter.type === 'multiple' || filter.type === 'single';
4321
4360
  };
4322
4361
  const TableHeader = ({ searchValue = '', onSearchChange, onSearch, searchPlaceholder = 'Pesquisar...', showSearch = true, showFilters = false, filters, filterItems = [], className = '', ...rest }) => {
4323
4362
  const [internalSearchValue, setInternalSearchValue] = useState(searchValue);
@@ -4394,12 +4433,24 @@ var styles$4 = {"wrapper":"Table-module__wrapper___KMc04","tableContainer":"Tabl
4394
4433
 
4395
4434
  const EmptyState = ({ emptyIcon, emptyTitle, emptyText }) => (jsxs("div", { className: styles$4.tableEmpty, children: [jsx("div", { className: styles$4.tableEmptyContent, children: emptyIcon ?? jsx(SearchInfo20Regular, {}) }), jsxs("div", { className: styles$4.tableEmptyText, children: [jsx("h3", { className: styles$4.tableEmptyTitle, children: emptyTitle ?? 'Nenhum dado encontrado' }), jsx("p", { className: styles$4.tableEmptyCaption, children: emptyText ?? 'Nenhum registro encontrado' })] })] }));
4396
4435
 
4397
- const TableV2 = ({ columns, data, enableFilters = false, enableRowSelection = false, enableSorting = true, onRowSelectionChange, bulkActions, header, footer, loading = false, emptyIcon, emptyTitle, emptyText, onRow, className, }) => {
4398
- const [columnFilters, setColumnFilters] = useState([]);
4399
- const [globalFilter, setGlobalFilter] = useState('');
4400
- const [rowSelection, setRowSelection] = useState({});
4436
+ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSorting = true, bulkActions, header, footer, loading = false, emptyIcon, emptyTitle, emptyText, onRow, className, }) => {
4437
+ const isRowSelectionEnabled = !!rowSelectionConfig;
4438
+ const isControlled = rowSelectionConfig?.selectedRowKeys !== undefined;
4439
+ const [pendingSearch, setPendingSearch] = useState(header?.searchValue ?? '');
4440
+ useEffect(() => {
4441
+ if (header?.searchValue !== undefined) {
4442
+ setPendingSearch(header.searchValue);
4443
+ }
4444
+ }, [header?.searchValue]);
4445
+ const [rowSelectionState, setRowSelectionState] = useState({});
4401
4446
  const rowSelectionRef = useRef({});
4402
- rowSelectionRef.current = rowSelection;
4447
+ const externalSelectionState = useMemo(() => {
4448
+ if (!rowSelectionConfig?.selectedRowKeys)
4449
+ return {};
4450
+ return Object.fromEntries(rowSelectionConfig.selectedRowKeys.map((key) => [String(key), true]));
4451
+ }, [rowSelectionConfig?.selectedRowKeys]);
4452
+ const effectiveRowSelection = isControlled ? externalSelectionState : rowSelectionState;
4453
+ rowSelectionRef.current = effectiveRowSelection;
4403
4454
  const lastEmittedSelectionKey = useRef('{}');
4404
4455
  const [sorting, setSorting] = useState([]);
4405
4456
  const [pagination, setPagination] = useState({
@@ -4412,27 +4463,22 @@ const TableV2 = ({ columns, data, enableFilters = false, enableRowSelection = fa
4412
4463
  size: 48,
4413
4464
  enableSorting: false,
4414
4465
  enableColumnFilter: false,
4415
- header: ({ table: t }) => (jsx("div", { className: styles$4.checkboxCell, children: jsx(Checkbox, { checked: t.getIsAllPageRowsSelected(), indeterminate: t.getIsSomePageRowsSelected(), onCheckedChange: (checked) => t.toggleAllPageRowsSelected(checked) }) })),
4416
- cell: ({ row }) => (jsx("div", { className: styles$4.checkboxCell, children: jsx(Checkbox, { checked: row.getIsSelected(), onCheckedChange: (checked) => row.toggleSelected(checked) }) })),
4417
- }), []);
4418
- const resolvedColumns = useMemo(() => (enableRowSelection ? [selectionColumn, ...columns] : columns), [enableRowSelection, selectionColumn, columns]);
4419
- const showSearch = !!(header && (header.showSearch ?? true));
4466
+ header: ({ table: t }) => (jsx("div", { className: styles$4.checkboxCell, children: jsx(Checkbox, { checked: t.getIsAllPageRowsSelected(), indeterminate: t.getIsSomePageRowsSelected(), disabled: rowSelectionConfig?.disableSelectAll, onCheckedChange: (checked) => t.toggleAllPageRowsSelected(checked) }) })),
4467
+ cell: ({ row }) => (jsx("div", { className: styles$4.checkboxCell, children: jsx(Checkbox, { checked: row.getIsSelected(), disabled: !row.getCanSelect(), onCheckedChange: (checked) => row.toggleSelected(checked) }) })),
4468
+ }), [rowSelectionConfig?.disableSelectAll]);
4469
+ const resolvedColumns = useMemo(() => (isRowSelectionEnabled ? [selectionColumn, ...columns] : columns), [isRowSelectionEnabled, selectionColumn, columns]);
4470
+ const showSearch = !!(header?.onSearchChange);
4420
4471
  const table = useReactTable({
4421
4472
  data,
4422
4473
  columns: resolvedColumns,
4423
4474
  defaultColumn: { minSize: 44, size: 0 },
4424
4475
  state: {
4425
- ...(enableFilters ? { columnFilters } : {}),
4426
- ...(showSearch ? { globalFilter } : {}),
4427
- ...(footer ? { pagination: { pageIndex, pageSize } } : {}),
4428
- ...(enableRowSelection ? { rowSelection } : {}),
4476
+ ...(isRowSelectionEnabled ? { rowSelection: effectiveRowSelection } : {}),
4429
4477
  ...(enableSorting ? { sorting } : {}),
4430
4478
  },
4431
- onColumnFiltersChange: enableFilters ? setColumnFilters : undefined,
4432
- onGlobalFilterChange: showSearch ? setGlobalFilter : undefined,
4433
4479
  onSortingChange: enableSorting ? setSorting : undefined,
4434
4480
  enableSorting,
4435
- onRowSelectionChange: enableRowSelection
4481
+ onRowSelectionChange: isRowSelectionEnabled
4436
4482
  ? (updater) => {
4437
4483
  const prev = rowSelectionRef.current;
4438
4484
  const next = typeof updater === 'function' ? updater(prev) : updater;
@@ -4441,43 +4487,52 @@ const TableV2 = ({ columns, data, enableFilters = false, enableRowSelection = fa
4441
4487
  return;
4442
4488
  lastEmittedSelectionKey.current = selectionKey;
4443
4489
  rowSelectionRef.current = next;
4444
- setRowSelection(next);
4445
- if (onRowSelectionChange) {
4446
- const selectedRows = table
4447
- .getCoreRowModel()
4448
- .rows.filter((r) => next[r.id])
4449
- .map((r) => r.original);
4450
- onRowSelectionChange(selectedRows);
4490
+ if (!isControlled) {
4491
+ setRowSelectionState(next);
4492
+ }
4493
+ if (rowSelectionConfig?.onRowChange) {
4494
+ const allRows = table.getCoreRowModel().rows;
4495
+ const selectedRows = allRows.filter((r) => next[r.id]).map((r) => r.original);
4496
+ const selectedKeys = allRows.filter((r) => next[r.id]).map((r) => r.index);
4497
+ rowSelectionConfig.onRowChange(selectedRows, selectedKeys);
4451
4498
  }
4452
4499
  }
4453
4500
  : undefined,
4454
- enableRowSelection,
4455
- onPaginationChange: footer ? setPagination : undefined,
4501
+ enableRowSelection: isRowSelectionEnabled
4502
+ ? typeof rowSelectionConfig?.disabled === 'function'
4503
+ ? (row) => !rowSelectionConfig.disabled(row.original, row.index)
4504
+ : typeof rowSelectionConfig?.disabled === 'boolean'
4505
+ ? !rowSelectionConfig.disabled
4506
+ : true
4507
+ : false,
4456
4508
  getCoreRowModel: getCoreRowModel(),
4457
- getFilteredRowModel: enableFilters || showSearch ? getFilteredRowModel() : undefined,
4458
- getPaginationRowModel: footer ? getPaginationRowModel() : undefined,
4459
4509
  getSortedRowModel: enableSorting ? getSortedRowModel() : undefined,
4460
4510
  });
4461
- const filteredRowCount = table.getFilteredRowModel().rows.length;
4462
- const effectiveTotalItems = footer
4463
- ? (enableFilters || showSearch) ? filteredRowCount : footer.totalItems
4464
- : 0;
4511
+ const effectiveTotalItems = footer?.totalItems ?? 0;
4465
4512
  const totalPages = footer ? Math.ceil(effectiveTotalItems / pageSize) : 0;
4466
4513
  const canGoPrev = pageIndex > 0;
4467
4514
  const canGoNext = pageIndex + 1 < totalPages;
4468
4515
  const skeletonRowCount = footer ? pageSize : (data.length > 0 ? data.length : pageSize);
4469
4516
  const selectedRows = useMemo(() => table
4470
4517
  .getCoreRowModel()
4471
- .rows.filter((r) => rowSelection[r.id])
4472
- .map((r) => r.original), [rowSelection, table]);
4518
+ .rows.filter((r) => effectiveRowSelection[r.id])
4519
+ .map((r) => r.original), [effectiveRowSelection, table]);
4473
4520
  const selectedCount = selectedRows.length;
4474
- const showBulkActions = enableRowSelection && !!bulkActions && selectedCount > 0;
4521
+ const showBulkActions = isRowSelectionEnabled && !!bulkActions && selectedCount > 0;
4475
4522
  useEffect(() => {
4476
- if (enableRowSelection) {
4523
+ if (isRowSelectionEnabled) {
4477
4524
  table.resetRowSelection();
4478
4525
  }
4479
4526
  // eslint-disable-next-line react-hooks/exhaustive-deps
4480
4527
  }, [pageIndex]);
4528
+ useEffect(() => {
4529
+ if (footer?.currentPage !== undefined) {
4530
+ const targetPageIndex = footer.currentPage - 1;
4531
+ setPagination((prev) => prev.pageIndex !== targetPageIndex
4532
+ ? { ...prev, pageIndex: targetPageIndex }
4533
+ : prev);
4534
+ }
4535
+ }, [footer?.currentPage]);
4481
4536
  const handleClearSelection = () => {
4482
4537
  table.resetRowSelection();
4483
4538
  bulkActions?.onClear?.();
@@ -4489,10 +4544,21 @@ const TableV2 = ({ columns, data, enableFilters = false, enableRowSelection = fa
4489
4544
  };
4490
4545
  return (jsxs("div", { className: clsx(styles$4.wrapper, className), children: [showBulkActions && (jsxs("div", { className: styles$4.bulkActionsBar, children: [jsxs("div", { className: styles$4.bulkActionsInfo, children: [jsx(Button, { variant: "text", iconOnly: true, icon: jsx(Dismiss16Regular, {}), ariaLabel: "Limpar sele\u00E7\u00E3o", onClick: handleClearSelection, className: styles$4.bulkActionsClearButton }), jsx("span", { className: styles$4.bulkActionsLabel, children: bulkActions.label
4491
4546
  ? bulkActions.label(selectedCount, selectedRows)
4492
- : `${selectedCount} ${selectedCount === 1 ? 'item selecionado' : 'itens selecionados'}` })] }), jsx("div", { className: styles$4.bulkActionsButtons, children: bulkActions.actions.map((action, index) => (jsx(Button, { variant: action.variant ?? 'outlined', type: "button", disabled: action.disabled, onClick: action.onClick, size: "sm", children: action.label }, index))) })] })), header && (jsxs("div", { className: styles$4.tableHeader, children: [showSearch && (jsx("div", { className: styles$4.tableHeaderSearchContainer, children: jsx(Search, { value: globalFilter, onChange: (e) => {
4493
- setGlobalFilter(e.target.value);
4494
- if (footer)
4547
+ : `${selectedCount} ${selectedCount === 1 ? 'item selecionado' : 'itens selecionados'}` })] }), jsx("div", { className: styles$4.bulkActionsButtons, children: bulkActions.actions.map((action, index) => (jsx(Button, { variant: action.variant ?? 'outlined', type: "button", disabled: action.disabled, onClick: action.onClick, size: "sm", children: action.label }, index))) })] })), header && (jsxs("div", { className: styles$4.tableHeader, children: [showSearch && (jsx("div", { className: styles$4.tableHeaderSearchContainer, children: jsx(Search, { value: pendingSearch, searchMode: header?.searchMode ?? "on-enter", onChange: (e) => {
4548
+ setPendingSearch(e.target.value);
4549
+ }, onSearch: (val) => {
4550
+ if (footer) {
4495
4551
  setPagination((prev) => ({ ...prev, pageIndex: 0 }));
4552
+ footer?.onPageChange?.(1);
4553
+ }
4554
+ header?.onSearchChange?.(val);
4555
+ }, onClear: () => {
4556
+ setPendingSearch('');
4557
+ if (footer) {
4558
+ setPagination((prev) => ({ ...prev, pageIndex: 0 }));
4559
+ footer?.onPageChange?.(1);
4560
+ }
4561
+ header?.onSearchChange?.('');
4496
4562
  }, placeholder: header.searchPlaceholder ?? 'Pesquisar...', className: styles$4.tableHeaderSearch }) })), !!header.filterItems?.length && (jsxs("div", { className: styles$4.tableHeaderFilters, children: [jsx("span", { className: styles$4.tableHeaderFilterLabel, children: "Filtros" }), jsx("div", { className: styles$4.tableHeaderFilterItems, children: header.filterItems.map((filterItem, index) => {
4497
4563
  const commonProps = {
4498
4564
  buttonText: filterItem.buttonText,
@@ -4504,18 +4570,21 @@ const TableV2 = ({ columns, data, enableFilters = false, enableRowSelection = fa
4504
4570
  onOpen: () => filterItem.onToggle?.(true),
4505
4571
  onClose: () => filterItem.onToggle?.(false),
4506
4572
  };
4573
+ if (filterItem.type === 'combined') {
4574
+ return (jsx(Filter, { mode: "combined", buttonText: filterItem.buttonText, icon: filterItem.icon, title: filterItem.title, drawerWidth: filterItem.drawerWidth, activeCount: filterItem.activeCount, drawerHeaderContent: filterItem.drawerHeaderContent, onApply: filterItem.onApply, onClear: filterItem.onClear, variant: filterItem.variant ?? 'outlined', disabled: filterItem.disabled, children: filterItem.children }, filterItem.id ?? index));
4575
+ }
4507
4576
  if (filterItem.type === 'calendar') {
4508
4577
  return (jsx(Filter, { ...commonProps, type: "calendar", selectedDate: filterItem.selectedDate, onDateSelect: filterItem.onDateSelect, onClearDate: filterItem.onClear, minDate: filterItem.minDate, maxDate: filterItem.maxDate, locale: filterItem.locale, placeholder: filterItem.placeholder }, filterItem.id ?? index));
4509
4578
  }
4510
4579
  return (jsx(Filter, { ...commonProps, type: filterItem.type, items: filterItem.items, selectedIds: filterItem.selectedIds, onApplyFilter: filterItem.onSelectionChange, placeholder: filterItem.placeholder, enableSearch: filterItem.enableSearch }, filterItem.id ?? index));
4511
- }) })] }))] })), jsx("div", { className: styles$4.tableContainer, children: jsx("div", { className: styles$4.tableScrollWrapper, children: jsxs("table", { className: styles$4.table, "aria-label": "Tabela de dados", "aria-rowcount": filteredRowCount + 1, children: [jsx("thead", { className: styles$4.tableHead, children: table.getHeaderGroups().map((headerGroup) => (jsx("tr", { children: headerGroup.headers.map((col) => (jsxs("th", { className: styles$4.tableTh, style: {
4580
+ }) })] }))] })), jsx("div", { className: styles$4.tableContainer, children: jsx("div", { className: styles$4.tableScrollWrapper, children: jsxs("table", { className: styles$4.table, "aria-label": "Tabela de dados", "aria-rowcount": data.length + 1, children: [jsx("thead", { className: styles$4.tableHead, children: table.getHeaderGroups().map((headerGroup) => (jsx("tr", { children: headerGroup.headers.map((col) => (jsx("th", { className: styles$4.tableTh, style: {
4512
4581
  textAlign: col.column.columnDef.meta?.align,
4513
4582
  width: col.column.columnDef.size || undefined,
4514
4583
  minWidth: col.column.columnDef.minSize,
4515
4584
  maxWidth: col.column.columnDef.maxSize !== Number.MAX_SAFE_INTEGER
4516
4585
  ? col.column.columnDef.maxSize
4517
4586
  : undefined,
4518
- }, children: [jsx("div", { className: styles$4.tableThContent, children: col.isPlaceholder ? null : col.column.getCanSort() ? (jsxs("button", { type: "button", className: styles$4.tableSortButton, onClick: col.column.getToggleSortingHandler(), "aria-label": `Ordenar por ${typeof col.column.columnDef.header === 'string' ? col.column.columnDef.header : col.id}`, children: [flexRender(col.column.columnDef.header, col.getContext()), col.column.getIsSorted() === 'asc' ? (jsx(ArrowSortUp16Regular, { className: styles$4.tableSortIcon })) : col.column.getIsSorted() === 'desc' ? (jsx(ArrowSortDown16Regular, { className: styles$4.tableSortIcon })) : (jsx(ArrowSort16Regular, { className: clsx(styles$4.tableSortIcon, styles$4.tableSortIconNeutral) }))] })) : (flexRender(col.column.columnDef.header, col.getContext())) }), enableFilters && col.column.getCanFilter() && (jsx("input", { value: col.column.getFilterValue() ?? '', onChange: (e) => col.column.setFilterValue(e.target.value), placeholder: "Filtrar..." }))] }, col.id))) }, headerGroup.id))) }), jsx("tbody", { className: styles$4.tableBody, children: loading ? (Array.from({ length: skeletonRowCount }).map((_, rowIdx) => (jsx("tr", { className: styles$4.tableRow, children: table.getVisibleLeafColumns().map((col) => (jsx("td", { className: styles$4.tableTd, children: jsx(Skeleton, {}) }, col.id))) }, `skeleton-row-${rowIdx}`)))) : table.getRowModel().rows.length > 0 ? (table.getRowModel().rows.map((row, index) => {
4587
+ }, children: jsx("div", { className: styles$4.tableThContent, children: col.isPlaceholder ? null : col.column.getCanSort() ? (jsxs("button", { type: "button", className: styles$4.tableSortButton, onClick: col.column.getToggleSortingHandler(), "aria-label": `Ordenar por ${typeof col.column.columnDef.header === 'string' ? col.column.columnDef.header : col.id}`, children: [flexRender(col.column.columnDef.header, col.getContext()), col.column.getIsSorted() === 'asc' ? (jsx(ArrowSortUp16Regular, { className: styles$4.tableSortIcon })) : col.column.getIsSorted() === 'desc' ? (jsx(ArrowSortDown16Regular, { className: styles$4.tableSortIcon })) : (jsx(ArrowSort16Regular, { className: clsx(styles$4.tableSortIcon, styles$4.tableSortIconNeutral) }))] })) : (flexRender(col.column.columnDef.header, col.getContext())) }) }, col.id))) }, headerGroup.id))) }), jsx("tbody", { className: styles$4.tableBody, children: loading ? (Array.from({ length: skeletonRowCount }).map((_, rowIdx) => (jsx("tr", { className: styles$4.tableRow, children: table.getVisibleLeafColumns().map((col) => (jsx("td", { className: styles$4.tableTd, children: jsx(Skeleton, {}) }, col.id))) }, `skeleton-row-${rowIdx}`)))) : table.getRowModel().rows.length > 0 ? (table.getRowModel().rows.map((row, index) => {
4519
4588
  const rowProps = onRow?.(row.original, index) ?? {};
4520
4589
  return (jsx("tr", { className: clsx(styles$4.tableRow, rowProps.className), onClick: rowProps.onClick, onDoubleClick: rowProps.onDoubleClick, children: row.getVisibleCells().map((cell) => (jsx("td", { className: styles$4.tableTd, style: {
4521
4590
  textAlign: cell.column.columnDef.meta?.align,