@gravionlabs/helix-core 22.1.2 → 22.1.4

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

@@ -1,14 +1,13 @@
-import * as i2 from '@angular/common';
-import { isPlatformBrowser, CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, inject, input, contentChild, contentChildren, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import { 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, BindModule } from '@gravionlabs/helix-core/bind';
-import { BaseStyle } from '@gravionlabs/helix-core/base';
-
-const style = /*css*/ `
+import * as i2 from "@angular/common";
+import { CommonModule, isPlatformBrowser } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Injectable, InjectionToken, NgModule, ViewEncapsulation, contentChild, contentChildren, inject, input } from "@angular/core";
+import { 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, BindModule } from "@gravionlabs/helix-core/bind";
+import { BaseStyle } from "@gravionlabs/helix-core/base";
+const style = `
     .h-imagecompare {
         position: relative;
         overflow: hidden;
@@ -94,162 +93,346 @@ const style = /*css*/ `
         width: dt('imagecompare.handle.hover.size');
     }
 `;
-
 const classes = {
-    root: 'h-imagecompare',
-    slider: 'h-imagecompare-slider'
+	root: "h-imagecompare",
+	slider: "h-imagecompare-slider"
 };
-class ImageCompareStyle extends BaseStyle {
-    name = 'imagecompare';
-    style = style;
-    classes = classes;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareStyle });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareStyle, decorators: [{
-            type: Injectable
-        }] });
-/**
- *
- * ImageCompare compares two images side by side with a slider.
- *
- * [Live Demo](https://www.primeng.org/imagecompare/)
- *
- * @module imagecomparestyle
- *
- */
+var ImageCompareStyle = class ImageCompareStyle extends BaseStyle {
+	name = "imagecompare";
+	style = style;
+	classes = classes;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImageCompareStyle,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImageCompareStyle
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ImageCompareStyle,
+	decorators: [{ type: Injectable }]
+});
 var ImageCompareClasses;
