@softpak/components 19.17.0 → 19.19.0

package/fesm2022/softpak-components-spx-404-page.mjs

@@ -0,0 +1,47 @@
+import * as i0 from '@angular/core';
+import { Component } from '@angular/core';
+import { TranslatePipe } from '@ngx-translate/core';
+import * as i2 from '@ionic/angular/standalone';
+import { IonButtons, IonContent, IonHeader, IonToolbar, IonTitle } from '@ionic/angular/standalone';
+import { SpxCapitalizePipe } from '@softpak/components/spx-capitalize';
+import { SpxButtonComponent } from '@softpak/components/spx-button';
+import { spxText404PageNotFound, spxTextPageNotFound, spxTextPageNotFoundDescription, spxTextGoHome } from '@softpak/components/spx-translate';
+import * as i1 from '@angular/router';
+
+class Spx404PageComponent {
+    goHome() {
+        if (this.activatedRoute.snapshot.data['url'] === undefined) {
+            console.error('configure data property \'url\' in route for update page');
+        }
+        this.navController.navigateRoot(this.activatedRoute.snapshot.data['url']);
+    }
+    constructor(activatedRoute, navController) {
+        this.activatedRoute = activatedRoute;
+        this.navController = navController;
+        this.spxText404PageNotFound = spxText404PageNotFound;
+        this.spxTextPageNotFound = spxTextPageNotFound;
+        this.spxTextPageNotFoundDescription = spxTextPageNotFoundDescription;
+        this.spxTextGoHome = spxTextGoHome;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: Spx404PageComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.NavController }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: Spx404PageComponent, isStandalone: true, selector: "spx-404-page", ngImport: i0, template: "<ion-header>\n    <ion-toolbar>\n        <ion-title>\n            {{ spxText404PageNotFound | translate | capitalize }}\n        </ion-title>\n        <ion-buttons slot=\"end\">\n        </ion-buttons>\n    </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"flex items-center justify-center min-h-screen bg-white dark:bg-gray-900 ion-padding\">\n  <div class=\"text-center p-6\">\n    <h1 class=\"text-7xl font-bold text-indigo-600 dark:text-indigo-400\">404</h1>\n    <h2 class=\"mt-4 text-2xl font-semibold text-gray-800 dark:text-white\"> {{ spxTextPageNotFound | translate | capitalize }} </h2>\n    <p class=\"mt-2 text-gray-600 dark:text-gray-400\">\n      {{ spxTextPageNotFoundDescription | translate | capitalize }}\n    </p>\n    <div class=\"py-2\">\n      <spx-button (spxClick)=\"goHome()\">\n        {{ spxTextGoHome | translate | capitalize }}\n      </spx-button>\n    </div>\n  </div>\n</ion-content>", dependencies: [{ kind: "component", type: IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "pipe", type: SpxCapitalizePipe, name: "capitalize" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "component", type: SpxButtonComponent, selector: "spx-button", inputs: ["spxDisabled", "spxClass", "spxClassObject", "spxForm", "spxFullHeight", "spxFullWidth", "spxSeverity", "spxSize", "spxTabIndex", "spxType"], outputs: ["spxClick"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: Spx404PageComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'spx-404-page', imports: [IonButtons,
+                        IonContent,
+                        IonHeader,
+                        IonToolbar,
+                        IonTitle,
+                        SpxCapitalizePipe,
+                        TranslatePipe,
+                        SpxButtonComponent
+                    ], template: "<ion-header>\n    <ion-toolbar>\n        <ion-title>\n            {{ spxText404PageNotFound | translate | capitalize }}\n        </ion-title>\n        <ion-buttons slot=\"end\">\n        </ion-buttons>\n    </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"flex items-center justify-center min-h-screen bg-white dark:bg-gray-900 ion-padding\">\n  <div class=\"text-center p-6\">\n    <h1 class=\"text-7xl font-bold text-indigo-600 dark:text-indigo-400\">404</h1>\n    <h2 class=\"mt-4 text-2xl font-semibold text-gray-800 dark:text-white\"> {{ spxTextPageNotFound | translate | capitalize }} </h2>\n    <p class=\"mt-2 text-gray-600 dark:text-gray-400\">\n      {{ spxTextPageNotFoundDescription | translate | capitalize }}\n    </p>\n    <div class=\"py-2\">\n      <spx-button (spxClick)=\"goHome()\">\n        {{ spxTextGoHome | translate | capitalize }}\n      </spx-button>\n    </div>\n  </div>\n</ion-content>" }]
+        }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i2.NavController }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Spx404PageComponent };
+//# sourceMappingURL=softpak-components-spx-404-page.mjs.map

