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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (257) hide show
  1. package/cjs/Actions-6dd616e0.js +2 -0
  2. package/cjs/Actions-6dd616e0.js.map +1 -0
  3. package/cjs/Bdot-d898ba3b.js +2 -0
  4. package/cjs/Bdot-d898ba3b.js.map +1 -0
  5. package/cjs/Button-72747f63.js +2 -0
  6. package/cjs/Button-72747f63.js.map +1 -0
  7. package/cjs/ButtonGhost-046437c5.js +2 -0
  8. package/cjs/ButtonGhost-046437c5.js.map +1 -0
  9. package/cjs/Control-eead1a4c.js +2 -0
  10. package/cjs/Control-eead1a4c.js.map +1 -0
  11. package/cjs/EventBlock-10b9d78d.js +2 -0
  12. package/cjs/EventBlock-10b9d78d.js.map +1 -0
  13. package/cjs/FileUpload-ece8bb07.js +2 -0
  14. package/cjs/FileUpload-ece8bb07.js.map +1 -0
  15. package/cjs/Filter-d6d90b8b.js +2 -0
  16. package/cjs/Filter-d6d90b8b.js.map +1 -0
  17. package/cjs/FilterField-cf9e2f16.js +2 -0
  18. package/cjs/FilterField-cf9e2f16.js.map +1 -0
  19. package/cjs/Grid-39b12e21.js +2 -0
  20. package/cjs/Grid-39b12e21.js.map +1 -0
  21. package/cjs/Image-d9681be0.js +2 -0
  22. package/cjs/Image-d9681be0.js.map +1 -0
  23. package/cjs/InfoList-577f3c57.js +2 -0
  24. package/cjs/InfoList-577f3c57.js.map +1 -0
  25. package/cjs/LanguageSwitcher-47e25e95.js +2 -0
  26. package/cjs/LanguageSwitcher-47e25e95.js.map +1 -0
  27. package/cjs/Navigation-3f5d6088.js +2 -0
  28. package/cjs/{Navigation-ebb27a9b.js.map → Navigation-3f5d6088.js.map} +1 -1
  29. package/cjs/POICard-492bf8d0.js +2 -0
  30. package/cjs/POICard-492bf8d0.js.map +1 -0
  31. package/cjs/Pointer-3588eadf.js +2 -0
  32. package/cjs/Pointer-3588eadf.js.map +1 -0
  33. package/cjs/SocialList-da77e994.js +2 -0
  34. package/cjs/SocialList-da77e994.js.map +1 -0
  35. package/cjs/TableBlock-a5b16e8f.js +2 -0
  36. package/cjs/TableBlock-a5b16e8f.js.map +1 -0
  37. package/cjs/Tag-5c72cc0d.js +2 -0
  38. package/cjs/Tag-5c72cc0d.js.map +1 -0
  39. package/cjs/VideoBlock-301997a9.js +2 -0
  40. package/cjs/VideoBlock-301997a9.js.map +1 -0
  41. package/cjs/VideoCard-405b518a.js +2 -0
  42. package/cjs/VideoCard-405b518a.js.map +1 -0
  43. package/cjs/Wrapper-91748bdb.js +2 -0
  44. package/cjs/Wrapper-91748bdb.js.map +1 -0
  45. package/cjs/base.js +1 -1
  46. package/cjs/blocks.js +1 -1
  47. package/cjs/buttons.js +1 -1
  48. package/cjs/cookies.js +1 -1
  49. package/cjs/cookies.js.map +1 -1
  50. package/cjs/escape-1ef8dd83.js +2 -0
  51. package/cjs/escape-1ef8dd83.js.map +1 -0
  52. package/cjs/fields.js +1 -1
  53. package/cjs/fields.js.map +1 -1
  54. package/cjs/footer.js +2 -0
  55. package/cjs/footer.js.map +1 -0
  56. package/cjs/hooks.js +1 -1
  57. package/cjs/hooks.js.map +1 -1
  58. package/cjs/navigation.js +1 -1
  59. package/cjs/navigation.js.map +1 -1
  60. package/cjs/sections.js +1 -1
  61. package/cjs/sections.js.map +1 -1
  62. package/cjs/sections_events.js +2 -0
  63. package/cjs/sections_events.js.map +1 -0
  64. package/cjs/sections_forms.js +2 -0
  65. package/cjs/sections_forms.js.map +1 -0
  66. package/cjs/sections_jobs.js +2 -0
  67. package/cjs/sections_jobs.js.map +1 -0
  68. package/cjs/sections_news.js +2 -0
  69. package/cjs/sections_news.js.map +1 -0
  70. package/cjs/sections_pois.js +2 -0
  71. package/cjs/sections_pois.js.map +1 -0
  72. package/cjs/statusFormatter-0393122b.js +2 -0
  73. package/cjs/statusFormatter-0393122b.js.map +1 -0
  74. package/cjs/structuredData-0b1278a9.js +2 -0
  75. package/cjs/structuredData-0b1278a9.js.map +1 -0
  76. package/cjs/urlParams-7525f638.js +2 -0
  77. package/cjs/urlParams-7525f638.js.map +1 -0
  78. package/cjs/useEqualSheetHeight-cfd4176e.js +2 -0
  79. package/cjs/useEqualSheetHeight-cfd4176e.js.map +1 -0
  80. package/cjs/useGeolocation-d8946470.js +2 -0
  81. package/cjs/useGeolocation-d8946470.js.map +1 -0
  82. package/cjs/useIE-aef9decc.js +2 -0
  83. package/cjs/useIE-aef9decc.js.map +1 -0
  84. package/cjs/useLazyInput-f71c221b.js +2 -0
  85. package/cjs/useLazyInput-f71c221b.js.map +1 -0
  86. package/cjs/useLeafletMap-2e608b01.js +2 -0
  87. package/cjs/useLeafletMap-2e608b01.js.map +1 -0
  88. package/cjs/useScrollTo-fdd665da.js +2 -0
  89. package/cjs/useScrollTo-fdd665da.js.map +1 -0
  90. package/esm/Actions-3f06c2e9.js +57 -0
  91. package/esm/Actions-3f06c2e9.js.map +1 -0
  92. package/esm/Bdot-fae262fc.js +24 -0
  93. package/esm/Bdot-fae262fc.js.map +1 -0
  94. package/esm/Button-ab1a4e79.js +115 -0
  95. package/esm/Button-ab1a4e79.js.map +1 -0
  96. package/esm/ButtonGhost-5b498dba.js +112 -0
  97. package/esm/ButtonGhost-5b498dba.js.map +1 -0
  98. package/esm/{Callout-03ad4c6e.js → Callout-389fed95.js} +4 -4
  99. package/esm/{Callout-03ad4c6e.js.map → Callout-389fed95.js.map} +1 -1
  100. package/esm/{Checkbox-76c2576b.js → Checkbox-957d8f33.js} +5 -5
  101. package/esm/{Checkbox-76c2576b.js.map → Checkbox-957d8f33.js.map} +1 -1
  102. package/esm/{ClockFilled-cff5900e.js → ClockFilled-6bae80dc.js} +2 -2
  103. package/esm/{ClockFilled-cff5900e.js.map → ClockFilled-6bae80dc.js.map} +1 -1
  104. package/esm/Control-57a287dc.js +52 -0
  105. package/esm/Control-57a287dc.js.map +1 -0
  106. package/esm/{Copy-d2be4fb7.js → Copy-fb124972.js} +4 -4
  107. package/esm/{Copy-d2be4fb7.js.map → Copy-fb124972.js.map} +1 -1
  108. package/esm/EventBlock-0109da13.js +132 -0
  109. package/esm/EventBlock-0109da13.js.map +1 -0
  110. package/esm/{FilterField-b1a28df7.js → FileUpload-4ba0a672.js} +48 -164
  111. package/esm/FileUpload-4ba0a672.js.map +1 -0
  112. package/esm/Filter-fec6dc5c.js +32 -0
  113. package/esm/Filter-fec6dc5c.js.map +1 -0
  114. package/esm/FilterField-03097694.js +129 -0
  115. package/esm/FilterField-03097694.js.map +1 -0
  116. package/esm/{Wrapper-38c912a6.js → Grid-151498da.js} +7 -224
  117. package/esm/Grid-151498da.js.map +1 -0
  118. package/esm/Image-b538f659.js +193 -0
  119. package/esm/Image-b538f659.js.map +1 -0
  120. package/esm/InfoList-616d17fd.js +74 -0
  121. package/esm/InfoList-616d17fd.js.map +1 -0
  122. package/esm/LanguageSwitcher-058e0145.js +70 -0
  123. package/esm/LanguageSwitcher-058e0145.js.map +1 -0
  124. package/esm/{LibThemeProvider-17012395.js → LibThemeProvider-a38c5bf1.js} +3 -3
  125. package/esm/{LibThemeProvider-17012395.js.map → LibThemeProvider-a38c5bf1.js.map} +1 -1
  126. package/esm/{Link-42f0b80f.js → Link-0a1e35d6.js} +3 -3
  127. package/esm/{Link-42f0b80f.js.map → Link-0a1e35d6.js.map} +1 -1
  128. package/esm/{Navigation-fae92776.js → Navigation-13dce48c.js} +10 -9
  129. package/esm/{Navigation-fae92776.js.map → Navigation-13dce48c.js.map} +1 -1
  130. package/esm/POICard-392a2c3a.js +116 -0
  131. package/esm/POICard-392a2c3a.js.map +1 -0
  132. package/esm/Pointer-bc68154f.js +111 -0
  133. package/esm/Pointer-bc68154f.js.map +1 -0
  134. package/esm/SocialList-4396cad9.js +61 -0
  135. package/esm/SocialList-4396cad9.js.map +1 -0
  136. package/esm/TableBlock-26530c71.js +159 -0
  137. package/esm/TableBlock-26530c71.js.map +1 -0
  138. package/esm/Tag-72424779.js +67 -0
  139. package/esm/Tag-72424779.js.map +1 -0
  140. package/esm/VideoBlock-b3f4ae27.js +624 -0
  141. package/esm/VideoBlock-b3f4ae27.js.map +1 -0
  142. package/esm/VideoCard-3fd368ef.js +160 -0
  143. package/esm/VideoCard-3fd368ef.js.map +1 -0
  144. package/esm/Wrapper-29347885.js +224 -0
  145. package/esm/Wrapper-29347885.js.map +1 -0
  146. package/esm/base.js +4 -3
  147. package/esm/base.js.map +1 -1
  148. package/esm/blocks.js +20 -11
  149. package/esm/blocks.js.map +1 -1
  150. package/esm/buttons.js +6 -4
  151. package/esm/buttons.js.map +1 -1
  152. package/esm/cookies.js +9 -8
  153. package/esm/cookies.js.map +1 -1
  154. package/esm/escape-cbff9c25.js +6 -0
  155. package/esm/escape-cbff9c25.js.map +1 -0
  156. package/esm/fields.js +12 -8
  157. package/esm/fields.js.map +1 -1
  158. package/esm/footer.js +301 -0
  159. package/esm/footer.js.map +1 -0
  160. package/esm/hooks.js +14 -9
  161. package/esm/hooks.js.map +1 -1
  162. package/esm/icons.js +1 -1
  163. package/esm/index.js +3 -3
  164. package/esm/{navigation-e135836f.js → navigation-a2998143.js} +2 -2
  165. package/esm/{navigation-e135836f.js.map → navigation-a2998143.js.map} +1 -1
  166. package/esm/navigation.js +12 -10
  167. package/esm/navigation.js.map +1 -1
  168. package/esm/sections.js +2623 -7275
  169. package/esm/sections.js.map +1 -1
  170. package/esm/sections_events.js +573 -0
  171. package/esm/sections_events.js.map +1 -0
  172. package/esm/sections_forms.js +1405 -0
  173. package/esm/sections_forms.js.map +1 -0
  174. package/esm/sections_jobs.js +508 -0
  175. package/esm/sections_jobs.js.map +1 -0
  176. package/esm/sections_news.js +1023 -0
  177. package/esm/sections_news.js.map +1 -0
  178. package/esm/sections_pois.js +719 -0
  179. package/esm/sections_pois.js.map +1 -0
  180. package/esm/{Actions-59bdbbf7.js → statusFormatter-9be0fbff.js} +2 -57
  181. package/esm/statusFormatter-9be0fbff.js.map +1 -0
  182. package/esm/structuredData-87423414.js +117 -0
  183. package/esm/structuredData-87423414.js.map +1 -0
  184. package/esm/{styles-eca3acc8.js → styles-f6c54818.js} +2 -2
  185. package/esm/{styles-eca3acc8.js.map → styles-f6c54818.js.map} +1 -1
  186. package/esm/typography.js +6 -6
  187. package/esm/urlParams-9cfdaf71.js +51 -0
  188. package/esm/urlParams-9cfdaf71.js.map +1 -0
  189. package/esm/{useCookieConsent-cd262961.js → useCookieConsent-8caef116.js} +2 -2
  190. package/esm/{useCookieConsent-cd262961.js.map → useCookieConsent-8caef116.js.map} +1 -1
  191. package/esm/{urlParams-c16d7370.js → useEqualSheetHeight-c18cebd3.js} +4 -116
  192. package/esm/useEqualSheetHeight-c18cebd3.js.map +1 -0
  193. package/esm/useGeolocation-f9f073cc.js +95 -0
  194. package/esm/useGeolocation-f9f073cc.js.map +1 -0
  195. package/esm/useIE-a9c56989.js +15 -0
  196. package/esm/useIE-a9c56989.js.map +1 -0
  197. package/esm/useLazyInput-e66fc5be.js +85 -0
  198. package/esm/useLazyInput-e66fc5be.js.map +1 -0
  199. package/esm/{useGeolocation-c99d76bd.js → useLeafletMap-6dea7a8e.js} +4 -175
  200. package/esm/useLeafletMap-6dea7a8e.js.map +1 -0
  201. package/esm/{useMediaQuery-07eee3f4.js → useMediaQuery-0d473a9c.js} +2 -2
  202. package/esm/{useMediaQuery-07eee3f4.js.map → useMediaQuery-0d473a9c.js.map} +1 -1
  203. package/esm/useScrollTo-70af34bf.js +57 -0
  204. package/esm/useScrollTo-70af34bf.js.map +1 -0
  205. package/footer/package.json +7 -0
  206. package/package.json +2 -1
  207. package/sections/events/package.json +7 -0
  208. package/sections/forms/package.json +7 -0
  209. package/sections/jobs/package.json +7 -0
  210. package/sections/news/package.json +7 -0
  211. package/sections/pois/package.json +7 -0
  212. package/types/footer.d.ts +4 -0
  213. package/types/footer.d.ts.map +1 -0
  214. package/types/sections.d.ts +0 -23
  215. package/types/sections.d.ts.map +1 -1
  216. package/types/sections_events.d.ts +4 -0
  217. package/types/sections_events.d.ts.map +1 -0
  218. package/types/sections_forms.d.ts +3 -0
  219. package/types/sections_forms.d.ts.map +1 -0
  220. package/types/sections_jobs.d.ts +3 -0
  221. package/types/sections_jobs.d.ts.map +1 -0
  222. package/types/sections_news.d.ts +10 -0
  223. package/types/sections_news.d.ts.map +1 -0
  224. package/types/sections_pois.d.ts +4 -0
  225. package/types/sections_pois.d.ts.map +1 -0
  226. package/cjs/Actions-487104b2.js +0 -2
  227. package/cjs/Actions-487104b2.js.map +0 -1
  228. package/cjs/Bdot-760e0e3a.js +0 -2
  229. package/cjs/Bdot-760e0e3a.js.map +0 -1
  230. package/cjs/ButtonGhost-e9644acd.js +0 -2
  231. package/cjs/ButtonGhost-e9644acd.js.map +0 -1
  232. package/cjs/Control-23259241.js +0 -2
  233. package/cjs/Control-23259241.js.map +0 -1
  234. package/cjs/FilterField-569d60e5.js +0 -2
  235. package/cjs/FilterField-569d60e5.js.map +0 -1
  236. package/cjs/Navigation-ebb27a9b.js +0 -2
  237. package/cjs/SocialList-79ddf9d6.js +0 -2
  238. package/cjs/SocialList-79ddf9d6.js.map +0 -1
  239. package/cjs/Wrapper-3b9c9e89.js +0 -2
  240. package/cjs/Wrapper-3b9c9e89.js.map +0 -1
  241. package/cjs/urlParams-51ce7168.js +0 -2
  242. package/cjs/urlParams-51ce7168.js.map +0 -1
  243. package/cjs/useGeolocation-4d38150b.js +0 -2
  244. package/cjs/useGeolocation-4d38150b.js.map +0 -1
  245. package/esm/Actions-59bdbbf7.js.map +0 -1
  246. package/esm/Bdot-a103eeef.js +0 -1141
  247. package/esm/Bdot-a103eeef.js.map +0 -1
  248. package/esm/ButtonGhost-422fd723.js +0 -220
  249. package/esm/ButtonGhost-422fd723.js.map +0 -1
  250. package/esm/Control-52ff8784.js +0 -157
  251. package/esm/Control-52ff8784.js.map +0 -1
  252. package/esm/FilterField-b1a28df7.js.map +0 -1
  253. package/esm/SocialList-385cde53.js +0 -307
  254. package/esm/SocialList-385cde53.js.map +0 -1
  255. package/esm/Wrapper-38c912a6.js.map +0 -1
  256. package/esm/urlParams-c16d7370.js.map +0 -1
  257. package/esm/useGeolocation-c99d76bd.js.map +0 -1
