"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.NeutralButtonLookingLikeLinkUnderlineOnHover = exports.LinksLookingLikeButtonsComposedInAGroup = exports.LinkLookingLikeAButtonWithWithColors = exports.LinkLookingLikeAButtonWithRelAsNofollow = exports.LinkLookingLikeAButtonThatIsFullWidth = exports.LinkLookingLikeAButton = exports.ExternalLinkLookingLikeAButton = exports.DisabledLinkLookingLikeAButton = void 0;
var _react = _interopRequireDefault(require("react"));
var _addonActions = require("@storybook/addon-actions");
var _ReactRouterLinkHelper = require("../../../../common/Links/ReactRouterLinkHelper");
var _ = require("../../../..");
var _Display = require("../../../../common/Display");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Molecules / Button / Button',
  parameters: {
    component: _.Button
  }
};
var LinkLookingLikeAButton = exports.LinkLookingLikeAButton = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_Display.Display, {
      items: [{
        title: 'Reset',
        component: _react.default.createElement(_.Button, {
          to: "/route1"
        }, "To Route1")
      }, {
        title: 'Submit',
        component: _react.default.createElement(_.Button, {
          to: "/route2",
          variant: "secondary"
        }, "To Route2")
      }]
    }));
  },
  name: 'Link looking like a button'
};
var LinkLookingLikeAButtonThatIsFullWidth = exports.LinkLookingLikeAButtonThatIsFullWidth = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_.Button, {
      to: "/overview",
      onClick: (0, _addonActions.action)('clicked'),
      fullWidth: true
    }, "Button"));
  },
  name: 'Link looking like a button that is full width'
};
var LinksLookingLikeButtonsComposedInAGroup = exports.LinksLookingLikeButtonsComposedInAGroup = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_.Flexbox, {
      container: true,
      gap: 2
    }, _react.default.createElement(_.Flexbox, {
      item: true,
      flex: "1"
    }, _react.default.createElement(_.Button, {
      to: "/route1",
      onClick: (0, _addonActions.action)('submit'),
      fullWidth: true
    }, "Submit")), _react.default.createElement(_.Flexbox, {
      item: true,
      flex: "1"
    }, _react.default.createElement(_.Button, {
      to: "/route2",
      onClick: (0, _addonActions.action)('reset'),
      variant: "secondary",
      fullWidth: true
    }, "Reset"))));
  },
  name: 'Links looking like buttons composed in a group'
};
var LinkLookingLikeAButtonWithRelAsNofollow = exports.LinkLookingLikeAButtonWithRelAsNofollow = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_.Button, {
      to: "/overview",
      rel: "nofollow",
      onClick: (0, _addonActions.action)('clicked'),
      fullWidth: true
    }, "Button"));
  },
  name: 'Link looking like a button with rel as nofollow'
};
var ExternalLinkLookingLikeAButton = exports.ExternalLinkLookingLikeAButton = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_.Button, {
      to: "//www.google.com",
      external: true,
      rel: "nofollow",
      onClick: (0, _addonActions.action)('clicked'),
      fullWidth: true
    }, "Button"));
  },
  name: 'External link looking like a button'
};
var DisabledLinkLookingLikeAButton = exports.DisabledLinkLookingLikeAButton = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_.Button, {
      fullWidth: true,
      onClick: (0, _addonActions.action)('clicked'),
      size: "m",
      to: "/overview",
      variant: "secondary",
      disabled: true
    }, "Button"));
  },
  name: 'Disabled link looking like a button'
};
var LinkLookingLikeAButtonWithWithColors = exports.LinkLookingLikeAButtonWithWithColors = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Display.Display, {
      title: "Primary",
      items: [{
        title: 't => t.color.cta',
        component: _react.default.createElement(_.Button, {
          to: "/overview",
          color: function color(t) {
            return t.color.cta;
          },
          onClick: (0, _addonActions.action)('clicked')
        }, "Button")
      }, {
        title: 't => t.color.negative',
        component: _react.default.createElement(_.Button, {
          to: "/overview",
          color: function color(t) {
            return t.color.negative;
          },
          onClick: (0, _addonActions.action)('clicked')
        }, "Button")
      }]
    }), _react.default.createElement(_Display.Display, {
      title: "Secondary",
      items: [{
        title: 't => t.color.cta',
        component: _react.default.createElement(_.Button, {
          variant: "secondary",
          to: "/overview",
          color: function color(t) {
            return t.color.cta;
          },
          onClick: (0, _addonActions.action)('clicked')
        }, "Button")
      }, {
        title: 't => t.color.negative',
        component: _react.default.createElement(_.Button, {
          variant: "secondary",
          to: "/overview",
          color: function color(t) {
            return t.color.negative;
          },
          onClick: (0, _addonActions.action)('clicked')
        }, "Button")
      }]
    })));
  },
  name: 'Link looking like a button with with colors'
};
var NeutralButtonLookingLikeLinkUnderlineOnHover = exports.NeutralButtonLookingLikeLinkUnderlineOnHover = {
  render: function render() {
    return _react.default.createElement(_ReactRouterLinkHelper.Provider, null, _react.default.createElement(_Display.Display, {
      items: [{
        title: 'Reset',
        component: _react.default.createElement(_.Button, {
          variant: "neutral",
          to: "/route1"
        }, "To Route1")
      }, {
        title: 'Reset icon right',
        component: _react.default.createElement(_.Button, {
          icon: _react.default.createElement(_.Icon.ArrowDown16, null),
          iconPlacement: "right",
          variant: "neutral",
          to: "/route1"
        }, "To Route1")
      }]
    }));
  },
  name: 'Neutral button looking like link'
};