import type { Meta, StoryObj } from "@storybook/vue3-vite"
import type { InputElement } from "@/definitions/elements/InputElement"
import ElementDisplayCard from "./ElementDisplayCard.vue"
import { componentDoc } from "@/lib/storybook"

const widget: InputElement = {
  id: "widget",
  type: "input.text",
  name: "widget",
  label: "Widget input",
  placeholder: "Type something",
} as InputElement

const meta = {
  title: "Cards/ElementDisplayCard",
  component: ElementDisplayCard,
  tags: ["autodocs"],
  parameters: componentDoc("ElementDisplayCard", { barrel: "cards" }),
  args: {
    element: widget,
    item: {},
    showCard: false,
  },
} satisfies Meta<typeof ElementDisplayCard>

export default meta
type Story = StoryObj<typeof meta>

export const Default: Story = {
  args: {},
}

export const WithTitle: Story = {
  args: {
    showCard: true,
    title: "Featured widget",
    subtitle: "Wrapped in Card chrome",
  },
}

export const WithoutChrome: Story = {
  args: {
    showCard: false,
  },
}

export const Showcase: Story = {
  args: {
    showCard: true,
    title: "Showcase",
    subtitle: "Single element inside a card",
  },
}
