@lluc_llull/ui-lib 0.33.9 → 0.34.0

package/fesm2022/lluc_llull-ui-lib-content-split-previewer.mjs

@@ -1,62 +1,134 @@
-import { isPlatformBrowser, CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { signal, PLATFORM_ID, Input, Inject, ChangeDetectionStrategy, Component } from '@angular/core';
-import { LinkTypeDirective, HighlightDirective, ScrollRevealDirective } from '@lluc_llull/ui-lib/directives';
-import { UiImageComponent } from '@lluc_llull/ui-lib/shared';
-
-class SplitPreviewerComponent {
-    platformId;
-    title;
-    items;
-    imageDefault;
-    direction = 'right';
-    activeImage = signal(undefined);
-    get count() {
-        return this.items?.length || 0;
-    }
-    constructor(platformId) {
-        this.platformId = platformId;
-    }
-    ngOnInit() {
-        if (!this.items)
-            return;
-        if (!isPlatformBrowser(this.platformId))
-            return;
-        if ('requestIdleCallback' in window) {
-            window.requestIdleCallback(() => {
-                this.items?.forEach((item) => {
-                    if (item.image?.url) {
-                        const img = new Image();
-                        img.src = item.image.url;
-                    }
-                });
-            });
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitPreviewerComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
-    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 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitPreviewerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-split-previewer', imports: [CommonModule, LinkTypeDirective, HighlightDirective, ScrollRevealDirective, UiImageComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        style: 'display: contents',
-                    }, 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"] }]
-        }], ctorParameters: () => [{ type: Object, decorators: [{
-                    type: Inject,
-                    args: [PLATFORM_ID]
-                }] }], propDecorators: { title: [{
-                type: Input
-            }], items: [{
-                type: Input
-            }], imageDefault: [{
-                type: Input
-            }], direction: [{
-                type: Input
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import { CommonModule, isPlatformBrowser } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Inject, Input, PLATFORM_ID, signal } from "@angular/core";
+import { HighlightDirective, LinkTypeDirective, ScrollRevealDirective } from "@lluc_llull/ui-lib/directives";
+import { UiImageComponent } from "@lluc_llull/ui-lib/shared";
+var SplitPreviewerComponent = class SplitPreviewerComponent {
+	platformId;
+	title;
+	items;
+	imageDefault;
+	direction = "right";
+	activeImage = signal(void 0, ...ngDevMode ? [{ debugName: "activeImage" }] : /* istanbul ignore next */ []);
+	get count() {
+		return this.items?.length || 0;
+	}
+	constructor(platformId) {
+		this.platformId = platformId;
+	}
+	ngOnInit() {
+		if (!this.items) return;
+		if (!isPlatformBrowser(this.platformId)) return;
+		if ("requestIdleCallback" in window) window.requestIdleCallback(() => {
+			this.items?.forEach((item) => {
+				if (item.image?.url) {
+					const img = new Image();
+					img.src = item.image.url;
+				}
+			});
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.4",
+		ngImport: i0,
+		type: SplitPreviewerComponent,
+		deps: [{ token: PLATFORM_ID }],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.4",
+		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
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.4",
+	ngImport: i0,
+	type: SplitPreviewerComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "lib-split-previewer",
+			imports: [
+				CommonModule,
+				LinkTypeDirective,
+				HighlightDirective,
+				ScrollRevealDirective,
+				UiImageComponent
+			],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { style: "display: contents" },
+			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"]
+		}]
+	}],
+	ctorParameters: () => [{
+		type: Object,
+		decorators: [{
+			type: Inject,
+			args: [PLATFORM_ID]
+		}]
+	}],
+	propDecorators: {
+		title: [{ type: Input }],
+		items: [{ type: Input }],
+		imageDefault: [{ type: Input }],
+		direction: [{ type: Input }]
+	}
+});
 export { SplitPreviewerComponent };
-//# sourceMappingURL=lluc_llull-ui-lib-content-split-previewer.mjs.map
+
+//# sourceMappingURL=lluc_llull-ui-lib-content-split-previewer.mjs.map

package/fesm2022/lluc_llull-ui-lib-content-split-previewer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lluc_llull-ui-lib-content-split-previewer.mjs","sources":["../../../projects/ui-lib/content/split-previewer/split-previewer.component.ts","../../../projects/ui-lib/content/split-previewer/split-previewer.component.html","../../../projects/ui-lib/content/split-previewer/lluc_llull-ui-lib-content-split-previewer.ts"],"sourcesContent":["import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Inject, Input, OnInit, PLATFORM_ID, signal } from '@angular/core';\nimport {\n    HighlightDirective,\n    LinkTypeDirective,\n    ScrollRevealDirective,\n} from '@lluc_llull/ui-lib/directives';\nimport { UiLibButtonI, UiLibImageI } from '@lluc_llull/ui-lib/interfaces';\nimport { UiImageComponent } from '@lluc_llull/ui-lib/shared';\n\n@Component({\n    selector: 'lib-split-previewer',\n    imports: [CommonModule, LinkTypeDirective, HighlightDirective, ScrollRevealDirective, UiImageComponent],\n    templateUrl: './split-previewer.component.html',\n    styleUrl: './split-previewer.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        style: 'display: contents',\n    },\n})\nexport class SplitPreviewerComponent implements OnInit {\n    @Input() title?: string;\n    @Input() items?: SplitPreviewerItemI[];\n    @Input() imageDefault?: UiLibImageI;\n    @Input() direction: 'left' | 'right' = 'right';\n\n    activeImage = signal<UiLibImageI | undefined>(undefined);\n\n    get count(): number {\n        return this.items?.length || 0;\n    }\n\n    constructor(@Inject(PLATFORM_ID) private readonly platformId: Object) {}\n\n    ngOnInit() {\n        if (!this.items) return;\n        if (!isPlatformBrowser(this.platformId)) return;\n        if ('requestIdleCallback' in window) {\n            (window as any).requestIdleCallback(() => {\n                this.items?.forEach((item) => {\n                    if (item.image?.url) {\n                        const img = new Image();\n                        img.src = item.image.url;\n                    }\n                });\n            });\n        }\n    }\n}\n\nexport interface SplitPreviewerItemI {\n    title?: string;\n    type?: string;\n    description?: string;\n    tags?: string[];\n    link?: UiLibButtonI;\n    image?: UiLibImageI;\n}\n","<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","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAoBa,uBAAuB,CAAA;AAYkB,IAAA,UAAA;AAXzC,IAAA,KAAK;AACL,IAAA,KAAK;AACL,IAAA,YAAY;IACZ,SAAS,GAAqB,OAAO;AAE9C,IAAA,WAAW,GAAG,MAAM,CAA0B,SAAS,CAAC;AAExD,IAAA,IAAI,KAAK,GAAA;AACL,QAAA,OAAO,IAAI,CAAC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClC;AAEA,IAAA,WAAA,CAAkD,UAAkB,EAAA;QAAlB,IAAA,CAAA,UAAU,GAAV,UAAU;IAAW;IAEvE,QAAQ,GAAA;QACJ,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE;AACjB,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC;YAAE;AACzC,QAAA,IAAI,qBAAqB,IAAI,MAAM,EAAE;AAChC,YAAA,MAAc,CAAC,mBAAmB,CAAC,MAAK;gBACrC,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,IAAI,KAAI;AACzB,oBAAA,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE;AACjB,wBAAA,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE;wBACvB,GAAG,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG;oBAC5B;AACJ,gBAAA,CAAC,CAAC;AACN,YAAA,CAAC,CAAC;QACN;IACJ;AA3BS,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,kBAYZ,WAAW,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAZtB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,OAAA,EAAA,YAAA,EAAA,cAAA,EAAA,SAAA,EAAA,WAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,mBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpBpC,g8DA4DA,EAAA,MAAA,EAAA,CAAA,6+FAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDhDc,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,iBAAiB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,kBAAkB,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,oBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,qBAAqB,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,OAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;4FAQ7F,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAVnC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,qBAAqB,WACtB,CAAC,YAAY,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,gBAAgB,CAAC,EAAA,eAAA,EAGtF,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACF,wBAAA,KAAK,EAAE,mBAAmB;AAC7B,qBAAA,EAAA,QAAA,EAAA,g8DAAA,EAAA,MAAA,EAAA,CAAA,6+FAAA,CAAA,EAAA;;0BAcY,MAAM;2BAAC,WAAW;yCAXtB,KAAK,EAAA,CAAA;sBAAb;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,YAAY,EAAA,CAAA;sBAApB;gBACQ,SAAS,EAAA,CAAA;sBAAjB;;;AExBL;;AAEG;;;;"}
+{"version":3,"file":"lluc_llull-ui-lib-content-split-previewer.mjs","names":[],"sources":["../../../projects/ui-lib/content/split-previewer/split-previewer.component.ts","../../../projects/ui-lib/content/split-previewer/split-previewer.component.html"],"sourcesContent":["import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Inject, Input, OnInit, PLATFORM_ID, signal } from '@angular/core';\nimport {\n    HighlightDirective,\n    LinkTypeDirective,\n    ScrollRevealDirective,\n} from '@lluc_llull/ui-lib/directives';\nimport { UiLibButtonI, UiLibImageI } from '@lluc_llull/ui-lib/interfaces';\nimport { UiImageComponent } from '@lluc_llull/ui-lib/shared';\n\n@Component({\n    selector: 'lib-split-previewer',\n    imports: [CommonModule, LinkTypeDirective, HighlightDirective, ScrollRevealDirective, UiImageComponent],\n    templateUrl: './split-previewer.component.html',\n    styleUrl: './split-previewer.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        style: 'display: contents',\n    },\n})\nexport class SplitPreviewerComponent implements OnInit {\n    @Input() title?: string;\n    @Input() items?: SplitPreviewerItemI[];\n    @Input() imageDefault?: UiLibImageI;\n    @Input() direction: 'left' | 'right' = 'right';\n\n    activeImage = signal<UiLibImageI | undefined>(undefined);\n\n    get count(): number {\n        return this.items?.length || 0;\n    }\n\n    constructor(@Inject(PLATFORM_ID) private readonly platformId: Object) {}\n\n    ngOnInit() {\n        if (!this.items) return;\n        if (!isPlatformBrowser(this.platformId)) return;\n        if ('requestIdleCallback' in window) {\n            (window as any).requestIdleCallback(() => {\n                this.items?.forEach((item) => {\n                    if (item.image?.url) {\n                        const img = new Image();\n                        img.src = item.image.url;\n                    }\n                });\n            });\n        }\n    }\n}\n\nexport interface SplitPreviewerItemI {\n    title?: string;\n    type?: string;\n    description?: string;\n    tags?: string[];\n    link?: UiLibButtonI;\n    image?: UiLibImageI;\n}\n","<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"],"mappings":";;;;;AAoBA,IAAa,0BAAb,MAAa,wBAAuB;CAYkB;CAXzC;CACA;CACA;CACA,YAA8B;CAEvC,cAAc,OAAgC,QAAU,GAAA,YAAA,CAAA,EAAA,WAAA,cAAA,CAAA,+BAAA,CAAA,CAAA;CAExD,IAAI,QAAK;EACL,OAAO,KAAK,OAAO,UAAU;CACjC;CAEA,YAAkD,YAAkB;EAAlB,KAAA,aAAA;CAAqB;CAEvE,WAAQ;EACJ,IAAI,CAAC,KAAK,OAAO;EACjB,IAAI,CAAC,kBAAkB,KAAK,UAAU,GAAG;EACzC,IAAI,yBAAyB,QACxB,OAAe,0BAAyB;GACrC,KAAK,OAAO,SAAS,SAAQ;IACzB,IAAI,KAAK,OAAO,KAAK;KACjB,MAAM,MAAM,IAAI,MAAK;KACrB,IAAI,MAAM,KAAK,MAAM;IACzB;GACJ,CAAC;EACL,CAAC;CAET;CA3BS,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAuB,MAAA,CAAA,EAAA,OAYZ,YAAW,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAZtB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAuB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;GAAA,OAAA;GAAA,cAAA;GAAA,WAAA;EAAA;EAAA,MAAA,EAAA,gBAAA,oBAAA;EAAA,UAAA;EAAA,UCpBpC;EA4DA,QAAA,CAAA,6+FAAA;EAAA,cAAA;GAAA;IAAA,MAAA;IAAA,MDhDc;GAAY;GAAA;IAAA,MAAA;IAAA,MAAE;IAAiB,UAAA;IAAA,QAAA,CAAA,YAAA,MAAA;IAAA,SAAA,CAAA,eAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAkB,UAAA;IAAA,QAAA,CAAA,aAAA,oBAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAqB,UAAA;IAAA,QAAA,CAAA,YAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAgB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;EAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAQ7F,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAuB,YAAA,CAAA;EAVnC,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAqB,SACtB;IAAC;IAAc;IAAmB;IAAoB;IAAuB;GAAgB;GAAC,iBAGtF,wBAAwB;GAAM,MACzC,EACF,OAAO,oBACV;GAAA,UAAA;GAAA,QAAA,CAAA,6+FAAA;EAAA,CAAA;;;;;GAcY,MAAA;GAAO,MAAA,CAAA,WAAW;;;;E,UAX9B,MAAA,M;E,UACA,MAAA,M;E,iBACA,MAAA,M;E,cACA,MAAA,M"}

package/fesm2022/lluc_llull-ui-lib-content-split-showcase.mjs

@@ -1,38 +1,100 @@
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Input, ChangeDetectionStrategy, Component } from '@angular/core';
-import { ScrollRevealDirective, LinkTypeDirective } from '@lluc_llull/ui-lib/directives';
-import { UiIconComponent } from '@lluc_llull/ui-lib/shared';
-
-class SplitShowcaseComponent {
-    title;
-    subtitle;
-    description;
-    metas;
-    buttons;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitShowcaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    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 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: SplitShowcaseComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-split-showcase', imports: [CommonModule, ScrollRevealDirective, LinkTypeDirective, UiIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        style: 'display: contents',
-                    }, 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"] }]
-        }], propDecorators: { title: [{
-                type: Input
-            }], subtitle: [{
-                type: Input
-            }], description: [{
-                type: Input
-            }], metas: [{
-                type: Input
-            }], buttons: [{
-                type: Input
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import { CommonModule } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
+import { LinkTypeDirective, ScrollRevealDirective } from "@lluc_llull/ui-lib/directives";
+import { UiIconComponent } from "@lluc_llull/ui-lib/shared";
+var SplitShowcaseComponent = class SplitShowcaseComponent {
+	title;
+	subtitle;
+	description;
+	metas;
+	buttons;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.4",
+		ngImport: i0,
+		type: SplitShowcaseComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.4",
+		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
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.4",
+	ngImport: i0,
+	type: SplitShowcaseComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "lib-split-showcase",
+			imports: [
+				CommonModule,
+				ScrollRevealDirective,
+				LinkTypeDirective,
+				UiIconComponent
+			],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { style: "display: contents" },
+			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"]
+		}]
+	}],
+	propDecorators: {
+		title: [{ type: Input }],
+		subtitle: [{ type: Input }],
+		description: [{ type: Input }],
+		metas: [{ type: Input }],
+		buttons: [{ type: Input }]
+	}
+});
 export { SplitShowcaseComponent };
