<script module lang="ts">
  import { defineMeta } from "@storybook/addon-svelte-csf";
  import ScanlineField from "../components/ScanlineField.svelte";
  import Panel from "../components/Panel.svelte";

  const { Story } = defineMeta({
    title: "Style Primitives/ScanlineField",
    component: ScanlineField,
    tags: ["autodocs"],
  });
</script>

<Story name="Soft Neutral" args={{ intensity: "soft", tone: "neutral", size: "md" }} />
<Story name="Medium Accent" args={{ intensity: "medium", tone: "accent", size: "md" }} />
<Story name="Hard Warning" args={{ intensity: "hard", tone: "warning", size: "lg" }} />
<Story name="Panel Backdrop" asChild>
  <Panel title="Signal Surface">
    <ScanlineField intensity="hard" tone="accent" />
  </Panel>
</Story>
