Маска ввода из значений массива

Если я правильно понял, то можно сделать нативным инпутом. При необходимости уже в js динамически контролировать значение атрибутов.

<input type="number" step="100" min="100" max="500">

Можно написать функцию inArray, которая будет принимать два параметра: значение и массив, и проверять есть ли такое значение в массиве, и возвращать тру или фолс. Потом вызывать эту функцию с value инпута, и нужным массивом, и выводить сообщение о том что значение недопустимо, и очищать инпут или ничего не делать, если значение допустимо

const input = document.querySelector('#input')
const array = [100, 200, 300, 400, 500]
const inArray = (array, value) => array.includes(parseInt(value))
const mask = event => {
    if (!inArray(array, event.target.value)) {
        event.target.value = ''
        alert(`Допустимые значения для ввода: ${array}`)
    }
}
input.addEventListener('change', mask)

<input type="text" id="input" />