@cuby-ui/core 0.0.165 → 0.0.166

package/fesm2020/cuby-ui-core.mjs

@@ -11,8 +11,8 @@ import * as i2$1 from '@tinkoff/ng-polymorpheus';
 import { PolymorpheusModule } from '@tinkoff/ng-polymorpheus';
 import * as i2$2 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
-import { maskitoTimeOptionsGenerator } from '@maskito/kit';
-import * as i2$3 from '@maskito/angular';
+import { maskitoParseNumber, maskitoNumberOptionsGenerator, maskitoTimeOptionsGenerator } from '@maskito/kit';
+import * as i3 from '@maskito/angular';
 import { MaskitoDirective } from '@maskito/angular';
 
 class CuiAccordionComponent {
@@ -1213,25 +1213,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 }]
         }] });
 
-const CUI_INPUT_NUMBER_DEFAULT_OPTIONS = {
-    min: -Infinity,
-    max: Infinity,
-    step: 1,
-    precision: 3
-};
-const CUI_INPUT_NUMBER_OPTIONS = new InjectionToken('', {
-    factory: () => CUI_INPUT_NUMBER_DEFAULT_OPTIONS
-});
-
-function cuiRemoveSpaces(value) {
-    return value.replace(/\s+/g, '');
-}
-
-function cuiReplace(value, search, replace) {
-    const regex = new RegExp(search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g');
-    return value.replace(regex, replace);
-}
-
 class CuiTextFieldController {
     constructor(iconLeftDirective, idDirective, isErrorDirective, placeholderDirective, sizeDirective) {
         this.iconLeftDirective = iconLeftDirective;
@@ -1407,22 +1388,22 @@ class CuiInputNumberComponent {
     constructor() {
         this.changeDetectorRef = inject(ChangeDetectorRef);
         this.cuiTextFieldController = inject(CUI_TEXT_FIELD_CONTROLLER);
-        this.cuiInputNumberOptions = inject(CUI_INPUT_NUMBER_OPTIONS);
-        this.MIN_JS_NUMBER = -(2 ** 53);
-        this.MAX_JS_NUMBER = 2 ** 53;
-        this.INPUT_VALUE_REGEX = /^-?[\d\s]*(,\d*)?$/;
-        this.INTERVAL_BETWEEN_SPACES = 3;
-        this.formattedValue = '';
-        this._min = this.calculateValidMinValue(this.cuiInputNumberOptions.min);
-        this._max = this.calculateValidMaxValue(this.cuiInputNumberOptions.max);
-        this.step = this.cuiInputNumberOptions.step;
-        this.precision = this.cuiInputNumberOptions.precision;
-    }
-    set min(min) {
-        this._min = this.calculateValidMinValue(min);
-    }
-    set max(max) {
-        this._max = this.calculateValidMaxValue(max);
+        this.maskOptions = this.generateMask();
+        this._precision = 0;
+        this._min = Number.MIN_SAFE_INTEGER;
+        this._max = Number.MAX_SAFE_INTEGER;
+    }
+    set precision(value) {
+        this._precision = value;
+        this.maskOptions = this.generateMask();
+    }
+    set min(value) {
+        this._min = value;
+        this.maskOptions = this.generateMask();
+    }
+    set max(value) {
+        this._max = value;
+        this.maskOptions = this.generateMask();
     }
     get id() {
         return this.cuiTextFieldController.id;
@@ -1440,8 +1421,7 @@ class CuiInputNumberComponent {
         return this.cuiTextFieldController.isError;
     }
     writeValue(value) {
-        this.value = value?.toString() ?? null;
-        this.formattedValue = this.formatValue(this.value);
+        this.value = value?.toString();
         this.changeDetectorRef.markForCheck();
     }
     registerOnChange(fn) {
@@ -1454,127 +1434,37 @@ class CuiInputNumberComponent {
         this.isDisabled = isDisabled;
         this.changeDetectorRef.markForCheck();
     }
-    onInput(event) {
-        const eventTarget = event.target;
-        const targetValue = eventTarget.value;
-        const selectionStart = this.input.nativeElement.selectionStart ?? 0;
-        const previousFormattedValue = this.formattedValue;
-        if (this.isInputValueCorrect(targetValue)) {
-            const parsedValue = this.parseValue(targetValue);
-            this.changeModel(parsedValue);
-        }
-        this.formattedValue = this.formatValue(this.value);
-        eventTarget.value = this.formattedValue;
-        const currentCaretPosition = selectionStart
-            + (this.formattedValue.length - previousFormattedValue.length === 2 ? 1 : 0);
-        this.input.nativeElement.setSelectionRange(currentCaretPosition, currentCaretPosition);
-    }
-    onArrowUp() {
-        this.increaseByStep();
-    }
-    onArrowDown() {
-        this.decreaseByStep();
+    onInput({ target }) {
+        this.changeModel(target.value);
     }
     onFocus() {
         this.input.nativeElement.focus();
     }
-    isInputValueCorrect(inputValue) {
-        return this.INPUT_VALUE_REGEX.test(inputValue) && this.isInputValueValid(inputValue);
-    }
-    isInputValueValid(inputValue) {
-        const [, fractionPart = ''] = inputValue.split(',');
-        return this.isNumberValid(inputValue) && this.isPrecisionCountCorrect(fractionPart);
-    }
-    isNumberValid(inputValue) {
-        if (inputValue === '-' && this._min > 0) {
-            return false;
-        }
-        if (inputValue === ',' || inputValue === '-' || inputValue === '-,' || inputValue === '') {
-            return true;
-        }
-        const convertedValue = +cuiReplace(cuiRemoveSpaces(inputValue), ',', '.');
-        return convertedValue <= this._max && convertedValue >= this._min;
-    }
-    isPrecisionCountCorrect(fractionPart = '') {
-        return fractionPart.length <= this.precision;
-    }
-    parseValue(inputValue) {
-        const valueWithoutSpaces = cuiRemoveSpaces(inputValue);
-        switch (valueWithoutSpaces) {
-            case ',':
-                return '0.';
-            case '-,':
-                return '-0.';
-            default:
-                return cuiReplace(valueWithoutSpaces, ',', '.');
-        }
-    }
-    formatValue(value) {
-        if (!value) {
-            return '';
-        }
-        const [integerPart, fractionPart] = value.split('.');
-        let formattedInteger = this.insertSpacesWithInterval(integerPart) || '0';
-        if (fractionPart !== undefined && integerPart.startsWith('-') && !formattedInteger.slice(1)) {
-            formattedInteger = '-0';
-        }
-        return fractionPart !== undefined ? `${formattedInteger},${fractionPart}` : formattedInteger;
-    }
-    insertSpacesWithInterval(value) {
-        const regex = new RegExp(`\\B(?=(\\d{${this.INTERVAL_BETWEEN_SPACES}})+(?!\\d))`, 'g');
-        return value.replace(regex, ' ');
-    }
     changeModel(value) {
+        const parsedValue = maskitoParseNumber(value);
         this.value = value;
-        this.onChange(value === '-' ? 0 : +value);
+        this.onChange(Number.isNaN(parsedValue) ? null : parsedValue);
     }
-    increaseByStep() {
-        const value = this.value === '-'
-            ? this.step
-            : (+(Number(this.value) + this.step).toFixed(this.precision));
-        if (value > this._max) {
-            return;
-        }
-        const convertedValue = value.toString();
-        this.formattedValue = this.formatValue(convertedValue);
-        this.changeModel(convertedValue);
-    }
-    decreaseByStep() {
-        const value = this.value === '-'
-            ? -this.step
-            : (+(Number(this.value) - this.step).toFixed(this.precision));
-        if (value < this._min) {
-            return;
-        }
-        const convertedValue = value.toString();
-        this.formattedValue = this.formatValue(convertedValue);
-        this.changeModel(convertedValue);
-    }
-    calculateValidMinValue(initialValue) {
-        return initialValue >= this.MIN_JS_NUMBER
-            ? initialValue
-            : this.MIN_JS_NUMBER;
-    }
-    calculateValidMaxValue(initialValue) {
-        return initialValue <= this.MAX_JS_NUMBER
-            ? initialValue
-            : this.MAX_JS_NUMBER;
+    generateMask() {
+        return maskitoNumberOptionsGenerator({
+            precision: this._precision,
+            min: this._min,
+            max: this._max
+        });
     }
 }
 CuiInputNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CuiInputNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { step: "step", precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
+CuiInputNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
         CUI_TEXT_FILED_CONTROLLER_PROVIDER,
-        cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true),
-    ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n  *ngIf=\"iconLeft\"\n  [icon]=\"iconLeft\"\n  color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n  #input\n  [ngModel]=\"formattedValue\"\n  [attr.id]=\"id\"\n  [attr.placeholder]=\"placeholder\"\n  type=\"text\"\n  [disabled]=\"isDisabled\"\n  class=\"c-input\"\n  (input)=\"onInput($event)\"\n  (focus)=\"onTouched()\"\n  (keydown.arrowUp)=\"onArrowUp()\"\n  (keydown.arrowDown)=\"onArrowDown()\"\n>\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)
+    ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n  *ngIf=\"iconLeft\"\n  [icon]=\"iconLeft\"\n  color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n  #input\n  [ngModel]=\"value\"\n  [attr.id]=\"id\"\n  [attr.placeholder]=\"placeholder\"\n  type=\"text\"\n  [maskito]=\"maskOptions\"\n  [disabled]=\"isDisabled\"\n  class=\"c-input\"\n  (input)=\"onInput($event)\"\n  (focus)=\"onTouched()\"\n>\n\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         CUI_TEXT_FILED_CONTROLLER_PROVIDER,
-                        cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true),
-                    ], template: "<cui-svg\n  *ngIf=\"iconLeft\"\n  [icon]=\"iconLeft\"\n  color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n  #input\n  [ngModel]=\"formattedValue\"\n  [attr.id]=\"id\"\n  [attr.placeholder]=\"placeholder\"\n  type=\"text\"\n  [disabled]=\"isDisabled\"\n  class=\"c-input\"\n  (input)=\"onInput($event)\"\n  (focus)=\"onTouched()\"\n  (keydown.arrowUp)=\"onArrowUp()\"\n  (keydown.arrowDown)=\"onArrowDown()\"\n>\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
-        }], propDecorators: { step: [{
-                type: Input
-            }], precision: [{
+                        cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)
+                    ], template: "<cui-svg\n  *ngIf=\"iconLeft\"\n  [icon]=\"iconLeft\"\n  color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n  #input\n  [ngModel]=\"value\"\n  [attr.id]=\"id\"\n  [attr.placeholder]=\"placeholder\"\n  type=\"text\"\n  [maskito]=\"maskOptions\"\n  [disabled]=\"isDisabled\"\n  class=\"c-input\"\n  (input)=\"onInput($event)\"\n  (focus)=\"onTouched()\"\n>\n\n", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
+        }], propDecorators: { precision: [{
                 type: Input
             }], min: [{
                 type: Input
@@ -1602,6 +1492,7 @@ class CuiInputNumberModule {
 CuiInputNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 CuiInputNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, declarations: [CuiInputNumberComponent], imports: [CommonModule,
         FormsModule,
+        MaskitoDirective,
         CuiSvgModule], exports: [CuiInputNumberComponent,
         CuiTextFieldControllerModule] });
 CuiInputNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputNumberModule, imports: [CommonModule,
@@ -1613,7 +1504,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     imports: [
                         CommonModule,
                         FormsModule,
-                        CuiSvgModule
+                        MaskitoDirective,
+                        CuiSvgModule,
                     ],
                     declarations: [CuiInputNumberComponent],
                     exports: [
@@ -1905,7 +1797,7 @@ CuiInputTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", ve
 CuiInputTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [
         CUI_TEXT_FILED_CONTROLLER_PROVIDER,
         cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)
-    ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n  icon=\"cuiIconClock\"\n  color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n  #input\n  [ngModel]=\"computedValue\"\n  [attr.id]=\"id\"\n  [attr.placeholder]=\"placeholder\"\n  type=\"text\"\n  [maskito]=\"maskOptions\"\n  [disabled]=\"isDisabled\"\n  class=\"c-input\"\n  (input)=\"onInput($event)\"\n  (focus)=\"onTouched()\"\n>", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n  icon=\"cuiIconClock\"\n  color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n  #input\n  [ngModel]=\"computedValue\"\n  [attr.id]=\"id\"\n  [attr.placeholder]=\"placeholder\"\n  type=\"text\"\n  [maskito]=\"maskOptions\"\n  [disabled]=\"isDisabled\"\n  class=\"c-input\"\n  (input)=\"onInput($event)\"\n  (focus)=\"onTouched()\"\n>", styles: [":host{padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px #d92d2040}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CuiInputTimeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cui-input-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -2331,6 +2223,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 }]
         }] });
 
+function cuiRemoveSpaces(value) {
+    return value.replace(/\s+/g, '');
+}
+
+function cuiReplace(value, search, replace) {
+    const regex = new RegExp(search.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g');
+    return value.replace(regex, replace);
+}
+
 /**
  * Generated bundle index. Do not edit.
  */