NumberStepper
import { NumberStepper } from '@app/forms/NumberStepper.styled'
Component Props
value
number
min
number
max
number
step
number
placeholder
string
disabled
boolean
readOnly
boolean
hasError
boolean
className
string
pressableClassName
string
textInputClassName
string
placeholderClassName
string
placeholderTextColor
string
Show Props Schema
const NumberStepperProps = z.object({
value: z
.number()
.optional(),
min: z
.number()
.optional(),
max: z
.number()
.optional(),
step: z
.number()
.default(1),
placeholder: z
.string()
.optional()
.example("Enter number..."),
disabled: z
.boolean()
.optional(),
readOnly: z
.boolean()
.optional(),
hasError: z
.boolean()
.optional(),
className: z
.string()
.optional(),
pressableClassName: z
.string()
.optional(),
textInputClassName: z
.string()
.optional(),
placeholderClassName: z
.string()
.optional(),
placeholderTextColor: z
.string()
.optional(),
})
💡 Could be handy to copy-paste into an AI chat?
Show Props Types
{
value?: number;
min?: number;
max?: number | undefined;
step?: number;
placeholder?: string | undefined;
disabled?: boolean;
readOnly?: boolean;
hasError?: boolean;
className?: string | undefined;
pressableClassName?: string | undefined;
textInputClassName?: string | undefined;
placeholderClassName?: string | undefined;
placeholderTextColor?: string | undefined;
}
💡 Could be handy to copy-paste into an AI chat?
File Location
You can find the source of the NumberStepper
component in the following location:
- NumberStepper.styled.tsx
Other
Disclaimer - Automatic Docgen
🤖
These dynamic component docs were auto-generated with npm run regenerate-docs
. You can hook into automatic docgen by exporting getDocumentationProps
from a component file. You’ll want to provide example props from the ComponentProps zod schema, e.g:
NumberStepper.styled.tsx
/* --- Docs ---------------------- */
export const getDocumentationProps = NumberStepperProps.documentationProps('NumberStepper')