import type { Meta, StoryObj } from "@storybook/react";
import { GaugeHorizontal } from "./GaugeHorizontal";

const meta: Meta<typeof GaugeHorizontal> = {
  component: GaugeHorizontal,
  args: {
    percent: 35,
    color: "stroke-success-500",
    bgColor: "#13141c",
    length: 200,
    strokeWidth: 10,
  },
};

export default meta;

type Story = StoryObj<typeof GaugeHorizontal>;

const argTypes = {
  percent: {
    control: {
      type: "range",
      min: 0,
      max: 100,
    },
  },
  color: {
    control: "color",
  },
  bgColor: {
    control: "color",
  },
};

export const Primary: Story = {
  render: (args) => <GaugeHorizontal {...args} />,
  argTypes,
};