import React from "react";
import { Story, Meta } from "@storybook/react/types-6-0";

import { ThemeProvider } from "../ThemeProvider";
import { TextArea, TextareaProps } from "./TextArea";

export default {
  title: "Components/Input/TextArea",
  component: TextArea,
} as Meta;

const Template: Story<TextareaProps> = (args) => {
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  const [value, setValue] = React.useState(args.value);
  return (
    <ThemeProvider>
      <TextArea
        value={value}
        onChange={() => {}}
        clearOnEscape
        placeholder={args.placeholder}
      />
    </ThemeProvider>
  );
};

export const Default = Template.bind({});
Default.args = {
  placeholder: "You can start writing here...",
};