@gravionlabs/helix-core 22.1.1 → 22.1.3

package/fesm2022/gravionlabs-helix-core-chip.mjs

@@ -1,16 +1,15 @@
-export * from '@gravionlabs/helix-core/types/chip';
-import * as i2 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, inject, model, input, booleanAttribute, output, contentChild, contentChildren, effect, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import { TranslationKeys, HelixTemplate, SharedModule } from '@gravionlabs/helix-core/api';
-import { BaseComponent, PARENT_INSTANCE } from '@gravionlabs/helix-core/basecomponent';
-import * as i1 from '@gravionlabs/helix-core/bind';
-import { Bind } from '@gravionlabs/helix-core/bind';
-import { TimesCircleIcon } from '@gravionlabs/helix-core/icons';
-import { BaseStyle } from '@gravionlabs/helix-core/base';
-
-const style = /*css*/ `
+import * as i2 from "@angular/common";
+import { CommonModule } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Injectable, InjectionToken, NgModule, ViewEncapsulation, booleanAttribute, contentChild, contentChildren, effect, inject, input, model, output } from "@angular/core";
+import { HelixTemplate, SharedModule, TranslationKeys } from "@gravionlabs/helix-core/api";
+import { BaseComponent, PARENT_INSTANCE } from "@gravionlabs/helix-core/basecomponent";
+import * as i1 from "@gravionlabs/helix-core/bind";
+import { Bind } from "@gravionlabs/helix-core/bind";
+import { TimesCircleIcon } from "@gravionlabs/helix-core/icons";
+import { BaseStyle } from "@gravionlabs/helix-core/base";
+export * from "@gravionlabs/helix-core/types/chip";
+const style = `
     .h-chip {
         display: inline-flex;
         align-items: center;
@@ -64,246 +63,485 @@ const style = /*css*/ `
         outline-offset: dt('chip.remove.icon.focus.ring.offset');
     }
 `;
-
-const inlineStyles = {
-    root: ({ instance }) => ({
-        display: !instance.visible && 'none'
-    })
-};
+const inlineStyles = { root: ({ instance }) => ({ display: !instance.visible && "none" }) };
 const classes = {
-    root: ({ instance }) => [
-        'h-chip h-component',
-        {
-            'h-disabled': instance.disabled()
-        }
-    ],
-    image: 'h-chip-image',
-    icon: 'h-chip-icon',
-    label: 'h-chip-label',
-    removeIcon: 'h-chip-remove-icon'
+	root: ({ instance }) => ["h-chip h-component", { "h-disabled": instance.disabled() }],
+	image: "h-chip-image",
+	icon: "h-chip-icon",
+	label: "h-chip-label",
+	removeIcon: "h-chip-remove-icon"
 };
-class ChipStyle extends BaseStyle {
-    name = 'chip';
-    style = style;
-    classes = classes;
-    inlineStyles = inlineStyles;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChipStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChipStyle });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChipStyle, decorators: [{
-            type: Injectable
-        }] });
-/**
- *
- * Chip represents people using icons, labels and images.
- *
- * [Live Demo](https://www.primeng.org/chip)
- *
- * @module chipstyle
- *
- */
+var ChipStyle = class ChipStyle extends BaseStyle {
+	name = "chip";
+	style = style;
+	classes = classes;
+	inlineStyles = inlineStyles;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ChipStyle,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ChipStyle
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ChipStyle,
+	decorators: [{ type: Injectable }]
+});
 var ChipClasses;
