@salutejs/plasma-new-hope 0.140.0-dev.0 → 0.141.0-canary.1418.10704444225.0
Sign up to get free protection for your applications and to get access to all the features.
- package/emotion/cjs/components/Mask/Mask.js +227 -0
- package/emotion/cjs/components/Mask/Mask.types.js +5 -0
- package/emotion/cjs/components/Mask/index.js +12 -0
- package/emotion/cjs/components/Mask/utils/constants.js +31 -0
- package/emotion/cjs/components/Mask/utils/createMask.js +50 -0
- package/emotion/cjs/components/Mask/utils/maskUtils.js +248 -0
- package/emotion/cjs/components/Mask/utils/parseMask.js +36 -0
- package/emotion/cjs/components/Mask/utils/processInput.js +52 -0
- package/emotion/cjs/components/Mask/utils/processMask.js +99 -0
- package/emotion/cjs/components/Mask/utils/selection.js +48 -0
- package/emotion/cjs/components/Mask/utils/types/input.types.js +5 -0
- package/emotion/cjs/components/Mask/utils/types/mask.types.js +5 -0
- package/emotion/cjs/components/Mask/utils/types/selectRange.types.js +5 -0
- package/emotion/cjs/examples/plasma_b2c/components/Mask/Mask.js +9 -0
- package/emotion/cjs/examples/plasma_b2c/components/Mask/Mask.stories.tsx +131 -0
- package/emotion/es/components/Mask/Mask.js +219 -0
- package/emotion/es/components/Mask/Mask.types.js +1 -0
- package/emotion/es/components/Mask/index.js +1 -0
- package/emotion/es/components/Mask/utils/constants.js +25 -0
- package/emotion/es/components/Mask/utils/createMask.js +44 -0
- package/emotion/es/components/Mask/utils/maskUtils.js +242 -0
- package/emotion/es/components/Mask/utils/parseMask.js +30 -0
- package/emotion/es/components/Mask/utils/processInput.js +46 -0
- package/emotion/es/components/Mask/utils/processMask.js +93 -0
- package/emotion/es/components/Mask/utils/selection.js +42 -0
- package/emotion/es/components/Mask/utils/types/input.types.js +1 -0
- package/emotion/es/components/Mask/utils/types/mask.types.js +1 -0
- package/emotion/es/components/Mask/utils/types/selectRange.types.js +1 -0
- package/emotion/es/examples/plasma_b2c/components/Mask/Mask.js +3 -0
- package/emotion/es/examples/plasma_b2c/components/Mask/Mask.stories.tsx +131 -0
- package/package.json +2 -2
- package/styled-components/cjs/components/Mask/Mask.js +227 -0
- package/styled-components/cjs/components/Mask/Mask.types.js +5 -0
- package/styled-components/cjs/components/Mask/index.js +12 -0
- package/styled-components/cjs/components/Mask/utils/constants.js +31 -0
- package/styled-components/cjs/components/Mask/utils/createMask.js +50 -0
- package/styled-components/cjs/components/Mask/utils/maskUtils.js +248 -0
- package/styled-components/cjs/components/Mask/utils/parseMask.js +36 -0
- package/styled-components/cjs/components/Mask/utils/processInput.js +52 -0
- package/styled-components/cjs/components/Mask/utils/processMask.js +99 -0
- package/styled-components/cjs/components/Mask/utils/selection.js +48 -0
- package/styled-components/cjs/components/Mask/utils/types/input.types.js +5 -0
- package/styled-components/cjs/components/Mask/utils/types/mask.types.js +5 -0
- package/styled-components/cjs/components/Mask/utils/types/selectRange.types.js +5 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Mask/Mask.js +9 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Mask/Mask.stories.tsx +131 -0
- package/styled-components/es/components/Mask/Mask.js +219 -0
- package/styled-components/es/components/Mask/Mask.types.js +1 -0
- package/styled-components/es/components/Mask/index.js +1 -0
- package/styled-components/es/components/Mask/utils/constants.js +25 -0
- package/styled-components/es/components/Mask/utils/createMask.js +44 -0
- package/styled-components/es/components/Mask/utils/maskUtils.js +242 -0
- package/styled-components/es/components/Mask/utils/parseMask.js +30 -0
- package/styled-components/es/components/Mask/utils/processInput.js +46 -0
- package/styled-components/es/components/Mask/utils/processMask.js +93 -0
- package/styled-components/es/components/Mask/utils/selection.js +42 -0
- package/styled-components/es/components/Mask/utils/types/input.types.js +1 -0
- package/styled-components/es/components/Mask/utils/types/mask.types.js +1 -0
- package/styled-components/es/components/Mask/utils/types/selectRange.types.js +1 -0
- package/styled-components/es/examples/plasma_b2c/components/Mask/Mask.js +3 -0
- package/styled-components/es/examples/plasma_b2c/components/Mask/Mask.stories.tsx +131 -0
- package/types/components/Mask/Mask.d.ts +5 -0
- package/types/components/Mask/Mask.d.ts.map +1 -0
- package/types/components/Mask/Mask.types.d.ts +48 -0
- package/types/components/Mask/Mask.types.d.ts.map +1 -0
- package/types/components/Mask/index.d.ts +3 -0
- package/types/components/Mask/index.d.ts.map +1 -0
- package/types/components/Mask/utils/constants.d.ts +15 -0
- package/types/components/Mask/utils/constants.d.ts.map +1 -0
- package/types/components/Mask/utils/createMask.d.ts +19 -0
- package/types/components/Mask/utils/createMask.d.ts.map +1 -0
- package/types/components/Mask/utils/maskUtils.d.ts +44 -0
- package/types/components/Mask/utils/maskUtils.d.ts.map +1 -0
- package/types/components/Mask/utils/parseMask.d.ts +3 -0
- package/types/components/Mask/utils/parseMask.d.ts.map +1 -0
- package/types/components/Mask/utils/processInput.d.ts +15 -0
- package/types/components/Mask/utils/processInput.d.ts.map +1 -0
- package/types/components/Mask/utils/processMask.d.ts +9 -0
- package/types/components/Mask/utils/processMask.d.ts.map +1 -0
- package/types/components/Mask/utils/selection.d.ts +11 -0
- package/types/components/Mask/utils/selection.d.ts.map +1 -0
- package/types/components/Mask/utils/types/input.types.d.ts +26 -0
- package/types/components/Mask/utils/types/input.types.d.ts.map +1 -0
- package/types/components/Mask/utils/types/mask.types.d.ts +9 -0
- package/types/components/Mask/utils/types/mask.types.d.ts.map +1 -0
- package/types/components/Mask/utils/types/selectRange.types.d.ts +5 -0
- package/types/components/Mask/utils/types/selectRange.types.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/Mask/Mask.d.ts +191 -0
- package/types/examples/plasma_b2c/components/Mask/Mask.d.ts.map +1 -0
@@ -0,0 +1,227 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
5
|
+
value: true
|
6
|
+
});
|
7
|
+
exports.composeMask = void 0;
|
8
|
+
var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
|
9
|
+
var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
|
10
|
+
var _utils = /*#__PURE__*/require("../../utils");
|
11
|
+
var _createMask = /*#__PURE__*/require("./utils/createMask");
|
12
|
+
var _constants = /*#__PURE__*/require("./utils/constants");
|
13
|
+
var _excluded = ["mask", "maskChar", "alwaysShowMask", "maskString", "showPrefix", "value", "defaultValue", "showMask", "onChange", "onValueChange", "onBlur", "onFocus", "reformat"];
|
14
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
15
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
16
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
17
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
18
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
19
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
20
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
21
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
22
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
23
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
24
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
25
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
26
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
27
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
28
|
+
var composeMask = exports.composeMask = function composeMask(InputComponent) {
|
29
|
+
return /*#__PURE__*/(0, _react.forwardRef)(function (props, outerRef) {
|
30
|
+
var maskValue = props.mask,
|
31
|
+
maskChar = props.maskChar,
|
32
|
+
alwaysShowMask = props.alwaysShowMask,
|
33
|
+
maskString = props.maskString,
|
34
|
+
showPrefix = props.showPrefix,
|
35
|
+
value = props.value,
|
36
|
+
defaultValue = props.defaultValue,
|
37
|
+
showMaskedValue = props.showMask,
|
38
|
+
onChange = props.onChange,
|
39
|
+
onValueChange = props.onValueChange,
|
40
|
+
onBlur = props.onBlur,
|
41
|
+
onFocus = props.onFocus,
|
42
|
+
reformat = props.reformat,
|
43
|
+
rest = _objectWithoutProperties(props, _excluded);
|
44
|
+
var mask = (0, _react.useMemo)(function () {
|
45
|
+
return (0, _createMask.createMask)({
|
46
|
+
value: String(value) || String(defaultValue) || '',
|
47
|
+
mask: maskValue,
|
48
|
+
maskChar: maskChar || _createMask.defaults.maskChar,
|
49
|
+
maskString: maskString,
|
50
|
+
showPrefix: showPrefix || _createMask.defaults.showPrefix,
|
51
|
+
reformat: reformat
|
52
|
+
});
|
53
|
+
}, []);
|
54
|
+
var firstRender = (0, _react.useRef)(true);
|
55
|
+
var canSetSelection = (0, _react.useRef)(false);
|
56
|
+
var inputRef = (0, _react.useRef)(null);
|
57
|
+
var innerRef = (0, _plasmaCore.useForkRef)(inputRef, outerRef);
|
58
|
+
var _useState = (0, _react.useState)(alwaysShowMask || showMaskedValue),
|
59
|
+
_useState2 = _slicedToArray(_useState, 2),
|
60
|
+
showMask = _useState2[0],
|
61
|
+
setShowMask = _useState2[1];
|
62
|
+
var getSelection = (0, _react.useCallback)(function () {
|
63
|
+
var _inputRef$current, _inputRef$current2;
|
64
|
+
mask.setSelection = {
|
65
|
+
start: (inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.selectionStart) || 0,
|
66
|
+
end: (inputRef === null || inputRef === void 0 || (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.selectionEnd) || 0
|
67
|
+
};
|
68
|
+
}, [mask]);
|
69
|
+
var setSelection = (0, _react.useCallback)(function () {
|
70
|
+
var _inputRef$current3;
|
71
|
+
if (!canSetSelection.current) {
|
72
|
+
return;
|
73
|
+
}
|
74
|
+
var selection = mask.getSelection;
|
75
|
+
inputRef === null || inputRef === void 0 || (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.setSelectionRange(selection.start, selection.end);
|
76
|
+
var raf = function raf(fn) {
|
77
|
+
return setTimeout(fn, 0);
|
78
|
+
};
|
79
|
+
if (_utils.canUseDOM && window.requestAnimationFrame) {
|
80
|
+
raf = window.requestAnimationFrame;
|
81
|
+
}
|
82
|
+
raf(function () {
|
83
|
+
var _inputRef$current4;
|
84
|
+
return inputRef === null || inputRef === void 0 || (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.setSelectionRange(selection.start, selection.end);
|
85
|
+
});
|
86
|
+
}, [mask]);
|
87
|
+
var showValue = (0, _react.useCallback)(function () {
|
88
|
+
if (!(inputRef !== null && inputRef !== void 0 && inputRef.current)) {
|
89
|
+
return;
|
90
|
+
}
|
91
|
+
if (showMask && (canSetSelection.current || alwaysShowMask)) {
|
92
|
+
inputRef.current.value = mask.getState.maskedValue;
|
93
|
+
return;
|
94
|
+
}
|
95
|
+
inputRef.current.value = mask.getState.visibleValue;
|
96
|
+
}, [showMask, alwaysShowMask, mask]);
|
97
|
+
var keyPressPropName = (0, _react.useCallback)(function () {
|
98
|
+
if (typeof navigator !== 'undefined' && navigator.userAgent.match(/Android/i)) {
|
99
|
+
return 'onBeforeInput';
|
100
|
+
}
|
101
|
+
return 'onKeyPress';
|
102
|
+
}, []);
|
103
|
+
var dispatchEvent = function dispatchEvent(e) {
|
104
|
+
onChange && onChange(e);
|
105
|
+
var _mask$getState = mask.getState,
|
106
|
+
maskedValue = _mask$getState.maskedValue,
|
107
|
+
visibleValue = _mask$getState.visibleValue;
|
108
|
+
onValueChange && onValueChange({
|
109
|
+
maskedValue: maskedValue,
|
110
|
+
value: visibleValue
|
111
|
+
});
|
112
|
+
};
|
113
|
+
var onPaste = function onPaste(e) {
|
114
|
+
e.preventDefault();
|
115
|
+
getSelection();
|
116
|
+
if (!(e !== null && e !== void 0 && e.clipboardData)) {
|
117
|
+
return;
|
118
|
+
}
|
119
|
+
mask.paste(e.clipboardData.getData('Text'));
|
120
|
+
setTimeout(setSelection, 0);
|
121
|
+
dispatchEvent(e);
|
122
|
+
};
|
123
|
+
var handleChange = function handleChange(e) {
|
124
|
+
var currentValue;
|
125
|
+
if (showMask && (canSetSelection.current || alwaysShowMask)) {
|
126
|
+
currentValue = mask.getState.maskedValue;
|
127
|
+
} else {
|
128
|
+
currentValue = mask.getState.visibleValue;
|
129
|
+
}
|
130
|
+
if (e.target.value !== currentValue) {
|
131
|
+
getSelection();
|
132
|
+
mask.updateValue(e.target.value);
|
133
|
+
setTimeout(setSelection, 0);
|
134
|
+
}
|
135
|
+
dispatchEvent(e);
|
136
|
+
};
|
137
|
+
var onKeyPress = function onKeyPress(e) {
|
138
|
+
if (e.metaKey || e.altKey || e.ctrlKey || e.key === 'Enter') {
|
139
|
+
return;
|
140
|
+
}
|
141
|
+
e.preventDefault();
|
142
|
+
getSelection();
|
143
|
+
mask.input(e.key || String.fromCharCode(e.which));
|
144
|
+
setSelection();
|
145
|
+
dispatchEvent(e);
|
146
|
+
};
|
147
|
+
var onKeyDown = function onKeyDown(e) {
|
148
|
+
if (e.keyCode === _constants.KeyboardCode.Backspace) {
|
149
|
+
e.preventDefault();
|
150
|
+
getSelection();
|
151
|
+
mask.removePreviosOrSelected();
|
152
|
+
setSelection();
|
153
|
+
dispatchEvent(e);
|
154
|
+
}
|
155
|
+
if (e.keyCode === _constants.KeyboardCode.Delete) {
|
156
|
+
e.preventDefault();
|
157
|
+
getSelection();
|
158
|
+
mask.removeNextOrSelected();
|
159
|
+
setSelection();
|
160
|
+
dispatchEvent(e);
|
161
|
+
}
|
162
|
+
};
|
163
|
+
var handleFocus = function handleFocus(e) {
|
164
|
+
canSetSelection.current = true;
|
165
|
+
onFocus && onFocus(e);
|
166
|
+
};
|
167
|
+
var handleBlur = function handleBlur(e) {
|
168
|
+
canSetSelection.current = false;
|
169
|
+
onBlur && onBlur(e);
|
170
|
+
};
|
171
|
+
var keyPressEvent = _defineProperty({}, keyPressPropName(), onKeyPress);
|
172
|
+
(0, _react.useEffect)(function () {
|
173
|
+
if (!firstRender.current) {
|
174
|
+
setShowMask(alwaysShowMask || showMask);
|
175
|
+
}
|
176
|
+
}, [alwaysShowMask, showMask]);
|
177
|
+
(0, _react.useEffect)(function () {
|
178
|
+
if (!firstRender.current && reformat) {
|
179
|
+
mask.updateReformat(reformat);
|
180
|
+
}
|
181
|
+
}, [reformat]);
|
182
|
+
(0, _react.useEffect)(function () {
|
183
|
+
if (!firstRender.current) {
|
184
|
+
mask.updateMask(String(mask));
|
185
|
+
}
|
186
|
+
}, [mask]);
|
187
|
+
(0, _react.useEffect)(function () {
|
188
|
+
if (!firstRender.current) {
|
189
|
+
mask.updateMaskString(String(maskString));
|
190
|
+
}
|
191
|
+
}, [maskString]);
|
192
|
+
(0, _react.useEffect)(function () {
|
193
|
+
if (!firstRender.current) {
|
194
|
+
mask.updateMaskChar(String(maskChar));
|
195
|
+
}
|
196
|
+
}, [maskChar]);
|
197
|
+
(0, _react.useEffect)(function () {
|
198
|
+
if (!firstRender.current) {
|
199
|
+
mask.updateValue(String(value));
|
200
|
+
}
|
201
|
+
}, [value]);
|
202
|
+
(0, _react.useEffect)(function () {
|
203
|
+
firstRender.current = false;
|
204
|
+
showValue();
|
205
|
+
}, [firstRender.current, mask]);
|
206
|
+
(0, _react.useEffect)(function () {
|
207
|
+
var subscriber = function subscriber() {
|
208
|
+
showValue();
|
209
|
+
setSelection();
|
210
|
+
};
|
211
|
+
mask.subscribe(subscriber);
|
212
|
+
return function () {
|
213
|
+
mask.unsubscribe(subscriber);
|
214
|
+
};
|
215
|
+
}, [mask, showValue, setSelection]);
|
216
|
+
return /*#__PURE__*/_react["default"].createElement(InputComponent, _extends({}, rest, {
|
217
|
+
onChange: handleChange,
|
218
|
+
onKeyDown: onKeyDown,
|
219
|
+
onPaste: onPaste,
|
220
|
+
onFocus: handleFocus,
|
221
|
+
onBlur: handleBlur
|
222
|
+
}, keyPressEvent, {
|
223
|
+
ref: innerRef,
|
224
|
+
autoComplete: "off"
|
225
|
+
}));
|
226
|
+
});
|
227
|
+
};
|
@@ -0,0 +1,12 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
Object.defineProperty(exports, "composeMask", {
|
7
|
+
enumerable: true,
|
8
|
+
get: function get() {
|
9
|
+
return _Mask.composeMask;
|
10
|
+
}
|
11
|
+
});
|
12
|
+
var _Mask = /*#__PURE__*/require("./Mask");
|
@@ -0,0 +1,31 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.escapeChar = exports.defaultFormatChars = exports.KeyboardCode = exports.CharType = void 0;
|
7
|
+
var CharType = exports.CharType = /*#__PURE__*/function (CharType) {
|
8
|
+
CharType[CharType["User"] = 1] = "User";
|
9
|
+
CharType[CharType["Char"] = 2] = "Char";
|
10
|
+
CharType[CharType["Mask"] = 3] = "Mask";
|
11
|
+
return CharType;
|
12
|
+
}({});
|
13
|
+
var KeyboardCode = exports.KeyboardCode = /*#__PURE__*/function (KeyboardCode) {
|
14
|
+
KeyboardCode[KeyboardCode["Backspace"] = 8] = "Backspace";
|
15
|
+
KeyboardCode[KeyboardCode["Delete"] = 46] = "Delete";
|
16
|
+
return KeyboardCode;
|
17
|
+
}({});
|
18
|
+
var escapeChar = exports.escapeChar = '\\';
|
19
|
+
var defaultFormatChars = exports.defaultFormatChars = [{
|
20
|
+
str: '0',
|
21
|
+
regexp: /[0-9]/
|
22
|
+
}, {
|
23
|
+
str: '*',
|
24
|
+
regexp: /./
|
25
|
+
}, {
|
26
|
+
str: 'a',
|
27
|
+
regexp: /[a-zA-Z]/
|
28
|
+
}, {
|
29
|
+
str: 'я',
|
30
|
+
regexp: /[а-яА-ЯёЁ]/
|
31
|
+
}];
|
@@ -0,0 +1,50 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.defaults = exports.createMask = void 0;
|
7
|
+
var _constants = /*#__PURE__*/require("./constants");
|
8
|
+
var _maskUtils = /*#__PURE__*/require("./maskUtils");
|
9
|
+
var _selection = /*#__PURE__*/require("./selection");
|
10
|
+
var defaults = exports.defaults = {
|
11
|
+
maskFormat: _constants.defaultFormatChars,
|
12
|
+
maskChar: '',
|
13
|
+
showMask: false,
|
14
|
+
removeSelectedRange: _selection.removeSelectedRange,
|
15
|
+
showPrefix: false
|
16
|
+
};
|
17
|
+
var createMask = exports.createMask = function createMask(params) {
|
18
|
+
var _params$mask;
|
19
|
+
var maskString = params.maskString,
|
20
|
+
_params$showPrefix = params.showPrefix,
|
21
|
+
showPrefix = _params$showPrefix === void 0 ? defaults.showPrefix : _params$showPrefix,
|
22
|
+
_params$maskChar = params.maskChar,
|
23
|
+
maskChar = _params$maskChar === void 0 ? defaults.maskChar : _params$maskChar,
|
24
|
+
reformat = params.reformat;
|
25
|
+
var resReformat = reformat;
|
26
|
+
if (!reformat && !params.mask) {
|
27
|
+
resReformat = function resReformat(args) {
|
28
|
+
var str = args.value.map(function (item) {
|
29
|
+
return item["char"];
|
30
|
+
}).join('');
|
31
|
+
return {
|
32
|
+
value: args.value,
|
33
|
+
visibleValue: str,
|
34
|
+
maskedValue: str,
|
35
|
+
selection: args.selection
|
36
|
+
};
|
37
|
+
};
|
38
|
+
} else if (reformat && params.mask) {
|
39
|
+
params.mask = undefined;
|
40
|
+
}
|
41
|
+
if (maskString && maskString.length !== (params === null || params === void 0 || (_params$mask = params.mask) === null || _params$mask === void 0 ? void 0 : _params$mask.length)) {
|
42
|
+
throw new Error('maskString должна быть такой же длины как и mask');
|
43
|
+
}
|
44
|
+
if (maskChar.length > 1) {
|
45
|
+
throw new Error('maskChar должен содержать только 1 символ');
|
46
|
+
}
|
47
|
+
var maskUtils = new _maskUtils.MaskUtils(showPrefix, maskChar, maskString, resReformat);
|
48
|
+
maskUtils.updateMask(params.mask || undefined);
|
49
|
+
return maskUtils;
|
50
|
+
};
|
@@ -0,0 +1,248 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.MaskUtils = void 0;
|
7
|
+
var _constants = /*#__PURE__*/require("./constants");
|
8
|
+
var _parseMask = /*#__PURE__*/require("./parseMask");
|
9
|
+
var _processInput = /*#__PURE__*/require("./processInput");
|
10
|
+
var _selection = /*#__PURE__*/require("./selection");
|
11
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
12
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
13
|
+
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
|
14
|
+
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
15
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
16
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
17
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
18
|
+
var MaskUtils = exports.MaskUtils = /*#__PURE__*/function () {
|
19
|
+
function MaskUtils(showPrefix, maskChar, maskString, reformat) {
|
20
|
+
_classCallCheck(this, MaskUtils);
|
21
|
+
_defineProperty(this, "selection", void 0);
|
22
|
+
_defineProperty(this, "value", void 0);
|
23
|
+
_defineProperty(this, "maskedValue", void 0);
|
24
|
+
_defineProperty(this, "visibleValue", void 0);
|
25
|
+
_defineProperty(this, "mask", void 0);
|
26
|
+
_defineProperty(this, "maskChar", void 0);
|
27
|
+
_defineProperty(this, "maskFormatMap", void 0);
|
28
|
+
_defineProperty(this, "showPrefix", void 0);
|
29
|
+
_defineProperty(this, "callbacks", void 0);
|
30
|
+
_defineProperty(this, "maskString", void 0);
|
31
|
+
_defineProperty(this, "reformat", void 0);
|
32
|
+
this.value = '';
|
33
|
+
this.mask = [];
|
34
|
+
this.maskedValue = '';
|
35
|
+
this.visibleValue = '';
|
36
|
+
this.selection = {
|
37
|
+
start: 0,
|
38
|
+
end: 0
|
39
|
+
};
|
40
|
+
this.callbacks = [];
|
41
|
+
this.maskFormatMap = this.parseMaskFormat;
|
42
|
+
this.showPrefix = showPrefix;
|
43
|
+
this.maskChar = maskChar;
|
44
|
+
this.maskString = maskString;
|
45
|
+
this.reformat = reformat;
|
46
|
+
}
|
47
|
+
return _createClass(MaskUtils, [{
|
48
|
+
key: "parseMaskFormat",
|
49
|
+
get: function get() {
|
50
|
+
return _constants.defaultFormatChars.reduce(function (acc, current) {
|
51
|
+
acc[String(current.str)] = current;
|
52
|
+
return acc;
|
53
|
+
}, {});
|
54
|
+
}
|
55
|
+
}, {
|
56
|
+
key: "getSelection",
|
57
|
+
get: function get() {
|
58
|
+
var _this$selection = this.selection,
|
59
|
+
start = _this$selection.start,
|
60
|
+
end = _this$selection.end;
|
61
|
+
return {
|
62
|
+
start: start,
|
63
|
+
end: end
|
64
|
+
};
|
65
|
+
}
|
66
|
+
}, {
|
67
|
+
key: "getState",
|
68
|
+
get: function get() {
|
69
|
+
return {
|
70
|
+
value: this.value,
|
71
|
+
maskedValue: this.maskedValue,
|
72
|
+
visibleValue: this.visibleValue,
|
73
|
+
selection: this.selection
|
74
|
+
};
|
75
|
+
}
|
76
|
+
}, {
|
77
|
+
key: "setSelection",
|
78
|
+
set: function set(newSelection) {
|
79
|
+
this.selection = newSelection;
|
80
|
+
}
|
81
|
+
}, {
|
82
|
+
key: "setShowStartChars",
|
83
|
+
set: function set(show) {
|
84
|
+
this.showPrefix = show;
|
85
|
+
}
|
86
|
+
}, {
|
87
|
+
key: "updateMask",
|
88
|
+
value: function updateMask(newMask) {
|
89
|
+
this.mask = (0, _parseMask.parseMask)(newMask, this.maskFormatMap);
|
90
|
+
this.updateValue(this.value);
|
91
|
+
}
|
92
|
+
}, {
|
93
|
+
key: "updateMaskChar",
|
94
|
+
value: function updateMaskChar(newMaskChar) {
|
95
|
+
if (this.maskChar.length > 1) {
|
96
|
+
throw new Error('maskChar must have only 1 char');
|
97
|
+
}
|
98
|
+
this.maskChar = newMaskChar;
|
99
|
+
this.updateValue(this.value);
|
100
|
+
}
|
101
|
+
}, {
|
102
|
+
key: "updateMaskString",
|
103
|
+
value: function updateMaskString(newMaskString) {
|
104
|
+
if (newMaskString && newMaskString.length !== this.mask.length) {
|
105
|
+
throw new Error('maskString must have the same length as mask');
|
106
|
+
}
|
107
|
+
this.maskString = newMaskString;
|
108
|
+
this.updateValue(this.value);
|
109
|
+
}
|
110
|
+
}, {
|
111
|
+
key: "updateReformat",
|
112
|
+
value: function updateReformat(newReformat) {
|
113
|
+
this.reformat = newReformat;
|
114
|
+
this.updateValue(this.value);
|
115
|
+
}
|
116
|
+
}, {
|
117
|
+
key: "updateValue",
|
118
|
+
value: function updateValue(data) {
|
119
|
+
var result;
|
120
|
+
if (this.reformat) {
|
121
|
+
result = this.reformat({
|
122
|
+
value: data,
|
123
|
+
selection: this.selection
|
124
|
+
});
|
125
|
+
} else {
|
126
|
+
var dataList;
|
127
|
+
if (Array.isArray(data)) {
|
128
|
+
dataList = data;
|
129
|
+
} else {
|
130
|
+
dataList = [];
|
131
|
+
for (var i = 0; i < data.length; i++) {
|
132
|
+
dataList.push({
|
133
|
+
"char": data[i],
|
134
|
+
type: _constants.CharType.User
|
135
|
+
});
|
136
|
+
}
|
137
|
+
}
|
138
|
+
result = (0, _processInput.processInput)({
|
139
|
+
data: dataList,
|
140
|
+
selection: this.selection,
|
141
|
+
mask: this.mask,
|
142
|
+
maskChar: this.maskChar,
|
143
|
+
maskString: this.maskString,
|
144
|
+
showPrefix: this.showPrefix
|
145
|
+
});
|
146
|
+
}
|
147
|
+
this.applyChanges(result);
|
148
|
+
}
|
149
|
+
}, {
|
150
|
+
key: "removePreviosOrSelected",
|
151
|
+
value: function removePreviosOrSelected() {
|
152
|
+
var _this$selection2 = this.selection,
|
153
|
+
start = _this$selection2.start,
|
154
|
+
end = _this$selection2.end;
|
155
|
+
if (start === end) {
|
156
|
+
var newStart = end - 1 < 0 ? 0 : end - 1;
|
157
|
+
this.setSelection = {
|
158
|
+
start: newStart,
|
159
|
+
end: end
|
160
|
+
};
|
161
|
+
}
|
162
|
+
this.input('');
|
163
|
+
}
|
164
|
+
}, {
|
165
|
+
key: "removeNextOrSelected",
|
166
|
+
value: function removeNextOrSelected() {
|
167
|
+
var _this$selection3 = this.selection,
|
168
|
+
start = _this$selection3.start,
|
169
|
+
end = _this$selection3.end;
|
170
|
+
if (start === end) {
|
171
|
+
this.setSelection = {
|
172
|
+
start: start,
|
173
|
+
end: end + 1
|
174
|
+
};
|
175
|
+
}
|
176
|
+
this.input('');
|
177
|
+
}
|
178
|
+
}, {
|
179
|
+
key: "paste",
|
180
|
+
value: function paste(value) {
|
181
|
+
this.input(value);
|
182
|
+
}
|
183
|
+
}, {
|
184
|
+
key: "input",
|
185
|
+
value: function input(_input) {
|
186
|
+
var result;
|
187
|
+
if (this.reformat) {
|
188
|
+
result = this.reformat({
|
189
|
+
value: this.value,
|
190
|
+
input: _input,
|
191
|
+
selection: this.selection
|
192
|
+
});
|
193
|
+
} else {
|
194
|
+
var tmpValue = (0, _selection.removeSelectedRange)({
|
195
|
+
value: this.value,
|
196
|
+
selection: this.selection,
|
197
|
+
maskChar: this.maskChar,
|
198
|
+
maskString: String(this.maskString)
|
199
|
+
});
|
200
|
+
this.selection.end = this.selection.start;
|
201
|
+
result = (0, _processInput.processInput)({
|
202
|
+
data: tmpValue,
|
203
|
+
input: _input,
|
204
|
+
selection: this.selection,
|
205
|
+
mask: this.mask,
|
206
|
+
maskChar: this.maskChar,
|
207
|
+
maskString: this.maskString,
|
208
|
+
showPrefix: this.showPrefix
|
209
|
+
});
|
210
|
+
}
|
211
|
+
this.applyChanges(result);
|
212
|
+
}
|
213
|
+
}, {
|
214
|
+
key: "applyChanges",
|
215
|
+
value: function applyChanges(result) {
|
216
|
+
var oldMaskedValue = this.maskedValue;
|
217
|
+
var oldVisibleValue = this.visibleValue;
|
218
|
+
var oldSelection = this.selection;
|
219
|
+
this.value = result.value;
|
220
|
+
this.maskedValue = result.maskedValue;
|
221
|
+
this.visibleValue = result.visibleValue;
|
222
|
+
this.setSelection = result.selection;
|
223
|
+
if (oldMaskedValue !== this.maskedValue || oldVisibleValue !== this.visibleValue || oldSelection.start !== this.selection.start || oldSelection.end !== this.selection.end) {
|
224
|
+
this.notify();
|
225
|
+
}
|
226
|
+
}
|
227
|
+
}, {
|
228
|
+
key: "subscribe",
|
229
|
+
value: function subscribe(callback) {
|
230
|
+
this.callbacks.push(callback);
|
231
|
+
}
|
232
|
+
}, {
|
233
|
+
key: "unsubscribe",
|
234
|
+
value: function unsubscribe(callback) {
|
235
|
+
this.callbacks = this.callbacks.filter(function (item) {
|
236
|
+
return item !== callback;
|
237
|
+
});
|
238
|
+
}
|
239
|
+
}, {
|
240
|
+
key: "notify",
|
241
|
+
value: function notify() {
|
242
|
+
var state = this.getState;
|
243
|
+
this.callbacks.forEach(function (callback) {
|
244
|
+
callback(state);
|
245
|
+
});
|
246
|
+
}
|
247
|
+
}]);
|
248
|
+
}();
|
@@ -0,0 +1,36 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.parseMask = void 0;
|
7
|
+
var _constants = /*#__PURE__*/require("./constants");
|
8
|
+
var parseMask = exports.parseMask = function parseMask(mask, format) {
|
9
|
+
if (!mask) {
|
10
|
+
return [];
|
11
|
+
}
|
12
|
+
var stack = [];
|
13
|
+
var escape = false;
|
14
|
+
mask.split('').forEach(function (maskChar) {
|
15
|
+
var item = format === null || format === void 0 ? void 0 : format[maskChar];
|
16
|
+
if (escape && item) {
|
17
|
+
item = undefined;
|
18
|
+
escape = false;
|
19
|
+
}
|
20
|
+
if (!item) {
|
21
|
+
if (!escape && maskChar === _constants.escapeChar) {
|
22
|
+
escape = true;
|
23
|
+
return;
|
24
|
+
}
|
25
|
+
escape = false;
|
26
|
+
stack.push({
|
27
|
+
"char": maskChar
|
28
|
+
});
|
29
|
+
return;
|
30
|
+
}
|
31
|
+
if (item.regexp) {
|
32
|
+
stack.push(item);
|
33
|
+
}
|
34
|
+
});
|
35
|
+
return stack;
|
36
|
+
};
|
@@ -0,0 +1,52 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.processInput = void 0;
|
7
|
+
var _constants = /*#__PURE__*/require("./constants");
|
8
|
+
var _processMask2 = /*#__PURE__*/require("./processMask");
|
9
|
+
var processInput = exports.processInput = function processInput(args) {
|
10
|
+
var data = args.data,
|
11
|
+
_args$input = args.input,
|
12
|
+
input = _args$input === void 0 ? '' : _args$input,
|
13
|
+
selection = args.selection,
|
14
|
+
mask = args.mask,
|
15
|
+
_args$maskChar = args.maskChar,
|
16
|
+
maskChar = _args$maskChar === void 0 ? '' : _args$maskChar,
|
17
|
+
_args$maskString = args.maskString,
|
18
|
+
maskString = _args$maskString === void 0 ? '' : _args$maskString,
|
19
|
+
showPrefix = args.showPrefix;
|
20
|
+
var _processMask = (0, _processMask2.processMask)(data, mask, input, maskChar, maskString, selection),
|
21
|
+
value = _processMask.value,
|
22
|
+
maskedValue = _processMask.maskedValue,
|
23
|
+
inputValuesApplied = _processMask.inputValuesApplied;
|
24
|
+
var selectionPosition = selection.start + inputValuesApplied;
|
25
|
+
var bound = value.length - 1;
|
26
|
+
var charsCount = 0;
|
27
|
+
while (bound >= 0 && value[bound].type !== _constants.CharType.User) {
|
28
|
+
if (value[bound].type === _constants.CharType.Mask) {
|
29
|
+
charsCount = 0;
|
30
|
+
}
|
31
|
+
if (value[bound].type === _constants.CharType.Char) {
|
32
|
+
charsCount++;
|
33
|
+
}
|
34
|
+
bound--;
|
35
|
+
}
|
36
|
+
if (showPrefix || bound >= 0 || input && input.trim()) {
|
37
|
+
bound += charsCount;
|
38
|
+
}
|
39
|
+
var visibleValue = '';
|
40
|
+
for (var i = 0; i <= bound; i++) {
|
41
|
+
visibleValue += value[i]["char"];
|
42
|
+
}
|
43
|
+
return {
|
44
|
+
value: value,
|
45
|
+
visibleValue: visibleValue,
|
46
|
+
maskedValue: maskedValue,
|
47
|
+
selection: {
|
48
|
+
start: selectionPosition,
|
49
|
+
end: selectionPosition
|
50
|
+
}
|
51
|
+
};
|
52
|
+
};
|