@lluc_llull/ui-lib 0.33.10 → 0.34.0

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 (262) hide show
  1. package/README.md +1 -1
  2. package/fesm2022/lluc_llull-ui-lib-content-asymmetric-media.mjs +85 -28
  3. package/fesm2022/lluc_llull-ui-lib-content-asymmetric-media.mjs.map +1 -1
  4. package/fesm2022/lluc_llull-ui-lib-content-category-progress.mjs +81 -30
  5. package/fesm2022/lluc_llull-ui-lib-content-category-progress.mjs.map +1 -1
  6. package/fesm2022/lluc_llull-ui-lib-content-columns-media-stacked.mjs +90 -34
  7. package/fesm2022/lluc_llull-ui-lib-content-columns-media-stacked.mjs.map +1 -1
  8. package/fesm2022/lluc_llull-ui-lib-content-contact-minimal.mjs +109 -37
  9. package/fesm2022/lluc_llull-ui-lib-content-contact-minimal.mjs.map +1 -1
  10. package/fesm2022/lluc_llull-ui-lib-content-content-document.mjs +58 -26
  11. package/fesm2022/lluc_llull-ui-lib-content-content-document.mjs.map +1 -1
  12. package/fesm2022/lluc_llull-ui-lib-content-hero-section.mjs +139 -110
  13. package/fesm2022/lluc_llull-ui-lib-content-hero-section.mjs.map +1 -1
  14. package/fesm2022/lluc_llull-ui-lib-content-media-intro.mjs +91 -34
  15. package/fesm2022/lluc_llull-ui-lib-content-media-intro.mjs.map +1 -1
  16. package/fesm2022/lluc_llull-ui-lib-content-media-split.mjs +118 -76
  17. package/fesm2022/lluc_llull-ui-lib-content-media-split.mjs.map +1 -1
  18. package/fesm2022/lluc_llull-ui-lib-content-mosaic-grid.mjs +99 -44
  19. package/fesm2022/lluc_llull-ui-lib-content-mosaic-grid.mjs.map +1 -1
  20. package/fesm2022/lluc_llull-ui-lib-content-mosaic-parallax.mjs +109 -57
  21. package/fesm2022/lluc_llull-ui-lib-content-mosaic-parallax.mjs.map +1 -1
  22. package/fesm2022/lluc_llull-ui-lib-content-section-intro.mjs +100 -37
  23. package/fesm2022/lluc_llull-ui-lib-content-section-intro.mjs.map +1 -1
  24. package/fesm2022/lluc_llull-ui-lib-content-split-previewer.mjs +133 -61
  25. package/fesm2022/lluc_llull-ui-lib-content-split-previewer.mjs.map +1 -1
  26. package/fesm2022/lluc_llull-ui-lib-content-split-showcase.mjs +99 -37
  27. package/fesm2022/lluc_llull-ui-lib-content-split-showcase.mjs.map +1 -1
  28. package/fesm2022/lluc_llull-ui-lib-content-stacked-rows.mjs +61 -29
  29. package/fesm2022/lluc_llull-ui-lib-content-stacked-rows.mjs.map +1 -1
  30. package/fesm2022/lluc_llull-ui-lib-content.mjs +1286 -502
  31. package/fesm2022/lluc_llull-ui-lib-content.mjs.map +1 -1
  32. package/fesm2022/lluc_llull-ui-lib-directives.mjs +383 -262
  33. package/fesm2022/lluc_llull-ui-lib-directives.mjs.map +1 -1
  34. package/fesm2022/lluc_llull-ui-lib-effects.mjs +187 -150
  35. package/fesm2022/lluc_llull-ui-lib-effects.mjs.map +1 -1
  36. package/fesm2022/lluc_llull-ui-lib-enums.mjs +8 -12
  37. package/fesm2022/lluc_llull-ui-lib-enums.mjs.map +1 -1
  38. package/fesm2022/lluc_llull-ui-lib-feedback-404.mjs +97 -34
  39. package/fesm2022/lluc_llull-ui-lib-feedback-404.mjs.map +1 -1
  40. package/fesm2022/lluc_llull-ui-lib-feedback.mjs +97 -34
  41. package/fesm2022/lluc_llull-ui-lib-feedback.mjs.map +1 -1
  42. package/fesm2022/lluc_llull-ui-lib-footers-columns-footer.mjs +65 -27
  43. package/fesm2022/lluc_llull-ui-lib-footers-columns-footer.mjs.map +1 -1
  44. package/fesm2022/lluc_llull-ui-lib-footers-legal-footer.mjs +74 -37
  45. package/fesm2022/lluc_llull-ui-lib-footers-legal-footer.mjs.map +1 -1
  46. package/fesm2022/lluc_llull-ui-lib-footers-links-footer.mjs +59 -24
  47. package/fesm2022/lluc_llull-ui-lib-footers-links-footer.mjs.map +1 -1
  48. package/fesm2022/lluc_llull-ui-lib-footers-social-footer.mjs +95 -32
  49. package/fesm2022/lluc_llull-ui-lib-footers-social-footer.mjs.map +1 -1
  50. package/fesm2022/lluc_llull-ui-lib-footers-visual-footer.mjs +84 -45
  51. package/fesm2022/lluc_llull-ui-lib-footers-visual-footer.mjs.map +1 -1
  52. package/fesm2022/lluc_llull-ui-lib-footers.mjs +354 -125
  53. package/fesm2022/lluc_llull-ui-lib-footers.mjs.map +1 -1
  54. package/fesm2022/lluc_llull-ui-lib-headers-header-clear.mjs +153 -78
  55. package/fesm2022/lluc_llull-ui-lib-headers-header-clear.mjs.map +1 -1
  56. package/fesm2022/lluc_llull-ui-lib-headers-header-mobile.mjs +153 -78
  57. package/fesm2022/lluc_llull-ui-lib-headers-header-mobile.mjs.map +1 -1
  58. package/fesm2022/lluc_llull-ui-lib-headers.mjs +296 -142
  59. package/fesm2022/lluc_llull-ui-lib-headers.mjs.map +1 -1
  60. package/fesm2022/lluc_llull-ui-lib-interfaces.mjs +0 -4
  61. package/fesm2022/lluc_llull-ui-lib-mapper.mjs +242 -264
  62. package/fesm2022/lluc_llull-ui-lib-mapper.mjs.map +1 -1
  63. package/fesm2022/lluc_llull-ui-lib-modals.mjs +163 -65
  64. package/fesm2022/lluc_llull-ui-lib-modals.mjs.map +1 -1
  65. package/fesm2022/lluc_llull-ui-lib-screen-sizer.mjs +106 -97
  66. package/fesm2022/lluc_llull-ui-lib-screen-sizer.mjs.map +1 -1
  67. package/fesm2022/lluc_llull-ui-lib-shared.mjs +279 -148
  68. package/fesm2022/lluc_llull-ui-lib-shared.mjs.map +1 -1
  69. package/fesm2022/lluc_llull-ui-lib-sliders.mjs +72 -52
  70. package/fesm2022/lluc_llull-ui-lib-sliders.mjs.map +1 -1
  71. package/fesm2022/lluc_llull-ui-lib-theme.mjs +78 -80
  72. package/fesm2022/lluc_llull-ui-lib-theme.mjs.map +1 -1
  73. package/fesm2022/lluc_llull-ui-lib-utils.mjs +42 -64
  74. package/fesm2022/lluc_llull-ui-lib-utils.mjs.map +1 -1
  75. package/fesm2022/lluc_llull-ui-lib.mjs +42 -27
  76. package/fesm2022/lluc_llull-ui-lib.mjs.map +1 -1
  77. package/package.json +86 -85
  78. package/types/lluc_llull-ui-lib-content-asymmetric-media.d.ts +21 -0
  79. package/types/lluc_llull-ui-lib-content-category-progress.d.ts +34 -0
  80. package/types/lluc_llull-ui-lib-content-columns-media-stacked.d.ts +33 -0
  81. package/types/lluc_llull-ui-lib-content-contact-minimal.d.ts +39 -0
  82. package/types/lluc_llull-ui-lib-content-content-document.d.ts +24 -0
  83. package/types/lluc_llull-ui-lib-content-hero-section.d.ts +62 -0
  84. package/types/lluc_llull-ui-lib-content-media-intro.d.ts +33 -0
  85. package/types/lluc_llull-ui-lib-content-media-split.d.ts +36 -0
  86. package/types/lluc_llull-ui-lib-content-mosaic-grid.d.ts +27 -0
  87. package/types/lluc_llull-ui-lib-content-mosaic-parallax.d.ts +35 -0
  88. package/types/lluc_llull-ui-lib-content-section-intro.d.ts +33 -0
  89. package/types/lluc_llull-ui-lib-content-split-previewer.d.ts +47 -0
  90. package/types/lluc_llull-ui-lib-content-split-showcase.d.ts +43 -0
  91. package/types/lluc_llull-ui-lib-content-stacked-rows.d.ts +30 -0
  92. package/types/lluc_llull-ui-lib-content.d.ts +471 -0
  93. package/types/lluc_llull-ui-lib-directives.d.ts +93 -0
  94. package/types/lluc_llull-ui-lib-effects.d.ts +50 -0
  95. package/types/lluc_llull-ui-lib-enums.d.ts +7 -0
  96. package/types/lluc_llull-ui-lib-feedback-404.d.ts +33 -0
  97. package/types/lluc_llull-ui-lib-feedback.d.ts +33 -0
  98. package/types/lluc_llull-ui-lib-footers-columns-footer.d.ts +30 -0
  99. package/types/lluc_llull-ui-lib-footers-legal-footer.d.ts +40 -0
  100. package/types/lluc_llull-ui-lib-footers-links-footer.d.ts +15 -0
  101. package/types/lluc_llull-ui-lib-footers-social-footer.d.ts +27 -0
  102. package/types/lluc_llull-ui-lib-footers-visual-footer.d.ts +57 -0
  103. package/types/lluc_llull-ui-lib-footers.d.ts +161 -0
  104. package/types/lluc_llull-ui-lib-headers-header-clear.d.ts +68 -0
  105. package/types/lluc_llull-ui-lib-headers-header-mobile.d.ts +68 -0
  106. package/types/lluc_llull-ui-lib-headers.d.ts +132 -0
  107. package/types/lluc_llull-ui-lib-interfaces.d.ts +92 -0
  108. package/types/lluc_llull-ui-lib-mapper.d.ts +40 -0
  109. package/types/lluc_llull-ui-lib-modals.d.ts +47 -0
  110. package/types/lluc_llull-ui-lib-screen-sizer.d.ts +34 -0
  111. package/types/lluc_llull-ui-lib-shared.d.ts +99 -0
  112. package/types/lluc_llull-ui-lib-sliders.d.ts +17 -0
  113. package/types/lluc_llull-ui-lib-theme.d.ts +16 -0
  114. package/{utils/utils.d.ts → types/lluc_llull-ui-lib-utils.d.ts} +2 -2
  115. package/types/lluc_llull-ui-lib.d.ts +5 -0
  116. package/content/asymmetric-media/asymmetric-media.component.d.ts +0 -8
  117. package/content/asymmetric-media/asymmetric-media.interface.d.ts +0 -5
  118. package/content/asymmetric-media/index.d.ts +0 -2
  119. package/content/category-progress/category-progress.component.d.ts +0 -16
  120. package/content/category-progress/category-progress.interface.d.ts +0 -6
  121. package/content/category-progress/index.d.ts +0 -2
  122. package/content/columns-media-stacked/columns-media-stacked.component.d.ts +0 -10
  123. package/content/columns-media-stacked/columns-media-stacked.interface.d.ts +0 -7
  124. package/content/columns-media-stacked/index.d.ts +0 -2
  125. package/content/contact-minimal/contact-minimal.component.d.ts +0 -11
  126. package/content/contact-minimal/contact-minimal.interface.d.ts +0 -8
  127. package/content/contact-minimal/index.d.ts +0 -2
  128. package/content/content-document/content-document.component.d.ts +0 -11
  129. package/content/content-document/content-document.interface.d.ts +0 -5
  130. package/content/content-document/index.d.ts +0 -2
  131. package/content/hero-section/hero-section.component.d.ts +0 -19
  132. package/content/hero-section/hero-section.interface.d.ts +0 -11
  133. package/content/hero-section/hero-section.stories.d.ts +0 -7
  134. package/content/hero-section/index.d.ts +0 -3
  135. package/content/index.d.ts +0 -14
  136. package/content/media-intro/index.d.ts +0 -2
  137. package/content/media-intro/media-intro.component.d.ts +0 -10
  138. package/content/media-intro/media-intro.interface.d.ts +0 -7
  139. package/content/media-split/index.d.ts +0 -2
  140. package/content/media-split/media-split.component.d.ts +0 -18
  141. package/content/media-split/media-split.interface.d.ts +0 -6
  142. package/content/mosaic-grid/index.d.ts +0 -2
  143. package/content/mosaic-grid/mosaic-grid.component.d.ts +0 -14
  144. package/content/mosaic-grid/mosaic-grid.interface.d.ts +0 -5
  145. package/content/mosaic-parallax/index.d.ts +0 -2
  146. package/content/mosaic-parallax/mosaic-parallax.component.d.ts +0 -17
  147. package/content/mosaic-parallax/mosaic-parallax.interface.d.ts +0 -6
  148. package/content/section-intro/index.d.ts +0 -2
  149. package/content/section-intro/section-intro.component.d.ts +0 -11
  150. package/content/section-intro/section-intro.interface.d.ts +0 -2
  151. package/content/split-previewer/index.d.ts +0 -2
  152. package/content/split-previewer/split-previewer.component.d.ts +0 -24
  153. package/content/split-previewer/split-previewer.interface.d.ts +0 -8
  154. package/content/split-showcase/index.d.ts +0 -2
  155. package/content/split-showcase/split-showcase.component.d.ts +0 -15
  156. package/content/split-showcase/split-showcase.interface.d.ts +0 -9
  157. package/content/stacked-rows/index.d.ts +0 -2
  158. package/content/stacked-rows/stacked-rows.component.d.ts +0 -12
  159. package/content/stacked-rows/stacked-rows.interface.d.ts +0 -6
  160. package/directives/header-scroll.directive.d.ts +0 -8
  161. package/directives/highlight.directive.d.ts +0 -14
  162. package/directives/index.d.ts +0 -4
  163. package/directives/link-type.directive.d.ts +0 -26
  164. package/directives/scroll-reveal.directive.d.ts +0 -15
  165. package/effects/dynamic-background/dynamic-background.component.d.ts +0 -27
  166. package/effects/dynamic-background/effects/dynamic-effect.interface.d.ts +0 -6
  167. package/effects/dynamic-background/effects/effect-registry.d.ts +0 -3
  168. package/effects/dynamic-background/effects/sphere-deform/sphere-deform.effect.d.ts +0 -13
  169. package/effects/dynamic-background/index.d.ts +0 -1
  170. package/effects/index.d.ts +0 -1
  171. package/enums/index.d.ts +0 -1
  172. package/enums/link-type.enum.d.ts +0 -7
  173. package/feedback/404/404.component.d.ts +0 -10
  174. package/feedback/404/404.inteface.d.ts +0 -7
  175. package/feedback/404/index.d.ts +0 -2
  176. package/feedback/index.d.ts +0 -1
  177. package/fesm2022/lluc_llull-ui-lib-interfaces.mjs.map +0 -1
  178. package/footers/columns-footer/columns-footer.component.d.ts +0 -17
  179. package/footers/columns-footer/columns-footer.interface.d.ts +0 -5
  180. package/footers/columns-footer/index.d.ts +0 -2
  181. package/footers/index.d.ts +0 -5
  182. package/footers/legal-footer/index.d.ts +0 -2
  183. package/footers/legal-footer/legal-footer.component.d.ts +0 -12
  184. package/footers/legal-footer/legal-footer.interface.d.ts +0 -9
  185. package/footers/links-footer/index.d.ts +0 -2
  186. package/footers/links-footer/links-footer.component.d.ts +0 -7
  187. package/footers/links-footer/links-footer.interface.d.ts +0 -4
  188. package/footers/social-footer/index.d.ts +0 -2
  189. package/footers/social-footer/social-footer.component.d.ts +0 -9
  190. package/footers/social-footer/social-footer.interface.d.ts +0 -6
  191. package/footers/visual-footer/index.d.ts +0 -2
  192. package/footers/visual-footer/visual-footer.component.d.ts +0 -14
  193. package/footers/visual-footer/visual-footer.interface.d.ts +0 -11
  194. package/headers/header-clear/header-clear.component.d.ts +0 -28
  195. package/headers/header-clear/header-clear.interface.d.ts +0 -9
  196. package/headers/header-clear/index.d.ts +0 -2
  197. package/headers/header-mobile/header-mobile.component.d.ts +0 -28
  198. package/headers/header-mobile/header-mobile.interface.d.ts +0 -9
  199. package/headers/header-mobile/index.d.ts +0 -2
  200. package/headers/index.d.ts +0 -2
  201. package/index.d.ts +0 -5
  202. package/interfaces/index.d.ts +0 -8
  203. package/interfaces/page-config.interface.d.ts +0 -22
  204. package/interfaces/site-config.interface.d.ts +0 -21
  205. package/interfaces/ui-lib-address.interface.d.ts +0 -7
  206. package/interfaces/ui-lib-button.interface.d.ts +0 -7
  207. package/interfaces/ui-lib-image.interface.d.ts +0 -10
  208. package/interfaces/ui-lib-lang-item.interface.d.ts +0 -5
  209. package/interfaces/ui-lib-nav-items.interface.d.ts +0 -17
  210. package/interfaces/ui-lib-texts.interface.d.ts +0 -6
  211. package/lib/ui-lib.component.d.ts +0 -5
  212. package/mapper/cdn.token.d.ts +0 -2
  213. package/mapper/cloudinary.token.d.ts +0 -2
  214. package/mapper/component-mappers/404.mapper.d.ts +0 -2
  215. package/mapper/component-mappers/asymmetric-media.mapper.d.ts +0 -2
  216. package/mapper/component-mappers/category-progress.mapper.d.ts +0 -2
  217. package/mapper/component-mappers/columns-footer.mapper.d.ts +0 -2
  218. package/mapper/component-mappers/columns-media-stacked.mapper.d.ts +0 -2
  219. package/mapper/component-mappers/contact-minimal.mapper.d.ts +0 -2
  220. package/mapper/component-mappers/content-document.mapper.d.ts +0 -2
  221. package/mapper/component-mappers/header-clear.mapper.d.ts +0 -2
  222. package/mapper/component-mappers/hero-section.mapper.d.ts +0 -2
  223. package/mapper/component-mappers/index.d.ts +0 -24
  224. package/mapper/component-mappers/lang-modal.mapper.d.ts +0 -2
  225. package/mapper/component-mappers/legal-footer.mapper.d.ts +0 -2
  226. package/mapper/component-mappers/links-footer.mapper.d.ts +0 -2
  227. package/mapper/component-mappers/media-intro.mapper.d.ts +0 -2
  228. package/mapper/component-mappers/media-split.mapper.d.ts +0 -2
  229. package/mapper/component-mappers/mosaic-grid.mapper.d.ts +0 -2
  230. package/mapper/component-mappers/mosaic-parallax.mapper.d.ts +0 -2
  231. package/mapper/component-mappers/nav-modal.mapper.d.ts +0 -3
  232. package/mapper/component-mappers/section-intro.mapper.d.ts +0 -2
  233. package/mapper/component-mappers/social-footer.mapper.d.ts +0 -2
  234. package/mapper/component-mappers/split-previewer.mapper.d.ts +0 -2
  235. package/mapper/component-mappers/split-showcase.mapper.d.ts +0 -2
  236. package/mapper/component-mappers/stacked-rows.mapper.d.ts +0 -2
  237. package/mapper/component-mappers/types.d.ts +0 -1
  238. package/mapper/component-mappers/visual-footer.mapper.d.ts +0 -2
  239. package/mapper/index.d.ts +0 -4
  240. package/mapper/mapper.service.d.ts +0 -10
  241. package/modals/index.d.ts +0 -2
  242. package/modals/lang-modal/index.d.ts +0 -2
  243. package/modals/lang-modal/lang-modal.component.d.ts +0 -18
  244. package/modals/lang-modal/lang-modal.interface.d.ts +0 -2
  245. package/modals/nav-modal/index.d.ts +0 -2
  246. package/modals/nav-modal/nav-modal.component.d.ts +0 -11
  247. package/modals/nav-modal/nav-modal.interface.d.ts +0 -5
  248. package/public-api.d.ts +0 -1
  249. package/screen-sizer/index.d.ts +0 -1
  250. package/screen-sizer/screen-sizer.service.d.ts +0 -34
  251. package/shared/index.d.ts +0 -2
  252. package/shared/ui-icon/index.d.ts +0 -3
  253. package/shared/ui-icon/ui-icon.component.d.ts +0 -15
  254. package/shared/ui-icon/ui-icon.interface.d.ts +0 -5
  255. package/shared/ui-icon/ui-icon.mock.d.ts +0 -8
  256. package/shared/ui-image/index.d.ts +0 -1
  257. package/shared/ui-image/ui-image.component.d.ts +0 -21
  258. package/sliders/index.d.ts +0 -1
  259. package/sliders/swiper.directive.d.ts +0 -12
  260. package/theme/index.d.ts +0 -1
  261. package/theme/theme.service.d.ts +0 -16
  262. package/utils/index.d.ts +0 -1
