"use strict";

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

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

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

var _Link = _interopRequireDefault(require("../Link"));

var _Wrapper = _interopRequireDefault(require("../Wrapper"));

var _classnames = _interopRequireDefault(require("classnames"));

var _pictogramsReact = require("@wfp/pictograms-react");

var _js = require("../../globals/js");

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

var prefix = _js.settings.prefix;

var FooterExternal = function FooterExternal(_ref) {
  var className = _ref.className,
      productName = _ref.productName,
      children = _ref.children,
      metaContent = _ref.metaContent,
      metaLinks = _ref.metaLinks;
  var externalClasses = (0, _classnames.default)("".concat(prefix, "--footer-ext"), className);
  return /*#__PURE__*/_react.default.createElement("footer", {
    className: externalClasses
  }, /*#__PURE__*/_react.default.createElement(_Wrapper.default, {
    pageWidth: "lg"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__content")
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__info")
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__branding")
  }, /*#__PURE__*/_react.default.createElement(_pictogramsReact.WfpLogoVerticalEn, {
    alt: "WFP"
  }), /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__product-name")
  }, productName)), /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__address")
  }, metaContent), /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__social-wrapper")
  }, /*#__PURE__*/_react.default.createElement("p", null, "Follow WFP on:"), /*#__PURE__*/_react.default.createElement("ul", {
    className: "".concat(prefix, "--footer-ext__social-icons-list")
  }, /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--footer-ext__social-icon")
  }, /*#__PURE__*/_react.default.createElement("a", {
    href: "https://twitter.com/WFP",
    target: "_blank",
    rel: "noopener"
  }, /*#__PURE__*/_react.default.createElement(TwitterIcon, null))), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--footer-ext__social-icon")
  }, /*#__PURE__*/_react.default.createElement("a", {
    href: "https://www.facebook.com/WorldFoodProgramme",
    target: "_blank",
    rel: "noopener"
  }, /*#__PURE__*/_react.default.createElement(FacebookIcon, null))), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--footer-ext__social-icon")
  }, /*#__PURE__*/_react.default.createElement("a", {
    href: "https://www.instagram.com/Worldfoodprogramme/",
    target: "_blank",
    rel: "noopener"
  }, /*#__PURE__*/_react.default.createElement(InstagramIcon, null))), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--footer-ext__social-icon")
  }, /*#__PURE__*/_react.default.createElement("a", {
    href: "https://www.linkedin.com/company/world-food-programme",
    target: "_blank",
    rel: "noopener"
  }, /*#__PURE__*/_react.default.createElement(LinkedinIcon, null))), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--footer-ext__social-icon")
  }, /*#__PURE__*/_react.default.createElement("a", {
    href: "https://www.youtube.com/user/WORLDFOODPROGRAM",
    target: "_blank",
    rel: "noopener"
  }, /*#__PURE__*/_react.default.createElement(YoutubeIcon, null))), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--footer-ext__social-icon")
  }, /*#__PURE__*/_react.default.createElement("a", {
    href: "https://www.tiktok.com/@worldfoodprogramme",
    target: "_blank",
    rel: "noopener"
  }, /*#__PURE__*/_react.default.createElement(TiktokIcon, null)))))), /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__nav-wrapper")
  }, /*#__PURE__*/_react.default.createElement(LinksColumn, null), /*#__PURE__*/_react.default.createElement(LinksColumn, null))), /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--footer-ext__legal")
  }, /*#__PURE__*/_react.default.createElement("span", null, new Date().getFullYear(), " \xA9 World Food Programme"), /*#__PURE__*/_react.default.createElement("nav", {
    className: "".concat(prefix, "--footer-ext__nav-legal")
  }, /*#__PURE__*/_react.default.createElement("ul", {
    className: "".concat(prefix, "--footer-ext__legal-links")
  }, metaLinks)))));
};

exports.FooterExternal = FooterExternal;
FooterExternal.propTypes = {
  /**
   * The CSS class name to be placed on the wrapping element.
   */
  className: _propTypes.default.string,
  productName: _propTypes.default.node,
  children: _propTypes.default.node,
  metaContent: _propTypes.default.node,
  metaLinks: _propTypes.default.node
};

