@fangzsx/component-library 0.0.16 → 0.0.18

package/dist/components/Stepper/index.d.ts

@@ -1,11 +1,10 @@
-interface StepConfig {
-    label: string;
-}
+import { SxProps, Theme } from '@mui/material/styles';
+
 interface HorizontalLinearStepperProps {
-    steps: StepConfig[];
+    steps: string[];
     activeStep?: number;
-    sx?: any;
-    stepperSx?: any;
+    sx?: SxProps<Theme>;
+    stepperSx?: SxProps<Theme>;
 }
-export declare function Stepper({ steps, activeStep, sx, stepperSx }: HorizontalLinearStepperProps): import("react/jsx-runtime").JSX.Element;
+export declare function Stepper({ steps, activeStep, sx, stepperSx, }: HorizontalLinearStepperProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Stepper/index.js

@@ -1,20 +1,20 @@
 import { jsxs as P, jsx as s } from "react/jsx-runtime";
 import { Stepper as ee } from "@mui/material";
 import { B as te } from "../../Box-DPlM16yK.js";
-import * as u from "react";
-import { g as A, a as D, P as e } from "../../generateUtilityClasses-BCID9NF1.js";
-import { u as V, s as C, c as j, a as W, m as R } from "../../useForkRef-gLJikozA.js";
+import * as m from "react";
+import { g as D, a as V, P as e } from "../../generateUtilityClasses-BCID9NF1.js";
+import { u as W, s as C, c as j, a as _, m as R } from "../../useForkRef-gLJikozA.js";
 import { i as oe } from "../../integerPropType-BihGt2aU.js";
-import { u as $ } from "../../useSlot-jPRhj-MO.js";
+import { u as E } from "../../useSlot-jPRhj-MO.js";
 import { c as H, S as ne } from "../../createSvgIcon-ChKzptBc.js";
-const _ = /* @__PURE__ */ u.createContext({});
-process.env.NODE_ENV !== "production" && (_.displayName = "StepperContext");
-const k = /* @__PURE__ */ u.createContext({});
-process.env.NODE_ENV !== "production" && (k.displayName = "StepContext");
+const k = /* @__PURE__ */ m.createContext({});
+process.env.NODE_ENV !== "production" && (k.displayName = "StepperContext");
+const A = /* @__PURE__ */ m.createContext({});
+process.env.NODE_ENV !== "production" && (A.displayName = "StepContext");
 function re(t) {
-  return A("MuiStep", t);
+  return D("MuiStep", t);
 }
-D("MuiStep", ["root", "horizontal", "vertical", "alternativeLabel", "completed"]);
+V("MuiStep", ["root", "horizontal", "vertical", "alternativeLabel", "completed"]);
 const ae = (t) => {
   const {
     classes: o,
@@ -22,7 +22,7 @@ const ae = (t) => {
     alternativeLabel: r,
     completed: a
   } = t;
-  return W({
+  return _({
     root: ["root", n, r && "alternativeLabel", a && "completed"]
   }, re, o);
 }, le = C("div", {
@@ -52,8 +52,8 @@ const ae = (t) => {
       position: "relative"
     }
   }]
-}), J = /* @__PURE__ */ u.forwardRef(function(o, n) {
-  const r = V({
+}), J = /* @__PURE__ */ m.forwardRef(function(o, n) {
+  const r = W({
     props: o,
     name: "MuiStep"
   }), {
@@ -62,50 +62,50 @@ const ae = (t) => {
     className: b,
     component: i = "div",
     completed: p,
-    disabled: m,
+    disabled: u,
     expanded: d = !1,
     index: c,
     last: S,
-    ...E
+    ...$
   } = r, {
-    activeStep: N,
+    activeStep: I,
     connector: L,
-    alternativeLabel: I,
+    alternativeLabel: M,
     orientation: w,
     nonLinear: O
-  } = u.useContext(_);
-  let [x = !1, M = !1, v = !1] = [a, p, m];
-  N === c ? x = a !== void 0 ? a : !0 : !O && N > c ? M = p !== void 0 ? p : !0 : !O && N < c && (v = m !== void 0 ? m : !0);
-  const T = u.useMemo(() => ({
+  } = m.useContext(k);
+  let [x = !1, g = !1, v = !1] = [a, p, u];
+  I === c ? x = a !== void 0 ? a : !0 : !O && I > c ? g = p !== void 0 ? p : !0 : !O && I < c && (v = u !== void 0 ? u : !0);
+  const T = m.useMemo(() => ({
     index: c,
     last: S,
     expanded: d,
     icon: c + 1,
     active: x,
-    completed: M,
+    completed: g,
     disabled: v
-  }), [c, S, d, x, M, v]), f = {
+  }), [c, S, d, x, g, v]), f = {
     ...r,
     active: x,
     orientation: w,
-    alternativeLabel: I,
-    completed: M,
+    alternativeLabel: M,
+    completed: g,
     disabled: v,
     expanded: d,
     component: i
-  }, h = ae(f), g = /* @__PURE__ */ P(le, {
+  }, h = ae(f), N = /* @__PURE__ */ P(le, {
     as: i,
     className: j(h.root, b),
     ref: n,
     ownerState: f,
-    ...E,
-    children: [L && I && c !== 0 ? L : null, l]
+    ...$,
+    children: [L && M && c !== 0 ? L : null, l]
   });
-  return /* @__PURE__ */ s(k.Provider, {
+  return /* @__PURE__ */ s(A.Provider, {
     value: T,
-    children: L && !I && c !== 0 ? /* @__PURE__ */ P(u.Fragment, {
-      children: [L, g]
-    }) : g
+    children: L && !M && c !== 0 ? /* @__PURE__ */ P(m.Fragment, {
+      children: [L, N]
+    }) : N
   });
 });
 process.env.NODE_ENV !== "production" && (J.propTypes = {
@@ -169,9 +169,9 @@ const se = H(/* @__PURE__ */ s("path", {
   d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
 }), "Warning");
 function ce(t) {
-  return A("MuiStepIcon", t);
+  return D("MuiStepIcon", t);
 }
-const z = D("MuiStepIcon", ["root", "active", "completed", "error", "text"]);
+const z = V("MuiStepIcon", ["root", "active", "completed", "error", "text"]);
 var G;
 const pe = (t) => {
   const {
@@ -180,7 +180,7 @@ const pe = (t) => {
     completed: r,
     error: a
   } = t;
-  return W({
+  return _({
     root: ["root", n && "active", r && "completed", a && "error"],
     text: ["text"]
   }, ce, o);
@@ -213,8 +213,8 @@ const pe = (t) => {
   fill: (t.vars || t).palette.primary.contrastText,
   fontSize: t.typography.caption.fontSize,
   fontFamily: t.typography.fontFamily
-}))), K = /* @__PURE__ */ u.forwardRef(function(o, n) {
-  const r = V({
+}))), K = /* @__PURE__ */ m.forwardRef(function(o, n) {
+  const r = W({
     props: o,
     name: "MuiStepIcon"
   }), {
@@ -223,7 +223,7 @@ const pe = (t) => {
     completed: b = !1,
     error: i = !1,
     icon: p,
-    ...m
+    ...u
   } = r, d = {
     ...r,
     active: a,
@@ -237,18 +237,18 @@ const pe = (t) => {
       className: S,
       ref: n,
       ownerState: d,
-      ...m
+      ...u
     }) : b ? /* @__PURE__ */ s(U, {
       as: se,
       className: S,
       ref: n,
       ownerState: d,
-      ...m
+      ...u
     }) : /* @__PURE__ */ P(U, {
       className: S,
       ref: n,
       ownerState: d,
-      ...m,
+      ...u,
       children: [G || (G = /* @__PURE__ */ s("circle", {
         cx: "12",
         cy: "12",
@@ -304,9 +304,9 @@ process.env.NODE_ENV !== "production" && (K.propTypes = {
   sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
 });
 function be(t) {
-  return A("MuiStepLabel", t);
+  return D("MuiStepLabel", t);
 }
-const y = D("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active", "completed", "error", "disabled", "iconContainer", "alternativeLabel", "labelContainer"]), ue = (t) => {
+const y = V("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active", "completed", "error", "disabled", "iconContainer", "alternativeLabel", "labelContainer"]), me = (t) => {
   const {
     classes: o,
     orientation: n,
@@ -316,13 +316,13 @@ const y = D("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active"
     disabled: b,
     alternativeLabel: i
   } = t;
-  return W({
+  return _({
     root: ["root", n, l && "error", b && "disabled", i && "alternativeLabel"],
     label: ["label", r && "active", a && "completed", l && "error", b && "disabled", i && "alternativeLabel"],
     iconContainer: ["iconContainer", r && "active", a && "completed", l && "error", b && "disabled", i && "alternativeLabel"],
     labelContainer: ["labelContainer", i && "alternativeLabel"]
   }, be, o);
-}, me = C("span", {
+}, ue = C("span", {
   name: "MuiStepLabel",
   slot: "Root",
   overridesResolver: (t, o) => {
@@ -395,8 +395,8 @@ const y = D("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active"
   [`&.${y.alternativeLabel}`]: {
     textAlign: "center"
   }
-}))), F = /* @__PURE__ */ u.forwardRef(function(o, n) {
-  const r = V({
+}))), F = /* @__PURE__ */ m.forwardRef(function(o, n) {
+  const r = W({
     props: o,
     name: "MuiStepLabel"
   }), {
@@ -405,21 +405,21 @@ const y = D("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active"
     componentsProps: b = {},
     error: i = !1,
     icon: p,
-    optional: m,
+    optional: u,
     slots: d = {},
     slotProps: c = {},
     StepIconComponent: S,
-    StepIconProps: E,
-    ...N
+    StepIconProps: $,
+    ...I
   } = r, {
     alternativeLabel: L,
-    orientation: I
-  } = u.useContext(_), {
+    orientation: M
+  } = m.useContext(k), {
     active: w,
     disabled: O,
     completed: x,
-    icon: M
-  } = u.useContext(k), v = p || M;
+    icon: g
+  } = m.useContext(A), v = p || g;
   let T = S;
   v && !T && (T = K);
   const f = {
@@ -429,30 +429,30 @@ const y = D("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active"
     completed: x,
     disabled: O,
     error: i,
-    orientation: I
-  }, h = ue(f), g = {
+    orientation: M
+  }, h = me(f), N = {
     slots: d,
     slotProps: {
-      stepIcon: E,
+      stepIcon: $,
       ...b,
       ...c
     }
-  }, [Q, X] = $("root", {
-    elementType: me,
+  }, [Q, X] = E("root", {
+    elementType: ue,
     externalForwardedProps: {
-      ...g,
-      ...N
+      ...N,
+      ...I
     },
     ownerState: f,
     ref: n,
     className: j(h.root, l)
-  }), [Y, B] = $("label", {
+  }), [Y, B] = E("label", {
     elementType: fe,
-    externalForwardedProps: g,
+    externalForwardedProps: N,
     ownerState: f
-  }), [q, Z] = $("stepIcon", {
+  }), [q, Z] = E("stepIcon", {
     elementType: T,
-    externalForwardedProps: g,
+    externalForwardedProps: N,
     ownerState: f
   });
   return /* @__PURE__ */ P(Q, {
@@ -474,7 +474,7 @@ const y = D("MuiStepLabel", ["root", "horizontal", "vertical", "label", "active"
         ...B,
         className: j(h.label, B?.className),
         children: a
-      }) : null, m]
+      }) : null, u]
     })]
   });
 });
@@ -550,58 +550,37 @@ process.env.NODE_ENV !== "production" && (F.propTypes = {
   sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
 });
 F.muiName = "StepLabel";
-function Ie({
+function Me({
   steps: t,
   activeStep: o = 0,
   sx: n,
   stepperSx: r
 }) {
   const a = {
-    "& .MuiStepLabel-root .Mui-completed": {
-      color: "#27A4E8"
-    },
-    "& .MuiStepLabel-root .Mui-active": {
-      color: "#27A4E8"
+    "& .MuiStepIcon-root": {
+      color: "#bdbdbd",
+      width: 32,
+      height: 32,
+      "&.Mui-active": { color: "#27A4E8" },
+      "&.Mui-completed": { color: "#27A4E8" }
     },
     "& .MuiStepLabel-root .Mui-active .MuiStepIcon-text": {
       fill: "white"
     },
-    "& .MuiStepIcon-root": {
-      color: "#bdbdbd",
-      width: "32px",
-      height: "32px",
-      "&.Mui-active": {
-        color: "#27A4E8"
-      },
-      "&.Mui-completed": {
-        color: "#27A4E8"
-      }
-    },
     "& .MuiStepLabel-label": {
       color: "#6B7C93",
       fontSize: "14px",
-      "&.Mui-active": {
-        color: "#000000",
-        fontWeight: 600
-      },
-      "&.Mui-completed": {
-        color: "#000000"
-      }
+      "&.Mui-active": { color: "#000000", fontWeight: 600 },
+      "&.Mui-completed": { color: "#000000" }
     },
     "& .MuiStepConnector-line": {
       borderColor: "#e0e0e0",
       borderTopWidth: 1
     },
-    "& .MuiStepConnector-root.Mui-active .MuiStepConnector-line": {
-      borderColor: "#e0e0e0"
-    },
-    "& .MuiStepConnector-root.Mui-completed .MuiStepConnector-line": {
-      borderColor: "#e0e0e0"
-    },
-    ...r
+    ...r ?? {}
   };
-  return /* @__PURE__ */ s(te, { sx: { width: "100%", ...n }, children: /* @__PURE__ */ s(ee, { activeStep: o, sx: a, children: t.map((l) => /* @__PURE__ */ s(J, { children: /* @__PURE__ */ s(F, { children: l.label }) }, l.label)) }) });
+  return /* @__PURE__ */ s(te, { sx: { width: "100%", ...n ?? {} }, children: /* @__PURE__ */ s(ee, { activeStep: o, sx: a, children: t.map((l) => /* @__PURE__ */ s(J, { children: /* @__PURE__ */ s(F, { children: l }) }, l)) }) });
 }
 export {
-  Ie as Stepper
+  Me as Stepper
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@fangzsx/component-library",
   "author": "Jay Gilbert Garzon",
   "private": false,
-  "version": "0.0.16",
+  "version": "0.0.18",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",