package/fesm2022/softpak-components-spx-404-page.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"softpak-components-spx-404-page.mjs","sources":["../../../../projects/softpak/components/spx-404-page/spx-404-page.component.ts","../../../../projects/softpak/components/spx-404-page/spx-404-page.component.html","../../../../projects/softpak/components/spx-404-page/softpak-components-spx-404-page.ts"],"sourcesContent":["import { Component } from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { IonContent, IonHeader, IonTitle, IonToolbar, NavController, IonButtons } from '@ionic/angular/standalone';\nimport { SpxCapitalizePipe } from '@softpak/components/spx-capitalize';\nimport { ActivatedRoute } from '@angular/router';\nimport { SpxButtonComponent } from '@softpak/components/spx-button';\nimport { spxText404PageNotFound, spxTextGoHome, spxTextPageNotFound, spxTextPageNotFoundDescription } from '@softpak/components/spx-translate';\n\n@Component({\n  selector: 'spx-404-page',\n  imports: [IonButtons, \n    IonContent,\n    IonHeader,\n    IonToolbar,\n    IonTitle,\n    SpxCapitalizePipe,\n    TranslatePipe,\n    SpxButtonComponent\n  ],\n  templateUrl: `./spx-404-page.component.html`,\n})\nexport class Spx404PageComponent {\n  spxText404PageNotFound = spxText404PageNotFound;\n  spxTextPageNotFound = spxTextPageNotFound;\n  spxTextPageNotFoundDescription = spxTextPageNotFoundDescription;\n  spxTextGoHome = spxTextGoHome;\n  goHome() : void{\n    if (this.activatedRoute.snapshot.data['url'] === undefined) {\n      console.error('configure data property \\'url\\' in route for update page');\n    }\n    this.navController.navigateRoot(this.activatedRoute.snapshot.data['url']);\n  }\n\n  constructor(\n    private readonly activatedRoute: ActivatedRoute,\n    private readonly navController: NavController,\n  ) {\n  }\n}\n","<ion-header>\n    <ion-toolbar>\n        <ion-title>\n            {{ spxText404PageNotFound | translate | capitalize }}\n        </ion-title>\n        <ion-buttons slot=\"end\">\n        </ion-buttons>\n    </ion-toolbar>\n</ion-header>\n\n<ion-content class=\"flex items-center justify-center min-h-screen bg-white dark:bg-gray-900 ion-padding\">\n  <div class=\"text-center p-6\">\n    <h1 class=\"text-7xl font-bold text-indigo-600 dark:text-indigo-400\">404</h1>\n    <h2 class=\"mt-4 text-2xl font-semibold text-gray-800 dark:text-white\"> {{ spxTextPageNotFound | translate | capitalize }} </h2>\n    <p class=\"mt-2 text-gray-600 dark:text-gray-400\">\n      {{ spxTextPageNotFoundDescription | translate | capitalize }}\n    </p>\n    <div class=\"py-2\">\n      <spx-button (spxClick)=\"goHome()\">\n        {{ spxTextGoHome | translate | capitalize }}\n      </spx-button>\n    </div>\n  </div>\n</ion-content>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;MAqBa,mBAAmB,CAAA;IAK9B,MAAM,GAAA;AACJ,QAAA,IAAI,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,SAAS,EAAE;AAC1D,YAAA,OAAO,CAAC,KAAK,CAAC,0DAA0D,CAAC;;AAE3E,QAAA,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;;IAG3E,WACmB,CAAA,cAA8B,EAC9B,aAA4B,EAAA;QAD5B,IAAc,CAAA,cAAA,GAAd,cAAc;QACd,IAAa,CAAA,aAAA,GAAb,aAAa;QAbhC,IAAsB,CAAA,sBAAA,GAAG,sBAAsB;QAC/C,IAAmB,CAAA,mBAAA,GAAG,mBAAmB;QACzC,IAA8B,CAAA,8BAAA,GAAG,8BAA8B;QAC/D,IAAa,CAAA,aAAA,GAAG,aAAa;;8GAJlB,mBAAmB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,cAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,aAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,wECrBhC,05BAuBc,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDbF,UAAU,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAClB,UAAU,EACV,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,oBAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,SAAS,EACT,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,UAAU,mFACV,QAAQ,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EACR,iBAAiB,EACjB,IAAA,EAAA,YAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,aAAa,kDACb,kBAAkB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,eAAA,EAAA,cAAA,EAAA,aAAA,EAAA,SAAA,EAAA,aAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FAIT,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAb/B,SAAS;+BACE,cAAc,EAAA,OAAA,EACf,CAAC,UAAU;wBAClB,UAAU;wBACV,SAAS;wBACT,UAAU;wBACV,QAAQ;wBACR,iBAAiB;wBACjB,aAAa;wBACb;AACD,qBAAA,EAAA,QAAA,EAAA,05BAAA,EAAA;;;AElBH;;AAEG;;;;"}

package/fesm2022/softpak-components-spx-change-details.mjs

