/* eslint-disable import/no-deprecated -- This file documents the deprecated
 * ProgressBar component until it is removed or shimmed. */
import type { ComponentProps } from "react";
import type { Meta, StoryObj } from "@storybook/react-native-web-vite";
import { ProgressBar } from "@jobber/components-native";
import { ProgressBarBasic, ProgressBarWithHeader } from "./docs";

type ProgressBarStoryArgs = Partial<
  Pick<
    ComponentProps<typeof ProgressBar>,
    "current" | "total" | "inProgress" | "variation" | "size"
  >
>;

const meta = {
  title: "Components/Status and Feedback/ProgressBar",
  component: ProgressBar,
  parameters: {
    viewport: { defaultViewport: "mobile1" },
    showNativeOnWebDisclaimer: true,
  },
} satisfies Meta<typeof ProgressBar>;

export default meta;

type Story = StoryObj<ProgressBarStoryArgs>;

export const Basic: Story = {
  render: ProgressBarBasic,
  args: {
    total: 5,
    current: 1,
    inProgress: 2,
  },
};

export const WithHeader: Story = {
  render: ProgressBarWithHeader,
  args: {
    total: 6,
    current: 1,
  },
};