@ndla/ui 41.2.5 → 41.3.0

package/lib/Hero/Hero.js

@@ -1,18 +1,17 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TasksAndActivitiesHero = exports.SubjectMaterialHero = exports.SubjectHero = exports.SourceMaterialHero = exports.NdlaFilmHero = exports.Hero = exports.ExternalLearningResourcesHero = exports.AssessmentResourcesHero = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
-var _reactBemHelper = _interopRequireDefault(require("react-bem-helper"));
-var contentTypes = _interopRequireWildcard(require("../model/ContentType"));
+var _core = require("@ndla/core");
+var _ContentType = require("../model/ContentType");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _excluded = ["hasImage"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -26,51 +25,60 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input ==
                                                                                                                                                                                                                                                                                                                                                                                                * LICENSE file in the root directory of this source tree.
                                                                                                                                                                                                                                                                                                                                                                                                *
                                                                                                                                                                                                                                                                                                                                                                                                */
-var classes = new _reactBemHelper.default({
-  name: 'hero',
-  prefix: 'c-'
-});
+var StyledDiv = /*#__PURE__*/(0, _base.default)("div", {
+  target: "e5tcv8a0",
+  label: "StyledDiv"
+})("background-repeat:repeat;background-size:", _core.spacing.normal, ";background-color:", _core.colors.brand.greyLightest, ";", _core.mq.range({
+  from: _core.breakpoints.tablet
+}), "{min-height:246px;padding-bottom:", _core.spacingUnit * 6.5, "px;}&[data-contenttype='subject-material']{background-color:", _core.colors.subjectMaterial.light, ";}&[data-contenttype='tasks-and-activities']{background-color:", _core.colors.tasksAndActivities.background, ";}&[data-contenttype='assessment-resources']{background-color:", _core.colors.assessmentResource.background, ";}&[data-contenttype='subject']{background-color:", _core.colors.subject.light, ";}&[data-contenttype='external-learning-resources']{background-color:", _core.colors.externalLearningResource.background, ";}&[data-contenttype='source-material']{background-color:", _core.colors.sourceMaterial.light, ";}&[data-contenttype='beta']{background-color:", _core.colors.brand.primary, ";}&[data-contenttype='ndla-film has-image'],&[data-contenttype='ndla-film']{background:", _core.colors.ndlaFilm.filmColor, ";", _core.mq.range({
+  from: _core.breakpoints.tablet
+}), "{height:2000px;margin-bottom:-1910px;}&[data-contenttype='ndla-film has-image']{", _core.mq.range({
+  from: _core.breakpoints.tablet
+}), "{margin-bottom:-1800px;@media (min-height: 720px){margin-bottom:-1750px;}@media (min-height: 1020px){margin-bottom:-1700px;}}}", _core.mq.range({
+  until: _core.breakpoints.tablet
+}), "{+div article.c-article{margin-left:-", _core.spacing.normal, ";margin-right:-", _core.spacing.normal, ";margin-top:0;background:", _core.colors.white, ";padding-left:", _core.spacing.normal, ";padding-right:", _core.spacing.normal, ";padding-top:", _core.spacing.large, ";}}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkhlcm8udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9CNEIiLCJmaWxlIjoiSGVyby50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxNi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyBIVE1MQXR0cmlidXRlcywgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgYnJlYWtwb2ludHMsIGNvbG9ycywgbXEsIHNwYWNpbmcsIHNwYWNpbmdVbml0IH0gZnJvbSAnQG5kbGEvY29yZSc7XG5pbXBvcnQge1xuICBBU1NFU1NNRU5UX1JFU09VUkNFUyxcbiAgRVhURVJOQUxfTEVBUk5JTkdfUkVTT1VSQ0VTLFxuICBTT1VSQ0VfTUFURVJJQUwsXG4gIFNVQkpFQ1QsXG4gIFNVQkpFQ1RfTUFURVJJQUwsXG4gIFRBU0tTX0FORF9BQ1RJVklUSUVTLFxufSBmcm9tICcuLi9tb2RlbC9Db250ZW50VHlwZSc7XG5cbmNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXZgXG4gIGJhY2tncm91bmQtcmVwZWF0OiByZXBlYXQ7XG4gIGJhY2tncm91bmQtc2l6ZTogJHtzcGFjaW5nLm5vcm1hbH07XG4gIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodGVzdH07XG5cbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgIG1pbi1oZWlnaHQ6IDI0NnB4O1xuICAgIHBhZGRpbmctYm90dG9tOiAke3NwYWNpbmdVbml0ICogNi41fXB4O1xuICB9XG5cbiAgJltkYXRhLWNvbnRlbnR0eXBlPSdzdWJqZWN0LW1hdGVyaWFsJ10ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLnN1YmplY3RNYXRlcmlhbC5saWdodH07XG4gIH1cblxuICAmW2RhdGEtY29udGVudHR5cGU9J3Rhc2tzLWFuZC1hY3Rpdml0aWVzJ10ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLnRhc2tzQW5kQWN0aXZpdGllcy5iYWNrZ3JvdW5kfTtcbiAgfVxuXG4gICZbZGF0YS1jb250ZW50dHlwZT0nYXNzZXNzbWVudC1yZXNvdXJjZXMnXSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtjb2xvcnMuYXNzZXNzbWVudFJlc291cmNlLmJhY2tncm91bmR9O1xuICB9XG5cbiAgJltkYXRhLWNvbnRlbnR0eXBlPSdzdWJqZWN0J10ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLnN1YmplY3QubGlnaHR9O1xuICB9XG5cbiAgJltkYXRhLWNvbnRlbnR0eXBlPSdleHRlcm5hbC1sZWFybmluZy1yZXNvdXJjZXMnXSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtjb2xvcnMuZXh0ZXJuYWxMZWFybmluZ1Jlc291cmNlLmJhY2tncm91bmR9O1xuICB9XG5cbiAgJltkYXRhLWNvbnRlbnR0eXBlPSdzb3VyY2UtbWF0ZXJpYWwnXSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtjb2xvcnMuc291cmNlTWF0ZXJpYWwubGlnaHR9O1xuICB9XG5cbiAgJltkYXRhLWNvbnRlbnR0eXBlPSdiZXRhJ10ge1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y29sb3JzLmJyYW5kLnByaW1hcnl9O1xuICB9XG5cbiAgJltkYXRhLWNvbnRlbnR0eXBlPSduZGxhLWZpbG0gaGFzLWltYWdlJ10sXG4gICZbZGF0YS1jb250ZW50dHlwZT0nbmRsYS1maWxtJ10ge1xuICAgIGJhY2tncm91bmQ6ICR7Y29sb3JzLm5kbGFGaWxtLmZpbG1Db2xvcn07XG5cbiAgICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0IH0pfSB7XG4gICAgICBoZWlnaHQ6IDIwMDBweDtcbiAgICAgIG1hcmdpbi1ib3R0b206IC0xOTEwcHg7XG4gICAgfVxuXG4gICAgJltkYXRhLWNvbnRlbnR0eXBlPSduZGxhLWZpbG0gaGFzLWltYWdlJ10ge1xuICAgICAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgICAgICBtYXJnaW4tYm90dG9tOiAtMTgwMHB4O1xuICAgICAgICBAbWVkaWEgKG1pbi1oZWlnaHQ6IDcyMHB4KSB7XG4gICAgICAgICAgbWFyZ2luLWJvdHRvbTogLTE3NTBweDtcbiAgICAgICAgfVxuICAgICAgICBAbWVkaWEgKG1pbi1oZWlnaHQ6IDEwMjBweCkge1xuICAgICAgICAgIG1hcmdpbi1ib3R0b206IC0xNzAwcHg7XG4gICAgICAgIH1cbiAgICAgIH1cbiAgICB9XG5cbiAgICAke21xLnJhbmdlKHsgdW50aWw6IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgICAgKyBkaXYgYXJ0aWNsZS5jLWFydGljbGUge1xuICAgICAgICBtYXJnaW4tbGVmdDogLSR7c3BhY2luZy5ub3JtYWx9O1xuICAgICAgICBtYXJnaW4tcmlnaHQ6IC0ke3NwYWNpbmcubm9ybWFsfTtcbiAgICAgICAgbWFyZ2luLXRvcDogMDtcbiAgICAgICAgYmFja2dyb3VuZDogJHtjb2xvcnMud2hpdGV9O1xuICAgICAgICBwYWRkaW5nLWxlZnQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICAgICAgICBwYWRkaW5nLXJpZ2h0OiAke3NwYWNpbmcubm9ybWFsfTtcbiAgICAgICAgcGFkZGluZy10b3A6ICR7c3BhY2luZy5sYXJnZX07XG4gICAgICB9XG4gICAgfVxuICB9XG5gO1xuXG5leHBvcnQgdHlwZSBIZXJvQ29udGVudFR5cGUgPVxuICB8ICdzdWJqZWN0LW1hdGVyaWFsJ1xuICB8ICd0YXNrcy1hbmQtYWN0aXZpdGllcydcbiAgfCAnYXNzZXNzbWVudC1yZXNvdXJjZXMnXG4gIHwgJ3N1YmplY3QnXG4gIHwgJ2V4dGVybmFsLWxlYXJuaW5nLXJlc291cmNlcydcbiAgfCAnc291cmNlLW1hdGVyaWFsJ1xuICB8ICdsZWFybmluZy1wYXRoJ1xuICB8ICd0b3BpYydcbiAgfCAnYmV0YSdcbiAgfCAnbmRsYS1maWxtJ1xuICB8ICduZGxhLWZpbG0gaGFzLWltYWdlJ1xuICB8ICdmcm9udHBhZ2UtYXJ0aWNsZSc7XG5cbmludGVyZmFjZSBIZXJvUHJvcHMgZXh0ZW5kcyBIVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4ge1xuICBjb250ZW50VHlwZT86IEhlcm9Db250ZW50VHlwZTtcbn1cblxuZXhwb3J0IGNvbnN0IEhlcm8gPSAoeyBjaGlsZHJlbiwgY29udGVudFR5cGUgfTogSGVyb1Byb3BzKSA9PiAoXG4gIDxTdHlsZWREaXYgZGF0YS1jb250ZW50dHlwZT17Y29udGVudFR5cGV9PntjaGlsZHJlbiB8fCBudWxsfTwvU3R5bGVkRGl2PlxuKTtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgY2hpbGRyZW4/OiBSZWFjdE5vZGU7XG4gIGhhc0ltYWdlPzogYm9vbGVhbjtcbn1cbmV4cG9ydCBjb25zdCBTdWJqZWN0TWF0ZXJpYWxIZXJvID0gKHByb3BzOiBQcm9wcykgPT4gPEhlcm8gY29udGVudFR5cGU9e1NVQkpFQ1RfTUFURVJJQUx9IHsuLi5wcm9wc30gLz47XG5leHBvcnQgY29uc3QgVGFza3NBbmRBY3Rpdml0aWVzSGVybyA9IChwcm9wczogUHJvcHMpID0+IDxIZXJvIGNvbnRlbnRUeXBlPXtUQVNLU19BTkRfQUNUSVZJVElFU30gey4uLnByb3BzfSAvPjtcbmV4cG9ydCBjb25zdCBBc3Nlc3NtZW50UmVzb3VyY2VzSGVybyA9IChwcm9wczogUHJvcHMpID0+IDxIZXJvIGNvbnRlbnRUeXBlPXtBU1NFU1NNRU5UX1JFU09VUkNFU30gey4uLnByb3BzfSAvPjtcbmV4cG9ydCBjb25zdCBTdWJqZWN0SGVybyA9IChwcm9wczogUHJvcHMpID0+IDxIZXJvIGNvbnRlbnRUeXBlPXtTVUJKRUNUfSB7Li4ucHJvcHN9IC8+O1xuZXhwb3J0IGNvbnN0IEV4dGVybmFsTGVhcm5pbmdSZXNvdXJjZXNIZXJvID0gKHByb3BzOiBQcm9wcykgPT4gKFxuICA8SGVybyBjb250ZW50VHlwZT17RVhURVJOQUxfTEVBUk5JTkdfUkVTT1VSQ0VTfSB7Li4ucHJvcHN9IC8+XG4pO1xuZXhwb3J0IGNvbnN0IFNvdXJjZU1hdGVyaWFsSGVybyA9IChwcm9wczogUHJvcHMpID0+IDxIZXJvIGNvbnRlbnRUeXBlPXtTT1VSQ0VfTUFURVJJQUx9IHsuLi5wcm9wc30gLz47XG5leHBvcnQgY29uc3QgTmRsYUZpbG1IZXJvID0gKHsgaGFzSW1hZ2UsIC4uLnJlc3QgfTogUHJvcHMpID0+IChcbiAgPEhlcm8gey4uLnJlc3R9IGNvbnRlbnRUeXBlPXtoYXNJbWFnZSA/ICduZGxhLWZpbG0gaGFzLWltYWdlJyA6ICduZGxhLWZpbG0nfSAvPlxuKTtcbiJdfQ== */"));
 var Hero = function Hero(_ref) {
   var children = _ref.children,
     contentType = _ref.contentType;
-  return (0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, classes('', contentType)), {}, {
+  return (0, _jsxRuntime.jsx)(StyledDiv, {
+    "data-contenttype": contentType,
     children: children || null
-  }));
+  });
 };
 exports.Hero = Hero;
 var SubjectMaterialHero = function SubjectMaterialHero(props) {
   return (0, _jsxRuntime.jsx)(Hero, _objectSpread({
-    contentType: contentTypes.SUBJECT_MATERIAL
+    contentType: _ContentType.SUBJECT_MATERIAL
   }, props));
 };
 exports.SubjectMaterialHero = SubjectMaterialHero;
 var TasksAndActivitiesHero = function TasksAndActivitiesHero(props) {
   return (0, _jsxRuntime.jsx)(Hero, _objectSpread({
-    contentType: contentTypes.TASKS_AND_ACTIVITIES
+    contentType: _ContentType.TASKS_AND_ACTIVITIES
   }, props));
 };
 exports.TasksAndActivitiesHero = TasksAndActivitiesHero;
 var AssessmentResourcesHero = function AssessmentResourcesHero(props) {
   return (0, _jsxRuntime.jsx)(Hero, _objectSpread({
-    contentType: contentTypes.ASSESSMENT_RESOURCES
+    contentType: _ContentType.ASSESSMENT_RESOURCES
   }, props));
 };
 exports.AssessmentResourcesHero = AssessmentResourcesHero;
 var SubjectHero = function SubjectHero(props) {
   return (0, _jsxRuntime.jsx)(Hero, _objectSpread({
-    contentType: contentTypes.SUBJECT
+    contentType: _ContentType.SUBJECT
   }, props));
 };
 exports.SubjectHero = SubjectHero;
 var ExternalLearningResourcesHero = function ExternalLearningResourcesHero(props) {
   return (0, _jsxRuntime.jsx)(Hero, _objectSpread({
-    contentType: contentTypes.EXTERNAL_LEARNING_RESOURCES
+    contentType: _ContentType.EXTERNAL_LEARNING_RESOURCES
   }, props));
 };
 exports.ExternalLearningResourcesHero = ExternalLearningResourcesHero;
 var SourceMaterialHero = function SourceMaterialHero(props) {
   return (0, _jsxRuntime.jsx)(Hero, _objectSpread({
-    contentType: contentTypes.SOURCE_MATERIAL
+    contentType: _ContentType.SOURCE_MATERIAL
   }, props));
 };
 exports.SourceMaterialHero = SourceMaterialHero;

