@lucca-front/ng 21.2.2 → 21.3.0-rc.1

package/fesm2022/lucca-front-ng-highlight-data.mjs

@@ -2,6 +2,28 @@ import * as i0 from '@angular/core';
 import { inject, input, booleanAttribute, computed, effect, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
 import { LuClass, PortalDirective } from '@lucca-front/ng/core';
 
+/**
+ * Available HighlightDataComponent Types
+ */
+const HIGHLIGHT_DATA_THEME = ['white', 'light', 'dark'];
+const HIGHLIGHT_DATA_PALETTE = ['lucca', 'cleemy', 'timmi', 'poplee', 'coreHR', 'pagga', 'cc', 'success', 'warning', 'critical'];
+const HIGHLIGHT_DATA_SIZE = ['XS', 'S', 'M'];
+const HIGHLIGHT_DATA_BUBBLE = [1, 2, 3, 4];
+const HIGHLIGHT_DATA_ILLUSTRATION = [
+    'calculator',
+    'calendar',
+    'cleemy-card',
+    'coffee',
+    'headphone',
+    'mail',
+    'magnifying-glass',
+    'medallon',
+    'piggy-bank',
+    'polaroid-female',
+    'polaroid-male',
+    'polaroids',
+];
+
 class HighlightDataComponent {
     #luClass;
     get lightClass() {
@@ -15,48 +37,48 @@ class HighlightDataComponent {
         /**
          * The title of the highlight date
          */
-        this.heading = input.required(...(ngDevMode ? [{ debugName: "heading" }] : []));
+        this.heading = input.required(...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
         /**
          * The content of the highlight date
          */
-        this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
         /**
          * Add text below the content
          */
-        this.subText = input(...(ngDevMode ? [undefined, { debugName: "subText" }] : []));
+        this.subText = input(...(ngDevMode ? [undefined, { debugName: "subText" }] : /* istanbul ignore next */ []));
         /**
          * Define a bubble style based on the CDN image bubble number
          */
-        this.bubble = input(...(ngDevMode ? [undefined, { debugName: "bubble" }] : []));
+        this.bubble = input(...(ngDevMode ? [undefined, { debugName: "bubble" }] : /* istanbul ignore next */ []));
         /**
          * Define a specific them white light or dark. (White by default)
          */
-        this.theme = input('white', ...(ngDevMode ? [{ debugName: "theme" }] : []));
+        this.theme = input('white', ...(ngDevMode ? [{ debugName: "theme" }] : /* istanbul ignore next */ []));
         /**
          * Apply product name to illustration URL and CSS component palette
          * This specific palette must be set up on config.scss
          */
-        this.palette = input('lucca', ...(ngDevMode ? [{ debugName: "palette" }] : []));
+        this.palette = input('lucca', ...(ngDevMode ? [{ debugName: "palette" }] : /* istanbul ignore next */ []));
         /**
          * Main illustration
          * An URL can be apply for custom images
          */
-        this.illustration = input(...(ngDevMode ? [undefined, { debugName: "illustration" }] : []));
+        this.illustration = input(...(ngDevMode ? [undefined, { debugName: "illustration" }] : /* istanbul ignore next */ []));
         /**
          * Which size should the highlight data be? XS to medium
          */
-        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
         /**
          * Adjust layout to text value
          */
-        this.valueFirst = input(false, { ...(ngDevMode ? { debugName: "valueFirst" } : {}), transform: booleanAttribute });
+        this.valueFirst = input(false, { ...(ngDevMode ? { debugName: "valueFirst" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         /**
          * Displayed in nested mode
          */
-        this.nested = input(false, { ...(ngDevMode ? { debugName: "nested" } : {}), transform: booleanAttribute });
-        this.illustrationSrc = computed(() => this.illustration().includes('/') ? this.illustration() : `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/generic/${this.illustration()}.svg`, ...(ngDevMode ? [{ debugName: "illustrationSrc" }] : []));
-        this.bubbleSrc = computed(() => `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/${this.palette()}/bubbles-${this.bubbleTheme()}-${this.bubble()}.svg`, ...(ngDevMode ? [{ debugName: "bubbleSrc" }] : []));
-        this.bubbleTheme = computed(() => (this.theme() === 'dark' ? 'dark' : 'light'), ...(ngDevMode ? [{ debugName: "bubbleTheme" }] : []));
+        this.nested = input(false, { ...(ngDevMode ? { debugName: "nested" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.illustrationSrc = computed(() => this.illustration().includes('/') ? this.illustration() : `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/generic/${this.illustration()}.svg`, ...(ngDevMode ? [{ debugName: "illustrationSrc" }] : /* istanbul ignore next */ []));
+        this.bubbleSrc = computed(() => `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/${this.palette()}/bubbles-${this.bubbleTheme()}-${this.bubble()}.svg`, ...(ngDevMode ? [{ debugName: "bubbleSrc" }] : /* istanbul ignore next */ []));
+        this.bubbleTheme = computed(() => (this.theme() === 'dark' ? 'dark' : 'light'), ...(ngDevMode ? [{ debugName: "bubbleTheme" }] : /* istanbul ignore next */ []));
         effect(() => {
             this.#luClass.setState({
                 [`mod-${this.size()}`]: !!this.size(),
@@ -66,10 +88,10 @@ class HighlightDataComponent {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: HighlightDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: HighlightDataComponent, isStandalone: true, selector: "lu-highlight-data", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, subText: { classPropertyName: "subText", publicName: "subText", isSignal: true, isRequired: false, transformFunction: null }, bubble: { classPropertyName: "bubble", publicName: "bubble", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, valueFirst: { classPropertyName: "valueFirst", publicName: "valueFirst", isSignal: true, isRequired: false, transformFunction: null }, nested: { classPropertyName: "nested", publicName: "nested", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-light": "lightClass", "class.mod-dark": "darkClass" }, classAttribute: "highlightData" }, providers: [LuClass], ngImport: i0, template: "<dl class=\"highlightData-content\">\n\t<dt class=\"highlightData-content-title\"><ng-container *luPortal=\"heading()\" /></dt>\n\t<dd class=\"highlightData-content-value\"><ng-container *luPortal=\"value()\" /></dd>\n\t@if (subText()) {\n\t\t<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content /></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n\t<div class=\"highlightData-illustrations\">\n\t\t@if (bubble()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t\t}\n\t\t@if (illustration()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t\t}\n\t</div>\n}\n", styles: ["@layer components{.highlightData{--components-highlightData-display: grid;--components-highlightData-grid: \"title   action\" \"value   action\" \"subtext action\";--components-highlightData-alignItem: center;--components-highlightData-background: var(--pr-t-elevation-surface-raised);--components-highlightData-padding-inline: var(--pr-t-spacings-200);--components-highlightData-padding-block: var(--pr-t-spacings-150);--components-highlightData-padding: var(--components-highlightData-padding-block) var(--components-highlightData-padding-inline);--components-highlightData-gap: var(--components-highlightData-padding-inline);--components-highlightData-borderRadius: var(--pr-t-border-radius-structure);--components-highlightData-title-color: var(--palettes-neutral-200);--components-highlightData-value-font: var(--pr-t-font-highlight-XXL);--components-highlightData-value-order: 0;--components-highlightData-action-padding: 0;--components-highlightData-illustrations-width: 86px;--components-highlightData-illustrations-height: 72px;--components-highlightData-illustrations-display: grid;display:block;background-color:var(--components-highlightData-background);border-radius:var(--components-highlightData-borderRadius);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0}.highlightData-content>dd,.highlightData-content>div>dd{margin:0}.highlightData-content{display:var(--components-highlightData-display);grid-template-columns:1fr auto;grid-template-areas:var(--components-highlightData-grid);align-items:var(--components-highlightData-alignItem);flex-direction:column;column-gap:var(--components-highlightData-gap)}.highlightData-content-title{grid-area:title;font:var(--pr-t-font-body-S);color:var(--pr-t-color-text-subtle)}.highlightData-content-value{grid-area:value;font:var(--components-highlightData-value-font);order:var(--components-highlightData-value-order);color:var(--pr-t-color-text-heading)}.highlightData-content-subText{grid-area:subtext;font:var(--pr-t-font-body-XS);color:var(--pr-t-color-text-subtle);margin-block-start:var(--pr-t-spacings-100)!important}.highlightData-content-action{grid-area:action;padding-block-start:var(--components-highlightData-action-padding)}.highlightData-content-action:empty{display:none}.highlightData-content-action .link{--commons-text-link-color: var(--palettes-700, var(--palettes-product-700));--commons-text-link-hover: var(--palettes-800, var(--palettes-product-800))}.highlightData-content-action .button{--palettes-text: var(--palettes-neutral-text);--palettes-0: var(--palettes-neutral-0);--palettes-25: var(--palettes-neutral-25);--palettes-50: var(--palettes-neutral-50);--palettes-100: var(--palettes-neutral-100);--palettes-200: var(--palettes-neutral-200);--palettes-300: var(--palettes-neutral-300);--palettes-400: var(--palettes-neutral-400);--palettes-500: var(--palettes-neutral-500);--palettes-600: var(--palettes-neutral-600);--palettes-700: var(--palettes-neutral-700);--palettes-800: var(--palettes-neutral-800);--palettes-900: var(--palettes-neutral-900)}.highlightData-illustrations{display:var(--components-highlightData-illustrations-display);place-content:center;position:absolute;inset-block-end:0;inset-inline-end:0}.highlightData-illustrations-back,.highlightData-illustrations-front{grid-area:1/1;block-size:var(--components-highlightData-illustrations-height);inline-size:var(--components-highlightData-illustrations-width)}}@layer mods{.highlightData.mod-light{--components-highlightData-background: var(--palettes-50, var(--palettes-product-50))}.highlightData.mod-dark{--components-highlightData-background: var(--palettes-100, var(--palettes-product-100))}.highlightData.mod-valueFirst{--components-highlightData-grid: \"value   action\" \"title   action\" \"subtext action\"}.highlightData.mod-S{--components-highlightData-value-font: var(--pr-t-font-highlight-XL);--components-highlightData-illustrations-width: 82px;--components-highlightData-illustrations-height: 68px}.highlightData.mod-XS{--components-highlightData-value-font: var(--pr-t-font-highlight-L);--components-highlightData-illustrations-width: 77px;--components-highlightData-illustrations-height: 64px}.highlightData.mod-nested{--components-highlightData-borderRadius: var(--pr-t-border-radius-default)}.highlightData:has(.highlightData-illustrations){--components-highlightData-display: flex;--components-highlightData-alignItem: start;--components-highlightData-action-padding: var(--pr-t-spacings-100);padding-inline-end:calc(var(--components-highlightData-illustrations-width) + var(--components-highlightData-padding-inline))}.highlightData:has(.highlightData-illustrations).mod-valueFirst{--components-highlightData-value-order: -1}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: HighlightDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: HighlightDataComponent, isStandalone: true, selector: "lu-highlight-data", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, subText: { classPropertyName: "subText", publicName: "subText", isSignal: true, isRequired: false, transformFunction: null }, bubble: { classPropertyName: "bubble", publicName: "bubble", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, illustration: { classPropertyName: "illustration", publicName: "illustration", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, valueFirst: { classPropertyName: "valueFirst", publicName: "valueFirst", isSignal: true, isRequired: false, transformFunction: null }, nested: { classPropertyName: "nested", publicName: "nested", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mod-light": "lightClass", "class.mod-dark": "darkClass" }, classAttribute: "highlightData" }, providers: [LuClass], ngImport: i0, template: "<dl class=\"highlightData-content\">\n\t<dt class=\"highlightData-content-title\"><ng-container *luPortal=\"heading()\" /></dt>\n\t<dd class=\"highlightData-content-value\"><ng-container *luPortal=\"value()\" /></dd>\n\t@if (subText()) {\n\t\t<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content /></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n\t<div class=\"highlightData-illustrations\">\n\t\t@if (bubble()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t\t}\n\t\t@if (illustration()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t\t}\n\t</div>\n}\n", styles: ["@layer components{.highlightData{--components-highlightData-display: grid;--components-highlightData-grid: \"title   action\" \"value   action\" \"subtext action\";--components-highlightData-alignItem: center;--components-highlightData-background: var(--pr-t-elevation-surface-raised);--components-highlightData-padding-inline: var(--pr-t-spacings-200);--components-highlightData-padding-block: var(--pr-t-spacings-150);--components-highlightData-padding: var(--components-highlightData-padding-block) var(--components-highlightData-padding-inline);--components-highlightData-gap: var(--components-highlightData-padding-inline);--components-highlightData-borderRadius: var(--pr-t-border-radius-structure);--components-highlightData-title-color: var(--palettes-neutral-200);--components-highlightData-value-font: var(--pr-t-font-highlight-XXL);--components-highlightData-value-order: 0;--components-highlightData-action-padding: 0;--components-highlightData-illustrations-width: 86px;--components-highlightData-illustrations-height: 72px;--components-highlightData-illustrations-display: grid;display:block;background-color:var(--components-highlightData-background);border-radius:var(--components-highlightData-borderRadius);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0}.highlightData-content>dd,.highlightData-content>div>dd{margin:0}.highlightData-content{display:var(--components-highlightData-display);grid-template-columns:1fr auto;grid-template-areas:var(--components-highlightData-grid);align-items:var(--components-highlightData-alignItem);flex-direction:column;column-gap:var(--components-highlightData-gap)}.highlightData-content-title{grid-area:title;font:var(--pr-t-font-body-S);color:var(--pr-t-color-text-subtle)}.highlightData-content-value{grid-area:value;font:var(--components-highlightData-value-font);order:var(--components-highlightData-value-order);color:var(--pr-t-color-text-heading)}.highlightData-content-subText{grid-area:subtext;font:var(--pr-t-font-body-XS);color:var(--pr-t-color-text-subtle);margin-block-start:var(--pr-t-spacings-100)!important}.highlightData-content-action{grid-area:action;padding-block-start:var(--components-highlightData-action-padding)}.highlightData-content-action:empty{display:none}.highlightData-content-action .link{--commons-text-link-color: var(--palettes-700, var(--palettes-product-700));--commons-text-link-hover: var(--palettes-800, var(--palettes-product-800))}.highlightData-content-action .button{--palettes-text: var(--palettes-neutral-text);--palettes-0: var(--palettes-neutral-0);--palettes-25: var(--palettes-neutral-25);--palettes-50: var(--palettes-neutral-50);--palettes-100: var(--palettes-neutral-100);--palettes-200: var(--palettes-neutral-200);--palettes-300: var(--palettes-neutral-300);--palettes-400: var(--palettes-neutral-400);--palettes-500: var(--palettes-neutral-500);--palettes-600: var(--palettes-neutral-600);--palettes-700: var(--palettes-neutral-700);--palettes-800: var(--palettes-neutral-800);--palettes-900: var(--palettes-neutral-900)}.highlightData-illustrations{display:var(--components-highlightData-illustrations-display);place-content:center;position:absolute;inset-block-end:0;inset-inline-end:0}.highlightData-illustrations-back,.highlightData-illustrations-front{grid-area:1/1;block-size:var(--components-highlightData-illustrations-height);inline-size:var(--components-highlightData-illustrations-width)}}@layer mods{.highlightData.mod-light{--components-highlightData-background: var(--palettes-50, var(--palettes-product-50))}.highlightData.mod-dark{--components-highlightData-background: var(--palettes-100, var(--palettes-product-100))}.highlightData.mod-valueFirst{--components-highlightData-grid: \"value   action\" \"title   action\" \"subtext action\"}.highlightData.mod-S{--components-highlightData-value-font: var(--pr-t-font-highlight-XL);--components-highlightData-illustrations-width: 82px;--components-highlightData-illustrations-height: 68px}.highlightData.mod-XS{--components-highlightData-value-font: var(--pr-t-font-highlight-L);--components-highlightData-illustrations-width: 77px;--components-highlightData-illustrations-height: 64px}.highlightData.mod-nested{--components-highlightData-borderRadius: var(--pr-t-border-radius-default)}.highlightData:has(.highlightData-illustrations){--components-highlightData-display: flex;--components-highlightData-alignItem: start;--components-highlightData-action-padding: var(--pr-t-spacings-100);padding-inline-end:calc(var(--components-highlightData-illustrations-width) + var(--components-highlightData-padding-inline))}.highlightData:has(.highlightData-illustrations).mod-valueFirst{--components-highlightData-value-order: -1}}\n"], dependencies: [{ kind: "directive", type: PortalDirective, selector: "[luPortal]", inputs: ["luPortal", "luPortalContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: HighlightDataComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: HighlightDataComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lu-highlight-data', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [PortalDirective], providers: [LuClass], host: {
                         class: 'highlightData',
@@ -82,5 +104,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { HighlightDataComponent };
+export { HIGHLIGHT_DATA_BUBBLE, HIGHLIGHT_DATA_ILLUSTRATION, HIGHLIGHT_DATA_PALETTE, HIGHLIGHT_DATA_SIZE, HIGHLIGHT_DATA_THEME, HighlightDataComponent };
 //# sourceMappingURL=lucca-front-ng-highlight-data.mjs.map

package/fesm2022/lucca-front-ng-highlight-data.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lucca-front-ng-highlight-data.mjs","sources":["../../../packages/ng/highlight-data/highlight-data.component.ts","../../../packages/ng/highlight-data/highlight-data.component.html","../../../packages/ng/highlight-data/lucca-front-ng-highlight-data.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, computed, effect, inject, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass, PortalContent, PortalDirective } from '@lucca-front/ng/core';\n\ntype IllustrationType =\n\t| 'calculator'\n\t| 'calendar'\n\t| 'cleemy-card'\n\t| 'coffee'\n\t| 'headphone'\n\t| 'mail'\n\t| 'magnifying-glass'\n\t/** @deprecated use 'magnifying-glass' instead */\n\t| 'manifying-glass'\n\t| 'medallon'\n\t| 'piggy-bank'\n\t| 'polaroid-female'\n\t| 'polaroid-male'\n\t| 'polaroids'\n\t| string;\n\n@Component({\n\tselector: 'lu-highlight-data',\n\ttemplateUrl: './highlight-data.component.html',\n\tstyleUrl: './highlight-data.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\timports: [PortalDirective],\n\tproviders: [LuClass],\n\thost: {\n\t\tclass: 'highlightData',\n\t\t'[class.mod-light]': 'lightClass',\n\t\t'[class.mod-dark]': 'darkClass',\n\t},\n})\nexport class HighlightDataComponent {\n\t#luClass = inject(LuClass);\n\n\t/**\n\t * The title of the highlight date\n\t */\n\treadonly heading = input.required<PortalContent>();\n\n\t/**\n\t * The content of the highlight date\n\t */\n\treadonly value = input.required<PortalContent>();\n\n\t/**\n\t * Add text below the content\n\t */\n\treadonly subText = input<PortalContent>();\n\n\t/**\n\t * Define a bubble style based on the CDN image bubble number\n\t */\n\treadonly bubble = input<1 | 2 | 3 | 4 | number>();\n\n\t/**\n\t * Define a specific them white light or dark. (White by default)\n\t */\n\treadonly theme = input<'white' | 'light' | 'dark'>('white');\n\n\t/**\n\t * Apply product name to illustration URL and CSS component palette\n\t * This specific palette must be set up on config.scss\n\t */\n\treadonly palette = input<'lucca' | 'cleemy' | 'timmi' | 'poplee' | 'coreHR' | 'pagga' | 'cc' | 'success' | 'warning' | 'critical' | string>('lucca');\n\n\t/**\n\t * Main illustration\n\t * An URL can be apply for custom images\n\t */\n\treadonly illustration = input<IllustrationType>();\n\n\t/**\n\t * Which size should the highlight data be? XS to medium\n\t */\n\treadonly size = input<'XS' | 'S' | 'M' | null>(null);\n\n\t/**\n\t * Adjust layout to text value\n\t */\n\treadonly valueFirst = input(false, { transform: booleanAttribute });\n\n\t/**\n\t * Displayed in nested mode\n\t */\n\treadonly nested = input(false, { transform: booleanAttribute });\n\n\tget lightClass() {\n\t\treturn this.theme() === 'light';\n\t}\n\n\tget darkClass() {\n\t\treturn this.theme() === 'dark';\n\t}\n\n\treadonly illustrationSrc = computed(() =>\n\t\tthis.illustration().includes('/') ? this.illustration() : `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/generic/${this.illustration()}.svg`,\n\t);\n\n\treadonly bubbleSrc = computed(() => `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/${this.palette()}/bubbles-${this.bubbleTheme()}-${this.bubble()}.svg`);\n\n\treadonly bubbleTheme = computed(() => (this.theme() === 'dark' ? 'dark' : 'light'));\n\n\tconstructor() {\n\t\teffect(() => {\n\t\t\tthis.#luClass.setState({\n\t\t\t\t[`mod-${this.size()}`]: !!this.size(),\n\t\t\t\t'mod-valueFirst': this.valueFirst(),\n\t\t\t\t'mod-nested': this.nested(),\n\t\t\t\t[`palette-${this.palette()}`]: !!this.palette(),\n\t\t\t});\n\t\t});\n\t}\n}\n","<dl class=\"highlightData-content\">\n\t<dt class=\"highlightData-content-title\"><ng-container *luPortal=\"heading()\" /></dt>\n\t<dd class=\"highlightData-content-value\"><ng-container *luPortal=\"value()\" /></dd>\n\t@if (subText()) {\n\t\t<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content /></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n\t<div class=\"highlightData-illustrations\">\n\t\t@if (bubble()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t\t}\n\t\t@if (illustration()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t\t}\n\t</div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"lucca-front-ng-highlight-data.mjs","sources":["../../../packages/ng/highlight-data/highlight-data.type.ts","../../../packages/ng/highlight-data/highlight-data.component.ts","../../../packages/ng/highlight-data/highlight-data.component.html","../../../packages/ng/highlight-data/lucca-front-ng-highlight-data.ts"],"sourcesContent":["/**\n * Available HighlightDataComponent Types\n */\n\nexport const HIGHLIGHT_DATA_THEME = ['white', 'light', 'dark'] as const;\nexport type HighlightDataTheme = (typeof HIGHLIGHT_DATA_THEME)[number];\n\nexport const HIGHLIGHT_DATA_PALETTE = ['lucca', 'cleemy', 'timmi', 'poplee', 'coreHR', 'pagga', 'cc', 'success', 'warning', 'critical'] as const;\nexport type HighlightDataPalette = (typeof HIGHLIGHT_DATA_PALETTE)[number];\n\nexport const HIGHLIGHT_DATA_SIZE = ['XS', 'S', 'M'] as const;\nexport type HighlightDataSize = (typeof HIGHLIGHT_DATA_SIZE)[number];\n\nexport const HIGHLIGHT_DATA_BUBBLE = [1, 2, 3, 4] as const;\nexport type HighlightDataBubble = (typeof HIGHLIGHT_DATA_BUBBLE)[number];\n\nexport const HIGHLIGHT_DATA_ILLUSTRATION = [\n\t'calculator',\n\t'calendar',\n\t'cleemy-card',\n\t'coffee',\n\t'headphone',\n\t'mail',\n\t'magnifying-glass',\n\t'medallon',\n\t'piggy-bank',\n\t'polaroid-female',\n\t'polaroid-male',\n\t'polaroids',\n] as const;\nexport type HighlightDataIllustration = (typeof HIGHLIGHT_DATA_ILLUSTRATION)[number] | 'manifying-glass';\n","import { booleanAttribute, ChangeDetectionStrategy, Component, computed, effect, inject, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass, PortalContent, PortalDirective } from '@lucca-front/ng/core';\nimport { HighlightDataBubble, HighlightDataIllustration, HighlightDataPalette, HighlightDataSize, HighlightDataTheme } from './highlight-data.type';\n\n@Component({\n\tselector: 'lu-highlight-data',\n\ttemplateUrl: './highlight-data.component.html',\n\tstyleUrl: './highlight-data.component.scss',\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\timports: [PortalDirective],\n\tproviders: [LuClass],\n\thost: {\n\t\tclass: 'highlightData',\n\t\t'[class.mod-light]': 'lightClass',\n\t\t'[class.mod-dark]': 'darkClass',\n\t},\n})\nexport class HighlightDataComponent {\n\t#luClass = inject(LuClass);\n\n\t/**\n\t * The title of the highlight date\n\t */\n\treadonly heading = input.required<PortalContent>();\n\n\t/**\n\t * The content of the highlight date\n\t */\n\treadonly value = input.required<PortalContent>();\n\n\t/**\n\t * Add text below the content\n\t */\n\treadonly subText = input<PortalContent>();\n\n\t/**\n\t * Define a bubble style based on the CDN image bubble number\n\t */\n\treadonly bubble = input<HighlightDataBubble | number>();\n\n\t/**\n\t * Define a specific them white light or dark. (White by default)\n\t */\n\treadonly theme = input<HighlightDataTheme>('white');\n\n\t/**\n\t * Apply product name to illustration URL and CSS component palette\n\t * This specific palette must be set up on config.scss\n\t */\n\treadonly palette = input<HighlightDataPalette | string>('lucca');\n\n\t/**\n\t * Main illustration\n\t * An URL can be apply for custom images\n\t */\n\treadonly illustration = input<HighlightDataIllustration | string>();\n\n\t/**\n\t * Which size should the highlight data be? XS to medium\n\t */\n\treadonly size = input<HighlightDataSize | null>(null);\n\n\t/**\n\t * Adjust layout to text value\n\t */\n\treadonly valueFirst = input(false, { transform: booleanAttribute });\n\n\t/**\n\t * Displayed in nested mode\n\t */\n\treadonly nested = input(false, { transform: booleanAttribute });\n\n\tget lightClass() {\n\t\treturn this.theme() === 'light';\n\t}\n\n\tget darkClass() {\n\t\treturn this.theme() === 'dark';\n\t}\n\n\treadonly illustrationSrc = computed(() =>\n\t\tthis.illustration().includes('/') ? this.illustration() : `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/generic/${this.illustration()}.svg`,\n\t);\n\n\treadonly bubbleSrc = computed(() => `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/${this.palette()}/bubbles-${this.bubbleTheme()}-${this.bubble()}.svg`);\n\n\treadonly bubbleTheme = computed(() => (this.theme() === 'dark' ? 'dark' : 'light'));\n\n\tconstructor() {\n\t\teffect(() => {\n\t\t\tthis.#luClass.setState({\n\t\t\t\t[`mod-${this.size()}`]: !!this.size(),\n\t\t\t\t'mod-valueFirst': this.valueFirst(),\n\t\t\t\t'mod-nested': this.nested(),\n\t\t\t\t[`palette-${this.palette()}`]: !!this.palette(),\n\t\t\t});\n\t\t});\n\t}\n}\n","<dl class=\"highlightData-content\">\n\t<dt class=\"highlightData-content-title\"><ng-container *luPortal=\"heading()\" /></dt>\n\t<dd class=\"highlightData-content-value\"><ng-container *luPortal=\"value()\" /></dd>\n\t@if (subText()) {\n\t\t<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content /></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n\t<div class=\"highlightData-illustrations\">\n\t\t@if (bubble()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t\t}\n\t\t@if (illustration()) {\n\t\t\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t\t}\n\t</div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/lucca-front-ng-highlight-text.mjs

@@ -0,0 +1,26 @@
+import * as i0 from '@angular/core';
+import { input, computed, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+
+class HighlightComponent {
+    constructor() {
+        this.palette = input('product', ...(ngDevMode ? [{ debugName: "palette" }] : /* istanbul ignore next */ []));
+        this.paletteClass = computed(() => ({ [`palette-${this.palette()}`]: !!this.palette() }), ...(ngDevMode ? [{ debugName: "paletteClass" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: HighlightComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.15", type: HighlightComponent, isStandalone: true, selector: "lu-highlight-text", inputs: { palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "strong" }, properties: { "class": "paletteClass()" }, classAttribute: "highlightText" }, ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer components{.highlightText{--components-highlightText-backgroundColor: var(--palettes-300, var(--palettes-product-300));--components-highlightText-backgroundDiameter: .25em;--components-highlightText-backgroundBlockSize: .5em;--components-highlightText-backgroundRadius: calc(var(--components-highlightText-backgroundDiameter) / 2);--components-highlightText-backgroundStart: var(--components-highlightText-backgroundRadius);--components-highlightText-backgroundEnd: calc(100% - var(--components-highlightText-backgroundRadius));padding-inline:.125em;margin-inline:-.125em;background-repeat:no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone;font-weight:inherit;background-image:linear-gradient(var(--components-highlightText-backgroundColor)),linear-gradient(var(--components-highlightText-backgroundColor)),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%);background-size:100% calc(var(--components-highlightText-backgroundBlockSize) - var(--components-highlightText-backgroundDiameter)),calc(100% - var(--components-highlightText-backgroundDiameter)) var(--components-highlightText-backgroundBlockSize),100% 100%,100% 100%,100% 100%,100% 100%;background-position:50% calc(100% - var(--components-highlightText-backgroundRadius)),50% 100%,0 0,0 0,0 0,0 0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: HighlightComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lu-highlight-text', template: '<ng-content />', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        role: 'strong',
+                        class: 'highlightText',
+                        '[class]': 'paletteClass()',
+                    }, styles: ["@layer components{.highlightText{--components-highlightText-backgroundColor: var(--palettes-300, var(--palettes-product-300));--components-highlightText-backgroundDiameter: .25em;--components-highlightText-backgroundBlockSize: .5em;--components-highlightText-backgroundRadius: calc(var(--components-highlightText-backgroundDiameter) / 2);--components-highlightText-backgroundStart: var(--components-highlightText-backgroundRadius);--components-highlightText-backgroundEnd: calc(100% - var(--components-highlightText-backgroundRadius));padding-inline:.125em;margin-inline:-.125em;background-repeat:no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone;font-weight:inherit;background-image:linear-gradient(var(--components-highlightText-backgroundColor)),linear-gradient(var(--components-highlightText-backgroundColor)),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) var(--components-highlightText-backgroundEnd),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundStart) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%),radial-gradient(var(--components-highlightText-backgroundDiameter) circle at var(--components-highlightText-backgroundEnd) calc(100% - var(--components-highlightText-backgroundBlockSize) + var(--components-highlightText-backgroundRadius)),var(--components-highlightText-backgroundColor) calc(50% - 1px),transparent 50%);background-size:100% calc(var(--components-highlightText-backgroundBlockSize) - var(--components-highlightText-backgroundDiameter)),calc(100% - var(--components-highlightText-backgroundDiameter)) var(--components-highlightText-backgroundBlockSize),100% 100%,100% 100%,100% 100%,100% 100%;background-position:50% calc(100% - var(--components-highlightText-backgroundRadius)),50% 100%,0 0,0 0,0 0,0 0}}\n"] }]
+        }], propDecorators: { palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { HighlightComponent };
+//# sourceMappingURL=lucca-front-ng-highlight-text.mjs.map

package/fesm2022/lucca-front-ng-highlight-text.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"lucca-front-ng-highlight-text.mjs","sources":["../../../packages/ng/highlight-text/highlight-text.component.ts","../../../packages/ng/highlight-text/lucca-front-ng-highlight-text.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from '@angular/core';\nimport { DecorativePalette, Palette } from '@lucca/prisme/core';\n\n@Component({\n\tselector: 'lu-highlight-text',\n\ttemplate: '<ng-content />',\n\tstyleUrl: './highlight-text.component.scss',\n\tencapsulation: ViewEncapsulation.None,\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\thost: {\n\t\trole: 'strong',\n\t\tclass: 'highlightText',\n\t\t'[class]': 'paletteClass()',\n\t},\n})\nexport class HighlightComponent {\n\treadonly palette = input<Palette | DecorativePalette>('product');\n\treadonly paletteClass = computed(() => ({ [`palette-${this.palette()}`]: !!this.palette() }));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAea,kBAAkB,CAAA;AAZ/B,IAAA,WAAA,GAAA;AAaU,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAA8B,SAAS,8EAAC;QACvD,IAAA,CAAA,YAAY,GAAG,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAA,QAAA,EAAW,IAAI,CAAC,OAAO,EAAE,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,cAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AAC7F,IAAA;+GAHY,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,+UAVpB,gBAAgB,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,g1EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAUd,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAZ9B,SAAS;+BACC,mBAAmB,EAAA,QAAA,EACnB,gBAAgB,EAAA,aAAA,EAEX,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACL,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,KAAK,EAAE,eAAe;AACtB,wBAAA,SAAS,EAAE,gBAAgB;AAC3B,qBAAA,EAAA,MAAA,EAAA,CAAA,g1EAAA,CAAA,EAAA;;;ACbF;;AAEG;;;;"}