"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.DifferentPlacementAndTrianglePosition = exports.DifferentColors = exports.DefaultStory = void 0;
var _react = _interopRequireDefault(require("react"));
var _ = require("../..");
var _Display = require("../../common/Display");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Atoms / DropdownBubble',
  parameters: {
    component: _.DropdownBubble
  }
};
var DefaultStory = exports.DefaultStory = function DefaultStory() {
  return _react.default.createElement(_.DropdownBubble, null, _react.default.createElement(_.Typography, {
    type: "hero"
  }, "Hello world!"));
};
var DifferentPlacementAndTrianglePosition = exports.DifferentPlacementAndTrianglePosition = function DifferentPlacementAndTrianglePosition() {
  return _react.default.createElement(_Display.Display, {
    items: [{
      component: _react.default.createElement(_.DropdownBubble, {
        position: "left",
        triangle: true
      }, _react.default.createElement(_.Typography, {
        type: "hero"
      }, "Hello world!")),
      title: 'Placement Bottom, Arrow Left'
    }, {
      component: _react.default.createElement(_.DropdownBubble, {
        position: "right",
        triangle: true
      }, _react.default.createElement(_.Typography, {
        type: "hero"
      }, "Hello world!")),
      title: 'Placement Bottom, Arrow Right'
    }, {
      component: _react.default.createElement(_.DropdownBubble, {
        position: "center",
        triangle: true
      }, _react.default.createElement(_.Typography, {
        type: "hero"
      }, "Hello world!")),
      title: 'Placement Bottom, Arrow Center'
    }, {
      component: _react.default.createElement(_.DropdownBubble, {
        position: "left",
        placement: "top",
        triangle: true
      }, _react.default.createElement(_.Typography, {
        type: "hero"
      }, "Hello world!")),
      title: 'Placement Top, Arrow Left'
    }, {
      component: _react.default.createElement(_.DropdownBubble, {
        position: "right",
        placement: "top",
        triangle: true
      }, _react.default.createElement(_.Typography, {
        type: "hero"
      }, "Hello world!")),
      title: 'Placement Top, Arrow Right'
    }, {
      component: _react.default.createElement(_.DropdownBubble, {
        position: "center",
        placement: "top",
        triangle: true
      }, _react.default.createElement(_.Typography, {
        type: "hero"
      }, "Hello world!")),
      title: 'Placement Top, Arrow Center'
    }]
  });
};
var DifferentColors = exports.DifferentColors = function DifferentColors() {
  return _react.default.createElement(_Display.Display, {
    items: [{
      component: _react.default.createElement(_.DropdownBubble, {
        position: "center",
        placement: "top",
        backgroundColor: function backgroundColor(c) {
          return c.color.backgroundBlack;
        },
        borderColor: function borderColor(c) {
          return c.color.functionRed;
        },
        textColor: function textColor(c) {
          return c.color.textLight;
        }
      }, "Custom background, border and text colors"),
      title: 'Custom background'
    }, {
      component: _react.default.createElement(_.DropdownBubble, {
        position: "center",
        placement: "top",
        invertedColors: true
      }, "Inverted colors"),
      title: 'Inverted colors'
    }]
  });
};