nexaas-ui-components 1.0.73 → 1.0.77

package/dist/index.js

@@ -92,7 +92,7 @@ var variants = {
     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"
   },
   successOutline: {
-    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"
+    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"
   },
   warn: {
     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"
@@ -160,7 +160,7 @@ var Button = ({
   useEffect(() => {
     if (!hotkey || !props.onClick) return;
     const handleKeyDown = (event) => {
-      var _a;
+      var _a, _b;
       if (props.disabled || props.loading) return;
       const keys = hotkey.toLowerCase().split("+").map((k) => k.trim());
       const primaryKey = keys.pop();
@@ -169,10 +169,17 @@ var Button = ({
       const requiredAlt = keys.includes("alt");
       const requiredShift = keys.includes("shift");
       const requiredMeta = keys.includes("meta") || keys.includes("cmd");
-      const match = event.key.toLowerCase() === primaryKey && event.ctrlKey === requiredCtrl && event.altKey === requiredAlt && event.shiftKey === requiredShift && event.metaKey === requiredMeta;
+      const keyAliases = {
+        esc: "escape",
+        del: "delete",
+        space: " ",
+        spacebar: " "
+      };
+      const normalizedPrimary = (_a = keyAliases[primaryKey]) != null ? _a : primaryKey;
+      const match = event.key.toLowerCase() === normalizedPrimary && event.ctrlKey === requiredCtrl && event.altKey === requiredAlt && event.shiftKey === requiredShift && event.metaKey === requiredMeta;
       if (match) {
         event.preventDefault();
-        (_a = props.onClick) == null ? void 0 : _a.call(props, event);
+        (_b = props.onClick) == null ? void 0 : _b.call(props, event);
       }
     };
     window.addEventListener("keydown", handleKeyDown);
@@ -462,7 +469,7 @@ var Input = ({
   const hasError = fieldValidationMessages.some((item) => item !== void 0);
   const [showPassword, setShowPassword] = React5__default.useState(false);
   const styles = {
-    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]"}
+    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]"}
       ${!hasError ? "border-neutral-300" : ""}`,
     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`,
     rightIcon: "absolute h-[44px] top-[1px] right-[1.5px] w-[38px] text-[22px]",
@@ -1202,7 +1209,8 @@ var FilterCalendar = ({
   defaultShortcut,
   shortcutsChange,
   singleMonth = false,
-  maxDate = void 0
+  maxDate = void 0,
+  labelClassName
 }) => {
   const style = {
     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",
@@ -1210,7 +1218,6 @@ var FilterCalendar = ({
     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"
   };
   const [currentValue, setCurrentValue] = useState([]);
-  const [calendarLabel, setCalendarLabel] = useState("");
   const isMobileSize = (window == null ? void 0 : window.innerWidth) < 768;
   const shorcuts = [
     {
@@ -1374,6 +1381,9 @@ var FilterCalendar = ({
   const [selectedShortcut, setSelectedShortcut] = useState(
     defaultShortcut || shorcuts[0]
   );
+  const [calendarLabel, setCalendarLabel] = useState(
+    defaultShortcut != null && shorcuts[defaultShortcut] ? shorcuts[defaultShortcut].label : ""
+  );
   const calendar = /* @__PURE__ */ jsx("div", { id: "group-input-calendar", className: "relative", children: rangeCalendar ? /* @__PURE__ */ jsx(
     DateRangePicker3,
     {
@@ -1439,7 +1449,7 @@ var FilterCalendar = ({
       control,
       render: ({ field }) => {
         var _a;
-        let hasValue = ((_a = field == null ? void 0 : field.value) == null ? void 0 : _a.length) > 0;
+        let hasValue = ((_a = field == null ? void 0 : field.value) == null ? void 0 : _a.length) > 0 || !!calendarLabel && calendarLabel !== shorcuts[0].label;
         return /* @__PURE__ */ jsx(
           Popover,
           {
@@ -1466,9 +1476,9 @@ var FilterCalendar = ({
                         "div",
                         {
                           className: clsx9({
-                            ["text-label group-active:text-blue-500"]: !field.value && !open,
-                            ["text-blue-500"]: open && !field.value,
-                            ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
+                            ["text-label group-active:text-blue-500"]: !hasValue && !open,
+                            ["text-blue-500"]: open && !hasValue,
+                            ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && hasValue || !open && hasValue
                           }),
                           children: icon
                         }
@@ -1478,9 +1488,9 @@ var FilterCalendar = ({
                         {
                           className: clsx9(
                             {
-                              ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
-                              ["text-blue-500"]: open && !field.value,
-                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
+                              [`${labelClassName != null ? labelClassName : "text-paragraph"} group-active:text-blue-500`]: !hasValue && !open,
+                              ["text-blue-500"]: open && !hasValue,
+                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && hasValue || !open && hasValue
                             },
                             "truncate cursor-pointer"
                           ),
@@ -1494,9 +1504,9 @@ var FilterCalendar = ({
                         {
                           className: clsx9(
                             {
-                              ["text-label group-active:text-blue-500"]: !field.value && !open,
-                              ["text-blue-500"]: open && !field.value,
-                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && field.value
+                              ["text-label group-active:text-blue-500"]: !hasValue && !open,
+                              ["text-blue-500"]: open && !hasValue,
+                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: open && hasValue || !open && hasValue
                             },
                             "uil uil-angle-down text-[18px]"
                           )
@@ -1588,7 +1598,7 @@ function InputSmall({
 }) {
   const inputRef = useRef(null);
   const styles = {
-    input: `text-p-md text-paragraph w-full outline-none placeholder:text-label`,
+    input: `text-p-md text-paragraph w-full outline-none placeholder:text-label disabled:text-disabled disabled:cursor-not-allowed bg-transparent`,
     icon: "text-label group-focus-within:text-neutral-600 m-[10px]",
     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}`,
     clear: "pr-[5px] cursor-pointer text-label text-[16px]"
@@ -1663,7 +1673,13 @@ var FilterOptions = ({
   initialMessage,
   applyOnClick = false,
   showFilter = false,
-  renderOption
+  renderOption,
+  searchPlaceholder = "Pesquisar",
+  panelClassName = "p-2",
+  applyLabel = "Aplicar",
+  cancelLabel = "Cancelar",
+  clearLabel = "Limpar",
+  selectAllLabel = "Marcar todos"
 }) => {
   const style = {
     filter: "rounded-3xl shadow-input bg-surface hover:bg-neutral-50 border border-[0.5px] border-neutral-200 active:text-blue-500 active:bg-blue-100 active:border-blue-500",
@@ -1755,9 +1771,10 @@ var FilterOptions = ({
                 {
                   className: clsx9(
                     {
-                      ["font-semibold text-accent-label"]: isSelected
+                      ["font-semibold text-accent-label"]: isSelected,
+                      ["text-label"]: !isSelected
                     },
-                    "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-label text-p-sm block"
+                    "w-[200px] whitespace-nowrap text-ellipsis overflow-hidden text-p-sm block"
                   ),
                   children: option == null ? void 0 : option.description
                 }
@@ -1788,226 +1805,242 @@ var FilterOptions = ({
             children: ({ open }) => {
               var _a2, _b2;
               return /* @__PURE__ */ jsxs(Float, { composable: true, shift: 8, zIndex: 99, offset: 6, children: [
-                /* @__PURE__ */ jsx(Float.Reference, { children: /* @__PURE__ */ jsx(PopoverButton, { as: "button", children: /* @__PURE__ */ jsxs(
-                  "div",
+                /* @__PURE__ */ jsx(Float.Reference, { children: /* @__PURE__ */ jsx(
+                  PopoverButton,
                   {
-                    className: clsx9(
+                    as: "button",
+                    className: "rounded-3xl outline-none focus:outline-none focus-visible:ring-[1.5px] focus-visible:ring-blue-500 focus-visible:ring-offset-[2px]",
+                    children: /* @__PURE__ */ jsxs(
+                      "div",
                       {
-                        [style.filter]: !hasValue && !open,
-                        [style.filterOpen]: open && !hasValue,
-                        [style.filterActive]: open && hasValue || !open && hasValue
-                      },
-                      `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`
-                    ),
-                    children: [
-                      icon && /* @__PURE__ */ jsx(
-                        "div",
-                        {
-                          className: clsx9({
-                            ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
-                            ["text-blue-500"]: open && !field.value,
-                            ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
-                          }),
-                          children: icon
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        "label",
-                        {
-                          className: clsx9(
+                        className: clsx9(
+                          {
+                            [style.filter]: !hasValue && !open,
+                            [style.filterOpen]: open && !hasValue,
+                            [style.filterActive]: open && hasValue || !open && hasValue
+                          },
+                          `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`
+                        ),
+                        children: [
+                          icon && /* @__PURE__ */ jsx(
+                            "div",
                             {
-                              ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
-                              ["text-blue-500"]: open && !field.value,
-                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
-                            },
-                            "truncate cursor-pointer"
+                              className: clsx9({
+                                ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
+                                ["text-blue-500"]: open && !hasValue,
+                                ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
+                              }),
+                              children: icon
+                            }
                           ),
-                          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
-                        }
-                      ),
-                      isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-blue-500 text-accent-label text-p-xs px-1 py-[2px] rounded group-hover:bg-blue-500", children: field.value.length }),
-                      open ? /* @__PURE__ */ jsx(
-                        "i",
-                        {
-                          className: clsx9(
+                          /* @__PURE__ */ jsx(
+                            "label",
                             {
-                              ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
-                              ["text-blue-500"]: open && !field.value,
-                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
-                            },
-                            "uil uil-angle-up text-[18px]"
-                          )
-                        }
-                      ) : /* @__PURE__ */ jsx(
-                        "i",
-                        {
-                          className: clsx9(
+                              className: clsx9(
+                                {
+                                  ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
+                                  ["text-blue-500"]: open && !hasValue,
+                                  ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
+                                },
+                                "truncate cursor-pointer"
+                              ),
+                              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
+                            }
+                          ),
+                          isMulti && field.value && field.value.length > 0 && /* @__PURE__ */ jsx("div", { className: "bg-blue-500 text-accent-label text-p-xs px-1 py-[2px] rounded group-hover:bg-blue-500", children: field.value.length }),
+                          open ? /* @__PURE__ */ jsx(
+                            "i",
                             {
-                              ["text-paragraph group-active:text-blue-500"]: !field.value && !open,
-                              ["text-blue-500"]: open && !field.value,
-                              ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: field.value
-                            },
-                            "uil uil-angle-down text-[18px]"
+                              className: clsx9(
+                                {
+                                  ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
+                                  ["text-blue-500"]: open && !hasValue,
+                                  ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
+                                },
+                                "uil uil-angle-up text-[18px]"
+                              )
+                            }
+                          ) : /* @__PURE__ */ jsx(
+                            "i",
+                            {
+                              className: clsx9(
+                                {
+                                  ["text-paragraph group-active:text-blue-500"]: !hasValue && !open,
+                                  ["text-blue-500"]: open && !hasValue,
+                                  ["text-blue-500 group-hover:text-accent-label group-active:text-accent-label"]: hasValue
+                                },
+                                "uil uil-angle-down text-[18px]"
+                              )
+                            }
                           )
-                        }
-                      )
-                    ]
+                        ]
+                      }
+                    )
                   }
-                ) }) }),
-                open && /* @__PURE__ */ jsx(Float.Content, { children: /* @__PURE__ */ jsx(PopoverPanel, { className: "p-2 whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-200", children: ({ close }) => {
-                  const onClose = () => {
-                    setCurrentValue(field.value);
-                    close();
-                  };
-                  useEffect(() => {
-                    setCurrentValue(field.value);
-                  }, [open]);
-                  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-                    /* @__PURE__ */ jsx(
-                      Listbox,
-                      {
-                        value: currentValue || [],
-                        onChange: setCurrentValue,
-                        multiple: isMulti,
-                        children: /* @__PURE__ */ jsxs(
-                          ListboxOptions,
+                ) }),
+                open && /* @__PURE__ */ jsx(Float.Content, { children: /* @__PURE__ */ jsx(
+                  PopoverPanel,
+                  {
+                    className: clsx9(
+                      "whitespace-nowrap bg-surface rounded-lg shadow-dropdown border-[0.5px] border-neutral-200",
+                      panelClassName
+                    ),
+                    children: ({ close }) => {
+                      const onClose = () => {
+                        setCurrentValue(field.value);
+                        close();
+                      };
+                      useEffect(() => {
+                        setCurrentValue(field.value);
+                      }, [open]);
+                      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+                        /* @__PURE__ */ jsx(
+                          Listbox,
                           {
-                            static: true,
-                            className: clsx9(
-                              "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
+                            value: currentValue || [],
+                            onChange: setCurrentValue,
+                            multiple: isMulti,
+                            children: /* @__PURE__ */ jsxs(
+                              ListboxOptions,
                               {
-                                "pr-2": options.some(
-                                  (option) => option.description
-                                ) ? options.length > 3 : options.length > 4
-                              }
-                            ),
-                            children: [
-                              /* @__PURE__ */ jsxs("div", { className: "mr-1 sticky top-0 z-30", children: [
-                                showFilter && /* @__PURE__ */ jsx(
-                                  InputSmall,
+                                static: true,
+                                className: clsx9(
+                                  "max-h-60 w-full overflow-x-hidden overflow-y-auto bg-surface text-p-md focus:outline-none sm:text-sm relative",
                                   {
-                                    icon: /* @__PURE__ */ jsx("i", { className: "uil uil-search" }),
-                                    onChange: (e) => setFilter(e),
-                                    value: filter,
-                                    placeholder: "Pesquisar",
-                                    clearField: true,
-                                    onKeyDown: (e) => {
-                                      if (e.key === " " || e.code === "Space") {
-                                        e.stopPropagation();
-                                      }
-                                    }
+                                    "pr-2": options.some(
+                                      (option) => option.description
+                                    ) ? options.length > 3 : options.length > 4
                                   }
                                 ),
-                                subFilters && fetch && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
-                                  const active = (item == null ? void 0 : item.id) === subFilter;
-                                  return /* @__PURE__ */ jsx(
-                                    "button",
-                                    {
-                                      className: clsx9(
+                                children: [
+                                  /* @__PURE__ */ jsxs("div", { className: "mr-1 sticky top-0 z-30", children: [
+                                    showFilter && /* @__PURE__ */ jsx(
+                                      InputSmall,
+                                      {
+                                        icon: /* @__PURE__ */ jsx("i", { className: "uil uil-search" }),
+                                        onChange: (e) => setFilter(e),
+                                        value: filter,
+                                        placeholder: searchPlaceholder,
+                                        clearField: true,
+                                        onKeyDown: (e) => {
+                                          if (e.key === " " || e.code === "Space") {
+                                            e.stopPropagation();
+                                          }
+                                        }
+                                      }
+                                    ),
+                                    subFilters && fetch && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 pt-2 bg-surface", children: subFilters.map((item, index) => {
+                                      const active = (item == null ? void 0 : item.id) === subFilter;
+                                      return /* @__PURE__ */ jsx(
+                                        "button",
                                         {
-                                          ["bg-blue-500 text-accent-label"]: active,
-                                          ["text-paragraph"]: !active
+                                          className: clsx9(
+                                            {
+                                              ["bg-blue-500 text-accent-label"]: active,
+                                              ["text-paragraph"]: !active
+                                            },
+                                            `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
+                                          ),
+                                          onClick: () => {
+                                            if (subFilter == item.id) {
+                                              setSubFilter(null);
+                                            } else {
+                                              setSubFilter(item.id);
+                                            }
+                                          },
+                                          children: item.name
                                         },
-                                        `rounded-[20px] border-[0.5px] border-neutral-200 px-4 py-[6px]`
-                                      ),
-                                      onClick: () => {
-                                        if (subFilter == item.id) {
-                                          setSubFilter(null);
-                                        } else {
-                                          setSubFilter(item.id);
-                                        }
-                                      },
-                                      children: item.name
-                                    },
-                                    index
-                                  );
-                                }) })
-                              ] }),
-                              loading && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 w-full my-4", children: [
-                                /* @__PURE__ */ jsx(SpinnerIcon, { className: "animate-spin w-[16px] h-[16px]" }),
-                                "Carregando"
-                              ] }),
-                              (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) > 0 && !loading && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: emptyMessage }) }),
-                              initialMessage && (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) === 0 && !loading && (options == null ? void 0 : options.length) === 0 && !(currentValue == null ? void 0 : currentValue.id) && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: initialMessage }) }),
-                              initialMessage && currentValue && (currentValue == null ? void 0 : currentValue.id) && (filter == null ? void 0 : filter.length) === 0 && /* @__PURE__ */ jsx("div", { className: "py-2", children: isMulti ? /* @__PURE__ */ jsx(Fragment, { children: currentValue == null ? void 0 : currentValue.map((option) => {
-                                let isSelected = isMulti ? currentValue && (currentValue == null ? void 0 : currentValue.length) > 0 && (currentValue == null ? void 0 : currentValue.some(
-                                  (e) => e.id === option.id
-                                )) : currentValue && (currentValue == null ? void 0 : currentValue.id) === option.id;
-                                return optionStyle(
-                                  options,
-                                  isSelected
-                                );
-                              }) }) : optionStyle(field.value, true) }),
-                              !loading && (data == null ? void 0 : data.map((option) => {
-                                let isSelected = isMulti ? currentValue && currentValue.length > 0 && currentValue.some(
-                                  (e) => e.id === option.id
-                                ) : currentValue && currentValue.id === option.id;
-                                return optionStyle(option, isSelected);
-                              }))
-                            ]
+                                        index
+                                      );
+                                    }) })
+                                  ] }),
+                                  loading && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 w-full my-4", children: [
+                                    /* @__PURE__ */ jsx(SpinnerIcon, { className: "animate-spin w-[16px] h-[16px]" }),
+                                    "Carregando"
+                                  ] }),
+                                  (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) > 0 && !loading && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: emptyMessage }) }),
+                                  initialMessage && (data == null ? void 0 : data.length) === 0 && (filter == null ? void 0 : filter.length) === 0 && !loading && (options == null ? void 0 : options.length) === 0 && !(currentValue == null ? void 0 : currentValue.id) && /* @__PURE__ */ jsx("div", { className: "py-4", children: /* @__PURE__ */ jsx("span", { className: "text-label text-p-md", children: initialMessage }) }),
+                                  initialMessage && currentValue && (currentValue == null ? void 0 : currentValue.id) && (filter == null ? void 0 : filter.length) === 0 && /* @__PURE__ */ jsx("div", { className: "py-2", children: isMulti ? /* @__PURE__ */ jsx(Fragment, { children: currentValue == null ? void 0 : currentValue.map((option) => {
+                                    let isSelected = isMulti ? currentValue && (currentValue == null ? void 0 : currentValue.length) > 0 && (currentValue == null ? void 0 : currentValue.some(
+                                      (e) => e.id === option.id
+                                    )) : currentValue && (currentValue == null ? void 0 : currentValue.id) === option.id;
+                                    return optionStyle(
+                                      options,
+                                      isSelected
+                                    );
+                                  }) }) : optionStyle(field.value, true) }),
+                                  !loading && (data == null ? void 0 : data.map((option) => {
+                                    let isSelected = isMulti ? currentValue && currentValue.length > 0 && currentValue.some(
+                                      (e) => e.id === option.id
+                                    ) : currentValue && currentValue.id === option.id;
+                                    return optionStyle(option, isSelected);
+                                  }))
+                                ]
+                              }
+                            )
                           }