package/lib/Hero/HeroContent.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) 2023-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+/// <reference types="react" />
+export declare const HeroContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/lib/Hero/HeroContent.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HeroContent = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _core = require("@ndla/core");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * Copyright (c) 2023-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+var HeroContent = /*#__PURE__*/(0, _base.default)("div", {
+  target: "ejq412a0",
+  label: "HeroContent"
+})("display:flex;flex-wrap:wrap;align-items:flex-end;padding:", _core.spacing.small, " 0 ", _core.spacing.small, ";z-index:9;", _core.mq.range({
+  from: _core.breakpoints.tablet
+}), "{min-height:90px;padding-bottom:", _core.spacing.xxsmall, ";&[data-image='true']{min-height:190px;@media (min-height: 720px){min-height:240px;}@media (min-height: 1020px){min-height:290px;}}}&[data-film='true']{.c-breadcrumb__item,.c-breadcrumb__item--home:after,a,a:focus,a:hover{color:#fff;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkhlcm9Db250ZW50LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXcUMiLCJmaWxlIjoiSGVyb0NvbnRlbnQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjMtcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBzcGFjaW5nLCBtcSwgYnJlYWtwb2ludHMgfSBmcm9tICdAbmRsYS9jb3JlJztcblxuZXhwb3J0IGNvbnN0IEhlcm9Db250ZW50ID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC13cmFwOiB3cmFwO1xuICBhbGlnbi1pdGVtczogZmxleC1lbmQ7XG4gIHBhZGRpbmc6ICR7c3BhY2luZy5zbWFsbH0gMCAke3NwYWNpbmcuc21hbGx9O1xuICB6LWluZGV4OiA5O1xuXG4gICR7bXEucmFuZ2UoeyBmcm9tOiBicmVha3BvaW50cy50YWJsZXQgfSl9IHtcbiAgICBtaW4taGVpZ2h0OiA5MHB4O1xuICAgIHBhZGRpbmctYm90dG9tOiAke3NwYWNpbmcueHhzbWFsbH07XG5cbiAgICAmW2RhdGEtaW1hZ2U9J3RydWUnXSB7XG4gICAgICBtaW4taGVpZ2h0OiAxOTBweDtcbiAgICAgIEBtZWRpYSAobWluLWhlaWdodDogNzIwcHgpIHtcbiAgICAgICAgbWluLWhlaWdodDogMjQwcHg7XG4gICAgICB9XG4gICAgICBAbWVkaWEgKG1pbi1oZWlnaHQ6IDEwMjBweCkge1xuICAgICAgICBtaW4taGVpZ2h0OiAyOTBweDtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAmW2RhdGEtZmlsbT0ndHJ1ZSddIHtcbiAgICAuYy1icmVhZGNydW1iX19pdGVtLFxuICAgIC5jLWJyZWFkY3J1bWJfX2l0ZW0tLWhvbWU6YWZ0ZXIsXG4gICAgYSxcbiAgICBhOmZvY3VzLFxuICAgIGE6aG92ZXIge1xuICAgICAgY29sb3I6ICNmZmY7XG4gICAgfVxuICB9XG5gO1xuIl19 */"));
+exports.HeroContent = HeroContent;

