@sok-brand-sites/common-frontend-components 0.0.1-security → 1.643.1

package/dist/components/PlaceOfBusiness/Services/Services.js

@@ -0,0 +1,30 @@
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { ServicesContainer, Title, ServicesGrid, ServicesGridItem, ArrowContainer } from './Services.styles.js';
+import translationJSON from '../../../locales/translations.json.js';
+import { icons } from '../../../assets/icons/Icons.js';
+
+var Services = function Services(_a) {
+  var services = _a.services,
+      lang = _a.lang;
+  return jsx(Fragment, {
+    children: services && jsxs(ServicesContainer, {
+      children: [jsx(Title, {
+        children: translationJSON.placeOfBusiness.placeOfBusinessInfo.services[lang]
+      }, void 0), jsx(ServicesGrid, {
+        children: services === null || services === void 0 ? void 0 : services.map(function (service) {
+          var _a, _b;
+
+          return jsxs(ServicesGridItem, {
+            children: [jsx(ArrowContainer, {
+              children: jsx(icons.Arrow, {}, void 0)
+            }, void 0), jsx("p", {
+              children: (_a = service.serviceType) === null || _a === void 0 ? void 0 : _a.name
+            }, void 0)]
+          }, (_b = service.serviceType) === null || _b === void 0 ? void 0 : _b.name);
+        })
+      }, void 0)]
+    }, void 0)
+  }, void 0);
+};
+
+export { Services, Services as default };

package/dist/components/PlaceOfBusiness/Services/Services.styles.js

