import type { Meta, StoryObj } from '@storybook/react';

import { Text } from '../Text';

import { Card } from './Card';

const meta = {
  title: 'Atoms/Card',
  component: Card,
  parameters: { layout: 'centered' },
  argTypes: {
    tone: {
      control: { type: 'select' },
      options: ['default', 'muted', 'primary', 'success', 'danger', 'warning'],
    },
  },
  args: { tone: 'default' },
} satisfies Meta<typeof Card>;

export default meta;
type Story = StoryObj<typeof meta>;

export const Default: Story = {
  render: (args) => (
    <Card {...args} className="p-4 w-80">
      <Text variant="subtitleLarge">Ficha técnica</Text>
      <Text className="mt-2">Sección 1 · 4 lechos · 5 cuadros</Text>
    </Card>
  ),
};

export const Primary: Story = { ...Default, args: { tone: 'primary' } };
export const Success: Story = { ...Default, args: { tone: 'success' } };
export const Danger: Story = { ...Default, args: { tone: 'danger' } };