import { ComponentMeta, ComponentStory } from "@storybook/react";
import * as React from "react";
import { Textarea } from "./";

// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
export default {
  title: "Example/Textarea",
  component: Textarea,
} as ComponentMeta<typeof Textarea>;

// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
const Template: ComponentStory<typeof Textarea> = (args) => {
  const ref = React.useRef<HTMLTextAreaElement>(null);
  return (
    <div style={{ display: "flex" }}>
      <Textarea
        ref={ref}
        data-id="textarea"
        data-component="Textarea$Brevity"
        data-label="fake"
        data-parent="fake"
        placeholder=""
        required={false}
        defaultValue={""}
        {...args}
        onChange={() => {
          console.log("testing");
        }}
      />
    </div>
  );
};

export const Primary = Template.bind({});
// More on args: https://storybook.js.org/docs/react/writing-stories/args
Primary.args = {
  minRows: 1,
  maxRows: 6,
};

export const SubmitOnEnter = Template.bind({});
SubmitOnEnter.args = {
  submitOnEnter: true,
  minRows: 1,
  maxRows: 4,
};