var LinksColumn = function LinksColumn() {
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "".concat(prefix, "--links-column")
  }, /*#__PURE__*/_react.default.createElement("p", {
    className: "".concat(prefix, "--links-column__title")
  }, "Title"), /*#__PURE__*/_react.default.createElement("nav", null, /*#__PURE__*/_react.default.createElement("ul", {
    className: "".concat(prefix, "--links-column__nav-list")
  }, /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--links-column-link")
  }, /*#__PURE__*/_react.default.createElement(_Link.default, null, "First link")), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--links-column-link")
  }, /*#__PURE__*/_react.default.createElement(_Link.default, null, "Second link")), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--links-column-link")
  }, /*#__PURE__*/_react.default.createElement(_Link.default, null, "Third link")), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--links-column-link")
  }, /*#__PURE__*/_react.default.createElement(_Link.default, null, "Fourth link")), /*#__PURE__*/_react.default.createElement("li", {
    className: "".concat(prefix, "--links-column-link")
  }, /*#__PURE__*/_react.default.createElement(_Link.default, null, "Fifth link")))));
};

exports.LinksColumn = LinksColumn;

var FooterMetaLink = function FooterMetaLink(_ref2) {
  var className = _ref2.className,
      href = _ref2.href,
      children = _ref2.children;
  var wrapperClasses = (0, _classnames.default)("".concat(prefix, "--footer-ext__legal-link"), className);
  return /*#__PURE__*/_react.default.createElement("li", {
    className: wrapperClasses
  }, /*#__PURE__*/_react.default.createElement(_Link.default, {
    href: href
  }, children));
};

exports.FooterMetaLink = FooterMetaLink;
FooterMetaLink.propTypes = {
  /**
   * The CSS class name to be placed on the wrapping element.
   */
  className: _propTypes.default.string,
  href: _propTypes.default.string,
  children: _propTypes.default.node
};
/**
 * Twitter social icon
 */

var TwitterIcon = function TwitterIcon() {
  return /*#__PURE__*/_react.default.createElement("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    width: 24,
    height: 24
  }, /*#__PURE__*/_react.default.createElement("title", null, "Twitter icon"), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
    id: "prefix__a"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M0 0h24v24H0z"
  }))), /*#__PURE__*/_react.default.createElement("g", {
    clipPath: "url(#prefix__a)"
  }, /*#__PURE__*/_react.default.createElement("path", {
    "data-name": "Social Icons \\u2013 24px / Twitter",
    d: "M21 24H3a3 3 0 01-3-3V3a3 3 0 013-3h18a3 3 0 013 3v18a3 3 0 01-3 3zM4.507 16.722A8.754 8.754 0 009.216 18.1a8.386 8.386 0 006.5-2.854 9.057 9.057 0 002.255-5.9c0-.13 0-.264-.006-.4A6.222 6.222 0 0019.5 7.35a6.27 6.27 0 01-1.77.486 3.09 3.09 0 001.356-1.7 6.135 6.135 0 01-1.956.744 3.078 3.078 0 00-5.323 2.106 3.408 3.408 0 00.078.7 8.765 8.765 0 01-6.341-3.218 3.089 3.089 0 00.954 4.11 3.131 3.131 0 01-1.392-.384v.042a3.085 3.085 0 002.466 3.018 3.087 3.087 0 01-1.386.054 3.07 3.07 0 002.874 2.136 6.138 6.138 0 01-3.822 1.32 5.9 5.9 0 01-.731-.042z",
    fill: "#fff"
  })));
};
/**
 * Facebook social icon
 */


