From 89f56410bde60f70dbdb623fd570029fce819a2e Mon Sep 17 00:00:00 2001
From: Mike <89523154+mikebarr24@users.noreply.github.com>
Date: Tue, 18 Oct 2022 08:28:30 +0100
Subject: [PATCH] On Change added to NumberInput (#4198)

* On Change added to NumberInput

* fixes lint errors

Co-authored-by: arpitnath <arpitnath42@gmail.com>
---
 frontend/src/Editor/Components/NumberInput.jsx    | 10 +++++++++-
 frontend/src/Editor/WidgetManager/widgetConfig.js |  4 +++-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Editor/Components/NumberInput.jsx b/frontend/src/Editor/Components/NumberInput.jsx
index bf2514b6e2..1958479a6b 100644
--- a/frontend/src/Editor/Components/NumberInput.jsx
+++ b/frontend/src/Editor/Components/NumberInput.jsx
@@ -1,6 +1,13 @@
 import React, { useEffect } from 'react';
 
-export const NumberInput = function NumberInput({ height, properties, styles, setExposedVariable, component }) {
+export const NumberInput = function NumberInput({
+  height,
+  properties,
+  styles,
+  setExposedVariable,
+  component,
+  fireEvent,
+}) {
   const { visibility, borderRadius } = styles;
 
   const [value, setValue] = React.useState(parseInt(properties.value));
@@ -19,6 +26,7 @@ export const NumberInput = function NumberInput({ height, properties, styles, se
     } else {
       setValue(parseInt(e.target.value));
     }
+    fireEvent('onChange');
   };
 
   useEffect(() => {
diff --git a/frontend/src/Editor/WidgetManager/widgetConfig.js b/frontend/src/Editor/WidgetManager/widgetConfig.js
index bafe250bbe..2d86090cdb 100644
--- a/frontend/src/Editor/WidgetManager/widgetConfig.js
+++ b/frontend/src/Editor/WidgetManager/widgetConfig.js
@@ -1061,7 +1061,9 @@ export const widgets = [
         },
       },
     },
-    events: {},
+    events: {
+      onChange: { displayName: 'On change' },
+    },
     styles: {
       visibility: {
         type: 'toggle',