@@ -1,1141 +0,0 @@
1
- import { a as __makeTemplateObject, _ as __assign, f as __awaiter, g as __generator, e as __spreadArray, u as Check } from './ClockFilled-cff5900e.js';
2
- import * as React from 'react';
3
- import React__default, { useMemo, useState, useEffect, useRef, forwardRef, useImperativeHandle } from 'react';
4
- import styled, { css } from 'styled-components';
5
- import { s as spacings, m as mq, g as getColors, a as getFonts, c as getGlobals } from './styles-eca3acc8.js';
6
- import { H as Heading, C as Copy, c as copyStyle } from './Copy-d2be4fb7.js';
7
- import { u as useLibTheme } from './LibThemeProvider-17012395.js';
8
- import { A as Actions, S as StatusFormatter } from './Actions-59bdbbf7.js';
9
- import { I as Image } from './SocialList-385cde53.js';
10
- import { L as Link } from './Link-42f0b80f.js';
11
- import { i as isValidArray } from './arrays-65b644ef.js';
12
- import { u as useMediaQuery } from './useMediaQuery-07eee3f4.js';
13
- import { c as clampValue } from './clamp-12d37b65.js';
14
- import { u as useObserverSupport } from './useObserverSupport-02bce7f5.js';
15
- import { u as useUpdateEffect } from './useUpdateEffect-824c0c84.js';
16
-
17
- var View$7 = styled.div.withConfig({
18
- displayName: "Title__View",
19
- componentId: "sc-1pyc768-0"
20
- })(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n display: block;\n text-align: ", ";\n margin: ", ";\n\n & > * + * {\n margin-top: ", "px;\n }\n"], ["\n display: block;\n text-align: ", ";\n margin: ", ";\n\n & > * + * {\n margin-top: ", "px;\n }\n"])), function (_a) {
21
- var isCentered = _a.isCentered;
22
- return isCentered ? 'center' : 'left';
23
- }, function (_a) {
24
- var isCentered = _a.isCentered;
25
- return isCentered && '0 auto';
26
- }, spacings.nudge * 2);
27
- var SuperTitle = styled(Heading).withConfig({
28
- displayName: "Title__SuperTitle",
29
- componentId: "sc-1pyc768-1"
30
- })(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n display: block;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n display: -webkit-box;\n -webkit-line-clamp: 2; /* number of lines to show */\n line-clamp: 2;\n -webkit-box-orient: vertical;\n"], ["\n display: block;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n display: -webkit-box;\n -webkit-line-clamp: 2; /* number of lines to show */\n line-clamp: 2;\n -webkit-box-orient: vertical;\n"])));
31
- var MainTitle = styled(Heading).withConfig({
32
- displayName: "Title__MainTitle",
33
- componentId: "sc-1pyc768-2"
34
- })(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n display: block;\n\n ", "\n"], ["\n display: block;\n\n ", "\n"])), function (_a) {
35
- var maxLines = _a.maxLines;
36
- return maxLines && maxLines > 0 && css(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: ", "; /* number of lines to show */\n line-clamp: ", ";\n -webkit-box-orient: vertical;\n "], ["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: ", "; /* number of lines to show */\n line-clamp: ", ";\n -webkit-box-orient: vertical;\n "])), maxLines, maxLines);
37
- });
38
-
39
- var Title$2 = function (_a) {
40
- var _b = _a.colorMode,
41
- colorMode = _b === void 0 ? 'default' : _b,
42
- superTitle = _a.superTitle,
43
- superTitleAs = _a.superTitleAs,
44
- title = _a.title,
45
- titleAs = _a.titleAs,
46
- _c = _a.titleSize,
47
- titleSize = _c === void 0 ? 'heading-2' : _c,
48
- maxLines = _a.maxLines,
49
- _d = _a.isCentered,
50
- isCentered = _d === void 0 ? false : _d,
51
- titleHyphens = _a.titleHyphens,
52
- className = _a.className;
53
- var colors = useLibTheme().colors;
54
- return React__default.createElement(View$7, {
55
- isCentered: isCentered,
56
- className: className
57
- }, superTitle && React__default.createElement(SuperTitle, {
58
- renderAs: superTitleAs || 'div',
59
- size: "super",
60
- textColor: colorMode === 'onImage' ? colors.text.inverted : undefined,
61
- isInverted: colorMode === 'inverted',
62
- innerHTML: superTitle
63
- }), title && React__default.createElement(MainTitle, {
64
- renderAs: titleAs || 'h2',
65
- size: titleSize === 'heading-1' ? 'heading-1' : 'heading-2',
66
- hyphens: titleHyphens,
67
- textColor: colorMode === 'onImage' ? colors.text.inverted : undefined,
68
- isInverted: colorMode === 'inverted',
69
- innerHTML: title,
70
- maxLines: maxLines
71
- }));
72
- };
73
- var templateObject_1$c, templateObject_2$b, templateObject_3$9, templateObject_4$5;
74
-
75
- var View$6 = styled.div.withConfig({
76
- displayName: "IntroBlock__View",
77
- componentId: "sc-w71lok-0"
78
- })(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: block;\n margin: 0;\n padding: 0;\n width: 100%;\n text-align: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: row;\n\n & > * + * {\n margin-left: ", "px;\n }\n }\n"], ["\n display: block;\n margin: 0;\n padding: 0;\n width: 100%;\n text-align: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: row;\n\n & > * + * {\n margin-left: ", "px;\n }\n }\n"])), function (_a) {
79
- var isCentered = _a.isCentered;
80
- return isCentered && 'center';
81
- }, mq.semilarge, spacings.spacer);
82
- var Content$1 = styled.div.withConfig({
83
- displayName: "IntroBlock__Content",
84
- componentId: "sc-w71lok-1"
85
- })(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n & > * + * {\n margin-top: ", "px;\n }\n\n max-width: 100%;\n\n @media ", " {\n flex: 1 0 66.66%;\n }\n"], ["\n & > * + * {\n margin-top: ", "px;\n }\n\n max-width: 100%;\n\n @media ", " {\n flex: 1 0 66.66%;\n }\n"])), spacings.spacer, mq.semilarge);
86
- var StyledTitle = styled(Title$2).withConfig({
87
- displayName: "IntroBlock__StyledTitle",
88
- componentId: "sc-w71lok-2"
89
- })(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n max-width: ", ";\n"], ["\n max-width: ", ";\n"])), function (_a) {
90
- var clamp = _a.clamp;
91
- return clamp && '880px';
92
- });
93
- var ContentBlock = styled(Copy).withConfig({
94
- displayName: "IntroBlock__ContentBlock",
95
- componentId: "sc-w71lok-3"
96
- })(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n display: block;\n max-width: ", ";\n margin-left: ", ";\n margin-right: ", ";\n\n ", "\n\n & + & {\n margin-top: ", "px;\n }\n"], ["\n display: block;\n max-width: ", ";\n margin-left: ", ";\n margin-right: ", ";\n\n ", "\n\n & + & {\n margin-top: ", "px;\n }\n"])), function (_a) {
97
- var clamp = _a.clamp;
98
- return clamp && '880px';
99
- }, function (_a) {
100
- var isCentered = _a.isCentered;
101
- return isCentered && 'auto';
102
- }, function (_a) {
103
- var isCentered = _a.isCentered;
104
- return isCentered && 'auto';
105
- }, function (_a) {
106
- var maxLines = _a.maxLines;
107
- return maxLines && maxLines > 0 && css(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: ", "; /* number of lines to show */\n line-clamp: ", ";\n -webkit-box-orient: vertical;\n "], ["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: ", "; /* number of lines to show */\n line-clamp: ", ";\n -webkit-box-orient: vertical;\n "])), maxLines, maxLines);
108
- }, spacings.nudge * 3);
109
- var StyledActions = styled(Actions).withConfig({
110
- displayName: "IntroBlock__StyledActions",
111
- componentId: "sc-w71lok-4"
112
- })(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n @media ", " {\n display: block;\n text-align: ", ";\n }\n"], ["\n @media ", " {\n display: block;\n text-align: ", ";\n }\n"])), mq.medium, function (_a) {
113
- var isCentered = _a.isCentered;
114
- return isCentered && 'center';
115
- });
116
- var MobileImageContainer = styled.div.withConfig({
117
- displayName: "IntroBlock__MobileImageContainer",
118
- componentId: "sc-w71lok-5"
119
- })(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-width: 400px;\n max-height: 400px;\n text-align: center;\n\n margin: 0 auto;\n margin-top: ", "px;\n\n @media ", " {\n display: ", ";\n }\n"], ["\n width: 100%;\n height: 100%;\n max-width: 400px;\n max-height: 400px;\n text-align: center;\n\n margin: 0 auto;\n margin-top: ", "px;\n\n @media ", " {\n display: ", ";\n }\n"])), spacings.spacer, mq.semilarge, function (_a) {
120
- var isCentered = _a.isCentered;
121
- return isCentered ? 'block' : 'none';
122
- });
123
- var DesktopImageContainer = styled.div.withConfig({
124
- displayName: "IntroBlock__DesktopImageContainer",
125
- componentId: "sc-w71lok-6"
126
- })(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n display: none;\n width: 100%;\n\n @media ", " {\n display: block;\n /* flex: 1 0 33.33%; */\n\n max-width: 400px;\n }\n"], ["\n display: none;\n width: 100%;\n\n @media ", " {\n display: block;\n /* flex: 1 0 33.33%; */\n\n max-width: 400px;\n }\n"])), mq.semilarge);
127
-
128
- var IntroBlock = function (_a) {
129
- var _b = _a.renderAs,
130
- renderAs = _b === void 0 ? 'div' : _b,
131
- _c = _a.colorMode,
132
- colorMode = _c === void 0 ? 'default' : _c,
133
- title = _a.title,
134
- titleAs = _a.titleAs,
135
- _d = _a.titleSize,
136
- titleSize = _d === void 0 ? 'heading-2' : _d,
137
- superTitle = _a.superTitle,
138
- superTitleAs = _a.superTitleAs,
139
- abstract = _a.abstract,
140
- text = _a.text,
141
- _e = _a.textType,
142
- textType = _e === void 0 ? 'copy' : _e,
143
- _f = _a.textSize,
144
- textSize = _f === void 0 ? 'medium' : _f,
145
- primaryAction = _a.primaryAction,
146
- secondaryAction = _a.secondaryAction,
147
- _g = _a.isCentered,
148
- isCentered = _g === void 0 ? false : _g,
149
- _h = _a.clampTitle,
150
- clampTitle = _h === void 0 ? false : _h,
151
- _j = _a.clampAbstract,
152
- clampAbstract = _j === void 0 ? false : _j,
153
- maxTitleLines = _a.maxTitleLines,
154
- maxAbstractLines = _a.maxAbstractLines,
155
- _k = _a.clampText,
156
- clampText = _k === void 0 ? false : _k,
157
- maxTextLines = _a.maxTextLines,
158
- className = _a.className,
159
- titleHyphens = _a.titleHyphens,
160
- image = _a.image;
161
- var isInverted = colorMode === 'inverted' || colorMode === 'onImage';
162
- var coverSpace = (image === null || image === void 0 ? void 0 : image.coverSpace) === false ? false : true;
163
- return React__default.createElement(View$6, {
164
- as: renderAs,
165
- isCentered: isCentered,
166
- className: className
167
- }, React__default.createElement(Content$1, null, (title || superTitle) && React__default.createElement(StyledTitle, {
168
- colorMode: colorMode,
169
- title: title,
170
- titleAs: titleAs,
171
- titleSize: titleSize,
172
- superTitle: superTitle,
173
- superTitleAs: superTitleAs,
174
- isCentered: isCentered,
175
- clamp: clampTitle,
176
- maxLines: maxTitleLines,
177
- titleHyphens: titleHyphens
178
- }), (image === null || image === void 0 ? void 0 : image.small) && React__default.createElement(MobileImageContainer, {
179
- isCentered: isCentered
180
- }, React__default.createElement(Image, __assign({}, image, {
181
- coverSpace: coverSpace,
182
- allowEdgeRadius: true,
183
- isInverted: isInverted
184
- }))), abstract && React__default.createElement(ContentBlock, {
185
- type: "copy",
186
- size: "big",
187
- textColor: colorMode === 'onImage' ? '#fff' : undefined,
188
- isInverted: isInverted,
189
- isCentered: isCentered,
190
- innerHTML: abstract,
191
- clamp: clampAbstract,
192
- maxLines: maxAbstractLines
193
- }), text && React__default.createElement(ContentBlock, {
194
- type: textType,
195
- size: textSize,
196
- textColor: colorMode === 'onImage' ? '#fff' : undefined,
197
- isInverted: isInverted,
198
- isCentered: isCentered,
199
- innerHTML: text,
200
- clamp: clampText,
201
- maxLines: maxTextLines
202
- }), (primaryAction || secondaryAction) && React__default.createElement(StyledActions, {
203
- primary: primaryAction && primaryAction(isInverted),
204
- secondary: secondaryAction && secondaryAction(isInverted)
205
- })), (image === null || image === void 0 ? void 0 : image.small) && !isCentered && React__default.createElement(DesktopImageContainer, null, React__default.createElement(Image, __assign({}, image, {
206
- coverSpace: coverSpace,
207
- allowEdgeRadius: true,
208
- isInverted: isInverted
209
- }))));
210
- };
211
- var templateObject_1$b, templateObject_2$a, templateObject_3$8, templateObject_4$4, templateObject_5$4, templateObject_6$4, templateObject_7$3, templateObject_8$1;
212
-
213
- var View$5 = styled(Link).withConfig({
214
- displayName: "Tag__View",
215
- componentId: "sc-1mw8uhi-0"
216
- })(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n display: inline-block;\n border: 1px solid\n ", ";\n border-radius: 8px;\n\n padding: 1px ", "px;\n max-height: 28px;\n min-width: 60px;\n user-select: none;\n\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: center;\n\n text-decoration: none;\n\n ", "\n\n background: none;\n\n && {\n background-color: ", ";\n color: ", ";\n\n transition: background-color 0.2s ease-in-out, color 0.1s ease-in-out;\n }\n\n cursor: ", ";\n\n ", "\n\n &:focus {\n /* background-color: ", ";\n color: ", "; */\n outline: 2px solid\n ", ";\n outline-offset: -1px;\n text-decoration: underline;\n }\n\n &:focus:not(:focus-visible) {\n outline: none;\n text-decoration: none;\n }\n"], ["\n display: inline-block;\n border: 1px solid\n ", ";\n border-radius: 8px;\n\n padding: 1px ", "px;\n max-height: 28px;\n min-width: 60px;\n user-select: none;\n\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: center;\n\n text-decoration: none;\n\n ", "\n\n background: none;\n\n && {\n background-color: ", ";\n color: ", ";\n\n transition: background-color 0.2s ease-in-out, color 0.1s ease-in-out;\n }\n\n cursor: ", ";\n\n ", "\n\n &:focus {\n /* background-color: ", ";\n color: ", "; */\n outline: 2px solid\n ", ";\n outline-offset: -1px;\n text-decoration: underline;\n }\n\n &:focus:not(:focus-visible) {\n outline: none;\n text-decoration: none;\n }\n"])), function (_a) {
217
- var isInverted = _a.isInverted;
218
- return isInverted ? '#dddddd' : '#444444';
219
- }, spacings.nudge, copyStyle('copy', 'small'), function (_a) {
220
- var isActive = _a.isActive,
221
- isInverted = _a.isInverted;
222
- return isActive && (isInverted ? '#dddddd' : '#444444');
223
- }, function (_a) {
224
- var isActive = _a.isActive,
225
- isInverted = _a.isInverted;
226
-
227
- if (isActive) {
228
- return isInverted ? '#444444' : '#ffff';
229
- } else {
230
- return isInverted ? '#dddddd' : '#444444';
231
- }
232
- }, function (_a) {
233
- var isClickable = _a.isClickable;
234
- return isClickable ? 'pointer' : 'default';
235
- }, function (_a) {
236
- var isClickable = _a.isClickable,
237
- isInverted = _a.isInverted;
238
- return isClickable && css(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n @media (hover: hover) and (pointer: fine) {\n &&:hover {\n background-color: ", ";\n color: ", ";\n }\n }\n "], ["\n @media (hover: hover) and (pointer: fine) {\n &&:hover {\n background-color: ", ";\n color: ", ";\n }\n }\n "])), isInverted ? '#dddddd' : '#444444', isInverted ? '#444444' : '#ffff');
239
- }, function (_a) {
240
- var isInverted = _a.isInverted;
241
- return isInverted ? '#dddddd' : '#444444';
242
- }, function (_a) {
243
- var isInverted = _a.isInverted;
244
- return isInverted ? '#444444' : '#ffff';
245
- }, function (_a) {
246
- var isInverted = _a.isInverted,
247
- theme = _a.theme;
248
- return isInverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
249
- });
250
-
251
- var Tag = function (_a) {
252
- var name = _a.name,
253
- link = _a.link,
254
- isInverted = _a.isInverted,
255
- isActive = _a.isActive,
256
- onClick = _a.onClick,
257
- className = _a.className,
258
- children = _a.children;
259
- var tag = (link === null || link === void 0 ? void 0 : link.href) ? 'a' : onClick ? 'button' : 'span';
260
- return React__default.createElement(View$5, __assign({
261
- as: tag,
262
- isInverted: isInverted,
263
- isActive: isActive,
264
- onClick: onClick,
265
- isClickable: !!onClick || !!(link && link.href),
266
- className: className
267
- }, link), name || children);
268
- };
269
- var templateObject_1$a, templateObject_2$9;
270
-
271
- var View$4 = styled.div.withConfig({
272
- displayName: "EventBlock__View",
273
- componentId: "sc-1nnq189-0"
274
- })(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n text-decoration: none;\n color: inherit;\n\n & > * + * {\n margin-top: ", "px;\n }\n\n @media ", " {\n display: flex;\n justify-content: flex-end;\n flex-direction: row-reverse;\n\n & > * + * {\n margin-top: 0;\n padding-right: ", "px;\n }\n }\n"], ["\n text-decoration: none;\n color: inherit;\n\n & > * + * {\n margin-top: ", "px;\n }\n\n @media ", " {\n display: flex;\n justify-content: flex-end;\n flex-direction: row-reverse;\n\n & > * + * {\n margin-top: 0;\n padding-right: ", "px;\n }\n }\n"])), spacings.nudge * 3, mq.large, spacings.spacer);
275
- var ImageContainer = styled.div.withConfig({
276
- displayName: "EventBlock__ImageContainer",
277
- componentId: "sc-1nnq189-1"
278
- })(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n flex: 0 1 30%;\n margin-left: auto;\n"], ["\n flex: 0 1 30%;\n margin-left: auto;\n"])));
279
- var MainContent = styled.div.withConfig({
280
- displayName: "EventBlock__MainContent",
281
- componentId: "sc-1nnq189-2"
282
- })(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n flex: 0 1 70%;\n\n & > * + * {\n margin-top: ", "px;\n }\n\n @media ", " {\n max-width: 830px;\n }\n"], ["\n flex: 0 1 70%;\n\n & > * + * {\n margin-top: ", "px;\n }\n\n @media ", " {\n max-width: 830px;\n }\n"])), spacings.nudge * 3, mq.large);
283
- var TagContainer = styled.div.withConfig({
284
- displayName: "EventBlock__TagContainer",
285
- componentId: "sc-1nnq189-3"
286
- })(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n margin-top: -", "px;\n margin-left: -", "px;\n\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n"], ["\n margin-top: -", "px;\n margin-left: -", "px;\n\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n"])), spacings.nudge, spacings.nudge);
287
- var TitleWrapper = styled.div.withConfig({
288
- displayName: "EventBlock__TitleWrapper",
289
- componentId: "sc-1nnq189-4"
290
- })(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n & > * + * {\n margin-top: ", "px;\n }\n"], ["\n & > * + * {\n margin-top: ", "px;\n }\n"])), spacings.nudge);
291
- var TagWrapper = styled.div.withConfig({
292
- displayName: "EventBlock__TagWrapper",
293
- componentId: "sc-1nnq189-5"
294
- })(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n padding-top: ", "px;\n padding-left: ", "px;\n"], ["\n padding-top: ", "px;\n padding-left: ", "px;\n"])), spacings.nudge, spacings.nudge);
295
- var TitleLink = styled(Link).withConfig({
296
- displayName: "EventBlock__TitleLink",
297
- componentId: "sc-1nnq189-6"
298
- })(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n display: inline-block;\n ", "\n\n color: ", ";\n text-decoration: none;\n"], ["\n display: inline-block;\n ", "\n\n color: ", ";\n text-decoration: none;\n"])), copyStyle('copy-b', 'big'), function (_a) {
299
- var theme = _a.theme,
300
- isInverted = _a.isInverted;
301
- return isInverted ? getFonts(theme)['copy-b'].big.colorInverted : getFonts(theme)['copy-b'].big.color;
302
- });
303
- var Text = styled(Copy).withConfig({
304
- displayName: "EventBlock__Text",
305
- componentId: "sc-1nnq189-7"
306
- })(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n display: -webkit-box;\n -webkit-line-clamp: 4;\n -webkit-box-orient: vertical;\n overflow: hidden;\n"], ["\n display: -webkit-box;\n -webkit-line-clamp: 4;\n -webkit-box-orient: vertical;\n overflow: hidden;\n"])));
307
-
308
- var EventBlock = function (_a) {
309
- var customTag = _a.customTag,
310
- onTagClick = _a.onTagClick,
311
- title = _a.title,
312
- image = _a.image,
313
- date = _a.date,
314
- text = _a.text,
315
- link = _a.link,
316
- tags = _a.tags,
317
- isInverted = _a.isInverted,
318
- action = _a.action;
319
- var globals = useLibTheme().globals;
320
- var publishedAt = '';
321
-
322
- if (date) {
323
- var formatter = new StatusFormatter(date.getTime(), '', globals.sections.eventDateFormat(date), globals.sections.eventTimeFormat(date), globals.sections.eventLocaleKey);
324
- publishedAt = formatter.getFormattedDate();
325
- }
326
-
327
- var handleTagClick = function (tag) {
328
- return onTagClick ? function (ev) {
329
- ev === null || ev === void 0 ? void 0 : ev.preventDefault();
330
- onTagClick(tag);
331
- } : undefined;
332
- };
333
-
334
- var filteredTags = useMemo(function () {
335
- return tags === null || tags === void 0 ? void 0 : tags.filter(function (tag) {
336
- return tag.name;
337
- });
338
- }, [tags]);
339
- return React__default.createElement(View$4, null, (image === null || image === void 0 ? void 0 : image.small) && React__default.createElement(ImageContainer, null, React__default.createElement(Image, __assign({}, image, {
340
- coverSpace: true,
341
- allowEdgeRadius: true,
342
- isInverted: isInverted,
343
- ratios: {
344
- small: {
345
- w: 640,
346
- h: 320
347
- },
348
- medium: {
349
- w: 752,
350
- h: 276
351
- },
352
- large: {
353
- w: 375,
354
- h: 250
355
- }
356
- }
357
- }))), React__default.createElement(MainContent, null, isValidArray(filteredTags, false) && React__default.createElement(TagContainer, null, filteredTags.map(function (tag, i) {
358
- return tag && React__default.createElement(TagWrapper, {
359
- key: 'tag_' + i
360
- }, customTag ? customTag({
361
- key: 'tag_' + i,
362
- name: tag.name || '',
363
- isInverted: isInverted,
364
- isActive: false,
365
- link: tag.link || {},
366
- clickHandler: handleTagClick(tag)
367
- }) : React__default.createElement(Tag, {
368
- isInverted: isInverted,
369
- name: tag.name,
370
- link: tag.link,
371
- onClick: handleTagClick(tag)
372
- }));
373
- })), React__default.createElement(TitleWrapper, null, date && React__default.createElement(Copy, {
374
- isInverted: isInverted,
375
- size: "medium",
376
- type: "copy"
377
- }, publishedAt), title && React__default.createElement(TitleLink, __assign({}, link, {
378
- isInverted: isInverted
379
- }), title)), text && React__default.createElement(Text, {
380
- size: "small",
381
- isInverted: isInverted,
382
- innerHTML: text
383
- }), action && React__default.createElement("div", null, " ", action({
384
- isInverted: isInverted
385
- }), " ")));
386
- };
387
- var templateObject_1$9, templateObject_2$8, templateObject_3$7, templateObject_4$3, templateObject_5$3, templateObject_6$3, templateObject_7$2, templateObject_8;
388
-
389
- var View$3 = styled.div.withConfig({
390
- displayName: "InfoList__View",
391
- componentId: "sc-1bggeo0-0"
392
- })(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject([""], [""])));
393
- var Container = styled.ul.withConfig({
394
- displayName: "InfoList__Container",
395
- componentId: "sc-1bggeo0-1"
396
- })(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n\n margin: 0;\n padding: 0;\n margin-left: -", "px;\n margin-top: -", "px;\n list-style: none;\n"], ["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n\n margin: 0;\n padding: 0;\n margin-left: -", "px;\n margin-top: -", "px;\n list-style: none;\n"])), spacings.spacer, spacings.nudge * 5);
397
- var Item = styled.li.withConfig({
398
- displayName: "InfoList__Item",
399
- componentId: "sc-1bggeo0-2"
400
- })(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n flex: 1 1 100%;\n padding-left: ", "px;\n padding-top: ", "px;\n\n @media ", " {\n flex: 1 1 300px;\n }\n"], ["\n flex: 1 1 100%;\n padding-left: ", "px;\n padding-top: ", "px;\n\n @media ", " {\n flex: 1 1 300px;\n }\n"])), spacings.spacer, spacings.nudge * 5, mq.medium);
401
- var Title$1 = styled(Copy).withConfig({
402
- displayName: "InfoList__Title",
403
- componentId: "sc-1bggeo0-3"
404
- })(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n display: block;\n margin-bottom: ", "px;\n"], ["\n display: block;\n margin-bottom: ", "px;\n"])), spacings.nudge * 3);
405
- var Infos = styled.ul.withConfig({
406
- displayName: "InfoList__Infos",
407
- componentId: "sc-1bggeo0-4"
408
- })(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n list-style: none;\n margin: 0;\n padding: 0;\n"], ["\n list-style: none;\n margin: 0;\n padding: 0;\n"])));
409
- var Content = styled.li.withConfig({
410
- displayName: "InfoList__Content",
411
- componentId: "sc-1bggeo0-5"
412
- })(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n display: -ms-grid;\n display: grid;\n margin: 0;\n\n -ms-grid-columns: min-content 1fr;\n grid-template-columns: min-content 1fr;\n -ms-grid-rows: min-content 1fr;\n grid-auto-rows: min-content 1fr;\n\n & + & {\n margin-top: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"], ["\n display: -ms-grid;\n display: grid;\n margin: 0;\n\n -ms-grid-columns: min-content 1fr;\n grid-template-columns: min-content 1fr;\n -ms-grid-rows: min-content 1fr;\n grid-auto-rows: min-content 1fr;\n\n & + & {\n margin-top: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"])), spacings.nudge * 2, spacings.nudge * 2);
413
- var Icon = styled(Copy).withConfig({
414
- displayName: "InfoList__Icon",
415
- componentId: "sc-1bggeo0-6"
416
- })(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n height: 20px;\n width: 20px;\n\n & > * {\n height: 20px;\n width: 20px;\n }\n"], ["\n height: 20px;\n width: 20px;\n\n & > * {\n height: 20px;\n width: 20px;\n }\n"])));
417
-
418
- var InfoList = function (_a) {
419
- var isInverted = _a.isInverted,
420
- items = _a.items,
421
- className = _a.className;
422
- return React__default.createElement(View$3, {
423
- className: className
424
- }, React__default.createElement(Container, null, items === null || items === void 0 ? void 0 : items.map(function (group, i) {
425
- var _a;
426
-
427
- var groupItems = ((_a = group === null || group === void 0 ? void 0 : group.items) === null || _a === void 0 ? void 0 : _a.filter(function (item) {
428
- return item.text;
429
- })) || [];
430
- var hasItems = isValidArray(groupItems, false);
431
- return React__default.createElement(Item, {
432
- key: i
433
- }, group.title && React__default.createElement(Title$1, {
434
- size: "small",
435
- type: "copy-b",
436
- renderAs: "span",
437
- isInverted: isInverted
438
- }, group.title), hasItems && React__default.createElement(Infos, null, groupItems.map(function (info, ii) {
439
- return React__default.createElement(Content, {
440
- key: ii
441
- }, React__default.createElement(Icon, {
442
- isInverted: isInverted
443
- }, info.icon && info.icon(isInverted)), info.text && React__default.createElement(Copy, {
444
- size: "small",
445
- isInverted: isInverted,
446
- innerHTML: info.text,
447
- allowLinkIcons: false
448
- }));
449
- })));
450
- })));
451
- };
452
- var templateObject_1$8, templateObject_2$7, templateObject_3$6, templateObject_4$2, templateObject_5$2, templateObject_6$2, templateObject_7$1;
453
-
454
- var AnimationContainer = styled.div.withConfig({
455
- displayName: "HeaderKenBurns__AnimationContainer",
456
- componentId: "sc-1hmc5d0-0"
457
- })(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n overflow: hidden;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n overflow: hidden;\n"])));
458
- var PosterImage = styled(Image).withConfig({
459
- displayName: "HeaderKenBurns__PosterImage",
460
- componentId: "sc-1hmc5d0-1"
461
- })(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n\n height: 100%;\n width: 100%;\n\n img {\n height: 100%;\n }\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n\n height: 100%;\n width: 100%;\n\n img {\n height: 100%;\n }\n"])));
462
- var AnimationImage = styled.img.withConfig({
463
- displayName: "HeaderKenBurns__AnimationImage",
464
- componentId: "sc-1hmc5d0-2"
465
- })(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n\n object-fit: cover;\n object-position: center;\n\n transition-property: opacity, transform;\n transition-duration: ", ";\n transition-delay: ", ";\n\n opacity: ", ";\n transform: scale(", ")\n rotate(", "deg);\n transform-origin: ", ";\n\n will-change: transform, opacity;\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n\n object-fit: cover;\n object-position: center;\n\n transition-property: opacity, transform;\n transition-duration: ", ";\n transition-delay: ", ";\n\n opacity: ", ";\n transform: scale(", ")\n rotate(", "deg);\n transform-origin: ", ";\n\n will-change: transform, opacity;\n"])), function (_a) {
466
- var scale = _a.scale;
467
- return "2s, ".concat(scale === 1 ? '0s' : '13s');
468
- }, function (_a) {
469
- var scale = _a.scale;
470
- return "".concat(scale === 1 ? '1s' : '0s', ", ").concat(scale === 1 ? '3s' : '0s');
471
- }, function (_a) {
472
- var opacity = _a.opacity;
473
- return opacity && opacity;
474
- }, function (_a) {
475
- var scale = _a.scale;
476
- return scale || 1;
477
- }, function (_a) {
478
- var scale = _a.scale;
479
- return scale !== 1 ? 0.04 : 0;
480
- }, function (_a) {
481
- var zoomPoint = _a.zoomPoint;
482
- return zoomPoint ? "".concat(zoomPoint[0] * 100, "% ").concat(zoomPoint[1] * 100, "%") : 'center';
483
- });
484
-
485
- var AnimationImages = function (_a) {
486
- var _b = _a.zoom,
487
- zoom = _b === void 0 ? 1.08 : _b,
488
- _c = _a.zoomPoint,
489
- zoomPoint = _c === void 0 ? [0.5, 0.5] : _c,
490
- _d = _a.interval,
491
- interval = _d === void 0 ? 10000 : _d,
492
- images = _a.images,
493
- onChange = _a.onChange;
494
- var intervalRef = useRef();
495
- var initialTimeoutRef = useRef();
496
-
497
- var _e = useState(-1),
498
- activeImg = _e[0],
499
- setActiveImg = _e[1];
500
-
501
- useEffect(function () {
502
- var changeImage = function () {
503
- setActiveImg(function (prev) {
504
- return (prev + 1) % images.length;
505
- });
506
- }; // changeImage();
507
-
508
-
509
- initialTimeoutRef.current = window.setTimeout(changeImage, 200);
510
- if (intervalRef.current) window.clearInterval(intervalRef.current);
511
- intervalRef.current = window.setInterval(changeImage, interval);
512
- return function () {
513
- if (initialTimeoutRef.current) window.clearTimeout(initialTimeoutRef.current);
514
- if (intervalRef.current) window.clearInterval(intervalRef.current);
515
- };
516
- }, [images, interval]);
517
- useEffect(function () {
518
- if (activeImg !== -1) onChange && onChange(activeImg); // eslint-disable-next-line react-hooks/exhaustive-deps
519
- }, [activeImg]);
520
- return React__default.createElement(React__default.Fragment, null, images.map(function (img, i) {
521
- var imgZoom = 1;
522
- var imgZoomPoint = zoomPoint;
523
-
524
- if (i === activeImg) {
525
- imgZoom = img.zoom !== undefined ? img.zoom : zoom;
526
- }
527
-
528
- if (img.zoomPoint) {
529
- imgZoomPoint = getValidZoomPoint(img.zoomPoint);
530
- }
531
-
532
- return React__default.createElement(AnimationImage, {
533
- key: i,
534
- style: {
535
- zIndex: i === activeImg ? 1 : 0
536
- },
537
- src: img.image,
538
- scale: imgZoom,
539
- opacity: i === activeImg ? 1 : 0,
540
- zoomPoint: imgZoomPoint,
541
- alt: img.alt || ''
542
- });
543
- }));
544
- };
545
-
546
- var preloadImages = function (images) {
547
- var loadedImages = images.map(function (req) {
548
- return new Promise(function (resolve) {
549
- var img = new window.Image();
550
- img.src = req.image;
551
-
552
- img.onload = function () {
553
- return resolve(req);
554
- };
555
- });
556
- });
557
- return loadedImages;
558
- };
559
-
560
- var getValidZoomPoint = function (point) {
561
- return [clampValue(point[0], 0, 1), clampValue(point[1], 0, 1)];
562
- };
563
-
564
- var HeaderKenBurns = function (_a) {
565
- var images = _a.images,
566
- _b = _a.zoom,
567
- zoom = _b === void 0 ? 1.08 : _b,
568
- _c = _a.zoomPoint,
569
- zoomPoint = _c === void 0 ? [0.5, 0.5] : _c,
570
- _d = _a.interval,
571
- interval = _d === void 0 ? 10000 : _d,
572
- onImageChange = _a.onImageChange,
573
- className = _a.className,
574
- children = _a.children;
575
- var mqs = ['small', 'medium', 'large', 'xlarge'];
576
- var currentMq = useMediaQuery(mqs);
577
-
578
- var _e = useState({
579
- small: [],
580
- medium: [],
581
- large: [],
582
- xlarge: []
583
- }),
584
- loadedImages = _e[0],
585
- setLoadedImages = _e[1];
586
-
587
- useEffect(function () {
588
- if (currentMq) {
589
- var loadedForMq = loadedImages[currentMq];
590
-
591
- if (loadedForMq.length < images.length && images.length >= 2) {
592
- var requestedImages = images.map(function (img, i) {
593
- return {
594
- id: i,
595
- image: img[currentMq],
596
- zoom: img.zoom || zoom,
597
- zoomPoint: img.zoomPoint || zoomPoint,
598
- alt: img.alt
599
- };
600
- });
601
-
602
- var resolve = function (imagePromises) {
603
- return __awaiter(void 0, void 0, void 0, function () {
604
- var _loop_1, _i, imagePromises_1, promise;
605
-
606
- return __generator(this, function (_a) {
607
- switch (_a.label) {
608
- case 0:
609
- _loop_1 = function (promise) {
610
- var loadedImg;
611
- return __generator(this, function (_b) {
612
- switch (_b.label) {
613
- case 0:
614
- return [4
615
- /*yield*/
616
- , promise];
617
-
618
- case 1:
619
- loadedImg = _b.sent();
620
- setLoadedImages(function (prev) {
621
- var _a; // check if image id already exists in array
622
-
623
-
624
- if (!prev[currentMq].find(function (e) {
625
- return e.id === loadedImg.id;
626
- })) {
627
- return __assign(__assign({}, prev), (_a = {}, _a[currentMq] = __spreadArray(__spreadArray([], prev[currentMq], true), [loadedImg], false), _a));
628
- } else return prev;
629
- });
630
- return [2
631
- /*return*/
632
- ];
633
- }
634
- });
635
- };
636
-
637
- _i = 0, imagePromises_1 = imagePromises;
638
- _a.label = 1;
639
-
640
- case 1:
641
- if (!(_i < imagePromises_1.length)) return [3
642
- /*break*/
643
- , 4];
644
- promise = imagePromises_1[_i];
645
- return [5
646
- /*yield**/
647
- , _loop_1(promise)];
648
-
649
- case 2:
650
- _a.sent();
651
-
652
- _a.label = 3;
653
-
654
- case 3:
655
- _i++;
656
- return [3
657
- /*break*/
658
- , 1];
659
-
660
- case 4:
661
- return [2
662
- /*return*/
663
- ];
664
- }
665
- });
666
- });
667
- };
668
-
669
- resolve(preloadImages(requestedImages));
670
- }
671
- }
672
- }, [currentMq, images, loadedImages, zoom, zoomPoint]);
673
- return React__default.createElement(AnimationContainer, {
674
- className: className
675
- }, React__default.createElement(PosterImage, __assign({}, images[0], {
676
- coverSpace: true,
677
- ratios: undefined
678
- })), currentMq && loadedImages[currentMq].length >= images.length && React__default.createElement(AnimationImages, {
679
- zoom: zoom,
680
- zoomPoint: getValidZoomPoint(zoomPoint),
681
- interval: interval,
682
- images: loadedImages[currentMq],
683
- onChange: function (id) {
684
- return images[id] && onImageChange && onImageChange(images[id]);
685
- }
686
- }), children);
687
- };
688
- var templateObject_1$7, templateObject_2$6, templateObject_3$5;
689
-
690
- var PosterView$1 = styled.div.withConfig({
691
- displayName: "HeaderPoster__PosterView",
692
- componentId: "sc-9zhj-0"
693
- })(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n"])));
694
- var BgImage = styled(Image).withConfig({
695
- displayName: "HeaderPoster__BgImage",
696
- componentId: "sc-9zhj-1"
697
- })(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n height: 100%;\n\n img {\n height: 100%;\n object-position: ", ";\n }\n"], ["\n height: 100%;\n\n img {\n height: 100%;\n object-position: ", ";\n }\n"])), function (_a) {
698
- var focus = _a.focus;
699
- return "".concat((focus === null || focus === void 0 ? void 0 : focus[0]) || 'center', " ").concat((focus === null || focus === void 0 ? void 0 : focus[1]) || 'center');
700
- });
701
-
702
- var HeaderPoster = function (_a) {
703
- var isInverted = _a.isInverted,
704
- bgImage = _a.bgImage,
705
- focus = _a.focus,
706
- className = _a.className,
707
- children = _a.children;
708
- return React__default.createElement(PosterView$1, {
709
- className: className
710
- }, bgImage && React__default.createElement(BgImage, __assign({}, bgImage, {
711
- coverSpace: true,
712
- ratios: undefined,
713
- isInverted: isInverted,
714
- focus: focus
715
- })), children);
716
- };
717
- var templateObject_1$6, templateObject_2$5;
718
-
719
- var PosterView = styled.div.withConfig({
720
- displayName: "HeaderVideo__PosterView",
721
- componentId: "sc-i0iu8j-0"
722
- })(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n"])));
723
- var PlaceholderImg = styled(Image).withConfig({
724
- displayName: "HeaderVideo__PlaceholderImg",
725
- componentId: "sc-i0iu8j-1"
726
- })(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n\n img {\n object-position: ", ";\n\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n height: 100%;\n z-index: 0;\n }\n\n margin: 0 auto;\n\n @media ", " {\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n padding: ", "px;\n z-index: 2;\n\n & > * {\n margin-top: ", "px;\n max-width: 880px;\n }\n }\n"], ["\n position: relative;\n height: 100%;\n\n img {\n object-position: ", ";\n\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n height: 100%;\n z-index: 0;\n }\n\n margin: 0 auto;\n\n @media ", " {\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n padding: ", "px;\n z-index: 2;\n\n & > * {\n margin-top: ", "px;\n max-width: 880px;\n }\n }\n"])), function (_a) {
727
- var focus = _a.focus;
728
- return "".concat((focus === null || focus === void 0 ? void 0 : focus[0]) || 'center', " ").concat((focus === null || focus === void 0 ? void 0 : focus[1]) || 'center');
729
- }, mq.medium, spacings.spacer * 2, spacings.spacer);
730
- var AutoplayVideo = styled.video.withConfig({
731
- displayName: "HeaderVideo__AutoplayVideo",
732
- componentId: "sc-i0iu8j-2"
733
- })(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: cover;\n object-position: ", ";\n opacity: ", ";\n pointer-events: none;\n z-index: 1;\n\n transition: opacity 0.3s ease-in-out;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: cover;\n object-position: ", ";\n opacity: ", ";\n pointer-events: none;\n z-index: 1;\n\n transition: opacity 0.3s ease-in-out;\n"])), function (_a) {
734
- var focus = _a.focus;
735
- return "".concat((focus === null || focus === void 0 ? void 0 : focus[0]) || 'center', " ").concat((focus === null || focus === void 0 ? void 0 : focus[1]) || 'center');
736
- }, function (_a) {
737
- var isVisible = _a.isVisible;
738
- return isVisible ? 1 : 0;
739
- });
740
-
741
- var HeaderVideo = function (_a) {
742
- var isInverted = _a.isInverted,
743
- _b = _a.loadOnMobile,
744
- loadOnMobile = _b === void 0 ? true : _b,
745
- placeholderImg = _a.placeholderImg,
746
- focus = _a.focus,
747
- videoUrl = _a.videoUrl,
748
- className = _a.className,
749
- children = _a.children;
750
- var videoRef = useRef(null);
751
- var viewRef = useRef(null);
752
-
753
- var _c = useState(!(placeholderImg === null || placeholderImg === void 0 ? void 0 : placeholderImg.small) || false),
754
- isLoaded = _c[0],
755
- setLoaded = _c[1];
756
-
757
- var isObserverSupported = useObserverSupport();
758
- var currentMq = useMediaQuery(['small', 'medium', 'semilarge', 'large', 'xlarge']);
759
- var isMobile = currentMq === undefined || currentMq === 'small';
760
- var isVideoAllowed = loadOnMobile || !isMobile;
761
-
762
- var _d = useState(false),
763
- isVideoActive = _d[0],
764
- setVideoActive = _d[1];
765
-
766
- useEffect(function () {
767
- if (!isVideoAllowed) setLoaded(false);
768
- }, [isMobile, isVideoAllowed, loadOnMobile]);
769
- useEffect(function () {
770
- if (!videoRef.current) return;
771
-
772
- if (videoRef.current.readyState > 3) {
773
- setLoaded(true);
774
- }
775
- }, []);
776
- useUpdateEffect(function () {
777
- if (!isVideoAllowed || !videoUrl || !viewRef.current) return;
778
-
779
- if (!isObserverSupported) {
780
- setVideoActive(true);
781
- return;
782
- }
783
-
784
- var observer = new IntersectionObserver(function (entries, observer) {
785
- var entry = entries[0];
786
-
787
- if (entry.isIntersecting) {
788
- observer.unobserve(entry.target);
789
- setVideoActive(true);
790
- }
791
- }, {
792
- rootMargin: '200px 0px 200px 0px'
793
- });
794
- var viewEl = viewRef.current;
795
- observer.observe(viewEl);
796
- return function () {
797
- if (viewEl) observer.unobserve(viewEl);
798
- };
799
- }, [isObserverSupported, isVideoAllowed]);
800
- return React__default.createElement(PosterView, {
801
- ref: viewRef,
802
- className: className
803
- }, (placeholderImg === null || placeholderImg === void 0 ? void 0 : placeholderImg.small) && !isLoaded && React__default.createElement(PlaceholderImg, __assign({}, placeholderImg, {
804
- coverSpace: true,
805
- ratios: undefined,
806
- isInverted: isInverted,
807
- focus: focus
808
- })), videoUrl && isVideoAllowed && React__default.createElement(AutoplayVideo, {
809
- ref: videoRef,
810
- isVisible: isLoaded,
811
- src: isVideoActive ? videoUrl : undefined,
812
- muted: true,
813
- autoPlay: true,
814
- loop: true,
815
- playsInline: true,
816
- onCanPlayThrough: function () {
817
- setLoaded(true);
818
- },
819
- focus: focus
820
- }), children);
821
- };
822
- var templateObject_1$5, templateObject_2$4, templateObject_3$4;
823
-
824
- var View$2 = styled.div.withConfig({
825
- displayName: "TableBlock__View",
826
- componentId: "sc-1n2im8m-0"
827
- })(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n &:focus {\n outline: 1px dashed ", ";\n }\n\n &:focus:not(:focus-visible) {\n outline: none;\n }\n"], ["\n &:focus {\n outline: 1px dashed ", ";\n }\n\n &:focus:not(:focus-visible) {\n outline: none;\n }\n"])), function (_a) {
828
- var theme = _a.theme;
829
- return getColors(theme).primary.default;
830
- });
831
- var Caption = styled(Copy).withConfig({
832
- displayName: "TableBlock__Caption",
833
- componentId: "sc-1n2im8m-1"
834
- })(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n margin-bottom: ", "px;\n padding: 0 ", "px;\n text-align: left;\n"], ["\n margin-bottom: ", "px;\n padding: 0 ", "px;\n text-align: left;\n"])), spacings.nudge, spacings.nudge * 2);
835
- var TableContainer = styled.div.withConfig({
836
- displayName: "TableBlock__TableContainer",
837
- componentId: "sc-1n2im8m-2"
838
- })(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n overflow-x: scroll;\n overflow-y: hidden;\n white-space: nowrap;\n\n &:focus {\n outline: none;\n border: 1px solid ", ";\n }\n\n &:focus:not(:focus-visible) {\n outline: none;\n border: none;\n }\n\n &::-webkit-scrollbar {\n display: none;\n scrollbar-width: none;\n }\n"], ["\n overflow-x: scroll;\n overflow-y: hidden;\n white-space: nowrap;\n\n &:focus {\n outline: none;\n border: 1px solid ", ";\n }\n\n &:focus:not(:focus-visible) {\n outline: none;\n border: none;\n }\n\n &::-webkit-scrollbar {\n display: none;\n scrollbar-width: none;\n }\n"])), function (_a) {
839
- var theme = _a.theme;
840
- return getColors(theme).primary.default;
841
- });
842
- var TableBody = styled.table.withConfig({
843
- displayName: "TableBlock__TableBody",
844
- componentId: "sc-1n2im8m-3"
845
- })(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n width: 100%;\n max-width: 100%;\n\n border-collapse: separate;\n border-spacing: 0 ", "px;\n\n padding: 0 ", "px;\n"], ["\n width: 100%;\n max-width: 100%;\n\n border-collapse: separate;\n border-spacing: 0 ", "px;\n\n padding: 0 ", "px;\n"])), spacings.nudge * 0.5, spacings.nudge * 2);
846
- var TableHead = styled(Copy).withConfig({
847
- displayName: "TableBlock__TableHead",
848
- componentId: "sc-1n2im8m-4"
849
- })(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n text-align: left;\n color: ", ";\n background-color: ", ";\n\n padding: 0 ", "px;\n height: 56px;\n box-sizing: content-box;\n\n :last-child {\n padding-right: ", "px;\n text-align: ", ";\n }\n"], ["\n text-align: left;\n color: ", ";\n background-color: ", ";\n\n padding: 0 ", "px;\n height: 56px;\n box-sizing: content-box;\n\n :last-child {\n padding-right: ", "px;\n text-align: ", ";\n }\n"])), function (_a) {
850
- var theme = _a.theme,
851
- isInverted = _a.isInverted;
852
- return isInverted ? getColors(theme).text.inverted : getColors(theme).text.default;
853
- }, function (_a) {
854
- var theme = _a.theme,
855
- isInverted = _a.isInverted;
856
- return isInverted ? getColors(theme).elementBg.dark : getColors(theme).elementBg.medium;
857
- }, spacings.nudge * 3, spacings.spacer * 2.5, function (_a) {
858
- var alignRight = _a.alignRight;
859
- return alignRight ? 'right' : 'left';
860
- });
861
- var TableData = styled(Copy).withConfig({
862
- displayName: "TableBlock__TableData",
863
- componentId: "sc-1n2im8m-5"
864
- })(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n padding: 0 ", "px;\n height: 56px;\n box-sizing: content-box;\n\n background-color: ", ";\n\n :last-child {\n text-align: ", ";\n padding-right: ", "px;\n }\n"], ["\n padding: 0 ", "px;\n height: 56px;\n box-sizing: content-box;\n\n background-color: ", ";\n\n :last-child {\n text-align: ", ";\n padding-right: ", "px;\n }\n"])), spacings.nudge * 3, function (_a) {
865
- var hasBack = _a.hasBack,
866
- theme = _a.theme;
867
- return hasBack ? getColors(theme).elementBg.light : getColors(theme).elementBg.medium;
868
- }, function (_a) {
869
- var alignRight = _a.alignRight;
870
- return alignRight ? 'right' : 'left';
871
- }, spacings.spacer * 2.5);
872
- var TableBlock = forwardRef(function (_a, ref) {
873
- var row = _a.row,
874
- tableTitle = _a.tableTitle,
875
- rowTitle = _a.rowTitle,
876
- _b = _a.isInverted,
877
- isInverted = _b === void 0 ? false : _b,
878
- _c = _a.hasBack,
879
- hasBack = _c === void 0 ? false : _c,
880
- _d = _a.lastCol,
881
- lastCol = _d === void 0 ? 'left' : _d;
882
- return React__default.createElement(View$2, {
883
- ref: ref
884
- }, React__default.createElement(TableContainer, {
885
- tabIndex: 1
886
- }, React__default.createElement(TableBody, null, tableTitle && React__default.createElement(Caption, {
887
- renderAs: "caption",
888
- type: "copy-b",
889
- isInverted: isInverted
890
- }, tableTitle), rowTitle && React__default.createElement("thead", null, React__default.createElement("tr", null, rowTitle.map(function (item, ii) {
891
- return React__default.createElement(TableHead, {
892
- key: ii,
893
- type: "copy-b",
894
- renderAs: "th",
895
- isInverted: !isInverted,
896
- alignRight: lastCol === 'right'
897
- }, item);
898
- }))), React__default.createElement("tbody", null, row.map(function (_a, i) {
899
- var cols = _a.cols;
900
- return React__default.createElement("tr", {
901
- key: i
902
- }, cols.map(function (itemText, ii) {
903
- return React__default.createElement(TableData, {
904
- key: ii,
905
- renderAs: "td",
906
- hasBack: hasBack,
907
- alignRight: lastCol === 'right',
908
- innerHTML: itemText
909
- });
910
- }));
911
- })))));
912
- });
913
- TableBlock.displayName = 'TableBlock';
914
- var templateObject_1$4, templateObject_2$3, templateObject_3$3, templateObject_4$1, templateObject_5$1, templateObject_6$1;
915
-
916
- var AspectContainer = styled.div.withConfig({
917
- displayName: "VideoBlock__AspectContainer",
918
- componentId: "sc-160aafd-0"
919
- })(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n position: relative;\n border-radius: ", ";\n overflow: hidden;\n\n aspect-ratio: ", ";\n width: ", ";\n max-width: 100%;\n\n background: ", ";\n object-position: center;\n\n @supports not (aspect-ratio: auto) {\n height: ", ";\n padding-top: ", ";\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n ", "\n"], ["\n position: relative;\n border-radius: ", ";\n overflow: hidden;\n\n aspect-ratio: ", ";\n width: ", ";\n max-width: 100%;\n\n background: ", ";\n object-position: center;\n\n @supports not (aspect-ratio: auto) {\n height: ", ";\n padding-top: ", ";\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n @media ", " {\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: auto) {\n padding-top: ", ";\n }\n }\n\n ", "\n"])), function (_a) {
920
- var theme = _a.theme;
921
- return getGlobals(theme).sections.edgeRadius;
922
- }, function (_a) {
923
- var ratios = _a.ratios;
924
- return ratios === null || ratios === void 0 ? void 0 : ratios.small;
925
- }, function (_a) {
926
- var ratios = _a.ratios;
927
- return (ratios === null || ratios === void 0 ? void 0 : ratios.small) && '100%';
928
- }, function (_a) {
929
- var theme = _a.theme,
930
- isInverted = _a.isInverted;
931
- return isInverted ? getGlobals(theme).sections.imagePlaceholderBg.inverted : getGlobals(theme).sections.imagePlaceholderBg.default;
932
- }, function (_a) {
933
- var ratios = _a.ratios;
934
- return (ratios === null || ratios === void 0 ? void 0 : ratios.small) && 0;
935
- }, function (_a) {
936
- var ratios = _a.ratios;
937
- return (ratios === null || ratios === void 0 ? void 0 : ratios.small) && "calc(100% / ".concat(ratios === null || ratios === void 0 ? void 0 : ratios.small, ")");
938
- }, mq.medium, function (_a) {
939
- var ratios = _a.ratios;
940
- return ratios === null || ratios === void 0 ? void 0 : ratios.medium;
941
- }, function (_a) {
942
- var ratios = _a.ratios;
943
- return (ratios === null || ratios === void 0 ? void 0 : ratios.medium) && "calc(100% / ".concat(ratios === null || ratios === void 0 ? void 0 : ratios.medium, ")");
944
- }, mq.semilarge, function (_a) {
945
- var ratios = _a.ratios;
946
- return ratios === null || ratios === void 0 ? void 0 : ratios.semilarge;
947
- }, function (_a) {
948
- var ratios = _a.ratios;
949
- return (ratios === null || ratios === void 0 ? void 0 : ratios.semilarge) && "calc(100% / ".concat(ratios === null || ratios === void 0 ? void 0 : ratios.semilarge, ")");
950
- }, mq.large, function (_a) {
951
- var ratios = _a.ratios;
952
- return ratios === null || ratios === void 0 ? void 0 : ratios.large;
953
- }, function (_a) {
954
- var ratios = _a.ratios;
955
- return (ratios === null || ratios === void 0 ? void 0 : ratios.large) && "calc(100% / ".concat(ratios === null || ratios === void 0 ? void 0 : ratios.large, ")");
956
- }, mq.xlarge, function (_a) {
957
- var ratios = _a.ratios;
958
- return ratios === null || ratios === void 0 ? void 0 : ratios.xlarge;
959
- }, function (_a) {
960
- var ratios = _a.ratios;
961
- return (ratios === null || ratios === void 0 ? void 0 : ratios.xlarge) && "calc(100% / ".concat(ratios === null || ratios === void 0 ? void 0 : ratios.xlarge, ")");
962
- }, function (_a) {
963
- var ratios = _a.ratios;
964
- return ratios && css(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n video {\n height: 100%;\n width: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: auto) {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n }\n }\n "], ["\n video {\n height: 100%;\n width: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: auto) {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n }\n }\n "])));
965
- });
966
- var Video = styled.video.withConfig({
967
- displayName: "VideoBlock__Video",
968
- componentId: "sc-160aafd-1"
969
- })(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
970
- var VideoBlock = forwardRef(function (_a, ref) {
971
- var urls = _a.urls,
972
- ratios = _a.ratios,
973
- isInverted = _a.isInverted,
974
- _b = _a.muted,
975
- muted = _b === void 0 ? false : _b,
976
- _c = _a.autoPlay,
977
- autoPlay = _c === void 0 ? false : _c,
978
- _d = _a.loop,
979
- loop = _d === void 0 ? false : _d,
980
- _e = _a.controls,
981
- controls = _e === void 0 ? false : _e,
982
- _f = _a.playsInline,
983
- playsInline = _f === void 0 ? true : _f,
984
- onCanPlayThrough = _a.onCanPlayThrough,
985
- className = _a.className;
986
- var videoRef = useRef(null);
987
- useImperativeHandle(ref, function () {
988
- return videoRef.current;
989
- });
990
- useEffect(function () {
991
- if (videoRef.current && videoRef.current.readyState > 3) {
992
- onCanPlayThrough === null || onCanPlayThrough === void 0 ? void 0 : onCanPlayThrough();
993
- }
994
- }, [onCanPlayThrough]);
995
- return React__default.createElement(AspectContainer, {
996
- ratios: ratios,
997
- isInverted: isInverted,
998
- className: className
999
- }, React__default.createElement(Video, {
1000
- ref: videoRef,
1001
- muted: muted,
1002
- autoPlay: autoPlay,
1003
- loop: loop,
1004
- controls: controls,
1005
- onCanPlayThrough: onCanPlayThrough,
1006
- playsInline: playsInline
1007
- }, urls === null || urls === void 0 ? void 0 : urls.map(function (url, i) {
1008
- return React__default.createElement("source", {
1009
- src: url,
1010
- key: i
1011
- });
1012
- })));
1013
- });
1014
- VideoBlock.displayName = 'VideoBlock';
1015
- var templateObject_1$3, templateObject_2$2, templateObject_3$2;
1016
-
1017
- var View$1 = styled.div.withConfig({
1018
- displayName: "POIFacts__View",
1019
- componentId: "sc-zp61fw-0"
1020
- })(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n flex-wrap: wrap;\n\n margin-top: -", "px;\n margin-left: -", "px;\n\n &:not(:first-child) {\n margin-top: ", "px;\n }\n"], ["\n display: inline-flex;\n flex-direction: row;\n flex-wrap: wrap;\n\n margin-top: -", "px;\n margin-left: -", "px;\n\n &:not(:first-child) {\n margin-top: ", "px;\n }\n"])), spacings.nudge, spacings.nudge * 2, spacings.nudge * 3);
1021
- var FactsWrapper = styled.div.withConfig({
1022
- displayName: "POIFacts__FactsWrapper",
1023
- componentId: "sc-zp61fw-1"
1024
- })(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n padding-top: ", "px;\n padding-left: ", "px;\n"], ["\n padding-top: ", "px;\n padding-left: ", "px;\n"])), spacings.nudge, spacings.nudge * 2);
1025
- var Fact = styled.span.withConfig({
1026
- displayName: "POIFacts__Fact",
1027
- componentId: "sc-zp61fw-2"
1028
- })(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n ", "\n color: ", ";\n\n & > * + * {\n margin-left: ", "px;\n }\n"], ["\n display: inline-flex;\n align-items: center;\n ", "\n color: ", ";\n\n & > * + * {\n margin-left: ", "px;\n }\n"])), copyStyle('copy', 'medium'), function (_a) {
1029
- var theme = _a.theme,
1030
- isInverted = _a.isInverted;
1031
- return isInverted ? getColors(theme).text.copyInverted : getColors(theme).text.copy;
1032
- }, spacings.nudge * 0.5);
1033
-
1034
- var POIFacts = function (_a) {
1035
- var facts = _a.facts,
1036
- customFact = _a.customFact,
1037
- isInverted = _a.isInverted;
1038
- return React__default.createElement(View$1, null, facts.map(function (fact, i) {
1039
- return React__default.createElement(FactsWrapper, {
1040
- key: 'tag_' + i
1041
- }, customFact ? customFact({
1042
- key: "headtag-".concat(i),
1043
- name: fact || '',
1044
- isInverted: isInverted
1045
- }) : React__default.createElement(Fact, {
1046
- isInverted: isInverted
1047
- }, React__default.createElement(Check, null), React__default.createElement("span", null, fact)));
1048
- }));
1049
- };
1050
- var templateObject_1$2, templateObject_2$1, templateObject_3$1;
1051
-
1052
- var View = styled.div.withConfig({
1053
- displayName: "POICard__View",
1054
- componentId: "sc-1l0tnmw-0"
1055
- })(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n border: 1px solid\n ", ";\n padding: ", "px;\n border-radius: ", "px;\n overflow: hidden;\n\n & > * + * {\n margin-top: ", "px;\n }\n"], ["\n border: 1px solid\n ", ";\n padding: ", "px;\n border-radius: ", "px;\n overflow: hidden;\n\n & > * + * {\n margin-top: ", "px;\n }\n"])), function (_a) {
1056
- var theme = _a.theme,
1057
- isInverted = _a.isInverted;
1058
- return isInverted ? getColors(theme).elementBg.light : getColors(theme).elementBg.dark;
1059
- }, spacings.nudge * 2, spacings.nudge, spacings.nudge * 3);
1060
- var Title = styled(Copy).withConfig({
1061
- displayName: "POICard__Title",
1062
- componentId: "sc-1l0tnmw-1"
1063
- })(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2; /* number of lines to show */\n line-clamp: 2;\n -webkit-box-orient: vertical;\n\n &:not(:first-child) {\n margin-top: ", "px;\n }\n"], ["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2; /* number of lines to show */\n line-clamp: 2;\n -webkit-box-orient: vertical;\n\n &:not(:first-child) {\n margin-top: ", "px;\n }\n"])), spacings.nudge * 3);
1064
- var Description = styled(Copy).withConfig({
1065
- displayName: "POICard__Description",
1066
- componentId: "sc-1l0tnmw-2"
1067
- })(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 4; /* number of lines to show */\n line-clamp: 4;\n -webkit-box-orient: vertical;\n"], ["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 4; /* number of lines to show */\n line-clamp: 4;\n -webkit-box-orient: vertical;\n"])));
1068
- var Body = styled.div.withConfig({
1069
- displayName: "POICard__Body",
1070
- componentId: "sc-1l0tnmw-3"
1071
- })(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n /* align-items: flex-start; */\n\n @media ", " {\n margin-left: -", "px;\n margin-right: -", "px;\n\n & > * + * {\n border-left: 1px solid\n ", ";\n }\n }\n"], ["\n display: flex;\n flex-direction: row;\n /* align-items: flex-start; */\n\n @media ", " {\n margin-left: -", "px;\n margin-right: -", "px;\n\n & > * + * {\n border-left: 1px solid\n ", ";\n }\n }\n"])), mq.semilarge, spacings.spacer, spacings.spacer, function (_a) {
1072
- var theme = _a.theme,
1073
- isInverted = _a.isInverted;
1074
- return isInverted ? getColors(theme).elementBg.light : getColors(theme).elementBg.dark;
1075
- });
1076
- var Col = styled.div.withConfig({
1077
- displayName: "POICard__Col",
1078
- componentId: "sc-1l0tnmw-4"
1079
- })(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n flex: 1 0 100%;\n\n & > * + * {\n margin-top: ", "px;\n }\n\n @media ", " {\n flex: 1 0 60%;\n padding: 0 ", "px;\n }\n\n @media ", " {\n flex: 1 0 ", "%;\n }\n"], ["\n flex: 1 0 100%;\n\n & > * + * {\n margin-top: ", "px;\n }\n\n @media ", " {\n flex: 1 0 60%;\n padding: 0 ", "px;\n }\n\n @media ", " {\n flex: 1 0 ", "%;\n }\n"])), spacings.nudge * 3, mq.semilarge, spacings.spacer, mq.large, 2 / 3 * 100);
1080
- var InfoCol = styled(Col).withConfig({
1081
- displayName: "POICard__InfoCol",
1082
- componentId: "sc-1l0tnmw-5"
1083
- })(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: none;\n margin-bottom: ", "px;\n\n @media ", " {\n display: block;\n flex: 1 0 40%;\n }\n\n @media ", " {\n display: block;\n flex: 1 0 ", "%;\n }\n"], ["\n display: none;\n margin-bottom: ", "px;\n\n @media ", " {\n display: block;\n flex: 1 0 40%;\n }\n\n @media ", " {\n display: block;\n flex: 1 0 ", "%;\n }\n"])), spacings.nudge * 2, mq.semilarge, mq.large, 1 / 3 * 100);
1084
- var Action = styled.div.withConfig({
1085
- displayName: "POICard__Action",
1086
- componentId: "sc-1l0tnmw-6"
1087
- })(templateObject_7 || (templateObject_7 = __makeTemplateObject([""], [""])));
1088
-
1089
- var POICard = function (_a) {
1090
- var isInverted = _a.isInverted,
1091
- name = _a.name,
1092
- shortDescription = _a.shortDescription,
1093
- facts = _a.facts,
1094
- infos = _a.infos,
1095
- customFact = _a.customFact,
1096
- action = _a.action;
1097
- var hasFacts = isValidArray(facts, false);
1098
- var hasInfos = isValidArray(infos, false);
1099
- return React__default.createElement(View, {
1100
- isInverted: isInverted
1101
- }, name && React__default.createElement(Title, {
1102
- type: "copy-b",
1103
- size: "big",
1104
- isInverted: isInverted
1105
- }, name), (hasFacts || shortDescription || hasInfos || action) && React__default.createElement(Body, {
1106
- isInverted: isInverted
1107
- }, React__default.createElement(Col, null, isValidArray(facts, false) && React__default.createElement(POIFacts, {
1108
- facts: facts,
1109
- isInverted: isInverted,
1110
- customFact: customFact
1111
- }), shortDescription && React__default.createElement(Description, {
1112
- isInverted: isInverted,
1113
- innerHTML: shortDescription
1114
- }), action && React__default.createElement(Action, null, action(isInverted))), isValidArray(infos, false) && React__default.createElement(InfoCol, null, React__default.createElement(InfoList, {
1115
- isInverted: isInverted,
1116
- items: [{
1117
- items: infos
1118
- }]
1119
- }))));
1120
- };
1121
- var templateObject_1$1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
1122
-
1123
- var bdotColor = '#1fc2f4';
1124
- var Dot = styled(Link).withConfig({
1125
- displayName: "Bdot__Dot",
1126
- componentId: "sc-itin1p-0"
1127
- })(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 14px;\n height: 14px;\n\n display: inline-block;\n vertical-align: middle;\n border-radius: 50%;\n\n background: ", ";\n color: ", ";\n text-decoration: none;\n\n span {\n visibility: hidden;\n font-size: 0;\n color: transparent;\n }\n"], ["\n width: 14px;\n height: 14px;\n\n display: inline-block;\n vertical-align: middle;\n border-radius: 50%;\n\n background: ", ";\n color: ", ";\n text-decoration: none;\n\n span {\n visibility: hidden;\n font-size: 0;\n color: transparent;\n }\n"])), bdotColor, bdotColor);
1128
-
1129
- var Bdot = function (_a) {
1130
- var className = _a.className;
1131
- return React.createElement(Dot, {
1132
- ariaLabel: "b.lateral - creative agency",
1133
- className: className,
1134
- href: "https://blateral.com",
1135
- isExternal: true
1136
- }, React.createElement("span", null, "b.lateral - creative agency"));
1137
- };
1138
- var templateObject_1;
1139
-
1140
- export { Bdot as B, EventBlock as E, HeaderPoster as H, IntroBlock as I, POIFacts as P, Title$2 as T, VideoBlock as V, Tag as a, InfoList as b, HeaderKenBurns as c, HeaderVideo as d, TableBlock as e, POICard as f };
1141
- //# sourceMappingURL=Bdot-a103eeef.js.map