UNPKG

react-native-advanced-input-mask

Version:

Text input mask for React Native on iOS, Android and web. Synchronous and easy formatting without hustle

121 lines (120 loc) 5.31 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _react = _interopRequireWildcard(require("react")); var _reactNative = require("react-native"); var _architecture = require("../../architecture"); var _AdvancedTextInputMaskDecoratorViewNativeComponent = _interopRequireWildcard(require("../../specs/AdvancedTextInputMaskDecoratorViewNativeComponent")); function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); } function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } const styles = _reactNative.StyleSheet.create({ displayNone: { display: "none" }, farAway: { position: "absolute", top: 1e8, left: 1e8 } }); const MaskedTextInput = /*#__PURE__*/(0, _react.forwardRef)(({ affinityCalculationStrategy, affinityFormat, allowSuggestions, allowedKeys, autocomplete, autocompleteOnFocus, autoSkip, customNotations, customTransformation, defaultValue, isRTL, mask, autoCapitalize = "words", value, onChangeText, onTailPlaceholderChange, renderTextInputComponent, validationRegex, ...rest }, ref) => { const inputRef = (0, _react.useRef)(null); const maskedViewDecoratorRef = (0, _react.useRef)(null); const InputComponent = renderTextInputComponent ?? _reactNative.TextInput; (0, _react.useImperativeHandle)(ref, () => { return { isFocused: () => { var _inputRef$current; return !!((_inputRef$current = inputRef.current) !== null && _inputRef$current !== void 0 && _inputRef$current.isFocused()); }, blur: () => { var _inputRef$current2; (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.blur(); }, focus: () => { var _inputRef$current3; (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.focus(); }, setNativeProps: props => { var _inputRef$current4; (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 || _inputRef$current4.setNativeProps(props); }, clear: () => { if (maskedViewDecoratorRef.current) { // @ts-expect-error the type is correct _AdvancedTextInputMaskDecoratorViewNativeComponent.Commands.setText(maskedViewDecoratorRef.current, "", false); } }, setSelection: (start, end) => { var _inputRef$current5; (_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 || _inputRef$current5.setSelection(start, end); }, setText: (text, autoComplete) => { if (maskedViewDecoratorRef.current) { _AdvancedTextInputMaskDecoratorViewNativeComponent.Commands.setText( // @ts-expect-error the type is correct maskedViewDecoratorRef.current, text, !!autoComplete); } } }; }); const onAdvancedMaskTextChangeCallback = (0, _react.useCallback)(({ nativeEvent: { extracted, formatted, tailPlaceholder, complete } }) => { onChangeText === null || onChangeText === void 0 || onChangeText(formatted, extracted, tailPlaceholder, complete); onTailPlaceholderChange === null || onTailPlaceholderChange === void 0 || onTailPlaceholderChange(tailPlaceholder); }, [onChangeText, onTailPlaceholderChange]); return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(InputComponent, _extends({}, rest, { ref: inputRef, autoCapitalize: autoCapitalize })), /*#__PURE__*/_react.default.createElement(_AdvancedTextInputMaskDecoratorViewNativeComponent.default // @ts-expect-error the type is correct , { ref: maskedViewDecoratorRef, affinityCalculationStrategy: affinityCalculationStrategy, affinityFormat: affinityFormat, allowedKeys: allowedKeys, allowSuggestions: allowSuggestions, autocomplete: autocomplete, autocompleteOnFocus: autocompleteOnFocus, autoSkip: autoSkip, customNotations: customNotations, customTransformation: customTransformation, defaultValue: defaultValue, isRTL: isRTL, primaryMaskFormat: mask, style: _architecture.IS_FABRIC ? styles.farAway : styles.displayNone, validationRegex: validationRegex, value: value, onAdvancedMaskTextChange: onAdvancedMaskTextChangeCallback })); }); var _default = exports.default = /*#__PURE__*/(0, _react.memo)(MaskedTextInput); //# sourceMappingURL=index.js.map