@blateral/b.kit 2.3.0-beta.1.3 → 2.3.0-beta.1.4

package/esm/sections_news.js

@@ -1,27 +1,32 @@
-import { a as __makeTemplateObject, _ as __assign, e as __spreadArray } from './ClockFilled-8784ddac.js';
+import { a as __makeTemplateObject, _ as __assign, e as __spreadArray } from './ClockFilled-6bae80dc.js';
 import React__default, { forwardRef, useMemo, useState, useRef, useCallback, useEffect } from 'react';
 import styled from 'styled-components';
-import { S as Section, m as mapToBgMode, W as Wrapper, G as Grid } from './Wrapper-f4a70e30.js';
-import { C as Copy, H as Heading, c as copyStyle } from './Copy-3444d005.js';
-import { g as getColors, s as spacings, m as mq, c as getGlobals, a as getFonts } from './styles-5f78e59d.js';
-import { w as withLibTheme, u as useLibTheme } from './LibThemeProvider-90a5375f.js';
-import { I as Image } from './Image-82417953.js';
-import { a as Tag, T as Title, b as TableBlock } from './TableBlock-0bbde956.js';
+import { S as Section, m as mapToBgMode, W as Wrapper } from './Wrapper-29347885.js';
+import { C as Copy, H as Heading, c as copyStyle } from './Copy-fb124972.js';
+import { g as getColors, s as spacings, m as mq, c as getGlobals, a as getFonts } from './styles-f6c54818.js';
+import { w as withLibTheme, u as useLibTheme } from './LibThemeProvider-a38c5bf1.js';
+import { I as Image } from './Image-b538f659.js';
+import { T as Tag } from './Tag-72424779.js';
 import { S as StatusFormatter } from './statusFormatter-9be0fbff.js';
-import { L as Link } from './Link-ee8a48ed.js';
+import { L as Link } from './Link-0a1e35d6.js';
 import { i as isValidArray } from './arrays-65b644ef.js';
-import { u as useMediaQuery } from './useMediaQuery-43629cbb.js';
-import { b as useScrollTo, u as useEqualSheetHeight, g as getUrlParams, s as setUrlParam, d as deleteUrlParam } from './urlParams-882563ce.js';
+import { u as useMediaQuery } from './useMediaQuery-0d473a9c.js';
+import { u as useEqualSheetHeight } from './useEqualSheetHeight-c18cebd3.js';
+import { G as Grid } from './Grid-151498da.js';
 import { u as useObserverSupport } from './useObserverSupport-02bce7f5.js';
-import { P as Pointer } from './Pointer-da4d0977.js';
-import { F as Filter, V as VideoCard } from './VideoCard-2557407b.js';
+import { u as useScrollTo } from './useScrollTo-70af34bf.js';
+import { P as Pointer } from './Pointer-bc68154f.js';
+import { g as getUrlParams, s as setUrlParam, d as deleteUrlParam } from './urlParams-9cfdaf71.js';
+import { F as Filter } from './Filter-fec6dc5c.js';
 import { u as useUpdateEffect } from './useUpdateEffect-824c0c84.js';
 import { u as useMounted } from './useMounted-1e4cc87b.js';
-import './clamp-12d37b65.js';
+import { T as Title, a as TableBlock } from './TableBlock-26530c71.js';
+import { V as VideoCard } from './VideoCard-3fd368ef.js';
 import './concat-ab3c66f2.js';
+import './clamp-12d37b65.js';
 import 'react-dom/server';
