From 08b74a41a053d3674eeb1781c78768afc80f6d67 Mon Sep 17 00:00:00 2001
From: Universe <universe@grida.co>
Date: Wed, 28 Feb 2024 17:44:33 +0900
Subject: [PATCH] add numeric input wrapping

---
 .../property-input/index.ts                   |  2 +-
 .../property-input/property-input.tsx         | 21 +++++++++++++++++++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/editor-ui-property/property-input/index.ts b/packages/editor-ui-property/property-input/index.ts
index 8af4a42..4fdec25 100644
--- a/packages/editor-ui-property/property-input/index.ts
+++ b/packages/editor-ui-property/property-input/index.ts
@@ -1,2 +1,2 @@
-export { PropertyInput } from "./property-input";
+export * from "./property-input";
 export type { PropertyInputProps } from "./property-input";
diff --git a/packages/editor-ui-property/property-input/property-input.tsx b/packages/editor-ui-property/property-input/property-input.tsx
index b3ddbdf..4e3eecd 100644
--- a/packages/editor-ui-property/property-input/property-input.tsx
+++ b/packages/editor-ui-property/property-input/property-input.tsx
@@ -147,6 +147,27 @@ export function PropertyInput({
   );
 }
 
+export function PropertyNumericInput({
+  onChange,
+  ...props
+}: Omit<React.ComponentProps<typeof PropertyInput>, "type" | "onChange"> & {
+  onChange?: (value: number) => void;
+}) {
+  return (
+    <PropertyInput
+      type="number"
+      {...props}
+      onChange={(txt) => {
+        const val = Number(txt);
+        if (isNaN(val)) {
+          return;
+        }
+        onChange(val);
+      }}
+    />
+  );
+}
+
 const PlainInput = styled.input`
   width: 100%;
   height: 100%;