neuro_llc/ComfyBox
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Merge pull request #125 from space-nuko/restore-params2

Browse Source 
Upgrade Svelte and dependency versions
This commit is contained in:
space-nuko
2023-07-07 09:49:39 -05:00
committed by GitHub
parent 3b49bac47b c817231241
commit 6f02912d2e
15 changed files with 1347 additions and 327 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
README.md
View File

@@ -37,11 +37,14 @@ Also note that the saved workflow format is subject to change until it's been fi
### Requirements
- `git`
- `pnpm`
- An installation of vanilla [ComfyUI](https://github.com/comfyanonymous/ComfyUI) for the backend
### Installation
**NOTE:** If you're using Windows, the following commands must be run with [Git Bash](https://git-scm.com/downloads).
1. Clone the repo with submodules:
```

69
package.json
View File

@@ -18,38 +18,38 @@
"build:css": "pollen -c gradio/js/theme/src/pollen.config.cjs && mv src/pollen.css node_modules/@gradio/theme/src"
},
"devDependencies": {
"@floating-ui/core": "^1.2.6",
"@floating-ui/dom": "^1.2.8",
"@floating-ui/core": "^1.3.1",
"@floating-ui/dom": "^1.4.2",
"@zerodevx/svelte-toast": "^0.9.3",
"eslint": "^8.37.0",
"eslint": "^8.43.0",
"eslint-config-prettier": "^8.8.0",
"eslint-plugin-svelte3": "^4.0.0",
"happy-dom": "^9.18.3",
"jsdom": "^22.0.0",
"prettier": "^2.8.7",
"prettier-plugin-svelte": "^2.10.0",
"rollup-plugin-visualizer": "^5.9.0",
"sass": "^1.61.0",
"svelte": "^3.59.0",
"svelte-check": "^3.2.0",
"happy-dom": "^9.20.3",
"jsdom": "^22.1.0",
"prettier": "^2.8.8",
"prettier-plugin-svelte": "^2.10.1",
"rollup-plugin-visualizer": "^5.9.2",
"sass": "^1.63.6",
"svelte": "^4.0.0",
"svelte-check": "^3.4.4",
"svelte-dnd-action": "^0.9.22",
"typescript": "^5.0.3",
"vite": "^4.3.8",
"typescript": "^5.1.3",
"vite": "^4.3.9",
"vite-plugin-glsl": "^1.1.2",
"vite-plugin-static-copy": "^0.14.0",
"vite-plugin-svelte-console-remover": "^1.0.10",
"vite-tsconfig-paths": "^4.0.8",
"vite-tsconfig-paths": "^4.2.0",
"vitest": "^0.27.3"
},
"type": "module",
"dependencies": {
"@codemirror/autocomplete": "^6.3.0",
"@codemirror/commands": "^6.1.2",
"@codemirror/language": "^6.6.0",
"@codemirror/lint": "^6.0.0",
"@codemirror/search": "^6.2.2",
"@codemirror/state": "^6.1.2",
"@codemirror/view": "^6.4.1",
"@codemirror/autocomplete": "^6.8.0",
"@codemirror/commands": "^6.2.4",
"@codemirror/language": "^6.8.0",
"@codemirror/lint": "^6.2.2",
"@codemirror/search": "^6.5.0",
"@codemirror/state": "^6.2.1",
"@codemirror/view": "^6.13.2",
"@dogagenc/svelte-markdown": "^0.2.4",
"@gradio/accordion": "workspace:*",
"@gradio/atoms": "workspace:*",
@@ -65,6 +65,9 @@
"@gradio/theme": "workspace:*",
"@gradio/upload": "workspace:*",
"@gradio/utils": "workspace:*",
"@lezer/generator": "^1.3.0",
"@lezer/highlight": "^1.1.6",
"@lezer/lr": "^1.3.7",
"@litegraph-ts/core": "workspace:*",
"@litegraph-ts/nodes-basic": "workspace:*",
"@litegraph-ts/nodes-events": "workspace:*",
@@ -72,32 +75,32 @@
"@litegraph-ts/nodes-math": "workspace:*",
"@litegraph-ts/nodes-strings": "workspace:*",
"@litegraph-ts/tsconfig": "workspace:*",
"@sveltejs/vite-plugin-svelte": "^2.1.1",
"@sveltejs/vite-plugin-svelte": "^2.4.2",
"@tsconfig/svelte": "^4.0.1",
"@types/dompurify": "^3.0.2",
"canvas-to-svg": "^1.0.3",
"cm6-theme-basic-dark": "^0.2.0",
"cm6-theme-basic-light": "^0.2.0",
"codemirror": "^6.0.1",
"csv": "^6.3.0",
"csv-parse": "^5.3.10",
"csv": "^6.3.1",
"csv-parse": "^5.4.0",
"dompurify": "^3.0.3",
"events": "^3.3.0",
"framework7": "^8.0.3",
"framework7-svelte": "^8.0.3",
"framework7": "^8.1.0",
"framework7-svelte": "^8.1.0",
"img-comparison-slider": "^8.0.0",
"marked": "^5.0.3",
"marked": "^5.1.0",
"pollen-css": "^4.6.2",
"radix-icons-svelte": "^1.2.1",
"style-mod": "^4.0.3",
"svelte-bootstrap-icons": "^2.3.1",
"svelte-feather-icons": "^4.0.0",
"svelte-floating-ui": "^1.5.2",
"svelte-preprocess": "^5.0.3",
"svelte-select": "^5.5.3",
"svelte-splitpanes": "^0.7.13",
"svelte-feather-icons": "^4.0.1",
"svelte-floating-ui": "^1.5.3",
"svelte-preprocess": "^5.0.4",
"svelte-select": "^5.6.1",
"svelte-splitpanes": "^0.7.15",
"svelte-tiny-virtual-list": "^2.0.5",
"tailwindcss": "^3.3.1",
"tailwindcss": "^3.3.2",
"typed-emitter": "github:andywer/typed-emitter",
"uuid": "^9.0.0",
"vite-plugin-full-reload": "^1.0.5",

1514
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

2
src/lib/components/AccordionContainer.svelte
View File

@@ -104,7 +104,7 @@
>
<WidgetContainer {layoutState} dragItem={item} zIndex={zIndex+1} {isMobile} />
{#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
<div in:fade={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
<div in:fade|global={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
{/if}
</div>
{/each}

2
src/lib/components/BlockContainer.svelte
View File

@@ -102,7 +102,7 @@
>
<WidgetContainer {layoutState} dragItem={item} zIndex={zIndex+1} {isMobile} />
{#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
<div in:fade={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
<div in:fade|global={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
{/if}
</div>
{/each}

2
src/lib/components/ComfyBoxWorkflowsView.svelte
View File

@@ -336,7 +336,7 @@
✕
</button>
{#if workflow[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
<div in:fade={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
<div in:fade|global={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
{/if}
</button>
{/each}

2
src/lib/components/ComfyPaneView.svelte
View File

@@ -22,7 +22,7 @@
export let mode: ComfyPaneMode = "none";
export let showSwitcher: boolean = false;
const MODES: [ComfyPaneMode, typeof SvelteComponent][] = [
const MODES: [ComfyPaneMode, typeof SvelteComponent<any>][] = [
["properties", Sliders2],
["templates", BoxSeam],
["queue", LayoutTextSidebarReverse]

2
src/lib/components/ComfyTemplates.svelte
View File

@@ -197,7 +197,7 @@
<div class="template-desc">{item.template.metadata.description}</div>
</div>
{#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
<div in:fade={{duration:200, easing: cubicIn}} class='template-drag-item-shadow'/>
<div in:fade|global={{duration:200, easing: cubicIn}} class='template-drag-item-shadow'/>
{/if}
{/each}
</div>

2
src/lib/components/TabsContainer.svelte
View File

@@ -112,7 +112,7 @@
</label>
<WidgetContainer {layoutState} dragItem={item} zIndex={zIndex+1} {isMobile} />
{#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
<div in:fade={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
<div in:fade|global={{duration:200, easing: cubicIn}} class='drag-item-shadow'/>
{/if}
</Block>
</div>

2
src/lib/stores/uiQueueState.ts
View File

@@ -73,7 +73,7 @@ function convertEntry(entry: QueueEntry, status: QueueUIEntryStatus): QueueUIEnt
message += ` (${subgraphsString})`
}
let submessage = `Nodes: ${Object.keys(entry.prompt).length}`
let submessage = `#: ${entry.number}, Nodes: ${Object.keys(entry.prompt).length}`
if (Object.keys(entry.outputs).length > 0) {
const imageCount = Object.values(entry.outputs).filter(o => o.images).flatMap(o => o.images).length

36
src/lib/widgets/ComfyUI.grammar Normal file
View File

@@ -0,0 +1,36 @@
@top Program { expression* }
@skip {} {
BlockComment { "/*" (blockCommentContent | blockCommentNewline)* blockCommentEnd }
}
@skip { space | LineComment | BlockComment }
@local tokens {
blockCommentEnd { "*/" }
blockCommentNewline { "\n" }
@else blockCommentContent
}
expression {
Identifier |
String |
Boolean |
Application { "(" expression* ")" }
}
@tokens {
Identifier { $[a-zA-Z_\-0-9]+ }
String { '"' (!["\\] | "\\" _)* '"' }
Boolean { "#t" | "#f" }
LineComment { "//" ![\n]* }
space { $[ \t\n\r]+ }
"(" ")"
}
@detectDelim

3
src/lib/widgets/ComfyUI.grammar.d.ts vendored Normal file
View File

@@ -0,0 +1,3 @@
import { LRParser } from "@lezer/lr"
export declare const parser: LRParser

11
src/lib/widgets/GalleryWidget.svelte
View File

@@ -110,6 +110,16 @@
showMobileLightbox(images, selectedImage, { thumbs: images });
}
function onClickedSingle(e: CustomEvent<GradioSelectData>) {
const images = $nodeValue.map(comfyBoxImageToComfyURL)
if (isMobile) {
showMobileLightbox(images, 0, { thumbs: images });
}
else {
ImageViewer.instance.showModal(images, 0)
}
}
function onClicked(e: CustomEvent<HTMLImageElement>) {
if (isMobile) {
showMobileLightbox_(e.detail, $selected_image)
@@ -136,6 +146,7 @@
value={url}
show_label={widget.attrs.title != ""}
label={widget.attrs.title}
on:select={onClickedSingle}
bind:imageWidth={$imageWidth}
bind:imageHeight={$imageHeight}
/>

22
src/lib/widgets/TextWidgetCodeVariant.ts
View File

@@ -14,7 +14,8 @@ import {
indentOnInput,
syntaxHighlighting,
defaultHighlightStyle,
foldKeymap
foldKeymap,
LRLanguage, LanguageSupport, indentNodeProp, foldNodeProp, foldInside, delimitedIndent
} from "@codemirror/language";
import { history, defaultKeymap, historyKeymap } from "@codemirror/commands";
import {
@@ -27,8 +28,26 @@ import {
type CompletionSource, autocompletion, CompletionContext, startCompletion,
currentCompletions, completionStatus, completeFromList, acceptCompletion
} from "@codemirror/autocomplete"
import { styleTags, tags as t } from "@lezer/highlight"
import DanbooruTags from "$lib/DanbooruTags";
import { parser } from "./ComfyUI.grammar"
export const comfyUILanguage = LRLanguage.define({
name: "ComfyUI",
parser: parser.configure({
props: [
styleTags({
LineComment: t.lineComment,
BlockComment: t.blockComment,
})
]
}),
languageData: {
commentTokens: { line: "//", block: { open: "/*", close: "*/" } },
}
})
export const basicSetup: Extension = /*@__PURE__*/ (() => [
lineNumbers(),
highlightSpecialChars(),
@@ -43,6 +62,7 @@ export const basicSetup: Extension = /*@__PURE__*/ (() => [
crosshairCursor(),
EditorView.lineWrapping,
DanbooruTags.getCompletionExt(),
new LanguageSupport(comfyUILanguage),
keymap.of([
...closeBracketsKeymap,

2
vite.config.ts
View File

@@ -8,6 +8,7 @@ import removeConsole from 'vite-plugin-svelte-console-remover';
import glsl from 'vite-plugin-glsl';
import { execSync } from "child_process"
import { visualizer } from "rollup-plugin-visualizer";
import { lezer } from "@lezer/generator/rollup"
const isProduction = process.env.NODE_ENV === "production";
console.log("Production build: " + isProduction)
@@ -31,6 +32,7 @@ export default defineConfig({
isProduction && removeConsole(),
glsl(),
svelte(),
lezer(),
visualizer(),
viteStaticCopy({
targets: [