@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
131 lines (130 loc) • 6.63 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _createTextMaskInputElement = _interopRequireDefault(require("./text-mask/createTextMaskInputElement"));
var _InputModeNumber = _interopRequireDefault(require("./text-mask/InputModeNumber"));
var _utilities = require("./text-mask/utilities");
const _excluded = ["inputElement", "inputRef", "mask", "guide", "pipe", "placeholderChar", "keepCharPositions", "value", "onChange", "showMask"];
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
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); }
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
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); }
class TextMask extends _react.default.PureComponent {
constructor(props) {
super(props);
_defineProperty(this, "onChange", event => {
this.textMaskInputElement.update();
if (typeof this.props.onChange === 'function') {
return this.props.onChange(event);
}
});
this.inputRef = props.inputRef || _react.default.createRef();
}
componentDidMount() {
this.initTextMask();
}
componentWillUnmount() {
var _this$inputMode;
(_this$inputMode = this.inputMode) === null || _this$inputMode === void 0 ? void 0 : _this$inputMode.remove();
}
initTextMask() {
var _this$inputMode2;
const {
props,
props: {
value,
inputMode
}
} = this;
const inputElement = this.inputRef.current;
this.textMaskInputElement = (0, _createTextMaskInputElement.default)(_objectSpread(_objectSpread({}, props), {}, {
inputElement
}));
this.textMaskInputElement.update(value);
if (!inputMode && inputMode !== 'none') {
this.inputMode = new _InputModeNumber.default();
}
(_this$inputMode2 = this.inputMode) === null || _this$inputMode2 === void 0 ? void 0 : _this$inputMode2.setElement(inputElement);
}
componentDidUpdate(prevProps) {
const {
value,
pipe,
mask,
guide,
placeholderChar,
showMask
} = this.props;
const settings = {
guide,
placeholderChar,
showMask
};
const isPipeChanged = typeof pipe === 'function' && typeof prevProps.pipe === 'function' ? pipe.toString() !== prevProps.pipe.toString() : (0, _utilities.isNil)(pipe) && !(0, _utilities.isNil)(prevProps.pipe) || !(0, _utilities.isNil)(pipe) && (0, _utilities.isNil)(prevProps.pipe);
const isMaskChanged = mask.toString() !== prevProps.mask.toString();
const isSettingChanged = Object.keys(settings).some(prop => settings[prop] !== prevProps[prop]) || isMaskChanged || isPipeChanged;
const isValueChanged = value !== this.inputRef.current.value || prevProps.value !== value;
if (isValueChanged || isSettingChanged) {
this.initTextMask();
}
}
render() {
const _this$props = this.props,
{
inputElement,
inputRef,
mask,
guide,
pipe,
placeholderChar,
keepCharPositions,
value,
onChange,
showMask
} = _this$props,
props = _objectWithoutProperties(_this$props, _excluded);
const params = _objectSpread({
onChange: this.onChange
}, props);
return inputElement ? (_react.default.cloneElement(inputElement, params)) : _react.default.createElement("input", _extends({
ref: this.inputRef
}, params));
}
}
exports.default = TextMask;
_defineProperty(TextMask, "defaultProps", {
inputElement: null,
inputRef: null,
onChange: null,
guide: null,
value: null,
pipe: null,
placeholderChar: null,
keepCharPositions: null,
showMask: null
});
process.env.NODE_ENV !== "production" ? TextMask.propTypes = {
mask: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.func, _propTypes.default.bool, _propTypes.default.shape({
mask: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.func]),
pipe: _propTypes.default.func
})]).isRequired,
inputRef: _propTypes.default.object,
inputElement: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
onChange: _propTypes.default.func,
guide: _propTypes.default.bool,
value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
pipe: _propTypes.default.func,
placeholderChar: _propTypes.default.string,
keepCharPositions: _propTypes.default.bool,
showMask: _propTypes.default.bool
} : void 0;
//# sourceMappingURL=TextMask.js.map