import type { Meta, StoryObj } from '@storybook/react';
import { Slider } from './slider';
import React from 'react';

const meta: Meta<typeof Slider> = {
  title: 'UI/Slider',
  component: Slider,
  render: args => <Slider {...args} />,
  argTypes: {
    min: { control: 'number' },
    max: { control: 'number' },
    step: { control: 'number' },
    disabled: { control: 'boolean' },
  },
};

export default meta;
type Story = StoryObj<typeof Slider>;

export const Default: Story = {
  args: {
    defaultValue: [50],
    max: 100,
    step: 1,
  },
  render: args => (
    <div className="w-[400px]">
      <Slider {...args} />
    </div>
  ),
};

export const RangeExample: Story = {
  args: {
    defaultValue: [25, 75],
    max: 100,
    step: 1,
  },
  render: args => (
    <div className="w-[400px]">
      <Slider {...args} />
    </div>
  ),
};