@tounsoo/input-number-mask 1.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 tounsoo
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,125 @@
+# @tounsoo/input-number-mask
+
+A lightweight, dependency-free React hook for masking input values. Perfect for phone numbers, dates, credit cards, and more.
+
+## Features
+
+- 0️⃣ **Template-based masking** (e.g., `(ddd) ddd-dddd`)
+- ⌨️ **Intuitive typing & deletion**
+- 📍 **`keepPosition` option** to maintain cursor position and placeholder structure on deletion
+- 🧩 **Headless UI** - completely unstyled, brings your own inputs
+- 📦 **Zero dependencies** (peer dependency on React)
+- 🧪 **Fully tested**
+
+## Installation
+
+```bash
+pnpm add @tounsoo/input-number-mask
+# or
+npm install @tounsoo/input-number-mask
+# or
+yarn add @tounsoo/input-number-mask
+```
+
+## Usage
+
+### Basic Example
+
+```tsx
+import { useInputNumberMask } from '@tounsoo/input-number-mask';
+
+const PhoneInput = () => {
+  const mask = useInputNumberMask({
+    template: '(ddd) ddd-dddd',
+    placeholder: '(___) ___-____'
+  });
+
+  return (
+    <input {...mask} type="tel" />
+  );
+};
+```
+
+### Using with `<form>` (Submitting Raw Values)
+
+The hook exposes the `rawValue` (unmasked) which you can include in your form submission using a hidden input.
+
+```tsx
+import { useInputNumberMask } from '@tounsoo/input-number-mask';
+
+export const MyForm = () => {
+    // 1. Initialise the mask
+    const phoneMask = useInputNumberMask({
+        template: '(ddd) ddd-dddd',
+        placeholder: '(___) ___-____'
+    });
+
+    const handleSubmit = (e) => {
+        e.preventDefault();
+        const formData = new FormData(e.target);
+        
+        // Access the raw value from the hidden input
+        console.log('Phone (Raw):', formData.get('phone_raw')); 
+        // Output: "1234567890"
+
+        // Access the formatted value if needed
+        console.log('Phone (Formatted):', formData.get('phone_display')); 
+        // Output: "(123) 456-7890"
+    };
+
+    return (
+        <form onSubmit={handleSubmit}>
+            <label htmlFor="phone">Phone Number</label>
+            {/* The visible input handles the mask interaction */}
+            <input 
+                {...phoneMask} 
+                name="phone_display" 
+                id="phone" 
+                required 
+            />
+            
+            {/* Hidden input to submit the clean value */}
+            <input 
+                type="hidden" 
+                name="phone_raw" 
+                value={phoneMask.rawValue} 
+            />
+            
+            <button type="submit">Submit</button>
+        </form>
+    );
+};
+```
+
+### Options
+
+| Option | Type | Default | Description |
+|Template|`string`|Required|The mask pattern. `d` represents a digit.|
+|Placeholder|`string`|Required| The display string when input is empty or partial.|
+|keepPosition|`boolean`|`false`| If true, deleting a character replaces it with the placeholder char instead of shifting subsequent characters.|
+
+## Contributing
+
+### Release Process
+
+This project uses [Changesets](https://github.com/changesets/changesets) for version management and publishing.
+
+**When making changes:**
+
+1. Make your code changes
+2. Create a changeset:
+   ```bash
+   pnpm changeset
+   ```
+3. Follow the prompts to describe your changes and select the version bump type (patch/minor/major)
+4. Commit the changeset file along with your changes
+5. Push to main
+
+**Publishing flow:**
+
+- When changesets are merged to main, a "Version Packages" PR is automatically created
+- Merging the Version Packages PR will automatically publish to npm
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),S=e=>/\d/.test(e),d=(e,s)=>{let l="",n=0;for(let g=0;g<e.length;g++){const c=e[g];if(n>=s.length)break;if(s[n]==="d")S(c)&&(l+=c,n++);else if(s[n]===c)n++;else{let u=n;for(;u<s.length&&s[u]!=="d"&&s[u]!==c;)u++;u<s.length&&s[u]==="d"?S(c)&&(l+=c,n=u+1):u<s.length&&s[u]===c&&(n=u+1)}}return l},h=(e,s,l)=>{let n="",g=0;for(let c=0;c<s.length;c++)if(s[c]==="d"){if(g<e.length)n+=e[g++];else if(l&&c<l.length)n+=l[c];else if(!l)break}else n+=s[c];return n};function R({template:e,placeholder:s,keepPosition:l=!1}){const[n,g]=y.useState(()=>h("",e,s)),[c,u]=y.useState(null),C=y.useRef(null);y.useLayoutEffect(()=>{C.current&&c!==null&&C.current.setSelectionRange(c,c)},[c,n]),y.useLayoutEffect(()=>{const V=C.current;if(!V)return;const k=a=>{const v=a.target,f=v.selectionStart||0,w=v.selectionEnd||0,b=f!==w;if(a.key==="Backspace"){if(f===0&&!b)return;a.preventDefault();let i=f-1;if(b)if(l){let r=n;for(let t=f;t<w;t++)if(e[t]==="d"){const o=s&&t<s.length?s[t]:"_";r=r.substring(0,t)+o+r.substring(t+1)}g(r),u(f);return}else{const r=n.slice(0,f)+n.slice(w),t=d(r,e),o=h(t,e,s);g(o),u(f);return}for(;i>=0&&e[i]!=="d";)i--;if(i<0)return;if(l){const r=s&&i<s.length?s[i]:"_",t=n.substring(0,i)+r+n.substring(i+1);g(t),u(i)}else{const r=n.slice(0,i)+n.slice(i+1),t=d(r,e),o=h(t,e,s);g(o),u(i)}}else if(a.key==="Delete"){if(a.preventDefault(),b)if(l){let r=n;for(let t=f;t<w;t++)if(e[t]==="d"){const o=s&&t<s.length?s[t]:"_";r=r.substring(0,t)+o+r.substring(t+1)}g(r),u(f);return}else{const r=n.slice(0,f)+n.slice(w),t=d(r,e),o=h(t,e,s);g(o),u(f);return}let i=f;for(;i<e.length&&e[i]!=="d";)i++;if(i>=n.length)return;if(l){const r=s&&i<s.length?s[i]:"_",t=n.substring(0,i)+r+n.substring(i+1);g(t),u(f)}else{const r=n.slice(0,i)+n.slice(i+1),t=d(r,e),o=h(t,e,s);g(o),u(f)}}},I=a=>{const v=a.target,f=v.value,w=v.selectionStart||0,b=()=>{const i=f.slice(0,w),r=d(i,e).length,t=d(f,e),o=h(t,e,s);g(o);let x=0,D=0;for(let L=0;L<o.length&&!(x>=r);L++)S(o[L])&&e[L]==="d"&&x++,D++;for(;D<o.length&&e[D]!=="d";)D++;u(D)};if(l&&f.length>n.length){const i=w-1,r=f[i];if(!S(r)){b();return}let t=i;for(;t<e.length&&e[t]!=="d";)t++;if(t>=e.length){b();return}const o=n.substring(0,t)+r+n.substring(t+1);g(o),u(t+1);return}b()};return V.addEventListener("keydown",k),V.addEventListener("input",I),()=>{V.removeEventListener("keydown",k),V.removeEventListener("input",I)}},[n,e,s,l]);const E=d(n,e);return{value:n,displayValue:n,rawValue:E,ref:C}}exports.useInputNumberMask=R;
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../src/utils/maskUtils.ts","../src/useInputNumberMask.ts"],"sourcesContent":["export const isDigit = (char: string) => /\\d/.test(char);\n\nexport const cleanInput = (input: string, template: string): string => {\n    let extracted = '';\n    let t = 0;\n\n    for (let i = 0; i < input.length; i++) {\n        const char = input[i];\n\n        if (t >= template.length) {\n            break;\n        }\n\n        if (template[t] === 'd') {\n            if (isDigit(char)) {\n                extracted += char;\n                t++;\n            } else {\n                // Ignore placeholders or garbage\n            }\n        } else if (template[t] === char) {\n            t++;\n        } else {\n            let nextT = t;\n            while (nextT < template.length && template[nextT] !== 'd' && template[nextT] !== char) {\n                nextT++;\n            }\n            if (nextT < template.length && template[nextT] === 'd') {\n                if (isDigit(char)) {\n                    extracted += char;\n                    t = nextT + 1;\n                }\n            } else if (nextT < template.length && template[nextT] === char) {\n                t = nextT + 1;\n            }\n        }\n    }\n    return extracted;\n};\n\nexport const formatWithMask = (digits: string, template: string, placeholder?: string): string => {\n    let res = '';\n    let dIdx = 0;\n\n    for (let i = 0; i < template.length; i++) {\n        const isSlot = template[i] === 'd';\n\n        if (isSlot) {\n            if (dIdx < digits.length) {\n                res += digits[dIdx++];\n            } else {\n                // Empty slot\n                if (placeholder && i < placeholder.length) {\n                    res += placeholder[i];\n                } else {\n                    if (!placeholder) {\n                        break;\n                    }\n                }\n            }\n        } else {\n            res += template[i];\n        }\n    }\n    return res;\n};\n","import { useRef, useState, useLayoutEffect } from 'react';\nimport { cleanInput, formatWithMask, isDigit } from './utils/maskUtils';\n\n/**\n * useInputNumberMask\n * \n * A hook for masking number inputs with template support.\n * \n * @param template The mask template. 'd' represents a digit. All other characters are treated as literals.\n *                 Example: \"+1 (ddd) ddd-dddd\" for US phone numbers.\n * @param placeholder Optional full-length placeholder. Characters that match the template literals \n *                    will be displayed. 'd' positions can be filled with a placeholder char or kept as is.\n *                    Example: \"dd/mm/yyyy\" for a date mask \"dd/mm/yyyy\".\n * @param keepPosition If true, deleting a character will replace it with the placeholder char (if valid)\n *                     or keep the cursor position without shifting subsequent characters (if supported).\n *                     For now, we'll implement standard behavior where backspace deletes and shifts, \n *                     unless specific requirements enforce strict position keeping.\n *                     TODO: fully implement \"keep position\" logic if needed.\n */\nexport interface UseInputNumberMaskProps {\n    template: string;\n    placeholder?: string;\n    keepPosition?: boolean;\n}\n\nexport interface UseInputNumberMaskReturn {\n    value: string; // The raw value with formatting (e.g. \"+1 (234) 567-8900\")\n    displayValue: string; // The value to display in the input\n    rawValue: string; // The unmasked digits (e.g. \"12345678\")\n    ref: React.RefObject<HTMLInputElement | null>;\n}\n\nexport function useInputNumberMask({\n    template,\n    placeholder,\n    keepPosition = false,\n}: UseInputNumberMaskProps): UseInputNumberMaskReturn {\n\n    const [value, setValue] = useState(() => formatWithMask('', template, placeholder));\n    const [cursor, setCursor] = useState<number | null>(null);\n    const ref = useRef<HTMLInputElement>(null);\n\n    useLayoutEffect(() => {\n        if (ref.current && cursor !== null) {\n            ref.current.setSelectionRange(cursor, cursor);\n        }\n    }, [cursor, value]);\n\n    // Ref-based Event Handling\n    useLayoutEffect(() => {\n        const input = ref.current;\n        if (!input) return;\n\n        const handleKeyDown = (e: globalThis.KeyboardEvent) => {\n            const el = e.target as HTMLInputElement;\n            const start = el.selectionStart || 0;\n            const end = el.selectionEnd || 0;\n            const isSelection = start !== end;\n\n            if (e.key === 'Backspace') {\n                if (start === 0 && !isSelection) return;\n                // We prevent default to handle the state update manually\n                e.preventDefault();\n\n                let deleteIndex = start - 1;\n\n                if (isSelection) {\n                    if (keepPosition) {\n                        // Replace range with placeholders\n                        let newVal = value;\n                        for (let i = start; i < end; i++) {\n                            if (template[i] === 'd') {\n                                const pChar = placeholder && i < placeholder.length ? placeholder[i] : '_';\n                                newVal = newVal.substring(0, i) + pChar + newVal.substring(i + 1);\n                            }\n                        }\n                        setValue(newVal);\n                        setCursor(start);\n                        return;\n                    } else {\n                        // Standard delete range (shift)\n                        const newValRaw = value.slice(0, start) + value.slice(end);\n                        const newDigits = cleanInput(newValRaw, template);\n                        const formatted = formatWithMask(newDigits, template, placeholder);\n                        setValue(formatted);\n                        setCursor(start);\n                        return;\n                    }\n                }\n\n                // Single char backspace\n                while (deleteIndex >= 0) {\n                    const isTemplateLiteral = template[deleteIndex] !== 'd';\n                    if (isTemplateLiteral) {\n                        deleteIndex--;\n                    } else {\n                        break;\n                    }\n                }\n\n                if (deleteIndex < 0) return; // Nothing to delete\n\n                if (keepPosition) {\n                    const pChar = placeholder && deleteIndex < placeholder.length ? placeholder[deleteIndex] : '_';\n                    const newVal = value.substring(0, deleteIndex) + pChar + value.substring(deleteIndex + 1);\n                    setValue(newVal);\n                    setCursor(deleteIndex);\n                } else {\n                    // Shift behavior\n                    const newValRaw = value.slice(0, deleteIndex) + value.slice(deleteIndex + 1);\n                    const newDigits = cleanInput(newValRaw, template);\n                    const formatted = formatWithMask(newDigits, template, placeholder);\n                    setValue(formatted);\n                    setCursor(deleteIndex);\n                }\n            } else if (e.key === 'Delete') {\n                e.preventDefault();\n                // Delete forward\n                if (isSelection) {\n                    if (keepPosition) {\n                        let newVal = value;\n                        for (let i = start; i < end; i++) {\n                            if (template[i] === 'd') {\n                                const pChar = placeholder && i < placeholder.length ? placeholder[i] : '_';\n                                newVal = newVal.substring(0, i) + pChar + newVal.substring(i + 1);\n                            }\n                        }\n                        setValue(newVal);\n                        setCursor(start);\n                        return;\n                    } else {\n                        const newValRaw = value.slice(0, start) + value.slice(end);\n                        const newDigits = cleanInput(newValRaw, template);\n                        const formatted = formatWithMask(newDigits, template, placeholder);\n                        setValue(formatted);\n                        setCursor(start);\n                        return;\n                    }\n                }\n\n                // Single char delete\n                let deleteIndex = start;\n                while (deleteIndex < template.length) {\n                    const isTemplateLiteral = template[deleteIndex] !== 'd';\n                    if (isTemplateLiteral) {\n                        deleteIndex++;\n                    } else {\n                        break;\n                    }\n                }\n\n                if (deleteIndex >= value.length) return;\n\n                if (keepPosition) {\n                    const pChar = placeholder && deleteIndex < placeholder.length ? placeholder[deleteIndex] : '_';\n                    const newVal = value.substring(0, deleteIndex) + pChar + value.substring(deleteIndex + 1);\n                    setValue(newVal);\n                    setCursor(start);\n                } else {\n                    // Shift behavior\n                    const newValRaw = value.slice(0, deleteIndex) + value.slice(deleteIndex + 1);\n                    const newDigits = cleanInput(newValRaw, template);\n                    const formatted = formatWithMask(newDigits, template, placeholder);\n                    setValue(formatted);\n                    setCursor(start);\n                }\n            }\n        };\n\n        const handleInput = (e: Event) => {\n            // We cast to InputEvent or basic Event. target is HTMLInputElement.\n            const target = e.target as HTMLInputElement;\n            const inputVal = target.value;\n            const rawCursor = target.selectionStart || 0;\n\n            // Standard behavior logic\n            const standardChange = () => {\n                const beforeCursor = inputVal.slice(0, rawCursor);\n                const digitsBeforeCursor = cleanInput(beforeCursor, template).length;\n\n                const newDigits = cleanInput(inputVal, template);\n                const newFormatted = formatWithMask(newDigits, template, placeholder);\n\n                setValue(newFormatted);\n\n                let currentDigits = 0;\n                let newCursor = 0;\n                for (let i = 0; i < newFormatted.length; i++) {\n                    if (currentDigits >= digitsBeforeCursor) {\n                        break;\n                    }\n                    if (isDigit(newFormatted[i]) && template[i] === 'd') {\n                        currentDigits++;\n                    }\n                    newCursor++;\n                }\n\n                while (newCursor < newFormatted.length && template[newCursor] !== 'd') {\n                    newCursor++;\n                }\n\n                setCursor(newCursor);\n            };\n\n            if (keepPosition) {\n                // Measure diff against current state `value` (mapped in closure)\n                // NOTE: `value` in this closure is stale if not included in dependency array.\n                // We need strict dependency on `value`.\n                if (inputVal.length > value.length) {\n                    const insertIndex = rawCursor - 1;\n                    const char = inputVal[insertIndex];\n\n                    if (!isDigit(char)) {\n                        standardChange();\n                        return;\n                    }\n\n                    let targetIndex = insertIndex;\n                    while (targetIndex < template.length) {\n                        if (template[targetIndex] === 'd') {\n                            break;\n                        }\n                        targetIndex++;\n                    }\n\n                    if (targetIndex >= template.length) {\n                        standardChange();\n                        return;\n                    }\n\n                    const newValue = value.substring(0, targetIndex) + char + value.substring(targetIndex + 1);\n\n                    setValue(newValue);\n                    setCursor(targetIndex + 1);\n                    return;\n                }\n            }\n\n            standardChange();\n        };\n\n        input.addEventListener('keydown', handleKeyDown);\n        input.addEventListener('input', handleInput);\n\n        return () => {\n            input.removeEventListener('keydown', handleKeyDown);\n            input.removeEventListener('input', handleInput);\n        };\n    }, [value, template, placeholder, keepPosition]); // Re-bind when value changes to have fresh closure\n\n    const rawValue = cleanInput(value, template);\n\n    return {\n        value,\n        displayValue: value,\n        rawValue,\n        ref\n    };\n}\n"],"names":["isDigit","char","cleanInput","input","template","extracted","t","i","nextT","formatWithMask","digits","placeholder","res","dIdx","useInputNumberMask","keepPosition","value","setValue","useState","cursor","setCursor","ref","useRef","useLayoutEffect","handleKeyDown","e","el","start","end","isSelection","deleteIndex","newVal","pChar","newValRaw","newDigits","formatted","handleInput","target","inputVal","rawCursor","standardChange","beforeCursor","digitsBeforeCursor","newFormatted","currentDigits","newCursor","insertIndex","targetIndex","newValue","rawValue"],"mappings":"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"}

package/dist/index.mjs

@@ -0,0 +1,149 @@
+import { useState as S, useRef as T, useLayoutEffect as E } from "react";
+const k = (e) => /\d/.test(e), d = (e, t) => {
+  let l = "", n = 0;
+  for (let g = 0; g < e.length; g++) {
+    const f = e[g];
+    if (n >= t.length)
+      break;
+    if (t[n] === "d")
+      k(f) && (l += f, n++);
+    else if (t[n] === f)
+      n++;
+    else {
+      let u = n;
+      for (; u < t.length && t[u] !== "d" && t[u] !== f; )
+        u++;
+      u < t.length && t[u] === "d" ? k(f) && (l += f, n = u + 1) : u < t.length && t[u] === f && (n = u + 1);
+    }
+  }
+  return l;
+}, h = (e, t, l) => {
+  let n = "", g = 0;
+  for (let f = 0; f < t.length; f++)
+    if (t[f] === "d") {
+      if (g < e.length)
+        n += e[g++];
+      else if (l && f < l.length)
+        n += l[f];
+      else if (!l)
+        break;
+    } else
+      n += t[f];
+  return n;
+};
+function B({
+  template: e,
+  placeholder: t,
+  keepPosition: l = !1
+}) {
+  const [n, g] = S(() => h("", e, t)), [f, u] = S(null), C = T(null);
+  E(() => {
+    C.current && f !== null && C.current.setSelectionRange(f, f);
+  }, [f, n]), E(() => {
+    const V = C.current;
+    if (!V) return;
+    const x = (a) => {
+      const D = a.target, c = D.selectionStart || 0, w = D.selectionEnd || 0, b = c !== w;
+      if (a.key === "Backspace") {
+        if (c === 0 && !b) return;
+        a.preventDefault();
+        let i = c - 1;
+        if (b)
+          if (l) {
+            let r = n;
+            for (let s = c; s < w; s++)
+              if (e[s] === "d") {
+                const o = t && s < t.length ? t[s] : "_";
+                r = r.substring(0, s) + o + r.substring(s + 1);
+              }
+            g(r), u(c);
+            return;
+          } else {
+            const r = n.slice(0, c) + n.slice(w), s = d(r, e), o = h(s, e, t);
+            g(o), u(c);
+            return;
+          }
+        for (; i >= 0 && e[i] !== "d"; )
+          i--;
+        if (i < 0) return;
+        if (l) {
+          const r = t && i < t.length ? t[i] : "_", s = n.substring(0, i) + r + n.substring(i + 1);
+          g(s), u(i);
+        } else {
+          const r = n.slice(0, i) + n.slice(i + 1), s = d(r, e), o = h(s, e, t);
+          g(o), u(i);
+        }
+      } else if (a.key === "Delete") {
+        if (a.preventDefault(), b)
+          if (l) {
+            let r = n;
+            for (let s = c; s < w; s++)
+              if (e[s] === "d") {
+                const o = t && s < t.length ? t[s] : "_";
+                r = r.substring(0, s) + o + r.substring(s + 1);
+              }
+            g(r), u(c);
+            return;
+          } else {
+            const r = n.slice(0, c) + n.slice(w), s = d(r, e), o = h(s, e, t);
+            g(o), u(c);
+            return;
+          }
+        let i = c;
+        for (; i < e.length && e[i] !== "d"; )
+          i++;
+        if (i >= n.length) return;
+        if (l) {
+          const r = t && i < t.length ? t[i] : "_", s = n.substring(0, i) + r + n.substring(i + 1);
+          g(s), u(c);
+        } else {
+          const r = n.slice(0, i) + n.slice(i + 1), s = d(r, e), o = h(s, e, t);
+          g(o), u(c);
+        }
+      }
+    }, I = (a) => {
+      const D = a.target, c = D.value, w = D.selectionStart || 0, b = () => {
+        const i = c.slice(0, w), r = d(i, e).length, s = d(c, e), o = h(s, e, t);
+        g(o);
+        let y = 0, v = 0;
+        for (let L = 0; L < o.length && !(y >= r); L++)
+          k(o[L]) && e[L] === "d" && y++, v++;
+        for (; v < o.length && e[v] !== "d"; )
+          v++;
+        u(v);
+      };
+      if (l && c.length > n.length) {
+        const i = w - 1, r = c[i];
+        if (!k(r)) {
+          b();
+          return;
+        }
+        let s = i;
+        for (; s < e.length && e[s] !== "d"; )
+          s++;
+        if (s >= e.length) {
+          b();
+          return;
+        }
+        const o = n.substring(0, s) + r + n.substring(s + 1);
+        g(o), u(s + 1);
+        return;
+      }
+      b();
+    };
+    return V.addEventListener("keydown", x), V.addEventListener("input", I), () => {
+      V.removeEventListener("keydown", x), V.removeEventListener("input", I);
+    };
+  }, [n, e, t, l]);
+  const R = d(n, e);
+  return {
+    value: n,
+    displayValue: n,
+    rawValue: R,
+    ref: C
+  };
+}
+export {
+  B as useInputNumberMask
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../src/utils/maskUtils.ts","../src/useInputNumberMask.ts"],"sourcesContent":["export const isDigit = (char: string) => /\\d/.test(char);\n\nexport const cleanInput = (input: string, template: string): string => {\n    let extracted = '';\n    let t = 0;\n\n    for (let i = 0; i < input.length; i++) {\n        const char = input[i];\n\n        if (t >= template.length) {\n            break;\n        }\n\n        if (template[t] === 'd') {\n            if (isDigit(char)) {\n                extracted += char;\n                t++;\n            } else {\n                // Ignore placeholders or garbage\n            }\n        } else if (template[t] === char) {\n            t++;\n        } else {\n            let nextT = t;\n            while (nextT < template.length && template[nextT] !== 'd' && template[nextT] !== char) {\n                nextT++;\n            }\n            if (nextT < template.length && template[nextT] === 'd') {\n                if (isDigit(char)) {\n                    extracted += char;\n                    t = nextT + 1;\n                }\n            } else if (nextT < template.length && template[nextT] === char) {\n                t = nextT + 1;\n            }\n        }\n    }\n    return extracted;\n};\n\nexport const formatWithMask = (digits: string, template: string, placeholder?: string): string => {\n    let res = '';\n    let dIdx = 0;\n\n    for (let i = 0; i < template.length; i++) {\n        const isSlot = template[i] === 'd';\n\n        if (isSlot) {\n            if (dIdx < digits.length) {\n                res += digits[dIdx++];\n            } else {\n                // Empty slot\n                if (placeholder && i < placeholder.length) {\n                    res += placeholder[i];\n                } else {\n                    if (!placeholder) {\n                        break;\n                    }\n                }\n            }\n        } else {\n            res += template[i];\n        }\n    }\n    return res;\n};\n","import { useRef, useState, useLayoutEffect } from 'react';\nimport { cleanInput, formatWithMask, isDigit } from './utils/maskUtils';\n\n/**\n * useInputNumberMask\n * \n * A hook for masking number inputs with template support.\n * \n * @param template The mask template. 'd' represents a digit. All other characters are treated as literals.\n *                 Example: \"+1 (ddd) ddd-dddd\" for US phone numbers.\n * @param placeholder Optional full-length placeholder. Characters that match the template literals \n *                    will be displayed. 'd' positions can be filled with a placeholder char or kept as is.\n *                    Example: \"dd/mm/yyyy\" for a date mask \"dd/mm/yyyy\".\n * @param keepPosition If true, deleting a character will replace it with the placeholder char (if valid)\n *                     or keep the cursor position without shifting subsequent characters (if supported).\n *                     For now, we'll implement standard behavior where backspace deletes and shifts, \n *                     unless specific requirements enforce strict position keeping.\n *                     TODO: fully implement \"keep position\" logic if needed.\n */\nexport interface UseInputNumberMaskProps {\n    template: string;\n    placeholder?: string;\n    keepPosition?: boolean;\n}\n\nexport interface UseInputNumberMaskReturn {\n    value: string; // The raw value with formatting (e.g. \"+1 (234) 567-8900\")\n    displayValue: string; // The value to display in the input\n    rawValue: string; // The unmasked digits (e.g. \"12345678\")\n    ref: React.RefObject<HTMLInputElement | null>;\n}\n\nexport function useInputNumberMask({\n    template,\n    placeholder,\n    keepPosition = false,\n}: UseInputNumberMaskProps): UseInputNumberMaskReturn {\n\n    const [value, setValue] = useState(() => formatWithMask('', template, placeholder));\n    const [cursor, setCursor] = useState<number | null>(null);\n    const ref = useRef<HTMLInputElement>(null);\n\n    useLayoutEffect(() => {\n        if (ref.current && cursor !== null) {\n            ref.current.setSelectionRange(cursor, cursor);\n        }\n    }, [cursor, value]);\n\n    // Ref-based Event Handling\n    useLayoutEffect(() => {\n        const input = ref.current;\n        if (!input) return;\n\n        const handleKeyDown = (e: globalThis.KeyboardEvent) => {\n            const el = e.target as HTMLInputElement;\n            const start = el.selectionStart || 0;\n            const end = el.selectionEnd || 0;\n            const isSelection = start !== end;\n\n            if (e.key === 'Backspace') {\n                if (start === 0 && !isSelection) return;\n                // We prevent default to handle the state update manually\n                e.preventDefault();\n\n                let deleteIndex = start - 1;\n\n                if (isSelection) {\n                    if (keepPosition) {\n                        // Replace range with placeholders\n                        let newVal = value;\n                        for (let i = start; i < end; i++) {\n                            if (template[i] === 'd') {\n                                const pChar = placeholder && i < placeholder.length ? placeholder[i] : '_';\n                                newVal = newVal.substring(0, i) + pChar + newVal.substring(i + 1);\n                            }\n                        }\n                        setValue(newVal);\n                        setCursor(start);\n                        return;\n                    } else {\n                        // Standard delete range (shift)\n                        const newValRaw = value.slice(0, start) + value.slice(end);\n                        const newDigits = cleanInput(newValRaw, template);\n                        const formatted = formatWithMask(newDigits, template, placeholder);\n                        setValue(formatted);\n                        setCursor(start);\n                        return;\n                    }\n                }\n\n                // Single char backspace\n                while (deleteIndex >= 0) {\n                    const isTemplateLiteral = template[deleteIndex] !== 'd';\n                    if (isTemplateLiteral) {\n                        deleteIndex--;\n                    } else {\n                        break;\n                    }\n                }\n\n                if (deleteIndex < 0) return; // Nothing to delete\n\n                if (keepPosition) {\n                    const pChar = placeholder && deleteIndex < placeholder.length ? placeholder[deleteIndex] : '_';\n                    const newVal = value.substring(0, deleteIndex) + pChar + value.substring(deleteIndex + 1);\n                    setValue(newVal);\n                    setCursor(deleteIndex);\n                } else {\n                    // Shift behavior\n                    const newValRaw = value.slice(0, deleteIndex) + value.slice(deleteIndex + 1);\n                    const newDigits = cleanInput(newValRaw, template);\n                    const formatted = formatWithMask(newDigits, template, placeholder);\n                    setValue(formatted);\n                    setCursor(deleteIndex);\n                }\n            } else if (e.key === 'Delete') {\n                e.preventDefault();\n                // Delete forward\n                if (isSelection) {\n                    if (keepPosition) {\n                        let newVal = value;\n                        for (let i = start; i < end; i++) {\n                            if (template[i] === 'd') {\n                                const pChar = placeholder && i < placeholder.length ? placeholder[i] : '_';\n                                newVal = newVal.substring(0, i) + pChar + newVal.substring(i + 1);\n                            }\n                        }\n                        setValue(newVal);\n                        setCursor(start);\n                        return;\n                    } else {\n                        const newValRaw = value.slice(0, start) + value.slice(end);\n                        const newDigits = cleanInput(newValRaw, template);\n                        const formatted = formatWithMask(newDigits, template, placeholder);\n                        setValue(formatted);\n                        setCursor(start);\n                        return;\n                    }\n                }\n\n                // Single char delete\n                let deleteIndex = start;\n                while (deleteIndex < template.length) {\n                    const isTemplateLiteral = template[deleteIndex] !== 'd';\n                    if (isTemplateLiteral) {\n                        deleteIndex++;\n                    } else {\n                        break;\n                    }\n                }\n\n                if (deleteIndex >= value.length) return;\n\n                if (keepPosition) {\n                    const pChar = placeholder && deleteIndex < placeholder.length ? placeholder[deleteIndex] : '_';\n                    const newVal = value.substring(0, deleteIndex) + pChar + value.substring(deleteIndex + 1);\n                    setValue(newVal);\n                    setCursor(start);\n                } else {\n                    // Shift behavior\n                    const newValRaw = value.slice(0, deleteIndex) + value.slice(deleteIndex + 1);\n                    const newDigits = cleanInput(newValRaw, template);\n                    const formatted = formatWithMask(newDigits, template, placeholder);\n                    setValue(formatted);\n                    setCursor(start);\n                }\n            }\n        };\n\n        const handleInput = (e: Event) => {\n            // We cast to InputEvent or basic Event. target is HTMLInputElement.\n            const target = e.target as HTMLInputElement;\n            const inputVal = target.value;\n            const rawCursor = target.selectionStart || 0;\n\n            // Standard behavior logic\n            const standardChange = () => {\n                const beforeCursor = inputVal.slice(0, rawCursor);\n                const digitsBeforeCursor = cleanInput(beforeCursor, template).length;\n\n                const newDigits = cleanInput(inputVal, template);\n                const newFormatted = formatWithMask(newDigits, template, placeholder);\n\n                setValue(newFormatted);\n\n                let currentDigits = 0;\n                let newCursor = 0;\n                for (let i = 0; i < newFormatted.length; i++) {\n                    if (currentDigits >= digitsBeforeCursor) {\n                        break;\n                    }\n                    if (isDigit(newFormatted[i]) && template[i] === 'd') {\n                        currentDigits++;\n                    }\n                    newCursor++;\n                }\n\n                while (newCursor < newFormatted.length && template[newCursor] !== 'd') {\n                    newCursor++;\n                }\n\n                setCursor(newCursor);\n            };\n\n            if (keepPosition) {\n                // Measure diff against current state `value` (mapped in closure)\n                // NOTE: `value` in this closure is stale if not included in dependency array.\n                // We need strict dependency on `value`.\n                if (inputVal.length > value.length) {\n                    const insertIndex = rawCursor - 1;\n                    const char = inputVal[insertIndex];\n\n                    if (!isDigit(char)) {\n                        standardChange();\n                        return;\n                    }\n\n                    let targetIndex = insertIndex;\n                    while (targetIndex < template.length) {\n                        if (template[targetIndex] === 'd') {\n                            break;\n                        }\n                        targetIndex++;\n                    }\n\n                    if (targetIndex >= template.length) {\n                        standardChange();\n                        return;\n                    }\n\n                    const newValue = value.substring(0, targetIndex) + char + value.substring(targetIndex + 1);\n\n                    setValue(newValue);\n                    setCursor(targetIndex + 1);\n                    return;\n                }\n            }\n\n            standardChange();\n        };\n\n        input.addEventListener('keydown', handleKeyDown);\n        input.addEventListener('input', handleInput);\n\n        return () => {\n            input.removeEventListener('keydown', handleKeyDown);\n            input.removeEventListener('input', handleInput);\n        };\n    }, [value, template, placeholder, keepPosition]); // Re-bind when value changes to have fresh closure\n\n    const rawValue = cleanInput(value, template);\n\n    return {\n        value,\n        displayValue: value,\n        rawValue,\n        ref\n    };\n}\n"],"names":["isDigit","char","cleanInput","input","template","extracted","t","i","nextT","formatWithMask","digits","placeholder","res","dIdx","useInputNumberMask","keepPosition","value","setValue","useState","cursor","setCursor","ref","useRef","useLayoutEffect","handleKeyDown","e","el","start","end","isSelection","deleteIndex","newVal","pChar","newValRaw","newDigits","formatted","handleInput","target","inputVal","rawCursor","standardChange","beforeCursor","digitsBeforeCursor","newFormatted","currentDigits","newCursor","insertIndex","targetIndex","newValue","rawValue"],"mappings":"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"}

package/package.json

@@ -0,0 +1,102 @@
+{
+  "name": "@tounsoo/input-number-mask",
+  "version": "1.0.1",
+  "description": "A lightweight, dependency-free React hook for masking input values. Perfect for phone numbers, dates, credit cards, and more.",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@changesets/cli": "^2.29.8",
+    "@chromatic-com/storybook": "^5.0.0",
+    "@eslint/js": "^9.39.1",
+    "@storybook/addon-a11y": "^10.2.7",
+    "@storybook/addon-docs": "^10.2.7",
+    "@storybook/addon-vitest": "^10.2.7",
+    "@storybook/react": "^10.2.7",
+    "@storybook/react-vite": "^10.2.7",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/node": "^24.10.1",
+    "@types/react": "^19.2.5",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/coverage-v8": "^4.0.18",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
+    "eslint-plugin-storybook": "^10.2.7",
+    "globals": "^16.5.0",
+    "jsdom": "^28.0.0",
+    "playwright": "^1.58.2",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "storybook": "^10.2.7",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.46.4",
+    "vite": "^7.2.4",
+    "vitest": "^4.0.18"
+  },
+  "keywords": [
+    "react",
+    "hook",
+    "input",
+    "mask",
+    "phone",
+    "date",
+    "credit-card",
+    "formatting",
+    "form"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/tounsoo/input-number-mask.git"
+  },
+  "bugs": {
+    "url": "https://github.com/tounsoo/input-number-mask/issues"
+  },
+  "homepage": "https://github.com/tounsoo/input-number-mask#readme",
+  "author": "tounsoo",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "build:lib": "tsc -p tsconfig.lib.json && vite build --config vite.config.lib.ts",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "test": "vitest run",
+    "test:ci": "vitest run --config vitest.config.ci.ts",
+    "changeset": "changeset",
+    "version": "changeset version",
+    "release": "pnpm build:lib && changeset publish"
+  }
+}