-import './useCookieConsent-db86e5cb.js';
-import './ButtonGhost-6673a07e.js';
+import './useCookieConsent-8caef116.js';
+import './ButtonGhost-5b498dba.js';
 import './hexRgbConverter-edb91624.js';
 
 var Seperator = styled.div.withConfig({
@@ -842,88 +847,10 @@ var NewsIntro = function (_a) {
 var NewsIntro$1 = withLibTheme(NewsIntro);
 var templateObject_1$3, templateObject_2$1, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
 
-var News = styled.ul.withConfig({
-  displayName: "NewsList__News",
-  componentId: "sc-sew5jz-0"
-})(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n    list-style: none;\n    margin: 0;\n    margin-top: -", "px;\n    margin-left: -", "px;\n    padding: 0;\n\n    display: flex;\n    flex-direction: row;\n    align-items: flex-start;\n    justify-content: flex-start;\n\n    flex-wrap: wrap;\n"], ["\n    list-style: none;\n    margin: 0;\n    margin-top: -", "px;\n    margin-left: -", "px;\n    padding: 0;\n\n    display: flex;\n    flex-direction: row;\n    align-items: flex-start;\n    justify-content: flex-start;\n\n    flex-wrap: wrap;\n"])), spacings.nudge * 6, spacings.spacer);
-var NewsItem = styled.li.withConfig({
-  displayName: "NewsList__NewsItem",
-  componentId: "sc-sew5jz-1"
-})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    padding-top: ", "px;\n    padding-left: ", "px;\n    flex: 1 0 100%;\n    max-width: 100%;\n\n    @media ", " {\n        flex: 1 0 50%;\n        max-width: 50%;\n    }\n\n    @media ", " {\n        flex: 1 0 33.33%;\n        max-width: 33.33%;\n    }\n"], ["\n    padding-top: ", "px;\n    padding-left: ", "px;\n    flex: 1 0 100%;\n    max-width: 100%;\n\n    @media ", " {\n        flex: 1 0 50%;\n        max-width: 50%;\n    }\n\n    @media ", " {\n        flex: 1 0 33.33%;\n        max-width: 33.33%;\n    }\n"])), spacings.nudge * 6, spacings.spacer, mq.medium, mq.large);
-
-var NewsList = function (_a) {
-  var anchorId = _a.anchorId,
-      _b = _a.mode,
-      mode = _b === void 0 ? 'short' : _b,
-      news = _a.news,
-      bgMode = _a.bgMode,
-      customTag = _a.customTag;
-
-  var _c = useLibTheme(),
-      colors = _c.colors,
-      theme = _c.theme;
-
-  var items = useMemo(function () {
-    if (!news) return [];
-    if (mode === 'expanded') return news.slice(0, 6);else return news.slice(0, 3);
-  }, [news, mode]);
-  var isInverted = bgMode === 'inverted';
-  var hasBg = bgMode === 'full';
-  var cardRefs = useEqualSheetHeight({
-    listLength: items.length,
-    identifiers: ['[data-sheet="head"]', '[data-sheet="title"]', '[data-sheet="text"]'],
-    responsive: {
-      small: 1,
-      medium: 2,
-      semilarge: 2,
-      large: 3,
-      xlarge: 3
-    }
-  }).sheetRefs;
-  return React__default.createElement(Section, {
-    addSeperation: true,
-    anchorId: anchorId,
-    bgColor: isInverted ? colors.sectionBg.dark : hasBg ? colors.sectionBg.medium : colors.sectionBg.light,
-    bgMode: mapToBgMode(bgMode, true)
-  }, React__default.createElement(Wrapper, {
-    addWhitespace: true
-  }, React__default.createElement(News, null, items === null || items === void 0 ? void 0 : items.map(function (item, i) {
-    var _a;
-
-    return React__default.createElement(NewsItem, {
-      key: i
-    }, React__default.createElement(NewsCard, __assign({
-      key: i,
-      ref: cardRefs[i]
-    }, item, {
-      isInverted: isInverted,
-      tags: (_a = item.tags) === null || _a === void 0 ? void 0 : _a.map(function (tag) {
-        var _a, _b;
-
-        var tagHref = undefined;
-
-        if (tag.name && ((_a = tag.link) === null || _a === void 0 ? void 0 : _a.href)) {
-          tagHref = getNewsFilterParams(tag.link.href, theme, [tag.name]);
-        }
-
-        return {
-          name: tag.name,
-          link: ((_b = tag.link) === null || _b === void 0 ? void 0 : _b.href) ? __assign(__assign({}, tag.link), {
-            href: tagHref
-          }) : undefined
-        };
-      }),
-      customTag: customTag
-    })));
-  }))));
-};
-var NewsList$1 = withLibTheme(NewsList);
-var templateObject_1$2, templateObject_2;
-
 var TableWrapper = styled(Wrapper).withConfig({
   displayName: "NewsTable__TableWrapper",
   componentId: "sc-ph099f-0"
-})(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n    & > * + * {\n        margin-top: ", "px;\n    }\n"], ["\n    & > * + * {\n        margin-top: ", "px;\n    }\n"])), spacings.spacer);
+})(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n    & > * + * {\n        margin-top: ", "px;\n    }\n"], ["\n    & > * + * {\n        margin-top: ", "px;\n    }\n"])), spacings.spacer);
 
 var NewsTable = function (_a) {
   var anchorId = _a.anchorId,
@@ -948,12 +875,12 @@ var NewsTable = function (_a) {
   })));
 };
 var NewsTable$1 = withLibTheme(NewsTable);
-var templateObject_1$1;
+var templateObject_1$2;
 
 var ContentBlock = styled(Copy).withConfig({
   displayName: "NewsText__ContentBlock",
   componentId: "sc-2vavtq-0"
-})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    display: block;\n    margin: ", ";\n    max-width: ", ";\n\n    :not(:first-child) {\n        padding-top: ", "px;\n    }\n"], ["\n    display: block;\n    margin: ", ";\n    max-width: ", ";\n\n    :not(:first-child) {\n        padding-top: ", "px;\n    }\n"])), function (_a) {
+})(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n    display: block;\n    margin: ", ";\n    max-width: ", ";\n\n    :not(:first-child) {\n        padding-top: ", "px;\n    }\n"], ["\n    display: block;\n    margin: ", ";\n    max-width: ", ";\n\n    :not(:first-child) {\n        padding-top: ", "px;\n    }\n"])), function (_a) {
   var isCentered = _a.isCentered;
   return isCentered && '0 auto';
 }, function (_a) {
@@ -983,7 +910,7 @@ var NewsText = function (_a) {
   })));
 };
 var NewsText$1 = withLibTheme(NewsText);