-(function (ImageCompareClasses) {
-    /**
-     * Class name of the root element
-     */
-    ImageCompareClasses["root"] = "h-imagecompare";
-    /**
-     * Class name of the slider element
-     */
-    ImageCompareClasses["slider"] = "h-imagecompare-slider";
+(function(ImageCompareClasses) {
+	ImageCompareClasses["root"] = "h-imagecompare";
+	ImageCompareClasses["slider"] = "h-imagecompare-slider";
 })(ImageCompareClasses || (ImageCompareClasses = {}));
-
-const IMAGECOMPARE_INSTANCE = new InjectionToken('IMAGECOMPARE_INSTANCE');
-/**
- * Compare two images side by side with a slider.
- * @group Components
- */
-class ImageCompare extends BaseComponent {
-    componentName = 'ImageCompare';
-    $pcImageCompare = inject(IMAGECOMPARE_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    bindDirectiveInstance = inject(Bind, { self: true });
-    /**
-     * Index of the element in tabbing order.
-     * @defaultValue 0
-     * @group Props
-     */
-    tabindex = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "tabindex" }] : /* istanbul ignore next */ []));
-    /**
-     * Defines a string value that labels an interactive element.
-     * @group Props
-     */
-    ariaLabelledby = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "ariaLabelledby" }] : /* istanbul ignore next */ []));
-    /**
-     * Identifier of the underlying input element.
-     * @group Props
-     */
-    ariaLabel = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    /**
-     * Custom left side template.
-     * @group Templates
-     */
-    leftTemplate = contentChild('left', { ...(ngDevMode ? { debugName: "leftTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom right side template.
-     * @group Templates
-     */
-    rightTemplate = contentChild('right', { ...(ngDevMode ? { debugName: "rightTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    _leftTemplate;
-    _rightTemplate;
-    templates = contentChildren(HelixTemplate, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "templates" }] : /* istanbul ignore next */ []));
-    _componentStyle = inject(ImageCompareStyle);
-    mutationObserver;
-    isRTL = false;
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
-    }
-    onInit() {
-        this.updateDirection();
-        this.observeDirectionChanges();
-    }
-    onAfterContentInit() {
-        this.templates().forEach((item) => {
-            switch (item.getType()) {
-                case 'left':
-                    this._leftTemplate = item.template;
-                    break;
-                case 'right':
-                    this._rightTemplate = item.template;
-                    break;
-            }
-        });
-    }
-    onSlide(event) {
-        const value = event.target.value;
-        const image = event.target.previousElementSibling;
-        if (this.isRTL) {
-            image.style.clipPath = `polygon(${100 - value}% 0, 100% 0, 100% 100%, ${100 - value}% 100%)`;
-        }
-        else {
-            image.style.clipPath = `polygon(0 0, ${value}% 0, ${value}% 100%, 0 100%)`;
-        }
-    }
-    updateDirection() {
-        this.isRTL = !!this.el.nativeElement.closest('[dir="rtl"]');
-    }
-    observeDirectionChanges() {
-        if (isPlatformBrowser(this.platformId)) {
-            const targetNode = document?.documentElement;
-            const config = { attributes: true, attributeFilter: ['dir'] };
-            this.mutationObserver = new MutationObserver(() => {
-                this.updateDirection();
-            });
-            this.mutationObserver.observe(targetNode, config);
-        }
-    }
-    onDestroy() {
-        if (this.mutationObserver) {
-            this.mutationObserver.disconnect();
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompare, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: ImageCompare, isStandalone: true, selector: "h-imageCompare, h-imagecompare, h-image-compare", inputs: { tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cx('root')", "attr.tabindex": "tabindex()", "attr.aria-labelledby": "ariaLabelledby()", "attr.aria-label": "ariaLabel()" } }, providers: [ImageCompareStyle, { provide: IMAGECOMPARE_INSTANCE, useExisting: ImageCompare }, { provide: PARENT_INSTANCE, useExisting: ImageCompare }], queries: [{ propertyName: "leftTemplate", first: true, predicate: ["left"], isSignal: true }, { propertyName: "rightTemplate", first: true, predicate: ["right"], isSignal: true }, { propertyName: "templates", predicate: HelixTemplate, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: "<ng-template *ngTemplateOutlet=\"leftTemplate() || _leftTemplate\"></ng-template>\n<ng-template *ngTemplateOutlet=\"rightTemplate() || _rightTemplate\"></ng-template>\n\n<input type=\"range\" min=\"0\" max=\"100\" value=\"50\" (input)=\"onSlide($event)\" [class]=\"cx('slider')\" [hBind]=\"ptm('slider')\" />\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: BindModule }, { kind: "directive", type: i1.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: ImageCompare, decorators: [{
-            type: Component,
-            args: [{ selector: 'h-imageCompare, h-imagecompare, h-image-compare', standalone: true, imports: [CommonModule, SharedModule, BindModule], host: {
-                        '[class]': "cx('root')",
-                        '[attr.tabindex]': 'tabindex()',
-                        '[attr.aria-labelledby]': 'ariaLabelledby()',
-                        '[attr.aria-label]': 'ariaLabel()'
-                    }, hostDirectives: [Bind], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [ImageCompareStyle, { provide: IMAGECOMPARE_INSTANCE, useExisting: ImageCompare }, { provide: PARENT_INSTANCE, useExisting: ImageCompare }], template: "<ng-template *ngTemplateOutlet=\"leftTemplate() || _leftTemplate\"></ng-template>\n<ng-template *ngTemplateOutlet=\"rightTemplate() || _rightTemplate\"></ng-template>\n\n<input type=\"range\" min=\"0\" max=\"100\" value=\"50\" (input)=\"onSlide($event)\" [class]=\"cx('slider')\" [hBind]=\"ptm('slider')\" />\n" }]
-        }], propDecorators: { tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], leftTemplate: [{ type: i0.ContentChild, args: ['left', { ...{ descendants: false }, isSignal: true }] }], rightTemplate: [{ type: i0.ContentChild, args: ['right', { ...{ descendants: false }, isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }] }] } });
-class ImageCompareModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareModule, imports: [ImageCompare, SharedModule], exports: [ImageCompare, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareModule, imports: [ImageCompare, SharedModule, SharedModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ImageCompareModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [ImageCompare, SharedModule],
-                    exports: [ImageCompare, SharedModule]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+const IMAGECOMPARE_INSTANCE = new InjectionToken("IMAGECOMPARE_INSTANCE");
+var ImageCompare = class ImageCompare extends BaseComponent {
+	componentName = "ImageCompare";
+	$pcImageCompare = inject(IMAGECOMPARE_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	bindDirectiveInstance = inject(Bind, { self: true });
+	tabindex = input(...ngDevMode ? [void 0, { debugName: "tabindex" }] : 	/* istanbul ignore next */ []);
+	ariaLabelledby = input(...ngDevMode ? [void 0, { debugName: "ariaLabelledby" }] : 	/* istanbul ignore next */ []);
+	ariaLabel = input(...ngDevMode ? [void 0, { debugName: "ariaLabel" }] : 	/* istanbul ignore next */ []);
+	leftTemplate = contentChild("left", {
+		...ngDevMode ? { debugName: "leftTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	rightTemplate = contentChild("right", {
+		...ngDevMode ? { debugName: "rightTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	_leftTemplate;
+	_rightTemplate;
+	templates = contentChildren(HelixTemplate, ...ngDevMode ? [{ debugName: "templates" }] : 	/* istanbul ignore next */ []);
+	_componentStyle = inject(ImageCompareStyle);
+	mutationObserver;
+	isRTL = false;
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptms(["host", "root"]));
+	}
+	onInit() {
+		this.updateDirection();
+		this.observeDirectionChanges();
+	}
+	onAfterContentInit() {
+		this.templates().forEach((item) => {
+			switch (item.getType()) {
+				case "left":
+					this._leftTemplate = item.template;
+					break;
+				case "right":
+					this._rightTemplate = item.template;
+					break;
+			}
+		});
+	}
+	onSlide(event) {
+		const value = event.target.value;
+		const image = event.target.previousElementSibling;
+		if (this.isRTL) image.style.clipPath = `polygon(${100 - value}% 0, 100% 0, 100% 100%, ${100 - value}% 100%)`;
+		else image.style.clipPath = `polygon(0 0, ${value}% 0, ${value}% 100%, 0 100%)`;
+	}
+	updateDirection() {
+		this.isRTL = !!this.el.nativeElement.closest("[dir=\"rtl\"]");
+	}
+	observeDirectionChanges() {
+		if (isPlatformBrowser(this.platformId)) {
+			const targetNode = document?.documentElement;
+			const config = {
+				attributes: true,
+				attributeFilter: ["dir"]
+			};
+			this.mutationObserver = new MutationObserver(() => {
+				this.updateDirection();
+			});
+			this.mutationObserver.observe(targetNode, config);
+		}
+	}
+	onDestroy() {
+		if (this.mutationObserver) this.mutationObserver.disconnect();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImageCompare,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.2.0",
+		version: "22.2.1",
+		type: ImageCompare,
+		isStandalone: true,
+		selector: "h-imageCompare, h-imagecompare, h-image-compare",
+		inputs: {
+			tabindex: {
+				classPropertyName: "tabindex",
+				publicName: "tabindex",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabelledby: {
+				classPropertyName: "ariaLabelledby",
+				publicName: "ariaLabelledby",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			ariaLabel: {
+				classPropertyName: "ariaLabel",
+				publicName: "ariaLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: {
+			"class": "cx('root')",
+			"attr.tabindex": "tabindex()",
+			"attr.aria-labelledby": "ariaLabelledby()",
+			"attr.aria-label": "ariaLabel()"
+		} },
+		providers: [
+			ImageCompareStyle,
+			{
+				provide: IMAGECOMPARE_INSTANCE,
+				useExisting: ImageCompare
+			},
+			{
+				provide: PARENT_INSTANCE,
+				useExisting: ImageCompare
+			}
+		],
+		queries: [
+			{
+				propertyName: "leftTemplate",
+				first: true,
+				predicate: ["left"],
+				isSignal: true
+			},
+			{
+				propertyName: "rightTemplate",
+				first: true,
+				predicate: ["right"],
+				isSignal: true
+			},
+			{
+				propertyName: "templates",
+				predicate: HelixTemplate,
+				isSignal: true
+			}
+		],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: "<ng-template *ngTemplateOutlet=\"leftTemplate() || _leftTemplate\"></ng-template>\n<ng-template *ngTemplateOutlet=\"rightTemplate() || _rightTemplate\"></ng-template>\n\n<input type=\"range\" min=\"0\" max=\"100\" value=\"50\" (input)=\"onSlide($event)\" [class]=\"cx('slider')\" [hBind]=\"ptm('slider')\" />\n",
+		dependencies: [
+			{
+				kind: "ngmodule",
+				type: CommonModule
+			},
+			{
+				kind: "directive",
+				type: i2.NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "ngmodule",
+				type: SharedModule
+			},
+			{
+				kind: "ngmodule",
+				type: BindModule
+			},
+			{
+				kind: "directive",
+				type: i1.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: ImageCompare,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "h-imageCompare, h-imagecompare, h-image-compare",
+			standalone: true,
+			imports: [
+				CommonModule,
+				SharedModule,
+				BindModule
+			],
+			host: {
+				"[class]": "cx('root')",
+				"[attr.tabindex]": "tabindex()",
+				"[attr.aria-labelledby]": "ariaLabelledby()",
+				"[attr.aria-label]": "ariaLabel()"
+			},
+			hostDirectives: [Bind],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			providers: [
+				ImageCompareStyle,
+				{
+					provide: IMAGECOMPARE_INSTANCE,
+					useExisting: ImageCompare
+				},
+				{
+					provide: PARENT_INSTANCE,
+					useExisting: ImageCompare
+				}
+			],
+			template: "<ng-template *ngTemplateOutlet=\"leftTemplate() || _leftTemplate\"></ng-template>\n<ng-template *ngTemplateOutlet=\"rightTemplate() || _rightTemplate\"></ng-template>\n\n<input type=\"range\" min=\"0\" max=\"100\" value=\"50\" (input)=\"onSlide($event)\" [class]=\"cx('slider')\" [hBind]=\"ptm('slider')\" />\n"
+		}]
+	}],
+	propDecorators: {
+		tabindex: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tabindex",
+				required: false
+			}]
+		}],
+		ariaLabelledby: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabelledby",
+				required: false
+			}]
+		}],
+		ariaLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "ariaLabel",
+				required: false
+			}]
+		}],
+		leftTemplate: [{
+			type: i0.ContentChild,
+			args: ["left", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		rightTemplate: [{
+			type: i0.ContentChild,
+			args: ["right", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		templates: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }]
+		}]
+	}
+});
+var ImageCompareModule = class ImageCompareModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImageCompareModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImageCompareModule,
+		imports: [ImageCompare, SharedModule],
+		exports: [ImageCompare, SharedModule]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: ImageCompareModule,
+		imports: [
+			ImageCompare,
+			SharedModule,
+			SharedModule
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: ImageCompareModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [ImageCompare, SharedModule],
+			exports: [ImageCompare, SharedModule]
+		}]
+	}]
+});
 export { ImageCompare, ImageCompareClasses, ImageCompareModule, ImageCompareStyle };