@@ -1,506 +1,1290 @@
1
- import { CommonModule, DOCUMENT, isPlatformBrowser } from '@angular/common';
2
- import * as i0 from '@angular/core';
3
- import { Input, ChangeDetectionStrategy, Component, Inject, signal, PLATFORM_ID, effect, computed, ViewChild } from '@angular/core';
4
- import { HighlightDirective, ScrollRevealDirective, LinkTypeDirective } from '@lluc_llull/ui-lib/directives';
5
- import { UiIconComponent, UiImageComponent } from '@lluc_llull/ui-lib/shared';
6
- import { LinkType } from '@lluc_llull/ui-lib/enums';
7
-
8
- class CategoryProgressComponent {
9
- pretitle;
10
- title;
11
- categories;
12
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CategoryProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
13
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CategoryProgressComponent, isStandalone: true, selector: "lib-category-progress", inputs: { pretitle: "pretitle", title: "title", categories: "categories" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"category-progress col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h3 class=\"pretitle\">{{ pretitle }}</h3>\n }\n @if (title) {\n <h2 class=\"title\">{{ title }}</h2>\n }\n <div class=\"progress-grid\">\n @for (category of categories; track $index) {\n <div class=\"category\">\n <h3 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ category.title }}</h3>\n\n @for (item of category.items; track $index) {\n <div class=\"item\">\n <div class=\"item-info\">\n <span class=\"label\">{{ item.label }}</span>\n <span class=\"value\">{{ item.value }}%</span>\n </div>\n\n <div class=\"bar\">\n <div class=\"fill\" [style.width.%]=\"item.value\"></div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: [".category-progress{text-align:start;align-items:start}.title{text-transform:uppercase}.progress-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.category{display:flex;flex-direction:column;gap:1.5rem}.category-title{font-weight:600;font-size:1.1rem}.subtitle{font-size:1.8rem;width:fit-content}.item{margin-bottom:0rem}.item .item-info{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.item .label,.item .value{font-size:1.3rem;margin-bottom:0;display:inline-block}.item .bar{background-color:var(--progress-bg);height:2px;border-radius:3px;overflow:hidden}.item .bar .fill{background-color:var(--progress-color);height:100%;width:0;transition:width .3s ease}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: HighlightDirective, selector: "[highlight]", inputs: ["highlight", "highlightThickness"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
14
- }
15
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CategoryProgressComponent, decorators: [{
16
- type: Component,
17
- args: [{ selector: 'lib-category-progress', standalone: true, imports: [CommonModule, HighlightDirective, ScrollRevealDirective], changeDetection: ChangeDetectionStrategy.OnPush, host: {
18
- style: 'display: contents',
19
- }, template: "<div class=\"category-progress col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h3 class=\"pretitle\">{{ pretitle }}</h3>\n }\n @if (title) {\n <h2 class=\"title\">{{ title }}</h2>\n }\n <div class=\"progress-grid\">\n @for (category of categories; track $index) {\n <div class=\"category\">\n <h3 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ category.title }}</h3>\n\n @for (item of category.items; track $index) {\n <div class=\"item\">\n <div class=\"item-info\">\n <span class=\"label\">{{ item.label }}</span>\n <span class=\"value\">{{ item.value }}%</span>\n </div>\n\n <div class=\"bar\">\n <div class=\"fill\" [style.width.%]=\"item.value\"></div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n", styles: [".category-progress{text-align:start;align-items:start}.title{text-transform:uppercase}.progress-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.category{display:flex;flex-direction:column;gap:1.5rem}.category-title{font-weight:600;font-size:1.1rem}.subtitle{font-size:1.8rem;width:fit-content}.item{margin-bottom:0rem}.item .item-info{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.item .label,.item .value{font-size:1.3rem;margin-bottom:0;display:inline-block}.item .bar{background-color:var(--progress-bg);height:2px;border-radius:3px;overflow:hidden}.item .bar .fill{background-color:var(--progress-color);height:100%;width:0;transition:width .3s ease}\n"] }]
20
- }], propDecorators: { pretitle: [{
21
- type: Input
22
- }], title: [{
23
- type: Input
24
- }], categories: [{
25
- type: Input
26
- }] } });
27
-
28
- class HeroSectionComponent {
29
- document;
30
- variant = 'text';
31
- pretitle;
32
- title;
33
- subtitle;
34
- text;
35
- buttons;
36
- highlight;
37
- image;
38
- constructor(document) {
39
- this.document = document;
40
- }
41
- ngOnInit() {
42
- if (this.variant === 'image') {
43
- this.document.body.classList.add('has-hero-image');
44
- }
45
- }
46
- ngOnDestroy() {
47
- this.document.body.classList.remove('has-hero-image');
48
- }
49
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: HeroSectionComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
50
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: HeroSectionComponent, isStandalone: true, selector: "lib-hero-section", inputs: { variant: "variant", pretitle: "pretitle", title: "title", subtitle: "subtitle", text: "text", buttons: "buttons", highlight: "highlight", image: "image" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div\n class=\"hero-section col-span-full\"\n [class.hero-section--text]=\"variant === 'text'\"\n [class.hero-section--image]=\"variant === 'image'\"\n scrollReveal\n>\n @if (variant === 'image' && image) {\n <div class=\"hero-section__bg\">\n @if (image.publicId) {\n <ui-image \n [publicId]=\"image.publicId\" \n [eager]=\"true\"\n class=\"hero-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"image.url\"\n [alt]=\"image.alt\"\n class=\"hero-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n }\n\n <div class=\"hero-section__content col-span-full\">\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">\n @if (highlight && title.includes(highlight)) {\n {{ title.replace(highlight, '') }}\n <span class=\"highlight-text\">\n {{ highlight }}\n <div class=\"wave-wrapper\">\n <div class=\"wave\"></div>\n </div>\n </span>\n } @else {\n {{ title }}\n }\n </h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group--center\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.hero-section{position:relative;min-height:calc(100vh - 10rem);display:grid;grid-template-rows:1fr auto;text-align:center;overflow:hidden}.hero-section__content{position:relative;z-index:2}.hero-section__bg{position:absolute;inset:0;z-index:0;overflow:hidden}.hero-section__bg .hero-img,.hero-section__bg ui-image{width:100%;height:100%;object-fit:cover}.hero-section__bg:after{content:\"\";position:absolute;inset:0;background:linear-gradient(to bottom,#0003,#0009)}.text,.btn-link{font-size:1.3rem}@media(max-width:768px){.text,.btn-link{font-size:1.1rem}}.hero-section--text{align-items:center;justify-items:center;align-content:center}.hero-section--text .hero-section__content{grid-row:1/-1}.hero-section--text .title{font-family:var(--font-title-home);font-weight:200;font-size:4rem;line-height:.85;display:flex;flex-direction:column;align-items:center}@media(max-width:768px){.hero-section--text .title{font-size:3rem}}.hero-section--text .title .highlight-text{font-size:11.25rem;cursor:help;position:relative;z-index:2}@media(max-width:768px){.hero-section--text .title .highlight-text{font-size:8.25rem}}.hero-section--text .title .highlight-text .wave-wrapper{position:absolute;top:85%;left:0;width:100%;height:50px;z-index:-1}@media(max-width:768px){.hero-section--text .title .highlight-text .wave-wrapper{top:90%}}.hero-section--text .title .highlight-text .wave{position:absolute;background-image:url('data:image/svg+xml,<?xml version=\"1.0\" encoding=\"utf-8\"?>%0A<!-- Generator: Adobe Illustrator 26.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->%0A<svg version=\"1.1\" id=\"Calque_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"%0A%09 viewBox=\"0 0 27.6 8.4\" style=\"enable-background:new 0 0 27.6 8.4;\" xml:space=\"preserve\">%0A<style type=\"text/css\">%0A%09.st0{fill:none;stroke:%23FFFFFF;stroke-width:2;stroke-miterlimit:10;}%0A<\\/style>%0A<path class=\"st0\" d=\"M0,1c2.7,0,5.2,1.2,6.9,3.2s4.2,3.2,6.9,3.2c2.7,0,5.2-1.2,6.9-3.2S24.9,1,27.6,1\"/>%0A</svg>%0A');background-repeat:repeat-x;top:-1.2rem;opacity:.5;width:100%;height:50%}@media(max-width:768px){.hero-section--text .title .highlight-text .wave{width:70%;left:50%;transform:translate(-50%)}}.hero-section--text .title .highlight-text:hover .wave{animation:moveWave 5s infinite linear}.hero-section{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);height:100vh}.hero-section--image{align-items:end;justify-items:center}.hero-section--image .hero-section__content{grid-row:2;max-width:60rem;padding-bottom:5rem}.hero-section--image .title{font-family:var(--font-base);font-weight:700;font-size:2.5rem;line-height:1.2;color:#fff}@media(max-width:768px){.hero-section--image .title{font-size:2rem}}.hero-section--image .text{font-size:1rem;opacity:.85;color:#fff}.hero-section--image .btn-group--center{display:none}.hero-section--image .hero-section__bg img,.hero-section--image .hero-section__bg ui-image{filter:scale(1.05);transition:transform 6s ease}.hero-section--image .hero-section:hover .hero-img,.hero-section--image .hero-section:hover ui-image{transform:scale(1.1)}@keyframes moveWave{0%{background-position-x:0}to{background-position-x:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: LinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href"], outputs: ["anchorClicked"] }, { kind: "component", type: UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
51
- }
52
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: HeroSectionComponent, decorators: [{
53
- type: Component,
54
- args: [{ selector: 'lib-hero-section', standalone: true, imports: [CommonModule, LinkTypeDirective, UiIconComponent, UiImageComponent, ScrollRevealDirective], changeDetection: ChangeDetectionStrategy.OnPush, host: {
55
- style: 'display: contents',
56
- }, template: "<div\n class=\"hero-section col-span-full\"\n [class.hero-section--text]=\"variant === 'text'\"\n [class.hero-section--image]=\"variant === 'image'\"\n scrollReveal\n>\n @if (variant === 'image' && image) {\n <div class=\"hero-section__bg\">\n @if (image.publicId) {\n <ui-image \n [publicId]=\"image.publicId\" \n [eager]=\"true\"\n class=\"hero-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"image.url\"\n [alt]=\"image.alt\"\n class=\"hero-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n }\n\n <div class=\"hero-section__content col-span-full\">\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">\n @if (highlight && title.includes(highlight)) {\n {{ title.replace(highlight, '') }}\n <span class=\"highlight-text\">\n {{ highlight }}\n <div class=\"wave-wrapper\">\n <div class=\"wave\"></div>\n </div>\n </span>\n } @else {\n {{ title }}\n }\n </h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group--center\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.hero-section{position:relative;min-height:calc(100vh - 10rem);display:grid;grid-template-rows:1fr auto;text-align:center;overflow:hidden}.hero-section__content{position:relative;z-index:2}.hero-section__bg{position:absolute;inset:0;z-index:0;overflow:hidden}.hero-section__bg .hero-img,.hero-section__bg ui-image{width:100%;height:100%;object-fit:cover}.hero-section__bg:after{content:\"\";position:absolute;inset:0;background:linear-gradient(to bottom,#0003,#0009)}.text,.btn-link{font-size:1.3rem}@media(max-width:768px){.text,.btn-link{font-size:1.1rem}}.hero-section--text{align-items:center;justify-items:center;align-content:center}.hero-section--text .hero-section__content{grid-row:1/-1}.hero-section--text .title{font-family:var(--font-title-home);font-weight:200;font-size:4rem;line-height:.85;display:flex;flex-direction:column;align-items:center}@media(max-width:768px){.hero-section--text .title{font-size:3rem}}.hero-section--text .title .highlight-text{font-size:11.25rem;cursor:help;position:relative;z-index:2}@media(max-width:768px){.hero-section--text .title .highlight-text{font-size:8.25rem}}.hero-section--text .title .highlight-text .wave-wrapper{position:absolute;top:85%;left:0;width:100%;height:50px;z-index:-1}@media(max-width:768px){.hero-section--text .title .highlight-text .wave-wrapper{top:90%}}.hero-section--text .title .highlight-text .wave{position:absolute;background-image:url('data:image/svg+xml,<?xml version=\"1.0\" encoding=\"utf-8\"?>%0A<!-- Generator: Adobe Illustrator 26.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->%0A<svg version=\"1.1\" id=\"Calque_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"%0A%09 viewBox=\"0 0 27.6 8.4\" style=\"enable-background:new 0 0 27.6 8.4;\" xml:space=\"preserve\">%0A<style type=\"text/css\">%0A%09.st0{fill:none;stroke:%23FFFFFF;stroke-width:2;stroke-miterlimit:10;}%0A<\\/style>%0A<path class=\"st0\" d=\"M0,1c2.7,0,5.2,1.2,6.9,3.2s4.2,3.2,6.9,3.2c2.7,0,5.2-1.2,6.9-3.2S24.9,1,27.6,1\"/>%0A</svg>%0A');background-repeat:repeat-x;top:-1.2rem;opacity:.5;width:100%;height:50%}@media(max-width:768px){.hero-section--text .title .highlight-text .wave{width:70%;left:50%;transform:translate(-50%)}}.hero-section--text .title .highlight-text:hover .wave{animation:moveWave 5s infinite linear}.hero-section{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);height:100vh}.hero-section--image{align-items:end;justify-items:center}.hero-section--image .hero-section__content{grid-row:2;max-width:60rem;padding-bottom:5rem}.hero-section--image .title{font-family:var(--font-base);font-weight:700;font-size:2.5rem;line-height:1.2;color:#fff}@media(max-width:768px){.hero-section--image .title{font-size:2rem}}.hero-section--image .text{font-size:1rem;opacity:.85;color:#fff}.hero-section--image .btn-group--center{display:none}.hero-section--image .hero-section__bg img,.hero-section--image .hero-section__bg ui-image{filter:scale(1.05);transition:transform 6s ease}.hero-section--image .hero-section:hover .hero-img,.hero-section--image .hero-section:hover ui-image{transform:scale(1.1)}@keyframes moveWave{0%{background-position-x:0}to{background-position-x:100%}}\n"] }]
57
- }], ctorParameters: () => [{ type: Document, decorators: [{
58
- type: Inject,
59
- args: [DOCUMENT]
60
- }] }], propDecorators: { variant: [{
61
- type: Input
62
- }], pretitle: [{
63
- type: Input
64
- }], title: [{
65
- type: Input
66
- }], subtitle: [{
67
- type: Input
68
- }], text: [{
69
- type: Input
70
- }], buttons: [{
71
- type: Input
72
- }], highlight: [{
73
- type: Input
74
- }], image: [{
75
- type: Input
76
- }] } });
77
-
78
- var heroSection_stories = {
79
- title: 'Content/HeroSection',
80
- component: HeroSectionComponent,
81
- tags: ['autodocs'],
82
- argTypes: {
83
- variant: { control: 'radio', options: ['text', 'image'] },
84
- pretitle: { control: 'text' },
85
- title: { control: 'text' },
86
- subtitle: { control: 'text' },
87
- text: { control: 'text' },
88
- highlight: { control: 'text' },
89
- image: { control: 'object' },
90
- buttons: { control: 'object' },
91
- },
1
+ import { CommonModule, DOCUMENT, isPlatformBrowser } from "@angular/common";
2
+ import * as i0 from "@angular/core";
3
+ import { ChangeDetectionStrategy, Component, Inject, Input, PLATFORM_ID, ViewChild, computed, effect, signal } from "@angular/core";
4
+ import { HighlightDirective, LinkTypeDirective, ScrollRevealDirective } from "@lluc_llull/ui-lib/directives";
5
+ import { UiIconComponent, UiImageComponent } from "@lluc_llull/ui-lib/shared";
6
+ var CategoryProgressComponent = class CategoryProgressComponent {
7
+ pretitle;
8
+ title;
9
+ categories;
10
+ static ɵfac = i0.ɵɵngDeclareFactory({
11
+ minVersion: "12.0.0",
12
+ version: "22.2.4",
13
+ ngImport: i0,
14
+ type: CategoryProgressComponent,
15
+ deps: [],
16
+ target: i0.ɵɵFactoryTarget.Component
17
+ });
18
+ static ɵcmp = i0.ɵɵngDeclareComponent({
19
+ minVersion: "17.0.0",
20
+ version: "22.2.4",
21
+ type: CategoryProgressComponent,
22
+ isStandalone: true,
23
+ selector: "lib-category-progress",
24
+ inputs: {
25
+ pretitle: "pretitle",
26
+ title: "title",
27
+ categories: "categories"
28
+ },
29
+ host: { styleAttribute: "display: contents" },
30
+ ngImport: i0,
31
+ template: "<div class=\"category-progress col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h3 class=\"pretitle\">{{ pretitle }}</h3>\n }\n @if (title) {\n <h2 class=\"title\">{{ title }}</h2>\n }\n <div class=\"progress-grid\">\n @for (category of categories; track $index) {\n <div class=\"category\">\n <h3 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ category.title }}</h3>\n\n @for (item of category.items; track $index) {\n <div class=\"item\">\n <div class=\"item-info\">\n <span class=\"label\">{{ item.label }}</span>\n <span class=\"value\">{{ item.value }}%</span>\n </div>\n\n <div class=\"bar\">\n <div class=\"fill\" [style.width.%]=\"item.value\"></div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n",
32
+ styles: [".category-progress{text-align:start;align-items:start}.title{text-transform:uppercase}.progress-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.category{display:flex;flex-direction:column;gap:1.5rem}.category-title{font-weight:600;font-size:1.1rem}.subtitle{font-size:1.8rem;width:fit-content}.item{margin-bottom:0rem}.item .item-info{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.item .label,.item .value{font-size:1.3rem;margin-bottom:0;display:inline-block}.item .bar{background-color:var(--progress-bg);height:2px;border-radius:3px;overflow:hidden}.item .bar .fill{background-color:var(--progress-color);height:100%;width:0;transition:width .3s ease}\n"],
33
+ dependencies: [
34
+ {
35
+ kind: "ngmodule",
36
+ type: CommonModule
37
+ },
38
+ {
39
+ kind: "directive",
40
+ type: HighlightDirective,
41
+ selector: "[highlight]",
42
+ inputs: ["highlight", "highlightThickness"]
43
+ },
44
+ {
45
+ kind: "directive",
46
+ type: ScrollRevealDirective,
47
+ selector: "[scrollReveal]",
48
+ inputs: ["distance", "duration"]
49
+ }
50
+ ],
51
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
52
+ });
92
53
  };
93
- const Default = {
94
- args: {
95
- variant: 'text',
96
- pretitle: 'Bienvenido a',
97
- title: 'Nuestra Plataforma',
98
- subtitle: 'Descubre el futuro del desarrollo web',
99
- text: 'Texto descriptivo de ejemplo para el Hero Section.',
100
- highlight: 'Innovación',
101
- buttons: [
102
- { label: 'Comenzar', url: 'https://www.google.com', linkType: LinkType.External },
103
- {
104
- label: 'Más información',
105
- url: 'https://www.google.com',
106
- linkType: LinkType.External,
107
- },
108
- ],
109
- },
54
+ i0.ɵɵngDeclareClassMetadata({
55
+ minVersion: "12.0.0",
56
+ version: "22.2.4",
57
+ ngImport: i0,
58
+ type: CategoryProgressComponent,
59
+ decorators: [{
60
+ type: Component,
61
+ args: [{
62
+ selector: "lib-category-progress",
63
+ standalone: true,
64
+ imports: [
65
+ CommonModule,
66
+ HighlightDirective,
67
+ ScrollRevealDirective
68
+ ],
69
+ changeDetection: ChangeDetectionStrategy.OnPush,
70
+ host: { style: "display: contents" },
71
+ template: "<div class=\"category-progress col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h3 class=\"pretitle\">{{ pretitle }}</h3>\n }\n @if (title) {\n <h2 class=\"title\">{{ title }}</h2>\n }\n <div class=\"progress-grid\">\n @for (category of categories; track $index) {\n <div class=\"category\">\n <h3 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ category.title }}</h3>\n\n @for (item of category.items; track $index) {\n <div class=\"item\">\n <div class=\"item-info\">\n <span class=\"label\">{{ item.label }}</span>\n <span class=\"value\">{{ item.value }}%</span>\n </div>\n\n <div class=\"bar\">\n <div class=\"fill\" [style.width.%]=\"item.value\"></div>\n </div>\n </div>\n }\n </div>\n }\n </div>\n</div>\n",
72
+ styles: [".category-progress{text-align:start;align-items:start}.title{text-transform:uppercase}.progress-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.category{display:flex;flex-direction:column;gap:1.5rem}.category-title{font-weight:600;font-size:1.1rem}.subtitle{font-size:1.8rem;width:fit-content}.item{margin-bottom:0rem}.item .item-info{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.item .label,.item .value{font-size:1.3rem;margin-bottom:0;display:inline-block}.item .bar{background-color:var(--progress-bg);height:2px;border-radius:3px;overflow:hidden}.item .bar .fill{background-color:var(--progress-color);height:100%;width:0;transition:width .3s ease}\n"]
73
+ }]
74
+ }],
75
+ propDecorators: {
76
+ pretitle: [{ type: Input }],
77
+ title: [{ type: Input }],
78
+ categories: [{ type: Input }]
79
+ }
80
+ });
81
+ var HeroSectionComponent = class HeroSectionComponent {
82
+ document;
83
+ variant = "text";
84
+ pretitle;
85
+ title;
86
+ subtitle;
87
+ text;
88
+ buttons;
89
+ highlight;
90
+ image;
91
+ constructor(document) {
92
+ this.document = document;
93
+ }
94
+ ngOnInit() {
95
+ if (this.variant === "image") this.document.body.classList.add("has-hero-image");
96
+ }
97
+ ngOnDestroy() {
98
+ this.document.body.classList.remove("has-hero-image");
99
+ }
100
+ static ɵfac = i0.ɵɵngDeclareFactory({
101
+ minVersion: "12.0.0",
102
+ version: "22.2.4",
103
+ ngImport: i0,
104
+ type: HeroSectionComponent,
105
+ deps: [{ token: DOCUMENT }],
106
+ target: i0.ɵɵFactoryTarget.Component
107
+ });
108
+ static ɵcmp = i0.ɵɵngDeclareComponent({
109
+ minVersion: "17.0.0",
110
+ version: "22.2.4",
111
+ type: HeroSectionComponent,
112
+ isStandalone: true,
113
+ selector: "lib-hero-section",
114
+ inputs: {
115
+ variant: "variant",
116
+ pretitle: "pretitle",
117
+ title: "title",
118
+ subtitle: "subtitle",
119
+ text: "text",
120
+ buttons: "buttons",
121
+ highlight: "highlight",
122
+ image: "image"
123
+ },
124
+ host: { styleAttribute: "display: contents" },
125
+ ngImport: i0,
126
+ template: "<div\n class=\"hero-section col-span-full\"\n [class.hero-section--text]=\"variant === 'text'\"\n [class.hero-section--image]=\"variant === 'image'\"\n scrollReveal\n>\n @if (variant === 'image' && image) {\n <div class=\"hero-section__bg\">\n @if (image.publicId) {\n <ui-image \n [publicId]=\"image.publicId\" \n [eager]=\"true\"\n class=\"hero-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"image.url\"\n [alt]=\"image.alt\"\n class=\"hero-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n }\n\n <div class=\"hero-section__content col-span-full\">\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">\n @if (highlight && title.includes(highlight)) {\n {{ title.replace(highlight, '') }}\n <span class=\"highlight-text\">\n {{ highlight }}\n <div class=\"wave-wrapper\">\n <div class=\"wave\"></div>\n </div>\n </span>\n } @else {\n {{ title }}\n }\n </h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group--center\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n </div>\n</div>\n",
127
+ styles: ["@charset \"UTF-8\";.hero-section{position:relative;min-height:calc(100vh - 10rem);display:grid;grid-template-rows:1fr auto;text-align:center;overflow:hidden}.hero-section__content{position:relative;z-index:2}.hero-section__bg{position:absolute;inset:0;z-index:0;overflow:hidden}.hero-section__bg .hero-img,.hero-section__bg ui-image{width:100%;height:100%;object-fit:cover}.hero-section__bg:after{content:\"\";position:absolute;inset:0;background:linear-gradient(to bottom,#0003,#0009)}.text,.btn-link{font-size:1.3rem}@media(max-width:768px){.text,.btn-link{font-size:1.1rem}}.hero-section--text{align-items:center;justify-items:center;align-content:center}.hero-section--text .hero-section__content{grid-row:1/-1}.hero-section--text .title{font-family:var(--font-title-home);font-weight:200;font-size:4rem;line-height:.85;display:flex;flex-direction:column;align-items:center}@media(max-width:768px){.hero-section--text .title{font-size:3rem}}.hero-section--text .title .highlight-text{font-size:11.25rem;cursor:help;position:relative;z-index:2}@media(max-width:768px){.hero-section--text .title .highlight-text{font-size:8.25rem}}.hero-section--text .title .highlight-text .wave-wrapper{position:absolute;top:85%;left:0;width:100%;height:50px;z-index:-1}@media(max-width:768px){.hero-section--text .title .highlight-text .wave-wrapper{top:90%}}.hero-section--text .title .highlight-text .wave{position:absolute;background-image:url('data:image/svg+xml,<?xml version=\"1.0\" encoding=\"utf-8\"?>%0A<!-- Generator: Adobe Illustrator 26.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->%0A<svg version=\"1.1\" id=\"Calque_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"%0A%09 viewBox=\"0 0 27.6 8.4\" style=\"enable-background:new 0 0 27.6 8.4;\" xml:space=\"preserve\">%0A<style type=\"text/css\">%0A%09.st0{fill:none;stroke:%23FFFFFF;stroke-width:2;stroke-miterlimit:10;}%0A<\\/style>%0A<path class=\"st0\" d=\"M0,1c2.7,0,5.2,1.2,6.9,3.2s4.2,3.2,6.9,3.2c2.7,0,5.2-1.2,6.9-3.2S24.9,1,27.6,1\"/>%0A</svg>%0A');background-repeat:repeat-x;top:-1.2rem;opacity:.5;width:100%;height:50%}@media(max-width:768px){.hero-section--text .title .highlight-text .wave{width:70%;left:50%;transform:translate(-50%)}}.hero-section--text .title .highlight-text:hover .wave{animation:moveWave 5s infinite linear}.hero-section{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);height:100vh}.hero-section--image{align-items:end;justify-items:center}.hero-section--image .hero-section__content{grid-row:2;max-width:60rem;padding-bottom:5rem}.hero-section--image .title{font-family:var(--font-base);font-weight:700;font-size:2.5rem;line-height:1.2;color:#fff}@media(max-width:768px){.hero-section--image .title{font-size:2rem}}.hero-section--image .text{font-size:1rem;opacity:.85;color:#fff}.hero-section--image .btn-group--center{display:none}.hero-section--image .hero-section__bg img,.hero-section--image .hero-section__bg ui-image{filter:scale(1.05);transition:transform 6s ease}.hero-section--image .hero-section:hover .hero-img,.hero-section--image .hero-section:hover ui-image{transform:scale(1.1)}@keyframes moveWave{0%{background-position-x:0}to{background-position-x:100%}}\n"],
128
+ dependencies: [
129
+ {
130
+ kind: "ngmodule",
131
+ type: CommonModule
132
+ },
133
+ {
134
+ kind: "directive",
135
+ type: LinkTypeDirective,
136
+ selector: "[linkType]",
137
+ inputs: ["linkType", "href"],
138
+ outputs: ["anchorClicked"]
139
+ },
140
+ {
141
+ kind: "component",
142
+ type: UiIconComponent,
143
+ selector: "ui-icon",
144
+ inputs: [
145
+ "name",
146
+ "size",
147
+ "color"
148
+ ]
149
+ },
150
+ {
151
+ kind: "component",
152
+ type: UiImageComponent,
153
+ selector: "ui-image",
154
+ inputs: [
155
+ "publicId",
156
+ "cloudName",
157
+ "transformations",
158
+ "eager",
159
+ "width",
160
+ "height"
161
+ ]
162
+ },
163
+ {
164
+ kind: "directive",
165
+ type: ScrollRevealDirective,
166
+ selector: "[scrollReveal]",
167
+ inputs: ["distance", "duration"]
168
+ }
169
+ ],
170
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
171
+ });
110
172
  };
111
- const ImageVariant = {
112
- args: {
113
- variant: 'image',
114
- title: 'Proyecto Destacado',
115
- subtitle: 'Un ejemplo impresionante',
116
- text: 'Explora este increíble proyecto con diseño moderno y funcionalidades avanzadas.',
117
- image: {
118
- url: 'https://picsum.photos/seed/hero/1920/1080.jpg',
119
- alt: 'Hero background image',
120
- },
121
- buttons: [
122
- { label: 'Ver proyecto', url: 'https://www.google.com', linkType: LinkType.External },
123
- ],
124
- },
173
+ i0.ɵɵngDeclareClassMetadata({
174
+ minVersion: "12.0.0",
175
+ version: "22.2.4",
176
+ ngImport: i0,
177
+ type: HeroSectionComponent,
178
+ decorators: [{
179
+ type: Component,
180
+ args: [{
181
+ selector: "lib-hero-section",
182
+ standalone: true,
183
+ imports: [
184
+ CommonModule,
185
+ LinkTypeDirective,
186
+ UiIconComponent,
187
+ UiImageComponent,
188
+ ScrollRevealDirective
189
+ ],
190
+ changeDetection: ChangeDetectionStrategy.OnPush,
191
+ host: { style: "display: contents" },
192
+ template: "<div\n class=\"hero-section col-span-full\"\n [class.hero-section--text]=\"variant === 'text'\"\n [class.hero-section--image]=\"variant === 'image'\"\n scrollReveal\n>\n @if (variant === 'image' && image) {\n <div class=\"hero-section__bg\">\n @if (image.publicId) {\n <ui-image \n [publicId]=\"image.publicId\" \n [eager]=\"true\"\n class=\"hero-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"image.url\"\n [alt]=\"image.alt\"\n class=\"hero-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n }\n\n <div class=\"hero-section__content col-span-full\">\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">\n @if (highlight && title.includes(highlight)) {\n {{ title.replace(highlight, '') }}\n <span class=\"highlight-text\">\n {{ highlight }}\n <div class=\"wave-wrapper\">\n <div class=\"wave\"></div>\n </div>\n </span>\n } @else {\n {{ title }}\n }\n </h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group--center\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n </div>\n</div>\n",
193
+ styles: ["@charset \"UTF-8\";.hero-section{position:relative;min-height:calc(100vh - 10rem);display:grid;grid-template-rows:1fr auto;text-align:center;overflow:hidden}.hero-section__content{position:relative;z-index:2}.hero-section__bg{position:absolute;inset:0;z-index:0;overflow:hidden}.hero-section__bg .hero-img,.hero-section__bg ui-image{width:100%;height:100%;object-fit:cover}.hero-section__bg:after{content:\"\";position:absolute;inset:0;background:linear-gradient(to bottom,#0003,#0009)}.text,.btn-link{font-size:1.3rem}@media(max-width:768px){.text,.btn-link{font-size:1.1rem}}.hero-section--text{align-items:center;justify-items:center;align-content:center}.hero-section--text .hero-section__content{grid-row:1/-1}.hero-section--text .title{font-family:var(--font-title-home);font-weight:200;font-size:4rem;line-height:.85;display:flex;flex-direction:column;align-items:center}@media(max-width:768px){.hero-section--text .title{font-size:3rem}}.hero-section--text .title .highlight-text{font-size:11.25rem;cursor:help;position:relative;z-index:2}@media(max-width:768px){.hero-section--text .title .highlight-text{font-size:8.25rem}}.hero-section--text .title .highlight-text .wave-wrapper{position:absolute;top:85%;left:0;width:100%;height:50px;z-index:-1}@media(max-width:768px){.hero-section--text .title .highlight-text .wave-wrapper{top:90%}}.hero-section--text .title .highlight-text .wave{position:absolute;background-image:url('data:image/svg+xml,<?xml version=\"1.0\" encoding=\"utf-8\"?>%0A<!-- Generator: Adobe Illustrator 26.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->%0A<svg version=\"1.1\" id=\"Calque_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"%0A%09 viewBox=\"0 0 27.6 8.4\" style=\"enable-background:new 0 0 27.6 8.4;\" xml:space=\"preserve\">%0A<style type=\"text/css\">%0A%09.st0{fill:none;stroke:%23FFFFFF;stroke-width:2;stroke-miterlimit:10;}%0A<\\/style>%0A<path class=\"st0\" d=\"M0,1c2.7,0,5.2,1.2,6.9,3.2s4.2,3.2,6.9,3.2c2.7,0,5.2-1.2,6.9-3.2S24.9,1,27.6,1\"/>%0A</svg>%0A');background-repeat:repeat-x;top:-1.2rem;opacity:.5;width:100%;height:50%}@media(max-width:768px){.hero-section--text .title .highlight-text .wave{width:70%;left:50%;transform:translate(-50%)}}.hero-section--text .title .highlight-text:hover .wave{animation:moveWave 5s infinite linear}.hero-section{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);height:100vh}.hero-section--image{align-items:end;justify-items:center}.hero-section--image .hero-section__content{grid-row:2;max-width:60rem;padding-bottom:5rem}.hero-section--image .title{font-family:var(--font-base);font-weight:700;font-size:2.5rem;line-height:1.2;color:#fff}@media(max-width:768px){.hero-section--image .title{font-size:2rem}}.hero-section--image .text{font-size:1rem;opacity:.85;color:#fff}.hero-section--image .btn-group--center{display:none}.hero-section--image .hero-section__bg img,.hero-section--image .hero-section__bg ui-image{filter:scale(1.05);transition:transform 6s ease}.hero-section--image .hero-section:hover .hero-img,.hero-section--image .hero-section:hover ui-image{transform:scale(1.1)}@keyframes moveWave{0%{background-position-x:0}to{background-position-x:100%}}\n"]
194
+ }]
195
+ }],
196
+ ctorParameters: () => [{
197
+ type: Document,
198
+ decorators: [{
199
+ type: Inject,
200
+ args: [DOCUMENT]
201
+ }]
202
+ }],
203
+ propDecorators: {
204
+ variant: [{ type: Input }],
205
+ pretitle: [{ type: Input }],
206
+ title: [{ type: Input }],
207
+ subtitle: [{ type: Input }],
208
+ text: [{ type: Input }],
209
+ buttons: [{ type: Input }],
210
+ highlight: [{ type: Input }],
211
+ image: [{ type: Input }]
212
+ }
213
+ });
214
+ var SectionIntroComponent = class SectionIntroComponent {
215
+ pretitle;
216
+ title;
217
+ subtitle;
218
+ text;
219
+ button;
220
+ static ɵfac = i0.ɵɵngDeclareFactory({
221
+ minVersion: "12.0.0",
222
+ version: "22.2.4",
223
+ ngImport: i0,
224
+ type: SectionIntroComponent,
225
+ deps: [],
226
+ target: i0.ɵɵFactoryTarget.Component
227
+ });
228
+ static ɵcmp = i0.ɵɵngDeclareComponent({
229
+ minVersion: "17.0.0",
230
+ version: "22.2.4",
231
+ type: SectionIntroComponent,
232
+ isStandalone: true,
233
+ selector: "lib-section-intro",
234
+ inputs: {
235
+ pretitle: "pretitle",
236
+ title: "title",
237
+ subtitle: "subtitle",
238
+ text: "text",
239
+ button: "button"
240
+ },
241
+ host: { styleAttribute: "display: contents" },
242
+ ngImport: i0,
243
+ template: "<div class=\"section-intro col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (button) {\n <div class=\"btn-group\">\n <a [href]=\"button.url\" [linkType]=\"button.linkType\" class=\"btn btn-link\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n </div>\n }\n</div>\n",
244
+ styles: [".section-intro{text-align:start;align-items:start}.title,.subtitle{text-transform:uppercase}\n"],
245
+ dependencies: [
246
+ {
247
+ kind: "ngmodule",
248
+ type: CommonModule
249
+ },
250
+ {
251
+ kind: "directive",
252
+ type: LinkTypeDirective,
253
+ selector: "[linkType]",
254
+ inputs: ["linkType", "href"],
255
+ outputs: ["anchorClicked"]
256
+ },
257
+ {
258
+ kind: "component",
259
+ type: UiIconComponent,
260
+ selector: "ui-icon",
261
+ inputs: [
262
+ "name",
263
+ "size",
264
+ "color"
265
+ ]
266
+ },
267
+ {
268
+ kind: "directive",
269
+ type: ScrollRevealDirective,
270
+ selector: "[scrollReveal]",
271
+ inputs: ["distance", "duration"]
272
+ }
273
+ ],
274
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
275
+ });
125
276
  };
277
+ i0.ɵɵngDeclareClassMetadata({
278
+ minVersion: "12.0.0",
279
+ version: "22.2.4",
280
+ ngImport: i0,
281
+ type: SectionIntroComponent,
282
+ decorators: [{
283
+ type: Component,
284
+ args: [{
285
+ selector: "lib-section-intro",
286
+ standalone: true,
287
+ imports: [
288
+ CommonModule,
289
+ LinkTypeDirective,
290
+ UiIconComponent,
291
+ ScrollRevealDirective
292
+ ],
293
+ changeDetection: ChangeDetectionStrategy.OnPush,
294
+ host: { style: "display: contents" },
295
+ template: "<div class=\"section-intro col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (button) {\n <div class=\"btn-group\">\n <a [href]=\"button.url\" [linkType]=\"button.linkType\" class=\"btn btn-link\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n </div>\n }\n</div>\n",
296
+ styles: [".section-intro{text-align:start;align-items:start}.title,.subtitle{text-transform:uppercase}\n"]
297
+ }]
298
+ }],
299
+ propDecorators: {
300
+ pretitle: [{ type: Input }],
301
+ title: [{ type: Input }],
302
+ subtitle: [{ type: Input }],
303
+ text: [{ type: Input }],
304
+ button: [{ type: Input }]
305
+ }
306
+ });
307
+ var SplitPreviewerComponent = class SplitPreviewerComponent {
308
+ platformId;
309
+ title;
310
+ items;
311
+ imageDefault;
312
+ direction = "right";
313
+ activeImage = signal(void 0, ...ngDevMode ? [{ debugName: "activeImage" }] : /* istanbul ignore next */ []);
314
+ get count() {
315
+ return this.items?.length || 0;
316
+ }
317
+ constructor(platformId) {
318
+ this.platformId = platformId;
319
+ }
320
+ ngOnInit() {
321
+ if (!this.items) return;
322
+ if (!isPlatformBrowser(this.platformId)) return;
323
+ if ("requestIdleCallback" in window) window.requestIdleCallback(() => {
324
+ this.items?.forEach((item) => {
325
+ if (item.image?.url) {
326
+ const img = new Image();
327
+ img.src = item.image.url;
328
+ }
329
+ });
330
+ });
331
+ }
332
+ static ɵfac = i0.ɵɵngDeclareFactory({
333
+ minVersion: "12.0.0",
334
+ version: "22.2.4",
335
+ ngImport: i0,
336
+ type: SplitPreviewerComponent,
337
+ deps: [{ token: PLATFORM_ID }],
338
+ target: i0.ɵɵFactoryTarget.Component
339
+ });
340
+ static ɵcmp = i0.ɵɵngDeclareComponent({
341
+ minVersion: "17.0.0",
342
+ version: "22.2.4",
343
+ type: SplitPreviewerComponent,
344
+ isStandalone: true,
345
+ selector: "lib-split-previewer",
346
+ inputs: {
347
+ title: "title",
348
+ items: "items",
349
+ imageDefault: "imageDefault",
350
+ direction: "direction"
351
+ },
352
+ host: { styleAttribute: "display: contents" },
353
+ ngImport: i0,
354
+ template: "<div\n class=\"split-previewer col-span-full md:col-span-12 md:col-start-1\"\n [class]=\"'split-previewer--' + direction\"\n scrollReveal\n>\n <div class=\"split-previewer__text-column\">\n <div class=\"split-previewer__header\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (count) {\n <span class=\"count\">{{ count }}</span>\n }\n </div>\n\n <div class=\"split-previewer__items\" (mouseleave)=\"activeImage.set(undefined)\">\n @for (item of items; track item.title) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n (mouseenter)=\"activeImage.set(item.image)\"\n class=\"split-previewer__item-link\"\n >\n <div class=\"split-previewer__item\">\n <h2 class=\"split-previewer__item-title\" [highlight]=\"'#FFFFFF'\">{{ item.title }}</h2>\n <p class=\"split-previewer__item-text\">{{ item.description }}</p>\n @if (item.tags?.length) {\n <div class=\"split-previewer__item-tags\">\n @for (tag of item.tags; track tag) {\n <span class=\"split-previewer__item-tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n </a>\n }\n </div>\n </div>\n\n <div class=\"split-previewer__media\">\n <div class=\"split-previewer__media-inner\">\n @if ((activeImage() || imageDefault)?.publicId) {\n <ui-image \n [publicId]=\"(activeImage() || imageDefault)!.publicId!\" \n [eager]=\"true\"\n class=\"preview-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"(activeImage() || imageDefault)?.url\"\n [alt]=\"(activeImage() || imageDefault)?.alt\"\n class=\"preview-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n </div>\n</div>\n",
355
+ styles: [".split-previewer{display:flex;gap:5rem;min-width:0;padding-bottom:5rem}.split-previewer--left{flex-direction:row-reverse}.split-previewer--right{flex-direction:row}.split-previewer__text-column{flex:1;display:flex;flex-direction:column;min-width:0}.split-previewer__header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;min-width:0}.split-previewer__header .title{margin:0 0 1rem;text-transform:uppercase;min-width:0}.split-previewer__header .count{font-family:var(--font-base);font-size:1rem;font-weight:500;flex-shrink:0}.split-previewer__items{display:flex;flex-direction:column;min-width:0}.split-previewer__item-link{text-decoration:none;color:inherit;display:block;min-width:0}.split-previewer__item{transition:all .4s cubic-bezier(.25,.46,.45,.94);min-width:0}.split-previewer__item-title{margin-bottom:.5rem;display:inline-block;min-width:0}.split-previewer__item-text{line-height:1.6;max-width:min(1000px,100%);opacity:.8;overflow-wrap:break-word;font-size:1.2rem}.split-previewer__item-tags{display:flex;flex-wrap:wrap;gap:1rem;margin-block:1rem;opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}.split-previewer__item-tag{font-size:1rem;font-weight:600;letter-spacing:.05em;padding:.3rem .8rem;background-color:var(--tag-bg);color:var(--tag-color);border-radius:2px}.split-previewer__item-link:hover .split-previewer__item{padding-left:1rem}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:1;transform:translateY(0)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:1}.split-previewer__media{flex:1;min-width:0;position:relative}.split-previewer__media-inner{position:sticky;top:4rem;height:fit-content;display:flex;justify-content:center;align-items:center}.split-previewer__media .preview-img{display:block;width:100%;aspect-ratio:5/4;max-width:100%;height:auto;object-fit:contain;animation:fadeInMedia .5s ease-out;filter:contrast(1.1) grayscale(.2)}@media(max-width:1280px){.split-previewer{gap:3rem}}@media(max-width:1024px){.split-previewer{display:block;width:100%;min-width:0}.split-previewer--left,.split-previewer--right{flex-direction:unset}.split-previewer__media{display:none}.split-previewer__header{display:block}.split-previewer__header .title{margin-bottom:.75rem}.split-previewer__header .count{display:inline-block}.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}.split-previewer__item-text{max-width:100%}.split-previewer__item-tags{display:none}}@media(hover:none)and (pointer:coarse){.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}}@keyframes fadeInMedia{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}\n"],
356
+ dependencies: [
357
+ {
358
+ kind: "ngmodule",
359
+ type: CommonModule
360
+ },
361
+ {
362
+ kind: "directive",
363
+ type: LinkTypeDirective,
364
+ selector: "[linkType]",
365
+ inputs: ["linkType", "href"],
366
+ outputs: ["anchorClicked"]
367
+ },
368
+ {
369
+ kind: "directive",
370
+ type: HighlightDirective,
371
+ selector: "[highlight]",
372
+ inputs: ["highlight", "highlightThickness"]
373
+ },
374
+ {
375
+ kind: "directive",
376
+ type: ScrollRevealDirective,
377
+ selector: "[scrollReveal]",
378
+ inputs: ["distance", "duration"]
379
+ },
380
+ {
381
+ kind: "component",
382
+ type: UiImageComponent,
383
+ selector: "ui-image",
384
+ inputs: [
385
+ "publicId",
386
+ "cloudName",
387
+ "transformations",
388
+ "eager",
389
+ "width",
390
+ "height"
391
+ ]
392
+ }
393
+ ],
394
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
395
+ });
396
+ };
397
+ i0.ɵɵngDeclareClassMetadata({
398
+ minVersion: "12.0.0",
399
+ version: "22.2.4",
400
+ ngImport: i0,
401
+ type: SplitPreviewerComponent,
402
+ decorators: [{
403
+ type: Component,
404
+ args: [{
405
+ selector: "lib-split-previewer",
406
+ imports: [
407
+ CommonModule,
408
+ LinkTypeDirective,
409
+ HighlightDirective,
410
+ ScrollRevealDirective,
411
+ UiImageComponent
412
+ ],
413
+ changeDetection: ChangeDetectionStrategy.OnPush,
414
+ host: { style: "display: contents" },
415
+ template: "<div\n class=\"split-previewer col-span-full md:col-span-12 md:col-start-1\"\n [class]=\"'split-previewer--' + direction\"\n scrollReveal\n>\n <div class=\"split-previewer__text-column\">\n <div class=\"split-previewer__header\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (count) {\n <span class=\"count\">{{ count }}</span>\n }\n </div>\n\n <div class=\"split-previewer__items\" (mouseleave)=\"activeImage.set(undefined)\">\n @for (item of items; track item.title) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n (mouseenter)=\"activeImage.set(item.image)\"\n class=\"split-previewer__item-link\"\n >\n <div class=\"split-previewer__item\">\n <h2 class=\"split-previewer__item-title\" [highlight]=\"'#FFFFFF'\">{{ item.title }}</h2>\n <p class=\"split-previewer__item-text\">{{ item.description }}</p>\n @if (item.tags?.length) {\n <div class=\"split-previewer__item-tags\">\n @for (tag of item.tags; track tag) {\n <span class=\"split-previewer__item-tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n </a>\n }\n </div>\n </div>\n\n <div class=\"split-previewer__media\">\n <div class=\"split-previewer__media-inner\">\n @if ((activeImage() || imageDefault)?.publicId) {\n <ui-image \n [publicId]=\"(activeImage() || imageDefault)!.publicId!\" \n [eager]=\"true\"\n class=\"preview-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"(activeImage() || imageDefault)?.url\"\n [alt]=\"(activeImage() || imageDefault)?.alt\"\n class=\"preview-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n </div>\n</div>\n",
416
+ styles: [".split-previewer{display:flex;gap:5rem;min-width:0;padding-bottom:5rem}.split-previewer--left{flex-direction:row-reverse}.split-previewer--right{flex-direction:row}.split-previewer__text-column{flex:1;display:flex;flex-direction:column;min-width:0}.split-previewer__header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;min-width:0}.split-previewer__header .title{margin:0 0 1rem;text-transform:uppercase;min-width:0}.split-previewer__header .count{font-family:var(--font-base);font-size:1rem;font-weight:500;flex-shrink:0}.split-previewer__items{display:flex;flex-direction:column;min-width:0}.split-previewer__item-link{text-decoration:none;color:inherit;display:block;min-width:0}.split-previewer__item{transition:all .4s cubic-bezier(.25,.46,.45,.94);min-width:0}.split-previewer__item-title{margin-bottom:.5rem;display:inline-block;min-width:0}.split-previewer__item-text{line-height:1.6;max-width:min(1000px,100%);opacity:.8;overflow-wrap:break-word;font-size:1.2rem}.split-previewer__item-tags{display:flex;flex-wrap:wrap;gap:1rem;margin-block:1rem;opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}.split-previewer__item-tag{font-size:1rem;font-weight:600;letter-spacing:.05em;padding:.3rem .8rem;background-color:var(--tag-bg);color:var(--tag-color);border-radius:2px}.split-previewer__item-link:hover .split-previewer__item{padding-left:1rem}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:1;transform:translateY(0)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:1}.split-previewer__media{flex:1;min-width:0;position:relative}.split-previewer__media-inner{position:sticky;top:4rem;height:fit-content;display:flex;justify-content:center;align-items:center}.split-previewer__media .preview-img{display:block;width:100%;aspect-ratio:5/4;max-width:100%;height:auto;object-fit:contain;animation:fadeInMedia .5s ease-out;filter:contrast(1.1) grayscale(.2)}@media(max-width:1280px){.split-previewer{gap:3rem}}@media(max-width:1024px){.split-previewer{display:block;width:100%;min-width:0}.split-previewer--left,.split-previewer--right{flex-direction:unset}.split-previewer__media{display:none}.split-previewer__header{display:block}.split-previewer__header .title{margin-bottom:.75rem}.split-previewer__header .count{display:inline-block}.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}.split-previewer__item-text{max-width:100%}.split-previewer__item-tags{display:none}}@media(hover:none)and (pointer:coarse){.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}}@keyframes fadeInMedia{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}\n"]
417
+ }]
418
+ }],
419
+ ctorParameters: () => [{
420
+ type: Object,
421
+ decorators: [{
422
+ type: Inject,
423
+ args: [PLATFORM_ID]
424
+ }]
425
+ }],
426
+ propDecorators: {
427
+ title: [{ type: Input }],
428
+ items: [{ type: Input }],
429
+ imageDefault: [{ type: Input }],
430
+ direction: [{ type: Input }]
431
+ }
432
+ });
433
+ var ContactMinimalComponent = class ContactMinimalComponent {
434
+ contactsTitle;
435
+ socialsTitle;
436
+ contacts;
437
+ socials;
438
+ img;
439
+ static ɵfac = i0.ɵɵngDeclareFactory({
440
+ minVersion: "12.0.0",
441
+ version: "22.2.4",
442
+ ngImport: i0,
443
+ type: ContactMinimalComponent,
444
+ deps: [],
445
+ target: i0.ɵɵFactoryTarget.Component
446
+ });
447
+ static ɵcmp = i0.ɵɵngDeclareComponent({
448
+ minVersion: "17.0.0",
449
+ version: "22.2.4",
450
+ type: ContactMinimalComponent,
451
+ isStandalone: true,
452
+ selector: "lib-contact-minimal",
453
+ inputs: {
454
+ contactsTitle: "contactsTitle",
455
+ socialsTitle: "socialsTitle",
456
+ contacts: "contacts",
457
+ socials: "socials",
458
+ img: "img"
459
+ },
460
+ host: { styleAttribute: "display: contents" },
461
+ ngImport: i0,
462
+ template: "<div class=\"contact-minimal main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"contact-minimal__content col-span-full md:col-span-12 md:col-start-1\">\n <div class=\"contact-minimal__content--left col-span-6 col-start-1\">\n @if (contactsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ contactsTitle }}</h2>\n }\n @if (contacts && contacts.length > 0) {\n <div class=\"btn-group\">\n @for (contact of contacts; track $index) {\n <a [href]=\"contact?.url\" [linkType]=\"contact?.linkType\" class=\"btn btn-link\">\n {{ contact?.label }}\n </a>\n }\n </div>\n }\n </div>\n <div class=\"contact-minimal__content--right col-span-6 col-start-7\">\n @if (socialsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ socialsTitle }}</h2>\n }\n @if (socials && socials.length > 0) {\n <div class=\"btn-group\">\n @for (social of socials; track $index) {\n <a [href]=\"social?.url\" [linkType]=\"social?.linkType\" class=\"btn btn-link\">\n {{ social?.label }}\n </a>\n }\n </div>\n }\n </div>\n </div>\n @if (img) {\n <div class=\"contact-minimal__content--media col-span-full md:col-span-12 md:col-start-1\">\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\"></ui-image>\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </div>\n }\n</div>\n",
463
+ styles: [".contact-minimal__content{display:grid;grid-auto-flow:column}.contact-minimal__content--left .btn{justify-content:start;font-size:1.1rem}.contact-minimal__content--right{justify-self:end}.contact-minimal__content--right .btn-group{align-items:end}.contact-minimal__content--right .btn{justify-content:end;font-size:1.1rem}.contact-minimal__content--media{justify-self:center}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{transform:rotate(45deg);width:50rem}@media(max-width:768px){.contact-minimal__content--media{top:16rem}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{width:15rem;height:auto}}.contact-minimal .btn-group{display:flex;flex-direction:column;margin-top:1rem;gap:0}\n"],
464
+ dependencies: [
465
+ {
466
+ kind: "ngmodule",
467
+ type: CommonModule
468
+ },
469
+ {
470
+ kind: "directive",
471
+ type: HighlightDirective,
472
+ selector: "[highlight]",
473
+ inputs: ["highlight", "highlightThickness"]
474
+ },
475
+ {
476
+ kind: "directive",
477
+ type: LinkTypeDirective,
478
+ selector: "[linkType]",
479
+ inputs: ["linkType", "href"],
480
+ outputs: ["anchorClicked"]
481
+ },
482
+ {
483
+ kind: "directive",
484
+ type: ScrollRevealDirective,
485
+ selector: "[scrollReveal]",
486
+ inputs: ["distance", "duration"]
487
+ },
488
+ {
489
+ kind: "component",
490
+ type: UiImageComponent,
491
+ selector: "ui-image",
492
+ inputs: [
493
+ "publicId",
494
+ "cloudName",
495
+ "transformations",
496
+ "eager",
497
+ "width",
498
+ "height"
499
+ ]
500
+ }
501
+ ],
502
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
503
+ });
504
+ };
505
+ i0.ɵɵngDeclareClassMetadata({
506
+ minVersion: "12.0.0",
507
+ version: "22.2.4",
508
+ ngImport: i0,
509
+ type: ContactMinimalComponent,
510
+ decorators: [{
511
+ type: Component,
512
+ args: [{
513
+ selector: "lib-contact-minimal",
514
+ imports: [
515
+ CommonModule,
516
+ HighlightDirective,
517
+ LinkTypeDirective,
518
+ ScrollRevealDirective,
519
+ UiImageComponent
520
+ ],
521
+ changeDetection: ChangeDetectionStrategy.OnPush,
522
+ host: { style: "display: contents" },
523
+ template: "<div class=\"contact-minimal main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"contact-minimal__content col-span-full md:col-span-12 md:col-start-1\">\n <div class=\"contact-minimal__content--left col-span-6 col-start-1\">\n @if (contactsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ contactsTitle }}</h2>\n }\n @if (contacts && contacts.length > 0) {\n <div class=\"btn-group\">\n @for (contact of contacts; track $index) {\n <a [href]=\"contact?.url\" [linkType]=\"contact?.linkType\" class=\"btn btn-link\">\n {{ contact?.label }}\n </a>\n }\n </div>\n }\n </div>\n <div class=\"contact-minimal__content--right col-span-6 col-start-7\">\n @if (socialsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ socialsTitle }}</h2>\n }\n @if (socials && socials.length > 0) {\n <div class=\"btn-group\">\n @for (social of socials; track $index) {\n <a [href]=\"social?.url\" [linkType]=\"social?.linkType\" class=\"btn btn-link\">\n {{ social?.label }}\n </a>\n }\n </div>\n }\n </div>\n </div>\n @if (img) {\n <div class=\"contact-minimal__content--media col-span-full md:col-span-12 md:col-start-1\">\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\"></ui-image>\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </div>\n }\n</div>\n",
524
+ styles: [".contact-minimal__content{display:grid;grid-auto-flow:column}.contact-minimal__content--left .btn{justify-content:start;font-size:1.1rem}.contact-minimal__content--right{justify-self:end}.contact-minimal__content--right .btn-group{align-items:end}.contact-minimal__content--right .btn{justify-content:end;font-size:1.1rem}.contact-minimal__content--media{justify-self:center}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{transform:rotate(45deg);width:50rem}@media(max-width:768px){.contact-minimal__content--media{top:16rem}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{width:15rem;height:auto}}.contact-minimal .btn-group{display:flex;flex-direction:column;margin-top:1rem;gap:0}\n"]
525
+ }]
526
+ }],
527
+ propDecorators: {
528
+ contactsTitle: [{ type: Input }],
529
+ socialsTitle: [{ type: Input }],
530
+ contacts: [{ type: Input }],
531
+ socials: [{ type: Input }],
532
+ img: [{ type: Input }]
533
+ }
534
+ });
535
+ var MediaSplitComponent = class MediaSplitComponent {
536
+ platformId;
537
+ title;
538
+ text;
539
+ images;
540
+ activeImageIndex = signal(0, ...ngDevMode ? [{ debugName: "activeImageIndex" }] : /* istanbul ignore next */ []);
541
+ imageLoaded = signal(false, ...ngDevMode ? [{ debugName: "imageLoaded" }] : /* istanbul ignore next */ []);
542
+ constructor(platformId) {
543
+ this.platformId = platformId;
544
+ effect(() => {
545
+ this.activeImageIndex();
546
+ if (!isPlatformBrowser(this.platformId)) return;
547
+ this.imageLoaded.set(false);
548
+ requestAnimationFrame(() => {
549
+ this.imageLoaded.set(true);
550
+ });
551
+ });
552
+ }
553
+ currentImage = computed(() => {
554
+ return (this.images ?? [])[this.activeImageIndex()] ?? null;
555
+ }, ...ngDevMode ? [{ debugName: "currentImage" }] : /* istanbul ignore next */ []);
556
+ updateActiveImage(index) {
557
+ this.activeImageIndex.set(index);
558
+ }
559
+ resetImage() {
560
+ this.activeImageIndex.set(0);
561
+ }
562
+ ngOnInit() {
563
+ if (!isPlatformBrowser(this.platformId)) return;
564
+ if ("requestIdleCallback" in window) window.requestIdleCallback(() => {
565
+ this.preloadImages();
566
+ });
567
+ else setTimeout(() => this.preloadImages(), 2e3);
568
+ }
569
+ preloadImages() {
570
+ this.images?.slice(1).forEach((img) => {
571
+ const i = new Image();
572
+ i.src = img.url;
573
+ });
574
+ }
575
+ static ɵfac = i0.ɵɵngDeclareFactory({
576
+ minVersion: "12.0.0",
577
+ version: "22.2.4",
578
+ ngImport: i0,
579
+ type: MediaSplitComponent,
580
+ deps: [{ token: PLATFORM_ID }],
581
+ target: i0.ɵɵFactoryTarget.Component
582
+ });
583
+ static ɵcmp = i0.ɵɵngDeclareComponent({
584
+ minVersion: "17.0.0",
585
+ version: "22.2.4",
586
+ type: MediaSplitComponent,
587
+ isStandalone: true,
588
+ selector: "lib-media-split",
589
+ inputs: {
590
+ title: "title",
591
+ text: "text",
592
+ images: "images"
593
+ },
594
+ host: { styleAttribute: "display: contents" },
595
+ ngImport: i0,
596
+ template: "<div class=\"media-split main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-split__visual col-span-full md:col-span-7 md:col-start-1\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n\n @if (images?.length) {\n <div class=\"image-stack\" (mouseleave)=\"resetImage()\">\n @if (currentImage().publicId) {\n <ui-image\n [publicId]=\"currentImage().publicId!\"\n [eager]=\"true\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n ></ui-image>\n } @else {\n <img\n [src]=\"currentImage().url\"\n [alt]=\"currentImage().alt\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n loading=\"eager\"\n fetchpriority=\"high\"\n />\n }\n\n <div class=\"hover-grid\">\n @for (image of images; track $index) {\n <div class=\"hover-zone\" (mouseenter)=\"updateActiveImage($index)\"></div>\n }\n </div>\n </div>\n }\n </div>\n\n <div class=\"media-split__info col-span-full md:col-span-5 md:col-start-8\">\n @if (text) {\n <p class=\"text\" [innerHTML]=\"text\"></p>\n }\n </div>\n</div>\n",
597
+ styles: [".media-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:1.5rem;align-items:end;padding-block:0rem}.media-split__visual{display:flex;flex-direction:column;justify-content:flex-end}.media-split__visual .title{margin-bottom:1.5rem;text-transform:uppercase}.media-split__info{align-self:end;padding-bottom:.5rem}.img-responsive{width:100%;height:100%;display:block;object-fit:cover}.image-stack{position:relative;width:100%;aspect-ratio:14/9;overflow:hidden;cursor:ew-resize}.active-image{position:absolute;inset:0;opacity:0;transform:scale(1.03);transition:opacity .35s ease,transform .6s ease}.active-image.loaded{opacity:1;transform:scale(1)}.hover-grid{position:absolute;inset:0;display:flex;z-index:10;pointer-events:none}.hover-grid .hover-zone{flex:1;height:100%;cursor:inherit;pointer-events:auto}\n"],
598
+ dependencies: [{
599
+ kind: "ngmodule",
600
+ type: CommonModule
601
+ }, {
602
+ kind: "component",
603
+ type: UiImageComponent,
604
+ selector: "ui-image",
605
+ inputs: [
606
+ "publicId",
607
+ "cloudName",
608
+ "transformations",
609
+ "eager",
610
+ "width",
611
+ "height"
612
+ ]
613
+ }],
614
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
615
+ });
616
+ };
617
+ i0.ɵɵngDeclareClassMetadata({
618
+ minVersion: "12.0.0",
619
+ version: "22.2.4",
620
+ ngImport: i0,
621
+ type: MediaSplitComponent,
622
+ decorators: [{
623
+ type: Component,
624
+ args: [{
625
+ selector: "lib-media-split",
626
+ standalone: true,
627
+ imports: [CommonModule, UiImageComponent],
628
+ changeDetection: ChangeDetectionStrategy.OnPush,
629
+ host: { style: "display: contents" },
630
+ template: "<div class=\"media-split main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-split__visual col-span-full md:col-span-7 md:col-start-1\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n\n @if (images?.length) {\n <div class=\"image-stack\" (mouseleave)=\"resetImage()\">\n @if (currentImage().publicId) {\n <ui-image\n [publicId]=\"currentImage().publicId!\"\n [eager]=\"true\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n ></ui-image>\n } @else {\n <img\n [src]=\"currentImage().url\"\n [alt]=\"currentImage().alt\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n loading=\"eager\"\n fetchpriority=\"high\"\n />\n }\n\n <div class=\"hover-grid\">\n @for (image of images; track $index) {\n <div class=\"hover-zone\" (mouseenter)=\"updateActiveImage($index)\"></div>\n }\n </div>\n </div>\n }\n </div>\n\n <div class=\"media-split__info col-span-full md:col-span-5 md:col-start-8\">\n @if (text) {\n <p class=\"text\" [innerHTML]=\"text\"></p>\n }\n </div>\n</div>\n",
631
+ styles: [".media-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:1.5rem;align-items:end;padding-block:0rem}.media-split__visual{display:flex;flex-direction:column;justify-content:flex-end}.media-split__visual .title{margin-bottom:1.5rem;text-transform:uppercase}.media-split__info{align-self:end;padding-bottom:.5rem}.img-responsive{width:100%;height:100%;display:block;object-fit:cover}.image-stack{position:relative;width:100%;aspect-ratio:14/9;overflow:hidden;cursor:ew-resize}.active-image{position:absolute;inset:0;opacity:0;transform:scale(1.03);transition:opacity .35s ease,transform .6s ease}.active-image.loaded{opacity:1;transform:scale(1)}.hover-grid{position:absolute;inset:0;display:flex;z-index:10;pointer-events:none}.hover-grid .hover-zone{flex:1;height:100%;cursor:inherit;pointer-events:auto}\n"]
632
+ }]
633
+ }],
634
+ ctorParameters: () => [{
635
+ type: Object,
636
+ decorators: [{
637
+ type: Inject,
638
+ args: [PLATFORM_ID]
639
+ }]
640
+ }],
641
+ propDecorators: {
642
+ title: [{ type: Input }],
643
+ text: [{ type: Input }],
644
+ images: [{ type: Input }]
645
+ }
646
+ });
647
+ var StackedRowsComponent = class StackedRowsComponent {
648
+ title;
649
+ text;
650
+ items;
651
+ static ɵfac = i0.ɵɵngDeclareFactory({
652
+ minVersion: "12.0.0",
653
+ version: "22.2.4",
654
+ ngImport: i0,
655
+ type: StackedRowsComponent,
656
+ deps: [],
657
+ target: i0.ɵɵFactoryTarget.Component
658
+ });
659
+ static ɵcmp = i0.ɵɵngDeclareComponent({
660
+ minVersion: "17.0.0",
661
+ version: "22.2.4",
662
+ type: StackedRowsComponent,
663
+ isStandalone: true,
664
+ selector: "lib-stacked-rows",
665
+ inputs: {
666
+ title: "title",
667
+ text: "text",
668
+ items: "items"
669
+ },
670
+ host: { styleAttribute: "display: contents" },
671
+ ngImport: i0,
672
+ template: "<div class=\"stacked-rows main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <!-- INTRO -->\n <div class=\"stacked-rows__intro main-grid col-span-full\">\n @if (title) {\n <h1 class=\"subtitle col-span-full md:col-span-3 md:col-start-1\">\n {{ title }}\n </h1>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-9 md:col-start-4\">\n {{ text }}\n </p>\n }\n </div>\n\n <!-- ITEMS -->\n @if (items) {\n <div class=\"stacked-rows__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"stacked-rows__items--item main-grid\">\n <h2 class=\"stacked-rows__items--item_title col-span-full md:col-span-3 md:col-start-1\">\n {{ item.title }}\n </h2>\n\n <p class=\"stacked-rows__items--item_text col-span-full md:col-span-7 md:col-start-6\">\n {{ item.text }}\n </p>\n </div>\n }\n </div>\n }\n</div>\n",
673
+ styles: [".stacked-rows{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.stacked-rows .subtitle,.stacked-rows .text{color:var(--text-secondary)}.stacked-rows__intro{border-bottom:1px solid var(--border-secondary);padding-block:0rem}.stacked-rows__intro .text{font-size:2.4rem;font-weight:600;margin-bottom:3rem}.stacked-rows__items--item{border-bottom:1px solid var(--border-secondary);padding-bottom:4.5rem}.stacked-rows__items--item:last-child{border-bottom:none}.stacked-rows__items--item_title{margin:0;font-size:2rem;color:var(--text-secondary);font-weight:100}.stacked-rows__items--item_text{margin:0;font-size:1.2rem;color:var(--text-secondary)}@media(max-width:1024px){.stacked-rows{padding-block:6rem 2rem}.stacked-rows__intro .text{font-size:1.6rem}.stacked-rows__items--item{padding-block:2rem}.stacked-rows__items--item_title{font-size:1.6rem}.stacked-rows__items--item_text{font-size:1.1rem;margin-top:0}}\n"],
674
+ dependencies: [{
675
+ kind: "ngmodule",
676
+ type: CommonModule
677
+ }],
678
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
679
+ });
680
+ };
681
+ i0.ɵɵngDeclareClassMetadata({
682
+ minVersion: "12.0.0",
683
+ version: "22.2.4",
684
+ ngImport: i0,
685
+ type: StackedRowsComponent,
686
+ decorators: [{
687
+ type: Component,
688
+ args: [{
689
+ selector: "lib-stacked-rows",
690
+ imports: [CommonModule],
691
+ changeDetection: ChangeDetectionStrategy.OnPush,
692
+ host: { style: "display: contents" },
693
+ template: "<div class=\"stacked-rows main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <!-- INTRO -->\n <div class=\"stacked-rows__intro main-grid col-span-full\">\n @if (title) {\n <h1 class=\"subtitle col-span-full md:col-span-3 md:col-start-1\">\n {{ title }}\n </h1>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-9 md:col-start-4\">\n {{ text }}\n </p>\n }\n </div>\n\n <!-- ITEMS -->\n @if (items) {\n <div class=\"stacked-rows__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"stacked-rows__items--item main-grid\">\n <h2 class=\"stacked-rows__items--item_title col-span-full md:col-span-3 md:col-start-1\">\n {{ item.title }}\n </h2>\n\n <p class=\"stacked-rows__items--item_text col-span-full md:col-span-7 md:col-start-6\">\n {{ item.text }}\n </p>\n </div>\n }\n </div>\n }\n</div>\n",
694
+ styles: [".stacked-rows{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.stacked-rows .subtitle,.stacked-rows .text{color:var(--text-secondary)}.stacked-rows__intro{border-bottom:1px solid var(--border-secondary);padding-block:0rem}.stacked-rows__intro .text{font-size:2.4rem;font-weight:600;margin-bottom:3rem}.stacked-rows__items--item{border-bottom:1px solid var(--border-secondary);padding-bottom:4.5rem}.stacked-rows__items--item:last-child{border-bottom:none}.stacked-rows__items--item_title{margin:0;font-size:2rem;color:var(--text-secondary);font-weight:100}.stacked-rows__items--item_text{margin:0;font-size:1.2rem;color:var(--text-secondary)}@media(max-width:1024px){.stacked-rows{padding-block:6rem 2rem}.stacked-rows__intro .text{font-size:1.6rem}.stacked-rows__items--item{padding-block:2rem}.stacked-rows__items--item_title{font-size:1.6rem}.stacked-rows__items--item_text{font-size:1.1rem;margin-top:0}}\n"]
695
+ }]
696
+ }],
697
+ propDecorators: {
698
+ title: [{ type: Input }],
699
+ text: [{ type: Input }],
700
+ items: [{ type: Input }]
701
+ }
702
+ });
703
+ var MosaicParallaxComponent = class MosaicParallaxComponent {
704
+ title;
705
+ text;
706
+ images;
707
+ mosaicSection;
708
+ isVisible = signal(false, ...ngDevMode ? [{ debugName: "isVisible" }] : /* istanbul ignore next */ []);
709
+ observer;
710
+ isBrowser;
711
+ constructor(platformId) {
712
+ this.isBrowser = isPlatformBrowser(platformId);
713
+ }
714
+ ngAfterViewInit() {
715
+ if (!this.isBrowser) return;
716
+ this.observer = new IntersectionObserver(([entry]) => {
717
+ if (entry.isIntersecting && !this.isVisible()) {
718
+ this.isVisible.set(true);
719
+ this.observer?.disconnect();
720
+ }
721
+ }, { threshold: .1 });
722
+ this.observer.observe(this.mosaicSection.nativeElement);
723
+ }
724
+ ngOnDestroy() {
725
+ this.observer?.disconnect();
726
+ }
727
+ static ɵfac = i0.ɵɵngDeclareFactory({
728
+ minVersion: "12.0.0",
729
+ version: "22.2.4",
730
+ ngImport: i0,
731
+ type: MosaicParallaxComponent,
732
+ deps: [{ token: PLATFORM_ID }],
733
+ target: i0.ɵɵFactoryTarget.Component
734
+ });
735
+ static ɵcmp = i0.ɵɵngDeclareComponent({
736
+ minVersion: "17.0.0",
737
+ version: "22.2.4",
738
+ type: MosaicParallaxComponent,
739
+ isStandalone: true,
740
+ selector: "app-mosaic-parallax",
741
+ inputs: {
742
+ title: "title",
743
+ text: "text",
744
+ images: "images"
745
+ },
746
+ host: { styleAttribute: "display: contents" },
747
+ viewQueries: [{
748
+ propertyName: "mosaicSection",
749
+ first: true,
750
+ predicate: ["mosaicSection"],
751
+ descendants: true
752
+ }],
753
+ ngImport: i0,
754
+ template: "<div class=\"mosaic-parallax main-grid col-span-full\" #mosaicSection>\n\n @if (title) {\n <h2 class=\"subtitle md:col-span-3 md:col-start-1\">{{ title }}</h2>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-5 md:col-start-1\">\n {{ text }}\n </p>\n }\n\n @if (images && images.length > 0) {\n <div class=\"mosaic-parallax__track col-span-full md:col-span-10 md:col-start-2\">\n @for (item of images; track $index) {\n <article\n class=\"mosaic-item\"\n [class.mosaic-item--visible]=\"isVisible()\"\n [style.--item-index]=\"images.length - 1 - $index\"\n [style.--anim-delay]=\"(images.length - 1 - $index) * 250 + 'ms'\"\n >\n <div class=\"mosaic-item__media\">\n @if (item.publicId) {\n <ui-image [publicId]=\"item.publicId\"></ui-image>\n } @else {\n <img [src]=\"item.url\" [alt]=\"item.alt\" loading=\"lazy\" />\n }\n </div>\n @if (item.texts; as texts) {\n <div class=\"mosaic-item__content\">\n <p class=\"mosaic-item__description\">{{ texts.text }}</p>\n <div class=\"mosaic-item__meta\">\n <span class=\"mosaic-item__date\">{{ texts.title }}</span>\n <span class=\"mosaic-item__index\">\n {{ ($index + 1).toString().padStart(2, '0') }}\n </span>\n </div>\n </div>\n }\n </article>\n }\n </div>\n }\n\n</div>",
755
+ styles: ["@charset \"UTF-8\";.mosaic-parallax{position:relative;align-items:start;padding-block:4rem}.text{grid-row:2}.mosaic-parallax__track{grid-row:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));align-items:start;justify-content:center;gap:2.25rem;width:100%;overflow:hidden;padding-block:0 4rem}.mosaic-item{flex-shrink:0;width:95%;display:flex;flex-direction:column;border:2px solid var(--border-primary);overflow:hidden;background:var(--content-bg-light);margin-top:calc(var(--item-index) * 80px);transform:translateY(100px);transition:transform 1.4s cubic-bezier(.16,1,.3,1) var(--anim-delay),opacity .8s ease var(--anim-delay)}.mosaic-item--visible{transform:translateY(0);opacity:1}.mosaic-item__media{width:100%;aspect-ratio:4/3;overflow:hidden}.mosaic-item__media img,.mosaic-item__media ui-image{width:100%;height:100%;object-fit:cover;display:block}.mosaic-item__content{display:flex;flex-direction:column;justify-content:space-between;padding:1.2rem 1.5rem;min-height:11rem;background:var(--content-bg-dark);color:var(--text-inverse);border-top:2px solid var(--border-primary)}.mosaic-item:nth-child(2n) .mosaic-item__content{background:var(--content-bg-light);color:var(--text-primary)}.mosaic-item:nth-child(2n) .mosaic-item__index{background:var(--content-bg-dark);color:var(--text-inverse)}.mosaic-item__description{font-size:.9rem;line-height:1.4;margin:0 0 1rem}.mosaic-item__meta{display:flex;justify-content:space-between;align-items:flex-end}.mosaic-item__date{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700}.mosaic-item__index{font-size:3rem;font-weight:900;line-height:1;background:#f2f2f2;color:var(--text-primary);padding:.5rem 1rem;border-left:2px solid var(--border-primary);margin:0 -1.5rem -1.2rem 0}@media(max-width:1024px){.mosaic-parallax__track{flex-direction:column;align-items:center;justify-items:center;overflow:visible;grid-row:3}.mosaic-item{width:90%;height:90%;margin-top:0!important}}@media(max-width:768px){.mosaic-item{width:85%;margin-top:0!important}}\n"],
756
+ dependencies: [{
757
+ kind: "component",
758
+ type: UiImageComponent,
759
+ selector: "ui-image",
760
+ inputs: [
761
+ "publicId",
762
+ "cloudName",
763
+ "transformations",
764
+ "eager",
765
+ "width",
766
+ "height"
767
+ ]
768
+ }],
769
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
770
+ });
771
+ };
772
+ i0.ɵɵngDeclareClassMetadata({
773
+ minVersion: "12.0.0",
774
+ version: "22.2.4",
775
+ ngImport: i0,
776
+ type: MosaicParallaxComponent,
777
+ decorators: [{
778
+ type: Component,
779
+ args: [{
780
+ selector: "app-mosaic-parallax",
781
+ standalone: true,
782
+ imports: [UiImageComponent],
783
+ changeDetection: ChangeDetectionStrategy.OnPush,
784
+ host: { style: "display: contents" },
785
+ template: "<div class=\"mosaic-parallax main-grid col-span-full\" #mosaicSection>\n\n @if (title) {\n <h2 class=\"subtitle md:col-span-3 md:col-start-1\">{{ title }}</h2>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-5 md:col-start-1\">\n {{ text }}\n </p>\n }\n\n @if (images && images.length > 0) {\n <div class=\"mosaic-parallax__track col-span-full md:col-span-10 md:col-start-2\">\n @for (item of images; track $index) {\n <article\n class=\"mosaic-item\"\n [class.mosaic-item--visible]=\"isVisible()\"\n [style.--item-index]=\"images.length - 1 - $index\"\n [style.--anim-delay]=\"(images.length - 1 - $index) * 250 + 'ms'\"\n >\n <div class=\"mosaic-item__media\">\n @if (item.publicId) {\n <ui-image [publicId]=\"item.publicId\"></ui-image>\n } @else {\n <img [src]=\"item.url\" [alt]=\"item.alt\" loading=\"lazy\" />\n }\n </div>\n @if (item.texts; as texts) {\n <div class=\"mosaic-item__content\">\n <p class=\"mosaic-item__description\">{{ texts.text }}</p>\n <div class=\"mosaic-item__meta\">\n <span class=\"mosaic-item__date\">{{ texts.title }}</span>\n <span class=\"mosaic-item__index\">\n {{ ($index + 1).toString().padStart(2, '0') }}\n </span>\n </div>\n </div>\n }\n </article>\n }\n </div>\n }\n\n</div>",
786
+ styles: ["@charset \"UTF-8\";.mosaic-parallax{position:relative;align-items:start;padding-block:4rem}.text{grid-row:2}.mosaic-parallax__track{grid-row:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));align-items:start;justify-content:center;gap:2.25rem;width:100%;overflow:hidden;padding-block:0 4rem}.mosaic-item{flex-shrink:0;width:95%;display:flex;flex-direction:column;border:2px solid var(--border-primary);overflow:hidden;background:var(--content-bg-light);margin-top:calc(var(--item-index) * 80px);transform:translateY(100px);transition:transform 1.4s cubic-bezier(.16,1,.3,1) var(--anim-delay),opacity .8s ease var(--anim-delay)}.mosaic-item--visible{transform:translateY(0);opacity:1}.mosaic-item__media{width:100%;aspect-ratio:4/3;overflow:hidden}.mosaic-item__media img,.mosaic-item__media ui-image{width:100%;height:100%;object-fit:cover;display:block}.mosaic-item__content{display:flex;flex-direction:column;justify-content:space-between;padding:1.2rem 1.5rem;min-height:11rem;background:var(--content-bg-dark);color:var(--text-inverse);border-top:2px solid var(--border-primary)}.mosaic-item:nth-child(2n) .mosaic-item__content{background:var(--content-bg-light);color:var(--text-primary)}.mosaic-item:nth-child(2n) .mosaic-item__index{background:var(--content-bg-dark);color:var(--text-inverse)}.mosaic-item__description{font-size:.9rem;line-height:1.4;margin:0 0 1rem}.mosaic-item__meta{display:flex;justify-content:space-between;align-items:flex-end}.mosaic-item__date{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700}.mosaic-item__index{font-size:3rem;font-weight:900;line-height:1;background:#f2f2f2;color:var(--text-primary);padding:.5rem 1rem;border-left:2px solid var(--border-primary);margin:0 -1.5rem -1.2rem 0}@media(max-width:1024px){.mosaic-parallax__track{flex-direction:column;align-items:center;justify-items:center;overflow:visible;grid-row:3}.mosaic-item{width:90%;height:90%;margin-top:0!important}}@media(max-width:768px){.mosaic-item{width:85%;margin-top:0!important}}\n"]
787
+ }]
788
+ }],
789
+ ctorParameters: () => [{
790
+ type: void 0,
791
+ decorators: [{
792
+ type: Inject,
793
+ args: [PLATFORM_ID]
794
+ }]
795
+ }],
796
+ propDecorators: {
797
+ title: [{ type: Input }],
798
+ text: [{ type: Input }],
799
+ images: [{ type: Input }],
800
+ mosaicSection: [{
801
+ type: ViewChild,
802
+ args: ["mosaicSection"]
803
+ }]
804
+ }
805
+ });
806
+ var ContentDocumentComponent = class ContentDocumentComponent {
807
+ title;
808
+ items;
809
+ static ɵfac = i0.ɵɵngDeclareFactory({
810
+ minVersion: "12.0.0",
811
+ version: "22.2.4",
812
+ ngImport: i0,
813
+ type: ContentDocumentComponent,
814
+ deps: [],
815
+ target: i0.ɵɵFactoryTarget.Component
816
+ });
817
+ static ɵcmp = i0.ɵɵngDeclareComponent({
818
+ minVersion: "17.0.0",
819
+ version: "22.2.4",
820
+ type: ContentDocumentComponent,
821
+ isStandalone: true,
822
+ selector: "lib-content-document",
823
+ inputs: {
824
+ title: "title",
825
+ items: "items"
826
+ },
827
+ host: { styleAttribute: "display: contents" },
828
+ ngImport: i0,
829
+ template: "<div class=\"content-document main-grid col-span-full sm:col-span-12 sm:col-start-1\" scrollReveal>\n @if (title) {\n <div class=\"content-document__title main-grid col-span-full\">\n <h1 class=\"title col-span-full\">{{ title }}</h1>\n </div>\n }\n @if (items) {\n <div class=\"content-document__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"content-document__items--item main-grid\">\n <h2 class=\"content-document__items--item_title col-span-full sm:col-span-12 sm:col-start-1\">\n {{ item.title }}\n </h2>\n <p class=\"content-document__items--item_text col-span-full sm:col-span-4 sm:col-start-5\" [innerHTML]=\"item.text\"></p>\n </div>\n }\n </div>\n }\n</div>\n",
830
+ styles: [".content-document__title,.content-document__items--item_title{text-transform:uppercase}.main-grid{row-gap:0;padding-block:0}.content-document__items--item_title{margin-bottom:0;font-size:2rem}.content-document__items--item_text{font-size:1.3rem}\n"],
831
+ dependencies: [{
832
+ kind: "ngmodule",
833
+ type: CommonModule
834
+ }],
835
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
836
+ });
837
+ };
838
+ i0.ɵɵngDeclareClassMetadata({
839
+ minVersion: "12.0.0",
840
+ version: "22.2.4",
841
+ ngImport: i0,
842
+ type: ContentDocumentComponent,
843
+ decorators: [{
844
+ type: Component,
845
+ args: [{
846
+ selector: "lib-content-document",
847
+ imports: [CommonModule],
848
+ changeDetection: ChangeDetectionStrategy.OnPush,
849
+ host: { style: "display: contents" },
850
+ template: "<div class=\"content-document main-grid col-span-full sm:col-span-12 sm:col-start-1\" scrollReveal>\n @if (title) {\n <div class=\"content-document__title main-grid col-span-full\">\n <h1 class=\"title col-span-full\">{{ title }}</h1>\n </div>\n }\n @if (items) {\n <div class=\"content-document__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"content-document__items--item main-grid\">\n <h2 class=\"content-document__items--item_title col-span-full sm:col-span-12 sm:col-start-1\">\n {{ item.title }}\n </h2>\n <p class=\"content-document__items--item_text col-span-full sm:col-span-4 sm:col-start-5\" [innerHTML]=\"item.text\"></p>\n </div>\n }\n </div>\n }\n</div>\n",
851
+ styles: [".content-document__title,.content-document__items--item_title{text-transform:uppercase}.main-grid{row-gap:0;padding-block:0}.content-document__items--item_title{margin-bottom:0;font-size:2rem}.content-document__items--item_text{font-size:1.3rem}\n"]
852
+ }]
853
+ }],
854
+ propDecorators: {
855
+ title: [{ type: Input }],
856
+ items: [{ type: Input }]
857
+ }
858
+ });
859
+ var SplitShowcaseComponent = class SplitShowcaseComponent {
860
+ title;
861
+ subtitle;
862
+ description;
863
+ metas;
864
+ buttons;
865
+ static ɵfac = i0.ɵɵngDeclareFactory({
866
+ minVersion: "12.0.0",
867
+ version: "22.2.4",
868
+ ngImport: i0,
869
+ type: SplitShowcaseComponent,
870
+ deps: [],
871
+ target: i0.ɵɵFactoryTarget.Component
872
+ });
873
+ static ɵcmp = i0.ɵɵngDeclareComponent({
874
+ minVersion: "17.0.0",
875
+ version: "22.2.4",
876
+ type: SplitShowcaseComponent,
877
+ isStandalone: true,
878
+ selector: "lib-split-showcase",
879
+ inputs: {
880
+ title: "title",
881
+ subtitle: "subtitle",
882
+ description: "description",
883
+ metas: "metas",
884
+ buttons: "buttons"
885
+ },
886
+ host: { styleAttribute: "display: contents" },
887
+ ngImport: i0,
888
+ template: "<div\n class=\"split-showcase main-grid col-span-full md:col-span-12 md:col-start-1\"\n scrollReveal\n>\n <div class=\"split-showcase__metas col-span-full md:col-span-5 md:col-start-1\">\n <h2 class=\"split-showcase__metas--title\">{{ title }}</h2>\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n <div class=\"split-showcase__metas--items\">\n @for (meta of metas; track meta.label) {\n <div class=\"split-showcase__metas--item\">\n <span class=\"split-showcase__metas--item-label\">{{ meta.label }}: </span>\n <span class=\"split-showcase__metas--item-value\">{{ meta.value }}</span> \n </div>\n }\n </div>\n </div>\n\n <div class=\"split-showcase__content col-span-full md:col-span-5 md:col-start-8\">\n <h3 class=\"split-showcase__content--subtitle\">{{ subtitle }}</h3>\n <p class=\"split-showcase__content--description\">{{ description }}</p>\n </div>\n</div>",
889
+ styles: [".split-showcase__metas--title{font-size:3rem;font-weight:700}.split-showcase__metas--item:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:1rem}.split-showcase__metas--item:last-child:after{content:none}.split-showcase__metas .btn-group{margin-bottom:2rem}.split-showcase__metas .btn-group .btn-link{justify-content:start}.split-showcase__content--subtitle{font-size:2rem;padding-bottom:0}.split-showcase__content--subtitle:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:2rem}\n"],
890
+ dependencies: [
891
+ {
892
+ kind: "ngmodule",
893
+ type: CommonModule
894
+ },
895
+ {
896
+ kind: "directive",
897
+ type: ScrollRevealDirective,
898
+ selector: "[scrollReveal]",
899
+ inputs: ["distance", "duration"]
900
+ },
901
+ {
902
+ kind: "directive",
903
+ type: LinkTypeDirective,
904
+ selector: "[linkType]",
905
+ inputs: ["linkType", "href"],
906
+ outputs: ["anchorClicked"]
907
+ },
908
+ {
909
+ kind: "component",
910
+ type: UiIconComponent,
911
+ selector: "ui-icon",
912
+ inputs: [
913
+ "name",
914
+ "size",
915
+ "color"
916
+ ]
917
+ }
918
+ ],
919
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
920
+ });
921
+ };
922
+ i0.ɵɵngDeclareClassMetadata({
923
+ minVersion: "12.0.0",
924
+ version: "22.2.4",
925
+ ngImport: i0,
926
+ type: SplitShowcaseComponent,
927
+ decorators: [{
928
+ type: Component,
929
+ args: [{
930
+ selector: "lib-split-showcase",
931
+ imports: [
932
+ CommonModule,
933
+ ScrollRevealDirective,
934
+ LinkTypeDirective,
935
+ UiIconComponent
936
+ ],
937
+ changeDetection: ChangeDetectionStrategy.OnPush,
938
+ host: { style: "display: contents" },
939
+ template: "<div\n class=\"split-showcase main-grid col-span-full md:col-span-12 md:col-start-1\"\n scrollReveal\n>\n <div class=\"split-showcase__metas col-span-full md:col-span-5 md:col-start-1\">\n <h2 class=\"split-showcase__metas--title\">{{ title }}</h2>\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n <div class=\"split-showcase__metas--items\">\n @for (meta of metas; track meta.label) {\n <div class=\"split-showcase__metas--item\">\n <span class=\"split-showcase__metas--item-label\">{{ meta.label }}: </span>\n <span class=\"split-showcase__metas--item-value\">{{ meta.value }}</span> \n </div>\n }\n </div>\n </div>\n\n <div class=\"split-showcase__content col-span-full md:col-span-5 md:col-start-8\">\n <h3 class=\"split-showcase__content--subtitle\">{{ subtitle }}</h3>\n <p class=\"split-showcase__content--description\">{{ description }}</p>\n </div>\n</div>",
940
+ styles: [".split-showcase__metas--title{font-size:3rem;font-weight:700}.split-showcase__metas--item:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:1rem}.split-showcase__metas--item:last-child:after{content:none}.split-showcase__metas .btn-group{margin-bottom:2rem}.split-showcase__metas .btn-group .btn-link{justify-content:start}.split-showcase__content--subtitle{font-size:2rem;padding-bottom:0}.split-showcase__content--subtitle:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:2rem}\n"]
941
+ }]
942
+ }],
943
+ propDecorators: {
944
+ title: [{ type: Input }],
945
+ subtitle: [{ type: Input }],
946
+ description: [{ type: Input }],
947
+ metas: [{ type: Input }],
948
+ buttons: [{ type: Input }]
949
+ }
950
+ });
951
+ var AsymmetricMediaComponent = class AsymmetricMediaComponent {
952
+ media;
953
+ direction = "right";
954
+ static ɵfac = i0.ɵɵngDeclareFactory({
955
+ minVersion: "12.0.0",
956
+ version: "22.2.4",
957
+ ngImport: i0,
958
+ type: AsymmetricMediaComponent,
959
+ deps: [],
960
+ target: i0.ɵɵFactoryTarget.Component
961
+ });
962
+ static ɵcmp = i0.ɵɵngDeclareComponent({
963
+ minVersion: "17.0.0",
964
+ version: "22.2.4",
965
+ type: AsymmetricMediaComponent,
966
+ isStandalone: true,
967
+ selector: "lib-asymmetric-media",
968
+ inputs: {
969
+ media: "media",
970
+ direction: "direction"
971
+ },
972
+ host: { styleAttribute: "display: contents" },
973
+ ngImport: i0,
974
+ template: "<div \n class=\"asymmetric-media main-grid col-span-full md:col-span-12 md:col-start-1\" \n scrollReveal\n>\n @if(media && media.length > 0) {\n <div class=\"asymmetric-media__items main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(direction === 'left') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-4 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-8 md:col-start-5\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n @if(direction === 'right') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-8 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-4 md:col-start-9\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n </div>\n }\n</div>\n",
975
+ styles: [".asymmetric-media{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.asymmetric-media__items{align-items:center}\n"],
976
+ dependencies: [
977
+ {
978
+ kind: "ngmodule",
979
+ type: CommonModule
980
+ },
981
+ {
982
+ kind: "component",
983
+ type: UiImageComponent,
984
+ selector: "ui-image",
985
+ inputs: [
986
+ "publicId",
987
+ "cloudName",
988
+ "transformations",
989
+ "eager",
990
+ "width",
991
+ "height"
992
+ ]
993
+ },
994
+ {
995
+ kind: "directive",
996
+ type: ScrollRevealDirective,
997
+ selector: "[scrollReveal]",
998
+ inputs: ["distance", "duration"]
999
+ }
1000
+ ],
1001
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
1002
+ });
1003
+ };
1004
+ i0.ɵɵngDeclareClassMetadata({
1005
+ minVersion: "12.0.0",
1006
+ version: "22.2.4",
1007
+ ngImport: i0,
1008
+ type: AsymmetricMediaComponent,
1009
+ decorators: [{
1010
+ type: Component,
1011
+ args: [{
1012
+ selector: "lib-asymmetric-media",
1013
+ imports: [
1014
+ CommonModule,
1015
+ UiImageComponent,
1016
+ ScrollRevealDirective
1017
+ ],
1018
+ changeDetection: ChangeDetectionStrategy.OnPush,
1019
+ host: { style: "display: contents" },
1020
+ template: "<div \n class=\"asymmetric-media main-grid col-span-full md:col-span-12 md:col-start-1\" \n scrollReveal\n>\n @if(media && media.length > 0) {\n <div class=\"asymmetric-media__items main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(direction === 'left') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-4 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-8 md:col-start-5\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n @if(direction === 'right') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-8 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-4 md:col-start-9\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n </div>\n }\n</div>\n",
1021
+ styles: [".asymmetric-media{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.asymmetric-media__items{align-items:center}\n"]
1022
+ }]
1023
+ }],
1024
+ propDecorators: {
1025
+ media: [{ type: Input }],
1026
+ direction: [{ type: Input }]
1027
+ }
1028
+ });
1029
+ var MediaIntroComponent = class MediaIntroComponent {
1030
+ highlightedText;
1031
+ secondaryText;
1032
+ direction = "right";
1033
+ media;
1034
+ static ɵfac = i0.ɵɵngDeclareFactory({
1035
+ minVersion: "12.0.0",
1036
+ version: "22.2.4",
1037
+ ngImport: i0,
1038
+ type: MediaIntroComponent,
1039
+ deps: [],
1040
+ target: i0.ɵɵFactoryTarget.Component
1041
+ });
1042
+ static ɵcmp = i0.ɵɵngDeclareComponent({
1043
+ minVersion: "17.0.0",
1044
+ version: "22.2.4",
1045
+ type: MediaIntroComponent,
1046
+ isStandalone: true,
1047
+ selector: "lib-media-intro",
1048
+ inputs: {
1049
+ highlightedText: "highlightedText",
1050
+ secondaryText: "secondaryText",
1051
+ direction: "direction",
1052
+ media: "media"
1053
+ },
1054
+ host: { styleAttribute: "display: contents" },
1055
+ ngImport: i0,
1056
+ template: "<div class=\"media-intro main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-intro__content main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(highlightedText) {\n <div class=\"media-intro__content--left main-grid col-span-full\">\n <h2 class=\"media-intro__content--main-text col-span-full md:col-span-6\" \n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-7]=\"direction === 'right'\"\n [innerHTML]=\"highlightedText\">\n </h2>\n </div>\n }\n @if(secondaryText) {\n <div class=\"media-intro__content--right main-grid col-span-full\">\n <p class=\"media-intro__content--secondary-text col-span-full md:col-span-6\"\n [class.md:col-start-7]=\"direction === 'left'\"\n [class.md:col-start-1]=\"direction === 'right'\"\n [innerHTML]=\"secondaryText\"\n ></p>\n </div>\n }\n </div>\n @if(media) {\n <div class=\"media-intro__media col-span-full md:col-span-12 md:col-start-1\">\n @if (media.publicId) {\n <ui-image [publicId]=\"media.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"media.url\" [alt]=\"media.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n",
1057
+ styles: [".media-intro__content--left,.media-intro__content--right{padding-block:0!important}\n"],
1058
+ dependencies: [
1059
+ {
1060
+ kind: "ngmodule",
1061
+ type: CommonModule
1062
+ },
1063
+ {
1064
+ kind: "directive",
1065
+ type: ScrollRevealDirective,
1066
+ selector: "[scrollReveal]",
1067
+ inputs: ["distance", "duration"]
1068
+ },
1069
+ {
1070
+ kind: "component",
1071
+ type: UiImageComponent,
1072
+ selector: "ui-image",
1073
+ inputs: [
1074
+ "publicId",
1075
+ "cloudName",
1076
+ "transformations",
1077
+ "eager",
1078
+ "width",
1079
+ "height"
1080
+ ]
1081
+ }
1082
+ ],
1083
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
1084
+ });
1085
+ };
1086
+ i0.ɵɵngDeclareClassMetadata({
1087
+ minVersion: "12.0.0",
1088
+ version: "22.2.4",
1089
+ ngImport: i0,
1090
+ type: MediaIntroComponent,
1091
+ decorators: [{
1092
+ type: Component,
1093
+ args: [{
1094
+ selector: "lib-media-intro",
1095
+ imports: [
1096
+ CommonModule,
1097
+ ScrollRevealDirective,
1098
+ UiImageComponent
1099
+ ],
1100
+ changeDetection: ChangeDetectionStrategy.OnPush,
1101
+ host: { style: "display: contents" },
1102
+ template: "<div class=\"media-intro main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-intro__content main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(highlightedText) {\n <div class=\"media-intro__content--left main-grid col-span-full\">\n <h2 class=\"media-intro__content--main-text col-span-full md:col-span-6\" \n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-7]=\"direction === 'right'\"\n [innerHTML]=\"highlightedText\">\n </h2>\n </div>\n }\n @if(secondaryText) {\n <div class=\"media-intro__content--right main-grid col-span-full\">\n <p class=\"media-intro__content--secondary-text col-span-full md:col-span-6\"\n [class.md:col-start-7]=\"direction === 'left'\"\n [class.md:col-start-1]=\"direction === 'right'\"\n [innerHTML]=\"secondaryText\"\n ></p>\n </div>\n }\n </div>\n @if(media) {\n <div class=\"media-intro__media col-span-full md:col-span-12 md:col-start-1\">\n @if (media.publicId) {\n <ui-image [publicId]=\"media.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"media.url\" [alt]=\"media.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n",
1103
+ styles: [".media-intro__content--left,.media-intro__content--right{padding-block:0!important}\n"]
1104
+ }]
1105
+ }],
1106
+ propDecorators: {
1107
+ highlightedText: [{ type: Input }],
1108
+ secondaryText: [{ type: Input }],
1109
+ direction: [{ type: Input }],
1110
+ media: [{ type: Input }]
1111
+ }
1112
+ });
1113
+ var ColumnsMediaStackedComponent = class ColumnsMediaStackedComponent {
1114
+ leftColumn;
1115
+ rightColumn;
1116
+ direction = "right";
1117
+ image;
1118
+ static ɵfac = i0.ɵɵngDeclareFactory({
1119
+ minVersion: "12.0.0",
1120
+ version: "22.2.4",
1121
+ ngImport: i0,
1122
+ type: ColumnsMediaStackedComponent,
1123
+ deps: [],
1124
+ target: i0.ɵɵFactoryTarget.Component
1125
+ });
1126
+ static ɵcmp = i0.ɵɵngDeclareComponent({
1127
+ minVersion: "17.0.0",
1128
+ version: "22.2.4",
1129
+ type: ColumnsMediaStackedComponent,
1130
+ isStandalone: true,
1131
+ selector: "lib-columns-media-stacked",
1132
+ inputs: {
1133
+ leftColumn: "leftColumn",
1134
+ rightColumn: "rightColumn",
1135
+ direction: "direction",
1136
+ image: "image"
1137
+ },
1138
+ host: { styleAttribute: "display: contents" },
1139
+ ngImport: i0,
1140
+ template: "<div class=\"columns-media-stacked main-grid col-span-full\" scrollReveal>\n <div class=\"columns-media-stacked__content main-grid col-span-full\">\n @if(leftColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-5]=\"direction === 'right'\"\n [innerHTML]=\"leftColumn\"\n > \n </p>\n }\n @if(rightColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-5]=\"direction === 'left'\"\n [class.md:col-start-9]=\"direction === 'right'\"\n [innerHTML]=\"rightColumn\"\n > \n </p>\n }\n </div>\n @if(image) {\n <div \n class=\"columns-media-stacked__image col-span-full md:col-span-10\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-3]=\"direction === 'right'\"\n >\n @if (image.publicId) {\n <ui-image [publicId]=\"image.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"image.url\" [alt]=\"image.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n",
1141
+ styles: [""],
1142
+ dependencies: [
1143
+ {
1144
+ kind: "ngmodule",
1145
+ type: CommonModule
1146
+ },
1147
+ {
1148
+ kind: "directive",
1149
+ type: ScrollRevealDirective,
1150
+ selector: "[scrollReveal]",
1151
+ inputs: ["distance", "duration"]
1152
+ },
1153
+ {
1154
+ kind: "component",
1155
+ type: UiImageComponent,
1156
+ selector: "ui-image",
1157
+ inputs: [
1158
+ "publicId",
1159
+ "cloudName",
1160
+ "transformations",
1161
+ "eager",
1162
+ "width",
1163
+ "height"
1164
+ ]
1165
+ }
1166
+ ],
1167
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
1168
+ });
1169
+ };
1170
+ i0.ɵɵngDeclareClassMetadata({
1171
+ minVersion: "12.0.0",
1172
+ version: "22.2.4",
1173
+ ngImport: i0,
1174
+ type: ColumnsMediaStackedComponent,
1175
+ decorators: [{
1176
+ type: Component,
1177
+ args: [{
1178
+ selector: "lib-columns-media-stacked",
1179
+ imports: [
1180
+ CommonModule,
1181
+ ScrollRevealDirective,
1182
+ UiImageComponent
1183
+ ],
1184
+ changeDetection: ChangeDetectionStrategy.OnPush,
1185
+ host: { style: "display: contents" },
1186
+ template: "<div class=\"columns-media-stacked main-grid col-span-full\" scrollReveal>\n <div class=\"columns-media-stacked__content main-grid col-span-full\">\n @if(leftColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-5]=\"direction === 'right'\"\n [innerHTML]=\"leftColumn\"\n > \n </p>\n }\n @if(rightColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-5]=\"direction === 'left'\"\n [class.md:col-start-9]=\"direction === 'right'\"\n [innerHTML]=\"rightColumn\"\n > \n </p>\n }\n </div>\n @if(image) {\n <div \n class=\"columns-media-stacked__image col-span-full md:col-span-10\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-3]=\"direction === 'right'\"\n >\n @if (image.publicId) {\n <ui-image [publicId]=\"image.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"image.url\" [alt]=\"image.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n"
1187
+ }]
1188
+ }],
1189
+ propDecorators: {
1190
+ leftColumn: [{ type: Input }],
1191
+ rightColumn: [{ type: Input }],
1192
+ direction: [{ type: Input }],
1193
+ image: [{ type: Input }]
1194
+ }
1195
+ });
1196
+ var MosaicGridComponent = class MosaicGridComponent {
1197
+ text;
1198
+ images;
1199
+ imageGroups = [];
1200
+ ngOnInit() {
1201
+ console.log("MosaicGridComponent initialized with images:", this.images);
1202
+ if (!this.images?.length) {
1203
+ this.imageGroups = [];
1204
+ return;
1205
+ }
1206
+ const groups = [];
1207
+ for (let i = 0; i < this.images.length; i += 5) groups.push({
1208
+ row1: this.images.slice(i, i + 3),
1209
+ row2: this.images.slice(i + 3, i + 5)
1210
+ });
1211
+ this.imageGroups = groups;
1212
+ }
1213
+ static ɵfac = i0.ɵɵngDeclareFactory({
1214
+ minVersion: "12.0.0",
1215
+ version: "22.2.4",
1216
+ ngImport: i0,
1217
+ type: MosaicGridComponent,
1218
+ deps: [],
1219
+ target: i0.ɵɵFactoryTarget.Component
1220
+ });
1221
+ static ɵcmp = i0.ɵɵngDeclareComponent({
1222
+ minVersion: "17.0.0",
1223
+ version: "22.2.4",
1224
+ type: MosaicGridComponent,
1225
+ isStandalone: true,
1226
+ selector: "lib-mosaic-grid",
1227
+ inputs: {
1228
+ text: "text",
1229
+ images: "images"
1230
+ },
1231
+ host: { styleAttribute: "display: contents" },
1232
+ ngImport: i0,
1233
+ template: "<div class=\"mosaic-grid main-grid\" scrollReveal>\n @if (text) {\n <p\n class=\"mosaic-grid__text col-span-full md:col-span-6 md:col-start-7\"\n [innerHTML]=\"text\"\n ></p>\n }\n\n @for (group of imageGroups; track $index) {\n\n <!-- row 1: 3 imágenes -->\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @for (img of group.row1; track $index) {\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\"></ui-image>\n } @else {\n <img [src]=\"img.url\" [alt]=\"img.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\" />\n }\n }\n </div>\n\n <!-- row 2: 1 pequeña + 1 grande -->\n @if (group.row2.length) {\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @if (group.row2[0]!.publicId) {\n <ui-image [publicId]=\"group.row2[0]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\"></ui-image>\n } @else {\n <img [src]=\"group.row2[0]!.url\" [alt]=\"group.row2[0]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\" />\n }\n\n @if (group.row2[1]) {\n @if (group.row2[1]!.publicId) {\n <ui-image [publicId]=\"group.row2[1]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\"></ui-image>\n } @else {\n <img [src]=\"group.row2[1]!.url\" [alt]=\"group.row2[1]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\" />\n }\n }\n </div>\n }\n\n }\n</div>\n",
1234
+ styles: ["ui-image{object-fit:cover}ui-image.image-half-height{height:50%!important}\n"],
1235
+ dependencies: [
1236
+ {
1237
+ kind: "ngmodule",
1238
+ type: CommonModule
1239
+ },
1240
+ {
1241
+ kind: "component",
1242
+ type: UiImageComponent,
1243
+ selector: "ui-image",
1244
+ inputs: [
1245
+ "publicId",
1246
+ "cloudName",
1247
+ "transformations",
1248
+ "eager",
1249
+ "width",
1250
+ "height"
1251
+ ]
1252
+ },
1253
+ {
1254
+ kind: "directive",
1255
+ type: ScrollRevealDirective,
1256
+ selector: "[scrollReveal]",
1257
+ inputs: ["distance", "duration"]
1258
+ }
1259
+ ],
1260
+ changeDetection: i0.ChangeDetectionStrategy.OnPush
1261
+ });
1262
+ };
1263
+ i0.ɵɵngDeclareClassMetadata({
1264
+ minVersion: "12.0.0",
1265
+ version: "22.2.4",
1266
+ ngImport: i0,
1267
+ type: MosaicGridComponent,
1268
+ decorators: [{
1269
+ type: Component,
1270
+ args: [{
1271
+ selector: "lib-mosaic-grid",
1272
+ imports: [
1273
+ CommonModule,
1274
+ UiImageComponent,
1275
+ ScrollRevealDirective
1276
+ ],
1277
+ changeDetection: ChangeDetectionStrategy.OnPush,
1278
+ host: { style: "display: contents" },
1279
+ template: "<div class=\"mosaic-grid main-grid\" scrollReveal>\n @if (text) {\n <p\n class=\"mosaic-grid__text col-span-full md:col-span-6 md:col-start-7\"\n [innerHTML]=\"text\"\n ></p>\n }\n\n @for (group of imageGroups; track $index) {\n\n <!-- row 1: 3 imágenes -->\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @for (img of group.row1; track $index) {\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\"></ui-image>\n } @else {\n <img [src]=\"img.url\" [alt]=\"img.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\" />\n }\n }\n </div>\n\n <!-- row 2: 1 pequeña + 1 grande -->\n @if (group.row2.length) {\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @if (group.row2[0]!.publicId) {\n <ui-image [publicId]=\"group.row2[0]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\"></ui-image>\n } @else {\n <img [src]=\"group.row2[0]!.url\" [alt]=\"group.row2[0]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\" />\n }\n\n @if (group.row2[1]) {\n @if (group.row2[1]!.publicId) {\n <ui-image [publicId]=\"group.row2[1]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\"></ui-image>\n } @else {\n <img [src]=\"group.row2[1]!.url\" [alt]=\"group.row2[1]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\" />\n }\n }\n </div>\n }\n\n }\n</div>\n",
1280
+ styles: ["ui-image{object-fit:cover}ui-image.image-half-height{height:50%!important}\n"]
1281
+ }]
1282
+ }],
1283
+ propDecorators: {
1284
+ text: [{ type: Input }],
1285
+ images: [{ type: Input }]
1286
+ }
1287
+ });
1288
+ export { AsymmetricMediaComponent, CategoryProgressComponent, ColumnsMediaStackedComponent, ContactMinimalComponent, ContentDocumentComponent, HeroSectionComponent, MediaIntroComponent, MediaSplitComponent, MosaicGridComponent, MosaicParallaxComponent, SectionIntroComponent, SplitPreviewerComponent, SplitShowcaseComponent, StackedRowsComponent };
126
1289
 
127
- class SectionIntroComponent {
128
- pretitle;
129
- title;
130
- subtitle;
131
- text;
132
- button;
133
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SectionIntroComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
134
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: SectionIntroComponent, isStandalone: true, selector: "lib-section-intro", inputs: { pretitle: "pretitle", title: "title", subtitle: "subtitle", text: "text", button: "button" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"section-intro col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (button) {\n <div class=\"btn-group\">\n <a [href]=\"button.url\" [linkType]=\"button.linkType\" class=\"btn btn-link\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n </div>\n }\n</div>\n", styles: [".section-intro{text-align:start;align-items:start}.title,.subtitle{text-transform:uppercase}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: LinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href"], outputs: ["anchorClicked"] }, { kind: "component", type: UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "color"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
135
- }
136
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SectionIntroComponent, decorators: [{
137
- type: Component,
138
- args: [{ selector: 'lib-section-intro', standalone: true, imports: [CommonModule, LinkTypeDirective, UiIconComponent, ScrollRevealDirective], changeDetection: ChangeDetectionStrategy.OnPush, host: {
139
- style: 'display: contents',
140
- }, template: "<div class=\"section-intro col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n @if (pretitle) {\n <h2 class=\"pretitle\">{{ pretitle }}</h2>\n }\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (subtitle) {\n <h2 class=\"subtitle\">{{ subtitle }}</h2>\n }\n @if (text) {\n <p class=\"text\">{{ text }}</p>\n }\n @if (button) {\n <div class=\"btn-group\">\n <a [href]=\"button.url\" [linkType]=\"button.linkType\" class=\"btn btn-link\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n </div>\n }\n</div>\n", styles: [".section-intro{text-align:start;align-items:start}.title,.subtitle{text-transform:uppercase}\n"] }]
141
- }], propDecorators: { pretitle: [{
142
- type: Input
143
- }], title: [{
144
- type: Input
145
- }], subtitle: [{
146
- type: Input
147
- }], text: [{
148
- type: Input
149
- }], button: [{
150
- type: Input
151
- }] } });
152
-
153
- class SplitPreviewerComponent {
154
- platformId;
155
- title;
156
- items;
157
- imageDefault;
158
- direction = 'right';
159
- activeImage = signal(undefined);
160
- get count() {
161
- return this.items?.length || 0;
162
- }
163
- constructor(platformId) {
164
- this.platformId = platformId;
165
- }
166
- ngOnInit() {
167
- if (!this.items)
168
- return;
169
- if (!isPlatformBrowser(this.platformId))
170
- return;
171
- if ('requestIdleCallback' in window) {
172
- window.requestIdleCallback(() => {
173
- this.items?.forEach((item) => {
174
- if (item.image?.url) {
175
- const img = new Image();
176
- img.src = item.image.url;
177
- }
178
- });
179
- });
180
- }
181
- }
182
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitPreviewerComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
183
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: SplitPreviewerComponent, isStandalone: true, selector: "lib-split-previewer", inputs: { title: "title", items: "items", imageDefault: "imageDefault", direction: "direction" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div\n class=\"split-previewer col-span-full md:col-span-12 md:col-start-1\"\n [class]=\"'split-previewer--' + direction\"\n scrollReveal\n>\n <div class=\"split-previewer__text-column\">\n <div class=\"split-previewer__header\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (count) {\n <span class=\"count\">{{ count }}</span>\n }\n </div>\n\n <div class=\"split-previewer__items\" (mouseleave)=\"activeImage.set(undefined)\">\n @for (item of items; track item.title) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n (mouseenter)=\"activeImage.set(item.image)\"\n class=\"split-previewer__item-link\"\n >\n <div class=\"split-previewer__item\">\n <h2 class=\"split-previewer__item-title\" [highlight]=\"'#FFFFFF'\">{{ item.title }}</h2>\n <p class=\"split-previewer__item-text\">{{ item.description }}</p>\n @if (item.tags?.length) {\n <div class=\"split-previewer__item-tags\">\n @for (tag of item.tags; track tag) {\n <span class=\"split-previewer__item-tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n </a>\n }\n </div>\n </div>\n\n <div class=\"split-previewer__media\">\n <div class=\"split-previewer__media-inner\">\n @if ((activeImage() || imageDefault)?.publicId) {\n <ui-image \n [publicId]=\"(activeImage() || imageDefault)!.publicId!\" \n [eager]=\"true\"\n class=\"preview-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"(activeImage() || imageDefault)?.url\"\n [alt]=\"(activeImage() || imageDefault)?.alt\"\n class=\"preview-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n </div>\n</div>\n", styles: [".split-previewer{display:flex;gap:5rem;min-width:0;padding-bottom:5rem}.split-previewer--left{flex-direction:row-reverse}.split-previewer--right{flex-direction:row}.split-previewer__text-column{flex:1;display:flex;flex-direction:column;min-width:0}.split-previewer__header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;min-width:0}.split-previewer__header .title{margin:0 0 1rem;text-transform:uppercase;min-width:0}.split-previewer__header .count{font-family:var(--font-base);font-size:1rem;font-weight:500;flex-shrink:0}.split-previewer__items{display:flex;flex-direction:column;min-width:0}.split-previewer__item-link{text-decoration:none;color:inherit;display:block;min-width:0}.split-previewer__item{transition:all .4s cubic-bezier(.25,.46,.45,.94);min-width:0}.split-previewer__item-title{margin-bottom:.5rem;display:inline-block;min-width:0}.split-previewer__item-text{line-height:1.6;max-width:min(1000px,100%);opacity:.8;overflow-wrap:break-word;font-size:1.2rem}.split-previewer__item-tags{display:flex;flex-wrap:wrap;gap:1rem;margin-block:1rem;opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}.split-previewer__item-tag{font-size:1rem;font-weight:600;letter-spacing:.05em;padding:.3rem .8rem;background-color:var(--tag-bg);color:var(--tag-color);border-radius:2px}.split-previewer__item-link:hover .split-previewer__item{padding-left:1rem}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:1;transform:translateY(0)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:1}.split-previewer__media{flex:1;min-width:0;position:relative}.split-previewer__media-inner{position:sticky;top:4rem;height:fit-content;display:flex;justify-content:center;align-items:center}.split-previewer__media .preview-img{display:block;width:100%;aspect-ratio:5/4;max-width:100%;height:auto;object-fit:contain;animation:fadeInMedia .5s ease-out;filter:contrast(1.1) grayscale(.2)}@media(max-width:1280px){.split-previewer{gap:3rem}}@media(max-width:1024px){.split-previewer{display:block;width:100%;min-width:0}.split-previewer--left,.split-previewer--right{flex-direction:unset}.split-previewer__media{display:none}.split-previewer__header{display:block}.split-previewer__header .title{margin-bottom:.75rem}.split-previewer__header .count{display:inline-block}.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}.split-previewer__item-text{max-width:100%}.split-previewer__item-tags{display:none}}@media(hover:none)and (pointer:coarse){.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}}@keyframes fadeInMedia{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: LinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href"], outputs: ["anchorClicked"] }, { kind: "directive", type: HighlightDirective, selector: "[highlight]", inputs: ["highlight", "highlightThickness"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
184
- }
185
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitPreviewerComponent, decorators: [{
186
- type: Component,
187
- args: [{ selector: 'lib-split-previewer', imports: [CommonModule, LinkTypeDirective, HighlightDirective, ScrollRevealDirective, UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
188
- style: 'display: contents',
189
- }, template: "<div\n class=\"split-previewer col-span-full md:col-span-12 md:col-start-1\"\n [class]=\"'split-previewer--' + direction\"\n scrollReveal\n>\n <div class=\"split-previewer__text-column\">\n <div class=\"split-previewer__header\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n @if (count) {\n <span class=\"count\">{{ count }}</span>\n }\n </div>\n\n <div class=\"split-previewer__items\" (mouseleave)=\"activeImage.set(undefined)\">\n @for (item of items; track item.title) {\n <a\n [href]=\"item.link?.url\"\n [linkType]=\"item.link?.linkType\"\n (mouseenter)=\"activeImage.set(item.image)\"\n class=\"split-previewer__item-link\"\n >\n <div class=\"split-previewer__item\">\n <h2 class=\"split-previewer__item-title\" [highlight]=\"'#FFFFFF'\">{{ item.title }}</h2>\n <p class=\"split-previewer__item-text\">{{ item.description }}</p>\n @if (item.tags?.length) {\n <div class=\"split-previewer__item-tags\">\n @for (tag of item.tags; track tag) {\n <span class=\"split-previewer__item-tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n </a>\n }\n </div>\n </div>\n\n <div class=\"split-previewer__media\">\n <div class=\"split-previewer__media-inner\">\n @if ((activeImage() || imageDefault)?.publicId) {\n <ui-image \n [publicId]=\"(activeImage() || imageDefault)!.publicId!\" \n [eager]=\"true\"\n class=\"preview-img\"\n ></ui-image>\n } @else {\n <img\n [src]=\"(activeImage() || imageDefault)?.url\"\n [alt]=\"(activeImage() || imageDefault)?.alt\"\n class=\"preview-img\"\n loading=\"eager\"\n fetchpriority=\"high\"\n decoding=\"async\"\n />\n }\n </div>\n </div>\n</div>\n", styles: [".split-previewer{display:flex;gap:5rem;min-width:0;padding-bottom:5rem}.split-previewer--left{flex-direction:row-reverse}.split-previewer--right{flex-direction:row}.split-previewer__text-column{flex:1;display:flex;flex-direction:column;min-width:0}.split-previewer__header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;min-width:0}.split-previewer__header .title{margin:0 0 1rem;text-transform:uppercase;min-width:0}.split-previewer__header .count{font-family:var(--font-base);font-size:1rem;font-weight:500;flex-shrink:0}.split-previewer__items{display:flex;flex-direction:column;min-width:0}.split-previewer__item-link{text-decoration:none;color:inherit;display:block;min-width:0}.split-previewer__item{transition:all .4s cubic-bezier(.25,.46,.45,.94);min-width:0}.split-previewer__item-title{margin-bottom:.5rem;display:inline-block;min-width:0}.split-previewer__item-text{line-height:1.6;max-width:min(1000px,100%);opacity:.8;overflow-wrap:break-word;font-size:1.2rem}.split-previewer__item-tags{display:flex;flex-wrap:wrap;gap:1rem;margin-block:1rem;opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}.split-previewer__item-tag{font-size:1rem;font-weight:600;letter-spacing:.05em;padding:.3rem .8rem;background-color:var(--tag-bg);color:var(--tag-color);border-radius:2px}.split-previewer__item-link:hover .split-previewer__item{padding-left:1rem}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:1;transform:translateY(0)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:1}.split-previewer__media{flex:1;min-width:0;position:relative}.split-previewer__media-inner{position:sticky;top:4rem;height:fit-content;display:flex;justify-content:center;align-items:center}.split-previewer__media .preview-img{display:block;width:100%;aspect-ratio:5/4;max-width:100%;height:auto;object-fit:contain;animation:fadeInMedia .5s ease-out;filter:contrast(1.1) grayscale(.2)}@media(max-width:1280px){.split-previewer{gap:3rem}}@media(max-width:1024px){.split-previewer{display:block;width:100%;min-width:0}.split-previewer--left,.split-previewer--right{flex-direction:unset}.split-previewer__media{display:none}.split-previewer__header{display:block}.split-previewer__header .title{margin-bottom:.75rem}.split-previewer__header .count{display:inline-block}.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}.split-previewer__item-text{max-width:100%}.split-previewer__item-tags{display:none}}@media(hover:none)and (pointer:coarse){.split-previewer__item-link:hover .split-previewer__item{padding-left:0}.split-previewer__item-link:hover .split-previewer__item-tags{opacity:0;transform:translateY(10px)}.split-previewer__item-link:hover .split-previewer__item-text{opacity:.8}}@keyframes fadeInMedia{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}\n"] }]
190
- }], ctorParameters: () => [{ type: Object, decorators: [{
191
- type: Inject,
192
- args: [PLATFORM_ID]
193
- }] }], propDecorators: { title: [{
194
- type: Input
195
- }], items: [{
196
- type: Input
197
- }], imageDefault: [{
198
- type: Input
199
- }], direction: [{
200
- type: Input
201
- }] } });
202
-
203
- class ContactMinimalComponent {
204
- contactsTitle;
205
- socialsTitle;
206
- contacts;
207
- socials;
208
- img;
209
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ContactMinimalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
210
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: ContactMinimalComponent, isStandalone: true, selector: "lib-contact-minimal", inputs: { contactsTitle: "contactsTitle", socialsTitle: "socialsTitle", contacts: "contacts", socials: "socials", img: "img" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"contact-minimal main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"contact-minimal__content col-span-full md:col-span-12 md:col-start-1\">\n <div class=\"contact-minimal__content--left col-span-6 col-start-1\">\n @if (contactsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ contactsTitle }}</h2>\n }\n @if (contacts && contacts.length > 0) {\n <div class=\"btn-group\">\n @for (contact of contacts; track $index) {\n <a [href]=\"contact?.url\" [linkType]=\"contact?.linkType\" class=\"btn btn-link\">\n {{ contact?.label }}\n </a>\n }\n </div>\n }\n </div>\n <div class=\"contact-minimal__content--right col-span-6 col-start-7\">\n @if (socialsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ socialsTitle }}</h2>\n }\n @if (socials && socials.length > 0) {\n <div class=\"btn-group\">\n @for (social of socials; track $index) {\n <a [href]=\"social?.url\" [linkType]=\"social?.linkType\" class=\"btn btn-link\">\n {{ social?.label }}\n </a>\n }\n </div>\n }\n </div>\n </div>\n @if (img) {\n <div class=\"contact-minimal__content--media col-span-full md:col-span-12 md:col-start-1\">\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\"></ui-image>\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </div>\n }\n</div>\n", styles: [".contact-minimal__content{display:grid;grid-auto-flow:column}.contact-minimal__content--left .btn{justify-content:start;font-size:1.1rem}.contact-minimal__content--right{justify-self:end}.contact-minimal__content--right .btn-group{align-items:end}.contact-minimal__content--right .btn{justify-content:end;font-size:1.1rem}.contact-minimal__content--media{justify-self:center}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{transform:rotate(45deg);width:50rem}@media(max-width:768px){.contact-minimal__content--media{top:16rem}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{width:15rem;height:auto}}.contact-minimal .btn-group{display:flex;flex-direction:column;margin-top:1rem;gap:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: HighlightDirective, selector: "[highlight]", inputs: ["highlight", "highlightThickness"] }, { kind: "directive", type: LinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href"], outputs: ["anchorClicked"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
211
- }
212
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ContactMinimalComponent, decorators: [{
213
- type: Component,
214
- args: [{ selector: 'lib-contact-minimal', imports: [CommonModule, HighlightDirective, LinkTypeDirective, ScrollRevealDirective, UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
215
- style: 'display: contents',
216
- }, template: "<div class=\"contact-minimal main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"contact-minimal__content col-span-full md:col-span-12 md:col-start-1\">\n <div class=\"contact-minimal__content--left col-span-6 col-start-1\">\n @if (contactsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ contactsTitle }}</h2>\n }\n @if (contacts && contacts.length > 0) {\n <div class=\"btn-group\">\n @for (contact of contacts; track $index) {\n <a [href]=\"contact?.url\" [linkType]=\"contact?.linkType\" class=\"btn btn-link\">\n {{ contact?.label }}\n </a>\n }\n </div>\n }\n </div>\n <div class=\"contact-minimal__content--right col-span-6 col-start-7\">\n @if (socialsTitle) {\n <h2 class=\"subtitle\" [highlight]=\"'#FFFFFF'\">{{ socialsTitle }}</h2>\n }\n @if (socials && socials.length > 0) {\n <div class=\"btn-group\">\n @for (social of socials; track $index) {\n <a [href]=\"social?.url\" [linkType]=\"social?.linkType\" class=\"btn btn-link\">\n {{ social?.label }}\n </a>\n }\n </div>\n }\n </div>\n </div>\n @if (img) {\n <div class=\"contact-minimal__content--media col-span-full md:col-span-12 md:col-start-1\">\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\"></ui-image>\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </div>\n }\n</div>\n", styles: [".contact-minimal__content{display:grid;grid-auto-flow:column}.contact-minimal__content--left .btn{justify-content:start;font-size:1.1rem}.contact-minimal__content--right{justify-self:end}.contact-minimal__content--right .btn-group{align-items:end}.contact-minimal__content--right .btn{justify-content:end;font-size:1.1rem}.contact-minimal__content--media{justify-self:center}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{transform:rotate(45deg);width:50rem}@media(max-width:768px){.contact-minimal__content--media{top:16rem}.contact-minimal__content--media img,.contact-minimal__content--media ui-image{width:15rem;height:auto}}.contact-minimal .btn-group{display:flex;flex-direction:column;margin-top:1rem;gap:0}\n"] }]
217
- }], propDecorators: { contactsTitle: [{
218
- type: Input
219
- }], socialsTitle: [{
220
- type: Input
221
- }], contacts: [{
222
- type: Input
223
- }], socials: [{
224
- type: Input
225
- }], img: [{
226
- type: Input
227
- }] } });
228
-
229
- class MediaSplitComponent {
230
- platformId;
231
- title;
232
- text;
233
- images;
234
- activeImageIndex = signal(0);
235
- imageLoaded = signal(false);
236
- constructor(platformId) {
237
- this.platformId = platformId;
238
- effect(() => {
239
- this.activeImageIndex();
240
- if (!isPlatformBrowser(this.platformId))
241
- return;
242
- this.imageLoaded.set(false);
243
- requestAnimationFrame(() => {
244
- this.imageLoaded.set(true);
245
- });
246
- });
247
- }
248
- currentImage = computed(() => {
249
- const imgs = this.images ?? [];
250
- return imgs[this.activeImageIndex()] ?? null;
251
- });
252
- updateActiveImage(index) {
253
- this.activeImageIndex.set(index);
254
- }
255
- resetImage() {
256
- this.activeImageIndex.set(0);
257
- }
258
- ngOnInit() {
259
- if (!isPlatformBrowser(this.platformId))
260
- return;
261
- if ('requestIdleCallback' in window) {
262
- window.requestIdleCallback(() => {
263
- this.preloadImages();
264
- });
265
- }
266
- else {
267
- setTimeout(() => this.preloadImages(), 2000);
268
- }
269
- }
270
- preloadImages() {
271
- this.images?.slice(1).forEach((img) => {
272
- const i = new Image();
273
- i.src = img.url;
274
- });
275
- }
276
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MediaSplitComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
277
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MediaSplitComponent, isStandalone: true, selector: "lib-media-split", inputs: { title: "title", text: "text", images: "images" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"media-split main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-split__visual col-span-full md:col-span-7 md:col-start-1\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n\n @if (images?.length) {\n <div class=\"image-stack\" (mouseleave)=\"resetImage()\">\n @if (currentImage().publicId) {\n <ui-image\n [publicId]=\"currentImage().publicId!\"\n [eager]=\"true\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n ></ui-image>\n } @else {\n <img\n [src]=\"currentImage().url\"\n [alt]=\"currentImage().alt\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n loading=\"eager\"\n fetchpriority=\"high\"\n />\n }\n\n <div class=\"hover-grid\">\n @for (image of images; track $index) {\n <div class=\"hover-zone\" (mouseenter)=\"updateActiveImage($index)\"></div>\n }\n </div>\n </div>\n }\n </div>\n\n <div class=\"media-split__info col-span-full md:col-span-5 md:col-start-8\">\n @if (text) {\n <p class=\"text\" [innerHTML]=\"text\"></p>\n }\n </div>\n</div>\n", styles: [".media-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:1.5rem;align-items:end;padding-block:0rem}.media-split__visual{display:flex;flex-direction:column;justify-content:flex-end}.media-split__visual .title{margin-bottom:1.5rem;text-transform:uppercase}.media-split__info{align-self:end;padding-bottom:.5rem}.img-responsive{width:100%;height:100%;display:block;object-fit:cover}.image-stack{position:relative;width:100%;aspect-ratio:14/9;overflow:hidden;cursor:ew-resize}.active-image{position:absolute;inset:0;opacity:0;transform:scale(1.03);transition:opacity .35s ease,transform .6s ease}.active-image.loaded{opacity:1;transform:scale(1)}.hover-grid{position:absolute;inset:0;display:flex;z-index:10;pointer-events:none}.hover-grid .hover-zone{flex:1;height:100%;cursor:inherit;pointer-events:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
278
- }
279
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MediaSplitComponent, decorators: [{
280
- type: Component,
281
- args: [{ selector: 'lib-media-split', standalone: true, imports: [CommonModule, UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
282
- style: 'display: contents',
283
- }, template: "<div class=\"media-split main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-split__visual col-span-full md:col-span-7 md:col-start-1\">\n @if (title) {\n <h1 class=\"title\">{{ title }}</h1>\n }\n\n @if (images?.length) {\n <div class=\"image-stack\" (mouseleave)=\"resetImage()\">\n @if (currentImage().publicId) {\n <ui-image\n [publicId]=\"currentImage().publicId!\"\n [eager]=\"true\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n ></ui-image>\n } @else {\n <img\n [src]=\"currentImage().url\"\n [alt]=\"currentImage().alt\"\n class=\"img-responsive active-image\"\n [class.loaded]=\"imageLoaded()\"\n loading=\"eager\"\n fetchpriority=\"high\"\n />\n }\n\n <div class=\"hover-grid\">\n @for (image of images; track $index) {\n <div class=\"hover-zone\" (mouseenter)=\"updateActiveImage($index)\"></div>\n }\n </div>\n </div>\n }\n </div>\n\n <div class=\"media-split__info col-span-full md:col-span-5 md:col-start-8\">\n @if (text) {\n <p class=\"text\" [innerHTML]=\"text\"></p>\n }\n </div>\n</div>\n", styles: [".media-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:1.5rem;align-items:end;padding-block:0rem}.media-split__visual{display:flex;flex-direction:column;justify-content:flex-end}.media-split__visual .title{margin-bottom:1.5rem;text-transform:uppercase}.media-split__info{align-self:end;padding-bottom:.5rem}.img-responsive{width:100%;height:100%;display:block;object-fit:cover}.image-stack{position:relative;width:100%;aspect-ratio:14/9;overflow:hidden;cursor:ew-resize}.active-image{position:absolute;inset:0;opacity:0;transform:scale(1.03);transition:opacity .35s ease,transform .6s ease}.active-image.loaded{opacity:1;transform:scale(1)}.hover-grid{position:absolute;inset:0;display:flex;z-index:10;pointer-events:none}.hover-grid .hover-zone{flex:1;height:100%;cursor:inherit;pointer-events:auto}\n"] }]
284
- }], ctorParameters: () => [{ type: Object, decorators: [{
285
- type: Inject,
286
- args: [PLATFORM_ID]
287
- }] }], propDecorators: { title: [{
288
- type: Input
289
- }], text: [{
290
- type: Input
291
- }], images: [{
292
- type: Input
293
- }] } });
294
-
295
- class StackedRowsComponent {
296
- title;
297
- text;
298
- items;
299
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: StackedRowsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
300
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: StackedRowsComponent, isStandalone: true, selector: "lib-stacked-rows", inputs: { title: "title", text: "text", items: "items" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"stacked-rows main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <!-- INTRO -->\n <div class=\"stacked-rows__intro main-grid col-span-full\">\n @if (title) {\n <h1 class=\"subtitle col-span-full md:col-span-3 md:col-start-1\">\n {{ title }}\n </h1>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-9 md:col-start-4\">\n {{ text }}\n </p>\n }\n </div>\n\n <!-- ITEMS -->\n @if (items) {\n <div class=\"stacked-rows__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"stacked-rows__items--item main-grid\">\n <h2 class=\"stacked-rows__items--item_title col-span-full md:col-span-3 md:col-start-1\">\n {{ item.title }}\n </h2>\n\n <p class=\"stacked-rows__items--item_text col-span-full md:col-span-7 md:col-start-6\">\n {{ item.text }}\n </p>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".stacked-rows{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.stacked-rows .subtitle,.stacked-rows .text{color:var(--text-secondary)}.stacked-rows__intro{border-bottom:1px solid var(--border-secondary);padding-block:0rem}.stacked-rows__intro .text{font-size:2.4rem;font-weight:600;margin-bottom:3rem}.stacked-rows__items--item{border-bottom:1px solid var(--border-secondary);padding-bottom:4.5rem}.stacked-rows__items--item:last-child{border-bottom:none}.stacked-rows__items--item_title{margin:0;font-size:2rem;color:var(--text-secondary);font-weight:100}.stacked-rows__items--item_text{margin:0;font-size:1.2rem;color:var(--text-secondary)}@media(max-width:1024px){.stacked-rows{padding-block:6rem 2rem}.stacked-rows__intro .text{font-size:1.6rem}.stacked-rows__items--item{padding-block:2rem}.stacked-rows__items--item_title{font-size:1.6rem}.stacked-rows__items--item_text{font-size:1.1rem;margin-top:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
301
- }
302
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: StackedRowsComponent, decorators: [{
303
- type: Component,
304
- args: [{ selector: 'lib-stacked-rows', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
305
- style: 'display: contents',
306
- }, template: "<div class=\"stacked-rows main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <!-- INTRO -->\n <div class=\"stacked-rows__intro main-grid col-span-full\">\n @if (title) {\n <h1 class=\"subtitle col-span-full md:col-span-3 md:col-start-1\">\n {{ title }}\n </h1>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-9 md:col-start-4\">\n {{ text }}\n </p>\n }\n </div>\n\n <!-- ITEMS -->\n @if (items) {\n <div class=\"stacked-rows__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"stacked-rows__items--item main-grid\">\n <h2 class=\"stacked-rows__items--item_title col-span-full md:col-span-3 md:col-start-1\">\n {{ item.title }}\n </h2>\n\n <p class=\"stacked-rows__items--item_text col-span-full md:col-span-7 md:col-start-6\">\n {{ item.text }}\n </p>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".stacked-rows{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.stacked-rows .subtitle,.stacked-rows .text{color:var(--text-secondary)}.stacked-rows__intro{border-bottom:1px solid var(--border-secondary);padding-block:0rem}.stacked-rows__intro .text{font-size:2.4rem;font-weight:600;margin-bottom:3rem}.stacked-rows__items--item{border-bottom:1px solid var(--border-secondary);padding-bottom:4.5rem}.stacked-rows__items--item:last-child{border-bottom:none}.stacked-rows__items--item_title{margin:0;font-size:2rem;color:var(--text-secondary);font-weight:100}.stacked-rows__items--item_text{margin:0;font-size:1.2rem;color:var(--text-secondary)}@media(max-width:1024px){.stacked-rows{padding-block:6rem 2rem}.stacked-rows__intro .text{font-size:1.6rem}.stacked-rows__items--item{padding-block:2rem}.stacked-rows__items--item_title{font-size:1.6rem}.stacked-rows__items--item_text{font-size:1.1rem;margin-top:0}}\n"] }]
307
- }], propDecorators: { title: [{
308
- type: Input
309
- }], text: [{
310
- type: Input
311
- }], items: [{
312
- type: Input
313
- }] } });
314
-
315
- class MosaicParallaxComponent {
316
- title;
317
- text;
318
- images;
319
- mosaicSection;
320
- isVisible = signal(false);
321
- observer;
322
- isBrowser;
323
- constructor(platformId) {
324
- this.isBrowser = isPlatformBrowser(platformId);
325
- }
326
- ngAfterViewInit() {
327
- if (!this.isBrowser)
328
- return;
329
- this.observer = new IntersectionObserver(([entry]) => {
330
- if (entry.isIntersecting && !this.isVisible()) {
331
- this.isVisible.set(true);
332
- this.observer?.disconnect();
333
- }
334
- }, { threshold: 0.1 });
335
- this.observer.observe(this.mosaicSection.nativeElement);
336
- }
337
- ngOnDestroy() {
338
- this.observer?.disconnect();
339
- }
340
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MosaicParallaxComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
341
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MosaicParallaxComponent, isStandalone: true, selector: "app-mosaic-parallax", inputs: { title: "title", text: "text", images: "images" }, host: { styleAttribute: "display: contents" }, viewQueries: [{ propertyName: "mosaicSection", first: true, predicate: ["mosaicSection"], descendants: true }], ngImport: i0, template: "<div class=\"mosaic-parallax main-grid col-span-full\" #mosaicSection>\n\n @if (title) {\n <h2 class=\"subtitle md:col-span-3 md:col-start-1\">{{ title }}</h2>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-5 md:col-start-1\">\n {{ text }}\n </p>\n }\n\n @if (images && images.length > 0) {\n <div class=\"mosaic-parallax__track col-span-full md:col-span-10 md:col-start-2\">\n @for (item of images; track $index) {\n <article\n class=\"mosaic-item\"\n [class.mosaic-item--visible]=\"isVisible()\"\n [style.--item-index]=\"images.length - 1 - $index\"\n [style.--anim-delay]=\"(images.length - 1 - $index) * 250 + 'ms'\"\n >\n <div class=\"mosaic-item__media\">\n @if (item.publicId) {\n <ui-image [publicId]=\"item.publicId\"></ui-image>\n } @else {\n <img [src]=\"item.url\" [alt]=\"item.alt\" loading=\"lazy\" />\n }\n </div>\n @if (item.texts; as texts) {\n <div class=\"mosaic-item__content\">\n <p class=\"mosaic-item__description\">{{ texts.text }}</p>\n <div class=\"mosaic-item__meta\">\n <span class=\"mosaic-item__date\">{{ texts.title }}</span>\n <span class=\"mosaic-item__index\">\n {{ ($index + 1).toString().padStart(2, '0') }}\n </span>\n </div>\n </div>\n }\n </article>\n }\n </div>\n }\n\n</div>", styles: ["@charset \"UTF-8\";.mosaic-parallax{position:relative;align-items:start;padding-block:4rem}.text{grid-row:2}.mosaic-parallax__track{grid-row:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));align-items:start;justify-content:center;gap:2.25rem;width:100%;overflow:hidden;padding-block:0 4rem}.mosaic-item{flex-shrink:0;width:95%;display:flex;flex-direction:column;border:2px solid var(--border-primary);overflow:hidden;background:var(--content-bg-light);margin-top:calc(var(--item-index) * 80px);transform:translateY(100px);transition:transform 1.4s cubic-bezier(.16,1,.3,1) var(--anim-delay),opacity .8s ease var(--anim-delay)}.mosaic-item--visible{transform:translateY(0);opacity:1}.mosaic-item__media{width:100%;aspect-ratio:4/3;overflow:hidden}.mosaic-item__media img,.mosaic-item__media ui-image{width:100%;height:100%;object-fit:cover;display:block}.mosaic-item__content{display:flex;flex-direction:column;justify-content:space-between;padding:1.2rem 1.5rem;min-height:11rem;background:var(--content-bg-dark);color:var(--text-inverse);border-top:2px solid var(--border-primary)}.mosaic-item:nth-child(2n) .mosaic-item__content{background:var(--content-bg-light);color:var(--text-primary)}.mosaic-item:nth-child(2n) .mosaic-item__index{background:var(--content-bg-dark);color:var(--text-inverse)}.mosaic-item__description{font-size:.9rem;line-height:1.4;margin:0 0 1rem}.mosaic-item__meta{display:flex;justify-content:space-between;align-items:flex-end}.mosaic-item__date{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700}.mosaic-item__index{font-size:3rem;font-weight:900;line-height:1;background:#f2f2f2;color:var(--text-primary);padding:.5rem 1rem;border-left:2px solid var(--border-primary);margin:0 -1.5rem -1.2rem 0}@media(max-width:1024px){.mosaic-parallax__track{flex-direction:column;align-items:center;justify-items:center;overflow:visible;grid-row:3}.mosaic-item{width:90%;height:90%;margin-top:0!important}}@media(max-width:768px){.mosaic-item{width:85%;margin-top:0!important}}\n"], dependencies: [{ kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
342
- }
343
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MosaicParallaxComponent, decorators: [{
344
- type: Component,
345
- args: [{ selector: 'app-mosaic-parallax', standalone: true, imports: [UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
346
- style: 'display: contents',
347
- }, template: "<div class=\"mosaic-parallax main-grid col-span-full\" #mosaicSection>\n\n @if (title) {\n <h2 class=\"subtitle md:col-span-3 md:col-start-1\">{{ title }}</h2>\n }\n\n @if (text) {\n <p class=\"text col-span-full md:col-span-5 md:col-start-1\">\n {{ text }}\n </p>\n }\n\n @if (images && images.length > 0) {\n <div class=\"mosaic-parallax__track col-span-full md:col-span-10 md:col-start-2\">\n @for (item of images; track $index) {\n <article\n class=\"mosaic-item\"\n [class.mosaic-item--visible]=\"isVisible()\"\n [style.--item-index]=\"images.length - 1 - $index\"\n [style.--anim-delay]=\"(images.length - 1 - $index) * 250 + 'ms'\"\n >\n <div class=\"mosaic-item__media\">\n @if (item.publicId) {\n <ui-image [publicId]=\"item.publicId\"></ui-image>\n } @else {\n <img [src]=\"item.url\" [alt]=\"item.alt\" loading=\"lazy\" />\n }\n </div>\n @if (item.texts; as texts) {\n <div class=\"mosaic-item__content\">\n <p class=\"mosaic-item__description\">{{ texts.text }}</p>\n <div class=\"mosaic-item__meta\">\n <span class=\"mosaic-item__date\">{{ texts.title }}</span>\n <span class=\"mosaic-item__index\">\n {{ ($index + 1).toString().padStart(2, '0') }}\n </span>\n </div>\n </div>\n }\n </article>\n }\n </div>\n }\n\n</div>", styles: ["@charset \"UTF-8\";.mosaic-parallax{position:relative;align-items:start;padding-block:4rem}.text{grid-row:2}.mosaic-parallax__track{grid-row:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));align-items:start;justify-content:center;gap:2.25rem;width:100%;overflow:hidden;padding-block:0 4rem}.mosaic-item{flex-shrink:0;width:95%;display:flex;flex-direction:column;border:2px solid var(--border-primary);overflow:hidden;background:var(--content-bg-light);margin-top:calc(var(--item-index) * 80px);transform:translateY(100px);transition:transform 1.4s cubic-bezier(.16,1,.3,1) var(--anim-delay),opacity .8s ease var(--anim-delay)}.mosaic-item--visible{transform:translateY(0);opacity:1}.mosaic-item__media{width:100%;aspect-ratio:4/3;overflow:hidden}.mosaic-item__media img,.mosaic-item__media ui-image{width:100%;height:100%;object-fit:cover;display:block}.mosaic-item__content{display:flex;flex-direction:column;justify-content:space-between;padding:1.2rem 1.5rem;min-height:11rem;background:var(--content-bg-dark);color:var(--text-inverse);border-top:2px solid var(--border-primary)}.mosaic-item:nth-child(2n) .mosaic-item__content{background:var(--content-bg-light);color:var(--text-primary)}.mosaic-item:nth-child(2n) .mosaic-item__index{background:var(--content-bg-dark);color:var(--text-inverse)}.mosaic-item__description{font-size:.9rem;line-height:1.4;margin:0 0 1rem}.mosaic-item__meta{display:flex;justify-content:space-between;align-items:flex-end}.mosaic-item__date{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700}.mosaic-item__index{font-size:3rem;font-weight:900;line-height:1;background:#f2f2f2;color:var(--text-primary);padding:.5rem 1rem;border-left:2px solid var(--border-primary);margin:0 -1.5rem -1.2rem 0}@media(max-width:1024px){.mosaic-parallax__track{flex-direction:column;align-items:center;justify-items:center;overflow:visible;grid-row:3}.mosaic-item{width:90%;height:90%;margin-top:0!important}}@media(max-width:768px){.mosaic-item{width:85%;margin-top:0!important}}\n"] }]
348
- }], ctorParameters: () => [{ type: undefined, decorators: [{
349
- type: Inject,
350
- args: [PLATFORM_ID]
351
- }] }], propDecorators: { title: [{
352
- type: Input
353
- }], text: [{
354
- type: Input
355
- }], images: [{
356
- type: Input
357
- }], mosaicSection: [{
358
- type: ViewChild,
359
- args: ['mosaicSection']
360
- }] } });
361
-
362
- class ContentDocumentComponent {
363
- title;
364
- items;
365
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ContentDocumentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
366
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: ContentDocumentComponent, isStandalone: true, selector: "lib-content-document", inputs: { title: "title", items: "items" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"content-document main-grid col-span-full sm:col-span-12 sm:col-start-1\" scrollReveal>\n @if (title) {\n <div class=\"content-document__title main-grid col-span-full\">\n <h1 class=\"title col-span-full\">{{ title }}</h1>\n </div>\n }\n @if (items) {\n <div class=\"content-document__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"content-document__items--item main-grid\">\n <h2 class=\"content-document__items--item_title col-span-full sm:col-span-12 sm:col-start-1\">\n {{ item.title }}\n </h2>\n <p class=\"content-document__items--item_text col-span-full sm:col-span-4 sm:col-start-5\" [innerHTML]=\"item.text\"></p>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".content-document__title,.content-document__items--item_title{text-transform:uppercase}.main-grid{row-gap:0;padding-block:0}.content-document__items--item_title{margin-bottom:0;font-size:2rem}.content-document__items--item_text{font-size:1.3rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
367
- }
368
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ContentDocumentComponent, decorators: [{
369
- type: Component,
370
- args: [{ selector: 'lib-content-document', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
371
- style: 'display: contents',
372
- }, template: "<div class=\"content-document main-grid col-span-full sm:col-span-12 sm:col-start-1\" scrollReveal>\n @if (title) {\n <div class=\"content-document__title main-grid col-span-full\">\n <h1 class=\"title col-span-full\">{{ title }}</h1>\n </div>\n }\n @if (items) {\n <div class=\"content-document__items col-span-full\">\n @for (item of items; track $index) {\n <div class=\"content-document__items--item main-grid\">\n <h2 class=\"content-document__items--item_title col-span-full sm:col-span-12 sm:col-start-1\">\n {{ item.title }}\n </h2>\n <p class=\"content-document__items--item_text col-span-full sm:col-span-4 sm:col-start-5\" [innerHTML]=\"item.text\"></p>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".content-document__title,.content-document__items--item_title{text-transform:uppercase}.main-grid{row-gap:0;padding-block:0}.content-document__items--item_title{margin-bottom:0;font-size:2rem}.content-document__items--item_text{font-size:1.3rem}\n"] }]
373
- }], propDecorators: { title: [{
374
- type: Input
375
- }], items: [{
376
- type: Input
377
- }] } });
378
-
379
- class SplitShowcaseComponent {
380
- title;
381
- subtitle;
382
- description;
383
- metas;
384
- buttons;
385
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitShowcaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
386
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: SplitShowcaseComponent, isStandalone: true, selector: "lib-split-showcase", inputs: { title: "title", subtitle: "subtitle", description: "description", metas: "metas", buttons: "buttons" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div\n class=\"split-showcase main-grid col-span-full md:col-span-12 md:col-start-1\"\n scrollReveal\n>\n <div class=\"split-showcase__metas col-span-full md:col-span-5 md:col-start-1\">\n <h2 class=\"split-showcase__metas--title\">{{ title }}</h2>\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n <div class=\"split-showcase__metas--items\">\n @for (meta of metas; track meta.label) {\n <div class=\"split-showcase__metas--item\">\n <span class=\"split-showcase__metas--item-label\">{{ meta.label }}: </span>\n <span class=\"split-showcase__metas--item-value\">{{ meta.value }}</span> \n </div>\n }\n </div>\n </div>\n\n <div class=\"split-showcase__content col-span-full md:col-span-5 md:col-start-8\">\n <h3 class=\"split-showcase__content--subtitle\">{{ subtitle }}</h3>\n <p class=\"split-showcase__content--description\">{{ description }}</p>\n </div>\n</div>", styles: [".split-showcase__metas--title{font-size:3rem;font-weight:700}.split-showcase__metas--item:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:1rem}.split-showcase__metas--item:last-child:after{content:none}.split-showcase__metas .btn-group{margin-bottom:2rem}.split-showcase__metas .btn-group .btn-link{justify-content:start}.split-showcase__content--subtitle{font-size:2rem;padding-bottom:0}.split-showcase__content--subtitle:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:2rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }, { kind: "directive", type: LinkTypeDirective, selector: "[linkType]", inputs: ["linkType", "href"], outputs: ["anchorClicked"] }, { kind: "component", type: UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
387
- }
388
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitShowcaseComponent, decorators: [{
389
- type: Component,
390
- args: [{ selector: 'lib-split-showcase', imports: [CommonModule, ScrollRevealDirective, LinkTypeDirective, UiIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
391
- style: 'display: contents',
392
- }, template: "<div\n class=\"split-showcase main-grid col-span-full md:col-span-12 md:col-start-1\"\n scrollReveal\n>\n <div class=\"split-showcase__metas col-span-full md:col-span-5 md:col-start-1\">\n <h2 class=\"split-showcase__metas--title\">{{ title }}</h2>\n @if (buttons && buttons.length > 0) {\n <div class=\"btn-group\">\n @for (button of buttons; track $index) {\n <a class=\"btn btn-link\" [href]=\"button.url\" [linkType]=\"button.linkType\">\n <ui-icon [name]=\"button.icon!\" [size]=\"17\" [color]=\"'var(--color-primary)'\"></ui-icon>\n {{ button.label }}\n </a>\n }\n </div>\n }\n <div class=\"split-showcase__metas--items\">\n @for (meta of metas; track meta.label) {\n <div class=\"split-showcase__metas--item\">\n <span class=\"split-showcase__metas--item-label\">{{ meta.label }}: </span>\n <span class=\"split-showcase__metas--item-value\">{{ meta.value }}</span> \n </div>\n }\n </div>\n </div>\n\n <div class=\"split-showcase__content col-span-full md:col-span-5 md:col-start-8\">\n <h3 class=\"split-showcase__content--subtitle\">{{ subtitle }}</h3>\n <p class=\"split-showcase__content--description\">{{ description }}</p>\n </div>\n</div>", styles: [".split-showcase__metas--title{font-size:3rem;font-weight:700}.split-showcase__metas--item:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:1rem}.split-showcase__metas--item:last-child:after{content:none}.split-showcase__metas .btn-group{margin-bottom:2rem}.split-showcase__metas .btn-group .btn-link{justify-content:start}.split-showcase__content--subtitle{font-size:2rem;padding-bottom:0}.split-showcase__content--subtitle:after{content:\"\";display:block;height:1px;width:100%;background-color:var(--text-disabled);margin-block:2rem}\n"] }]
393
- }], propDecorators: { title: [{
394
- type: Input
395
- }], subtitle: [{
396
- type: Input
397
- }], description: [{
398
- type: Input
399
- }], metas: [{
400
- type: Input
401
- }], buttons: [{
402
- type: Input
403
- }] } });
404
-
405
- class AsymmetricMediaComponent {
406
- media;
407
- direction = 'right';
408
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: AsymmetricMediaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
409
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: AsymmetricMediaComponent, isStandalone: true, selector: "lib-asymmetric-media", inputs: { media: "media", direction: "direction" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div \n class=\"asymmetric-media main-grid col-span-full md:col-span-12 md:col-start-1\" \n scrollReveal\n>\n @if(media && media.length > 0) {\n <div class=\"asymmetric-media__items main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(direction === 'left') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-4 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-8 md:col-start-5\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n @if(direction === 'right') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-8 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-4 md:col-start-9\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: [".asymmetric-media{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.asymmetric-media__items{align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
410
- }
411
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: AsymmetricMediaComponent, decorators: [{
412
- type: Component,
413
- args: [{ selector: 'lib-asymmetric-media', imports: [CommonModule, UiImageComponent, ScrollRevealDirective], changeDetection: ChangeDetectionStrategy.OnPush, host: {
414
- style: 'display: contents',
415
- }, template: "<div \n class=\"asymmetric-media main-grid col-span-full md:col-span-12 md:col-start-1\" \n scrollReveal\n>\n @if(media && media.length > 0) {\n <div class=\"asymmetric-media__items main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(direction === 'left') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-4 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-8 md:col-start-5\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n @if(direction === 'right') {\n <div class=\"asymmetric-media__items--small col-span-full md:col-span-8 md:col-start-1\">\n @if (media[0]!.publicId) {\n <ui-image [publicId]=\"media[0]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[0]!.url\" [alt]=\"media[0]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n <div class=\"asymmetric-media__items--big col-span-full md:col-span-4 md:col-start-9\">\n @if (media[1]!.publicId) {\n <ui-image [publicId]=\"media[1]!.publicId!\" [eager]=\"true\" class=\"asymmetric-media-img\"></ui-image>\n } @else {\n <img [src]=\"media[1]!.url\" [alt]=\"media[1]!.alt\" class=\"asymmetric-media-img\" loading=\"eager\" />\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: [".asymmetric-media{background-color:var(--content-bg-dark);margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);padding-block:10rem 1rem}.asymmetric-media__items{align-items:center}\n"] }]
416
- }], propDecorators: { media: [{
417
- type: Input
418
- }], direction: [{
419
- type: Input
420
- }] } });
421
-
422
- class MediaIntroComponent {
423
- highlightedText;
424
- secondaryText;
425
- direction = 'right';
426
- media;
427
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MediaIntroComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
428
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MediaIntroComponent, isStandalone: true, selector: "lib-media-intro", inputs: { highlightedText: "highlightedText", secondaryText: "secondaryText", direction: "direction", media: "media" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"media-intro main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-intro__content main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(highlightedText) {\n <div class=\"media-intro__content--left main-grid col-span-full\">\n <h2 class=\"media-intro__content--main-text col-span-full md:col-span-6\" \n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-7]=\"direction === 'right'\"\n [innerHTML]=\"highlightedText\">\n </h2>\n </div>\n }\n @if(secondaryText) {\n <div class=\"media-intro__content--right main-grid col-span-full\">\n <p class=\"media-intro__content--secondary-text col-span-full md:col-span-6\"\n [class.md:col-start-7]=\"direction === 'left'\"\n [class.md:col-start-1]=\"direction === 'right'\"\n [innerHTML]=\"secondaryText\"\n ></p>\n </div>\n }\n </div>\n @if(media) {\n <div class=\"media-intro__media col-span-full md:col-span-12 md:col-start-1\">\n @if (media.publicId) {\n <ui-image [publicId]=\"media.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"media.url\" [alt]=\"media.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n", styles: [".media-intro__content--left,.media-intro__content--right{padding-block:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
429
- }
430
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MediaIntroComponent, decorators: [{
431
- type: Component,
432
- args: [{ selector: 'lib-media-intro', imports: [CommonModule, ScrollRevealDirective, UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
433
- style: 'display: contents',
434
- }, template: "<div class=\"media-intro main-grid col-span-full md:col-span-12 md:col-start-1\" scrollReveal>\n <div class=\"media-intro__content main-grid col-span-full md:col-span-12 md:col-start-1\">\n @if(highlightedText) {\n <div class=\"media-intro__content--left main-grid col-span-full\">\n <h2 class=\"media-intro__content--main-text col-span-full md:col-span-6\" \n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-7]=\"direction === 'right'\"\n [innerHTML]=\"highlightedText\">\n </h2>\n </div>\n }\n @if(secondaryText) {\n <div class=\"media-intro__content--right main-grid col-span-full\">\n <p class=\"media-intro__content--secondary-text col-span-full md:col-span-6\"\n [class.md:col-start-7]=\"direction === 'left'\"\n [class.md:col-start-1]=\"direction === 'right'\"\n [innerHTML]=\"secondaryText\"\n ></p>\n </div>\n }\n </div>\n @if(media) {\n <div class=\"media-intro__media col-span-full md:col-span-12 md:col-start-1\">\n @if (media.publicId) {\n <ui-image [publicId]=\"media.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"media.url\" [alt]=\"media.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n", styles: [".media-intro__content--left,.media-intro__content--right{padding-block:0!important}\n"] }]
435
- }], propDecorators: { highlightedText: [{
436
- type: Input
437
- }], secondaryText: [{
438
- type: Input
439
- }], direction: [{
440
- type: Input
441
- }], media: [{
442
- type: Input
443
- }] } });
444
-
445
- class ColumnsMediaStackedComponent {
446
- leftColumn;
447
- rightColumn;
448
- direction = 'right';
449
- image;
450
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ColumnsMediaStackedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
451
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: ColumnsMediaStackedComponent, isStandalone: true, selector: "lib-columns-media-stacked", inputs: { leftColumn: "leftColumn", rightColumn: "rightColumn", direction: "direction", image: "image" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"columns-media-stacked main-grid col-span-full\" scrollReveal>\n <div class=\"columns-media-stacked__content main-grid col-span-full\">\n @if(leftColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-5]=\"direction === 'right'\"\n [innerHTML]=\"leftColumn\"\n > \n </p>\n }\n @if(rightColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-5]=\"direction === 'left'\"\n [class.md:col-start-9]=\"direction === 'right'\"\n [innerHTML]=\"rightColumn\"\n > \n </p>\n }\n </div>\n @if(image) {\n <div \n class=\"columns-media-stacked__image col-span-full md:col-span-10\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-3]=\"direction === 'right'\"\n >\n @if (image.publicId) {\n <ui-image [publicId]=\"image.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"image.url\" [alt]=\"image.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
452
- }
453
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ColumnsMediaStackedComponent, decorators: [{
454
- type: Component,
455
- args: [{ selector: 'lib-columns-media-stacked', imports: [CommonModule, ScrollRevealDirective, UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
456
- style: 'display: contents',
457
- }, template: "<div class=\"columns-media-stacked main-grid col-span-full\" scrollReveal>\n <div class=\"columns-media-stacked__content main-grid col-span-full\">\n @if(leftColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-5]=\"direction === 'right'\"\n [innerHTML]=\"leftColumn\"\n > \n </p>\n }\n @if(rightColumn) {\n <p \n class=\"columns-media-stacked__content-column col-span-full md:col-span-4\"\n [class.md:col-start-5]=\"direction === 'left'\"\n [class.md:col-start-9]=\"direction === 'right'\"\n [innerHTML]=\"rightColumn\"\n > \n </p>\n }\n </div>\n @if(image) {\n <div \n class=\"columns-media-stacked__image col-span-full md:col-span-10\"\n [class.md:col-start-1]=\"direction === 'left'\"\n [class.md:col-start-3]=\"direction === 'right'\"\n >\n @if (image.publicId) {\n <ui-image [publicId]=\"image.publicId\" [eager]=\"true\" class=\"media-intro-img\"></ui-image>\n } @else {\n <img [src]=\"image.url\" [alt]=\"image.alt\" class=\"media-intro-img\" loading=\"eager\" />\n }\n </div>\n }\n</div>\n" }]
458
- }], propDecorators: { leftColumn: [{
459
- type: Input
460
- }], rightColumn: [{
461
- type: Input
462
- }], direction: [{
463
- type: Input
464
- }], image: [{
465
- type: Input
466
- }] } });
467
-
468
- class MosaicGridComponent {
469
- text;
470
- images;
471
- imageGroups = [];
472
- ngOnInit() {
473
- console.log('MosaicGridComponent initialized with images:', this.images);
474
- if (!this.images?.length) {
475
- this.imageGroups = [];
476
- return;
477
- }
478
- const groups = [];
479
- for (let i = 0; i < this.images.length; i += 5) {
480
- groups.push({
481
- row1: this.images.slice(i, i + 3),
482
- row2: this.images.slice(i + 3, i + 5)
483
- });
484
- }
485
- this.imageGroups = groups;
486
- }
487
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MosaicGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
488
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MosaicGridComponent, isStandalone: true, selector: "lib-mosaic-grid", inputs: { text: "text", images: "images" }, host: { styleAttribute: "display: contents" }, ngImport: i0, template: "<div class=\"mosaic-grid main-grid\" scrollReveal>\n @if (text) {\n <p\n class=\"mosaic-grid__text col-span-full md:col-span-6 md:col-start-7\"\n [innerHTML]=\"text\"\n ></p>\n }\n\n @for (group of imageGroups; track $index) {\n\n <!-- row 1: 3 im\u00E1genes -->\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @for (img of group.row1; track $index) {\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\"></ui-image>\n } @else {\n <img [src]=\"img.url\" [alt]=\"img.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\" />\n }\n }\n </div>\n\n <!-- row 2: 1 peque\u00F1a + 1 grande -->\n @if (group.row2.length) {\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @if (group.row2[0]!.publicId) {\n <ui-image [publicId]=\"group.row2[0]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\"></ui-image>\n } @else {\n <img [src]=\"group.row2[0]!.url\" [alt]=\"group.row2[0]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\" />\n }\n\n @if (group.row2[1]) {\n @if (group.row2[1]!.publicId) {\n <ui-image [publicId]=\"group.row2[1]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\"></ui-image>\n } @else {\n <img [src]=\"group.row2[1]!.url\" [alt]=\"group.row2[1]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\" />\n }\n }\n </div>\n }\n\n }\n</div>\n", styles: ["ui-image{object-fit:cover}ui-image.image-half-height{height:50%!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: UiImageComponent, selector: "ui-image", inputs: ["publicId", "cloudName", "transformations", "eager", "width", "height"] }, { kind: "directive", type: ScrollRevealDirective, selector: "[scrollReveal]", inputs: ["distance", "duration"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
489
- }
490
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MosaicGridComponent, decorators: [{
491
- type: Component,
492
- args: [{ selector: 'lib-mosaic-grid', imports: [CommonModule, UiImageComponent, ScrollRevealDirective], changeDetection: ChangeDetectionStrategy.OnPush, host: {
493
- style: 'display: contents',
494
- }, template: "<div class=\"mosaic-grid main-grid\" scrollReveal>\n @if (text) {\n <p\n class=\"mosaic-grid__text col-span-full md:col-span-6 md:col-start-7\"\n [innerHTML]=\"text\"\n ></p>\n }\n\n @for (group of imageGroups; track $index) {\n\n <!-- row 1: 3 im\u00E1genes -->\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @for (img of group.row1; track $index) {\n @if (img.publicId) {\n <ui-image [publicId]=\"img.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\"></ui-image>\n } @else {\n <img [src]=\"img.url\" [alt]=\"img.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-{{ $index * 4 + 1 }}\" [class.image-half-height]=\"$index === 2\" />\n }\n }\n </div>\n\n <!-- row 2: 1 peque\u00F1a + 1 grande -->\n @if (group.row2.length) {\n <div class=\"mosaic-grid__images main-grid col-span-full\">\n @if (group.row2[0]!.publicId) {\n <ui-image [publicId]=\"group.row2[0]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\"></ui-image>\n } @else {\n <img [src]=\"group.row2[0]!.url\" [alt]=\"group.row2[0]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-4 md:col-start-1 image-half-height\" />\n }\n\n @if (group.row2[1]) {\n @if (group.row2[1]!.publicId) {\n <ui-image [publicId]=\"group.row2[1]!.publicId\" [eager]=\"true\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\"></ui-image>\n } @else {\n <img [src]=\"group.row2[1]!.url\" [alt]=\"group.row2[1]!.alt\" loading=\"eager\" class=\"mosaic-grid__images col-span-full md:col-span-8 md:col-start-5\" />\n }\n }\n </div>\n }\n\n }\n</div>\n", styles: ["ui-image{object-fit:cover}ui-image.image-half-height{height:50%!important}\n"] }]
495
- }], propDecorators: { text: [{
496
- type: Input
497
- }], images: [{
498
- type: Input
499
- }] } });
500
-
501
- /**
502
- * Generated bundle index. Do not edit.
503
- */
504
-
505
- export { AsymmetricMediaComponent, CategoryProgressComponent, ColumnsMediaStackedComponent, ContactMinimalComponent, ContentDocumentComponent, Default, HeroSectionComponent, ImageVariant, MediaIntroComponent, MediaSplitComponent, MosaicGridComponent, MosaicParallaxComponent, SectionIntroComponent, SplitPreviewerComponent, SplitShowcaseComponent, StackedRowsComponent };
506
- //# sourceMappingURL=lluc_llull-ui-lib-content.mjs.map
1290
+ //# sourceMappingURL=lluc_llull-ui-lib-content.mjs.map