Опция numericOnly и фильтрация символов

Параметр numericOnly относится к поведенческому уровню обработки ввода и определяет, каким образом библиотека обрабатывает символьный поток в текстовом поле. Его основная задача — ограничение входных данных исключительно числовым диапазоном с жёсткой фильтрацией всех остальных символов до этапа форматирования.

Базовая семантика numericOnly

numericOnly включает режим, при котором входной поток нормализуется в числовое представление ещё до применения форматирующих правил. Это означает, что любые символы, не входящие в допустимое множество цифр, подвергаются немедленному удалению.

Ключевая характеристика:

  • допускаются только символы 0–9
  • все остальные символы отбрасываются на этапе парсинга ввода
  • форматирование применяется уже к очищенной строке

Внутренне этот процесс можно рассматривать как предварительный фильтр (pre-processor), который формирует «чистую» строку для последующих операций.

Механизм фильтрации символов

Фильтрация в режиме numericOnly реализуется как последовательная обработка каждого символа входного значения.

Обобщённый алгоритм:

  1. Получение исходного значения из input-события
  2. Разбиение строки на последовательность символов
  3. Проверка каждого символа на принадлежность к диапазону [0-9]
  4. Исключение всех символов, не удовлетворяющих условию
  5. Сбор результирующей строки
  6. Передача результата в механизм форматирования Cleave.js

Ключевой момент заключается в том, что фильтрация происходит до применения blocks, delimiter или других форматирующих опций. Это обеспечивает предсказуемость результата независимо от внешнего ввода.

Поведение при вставке текста (paste event)

При вставке строки из буфера обмена механизм фильтрации работает аналогично, но с некоторыми особенностями:

  • строка целиком проходит этап нормализации
  • все пробелы, буквы, спецсимволы и знаки пунктуации удаляются
  • остаются только цифровые символы

Пример поведения:

Вход:

"12a3-4 5b6"

После фильтрации:

"123456"

Далее эта строка передаётся в систему форматирования.

Влияние на форматирование и маски

Важно учитывать, что numericOnly не является форматирующим инструментом — он не добавляет разделители и не задаёт структуру отображения. Его задача ограничена очисткой входных данных.

Форматирование происходит отдельно, например:

  • группировка цифр через blocks
  • вставка разделителей через delimiter
  • применение валютных или числовых масок через дополнительные опции

Таким образом, цепочка обработки выглядит следующим образом:

сырой ввод → numericOnly-фильтр → форматирование → отображение

Взаимодействие с отрицательными числами

Особенность, которая часто вызывает неоднозначное поведение, связана с символом -.

В режиме numericOnly:

  • знак минуса не считается допустимым символом
  • отрицательные числа автоматически преобразуются в положительные
  • ввод -123 становится 123

Это объясняется тем, что фильтрация ориентирована на строго числовой поток без математической интерпретации знаков.

Поведение с десятичными числами

Символ точки . также исключается из обработки:

  • дробные числа не поддерживаются
  • ввод 12.34 преобразуется в 1234

Это делает numericOnly непригодным для задач, где требуется работа с плавающей точкой, если только не добавляется дополнительная логика поверх Cleave.js.

Особенности работы с международными форматами

В контексте локализованных чисел (например, где используются запятые как разделитель дробной части) поведение остаётся неизменным:

  • , удаляется как недопустимый символ
  • локализация не влияет на фильтрацию
  • все нецифровые разделители игнорируются

Таким образом, numericOnly работает независимо от региональных стандартов форматирования.

Производительность фильтрации

Так как обработка представляет собой линейный проход по строке, сложность алгоритма составляет:

O(n), где n — длина входного значения.

Это делает фильтрацию предсказуемой даже при больших объёмах вставляемого текста. Однако при частых input событиях в высоконагруженных интерфейсах важно учитывать:

  • повторные перерасчёты строки
  • перерендер DOM-значения
  • конкуренцию с другими форматирующими опциями

Конфликты с пользовательскими обработчиками

При одновременном использовании numericOnly и внешних обработчиков ввода возможны конфликты:

  • пользовательский onChange может получать уже очищенное значение
  • попытки вставки нечисловых символов будут «тихо» игнорироваться
  • маскирование на уровне UI может не совпадать с фактическим значением input

Это приводит к ситуации, когда визуальное поведение поля отличается от логики бизнес-валидации, если она не синхронизирована с Cleave.js.

Типичные сценарии применения

Наиболее устойчивые сценарии использования numericOnly:

  • ввод телефонных номеров (в комбинации с форматированием)
  • ввод идентификаторов, состоящих только из цифр
  • ввод банковских реквизитов без разделителей
  • формы с жёсткой цифровой валидацией

В этих случаях фильтрация символов снижает необходимость дополнительной валидации на стороне приложения.

Ограничения модели фильтрации

Архитектура numericOnly имеет принципиальные ограничения:

  • отсутствие поддержки математических символов
  • невозможность представления отрицательных значений
  • игнорирование дробной части
  • невозможность кастомизации набора допустимых символов внутри самой опции

Любые расширения поведения требуют либо отключения numericOnly, либо построения кастомной логики поверх событий ввода.

Стабильность результата при редактировании строки

При редактировании уже введённого значения Cleave.js повторно применяет фильтрацию на каждом изменении:

  • удаление символа пересчитывает строку полностью
  • вставка в середину строки приводит к повторной нормализации
  • курсор может корректироваться автоматически после пересчёта

Это поведение важно учитывать при реализации UX с точным позиционированием курсора.

Итоговая модель обработки ввода

Логическая модель работы numericOnly в Cleave.js сводится к последовательному преобразованию:

  • ввод → фильтрация символов → числовая нормализация → форматирование → отображение

Эта модель делает поведение предсказуемым, но одновременно ограничивает выразительность ввода, фиксируя его в строго числовом пространстве без дополнительных интерпретаций.