- rounded-[var(--radius-xl/md/lg/sm)] → rounded-xl, rounded-md, rounded-lg, rounded-sm - Timeline: min-w-[200px] → min-w-50 - AddEquipmentView, MetadataForm: min-h-[100px] → min-h-25 - NavigationProgress: shadow-[...] → shadow-button-primary-glow - Stories: ActivityGraph, StatCard, NotificationBell, LoadingState, ScrollArea, Skeleton, FileUploadZone - Reduced arbitrary values from ~60+ to 11 (5 files, exceptions documented) Co-authored-by: Cursor <cursoragent@cursor.com>
30 lines
894 B
TypeScript
30 lines
894 B
TypeScript
import type { Meta, StoryObj } from '@storybook/react';
|
|
import { ScrollArea } from './scroll-area';
|
|
|
|
const meta = {
|
|
title: 'UI/ScrollArea',
|
|
component: ScrollArea,
|
|
tags: ['autodocs'],
|
|
args: {
|
|
className: 'min-h-50 w-96 rounded-md border p-4',
|
|
}
|
|
} satisfies Meta<typeof ScrollArea>;
|
|
|
|
export default meta;
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Default: Story = {
|
|
render: (args) => (
|
|
<ScrollArea {...args}>
|
|
<h4 className="mb-4 text-sm font-medium leading-none">Tags</h4>
|
|
{Array.from({ length: 50 }).map((_, i, a) => (
|
|
<div key={i}>
|
|
<div className="text-sm">
|
|
Tag {a.length - i}
|
|
</div>
|
|
{i !== a.length - 1 && <div className="my-2 h-px bg-kodo-steel" />}
|
|
</div>
|
|
))}
|
|
</ScrollArea>
|
|
),
|
|
};
|