npm - @stenajs-webui/input-mask - Versions diffs - 17.5.0 → 17.8.0 - Mend

@stenajs-webui/input-mask 17.5.0 → 17.8.0

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.

Files changed (13) hide show

package/CHANGELOG.md +12 -0
package/dist/components/MaskedTextInput.d.ts +12 -12
package/dist/hooks/UseInputMask.d.ts +5 -5
package/dist/index.d.ts +4 -4
package/dist/index.es.js +88 -118
package/dist/index.es.js.map +1 -1
package/dist/index.js +1 -147
package/dist/index.js.map +1 -1
package/dist/masks/InputMask.d.ts +6 -6
package/dist/masks/InputMasks.d.ts +5 -5
package/dist/storybook-helpers/storybook-controls.d.ts +46 -46
package/package.json +6 -7
package/dist/components/MaskedTextInput.stories.d.ts +0 -9

package/CHANGELOG.md CHANGED Viewed

@@ -1,3 +1,15 @@
+# v17.7.0 (Fri Jul 01 2022)
+#### 🚀 Enhancement
+- Build packages with vite [#475](https://github.com/StenaIT/stenajs-webui/pull/475) ([@lindskogen](https://github.com/lindskogen))
+#### Authors: 1
+- Johan Lindskogen ([@lindskogen](https://github.com/lindskogen))
+---
 # v17.0.0 (Fri Jun 17 2022)
 #### 🔩 Dependency Updates

package/dist/components/MaskedTextInput.d.ts CHANGED Viewed

@@ -1,12 +1,12 @@
-import { TextInputProps } from "@stenajs-webui/forms";
-import * as React from "react";
-import { InputMask, InputMaskPipe, InputMaskProvider } from "../masks/InputMask";
-export interface MaskedTextInputProps extends TextInputProps {
-    mask: InputMask | InputMaskProvider;
-    pipe?: InputMaskPipe;
-    guide?: boolean;
-    keepCharPositions?: boolean;
-    placeholderChar?: string;
-    showMask?: boolean;
-}
-export declare const MaskedTextInput: React.FC<MaskedTextInputProps>;
+import { TextInputProps } from "@stenajs-webui/forms";
+import * as React from "react";
+import { InputMask, InputMaskPipe, InputMaskProvider } from "../masks/InputMask";
+export interface MaskedTextInputProps extends TextInputProps {
+    mask: InputMask | InputMaskProvider;
+    pipe?: InputMaskPipe;
+    guide?: boolean;
+    keepCharPositions?: boolean;
+    placeholderChar?: string;
+    showMask?: boolean;
+}
+export declare const MaskedTextInput: React.FC<MaskedTextInputProps>;

package/dist/hooks/UseInputMask.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { ChangeEvent, RefObject } from "react";
-import { InputMask, InputMaskPipe, InputMaskProvider } from "../masks/InputMask";
-export declare const useMaskedInput: (inputRef: RefObject<HTMLInputElement>, onChange: ((ev: ChangeEvent<HTMLInputElement>) => void) | undefined, onValueChange: ((value: string) => void) | undefined, mask: InputMask | InputMaskProvider, pipe?: InputMaskPipe, initialValue?: string, guide?: boolean, keepCharPositions?: boolean, placeholderChar?: string, showMask?: boolean) => {
-    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
-};
+import { ChangeEvent, RefObject } from "react";
+import { InputMask, InputMaskPipe, InputMaskProvider } from "../masks/InputMask";
+export declare const useMaskedInput: (inputRef: RefObject<HTMLInputElement>, onChange: ((ev: ChangeEvent<HTMLInputElement>) => void) | undefined, onValueChange: ((value: string) => void) | undefined, mask: InputMask | InputMaskProvider, pipe?: InputMaskPipe, initialValue?: string, guide?: boolean, keepCharPositions?: boolean, placeholderChar?: string, showMask?: boolean) => {
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+};

package/dist/index.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-export * from "./components/MaskedTextInput";
-export * from "./hooks/UseInputMask";
-export * from "./masks/InputMask";
-export * from "./masks/InputMasks";
+export * from "./components/MaskedTextInput";
+export * from "./hooks/UseInputMask";
+export * from "./masks/InputMask";
+export * from "./masks/InputMasks";

package/dist/index.es.js CHANGED Viewed

@@ -1,123 +1,93 @@
-import { TextInput } from '@stenajs-webui/forms';
-import * as React from 'react';
-import { useRef, useLayoutEffect } from 'react';
-import { createTextMaskInputElement } from 'text-mask-core';
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation.
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-var useMaskedInput = function (inputRef, onChange, onValueChange, mask, pipe, initialValue, guide, keepCharPositions, placeholderChar, showMask) {
-    if (initialValue === void 0) { initialValue = ""; }
-    if (guide === void 0) { guide = false; }
-    if (keepCharPositions === void 0) { keepCharPositions = false; }
-    if (placeholderChar === void 0) { placeholderChar = "\u2000"; }
-    if (showMask === void 0) { showMask = true; }
-    var textMask = useRef(null);
-    useLayoutEffect(function () {
-        if (!inputRef.current)
-            return;
-        textMask.current = createTextMaskInputElement({
-            guide: guide,
-            inputElement: inputRef.current,
-            keepCharPositions: keepCharPositions,
-            mask: mask,
-            pipe: pipe,
-            placeholderChar: placeholderChar,
-            showMask: showMask,
-        });
-        textMask.current.update(initialValue);
-    }, [
-        inputRef,
-        guide,
-        keepCharPositions,
-        mask,
-        pipe,
-        placeholderChar,
-        showMask,
-        initialValue,
-    ]);
-    return {
-        onChange: function (event) {
-            if (textMask.current) {
-                textMask.current.update();
-            }
-            if (typeof onChange === "function") {
-                onChange(event);
-            }
-            if (typeof onValueChange === "function") {
-                onValueChange(event.target.value);
-            }
-        },
-    };
+(function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode("")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();import { TextInput } from "@stenajs-webui/forms";
+import { useRef, useLayoutEffect } from "react";
+import { createTextMaskInputElement } from "text-mask-core";
+import { jsx } from "react/jsx-runtime";
+const useMaskedInput = (inputRef, onChange, onValueChange, mask, pipe, initialValue = "", guide = false, keepCharPositions = false, placeholderChar = "\u2000", showMask = true) => {
+  const textMask = useRef(null);
+  useLayoutEffect(() => {
+    if (!inputRef.current)
+      return;
+    textMask.current = createTextMaskInputElement({
+      guide,
+      inputElement: inputRef.current,
+      keepCharPositions,
+      mask,
+      pipe,
+      placeholderChar,
+      showMask
+    });
+    textMask.current.update(initialValue);
+  }, [
+    inputRef,
+    guide,
+    keepCharPositions,
+    mask,
+    pipe,
+    placeholderChar,
+    showMask,
+    initialValue
+  ]);
+  return {
+    onChange: (event) => {
+      if (textMask.current) {
+        textMask.current.update();
+      }
+      if (typeof onChange === "function") {
+        onChange(event);
+      }
+      if (typeof onValueChange === "function") {
+        onValueChange(event.target.value);
+      }
+    }
+  };
 };
-var MaskedTextInput = function (_a) {
-    var mask = _a.mask, pipe = _a.pipe, onChange = _a.onChange, onValueChange = _a.onValueChange, value = _a.value, guide = _a.guide, keepCharPositions = _a.keepCharPositions, placeholderChar = _a.placeholderChar, showMask = _a.showMask, textInputProps = __rest(_a, ["mask", "pipe", "onChange", "onValueChange", "value", "guide", "keepCharPositions", "placeholderChar", "showMask"]);
-    var inputRef = useRef(null);
-    var maskedOnChange = useMaskedInput(inputRef, onChange, onValueChange, mask, pipe, value, guide, keepCharPositions, placeholderChar, showMask).onChange;
-    return (React.createElement(TextInput, __assign({}, textInputProps, { onChange: maskedOnChange, value: value, inputRef: inputRef })));
+const MaskedTextInput = ({
+  mask,
+  pipe,
+  onChange,
+  onValueChange,
+  value,
+  guide,
+  keepCharPositions,
+  placeholderChar,
+  showMask,
+  ...textInputProps
+}) => {
+  const inputRef = useRef(null);
+  const {
+    onChange: maskedOnChange
+  } = useMaskedInput(inputRef, onChange, onValueChange, mask, pipe, value, guide, keepCharPositions, placeholderChar, showMask);
+  return /* @__PURE__ */ jsx(TextInput, {
+    ...textInputProps,
+    onChange: maskedOnChange,
+    value,
+    inputRef
+  });
 };
-var InputMasks = {
-    CREDIT_CARD: [
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-        " ",
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-        " ",
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-        " ",
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-    ],
-    TIME: [/[012]/, /\d/, ":", /[012345]/, /\d/],
-    ISO_DATE: [/\d/, /\d/, /\d/, /\d/, "-", /\d/, /\d/, "-", /\d/, /\d/], // 2019-12-29
+const InputMasks = {
+  CREDIT_CARD: [
+    /\d/,
+    /\d/,
+    /\d/,
+    /\d/,
+    " ",
+    /\d/,
+    /\d/,
+    /\d/,
+    /\d/,
+    " ",
+    /\d/,
+    /\d/,
+    /\d/,
+    /\d/,
+    " ",
+    /\d/,
+    /\d/,
+    /\d/,
+    /\d/
+  ],
+  TIME: [/[012]/, /\d/, ":", /[012345]/, /\d/],
+  ISO_DATE: [/\d/, /\d/, /\d/, /\d/, "-", /\d/, /\d/, "-", /\d/, /\d/]
 };
 export { InputMasks, MaskedTextInput, useMaskedInput };
 //# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.es.js","sources":["../src/hooks/UseInputMask.ts","../src/components/MaskedTextInput.tsx","../src/masks/InputMasks.ts"],"sourcesContent":["import { ChangeEvent, RefObject, useLayoutEffect, useRef } from \"react\";\nimport { createTextMaskInputElement } from \"text-mask-core\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport const useMaskedInput = (\n inputRef: RefObject<HTMLInputElement>,\n onChange: ((ev: ChangeEvent<HTMLInputElement>) => void) \| undefined,\n onValueChange: ((value: string) => void) \| undefined,\n mask: InputMask \| InputMaskProvider,\n pipe?: InputMaskPipe,\n initialValue: string = \"\",\n guide: boolean = false,\n keepCharPositions: boolean = false,\n placeholderChar: string = \"\\u2000\",\n showMask: boolean = true\n) => {\n const textMask = useRef(null);\n\n useLayoutEffect(() => {\n if (!inputRef.current) return;\n\n textMask.current = createTextMaskInputElement({\n guide,\n inputElement: inputRef.current,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n });\n\n (textMask.current as any).update(initialValue);\n }, [\n inputRef,\n guide,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n initialValue,\n ]);\n\n return {\n onChange: (event: ChangeEvent<HTMLInputElement>) => {\n if (textMask.current) {\n (textMask.current as any).update();\n }\n\n if (typeof onChange === \"function\") {\n onChange(event);\n }\n if (typeof onValueChange === \"function\") {\n onValueChange(event.target.value);\n }\n },\n };\n};\n","import { TextInput, TextInputProps } from \"@stenajs-webui/forms\";\nimport * as React from \"react\";\nimport { useRef } from \"react\";\nimport { useMaskedInput } from \"../hooks/UseInputMask\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport interface MaskedTextInputProps extends TextInputProps {\n mask: InputMask \| InputMaskProvider;\n pipe?: InputMaskPipe;\n guide?: boolean;\n keepCharPositions?: boolean;\n placeholderChar?: string;\n showMask?: boolean;\n}\n\nexport const MaskedTextInput: React.FC<MaskedTextInputProps> = ({\n mask,\n pipe,\n onChange,\n onValueChange,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask,\n ...textInputProps\n}) => {\n const inputRef = useRef(null);\n const { onChange: maskedOnChange } = useMaskedInput(\n inputRef,\n onChange,\n onValueChange,\n mask,\n pipe,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask\n );\n\n return (\n <TextInput\n {...textInputProps}\n onChange={maskedOnChange}\n value={value}\n inputRef={inputRef}\n />\n );\n};\n","export const InputMasks = {\n CREDIT_CARD: [\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n ],\n TIME: [/[012]/, /\\d/, \":\", /[012345]/, /\\d/],\n ISO_DATE: [/\\d/, /\\d/, /\\d/, /\\d/, \"-\", /\\d/, /\\d/, \"-\", /\\d/, /\\d/], // 2019-12-29\n};\n"],"names":[],"~~mappings~~":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAQa~~,~~cAAc~~,~~GAAG~~,~~UAC5B~~,~~QAAqC~~,~~EACrC~~,~~QAAmE~~,~~EACnE~~,~~aAAoD~~,~~EACpD~~,~~IAAmC~~,~~EACnC~~,~~IAAoB~~,~~EACpB~~,~~YAAyB~~,~~EACzB~~,~~KAAsB~~,~~EACtB~~,~~iBAAkC~~,~~EAClC~~,~~eAAkC~~,~~EAClC~~,~~QAAwB;IAJxB~~,~~6BAAA~~,~~EAAA~~,~~iBAAyB;IACzB~~,~~sBAAA~~,~~EAAA~~,~~aAAsB;IACtB~~,~~kCAAA~~,~~EAAA~~,~~yBAAkC~~;~~IAClC~~,~~gCAAA~~,~~EAAA~~,~~0BAAkC;IAClC~~,~~yBAAA,EAAA,eAAwB~~;~~IAExB~~,~~IAAM~~,~~QAAQ,GAAG,~~MAAM~~,CAAC,IAAI,CAAC,CAAC~~;~~IAE9B~~,~~eAAe~~,CAAC~~;QACd~~,~~IAAI,CAAC,QAAQ,CAAC,OAAO~~;~~YAAE,OAAO~~;~~QAE9B~~,~~QAAQ~~,~~CAAC~~,~~OAAO,GAAG,0BAA0B,CAAC~~;~~YAC5C~~,~~KAAK,OAAA~~;~~YACL~~,~~YAAY~~,~~EAAE~~,~~QAAQ,CAAC,OAAO~~;~~YAC9B~~,~~iBAAiB,mBAAA~~;~~YACjB~~,~~IAAI,MAAA~~;~~YACJ~~,~~IAAI,MAAA~~;~~YACJ~~,~~eAAe,iBAAA~~;~~YACf~~,~~QAAQ,UAAA~~;~~SACT~~,~~CAAC~~,~~CAAC~~;~~QAEF~~,~~QAAQ~~,~~CAAC~~,~~OAAe~~,~~CAAC,MAAM,CAAC,~~YAAY,~~CAAC~~,~~CAAC~~;~~KAChD~~,~~EAAE~~;~~QACD~~,~~QAAQ~~;~~QACR~~,~~KAAK~~;~~QACL~~,~~iBAAiB~~;~~QACjB~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~eAAe~~;~~QACf~~,~~QAAQ~~;~~QACR~~,~~YAAY;KACb~~,~~CAAC,CAAC~~;~~IAEH~~,~~OAAO~~;~~QACL~~,~~QAAQ~~,~~EAAE~~,~~UAAC~~,~~KAAoC~~;~~YAC7C~~,~~IAAI~~,~~QAAQ~~,~~CAAC,OAAO,EAAE~~;~~gBACnB~~,~~QAAQ~~,~~CAAC,OAAe,CAAC,MAAM,EAAE,CAAC~~;~~aACpC~~;~~YAED~~,~~IAAI~~,OAAO,~~QAAQ~~,~~KAAK,UAAU,EAAE~~;~~gBAClC~~,~~QAAQ~~,~~CAAC,~~KAAK,~~CAAC,CAAC~~;~~aACjB;YACD~~,~~IAAI~~,OAAO,~~aAAa~~,~~KAAK,UAAU,EAAE~~;~~gBACvC~~,~~aAAa~~,~~CAAC,KAAK,CAAC,~~MAAM,~~CAAC~~,KAAK,~~CAAC~~,~~CAAC~~;~~aACnC~~;~~SACF~~;~~KACF~~,CAAC;~~AACJ;;IC1Ca~~,~~eAAe~~,~~GAAmC~~,~~UAAC~~,~~EAW/D~~;~~IAVC~~,~~IAAA~~,~~IAAI~~,~~UAAA~~,~~EACJ~~,~~IAAI~~,~~UAAA~~,~~EACJ~~,~~QAAQ~~,~~cAAA~~,~~EACR~~,~~aAAa~~,~~mBAAA~~,~~EACb~~,~~KAAK~~,~~WAAA~~,~~EACL~~,~~KAAK~~,~~WAAA~~,~~EACL~~,~~iBAAiB~~,~~uBAAA~~,~~EACjB~~,~~eAAe~~,~~qBAAA~~,~~EACf~~,~~QAAQ~~,~~cAAA~~,~~EACL~~,~~cAAc~~,~~cAV6C~~,~~mHAW/D~~,~~CADkB~~;~~IAEjB~~,~~IAAM~~,~~QAAQ~~,~~GAAG~~,~~MAAM,CAAC,IAAI,CAAC,CAAC~~;~~IACtB~~,~~IAAU~~,~~cAAc,GAAK,cAAc,CACjD,QAAQ,EACR,QAAQ,EACR,~~aAAa~~,EACb,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,iBAAiB,EACjB,eAAe,EACf,QAAQ,CACT,SAX+B,CAW9B~~;~~IAEF~~,~~QACE,oBAAC,SAAS,eACJ,cAAc,IAClB,QAAQ,EAAE,cAAc,~~EACxB,~~KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,IAClB,EACF~~;~~AACJ;;ICrDa~~,~~UAAU,GAAG~~;~~IACxB~~,~~WAAW,EAAE~~;~~QACX~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~GAAG~~;~~QACH~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~GAAG~~;~~QACH~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~GAAG~~;~~QACH~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI~~;~~QACJ~~,~~IAAI;KACL;IACD~~,~~IAAI~~,~~EAAE,~~CAAC,~~OAAO~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~GAAG,EAAE,UAAU,EAAE,~~IAAI~~,CAAC~~;~~IAC5C~~,~~QAAQ~~,~~EAAE~~,CAAC,~~IAAI~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~GAAG~~,~~EAAE,~~IAAI~~,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC;;;;;~~"}
1	+ {"version":3,"file":"index.es.js","sources":["../src/hooks/UseInputMask.ts","../src/components/MaskedTextInput.tsx","../src/masks/InputMasks.ts"],"sourcesContent":["import { ChangeEvent, RefObject, useLayoutEffect, useRef } from \"react\";\nimport { createTextMaskInputElement } from \"text-mask-core\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport const useMaskedInput = (\n inputRef: RefObject<HTMLInputElement>,\n onChange: ((ev: ChangeEvent<HTMLInputElement>) => void) \| undefined,\n onValueChange: ((value: string) => void) \| undefined,\n mask: InputMask \| InputMaskProvider,\n pipe?: InputMaskPipe,\n initialValue: string = \"\",\n guide: boolean = false,\n keepCharPositions: boolean = false,\n placeholderChar: string = \"\\u2000\",\n showMask: boolean = true\n) => {\n const textMask = useRef(null);\n\n useLayoutEffect(() => {\n if (!inputRef.current) return;\n\n textMask.current = createTextMaskInputElement({\n guide,\n inputElement: inputRef.current,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n });\n\n (textMask.current as any).update(initialValue);\n }, [\n inputRef,\n guide,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n initialValue,\n ]);\n\n return {\n onChange: (event: ChangeEvent<HTMLInputElement>) => {\n if (textMask.current) {\n (textMask.current as any).update();\n }\n\n if (typeof onChange === \"function\") {\n onChange(event);\n }\n if (typeof onValueChange === \"function\") {\n onValueChange(event.target.value);\n }\n },\n };\n};\n","import { TextInput, TextInputProps } from \"@stenajs-webui/forms\";\nimport * as React from \"react\";\nimport { useRef } from \"react\";\nimport { useMaskedInput } from \"../hooks/UseInputMask\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport interface MaskedTextInputProps extends TextInputProps {\n mask: InputMask \| InputMaskProvider;\n pipe?: InputMaskPipe;\n guide?: boolean;\n keepCharPositions?: boolean;\n placeholderChar?: string;\n showMask?: boolean;\n}\n\nexport const MaskedTextInput: React.FC<MaskedTextInputProps> = ({\n mask,\n pipe,\n onChange,\n onValueChange,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask,\n ...textInputProps\n}) => {\n const inputRef = useRef(null);\n const { onChange: maskedOnChange } = useMaskedInput(\n inputRef,\n onChange,\n onValueChange,\n mask,\n pipe,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask\n );\n\n return (\n <TextInput\n {...textInputProps}\n onChange={maskedOnChange}\n value={value}\n inputRef={inputRef}\n />\n );\n};\n","export const InputMasks = {\n CREDIT_CARD: [\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n ],\n TIME: [/[012]/, /\\d/, \":\", /[012345]/, /\\d/],\n ISO_DATE: [/\\d/, /\\d/, /\\d/, /\\d/, \"-\", /\\d/, /\\d/, \"-\", /\\d/, /\\d/], // 2019-12-29\n};\n"],"names":["MaskedTextInput","mask","pipe","onChange","onValueChange","value","guide","keepCharPositions","placeholderChar","showMask","textInputProps","inputRef","useRef","maskedOnChange","useMaskedInput"],"mappings":";;;;AAQO,MAAM,iBAAiB,CAC5B,UACA,UACA,eACA,MACA,MACA,eAAuB,IACvB,QAAiB,OACjB,oBAA6B,OAC7B,kBAA0B,UAC1B,WAAoB,SACjB;AACG,QAAA,WAAW,OAAO,IAAI;AAE5B,kBAAgB,MAAM;AACpB,QAAI,CAAC,SAAS;AAAS;AAEvB,aAAS,UAAU,2BAA2B;AAAA,MAC5C;AAAA,MACA,cAAc,SAAS;AAAA,MACvB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAEA,aAAS,QAAgB,OAAO,YAAY;AAAA,EAAA,GAC5C;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAEM,SAAA;AAAA,IACL,UAAU,CAAC,UAAyC;AAClD,UAAI,SAAS,SAAS;AACnB,iBAAS,QAAgB;MAC5B;AAEI,UAAA,OAAO,aAAa,YAAY;AAClC,iBAAS,KAAK;AAAA,MAChB;AACI,UAAA,OAAO,kBAAkB,YAAY;AACzB,sBAAA,MAAM,OAAO,KAAK;AAAA,MAClC;AAAA,IACF;AAAA,EAAA;AAEJ;AC1CO,MAAMA,kBAAkD,CAAC;AAAA,EAC9DC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,KACGC;AAAAA,MACC;AACEC,QAAAA,WAAWC,OAAO,IAAD;AACjB,QAAA;AAAA,IAAET,UAAUU;AAAAA,MAAmBC,eACnCH,UACAR,UACAC,eACAH,MACAC,MACAG,OACAC,OACAC,mBACAC,iBACAC,QAViD;AAanD,6BACG,WAAD;AAAA,IAAA,GACMC;AAAAA,IACJ,UAAUG;AAAAA,IACV;AAAA,IACA;AAAA,EAAA,CALJ;AAQD;ACrDM,MAAM,aAAa;AAAA,EACxB,aAAa;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,MAAM,CAAC,SAAS,MAAM,KAAK,YAAY,IAAI;AAAA,EAC3C,UAAU,CAAC,MAAM,MAAM,MAAM,MAAM,KAAK,MAAM,MAAM,KAAK,MAAM,IAAI;AACrE;;"}

package/dist/index.js CHANGED Viewed

@@ -1,148 +1,2 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
-var forms = require('@stenajs-webui/forms');
-var React = require('react');
-var textMaskCore = require('text-mask-core');
-function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n["default"] = e;
-    return Object.freeze(n);
-}
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation.
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-var useMaskedInput = function (inputRef, onChange, onValueChange, mask, pipe, initialValue, guide, keepCharPositions, placeholderChar, showMask) {
-    if (initialValue === void 0) { initialValue = ""; }
-    if (guide === void 0) { guide = false; }
-    if (keepCharPositions === void 0) { keepCharPositions = false; }
-    if (placeholderChar === void 0) { placeholderChar = "\u2000"; }
-    if (showMask === void 0) { showMask = true; }
-    var textMask = React.useRef(null);
-    React.useLayoutEffect(function () {
-        if (!inputRef.current)
-            return;
-        textMask.current = textMaskCore.createTextMaskInputElement({
-            guide: guide,
-            inputElement: inputRef.current,
-            keepCharPositions: keepCharPositions,
-            mask: mask,
-            pipe: pipe,
-            placeholderChar: placeholderChar,
-            showMask: showMask,
-        });
-        textMask.current.update(initialValue);
-    }, [
-        inputRef,
-        guide,
-        keepCharPositions,
-        mask,
-        pipe,
-        placeholderChar,
-        showMask,
-        initialValue,
-    ]);
-    return {
-        onChange: function (event) {
-            if (textMask.current) {
-                textMask.current.update();
-            }
-            if (typeof onChange === "function") {
-                onChange(event);
-            }
-            if (typeof onValueChange === "function") {
-                onValueChange(event.target.value);
-            }
-        },
-    };
-};
-var MaskedTextInput = function (_a) {
-    var mask = _a.mask, pipe = _a.pipe, onChange = _a.onChange, onValueChange = _a.onValueChange, value = _a.value, guide = _a.guide, keepCharPositions = _a.keepCharPositions, placeholderChar = _a.placeholderChar, showMask = _a.showMask, textInputProps = __rest(_a, ["mask", "pipe", "onChange", "onValueChange", "value", "guide", "keepCharPositions", "placeholderChar", "showMask"]);
-    var inputRef = React.useRef(null);
-    var maskedOnChange = useMaskedInput(inputRef, onChange, onValueChange, mask, pipe, value, guide, keepCharPositions, placeholderChar, showMask).onChange;
-    return (React__namespace.createElement(forms.TextInput, __assign({}, textInputProps, { onChange: maskedOnChange, value: value, inputRef: inputRef })));
-};
-var InputMasks = {
-    CREDIT_CARD: [
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-        " ",
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-        " ",
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-        " ",
-        /\d/,
-        /\d/,
-        /\d/,
-        /\d/,
-    ],
-    TIME: [/[012]/, /\d/, ":", /[012345]/, /\d/],
-    ISO_DATE: [/\d/, /\d/, /\d/, /\d/, "-", /\d/, /\d/, "-", /\d/, /\d/], // 2019-12-29
-};
-exports.InputMasks = InputMasks;
-exports.MaskedTextInput = MaskedTextInput;
-exports.useMaskedInput = useMaskedInput;
+(function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode("")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var x=require("@stenajs-webui/forms"),M=require("react"),p=require("text-mask-core"),k=require("react/jsx-runtime");const i=(t,u,n,d,r,s="",a=!1,c=!1,o="\u2000",f=!0)=>{const e=M.useRef(null);return M.useLayoutEffect(()=>{!t.current||(e.current=p.createTextMaskInputElement({guide:a,inputElement:t.current,keepCharPositions:c,mask:d,pipe:r,placeholderChar:o,showMask:f}),e.current.update(s))},[t,a,c,d,r,o,f,s]),{onChange:I=>{e.current&&e.current.update(),typeof u=="function"&&u(I),typeof n=="function"&&n(I.target.value)}}},l=({mask:t,pipe:u,onChange:n,onValueChange:d,value:r,guide:s,keepCharPositions:a,placeholderChar:c,showMask:o,...f})=>{const e=M.useRef(null),{onChange:I}=i(e,n,d,t,u,r,s,a,c,o);return k.jsx(x.TextInput,{...f,onChange:I,value:r,inputRef:e})},m={CREDIT_CARD:[/\d/,/\d/,/\d/,/\d/," ",/\d/,/\d/,/\d/,/\d/," ",/\d/,/\d/,/\d/,/\d/," ",/\d/,/\d/,/\d/,/\d/],TIME:[/[012]/,/\d/,":",/[012345]/,/\d/],ISO_DATE:[/\d/,/\d/,/\d/,/\d/,"-",/\d/,/\d/,"-",/\d/,/\d/]};exports.InputMasks=m;exports.MaskedTextInput=l;exports.useMaskedInput=i;
 //# sourceMappingURL=index.js.map

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../src/hooks/UseInputMask.ts","../src/components/MaskedTextInput.tsx","../src/masks/InputMasks.ts"],"sourcesContent":["import { ChangeEvent, RefObject, useLayoutEffect, useRef } from \"react\";\nimport { createTextMaskInputElement } from \"text-mask-core\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport const useMaskedInput = (\n inputRef: RefObject<HTMLInputElement>,\n onChange: ((ev: ChangeEvent<HTMLInputElement>) => void) \| undefined,\n onValueChange: ((value: string) => void) \| undefined,\n mask: InputMask \| InputMaskProvider,\n pipe?: InputMaskPipe,\n initialValue: string = \"\",\n guide: boolean = false,\n keepCharPositions: boolean = false,\n placeholderChar: string = \"\\u2000\",\n showMask: boolean = true\n) => {\n const textMask = useRef(null);\n\n useLayoutEffect(() => {\n if (!inputRef.current) return;\n\n textMask.current = createTextMaskInputElement({\n guide,\n inputElement: inputRef.current,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n });\n\n (textMask.current as any).update(initialValue);\n }, [\n inputRef,\n guide,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n initialValue,\n ]);\n\n return {\n onChange: (event: ChangeEvent<HTMLInputElement>) => {\n if (textMask.current) {\n (textMask.current as any).update();\n }\n\n if (typeof onChange === \"function\") {\n onChange(event);\n }\n if (typeof onValueChange === \"function\") {\n onValueChange(event.target.value);\n }\n },\n };\n};\n","import { TextInput, TextInputProps } from \"@stenajs-webui/forms\";\nimport * as React from \"react\";\nimport { useRef } from \"react\";\nimport { useMaskedInput } from \"../hooks/UseInputMask\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport interface MaskedTextInputProps extends TextInputProps {\n mask: InputMask \| InputMaskProvider;\n pipe?: InputMaskPipe;\n guide?: boolean;\n keepCharPositions?: boolean;\n placeholderChar?: string;\n showMask?: boolean;\n}\n\nexport const MaskedTextInput: React.FC<MaskedTextInputProps> = ({\n mask,\n pipe,\n onChange,\n onValueChange,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask,\n ...textInputProps\n}) => {\n const inputRef = useRef(null);\n const { onChange: maskedOnChange } = useMaskedInput(\n inputRef,\n onChange,\n onValueChange,\n mask,\n pipe,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask\n );\n\n return (\n <TextInput\n {...textInputProps}\n onChange={maskedOnChange}\n value={value}\n inputRef={inputRef}\n />\n );\n};\n","export const InputMasks = {\n CREDIT_CARD: [\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n ],\n TIME: [/[012]/, /\\d/, \":\", /[012345]/, /\\d/],\n ISO_DATE: [/\\d/, /\\d/, /\\d/, /\\d/, \"-\", /\\d/, /\\d/, \"-\", /\\d/, /\\d/], // 2019-12-29\n};\n"],"names":["useRef","useLayoutEffect","createTextMaskInputElement","~~React~~","~~TextInput~~"],"~~mappings~~":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAQa~~,~~cAAc~~,~~GAAG~~,~~UAC5B~~,~~QAAqC~~,~~EACrC~~,~~QAAmE~~,~~EACnE~~,~~aAAoD~~,~~EACpD~~,~~IAAmC~~,~~EACnC~~,~~IAAoB~~,~~EACpB~~,~~YAAyB~~,~~EACzB~~,~~KAAsB~~,~~EACtB~~,~~iBAAkC~~,~~EAClC~~,~~eAAkC~~,~~EAClC~~,~~QAAwB;IAJxB~~,~~6BAAA~~,~~EAAA~~,~~iBAAyB;IACzB~~,~~sBAAA~~,~~EAAA~~,~~aAAsB;IACtB~~,~~kCAAA~~,~~EAAA~~,~~yBAAkC;IAClC~~,~~gCAAA~~,~~EAAA~~,~~0BAAkC;IAClC~~,~~yBAAA,EAAA,eAAwB;IAExB,IAAM,QAAQ,GAAGA,YAAM,CAAC,~~IAAI,~~CAAC~~,~~CAAC;IAE9BC~~,~~qBAAe~~,~~CAAC;QACd~~,~~IAAI~~,~~CAAC~~,~~QAAQ,~~CAAC,~~OAAO;YAAE~~,~~OAAO;QAE9B~~,~~QAAQ~~,~~CAAC~~,~~OAAO~~,~~GAAGC~~,~~uCAA0B~~,~~CAAC;YAC5C~~,~~KAAK~~,~~OAAA;YACL~~,~~YAAY~~,~~EAAE~~,~~QAAQ~~,~~CAAC~~,~~OAAO;YAC9B,iBAAiB,mBAAA;YACjB,IAAI,MAAA;YACJ,IAAI,MAAA;YACJ,eAAe,iBAAA;YACf,QAAQ,~~UAAA~~;SACT~~,~~CAAC~~,~~CAAC;QAEF~~,~~QAAQ~~,~~CAAC~~,~~OAAe~~,~~CAAC~~,~~MAAM~~,~~CAAC~~,~~YAAY~~,~~CAAC~~,~~CAAC;KAChD~~,~~EAAE;QACD~~,~~QAAQ;QACR~~,~~KAAK;QACL~~,~~iBAAiB;QACjB~~,~~IAAI;QACJ~~,~~IAAI;QACJ~~,~~eAAe;QACf~~,~~QAAQ;QACR~~,~~YAAY;KACb~~,~~CAAC~~,~~CAAC;IAEH~~,~~OAAO;QACL~~,~~QAAQ~~,~~EAAE~~,~~UAAC~~,~~KAAoC;YAC7C~~,~~IAAI~~,~~QAAQ~~,~~CAAC~~,~~OAAO~~,~~EAAE;gBACnB~~,~~QAAQ~~,~~CAAC~~,~~OAAe~~,~~CAAC~~,~~MAAM~~,~~EAAE~~,~~CAAC;aACpC;YAED~~,~~IAAI~~,~~OAAO~~,~~QAAQ,KAAK,UAAU,EAAE;gBAClC,QAAQ,CAAC,KAAK,CAAC,CAAC;aACjB;YACD,IAAI,~~OAAO,~~aAAa,~~KAAK,~~UAAU~~,~~EAAE;gBACvC~~,~~aAAa~~,~~CAAC~~,~~KAAK~~,CAAC,~~MAAM~~,~~CAAC~~,~~KAAK~~,~~CAAC~~,~~CAAC;aACnC;SACF;KACF~~,~~CAAC;AACJ;;IC1Ca~~,~~eAAe~~,~~GAAmC~~,~~UAAC~~,~~EAW/D;IAVC~~,~~IAAA~~,~~IAAI~~,~~UAAA~~,~~EACJ~~,~~IAAI~~,~~UAAA~~,~~EACJ,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,KAAK,WAAA,EACL,KAAK,WAAA,EACL,iBAAiB,uBAAA,~~EACjB,~~eAAe~~,~~qBAAA~~,~~EACf~~,~~QAAQ~~,~~cAAA~~,~~EACL~~,~~cAAc~~,~~cAV6C~~,~~mHAW/D~~,~~CADkB;IAEjB~~,~~IAAM~~,~~QAAQ~~,~~GAAGF~~,~~YAAM~~,~~CAAC~~,~~IAAI~~,~~CAAC~~,~~CAAC;IACtB~~,~~IAAU~~,~~cAAc~~,~~GAAK,cAAc,CACjD,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,IAAI,~~EACJ,~~IAAI~~,~~EACJ~~,~~KAAK~~,~~EACL~~,~~KAAK~~,~~EACL~~,~~iBAAiB~~,~~EACjB~~,~~eAAe~~,~~EACf~~,~~QAAQ~~,~~CACT~~,~~SAX+B~~,~~CAW9B;IAEF~~,~~QACEG,+BAACC~~,~~eAAS~~,~~eACJ~~,~~cAAc~~,~~IAClB~~,~~QAAQ~~,~~EAAE~~,~~cAAc~~,~~EACxB~~,~~KAAK~~,~~EAAE~~,~~KAAK~~,~~EACZ~~,~~QAAQ~~,~~EAAE~~,~~QAAQ~~,~~IAClB~~,~~EACF;AACJ;;ICrDa~~,UAAU,GAAG;IACxB,WAAW,EAAE;QACX,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,GAAG;QACH,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,GAAG;QACH,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,GAAG;QACH,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;KACL;IACD,IAAI,EAAE,CAAC,~~OAAO~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~GAAG,EAAE,UAAU,EAAE,~~IAAI,~~CAAC;IAC5C~~,~~QAAQ~~,~~EAAE,~~CAAC,~~IAAI~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~GAAG~~,~~EAAE,~~IAAI,~~EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC;;;;;;;~~"}
1	+ {"version":3,"file":"index.js","sources":["../src/hooks/UseInputMask.ts","../src/components/MaskedTextInput.tsx","../src/masks/InputMasks.ts"],"sourcesContent":["import { ChangeEvent, RefObject, useLayoutEffect, useRef } from \"react\";\nimport { createTextMaskInputElement } from \"text-mask-core\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport const useMaskedInput = (\n inputRef: RefObject<HTMLInputElement>,\n onChange: ((ev: ChangeEvent<HTMLInputElement>) => void) \| undefined,\n onValueChange: ((value: string) => void) \| undefined,\n mask: InputMask \| InputMaskProvider,\n pipe?: InputMaskPipe,\n initialValue: string = \"\",\n guide: boolean = false,\n keepCharPositions: boolean = false,\n placeholderChar: string = \"\\u2000\",\n showMask: boolean = true\n) => {\n const textMask = useRef(null);\n\n useLayoutEffect(() => {\n if (!inputRef.current) return;\n\n textMask.current = createTextMaskInputElement({\n guide,\n inputElement: inputRef.current,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n });\n\n (textMask.current as any).update(initialValue);\n }, [\n inputRef,\n guide,\n keepCharPositions,\n mask,\n pipe,\n placeholderChar,\n showMask,\n initialValue,\n ]);\n\n return {\n onChange: (event: ChangeEvent<HTMLInputElement>) => {\n if (textMask.current) {\n (textMask.current as any).update();\n }\n\n if (typeof onChange === \"function\") {\n onChange(event);\n }\n if (typeof onValueChange === \"function\") {\n onValueChange(event.target.value);\n }\n },\n };\n};\n","import { TextInput, TextInputProps } from \"@stenajs-webui/forms\";\nimport * as React from \"react\";\nimport { useRef } from \"react\";\nimport { useMaskedInput } from \"../hooks/UseInputMask\";\nimport {\n InputMask,\n InputMaskPipe,\n InputMaskProvider,\n} from \"../masks/InputMask\";\n\nexport interface MaskedTextInputProps extends TextInputProps {\n mask: InputMask \| InputMaskProvider;\n pipe?: InputMaskPipe;\n guide?: boolean;\n keepCharPositions?: boolean;\n placeholderChar?: string;\n showMask?: boolean;\n}\n\nexport const MaskedTextInput: React.FC<MaskedTextInputProps> = ({\n mask,\n pipe,\n onChange,\n onValueChange,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask,\n ...textInputProps\n}) => {\n const inputRef = useRef(null);\n const { onChange: maskedOnChange } = useMaskedInput(\n inputRef,\n onChange,\n onValueChange,\n mask,\n pipe,\n value,\n guide,\n keepCharPositions,\n placeholderChar,\n showMask\n );\n\n return (\n <TextInput\n {...textInputProps}\n onChange={maskedOnChange}\n value={value}\n inputRef={inputRef}\n />\n );\n};\n","export const InputMasks = {\n CREDIT_CARD: [\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n \" \",\n /\\d/,\n /\\d/,\n /\\d/,\n /\\d/,\n ],\n TIME: [/[012]/, /\\d/, \":\", /[012345]/, /\\d/],\n ISO_DATE: [/\\d/, /\\d/, /\\d/, /\\d/, \"-\", /\\d/, /\\d/, \"-\", /\\d/, /\\d/], // 2019-12-29\n};\n"],"names":["useRef","useLayoutEffect","createTextMaskInputElement","MaskedTextInput","mask","pipe","onChange","onValueChange","value","guide","keepCharPositions","placeholderChar","showMask","textInputProps","inputRef","maskedOnChange","useMaskedInput","TextInput"],"mappings":"gOAQO,KAAM,GAAiB,CAC5B,EACA,EACA,EACA,EACA,EACA,EAAuB,GACvB,EAAiB,GACjB,EAA6B,GAC7B,EAA0B,SAC1B,EAAoB,KACjB,CACG,KAAA,GAAWA,SAAO,IAAI,EAE5BC,SAAAA,gBAAgB,IAAM,CACpB,AAAI,CAAC,EAAS,SAEd,GAAS,QAAUC,6BAA2B,CAC5C,QACA,aAAc,EAAS,QACvB,oBACA,OACA,OACA,kBACA,UAAA,CACD,EAEA,EAAS,QAAgB,OAAO,CAAY,EAAA,EAC5C,CACD,EACA,EACA,EACA,EACA,EACA,EACA,EACA,CAAA,CACD,EAEM,CACL,SAAU,AAAC,GAAyC,CAClD,AAAI,EAAS,SACV,EAAS,QAAgB,SAGxB,MAAO,IAAa,YACtB,EAAS,CAAK,EAEZ,MAAO,IAAkB,YACb,EAAA,EAAM,OAAO,KAAK,CAEpC,CAAA,CAEJ,EC1CaC,EAAkD,CAAC,CAC9DC,OACAC,OACAC,WACAC,gBACAC,QACAC,QACAC,oBACAC,kBACAC,cACGC,KACC,CACEC,KAAAA,GAAWd,SAAO,IAAD,EACjB,CAAEM,SAAUS,GAAmBC,EACnCF,EACAR,EACAC,EACAH,EACAC,EACAG,EACAC,EACAC,EACAC,EACAC,CAViD,EAanD,aACGK,EAAAA,UAAD,CAAA,GACMJ,EACJ,SAAUE,EACV,QACA,UAAA,CALJ,CAQD,ECrDY,EAAa,CACxB,YAAa,CACX,KACA,KACA,KACA,KACA,IACA,KACA,KACA,KACA,KACA,IACA,KACA,KACA,KACA,KACA,IACA,KACA,KACA,KACA,IACF,EACA,KAAM,CAAC,QAAS,KAAM,IAAK,WAAY,IAAI,EAC3C,SAAU,CAAC,KAAM,KAAM,KAAM,KAAM,IAAK,KAAM,KAAM,IAAK,KAAM,IAAI,CACrE"}

package/dist/masks/InputMask.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-export declare type InputMask = Array<string | RegExp> | boolean;
-export declare type InputMaskProvider = (value: string) => InputMask;
-export declare type InputMaskPipe = (conformedValue: string, config: any) => false | string | {
-    value: string;
-    indexesOfPipedChars: number[];
-};
+export declare type InputMask = Array<string | RegExp> | boolean;
+export declare type InputMaskProvider = (value: string) => InputMask;
+export declare type InputMaskPipe = (conformedValue: string, config: any) => false | string | {
+    value: string;
+    indexesOfPipedChars: number[];
+};

package/dist/masks/InputMasks.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-export declare const InputMasks: {
-    CREDIT_CARD: (string | RegExp)[];
-    TIME: (string | RegExp)[];
-    ISO_DATE: (string | RegExp)[];
-};
+export declare const InputMasks: {
+    CREDIT_CARD: (string | RegExp)[];
+    TIME: (string | RegExp)[];
+    ISO_DATE: (string | RegExp)[];
+};

package/dist/storybook-helpers/storybook-controls.d.ts CHANGED Viewed

@@ -1,46 +1,46 @@
-export declare const colorListControl: {
-    control: {
-        type: string;
-        options: string[];
-    };
-};
-export declare const shadowListControl: {
-    control: {
-        type: string;
-        options: string[];
-    };
-};
-export declare const sizeControl: {
-    control: {
-        type: string;
-        min: number;
-        max: number;
-        step: number;
-    };
-};
-export declare const widthControl: {
-    control: {
-        type: string;
-        min: number;
-        max: number;
-        step: number;
-    };
-};
-export declare const spaceControl: {
-    control: {
-        type: string;
-        min: number;
-        max: number;
-        step: number;
-    };
-};
-export declare const disabledControl: {
-    control: {
-        disable: boolean;
-    };
-};
-export declare const hideArg: {
-    table: {
-        disable: boolean;
-    };
-};
+export declare const colorListControl: {
+    control: {
+        type: string;
+        options: string[];
+    };
+};
+export declare const shadowListControl: {
+    control: {
+        type: string;
+        options: string[];
+    };
+};
+export declare const sizeControl: {
+    control: {
+        type: string;
+        min: number;
+        max: number;
+        step: number;
+    };
+};
+export declare const widthControl: {
+    control: {
+        type: string;
+        min: number;
+        max: number;
+        step: number;
+    };
+};
+export declare const spaceControl: {
+    control: {
+        type: string;
+        min: number;
+        max: number;
+        step: number;
+    };
+};
+export declare const disabledControl: {
+    control: {
+        disable: boolean;
+    };
+};
+export declare const hideArg: {
+    table: {
+        disable: boolean;
+    };
+};

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@stenajs-webui/input-mask",
-  "version": "17.5.0",
+  "version": "17.8.0",
   "description": "",
   "author": "mattias800",
   "license": "MIT",
@@ -18,16 +18,15 @@
     "npm": ">=5"
   },
   "scripts": {
-    "test": "jest",
-    "build": "rollup -c",
-    "start": "rollup -c -w",
-    "clean": "rm -rf dist",
+    "build": "yarn tsc -p tsconfig.build.json && yarn vite build",
+    "start": "yarn tsc -p tsconfig.build.json && yarn vite build --watch",
+    "clean": "rimraf dist",
     "prepare": "yarn clean && yarn run build",
     "predeploy": "cd example && yarn install && yarn run build",
     "deploy": "gh-pages -d example/build"
   },
   "dependencies": {
-    "@stenajs-webui/forms": "17.5.0",
+    "@stenajs-webui/forms": "17.8.0",
     "text-mask-core": "^5.1.2"
   },
   "peerDependencies": {
@@ -46,5 +45,5 @@
   "files": [
     "dist"
   ],
-  "gitHead": "4b007a19edfac18f521e1a643647b43c8bc86adc"
+  "gitHead": "aa893eb34e1b1d3a59a4a77f8ecfe1d922c40cd0"
 }

package/dist/components/MaskedTextInput.stories.d.ts DELETED Viewed

@@ -1,9 +0,0 @@
-import * as React from "react";
-declare const _default: {
-    title: string;
-    component: React.FC<import("./MaskedTextInput").MaskedTextInputProps>;
-};
-export default _default;
-export declare const Overview: () => JSX.Element;
-export declare const WithPrefilledValue: () => JSX.Element;
-export declare const WithOnValueChangeProp: () => JSX.Element;