@softpak/components 19.0.0-beta.1 → 19.0.0-beta.10

package/esm2022/spx-inputs/spx-input-radio.component.mjs

@@ -0,0 +1,129 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { SpxSuggestionComponent } from '@softpak/components/spx-suggestion';
+import { fromEvent } from 'rxjs';
+import { valuePairToValue } from '@softpak/components/spx-helpers';
+import * as i0 from "@angular/core";
+export class SpxInputRadioComponent {
+    constructor() {
+        this.cachedSuggestions = [];
+        this.focusPosition = 0;
+        this.spxFocused = false;
+        this.spxShowLabel = true;
+        this.spxReadonly = false;
+        this.spxSuggestions = [];
+        this.spxChange = new EventEmitter();
+        this.spxFocus = new EventEmitter();
+    }
+    spxFocusIn() {
+        this.listenToKeys();
+        this.determineFocusPosition();
+    }
+    spxFocusOut() {
+        this.subscriptionKeyDown?.unsubscribe();
+        this.subscriptionKeyUp?.unsubscribe();
+    }
+    ngOnChanges(changes) {
+        if ((changes['spxSuggestions'] && JSON.stringify(changes['spxSuggestions']?.previousValue) !== JSON.stringify(changes['spxSuggestions']?.currentValue))) {
+            this.cachedSuggestions = changes['spxSuggestions']?.currentValue ?? [];
+        }
+    }
+    handleSuggestionClick(event, valuePair) {
+        if (this.spxReadonly) {
+            console.log('spxInputRadio: clicked, but readonly');
+        }
+        else {
+            console.log('spxInputRadio: clicked');
+            this.select(valuePair);
+        }
+    }
+    determineFocusPosition() {
+        if (this.value && this.spxSuggestions?.length) {
+            const index = this.spxSuggestions.findIndex(valuePair => valuePairToValue(valuePair) === valuePairToValue(this.value));
+            this.focusPosition = index >= 0 ? index : 0;
+        }
+        else {
+            this.focusPosition = 0;
+        }
+    }
+    select(valuePair) {
+        this.focusPosition = 0;
+        this.value = valuePair;
+        this.spxChange.emit(valuePair);
+    }
+    listenToKeys() {
+        this.subscriptionKeyUp = fromEvent(window, 'keyup').subscribe((event) => {
+            if ((event.key === 'ArrowUp' || event.key === 'ArrowLeft') && this.focusPosition > 0) {
+                this.focusPosition = this.focusPosition - 1;
+                this.select(this.spxSuggestions.at(this.focusPosition));
+                event.preventDefault();
+            }
+            if ((event.key === 'ArrowDown' || event.key === 'ArrowRight') && this.focusPosition < this.spxSuggestions.length - 1) {
+                this.focusPosition = this.focusPosition + 1;
+                this.select(this.spxSuggestions.at(this.focusPosition));
+                event.preventDefault();
+            }
+        });
+        this.subscriptionKeyDown = fromEvent(window, 'keydown').subscribe((event) => {
+            if (event.key === 'ArrowDown' ||
+                event.key === 'ArrowLeft' ||
+                event.key === 'ArrowRight' ||
+                event.key === 'ArrowUp') {
+                event.preventDefault();
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxInputRadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxInputRadioComponent, isStandalone: true, selector: "spx-input-radio", inputs: { spxName: "spxName", spxValidators: "spxValidators", spxFocused: "spxFocused", spxShowLabel: "spxShowLabel", spxReadonly: "spxReadonly", spxSuggestions: "spxSuggestions", value: "value" }, outputs: { spxChange: "spxChange", spxFocus: "spxFocus" }, usesOnChanges: true, ngImport: i0, template: `<div class="grid grid-cols-2 gap-2" [class.mt-3]="this.spxShowLabel">
+        @for (valuePair of this.cachedSuggestions; track valuePair; let i = $index) {
+          <spx-suggestion
+            [spxDisabled]="this.spxReadonly"
+            [spxFocused]="this.spxFocused && i === this.focusPosition"
+            [spxSelected]="this.value?.value === valuePair?.value"
+            [spxTabbable]="this.focusPosition === i"
+            (click)="this.handleSuggestionClick($event, valuePair)">
+            {{valuePair?.description}}
+          </spx-suggestion>
+        }
+      </div>`, isInline: true, dependencies: [{ kind: "component", type: SpxSuggestionComponent, selector: "spx-suggestion", inputs: ["spxDisabled", "spxFocused", "spxSelected", "spxTabbable"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxInputRadioComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spx-input-radio',
+                    standalone: true,
+                    imports: [
+                        SpxSuggestionComponent
+                    ],
+                    template: `<div class="grid grid-cols-2 gap-2" [class.mt-3]="this.spxShowLabel">
+        @for (valuePair of this.cachedSuggestions; track valuePair; let i = $index) {
+          <spx-suggestion
+            [spxDisabled]="this.spxReadonly"
+            [spxFocused]="this.spxFocused && i === this.focusPosition"
+            [spxSelected]="this.value?.value === valuePair?.value"
+            [spxTabbable]="this.focusPosition === i"
+            (click)="this.handleSuggestionClick($event, valuePair)">
+            {{valuePair?.description}}
+          </spx-suggestion>
+        }
+      </div>`,
+                }]
+        }], propDecorators: { spxName: [{
+                type: Input
+            }], spxValidators: [{
+                type: Input
+            }], spxFocused: [{
+                type: Input
+            }], spxShowLabel: [{
+                type: Input
+            }], spxReadonly: [{
+                type: Input
+            }], spxSuggestions: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], spxChange: [{
+                type: Output
+            }], spxFocus: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3B4LWlucHV0LXJhZGlvLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NvZnRwYWsvY29tcG9uZW50cy9zcHgtaW5wdXRzL3NweC1pbnB1dC1yYWRpby5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFHdEYsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFDNUUsT0FBTyxFQUFnQixTQUFTLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDL0MsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0saUNBQWlDLENBQUM7O0FBcUJuRSxNQUFNLE9BQU8sc0JBQXNCO0lBbkJuQztRQW9CRSxzQkFBaUIsR0FBd0IsRUFBRSxDQUFDO1FBQ2xDLGtCQUFhLEdBQUcsQ0FBQyxDQUFDO1FBSW5CLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFDbkIsaUJBQVksR0FBRyxJQUFJLENBQUM7UUFDcEIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFDcEIsbUJBQWMsR0FBd0IsRUFBRSxDQUFDO1FBRXhDLGNBQVMsR0FBb0MsSUFBSSxZQUFZLEVBQXFCLENBQUM7UUFDbkYsYUFBUSxHQUF1QixJQUFJLFlBQVksRUFBUSxDQUFDO0tBbUVuRTtJQWhFQyxVQUFVO1FBQ1IsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1FBQ3BCLElBQUksQ0FBQyxzQkFBc0IsRUFBRSxDQUFDO0lBQ2hDLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLG1CQUFtQixFQUFFLFdBQVcsRUFBRSxDQUFDO1FBQ3hDLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxXQUFXLEVBQUUsQ0FBQztJQUN4QyxDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQ0UsQ0FBQyxPQUFP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QUMsbUJBQW1CLEdBQUcsU0FBUyxDQUFDLE1BQU0sRUFBRSxTQUFTLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxLQUFLLEVBQUUsRUFBRTtZQUMxRSxJQUFLLEtBQXVCLENBQUMsR0FBRyxLQUFLLFdBQVc7Z0JBQzdDLEtBQXVCLENBQUMsR0FBRyxLQUFLLFdBQVc7Z0JBQzNDLEtBQXVCLENBQUMsR0FBRyxLQUFLLFlBQVk7Z0JBQzVDLEtBQXVCLENBQUMsR0FBRyxLQUFLLFNBQVMsRUFBRSxDQUFDO2dCQUM3QyxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDekIsQ0FBQztRQUNILENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0E5RVUsc0JBQXNCO21HQUF0QixzQkFBc0IsaVdBYnZCOzs7Ozs7Ozs7OzthQVdDLDREQWJULHNCQUFzQjs7NEZBZWIsc0JBQXNCO2tCQW5CbEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsaUJBQWlCO29CQUMzQixVQUFVLEVBQUUsSUFBSTtvQkFDaEIsT0FBTyxFQUFFO3dCQUNQLHNCQUFzQjtxQkFDekI7b0JBQ0MsUUFBUSxFQUFFOzs7Ozs7Ozs7OzthQVdDO2lCQUNaOzhCQUtVLE9BQU87c0JBQWYsS0FBSztnQkFDRyxhQUFhO3NCQUFyQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNJLFNBQVM7c0JBQWxCLE1BQU07Z0JBQ0csUUFBUTtzQkFBakIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0LCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTcHhWYWx1ZVBhaXIgfSBmcm9tICcuL3NweC12YWx1ZS1pbnRlcmZhY2UnO1xuXG5pbXBvcnQgeyBTcHhTdWdnZXN0aW9uQ29tcG9uZW50IH0gZnJvbSAnQHNvZnRwYWsvY29tcG9uZW50cy9zcHgtc3VnZ2VzdGlvbic7XG5pbXBvcnQgeyBTdWJzY3JpcHRpb24sIGZyb21FdmVudCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgdmFsdWVQYWlyVG9WYWx1ZSB9IGZyb20gJ0Bzb2Z0cGFrL2NvbXBvbmVudHMvc3B4LWhlbHBlcnMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzcHgtaW5wdXQtcmFkaW8nLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXG4gICAgU3B4U3VnZ2VzdGlvbkNvbXBvbmVudFxuXSxcbiAgdGVtcGxhdGU6IGA8ZGl2IGNsYXNzPVwiZ3JpZCBncmlkLWNvbHMtMiBnYXAtMlwiIFtjbGFzcy5tdC0zXT1cInRoaXMuc3B4U2hvd0xhYmVsXCI+XG4gICAgICAgIEBmb3IgKHZhbHVlUGFpciBvZiB0aGlzLmNhY2hlZFN1Z2dlc3Rpb25zOyB0cmFjayB2YWx1ZVBhaXI7IGxldCBpID0gJGluZGV4KSB7XG4gICAgICAgICAgPHNweC1zdWdnZXN0aW9uXG4gICAgICAgICAgICBbc3B4RGlzYWJsZWRdPVwidGhpcy5zcHhSZWFkb25seVwiXG4gICAgICAgICAgICBbc3B4Rm9jdXNlZF09XCJ0aGlzLnNweEZvY3VzZWQgJiYgaSA9PT0gdGhpcy5mb2N1c1Bvc2l0aW9uXCJcbiAgICAgICAgICAgIFtzcHhTZWxlY3RlZF09XCJ0aGlzLnZhbHVlPy52YWx1ZSA9PT0gdmFsdWVQYWlyPy52YWx1ZVwiXG4gICAgICAgICAgICBbc3B4VGFiYmFibGVdPVwidGhpcy5mb2N1c1Bvc2l0aW9uID09PSBpXCJcbiAgICAgICAgICAgIChjbGljayk9XCJ0aGlzLmhhbmRsZVN1Z2dlc3Rpb25DbGljaygkZXZlbnQsIHZhbHVlUGFpcilcIj5cbiAgICAgICAgICAgIHt7dmFsdWVQYWlyPy5kZXNjcmlwdGlvbn19XG4gICAgICAgICAgPC9zcHgtc3VnZ2VzdGlvbj5cbiAgICAgICAgfVxuICAgICAgPC9kaXY+YCxcbn0pXG5leHBvcnQgY2xhc3MgU3B4SW5wdXRSYWRpb0NvbXBvbmVudCB7XG4gIGNhY2hlZFN1Z2dlc3Rpb25zOiBTcHhWYWx1ZVBhaXI8YW55PltdID0gW107XG4gIHByb3RlY3RlZCBmb2N1c1Bvc2l0aW9uID0gMDtcbiAgLy8gQEVsZW1lbnQoKSBlbCE6IEhUTUxFbGVtZW50O1xuICBASW5wdXQoKSBzcHhOYW1lPzogc3RyaW5nO1xuICBASW5wdXQoKSBzcHhWYWxpZGF0b3JzITogYW55W107XG4gIEBJbnB1dCgpIHNweEZvY3VzZWQgPSBmYWxzZTtcbiAgQElucHV0KCkgc3B4U2hvd0xhYmVsID0gdHJ1ZTtcbiAgQElucHV0KCkgc3B4UmVhZG9ubHkgPSBmYWxzZTtcbiAgQElucHV0KCkgc3B4U3VnZ2VzdGlvbnM6IFNweFZhbHVlUGFpcjxhbnk+W10gPSBbXTtcbiAgQElucHV0KCkgdmFsdWU/OiBTcHhWYWx1ZVBhaXI8YW55PjtcbiAgQE91dHB1dCgpIHNweENoYW5nZTogRXZlbnRFbWl0dGVyPFNweFZhbHVlUGFpcjxhbnk+PiA9IG5ldyBFdmVudEVtaXR0ZXI8U3B4VmFsdWVQYWlyPGFueT4+KCk7XG4gIEBPdXRwdXQoKSBzcHhGb2N1czogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuICBwcml2YXRlIHN1YnNjcmlwdGlvbktleVVwPzogU3Vic2NyaXB0aW9uO1xuICBwcml2YXRlIHN1YnNjcmlwdGlvbktleURvd24/OiBTdWJzY3JpcHRpb247XG4gIHNweEZvY3VzSW4oKSB7XG4gICAgdGhpcy5saXN0ZW5Ub0tleXMoKTtcbiAgICB0aGlzLmRldGVybWluZUZvY3VzUG9zaXRpb24oKTtcbiAgfVxuXG4gIHNweEZvY3VzT3V0KCkge1xuICAgIHRoaXMuc3Vic2NyaXB0aW9uS2V5RG93bj8udW5zdWJzY3JpYmUoKTtcbiAgICB0aGlzLnN1YnNjcmlwdGlvbktleVVwPy51bnN1YnNjcmliZSgpO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIGlmIChcbiAgICAgIChjaGFuZ2VzWydzcHhTdWdnZXN0aW9ucyddICYmIEpTT04uc3RyaW5naWZ5KGNoYW5nZXNbJ3NweFN1Z2dlc3Rpb25zJ10/LnByZXZpb3VzVmFsdWUpICE9PSBKU09OLnN0cmluZ2lmeShjaGFuZ2VzWydzcHhTdWdnZXN0aW9ucyddPy5jdXJyZW50VmFsdWUpKVxuICAgICkge1xuICAgICAgdGhpcy5jYWNoZWRTdWdnZXN0aW9ucyA9IGNoYW5nZXNbJ3NweFN1Z2dlc3Rpb25zJ10/LmN1cnJlbnRWYWx1ZSA/PyBbXTtcbiAgICB9XG4gIH1cblxuICBoYW5kbGVTdWdnZXN0aW9uQ2xpY2soZXZlbnQ6IEV2ZW50LCB2YWx1ZVBhaXI6IFNweFZhbHVlUGFpcjxhbnk+KSB7XG4gICAgaWYgKHRoaXMuc3B4UmVhZG9ubHkpIHtcbiAgICAgIGNvbnNvbGUubG9nKCdzcHhJbnB1dFJhZGlvOiBjbGlja2VkLCBidXQgcmVhZG9ubHknKTtcbiAgICB9IGVsc2Uge1xuICAgICAgY29uc29sZS5sb2coJ3NweElucHV0UmFkaW86IGNsaWNrZWQnKTtcbiAgICAgIHRoaXMuc2VsZWN0KHZhbHVlUGFpcik7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBkZXRlcm1pbmVGb2N1c1Bvc2l0aW9uKCkge1xuICAgIGlmICh0aGlzLnZhbHVlICYmIHRoaXMuc3B4U3VnZ2VzdGlvbnM/Lmxlbmd0aCkge1xuICAgICAgY29uc3QgaW5kZXggPSB0aGlzLnNweFN1Z2dlc3Rpb25zLmZpbmRJbmRleCh2YWx1ZVBhaXIgPT4gdmFsdWVQYWlyVG9WYWx1ZSh2YWx1ZVBhaXIpID09PSB2YWx1ZVBhaXJUb1ZhbHVlKHRoaXMudmFsdWUpKTtcbiAgICAgIHRoaXMuZm9jdXNQb3NpdGlvbiA9IGluZGV4ID49IDAgPyBpbmRleCA6IDA7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuZm9jdXNQb3NpdGlvbiA9IDA7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBzZWxlY3QodmFsdWVQYWlyOiBTcHhWYWx1ZVBhaXI8c3RyaW5nIHwgbnVtYmVyIHwgYm9vbGVhbj4pOiB2b2lkIHtcbiAgICB0aGlzLmZvY3VzUG9zaXRpb24gPSAwO1xuICAgIHRoaXMudmFsdWUgPSB2YWx1ZVBhaXI7XG4gICAgdGhpcy5zcHhDaGFuZ2UuZW1pdCh2YWx1ZVBhaXIpO1xuICB9XG5cbiAgcHJpdmF0ZSBsaXN0ZW5Ub0tleXMoKTogdm9pZCB7XG4gICAgdGhpcy5zdWJzY3JpcHRpb25LZXlVcCA9IGZyb21FdmVudCh3aW5kb3csICdrZXl1cCcpLnN1YnNjcmliZSgoZXZlbnQpID0+IHtcbiAgICAgIGlmICgoKGV2ZW50IGFzIEtleWJvYXJkRXZlbnQpLmtleSA9PT0gJ0Fycm93VXAnIHx8IChldmVudCBhcyBLZXlib2FyZEV2ZW50KS5rZXkgPT09ICdBcnJvd0xlZnQnKSAmJiB0aGlzLmZvY3VzUG9zaXRpb24gPiAwKSB7XG4gICAgICAgIHRoaXMuZm9jdXNQb3NpdGlvbiA9IHRoaXMuZm9jdXNQb3NpdGlvbiAtIDE7XG4gICAgICAgIHRoaXMuc2VsZWN0KHRoaXMuc3B4U3VnZ2VzdGlvbnMuYXQodGhpcy5mb2N1c1Bvc2l0aW9uKSEpO1xuICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgfVxuICAgICAgaWYgKCgoZXZlbnQgYXMgS2V5Ym9hcmRFdmVudCkua2V5ID09PSAnQXJyb3dEb3duJyB8fCAoZXZlbnQgYXMgS2V5Ym9hcmRFdmVudCkua2V5ID09PSAnQXJyb3dSaWdodCcpICYmIHRoaXMuZm9jdXNQb3NpdGlvbiA8IHRoaXMuc3B4U3VnZ2VzdGlvbnMubGVuZ3RoIC0gMSkge1xuICAgICAgICB0aGlzLmZvY3VzUG9zaXRpb24gPSB0aGlzLmZvY3VzUG9zaXRpb24gKyAxO1xuICAgICAgICB0aGlzLnNlbGVjdCh0aGlzLnNweFN1Z2dlc3Rpb25zLmF0KHRoaXMuZm9jdXNQb3NpdGlvbikhKTtcbiAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIH1cbiAgICB9KTtcbiAgICB0aGlzLnN1YnNjcmlwdGlvbktleURvd24gPSBmcm9tRXZlbnQod2luZG93LCAna2V5ZG93bicpLnN1YnNjcmliZSgoZXZlbnQpID0+IHtcbiAgICAgIGlmICgoZXZlbnQgYXMgS2V5Ym9hcmRFdmVudCkua2V5ID09PSAnQXJyb3dEb3duJyB8fFxuICAgICAgICAoZXZlbnQgYXMgS2V5Ym9hcmRFdmVudCkua2V5ID09PSAnQXJyb3dMZWZ0JyB8fFxuICAgICAgICAoZXZlbnQgYXMgS2V5Ym9hcmRFdmVudCkua2V5ID09PSAnQXJyb3dSaWdodCcgfHxcbiAgICAgICAgKGV2ZW50IGFzIEtleWJvYXJkRXZlbnQpLmtleSA9PT0gJ0Fycm93VXAnKSB7XG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cbn0iXX0=

package/esm2022/spx-inputs/spx-input-text.component.mjs

@@ -0,0 +1,160 @@
+import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
+import { SpxDropdownComponent } from './spx-dropdown.component';
+import * as i0 from "@angular/core";
+export class SpxInputTextComponent {
+    constructor() {
+        this.spxAutofocus = false;
+        this.spxSuggestions = [];
+        this.spxReadonly = false;
+        this.spxCapitalize = false;
+        this.spxFocused = true;
+        this.spxType = 'text';
+        this.spxBlurFromChild = new EventEmitter();
+        this.spxChange = new EventEmitter();
+        this.spxFocus = new EventEmitter();
+        this.spxWasInternalUpdate = false;
+    }
+    spxSetFocus() {
+        this.inputRef?.nativeElement?.focus();
+    }
+    componentDidLoad() {
+        if (this.spxAutofocus) {
+            this.spxFocus.emit();
+            this.spxSetFocus();
+        }
+    }
+    handleBlur() {
+        this.spxBlurFromChild.emit();
+    }
+    handleFocus() {
+        this.spxFocus.emit();
+    }
+    handleDescriptionInput(event) {
+        this.value = {
+            description: event.target ? event.target.value : null,
+            value: event.target ? event.target.value : null,
+        };
+        this.spxChange.emit(this.value);
+    }
+    handleSuggestionClick(value) {
+        if (!this.spxReadonly) {
+            this.value = value;
+            this.spxChange.emit(this.value);
+            this.spxFocused = false;
+        }
+    }
+    handleKeyUp() {
+        this.spxFocused = true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxInputTextComponent, isStandalone: true, selector: "spx-input-text", inputs: { spxName: "spxName", spxAutofocus: "spxAutofocus", spxAutocomplete: "spxAutocomplete", spxInputMode: "spxInputMode", spxPattern: "spxPattern", spxSuggestions: "spxSuggestions", spxReadonly: "spxReadonly", spxValidators: "spxValidators", spxCapitalize: "spxCapitalize", spxFocused: "spxFocused", spxType: "spxType", value: "value", spxWasInternalUpdate: "spxWasInternalUpdate" }, outputs: { spxBlurFromChild: "spxBlurFromChild", spxChange: "spxChange", spxFocus: "spxFocus" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: `<div class="relative text-black">
+    <input
+      #input
+      class="font-bold text-lg w-full outline-none"
+      autocomplete="off"
+      spellcheck="false"
+      [class.bg-white]="!this.spxReadonly"
+      [class.bg-gray-300]="this.spxReadonly"
+      [class.cursor-not-allowed]="this.spxReadonly"
+      [class.uppercase]="this.spxCapitalize"
+      [attr.autocomplete]="this.spxAutocomplete ? this.spxAutocomplete : undefined"
+      [attr.autofocus]="this.spxAutofocus ? this.spxAutofocus : undefined"
+      [attr.disabled]="this.spxReadonly ? this.spxReadonly : undefined"
+      [attr.inputMode]="this.spxInputMode ? this.spxInputMode : undefined"
+      [attr.pattern]="this.spxPattern ? this.spxPattern : undefined"
+      [attr.name]="this.spxName"
+      [attr.type]="this.spxType"
+      [value]="this.value?.description ? this.value?.description : this.value?.value"
+      (blur)="this.handleBlur()"
+      (keyUp)="this.handleKeyUp()"
+      (focus)="this.handleFocus()"
+      (input)="this.handleDescriptionInput($event)"
+      />
+    @if (this.value?.description && this.value?.value && this.value?.description?.valueOf() !== this.value?.value?.valueOf()) {
+      <span>{{this.value?.value}}</span>
+    }
+    @if (this.spxFocused && (this.spxType === 'overlay' || this.spxType === 'overlaynumber')) {
+      <spx-dropdown
+        [spxSuggestions]="this.spxSuggestions" (spxSelect)="this.handleSuggestionClick($event)">
+      </spx-dropdown>
+    }
+  </div>`, isInline: true, dependencies: [{ kind: "component", type: SpxDropdownComponent, selector: "spx-dropdown", inputs: ["spxSuggestions"], outputs: ["spxSelect"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxInputTextComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spx-input-text',
+                    standalone: true,
+                    imports: [
+                        SpxDropdownComponent
+                    ],
+                    template: `<div class="relative text-black">
+    <input
+      #input
+      class="font-bold text-lg w-full outline-none"
+      autocomplete="off"
+      spellcheck="false"
+      [class.bg-white]="!this.spxReadonly"
+      [class.bg-gray-300]="this.spxReadonly"
+      [class.cursor-not-allowed]="this.spxReadonly"
+      [class.uppercase]="this.spxCapitalize"
+      [attr.autocomplete]="this.spxAutocomplete ? this.spxAutocomplete : undefined"
+      [attr.autofocus]="this.spxAutofocus ? this.spxAutofocus : undefined"
+      [attr.disabled]="this.spxReadonly ? this.spxReadonly : undefined"
+      [attr.inputMode]="this.spxInputMode ? this.spxInputMode : undefined"
+      [attr.pattern]="this.spxPattern ? this.spxPattern : undefined"
+      [attr.name]="this.spxName"
+      [attr.type]="this.spxType"
+      [value]="this.value?.description ? this.value?.description : this.value?.value"
+      (blur)="this.handleBlur()"
+      (keyUp)="this.handleKeyUp()"
+      (focus)="this.handleFocus()"
+      (input)="this.handleDescriptionInput($event)"
+      />
+    @if (this.value?.description && this.value?.value && this.value?.description?.valueOf() !== this.value?.value?.valueOf()) {
+      <span>{{this.value?.value}}</span>
+    }
+    @if (this.spxFocused && (this.spxType === 'overlay' || this.spxType === 'overlaynumber')) {
+      <spx-dropdown
+        [spxSuggestions]="this.spxSuggestions" (spxSelect)="this.handleSuggestionClick($event)">
+      </spx-dropdown>
+    }
+  </div>`,
+                }]
+        }], propDecorators: { spxName: [{
+                type: Input
+            }], spxAutofocus: [{
+                type: Input
+            }], spxAutocomplete: [{
+                type: Input
+            }], spxInputMode: [{
+                type: Input
+            }], spxPattern: [{
+                type: Input
+            }], spxSuggestions: [{
+                type: Input
+            }], spxReadonly: [{
+                type: Input
+            }], spxValidators: [{
+                type: Input
+            }], spxCapitalize: [{
+                type: Input
+            }], spxFocused: [{
+                type: Input
+            }], spxType: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], spxBlurFromChild: [{
+                type: Output
+            }], spxChange: [{
+                type: Output
+            }], spxFocus: [{
+                type: Output
+            }], spxWasInternalUpdate: [{
+                type: Input
+            }], inputRef: [{
+                type: ViewChild,
+                args: ['input', { static: true }]
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3B4LWlucHV0LXRleHQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc29mdHBhay9jb21wb25lbnRzL3NweC1pbnB1dHMvc3B4LWlucHV0LXRleHQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxTQUFTLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRTlGLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLDBCQUEwQixDQUFDOztBQXlDaEUsTUFBTSxPQUFPLHFCQUFxQjtJQXZDbEM7UUEyQ1csaUJBQVksR0FBRyxLQUFLLENBQUM7UUFJckIsbUJBQWMsR0FBOEMsRUFBRSxDQUFDO1FBQy9ELGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBRXBCLGtCQUFhLEdBQUcsS0FBSyxDQUFDO1FBQ3RCLGVBQVUsR0FBRyxJQUFJLENBQUM7UUFDbEIsWUFBTyxHQUF1RSxNQUFNLENBQUM7UUFFcEYscUJBQWdCLEdBQXVCLElBQUksWUFBWSxFQUFRLENBQUM7UUFDaEUsY0FBUyxHQUFvQyxJQUFJLFlBQVksRUFBcUIsQ0FBQztRQUNuRixhQUFRLEdBQXVCLElBQUksWUFBWSxFQUFRLENBQUM7UUFDekQseUJBQW9CLEdBQUcsS0FBSyxDQUFDO0tBMEN2QztJQXRDQyxXQUFXO1FBQ1QsSUFBSSxDQUFDLFFBQVEsRUFBRSxhQUFhLEVBQUUsS0FBSyxFQUFFLENBQUM7SUFDeEMsQ0FBQztJQUVELGdCQUFnQjtRQUNkLElBQUksSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1lBQ3RCLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7WUFDckIsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ3JCLENBQUM7SUFDSCxDQUFDO0lBRUQsVUFBVTtRQUNSLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUMvQixDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDdkIsQ0FBQztJQUVELHNCQUFzQixDQUFDLEtBQVU7UUFDL0IsSUFBSSxDQUFDLEtBQUssR0FBRztZQUNYLFdBQVcsRUFBRSxLQUFLLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsSUFBSTtZQUNyRCxLQUFLLEVBQUUsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLElBQUk7U0FDaEQsQ0FBQztRQUNGLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNsQyxDQUFDO0lBRUQscUJBQXFCLENBQUMsS0FBVTtRQUM5QixJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1lBQ3RCLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO1lBQ25CLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUNoQyxJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztRQUMxQixDQUFDO0lBQ0gsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQztJQUN6QixDQUFDOytHQTNEVSxxQkFBcUI7bUdBQXJCLHFCQUFxQixncUJBakN0Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztTQStCSCw0REFqQ0wsb0JBQW9COzs0RkFtQ1gscUJBQXFCO2tCQXZDakMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZ0JBQWdCO29CQUMxQixVQUFVLEVBQUUsSUFBSTtvQkFDaEIsT0FBTyxFQUFFO3dCQUNQLG9CQUFvQjtxQkFDdkI7b0JBQ0MsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O1NBK0JIO2lCQUNSOzhCQUlVLE9BQU87c0JBQWYsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxhQUFhO3NCQUFyQixLQUFLO2dCQUNHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNJLGdCQUFnQjtzQkFBekIsTUFBTTtnQkFDRyxTQUFTO3NCQUFsQixNQUFNO2dCQUNHLFFBQVE7c0JBQWpCLE1BQU07Z0JBQ0Usb0JBQW9CO3NCQUE1QixLQUFLO2dCQUNnQyxRQUFRO3NCQUE3QyxTQUFTO3VCQUFDLE9BQU8sRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJcbmltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0LCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNweFZhbHVlUGFpciB9IGZyb20gJy4vc3B4LXZhbHVlLWludGVyZmFjZSc7XG5pbXBvcnQgeyBTcHhEcm9wZG93bkNvbXBvbmVudCB9IGZyb20gJy4vc3B4LWRyb3Bkb3duLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NweC1pbnB1dC10ZXh0JyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW1xuICAgIFNweERyb3Bkb3duQ29tcG9uZW50XG5dLFxuICB0ZW1wbGF0ZTogYDxkaXYgY2xhc3M9XCJyZWxhdGl2ZSB0ZXh0LWJsYWNrXCI+XG4gICAgPGlucHV0XG4gICAgICAjaW5wdXRcbiAgICAgIGNsYXNzPVwiZm9udC1ib2xkIHRleHQtbGcgdy1mdWxsIG91dGxpbmUtbm9uZVwiXG4gICAgICBhdXRvY29tcGxldGU9XCJvZmZcIlxuICAgICAgc3BlbGxjaGVjaz1cImZhbHNlXCJcbiAgICAgIFtjbGFzcy5iZy13aGl0ZV09XCIhdGhpcy5zcHhSZWFkb25seVwiXG4gICAgICBbY2xhc3MuYmctZ3JheS0zMDBdPVwidGhpcy5zcHhSZWFkb25seVwiXG4gICAgICBbY2xhc3MuY3Vyc29yLW5vdC1hbGxvd2VkXT1cInRoaXMuc3B4UmVhZG9ubHlcIlxuICAgICAgW2NsYXNzLnVwcGVyY2FzZV09XCJ0aGlzLnNweENhcGl0YWxpemVcIlxuICAgICAgW2F0dHIuYXV0b2NvbXBsZXRlXT1cInRoaXMuc3B4QXV0b2NvbXBsZXRlID8gdGhpcy5zcHhBdXRvY29tcGxldGUgOiB1bmRlZmluZWRcIlxuICAgICAgW2F0dHIuYXV0b2ZvY3VzXT1cInRoaXMuc3B4QXV0b2ZvY3VzID8gdGhpcy5zcHhBdXRvZm9jdXMgOiB1bmRlZmluZWRcIlxuICAgICAgW2F0dHIuZGlzYWJsZWRdPVwidGhpcy5zcHhSZWFkb25seSA/IHRoaXMuc3B4UmVhZG9ubHkgOiB1bmRlZmluZWRcIlxuICAgICAgW2F0dHIuaW5wdXRNb2RlXT1cInRoaXMuc3B4SW5wdXRNb2RlID8gdGhpcy5zcHhJbnB1dE1vZGUgOiB1bmRlZmluZWRcIlxuICAgICAgW2F0dHIucGF0dGVybl09XCJ0aGlzLnNweFBhdHRlcm4gPyB0aGlzLnNweFBhdHRlcm4gOiB1bmRlZmluZWRcIlxuICAgICAgW2F0dHIubmFtZV09XCJ0aGlzLnNweE5hbWVcIlxuICAgICAgW2F0dHIudHlwZV09XCJ0aGlzLnNweFR5cGVcIlxuICAgICAgW3ZhbHVlXT1cInRoaXMudmFsdWU/LmRlc2NyaXB0aW9uID8gdGhpcy52YWx1ZT8uZGVzY3JpcHRpb24gOiB0aGlzLnZhbHVlPy52YWx1ZVwiXG4gICAgICAoYmx1cik9XCJ0aGlzLmhhbmRsZUJsdXIoKVwiXG4gICAgICAoa2V5VXApPVwidGhpcy5oYW5kbGVLZXlVcCgpXCJcbiAgICAgIChmb2N1cyk9XCJ0aGlzLmhhbmRsZUZvY3VzKClcIlxuICAgICAgKGlucHV0KT1cInRoaXMuaGFuZGxlRGVzY3JpcHRpb25JbnB1dCgkZXZlbnQpXCJcbiAgICAgIC8+XG4gICAgQGlmICh0aGlzLnZhbHVlPy5kZXNjcmlwdGlvbiAmJiB0aGlzLnZhbHVlPy52YWx1ZSAmJiB0aGlzLnZhbHVlPy5kZXNjcmlwdGlvbj8udmFsdWVPZigpICE9PSB0aGlzLnZhbHVlPy52YWx1ZT8udmFsdWVPZigpKSB7XG4gICAgICA8c3Bhbj57e3RoaXMudmFsdWU/LnZhbHVlfX08L3NwYW4+XG4gICAgfVxuICAgIEBpZiAodGhpcy5zcHhGb2N1c2VkICYmICh0aGlzLnNweFR5cGUgPT09ICdvdmVybGF5JyB8fCB0aGlzLnNweFR5cGUgPT09ICdvdmVybGF5bnVtYmVyJykpIHtcbiAgICAgIDxzcHgtZHJvcGRvd25cbiAgICAgICAgW3NweFN1Z2dlc3Rpb25zXT1cInRoaXMuc3B4U3VnZ2VzdGlvbnNcIiAoc3B4U2VsZWN0KT1cInRoaXMuaGFuZGxlU3VnZ2VzdGlvbkNsaWNrKCRldmVudClcIj5cbiAgICAgIDwvc3B4LWRyb3Bkb3duPlxuICAgIH1cbiAgPC9kaXY+YCxcbn0pXG5leHBvcnQgY2xhc3MgU3B4SW5wdXRUZXh0Q29tcG9uZW50IHtcbiAgLy8gcHJpdmF0ZSBlbElucHV0PzogSFRNTEVsZW1lbnQ7XG4gIC8vIEBFbGVtZW50KCkgZWwhOiBIVE1MRWxlbWVudDtcbiAgQElucHV0KCkgc3B4TmFtZT86IHN0cmluZztcbiAgQElucHV0KCkgc3B4QXV0b2ZvY3VzID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNweEF1dG9jb21wbGV0ZT86IHN0cmluZztcbiAgQElucHV0KCkgc3B4SW5wdXRNb2RlPzogc3RyaW5nO1xuICBASW5wdXQoKSBzcHhQYXR0ZXJuPzogc3RyaW5nO1xuICBASW5wdXQoKSBzcHhTdWdnZXN0aW9uczogU3B4VmFsdWVQYWlyPGJvb2xlYW4gfCBudW1iZXIgfCBzdHJpbmc+W10gPSBbXTtcbiAgQElucHV0KCkgc3B4UmVhZG9ubHkgPSBmYWxzZTtcbiAgQElucHV0KCkgc3B4VmFsaWRhdG9ycz86IGFueVtdO1xuICBASW5wdXQoKSBzcHhDYXBpdGFsaXplID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNweEZvY3VzZWQgPSB0cnVlO1xuICBASW5wdXQoKSBzcHhUeXBlOiAnYXV0b2NvbXBsZXRlJyB8ICdvdmVybGF5JyB8ICdvdmVybGF5bnVtYmVyJyB8ICd0ZXh0JyB8ICdwYXNzd29yZCcgPSAndGV4dCc7XG4gIEBJbnB1dCgpIHZhbHVlPzogU3B4VmFsdWVQYWlyPGFueT47XG4gIEBPdXRwdXQoKSBzcHhCbHVyRnJvbUNoaWxkOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG4gIEBPdXRwdXQoKSBzcHhDaGFuZ2U6IEV2ZW50RW1pdHRlcjxTcHhWYWx1ZVBhaXI8YW55Pj4gPSBuZXcgRXZlbnRFbWl0dGVyPFNweFZhbHVlUGFpcjxhbnk+PigpO1xuICBAT3V0cHV0KCkgc3B4Rm9jdXM6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcbiAgQElucHV0KCkgc3B4V2FzSW50ZXJuYWxVcGRhdGUgPSBmYWxzZTtcbiAgQFZpZXdDaGlsZCgnaW5wdXQnLCB7IHN0YXRpYzogdHJ1ZSB9KSBpbnB1dFJlZj86IEVsZW1lbnRSZWY8SFRNTElucHV0RWxlbWVudD47XG4gIFxuICBcbiAgc3B4U2V0Rm9jdXMoKSB7XG4gICAgdGhpcy5pbnB1dFJlZj8ubmF0aXZlRWxlbWVudD8uZm9jdXMoKTtcbiAgfVxuXG4gIGNvbXBvbmVudERpZExvYWQoKSB7XG4gICAgaWYgKHRoaXMuc3B4QXV0b2ZvY3VzKSB7XG4gICAgICB0aGlzLnNweEZvY3VzLmVtaXQoKTtcbiAgICAgIHRoaXMuc3B4U2V0Rm9jdXMoKTtcbiAgICB9XG4gIH1cblxuICBoYW5kbGVCbHVyKCkge1xuICAgIHRoaXMuc3B4Qmx1ckZyb21DaGlsZC5lbWl0KCk7XG4gIH1cblxuICBoYW5kbGVGb2N1cygpIHtcbiAgICB0aGlzLnNweEZvY3VzLmVtaXQoKTtcbiAgfVxuXG4gIGhhbmRsZURlc2NyaXB0aW9uSW5wdXQoZXZlbnQ6IGFueSkge1xuICAgIHRoaXMudmFsdWUgPSB7XG4gICAgICBkZXNjcmlwdGlvbjogZXZlbnQudGFyZ2V0ID8gZXZlbnQudGFyZ2V0LnZhbHVlIDogbnVsbCxcbiAgICAgIHZhbHVlOiBldmVudC50YXJnZXQgPyBldmVudC50YXJnZXQudmFsdWUgOiBudWxsLFxuICAgIH07XG4gICAgdGhpcy5zcHhDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcbiAgfVxuXG4gIGhhbmRsZVN1Z2dlc3Rpb25DbGljayh2YWx1ZTogYW55KSB7XG4gICAgaWYgKCF0aGlzLnNweFJlYWRvbmx5KSB7XG4gICAgICB0aGlzLnZhbHVlID0gdmFsdWU7XG4gICAgICB0aGlzLnNweENoYW5nZS5lbWl0KHRoaXMudmFsdWUpO1xuICAgICAgdGhpcy5zcHhGb2N1c2VkID0gZmFsc2U7XG4gICAgfVxuICB9XG5cbiAgaGFuZGxlS2V5VXAoKSB7XG4gICAgdGhpcy5zcHhGb2N1c2VkID0gdHJ1ZTtcbiAgfVxufVxuIl19

package/esm2022/spx-inputs/spx-input-time-modal.component.mjs

@@ -0,0 +1,131 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { SpxButtonComponent } from '@softpak/components/spx-button';
+import { SpxSeverityEnum } from '@softpak/components/spx-helpers';
+import { faXmark } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { IonButtons, IonContent, IonHeader, IonTitle, IonToolbar } from '@ionic/angular/standalone';
+import * as i0 from "@angular/core";
+import * as i1 from "@ionic/angular/standalone";
+import * as i2 from "@fortawesome/angular-fontawesome";
+export class SpxInputTimeModalComponent {
+    constructor(modalController) {
+        this.modalController = modalController;
+        this.change = new EventEmitter();
+        this.faXmark = faXmark;
+        this.hourOptions = Array.from({ length: 24 }, (_, i) => i); // 0 to 23
+        this.minuteOptions = Array.from({ length: 12 }, (_, i) => i * 5); // Minutes in incrementen van 5
+        this.typeError = SpxSeverityEnum.error;
+        this.hourOptions.push(this.hourOptions.shift());
+        this.minuteOptions.push(this.minuteOptions.shift());
+    }
+    closeDialog() {
+        this.modalController.dismiss();
+    }
+    onChange(value) {
+        this.change.emit(value);
+        console.log(value);
+        this.modalController.dismiss(value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxInputTimeModalComponent, deps: [{ token: i1.ModalController }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxInputTimeModalComponent, isStandalone: true, selector: "spx-input-time-modal", inputs: { view: "view", value: "value" }, outputs: { change: "change" }, ngImport: i0, template: `<ion-header>
+    <ion-toolbar>
+      <ion-title>Select {{view}}</ion-title>
+      <ion-buttons slot="end">
+        <spx-button [spxSeverity]="typeError" (spxClick)="closeDialog()">
+          <fa-icon [icon]="faXmark"></fa-icon>
+        </spx-button>
+      </ion-buttons>
+    </ion-toolbar>
+  </ion-header>
+  <ion-content class="ion-padding bg-white">
+    <!-- Uren -->
+    <div class="custom-bg grid grid-cols-1 gap-3">
+      @if (view === 'hours') {
+        <div class="flex-wrap gap-2">
+          <div class="grid grid-cols-3 md:grid-cols-4 gap-3">
+            @for (hour of hourOptions; track hour) {
+              <div  class="text-center font-bold custom-square rounded text-gray-900 text-lg p-3 w-full truncate outline-none bg-sky-100 focus:ring-sky-300 hover:bg-sky-300 active:bg-sky-300" [class.selected]="value === hour" (click)="onChange(hour)">
+                {{ hour }}
+              </div>
+            }
+          </div>
+        </div>
+      }
+      <!-- Minuten -->
+      @if (view === 'minutes') {
+        <div class="grid grid-cols-1 gap-3">
+          <div class="grid grid-cols-4 md:grid-cols-5 gap-3">
+            @for (minute of minuteOptions; track minute) {
+              <div class="text-center font-bold custom-square rounded text-gray-900 text-lg p-3 w-ful truncate outline-none bg-sky-100 focus:ring-sky-300 hover:bg-sky-300 active:bg-sky-300" [class.selected]="value === minute" (click)="onChange(minute)">
+                {{ minute }}
+              </div>
+            }
+          </div>
+        </div>
+      }
+    </div>
+  </ion-content>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { 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: IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { 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: "18.2.13", ngImport: i0, type: SpxInputTimeModalComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'spx-input-time-modal',
+                    standalone: true,
+                    imports: [
+                        FontAwesomeModule,
+                        IonButtons,
+                        IonContent,
+                        IonHeader,
+                        IonTitle,
+                        IonToolbar,
+                        SpxButtonComponent,
+                    ],
+                    template: `<ion-header>
+    <ion-toolbar>
+      <ion-title>Select {{view}}</ion-title>
+      <ion-buttons slot="end">
+        <spx-button [spxSeverity]="typeError" (spxClick)="closeDialog()">
+          <fa-icon [icon]="faXmark"></fa-icon>
+        </spx-button>
+      </ion-buttons>
+    </ion-toolbar>
+  </ion-header>
+  <ion-content class="ion-padding bg-white">
+    <!-- Uren -->
+    <div class="custom-bg grid grid-cols-1 gap-3">
+      @if (view === 'hours') {
+        <div class="flex-wrap gap-2">
+          <div class="grid grid-cols-3 md:grid-cols-4 gap-3">
+            @for (hour of hourOptions; track hour) {
+              <div  class="text-center font-bold custom-square rounded text-gray-900 text-lg p-3 w-full truncate outline-none bg-sky-100 focus:ring-sky-300 hover:bg-sky-300 active:bg-sky-300" [class.selected]="value === hour" (click)="onChange(hour)">
+                {{ hour }}
+              </div>
+            }
+          </div>
+        </div>
+      }
+      <!-- Minuten -->
+      @if (view === 'minutes') {
+        <div class="grid grid-cols-1 gap-3">
+          <div class="grid grid-cols-4 md:grid-cols-5 gap-3">
+            @for (minute of minuteOptions; track minute) {
+              <div class="text-center font-bold custom-square rounded text-gray-900 text-lg p-3 w-ful truncate outline-none bg-sky-100 focus:ring-sky-300 hover:bg-sky-300 active:bg-sky-300" [class.selected]="value === minute" (click)="onChange(minute)">
+                {{ minute }}
+              </div>
+            }
+          </div>
+        </div>
+      }
+    </div>
+  </ion-content>
+  `,
+                }]
+        }], ctorParameters: () => [{ type: i1.ModalController }], propDecorators: { view: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], change: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3B4LWlucHV0LXRpbWUtbW9kYWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc29mdHBhay9jb21wb25lbnRzL3NweC1pbnB1dHMvc3B4LWlucHV0LXRpbWUtbW9kYWwuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDcEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQUM1RCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNyRSxPQUFPLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLFVBQVUsRUFBbUIsTUFBTSwyQkFBMkIsQ0FBQzs7OztBQXNEckgsTUFBTSxPQUFPLDBCQUEwQjtJQVVyQyxZQUFvQixlQUFnQztRQUFoQyxvQkFBZSxHQUFmLGVBQWUsQ0FBaUI7UUFQMUMsV0FBTSxHQUF5QixJQUFJLFlBQVksRUFBVSxDQUFDO1FBRXBFLFlBQU8sR0FBRyxPQUFPLENBQUE7UUFDakIsZ0JBQVcsR0FBRyxLQUFLLENBQUMsSUFBSSxDQUFDLEVBQUUsTUFBTSxFQUFFLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxFQUFFLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxVQUFVO1FBQ2pFLGtCQUFhLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxFQUFFLE1BQU0sRUFBRSxFQUFFLEVBQUUsRUFBRSxDQUFDLENBQUMsRUFBRSxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLCtCQUErQjtRQUM1RixjQUFTLEdBQUcsZUFBZSxDQUFDLEtBQUssQ0FBQztRQUdoQyxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssRUFBRyxDQUFDLENBQUM7UUFDakQsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxLQUFLLEVBQUcsQ0FBQyxDQUFDO0lBQ3ZELENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLGVBQWUsQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQUNqQyxDQUFDO0lBRUQsUUFBUSxDQUFDLEtBQWE7UUFDcEIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNuQixJQUFJLENBQUMsZUFBZSxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUN0QyxDQUFDOytHQXZCVSwwQkFBMEI7bUdBQTFCLDBCQUEwQix5SkF4QzNCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXNDVCwyREE5Q0MsaUJBQWlCLDZQQUNqQixVQUFVLDhFQUNWLFVBQVUsd0tBQ1YsU0FBUyxvR0FDVCxRQUFRLGlGQUNSLFVBQVUsbUZBQ1Ysa0JBQWtCOzs0RkEwQ1QsMEJBQTBCO2tCQXBEdEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxVQUFVLEVBQUUsSUFBSTtvQkFDaEIsT0FBTyxFQUFFO3dCQUNQLGlCQUFpQjt3QkFDakIsVUFBVTt3QkFDVixVQUFVO3dCQUNWLFNBQVM7d0JBQ1QsUUFBUTt3QkFDUixVQUFVO3dCQUNWLGtCQUFrQjtxQkFDckI7b0JBQ0MsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXNDVDtpQkFDRjtvRkFFVSxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNJLE1BQU07c0JBQWYsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbIlxuaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNweEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gJ0Bzb2Z0cGFrL2NvbXBvbmVudHMvc3B4LWJ1dHRvbic7XG5pbXBvcnQgeyBTcHhTZXZlcml0eUVudW0gfSBmcm9tICdAc29mdHBhay9jb21wb25lbnRzL3NweC1oZWxwZXJzJztcbmltcG9ydCB7IGZhWG1hcmsgfSBmcm9tICdAZm9ydGF3ZXNvbWUvZnJlZS1zb2xpZC1zdmctaWNvbnMnO1xuaW1wb3J0IHsgRm9udEF3ZXNvbWVNb2R1bGUgfSBmcm9tICdAZm9ydGF3ZXNvbWUvYW5ndWxhci1mb250YXdlc29tZSc7XG5pbXBvcnQgeyBJb25CdXR0b25zLCBJb25Db250ZW50LCBJb25IZWFkZXIsIElvblRpdGxlLCBJb25Ub29sYmFyLCBNb2RhbENvbnRyb2xsZXIgfSBmcm9tICdAaW9uaWMvYW5ndWxhci9zdGFuZGFsb25lJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3B4LWlucHV0LXRpbWUtbW9kYWwnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXG4gICAgRm9udEF3ZXNvbWVNb2R1bGUsXG4gICAgSW9uQnV0dG9ucyxcbiAgICBJb25Db250ZW50LFxuICAgIElvbkhlYWRlcixcbiAgICBJb25UaXRsZSxcbiAgICBJb25Ub29sYmFyLFxuICAgIFNweEJ1dHRvbkNvbXBvbmVudCxcbl0sXG4gIHRlbXBsYXRlOiBgPGlvbi1oZWFkZXI+XG4gICAgPGlvbi10b29sYmFyPlxuICAgICAgPGlvbi10aXRsZT5TZWxlY3Qge3t2aWV3fX08L2lvbi10aXRsZT5cbiAgICAgIDxpb24tYnV0dG9ucyBzbG90PVwiZW5kXCI+XG4gICAgICAgIDxzcHgtYnV0dG9uIFtzcHhTZXZlcml0eV09XCJ0eXBlRXJyb3JcIiAoc3B4Q2xpY2spPVwiY2xvc2VEaWFsb2coKVwiPlxuICAgICAgICAgIDxmYS1pY29uIFtpY29uXT1cImZhWG1hcmtcIj48L2ZhLWljb24+XG4gICAgICAgIDwvc3B4LWJ1dHRvbj5cbiAgICAgIDwvaW9uLWJ1dHRvbnM+XG4gICAgPC9pb24tdG9vbGJhcj5cbiAgPC9pb24taGVhZGVyPlxuICA8aW9uLWNvbnRlbnQgY2xhc3M9XCJpb24tcGFkZGluZyBiZy13aGl0ZVwiPlxuICAgIDwhLS0gVXJlbiAtLT5cbiAgICA8ZGl2IGNsYXNzPVwiY3VzdG9tLWJnIGdyaWQgZ3JpZC1jb2xzLTEgZ2FwLTNcIj5cbiAgICAgIEBpZiAodmlldyA9PT0gJ2hvdXJzJykge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleC13cmFwIGdhcC0yXCI+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cImdyaWQgZ3JpZC1jb2xzLTMgbWQ6Z3JpZC1jb2xzLTQgZ2FwLTNcIj5cbiAgICAgICAgICAgIEBmb3IgKGhvdXIgb2YgaG91ck9wdGlvbnM7IHRyYWNrIGhvdXIpIHtcbiAgICAgICAgICAgICAgPGRpdiAgY2xhc3M9XCJ0ZXh0LWNlbnRlciBmb250LWJvbGQgY3VzdG9tLXNxdWFyZSByb3VuZGVkIHRleHQtZ3JheS05MDAgdGV4dC1sZyBwLTMgdy1mdWxsIHRydW5jYXRlIG91dGxpbmUtbm9uZSBiZy1za3ktMTAwIGZvY3VzOnJpbmctc2t5LTMwMCBob3ZlcjpiZy1za3ktMzAwIGFjdGl2ZTpiZy1za3ktMzAwXCIgW2NsYXNzLnNlbGVjdGVkXT1cInZhbHVlID09PSBob3VyXCIgKGNsaWNrKT1cIm9uQ2hhbmdlKGhvdXIpXCI+XG4gICAgICAgICAgICAgICAge3sgaG91ciB9fVxuICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgICB9XG4gICAgICA8IS0tIE1pbnV0ZW4gLS0+XG4gICAgICBAaWYgKHZpZXcgPT09ICdtaW51dGVzJykge1xuICAgICAgICA8ZGl2IGNsYXNzPVwiZ3JpZCBncmlkLWNvbHMtMSBnYXAtM1wiPlxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJncmlkIGdyaWQtY29scy00IG1kOmdyaWQtY29scy01IGdhcC0zXCI+XG4gICAgICAgICAgICBAZm9yIChtaW51dGUgb2YgbWludXRlT3B0aW9uczsgdHJhY2sgbWludXRlKSB7XG4gICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LWNlbnRlciBmb250LWJvbGQgY3VzdG9tLXNxdWFyZSByb3VuZGVkIHRleHQtZ3JheS05MDAgdGV4dC1sZyBwLTMgdy1mdWwgdHJ1bmNhdGUgb3V0bGluZS1ub25lIGJnLXNreS0xMDAgZm9jdXM6cmluZy1za3ktMzAwIGhvdmVyOmJnLXNreS0zMDAgYWN0aXZlOmJnLXNreS0zMDBcIiBbY2xhc3Muc2VsZWN0ZWRdPVwidmFsdWUgPT09IG1pbnV0ZVwiIChjbGljayk9XCJvbkNoYW5nZShtaW51dGUpXCI+XG4gICAgICAgICAgICAgICAge3sgbWludXRlIH19XG4gICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgfVxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgPC9pb24tY29udGVudD5cbiAgYCxcbn0pXG5leHBvcnQgY2xhc3MgU3B4SW5wdXRUaW1lTW9kYWxDb21wb25lbnQge1xuICBASW5wdXQoKSB2aWV3ITogJ2hvdXJzJyB8ICdtaW51dGVzJztcbiAgQElucHV0KCkgdmFsdWUhOiBudW1iZXI7XG4gIEBPdXRwdXQoKSBjaGFuZ2U6IEV2ZW50RW1pdHRlcjxudW1iZXI+ID0gbmV3IEV2ZW50RW1pdHRlcjxudW1iZXI+KCk7XG5cbiAgZmFYbWFyayA9IGZhWG1hcmtcbiAgaG91ck9wdGlvbnMgPSBBcnJheS5mcm9tKHsgbGVuZ3RoOiAyNCB9LCAoXywgaSkgPT4gaSk7IC8vIDAgdG8gMjNcbiAgbWludXRlT3B0aW9ucyA9IEFycmF5LmZyb20oeyBsZW5ndGg6IDEyIH0sIChfLCBpKSA9PiBpICogNSk7IC8vIE1pbnV0ZXMgaW4gaW5jcmVtZW50ZW4gdmFuIDVcbiAgdHlwZUVycm9yID0gU3B4U2V2ZXJpdHlFbnVtLmVycm9yO1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgbW9kYWxDb250cm9sbGVyOiBNb2RhbENvbnRyb2xsZXIpe1xuICAgIHRoaXMuaG91ck9wdGlvbnMucHVzaCh0aGlzLmhvdXJPcHRpb25zLnNoaWZ0KCkhKTtcbiAgICB0aGlzLm1pbnV0ZU9wdGlvbnMucHVzaCh0aGlzLm1pbnV0ZU9wdGlvbnMuc2hpZnQoKSEpO1xuICB9XG5cbiAgY2xvc2VEaWFsb2coKSB7XG4gICAgdGhpcy5tb2RhbENvbnRyb2xsZXIuZGlzbWlzcygpO1xuICB9XG5cbiAgb25DaGFuZ2UodmFsdWU6IG51bWJlcikge1xuICAgIHRoaXMuY2hhbmdlLmVtaXQodmFsdWUpO1xuICAgIGNvbnNvbGUubG9nKHZhbHVlKTtcbiAgICB0aGlzLm1vZGFsQ29udHJvbGxlci5kaXNtaXNzKHZhbHVlKTtcbiAgfVxufVxuIl19