From 0c2879b6f48004f9173e599005e176fff6e90898 Mon Sep 17 00:00:00 2001
From: Chenlei Hu <huchenlei@proton.me>
Date: Mon, 10 Feb 2025 23:07:57 -0500
Subject: [PATCH] [Refactor] useIntWidget composable (#2507)

---
 src/composables/widgets/useIntWidget.ts | 49 +++++++++++++++++++++++++
 src/scripts/widgets.ts                  |  5 +--
 2 files changed, 51 insertions(+), 3 deletions(-)
 create mode 100644 src/composables/widgets/useIntWidget.ts

diff --git a/src/composables/widgets/useIntWidget.ts b/src/composables/widgets/useIntWidget.ts
new file mode 100644
index 000000000..6320cdaed
--- /dev/null
+++ b/src/composables/widgets/useIntWidget.ts
@@ -0,0 +1,49 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { INumericWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type { ComfyWidgetConstructor } from '@/scripts/widgets'
+import { useSettingStore } from '@/stores/settingStore'
+import { InputSpec } from '@/types/apiTypes'
+import { getNumberDefaults } from '@/utils/mathUtil'
+
+export const useIntWidget = () => {
+  const widgetConstructor: ComfyWidgetConstructor = (
+    node: LGraphNode,
+    inputName: string,
+    inputData: InputSpec
+  ) => {
+    const settingStore = useSettingStore()
+    const sliderEnabled = !settingStore.get('Comfy.DisableSliders')
+    const inputOptions = inputData[1]
+    const widgetType = sliderEnabled
+      ? inputOptions.display === 'slider'
+        ? 'slider'
+        : 'number'
+      : 'number'
+
+    const { val, config } = getNumberDefaults(inputOptions, {
+      defaultStep: 1,
+      precision: 0,
+      enableRounding: true
+    })
+    config.precision = 0
+
+    return {
+      widget: node.addWidget(
+        widgetType,
+        inputName,
+        val,
+        function (this: INumericWidget, v: number) {
+          const s = (this.options.step ?? 1) / 10
+          let sh = (this.options.min ?? 0) % s
+          if (isNaN(sh)) {
+            sh = 0
+          }
+          this.value = Math.round((v - sh) / s) * s + sh
+        },
+        config
+      )
+    }
+  }
+  return widgetConstructor
+}
diff --git a/src/scripts/widgets.ts b/src/scripts/widgets.ts
index 78783edfc..e77b6ba62 100644
--- a/src/scripts/widgets.ts
+++ b/src/scripts/widgets.ts
@@ -15,6 +15,7 @@ import TiptapStarterKit from '@tiptap/starter-kit'
 import { Markdown as TiptapMarkdown } from 'tiptap-markdown'
 
 import { useFloatWidget } from '@/composables/widgets/useFloatWidget'
+import { useIntWidget } from '@/composables/widgets/useIntWidget'
 import { useRemoteWidget } from '@/composables/widgets/useRemoteWidget'
 import { useStringWidget } from '@/composables/widgets/useStringWidget'
 import { useSettingStore } from '@/stores/settingStore'
@@ -436,9 +437,7 @@ export const ComfyWidgets: Record<string, ComfyWidgetConstructor> = {
   'INT:seed': seedWidget,
   'INT:noise_seed': seedWidget,
   FLOAT: useFloatWidget(),
-  INT(node, inputName, inputData: InputSpec, app) {
-    return createIntWidget(node, inputName, inputData, app)
-  },
+  INT: useIntWidget(),
   BOOLEAN(node, inputName, inputData) {
     let defaultVal = false
     let options = {}