@devtron-labs/devtron-fe-common-lib 0.0.55-beta-1 → 0.0.55-beta-3

package/dist/Common/InfoColorBar/InfoColourbar.js

@@ -1,65 +1,65 @@
 import "../../assets/InfoColourbar.css";
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
-import { Link as _ } from "react-router-dom";
-function b({
-  message: c,
-  classname: l,
-  Icon: d,
-  iconClass: t,
-  iconSize: i,
-  renderActionButton: o,
-  linkText: e,
-  redirectLink: a,
-  linkOnClick: n,
-  linkClass: f,
+import { j as r } from "../../jsx-runtime-0dcb030c.js";
+import { Link as u } from "react-router-dom";
+function j({
+  message: i,
+  classname: c,
+  Icon: l,
+  iconClass: d,
+  iconSize: o,
+  renderActionButton: n,
+  linkText: s,
+  redirectLink: e,
+  linkOnClick: a,
+  linkClass: t,
   internalLink: m,
-  styles: p
+  styles: f
 }) {
-  const u = () => {
-    if (e) {
-      if (a)
-        return m ? /* @__PURE__ */ r(
-          _,
+  const p = () => {
+    if (s) {
+      if (e)
+        return m ? /* @__PURE__ */ r.jsx(
+          u,
           {
-            to: a,
-            onClick: n,
+            to: e,
+            onClick: a,
             "data-testid": "info-bar-internal-link",
             className: "cursor dc__link dc__underline-onhover mr-5",
-            children: e
+            children: s
           }
-        ) : /* @__PURE__ */ r(
+        ) : /* @__PURE__ */ r.jsx(
           "a",
           {
-            href: a,
+            href: e,
             target: "_blank",
-            onClick: n,
+            onClick: a,
             "data-testid": "info-bar-redirectLink",
             className: "cursor dc__link dc__underline-onhover mr-5",
-            children: e
+            children: s
           }
         );
     } else
       return null;
-    return n && /* @__PURE__ */ r("div", { onClick: n, className: "cursor dc__link dc__underline-onhover", "data-testid": "info-bar-linkText", children: e });
+    return a && /* @__PURE__ */ r.jsx("div", { onClick: a, className: "cursor dc__link dc__underline-onhover", "data-testid": "info-bar-linkText", children: s });
   };
-  return /* @__PURE__ */ r("div", { className: "info-bar-container", children: /* @__PURE__ */ s(
+  return /* @__PURE__ */ r.jsx("div", { className: "info-bar-container", children: /* @__PURE__ */ r.jsxs(
     "div",
     {
-      className: `${l} info_text flex dc__content-space pt-8 pb-8 pl-12 pr-12 br-4 top fs-13 fw-4`,
-      style: p,
+      className: `${c} info_text flex dc__content-space pt-8 pb-8 pl-12 pr-12 br-4 top fs-13 fw-4`,
+      style: f,
       children: [
-        /* @__PURE__ */ s("div", { className: `flex top ${typeof o == "function" ? "mr-5" : ""}`, children: [
-          /* @__PURE__ */ r("div", { className: `icon-dim-${i ?? "20"} mr-10`, children: /* @__PURE__ */ r(d, { className: `icon-dim-${i ?? "20"} ${t || ""} mr-8` }) }),
-          /* @__PURE__ */ s("div", { className: `info-bar-message-wrapper ${f || ""}`, children: [
-            /* @__PURE__ */ r("span", { className: e && a ? "mr-5" : "", children: c }),
-            u()
+        /* @__PURE__ */ r.jsxs("div", { className: `flex top ${typeof n == "function" ? "mr-5" : ""}`, children: [
+          /* @__PURE__ */ r.jsx("div", { className: `icon-dim-${o ?? "20"} mr-10`, children: /* @__PURE__ */ r.jsx(l, { className: `icon-dim-${o ?? "20"} ${d || ""} mr-8` }) }),
+          /* @__PURE__ */ r.jsxs("div", { className: `info-bar-message-wrapper ${t || ""}`, children: [
+            /* @__PURE__ */ r.jsx("span", { className: s && e ? "mr-5" : "", children: i }),
+            p()
           ] })
         ] }),
-        typeof o == "function" && o()
+        typeof n == "function" && n()
       ]
     }
   ) });
 }
 export {
-  b as default
+  j as default
 };

package/dist/Common/Modals/Modal.js

@@ -1,6 +1,6 @@
-import { jsx as u } from "react/jsx-runtime";
+import { j as u } from "../../jsx-runtime-0dcb030c.js";
 import m, { useEffect as p } from "react";
-import { R as v } from "../../index-5a231705.js";
+import v from "react-dom";
 const g = ({
   style: d = {},
   children: l,
@@ -9,23 +9,23 @@ const g = ({
   onClick: n = null,
   callbackRef: i = null,
   preventWheelDisable: o = !1,
-  noBackDrop: r
+  noBackDrop: s
 }) => {
   const t = m.useRef(null);
-  function s(e) {
+  function r(e) {
     typeof n == "function" && (t && t.current?.contains(e.target) ? n(e, "in") : n(e, "out"));
   }
   function a(e) {
     o || (t?.current.contains(e.target) ? t.current.clientHeight === t.current.scrollHeight && e.preventDefault() : e.preventDefault());
   }
   return p(() => {
-    document.addEventListener("click", s);
+    document.addEventListener("click", r);
     let e = document.getElementById("visible-modal");
-    return e && e.classList.add("show"), r && e.classList.add("no-back-drop"), o || document.body.addEventListener("wheel", a, { passive: !1 }), () => {
-      o || document.body.removeEventListener("wheel", a), document.removeEventListener("click", s), e && e.classList.remove("show"), r && e.classList.remove("no-back-drop");
+    return e && e.classList.add("show"), s && e.classList.add("no-back-drop"), o || document.body.addEventListener("wheel", a, { passive: !1 }), () => {
+      o || document.body.removeEventListener("wheel", a), document.removeEventListener("click", r), e && e.classList.remove("show"), s && e.classList.remove("no-back-drop");
     };
   }, []), v.createPortal(
-    /* @__PURE__ */ u(
+    /* @__PURE__ */ u.jsx(
       "div",
       {
         tabIndex: 0,

package/dist/Common/Modals/OpaqueModal.js

@@ -1,14 +1,14 @@
 var c = Object.defineProperty;
-var i = (s, e, o) => e in s ? c(s, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : s[e] = o;
-var t = (s, e, o) => (i(s, typeof e != "symbol" ? e + "" : e, o), o);
-import { jsxs as m, jsx as a } from "react/jsx-runtime";
-import n from "react";
-import { R as d } from "../../index-5a231705.js";
-import { c as r } from "../../ic-cross-0e71861d.js";
-class w extends n.Component {
+var i = (o, e, s) => e in o ? c(o, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : o[e] = s;
+var a = (o, e, s) => (i(o, typeof e != "symbol" ? e + "" : e, s), s);
+import { j as t } from "../../jsx-runtime-0dcb030c.js";
+import m from "react";
+import n from "react-dom";
+import { c as d } from "../../ic-cross-0e71861d.js";
+class g extends m.Component {
   constructor() {
     super(...arguments);
-    t(this, "modalRef", document.getElementById("full-screen-modal"));
+    a(this, "modalRef", document.getElementById("full-screen-modal"));
   }
   componentDidMount() {
     this.props.noBackground ? this.modalRef.classList.add("show") : this.modalRef.classList.add("show-with-bg");
@@ -17,16 +17,16 @@ class w extends n.Component {
     this.modalRef.classList.remove("show"), this.modalRef.classList.remove("show-with-bg");
   }
   render() {
-    const { className: o = "", onHide: l = null } = { ...this.props };
-    return d.createPortal(
-      /* @__PURE__ */ m("div", { className: `full-screen-modal__body-container ${o}`, children: [
+    const { className: s = "", onHide: l = null } = { ...this.props };
+    return n.createPortal(
+      /* @__PURE__ */ t.jsxs("div", { className: `full-screen-modal__body-container ${s}`, children: [
         this.props.children,
-        typeof l == "function" && /* @__PURE__ */ a("div", { className: "close-btn icon-dim-24", onClick: (f) => l(!1), "data-testid": "opaque-modal-close", children: /* @__PURE__ */ a("img", { className: "close-img", src: r, alt: "close" }) })
+        typeof l == "function" && /* @__PURE__ */ t.jsx("div", { className: "close-btn icon-dim-24", onClick: (r) => l(!1), "data-testid": "opaque-modal-close", children: /* @__PURE__ */ t.jsx("img", { className: "close-img", src: d, alt: "close" }) })
       ] }),
       document.getElementById("full-screen-modal")
     );
   }
 }
 export {
-  w as OpaqueModal
+  g as OpaqueModal
 };

package/dist/Common/Modals/VisibleModal.js

@@ -1,9 +1,9 @@
 var i = Object.defineProperty;
 var a = (o, e, s) => e in o ? i(o, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : o[e] = s;
 var t = (o, e, s) => (a(o, typeof e != "symbol" ? e + "" : e, s), s);
-import { jsx as n } from "react/jsx-runtime";
+import { j as n } from "../../jsx-runtime-0dcb030c.js";
 import l from "react";
-import { R as r } from "../../index-5a231705.js";
+import r from "react-dom";
 class h extends l.Component {
   constructor(s) {
     super(s);
@@ -21,7 +21,7 @@ class h extends l.Component {
   }
   render() {
     return r.createPortal(
-      /* @__PURE__ */ n("div", { className: `visible-modal__body ${this.props.className}`, onClick: this.props?.close, "data-testid": "visible-modal-close", children: this.props.children }),
+      /* @__PURE__ */ n.jsx("div", { className: `visible-modal__body ${this.props.className}`, onClick: this.props?.close, "data-testid": "visible-modal-close", children: this.props.children }),
       document.getElementById("visible-modal")
     );
   }

package/dist/Common/Modals/VisibleModal2.js

@@ -1,13 +1,13 @@
 var i = Object.defineProperty;
-var n = (s, o, e) => o in s ? i(s, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[o] = e;
-var t = (s, o, e) => (n(s, typeof o != "symbol" ? o + "" : o, e), e);
-import { jsx as c } from "react/jsx-runtime";
+var n = (t, s, e) => s in t ? i(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
+var o = (t, s, e) => (n(t, typeof s != "symbol" ? s + "" : s, e), e);
+import { j as c } from "../../jsx-runtime-0dcb030c.js";
 import d from "react";
-import { R as l } from "../../index-5a231705.js";
-class p extends d.Component {
+import l from "react-dom";
+class h extends d.Component {
   constructor(e) {
     super(e);
-    t(this, "modalRef", document.getElementById("visible-modal-2"));
+    o(this, "modalRef", document.getElementById("visible-modal-2"));
     this.escFunction = this.escFunction.bind(this);
   }
   escFunction(e) {
@@ -21,11 +21,11 @@ class p extends d.Component {
   }
   render() {
     return l.createPortal(
-      /* @__PURE__ */ c("div", { className: `visible-modal__body ${this.props.className}`, onClick: this.props?.close, "data-testid": "visible-modal2-close", children: this.props.children }),
+      /* @__PURE__ */ c.jsx("div", { className: `visible-modal__body ${this.props.className}`, onClick: this.props?.close, "data-testid": "visible-modal2-close", children: this.props.children }),
       document.getElementById("visible-modal-2")
     );
   }
 }
 export {
-  p as VisibleModal2
+  h as VisibleModal2
 };

package/dist/Common/MultiSelectCustomization.js

@@ -1,66 +1,66 @@
-import { jsxs as c, jsx as l } from "react/jsx-runtime";
-import { c as a, R as f } from "../react-select.esm-27b8d563.js";
-import * as r from "react";
-const u = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 28 28", width: 24, height: 24, ...e }, /* @__PURE__ */ r.createElement("g", { fill: "none", fillRule: "evenodd", transform: "translate(2 2)" }, /* @__PURE__ */ r.createElement("rect", { width: 20, height: 20, fill: "#B1B7BC", rx: 10 }), /* @__PURE__ */ r.createElement("path", { fill: "#FFF", fillRule: "nonzero", d: "M6.464 6.464a1 1 0 0 1 1.415 0l2.12 2.12 2.122-2.12a1 1 0 0 1 1.32-.083l.095.083a1 1 0 0 1 0 1.415l-2.122 2.12 2.122 2.122a1 1 0 0 1 .083 1.32l-.083.095a1 1 0 0 1-1.415 0L10 11.414l-2.121 2.122a1 1 0 0 1-1.32.083l-.095-.083a1 1 0 0 1 0-1.415L8.584 10l-2.12-2.121a1 1 0 0 1-.083-1.32z" }))), g = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", ...e }, /* @__PURE__ */ r.createElement("g", { fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ r.createElement("path", { stroke: "#06C", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3.898 12.564l4.95 4.95L19.455 6.906" }))), v = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 21, viewBox: "0 0 20 21", ...e }, /* @__PURE__ */ r.createElement("g", { fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ r.createElement("path", { fill: "#FDE7E7", stroke: "#F33E3E", strokeLinejoin: "round", strokeWidth: 2, d: "M10 1.667C5.4 1.667 1.667 5.4 1.667 10S5.4 18.333 10 18.333 18.333 14.6 18.333 10 14.6 1.667 10 1.667z" }), /* @__PURE__ */ r.createElement("path", { fill: "#F33E3E", d: "M10 10.833c.46 0 .833-.373.833-.833V6.667c0-.46-.373-.834-.833-.834-.46 0-.833.373-.833.834V10c0 .46.373.833.833.833zm0 3.334c.46 0 .833-.373.833-.834 0-.46-.373-.833-.833-.833-.46 0-.833.373-.833.833 0 .46.373.834.833.834z" }))), E = (e) => {
+import { j as l } from "../jsx-runtime-0dcb030c.js";
+import { c, R as x } from "../react-select.esm-97f26847.js";
+import * as i from "react";
+const h = (e) => /* @__PURE__ */ i.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 28 28", width: 24, height: 24, ...e }, /* @__PURE__ */ i.createElement("g", { fill: "none", fillRule: "evenodd", transform: "translate(2 2)" }, /* @__PURE__ */ i.createElement("rect", { width: 20, height: 20, fill: "#B1B7BC", rx: 10 }), /* @__PURE__ */ i.createElement("path", { fill: "#FFF", fillRule: "nonzero", d: "M6.464 6.464a1 1 0 0 1 1.415 0l2.12 2.12 2.122-2.12a1 1 0 0 1 1.32-.083l.095.083a1 1 0 0 1 0 1.415l-2.122 2.12 2.122 2.122a1 1 0 0 1 .083 1.32l-.083.095a1 1 0 0 1-1.415 0L10 11.414l-2.121 2.122a1 1 0 0 1-1.32.083l-.095-.083a1 1 0 0 1 0-1.415L8.584 10l-2.12-2.121a1 1 0 0 1-.083-1.32z" }))), p = (e) => /* @__PURE__ */ i.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", ...e }, /* @__PURE__ */ i.createElement("g", { fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ i.createElement("path", { stroke: "#06C", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3.898 12.564l4.95 4.95L19.455 6.906" }))), f = (e) => /* @__PURE__ */ i.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 21, viewBox: "0 0 20 21", ...e }, /* @__PURE__ */ i.createElement("g", { fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ i.createElement("path", { fill: "#FDE7E7", stroke: "#F33E3E", strokeLinejoin: "round", strokeWidth: 2, d: "M10 1.667C5.4 1.667 1.667 5.4 1.667 10S5.4 18.333 10 18.333 18.333 14.6 18.333 10 14.6 1.667 10 1.667z" }), /* @__PURE__ */ i.createElement("path", { fill: "#F33E3E", d: "M10 10.833c.46 0 .833-.373.833-.833V6.667c0-.46-.373-.834-.833-.834-.46 0-.833.373-.833.834V10c0 .46.373.833.833.833zm0 3.334c.46 0 .833-.373.833-.834 0-.46-.373-.833-.833-.833-.46 0-.833.373-.833.833 0 .46.373.834.833.834z" }))), w = (e) => {
   const { selectOption: t, data: n } = e;
-  return /* @__PURE__ */ c("div", { className: "flex left pl-12", style: { background: e.isFocused ? "var(--N100)" : "transparent" }, children: [
-    /* @__PURE__ */ l(
+  return /* @__PURE__ */ l.jsxs("div", { className: "flex left pl-12", style: { background: e.isFocused ? "var(--N100)" : "transparent" }, children: [
+    /* @__PURE__ */ l.jsx(
       "input",
       {
         checked: e.isSelected,
         disabled: e.isDisabled,
-        onChange: (i) => t(n),
+        onChange: (s) => t(n),
         type: "checkbox",
         style: { height: "16px", width: "16px", flex: "0 0 16px" },
         className: "mr-8"
       }
     ),
-    /* @__PURE__ */ l(a.Option, { ...e })
+    /* @__PURE__ */ l.jsx(c.Option, { ...e })
   ] });
-}, C = (e) => {
-  const { selectOption: t, data: n } = e, i = { height: "16px", width: "16px", flex: "0 0 16px" }, o = (s) => t(n);
-  return /* @__PURE__ */ c("div", { className: "flex left pl-12", style: { background: e.isFocused ? "var(--N100)" : "transparent" }, children: [
-    e.isSelected ? /* @__PURE__ */ l(g, { onClick: o, className: "mr-8 icon-dim-16", style: i }) : /* @__PURE__ */ l("span", { onClick: o, className: "mr-8", style: i }),
-    /* @__PURE__ */ l(a.Option, { ...e })
+}, j = (e) => {
+  const { selectOption: t, data: n } = e, s = { height: "16px", width: "16px", flex: "0 0 16px" }, r = (o) => t(n);
+  return /* @__PURE__ */ l.jsxs("div", { className: "flex left pl-12", style: { background: e.isFocused ? "var(--N100)" : "transparent" }, children: [
+    e.isSelected ? /* @__PURE__ */ l.jsx(p, { onClick: r, className: "mr-8 icon-dim-16", style: s }) : /* @__PURE__ */ l.jsx("span", { onClick: r, className: "mr-8", style: s }),
+    /* @__PURE__ */ l.jsx(c.Option, { ...e })
   ] });
-}, k = (e) => {
-  const { children: t, data: n, innerProps: i, selectProps: o } = e, { label: s, value: d } = n;
-  return /* @__PURE__ */ c(a.MultiValueContainer, { data: n, innerProps: i, selectProps: o, children: [
-    /* @__PURE__ */ l("div", { className: "flex fs-12 ml-4 cn-9", children: s }),
+}, E = (e) => {
+  const { children: t, data: n, innerProps: s, selectProps: r } = e, { label: o, value: a } = n;
+  return /* @__PURE__ */ l.jsxs(c.MultiValueContainer, { data: n, innerProps: s, selectProps: r, children: [
+    /* @__PURE__ */ l.jsx("div", { className: "flex fs-12 ml-4 cn-9", children: o }),
     t[1]
   ] });
-}, N = (e) => {
+}, C = (e) => {
   const {
-    children: t = /* @__PURE__ */ l(u, { className: "icon-dim-24" }),
+    children: t = /* @__PURE__ */ l.jsx(h, { className: "icon-dim-24" }),
     getStyles: n,
-    innerProps: { ref: i, ...o }
+    innerProps: { ref: s, ...r }
   } = e;
-  return /* @__PURE__ */ l("div", { ...o, ref: i, style: n("clearIndicator", e), children: /* @__PURE__ */ l("div", { className: "flex pointer", children: t }) });
-}, S = (e) => {
+  return /* @__PURE__ */ l.jsx("div", { ...r, ref: s, style: n("clearIndicator", e), children: /* @__PURE__ */ l.jsx("div", { className: "flex pointer", children: t }) });
+}, k = (e) => {
   const {
     data: t,
-    innerProps: { onClick: n, onMouseDown: i },
-    selectProps: o
+    innerProps: { onClick: n, onMouseDown: s },
+    selectProps: r
   } = e;
-  return /* @__PURE__ */ l(a.MultiValueRemove, { ...e, children: /* @__PURE__ */ l(
-    u,
+  return /* @__PURE__ */ l.jsx(c.MultiValueRemove, { ...e, children: /* @__PURE__ */ l.jsx(
+    h,
     {
       onClick: n,
-      onMouseDown: i,
-      onClick: (s) => n(t),
+      onMouseDown: s,
+      onClick: (o) => n(t),
       style: { height: "18px", width: "18px" }
     }
   ) });
-}, b = ({ validator: e, isAllSelected: t = !1, ...n }) => {
-  const { children: i, data: o, innerProps: s, selectProps: d } = n, { label: p, value: h } = o, m = e ? e(h) : !0;
-  return t && h !== "*" ? null : /* @__PURE__ */ c(a.MultiValueContainer, { data: o, innerProps: s, selectProps: d, children: [
-    /* @__PURE__ */ c("div", { className: "flex left fs-12 pl-4 pr-4 dc__ellipsis-right", children: [
-      !m && /* @__PURE__ */ l(v, { className: "mr-4 icon-dim-16" }),
-      /* @__PURE__ */ l("div", { className: `dc__ellipsis-right ${m ? "cn-9" : "cr-5"}`, children: p })
+}, N = ({ validator: e, isAllSelected: t = !1, ...n }) => {
+  const { children: s, data: r, innerProps: o, selectProps: a } = n, { label: u, value: d } = r, m = e ? e(d) : !0;
+  return t && d !== "*" ? null : /* @__PURE__ */ l.jsxs(c.MultiValueContainer, { data: r, innerProps: o, selectProps: a, children: [
+    /* @__PURE__ */ l.jsxs("div", { className: "flex left fs-12 pl-4 pr-4 dc__ellipsis-right", children: [
+      !m && /* @__PURE__ */ l.jsx(f, { className: "mr-4 icon-dim-16" }),
+      /* @__PURE__ */ l.jsx("div", { className: `dc__ellipsis-right ${m ? "cn-9" : "cr-5"}`, children: u })
     ] }),
-    i[1]
+    s[1]
   ] });
-}, M = {
+}, S = {
   control: (e, t) => ({
     ...e,
     cursor: t.isDisabled ? "not-allowed" : "normal",
@@ -84,14 +84,14 @@ const u = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.
     ...e,
     color: t.selectProps.menuIsOpen ? "var(--N500)" : e.color
   })
-}, F = (e) => /* @__PURE__ */ l(f, { ...e });
+}, b = (e) => /* @__PURE__ */ l.jsx(x, { ...e });
 export {
-  N as ClearIndicator,
-  F as CustomSelect,
-  b as MultiValueChipContainer,
-  k as MultiValueContainer,
-  S as MultiValueRemove,
-  E as Option,
-  C as SingleSelectOption,
-  M as multiSelectStyles
+  C as ClearIndicator,
+  b as CustomSelect,
+  N as MultiValueChipContainer,
+  E as MultiValueContainer,
+  k as MultiValueRemove,
+  w as Option,
+  j as SingleSelectOption,
+  S as multiSelectStyles
 };

package/dist/Common/Pagination/PageSizeSelector.js

@@ -1,49 +1,52 @@
-import { jsxs as m, jsx as s } from "react/jsx-runtime";
-import { useState as f, useRef as g } from "react";
-import "../../Helper-e1262739.js";
+import { j as e } from "../../jsx-runtime-0dcb030c.js";
+import { useState as m, useRef as x } from "react";
+import "../../Helper-a0caa238.js";
 import "../Constants.js";
-import { useClickOutside as O } from "../Hooks/UseClickOutside/UseClickOutside.js";
-import { getDefaultPageValueOptions as S } from "./utils.js";
-const w = ({
-  optionValue: e,
-  options: o,
-  setOptions: c,
-  handleCloseDropdown: i,
+import { useClickOutside as j } from "../Hooks/UseClickOutside/UseClickOutside.js";
+import { getDefaultPageValueOptions as h } from "./utils.js";
+const g = ({
+  optionValue: s,
+  options: c,
+  setOptions: i,
+  handleCloseDropdown: r,
   changePageSize: n
-}) => /* @__PURE__ */ s("div", { className: "select__item", onClick: () => {
-  const a = o.map((l) => ({
-    value: l.value,
-    selected: l.value === e
-  }));
-  c([...a]), i(), n(e);
-}, children: e }, e), b = ({ pageSizeOptions: e, pageSize: o, changePageSize: c }) => {
-  const i = S(e).map((t) => ({
+}) => {
+  const o = () => {
+    const a = c.map((l) => ({
+      value: l.value,
+      selected: l.value === s
+    }));
+    i([...a]), r(), n(s);
+  };
+  return /* @__PURE__ */ e.jsx("div", { className: "select__item", onClick: o, children: s }, s);
+}, C = ({ pageSizeOptions: s, pageSize: c, changePageSize: i }) => {
+  const r = h(s).map((t) => ({
     value: t.value,
-    selected: t.value === o
-  })), [n, r] = f(!1), [a, l] = f(i), d = () => {
-    r(!1);
-  }, v = () => {
-    r(!n);
-  }, p = g(null);
-  O(p, d);
-  const u = a.find((t) => t.selected), h = n ? "fa fa-caret-up" : "fa fa-caret-down";
-  return /* @__PURE__ */ m("div", { ref: p, children: [
-    n && /* @__PURE__ */ s("div", { className: "pagination__select-menu", children: a.map((t) => /* @__PURE__ */ s(
-      w,
+    selected: t.value === c
+  })), [n, o] = m(!1), [a, l] = m(r), d = () => {
+    o(!1);
+  }, f = () => {
+    o(!n);
+  }, p = x(null);
+  j(p, d);
+  const u = a.find((t) => t.selected), v = n ? "fa fa-caret-up" : "fa fa-caret-down";
+  return /* @__PURE__ */ e.jsxs("div", { ref: p, children: [
+    n && /* @__PURE__ */ e.jsx("div", { className: "pagination__select-menu", children: a.map((t) => /* @__PURE__ */ e.jsx(
+      g,
       {
         optionValue: t.value,
         options: a,
         setOptions: l,
         handleCloseDropdown: d,
-        changePageSize: c
+        changePageSize: i
       }
     )) }),
-    /* @__PURE__ */ m("button", { type: "button", className: "select__button", onClick: v, children: [
-      /* @__PURE__ */ s("span", { children: u ? u.value : "" }),
-      /* @__PURE__ */ s("span", { className: "select__icon", children: /* @__PURE__ */ s("i", { className: h }) })
+    /* @__PURE__ */ e.jsxs("button", { type: "button", className: "select__button", onClick: f, children: [
+      /* @__PURE__ */ e.jsx("span", { children: u ? u.value : "" }),
+      /* @__PURE__ */ e.jsx("span", { className: "select__icon", children: /* @__PURE__ */ e.jsx("i", { className: v }) })
     ] })
   ] });
 };
 export {
-  b as default
+  C as default
 };

package/dist/Common/Pagination/Pagination.js

@@ -1,89 +1,92 @@
 import "../../assets/Pagination.css";
-import { jsxs as o, jsx as a } from "react/jsx-runtime";
-import { useState as k, useEffect as N } from "react";
-import y from "./PageSizeSelector.js";
-import { createPageArr as g } from "./utils.js";
-const C = ({ value: t, isSelected: s, selectPage: c }) => /* @__PURE__ */ a("li", { className: "page", children: /* @__PURE__ */ a("button", { className: s ? "page__button page__button--selected" : "page__button", onClick: () => {
-  c(t);
-}, type: "button", children: t }) }), E = ({
-  size: t,
-  pageSize: s,
+import { j as e } from "../../jsx-runtime-0dcb030c.js";
+import { useState as f, useEffect as p } from "react";
+import v from "./PageSizeSelector.js";
+import { createPageArr as u } from "./utils.js";
+const k = ({ value: a, isSelected: t, selectPage: c }) => {
+  const o = t ? "page__button page__button--selected" : "page__button", r = () => {
+    c(a);
+  };
+  return /* @__PURE__ */ e.jsx("li", { className: "page", children: /* @__PURE__ */ e.jsx("button", { className: o, onClick: r, type: "button", children: a }) });
+}, V = ({
+  size: a,
+  pageSize: t,
   offset: c,
-  changePage: u,
-  changePageSize: m,
-  isPageSizeFix: h,
-  pageSizeOptions: P,
+  changePage: o,
+  changePageSize: r,
+  isPageSizeFix: x,
+  pageSizeOptions: N,
   rootClassName: b
 }) => {
-  const [n, r] = k([]);
-  N(() => {
-    const e = g({ size: t, pageSize: s, selectedPageNo: 1 });
-    r(e);
-  }, [t, s]), N(() => {
-    const e = 1 + Math.floor(c / s), l = g({ size: t, pageSize: s, selectedPageNo: e });
-    r(l);
-  }, [c]);
-  const i = (e) => {
-    const l = g({ size: t, pageSize: s, selectedPageNo: e });
-    r(l), u(e);
-  }, _ = () => {
-    const l = n.find((d) => d.selected).value - 1;
-    i(l);
-  }, f = () => {
-    const l = n.find((d) => d.selected).value + 1;
+  const [n, i] = f([]);
+  p(() => {
+    const s = u({ size: a, pageSize: t, selectedPageNo: 1 });
+    i(s);
+  }, [a, t]), p(() => {
+    const s = 1 + Math.floor(c / t), l = u({ size: a, pageSize: t, selectedPageNo: s });
     i(l);
-  }, v = c + s < t ? c + s : t, p = n.findIndex((e) => e.selected), x = n.filter((e) => e.isVisible);
+  }, [c]);
+  const d = (s) => {
+    const l = u({ size: a, pageSize: t, selectedPageNo: s });
+    i(l), o(s);
+  }, h = () => {
+    const l = n.find((g) => g.selected).value - 1;
+    d(l);
+  }, P = () => {
+    const l = n.find((g) => g.selected).value + 1;
+    d(l);
+  }, j = c + t < a ? c + t : a, m = n.findIndex((s) => s.selected), _ = n.filter((s) => s.isVisible);
   return (
     // TODO: Remove pagination-wrapper from dashboard
-    /* @__PURE__ */ o("div", { className: b || "", children: [
-      /* @__PURE__ */ o("div", { className: "page-number", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: b || "", children: [
+      /* @__PURE__ */ e.jsxs("div", { className: "page-number", children: [
         c + 1,
         " - ",
-        v,
+        j,
         " of ",
-        t
+        a
       ] }),
-      /* @__PURE__ */ o("ul", { className: "pagination", children: [
-        /* @__PURE__ */ a("li", { className: "page", children: /* @__PURE__ */ a(
+      /* @__PURE__ */ e.jsxs("ul", { className: "pagination", children: [
+        /* @__PURE__ */ e.jsx("li", { className: "page", children: /* @__PURE__ */ e.jsx(
           "button",
           {
             className: "page__button page__button--icon",
-            disabled: !p,
-            onClick: _,
+            disabled: !m,
+            onClick: h,
             type: "button",
             "aria-label": "Previous page",
-            children: /* @__PURE__ */ a("span", { className: "left-icon", children: /* @__PURE__ */ a("i", { className: "fa fa-chevron-left" }) })
+            children: /* @__PURE__ */ e.jsx("span", { className: "left-icon", children: /* @__PURE__ */ e.jsx("i", { className: "fa fa-chevron-left" }) })
           }
         ) }),
-        x.map((e) => /* @__PURE__ */ a(
-          C,
+        _.map((s) => /* @__PURE__ */ e.jsx(
+          k,
           {
-            value: e.value,
-            isSelected: e.selected,
-            selectPage: i
+            value: s.value,
+            isSelected: s.selected,
+            selectPage: d
           },
-          e.value
+          s.value
         )),
-        /* @__PURE__ */ a("li", { className: "page", children: /* @__PURE__ */ a(
+        /* @__PURE__ */ e.jsx("li", { className: "page", children: /* @__PURE__ */ e.jsx(
           "button",
           {
             className: "page__button page__button--icon",
-            disabled: p === n.length - 1,
-            onClick: f,
+            disabled: m === n.length - 1,
+            onClick: P,
             type: "button",
             "aria-label": "Next page",
-            children: /* @__PURE__ */ a("span", { className: "left-icon", children: /* @__PURE__ */ a("i", { className: "fa fa-chevron-right" }) })
+            children: /* @__PURE__ */ e.jsx("span", { className: "left-icon", children: /* @__PURE__ */ e.jsx("i", { className: "fa fa-chevron-right" }) })
           }
         ) })
       ] }),
-      !h && /* @__PURE__ */ o("div", { className: "select", children: [
-        /* @__PURE__ */ a("span", { className: "select__placeholder", children: "Rows per page" }),
-        /* @__PURE__ */ a(
-          y,
+      !x && /* @__PURE__ */ e.jsxs("div", { className: "select", children: [
+        /* @__PURE__ */ e.jsx("span", { className: "select__placeholder", children: "Rows per page" }),
+        /* @__PURE__ */ e.jsx(
+          v,
           {
-            pageSizeOptions: P,
-            pageSize: s,
-            changePageSize: m
+            pageSizeOptions: N,
+            pageSize: t,
+            changePageSize: r
           }
         )
       ] })
@@ -91,5 +94,5 @@ const C = ({ value: t, isSelected: s, selectPage: c }) => /* @__PURE__ */ a("li"
   );
 };
 export {
-  E as default
+  V as default
 };