@caspeco/casper-ui-library 9.13.0 → 10.0.0

package/dist/components/skeleton/skeleton-text.d.ts

@@ -4,5 +4,5 @@ import { SkeletonTextProps } from './types.js';
  *
  * @see Docs https://caspeco.github.io/casper-ui-library/components/skeleton
  */
-export declare function SkeletonText({ backgroundColor, variant, isLoaded, ...props }: SkeletonTextProps): import("react/jsx-runtime").JSX.Element;
+export declare function SkeletonText({ backgroundColor, variant, isLoaded, ...props }: SkeletonTextProps): import("react").JSX.Element;
 //# sourceMappingURL=skeleton-text.d.ts.map

package/dist/components/skeleton/skeleton-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-text.d.ts","sourceRoot":"","sources":["../../../lib/components/skeleton/skeleton-text.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD;;;;GAIG;AAEH,wBAAgB,YAAY,CAAC,EAC5B,eAAuD,EACvD,OAAiB,EACjB,QAAQ,EACR,GAAG,KAAK,EACR,EAAE,iBAAiB,2CAKnB"}
+{"version":3,"file":"skeleton-text.d.ts","sourceRoot":"","sources":["../../../lib/components/skeleton/skeleton-text.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD;;;;GAIG;AAEH,wBAAgB,YAAY,CAAC,EAC5B,eAAuD,EACvD,OAAiB,EACjB,QAAQ,EACR,GAAG,KAAK,EACR,EAAE,iBAAiB,+BAKnB"}

package/dist/components/skeleton/skeleton-text.js

@@ -1,15 +1,20 @@
-import { jsx as a } from "react/jsx-runtime";
-import { SkeletonText as i } from "@chakra-ui/react";
-import { ThemeColorVariable as l } from "../../theme/theme-types.js";
-function u({
-  backgroundColor: e = l.OnBackgroundBorder,
-  variant: r = "pulse",
-  isLoaded: t,
-  ...n
-}) {
-  const o = !t;
-  return /* @__PURE__ */ a(i, { loading: o, background: o ? e : void 0, variant: r, ...n });
+import { jsx as m } from "react/jsx-runtime";
+import { c as p } from "../../_virtual/compiler-runtime.js";
+import { SkeletonText as u } from "@chakra-ui/react";
+import { ThemeColorVariable as f } from "../../theme/theme-types.js";
+function b(a) {
+  const o = p.c(10);
+  let n, e, t, r;
+  o[0] !== a ? ({
+    backgroundColor: t,
+    variant: r,
+    isLoaded: n,
+    ...e
+  } = a, o[0] = a, o[1] = n, o[2] = e, o[3] = t, o[4] = r) : (n = o[1], e = o[2], t = o[3], r = o[4]);
+  const d = t === void 0 ? f.OnBackgroundBorder : t, s = r === void 0 ? "pulse" : r, i = !n, c = i ? d : void 0;
+  let l;
+  return o[5] !== c || o[6] !== i || o[7] !== e || o[8] !== s ? (l = /* @__PURE__ */ m(u, { loading: i, background: c, variant: s, ...e }), o[5] = c, o[6] = i, o[7] = e, o[8] = s, o[9] = l) : l = o[9], l;
 }
 export {
-  u as SkeletonText
+  b as SkeletonText
 };

package/dist/components/skeleton/skeleton.composition.d.ts

@@ -1,3 +1,3 @@
-export declare const BasicSkeleton: () => import("react/jsx-runtime").JSX.Element;
-export declare const BasicSkeletonText: () => import("react/jsx-runtime").JSX.Element;
+export declare const BasicSkeleton: () => import("react").JSX.Element;
+export declare const BasicSkeletonText: () => import("react").JSX.Element;
 //# sourceMappingURL=skeleton.composition.d.ts.map

package/dist/components/skeleton/skeleton.composition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/skeleton/skeleton.composition.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa,+CAEzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,+CAM7B,CAAC"}
+{"version":3,"file":"skeleton.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/skeleton/skeleton.composition.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa,mCAEzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,mCAM7B,CAAC"}

package/dist/components/skeleton/skeleton.d.ts

@@ -4,5 +4,5 @@ import { SkeletonProps } from './types.js';
  *
  * @see Docs https://caspeco.github.io/casper-ui-library/components/skeleton
  */
-export declare function Skeleton({ backgroundColor, variant, isLoaded, children, ...props }: SkeletonProps): import("react/jsx-runtime").JSX.Element;
+export declare function Skeleton({ backgroundColor, variant, isLoaded, children, ...props }: SkeletonProps): import("react").JSX.Element;
 //# sourceMappingURL=skeleton.d.ts.map

package/dist/components/skeleton/skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../lib/components/skeleton/skeleton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,EACxB,eAAuD,EACvD,OAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACR,EAAE,aAAa,2CASf"}
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../lib/components/skeleton/skeleton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,EACxB,eAAuD,EACvD,OAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACR,EAAE,aAAa,+BASf"}

package/dist/components/skeleton/skeleton.js

@@ -1,16 +1,21 @@
-import { jsx as i } from "react/jsx-runtime";
-import { Skeleton as l } from "@chakra-ui/react";
-import { ThemeColorVariable as m } from "../../theme/theme-types.js";
-function p({
-  backgroundColor: r = m.OnBackgroundBorder,
-  variant: e = "pulse",
-  isLoaded: n,
-  children: t,
-  ...a
-}) {
-  const o = !n;
-  return /* @__PURE__ */ i(l, { loading: o, background: o ? r : void 0, variant: e, ...a, children: t });
+import { jsx as p } from "react/jsx-runtime";
+import { c as u } from "../../_virtual/compiler-runtime.js";
+import { Skeleton as f } from "@chakra-ui/react";
+import { ThemeColorVariable as k } from "../../theme/theme-types.js";
+function C(c) {
+  const o = u.c(12);
+  let e, l, r, t, n;
+  o[0] !== c ? ({
+    backgroundColor: t,
+    variant: n,
+    isLoaded: l,
+    children: e,
+    ...r
+  } = c, o[0] = c, o[1] = e, o[2] = l, o[3] = r, o[4] = t, o[5] = n) : (e = o[1], l = o[2], r = o[3], t = o[4], n = o[5]);
+  const m = t === void 0 ? k.OnBackgroundBorder : t, s = n === void 0 ? "pulse" : n, i = !l, d = i ? m : void 0;
+  let a;
+  return o[6] !== d || o[7] !== e || o[8] !== i || o[9] !== r || o[10] !== s ? (a = /* @__PURE__ */ p(f, { loading: i, background: d, variant: s, ...r, children: e }), o[6] = d, o[7] = e, o[8] = i, o[9] = r, o[10] = s, o[11] = a) : a = o[11], a;
 }
 export {
-  p as Skeleton
+  C as Skeleton
 };

package/dist/components/spinner/spinner.composition.d.ts

@@ -1,3 +1,3 @@
-export declare const SpinnerSizes: () => import("react/jsx-runtime").JSX.Element;
-export declare const SpinnerColors: () => import("react/jsx-runtime").JSX.Element;
+export declare const SpinnerSizes: () => import("react").JSX.Element;
+export declare const SpinnerColors: () => import("react").JSX.Element;
 //# sourceMappingURL=spinner.composition.d.ts.map

package/dist/components/spinner/spinner.composition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/spinner/spinner.composition.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,+CAQxB,CAAC;AAEF,eAAO,MAAM,aAAa,+CAWzB,CAAC"}
+{"version":3,"file":"spinner.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/spinner/spinner.composition.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,mCAQxB,CAAC;AAEF,eAAO,MAAM,aAAa,mCAWzB,CAAC"}

package/dist/components/spinner/spinner.d.ts

@@ -1,3 +1,3 @@
 import { SpinnerProps } from './types.js';
-export declare function Spinner({ size, color, ...props }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
+export declare function Spinner({ size, color, ...props }: SpinnerProps): import("react").JSX.Element;
 //# sourceMappingURL=spinner.d.ts.map

package/dist/components/spinner/spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../lib/components/spinner/spinner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,SAAS,CAAC;AAazD,wBAAgB,OAAO,CAAC,EAAE,IAAW,EAAE,KAAkC,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,2CAgClG"}
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../lib/components/spinner/spinner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,SAAS,CAAC;AAazD,wBAAgB,OAAO,CAAC,EAAE,IAAW,EAAE,KAAkC,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,+BAgClG"}

package/dist/components/spinner/spinner.js

@@ -1,52 +1,29 @@
-import { jsxs as l, jsx as i } from "react/jsx-runtime";
-import { chakra as h } from "@chakra-ui/react";
-import { ThemeColorVariable as n, ThemeIconSizeVariable as r } from "../../theme/theme-types.js";
-const d = {
-  sm: r.XLarge,
-  md: r.X2Large,
-  lg: r.X3Large
-}, o = 20, t = 4, a = 2 * Math.PI * o, p = a * 0.5;
-function u({ size: s = "md", color: c = n.Primary, ...m }) {
-  const e = d[s];
-  return /* @__PURE__ */ l(
-    h.svg,
-    {
-      viewBox: "0 0 48 48",
-      width: e,
-      height: e,
-      color: c,
-      animation: "spin",
-      animationDuration: "0.7s",
-      ...m,
-      children: [
-        /* @__PURE__ */ i(
-          "circle",
-          {
-            cx: "24",
-            cy: "24",
-            r: o,
-            fill: "none",
-            stroke: n.SurfaceDisabled,
-            strokeWidth: t
-          }
-        ),
-        /* @__PURE__ */ i(
-          "circle",
-          {
-            cx: "24",
-            cy: "24",
-            r: o,
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth: t,
-            strokeLinecap: "round",
-            strokeDasharray: `${p} ${a}`
-          }
-        )
-      ]
-    }
-  );
+import { jsx as f, jsxs as x } from "react/jsx-runtime";
+import { c as g } from "../../_virtual/compiler-runtime.js";
+import { chakra as C } from "@chakra-ui/react";
+import { ThemeColorVariable as h, ThemeIconSizeVariable as m } from "../../theme/theme-types.js";
+const R = {
+  sm: m.XLarge,
+  md: m.X2Large,
+  lg: m.X3Large
+}, p = 20, d = 4, k = 2 * Math.PI * p, S = k * 0.5;
+function b(l) {
+  const e = g.c(10);
+  let o, r, t;
+  e[0] !== l ? ({
+    size: r,
+    color: t,
+    ...o
+  } = l, e[0] = l, e[1] = o, e[2] = r, e[3] = t) : (o = e[1], r = e[2], t = e[3]);
+  const u = r === void 0 ? "md" : r, a = t === void 0 ? h.Primary : t, i = R[u];
+  let s, n;
+  e[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (s = /* @__PURE__ */ f("circle", { cx: "24", cy: "24", r: p, fill: "none", stroke: h.SurfaceDisabled, strokeWidth: d }), n = /* @__PURE__ */ f("circle", { cx: "24", cy: "24", r: p, fill: "none", stroke: "currentColor", strokeWidth: d, strokeLinecap: "round", strokeDasharray: `${S} ${k}` }), e[4] = s, e[5] = n) : (s = e[4], n = e[5]);
+  let c;
+  return e[6] !== a || e[7] !== i || e[8] !== o ? (c = /* @__PURE__ */ x(C.svg, { viewBox: "0 0 48 48", width: i, height: i, color: a, animation: "spin", animationDuration: "0.7s", ...o, children: [
+    s,
+    n
+  ] }), e[6] = a, e[7] = i, e[8] = o, e[9] = c) : c = e[9], c;
 }
 export {
-  u as Spinner
+  b as Spinner
 };

package/dist/components/stack/stack.composition.d.ts

@@ -1,4 +1,4 @@
-export declare const StackColumnDirection: () => import("react/jsx-runtime").JSX.Element;
-export declare const StackRowDirection: () => import("react/jsx-runtime").JSX.Element;
-export declare const WithDivider: () => import("react/jsx-runtime").JSX.Element;
+export declare const StackColumnDirection: () => import("react").JSX.Element;
+export declare const StackRowDirection: () => import("react").JSX.Element;
+export declare const WithDivider: () => import("react").JSX.Element;
 //# sourceMappingURL=stack.composition.d.ts.map

package/dist/components/stack/stack.composition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stack.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/stack/stack.composition.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB,+CAYhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,+CAY7B,CAAC;AAEF,eAAO,MAAM,WAAW,+CAYvB,CAAC"}
+{"version":3,"file":"stack.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/stack/stack.composition.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB,mCAYhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,mCAY7B,CAAC;AAEF,eAAO,MAAM,WAAW,mCAYvB,CAAC"}

package/dist/components/stack/stack.js

@@ -1,9 +1,19 @@
-import { jsx as p } from "react/jsx-runtime";
-import { Stack as f } from "@chakra-ui/react";
-import { forwardRef as c } from "react";
-const k = c(
-  ({ children: r, divider: o, spacing: t, ...a }, m) => /* @__PURE__ */ p(f, { ref: m, separator: o, gap: t, ...a, children: r })
-);
+import { jsx as c } from "react/jsx-runtime";
+import { c as m } from "../../_virtual/compiler-runtime.js";
+import { Stack as l } from "@chakra-ui/react";
+import { forwardRef as f } from "react";
+const S = f((s, a) => {
+  const r = m.c(11);
+  let t, o, e, i;
+  r[0] !== s ? ({
+    children: t,
+    divider: o,
+    spacing: i,
+    ...e
+  } = s, r[0] = s, r[1] = t, r[2] = o, r[3] = e, r[4] = i) : (t = r[1], o = r[2], e = r[3], i = r[4]);
+  let p;
+  return r[5] !== t || r[6] !== o || r[7] !== e || r[8] !== a || r[9] !== i ? (p = /* @__PURE__ */ c(l, { ref: a, separator: o, gap: i, ...e, children: t }), r[5] = t, r[6] = o, r[7] = e, r[8] = a, r[9] = i, r[10] = p) : p = r[10], p;
+});
 export {
-  k as Stack
+  S as Stack
 };

package/dist/components/stepper/check-icon.js

@@ -1,10 +1,5 @@
 import { createCasperIcon as c } from "../icon/create-icon.js";
-const e = c(
-  "CheckIcon",
-  "M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z",
-  {},
-  "0 0 512 512"
-);
+const e = c("CheckIcon", "M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z", {}, "0 0 512 512");
 export {
   e as CheckIcon
 };

package/dist/components/stepper/step-context.d.ts

@@ -1,4 +1,5 @@
 import { ThemeColorVariable } from '../../theme/index.js';
+import { ReactNode } from 'react';
 import { StepIcon } from './types.js';
 export type StepContextValues = {
     /** Orientation provided from Stepper parent. */
@@ -8,7 +9,7 @@ export type StepContextValues = {
     /** Step is active step */
     isActiveStep: boolean;
     /** Label to display next to/below step circle */
-    label: string | JSX.Element;
+    label: ReactNode;
     /** Step icon */
     icon?: StepIcon;
     /** Step circle color */

package/dist/components/stepper/step-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"step-context.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/step-context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE7C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,MAAM,iBAAiB,GAAG;IAC/B,gDAAgD;IAChD,WAAW,EAAE,UAAU,GAAG,YAAY,CAAC;IACvC,+CAA+C;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,0BAA0B;IAC1B,YAAY,EAAE,OAAO,CAAC;IACtB,iDAAiD;IACjD,KAAK,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC5B,gBAAgB;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,wBAAwB;IACxB,KAAK,EAAE,kBAAkB,CAAC;IAC1B,sBAAsB;IACtB,SAAS,EAAE,kBAAkB,CAAC;IAC9B,yBAAyB;IACzB,YAAY,EAAE,kBAAkB,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,WAAW,4CAA4D,CAAC"}
+{"version":3,"file":"step-context.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/step-context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,MAAM,iBAAiB,GAAG;IAC/B,gDAAgD;IAChD,WAAW,EAAE,UAAU,GAAG,YAAY,CAAC;IACvC,+CAA+C;IAC/C,WAAW,EAAE,OAAO,CAAC;IACrB,0BAA0B;IAC1B,YAAY,EAAE,OAAO,CAAC;IACtB,iDAAiD;IACjD,KAAK,EAAE,SAAS,CAAC;IACjB,gBAAgB;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,wBAAwB;IACxB,KAAK,EAAE,kBAAkB,CAAC;IAC1B,sBAAsB;IACtB,SAAS,EAAE,kBAAkB,CAAC;IAC9B,yBAAyB;IACzB,YAAY,EAAE,kBAAkB,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,WAAW,4CAA4D,CAAC"}

package/dist/components/stepper/step.d.ts

@@ -1,5 +1,5 @@
 /**
  * Internal usage in Stepper.tsx only. Not to be exposed.
  */
-export declare function Step(): import("react/jsx-runtime").JSX.Element;
+export declare function Step(): import("react").JSX.Element;
 //# sourceMappingURL=step.d.ts.map

package/dist/components/stepper/step.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/step.tsx"],"names":[],"mappings":"AAgGA;;GAEG;AACH,wBAAgB,IAAI,4CA2BnB"}
+{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/step.tsx"],"names":[],"mappings":"AAgGA;;GAEG;AACH,wBAAgB,IAAI,gCA2BnB"}

package/dist/components/stepper/step.js

@@ -1,22 +1,23 @@
-import { jsx as i, jsxs as l } from "react/jsx-runtime";
-import { Text as g, Box as a, Flex as u, Spinner as C } from "@chakra-ui/react";
-import { useContext as s } from "react";
-import { CheckIcon as w } from "./check-icon.js";
-import { StepContext as m } from "./step-context.js";
-import { TimesIcon as z } from "./times-icon.js";
-import { ThemeColorVariable as T, ThemeFontSizeVariable as V, ThemeFontVariable as v, ThemeSpaceVariable as S, ThemeRadiusVariable as h, ThemeIconSizeVariable as p } from "../../theme/theme-types.js";
-const x = (e, r) => {
+import { jsx as m, jsxs as d } from "react/jsx-runtime";
+import { c as S } from "../../_virtual/compiler-runtime.js";
+import { Text as y, Box as h, Flex as C, Spinner as I } from "@chakra-ui/react";
+import { useContext as x } from "react";
+import { CheckIcon as H } from "./check-icon.js";
+import { StepContext as b } from "./step-context.js";
+import { TimesIcon as R } from "./times-icon.js";
+import { ThemeColorVariable as k, ThemeFontSizeVariable as B, ThemeFontVariable as F, ThemeRadiusVariable as w, ThemeSpaceVariable as z, ThemeIconSizeVariable as g } from "../../theme/theme-types.js";
+const T = (e, i) => {
   switch (!0) {
     case e:
       return "32px";
-    case !!r:
+    case !!i:
       return "24px";
     default:
       return "13px";
   }
 };
-function I(e, r) {
-  if (!r) return "0px";
+function _(e, i) {
+  if (!i) return "0px";
   switch (e) {
     case "32px":
       return "4px";
@@ -26,67 +27,86 @@ function I(e, r) {
       return "0px";
   }
 }
-function f() {
-  const { isActiveStep: e, iconColor: r, color: o, icon: n } = s(m), t = x(e, n), c = e ? p.Small : p.XSmall;
-  return /* @__PURE__ */ l(
-    a,
-    {
-      backgroundColor: o,
-      borderRadius: "full",
-      w: t,
-      minW: t,
-      h: t,
-      minH: t,
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      color: r,
-      children: [
-        n === "check" && /* @__PURE__ */ i(w, { size: c }),
-        n === "spinner" && /* @__PURE__ */ i(
-          C,
-          {
-            css: {
-              "--spinner-size": e ? p.XSmall : "0.75rem"
-            }
-          }
-        ),
-        n === "times" && /* @__PURE__ */ i(z, { size: c })
-      ]
-    }
-  );
+function V() {
+  const e = S.c(19), {
+    isActiveStep: i,
+    iconColor: l,
+    color: o,
+    icon: t
+  } = x(b);
+  let r;
+  e[0] !== t || e[1] !== i ? (r = T(i, t), e[0] = t, e[1] = i, e[2] = r) : r = e[2];
+  const n = r, c = i ? g.Small : g.XSmall;
+  let s;
+  e[3] !== t || e[4] !== c ? (s = t === "check" && /* @__PURE__ */ m(H, { size: c }), e[3] = t, e[4] = c, e[5] = s) : s = e[5];
+  let p;
+  e[6] !== t || e[7] !== i ? (p = t === "spinner" && /* @__PURE__ */ m(I, { css: {
+    "--spinner-size": i ? g.XSmall : "0.75rem"
+  } }), e[6] = t, e[7] = i, e[8] = p) : p = e[8];
+  let f;
+  e[9] !== t || e[10] !== c ? (f = t === "times" && /* @__PURE__ */ m(R, { size: c }), e[9] = t, e[10] = c, e[11] = f) : f = e[11];
+  let a;
+  return e[12] !== n || e[13] !== o || e[14] !== l || e[15] !== s || e[16] !== p || e[17] !== f ? (a = /* @__PURE__ */ d(h, { backgroundColor: o, borderRadius: "full", w: n, minW: n, h: n, minH: n, display: "flex", alignItems: "center", justifyContent: "center", color: l, children: [
+    s,
+    p,
+    f
+  ] }), e[12] = n, e[13] = o, e[14] = l, e[15] = s, e[16] = p, e[17] = f, e[18] = a) : a = e[18], a;
 }
-function H() {
-  const { showDivider: e, dividerColor: r } = s(m);
-  return /* @__PURE__ */ l(u, { direction: "column", alignItems: "center", w: "48px", gap: S.Small, children: [
-    /* @__PURE__ */ i(f, {}),
-    e && /* @__PURE__ */ i(a, { width: "3px", minH: "46px", bg: r, borderRadius: h.Small })
-  ] });
+function $() {
+  const e = S.c(6), {
+    showDivider: i,
+    dividerColor: l
+  } = x(b);
+  let o;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ m(V, {}), e[0] = o) : o = e[0];
+  let t;
+  e[1] !== l || e[2] !== i ? (t = i && /* @__PURE__ */ m(h, { width: "3px", minH: "46px", bg: l, borderRadius: w.Small }), e[1] = l, e[2] = i, e[3] = t) : t = e[3];
+  let r;
+  return e[4] !== t ? (r = /* @__PURE__ */ d(C, { direction: "column", alignItems: "center", w: "48px", gap: z.Small, children: [
+    o,
+    t
+  ] }), e[4] = t, e[5] = r) : r = e[5], r;
 }
-function k() {
-  const { showDivider: e, dividerColor: r } = s(m);
-  return /* @__PURE__ */ l(u, { direction: "row", alignItems: "center", h: "48px", gap: S.Small, children: [
-    /* @__PURE__ */ i(f, {}),
-    e && /* @__PURE__ */ i(a, { w: "100%", h: "3px", bg: r, borderRadius: h.Small })
-  ] });
+function j() {
+  const e = S.c(6), {
+    showDivider: i,
+    dividerColor: l
+  } = x(b);
+  let o;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ m(V, {}), e[0] = o) : o = e[0];
+  let t;
+  e[1] !== l || e[2] !== i ? (t = i && /* @__PURE__ */ m(h, { w: "100%", h: "3px", bg: l, borderRadius: w.Small }), e[1] = l, e[2] = i, e[3] = t) : t = e[3];
+  let r;
+  return e[4] !== t ? (r = /* @__PURE__ */ d(C, { direction: "row", alignItems: "center", h: "48px", gap: z.Small, children: [
+    o,
+    t
+  ] }), e[4] = t, e[5] = r) : r = e[5], r;
 }
-function D() {
-  const { isActiveStep: e, orientation: r, label: o, icon: n } = s(m), t = r === "vertical", c = x(e, n), d = I(c, t), b = typeof o == "string" ? /* @__PURE__ */ i(
-    g,
-    {
-      mt: d,
-      fontFamily: v.SubHeader,
-      fontSize: V.Medium,
-      color: T.OnBackgroundHeader,
-      fontWeight: "medium",
-      children: o
-    }
-  ) : /* @__PURE__ */ i(a, { mt: d, children: o });
-  return /* @__PURE__ */ l(u, { w: "100%", h: "100%", direction: t ? "row" : "column", children: [
-    t ? /* @__PURE__ */ i(H, {}) : /* @__PURE__ */ i(k, {}),
-    b
-  ] });
+function q() {
+  const e = S.c(13), {
+    isActiveStep: i,
+    orientation: l,
+    label: o,
+    icon: t
+  } = x(b), r = l === "vertical";
+  let n;
+  if (e[0] !== t || e[1] !== i || e[2] !== r) {
+    const v = T(i, t);
+    n = _(v, r), e[0] = t, e[1] = i, e[2] = r, e[3] = n;
+  } else
+    n = e[3];
+  const c = n;
+  let s;
+  e[4] !== o || e[5] !== c ? (s = typeof o == "string" ? /* @__PURE__ */ m(y, { mt: c, fontFamily: F.SubHeader, fontSize: B.Medium, color: k.OnBackgroundHeader, fontWeight: "medium", children: o }) : /* @__PURE__ */ m(h, { mt: c, children: o }), e[4] = o, e[5] = c, e[6] = s) : s = e[6];
+  const p = s, f = r ? "row" : "column";
+  let a;
+  e[7] !== r ? (a = r ? /* @__PURE__ */ m($, {}) : /* @__PURE__ */ m(j, {}), e[7] = r, e[8] = a) : a = e[8];
+  let u;
+  return e[9] !== p || e[10] !== f || e[11] !== a ? (u = /* @__PURE__ */ d(C, { w: "100%", h: "100%", direction: f, children: [
+    a,
+    p
+  ] }), e[9] = p, e[10] = f, e[11] = a, e[12] = u) : u = e[12], u;
 }
 export {
-  D as Step
+  q as Step
 };

package/dist/components/stepper/stepper.composition.d.ts

@@ -1,7 +1,7 @@
-export declare const HorizontalOrientation: () => import("react/jsx-runtime").JSX.Element;
-export declare const VerticalOrientation: () => import("react/jsx-runtime").JSX.Element;
-export declare const ActiveStep: () => import("react/jsx-runtime").JSX.Element;
-export declare const StepIcons: () => import("react/jsx-runtime").JSX.Element;
-export declare const CustomColorsExampleOne: () => import("react/jsx-runtime").JSX.Element;
-export declare const CustomColorsExampleTwo: () => import("react/jsx-runtime").JSX.Element;
+export declare const HorizontalOrientation: () => import("react").JSX.Element;
+export declare const VerticalOrientation: () => import("react").JSX.Element;
+export declare const ActiveStep: () => import("react").JSX.Element;
+export declare const StepIcons: () => import("react").JSX.Element;
+export declare const CustomColorsExampleOne: () => import("react").JSX.Element;
+export declare const CustomColorsExampleTwo: () => import("react").JSX.Element;
 //# sourceMappingURL=stepper.composition.d.ts.map

package/dist/components/stepper/stepper.composition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/stepper.composition.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB,+CAejC,CAAC;AAEF,eAAO,MAAM,mBAAmB,+CAc/B,CAAC;AAEF,eAAO,MAAM,UAAU,+CAetB,CAAC;AAEF,eAAO,MAAM,SAAS,+CAgBrB,CAAC;AAEF,eAAO,MAAM,sBAAsB,+CAwBlC,CAAC;AAEF,eAAO,MAAM,sBAAsB,+CAmBlC,CAAC"}
+{"version":3,"file":"stepper.composition.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/stepper.composition.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB,mCAejC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mCAc/B,CAAC;AAEF,eAAO,MAAM,UAAU,mCAetB,CAAC;AAEF,eAAO,MAAM,SAAS,mCAgBrB,CAAC;AAEF,eAAO,MAAM,sBAAsB,mCAwBlC,CAAC;AAEF,eAAO,MAAM,sBAAsB,mCAmBlC,CAAC"}

package/dist/components/stepper/stepper.d.ts

@@ -4,5 +4,5 @@ import { StepperProps } from './types.js';
  *
  * @see Docs https://caspeco.github.io/casper-ui-library/components/stepper
  */
-export declare function Stepper({ activeStep, orientation, steps, ...props }: StepperProps): import("react/jsx-runtime").JSX.Element;
+export declare function Stepper({ activeStep, orientation, steps, ...props }: StepperProps): import("react").JSX.Element;
 //# sourceMappingURL=stepper.d.ts.map

package/dist/components/stepper/stepper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/stepper.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EAAE,UAAU,EAAE,WAAwB,EAAE,KAAU,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,2CA2BnG"}
+{"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../lib/components/stepper/stepper.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EAAE,UAAU,EAAE,WAAwB,EAAE,KAAU,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,+BA2BnG"}

package/dist/components/stepper/stepper.js

@@ -1,24 +1,44 @@
-import { jsx as r } from "react/jsx-runtime";
-import { Stack as u } from "@chakra-ui/react";
-import { Step as v } from "./step.js";
-import { StepContext as C } from "./step-context.js";
-import { ThemeColorVariable as e, ThemeSpaceVariable as S } from "../../theme/theme-types.js";
-function k({ activeStep: t, orientation: i = "vertical", steps: c = [], ...a }) {
-  const m = i === "vertical", d = c.map((o, n) => {
-    const l = n + 1, p = {
-      orientation: i,
-      isActiveStep: t === l,
-      showDivider: n !== c.length - 1,
-      label: o.label,
-      icon: o.icon,
-      color: o.color ?? e.OnBackgroundBorder,
-      iconColor: o.iconColor ?? e.OnBackground,
-      dividerColor: (o.dividerColor || o.color) ?? e.OnBackgroundBorder
-    };
-    return /* @__PURE__ */ r(C.Provider, { value: p, children: /* @__PURE__ */ r(v, {}) }, l);
-  });
-  return /* @__PURE__ */ r(u, { gap: S.Small, direction: m ? "column" : "row", ...a, children: d });
+import { jsx as u } from "react/jsx-runtime";
+import { c as B } from "../../_virtual/compiler-runtime.js";
+import { Stack as k } from "@chakra-ui/react";
+import { Step as x } from "./step.js";
+import { StepContext as O } from "./step-context.js";
+import { ThemeSpaceVariable as V, ThemeColorVariable as h } from "../../theme/theme-types.js";
+function P(d) {
+  const o = B.c(19);
+  let e, r, c, t;
+  o[0] !== d ? ({
+    activeStep: e,
+    orientation: c,
+    steps: t,
+    ...r
+  } = d, o[0] = d, o[1] = e, o[2] = r, o[3] = c, o[4] = t) : (e = o[1], r = o[2], c = o[3], t = o[4]);
+  const i = c === void 0 ? "vertical" : c;
+  let a;
+  o[5] !== t ? (a = t === void 0 ? [] : t, o[5] = t, o[6] = a) : a = o[6];
+  const l = a, g = i === "vertical";
+  let s;
+  if (o[7] !== e || o[8] !== i || o[9] !== l) {
+    let p;
+    o[11] !== e || o[12] !== i || o[13] !== l.length ? (p = (n, C) => {
+      const S = C + 1, b = {
+        orientation: i,
+        isActiveStep: e === S,
+        showDivider: C !== l.length - 1,
+        label: n.label,
+        icon: n.icon,
+        color: n.color ?? h.OnBackgroundBorder,
+        iconColor: n.iconColor ?? h.OnBackground,
+        dividerColor: (n.dividerColor || n.color) ?? h.OnBackgroundBorder
+      };
+      return /* @__PURE__ */ u(O.Provider, { value: b, children: /* @__PURE__ */ u(x, {}) }, S);
+    }, o[11] = e, o[12] = i, o[13] = l.length, o[14] = p) : p = o[14], s = l.map(p), o[7] = e, o[8] = i, o[9] = l, o[10] = s;
+  } else
+    s = o[10];
+  const f = s, v = g ? "column" : "row";
+  let m;
+  return o[15] !== r || o[16] !== f || o[17] !== v ? (m = /* @__PURE__ */ u(k, { gap: V.Small, direction: v, ...r, children: f }), o[15] = r, o[16] = f, o[17] = v, o[18] = m) : m = o[18], m;
 }
 export {
-  k as Stepper
+  P as Stepper
 };

package/dist/components/stepper/times-icon.js

@@ -1,10 +1,5 @@
 import { createCasperIcon as c } from "../icon/create-icon.js";
-const o = c(
-  "TimesIcon",
-  "M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z",
-  {},
-  "0 0 320 512"
-);
+const o = c("TimesIcon", "M310.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L160 210.7 54.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L114.7 256 9.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 301.3 265.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L205.3 256 310.6 150.6z", {}, "0 0 320 512");
 export {
   o as TimesIcon
 };

package/dist/components/stepper/types.d.ts

@@ -1,9 +1,10 @@
 import { CustomChakraBoxProps, LayoutProps, MarginProps, PaddingProps, ThemeColorVariable } from '../../theme/index.js';
+import { ReactNode } from 'react';
 export type StepIcon = "times" | "check" | "spinner";
 export type StepCircleSize = "13px" | "24px" | "32px";
 export type TStep = {
     /** Label to be displayed next to step. Can be both a string and an element */
-    label: string | JSX.Element;
+    label: ReactNode;
     /** The color of the step. */
     color?: ThemeColorVariable;
     /** Color of any icon displayed for step. */