@elliemae/ds-form 3.2.1-rc.4 → 3.2.1-rc.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/CheckboxGroup/DSCheckboxGroup.js +15 -29
- package/dist/cjs/CheckboxGroup/DSCheckboxGroup.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js +24 -65
- package/dist/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js +5 -19
- package/dist/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValue.js +3 -15
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValue.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js +7 -20
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js.map +1 -1
- package/dist/cjs/DateInput/DSDateInput.js +14 -46
- package/dist/cjs/DateInput/DSDateInput.js.map +1 -1
- package/dist/cjs/DateInput/components/DateInputImpl.js +4 -17
- package/dist/cjs/DateInput/components/DateInputImpl.js.map +1 -1
- package/dist/cjs/DateInput/components/DateInputs.js +9 -23
- package/dist/cjs/DateInput/components/DateInputs.js.map +1 -1
- package/dist/cjs/DateInputV2/components/DateInputs.js +9 -23
- package/dist/cjs/DateInputV2/components/DateInputs.js.map +1 -1
- package/dist/cjs/ExpandableInput/ExpandableInputImpl.js +3 -19
- package/dist/cjs/ExpandableInput/ExpandableInputImpl.js.map +1 -1
- package/dist/cjs/FloatingLabelInput/FloatingLabelInputImpl.js +4 -17
- package/dist/cjs/FloatingLabelInput/FloatingLabelInputImpl.js.map +1 -1
- package/dist/cjs/FormItem/DSFormItemLayout.js +56 -118
- package/dist/cjs/FormItem/DSFormItemLayout.js.map +1 -1
- package/dist/cjs/FormItem/ValidationFieldWrapper.js +3 -19
- package/dist/cjs/FormItem/ValidationFieldWrapper.js.map +1 -1
- package/dist/cjs/InputGroup/AddonWrapper.js +4 -17
- package/dist/cjs/InputGroup/AddonWrapper.js.map +1 -1
- package/dist/cjs/InputMask/DSInputMask.js +19 -51
- package/dist/cjs/InputMask/DSInputMask.js.map +1 -1
- package/dist/cjs/InputMask/DSInputMaskDeprecated.js +11 -62
- package/dist/cjs/InputMask/DSInputMaskDeprecated.js.map +1 -1
- package/dist/cjs/InputMask/MaskTypes.js +3 -17
- package/dist/cjs/InputMask/MaskTypes.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DateInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/DateInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DateTimeInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/DateTimeInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DictionaryInputMask.js +40 -103
- package/dist/cjs/InputMask/mask_types/DictionaryInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/NumberInputMask.js +49 -121
- package/dist/cjs/InputMask/mask_types/NumberInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/PhoneInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/PhoneInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/PhoneInternationalInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/PhoneInternationalInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/SsnInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/SsnInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/UsZipCodeInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/UsZipCodeInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/index.js +79 -119
- package/dist/cjs/InputMask/mask_types/index.js.map +1 -1
- package/dist/cjs/InputProtected/DSInputProtected.js +14 -51
- package/dist/cjs/InputProtected/DSInputProtected.js.map +1 -1
- package/dist/cjs/LargeInputText/DSLargeInputText.js +3 -19
- package/dist/cjs/LargeInputText/DSLargeInputText.js.map +1 -1
- package/dist/cjs/Radio/DSRadio.js +24 -67
- package/dist/cjs/Radio/DSRadio.js.map +1 -1
- package/dist/cjs/RadioGroup/DSRadioGroup.js +15 -29
- package/dist/cjs/RadioGroup/DSRadioGroup.js.map +1 -1
- package/dist/cjs/TimeInput/DSTimeInput.js +8 -40
- package/dist/cjs/TimeInput/DSTimeInput.js.map +1 -1
- package/dist/cjs/TimeInput/TimeInputImpl.js +4 -17
- package/dist/cjs/TimeInput/TimeInputImpl.js.map +1 -1
- package/dist/cjs/TimeInput/TimeInputs.js +12 -25
- package/dist/cjs/TimeInput/TimeInputs.js.map +1 -1
- package/dist/cjs/Toggle/DSToggle.js +25 -66
- package/dist/cjs/Toggle/DSToggle.js.map +1 -1
- package/dist/cjs/Toggle/DSToggleImpl.js +7 -22
- package/dist/cjs/Toggle/DSToggleImpl.js.map +1 -1
- package/dist/cjs/Toggle/DSToggleRender.js +10 -24
- package/dist/cjs/Toggle/DSToggleRender.js.map +1 -1
- package/dist/esm/CheckboxGroup/DSCheckboxGroup.js +15 -31
- package/dist/esm/CheckboxGroup/DSCheckboxGroup.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js +24 -67
- package/dist/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/MultiValueRemove.js +5 -21
- package/dist/esm/ComboBoxFreeSolo/components/MultiValueRemove.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/SingleValue.js +3 -17
- package/dist/esm/ComboBoxFreeSolo/components/SingleValue.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/SingleValueRemove.js +7 -22
- package/dist/esm/ComboBoxFreeSolo/components/SingleValueRemove.js.map +1 -1
- package/dist/esm/DateInput/DSDateInput.js +14 -48
- package/dist/esm/DateInput/DSDateInput.js.map +1 -1
- package/dist/esm/DateInput/components/DateInputImpl.js +4 -19
- package/dist/esm/DateInput/components/DateInputImpl.js.map +1 -1
- package/dist/esm/DateInput/components/DateInputs.js +9 -25
- package/dist/esm/DateInput/components/DateInputs.js.map +1 -1
- package/dist/esm/DateInputV2/components/DateInputs.js +9 -25
- package/dist/esm/DateInputV2/components/DateInputs.js.map +1 -1
- package/dist/esm/ExpandableInput/ExpandableInputImpl.js +3 -21
- package/dist/esm/ExpandableInput/ExpandableInputImpl.js.map +1 -1
- package/dist/esm/FloatingLabelInput/FloatingLabelInputImpl.js +4 -19
- package/dist/esm/FloatingLabelInput/FloatingLabelInputImpl.js.map +1 -1
- package/dist/esm/FormItem/DSFormItemLayout.js +56 -120
- package/dist/esm/FormItem/DSFormItemLayout.js.map +1 -1
- package/dist/esm/FormItem/ValidationFieldWrapper.js +3 -21
- package/dist/esm/FormItem/ValidationFieldWrapper.js.map +1 -1
- package/dist/esm/InputGroup/AddonWrapper.js +4 -19
- package/dist/esm/InputGroup/AddonWrapper.js.map +1 -1
- package/dist/esm/InputMask/DSInputMask.js +19 -53
- package/dist/esm/InputMask/DSInputMask.js.map +1 -1
- package/dist/esm/InputMask/DSInputMaskDeprecated.js +11 -64
- package/dist/esm/InputMask/DSInputMaskDeprecated.js.map +1 -1
- package/dist/esm/InputMask/MaskTypes.js +3 -19
- package/dist/esm/InputMask/MaskTypes.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DateInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/DateInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DateTimeInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/DateTimeInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DictionaryInputMask.js +40 -105
- package/dist/esm/InputMask/mask_types/DictionaryInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/NumberInputMask.js +49 -123
- package/dist/esm/InputMask/mask_types/NumberInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/PhoneInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/PhoneInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/PhoneInternationalInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/PhoneInternationalInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/SsnInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/SsnInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/UsZipCodeInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/UsZipCodeInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/ZipCodeSearchInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/ZipCodeSearchInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/index.js +79 -121
- package/dist/esm/InputMask/mask_types/index.js.map +1 -1
- package/dist/esm/InputProtected/DSInputProtected.js +14 -53
- package/dist/esm/InputProtected/DSInputProtected.js.map +1 -1
- package/dist/esm/LargeInputText/DSLargeInputText.js +3 -21
- package/dist/esm/LargeInputText/DSLargeInputText.js.map +1 -1
- package/dist/esm/Radio/DSRadio.js +24 -69
- package/dist/esm/Radio/DSRadio.js.map +1 -1
- package/dist/esm/RadioGroup/DSRadioGroup.js +15 -31
- package/dist/esm/RadioGroup/DSRadioGroup.js.map +1 -1
- package/dist/esm/TimeInput/DSTimeInput.js +8 -42
- package/dist/esm/TimeInput/DSTimeInput.js.map +1 -1
- package/dist/esm/TimeInput/TimeInputImpl.js +4 -19
- package/dist/esm/TimeInput/TimeInputImpl.js.map +1 -1
- package/dist/esm/TimeInput/TimeInputs.js +12 -27
- package/dist/esm/TimeInput/TimeInputs.js.map +1 -1
- package/dist/esm/Toggle/DSToggle.js +25 -68
- package/dist/esm/Toggle/DSToggle.js.map +1 -1
- package/dist/esm/Toggle/DSToggleImpl.js +7 -24
- package/dist/esm/Toggle/DSToggleImpl.js.map +1 -1
- package/dist/esm/Toggle/DSToggleRender.js +10 -26
- package/dist/esm/Toggle/DSToggleRender.js.map +1 -1
- package/package.json +12 -12
|
@@ -1,35 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
import * as React from "react";
|
|
34
3
|
import React2, { useCallback, useLayoutEffect, useRef, useState } from "react";
|
|
35
4
|
import { DSTextBox } from "../../TextBox";
|
|
@@ -69,72 +38,40 @@ const conformValue = (rawValue, cursorPos, lastkeycode) => {
|
|
|
69
38
|
}
|
|
70
39
|
return { nextMaskedValue: nextMaskedValue.join(""), maskedPos };
|
|
71
40
|
};
|
|
72
|
-
const PhoneInternationalInputMask = (
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
"focus",
|
|
107
|
-
"setFocus",
|
|
108
|
-
"setRawMask",
|
|
109
|
-
"cursorPosition",
|
|
110
|
-
"setCursorPosition",
|
|
111
|
-
"lastkey",
|
|
112
|
-
"setLastkey",
|
|
113
|
-
"setRawValue",
|
|
114
|
-
"style",
|
|
115
|
-
"disabled",
|
|
116
|
-
"className",
|
|
117
|
-
"name",
|
|
118
|
-
"maxLength",
|
|
119
|
-
"minLength",
|
|
120
|
-
"fluidWidth",
|
|
121
|
-
"placeholder",
|
|
122
|
-
"onKeyDown",
|
|
123
|
-
"onClick",
|
|
124
|
-
"onChange",
|
|
125
|
-
"onFocus",
|
|
126
|
-
"onBlur",
|
|
127
|
-
"onPaste",
|
|
128
|
-
"onKeyUp",
|
|
129
|
-
"hasError",
|
|
130
|
-
"readOnly",
|
|
131
|
-
"type",
|
|
132
|
-
"innerRef",
|
|
133
|
-
"clearable",
|
|
134
|
-
"leftComponent",
|
|
135
|
-
"rightComponent",
|
|
136
|
-
"value"
|
|
137
|
-
]);
|
|
41
|
+
const PhoneInternationalInputMask = ({
|
|
42
|
+
focus,
|
|
43
|
+
setFocus,
|
|
44
|
+
setRawMask,
|
|
45
|
+
cursorPosition,
|
|
46
|
+
setCursorPosition,
|
|
47
|
+
lastkey,
|
|
48
|
+
setLastkey,
|
|
49
|
+
setRawValue,
|
|
50
|
+
style,
|
|
51
|
+
disabled,
|
|
52
|
+
className,
|
|
53
|
+
name,
|
|
54
|
+
maxLength,
|
|
55
|
+
minLength,
|
|
56
|
+
fluidWidth,
|
|
57
|
+
placeholder,
|
|
58
|
+
onKeyDown,
|
|
59
|
+
onClick,
|
|
60
|
+
onChange,
|
|
61
|
+
onFocus,
|
|
62
|
+
onBlur,
|
|
63
|
+
onPaste,
|
|
64
|
+
onKeyUp,
|
|
65
|
+
hasError,
|
|
66
|
+
readOnly,
|
|
67
|
+
type,
|
|
68
|
+
innerRef,
|
|
69
|
+
clearable = false,
|
|
70
|
+
leftComponent,
|
|
71
|
+
rightComponent,
|
|
72
|
+
value,
|
|
73
|
+
...rest
|
|
74
|
+
}) => {
|
|
138
75
|
const inputRef = useRef();
|
|
139
76
|
const [maskedValue, setMaskedValue] = useState(value);
|
|
140
77
|
const conform = useCallback(({ rawValue, cursorPos, lastkeycode, shouldUpdateCursorPos = true }) => {
|
|
@@ -180,7 +117,8 @@ const PhoneInternationalInputMask = (_a) => {
|
|
|
180
117
|
setFocus(false);
|
|
181
118
|
onBlur(e);
|
|
182
119
|
}, [onBlur]);
|
|
183
|
-
return /* @__PURE__ */ React2.createElement(DSTextBox,
|
|
120
|
+
return /* @__PURE__ */ React2.createElement(DSTextBox, {
|
|
121
|
+
...rest,
|
|
184
122
|
className,
|
|
185
123
|
clearable,
|
|
186
124
|
disabled,
|
|
@@ -209,7 +147,7 @@ const PhoneInternationalInputMask = (_a) => {
|
|
|
209
147
|
style,
|
|
210
148
|
type,
|
|
211
149
|
value: maskedValue
|
|
212
|
-
})
|
|
150
|
+
});
|
|
213
151
|
};
|
|
214
152
|
var PhoneInternationalInputMask_default = PhoneInternationalInputMask;
|
|
215
153
|
export {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/InputMask/mask_types/PhoneInternationalInputMask.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport { DSTextBox } from '../../TextBox';\nimport { TCharsToAdd } from '../types';\nimport { setCaretPosition } from '../utils/setCaretPosition';\n\nconst conformValue = (rawValue, cursorPos, lastkeycode) => {\n let nextMaskedValue = rawValue\n .split('+1')\n .slice(-1)[0]\n .split('')\n .filter((char) => char >= '0' && char <= '9');\n\n while (nextMaskedValue.length && nextMaskedValue[0] === '0')\n nextMaskedValue.splice(0, 1);\n\n nextMaskedValue = nextMaskedValue.slice(0, 10);\n\n let maskedPos = 0;\n for (let i = 0; i < cursorPos; i += 1) {\n if (nextMaskedValue[maskedPos] === rawValue[i]) maskedPos += 1;\n }\n\n // list of [string to add, position to add]\nconst charactersToAdd: TCharsToAdd = [\n ['+1 (', 0],\n [') ', 7],\n ['-', 12],\n ];\n\n charactersToAdd.forEach(([chars, pos]) => {\n if (nextMaskedValue.length > pos) {\n nextMaskedValue.splice(pos, 0, ...chars);\n if (maskedPos >= pos) maskedPos += chars.length;\n }\n });\n\n if (lastkeycode !== 8 && maskedPos < nextMaskedValue.length) {\n charactersToAdd.forEach(([chars, pos]) => {\n if (maskedPos === pos) maskedPos += chars.length;\n });\n } else if (lastkeycode === 8 && maskedPos) {\n charactersToAdd.forEach(([chars, pos]) => {\n if (maskedPos === pos + 1) maskedPos -= chars.length;\n });\n }\n return { nextMaskedValue: nextMaskedValue.join(''), maskedPos };\n};\n\nconst PhoneInternationalInputMask = ({\n focus,\n setFocus,\n setRawMask,\n cursorPosition,\n setCursorPosition,\n lastkey,\n setLastkey,\n setRawValue,\n style,\n disabled,\n className,\n name,\n maxLength,\n minLength,\n fluidWidth,\n placeholder,\n onKeyDown,\n onClick,\n onChange,\n onFocus,\n onBlur,\n onPaste,\n onKeyUp,\n hasError,\n readOnly,\n type,\n innerRef,\n clearable = false,\n leftComponent,\n rightComponent,\n value,\n ...rest\n}) => {\n const inputRef = useRef();\n const [maskedValue, setMaskedValue] = useState(value);\n\n const conform = useCallback(\n ({ rawValue, cursorPos, lastkeycode, shouldUpdateCursorPos = true }) => {\n const { nextMaskedValue, maskedPos } = conformValue(\n rawValue,\n cursorPos,\n lastkeycode,\n );\n const event = {\n target: {\n value: nextMaskedValue,\n originalValue: rawValue,\n },\n };\n if (onChange && nextMaskedValue !== maskedValue) onChange(event);\n\n setMaskedValue(nextMaskedValue);\n setRawValue(nextMaskedValue);\n\n if (shouldUpdateCursorPos) setCursorPosition({ current: maskedPos });\n },\n [maskedValue, onChange],\n );\n\n const handleOnChange = useCallback(\n (e) => {\n const { value: rawValue, selectionEnd } = e.target;\n setRawMask(rawValue);\n setRawValue(rawValue);\n setCursorPosition({ current: selectionEnd });\n setFocus(true);\n },\n [setRawMask, setRawValue, setCursorPosition, setFocus, lastkey.code],\n );\n\n useLayoutEffect(() => {\n if (focus) setCaretPosition(inputRef.current, cursorPosition.current);\n }, [focus, cursorPosition]);\n\n useLayoutEffect(() => {\n // if the value changes, then re-conform the mask\n conform({\n rawValue: value,\n cursorPos: cursorPosition.current,\n lastkeycode: lastkey.code,\n shouldUpdateCursorPos: focus,\n });\n }, [focus, value, cursorPosition.current]);\n\n const handleKeyDown = useCallback(\n (e) => {\n e.stopPropagation();\n setLastkey({ key: e.key, code: e.keyCode });\n onKeyDown(e);\n },\n [onKeyDown],\n );\n\n const handleBlur = useCallback(\n (e) => {\n setFocus(false);\n onBlur(e);\n },\n [onBlur],\n );\n\n return (\n <DSTextBox\n {...rest}\n className={className}\n clearable={clearable}\n disabled={disabled}\n fluidWidth={fluidWidth}\n hasError={hasError}\n innerRef={(ref) => {\n inputRef.current = ref;\n if (innerRef) innerRef(ref);\n }}\n isActive={focus}\n leftComponent={leftComponent}\n maxLength={maxLength}\n minLength={minLength}\n name={name}\n onBlur={handleBlur}\n onChange={handleOnChange}\n onClick={onClick}\n onFocus={onFocus}\n onKeyDown={handleKeyDown}\n onKeyUp={onKeyUp}\n onPaste={onPaste}\n placeholder={placeholder}\n readOnly={readOnly}\n rightComponent={rightComponent}\n style={style}\n type={type}\n value={maskedValue}\n />\n );\n};\n\nexport { PhoneInternationalInputMask };\nexport default PhoneInternationalInputMask;\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,35 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
import * as React from "react";
|
|
34
3
|
import React2, { useCallback, useLayoutEffect, useRef, useState } from "react";
|
|
35
4
|
import { DSTextBox } from "../../TextBox";
|
|
@@ -65,72 +34,40 @@ const conformValue = (rawValue, cursorPos, lastkeycode) => {
|
|
|
65
34
|
}
|
|
66
35
|
return { nextMaskedValue: nextMaskedValue.join(""), maskedPos };
|
|
67
36
|
};
|
|
68
|
-
const SsnInputMask = (
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
"focus",
|
|
103
|
-
"setFocus",
|
|
104
|
-
"setRawMask",
|
|
105
|
-
"cursorPosition",
|
|
106
|
-
"setCursorPosition",
|
|
107
|
-
"lastkey",
|
|
108
|
-
"setLastkey",
|
|
109
|
-
"setRawValue",
|
|
110
|
-
"style",
|
|
111
|
-
"disabled",
|
|
112
|
-
"className",
|
|
113
|
-
"name",
|
|
114
|
-
"maxLength",
|
|
115
|
-
"minLength",
|
|
116
|
-
"fluidWidth",
|
|
117
|
-
"placeholder",
|
|
118
|
-
"onKeyDown",
|
|
119
|
-
"onClick",
|
|
120
|
-
"onChange",
|
|
121
|
-
"onFocus",
|
|
122
|
-
"onBlur",
|
|
123
|
-
"onPaste",
|
|
124
|
-
"onKeyUp",
|
|
125
|
-
"hasError",
|
|
126
|
-
"readOnly",
|
|
127
|
-
"type",
|
|
128
|
-
"innerRef",
|
|
129
|
-
"clearable",
|
|
130
|
-
"leftComponent",
|
|
131
|
-
"rightComponent",
|
|
132
|
-
"value"
|
|
133
|
-
]);
|
|
37
|
+
const SsnInputMask = ({
|
|
38
|
+
focus,
|
|
39
|
+
setFocus,
|
|
40
|
+
setRawMask,
|
|
41
|
+
cursorPosition,
|
|
42
|
+
setCursorPosition,
|
|
43
|
+
lastkey,
|
|
44
|
+
setLastkey,
|
|
45
|
+
setRawValue,
|
|
46
|
+
style,
|
|
47
|
+
disabled,
|
|
48
|
+
className,
|
|
49
|
+
name,
|
|
50
|
+
maxLength,
|
|
51
|
+
minLength,
|
|
52
|
+
fluidWidth,
|
|
53
|
+
placeholder,
|
|
54
|
+
onKeyDown,
|
|
55
|
+
onClick,
|
|
56
|
+
onChange,
|
|
57
|
+
onFocus,
|
|
58
|
+
onBlur,
|
|
59
|
+
onPaste,
|
|
60
|
+
onKeyUp,
|
|
61
|
+
hasError,
|
|
62
|
+
readOnly,
|
|
63
|
+
type,
|
|
64
|
+
innerRef,
|
|
65
|
+
clearable = false,
|
|
66
|
+
leftComponent,
|
|
67
|
+
rightComponent,
|
|
68
|
+
value,
|
|
69
|
+
...rest
|
|
70
|
+
}) => {
|
|
134
71
|
const inputRef = useRef();
|
|
135
72
|
const [maskedValue, setMaskedValue] = useState(value);
|
|
136
73
|
const conform = useCallback(({ rawValue, cursorPos, lastkeycode, shouldUpdateCursorPos = true }) => {
|
|
@@ -176,7 +113,8 @@ const SsnInputMask = (_a) => {
|
|
|
176
113
|
setFocus(false);
|
|
177
114
|
onBlur(e);
|
|
178
115
|
}, [onBlur]);
|
|
179
|
-
return /* @__PURE__ */ React2.createElement(DSTextBox,
|
|
116
|
+
return /* @__PURE__ */ React2.createElement(DSTextBox, {
|
|
117
|
+
...rest,
|
|
180
118
|
className,
|
|
181
119
|
clearable,
|
|
182
120
|
disabled,
|
|
@@ -205,7 +143,7 @@ const SsnInputMask = (_a) => {
|
|
|
205
143
|
style,
|
|
206
144
|
type,
|
|
207
145
|
value: maskedValue
|
|
208
|
-
})
|
|
146
|
+
});
|
|
209
147
|
};
|
|
210
148
|
var SsnInputMask_default = SsnInputMask;
|
|
211
149
|
export {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/InputMask/mask_types/SsnInputMask.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport { DSTextBox } from '../../TextBox';\nimport { TCharsToAdd } from '../types';\nimport { setCaretPosition } from '../utils/setCaretPosition';\n\nconst conformValue = (rawValue, cursorPos, lastkeycode) => {\n const nextMaskedValue = rawValue\n .split('')\n .filter((char) => char >= '0' && char <= '9')\n .slice(0, 9);\n\n let maskedPos = 0;\n for (let i = 0; i < cursorPos; i += 1) {\n if (nextMaskedValue[maskedPos] === rawValue[i]) maskedPos += 1;\n }\n\n // list of [string to add, position to add]\nconst charactersToAdd: TCharsToAdd = [\n ['-', 3],\n ['-', 6],\n ];\n\n charactersToAdd.forEach(([chars, pos]) => {\n if (nextMaskedValue.length > pos) {\n nextMaskedValue.splice(pos, 0, ...chars);\n if (maskedPos >= pos) maskedPos += chars.length;\n }\n });\n\n if (lastkeycode !== 8 && maskedPos < nextMaskedValue.length) {\n charactersToAdd.forEach(([chars, pos]) => {\n if (maskedPos === pos) maskedPos += chars.length;\n });\n } else if (lastkeycode === 8 && maskedPos) {\n charactersToAdd.forEach(([chars, pos]) => {\n if (maskedPos === pos + 1) maskedPos -= chars.length;\n });\n }\n return { nextMaskedValue: nextMaskedValue.join(''), maskedPos };\n};\n\nconst SsnInputMask = ({\n focus,\n setFocus,\n setRawMask,\n cursorPosition,\n setCursorPosition,\n lastkey,\n setLastkey,\n setRawValue,\n style,\n disabled,\n className,\n name,\n maxLength,\n minLength,\n fluidWidth,\n placeholder,\n onKeyDown,\n onClick,\n onChange,\n onFocus,\n onBlur,\n onPaste,\n onKeyUp,\n hasError,\n readOnly,\n type,\n innerRef,\n clearable = false,\n leftComponent,\n rightComponent,\n value,\n ...rest\n}) => {\n const inputRef = useRef();\n const [maskedValue, setMaskedValue] = useState(value);\n\n const conform = useCallback(\n ({ rawValue, cursorPos, lastkeycode, shouldUpdateCursorPos = true }) => {\n const { nextMaskedValue, maskedPos } = conformValue(\n rawValue,\n cursorPos,\n lastkeycode,\n );\n const event = {\n target: {\n value: nextMaskedValue,\n originalValue: rawValue,\n },\n };\n if (onChange && nextMaskedValue !== maskedValue) onChange(event);\n\n setMaskedValue(nextMaskedValue);\n setRawValue(nextMaskedValue);\n\n if (shouldUpdateCursorPos) setCursorPosition({ current: maskedPos });\n },\n [maskedValue, onChange],\n );\n\n const handleOnChange = useCallback(\n (e) => {\n const { value: rawValue, selectionEnd } = e.target;\n setRawMask(rawValue);\n setRawValue(rawValue);\n setCursorPosition({ current: selectionEnd });\n setFocus(true);\n },\n [setRawMask, setRawValue, setCursorPosition, setFocus, lastkey.code],\n );\n\n useLayoutEffect(() => {\n if (focus) setCaretPosition(inputRef.current, cursorPosition.current);\n }, [focus, cursorPosition]);\n\n useLayoutEffect(() => {\n // if the value changes, then re-conform the mask\n conform({\n rawValue: value,\n cursorPos: cursorPosition.current,\n lastkeycode: lastkey.code,\n shouldUpdateCursorPos: focus,\n });\n }, [focus, value, cursorPosition.current]);\n\n const handleKeyDown = useCallback(\n (e) => {\n e.stopPropagation();\n setLastkey({ key: e.key, code: e.keyCode });\n onKeyDown(e);\n },\n [onKeyDown],\n );\n\n const handleBlur = useCallback(\n (e) => {\n setFocus(false);\n onBlur(e);\n },\n [onBlur],\n );\n\n return (\n <DSTextBox\n {...rest}\n className={className}\n clearable={clearable}\n disabled={disabled}\n fluidWidth={fluidWidth}\n hasError={hasError}\n innerRef={(ref) => {\n inputRef.current = ref;\n if (innerRef) innerRef(ref);\n }}\n isActive={focus}\n leftComponent={leftComponent}\n maxLength={maxLength}\n minLength={minLength}\n name={name}\n onBlur={handleBlur}\n onChange={handleOnChange}\n onClick={onClick}\n onFocus={onFocus}\n onKeyDown={handleKeyDown}\n onKeyUp={onKeyUp}\n onPaste={onPaste}\n placeholder={placeholder}\n readOnly={readOnly}\n rightComponent={rightComponent}\n style={style}\n type={type}\n value={maskedValue}\n />\n );\n};\n\nexport { SsnInputMask };\nexport default SsnInputMask;\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,35 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
-
var __spreadValues = (a, b) => {
|
|
10
|
-
for (var prop in b || (b = {}))
|
|
11
|
-
if (__hasOwnProp.call(b, prop))
|
|
12
|
-
__defNormalProp(a, prop, b[prop]);
|
|
13
|
-
if (__getOwnPropSymbols)
|
|
14
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
-
if (__propIsEnum.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
}
|
|
18
|
-
return a;
|
|
19
|
-
};
|
|
20
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
-
var __objRest = (source, exclude) => {
|
|
22
|
-
var target = {};
|
|
23
|
-
for (var prop in source)
|
|
24
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
-
target[prop] = source[prop];
|
|
26
|
-
if (source != null && __getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
}
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
2
|
import * as React from "react";
|
|
34
3
|
import React2, { useCallback, useLayoutEffect, useRef, useState } from "react";
|
|
35
4
|
import { DSTextBox } from "../../TextBox";
|
|
@@ -43,72 +12,40 @@ const conformValue = (rawValue, cursorPos) => {
|
|
|
43
12
|
}
|
|
44
13
|
return { nextMaskedValue: nextMaskedValue.join(""), maskedPos };
|
|
45
14
|
};
|
|
46
|
-
const UsZipCodeInputMask = (
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
"focus",
|
|
81
|
-
"setFocus",
|
|
82
|
-
"setRawMask",
|
|
83
|
-
"cursorPosition",
|
|
84
|
-
"setCursorPosition",
|
|
85
|
-
"lastkey",
|
|
86
|
-
"setLastkey",
|
|
87
|
-
"setRawValue",
|
|
88
|
-
"style",
|
|
89
|
-
"disabled",
|
|
90
|
-
"className",
|
|
91
|
-
"name",
|
|
92
|
-
"maxLength",
|
|
93
|
-
"minLength",
|
|
94
|
-
"fluidWidth",
|
|
95
|
-
"placeholder",
|
|
96
|
-
"onKeyDown",
|
|
97
|
-
"onClick",
|
|
98
|
-
"onChange",
|
|
99
|
-
"onFocus",
|
|
100
|
-
"onBlur",
|
|
101
|
-
"onPaste",
|
|
102
|
-
"onKeyUp",
|
|
103
|
-
"hasError",
|
|
104
|
-
"readOnly",
|
|
105
|
-
"type",
|
|
106
|
-
"innerRef",
|
|
107
|
-
"clearable",
|
|
108
|
-
"leftComponent",
|
|
109
|
-
"rightComponent",
|
|
110
|
-
"value"
|
|
111
|
-
]);
|
|
15
|
+
const UsZipCodeInputMask = ({
|
|
16
|
+
focus,
|
|
17
|
+
setFocus,
|
|
18
|
+
setRawMask,
|
|
19
|
+
cursorPosition,
|
|
20
|
+
setCursorPosition,
|
|
21
|
+
lastkey,
|
|
22
|
+
setLastkey,
|
|
23
|
+
setRawValue,
|
|
24
|
+
style,
|
|
25
|
+
disabled,
|
|
26
|
+
className,
|
|
27
|
+
name,
|
|
28
|
+
maxLength,
|
|
29
|
+
minLength,
|
|
30
|
+
fluidWidth,
|
|
31
|
+
placeholder,
|
|
32
|
+
onKeyDown,
|
|
33
|
+
onClick,
|
|
34
|
+
onChange,
|
|
35
|
+
onFocus,
|
|
36
|
+
onBlur,
|
|
37
|
+
onPaste,
|
|
38
|
+
onKeyUp,
|
|
39
|
+
hasError,
|
|
40
|
+
readOnly,
|
|
41
|
+
type,
|
|
42
|
+
innerRef,
|
|
43
|
+
clearable = false,
|
|
44
|
+
leftComponent,
|
|
45
|
+
rightComponent,
|
|
46
|
+
value,
|
|
47
|
+
...rest
|
|
48
|
+
}) => {
|
|
112
49
|
const inputRef = useRef();
|
|
113
50
|
const [maskedValue, setMaskedValue] = useState(value);
|
|
114
51
|
const conform = useCallback(({ rawValue, cursorPos, lastkeycode, shouldUpdateCursorPos = true }) => {
|
|
@@ -154,7 +91,8 @@ const UsZipCodeInputMask = (_a) => {
|
|
|
154
91
|
setFocus(false);
|
|
155
92
|
onBlur(e);
|
|
156
93
|
}, [onBlur]);
|
|
157
|
-
return /* @__PURE__ */ React2.createElement(DSTextBox,
|
|
94
|
+
return /* @__PURE__ */ React2.createElement(DSTextBox, {
|
|
95
|
+
...rest,
|
|
158
96
|
className,
|
|
159
97
|
clearable,
|
|
160
98
|
disabled,
|
|
@@ -183,7 +121,7 @@ const UsZipCodeInputMask = (_a) => {
|
|
|
183
121
|
style,
|
|
184
122
|
type,
|
|
185
123
|
value: maskedValue
|
|
186
|
-
})
|
|
124
|
+
});
|
|
187
125
|
};
|
|
188
126
|
var UsZipCodeInputMask_default = UsZipCodeInputMask;
|
|
189
127
|
export {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/InputMask/mask_types/UsZipCodeInputMask.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useCallback, useLayoutEffect, useRef, useState } from 'react';\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport { DSTextBox } from '../../TextBox';\nimport { setCaretPosition } from '../utils/setCaretPosition';\n\nconst conformValue = (rawValue: string, cursorPos: number) => {\n const nextMaskedValue = rawValue\n .split('')\n .filter((char) => char >= '0' && char <= '9')\n .slice(0, 5);\n\n let maskedPos = 0;\n for (let i = 0; i < cursorPos; i += 1) {\n if (nextMaskedValue[maskedPos] === rawValue[i]) maskedPos += 1;\n }\n return { nextMaskedValue: nextMaskedValue.join(''), maskedPos };\n};\n\nconst UsZipCodeInputMask = ({\n focus,\n setFocus,\n setRawMask,\n cursorPosition,\n setCursorPosition,\n lastkey,\n setLastkey,\n setRawValue,\n style,\n disabled,\n className,\n name,\n maxLength,\n minLength,\n fluidWidth,\n placeholder,\n onKeyDown,\n onClick,\n onChange,\n onFocus,\n onBlur,\n onPaste,\n onKeyUp,\n hasError,\n readOnly,\n type,\n innerRef,\n clearable = false,\n leftComponent,\n rightComponent,\n value,\n ...rest\n}) => {\n const inputRef = useRef();\n const [maskedValue, setMaskedValue] = useState(value);\n\n const conform = useCallback(\n ({ rawValue, cursorPos, lastkeycode, shouldUpdateCursorPos = true }) => {\n const { nextMaskedValue, maskedPos } = conformValue(rawValue, cursorPos);\n const event = {\n target: {\n value: nextMaskedValue,\n originalValue: rawValue,\n },\n };\n if (onChange && nextMaskedValue !== maskedValue) onChange(event);\n\n setMaskedValue(nextMaskedValue);\n setRawValue(nextMaskedValue);\n\n if (shouldUpdateCursorPos) setCursorPosition({ current: maskedPos });\n },\n [maskedValue, onChange],\n );\n\n const handleOnChange = useCallback(\n (e) => {\n const { value: rawValue, selectionEnd } = e.target;\n setRawMask(rawValue);\n setRawValue(rawValue);\n setCursorPosition({ current: selectionEnd });\n setFocus(true);\n },\n [setRawMask, setRawValue, setCursorPosition, setFocus, lastkey.code],\n );\n\n useLayoutEffect(() => {\n if (focus) setCaretPosition(inputRef.current, cursorPosition.current);\n }, [focus, cursorPosition]);\n\n useLayoutEffect(() => {\n // if the value changes, then re-conform the mask\n conform({\n rawValue: value,\n cursorPos: cursorPosition.current,\n lastkeycode: lastkey.code,\n shouldUpdateCursorPos: focus,\n });\n }, [focus, value, cursorPosition.current]);\n\n const handleKeyDown = useCallback(\n (e) => {\n e.stopPropagation();\n setLastkey({ key: e.key, code: e.keyCode });\n onKeyDown(e);\n },\n [onKeyDown],\n );\n\n const handleBlur = useCallback(\n (e) => {\n setFocus(false);\n onBlur(e);\n },\n [onBlur],\n );\n\n return (\n <DSTextBox\n {...rest}\n className={className}\n clearable={clearable}\n disabled={disabled}\n fluidWidth={fluidWidth}\n hasError={hasError}\n innerRef={(ref) => {\n inputRef.current = ref;\n if (innerRef) innerRef(ref);\n }}\n isActive={focus}\n leftComponent={leftComponent}\n maxLength={maxLength}\n minLength={minLength}\n name={name}\n onBlur={handleBlur}\n onChange={handleOnChange}\n onClick={onClick}\n onFocus={onFocus}\n onKeyDown={handleKeyDown}\n onKeyUp={onKeyUp}\n onPaste={onPaste}\n placeholder={placeholder}\n readOnly={readOnly}\n rightComponent={rightComponent}\n style={style}\n type={type}\n value={maskedValue}\n />\n );\n};\n\nexport { UsZipCodeInputMask };\nexport default UsZipCodeInputMask;\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|