@lets-events/react 12.5.1 → 12.6.1

package/dist/index.js

@@ -1882,7 +1882,21 @@ function Button(_a) {
         return "md";
     }
   }, [size]);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ButtonStyled, __spreadProps(__spreadValues({ as: Component }, props), { disabled: disabled || loading, children: loading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SpinningDiv, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: "circle-notch", size: spinnerSize }) }) : children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ButtonStyled, __spreadProps(__spreadValues({ as: Component }, props), { disabled: disabled || loading, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { position: "relative" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { visibility: loading ? "hidden" : void 0 }, children }),
+    loading && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "div",
+      {
+        style: {
+          position: "absolute",
+          top: "50%",
+          left: "50%",
+          transform: "translate(-50%, -50%)"
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SpinningDiv, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: "circle-notch", size: spinnerSize }) })
+      }
+    )
+  ] }) }));
 }
 
 // src/components/ButtonGroup.tsx
@@ -9942,9 +9956,7 @@ var MultiSelect = import_react18.default.forwardRef(
                 value: selectedValues,
                 onValueChange: (v) => {
                   onValueChange == null ? void 0 : onValueChange(v);
-                  if (allOptionsSelected) {
-                    setAllOptionsSelected(false);
-                  }
+                  setAllOptionsSelected((v || []).length === options.length);
                 },
                 children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
                   StyledFlexWithMaxHeight,
@@ -9994,7 +10006,38 @@ var MultiSelect = import_react18.default.forwardRef(
           align: selectedOrientation === "column" ? "start" : "center",
           justify: "start",
           css: __spreadValues({}, selectedScroll && { maxHeight: maxHeight || "400px" }),
-          children: selectedValues.map((value) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+          children: allOptionsSelected ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+            Flex2,
+            {
+              gap: 4,
+              align: "center",
+              css: { flexWrap: "wrap" },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                  CloseBtnStyled,
+                  {
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      onValueChange == null ? void 0 : onValueChange([]);
+                      setAllOptionsSelected(false);
+                    },
+                    type: "button",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_fontawesome3.FontAwesomeIcon, { icon: import_free_solid_svg_icons3.faSquareXmark, size: "sm" })
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                  Text,
+                  {
+                    typography: "captionMedium",
+                    fontWeight: "regular",
+                    color: "dark600",
+                    children: "Todos selecionados"
+                  }
+                )
+              ]
+            },
+            "all-selected"
+          ) : selectedValues.map((value) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
             Flex2,
             {
               gap: 4,
@@ -10245,6 +10288,8 @@ var ErrorFormMessage = ({ message: message2 }) => {
 };
 
 // src/components/FormFields/subComponents/FormLabel.tsx
+var import_react_fontawesome5 = require("@fortawesome/react-fontawesome");
+var import_free_solid_svg_icons5 = require("@fortawesome/free-solid-svg-icons");
 var import_jsx_runtime32 = require("react/jsx-runtime");
 var FormLabel = ({
   name,
@@ -10253,19 +10298,19 @@ var FormLabel = ({
   required
 }) => {
   if (!label) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
-    Text,
-    {
-      typography: "labelMedium",
-      fontWeight: "medium",
-      color: haveError ? "error600" : "dark700",
-      id: `${name}-label`,
-      children: [
-        label,
-        !required && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Text, { color: "dark500", children: " (opcional)" })
-      ]
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(Flex2, { align: "start", gap: 6, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      Text,
+      {
+        typography: "labelMedium",
+        fontWeight: "medium",
+        color: haveError ? "error600" : "dark700",
+        id: `${name}-label`,
+        children: label
+      }
+    ),
+    required && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_fontawesome5.FontAwesomeIcon, { icon: import_free_solid_svg_icons5.faAsterisk, fontSize: "8px", color: "#AD1F2B" })
+  ] });
 };
 
 // src/components/FormFields/TextAreaFormField.tsx
@@ -11230,10 +11275,7 @@ var RadioGroupFormField = ({
             color: haveError ? "error" : color,
             fontWeight,
             disabled,
-            children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("label", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(RadioItem, { value: option.value }),
-              option.label
-            ] }, option.value))
+            children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Flex2, { direction: "column", children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(RadioItem, { value: option.value, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Text, { typography: "labelSmall", children: option.label }) }, option.value)) })
           }
         )
       }