jcicl 0.0.321 → 0.0.325

package/Button/Button.js

@@ -457,7 +457,6 @@ const S = s(j)`
   }
 `, eo = s(S)`
   background-color: ${r.colors.green};
-  border-radius: 0;
   height: 2.5rem;
   border: 2px solid transparent;
   color: ${r.colors.white};
@@ -507,7 +506,6 @@ const S = s(j)`
   })
 ), so = s(S)`
   background-color: ${r.colors.gold};
-  border-radius: 0;
   height: 2.5rem;
   border: 2px solid transparent;
   color: ${r.colors.midnight};
@@ -515,7 +513,7 @@ const S = s(j)`
   border-radius: 32px;
   font-weight: 400;
   padding: 0.75rem 2rem;
-  font-size: 19px;
+  font-size: 1rem;
   box-shadow: ${r.boxShadows.gray63};
   &:hover,
   :focus-visible {

package/LabeledCheckbox/LabeledCheckbox.d.ts

@@ -1,8 +1,11 @@
 import { CheckboxProps } from '@mui/material/Checkbox';
-export type LabeledCheckboxProps = {
+export interface StyleProps {
+    displayMode?: boolean;
+}
+export type LabeledCheckboxProps = StyleProps & CheckboxProps & {
     label: string;
     colon?: boolean;
     noLabel?: boolean;
-} & CheckboxProps;
+};
 export declare const LabeledCheckbox: React.FC<LabeledCheckboxProps>;
 export default LabeledCheckbox;

package/LabeledCheckbox/LabeledCheckbox.js

@@ -1,20 +1,20 @@
-import { jsxs as z, jsx as r } from "react/jsx-runtime";
-import { n as oe } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as te } from "../.chunks/emotion-react.browser.esm.js";
+import { jsxs as z, jsx as c } from "react/jsx-runtime";
+import { n as te } from "../.chunks/emotion-styled.browser.esm.js";
+import { c as T } from "../.chunks/emotion-react.browser.esm.js";
 import ae from "../theme.js";
 import * as v from "react";
-import { g as E, a as q, s as O, r as V, b as U, P as e, c as b, d as H, e as T, u as se } from "../.chunks/DefaultPropsProvider.js";
-import { u as ne } from "../.chunks/useFormControl.js";
-import { B as ce } from "../.chunks/ButtonBase.js";
-import { u as re } from "../.chunks/useControlled.js";
-import { r as D } from "../.chunks/TransitionGroupContext.js";
+import { g as q, a as V, s as O, r as U, b as H, P as e, c as b, d as D, e as L, u as ne } from "../.chunks/DefaultPropsProvider.js";
+import { u as se } from "../.chunks/useFormControl.js";
+import { B as re } from "../.chunks/ButtonBase.js";
+import { u as ce } from "../.chunks/useControlled.js";
+import { r as _ } from "../.chunks/TransitionGroupContext.js";
 import { c as P } from "../.chunks/createSvgIcon.js";
 import { m as ie } from "../.chunks/memoTheme.js";
-import { c as L } from "../.chunks/createSimplePaletteValueFilter.js";
+import { c as E } from "../.chunks/createSimplePaletteValueFilter.js";
 function le(o) {
-  return E("PrivateSwitchBase", o);
+  return q("PrivateSwitchBase", o);
 }
