@mzc-fe/design-system 0.0.10-rc.0 → 0.0.10

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

@@ -1 +1,5 @@
+export * from './stepper-description';
+export * from './stepper-icon';
+export * from './stepper-item';
+export * from './stepper-title';
 export * from './stepper';

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

@@ -0,0 +1,5 @@
+export type StepperDescriptionProps = React.ComponentProps<"p"> & {
+    asChild?: boolean;
+};
+/** 단계의 설명 텍스트를 표시합니다. */
+export declare function StepperDescription({ className, asChild, ...props }: StepperDescriptionProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper-description.js

@@ -0,0 +1,27 @@
+import { jsx as m } from "react/jsx-runtime";
+import { cn as a } from "../../lib/utils.js";
+import { useStepper as n } from "./use-stepper.js";
+import { useStepperItem as c } from "./use-stepper-item.js";
+import { Slot as l } from "@radix-ui/react-slot";
+function h({ className: e, asChild: p, ...s }) {
+  const { orientation: t, size: i, variant: r } = n(), { status: o } = c();
+  return /* @__PURE__ */ m(
+    p ? l : "p",
+    {
+      "data-slot": "stepper-description",
+      className: a(
+        "text-sm",
+        t === "horizontal" && r === "basic" && (i === "sm" ? "pl-8" : "pl-10"),
+        t === "horizontal" && r === "dot" && "max-w-[140px]",
+        t === "vertical" && r === "basic" && "col-start-2",
+        o === "error" ? "text-error" : o === "process" ? "text-foreground" : "text-muted-foreground",
+        "group-hover/stepper-item:text-primary",
+        e
+      ),
+      ...s
+    }
+  );
+}
+export {
+  h as StepperDescription
+};

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

@@ -0,0 +1,3 @@
+export declare function StepperDot({ className }: {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper-dot.js

@@ -0,0 +1,34 @@
+import { jsx as e } from "react/jsx-runtime";
+import { cva as a } from "class-variance-authority";
+import { cn as o } from "../../lib/utils.js";
+import { useStepper as i } from "./use-stepper.js";
+import { useStepperItem as m } from "./use-stepper-item.js";
+const p = a("relative z-10 shrink-0 rounded-full transition-colors", {
+  variants: {
+    status: {
+      finish: "bg-primary",
+      process: "bg-primary",
+      wait: "bg-muted-foreground/40",
+      error: "bg-error"
+    },
+    size: {
+      sm: "size-1.5",
+      md: "size-2"
+    }
+  },
+  compoundVariants: [
+    { status: "process", size: "sm", className: "size-2" },
+    { status: "process", size: "md", className: "size-2.5" }
+  ],
+  defaultVariants: {
+    status: "wait",
+    size: "md"
+  }
+});
+function z({ className: t }) {
+  const { size: r } = i(), { status: s } = m();
+  return /* @__PURE__ */ e("div", { "data-slot": "stepper-dot", "data-status": s, className: o(p({ status: s, size: r }), t) });
+}
+export {
+  z as StepperDot
+};

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

@@ -0,0 +1,9 @@
+export type StepperIconProps = React.ComponentProps<"div"> & {
+    asChild?: boolean;
+};
+/**
+ * 단계의 아이콘을 표시합니다. 완료된 단계는 체크 아이콘, 나머지는 숫자를 표시합니다.
+ *
+ * @param props.asChild - true면 자식 요소를 아이콘으로 렌더링
+ */
+export declare function StepperIcon({ asChild, className, children, ...props }: StepperIconProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,44 @@
+import { jsx as r } from "react/jsx-runtime";
+import { cva as u } from "class-variance-authority";
+import { Check as d, X as l } from "lucide-react";
+import { useStepper as x } from "./use-stepper.js";
+import { useStepperItem as z } from "./use-stepper-item.js";
+import { Slot as g } from "@radix-ui/react-slot";
+import { cn as i } from "../../lib/utils.js";
+const y = u(
+  "relative z-10 flex shrink-0 items-center justify-center rounded-full font-medium transition-colors",
+  {
+    variants: {
+      status: {
+        finish: "bg-primary/5 text-primary dark:bg-primary/10",
+        process: "bg-primary text-primary-foreground",
+        wait: "bg-muted text-muted-foreground",
+        error: "bg-error text-error-foreground"
+      },
+      size: {
+        sm: "size-6 text-xs",
+        md: "size-8 text-sm"
+      }
+    },
+    defaultVariants: {
+      status: "wait",
+      size: "md"
+    }
+  }
+);
+function j({ asChild: e = !1, className: a, children: m, ...n }) {
+  const { size: s } = x(), { step: p, status: t } = z(), c = e ? g : "div", o = i(s === "sm" ? "size-3" : "size-4"), f = t === "finish" ? /* @__PURE__ */ r(d, { className: o }) : t === "error" ? /* @__PURE__ */ r(l, { className: o }) : /* @__PURE__ */ r("span", { children: p + 1 });
+  return /* @__PURE__ */ r(
+    c,
+    {
+      "data-slot": "stepper-icon",
+      "data-status": t,
+      className: i(y({ status: t, size: s }), a),
+      ...n,
+      children: e ? m : f
+    }
+  );
+}
+export {
+  j as StepperIcon
+};

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

@@ -0,0 +1,21 @@
+import { StepStatus } from './stepper';
+export type StepperItemProps = Omit<React.ComponentProps<"div">, "title" | "children"> & {
+    /** 단계 번호 (0-based) */
+    step?: number;
+    /** @deprecated `step`을 사용하세요 */
+    index?: number;
+    status?: StepStatus;
+    /** 단계 아이콘 */
+    icon?: React.ReactNode;
+    /** 단계 제목 */
+    title?: React.ReactNode;
+    /** 단계 설명 */
+    description?: React.ReactNode;
+};
+/**
+ * 스테퍼의 개별 단계를 나타내는 아이템 컴포넌트입니다.
+ *
+ * @param props.step - 이 단계의 번호 (0-based, 필수)
+ * @param props.status - 수동으로 상태를 지정할 때 사용 (Context 오버라이드)
+ */
+export declare function StepperItem({ step, index, status: statusOverride, icon, title, description, className, onClick, ...props }: StepperItemProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper-item.js

@@ -0,0 +1,117 @@
+import { jsx as a, jsxs as e, Fragment as m } from "react/jsx-runtime";
+import { cva as V } from "class-variance-authority";
+import { useStepper as j } from "./use-stepper.js";
+import { useMemo as w } from "react";
+import { StepperItemProvider as y } from "./use-stepper-item.js";
+import { cn as A } from "../../lib/utils.js";
+import { StepperSeparator as o } from "./stepper-separator.js";
+import { StepperIcon as v } from "./stepper-icon.js";
+import { StepperDot as h } from "./stepper-dot.js";
+const D = V("group/stepper-item flex", {
+  variants: {
+    orientation: {
+      horizontal: "flex-1",
+      vertical: "gap-x-4 pb-3 last:pb-0"
+    },
+    variant: {
+      basic: "",
+      dot: ""
+    }
+  },
+  compoundVariants: [
+    { orientation: "horizontal", variant: "basic", className: "flex-col last:flex-initial" },
+    { orientation: "horizontal", variant: "dot", className: "flex-col items-center gap-2" },
+    { orientation: "vertical", variant: "basic", className: "gap-y-2" }
+  ],
+  defaultVariants: {
+    variant: "basic"
+  }
+});
+function J({
+  step: u,
+  index: g,
+  status: b,
+  icon: d,
+  title: l,
+  description: n,
+  className: N,
+  onClick: f,
+  ...S
+}) {
+  const i = u ?? g, { orientation: t, current: x, size: s, variant: r, getStepStatus: z } = j(), c = b ?? z(i), p = i < x, I = w(() => ({ step: i, status: c }), [i, c]);
+  return /* @__PURE__ */ a(y, { value: I, children: /* @__PURE__ */ e(
+    "div",
+    {
+      "data-slot": "stepper-item",
+      "data-status": c,
+      "data-orientation": t,
+      role: "listitem",
+      "aria-current": c === "process" ? "step" : void 0,
+      className: A(D({ orientation: t, variant: r }), N, !!f && "cursor-pointer"),
+      onClick: f,
+      ...S,
+      children: [
+        r === "basic" && t === "horizontal" && /* @__PURE__ */ e(m, { children: [
+          /* @__PURE__ */ e("div", { className: "flex items-center gap-x-2", children: [
+            d ?? /* @__PURE__ */ a(v, {}),
+            l,
+            /* @__PURE__ */ a(o, { isActive: p, orientation: t, size: s })
+          ] }),
+          n
+        ] }),
+        r === "basic" && t === "vertical" && /* @__PURE__ */ e(m, { children: [
+          /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-[6px] pb-[6px]", children: [
+            d ?? /* @__PURE__ */ a(v, {}),
+            /* @__PURE__ */ a(o, { isActive: p, orientation: t, size: s })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "flex flex-col flex-wrap gap-[8px] pt-1 pb-3", children: [
+            l,
+            n
+          ] })
+        ] }),
+        r === "dot" && t === "horizontal" && /* @__PURE__ */ e(m, { children: [
+          /* @__PURE__ */ e("div", { className: "flex min-h-2.5 w-full items-center", children: [
+            /* @__PURE__ */ a(
+              o,
+              {
+                isActive: i <= x && i > 0,
+                orientation: t,
+                size: s,
+                variant: r,
+                "data-position": "left"
+              }
+            ),
+            /* @__PURE__ */ a(h, {}),
+            /* @__PURE__ */ a(
+              o,
+              {
+                isActive: p,
+                orientation: t,
+                size: s,
+                variant: r,
+                "data-position": "right"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-0.5 text-center", children: [
+            l,
+            n
+          ] })
+        ] }),
+        r === "dot" && t === "vertical" && /* @__PURE__ */ e(m, { children: [
+          /* @__PURE__ */ e("div", { className: "flex flex-col items-center gap-[6px] pb-[6px] pt-[7px]", children: [
+            /* @__PURE__ */ a("div", { className: "flex size-2.5 items-center justify-center", children: /* @__PURE__ */ a(h, {}) }),
+            /* @__PURE__ */ a(o, { isActive: p, orientation: t, size: s, variant: r })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "flex flex-col flex-wrap gap-1 pt-0.5 pb-3", children: [
+            l,
+            n
+          ] })
+        ] })
+      ]
+    }
+  ) });
+}
+export {
+  J as StepperItem
+};

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

@@ -0,0 +1,8 @@
+export type StepperSeparatorProps = {
+    isActive: boolean;
+    orientation: "horizontal" | "vertical";
+    size: "sm" | "md";
+    variant?: "basic" | "dot";
+    "data-position"?: "left" | "right";
+};
+export declare const StepperSeparator: ({ isActive, orientation, variant, "data-position": position, }: StepperSeparatorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper-separator.js

@@ -0,0 +1,41 @@
+import { jsx as o } from "react/jsx-runtime";
+import { cn as e } from "../../lib/utils.js";
+import { cva as s } from "class-variance-authority";
+const n = s("shrink-0 transition-colors", {
+  variants: {
+    active: {
+      true: "bg-primary",
+      false: "bg-border"
+    },
+    orientation: {
+      horizontal: "h-px flex-1",
+      vertical: "w-px flex-1"
+    },
+    variant: {
+      basic: "",
+      dot: ""
+    }
+  },
+  compoundVariants: [{ orientation: "horizontal", variant: "basic", className: "ml-2" }],
+  defaultVariants: {
+    active: !1,
+    variant: "basic"
+  }
+}), m = ({
+  isActive: a,
+  orientation: t,
+  variant: r = "basic",
+  "data-position": i
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    "data-slot": "stepper-separator",
+    "data-position": i,
+    role: "presentation",
+    "aria-hidden": "true",
+    className: e(n({ active: a, orientation: t, variant: r }))
+  }
+);
+export {
+  m as StepperSeparator
+};

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

@@ -0,0 +1,5 @@
+export type StepperTitleProps = React.ComponentProps<"p"> & {
+    asChild?: boolean;
+};
+/** 단계의 제목을 표시합니다. */
+export declare function StepperTitle({ className, asChild, ...props }: StepperTitleProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper-title.js

@@ -0,0 +1,23 @@
+import { jsx as p } from "react/jsx-runtime";
+import { cn as m } from "../../lib/utils.js";
+import { useStepperItem as s } from "./use-stepper-item.js";
+import { Slot as i } from "@radix-ui/react-slot";
+function l({ className: r, asChild: e, ...o }) {
+  const { status: t } = s();
+  return /* @__PURE__ */ p(
+    e ? i : "p",
+    {
+      "data-slot": "stepper-title",
+      className: m(
+        "text-base font-normal",
+        t === "error" ? "text-error" : t === "wait" ? "text-muted-foreground" : "text-foreground",
+        "group-hover/stepper-item:text-primary",
+        r
+      ),
+      ...o
+    }
+  );
+}
+export {
+  l as StepperTitle
+};

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

@@ -1,9 +1,10 @@
 import * as React from "react";
-type StepStatus = "finish" | "process" | "wait";
+export type StepStatus = "finish" | "process" | "wait" | "error";
 export type StepperProps = React.ComponentProps<"div"> & {
     current: number;
     orientation?: "horizontal" | "vertical";
     size?: "sm" | "md";
+    variant?: "basic" | "dot";
 };
 /**
  * 다단계 프로세스의 진행 상태를 시각적으로 표시하는 스테퍼 컴포넌트입니다.
@@ -11,7 +12,7 @@ export type StepperProps = React.ComponentProps<"div"> & {
  * @example
  * ```tsx
  * <Stepper current={1}>
- *   <StepperItem index={0}>
+ *   <StepperItem step={0}>
  *     <StepperIcon />
  *     <StepperTitle>계정 생성</StepperTitle>
  *     <StepperDescription>기본 정보 입력</StepperDescription>
@@ -23,31 +24,4 @@ export type StepperProps = React.ComponentProps<"div"> & {
  * @param props.orientation - 레이아웃 방향 ('horizontal' | 'vertical')
  * @param props.size - 아이콘 크기 ('sm' | 'md')
  */
-declare function Stepper({ current, orientation, size, className, ...props }: StepperProps): import("react/jsx-runtime").JSX.Element;
-export type StepperItemProps = React.ComponentProps<"div"> & {
-    index: number;
-    status?: StepStatus;
-};
-/**
- * 스테퍼의 개별 단계를 나타내는 아이템 컴포넌트입니다.
- *
- * @param props.index - 이 단계의 인덱스 (0-based, 필수)
- * @param props.status - 수동으로 상태를 지정할 때 사용 (Context 오버라이드)
- */
-declare function StepperItem({ index, status: statusOverride, className, children, ...props }: StepperItemProps): import("react/jsx-runtime").JSX.Element;
-export type StepperIconProps = React.ComponentProps<"div"> & {
-    asChild?: boolean;
-};
-/**
- * 단계의 아이콘을 표시합니다. 완료된 단계는 체크 아이콘, 나머지는 숫자를 표시합니다.
- *
- * @param props.asChild - true면 자식 요소를 아이콘으로 렌더링
- */
-declare function StepperIcon({ asChild, className, children, ...props }: StepperIconProps): import("react/jsx-runtime").JSX.Element;
-export type StepperTitleProps = React.ComponentProps<"p">;
-/** 단계의 제목을 표시합니다. */
-declare function StepperTitle({ className, ...props }: StepperTitleProps): import("react/jsx-runtime").JSX.Element;
-export type StepperDescriptionProps = React.ComponentProps<"p">;
-/** 단계의 설명 텍스트를 표시합니다. */
-declare function StepperDescription({ className, ...props }: StepperDescriptionProps): import("react/jsx-runtime").JSX.Element;
-export { Stepper, StepperItem, StepperIcon, StepperTitle, StepperDescription, };
+export declare function Stepper({ current, orientation, size, variant, className, ...props }: StepperProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/stepper.js

@@ -1,205 +1,52 @@
-import { jsx as o, jsxs as b } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import * as l from "react";
-import { Slot as z } from "@radix-ui/react-slot";
-import { cva as m } from "class-variance-authority";
-import { Check as w } from "lucide-react";
-import { cn as n } from "../../lib/utils.js";
-const g = l.createContext(null);
-function d() {
-  const t = l.useContext(g);
-  if (!t)
-    throw new Error("useStepper must be used within a Stepper component");
-  return t;
-}
-const C = m(
-  "flex [&>:last-child_[data-slot=stepper-separator]]:hidden",
-  {
-    variants: {
-      orientation: {
-        horizontal: "flex-row items-start gap-4",
-        vertical: "flex-col"
-      }
-    },
-    defaultVariants: {
-      orientation: "horizontal"
-    }
-  }
-), V = m("relative group/stepper-item", {
+import { cva as d } from "class-variance-authority";
+import { cn as m } from "../../lib/utils.js";
+import { StepperProvider as f } from "./use-stepper.js";
+const h = d("flex", {
   variants: {
     orientation: {
-      horizontal: "flex flex-wrap flex-1 last:flex-initial items-center gap-x-2",
-      vertical: "grid grid-cols-[auto_1fr] items-start gap-x-4 gap-y-2 pb-3 last:pb-0"
-    }
-  }
-}), y = m(
-  "relative z-10 flex shrink-0 items-center justify-center rounded-full font-medium transition-colors",
-  {
-    variants: {
-      status: {
-        finish: "bg-primary/5 text-primary dark:bg-primary/10",
-        process: "bg-primary text-primary-foreground",
-        wait: "bg-muted text-muted-foreground"
-      },
-      size: {
-        sm: "size-6 text-xs",
-        md: "size-8 text-sm"
-      }
+      horizontal: "flex-row items-start",
+      vertical: "flex-col"
     },
-    defaultVariants: {
-      status: "wait",
-      size: "md"
-    }
-  }
-), I = m("shrink-0 transition-colors", {
-  variants: {
-    active: {
-      true: "bg-primary",
-      false: "bg-border"
+    variant: {
+      basic: "[&>:last-child_[data-slot=stepper-separator]]:hidden",
+      dot: "[&>:first-child_[data-position=left]]:opacity-0 [&>:last-child_[data-position=right]]:opacity-0"
     }
   },
+  compoundVariants: [{ orientation: "horizontal", variant: "basic", className: "gap-4" }],
   defaultVariants: {
-    active: !1
+    orientation: "horizontal",
+    variant: "basic"
   }
-}), v = l.createContext(
-  null
-);
-function x() {
-  const t = l.useContext(v);
-  if (!t)
-    throw new Error("useStepperItem must be used within a StepperItem component");
-  return t;
-}
-function P({
+});
+function x({
   current: t,
-  orientation: e = "horizontal",
-  size: r = "md",
-  className: s,
-  ...i
+  orientation: a = "horizontal",
+  size: i = "md",
+  variant: o = "basic",
+  className: p,
+  ...n
 }) {
-  const a = l.useCallback(
-    (c) => c < t ? "finish" : c === t ? "process" : "wait",
+  const r = l.useCallback(
+    (s) => s < t ? "finish" : s === t ? "process" : "wait",
     [t]
-  ), p = l.useMemo(
-    () => ({ current: t, orientation: e, size: r, getStepStatus: a }),
-    [t, e, r, a]
+  ), c = l.useMemo(
+    () => ({ current: t, orientation: a, size: i, variant: o, getStepStatus: r }),
+    [t, a, i, o, r]
   );
-  return /* @__PURE__ */ o(g.Provider, { value: p, children: /* @__PURE__ */ o(
+  return /* @__PURE__ */ e(f, { value: c, children: /* @__PURE__ */ e(
     "div",
     {
       "data-slot": "stepper",
-      "data-orientation": e,
+      "data-orientation": a,
       role: "group",
       "aria-label": "progress",
-      className: n(C({ orientation: e }), s),
-      ...i
-    }
-  ) });
-}
-function _({
-  index: t,
-  status: e,
-  className: r,
-  children: s,
-  ...i
-}) {
-  const { orientation: a, current: p, size: c, getStepStatus: f } = d(), u = e ?? f(t), h = t < p, S = l.useMemo(
-    () => ({ index: t, status: u }),
-    [t, u]
-  );
-  return /* @__PURE__ */ o(v.Provider, { value: S, children: /* @__PURE__ */ b(
-    "div",
-    {
-      "data-slot": "stepper-item",
-      "data-status": u,
-      "data-orientation": a,
-      role: "listitem",
-      "aria-current": u === "process" ? "step" : void 0,
-      className: n(V({ orientation: a }), r),
-      ...i,
-      children: [
-        s,
-        /* @__PURE__ */ o(
-          "div",
-          {
-            "data-slot": "stepper-separator",
-            role: "presentation",
-            "aria-hidden": "true",
-            className: n(
-              I({ active: h }),
-              "order-3",
-              a === "horizontal" && "h-px flex-1 ml-2",
-              a === "vertical" && n(
-                "absolute w-px bottom-1.5",
-                c === "sm" ? "left-3 top-[30px]" : "left-4 top-[38px]"
-              )
-            )
-          }
-        )
-      ]
+      className: m(h({ orientation: a, variant: o }), p),
+      ...n
     }
   ) });
 }
-function A({
-  asChild: t = !1,
-  className: e,
-  children: r,
-  ...s
-}) {
-  const { size: i } = d(), { index: a, status: p } = x(), c = t ? z : "div", f = p === "finish" ? /* @__PURE__ */ o(w, { className: n(i === "sm" ? "size-4" : "size-5") }) : /* @__PURE__ */ o("span", { children: a + 1 });
-  return /* @__PURE__ */ o(
-    c,
-    {
-      "data-slot": "stepper-icon",
-      "data-status": p,
-      className: n(y({ status: p, size: i }), "order-1", e),
-      ...s,
-      children: t ? r : f
-    }
-  );
-}
-function D({
-  className: t,
-  ...e
-}) {
-  const { orientation: r } = d(), { status: s } = x();
-  return /* @__PURE__ */ o(
-    "p",
-    {
-      "data-slot": "stepper-title",
-      className: n(
-        "order-2 text-base font-normal leading-normal",
-        r === "vertical" && "pt-1",
-        s === "wait" ? "text-muted-foreground" : "text-foreground",
-        t
-      ),
-      ...e
-    }
-  );
-}
-function R({
-  className: t,
-  ...e
-}) {
-  const { orientation: r, size: s } = d(), { status: i } = x();
-  return /* @__PURE__ */ o(
-    "p",
-    {
-      "data-slot": "stepper-description",
-      className: n(
-        "order-last text-sm leading-normal",
-        r === "horizontal" && n("basis-full", s === "sm" ? "pl-8" : "pl-10"),
-        r === "vertical" && "col-start-2",
-        i === "process" ? "text-foreground" : "text-muted-foreground",
-        t
-      ),
-      ...e
-    }
-  );
-}
 export {
-  P as Stepper,
-  R as StepperDescription,
-  A as StepperIcon,
-  _ as StepperItem,
-  D as StepperTitle
+  x as Stepper
 };

package/dist/components/stepper/use-stepper-item.d.ts

@@ -0,0 +1,8 @@
+import { StepStatus } from './stepper';
+interface StepperItemContextValue {
+    step: number;
+    status: StepStatus;
+}
+export declare const StepperItemProvider: import('react').Provider<StepperItemContextValue | null>;
+export declare function useStepperItem(): StepperItemContextValue;
+export {};

package/dist/components/stepper/use-stepper-item.js

@@ -0,0 +1,12 @@
+import { createContext as r, useContext as o } from "react";
+const t = r(null), p = t.Provider;
+function m() {
+  const e = o(t);
+  if (!e)
+    throw new Error("useStepperItem must be used within a StepperItem component");
+  return e;
+}
+export {
+  p as StepperItemProvider,
+  m as useStepperItem
+};