nexaas-ui-components 1.0.73 → 1.0.77

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.
Files changed (8) hide show
  1. package/dist/index.cjs +260 -227
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +1 -1
  4. package/dist/index.d.cts +13 -2
  5. package/dist/index.d.ts +13 -2
  6. package/dist/index.js +260 -227
  7. package/dist/index.js.map +1 -1
  8. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -124,7 +124,7 @@ var variants = {
124
124
  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"
125
125
  },
126
126
  successOutline: {
127
- 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"
127
+ 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"
128
128
  },
129
129
  warn: {
130
130
  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"
@@ -192,7 +192,7 @@ var Button = ({
192
192
  React5.useEffect(() => {
193
193
  if (!hotkey || !props.onClick) return;
194
194
  const handleKeyDown = (event) => {
195
- var _a;
195
+ var _a, _b;
196
196
  if (props.disabled || props.loading) return;
197
197
  const keys = hotkey.toLowerCase().split("+").map((k) => k.trim());
198
198
  const primaryKey = keys.pop();
@@ -201,10 +201,17 @@ var Button = ({
201
201
  const requiredAlt = keys.includes("alt");
202
202
  const requiredShift = keys.includes("shift");
203
203
  const requiredMeta = keys.includes("meta") || keys.includes("cmd");
204
- const match = event.key.toLowerCase() === primaryKey && event.ctrlKey === requiredCtrl && event.altKey === requiredAlt && event.shiftKey === requiredShift && event.metaKey === requiredMeta;
204
+ const keyAliases = {
205
+ esc: "escape",
206
+ del: "delete",
207
+ space: " ",
208
+ spacebar: " "
209
+ };
210
+ const normalizedPrimary = (_a = keyAliases[primaryKey]) != null ? _a : primaryKey;
211
+ const match = event.key.toLowerCase() === normalizedPrimary && event.ctrlKey === requiredCtrl && event.altKey === requiredAlt && event.shiftKey === requiredShift && event.metaKey === requiredMeta;
205
212
  if (match) {
206
213
  event.preventDefault();
207
- (_a = props.onClick) == null ? void 0 : _a.call(props, event);
214
+ (_b = props.onClick) == null ? void 0 : _b.call(props, event);
208
215
  }
209
216
  };
210
217
  window.addEventListener("keydown", handleKeyDown);
@@ -494,7 +501,7 @@ var Input = ({
494
501
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
495
502
  const [showPassword, setShowPassword] = React5__namespace.default.useState(false);
496
503
  const styles = {
497
- 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]"}
504
+ 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]"}
498
505
  ${!hasError ? "border-neutral-300" : ""}`,
499
506
  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`,
500
507
  rightIcon: "absolute h-[44px] top-[1px] right-[1.5px] w-[38px] text-[22px]",
@@ -1234,7 +1241,8 @@ var FilterCalendar = ({
1234
1241
  defaultShortcut,
1235
1242
  shortcutsChange,
1236
1243
  singleMonth = false,
1237
- maxDate = void 0
1244
+ maxDate = void 0,
1245
+ labelClassName
1238
1246
  }) => {
1239
1247
  const style = {
1240
1248
  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",
@@ -1242,7 +1250,6 @@ var FilterCalendar = ({
1242
1250
  filterActive: "rounded-3xl border border-blue-500 text-blue-500 bg-blue-100 shadow-input hover:bg-blue-500 hover:text-accent-label active:text-accent-label active:bg-blue-600 active:border-blue-600"
1243
1251
  };
1244
1252
  const [currentValue, setCurrentValue] = React5.useState([]);
1245
- const [calendarLabel, setCalendarLabel] = React5.useState("");
1246
1253
  const isMobileSize = (window == null ? void 0 : window.innerWidth) < 768;
1247
1254
  const shorcuts = [
1248
1255
  {
@@ -1406,6 +1413,9 @@ var FilterCalendar = ({
1406
1413
  const [selectedShortcut, setSelectedShortcut] = React5.useState(
1407
1414
  defaultShortcut || shorcuts[0]
1408
1415
  );
1416
+ const [calendarLabel, setCalendarLabel] = React5.useState(
1417
+ defaultShortcut != null && shorcuts[defaultShortcut] ? shorcuts[defaultShortcut].label : ""
1418
+ );
1409
1419
  const calendar = /* @__PURE__ */ jsxRuntime.jsx("div", { id: "group-input-calendar", className: "relative", children: rangeCalendar ? /* @__PURE__ */ jsxRuntime.jsx(
1410
1420
  datetime2.DateRangePicker3,
1411
1421
  {
@@ -1471,7 +1481,7 @@ var FilterCalendar = ({
1471
1481
  control,
1472
1482
  render: ({ field }) => {
1473
1483
  var _a;
1474
- let hasValue = ((_a = field == null ? void 0 : field.value) == null ? void 0 : _a.length) > 0;
1484
+ let hasValue = ((_a = field == null ? void 0 : field.value) == null ? void 0 : _a.length) > 0 || !!calendarLabel && calendarLabel !== shorcuts[0].label;
1475
1485
  return /* @__PURE__ */ jsxRuntime.jsx(
1476
1486
  react.Popover,
1477
1487
  {
@@ -1498,9 +1508,9 @@ var FilterCalendar = ({
1498
1508
  "div",
1499
1509
  {
1500
1510
  className: clsx9__default.default({
1501
- ["text-label group-active:text-blue-500"]: !field.value && !open,
1502
- ["text-blue-500"]: open && !field.value,
1503
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1511
+ ["text-label group-active:text-blue-500"]: !hasValue && !open,
1512
+ ["text-blue-500"]: open && !hasValue,
1513
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && hasValue || !open && hasValue
1504
1514
  }),
1505
1515
  children: icon
1506
1516
  }
@@ -1510,9 +1520,9 @@ var FilterCalendar = ({
1510
1520
  {
1511
1521
  className: clsx9__default.default(
1512
1522
  {
1513
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1514
- ["text-blue-500"]: open && !field.value,
1515
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1523
+ [`${labelClassName != null ? labelClassName : "text-paragraph"} group-active:text-blue-500`]: !hasValue && !open,
1524
+ ["text-blue-500"]: open && !hasValue,
1525
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && hasValue || !open && hasValue
1516
1526
  },
1517
1527
  "truncate cursor-pointer"
1518
1528
  ),
@@ -1526,9 +1536,9 @@ var FilterCalendar = ({
1526
1536
  {
1527
1537
  className: clsx9__default.default(
1528
1538
  {
1529
- ["text-label group-active:text-blue-500"]: !field.value && !open,
1530
- ["text-blue-500"]: open && !field.value,
1531
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1539
+ ["text-label group-active:text-blue-500"]: !hasValue && !open,
1540
+ ["text-blue-500"]: open && !hasValue,
1541
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && hasValue || !open && hasValue
1532
1542
  },
1533
1543
  "uil uil-angle-down text-[18px]"
1534
1544
  )
@@ -1620,7 +1630,7 @@ function InputSmall({
1620
1630
  }) {
1621
1631
  const inputRef = React5.useRef(null);
1622
1632
  const styles = {
1623
- input: `text-p-md text-paragraph w-full outline-none placeholder:text-label`,
1633
+ input: `text-p-md text-paragraph w-full outline-none placeholder:text-label disabled:text-disabled disabled:cursor-not-allowed bg-transparent`,
1624
1634
  icon: "text-label group-focus-within:text-neutral-600 m-[10px]",
1625
1635
  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}`,
1626
1636
  clear: "pr-[5px] cursor-pointer text-label text-[16px]"
@@ -1695,7 +1705,13 @@ var FilterOptions = ({
1695
1705
  initialMessage,
1696
1706
  applyOnClick = false,
1697
1707
  showFilter = false,
1698
- renderOption
1708
+ renderOption,
1709
+ searchPlaceholder = "Pesquisar",
1710
+ panelClassName = "p-2",
1711
+ applyLabel = "Aplicar",
1712
+ cancelLabel = "Cancelar",
1713
+ clearLabel = "Limpar",
1714
+ selectAllLabel = "Marcar todos"
1699
1715
  }) => {
1700
1716
  const style = {
1701
1717
  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",
@@ -1787,9 +1803,10 @@ var FilterOptions = ({
1787
1803
  {
1788
1804
  className: clsx9__default.default(
1789
1805
  {
1790
- ["font-semibold text-accent-label"]: isSelected
1806
+ ["font-semibold text-accent-label"]: isSelected,
1807
+ ["text-label"]: !isSelected
1791
1808
  },
1792
- "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-label text-p-sm block"
1809
+ "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-p-sm block"
1793
1810
  ),
1794
1811
  children: option == null ? void 0 : option.description
1795
1812
  }
@@ -1820,226 +1837,242 @@ var FilterOptions = ({
1820
1837
  children: ({ open }) => {
1821
1838
  var _a2, _b2;
1822
1839
  return /* @__PURE__ */ jsxRuntime.jsxs(react$1.Float, { composable: true, shift: 8, zIndex: 99, offset: 6, children: [
1823
- /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Reference, { children: /* @__PURE__ */ jsxRuntime.jsx(react.PopoverButton, { as: "button", children: /* @__PURE__ */ jsxRuntime.jsxs(
1824
- "div",
1840
+ /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Reference, { children: /* @__PURE__ */ jsxRuntime.jsx(
1841
+ react.PopoverButton,
1825
1842
  {
1826
- className: clsx9__default.default(
1843
+ as: "button",
1844
+ className: "rounded-3xl outline-none focus:outline-none focus-visible:ring-[1.5px] focus-visible:ring-blue-500 focus-visible:ring-offset-[2px]",
1845
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
1846
+ "div",
1827
1847
  {
1828
- [style.filter]: !hasValue && !open,
1829
- [style.filterOpen]: open && !hasValue,
1830
- [style.filterActive]: open && hasValue || !open && hasValue
1831
- },
1832
- `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`
1833
- ),
1834
- children: [
1835
- icon && /* @__PURE__ */ jsxRuntime.jsx(
1836
- "div",
1837
- {
1838
- className: clsx9__default.default({
1839
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1840
- ["text-blue-500"]: open && !field.value,
1841
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1842
- }),
1843
- children: icon
1844
- }
1845
- ),
1846
- /* @__PURE__ */ jsxRuntime.jsx(
1847
- "label",
1848
- {
1849
- className: clsx9__default.default(
1848
+ className: clsx9__default.default(
1849
+ {
1850
+ [style.filter]: !hasValue && !open,
1851
+ [style.filterOpen]: open && !hasValue,
1852
+ [style.filterActive]: open && hasValue || !open && hasValue
1853
+ },
1854
+ `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`
1855
+ ),
1856
+ children: [
1857
+ icon && /* @__PURE__ */ jsxRuntime.jsx(
1858
+ "div",
1850
1859
  {
1851
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1852
- ["text-blue-500"]: open && !field.value,
1853
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1854
- },
1855
- "truncate cursor-pointer"
1860
+ className: clsx9__default.default({
1861
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1862
+ ["text-blue-500"]: open && !hasValue,
1863
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1864
+ }),
1865
+ children: icon
1866
+ }
1856
1867
  ),
1857
- 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
1858
- }
1859
- ),
1860
- isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsxRuntime.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 }),
1861
- open ? /* @__PURE__ */ jsxRuntime.jsx(
1862
- "i",
1863
- {
1864
- className: clsx9__default.default(
1868
+ /* @__PURE__ */ jsxRuntime.jsx(
1869
+ "label",
1865
1870
  {
1866
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1867
- ["text-blue-500"]: open && !field.value,
1868
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1869
- },
1870
- "uil uil-angle-up text-[18px]"
1871
- )
1872
- }
1873
- ) : /* @__PURE__ */ jsxRuntime.jsx(
1874
- "i",
1875
- {
1876
- className: clsx9__default.default(
1871
+ className: clsx9__default.default(
1872
+ {
1873
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1874
+ ["text-blue-500"]: open && !hasValue,
1875
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1876
+ },
1877
+ "truncate cursor-pointer"
1878
+ ),
1879
+ 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
1880
+ }
1881
+ ),
1882
+ isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsxRuntime.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 }),
1883
+ open ? /* @__PURE__ */ jsxRuntime.jsx(
1884
+ "i",
1877
1885
  {
1878
- ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1879
- ["text-blue-500"]: open && !field.value,
1880
- ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
1881
- },
1882
- "uil uil-angle-down text-[18px]"
1886
+ className: clsx9__default.default(
1887
+ {
1888
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1889
+ ["text-blue-500"]: open && !hasValue,
1890
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1891
+ },
1892
+ "uil uil-angle-up text-[18px]"
1893
+ )
1894
+ }
1895
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
1896
+ "i",
1897
+ {
1898
+ className: clsx9__default.default(
1899
+ {
1900
+ ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
1901
+ ["text-blue-500"]: open && !hasValue,
1902
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
1903
+ },
1904
+ "uil uil-angle-down text-[18px]"
1905
+ )
1906
+ }
1883
1907
  )
1884
- }
1885
- )
1886
- ]
1908
+ ]
1909
+ }
1910
+ )
1887
1911
  }
1888
- ) }) }),
1889
- open && /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(react.PopoverPanel, { className: "p-2 whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-200", children: ({ close }) => {
1890
- const onClose = () => {
1891
- setCurrentValue(field.value);
1892
- close();
1893
- };
1894
- React5.useEffect(() => {
1895
- setCurrentValue(field.value);
1896
- }, [open]);
1897
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
1898
- /* @__PURE__ */ jsxRuntime.jsx(
1899
- react.Listbox,
1900
- {
1901
- value: currentValue || [],
1902
- onChange: setCurrentValue,
1903
- multiple: isMulti,
1904
- children: /* @__PURE__ */ jsxRuntime.jsxs(
1905
- react.ListboxOptions,
1912
+ ) }),
1913
+ open && /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(
1914
+ react.PopoverPanel,
1915
+ {
1916
+ className: clsx9__default.default(
1917
+ "whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-200",
1918
+ panelClassName
1919
+ ),
1920
+ children: ({ close }) => {
1921
+ const onClose = () => {
1922
+ setCurrentValue(field.value);
1923
+ close();
1924
+ };
1925
+ React5.useEffect(() => {
1926
+ setCurrentValue(field.value);
1927
+ }, [open]);
1928
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
1929
+ /* @__PURE__ */ jsxRuntime.jsx(
1930
+ react.Listbox,
1906
1931
  {
1907
- static: true,
1908
- className: clsx9__default.default(
1909
- "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
1932
+ value: currentValue || [],
1933
+ onChange: setCurrentValue,
1934
+ multiple: isMulti,
1935
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
1936
+ react.ListboxOptions,
1910
1937
  {
1911
- "pr-2": options.some(
1912
- (option) => option.description
1913
- ) ? options.length > 3 : options.length > 4
1914
- }
1915
- ),
1916
- children: [
1917
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mr-1 sticky top-0 z-30", children: [
1918
- showFilter && /* @__PURE__ */ jsxRuntime.jsx(
1919
- InputSmall,
1938
+ static: true,
1939
+ className: clsx9__default.default(
1940
+ "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
1920
1941
  {
1921
- icon: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-search" }),
1922
- onChange: (e) => setFilter(e),
1923
- value: filter,
1924
- placeholder: "Pesquisar",
1925
- clearField: true,
1926
- onKeyDown: (e) => {
1927
- if (e.key === " " || e.code === "Space") {
1928
- e.stopPropagation();
1929
- }
1930
- }
1942
+ "pr-2": options.some(
1943
+ (option) => option.description
1944
+ ) ? options.length > 3 : options.length > 4
1931
1945
  }
1932
1946
  ),
1933
- subFilters && fetch && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
1934
- const active = (item == null ? void 0 : item.id) === subFilter;
1935
- return /* @__PURE__ */ jsxRuntime.jsx(
1936
- "button",
1937
- {
1938
- className: clsx9__default.default(
1947
+ children: [
1948
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mr-1 sticky top-0 z-30", children: [
1949
+ showFilter && /* @__PURE__ */ jsxRuntime.jsx(
1950
+ InputSmall,
1951
+ {
1952
+ icon: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-search" }),
1953
+ onChange: (e) => setFilter(e),
1954
+ value: filter,
1955
+ placeholder: searchPlaceholder,
1956
+ clearField: true,
1957
+ onKeyDown: (e) => {
1958
+ if (e.key === " " || e.code === "Space") {
1959
+ e.stopPropagation();
1960
+ }
1961
+ }
1962
+ }
1963
+ ),
1964
+ subFilters && fetch && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
1965
+ const active = (item == null ? void 0 : item.id) === subFilter;
1966
+ return /* @__PURE__ */ jsxRuntime.jsx(
1967
+ "button",
1939
1968
  {
1940
- ["bg-blue-500 text-accent-label"]: active,
1941
- ["text-paragraph"]: !active
1969
+ className: clsx9__default.default(
1970
+ {
1971
+ ["bg-blue-500 text-accent-label"]: active,
1972
+ ["text-paragraph"]: !active
1973
+ },
1974
+ `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
1975
+ ),
1976
+ onClick: () => {
1977
+ if (subFilter == item.id) {
1978
+ setSubFilter(null);
1979
+ } else {
1980
+ setSubFilter(item.id);
1981
+ }
1982
+ },
1983
+ children: item.name
1942
1984
  },
1943
- `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
1944
- ),
1945
- onClick: () => {
1946
- if (subFilter == item.id) {
1947
- setSubFilter(null);
1948
- } else {
1949
- setSubFilter(item.id);
1950
- }
1951
- },
1952
- children: item.name
1953
- },
1954
- index
1955
- );
1956
- }) })
1957
- ] }),
1958
- loading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-2 w-full my-4", children: [
1959
- /* @__PURE__ */ jsxRuntime.jsx(SpinnerIcon, { className: "animate-spin w-[16px] h-[16px]" }),
1960
- "Carregando"
1961
- ] }),
1962
- (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) > 0 && !loading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-label text-p-md", children: emptyMessage }) }),
1963
- 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__ */ jsxRuntime.jsx("div", { className: "py-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-label text-p-md", children: initialMessage }) }),
1964
- initialMessage && currentValue && (currentValue == null ? void 0 : currentValue.id) && (filter == null ? void 0 : filter.length) === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-2", children: isMulti ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: currentValue == null ? void 0 : currentValue.map((option) => {
1965
- let isSelected = isMulti ? currentValue && (currentValue == null ? void 0 : currentValue.length) > 0 && (currentValue == null ? void 0 : currentValue.some(
1966
- (e) => e.id === option.id
1967
- )) : currentValue && (currentValue == null ? void 0 : currentValue.id) === option.id;
1968
- return optionStyle(
1969
- options,
1970
- isSelected
1971
- );
1972
- }) }) : optionStyle(field.value, true) }),
1973
- !loading && (data == null ? void 0 : data.map((option) => {
1974
- let isSelected = isMulti ? currentValue && currentValue.length > 0 && currentValue.some(
1975
- (e) => e.id === option.id
1976
- ) : currentValue && currentValue.id === option.id;
1977
- return optionStyle(option, isSelected);
1978
- }))
1979
- ]
1985
+ index
1986
+ );
1987
+ }) })
1988
+ ] }),
1989
+ loading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-2 w-full my-4", children: [
1990
+ /* @__PURE__ */ jsxRuntime.jsx(SpinnerIcon, { className: "animate-spin w-[16px] h-[16px]" }),
1991
+ "Carregando"
1992
+ ] }),
1993
+ (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) > 0 && !loading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-label text-p-md", children: emptyMessage }) }),
1994
+ 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__ */ jsxRuntime.jsx("div", { className: "py-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-label text-p-md", children: initialMessage }) }),
1995
+ initialMessage && currentValue && (currentValue == null ? void 0 : currentValue.id) && (filter == null ? void 0 : filter.length) === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-2", children: isMulti ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: currentValue == null ? void 0 : currentValue.map((option) => {
1996
+ let isSelected = isMulti ? currentValue && (currentValue == null ? void 0 : currentValue.length) > 0 && (currentValue == null ? void 0 : currentValue.some(
1997
+ (e) => e.id === option.id
1998
+ )) : currentValue && (currentValue == null ? void 0 : currentValue.id) === option.id;
1999
+ return optionStyle(
2000
+ options,
2001
+ isSelected
2002
+ );
2003
+ }) }) : optionStyle(field.value, true) }),
2004
+ !loading && (data == null ? void 0 : data.map((option) => {
2005
+ let isSelected = isMulti ? currentValue && currentValue.length > 0 && currentValue.some(
2006
+ (e) => e.id === option.id
2007
+ ) : currentValue && currentValue.id === option.id;
2008
+ return optionStyle(option, isSelected);
2009
+ }))
2010
+ ]
2011
+ }
2012
+ )
1980
2013
  }
1981
- )
1982
- }
1983
- ),
1984
- !applyOnClick && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 items-center justify-end border-t border-t-neutral-200 pt-3", children: [
1985
- isMulti && onSelectAll && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-r pr-2 border-neutral-300", children: /* @__PURE__ */ jsxRuntime.jsx(
1986
- Button,
1987
- {
1988
- variant: "link",
1989
- size: "xxs",
1990
- onClick: () => {
1991
- onSelectAll();
1992
- field.onChange(options);
1993
- setCurrentValue(options);
1994
- close();
1995
- },
1996
- children: "Marcar todos"
1997
- }
1998
- ) }),
1999
- onClear && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mr-1", children: /* @__PURE__ */ jsxRuntime.jsx(
2000
- Button,
2001
- {
2002
- variant: "link",
2003
- size: "xxs",
2004
- onClick: () => {
2005
- if (onClear) {
2006
- onClear();
2007
- setCurrentValue([]);
2008
- field.onChange([]);
2014
+ ),
2015
+ !applyOnClick && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 items-center justify-end border-t border-t-neutral-200 pt-3", children: [
2016
+ isMulti && onSelectAll && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-r pr-2 border-neutral-300", children: /* @__PURE__ */ jsxRuntime.jsx(
2017
+ Button,
2018
+ {
2019
+ variant: "link",
2020
+ size: "xxs",
2021
+ onClick: () => {
2022
+ onSelectAll();
2023
+ field.onChange(options);
2024
+ setCurrentValue(options);
2025
+ close();
2026
+ },
2027
+ children: selectAllLabel
2009
2028
  }
2010
- close();
2011
- },
2012
- children: "Limpar"
2013
- }
2014
- ) }),
2015
- /* @__PURE__ */ jsxRuntime.jsx(
2016
- Button,
2017
- {
2018
- size: "xs",
2019
- variant: "secondary",
2020
- onClick: () => {
2021
- onClose();
2022
- },
2023
- children: "Cancelar"
2024
- }
2025
- ),
2026
- /* @__PURE__ */ jsxRuntime.jsx(
2027
- Button,
2028
- {
2029
- size: "xs",
2030
- variant: "primary",
2031
- disabled: JSON.stringify(currentValue) === JSON.stringify(field == null ? void 0 : field.value),
2032
- onClick: () => {
2033
- field.onChange(currentValue);
2034
- if (onApply) onApply();
2035
- close();
2036
- },
2037
- children: "Aplicar"
2038
- }
2039
- )
2040
- ] })
2041
- ] });
2042
- } }) })
2029
+ ) }),
2030
+ onClear && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mr-1", children: /* @__PURE__ */ jsxRuntime.jsx(
2031
+ Button,
2032
+ {
2033
+ variant: "link",
2034
+ size: "xxs",
2035
+ onClick: () => {
2036
+ if (onClear) {
2037
+ onClear();
2038
+ setCurrentValue([]);
2039
+ field.onChange([]);
2040
+ }
2041
+ close();
2042
+ },
2043
+ children: clearLabel
2044
+ }
2045
+ ) }),
2046
+ /* @__PURE__ */ jsxRuntime.jsx(
2047
+ Button,
2048
+ {
2049
+ size: "xs",
2050
+ variant: "secondary",
2051
+ onClick: () => {
2052
+ onClose();
2053
+ },
2054
+ children: cancelLabel
2055
+ }
2056
+ ),
2057
+ /* @__PURE__ */ jsxRuntime.jsx(
2058
+ Button,
2059
+ {
2060
+ size: "xs",
2061
+ variant: "primary",
2062
+ disabled: JSON.stringify(currentValue) === JSON.stringify(field == null ? void 0 : field.value),
2063
+ onClick: () => {
2064
+ field.onChange(currentValue);
2065
+ if (onApply) onApply();
2066
+ close();
2067
+ },
2068
+ children: applyLabel
2069
+ }
2070
+ )
2071
+ ] })
2072
+ ] });
2073
+ }
2074
+ }
2075
+ ) })
2043
2076
  ] });
2044
2077
  }
2045
2078
  }
@@ -3635,7 +3668,7 @@ var Radio = ({
3635
3668
  "input",
3636
3669
  {
3637
3670
  name,
3638
- id: name,
3671
+ id: `${name}-${value}`,
3639
3672
  type: "radio",
3640
3673
  className: "",
3641
3674
  onClick: (e) => {
@@ -3649,7 +3682,7 @@ var Radio = ({
3649
3682
  ),
3650
3683
  /* @__PURE__ */ jsxRuntime.jsx("span", {})
3651
3684
  ] }),
3652
- label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: name, className: "text-p-md cursor-pointer -pt-1", children: label })
3685
+ label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: `${name}-${value}`, className: "text-p-md cursor-pointer -pt-1", children: label })
3653
3686
  ] });
3654
3687
  }
3655
3688
  }
@@ -6719,7 +6752,7 @@ var Tabs = ({
6719
6752
  {
6720
6753
  disabled: tab == null ? void 0 : tab.disabled,
6721
6754
  className: ({ selected }) => clsx9__default.default(
6722
- "group inline-flex rounded-t-lg font-bold text-p-md border border-neutral-200 px-6 py-3 z-20",
6755
+ "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]",
6723
6756
  {
6724
6757
  "text-rose-700 border-b-0 bg-surface shadow-tabs": selected,
6725
6758
  "bg-neutral-100 text-rose-700 opacity-80 shadow-tabDisabled": !selected && !tab.disabled,