@fluidattacks/design 3.8.15-pr → 3.8.15

package/dist/{components-Dvdp27ry.mjs → components-kSHn3dSW.mjs}

@@ -338,7 +338,7 @@ const ne = (e) => ({
   ), g = D(
     "gap",
     e.gap === void 0 ? void 0 : I.spacing[e.gap]
-  ), u = D("background-color", e.bgColor), h = D("background", e.bgGradient), y = D("flex-direction", e.flexDirection), x = D("flex-grow", e.flexGrow), m = D("justify-content", e.justify), w = D("justify-self", e.justifySelf), v = D("align-items", e.alignItems), N = D("align-self", e.alignSelf), z = D("flex-wrap", e.wrap);
+  ), u = D("background-color", e.bgColor), h = D("background", e.bgGradient), x = D("flex-direction", e.flexDirection), y = D("flex-grow", e.flexGrow), m = D("justify-content", e.justify), w = D("justify-self", e.justifySelf), v = D("align-items", e.alignItems), N = D("align-self", e.alignSelf), z = D("flex-wrap", e.wrap);
   return `
     ${t}
     ${i}
@@ -353,8 +353,8 @@ const ne = (e) => ({
     ${u}
     ${h}
     ${g}
-    ${y}
     ${x}
+    ${y}
     ${m}
     ${w}
     ${v}
@@ -593,8 +593,8 @@ const ne = (e) => ({
   size: g,
   sizeMd: u,
   sizeSm: h,
-  textFill: y,
-  wordBreak: x,
+  textFill: x,
+  wordBreak: y,
   ...m
 }, w) {
   return /* @__PURE__ */ n(
@@ -611,8 +611,8 @@ const ne = (e) => ({
       $size: g,
       $sizeMd: u,
       $sizeSm: h,
-      $textFill: y,
-      $wordBreak: x,
+      $textFill: x,
+      $wordBreak: y,
       className: a,
       ref: w,
       ...m,
@@ -633,7 +633,7 @@ const ne = (e) => ({
   sizeMd: g,
   sizeSm: u,
   ...h
-}, y) {
+}, x) {
   return /* @__PURE__ */ n(
     Ni,
     {
@@ -648,7 +648,7 @@ const ne = (e) => ({
       $size: d,
       $sizeMd: g,
       $sizeSm: u,
-      ref: y,
+      ref: x,
       ...h,
       children: t
     }
@@ -667,8 +667,8 @@ const ne = (e) => ({
   size: g,
   sizeMd: u,
   sizeSm: h,
-  textFill: y,
-  wordBreak: x,
+  textFill: x,
+  wordBreak: y,
   ...m
 }, w) {
   return /* @__PURE__ */ n(
@@ -685,8 +685,8 @@ const ne = (e) => ({
       $size: g,
       $sizeMd: u,
       $sizeSm: h,
-      $textFill: y,
-      $wordBreak: x,
+      $textFill: x,
+      $wordBreak: y,
       className: a,
       ref: w,
       ...m,
@@ -780,8 +780,8 @@ const S = V(function({
   onClick: g,
   rotation: u,
   spanClass: h,
-  secondaryColor: y,
-  ...x
+  secondaryColor: x,
+  ...y
 }, m) {
   return /* @__PURE__ */ n(
     Fi,
@@ -791,13 +791,13 @@ const S = V(function({
       $disabled: i,
       $hoverColor: a,
       $rotation: u,
-      $secondaryColor: y,
+      $secondaryColor: x,
       $size: c,
       className: h,
       "data-testid": `${r}-icon`,
       onClick: g,
       ref: m,
-      ...x,
+      ...y,
       children: /* @__PURE__ */ n(
         "i",
         {
@@ -1117,8 +1117,8 @@ const S = V(function({
   place: g = "bottom",
   tip: u = "",
   title: h = "",
-  hide: y = u === "" && h === "" && d === void 0,
-  ...x
+  hide: x = u === "" && h === "" && d === void 0,
+  ...y
 }, m) {
   const w = j(), [v, N] = F(!1), z = A(null), T = k(() => {
     z.current !== null && clearTimeout(z.current), z.current = setTimeout(() => {
@@ -1138,7 +1138,7 @@ const S = V(function({
       onMouseMove: T,
       ref: m,
       role: "tooltip",
-      ...x,
+      ...y,
       children: [
         o ? /* @__PURE__ */ n(
           S,
@@ -1159,7 +1159,7 @@ const S = V(function({
               disableStyleInjection: "core",
               float: r === "float" ? !0 : void 0,
               globalCloseEvents: { resize: !0 },
-              hidden: y || !v,
+              hidden: x || !v,
               id: c,
               middlewares: [
                 un({
@@ -1216,8 +1216,8 @@ const S = V(function({
   px: g,
   py: u,
   type: h = "button",
-  tooltip: y,
-  tooltipPlace: x,
+  tooltip: x,
+  tooltipPlace: y,
   value: m,
   variant: w = "primary",
   ...v
@@ -1253,7 +1253,7 @@ const S = V(function({
       )
     }
   ), E = (h + (w ?? "") + (c ?? a)).replace(/ /u, "_");
-  return y === void 0 ? z : /* @__PURE__ */ n(ie, { id: `${E}-tooltip`, place: x, tip: y, children: z });
+  return x === void 0 ? z : /* @__PURE__ */ n(ie, { id: `${E}-tooltip`, place: y, tip: x, children: z });
 }), $l = V(function({
   autoHide: t = !1,
   children: i,
@@ -1269,11 +1269,11 @@ const S = V(function({
     u(!1);
   }, []);
   return U(() => {
-    const y = setTimeout(() => {
+    const x = setTimeout(() => {
       r == null || r(!0), t && h();
     }, l * 1e3);
     return () => {
-      clearTimeout(y);
+      clearTimeout(x);
     };
   }, [t, h, l, r]), U(() => {
     u(o);
@@ -1615,7 +1615,7 @@ const S = V(function({
   tagLabel: u,
   variant: h = "default"
 }) => {
-  const y = u.length > 25 && P.isEmpty(g + o), x = `${u.slice(0, 25)}...`;
+  const x = u.length > 25 && P.isEmpty(g + o), y = `${u.slice(0, 25)}...`;
   return /* @__PURE__ */ f(
     Ee,
     {
@@ -1635,7 +1635,7 @@ const S = V(function({
           ),
           /* @__PURE__ */ f("span", { children: [
             /* @__PURE__ */ n("strong", { children: g }),
-            /* @__PURE__ */ n("span", { children: y ? x : u }),
+            /* @__PURE__ */ n("span", { children: x ? y : u }),
             /* @__PURE__ */ n("strong", { children: o })
           ] }),
           p ? /* @__PURE__ */ n(
@@ -1678,8 +1678,8 @@ const S = V(function({
   type: g = "button",
   tooltip: u,
   tooltipPlace: h = "bottom",
-  underline: y = !1,
-  value: x,
+  underline: x = !1,
+  value: y,
   variant: m = "primary",
   ...w
 }, v) {
@@ -1698,14 +1698,14 @@ const S = V(function({
         {
           $variant: m,
           "aria-disabled": i,
-          className: y ? "underline" : void 0,
+          className: x ? "underline" : void 0,
           disabled: i,
           id: o,
           name: s,
           onClick: m === "link" ? T : c,
           ref: v,
           type: g,
-          value: x,
+          value: y,
           ...N ? { "data-tooltip-id": z } : {},
           ...w,
           children: [
@@ -1899,10 +1899,10 @@ const S = V(function({
   headerType: d = "image",
   showMaximize: g = !0
 }) => {
-  const u = j(), [h, y] = F(!1), x = k(() => {
-    y(!0);
+  const u = j(), [h, x] = F(!1), y = k(() => {
+    x(!0);
   }, []), m = k(() => {
-    y(!1);
+    x(!1);
   }, []);
   return /* @__PURE__ */ f(
     $,
@@ -1914,7 +1914,7 @@ const S = V(function({
       display: "flex",
       flexDirection: "column",
       gap: 1,
-      onHover: x,
+      onHover: y,
       onLeave: m,
       padding: [0.5, 0.5, 0.5, 0.5],
       width: "100%",
@@ -2169,14 +2169,14 @@ const S = V(function({
   helpText: r,
   htmlFor: o,
   label: l,
-  linkPosition: s,
+  linkPosition: s = "down",
   maxLength: c,
   required: p,
   tooltip: d,
   value: g,
   weight: u
 }) => {
-  const h = j(), y = g ? g.length : 0;
+  const h = j(), x = g ? g.length : 0;
   return /* @__PURE__ */ f(Ji, { children: [
     l === void 0 ? void 0 : /* @__PURE__ */ n(
       Ht,
@@ -2212,7 +2212,7 @@ const S = V(function({
             oe,
             {
               priority: "low",
-              tagLabel: `${y}/${c}`,
+              tagLabel: `${x}/${c}`,
               variant: "error"
             }
           )
@@ -2374,12 +2374,12 @@ const S = V(function({
   onChange: g,
   placeholder: u,
   required: h,
-  tooltip: y,
-  value: x,
+  tooltip: x,
+  value: y,
   weight: m
 }) => {
   var Xe;
-  const w = j(), v = t ? void 0 : i, N = (e == null ? void 0 : e.value) ?? x, [z, T] = F(
+  const w = j(), v = t ? void 0 : i, N = (e == null ? void 0 : e.value) ?? y, [z, T] = F(
     ((Xe = p.find((R) => R.value === N)) == null ? void 0 : Xe.name) ?? ""
   ), [E, O] = F(N), [B, _] = F(p), [L, W] = F(!1), { contains: Y } = yn({ sensitivity: "base" }), J = A(null), se = A(null), We = A(null), Ke = A(null), Ye = A(null), Qt = Z(() => p.map(
     (R) => Y(R.name, z) || L ? /* @__PURE__ */ n(xn, { children: R.name }, R.value) : null
@@ -2457,7 +2457,7 @@ const S = V(function({
       htmlFor: c,
       label: l,
       required: h,
-      tooltip: y,
+      tooltip: x,
       weight: m,
       children: [
         /* @__PURE__ */ f(
@@ -2534,8 +2534,8 @@ const S = V(function({
   onChange: g,
   placeholder: u,
   required: h,
-  tooltip: y,
-  value: x,
+  tooltip: x,
+  value: y,
   weight: m
 }) => e ? /* @__PURE__ */ n(
   It,
@@ -2559,8 +2559,8 @@ const S = V(function({
         onChange: g,
         placeholder: u,
         required: h,
-        tooltip: y,
-        value: x,
+        tooltip: x,
+        value: y,
         weight: m
       }
     ),
@@ -2582,8 +2582,8 @@ const S = V(function({
     onChange: g,
     placeholder: u,
     required: h,
-    tooltip: y,
-    value: x,
+    tooltip: x,
+    value: y,
     weight: m
   }
 ), na = b.div`