-(function (ChipClasses) {
-    /**
-     * Class name of the root element
-     */
-    ChipClasses["root"] = "h-chip";
-    /**
-     * Class name of the image element
-     */
-    ChipClasses["image"] = "h-chip-image";
-    /**
-     * Class name of the icon element
-     */
-    ChipClasses["icon"] = "h-chip-icon";
-    /**
-     * Class name of the label element
-     */
-    ChipClasses["label"] = "h-chip-label";
-    /**
-     * Class name of the remove icon element
-     */
-    ChipClasses["removeIcon"] = "h-chip-remove-icon";
+(function(ChipClasses) {
+	ChipClasses["root"] = "h-chip";
+	ChipClasses["image"] = "h-chip-image";
+	ChipClasses["icon"] = "h-chip-icon";
+	ChipClasses["label"] = "h-chip-label";
+	ChipClasses["removeIcon"] = "h-chip-remove-icon";
 })(ChipClasses || (ChipClasses = {}));
-
-const CHIP_INSTANCE = new InjectionToken('CHIP_INSTANCE');
-/**
- * Chip represents people using icons, labels and images.
- * @group Components
- */
-class Chip extends BaseComponent {
-    componentName = 'Chip';
-    $pcChip = inject(CHIP_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    bindDirectiveInstance = inject(Bind, { self: true });
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
-    }
-    /**
-     * Defines the text to display.
-     * @group Props
-     */
-    label = model(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /**
-     * Defines the icon to display.
-     * @group Props
-     */
-    icon = model(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
-    /**
-     * Defines the image to display.
-     * @group Props
-     */
-    image = model(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "image" }] : /* istanbul ignore next */ []));
-    /**
-     * Alt attribute of the image.
-     * @group Props
-     */
-    alt = model(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
-    /**
-     * Class of the element.
-     * @deprecated since v20.0.0, use `class` instead.
-     * @group Props
-     */
-    styleClass = model(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "styleClass" }] : /* istanbul ignore next */ []));
-    /**
-     * When present, it specifies that the element should be disabled.
-     * @group Props
-     */
-    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Whether to display a remove icon.
-     * @group Props
-     */
-    removable = model(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "removable" }] : /* istanbul ignore next */ []));
-    /**
-     * Icon of the remove element.
-     * @group Props
-     */
-    removeIcon = model(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "removeIcon" }] : /* istanbul ignore next */ []));
-    /**
-     * Callback to invoke when a chip is removed.
-     * @param {MouseEvent} event - Mouse event.
-     * @group Emits
-     */
-    onRemove = output();
-    /**
-     * This event is triggered if an error occurs while loading an image file.
-     * @param {Event} event - Browser event.
-     * @group Emits
-     */
-    onImageError = output();
-    visible = true;
-    get removeAriaLabel() {
-        return this.config.getTranslation(TranslationKeys.ARIA)['removeLabel'];
-    }
-    /**
-     * Used to pass all properties of the chipProps to the Chip component.
-     * @group Props
-     */
-    chipProps = input(undefined, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "chipProps" }] : /* istanbul ignore next */ []));
-    _componentStyle = inject(ChipStyle);
-    /**
-     * Custom remove icon template.
-     * @group Templates
-     */
-    removeIconTemplate = contentChild('removeicon', { ...(ngDevMode ? { debugName: "removeIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    templates = contentChildren(HelixTemplate, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "templates" }] : /* istanbul ignore next */ []));
-    _removeIconTemplate;
-    onAfterContentInit() {
-        this.templates().forEach((item) => {
-            switch (item.getType()) {
-                case 'removeicon':
-                    this._removeIconTemplate = item.template;
-                    break;
-                default:
-                    this._removeIconTemplate = item.template;
-                    break;
-            }
-        });
-    }
-    constructor() {
-        super();
-        effect(() => {
-            const val = this.chipProps();
-            if (val && typeof val === 'object') {
-                Object.entries(val).forEach(([k, v]) => this[`_${k}`] !== v && (this[`_${k}`] = v));
-                if (val.label !== undefined) {
-                    this.label.set(val.label);
-                }
-                if (val.icon !== undefined) {
-                    this.icon.set(val.icon);
-                }
-                if (val.image !== undefined) {
-                    this.image.set(val.image);
-                }
-                if (val.alt !== undefined) {
-                    this.alt.set(val.alt);
-                }
-                if (val.styleClass !== undefined) {
-                    this.styleClass.set(val.styleClass);
-                }
-                if (val.removable !== undefined) {
-                    this.removable.set(val.removable);
-                }
-                if (val.removeIcon !== undefined) {
-                    this.removeIcon.set(val.removeIcon);
-                }
-            }
-        });
-    }
-    close(event) {
-        this.visible = false;
-        this.onRemove.emit(event);
-    }
-    onKeydown(event) {
-        if (event.key === 'Enter' || event.key === 'Backspace') {
-            this.close(event);
-        }
-    }
-    imageError(event) {
-        this.onImageError.emit(event);
-    }
-    get dataP() {
-        return this.cn({
-            removable: this.removable()
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Chip, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Chip, isStandalone: true, selector: "h-chip", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, removeIcon: { classPropertyName: "removeIcon", publicName: "removeIcon", isSignal: true, isRequired: false, transformFunction: null }, chipProps: { classPropertyName: "chipProps", publicName: "chipProps", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { label: "labelChange", icon: "iconChange", image: "imageChange", alt: "altChange", styleClass: "styleClassChange", removable: "removableChange", removeIcon: "removeIconChange", onRemove: "onRemove", onImageError: "onImageError" }, host: { properties: { "class": "cn(cx('root'), styleClass)", "style": "sx('root')", "attr.aria-label": "label", "attr.data-h": "dataP" } }, providers: [ChipStyle, { provide: CHIP_INSTANCE, useExisting: Chip }, { provide: PARENT_INSTANCE, useExisting: Chip }], queries: [{ propertyName: "removeIconTemplate", first: true, predicate: ["removeicon"], isSignal: true }, { propertyName: "templates", predicate: HelixTemplate, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: "<ng-content></ng-content>\n@if (image()) {\n  <img [hBind]=\"ptm('image')\" [class]=\"cx('image')\" [src]=\"image()\" (error)=\"imageError($event)\" [alt]=\"alt()\" />\n} @else {\n  @if (icon()) {\n    <span [hBind]=\"ptm('icon')\" [class]=\"icon()\" [ngClass]=\"cx('icon')\"></span>\n  }\n}\n@if (label()) {\n  <div [hBind]=\"ptm('label')\" [class]=\"cx('label')\">{{ label() }}</div>\n}\n@if (removable()) {\n  @if (!removeIconTemplate() && !_removeIconTemplate) {\n    @if (removeIcon()) {\n      <span\n        [hBind]=\"ptm('removeIcon')\"\n        [class]=\"removeIcon()\"\n        [ngClass]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n      ></span>\n    }\n    @if (!removeIcon()) {\n      <svg\n        [hBind]=\"ptm('removeIcon')\"\n        data-h-icon=\"times-circle\"\n        [class]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n        />\n    }\n  }\n  @if (removeIconTemplate() || _removeIconTemplate) {\n    <span\n      [hBind]=\"ptm('removeIcon')\"\n      [attr.tabindex]=\"disabled() ? -1 : 0\"\n      [class]=\"cx('removeIcon')\"\n      (click)=\"close($event)\"\n      (keydown)=\"onKeydown($event)\"\n      [attr.aria-label]=\"removeAriaLabel\"\n      role=\"button\"\n      >\n      <ng-template *ngTemplateOutlet=\"removeIconTemplate() || _removeIconTemplate\"></ng-template>\n    </span>\n  }\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TimesCircleIcon, selector: "[data-h-icon=\"times-circle\"]" }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: Bind, selector: "[hBind]", inputs: ["hBind"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Chip, decorators: [{
-            type: Component,
-            args: [{ selector: 'h-chip', standalone: true, imports: [CommonModule, TimesCircleIcon, SharedModule, Bind], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [ChipStyle, { provide: CHIP_INSTANCE, useExisting: Chip }, { provide: PARENT_INSTANCE, useExisting: Chip }], host: {
-                        '[class]': "cn(cx('root'), styleClass)",
-                        '[style]': "sx('root')",
-                        '[attr.aria-label]': 'label',
-                        '[attr.data-h]': 'dataP'
-                    }, hostDirectives: [Bind], template: "<ng-content></ng-content>\n@if (image()) {\n  <img [hBind]=\"ptm('image')\" [class]=\"cx('image')\" [src]=\"image()\" (error)=\"imageError($event)\" [alt]=\"alt()\" />\n} @else {\n  @if (icon()) {\n    <span [hBind]=\"ptm('icon')\" [class]=\"icon()\" [ngClass]=\"cx('icon')\"></span>\n  }\n}\n@if (label()) {\n  <div [hBind]=\"ptm('label')\" [class]=\"cx('label')\">{{ label() }}</div>\n}\n@if (removable()) {\n  @if (!removeIconTemplate() && !_removeIconTemplate) {\n    @if (removeIcon()) {\n      <span\n        [hBind]=\"ptm('removeIcon')\"\n        [class]=\"removeIcon()\"\n        [ngClass]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n      ></span>\n    }\n    @if (!removeIcon()) {\n      <svg\n        [hBind]=\"ptm('removeIcon')\"\n        data-h-icon=\"times-circle\"\n        [class]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n        />\n    }\n  }\n  @if (removeIconTemplate() || _removeIconTemplate) {\n    <span\n      [hBind]=\"ptm('removeIcon')\"\n      [attr.tabindex]=\"disabled() ? -1 : 0\"\n      [class]=\"cx('removeIcon')\"\n      (click)=\"close($event)\"\n      (keydown)=\"onKeydown($event)\"\n      [attr.aria-label]=\"removeAriaLabel\"\n      role=\"button\"\n      >\n      <ng-template *ngTemplateOutlet=\"removeIconTemplate() || _removeIconTemplate\"></ng-template>\n    </span>\n  }\n}\n" }]
-        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }, { type: i0.Output, args: ["labelChange"] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }, { type: i0.Output, args: ["iconChange"] }], image: [{ type: i0.Input, args: [{ isSignal: true, alias: "image", required: false }] }, { type: i0.Output, args: ["imageChange"] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }, { type: i0.Output, args: ["altChange"] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }, { type: i0.Output, args: ["styleClassChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], removable: [{ type: i0.Input, args: [{ isSignal: true, alias: "removable", required: false }] }, { type: i0.Output, args: ["removableChange"] }], removeIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeIcon", required: false }] }, { type: i0.Output, args: ["removeIconChange"] }], onRemove: [{ type: i0.Output, args: ["onRemove"] }], onImageError: [{ type: i0.Output, args: ["onImageError"] }], chipProps: [{ type: i0.Input, args: [{ isSignal: true, alias: "chipProps", required: false }] }], removeIconTemplate: [{ type: i0.ContentChild, args: ['removeicon', { ...{ descendants: false }, isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }] }] } });
-class ChipModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: ChipModule, imports: [Chip, SharedModule], exports: [Chip, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChipModule, imports: [Chip, SharedModule, SharedModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ChipModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [Chip, SharedModule],
-                    exports: [Chip, SharedModule]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+const CHIP_INSTANCE = new InjectionToken("CHIP_INSTANCE");
+var Chip = class Chip extends BaseComponent {
+	componentName = "Chip";
+	$pcChip = inject(CHIP_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	bindDirectiveInstance = inject(Bind, { self: true });
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptms(["host", "root"]));
+	}
+	label = model(void 0, ...ngDevMode ? [{ debugName: "label" }] : 	/* istanbul ignore next */ []);
+	icon = model(void 0, ...ngDevMode ? [{ debugName: "icon" }] : 	/* istanbul ignore next */ []);
+	image = model(void 0, ...ngDevMode ? [{ debugName: "image" }] : 	/* istanbul ignore next */ []);
+	alt = model(void 0, ...ngDevMode ? [{ debugName: "alt" }] : 	/* istanbul ignore next */ []);
+	styleClass = model(void 0, ...ngDevMode ? [{ debugName: "styleClass" }] : 	/* istanbul ignore next */ []);
+	disabled = input(false, {
+		...ngDevMode ? { debugName: "disabled" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	removable = model(false, ...ngDevMode ? [{ debugName: "removable" }] : 	/* istanbul ignore next */ []);
+	removeIcon = model(void 0, ...ngDevMode ? [{ debugName: "removeIcon" }] : 	/* istanbul ignore next */ []);
+	onRemove = output();
+	onImageError = output();
+	visible = true;
+	get removeAriaLabel() {
+		return this.config.getTranslation(TranslationKeys.ARIA)["removeLabel"];
+	}
+	chipProps = input(void 0, ...ngDevMode ? [{ debugName: "chipProps" }] : 	/* istanbul ignore next */ []);
+	_componentStyle = inject(ChipStyle);
+	removeIconTemplate = contentChild("removeicon", {
+		...ngDevMode ? { debugName: "removeIconTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	templates = contentChildren(HelixTemplate, ...ngDevMode ? [{ debugName: "templates" }] : 	/* istanbul ignore next */ []);
+	_removeIconTemplate;
+	onAfterContentInit() {
+		this.templates().forEach((item) => {
+			switch (item.getType()) {
+				case "removeicon":
+					this._removeIconTemplate = item.template;
+					break;
+				default:
+					this._removeIconTemplate = item.template;
+					break;
+			}
+		});
+	}
+	constructor() {
+		super();
+		effect(() => {
+			const val = this.chipProps();
+			if (val && typeof val === "object") {
+				Object.entries(val).forEach(([k, v]) => this[`_${k}`] !== v && (this[`_${k}`] = v));
+				if (val.label !== void 0) this.label.set(val.label);
+				if (val.icon !== void 0) this.icon.set(val.icon);
+				if (val.image !== void 0) this.image.set(val.image);
+				if (val.alt !== void 0) this.alt.set(val.alt);
+				if (val.styleClass !== void 0) this.styleClass.set(val.styleClass);
+				if (val.removable !== void 0) this.removable.set(val.removable);
+				if (val.removeIcon !== void 0) this.removeIcon.set(val.removeIcon);
+			}
+		});
+	}
+	close(event) {
+		this.visible = false;
+		this.onRemove.emit(event);
+	}
+	onKeydown(event) {
+		if (event.key === "Enter" || event.key === "Backspace") this.close(event);
+	}
+	imageError(event) {
+		this.onImageError.emit(event);
+	}
+	get dataP() {
+		return this.cn({ removable: this.removable() });
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: Chip,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: Chip,
+		isStandalone: true,
+		selector: "h-chip",
+		inputs: {
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			icon: {
+				classPropertyName: "icon",
+				publicName: "icon",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			image: {
+				classPropertyName: "image",
+				publicName: "image",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			alt: {
+				classPropertyName: "alt",
+				publicName: "alt",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			styleClass: {
+				classPropertyName: "styleClass",
+				publicName: "styleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			removable: {
+				classPropertyName: "removable",
+				publicName: "removable",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			removeIcon: {
+				classPropertyName: "removeIcon",
+				publicName: "removeIcon",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			chipProps: {
+				classPropertyName: "chipProps",
+				publicName: "chipProps",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			label: "labelChange",
+			icon: "iconChange",
+			image: "imageChange",
+			alt: "altChange",
+			styleClass: "styleClassChange",
+			removable: "removableChange",
+			removeIcon: "removeIconChange",
+			onRemove: "onRemove",
+			onImageError: "onImageError"
+		},
+		host: { properties: {
+			"class": "cn(cx('root'), styleClass)",
+			"style": "sx('root')",
+			"attr.aria-label": "label",
+			"attr.data-h": "dataP"
+		} },
+		providers: [
+			ChipStyle,
+			{
+				provide: CHIP_INSTANCE,
+				useExisting: Chip
+			},
+			{
+				provide: PARENT_INSTANCE,
+				useExisting: Chip
+			}
+		],
+		queries: [{
+			propertyName: "removeIconTemplate",
+			first: true,
+			predicate: ["removeicon"],
+			isSignal: true
+		}, {
+			propertyName: "templates",
+			predicate: HelixTemplate,
+			isSignal: true
+		}],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: "<ng-content></ng-content>\n@if (image()) {\n  <img [hBind]=\"ptm('image')\" [class]=\"cx('image')\" [src]=\"image()\" (error)=\"imageError($event)\" [alt]=\"alt()\" />\n} @else {\n  @if (icon()) {\n    <span [hBind]=\"ptm('icon')\" [class]=\"icon()\" [ngClass]=\"cx('icon')\"></span>\n  }\n}\n@if (label()) {\n  <div [hBind]=\"ptm('label')\" [class]=\"cx('label')\">{{ label() }}</div>\n}\n@if (removable()) {\n  @if (!removeIconTemplate() && !_removeIconTemplate) {\n    @if (removeIcon()) {\n      <span\n        [hBind]=\"ptm('removeIcon')\"\n        [class]=\"removeIcon()\"\n        [ngClass]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n      ></span>\n    }\n    @if (!removeIcon()) {\n      <svg\n        [hBind]=\"ptm('removeIcon')\"\n        data-h-icon=\"times-circle\"\n        [class]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n        />\n    }\n  }\n  @if (removeIconTemplate() || _removeIconTemplate) {\n    <span\n      [hBind]=\"ptm('removeIcon')\"\n      [attr.tabindex]=\"disabled() ? -1 : 0\"\n      [class]=\"cx('removeIcon')\"\n      (click)=\"close($event)\"\n      (keydown)=\"onKeydown($event)\"\n      [attr.aria-label]=\"removeAriaLabel\"\n      role=\"button\"\n      >\n      <ng-template *ngTemplateOutlet=\"removeIconTemplate() || _removeIconTemplate\"></ng-template>\n    </span>\n  }\n}\n",
+		dependencies: [
+			{
+				kind: "ngmodule",
+				type: CommonModule
+			},
+			{
+				kind: "directive",
+				type: i2.NgClass,
+				selector: "[ngClass]",
+				inputs: ["class", "ngClass"]
+			},
+			{
+				kind: "directive",
+				type: i2.NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "component",
+				type: TimesCircleIcon,
+				selector: "[data-h-icon=\"times-circle\"]"
+			},
+			{
+				kind: "ngmodule",
+				type: SharedModule
+			},
+			{
+				kind: "directive",
+				type: Bind,
+				selector: "[hBind]",
+				inputs: ["hBind"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush,
+		encapsulation: i0.ViewEncapsulation.None
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: Chip,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "h-chip",
+			standalone: true,
+			imports: [
+				CommonModule,
+				TimesCircleIcon,
+				SharedModule,
+				Bind
+			],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			providers: [
+				ChipStyle,
+				{
+					provide: CHIP_INSTANCE,
+					useExisting: Chip
+				},
+				{
+					provide: PARENT_INSTANCE,
+					useExisting: Chip
+				}
+			],
+			host: {
+				"[class]": "cn(cx('root'), styleClass)",
+				"[style]": "sx('root')",
+				"[attr.aria-label]": "label",
+				"[attr.data-h]": "dataP"
+			},
+			hostDirectives: [Bind],
+			template: "<ng-content></ng-content>\n@if (image()) {\n  <img [hBind]=\"ptm('image')\" [class]=\"cx('image')\" [src]=\"image()\" (error)=\"imageError($event)\" [alt]=\"alt()\" />\n} @else {\n  @if (icon()) {\n    <span [hBind]=\"ptm('icon')\" [class]=\"icon()\" [ngClass]=\"cx('icon')\"></span>\n  }\n}\n@if (label()) {\n  <div [hBind]=\"ptm('label')\" [class]=\"cx('label')\">{{ label() }}</div>\n}\n@if (removable()) {\n  @if (!removeIconTemplate() && !_removeIconTemplate) {\n    @if (removeIcon()) {\n      <span\n        [hBind]=\"ptm('removeIcon')\"\n        [class]=\"removeIcon()\"\n        [ngClass]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n      ></span>\n    }\n    @if (!removeIcon()) {\n      <svg\n        [hBind]=\"ptm('removeIcon')\"\n        data-h-icon=\"times-circle\"\n        [class]=\"cx('removeIcon')\"\n        (click)=\"close($event)\"\n        (keydown)=\"onKeydown($event)\"\n        [attr.tabindex]=\"disabled() ? -1 : 0\"\n        [attr.aria-label]=\"removeAriaLabel\"\n        role=\"button\"\n        />\n    }\n  }\n  @if (removeIconTemplate() || _removeIconTemplate) {\n    <span\n      [hBind]=\"ptm('removeIcon')\"\n      [attr.tabindex]=\"disabled() ? -1 : 0\"\n      [class]=\"cx('removeIcon')\"\n      (click)=\"close($event)\"\n      (keydown)=\"onKeydown($event)\"\n      [attr.aria-label]=\"removeAriaLabel\"\n      role=\"button\"\n      >\n      <ng-template *ngTemplateOutlet=\"removeIconTemplate() || _removeIconTemplate\"></ng-template>\n    </span>\n  }\n}\n"
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["labelChange"]
+		}],
+		icon: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "icon",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["iconChange"]
+		}],
+		image: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "image",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["imageChange"]
+		}],
+		alt: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "alt",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["altChange"]
+		}],
+		styleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "styleClass",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["styleClassChange"]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}],
+		removable: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "removable",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["removableChange"]
+		}],
+		removeIcon: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "removeIcon",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["removeIconChange"]
+		}],
+		onRemove: [{
+			type: i0.Output,
+			args: ["onRemove"]
+		}],
+		onImageError: [{
+			type: i0.Output,
+			args: ["onImageError"]
+		}],
+		chipProps: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "chipProps",
+				required: false
+			}]
+		}],
+		removeIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["removeicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		templates: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }]
+		}]
+	}
+});
+var ChipModule = class ChipModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ChipModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ChipModule,
+		imports: [Chip, SharedModule],
+		exports: [Chip, SharedModule]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ChipModule,
+		imports: [
+			Chip,
+			SharedModule,
+			SharedModule
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ChipModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [Chip, SharedModule],
+			exports: [Chip, SharedModule]
+		}]
+	}]
+});
 export { Chip, ChipClasses, ChipModule, ChipStyle };
-//# sourceMappingURL=gravionlabs-helix-core-chip.mjs.map
+
+//# sourceMappingURL=gravionlabs-helix-core-chip.mjs.map