From efe6865ecc6ba92776926c0a3e1835406956c360 Mon Sep 17 00:00:00 2001
From: Bowen Tan <bowen.tan@smartx.com>
Date: Mon, 1 Aug 2022 18:27:21 +0800
Subject: [PATCH] feat(numberWidget): auto convert non-number value to number

---
 .../editor-sdk/src/components/Widgets/NumberField.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/editor-sdk/src/components/Widgets/NumberField.tsx b/packages/editor-sdk/src/components/Widgets/NumberField.tsx
index 005a1671..9c625d1b 100644
--- a/packages/editor-sdk/src/components/Widgets/NumberField.tsx
+++ b/packages/editor-sdk/src/components/Widgets/NumberField.tsx
@@ -1,4 +1,4 @@
-import React, { useRef } from 'react';
+import React, { useEffect, useRef } from 'react';
 import { WidgetProps } from '../../types/widget';
 import { implementWidget } from '../../utils/widget';
 import {
@@ -23,6 +23,15 @@ export const NumberField: React.FC<WidgetProps<NumberFieldType>> = props => {
   const [stringValue, setStringValue] = React.useState(String(value));
   const numValue = useRef<number>(value);
 
+  useEffect(() => {
+    // Convert value to boolean after switch from expression widget mode.
+    if (typeof value !== 'number') {
+      onChange(0);
+      setStringValue('0');
+      numValue.current = 0;
+    }
+  }, [onChange, value]);
+
   return (
     <NumberInput
       value={stringValue}