gather-content-ui/dist/lib/src/modules/Button/stories/ButtonIcon/ButtonIcon.stories.js

GatherContent UI Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ButtonIcon = ButtonIcon;
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _ = require("../../../../..");
var _StoryItem = _interopRequireDefault(require("../../../../../../stories/styleguide/StoryItem"));
var _ButtonStoryItem = require("../ButtonStoryItem");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } // @ts-expect-error TS(2307): Cannot find module 'stories/styleguide/StoryItem' ... Remove this comment to see the full error message
var states = [{}, {
  active: true
}, {
  enabled: true
}, {
  disabled: true
}];
var _default = exports["default"] = {
  title: "GUI/Buttons/Button Icon",
  component: _.ButtonIcon
};
function ButtonIcon() {
  return /*#__PURE__*/_react["default"].createElement(_StoryItem["default"], {
    title: "ButtonIconComponent",
    description: "The icon button component"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "flex flex-wrap justify-around"
  }, /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Base (LG)"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIcon, _extends({
      name: "book",
      size: _.ButtonIcon.sizes.lg
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Base (MD)"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIcon, _extends({
      name: "fullScreen",
      size: _.ButtonIcon.sizes.md
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Base (SM)"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIcon, _extends({
      name: "caption16",
      size: _.ButtonIcon.sizes.sm
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Base (counter)"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIcon, _extends({
      name: "caption16"
    }, s), /*#__PURE__*/_react["default"].createElement(_.Counter, null, "9")));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Danger"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIconDanger, _extends({
      name: "caption16"
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Contained"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIconContained, _extends({
      name: "caption16"
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Contained Danger"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIconContainedDanger, _extends({
      name: "caption16"
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Bubble"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIconBubble, _extends({
      name: "newComment"
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "Dark",
    className: "bg-neutral-20 text-white"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIconDark, _extends({
      name: "infoSquare"
    }, s)));
  })), /*#__PURE__*/_react["default"].createElement(_ButtonStoryItem.ButtonStoryItem, {
    title: "White",
    className: "bg-neutral-20 text-white"
  }, states.map(function (s) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "h-16"
    }, /*#__PURE__*/_react["default"].createElement(_.ButtonIconWhite, _extends({
      name: "menuDotted"
    }, s)));
  }))));
}
ButtonIcon.parameters = {
  controls: {
    hideNoControlsWarning: true
  }
};
//# sourceMappingURL=ButtonIcon.stories.js.map