package/lib/Hero/index.d.ts

@@ -6,4 +6,5 @@
  *
  */
 export { SubjectMaterialHero, TasksAndActivitiesHero, AssessmentResourcesHero, SubjectHero, ExternalLearningResourcesHero, SourceMaterialHero, Hero, NdlaFilmHero, } from './Hero';
+export { HeroContent } from './HeroContent';
 export type { HeroContentType } from './Hero';

package/lib/Hero/index.js

@@ -21,6 +21,12 @@ Object.defineProperty(exports, "Hero", {
     return _Hero.Hero;
   }
 });
+Object.defineProperty(exports, "HeroContent", {
+  enumerable: true,
+  get: function get() {
+    return _HeroContent.HeroContent;
+  }
+});
 Object.defineProperty(exports, "NdlaFilmHero", {
   enumerable: true,
   get: function get() {
@@ -51,4 +57,5 @@ Object.defineProperty(exports, "TasksAndActivitiesHero", {
     return _Hero.TasksAndActivitiesHero;
   }
 });
-var _Hero = require("./Hero");
+var _Hero = require("./Hero");
+var _HeroContent = require("./HeroContent");

package/lib/Image/Image.d.ts

@@ -29,6 +29,7 @@ interface Props {
     expandButton?: ReactNode;
     crop?: ImageCrop;
     focalPoint?: ImageFocalPoint;
+    inGrid?: boolean;
 }
-declare const Image: ({ alt, src, lazyLoad, lazyLoadSrc, crop, focalPoint, contentType, sizes, expandButton, fallbackWidth, ...rest }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+declare const Image: ({ alt, src, lazyLoad, lazyLoadSrc, crop, focalPoint, contentType, sizes, expandButton, fallbackWidth, inGrid, ...rest }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default Image;

package/lib/Image/Image.js

@@ -7,10 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.makeSrcQueryString = exports.default = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
+var _core = require("@ndla/core");
 var _LazyLoadImage = _interopRequireDefault(require("./LazyLoadImage"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
-var _excluded = ["alt", "src", "lazyLoad", "lazyLoadSrc", "crop", "focalPoint", "contentType", "sizes", "expandButton", "fallbackWidth"];
+var _excluded = ["alt", "src", "lazyLoad", "lazyLoadSrc", "crop", "focalPoint", "contentType", "sizes", "expandButton", "fallbackWidth", "inGrid"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -42,45 +42,49 @@ var getSrcSet = function getSrcSet(src, crop, focalPoint) {
     return "".concat(src, "?").concat(makeSrcQueryString(width, crop, focalPoint), " ").concat(width, "w");
   }).join(', ');
 };
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "1u5anae-StyledImageWrapper",
-  styles: "display:flex justify-content:center;label:StyledImageWrapper;"
-} : {
-  name: "1u5anae-StyledImageWrapper",
-  styles: "display:flex justify-content:center;label:StyledImageWrapper;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpRFMiLCJmaWxlIjoiSW1hZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTctcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgUmVhY3QsIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IExhenlMb2FkSW1hZ2UgZnJvbSAnLi9MYXp5TG9hZEltYWdlJztcblxuZXhwb3J0IGludGVyZmFjZSBJbWFnZUNyb3Age1xuICBzdGFydFg6IG51bWJlcjtcbiAgc3RhcnRZOiBudW1iZXI7XG4gIGVuZFg6IG51bWJlcjtcbiAgZW5kWTogbnVtYmVyO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIEltYWdlRm9jYWxQb2ludCB7XG4gIHg6IG51bWJlcjtcbiAgeTogbnVtYmVyO1xufVxuXG5leHBvcnQgY29uc3QgbWFrZVNyY1F1ZXJ5U3RyaW5nID0gKHdpZHRoOiBudW1iZXIgfCB1bmRlZmluZWQsIGNyb3A/OiBJbWFnZUNyb3AsIGZvY2FsUG9pbnQ/OiBJbWFnZUZvY2FsUG9pbnQpID0+IHtcbiAgY29uc3Qgd2lkdGhQYXJhbXMgPSB3aWR0aCAmJiBgd2lkdGg9JHt3aWR0aH1gO1xuICBjb25zdCBjcm9wUGFyYW1zID1cbiAgICBjcm9wICYmIGBjcm9wU3RhcnRYPSR7Y3JvcC5zdGFydFh9JmNyb3BFbmRYPSR7Y3JvcC5lbmRYfSZjcm9wU3RhcnRZPSR7Y3JvcC5zdGFydFl9JmNyb3BFbmRZPSR7Y3JvcC5lbmRZfWA7XG4gIGNvbnN0IGZvY2FsUG9pbnRQYXJhbXMgPSBmb2NhbFBvaW50ICYmIGBmb2NhbFg9JHtmb2NhbFBvaW50Lnh9JmZvY2FsWT0ke2ZvY2FsUG9pbnQueX1gO1xuICBjb25zdCBwYXJhbXMgPSBbd2lkdGhQYXJhbXMsIGNyb3BQYXJhbXMsIGZvY2FsUG9pbnRQYXJhbXNdLmZpbHRlcigocCkgPT4gcCkuam9pbignJicpO1xuXG4gIHJldHVybiBwYXJhbXM7XG59O1xuXG5jb25zdCBnZXRTcmNTZXQgPSAoc3JjOiBzdHJpbmcsIGNyb3A6IEltYWdlQ3JvcCB8IHVuZGVmaW5lZCwgZm9jYWxQb2ludDogSW1hZ2VGb2NhbFBvaW50IHwgdW5kZWZpbmVkKSA9PiB7XG4gIGNvbnN0IHdpZHRocyA9IFsyNzIwLCAyMDgwLCAxNzYwLCAxNDQwLCAxMTIwLCAxMDAwLCA5NjAsIDgwMCwgNjQwLCA0ODAsIDMyMCwgMjQwLCAxODBdO1xuICByZXR1cm4gd2lkdGhzLm1hcCgod2lkdGgpID0+IGAke3NyY30/JHttYWtlU3JjUXVlcnlTdHJpbmcod2lkdGgsIGNyb3AsIGZvY2FsUG9pbnQpfSAke3dpZHRofXdgKS5qb2luKCcsICcpO1xufTtcblxuaW50ZXJmYWNlIFN0eWxlZEltYWdlV3JhcHBlclByb3BzIHtcbiAgc3ZnPzogYm9vbGVhbjtcbn1cblxuY29uc3QgU3R5bGVkSW1hZ2VXcmFwcGVyID0gc3R5bGVkLmRpdjxTdHlsZWRJbWFnZVdyYXBwZXJQcm9wcz5gXG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgJHsoeyBzdmcgfSkgPT4ge1xuICAgIHJldHVybiAoXG4gICAgICBzdmcgJiZcbiAgICAgIGNzc2BcbiAgICAgIGRpc3BsYXk6IGZsZXhcbiAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGBcbiAgICApO1xuICB9fVxuYDtcbmludGVyZmFjZSBQcm9wcyB7XG4gIGFsdDogc3RyaW5nO1xuICBzcmM6IHN0cmluZztcbiAgc2l6ZXM/OiBzdHJpbmc7XG4gIGZhbGxiYWNrV2lkdGg/OiBudW1iZXI7XG4gIGNvbnRlbnRUeXBlPzogc3RyaW5nO1xuICBzcmNTZXQ/OiBzdHJpbmc7XG4gIGxhenlMb2FkPzogYm9vbGVhbjtcbiAgbGF6eUxvYWRTcmM/OiBzdHJpbmc7XG4gIGV4cGFuZEJ1dHRvbj86IFJlYWN0Tm9kZTtcbiAgY3JvcD86IEltYWdlQ3JvcDtcbiAgZm9jYWxQb2ludD86IEltYWdlRm9jYWxQb2ludDtcbn1cblxuY29uc3QgSW1hZ2UgPSAoe1xuICBhbHQsXG4gIHNyYyxcbiAgbGF6eUxvYWQsXG4gIGxhenlMb2FkU3JjLFxuICBjcm9wLFxuICBmb2NhbFBvaW50LFxuICBjb250ZW50VHlwZSxcbiAgc2l6ZXMgPSAnKG1pbi13aWR0aDogMTAyNHB4KSAxMDI0cHgsIDEwMHZ3JyxcbiAgZXhwYW5kQnV0dG9uLFxuICBmYWxsYmFja1dpZHRoID0gMTAyNCxcbiAgLi4ucmVzdFxufTogUHJvcHMpID0+IHtcbiAgY29uc3Qgc3JjU2V0ID0gcmVzdC5zcmNTZXQgPz8gZ2V0U3JjU2V0KHNyYywgY3JvcCwgZm9jYWxQb2ludCk7XG4gIGNvbnN0IHF1ZXJ5U3RyaW5nID0gbWFrZVNyY1F1ZXJ5U3RyaW5nKGZhbGxiYWNrV2lkdGgsIGNyb3AsIGZvY2FsUG9pbnQpO1xuXG4gIGlmIChjb250ZW50VHlwZSAmJiBjb250ZW50VHlwZSA9PT0gJ2ltYWdlL2dpZicpIHtcbiAgICByZXR1cm4gKFxuICAgICAgPFN0eWxlZEltYWdlV3JhcHBlcj5cbiAgICAgICAgPGltZyBhbHQ9e2FsdH0gc3JjPXtgJHtzcmN9YH0gey4uLnJlc3R9IC8+XG4gICAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgICApO1xuICB9XG5cbiAgaWYgKGxhenlMb2FkKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRJbWFnZVdyYXBwZXI+XG4gICAgICAgIDxMYXp5TG9hZEltYWdlXG4gICAgICAgICAgYWx0PXthbHR9XG4gICAgICAgICAgc3JjPXtgJHtzcmN9PyR7cXVlcnlTdHJpbmd9YH1cbiAgICAgICAgICBzcmNTZXQ9e3NyY1NldH1cbiAgICAgICAgICBzaXplcz17c2l6ZXN9XG4gICAgICAgICAgbGF6eUxvYWRTcmM9e2xhenlMb2FkU3JjfVxuICAgICAgICAvPlxuICAgICAgPC9TdHlsZWRJbWFnZVdyYXBwZXI+XG4gICAgKTtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZEltYWdlV3JhcHBlciBzdmc9e2NvbnRlbnRUeXBlID09PSAnaW1hZ2Uvc3ZnK3htbCd9PlxuICAgICAgPHBpY3R1cmU+XG4gICAgICAgIDxzb3VyY2UgdHlwZT17Y29udGVudFR5cGV9IHNyY1NldD17c3JjU2V0fSBzaXplcz17c2l6ZXN9IC8+XG4gICAgICAgIDxpbWcgYWx0PXthbHR9IHNyYz17YCR7c3JjfT8ke3F1ZXJ5U3RyaW5nfWB9IHsuLi5yZXN0fSAvPlxuICAgICAgPC9waWN0dXJlPlxuICAgICAge2V4cGFuZEJ1dHRvbn1cbiAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEltYWdlO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
 var StyledImageWrapper = /*#__PURE__*/(0, _base.default)("div", {
-  target: "ejtxxex0",
+  target: "ejtxxex1",
   label: "StyledImageWrapper"
-})("position:relative;", function (_ref2) {
-  var svg = _ref2.svg;
-  return svg && _ref;
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QzhEIiwiZmlsZSI6IkltYWdlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE3LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBMYXp5TG9hZEltYWdlIGZyb20gJy4vTGF6eUxvYWRJbWFnZSc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSW1hZ2VDcm9wIHtcbiAgc3RhcnRYOiBudW1iZXI7XG4gIHN0YXJ0WTogbnVtYmVyO1xuICBlbmRYOiBudW1iZXI7XG4gIGVuZFk6IG51bWJlcjtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBJbWFnZUZvY2FsUG9pbnQge1xuICB4OiBudW1iZXI7XG4gIHk6IG51bWJlcjtcbn1cblxuZXhwb3J0IGNvbnN0IG1ha2VTcmNRdWVyeVN0cmluZyA9ICh3aWR0aDogbnVtYmVyIHwgdW5kZWZpbmVkLCBjcm9wPzogSW1hZ2VDcm9wLCBmb2NhbFBvaW50PzogSW1hZ2VGb2NhbFBvaW50KSA9PiB7XG4gIGNvbnN0IHdpZHRoUGFyYW1zID0gd2lkdGggJiYgYHdpZHRoPSR7d2lkdGh9YDtcbiAgY29uc3QgY3JvcFBhcmFtcyA9XG4gICAgY3JvcCAmJiBgY3JvcFN0YXJ0WD0ke2Nyb3Auc3RhcnRYfSZjcm9wRW5kWD0ke2Nyb3AuZW5kWH0mY3JvcFN0YXJ0WT0ke2Nyb3Auc3RhcnRZfSZjcm9wRW5kWT0ke2Nyb3AuZW5kWX1gO1xuICBjb25zdCBmb2NhbFBvaW50UGFyYW1zID0gZm9jYWxQb2ludCAmJiBgZm9jYWxYPSR7Zm9jYWxQb2ludC54fSZmb2NhbFk9JHtmb2NhbFBvaW50Lnl9YDtcbiAgY29uc3QgcGFyYW1zID0gW3dpZHRoUGFyYW1zLCBjcm9wUGFyYW1zLCBmb2NhbFBvaW50UGFyYW1zXS5maWx0ZXIoKHApID0+IHApLmpvaW4oJyYnKTtcblxuICByZXR1cm4gcGFyYW1zO1xufTtcblxuY29uc3QgZ2V0U3JjU2V0ID0gKHNyYzogc3RyaW5nLCBjcm9wOiBJbWFnZUNyb3AgfCB1bmRlZmluZWQsIGZvY2FsUG9pbnQ6IEltYWdlRm9jYWxQb2ludCB8IHVuZGVmaW5lZCkgPT4ge1xuICBjb25zdCB3aWR0aHMgPSBbMjcyMCwgMjA4MCwgMTc2MCwgMTQ0MCwgMTEyMCwgMTAwMCwgOTYwLCA4MDAsIDY0MCwgNDgwLCAzMjAsIDI0MCwgMTgwXTtcbiAgcmV0dXJuIHdpZHRocy5tYXAoKHdpZHRoKSA9PiBgJHtzcmN9PyR7bWFrZVNyY1F1ZXJ5U3RyaW5nKHdpZHRoLCBjcm9wLCBmb2NhbFBvaW50KX0gJHt3aWR0aH13YCkuam9pbignLCAnKTtcbn07XG5cbmludGVyZmFjZSBTdHlsZWRJbWFnZVdyYXBwZXJQcm9wcyB7XG4gIHN2Zz86IGJvb2xlYW47XG59XG5cbmNvbnN0IFN0eWxlZEltYWdlV3JhcHBlciA9IHN0eWxlZC5kaXY8U3R5bGVkSW1hZ2VXcmFwcGVyUHJvcHM+YFxuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICR7KHsgc3ZnIH0pID0+IHtcbiAgICByZXR1cm4gKFxuICAgICAgc3ZnICYmXG4gICAgICBjc3NgXG4gICAgICBkaXNwbGF5OiBmbGV4XG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBgXG4gICAgKTtcbiAgfX1cbmA7XG5pbnRlcmZhY2UgUHJvcHMge1xuICBhbHQ6IHN0cmluZztcbiAgc3JjOiBzdHJpbmc7XG4gIHNpemVzPzogc3RyaW5nO1xuICBmYWxsYmFja1dpZHRoPzogbnVtYmVyO1xuICBjb250ZW50VHlwZT86IHN0cmluZztcbiAgc3JjU2V0Pzogc3RyaW5nO1xuICBsYXp5TG9hZD86IGJvb2xlYW47XG4gIGxhenlMb2FkU3JjPzogc3RyaW5nO1xuICBleHBhbmRCdXR0b24/OiBSZWFjdE5vZGU7XG4gIGNyb3A/OiBJbWFnZUNyb3A7XG4gIGZvY2FsUG9pbnQ/OiBJbWFnZUZvY2FsUG9pbnQ7XG59XG5cbmNvbnN0IEltYWdlID0gKHtcbiAgYWx0LFxuICBzcmMsXG4gIGxhenlMb2FkLFxuICBsYXp5TG9hZFNyYyxcbiAgY3JvcCxcbiAgZm9jYWxQb2ludCxcbiAgY29udGVudFR5cGUsXG4gIHNpemVzID0gJyhtaW4td2lkdGg6IDEwMjRweCkgMTAyNHB4LCAxMDB2dycsXG4gIGV4cGFuZEJ1dHRvbixcbiAgZmFsbGJhY2tXaWR0aCA9IDEwMjQsXG4gIC4uLnJlc3Rcbn06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHNyY1NldCA9IHJlc3Quc3JjU2V0ID8/IGdldFNyY1NldChzcmMsIGNyb3AsIGZvY2FsUG9pbnQpO1xuICBjb25zdCBxdWVyeVN0cmluZyA9IG1ha2VTcmNRdWVyeVN0cmluZyhmYWxsYmFja1dpZHRoLCBjcm9wLCBmb2NhbFBvaW50KTtcblxuICBpZiAoY29udGVudFR5cGUgJiYgY29udGVudFR5cGUgPT09ICdpbWFnZS9naWYnKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRJbWFnZVdyYXBwZXI+XG4gICAgICAgIDxpbWcgYWx0PXthbHR9IHNyYz17YCR7c3JjfWB9IHsuLi5yZXN0fSAvPlxuICAgICAgPC9TdHlsZWRJbWFnZVdyYXBwZXI+XG4gICAgKTtcbiAgfVxuXG4gIGlmIChsYXp5TG9hZCkge1xuICAgIHJldHVybiAoXG4gICAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICAgICA8TGF6eUxvYWRJbWFnZVxuICAgICAgICAgIGFsdD17YWx0fVxuICAgICAgICAgIHNyYz17YCR7c3JjfT8ke3F1ZXJ5U3RyaW5nfWB9XG4gICAgICAgICAgc3JjU2V0PXtzcmNTZXR9XG4gICAgICAgICAgc2l6ZXM9e3NpemVzfVxuICAgICAgICAgIGxhenlMb2FkU3JjPXtsYXp5TG9hZFNyY31cbiAgICAgICAgLz5cbiAgICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICk7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRJbWFnZVdyYXBwZXIgc3ZnPXtjb250ZW50VHlwZSA9PT0gJ2ltYWdlL3N2Zyt4bWwnfT5cbiAgICAgIDxwaWN0dXJlPlxuICAgICAgICA8c291cmNlIHR5cGU9e2NvbnRlbnRUeXBlfSBzcmNTZXQ9e3NyY1NldH0gc2l6ZXM9e3NpemVzfSAvPlxuICAgICAgICA8aW1nIGFsdD17YWx0fSBzcmM9e2Ake3NyY30/JHtxdWVyeVN0cmluZ31gfSB7Li4ucmVzdH0gLz5cbiAgICAgIDwvcGljdHVyZT5cbiAgICAgIHtleHBhbmRCdXR0b259XG4gICAgPC9TdHlsZWRJbWFnZVdyYXBwZXI+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBJbWFnZTtcbiJdfQ== */"));
-var Image = function Image(_ref3) {
+})("position:relative;&[data-svg='true']{display:flex;justify-content:center;}&[data-in-grid='true']{border:1px solid ", _core.colors.brand.tertiary, ";border-bottom:0;border-radius:4px;border-bottom-left-radius:0;border-bottom-right-radius:0;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3Q3FDIiwiZmlsZSI6IkltYWdlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE3LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNvbG9ycyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IExhenlMb2FkSW1hZ2UgZnJvbSAnLi9MYXp5TG9hZEltYWdlJztcblxuZXhwb3J0IGludGVyZmFjZSBJbWFnZUNyb3Age1xuICBzdGFydFg6IG51bWJlcjtcbiAgc3RhcnRZOiBudW1iZXI7XG4gIGVuZFg6IG51bWJlcjtcbiAgZW5kWTogbnVtYmVyO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIEltYWdlRm9jYWxQb2ludCB7XG4gIHg6IG51bWJlcjtcbiAgeTogbnVtYmVyO1xufVxuXG5leHBvcnQgY29uc3QgbWFrZVNyY1F1ZXJ5U3RyaW5nID0gKHdpZHRoOiBudW1iZXIgfCB1bmRlZmluZWQsIGNyb3A/OiBJbWFnZUNyb3AsIGZvY2FsUG9pbnQ/OiBJbWFnZUZvY2FsUG9pbnQpID0+IHtcbiAgY29uc3Qgd2lkdGhQYXJhbXMgPSB3aWR0aCAmJiBgd2lkdGg9JHt3aWR0aH1gO1xuICBjb25zdCBjcm9wUGFyYW1zID1cbiAgICBjcm9wICYmIGBjcm9wU3RhcnRYPSR7Y3JvcC5zdGFydFh9JmNyb3BFbmRYPSR7Y3JvcC5lbmRYfSZjcm9wU3RhcnRZPSR7Y3JvcC5zdGFydFl9JmNyb3BFbmRZPSR7Y3JvcC5lbmRZfWA7XG4gIGNvbnN0IGZvY2FsUG9pbnRQYXJhbXMgPSBmb2NhbFBvaW50ICYmIGBmb2NhbFg9JHtmb2NhbFBvaW50Lnh9JmZvY2FsWT0ke2ZvY2FsUG9pbnQueX1gO1xuICBjb25zdCBwYXJhbXMgPSBbd2lkdGhQYXJhbXMsIGNyb3BQYXJhbXMsIGZvY2FsUG9pbnRQYXJhbXNdLmZpbHRlcigocCkgPT4gcCkuam9pbignJicpO1xuXG4gIHJldHVybiBwYXJhbXM7XG59O1xuXG5jb25zdCBnZXRTcmNTZXQgPSAoc3JjOiBzdHJpbmcsIGNyb3A6IEltYWdlQ3JvcCB8IHVuZGVmaW5lZCwgZm9jYWxQb2ludDogSW1hZ2VGb2NhbFBvaW50IHwgdW5kZWZpbmVkKSA9PiB7XG4gIGNvbnN0IHdpZHRocyA9IFsyNzIwLCAyMDgwLCAxNzYwLCAxNDQwLCAxMTIwLCAxMDAwLCA5NjAsIDgwMCwgNjQwLCA0ODAsIDMyMCwgMjQwLCAxODBdO1xuICByZXR1cm4gd2lkdGhzLm1hcCgod2lkdGgpID0+IGAke3NyY30/JHttYWtlU3JjUXVlcnlTdHJpbmcod2lkdGgsIGNyb3AsIGZvY2FsUG9pbnQpfSAke3dpZHRofXdgKS5qb2luKCcsICcpO1xufTtcblxuY29uc3QgU3R5bGVkSW1hZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuXG4gICZbZGF0YS1zdmc9J3RydWUnXSB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgfVxuICAmW2RhdGEtaW4tZ3JpZD0ndHJ1ZSddIHtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC50ZXJ0aWFyeX07XG4gICAgYm9yZGVyLWJvdHRvbTogMDtcbiAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgYm9yZGVyLWJvdHRvbS1sZWZ0LXJhZGl1czogMDtcbiAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMDtcbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSW1hZ2UgPSBzdHlsZWQuaW1nYFxuICAmW2RhdGEtaW4tZ3JpZD0ndHJ1ZSddIHtcbiAgICBib3JkZXItcmFkaXVzOiAzcHg7XG4gICAgYm9yZGVyLWJvdHRvbS1sZWZ0LXJhZGl1czogMDtcbiAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMDtcbiAgfVxuYDtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgYWx0OiBzdHJpbmc7XG4gIHNyYzogc3RyaW5nO1xuICBzaXplcz86IHN0cmluZztcbiAgZmFsbGJhY2tXaWR0aD86IG51bWJlcjtcbiAgY29udGVudFR5cGU/OiBzdHJpbmc7XG4gIHNyY1NldD86IHN0cmluZztcbiAgbGF6eUxvYWQ/OiBib29sZWFuO1xuICBsYXp5TG9hZFNyYz86IHN0cmluZztcbiAgZXhwYW5kQnV0dG9uPzogUmVhY3ROb2RlO1xuICBjcm9wPzogSW1hZ2VDcm9wO1xuICBmb2NhbFBvaW50PzogSW1hZ2VGb2NhbFBvaW50O1xuICBpbkdyaWQ/OiBib29sZWFuO1xufVxuXG5jb25zdCBJbWFnZSA9ICh7XG4gIGFsdCxcbiAgc3JjLFxuICBsYXp5TG9hZCxcbiAgbGF6eUxvYWRTcmMsXG4gIGNyb3AsXG4gIGZvY2FsUG9pbnQsXG4gIGNvbnRlbnRUeXBlLFxuICBzaXplcyA9ICcobWluLXdpZHRoOiAxMDI0cHgpIDEwMjRweCwgMTAwdncnLFxuICBleHBhbmRCdXR0b24sXG4gIGZhbGxiYWNrV2lkdGggPSAxMDI0LFxuICBpbkdyaWQsXG4gIC4uLnJlc3Rcbn06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHNyY1NldCA9IHJlc3Quc3JjU2V0ID8/IGdldFNyY1NldChzcmMsIGNyb3AsIGZvY2FsUG9pbnQpO1xuICBjb25zdCBxdWVyeVN0cmluZyA9IG1ha2VTcmNRdWVyeVN0cmluZyhmYWxsYmFja1dpZHRoLCBjcm9wLCBmb2NhbFBvaW50KTtcblxuICBpZiAoY29udGVudFR5cGUgJiYgY29udGVudFR5cGUgPT09ICdpbWFnZS9naWYnKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRJbWFnZVdyYXBwZXIgZGF0YS1pbi1ncmlkPXtpbkdyaWR9PlxuICAgICAgICA8U3R5bGVkSW1hZ2UgYWx0PXthbHR9IHNyYz17YCR7c3JjfWB9IHsuLi5yZXN0fSBkYXRhLWluLWdyaWQ9e2luR3JpZH0gLz5cbiAgICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICk7XG4gIH1cblxuICBpZiAobGF6eUxvYWQpIHtcbiAgICByZXR1cm4gKFxuICAgICAgPFN0eWxlZEltYWdlV3JhcHBlcj5cbiAgICAgICAgPExhenlMb2FkSW1hZ2VcbiAgICAgICAgICBhbHQ9e2FsdH1cbiAgICAgICAgICBzcmM9e2Ake3NyY30/JHtxdWVyeVN0cmluZ31gfVxuICAgICAgICAgIHNyY1NldD17c3JjU2V0fVxuICAgICAgICAgIHNpemVzPXtzaXplc31cbiAgICAgICAgICBsYXp5TG9hZFNyYz17bGF6eUxvYWRTcmN9XG4gICAgICAgIC8+XG4gICAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgICApO1xuICB9XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyIGRhdGEtc3ZnPXtjb250ZW50VHlwZSA9PT0gJ2ltYWdlL3N2Zyt4bWwnfSBkYXRhLWluLWdyaWQ9e2luR3JpZH0+XG4gICAgICA8cGljdHVyZT5cbiAgICAgICAgPHNvdXJjZSB0eXBlPXtjb250ZW50VHlwZX0gc3JjU2V0PXtzcmNTZXR9IHNpemVzPXtzaXplc30gLz5cbiAgICAgICAgPFN0eWxlZEltYWdlIGFsdD17YWx0fSBzcmM9e2Ake3NyY30/JHtxdWVyeVN0cmluZ31gfSB7Li4ucmVzdH0gZGF0YS1pbi1ncmlkPXtpbkdyaWR9IC8+XG4gICAgICA8L3BpY3R1cmU+XG4gICAgICB7ZXhwYW5kQnV0dG9ufVxuICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgSW1hZ2U7XG4iXX0= */"));
+var StyledImage = /*#__PURE__*/(0, _base.default)("img", {
+  target: "ejtxxex0",
+  label: "StyledImage"
+})(process.env.NODE_ENV === "production" ? {
+  name: "m12tii",
+  styles: "&[data-in-grid='true']{border-radius:3px;border-bottom-left-radius:0;border-bottom-right-radius:0;}"
+} : {
+  name: "m12tii",
+  styles: "&[data-in-grid='true']{border-radius:3px;border-bottom-left-radius:0;border-bottom-right-radius:0;}",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3RDhCIiwiZmlsZSI6IkltYWdlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE3LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNvbG9ycyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IExhenlMb2FkSW1hZ2UgZnJvbSAnLi9MYXp5TG9hZEltYWdlJztcblxuZXhwb3J0IGludGVyZmFjZSBJbWFnZUNyb3Age1xuICBzdGFydFg6IG51bWJlcjtcbiAgc3RhcnRZOiBudW1iZXI7XG4gIGVuZFg6IG51bWJlcjtcbiAgZW5kWTogbnVtYmVyO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIEltYWdlRm9jYWxQb2ludCB7XG4gIHg6IG51bWJlcjtcbiAgeTogbnVtYmVyO1xufVxuXG5leHBvcnQgY29uc3QgbWFrZVNyY1F1ZXJ5U3RyaW5nID0gKHdpZHRoOiBudW1iZXIgfCB1bmRlZmluZWQsIGNyb3A/OiBJbWFnZUNyb3AsIGZvY2FsUG9pbnQ/OiBJbWFnZUZvY2FsUG9pbnQpID0+IHtcbiAgY29uc3Qgd2lkdGhQYXJhbXMgPSB3aWR0aCAmJiBgd2lkdGg9JHt3aWR0aH1gO1xuICBjb25zdCBjcm9wUGFyYW1zID1cbiAgICBjcm9wICYmIGBjcm9wU3RhcnRYPSR7Y3JvcC5zdGFydFh9JmNyb3BFbmRYPSR7Y3JvcC5lbmRYfSZjcm9wU3RhcnRZPSR7Y3JvcC5zdGFydFl9JmNyb3BFbmRZPSR7Y3JvcC5lbmRZfWA7XG4gIGNvbnN0IGZvY2FsUG9pbnRQYXJhbXMgPSBmb2NhbFBvaW50ICYmIGBmb2NhbFg9JHtmb2NhbFBvaW50Lnh9JmZvY2FsWT0ke2ZvY2FsUG9pbnQueX1gO1xuICBjb25zdCBwYXJhbXMgPSBbd2lkdGhQYXJhbXMsIGNyb3BQYXJhbXMsIGZvY2FsUG9pbnRQYXJhbXNdLmZpbHRlcigocCkgPT4gcCkuam9pbignJicpO1xuXG4gIHJldHVybiBwYXJhbXM7XG59O1xuXG5jb25zdCBnZXRTcmNTZXQgPSAoc3JjOiBzdHJpbmcsIGNyb3A6IEltYWdlQ3JvcCB8IHVuZGVmaW5lZCwgZm9jYWxQb2ludDogSW1hZ2VGb2NhbFBvaW50IHwgdW5kZWZpbmVkKSA9PiB7XG4gIGNvbnN0IHdpZHRocyA9IFsyNzIwLCAyMDgwLCAxNzYwLCAxNDQwLCAxMTIwLCAxMDAwLCA5NjAsIDgwMCwgNjQwLCA0ODAsIDMyMCwgMjQwLCAxODBdO1xuICByZXR1cm4gd2lkdGhzLm1hcCgod2lkdGgpID0+IGAke3NyY30/JHttYWtlU3JjUXVlcnlTdHJpbmcod2lkdGgsIGNyb3AsIGZvY2FsUG9pbnQpfSAke3dpZHRofXdgKS5qb2luKCcsICcpO1xufTtcblxuY29uc3QgU3R5bGVkSW1hZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuXG4gICZbZGF0YS1zdmc9J3RydWUnXSB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgfVxuICAmW2RhdGEtaW4tZ3JpZD0ndHJ1ZSddIHtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAke2NvbG9ycy5icmFuZC50ZXJ0aWFyeX07XG4gICAgYm9yZGVyLWJvdHRvbTogMDtcbiAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgYm9yZGVyLWJvdHRvbS1sZWZ0LXJhZGl1czogMDtcbiAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMDtcbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSW1hZ2UgPSBzdHlsZWQuaW1nYFxuICAmW2RhdGEtaW4tZ3JpZD0ndHJ1ZSddIHtcbiAgICBib3JkZXItcmFkaXVzOiAzcHg7XG4gICAgYm9yZGVyLWJvdHRvbS1sZWZ0LXJhZGl1czogMDtcbiAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMDtcbiAgfVxuYDtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgYWx0OiBzdHJpbmc7XG4gIHNyYzogc3RyaW5nO1xuICBzaXplcz86IHN0cmluZztcbiAgZmFsbGJhY2tXaWR0aD86IG51bWJlcjtcbiAgY29udGVudFR5cGU/OiBzdHJpbmc7XG4gIHNyY1NldD86IHN0cmluZztcbiAgbGF6eUxvYWQ/OiBib29sZWFuO1xuICBsYXp5TG9hZFNyYz86IHN0cmluZztcbiAgZXhwYW5kQnV0dG9uPzogUmVhY3ROb2RlO1xuICBjcm9wPzogSW1hZ2VDcm9wO1xuICBmb2NhbFBvaW50PzogSW1hZ2VGb2NhbFBvaW50O1xuICBpbkdyaWQ/OiBib29sZWFuO1xufVxuXG5jb25zdCBJbWFnZSA9ICh7XG4gIGFsdCxcbiAgc3JjLFxuICBsYXp5TG9hZCxcbiAgbGF6eUxvYWRTcmMsXG4gIGNyb3AsXG4gIGZvY2FsUG9pbnQsXG4gIGNvbnRlbnRUeXBlLFxuICBzaXplcyA9ICcobWluLXdpZHRoOiAxMDI0cHgpIDEwMjRweCwgMTAwdncnLFxuICBleHBhbmRCdXR0b24sXG4gIGZhbGxiYWNrV2lkdGggPSAxMDI0LFxuICBpbkdyaWQsXG4gIC4uLnJlc3Rcbn06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHNyY1NldCA9IHJlc3Quc3JjU2V0ID8/IGdldFNyY1NldChzcmMsIGNyb3AsIGZvY2FsUG9pbnQpO1xuICBjb25zdCBxdWVyeVN0cmluZyA9IG1ha2VTcmNRdWVyeVN0cmluZyhmYWxsYmFja1dpZHRoLCBjcm9wLCBmb2NhbFBvaW50KTtcblxuICBpZiAoY29udGVudFR5cGUgJiYgY29udGVudFR5cGUgPT09ICdpbWFnZS9naWYnKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxTdHlsZWRJbWFnZVdyYXBwZXIgZGF0YS1pbi1ncmlkPXtpbkdyaWR9PlxuICAgICAgICA8U3R5bGVkSW1hZ2UgYWx0PXthbHR9IHNyYz17YCR7c3JjfWB9IHsuLi5yZXN0fSBkYXRhLWluLWdyaWQ9e2luR3JpZH0gLz5cbiAgICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICk7XG4gIH1cblxuICBpZiAobGF6eUxvYWQpIHtcbiAgICByZXR1cm4gKFxuICAgICAgPFN0eWxlZEltYWdlV3JhcHBlcj5cbiAgICAgICAgPExhenlMb2FkSW1hZ2VcbiAgICAgICAgICBhbHQ9e2FsdH1cbiAgICAgICAgICBzcmM9e2Ake3NyY30/JHtxdWVyeVN0cmluZ31gfVxuICAgICAgICAgIHNyY1NldD17c3JjU2V0fVxuICAgICAgICAgIHNpemVzPXtzaXplc31cbiAgICAgICAgICBsYXp5TG9hZFNyYz17bGF6eUxvYWRTcmN9XG4gICAgICAgIC8+XG4gICAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgICApO1xuICB9XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyIGRhdGEtc3ZnPXtjb250ZW50VHlwZSA9PT0gJ2ltYWdlL3N2Zyt4bWwnfSBkYXRhLWluLWdyaWQ9e2luR3JpZH0+XG4gICAgICA8cGljdHVyZT5cbiAgICAgICAgPHNvdXJjZSB0eXBlPXtjb250ZW50VHlwZX0gc3JjU2V0PXtzcmNTZXR9IHNpemVzPXtzaXplc30gLz5cbiAgICAgICAgPFN0eWxlZEltYWdlIGFsdD17YWx0fSBzcmM9e2Ake3NyY30/JHtxdWVyeVN0cmluZ31gfSB7Li4ucmVzdH0gZGF0YS1pbi1ncmlkPXtpbkdyaWR9IC8+XG4gICAgICA8L3BpY3R1cmU+XG4gICAgICB7ZXhwYW5kQnV0dG9ufVxuICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgSW1hZ2U7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var Image = function Image(_ref) {
   var _rest$srcSet;
-  var alt = _ref3.alt,
-    src = _ref3.src,
-    lazyLoad = _ref3.lazyLoad,
-    lazyLoadSrc = _ref3.lazyLoadSrc,
-    crop = _ref3.crop,
-    focalPoint = _ref3.focalPoint,
-    contentType = _ref3.contentType,
-    _ref3$sizes = _ref3.sizes,
-    sizes = _ref3$sizes === void 0 ? '(min-width: 1024px) 1024px, 100vw' : _ref3$sizes,
-    expandButton = _ref3.expandButton,
-    _ref3$fallbackWidth = _ref3.fallbackWidth,
-    fallbackWidth = _ref3$fallbackWidth === void 0 ? 1024 : _ref3$fallbackWidth,
-    rest = _objectWithoutProperties(_ref3, _excluded);
+  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,
+    _ref$fallbackWidth = _ref.fallbackWidth,
+    fallbackWidth = _ref$fallbackWidth === void 0 ? 1024 : _ref$fallbackWidth,
+    inGrid = _ref.inGrid,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var srcSet = (_rest$srcSet = rest.srcSet) !== null && _rest$srcSet !== void 0 ? _rest$srcSet : getSrcSet(src, crop, focalPoint);
   var queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
   if (contentType && contentType === 'image/gif') {
     return (0, _jsxRuntime.jsx)(StyledImageWrapper, {
-      children: (0, _jsxRuntime.jsx)("img", _objectSpread({
+      "data-in-grid": inGrid,
+      children: (0, _jsxRuntime.jsx)(StyledImage, _objectSpread(_objectSpread({
         alt: alt,
         src: "".concat(src)
-      }, rest))
+      }, rest), {}, {
+        "data-in-grid": inGrid
+      }))
     });
   }
   if (lazyLoad) {
@@ -95,16 +99,19 @@ var Image = function Image(_ref3) {
     });
   }
   return (0, _jsxRuntime.jsxs)(StyledImageWrapper, {
-    svg: contentType === 'image/svg+xml',
+    "data-svg": contentType === 'image/svg+xml',
+    "data-in-grid": inGrid,
     children: [(0, _jsxRuntime.jsxs)("picture", {
       children: [(0, _jsxRuntime.jsx)("source", {
         type: contentType,
         srcSet: srcSet,
         sizes: sizes
-      }), (0, _jsxRuntime.jsx)("img", _objectSpread({
+      }), (0, _jsxRuntime.jsx)(StyledImage, _objectSpread(_objectSpread({
         alt: alt,
         src: "".concat(src, "?").concat(queryString)
-      }, rest))]
+      }, rest), {}, {
+        "data-in-grid": inGrid
+      }))]
     }), expandButton]
   });
 };

package/lib/Layout/LayoutItem.d.ts

@@ -5,10 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import { ReactNode } from 'react';
-interface Props {
+import { HTMLAttributes, ReactNode } from 'react';
+interface Props extends HTMLAttributes<HTMLElement> {
     children?: ReactNode;
     layout?: string;
 }
-export declare const LayoutItem: ({ children, layout }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const LayoutItem: ({ children, layout, ...rest }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default LayoutItem;

package/lib/Layout/LayoutItem.js

@@ -1,12 +1,13 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.LayoutItem = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _excluded = ["children", "layout"];
 /**
  * Copyright (c) 2016-present, NDLA.
  *
@@ -14,10 +15,18 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * LICENSE file in the root directory of this source tree.
  *
  */
-
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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; }
 var LayoutItem = function LayoutItem(_ref) {
   var children = _ref.children,
-    layout = _ref.layout;
+    layout = _ref.layout,
+    rest = _objectWithoutProperties(_ref, _excluded);
   switch (layout) {
     case 'extend':
       {
@@ -42,10 +51,11 @@ var LayoutItem = function LayoutItem(_ref) {
       }
     default:
       {
-        return (0, _jsxRuntime.jsx)("section", {
-          className: "o-layout__item",
+        return (0, _jsxRuntime.jsx)("section", _objectSpread(_objectSpread({
+          className: "o-layout__item"
+        }, rest), {}, {
           children: children
-        });
+        }));
       }
   }
 };

package/lib/LearningPaths/LearningPathWrapper.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.LearningPathWrapper = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
 var _core = require("@ndla/core");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -21,18 +20,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 var StyledWrapper = /*#__PURE__*/(0, _base.default)("section", {
   target: "e179wekn0",
   label: "StyledWrapper"
-})("max-width:", 1402 + _core.spacingUnit, "px;padding:0 ", _core.spacing.normal, ";margin:0 auto;.o-wrapper{padding-right:0;padding-left:0;}.c-hero__content{display:none;}", _core.mq.range({
-  from: _core.breakpoints.tablet
-}), "{.c-hero__content{display:flex;}}", function (props) {
-  return props.invertedStyle && /*#__PURE__*/(0, _react2.css)(_core.mq.range({
-    until: _core.breakpoints.tablet
-  }), "{background:#fff;};label:StyledWrapper;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxlYXJuaW5nUGF0aFdyYXBwZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1DTyIsImZpbGUiOiJMZWFybmluZ1BhdGhXcmFwcGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE5LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IHNwYWNpbmcsIHNwYWNpbmdVbml0LCBicmVha3BvaW50cywgbXEgfSBmcm9tICdAbmRsYS9jb3JlJztcblxudHlwZSBQcm9wU3R5bGVkV3JhcHBlciA9IHtcbiAgaW52ZXJ0ZWRTdHlsZT86IGJvb2xlYW47XG59O1xuXG5jb25zdCBTdHlsZWRXcmFwcGVyID0gc3R5bGVkLnNlY3Rpb248UHJvcFN0eWxlZFdyYXBwZXI+YFxuICBtYXgtd2lkdGg6ICR7MTQwMiArIHNwYWNpbmdVbml0fXB4O1xuICBwYWRkaW5nOiAwICR7c3BhY2luZy5ub3JtYWx9O1xuICBtYXJnaW46IDAgYXV0bztcbiAgLm8td3JhcHBlciB7XG4gICAgcGFkZGluZy1yaWdodDogMDtcbiAgICBwYWRkaW5nLWxlZnQ6IDA7XG4gIH1cbiAgLmMtaGVyb19fY29udGVudCB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMudGFibGV0IH0pfSB7XG4gICAgLmMtaGVyb19fY29udGVudCB7XG4gICAgICBkaXNwbGF5OiBmbGV4O1xuICAgIH1cbiAgfVxuICAkeyhwcm9wcykgPT5cbiAgICBwcm9wcy5pbnZlcnRlZFN0eWxlICYmXG4gICAgY3NzYFxuICAgICAgJHttcS5yYW5nZSh7IHVudGlsOiBicmVha3BvaW50cy50YWJsZXQgfSl9IHtcbiAgICAgICAgYmFja2dyb3VuZDogI2ZmZjtcbiAgICAgIH1cbiAgICBgfVxuYDtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZTtcbiAgaW52ZXJ0ZWRTdHlsZT86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBjb25zdCBMZWFybmluZ1BhdGhXcmFwcGVyID0gKHsgY2hpbGRyZW4sIGludmVydGVkU3R5bGUgfTogUHJvcHMpID0+IChcbiAgPFN0eWxlZFdyYXBwZXIgaW52ZXJ0ZWRTdHlsZT17aW52ZXJ0ZWRTdHlsZX0+e2NoaWxkcmVufTwvU3R5bGVkV3JhcHBlcj5cbik7XG4iXX0= */"));
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxlYXJuaW5nUGF0aFdyYXBwZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCdUQiLCJmaWxlIjoiTGVhcm5pbmdQYXRoV3JhcHBlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxOS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyBSZWFjdE5vZGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBzcGFjaW5nLCBzcGFjaW5nVW5pdCwgYnJlYWtwb2ludHMsIG1xIH0gZnJvbSAnQG5kbGEvY29yZSc7XG5cbnR5cGUgUHJvcFN0eWxlZFdyYXBwZXIgPSB7XG4gIGludmVydGVkU3R5bGU/OiBib29sZWFuO1xufTtcblxuY29uc3QgU3R5bGVkV3JhcHBlciA9IHN0eWxlZC5zZWN0aW9uPFByb3BTdHlsZWRXcmFwcGVyPmBcbiAgbWF4LXdpZHRoOiAkezE0MDIgKyBzcGFjaW5nVW5pdH1weDtcbiAgcGFkZGluZzogMCAke3NwYWNpbmcubm9ybWFsfTtcbiAgbWFyZ2luOiAwIGF1dG87XG4gIC5vLXdyYXBwZXIge1xuICAgIHBhZGRpbmctcmlnaHQ6IDA7XG4gICAgcGFkZGluZy1sZWZ0OiAwO1xuICB9XG4gIC5jLWhlcm9fX2NvbnRlbnQge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gIH1cbiAgJHttcS5yYW5nZSh7IGZyb206IGJyZWFrcG9pbnRzLnRhYmxldCB9KX0ge1xuICAgIC5jLWhlcm9fX2NvbnRlbnQge1xuICAgICAgZGlzcGxheTogZmxleDtcbiAgICB9XG4gIH1cbiAgJHsocHJvcHMpID0+XG4gICAgcHJvcHMuaW52ZXJ0ZWRTdHlsZSAmJlxuICAgIGNzc2BcbiAgICAgICR7bXEucmFuZ2UoeyB1bnRpbDogYnJlYWtwb2ludHMudGFibGV0IH0pfSB7XG4gICAgICAgIGJhY2tncm91bmQ6ICNmZmY7XG4gICAgICB9XG4gICAgYH1cbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGU7XG4gIGludmVydGVkU3R5bGU/OiBib29sZWFuO1xufVxuXG5leHBvcnQgY29uc3QgTGVhcm5pbmdQYXRoV3JhcHBlciA9ICh7IGNoaWxkcmVuLCBpbnZlcnRlZFN0eWxlIH06IFByb3BzKSA9PiAoXG4gIDxTdHlsZWRXcmFwcGVyIGludmVydGVkU3R5bGU9e2ludmVydGVkU3R5bGV9PntjaGlsZHJlbn08L1N0eWxlZFdyYXBwZXI+XG4pO1xuIl19 */"));
+})("max-width:", 1402 + _core.spacingUnit, "px;padding:0 ", _core.spacing.normal, ";margin:0 auto;.o-wrapper{padding-right:0;padding-left:0;}&[data-inverted='true']{", _core.mq.range({
+  until: _core.breakpoints.tablet
+}), "{background:#fff;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxlYXJuaW5nUGF0aFdyYXBwZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVlvQyIsImZpbGUiOiJMZWFybmluZ1BhdGhXcmFwcGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE5LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHNwYWNpbmcsIHNwYWNpbmdVbml0LCBicmVha3BvaW50cywgbXEgfSBmcm9tICdAbmRsYS9jb3JlJztcblxuY29uc3QgU3R5bGVkV3JhcHBlciA9IHN0eWxlZC5zZWN0aW9uYFxuICBtYXgtd2lkdGg6ICR7MTQwMiArIHNwYWNpbmdVbml0fXB4O1xuICBwYWRkaW5nOiAwICR7c3BhY2luZy5ub3JtYWx9O1xuICBtYXJnaW46IDAgYXV0bztcbiAgLm8td3JhcHBlciB7XG4gICAgcGFkZGluZy1yaWdodDogMDtcbiAgICBwYWRkaW5nLWxlZnQ6IDA7XG4gIH1cblxuICAmW2RhdGEtaW52ZXJ0ZWQ9J3RydWUnXSB7XG4gICAgJHttcS5yYW5nZSh7IHVudGlsOiBicmVha3BvaW50cy50YWJsZXQgfSl9IHtcbiAgICAgIGJhY2tncm91bmQ6ICNmZmY7XG4gICAgfVxuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBjaGlsZHJlbjogUmVhY3ROb2RlO1xuICBpbnZlcnRlZFN0eWxlPzogYm9vbGVhbjtcbn1cblxuZXhwb3J0IGNvbnN0IExlYXJuaW5nUGF0aFdyYXBwZXIgPSAoeyBjaGlsZHJlbiwgaW52ZXJ0ZWRTdHlsZSB9OiBQcm9wcykgPT4gKFxuICA8U3R5bGVkV3JhcHBlciBkYXRhLWludmVydGVkPXshIWludmVydGVkU3R5bGV9PntjaGlsZHJlbn08L1N0eWxlZFdyYXBwZXI+XG4pO1xuIl19 */"));
 var LearningPathWrapper = function LearningPathWrapper(_ref) {
   var children = _ref.children,
     invertedStyle = _ref.invertedStyle;
   return (0, _jsxRuntime.jsx)(StyledWrapper, {
-    invertedStyle: invertedStyle,
+    "data-inverted": !!invertedStyle,
     children: children
   });
 };

package/lib/LicenseByline/EmbedByline.d.ts

@@ -19,6 +19,7 @@ interface BaseProps {
     visibleAlt?: string;
     error?: true | false;
     first?: boolean;
+    inGrid?: boolean;
 }
 export interface EmbedBylineErrorProps extends BaseProps {
     type: EmbedBylineTypeProps['type'] | 'h5p' | 'external';
@@ -47,5 +48,5 @@ interface ConceptProps extends BaseProps {
 export type EmbedBylineTypeProps = ImageProps | BrightcoveProps | AudioProps | PodcastProps | ConceptProps;
 type Props = EmbedBylineTypeProps | EmbedBylineErrorProps;
 export type LicenseType = ReturnType<typeof getLicenseByAbbreviation>;
-declare const EmbedByline: ({ type, topRounded, bottomRounded, description, children, visibleAlt, first, ...props }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+declare const EmbedByline: ({ type, topRounded, bottomRounded, description, children, visibleAlt, first, inGrid, ...props }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default EmbedByline;