@cbinsights/fds/lib/util/storybook-docs/Info.js

Form: A design system by CB Insights

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Info = void 0;

var _react = _interopRequireDefault(require("react"));

var _styleConstants = _interopRequireDefault(require("../../dictionary/js/styleConstants"));

/**
 * For displaying important info in MDX docs
 */
var Info = function Info(_ref) {
  var _ref$type = _ref.type,
      type = _ref$type === void 0 ? 'info' : _ref$type,
      children = _ref.children;
  var accentMap = {
    warn: _styleConstants.default.COLOR_ORANGE,
    info: _styleConstants.default.COLOR_SKY
  };
  var emojiMap = {
    warn: '⚠️',
    info: '💡'
  };
  var style = {
    border: "1px solid ".concat(accentMap[type]),
    borderTop: "8px solid ".concat(accentMap[type]),
    display: 'flex',
    alignItems: 'center'
  };
  return /*#__PURE__*/_react.default.createElement("blockquote", {
    style: style,
    className: "margin--bottom padding--top--s padding--bottom--s padding--left padding--right rounded--all"
  }, /*#__PURE__*/_react.default.createElement("span", {
    className: "padding--right fontSize--2xl"
  }, emojiMap[type]), /*#__PURE__*/_react.default.createElement("span", {
    className: "color--heading"
  }, children));
};

exports.Info = Info;
var _default = Info;
exports.default = _default;