import React, { useState } from "react";
import { ComponentStory, ComponentMeta } from "@storybook/react";

import { RooButton } from "../ui-components/RooButton";
import { RooButtonInfo } from "../ui-components/RooButton/RooButtonInfo";

export default {
  title: "RooButton",
  component: RooButton,
} as ComponentMeta<typeof RooButton>;

const Template: ComponentStory<typeof RooButton> = (args) => {
  return <RooButton {...args} />;
};

const InfoTemplate: ComponentStory<typeof RooButton> = () => <RooButtonInfo />;

export const RooButtonDetails = InfoTemplate.bind({});

export const PrimaryButton = Template.bind({});
PrimaryButton.args = {
  title: "Primary CTA",
  buttonType: "primary"
};
export const SecondaryButton = Template.bind({});
SecondaryButton.args = {
  title: "Secondary CTA",
  buttonType: "secondary"
};