@@ -0,0 +1,61 @@
+import { __makeTemplateObject } from '../../../_virtual/_tslib.js';
+import styled from 'styled-components';
+import media from '../../../styles/media.js';
+var ServicesContainer = styled.div.withConfig({
+  displayName: "Servicesstyles__ServicesContainer",
+  componentId: "sc-1ajwmbh-0"
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  row-gap: ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  row-gap: ", ";\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing32;
+});
+var Title = styled.div.withConfig({
+  displayName: "Servicesstyles__Title",
+  componentId: "sc-1ajwmbh-1"
+})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n\n  ", "\n"], ["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n\n  ", "\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.fontFamily;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.fontWeight;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.fontSizes.mobile.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.fontSizes.mobile.lineHeight;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.color;
+}, media.desktop(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    font-size: ", ";\n    line-height: ", ";\n  "], ["\n    font-size: ", ";\n    line-height: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.fontSizes.desktop.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.title.fontSizes.desktop.lineHeight;
+}));
+var ServicesGrid = styled.div.withConfig({
+  displayName: "Servicesstyles__ServicesGrid",
+  componentId: "sc-1ajwmbh-2"
+})(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr;\n  column-gap: ", ";\n\n  ", "\n"], ["\n  display: grid;\n  grid-template-columns: 1fr;\n  column-gap: ", ";\n\n  ", "\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing16;
+}, media.tablet(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    grid-template-columns: 1fr 1fr;\n  "], ["\n    grid-template-columns: 1fr 1fr;\n  "]))));
+var ServicesGridItem = styled.div.withConfig({
+  displayName: "Servicesstyles__ServicesGridItem",
+  componentId: "sc-1ajwmbh-3"
+})(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  padding: ", " 0;\n  border-bottom: 1px solid #f0f0f0;\n  column-gap: ", ";\n"], ["\n  display: flex;\n  align-items: center;\n  padding: ", " 0;\n  border-bottom: 1px solid #f0f0f0;\n  column-gap: ", ";\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing16;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing16;
+});
+var ArrowContainer = styled.div.withConfig({
+  displayName: "Servicesstyles__ArrowContainer",
+  componentId: "sc-1ajwmbh-4"
+})(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  transform: rotate(180deg);\n  svg path {\n    fill: ", ";\n  }\n"], ["\n  transform: rotate(180deg);\n  svg path {\n    fill: ", ";\n  }\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.placeOfBusiness.services.arrowColor;
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+export { ArrowContainer, ServicesContainer, ServicesGrid, ServicesGridItem, Title };

package/dist/components/PlaceOfBusiness/utils.js

@@ -0,0 +1,177 @@
+import translationJSON from '../../locales/translations.json.js';
+import { format, add, areIntervalsOverlapping } from 'date-fns';
+
+function filterPobs(pobs, searchInput) {
+  var splittingRegex = /-| /;
+  var filters = searchInput ? searchInput.trim().split(splittingRegex) : '';
+
+  if (filters) {
+    return pobs.filter(function (pob) {
+      // Returns the pob if any of the following conditions is met:
+      // 1. postcode starts with the filter
+      // 2. any of the parts (split by space or hyphen) in the address starts with the filter
+      // 3. postcodeName starts with the filter
+      // 4. any of the parts (split by space or hyphen) in the name starts with the filter
+      // For multiple filter strings, all of them have to meet one of the criteria for a match,
+      // i.e., the filter is an AND filter and not OR
+      return filters.every(function (filter) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+
+        return ((_c = (_b = (_a = pob.location) === null || _a === void 0 ? void 0 : _a.address) === null || _b === void 0 ? void 0 : _b.postcode) === null || _c === void 0 ? void 0 : _c.toLowerCase().startsWith(filter.toLowerCase())) || ((_f = (_e = (_d = pob.location) === null || _d === void 0 ? void 0 : _d.address) === null || _e === void 0 ? void 0 : _e.street) === null || _f === void 0 ? void 0 : _f.toLowerCase().split(splittingRegex).some(function (part) {
+          return part.startsWith(filter.toLowerCase());
+        })) || ((_j = (_h = (_g = pob.location) === null || _g === void 0 ? void 0 : _g.address) === null || _h === void 0 ? void 0 : _h.postcodeName) === null || _j === void 0 ? void 0 : _j.toLowerCase().startsWith(filter.toLowerCase())) || ((_k = pob.name) === null || _k === void 0 ? void 0 : _k.toLowerCase().split(splittingRegex).some(function (part) {
+          return part.startsWith(filter.toLowerCase());
+        })) || ((_m = (_l = pob.brand) === null || _l === void 0 ? void 0 : _l.name) === null || _m === void 0 ? void 0 : _m.toLowerCase().split(splittingRegex).some(function (part) {
+          return part.includes(filter.toLowerCase());
+        }));
+      });
+    }).sort(function (a, b) {
+      return sortPobs(a, b, filters);
+    });
+  }
+
+  return pobs;
+} // Sort pobs first with brand priority, e.g., if filter is "Prisma",
+// show all pobs under Prisma brand first and then the
+// other Prisma matches such as "Silmäasema Espoo Prisma Olari" (a shop inside Prisma)
+// When both a and b are under the same brand, sort by a better match in names, e.g.,
+// "Prisma O" gives "Prisma Olari" first and "Prisma Iso Omena" second.
+
+
+var sortPobs = function sortPobs(a, b, filters) {
+  var value = sortByBrandStartsWith(a, b, filters);
+
+  if (value === 0) {
+    value = sortByBrandExactMatch(a, b, filters);
+
+    if (value === 0) {
+      return sortByUnsplitFilter(a, b, filters);
+    }
+
+    return value;
+  }
+
+  return value;
+};
+
+function sortByBrandExactMatch(a, b, filters) {
+  var aBrandNameInFilters = filters.some(function (filter) {
+    var _a, _b;
+
+    return ((_b = (_a = a.brand) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === filter.toLowerCase();
+  });
+  var bBrandNameInFilters = filters.some(function (filter) {
+    var _a, _b;
+
+    return ((_b = (_a = b.brand) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === filter.toLowerCase();
+  });
+  if (aBrandNameInFilters && !bBrandNameInFilters) return -1;
+  if (!aBrandNameInFilters && bBrandNameInFilters) return 1;
+  return 0;
+}
+
+function sortByBrandStartsWith(a, b, filters) {
+  var aBrandNameInFilters = filters.some(function (filter) {
+    var _a, _b;
+
+    return (_b = (_a = a.brand) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.toLowerCase().startsWith(filter.toLowerCase());
+  });
+  var bBrandNameInFilters = filters.some(function (filter) {
+    var _a, _b;
+
+    return (_b = (_a = b.brand) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.toLowerCase().startsWith(filter.toLowerCase());
+  });
+  if (aBrandNameInFilters && !bBrandNameInFilters) return -1;
+  if (!aBrandNameInFilters && bBrandNameInFilters) return 1;
+  return 0;
+}
+
+function sortByUnsplitFilter(a, b, filters) {
+  var _a, _b;
+
+  var filter = filters.join(' ');
+  var aPobNameInFilter = (_a = a.name) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(filter.toLowerCase());
+  var bPobNameInFilter = (_b = b.name) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(filter.toLowerCase());
+  if (aPobNameInFilter && !bPobNameInFilter) return -1;
+  if (!aPobNameInFilter && bPobNameInFilter) return 1;
+  return 0;
+} // check modes for weekdays https://confluence.sok.fi/pages/viewpage.action?pageId=60170941
+
+
+var getOpenHours = function getOpenHours(language, openingTimesToday) {
+  var _a, _b;
+
+  var openHours = [];
+
+  if (!openingTimesToday) {
+    openHours.push(translationJSON.placeOfBusiness.noOpeningHours[language]);
+  } else if (openingTimesToday.mode === 'RANGE' && ((_a = openingTimesToday.ranges) === null || _a === void 0 ? void 0 : _a.length)) {
+    (_b = openingTimesToday.ranges) === null || _b === void 0 ? void 0 : _b.forEach(function (range) {
+      openHours.push(range.open + " - " + range.close);
+    });
+  } else if (openingTimesToday.mode === '24H') {
+    openHours.push('24h');
+  } else if (openingTimesToday.mode === 'BY_RESERVATION') {
+    openHours.push(translationJSON.placeOfBusiness.byAppointment[language]);
+  } else if (openingTimesToday.mode === 'CLOSED') {
+    openHours.push(translationJSON.placeOfBusiness.closed[language]);
+  } else {
+    openHours.push(translationJSON.placeOfBusiness.noOpeningHours[language]);
+  }
+
+  return openHours;
+};
+
+var getUrl = function getUrl(name, laariId, language) {
+  if (laariId === void 0) {
+    laariId = '';
+  } // Remove commas and dots, split by space, join with hyphens, remove consecutive hyphens
+
+
+  var nameStr = name.toLowerCase().replace(/[,.]/g, '').split(' ').join('-').replace(/-+/g, '-').replace(/ä|Ä|u00e4|u00E4|å|Å|u00e5|u00E5/g, 'a').replace(/ö|Ö|u00e6|u00E6/g, 'o');
+  var lang = language.toLowerCase();
+  var url;
+
+  if (lang === 'fi') {
+    url = "/toimipaikka/" + nameStr + "/" + laariId;
+  } else if (lang === 'en') {
+    url = "/" + lang + "/location/" + nameStr + "/" + laariId;
+  } else {
+    url = "/" + lang + "/verksamhetsstalle/" + nameStr + "/" + laariId;
+  }
+
+  return url;
+};
+
+var isOpenNow = function isOpenNow(formattedCurrentDate, openingTimesToday) {
+  var _a;
+
+  if (!openingTimesToday) return false;
+  if ((openingTimesToday === null || openingTimesToday === void 0 ? void 0 : openingTimesToday.mode) === 'CLOSED' || (openingTimesToday === null || openingTimesToday === void 0 ? void 0 : openingTimesToday.mode) === 'BY_RESERVATION') return false;
+  if ((openingTimesToday === null || openingTimesToday === void 0 ? void 0 : openingTimesToday.mode) === '24H') return true;
+
+  if ((openingTimesToday === null || openingTimesToday === void 0 ? void 0 : openingTimesToday.mode) === 'RANGE') {
+    var currentTime_1 = format(new Date(), 'HH:mm'); // T before the time in the string is needed for mobile Safari
+
+    var isOpen = (_a = openingTimesToday.ranges) === null || _a === void 0 ? void 0 : _a.some(function (range) {
+      var formattedCurrentTime = new Date(formattedCurrentDate + "T" + currentTime_1);
+      var formattedCurrentTimePlusOneMinute = add(new Date(formattedCurrentTime), {
+        minutes: 1
+      });
+      var formattedOpeningTime = new Date(formattedCurrentDate + "T" + range.open);
+      var formattedClosingTime = range.closeOnSameDay ? new Date(formattedCurrentDate + "T" + range.close) : add(new Date(formattedCurrentDate + "T" + range.close), {
+        days: 1
+      });
+      return areIntervalsOverlapping({
+        start: formattedCurrentTime,
+        end: formattedCurrentTimePlusOneMinute
+      }, {
+        start: formattedOpeningTime,
+        end: formattedClosingTime
+      });
+    });
+    return isOpen;
+  }
+};
+
+export { filterPobs, getOpenHours, getUrl, isOpenNow, sortByBrandExactMatch, sortByBrandStartsWith, sortByUnsplitFilter, sortPobs };

package/dist/components/Promotion/Promotion.js

@@ -0,0 +1,66 @@
+import { __rest, __assign } from '../../_virtual/_tslib.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { useTheme } from 'styled-components';
+import RestrictedWidthContainer from '../RestrictedWidthContainer/RestrictedWidthContainer.js';
+import { PromotionContainer, MediaContainer, DynamicImage, StaticImage, Video, Overlay, ContentContainer, Category, Title } from './Promotion.styles.js';
+import Button from '../Button/Button.js';
+var Promotion = forwardRef(function (_a, ref) {
+  var _b, _c, _d;
+
+  var category = _a.category,
+      title = _a.title,
+      opacity = _a.opacity,
+      media = _a.media,
+      button = _a.button,
+      anchor = _a.anchor,
+      rest = __rest(_a, ["category", "title", "opacity", "media", "button", "anchor"]);
+
+  var theme = useTheme();
+  return jsxs(PromotionContainer, __assign({
+    id: anchor
+  }, rest, {
+    ref: ref
+  }, {
+    children: [jsxs(MediaContainer, {
+      children: [(media === null || media === void 0 ? void 0 : media.mimeType.includes('image')) && ((_b = media === null || media === void 0 ? void 0 : media.localFile) === null || _b === void 0 ? void 0 : _b.childImageSharp) && jsx(DynamicImage, {
+        image: (_c = media.localFile.childImageSharp) === null || _c === void 0 ? void 0 : _c.gatsbyImageData,
+        alt: ""
+      }, void 0), (media === null || media === void 0 ? void 0 : media.mimeType.includes('image')) && !((_d = media === null || media === void 0 ? void 0 : media.localFile) === null || _d === void 0 ? void 0 : _d.childImageSharp) && jsx(StaticImage, {
+        src: media.mediaItemUrl,
+        alt: ""
+      }, void 0), (media === null || media === void 0 ? void 0 : media.mediaItemUrl) && (media === null || media === void 0 ? void 0 : media.mimeType.includes('video')) && jsx(Video, __assign({
+        muted: true,
+        loop: true,
+        playsInline: true,
+        autoPlay: true
+      }, {
+        children: jsx("source", {
+          type: media.mimeType,
+          src: media.mediaItemUrl
+        }, void 0)
+      }), void 0), jsx(Overlay, {
+        opacity: opacity
+      }, void 0)]
+    }, void 0), jsx(RestrictedWidthContainer, {
+      children: jsxs(ContentContainer, {
+        children: [jsx(Category, {
+          children: category
+        }, void 0), jsx(Title, {
+          dangerouslySetInnerHTML: {
+            __html: title === null || title === void 0 ? void 0 : title.replace(/\u00a0/g, ' ')
+          }
+        }, void 0), (button === null || button === void 0 ? void 0 : button.buttonText) && jsx(Button, {
+          linkToPage: button === null || button === void 0 ? void 0 : button.linkToPage,
+          externalLink: button === null || button === void 0 ? void 0 : button.externalLink,
+          openWithNewTab: button === null || button === void 0 ? void 0 : button.openWithNewTab,
+          buttonText: button === null || button === void 0 ? void 0 : button.buttonText,
+          htmlAnchorTarget: button === null || button === void 0 ? void 0 : button.htmlAnchorTarget,
+          // Todo: this should be configurable by from the editor
+          align: theme.components.promotion.alignContent
+        }, void 0)]
+      }, void 0)
+    }, void 0)]
+  }), void 0);
+});
+export { Promotion, Promotion as default };

package/dist/components/Promotion/Promotion.styles.js

@@ -0,0 +1,124 @@
+import { __makeTemplateObject } from '../../_virtual/_tslib.js';
+import styled, { css } from 'styled-components';
+import { GatsbyImage } from 'gatsby-plugin-image';
+import media from '../../styles/media.js';
+var PromotionContainer = styled.div.withConfig({
+  displayName: "Promotionstyles__PromotionContainer",
+  componentId: "sc-1xki3yx-0"
+})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  min-height: ", ";\n\n  ", "\n\n  ", "\n"], ["\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  min-height: ", ";\n\n  ", "\n\n  ", "\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.minHeight.mobile;
+}, media.tablet(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    min-height: ", ";\n  "], ["\n    min-height: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.minHeight.tablet;
+}), media.desktop(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    min-height: ", ";\n  "], ["\n    min-height: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.minHeight.desktop;
+}));
+var MediaContainer = styled.div.withConfig({
+  displayName: "Promotionstyles__MediaContainer",
+  componentId: "sc-1xki3yx-1"
+})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n  height: 100%;\n  width: 100%;\n  z-index: 0;\n"], ["\n  position: absolute;\n  height: 100%;\n  width: 100%;\n  z-index: 0;\n"])));
+var Video = styled.video.withConfig({
+  displayName: "Promotionstyles__Video",
+  componentId: "sc-1xki3yx-2"
+})(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  width: 100%;\n  object-fit: cover;\n  height: 100%;\n"], ["\n  width: 100%;\n  object-fit: cover;\n  height: 100%;\n"])));
+var ImageCSS = css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  width: 100%;\n  object-fit: cover;\n  height: 100%;\n"], ["\n  width: 100%;\n  object-fit: cover;\n  height: 100%;\n"])));
+var DynamicImage = styled(GatsbyImage).withConfig({
+  displayName: "Promotionstyles__DynamicImage",
+  componentId: "sc-1xki3yx-3"
+})(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), ImageCSS);
+var StaticImage = styled.img.withConfig({
+  displayName: "Promotionstyles__StaticImage",
+  componentId: "sc-1xki3yx-4"
+})(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), ImageCSS);
+var Overlay = styled.div.withConfig({
+  displayName: "Promotionstyles__Overlay",
+  componentId: "sc-1xki3yx-5"
+})(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  background-color: black;\n  opacity: ", ";\n"], ["\n  position: absolute;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  background-color: black;\n  opacity: ", ";\n"])), function (_a) {
+  var opacity = _a.opacity;
+  return opacity ? opacity : '0';
+});
+var ContentContainer = styled.div.withConfig({
+  displayName: "Promotionstyles__ContentContainer",
+  componentId: "sc-1xki3yx-6"
+})(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  width: 100%;\n  z-index: 1;\n  text-align: ", ";\n  padding: ", " 0;\n"], ["\n  width: 100%;\n  z-index: 1;\n  text-align: ", ";\n  padding: ", " 0;\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.alignContent;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing32;
+});
+var Category = styled.div.withConfig({
+  displayName: "Promotionstyles__Category",
+  componentId: "sc-1xki3yx-7"
+})(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-transform: ", ";\n  margin-bottom: ", ";\n  word-wrap: break-word;\n"], ["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-transform: ", ";\n  margin-bottom: ", ";\n  word-wrap: break-word;\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.category.fontFamily;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.category.fontWeight;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.category.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.category.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.category.color;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.category.textTransform;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing8;
+});
+var Title = styled.div.withConfig({
+  displayName: "Promotionstyles__Title",
+  componentId: "sc-1xki3yx-8"
+})(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-transform: ", ";\n  letter-spacing: ", ";\n  margin-bottom: ", ";\n  word-wrap: break-word;\n\n  ", "\n\n  ", "\n"], ["\n  font-family: ", ";\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n  color: ", ";\n  text-transform: ", ";\n  letter-spacing: ", ";\n  margin-bottom: ", ";\n  word-wrap: break-word;\n\n  ", "\n\n  ", "\n"])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontFamily;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontWeight;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontSizes.mobile.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontSizes.mobile.lineHeight;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.color;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.textTransform;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.letterSpacing;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing32;
+}, media.tablet(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n    margin-bottom: ", ";\n    font-size: ", ";\n    line-height: ", ";\n  "], ["\n    margin-bottom: ", ";\n    font-size: ", ";\n    line-height: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing48;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontSizes.tablet.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontSizes.tablet.lineHeight;
+}), media.desktop(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n    margin-bottom: ", ";\n    font-size: ", ";\n    line-height: ", ";\n  "], ["\n    margin-bottom: ", ";\n    font-size: ", ";\n    line-height: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.spacings.spacing48;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontSizes.desktop.fontSize;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.promotion.title.fontSizes.desktop.lineHeight;
+}));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14;
+export { Category, ContentContainer, DynamicImage, MediaContainer, Overlay, PromotionContainer, StaticImage, Title, Video };