@@ -3134,12 +3134,12 @@ const S = V(function({
   watch: g,
   ...u
 }) => {
-  const h = A(null), y = g == null ? void 0 : g(s), x = jt({
+  const h = A(null), x = g == null ? void 0 : g(s), y = jt({
     ...u,
-    value: H.isNil(y) || H.isEmpty(y) || y === "-" ? null : Ln(y.replace(/\//gu, "-"))
-  }), { close: m } = x, { groupProps: w, fieldProps: v, buttonProps: N, dialogProps: z, calendarProps: T } = Dt(
+    value: H.isNil(x) || H.isEmpty(x) || x === "-" ? null : Ln(x.replace(/\//gu, "-"))
+  }), { close: m } = y, { groupProps: w, fieldProps: v, buttonProps: N, dialogProps: z, calendarProps: T } = Dt(
     { ...u, "aria-label": l ?? s, name: s },
-    x,
+    y,
     h
   ), E = k(
     (O) => {
@@ -3172,15 +3172,15 @@ const S = V(function({
             register: c,
             required: o,
             setValue: p,
-            value: y
+            value: x
           }
         ),
-        x.isOpen && !e ? /* @__PURE__ */ n(
+        y.isOpen && !e ? /* @__PURE__ */ n(
           je,
           {
             offset: 8,
             placement: "bottom start",
-            state: x,
+            state: y,
             triggerRef: h,
             children: /* @__PURE__ */ n(Ue, { ...z, children: /* @__PURE__ */ n(
               ua,
@@ -3239,8 +3239,8 @@ const S = V(function({
   ...c
 }) => {
   const p = `${a}Max`, d = `${a}Min`, g = A(null), u = An(c), { close: h } = u, {
-    groupProps: y,
-    startFieldProps: x,
+    groupProps: x,
+    startFieldProps: y,
     endFieldProps: m,
     buttonProps: w,
     dialogProps: v,
@@ -3279,11 +3279,11 @@ const S = V(function({
                   disabled: e,
                   error: t,
                   fieldProps: {
-                    ...x,
-                    "aria-label": `${x["aria-label"]} ${a}`,
+                    ...y,
+                    "aria-label": `${y["aria-label"]} ${a}`,
                     validate: (T) => m.value && T > m.value ? "Start date must be less than or equal to end date" : null
                   },
-                  groupProps: y,
+                  groupProps: x,
                   name: d,
                   register: l,
                   setValue: s
@@ -3299,9 +3299,9 @@ const S = V(function({
                   fieldProps: {
                     ...m,
                     "aria-label": `${m["aria-label"]} ${a}`,
-                    validate: (T) => x.value && T < x.value ? "End date must be greater than or equal to start date" : null
+                    validate: (T) => y.value && T < y.value ? "End date must be greater than or equal to start date" : null
                   },
-                  groupProps: y,
+                  groupProps: x,
                   name: p,
                   register: l,
                   setValue: s
@@ -3395,7 +3395,7 @@ const S = V(function({
     isRequired: a,
     shouldCloseOnSelect: !1,
     value: H.isNil(d) || H.isEmpty(d) || d === "-" ? null : Rn(d.replace(/\//gu, "-"))
-  }), { close: h } = u, { groupProps: y, fieldProps: x, buttonProps: m, dialogProps: w, calendarProps: v } = Dt(e, u, g), N = k(
+  }), { close: h } = u, { groupProps: x, fieldProps: y, buttonProps: m, dialogProps: w, calendarProps: v } = Dt(e, u, g), N = k(
     (T) => {
       v.onChange && v.onChange(T), c == null || c(
         o,
@@ -3425,9 +3425,9 @@ const S = V(function({
             datePickerRef: g,
             disabled: t,
             error: i,
-            fieldProps: x,
+            fieldProps: y,
             granularity: "minute",
-            groupProps: y,
+            groupProps: x,
             name: o,
             register: s,
             setValue: c,
@@ -3486,8 +3486,8 @@ const S = V(function({
   maskValue: g = !1,
   onPaste: u,
   placeholder: h,
-  register: y,
-  tooltip: x,
+  register: x,
+  tooltip: y,
   type: m = "text",
   weight: w,
   ...v
@@ -3509,7 +3509,7 @@ const S = V(function({
       label: c,
       linkPosition: p,
       required: N,
-      tooltip: x,
+      tooltip: y,
       weight: w,
       children: /* @__PURE__ */ f(
         ae,
@@ -3535,7 +3535,7 @@ const S = V(function({
                 onPaste: u,
                 placeholder: h,
                 type: m,
-                ...y ? y(d, { required: N, onBlur: z, onChange: T }) : { ...v }
+                ...x ? x(d, { required: N, onBlur: z, onChange: T }) : { ...v }
               }
             ),
             O ? /* @__PURE__ */ n(
@@ -3595,10 +3595,10 @@ const S = V(function({
   register: g,
   setValue: u,
   tooltip: h,
-  watch: y,
-  weight: x
+  watch: x,
+  weight: y
 }) => {
-  const m = j(), w = t ? void 0 : i, v = A(null), N = y == null ? void 0 : y(c), z = za(N), T = g == null ? void 0 : g(c, { required: d }), E = k(() => {
+  const m = j(), w = t ? void 0 : i, v = A(null), N = x == null ? void 0 : x(c), z = za(N), T = g == null ? void 0 : g(c, { required: d }), E = k(() => {
     const _ = Me("change", c, void 0);
     u && u(c, ""), T && T.onChange(_);
   }, [T, c, u]), O = k(
@@ -3629,7 +3629,7 @@ const S = V(function({
       label: a,
       required: d,
       tooltip: h,
-      weight: x,
+      weight: y,
       children: [
         /* @__PURE__ */ f(
           ae,
@@ -3726,9 +3726,9 @@ const S = V(function({
   required: g,
   tooltip: u,
   value: h,
-  weight: y
+  weight: x
 }) => {
-  const x = j(), m = e ? void 0 : t, [w, v] = F(""), N = c ? h : i == null ? void 0 : i.value, z = Z(() => N && typeof N == "string" ? N.split(",").filter(Boolean) : [], [N]), T = k(
+  const y = j(), m = e ? void 0 : t, [w, v] = F(""), N = c ? h : i == null ? void 0 : i.value, z = Z(() => N && typeof N == "string" ? N.split(",").filter(Boolean) : [], [N]), T = k(
     (L) => {
       const Y = [...new Set(L.filter(Boolean))].join(","), J = Me("change", s, Y);
       i && i.onChange(J), c && c(J);
@@ -3768,7 +3768,7 @@ const S = V(function({
       label: l,
       required: g,
       tooltip: u,
-      weight: y,
+      weight: x,
       children: /* @__PURE__ */ f(
         ae,
         {
@@ -3807,7 +3807,7 @@ const S = V(function({
               {
                 icon: "exclamation-circle",
                 iconClass: "error-icon",
-                iconColor: x.palette.error[500],
+                iconColor: y.palette.error[500],
                 iconSize: "xs"
               }
             ) : void 0
@@ -3831,18 +3831,18 @@ const S = V(function({
   required: g,
   tooltip: u,
   value: h,
-  weight: y
+  weight: x
 }) => t ? /* @__PURE__ */ n(
   It,
   {
     control: t,
     name: s,
-    render: ({ field: x }) => /* @__PURE__ */ n(
+    render: ({ field: y }) => /* @__PURE__ */ n(
       pt,
       {
         disabled: e,
         error: i,
-        field: x,
+        field: y,
         helpLink: a,
         helpLinkText: r,
         helpText: o,
@@ -3852,7 +3852,7 @@ const S = V(function({
         placeholder: d,
         required: g,
         tooltip: u,
-        weight: y
+        weight: x
       }
     ),
     rules: { required: g }
@@ -3873,7 +3873,7 @@ const S = V(function({
     required: g,
     tooltip: u,
     value: h,
-    weight: y
+    weight: x
   }
 ), gt = V(function({ disabled: t, icon: i, margin: a, onClick: r, ...o }, l) {
   return /* @__PURE__ */ n(
@@ -3914,7 +3914,7 @@ const S = V(function({
   setValue: u,
   value: h
 }) => {
-  const y = j(), x = i ? void 0 : e, m = Z(
+  const x = j(), y = i ? void 0 : e, m = Z(
     () => t < 0 ? 0 : t,
     [t]
   ), w = Z(() => h === void 0 ? 0 : H.toNumber(h), [h]), v = k(() => {
@@ -3944,13 +3944,13 @@ const S = V(function({
   return /* @__PURE__ */ f(
     ae,
     {
-      className: `${i ? "disabled" : ""} ${x ? "error" : ""}`,
+      className: `${i ? "disabled" : ""} ${y ? "error" : ""}`,
       children: [
         /* @__PURE__ */ n(
           "input",
           {
             "aria-hidden": !1,
-            "aria-invalid": x ? "true" : "false",
+            "aria-invalid": y ? "true" : "false",
             "aria-label": s,
             "aria-required": g,
             autoComplete: "off",
@@ -3972,12 +3972,12 @@ const S = V(function({
             })
           }
         ),
-        x && /* @__PURE__ */ n(
+        y && /* @__PURE__ */ n(
           S,
           {
             icon: "exclamation-circle",
             iconClass: "error-icon",
-            iconColor: y.palette.error[500],
+            iconColor: x.palette.error[500],
             iconSize: "xs"
           }
         ),
@@ -3997,7 +3997,7 @@ const S = V(function({
         /* @__PURE__ */ n(
           gt,
           {
-            borderRadius: `0 ${y.spacing[0.5]} ${y.spacing[0.5]} 0`,
+            borderRadius: `0 ${x.spacing[0.5]} ${x.spacing[0.5]} 0`,
             disabled: i,
             icon: "plus",
             onClick: N,
@@ -4023,8 +4023,8 @@ const S = V(function({
   name: g,
   onChange: u,
   placeholder: h,
-  register: y,
-  required: x,
+  register: x,
+  required: y,
   setValue: m,
   tooltip: w,
   value: v,
@@ -4040,7 +4040,7 @@ const S = V(function({
     label: l,
     linkPosition: s,
     maxLength: c,
-    required: x,
+    required: y,
     tooltip: w,
     weight: z,
     children: /* @__PURE__ */ n(
@@ -4056,8 +4056,8 @@ const S = V(function({
         name: g,
         onChange: u,
         placeholder: h,
-        register: y,
-        required: x,
+        register: x,
+        required: y,
         setValue: m,
         value: u ? v : N == null ? void 0 : N(g)
       }
@@ -4222,7 +4222,7 @@ const S = V(function({
   value: c,
   weight: p
 }) => {
-  const d = j(), g = A(null), u = e ? void 0 : t, [h, y] = F(!1), [x, m] = F(""), { refs: w, floatingStyles: v } = Ft({
+  const d = j(), g = A(null), u = e ? void 0 : t, [h, x] = F(!1), [y, m] = F(""), { refs: w, floatingStyles: v } = Ft({
     placement: "bottom-start",
     whileElementsMounted: Hn
   }), { inputValue: N, handlePhoneValueChange: z, country: T, setCountry: E } = Bn({
@@ -4231,12 +4231,12 @@ const S = V(function({
     forceDialCode: !0,
     value: c ? String(c) : void 0
   }), O = k(() => {
-    y((W) => !W), h || m("");
+    x((W) => !W), h || m("");
   }, [h]), B = k(
     (W) => () => {
-      E(W), y(!1), m("");
+      E(W), x(!1), m("");
     },
-    [E, y]
+    [E, x]
   ), _ = k(
     (W) => {
       W.key.length === 1 ? m((Y) => Y + W.key) : W.key === "Backspace" && m((Y) => Y.slice(0, -1));
@@ -4244,12 +4244,12 @@ const S = V(function({
     []
   ), L = Qe.filter((W) => {
     const { name: Y } = tt(W);
-    return Y.toLowerCase().includes(x.toLowerCase());
+    return Y.toLowerCase().includes(y.toLowerCase());
   });
   return le(
     w.floating.current,
     () => {
-      y(!1), m("");
+      x(!1), m("");
     },
     !0
   ), /* @__PURE__ */ n(
@@ -4377,8 +4377,8 @@ const S = V(function({
   placeholder: g,
   register: u,
   required: h,
-  rows: y,
-  tooltip: x,
+  rows: x,
+  tooltip: y,
   watch: m,
   weight: w
 }) => {
@@ -4393,7 +4393,7 @@ const S = V(function({
       label: l,
       maxLength: d,
       required: h,
-      tooltip: x,
+      tooltip: y,
       value: N ? String(N) : void 0,
       weight: w,
       children: /* @__PURE__ */ f(
@@ -4416,7 +4416,7 @@ const S = V(function({
                 id: c ?? s,
                 maxLength: d,
                 placeholder: g,
-                rows: y,
+                rows: x,
                 ...u == null ? void 0 : u(s, { required: h })
               }
             ),
@@ -4462,14 +4462,14 @@ const S = V(function({
       return /* @__PURE__ */ n(Gt, { disabled: t, name: c, placeholder: p });
     if (r === "date")
       return /* @__PURE__ */ n(ya, { disabled: t, name: c });
-    const { decimalPlaces: h, max: y, min: x } = o ?? {};
+    const { decimalPlaces: h, max: x, min: y } = o ?? {};
     return /* @__PURE__ */ n(
       Ta,
       {
         decimalPlaces: h,
         disabled: t,
-        max: y,
-        min: x,
+        max: x,
+        min: y,
         name: c,
         placeholder: p
       }
@@ -4727,11 +4727,11 @@ const S = V(function({
     [t]
   ), [o, l] = F(r), s = k(
     (d) => {
-      const g = d.filter(({ locked: x }) => !x), h = [...d.filter(({ locked: x }) => x), ...g], y = h.map(({ name: x }) => x);
-      l((x) => [
+      const g = d.filter(({ locked: y }) => !y), h = [...d.filter(({ locked: y }) => y), ...g], x = h.map(({ name: y }) => y);
+      l((y) => [
         ...h,
-        ...x.filter(({ name: m }) => !y.includes(m))
-      ]), a && a(h.map(({ id: x }) => x));
+        ...y.filter(({ name: m }) => !x.includes(m))
+      ]), a && a(h.map(({ id: y }) => y));
     },
     [a]
   ), c = k(() => {
@@ -4743,8 +4743,8 @@ const S = V(function({
         visible: u
       };
     }).toSorted((g, u) => {
-      const h = (i == null ? void 0 : i.indexOf(g.id)) ?? 0, y = (i == null ? void 0 : i.indexOf(u.id)) ?? 0;
-      return Number(u.visible) !== Number(g.visible) ? Number(u.visible) - Number(g.visible) : h - y;
+      const h = (i == null ? void 0 : i.indexOf(g.id)) ?? 0, x = (i == null ? void 0 : i.indexOf(u.id)) ?? 0;
+      return Number(u.visible) !== Number(g.visible) ? Number(u.visible) - Number(g.visible) : h - x;
     });
     l(d), a == null || a(i);
   }, [o, i, a]), p = Z(() => Vn(o, (d) => ((i == null ? void 0 : i.includes(d.id)) ?? !1) !== d.visible), [o, i]);
@@ -5881,10 +5881,10 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
   value: d,
   ...g
 }) => {
-  const h = j().palette.gray[t ? 300 : 800], y = t ? vt.map(e, (x) => Ct(x) ? dn(x, {
+  const h = j().palette.gray[t ? 300 : 800], x = t ? vt.map(e, (y) => Ct(y) ? dn(y, {
     disabled: t,
-    ...x.props
-  }) : x) : e;
+    ...y.props
+  }) : y) : e;
   return /* @__PURE__ */ f(
     br,
     {
@@ -5908,7 +5908,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
               iconType: a
             }
           ) : null,
-          r === void 0 ? y : /* @__PURE__ */ n(re, { href: r, children: y })
+          r === void 0 ? x : /* @__PURE__ */ n(re, { href: r, children: x })
         ] }) : null,
         p || c ? /* @__PURE__ */ n(
           S,
@@ -6049,9 +6049,23 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     outline: none;
     width: 100%;
 
+    &:-webkit-autofill {
+      -webkit-background-clip: text;
+    }
+
     &::placeholder {
       color: ${e.palette.gray[400]};
     }
+
+    &:is(:hover, :focus)::-webkit-search-cancel-button {
+      display:none;
+    }
+
+    ::-webkit-search-decoration,
+    ::-webkit-search-results-button,
+    ::-webkit-search-results-decoration {
+      display:none;
+    }
   `}
 `, kr = b.div`
   ${({ theme: e }) => `
@@ -6079,28 +6093,34 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     border-radius: ${e.spacing[0.5]};
     width: 250px;
   `}
-`, xe = V(function({ name: t, smallSearch: i = !1, value: a, ...r }, o) {
-  const l = j(), [s, c] = F(!1), { refs: p, floatingStyles: d } = Ft(), g = k(() => {
-    c((y) => !y);
-  }, []), u = k(
+`, xe = V(function({
+  name: t,
+  smallSearch: i = !1,
+  onClear: a,
+  value: r,
+  ...o
+}, l) {
+  const s = j(), [c, p] = F(!1), { refs: d, floatingStyles: g } = Ft(), u = k(() => {
+    p((y) => !y);
+  }, []), h = k(
     (y) => {
       y.key === "Enter" && y.preventDefault();
     },
     []
   );
   le(
-    p.floating.current,
+    d.floating.current,
     () => {
-      c(!1);
+      p(!1);
     },
     !0
   );
-  const h = /* @__PURE__ */ f(kr, { children: [
+  const x = /* @__PURE__ */ f(kr, { children: [
     /* @__PURE__ */ n(
       S,
       {
         icon: "magnifying-glass",
-        iconColor: l.palette.gray[700],
+        iconColor: s.palette.gray[700],
         iconSize: "xs",
         iconType: "fa-light"
       }
@@ -6108,21 +6128,23 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     /* @__PURE__ */ n(
       wr,
       {
-        ...r,
+        ...o,
         id: t,
         name: t,
-        onKeyDown: u,
-        ref: o,
-        value: a
+        onKeyDown: h,
+        ref: l,
+        type: "search",
+        value: r
       }
     ),
-    !P.isEmpty(a) && /* @__PURE__ */ n(
+    !P.isEmpty(r) && /* @__PURE__ */ n(
       K,
       {
         icon: "xmark",
-        iconColor: l.palette.gray[300],
+        iconColor: s.palette.gray[300],
         iconSize: "xs",
         iconType: "fa-light",
+        onClick: a,
         px: 0.25,
         py: 0.25,
         type: "reset",
@@ -6134,17 +6156,17 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     /* @__PURE__ */ n(
       K,
       {
-        border: `1px solid ${l.palette.gray[300]} !important`,
+        border: `1px solid ${s.palette.gray[300]} !important`,
         icon: "magnifying-glass",
         iconSize: "xs",
         iconType: "fa-light",
-        onClick: g,
-        ref: p.setReference,
+        onClick: u,
+        ref: d.setReference,
         variant: "ghost"
       }
     ),
-    s ? /* @__PURE__ */ n(vr, { ref: p.setFloating, style: d, children: h }) : void 0
-  ] }) : h;
+    c ? /* @__PURE__ */ n(vr, { ref: d.setFloating, style: g, children: x }) : void 0
+  ] }) : x;
 }), Cr = ({
   columns: e,
   formId: t,
@@ -6179,7 +6201,15 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       py: 1.25,
       width: "55%",
       children: [
-        /* @__PURE__ */ n("form", { id: "search-form", ref: r, children: /* @__PURE__ */ n(xe, { name: "search", onChange: p, type: "search" }) }),
+        /* @__PURE__ */ n("form", { id: "search-form", ref: r, children: /* @__PURE__ */ n(
+          xe,
+          {
+            name: "search",
+            onChange: p,
+            onClear: d,
+            value: s
+          }
+        ) }),
         /* @__PURE__ */ n(
           "form",
           {
@@ -6193,7 +6223,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
             },
             children: Object.entries(qt(o)).map(
               ([g, u], h) => {
-                const y = `li-checkbox${g}`;
+                const x = `li-checkbox${g}`;
                 return /* @__PURE__ */ n(
                   Pa,
                   {
@@ -6203,7 +6233,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
                     options: u,
                     title: g
                   },
-                  y
+                  x
                 );
               }
             )
@@ -6212,7 +6242,15 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       ]
     }
   ) : /* @__PURE__ */ f($, { height: "100%", py: 1.25, width: "55%", children: [
-    /* @__PURE__ */ n("form", { id: "search-form", ref: r, children: /* @__PURE__ */ n(xe, { name: "search", onChange: p, type: "search" }) }),
+    /* @__PURE__ */ n("form", { id: "search-form", ref: r, children: /* @__PURE__ */ n(
+      xe,
+      {
+        name: "search",
+        onChange: p,
+        onClear: d,
+        value: s
+      }
+    ) }),
     /* @__PURE__ */ n(
       "form",
       {
@@ -6256,18 +6294,18 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
 }) => {
   const r = j(), o = A(null), [l, s] = F(void 0), c = k(
     (g) => {
-      const { checked: u, value: h } = g.target, y = i.columns.map((x) => {
+      const { checked: u, value: h } = g.target, x = i.columns.map((y) => {
         var m;
-        return x.name === h ? ((m = x.toggleVisibility) == null || m.call(x, u), { ...x, visible: u }) : x;
+        return y.name === h ? ((m = y.toggleVisibility) == null || m.call(y, u), { ...y, visible: u }) : y;
       });
-      i.setColumns(y);
+      i.setColumns(x);
     },
     [i]
   ), p = k(
     (g) => {
       const u = i.columns.map((h) => {
-        var y;
-        return h.id === g ? ((y = h.toggleVisibility) == null || y.call(h, !1), { ...h, visible: !1 }) : h;
+        var x;
+        return h.id === g ? ((x = h.toggleVisibility) == null || x.call(h, !1), { ...h, visible: !1 }) : h;
       });
       i.setColumns(u);
     },
@@ -6412,9 +6450,9 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       const { value: h } = u.target;
       o(
         e.filter(
-          (y) => {
-            var x;
-            return ((x = y.label) == null ? void 0 : x.toLowerCase().includes(h.toLowerCase())) ?? y.value.toLowerCase().includes(h.toLowerCase());
+          (x) => {
+            var y;
+            return ((y = x.label) == null ? void 0 : y.toLowerCase().includes(h.toLowerCase())) ?? x.value.toLowerCase().includes(h.toLowerCase());
           }
         )
       );
@@ -6467,39 +6505,39 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
   onApplyFilters: i
 }) => {
   const a = j(), [r, o] = F(e), [l, s] = F([]), [c, p] = F({}), [d, g] = F(""), u = k(
-    (x) => () => {
-      const m = r.find((w) => w.label === x);
-      g(x), s((m == null ? void 0 : m.filterOptions) ?? []);
+    (y) => () => {
+      const m = r.find((w) => w.label === y);
+      g(y), s((m == null ? void 0 : m.filterOptions) ?? []);
     },
     [r]
   ), h = k(
-    (x) => {
+    (y) => {
       p(
-        (v) => x.length > 0 ? { ...v, [d]: x } : v
+        (v) => y.length > 0 ? { ...v, [d]: y } : v
       );
       const m = (v) => ({
         ...v,
-        checked: x.includes(v.value)
+        checked: y.includes(v.value)
       }), w = (v) => v.label === d ? {
         ...v,
         filterOptions: v.filterOptions.map(m)
       } : v;
-      o((v) => v.map(w)), i({ [d]: x }), s([]);
+      o((v) => v.map(w)), i({ [d]: y }), s([]);
     },
     [i, d]
-  ), y = k(
-    (x, m) => {
-      const w = `li-filter-option-${x}`;
+  ), x = k(
+    (y, m) => {
+      const w = `li-filter-option-${y}`;
       return /* @__PURE__ */ f(
         Sr,
         {
           icon: m,
-          onClick: u(x),
+          onClick: u(y),
           value: w,
           width: "100%",
           children: [
-            x,
-            c[x] === void 0 ? void 0 : /* @__PURE__ */ n(oe, { tagLabel: c[x].length.toString() })
+            y,
+            c[y] === void 0 ? void 0 : /* @__PURE__ */ n(oe, { tagLabel: c[y].length.toString() })
           ]
         },
         w
@@ -6508,7 +6546,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     [c, u]
   );
   return U(() => {
-    const x = e.reduce(
+    const y = e.reduce(
       (m, { label: w, filterOptions: v }) => {
         const N = v.filter(({ checked: z = !1 }) => z).map(({ value: z }) => z);
         return N.length === 0 ? m : {
@@ -6518,15 +6556,15 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       },
       {}
     );
-    p(x);
+    p(y);
   }, [e]), t === "grouped" ? /* @__PURE__ */ f($, { flexGrow: 1, position: "relative", zIndex: 80, children: [
     Object.entries(qt(e)).map(
-      ([x, m]) => /* @__PURE__ */ f($, { width: "100%", children: [
-        /* @__PURE__ */ n(C, { color: a.palette.gray[400], mb: 0.25, size: "sm", children: x }),
+      ([y, m]) => /* @__PURE__ */ f($, { width: "100%", children: [
+        /* @__PURE__ */ n(C, { color: a.palette.gray[400], mb: 0.25, size: "sm", children: y }),
         m.map(
-          ({ label: w, icon: v = "filter-list" }) => y(w, v)
+          ({ label: w, icon: v = "filter-list" }) => x(w, v)
         )
-      ] }, x)
+      ] }, y)
     ),
     /* @__PURE__ */ n(
       ut,
@@ -6539,7 +6577,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     )
   ] }) : /* @__PURE__ */ f($, { flexGrow: 1, children: [
     e.map(
-      ({ label: x, icon: m = "filter-list" }) => y(x, m)
+      ({ label: y, icon: m = "filter-list" }) => x(y, m)
     ),
     /* @__PURE__ */ n(
       ut,
@@ -6685,7 +6723,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
   size: u,
   id: h = "modal-container"
 }) => {
-  const y = () => /* @__PURE__ */ n(
+  const x = () => /* @__PURE__ */ n(
     ue,
     {
       "aria-label": s.name,
@@ -6730,9 +6768,9 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     }
   );
   return e && s.isOpen ? Q(
-    y(),
+    x(),
     document.getElementById("portals") ?? document.body
-  ) : s.isOpen ? y() : null;
+  ) : s.isOpen ? x() : null;
 }, Rl = () => {
   const [e, t] = F(!1), [i, a] = F(), r = A(null), o = Ut("confirm-dialog-modal"), l = k(
     async (d) => (a(d), t(!0), new Promise((g) => {
@@ -7030,7 +7068,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
   tagPosition: d = "top",
   title: g
 }) => {
-  const u = j(), h = s == null ? void 0 : s.split("-"), y = l === "dark", x = /* @__PURE__ */ f(jr, { "data-testid": `content-card-${g}`, children: [
+  const u = j(), h = s == null ? void 0 : s.split("-"), x = l === "dark", y = /* @__PURE__ */ f(jr, { "data-testid": `content-card-${g}`, children: [
     o || a || p && d === "top" ? /* @__PURE__ */ f($, { id: "card-image", position: "relative", children: [
       o && /* @__PURE__ */ n(ee, { publicId: o }),
       d === "top" && /* @__PURE__ */ n(ht, { tag: p, tagPosition: d }),
@@ -7050,7 +7088,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
             e && h && /* @__PURE__ */ n(
               C,
               {
-                color: u.palette.gray[y ? 300 : 400],
+                color: u.palette.gray[x ? 300 : 400],
                 fontWeight: "semibold",
                 size: "sm",
                 sizeSm: "xs",
@@ -7070,7 +7108,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
                     S,
                     {
                       icon: "eye",
-                      iconColor: u.palette.gray[y ? 300 : 400],
+                      iconColor: u.palette.gray[x ? 300 : 400],
                       iconSize: "xs",
                       iconType: "fa-light"
                     }
@@ -7078,7 +7116,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
                   /* @__PURE__ */ n(
                     C,
                     {
-                      color: u.palette.gray[y ? 300 : 400],
+                      color: u.palette.gray[x ? 300 : 400],
                       size: "sm",
                       sizeSm: "xs",
                       textAlign: "right",
@@ -7093,7 +7131,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
             G,
             {
               className: `title-${l}`,
-              color: y ? u.palette.white : u.palette.gray[800],
+              color: x ? u.palette.white : u.palette.gray[800],
               fontWeight: "semibold",
               size: "sm",
               sizeSm: "xs",
@@ -7103,7 +7141,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
           i && /* @__PURE__ */ n(
             C,
             {
-              color: u.palette.gray[y ? 100 : 600],
+              color: u.palette.gray[x ? 100 : 600],
               size: "md",
               sizeSm: "sm",
               children: i
@@ -7121,9 +7159,9 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       href: r,
       rel: "noopener noreferrer",
       target: "_self",
-      children: x
+      children: y
     }
-  ) : x;
+  ) : y;
 }, Bl = ({
   description: e,
   items: t,
@@ -7310,8 +7348,8 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     mode: r ?? "all",
     resolver: d ? qn(d) : void 0
   }), {
-    control: y,
-    getValues: x,
+    control: x,
+    getValues: y,
     setValue: m,
     register: w,
     watch: v,
@@ -7321,13 +7359,13 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     if (B && Ct(B)) {
       const L = B.props.children, W = B.props.name ? Ze(B.type, {
         ...B.props,
-        control: y,
+        control: x,
         error: (_ = N[B.props.name]) == null ? void 0 : _.message,
         isValid: z,
         isTouched: T[B.props.name],
         register: w,
         setValue: m,
-        value: x(B.props.name),
+        value: y(B.props.name),
         watch: v,
         key: B.props.name
       }) : B;
@@ -7509,7 +7547,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       );
     },
     [d]
-  ), y = k(
+  ), x = k(
     (m) => {
       m.currentTarget && (u(m.currentTarget.value), h(m.currentTarget.value));
     },
@@ -7565,7 +7603,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
                 ]
               }
             ),
-            /* @__PURE__ */ n($, { mt: 1, children: /* @__PURE__ */ n(xe, { onInput: y, placeholder: "Search" }) }),
+            /* @__PURE__ */ n($, { mt: 1, children: /* @__PURE__ */ n(xe, { onInput: x, placeholder: "Search" }) }),
             /* @__PURE__ */ n(de, { mb: 1, mt: 1 }),
             /* @__PURE__ */ f(
               $,
@@ -8711,13 +8749,13 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
   tooltipMessage: c,
   ...p
 }, d) {
-  const g = i < 0 ? 0 : i, [u, h] = F(Number(a).toFixed(g)), y = k(
+  const g = i < 0 ? 0 : i, [u, h] = F(Number(a).toFixed(g)), x = k(
     (w) => {
       const v = P.toNumber(w.target.value);
       w.target.value.endsWith(".") ? h(w.target.value) : v >= Number(o) && v <= Number(r) && (h(String(v)), t && s(P.toNumber(v.toFixed(g)))), w.stopPropagation();
     },
     [t, g, r, o, s]
-  ), x = k(
+  ), y = k(
     (w) => {
       w.currentTarget.contains(w.relatedTarget) || h(Number(a).toFixed(g)), w.stopPropagation();
     },
@@ -8728,7 +8766,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
     },
     [s]
   );
-  return /* @__PURE__ */ n(fo, { onBlur: x, tabIndex: -1, children: /* @__PURE__ */ n(ie, { id: "numberInputTooltip", tip: c, children: /* @__PURE__ */ n(
+  return /* @__PURE__ */ n(fo, { onBlur: y, tabIndex: -1, children: /* @__PURE__ */ n(ie, { id: "numberInputTooltip", tip: c, children: /* @__PURE__ */ n(
     ho,
     {
       ...p,
@@ -8739,7 +8777,7 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
       max: r,
       min: o,
       name: l,
-      onChange: y,
+      onChange: x,
       onKeyUp: m,
       ref: d,
       step: 10 ** -g,
@@ -8835,9 +8873,9 @@ ${h[8]}...` : (h.length < 8 && c(!1), t);
   ), g = k(() => {
     c((h) => !h);
   }, [c]), u = k(
-    (h) => (y) => {
-      var x;
-      (x = o[h]) == null || x.onClick(y), c(!1);
+    (h) => (x) => {
+      var y;
+      (y = o[h]) == null || y.onClick(x), c(!1);
     },
     [o]
   );
@@ -9117,7 +9155,7 @@ const xo = {
   title: d,
   titleColor: g
 }) => {
-  const u = j(), { alt: h, src: y, width: x = "77px", height: m = "77px" } = c, w = k(() => {
+  const u = j(), { alt: h, src: x, width: y = "77px", height: m = "77px" } = c, w = k(() => {
     t == null || t.onClick();
   }, [t]), v = k(() => {
     r == null || r.onClick();
@@ -9166,8 +9204,8 @@ const xo = {
                     {
                       alt: h,
                       height: m,
-                      publicId: y,
-                      width: x
+                      publicId: x,
+                      width: y
                     }
                   ) }),
                   /* @__PURE__ */ f(
@@ -9812,12 +9850,12 @@ const xo = {
     g("");
   }, [g]), h = k(() => {
     s(!0);
-  }, []), y = k(
+  }, []), x = k(
     (w) => {
       g(w.currentTarget.value);
     },
     [g]
-  ), x = k(
+  ), y = k(
     (w) => {
       w.preventDefault(), w.stopPropagation(), u(), p.current && p.current.focus();
     },
@@ -9840,7 +9878,7 @@ const xo = {
       {
         action: "",
         noValidate: !0,
-        onReset: x,
+        onReset: y,
         onSubmit: m,
         role: "search",
         children: [
@@ -9860,7 +9898,7 @@ const xo = {
                 autoComplete: "off",
                 autoCorrect: "off",
                 maxLength: 512,
-                onChange: y,
+                onChange: x,
                 onFocus: h,
                 placeholder: t,
                 ref: p,
@@ -10300,8 +10338,8 @@ const xo = {
                 (a ?? []).map(
                   ({
                     customBadge: h,
-                    description: y,
-                    icon: x,
+                    description: x,
+                    icon: y,
                     onClick: m,
                     requiresUpgrade: w,
                     title: v
@@ -10309,8 +10347,8 @@ const xo = {
                     Bo,
                     {
                       customBadge: h,
-                      description: y,
-                      icon: x,
+                      description: x,
+                      icon: y,
                       onClick: u(m),
                       requiresUpgrade: w,
                       title: v
@@ -10448,8 +10486,8 @@ const xo = {
   const t = j(), i = A(null), { label: a, minValue: r = 0, maxValue: o = 100, name: l, setValue: s, watch: c } = e, p = ii(), d = ai({
     ...e,
     numberFormatter: p,
-    onChange(y) {
-      s == null || s(l, y);
+    onChange(x) {
+      s == null || s(l, x);
     },
     value: c == null ? void 0 : c(l)
   }), g = Ko(r, o, d.getThumbValue(0)), { groupProps: u, trackProps: h } = ri(
@@ -10590,9 +10628,9 @@ const xo = {
     []
   );
   return /* @__PURE__ */ n(qo, { children: r.map((c, p) => {
-    const { content: d, title: g, nextAction: u, previousAction: h } = c, y = p + 1, x = y === o ? "current" : "disabled", m = y < o ? "completed" : x;
+    const { content: d, title: g, nextAction: u, previousAction: h } = c, x = p + 1, y = x === o ? "current" : "disabled", m = x < o ? "completed" : y;
     return /* @__PURE__ */ f(Xo, { children: [
-      /* @__PURE__ */ n($, { maxWidth: "40px", position: "relative", children: /* @__PURE__ */ n(Jo, { $variant: m, children: m === "completed" ? /* @__PURE__ */ n(S, { icon: "check", iconSize: "xs", iconType: "fa-solid" }) : y }) }),
+      /* @__PURE__ */ n($, { maxWidth: "40px", position: "relative", children: /* @__PURE__ */ n(Jo, { $variant: m, children: m === "completed" ? /* @__PURE__ */ n(S, { icon: "check", iconSize: "xs", iconType: "fa-solid" }) : x }) }),
       /* @__PURE__ */ f($, { ml: 1.5, width: "100%", children: [
         /* @__PURE__ */ n(
           G,