-//# sourceMappingURL=lluc_llull-ui-lib-content-split-showcase.mjs.map
+
+//# sourceMappingURL=lluc_llull-ui-lib-content-split-showcase.mjs.map

package/fesm2022/lluc_llull-ui-lib-content-split-showcase.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lluc_llull-ui-lib-content-split-showcase.mjs","sources":["../../../projects/ui-lib/content/split-showcase/split-showcase.component.ts","../../../projects/ui-lib/content/split-showcase/split-showcase.component.html","../../../projects/ui-lib/content/split-showcase/lluc_llull-ui-lib-content-split-showcase.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\nimport { LinkTypeDirective, ScrollRevealDirective } from '@lluc_llull/ui-lib/directives';\nimport { UiLibButtonI } from '@lluc_llull/ui-lib/interfaces';\nimport { UiIconComponent } from '@lluc_llull/ui-lib/shared';\n\n@Component({\n  selector: 'lib-split-showcase',\n  imports: [CommonModule, ScrollRevealDirective, LinkTypeDirective, UiIconComponent],\n  templateUrl: './split-showcase.component.html',\n  styleUrl: './split-showcase.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n      style: 'display: contents',\n  },\n})\nexport class SplitShowcaseComponent {\n  @Input() title?: string;\n  @Input() subtitle?: string;\n  @Input() description?: string;\n  @Input() metas?: SplitShowcaseMetaItemI[];\n  @Input() buttons?: UiLibButtonI[];\n}\n\nexport interface SplitShowcaseMetaItemI {\n  label: string;\n  value: string;\n}","<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>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAgBa,sBAAsB,CAAA;AACxB,IAAA,KAAK;AACL,IAAA,QAAQ;AACR,IAAA,WAAW;AACX,IAAA,KAAK;AACL,IAAA,OAAO;wGALL,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,mBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EChBnC,k5CA8BM,EAAA,MAAA,EAAA,CAAA,olBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDtBM,YAAY,+BAAE,qBAAqB,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,iBAAiB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,eAAe,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;4FAQtE,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAVlC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,oBAAoB,EAAA,OAAA,EACrB,CAAC,YAAY,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,eAAe,CAAC,EAAA,eAAA,EAGjE,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACF,wBAAA,KAAK,EAAE,mBAAmB;AAC7B,qBAAA,EAAA,QAAA,EAAA,k5CAAA,EAAA,MAAA,EAAA,CAAA,olBAAA,CAAA,EAAA;8BAGQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,OAAO,EAAA,CAAA;sBAAf;;;AErBH;;AAEG;;;;"}
+{"version":3,"file":"lluc_llull-ui-lib-content-split-showcase.mjs","names":[],"sources":["../../../projects/ui-lib/content/split-showcase/split-showcase.component.ts","../../../projects/ui-lib/content/split-showcase/split-showcase.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\nimport { LinkTypeDirective, ScrollRevealDirective } from '@lluc_llull/ui-lib/directives';\nimport { UiLibButtonI } from '@lluc_llull/ui-lib/interfaces';\nimport { UiIconComponent } from '@lluc_llull/ui-lib/shared';\n\n@Component({\n  selector: 'lib-split-showcase',\n  imports: [CommonModule, ScrollRevealDirective, LinkTypeDirective, UiIconComponent],\n  templateUrl: './split-showcase.component.html',\n  styleUrl: './split-showcase.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n      style: 'display: contents',\n  },\n})\nexport class SplitShowcaseComponent {\n  @Input() title?: string;\n  @Input() subtitle?: string;\n  @Input() description?: string;\n  @Input() metas?: SplitShowcaseMetaItemI[];\n  @Input() buttons?: UiLibButtonI[];\n}\n\nexport interface SplitShowcaseMetaItemI {\n  label: string;\n  value: string;\n}","<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>"],"mappings":";;;;;AAgBA,IAAa,yBAAb,MAAa,uBAAsB;CACxB;CACA;CACA;CACA;CACA;CALE,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAsB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAtB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAsB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;GAAA,UAAA;GAAA,aAAA;GAAA,OAAA;GAAA,SAAA;EAAA;EAAA,MAAA,EAAA,gBAAA,oBAAA;EAAA,UAAA;EAAA,UChBnC;EA8BM,QAAA,CAAA,olBAAA;EAAA,cAAA;GAAA;IAAA,MAAA;IAAA,MDtBM;GAAY;GAAA;IAAA,MAAA;IAAA,MAAE;IAAqB,UAAA;IAAA,QAAA,CAAA,YAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAiB,UAAA;IAAA,QAAA,CAAA,YAAA,MAAA;IAAA,SAAA,CAAA,eAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAe,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;IAAA;GAAA;EAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAQtE,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAsB,YAAA,CAAA;EAVlC,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAoB,SACrB;IAAC;IAAc;IAAuB;IAAmB;GAAe;GAAC,iBAGjE,wBAAwB;GAAM,MACzC,EACF,OAAO,oBACV;GAAA,UAAA;GAAA,QAAA,CAAA,olBAAA;EAAA,CAAA;;;E,UAGA,MAAA,M;E,aACA,MAAA,M;E,gBACA,MAAA,M;E,UACA,MAAA,M;E,YACA,MAAA,M"}

package/fesm2022/lluc_llull-ui-lib-content-stacked-rows.mjs

@@ -1,30 +1,62 @@
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Input, ChangeDetectionStrategy, Component } from '@angular/core';
-
-class StackedRowsComponent {
-    title;
-    text;
-    items;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: StackedRowsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    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 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: StackedRowsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-stacked-rows', imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        style: 'display: contents',
-                    }, 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"] }]
-        }], propDecorators: { title: [{
-                type: Input
-            }], text: [{
-                type: Input
-            }], items: [{
-                type: Input
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import { CommonModule } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
+var StackedRowsComponent = class StackedRowsComponent {
+	title;
+	text;
+	items;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.4",
+		ngImport: i0,
+		type: StackedRowsComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.4",
+		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
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.4",
+	ngImport: i0,
+	type: StackedRowsComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "lib-stacked-rows",
+			imports: [CommonModule],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { style: "display: contents" },
+			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"]
+		}]
+	}],
+	propDecorators: {
+		title: [{ type: Input }],
+		text: [{ type: Input }],
+		items: [{ type: Input }]
+	}
+});
 export { StackedRowsComponent };
