import { __decorate } from "tslib";
import { attr, observable } from '@ni/fast-element';
import { DesignSystem } from '@ni/fast-foundation';
import { Mapping } from '../base';
import { template } from '../base/template';
import { Icon } from '../../icon-base';
import { styles } from '../base/styles';
function isIconClass(elementClass) {
    return elementClass.prototype instanceof Icon;
}
/**
 * Maps a data value to an icon.
 * One or more may be added as children of a nimble-table-column-mapping element to define
 * how specific data values should be displayed as icons in that column's cells.
 */
export class MappingIcon extends Mapping {
    constructor() {
        super(...arguments);
        this.textHidden = false;
    }
    // Allow icons to be defined asynchronously from when the property is configured
    async resolveIconAsync(icon) {
        try {
            // Clear the current resolution while waiting for async resolution
            this.resolvedIcon = undefined;
            await customElements.whenDefined(icon);
        }
        catch (_ex) {
            // If any error (i.e. invalid custom element name) don't continue
            // Don't update the resolvedIcon as it was already set to undefined before async resolution
            // (in case other async resolutions were started)
            return;
        }
        if (icon !== this.icon) {
            // Possible the icon has changed while waiting for async resolution
            // Don't update the resolvedIcon as it was already set to undefined before async resolution
            // (in case other async resolutions were started)
            return;
        }
        const elementClass = customElements.get(icon);
        this.resolvedIcon = isIconClass(elementClass) ? icon : undefined;
    }
    iconChanged() {
        const icon = this.icon;
        if (!icon) {
            this.resolvedIcon = undefined;
            return;
        }
        const elementClass = customElements.get(icon);
        if (elementClass) {
            this.resolvedIcon = isIconClass(elementClass) ? icon : undefined;
            return;
        }
        void this.resolveIconAsync(icon);
    }
}
__decorate([
    attr()
], MappingIcon.prototype, "icon", void 0);
__decorate([
    attr()
], MappingIcon.prototype, "severity", void 0);
__decorate([
    attr()
], MappingIcon.prototype, "text", void 0);
__decorate([
    attr({ attribute: 'text-hidden', mode: 'boolean' })
], MappingIcon.prototype, "textHidden", void 0);
__decorate([
    observable
], MappingIcon.prototype, "resolvedIcon", void 0);
const iconMapping = MappingIcon.compose({
    baseName: 'mapping-icon',
    template,
    styles
});
DesignSystem.getOrCreate().withPrefix('nimble').register(iconMapping());
export const mappingIconTag = 'nimble-mapping-icon';
//# sourceMappingURL=index.js.map