diff --git a/libraries/webcomponents-vue/package-lock.json b/libraries/webcomponents-vue/package-lock.json
index 74fdc87666..5bfeeab0ff 100644
--- a/libraries/webcomponents-vue/package-lock.json
+++ b/libraries/webcomponents-vue/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.3",
       "dependencies": {
         "@datagrok-libraries/webcomponents": "^0.0.2",
+        "@vueuse/core": "^10.11.1",
         "cash-dom": "^8.1.4",
         "datagrok-api": "^1.18.6",
         "dayjs": "=1.11.10",
@@ -298,6 +299,11 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.20",
+      "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
+      "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow=="
+    },
     "node_modules/@types/wu": {
       "version": "2.1.44",
       "resolved": "https://registry.npmjs.org/@types/wu/-/wu-2.1.44.tgz",
@@ -585,6 +591,89 @@
       "integrity": "sha512-q0xCiLkuWWQLzVrecPb0RMsNWyxICOjPrcrwxTUEHb1fsnvni4dcuyG7RT/Ie7VPTvnjzIaWzRMUBsrqNj/hhw==",
       "peer": true
     },
+    "node_modules/@vueuse/core": {
+      "version": "10.11.1",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz",
+      "integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.20",
+        "@vueuse/metadata": "10.11.1",
+        "@vueuse/shared": "10.11.1",
+        "vue-demi": ">=0.14.8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/core/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "10.11.1",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz",
+      "integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared": {
+      "version": "10.11.1",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz",
+      "integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==",
+      "dependencies": {
+        "vue-demi": ">=0.14.8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/acorn": {
       "version": "8.12.1",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
diff --git a/libraries/webcomponents-vue/package.json b/libraries/webcomponents-vue/package.json
index dcbd87f83d..32a7ce1f4c 100644
--- a/libraries/webcomponents-vue/package.json
+++ b/libraries/webcomponents-vue/package.json
@@ -5,6 +5,7 @@
   "description": "Datagrok web components vue wrappers",
   "dependencies": {
     "@datagrok-libraries/webcomponents": "^0.0.2",
+    "@vueuse/core": "^10.11.1",
     "cash-dom": "^8.1.4",
     "datagrok-api": "^1.18.6",
     "dayjs": "=1.11.10",
diff --git a/libraries/webcomponents-vue/src/InputForm/InputForm.tsx b/libraries/webcomponents-vue/src/InputForm/InputForm.tsx
index 318226e7fa..705009383d 100644
--- a/libraries/webcomponents-vue/src/InputForm/InputForm.tsx
+++ b/libraries/webcomponents-vue/src/InputForm/InputForm.tsx
@@ -2,7 +2,7 @@ import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
-import {computed, defineComponent, isReactive, KeepAlive, PropType, ref, shallowRef, watch, watchEffect} from 'vue';
+import {defineComponent, PropType, watch} from 'vue';
 import type {InputFormT} from '@datagrok-libraries/webcomponents/src';
 import {getValidators,
   injectInputBaseValidation,
@@ -10,8 +10,8 @@ import {getValidators,
   validate,
 } from '@datagrok-libraries/compute-utils/shared-utils/utils';
 import {SYNC_FIELD} from '@datagrok-libraries/compute-utils/shared-utils/consts';
-import {ValidationResult, Validator} from '@datagrok-libraries/compute-utils/shared-utils/validation';
-import {FuncCallInputValidated, isFuncCallInputValidated} from '@datagrok-libraries/compute-utils/shared-utils/input-wrappers';
+import {isFuncCallInputValidated} from '@datagrok-libraries/compute-utils/shared-utils/input-wrappers';
+import { computedAsync } from '@vueuse/core'
 
 declare global {
   namespace JSX {
@@ -35,17 +35,11 @@ export const InputForm = defineComponent({
   setup(props, {emit}) {
     let currentForm = undefined as undefined | DG.InputForm;
 
-    let loadedValidators = shallowRef({});
-
-    watch(() => props.funcCall, () => {
-      console.log('props.funcCall changed', props.funcCall);
-
-      getValidators(props.funcCall, SYNC_FIELD.INPUTS).then((res) => loadedValidators.value = res);
-    })
+    let loadedValidators = computedAsync(() => getValidators(props.funcCall, SYNC_FIELD.INPUTS), {}, {shallow: true});
 
     watch(loadedValidators, () => {
       runValidation();
-    })
+    });
 
     const allParams = (funcCall: DG.FuncCall) =>
       [...funcCall.inputParams.values() ?? []].map((param) => param.name);