@ndla/ui 3.2.1 → 3.2.2

package/lib/Figure/FigureLicense.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FigureLicenseByline = exports.FigureLicenseCta = exports.classLicenses = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactBemHelper = _interopRequireDefault(require("react-bem-helper"));
+
+var _util = require("@ndla/util");
+
+var _licenses = require("@ndla/licenses");
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var classLicenses = new _reactBemHelper["default"]({
+  name: 'figure-license',
+  prefix: 'c-'
+});
+exports.classLicenses = classLicenses;
+
+var FigureLicenseCta = function FigureLicenseCta(_ref) {
+  var children = _ref.children,
+      messages = _ref.messages,
+      authors = _ref.authors,
+      origin = _ref.origin,
+      title = _ref.title;
+  return (0, _core.jsx)("div", classLicenses('cta-wrapper'), (0, _core.jsx)("ul", classLicenses('list'), title && (0, _core.jsx)("li", classLicenses('item'), "".concat(messages.title, ": ").concat(title)), authors === null || authors === void 0 ? void 0 : authors.map(function (author) {
+    return (0, _core.jsx)("li", _extends({
+      key: (0, _util.uuid)()
+    }, classLicenses('item')), "".concat(author.type, ": ").concat(author.name));
+  }), origin && (0, _core.jsx)("li", classLicenses('item'), messages.source, ":", ' ', origin.startsWith('http') ? (0, _core.jsx)("a", {
+    href: origin,
+    target: "_blank",
+    rel: "noopener noreferrer"
+  }, origin) : origin)), (0, _core.jsx)("div", classLicenses('cta-block'), children));
+};
+
+exports.FigureLicenseCta = FigureLicenseCta;
+
+var FigureLicenseByline = function FigureLicenseByline(_ref2) {
+  var messages = _ref2.messages,
+      license = _ref2.license,
+      locale = _ref2.locale;
+  return (0, _core.jsx)(_react["default"].Fragment, null, (0, _core.jsx)(_licenses.LicenseDescription, {
+    key: "byline",
+    highlightCC: true,
+    locale: locale,
+    messages: messages,
+    licenseRights: license.rights
+  }), ",", (0, _core.jsx)("a", _extends({
+    key: "link"
+  }, classLicenses('link'), {
+    target: "_blank",
+    rel: "noopener noreferrer",
+    href: license.url
+  }), license.linkText));
+};
+
+exports.FigureLicenseByline = FigureLicenseByline;

package/lib/Figure/FigureLicenseDialog.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FigureLicenseDialog = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Dialog = _interopRequireDefault(require("../Dialog"));
+
+var _FigureLicense = require("./FigureLicense");
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var FigureLicenseDialog = function FigureLicenseDialog(_ref) {
+  var children = _ref.children,
+      messages = _ref.messages,
+      id = _ref.id,
+      authors = _ref.authors,
+      origin = _ref.origin,
+      title = _ref.title,
+      locale = _ref.locale,
+      license = _ref.license;
+  var headingLabelId = "heading-".concat(id);
+  return (0, _core.jsx)(_Dialog["default"], {
+    id: id,
+    labelledby: headingLabelId,
+    messages: messages
+  }, (0, _core.jsx)("div", (0, _FigureLicense.classLicenses)(), (0, _core.jsx)("h3", _extends({
+    id: headingLabelId
+  }, (0, _FigureLicense.classLicenses)('title')), messages.rulesForUse), (0, _core.jsx)(_FigureLicense.FigureLicenseByline, {
+    license: license,
+    messages: messages,
+    locale: locale
+  }), (0, _core.jsx)(_FigureLicense.FigureLicenseCta, {
+    authors: authors,
+    title: title,
+    origin: origin,
+    messages: messages
+  }, children)));
+};
+
+exports.FigureLicenseDialog = FigureLicenseDialog;

