Safari has a sanitization deficiency in <input type="number"> fields compared to modern browsers. It allows non-numeric characters and multiple decimal points, leading to unexpected or invalid values. This package provides a browser-aware workaround that intercepts paste & keydown events, corrects invalid numeric formats, and updates the input value correctly.

• ✅ Ignores paste actions that include non-numeric characters
• ✅ Fixes Safari-specific paste behavior for number inputs
• ✅ Works with React, Vue, Angular, or plain JavaScript
• ✅ Maintains accurate caret position on insert
• ✅ Ensures only one decimal point is allowed
• ✅ Restricts non-numeric entries on keydown
• ✅ TypeScript support

npm install @algrith/safari-numfix # or yarn add @algrith/safari-numfix

import{keyDownEventHandler,pasteEventHandler}from'@algrith/safari-numfix';consthandleChange=(event: React.ChangeEvent<HTMLInputElement>)=>{console.log(event.target.value);};<inputonPaste={(e)=>pasteEventHandler(e,handleChange)}onKeyDown={keyDownEventHandler}onChange={handleChange}type="number"/>

<script setup>import{keyDownEventHandler, pasteEventHandler } from'@algrith/safari-numfix';consthandleChange= (e) =>{console.log(e.target.value);};</script> <template> <input@paste="(e) => pasteEventHandler(e, handleChange)"@keydown="keyDownEventHandler"@input="handleChange"type="number" /> </template>

import{keyDownEventHandler,pasteEventHandler}from'@algrith/safari-numfix';onKeyDown(event: KeyboardEvent){keyDownEventHandler(event);};onPaste(event: ClipboardEvent){pasteEventHandler(event,this.onChange.bind(this));}

<inputid="numInput" type="number" /><scripttype="module">import{keyDownEventHandler,pasteEventHandler}from'https://cdn.skypack.dev/@algrith/safari-numfix';constinput=document.getElementById('numInput');input.addEventListener('keydown',keyDownEventHandler);input.addEventListener('paste',(e)=>{pasteEventHandler(e,(event)=>{console.log('Updated value:',event.target.value);});});</script>

Types files can be found at https://github.com/algrith/safari-numfix/tree/main/src/types.ts.

• Missing something or found a bug? Report here.