"use strict";

var __importDefault = this && this.__importDefault || function (mod) {
  return mod && mod.__esModule ? mod : {
    "default": mod
  };
};

Object.defineProperty(exports, "__esModule", {
  value: true
});

const react_1 = __importDefault(require("react"));

const react_2 = require("@storybook/react");

const Button_1 = require("../../components/atoms/Button");

const handleAlert = event => alert('eh');

const Icon = props => react_1.default.createElement("span", null, "icon");

const StyledButton = styled.withComponent(Button_1.Button)`
  color: hotpink;
  background: #222;
`; // @todo !!! LOTS TO FINISH HERE

react_2.storiesOf('atoms/Button', module).add('default', () => react_1.default.createElement(Button_1.Button, null)).add('text', () => react_1.default.createElement(Button_1.Button, {
  text: "canada"
})).add('link', () => react_1.default.createElement(Button_1.Button, {
  isLink: true,
  to: "https://google.com",
  text: "google.com"
})).add('onClick', () => react_1.default.createElement(Button_1.Button, {
  onClick: handleAlert,
  text: "eh"
})).add('submit', () => react_1.default.createElement(Button_1.Button, {
  onSubmit: handleAlert,
  text: "submit",
  type: "submit"
})).add('icon', () => react_1.default.createElement(Button_1.Button, {
  icon: react_1.default.createElement(Icon, null),
  text: "clickbait"
})).add('animated', () => react_1.default.createElement(Button_1.Button, {
  isAnimated: true,
  text: "animated"
})).add('styled', () => react_1.default.createElement(StyledButton, {
  text: "stylez"
})).add('renderIconAndText', () => {
  // see the @todo in the button
  const renderIconAndText = (props, state) => {
    return 'unused'; // return (
    //   <span>
    //     props: {props.text}
    //     {props.icon}; icon and text - the props has all the things
    //   </span>
    // )
  };

  const render = (props, state) => {
    return react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement("p", null, "text prop: ", props.text), react_1.default.createElement("p", null, "icon prop: ", props.icon), react_1.default.createElement("p", null, "icon and text - the props has all the things"));
  };

  const iconView = react_1.default.createElement(Icon, null);
  return react_1.default.createElement(Button_1.Button, {
    text: "eh",
    icon: iconView,
    renderIconAndText: renderIconAndText,
    render: render
  });
}); // .add('ButtonWithIcon', () => <ButtonWithIcon />)
// storiesOf('FlatButton', module)
//   .add('TextButton', () => <TextButton />)
//   .add('FlatButton', () => <FlatButton />)
//   .add('isLink', () => <FlatButton isLink />)
//   .add('isFlat', () => <FlatButton isFlat />)
//   .add('isLink + to=', () => <FlatButton isFlat to={'canada.ca'} />)
// storiesOf('ButtonGroup').add('ButtonGroup', () => <ButtonGroup />)
// storiesOf('GreenButton', module).add('default', () => <GreenButton />)
// storiesOf('BlueButton', module)
//   .add('default', () => <BlueButton />)
//   .add('isDisabled', () => <BlueButton isDisabled disabled />)
//   .add('pushed - todo', () => <BlueButton pushed />)
// storiesOf('GhostButton', module).add('default', () => <GhostButton />)
//# sourceMappingURL=Button.story.js.map