-q("PrivateSwitchBase", ["root", "checked", "disabled", "input", "edgeStart", "edgeEnd"]);
+V("PrivateSwitchBase", ["root", "checked", "disabled", "input", "edgeStart", "edgeEnd"]);
 const de = (o) => {
   const {
     classes: t,
@@ -25,8 +25,8 @@ const de = (o) => {
     root: ["root", a && "checked", s && "disabled", n && `edge${b(n)}`],
     input: ["input"]
   };
-  return H(l, le, t);
-}, pe = O(ce)({
+  return D(l, le, t);
+}, pe = O(re)({
   padding: 9,
   borderRadius: "50%",
   variants: [{
@@ -63,7 +63,7 @@ const de = (o) => {
     }
   }]
 }), ue = O("input", {
-  shouldForwardProp: V
+  shouldForwardProp: U
 })({
   cursor: "inherit",
   position: "absolute",
@@ -75,7 +75,7 @@ const de = (o) => {
   margin: 0,
   padding: 0,
   zIndex: 1
-}), _ = /* @__PURE__ */ v.forwardRef(function(t, a) {
+}), W = /* @__PURE__ */ v.forwardRef(function(t, a) {
   const {
     autoFocus: s,
     checked: n,
@@ -88,77 +88,77 @@ const de = (o) => {
     icon: w,
     id: B,
     inputProps: I,
-    inputRef: C,
-    name: y,
+    inputRef: y,
+    name: C,
     onBlur: f,
     onChange: h,
     onFocus: F,
-    readOnly: A,
-    required: G = !1,
-    tabIndex: J,
+    readOnly: G,
+    required: J = !1,
+    tabIndex: K,
     type: x,
-    value: j,
-    ...K
-  } = t, [$, Q] = re({
+    value: $,
+    ...Q
+  } = t, [j, X] = ce({
     controlled: n,
     default: !!d,
     name: "SwitchBase",
     state: "checked"
-  }), i = ne(), X = (c) => {
-    F && F(c), i && i.onFocus && i.onFocus(c);
-  }, Y = (c) => {
-    f && f(c), i && i.onBlur && i.onBlur(c);
-  }, Z = (c) => {
-    if (c.nativeEvent.defaultPrevented)
+  }), i = se(), Y = (r) => {
+    F && F(r), i && i.onFocus && i.onFocus(r);
+  }, Z = (r) => {
+    f && f(r), i && i.onBlur && i.onBlur(r);
+  }, ee = (r) => {
+    if (r.nativeEvent.defaultPrevented)
       return;
-    const M = c.target.checked;
-    Q(M), h && h(c, M);
+    const M = r.target.checked;
+    X(M), h && h(r, M);
   };
   let m = k;
   i && typeof m > "u" && (m = i.disabled);
-  const ee = x === "checkbox" || x === "radio", R = {
+  const oe = x === "checkbox" || x === "radio", R = {
     ...t,
-    checked: $,
+    checked: j,
     disabled: m,
     disableFocusRipple: g,
     edge: u
   }, N = de(R);
   return /* @__PURE__ */ z(pe, {
     component: "span",
-    className: U(N.root, p),
+    className: H(N.root, p),
     centerRipple: !0,
     focusRipple: !g,
     disabled: m,
     tabIndex: null,
     role: void 0,
-    onFocus: X,
-    onBlur: Y,
+    onFocus: Y,
+    onBlur: Z,
     ownerState: R,
     ref: a,
-    ...K,
-    children: [/* @__PURE__ */ r(ue, {
+    ...Q,
+    children: [/* @__PURE__ */ c(ue, {
       autoFocus: s,
       checked: n,
       defaultChecked: d,
       className: N.input,
       disabled: m,
-      id: ee ? B : void 0,
-      name: y,
-      onChange: Z,
-      readOnly: A,
-      ref: C,
-      required: G,
+      id: oe ? B : void 0,
+      name: C,
+      onChange: ee,
+      readOnly: G,
+      ref: y,
+      required: J,
       ownerState: R,
-      tabIndex: J,
+      tabIndex: K,
       type: x,
-      ...x === "checkbox" && j === void 0 ? {} : {
-        value: j
+      ...x === "checkbox" && $ === void 0 ? {} : {
+        value: $
       },
       ...I
-    }), $ ? l : w]
+    }), j ? l : w]
   });
 });
-process.env.NODE_ENV !== "production" && (_.propTypes = {
+process.env.NODE_ENV !== "production" && (W.propTypes = {
   /**
    * If `true`, the `input` element is focused during the first mount.
    */
@@ -215,7 +215,7 @@ process.env.NODE_ENV !== "production" && (_.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: D,
+  inputRef: _,
   /*
    * @ignore
    */
@@ -261,17 +261,17 @@ process.env.NODE_ENV !== "production" && (_.propTypes = {
    */
   value: e.any
 });
-const fe = P(/* @__PURE__ */ r("path", {
+const fe = P(/* @__PURE__ */ c("path", {
   d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-}), "CheckBoxOutlineBlank"), he = P(/* @__PURE__ */ r("path", {
+}), "CheckBoxOutlineBlank"), he = P(/* @__PURE__ */ c("path", {
   d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
-}), "CheckBox"), me = P(/* @__PURE__ */ r("path", {
+}), "CheckBox"), me = P(/* @__PURE__ */ c("path", {
   d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z"
 }), "IndeterminateCheckBox");
 function be(o) {
-  return E("MuiCheckbox", o);
+  return q("MuiCheckbox", o);
 }
-const S = q("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "colorPrimary", "colorSecondary", "sizeSmall", "sizeMedium"]), ke = (o) => {
+const S = V("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "colorPrimary", "colorSecondary", "sizeSmall", "sizeMedium"]), ke = (o) => {
   const {
     classes: t,
     indeterminate: a,
@@ -279,14 +279,14 @@ const S = q("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "col
     size: n
   } = o, l = {
     root: ["root", a && "indeterminate", `color${b(s)}`, `size${b(n)}`]
-  }, p = H(l, be, t);
+  }, p = D(l, be, t);
   return {
     ...t,
     // forward the disabled and checked classes to the SwitchBase
     ...p
   };
-}, ge = O(_, {
-  shouldForwardProp: (o) => V(o) || o === "classes",
+}, ge = O(W, {
+  shouldForwardProp: (o) => U(o) || o === "classes",
   name: "MuiCheckbox",
   slot: "Root",
   overridesResolver: (o, t) => {
@@ -306,20 +306,20 @@ const S = q("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "col
     },
     style: {
       "&:hover": {
-        backgroundColor: o.vars ? `rgba(${o.vars.palette.action.activeChannel} / ${o.vars.palette.action.hoverOpacity})` : T(o.palette.action.active, o.palette.action.hoverOpacity)
+        backgroundColor: o.vars ? `rgba(${o.vars.palette.action.activeChannel} / ${o.vars.palette.action.hoverOpacity})` : L(o.palette.action.active, o.palette.action.hoverOpacity)
       }
     }
-  }, ...Object.entries(o.palette).filter(L()).map(([t]) => ({
+  }, ...Object.entries(o.palette).filter(E()).map(([t]) => ({
     props: {
       color: t,
       disableRipple: !1
     },
     style: {
       "&:hover": {
-        backgroundColor: o.vars ? `rgba(${o.vars.palette[t].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : T(o.palette[t].main, o.palette.action.hoverOpacity)
+        backgroundColor: o.vars ? `rgba(${o.vars.palette[t].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : L(o.palette[t].main, o.palette.action.hoverOpacity)
       }
     }
-  })), ...Object.entries(o.palette).filter(L()).map(([t]) => ({
+  })), ...Object.entries(o.palette).filter(E()).map(([t]) => ({
     props: {
       color: t
     },
@@ -345,14 +345,14 @@ const S = q("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "col
       }
     }
   }]
-}))), Ce = /* @__PURE__ */ r(he, {}), ye = /* @__PURE__ */ r(fe, {}), xe = /* @__PURE__ */ r(me, {}), W = /* @__PURE__ */ v.forwardRef(function(t, a) {
-  const s = se({
+}))), ye = /* @__PURE__ */ c(he, {}), Ce = /* @__PURE__ */ c(fe, {}), xe = /* @__PURE__ */ c(me, {}), A = /* @__PURE__ */ v.forwardRef(function(t, a) {
+  const s = ne({
     props: t,
     name: "MuiCheckbox"
   }), {
-    checkedIcon: n = Ce,
+    checkedIcon: n = ye,
     color: l = "primary",
-    icon: p = ye,
+    icon: p = Ce,
     indeterminate: d = !1,
     indeterminateIcon: k = xe,
     inputProps: g,
@@ -360,33 +360,33 @@ const S = q("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "col
     disableRipple: w = !1,
     className: B,
     ...I
-  } = s, C = d ? k : p, y = d ? k : n, f = {
+  } = s, y = d ? k : p, C = d ? k : n, f = {
     ...s,
     disableRipple: w,
     color: l,
     indeterminate: d,
     size: u
   }, h = ke(f);
-  return /* @__PURE__ */ r(ge, {
+  return /* @__PURE__ */ c(ge, {
     type: "checkbox",
     inputProps: {
       "data-indeterminate": d,
       ...g
     },
-    icon: /* @__PURE__ */ v.cloneElement(C, {
-      fontSize: C.props.fontSize ?? u
-    }),
-    checkedIcon: /* @__PURE__ */ v.cloneElement(y, {
+    icon: /* @__PURE__ */ v.cloneElement(y, {
       fontSize: y.props.fontSize ?? u
     }),
+    checkedIcon: /* @__PURE__ */ v.cloneElement(C, {
+      fontSize: C.props.fontSize ?? u
+    }),
     ownerState: f,
     ref: a,
-    className: U(h.root, B),
+    className: H(h.root, B),
     ...I,
     classes: h
   });
 });
-process.env.NODE_ENV !== "production" && (W.propTypes = {
+process.env.NODE_ENV !== "production" && (A.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -458,7 +458,7 @@ process.env.NODE_ENV !== "production" && (W.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: D,
+  inputRef: _,
   /**
    * Callback fired when the state is changed.
    *
@@ -487,8 +487,8 @@ process.env.NODE_ENV !== "production" && (W.propTypes = {
    */
   value: e.any
 });
-const ve = oe("div")(() => ({
-  ...te`
+const ve = te("div")(({ displayMode: o }) => ({
+  ...T`
     display: flex;
     flex-wrap: nowrap;
     align-items: flex-end;
@@ -510,18 +510,29 @@ const ve = oe("div")(() => ({
     .Mui-checked {
       color: ${ae.colors.green} !important;
     }
+
+    ${o && T`
+      .Mui-disabled {
+        color: inherit !important;
+        -webkit-text-fill-color: inherit !important;
+        background-color: transparent !important;
+        opacity: 1 !important;
+        cursor: default !important;
+      }
+    `}
   `
 })), Me = ({
   label: o,
   colon: t = !0,
-  noLabel: a = !1,
-  ...s
-}) => /* @__PURE__ */ z(ve, { className: "jcLabeledCheckbox", children: [
-  !a && /* @__PURE__ */ z("span", { className: "jcCheckboxLabel", children: [
+  displayMode: a = !1,
+  noLabel: s = !1,
+  ...n
+}) => /* @__PURE__ */ z(ve, { displayMode: a, className: "jcLabeledCheckbox", children: [
+  !s && /* @__PURE__ */ z("span", { className: "jcCheckboxLabel", children: [
     o,
     t && ":"
   ] }),
-  /* @__PURE__ */ r(W, { ...s })
+  /* @__PURE__ */ c(A, { ...n })
 ] });
 export {
   Me as LabeledCheckbox,

package/LabeledCurrencyInput/LabeledCurrencyInput.d.ts

@@ -1,10 +1,10 @@
 import { InputProps } from '../../../../../../../../../src/components/base/Input';
 export interface StyleProps {
     grid?: boolean;
+    displayMode?: boolean;
 }
-export type LabeledCurrencyInputProps = InputProps & {
+export type LabeledCurrencyInputProps = InputProps & StyleProps & {
     label: string;
-    grid?: boolean;
     noLabel?: boolean;
     defaultValue?: string;
 };

package/LabeledCurrencyInput/LabeledCurrencyInput.js

@@ -1,10 +1,10 @@
-import { jsxs as p, jsx as g } from "react/jsx-runtime";
-import { useState as d } from "react";
-import { n as w } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as x } from "../.chunks/emotion-react.browser.esm.js";
-import { Input as y } from "../Input/Input.js";
-const I = w("div")(({ grid: r }) => ({
-  ...x`
+import { jsxs as l, jsx as y } from "react/jsx-runtime";
+import { useState as b } from "react";
+import { n as h } from "../.chunks/emotion-styled.browser.esm.js";
+import { c } from "../.chunks/emotion-react.browser.esm.js";
+import { Input as w } from "../Input/Input.js";
+const x = h("div")(({ grid: r, displayMode: n }) => ({
+  ...c`
     display: flex;
     flex-wrap: nowrap;
     gap: 9px;
@@ -22,36 +22,47 @@ const I = w("div")(({ grid: r }) => ({
     .MuiCurrencyInputBase-root {
       width: ${r && "100%"};
     }
+
+    ${n && c`
+      .Mui-disabled {
+        color: inherit !important;
+        -webkit-text-fill-color: inherit !important;
+        background-color: transparent !important;
+        opacity: 1 !important;
+        cursor: default !important;
+      }
+    `}
   `
-})), j = ({
+})), L = ({
   label: r,
-  grid: l = !0,
-  noLabel: m = !1,
-  onChange: a,
-  defaultValue: n,
-  ...c
+  grid: n = !0,
+  displayMode: m = !1,
+  noLabel: u = !1,
+  onChange: i,
+  defaultValue: o,
+  ...f
 }) => {
-  let t = (n == null ? void 0 : n.replace(/[^0-9.-]+/g, "")) ?? "";
-  t && (t = new Intl.NumberFormat("en-US", {
+  let e = (o == null ? void 0 : o.replace(/[^0-9.-]+/g, "")) ?? "";
+  e && (e = new Intl.NumberFormat("en-US", {
     style: "decimal",
     maximumFractionDigits: 2
-  }).format(Number(t)));
-  const [u, o] = d(t);
-  return /* @__PURE__ */ p(I, { grid: l, className: "jcLabeledCurrencyInput", children: [
-    !m && /* @__PURE__ */ p("span", { children: [
+  }).format(Number(e)));
+  const [d, a] = b(e);
+  return /* @__PURE__ */ l(x, { ...{ grid: n, displayMode: m }, className: "jcLabeledCurrencyInput", children: [
+    !u && /* @__PURE__ */ l("span", { children: [
       r,
       ":"
     ] }),
-    /* @__PURE__ */ g(y, { ...c, onChange: (i) => {
-      const { value: f } = i.target, e = f.replace(/[^0-9.-]+/g, ""), s = new Intl.NumberFormat("en-US", {
+    /* @__PURE__ */ y(w, { ...f, onChange: (s) => {
+      const { value: g } = s.target, t = g.replace(/[^0-9.-]+/g, ""), p = new Intl.NumberFormat("en-US", {
         style: "decimal",
         maximumFractionDigits: 2
-      }).format(Number(e) || 0);
-      e && e.length > 1 && e[e.length - 1] === "." ? o(s + ".") : o(e ? s : ""), a && a(i);
-    }, value: `$${u}` })
+      }).format(Number(t) || 0);
+      t && t.length > 1 && t[t.length - 1] === "." ? a(p + ".") : a(t ? p : ""), i && i(s);
+    }, value: `$${d}` })
   ] });
 };
 export {
-  j as LabeledCurrencyInput,
-  j as default
+  L as LabeledCurrencyInput,
+  L as default
 };

package/LabeledInput/LabeledInput.d.ts

@@ -1,10 +1,10 @@
 import { InputProps } from '../../../../../../../../../src/components/base/Input';
 export interface StyleProps {
     grid?: boolean;
+    displayMode?: boolean;
 }
-export type LabeledInputProps = InputProps & {
+export type LabeledInputProps = InputProps & StyleProps & {
     label?: string;
-    grid?: boolean;
     noLabel?: boolean;
     limit?: number;
 };

package/LabeledInput/LabeledInput.js

@@ -1,9 +1,9 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import { n } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as l } from "../.chunks/emotion-react.browser.esm.js";
-import { Input as i } from "../Input/Input.js";
-const f = n("div")(({ grid: t }) => ({
-  ...l`
+import { jsxs as r, jsx as s } from "react/jsx-runtime";
+import { n as l } from "../.chunks/emotion-styled.browser.esm.js";
+import { c as a } from "../.chunks/emotion-react.browser.esm.js";
+import { Input as d } from "../Input/Input.js";
+const f = l("div")(({ grid: t, displayMode: o }) => ({
+  ...a`
     display: flex;
     flex-wrap: nowrap;
     gap: 9px;
@@ -21,21 +21,32 @@ const f = n("div")(({ grid: t }) => ({
     .MuiInputBase-root {
       width: ${t && "100%"};
     }
+
+    ${o && a`
+      .Mui-disabled {
+        color: inherit !important;
+        -webkit-text-fill-color: inherit !important;
+        background-color: transparent !important;
+        opacity: 1 !important;
+        cursor: default !important;
+      }
+    `}
   `
-})), w = ({
+})), x = ({
   label: t,
   grid: o = !0,
-  noLabel: p = !1,
-  limit: s,
-  ...a
-}) => /* @__PURE__ */ e(f, { grid: o, className: "jcLabeledInput", children: [
-  !p && /* @__PURE__ */ e("span", { children: [
+  displayMode: e = !1,
+  noLabel: i = !1,
+  limit: p,
+  ...n
+}) => /* @__PURE__ */ r(f, { grid: o, displayMode: e, className: "jcLabeledInput", children: [
+  !i && /* @__PURE__ */ r("span", { children: [
     t,
     ":"
   ] }),
-  /* @__PURE__ */ r(i, { ...a, slotProps: { htmlInput: { limit: s } } })
+  /* @__PURE__ */ s(d, { ...n, slotProps: { htmlInput: { limit: p } } })
 ] });
 export {
-  w as LabeledInput,
-  w as default
+  x as LabeledInput,
+  x as default
 };

package/Table/Table.d.ts

@@ -10,6 +10,7 @@ export interface TableProps {
         key: string;
         direction: 'asc' | 'desc';
     };
+    extraActions?: React.ReactNode;
 }
 declare const Table: React.FC<TableProps>;
 export default Table;

package/Table/Table.js

@@ -1,21 +1,22 @@
-import { jsxs as c, jsx as o } from "react/jsx-runtime";
-import ve, { forwardRef as Q, createElement as N, useState as m, useMemo as D } from "react";
-import B from "../theme.js";
-import { n as s } from "../.chunks/emotion-styled.browser.esm.js";
-import { Button as ze } from "../Button/Button.js";
+import { jsxs as a, jsx as o } from "react/jsx-runtime";
+import ze, { forwardRef as X, createElement as F, useState as y, useMemo as T } from "react";
+import I from "../theme.js";
+import { n as i } from "../.chunks/emotion-styled.browser.esm.js";
+import { Button as Ae } from "../Button/Button.js";
+import { Flex as je } from "../Flex/Flex.js";
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Ae = (n) => n.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), je = (n) => n.replace(
+const Be = (n) => n.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), Ie = (n) => n.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
   (r, l, u) => u ? u.toUpperCase() : l.toLowerCase()
-), Z = (n) => {
-  const r = je(n);
+), G = (n) => {
+  const r = Ie(n);
   return r.charAt(0).toUpperCase() + r.slice(1);
-}, X = (...n) => n.filter((r, l, u) => !!r && r.trim() !== "" && u.indexOf(r) === l).join(" ").trim(), Be = (n) => {
+}, P = (...n) => n.filter((r, l, u) => !!r && r.trim() !== "" && u.indexOf(r) === l).join(" ").trim(), _e = (n) => {
   for (const r in n)
     if (r.startsWith("aria-") || r === "role" || r === "title")
       return !0;
@@ -26,7 +27,7 @@ const Ae = (n) => n.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), je = (
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-var Ie = {
+var De = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -43,7 +44,7 @@ var Ie = {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const _e = Q(
+const Te = X(
   ({
     color: n = "currentColor",
     size: r = 24,
@@ -52,22 +53,22 @@ const _e = Q(
     className: C = "",
     children: g,
     iconNode: M,
-    ...i
-  }, b) => N(
+    ...A
+  }, s) => F(
     "svg",
     {
-      ref: b,
-      ...Ie,
+      ref: s,
+      ...De,
       width: r,
       height: r,
       stroke: n,
       strokeWidth: u ? Number(l) * 24 / Number(r) : l,
-      className: X("lucide", C),
-      ...!g && !Be(i) && { "aria-hidden": "true" },
-      ...i
+      className: P("lucide", C),
+      ...!g && !_e(A) && { "aria-hidden": "true" },
+      ...A
     },
     [
-      ...M.map(([T, d]) => N(T, d)),
+      ...M.map(([b, L]) => F(b, L)),
       ...Array.isArray(g) ? g : [g]
     ]
   )
@@ -79,19 +80,19 @@ const _e = Q(
  * See the LICENSE file in the root directory of this source tree.
  */
 const z = (n, r) => {
-  const l = Q(
-    ({ className: u, ...C }, g) => N(_e, {
+  const l = X(
+    ({ className: u, ...C }, g) => F(Te, {
       ref: g,
       iconNode: r,
-      className: X(
-        `lucide-${Ae(Z(n))}`,
+      className: P(
+        `lucide-${Be(G(n))}`,
         `lucide-${n}`,
         u
       ),
       ...C
     })
   );
-  return l.displayName = Z(n), l;
+  return l.displayName = G(n), l;
 };
 /**
  * @license lucide-react v0.525.0 - ISC
@@ -99,21 +100,21 @@ const z = (n, r) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const De = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], E = z("chevron-down", De);
+const Me = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], N = z("chevron-down", Me);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Me = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]], G = z("chevron-up", Me);
+const Le = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]], J = z("chevron-up", Le);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Te = [
+const Re = [
   [
     "path",
     {
@@ -130,14 +131,14 @@ const Te = [
     }
   ],
   ["path", { d: "m2 2 20 20", key: "1ooewy" }]
-], Le = z("eye-off", Te);
+], We = z("eye-off", Re);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Re = [
+const Ee = [
   [
     "path",
     {
@@ -146,24 +147,24 @@ const Re = [
     }
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-], We = z("eye", Re);
+], $e = z("eye", Ee);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const $e = [
+const Ne = [
   ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
   ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
-], J = z("search", $e);
+], Q = z("search", Ne);
 /**
  * @license lucide-react v0.525.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Ee = [
+const Fe = [
   [
     "path",
     {
@@ -172,73 +173,74 @@ const Ee = [
     }
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-], Ne = z("settings", Ee);
+], Ve = z("settings", Fe);
 let v = "";
-const qe = ({
+const Ze = ({
   data: n = [],
   columnTitles: r = {},
   rowsPerPage: l = 19,
   title: u = "Data Table",
   onRowClick: C,
   hiddenColumns: g = [],
-  defaultSort: M = { key: "", direction: "asc" }
+  defaultSort: M = { key: "", direction: "asc" },
+  extraActions: A
 }) => {
-  const [i, b] = m(1), [, T] = m(""), [d, P] = m(M), [w, I] = m(/* @__PURE__ */ new Set()), [L, V] = m(/* @__PURE__ */ new Set()), [F, ee] = m(!1), [U, oe] = m(!1), p = D(() => n.length === 0 ? [] : Object.keys(n[0]).filter((e) => !g.includes(e)), [n]);
-  ve.useEffect(() => {
-    p.length > 0 && (V(new Set(p)), I(new Set(p)));
-  }, [p]);
-  const R = D(() => {
+  const [s, b] = y(1), [, L] = y(""), [h, ee] = y(M), [w, _] = y(/* @__PURE__ */ new Set()), [R, V] = y(/* @__PURE__ */ new Set()), [U, oe] = y(!1), [O, te] = y(!1), d = T(() => n.length === 0 ? [] : Object.keys(n[0]).filter((e) => !g.includes(e)), [n]);
+  ze.useEffect(() => {
+    d.length > 0 && (V(new Set(d)), _(new Set(d)));
+  }, [d]);
+  const W = T(() => {
     if (!v) return n;
-    const e = w.size > 0 ? w : new Set(p);
-    return n.filter((t) => Array.from(e).some((a) => {
-      const f = t[a];
+    const e = w.size > 0 ? w : new Set(d);
+    return n.filter((t) => Array.from(e).some((c) => {
+      const f = t[c];
       return f && f.toString().toLowerCase().includes(v.toLowerCase());
     }));
-  }, [n, v, w, p]), x = D(() => d.key ? [...R].sort((e, t) => e[d.key] < t[d.key] ? d.direction === "asc" ? -1 : 1 : e[d.key] > t[d.key] ? d.direction === "asc" ? 1 : -1 : 0) : R, [R, d]), _ = p.filter((e) => L.has(e)), te = () => {
+  }, [n, v, w, d]), x = T(() => h.key ? [...W].sort((e, t) => e[h.key] < t[h.key] ? h.direction === "asc" ? -1 : 1 : e[h.key] > t[h.key] ? h.direction === "asc" ? 1 : -1 : 0) : W, [W, h]), D = d.filter((e) => R.has(e)), ne = () => {
     if (!Array.isArray(x) || x.length === 0) return;
-    const e = _.map((S) => r[S] || S), t = (S) => {
-      const j = String(S ?? "");
-      return /[",\n]/.test(j) ? `"${j.replace(/"/g, '""')}"` : j;
+    const e = D.map((S) => r[S] || S), t = (S) => {
+      const B = String(S ?? "");
+      return /[",\n]/.test(B) ? `"${B.replace(/"/g, '""')}"` : B;
     }, f = [
       e.join(","),
       // header row
-      ...x.map((S) => _.map((j) => t(S[j])).join(","))
+      ...x.map((S) => D.map((B) => t(S[B])).join(","))
     ].join(`
-`), Se = new Blob([f], { type: "text/csv;charset=utf-8;" }), A = document.createElement("a");
-    A.href = URL.createObjectURL(Se), A.download = "data.csv", document.body.appendChild(A), A.click(), document.body.removeChild(A);
-  }, ne = D(() => {
-    const e = (i - 1) * l;
+`), ve = new Blob([f], { type: "text/csv;charset=utf-8;" }), j = document.createElement("a");
+    j.href = URL.createObjectURL(ve), j.download = "data.csv", document.body.appendChild(j), j.click(), document.body.removeChild(j);
+  }, re = T(() => {
+    const e = (s - 1) * l;
     return x.slice(e, e + l);
-  }, [x, i, l]), h = Math.ceil(x.length / l), re = (e) => {
-    P((t) => ({
+  }, [x, s, l]), p = Math.ceil(x.length / l), ie = (e) => {
+    ee((t) => ({
       key: e,
       direction: t.key === e && t.direction === "asc" ? "desc" : "asc"
     }));
-  }, ie = (e) => {
-    I((t) => {
-      const a = new Set(t);
-      return a.has(e) ? a.delete(e) : a.add(e), a;
+  }, se = (e) => {
+    _((t) => {
+      const c = new Set(t);
+      return c.has(e) ? c.delete(e) : c.add(e), c;
     });
-  }, se = () => {
-    w.size === p.length ? I(/* @__PURE__ */ new Set()) : I(new Set(p));
-  }, ae = (e) => {
+  }, ae = () => {
+    w.size === d.length ? _(/* @__PURE__ */ new Set()) : _(new Set(d));
+  }, ce = (e) => {
     V((t) => {
-      const a = new Set(t);
-      return a.has(e) ? a.delete(e) : a.add(e), a;
+      const c = new Set(t);
+      return c.has(e) ? c.delete(e) : c.add(e), c;
     });
-  }, ce = (e) => {
+  }, le = (e) => {
     v = e;
-  }, O = () => {
-    T(v);
-  }, y = {
+  }, H = () => {
+    L(v);
+  }, m = {
     thActive: {
-      backgroundColor: B.colors.green,
-      color: B.colors.white
+      backgroundColor: I.colors.green,
+      color: I.colors.white
     },
     paginationButtonActive: {
-      backgroundColor: B.colors.green,
-      color: B.colors.white,
-      borderColor: B.colors.green
+      backgroundColor: I.colors.green,
+      color: I.colors.white,
+      borderColor: I.colors.green
     },
     paginationButtonDisabled: {
       opacity: 0.5,
@@ -250,7 +252,7 @@ const qe = ({
       textAlign: "center",
       marginTop: "10px"
     }
-  }, le = s("div")({
+  }, de = i("div")({
     backgroundColor: "#ffffff",
     borderRadius: "8px",
     boxShadow: "0 2px 10px rgba(0, 0, 0, 0.1)",
@@ -258,7 +260,7 @@ const qe = ({
     fontFamily: "Arial, sans-serif",
     maxWidth: "100%",
     overflow: "auto"
-  }), de = s("div")({
+  }), pe = i("div")({
     display: "flex",
     flexDirection: "column",
     justifyContent: "space-between",
@@ -266,29 +268,29 @@ const qe = ({
     marginBottom: "20px",
     flexWrap: "wrap",
     gap: "9px"
-  }), pe = s("div")({
+  }), he = i("div")({
     display: "flex",
     justifyContent: "space-between",
     width: "100%",
     alignItems: "center"
-  }), he = s("h2")({
+  }), fe = i("h2")({
     fontSize: "24px",
     fontWeight: "bold",
     color: "#000000",
     margin: 0
-  }), fe = s("div")({
+  }), ue = i("div")({
     display: "flex",
     justifyContent: "flex-end",
     width: "100%",
     gap: "15px",
     alignItems: "center",
     flexWrap: "wrap"
-  }), ue = s("div")({
+  }), xe = i("div")({
     position: "relative",
     display: "flex",
     alignItems: "center",
     flexGrow: 1
-  }), xe = s(J)({
+  }), ge = i(Q)({
     position: "absolute",
     left: "13px",
     top: "10px",
@@ -300,7 +302,7 @@ const qe = ({
       cursor: "pointer",
       color: "#009200"
     }
-  }), ge = s("input")({
+  }), be = i("input")({
     padding: "10px 15px 10px 40px",
     border: "2px solid #e0e0e0",
     borderRadius: "25px",
@@ -314,7 +316,7 @@ const qe = ({
       borderColor: "#009200",
       boxShadow: "0 0 0 3px rgba(0, 146, 0, 0.1)"
     }
-  }), H = s("button")({
+  }), q = i("button")({
     padding: "10px 15px",
     border: "2px solid #009200",
     borderRadius: "6px",
@@ -334,7 +336,7 @@ const qe = ({
       transform: "translateY(-1px)",
       boxShadow: "0 4px 12px rgba(0, 146, 0, 0.3)"
     }
-  }), q = s("div")({
+  }), K = i("div")({
     position: "absolute",
     top: "100%",
     right: 0,
@@ -347,7 +349,7 @@ const qe = ({
     minWidth: "200px",
     maxHeight: "300px",
     overflowY: "auto"
-  }), W = s("div")({
+  }), E = i("div")({
     padding: "12px 16px",
     display: "flex",
     alignItems: "center",
@@ -360,18 +362,18 @@ const qe = ({
       backgroundColor: "#f0f8f0",
       color: "#005c00"
     }
-  }), $ = s("input")({
+  }), $ = i("input")({
     width: "16px",
     height: "16px",
     accentColor: "#009200"
-  }), be = s("table")({
+  }), Ce = i("table")({
     width: "100%",
     borderCollapse: "collapse",
     backgroundColor: "#ffffff",
     borderRadius: "8px",
     overflow: "hidden",
     boxShadow: "0 1px 3px rgba(0, 0, 0, 0.1)"
-  }), Ce = s("th")({
+  }), me = i("th")({
     backgroundColor: "#f8f9fa",
     color: "#333333",
     padding: "16px 12px",
@@ -388,16 +390,16 @@ const qe = ({
       backgroundColor: "#e8f5e8",
       color: "#005c00"
     }
-  }), ye = s("td")({
+  }), ye = i("td")({
     padding: "14px 12px",
     borderBottom: "1px solid #f0f0f0",
     fontSize: "14px",
     color: "#333333",
     transition: "all 0.2s ease"
-  }), me = s("span")({
+  }), we = i("span")({
     marginLeft: "8px",
     opacity: 0.6
-  }), K = s("tr")(({ interactableRow: e }) => ({
+  }), Y = i("tr")(({ interactableRow: e }) => ({
     transition: "all 0.2s ease",
     ...e && {
       "&:focus, &:hover, &:focus-within": {
@@ -405,13 +407,13 @@ const qe = ({
         cursor: "pointer"
       }
     }
-  })), we = s("div")({
+  })), ke = i("div")({
     display: "flex",
     justifyContent: "center",
     alignItems: "center",
     marginTop: "20px",
     gap: "10px"
-  }), k = s("button")({
+  }), k = i("button")({
     padding: "8px 12px",
     border: "1px solid #e0e0e0",
     borderRadius: "4px",
@@ -430,51 +432,54 @@ const qe = ({
       opacity: 0.5,
       cursor: "not-allowed"
     }
-  }), ke = s("div")({
+  }), Se = i("div")({
     fontSize: "14px",
     color: "#666666",
     textAlign: "center",
     marginTop: "10px"
-  }), Y = s("span")({
+  }), Z = i("span")({
     padding: "8px 4px",
     color: "#666666",
     fontSize: "14px"
   });
-  return /* @__PURE__ */ c(le, { children: [
-    /* @__PURE__ */ c(de, { children: [
-      /* @__PURE__ */ c(pe, { children: [
-        /* @__PURE__ */ o(he, { children: u }),
-        /* @__PURE__ */ o(ze, { onClick: te, children: "Export to CSV" })
+  return /* @__PURE__ */ a(de, { children: [
+    /* @__PURE__ */ a(pe, { children: [
+      /* @__PURE__ */ a(he, { children: [
+        /* @__PURE__ */ o(fe, { children: u }),
+        /* @__PURE__ */ a(je, { className: "jcTableExtraComponentsBox", gap: "9px", children: [
+          A && A,
+          /* @__PURE__ */ o(Ae, { onClick: ne, children: "Export to CSV" })
+        ] })
       ] }),
-      /* @__PURE__ */ c(fe, { children: [
-        /* @__PURE__ */ c(ue, { children: [
-          /* @__PURE__ */ o(xe, { onClick: O }),
+      /* @__PURE__ */ a(ue, { children: [
+        /* @__PURE__ */ a(xe, { children: [
+          /* @__PURE__ */ o(ge, { onClick: H }),
           /* @__PURE__ */ o(
-            ge,
+            be,
             {
               type: "text",
               placeholder: "Search...",
               defaultValue: v,
-              onChange: (e) => ce(e.target.value),
+              onChange: (e) => le(e.target.value),
               onKeyDown: (e) => {
-                e.key === "Enter" && O();
+                e.key === "Enter" && H();
               }
             }
           )
         ] }),
-        /* @__PURE__ */ c("div", { style: { position: "relative" }, children: [
-          /* @__PURE__ */ c(H, { onClick: () => oe(!U), children: [
-            /* @__PURE__ */ o(J, { size: 16 }),
+        /* @__PURE__ */ a("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ a(q, { onClick: () => te(!O), children: [
+            /* @__PURE__ */ o(Q, { size: 16 }),
             "Fields",
-            /* @__PURE__ */ o(E, { size: 16 })
+            /* @__PURE__ */ o(N, { size: 16 })
           ] }),
-          U && /* @__PURE__ */ c(q, { children: [
-            /* @__PURE__ */ c(W, { onClick: se, children: [
+          O && /* @__PURE__ */ a(K, { children: [
+            /* @__PURE__ */ a(E, { onClick: ae, children: [
               /* @__PURE__ */ o(
                 $,
                 {
                   type: "checkbox",
-                  checked: w.size === p.length,
+                  checked: w.size === d.length,
                   onChange: () => {
                   }
                 }
@@ -482,62 +487,62 @@ const qe = ({
               /* @__PURE__ */ o("span", { style: { fontWeight: "bold" }, children: "All" })
             ] }),
             /* @__PURE__ */ o("div", { style: { height: "1px", backgroundColor: "#e0e0e0", margin: "4px 0" } }),
-            p.map((e) => /* @__PURE__ */ c(W, { onClick: () => ie(e), children: [
+            d.map((e) => /* @__PURE__ */ a(E, { onClick: () => se(e), children: [
               /* @__PURE__ */ o($, { type: "checkbox", checked: w.has(e), onChange: () => {
               } }),
               /* @__PURE__ */ o("span", { children: r[e] || e })
             ] }, e))
           ] })
         ] }),
-        /* @__PURE__ */ c("div", { style: { position: "relative" }, children: [
-          /* @__PURE__ */ c(H, { onClick: () => ee(!F), children: [
-            /* @__PURE__ */ o(Ne, { size: 16 }),
+        /* @__PURE__ */ a("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ a(q, { onClick: () => oe(!U), children: [
+            /* @__PURE__ */ o(Ve, { size: 16 }),
             "Columns",
-            /* @__PURE__ */ o(E, { size: 16 })
+            /* @__PURE__ */ o(N, { size: 16 })
           ] }),
-          F && /* @__PURE__ */ o(q, { children: p.map((e) => /* @__PURE__ */ c(W, { onClick: () => ae(e), children: [
-            /* @__PURE__ */ o($, { type: "checkbox", checked: L.has(e), onChange: () => {
+          U && /* @__PURE__ */ o(K, { children: d.map((e) => /* @__PURE__ */ a(E, { onClick: () => ce(e), children: [
+            /* @__PURE__ */ o($, { type: "checkbox", checked: R.has(e), onChange: () => {
             } }),
-            L.has(e) ? /* @__PURE__ */ o(We, { size: 16 }) : /* @__PURE__ */ o(Le, { size: 16 }),
+            R.has(e) ? /* @__PURE__ */ o($e, { size: 16 }) : /* @__PURE__ */ o(We, { size: 16 }),
             /* @__PURE__ */ o("span", { children: r[e] || e })
           ] }, e)) })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ c(be, { children: [
-      /* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o(K, { interactableRow: !1, children: _.map((e) => /* @__PURE__ */ c(
-        Ce,
+    /* @__PURE__ */ a(Ce, { children: [
+      /* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o(Y, { interactableRow: !1, children: D.map((e) => /* @__PURE__ */ a(
+        me,
         {
-          style: d.key === e ? y.thActive : {},
-          onClick: () => re(e),
+          style: h.key === e ? m.thActive : {},
+          onClick: () => ie(e),
           children: [
             r[e] || e,
-            /* @__PURE__ */ o(me, { children: d.key === e ? d.direction === "asc" ? /* @__PURE__ */ o(G, { size: 16 }) : /* @__PURE__ */ o(E, { size: 16 }) : /* @__PURE__ */ o(G, { size: 16, style: { opacity: 0.313 } }) })
+            /* @__PURE__ */ o(we, { children: h.key === e ? h.direction === "asc" ? /* @__PURE__ */ o(J, { size: 16 }) : /* @__PURE__ */ o(N, { size: 16 }) : /* @__PURE__ */ o(J, { size: 16, style: { opacity: 0.313 } }) })
           ]
         },
         e
       )) }) }),
-      /* @__PURE__ */ o("tbody", { children: ne.map((e, t) => /* @__PURE__ */ o(K, { onClick: () => C && C(e), interactableRow: !!C, children: _.map((a) => /* @__PURE__ */ o(ye, { children: e[a] }, a)) }, t)) })
+      /* @__PURE__ */ o("tbody", { children: re.map((e, t) => /* @__PURE__ */ o(Y, { onClick: () => C && C(e), interactableRow: !!C, children: D.map((c) => /* @__PURE__ */ o(ye, { children: e[c] }, c)) }, t)) })
     ] }),
-    /* @__PURE__ */ c(we, { children: [
+    /* @__PURE__ */ a(ke, { children: [
       /* @__PURE__ */ o(
         k,
         {
-          style: i === 1 ? y.paginationButtonDisabled : {},
-          onClick: () => b(Math.max(1, i - 1)),
-          disabled: i === 1,
+          style: s === 1 ? m.paginationButtonDisabled : {},
+          onClick: () => b(Math.max(1, s - 1)),
+          disabled: s === 1,
           children: "Previous"
         }
       ),
       (() => {
         const e = [];
-        if (h <= 5)
-          for (let t = 1; t <= h; t++)
+        if (p <= 5)
+          for (let t = 1; t <= p; t++)
             e.push(
               /* @__PURE__ */ o(
                 k,
                 {
-                  style: i === t ? y.paginationButtonActive : {},
+                  style: s === t ? m.paginationButtonActive : {},
                   onClick: () => b(t),
                   children: t
                 },
@@ -549,35 +554,35 @@ const qe = ({
             /* @__PURE__ */ o(
               k,
               {
-                style: i === 1 ? y.paginationButtonActive : {},
+                style: s === 1 ? m.paginationButtonActive : {},
                 onClick: () => b(1),
                 children: "1"
               },
               1
             )
-          ), i > 3 && e.push(/* @__PURE__ */ o(Y, { children: "..." }, "ellipsis1"));
-          const t = Math.max(2, i - 1), a = Math.min(h - 1, i + 1);
-          for (let f = t; f <= a; f++)
+          ), s > 3 && e.push(/* @__PURE__ */ o(Z, { children: "..." }, "ellipsis1"));
+          const t = Math.max(2, s - 1), c = Math.min(p - 1, s + 1);
+          for (let f = t; f <= c; f++)
             e.push(
               /* @__PURE__ */ o(
                 k,
                 {
-                  style: i === f ? y.paginationButtonActive : {},
+                  style: s === f ? m.paginationButtonActive : {},
                   onClick: () => b(f),
                   children: f
                 },
                 f
               )
             );
-          i < h - 2 && e.push(/* @__PURE__ */ o(Y, { children: "..." }, "ellipsis2")), h > 1 && e.push(
+          s < p - 2 && e.push(/* @__PURE__ */ o(Z, { children: "..." }, "ellipsis2")), p > 1 && e.push(
             /* @__PURE__ */ o(
               k,
               {
-                style: i === h ? y.paginationButtonActive : {},
-                onClick: () => b(h),
-                children: h
+                style: s === p ? m.paginationButtonActive : {},
+                onClick: () => b(p),
+                children: p
               },
-              h
+              p
             )
           );
         }
@@ -586,19 +591,19 @@ const qe = ({
       /* @__PURE__ */ o(
         k,
         {
-          style: i === h ? y.paginationButtonDisabled : {},
-          onClick: () => b(Math.min(h, i + 1)),
-          disabled: i === h,
+          style: s === p ? m.paginationButtonDisabled : {},
+          onClick: () => b(Math.min(p, s + 1)),
+          disabled: s === p,
           children: "Next"
         }
       )
     ] }),
-    /* @__PURE__ */ c(ke, { children: [
+    /* @__PURE__ */ a(Se, { children: [
       "Showing ",
-      Math.min((i - 1) * l + 1, x.length),
+      Math.min((s - 1) * l + 1, x.length),
       " to",
       " ",
-      Math.min(i * l, x.length),
+      Math.min(s * l, x.length),
       " of ",
       x.length,
       " entries"
@@ -606,5 +611,5 @@ const qe = ({
   ] });
 };
 export {
-  qe as default
+  Ze as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.321",
+  "version": "0.0.325",
   "description": "Component library for the websites of Johnson County Iowa",
   "license": "MIT",
   "homepage": "https://devops.jc.net/JCIT/Business%20Solutions%20Delivery/_git/JCComponentLibrary?path=%2FREADME.md&version=GBmaster",