@flamingo-stack/openframe-frontend-core 0.0.333-snapshot.20260629095837 → 0.0.333

package/src/stories/Alert.stories.tsx

@@ -1,86 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/nextjs-vite';
-import { AlertTriangleIcon } from '../components/icons-v2-generated/interface/alert-triangle-icon';
-import { Alert, AlertDescription, AlertTitle } from '../components/ui/alert';
-
-const meta = {
-  title: 'UI/Alert',
-  component: Alert,
-  argTypes: {
-    variant: {
-      control: 'select',
-      options: ['default', 'destructive', 'warning'],
-    },
-  },
-} satisfies Meta<typeof Alert>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  args: { variant: 'default' },
-  render: args => (
-    <Alert {...args}>
-      <AlertTitle>Heads up!</AlertTitle>
-      <AlertDescription>You can add components to your app using the CLI.</AlertDescription>
-    </Alert>
-  ),
-};
-
-export const Destructive: Story = {
-  args: { variant: 'destructive' },
-  render: args => (
-    <Alert {...args}>
-      <AlertTitle>Error</AlertTitle>
-      <AlertDescription>Your session has expired. Please log in again.</AlertDescription>
-    </Alert>
-  ),
-};
-
-export const Warning: Story = {
-  args: { variant: 'warning' },
-  render: args => (
-    <Alert {...args}>
-      <AlertTitle>Warning</AlertTitle>
-      <AlertDescription>Some of your settings need attention.</AlertDescription>
-    </Alert>
-  ),
-};
-
-/**
- * Real-world usage: the Settings page email-verification banner.
- * Mirrors the Figma design — warning variant, alert-triangle icon, message and a resend action.
- */
-export const EmailVerification: Story = {
-  args: { variant: 'warning' },
-  render: args => (
-    <Alert {...args} className="flex items-center justify-center gap-[var(--spacing-system-m)] p-[var(--spacing-system-s)]">
-      <span className="shrink-0">
-        <AlertTriangleIcon size={24} />
-      </span>
-      <p className="flex-1 text-h4 font-bold">Verify your email to keep access to system.</p>
-      <button type="button" className="shrink-0 text-h4 font-medium underline whitespace-nowrap">
-        Resend Verification Mail
-      </button>
-    </Alert>
-  ),
-};
-
-export const AllVariants: Story = {
-  args: { variant: 'default' },
-  render: () => (
-    <div className="flex flex-col gap-4">
-      <Alert variant="default">
-        <AlertTitle>Default</AlertTitle>
-        <AlertDescription>Neutral informational alert.</AlertDescription>
-      </Alert>
-      <Alert variant="destructive">
-        <AlertTitle>Destructive</AlertTitle>
-        <AlertDescription>Something went wrong.</AlertDescription>
-      </Alert>
-      <Alert variant="warning">
-        <AlertTitle>Warning</AlertTitle>
-        <AlertDescription>Proceed with caution.</AlertDescription>
-      </Alert>
-    </div>
-  ),
-};