package/dist/components/RestrictedWidthContainer/RestrictedWidthContainer.js

@@ -0,0 +1,63 @@
+import { __makeTemplateObject, __assign } from '../../_virtual/_tslib.js';
+import { jsx } from 'react/jsx-runtime';
+import styled from 'styled-components';
+import media from '../../styles/media.js';
+var RestrictedWidth = styled.div.withConfig({
+  displayName: "RestrictedWidthContainer__RestrictedWidth",
+  componentId: "sc-k414oz-0"
+})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  max-width: ", ";\n  margin-left: ", ";\n  margin-right: ", ";\n  z-index: 1;\n  overflow: ", ";\n\n  ", "\n\n  ", "\n"], ["\n  width: 100%;\n  max-width: ", ";\n  margin-left: ", ";\n  margin-right: ", ";\n  z-index: 1;\n  overflow: ", ";\n\n  ", "\n\n  ", "\n"
+/* This fixes overflow with margins/paddings when the parent of this component has
+   display: flex and flex-direction: column. With flex-direction: row (default), this
+   component is not overflowing horizontally.
+*/
+])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.maxWidth;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.mobile.margin.left;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.mobile.margin.right;
+}, function (_a) {
+  var hideOverflow = _a.hideOverflow;
+  return hideOverflow ? 'hidden' : 'unset';
+}, media.tablet(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    margin-left: ", ";\n    margin-right: ", ";\n  "], ["\n    margin-left: ", ";\n    margin-right: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.tablet.margin.left;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.tablet.margin.right;
+}), media.desktop(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    margin-left: ", ";\n    margin-right: ", ";\n  "], ["\n    margin-left: ", ";\n    margin-right: ", ";\n  "])), function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.desktop.margin.left;
+}, function (_a) {
+  var theme = _a.theme;
+  return theme.components.restrictedWidthContainer.desktop.margin.right;
+}));
+/* This fixes overflow with margins/paddings when the parent of this component has
+   display: flex and flex-direction: column. With flex-direction: row (default), this
+   component is not overflowing horizontally.
+*/
+
+var FlexContainer = styled.div.withConfig({
+  displayName: "RestrictedWidthContainer__FlexContainer",
+  componentId: "sc-k414oz-1"
+})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  width: 100%;\n"], ["\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  width: 100%;\n"])));
+
+var RestrictedWidthContainer = function RestrictedWidthContainer(_a) {
+  var children = _a.children,
+      className = _a.className,
+      hideOverflow = _a.hideOverflow;
+  return jsx(FlexContainer, {
+    children: jsx(RestrictedWidth, __assign({
+      className: className,
+      hideOverflow: hideOverflow
+    }, {
+      children: children
+    }), void 0)
+  }, void 0);
+};
+
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+export { RestrictedWidthContainer, RestrictedWidthContainer as default };

