ngx-tabler-icons/fesm2022/ngx-tabler-icons.mjs

Tabler Icons library for Angular applications

import * as i0 from '@angular/core';
import { InjectionToken, inject, ElementRef, input, computed, effect, untracked, ChangeDetectionStrategy, Component, makeEnvironmentProviders } from '@angular/core';

const TABLER_ICONS = new InjectionToken('TABLER_ICONS', {
    factory: () => [],
});

function upperCamelCase(value) {
    return value
        .toLowerCase()
        .replace(/(?:^|[-_\s])(\w)/g, (_, firstLetter) => firstLetter.toUpperCase());
}

class ITablerIcon {
    constructor() {
        this.#elem = inject(ElementRef);
        this.#iconPacks = inject(TABLER_ICONS, { optional: true }) ?? [];
        this.name = input.required(/* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
        this.size = input(24, /* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
        this.strokeWidth = input(1.5, /* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "strokeWidth" }] : /* istanbul ignore next */ []));
        this.#icons = computed(() => Object.assign({}, ...this.#iconPacks), /* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "#icons" }] : /* istanbul ignore next */ []));
        this.isIconFilled = computed(() => {
            return this.name().endsWith('-filled');
        }, /* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "isIconFilled" }] : /* istanbul ignore next */ []));
        this.#svg = computed(() => {
            const iconName = this.name();
            const iconExportName = `Icon${upperCamelCase(iconName)}`;
            return this.#icons()[iconExportName] ?? '';
        }, /* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "#svg" }] : /* istanbul ignore next */ []));
        this.#renderSvg = effect(() => {
            const svg = this.#svg();
            untracked(() => {
                this.#elem.nativeElement.innerHTML = svg;
            });
        }, /* @ts-ignore */
        ...(ngDevMode ? [{ debugName: "#renderSvg" }] : /* istanbul ignore next */ []));
    }
    #elem;
    #iconPacks;
    #icons;
    #svg;
    #renderSvg;
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ITablerIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.6", type: ITablerIcon, isStandalone: true, selector: "i-tabler-icon", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.width.px": "size()", "style.height.px": "size()", "style.stroke-width": "isIconFilled() ? 0 : strokeWidth()" } }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host{display:inline-block;line-height:0}:host svg{width:100%;height:100%;stroke-width:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: ITablerIcon, decorators: [{
            type: Component,
            args: [{ selector: 'i-tabler-icon', standalone: true, template: `<ng-content />`, host: {
                        '[style.width.px]': 'size()',
                        '[style.height.px]': 'size()',
                        '[style.stroke-width]': 'isIconFilled() ? 0 : strokeWidth()',
                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-block;line-height:0}:host svg{width:100%;height:100%;stroke-width:inherit}\n"] }]
        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }] } });

function provideIcons(icons) {
    return makeEnvironmentProviders([
        {
            provide: TABLER_ICONS,
            useValue: icons,
            multi: true,
        },
    ]);
}

/**
 * Generated bundle index. Do not edit.
 */

export { ITablerIcon, provideIcons };
//# sourceMappingURL=ngx-tabler-icons.mjs.map