react-imask - npm Package Compare versions

Comparing version 7.1.3 to 7.2.0

dist/react-imask.js

@@ -62,7 +62,8 @@ (function (global, factory) {
   const MASK_PROPS_NAMES = Object.keys(MASK_PROPS).filter(p => p !== 'value');
-  const NON_MASK_OPTIONS_PROPS_NAMES = ['value', 'unmask', 'onAccept', 'onComplete', 'inputRef'];
-  const MASK_OPTIONS_PROPS_NAMES = MASK_PROPS_NAMES.filter(pName => NON_MASK_OPTIONS_PROPS_NAMES.indexOf(pName) < 0);
+  const NON_MASK_OPTIONS_NAMES = ['value', 'unmask', 'onAccept', 'onComplete', 'inputRef'];
+  const MASK_OPTIONS_NAMES = MASK_PROPS_NAMES.filter(pName => NON_MASK_OPTIONS_NAMES.indexOf(pName) < 0);
   function IMaskMixin(ComposedComponent) {
-    var _class;
-    const MaskedComponent = (_class = class MaskedComponent extends React__default.default.Component {
+    const MaskedComponent = class extends React__default.default.Component {
+      static displayName;
+      static propTypes;
       constructor(props) {
@@ -89,4 +90,3 @@ super(props);
           if ('value' in props && props.value !== undefined) {
-            var _this$element;
-            if ((_this$element = this.element) != null && _this$element.isContentEditable && this.element.tagName !== 'INPUT' && this.element.tagName !== 'TEXTAREA') this.element.textContent = props.value;else this.element.value = props.value;
+            if (this.element?.isContentEditable && this.element.tagName !== 'INPUT' && this.element.tagName !== 'TEXTAREA') this.element.textContent = props.value;else this.element.value = props.value;
           }
@@ -123,3 +123,3 @@ }
         // keep only mask options
-        Object.keys(cloneProps).filter(prop => MASK_OPTIONS_PROPS_NAMES.indexOf(prop) < 0).forEach(nonMaskProp => {
+        Object.keys(cloneProps).filter(prop => MASK_OPTIONS_NAMES.indexOf(prop) < 0).forEach(nonMaskProp => {
           delete cloneProps[nonMaskProp];
@@ -134,3 +134,3 @@ });
         MASK_PROPS_NAMES.forEach(maskProp => {
-          delete cloneProps[maskProp];
+          if (maskProp !== 'maxLength') delete cloneProps[maskProp];
         });
@@ -164,5 +164,5 @@ if (!('defaultValue' in cloneProps)) cloneProps.defaultValue = props.mask ? '' : cloneProps.value;
       }
-    }, _class.displayName = void 0, _class.propTypes = void 0, _class);
+    };
     const nestedComponentName = ComposedComponent.displayName || ComposedComponent.name || 'Component';
-    MaskedComponent.displayName = "IMask(" + nestedComponentName + ")";
+    MaskedComponent.displayName = `IMask(${nestedComponentName})`;
     MaskedComponent.propTypes = MASK_PROPS;
@@ -190,3 +190,2 @@ return React__default.default.forwardRef((props, ref) => React__default.default.createElement(MaskedComponent, {
   ;
-
   const IMaskInput = React__default.default.forwardRef(IMaskInputFn);
@@ -207,5 +206,4 @@
     const _destroyMask = React.useCallback(() => {
-      var _maskRef$current;
       if (!initialized) return;
-      (_maskRef$current = maskRef.current) == null ? void 0 : _maskRef$current.destroy();
+      maskRef.current?.destroy();
       maskRef.current = null;
@@ -224,11 +222,11 @@ }, []);
       setValue(m.value);
-      onAccept == null ? void 0 : onAccept(m.value, m, event);
+      onAccept?.(m.value, m, event);
     }, [onAccept]);
-    const _onComplete = React.useCallback(() => maskRef.current && (onComplete == null ? void 0 : onComplete(maskRef.current.value, maskRef.current)), [onComplete]);
+    const _onComplete = React.useCallback(() => maskRef.current && onComplete?.(maskRef.current.value, maskRef.current), [onComplete]);
     React.useEffect(() => {
       const el = ref.current;
-      if (!el || !(opts != null && opts.mask)) return _destroyMask();
+      if (!el || !opts?.mask) return _destroyMask();
       const mask = maskRef.current;
       if (!mask) {
-        if (el && opts != null && opts.mask) {
+        if (el && opts?.mask) {
           maskRef.current = IMask__default.default(el, opts);
@@ -238,5 +236,4 @@ _onAccept();
       } else {
-        mask == null ? void 0 : mask.updateOptions(opts); // TODO fix no idea
+        mask?.updateOptions(opts); // TODO fix no idea
       }
-
       setInitialized(Boolean(maskRef.current));
@@ -243,0 +240,0 @@ }, [opts, _destroyMask, _onAccept]);

esm/hook.d.ts

 import { type InputMask, type InputMaskElement, type FactoryOpts } from 'imask';
 import { Dispatch } from 'react';
 import type { MutableRefObject } from 'react';
-import type { ReactMaskProps } from './mixin';
-export default function useIMask<MaskElement extends InputMaskElement, Opts extends FactoryOpts>(opts: Opts, { onAccept, onComplete }?: Partial<Pick<ReactMaskProps<MaskElement, Opts>, 'onAccept' | 'onComplete'>>): {
+export default function useIMask<MaskElement extends InputMaskElement, Opts extends FactoryOpts = FactoryOpts>(opts: Opts, { onAccept, onComplete }?: {
+    onAccept?: (value: InputMask<Opts>['value'], maskRef: InputMask<Opts>, e?: InputEvent) => void;
+    onComplete?: (value: InputMask<Opts>['value'], maskRef: InputMask<Opts>, e?: InputEvent) => void;
+}): {
     ref: MutableRefObject<MaskElement | null>;
@@ -7,0 +9,0 @@ maskRef: MutableRefObject<InputMask<Opts> | null>;

esm/hook.js

@@ -17,5 +17,4 @@ import IMask from 'imask/esm/imask';
   const _destroyMask = useCallback(() => {
-    var _maskRef$current;
     if (!initialized) return;
-    (_maskRef$current = maskRef.current) == null ? void 0 : _maskRef$current.destroy();
+    maskRef.current?.destroy();
     maskRef.current = null;
@@ -34,11 +33,11 @@ }, []);
     setValue(m.value);
-    onAccept == null ? void 0 : onAccept(m.value, m, event);
+    onAccept?.(m.value, m, event);
   }, [onAccept]);
-  const _onComplete = useCallback(() => maskRef.current && (onComplete == null ? void 0 : onComplete(maskRef.current.value, maskRef.current)), [onComplete]);
+  const _onComplete = useCallback(() => maskRef.current && onComplete?.(maskRef.current.value, maskRef.current), [onComplete]);
   useEffect(() => {
     const el = ref.current;
-    if (!el || !(opts != null && opts.mask)) return _destroyMask();
+    if (!el || !opts?.mask) return _destroyMask();
     const mask = maskRef.current;
     if (!mask) {
-      if (el && opts != null && opts.mask) {
+      if (el && opts?.mask) {
         maskRef.current = IMask(el, opts);
@@ -48,5 +47,4 @@ _onAccept();
     } else {
-      mask == null ? void 0 : mask.updateOptions(opts); // TODO fix no idea
+      mask?.updateOptions(opts); // TODO fix no idea
     }
-
     setInitialized(Boolean(maskRef.current));
@@ -53,0 +51,0 @@ }, [opts, _destroyMask, _onAccept]);

esm/index.d.ts

@@ -5,3 +5,3 @@ import 'imask';
 export { default as useIMask } from './hook';
-export { default as IMaskMixin, type MaskPropsKeys, type MaskOpts, type ReactElementProps, type ReactMaskProps, type ReactMixinComponent, type IMaskMixinProps, type IMaskInputProps, type ReactMaskOpts, } from './mixin';
+export { default as IMaskMixin, type MaskPropsKeys, type ExtractMaskOpts, type ReactElementProps, type ReactMaskProps, type ReactMixinComponent, type IMaskMixinProps, type IMaskInputProps, type ReactMaskOpts, } from './mixin';
 //# sourceMappingURL=index.d.ts.map

esm/input.d.ts

 import React from 'react';
 import { IMaskInputProps } from './mixin';
-declare const IMaskInput: React.ForwardRefExoticComponent<(Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").Masked<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">> & {
-    mask: typeof import("../../imask/esm").Masked | typeof import("../../imask/esm").MaskedPattern | typeof import("../../imask/esm").MaskedDate | typeof import("../../imask/esm").MaskedNumber | typeof import("../../imask/esm").MaskedEnum | typeof import("../../imask/esm").MaskedRange | typeof import("../../imask/esm").MaskedRegExp | typeof import("../../imask/esm").MaskedFunction | typeof import("../../imask/esm").MaskedDynamic;
+declare const IMaskInput: React.ForwardRefExoticComponent<(Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & Omit<import("../../imask/esm").MaskedDateOptions, "mask"> & {
+    mask: DateConstructor;
 } & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").Masked<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedDate;
+} & Omit<Omit<import("../../imask/esm").MaskedDateOptions, "mask"> & {
+    mask: DateConstructor;
+}, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedNumber, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "min" | "max" | "radix" | "thousandsSeparator" | "mapToRadix" | "scale" | "normalizeZeros" | "padFractionalZeros">> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedNumber;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedNumber, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "min" | "max" | "radix" | "thousandsSeparator" | "mapToRadix" | "scale" | "normalizeZeros" | "padFractionalZeros">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedPattern<string>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "definitions" | "blocks" | "placeholderChar" | "displayChar" | "lazy">> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedEnum;
+} & Omit<import("../../imask/esm").MaskedEnumOptions, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedRange;
+} & Omit<import("../../imask/esm").MaskedRangeOptions, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedRegExp, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedRegExp;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedRegExp, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedFunction<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedFunction;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedFunction<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedPattern;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedPattern<string>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "definitions" | "blocks" | "placeholderChar" | "displayChar" | "lazy">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedDynamic<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "dispatch">> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").MaskedDynamic;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedDynamic<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "dispatch">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: typeof import("../../imask/esm").Masked;
+} & Omit<Partial<Pick<import("../../imask/esm").Masked<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedDate;
+} & Omit<Omit<import("../../imask/esm").MaskedDateOptions, "mask"> & {
+    mask: DateConstructor;
+}, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedNumber;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedNumber, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "min" | "max" | "radix" | "thousandsSeparator" | "mapToRadix" | "scale" | "normalizeZeros" | "padFractionalZeros">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedEnum;
+} & Omit<import("../../imask/esm").MaskedEnumOptions, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedRange;
+} & Omit<import("../../imask/esm").MaskedRangeOptions, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedRegExp;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedRegExp, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedFunction<any>;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedFunction<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedPattern<string>;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedPattern<string>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "definitions" | "blocks" | "placeholderChar" | "displayChar" | "lazy">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
+    mask: import("../../imask/esm").MaskedDynamic<any>;
+} & Omit<Partial<Pick<import("../../imask/esm").MaskedDynamic<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "dispatch">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
+}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, {
+    [x: string]: unknown;
+}>, "ref"> & {
     mask: import("../../imask/esm").Masked<any>;
-} & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Omit<import("../../imask/esm").MaskedDateOptions, "mask"> & {
-    mask: DateConstructor;
-} & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedNumber, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "min" | "max" | "radix" | "thousandsSeparator" | "mapToRadix" | "scale" | "normalizeZeros" | "padFractionalZeros">> & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedPattern<string>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "definitions" | "blocks" | "placeholderChar" | "displayChar" | "lazy">> & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedDynamic<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid" | "dispatch">> & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedRegExp, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">> & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
-}, "ref"> | Omit<import("./mixin").ReactElementProps<HTMLInputElement> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>, "ref"> & Omit<import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>, "ref"> & Partial<Pick<import("../../imask/esm").MaskedFunction<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">> & {
-    unmask?: boolean | "typed" | undefined;
-} & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>> & {
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement, import("./mixin").IMaskMixinProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts> & import("./mixin").ReactMaskProps<HTMLInputElement, import("./mixin").ReactMaskOpts<import("../../imask/esm").FactoryOpts>>>>>> | undefined;
+} & Omit<Partial<Pick<import("../../imask/esm").Masked<any>, "mask" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "format" | "parse" | "overwrite" | "eager" | "skipInvalid">>, "mask"> & {
+    ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
 }, "ref">) & React.RefAttributes<unknown>>;
 export default IMaskInput;
 //# sourceMappingURL=input.d.ts.map