-                        )
-                      }
-                    ),
-                    !applyOnClick && /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center justify-end border-t border-t-neutral-200 pt-3", children: [
-                      isMulti && onSelectAll && /* @__PURE__ */ jsx("div", { className: "border-r pr-2 border-neutral-300", children: /* @__PURE__ */ jsx(
-                        Button,
-                        {
-                          variant: "link",
-                          size: "xxs",
-                          onClick: () => {
-                            onSelectAll();
-                            field.onChange(options);
-                            setCurrentValue(options);
-                            close();
-                          },
-                          children: "Marcar todos"
-                        }
-                      ) }),
-                      onClear && /* @__PURE__ */ jsx("div", { className: "mr-1", children: /* @__PURE__ */ jsx(
-                        Button,
-                        {
-                          variant: "link",
-                          size: "xxs",
-                          onClick: () => {
-                            if (onClear) {
-                              onClear();
-                              setCurrentValue([]);
-                              field.onChange([]);
+                        ),
+                        !applyOnClick && /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center justify-end border-t border-t-neutral-200 pt-3", children: [
+                          isMulti && onSelectAll && /* @__PURE__ */ jsx("div", { className: "border-r pr-2 border-neutral-300", children: /* @__PURE__ */ jsx(
+                            Button,
+                            {
+                              variant: "link",
+                              size: "xxs",
+                              onClick: () => {
+                                onSelectAll();
+                                field.onChange(options);
+                                setCurrentValue(options);
+                                close();
+                              },
+                              children: selectAllLabel
                             }
-                            close();
-                          },
-                          children: "Limpar"
-                        }
-                      ) }),
-                      /* @__PURE__ */ jsx(
-                        Button,
-                        {
-                          size: "xs",
-                          variant: "secondary",
-                          onClick: () => {
-                            onClose();
-                          },
-                          children: "Cancelar"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        Button,
-                        {
-                          size: "xs",
-                          variant: "primary",
-                          disabled: JSON.stringify(currentValue) === JSON.stringify(field == null ? void 0 : field.value),
-                          onClick: () => {
-                            field.onChange(currentValue);
-                            if (onApply) onApply();
-                            close();
-                          },
-                          children: "Aplicar"
-                        }
-                      )
-                    ] })
-                  ] });
-                } }) })
+                          ) }),
+                          onClear && /* @__PURE__ */ jsx("div", { className: "mr-1", children: /* @__PURE__ */ jsx(
+                            Button,
+                            {
+                              variant: "link",
+                              size: "xxs",
+                              onClick: () => {
+                                if (onClear) {
+                                  onClear();
+                                  setCurrentValue([]);
+                                  field.onChange([]);
+                                }
+                                close();
+                              },
+                              children: clearLabel
+                            }
+                          ) }),
+                          /* @__PURE__ */ jsx(
+                            Button,
+                            {
+                              size: "xs",
+                              variant: "secondary",
+                              onClick: () => {
+                                onClose();
+                              },
+                              children: cancelLabel
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(
+                            Button,
+                            {
+                              size: "xs",
+                              variant: "primary",
+                              disabled: JSON.stringify(currentValue) === JSON.stringify(field == null ? void 0 : field.value),
+                              onClick: () => {
+                                field.onChange(currentValue);
+                                if (onApply) onApply();
+                                close();
+                              },
+                              children: applyLabel
+                            }
+                          )
+                        ] })
+                      ] });
+                    }
+                  }
+                ) })
               ] });
             }
           }
@@ -3603,7 +3636,7 @@ var Radio = ({
               "input",
               {
                 name,
-                id: name,
+                id: `${name}-${value}`,
                 type: "radio",
                 className: "",
                 onClick: (e) => {
@@ -3617,7 +3650,7 @@ var Radio = ({
             ),
             /* @__PURE__ */ jsx("span", {})
           ] }),
-          label && /* @__PURE__ */ jsx("label", { htmlFor: name, className: "text-p-md cursor-pointer -pt-1", children: label })
+          label && /* @__PURE__ */ jsx("label", { htmlFor: `${name}-${value}`, className: "text-p-md cursor-pointer -pt-1", children: label })
         ] });
       }
     }
@@ -6687,7 +6720,7 @@ var Tabs = ({
               {
                 disabled: tab == null ? void 0 : tab.disabled,
                 className: ({ selected }) => clsx9(
-                  "group inline-flex rounded-t-lg font-bold text-p-md border border-neutral-200 px-6 py-3 z-20",
+                  "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]",
                   {
                     "text-rose-700 border-b-0 bg-surface shadow-tabs": selected,
                     "bg-neutral-100 text-rose-700 opacity-80 shadow-tabDisabled": !selected && !tab.disabled,