design-angular-kit
Version:
Un toolkit Angular conforme alle linee guida di design per i servizi web della PA
70 lines • 11.6 kB
JavaScript
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { ItLinkComponent } from '../../link/link.component';
import { ItIconComponent } from '../../../utils/icon/icon.component';
import { TranslateModule } from '@ngx-translate/core';
import { inputToBoolean } from '../../../../utils/coercion';
import * as i0 from "@angular/core";
import * as i1 from "@ngx-translate/core";
export class ItDropdownItemComponent extends ItLinkComponent {
constructor() {
super(...arguments);
/**
* The icon position
* @default right
*/
this.iconPosition = 'right';
/**
* Dropdown mode
*/
this.mode = 'button';
/**
* Change icon color if menu is dark
* @default false
*/
this.isDark = false;
}
get linkClass() {
let linkClass = `list-item ${this.active ? 'active' : 'dropdown-item'}`;
if (this.mode === 'nav') {
linkClass += ' nav-link';
}
if (this.disabled) {
linkClass += ' disabled';
}
if (this.large) {
linkClass += ' large';
}
if (this.iconName) {
linkClass += ` ${this.iconPosition === 'right' ? 'right-icon' : 'left-icon'}`;
}
return linkClass;
}
setDark(dark) {
if (this.isDark !== dark) {
this.isDark = dark;
this._changeDetectorRef.detectChanges();
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItDropdownItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItDropdownItemComponent, isStandalone: true, selector: "it-dropdown-item", inputs: { divider: ["divider", "divider", inputToBoolean], active: ["active", "active", inputToBoolean], large: ["large", "large", inputToBoolean], iconName: "iconName", iconPosition: "iconPosition", mode: "mode" }, usesInheritance: true, ngImport: i0, template: "<li>\n @if (divider) {\n <span class=\"divider\"></span>\n } @else {\n <it-link [class]=\"linkClass\" [id]=\"id\" [href]=\"href\" [externalLink]=\"externalLink\" [disabled]=\"disabled\">\n @if (iconName && iconPosition === 'left') {\n <it-icon size=\"sm\" [name]=\"iconName\" [color]=\"isDark ? 'light' : 'primary'\" [svgClass]=\"iconPosition\"></it-icon>\n }\n <span><ng-content></ng-content></span>\n @if (iconName && iconPosition === 'right') {\n <it-icon size=\"sm\" [name]=\"iconName\" [color]=\"isDark ? 'light' : 'primary'\" [svgClass]=\"iconPosition\"></it-icon>\n }\n @if (active) {\n <span class=\"visually-hidden\">{{ 'it.core.active' | translate }}</span>\n }\n </it-link>\n }\n</li>\n", styles: [".list-item.disabled{pointer-events:none;cursor:default}\n"], dependencies: [{ kind: "component", type: ItIconComponent, selector: "it-icon", inputs: ["name", "size", "color", "padded", "svgClass", "title", "labelWaria"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { 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: ItDropdownItemComponent, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'it-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ItIconComponent, TranslateModule, ItLinkComponent], template: "<li>\n @if (divider) {\n <span class=\"divider\"></span>\n } @else {\n <it-link [class]=\"linkClass\" [id]=\"id\" [href]=\"href\" [externalLink]=\"externalLink\" [disabled]=\"disabled\">\n @if (iconName && iconPosition === 'left') {\n <it-icon size=\"sm\" [name]=\"iconName\" [color]=\"isDark ? 'light' : 'primary'\" [svgClass]=\"iconPosition\"></it-icon>\n }\n <span><ng-content></ng-content></span>\n @if (iconName && iconPosition === 'right') {\n <it-icon size=\"sm\" [name]=\"iconName\" [color]=\"isDark ? 'light' : 'primary'\" [svgClass]=\"iconPosition\"></it-icon>\n }\n @if (active) {\n <span class=\"visually-hidden\">{{ 'it.core.active' | translate }}</span>\n }\n </it-link>\n }\n</li>\n", styles: [".list-item.disabled{pointer-events:none;cursor:default}\n"] }]
}], propDecorators: { divider: [{
type: Input,
args: [{ transform: inputToBoolean }]
}], active: [{
type: Input,
args: [{ transform: inputToBoolean }]
}], large: [{
type: Input,
args: [{ transform: inputToBoolean }]
}], iconName: [{
type: Input
}], iconPosition: [{
type: Input
}], mode: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24taXRlbS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kZXNpZ24tYW5ndWxhci1raXQvc3JjL2xpYi9jb21wb25lbnRzL2NvcmUvZHJvcGRvd24vZHJvcGRvd24taXRlbS9kcm9wZG93bi1pdGVtLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2Rlc2lnbi1hbmd1bGFyLWtpdC9zcmMvbGliL2NvbXBvbmVudHMvY29yZS9kcm9wZG93bi9kcm9wZG93bi1pdGVtL2Ryb3Bkb3duLWl0ZW0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFMUUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzVELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUNyRSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFFdEQsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7QUFVNUQsTUFBTSxPQUFPLHVCQUF3QixTQUFRLGVBQWU7SUFSNUQ7O1FBZ0NFOzs7V0FHRztRQUNNLGlCQUFZLEdBQXFCLE9BQU8sQ0FBQztRQUVsRDs7V0FFRztRQUNNLFNBQUksR0FBK0IsUUFBUSxDQUFDO1FBRXJEOzs7V0FHRztRQUNILFdBQU0sR0FBWSxLQUFLLENBQUM7S0EwQnpCO0lBeEJDLElBQUksU0FBUztRQUNYLElBQUksU0FBUyxHQUFHLGFBQWEsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4RSxJQUFJLElBQUksQ0FBQyxJQUFJLEtBQUssS0FBSyxFQUFFLENBQUM7WUFDeEIsU0FBUyxJQUFJLFdBQVcsQ0FBQztRQUMzQixDQUFDO1FBQ0QsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7WUFDbEIsU0FBUyxJQUFJLFdBQVcsQ0FBQztRQUMzQixDQUFDO1FBQ0QsSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDZixTQUFTLElBQUksUUFBUSxDQUFDO1FBQ3hCLENBQUM7UUFDRCxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztZQUNsQixTQUFTLElBQUksSUFBSSxJQUFJLENBQUMsWUFBWSxLQUFLLE9BQU8sQ0FBQyxDQUFDLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNoRixDQUFDO1FBRUQsT0FBTyxTQUFTLENBQUM7SUFDbkIsQ0FBQztJQUVELE9BQU8sQ0FBQyxJQUFhO1FBQ25CLElBQUksSUFBSSxDQUFDLE1BQU0sS0FBSyxJQUFJLEVBQUUsQ0FBQztZQUN6QixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQztZQUNuQixJQUFJLENBQUMsa0JBQWtCLENBQUMsYUFBYSxFQUFFLENBQUM7UUFDMUMsQ0FBQztJQUNILENBQUM7OEdBaEVVLHVCQUF1QjtrR0FBdkIsdUJBQXVCLDhGQUtkLGNBQWMsZ0NBTWQsY0FBYyw2QkFNZCxjQUFjLHNIQ2pDcEMsK3ZCQWtCQSxtSERKWSxlQUFlLG1JQUFFLGVBQWUsNEZBQUUsZUFBZTs7MkZBRWhELHVCQUF1QjtrQkFSbkMsU0FBUztpQ0FDSSxJQUFJLFlBQ04sa0JBQWtCLG1CQUdYLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxlQUFlLEVBQUUsZUFBZSxFQUFFLGVBQWUsQ0FBQzs4QkFPdEIsT0FBTztzQkFBNUMsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxjQUFjLEVBQUU7Z0JBTUUsTUFBTTtzQkFBM0MsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxjQUFjLEVBQUU7Z0JBTUUsS0FBSztzQkFBMUMsS0FBSzt1QkFBQyxFQUFFLFNBQVMsRUFBRSxjQUFjLEVBQUU7Z0JBSzNCLFFBQVE7c0JBQWhCLEtBQUs7Z0JBTUcsWUFBWTtzQkFBcEIsS0FBSztnQkFLRyxJQUFJO3NCQUFaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSWNvbk5hbWUgfSBmcm9tICcuLi8uLi8uLi8uLi9pbnRlcmZhY2VzL2ljb24nO1xuaW1wb3J0IHsgSXRMaW5rQ29tcG9uZW50IH0gZnJvbSAnLi4vLi4vbGluay9saW5rLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBJdEljb25Db21wb25lbnQgfSBmcm9tICcuLi8uLi8uLi91dGlscy9pY29uL2ljb24uY29tcG9uZW50JztcbmltcG9ydCB7IFRyYW5zbGF0ZU1vZHVsZSB9IGZyb20gJ0BuZ3gtdHJhbnNsYXRlL2NvcmUnO1xuXG5pbXBvcnQgeyBpbnB1dFRvQm9vbGVhbiB9IGZyb20gJy4uLy4uLy4uLy4uL3V0aWxzL2NvZXJjaW9uJztcblxuQENvbXBvbmVudCh7XG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIHNlbGVjdG9yOiAnaXQtZHJvcGRvd24taXRlbScsXG4gIHRlbXBsYXRlVXJsOiAnLi9kcm9wZG93bi1pdGVtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZHJvcGRvd24taXRlbS5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgaW1wb3J0czogW0l0SWNvbkNvbXBvbmVudCwgVHJhbnNsYXRlTW9kdWxlLCBJdExpbmtDb21wb25lbnRdLFxufSlcbmV4cG9ydCBjbGFzcyBJdERyb3Bkb3duSXRlbUNvbXBvbmVudCBleHRlbmRzIEl0TGlua0NvbXBvbmVudCB7XG4gIC8qKlxuICAgKiBTaG93IGRpdmlkZXJcbiAgICogQGRlZmF1bHQgZmFsc2VcbiAgICovXG4gIEBJbnB1dCh7IHRyYW5zZm9ybTogaW5wdXRUb0Jvb2xlYW4gfSkgZGl2aWRlcj86IGJvb2xlYW47XG5cbiAgLyoqXG4gICAqIEFjdGl2ZSBpdGVtXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoeyB0cmFuc2Zvcm06IGlucHV0VG9Cb29sZWFuIH0pIGFjdGl2ZT86IGJvb2xlYW47XG5cbiAgLyoqXG4gICAqIFRvIGluY3JlYXNlIHRoZSBzaXplIG9mIGxpbmtzXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoeyB0cmFuc2Zvcm06IGlucHV0VG9Cb29sZWFuIH0pIGxhcmdlPzogYm9vbGVhbjtcblxuICAvKipcbiAgICogVGhlIG5hbWUgb2YgaWNvbiB0byBzaG93XG4gICAqL1xuICBASW5wdXQoKSBpY29uTmFtZTogSWNvbk5hbWUgfCB1bmRlZmluZWQ7XG5cbiAgLyoqXG4gICAqIFRoZSBpY29uIHBvc2l0aW9uXG4gICAqIEBkZWZhdWx0IHJpZ2h0XG4gICAqL1xuICBASW5wdXQoKSBpY29uUG9zaXRpb246ICdsZWZ0JyB8ICdyaWdodCcgPSAncmlnaHQnO1xuXG4gIC8qKlxuICAgKiBEcm9wZG93biBtb2RlXG4gICAqL1xuICBASW5wdXQoKSBtb2RlPzogJ2J1dHRvbicgfCAnbGluaycgfCAnbmF2JyA9ICdidXR0b24nO1xuXG4gIC8qKlxuICAgKiBDaGFuZ2UgaWNvbiBjb2xvciBpZiBtZW51IGlzIGRhcmtcbiAgICogQGRlZmF1bHQgZmFsc2VcbiAgICovXG4gIGlzRGFyazogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIGdldCBsaW5rQ2xhc3MoKTogc3RyaW5nIHtcbiAgICBsZXQgbGlua0NsYXNzID0gYGxpc3QtaXRlbSAke3RoaXMuYWN0aXZlID8gJ2FjdGl2ZScgOiAnZHJvcGRvd24taXRlbSd9YDtcbiAgICBpZiAodGhpcy5tb2RlID09PSAnbmF2Jykge1xuICAgICAgbGlua0NsYXNzICs9ICcgbmF2LWxpbmsnO1xuICAgIH1cbiAgICBpZiAodGhpcy5kaXNhYmxlZCkge1xuICAgICAgbGlua0NsYXNzICs9ICcgZGlzYWJsZWQnO1xuICAgIH1cbiAgICBpZiAodGhpcy5sYXJnZSkge1xuICAgICAgbGlua0NsYXNzICs9ICcgbGFyZ2UnO1xuICAgIH1cbiAgICBpZiAodGhpcy5pY29uTmFtZSkge1xuICAgICAgbGlua0NsYXNzICs9IGAgJHt0aGlzLmljb25Qb3NpdGlvbiA9PT0gJ3JpZ2h0JyA/ICdyaWdodC1pY29uJyA6ICdsZWZ0LWljb24nfWA7XG4gICAgfVxuXG4gICAgcmV0dXJuIGxpbmtDbGFzcztcbiAgfVxuXG4gIHNldERhcmsoZGFyazogYm9vbGVhbik6IHZvaWQge1xuICAgIGlmICh0aGlzLmlzRGFyayAhPT0gZGFyaykge1xuICAgICAgdGhpcy5pc0RhcmsgPSBkYXJrO1xuICAgICAgdGhpcy5fY2hhbmdlRGV0ZWN0b3JSZWYuZGV0ZWN0Q2hhbmdlcygpO1xuICAgIH1cbiAgfVxufVxuIiwiPGxpPlxuICBAaWYgKGRpdmlkZXIpIHtcbiAgICA8c3BhbiBjbGFzcz1cImRpdmlkZXJcIj48L3NwYW4+XG4gIH0gQGVsc2Uge1xuICAgIDxpdC1saW5rIFtjbGFzc109XCJsaW5rQ2xhc3NcIiBbaWRdPVwiaWRcIiBbaHJlZl09XCJocmVmXCIgW2V4dGVybmFsTGlua109XCJleHRlcm5hbExpbmtcIiBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIj5cbiAgICAgIEBpZiAoaWNvbk5hbWUgJiYgaWNvblBvc2l0aW9uID09PSAnbGVmdCcpIHtcbiAgICAgICAgPGl0LWljb24gc2l6ZT1cInNtXCIgW25hbWVdPVwiaWNvbk5hbWVcIiBbY29sb3JdPVwiaXNEYXJrID8gJ2xpZ2h0JyA6ICdwcmltYXJ5J1wiIFtzdmdDbGFzc109XCJpY29uUG9zaXRpb25cIj48L2l0LWljb24+XG4gICAgICB9XG4gICAgICA8c3Bhbj48bmctY29udGVudD48L25nLWNvbnRlbnQ+PC9zcGFuPlxuICAgICAgQGlmIChpY29uTmFtZSAmJiBpY29uUG9zaXRpb24gPT09ICdyaWdodCcpIHtcbiAgICAgICAgPGl0LWljb24gc2l6ZT1cInNtXCIgW25hbWVdPVwiaWNvbk5hbWVcIiBbY29sb3JdPVwiaXNEYXJrID8gJ2xpZ2h0JyA6ICdwcmltYXJ5J1wiIFtzdmdDbGFzc109XCJpY29uUG9zaXRpb25cIj48L2l0LWljb24+XG4gICAgICB9XG4gICAgICBAaWYgKGFjdGl2ZSkge1xuICAgICAgICA8c3BhbiBjbGFzcz1cInZpc3VhbGx5LWhpZGRlblwiPnt7ICdpdC5jb3JlLmFjdGl2ZScgfCB0cmFuc2xhdGUgfX08L3NwYW4+XG4gICAgICB9XG4gICAgPC9pdC1saW5rPlxuICB9XG48L2xpPlxuIl19