import React from "react";
import { StoryFn, StoryObj, Meta } from "@storybook/react";
import { HouseholdCompositionCard, Root } from "../index";
import { type HouseholdCompositionCardProps } from "./types";

const defaultExport: Meta<typeof Root> = {
  title: "Unofficial/Demographics/HouseholdCompositionCard",
  component: Root,
};

export default defaultExport;

const HouseholdCompositionCardTemplate: StoryFn<
  typeof HouseholdCompositionCard
> = (args) => (
  <Root>
    <HouseholdCompositionCard {...args} />
  </Root>
);

export const Primary: StoryObj<HouseholdCompositionCardProps> =
  HouseholdCompositionCardTemplate.bind({});
Primary.args = {
  options: {
    labels: ["Single Family", "Single Person", "Multi Person", "Multi Family"],
    data: [63, 24, 9, 4],
  },
};