-var templateObject_1;
+var templateObject_1$1;
 
 var NewsVideo = function (_a) {
   var anchorId = _a.anchorId,
@@ -1014,5 +941,83 @@ var NewsVideo = function (_a) {
 };
 var NewsVideo$1 = withLibTheme(NewsVideo);
 
+var News = styled.ul.withConfig({
+  displayName: "NewsList__News",
+  componentId: "sc-sew5jz-0"
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    list-style: none;\n    margin: 0;\n    margin-top: -", "px;\n    margin-left: -", "px;\n    padding: 0;\n\n    display: flex;\n    flex-direction: row;\n    align-items: flex-start;\n    justify-content: flex-start;\n\n    flex-wrap: wrap;\n"], ["\n    list-style: none;\n    margin: 0;\n    margin-top: -", "px;\n    margin-left: -", "px;\n    padding: 0;\n\n    display: flex;\n    flex-direction: row;\n    align-items: flex-start;\n    justify-content: flex-start;\n\n    flex-wrap: wrap;\n"])), spacings.nudge * 6, spacings.spacer);
+var NewsItem = styled.li.withConfig({
+  displayName: "NewsList__NewsItem",
+  componentId: "sc-sew5jz-1"
+})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    padding-top: ", "px;\n    padding-left: ", "px;\n    flex: 1 0 100%;\n    max-width: 100%;\n\n    @media ", " {\n        flex: 1 0 50%;\n        max-width: 50%;\n    }\n\n    @media ", " {\n        flex: 1 0 33.33%;\n        max-width: 33.33%;\n    }\n"], ["\n    padding-top: ", "px;\n    padding-left: ", "px;\n    flex: 1 0 100%;\n    max-width: 100%;\n\n    @media ", " {\n        flex: 1 0 50%;\n        max-width: 50%;\n    }\n\n    @media ", " {\n        flex: 1 0 33.33%;\n        max-width: 33.33%;\n    }\n"])), spacings.nudge * 6, spacings.spacer, mq.medium, mq.large);
+
+var NewsList = function (_a) {
+  var anchorId = _a.anchorId,
+      _b = _a.mode,
+      mode = _b === void 0 ? 'short' : _b,
+      news = _a.news,
+      bgMode = _a.bgMode,
+      customTag = _a.customTag;
+
+  var _c = useLibTheme(),
+      colors = _c.colors,
+      theme = _c.theme;
+
+  var items = useMemo(function () {
+    if (!news) return [];
+    if (mode === 'expanded') return news.slice(0, 6);else return news.slice(0, 3);
+  }, [news, mode]);
+  var isInverted = bgMode === 'inverted';
+  var hasBg = bgMode === 'full';
+  var cardRefs = useEqualSheetHeight({
+    listLength: items.length,
+    identifiers: ['[data-sheet="head"]', '[data-sheet="title"]', '[data-sheet="text"]'],
+    responsive: {
+      small: 1,
+      medium: 2,
+      semilarge: 2,
+      large: 3,
+      xlarge: 3
+    }
+  }).sheetRefs;
+  return React__default.createElement(Section, {
+    addSeperation: true,
+    anchorId: anchorId,
+    bgColor: isInverted ? colors.sectionBg.dark : hasBg ? colors.sectionBg.medium : colors.sectionBg.light,
+    bgMode: mapToBgMode(bgMode, true)
+  }, React__default.createElement(Wrapper, {
+    addWhitespace: true
+  }, React__default.createElement(News, null, items === null || items === void 0 ? void 0 : items.map(function (item, i) {
+    var _a;
+
+    return React__default.createElement(NewsItem, {
+      key: i
+    }, React__default.createElement(NewsCard, __assign({
+      key: i,
+      ref: cardRefs[i]
+    }, item, {
+      isInverted: isInverted,
+      tags: (_a = item.tags) === null || _a === void 0 ? void 0 : _a.map(function (tag) {
+        var _a, _b;
+
+        var tagHref = undefined;
+
+        if (tag.name && ((_a = tag.link) === null || _a === void 0 ? void 0 : _a.href)) {
+          tagHref = getNewsFilterParams(tag.link.href, theme, [tag.name]);
+        }
+
+        return {
+          name: tag.name,
+          link: ((_b = tag.link) === null || _b === void 0 ? void 0 : _b.href) ? __assign(__assign({}, tag.link), {
+            href: tagHref
+          }) : undefined
+        };
+      }),
+      customTag: customTag
+    })));
+  }))));
+};
+var NewsList$1 = withLibTheme(NewsList);
+var templateObject_1, templateObject_2;
+
 export { NewsAuthorCard$1 as NewsAuthorCard, NewsFooter$1 as NewsFooter, NewsImages$1 as NewsImages, NewsIntro$1 as NewsIntro, NewsList$1 as NewsList, NewsOverview$1 as NewsOverview, NewsTable$1 as NewsTable, NewsText$1 as NewsText, NewsVideo$1 as NewsVideo };
 //# sourceMappingURL=sections_news.js.map