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

Библиотека AutoNumeric построена вокруг декларативной модели конфигураций, где поведение инпута определяется набором опций. Пользовательские правила в этом контексте представляют собой слой абстракции над базовыми настройками, позволяющий формализовать бизнес-логику форматирования, ограничений ввода и преобразования значений.

Основной принцип заключается в том, что любое правило сводится к изменению поведения одной или нескольких опций AutoNumeric либо к добавлению логики вокруг жизненного цикла значения: ввод, редактирование, отображение, получение raw-значения.

Базовый механизм формирования пользовательских правил

В AutoNumeric нет отдельной сущности «rule engine». Вместо этого пользовательские правила реализуются через композицию конфигурационных объектов.

Каждое правило формируется как объект опций:

const moneyRule = {
  decimalCharacter: ',',
  digitGroupSeparator: ' ',
  decimalPlaces: 2,
  currencySymbol: '₽',
  currencySymbolPlacement: 's'
};

Такой объект становится атомарным правилом, которое может быть применено к одному или нескольким полям ввода.

Ключевой принцип: правило = конфигурация + контекст применения.

Переиспользуемые шаблоны правил

При росте приложения появляется необходимость централизовать правила. Для этого формируются фабрики конфигураций.

Фабрика валютных правил

function createCurrencyRule({ symbol, decimals = 2 }) {
  return {
    decimalCharacter: '.',
    digitGroupSeparator: ',',
    decimalPlaces: decimals,
    currencySymbol: symbol,
    currencySymbolPlacement: 'p'
  };
}

Использование:

const usdRule = createCurrencyRule({ symbol: '$', decimals: 2 });
const eurRule = createCurrencyRule({ symbol: '€', decimals: 2 });

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

Наследование и композиция правил

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

const baseNumberRule = {
  digitGroupSeparator: ' ',
  decimalCharacter: '.',
  decimalPlaces: 2
};

const strictPositiveRule = {
  ...baseNumberRule,
  minimumValue: '0'
};

Композиция позволяет строить иерархию правил:

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

Условные правила и динамическое поведение

В реальных интерфейсах правила часто зависят от состояния приложения. AutoNumeric позволяет изменять конфигурацию на лету через методы экземпляра.

const an = new AutoNumeric('#input', baseNumberRule);

if (isAdminMode) {
  an.update({
    decimalPlaces: 4
  });
}

Такой подход формирует динамическое правило, где итоговое поведение определяется текущим состоянием системы.

Ограничительные правила (валидация ввода)

Часть пользовательских правил связана с ограничением допустимого ввода. AutoNumeric предоставляет механизмы контроля значений через параметры минимального и максимального диапазона.

const boundedRule = {
  minimumValue: '10',
  maximumValue: '1000'
};

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

Кастомные правила обработки вставки данных

При работе с буфером обмена часто требуется нормализация входных данных.

const pasteNormalizationRule = {
  onInvalidPaste: 'truncate'
};

Данное правило определяет стратегию обработки некорректного вставленного значения: игнорирование, обрезка или преобразование.

Пользовательские правила на этом уровне позволяют адаптировать поведение под внешние источники данных (Excel, API, пользовательский ввод).

Правила локализации как отдельный класс конфигураций

Локализация является одним из основных сценариев пользовательских правил. Она определяет формат отображения числа.

const ruLocaleRule = {
  decimalCharacter: ',',
  digitGroupSeparator: ' ',
  currencySymbol: '₽',
  currencySymbolPlacement: 's'
};

Такие правила часто группируются по регионам:

  • ru-RU
  • en-US
  • de-DE

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

Правила преобразования сырого значения

AutoNumeric хранит значение в двух формах: отображаемой и сырой (raw). Пользовательские правила могут влиять на преобразование между ними.

const percentRule = {
  decimalPlaces: 2,
  outputFormat: 'number',
  rawValueDivisor: 100
};

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

Правила поведения курсора и взаимодействия

Некоторые пользовательские правила регулируют UX поведения поля:

const uxRule = {
  caretPositionOnFocus: 'end',
  selectNumberOnly: true,
  modifyValueOnWheel: true
};

Такие настройки формируют предсказуемое поведение при взаимодействии пользователя с полем ввода.

Правила на основе событий жизненного цикла

AutoNumeric позволяет подключать поведение через события, что расширяет модель правил до реактивной логики.

const eventRule = {
  onFocus: (event) => {
    console.log('focus');
  },
  onBlur: (event) => {
    console.log('blur');
  }
};

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

Контекстные правила для форм

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

const salaryAN = new AutoNumeric('#salary', baseRule);
const bonusAN = new AutoNumeric('#bonus', baseRule);

salaryAN.set({
  maximumValue: bonusAN.getNumber() * 10
});

Таким образом формируется зависимое правило, где одно поле влияет на ограничения другого.

Слоистая модель правил

Практически все пользовательские правила в AutoNumeric можно разложить на уровни:

  1. Базовый уровень форматирования

    • разделители
    • количество знаков

  2. Доменный уровень

    • деньги
    • проценты
    • измерения

  3. Интерактивный уровень

    • курсор
    • вставка
    • ввод

  4. Бизнес-уровень

    • ограничения
    • зависимости
    • вычисляемые диапазоны

Такое разделение упрощает сопровождение сложных интерфейсов.

Паттерн централизованного реестра правил

В крупных проектах пользовательские правила выносятся в единый реестр:

const rules = {
  money: {
    decimalCharacter: '.',
    digitGroupSeparator: ',',
    decimalPlaces: 2
  },
  strictInt: {
    decimalPlaces: 0,
    modifyValueOnWheel: false
  }
};

Использование:

new AutoNumeric('#input', rules.money);

Это снижает вероятность расхождения форматирования между компонентами системы.

Интеграция пользовательских правил в архитектуру приложения

При внедрении AutoNumeric в сложные системы пользовательские правила становятся частью архитектурного слоя:

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

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

Оглавление