@lucca-front/ng 19.3.3-rc.6 → 19.3.3-rc.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -56,13 +56,13 @@ class HighlightDataComponent {
|
|
|
56
56
|
});
|
|
57
57
|
}
|
|
58
58
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: HighlightDataComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
59
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", 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 } }, host: { properties: { "class.mod-light": "this.lightClass", "class.mod-dark": "this.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<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content></ng-content></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n<div class=\"highlightData-illustrations\">\n\t@if (bubble()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t} @if (illustration()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n}\n", styles: [".highlightData{--components-highlightData-display: grid;--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-title-color: var(--palettes-neutral-200);--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(--commons-borderRadius-L);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0;display:var(--components-highlightData-display);grid-template-columns:1fr auto;grid-template-areas
|
|
59
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", 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 } }, host: { properties: { "class.mod-light": "this.lightClass", "class.mod-dark": "this.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<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content></ng-content></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n<div class=\"highlightData-illustrations\">\n\t@if (bubble()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t} @if (illustration()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n}\n", styles: [".highlightData{--components-highlightData-display: grid;--components-highlightData-grid: \"title action\" \"value 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-title-color: var(--palettes-neutral-200);--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(--commons-borderRadius-L);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0;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>dd,.highlightData-content>div>dd{margin:0}.highlightData-content-title{grid-area:title;font-size:var(--sizes-S-fontSize);line-height:var(--sizes-S-lineHeight);color:var(--palettes-neutral-700)}.highlightData-content-value{grid-area:value;margin-block-start:0;color:var(--palettes-neutral-900);text-rendering:geometricPrecision;text-wrap:pretty;font-weight:var(--components-title-weight, 600);font-size:var(--sizes-fontSize);line-height:var(--sizes-lineHeight);margin-block-end:0;padding:0;--sizes-verticalPadding: var(--sizes-XXL-verticalPadding);--sizes-fontSize: var(--sizes-XXL-fontSize);--sizes-lineHeight: var(--sizes-XXL-lineHeight);--components-title-weight: 900;order:var(--components-highlightData-value-order)}.highlightData-content-subText{font-size:var(--sizes-XS-fontSize);line-height:var(--sizes-XS-lineHeight);color:var(--palettes-neutral-700);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)}.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\"}.highlightData.mod-S{--components-highlightData-illustrations-width: 82px;--components-highlightData-illustrations-height: 68px}.highlightData.mod-S .highlightData-content-value{--sizes-verticalPadding: var(--sizes-XL-verticalPadding);--sizes-fontSize: var(--sizes-XL-fontSize);--sizes-lineHeight: var(--sizes-XL-lineHeight);--components-title-weight: 700}.highlightData.mod-XS{--components-highlightData-illustrations-width: 77px;--components-highlightData-illustrations-height: 64px}.highlightData.mod-XS .highlightData-content-value{--sizes-verticalPadding: var(--sizes-L-verticalPadding);--sizes-fontSize: var(--sizes-L-fontSize);--sizes-lineHeight: var(--sizes-L-lineHeight);--components-title-weight: 700}.highlightData:has(.highlightData-illustrations){--components-highlightData-display: flex;--components-highlightData-alignItem: start;--components-highlightData-action-padding: var(--pr-t-spacings-150);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 }); }
|
|
60
60
|
}
|
|
61
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: HighlightDataComponent, decorators: [{
|
|
62
62
|
type: Component,
|
|
63
63
|
args: [{ selector: 'lu-highlight-data', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [LuClass], host: {
|
|
64
64
|
class: 'highlightData',
|
|
65
|
-
}, imports: [PortalDirective], 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<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content></ng-content></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n<div class=\"highlightData-illustrations\">\n\t@if (bubble()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t} @if (illustration()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n}\n", styles: [".highlightData{--components-highlightData-display: grid;--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-title-color: var(--palettes-neutral-200);--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(--commons-borderRadius-L);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0;display:var(--components-highlightData-display);grid-template-columns:1fr auto;grid-template-areas
|
|
65
|
+
}, imports: [PortalDirective], 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<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content></ng-content></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n<div class=\"highlightData-illustrations\">\n\t@if (bubble()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t} @if (illustration()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n}\n", styles: [".highlightData{--components-highlightData-display: grid;--components-highlightData-grid: \"title action\" \"value 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-title-color: var(--palettes-neutral-200);--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(--commons-borderRadius-L);overflow:hidden;padding:var(--components-highlightData-padding);position:relative}.highlightData-content{margin:0;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>dd,.highlightData-content>div>dd{margin:0}.highlightData-content-title{grid-area:title;font-size:var(--sizes-S-fontSize);line-height:var(--sizes-S-lineHeight);color:var(--palettes-neutral-700)}.highlightData-content-value{grid-area:value;margin-block-start:0;color:var(--palettes-neutral-900);text-rendering:geometricPrecision;text-wrap:pretty;font-weight:var(--components-title-weight, 600);font-size:var(--sizes-fontSize);line-height:var(--sizes-lineHeight);margin-block-end:0;padding:0;--sizes-verticalPadding: var(--sizes-XXL-verticalPadding);--sizes-fontSize: var(--sizes-XXL-fontSize);--sizes-lineHeight: var(--sizes-XXL-lineHeight);--components-title-weight: 900;order:var(--components-highlightData-value-order)}.highlightData-content-subText{font-size:var(--sizes-XS-fontSize);line-height:var(--sizes-XS-lineHeight);color:var(--palettes-neutral-700);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)}.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\"}.highlightData.mod-S{--components-highlightData-illustrations-width: 82px;--components-highlightData-illustrations-height: 68px}.highlightData.mod-S .highlightData-content-value{--sizes-verticalPadding: var(--sizes-XL-verticalPadding);--sizes-fontSize: var(--sizes-XL-fontSize);--sizes-lineHeight: var(--sizes-XL-lineHeight);--components-title-weight: 700}.highlightData.mod-XS{--components-highlightData-illustrations-width: 77px;--components-highlightData-illustrations-height: 64px}.highlightData.mod-XS .highlightData-content-value{--sizes-verticalPadding: var(--sizes-L-verticalPadding);--sizes-fontSize: var(--sizes-L-fontSize);--sizes-lineHeight: var(--sizes-L-lineHeight);--components-title-weight: 700}.highlightData:has(.highlightData-illustrations){--components-highlightData-display: flex;--components-highlightData-alignItem: start;--components-highlightData-action-padding: var(--pr-t-spacings-150);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"] }]
|
|
66
66
|
}], ctorParameters: () => [], propDecorators: { lightClass: [{
|
|
67
67
|
type: HostBinding,
|
|
68
68
|
args: ['class.mod-light']
|
|
@@ -1 +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, HostBinding, inject, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass, PortalContent, PortalDirective } from '@lucca-front/ng/core';\n\n@Component({\n\tselector: 'lu-highlight-data',\n\tstandalone: true,\n\ttemplateUrl: './highlight-data.component.html',\n\tstyleUrls: ['./highlight-data.component.scss'],\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\tproviders: [LuClass],\n\thost: {\n\t\tclass: 'highlightData',\n\t},\n\timports: [PortalDirective],\n})\nexport class HighlightDataComponent {\n\t#luClass = inject(LuClass);\n\theading = input.required<PortalContent>();\n\tvalue = input.required<PortalContent>();\n\tsubText = input<PortalContent>();\n\tbubble = input<1 | 2 | 3 | 4 | number>();\n\tbubbleSrc = computed(() => {\n\t\treturn `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/${this.palette()}/bubbles-${this.bubbleTheme()}-${this.bubble()}.svg`;\n\t});\n\ttheme = input<'white' | 'light' | 'dark'>('white');\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\tpalette = input<'lucca' | 'cleemy' | 'timmi' | 'poplee' | 'coreHR' | 'pagga' | 'cc' | 'success' | 'warning' | 'critical' | string>('lucca');\n\n\tbubbleTheme = computed(() => {\n\t\tif (this.theme() === 'dark') {\n\t\t\treturn 'dark';\n\t\t}\n\t\treturn 'light';\n\t});\n\n\t@HostBinding('class.mod-light')\n\tget lightClass() {\n\t\treturn this.theme() === 'light';\n\t}\n\n\t@HostBinding('class.mod-dark')\n\tget darkClass() {\n\t\treturn this.theme() === 'dark';\n\t}\n\n\t/**\n\t * Main illustration\n\t * An URL can be apply for custom images\n\t */\n\tillustration = input<\n\t\t'calculator' | 'calendar' | 'cleemy-card' | 'coffee' | 'headphone' | 'mail' | 'manifying-glass' | 'medallon' | 'piggy-bank' | 'polaroid-female' | 'polaroid-male' | 'polaroids' | string\n\t>();\n\tillustrationSrc = computed(() => {\n\t\tif (this.illustration().includes('/')) {\n\t\t\treturn this.illustration();\n\t\t}\n\t\treturn `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/generic/${this.illustration()}.svg`;\n\t});\n\tsize = input<'XS' | 'S' | 'M' | null>(null);\n\t/**\n\t * Adjust layout to text value\n\t */\n\tvalueFirst = input(false, { transform: booleanAttribute });\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[`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<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content></ng-content></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n<div class=\"highlightData-illustrations\">\n\t@if (bubble()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t} @if (illustration()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAgBa,sBAAsB,CAAA;AAClC,IAAA,QAAQ;AAsBR,IAAA,IACI,UAAU,GAAA;AACb,QAAA,OAAO,IAAI,CAAC,KAAK,EAAE,KAAK,OAAO;;AAGhC,IAAA,IACI,SAAS,GAAA;AACZ,QAAA,OAAO,IAAI,CAAC,KAAK,EAAE,KAAK,MAAM;;AAsB/B,IAAA,WAAA,GAAA;AAnDA,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC;AAC1B,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAAC,QAAQ,EAAiB;AACzC,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAiB;QACvC,IAAO,CAAA,OAAA,GAAG,KAAK,EAAiB;QAChC,IAAM,CAAA,MAAA,GAAG,KAAK,EAA0B;AACxC,QAAA,IAAA,CAAA,SAAS,GAAG,QAAQ,CAAC,MAAK;AACzB,YAAA,OAAO,iEAAiE,IAAI,CAAC,OAAO,EAAE,YAAY,IAAI,CAAC,WAAW,EAAE,IAAI,IAAI,CAAC,MAAM,EAAE,MAAM;AAC5I,SAAC,CAAC;AACF,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAA6B,OAAO,CAAC;AAClD;;;AAGG;AACH,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAAoH,OAAO,CAAC;AAE3I,QAAA,IAAA,CAAA,WAAW,GAAG,QAAQ,CAAC,MAAK;AAC3B,YAAA,IAAI,IAAI,CAAC,KAAK,EAAE,KAAK,MAAM,EAAE;AAC5B,gBAAA,OAAO,MAAM;;AAEd,YAAA,OAAO,OAAO;AACf,SAAC,CAAC;AAYF;;;AAGG;QACH,IAAY,CAAA,YAAA,GAAG,KAAK,EAEjB;AACH,QAAA,IAAA,CAAA,eAAe,GAAG,QAAQ,CAAC,MAAK;YAC/B,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;AACtC,gBAAA,OAAO,IAAI,CAAC,YAAY,EAAE;;AAE3B,YAAA,OAAO,yEAAyE,IAAI,CAAC,YAAY,EAAE,MAAM;AAC1G,SAAC,CAAC;AACF,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAA0B,IAAI,CAAC;AAC3C;;AAEG;QACH,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;QAGzD,MAAM,CAAC,MAAK;AACX,YAAA,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC;AACtB,gBAAA,CAAC,CAAO,IAAA,EAAA,IAAI,CAAC,IAAI,EAAE,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE;AACrC,gBAAA,gBAAgB,EAAE,IAAI,CAAC,UAAU,EAAE;AACnC,gBAAA,CAAC,CAAW,QAAA,EAAA,IAAI,CAAC,OAAO,EAAE,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO,EAAE;AAC/C,aAAA,CAAC;AACH,SAAC,CAAC;;8GA3DS,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,6zCANvB,CAAC,OAAO,CAAC,ECVrB,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,qvBAkBA,
|
|
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, HostBinding, inject, input, ViewEncapsulation } from '@angular/core';\nimport { LuClass, PortalContent, PortalDirective } from '@lucca-front/ng/core';\n\n@Component({\n\tselector: 'lu-highlight-data',\n\tstandalone: true,\n\ttemplateUrl: './highlight-data.component.html',\n\tstyleUrls: ['./highlight-data.component.scss'],\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n\tencapsulation: ViewEncapsulation.None,\n\tproviders: [LuClass],\n\thost: {\n\t\tclass: 'highlightData',\n\t},\n\timports: [PortalDirective],\n})\nexport class HighlightDataComponent {\n\t#luClass = inject(LuClass);\n\theading = input.required<PortalContent>();\n\tvalue = input.required<PortalContent>();\n\tsubText = input<PortalContent>();\n\tbubble = input<1 | 2 | 3 | 4 | number>();\n\tbubbleSrc = computed(() => {\n\t\treturn `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/${this.palette()}/bubbles-${this.bubbleTheme()}-${this.bubble()}.svg`;\n\t});\n\ttheme = input<'white' | 'light' | 'dark'>('white');\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\tpalette = input<'lucca' | 'cleemy' | 'timmi' | 'poplee' | 'coreHR' | 'pagga' | 'cc' | 'success' | 'warning' | 'critical' | string>('lucca');\n\n\tbubbleTheme = computed(() => {\n\t\tif (this.theme() === 'dark') {\n\t\t\treturn 'dark';\n\t\t}\n\t\treturn 'light';\n\t});\n\n\t@HostBinding('class.mod-light')\n\tget lightClass() {\n\t\treturn this.theme() === 'light';\n\t}\n\n\t@HostBinding('class.mod-dark')\n\tget darkClass() {\n\t\treturn this.theme() === 'dark';\n\t}\n\n\t/**\n\t * Main illustration\n\t * An URL can be apply for custom images\n\t */\n\tillustration = input<\n\t\t'calculator' | 'calendar' | 'cleemy-card' | 'coffee' | 'headphone' | 'mail' | 'manifying-glass' | 'medallon' | 'piggy-bank' | 'polaroid-female' | 'polaroid-male' | 'polaroids' | string\n\t>();\n\tillustrationSrc = computed(() => {\n\t\tif (this.illustration().includes('/')) {\n\t\t\treturn this.illustration();\n\t\t}\n\t\treturn `https://cdn.lucca.fr/transverse/prisme/visuals/highlight-data/generic/${this.illustration()}.svg`;\n\t});\n\tsize = input<'XS' | 'S' | 'M' | null>(null);\n\t/**\n\t * Adjust layout to text value\n\t */\n\tvalueFirst = input(false, { transform: booleanAttribute });\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[`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<dd class=\"highlightData-content-subText\"><ng-container *luPortal=\"subText()\" /></dd>\n\t}\n\t<dd class=\"highlightData-content-action\"><ng-content></ng-content></dd>\n</dl>\n\n@if (bubble() || illustration()) {\n<div class=\"highlightData-illustrations\">\n\t@if (bubble()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-back\" [attr.src]=\"bubbleSrc()\" />\n\t} @if (illustration()) {\n\t<img alt=\"\" class=\"highlightData-illustrations-front\" [attr.src]=\"illustrationSrc()\" />\n\t}\n</div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lucca-front/ng",
|
|
3
|
-
"version": "19.3.3-rc.
|
|
3
|
+
"version": "19.3.3-rc.7",
|
|
4
4
|
"description": "A library of icons made by the team @Lucca",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"@angular/common": "^19.0.0",
|
|
27
27
|
"@angular/core": "^19.0.0",
|
|
28
28
|
"@angular/cdk": "^19.0.0",
|
|
29
|
-
"@lucca-front/icons": "19.3.3-rc.
|
|
30
|
-
"@lucca-front/scss": "19.3.3-rc.
|
|
29
|
+
"@lucca-front/icons": "19.3.3-rc.7",
|
|
30
|
+
"@lucca-front/scss": "19.3.3-rc.7",
|
|
31
31
|
"isomorphic-dompurify": "^2.17.0",
|
|
32
32
|
"date-fns": "^3.6.0",
|
|
33
33
|
"rxjs": "^7.8.0",
|
|
@@ -87,30 +87,30 @@
|
|
|
87
87
|
"types": "./animations/index.d.ts",
|
|
88
88
|
"default": "./fesm2022/lucca-front-ng-animations.mjs"
|
|
89
89
|
},
|
|
90
|
-
"./breadcrumbs": {
|
|
91
|
-
"types": "./breadcrumbs/index.d.ts",
|
|
92
|
-
"default": "./fesm2022/lucca-front-ng-breadcrumbs.mjs"
|
|
93
|
-
},
|
|
94
|
-
"./chip": {
|
|
95
|
-
"types": "./chip/index.d.ts",
|
|
96
|
-
"default": "./fesm2022/lucca-front-ng-chip.mjs"
|
|
97
|
-
},
|
|
98
90
|
"./api": {
|
|
99
91
|
"types": "./api/index.d.ts",
|
|
100
92
|
"default": "./fesm2022/lucca-front-ng-api.mjs"
|
|
101
93
|
},
|
|
94
|
+
"./callout": {
|
|
95
|
+
"types": "./callout/index.d.ts",
|
|
96
|
+
"default": "./fesm2022/lucca-front-ng-callout.mjs"
|
|
97
|
+
},
|
|
102
98
|
"./button": {
|
|
103
99
|
"types": "./button/index.d.ts",
|
|
104
100
|
"default": "./fesm2022/lucca-front-ng-button.mjs"
|
|
105
101
|
},
|
|
106
|
-
"./
|
|
107
|
-
"types": "./
|
|
108
|
-
"default": "./fesm2022/lucca-front-ng-
|
|
102
|
+
"./chip": {
|
|
103
|
+
"types": "./chip/index.d.ts",
|
|
104
|
+
"default": "./fesm2022/lucca-front-ng-chip.mjs"
|
|
109
105
|
},
|
|
110
106
|
"./comment": {
|
|
111
107
|
"types": "./comment/index.d.ts",
|
|
112
108
|
"default": "./fesm2022/lucca-front-ng-comment.mjs"
|
|
113
109
|
},
|
|
110
|
+
"./breadcrumbs": {
|
|
111
|
+
"types": "./breadcrumbs/index.d.ts",
|
|
112
|
+
"default": "./fesm2022/lucca-front-ng-breadcrumbs.mjs"
|
|
113
|
+
},
|
|
114
114
|
"./core": {
|
|
115
115
|
"types": "./core/index.d.ts",
|
|
116
116
|
"default": "./fesm2022/lucca-front-ng-core.mjs"
|
|
@@ -147,14 +147,14 @@
|
|
|
147
147
|
"types": "./empty-state/index.d.ts",
|
|
148
148
|
"default": "./fesm2022/lucca-front-ng-empty-state.mjs"
|
|
149
149
|
},
|
|
150
|
-
"./fancy-box": {
|
|
151
|
-
"types": "./fancy-box/index.d.ts",
|
|
152
|
-
"default": "./fesm2022/lucca-front-ng-fancy-box.mjs"
|
|
153
|
-
},
|
|
154
150
|
"./establishment": {
|
|
155
151
|
"types": "./establishment/index.d.ts",
|
|
156
152
|
"default": "./fesm2022/lucca-front-ng-establishment.mjs"
|
|
157
153
|
},
|
|
154
|
+
"./fancy-box": {
|
|
155
|
+
"types": "./fancy-box/index.d.ts",
|
|
156
|
+
"default": "./fesm2022/lucca-front-ng-fancy-box.mjs"
|
|
157
|
+
},
|
|
158
158
|
"./file-upload": {
|
|
159
159
|
"types": "./file-upload/index.d.ts",
|
|
160
160
|
"default": "./fesm2022/lucca-front-ng-file-upload.mjs"
|