@lote-design-system/marketing-blocks/main/components/marketing/footers/Footer4.js

marketing blocks

"use strict";

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

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

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

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

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

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

var _icons = _interopRequireDefault(require("@lote-design-system/icons"));

var _core = require("@lote-design-system/core");

// => Dependent styled-components
// Our main component depends upon the following styled-components
var Footer = _styledComponents["default"].footer.withConfig({
  displayName: "Footer4__Footer",
  componentId: "kaur78-0"
})(["background-color:#fff;padding:64px 0;", "{text-align:center;}"], function (_ref) {
  var theme = _ref.theme;
  return theme.mediaQueries.sm;
});

var ContainerModify = (0, _styledComponents["default"])(_core.Container).withConfig({
  displayName: "Footer4__ContainerModify",
  componentId: "kaur78-1"
})(["max-width:", ";"], function (_ref2) {
  var theme = _ref2.theme;
  return theme.maxContainerWidth;
});

var ListInline = _styledComponents["default"].ul.withConfig({
  displayName: "Footer4__ListInline",
  componentId: "kaur78-2"
})(["margin-top:0;margin-bottom:16px;padding-left:0;list-style:none;> li{> a{font-size:14px;font-weight:500;display:block;padding:8px 12px;color:", ";transition:color 0.3s linear;&:hover{color:", ";}}}> li:not(:last-child){margin-right:8px;}", "{> li{display:inline-block;}}"], function (_ref3) {
  var colors = _ref3.theme.colors;
  return colors.text.secondary;
}, function (_ref4) {
  var colors = _ref4.theme.colors;
  return colors.primary;
}, function (_ref5) {
  var theme = _ref5.theme;
  return theme.mediaQueries.sm;
});

var ListInline2 = _styledComponents["default"].ul.withConfig({
  displayName: "Footer4__ListInline2",
  componentId: "kaur78-3"
})(["margin-top:0;margin-bottom:26px;padding-left:0;list-style:none;> li{display:inline-block;> a{display:inline-block;padding:8px 12px;color:", ";transition:color 0.3s linear;&:hover{color:", ";}> svg{width:18px;height:18px;}}}> li:not(:last-child){margin-right:8px;}"], function (_ref6) {
  var colors = _ref6.theme.colors;
  return colors.text.secondary;
}, function (_ref7) {
  var colors = _ref7.theme.colors;
  return colors.primary;
});

var CopyrightText = _styledComponents["default"].p.withConfig({
  displayName: "Footer4__CopyrightText",
  componentId: "kaur78-4"
})(["color:", ";font-size:14px;font-weight:500;margin-bottom:0;"], function (_ref8) {
  var colors = _ref8.theme.colors;
  return colors.text.secondary;
}); // <= End Dependent styled-components


var linkSchema = [{
  id: 1,
  href: '/about',
  text: 'About'
}, {
  id: 2,
  href: '/blog',
  text: 'Blog'
}, {
  id: 3,
  href: '/jobs',
  text: 'Jobs'
}, {
  id: 4,
  href: '/press',
  text: 'Press'
}, {
  id: 5,
  href: '/accessibility',
  text: 'Accessibility'
}, {
  id: 6,
  href: '/partners',
  text: 'Partners'
}];
var socialLinkSchema = [{
  id: 1,
  href: '/',
  icon: /*#__PURE__*/_react["default"].createElement(_icons["default"], {
    name: "facebook"
  })
}, {
  id: 2,
  href: '/',
  icon: /*#__PURE__*/_react["default"].createElement(_icons["default"], {
    name: "instagram"
  })
}, {
  id: 3,
  href: '/',
  icon: /*#__PURE__*/_react["default"].createElement(_icons["default"], {
    name: "twitter"
  })
}, {
  id: 4,
  href: '/',
  icon: /*#__PURE__*/_react["default"].createElement(_icons["default"], {
    name: "github"
  })
}, {
  id: 5,
  href: '/',
  icon: /*#__PURE__*/_react["default"].createElement(_icons["default"], {
    name: "linkedin"
  })
}];
var linkShape = {
  id: _propTypes["default"].number.isRequired,
  href: _propTypes["default"].string.isRequired,
  text: _propTypes["default"].string.isRequired
};
var socialLinkShape = {
  id: _propTypes["default"].number.isRequired,
  href: _propTypes["default"].string.isRequired,
  icon: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node]).isRequired
};
var propTypes = {
  /** Copyright text. */
  copyrightText: _propTypes["default"].string.isRequired,

  /** Array of links */
  links: _propTypes["default"].arrayOf(_propTypes["default"].shape(linkShape)).isRequired,

  /** Array of social links */
  socialLinks: _propTypes["default"].arrayOf(_propTypes["default"].shape(socialLinkShape)).isRequired
};
var defaultProps = {
  copyrightText: '© 2020 UI-Kit, Inc. All rights reserved.',
  links: linkSchema,
  socialLinks: socialLinkSchema
};
/**
 * Returns the JSX or null for the icon.
 * @param icon {*} - The icon will React.element or a string
 * @return {null|*} - Returns the JSX or null
 */

var renderIcon = function renderIcon(icon) {
  if (_react["default"].isValidElement(icon)) {
    return icon;
  } else if (typeof icon === 'string' && icon.length > 0) {
    return /*#__PURE__*/_react["default"].createElement(_icons["default"], {
      name: icon
    });
  } else {
    return null;
  }
};

var Footer4 = function Footer4(props) {
  var copyrightText = props.copyrightText,
      links = props.links,
      socialLinks = props.socialLinks,
      attributes = (0, _objectWithoutProperties2["default"])(props, ["copyrightText", "links", "socialLinks"]);
  return /*#__PURE__*/_react["default"].createElement(Footer, attributes, /*#__PURE__*/_react["default"].createElement(ContainerModify, {
    fluid: true
  }, Array.isArray(links) && links.length > 0 && /*#__PURE__*/_react["default"].createElement(ListInline, null, links.map(function (_ref9) {
    var id = _ref9.id,
        href = _ref9.href,
        text = _ref9.text;
    return /*#__PURE__*/_react["default"].createElement("li", {
      key: id
    }, /*#__PURE__*/_react["default"].createElement("a", {
      href: href
    }, text));
  })), Array.isArray(socialLinks) && socialLinks.length > 0 && /*#__PURE__*/_react["default"].createElement(ListInline2, null, socialLinks.map(function (_ref10) {
    var id = _ref10.id,
        href = _ref10.href,
        icon = _ref10.icon;
    return /*#__PURE__*/_react["default"].createElement("li", {
      key: id
    }, /*#__PURE__*/_react["default"].createElement("a", {
      href: href
    }, renderIcon(icon)));
  })), /*#__PURE__*/_react["default"].createElement(CopyrightText, null, copyrightText)));
};

exports.Footer4 = Footer4;
Footer4.propTypes = propTypes;
Footer4.defaultProps = defaultProps;