feat(stepper): new stepper component

.gitignore

@@ -33,4 +33,6 @@ yarn-error.log*
 .turbo
 
 .contentlayer
-tsconfig.tsbuildinfo
+tsconfig.tsbuildinfo
+
+.pnpm-store

apps/www/__registry__/index.tsx

@@ -423,6 +423,17 @@ export const Index: Record<string, any> = {
       subcategory: "undefined",
       chunks: []
     },
+    "stepper": {
+      name: "stepper",
+      type: "components:ui",
+      registryDependencies: undefined,
+      component: React.lazy(() => import("@/registry/default/ui/stepper")),
+      source: "",
+      files: ["registry/default/ui/stepper.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
     "switch": {
       name: "switch",
       type: "components:ui",
@@ -1600,6 +1611,149 @@ export const Index: Record<string, any> = {
       subcategory: "undefined",
       chunks: []
     },
+    "stepper-demo": {
+      name: "stepper-demo",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-demo")),
+      source: "",
+      files: ["registry/default/example/stepper-demo.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-custom-styles": {
+      name: "stepper-custom-styles",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-custom-styles")),
+      source: "",
+      files: ["registry/default/example/stepper-custom-styles.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-orientation": {
+      name: "stepper-orientation",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-orientation")),
+      source: "",
+      files: ["registry/default/example/stepper-orientation.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-description": {
+      name: "stepper-description",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-description")),
+      source: "",
+      files: ["registry/default/example/stepper-description.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-sizes": {
+      name: "stepper-sizes",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-sizes")),
+      source: "",
+      files: ["registry/default/example/stepper-sizes.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-form": {
+      name: "stepper-form",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-form")),
+      source: "",
+      files: ["registry/default/example/stepper-form.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-variants": {
+      name: "stepper-variants",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-variants")),
+      source: "",
+      files: ["registry/default/example/stepper-variants.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-custom-icons": {
+      name: "stepper-custom-icons",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-custom-icons")),
+      source: "",
+      files: ["registry/default/example/stepper-custom-icons.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-footer-inside": {
+      name: "stepper-footer-inside",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-footer-inside")),
+      source: "",
+      files: ["registry/default/example/stepper-footer-inside.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-scroll-tracking": {
+      name: "stepper-scroll-tracking",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-scroll-tracking")),
+      source: "",
+      files: ["registry/default/example/stepper-scroll-tracking.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-clickable-steps": {
+      name: "stepper-clickable-steps",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-clickable-steps")),
+      source: "",
+      files: ["registry/default/example/stepper-clickable-steps.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-optional-steps": {
+      name: "stepper-optional-steps",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-optional-steps")),
+      source: "",
+      files: ["registry/default/example/stepper-optional-steps.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-state": {
+      name: "stepper-state",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/default/example/stepper-state")),
+      source: "",
+      files: ["registry/default/example/stepper-state.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
     "switch-demo": {
       name: "switch-demo",
       type: "components:example",
@@ -3735,6 +3889,17 @@ export const Index: Record<string, any> = {
       subcategory: "undefined",
       chunks: []
     },
+    "stepper": {
+      name: "stepper",
+      type: "components:ui",
+      registryDependencies: undefined,
+      component: React.lazy(() => import("@/registry/new-york/ui/stepper")),
+      source: "",
+      files: ["registry/new-york/ui/stepper.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
     "switch": {
       name: "switch",
       type: "components:ui",
@@ -4912,6 +5077,149 @@ export const Index: Record<string, any> = {
       subcategory: "undefined",
       chunks: []
     },
+    "stepper-demo": {
+      name: "stepper-demo",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-demo")),
+      source: "",
+      files: ["registry/new-york/example/stepper-demo.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-custom-styles": {
+      name: "stepper-custom-styles",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-custom-styles")),
+      source: "",
+      files: ["registry/new-york/example/stepper-custom-styles.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-orientation": {
+      name: "stepper-orientation",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-orientation")),
+      source: "",
+      files: ["registry/new-york/example/stepper-orientation.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-description": {
+      name: "stepper-description",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-description")),
+      source: "",
+      files: ["registry/new-york/example/stepper-description.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-sizes": {
+      name: "stepper-sizes",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-sizes")),
+      source: "",
+      files: ["registry/new-york/example/stepper-sizes.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-form": {
+      name: "stepper-form",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-form")),
+      source: "",
+      files: ["registry/new-york/example/stepper-form.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-variants": {
+      name: "stepper-variants",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-variants")),
+      source: "",
+      files: ["registry/new-york/example/stepper-variants.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-custom-icons": {
+      name: "stepper-custom-icons",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-custom-icons")),
+      source: "",
+      files: ["registry/new-york/example/stepper-custom-icons.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-footer-inside": {
+      name: "stepper-footer-inside",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-footer-inside")),
+      source: "",
+      files: ["registry/new-york/example/stepper-footer-inside.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-scroll-tracking": {
+      name: "stepper-scroll-tracking",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-scroll-tracking")),
+      source: "",
+      files: ["registry/new-york/example/stepper-scroll-tracking.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-clickable-steps": {
+      name: "stepper-clickable-steps",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-clickable-steps")),
+      source: "",
+      files: ["registry/new-york/example/stepper-clickable-steps.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-optional-steps": {
+      name: "stepper-optional-steps",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-optional-steps")),
+      source: "",
+      files: ["registry/new-york/example/stepper-optional-steps.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
+    "stepper-state": {
+      name: "stepper-state",
+      type: "components:example",
+      registryDependencies: ["stepper"],
+      component: React.lazy(() => import("@/registry/new-york/example/stepper-state")),
+      source: "",
+      files: ["registry/new-york/example/stepper-state.tsx"],
+      category: "undefined",
+      subcategory: "undefined",
+      chunks: []
+    },
     "switch-demo": {
       name: "switch-demo",
       type: "components:example",

apps/www/components/mdx-components.tsx

@@ -17,6 +17,7 @@ import { ComponentPreview } from "@/components/component-preview"
 import { ComponentSource } from "@/components/component-source"
 import { CopyButton, CopyNpmCommandButton } from "@/components/copy-button"
 import { FrameworkDocs } from "@/components/framework-docs"
+import { PropsTable } from "@/components/props-table"
 import { StyleWrapper } from "@/components/style-wrapper"
 import {
   Accordion,
@@ -231,6 +232,7 @@ const components = {
   ),
   Image,
   Callout,
+  PropsTable,
   ComponentPreview,
   ComponentExample,
   ComponentSource,