reactjs-multi-stepper 1.2.0 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -5,7 +5,7 @@ It allows you to create step-based workflows such as onboarding, multi-step form
5
5
 
6
6
  ## 🎬 Demo
7
7
 
8
- ![React Multi Stepper Demo](./src/assets/react-multi-stepper-demo.gif)
8
+ ![React Multi Stepper Demo](https://github.com/UppiliSrinivas/react-stepper/blob/multi-stepper/src/assets/react-multi-stepper-demo.gif)
9
9
 
10
10
  ---
11
11
 
@@ -13,8 +13,8 @@ var U;
13
13
  function fe() {
14
14
  if (U) return R;
15
15
  U = 1;
16
- var t = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment");
17
- function o(v, c, l) {
16
+ var t = Symbol.for("react.transitional.element"), o = Symbol.for("react.fragment");
17
+ function s(v, c, l) {
18
18
  var m = null;
19
19
  if (l !== void 0 && (m = "" + l), c.key !== void 0 && (m = "" + c.key), "key" in c) {
20
20
  l = {};
@@ -29,7 +29,7 @@ function fe() {
29
29
  props: l
30
30
  };
31
31
  }
32
- return R.Fragment = s, R.jsx = o, R.jsxs = o, R;
32
+ return R.Fragment = o, R.jsx = s, R.jsxs = s, R;
33
33
  }
34
34
  var j = {};
35
35
  /**
@@ -47,7 +47,7 @@ function de() {
47
47
  function t(e) {
48
48
  if (e == null) return null;
49
49
  if (typeof e == "function")
50
- return e.$$typeof === se ? null : e.displayName || e.name || null;
50
+ return e.$$typeof === oe ? null : e.displayName || e.name || null;
51
51
  if (typeof e == "string") return e;
52
52
  switch (e) {
53
53
  case g:
@@ -87,12 +87,12 @@ function de() {
87
87
  }
88
88
  return null;
89
89
  }
90
- function s(e) {
90
+ function o(e) {
91
91
  return "" + e;
92
92
  }
93
- function o(e) {
93
+ function s(e) {
94
94
  try {
95
- s(e);
95
+ o(e);
96
96
  var r = !1;
97
97
  } catch {
98
98
  r = !0;
@@ -104,7 +104,7 @@ function de() {
104
104
  r,
105
105
  "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
106
106
  u
107
- ), s(e);
107
+ ), o(e);
108
108
  }
109
109
  }
110
110
  function v(e) {
@@ -186,7 +186,7 @@ function de() {
186
186
  var f = r.children;
187
187
  if (f !== void 0)
188
188
  if (u)
189
- if (oe(f)) {
189
+ if (se(f)) {
190
190
  for (u = 0; u < f.length; u++)
191
191
  b(f[u]);
192
192
  Object.freeze && Object.freeze(f);
@@ -213,7 +213,7 @@ React keys must be passed directly to JSX without using spread:
213
213
  f
214
214
  ), L[f + u] = !0);
215
215
  }
216
- if (f = null, a !== void 0 && (o(a), f = "" + a), m(r) && (o(r.key), f = "" + r.key), "key" in r) {
216
+ if (f = null, a !== void 0 && (s(a), f = "" + a), m(r) && (s(r.key), f = "" + r.key), "key" in r) {
217
217
  a = {};
218
218
  for (var y in r)
219
219
  y !== "key" && (a[y] = r[y]);
@@ -235,7 +235,7 @@ React keys must be passed directly to JSX without using spread:
235
235
  function b(e) {
236
236
  typeof e == "object" && e !== null && e.$$typeof === h && e._store && (e._store.validated = 1);
237
237
  }
238
- var i = ce, h = Symbol.for("react.transitional.element"), X = Symbol.for("react.portal"), g = Symbol.for("react.fragment"), H = Symbol.for("react.strict_mode"), B = Symbol.for("react.profiler"), Z = Symbol.for("react.consumer"), Q = Symbol.for("react.context"), K = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), re = Symbol.for("react.suspense_list"), te = Symbol.for("react.memo"), F = Symbol.for("react.lazy"), ne = Symbol.for("react.activity"), se = Symbol.for("react.client.reference"), P = i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Y = Object.prototype.hasOwnProperty, oe = Array.isArray, O = console.createTask ? console.createTask : function() {
238
+ var i = ce, h = Symbol.for("react.transitional.element"), X = Symbol.for("react.portal"), g = Symbol.for("react.fragment"), H = Symbol.for("react.strict_mode"), B = Symbol.for("react.profiler"), Z = Symbol.for("react.consumer"), Q = Symbol.for("react.context"), K = Symbol.for("react.forward_ref"), ee = Symbol.for("react.suspense"), re = Symbol.for("react.suspense_list"), te = Symbol.for("react.memo"), F = Symbol.for("react.lazy"), ne = Symbol.for("react.activity"), oe = Symbol.for("react.client.reference"), P = i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Y = Object.prototype.hasOwnProperty, se = Array.isArray, O = console.createTask ? console.createTask : function() {
239
239
  return null;
240
240
  };
241
241
  i = {
@@ -288,68 +288,68 @@ const G = le(
288
288
  "useMultiStepperForm must be used within a MultiStepperProvider"
289
289
  );
290
290
  return t;
291
- }, pe = ({ children: t, steppers: s }) => {
292
- const [o, v] = W(0), [c, l] = W([]);
291
+ }, pe = ({ children: t, steppers: o }) => {
292
+ const [s, v] = W(0), [c, l] = W([]);
293
293
  ue(() => {
294
- if (s.length) {
295
- const d = [...s];
294
+ if (o.length) {
295
+ const d = [...o];
296
296
  d[0].active = !0, l(d);
297
297
  }
298
- }, [s.length]);
298
+ }, [o, o.length]);
299
299
  const m = C((d) => {
300
300
  l((b) => {
301
301
  const i = [...b];
302
302
  if (d > b.length - 1) return b;
303
- i[o] && (i[o] = { ...i[o], active: !1 }), i[d] && (i[d] = { ...i[d], active: !0 });
303
+ i[s] && (i[s] = { ...i[s], active: !1 }), i[d] && (i[d] = { ...i[d], active: !0 });
304
304
  for (let h = 0; h < d; h++)
305
305
  i[h] = { ...i[h], completed: !0 };
306
306
  for (let h = d; h < i.length; h++)
307
307
  i[h] = { ...i[h], completed: !1 };
308
308
  return i;
309
309
  }), v(d);
310
- }, [o]), p = C(() => {
311
- o < c.length - 1 ? m(o + 1) : l((d) => {
310
+ }, [s]), p = C(() => {
311
+ s < c.length - 1 ? m(s + 1) : l((d) => {
312
312
  const b = [...d];
313
- return b[o] = { ...b[o], completed: !0 }, b;
313
+ return b[s] = { ...b[s], completed: !0 }, b;
314
314
  });
315
- }, [o, c.length, m]), T = C(() => {
316
- o > 0 && m(o - 1);
317
- }, [o, m]), k = V(
315
+ }, [s, c.length, m]), T = C(() => {
316
+ s > 0 && m(s - 1);
317
+ }, [s, m]), k = V(
318
318
  () => ({
319
- currentStep: o,
319
+ currentStep: s,
320
320
  steps: c,
321
321
  handleNextStep: p,
322
322
  handlePrevStep: T,
323
323
  updateSteps: m
324
324
  }),
325
- [o, c, p, T, m]
325
+ [s, c, p, T, m]
326
326
  );
327
327
  return /* @__PURE__ */ n.jsx(G.Provider, { value: k, children: t });
328
328
  }, ve = ({
329
329
  step: t,
330
- index: s
330
+ index: o
331
331
  }) => {
332
- const { steps: o } = N();
333
- return o.length ? t.loading ? /* @__PURE__ */ n.jsx("div", { className: "step step-loading", children: /* @__PURE__ */ n.jsx("div", { className: "spinner", role: "status", "aria-label": "Loading" }) }) : t.error ? /* @__PURE__ */ n.jsx("div", { className: "step step-error", children: t.icon ?? /* @__PURE__ */ n.jsx("span", { className: "text-white", children: "✗" }) }) : t.completed ? /* @__PURE__ */ n.jsx("div", { className: "step step-complete", children: t.icon ?? /* @__PURE__ */ n.jsx("span", { className: "text-white", children: "✓" }) }) : t.finshed ? /* @__PURE__ */ n.jsx("div", { className: "step step-complete", children: t.icon }) : t.active ? /* @__PURE__ */ n.jsx("div", { className: "step step-active", children: t.icon ?? /* @__PURE__ */ n.jsx("h2", { className: "text-white", children: s }) }) : /* @__PURE__ */ n.jsx("div", { className: "step step-default", children: t.icon ?? /* @__PURE__ */ n.jsx("h2", { children: s }) }) : /* @__PURE__ */ n.jsx(z, {});
332
+ const { steps: s } = N();
333
+ return s.length ? t.loading ? /* @__PURE__ */ n.jsx("div", { className: "step step-loading", children: /* @__PURE__ */ n.jsx("div", { className: "spinner", role: "status", "aria-label": "Loading" }) }) : t.error ? /* @__PURE__ */ n.jsx("div", { className: "step step-error", children: t.icon ?? /* @__PURE__ */ n.jsx("span", { className: "text-white", children: "✗" }) }) : t.completed ? /* @__PURE__ */ n.jsx("div", { className: "step step-complete", children: t.icon ?? /* @__PURE__ */ n.jsx("span", { className: "text-white", children: "✓" }) }) : t.finshed ? /* @__PURE__ */ n.jsx("div", { className: "step step-complete", children: t.icon }) : t.active ? /* @__PURE__ */ n.jsx("div", { className: "step step-active", children: t.icon ?? /* @__PURE__ */ n.jsx("h2", { className: "text-white", children: o }) }) : /* @__PURE__ */ n.jsx("div", { className: "step step-default", children: t.icon ?? /* @__PURE__ */ n.jsx("h2", { children: o }) }) : /* @__PURE__ */ n.jsx(z, {});
334
334
  }, he = () => {
335
335
  const { steps: t } = N();
336
- return t.length ? /* @__PURE__ */ n.jsx("div", { className: "app-container", children: /* @__PURE__ */ n.jsx("ol", { className: "stepper-header", children: t.map((s, o) => /* @__PURE__ */ n.jsxs(
336
+ return t.length ? /* @__PURE__ */ n.jsx("div", { className: "app-container", children: /* @__PURE__ */ n.jsx("ol", { className: "stepper-header", children: t.map((o, s) => /* @__PURE__ */ n.jsxs(
337
337
  "div",
338
338
  {
339
- className: `step-item ${s.active && "active"} ${s.completed && "complete"} `,
339
+ className: `step-item ${o.active && "active"} ${o.completed && "complete"} `,
340
340
  children: [
341
- /* @__PURE__ */ n.jsx(ve, { index: o + 1, step: s }),
341
+ /* @__PURE__ */ n.jsx(ve, { index: s + 1, step: o }),
342
342
  /* @__PURE__ */ n.jsxs("div", { className: "step-text", children: [
343
- s.title && /* @__PURE__ */ n.jsx("h3", { className: "step-title", children: s.title }),
344
- s.description && /* @__PURE__ */ n.jsx("h3", { className: "step-description", children: s.description })
343
+ o.title && /* @__PURE__ */ n.jsx("h3", { className: "step-title", children: o.title }),
344
+ o.description && /* @__PURE__ */ n.jsx("h3", { className: "step-description", children: o.description })
345
345
  ] })
346
346
  ]
347
347
  },
348
- o
348
+ s
349
349
  )) }) }) : /* @__PURE__ */ n.jsx(z, {});
350
350
  }, be = ({ onClickNext: t }) => {
351
- const { handleNextStep: s, handlePrevStep: o, currentStep: v, steps: c } = N(), l = v === c.length - 1, m = () => {
352
- c[v].completed || (s(), t(v + 1));
351
+ const { handleNextStep: o, handlePrevStep: s, currentStep: v, steps: c } = N(), l = v === c.length - 1, m = () => {
352
+ c[v].completed || (o(), t(v + 1));
353
353
  }, p = V(() => ({
354
354
  button: "stepper-button",
355
355
  fill: "stepper-button-fill"
@@ -360,7 +360,7 @@ const G = le(
360
360
  {
361
361
  type: "button",
362
362
  className: p.button,
363
- onClick: o,
363
+ onClick: s,
364
364
  disabled: v < 0,
365
365
  children: "Prev"
366
366
  }
@@ -376,15 +376,15 @@ const G = le(
376
376
  )
377
377
  ] });
378
378
  }, xe = () => {
379
- const { steps: t, currentStep: s } = N();
380
- return /* @__PURE__ */ n.jsx("div", { className: "stepper-content", children: t[s] && t[s].children && t[s].children });
379
+ const { steps: t, currentStep: o } = N();
380
+ return /* @__PURE__ */ n.jsx("div", { className: "stepper-content", children: t[o] && t[o].children && t[o].children });
381
381
  }, _e = ({
382
382
  steps: t,
383
- onClickNext: s
383
+ onClickNext: o
384
384
  }) => t ? /* @__PURE__ */ n.jsxs(pe, { steppers: t, children: [
385
385
  /* @__PURE__ */ n.jsx(he, {}),
386
386
  /* @__PURE__ */ n.jsx(xe, {}),
387
- /* @__PURE__ */ n.jsx(be, { onClickNext: s })
387
+ /* @__PURE__ */ n.jsx(be, { onClickNext: o })
388
388
  ] }) : /* @__PURE__ */ n.jsx(n.Fragment, {});
389
389
  export {
390
390
  _e as MultiStepper
@@ -20,4 +20,4 @@
20
20
  <%s {...props} />
21
21
  React keys must be passed directly to JSX without using spread:
22
22
  let props = %s;
23
- <%s key={someKey} {...props} />`,d,p,_,p),X[p+d]=!0)}if(p=null,a!==void 0&&(s(a),p=""+a),m(r)&&(s(r.key),p=""+r.key),"key"in r){a={};for(var F in r)F!=="key"&&(a[F]=r[F])}else a=r;return p&&v(a,typeof e=="function"?e.displayName||e.name||"Unknown":e),N(e,p,x,E,i(),a,A,C)}function g(e){typeof e=="object"&&e!==null&&e.$$typeof===b&&e._store&&(e._store.validated=1)}var u=c,b=Symbol.for("react.transitional.element"),te=Symbol.for("react.portal"),w=Symbol.for("react.fragment"),ne=Symbol.for("react.strict_mode"),oe=Symbol.for("react.profiler"),se=Symbol.for("react.consumer"),ae=Symbol.for("react.context"),ie=Symbol.for("react.forward_ref"),ce=Symbol.for("react.suspense"),le=Symbol.for("react.suspense_list"),ue=Symbol.for("react.memo"),L=Symbol.for("react.lazy"),de=Symbol.for("react.activity"),pe=Symbol.for("react.client.reference"),O=u.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,U=Object.prototype.hasOwnProperty,fe=Array.isArray,P=console.createTask?console.createTask:function(){return null};u={react_stack_bottom_frame:function(e){return e()}};var W,J={},V=u.react_stack_bottom_frame.bind(u,l)(),G=P(h(l)),X={};R.Fragment=w,R.jsx=function(e,r,a,d,E){var x=1e4>O.recentlyCreatedOwnerStacks++;return f(e,r,a,!1,d,E,x?Error("react-stack-top-frame"):V,x?P(h(e)):G)},R.jsxs=function(e,r,a,d,E){var x=1e4>O.recentlyCreatedOwnerStacks++;return f(e,r,a,!0,d,E,x?Error("react-stack-top-frame"):V,x?P(h(e)):G)}}()),R}var I;function Z(){return I||(I=1,process.env.NODE_ENV==="production"?y.exports=H():y.exports=B()),y.exports}var n=Z();const D=c.createContext(void 0),S=()=>{const t=c.useContext(D);if(!t)throw new Error("useMultiStepperForm must be used within a MultiStepperProvider");return t},Q=({children:t,steppers:o})=>{const[s,h]=c.useState(0),[i,l]=c.useState([]);c.useEffect(()=>{if(o.length){const f=[...o];f[0].active=!0,l(f)}},[o.length]);const m=c.useCallback(f=>{l(g=>{const u=[...g];if(f>g.length-1)return g;u[s]&&(u[s]={...u[s],active:!1}),u[f]&&(u[f]={...u[f],active:!0});for(let b=0;b<f;b++)u[b]={...u[b],completed:!0};for(let b=f;b<u.length;b++)u[b]={...u[b],completed:!1};return u}),h(f)},[s]),v=c.useCallback(()=>{s<i.length-1?m(s+1):l(f=>{const g=[...f];return g[s]={...g[s],completed:!0},g})},[s,i.length,m]),T=c.useCallback(()=>{s>0&&m(s-1)},[s,m]),N=c.useMemo(()=>({currentStep:s,steps:i,handleNextStep:v,handlePrevStep:T,updateSteps:m}),[s,i,v,T,m]);return n.jsx(D.Provider,{value:N,children:t})},K=({step:t,index:o})=>{const{steps:s}=S();return s.length?t.loading?n.jsx("div",{className:"step step-loading",children:n.jsx("div",{className:"spinner",role:"status","aria-label":"Loading"})}):t.error?n.jsx("div",{className:"step step-error",children:t.icon??n.jsx("span",{className:"text-white",children:"✗"})}):t.completed?n.jsx("div",{className:"step step-complete",children:t.icon??n.jsx("span",{className:"text-white",children:"✓"})}):t.finshed?n.jsx("div",{className:"step step-complete",children:t.icon}):t.active?n.jsx("div",{className:"step step-active",children:t.icon??n.jsx("h2",{className:"text-white",children:o})}):n.jsx("div",{className:"step step-default",children:t.icon??n.jsx("h2",{children:o})}):n.jsx(c.Fragment,{})},q=()=>{const{steps:t}=S();return t.length?n.jsx("div",{className:"app-container",children:n.jsx("ol",{className:"stepper-header",children:t.map((o,s)=>n.jsxs("div",{className:`step-item ${o.active&&"active"} ${o.completed&&"complete"} `,children:[n.jsx(K,{index:s+1,step:o}),n.jsxs("div",{className:"step-text",children:[o.title&&n.jsx("h3",{className:"step-title",children:o.title}),o.description&&n.jsx("h3",{className:"step-description",children:o.description})]})]},s))})}):n.jsx(c.Fragment,{})},$=({onClickNext:t})=>{const{handleNextStep:o,handlePrevStep:s,currentStep:h,steps:i}=S(),l=h===i.length-1,m=()=>{i[h].completed||(o(),t(h+1))},v=c.useMemo(()=>({button:"stepper-button",fill:"stepper-button-fill"}),[]);return n.jsxs("div",{className:"stepper-footer",children:[n.jsx("button",{type:"button",className:v.button,onClick:s,disabled:h<0,children:"Prev"}),n.jsx("button",{type:"button",className:`${l?`${v.button} ${v.fill}`:v.button}`,onClick:m,children:l?"Finish":"Next"})]})},ee=()=>{const{steps:t,currentStep:o}=S();return n.jsx("div",{className:"stepper-content",children:t[o]&&t[o].children&&t[o].children})},re=({steps:t,onClickNext:o})=>t?n.jsxs(Q,{steppers:t,children:[n.jsx(q,{}),n.jsx(ee,{}),n.jsx($,{onClickNext:o})]}):n.jsx(n.Fragment,{});j.MultiStepper=re,Object.defineProperty(j,Symbol.toStringTag,{value:"Module"})});
23
+ <%s key={someKey} {...props} />`,d,p,_,p),X[p+d]=!0)}if(p=null,a!==void 0&&(s(a),p=""+a),m(r)&&(s(r.key),p=""+r.key),"key"in r){a={};for(var F in r)F!=="key"&&(a[F]=r[F])}else a=r;return p&&v(a,typeof e=="function"?e.displayName||e.name||"Unknown":e),N(e,p,x,E,i(),a,A,C)}function g(e){typeof e=="object"&&e!==null&&e.$$typeof===b&&e._store&&(e._store.validated=1)}var u=c,b=Symbol.for("react.transitional.element"),te=Symbol.for("react.portal"),w=Symbol.for("react.fragment"),ne=Symbol.for("react.strict_mode"),oe=Symbol.for("react.profiler"),se=Symbol.for("react.consumer"),ae=Symbol.for("react.context"),ie=Symbol.for("react.forward_ref"),ce=Symbol.for("react.suspense"),le=Symbol.for("react.suspense_list"),ue=Symbol.for("react.memo"),L=Symbol.for("react.lazy"),de=Symbol.for("react.activity"),pe=Symbol.for("react.client.reference"),O=u.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,U=Object.prototype.hasOwnProperty,fe=Array.isArray,P=console.createTask?console.createTask:function(){return null};u={react_stack_bottom_frame:function(e){return e()}};var W,J={},V=u.react_stack_bottom_frame.bind(u,l)(),G=P(h(l)),X={};R.Fragment=w,R.jsx=function(e,r,a,d,E){var x=1e4>O.recentlyCreatedOwnerStacks++;return f(e,r,a,!1,d,E,x?Error("react-stack-top-frame"):V,x?P(h(e)):G)},R.jsxs=function(e,r,a,d,E){var x=1e4>O.recentlyCreatedOwnerStacks++;return f(e,r,a,!0,d,E,x?Error("react-stack-top-frame"):V,x?P(h(e)):G)}}()),R}var I;function Z(){return I||(I=1,process.env.NODE_ENV==="production"?y.exports=H():y.exports=B()),y.exports}var n=Z();const D=c.createContext(void 0),S=()=>{const t=c.useContext(D);if(!t)throw new Error("useMultiStepperForm must be used within a MultiStepperProvider");return t},Q=({children:t,steppers:o})=>{const[s,h]=c.useState(0),[i,l]=c.useState([]);c.useEffect(()=>{if(o.length){const f=[...o];f[0].active=!0,l(f)}},[o,o.length]);const m=c.useCallback(f=>{l(g=>{const u=[...g];if(f>g.length-1)return g;u[s]&&(u[s]={...u[s],active:!1}),u[f]&&(u[f]={...u[f],active:!0});for(let b=0;b<f;b++)u[b]={...u[b],completed:!0};for(let b=f;b<u.length;b++)u[b]={...u[b],completed:!1};return u}),h(f)},[s]),v=c.useCallback(()=>{s<i.length-1?m(s+1):l(f=>{const g=[...f];return g[s]={...g[s],completed:!0},g})},[s,i.length,m]),T=c.useCallback(()=>{s>0&&m(s-1)},[s,m]),N=c.useMemo(()=>({currentStep:s,steps:i,handleNextStep:v,handlePrevStep:T,updateSteps:m}),[s,i,v,T,m]);return n.jsx(D.Provider,{value:N,children:t})},K=({step:t,index:o})=>{const{steps:s}=S();return s.length?t.loading?n.jsx("div",{className:"step step-loading",children:n.jsx("div",{className:"spinner",role:"status","aria-label":"Loading"})}):t.error?n.jsx("div",{className:"step step-error",children:t.icon??n.jsx("span",{className:"text-white",children:"✗"})}):t.completed?n.jsx("div",{className:"step step-complete",children:t.icon??n.jsx("span",{className:"text-white",children:"✓"})}):t.finshed?n.jsx("div",{className:"step step-complete",children:t.icon}):t.active?n.jsx("div",{className:"step step-active",children:t.icon??n.jsx("h2",{className:"text-white",children:o})}):n.jsx("div",{className:"step step-default",children:t.icon??n.jsx("h2",{children:o})}):n.jsx(c.Fragment,{})},q=()=>{const{steps:t}=S();return t.length?n.jsx("div",{className:"app-container",children:n.jsx("ol",{className:"stepper-header",children:t.map((o,s)=>n.jsxs("div",{className:`step-item ${o.active&&"active"} ${o.completed&&"complete"} `,children:[n.jsx(K,{index:s+1,step:o}),n.jsxs("div",{className:"step-text",children:[o.title&&n.jsx("h3",{className:"step-title",children:o.title}),o.description&&n.jsx("h3",{className:"step-description",children:o.description})]})]},s))})}):n.jsx(c.Fragment,{})},$=({onClickNext:t})=>{const{handleNextStep:o,handlePrevStep:s,currentStep:h,steps:i}=S(),l=h===i.length-1,m=()=>{i[h].completed||(o(),t(h+1))},v=c.useMemo(()=>({button:"stepper-button",fill:"stepper-button-fill"}),[]);return n.jsxs("div",{className:"stepper-footer",children:[n.jsx("button",{type:"button",className:v.button,onClick:s,disabled:h<0,children:"Prev"}),n.jsx("button",{type:"button",className:`${l?`${v.button} ${v.fill}`:v.button}`,onClick:m,children:l?"Finish":"Next"})]})},ee=()=>{const{steps:t,currentStep:o}=S();return n.jsx("div",{className:"stepper-content",children:t[o]&&t[o].children&&t[o].children})},re=({steps:t,onClickNext:o})=>t?n.jsxs(Q,{steppers:t,children:[n.jsx(q,{}),n.jsx(ee,{}),n.jsx($,{onClickNext:o})]}):n.jsx(n.Fragment,{});j.MultiStepper=re,Object.defineProperty(j,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "main": "./dist/multi-stepper.umd.js",
4
4
  "module": "./dist/multi-stepper.es.js",
5
5
  "types": "./dist/index.d.ts",
6
- "version": "1.2.0",
6
+ "version": "1.2.2",
7
7
  "type": "module",
8
8
  "repository": {
9
9
  "url": "https://github.com/UppiliSrinivas/react-stepper/tree/multi-stepper"
@@ -31,7 +31,6 @@
31
31
  "@vitejs/plugin-react-swc": "^3.11.0",
32
32
  "react": "^19.1.0",
33
33
  "react-dom": "^19.1.0",
34
- "reactjs-multi-stepper": "^1.1.4",
35
34
  "vite-plugin-dts": "^4.5.4",
36
35
  "vite-plugin-lib-inject-css": "^2.2.2"
37
36
  },