nexaas-ui-components 1.0.62 → 1.0.65

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 +125 -115
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +1 -1
  4. package/dist/index.d.cts +8 -8
  5. package/dist/index.d.ts +8 -8
  6. package/dist/index.js +125 -115
  7. package/dist/index.js.map +1 -1
  8. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -106,7 +106,7 @@ var variants = {
106
106
  text: "shadow-button bg-surface border-[0.5px] border-neutral-300 text-neutral-600 hover:bg-neutral-100 hover:text-neutral-600 active:text-neutral-600 active:bg-neutral-200 active:shadow-none disabled:text-neutral-400 disabled:opacity-50"
107
107
  },
108
108
  icon: {
109
- text: "shadow-button gap-1 bg-white border-[0.5px] border-neutral-300 text-neutral-500 hover:bg-[#f5f5f5] hover:text-neutral-600 active:bg-neutral-100 active:text-neutral-600 disabled:text-neutral-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-white disabled:opacity-50 active:shadow-none"
109
+ text: "shadow-button gap-1 bg-surface border-[0.5px] border-neutral-300 text-neutral-500 hover:bg-neutral-100 hover:text-neutral-600 active:bg-neutral-100 active:text-neutral-600 disabled:text-neutral-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-surface disabled:opacity-50 active:shadow-none"
110
110
  },
