veza/apps/web/src/components/ui/Collapsible.stories.tsx
senke 0a29c544af fix(web): resolve all 568 TypeScript errors — tsc --noEmit now passes with zero errors
Major categories fixed:
- TS6133 (188): Remove unused imports (React, icons, types) and variables
- TS2322 (222): Fix type mismatches in stories (satisfies Meta -> const meta: Meta),
  add nullish coalescing for optional values, fix component prop types
- TS2345 (43): Fix argument type mismatches with proper null checks and type narrowing
- TS2741 (21): Add missing required properties to mock/story data
- TS2339 (19): Fix property access on incorrect types, add type guards
- TS2353 (13): Remove extra properties from object literals or extend interfaces
- TS2352 (11): Fix type conversion chains
- TS2307 (9): Fix import paths and module references
- Other (42): Fix implicit any, possibly undefined, export declarations

Vite build and tsc --noEmit both pass cleanly.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-13 00:32:08 +01:00

44 lines
1.3 KiB
TypeScript

import type { Meta, StoryObj } from '@storybook/react';
import { Collapsible, CollapsibleCard } from './collapsible';
import { Button } from './button';
import { Settings } from 'lucide-react';
const meta: Meta = {
title: 'UI/Collapsible',
component: Collapsible,
tags: ['autodocs'],
argTypes: {
defaultOpen: { control: 'boolean' },
showChevron: { control: 'boolean' },
open: { control: 'boolean' },
},
};
export default meta;
type Story = StoryObj<typeof meta>;
export const Default: Story = {
args: {
trigger: <h3 className="text-lg font-semibold p-2">Click to expand</h3>,
children: <div className="p-4 border border-border rounded-md mt-2">Content hidden by default</div>,
},
};
export const CollapsibleCardExample: Story = {
render: () => (
<CollapsibleCard
title="Advanced Settings"
icon={<Settings className="w-4 h-4" />}
className="w-[400px]"
>
<div className="space-y-4">
<div className="text-sm text-muted-foreground">
Configure advanced options for your project.
</div>
<div className="flex justify-end">
<Button size="sm">Save Changes</Button>
</div>
</div>
</CollapsibleCard>
),
};