esm/input.js

@@ -21,5 +21,4 @@ import React from 'react';
 ;
-
 const IMaskInput = React.forwardRef(IMaskInputFn);
 
 export { IMaskInput as default };

esm/mixin.d.ts

 import React from 'react';
 import { type InputMask, type InputMaskElement, type FactoryOpts, type AllFactoryStaticOpts } from 'imask';
+type AnyProps = Record<string, unknown>;
 export type Falsy = false | 0 | "" | null | undefined;
-export type ReactMaskOpts<Opts extends FactoryOpts = FactoryOpts> = Opts & {
+export type ReactMaskOpts = FactoryOpts & {
     unmask?: 'typed' | boolean;
 };
 export type UnmaskValue<Opts extends ReactMaskOpts> = Opts['unmask'] extends 'typed' ? InputMask<Opts>['typedValue'] : Opts['unmask'] extends Falsy ? InputMask<Opts>['value'] : InputMask<Opts>['unmaskedValue'];
-export type ReactMaskProps<MaskElement extends InputMaskElement, Opts extends ReactMaskOpts = ReactMaskOpts> = {
-    onAccept?: (value: UnmaskValue<Opts>, maskRef: InputMask<Opts>, e?: InputEvent) => void;
-    onComplete?: (value: UnmaskValue<Opts>, maskRef: InputMask<Opts>, e?: InputEvent) => void;
-    unmask?: Opts['unmask'];
-    value?: UnmaskValue<Opts>;
+export type ExtractReactMaskOpts<MaskElement extends InputMaskElement, Props extends IMaskInputProps<MaskElement>> = Extract<Props, ReactMaskOpts>;
+export type ReactMaskProps<MaskElement extends InputMaskElement, Props extends IMaskInputProps<MaskElement> = AnyProps> = {
+    onAccept?: (value: UnmaskValue<ExtractReactMaskOpts<MaskElement, Props>>, maskRef: InputMask<ExtractMaskOpts<MaskElement, Props>>, e?: InputEvent) => void;
+    onComplete?: (value: UnmaskValue<ExtractReactMaskOpts<MaskElement, Props>>, maskRef: InputMask<ExtractMaskOpts<MaskElement, Props>>, e?: InputEvent) => void;
+    unmask?: ExtractReactMaskOpts<MaskElement, Props>['unmask'];
+    value?: UnmaskValue<ExtractReactMaskOpts<MaskElement, Props>>;
     inputRef?: React.Ref<MaskElement>;
-    ref?: React.Ref<React.ComponentType<IMaskInputProps<MaskElement>>>;
+    ref?: React.Ref<React.ComponentType<Props>>;
 };
@@ -19,13 +21,14 @@ declare const MASK_PROPS: {
 };
-declare const NON_MASK_OPTIONS_PROPS_NAMES: readonly ["value", "unmask", "onAccept", "onComplete", "inputRef"];
-export type ReactElementProps<MaskElement extends InputMaskElement> = Omit<Omit<React.HTMLProps<MaskElement>, keyof typeof MASK_PROPS>, typeof NON_MASK_OPTIONS_PROPS_NAMES[number]>;
-export type ReactMixinComponent<MaskElement extends InputMaskElement> = React.ComponentType<ReactElementProps<MaskElement> & {
+declare const NON_MASK_OPTIONS_NAMES: readonly ["value", "unmask", "onAccept", "onComplete", "inputRef"];
+export type ReactElementProps<MaskElement extends InputMaskElement> = Omit<Omit<React.HTMLProps<MaskElement>, keyof typeof MASK_PROPS>, typeof NON_MASK_OPTIONS_NAMES[number] | 'maxLength'>;
+type NonMaskProps<MaskElement extends InputMaskElement, Props extends IMaskMixinProps<MaskElement> = AnyProps> = Omit<Props, keyof FactoryOpts>;
+export type ReactMixinComponent<MaskElement extends InputMaskElement, Props extends IMaskMixinProps<MaskElement> = AnyProps> = React.ComponentType<ReactElementProps<MaskElement> & {
     inputRef: React.Ref<MaskElement>;
-}>;
-export type MaskPropsKeys = Exclude<keyof typeof MASK_PROPS, typeof NON_MASK_OPTIONS_PROPS_NAMES[number]>;
-export type MaskOpts<MaskElement extends InputMaskElement, Props extends IMaskInputProps<MaskElement> = IMaskInputProps<MaskElement>> = Extract<Props, FactoryOpts>;
-export type IMaskMixinProps<MaskElement extends InputMaskElement, Props extends (ReactMaskOpts & ReactMaskProps<MaskElement>) = ReactMaskOpts & ReactMaskProps<MaskElement>> = Omit<ReactMaskProps<MaskElement, Props>, 'ref'> & MaskOpts<MaskElement, Props>;
-export type IMaskInputProps<MaskElement extends InputMaskElement, Props extends IMaskMixinProps<MaskElement> = IMaskMixinProps<MaskElement>> = ReactElementProps<MaskElement> & IMaskMixinProps<MaskElement, Props>;
-export default function IMaskMixin<MaskElement extends InputMaskElement, Props extends IMaskInputProps<MaskElement>>(ComposedComponent: ReactMixinComponent<MaskElement>): React.ForwardRefExoticComponent<React.PropsWithoutRef<Props> & React.RefAttributes<React.ComponentType<Props>>>;
+} & NonMaskProps<MaskElement, Props>>;
+export type MaskPropsKeys = Exclude<keyof typeof MASK_PROPS, typeof NON_MASK_OPTIONS_NAMES[number]>;
+export type ExtractMaskOpts<MaskElement extends InputMaskElement, Props extends IMaskInputProps<MaskElement>> = Extract<Props, FactoryOpts>;
+export type IMaskMixinProps<MaskElement extends InputMaskElement> = Omit<ReactMaskProps<MaskElement>, 'ref'> & FactoryOpts;
+export type IMaskInputProps<MaskElement extends InputMaskElement> = ReactElementProps<MaskElement> & IMaskMixinProps<MaskElement>;
+export default function IMaskMixin<MaskElement extends InputMaskElement, Props extends IMaskInputProps<MaskElement> = AnyProps>(ComposedComponent: ReactMixinComponent<MaskElement, Props>): React.ForwardRefExoticComponent<React.PropsWithoutRef<Props> & React.RefAttributes<React.ComponentType<Props>>>;
 export {};
 //# sourceMappingURL=mixin.d.ts.map

esm/mixin.js

@@ -54,7 +54,8 @@ import React from 'react';
 const MASK_PROPS_NAMES = Object.keys(MASK_PROPS).filter(p => p !== 'value');
-const NON_MASK_OPTIONS_PROPS_NAMES = ['value', 'unmask', 'onAccept', 'onComplete', 'inputRef'];
-const MASK_OPTIONS_PROPS_NAMES = MASK_PROPS_NAMES.filter(pName => NON_MASK_OPTIONS_PROPS_NAMES.indexOf(pName) < 0);
+const NON_MASK_OPTIONS_NAMES = ['value', 'unmask', 'onAccept', 'onComplete', 'inputRef'];
+const MASK_OPTIONS_NAMES = MASK_PROPS_NAMES.filter(pName => NON_MASK_OPTIONS_NAMES.indexOf(pName) < 0);
 function IMaskMixin(ComposedComponent) {
-  var _class;
-  const MaskedComponent = (_class = class MaskedComponent extends React.Component {
+  const MaskedComponent = class extends React.Component {
+    static displayName;
+    static propTypes;
     constructor(props) {
@@ -81,4 +82,3 @@ super(props);
         if ('value' in props && props.value !== undefined) {
-          var _this$element;
-          if ((_this$element = this.element) != null && _this$element.isContentEditable && this.element.tagName !== 'INPUT' && this.element.tagName !== 'TEXTAREA') this.element.textContent = props.value;else this.element.value = props.value;
+          if (this.element?.isContentEditable && this.element.tagName !== 'INPUT' && this.element.tagName !== 'TEXTAREA') this.element.textContent = props.value;else this.element.value = props.value;
         }
@@ -115,3 +115,3 @@ }
       // keep only mask options
-      Object.keys(cloneProps).filter(prop => MASK_OPTIONS_PROPS_NAMES.indexOf(prop) < 0).forEach(nonMaskProp => {
+      Object.keys(cloneProps).filter(prop => MASK_OPTIONS_NAMES.indexOf(prop) < 0).forEach(nonMaskProp => {
         delete cloneProps[nonMaskProp];
@@ -126,3 +126,3 @@ });
       MASK_PROPS_NAMES.forEach(maskProp => {
-        delete cloneProps[maskProp];
+        if (maskProp !== 'maxLength') delete cloneProps[maskProp];
       });
@@ -156,5 +156,5 @@ if (!('defaultValue' in cloneProps)) cloneProps.defaultValue = props.mask ? '' : cloneProps.value;
     }
-  }, _class.displayName = void 0, _class.propTypes = void 0, _class);
+  };
   const nestedComponentName = ComposedComponent.displayName || ComposedComponent.name || 'Component';
-  MaskedComponent.displayName = "IMask(" + nestedComponentName + ")";
+  MaskedComponent.displayName = `IMask(${nestedComponentName})`;
   MaskedComponent.propTypes = MASK_PROPS;
@@ -161,0 +161,0 @@ return React.forwardRef((props, ref) => React.createElement(MaskedComponent, {

package.json

 {
   "name": "react-imask",
-  "version": "7.1.3",
+  "version": "7.2.0",
   "license": "MIT",
@@ -17,2 +17,3 @@ "author": "Alexey Kryazhev",
       "import": "./esm/index.js",
+      "require": "./dist/react-imask.cjs",
       "default": "./dist/react-imask.js"
@@ -64,3 +65,3 @@ },
   "dependencies": {
-    "imask": "^7.1.3",
+    "imask": "^7.2.0",
     "prop-types": "^15.8.1"
@@ -74,6 +75,6 @@ },
   },
-  "gitHead": "7c0f22588bf9d72b42d7cc566362a27e485b6295",
+  "gitHead": "c2f27be5b18f16a1d0038c00ee2c40a87a2f2c71",
   "devDependencies": {
-    "@types/react": "^18.2.14",
-    "@types/react-dom": "^18.2.6",
+    "@types/react": "^18.2.45",
+    "@types/react-dom": "^18.2.17",
     "react": "^18.2.0",
@@ -80,0 +81,0 @@ "react-dom": "^18.2.0"

No alert changes

Improved metrics

Total package byte prevSize

117341

increased by53.91%

Number of package files

19

increased by11.76%

Lines of code

1067

increased by51.35%

Dependency changes

• Updatedimask@^7.2.0