111
111
  outline: {
112
112
  text: "shadow-button bg-surface border-[0.5px] border-rose-500 text-rose-500 hover:bg-rose-50 hover:text-rose-600 active:bg-rose-100 active:text-rose-600 disabled:bg-surface disabled:border-[0.5px] disabled:border-rose-700 disabled:opacity-50 active:shadow-none"
@@ -115,7 +115,7 @@ var variants = {
115
115
  text: "text-left text-blue-500 hover:text-blue-600 hover:underline active:text-blue-600 disabled:text-blue-400 disabled:no-underline outline-none focus:outline-none shadow-none font-normal"
116
116
  },
117
117
  dangerOutline: {
118
- text: "shadow-button text-dangerous-500 bg-surface border-[0.5px] border-dangerous-300 hover:bg-dangerous-100 hover:text-dangerous-600 active:bg-dangerous-500 active:text-white disabled:opacity-50 disabled:bg-white disabled:text-dangerous-500 active:shadow-none"
118
+ text: "shadow-button text-dangerous-500 bg-surface border-[0.5px] border-dangerous-300 hover:bg-dangerous-100 hover:text-dangerous-600 active:bg-dangerous-500 active:text-white disabled:opacity-50 disabled:bg-surface disabled:text-dangerous-500 active:shadow-none"
119
119
  },
120
120
  danger: {
121
121
  text: "shadow-button text-white bg-gradient-to-b from-danger-start to-danger-end hover:from-[#fe6464] hover:to-[#e24e4e] active:from-dangerous-600 active:to-dangerous-600 disabled:opacity-50 disabled:from-dangerous-500 disabled:to-dangerous-500 active:shadow-none"
@@ -124,22 +124,22 @@ 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-white border-[0.5px] border-green-500 hover:bg-green-100 active:bg-green-100 active:text-white disabled:opacity-50 disabled:bg-white 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-100 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"
131
131
  },
132
132
  blue: {
133
- text: "shadow-button bg-blue-500 text-white hover:bg-blue-600 active:bg-blue-600 text-bold"
133
+ text: "shadow-button bg-blue-500 text-accent-label hover:bg-blue-600 active:bg-blue-600 text-bold"
134
134
  },
135
135
  iconSecondary: {
136
- text: "border-[1px] border-none text-white active:bg-[#0A0A0A40]/20 hover:bg-[#F5F5F526]/10 hover:text-white disabled:text-neutral-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-white disabled:opacity-50 active:shadow-none"
136
+ text: "border-[1px] border-none text-white active:bg-[#0A0A0A40]/20 hover:bg-[#F5F5F526]/10 hover:text-white disabled:text-neutral-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-surface disabled:opacity-50 active:shadow-none"
137
137
  },
138
138
  outlineIcon: {
139
- text: "bg-white text-rose-500 hover:shadow-button hover:text-rose-600 active:bg-rose-500 active:text-white disabled:text-neutral-400 disabled:border-disabled disabled:bg-white disabled:opacity-50 active:shadow-none"
139
+ text: "bg-surface text-rose-500 hover:shadow-button hover:text-rose-600 active:bg-rose-500 active:text-white disabled:text-neutral-400 disabled:border-disabled disabled:bg-surface disabled:opacity-50 active:shadow-none"
140
140
  },
141
141
  dangerLight: {
142
- text: "active:shadow-none shadow-red-sm text-danger-500 font-bold bg-white border-[0.5px] border-dangerous-300 hover:bg-dangerous-100 active:bg-danger-500 active:text-white disabled:opacity-50 disabled:bg-white disabled:text-danger-500"
142
+ text: "active:shadow-none shadow-red-sm text-danger-500 font-bold bg-surface border-[0.5px] border-dangerous-300 hover:bg-dangerous-100 active:bg-danger-500 active:text-white disabled:opacity-50 disabled:bg-surface disabled:text-danger-500"
143
143
  },
144
144
  ghost: {
145
145
  text: "bg-transparent hover:bg-neutral-100 !rounded-full text-paragraph active:bg-neutral-200 disabled:opacity-50"
@@ -295,7 +295,7 @@ var variants2 = {
295
295
  text: "shadow-button text-button-label bg-gradient-to-b hover:text-white from-rose-start to-rose-end active:bg-gradient-to-b active:from-rose-800 active:to-rose-800 disabled:bg-gradient-to-b disabled:from-rose-800 disabled:to-rose-800 disabled:opacity-50 hover:from-[#FD467F] hover:to-[#DF4573]"
296
296
  },
297
297
  secondary: {
298
- text: "shadow-button bg-white border-[0.5px] border-paragraph text-blue-500 hover:text-blue-600 hover:bg-[#f5f5f5] active:text-blue-600 active:bg-light-gray-100 disabled:text-dark-blue-400 disabled:bg-white disabled:border-[0.5px] disabled:border-dark-blue-400"
298
+ text: "shadow-button bg-surface border-[0.5px] border-paragraph text-blue-500 hover:text-blue-600 hover:bg-neutral-100 active:text-blue-600 active:bg-light-gray-100 disabled:text-neutral-400 disabled:bg-surface disabled:border-[0.5px] disabled:border-neutral-400"
299
299
  },
300
300
  link: {
301
301
  text: "text-blue-500 hover:text-blue-600 hover:underline border-none active:text-blue-600 active:underline disabled:text-blue-500 disabled:no-underline shadow-none font-normal"
@@ -304,37 +304,37 @@ var variants2 = {
304
304
  text: "text-dangerous-500 hover:text-dangerous-600 hover:underline border-none active:text-dangerous-600 active:underline disabled:text-dangerous-500 disabled:no-underline shadow-none font-normal"
305
305
  },
306
306
  icon: {
307
- text: "bg-white border-[0.5px] border-dark-blue-300 text-blue-500 hover:text-blue-600 hover:bg-[#f5f5f5] active:text-blue-600 active:bg-light-gray-100 disabled:text-dark-blue-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-white disabled:opacity-50"
307
+ text: "bg-surface border-[0.5px] border-neutral-300 text-blue-500 hover:text-blue-600 hover:bg-neutral-100 active:text-blue-600 active:bg-light-gray-100 disabled:text-neutral-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-surface disabled:opacity-50"
308
308
  },
309
309
  iconSecondary: {
310
- text: "border-[1px] border-none text-white active:bg-[#0A0A0A40]/20 hover:bg-[#F5F5F526]/10 hover:text-white disabled:text-dark-blue-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-white disabled:opacity-50"
310
+ text: "border-[1px] border-none text-white active:bg-[#0A0A0A40]/20 hover:bg-[#F5F5F526]/10 hover:text-white disabled:text-neutral-400 disabled:border-[0.5px] disabled:border-disabled disabled:bg-surface disabled:opacity-50"
311
311
  },
312
312
  outline: {
313
- text: "shadow-button bg-white border-[0.5px] border-rose-700 text-blue-500 hover:text-blue-600 hover:bg-[#f5f5f5] active:text-blue-600 active:bg-light-gray-100 disabled:text-rose-700 disabled:bg-white disabled:border-[0.5px] disabled:border-rose-700 disabled:opacity-50"
313
+ text: "shadow-button bg-surface border-[0.5px] border-rose-700 text-blue-500 hover:text-blue-600 hover:bg-neutral-100 active:text-blue-600 active:bg-light-gray-100 disabled:text-rose-700 disabled:bg-surface disabled:border-[0.5px] disabled:border-rose-700 disabled:opacity-50"
314
314
  },
315
315
  dark: {
316
316
  text: "shadow-button text-white hover:bg-[#f5f5f526] active:bg-[#0a0a0a40] disabled:opacity-50 disabled:bg-transparent"
317
317
  },
318
318
  dangerLight: {
319
- text: "shadow-button text-dangerous-700 font-bold bg-white border-[0.5px] border-dangerous-700 hover:bg-dangerous-100 active:bg-dangerous-700 active:text-white disabled:opacity-50 disabled:bg-white disabled:text-dangerous-700"
319
+ text: "shadow-button text-dangerous-700 font-bold bg-surface border-[0.5px] border-dangerous-700 hover:bg-dangerous-100 active:bg-dangerous-700 active:text-white disabled:opacity-50 disabled:bg-surface disabled:text-dangerous-700"
320
320
  },
321
321
  danger: {
322
322
  text: "shadow-button text-white bg-gradient-to-b from-danger-start to-danger-end hover:from-[#FD6363] hover:to-[#E34E4E] active:from-dangerous-800 active:to-dangerous-800 disabled:opacity-50 disabled:from-dangerous-700 disabled:to-dangerous-700"
323
323
  },
324
324
  success: {
325
- text: "shadow-button text-white bg-gradient-to-b from-success-start to-success-end hover:from-[#3FF09B] hover:to-[#27C579] active:from-success-800 active:to-success-800 disabled:opacity-50 disabled:from-success-700 disabled:to-success-700"
325
+ text: "shadow-button text-white bg-gradient-to-b from-success-start to-success-end hover:from-[#3FF09B] hover:to-[#27C579] active:from-success-600 active:to-success-600 disabled:opacity-50 disabled:from-success-500 disabled:to-success-500"
326
326
  },
327
327
  warn: {
328
- text: "shadow-button text-white bg-gradient-to-b from-warning-start to-warning-end hover:from-[#FEBD5D] hover:to-[#F4A42D] active:from-warning-800 active:to-warning-800 disabled:opacity-50 disabled:from-warning-700 disabled:to-warning-700"
328
+ text: "shadow-button text-white bg-gradient-to-b from-warning-start to-warning-end hover:from-[#FEBD5D] hover:to-[#F4A42D] active:from-warning-600 active:to-warning-600 disabled:opacity-50 disabled:from-warning-500 disabled:to-warning-500"
329
329
  },
330
330
  blue: {
331
- text: "shadow-button bg-blue-700 text-white text-bold"
331
+ text: "shadow-button bg-blue-700 text-accent-label text-bold"
332
332
  },
333
333
  filter: {
334
- text: "shadow-button rounded-3xl border border-dark-blue-300 text-blue-500 hover:text-blue-600 hover:bg-light-gray-100 active:border active:border-blue-700 active:text-blue-600 active:bg-blue-100 focus:border focus:border-blue-700 focus:text-blue-500 focus:bg-blue-100"
334
+ text: "shadow-button rounded-3xl border border-neutral-300 text-blue-500 hover:text-blue-600 hover:bg-light-gray-100 active:border active:border-blue-700 active:text-blue-600 active:bg-blue-100 focus:border focus:border-blue-700 focus:text-blue-500 focus:bg-blue-100"
335
335
  },
336
336
  filterActive: {
337
- text: "shadow-button rounded-3xl border border-blue-700 text-blue-500 bg-blue-100 shadow-button hover:bg-blue-700 hover:text-white active:text-white active:bg-blue-900 active:border-blue-900 focus:text-white focus:bg-blue-900 focus:border-blue-900"
337
+ text: "shadow-button rounded-3xl border border-blue-700 text-blue-500 bg-blue-100 shadow-button hover:bg-blue-700 hover:text-accent-label active:text-accent-label active:bg-blue-900 active:border-blue-900 focus:text-accent-label focus:bg-blue-900 focus:border-blue-900"
338
338
  }
339
339
  };
340
340
  var ButtonLink = React5.forwardRef(
@@ -487,7 +487,7 @@ var Input = ({
487
487
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
488
488
  const [showPassword, setShowPassword] = React5__namespace.default.useState(false);
489
489
  const styles = {
490
- input: `text-p-md pl-2 peer shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 focus-visible:border-1 focus-visible:border-blue-500 ${label ? "pt-[22px]" : "pt-[10px]"}
490
+ 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:border-1 focus-visible:border-blue-500 ${label ? "pt-[22px]" : "pt-[10px]"}
491
491
  ${!hasError ? "border-neutral-300" : ""}`,
492
492
  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`,
493
493
  rightIcon: "absolute h-[44px] top-[1px] right-[1.5px] w-[38px] text-[22px]",
@@ -748,7 +748,7 @@ var DatePickerInput = React5.forwardRef(
748
748
  ];
749
749
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
750
750
  const styles = {
751
- input: `text-p-md border border-neutral-300 rounded block pb-[10px] h-[46px] w-full disabled:bg-light-gray-100 focus:border-blue-500 `,
751
+ input: `text-p-md text-paragraph bg-surface border border-neutral-300 rounded block pb-[10px] h-[46px] w-full disabled:bg-light-gray-100 focus:border-blue-500 `,
752
752
  icon: `absolute bg-light-gray-100 h-[44px] w-[38px] top-[1px] left-[1px] rounded-l-lg rounded-r-none ${hasError ? "text-dangerous-700" : "text-label"}`,
753
753
  label: "absolute text-label text-sm",
754
754
  clear: "absolute top-[8px] right-[8px] cursor-pointer text-label text-[22px]"
@@ -797,7 +797,7 @@ var DatePickerInput = React5.forwardRef(
797
797
  id: "icon",
798
798
  className: clsx9__default.default(
799
799
  styles.icon,
800
- "flex justify-center items-center text-[20px] bg-gray-100"
800
+ "flex justify-center items-center text-[20px] bg-light-gray-100"
801
801
  ),
802
802
  children: icon
803
803
  }
@@ -912,10 +912,10 @@ var variants3 = {
912
912
  gray: "bg-neutral-100 text-neutral-400",
913
913
  dangerous: "bg-dangerous-100 text-dangerous-600",
914
914
  light: "bg-neutral-100 text-neutral-400",
915
- white: "bg-[#FFF] text-neutral-400 px-4 py-[6px] border border-light shadow-button text-paragraph",
915
+ white: "bg-surface text-neutral-400 px-4 py-[6px] border border-neutral-200 shadow-button text-paragraph",
916
916
  primary: "bg-rose-100 text-rose-800",
917
917
  dark: "bg-neutral-700 text-white",
918
- outline: "bg-white text-rose-700 border border-neutral-200",
918
+ outline: "bg-surface text-rose-700 border border-neutral-200",
919
919
  "dark-gray": "bg-neutral-100 text-neutral-600"
920
920
  };
921
921
  var Badge = ({
@@ -1211,7 +1211,7 @@ var Checkbox = ({
1211
1211
  "label",
1212
1212
  {
1213
1213
  htmlFor: registration == null ? void 0 : registration.name,
1214
- className: "cursor-pointer font-medium text-gray-700",
1214
+ className: "cursor-pointer font-medium text-paragraph",
1215
1215
  children: label
1216
1216
  }
1217
1217
  ) })
@@ -1230,9 +1230,9 @@ var FilterCalendar = ({
1230
1230
  maxDate = void 0
1231
1231
  }) => {
1232
1232
  const style = {
1233
- filter: "rounded-3xl shadow-input bg-white hover:bg-neutral-100 border border-[0.5px] border-neutral-300 active:text-blue-500 active:bg-blue-100 active:border-blue-500",
1233
+ 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",
1234
1234
  filterOpen: "rounded-3xl shadow-input border border-blue-500 bg-blue-100 text-blue-500",
1235
- filterActive: "rounded-3xl border border-blue-500 text-blue-500 bg-blue-100 shadow-input hover:bg-blue-500 hover:text-white active:text-white active:bg-blue-600 active:border-blue-600"
1235
+ 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"
1236
1236
  };
1237
1237
  const [currentValue, setCurrentValue] = React5.useState([]);
1238
1238
  const [calendarLabel, setCalendarLabel] = React5.useState("");
@@ -1493,7 +1493,7 @@ var FilterCalendar = ({
1493
1493
  className: clsx9__default.default({
1494
1494
  ["text-label group-active:text-blue-500"]: !field.value && !open,
1495
1495
  ["text-blue-500"]: open && !field.value,
1496
- ["text-blue-500 group-hover:text-white group-active:text-white"]: open && field.value
1496
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1497
1497
  }),
1498
1498
  children: icon
1499
1499
  }
@@ -1505,7 +1505,7 @@ var FilterCalendar = ({
1505
1505
  {
1506
1506
  ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1507
1507
  ["text-blue-500"]: open && !field.value,
1508
- ["text-blue-500 group-hover:text-white group-active:text-white"]: open && field.value
1508
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1509
1509
  },
1510
1510
  "truncate cursor-pointer"
1511
1511
  ),
@@ -1521,7 +1521,7 @@ var FilterCalendar = ({
1521
1521
  {
1522
1522
  ["text-label group-active:text-blue-500"]: !field.value && !open,
1523
1523
  ["text-blue-500"]: open && !field.value,
1524
- ["text-blue-500 group-hover:text-white group-active:text-white"]: open && field.value
1524
+ ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
1525
1525
  },
1526
1526
  "uil uil-angle-down text-[18px]"
1527
1527
  )
@@ -1530,7 +1530,7 @@ var FilterCalendar = ({
1530
1530
  ]
1531
1531
  }
1532
1532
  ) }) }),
1533
- open && /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(react.PopoverPanel, { className: "p-3 whitespace-nowrap bg-white rounded-lg shadow-dropdown border-[0.5px] border-neutral-300", children: ({ close }) => {
1533
+ open && /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(react.PopoverPanel, { className: "p-3 whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-300", children: ({ close }) => {
1534
1534
  const onClose = () => {
1535
1535
  setCurrentValue(field.value);
1536
1536
  close();
@@ -1615,7 +1615,7 @@ function InputSmall({
1615
1615
  const styles = {
1616
1616
  input: `text-p-md text-paragraph w-full outline-none placeholder:text-label`,
1617
1617
  icon: "text-label group-focus-within:text-neutral-600 m-[10px]",
1618
- 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-white"} ${className}`,
1618
+ 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}`,
1619
1619
  clear: "pr-[5px] cursor-pointer text-label text-[16px]"
1620
1620
  };
1621
1621
  const elem = inputRef == null ? void 0 : inputRef.current;
@@ -1691,9 +1691,9 @@ var FilterOptions = ({
1691
1691
  renderOption
1692
1692
  }) => {
1693
1693
  const style = {
1694
- filter: "rounded-3xl shadow-input bg-white hover:bg-neutral-100 border border-[0.5px] border-neutral-300 active:text-blue-500 active:bg-blue-100 active:border-blue-500",
1694
+ 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",
1695
1695
  filterOpen: "rounded-3xl shadow-input border border-blue-500 bg-blue-100 text-blue-500",
1696
- filterActive: "rounded-3xl border border-blue-500 text-blue-500 bg-blue-100 shadow-input hover:bg-blue-500 hover:text-white active:text-white active:bg-blue-600 active:border-blue-600"
1696
+ 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"
1697
1697
  };
1698
1698
  const [currentValue, setCurrentValue] = React5.useState(isMulti ? [] : {});
1699
1699
  const [data, setData] = React5.useState(() => options);
@@ -1745,7 +1745,7 @@ var FilterOptions = ({
1745
1745
  "relative cursor-pointer outline-none select-none p-3 rounded-lg pr-9 text-paragraph mt-1 first:mt-0 overflow-hidden w-full",
1746
1746
  {
1747
1747
  ["hover:bg-neutral-200"]: !option.disabled && !isSelected,
1748
- ["text-gray-200"]: option.disabled,
1748
+ ["text-disabled"]: option.disabled,
1749
1749
  ["bg-blue-500 hover:bg-blue-500"]: isSelected
1750
1750
  }
1751
1751
  ),
@@ -1758,7 +1758,7 @@ var FilterOptions = ({
1758
1758
  "relative cursor-pointer outline-none select-none p-3 rounded-lg pr-9 text-paragraph mt-1 first:mt-0 overflow-hidden w-full",
1759
1759
  {
1760
1760
  ["hover:bg-neutral-200"]: !option.disabled && !isSelected,
1761
- ["text-gray-200"]: option.disabled,
1761
+ ["text-disabled"]: option.disabled,
1762
1762
  ["bg-blue-500 hover:bg-blue-500"]: isSelected
1763
1763
  }
1764
1764
  ),
@@ -1768,7 +1768,7 @@ var FilterOptions = ({
1768
1768
  {
1769
1769
  className: clsx9__default.default(
1770
1770
  {
1771
- ["font-semibold text-white"]: isSelected
1771
+ ["font-semibold text-accent-label"]: isSelected
1772
1772
  },
1773
1773
  "text-wrap break-words font-normal block"
1774
1774
  ),
@@ -1780,7 +1780,7 @@ var FilterOptions = ({
1780
1780
  {
1781
1781
  className: clsx9__default.default(
1782
1782
  {
1783
- ["font-semibold text-white"]: isSelected
1783
+ ["font-semibold text-accent-label"]: isSelected
1784
1784
  },
1785
1785
  "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-label text-p-sm block"
1786
1786
  ),
@@ -1831,7 +1831,7 @@ var FilterOptions = ({
1831
1831
  className: clsx9__default.default({
1832
1832
  ["text-label group-active:text-blue-500"]: !field.value && !open,
1833
1833
  ["text-blue-500"]: open && !field.value,
1834
- ["text-blue-500 group-hover:text-white"]: open && field.value
1834
+ ["text-blue-500 group-hover:text-accent-label"]: open && field.value
1835
1835
  }),
1836
1836
  children: icon
1837
1837
  }
@@ -1843,14 +1843,14 @@ var FilterOptions = ({
1843
1843
  {
1844
1844
  ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
1845
1845
  ["text-blue-500"]: open && !field.value,
1846
- ["text-blue-500 group-hover:text-white"]: open && field.value
1846
+ ["text-blue-500 group-hover:text-accent-label"]: open && field.value
1847
1847
  },
1848
1848
  "truncate cursor-pointer"
1849
1849
  ),
1850
1850
  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
1851
1851
  }
1852
1852
  ),
1853
- isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-blue-500 text-white text-p-xs px-1 py-[2px] rounded group-hover:bg-blue-500", children: field.value.length }),
1853
+ 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 }),
1854
1854
  open ? /* @__PURE__ */ jsxRuntime.jsx(
1855
1855
  "i",
1856
1856
  {
@@ -1858,7 +1858,7 @@ var FilterOptions = ({
1858
1858
  {
1859
1859
  ["text-label group-active:text-blue-500"]: !field.value && !open,
1860
1860
  ["text-blue-500"]: open && !field.value,
1861
- ["text-blue-500 group-hover:text-white"]: open && field.value
1861
+ ["text-blue-500 group-hover:text-accent-label"]: open && field.value
1862
1862
  },
1863
1863
  "uil uil-angle-up text-[18px]"
1864
1864
  )
@@ -1870,7 +1870,7 @@ var FilterOptions = ({
1870
1870
  {
1871
1871
  ["text-label group-active:text-blue-500"]: !field.value && !open,
1872
1872
  ["text-blue-500"]: open && !field.value,
1873
- ["text-blue-500 group-hover:text-white"]: open && field.value
1873
+ ["text-blue-500 group-hover:text-accent-label"]: open && field.value
1874
1874
  },
1875
1875
  "uil uil-angle-down text-[18px]"
1876
1876
  )
@@ -1879,7 +1879,7 @@ var FilterOptions = ({
1879
1879
  ]
1880
1880
  }
1881
1881
  ) }) }),
1882
- open && /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(react.PopoverPanel, { className: "p-3 whitespace-nowrap bg-white rounded-lg shadow-dropdown border-[0.5px] border-neutral-300", children: ({ close }) => {
1882
+ open && /* @__PURE__ */ jsxRuntime.jsx(react$1.Float.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(react.PopoverPanel, { className: "p-3 whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-300", children: ({ close }) => {
1883
1883
  const onClose = () => {
1884
1884
  setCurrentValue(field.value);
1885
1885
  close();
@@ -1899,7 +1899,7 @@ var FilterOptions = ({
1899
1899
  {
1900
1900
  static: true,
1901
1901
  className: clsx9__default.default(
1902
- "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-white text-p-md focus:outline-none sm:text-sm relative",
1902
+ "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
1903
1903
  {
1904
1904
  "pr-2": options.some(
1905
1905
  (option) => option.description
@@ -1923,14 +1923,14 @@ var FilterOptions = ({
1923
1923
  }
1924
1924
  }
1925
1925
  ),
1926
- subFilters && fetch && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 pt-2 bg-white", children: subFilters.map((item, index) => {
1926
+ subFilters && fetch && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
1927
1927
  const active = (item == null ? void 0 : item.id) === subFilter;
1928
1928
  return /* @__PURE__ */ jsxRuntime.jsx(
1929
1929
  "button",
1930
1930
  {
1931
1931
  className: clsx9__default.default(
1932
1932
  {
1933
- ["bg-blue-500 text-white"]: active,
1933
+ ["bg-blue-500 text-accent-label"]: active,
1934
1934
  ["text-paragraph"]: !active
1935
1935
  },
1936
1936
  `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
@@ -2085,7 +2085,7 @@ function InputMoney({
2085
2085
  const fieldValidationMessages = [error == null ? void 0 : error.message];
2086
2086
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
2087
2087
  const styles = {
2088
- input: `text-p-md pl-2 peer text-paragraph shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 focus-visible:border ${label ? "pt-[22px]" : "pt-[10px]"} ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 focus-visible:border-blue-500"}`,
2088
+ 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:border ${label ? "pt-[22px]" : "pt-[10px]"} ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 focus-visible:border-blue-500"}`,
2089
2089
  icon: `absolute bg-neutral-100 h-[44px] top-[1px] left-[1px] w-[38px] rounded-l-lg ${hasError ? "text-dangerous-500" : "text-label"}
2090
2090
  `,
2091
2091
  label: "absolute text-label top-[0.80rem] z-10 origin-[0] transform -translate-y-3 scale-75 duration-300 text-sm peer-focus:text-blue-500 peer-focus:scale-75 peer-focus:-translate-y-3 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0"};
@@ -2207,7 +2207,7 @@ function InputNumber({
2207
2207
  const fieldValidationMessages = [error == null ? void 0 : error.message];
2208
2208
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
2209
2209
  const styles = {
2210
- input: `text-p-md pl-2 peer shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 focus-visible:border-1 ${label ? "pt-[22px]" : "pt-[10px]"} ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 focus-visible:border-blue-500"}`,
2210
+ 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:border-1 ${label ? "pt-[22px]" : "pt-[10px]"} ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 focus-visible:border-blue-500"}`,
2211
2211
  icon: `absolute bg-neutral-100 h-[44px] top-[2px] left-[1.5px] w-[38px] rounded-l-lg ${hasError ? "text-dangerous-500" : "text-label"}
2212
2212
  `,
2213
2213
  label: "absolute text-label top-[0.80rem] z-10 origin-[0] transform -translate-y-3 scale-75 duration-300 text-sm peer-focus:text-blue-500 peer-focus:scale-75 peer-focus:-translate-y-3 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0",
@@ -2420,7 +2420,7 @@ function InputPercentage({
2420
2420
  const fieldValidationMessages = [error == null ? void 0 : error.message];
2421
2421
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
2422
2422
  const styles = {
2423
- input: `text-p-md pl-2 peer shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 focus-visible:border-1 ${label ? "pt-[22px]" : "pt-[10px]"} ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 focus-visible:border-blue-500"}`,
2423
+ 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:border-1 ${label ? "pt-[22px]" : "pt-[10px]"} ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 focus-visible:border-blue-500"}`,
2424
2424
  icon: `absolute bg-neutral-100 h-[44px] top-[1px] left-[1.5px] w-[38px] text-[22px] rounded-lg ${hasError ? "text-dangerous-500" : "text-label"}
2425
2425
  `,
2426
2426
  label: "absolute text-label top-[0.80rem] z-10 origin-[0] transform -translate-y-3 scale-75 duration-300 text-sm peer-focus:text-blue-500 peer-focus:scale-75 peer-focus:-translate-y-3 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0"};
@@ -2631,7 +2631,9 @@ var ModalDialog = ({
2631
2631
  bottom: "auto",
2632
2632
  marginRight: "-50%",
2633
2633
  transform: "translate(-50%, -50%)",
2634
- border: "1px solid #E8E8E9",
2634
+ border: "1px solid var(--neutral-200)",
2635
+ background: "var(--surface)",
2636
+ color: "var(--paragraph)",
2635
2637
  padding: "20px 24px 24px 24px",
2636
2638
  borderRadius: "8px",
2637
2639
  overflow: "initial"
@@ -2757,6 +2759,7 @@ var customStyles = {
2757
2759
  },
2758
2760
  input: (provided, state) => ({
2759
2761
  ...provided,
2762
+ color: "var(--paragraph)",
2760
2763
  paddingLeft: state.selectProps.hasIcon ? "34px" : "0px",
2761
2764
  paddingTop: state.selectProps.hasLabel ? "10px" : "0px"
2762
2765
  }),
@@ -2766,7 +2769,7 @@ var customStyles = {
2766
2769
  border: "1px solid var(--neutral-300)",
2767
2770
  boxShadow: "none",
2768
2771
  borderRadius: "8px",
2769
- background: "white",
2772
+ background: "var(--surface)",
2770
2773
  zIndex: 20
2771
2774
  }),
2772
2775
  menuList: (provided) => ({
@@ -2777,19 +2780,19 @@ var customStyles = {
2777
2780
  ...base,
2778
2781
  paddingLeft: state.selectProps.hasIcon ? "34px" : "0px",
2779
2782
  paddingTop: state.selectProps.hasLabel ? "10px" : "0",
2780
- color: state.data.value === "active" ? "#0EAF86" : state.selectProps.hasError ? "var(--dangerous-500)" : "black",
2783
+ color: state.data.value === "active" ? "#0EAF86" : state.selectProps.hasError ? "var(--dangerous-500)" : "var(--paragraph)",
2781
2784
  display: "flex"
2782
2785
  }),
2783
2786
  control: (provided, state) => ({
2784
2787
  ...provided,
2785
2788
  cursor: "pointer",
2786
- border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--dark-blue-300)",
2789
+ border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--neutral-300)",
2787
2790
  boxShadow: "none",
2788
2791
  outline: "none",
2789
2792
  borderRadius: "0.5rem",
2790
2793
  placeholder: " ",
2791
2794
  height: state.selectProps.smallField ? "30px" : "46px",
2792
- backgroundColor: state.isDisabled ? "var(--light-100)" : "white",
2795
+ backgroundColor: state.isDisabled ? "var(--light-100)" : "var(--surface)",
2793
2796
  ":hover": {
2794
2797
  border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--neutral-300)"
2795
2798
  }
@@ -2812,7 +2815,7 @@ var customStyles = {
2812
2815
  }
2813
2816
  }),
2814
2817
  option: (provided, state) => {
2815
- let color = state.isSelected ? "white" : (state == null ? void 0 : state.isDisabled) ? "var(--label)" : "var(--paragraph)";
2818
+ let color = state.isSelected ? "var(--accent-label)" : (state == null ? void 0 : state.isDisabled) ? "var(--label)" : "var(--paragraph)";
2816
2819
  return {
2817
2820
  ...provided,
2818
2821
  cursor: state.isDisabled ? "auto" : "pointer",
@@ -2820,7 +2823,7 @@ var customStyles = {
2820
2823
  borderRadius: "8px",
2821
2824
  margin: "4px 0px",
2822
2825
  padding: "12px",
2823
- backgroundColor: state.isSelected ? "var(--blue-500)" : "white",
2826
+ backgroundColor: state.isSelected ? "var(--blue-500)" : "var(--surface)",
2824
2827
  color,
2825
2828
  fontWeight: state.isSelected ? 700 : 400,
2826
2829
  "&:hover": {
@@ -2828,15 +2831,15 @@ var customStyles = {
2828
2831
  },
2829
2832
  "&:active": {
2830
2833
  backgroundColor: "var(--blue-500)",
2831
- color: "white",
2834
+ color: "var(--accent-label)",
2832
2835
  fontWeight: 700
2833
2836
  },
2834
2837
  "&:active i": {
2835
- color: "white",
2838
+ color: "var(--accent-label)",
2836
2839
  fontWeight: 700
2837
2840
  },
2838
2841
  " i": {
2839
- color: "white"
2842
+ color: "var(--accent-label)"
2840
2843
  }
2841
2844
  };
2842
2845
  },
@@ -2991,7 +2994,7 @@ var SelectField = ({
2991
2994
  const NoOptionsMessage = (props) => {
2992
2995
  var _a2, _b;
2993
2996
  if (props.selectProps.inputValue.length == 0 && debounce2 > 0 || debounce2 > 0 && props.selectProps.inputValue.length < debounce2) {
2994
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-2 text-dark-blue-300", children: [
2997
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-2 text-neutral-300", children: [
2995
2998
  "Digite ",
2996
2999
  debounce2,
2997
3000
  " ou mais caracteres para pesquisar"
@@ -2999,7 +3002,7 @@ var SelectField = ({
2999
3002
  } else if (initialMessage && !debounce2 && isSearchable && props.selectProps.inputValue.length === 0) {
3000
3003
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 text-neutral-300", children: initialMessage });
3001
3004
  } else if ((props.selectProps.inputValue.length > 0 && isSearchable || !isSearchable || isSearchable && ((_a2 = props == null ? void 0 : props.options) == null ? void 0 : _a2.length) == 0) && ((_b = props == null ? void 0 : props.options) == null ? void 0 : _b.length) == 0) {
3002
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 text-dark-blue-300", children: emptyMessage || "Sem opc\u0327o\u0303es disponi\u0301veis" });
3005
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 text-neutral-300", children: emptyMessage || "Sem opc\u0327o\u0303es disponi\u0301veis" });
3003
3006
  }
3004
3007
  };
3005
3008
  const DropdownIndicatorCustom = (props) => {
@@ -3169,16 +3172,17 @@ var customStyles2 = {
3169
3172
  },
3170
3173
  input: (provided, state) => ({
3171
3174
  ...provided,
3175
+ color: "var(--paragraph)",
3172
3176
  paddingLeft: state.selectProps.hasIcon ? "34px" : "0px",
3173
3177
  paddingTop: state.selectProps.hasLabel ? "10px" : "0px"
3174
3178
  }),
3175
3179
  menu: (provided) => ({
3176
3180
  ...provided,
3177
3181
  marginTop: "4px",
3178
- border: "1px solid var(--dark-blue-300)",
3182
+ border: "1px solid var(--neutral-300)",
3179
3183
  boxShadow: "none",
3180
3184
  borderRadius: "8px",
3181
- background: "white",
3185
+ background: "var(--surface)",
3182
3186
  zIndex: 60
3183
3187
  }),
3184
3188
  menuList: (provided) => ({
@@ -3189,7 +3193,7 @@ var customStyles2 = {
3189
3193
  ...base,
3190
3194
  paddingLeft: state.selectProps.hasIcon ? "34px" : "0px",
3191
3195
  paddingTop: state.selectProps.hasLabel ? "10px" : "0",
3192
- color: state.data.value === "active" ? "#0EAF86" : "black",
3196
+ color: state.data.value === "active" ? "#0EAF86" : "var(--paragraph)",
3193
3197
  display: "flex"
3194
3198
  }),
3195
3199
  placeholder: (provided, state) => ({
@@ -3199,15 +3203,15 @@ var customStyles2 = {
3199
3203
  control: (provided, state) => ({
3200
3204
  ...provided,
3201
3205
  cursor: "pointer",
3202
- border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--dark-blue-300)",
3206
+ border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--neutral-300)",
3203
3207
  boxShadow: "none",
3204
3208
  outline: "none",
3205
3209
  borderRadius: "0.5rem",
3206
3210
  placeholder: " ",
3207
3211
  height: "46px",
3208
- backgroundColor: state.isDisabled ? "var(--light-100)" : "white",
3212
+ backgroundColor: state.isDisabled ? "var(--light-100)" : "var(--surface)",
3209
3213
  ":hover": {
3210
- border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--dark-blue-300)"
3214
+ border: state.selectProps.hasError ? "1px solid var(--dangerous-700)" : state.menuIsOpen ? "1px solid var(--blue-700)" : "1px solid var(--neutral-300)"
3211
3215
  }
3212
3216
  }),
3213
3217
  multiValue: (provided) => ({
@@ -3222,13 +3226,13 @@ var customStyles2 = {
3222
3226
  }),
3223
3227
  multiValueRemove: (provided) => ({
3224
3228
  ...provided,
3225
- color: "var(--dark-blue-400)",
3229
+ color: "var(--neutral-400)",
3226
3230
  ":hover": {
3227
3231
  color: "var(--dangerous-700)"
3228
3232
  }
3229
3233
  }),
3230
3234
  option: (provided, state) => {
3231
- let color = state.isSelected ? "white" : (state == null ? void 0 : state.isDisabled) ? "var(--label)" : "var(--paragraph)";
3235
+ let color = state.isSelected ? "var(--accent-label)" : (state == null ? void 0 : state.isDisabled) ? "var(--label)" : "var(--paragraph)";
3232
3236
  return {
3233
3237
  ...provided,
3234
3238
  cursor: state.isDisabled ? "auto" : "pointer",
@@ -3236,7 +3240,7 @@ var customStyles2 = {
3236
3240
  borderRadius: "8px",
3237
3241
  margin: "4px 0px",
3238
3242
  padding: "10px 12px",
3239
- backgroundColor: state.isSelected ? "var(--blue-700)" : "white",
3243
+ backgroundColor: state.isSelected ? "var(--blue-700)" : "var(--surface)",
3240
3244
  color,
3241
3245
  fontWeight: state.isSelected ? 700 : 400,
3242
3246
  "&:hover": {
@@ -3244,15 +3248,15 @@ var customStyles2 = {
3244
3248
  },
3245
3249
  "&:active": {
3246
3250
  backgroundColor: "var(--blue-700)",
3247
- color: "white !important",
3251
+ color: "var(--accent-label) !important",
3248
3252
  fontWeight: 700
3249
3253
  },
3250
3254
  "&:active i": {
3251
- color: "white !important",
3255
+ color: "var(--accent-label) !important",
3252
3256
  fontWeight: 700
3253
3257
  },
3254
3258
  " i": {
3255
- color: "white !important"
3259
+ color: "var(--accent-label) !important"
3256
3260
  }
3257
3261
  };
3258
3262
  },
@@ -3665,7 +3669,7 @@ var Toggle = ({
3665
3669
  className: classNames(
3666
3670
  "pointer-events-none relative inline-block -top-[2px] right-[2px] h-[14px] w-[14px] transform rounded-full shadow ring-0 transition duration-200 ease-in-out",
3667
3671
  checked ? "translate-x-[15px]" : "translate-x-0",
3668
- disabled ? "bg-neutral-300" : "bg-white"
3672
+ disabled ? "bg-neutral-300" : "bg-button-label"
3669
3673
  ),
3670
3674
  children: [
3671
3675
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -3785,7 +3789,7 @@ function PaginationSelect({
3785
3789
  pageSizeSelected == null ? void 0 : pageSizeSelected.name,
3786
3790
  open ? /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-angle-up text-base top-[13px] pl-3 cursor-pointer text-label" }) : /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-angle-down text-base top-[13px] pl-3 cursor-pointer text-label" })
3787
3791
  ] }),
3788
- /* @__PURE__ */ jsxRuntime.jsx(react.Combobox.Options, { className: "w-full outline-none max-h-[200px] overflow-auto border-[0.5px] mt-1 color-neutral-300 flex flex-col gap-y-2 p-1 absolute right-0 bottom-12 z-[999] rounded-lg bg-white", children: pageSizesOptions == null ? void 0 : pageSizesOptions.map((opt) => {
3792
+ /* @__PURE__ */ jsxRuntime.jsx(react.Combobox.Options, { className: "w-full outline-none max-h-[200px] overflow-auto border-[0.5px] mt-1 color-neutral-300 flex flex-col gap-y-2 p-1 absolute right-0 bottom-12 z-[999] rounded-lg bg-surface", children: pageSizesOptions == null ? void 0 : pageSizesOptions.map((opt) => {
3789
3793
  const selected = (opt == null ? void 0 : opt.id) === (pageSizeSelected == null ? void 0 : pageSizeSelected.id);
3790
3794
  return /* @__PURE__ */ jsxRuntime.jsx(
3791
3795
  react.Combobox.Option,
@@ -3794,7 +3798,7 @@ function PaginationSelect({
3794
3798
  className: clsx9__default.default(
3795
3799
  "p-2 rounded-lg items-center justify-center cursor-pointer flex whitespace-nowrap no-underline ",
3796
3800
  {
3797
- "bg-blue-500 hover:bg-blue-500 hover:text-[#FFFFFF] text-[#FFFFFF]": selected
3801
+ "bg-blue-500 hover:bg-blue-500 hover:text-accent-label text-accent-label": selected
3798
3802
  },
3799
3803
  {
3800
3804
  "hover:bg-neutral-100 text-paragraph": !selected
@@ -3860,7 +3864,7 @@ function PaginationSelect({
3860
3864
  ),
3861
3865
  open ? /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-angle-up text-base absolute top-[10px] right-2 cursor-pointer text-label" }) : /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-angle-down text-base absolute top-[10px] right-2 cursor-pointer text-label" })
3862
3866
  ] }),
3863
- /* @__PURE__ */ jsxRuntime.jsx(react.Combobox.Options, { className: "w-full outline-none max-h-[200px] overflow-auto border-[0.5px] mt-1 color-neutral-300 flex flex-col gap-y-2 p-1 absolute right-0 bottom-12 z-[999] rounded-lg bg-white", children: pagesOptions.map((opt) => {
3867
+ /* @__PURE__ */ jsxRuntime.jsx(react.Combobox.Options, { className: "w-full outline-none max-h-[200px] overflow-auto border-[0.5px] mt-1 color-neutral-300 flex flex-col gap-y-2 p-1 absolute right-0 bottom-12 z-[999] rounded-lg bg-surface", children: pagesOptions.map((opt) => {
3864
3868
  const selected = (opt == null ? void 0 : opt.id) === (pageSelected == null ? void 0 : pageSelected.id);
3865
3869
  return /* @__PURE__ */ jsxRuntime.jsx(
3866
3870
  react.Combobox.Option,
@@ -3869,7 +3873,7 @@ function PaginationSelect({
3869
3873
  className: clsx9__default.default(
3870
3874
  "p-2 rounded-lg items-center justify-center cursor-pointer flex whitespace-nowrap no-underline ",
3871
3875
  {
3872
- "bg-blue-500 hover:bg-blue-500 hover:text-[#FFFFFF] text-[#FFFFFF]": selected
3876
+ "bg-blue-500 hover:bg-blue-500 hover:text-accent-label text-accent-label": selected
3873
3877
  },
3874
3878
  {
3875
3879
  "hover:bg-neutral-100 text-paragraph": !selected
@@ -3915,7 +3919,7 @@ var TableFooter = React5__namespace.forwardRef(({ className, ...props }, ref) =>
3915
3919
  {
3916
3920
  ref,
3917
3921
  className: clsx9.clsx(
3918
- " flex flex-col md:flex-row gap-2 md:gap-0 justify-between items-center py-4 px-6 bg-white w-full h-full border border-neutral-200 rounded-t-lg",
3922
+ " flex flex-col md:flex-row gap-2 md:gap-0 justify-between items-center py-4 px-6 bg-surface w-full h-full border border-neutral-200 rounded-t-lg",
3919
3923
  className
3920
3924
  ),
3921
3925
  ...props
@@ -3932,7 +3936,7 @@ var TableHead = React5__namespace.forwardRef(({ className, ...props }, ref) => /
3932
3936
  {
3933
3937
  "hover:bg-neutral-100": props.sortable
3934
3938
  },
3935
- "text-p-md z-[50] bg-white font-normal text-neutral-700 p-4 text-left border-t border-b border-neutral-200 first:border-l last:border-r first:rounded-tl-lg first:rounded-bl-lg last:rounded-tr-lg last:rounded-br-lg",
3939
+ "text-p-md z-[50] bg-surface font-normal text-neutral-700 p-4 text-left border-t border-b border-neutral-200 first:border-l last:border-r first:rounded-tl-lg first:rounded-bl-lg last:rounded-tr-lg last:rounded-br-lg",
3936
3940
  className
3937
3941
  ),
3938
3942
  ...props
@@ -4005,10 +4009,10 @@ function DataTablePagination({
4005
4009
  (pageSizeOptions == null ? void 0 : pageSizeOptions.length) > 0 && /* @__PURE__ */ jsxRuntime.jsx(PaginationSelect, { table, pageSizeOptions }),
4006
4010
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col md:flex-row items-center justify-center md:justify-normal gap-2 md:gap-4", children: [
4007
4011
  footer,
4008
- selectAllOption && /* @__PURE__ */ jsxRuntime.jsx("div", { children: rowsSelected !== totalData ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "md:border-l border-gray-300 pl-4", children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { size: "xxs", onClick: onSelectAll, variant: "secondary", children: [
4012
+ selectAllOption && /* @__PURE__ */ jsxRuntime.jsx("div", { children: rowsSelected !== totalData ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "md:border-l border-neutral-300 pl-4", children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { size: "xxs", onClick: onSelectAll, variant: "secondary", children: [
4009
4013
  "Selecionar todos os ",
4010
4014
  totalData
4011
- ] }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "md:border-l border-gray-300 pl-4", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "xxs", onClick: onRemoveAll, variant: "secondary", children: "Desmarcar todos" }) }) })
4015
+ ] }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "md:border-l border-neutral-300 pl-4", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { size: "xxs", onClick: onRemoveAll, variant: "secondary", children: "Desmarcar todos" }) }) })
4012
4016
  ] }),
4013
4017
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col md:flex-row items-center md:justify-end justify-center gap-2 flex-1", children: [
4014
4018
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-p-md text-paragraph mr-1", children: [
@@ -4041,7 +4045,7 @@ function DataTablePagination({
4041
4045
  {
4042
4046
  style: {
4043
4047
  fontSize: "12px",
4044
- color: "#393C4D"
4048
+ color: "var(--paragraph)"
4045
4049
  },
4046
4050
  children: 1
4047
4051
  }
@@ -4076,7 +4080,7 @@ function DataTablePagination({
4076
4080
  {
4077
4081
  style: {
4078
4082
  fontSize: "12px",
4079
- color: isSelectedPage ? "#FFF" : "#393C4D"
4083
+ color: isSelectedPage ? "var(--accent-label)" : "var(--paragraph)"
4080
4084
  },
4081
4085
  children: (index + 1).toLocaleString("pt-BR")
4082
4086
  }
@@ -4105,7 +4109,7 @@ function DataTablePagination({
4105
4109
  {
4106
4110
  style: {
4107
4111
  fontSize: "12px",
4108
- color: "#393C4D"
4112
+ color: "var(--paragraph)"
4109
4113
  },
4110
4114
  children: pageCount.toLocaleString("pt-BR")
4111
4115
  }
@@ -4649,7 +4653,7 @@ var Menu = ({ triggerElement, children, className }) => {
4649
4653
  children: /* @__PURE__ */ jsxRuntime.jsx(
4650
4654
  react.MenuItems,
4651
4655
  {
4652
- className: `border-[0.5px] mt-1 color-neutral-300 flex min-w-[200px] flex-col gap-y-2 p-3 absolute right-0 z-[999] rounded-lg shadow-[2px_4px_8px_rgba(57,60,77,0.1)] bg-white cursor-default ${className}`,
4656
+ className: `border-[0.5px] mt-1 color-neutral-300 flex min-w-[200px] flex-col gap-y-2 p-3 absolute right-0 z-[999] rounded-lg shadow-[2px_4px_8px_rgba(57,60,77,0.1)] bg-surface cursor-default ${className}`,
4653
4657
  children
4654
4658
  }
4655
4659
  )
@@ -4664,7 +4668,7 @@ var Item = ({ index, isActive, onClick, children }) => {
4664
4668
  className: clsx9__default.default(
4665
4669
  "h-[36px] p-2 rounded-lg items-center cursor-pointer flex whitespace-nowrap no-underline ",
4666
4670
  {
4667
- "bg-[#009EDB] hover:bg-[#009EDB] hover:text-[#FFFFFF] text-[#FFFFFF]": isActive
4671
+ "bg-blue-500 hover:bg-blue-500 hover:text-accent-label text-accent-label": isActive
4668
4672
  },
4669
4673
  {
4670
4674
  "hover:bg-neutral-100 text-paragraph": !isActive
@@ -4692,7 +4696,7 @@ var EditableButton = ({
4692
4696
  children: button
4693
4697
  }
4694
4698
  ),
4695
- showModal && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-[294px] p-2 bg-white border border-neutral-300 top-14 absolute z-50 rounded-lg", children: [
4699
+ showModal && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-[294px] p-2 bg-surface border border-neutral-300 top-14 absolute z-50 rounded-lg", children: [
4696
4700
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pb-3", children }),
4697
4701
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-3 pb-1 border-t border-neutral-200 flex items-center justify-end gap-2", children: [
4698
4702
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -4783,7 +4787,7 @@ var EditableText = ({
4783
4787
  }
4784
4788
  ),
4785
4789
  showModal && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
4786
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[160px] md:w-[294px] p-2 bg-white border border-neutral-300 absolute z-[500] rounded-lg", children: [
4790
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[160px] md:w-[294px] p-2 bg-surface border border-neutral-300 absolute z-[500] rounded-lg", children: [
4787
4791
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pb-3 ", children }),
4788
4792
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-3 pb-1 border-t border-neutral-200 flex flex-col md:flex-row md:items-center md:justify-end gap-2", children: [
4789
4793
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -4891,7 +4895,7 @@ var EditableTextSelect = ({
4891
4895
  ]
4892
4896
  }
4893
4897
  ) }),
4894
- /* @__PURE__ */ jsxRuntime.jsx(react.Menu.Items, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[294px] p-2 bg-white border border-neutral-300 absolute z-[500] rounded-lg", children: [
4898
+ /* @__PURE__ */ jsxRuntime.jsx(react.Menu.Items, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[294px] p-2 bg-surface border border-neutral-300 absolute z-[500] rounded-lg", children: [
4895
4899
  showInputSeach && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsxRuntime.jsx(
4896
4900
  InputSmall,
4897
4901
  {
@@ -4923,7 +4927,7 @@ var EditableTextSelect = ({
4923
4927
  className: clsx9__default.default(
4924
4928
  "p-3 mb-1 rounded-lg items-center flex whitespace-nowrap no-underline w-full",
4925
4929
  {
4926
- "bg-blue-500 hover:bg-blue-500 hover:text-[#FFFFFF] text-[#FFFFFF]": selected
4930
+ "bg-blue-500 hover:bg-blue-500 hover:text-accent-label text-accent-label": selected
4927
4931
  },
4928
4932
  {
4929
4933
  "hover:bg-neutral-100 text-paragraph": !selected
@@ -4950,9 +4954,9 @@ var EditableTextSelect = ({
4950
4954
  "span",
4951
4955
  {
4952
4956
  className: clsx9__default.default(
4953
- "group-hover:text-[#fff] ",
4957
+ "group-hover:text-accent-label ",
4954
4958
  {
4955
- "text-[#fff]": selected
4959
+ "text-accent-label": selected
4956
4960
  },
4957
4961
  {
4958
4962
  "text-blue-500": !selected
@@ -5002,7 +5006,7 @@ function ImagePreview({ open, setOpen, previewImage }) {
5002
5006
  leave: "ease-in duration-200",
5003
5007
  leaveFrom: "opacity-100 translate-y-0 sm:scale-100",
5004
5008
  leaveTo: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",
5005
- children: /* @__PURE__ */ jsxRuntime.jsx(react.Dialog.Panel, { className: "flex flex-col min-w-[350px] min-h-[250px] relative transform overflow-hidden rounded-lg bg-white p-6 text-left shadow-xl transition-all", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col h-full flex-1", children: [
5009
+ children: /* @__PURE__ */ jsxRuntime.jsx(react.Dialog.Panel, { className: "flex flex-col min-w-[350px] min-h-[250px] relative transform overflow-hidden rounded-lg bg-surface p-6 text-left shadow-xl transition-all", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col h-full flex-1", children: [
5006
5010
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between mb-2", children: [
5007
5011
  /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-t-sm font-bold", children: "Pr\xE9via da imagem" }),
5008
5012
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -5528,7 +5532,7 @@ var DefaultContent = ({ formats, icon, limitMessage }) => /* @__PURE__ */ jsxRun
5528
5532
  "label",
5529
5533
  {
5530
5534
  htmlFor: "file-upload",
5531
- className: "relative leading-none cursor-pointer text-sm bg-white focus-within:outline-none",
5535
+ className: "relative leading-none cursor-pointer text-sm bg-surface focus-within:outline-none",
5532
5536
  children: /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
5533
5537
  "ou\xA0",
5534
5538
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-blue-500", children: "selecione do seu computador" })
@@ -5595,6 +5599,7 @@ var customStyles3 = {
5595
5599
  },
5596
5600
  input: (provided, state) => ({
5597
5601
  ...provided,
5602
+ color: "var(--paragraph)",
5598
5603
  outline: "none",
5599
5604
  paddingLeft: state.selectProps.hasIcon ? "2.5rem" : "0px"
5600
5605
  }),
@@ -5624,11 +5629,11 @@ var customStyles3 = {
5624
5629
  borderRadius: "8px",
5625
5630
  padding: "0px 8px",
5626
5631
  zIndex: 70,
5627
- background: "white"
5632
+ background: "var(--surface)"
5628
5633
  }),
5629
5634
  singleValue: (base, state) => ({
5630
5635
  ...base,
5631
- color: state.data.value === "active" ? "#0EAF86" : "black",
5636
+ color: state.data.value === "active" ? "#0EAF86" : "var(--paragraph)",
5632
5637
  display: "flex"
5633
5638
  }),
5634
5639
  control: (provided, state) => ({
@@ -5643,6 +5648,7 @@ var customStyles3 = {
5643
5648
  minHeight: "46px",
5644
5649
  alignItems: "end",
5645
5650
  paddingTop: "8px",
5651
+ backgroundColor: "var(--surface)",
5646
5652
  ":hover": {
5647
5653
  border: state.selectProps.hasError ? "1px solid var(--dangerous-500)" : state.menuIsOpen ? "1px solid var(--blue-500)" : "1px solid var(--neutral-300)"
5648
5654
  }
@@ -5669,9 +5675,9 @@ var customStyles3 = {
5669
5675
  }
5670
5676
  }),
5671
5677
  option: (provided, state) => {
5672
- let color = state.isSelected && !state.selectProps.isTargeted ? "white" : "var(--paragraph)";
5678
+ let color = state.isSelected && !state.selectProps.isTargeted ? "var(--accent-label)" : "var(--paragraph)";
5673
5679
  if (state.isDisabled) {
5674
- color = "rgba(0,0,0,0.30)";
5680
+ color = "var(--disabled)";
5675
5681
  }
5676
5682
  return {
5677
5683
  ...provided,
@@ -5679,7 +5685,7 @@ var customStyles3 = {
5679
5685
  cursor: "pointer",
5680
5686
  borderRadius: "8px",
5681
5687
  margin: "4px 0px",
5682
- backgroundColor: state.isSelected && !state.selectProps.isTargeted ? "var(--blue-500)" : state.isFocused ? "var(--neutral-200)" : "white",
5688
+ backgroundColor: state.isSelected && !state.selectProps.isTargeted ? "var(--blue-500)" : state.isFocused ? "var(--neutral-200)" : "var(--surface)",
5683
5689
  color,
5684
5690
  fontWeight: state.isSelected && !state.selectProps.isTargeted ? 700 : 400,
5685
5691
  "&:hover": {
@@ -5687,15 +5693,15 @@ var customStyles3 = {
5687
5693
  },
5688
5694
  "&:active": {
5689
5695
  backgroundColor: "var(--blue-500)",
5690
- color: "white",
5696
+ color: "var(--accent-label)",
5691
5697
  fontWeight: 700
5692
5698
  },
5693
5699
  "&:active svg": {
5694
- color: "white",
5700
+ color: "var(--accent-label)",
5695
5701
  fontWeight: 700
5696
5702
  },
5697
5703
  " svg": {
5698
- color: "white"
5704
+ color: "var(--accent-label)"
5699
5705
  }
5700
5706
  };
5701
5707
  },
@@ -5813,6 +5819,7 @@ var ValueContainer3 = ({ children, ...props }) => {
5813
5819
  var customStyles4 = {
5814
5820
  input: (provided) => ({
5815
5821
  ...provided,
5822
+ color: "var(--paragraph)",
5816
5823
  outline: "none",
5817
5824
  height: "100%"
5818
5825
  }),
@@ -5839,7 +5846,7 @@ var customStyles4 = {
5839
5846
  borderRadius: "8px",
5840
5847
  padding: "0px 8px",
5841
5848
  zIndex: 30,
5842
- background: "white"
5849
+ background: "var(--surface)"
5843
5850
  }),
5844
5851
  control: (provided, state) => {
5845
5852
  return {
@@ -5850,6 +5857,7 @@ var customStyles4 = {
5850
5857
  boxShadow: "none",
5851
5858
  outline: "none",
5852
5859
  borderRadius: "0.5rem",
5860
+ backgroundColor: "var(--surface)",
5853
5861
  // height: "52px",
5854
5862
  // paddingLeft: '8px',
5855
5863
  placeholder: state.selectProps.hasLabel ? " " : state.selectProps.placeholder,
@@ -6004,6 +6012,7 @@ var customStyles5 = {
6004
6012
  },
6005
6013
  input: (provided, state) => ({
6006
6014
  ...provided,
6015
+ color: "var(--paragraph)",
6007
6016
  outline: "none",
6008
6017
  paddingLeft: state.selectProps.hasIcon ? "2.5rem" : "0px"
6009
6018
  }),
@@ -6028,11 +6037,11 @@ var customStyles5 = {
6028
6037
  borderRadius: "8px",
6029
6038
  padding: "0px 8px",
6030
6039
  zIndex: 70,
6031
- background: "white"
6040
+ background: "var(--surface)"
6032
6041
  }),
6033
6042
  singleValue: (base, state) => ({
6034
6043
  ...base,
6035
- color: state.data.value === "active" ? "#0EAF86" : "black",
6044
+ color: state.data.value === "active" ? "#0EAF86" : "var(--paragraph)",
6036
6045
  display: "flex"
6037
6046
  }),
6038
6047
  control: (provided, state) => ({
@@ -6046,6 +6055,7 @@ var customStyles5 = {
6046
6055
  placeholder: " ",
6047
6056
  height: "46px",
6048
6057
  alignItems: "end",
6058
+ backgroundColor: "var(--surface)",
6049
6059
  ":hover": {
6050
6060
  border: state.selectProps.hasError ? "1px solid var(--dangerous-500)" : state.menuIsOpen ? "1px solid var(--blue-500)" : "1px solid var(--neutral-300)"
6051
6061
  }
@@ -6072,9 +6082,9 @@ var customStyles5 = {
6072
6082
  }
6073
6083
  }),
6074
6084
  option: (provided, state) => {
6075
- let color = state.isSelected && !state.selectProps.isTargeted ? "white" : "var(--paragraph)";
6085
+ let color = state.isSelected && !state.selectProps.isTargeted ? "var(--accent-label)" : "var(--paragraph)";
6076
6086
  if (state.isDisabled) {
6077
- color = "rgba(0,0,0,0.30)";
6087
+ color = "var(--disabled)";
6078
6088
  }
6079
6089
  return {
6080
6090
  ...provided,
@@ -6082,7 +6092,7 @@ var customStyles5 = {
6082
6092
  cursor: "pointer",
6083
6093
  borderRadius: "8px",
6084
6094
  margin: "4px 0px",
6085
- backgroundColor: state.isSelected && !state.selectProps.isTargeted ? "var(--blue-500)" : state.isFocused ? "var(--neutral-200)" : "white",
6095
+ backgroundColor: state.isSelected && !state.selectProps.isTargeted ? "var(--blue-500)" : state.isFocused ? "var(--neutral-200)" : "var(--surface)",
6086
6096
  color,
6087
6097
  fontWeight: state.isSelected && !state.selectProps.isTargeted ? 700 : 400,
6088
6098
  "&:hover": {
@@ -6090,15 +6100,15 @@ var customStyles5 = {
6090
6100
  },
6091
6101
  "&:active": {
6092
6102
  backgroundColor: "var(--blue-500)",
6093
- color: "white",
6103
+ color: "var(--accent-label)",
6094
6104
  fontWeight: 700
6095
6105
  },
6096
6106
  "&:active svg": {
6097
- color: "white",
6107
+ color: "var(--accent-label)",
6098
6108
  fontWeight: 700
6099
6109
  },
6100
6110
  " svg": {
6101
- color: "white"
6111
+ color: "var(--accent-label)"
6102
6112
  }
6103
6113
  };
6104
6114
  },
@@ -6531,7 +6541,7 @@ var SkeletonList = ({ loading, ...props }) => {
6531
6541
  new Array(1).fill(null).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: headerItem }, index + "second")),
6532
6542
  new Array(4).fill(null).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: tableLine }, index + "third"))
6533
6543
  ] }) }),
6534
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "py-4 px-6 sticky bottom-0 bg-white w-full border border-neutral-200 rounded-t-lg flex items-center gap-3 justify-end", children: [
6544
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "py-4 px-6 sticky bottom-0 bg-surface w-full border border-neutral-200 rounded-t-lg flex items-center gap-3 justify-end", children: [
6535
6545
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[190px] h-6 rounded-md", children: /* @__PURE__ */ jsxRuntime.jsx(Skeleton__default.default, { className: "h-full" }) }),
6536
6546
  Array(5).fill(null).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: buttonPagination }, index + "buttons"))
6537
6547
  ] })
@@ -6686,7 +6696,7 @@ var Tabs = ({
6686
6696
  className: ({ selected }) => clsx9__default.default(
6687
6697
  "group inline-flex rounded-t-lg font-bold text-p-md border border-neutral-200 px-6 py-3 z-20",
6688
6698
  {
6689
- "text-rose-700 border-b-0 bg-white shadow-tabs": selected,
6699
+ "text-rose-700 border-b-0 bg-surface shadow-tabs": selected,
6690
6700
  "bg-neutral-100 text-rose-700 opacity-80 shadow-tabDisabled": !selected && !tab.disabled,
6691
6701
  "text-disabled bg-neutral-100 shadow-tabDisabled": tab.disabled && !selected
6692
6702
  }
@@ -6775,7 +6785,7 @@ var TextArea = ({
6775
6785
  const fieldValidationMessages = [error == null ? void 0 : error.message];
6776
6786
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
6777
6787
  const styles = {
6778
- input: `border border-neutral-800 rounded-lg block pb-[10px] pt-[18px] w-full disabled:bg-neutral-100 focus-visible:border-blue-500 focus-visible:border-1 text-p-md peer shadow-input pl-2 outline-none ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 text-paragraph"}`,
6788
+ input: `border border-neutral-800 rounded-lg block pb-[10px] pt-[18px] w-full bg-surface disabled:bg-neutral-100 focus-visible:border-blue-500 focus-visible:border-1 text-p-md peer shadow-input pl-2 outline-none ${hasError ? "border-dangerous-500 text-dangerous-500" : "border-neutral-300 text-paragraph"}`,
6779
6789
  label: `cursor-text absolute text-label top-[0.70rem] z-10 transform origin-[0] -translate-y-3 scale-75 duration-300 text-sm peer-focus:text-blue-500 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-3 left-2.5`
6780
6790
  };
6781
6791
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
@@ -6922,7 +6932,7 @@ function ControlledInput({
6922
6932
  const fieldValidationMessages = [error == null ? void 0 : error.message];
6923
6933
  const hasError = fieldValidationMessages.some((item) => item !== void 0);
6924
6934
  const styles = {
6925
- input: `text-p-md pl-2 peer shadow-input border border-[0.5px] rounded-lg outline-none block pb-[10px] h-[46px] w-full disabled:bg-neutral-100 focus-visible:border-1 focus-visible:border-blue-500 ${label ? "pt-[22px]" : "pt-[10px]"}
6935
+ 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:border-1 focus-visible:border-blue-500 ${label ? "pt-[22px]" : "pt-[10px]"}
6926
6936
  ${!hasError ? "border-neutral-300" : ""}`,
6927
6937
  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"}`,
6928
6938
  rightIcon: "absolute h-[44px] top-[1px] right-[1.5px] w-[38px] text-[22px]",