@taiga-ui/core
Version:
Core library for creating Angular components and applications using Taiga UI
44 lines • 9 kB
JavaScript
import { ChangeDetectionStrategy, Component, computed, inject, Input, signal, ViewEncapsulation, } from '@angular/core';
import { TUI_ICON_END, TUI_ICON_START, tuiGetIconMode, tuiInjectIconResolver, } from '@taiga-ui/core/tokens';
import * as i0 from "@angular/core";
class TuiIcon {
constructor() {
this.resolver = tuiInjectIconResolver();
this.src = signal(inject(TUI_ICON_START, { self: true, optional: true }) ||
inject(TUI_ICON_END, { self: true, optional: true }));
this.bg = signal(null);
this.resource = computed(() => this.resolve(this.src()));
this.mode = computed(() => tuiGetIconMode(this.src()));
this.bgResource = computed(() => this.resolve(this.bg()));
}
set icon(icon) {
this.src.set(icon);
}
set background(background) {
this.bg.set(background);
}
resolve(value) {
if (!value) {
return null;
}
return tuiGetIconMode(value) === 'font'
? `'${this.resolver(value)}'`
: `url(${this.resolver(value)})`;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiIcon, isStandalone: true, selector: "tui-icon", inputs: { icon: "icon", background: "background" }, host: { properties: { "style.--t-icon": "resource() || \"url()\"", "style.--t-icon-bg": "bgResource()", "attr.data-icon": "mode()" } }, ngImport: i0, template: '', isInline: true, styles: ["tui-icon{position:relative;display:inline-block;inline-size:1em;block-size:1em;font-size:1.5rem;flex-shrink:0;border:0 solid transparent;vertical-align:middle;box-sizing:border-box;-webkit-mask:var(--t-icon-bg) no-repeat center / contain;mask:var(--t-icon-bg) no-repeat center / contain}@media (hover: hover) and (pointer: fine){tui-icon[data-appearance=icon]:hover{color:var(--tui-text-secondary)}}tui-icon:after,tui-icon[tuiIcons]:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";display:block;-webkit-mask:var(--t-icon) no-repeat center / contain;mask:var(--t-icon) no-repeat center / contain;background:currentColor}tui-icon[data-icon=image]:after{-webkit-mask:none;mask:none;background:var(--t-icon) no-repeat center / contain}tui-icon[data-icon=font]:after{content:var(--t-icon);-webkit-mask:none;mask:none;background:none;font:1em/1 var(--tui-font-icon, inherit);text-align:center;text-transform:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
export { TuiIcon };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiIcon, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'tui-icon', template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
'[style.--t-icon]': 'resource() || "url()"',
'[style.--t-icon-bg]': 'bgResource()',
'[attr.data-icon]': 'mode()',
}, styles: ["tui-icon{position:relative;display:inline-block;inline-size:1em;block-size:1em;font-size:1.5rem;flex-shrink:0;border:0 solid transparent;vertical-align:middle;box-sizing:border-box;-webkit-mask:var(--t-icon-bg) no-repeat center / contain;mask:var(--t-icon-bg) no-repeat center / contain}@media (hover: hover) and (pointer: fine){tui-icon[data-appearance=icon]:hover{color:var(--tui-text-secondary)}}tui-icon:after,tui-icon[tuiIcons]:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";display:block;-webkit-mask:var(--t-icon) no-repeat center / contain;mask:var(--t-icon) no-repeat center / contain;background:currentColor}tui-icon[data-icon=image]:after{-webkit-mask:none;mask:none;background:var(--t-icon) no-repeat center / contain}tui-icon[data-icon=font]:after{content:var(--t-icon);-webkit-mask:none;mask:none;background:none;font:1em/1 var(--tui-font-icon, inherit);text-align:center;text-transform:none}\n"] }]
}], propDecorators: { icon: [{
type: Input
}], background: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JlL2NvbXBvbmVudHMvaWNvbi9pY29uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0gsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxRQUFRLEVBQ1IsTUFBTSxFQUNOLEtBQUssRUFDTCxNQUFNLEVBQ04saUJBQWlCLEdBQ3BCLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFDSCxZQUFZLEVBQ1osY0FBYyxFQUNkLGNBQWMsRUFDZCxxQkFBcUIsR0FDeEIsTUFBTSx1QkFBdUIsQ0FBQzs7QUFFL0IsTUFhYSxPQUFPO0lBYnBCO1FBY3VCLGFBQVEsR0FBNkIscUJBQXFCLEVBQUUsQ0FBQztRQUM3RCxRQUFHLEdBQUcsTUFBTSxDQUMzQixNQUFNLENBQUMsY0FBYyxFQUFFLEVBQUMsSUFBSSxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsSUFBSSxFQUFDLENBQUM7WUFDaEQsTUFBTSxDQUFDLFlBQVksRUFBRSxFQUFDLElBQUksRUFBRSxJQUFJLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBQyxDQUFDLENBQ3pELENBQUM7UUFFaUIsT0FBRSxHQUFHLE1BQU0sQ0FBZ0IsSUFBSSxDQUFDLENBQUM7UUFDakMsYUFBUSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFDcEQsU0FBSSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUNsRCxlQUFVLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQztLQXFCM0U7SUFuQkcsSUFDVyxJQUFJLENBQUMsSUFBWTtRQUN4QixJQUFJLENBQUMsR0FBRyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUN2QixDQUFDO0lBRUQsSUFDVyxVQUFVLENBQUMsVUFBa0I7UUFDcEMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxHQUFHLENBQUMsVUFBVSxDQUFDLENBQUM7SUFDNUIsQ0FBQztJQUVNLE9BQU8sQ0FBQyxLQUFxQjtRQUNoQyxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQ1IsT0FBTyxJQUFJLENBQUM7U0FDZjtRQUVELE9BQU8sY0FBYyxDQUFDLEtBQUssQ0FBQyxLQUFLLE1BQU07WUFDbkMsQ0FBQyxDQUFDLElBQUksSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsR0FBRztZQUM3QixDQUFDLENBQUMsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUM7SUFDekMsQ0FBQzsrR0E5QlEsT0FBTzttR0FBUCxPQUFPLGdRQVZOLEVBQUU7O1NBVUgsT0FBTzs0RkFBUCxPQUFPO2tCQWJuQixTQUFTO2lDQUNNLElBQUksWUFDTixVQUFVLFlBQ1YsRUFBRSxpQkFFRyxpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNLFFBQ3pDO3dCQUNGLGtCQUFrQixFQUFFLHVCQUF1Qjt3QkFDM0MscUJBQXFCLEVBQUUsY0FBYzt3QkFDckMsa0JBQWtCLEVBQUUsUUFBUTtxQkFDL0I7OEJBZVUsSUFBSTtzQkFEZCxLQUFLO2dCQU1LLFVBQVU7c0JBRHBCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBjb21wdXRlZCxcbiAgICBpbmplY3QsXG4gICAgSW5wdXQsXG4gICAgc2lnbmFsLFxuICAgIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7dHlwZSBUdWlTdHJpbmdIYW5kbGVyfSBmcm9tICdAdGFpZ2EtdWkvY2RrL3R5cGVzJztcbmltcG9ydCB7XG4gICAgVFVJX0lDT05fRU5ELFxuICAgIFRVSV9JQ09OX1NUQVJULFxuICAgIHR1aUdldEljb25Nb2RlLFxuICAgIHR1aUluamVjdEljb25SZXNvbHZlcixcbn0gZnJvbSAnQHRhaWdhLXVpL2NvcmUvdG9rZW5zJztcblxuQENvbXBvbmVudCh7XG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBzZWxlY3RvcjogJ3R1aS1pY29uJyxcbiAgICB0ZW1wbGF0ZTogJycsXG4gICAgc3R5bGVzOiBbJ0BpbXBvcnQgXCJAdGFpZ2EtdWkvY29yZS9zdHlsZXMvY29tcG9uZW50cy9pY29uLmxlc3NcIjsnXSxcbiAgICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIGhvc3Q6IHtcbiAgICAgICAgJ1tzdHlsZS4tLXQtaWNvbl0nOiAncmVzb3VyY2UoKSB8fCBcInVybCgpXCInLFxuICAgICAgICAnW3N0eWxlLi0tdC1pY29uLWJnXSc6ICdiZ1Jlc291cmNlKCknLFxuICAgICAgICAnW2F0dHIuZGF0YS1pY29uXSc6ICdtb2RlKCknLFxuICAgIH0sXG59KVxuZXhwb3J0IGNsYXNzIFR1aUljb24ge1xuICAgIHByb3RlY3RlZCByZWFkb25seSByZXNvbHZlcjogVHVpU3RyaW5nSGFuZGxlcjxzdHJpbmc+ID0gdHVpSW5qZWN0SWNvblJlc29sdmVyKCk7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IHNyYyA9IHNpZ25hbChcbiAgICAgICAgaW5qZWN0KFRVSV9JQ09OX1NUQVJULCB7c2VsZjogdHJ1ZSwgb3B0aW9uYWw6IHRydWV9KSB8fFxuICAgICAgICAgICAgaW5qZWN0KFRVSV9JQ09OX0VORCwge3NlbGY6IHRydWUsIG9wdGlvbmFsOiB0cnVlfSksXG4gICAgKTtcblxuICAgIHByb3RlY3RlZCByZWFkb25seSBiZyA9IHNpZ25hbDxzdHJpbmcgfCBudWxsPihudWxsKTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgcmVzb3VyY2UgPSBjb21wdXRlZCgoKSA9PiB0aGlzLnJlc29sdmUodGhpcy5zcmMoKSkpO1xuICAgIHByb3RlY3RlZCByZWFkb25seSBtb2RlID0gY29tcHV0ZWQoKCkgPT4gdHVpR2V0SWNvbk1vZGUodGhpcy5zcmMoKSkpO1xuICAgIHByb3RlY3RlZCByZWFkb25seSBiZ1Jlc291cmNlID0gY29tcHV0ZWQoKCkgPT4gdGhpcy5yZXNvbHZlKHRoaXMuYmcoKSkpO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgc2V0IGljb24oaWNvbjogc3RyaW5nKSB7XG4gICAgICAgIHRoaXMuc3JjLnNldChpY29uKTtcbiAgICB9XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBzZXQgYmFja2dyb3VuZChiYWNrZ3JvdW5kOiBzdHJpbmcpIHtcbiAgICAgICAgdGhpcy5iZy5zZXQoYmFja2dyb3VuZCk7XG4gICAgfVxuXG4gICAgcHVibGljIHJlc29sdmUodmFsdWU/OiBzdHJpbmcgfCBudWxsKTogc3RyaW5nIHwgbnVsbCB7XG4gICAgICAgIGlmICghdmFsdWUpIHtcbiAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICB9XG5cbiAgICAgICAgcmV0dXJuIHR1aUdldEljb25Nb2RlKHZhbHVlKSA9PT0gJ2ZvbnQnXG4gICAgICAgICAgICA/IGAnJHt0aGlzLnJlc29sdmVyKHZhbHVlKX0nYFxuICAgICAgICAgICAgOiBgdXJsKCR7dGhpcy5yZXNvbHZlcih2YWx1ZSl9KWA7XG4gICAgfVxufVxuIl19