- Storybook 8 with React Vite framework + a11y addon - Stories for Button (7 variants), Badge (6), Input (5), Card (4) - Dark/elevated/light background presets - Run: pnpm --filter @bytelyst/ui storybook
21 lines
744 B
TypeScript
21 lines
744 B
TypeScript
import type { Meta, StoryObj } from '@storybook/react';
|
|
import { Input } from './Input.js';
|
|
|
|
const meta: Meta<typeof Input> = {
|
|
title: 'Components/Input',
|
|
component: Input,
|
|
};
|
|
|
|
export default meta;
|
|
type Story = StoryObj<typeof Input>;
|
|
|
|
export const Default: Story = { args: { placeholder: 'Enter text...' } };
|
|
export const WithLabel: Story = { args: { label: 'Email', placeholder: 'you@example.com' } };
|
|
export const WithError: Story = {
|
|
args: { label: 'Email', value: 'bad', error: 'Invalid email address' },
|
|
};
|
|
export const WithHint: Story = {
|
|
args: { label: 'Username', placeholder: 'johndoe', hint: '3-20 characters, no spaces' },
|
|
};
|
|
export const Disabled: Story = { args: { label: 'Read Only', value: 'locked', disabled: true } };
|