nexaas-ui-components 1.0.73 → 1.0.76

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.js CHANGED
@@ -92,7 +92,7 @@ var variants = {
92
92
  text: "shadow-button text-white bg-gradient-to-b from-success-start to-success-end hover:from-[#40f09b] hover:to-[#28c67a] active:from-success-600 active:to-success-600 disabled:opacity-50 disabled:from-success-start disabled:to-success-end active:shadow-none"
93
93
  },
94
94
  successOutline: {
95
- text: "active:shadow-none shadow-green-sm text-green-500 font-bold bg-surface border-[0.5px] border-green-500 hover:bg-green-100 active:bg-green-100 active:text-white disabled:opacity-50 disabled:bg-surface disabled:text-green-500"
95
+ text: "active:shadow-none shadow-green-sm text-green-500 font-bold bg-surface border-[0.5px] border-green-500 hover:bg-green-100 active:bg-green-500 active:text-white disabled:opacity-50 disabled:bg-surface disabled:text-green-500"
96
96
  },
97
97
  warn: {
98
98
  text: "shadow-button text-white bg-gradient-to-b from-warning-start to-warning-end hover:from-[#febd5b] hover:to-[#f4a52e] active:from-warning-600 active:to-warning-600 disabled:opacity-50 disabled:from-warning-start disabled:to-warning-end active:shadow-none"
@@ -462,7 +462,7 @@ var Input = ({
462
462
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
463
463
  const [showPassword, setShowPassword] = React5__default.useState(false);
464
464
  const styles = {
465
- input: `text-p-md pl-2 peer text-paragraph bg-surface shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 focus-visible:ring-[1.5px] focus-visible:ring-blue-500 focus-visible:ring-offset-[2px] focus-visible:rounded-[2px] ${label ? "pt-[22px]" : "pt-[10px]"}
465
+ input: `text-p-md pl-2 peer text-paragraph bg-surface shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 disabled:text-disabled disabled:cursor-not-allowed focus-visible:ring-[1.5px] focus-visible:ring-blue-500 focus-visible:ring-offset-[2px] focus-visible:rounded-[2px] ${label ? "pt-[22px]" : "pt-[10px]"}
466
466
  ${!hasError ? "border-neutral-300" : ""}`,
467
467
  icon: `absolute bg-neutral-100 h-[44px] top-[1px] left-[1.5px] w-[38px] rounded-l-lg text-[20px] ${hasError ? "text-dangerous-500" : "text-label peer-focus:text-blue-500"} peer-focus:border-blue-500`,
468
468
  rightIcon: "absolute h-[44px] top-[1px] right-[1.5px] w-[38px] text-[22px]",
@@ -1202,7 +1202,8 @@ var FilterCalendar = ({
1202
1202
  defaultShortcut,
1203
1203
  shortcutsChange,
1204
1204
  singleMonth = false,
1205
- maxDate = void 0
1205
+ maxDate = void 0,
1206
+ labelClassName
1206
1207
  }) => {
1207
1208
  const style = {
1208
1209
  filter: "rounded-3xl shadow-input bg-surface hover:bg-neutral-100 border border-[0.5px] border-neutral-300 active:text-blue-500 active:bg-blue-100 active:border-blue-500",
@@ -1478,7 +1479,7 @@ var FilterCalendar = ({
1478
1479
  {
1479
1480
  className: clsx9(
1480
1481
  {
1481
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1482
+ [`${labelClassName != null ? labelClassName : "text-paragraph"} group-active:text-blue-500`]: !field.value && !open,
1482
1483
  ["text-blue-500"]: open && !field.value,
1483
1484
  ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1484
1485
  },
@@ -1588,7 +1589,7 @@ function InputSmall({
1588
1589
  }) {
1589
1590
  const inputRef = useRef(null);
1590
1591
  const styles = {
1591
- input: `text-p-md text-paragraph w-full outline-none placeholder:text-label`,
1592
+ input: `text-p-md text-paragraph w-full outline-none placeholder:text-label disabled:text-disabled disabled:cursor-not-allowed bg-transparent`,
1592
1593
  icon: "text-label group-focus-within:text-neutral-600 m-[10px]",
1593
1594
  wrapper: `shadow-input border border-neutral-300 focus-within:border-blue-500 group rounded-lg h-9 w-full text-paragraph flex items-center justify-between disabled:bg-neutral-100 ${disabled ? "bg-neutral-100" : "bg-surface"} ${className}`,
1594
1595
  clear: "pr-[5px] cursor-pointer text-label text-[16px]"
@@ -1663,7 +1664,13 @@ var FilterOptions = ({
1663
1664
  initialMessage,
1664
1665
  applyOnClick = false,
1665
1666
  showFilter = false,
1666
- renderOption
1667
+ renderOption,
1668
+ searchPlaceholder = "Pesquisar",
1669
+ panelClassName = "p-2",
1670
+ applyLabel = "Aplicar",
1671
+ cancelLabel = "Cancelar",
1672
+ clearLabel = "Limpar",
1673
+ selectAllLabel = "Marcar todos"
1667
1674
  }) => {
1668
1675
  const style = {
1669
1676
  filter: "rounded-3xl shadow-input bg-surface hover:bg-neutral-50 border border-[0.5px] border-neutral-200 active:text-blue-500 active:bg-blue-100 active:border-blue-500",
@@ -1755,9 +1762,10 @@ var FilterOptions = ({
1755
1762
  {
1756
1763
  className: clsx9(
1757
1764
  {
1758
- ["font-semibold text-accent-label"]: isSelected
1765
+ ["font-semibold text-accent-label"]: isSelected,
1766
+ ["text-label"]: !isSelected
1759
1767
  },
1760
- "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-label text-p-sm block"
1768
+ "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-p-sm block"
1761
1769
  ),
1762
1770
  children: option == null ? void 0 : option.description
1763
1771
  }
@@ -1788,226 +1796,242 @@ var FilterOptions = ({
1788
1796
  children: ({ open }) => {
1789
1797
  var _a2, _b2;
1790
1798
  return /* @__PURE__ */ jsxs(Float, { composable: true, shift: 8, zIndex: 99, offset: 6, children: [
1791
- /* @__PURE__ */ jsx(Float.Reference, { children: /* @__PURE__ */ jsx(PopoverButton, { as: "button", children: /* @__PURE__ */ jsxs(
1792
- "div",
1799
+ /* @__PURE__ */ jsx(Float.Reference, { children: /* @__PURE__ */ jsx(
1800
+ PopoverButton,
1793
1801
  {
1794
- className: clsx9(
1802
+ as: "button",
1803
+ className: "rounded-3xl outline-none focus:outline-none focus-visible:ring-[1.5px] focus-visible:ring-blue-500 focus-visible:ring-offset-[2px]",
1804
+ children: /* @__PURE__ */ jsxs(
1805
+ "div",
1795
1806
  {
1796
- [style.filter]: !hasValue && !open,
1797
- [style.filterOpen]: open && !hasValue,
1798
- [style.filterActive]: open && hasValue || !open && hasValue
1799
- },
1800
- `group px-3 h-[36px] text-p-ls font-bold disabled:shadow-none active:shadow-none flex items-center justify-between outline-none gap-2`
1801
- ),
1802
- children: [
1803
- icon && /* @__PURE__ */ jsx(
1804
- "div",
1805
- {
1806
- className: clsx9({
1807
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1808
- ["text-blue-500"]: open && !field.value,
1809
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1810
- }),
1811
- children: icon
1812
- }
1813
- ),
1814
- /* @__PURE__ */ jsx(
1815
- "label",
1816
- {
1817
- className: clsx9(
1807
+ className: clsx9(
1808
+ {
1809
+ [style.filter]: !hasValue && !open,
1810
+ [style.filterOpen]: open && !hasValue,
1811
+ [style.filterActive]: open && hasValue || !open && hasValue
1812
+ },
1813
+ `group px-3 h-[36px] text-p-ls font-bold disabled:shadow-none active:shadow-none flex items-center justify-between outline-none gap-2`
1814
+ ),
1815
+ children: [
1816
+ icon && /* @__PURE__ */ jsx(
1817
+ "div",
1818
1818
  {
1819
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1820
- ["text-blue-500"]: open && !field.value,
1821
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1822
- },
1823
- "truncate cursor-pointer"
1819
+ className: clsx9({
1820
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1821
+ ["text-blue-500"]: open && !hasValue,
1822
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1823
+ }),
1824
+ children: icon
1825
+ }
1824
1826
  ),
1825
- children: isMulti ? label : ((_a2 = field == null ? void 0 : field.value) == null ? void 0 : _a2.id) ? (_b2 = field == null ? void 0 : field.value) == null ? void 0 : _b2.label : label
1826
- }
1827
- ),
1828
- isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-blue-500 text-accent-label text-p-xs px-1 py-[2px] rounded group-hover:bg-blue-500", children: field.value.length }),
1829
- open ? /* @__PURE__ */ jsx(
1830
- "i",
1831
- {
1832
- className: clsx9(
1827
+ /* @__PURE__ */ jsx(
1828
+ "label",
1833
1829
  {
1834
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1835
- ["text-blue-500"]: open && !field.value,
1836
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1837
- },
1838
- "uil uil-angle-up text-[18px]"
1839
- )
1840
- }
1841
- ) : /* @__PURE__ */ jsx(
1842
- "i",
1843
- {
1844
- className: clsx9(
1830
+ className: clsx9(
1831
+ {
1832
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1833
+ ["text-blue-500"]: open && !hasValue,
1834
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1835
+ },
1836
+ "truncate cursor-pointer"
1837
+ ),
1838
+ children: isMulti ? label : ((_a2 = field == null ? void 0 : field.value) == null ? void 0 : _a2.id) ? (_b2 = field == null ? void 0 : field.value) == null ? void 0 : _b2.label : label
1839
+ }
1840
+ ),
1841
+ isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-blue-500 text-accent-label text-p-xs px-1 py-[2px] rounded group-hover:bg-blue-500", children: field.value.length }),
1842
+ open ? /* @__PURE__ */ jsx(
1843
+ "i",
1845
1844
  {
1846
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1847
- ["text-blue-500"]: open && !field.value,
1848
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1849
- },
1850
- "uil uil-angle-down text-[18px]"
1845
+ className: clsx9(
1846
+ {
1847
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1848
+ ["text-blue-500"]: open && !hasValue,
1849
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1850
+ },
1851
+ "uil uil-angle-up text-[18px]"
1852
+ )
1853
+ }
1854
+ ) : /* @__PURE__ */ jsx(
1855
+ "i",
1856
+ {
1857
+ className: clsx9(
1858
+ {
1859
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1860
+ ["text-blue-500"]: open && !hasValue,
1861
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1862
+ },
1863
+ "uil uil-angle-down text-[18px]"
1864
+ )
1865
+ }
1851
1866
  )
1852
- }
1853
- )
1854
- ]
1867
+ ]
1868
+ }
1869
+ )
1855
1870
  }
1856
- ) }) }),
1857
- open && /* @__PURE__ */ jsx(Float.Content, { children: /* @__PURE__ */ jsx(PopoverPanel, { className: "p-2 whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-200", children: ({ close }) => {
1858
- const onClose = () => {
1859
- setCurrentValue(field.value);
1860
- close();
1861
- };
1862
- useEffect(() => {
1863
- setCurrentValue(field.value);
1864
- }, [open]);
1865
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
1866
- /* @__PURE__ */ jsx(
1867
- Listbox,
1868
- {
1869
- value: currentValue || [],
1870
- onChange: setCurrentValue,
1871
- multiple: isMulti,
1872
- children: /* @__PURE__ */ jsxs(
1873
- ListboxOptions,
1871
+ ) }),
1872
+ open && /* @__PURE__ */ jsx(Float.Content, { children: /* @__PURE__ */ jsx(
1873
+ PopoverPanel,
1874
+ {
1875
+ className: clsx9(
1876
+ "whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-200",
1877
+ panelClassName
1878
+ ),
1879
+ children: ({ close }) => {
1880
+ const onClose = () => {
1881
+ setCurrentValue(field.value);
1882
+ close();
1883
+ };
1884
+ useEffect(() => {
1885
+ setCurrentValue(field.value);
1886
+ }, [open]);
1887
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
1888
+ /* @__PURE__ */ jsx(
1889
+ Listbox,
1874
1890
  {
1875
- static: true,
1876
- className: clsx9(
1877
- "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
1891
+ value: currentValue || [],
1892
+ onChange: setCurrentValue,
1893
+ multiple: isMulti,
1894
+ children: /* @__PURE__ */ jsxs(
1895
+ ListboxOptions,
1878
1896
  {
1879
- "pr-2": options.some(
1880
- (option) => option.description
1881
- ) ? options.length > 3 : options.length > 4
1882
- }
1883
- ),
1884
- children: [
1885
- /* @__PURE__ */ jsxs("div", { className: "mr-1 sticky top-0 z-30", children: [
1886
- showFilter && /* @__PURE__ */ jsx(
1887
- InputSmall,
1897
+ static: true,
1898
+ className: clsx9(
1899
+ "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
1888
1900
  {
1889
- icon: /* @__PURE__ */ jsx("i", { className: "uil uil-search" }),
1890
- onChange: (e) => setFilter(e),
1891
- value: filter,
1892
- placeholder: "Pesquisar",
1893
- clearField: true,
1894
- onKeyDown: (e) => {
1895
- if (e.key === " " || e.code === "Space") {
1896
- e.stopPropagation();
1897
- }
1898
- }
1901
+ "pr-2": options.some(
1902
+ (option) => option.description
1903
+ ) ? options.length > 3 : options.length > 4
1899
1904
  }
1900
1905
  ),
1901
- subFilters && fetch && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
1902
- const active = (item == null ? void 0 : item.id) === subFilter;
1903
- return /* @__PURE__ */ jsx(
1904
- "button",
1905
- {
1906
- className: clsx9(
1906
+ children: [
1907
+ /* @__PURE__ */ jsxs("div", { className: "mr-1 sticky top-0 z-30", children: [
1908
+ showFilter && /* @__PURE__ */ jsx(
1909
+ InputSmall,
1910
+ {
1911
+ icon: /* @__PURE__ */ jsx("i", { className: "uil uil-search" }),
1912
+ onChange: (e) => setFilter(e),
1913
+ value: filter,
1914
+ placeholder: searchPlaceholder,
1915
+ clearField: true,
1916
+ onKeyDown: (e) => {
1917
+ if (e.key === " " || e.code === "Space") {
1918
+ e.stopPropagation();
1919
+ }
1920
+ }
1921
+ }
1922
+ ),
1923
+ subFilters && fetch && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
1924
+ const active = (item == null ? void 0 : item.id) === subFilter;
1925
+ return /* @__PURE__ */ jsx(
1926
+ "button",
1907
1927
  {
1908
- ["bg-blue-500 text-accent-label"]: active,
1909
- ["text-paragraph"]: !active
1928
+ className: clsx9(
1929
+ {
1930
+ ["bg-blue-500 text-accent-label"]: active,
1931
+ ["text-paragraph"]: !active
1932
+ },
1933
+ `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
1934
+ ),
1935
+ onClick: () => {
1936
+ if (subFilter == item.id) {
1937
+ setSubFilter(null);
1938
+ } else {
1939
+ setSubFilter(item.id);
1940
+ }
1941
+ },
1942
+ children: item.name
1910
1943
  },
1911
- `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
1912
- ),
1913
- onClick: () => {
1914
- if (subFilter == item.id) {
1915
- setSubFilter(null);
1916
- } else {
1917
- setSubFilter(item.id);
1918
- }
1919
- },
1920
- children: item.name
1921
- },
1922
- index
1923
- );
1924
- }) })
1925
- ] }),
1926
- loading && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 w-full my-4", children: [
1927
- /* @__PURE__ */ jsx(SpinnerIcon, { className: "animate-spin w-[16px] h-[16px]" }),
1928
- "Carregando"
1929
- ] }),
1930
- (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) > 0 && !loading && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: emptyMessage }) }),
1931
- initialMessage && (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) === 0 && !loading && (options == null ? void 0 : options.length) === 0 && !(currentValue == null ? void 0 : currentValue.id) && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: initialMessage }) }),
1932
- initialMessage && currentValue && (currentValue == null ? void 0 : currentValue.id) && (filter == null ? void 0 : filter.length) === 0 && /* @__PURE__ */ jsx("div", { className: "py-2", children: isMulti ? /* @__PURE__ */ jsx(Fragment, { children: currentValue == null ? void 0 : currentValue.map((option) => {
1933
- let isSelected = isMulti ? currentValue && (currentValue == null ? void 0 : currentValue.length) > 0 && (currentValue == null ? void 0 : currentValue.some(
1934
- (e) => e.id === option.id
1935
- )) : currentValue && (currentValue == null ? void 0 : currentValue.id) === option.id;
1936
- return optionStyle(
1937
- options,
1938
- isSelected
1939
- );
1940
- }) }) : optionStyle(field.value, true) }),
1941
- !loading && (data == null ? void 0 : data.map((option) => {
1942
- let isSelected = isMulti ? currentValue && currentValue.length > 0 && currentValue.some(
1943
- (e) => e.id === option.id
1944
- ) : currentValue && currentValue.id === option.id;
1945
- return optionStyle(option, isSelected);
1946
- }))
1947
- ]
1944
+ index
1945
+ );
1946
+ }) })
1947
+ ] }),
1948
+ loading && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 w-full my-4", children: [
1949
+ /* @__PURE__ */ jsx(SpinnerIcon, { className: "animate-spin w-[16px] h-[16px]" }),
1950
+ "Carregando"
1951
+ ] }),
1952
+ (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) > 0 && !loading && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: emptyMessage }) }),
1953
+ initialMessage && (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) === 0 && !loading && (options == null ? void 0 : options.length) === 0 && !(currentValue == null ? void 0 : currentValue.id) && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: initialMessage }) }),
1954
+ initialMessage && currentValue && (currentValue == null ? void 0 : currentValue.id) && (filter == null ? void 0 : filter.length) === 0 && /* @__PURE__ */ jsx("div", { className: "py-2", children: isMulti ? /* @__PURE__ */ jsx(Fragment, { children: currentValue == null ? void 0 : currentValue.map((option) => {
1955
+ let isSelected = isMulti ? currentValue && (currentValue == null ? void 0 : currentValue.length) > 0 && (currentValue == null ? void 0 : currentValue.some(
1956
+ (e) => e.id === option.id
1957
+ )) : currentValue && (currentValue == null ? void 0 : currentValue.id) === option.id;
1958
+ return optionStyle(
1959
+ options,
1960
+ isSelected
1961
+ );
1962
+ }) }) : optionStyle(field.value, true) }),
1963
+ !loading && (data == null ? void 0 : data.map((option) => {
1964
+ let isSelected = isMulti ? currentValue && currentValue.length > 0 && currentValue.some(
1965
+ (e) => e.id === option.id
1966
+ ) : currentValue && currentValue.id === option.id;
1967
+ return optionStyle(option, isSelected);
1968
+ }))
1969
+ ]
1970
+ }
1971
+ )
1948
1972
  }
1949
- )
1950
- }
1951
- ),
1952
- !applyOnClick && /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center justify-end border-t border-t-neutral-200 pt-3", children: [
1953
- isMulti && onSelectAll && /* @__PURE__ */ jsx("div", { className: "border-r pr-2 border-neutral-300", children: /* @__PURE__ */ jsx(
1954
- Button,
1955
- {
1956
- variant: "link",
1957
- size: "xxs",
1958
- onClick: () => {
1959
- onSelectAll();
1960
- field.onChange(options);
1961
- setCurrentValue(options);
1962
- close();
1963
- },
1964
- children: "Marcar todos"
1965
- }
1966
- ) }),
1967
- onClear && /* @__PURE__ */ jsx("div", { className: "mr-1", children: /* @__PURE__ */ jsx(
1968
- Button,
1969
- {
1970
- variant: "link",
1971
- size: "xxs",
1972
- onClick: () => {
1973
- if (onClear) {
1974
- onClear();
1975
- setCurrentValue([]);
1976
- field.onChange([]);
1973
+ ),
1974
+ !applyOnClick && /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center justify-end border-t border-t-neutral-200 pt-3", children: [
1975
+ isMulti && onSelectAll && /* @__PURE__ */ jsx("div", { className: "border-r pr-2 border-neutral-300", children: /* @__PURE__ */ jsx(
1976
+ Button,
1977
+ {
1978
+ variant: "link",
1979
+ size: "xxs",
1980
+ onClick: () => {
1981
+ onSelectAll();
1982
+ field.onChange(options);
1983
+ setCurrentValue(options);
1984
+ close();
1985
+ },
1986
+ children: selectAllLabel
1977
1987
  }
1978
- close();
1979
- },
1980
- children: "Limpar"
1981
- }
1982
- ) }),
1983
- /* @__PURE__ */ jsx(
1984
- Button,
1985
- {
1986
- size: "xs",
1987
- variant: "secondary",
1988
- onClick: () => {
1989
- onClose();
1990
- },
1991
- children: "Cancelar"
1992
- }
1993
- ),
1994
- /* @__PURE__ */ jsx(
1995
- Button,
1996
- {
1997
- size: "xs",
1998
- variant: "primary",
1999
- disabled: JSON.stringify(currentValue) === JSON.stringify(field == null ? void 0 : field.value),
2000
- onClick: () => {
2001
- field.onChange(currentValue);
2002
- if (onApply) onApply();
2003
- close();
2004
- },
2005
- children: "Aplicar"
2006
- }
2007
- )
2008
- ] })
2009
- ] });
2010
- } }) })
1988
+ ) }),
1989
+ onClear && /* @__PURE__ */ jsx("div", { className: "mr-1", children: /* @__PURE__ */ jsx(
1990
+ Button,
1991
+ {
1992
+ variant: "link",
1993
+ size: "xxs",
1994
+ onClick: () => {
1995
+ if (onClear) {
1996
+ onClear();
1997
+ setCurrentValue([]);
1998
+ field.onChange([]);
1999
+ }
2000
+ close();
2001
+ },
2002
+ children: clearLabel
2003
+ }
2004
+ ) }),
2005
+ /* @__PURE__ */ jsx(
2006
+ Button,
2007
+ {
2008
+ size: "xs",
2009
+ variant: "secondary",
2010
+ onClick: () => {
2011
+ onClose();
2012
+ },
2013
+ children: cancelLabel
2014
+ }
2015
+ ),
2016
+ /* @__PURE__ */ jsx(
2017
+ Button,
2018
+ {
2019
+ size: "xs",
2020
+ variant: "primary",
2021
+ disabled: JSON.stringify(currentValue) === JSON.stringify(field == null ? void 0 : field.value),
2022
+ onClick: () => {
2023
+ field.onChange(currentValue);
2024
+ if (onApply) onApply();
2025
+ close();
2026
+ },
2027
+ children: applyLabel
2028
+ }
2029
+ )
2030
+ ] })
2031
+ ] });
2032
+ }
2033
+ }
2034
+ ) })
2011
2035
  ] });
2012
2036
  }
2013
2037
  }
@@ -3603,7 +3627,7 @@ var Radio = ({
3603
3627
  "input",
3604
3628
  {
3605
3629
  name,
3606
- id: name,
3630
+ id: `${name}-${value}`,
3607
3631
  type: "radio",
3608
3632
  className: "",
3609
3633
  onClick: (e) => {
@@ -3617,7 +3641,7 @@ var Radio = ({
3617
3641
  ),
3618
3642
  /* @__PURE__ */ jsx("span", {})
3619
3643
  ] }),
3620
- label && /* @__PURE__ */ jsx("label", { htmlFor: name, className: "text-p-md cursor-pointer -pt-1", children: label })
3644
+ label && /* @__PURE__ */ jsx("label", { htmlFor: `${name}-${value}`, className: "text-p-md cursor-pointer -pt-1", children: label })
3621
3645
  ] });
3622
3646
  }
3623
3647
  }
@@ -6687,7 +6711,7 @@ var Tabs = ({
6687
6711
  {
6688
6712
  disabled: tab == null ? void 0 : tab.disabled,
6689
6713
  className: ({ selected }) => clsx9(
6690
- "group inline-flex rounded-t-lg font-bold text-p-md border border-neutral-200 px-6 py-3 z-20",
6714
+ "group inline-flex rounded-t-lg font-bold text-p-md border border-neutral-200 px-6 py-3 z-20 outline-none focus:outline-none focus-visible:ring-[1.5px] focus-visible:ring-blue-500 focus-visible:ring-offset-[2px]",
6691
6715
  {
6692
6716
  "text-rose-700 border-b-0 bg-surface shadow-tabs": selected,
6693
6717
  "bg-neutral-100 text-rose-700 opacity-80 shadow-tabDisabled": !selected && !tab.disabled,