design-angular-kit-lombardia
Version:
Un toolkit Angular conforme alle linee guida di design per i servizi web della Regione Lombardia
67 lines • 14 kB
JavaScript
import { NgTemplateOutlet } from '@angular/common';
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { inputToBoolean } from '../../../../utils/coercion';
import { ItLinkComponent } from '../../link/link.component';
import * as i0 from "@angular/core";
export class ItListItemComponent extends ItLinkComponent {
constructor(elRef) {
super();
this.elRef = elRef;
}
/**
* The avatar url
* @deprecated L'input 'avatar' è deprecato. Usa la documentazione del component Avatar per questo caso d'uso, facendo riferimento all'esempio Avatar con lista. Sarà rimosso nelle prossime versioni.
*/
get avatar() {
console.warn(`L'input 'avatar' è deprecato. Usa la documentazione del component Avatar per questo caso d'uso, facendo riferimento all'esempio Avatar con lista. Sarà rimosso nelle prossime versioni.`);
return this._avatar;
}
set avatar(value) {
this._avatar = value;
}
get itemClass() {
const inSidebar = this.elRef.nativeElement.closest('.sidebar-linklist-wrapper') ? true : false;
let itemClass = 'list-item';
if (this.disabled) {
itemClass += ` disabled`;
}
if (this.active) {
itemClass += ` active`;
}
if (this.size) {
itemClass += ` ${this.size}`;
}
if (this.iconLeft) {
itemClass += inSidebar ? ` left-icon` : ` icon-left`;
}
if (this.iconRight) {
itemClass += inSidebar ? ` right-icon` : ` icon-right`;
}
if (this.class) {
itemClass += ` ${this.class}`;
}
return itemClass;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItListItemComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItListItemComponent, isStandalone: true, selector: "it-list-item", inputs: { active: ["active", "active", inputToBoolean], size: "size", iconLeft: ["iconLeft", "iconLeft", inputToBoolean], iconRight: ["iconRight", "iconRight", inputToBoolean], avatar: "avatar", image: "image" }, usesInheritance: true, ngImport: i0, template: "<li>\n <ng-template #content>\n <div class=\"it-rounded-icon\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n\n @if (avatar) {\n <div class=\"avatar size-lg\">\n <img [attr.src]=\"avatar\" alt=\"avatar\" />\n </div>\n }\n\n @if (image) {\n <div class=\"it-thumb\">\n <img [attr.src]=\"image\" alt=\"thumb\" />\n </div>\n }\n\n <div class=\"it-right-zone\">\n <ng-content></ng-content>\n <ng-content select=\"[action]\"></ng-content>\n\n <span class=\"it-multiple\">\n <span class=\"metadata\">\n <ng-content select=\"[metadata]\"></ng-content>\n </span>\n\n <ng-content select=\"[multiple]\"></ng-content>\n </span>\n </div>\n </ng-template>\n\n @if (!href) {\n <div [class]=\"itemClass\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n } @else {\n <it-link [class]=\"itemClass\" [href]=\"href\" [externalLink]=\"!!externalLink\" [disabled]=\"!!disabled\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </it-link>\n }\n</li>\n", styles: [".metadata:empty,.it-rounded-icon:empty{display:none}:host ::ng-deep it-icon+.it-multiple{display:none!important}:host ::ng-deep .list-item-title-icon-wrapper+.it-multiple{display:none!important}:host ::ng-deep p+.it-multiple{display:none!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ItLinkComponent, selector: "it-link", inputs: ["href", "externalLink", "disabled", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItListItemComponent, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'it-list-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, ItLinkComponent], template: "<li>\n <ng-template #content>\n <div class=\"it-rounded-icon\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n\n @if (avatar) {\n <div class=\"avatar size-lg\">\n <img [attr.src]=\"avatar\" alt=\"avatar\" />\n </div>\n }\n\n @if (image) {\n <div class=\"it-thumb\">\n <img [attr.src]=\"image\" alt=\"thumb\" />\n </div>\n }\n\n <div class=\"it-right-zone\">\n <ng-content></ng-content>\n <ng-content select=\"[action]\"></ng-content>\n\n <span class=\"it-multiple\">\n <span class=\"metadata\">\n <ng-content select=\"[metadata]\"></ng-content>\n </span>\n\n <ng-content select=\"[multiple]\"></ng-content>\n </span>\n </div>\n </ng-template>\n\n @if (!href) {\n <div [class]=\"itemClass\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n } @else {\n <it-link [class]=\"itemClass\" [href]=\"href\" [externalLink]=\"!!externalLink\" [disabled]=\"!!disabled\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </it-link>\n }\n</li>\n", styles: [".metadata:empty,.it-rounded-icon:empty{display:none}:host ::ng-deep it-icon+.it-multiple{display:none!important}:host ::ng-deep .list-item-title-icon-wrapper+.it-multiple{display:none!important}:host ::ng-deep p+.it-multiple{display:none!important}\n"] }]
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { active: [{
type: Input,
args: [{ transform: inputToBoolean }]
}], size: [{
type: Input
}], iconLeft: [{
type: Input,
args: [{ transform: inputToBoolean }]
}], iconRight: [{
type: Input,
args: [{ transform: inputToBoolean }]
}], avatar: [{
type: Input
}], image: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2Rlc2lnbi1hbmd1bGFyLWtpdC9zcmMvbGliL2NvbXBvbmVudHMvY29yZS9saXN0L2xpc3QtaXRlbS9saXN0LWl0ZW0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGVzaWduLWFuZ3VsYXIta2l0L3NyYy9saWIvY29tcG9uZW50cy9jb3JlL2xpc3QvbGlzdC1pdGVtL2xpc3QtaXRlbS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNuRCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFjLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN0RixPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDNUQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDJCQUEyQixDQUFDOztBQVU1RCxNQUFNLE9BQU8sbUJBQW9CLFNBQVEsZUFBZTtJQUN0RCxZQUFvQixLQUFpQjtRQUNuQyxLQUFLLEVBQUUsQ0FBQztRQURVLFVBQUssR0FBTCxLQUFLLENBQVk7SUFFckMsQ0FBQztJQTBCRDs7O09BR0c7SUFDSCxJQUNJLE1BQU07UUFDUixPQUFPLENBQUMsSUFBSSxDQUNWLHlMQUF5TCxDQUMxTCxDQUFDO1FBQ0YsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDO0lBQ3RCLENBQUM7SUFDRCxJQUFJLE1BQU0sQ0FBQyxLQUFzQjtRQUMvQixJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQztJQUN2QixDQUFDO0lBT0QsSUFBSSxTQUFTO1FBQ1gsTUFBTSxTQUFTLEdBQVksSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLDJCQUEyQixDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDO1FBQ3hHLElBQUksU0FBUyxHQUFHLFdBQVcsQ0FBQztRQUM1QixJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztZQUNsQixTQUFTLElBQUksV0FBVyxDQUFDO1FBQzNCLENBQUM7UUFDRCxJQUFJLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztZQUNoQixTQUFTLElBQUksU0FBUyxDQUFDO1FBQ3pCLENBQUM7UUFDRCxJQUFJLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQztZQUNkLFNBQVMsSUFBSSxJQUFJLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUMvQixDQUFDO1FBQ0QsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7WUFDbEIsU0FBUyxJQUFJLFNBQVMsQ0FBQyxDQUFDLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxZQUFZLENBQUM7UUFDdkQsQ0FBQztRQUNELElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO1lBQ25CLFNBQVMsSUFBSSxTQUFTLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDO1FBQ3pELENBQUM7UUFDRCxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUNmLFNBQVMsSUFBSSxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUNoQyxDQUFDO1FBQ0QsT0FBTyxTQUFTLENBQUM7SUFDbkIsQ0FBQzs4R0F2RVUsbUJBQW1CO2tHQUFuQixtQkFBbUIsdUZBU1YsY0FBYyxvREFXZCxjQUFjLHlDQU1kLGNBQWMsc0ZDdkNwQyxtbUNBMENBLG9URC9CWSxnQkFBZ0Isb0pBQUUsZUFBZTs7MkZBRWhDLG1CQUFtQjtrQkFSL0IsU0FBUztpQ0FDSSxJQUFJLFlBQ04sY0FBYyxtQkFHUCx1QkFBdUIsQ0FBQyxNQUFNLFdBQ3RDLENBQUMsZ0JBQWdCLEVBQUUsZUFBZSxDQUFDOytFQVdOLE1BQU07c0JBQTNDLEtBQUs7dUJBQUMsRUFBRSxTQUFTLEVBQUUsY0FBYyxFQUFFO2dCQUszQixJQUFJO3NCQUFaLEtBQUs7Z0JBTWdDLFFBQVE7c0JBQTdDLEtBQUs7dUJBQUMsRUFBRSxTQUFTLEVBQUUsY0FBYyxFQUFFO2dCQU1FLFNBQVM7c0JBQTlDLEtBQUs7dUJBQUMsRUFBRSxTQUFTLEVBQUUsY0FBYyxFQUFFO2dCQVFoQyxNQUFNO3NCQURULEtBQUs7Z0JBY0csS0FBSztzQkFBYixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdUZW1wbGF0ZU91dGxldCB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgaW5wdXRUb0Jvb2xlYW4gfSBmcm9tICcuLi8uLi8uLi8uLi91dGlscy9jb2VyY2lvbic7XG5pbXBvcnQgeyBJdExpbmtDb21wb25lbnQgfSBmcm9tICcuLi8uLi9saW5rL2xpbmsuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIHNlbGVjdG9yOiAnaXQtbGlzdC1pdGVtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2xpc3QtaXRlbS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2xpc3QtaXRlbS5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgaW1wb3J0czogW05nVGVtcGxhdGVPdXRsZXQsIEl0TGlua0NvbXBvbmVudF0sXG59KVxuZXhwb3J0IGNsYXNzIEl0TGlzdEl0ZW1Db21wb25lbnQgZXh0ZW5kcyBJdExpbmtDb21wb25lbnQge1xuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsUmVmOiBFbGVtZW50UmVmKSB7XG4gICAgc3VwZXIoKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBBZGQgYWN0aXZlIGNsYXNzXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoeyB0cmFuc2Zvcm06IGlucHV0VG9Cb29sZWFuIH0pIGFjdGl2ZT86IGJvb2xlYW47XG5cbiAgLyoqXG4gICAqIEFkZCBsYXJnZSBjbGFzc1xuICAgKi9cbiAgQElucHV0KCkgc2l6ZT86ICdsYXJnZScgfCAnbWVkaXVtJztcblxuICAvKipcbiAgICogQWRkIGljb24tbGVmdCBjbGFzc1xuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgQElucHV0KHsgdHJhbnNmb3JtOiBpbnB1dFRvQm9vbGVhbiB9KSBpY29uTGVmdD86IGJvb2xlYW47XG5cbiAgLyoqXG4gICAqIEFkZCBpY29uLXJpZ2h0IGNsYXNzXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoeyB0cmFuc2Zvcm06IGlucHV0VG9Cb29sZWFuIH0pIGljb25SaWdodD86IGJvb2xlYW47XG5cbiAgcHJpdmF0ZSBfYXZhdGFyOiBVUkwgfCB1bmRlZmluZWQ7XG4gIC8qKlxuICAgKiBUaGUgYXZhdGFyIHVybFxuICAgKiBAZGVwcmVjYXRlZCBMJ2lucHV0ICdhdmF0YXInIMOoIGRlcHJlY2F0by4gVXNhIGxhIGRvY3VtZW50YXppb25lIGRlbCBjb21wb25lbnQgQXZhdGFyIHBlciBxdWVzdG8gY2FzbyBkJ3VzbywgZmFjZW5kbyByaWZlcmltZW50byBhbGwnZXNlbXBpbyBBdmF0YXIgY29uIGxpc3RhLiBTYXLDoCByaW1vc3NvIG5lbGxlIHByb3NzaW1lIHZlcnNpb25pLlxuICAgKi9cbiAgQElucHV0KClcbiAgZ2V0IGF2YXRhcigpOiBVUkwgfCB1bmRlZmluZWQge1xuICAgIGNvbnNvbGUud2FybihcbiAgICAgIGBMJ2lucHV0ICdhdmF0YXInIMOoIGRlcHJlY2F0by4gVXNhIGxhIGRvY3VtZW50YXppb25lIGRlbCBjb21wb25lbnQgQXZhdGFyIHBlciBxdWVzdG8gY2FzbyBkJ3VzbywgZmFjZW5kbyByaWZlcmltZW50byBhbGwnZXNlbXBpbyBBdmF0YXIgY29uIGxpc3RhLiBTYXLDoCByaW1vc3NvIG5lbGxlIHByb3NzaW1lIHZlcnNpb25pLmBcbiAgICApO1xuICAgIHJldHVybiB0aGlzLl9hdmF0YXI7XG4gIH1cbiAgc2V0IGF2YXRhcih2YWx1ZTogVVJMIHwgdW5kZWZpbmVkKSB7XG4gICAgdGhpcy5fYXZhdGFyID0gdmFsdWU7XG4gIH1cblxuICAvKipcbiAgICogVGhlIHRodW1iIGltYWdlIHVybFxuICAgKi9cbiAgQElucHV0KCkgaW1hZ2U6IFVSTCB8IHVuZGVmaW5lZDtcblxuICBnZXQgaXRlbUNsYXNzKCk6IHN0cmluZyB7XG4gICAgY29uc3QgaW5TaWRlYmFyOiBib29sZWFuID0gdGhpcy5lbFJlZi5uYXRpdmVFbGVtZW50LmNsb3Nlc3QoJy5zaWRlYmFyLWxpbmtsaXN0LXdyYXBwZXInKSA/IHRydWUgOiBmYWxzZTtcbiAgICBsZXQgaXRlbUNsYXNzID0gJ2xpc3QtaXRlbSc7XG4gICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcbiAgICAgIGl0ZW1DbGFzcyArPSBgIGRpc2FibGVkYDtcbiAgICB9XG4gICAgaWYgKHRoaXMuYWN0aXZlKSB7XG4gICAgICBpdGVtQ2xhc3MgKz0gYCBhY3RpdmVgO1xuICAgIH1cbiAgICBpZiAodGhpcy5zaXplKSB7XG4gICAgICBpdGVtQ2xhc3MgKz0gYCAke3RoaXMuc2l6ZX1gO1xuICAgIH1cbiAgICBpZiAodGhpcy5pY29uTGVmdCkge1xuICAgICAgaXRlbUNsYXNzICs9IGluU2lkZWJhciA/IGAgbGVmdC1pY29uYCA6IGAgaWNvbi1sZWZ0YDtcbiAgICB9XG4gICAgaWYgKHRoaXMuaWNvblJpZ2h0KSB7XG4gICAgICBpdGVtQ2xhc3MgKz0gaW5TaWRlYmFyID8gYCByaWdodC1pY29uYCA6IGAgaWNvbi1yaWdodGA7XG4gICAgfVxuICAgIGlmICh0aGlzLmNsYXNzKSB7XG4gICAgICBpdGVtQ2xhc3MgKz0gYCAke3RoaXMuY2xhc3N9YDtcbiAgICB9XG4gICAgcmV0dXJuIGl0ZW1DbGFzcztcbiAgfVxufVxuIiwiPGxpPlxuICA8bmctdGVtcGxhdGUgI2NvbnRlbnQ+XG4gICAgPGRpdiBjbGFzcz1cIml0LXJvdW5kZWQtaWNvblwiPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2ljb25dXCI+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuXG4gICAgQGlmIChhdmF0YXIpIHtcbiAgICAgIDxkaXYgY2xhc3M9XCJhdmF0YXIgc2l6ZS1sZ1wiPlxuICAgICAgICA8aW1nIFthdHRyLnNyY109XCJhdmF0YXJcIiBhbHQ9XCJhdmF0YXJcIiAvPlxuICAgICAgPC9kaXY+XG4gICAgfVxuXG4gICAgQGlmIChpbWFnZSkge1xuICAgICAgPGRpdiBjbGFzcz1cIml0LXRodW1iXCI+XG4gICAgICAgIDxpbWcgW2F0dHIuc3JjXT1cImltYWdlXCIgYWx0PVwidGh1bWJcIiAvPlxuICAgICAgPC9kaXY+XG4gICAgfVxuXG4gICAgPGRpdiBjbGFzcz1cIml0LXJpZ2h0LXpvbmVcIj5cbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIlthY3Rpb25dXCI+PC9uZy1jb250ZW50PlxuXG4gICAgICA8c3BhbiBjbGFzcz1cIml0LW11bHRpcGxlXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwibWV0YWRhdGFcIj5cbiAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbbWV0YWRhdGFdXCI+PC9uZy1jb250ZW50PlxuICAgICAgICA8L3NwYW4+XG5cbiAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW211bHRpcGxlXVwiPjwvbmctY29udGVudD5cbiAgICAgIDwvc3Bhbj5cbiAgICA8L2Rpdj5cbiAgPC9uZy10ZW1wbGF0ZT5cblxuICBAaWYgKCFocmVmKSB7XG4gICAgPGRpdiBbY2xhc3NdPVwiaXRlbUNsYXNzXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFwiPjwvbmctY29udGFpbmVyPlxuICAgIDwvZGl2PlxuICB9IEBlbHNlIHtcbiAgICA8aXQtbGluayBbY2xhc3NdPVwiaXRlbUNsYXNzXCIgW2hyZWZdPVwiaHJlZlwiIFtleHRlcm5hbExpbmtdPVwiISFleHRlcm5hbExpbmtcIiBbZGlzYWJsZWRdPVwiISFkaXNhYmxlZFwiPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImNvbnRlbnRcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L2l0LWxpbms+XG4gIH1cbjwvbGk+XG4iXX0=