Huge refactoring for multiple workflows

src/lib/widgets/ButtonWidget.svelte

@@ -1,21 +1,23 @@
 <script lang="ts">
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { Button } from "@gradio/button";
  import { get, type Writable, writable } from "svelte/store";
  import { isDisabled } from "./utils"
  import type { ComfyButtonNode } from "$lib/nodes/widgets";
+
  export let widget: WidgetLayout | null = null;
  export let isMobile: boolean = false;
+
  let node: ComfyButtonNode | null = null;
- let nodeValue: Writable<boolean> | null = null;
- let attrsChanged: Writable<boolean> | null = null;
+ // let nodeValue: Writable<boolean> = writable(false);
+ let attrsChanged: Writable<number> = writable(0);
 
  $: widget && setNodeValue(widget);
 
  function setNodeValue(widget: WidgetLayout) {
      if (widget) {
          node = widget.node as ComfyButtonNode
-         nodeValue = node.value;
+         // nodeValue = node.value;
          attrsChanged = widget.attrsChanged;
      }
  };
@@ -26,7 +28,7 @@
  }
 
  const style = {
-     full_width: "100%",
+     full_width: true
  }
 </script>
 

src/lib/widgets/CheckboxWidget.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { Block } from "@gradio/atoms";
  import { Checkbox } from "@gradio/form";
  import { get, type Writable, writable } from "svelte/store";

src/lib/widgets/ComboWidget.svelte

@@ -5,7 +5,7 @@
  // import VirtualList from '$lib/components/VirtualList.svelte';
  import VirtualList from 'svelte-tiny-virtual-list';
  import type { ComfyComboNode } from "$lib/nodes/widgets";
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { get, writable, type Writable } from "svelte/store";
  import { isDisabled } from "./utils"
  export let widget: WidgetLayout | null = null;

src/lib/widgets/GalleryWidget.svelte

@@ -5,7 +5,7 @@
  import { Image } from "@gradio/icons";
  import { StaticImage } from "$lib/components/gradio/image";
  import type { Styles } from "@gradio/utils";
- import type { WidgetLayout } from "$lib/stores/layoutState";
+ import type { WidgetLayout } from "$lib/stores/layoutStates";
  import { writable, type Writable } from "svelte/store";
  import type { FileData as GradioFileData } from "@gradio/upload";
  import type { SelectData as GradioSelectData } from "@gradio/utils";

src/lib/widgets/ImageUploadWidget.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { Block } from "@gradio/atoms";
  import { TextBox } from "@gradio/form";
  import Row from "$lib/components/gradio/app/Row.svelte";

src/lib/widgets/NumberWidget.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
  import type { ComfyNumberNode } from "$lib/nodes/widgets";
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { Range } from "$lib/components/gradio/form";
  import { get, type Writable } from "svelte/store";
  import { debounce } from "$lib/utils";

src/lib/widgets/RadioWidget.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { Block } from "@gradio/atoms";
  import { Radio } from "@gradio/form";
  import { get, type Writable, writable } from "svelte/store";

src/lib/widgets/TextWidget.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
  import { TextBox } from "@gradio/form";
- import { type WidgetLayout } from "$lib/stores/layoutState";
+ import { type WidgetLayout } from "$lib/stores/layoutStates";
  import { type Writable } from "svelte/store";
  import { isDisabled } from "./utils"
  import type { ComfyTextNode } from "$lib/nodes/widgets";

src/lib/widgets/utils.ts

@@ -1,5 +1,4 @@
-import type { IDragItem } from "$lib/stores/layoutState";
-import layoutState from "$lib/stores/layoutState";
+import type { IDragItem } from "$lib/stores/layoutStates";
 import { LGraphNode, NodeMode } from "@litegraph-ts/core";
 import { get } from "svelte/store";