import type { Meta, StoryObj } from "@storybook/react-native-web-vite";
import { action } from "storybook/actions";
import { Card } from "@jobber/components-native";
import {
  CardBasicExample,
  CardElevationExample,
  CardPressableExample,
} from "./docs";

const meta = {
  title: "Components/Layouts and Structure/Card",
  component: Card,
  parameters: {
    backgrounds: {
      default: "surface background",
    },
    viewport: { defaultViewport: "mobile1" },
  },
} satisfies Meta<typeof Card>;
export default meta;
type Story = StoryObj<typeof meta>;

export const Basic: Story = {
  render: CardBasicExample,
  args: {
    header: { title: "Client" },
  },
};

export const Elevation: Story = {
  render: CardElevationExample,
  args: {
    elevation: "base",
  },
};

export const Pressable: Story = {
  render: CardPressableExample,
  args: {
    header: {
      title: "Your address",
      actionItem: { iconName: "plus2" },
      onPress: () => action("alert")("🏡"),
    },
    footer: {
      title: "View All",
      onPress: () => action("alert")("View all"),
    },
  },
};