UNPKG

@dnb/eufemia

Version:

DNB Eufemia Design System UI Library

161 lines 5.45 kB
import adjustCaretPosition from "./adjustCaretPosition.js"; import conformToMask from "./conformToMask.js"; import { convertMaskToPlaceholder, isString, isNumber, processCaretTraps } from "./utilities.js"; import { placeholderChar as defaultPlaceholderChar, strFunction } from "./constants.js"; const emptyString = ''; const strObject = 'object'; const isAndroid = typeof navigator !== 'undefined' && /Android/i.test(navigator.userAgent); const defer = typeof requestAnimationFrame !== 'undefined' ? cb => { requestAnimationFrame(cb); } : cb => { setTimeout(cb, 0); }; export default function createTextMaskInputElement(config) { const state = { previousConformedValue: undefined, previousPlaceholder: undefined }; return { state, update(rawValue, { inputElement, mask: providedMask, guide, pipe, placeholderChar = defaultPlaceholderChar, keepCharPositions = false, showMask = false } = config) { if (typeof rawValue === 'undefined') { rawValue = inputElement.value; } if (rawValue === state.previousConformedValue) { return; } const hasMask = obj => !!obj && typeof obj === 'object' && 'mask' in obj; const provided = (() => { if (providedMask && typeof providedMask === strObject && hasMask(providedMask)) { const obj = providedMask; pipe = obj.pipe; return obj.mask; } return providedMask; })(); let placeholder; let mask; if (provided instanceof Array) { placeholder = convertMaskToPlaceholder(provided, placeholderChar); } if (provided === false) { return; } const safeRawValue = getSafeRawValue(rawValue); const currentCaretPosition = inputElement === null || inputElement === void 0 ? void 0 : inputElement.selectionEnd; const { previousConformedValue, previousPlaceholder } = state; let caretTrapIndexes; if (typeof provided === strFunction) { mask = provided(safeRawValue, { currentCaretPosition, previousConformedValue, placeholderChar }); if (mask === false) { return; } const { maskWithoutCaretTraps, indexes } = processCaretTraps(mask); mask = maskWithoutCaretTraps; caretTrapIndexes = indexes; placeholder = convertMaskToPlaceholder(mask, placeholderChar); } else { mask = provided; } const conformToMaskConfig = { previousConformedValue, guide, placeholderChar, placeholder, currentCaretPosition, keepCharPositions }; const { conformedValue } = conformToMask(safeRawValue, mask, conformToMaskConfig); const piped = typeof pipe === strFunction; let pipeResults = { value: conformedValue }; if (piped) { pipeResults = pipe(conformedValue, { rawValue: safeRawValue, ...conformToMaskConfig }); if (pipeResults === false) { pipeResults = { value: previousConformedValue, rejected: true }; } else if (isString(pipeResults)) { pipeResults = { value: pipeResults }; } } const finalConformedValue = piped ? pipeResults.value : conformedValue; const adjustedCaretPosition = adjustCaretPosition({ previousConformedValue, previousPlaceholder, conformedValue: finalConformedValue, placeholder, rawValue: safeRawValue, currentCaretPosition, placeholderChar, indexesOfPipedChars: pipeResults.indexesOfPipedChars, caretTrapIndexes, keepCharPositions }); const inputValueShouldBeEmpty = finalConformedValue === placeholder && adjustedCaretPosition === 0; const emptyValue = showMask ? placeholder : emptyString; const inputElementValue = inputValueShouldBeEmpty ? emptyValue : finalConformedValue; state.previousConformedValue = inputElementValue; state.previousPlaceholder = placeholder; if (inputElement.value === inputElementValue) { return; } inputElement.value = inputElementValue; safeSetSelection(inputElement, adjustedCaretPosition); } }; } export function safeSetSelection(element, selectionPosition) { var _element$setSelection; if (document.activeElement === element || (element === null || element === void 0 || (_element$setSelection = element.setSelectionRange) === null || _element$setSelection === void 0 ? void 0 : _element$setSelection.name) === 'mockConstructor') { const select = () => { try { element.setSelectionRange(selectionPosition, selectionPosition); } catch (error) {} }; if (isAndroid) { defer(select); } else { select(); } } } function getSafeRawValue(inputValue) { if (isString(inputValue)) { return inputValue; } else if (isNumber(inputValue)) { return String(inputValue); } else if (inputValue === undefined || inputValue === null) { return emptyString; } else { throw new Error("The 'value' provided to Text Mask needs to be a string or a number. The value " + `received was:\n\n ${JSON.stringify(inputValue)}`); } } //# sourceMappingURL=createTextMaskInputElement.js.map