Tentatively add rest of widget composables

Author: benceruleanlu

src/composables/widgets/useFileUploadWidget.ts

@@ -0,0 +1,21 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { IFileUploadWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  FileUploadInputSpec,
+  InputSpec as InputSpecV2
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useFileUploadWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IFileUploadWidget => {
+    const { name, options = {} } = inputSpec as FileUploadInputSpec
+
+    const widget = node.addWidget('fileupload', name, '', () => {}, {
+      serialize: true,
+      ...(options as Record<string, unknown>)
+    }) as IFileUploadWidget
+
+    return widget
+  }
+}

src/composables/widgets/useGalleriaWidget.ts

@@ -0,0 +1,27 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { IGalleriaWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  GalleriaInputSpec,
+  InputSpec as InputSpecV2
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useGalleriaWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IGalleriaWidget => {
+    const { name, options = {} } = inputSpec as GalleriaInputSpec
+
+    const widget = node.addWidget(
+      'galleria',
+      name,
+      options.images || [],
+      () => {},
+      {
+        serialize: true,
+        ...options
+      }
+    ) as IGalleriaWidget
+
+    return widget
+  }
+}

src/composables/widgets/useImageCompareWidget.ts

@@ -0,0 +1,21 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { IImageCompareWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  ImageCompareInputSpec,
+  InputSpec as InputSpecV2
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useImageCompareWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IImageCompareWidget => {
+    const { name, options = {} } = inputSpec as ImageCompareInputSpec
+
+    const widget = node.addWidget('imagecompare', name, ['', ''], () => {}, {
+      serialize: true,
+      ...options
+    }) as IImageCompareWidget
+
+    return widget
+  }
+}

src/composables/widgets/useImageWidget.ts

@@ -0,0 +1,21 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { IImageWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  ImageInputSpec,
+  InputSpec as InputSpecV2
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useImageWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IImageWidget => {
+    const { name, options = {} } = inputSpec as ImageInputSpec
+
+    const widget = node.addWidget('image', name, '', () => {}, {
+      serialize: true,
+      ...options
+    }) as IImageWidget
+
+    return widget
+  }
+}

src/composables/widgets/useMultiSelectWidget.ts

@@ -0,0 +1,22 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { IMultiSelectWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  InputSpec as InputSpecV2,
+  MultiSelectInputSpec
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useMultiSelectWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IMultiSelectWidget => {
+    const { name, options = {} } = inputSpec as MultiSelectInputSpec
+
+    const widget = node.addWidget('multiselect', name, [], () => {}, {
+      serialize: true,
+      values: options.values || [],
+      ...options
+    }) as IMultiSelectWidget
+
+    return widget
+  }
+}

src/composables/widgets/useSelectButtonWidget.ts

@@ -0,0 +1,29 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { ISelectButtonWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  InputSpec as InputSpecV2,
+  SelectButtonInputSpec
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useSelectButtonWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): ISelectButtonWidget => {
+    const { name, options = {} } = inputSpec as SelectButtonInputSpec
+    const values = options.values || []
+
+    const widget = node.addWidget(
+      'selectbutton',
+      name,
+      values[0] || '',
+      (_value: string) => {},
+      {
+        serialize: true,
+        values,
+        ...options
+      }
+    ) as ISelectButtonWidget
+
+    return widget
+  }
+}

src/composables/widgets/useTextareaWidget.ts

@@ -0,0 +1,29 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { ITextareaWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  InputSpec as InputSpecV2,
+  TextareaInputSpec
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useTextareaWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): ITextareaWidget => {
+    const { name, options = {} } = inputSpec as TextareaInputSpec
+
+    const widget = node.addWidget(
+      'textarea',
+      name,
+      options.default || '',
+      () => {},
+      {
+        serialize: true,
+        rows: options.rows || 5,
+        cols: options.cols || 50,
+        ...options
+      }
+    ) as ITextareaWidget
+
+    return widget
+  }
+}

src/composables/widgets/useTreeSelectWidget.ts

@@ -0,0 +1,25 @@
+import type { LGraphNode } from '@comfyorg/litegraph'
+import type { ITreeSelectWidget } from '@comfyorg/litegraph/dist/types/widgets'
+
+import type {
+  InputSpec as InputSpecV2,
+  TreeSelectInputSpec
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useTreeSelectWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): ITreeSelectWidget => {
+    const { name, options = {} } = inputSpec as TreeSelectInputSpec
+    const isMultiple = options.multiple || false
+    const defaultValue = isMultiple ? [] : ''
+
+    const widget = node.addWidget('treeselect', name, defaultValue, () => {}, {
+      serialize: true,
+      values: options.values || [],
+      multiple: isMultiple,
+      ...options
+    }) as ITreeSelectWidget
+
+    return widget
+  }
+}