@gravionlabs/helix-core 22.1.1 → 22.1.3

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

@@ -1,20 +1,20 @@
-export * from '@gravionlabs/helix-core/types/rating';
-import * as i2 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, forwardRef, inject, input, booleanAttribute, numberAttribute, output, contentChild, contentChildren, signal, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import { NG_VALUE_ACCESSOR } from '@angular/forms';
-import { uuid, getFirstFocusableElement, focus } from '@gravionlabs/helix-core/uix/utils';
-import { HelixTemplate, SharedModule } from '@gravionlabs/helix-core/api';
-import { AutoFocus } from '@gravionlabs/helix-core/autofocus';
-import { PARENT_INSTANCE } from '@gravionlabs/helix-core/basecomponent';
-import { BaseEditableHolder } from '@gravionlabs/helix-core/baseeditableholder';
-import * as i1 from '@gravionlabs/helix-core/bind';
-import { Bind, BindModule } from '@gravionlabs/helix-core/bind';
-import { StarFillIcon, StarIcon } from '@gravionlabs/helix-core/icons';
-import { BaseStyle } from '@gravionlabs/helix-core/base';
-
-const style$1 = /*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, forwardRef, inject, input, numberAttribute, output, signal } from "@angular/core";
+import { NG_VALUE_ACCESSOR } from "@angular/forms";
+import { focus, getFirstFocusableElement, uuid } from "@gravionlabs/helix-core/uix/utils";
+import { HelixTemplate, SharedModule } from "@gravionlabs/helix-core/api";
+import { AutoFocus } from "@gravionlabs/helix-core/autofocus";
+import { PARENT_INSTANCE } from "@gravionlabs/helix-core/basecomponent";
+import { BaseEditableHolder } from "@gravionlabs/helix-core/baseeditableholder";
+import * as i1 from "@gravionlabs/helix-core/bind";
+import { Bind, BindModule } from "@gravionlabs/helix-core/bind";
+import { StarFillIcon, StarIcon } from "@gravionlabs/helix-core/icons";
+import { BaseStyle } from "@gravionlabs/helix-core/base";
+export * from "@gravionlabs/helix-core/types/rating";
+const style = `
+    
     .h-rating {
         position: relative;
         display: inline-flex;
@@ -71,10 +71,7 @@ const style$1 = /*css*/ `
     .h-rating.h-readonly .h-rating-option {
         cursor: not-allowed;
     }
-`;
 
