diff --git a/web/js/multi_bool_panel.js b/web/js/multi_bool_panel.js index 2cb73a6..234a630 100644 --- a/web/js/multi_bool_panel.js +++ b/web/js/multi_bool_panel.js @@ -89,15 +89,19 @@ function buildPanel(panelNode) { const listEl = document.createElement("div"); container.appendChild(listEl); - // addDOMWidget + // addDOMWidget — the new frontend (comfyui_frontend_package) drops + // options.computeSize, so sizing must be attached to the widget instance. + // Provide both computeLayoutSize (new) and computeSize (legacy) paths. + let rowsHeight = 60; const domWidget = panelNode.addDOMWidget("multi_bool_panel", "multi_bool_panel", container, { serialize: false, - computeSize: () => { - const rows = listEl.children.length; - const h = rows * ROW_HEIGHT + HEADER_PAD; - return [panelNode.size[0], Math.max(h + HEADER_PAD, 60)]; - }, }); + domWidget.computeLayoutSize = () => ({ + minHeight: rowsHeight, + minWidth: 150, + maxHeight: rowsHeight, + }); + domWidget.computeSize = (nodeWidth) => [nodeWidth, rowsHeight]; // ── render ──────────────────────────────────────────── @@ -219,7 +223,8 @@ function buildPanel(panelNode) { function resizeNode() { const rows = listEl.children.length; const h = rows * ROW_HEIGHT + HEADER_PAD; - panelNode.size = [panelNode.size[0], Math.max(h + HEADER_PAD, 60)]; + rowsHeight = Math.max(h + HEADER_PAD, 60); + panelNode.size = [panelNode.size[0], rowsHeight]; panelNode.setDirtyCanvas(true, true); } @@ -256,11 +261,15 @@ function buildPanel(panelNode) { // ── event hooks ─────────────────────────────────────── - // Graph changes (add/remove/rename nodes) - const onGraphChange = () => scheduleRefresh(); - if (panelNode.graph) { - panelNode.graph.on("change", onGraphChange); - } + // Graph changes (add/remove/rename nodes) — LiteGraph has no graph.on("change") + // event; chain the on_change property hook instead (works on old and new litegraph). + const graph = panelNode.graph; + const prevOnChange = graph ? graph.on_change : null; + const onGraphChangeWrapper = (g) => { + if (prevOnChange) prevOnChange(g); + scheduleRefresh(); + }; + if (graph) graph.on_change = onGraphChangeWrapper; // Title / property changes const origOnPropertyChanged = panelNode.onPropertyChanged; @@ -285,8 +294,8 @@ function buildPanel(panelNode) { // Cleanup on removal const origOnRemoved = panelNode.onRemoved; panelNode.onRemoved = function () { - if (panelNode.graph) { - panelNode.graph.off("change", onGraphChange); + if (panelNode.graph && panelNode.graph.on_change === onGraphChangeWrapper) { + panelNode.graph.on_change = prevOnChange; } if (origOnRemoved) origOnRemoved.call(this); };