package/dist/components/Seo/Seo.js

@@ -0,0 +1,58 @@
+import { __assign } from '../../_virtual/_tslib.js';
+import { jsx } from 'react/jsx-runtime';
+import { Helmet } from 'react-helmet';
+import { getCurrentLanguage } from '../utils.js';
+
+var Seo = function Seo(_a) {
+  var focuskw = _a.focuskw,
+      title = _a.title,
+      metaDesc = _a.metaDesc,
+      opengraphTitle = _a.opengraphTitle,
+      opengraphDescription = _a.opengraphDescription,
+      opengraphImage = _a.opengraphImage,
+      twitterTitle = _a.twitterTitle,
+      twitterDescription = _a.twitterDescription,
+      twitterImage = _a.twitterImage,
+      children = _a.children;
+  return jsx(Helmet, __assign({
+    htmlAttributes: {
+      lang: getCurrentLanguage()
+    },
+    title: title,
+    meta: [{
+      name: 'keywords',
+      content: focuskw === null || focuskw === void 0 ? void 0 : focuskw.split(' ').join(',')
+    }, {
+      name: 'description',
+      content: metaDesc
+    }, {
+      property: 'og:type',
+      content: 'website'
+    }, {
+      property: 'og:title',
+      content: opengraphTitle || title
+    }, {
+      property: 'og:description',
+      content: opengraphDescription || metaDesc
+    }, {
+      property: 'og:image',
+      content: opengraphImage === null || opengraphImage === void 0 ? void 0 : opengraphImage.mediaItemUrl
+    }, {
+      name: 'twitter:title',
+      content: twitterTitle || title
+    }, {
+      name: 'twitter:description',
+      content: twitterDescription || metaDesc
+    }, {
+      name: 'twitter:image',
+      content: (twitterImage === null || twitterImage === void 0 ? void 0 : twitterImage.mediaItemUrl) || (opengraphImage === null || opengraphImage === void 0 ? void 0 : opengraphImage.mediaItemUrl)
+    }, {
+      name: 'twitter:card',
+      content: 'summary_large_image'
+    }]
+  }, {
+    children: children
+  }), void 0);
+};
+
+export { Seo, Seo as default };