jcicl 0.0.237 → 0.0.241

package/DefaultTemplate/DefaultTemplate.d.ts

@@ -7,6 +7,7 @@ export declare const PageWrapper: import('@emotion/styled').StyledComponent<{
     loading: boolean;
     hasPagination: boolean;
     loadingColor?: string;
+    hasFade?: boolean;
 }, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const MainContentContainer: import('@emotion/styled').StyledComponent<{
     theme?: import('@emotion/react').Theme;

package/DefaultTemplate/DefaultTemplate.js

@@ -1,13 +1,13 @@
-import { jsx as c, jsxs as y } from "react/jsx-runtime";
+import { jsx as t, jsxs as y } from "react/jsx-runtime";
 import { useState as x } from "react";
-import { n as d } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as n } from "../.chunks/emotion-react.browser.esm.js";
+import { n } from "../.chunks/emotion-styled.browser.esm.js";
+import { c as m } from "../.chunks/emotion-react.browser.esm.js";
 import o from "../theme.js";
-import { u as k, A as f } from "../.chunks/AppContainer.js";
-import C from "../WithLoading/WithLoading.js";
-import { Fade as w } from "../Overlays/Overlays.js";
-const p = ["loading", "hasPagination", "loadingColor"], S = d("div", { shouldForwardProp: (r) => !p.includes(r) })(({ loading: r, hasPagination: e, loadingColor: l = o.colors.green }) => ({
-  ...n`
+import { u as k, A as C } from "../.chunks/AppContainer.js";
+import f from "../WithLoading/WithLoading.js";
+import { Fade as p } from "../Overlays/Overlays.js";
+const w = ["loading", "hasPagination", "loadingColor"], S = n("div", { shouldForwardProp: (r) => !w.includes(r) })(({ loading: r, hasPagination: e, hasFade: l, loadingColor: s = o.colors.green }) => ({
+  ...m`
     color: ${o.colors.midnight};
     height: ${r ? "100%" : "auto"};
     padding: 19px;
@@ -18,17 +18,17 @@ const p = ["loading", "hasPagination", "loadingColor"], S = d("div", { shouldFor
     width: 100%;
     height: 100%;
     box-sizing: border-box;
-    padding-bottom: ${e ? "114px" : "72px"};
+    padding-bottom: ${l ? e ? "114px" : "72px" : "19px"};
     > * div {
       box-sizing: border-box;
     }
 
     .MuiCircularProgress-svg {
-      color: ${l};
+      color: ${s};
     }
   `
-})), T = d("div")(() => ({
-  ...n`
+})), T = n("div")(() => ({
+  ...m`
     border-radius: 8px;
     padding: 0;
     display: flex;
@@ -85,11 +85,11 @@ const p = ["loading", "hasPagination", "loadingColor"], S = d("div", { shouldFor
   children: r,
   loading: e = !1,
   hasPagination: l = !1,
-  fade: m = !0,
+  fade: s = !0,
   userProfileMenuItems: h,
-  ...s
+  ...c
 }) => {
-  const g = localStorage.getItem("theme") || "green", [t, i] = x(g), a = k(`(max-width: ${o.screenSizes.mobile})`), u = v[t], b = [
+  const g = localStorage.getItem("theme") || "green", [a, i] = x(g), d = k(`(max-width: ${o.screenSizes.mobile})`), u = v[a], b = [
     {
       label: "Green Theme",
       onClick: () => {
@@ -110,16 +110,26 @@ const p = ["loading", "hasPagination", "loadingColor"], S = d("div", { shouldFor
     },
     ...h || []
   ];
-  return /* @__PURE__ */ c(
-    f,
+  return /* @__PURE__ */ t(
+    C,
     {
-      ...s,
+      ...c,
       userProfileMenuItems: b,
-      themeColors: u ?? (s == null ? void 0 : s.themeColors),
-      children: /* @__PURE__ */ c(S, { loading: e, loadingColor: P[t], hasPagination: l, children: /* @__PURE__ */ y(C, { loading: e, size: a ? 114 : 201, children: [
-        m && /* @__PURE__ */ c(w, { isMobile: a, hasPagination: l, color: R[t] }),
-        /* @__PURE__ */ c(T, { children: r })
-      ] }) })
+      themeColors: u ?? (c == null ? void 0 : c.themeColors),
+      children: /* @__PURE__ */ t(
+        S,
+        {
+          className: "jcPageWrapper",
+          loading: e,
+          loadingColor: P[a],
+          hasPagination: l,
+          hasFade: s,
+          children: /* @__PURE__ */ y(f, { loading: e, size: d ? 114 : 201, children: [
+            s && /* @__PURE__ */ t(p, { isMobile: d, hasPagination: l, color: R[a] }),
+            /* @__PURE__ */ t(T, { children: r })
+          ] })
+        }
+      )
     }
   );
 };

package/Stepper/Stepper.js

@@ -1,22 +1,23 @@
-import { jsxs as C, jsx as n, Fragment as j } from "react/jsx-runtime";
-import * as $ from "react";
-import { useState as D, Children as h } from "react";
+import { jsxs as C, jsx as n, Fragment as D } from "react/jsx-runtime";
+import * as O from "react";
+import { useState as T, Children as h } from "react";
+import { flushSync as k } from "react-dom";
 import { n as _ } from "../.chunks/emotion-styled.browser.esm.js";
-import { k as R, c as k } from "../.chunks/emotion-react.browser.esm.js";
-import { Button as T } from "../Button/Button.js";
-import M from "../theme.js";
-import { SlideIn as q, SlideOut as H, SlideInReverse as z, SlideOutReverse as J } from "../animation/Slide/Slide.js";
-import { g as V, a as K, s as g, c as f, u as F, b as B, P as o, d as X, l as Q, j as W, k as Z } from "../.chunks/DefaultPropsProvider.js";
-import { m as S } from "../.chunks/memoTheme.js";
-import { P as rr } from "../.chunks/Paper.js";
-import { u as er } from "../.chunks/index.js";
+import { k as I, c as M } from "../.chunks/emotion-react.browser.esm.js";
+import { Button as q } from "../Button/Button.js";
+import $ from "../theme.js";
+import { SlideOut as H, SlideIn as J, SlideInReverse as z, SlideOutReverse as Q } from "../animation/Slide/Slide.js";
+import { g as V, a as K, s as y, c as b, u as F, b as A, P as o, d as X, l as W, j as Z, k as rr } from "../.chunks/DefaultPropsProvider.js";
+import { m as P } from "../.chunks/memoTheme.js";
+import { P as er } from "../.chunks/Paper.js";
+import { u as tr } from "../.chunks/index.js";
 import { c as w } from "../.chunks/createSimplePaletteValueFilter.js";
 import { i as U } from "../.chunks/integerPropType.js";
-function tr(e) {
+function or(e) {
   return V("MuiLinearProgress", e);
 }
 K("MuiLinearProgress", ["root", "colorPrimary", "colorSecondary", "determinate", "indeterminate", "buffer", "query", "dashed", "dashedColorPrimary", "dashedColorSecondary", "bar", "barColorPrimary", "barColorSecondary", "bar1Indeterminate", "bar1Determinate", "bar1Buffer", "bar2Indeterminate", "bar2Buffer"]);
-const O = 4, A = R`
+const B = 4, L = I`
   0% {
     left: -35%;
     right: 100%;
@@ -31,9 +32,9 @@ const O = 4, A = R`
     left: 100%;
     right: -90%;
   }
-`, or = typeof A != "string" ? k`
-        animation: ${A} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
-      ` : null, N = R`
+`, ar = typeof L != "string" ? M`
+        animation: ${L} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
+      ` : null, N = I`
   0% {
     left: -200%;
     right: 100%;
@@ -48,9 +49,9 @@ const O = 4, A = R`
     left: 107%;
     right: -8%;
   }
-`, ar = typeof N != "string" ? k`
+`, nr = typeof N != "string" ? M`
         animation: ${N} 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite;
-      ` : null, L = R`
+      ` : null, R = I`
   0% {
     opacity: 1;
     background-position: 0 -23px;
@@ -65,30 +66,30 @@ const O = 4, A = R`
     opacity: 1;
     background-position: -200px -23px;
   }
-`, nr = typeof L != "string" ? k`
-        animation: ${L} 3s infinite linear;
-      ` : null, ir = (e) => {
+`, ir = typeof R != "string" ? M`
+        animation: ${R} 3s infinite linear;
+      ` : null, sr = (e) => {
   const {
     classes: r,
     variant: t,
     color: a
-  } = e, c = {
-    root: ["root", `color${f(a)}`, t],
-    dashed: ["dashed", `dashedColor${f(a)}`],
-    bar1: ["bar", `barColor${f(a)}`, (t === "indeterminate" || t === "query") && "bar1Indeterminate", t === "determinate" && "bar1Determinate", t === "buffer" && "bar1Buffer"],
-    bar2: ["bar", t !== "buffer" && `barColor${f(a)}`, t === "buffer" && `color${f(a)}`, (t === "indeterminate" || t === "query") && "bar2Indeterminate", t === "buffer" && "bar2Buffer"]
+  } = e, f = {
+    root: ["root", `color${b(a)}`, t],
+    dashed: ["dashed", `dashedColor${b(a)}`],
+    bar1: ["bar", `barColor${b(a)}`, (t === "indeterminate" || t === "query") && "bar1Indeterminate", t === "determinate" && "bar1Determinate", t === "buffer" && "bar1Buffer"],
+    bar2: ["bar", t !== "buffer" && `barColor${b(a)}`, t === "buffer" && `color${b(a)}`, (t === "indeterminate" || t === "query") && "bar2Indeterminate", t === "buffer" && "bar2Buffer"]
   };
-  return X(c, tr, r);
-}, I = (e, r) => e.vars ? e.vars.palette.LinearProgress[`${r}Bg`] : e.palette.mode === "light" ? Q(e.palette[r].main, 0.62) : W(e.palette[r].main, 0.5), sr = g("span", {
+  return X(f, or, r);
+}, j = (e, r) => e.vars ? e.vars.palette.LinearProgress[`${r}Bg`] : e.palette.mode === "light" ? W(e.palette[r].main, 0.62) : Z(e.palette[r].main, 0.5), lr = y("span", {
   name: "MuiLinearProgress",
   slot: "Root",
   overridesResolver: (e, r) => {
     const {
       ownerState: t
     } = e;
-    return [r.root, r[`color${f(t.color)}`], r[t.variant]];
+    return [r.root, r[`color${b(t.color)}`], r[t.variant]];
   }
-})(S(({
+})(P(({
   theme: e
 }) => ({
   position: "relative",
@@ -105,7 +106,7 @@ const O = 4, A = R`
       color: r
     },
     style: {
-      backgroundColor: I(e, r)
+      backgroundColor: j(e, r)
     }
   })), {
     props: ({
@@ -138,16 +139,16 @@ const O = 4, A = R`
       transform: "rotate(180deg)"
     }
   }]
-}))), lr = g("span", {
+}))), pr = y("span", {
   name: "MuiLinearProgress",
   slot: "Dashed",
   overridesResolver: (e, r) => {
     const {
       ownerState: t
     } = e;
-    return [r.dashed, r[`dashedColor${f(t.color)}`]];
+    return [r.dashed, r[`dashedColor${b(t.color)}`]];
   }
-})(S(({
+})(P(({
   theme: e
 }) => ({
   position: "absolute",
@@ -165,7 +166,7 @@ const O = 4, A = R`
       backgroundImage: "radial-gradient(currentColor 0%, currentColor 16%, transparent 42%)"
     }
   }, ...Object.entries(e.palette).filter(w()).map(([r]) => {
-    const t = I(e, r);
+    const t = j(e, r);
     return {
       props: {
         color: r
@@ -175,19 +176,19 @@ const O = 4, A = R`
       }
     };
   })]
-})), nr || {
+})), ir || {
   // At runtime for Pigment CSS, `bufferAnimation` will be null and the generated keyframe will be used.
-  animation: `${L} 3s infinite linear`
-}), pr = g("span", {
+  animation: `${R} 3s infinite linear`
+}), cr = y("span", {
   name: "MuiLinearProgress",
   slot: "Bar1",
   overridesResolver: (e, r) => {
     const {
       ownerState: t
     } = e;
-    return [r.bar, r[`barColor${f(t.color)}`], (t.variant === "indeterminate" || t.variant === "query") && r.bar1Indeterminate, t.variant === "determinate" && r.bar1Determinate, t.variant === "buffer" && r.bar1Buffer];
+    return [r.bar, r[`barColor${b(t.color)}`], (t.variant === "indeterminate" || t.variant === "query") && r.bar1Indeterminate, t.variant === "determinate" && r.bar1Determinate, t.variant === "buffer" && r.bar1Buffer];
   }
-})(S(({
+})(P(({
   theme: e
 }) => ({
   width: "100%",
@@ -216,7 +217,7 @@ const O = 4, A = R`
       variant: "determinate"
     },
     style: {
-      transition: `transform .${O}s linear`
+      transition: `transform .${B}s linear`
     }
   }, {
     props: {
@@ -224,7 +225,7 @@ const O = 4, A = R`
     },
     style: {
       zIndex: 1,
-      transition: `transform .${O}s linear`
+      transition: `transform .${B}s linear`
     }
   }, {
     props: ({
@@ -237,20 +238,20 @@ const O = 4, A = R`
     props: ({
       ownerState: r
     }) => r.variant === "indeterminate" || r.variant === "query",
-    style: or || {
-      animation: `${A} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite`
+    style: ar || {
+      animation: `${L} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite`
     }
   }]
-}))), cr = g("span", {
+}))), dr = y("span", {
   name: "MuiLinearProgress",
   slot: "Bar2",
   overridesResolver: (e, r) => {
     const {
       ownerState: t
     } = e;
-    return [r.bar, r[`barColor${f(t.color)}`], (t.variant === "indeterminate" || t.variant === "query") && r.bar2Indeterminate, t.variant === "buffer" && r.bar2Buffer];
+    return [r.bar, r[`barColor${b(t.color)}`], (t.variant === "indeterminate" || t.variant === "query") && r.bar2Indeterminate, t.variant === "buffer" && r.bar2Buffer];
   }
-})(S(({
+})(P(({
   theme: e
 }) => ({
   width: "100%",
@@ -294,8 +295,8 @@ const O = 4, A = R`
       variant: "buffer"
     },
     style: {
-      backgroundColor: I(e, r),
-      transition: `transform .${O}s linear`
+      backgroundColor: j(e, r),
+      transition: `transform .${B}s linear`
     }
   })), {
     props: ({
@@ -308,58 +309,58 @@ const O = 4, A = R`
     props: ({
       ownerState: r
     }) => r.variant === "indeterminate" || r.variant === "query",
-    style: ar || {
+    style: nr || {
       animation: `${N} 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite`
     }
   }]
-}))), Y = /* @__PURE__ */ $.forwardRef(function(r, t) {
+}))), Y = /* @__PURE__ */ O.forwardRef(function(r, t) {
   const a = F({
     props: r,
     name: "MuiLinearProgress"
   }), {
-    className: c,
-    color: s = "primary",
-    value: m,
-    valueBuffer: y,
-    variant: d = "indeterminate",
+    className: f,
+    color: i = "primary",
+    value: g,
+    valueBuffer: m,
+    variant: s = "indeterminate",
     ...v
-  } = a, l = {
+  } = a, p = {
     ...a,
-    color: s,
-    variant: d
-  }, p = ir(l), P = er(), u = {}, b = {
+    color: i,
+    variant: s
+  }, c = sr(p), S = tr(), d = {}, u = {
     bar1: {},
     bar2: {}
   };
-  if (d === "determinate" || d === "buffer")
-    if (m !== void 0) {
-      u["aria-valuenow"] = Math.round(m), u["aria-valuemin"] = 0, u["aria-valuemax"] = 100;
-      let i = m - 100;
-      P && (i = -i), b.bar1.transform = `translateX(${i}%)`;
+  if (s === "determinate" || s === "buffer")
+    if (g !== void 0) {
+      d["aria-valuenow"] = Math.round(g), d["aria-valuemin"] = 0, d["aria-valuemax"] = 100;
+      let l = g - 100;
+      S && (l = -l), u.bar1.transform = `translateX(${l}%)`;
     } else process.env.NODE_ENV !== "production" && console.error("MUI: You need to provide a value prop when using the determinate or buffer variant of LinearProgress .");
-  if (d === "buffer")
-    if (y !== void 0) {
-      let i = (y || 0) - 100;
-      P && (i = -i), b.bar2.transform = `translateX(${i}%)`;
+  if (s === "buffer")
+    if (m !== void 0) {
+      let l = (m || 0) - 100;
+      S && (l = -l), u.bar2.transform = `translateX(${l}%)`;
     } else process.env.NODE_ENV !== "production" && console.error("MUI: You need to provide a valueBuffer prop when using the buffer variant of LinearProgress.");
-  return /* @__PURE__ */ C(sr, {
-    className: B(p.root, c),
-    ownerState: l,
+  return /* @__PURE__ */ C(lr, {
+    className: A(c.root, f),
+    ownerState: p,
     role: "progressbar",
-    ...u,
+    ...d,
     ref: t,
     ...v,
-    children: [d === "buffer" ? /* @__PURE__ */ n(lr, {
-      className: p.dashed,
-      ownerState: l
-    }) : null, /* @__PURE__ */ n(pr, {
-      className: p.bar1,
-      ownerState: l,
-      style: b.bar1
-    }), d === "determinate" ? null : /* @__PURE__ */ n(cr, {
-      className: p.bar2,
-      ownerState: l,
-      style: b.bar2
+    children: [s === "buffer" ? /* @__PURE__ */ n(pr, {
+      className: c.dashed,
+      ownerState: p
+    }) : null, /* @__PURE__ */ n(cr, {
+      className: c.bar1,
+      ownerState: p,
+      style: u.bar1
+    }), s === "determinate" ? null : /* @__PURE__ */ n(dr, {
+      className: c.bar2,
+      ownerState: p,
+      style: u.bar2
     })]
   });
 });
@@ -404,32 +405,32 @@ process.env.NODE_ENV !== "production" && (Y.propTypes = {
    */
   variant: o.oneOf(["buffer", "determinate", "indeterminate", "query"])
 });
-function dr(e) {
+function ur(e) {
   return V("MuiMobileStepper", e);
 }
 K("MuiMobileStepper", ["root", "positionBottom", "positionTop", "positionStatic", "dots", "dot", "dotActive", "progress"]);
-const ur = (e) => {
+const fr = (e) => {
   const {
     classes: r,
     position: t
   } = e, a = {
-    root: ["root", `position${f(t)}`],
+    root: ["root", `position${b(t)}`],
     dots: ["dots"],
     dot: ["dot"],
     dotActive: ["dotActive"],
     progress: ["progress"]
   };
-  return X(a, dr, r);
-}, fr = g(rr, {
+  return X(a, ur, r);
+}, br = y(er, {
   name: "MuiMobileStepper",
   slot: "Root",
   overridesResolver: (e, r) => {
     const {
       ownerState: t
     } = e;
-    return [r.root, r[`position${f(t.position)}`]];
+    return [r.root, r[`position${b(t.position)}`]];
   }
-})(S(({
+})(P(({
   theme: e
 }) => ({
   display: "flex",
@@ -463,7 +464,7 @@ const ur = (e) => {
       bottom: 0
     }
   }]
-}))), br = g("div", {
+}))), mr = y("div", {
   name: "MuiMobileStepper",
   slot: "Dots",
   overridesResolver: (e, r) => r.dots
@@ -477,17 +478,17 @@ const ur = (e) => {
       flexDirection: "row"
     }
   }]
-}), mr = g("div", {
+}), vr = y("div", {
   name: "MuiMobileStepper",
   slot: "Dot",
-  shouldForwardProp: (e) => Z(e) && e !== "dotActive",
+  shouldForwardProp: (e) => rr(e) && e !== "dotActive",
   overridesResolver: (e, r) => {
     const {
       dotActive: t
     } = e;
     return [r.dot, t && r.dotActive];
   }
-})(S(({
+})(P(({
   theme: e
 }) => ({
   variants: [{
@@ -513,7 +514,7 @@ const ur = (e) => {
       backgroundColor: (e.vars || e).palette.primary.main
     }
   }]
-}))), vr = g(Y, {
+}))), gr = y(Y, {
   name: "MuiMobileStepper",
   slot: "Progress",
   overridesResolver: (e, r) => r.progress
@@ -526,53 +527,53 @@ const ur = (e) => {
       width: "50%"
     }
   }]
-}), G = /* @__PURE__ */ $.forwardRef(function(r, t) {
+}), G = /* @__PURE__ */ O.forwardRef(function(r, t) {
   const a = F({
     props: r,
     name: "MuiMobileStepper"
   }), {
-    activeStep: c = 0,
-    backButton: s,
-    className: m,
-    LinearProgressProps: y,
-    nextButton: d,
+    activeStep: f = 0,
+    backButton: i,
+    className: g,
+    LinearProgressProps: m,
+    nextButton: s,
     position: v = "bottom",
-    steps: l,
-    variant: p = "dots",
-    ...P
-  } = a, u = {
+    steps: p,
+    variant: c = "dots",
+    ...S
+  } = a, d = {
     ...a,
-    activeStep: c,
+    activeStep: f,
     position: v,
-    variant: p
+    variant: c
   };
-  let b;
-  p === "progress" && (l === 1 ? b = 100 : b = Math.ceil(c / (l - 1) * 100));
-  const i = ur(u);
-  return /* @__PURE__ */ C(fr, {
+  let u;
+  c === "progress" && (p === 1 ? u = 100 : u = Math.ceil(f / (p - 1) * 100));
+  const l = fr(d);
+  return /* @__PURE__ */ C(br, {
     square: !0,
     elevation: 0,
-    className: B(i.root, m),
+    className: A(l.root, g),
     ref: t,
-    ownerState: u,
-    ...P,
-    children: [s, p === "text" && /* @__PURE__ */ C($.Fragment, {
-      children: [c + 1, " / ", l]
-    }), p === "dots" && /* @__PURE__ */ n(br, {
-      ownerState: u,
-      className: i.dots,
-      children: [...new Array(l)].map((yr, x) => /* @__PURE__ */ n(mr, {
-        className: B(i.dot, x === c && i.dotActive),
-        ownerState: u,
-        dotActive: x === c
+    ownerState: d,
+    ...S,
+    children: [i, c === "text" && /* @__PURE__ */ C(O.Fragment, {
+      children: [f + 1, " / ", p]
+    }), c === "dots" && /* @__PURE__ */ n(mr, {
+      ownerState: d,
+      className: l.dots,
+      children: [...new Array(p)].map((hr, x) => /* @__PURE__ */ n(vr, {
+        className: A(l.dot, x === f && l.dotActive),
+        ownerState: d,
+        dotActive: x === f
       }, x))
-    }), p === "progress" && /* @__PURE__ */ n(vr, {
-      ownerState: u,
-      className: i.progress,
+    }), c === "progress" && /* @__PURE__ */ n(gr, {
+      ownerState: d,
+      className: l.progress,
       variant: "determinate",
-      value: b,
-      ...y
-    }), d]
+      value: u,
+      ...m
+    }), s]
   });
 });
 process.env.NODE_ENV !== "production" && (G.propTypes = {
@@ -625,8 +626,8 @@ process.env.NODE_ENV !== "production" && (G.propTypes = {
    */
   variant: o.oneOf(["dots", "progress", "text"])
 });
-const gr = _("div")(() => ({
-  ...k`
+const yr = _("div")(() => ({
+  ...M`
     position: relative;
     display: flex;
     flex-direction: column;
@@ -649,58 +650,56 @@ const gr = _("div")(() => ({
     .MuiLinearProgress-root {
       padding: 9px;
       margin: 0 9px;
-      background-color: ${M.colors.whiteGreenA};
-      border-color: ${M.colors.green};
+      background-color: ${$.colors.whiteGreenA};
+      border-color: ${$.colors.green};
 
       .MuiLinearProgress-bar {
-        background-color: ${M.colors.green};
+        background-color: ${$.colors.green};
       }
     }
   `
 })), E = _("div")(() => ({
-  ...k`
+  ...M`
     position: absolute;
     top: 0;
   `
-})), Lr = ({
+})), Ir = ({
   onNext: e,
   onBack: r,
   onFinish: t,
   children: a,
-  ...c
+  ...f
 }) => {
-  const [s, m] = D(0), [y, d] = D("forward"), v = h.toArray(a).length, l = () => {
-    d("forward"), s === v - 1 ? t == null || t() : (m((i) => i + 1), e == null || e());
-  }, p = () => {
-    d("reverse"), m((i) => i - 1), r == null || r();
-  };
-  return /* @__PURE__ */ C(gr, { className: "jcStepContainer", children: [
-    /* @__PURE__ */ n(() => {
-      if (y === "forward")
-        return s === 0 ? /* @__PURE__ */ n(q, { children: h.toArray(a)[s] ?? null }) : /* @__PURE__ */ C(j, { children: [
-          /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(H, { children: h.toArray(a)[s - 1] ?? null }) }),
-          /* @__PURE__ */ n(q, { children: h.toArray(a)[s] ?? null })
-        ] });
-      if (y === "reverse")
-        return s === v - 1 ? /* @__PURE__ */ n(z, { children: h.toArray(a)[s] ?? null }) : /* @__PURE__ */ C(j, { children: [
-          /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(J, { children: h.toArray(a)[s + 1] ?? null }) }),
-          /* @__PURE__ */ n(z, { children: h.toArray(a)[s] ?? null })
-        ] });
-    }, {}),
+  const [i, g] = T(0), [m, s] = T("forward"), v = h.toArray(a).length, p = () => {
+    i === v - 1 ? t == null || t() : (k(() => s("none")), k(() => s("forward")), g((u) => u + 1), e == null || e());
+  }, c = () => {
+    k(() => s("none")), k(() => s("reverse")), g((u) => u - 1), r == null || r();
+  }, S = () => /* @__PURE__ */ n(q, { onClick: p, children: i === v - 1 ? "Finish" : "Next" }), d = () => /* @__PURE__ */ n(q, { onClick: c, children: "Back" });
+  return /* @__PURE__ */ C(yr, { className: "jcStepContainer", children: [
+    i === 0 && m === "forward" && (h.toArray(a)[i] ?? null),
+    i !== 0 && m === "forward" && /* @__PURE__ */ C(D, { children: [
+      /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(H, { children: h.toArray(a)[i - 1] ?? null }) }),
+      /* @__PURE__ */ n(J, { children: h.toArray(a)[i] ?? null })
+    ] }),
+    i === v - 1 && m === "reverse" && /* @__PURE__ */ n(z, { children: h.toArray(a)[i] ?? null }),
+    i !== v - 1 && m === "reverse" && /* @__PURE__ */ C(D, { children: [
+      /* @__PURE__ */ n(E, { children: /* @__PURE__ */ n(Q, { children: h.toArray(a)[i + 1] ?? null }) }),
+      /* @__PURE__ */ n(z, { children: h.toArray(a)[i] ?? null })
+    ] }),
     /* @__PURE__ */ n(
       G,
       {
         variant: "progress",
         steps: v,
         position: "static",
-        activeStep: s,
-        nextButton: /* @__PURE__ */ n(() => /* @__PURE__ */ n(T, { onClick: l, children: s === v - 1 ? "Finish" : "Next" }), {}),
-        backButton: s === 0 ? /* @__PURE__ */ n("div", { style: { width: "103px" } }) : /* @__PURE__ */ n(() => /* @__PURE__ */ n(T, { onClick: p, children: "Back" }), {}),
-        ...c
+        activeStep: i,
+        nextButton: /* @__PURE__ */ n(S, {}),
+        backButton: i === 0 ? /* @__PURE__ */ n("div", { style: { width: "103px" } }) : /* @__PURE__ */ n(d, {}),
+        ...f
       }
     )
   ] });
 };
 export {
-  Lr as default
+  Ir as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.237",
+  "version": "0.0.241",
   "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",