package/lib/Figure/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Figure", {
+  enumerable: true,
+  get: function get() {
+    return _Figure["default"];
+  }
+});
+Object.defineProperty(exports, "FigureCaption", {
+  enumerable: true,
+  get: function get() {
+    return _Figure.FigureCaption;
+  }
+});
+Object.defineProperty(exports, "FigureLicenseDialog", {
+  enumerable: true,
+  get: function get() {
+    return _FigureLicenseDialog.FigureLicenseDialog;
+  }
+});
+Object.defineProperty(exports, "FigureExpandButton", {
+  enumerable: true,
+  get: function get() {
+    return _FigureExpandButton.FigureExpandButton;
+  }
+});
+Object.defineProperty(exports, "FigureBylineExpandButton", {
+  enumerable: true,
+  get: function get() {
+    return _FigureBylineExpandButton.FigureBylineExpandButton;
+  }
+});
+
+var _Figure = _interopRequireWildcard(require("./Figure"));
+
+var _FigureLicenseDialog = require("./FigureLicenseDialog");
+
+var _FigureExpandButton = require("./FigureExpandButton");
+
+var _FigureBylineExpandButton = require("./FigureBylineExpandButton");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/lib/FileList/File.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactBemHelper = _interopRequireDefault(require("react-bem-helper"));
+
+var _common = require("@ndla/icons/common");
+
+var _safelink = _interopRequireDefault(require("@ndla/safelink"));
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var classes = (0, _reactBemHelper["default"])('c-file-list');
+
+var renderFormat = function renderFormat(format, title, isPrimary, id, isDeadLink) {
+  var titleWithFormat = "".concat(title, " (").concat(format.fileType.toUpperCase(), ")");
+  var formatId = "".concat(id, "_").concat(format.fileType);
+
+  if (isDeadLink) {
+    return (0, _core.jsx)("span", {
+      key: format.url
+    }, (0, _core.jsx)(_common.Download, null), (0, _core.jsx)("span", null, isPrimary ? titleWithFormat : "(".concat(format.fileType.toUpperCase(), ")")), (0, _core.jsx)("span", _extends({}, classes('tooltip'), {
+      "aria-hidden": true,
+      role: "tooltip",
+      id: formatId
+    }), (0, _core.jsx)("span", classes('tooltip-text'), format.tooltip)));
+  }
+
+  return (0, _core.jsx)(_safelink["default"], _extends({}, classes('link'), {
+    key: format.url,
+    to: format.url,
+    target: "_blank",
+    "aria-label": titleWithFormat,
+    "aria-describedby": formatId
+  }), (0, _core.jsx)(_common.Download, null), (0, _core.jsx)("span", classes('link-text'), (0, _core.jsx)("span", null, isPrimary ? titleWithFormat : "(".concat(format.fileType.toUpperCase(), ")"))), (0, _core.jsx)("span", _extends({}, classes('tooltip'), {
+    "aria-hidden": true,
+    role: "tooltip",
+    id: formatId
+  }), (0, _core.jsx)("span", classes('tooltip-text'), format.tooltip)));
+};
+
+var File = function File(_ref) {
+  var file = _ref.file,
+      id = _ref.id;
+  var formatLinks = file.formats.map(function (format, index) {
+    return renderFormat(format, file.title, index === 0, id, !file.fileExists);
+  });
+  return (0, _core.jsx)("li", _extends({}, classes('item'), {
+    key: file.title
+  }), formatLinks);
+};
+
+var _default = File;
+exports["default"] = _default;

package/lib/FileList/FileList.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactBemHelper = _interopRequireDefault(require("react-bem-helper"));
+
+var _File = _interopRequireDefault(require("./File"));
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var classes = (0, _reactBemHelper["default"])('c-file-list');
+
+var FileList = function FileList(_ref) {
+  var files = _ref.files,
+      heading = _ref.heading,
+      id = _ref.id;
+  return (0, _core.jsx)("section", classes(), (0, _core.jsx)("h1", classes('heading'), heading), (0, _core.jsx)("ul", classes('files'), files.map(function (file) {
+    return (0, _core.jsx)(_File["default"], {
+      key: "file-".concat(id, "-").concat(file.title),
+      file: file,
+      id: id
+    });
+  })));
+};
+
+var _default = FileList;
+exports["default"] = _default;

