import type { Meta, StoryObj } from "@storybook/preact";
import { Title } from "./Title";

const meta: Meta<typeof Title> = { title: "Primitives/Title", component: Title, argTypes: { size: { control: "radio", options: ["sm", "md", "lg", "xl"] } } };
export default meta;
type Story = StoryObj<typeof Title>;

export const Default: Story = { args: { text: "Clients" } };
export const WithSubtitle: Story = { args: { text: "Revenue Dashboard", subtitle: "Last 30 days overview" } };
export const WithEmphasis: Story = { args: { text: "Pipeline", subtitle: "5 active deals", emphasis: "+12% from last month" } };
export const AllSizes: Story = {
  render: () => (
    <div>
      <Title text="Extra Large Title" size="xl" />
      <Title text="Large Title" size="lg" />
      <Title text="Medium Title" size="md" />
      <Title text="Small Title" size="sm" />
    </div>
  ),
};