@@ -17,15 +17,43 @@ const ctrlLicensePlate = 'licensePlate';
 const ctrlCategory = 'category';
 const ctrlUseCategories = 'useCategories';
 class SpxChangeDetailsComponent {
-    get ctrlCategory() { return this.formGroup.get(ctrlCategory); }
-    get ctrlCustomer() { return this.formGroup.get(ctrlCustomer); }
-    get ctrlContainerType() { return this.formGroup.get(ctrlContainerType); }
-    get ctrlLicensePlate() { return this.formGroup.get(ctrlLicensePlate); }
-    get ctrlTonsTested() { return this.formGroup?.get(ctrlTonsTested); }
-    get ctrlUseCategories() { return this.formGroup?.get(ctrlUseCategories); }
+    get suggestions() {
+        return this._suggestions;
+    }
+    set suggestions(value) {
+        this._suggestions = value;
+        if (this.suggestions?.[ctrlTonsTested] &&
+            this.suggestions?.[ctrlTonsTested].length &&
+            this.suggestions?.[ctrlTonsTested].length > 0) {
+            this.ctrlTonsTested.addValidators([spxValidatorRequired()]);
+            this.ctrlTonsTested.updateValueAndValidity();
+        }
+        else {
+            this.ctrlTonsTested.clearValidators();
+            this.ctrlTonsTested.updateValueAndValidity();
+        }
+    }
+    get ctrlCategory() {
+        return this.formGroup.get(ctrlCategory);
+    }
+    get ctrlCustomer() {
+        return this.formGroup.get(ctrlCustomer);
+    }
+    get ctrlContainerType() {
+        return this.formGroup.get(ctrlContainerType);
+    }
+    get ctrlLicensePlate() {
+        return this.formGroup.get(ctrlLicensePlate);
+    }
+    get ctrlTonsTested() {
+        return this.formGroup?.get(ctrlTonsTested);
+    }
+    get ctrlUseCategories() {
+        return this.formGroup?.get(ctrlUseCategories);
+    }
     constructor(formBuilder) {
         this.formBuilder = formBuilder;
-        this.suggestions = {};
+        this._suggestions = {};
         this.spxBlurCategory = new EventEmitter();
         this.spxBlurContainerType = new EventEmitter();
         this.spxSearchCategory = new EventEmitter();
@@ -38,7 +66,7 @@ class SpxChangeDetailsComponent {
                     severity: SpxSeverityEnum.success,
                     type: SpxFormButtonTypeEnum.submit,
                     label: () => this.textSave,
-                }
+                },
             ],
             sections: [
                 {
@@ -76,8 +104,9 @@ class SpxChangeDetailsComponent {
                             key: ctrlTonsTested,
                             type: () => SpxInputTypeEnum.radio,
                             label: () => this.textTonsTested,
-                            show: () => this.suggestions?.[ctrlTonsTested] && this.suggestions?.[ctrlTonsTested].length && this.suggestions?.[ctrlTonsTested].length > 0,
-                            validators: () => this.suggestions?.[ctrlTonsTested] && this.suggestions?.[ctrlTonsTested].length && this.suggestions?.[ctrlTonsTested].length > 0 ? [spxValidatorRequired()] : [],
+                            show: () => this.suggestions?.[ctrlTonsTested] &&
+                                this.suggestions?.[ctrlTonsTested].length &&
+                                this.suggestions?.[ctrlTonsTested].length > 0,
                         },
                         {
                             key: ctrlLicensePlate,
@@ -96,11 +125,13 @@ class SpxChangeDetailsComponent {
                             label: () => this.textCategory,
                             capitalize: () => true,
                             show: () => valuePairToValue(this.ctrlUseCategories?.value),
-                            validators: () => valuePairToValue(this.ctrlUseCategories?.value) ? [spxValidatorRequired()] : [],
-                        }
-                    ]
-                }
-            ]
+                            validators: () => valuePairToValue(this.ctrlUseCategories?.value)
+                                ? [spxValidatorRequired()]
+                                : [],
+                        },
+                    ],
+                },
+            ],
         };
     }
     createForm() {
@@ -138,20 +169,22 @@ class SpxChangeDetailsComponent {
     }
     onSubmit() {
         this.submit.emit({
-            category: valuePairToValue(this.ctrlUseCategories.value) ? this.ctrlCategory.value : null,
+            category: valuePairToValue(this.ctrlUseCategories.value)
+                ? this.ctrlCategory.value
+                : null,
             containerType: this.ctrlContainerType.value,
             licensePlate: this.ctrlLicensePlate.value,
             tonsTested: this.ctrlTonsTested.value,
         });
     }
     listenToContainerType() {
-        this.subContainerType = this.ctrlContainerType.valueChanges.subscribe(valuePair => {
+        this.subContainerType = this.ctrlContainerType.valueChanges.subscribe((valuePair) => {
             this.ctrlTonsTested.setValue({ value: null });
             this.spxSearchTonsTested.emit(valuePair);
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxChangeDetailsComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: SpxChangeDetailsComponent, isStandalone: true, selector: "spx-change-details", inputs: { formGroup: "formGroup", suggestions: "suggestions", textCategory: "textCategory", textContainerNumber: "textContainerNumber", textContainerType: "textContainerType", textCustomer: "textCustomer", textLicensePlate: "textLicensePlate", textSave: "textSave", textTonsTested: "textTonsTested" }, outputs: { spxBlurCategory: "spxBlurCategory", spxBlurContainerType: "spxBlurContainerType", spxSearchCategory: "spxSearchCategory", spxSearchContainerType: "spxSearchContainerType", spxSearchTonsTested: "spxSearchTonsTested", submit: "submit" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SpxFormViewComponent, selector: "spx-form-view", inputs: ["spxFormGroup", "spxForm", "spxSuggestions"], outputs: ["spxBlur", "spxClick", "spxSearch"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: SpxChangeDetailsComponent, isStandalone: true, selector: "spx-change-details", inputs: { formGroup: "formGroup", _suggestions: "_suggestions", suggestions: "suggestions", textCategory: "textCategory", textContainerNumber: "textContainerNumber", textContainerType: "textContainerType", textCustomer: "textCustomer", textLicensePlate: "textLicensePlate", textSave: "textSave", textTonsTested: "textTonsTested" }, outputs: { spxBlurCategory: "spxBlurCategory", spxBlurContainerType: "spxBlurContainerType", spxSearchCategory: "spxSearchCategory", spxSearchContainerType: "spxSearchContainerType", spxSearchTonsTested: "spxSearchTonsTested", submit: "submit" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SpxFormViewComponent, selector: "spx-form-view", inputs: ["spxFormGroup", "spxForm", "spxSuggestions"], outputs: ["spxBlur", "spxClick", "spxSearch"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxChangeDetailsComponent, decorators: [{
             type: Component,
@@ -162,6 +195,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
                     ], template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>" }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { formGroup: [{
                 type: Input
+            }], _suggestions: [{
+                type: Input
             }], suggestions: [{
                 type: Input
             }], textCategory: [{

package/fesm2022/softpak-components-spx-change-details.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"softpak-components-spx-change-details.mjs","sources":["../../../../projects/softpak/components/spx-change-details/spx-change-details.component.ts","../../../../projects/softpak/components/spx-change-details/spx-change-details.component.html","../../../../projects/softpak/components/spx-change-details/softpak-components-spx-change-details.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { FormBuilder, FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { Subscription } from 'rxjs';\nimport { SpxChangeDetailsValueI } from './spx-change-details-value.interface';\nimport { SpxFormViewComponent, SpxFormI, SpxFormButtonTypeEnum, SpxFormFieldI } from '@softpak/components/spx-form-view';\nimport { SpxSeverityEnum, valuePairToValue } from '@softpak/components/spx-helpers';\nimport { SpxValuePair, SpxInputTypeEnum } from '@softpak/components/spx-inputs';\nimport { spxValidatorRequired } from '@softpak/components/spx-validation';\n\nexport const sectionChangeDetails = 'changeDetails';\nexport const ctrlContainerNumber = 'containerNumber';\nexport const ctrlContainerSeqNr = 'containerSeqNr';\nexport const ctrlContainerType = 'containerType';\nexport const ctrlCustomer = 'customer';\nexport const ctrlTonsTested = 'tonsTested';\nexport const ctrlLicensePlate = 'licensePlate';\nexport const ctrlCategory = 'category';\nexport const ctrlUseCategories = 'useCategories';\n\n@Component({\n    selector: 'spx-change-details',\n    templateUrl: './spx-change-details.component.html',\n    imports: [\n        FormsModule,\n        ReactiveFormsModule,\n        SpxFormViewComponent,\n    ]\n})\nexport class SpxChangeDetailsComponent {\n  @Input() formGroup!: FormGroup;\n  @Input() suggestions: any = {};\n  @Input() textCategory!: string;\n  @Input() textContainerNumber!: string;\n  @Input() textContainerType!: string;\n  @Input() textCustomer!: string;\n  @Input() textLicensePlate!: string;\n  @Input() textSave!: string;\n  @Input() textTonsTested!: string;\n  @Output() spxBlurCategory: EventEmitter<SpxValuePair<string>> = new EventEmitter<SpxValuePair<string>>();\n  @Output() spxBlurContainerType: EventEmitter<SpxValuePair<string>> = new EventEmitter<SpxValuePair<string>>();\n  @Output() spxSearchCategory: EventEmitter<SpxValuePair<string>> = new EventEmitter<SpxValuePair<string>>();\n  @Output() spxSearchContainerType: EventEmitter<SpxValuePair<string>> = new EventEmitter<SpxValuePair<string>>();\n  @Output() spxSearchTonsTested: EventEmitter<SpxValuePair<string>> = new EventEmitter<SpxValuePair<string>>();\n  @Output() submit: EventEmitter<SpxChangeDetailsValueI> = new EventEmitter<SpxChangeDetailsValueI>();\n\n  form: SpxFormI = {\n    buttons: [\n      {\n        severity: SpxSeverityEnum.success,\n        type: SpxFormButtonTypeEnum.submit,\n        label: () => this.textSave,\n      }\n    ],\n    sections: [\n      {\n        key: sectionChangeDetails,\n        showTitle: () => false,\n        fields: [\n          {\n            key: ctrlContainerSeqNr,\n            type: () => SpxInputTypeEnum.hidden,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlContainerNumber,\n            type: () => SpxInputTypeEnum.text,\n            label: () => this.textContainerNumber,\n            readonly: () => true,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlCustomer,\n            type: () => SpxInputTypeEnum.text,\n            capitalize: () => true,\n            readonly: () => true,\n            label: () => this.textCustomer,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlContainerType,\n            type: () => SpxInputTypeEnum.autocomplete,\n            label: () => this.textContainerType,\n            capitalize: () => true,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlTonsTested,\n            type: () => SpxInputTypeEnum.radio,\n            label: () => this.textTonsTested,\n            show: () => this.suggestions?.[ctrlTonsTested] && this.suggestions?.[ctrlTonsTested].length && this.suggestions?.[ctrlTonsTested].length > 0,\n            validators: () => this.suggestions?.[ctrlTonsTested] && this.suggestions?.[ctrlTonsTested].length && this.suggestions?.[ctrlTonsTested].length > 0 ? [spxValidatorRequired()] : [],\n          },\n          {\n            key: ctrlLicensePlate,\n            type: () => SpxInputTypeEnum.text,\n            label: () => this.textLicensePlate,\n            capitalize: () => true,\n          },\n          {\n            key: ctrlUseCategories,\n            type: () => SpxInputTypeEnum.hidden,\n            capitalize: () => true,\n          },\n          {\n            key: ctrlCategory,\n            type: () => SpxInputTypeEnum.autocomplete,\n            label: () => this.textCategory,\n            capitalize: () => true,\n            show: () => valuePairToValue(this.ctrlUseCategories?.value),\n            validators: () => valuePairToValue(this.ctrlUseCategories?.value) ? [spxValidatorRequired()] : [],\n          }\n        ]\n      }\n    ]\n  };\n\n  get ctrlCategory(): FormControl { return this.formGroup.get(ctrlCategory) as FormControl; }\n  get ctrlCustomer(): FormControl { return this.formGroup.get(ctrlCustomer) as FormControl; }\n  get ctrlContainerType(): FormControl { return this.formGroup.get(ctrlContainerType) as FormControl; }\n  get ctrlLicensePlate(): FormControl { return this.formGroup.get(ctrlLicensePlate) as FormControl; }\n  get ctrlTonsTested(): FormControl { return this.formGroup?.get(ctrlTonsTested) as FormControl; }\n  get ctrlUseCategories(): FormControl { return this.formGroup?.get(ctrlUseCategories) as FormControl; }\n\n  private subContainerType?: Subscription;\n\n  constructor(readonly formBuilder: FormBuilder) {\n  }\n\n  createForm(): FormGroup {\n    return SpxFormViewComponent.createForm(this.formBuilder, this.form.sections);\n  }\n\n  ngOnInit(): void {\n    this.listenToContainerType();\n  }\n\n  ngOnDestroy(): void {\n    if (this.subContainerType) {\n      this.subContainerType.unsubscribe();\n    }\n  }\n\n  getRawValidators(formControl: FormControl) {\n    return (formControl as any)._rawValidators;\n  }\n\n  onBlur(data: { field: SpxFormFieldI, valuePair: SpxValuePair<any> }) {\n    if (data.field.key === ctrlCategory) {\n      this.spxBlurCategory.emit(data.valuePair);\n    }\n    if (data.field.key === ctrlContainerType) {\n      this.spxBlurContainerType.emit(data.valuePair);\n    }\n  }\n\n  onSearch(data: { field: SpxFormFieldI, valuePair: SpxValuePair<any> }) {\n    if (data.field.key === ctrlCategory) {\n      this.spxSearchCategory.emit(data.valuePair);\n    }\n    if (data.field.key === ctrlContainerType) {\n      this.spxSearchContainerType.emit(data.valuePair);\n    }\n    if (data.field.key === ctrlTonsTested) {\n      this.spxSearchTonsTested.emit(data.valuePair);\n    }\n  }\n\n  onSubmit(): void {\n    this.submit.emit({\n      category: valuePairToValue(this.ctrlUseCategories.value) ? this.ctrlCategory.value : null,\n      containerType: this.ctrlContainerType.value,\n      licensePlate: this.ctrlLicensePlate.value,\n      tonsTested: this.ctrlTonsTested.value,\n    })\n  }\n\n  private listenToContainerType(): void {\n    this.subContainerType = this.ctrlContainerType.valueChanges.subscribe(valuePair => {\n      this.ctrlTonsTested.setValue({ value: null });\n      this.spxSearchTonsTested.emit(valuePair);\n    });\n  }\n}\n","<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"softpak-components-spx-change-details.mjs","sources":["../../../../projects/softpak/components/spx-change-details/spx-change-details.component.ts","../../../../projects/softpak/components/spx-change-details/spx-change-details.component.html","../../../../projects/softpak/components/spx-change-details/softpak-components-spx-change-details.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport {\n  FormBuilder,\n  FormControl,\n  FormGroup,\n  FormsModule,\n  ReactiveFormsModule,\n} from '@angular/forms';\nimport { Subscription } from 'rxjs';\nimport { SpxChangeDetailsValueI } from './spx-change-details-value.interface';\nimport { SpxFormViewComponent, SpxFormI, SpxFormButtonTypeEnum, SpxFormFieldI } from '@softpak/components/spx-form-view';\nimport { SpxSeverityEnum, valuePairToValue } from '@softpak/components/spx-helpers';\nimport { SpxValuePair, SpxInputTypeEnum } from '@softpak/components/spx-inputs';\nimport { spxValidatorRequired } from '@softpak/components/spx-validation';\n\nexport const sectionChangeDetails = 'changeDetails';\nexport const ctrlContainerNumber = 'containerNumber';\nexport const ctrlContainerSeqNr = 'containerSeqNr';\nexport const ctrlContainerType = 'containerType';\nexport const ctrlCustomer = 'customer';\nexport const ctrlTonsTested = 'tonsTested';\nexport const ctrlLicensePlate = 'licensePlate';\nexport const ctrlCategory = 'category';\nexport const ctrlUseCategories = 'useCategories';\n\n@Component({\n    selector: 'spx-change-details',\n    templateUrl: './spx-change-details.component.html',\n    imports: [\n        FormsModule,\n        ReactiveFormsModule,\n        SpxFormViewComponent,\n    ]\n})\nexport class SpxChangeDetailsComponent {\n  @Input() formGroup!: FormGroup;\n  @Input()\n  private _suggestions: any = {};\n  public get suggestions(): any {\n    return this._suggestions;\n  }\n  @Input() set suggestions(value: any) {\n    this._suggestions = value;\n    if (\n      this.suggestions?.[ctrlTonsTested] &&\n      this.suggestions?.[ctrlTonsTested].length &&\n      this.suggestions?.[ctrlTonsTested].length > 0\n    ) {\n      this.ctrlTonsTested.addValidators([spxValidatorRequired()]);\n      this.ctrlTonsTested.updateValueAndValidity();\n    } else {\n      this.ctrlTonsTested.clearValidators();\n      this.ctrlTonsTested.updateValueAndValidity();\n    }\n  }\n  @Input() textCategory!: string;\n  @Input() textContainerNumber!: string;\n  @Input() textContainerType!: string;\n  @Input() textCustomer!: string;\n  @Input() textLicensePlate!: string;\n  @Input() textSave!: string;\n  @Input() textTonsTested!: string;\n  @Output() spxBlurCategory: EventEmitter<SpxValuePair<string>> =\n    new EventEmitter<SpxValuePair<string>>();\n  @Output() spxBlurContainerType: EventEmitter<SpxValuePair<string>> =\n    new EventEmitter<SpxValuePair<string>>();\n  @Output() spxSearchCategory: EventEmitter<SpxValuePair<string>> =\n    new EventEmitter<SpxValuePair<string>>();\n  @Output() spxSearchContainerType: EventEmitter<SpxValuePair<string>> =\n    new EventEmitter<SpxValuePair<string>>();\n  @Output() spxSearchTonsTested: EventEmitter<SpxValuePair<string>> =\n    new EventEmitter<SpxValuePair<string>>();\n  @Output() submit: EventEmitter<SpxChangeDetailsValueI> =\n    new EventEmitter<SpxChangeDetailsValueI>();\n\n  form: SpxFormI = {\n    buttons: [\n      {\n        severity: SpxSeverityEnum.success,\n        type: SpxFormButtonTypeEnum.submit,\n        label: () => this.textSave,\n      },\n    ],\n    sections: [\n      {\n        key: sectionChangeDetails,\n        showTitle: () => false,\n        fields: [\n          {\n            key: ctrlContainerSeqNr,\n            type: () => SpxInputTypeEnum.hidden,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlContainerNumber,\n            type: () => SpxInputTypeEnum.text,\n            label: () => this.textContainerNumber,\n            readonly: () => true,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlCustomer,\n            type: () => SpxInputTypeEnum.text,\n            capitalize: () => true,\n            readonly: () => true,\n            label: () => this.textCustomer,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlContainerType,\n            type: () => SpxInputTypeEnum.autocomplete,\n            label: () => this.textContainerType,\n            capitalize: () => true,\n            validators: () => [spxValidatorRequired()],\n          },\n          {\n            key: ctrlTonsTested,\n            type: () => SpxInputTypeEnum.radio,\n            label: () => this.textTonsTested,\n            show: () =>\n              this.suggestions?.[ctrlTonsTested] &&\n              this.suggestions?.[ctrlTonsTested].length &&\n              this.suggestions?.[ctrlTonsTested].length > 0,\n          },\n          {\n            key: ctrlLicensePlate,\n            type: () => SpxInputTypeEnum.text,\n            label: () => this.textLicensePlate,\n            capitalize: () => true,\n          },\n          {\n            key: ctrlUseCategories,\n            type: () => SpxInputTypeEnum.hidden,\n            capitalize: () => true,\n          },\n          {\n            key: ctrlCategory,\n            type: () => SpxInputTypeEnum.autocomplete,\n            label: () => this.textCategory,\n            capitalize: () => true,\n            show: () => valuePairToValue(this.ctrlUseCategories?.value),\n            validators: () =>\n              valuePairToValue(this.ctrlUseCategories?.value)\n                ? [spxValidatorRequired()]\n                : [],\n          },\n        ],\n      },\n    ],\n  };\n\n  get ctrlCategory(): FormControl {\n    return this.formGroup.get(ctrlCategory) as FormControl;\n  }\n  get ctrlCustomer(): FormControl {\n    return this.formGroup.get(ctrlCustomer) as FormControl;\n  }\n  get ctrlContainerType(): FormControl {\n    return this.formGroup.get(ctrlContainerType) as FormControl;\n  }\n  get ctrlLicensePlate(): FormControl {\n    return this.formGroup.get(ctrlLicensePlate) as FormControl;\n  }\n  get ctrlTonsTested(): FormControl {\n    return this.formGroup?.get(ctrlTonsTested) as FormControl;\n  }\n  get ctrlUseCategories(): FormControl {\n    return this.formGroup?.get(ctrlUseCategories) as FormControl;\n  }\n\n  private subContainerType?: Subscription;\n\n  constructor(readonly formBuilder: FormBuilder) {}\n\n  createForm(): FormGroup {\n    return SpxFormViewComponent.createForm(\n      this.formBuilder,\n      this.form.sections\n    );\n  }\n\n  ngOnInit(): void {\n    this.listenToContainerType();\n  }\n\n  ngOnDestroy(): void {\n    if (this.subContainerType) {\n      this.subContainerType.unsubscribe();\n    }\n  }\n\n  getRawValidators(formControl: FormControl) {\n    return (formControl as any)._rawValidators;\n  }\n\n  onBlur(data: { field: SpxFormFieldI; valuePair: SpxValuePair<any> }) {\n    if (data.field.key === ctrlCategory) {\n      this.spxBlurCategory.emit(data.valuePair);\n    }\n    if (data.field.key === ctrlContainerType) {\n      this.spxBlurContainerType.emit(data.valuePair);\n    }\n  }\n\n  onSearch(data: { field: SpxFormFieldI; valuePair: SpxValuePair<any> }) {\n    if (data.field.key === ctrlCategory) {\n      this.spxSearchCategory.emit(data.valuePair);\n    }\n    if (data.field.key === ctrlContainerType) {\n      this.spxSearchContainerType.emit(data.valuePair);\n    }\n    if (data.field.key === ctrlTonsTested) {\n      this.spxSearchTonsTested.emit(data.valuePair);\n    }\n  }\n\n  onSubmit(): void {\n    this.submit.emit({\n      category: valuePairToValue(this.ctrlUseCategories.value)\n        ? this.ctrlCategory.value\n        : null,\n      containerType: this.ctrlContainerType.value,\n      licensePlate: this.ctrlLicensePlate.value,\n      tonsTested: this.ctrlTonsTested.value,\n    });\n  }\n\n  private listenToContainerType(): void {\n    this.subContainerType = this.ctrlContainerType.valueChanges.subscribe(\n      (valuePair) => {\n        this.ctrlTonsTested.setValue({ value: null });\n        this.spxSearchTonsTested.emit(valuePair);\n      }\n    );\n  }\n}\n","<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/softpak-components-spx-inputs.mjs

@@ -973,7 +973,7 @@ class SpxInputComponent {
                 useExisting: SpxInputComponent,
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "floatInput", first: true, predicate: ["spxInputFloat"], descendants: true, isSignal: true }, { propertyName: "numberInput", first: true, predicate: ["spxInputNumber"], descendants: true, isSignal: true }, { propertyName: "textInput", first: true, predicate: ["spxInputText"], descendants: true, isSignal: true }, { propertyName: "timeInput", first: true, predicate: ["spxInputTime"], descendants: true, isSignal: true }, { propertyName: "radioInput", first: true, predicate: ["spxInputRadio"], descendants: true, isSignal: true }, { propertyName: "dateInput", first: true, predicate: ["spxInputDate"], descendants: true, isSignal: true }], ngImport: i0, template: "<spx-input-box\n    [spxAlert]=\"this.spxAlert()\"\n    [spxLabel]=\"this.spxLabel()\"\n    [spxReadonly]=\"this.spxReadonly()\"\n    [spxRequired]=\"this.spxRequired()\"\n    [spxValue]=\"this.value()\"\n    [spxShowHelp]=\"this.spxShowHelp()\"\n    [spxCompact]=\"this.spxCompact()\"\n    [spxShowClear]=\"this.spxShowClear()\"\n    [spxShowEdit]=\"this.spxShowEdit()\"\n    [spxShowLabel]=\"this.spxShowLabel()\"\n    [spxShowSearch]=\"this.spxShowSearch() ? this.spxShowSearch() : this.spxType() === 'autocomplete'\"\n    [spxShowValidationMessages]=\"this.spxShowValidationMessages()\"\n    (spxClear)=\"this.handleClear()\"\n    (spxEdit)=\"this.handleEdit()\"\n    (spxHelp)=\"this.handleHelp()\"\n    (spxSearch)=\"this.handleSearch()\"\n    (spxSetIdInParent)=\"handleSpxElementIdSet($event)\"\n    >\n    <div controls>\n      @if (this.spxType() === 'autocomplete' || this.spxType() === 'overlay' || this.spxType() === 'overlaynumber' || this.spxType() === 'text' || this.spxType() === 'password') {\n        <spx-input-text #spxInputText\n          [spxAutocomplete]=\"this.spxAutocomplete() ? this.spxAutocomplete() : undefined\"\n          [spxAutofocus]=\"this.spxAutofocus()\"\n          [spxCapitalize]=\"this.spxCapitalize()\"\n          [spxInputMode]=\"this.spxType() === 'overlaynumber' ? 'numeric' : this.spxInputMode()\"\n          [spxName]=\"this.spxName()\"\n          [spxPattern]=\"this.spxType() === 'overlaynumber' ? '[0-9]*' : this.spxPattern()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxSuggestions]=\"this.spxSuggestions()\"\n          [spxType]=\"this.spxType()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-text>\n      }\n      @if (this.spxType() === 'date') {\n        <spx-input-date #spxInputDate\n          [spxMax]=\"this.spxMax()!\"\n          [spxMin]=\"this.spxMin()!\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxSelectDay]=\"this.spxSelectDay()\"\n          [spxSelectMonth]=\"this.spxSelectMonth()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [value]=\"value()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [spxAutoFocus]=\"this.spxAutofocus()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-date>\n      }\n      @if (this.spxType() === 'float') {\n        <spx-input-float #spxInputFloat\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxStep]=\"this.spxStep()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [spxAutofocus]=\"this.spxAutofocus()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-float>\n      }\n      @if (this.spxType() === 'number') {\n        <spx-input-number #spxInputNumber\n          [spxInputMode]=\"this.spxInputMode()\"\n          [spxAutofocus]=\"this.spxAutofocus()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxStep]=\"this.spxStep()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-number>\n      }\n      @if (this.spxType() === 'radio') {\n        <spx-input-radio\n          #spxInputRadio\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxShowLabel]=\"this.spxShowLabel()\"\n          [spxSuggestions]=\"this.spxSuggestions()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-radio>\n      }\n      @if (this.spxType() === 'time') {\n        <spx-input-time\n          #spxInputTime\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-time>\n      }\n    </div>\n    <div validation-messages>\n      <ng-content></ng-content>\n    </div>\n  </spx-input-box>", dependencies: [{ kind: "component", type: SpxInputBoxComponent, selector: "spx-input-box", inputs: ["spxCompact", "spxLabel", "spxReadonly", "spxRequired", "spxShowClear", "spxShowEdit", "spxShowHelp", "spxShowLabel", "spxShowSearch", "spxShowValidationMessages", "spxAlert", "spxValue"], outputs: ["spxValueChange", "spxClear", "spxSearch", "spxEdit", "spxHelp", "spxSetIdInParent"] }, { kind: "component", type: SpxInputDateComponent, selector: "spx-input-date", inputs: ["spxMax", "spxMin", "spxReadonly", "spxValidators", "spxAutoFocus", "value", "spxSelectDay", "spxSelectMonth", "spxElementId", "spxSuggestions"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputFloatComponent, selector: "spx-input-float", inputs: ["spxName", "spxAutofocus", "spxElementId", "spxReadonly", "spxValidators", "spxStep", "value", "spxWasInternalUpdate"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputNumberComponent, selector: "spx-input-number", inputs: ["spxName", "spxAutofocus", "spxInputMode", "spxReadonly", "spxValidators", "spxFocused", "spxStep", "value", "spxElementId"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputRadioComponent, selector: "spx-input-radio", inputs: ["spxName", "spxValidators", "spxShowLabel", "spxReadonly", "spxSuggestions", "value", "spxElementId"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputTextComponent, selector: "spx-input-text", inputs: ["spxName", "spxAutofocus", "spxAutocomplete", "spxInputMode", "spxPattern", "spxSuggestions", "spxReadonly", "spxValidators", "spxCapitalize", "spxType", "spxWasInternalUpdate", "value", "spxElementId"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputTimeComponent, selector: "spx-input-time", inputs: ["spxName", "spxAutofocus", "spxInputMode", "spxPattern", "spxSuggestions", "spxReadonly", "spxValidators", "spxCapitalize", "value"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "floatInput", first: true, predicate: ["spxInputFloat"], descendants: true, isSignal: true }, { propertyName: "numberInput", first: true, predicate: ["spxInputNumber"], descendants: true, isSignal: true }, { propertyName: "textInput", first: true, predicate: ["spxInputText"], descendants: true, isSignal: true }, { propertyName: "timeInput", first: true, predicate: ["spxInputTime"], descendants: true, isSignal: true }, { propertyName: "radioInput", first: true, predicate: ["spxInputRadio"], descendants: true, isSignal: true }, { propertyName: "dateInput", first: true, predicate: ["spxInputDate"], descendants: true, isSignal: true }], ngImport: i0, template: "<spx-input-box\n  (spxClear)=\"this.handleClear()\"\n  (spxEdit)=\"this.handleEdit()\"\n  (spxHelp)=\"this.handleHelp()\"\n  (spxSearch)=\"this.handleSearch()\"\n  (spxSetIdInParent)=\"handleSpxElementIdSet($event)\"\n  [spxAlert]=\"this.spxAlert()\"\n  [spxCompact]=\"this.spxCompact()\"\n  [spxLabel]=\"this.spxLabel()\"\n  [spxReadonly]=\"this.spxReadonly()\"\n  [spxRequired]=\"this.spxRequired()\"\n  [spxShowClear]=\"this.spxShowClear()\"\n  [spxShowEdit]=\"this.spxShowEdit()\"\n  [spxShowHelp]=\"this.spxShowHelp()\"\n  [spxShowLabel]=\"this.spxShowLabel()\"\n  [spxShowSearch]=\"this.spxShowSearch() ? this.spxShowSearch() : this.spxType() === 'autocomplete'\"\n  [spxShowValidationMessages]=\"this.spxShowValidationMessages()\"\n  [spxValue]=\"this.value()\"\n>\n  <div controls>\n    @if (this.spxType() === 'autocomplete' || this.spxType() === 'overlay' ||\n    this.spxType() === 'overlaynumber' || this.spxType() === 'text' ||\n    this.spxType() === 'password') {\n    <spx-input-text\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutocomplete]=\"this.spxAutocomplete() ? this.spxAutocomplete() : undefined\"\n      [spxAutofocus]=\"this.spxAutofocus()\"\n      [spxCapitalize]=\"this.spxCapitalize()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxInputMode]=\"this.spxType() === 'overlaynumber' ? 'numeric' : this.spxInputMode()\"\n      [spxName]=\"this.spxName()\"\n      [spxPattern]=\"this.spxType() === 'overlaynumber' ? '[0-9]*' : this.spxPattern()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxSuggestions]=\"this.spxSuggestions()\"\n      [spxType]=\"this.spxType()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputText\n    ></spx-input-text>\n    } @if (this.spxType() === 'date') {\n    <spx-input-date\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutoFocus]=\"this.spxAutofocus()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxMax]=\"this.spxMax()!\"\n      [spxMin]=\"this.spxMin()!\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxSelectDay]=\"this.spxSelectDay()\"\n      [spxSelectMonth]=\"this.spxSelectMonth()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputDate\n    ></spx-input-date>\n    } @if (this.spxType() === 'float') {\n    <spx-input-float\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutofocus]=\"this.spxAutofocus()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxStep]=\"this.spxStep()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputFloat\n    ></spx-input-float>\n    } @if (this.spxType() === 'number') {\n    <spx-input-number\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutofocus]=\"this.spxAutofocus()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxInputMode]=\"this.spxInputMode()\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxStep]=\"this.spxStep()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputNumber\n    ></spx-input-number>\n    } @if (this.spxType() === 'radio') {\n    <spx-input-radio\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxShowLabel]=\"this.spxShowLabel()\"\n      [spxSuggestions]=\"this.spxSuggestions()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputRadio\n    ></spx-input-radio>\n    } @if (this.spxType() === 'time') {\n    <spx-input-time\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputTime\n    ></spx-input-time>\n    }\n  </div>\n  <div validation-messages>\n    <ng-content></ng-content>\n  </div>\n</spx-input-box>\n", dependencies: [{ kind: "component", type: SpxInputBoxComponent, selector: "spx-input-box", inputs: ["spxCompact", "spxLabel", "spxReadonly", "spxRequired", "spxShowClear", "spxShowEdit", "spxShowHelp", "spxShowLabel", "spxShowSearch", "spxShowValidationMessages", "spxAlert", "spxValue"], outputs: ["spxValueChange", "spxClear", "spxSearch", "spxEdit", "spxHelp", "spxSetIdInParent"] }, { kind: "component", type: SpxInputDateComponent, selector: "spx-input-date", inputs: ["spxMax", "spxMin", "spxReadonly", "spxValidators", "spxAutoFocus", "value", "spxSelectDay", "spxSelectMonth", "spxElementId", "spxSuggestions"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputFloatComponent, selector: "spx-input-float", inputs: ["spxName", "spxAutofocus", "spxElementId", "spxReadonly", "spxValidators", "spxStep", "value", "spxWasInternalUpdate"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputNumberComponent, selector: "spx-input-number", inputs: ["spxName", "spxAutofocus", "spxInputMode", "spxReadonly", "spxValidators", "spxFocused", "spxStep", "value", "spxElementId"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputRadioComponent, selector: "spx-input-radio", inputs: ["spxName", "spxValidators", "spxShowLabel", "spxReadonly", "spxSuggestions", "value", "spxElementId"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputTextComponent, selector: "spx-input-text", inputs: ["spxName", "spxAutofocus", "spxAutocomplete", "spxInputMode", "spxPattern", "spxSuggestions", "spxReadonly", "spxValidators", "spxCapitalize", "spxType", "spxWasInternalUpdate", "value", "spxElementId"], outputs: ["valueChange"] }, { kind: "component", type: SpxInputTimeComponent, selector: "spx-input-time", inputs: ["spxName", "spxAutofocus", "spxInputMode", "spxPattern", "spxSuggestions", "spxReadonly", "spxValidators", "spxCapitalize", "value"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxInputComponent, decorators: [{
             type: Component,
@@ -993,7 +993,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
                             useExisting: SpxInputComponent,
                             multi: true
                         }
-                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<spx-input-box\n    [spxAlert]=\"this.spxAlert()\"\n    [spxLabel]=\"this.spxLabel()\"\n    [spxReadonly]=\"this.spxReadonly()\"\n    [spxRequired]=\"this.spxRequired()\"\n    [spxValue]=\"this.value()\"\n    [spxShowHelp]=\"this.spxShowHelp()\"\n    [spxCompact]=\"this.spxCompact()\"\n    [spxShowClear]=\"this.spxShowClear()\"\n    [spxShowEdit]=\"this.spxShowEdit()\"\n    [spxShowLabel]=\"this.spxShowLabel()\"\n    [spxShowSearch]=\"this.spxShowSearch() ? this.spxShowSearch() : this.spxType() === 'autocomplete'\"\n    [spxShowValidationMessages]=\"this.spxShowValidationMessages()\"\n    (spxClear)=\"this.handleClear()\"\n    (spxEdit)=\"this.handleEdit()\"\n    (spxHelp)=\"this.handleHelp()\"\n    (spxSearch)=\"this.handleSearch()\"\n    (spxSetIdInParent)=\"handleSpxElementIdSet($event)\"\n    >\n    <div controls>\n      @if (this.spxType() === 'autocomplete' || this.spxType() === 'overlay' || this.spxType() === 'overlaynumber' || this.spxType() === 'text' || this.spxType() === 'password') {\n        <spx-input-text #spxInputText\n          [spxAutocomplete]=\"this.spxAutocomplete() ? this.spxAutocomplete() : undefined\"\n          [spxAutofocus]=\"this.spxAutofocus()\"\n          [spxCapitalize]=\"this.spxCapitalize()\"\n          [spxInputMode]=\"this.spxType() === 'overlaynumber' ? 'numeric' : this.spxInputMode()\"\n          [spxName]=\"this.spxName()\"\n          [spxPattern]=\"this.spxType() === 'overlaynumber' ? '[0-9]*' : this.spxPattern()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxSuggestions]=\"this.spxSuggestions()\"\n          [spxType]=\"this.spxType()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-text>\n      }\n      @if (this.spxType() === 'date') {\n        <spx-input-date #spxInputDate\n          [spxMax]=\"this.spxMax()!\"\n          [spxMin]=\"this.spxMin()!\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxSelectDay]=\"this.spxSelectDay()\"\n          [spxSelectMonth]=\"this.spxSelectMonth()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [value]=\"value()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [spxAutoFocus]=\"this.spxAutofocus()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-date>\n      }\n      @if (this.spxType() === 'float') {\n        <spx-input-float #spxInputFloat\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxStep]=\"this.spxStep()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [spxAutofocus]=\"this.spxAutofocus()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-float>\n      }\n      @if (this.spxType() === 'number') {\n        <spx-input-number #spxInputNumber\n          [spxInputMode]=\"this.spxInputMode()\"\n          [spxAutofocus]=\"this.spxAutofocus()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxStep]=\"this.spxStep()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-number>\n      }\n      @if (this.spxType() === 'radio') {\n        <spx-input-radio\n          #spxInputRadio\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxShowLabel]=\"this.spxShowLabel()\"\n          [spxSuggestions]=\"this.spxSuggestions()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [spxElementId]=\"this.spxElementId()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-radio>\n      }\n      @if (this.spxType() === 'time') {\n        <spx-input-time\n          #spxInputTime\n          [spxName]=\"this.spxName()\"\n          [spxReadonly]=\"this.spxReadonly()\"\n          [spxValidators]=\"this.spxValidators()\"\n          [value]=\"value()\"\n          (valueChange)=\"handleChangeEvent($event)\"\n        ></spx-input-time>\n      }\n    </div>\n    <div validation-messages>\n      <ng-content></ng-content>\n    </div>\n  </spx-input-box>" }]
+                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<spx-input-box\n  (spxClear)=\"this.handleClear()\"\n  (spxEdit)=\"this.handleEdit()\"\n  (spxHelp)=\"this.handleHelp()\"\n  (spxSearch)=\"this.handleSearch()\"\n  (spxSetIdInParent)=\"handleSpxElementIdSet($event)\"\n  [spxAlert]=\"this.spxAlert()\"\n  [spxCompact]=\"this.spxCompact()\"\n  [spxLabel]=\"this.spxLabel()\"\n  [spxReadonly]=\"this.spxReadonly()\"\n  [spxRequired]=\"this.spxRequired()\"\n  [spxShowClear]=\"this.spxShowClear()\"\n  [spxShowEdit]=\"this.spxShowEdit()\"\n  [spxShowHelp]=\"this.spxShowHelp()\"\n  [spxShowLabel]=\"this.spxShowLabel()\"\n  [spxShowSearch]=\"this.spxShowSearch() ? this.spxShowSearch() : this.spxType() === 'autocomplete'\"\n  [spxShowValidationMessages]=\"this.spxShowValidationMessages()\"\n  [spxValue]=\"this.value()\"\n>\n  <div controls>\n    @if (this.spxType() === 'autocomplete' || this.spxType() === 'overlay' ||\n    this.spxType() === 'overlaynumber' || this.spxType() === 'text' ||\n    this.spxType() === 'password') {\n    <spx-input-text\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutocomplete]=\"this.spxAutocomplete() ? this.spxAutocomplete() : undefined\"\n      [spxAutofocus]=\"this.spxAutofocus()\"\n      [spxCapitalize]=\"this.spxCapitalize()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxInputMode]=\"this.spxType() === 'overlaynumber' ? 'numeric' : this.spxInputMode()\"\n      [spxName]=\"this.spxName()\"\n      [spxPattern]=\"this.spxType() === 'overlaynumber' ? '[0-9]*' : this.spxPattern()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxSuggestions]=\"this.spxSuggestions()\"\n      [spxType]=\"this.spxType()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputText\n    ></spx-input-text>\n    } @if (this.spxType() === 'date') {\n    <spx-input-date\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutoFocus]=\"this.spxAutofocus()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxMax]=\"this.spxMax()!\"\n      [spxMin]=\"this.spxMin()!\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxSelectDay]=\"this.spxSelectDay()\"\n      [spxSelectMonth]=\"this.spxSelectMonth()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputDate\n    ></spx-input-date>\n    } @if (this.spxType() === 'float') {\n    <spx-input-float\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutofocus]=\"this.spxAutofocus()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxStep]=\"this.spxStep()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputFloat\n    ></spx-input-float>\n    } @if (this.spxType() === 'number') {\n    <spx-input-number\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxAutofocus]=\"this.spxAutofocus()\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxInputMode]=\"this.spxInputMode()\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxStep]=\"this.spxStep()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputNumber\n    ></spx-input-number>\n    } @if (this.spxType() === 'radio') {\n    <spx-input-radio\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxElementId]=\"this.spxElementId()\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxShowLabel]=\"this.spxShowLabel()\"\n      [spxSuggestions]=\"this.spxSuggestions()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputRadio\n    ></spx-input-radio>\n    } @if (this.spxType() === 'time') {\n    <spx-input-time\n      (valueChange)=\"handleChangeEvent($event)\"\n      [spxName]=\"this.spxName()\"\n      [spxReadonly]=\"this.spxReadonly()\"\n      [spxValidators]=\"this.spxValidators()\"\n      [value]=\"value()\"\n      #spxInputTime\n    ></spx-input-time>\n    }\n  </div>\n  <div validation-messages>\n    <ng-content></ng-content>\n  </div>\n</spx-input-box>\n" }]
         }], propDecorators: { _handleBlurEvent: [{
                 type: HostListener,
                 args: ['focusout']