@gravionlabs/helix-core 22.1.2 → 22.1.3

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

@@ -1,345 +1,467 @@
-import * as i0 from '@angular/core';
-import { input, booleanAttribute, Directive, NgModule } from '@angular/core';
-import { getTargetElement, hasClass, removeClass, addClass, isElement } from '@gravionlabs/helix-core/uix/utils';
-
-/**
- * StyleClass manages css classes declaratively to during enter/leave animations or just to toggle classes on an element.
- * @group Components
- */
-class StyleClass {
-    el;
-    renderer;
-    zone;
-    constructor(el, renderer, zone) {
-        this.el = el;
-        this.renderer = renderer;
-        this.zone = zone;
-    }
-    /**
-     * Selector to define the target element. Available selectors are '@next', '@prev', '@parent' and '@grandparent'.
-     * @group Props
-     */
-    selector = input(undefined, { ...(ngDevMode ? { debugName: "selector" } : /* istanbul ignore next */ {}), alias: "hStyleClass" });
-    /**
-     * Style class to add when item begins to get displayed.
-     * @group Props
-     */
-    enterFromClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "enterFromClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class to add during enter animation.
-     * @group Props
-     */
-    enterActiveClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "enterActiveClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class to add when item begins to get displayed.
-     * @group Props
-     */
-    enterToClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "enterToClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class to add when item begins to get hidden.
-     * @group Props
-     */
-    leaveFromClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "leaveFromClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class to add during leave animation.
-     * @group Props
-     */
-    leaveActiveClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "leaveActiveClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class to add when leave animation is completed.
-     * @group Props
-     */
-    leaveToClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "leaveToClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Whether to trigger leave animation when outside of the element is clicked.
-     * @group Props
-     */
-    hideOnOutsideClick = input(undefined, { ...(ngDevMode ? { debugName: "hideOnOutsideClick" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Adds or removes a class when no enter-leave animation is required.
-     * @group Props
-     */
-    toggleClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "toggleClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Whether to trigger leave animation when escape key pressed.
-     * @group Props
-     */
-    hideOnEscape = input(undefined, { ...(ngDevMode ? { debugName: "hideOnEscape" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Whether to trigger leave animation when the target element resized.
-     * @group Props
-     */
-    hideOnResize = input(undefined, { ...(ngDevMode ? { debugName: "hideOnResize" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Target element to listen resize. Valid values are "window", "document" or target element selector.
-     * @group Props
-     */
-    resizeSelector = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "resizeSelector" }] : /* istanbul ignore next */ []));
-    eventListener;
-    documentClickListener;
-    documentKeydownListener;
-    windowResizeListener;
-    resizeObserver;
-    target;
-    enterListener;
-    leaveListener;
-    animating;
-    _enterClass;
-    _leaveClass;
-    _resizeTarget;
-    clickListener() {
-        this.target ||= getTargetElement(this.selector(), this.el.nativeElement);
-        if (this.toggleClass()) {
-            this.toggle();
-        }
-        else {
-            if (this.target?.offsetParent === null)
-                this.enter();
-            else
-                this.leave();
-        }
-    }
-    toggle() {
-        const toggleClass = this.toggleClass();
-        if (hasClass(this.target, toggleClass))
-            removeClass(this.target, toggleClass);
-        else
-            addClass(this.target, toggleClass);
-    }
-    enter() {
-        const enterActiveClass = this.enterActiveClass();
-        if (enterActiveClass) {
-            if (!this.animating) {
-                this.animating = true;
-                const enterFromClass = this.enterFromClass();
-                if (enterActiveClass.includes('slidedown')) {
-                    this.target.style.height = '0px';
-                    removeClass(this.target, enterFromClass || 'hidden');
-                    this.target.style.maxHeight = this.target.scrollHeight + 'px';
-                    addClass(this.target, enterFromClass || 'hidden');
-                    this.target.style.height = '';
-                }
-                addClass(this.target, enterActiveClass);
-                if (enterFromClass) {
-                    removeClass(this.target, enterFromClass);
-                }
-                this.enterListener = this.renderer.listen(this.target, 'animationend', () => {
-                    removeClass(this.target, this.enterActiveClass());
-                    const enterToClass = this.enterToClass();
-                    if (enterToClass) {
-                        addClass(this.target, enterToClass);
-                    }
-                    this.enterListener && this.enterListener();
-                    if (this.enterActiveClass()?.includes('slidedown')) {
-                        this.target.style.maxHeight = '';
-                    }
-                    this.animating = false;
-                });
-            }
-        }
-        else {
-            const enterFromClass = this.enterFromClass();
-            if (enterFromClass) {
-                removeClass(this.target, enterFromClass);
-            }
-            const enterToClass = this.enterToClass();
-            if (enterToClass) {
-                addClass(this.target, enterToClass);
-            }
-        }
-        if (this.hideOnOutsideClick()) {
-            this.bindDocumentClickListener();
-        }
-        if (this.hideOnEscape()) {
-            this.bindDocumentKeydownListener();
-        }
-        if (this.hideOnResize()) {
-            this.bindResizeListener();
-        }
-    }
-    leave() {
-        const leaveActiveClass = this.leaveActiveClass();
-        if (leaveActiveClass) {
-            if (!this.animating) {
-                this.animating = true;
-                addClass(this.target, leaveActiveClass);
-                const leaveFromClass = this.leaveFromClass();
-                if (leaveFromClass) {
-                    removeClass(this.target, leaveFromClass);
-                }
-                this.leaveListener = this.renderer.listen(this.target, 'animationend', () => {
-                    removeClass(this.target, this.leaveActiveClass());
-                    const leaveToClass = this.leaveToClass();
-                    if (leaveToClass) {
-                        addClass(this.target, leaveToClass);
-                    }
-                    this.leaveListener && this.leaveListener();
-                    this.animating = false;
-                });
-            }
-        }
-        else {
-            const leaveFromClass = this.leaveFromClass();
-            if (leaveFromClass) {
-                removeClass(this.target, leaveFromClass);
-            }
-            const leaveToClass = this.leaveToClass();
-            if (leaveToClass) {
-                addClass(this.target, leaveToClass);
-            }
-        }
-        if (this.hideOnOutsideClick()) {
-            this.unbindDocumentClickListener();
-        }
-        if (this.hideOnEscape()) {
-            this.unbindDocumentKeydownListener();
-        }
-        if (this.hideOnResize()) {
-            this.unbindResizeListener();
-        }
-    }
-    bindDocumentClickListener() {
-        if (!this.documentClickListener) {
-            this.documentClickListener = this.renderer.listen(this.el.nativeElement.ownerDocument, 'click', (event) => {
-                if (!this.isVisible() || getComputedStyle(this.target).getPropertyValue('position') === 'static')
-                    this.unbindDocumentClickListener();
-                else if (this.isOutsideClick(event))
-                    this.leave();
-            });
-        }
-    }
-    bindDocumentKeydownListener() {
-        if (!this.documentKeydownListener) {
-            this.zone.runOutsideAngular(() => {
-                this.documentKeydownListener = this.renderer.listen(this.el.nativeElement.ownerDocument, 'keydown', (event) => {
-                    const { key, keyCode, which, type } = event;
-                    if (!this.isVisible() || getComputedStyle(this.target).getPropertyValue('position') === 'static')
-                        this.unbindDocumentKeydownListener();
-                    if (this.isVisible() && key === 'Escape' && keyCode === 27 && which === 27)
-                        this.leave();
-                });
-            });
-        }
-    }
-    isVisible() {
-        return this.target.offsetParent !== null;
-    }
-    isOutsideClick(event) {
-        return !this.el.nativeElement.isSameNode(event.target) && !this.el.nativeElement.contains(event.target) && !this.target.contains(event.target);
-    }
-    unbindDocumentClickListener() {
-        if (this.documentClickListener) {
-            this.documentClickListener();
-            this.documentClickListener = null;
-        }
-    }
-    unbindDocumentKeydownListener() {
-        if (this.documentKeydownListener) {
-            this.documentKeydownListener();
-            this.documentKeydownListener = null;
-        }
-    }
-    bindResizeListener() {
-        this._resizeTarget = getTargetElement(this.resizeSelector());
-        if (isElement(this._resizeTarget)) {
-            this.bindElementResizeListener();
-        }
-        else {
-            this.bindWindowResizeListener();
-        }
-    }
-    unbindResizeListener() {
-        this.unbindWindowResizeListener();
-        this.unbindElementResizeListener();
-    }
-    bindWindowResizeListener() {
-        if (!this.windowResizeListener) {
-            this.zone.runOutsideAngular(() => {
-                this.windowResizeListener = this.renderer.listen(window, 'resize', () => {
-                    if (!this.isVisible()) {
-                        this.unbindWindowResizeListener();
-                    }
-                    else {
-                        this.leave();
-                    }
-                });
-            });
-        }
-    }
-    unbindWindowResizeListener() {
-        if (this.windowResizeListener) {
-            this.windowResizeListener();
-            this.windowResizeListener = null;
-        }
-    }
-    bindElementResizeListener() {
-        if (!this.resizeObserver && this._resizeTarget) {
-            let isFirstResize = true;
-            this.resizeObserver = new ResizeObserver(() => {
-                if (isFirstResize) {
-                    isFirstResize = false;
-                    return;
-                }
-                if (this.isVisible()) {
-                    this.leave();
-                }
-            });
-            this.resizeObserver.observe(this._resizeTarget);
-        }
-    }
-    unbindElementResizeListener() {
-        if (this.resizeObserver) {
-            this.resizeObserver.disconnect();
-            this.resizeObserver = undefined;
-        }
-    }
-    ngOnDestroy() {
-        this.target = null;
-        this._resizeTarget = null;
-        if (this.eventListener) {
-            this.eventListener();
-        }
-        this.unbindDocumentClickListener();
-        this.unbindDocumentKeydownListener();
-        this.unbindResizeListener();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: StyleClass, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: StyleClass, isStandalone: true, selector: "[hStyleClass]", inputs: { selector: { classPropertyName: "selector", publicName: "hStyleClass", isSignal: true, isRequired: false, transformFunction: null }, enterFromClass: { classPropertyName: "enterFromClass", publicName: "enterFromClass", isSignal: true, isRequired: false, transformFunction: null }, enterActiveClass: { classPropertyName: "enterActiveClass", publicName: "enterActiveClass", isSignal: true, isRequired: false, transformFunction: null }, enterToClass: { classPropertyName: "enterToClass", publicName: "enterToClass", isSignal: true, isRequired: false, transformFunction: null }, leaveFromClass: { classPropertyName: "leaveFromClass", publicName: "leaveFromClass", isSignal: true, isRequired: false, transformFunction: null }, leaveActiveClass: { classPropertyName: "leaveActiveClass", publicName: "leaveActiveClass", isSignal: true, isRequired: false, transformFunction: null }, leaveToClass: { classPropertyName: "leaveToClass", publicName: "leaveToClass", isSignal: true, isRequired: false, transformFunction: null }, hideOnOutsideClick: { classPropertyName: "hideOnOutsideClick", publicName: "hideOnOutsideClick", isSignal: true, isRequired: false, transformFunction: null }, toggleClass: { classPropertyName: "toggleClass", publicName: "toggleClass", isSignal: true, isRequired: false, transformFunction: null }, hideOnEscape: { classPropertyName: "hideOnEscape", publicName: "hideOnEscape", isSignal: true, isRequired: false, transformFunction: null }, hideOnResize: { classPropertyName: "hideOnResize", publicName: "hideOnResize", isSignal: true, isRequired: false, transformFunction: null }, resizeSelector: { classPropertyName: "resizeSelector", publicName: "resizeSelector", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "clickListener()" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: StyleClass, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[hStyleClass]',
-                    standalone: true,
-                    host: {
-                        '(click)': 'clickListener()'
-                    }
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }], propDecorators: { selector: [{ type: i0.Input, args: [{ isSignal: true, alias: "hStyleClass", required: false }] }], enterFromClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "enterFromClass", required: false }] }], enterActiveClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "enterActiveClass", required: false }] }], enterToClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "enterToClass", required: false }] }], leaveFromClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "leaveFromClass", required: false }] }], leaveActiveClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "leaveActiveClass", required: false }] }], leaveToClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "leaveToClass", required: false }] }], hideOnOutsideClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnOutsideClick", required: false }] }], toggleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleClass", required: false }] }], hideOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnEscape", required: false }] }], hideOnResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnResize", required: false }] }], resizeSelector: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizeSelector", required: false }] }] } });
-class StyleClassModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: StyleClassModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: StyleClassModule, imports: [StyleClass], exports: [StyleClass] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: StyleClassModule });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: StyleClassModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [StyleClass],
-                    exports: [StyleClass]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import * as i0 from "@angular/core";
+import { Directive, NgModule, booleanAttribute, input } from "@angular/core";
+import { addClass, getTargetElement, hasClass, isElement, removeClass } from "@gravionlabs/helix-core/uix/utils";
+var StyleClass = class StyleClass {
+	el;
+	renderer;
+	zone;
+	constructor(el, renderer, zone) {
+		this.el = el;
+		this.renderer = renderer;
+		this.zone = zone;
+	}
+	selector = input(void 0, {
+		...ngDevMode ? { debugName: "selector" } : 		/* istanbul ignore next */ {},
+		alias: "hStyleClass"
+	});
+	enterFromClass = input(...ngDevMode ? [void 0, { debugName: "enterFromClass" }] : 	/* istanbul ignore next */ []);
+	enterActiveClass = input(...ngDevMode ? [void 0, { debugName: "enterActiveClass" }] : 	/* istanbul ignore next */ []);
+	enterToClass = input(...ngDevMode ? [void 0, { debugName: "enterToClass" }] : 	/* istanbul ignore next */ []);
+	leaveFromClass = input(...ngDevMode ? [void 0, { debugName: "leaveFromClass" }] : 	/* istanbul ignore next */ []);
+	leaveActiveClass = input(...ngDevMode ? [void 0, { debugName: "leaveActiveClass" }] : 	/* istanbul ignore next */ []);
+	leaveToClass = input(...ngDevMode ? [void 0, { debugName: "leaveToClass" }] : 	/* istanbul ignore next */ []);
+	hideOnOutsideClick = input(void 0, {
+		...ngDevMode ? { debugName: "hideOnOutsideClick" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	toggleClass = input(...ngDevMode ? [void 0, { debugName: "toggleClass" }] : 	/* istanbul ignore next */ []);
+	hideOnEscape = input(void 0, {
+		...ngDevMode ? { debugName: "hideOnEscape" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	hideOnResize = input(void 0, {
+		...ngDevMode ? { debugName: "hideOnResize" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	resizeSelector = input(...ngDevMode ? [void 0, { debugName: "resizeSelector" }] : 	/* istanbul ignore next */ []);
+	eventListener;
+	documentClickListener;
+	documentKeydownListener;
+	windowResizeListener;
+	resizeObserver;
+	target;
+	enterListener;
+	leaveListener;
+	animating;
+	_enterClass;
+	_leaveClass;
+	_resizeTarget;
+	clickListener() {
+		this.target ||= getTargetElement(this.selector(), this.el.nativeElement);
+		if (this.toggleClass()) this.toggle();
+		else if (this.target?.offsetParent === null) this.enter();
+		else this.leave();
+	}
+	toggle() {
+		const toggleClass = this.toggleClass();
+		if (hasClass(this.target, toggleClass)) removeClass(this.target, toggleClass);
+		else addClass(this.target, toggleClass);
+	}
+	enter() {
+		const enterActiveClass = this.enterActiveClass();
+		if (enterActiveClass) {
+			if (!this.animating) {
+				this.animating = true;
+				const enterFromClass = this.enterFromClass();
+				if (enterActiveClass.includes("slidedown")) {
+					this.target.style.height = "0px";
+					removeClass(this.target, enterFromClass || "hidden");
+					this.target.style.maxHeight = this.target.scrollHeight + "px";
+					addClass(this.target, enterFromClass || "hidden");
+					this.target.style.height = "";
+				}
+				addClass(this.target, enterActiveClass);
+				if (enterFromClass) removeClass(this.target, enterFromClass);
+				this.enterListener = this.renderer.listen(this.target, "animationend", () => {
+					removeClass(this.target, this.enterActiveClass());
+					const enterToClass = this.enterToClass();
+					if (enterToClass) addClass(this.target, enterToClass);
+					this.enterListener && this.enterListener();
+					if (this.enterActiveClass()?.includes("slidedown")) this.target.style.maxHeight = "";
+					this.animating = false;
+				});
+			}
+		} else {
+			const enterFromClass = this.enterFromClass();
+			if (enterFromClass) removeClass(this.target, enterFromClass);
+			const enterToClass = this.enterToClass();
+			if (enterToClass) addClass(this.target, enterToClass);
+		}
+		if (this.hideOnOutsideClick()) this.bindDocumentClickListener();
+		if (this.hideOnEscape()) this.bindDocumentKeydownListener();
+		if (this.hideOnResize()) this.bindResizeListener();
+	}
+	leave() {
+		const leaveActiveClass = this.leaveActiveClass();
+		if (leaveActiveClass) {
+			if (!this.animating) {
+				this.animating = true;
+				addClass(this.target, leaveActiveClass);
+				const leaveFromClass = this.leaveFromClass();
+				if (leaveFromClass) removeClass(this.target, leaveFromClass);
+				this.leaveListener = this.renderer.listen(this.target, "animationend", () => {
+					removeClass(this.target, this.leaveActiveClass());
+					const leaveToClass = this.leaveToClass();
+					if (leaveToClass) addClass(this.target, leaveToClass);
+					this.leaveListener && this.leaveListener();
+					this.animating = false;
+				});
+			}
+		} else {
+			const leaveFromClass = this.leaveFromClass();
+			if (leaveFromClass) removeClass(this.target, leaveFromClass);
+			const leaveToClass = this.leaveToClass();
+			if (leaveToClass) addClass(this.target, leaveToClass);
+		}
+		if (this.hideOnOutsideClick()) this.unbindDocumentClickListener();
+		if (this.hideOnEscape()) this.unbindDocumentKeydownListener();
+		if (this.hideOnResize()) this.unbindResizeListener();
+	}
+	bindDocumentClickListener() {
+		if (!this.documentClickListener) this.documentClickListener = this.renderer.listen(this.el.nativeElement.ownerDocument, "click", (event) => {
+			if (!this.isVisible() || getComputedStyle(this.target).getPropertyValue("position") === "static") this.unbindDocumentClickListener();
+			else if (this.isOutsideClick(event)) this.leave();
+		});
+	}
+	bindDocumentKeydownListener() {
+		if (!this.documentKeydownListener) this.zone.runOutsideAngular(() => {
+			this.documentKeydownListener = this.renderer.listen(this.el.nativeElement.ownerDocument, "keydown", (event) => {
+				const { key, keyCode, which, type } = event;
+				if (!this.isVisible() || getComputedStyle(this.target).getPropertyValue("position") === "static") this.unbindDocumentKeydownListener();
+				if (this.isVisible() && key === "Escape" && keyCode === 27 && which === 27) this.leave();
+			});
+		});
+	}
+	isVisible() {
+		return this.target.offsetParent !== null;
+	}
+	isOutsideClick(event) {
+		return !this.el.nativeElement.isSameNode(event.target) && !this.el.nativeElement.contains(event.target) && !this.target.contains(event.target);
+	}
+	unbindDocumentClickListener() {
+		if (this.documentClickListener) {
+			this.documentClickListener();
+			this.documentClickListener = null;
+		}
+	}
+	unbindDocumentKeydownListener() {
+		if (this.documentKeydownListener) {
+			this.documentKeydownListener();
+			this.documentKeydownListener = null;
+		}
+	}
+	bindResizeListener() {
+		this._resizeTarget = getTargetElement(this.resizeSelector());
+		if (isElement(this._resizeTarget)) this.bindElementResizeListener();
+		else this.bindWindowResizeListener();
+	}
+	unbindResizeListener() {
+		this.unbindWindowResizeListener();
+		this.unbindElementResizeListener();
+	}
+	bindWindowResizeListener() {
+		if (!this.windowResizeListener) this.zone.runOutsideAngular(() => {
+			this.windowResizeListener = this.renderer.listen(window, "resize", () => {
+				if (!this.isVisible()) this.unbindWindowResizeListener();
+				else this.leave();
+			});
+		});
+	}
+	unbindWindowResizeListener() {
+		if (this.windowResizeListener) {
+			this.windowResizeListener();
+			this.windowResizeListener = null;
+		}
+	}
+	bindElementResizeListener() {
+		if (!this.resizeObserver && this._resizeTarget) {
+			let isFirstResize = true;
+			this.resizeObserver = new ResizeObserver(() => {
+				if (isFirstResize) {
+					isFirstResize = false;
+					return;
+				}
+				if (this.isVisible()) this.leave();
+			});
+			this.resizeObserver.observe(this._resizeTarget);
+		}
+	}
+	unbindElementResizeListener() {
+		if (this.resizeObserver) {
+			this.resizeObserver.disconnect();
+			this.resizeObserver = void 0;
+		}
+	}
+	ngOnDestroy() {
+		this.target = null;
+		this._resizeTarget = null;
+		if (this.eventListener) this.eventListener();
+		this.unbindDocumentClickListener();
+		this.unbindDocumentKeydownListener();
+		this.unbindResizeListener();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: StyleClass,
+		deps: [
+			{ token: i0.ElementRef },
+			{ token: i0.Renderer2 },
+			{ token: i0.NgZone }
+		],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.1",
+		type: StyleClass,
+		isStandalone: true,
+		selector: "[hStyleClass]",
+		inputs: {
+			selector: {
+				classPropertyName: "selector",
+				publicName: "hStyleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			enterFromClass: {
+				classPropertyName: "enterFromClass",
+				publicName: "enterFromClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			enterActiveClass: {
+				classPropertyName: "enterActiveClass",
+				publicName: "enterActiveClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			enterToClass: {
+				classPropertyName: "enterToClass",
+				publicName: "enterToClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			leaveFromClass: {
+				classPropertyName: "leaveFromClass",
+				publicName: "leaveFromClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			leaveActiveClass: {
+				classPropertyName: "leaveActiveClass",
+				publicName: "leaveActiveClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			leaveToClass: {
+				classPropertyName: "leaveToClass",
+				publicName: "leaveToClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			hideOnOutsideClick: {
+				classPropertyName: "hideOnOutsideClick",
+				publicName: "hideOnOutsideClick",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			toggleClass: {
+				classPropertyName: "toggleClass",
+				publicName: "toggleClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			hideOnEscape: {
+				classPropertyName: "hideOnEscape",
+				publicName: "hideOnEscape",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			hideOnResize: {
+				classPropertyName: "hideOnResize",
+				publicName: "hideOnResize",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			resizeSelector: {
+				classPropertyName: "resizeSelector",
+				publicName: "resizeSelector",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { listeners: { "click": "clickListener()" } },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: StyleClass,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "[hStyleClass]",
+			standalone: true,
+			host: { "(click)": "clickListener()" }
+		}]
+	}],
+	ctorParameters: () => [
+		{ type: i0.ElementRef },
+		{ type: i0.Renderer2 },
+		{ type: i0.NgZone }
+	],
+	propDecorators: {
+		selector: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hStyleClass",
+				required: false
+			}]
+		}],
+		enterFromClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "enterFromClass",
+				required: false
+			}]
+		}],
+		enterActiveClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "enterActiveClass",
+				required: false
+			}]
+		}],
+		enterToClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "enterToClass",
+				required: false
+			}]
+		}],
+		leaveFromClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "leaveFromClass",
+				required: false
+			}]
+		}],
+		leaveActiveClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "leaveActiveClass",
+				required: false
+			}]
+		}],
+		leaveToClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "leaveToClass",
+				required: false
+			}]
+		}],
+		hideOnOutsideClick: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hideOnOutsideClick",
+				required: false
+			}]
+		}],
+		toggleClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "toggleClass",
+				required: false
+			}]
+		}],
+		hideOnEscape: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hideOnEscape",
+				required: false
+			}]
+		}],
+		hideOnResize: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "hideOnResize",
+				required: false
+			}]
+		}],
+		resizeSelector: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "resizeSelector",
+				required: false
+			}]
+		}]
+	}
+});
+var StyleClassModule = class StyleClassModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: StyleClassModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: StyleClassModule,
+		imports: [StyleClass],
+		exports: [StyleClass]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: StyleClassModule
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: StyleClassModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [StyleClass],
+			exports: [StyleClass]
+		}]
+	}]
+});
 export { StyleClass, StyleClassModule };
-//# sourceMappingURL=gravionlabs-helix-core-styleclass.mjs.map
+
+//# sourceMappingURL=gravionlabs-helix-core-styleclass.mjs.map