import type { ComponentProps } from "react";
import type { Meta, StoryObj } from "@storybook/react-native-web-vite";
import { InputNumber } from "@jobber/components-native";
import { InputNumberBasic, InputNumberInvalid } from "./docs";

const meta = {
  title: "Components/Forms and Inputs/InputNumber",
  component: InputNumber,
  parameters: {
    viewport: { defaultViewport: "mobile1" },
    showNativeOnWebDisclaimer: true,
  },
} satisfies Meta<typeof InputNumber>;
export default meta;
type Story = StoryObj<Partial<ComponentProps<typeof InputNumber>>>;

export const Basic: Story = {
  render: InputNumberBasic,
  args: {
    placeholder: "Quantity",
    value: 12,
  },
};

export const Invalid: Story = {
  render: InputNumberInvalid,
  args: {
    placeholder: "Area",
    invalid: "Enter a number",
    suffix: { label: "meters" },
    clearable: "never",
  },
};