var FacebookIcon = function FacebookIcon() {
  return /*#__PURE__*/_react.default.createElement("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    width: 24,
    height: 24
  }, /*#__PURE__*/_react.default.createElement("title", null, "Facebook icon"), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
    id: "prefix__a"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M0 0h24v24H0z"
  }))), /*#__PURE__*/_react.default.createElement("g", {
    clipPath: "url(#prefix__a)"
  }, /*#__PURE__*/_react.default.createElement("path", {
    "data-name": "Social Icons \\u2013 24px / Facebook",
    d: "M22.676 0H1.324A1.324 1.324 0 000 1.324v21.352A1.324 1.324 0 001.324 24h11.5v-9.281H9.7v-3.633h3.124V8.412c0-3.1 1.9-4.788 4.659-4.788a26.565 26.565 0 012.789.141v3.24h-1.9c-1.506 0-1.8.712-1.8 1.763v2.313h3.6l-.472 3.633h-3.148V24h6.124A1.324 1.324 0 0024 22.676V1.324A1.324 1.324 0 0022.676 0z",
    fill: "#fff"
  })));
};
/**
 * Instagram social icon
 */


var InstagramIcon = function InstagramIcon() {
  return /*#__PURE__*/_react.default.createElement("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    width: 24,
    height: 24
  }, /*#__PURE__*/_react.default.createElement("title", null, "Instagram icon"), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
    id: "prefix__a"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M0 0h24v24H0z"
  }))), /*#__PURE__*/_react.default.createElement("g", {
    clipPath: "url(#prefix__a)"
  }, /*#__PURE__*/_react.default.createElement("path", {
    "data-name": "Social Icons \\u2013 24px / Instagram",
    d: "M7.053 23.928a8.866 8.866 0 01-2.913-.558 5.9 5.9 0 01-2.126-1.384A5.88 5.88 0 01.63 19.86a8.853 8.853 0 01-.558-2.912C.014 15.653 0 15.224 0 12s.014-3.653.072-4.947A8.853 8.853 0 01.63 4.14a5.88 5.88 0 011.384-2.126A5.88 5.88 0 014.14.63 8.853 8.853 0 017.053.072C8.347.014 8.775 0 12 0s3.653.014 4.948.072A8.853 8.853 0 0119.86.63a5.88 5.88 0 012.126 1.384A5.9 5.9 0 0123.37 4.14a8.866 8.866 0 01.557 2.913C23.986 8.331 24 8.757 24 12s-.014 3.669-.072 4.948a8.865 8.865 0 01-.557 2.912 6.138 6.138 0 01-3.51 3.51 8.865 8.865 0 01-2.912.557c-1.279.058-1.7.072-4.948.072s-3.67-.013-4.948-.071zm.1-21.7a6.67 6.67 0 00-2.228.413 3.733 3.733 0 00-1.38.9 3.733 3.733 0 00-.9 1.38 6.67 6.67 0 00-.413 2.228C2.174 8.4 2.162 8.78 2.162 12s.012 3.6.07 4.849a6.67 6.67 0 00.413 2.228 3.733 3.733 0 00.9 1.38 3.733 3.733 0 001.38.9 6.64 6.64 0 002.228.413c1.252.058 1.629.07 4.849.07s3.6-.012 4.849-.07a6.64 6.64 0 002.228-.413 3.975 3.975 0 002.278-2.278 6.64 6.64 0 00.413-2.228c.058-1.252.07-1.629.07-4.849s-.012-3.6-.07-4.849a6.64 6.64 0 00-.413-2.228 3.733 3.733 0 00-.9-1.38 3.733 3.733 0 00-1.38-.9 6.67 6.67 0 00-2.228-.413c-1.249-.058-1.629-.07-4.849-.07s-3.6.012-4.849.07zM5.838 12A6.162 6.162 0 1112 18.162 6.169 6.169 0 015.838 12zM8 12a4 4 0 104-4 4.005 4.005 0 00-4 4zm8.966-6.405a1.44 1.44 0 111.439 1.439 1.44 1.44 0 01-1.439-1.439z",
    fill: "#fff"
  })));
};
/**
 * LinkedIn social icon
 */


