@age/quantum/Socials/Socials.js

Catho react components

"use strict";

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _SocialType = _interopRequireDefault(require("./sub-components/SocialType"));

var _theme = require("../shared/theme");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var List = _styledComponents.default.ul.withConfig({
  displayName: "Socials__List",
  componentId: "ip8gqn-0"
})(["padding:0;display:inline-flex;"]);

var ListItem = _styledComponents.default.li.withConfig({
  displayName: "Socials__ListItem",
  componentId: "ip8gqn-1"
})(["display:inline-flex;list-style:none;", " &:last-child{margin-right:0;}"], function (_ref) {
  var medium = _ref.theme.spacing.medium;
  return "margin-right: ".concat(medium, "px;");
});

var SocialWrapper = _styledComponents.default.section.withConfig({
  displayName: "Socials__SocialWrapper",
  componentId: "ip8gqn-2"
})(["display:inline-flex;"]);

ListItem.displayName = 'ListItem';

var Socials = function Socials(_ref2) {
  var items = _ref2.items,
      size = _ref2.size,
      theme = _ref2.theme,
      withBox = _ref2.withBox;
  return _react.default.createElement(SocialWrapper, null, _react.default.createElement(List, null, items.map(function (item) {
    return _react.default.createElement(ListItem, {
      theme: theme,
      key: "social-item-".concat(item.name)
    }, _react.default.createElement(_SocialType.default, {
      key: "social-".concat(item.name),
      url: item.url,
      type: item.name,
      size: size,
      title: item.title,
      withBox: withBox
    }));
  })));
};

Socials.defaultProps = {
  size: '48',
  theme: {
    spacing: _theme.spacing
  },
  withBox: true
};
Socials.propTypes = {
  size: _propTypes.default.string,
  theme: _propTypes.default.shape({
    spacing: _propTypes.default.object
  }),
  items: _propTypes.default.arrayOf(_propTypes.default.shape({
    name: _propTypes.default.oneOf(['facebook', 'twitter', 'youtube']),
    url: _propTypes.default.string,
    title: _propTypes.default.string
  }).isRequired).isRequired,
  withBox: _propTypes.default.bool
};
var _default = Socials;
exports.default = _default;