"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.DefaultAndCommonUseCases = void 0;
var _react = _interopRequireDefault(require("react"));
var _ = require("../../../..");
var _2 = _interopRequireDefault(require("../.."));
var _Display = require("../../../../common/Display");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Molecules / Badge / Icon',
  parameters: {
    component: _2.default.Icon
  }
};
var DefaultAndCommonUseCases = exports.DefaultAndCommonUseCases = {
  render: function render() {
    return _react.default.createElement(_Display.Display, {
      items: [{
        title: 'Default use',
        component: _react.default.createElement(_2.default.Icon, null, _react.default.createElement(_.Icon.Add8, null))
      }, {
        title: 'Different sizes',
        component: _react.default.createElement(_.Flexbox, {
          container: true,
          direction: "column"
        }, _react.default.createElement(_2.default.Icon, {
          badgeSize: "xl"
        }, _react.default.createElement(_.Icon.Book32, {
          color: function color(t) {
            return t.color.badgeIconColor;
          }
        })), _react.default.createElement(_2.default.Icon, {
          badgeSize: "l"
        }, _react.default.createElement(_.Icon.Gold24, {
          color: function color(t) {
            return t.color.badgeIconColor;
          }
        })), _react.default.createElement(_2.default.Icon, {
          badgeSize: "m"
        }, _react.default.createElement(_.Icon.Help16, {
          color: function color(t) {
            return t.color.badgeIconColor;
          }
        })), _react.default.createElement(_2.default.Icon, {
          badgeSize: "s"
        }, _react.default.createElement(_.Icon.Bolt8, {
          color: function color(t) {
            return t.color.badgeIconColor;
          }
        })))
      }, {
        title: 'Custom icon badge with custom props',
        component: _react.default.createElement(_2.default.Icon, {
          badgeColor: function badgeColor(t) {
            return t.color.bulbBackground;
          },
          badgeSize: "l"
        }, _react.default.createElement(_.Icon.Lightbulb24, {
          color: function color(t) {
            return t.color.bulbForeground;
          }
        }))
      }, {
        title: 'Custom icon badge size',
        component: _react.default.createElement(_2.default.Icon, {
          badgeColor: function badgeColor(t) {
            return t.color.bulbBackground;
          },
          badgeSize: 30
        }, _react.default.createElement(_.Icon.Lightbulb24, {
          color: function color(t) {
            return t.color.bulbForeground;
          }
        }))
      }, {
        title: 'Badge with illustration default use',
        component: _react.default.createElement(_2.default.Icon, {
          badgeSize: "xl"
        }, _react.default.createElement(_.Illustration.UrgentMailFill64, null))
      }, {
        title: 'Badge with illustration with custom props',
        component: _react.default.createElement(_2.default.Icon, {
          badgeSize: "xl"
        }, _react.default.createElement("span", null, _react.default.createElement(_.Illustration.UrgentMailFill64, {
          color: function color(t) {
            return t.color.badgeIconColor;
          },
          secondaryColor: function secondaryColor(t) {
            return t.color.warning;
          }
        })))
      }]
    });
  },
  name: 'Default and common use cases'
};