@fluidattacks/design 3.27.4 → 3.27.5-pr.1

package/dist/{components-BHKNL3Nv.mjs → components-DKgQGDm9.mjs}

@@ -1278,7 +1278,7 @@ const j = Z(function({
               {
                 color: m.palette.white,
                 fontWeight: "bold",
-                lineSpacing: 1.5,
+                lineSpacing: 1.125,
                 mb: 0.25,
                 size: "xs",
                 textAlign: "start",
@@ -1290,7 +1290,7 @@ const j = Z(function({
               F,
               {
                 color: m.palette.gray[100],
-                lineSpacing: 1.5,
+                lineSpacing: 1.125,
                 size: "xs",
                 textAlign: "start",
                 whiteSpace: "normal",
@@ -2379,7 +2379,7 @@ const j = Z(function({
 `, Rr = x.div`
   width: fit-content;
   border: ${({ theme: e }) => `1px solid ${e.palette.gray[300]}`};
-  border-radius: ${({ theme: e }) => e.spacing[0.5]};
+  border-radius: 4px;
   background: none;
   color: ${({ theme: e }) => e.palette.black};
   font-family: ${({ theme: e }) => e.typography.type.primary};
@@ -4714,87 +4714,7 @@ const j = Z(function({
     value: h,
     weight: y
   }
-), yo = x.div`
-  width: fit-content;
-  border: ${({ theme: e }) => `1px solid ${e.palette.gray[300]}`};
-  border-radius: 4px;
-  background: none;
-  color: ${({ theme: e }) => e.palette.black};
-  font-family: ${({ theme: e }) => e.typography.type.primary};
-  font-size: ${({ theme: e }) => e.typography.text.md};
-  height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0.5em;
-`, bo = x.input`
-  width: 4em;
-  appearance: textfield;
-  border-style: none;
-  padding: 0.5rem;
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-  padding-left: 0.5rem;
-  background: none;
-
-  &:focus {
-    border-color: unset;
-    box-shadow: none;
-    outline: none;
-  }
-
-  &::-webkit-outer-spin-button,
-  &::-webkit-inner-spin-button {
-    opacity: 1;
-  }
-`, $o = Z(function({
-  autoUpdate: t = !1,
-  decimalPlaces: n = 0,
-  defaultValue: r = 0,
-  max: o,
-  min: a,
-  name: s,
-  onEnter: l,
-  tooltipMessage: c,
-  ...d
-}, p) {
-  const g = n < 0 ? 0 : n, [u, h] = R(Number(r).toFixed(g)), y = w(
-    (k) => {
-      const v = H.toNumber(k.target.value);
-      k.target.value.endsWith(".") ? h(k.target.value) : v >= Number(a) && v <= Number(o) && (h(String(v)), t && l(H.toNumber(v.toFixed(g)))), k.stopPropagation();
-    },
-    [t, g, o, a, l]
-  ), m = w(
-    (k) => {
-      k.currentTarget.contains(k.relatedTarget) || h(Number(r).toFixed(g)), k.stopPropagation();
-    },
-    [g, r]
-  ), b = w(
-    (k) => {
-      k.stopPropagation(), k.key === "Enter" && !H.isEmpty(k.currentTarget.value) && l(H.toNumber(k.currentTarget.value));
-    },
-    [l]
-  );
-  return /* @__PURE__ */ i(yo, { onBlur: m, tabIndex: -1, children: /* @__PURE__ */ i(J, { id: "numberInputTooltip", tip: c, children: /* @__PURE__ */ i(
-    bo,
-    {
-      ...d,
-      "aria-label": s,
-      "aria-valuemax": Number(o),
-      "aria-valuemin": Number(a),
-      "aria-valuenow": Number(u),
-      max: o,
-      min: a,
-      name: s,
-      onChange: y,
-      onKeyUp: b,
-      ref: p,
-      step: 10 ** -g,
-      type: "number",
-      value: u
-    }
-  ) }) });
-}), Lt = Z(function({ disabled: t, icon: n, margin: r, onClick: o, ...a }, s) {
+), Lt = Z(function({ disabled: t, icon: n, margin: r, onClick: o, ...a }, s) {
   return /* @__PURE__ */ i(
     Gr,
     {
@@ -4930,7 +4850,7 @@ const j = Z(function({
       ]
     }
   );
-}, Us = Z(function({
+}, yo = Z(function({
   autoUpdate: t = !1,
   decimalPlaces: n = 0,
   defaultValue: r = 0,
@@ -4984,7 +4904,7 @@ const j = Z(function({
       ) })
     }
   );
-}), xo = ({
+}), bo = ({
   autoUpdate: e,
   decimalPlaces: t,
   disabled: n = !1,
@@ -5010,21 +4930,23 @@ const j = Z(function({
   value: N,
   variant: T = "full",
   watch: z,
-  weight: O
+  weight: O,
+  defaultValue: D
 }) => T === "compact" ? /* @__PURE__ */ i(
-  $o,
+  yo,
   {
     "aria-label": h,
     autoUpdate: e,
     decimalPlaces: t,
-    defaultValue: Number(N ?? 0),
+    defaultValue: D ?? Number(N ?? 0),
     disabled: n,
     max: g,
     min: u,
     name: h,
     onEnter: m ?? (() => {
     }),
-    tooltipMessage: I
+    tooltipMessage: I,
+    value: N
   }
 ) : /* @__PURE__ */ i(
   Q,
@@ -5060,7 +4982,7 @@ const j = Z(function({
       }
     )
   }
-), mo = ({
+), $o = ({
   disabled: e = !1,
   error: t,
   name: n,
@@ -5111,7 +5033,7 @@ const j = Z(function({
       )
     }
   );
-}, wo = x.div`
+}, xo = x.div`
   ${({ theme: e }) => `
     align-items: flex-start;
     align-self: stretch;
@@ -5151,7 +5073,7 @@ const j = Z(function({
       }
     }
   `}
-`, vo = x.button`
+`, mo = x.button`
   ${({ theme: e }) => `
     align-items: center;
     background: inherit;
@@ -5167,7 +5089,7 @@ const j = Z(function({
       cursor: not-allowed;
     }
   `}
-`, ko = x.ul`
+`, wo = x.ul`
   ${({ theme: e }) => `
     align-items: flex-start;
     box-shadow: ${e.shadows.md};
@@ -5181,7 +5103,7 @@ const j = Z(function({
     scrollbar-width: thin;
     width: max-content;
   `}
-`, Co = x.li`
+`, vo = x.li`
   ${({ theme: e }) => `
     align-items: center;
     background: ${e.palette.white};
@@ -5198,14 +5120,14 @@ const j = Z(function({
       background: ${e.palette.gray[100]};
     }
   `}
-`, So = x.p`
+`, ko = x.p`
   color: ${({ theme: e }) => e.palette.gray[800]};
   font-size: inherit;
   min-width: 55%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-`, Gs = ({
+`, Us = ({
   disabled: e,
   error: t,
   label: n,
@@ -5266,13 +5188,13 @@ const j = Z(function({
       tooltip: l,
       weight: p,
       children: /* @__PURE__ */ f(
-        wo,
+        xo,
         {
           className: `${e ? "disabled" : ""} ${h ? "error" : ""}`,
           ref: u,
           children: [
             /* @__PURE__ */ f(
-              vo,
+              mo,
               {
                 "aria-label": "country-selector",
                 "data-testid": "country-selector",
@@ -5336,16 +5258,16 @@ const j = Z(function({
               }
             ),
             m && $e(
-              /* @__PURE__ */ i(ko, { ref: S.setFloating, style: C, children: ge.map((Y) => {
+              /* @__PURE__ */ i(wo, { ref: S.setFloating, style: C, children: ge.map((Y) => {
                 const { dialCode: U, iso2: re, name: xe } = mt(Y);
                 return /* @__PURE__ */ f(
-                  Co,
+                  vo,
                   {
                     onClick: ne(re),
                     value: re,
                     children: [
                       /* @__PURE__ */ i(wt, { iso2: re, size: "16px" }),
-                      /* @__PURE__ */ i(So, { children: xe }),
+                      /* @__PURE__ */ i(ko, { children: xe }),
                       /* @__PURE__ */ i(
                         F,
                         {
@@ -5368,7 +5290,7 @@ const j = Z(function({
       )
     }
   );
-}, _s = ({
+}, Gs = ({
   disabled: e = !1,
   error: t,
   helpLink: n,
@@ -5455,7 +5377,7 @@ const j = Z(function({
       )
     }
   );
-}, Ys = ({
+}, _s = ({
   control: e,
   description: t,
   disabled: n,
@@ -5520,7 +5442,7 @@ const j = Z(function({
       );
     const { decimalPlaces: z, max: O, min: D } = l ?? {};
     return /* @__PURE__ */ i(
-      xo,
+      bo,
       {
         decimalPlaces: z,
         disabled: n,
@@ -5574,13 +5496,13 @@ const j = Z(function({
       ]
     }
   );
-}, zo = be.div`
+}, Co = be.div`
   display: flex;
   align-self: flex-start;
   margin-left: auto;
   width: 40px;
   height: auto;
-`, Io = (e, t) => {
+`, So = (e, t) => {
   const [r, o] = R(0), [a, s] = R(0);
   return G(() => {
     a === 100 && (() => {
@@ -5598,7 +5520,7 @@ const j = Z(function({
       clearInterval(l);
     };
   }, [e]), { cycle: r, progress: a, setCycle: o, setProgress: s };
-}, To = ({
+}, zo = ({
   publicId: e,
   format: t = "webp"
 }) => {
@@ -5617,10 +5539,10 @@ const j = Z(function({
     n((s) => !s);
   }, []);
   return { close: o, isOpen: t, name: e, open: r, setIsOpen: n, toggle: a };
-}, No = (e) => e.reduce(
+}, Io = (e) => e.reduce(
   (t, n) => ({ ...t, [n.id]: n.visible }),
   {}
-), Do = ({
+), To = ({
   name: e,
   items: t,
   columnOrder: n,
@@ -5655,7 +5577,7 @@ const j = Z(function({
       const y = (n == null ? void 0 : n.indexOf(u.id)) ?? 0, m = (n == null ? void 0 : n.indexOf(h.id)) ?? 0;
       return y - m;
     });
-    o == null || o(No(g)), c(g);
+    o == null || o(Io(g)), c(g);
   }, [s, n, c, o]), p = K(() => bi(s, (g) => ((n == null ? void 0 : n.includes(g.id)) ?? !1) !== g.visible), [s, n]);
   return {
     setColumns: c,
@@ -5667,19 +5589,19 @@ const j = Z(function({
 }, hn = (e, t) => K(
   () => L.debounce(e, t),
   [e, t]
-), Ks = (e) => {
+), Ys = (e) => {
   const [t, n] = R(), r = hn((o) => {
     n(o);
   }, (e == null ? void 0 : e.debounceWait) ?? 300);
   return [t, r];
-}, Fo = ({
+}, No = ({
   alt: e = "img",
   height: t = "",
   width: n = "",
   plugins: r = [xi(), mi()],
   publicId: o
 }) => {
-  const a = To({ publicId: o });
+  const a = zo({ publicId: o });
   return /* @__PURE__ */ i(
     $i,
     {
@@ -5690,7 +5612,7 @@ const j = Z(function({
       width: n
     }
   );
-}, ue = it.memo(Fo), Eo = x.label`
+}, ue = it.memo(No), Do = x.label`
   ${({ theme: e }) => `
     align-items: center;
     display: flex;
@@ -5769,7 +5691,7 @@ const j = Z(function({
     }
 
   `}
-`, Ro = x.span.attrs({ className: "checkmark" })``, fn = Z(function({
+`, Fo = x.span.attrs({ className: "checkmark" })``, fn = Z(function({
   checked: t,
   disabled: n = !1,
   label: r,
@@ -5780,7 +5702,7 @@ const j = Z(function({
   ...c
 }, d) {
   return /* @__PURE__ */ f(
-    Eo,
+    Do,
     {
       "aria-disabled": n,
       "aria-label": r ?? o,
@@ -5803,12 +5725,12 @@ const j = Z(function({
             ...c
           }
         ),
-        /* @__PURE__ */ i(Ro, {}),
+        /* @__PURE__ */ i(Fo, {}),
         r ?? null
       ]
     }
   );
-}), Zs = ({
+}), Ks = ({
   alt: e,
   customDescription: t,
   imageId: n,
@@ -5883,7 +5805,7 @@ const j = Z(function({
             }
           )
         ] }),
-        d && /* @__PURE__ */ i(zo, { children: /* @__PURE__ */ i(
+        d && /* @__PURE__ */ i(Co, { children: /* @__PURE__ */ i(
           ue,
           {
             alt: e ?? "tag image",
@@ -5907,7 +5829,7 @@ const j = Z(function({
     transition: 0.2s;
     width: 36px;
   `}
-`, jo = x.div`
+`, Eo = x.div`
   ${({ theme: e }) => `
     background-color: ${e.palette.white};
     border-radius: 50%;
@@ -5918,7 +5840,7 @@ const j = Z(function({
     width: ${e.spacing[1]};
     z-index: 1;
   `}
-`, Lo = x.label`
+`, Ro = x.label`
   display: inline-block;
 
   input {
@@ -5945,7 +5867,7 @@ const j = Z(function({
     background-color: ${({ theme: e }) => e.palette.gray[200]};
     border: 1px solid ${({ theme: e }) => e.palette.gray[200]};
   }
-`, Ao = Z(function({
+`, jo = Z(function({
   defaultChecked: t,
   disabled: n = !1,
   justify: r,
@@ -5972,7 +5894,7 @@ const j = Z(function({
       justify: r,
       children: [
         /* @__PURE__ */ i($, { minWidth: s, children: u }),
-        /* @__PURE__ */ f(Lo, { onClick: h, role: "switch", children: [
+        /* @__PURE__ */ f(Ro, { onClick: h, role: "switch", children: [
           /* @__PURE__ */ i(
             "input",
             {
@@ -5987,13 +5909,13 @@ const j = Z(function({
               type: "checkbox"
             }
           ),
-          /* @__PURE__ */ i(we, { "aria-label": "Toggle Switch", id: `${o}Toggle`, children: /* @__PURE__ */ i(jo, {}) })
+          /* @__PURE__ */ i(we, { "aria-label": "Toggle Switch", id: `${o}Toggle`, children: /* @__PURE__ */ i(Eo, {}) })
         ] }),
         l
       ]
     }
   );
-}), Xs = ({
+}), Zs = ({
   id: e,
   title: t,
   toggles: n,
@@ -6027,18 +5949,18 @@ const j = Z(function({
             minHeight: "40px",
             width: "100%",
             children: n.map(
-              (s) => /* @__PURE__ */ i(Ao, { ...s }, `$card-toggle-${s.name}`)
+              (s) => /* @__PURE__ */ i(jo, { ...s }, `$card-toggle-${s.name}`)
             )
           }
         )
       ]
     }
   );
-}, Po = 0.5, At = 1.25, qs = ({
+}, Lo = 0.5, At = 1.25, Xs = ({
   children: e,
   bgColor: t,
   border: n,
-  gap: r = Po,
+  gap: r = Lo,
   px: o = At,
   py: a = At,
   ...s
@@ -6059,22 +5981,22 @@ const j = Z(function({
       children: e
     }
   );
-}, Oo = x.div`
+}, Ao = x.div`
   position: relative;
   margin: auto;
   overflow: hidden;
-`, Wo = x.div`
+`, Po = x.div`
   display: flex;
   transition: transform 0.5s ease-in-out;
   transform: translateX(
     ${({ $currentIndex: e }) => -e * 100}%
   );
-`, Ho = x.div`
+`, Oo = x.div`
   align-items: center;
   display: flex;
   justify-content: center;
   min-width: 100%;
-`, Mo = x.button`
+`, Wo = x.button`
   ${({ theme: e, $isActive: t }) => `
     background-color: ${t ? e.palette.primary[400] : e.palette.white};
     border: none;
@@ -6083,27 +6005,27 @@ const j = Z(function({
     height: ${e.spacing[0.75]};
     width: ${e.spacing[0.75]};
   `}
-`, Bo = x.div`
+`, Ho = x.div`
   align-items: center;
   display: flex;
   gap: ${({ theme: e }) => e.spacing[0.5]};
   justify-content: center;
   margin-top: ${({ theme: e }) => e.spacing[2]};
-`, Js = ({
+`, qs = ({
   slides: e,
   interval: t = 300
 }) => {
-  const { cycle: n, setCycle: r, setProgress: o } = Io(t, e.length), a = w(
+  const { cycle: n, setCycle: r, setProgress: o } = So(t, e.length), a = w(
     (s) => () => {
       r(s), o(0);
     },
     [r, o]
   );
-  return /* @__PURE__ */ f(Oo, { "aria-roledescription": "carousel", children: [
-    /* @__PURE__ */ i(Wo, { $currentIndex: n, children: e.map((s, l) => {
+  return /* @__PURE__ */ f(Ao, { "aria-roledescription": "carousel", children: [
+    /* @__PURE__ */ i(Po, { $currentIndex: n, children: e.map((s, l) => {
       const c = `slide-${l}`;
       return /* @__PURE__ */ i(
-        Ho,
+        Oo,
         {
           "aria-label": c,
           "aria-roledescription": "slide",
@@ -6112,10 +6034,10 @@ const j = Z(function({
         c
       );
     }) }),
-    /* @__PURE__ */ i(Bo, { children: e.map((s, l) => {
+    /* @__PURE__ */ i(Ho, { children: e.map((s, l) => {
       const c = `nav-button-${l}`;
       return /* @__PURE__ */ i(
-        Mo,
+        Wo,
         {
           $isActive: l === n,
           "aria-label": `Go to slide ${l + 1}`,
@@ -6202,7 +6124,7 @@ const j = Z(function({
       padding-bottom: unset;
     }
   `}
-`, Vo = x.div`
+`, Mo = x.div`
   ${({ theme: e }) => `
     align-items: end;
     background-color: ${e.palette.gray[100]};
@@ -6220,7 +6142,7 @@ const j = Z(function({
       background-color: ${e.palette.gray[200]};
     }
   `}
-`, Uo = ({
+`, Bo = ({
   noCodeMessage: e = "Code snippet not available",
   snippet: t,
   specific: n
@@ -6234,7 +6156,7 @@ const j = Z(function({
     ...n !== void 0 ? { "data-line": String(Number(n)) } : {},
     children: L.isNil(t) || L.isString(t) || L.isEmpty(t.content) ? /* @__PURE__ */ i("div", { className: "no-data", children: /* @__PURE__ */ i("p", { children: e }) }) : /* @__PURE__ */ i("code", { className: "language-none", children: t.content })
   }
-) })), Qs = ({
+) })), Js = ({
   noCodeMessage: e = "Code snippet not available",
   snippet: t,
   specific: n,
@@ -6255,7 +6177,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
     await navigator.clipboard.writeText(u);
   }, [u]);
   return r === "location" ? /* @__PURE__ */ i(
-    Uo,
+    Bo,
     {
       noCodeMessage: e,
       snippet: t,
@@ -6273,7 +6195,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       width: o ? "100%" : "565px",
       children: [
         /* @__PURE__ */ i(yn, { "data-private": !0, children: /* @__PURE__ */ i("pre", { children: /* @__PURE__ */ i("code", { className: "language-none", children: u }) }) }),
-        /* @__PURE__ */ f(Vo, { children: [
+        /* @__PURE__ */ f(Mo, { children: [
           /* @__PURE__ */ i(
             _,
             {
@@ -6305,7 +6227,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       ]
     }
   );
-}, { getVariant: Go } = ae(
+}, { getVariant: Vo } = ae(
   (e) => ({
     fixed: `
       height: auto;
@@ -6358,9 +6280,9 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
     margin: auto;
     white-space: pre-line;
 
-    ${Go(e, t)}
+    ${Vo(e, t)}
   `}
-`, _o = x.div`
+`, Uo = x.div`
   ${({ theme: e }) => `
     background-color: ${e.palette.white};
     border-radius: 0 0 ${e.spacing[0.25]} ${e.spacing[0.25]};
@@ -6388,7 +6310,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       }
     }
   `}
-`, Yo = x.div`
+`, Go = x.div`
   border-radius: ${({ theme: e }) => `${e.spacing[0.25]} ${e.spacing[0.25]} 0 0`};
   display: block;
   overflow: unset;
@@ -6398,9 +6320,9 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
   padding: ${({ theme: e }) => `${e.spacing[1.25]}`};
   padding-bottom: ${({ theme: e }) => `${e.spacing[1.5]}`};
   position: sticky;
-`, Ko = x.div.attrs({
+`, _o = x.div.attrs({
   className: "flex items-center justify-between"
-})``, Zo = x.div`
+})``, Yo = x.div`
   ${({ theme: e }) => `
     border-radius: 0 0 ${e.spacing[0.25]} ${e.spacing[0.25]};
     display: flex;
@@ -6431,7 +6353,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       margin-right: 0;
     }
   `}
-`, Xo = x.div`
+`, Ko = x.div`
   img {
     margin: 0 calc(-${({ theme: e }) => e.spacing[1.25]} - 1px)
       ${({ theme: e }) => e.spacing[1.25]};
@@ -6447,7 +6369,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
             margin-right: 0;
           ` : ""}
   }
-`, qo = ({
+`, Zo = ({
   alert: e,
   modalRef: t,
   confirmButton: n = void 0,
@@ -6471,7 +6393,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       py: 1.25,
       children: [
         e,
-        /* @__PURE__ */ i(Zo, { children: /* @__PURE__ */ f("div", { children: [
+        /* @__PURE__ */ i(Yo, { children: /* @__PURE__ */ f("div", { children: [
           r && /* @__PURE__ */ i(
             V,
             {
@@ -6496,7 +6418,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       ]
     }
   ) : null;
-}, Jo = ({
+}, Xo = ({
   title: e,
   description: t,
   modalRef: n,
@@ -6513,8 +6435,8 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
     return window.addEventListener("keydown", l), () => {
       window.removeEventListener("keydown", l);
     };
-  }, [s]), /* @__PURE__ */ f(Yo, { children: [
-    /* @__PURE__ */ f(Ko, { children: [
+  }, [s]), /* @__PURE__ */ f(Go, { children: [
+    /* @__PURE__ */ f(_o, { children: [
       typeof e == "string" ? /* @__PURE__ */ i(
         le,
         {
@@ -6548,7 +6470,7 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
     t && H.isString(t) && !H.isEmpty(t) ? /* @__PURE__ */ i(F, { mt: 0.5, size: "sm", children: t }) : void 0,
     t && !H.isString(t) && /* @__PURE__ */ i(Ne, { display: "block", mt: 0.5, size: "sm", children: t })
   ] });
-}, Qo = ({
+}, qo = ({
   disabled: e,
   id: t = "modal-confirm",
   onCancel: n,
@@ -6593,11 +6515,11 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       ]
     }
   );
-}, ea = (e, t, n) => n ? t === "secondary" ? `3px solid ${e.palette.primary[100]}` : `3px solid ${e.palette.primary[500]}` : "unset", ta = x.div`
+}, Jo = (e, t, n) => n ? t === "secondary" ? `3px solid ${e.palette.primary[100]}` : `3px solid ${e.palette.primary[500]}` : "unset", Qo = x.div`
   display: flex;
   flex-direction: row;
   gap: ${({ theme: e }) => e.spacing[0.25]};
-  border-bottom: ${({ theme: e, $borderButton: t, $variant: n }) => ea(e, n, t)};
+  border-bottom: ${({ theme: e, $borderButton: t, $variant: n }) => Jo(e, n, t)};
   align-items: center;
   padding: ${({ theme: e }) => e.spacing[0.625]}
     ${({ theme: e }) => e.spacing[0.5]};
@@ -6636,58 +6558,50 @@ ${y[8]}...` : (y.length < 8 && d(!1), t);
       }
     }
   }
-`, na = x(
+`, ea = x(
   Be
 )`
-  ${({ theme: e, $variant: t }) => `
-    align-items: center;
-    background: ${t === "error" ? e.palette.primary[400] : e.palette.warning[500]};
-    border-radius: 100%;
-    font-family: ${e.typography.type.primary};
-    justify-content: center;
-    padding: 0;
-    position: absolute;
-    z-index: 11;
-    width: ${e.spacing[0.5]};
-    height: ${e.spacing[0.5]};
-  `}
-`, ia = x.div`
+  ${({ theme: e, $variant: t, $numberIndicator: n }) => {
+  const r = n != null && n > 0;
+  return `
+      align-items: center;
+      background: ${t === "error" ? e.palette.primary[400] : e.palette.warning[500]};
+      border-radius: ${r ? "100px" : "100%"};
+      font-family: ${e.typography.type.primary};
+      justify-content: center;
+      padding: 2px 4px;
+      position: absolute;
+      z-index: 11;
+      min-width: ${r ? e.spacing[1.25] : e.spacing[0.5]};
+      height: ${r ? "14px" : e.spacing[0.5]}};
+    `;
+}}
+`, ta = x.div`
   align-items: center;
   color: ${({ theme: e }) => e.palette.white};
   display: flex;
-  font-size: 6px;
-  font-weight: ${({ theme: e }) => e.typography.weight.bold};
+  font-size: 12px;
+  font-weight: ${({ theme: e }) => e.typography.weight.regular};
   justify-content: center;
-`;
-x.div`
-  /* Override component size only in Storybook */
-  & > div {
-    width: 24px !important;
-    height: 24px !important;
-
-    & > div {
-      font-size: 12px !important;
-    }
-  }
-`;
-const ra = Z(function({
+`, na = Z(function({
   numberIndicator: t,
   show: n,
   variant: r = "error",
   ...o
 }, a) {
   return /* @__PURE__ */ i(
-    na,
+    ea,
     {
+      $numberIndicator: t,
       $variant: r,
       className: n ? "flex" : "hidden",
       "data-testid": "notification-sign",
       ref: a,
       ...o,
-      children: t && /* @__PURE__ */ i(ia, { children: t <= 9 ? t : 9 })
+      children: t && /* @__PURE__ */ i(ta, { children: t <= 9 ? t : 9 })
     }
   );
-}), oa = ({
+}), ia = ({
   end: e = !1,
   label: t,
   id: n,
@@ -6700,11 +6614,11 @@ const ra = Z(function({
   tag: d
 }) => {
   const { pathname: p } = Ui(), g = r || (c === "primary" ? p.includes(o) : p.endsWith(o));
-  return /* @__PURE__ */ i(J, { display: "flex", id: `${n}-tooltip`, tip: l, children: /* @__PURE__ */ f(ta, { $borderButton: g, $variant: c, children: [
+  return /* @__PURE__ */ i(J, { display: "flex", id: `${n}-tooltip`, tip: l, children: /* @__PURE__ */ f(Qo, { $borderButton: g, $variant: c, children: [
     /* @__PURE__ */ f(Gi, { end: e, id: n, onClick: s, to: o, children: [
       t,
       /* @__PURE__ */ i(
-        ra,
+        na,
         {
           left: a == null ? void 0 : a.left,
           numberIndicator: a == null ? void 0 : a.numberIndicator,
@@ -6752,7 +6666,7 @@ const ra = Z(function({
           tag: u,
           tooltip: h
         }) => /* @__PURE__ */ i(
-          oa,
+          ia,
           {
             end: a,
             id: s,
@@ -6789,7 +6703,7 @@ const ra = Z(function({
       ...a
     }
   );
-}), aa = x.li`
+}), ra = x.li`
   ${({ theme: e }) => `
     align-items: center;
     background-color: ${e.palette.white};
@@ -6836,7 +6750,7 @@ const ra = Z(function({
       background-color: ${e.palette.gray[100]};
     }
   `}
-`, la = x.ul`
+`, oa = x.ul`
   ${({ theme: e }) => `
     background-color: ${e.palette.white};
     border: 1px solid ${e.palette.gray[200]};
@@ -6866,7 +6780,7 @@ const ra = Z(function({
     ...m.props
   }) : m) : e;
   return /* @__PURE__ */ f(
-    aa,
+    ra,
     {
       "aria-disabled": t,
       "aria-label": p,
@@ -6905,7 +6819,7 @@ const ra = Z(function({
       ]
     }
   );
-}, sa = be(Ge)`
+}, aa = be(Ge)`
   margin-top: 10px;
   border: 1px solid ${({ theme: e }) => e.palette.gray[300]};
   border-radius: 4px;
@@ -6927,7 +6841,7 @@ const ra = Z(function({
   ${({ $isDragging: e, theme: t }) => e ? `
         border: 2px solid ${t.palette.black};
       ` : ""}
-`, ca = ({
+`, la = ({
   items: e,
   onReorder: t,
   title: n,
@@ -6995,7 +6909,7 @@ const ra = Z(function({
               },
               value: g,
               children: /* @__PURE__ */ i(
-                sa,
+                aa,
                 {
                   $isDragging: a === g.name,
                   disabled: g.locked,
@@ -7016,7 +6930,7 @@ const ra = Z(function({
       ]
     }
   );
-}, da = be(Ge)`
+}, sa = be(Ge)`
   padding: 7px 8px;
 
   &[aria-selected="true"] {
@@ -7032,7 +6946,7 @@ const ra = Z(function({
       display: none;
     }
   }
-`, pa = ({
+`, ca = ({
   options: e,
   title: t,
   checkboxesName: n,
@@ -7115,7 +7029,7 @@ const ra = Z(function({
     [r.group]: [r]
   } : n,
   {}
-), ga = x.input`
+), da = x.input`
   ${({ theme: e }) => `
     background: none;
     border: none !important;
@@ -7145,7 +7059,7 @@ const ra = Z(function({
       display:none;
     }
   `}
-`, ua = x.div`
+`, pa = x.div`
   ${({ theme: e }) => `
     align-items: center;
     background-color: ${e.palette.white};
@@ -7165,7 +7079,7 @@ const ra = Z(function({
       border: 2px solid ${e.palette.black};
     }
   `}
-`, ha = x.div`
+`, ga = x.div`
   ${({ theme: e }) => `
     background-color: ${e.palette.white};
     border-radius: ${e.spacing[0.5]};
@@ -7201,7 +7115,7 @@ const ra = Z(function({
     },
     !0
   );
-  const v = /* @__PURE__ */ f(ua, { children: [
+  const v = /* @__PURE__ */ f(pa, { children: [
     /* @__PURE__ */ i(
       j,
       {
@@ -7212,7 +7126,7 @@ const ra = Z(function({
       }
     ),
     /* @__PURE__ */ i(
-      ga,
+      da,
       {
         id: e,
         name: e,
@@ -7252,9 +7166,9 @@ const ra = Z(function({
         variant: "ghost"
       }
     ),
-    c ? /* @__PURE__ */ i(ha, { ref: u.setFloating, style: h, children: v }) : void 0
+    c ? /* @__PURE__ */ i(ga, { ref: u.setFloating, style: h, children: v }) : void 0
   ] }) : v;
-}, fa = ({
+}, ua = ({
   columns: e,
   formId: t,
   onChangeHandler: n,
@@ -7313,7 +7227,7 @@ const ra = Z(function({
               ([g, u], h) => {
                 const y = `li-checkbox${g}`;
                 return /* @__PURE__ */ i(
-                  pa,
+                  ca,
                   {
                     checkboxesName: g,
                     defaultBgColor: !0,
@@ -7352,7 +7266,7 @@ const ra = Z(function({
         children: a.map((g) => {
           const u = `li-checkbox-${g.name}`;
           return /* @__PURE__ */ i(
-            da,
+            sa,
             {
               selected: g.visible,
               value: u,
@@ -7375,7 +7289,7 @@ const ra = Z(function({
       }
     )
   ] });
-}, ya = ({
+}, ha = ({
   _containerId: e = "portals",
   title: t,
   modalRef: n,
@@ -7446,7 +7360,7 @@ const ra = Z(function({
           width: "100%",
           children: [
             /* @__PURE__ */ i(
-              fa,
+              ua,
               {
                 columns: n.columns,
                 formId: "columns-visibility",
@@ -7462,7 +7376,7 @@ const ra = Z(function({
               }
             ),
             /* @__PURE__ */ i(
-              ca,
+              la,
               {
                 description: "Click and drag to reorder the columns",
                 items: n.columns,
@@ -7512,11 +7426,11 @@ const ra = Z(function({
     ] }) }),
     document.getElementById(e) ?? document.body
   ) : /* @__PURE__ */ i("div", {});
-}, ba = be(Ge)`
+}, fa = be(Ge)`
   padding: 8px;
   min-height: 36px;
   min-width: unset;
-`, $a = be.div.attrs({
+`, ya = be.div.attrs({
   className: "comp-modal absolute top-[55px] overflow-auto"
 })`
   align-items: center;
@@ -7531,7 +7445,7 @@ const ra = Z(function({
   svg.fa-check {
     border-radius: 2px;
   }
-`, xa = ({
+`, ba = ({
   control: e,
   option: t,
   register: n,
@@ -7621,7 +7535,7 @@ const ra = Z(function({
       );
     case "numberRange":
       return /* @__PURE__ */ i(
-        mo,
+        $o,
         {
           label: t.label,
           name: String(t.key),
@@ -7664,7 +7578,7 @@ const ra = Z(function({
     default:
       return /* @__PURE__ */ i("div", {});
   }
-}, ma = ({
+}, $a = ({
   control: e,
   items: t,
   register: n,
@@ -7673,7 +7587,7 @@ const ra = Z(function({
   const s = `${o.type}-${o.value}-${o.filterFn ?? "default"}`;
   return /* @__PURE__ */ f("div", { children: [
     /* @__PURE__ */ i(
-      xa,
+      ba,
       {
         control: e,
         option: o,
@@ -7683,7 +7597,7 @@ const ra = Z(function({
     ),
     a < t.length - 1 && /* @__PURE__ */ i("hr", { style: { margin: "1.25rem 0 0.625rem" } })
   ] }, s);
-}) }), wa = (e) => {
+}) }), xa = (e) => {
   var l, c, d, p, g;
   const [t, n] = R([...e]), { control: r, register: o, handleSubmit: a, setValue: s } = tn({
     defaultValues: {
@@ -7717,7 +7631,7 @@ const ra = Z(function({
     handleSubmit: a,
     setValue: s
   };
-}, va = (e, t) => {
+}, ma = (e, t) => {
   var n, r, o, a, s;
   t(
     "checkbox",
@@ -7746,15 +7660,15 @@ const ra = Z(function({
     "maxValue",
     (s = e.find((l) => ["numberRange", "dateRange"].includes(l.type))) == null ? void 0 : s.maxValue
   );
-}, ka = (e, t) => (e == null ? void 0 : e.filter(
+}, wa = (e, t) => (e == null ? void 0 : e.filter(
   (n) => {
     var r;
     return ((r = n.label) == null ? void 0 : r.toLowerCase().includes((t == null ? void 0 : t.toLowerCase()) ?? "")) ?? n.value.toLowerCase().includes((t == null ? void 0 : t.toLowerCase()) ?? "");
   }
-)) ?? [], Ca = async (e, t) => await Promise.all(
+)) ?? [], va = async (e, t) => await Promise.all(
   e.map(async (n) => {
     if (n.type === "checkboxes") {
-      const o = (n.filterOptions ? await n.filterOptions(n.options ?? [], t) : ka(n.options ?? [], t)).filter(
+      const o = (n.filterOptions ? await n.filterOptions(n.options ?? [], t) : wa(n.options ?? [], t)).filter(
         (a, s, l) => l.findIndex((c) => c.value === a.value) === s
       );
       return {
@@ -7771,13 +7685,13 @@ const ra = Z(function({
   id: r,
   selectedFilter: o
 }) => {
-  const { control: a, items: s, setItems: l, register: c, handleSubmit: d, setValue: p } = wa(e), g = e.some(
+  const { control: a, items: s, setItems: l, register: c, handleSubmit: d, setValue: p } = xa(e), g = e.some(
     (y) => y.type === "checkboxes" && y.hideSearch !== !0
   ), u = w(
     async (y) => {
       const { value: m } = y.target;
       t && t(m);
-      const b = await Ca(
+      const b = await va(
         e,
         m
       );
@@ -7791,7 +7705,7 @@ const ra = Z(function({
     [n]
   );
   return G(() => {
-    l(e), va(e, p);
+    l(e), ma(e, p);
   }, [e, l, p]), /* @__PURE__ */ f(
     "div",
     {
@@ -7805,7 +7719,7 @@ const ra = Z(function({
         ] }),
         /* @__PURE__ */ f("form", { id: r, onSubmit: d(h), children: [
           /* @__PURE__ */ i(
-            ma,
+            $a,
             {
               control: a,
               items: s,
@@ -7818,7 +7732,7 @@ const ra = Z(function({
       ]
     }
   );
-}, Sa = ({
+}, ka = ({
   options: e,
   variant: t,
   onApplyFilters: n,
@@ -7873,7 +7787,7 @@ const ra = Z(function({
     (v, S) => {
       const C = `li-filter-option-${v}`;
       return /* @__PURE__ */ f(
-        ba,
+        fa,
         {
           icon: S,
           onClick: m(v),
@@ -7957,7 +7871,7 @@ const ra = Z(function({
       )
     }
   );
-}, za = ({
+}, Ca = ({
   options: e,
   onApplyFilters: t,
   onSearch: n,
@@ -7988,7 +7902,7 @@ const ra = Z(function({
       return document.addEventListener("mousedown", u, !0), () => {
         document.removeEventListener("mousedown", u, !0);
       };
-  }, [p, l, r]), /* @__PURE__ */ i($a, { $bgColor: "transparent", "aria-label": r.name, children: /* @__PURE__ */ f(
+  }, [p, l, r]), /* @__PURE__ */ i(ya, { $bgColor: "transparent", "aria-label": r.name, children: /* @__PURE__ */ f(
     ht,
     {
       $size: "fixed",
@@ -8006,7 +7920,7 @@ const ra = Z(function({
       children: [
         a === "column" ? g : void 0,
         /* @__PURE__ */ i(
-          Sa,
+          ka,
           {
             onApplyFilters: t,
             onSearch: n,
@@ -8021,17 +7935,17 @@ const ra = Z(function({
     }
   ) });
 };
-function Ia(e) {
+function Sa(e) {
   if (e)
     return e;
 }
-function Ta(e) {
+function za(e) {
   if (!e || e.length === 0)
     return;
   const t = e.filter((r) => r.checked).map((r) => r.label ?? r.value);
   return t.length === 0 ? void 0 : t.join(", ");
 }
-function Na(e, t, n) {
+function Ia(e, t, n) {
   const r = n ?? "", o = L.isEmpty(e) && typeof e != "number" || Number.isNaN(e) ? void 0 : Number(e), a = L.isEmpty(t) && typeof t != "number" || Number.isNaN(t) ? void 0 : Number(String(t));
   if (!L.isUndefined(o) && !L.isUndefined(a))
     return `${o}${r} - ${a}${r}`;
@@ -8040,7 +7954,7 @@ function Na(e, t, n) {
   if (!L.isUndefined(a))
     return `Max ${a}${r}`;
 }
-function Da(e, t) {
+function Ta(e, t) {
   if (Ci.extend(Si), !(L.isUndefined(e) && L.isUndefined(t))) {
     if (e !== "" && t !== "" && !L.isUndefined(e) && !L.isUndefined(t))
       return `${te(e).format("LL")} - ${te(t).format("LL")}`;
@@ -8050,7 +7964,7 @@ function Da(e, t) {
       return `To ${te(t).format("LL")}`;
   }
 }
-function Fa(e, t, n) {
+function Na(e, t, n) {
   return e === "select" ? t : `${t} ${n === "includesInsensitive" ? "contains" : "is"}`;
 }
 const Ie = ({
@@ -8068,7 +7982,7 @@ const Ie = ({
     onClose: r(e),
     tagLabel: `${n} `
   }
-), ec = ({
+), Qs = ({
   options: e,
   onClose: t
 }) => {
@@ -8077,7 +7991,7 @@ const Ie = ({
       const { filterFn: a, label: s, type: l, value: c, options: d, minValue: p, maxValue: g } = o;
       switch (l) {
         case "numberRange": {
-          const u = Na(
+          const u = Ia(
             p,
             g,
             r.placeholder
@@ -8095,7 +8009,7 @@ const Ie = ({
           );
         }
         case "dateRange": {
-          const u = Da(
+          const u = Ta(
             p == null ? void 0 : p.toString(),
             g == null ? void 0 : g.toString()
           );
@@ -8113,7 +8027,7 @@ const Ie = ({
         }
         case "radioButton":
         case "checkboxes": {
-          const u = Ta(d);
+          const u = za(d);
           return /* @__PURE__ */ i(
             Ie,
             {
@@ -8130,7 +8044,7 @@ const Ie = ({
         case "select":
         case "text":
         default: {
-          const u = Ia(c), h = Fa(l, r.label, a);
+          const u = Sa(c), h = Na(l, r.label, a);
           return /* @__PURE__ */ i(
             Ie,
             {
@@ -8162,7 +8076,7 @@ const Ie = ({
       children: n
     }
   ) : null;
-}, Ea = (e) => e.map((t) => {
+}, Da = (e) => e.map((t) => {
   const n = {
     key: String(t.key),
     type: t.type
@@ -8175,7 +8089,7 @@ const Ie = ({
     return o;
   })();
   return Object.keys(r).length > 2 ? r : null;
-}).filter(Boolean), Ra = (e, t) => t.map((n) => {
+}).filter(Boolean), Fa = (e, t) => t.map((n) => {
   const r = e.find(
     (a) => a.key === String(n.key) && a.type === n.type
   );
@@ -8196,18 +8110,18 @@ const Ie = ({
     }), a;
   })() : n;
 }), qe = (e, t) => {
-  const n = Ea(e);
+  const n = Da(e);
   t(JSON.stringify(n));
-}, ja = (e, t) => {
+}, Ea = (e, t) => {
   const n = e();
   if (!n) return t;
   try {
     const r = JSON.parse(n);
-    return Ra(r, t);
+    return Fa(r, t);
   } catch {
     return t;
   }
-}, La = (e, t) => {
+}, Ra = (e, t) => {
   function n(s, l) {
     if (l.value === "" || l.value === void 0 || L.defaultTo(l.isBackFilter, !1))
       return !0;
@@ -8260,10 +8174,10 @@ const Ie = ({
     });
   }
   return e.filter(a);
-}, Aa = (e) => [
+}, ja = (e) => [
   ...e.flatMap(({ options: n }) => n).filter((n) => n == null ? void 0 : n.checked),
   ...e.flatMap((n) => [n.value, n.maxValue, n.minValue]).filter(Boolean)
-].length, Pa = (e) => {
+].length, La = (e) => {
   var n;
   const t = ((n = e.options) == null ? void 0 : n.map((r) => ({ ...r, checked: void 0 }))) ?? void 0;
   return {
@@ -8273,7 +8187,7 @@ const Ie = ({
     value: void 0,
     options: t
   };
-}, tc = ({
+}, ec = ({
   dataset: e,
   setValues: t,
   getValues: n,
@@ -8284,7 +8198,7 @@ const Ie = ({
   onSearch: l,
   variant: c = "ungrouped"
 }) => {
-  const d = Ue("filters-modal"), [p, g] = R(!1), [u, h] = R([]), y = Aa(u), m = r.map((C) => ({
+  const d = Ue("filters-modal"), [p, g] = R(!1), [u, h] = R([]), y = ja(u), m = r.map((C) => ({
     ...C,
     filterOptions: C.filterOptions.map((I) => u.find(
       (T) => T.key === I.key && T.type === I.type && T.filterFn === I.filterFn
@@ -8300,7 +8214,7 @@ const Ie = ({
     (C) => () => {
       s && s();
       const I = u.map(
-        (N) => N.key === C.key && N.type === C.type && N.filterFn === C.filterFn ? Pa(N) : N
+        (N) => N.key === C.key && N.type === C.type && N.filterFn === C.filterFn ? La(N) : N
       );
       h(I), qe(I, t);
     },
@@ -8317,12 +8231,12 @@ const Ie = ({
         return !1;
       }
     })()) {
-      const T = ja(n, C);
+      const T = Ea(n, C);
       h(T);
     } else
       C.flatMap((z) => z.value).filter(Boolean).length > 0 || C.flatMap((z) => z.options).filter((z) => (z == null ? void 0 : z.checked) === !0).length > 0 ? (h(C), p && qe(C, t)) : h(C);
   }, [r, h, t, n, p]), G(() => {
-    o && e !== void 0 && o(La(e, u)), a == null || a(u);
+    o && e !== void 0 && o(Ra(e, u)), a == null || a(u);
   }, [e, u, o, a]), { Filters: () => /* @__PURE__ */ f(
     $,
     {
@@ -8344,7 +8258,7 @@ const Ie = ({
           }
         ) }),
         d.isOpen && /* @__PURE__ */ i(
-          za,
+          Ca,
           {
             modalRef: d,
             onApplyFilters: b,
@@ -8397,7 +8311,7 @@ const Ie = ({
           style: S && m ? { height: m } : void 0,
           children: [
             !L.isEmpty(g) && !L.isNil(g) && /* @__PURE__ */ i(
-              Jo,
+              Xo,
               {
                 description: s,
                 modalRef: l,
@@ -8417,18 +8331,18 @@ const Ie = ({
               }
             ),
             (L.isObject(a) || r) && /* @__PURE__ */ f(
-              _o,
+              Uo,
               {
                 style: C ? { borderBottom: `1px solid ${y.palette.gray[200]}` } : void 0,
                 children: [
                   r,
-                  L.isObject(a) && L.isString(a.imageSrc) && /* @__PURE__ */ i(Xo, { $framed: a.imageFramed, children: /* @__PURE__ */ i(ue, { alt: "modal-img", publicId: a.imageSrc }) }),
+                  L.isObject(a) && L.isString(a.imageSrc) && /* @__PURE__ */ i(Ko, { $framed: a.imageFramed, children: /* @__PURE__ */ i(ue, { alt: "modal-img", publicId: a.imageSrc }) }),
                   L.isObject(a) && L.isString(a.imageText) && /* @__PURE__ */ i(F, { size: "sm", children: a.imageText })
                 ]
               }
             ),
             /* @__PURE__ */ i(
-              qo,
+              Zo,
               {
                 alert: t,
                 cancelButton: n,
@@ -8445,7 +8359,7 @@ const Ie = ({
     I,
     document.getElementById("portals") ?? document.body
   ) : l.isOpen ? I : null;
-}, nc = (e, t, n) => {
+}, tc = (e, t, n) => {
   const r = Ue("confirm-dialog-modal"), o = B(null), a = w(async () => (r.open(), new Promise((d) => {
     o.current = d;
   })), [r]), s = w(() => {
@@ -8494,7 +8408,7 @@ const Ie = ({
           d,
           /* @__PURE__ */ i($, { display: "flex", flexDirection: "column", gap: 0.5, children: m }),
           /* @__PURE__ */ i(
-            Qo,
+            qo,
             {
               disabled: y,
               id: e,
@@ -8505,7 +8419,7 @@ const Ie = ({
       }
     );
   }];
-}, ic = () => {
+}, nc = () => {
   const [e, t] = R(!1), [n, r] = R(), o = B(null), a = Ue("confirm-dialog-modal"), s = w(
     async (p) => (r(p), t(!0), new Promise((g) => {
       o.current = g;
@@ -8543,14 +8457,14 @@ const Ie = ({
       ]
     }
   ), confirm: s };
-}, Oa = 2e3, rc = ({
+}, Aa = 2e3, ic = ({
   content: e
 }) => {
   const [t, n] = R("Copy"), r = w(() => {
     navigator.clipboard.writeText(e).then(() => {
       n("Copied"), setTimeout(() => {
         n("Copy");
-      }, Oa);
+      }, Aa);
     }).catch(() => {
       n("Failed to copy");
     });
@@ -8566,7 +8480,7 @@ const Ie = ({
       variant: "ghost"
     }
   );
-}, Wa = x.ul`
+}, Pa = x.ul`
   ${({ theme: e }) => `
     align-items: flex-start;
     border-radius: ${e.spacing[0.25]};
@@ -8579,7 +8493,7 @@ const Ie = ({
     width: 166px;
     z-index: 9999;
   `}
-`, Ha = x.li`
+`, Oa = x.li`
   ${({ theme: e }) => `
     align-items: center;
     background: ${e.palette.white}
@@ -8605,7 +8519,7 @@ const Ie = ({
       cursor: not-allowed;
     }
   `}
-`, oc = ({
+`, rc = ({
   icon: e,
   iconColor: t,
   id: n,
@@ -8642,12 +8556,12 @@ const Ie = ({
         children: a
       }
     ),
-    l ? /* @__PURE__ */ i(Wa, { ref: p.setFloating, style: g, children: o.map((h) => {
+    l ? /* @__PURE__ */ i(Pa, { ref: p.setFloating, style: g, children: o.map((h) => {
       const y = ({}) => {
         h.onClick(), c(!1);
       };
       return /* @__PURE__ */ f(
-        Ha,
+        Oa,
         {
           "aria-disabled": h.disabled,
           "aria-label": h.label,
@@ -8669,7 +8583,7 @@ const Ie = ({
       );
     }) }) : void 0
   ] });
-}, Wt = ({ buttonProps: e, variant: t }) => /* @__PURE__ */ i(V, { onClick: e.onClick, variant: t, children: e.text }), Ma = x.div`
+}, Wt = ({ buttonProps: e, variant: t }) => /* @__PURE__ */ i(V, { onClick: e.onClick, variant: t, children: e.text }), Wa = x.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -8677,7 +8591,7 @@ const Ie = ({
   max-width: 900px;
   white-space: pre-line;
   margin: 0 auto;
-`, Ba = x.div`
+`, Ha = x.div`
   display: flex;
   flex-direction: row;
   justify-content: center;
@@ -8690,7 +8604,7 @@ const Ie = ({
   > img {
     width: 100%;
   }
-`, Va = x.div`
+`, Ma = x.div`
   display: flex;
   flex-direction: row;
   margin: 0;
@@ -8706,7 +8620,7 @@ const Ie = ({
 `, Ht = {
   md: { description: "md", title: "md" },
   sm: { description: "sm", title: "xs" }
-}, ac = ({
+}, oc = ({
   cancelButton: e = void 0,
   confirmButton: t = void 0,
   description: n,
@@ -8716,8 +8630,8 @@ const Ie = ({
   size: s = "md"
 }) => {
   const l = (t ?? e) !== void 0;
-  return /* @__PURE__ */ f(Ma, { $padding: o, children: [
-    /* @__PURE__ */ i(Ba, { children: /* @__PURE__ */ i(ue, { alt: "empty-icon", publicId: r }) }),
+  return /* @__PURE__ */ f(Wa, { $padding: o, children: [
+    /* @__PURE__ */ i(Ha, { children: /* @__PURE__ */ i(ue, { alt: "empty-icon", publicId: r }) }),
     /* @__PURE__ */ i(
       le,
       {
@@ -8738,17 +8652,17 @@ const Ie = ({
         children: n
       }
     ),
-    l ? /* @__PURE__ */ f(Va, { children: [
+    l ? /* @__PURE__ */ f(Ma, { children: [
       e && /* @__PURE__ */ i(Wt, { buttonProps: e, variant: "tertiary" }),
       t && /* @__PURE__ */ i(Wt, { buttonProps: t, variant: "primary" })
     ] }) : void 0
   ] });
-}, lc = ({
+}, ac = ({
   children: e
 }) => {
   const t = zi();
   return e({ ...t });
-}, Ua = x.form`
+}, Ba = x.form`
   ${({ theme: e }) => `
     align-items: flex-start;
     align-self: stretch;
@@ -8758,7 +8672,7 @@ const Ie = ({
     overflow: hidden auto;
     width: 100%;
   `}
-`, sc = ({
+`, lc = ({
   alert: e,
   buttonAlignment: t,
   cancelButton: n,
@@ -8783,7 +8697,7 @@ const Ie = ({
     C.stopPropagation(), m.handleSubmit(d)(C);
   }
   const v = g ? `calc(100% - ${e ? "139px" : "83px"})` : "100%", S = p ? 1.5 : 0;
-  return /* @__PURE__ */ i(Ii, { ...m, children: /* @__PURE__ */ i(Ua, { onSubmit: b, children: /* @__PURE__ */ f($, { scroll: "y", width: "100%", children: [
+  return /* @__PURE__ */ i(Ii, { ...m, children: /* @__PURE__ */ i(Ba, { onSubmit: b, children: /* @__PURE__ */ f($, { scroll: "y", width: "100%", children: [
     /* @__PURE__ */ i(
       $,
       {
@@ -8844,7 +8758,7 @@ const Ie = ({
       }
     )
   ] }) }) });
-}, Ga = x(Be)`
+}, Va = x(Be)`
   display: grid;
   gap: ${({ $gap: e = 1.25 }) => `${e}rem`};
   grid-template-columns: ${({ $sm: e }) => `repeat(${e}, 1fr)`};
@@ -8862,7 +8776,7 @@ const Ie = ({
       grid-template-columns: repeat(${t}, 1fr);
     }
   `}
-`, cc = Z(function({
+`, sc = Z(function({
   children: t,
   md: n,
   sm: r,
@@ -8872,7 +8786,7 @@ const Ie = ({
   ...l
 }, c) {
   return /* @__PURE__ */ i(
-    Ga,
+    Va,
     {
       $gap: s,
       $lg: o,
@@ -8884,7 +8798,7 @@ const Ie = ({
       children: t
     }
   );
-}), _a = x.div`
+}), Ua = x.div`
   ${({ theme: e, $itemsLength: t }) => `
     display: flex;
     background-color: ${e.palette.white};
@@ -8920,7 +8834,7 @@ const Ie = ({
       background-color: ${e.palette.gray[100]};
     }
   `}
-`, Ya = ({
+`, Ga = ({
   isSelected: e = !1,
   label: t,
   onSelect: n
@@ -8939,7 +8853,7 @@ const Ie = ({
     ) : null,
     /* @__PURE__ */ i(F, { color: r.palette.gray[800], fontWeight: "bold", size: "sm", children: t })
   ] });
-}, dc = ({
+}, cc = ({
   isOpen: e = !0,
   items: t,
   handleNewOrganization: n,
@@ -8984,7 +8898,7 @@ const Ie = ({
           left: "0",
           top: "0",
           width: "100%",
-          children: /* @__PURE__ */ f(_a, { $itemsLength: d.length, children: [
+          children: /* @__PURE__ */ f(Ua, { $itemsLength: d.length, children: [
             /* @__PURE__ */ f(
               $,
               {
@@ -9041,7 +8955,7 @@ const Ie = ({
                   ] }) }) : void 0,
                   d.map(
                     (b) => /* @__PURE__ */ i(
-                      Ya,
+                      Ga,
                       {
                         isSelected: a.toLowerCase() === b.name,
                         label: b.name.charAt(0).toUpperCase() + b.name.slice(1),
@@ -9059,7 +8973,7 @@ const Ie = ({
     }
   );
   return e ? $e(m, document.body) : /* @__PURE__ */ i("div", {});
-}, pc = ({
+}, dc = ({
   description: e,
   height: t = "auto",
   leftIconName: n,
@@ -9121,7 +9035,7 @@ const Ie = ({
       ]
     }
   );
-}, gc = ({
+}, pc = ({
   actions: e,
   children: t,
   header: n,
@@ -9224,7 +9138,7 @@ const Ie = ({
       ]
     }
   );
-}, Ka = x.span`
+}, _a = x.span`
   ${({
   theme: e,
   $bgColor: t = e.palette.secondary[500],
@@ -9237,37 +9151,37 @@ const Ie = ({
   padding: ${e.spacing[0.125]} ${e.spacing[0.25]} ${e.spacing[0.125]} ${e.spacing[0.25]};
   text-decoration: ${n}
   `}
-`, uc = ({
+`, gc = ({
   bgColor: e,
   children: t,
   txtDecoration: n,
   ml: r = 1
 }) => /* @__PURE__ */ i(
-  Ka,
+  _a,
   {
     $bgColor: e,
     $txtDecoration: n,
     className: `ml-${r}`,
     children: t
   }
-), Za = {
+), Ya = {
   lg: "56",
   md: "30",
   sm: "12"
-}, { getVariant: Xa } = ae(
+}, { getVariant: Ka } = ae(
   (e) => ({
     blue: `stroke: ${e.palette.info[500]};`,
     red: `stroke: ${e.palette.primary[500]};`,
     white: `stroke: ${e.palette.white};`
   })
-), qa = Kt`
+), Za = Kt`
   0% {
     transform: rotateZ(0deg);
   }
   100% {
     transform: rotateZ(360deg)
   }
-`, Ja = Kt`
+`, Xa = Kt`
   0%,
   25% {
     stroke-dashoffset: 280;
@@ -9284,16 +9198,16 @@ const Ie = ({
     stroke-dashoffset: 280;
     transform: rotate(360deg);
   }
-`, Qa = x.svg`
+`, qa = x.svg`
   ${({ $size: e = "md" }) => Se`
-    animation: ${qa} 2s linear infinite;
+    animation: ${Za} 2s linear infinite;
     animation-timing-function: linear;
     display: inline-block;
-    width: ${Za[e]}px;
+    width: ${Ya[e]}px;
   `}
-`, el = x.circle`
+`, Ja = x.circle`
   ${({ theme: e, $color: t = "red" }) => Se`
-    animation: 1.4s ease-in-out infinite both ${Ja};
+    animation: 1.4s ease-in-out infinite both ${Xa};
     display: block;
     fill: transparent;
     stroke-linecap: round;
@@ -9302,9 +9216,9 @@ const Ie = ({
     stroke-width: 10px;
     transform-origin: 50% 50%;
 
-    ${Xa(e, t)}
+    ${Ka(e, t)}
   `}
-`, tl = x.circle`
+`, Qa = x.circle`
   display: block;
   fill: transparent;
   stroke: ${({ theme: e }) => e.palette.gray[200]};
@@ -9312,16 +9226,16 @@ const Ie = ({
   stroke-width: 10px;
   transform-origin: 50% 50%;
   opacity: ${({ $color: e }) => e === "white" ? "20%" : "unset"};
-`, nl = ({
+`, el = ({
   color: e = "red",
   label: t,
   size: n
 }) => {
   const r = E();
   return /* @__PURE__ */ f($, { alignItems: "center", display: "flex", children: [
-    /* @__PURE__ */ f(Qa, { $size: n, viewBox: "0 0 100 100", children: [
-      /* @__PURE__ */ i(tl, { $color: e, cx: "50", cy: "50", r: "45" }),
-      /* @__PURE__ */ i(el, { $color: e, cx: "50", cy: "50", r: "45" })
+    /* @__PURE__ */ f(qa, { $size: n, viewBox: "0 0 100 100", children: [
+      /* @__PURE__ */ i(Qa, { $color: e, cx: "50", cy: "50", r: "45" }),
+      /* @__PURE__ */ i(Ja, { $color: e, cx: "50", cy: "50", r: "45" })
     ] }),
     t && /* @__PURE__ */ i(
       F,
@@ -9333,13 +9247,13 @@ const Ie = ({
       }
     )
   ] });
-}, il = {
+}, tl = {
   company: { height: "83px", width: "460px" },
   footer: { height: "57px", width: "315px" },
   header: { height: "35px", width: "160px" },
   icon: { height: "40px", width: "40px" },
   inline: { width: "150px" }
-}, hc = ({ publicId: e, variant: t }) => /* @__PURE__ */ i($, { ...il[t], children: /* @__PURE__ */ i(ue, { alt: "logo", publicId: e }) }), rl = x(Ni).attrs(
+}, uc = ({ publicId: e, variant: t }) => /* @__PURE__ */ i($, { ...tl[t], children: /* @__PURE__ */ i(ue, { alt: "logo", publicId: e }) }), nl = x(Ni).attrs(
   ({ autoplay: e = !0 }) => ({
     autoplay: e,
     className: "comp-lottie"
@@ -9349,10 +9263,10 @@ const Ie = ({
     height: ${e}px;
     width: ${e}px;
   `}
-`, fc = (e) => {
+`, hc = (e) => {
   const { size: t } = e;
-  return /* @__PURE__ */ i(rl, { $size: t, ...e });
-}, yc = ({
+  return /* @__PURE__ */ i(nl, { $size: t, ...e });
+}, fc = ({
   children: e,
   commitSha: t,
   commitShortSha: n,
@@ -9363,7 +9277,7 @@ const Ie = ({
   const s = E(), { userName: l, email: c, phone: d, userRole: p } = o;
   return de(r, () => {
     a(!1);
-  }), /* @__PURE__ */ f(la, { children: [
+  }), /* @__PURE__ */ f(oa, { children: [
     /* @__PURE__ */ i("li", { className: "user-info", children: /* @__PURE__ */ f($, { display: "inline-flex", gap: 0.25, width: "100%", children: [
       /* @__PURE__ */ f(
         $,
@@ -9401,7 +9315,7 @@ const Ie = ({
       }
     ) })
   ] });
-}, ol = x.button`
+}, il = x.button`
   align-items: center;
   background-color: transparent;
   border: unset;
@@ -9418,7 +9332,7 @@ const Ie = ({
   &:hover span {
     color: ${A.palette.primary[200]};
   }
-`, bc = ({
+`, yc = ({
   message: e,
   onClickButton: t,
   buttonText: n,
@@ -9434,7 +9348,7 @@ const Ie = ({
   G(() => {
     p(o);
   }, [o, p]);
-  const u = /* @__PURE__ */ f(ol, { onClick: t, children: [
+  const u = /* @__PURE__ */ f(il, { onClick: t, children: [
     /* @__PURE__ */ i(
       F,
       {
@@ -9485,7 +9399,7 @@ const Ie = ({
       ]
     }
   );
-}, al = x.div`
+}, rl = x.div`
   ${({ theme: e, $variant: t }) => `
     background: ${e.palette.white};
     border: 1px solid ${e.palette.gray[200]};
@@ -9504,9 +9418,9 @@ const Ie = ({
       right: 16px;
     }
   `}
-`, ll = x(le)`
+`, ol = x(le)`
   font-size: 14px;
-`, sl = x.div`
+`, al = x.div`
   ${({ theme: e, $variant: t }) => `
     height: ${e.spacing[2.5]};
     width: ${e.spacing[2.5]};
@@ -9537,7 +9451,7 @@ const Ie = ({
       color: ${e.palette[t][500]};
     }
   `}
-`, cl = (e) => e === "warning" ? "triangle-exclamation" : e === "info" ? "circle-info" : e === "success" ? "circle-check" : "circle-exclamation", $c = ({
+`, ll = (e) => e === "warning" ? "triangle-exclamation" : e === "info" ? "circle-info" : e === "success" ? "circle-check" : "circle-exclamation", bc = ({
   description: e,
   onClose: t,
   title: n,
@@ -9547,19 +9461,19 @@ const Ie = ({
     t == null || t();
   }, [t]);
   return /* @__PURE__ */ f(
-    al,
+    rl,
     {
       $variant: r,
       className: `notification notification__${r}`,
       role: "alertdialog",
       children: [
-        /* @__PURE__ */ f(sl, { $variant: r, children: [
+        /* @__PURE__ */ f(al, { $variant: r, children: [
           /* @__PURE__ */ i(j, { icon: "circle", iconClass: "ellipse-1", iconSize: "lg" }),
           /* @__PURE__ */ i(j, { icon: "circle", iconClass: "ellipse-2", iconSize: "lg" }),
           /* @__PURE__ */ i(
             j,
             {
-              icon: cl(r),
+              icon: ll(r),
               iconClass: "icon",
               iconSize: "lg",
               iconType: "fa-light"
@@ -9567,7 +9481,7 @@ const Ie = ({
           )
         ] }),
         /* @__PURE__ */ f($, { pr: 1.5, children: [
-          /* @__PURE__ */ i(ll, { fontWeight: "bold", size: "xs", children: n }),
+          /* @__PURE__ */ i(ol, { fontWeight: "bold", size: "xs", children: n }),
           /* @__PURE__ */ i(F, { size: "sm", whiteSpace: "break-spaces", wordWrap: "break-word", children: e })
         ] }),
         /* @__PURE__ */ i(
@@ -9587,7 +9501,87 @@ const Ie = ({
       ]
     }
   );
-}, dl = {
+}, sl = x.div`
+  width: fit-content;
+  border: ${({ theme: e }) => `1px solid ${e.palette.gray[300]}`};
+  border-radius: 4px;
+  background: none;
+  color: ${({ theme: e }) => e.palette.black};
+  font-family: ${({ theme: e }) => e.typography.type.primary};
+  font-size: ${({ theme: e }) => e.typography.text.md};
+  height: 40px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.5em;
+`, cl = x.input`
+  width: 4em;
+  appearance: textfield;
+  border-style: none;
+  padding: 0.5rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 0.5rem;
+  background: none;
+
+  &:focus {
+    border-color: unset;
+    box-shadow: none;
+    outline: none;
+  }
+
+  &::-webkit-outer-spin-button,
+  &::-webkit-inner-spin-button {
+    opacity: 1;
+  }
+`, $c = Z(function({
+  autoUpdate: t = !1,
+  decimalPlaces: n = 0,
+  defaultValue: r = 0,
+  max: o,
+  min: a,
+  name: s,
+  onEnter: l,
+  tooltipMessage: c,
+  ...d
+}, p) {
+  const g = n < 0 ? 0 : n, [u, h] = R(Number(r).toFixed(g)), y = w(
+    (k) => {
+      const v = H.toNumber(k.target.value);
+      k.target.value.endsWith(".") ? h(k.target.value) : v >= Number(a) && v <= Number(o) && (h(String(v)), t && l(H.toNumber(v.toFixed(g)))), k.stopPropagation();
+    },
+    [t, g, o, a, l]
+  ), m = w(
+    (k) => {
+      k.currentTarget.contains(k.relatedTarget) || h(Number(r).toFixed(g)), k.stopPropagation();
+    },
+    [g, r]
+  ), b = w(
+    (k) => {
+      k.stopPropagation(), k.key === "Enter" && !H.isEmpty(k.currentTarget.value) && l(H.toNumber(k.currentTarget.value));
+    },
+    [l]
+  );
+  return /* @__PURE__ */ i(sl, { onBlur: m, tabIndex: -1, children: /* @__PURE__ */ i(J, { id: "numberInputTooltip", tip: c, children: /* @__PURE__ */ i(
+    cl,
+    {
+      ...d,
+      "aria-label": s,
+      "aria-valuemax": Number(o),
+      "aria-valuemin": Number(a),
+      "aria-valuenow": Number(u),
+      max: o,
+      min: a,
+      name: s,
+      onChange: y,
+      onKeyUp: b,
+      ref: p,
+      step: 10 ** -g,
+      type: "number",
+      value: u
+    }
+  ) }) });
+}), dl = {
   Azure: "integrates/autoenrollment/azureIcon",
   Bitbucket: "integrates/autoenrollment/bitbucketLogo",
   GitHub: "integrates/autoenrollment/githubLogo",
@@ -11095,7 +11089,7 @@ const Ie = ({
         visible: g.getIsVisible()
       };
     }
-  ), [l]), d = Do({
+  ), [l]), d = To({
     columnOrder: (n == null ? void 0 : n.defaultColumnOrder) ?? [],
     items: c,
     name: "table-column-management",
@@ -11120,7 +11114,7 @@ const Ie = ({
       }
     ),
     /* @__PURE__ */ i(
-      ya,
+      ha,
       {
         modalRef: d,
         title: "Manage columns",
@@ -11591,7 +11585,7 @@ const Ie = ({
       display: "flex",
       justify: "center",
       width: "100%",
-      children: /* @__PURE__ */ i(nl, { size: "md" })
+      children: /* @__PURE__ */ i(el, { size: "md" })
     }
   ) }) }) }) : (t == null ? void 0 : t.getRowModel().rows.length) === 0 ? /* @__PURE__ */ i("tbody", { children: /* @__PURE__ */ i("tr", { className: "row-no-data", "data-testid": "row-no-data", children: /* @__PURE__ */ i("td", { colSpan: t.getVisibleLeafColumns().length + 1, children: /* @__PURE__ */ i(
     F,
@@ -12304,25 +12298,25 @@ export {
   Be as B,
   st as C,
   Ts as D,
-  nc as E,
-  ic as F,
+  tc as E,
+  nc as F,
   $ as G,
-  rc as H,
+  ic as H,
   ke as I,
-  oc as J,
-  ac as K,
+  rc as J,
+  oc as K,
   Dr as L,
   ue as M,
-  lc as N,
-  sc as O,
-  cc as P,
-  dc as Q,
+  ac as N,
+  lc as O,
+  sc as P,
+  cc as Q,
   j as R,
   _ as S,
-  pc as T,
-  gc as U,
+  dc as T,
+  pc as U,
   Q as V,
-  Gs as W,
+  Us as W,
   pn as X,
   js as Y,
   ut as Z,
@@ -12332,10 +12326,10 @@ export {
   io as a0,
   Ls as a1,
   Bs as a2,
-  xo as a3,
+  bo as a3,
   Vs as a4,
-  mo as a5,
-  _s as a6,
+  $o as a5,
+  Gs as a6,
   As as a7,
   Ps as a8,
   Ws as a9,
@@ -12360,7 +12354,7 @@ export {
   oe as aS,
   ws as aT,
   Rc as aU,
-  Ao as aV,
+  jo as aV,
   J as aW,
   jc as aX,
   Lc as aY,
@@ -12372,44 +12366,44 @@ export {
   po as ad,
   se as ae,
   Ge as af,
-  la as ag,
-  uc as ah,
-  nl as ai,
-  hc as aj,
-  fc as ak,
-  yc as al,
-  bc as am,
+  oa as ag,
+  gc as ah,
+  el as ai,
+  uc as aj,
+  hc as ak,
+  fc as al,
+  yc as am,
   mn as an,
-  Qo as ao,
-  qo as ap,
-  ya as aq,
-  za as ar,
-  ec as as,
-  tc as at,
-  Ta as au,
-  $c as av,
-  ra as aw,
-  $o as ax,
+  qo as ao,
+  Zo as ap,
+  ha as aq,
+  Ca as ar,
+  Qs as as,
+  ec as at,
+  za as au,
+  bc as av,
+  na as aw,
+  $c as ax,
   xc as ay,
   Mt as az,
   rn as b,
   hs as b$,
-  Io as b0,
-  To as b1,
+  So as b0,
+  zo as b1,
   de as b2,
-  Do as b3,
+  To as b3,
   hn as b4,
   Ue as b5,
-  Ks as b6,
+  Ys as b6,
   cr as b7,
   dn as b8,
   Ve as b9,
-  wa as bA,
+  xa as bA,
   Ot as bB,
-  Sa as bC,
+  ka as bC,
   Ie as bD,
   Wt as bE,
-  Ya as bF,
+  Ga as bF,
   wn as bG,
   $l as bH,
   kl as bI,
@@ -12448,15 +12442,15 @@ export {
   jt as bo,
   Lt as bp,
   tt as bq,
-  Us as br,
-  Uo as bs,
-  Jo as bt,
-  oa as bu,
-  ca as bv,
-  pa as bw,
-  fa as bx,
-  xa as by,
-  ma as bz,
+  yo as br,
+  Bo as bs,
+  Xo as bt,
+  ia as bu,
+  la as bv,
+  ca as bw,
+  ua as bx,
+  ba as by,
+  $a as bz,
   on as c,
   ys as c0,
   We as d,
@@ -12470,16 +12464,16 @@ export {
   Fs as l,
   Es as m,
   V as n,
-  Ys as o,
+  _s as o,
   Rs as p,
-  Zs as q,
-  Xs as r,
+  Ks as q,
+  Zs as r,
   je as s,
-  qs as t,
-  Js as u,
+  Xs as t,
+  qs as u,
   ae as v,
   fe as w,
-  Qs as x,
+  Js as x,
   Ns as y,
   A as z
 };