package/lib/FileList/index.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "File", {
+  enumerable: true,
+  get: function get() {
+    return _File["default"];
+  }
+});
+exports["default"] = void 0;
+
+var _FileList = _interopRequireDefault(require("./FileList"));
+
+var _File = _interopRequireDefault(require("./File"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var _default = _FileList["default"];
+exports["default"] = _default;

package/lib/Hero/Hero.js

@@ -0,0 +1,100 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NdlaFilmHero = exports.SourceMaterialHero = exports.ExternalLearningResourcesHero = exports.SubjectHero = exports.AssessmentResourcesHero = exports.TasksAndActivitiesHero = exports.SubjectMaterialHero = exports.Hero = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactBemHelper = _interopRequireDefault(require("react-bem-helper"));
+
+var contentTypes = _interopRequireWildcard(require("../model/ContentType"));
+
+var _core = require("@emotion/core");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var classes = new _reactBemHelper["default"]({
+  name: 'hero',
+  prefix: 'c-'
+});
+
+var Hero = function Hero(_ref) {
+  var children = _ref.children,
+      contentType = _ref.contentType;
+  return (0, _core.jsx)("div", classes('', contentType), children || null);
+};
+
+exports.Hero = Hero;
+
+var SubjectMaterialHero = function SubjectMaterialHero(props) {
+  return (0, _core.jsx)(Hero, _extends({
+    contentType: contentTypes.SUBJECT_MATERIAL
+  }, props));
+};
+
+exports.SubjectMaterialHero = SubjectMaterialHero;
+
+var TasksAndActivitiesHero = function TasksAndActivitiesHero(props) {
+  return (0, _core.jsx)(Hero, _extends({
+    contentType: contentTypes.TASKS_AND_ACTIVITIES
+  }, props));
+};
+
+exports.TasksAndActivitiesHero = TasksAndActivitiesHero;
+
+var AssessmentResourcesHero = function AssessmentResourcesHero(props) {
+  return (0, _core.jsx)(Hero, _extends({
+    contentType: contentTypes.ASSESSMENT_RESOURCES
+  }, props));
+};
+
+exports.AssessmentResourcesHero = AssessmentResourcesHero;
+
+var SubjectHero = function SubjectHero(props) {
+  return (0, _core.jsx)(Hero, _extends({
+    contentType: contentTypes.SUBJECT
+  }, props));
+};
+
+exports.SubjectHero = SubjectHero;
+
+var ExternalLearningResourcesHero = function ExternalLearningResourcesHero(props) {
+  return (0, _core.jsx)(Hero, _extends({
+    contentType: contentTypes.EXTERNAL_LEARNING_RESOURCES
+  }, props));
+};
+
+exports.ExternalLearningResourcesHero = ExternalLearningResourcesHero;
+
+var SourceMaterialHero = function SourceMaterialHero(props) {
+  return (0, _core.jsx)(Hero, _extends({
+    contentType: contentTypes.SOURCE_MATERIAL
+  }, props));
+};
+
+exports.SourceMaterialHero = SourceMaterialHero;
+
+var NdlaFilmHero = function NdlaFilmHero(_ref2) {
+  var hasImage = _ref2.hasImage,
+      rest = _objectWithoutProperties(_ref2, ["hasImage"]);
+
+  return (0, _core.jsx)(Hero, _extends({}, rest, {
+    contentType: hasImage ? 'ndla-film has-image' : 'ndla-film'
+  }));
+};
+
+exports.NdlaFilmHero = NdlaFilmHero;

package/lib/Hero/index.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SubjectMaterialHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.SubjectMaterialHero;
+  }
+});
+Object.defineProperty(exports, "TasksAndActivitiesHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.TasksAndActivitiesHero;
+  }
+});
+Object.defineProperty(exports, "AssessmentResourcesHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.AssessmentResourcesHero;
+  }
+});
+Object.defineProperty(exports, "SubjectHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.SubjectHero;
+  }
+});
+Object.defineProperty(exports, "ExternalLearningResourcesHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.ExternalLearningResourcesHero;
+  }
+});
+Object.defineProperty(exports, "SourceMaterialHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.SourceMaterialHero;
+  }
+});
+Object.defineProperty(exports, "Hero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.Hero;
+  }
+});
+Object.defineProperty(exports, "NdlaFilmHero", {
+  enumerable: true,
+  get: function get() {
+    return _Hero.NdlaFilmHero;
+  }
+});
+
+var _Hero = require("./Hero");

