onValueChange

Author: Valerio Como

packages/ketchup/src/components/kup-input-panel/kup-input-panel-declarations.ts

@@ -73,4 +73,5 @@ export enum KupInputPanelProps {
     data = 'Actual data of the input panel.',
     hiddenSubmitButton = 'Creates a hidden submit button in order to submit the form with enter.',
     submitCb = 'Sets the callback function on submit form',
+    valueChangeCb = 'Sets the callback function on value change event',
 }

packages/ketchup/src/components/kup-input-panel/kup-input-panel.tsx

@@ -43,6 +43,14 @@ import { KupDom } from '../../managers/kup-manager/kup-manager-declarations';
 import { KupDataCell } from '../../components';
 import { getProps, setProps } from '../../utils/utils';
 
+interface ValueChangeEvent {
+    data: {
+        [key: string]: number | string | object;
+        // field: string;
+        // value: number | string | object;
+    };
+}
+
 const dom: KupDom = document.documentElement as KupDom;
 @Component({
     tag: 'kup-input-panel',
@@ -84,6 +92,12 @@ export class KupInputPanel {
      * @default null
      */
     @Prop() submitCb: (e: SubmitEvent) => unknown = null;
+
+    /**
+     * Sets the callback function on value change event
+     * @default null
+     */
+    @Prop() valueChangeCb: (e: ValueChangeEvent) => unknown = null;
     //#endregion
 
     //#region STATES