Fix Stepper

Author: forestream

packages/components/src/components/Stepper/IconMinus.tsx

@@ -0,0 +1,21 @@
+import { SVGProps } from 'react'
+
+export function IconMinus({ ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      fill="none"
+      height="28"
+      viewBox="0 0 28 28"
+      width="28"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        clipRule="evenodd"
+        d="M9 14C9 13.4477 9.3731 13 9.83333 13H18.1667C18.6269 13 19 13.4477 19 14C19 14.5523 18.6269 15 18.1667 15H9.83333C9.3731 15 9 14.5523 9 14Z"
+        fill="currentColor"
+        fillRule="evenodd"
+      />
+    </svg>
+  )
+}

packages/components/src/components/Stepper/IconPlus.tsx

@@ -0,0 +1,19 @@
+import { SVGProps } from 'react'
+
+export function IconPlus({ ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      fill="none"
+      height="28"
+      viewBox="0 0 28 28"
+      width="28"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M14.8333 9.83333C14.8333 9.3731 14.4602 9 14 9C13.5397 9 13.1666 9.3731 13.1666 9.83333V13.1667H9.8333C9.37307 13.1667 8.99997 13.5398 8.99997 14C8.99997 14.4602 9.37307 14.8333 9.8333 14.8333H13.1666V18.1667C13.1666 18.6269 13.5397 19 14 19C14.4602 19 14.8333 18.6269 14.8333 18.1667V14.8333H18.1666C18.6269 14.8333 19 14.4602 19 14C19 13.5398 18.6269 13.1667 18.1666 13.1667H14.8333V9.83333Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

packages/components/src/components/Stepper/Stepper.stories.tsx

@@ -1,6 +1,12 @@
 import { Meta, StoryObj } from '@storybook/react-vite'
 
-import { Stepper } from './index'
+import {
+  Stepper,
+  StepperContainer,
+  StepperDecreaseButton,
+  StepperIncreaseButton,
+  StepperInput,
+} from './index'
 
 type Story = StoryObj<typeof meta>
 
@@ -18,9 +24,16 @@ const meta: Meta<typeof Stepper> = {
 }
 
 export const Default: Story = {
-  args: {
-    value: 1,
-  },
+  args: {},
+  render: (args) => (
+    <Stepper {...args}>
+      <StepperContainer>
+        <StepperDecreaseButton />
+        <StepperInput editable={false} />
+        <StepperIncreaseButton />
+      </StepperContainer>
+    </Stepper>
+  ),
 }
 
 export default meta