var LinkedinIcon = function LinkedinIcon() {
  return /*#__PURE__*/_react.default.createElement("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    width: 24,
    height: 24
  }, /*#__PURE__*/_react.default.createElement("title", null, "LinkedIn icon"), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
    id: "prefix__a"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M0 0h24v24H0z"
  }))), /*#__PURE__*/_react.default.createElement("g", {
    clipPath: "url(#prefix__a)"
  }, /*#__PURE__*/_react.default.createElement("path", {
    "data-name": "Social Icons \\u2013 24px / LinkedIn",
    d: "M22.224 24H1.77A1.753 1.753 0 010 22.268V1.731A1.753 1.753 0 011.77 0h20.454A1.756 1.756 0 0124 1.731v20.537A1.756 1.756 0 0122.224 24zM9.353 9v11.451h3.555v-5.665c0-1.454.254-2.941 2.134-2.941 1.85 0 1.85 1.755 1.85 3.036v5.571h3.559V14.17a7.2 7.2 0 00-.784-3.886 3.764 3.764 0 00-3.487-1.571 3.763 3.763 0 00-3.368 1.849h-.049V9zm-5.8 0v11.451h3.565V9zm1.786-5.7A2.065 2.065 0 107.4 5.368 2.068 2.068 0 005.339 3.3z",
    fill: "#fff"
  })));
};
/**
 * YouTube social icon
 */


var YoutubeIcon = function YoutubeIcon() {
  return /*#__PURE__*/_react.default.createElement("svg", {
    width: 24,
    height: 17,
    xmlns: "http://www.w3.org/2000/svg",
    xmlnsXlink: "http://www.w3.org/1999/xlink"
  }, /*#__PURE__*/_react.default.createElement("title", null, "YouTube icon"), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("path", {
    id: "prefix__a",
    d: "M0 0h24v24H0z"
  })), /*#__PURE__*/_react.default.createElement("g", {
    transform: "translate(0 -4)",
    fill: "none",
    fillRule: "evenodd"
  }, /*#__PURE__*/_react.default.createElement("g", {
    mask: "url(#prefix__b)",
    fill: "#FFF",
    fillRule: "nonzero"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M23.5 6.64a3.015 3.015 0 00-2.123-2.14C19.505 4 12 4 12 4s-7.505 0-9.377.5A3.015 3.015 0 00.5 6.64a33.951 33.951 0 000 11.628A3.015 3.015 0 002.623 20.4c1.872.5 9.377.5 9.377.5s7.505 0 9.377-.5a3.015 3.015 0 002.123-2.131c.669-3.847.669-7.78 0-11.628V6.64zM9.545 16.023V8.886l6.273 3.569-6.273 3.568z"
  }))));
};
/**
 * TikTok social icon
 */


var TiktokIcon = function TiktokIcon() {
  return /*#__PURE__*/_react.default.createElement("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    width: 24,
    height: 24
  }, /*#__PURE__*/_react.default.createElement("title", null, "TikTok icon"), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
    id: "prefix__a"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M0 0h24v24H0z"
  }))), /*#__PURE__*/_react.default.createElement("g", {
    clipPath: "url(#prefix__a)"
  }, /*#__PURE__*/_react.default.createElement("path", {
    d: "M22.225 24H1.769A1.753 1.753 0 010 22.268V1.73A1.752 1.752 0 011.769-.001h20.456a1.756 1.756 0 011.776 1.731v20.538A1.756 1.756 0 0122.225 24zM10.211 9.429a5.454 5.454 0 00-5.449 5.448 5.454 5.454 0 005.449 5.448 5.424 5.424 0 003.708-1.462 5.434 5.434 0 001.722-3.57h.018V8.851a6.919 6.919 0 004.034 1.29h.069V7.183h-.069a4.027 4.027 0 01-4.022-4.023h-3.009v11.9a2.47 2.47 0 01-2.451 2.274 2.463 2.463 0 01-2.459-2.46 2.462 2.462 0 012.459-2.458 2.448 2.448 0 01.758.121V9.481a5.43 5.43 0 00-.759-.052z",
    fill: "#fff",
    stroke: "rgba(0,0,0,0)",
    strokeMiterlimit: 10
  })));
};