package/lib/Image/Image.js

@@ -0,0 +1,105 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.makeSrcQueryString = void 0;
+
+var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defined = _interopRequireDefault(require("defined"));
+
+var _LazyLoadImage = _interopRequireDefault(require("./LazyLoadImage"));
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+var makeSrcQueryString = function makeSrcQueryString(width, crop, focalPoint) {
+  var widthParams = width && "width=".concat(width);
+  var cropParams = crop && "cropStartX=".concat(crop.startX, "&cropEndX=").concat(crop.endX, "&cropStartY=").concat(crop.startY, "&cropEndY=").concat(crop.endY);
+  var focalPointParams = focalPoint && "focalX=".concat(focalPoint.x, "&focalY=").concat(focalPoint.y);
+  var params = [widthParams, cropParams, focalPointParams].filter(function (p) {
+    return p;
+  }).join('&');
+  return params;
+};
+
+exports.makeSrcQueryString = makeSrcQueryString;
+
+var getSrcSet = function getSrcSet(src, crop, focalPoint) {
+  var widths = [2720, 2080, 1760, 1440, 1120, 1000, 960, 800, 640, 480, 320, 240, 180];
+  return widths.map(function (width) {
+    return "".concat(src, "?").concat(makeSrcQueryString(width, crop, focalPoint), " ").concat(width, "w");
+  }).join(', ');
+};
+
+var StyledImageWrapper = (0, _styledBase["default"])("div", {
+  target: "ejtxxex0",
+  label: "StyledImageWrapper"
+})(process.env.NODE_ENV === "production" ? {
+  name: "79elbk",
+  styles: "position:relative;"
+} : {
+  name: "79elbk",
+  styles: "position:relative;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2QnFDIiwiZmlsZSI6IkltYWdlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE3LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBkZWZpbmVkIGZyb20gJ2RlZmluZWQnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IExhenlMb2FkSW1hZ2UgZnJvbSAnLi9MYXp5TG9hZEltYWdlJztcbmltcG9ydCB7IEltYWdlQ3JvcCwgSW1hZ2VGb2NhbFBvaW50IH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5leHBvcnQgY29uc3QgbWFrZVNyY1F1ZXJ5U3RyaW5nID0gKHdpZHRoOiBudW1iZXIgfCB1bmRlZmluZWQsIGNyb3A/OiBJbWFnZUNyb3AsIGZvY2FsUG9pbnQ/OiBJbWFnZUZvY2FsUG9pbnQpID0+IHtcbiAgY29uc3Qgd2lkdGhQYXJhbXMgPSB3aWR0aCAmJiBgd2lkdGg9JHt3aWR0aH1gO1xuICBjb25zdCBjcm9wUGFyYW1zID1cbiAgICBjcm9wICYmIGBjcm9wU3RhcnRYPSR7Y3JvcC5zdGFydFh9JmNyb3BFbmRYPSR7Y3JvcC5lbmRYfSZjcm9wU3RhcnRZPSR7Y3JvcC5zdGFydFl9JmNyb3BFbmRZPSR7Y3JvcC5lbmRZfWA7XG4gIGNvbnN0IGZvY2FsUG9pbnRQYXJhbXMgPSBmb2NhbFBvaW50ICYmIGBmb2NhbFg9JHtmb2NhbFBvaW50Lnh9JmZvY2FsWT0ke2ZvY2FsUG9pbnQueX1gO1xuICBjb25zdCBwYXJhbXMgPSBbd2lkdGhQYXJhbXMsIGNyb3BQYXJhbXMsIGZvY2FsUG9pbnRQYXJhbXNdLmZpbHRlcigocCkgPT4gcCkuam9pbignJicpO1xuXG4gIHJldHVybiBwYXJhbXM7XG59O1xuXG5jb25zdCBnZXRTcmNTZXQgPSAoc3JjOiBzdHJpbmcsIGNyb3A6IEltYWdlQ3JvcCB8IHVuZGVmaW5lZCwgZm9jYWxQb2ludDogSW1hZ2VGb2NhbFBvaW50IHwgdW5kZWZpbmVkKSA9PiB7XG4gIGNvbnN0IHdpZHRocyA9IFsyNzIwLCAyMDgwLCAxNzYwLCAxNDQwLCAxMTIwLCAxMDAwLCA5NjAsIDgwMCwgNjQwLCA0ODAsIDMyMCwgMjQwLCAxODBdO1xuICByZXR1cm4gd2lkdGhzLm1hcCgod2lkdGgpID0+IGAke3NyY30/JHttYWtlU3JjUXVlcnlTdHJpbmcod2lkdGgsIGNyb3AsIGZvY2FsUG9pbnQpfSAke3dpZHRofXdgKS5qb2luKCcsICcpO1xufTtcblxuY29uc3QgU3R5bGVkSW1hZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuYDtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgYWx0OiBzdHJpbmc7XG4gIHNyYzogc3RyaW5nO1xuICBzaXplcz86IHN0cmluZztcbiAgZmFsbGJhY2tXaWR0aD86IG51bWJlcjtcbiAgY29udGVudFR5cGU/OiBzdHJpbmc7XG4gIHNyY1NldD86IHN0cmluZztcbiAgbGF6eUxvYWQ/OiBib29sZWFuO1xuICBsYXp5TG9hZFNyYz86IHN0cmluZztcbiAgZXhwYW5kQnV0dG9uPzogUmVhY3ROb2RlO1xuICBjcm9wPzogSW1hZ2VDcm9wO1xuICBmb2NhbFBvaW50PzogSW1hZ2VGb2NhbFBvaW50O1xufVxuXG5jb25zdCBJbWFnZSA9ICh7XG4gIGFsdCxcbiAgc3JjLFxuICBsYXp5TG9hZCxcbiAgbGF6eUxvYWRTcmMsXG4gIGNyb3AsXG4gIGZvY2FsUG9pbnQsXG4gIGNvbnRlbnRUeXBlLFxuICBzaXplcyA9ICcobWluLXdpZHRoOiAxMDI0cHgpIDEwMjRweCwgMTAwdncnLFxuICBleHBhbmRCdXR0b24sXG4gIC4uLnJlc3Rcbn06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHNyY1NldCA9IGRlZmluZWQocmVzdC5zcmNTZXQsIGdldFNyY1NldChzcmMsIGNyb3AsIGZvY2FsUG9pbnQpKTtcbiAgY29uc3QgZmFsbGJhY2tXaWR0aCA9IGRlZmluZWQocmVzdC5mYWxsYmFja1dpZHRoLCAxMDI0KTtcbiAgY29uc3QgcXVlcnlTdHJpbmcgPSBtYWtlU3JjUXVlcnlTdHJpbmcoZmFsbGJhY2tXaWR0aCwgY3JvcCwgZm9jYWxQb2ludCk7XG5cbiAgaWYgKGNvbnRlbnRUeXBlICYmIGNvbnRlbnRUeXBlID09PSAnaW1hZ2UvZ2lmJykge1xuICAgIHJldHVybiAoXG4gICAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICAgICA8aW1nIGFsdD17YWx0fSBzcmM9e2Ake3NyY31gfSB7Li4ucmVzdH0gLz5cbiAgICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICk7XG4gIH1cblxuICBpZiAobGF6eUxvYWQpIHtcbiAgICByZXR1cm4gKFxuICAgICAgPFN0eWxlZEltYWdlV3JhcHBlcj5cbiAgICAgICAgPExhenlMb2FkSW1hZ2VcbiAgICAgICAgICBhbHQ9e2FsdH1cbiAgICAgICAgICBzcmM9e2Ake3NyY30/JHtxdWVyeVN0cmluZ31gfVxuICAgICAgICAgIHNyY1NldD17c3JjU2V0fVxuICAgICAgICAgIHNpemVzPXtzaXplc31cbiAgICAgICAgICBsYXp5TG9hZFNyYz17bGF6eUxvYWRTcmN9XG4gICAgICAgIC8+XG4gICAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgICApO1xuICB9XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICAgPHBpY3R1cmU+XG4gICAgICAgIDxzb3VyY2UgdHlwZT17Y29udGVudFR5cGV9IHNyY1NldD17c3JjU2V0fSBzaXplcz17c2l6ZXN9IC8+XG4gICAgICAgIDxpbWcgYWx0PXthbHR9IHNyYz17YCR7c3JjfT8ke3F1ZXJ5U3RyaW5nfWB9IHsuLi5yZXN0fSAvPlxuICAgICAgPC9waWN0dXJlPlxuICAgICAge2V4cGFuZEJ1dHRvbn1cbiAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEltYWdlO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+var Image = function Image(_ref) {
+  var alt = _ref.alt,
+      src = _ref.src,
+      lazyLoad = _ref.lazyLoad,
+      lazyLoadSrc = _ref.lazyLoadSrc,
+      crop = _ref.crop,
+      focalPoint = _ref.focalPoint,
+      contentType = _ref.contentType,
+      _ref$sizes = _ref.sizes,
+      sizes = _ref$sizes === void 0 ? '(min-width: 1024px) 1024px, 100vw' : _ref$sizes,
+      expandButton = _ref.expandButton,
+      rest = _objectWithoutProperties(_ref, ["alt", "src", "lazyLoad", "lazyLoadSrc", "crop", "focalPoint", "contentType", "sizes", "expandButton"]);
+
+  var srcSet = (0, _defined["default"])(rest.srcSet, getSrcSet(src, crop, focalPoint));
+  var fallbackWidth = (0, _defined["default"])(rest.fallbackWidth, 1024);
+  var queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
+
+  if (contentType && contentType === 'image/gif') {
+    return (0, _core.jsx)(StyledImageWrapper, null, (0, _core.jsx)("img", _extends({
+      alt: alt,
+      src: "".concat(src)
+    }, rest)));
+  }
+
+  if (lazyLoad) {
+    return (0, _core.jsx)(StyledImageWrapper, null, (0, _core.jsx)(_LazyLoadImage["default"], {
+      alt: alt,
+      src: "".concat(src, "?").concat(queryString),
+      srcSet: srcSet,
+      sizes: sizes,
+      lazyLoadSrc: lazyLoadSrc
+    }));
+  }
+
+  return (0, _core.jsx)(StyledImageWrapper, null, (0, _core.jsx)("picture", null, (0, _core.jsx)("source", {
+    type: contentType,
+    srcSet: srcSet,
+    sizes: sizes
+  }), (0, _core.jsx)("img", _extends({
+    alt: alt,
+    src: "".concat(src, "?").concat(queryString)
+  }, rest))), expandButton);
+};
+
+var _default = Image;
+exports["default"] = _default;

package/lib/Image/ImageLink.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ImageLink = ImageLink;
+
+var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Image = require("./Image");
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+var StyledLink = (0, _styledBase["default"])("a", {
+  target: "eo3pjlm0",
+  label: "StyledLink"
+})(process.env.NODE_ENV === "production" ? {
+  name: "17viinn",
+  styles: "box-shadow:inset 0 0;"
+} : {
+  name: "17viinn",
+  styles: "box-shadow:inset 0 0;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkltYWdlTGluay50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBYTJCIiwiZmlsZSI6IkltYWdlTGluay50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxOS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBtYWtlU3JjUXVlcnlTdHJpbmcgfSBmcm9tICcuL0ltYWdlJztcbmltcG9ydCB7IEltYWdlQ3JvcCwgSW1hZ2VGb2NhbFBvaW50IH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5jb25zdCBTdHlsZWRMaW5rID0gc3R5bGVkLmFgXG4gIGJveC1zaGFkb3c6IGluc2V0IDAgMDtcbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIHNyYzogc3RyaW5nO1xuICBjaGlsZHJlbjogUmVhY3ROb2RlO1xuICBzaXplcz86IHN0cmluZztcbiAgY3JvcD86IEltYWdlQ3JvcDtcbiAgZm9jYWxQb2ludD86IEltYWdlRm9jYWxQb2ludDtcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIEltYWdlTGluayh7IHNyYywgY3JvcCwgY2hpbGRyZW4sIC4uLnJlc3QgfTogUHJvcHMpIHtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkTGlua1xuICAgICAgdGFyZ2V0PVwiX2JsYW5rXCJcbiAgICAgIGhyZWY9e2Ake3NyY30/JHttYWtlU3JjUXVlcnlTdHJpbmcodW5kZWZpbmVkLCBjcm9wKX1gfVxuICAgICAgcmVsPVwibm9vcGVuZXIgbm9yZWZlcnJlclwiXG4gICAgICB7Li4ucmVzdH0+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgPC9TdHlsZWRMaW5rPlxuICApO1xufVxuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+function ImageLink(_ref) {
+  var src = _ref.src,
+      crop = _ref.crop,
+      children = _ref.children,
+      rest = _objectWithoutProperties(_ref, ["src", "crop", "children"]);
+
+  return (0, _core.jsx)(StyledLink, _extends({
+    target: "_blank",
+    href: "".concat(src, "?").concat((0, _Image.makeSrcQueryString)(undefined, crop)),
+    rel: "noopener noreferrer"
+  }, rest), children);
+}

package/lib/Image/LazyLoadImage.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@emotion/core");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+// Lazyload image with lazysizes (https://github.com/aFarkas/lazysizes)
+var LazyLoadImage = function LazyLoadImage(_ref) {
+  var alt = _ref.alt,
+      src = _ref.src,
+      srcSet = _ref.srcSet,
+      lazyLoadSrc = _ref.lazyLoadSrc,
+      sizes = _ref.sizes,
+      rest = _objectWithoutProperties(_ref, ["alt", "src", "srcSet", "lazyLoadSrc", "sizes"]);
+
+  return (0, _core.jsx)(_react["default"].Fragment, null, (0, _core.jsx)("noscript", {
+    key: "noscript"
+  }, (0, _core.jsx)("img", _extends({
+    alt: alt,
+    src: "".concat(src),
+    srcSet: srcSet,
+    sizes: sizes
+  }, rest))), ",", (0, _core.jsx)("img", _extends({
+    alt: alt,
+    key: "img",
+    style: {
+      width: '100%'
+    },
+    className: "lazyload",
+    src: lazyLoadSrc,
+    "data-src": src,
+    "data-src-set": srcSet,
+    "data-sizes": sizes
+  }, rest)));
+};
+
+var _default = LazyLoadImage;
+exports["default"] = _default;