-//# sourceMappingURL=gravionlabs-helix-core-imagecompare.mjs.map
+
+//# sourceMappingURL=gravionlabs-helix-core-imagecompare.mjs.map

package/fesm2022/gravionlabs-helix-core-imagecompare.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"gravionlabs-helix-core-imagecompare.mjs","sources":["../../../projects/core/imagecompare/style/imagecompare.css.ts","../../../projects/core/imagecompare/style/imagecomparestyle.ts","../../../projects/core/imagecompare/imagecompare.ts","../../../projects/core/imagecompare/imagecompare.html","../../../projects/core/imagecompare/gravionlabs-helix-core-imagecompare.ts"],"sourcesContent":["export const style = /*css*/ `\n    .h-imagecompare {\n        position: relative;\n        overflow: hidden;\n        width: 100%;\n        aspect-ratio: 16 / 9;\n    }\n\n    .h-imagecompare img {\n        width: 100%;\n        height: 100%;\n        position: absolute;\n    }\n\n    .h-imagecompare img + img {\n        clip-path: polygon(0 0, dt('imagecompare.scope.x', '50%') 0, dt('imagecompare.scope.x', '50%') 100%, 0 100%);\n    }\n\n    .h-imagecompare:dir(rtl) img + img {\n        clip-path: polygon(calc(100% - dt('imagecompare.scope.x', '50%')) 0, 100% 0, 100% 100%, calc(100% - dt('imagecompare.scope.x', '50%')) 100%);\n    }\n\n    .h-imagecompare-slider {\n        position: relative;\n        -webkit-appearance: none;\n        width: calc(100% + dt('imagecompare.handle.size'));\n        height: 100%;\n        margin-inline-start: calc(-1 * calc(dt('imagecompare.handle.size') / 2));\n        background-color: transparent;\n        outline: none;\n        transition: all dt('imagecompare.handle.transition.duration');\n    }\n\n    .h-imagecompare-slider::-webkit-slider-thumb {\n        -webkit-appearance: none;\n        height: dt('imagecompare.handle.size');\n        width: dt('imagecompare.handle.size');\n        background: dt('imagecompare.handle.background');\n        border: dt('imagecompare.handle.border.width') solid dt('imagecompare.handle.border.color');\n        border-radius: dt('imagecompare.handle.border.radius');\n        background-size: contain;\n        cursor: ew-resize;\n        transition: all dt('imagecompare.handle.transition.duration');\n    }\n\n    .h-imagecompare-slider::-moz-range-thumb {\n        height: dt('imagecompare.handle.size');\n        width: dt('imagecompare.handle.size');\n        background: dt('imagecompare.handle.background');\n        border: dt('imagecompare.handle.border.width') dt('imagecompare.handle.border.style') dt('imagecompare.handle.border.color');\n        border-radius: dt('imagecompare.handle.border.radius');\n        background-size: contain;\n        cursor: ew-resize;\n    }\n\n    .h-imagecompare-slider:focus-visible::-webkit-slider-thumb {\n        box-shadow: dt('imagecompare.handle.focus.ring.shadow');\n        outline: dt('imagecompare.handle.focus.ring.width') dt('imagecompare.handle.focus.ring.style') dt('imagecompare.handle.focus.ring.color');\n        outline-offset: dt('imagecompare.handle.focus.ring.offset');\n    }\n\n    .h-imagecompare-slider:focus-visible::-moz-range-thumb {\n        box-shadow: dt('imagecompare.handle.focus.ring.shadow');\n        outline: dt('imagecompare.handle.focus.ring.width') dt('imagecompare.handle.focus.ring.style') dt('imagecompare.handle.focus.ring.color');\n        outline-offset: dt('imagecompare.handle.focus.ring.offset');\n    }\n\n    .h-imagecompare-slider:hover {\n        width: calc(100% + dt('imagecompare.handle.hover.size'));\n        margin-inline-start: calc(-1 * calc(dt('imagecompare.handle.hover.size') / 2));\n    }\n\n    .h-imagecompare-slider:hover::-webkit-slider-thumb {\n        background: dt('imagecompare.handle.hover.background');\n        border-color: dt('imagecompare.handle.hover.border.color');\n        height: dt('imagecompare.handle.hover.size');\n        width: dt('imagecompare.handle.hover.size');\n    }\n\n    .h-imagecompare-slider:hover::-moz-range-thumb {\n        background: dt('imagecompare.handle.hover.background');\n        border-color: dt('imagecompare.handle.hover.border.color');\n        height: dt('imagecompare.handle.hover.size');\n        width: dt('imagecompare.handle.hover.size');\n    }\n`;\n","import { Injectable } from '@angular/core';\nimport { style } from './imagecompare.css';\nimport { BaseStyle } from '@gravionlabs/helix-core/base';\n\nconst classes = {\n    root: 'h-imagecompare',\n    slider: 'h-imagecompare-slider'\n};\n\n@Injectable()\nexport class ImageCompareStyle extends BaseStyle {\n    name = 'imagecompare';\n\n    style = style;\n\n    classes = classes;\n}\n\n/**\n *\n * ImageCompare compares two images side by side with a slider.\n *\n * [Live Demo](https://www.primeng.org/imagecompare/)\n *\n * @module imagecomparestyle\n *\n */\nexport enum ImageCompareClasses {\n    /**\n     * Class name of the root element\n     */\n    root = 'h-imagecompare',\n    /**\n     * Class name of the slider element\n     */\n    slider = 'h-imagecompare-slider'\n}\nexport interface ImageCompareStyle extends BaseStyle {}\n","import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, inject, InjectionToken, NgModule, TemplateRef, ViewEncapsulation, input, contentChild, contentChildren } from '@angular/core';\nimport { HelixTemplate, SharedModule } from '@gravionlabs/helix-core/api';\nimport { BaseComponent, PARENT_INSTANCE } from '@gravionlabs/helix-core/basecomponent';\nimport { Bind, BindModule } from '@gravionlabs/helix-core/bind';\nimport { ImageComparePassThrough } from '@gravionlabs/helix-core/types/imagecompare';\nimport { ImageCompareStyle } from './style/imagecomparestyle';\n\nconst IMAGECOMPARE_INSTANCE = new InjectionToken<ImageCompare>('IMAGECOMPARE_INSTANCE');\n\n/**\n * Compare two images side by side with a slider.\n * @group Components\n */\n@Component({\n    selector: 'h-imageCompare, h-imagecompare, h-image-compare',\n    standalone: true,\n    imports: [CommonModule, SharedModule, BindModule],\n    templateUrl: './imagecompare.html',\n    host: {\n        '[class]': \"cx('root')\",\n        '[attr.tabindex]': 'tabindex()',\n        '[attr.aria-labelledby]': 'ariaLabelledby()',\n        '[attr.aria-label]': 'ariaLabel()'\n    },\n    hostDirectives: [Bind],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    providers: [ImageCompareStyle, { provide: IMAGECOMPARE_INSTANCE, useExisting: ImageCompare }, { provide: PARENT_INSTANCE, useExisting: ImageCompare }]\n})\nexport class ImageCompare extends BaseComponent<ImageComparePassThrough> {\n    componentName = 'ImageCompare';\n\n    $pcImageCompare: ImageCompare | undefined = inject(IMAGECOMPARE_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;\n\n    bindDirectiveInstance = inject(Bind, { self: true });\n    /**\n     * Index of the element in tabbing order.\n     * @defaultValue 0\n     * @group Props\n     */\n    readonly tabindex = input<number>();\n    /**\n     * Defines a string value that labels an interactive element.\n     * @group Props\n     */\n    readonly ariaLabelledby = input<string>();\n    /**\n     * Identifier of the underlying input element.\n     * @group Props\n     */\n    readonly ariaLabel = input<string>();\n\n    /**\n     * Custom left side template.\n     * @group Templates\n     */\n    readonly leftTemplate = contentChild<TemplateRef<void>>('left', { descendants: false });\n\n    /**\n     * Custom right side template.\n     * @group Templates\n     */\n    readonly rightTemplate = contentChild<TemplateRef<void>>('right', { descendants: false });\n\n    _leftTemplate: TemplateRef<void> | undefined;\n\n    _rightTemplate: TemplateRef<void> | undefined;\n\n    readonly templates = contentChildren(HelixTemplate);\n\n    _componentStyle = inject(ImageCompareStyle);\n\n    mutationObserver: MutationObserver;\n\n    isRTL: boolean = false;\n\n    onAfterViewChecked(): void {\n        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));\n    }\n\n    onInit() {\n        this.updateDirection();\n        this.observeDirectionChanges();\n    }\n\n    onAfterContentInit() {\n        this.templates().forEach((item) => {\n            switch (item.getType()) {\n                case 'left':\n                    this._leftTemplate = item.template;\n                    break;\n                case 'right':\n                    this._rightTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    onSlide(event) {\n        const value = event.target.value;\n        const image = event.target.previousElementSibling;\n\n        if (this.isRTL) {\n            image.style.clipPath = `polygon(${100 - value}% 0, 100% 0, 100% 100%, ${100 - value}% 100%)`;\n        } else {\n            image.style.clipPath = `polygon(0 0, ${value}% 0, ${value}% 100%, 0 100%)`;\n        }\n    }\n\n    updateDirection() {\n        this.isRTL = !!this.el.nativeElement.closest('[dir=\"rtl\"]');\n    }\n\n    observeDirectionChanges() {\n        if (isPlatformBrowser(this.platformId)) {\n            const targetNode = document?.documentElement;\n            const config = { attributes: true, attributeFilter: ['dir'] };\n\n            this.mutationObserver = new MutationObserver(() => {\n                this.updateDirection();\n            });\n\n            this.mutationObserver.observe(targetNode, config);\n        }\n    }\n\n    onDestroy() {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n        }\n    }\n}\n\n@NgModule({\n    imports: [ImageCompare, SharedModule],\n    exports: [ImageCompare, SharedModule]\n})\nexport class ImageCompareModule {}\n","<ng-template *ngTemplateOutlet=\"leftTemplate() || _leftTemplate\"></ng-template>\n<ng-template *ngTemplateOutlet=\"rightTemplate() || _rightTemplate\"></ng-template>\n\n<input type=\"range\" min=\"0\" max=\"100\" value=\"50\" (input)=\"onSlide($event)\" [class]=\"cx('slider')\" [hBind]=\"ptm('slider')\" />\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"gravionlabs-helix-core-imagecompare.mjs","names":[],"sources":["../../../projects/core/imagecompare/style/imagecompare.css.ts","../../../projects/core/imagecompare/style/imagecomparestyle.ts","../../../projects/core/imagecompare/imagecompare.ts","../../../projects/core/imagecompare/imagecompare.html"],"sourcesContent":["export const style = /*css*/ `\n    .h-imagecompare {\n        position: relative;\n        overflow: hidden;\n        width: 100%;\n        aspect-ratio: 16 / 9;\n    }\n\n    .h-imagecompare img {\n        width: 100%;\n        height: 100%;\n        position: absolute;\n    }\n\n    .h-imagecompare img + img {\n        clip-path: polygon(0 0, dt('imagecompare.scope.x', '50%') 0, dt('imagecompare.scope.x', '50%') 100%, 0 100%);\n    }\n\n    .h-imagecompare:dir(rtl) img + img {\n        clip-path: polygon(calc(100% - dt('imagecompare.scope.x', '50%')) 0, 100% 0, 100% 100%, calc(100% - dt('imagecompare.scope.x', '50%')) 100%);\n    }\n\n    .h-imagecompare-slider {\n        position: relative;\n        -webkit-appearance: none;\n        width: calc(100% + dt('imagecompare.handle.size'));\n        height: 100%;\n        margin-inline-start: calc(-1 * calc(dt('imagecompare.handle.size') / 2));\n        background-color: transparent;\n        outline: none;\n        transition: all dt('imagecompare.handle.transition.duration');\n    }\n\n    .h-imagecompare-slider::-webkit-slider-thumb {\n        -webkit-appearance: none;\n        height: dt('imagecompare.handle.size');\n        width: dt('imagecompare.handle.size');\n        background: dt('imagecompare.handle.background');\n        border: dt('imagecompare.handle.border.width') solid dt('imagecompare.handle.border.color');\n        border-radius: dt('imagecompare.handle.border.radius');\n        background-size: contain;\n        cursor: ew-resize;\n        transition: all dt('imagecompare.handle.transition.duration');\n    }\n\n    .h-imagecompare-slider::-moz-range-thumb {\n        height: dt('imagecompare.handle.size');\n        width: dt('imagecompare.handle.size');\n        background: dt('imagecompare.handle.background');\n        border: dt('imagecompare.handle.border.width') dt('imagecompare.handle.border.style') dt('imagecompare.handle.border.color');\n        border-radius: dt('imagecompare.handle.border.radius');\n        background-size: contain;\n        cursor: ew-resize;\n    }\n\n    .h-imagecompare-slider:focus-visible::-webkit-slider-thumb {\n        box-shadow: dt('imagecompare.handle.focus.ring.shadow');\n        outline: dt('imagecompare.handle.focus.ring.width') dt('imagecompare.handle.focus.ring.style') dt('imagecompare.handle.focus.ring.color');\n        outline-offset: dt('imagecompare.handle.focus.ring.offset');\n    }\n\n    .h-imagecompare-slider:focus-visible::-moz-range-thumb {\n        box-shadow: dt('imagecompare.handle.focus.ring.shadow');\n        outline: dt('imagecompare.handle.focus.ring.width') dt('imagecompare.handle.focus.ring.style') dt('imagecompare.handle.focus.ring.color');\n        outline-offset: dt('imagecompare.handle.focus.ring.offset');\n    }\n\n    .h-imagecompare-slider:hover {\n        width: calc(100% + dt('imagecompare.handle.hover.size'));\n        margin-inline-start: calc(-1 * calc(dt('imagecompare.handle.hover.size') / 2));\n    }\n\n    .h-imagecompare-slider:hover::-webkit-slider-thumb {\n        background: dt('imagecompare.handle.hover.background');\n        border-color: dt('imagecompare.handle.hover.border.color');\n        height: dt('imagecompare.handle.hover.size');\n        width: dt('imagecompare.handle.hover.size');\n    }\n\n    .h-imagecompare-slider:hover::-moz-range-thumb {\n        background: dt('imagecompare.handle.hover.background');\n        border-color: dt('imagecompare.handle.hover.border.color');\n        height: dt('imagecompare.handle.hover.size');\n        width: dt('imagecompare.handle.hover.size');\n    }\n`;\n","import { Injectable } from '@angular/core';\nimport { style } from './imagecompare.css';\nimport { BaseStyle } from '@gravionlabs/helix-core/base';\n\nconst classes = {\n    root: 'h-imagecompare',\n    slider: 'h-imagecompare-slider'\n};\n\n@Injectable()\nexport class ImageCompareStyle extends BaseStyle {\n    name = 'imagecompare';\n\n    style = style;\n\n    classes = classes;\n}\n\n/**\n *\n * ImageCompare compares two images side by side with a slider.\n *\n * [Live Demo](https://www.primeng.org/imagecompare/)\n *\n * @module imagecomparestyle\n *\n */\nexport enum ImageCompareClasses {\n    /**\n     * Class name of the root element\n     */\n    root = 'h-imagecompare',\n    /**\n     * Class name of the slider element\n     */\n    slider = 'h-imagecompare-slider'\n}\nexport interface ImageCompareStyle extends BaseStyle {}\n","import { CommonModule, isPlatformBrowser } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, inject, InjectionToken, NgModule, TemplateRef, ViewEncapsulation, input, contentChild, contentChildren } from '@angular/core';\nimport { HelixTemplate, SharedModule } from '@gravionlabs/helix-core/api';\nimport { BaseComponent, PARENT_INSTANCE } from '@gravionlabs/helix-core/basecomponent';\nimport { Bind, BindModule } from '@gravionlabs/helix-core/bind';\nimport { ImageComparePassThrough } from '@gravionlabs/helix-core/types/imagecompare';\nimport { ImageCompareStyle } from './style/imagecomparestyle';\n\nconst IMAGECOMPARE_INSTANCE = new InjectionToken<ImageCompare>('IMAGECOMPARE_INSTANCE');\n\n/**\n * Compare two images side by side with a slider.\n * @group Components\n */\n@Component({\n    selector: 'h-imageCompare, h-imagecompare, h-image-compare',\n    standalone: true,\n    imports: [CommonModule, SharedModule, BindModule],\n    templateUrl: './imagecompare.html',\n    host: {\n        '[class]': \"cx('root')\",\n        '[attr.tabindex]': 'tabindex()',\n        '[attr.aria-labelledby]': 'ariaLabelledby()',\n        '[attr.aria-label]': 'ariaLabel()'\n    },\n    hostDirectives: [Bind],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    providers: [ImageCompareStyle, { provide: IMAGECOMPARE_INSTANCE, useExisting: ImageCompare }, { provide: PARENT_INSTANCE, useExisting: ImageCompare }]\n})\nexport class ImageCompare extends BaseComponent<ImageComparePassThrough> {\n    componentName = 'ImageCompare';\n\n    $pcImageCompare: ImageCompare | undefined = inject(IMAGECOMPARE_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;\n\n    bindDirectiveInstance = inject(Bind, { self: true });\n    /**\n     * Index of the element in tabbing order.\n     * @defaultValue 0\n     * @group Props\n     */\n    readonly tabindex = input<number>();\n    /**\n     * Defines a string value that labels an interactive element.\n     * @group Props\n     */\n    readonly ariaLabelledby = input<string>();\n    /**\n     * Identifier of the underlying input element.\n     * @group Props\n     */\n    readonly ariaLabel = input<string>();\n\n    /**\n     * Custom left side template.\n     * @group Templates\n     */\n    readonly leftTemplate = contentChild<TemplateRef<void>>('left', { descendants: false });\n\n    /**\n     * Custom right side template.\n     * @group Templates\n     */\n    readonly rightTemplate = contentChild<TemplateRef<void>>('right', { descendants: false });\n\n    _leftTemplate: TemplateRef<void> | undefined;\n\n    _rightTemplate: TemplateRef<void> | undefined;\n\n    readonly templates = contentChildren(HelixTemplate);\n\n    _componentStyle = inject(ImageCompareStyle);\n\n    mutationObserver: MutationObserver;\n\n    isRTL: boolean = false;\n\n    onAfterViewChecked(): void {\n        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));\n    }\n\n    onInit() {\n        this.updateDirection();\n        this.observeDirectionChanges();\n    }\n\n    onAfterContentInit() {\n        this.templates().forEach((item) => {\n            switch (item.getType()) {\n                case 'left':\n                    this._leftTemplate = item.template;\n                    break;\n                case 'right':\n                    this._rightTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    onSlide(event) {\n        const value = event.target.value;\n        const image = event.target.previousElementSibling;\n\n        if (this.isRTL) {\n            image.style.clipPath = `polygon(${100 - value}% 0, 100% 0, 100% 100%, ${100 - value}% 100%)`;\n        } else {\n            image.style.clipPath = `polygon(0 0, ${value}% 0, ${value}% 100%, 0 100%)`;\n        }\n    }\n\n    updateDirection() {\n        this.isRTL = !!this.el.nativeElement.closest('[dir=\"rtl\"]');\n    }\n\n    observeDirectionChanges() {\n        if (isPlatformBrowser(this.platformId)) {\n            const targetNode = document?.documentElement;\n            const config = { attributes: true, attributeFilter: ['dir'] };\n\n            this.mutationObserver = new MutationObserver(() => {\n                this.updateDirection();\n            });\n\n            this.mutationObserver.observe(targetNode, config);\n        }\n    }\n\n    onDestroy() {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n        }\n    }\n}\n\n@NgModule({\n    imports: [ImageCompare, SharedModule],\n    exports: [ImageCompare, SharedModule]\n})\nexport class ImageCompareModule {}\n","<ng-template *ngTemplateOutlet=\"leftTemplate() || _leftTemplate\"></ng-template>\n<ng-template *ngTemplateOutlet=\"rightTemplate() || _rightTemplate\"></ng-template>\n\n<input type=\"range\" min=\"0\" max=\"100\" value=\"50\" (input)=\"onSlide($event)\" [class]=\"cx('slider')\" [hBind]=\"ptm('slider')\" />\n"],"mappings":"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"}