@eintrek/erp-theme 1.4.12 → 1.4.13

package/dist/components/ui/Input.d.ts

@@ -1,3 +1,3 @@
 import * as React from "react";
-declare function Input({ className, type, ...props }: React.ComponentProps<"input">): import("react/jsx-runtime").JSX.Element;
+declare function Input({ className, type, onWheel, ...props }: React.ComponentProps<"input">): import("react/jsx-runtime").JSX.Element;
 export { Input };

package/dist/index.esm.js

@@ -1391,8 +1391,24 @@ const th = {
   },
 };
 
-function Input({ className, type, ...props }) {
-    return (jsx("input", { type: type, "data-slot": "input", className: cn$1("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", className), ...props }));
+function Input({ className, type, onWheel, ...props }) {
+    // Scrolling the page with the pointer over a FOCUSED number input makes the
+    // browser step its value — the user is just moving down the form and the
+    // quantity or price they typed silently changes under the cursor. Blink only
+    // does this for discrete wheel notches, so a mouse (Windows, typically) hits
+    // it constantly while a trackpad (macOS) almost never does, which is why it
+    // reads as a platform bug.
+    //
+    // Blurring drops the focus the stepping depends on, so the wheel goes back to
+    // scrolling the page. preventDefault() is not an option: React attaches wheel
+    // listeners passively, and blocking it would trap the page under the cursor.
+    const handleWheel = (event) => {
+        onWheel?.(event);
+        if (type === "number" && document.activeElement === event.currentTarget) {
+            event.currentTarget.blur();
+        }
+    };
+    return (jsx("input", { type: type, onWheel: handleWheel, "data-slot": "input", className: cn$1("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", className), ...props }));
 }
 
 function Popover({ ...props }) {