-//# sourceMappingURL=lluc_llull-ui-lib-content-stacked-rows.mjs.map
+
+//# sourceMappingURL=lluc_llull-ui-lib-content-stacked-rows.mjs.map

package/fesm2022/lluc_llull-ui-lib-content-stacked-rows.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lluc_llull-ui-lib-content-stacked-rows.mjs","sources":["../../../projects/ui-lib/content/stacked-rows/stacked-rows.component.ts","../../../projects/ui-lib/content/stacked-rows/stacked-rows.component.html","../../../projects/ui-lib/content/stacked-rows/lluc_llull-ui-lib-content-stacked-rows.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\n\n@Component({\n    selector: 'lib-stacked-rows',\n    imports: [CommonModule],\n    templateUrl: './stacked-rows.component.html',\n    styleUrl: './stacked-rows.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        style: 'display: contents',\n    },\n})\nexport class StackedRowsComponent {\n    @Input() title?: string;\n    @Input() text?: string;\n    @Input() items?: StackedRowItemI[];\n}\n\nexport interface StackedRowItemI {\n    title: string;\n    text: string;\n}\n","<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","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAaa,oBAAoB,CAAA;AACpB,IAAA,KAAK;AACL,IAAA,IAAI;AACJ,IAAA,KAAK;wGAHL,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAApB,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,mBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECbjC,i+BAiCA,EAAA,MAAA,EAAA,CAAA,2hCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,ED5Bc,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;4FAQb,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAVhC,SAAS;+BACI,kBAAkB,EAAA,OAAA,EACnB,CAAC,YAAY,CAAC,mBAGN,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACF,wBAAA,KAAK,EAAE,mBAAmB;AAC7B,qBAAA,EAAA,QAAA,EAAA,i+BAAA,EAAA,MAAA,EAAA,CAAA,2hCAAA,CAAA,EAAA;8BAGQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,KAAK,EAAA,CAAA;sBAAb;;;AEhBL;;AAEG;;;;"}
+{"version":3,"file":"lluc_llull-ui-lib-content-stacked-rows.mjs","names":[],"sources":["../../../projects/ui-lib/content/stacked-rows/stacked-rows.component.ts","../../../projects/ui-lib/content/stacked-rows/stacked-rows.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core';\n\n@Component({\n    selector: 'lib-stacked-rows',\n    imports: [CommonModule],\n    templateUrl: './stacked-rows.component.html',\n    styleUrl: './stacked-rows.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        style: 'display: contents',\n    },\n})\nexport class StackedRowsComponent {\n    @Input() title?: string;\n    @Input() text?: string;\n    @Input() items?: StackedRowItemI[];\n}\n\nexport interface StackedRowItemI {\n    title: string;\n    text: string;\n}\n","<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"],"mappings":";;;AAaA,IAAa,uBAAb,MAAa,qBAAoB;CACpB;CACA;CACA;CAHA,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAoB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAApB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAoB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;GAAA,MAAA;GAAA,OAAA;EAAA;EAAA,MAAA,EAAA,gBAAA,oBAAA;EAAA,UAAA;EAAA,UCbjC;EAiCA,QAAA,CAAA,2hCAAA;EAAA,cAAA,CAAA;GAAA,MAAA;GAAA,MD5Bc;EAAY,CAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAQb,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAoB,YAAA,CAAA;EAVhC,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAkB,SACnB,CAAC,YAAY;GAAC,iBAGN,wBAAwB;GAAM,MACzC,EACF,OAAO,oBACV;GAAA,UAAA;GAAA,QAAA,CAAA,2hCAAA;EAAA,CAAA;;;E,UAGA,MAAA,M;E,SACA,MAAA,M;E,UACA,MAAA,M"}