-const style = /*css*/ `
-    ${style$1}
 
     /* For Helix */
     h-rating.ng-invalid.ng-dirty > .h-rating > .h-rating-icon {
@@ -82,275 +79,521 @@ const style = /*css*/ `
     }
 `;
 const classes = {
-    root: ({ instance }) => [
-        'h-rating',
-        {
-            'h-readonly': instance.readonly(),
-            'h-disabled': instance.$disabled()
-        }
-    ],
-    option: ({ instance, star, value }) => [
-        'h-rating-option',
-        {
-            'h-rating-option-active': star + 1 <= value,
-            'h-focus-visible': star + 1 === instance.focusedOptionIndex() && instance.isFocusVisibleItem
-        }
-    ],
-    onIcon: ({ instance }) => ['h-rating-icon h-rating-on-icon', { 'h-invalid': instance.invalid() }],
-    offIcon: ({ instance }) => ['h-rating-icon h-rating-off-icon', { 'h-invalid': instance.invalid() }]
+	root: ({ instance }) => ["h-rating", {
+		"h-readonly": instance.readonly(),
+		"h-disabled": instance.$disabled()
+	}],
+	option: ({ instance, star, value }) => ["h-rating-option", {
+		"h-rating-option-active": star + 1 <= value,
+		"h-focus-visible": star + 1 === instance.focusedOptionIndex() && instance.isFocusVisibleItem
+	}],
+	onIcon: ({ instance }) => ["h-rating-icon h-rating-on-icon", { "h-invalid": instance.invalid() }],
+	offIcon: ({ instance }) => ["h-rating-icon h-rating-off-icon", { "h-invalid": instance.invalid() }]
+};
+var RatingStyle = class RatingStyle extends BaseStyle {
+	name = "rating";
+	style = style;
+	classes = classes;
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RatingStyle,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Injectable
+	});
+	static ɵprov = i0.ɵɵngDeclareInjectable({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RatingStyle
+	});
 };
-class RatingStyle extends BaseStyle {
-    name = 'rating';
-    style = style;
-    classes = classes;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RatingStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RatingStyle });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RatingStyle, decorators: [{
-            type: Injectable
-        }] });
-/**
- *
- * Rating component is a star based selection input.
- *
- * [Live Demo](https://www.primeng.org/rating/)
- *
- * @module ratingstyle
- *
- */
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: RatingStyle,
+	decorators: [{ type: Injectable }]
+});
 var RatingClasses;
-(function (RatingClasses) {
-    /**
-     * Class name of the root element
-     */
-    RatingClasses["root"] = "h-rating";
-    /**
-     * Class name of the option element
-     */
-    RatingClasses["option"] = "h-rating-option";
-    /**
-     * Class name of the on icon element
-     */
-    RatingClasses["onIcon"] = "h-rating-on-icon";
-    /**
-     * Class name of the off icon element
-     */
-    RatingClasses["offIcon"] = "h-rating-off-icon";
+(function(RatingClasses) {
+	RatingClasses["root"] = "h-rating";
+	RatingClasses["option"] = "h-rating-option";
+	RatingClasses["onIcon"] = "h-rating-on-icon";
+	RatingClasses["offIcon"] = "h-rating-off-icon";
 })(RatingClasses || (RatingClasses = {}));
-
-const RATING_INSTANCE = new InjectionToken('RATING_INSTANCE');
+const RATING_INSTANCE = new InjectionToken("RATING_INSTANCE");
 const RATING_VALUE_ACCESSOR = {
-    provide: NG_VALUE_ACCESSOR,
-    useExisting: forwardRef(() => Rating),
-    multi: true
+	provide: NG_VALUE_ACCESSOR,
+	useExisting: forwardRef(() => Rating),
+	multi: true
 };
-/**
- * Rating is an extension to standard radio button element with theming.
- * @group Components
- */
-class Rating extends BaseEditableHolder {
-    componentName = 'Rating';
-    $pcRating = inject(RATING_INSTANCE, { optional: true, skipSelf: true }) ?? undefined;
-    bindDirectiveInstance = inject(Bind, { self: true });
-    onAfterViewChecked() {
-        this.bindDirectiveInstance.setAttrs(this.ptms(['host', 'root']));
-    }
-    /**
-     * When present, changing the value is not possible.
-     * @group Props
-     */
-    readonly = input(undefined, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Number of stars.
-     * @group Props
-     */
-    stars = input(5, { ...(ngDevMode ? { debugName: "stars" } : /* istanbul ignore next */ {}), transform: numberAttribute });
-    /**
-     * Style class of the on icon.
-     * @group Props
-     */
-    iconOnClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "iconOnClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Inline style of the on icon.
-     * @group Props
-     */
-    iconOnStyle = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "iconOnStyle" }] : /* istanbul ignore next */ []));
-    /**
-     * Style class of the off icon.
-     * @group Props
-     */
-    iconOffClass = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "iconOffClass" }] : /* istanbul ignore next */ []));
-    /**
-     * Inline style of the off icon.
-     * @group Props
-     */
-    iconOffStyle = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "iconOffStyle" }] : /* istanbul ignore next */ []));
-    /**
-     * When present, it specifies that the component should automatically get focus on load.
-     * @group Props
-     */
-    autofocus = input(undefined, { ...(ngDevMode ? { debugName: "autofocus" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    /**
-     * Emitted on value change.
-     * @param {RatingRateEvent} value - Custom rate event.
-     * @group Emits
-     */
-    onRate = output();
-    /**
-     * Emitted when the rating receives focus.
-     * @param {Event} value - Browser event.
-     * @group Emits
-     */
-    onFocus = output();
-    /**
-     * Emitted when the rating loses focus.
-     * @param {Event} value - Browser event.
-     * @group Emits
-     */
-    onBlur = output();
-    /**
-     * Custom on icon template.
-     * @param {RatingIconTemplateContext} context - icon context.
-     * @see {@link RatingIconTemplateContext}
-     * @group Templates
-     */
-    onIconTemplate = contentChild('onicon', { ...(ngDevMode ? { debugName: "onIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    /**
-     * Custom off icon template.
-     * @param {RatingIconTemplateContext} context - icon context.
-     * @see {@link RatingIconTemplateContext}
-     * @group Templates
-     */
-    offIconTemplate = contentChild('officon', { ...(ngDevMode ? { debugName: "offIconTemplate" } : /* istanbul ignore next */ {}), descendants: false });
-    templates = contentChildren(HelixTemplate, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "templates" }] : /* istanbul ignore next */ []));
-    value;
-    starsArray;
-    isFocusVisibleItem = true;
-    focusedOptionIndex = signal(-1, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "focusedOptionIndex" }] : /* istanbul ignore next */ []));
-    nameattr;
-    _componentStyle = inject(RatingStyle);
-    _onIconTemplate;
-    _offIconTemplate;
-    onInit() {
-        this.nameattr = this.nameattr || uuid('pn_id_');
-        this.starsArray = [];
-        for (let i = 0; i < this.stars(); i++) {
-            this.starsArray[i] = i;
-        }
-    }
-    onAfterContentInit() {
-        this.templates().forEach((item) => {
-            switch (item.getType()) {
-                case 'onicon':
-                    this._onIconTemplate = item.template;
-                    break;
-                case 'officon':
-                    this._offIconTemplate = item.template;
-                    break;
-            }
-        });
-    }
-    onOptionClick(event, value) {
-        if (!this.readonly() && !this.$disabled()) {
-            this.onOptionSelect(event, value);
-            this.isFocusVisibleItem = false;
-            const firstFocusableEl = getFirstFocusableElement(event.currentTarget, '');
-            firstFocusableEl && focus(firstFocusableEl);
-        }
-    }
-    onOptionSelect(event, value) {
-        if (!this.readonly() && !this.$disabled()) {
-            if (this.focusedOptionIndex() === value || value === this.value) {
-                this.focusedOptionIndex.set(-1);
-                this.updateModel(event, null);
-            }
-            else {
-                this.focusedOptionIndex.set(value);
-                this.updateModel(event, value || null);
-            }
-        }
-    }
-    onChange(event, value) {
-        this.onOptionSelect(event, value);
-        this.isFocusVisibleItem = true;
-    }
-    onInputBlur(event) {
-        this.focusedOptionIndex.set(-1);
-        this.onBlur.emit(event);
-    }
-    onInputFocus(event, value) {
-        if (!this.readonly() && !this.$disabled()) {
-            this.focusedOptionIndex.set(value);
-            this.isFocusVisibleItem = event.sourceCapabilities?.firesTouchEvents === false;
-            this.onFocus.emit(event);
-        }
-    }
-    updateModel(event, value) {
-        this.writeValue(value);
-        this.onModelChange(this.value);
-        this.onModelTouched();
-        this.onRate.emit({
-            originalEvent: event,
-            value
-        });
-    }
-    starAriaLabel(value) {
-        return value === 1 ? this.config.translation.aria?.star : this.config.translation.aria?.stars?.replace(/{star}/g, value);
-    }
-    getIconTemplate(i) {
-        return !this.value || i >= this.value ? this.offIconTemplate() || this._offIconTemplate : this.onIconTemplate() || this.offIconTemplate();
-    }
-    /**
-     * @override
-     *
-     * @see {@link BaseEditableHolder.writeControlValue}
-     * Writes the value to the control.
-     */
-    writeControlValue(value, setModelValue) {
-        this.value = value;
-        setModelValue(value);
-    }
-    get isCustomIcon() {
-        return !!(this.onIconTemplate || this._onIconTemplate || this.offIconTemplate || this._offIconTemplate);
-    }
-    get dataP() {
-        return this.cn({
-            readonly: this.readonly(),
-            disabled: this.$disabled()
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: Rating, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: Rating, isStandalone: true, selector: "h-rating", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, stars: { classPropertyName: "stars", publicName: "stars", isSignal: true, isRequired: false, transformFunction: null }, iconOnClass: { classPropertyName: "iconOnClass", publicName: "iconOnClass", isSignal: true, isRequired: false, transformFunction: null }, iconOnStyle: { classPropertyName: "iconOnStyle", publicName: "iconOnStyle", isSignal: true, isRequired: false, transformFunction: null }, iconOffClass: { classPropertyName: "iconOffClass", publicName: "iconOffClass", isSignal: true, isRequired: false, transformFunction: null }, iconOffStyle: { classPropertyName: "iconOffStyle", publicName: "iconOffStyle", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onRate: "onRate", onFocus: "onFocus", onBlur: "onBlur" }, host: { properties: { "class": "cx('root')", "attr.data-h": "dataP" } }, providers: [RATING_VALUE_ACCESSOR, RatingStyle, { provide: RATING_INSTANCE, useExisting: Rating }, { provide: PARENT_INSTANCE, useExisting: Rating }], queries: [{ propertyName: "onIconTemplate", first: true, predicate: ["onicon"], isSignal: true }, { propertyName: "offIconTemplate", first: true, predicate: ["officon"], isSignal: true }, { propertyName: "templates", predicate: HelixTemplate, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: "@for (star of starsArray; track star; let i = $index) {\n  <div [class]=\"cx('option', { star, value })\" (click)=\"onOptionClick($event, star + 1)\" [hBind]=\"ptm('option')\">\n    <span class=\"h-hidden-accessible\" [attr.data-h-hidden-accessible]=\"true\" [hBind]=\"ptm('hiddenOptionInputContainer')\">\n      <input\n        type=\"radio\"\n        [value]=\"star + 1\"\n        [attr.name]=\"name() || nameattr + '_name'\"\n        [attr.value]=\"modelValue()\"\n        [attr.required]=\"required() ? '' : undefined\"\n        [attr.readonly]=\"readonly() ? '' : undefined\"\n        [attr.disabled]=\"$disabled() ? '' : undefined\"\n        [checked]=\"value === star + 1\"\n        [attr.aria-label]=\"starAriaLabel(star + 1)\"\n        (focus)=\"onInputFocus($event, star + 1)\"\n        (blur)=\"onInputBlur($event)\"\n        (change)=\"onChange($event, star + 1)\"\n        [hAutoFocus]=\"autofocus()\"\n        [hBind]=\"ptm('hiddenOptionInput')\"\n        />\n    </span>\n    @if (star + 1 <= value) {\n      @if (onIconTemplate() || _onIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"onIconTemplate() || _onIconTemplate; context: { $implicit: star + 1, class: cx('onIcon') }\"></ng-container>\n      } @else {\n        @if (iconOnClass()) {\n          <span [class]=\"cx('onIcon')\" [ngStyle]=\"iconOnStyle()\" [ngClass]=\"iconOnClass()\" [hBind]=\"ptm('onIcon')\"></span>\n        }\n        @if (!iconOnClass()) {\n          <svg data-h-icon=\"star-fill\" [ngStyle]=\"iconOnStyle()\" [class]=\"cx('onIcon')\" [hBind]=\"ptm('onIcon')\" />\n        }\n      }\n    } @else {\n      @if (offIconTemplate() || _offIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"offIconTemplate() || _offIconTemplate; context: { $implicit: star + 1, class: cx('offIcon') }\"></ng-container>\n      } @else {\n        @if (iconOffClass()) {\n          <span [class]=\"cx('offIcon')\" [ngStyle]=\"iconOffStyle()\" [ngClass]=\"iconOffClass()\" [hBind]=\"ptm('offIcon')\"></span>\n        }\n        @if (!iconOffClass()) {\n          <svg data-h-icon=\"star\" [ngStyle]=\"iconOffStyle()\" [class]=\"cx('offIcon')\" [hBind]=\"ptm('offIcon')\" />\n        }\n      }\n    }\n  </div>\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: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: AutoFocus, selector: "[hAutoFocus]", inputs: ["hAutoFocus"] }, { kind: "component", type: StarFillIcon, selector: "[data-h-icon=\"star-fill\"]" }, { kind: "component", type: StarIcon, selector: "[data-h-icon=\"star\"]" }, { 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: Rating, decorators: [{
-            type: Component,
-            args: [{ selector: 'h-rating', imports: [CommonModule, AutoFocus, StarFillIcon, StarIcon, SharedModule, BindModule], standalone: true, providers: [RATING_VALUE_ACCESSOR, RatingStyle, { provide: RATING_INSTANCE, useExisting: Rating }, { provide: PARENT_INSTANCE, useExisting: Rating }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
-                        '[class]': "cx('root')",
-                        '[attr.data-h]': 'dataP'
-                    }, hostDirectives: [Bind], template: "@for (star of starsArray; track star; let i = $index) {\n  <div [class]=\"cx('option', { star, value })\" (click)=\"onOptionClick($event, star + 1)\" [hBind]=\"ptm('option')\">\n    <span class=\"h-hidden-accessible\" [attr.data-h-hidden-accessible]=\"true\" [hBind]=\"ptm('hiddenOptionInputContainer')\">\n      <input\n        type=\"radio\"\n        [value]=\"star + 1\"\n        [attr.name]=\"name() || nameattr + '_name'\"\n        [attr.value]=\"modelValue()\"\n        [attr.required]=\"required() ? '' : undefined\"\n        [attr.readonly]=\"readonly() ? '' : undefined\"\n        [attr.disabled]=\"$disabled() ? '' : undefined\"\n        [checked]=\"value === star + 1\"\n        [attr.aria-label]=\"starAriaLabel(star + 1)\"\n        (focus)=\"onInputFocus($event, star + 1)\"\n        (blur)=\"onInputBlur($event)\"\n        (change)=\"onChange($event, star + 1)\"\n        [hAutoFocus]=\"autofocus()\"\n        [hBind]=\"ptm('hiddenOptionInput')\"\n        />\n    </span>\n    @if (star + 1 <= value) {\n      @if (onIconTemplate() || _onIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"onIconTemplate() || _onIconTemplate; context: { $implicit: star + 1, class: cx('onIcon') }\"></ng-container>\n      } @else {\n        @if (iconOnClass()) {\n          <span [class]=\"cx('onIcon')\" [ngStyle]=\"iconOnStyle()\" [ngClass]=\"iconOnClass()\" [hBind]=\"ptm('onIcon')\"></span>\n        }\n        @if (!iconOnClass()) {\n          <svg data-h-icon=\"star-fill\" [ngStyle]=\"iconOnStyle()\" [class]=\"cx('onIcon')\" [hBind]=\"ptm('onIcon')\" />\n        }\n      }\n    } @else {\n      @if (offIconTemplate() || _offIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"offIconTemplate() || _offIconTemplate; context: { $implicit: star + 1, class: cx('offIcon') }\"></ng-container>\n      } @else {\n        @if (iconOffClass()) {\n          <span [class]=\"cx('offIcon')\" [ngStyle]=\"iconOffStyle()\" [ngClass]=\"iconOffClass()\" [hBind]=\"ptm('offIcon')\"></span>\n        }\n        @if (!iconOffClass()) {\n          <svg data-h-icon=\"star\" [ngStyle]=\"iconOffStyle()\" [class]=\"cx('offIcon')\" [hBind]=\"ptm('offIcon')\" />\n        }\n      }\n    }\n  </div>\n}\n" }]
-        }], propDecorators: { readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], stars: [{ type: i0.Input, args: [{ isSignal: true, alias: "stars", required: false }] }], iconOnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnClass", required: false }] }], iconOnStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnStyle", required: false }] }], iconOffClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOffClass", required: false }] }], iconOffStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOffStyle", required: false }] }], autofocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autofocus", required: false }] }], onRate: [{ type: i0.Output, args: ["onRate"] }], onFocus: [{ type: i0.Output, args: ["onFocus"] }], onBlur: [{ type: i0.Output, args: ["onBlur"] }], onIconTemplate: [{ type: i0.ContentChild, args: ['onicon', { ...{ descendants: false }, isSignal: true }] }], offIconTemplate: [{ type: i0.ContentChild, args: ['officon', { ...{ descendants: false }, isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }] }] } });
-class RatingModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RatingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: RatingModule, imports: [Rating, SharedModule], exports: [Rating, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RatingModule, imports: [Rating, SharedModule, SharedModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RatingModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [Rating, SharedModule],
-                    exports: [Rating, SharedModule]
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+var Rating = class Rating extends BaseEditableHolder {
+	componentName = "Rating";
+	$pcRating = inject(RATING_INSTANCE, {
+		optional: true,
+		skipSelf: true
+	}) ?? void 0;
+	bindDirectiveInstance = inject(Bind, { self: true });
+	onAfterViewChecked() {
+		this.bindDirectiveInstance.setAttrs(this.ptms(["host", "root"]));
+	}
+	readonly = input(void 0, {
+		...ngDevMode ? { debugName: "readonly" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	stars = input(5, {
+		...ngDevMode ? { debugName: "stars" } : 		/* istanbul ignore next */ {},
+		transform: numberAttribute
+	});
+	iconOnClass = input(...ngDevMode ? [void 0, { debugName: "iconOnClass" }] : 	/* istanbul ignore next */ []);
+	iconOnStyle = input(...ngDevMode ? [void 0, { debugName: "iconOnStyle" }] : 	/* istanbul ignore next */ []);
+	iconOffClass = input(...ngDevMode ? [void 0, { debugName: "iconOffClass" }] : 	/* istanbul ignore next */ []);
+	iconOffStyle = input(...ngDevMode ? [void 0, { debugName: "iconOffStyle" }] : 	/* istanbul ignore next */ []);
+	autofocus = input(void 0, {
+		...ngDevMode ? { debugName: "autofocus" } : 		/* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	onRate = output();
+	onFocus = output();
+	onBlur = output();
+	onIconTemplate = contentChild("onicon", {
+		...ngDevMode ? { debugName: "onIconTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	offIconTemplate = contentChild("officon", {
+		...ngDevMode ? { debugName: "offIconTemplate" } : 		/* istanbul ignore next */ {},
+		descendants: false
+	});
+	templates = contentChildren(HelixTemplate, ...ngDevMode ? [{ debugName: "templates" }] : 	/* istanbul ignore next */ []);
+	value;
+	starsArray;
+	isFocusVisibleItem = true;
+	focusedOptionIndex = signal(-1, ...ngDevMode ? [{ debugName: "focusedOptionIndex" }] : 	/* istanbul ignore next */ []);
+	nameattr;
+	_componentStyle = inject(RatingStyle);
+	_onIconTemplate;
+	_offIconTemplate;
+	onInit() {
+		this.nameattr = this.nameattr || uuid("pn_id_");
+		this.starsArray = [];
+		for (let i = 0; i < this.stars(); i++) this.starsArray[i] = i;
+	}
+	onAfterContentInit() {
+		this.templates().forEach((item) => {
+			switch (item.getType()) {
+				case "onicon":
+					this._onIconTemplate = item.template;
+					break;
+				case "officon":
+					this._offIconTemplate = item.template;
+					break;
+			}
+		});
+	}
+	onOptionClick(event, value) {
+		if (!this.readonly() && !this.$disabled()) {
+			this.onOptionSelect(event, value);
+			this.isFocusVisibleItem = false;
+			const firstFocusableEl = getFirstFocusableElement(event.currentTarget, "");
+			firstFocusableEl && focus(firstFocusableEl);
+		}
+	}
+	onOptionSelect(event, value) {
+		if (!this.readonly() && !this.$disabled()) if (this.focusedOptionIndex() === value || value === this.value) {
+			this.focusedOptionIndex.set(-1);
+			this.updateModel(event, null);
+		} else {
+			this.focusedOptionIndex.set(value);
+			this.updateModel(event, value || null);
+		}
+	}
+	onChange(event, value) {
+		this.onOptionSelect(event, value);
+		this.isFocusVisibleItem = true;
+	}
+	onInputBlur(event) {
+		this.focusedOptionIndex.set(-1);
+		this.onBlur.emit(event);
+	}
+	onInputFocus(event, value) {
+		if (!this.readonly() && !this.$disabled()) {
+			this.focusedOptionIndex.set(value);
+			this.isFocusVisibleItem = event.sourceCapabilities?.firesTouchEvents === false;
+			this.onFocus.emit(event);
+		}
+	}
+	updateModel(event, value) {
+		this.writeValue(value);
+		this.onModelChange(this.value);
+		this.onModelTouched();
+		this.onRate.emit({
+			originalEvent: event,
+			value
+		});
+	}
+	starAriaLabel(value) {
+		return value === 1 ? this.config.translation.aria?.star : this.config.translation.aria?.stars?.replace(/{star}/g, value);
+	}
+	getIconTemplate(i) {
+		return !this.value || i >= this.value ? this.offIconTemplate() || this._offIconTemplate : this.onIconTemplate() || this.offIconTemplate();
+	}
+	writeControlValue(value, setModelValue) {
+		this.value = value;
+		setModelValue(value);
+	}
+	get isCustomIcon() {
+		return !!(this.onIconTemplate || this._onIconTemplate || this.offIconTemplate || this._offIconTemplate);
+	}
+	get dataP() {
+		return this.cn({
+			readonly: this.readonly(),
+			disabled: this.$disabled()
+		});
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: Rating,
+		deps: null,
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: Rating,
+		isStandalone: true,
+		selector: "h-rating",
+		inputs: {
+			readonly: {
+				classPropertyName: "readonly",
+				publicName: "readonly",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			stars: {
+				classPropertyName: "stars",
+				publicName: "stars",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			iconOnClass: {
+				classPropertyName: "iconOnClass",
+				publicName: "iconOnClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			iconOnStyle: {
+				classPropertyName: "iconOnStyle",
+				publicName: "iconOnStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			iconOffClass: {
+				classPropertyName: "iconOffClass",
+				publicName: "iconOffClass",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			iconOffStyle: {
+				classPropertyName: "iconOffStyle",
+				publicName: "iconOffStyle",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			autofocus: {
+				classPropertyName: "autofocus",
+				publicName: "autofocus",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: {
+			onRate: "onRate",
+			onFocus: "onFocus",
+			onBlur: "onBlur"
+		},
+		host: { properties: {
+			"class": "cx('root')",
+			"attr.data-h": "dataP"
+		} },
+		providers: [
+			RATING_VALUE_ACCESSOR,
+			RatingStyle,
+			{
+				provide: RATING_INSTANCE,
+				useExisting: Rating
+			},
+			{
+				provide: PARENT_INSTANCE,
+				useExisting: Rating
+			}
+		],
+		queries: [
+			{
+				propertyName: "onIconTemplate",
+				first: true,
+				predicate: ["onicon"],
+				isSignal: true
+			},
+			{
+				propertyName: "offIconTemplate",
+				first: true,
+				predicate: ["officon"],
+				isSignal: true
+			},
+			{
+				propertyName: "templates",
+				predicate: HelixTemplate,
+				isSignal: true
+			}
+		],
+		usesInheritance: true,
+		hostDirectives: [{ directive: i1.Bind }],
+		ngImport: i0,
+		template: "@for (star of starsArray; track star; let i = $index) {\n  <div [class]=\"cx('option', { star, value })\" (click)=\"onOptionClick($event, star + 1)\" [hBind]=\"ptm('option')\">\n    <span class=\"h-hidden-accessible\" [attr.data-h-hidden-accessible]=\"true\" [hBind]=\"ptm('hiddenOptionInputContainer')\">\n      <input\n        type=\"radio\"\n        [value]=\"star + 1\"\n        [attr.name]=\"name() || nameattr + '_name'\"\n        [attr.value]=\"modelValue()\"\n        [attr.required]=\"required() ? '' : undefined\"\n        [attr.readonly]=\"readonly() ? '' : undefined\"\n        [attr.disabled]=\"$disabled() ? '' : undefined\"\n        [checked]=\"value === star + 1\"\n        [attr.aria-label]=\"starAriaLabel(star + 1)\"\n        (focus)=\"onInputFocus($event, star + 1)\"\n        (blur)=\"onInputBlur($event)\"\n        (change)=\"onChange($event, star + 1)\"\n        [hAutoFocus]=\"autofocus()\"\n        [hBind]=\"ptm('hiddenOptionInput')\"\n        />\n    </span>\n    @if (star + 1 <= value) {\n      @if (onIconTemplate() || _onIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"onIconTemplate() || _onIconTemplate; context: { $implicit: star + 1, class: cx('onIcon') }\"></ng-container>\n      } @else {\n        @if (iconOnClass()) {\n          <span [class]=\"cx('onIcon')\" [ngStyle]=\"iconOnStyle()\" [ngClass]=\"iconOnClass()\" [hBind]=\"ptm('onIcon')\"></span>\n        }\n        @if (!iconOnClass()) {\n          <svg data-h-icon=\"star-fill\" [ngStyle]=\"iconOnStyle()\" [class]=\"cx('onIcon')\" [hBind]=\"ptm('onIcon')\" />\n        }\n      }\n    } @else {\n      @if (offIconTemplate() || _offIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"offIconTemplate() || _offIconTemplate; context: { $implicit: star + 1, class: cx('offIcon') }\"></ng-container>\n      } @else {\n        @if (iconOffClass()) {\n          <span [class]=\"cx('offIcon')\" [ngStyle]=\"iconOffStyle()\" [ngClass]=\"iconOffClass()\" [hBind]=\"ptm('offIcon')\"></span>\n        }\n        @if (!iconOffClass()) {\n          <svg data-h-icon=\"star\" [ngStyle]=\"iconOffStyle()\" [class]=\"cx('offIcon')\" [hBind]=\"ptm('offIcon')\" />\n        }\n      }\n    }\n  </div>\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: "directive",
+				type: i2.NgStyle,
+				selector: "[ngStyle]",
+				inputs: ["ngStyle"]
+			},
+			{
+				kind: "directive",
+				type: AutoFocus,
+				selector: "[hAutoFocus]",
+				inputs: ["hAutoFocus"]
+			},
+			{
+				kind: "component",
+				type: StarFillIcon,
+				selector: "[data-h-icon=\"star-fill\"]"
+			},
+			{
+				kind: "component",
+				type: StarIcon,
+				selector: "[data-h-icon=\"star\"]"
+			},
+			{
+				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: Rating,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "h-rating",
+			imports: [
+				CommonModule,
+				AutoFocus,
+				StarFillIcon,
+				StarIcon,
+				SharedModule,
+				BindModule
+			],
+			standalone: true,
+			providers: [
+				RATING_VALUE_ACCESSOR,
+				RatingStyle,
+				{
+					provide: RATING_INSTANCE,
+					useExisting: Rating
+				},
+				{
+					provide: PARENT_INSTANCE,
+					useExisting: Rating
+				}
+			],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			host: {
+				"[class]": "cx('root')",
+				"[attr.data-h]": "dataP"
+			},
+			hostDirectives: [Bind],
+			template: "@for (star of starsArray; track star; let i = $index) {\n  <div [class]=\"cx('option', { star, value })\" (click)=\"onOptionClick($event, star + 1)\" [hBind]=\"ptm('option')\">\n    <span class=\"h-hidden-accessible\" [attr.data-h-hidden-accessible]=\"true\" [hBind]=\"ptm('hiddenOptionInputContainer')\">\n      <input\n        type=\"radio\"\n        [value]=\"star + 1\"\n        [attr.name]=\"name() || nameattr + '_name'\"\n        [attr.value]=\"modelValue()\"\n        [attr.required]=\"required() ? '' : undefined\"\n        [attr.readonly]=\"readonly() ? '' : undefined\"\n        [attr.disabled]=\"$disabled() ? '' : undefined\"\n        [checked]=\"value === star + 1\"\n        [attr.aria-label]=\"starAriaLabel(star + 1)\"\n        (focus)=\"onInputFocus($event, star + 1)\"\n        (blur)=\"onInputBlur($event)\"\n        (change)=\"onChange($event, star + 1)\"\n        [hAutoFocus]=\"autofocus()\"\n        [hBind]=\"ptm('hiddenOptionInput')\"\n        />\n    </span>\n    @if (star + 1 <= value) {\n      @if (onIconTemplate() || _onIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"onIconTemplate() || _onIconTemplate; context: { $implicit: star + 1, class: cx('onIcon') }\"></ng-container>\n      } @else {\n        @if (iconOnClass()) {\n          <span [class]=\"cx('onIcon')\" [ngStyle]=\"iconOnStyle()\" [ngClass]=\"iconOnClass()\" [hBind]=\"ptm('onIcon')\"></span>\n        }\n        @if (!iconOnClass()) {\n          <svg data-h-icon=\"star-fill\" [ngStyle]=\"iconOnStyle()\" [class]=\"cx('onIcon')\" [hBind]=\"ptm('onIcon')\" />\n        }\n      }\n    } @else {\n      @if (offIconTemplate() || _offIconTemplate) {\n        <ng-container *ngTemplateOutlet=\"offIconTemplate() || _offIconTemplate; context: { $implicit: star + 1, class: cx('offIcon') }\"></ng-container>\n      } @else {\n        @if (iconOffClass()) {\n          <span [class]=\"cx('offIcon')\" [ngStyle]=\"iconOffStyle()\" [ngClass]=\"iconOffClass()\" [hBind]=\"ptm('offIcon')\"></span>\n        }\n        @if (!iconOffClass()) {\n          <svg data-h-icon=\"star\" [ngStyle]=\"iconOffStyle()\" [class]=\"cx('offIcon')\" [hBind]=\"ptm('offIcon')\" />\n        }\n      }\n    }\n  </div>\n}\n"
+		}]
+	}],
+	propDecorators: {
+		readonly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readonly",
+				required: false
+			}]
+		}],
+		stars: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "stars",
+				required: false
+			}]
+		}],
+		iconOnClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "iconOnClass",
+				required: false
+			}]
+		}],
+		iconOnStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "iconOnStyle",
+				required: false
+			}]
+		}],
+		iconOffClass: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "iconOffClass",
+				required: false
+			}]
+		}],
+		iconOffStyle: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "iconOffStyle",
+				required: false
+			}]
+		}],
+		autofocus: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "autofocus",
+				required: false
+			}]
+		}],
+		onRate: [{
+			type: i0.Output,
+			args: ["onRate"]
+		}],
+		onFocus: [{
+			type: i0.Output,
+			args: ["onFocus"]
+		}],
+		onBlur: [{
+			type: i0.Output,
+			args: ["onBlur"]
+		}],
+		onIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["onicon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		offIconTemplate: [{
+			type: i0.ContentChild,
+			args: ["officon", {
+				descendants: false,
+				isSignal: true
+			}]
+		}],
+		templates: [{
+			type: i0.ContentChildren,
+			args: [i0.forwardRef(() => HelixTemplate), { isSignal: true }]
+		}]
+	}
+});
+var RatingModule = class RatingModule {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RatingModule,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.NgModule
+	});
+	static ɵmod = i0.ɵɵngDeclareNgModule({
+		minVersion: "14.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RatingModule,
+		imports: [Rating, SharedModule],
+		exports: [Rating, SharedModule]
+	});
+	static ɵinj = i0.ɵɵngDeclareInjector({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: RatingModule,
+		imports: [
+			Rating,
+			SharedModule,
+			SharedModule
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: RatingModule,
+	decorators: [{
+		type: NgModule,
+		args: [{
+			imports: [Rating, SharedModule],
+			exports: [Rating, SharedModule]
+		}]
+	}]
+});
 export { RATING_VALUE_ACCESSOR, Rating, RatingClasses, RatingModule, RatingStyle };
-//# sourceMappingURL=gravionlabs-helix-core-rating.mjs.map
+
+//# sourceMappingURL=gravionlabs-helix-core-rating.mjs.map