cax-design-system 2.8.4 → 3.0.0

package/fesm2022/{cax-design-system-chips.mjs → cax-design-system-inputchips.mjs}

@@ -8,22 +8,23 @@ import { SharedModule, CaxTemplate } from 'cax-design-system/api';
 import { UniqueComponentId } from 'cax-design-system/utils';
 import * as i3 from 'cax-design-system/autofocus';
 import { AutoFocusModule } from 'cax-design-system/autofocus';
-import { TimesIcon } from 'cax-design-system/icons/times';
-import { TimesCircleIcon } from 'cax-design-system/icons/timescircle';
 import { InputTextModule } from 'cax-design-system/inputtext';
-import * as i4 from 'cax-design-system/chip';
 import { ChipModule } from 'cax-design-system/chip';
+import * as i4 from 'cax-design-system/tag';
+import { TagModule } from 'cax-design-system/tag';
+import { TimesIcon } from 'cax-design-system/icons/times';
+import { TimesCircleIcon } from 'cax-design-system/icons/timescircle';
 
 const CHIPS_VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
-    useExisting: forwardRef(() => Chips),
+    useExisting: forwardRef(() => InputChips),
     multi: true
 };
 /**
  * Chips groups a collection of contents in tabs.
  * @group Components
  */
-class Chips {
+class InputChips {
     document;
     el;
     cd;
@@ -34,6 +35,7 @@ class Chips {
     rightIcon = false;
     chipIcon;
     label;
+    readonly = false;
     chipsScrollable;
     isTyping = false;
     /**
@@ -146,6 +148,21 @@ class Chips {
      * @group Props
      */
     size = 'md';
+    /**
+     * Whether the input is in an invalid state.
+     * @group Props
+     */
+    invalid = false;
+    /**
+     * Text to display when the input is valid.
+     * @group Props
+     */
+    successText;
+    /**
+     * Text to display when the input is invalid.
+     * @group Props
+     */
+    errorText;
     /**
      * Callback to invoke on chip add.
      * @param {ChipsAddEvent} event - Custom chip add event.
@@ -181,6 +198,7 @@ class Chips {
      * @group Emits
      */
     onClear = new EventEmitter();
+    valueChange = new EventEmitter();
     inputViewChild;
     containerViewChild;
     templates;
@@ -188,7 +206,7 @@ class Chips {
     removeTokenIconTemplate;
     clearIconTemplate;
     value;
-    severity = 'primary';
+    color = 'grey';
     onModelChange = () => { };
     onModelTouched = () => { };
     valueChanged;
@@ -281,7 +299,7 @@ class Chips {
         }
     }
     onInput() {
-        if (this.disabled)
+        if (this.disabled || this.readonly)
             return;
         this.updateFilledState();
         this.focusedIndex = null;
@@ -306,7 +324,7 @@ class Chips {
         });
     }
     onPaste(event) {
-        if (!this.disabled) {
+        if (!this.disabled && !this.readonly) {
             if (this.separator) {
                 const pastedData = (event.clipboardData || this.document.defaultView['clipboardData']).getData('Text');
                 pastedData.split(this.separator).forEach((val) => {
@@ -326,7 +344,7 @@ class Chips {
         }
     }
     onItemClick(event, item) {
-        if (this.disabled)
+        if (this.disabled || this.readonly)
             return;
         this.onChipClick.emit({
             originalEvent: event,
@@ -384,7 +402,7 @@ class Chips {
         this.cd.markForCheck();
     }
     removeItem(event, index) {
-        if (this.disabled) {
+        if (this.disabled || this.readonly) {
             return;
         }
         let removedItem = this.value[index];
@@ -392,6 +410,7 @@ class Chips {
         this.focusedIndex = null;
         this.inputViewChild.nativeElement.focus();
         this.onModelChange(this.value);
+        this.valueChange.emit(this.value);
         this.onRemove.emit({
             originalEvent: event,
             value: removedItem
@@ -400,12 +419,15 @@ class Chips {
         this.updateMaxedOut();
     }
     addItem(event, item, preventDefault) {
+        if (this.disabled || this.readonly)
+            return;
         this.value = this.value || [];
         if (item && item.trim().length) {
             const newItemIsDuplicate = this.caseSensitiveDuplication ? this.value.includes(item) : this.value.some((val) => val.toLowerCase() === item.toLowerCase());
             if ((this.allowDuplicate || !newItemIsDuplicate) && !this.isMaxedOut) {
                 this.value = [...this.value, item];
                 this.onModelChange(this.value);
+                this.valueChange.emit(this.value);
                 this.onAdd.emit({
                     originalEvent: event,
                     value: item
@@ -431,14 +453,17 @@ class Chips {
      * @group Method
      */
     clear() {
+        if (this.disabled || this.readonly)
+            return;
         this.value = null;
         this.updateFilledState();
         this.onModelChange(this.value);
+        this.valueChange.emit(this.value);
         this.updateMaxedOut();
         this.onClear.emit();
     }
     onKeyDown(event) {
-        if (this.disabled)
+        if (this.disabled || this.readonly)
             return;
         this.scrollToLastChip();
         const inputValue = event.target.value;
@@ -500,17 +525,19 @@ class Chips {
             }
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: Chips, deps: [{ token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.caxConfig }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.16", type: Chips, isStandalone: true, selector: "cax-chips", inputs: { leftIconClass: "leftIconClass", leftIcon: "leftIcon", rightIconClass: "rightIconClass", rightIcon: "rightIcon", chipIcon: "chipIcon", label: "label", style: "style", styleClass: "styleClass", disabled: ["disabled", "disabled", booleanAttribute], field: "field", placeholder: "placeholder", max: ["max", "max", numberAttribute], maxLength: "maxLength", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", tabindex: ["tabindex", "tabindex", numberAttribute], inputId: "inputId", allowDuplicate: ["allowDuplicate", "allowDuplicate", booleanAttribute], caseSensitiveDuplication: ["caseSensitiveDuplication", "caseSensitiveDuplication", booleanAttribute], inputStyle: "inputStyle", inputStyleClass: "inputStyleClass", addOnTab: ["addOnTab", "addOnTab", booleanAttribute], addOnBlur: ["addOnBlur", "addOnBlur", booleanAttribute], separator: "separator", showClear: ["showClear", "showClear", booleanAttribute], autofocus: ["autofocus", "autofocus", booleanAttribute], variant: "variant", size: "size", value: "value", severity: "severity" }, outputs: { onAdd: "onAdd", onRemove: "onRemove", onFocus: "onFocus", onBlur: "onBlur", onChipClick: "onChipClick", onClear: "onClear" }, host: { properties: { "class.cax-inputwrapper-filled": "filled", "class.cax-inputwrapper-focus": "focused", "class.cax-chips-clearable": "showClear" }, classAttribute: "cax-element cax-inputwrapper" }, providers: [CHIPS_VALUE_ACCESSOR], queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "chipsScrollable", first: true, predicate: ["chipsScrollable"], descendants: true }, { propertyName: "inputViewChild", first: true, predicate: ["inputtext"], descendants: true }, { propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"{'cax-chips': true, 'cax-chips-size-sm': size === 'sm', 'cax-chips-size-md': size === 'md', 'cax-chips-size-lg': size === 'lg', 'cax-chips-disabled': disabled}\" [ngStyle]=\"style\" [class]=\"styleClass\">\r\n    <label *ngIf=\"label\" class=\"cax-chips-label\">{{label}}</label>\r\n\r\n    <div class=\"cax-chips-container\" [ngClass]=\"{'cax-focus': focused && !disabled, 'no-chips': !value?.length}\">\r\n        <span *ngIf=\"leftIcon\" class=\"cax-chips-icon-left\">\r\n            <i [ngClass]=\"leftIconClass\"></i>\r\n        </span>\r\n\r\n        <div class=\"cax-chips-content\" #chipsScrollable>\r\n            <div class=\"cax-chips-list\">\r\n                <cax-chip\r\n                    *ngFor=\"let item of value; let i = index\"\r\n                    [label]=\"field ? resolveFieldData(item, field) : item\"\r\n                    [removable]=\"true\"\r\n                    [size]=\"size\"\r\n                    [icon]=\"chipIcon\"\r\n                    [severity]=\"severity\"\r\n                    (onRemove)=\"removeItem($event, i)\"\r\n                    (click)=\"onItemClick($event, item)\"\r\n                    [class.cax-focus]=\"focusedIndex === i\"\r\n                >\r\n                </cax-chip>\r\n                <input\r\n                    #inputtext\r\n                    class=\"cax-chips-input\"\r\n                    [attr.placeholder]=\"(!value || !value.length) ? placeholder : ''\"\r\n                    (keydown)=\"onKeyDown($event)\"\r\n                    (input)=\"onInput()\"\r\n                    (paste)=\"onPaste($event)\"\r\n                    (focus)=\"onInputFocus($event)\"\r\n                    (blur)=\"onInputBlur($event)\"\r\n                    type=\"text\"\r\n                    [attr.id]=\"inputId\"\r\n                    [attr.maxlength]=\"maxLength\"\r\n                    [attr.tabindex]=\"tabindex\"\r\n                    [disabled]=\"disabled || isMaxedOut\"\r\n                    [ngStyle]=\"inputStyle\"\r\n                    [class]=\"inputStyleClass\"\r\n                    caxAutoFocus\r\n                    [autofocus]=\"autofocus\"\r\n                />\r\n            </div>\r\n        </div>\r\n\r\n        <span *ngIf=\"showClear && value?.length\" class=\"cax-chips-clear-icon\" (click)=\"clear()\">\r\n            <i class=\"cax cax-close-circle\"></i>\r\n        </span>\r\n        <span *ngIf=\"rightIcon\" class=\"cax-chips-icon-right\">\r\n            <i [ngClass]=\"rightIconClass\"></i>\r\n        </span>\r\n    </div>\r\n</div>\r\n", styles: ["@layer cax{.cax-chips{display:inline-flex;flex-direction:column}.cax-chips-multiple-container{margin:0;padding:0;list-style-type:none;cursor:text;overflow:hidden;display:flex;align-items:center;flex-wrap:wrap}.cax-chips-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto;max-width:100%;border-radius:8px;padding:0 10px;background:var(--neutral-100);border:1px solid var(--neutral-200);scroll-snap-align:end;scroll-snap-stop:always}.cax-chips-token:hover{border-color:var(--neutral-300)}.cax-chips-token-label{min-width:0%;overflow:auto}.cax-chips-token-label::-webkit-scrollbar{display:none}.cax-chips-input-token{flex:1 1 auto;display:inline-flex}.cax-chips-token-icon{cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px}.cax-chips-token-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-token-icon:hover{color:var(--neutral-900)}.cax-chips-input-token input{border:0 none;outline:0 none;background-color:transparent;margin:0;padding:0;box-shadow:none;border-radius:0;width:100%}.cax-fluid .cax-chips{display:flex}.cax-chips-clear-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-left:8px;cursor:pointer}.cax-chips-clear-icon:hover{color:var(--neutral-900)}.cax-chips-clear-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-clearable .cax-inputtext{position:relative}.cax-cax-edit-icon{margin-right:5px;height:15px;width:auto}.cax-chips-wrapper{display:flex;align-items:center;flex:1;min-width:0;position:relative}.cax-chips-content{display:flex;flex:1;min-width:0;overflow:hidden}.cax-input-icon-left{margin-right:10px}.cax-chips-multiple-container{display:flex;align-items:center;width:100%}.cax-chips-input-token{display:inline-flex;align-items:center;min-width:120px;flex:0 0 auto;height:100%}.cax-chips-input-token input{width:100%;background:transparent;border:none;outline:none;padding:4px;font-family:inherit;font-size:inherit}.cax-chips-icon-left{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-right:8px}.cax-chips-icon-left i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-icon-right{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-left:8px}.cax-chips-icon-right i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-icon-right:hover{color:var(--neutral-900)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: AutoFocusModule }, { kind: "directive", type: i3.AutoFocus, selector: "[caxAutoFocus]", inputs: ["autofocus"] }, { kind: "ngmodule", type: ChipModule }, { kind: "component", type: i4.Chip, selector: "cax-chip", inputs: ["label", "icon", "image", "alt", "style", "styleClass", "removable", "removeIcon", "size", "severity"], outputs: ["onRemove", "onImageError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputChips, deps: [{ token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.caxConfig }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.21", type: InputChips, isStandalone: true, selector: "cax-inputchips", inputs: { leftIconClass: "leftIconClass", leftIcon: "leftIcon", rightIconClass: "rightIconClass", rightIcon: "rightIcon", chipIcon: "chipIcon", label: "label", readonly: ["readonly", "readonly", booleanAttribute], style: "style", styleClass: "styleClass", disabled: ["disabled", "disabled", booleanAttribute], field: "field", placeholder: "placeholder", max: ["max", "max", numberAttribute], maxLength: "maxLength", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", tabindex: ["tabindex", "tabindex", numberAttribute], inputId: "inputId", allowDuplicate: ["allowDuplicate", "allowDuplicate", booleanAttribute], caseSensitiveDuplication: ["caseSensitiveDuplication", "caseSensitiveDuplication", booleanAttribute], inputStyle: "inputStyle", inputStyleClass: "inputStyleClass", addOnTab: ["addOnTab", "addOnTab", booleanAttribute], addOnBlur: ["addOnBlur", "addOnBlur", booleanAttribute], separator: "separator", showClear: ["showClear", "showClear", booleanAttribute], autofocus: ["autofocus", "autofocus", booleanAttribute], variant: "variant", size: "size", invalid: ["invalid", "invalid", booleanAttribute], successText: "successText", errorText: "errorText", value: "value", color: "color" }, outputs: { onAdd: "onAdd", onRemove: "onRemove", onFocus: "onFocus", onBlur: "onBlur", onChipClick: "onChipClick", onClear: "onClear", valueChange: "valueChange" }, host: { properties: { "class.cax-inputwrapper-filled": "filled", "class.cax-inputwrapper-focus": "focused", "class.cax-chips-clearable": "showClear", "class.cax-input-readonly": "readonly", "class.cax-invalid": "invalid" }, classAttribute: "cax-element cax-inputwrapper" }, providers: [CHIPS_VALUE_ACCESSOR], queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "chipsScrollable", first: true, predicate: ["chipsScrollable"], descendants: true }, { propertyName: "inputViewChild", first: true, predicate: ["inputtext"], descendants: true }, { propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div\n    [ngClass]=\"{'cax-chips': true, 'cax-chips-size-sm': size === 'sm', 'cax-chips-size-md': size === 'md', 'cax-chips-size-lg': size === 'lg', 'cax-chips-disabled': disabled, 'cax-chips-readonly': readonly, 'cax-invalid': invalid}\"\n    [ngStyle]=\"style\"\n    [class]=\"styleClass\"\n>\n    <label *ngIf=\"label\" class=\"cax-chips-label\" [ngClass]=\"{'cax-text-action-md-semibold': !size || size === 'md', 'cax-text-action-sm-semibold': size === 'sm', 'cax-text-action-lg-semibold': size === 'lg'}\">{{label}}</label>\n\n    <div class=\"cax-chips-container\" [ngClass]=\"{'cax-focus': focused && !disabled && !readonly, 'no-chips': !value?.length, 'cax-input-readonly': readonly}\">\n        <span *ngIf=\"leftIcon\" class=\"cax-chips-icon-left\">\n            <i [ngClass]=\"leftIconClass\"></i>\n        </span>\n\n        <div class=\"cax-chips-content\" #chipsScrollable>\n            <div class=\"cax-chips-list\">\n                <cax-tag\n                    *ngFor=\"let item of value; let i = index\"\n                    [value]=\"field ? resolveFieldData(item, field) : item\"\n                    [removable]=\"!disabled && !readonly\"\n                    [size]=\"size\"\n                    [icon]=\"chipIcon\"\n                    [color]=\"color\"\n                    (onRemove)=\"removeItem($event, i)\"\n                    (click)=\"onItemClick($event, item)\"\n                    [class.cax-focus]=\"focusedIndex === i\"\n                >\n                </cax-tag>\n                <input\n                    #inputtext\n                    class=\"cax-chips-input\"\n                    [attr.placeholder]=\"(!value || !value.length) ? placeholder : ''\"\n                    (keydown)=\"onKeyDown($event)\"\n                    (input)=\"onInput()\"\n                    (paste)=\"onPaste($event)\"\n                    (focus)=\"onInputFocus($event)\"\n                    (blur)=\"onInputBlur($event)\"\n                    type=\"text\"\n                    [attr.id]=\"inputId\"\n                    [attr.maxlength]=\"maxLength\"\n                    [attr.tabindex]=\"tabindex\"\n                    [disabled]=\"disabled || isMaxedOut\"\n                    [readonly]=\"readonly\"\n                    [ngStyle]=\"inputStyle\"\n                    [class]=\"inputStyleClass\"\n                    caxAutoFocus\n                    [autofocus]=\"autofocus\"\n                    [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\"\n                />\n            </div>\n        </div>\n\n        <span *ngIf=\"showClear && value?.length && !disabled && !readonly\" class=\"cax-chips-clear-icon\" (click)=\"clear()\">\n            <i class=\"cax cax-close-circle\"></i>\n        </span>\n        <span *ngIf=\"rightIcon\" class=\"cax-chips-icon-right\">\n            <i [ngClass]=\"rightIconClass\"></i>\n        </span>\n    </div>\n\n    <!-- Error Message with conditional opacity -->\n    <small *ngIf=\"invalid\" class=\"cax-chips-error\" [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\"> {{ errorText }} </small>\n\n    <!-- Helper Text with conditional opacity -->\n    <small *ngIf=\"successText && !invalid\" class=\"cax-chips-helper-text\" [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\">\n        {{ successText }}\n    </small>\n</div>\n", styles: ["@layer cax{.cax-chips{display:inline-flex;flex-direction:column}.cax-chips-multiple-container{margin:0;padding:0;list-style-type:none;cursor:text;overflow:hidden;display:flex;align-items:center;flex-wrap:wrap}.cax-chips-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto;max-width:100%;border-radius:8px;padding:0 10px;background:var(--neutral-100);border:1px solid var(--neutral-200);scroll-snap-align:end;scroll-snap-stop:always}.cax-chips-token:hover{border-color:var(--neutral-300)}.cax-chips-token-label{min-width:0%;overflow:auto}.cax-chips-token-label::-webkit-scrollbar{display:none}.cax-chips-input-token{flex:1 1 auto;display:inline-flex}.cax-chips-token-icon{cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px}.cax-chips-token-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-token-icon:hover{color:var(--neutral-900)}.cax-chips-input-token input{border:0 none;outline:0 none;background-color:transparent;margin:0;padding:0;box-shadow:none;border-radius:0;width:100%}.cax-fluid .cax-chips{display:flex}.cax-chips-clear-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-left:8px;cursor:pointer}.cax-chips-clear-icon:hover{color:var(--neutral-900)}.cax-chips-clear-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-clearable .cax-inputtext{position:relative}.cax-cax-edit-icon{margin-right:5px;height:15px;width:auto}.cax-chips-wrapper{display:flex;align-items:center;flex:1;min-width:0;position:relative}.cax-chips-content{display:flex;flex:1;min-width:0;overflow:hidden}.cax-input-icon-left{margin-right:10px}.cax-chips-multiple-container{display:flex;align-items:center;width:100%}.cax-chips-input-token{display:inline-flex;align-items:center;min-width:120px;flex:0 0 auto;height:100%}.cax-chips-input-token input{width:100%;background:transparent;border:none;outline:none;padding:4px;font-family:inherit;font-size:inherit}.cax-chips-icon-left,.cax-chips-icon-right{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: AutoFocusModule }, { kind: "directive", type: i3.AutoFocus, selector: "[caxAutoFocus]", inputs: ["autofocus"] }, { kind: "ngmodule", type: ChipModule }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i4.Tag, selector: "cax-tag", inputs: ["style", "styleClass", "color", "value", "icon", "rounded", "size", "removable", "image", "ariaLabel"], outputs: ["onRemove", "onImageError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: Chips, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputChips, decorators: [{
             type: Component,
-            args: [{ selector: 'cax-chips', standalone: true, imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, ChipModule], host: {
+            args: [{ selector: 'cax-inputchips', standalone: true, imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, ChipModule, TagModule], host: {
                         class: 'cax-element cax-inputwrapper',
                         '[class.cax-inputwrapper-filled]': 'filled',
                         '[class.cax-inputwrapper-focus]': 'focused',
-                        '[class.cax-chips-clearable]': 'showClear'
-                    }, providers: [CHIPS_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div [ngClass]=\"{'cax-chips': true, 'cax-chips-size-sm': size === 'sm', 'cax-chips-size-md': size === 'md', 'cax-chips-size-lg': size === 'lg', 'cax-chips-disabled': disabled}\" [ngStyle]=\"style\" [class]=\"styleClass\">\r\n    <label *ngIf=\"label\" class=\"cax-chips-label\">{{label}}</label>\r\n\r\n    <div class=\"cax-chips-container\" [ngClass]=\"{'cax-focus': focused && !disabled, 'no-chips': !value?.length}\">\r\n        <span *ngIf=\"leftIcon\" class=\"cax-chips-icon-left\">\r\n            <i [ngClass]=\"leftIconClass\"></i>\r\n        </span>\r\n\r\n        <div class=\"cax-chips-content\" #chipsScrollable>\r\n            <div class=\"cax-chips-list\">\r\n                <cax-chip\r\n                    *ngFor=\"let item of value; let i = index\"\r\n                    [label]=\"field ? resolveFieldData(item, field) : item\"\r\n                    [removable]=\"true\"\r\n                    [size]=\"size\"\r\n                    [icon]=\"chipIcon\"\r\n                    [severity]=\"severity\"\r\n                    (onRemove)=\"removeItem($event, i)\"\r\n                    (click)=\"onItemClick($event, item)\"\r\n                    [class.cax-focus]=\"focusedIndex === i\"\r\n                >\r\n                </cax-chip>\r\n                <input\r\n                    #inputtext\r\n                    class=\"cax-chips-input\"\r\n                    [attr.placeholder]=\"(!value || !value.length) ? placeholder : ''\"\r\n                    (keydown)=\"onKeyDown($event)\"\r\n                    (input)=\"onInput()\"\r\n                    (paste)=\"onPaste($event)\"\r\n                    (focus)=\"onInputFocus($event)\"\r\n                    (blur)=\"onInputBlur($event)\"\r\n                    type=\"text\"\r\n                    [attr.id]=\"inputId\"\r\n                    [attr.maxlength]=\"maxLength\"\r\n                    [attr.tabindex]=\"tabindex\"\r\n                    [disabled]=\"disabled || isMaxedOut\"\r\n                    [ngStyle]=\"inputStyle\"\r\n                    [class]=\"inputStyleClass\"\r\n                    caxAutoFocus\r\n                    [autofocus]=\"autofocus\"\r\n                />\r\n            </div>\r\n        </div>\r\n\r\n        <span *ngIf=\"showClear && value?.length\" class=\"cax-chips-clear-icon\" (click)=\"clear()\">\r\n            <i class=\"cax cax-close-circle\"></i>\r\n        </span>\r\n        <span *ngIf=\"rightIcon\" class=\"cax-chips-icon-right\">\r\n            <i [ngClass]=\"rightIconClass\"></i>\r\n        </span>\r\n    </div>\r\n</div>\r\n", styles: ["@layer cax{.cax-chips{display:inline-flex;flex-direction:column}.cax-chips-multiple-container{margin:0;padding:0;list-style-type:none;cursor:text;overflow:hidden;display:flex;align-items:center;flex-wrap:wrap}.cax-chips-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto;max-width:100%;border-radius:8px;padding:0 10px;background:var(--neutral-100);border:1px solid var(--neutral-200);scroll-snap-align:end;scroll-snap-stop:always}.cax-chips-token:hover{border-color:var(--neutral-300)}.cax-chips-token-label{min-width:0%;overflow:auto}.cax-chips-token-label::-webkit-scrollbar{display:none}.cax-chips-input-token{flex:1 1 auto;display:inline-flex}.cax-chips-token-icon{cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px}.cax-chips-token-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-token-icon:hover{color:var(--neutral-900)}.cax-chips-input-token input{border:0 none;outline:0 none;background-color:transparent;margin:0;padding:0;box-shadow:none;border-radius:0;width:100%}.cax-fluid .cax-chips{display:flex}.cax-chips-clear-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-left:8px;cursor:pointer}.cax-chips-clear-icon:hover{color:var(--neutral-900)}.cax-chips-clear-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-clearable .cax-inputtext{position:relative}.cax-cax-edit-icon{margin-right:5px;height:15px;width:auto}.cax-chips-wrapper{display:flex;align-items:center;flex:1;min-width:0;position:relative}.cax-chips-content{display:flex;flex:1;min-width:0;overflow:hidden}.cax-input-icon-left{margin-right:10px}.cax-chips-multiple-container{display:flex;align-items:center;width:100%}.cax-chips-input-token{display:inline-flex;align-items:center;min-width:120px;flex:0 0 auto;height:100%}.cax-chips-input-token input{width:100%;background:transparent;border:none;outline:none;padding:4px;font-family:inherit;font-size:inherit}.cax-chips-icon-left{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-right:8px}.cax-chips-icon-left i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-icon-right{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-left:8px}.cax-chips-icon-right i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-icon-right:hover{color:var(--neutral-900)}}\n"] }]
+                        '[class.cax-chips-clearable]': 'showClear',
+                        '[class.cax-input-readonly]': 'readonly',
+                        '[class.cax-invalid]': 'invalid'
+                    }, providers: [CHIPS_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n    [ngClass]=\"{'cax-chips': true, 'cax-chips-size-sm': size === 'sm', 'cax-chips-size-md': size === 'md', 'cax-chips-size-lg': size === 'lg', 'cax-chips-disabled': disabled, 'cax-chips-readonly': readonly, 'cax-invalid': invalid}\"\n    [ngStyle]=\"style\"\n    [class]=\"styleClass\"\n>\n    <label *ngIf=\"label\" class=\"cax-chips-label\" [ngClass]=\"{'cax-text-action-md-semibold': !size || size === 'md', 'cax-text-action-sm-semibold': size === 'sm', 'cax-text-action-lg-semibold': size === 'lg'}\">{{label}}</label>\n\n    <div class=\"cax-chips-container\" [ngClass]=\"{'cax-focus': focused && !disabled && !readonly, 'no-chips': !value?.length, 'cax-input-readonly': readonly}\">\n        <span *ngIf=\"leftIcon\" class=\"cax-chips-icon-left\">\n            <i [ngClass]=\"leftIconClass\"></i>\n        </span>\n\n        <div class=\"cax-chips-content\" #chipsScrollable>\n            <div class=\"cax-chips-list\">\n                <cax-tag\n                    *ngFor=\"let item of value; let i = index\"\n                    [value]=\"field ? resolveFieldData(item, field) : item\"\n                    [removable]=\"!disabled && !readonly\"\n                    [size]=\"size\"\n                    [icon]=\"chipIcon\"\n                    [color]=\"color\"\n                    (onRemove)=\"removeItem($event, i)\"\n                    (click)=\"onItemClick($event, item)\"\n                    [class.cax-focus]=\"focusedIndex === i\"\n                >\n                </cax-tag>\n                <input\n                    #inputtext\n                    class=\"cax-chips-input\"\n                    [attr.placeholder]=\"(!value || !value.length) ? placeholder : ''\"\n                    (keydown)=\"onKeyDown($event)\"\n                    (input)=\"onInput()\"\n                    (paste)=\"onPaste($event)\"\n                    (focus)=\"onInputFocus($event)\"\n                    (blur)=\"onInputBlur($event)\"\n                    type=\"text\"\n                    [attr.id]=\"inputId\"\n                    [attr.maxlength]=\"maxLength\"\n                    [attr.tabindex]=\"tabindex\"\n                    [disabled]=\"disabled || isMaxedOut\"\n                    [readonly]=\"readonly\"\n                    [ngStyle]=\"inputStyle\"\n                    [class]=\"inputStyleClass\"\n                    caxAutoFocus\n                    [autofocus]=\"autofocus\"\n                    [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\"\n                />\n            </div>\n        </div>\n\n        <span *ngIf=\"showClear && value?.length && !disabled && !readonly\" class=\"cax-chips-clear-icon\" (click)=\"clear()\">\n            <i class=\"cax cax-close-circle\"></i>\n        </span>\n        <span *ngIf=\"rightIcon\" class=\"cax-chips-icon-right\">\n            <i [ngClass]=\"rightIconClass\"></i>\n        </span>\n    </div>\n\n    <!-- Error Message with conditional opacity -->\n    <small *ngIf=\"invalid\" class=\"cax-chips-error\" [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\"> {{ errorText }} </small>\n\n    <!-- Helper Text with conditional opacity -->\n    <small *ngIf=\"successText && !invalid\" class=\"cax-chips-helper-text\" [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\">\n        {{ successText }}\n    </small>\n</div>\n", styles: ["@layer cax{.cax-chips{display:inline-flex;flex-direction:column}.cax-chips-multiple-container{margin:0;padding:0;list-style-type:none;cursor:text;overflow:hidden;display:flex;align-items:center;flex-wrap:wrap}.cax-chips-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto;max-width:100%;border-radius:8px;padding:0 10px;background:var(--neutral-100);border:1px solid var(--neutral-200);scroll-snap-align:end;scroll-snap-stop:always}.cax-chips-token:hover{border-color:var(--neutral-300)}.cax-chips-token-label{min-width:0%;overflow:auto}.cax-chips-token-label::-webkit-scrollbar{display:none}.cax-chips-input-token{flex:1 1 auto;display:inline-flex}.cax-chips-token-icon{cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px}.cax-chips-token-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-token-icon:hover{color:var(--neutral-900)}.cax-chips-input-token input{border:0 none;outline:0 none;background-color:transparent;margin:0;padding:0;box-shadow:none;border-radius:0;width:100%}.cax-fluid .cax-chips{display:flex}.cax-chips-clear-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px;color:var(--neutral-750);margin-left:8px;cursor:pointer}.cax-chips-clear-icon:hover{color:var(--neutral-900)}.cax-chips-clear-icon i{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.cax-chips-clearable .cax-inputtext{position:relative}.cax-cax-edit-icon{margin-right:5px;height:15px;width:auto}.cax-chips-wrapper{display:flex;align-items:center;flex:1;min-width:0;position:relative}.cax-chips-content{display:flex;flex:1;min-width:0;overflow:hidden}.cax-input-icon-left{margin-right:10px}.cax-chips-multiple-container{display:flex;align-items:center;width:100%}.cax-chips-input-token{display:inline-flex;align-items:center;min-width:120px;flex:0 0 auto;height:100%}.cax-chips-input-token input{width:100%;background:transparent;border:none;outline:none;padding:4px;font-family:inherit;font-size:inherit}.cax-chips-icon-left,.cax-chips-icon-right{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:20px;min-height:20px}}\n"] }]
         }], ctorParameters: () => [{ type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
@@ -526,6 +553,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                 type: Input
             }], label: [{
                 type: Input
+            }], readonly: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], chipsScrollable: [{
                 type: ViewChild,
                 args: ['chipsScrollable']
@@ -582,6 +612,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                 type: Input
             }], size: [{
                 type: Input
+            }], invalid: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], successText: [{
+                type: Input
+            }], errorText: [{
+                type: Input
             }], onAdd: [{
                 type: Output
             }], onRemove: [{
@@ -594,6 +631,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                 type: Output
             }], onClear: [{
                 type: Output
+            }], valueChange: [{
+                type: Output
             }], inputViewChild: [{
                 type: ViewChild,
                 args: ['inputtext']
@@ -605,20 +644,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                 args: [CaxTemplate]
             }], value: [{
                 type: Input
-            }], severity: [{
+            }], color: [{
                 type: Input
             }] } });
 
-class ChipsModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: ChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.16", ngImport: i0, type: ChipsModule, imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, Chips, ChipModule], exports: [Chips, InputTextModule, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: ChipsModule, imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, Chips, ChipModule, InputTextModule, SharedModule] });
+class InputChipsModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: InputChipsModule, imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, InputChips, ChipModule], exports: [InputChips, InputTextModule, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputChipsModule, imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, InputChips, ChipModule, InputTextModule, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: ChipsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputChipsModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, Chips, ChipModule],
-                    exports: [Chips, InputTextModule, SharedModule]
+                    imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, InputChips, ChipModule],
+                    exports: [InputChips, InputTextModule, SharedModule]
                 }]
         }] });
 
@@ -626,5 +665,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { CHIPS_VALUE_ACCESSOR, Chips, ChipsModule };
-//# sourceMappingURL=cax-design-system-chips.mjs.map
+export { CHIPS_VALUE_ACCESSOR, InputChips, InputChipsModule };
+//# sourceMappingURL=cax-design-system-inputchips.mjs.map

package/fesm2022/cax-design-system-inputchips.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cax-design-system-inputchips.mjs","sources":["../../src/app/components/inputchips/inputchips.ts","../../src/app/components/inputchips/inputchips.html","../../src/app/components/inputchips/inputchips.module.ts","../../src/app/components/inputchips/cax-design-system-inputchips.ts"],"sourcesContent":["import { CommonModule, DOCUMENT } from '@angular/common';\nimport {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    Inject,\n    Input,\n    Output,\n    QueryList,\n    TemplateRef,\n    ViewChild,\n    ViewEncapsulation,\n    booleanAttribute,\n    forwardRef,\n    numberAttribute\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { caxConfig, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { UniqueComponentId } from 'cax-design-system/utils';\nimport { ChipsAddEvent, ChipsClickEvent, ChipsRemoveEvent } from './inputchips.interface';\nimport { AutoFocusModule } from 'cax-design-system/autofocus';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { ChipModule } from 'cax-design-system/chip';\nimport { TagModule } from 'cax-design-system/tag';\n\nexport const CHIPS_VALUE_ACCESSOR: any = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => InputChips),\n    multi: true\n};\n/**\n * Chips groups a collection of contents in tabs.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputchips',\n    templateUrl: './inputchips.html',\n    standalone: true,\n    imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, ChipModule, TagModule],\n    host: {\n        class: 'cax-element cax-inputwrapper',\n        '[class.cax-inputwrapper-filled]': 'filled',\n        '[class.cax-inputwrapper-focus]': 'focused',\n        '[class.cax-chips-clearable]': 'showClear',\n        '[class.cax-input-readonly]': 'readonly',\n        '[class.cax-invalid]': 'invalid'\n    },\n    providers: [CHIPS_VALUE_ACCESSOR],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./inputchips.scss']\n})\nexport class InputChips implements AfterContentInit, ControlValueAccessor {\n    @Input() leftIconClass: string = '';\n    @Input() leftIcon?: boolean = false;\n    @Input() rightIconClass: string = '';\n    @Input() rightIcon?: boolean = false;\n    @Input() chipIcon: string | undefined;\n    @Input() label: string | undefined;\n    @Input({ transform: booleanAttribute }) readonly: boolean = false;\n    @ViewChild('chipsScrollable') chipsScrollable!: ElementRef;\n\n    isTyping: boolean = false;\n\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Style class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * When present, it specifies that the element should be disabled.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) disabled: boolean | undefined;\n    /**\n     * Name of the property to display on a chip.\n     * @group Props\n     */\n    @Input() field: string | undefined;\n    /**\n     * Advisory information to display on input.\n     * @group Props\n     */\n    @Input() placeholder: string | undefined;\n    /**\n     * Maximum number of entries allowed.\n     * @group Props\n     */\n    @Input({ transform: numberAttribute }) max: number | undefined;\n    /**\n     * Maximum length of a chip.\n     * @group Props\n     */\n    @Input() maxLength: number | undefined;\n    /**\n     * Defines a string that labels the input for accessibility.\n     * @group Props\n     */\n    @Input() ariaLabel: string | undefined;\n    /**\n     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.\n     * @group Props\n     */\n    @Input() ariaLabelledBy: string | undefined;\n    /**\n     * Index of the element in tabbing order.\n     * @group Props\n     */\n    @Input({ transform: numberAttribute }) tabindex: number | undefined;\n    /**\n     * Identifier of the focus input to match a label defined for the component.\n     * @group Props\n     */\n    @Input() inputId: string | undefined;\n    /**\n     * Whether to allow duplicate values or not.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) allowDuplicate: boolean = true;\n    /**\n     * Defines whether duplication check should be case-sensitive\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) caseSensitiveDuplication: boolean = true;\n    /**\n     * Inline style of the input field.\n     * @group Props\n     */\n    @Input() inputStyle: { [klass: string]: any } | null | undefined;\n    /**\n     * Style class of the input field.\n     * @group Props\n     */\n    @Input() inputStyleClass: string | undefined;\n    /**\n     * Whether to add an item on tab key press.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) addOnTab: boolean | undefined;\n    /**\n     * Whether to add an item when the input loses focus.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) addOnBlur: boolean | undefined;\n    /**\n     * Separator char to add an item when pressed in addition to the enter key.\n     * @group Props\n     */\n    @Input() separator: string | RegExp | undefined;\n    /**\n     * When enabled, a clear icon is displayed to clear the value.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) showClear: boolean = false;\n    /**\n     * When present, it specifies that the component should automatically get focus on load.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) autofocus: boolean | undefined;\n    /**\n     * Specifies the input variant of the component.\n     * @group Props\n     */\n    @Input() variant: 'filled' | 'outlined' = 'outlined';\n    /**\n     * Size of the component.\n     * @group Props\n     */\n    @Input() size: 'sm' | 'md' | 'lg' = 'md';\n    /**\n     * Whether the input is in an invalid state.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) invalid: boolean = false;\n    /**\n     * Text to display when the input is valid.\n     * @group Props\n     */\n    @Input() successText?: string;\n    /**\n     * Text to display when the input is invalid.\n     * @group Props\n     */\n    @Input() errorText?: string;\n    /**\n     * Callback to invoke on chip add.\n     * @param {ChipsAddEvent} event - Custom chip add event.\n     * @group Emits\n     */\n    @Output() onAdd: EventEmitter<ChipsAddEvent> = new EventEmitter<ChipsAddEvent>();\n    /**\n     * Callback to invoke on chip remove.\n     * @param {ChipsRemoveEvent} event - Custom chip remove event.\n     * @group Emits\n     */\n    @Output() onRemove: EventEmitter<ChipsRemoveEvent> = new EventEmitter<ChipsRemoveEvent>();\n    /**\n     * Callback to invoke on focus of input field.\n     * @param {Event} event - Browser event.\n     * @group Emits\n     */\n    @Output() onFocus: EventEmitter<Event> = new EventEmitter<Event>();\n    /**\n     * Callback to invoke on blur of input field.\n     * @param {Event} event - Browser event.\n     * @group Emits\n     */\n    @Output() onBlur: EventEmitter<Event> = new EventEmitter<Event>();\n    /**\n     * Callback to invoke on chip clicked.\n     * @param {ChipsClickEvent} event - Custom chip click event.\n     * @group Emits\n     */\n    @Output() onChipClick: EventEmitter<ChipsClickEvent> = new EventEmitter<ChipsClickEvent>();\n    /**\n     * Callback to invoke on clear token clicked.\n     * @group Emits\n     */\n    @Output() onClear: EventEmitter<any> = new EventEmitter<any>();\n\n    @Output() valueChange: EventEmitter<any> = new EventEmitter<any>();\n\n    @ViewChild('inputtext') inputViewChild!: ElementRef;\n\n    @ViewChild('container') containerViewChild!: ElementRef;\n\n    @ContentChildren(CaxTemplate) templates!: QueryList<any>;\n\n    public itemTemplate: Nullable<TemplateRef<any>>;\n\n    removeTokenIconTemplate: Nullable<TemplateRef<any>>;\n\n    clearIconTemplate: Nullable<TemplateRef<any>>;\n\n    @Input() value: any;\n\n    @Input() color: 'blue' | 'grey' | 'green' | 'orange' | 'red' | 'pink' | 'purple' | 'teal' | 'cyan' | 'olive' | 'azure' | 'magenta' = 'grey';\n\n    onModelChange: Function = () => {};\n\n    onModelTouched: Function = () => {};\n\n    valueChanged: Nullable<boolean>;\n\n    id = UniqueComponentId();\n\n    focused: Nullable<boolean>;\n\n    focusedIndex: Nullable<number>;\n\n    filled: Nullable<boolean>;\n\n    get focusedOptionId() {\n        return this.focusedIndex !== null ? `${this.id}_chips_item_${this.focusedIndex}` : null;\n    }\n\n    get isMaxedOut(): boolean {\n        return this.max && this.value && this.max === this.value.length;\n    }\n\n    constructor(\n        @Inject(DOCUMENT) private document: Document,\n        public el: ElementRef,\n        public cd: ChangeDetectorRef,\n        public config: caxConfig\n    ) {}\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'item':\n                    this.itemTemplate = item.template;\n                    break;\n\n                case 'removetokenicon':\n                    this.removeTokenIconTemplate = item.template;\n                    break;\n\n                case 'clearicon':\n                    this.clearIconTemplate = item.template;\n                    break;\n\n                default:\n                    this.itemTemplate = item.template;\n                    break;\n            }\n        });\n\n        this.updateFilledState();\n    }\n\n    onWrapperClick() {\n        this.inputViewChild?.nativeElement.focus();\n    }\n\n    onContainerFocus() {\n        this.focused = true;\n    }\n\n    onContainerBlur() {\n        this.focusedIndex = -1;\n        this.focused = false;\n    }\n\n    onContainerKeyDown(event) {\n        switch (event.code) {\n            case 'ArrowLeft':\n                this.onArrowLeftKeyOn();\n                break;\n\n            case 'ArrowRight':\n                this.onArrowRightKeyOn();\n                break;\n\n            case 'Backspace':\n                this.onBackspaceKeyOn(event);\n                break;\n\n            case 'Space':\n                if (this.focusedIndex !== null && this.value && this.value.length > 0) {\n                    this.onItemClick(event, this.value[this.focusedIndex]);\n                }\n                break;\n\n            default:\n                break;\n        }\n    }\n\n    onArrowLeftKeyOn() {\n        if (this.inputViewChild.nativeElement.value.length === 0 && this.value && this.value.length > 0) {\n            this.focusedIndex = this.focusedIndex === null ? this.value.length - 1 : this.focusedIndex - 1;\n            if (this.focusedIndex < 0) this.focusedIndex = 0;\n        }\n    }\n\n    onArrowRightKeyOn() {\n        if (this.inputViewChild.nativeElement.value.length === 0 && this.value && this.value.length > 0) {\n            if (this.focusedIndex === this.value.length - 1) {\n                this.focusedIndex = null;\n                this.inputViewChild?.nativeElement.focus();\n            } else {\n                this.focusedIndex++;\n            }\n        }\n    }\n\n    onBackspaceKeyOn(event) {\n        if (this.focusedIndex !== null) {\n            this.removeItem(event, this.focusedIndex);\n        }\n    }\n\n    onInput() {\n        if (this.disabled || this.readonly) return;\n        this.updateFilledState();\n        this.focusedIndex = null;\n\n        // Update typing state based on input value\n        this.isTyping = this.inputViewChild?.nativeElement.value?.length > 0;\n        if (this.isTyping || !this.isTyping) {\n            this.scrollToLastChip(); // Always show end of chip list\n        }\n        this.scrollToLastChip();\n        this.cd.markForCheck();\n    }\n\n    scrollToLastChip() {\n        requestAnimationFrame(() => {\n            const list = this.chipsScrollable?.nativeElement.querySelector('.cax-chips-list');\n            if (!list || !this.value?.length) return;\n\n            list.scrollLeft = list.scrollWidth;\n            const input = list.querySelector('.cax-chips-input');\n            if (input) {\n                input.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'end' });\n            }\n        });\n    }\n\n    onPaste(event: any) {\n        if (!this.disabled && !this.readonly) {\n            if (this.separator) {\n                const pastedData: string = (event.clipboardData || (this.document.defaultView as any)['clipboardData']).getData('Text');\n                pastedData.split(this.separator).forEach((val: any) => {\n                    this.addItem(event, val, true);\n                });\n                this.inputViewChild.nativeElement.value = '';\n            }\n\n            this.updateFilledState();\n        }\n    }\n\n    updateFilledState() {\n        if (!this.value || this.value.length === 0) {\n            this.filled = this.inputViewChild && this.inputViewChild.nativeElement && this.inputViewChild.nativeElement.value != '';\n        } else {\n            this.filled = true;\n        }\n    }\n\n    onItemClick(event: Event, item: any) {\n        if (this.disabled || this.readonly) return;\n        this.onChipClick.emit({\n            originalEvent: event,\n            value: item\n        });\n    }\n\n    writeValue(value: any): void {\n        this.value = value;\n        this.updateMaxedOut();\n        this.updateFilledState();\n        this.cd.markForCheck();\n    }\n\n    registerOnChange(fn: Function): void {\n        this.onModelChange = fn;\n    }\n\n    registerOnTouched(fn: Function): void {\n        this.onModelTouched = fn;\n    }\n\n    setDisabledState(val: boolean): void {\n        this.disabled = val;\n        this.cd.markForCheck();\n    }\n\n    resolveFieldData(data: any, field: string): any {\n        if (data && field) {\n            if (field.indexOf('.') == -1) {\n                return data[field];\n            } else {\n                let fields: string[] = field.split('.');\n                let value = data;\n                for (var i = 0, len = fields.length; i < len; ++i) {\n                    value = value[fields[i]];\n                }\n                return value;\n            }\n        } else {\n            return null;\n        }\n    }\n\n    onInputFocus(event: FocusEvent) {\n        this.focused = true;\n        this.focusedIndex = null;\n        this.onFocus.emit(event);\n    }\n\n    onInputBlur(event: FocusEvent) {\n        this.focused = false;\n        this.focusedIndex = null;\n        this.isTyping = false; // Reset typing state\n        if (this.addOnBlur && this.inputViewChild.nativeElement.value) {\n            this.addItem(event, this.inputViewChild.nativeElement.value, false);\n        }\n        this.onModelTouched();\n        this.onBlur.emit(event);\n        this.cd.markForCheck();\n    }\n\n    removeItem(event: Event, index: number): void {\n        if (this.disabled || this.readonly) {\n            return;\n        }\n\n        let removedItem = this.value[index];\n        this.value = this.value.filter((val: any, i: number) => i != index);\n        this.focusedIndex = null;\n        this.inputViewChild.nativeElement.focus();\n\n        this.onModelChange(this.value);\n        this.valueChange.emit(this.value);\n        this.onRemove.emit({\n            originalEvent: event,\n            value: removedItem\n        });\n        this.updateFilledState();\n        this.updateMaxedOut();\n    }\n\n    addItem(event: Event, item: string, preventDefault: boolean): void {\n        if (this.disabled || this.readonly) return;\n        this.value = this.value || [];\n\n        if (item && item.trim().length) {\n            const newItemIsDuplicate = this.caseSensitiveDuplication ? this.value.includes(item) : this.value.some((val) => val.toLowerCase() === item.toLowerCase());\n\n            if ((this.allowDuplicate || !newItemIsDuplicate) && !this.isMaxedOut) {\n                this.value = [...this.value, item];\n                this.onModelChange(this.value);\n                this.valueChange.emit(this.value);\n                this.onAdd.emit({\n                    originalEvent: event,\n                    value: item\n                });\n\n                // Force immediate scroll after adding chip\n                Promise.resolve().then(() => {\n                    this.cd.detectChanges();\n                    this.scrollToLastChip();\n                });\n            }\n        }\n\n        this.updateFilledState();\n        this.updateMaxedOut();\n        this.inputViewChild.nativeElement.value = '';\n        this.isTyping = false;\n        this.cd.markForCheck();\n\n        if (preventDefault) {\n            event.preventDefault();\n        }\n    }\n\n    /**\n     * Callback to invoke on filter reset.\n     * @group Method\n     */\n    public clear() {\n        if (this.disabled || this.readonly) return;\n        this.value = null;\n        this.updateFilledState();\n        this.onModelChange(this.value);\n        this.valueChange.emit(this.value);\n        this.updateMaxedOut();\n        this.onClear.emit();\n    }\n\n    onKeyDown(event) {\n        if (this.disabled || this.readonly) return;\n        this.scrollToLastChip();\n        const inputValue = event.target.value;\n\n        switch (event.code) {\n            case 'Backspace':\n                if (inputValue.length === 0 && this.value && this.value.length > 0) {\n                    if (this.focusedIndex !== null) {\n                        this.removeItem(event, this.focusedIndex);\n                        this.scrollToLastChip();\n                    } else this.removeItem(event, this.value.length - 1);\n                }\n\n                break;\n\n            case 'Enter':\n            case 'NumpadEnter':\n                if (inputValue && inputValue.trim().length && !this.isMaxedOut) {\n                    this.addItem(event, inputValue, true);\n                }\n\n                break;\n\n            case 'Tab':\n                if (this.addOnTab && inputValue && inputValue.trim().length && !this.isMaxedOut) {\n                    this.addItem(event, inputValue, true);\n                    event.preventDefault();\n                    this.scrollToLastChip();\n                }\n\n                break;\n\n            case 'ArrowLeft':\n                if (inputValue.length === 0 && this.value && this.value.length > 0) {\n                    this.containerViewChild?.nativeElement.focus();\n                    this.scrollToLastChip();\n                }\n\n                break;\n\n            case 'ArrowRight':\n                event.stopPropagation();\n                break;\n\n            default:\n                if (this.separator) {\n                    if (this.separator === event.key || event.key.match(this.separator)) {\n                        this.addItem(event, inputValue, true);\n                    }\n                }\n\n                break;\n        }\n    }\n\n    updateMaxedOut(): void {\n        if (this.inputViewChild && this.inputViewChild.nativeElement) {\n            if (this.isMaxedOut) {\n                // Calling `blur` is necessary because firefox does not call `onfocus` events\n                // for disabled inputs, unlike chromium browsers.\n                this.inputViewChild.nativeElement.blur();\n                this.inputViewChild.nativeElement.disabled = true;\n            } else {\n                if (this.disabled) {\n                    this.inputViewChild.nativeElement.blur();\n                }\n\n                this.inputViewChild.nativeElement.disabled = this.disabled || false;\n            }\n        }\n    }\n}\n","<div\n    [ngClass]=\"{'cax-chips': true, 'cax-chips-size-sm': size === 'sm', 'cax-chips-size-md': size === 'md', 'cax-chips-size-lg': size === 'lg', 'cax-chips-disabled': disabled, 'cax-chips-readonly': readonly, 'cax-invalid': invalid}\"\n    [ngStyle]=\"style\"\n    [class]=\"styleClass\"\n>\n    <label *ngIf=\"label\" class=\"cax-chips-label\" [ngClass]=\"{'cax-text-action-md-semibold': !size || size === 'md', 'cax-text-action-sm-semibold': size === 'sm', 'cax-text-action-lg-semibold': size === 'lg'}\">{{label}}</label>\n\n    <div class=\"cax-chips-container\" [ngClass]=\"{'cax-focus': focused && !disabled && !readonly, 'no-chips': !value?.length, 'cax-input-readonly': readonly}\">\n        <span *ngIf=\"leftIcon\" class=\"cax-chips-icon-left\">\n            <i [ngClass]=\"leftIconClass\"></i>\n        </span>\n\n        <div class=\"cax-chips-content\" #chipsScrollable>\n            <div class=\"cax-chips-list\">\n                <cax-tag\n                    *ngFor=\"let item of value; let i = index\"\n                    [value]=\"field ? resolveFieldData(item, field) : item\"\n                    [removable]=\"!disabled && !readonly\"\n                    [size]=\"size\"\n                    [icon]=\"chipIcon\"\n                    [color]=\"color\"\n                    (onRemove)=\"removeItem($event, i)\"\n                    (click)=\"onItemClick($event, item)\"\n                    [class.cax-focus]=\"focusedIndex === i\"\n                >\n                </cax-tag>\n                <input\n                    #inputtext\n                    class=\"cax-chips-input\"\n                    [attr.placeholder]=\"(!value || !value.length) ? placeholder : ''\"\n                    (keydown)=\"onKeyDown($event)\"\n                    (input)=\"onInput()\"\n                    (paste)=\"onPaste($event)\"\n                    (focus)=\"onInputFocus($event)\"\n                    (blur)=\"onInputBlur($event)\"\n                    type=\"text\"\n                    [attr.id]=\"inputId\"\n                    [attr.maxlength]=\"maxLength\"\n                    [attr.tabindex]=\"tabindex\"\n                    [disabled]=\"disabled || isMaxedOut\"\n                    [readonly]=\"readonly\"\n                    [ngStyle]=\"inputStyle\"\n                    [class]=\"inputStyleClass\"\n                    caxAutoFocus\n                    [autofocus]=\"autofocus\"\n                    [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\"\n                />\n            </div>\n        </div>\n\n        <span *ngIf=\"showClear && value?.length && !disabled && !readonly\" class=\"cax-chips-clear-icon\" (click)=\"clear()\">\n            <i class=\"cax cax-close-circle\"></i>\n        </span>\n        <span *ngIf=\"rightIcon\" class=\"cax-chips-icon-right\">\n            <i [ngClass]=\"rightIconClass\"></i>\n        </span>\n    </div>\n\n    <!-- Error Message with conditional opacity -->\n    <small *ngIf=\"invalid\" class=\"cax-chips-error\" [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\"> {{ errorText }} </small>\n\n    <!-- Helper Text with conditional opacity -->\n    <small *ngIf=\"successText && !invalid\" class=\"cax-chips-helper-text\" [ngClass]=\"{'cax-text-action-md-regular' : !size || size === 'md', 'cax-text-action-sm-medium' : size === 'sm', 'cax-text-action-lg-regular' : size === 'lg'}\">\n        {{ successText }}\n    </small>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { AutoFocusModule } from 'cax-design-system/autofocus';\nimport { TimesIcon } from 'cax-design-system/icons/times';\nimport { TimesCircleIcon } from 'cax-design-system/icons/timescircle';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { InputChips } from './inputchips';\nimport { ChipModule } from 'cax-design-system/chip';\n\n@NgModule({\n    imports: [CommonModule, InputTextModule, SharedModule, AutoFocusModule, TimesCircleIcon, TimesIcon, InputChips, ChipModule],\n    exports: [InputChips, InputTextModule, SharedModule]\n})\nexport class InputChipsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AA8BO,MAAM,oBAAoB,GAAQ;AACrC,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,WAAW,EAAE,UAAU,CAAC,MAAM,UAAU,CAAC;AACzC,IAAA,KAAK,EAAE;;AAEX;;;AAGG;MAmBU,UAAU,CAAA;AAsNW,IAAA,QAAA;AACnB,IAAA,EAAA;AACA,IAAA,EAAA;AACA,IAAA,MAAA;IAxNF,aAAa,GAAW,EAAE;IAC1B,QAAQ,GAAa,KAAK;IAC1B,cAAc,GAAW,EAAE;IAC3B,SAAS,GAAa,KAAK;AAC3B,IAAA,QAAQ;AACR,IAAA,KAAK;IAC0B,QAAQ,GAAY,KAAK;AACnC,IAAA,eAAe;IAE7C,QAAQ,GAAY,KAAK;AAEzB;;;AAGG;AACM,IAAA,KAAK;AACd;;;AAGG;AACM,IAAA,UAAU;AACnB;;;AAGG;AACqC,IAAA,QAAQ;AAChD;;;AAGG;AACM,IAAA,KAAK;AACd;;;AAGG;AACM,IAAA,WAAW;AACpB;;;AAGG;AACoC,IAAA,GAAG;AAC1C;;;AAGG;AACM,IAAA,SAAS;AAClB;;;AAGG;AACM,IAAA,SAAS;AAClB;;;AAGG;AACM,IAAA,cAAc;AACvB;;;AAGG;AACoC,IAAA,QAAQ;AAC/C;;;AAGG;AACM,IAAA,OAAO;AAChB;;;AAGG;IACqC,cAAc,GAAY,IAAI;AACtE;;;AAGG;IACqC,wBAAwB,GAAY,IAAI;AAChF;;;AAGG;AACM,IAAA,UAAU;AACnB;;;AAGG;AACM,IAAA,eAAe;AACxB;;;AAGG;AACqC,IAAA,QAAQ;AAChD;;;AAGG;AACqC,IAAA,SAAS;AACjD;;;AAGG;AACM,IAAA,SAAS;AAClB;;;AAGG;IACqC,SAAS,GAAY,KAAK;AAClE;;;AAGG;AACqC,IAAA,SAAS;AACjD;;;AAGG;IACM,OAAO,GAA0B,UAAU;AACpD;;;AAGG;IACM,IAAI,GAAuB,IAAI;AACxC;;;AAGG;IACqC,OAAO,GAAY,KAAK;AAChE;;;AAGG;AACM,IAAA,WAAW;AACpB;;;AAGG;AACM,IAAA,SAAS;AAClB;;;;AAIG;AACO,IAAA,KAAK,GAAgC,IAAI,YAAY,EAAiB;AAChF;;;;AAIG;AACO,IAAA,QAAQ,GAAmC,IAAI,YAAY,EAAoB;AACzF;;;;AAIG;AACO,IAAA,OAAO,GAAwB,IAAI,YAAY,EAAS;AAClE;;;;AAIG;AACO,IAAA,MAAM,GAAwB,IAAI,YAAY,EAAS;AACjE;;;;AAIG;AACO,IAAA,WAAW,GAAkC,IAAI,YAAY,EAAmB;AAC1F;;;AAGG;AACO,IAAA,OAAO,GAAsB,IAAI,YAAY,EAAO;AAEpD,IAAA,WAAW,GAAsB,IAAI,YAAY,EAAO;AAE1C,IAAA,cAAc;AAEd,IAAA,kBAAkB;AAEZ,IAAA,SAAS;AAEhC,IAAA,YAAY;AAEnB,IAAA,uBAAuB;AAEvB,IAAA,iBAAiB;AAER,IAAA,KAAK;IAEL,KAAK,GAAuH,MAAM;AAE3I,IAAA,aAAa,GAAa,MAAK,EAAE,CAAC;AAElC,IAAA,cAAc,GAAa,MAAK,EAAE,CAAC;AAEnC,IAAA,YAAY;IAEZ,EAAE,GAAG,iBAAiB,EAAE;AAExB,IAAA,OAAO;AAEP,IAAA,YAAY;AAEZ,IAAA,MAAM;AAEN,IAAA,IAAI,eAAe,GAAA;QACf,OAAO,IAAI,CAAC,YAAY,KAAK,IAAI,GAAG,CAAA,EAAG,IAAI,CAAC,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,YAAY,EAAE,GAAG,IAAI;IAC3F;AAEA,IAAA,IAAI,UAAU,GAAA;AACV,QAAA,OAAO,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM;IACnE;AAEA,IAAA,WAAA,CAC8B,QAAkB,EACrC,EAAc,EACd,EAAqB,EACrB,MAAiB,EAAA;QAHE,IAAA,CAAA,QAAQ,GAAR,QAAQ;QAC3B,IAAA,CAAA,EAAE,GAAF,EAAE;QACF,IAAA,CAAA,EAAE,GAAF,EAAE;QACF,IAAA,CAAA,MAAM,GAAN,MAAM;IACd;IAEH,kBAAkB,GAAA;QACd,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AAC5B,YAAA,QAAQ,IAAI,CAAC,OAAO,EAAE;AAClB,gBAAA,KAAK,MAAM;AACP,oBAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ;oBACjC;AAEJ,gBAAA,KAAK,iBAAiB;AAClB,oBAAA,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,QAAQ;oBAC5C;AAEJ,gBAAA,KAAK,WAAW;AACZ,oBAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,QAAQ;oBACtC;AAEJ,gBAAA;AACI,oBAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ;oBACjC;;AAEZ,QAAA,CAAC,CAAC;QAEF,IAAI,CAAC,iBAAiB,EAAE;IAC5B;IAEA,cAAc,GAAA;AACV,QAAA,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,KAAK,EAAE;IAC9C;IAEA,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI;IACvB;IAEA,eAAe,GAAA;AACX,QAAA,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;AACtB,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;IACxB;AAEA,IAAA,kBAAkB,CAAC,KAAK,EAAA;AACpB,QAAA,QAAQ,KAAK,CAAC,IAAI;AACd,YAAA,KAAK,WAAW;gBACZ,IAAI,CAAC,gBAAgB,EAAE;gBACvB;AAEJ,YAAA,KAAK,YAAY;gBACb,IAAI,CAAC,iBAAiB,EAAE;gBACxB;AAEJ,YAAA,KAAK,WAAW;AACZ,gBAAA,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;gBAC5B;AAEJ,YAAA,KAAK,OAAO;AACR,gBAAA,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AACnE,oBAAA,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBAC1D;gBACA;AAEJ,YAAA;gBACI;;IAEZ;IAEA,gBAAgB,GAAA;QACZ,IAAI,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC7F,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,KAAK,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC;AAC9F,YAAA,IAAI,IAAI,CAAC,YAAY,GAAG,CAAC;AAAE,gBAAA,IAAI,CAAC,YAAY,GAAG,CAAC;QACpD;IACJ;IAEA,iBAAiB,GAAA;QACb,IAAI,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAC7F,YAAA,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAC7C,gBAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,gBAAA,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,KAAK,EAAE;YAC9C;iBAAO;gBACH,IAAI,CAAC,YAAY,EAAE;YACvB;QACJ;IACJ;AAEA,IAAA,gBAAgB,CAAC,KAAK,EAAA;AAClB,QAAA,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,EAAE;YAC5B,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC;QAC7C;IACJ;IAEA,OAAO,GAAA;AACH,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAAE;QACpC,IAAI,CAAC,iBAAiB,EAAE;AACxB,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;;AAGxB,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC;QACpE,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AACjC,YAAA,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC5B;QACA,IAAI,CAAC,gBAAgB,EAAE;AACvB,QAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;IAC1B;IAEA,gBAAgB,GAAA;QACZ,qBAAqB,CAAC,MAAK;AACvB,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,EAAE,aAAa,CAAC,aAAa,CAAC,iBAAiB,CAAC;YACjF,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM;gBAAE;AAElC,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW;YAClC,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC;YACpD,IAAI,KAAK,EAAE;AACP,gBAAA,KAAK,CAAC,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC;YACjF;AACJ,QAAA,CAAC,CAAC;IACN;AAEA,IAAA,OAAO,CAAC,KAAU,EAAA;QACd,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClC,YAAA,IAAI,IAAI,CAAC,SAAS,EAAE;gBAChB,MAAM,UAAU,GAAW,CAAC,KAAK,CAAC,aAAa,IAAK,IAAI,CAAC,QAAQ,CAAC,WAAmB,CAAC,eAAe,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC;AACvH,gBAAA,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,GAAQ,KAAI;oBAClD,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI,CAAC;AAClC,gBAAA,CAAC,CAAC;gBACF,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,GAAG,EAAE;YAChD;YAEA,IAAI,CAAC,iBAAiB,EAAE;QAC5B;IACJ;IAEA,iBAAiB,GAAA;AACb,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;YACxC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,aAAa,IAAI,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,IAAI,EAAE;QAC3H;aAAO;AACH,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;QACtB;IACJ;IAEA,WAAW,CAAC,KAAY,EAAE,IAAS,EAAA;AAC/B,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAAE;AACpC,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;AAClB,YAAA,aAAa,EAAE,KAAK;AACpB,YAAA,KAAK,EAAE;AACV,SAAA,CAAC;IACN;AAEA,IAAA,UAAU,CAAC,KAAU,EAAA;AACjB,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK;QAClB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,iBAAiB,EAAE;AACxB,QAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;IAC1B;AAEA,IAAA,gBAAgB,CAAC,EAAY,EAAA;AACzB,QAAA,IAAI,CAAC,aAAa,GAAG,EAAE;IAC3B;AAEA,IAAA,iBAAiB,CAAC,EAAY,EAAA;AAC1B,QAAA,IAAI,CAAC,cAAc,GAAG,EAAE;IAC5B;AAEA,IAAA,gBAAgB,CAAC,GAAY,EAAA;AACzB,QAAA,IAAI,CAAC,QAAQ,GAAG,GAAG;AACnB,QAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;IAC1B;IAEA,gBAAgB,CAAC,IAAS,EAAE,KAAa,EAAA;AACrC,QAAA,IAAI,IAAI,IAAI,KAAK,EAAE;YACf,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,EAAE;AAC1B,gBAAA,OAAO,IAAI,CAAC,KAAK,CAAC;YACtB;iBAAO;gBACH,IAAI,MAAM,GAAa,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;gBACvC,IAAI,KAAK,GAAG,IAAI;AAChB,gBAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,GAAG,GAAG,EAAE,EAAE,CAAC,EAAE;oBAC/C,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;gBAC5B;AACA,gBAAA,OAAO,KAAK;YAChB;QACJ;aAAO;AACH,YAAA,OAAO,IAAI;QACf;IACJ;AAEA,IAAA,YAAY,CAAC,KAAiB,EAAA;AAC1B,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI;AACnB,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;IAC5B;AAEA,IAAA,WAAW,CAAC,KAAiB,EAAA;AACzB,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;AACpB,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;AACtB,QAAA,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,EAAE;AAC3D,YAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,EAAE,KAAK,CAAC;QACvE;QACA,IAAI,CAAC,cAAc,EAAE;AACrB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;AACvB,QAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;IAC1B;IAEA,UAAU,CAAC,KAAY,EAAE,KAAa,EAAA;QAClC,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;YAChC;QACJ;QAEA,IAAI,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;QACnC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,GAAQ,EAAE,CAAS,KAAK,CAAC,IAAI,KAAK,CAAC;AACnE,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,EAAE;AAEzC,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;QAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;AACjC,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACf,YAAA,aAAa,EAAE,KAAK;AACpB,YAAA,KAAK,EAAE;AACV,SAAA,CAAC;QACF,IAAI,CAAC,iBAAiB,EAAE;QACxB,IAAI,CAAC,cAAc,EAAE;IACzB;AAEA,IAAA,OAAO,CAAC,KAAY,EAAE,IAAY,EAAE,cAAuB,EAAA;AACvD,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAAE;QACpC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE;QAE7B,IAAI,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,EAAE;AAC5B,YAAA,MAAM,kBAAkB,GAAG,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,WAAW,EAAE,KAAK,IAAI,CAAC,WAAW,EAAE,CAAC;AAEzJ,YAAA,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,kBAAkB,KAAK,CAAC,IAAI,CAAC,UAAU,EAAE;gBAClE,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC;AAClC,gBAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;gBAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;AACjC,gBAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;AACZ,oBAAA,aAAa,EAAE,KAAK;AACpB,oBAAA,KAAK,EAAE;AACV,iBAAA,CAAC;;AAGF,gBAAA,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,MAAK;AACxB,oBAAA,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE;oBACvB,IAAI,CAAC,gBAAgB,EAAE;AAC3B,gBAAA,CAAC,CAAC;YACN;QACJ;QAEA,IAAI,CAAC,iBAAiB,EAAE;QACxB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,KAAK,GAAG,EAAE;AAC5C,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;AACrB,QAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;QAEtB,IAAI,cAAc,EAAE;YAChB,KAAK,CAAC,cAAc,EAAE;QAC1B;IACJ;AAEA;;;AAGG;IACI,KAAK,GAAA;AACR,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAAE;AACpC,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI;QACjB,IAAI,CAAC,iBAAiB,EAAE;AACxB,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;QAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;QACjC,IAAI,CAAC,cAAc,EAAE;AACrB,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;IACvB;AAEA,IAAA,SAAS,CAAC,KAAK,EAAA;AACX,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAAE;QACpC,IAAI,CAAC,gBAAgB,EAAE;AACvB,QAAA,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK;AAErC,QAAA,QAAQ,KAAK,CAAC,IAAI;AACd,YAAA,KAAK,WAAW;AACZ,gBAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAChE,oBAAA,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,EAAE;wBAC5B,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC;wBACzC,IAAI,CAAC,gBAAgB,EAAE;oBAC3B;;AAAO,wBAAA,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;gBACxD;gBAEA;AAEJ,YAAA,KAAK,OAAO;AACZ,YAAA,KAAK,aAAa;AACd,gBAAA,IAAI,UAAU,IAAI,UAAU,CAAC,IAAI,EAAE,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;oBAC5D,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;gBACzC;gBAEA;AAEJ,YAAA,KAAK,KAAK;AACN,gBAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,UAAU,IAAI,UAAU,CAAC,IAAI,EAAE,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;oBAC7E,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;oBACrC,KAAK,CAAC,cAAc,EAAE;oBACtB,IAAI,CAAC,gBAAgB,EAAE;gBAC3B;gBAEA;AAEJ,YAAA,KAAK,WAAW;AACZ,gBAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AAChE,oBAAA,IAAI,CAAC,kBAAkB,EAAE,aAAa,CAAC,KAAK,EAAE;oBAC9C,IAAI,CAAC,gBAAgB,EAAE;gBAC3B;gBAEA;AAEJ,YAAA,KAAK,YAAY;gBACb,KAAK,CAAC,eAAe,EAAE;gBACvB;AAEJ,YAAA;AACI,gBAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,oBAAA,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE;wBACjE,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC;oBACzC;gBACJ;gBAEA;;IAEZ;IAEA,cAAc,GAAA;QACV,IAAI,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,cAAc,CAAC,aAAa,EAAE;AAC1D,YAAA,IAAI,IAAI,CAAC,UAAU,EAAE;;;AAGjB,gBAAA,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,IAAI,EAAE;gBACxC,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,QAAQ,GAAG,IAAI;YACrD;iBAAO;AACH,gBAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACf,oBAAA,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,IAAI,EAAE;gBAC5C;AAEA,gBAAA,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,KAAK;YACvE;QACJ;IACJ;AA9iBS,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAU,kBAsNP,QAAQ,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAtNX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,UAAU,qPAOC,gBAAgB,CAAA,EAAA,KAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAmBhB,gBAAgB,CAAA,EAAA,KAAA,EAAA,OAAA,EAAA,WAAA,EAAA,aAAA,EAAA,GAAA,EAAA,CAAA,KAAA,EAAA,KAAA,EAehB,eAAe,wHAoBf,eAAe,CAAA,EAAA,OAAA,EAAA,SAAA,EAAA,cAAA,EAAA,CAAA,gBAAA,EAAA,gBAAA,EAUf,gBAAgB,CAAA,EAAA,wBAAA,EAAA,CAAA,0BAAA,EAAA,0BAAA,EAKhB,gBAAgB,CAAA,EAAA,UAAA,EAAA,YAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAehB,gBAAgB,yCAKhB,gBAAgB,CAAA,EAAA,SAAA,EAAA,WAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAUhB,gBAAgB,CAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAKhB,gBAAgB,CAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAehB,gBAAgB,2hBAnIzB,CAAC,oBAAoB,CAAC,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,WAAA,EAAA,SAAA,EAwLhB,WAAW,iVC5OhC,ojHAkEA,EAAA,MAAA,EAAA,CAAA,yvEAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDvBc,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,eAAe,8BAAE,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,UAAU,8BAAE,SAAS,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,GAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,YAAA,EAAA,OAAA,EAAA,OAAA,EAAA,MAAA,EAAA,SAAA,EAAA,MAAA,EAAA,WAAA,EAAA,OAAA,EAAA,WAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,EAAA,cAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;4FAcpF,UAAU,EAAA,UAAA,EAAA,CAAA;kBAlBtB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,cAEd,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,SAAS,CAAC,EAAA,IAAA,EACxF;AACF,wBAAA,KAAK,EAAE,8BAA8B;AACrC,wBAAA,iCAAiC,EAAE,QAAQ;AAC3C,wBAAA,gCAAgC,EAAE,SAAS;AAC3C,wBAAA,6BAA6B,EAAE,WAAW;AAC1C,wBAAA,4BAA4B,EAAE,UAAU;AACxC,wBAAA,qBAAqB,EAAE;qBAC1B,EAAA,SAAA,EACU,CAAC,oBAAoB,CAAC,EAAA,eAAA,EAChB,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,ojHAAA,EAAA,MAAA,EAAA,CAAA,yvEAAA,CAAA,EAAA;;0BAyNhC,MAAM;2BAAC,QAAQ;0HArNX,aAAa,EAAA,CAAA;sBAArB;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,cAAc,EAAA,CAAA;sBAAtB;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACuC,QAAQ,EAAA,CAAA;sBAA/C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBACR,eAAe,EAAA,CAAA;sBAA5C,SAAS;uBAAC,iBAAiB;gBAQnB,KAAK,EAAA,CAAA;sBAAb;gBAKQ,UAAU,EAAA,CAAA;sBAAlB;gBAKuC,QAAQ,EAAA,CAAA;sBAA/C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAK7B,KAAK,EAAA,CAAA;sBAAb;gBAKQ,WAAW,EAAA,CAAA;sBAAnB;gBAKsC,GAAG,EAAA,CAAA;sBAAzC,KAAK;uBAAC,EAAE,SAAS,EAAE,eAAe,EAAE;gBAK5B,SAAS,EAAA,CAAA;sBAAjB;gBAKQ,SAAS,EAAA,CAAA;sBAAjB;gBAKQ,cAAc,EAAA,CAAA;sBAAtB;gBAKsC,QAAQ,EAAA,CAAA;sBAA9C,KAAK;uBAAC,EAAE,SAAS,EAAE,eAAe,EAAE;gBAK5B,OAAO,EAAA,CAAA;sBAAf;gBAKuC,cAAc,EAAA,CAAA;sBAArD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAKE,wBAAwB,EAAA,CAAA;sBAA/D,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAK7B,UAAU,EAAA,CAAA;sBAAlB;gBAKQ,eAAe,EAAA,CAAA;sBAAvB;gBAKuC,QAAQ,EAAA,CAAA;sBAA/C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAKE,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAK7B,SAAS,EAAA,CAAA;sBAAjB;gBAKuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAKE,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAK7B,OAAO,EAAA,CAAA;sBAAf;gBAKQ,IAAI,EAAA,CAAA;sBAAZ;gBAKuC,OAAO,EAAA,CAAA;sBAA9C,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAK7B,WAAW,EAAA,CAAA;sBAAnB;gBAKQ,SAAS,EAAA,CAAA;sBAAjB;gBAMS,KAAK,EAAA,CAAA;sBAAd;gBAMS,QAAQ,EAAA,CAAA;sBAAjB;gBAMS,OAAO,EAAA,CAAA;sBAAhB;gBAMS,MAAM,EAAA,CAAA;sBAAf;gBAMS,WAAW,EAAA,CAAA;sBAApB;gBAKS,OAAO,EAAA,CAAA;sBAAhB;gBAES,WAAW,EAAA,CAAA;sBAApB;gBAEuB,cAAc,EAAA,CAAA;sBAArC,SAAS;uBAAC,WAAW;gBAEE,kBAAkB,EAAA,CAAA;sBAAzC,SAAS;uBAAC,WAAW;gBAEQ,SAAS,EAAA,CAAA;sBAAtC,eAAe;uBAAC,WAAW;gBAQnB,KAAK,EAAA,CAAA;sBAAb;gBAEQ,KAAK,EAAA,CAAA;sBAAb;;;MExOQ,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAhB,gBAAgB,EAAA,OAAA,EAAA,CAHf,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,aAChH,UAAU,EAAE,eAAe,EAAE,YAAY,CAAA,EAAA,CAAA;AAE1C,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,YAHf,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EACpG,eAAe,EAAE,YAAY,CAAA,EAAA,CAAA;;4FAE1C,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAJ5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,CAAC;AAC3H,oBAAA,OAAO,EAAE,CAAC,UAAU,EAAE,eAAe,EAAE,YAAY;AACtD,iBAAA;;;ACbD;;AAEG;;;;"}

package/fesm2022/cax-design-system-inputgroup.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Input, Output, Component, NgModule } from '@angular/core';
+import { EventEmitter, booleanAttribute, Input, Output, Component, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { SharedModule } from 'cax-design-system/api';
@@ -40,14 +40,45 @@ class InputGroup {
      * @group Props
      */
     label = '';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.16", type: InputGroup, isStandalone: false, selector: "cax-inputgroup", inputs: { ingredient: "ingredient", value: "value", style: "style", styleClass: "styleClass", label: "label" }, outputs: { onClick: "onClick" }, host: { classAttribute: "cax-element cax-inputgroup" }, ngImport: i0, template: "<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\r\n    <div class=\"cax-inputgroup\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    /**
+     * Success text to display below the input group
+     * @group Props
+     */
+    successText;
+    /**
+     * Error text to display below the input group
+     * @group Props
+     */
+    errorText;
+    /**
+     * Whether the input group is in an invalid state
+     * @group Props
+     */
+    invalid = false;
+    /**
+     * Whether the input group is disabled
+     * @group Props
+     */
+    disabled = false;
+    /**
+     * Whether the input group is read-only
+     * @group Props
+     */
+    readonly = false;
+    /**
+     * Size of the input group
+     * @group Props
+     */
+    size = 'md';
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.21", type: InputGroup, isStandalone: false, selector: "cax-inputgroup", inputs: { ingredient: "ingredient", value: "value", style: "style", styleClass: "styleClass", label: "label", successText: "successText", errorText: "errorText", invalid: "invalid", disabled: "disabled", readonly: ["readonly", "readonly", booleanAttribute], size: "size" }, outputs: { onClick: "onClick" }, host: { properties: { "class.cax-input-readonly": "readonly" }, classAttribute: "cax-element cax-inputgroup" }, ngImport: i0, template: "<div\n    class=\"cax-inputgroup-container\"\n    [attr.data-pc-name]=\"'inputgroup'\"\n    [class]=\"styleClass\"\n    [ngClass]=\"'cax-inputgroup-size-' + size\"\n    [ngStyle]=\"style\"\n    [class.cax-invalid]=\"invalid\"\n    [class.cax-disabled]=\"disabled\"\n    [class.cax-input-readonly]=\"readonly\"\n>\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{ 'cax-text-action-sm-semibold': !size || size === 'md', 'cax-text-action-xs-semibold': size === 'sm', 'cax-text-action-lg-semibold': size === 'lg'}\"> {{label}} </label>\n    <div class=\"cax-inputgroup\">\n        <ng-content></ng-content>\n    </div>\n    <!-- Error Message with conditional opacity -->\n    <small *ngIf=\"invalid\" class=\"cax-error\" [ngClass]=\"{ 'cax-text-action-md-regular': !size || size === 'md', 'cax-text-action-sm-medium': size === 'sm', 'cax-text-action-lg-regular': size === 'lg'}\"> {{ errorText }} </small>\n\n    <!-- Helper Text with conditional opacity -->\n    <small *ngIf=\"successText && !invalid\" class=\"cax-helper-text\" [ngClass]=\"{ 'cax-text-action-md-regular': !size || size === 'md', 'cax-text-action-sm-medium': size === 'sm', 'cax-text-action-lg-regular': size === 'lg'}\">\n        {{ successText }}\n    </small>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroup, decorators: [{
             type: Component,
             args: [{ selector: 'cax-inputgroup', standalone: false, host: {
-                        class: 'cax-element cax-inputgroup'
-                    }, template: "<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\r\n    <div class=\"cax-inputgroup\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n" }]
+                        class: 'cax-element cax-inputgroup',
+                        '[class.cax-input-readonly]': 'readonly'
+                    }, template: "<div\n    class=\"cax-inputgroup-container\"\n    [attr.data-pc-name]=\"'inputgroup'\"\n    [class]=\"styleClass\"\n    [ngClass]=\"'cax-inputgroup-size-' + size\"\n    [ngStyle]=\"style\"\n    [class.cax-invalid]=\"invalid\"\n    [class.cax-disabled]=\"disabled\"\n    [class.cax-input-readonly]=\"readonly\"\n>\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{ 'cax-text-action-sm-semibold': !size || size === 'md', 'cax-text-action-xs-semibold': size === 'sm', 'cax-text-action-lg-semibold': size === 'lg'}\"> {{label}} </label>\n    <div class=\"cax-inputgroup\">\n        <ng-content></ng-content>\n    </div>\n    <!-- Error Message with conditional opacity -->\n    <small *ngIf=\"invalid\" class=\"cax-error\" [ngClass]=\"{ 'cax-text-action-md-regular': !size || size === 'md', 'cax-text-action-sm-medium': size === 'sm', 'cax-text-action-lg-regular': size === 'lg'}\"> {{ errorText }} </small>\n\n    <!-- Helper Text with conditional opacity -->\n    <small *ngIf=\"successText && !invalid\" class=\"cax-helper-text\" [ngClass]=\"{ 'cax-text-action-md-regular': !size || size === 'md', 'cax-text-action-sm-medium': size === 'sm', 'cax-text-action-lg-regular': size === 'lg'}\">\n        {{ successText }}\n    </small>\n</div>\n" }]
         }], propDecorators: { ingredient: [{
                 type: Input
             }], onClick: [{
@@ -60,14 +91,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                 type: Input
             }], label: [{
                 type: Input
+            }], successText: [{
+                type: Input
+            }], errorText: [{
+                type: Input
+            }], invalid: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], size: [{
+                type: Input
             }] } });
 
 class InputGroupModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.16", ngImport: i0, type: InputGroupModule, declarations: [InputGroup], imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton], exports: [InputGroup, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupModule, imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: InputGroupModule, declarations: [InputGroup], imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton], exports: [InputGroup, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupModule, imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton],

package/fesm2022/cax-design-system-inputgroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-inputgroup.mjs","sources":["../../src/app/components/inputgroup/inputgroup.ts","../../src/app/components/inputgroup/inputgroup.html","../../src/app/components/inputgroup/inputgroup.module.ts","../../src/app/components/inputgroup/cax-design-system-inputgroup.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output } from '@angular/core';\n/**\n * InputGroup displays text, icon, buttons and other content can be grouped next to an input.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputgroup',\n    templateUrl: './inputgroup.html',\n    standalone: false,\n    host: {\n        class: 'cax-element cax-inputgroup'\n    }\n})\nexport class InputGroup {\n    model: true;\n    onChange(event) {\n        this.model = event.checked;\n    }\n    @Input() ingredient!: string;\n    @Output() onClick: EventEmitter<any> = new EventEmitter();\n\n    radioClick(event) {\n        this.onClick.emit(event);\n    }\n    @Input() value: string = '';\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Label text to display above the input group\n     * @group Props\n     */\n    @Input() label: string = '';\n}\n","<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\r\n    <div class=\"cax-inputgroup\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { InputGroup } from './inputgroup';\nimport { FormsModule } from '@angular/forms';\nimport { InputGroupAddonModule } from 'cax-design-system/inputgroupaddon';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { Button } from 'cax-design-system/button';\nimport { CheckboxModule } from 'cax-design-system/checkbox';\nimport { RadioButton, RadioButtonModule } from 'cax-design-system/radiobutton';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton],\n    exports: [InputGroup, SharedModule],\n    declarations: [InputGroup]\n})\nexport class InputGroupModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-inputgroup.mjs","sources":["../../src/app/components/inputgroup/inputgroup.ts","../../src/app/components/inputgroup/inputgroup.html","../../src/app/components/inputgroup/inputgroup.module.ts","../../src/app/components/inputgroup/cax-design-system-inputgroup.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output, booleanAttribute } from '@angular/core';\n/**\n * InputGroup displays text, icon, buttons and other content can be grouped next to an input.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputgroup',\n    templateUrl: './inputgroup.html',\n    standalone: false,\n    host: {\n        class: 'cax-element cax-inputgroup',\n        '[class.cax-input-readonly]': 'readonly'\n    }\n})\nexport class InputGroup {\n    model: true;\n    onChange(event) {\n        this.model = event.checked;\n    }\n    @Input() ingredient!: string;\n    @Output() onClick: EventEmitter<any> = new EventEmitter();\n\n    radioClick(event) {\n        this.onClick.emit(event);\n    }\n    @Input() value: string = '';\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Label text to display above the input group\n     * @group Props\n     */\n    @Input() label: string = '';\n    /**\n     * Success text to display below the input group\n     * @group Props\n     */\n    @Input() successText?: string;\n    /**\n     * Error text to display below the input group\n     * @group Props\n     */\n    @Input() errorText?: string;\n    /**\n     * Whether the input group is in an invalid state\n     * @group Props\n     */\n    @Input() invalid: boolean = false;\n    /**\n     * Whether the input group is disabled\n     * @group Props\n     */\n    @Input() disabled: boolean = false;\n    /**\n     * Whether the input group is read-only\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) readonly: boolean = false;\n    /**\n     * Size of the input group\n     * @group Props\n     */\n    @Input() size: 'sm' | 'md' | 'lg' = 'md';\n}\n","<div\n    class=\"cax-inputgroup-container\"\n    [attr.data-pc-name]=\"'inputgroup'\"\n    [class]=\"styleClass\"\n    [ngClass]=\"'cax-inputgroup-size-' + size\"\n    [ngStyle]=\"style\"\n    [class.cax-invalid]=\"invalid\"\n    [class.cax-disabled]=\"disabled\"\n    [class.cax-input-readonly]=\"readonly\"\n>\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{ 'cax-text-action-sm-semibold': !size || size === 'md', 'cax-text-action-xs-semibold': size === 'sm', 'cax-text-action-lg-semibold': size === 'lg'}\"> {{label}} </label>\n    <div class=\"cax-inputgroup\">\n        <ng-content></ng-content>\n    </div>\n    <!-- Error Message with conditional opacity -->\n    <small *ngIf=\"invalid\" class=\"cax-error\" [ngClass]=\"{ 'cax-text-action-md-regular': !size || size === 'md', 'cax-text-action-sm-medium': size === 'sm', 'cax-text-action-lg-regular': size === 'lg'}\"> {{ errorText }} </small>\n\n    <!-- Helper Text with conditional opacity -->\n    <small *ngIf=\"successText && !invalid\" class=\"cax-helper-text\" [ngClass]=\"{ 'cax-text-action-md-regular': !size || size === 'md', 'cax-text-action-sm-medium': size === 'sm', 'cax-text-action-lg-regular': size === 'lg'}\">\n        {{ successText }}\n    </small>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { InputGroup } from './inputgroup';\nimport { FormsModule } from '@angular/forms';\nimport { InputGroupAddonModule } from 'cax-design-system/inputgroupaddon';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { Button } from 'cax-design-system/button';\nimport { CheckboxModule } from 'cax-design-system/checkbox';\nimport { RadioButton, RadioButtonModule } from 'cax-design-system/radiobutton';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton],\n    exports: [InputGroup, SharedModule],\n    declarations: [InputGroup]\n})\nexport class InputGroupModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-inputgroupaddon.mjs

@@ -24,14 +24,14 @@ class InputGroupAddon {
      * @group Props
      */
     styleClass;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupAddon, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.16", type: InputGroupAddon, isStandalone: false, selector: "cax-inputgroup-addon", inputs: { style: "style", styleClass: "styleClass" }, host: { classAttribute: "cax-element cax-inputgroup-addon" }, ngImport: i0, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupAddon, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.21", type: InputGroupAddon, isStandalone: false, selector: "cax-inputgroup-addon", inputs: { style: "style", styleClass: "styleClass" }, host: { classAttribute: "cax-element cax-inputgroup-addon" }, ngImport: i0, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n    <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupAddon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupAddon, decorators: [{
             type: Component,
             args: [{ selector: 'cax-inputgroup-addon', standalone: false, host: {
                         class: 'cax-element cax-inputgroup-addon'
-                    }, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n" }]
+                    }, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n    <ng-content></ng-content>\n</div>\n" }]
         }], propDecorators: { style: [{
                 type: Input
             }], styleClass: [{
@@ -39,11 +39,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
             }] } });
 
 class InputGroupAddonModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupAddonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.16", ngImport: i0, type: InputGroupAddonModule, declarations: [InputGroupAddon], imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton], exports: [InputGroupAddon, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupAddonModule, imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupAddonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: InputGroupAddonModule, declarations: [InputGroupAddon], imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton], exports: [InputGroupAddon, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupAddonModule, imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: InputGroupAddonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: InputGroupAddonModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton],