@ship-ui/core 0.15.28 → 0.15.29

package/fesm2022/ship-ui-core.mjs

@@ -6562,6 +6562,82 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
                 args: ['drop', ['$event']]
             }] } });
 
+class ShipInputMaskDirective {
+    constructor() {
+        this.#selfRef = inject(ElementRef);
+        this.#renderer = inject(Renderer2);
+        this.shInputMask = input('(999) 999-9999', ...(ngDevMode ? [{ debugName: "shInputMask" }] : []));
+    }
+    #selfRef;
+    #renderer;
+    onInput(event) {
+        const inputElement = this.#selfRef.nativeElement;
+        const oldRawValue = inputElement.value;
+        const newRawValue = event.target.value;
+        const oldCursorPos = inputElement.selectionStart ?? 0;
+        const newCleanValue = this.#cleanValue(newRawValue);
+        const maskedValue = this.#applyMask(newCleanValue);
+        this.#renderer.setProperty(inputElement, 'value', maskedValue);
+        const newCursorPos = this.#getNewCursorPosition(maskedValue, oldRawValue, oldCursorPos);
+        inputElement.setSelectionRange(newCursorPos, newCursorPos);
+    }
+    #getNewCursorPosition(maskedValue, oldRawValue, oldCursorPos) {
+        let digitsBeforeCursor = 0;
+        for (let i = 0; i < oldCursorPos; i++) {
+            if (oldRawValue[i] && oldRawValue[i].match(/\d/)) {
+                digitsBeforeCursor++;
+            }
+        }
+        let newCursorPos = 0;
+        let digitsFound = 0;
+        while (newCursorPos < maskedValue.length && digitsFound < digitsBeforeCursor) {
+            if (maskedValue[newCursorPos].match(/\d/)) {
+                digitsFound++;
+            }
+            newCursorPos++;
+        }
+        return newCursorPos;
+    }
+    #cleanValue(value) {
+        if (!value)
+            return '';
+        return value.replace(/\D/g, '');
+    }
+    #applyMask(cleanValue) {
+        const inputMask = this.shInputMask();
+        if (typeof inputMask === 'function') {
+            return inputMask(cleanValue) ?? '';
+        }
+        const pattern = inputMask;
+        let masked = '';
+        let digitIndex = 0;
+        for (let i = 0; i < pattern.length && digitIndex < cleanValue.length; i++) {
+            const maskChar = pattern[i];
+            const digitChar = cleanValue[digitIndex];
+            if (maskChar === '9') {
+                masked += digitChar;
+                digitIndex++;
+            }
+            else {
+                masked += maskChar;
+            }
+        }
+        return masked;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ShipInputMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.0", type: ShipInputMaskDirective, isStandalone: true, selector: "[shInputMask]", inputs: { shInputMask: { classPropertyName: "shInputMask", publicName: "shInputMask", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput($event)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ShipInputMaskDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[shInputMask]',
+                    standalone: true,
+                }]
+        }], propDecorators: { onInput: [{
+                type: HostListener,
+                args: ['input', ['$event']]
+            }] } });
+
 class ShipPreventWheelDirective {
     wheel(event) {
         event.preventDefault();
@@ -6792,5 +6868,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { GridSortableDirective, SHIP_CONFIG, ShipAlertComponent, ShipAlertContainerComponent, ShipAlertModule, ShipAlertService, ShipBlueprintComponent, ShipButtonComponent, ShipButtonGroupComponent, ShipCardComponent, ShipCheckboxComponent, ShipChipComponent, ShipColorPickerComponent, ShipDatepickerComponent, ShipDatepickerInputComponent, ShipDaterangeInputComponent, ShipDialogComponent, ShipDialogService, ShipDividerComponent, ShipEventCardComponent, ShipFileDragDropDirective, ShipFileUploadComponent, ShipFormFieldComponent, ShipIconComponent, ShipListComponent, ShipMenuComponent, ShipPopoverComponent, ShipPreventWheelDirective, ShipProgressBarComponent, ShipRadioComponent, ShipRangeSliderComponent, ShipResizeDirective, ShipSelectComponent, ShipSidenavComponent, ShipSortDirective, ShipSortableComponent, ShipSortableDirective, ShipSpinnerComponent, ShipStepperComponent, ShipStickyColumnsDirective, ShipTableComponent, ShipTabsComponent, ShipToggleCardComponent, ShipToggleComponent, ShipTooltipComponent, ShipTooltipDirective, ShipTooltipWrapper, ShipVirtualScrollComponent, TEST_NODES, moveIndex, watchHostClass };
+export { GridSortableDirective, SHIP_CONFIG, ShipAlertComponent, ShipAlertContainerComponent, ShipAlertModule, ShipAlertService, ShipBlueprintComponent, ShipButtonComponent, ShipButtonGroupComponent, ShipCardComponent, ShipCheckboxComponent, ShipChipComponent, ShipColorPickerComponent, ShipDatepickerComponent, ShipDatepickerInputComponent, ShipDaterangeInputComponent, ShipDialogComponent, ShipDialogService, ShipDividerComponent, ShipEventCardComponent, ShipFileDragDropDirective, ShipFileUploadComponent, ShipFormFieldComponent, ShipIconComponent, ShipInputMaskDirective, ShipListComponent, ShipMenuComponent, ShipPopoverComponent, ShipPreventWheelDirective, ShipProgressBarComponent, ShipRadioComponent, ShipRangeSliderComponent, ShipResizeDirective, ShipSelectComponent, ShipSidenavComponent, ShipSortDirective, ShipSortableComponent, ShipSortableDirective, ShipSpinnerComponent, ShipStepperComponent, ShipStickyColumnsDirective, ShipTableComponent, ShipTabsComponent, ShipToggleCardComponent, ShipToggleComponent, ShipTooltipComponent, ShipTooltipDirective, ShipTooltipWrapper, ShipVirtualScrollComponent, TEST_NODES, moveIndex, watchHostClass };
 //# sourceMappingURL=ship-ui-core.mjs.map