fix(vue-widgets): resolve pre-existing typecheck errors

This commit is contained in:
Will Miao
2026-08-06 15:33:02 +08:00
parent 027b504fe8
commit 169fa7bed6
4 changed files with 62 additions and 51 deletions

View File

@@ -98,7 +98,7 @@ interface LoraInfoWidget {
onSetValue?: (v: unknown) => void onSetValue?: (v: unknown) => void
callback?: unknown callback?: unknown
options?: { options?: {
getValue?: () => LoraInfoWidgetValue getValue?: () => unknown
setValue?: (v: unknown) => void setValue?: (v: unknown) => void
} }
node?: { widgets?: Array<{ id?: string }>; widgets_values?: Array<unknown> } node?: { widgets?: Array<{ id?: string }>; widgets_values?: Array<unknown> }
@@ -299,8 +299,12 @@ onMounted(() => {
// ComponentWidgetImpl.value getter/setter delegates to options.getValue/options.setValue. // ComponentWidgetImpl.value getter/setter delegates to options.getValue/options.setValue.
// These must be set for workflow JSON persistence (LGraphNode.serialize/configure) to work. // These must be set for workflow JSON persistence (LGraphNode.serialize/configure) to work.
props.widget.options.getValue = buildValue if (props.widget.options) {
props.widget.options.setValue = applyValue props.widget.options.getValue = buildValue
props.widget.options.setValue = applyValue
} else {
console.warn('[LoraInfoWidget] widget.options missing, value persistence disabled')
}
// Also set serializeValue for prompt/API serialization path (executionUtil.ts) // Also set serializeValue for prompt/API serialization path (executionUtil.ts)
props.widget.serializeValue = async () => buildValue() props.widget.serializeValue = async () => buildValue()

View File

@@ -36,6 +36,9 @@ const AUTOCOMPLETE_TEXT_MIN_HEIGHT_DEFAULT = 300
const AUTOCOMPLETE_METADATA_VERSION = 1 const AUTOCOMPLETE_METADATA_VERSION = 1
const LORA_MANAGER_WIDGET_IDS_PROPERTY = '__lm_widget_ids' const LORA_MANAGER_WIDGET_IDS_PROPERTY = '__lm_widget_ids'
// Access LiteGraph global for Vue DOM mode detection (matches AutocompleteTextWidget.vue)
declare const LiteGraph: { vueNodesMode?: boolean } | undefined
// @ts-ignore - ComfyUI external module // @ts-ignore - ComfyUI external module
import { app } from '../../../scripts/app.js' import { app } from '../../../scripts/app.js'
// @ts-ignore - ComfyUI external module // @ts-ignore - ComfyUI external module
@@ -835,7 +838,7 @@ function createAutocompleteTextWidgetFactory(
applyAutocompleteTextLayoutFix( applyAutocompleteTextLayoutFix(
widget, widget,
container, container,
typeof LiteGraph !== 'undefined' && LiteGraph.vueNodesMode typeof LiteGraph !== 'undefined' && LiteGraph.vueNodesMode === true
) )
} }

View File

@@ -2224,7 +2224,7 @@ to { transform: rotate(360deg);
resize: vertical !important; resize: vertical !important;
} }
.lora-info-widget[data-v-a99cc1ab] { .lora-info-widget[data-v-d7692b6f] {
padding: 12px; padding: 12px;
background: rgba(40, 44, 52, 0.6); background: rgba(40, 44, 52, 0.6);
border-radius: 4px; border-radius: 4px;
@@ -2240,45 +2240,45 @@ to { transform: rotate(360deg);
determined solely by CSS — not by descendant content. This breaks the determined solely by CSS — not by descendant content. This breaks the
feedback loop where content grows → ResizeObserver resizes → content feedback loop where content grows → ResizeObserver resizes → content
reflows → repeat. Same technique used by tags_widget.js + lm_styles.css. */ reflows → repeat. Same technique used by tags_widget.js + lm_styles.css. */
.lora-info-widget.lm-vue-node[data-v-a99cc1ab] { .lora-info-widget.lm-vue-node[data-v-d7692b6f] {
contain: layout size; contain: layout size;
} }
/* ── Tab bar ── */ /* ── Tab bar ── */
.lora-info-tabs[data-v-a99cc1ab] { .lora-info-tabs[data-v-d7692b6f] {
display: flex; display: flex;
gap: 0; gap: 0;
margin-bottom: 10px; margin-bottom: 10px;
border-bottom: 1px solid var(--border-color, #444); border-bottom: 1px solid var(--border-color, #444);
flex-shrink: 0; flex-shrink: 0;
} }
.lora-info-tab[data-v-a99cc1ab] { .lora-info-tab[data-v-d7692b6f] {
flex: 1; flex: 1;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 6px 0; padding: 6px 0;
position: relative; position: relative;
} }
.lora-info-tab-input[data-v-a99cc1ab] { .lora-info-tab-input[data-v-d7692b6f] {
position: absolute; position: absolute;
opacity: 0; opacity: 0;
width: 0; width: 0;
height: 0; height: 0;
} }
.lora-info-tab-label[data-v-a99cc1ab] { .lora-info-tab-label[data-v-d7692b6f] {
font-size: 12px; font-size: 12px;
font-weight: 500; font-weight: 500;
color: var(--fg-color, #fff); color: var(--fg-color, #fff);
opacity: 0.5; opacity: 0.5;
transition: opacity 0.15s; transition: opacity 0.15s;
} }
.lora-info-tab:hover .lora-info-tab-label[data-v-a99cc1ab] { .lora-info-tab:hover .lora-info-tab-label[data-v-d7692b6f] {
opacity: 0.75; opacity: 0.75;
} }
.lora-info-tab.active .lora-info-tab-label[data-v-a99cc1ab] { .lora-info-tab.active .lora-info-tab-label[data-v-d7692b6f] {
opacity: 1; opacity: 1;
} }
.lora-info-tab.active[data-v-a99cc1ab]::after { .lora-info-tab.active[data-v-d7692b6f]::after {
content: ''; content: '';
position: absolute; position: absolute;
bottom: -1px; bottom: -1px;
@@ -2290,16 +2290,16 @@ to { transform: rotate(360deg);
} }
/* ── Tab content ── */ /* ── Tab content ── */
.tab-content[data-v-a99cc1ab] { .tab-content[data-v-d7692b6f] {
flex: 1; flex: 1;
min-height: 0; min-height: 0;
overflow: hidden; overflow: hidden;
} }
.notes-tab[data-v-a99cc1ab] { .notes-tab[data-v-d7692b6f] {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.description-tab[data-v-a99cc1ab] { .description-tab[data-v-d7692b6f] {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow-y: auto; overflow-y: auto;
@@ -2307,12 +2307,12 @@ to { transform: rotate(360deg);
} }
/* ── Info fields (shared) ── */ /* ── Info fields (shared) ── */
.info-field[data-v-a99cc1ab] { .info-field[data-v-d7692b6f] {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 4px; gap: 4px;
} }
.info-label[data-v-a99cc1ab] { .info-label[data-v-d7692b6f] {
font-size: 10px; font-size: 10px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
@@ -2320,7 +2320,7 @@ to { transform: rotate(360deg);
color: var(--fg-color, #fff); color: var(--fg-color, #fff);
opacity: 0.6; opacity: 0.6;
} }
.lora-filename[data-v-a99cc1ab] { .lora-filename[data-v-d7692b6f] {
font-size: 13px; font-size: 13px;
font-weight: 500; font-weight: 500;
color: var(--fg-color, #fff); color: var(--fg-color, #fff);
@@ -2331,11 +2331,11 @@ to { transform: rotate(360deg);
user-select: text; user-select: text;
-webkit-user-select: text; -webkit-user-select: text;
} }
.notes-field[data-v-a99cc1ab] { .notes-field[data-v-d7692b6f] {
flex: 1; flex: 1;
min-height: 0; min-height: 0;
} }
.lora-notes[data-v-a99cc1ab] { .lora-notes[data-v-d7692b6f] {
width: 100%; width: 100%;
flex: 1; flex: 1;
min-height: 60px; min-height: 60px;
@@ -2350,14 +2350,14 @@ to { transform: rotate(360deg);
font-family: inherit; font-family: inherit;
outline: none; outline: none;
} }
.lora-notes[data-v-a99cc1ab]:focus { .lora-notes[data-v-d7692b6f]:focus {
border-color: var(--comfy-input-border, #444); border-color: var(--comfy-input-border, #444);
} }
.lora-notes[data-v-a99cc1ab]:disabled { .lora-notes[data-v-d7692b6f]:disabled {
opacity: 0.6; opacity: 0.6;
cursor: not-allowed; cursor: not-allowed;
} }
.save-btn[data-v-a99cc1ab] { .save-btn[data-v-d7692b6f] {
width: 100%; width: 100%;
margin-top: 8px; margin-top: 8px;
padding: 6px 12px; padding: 6px 12px;
@@ -2371,11 +2371,11 @@ to { transform: rotate(360deg);
box-sizing: border-box; box-sizing: border-box;
flex-shrink: 0; flex-shrink: 0;
} }
.save-btn[data-v-a99cc1ab]:hover:not(:disabled) { .save-btn[data-v-d7692b6f]:hover:not(:disabled) {
background: rgba(66, 153, 225, 0.25); background: rgba(66, 153, 225, 0.25);
border-color: rgba(66, 153, 225, 0.6); border-color: rgba(66, 153, 225, 0.6);
} }
.save-btn[data-v-a99cc1ab]:disabled { .save-btn[data-v-d7692b6f]:disabled {
opacity: 0.4; opacity: 0.4;
cursor: not-allowed; cursor: not-allowed;
background: rgba(66, 153, 225, 0.05); background: rgba(66, 153, 225, 0.05);
@@ -2383,7 +2383,7 @@ to { transform: rotate(360deg);
} }
/* ── Description states ── */ /* ── Description states ── */
.description-state[data-v-a99cc1ab] { .description-state[data-v-d7692b6f] {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -2395,22 +2395,22 @@ to { transform: rotate(360deg);
min-height: 0; min-height: 0;
flex-shrink: 0; flex-shrink: 0;
} }
.description-state.error[data-v-a99cc1ab] { .description-state.error[data-v-d7692b6f] {
opacity: 0.7; opacity: 0.7;
color: #f87171; color: #f87171;
} }
/* ── Description content ── */ /* ── Description content ── */
.description-content[data-v-a99cc1ab] { .description-content[data-v-d7692b6f] {
min-height: 0; min-height: 0;
} }
.description-section[data-v-a99cc1ab] { .description-section[data-v-d7692b6f] {
margin-bottom: 14px; margin-bottom: 14px;
} }
.description-section[data-v-a99cc1ab]:last-child { .description-section[data-v-d7692b6f]:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.description-text[data-v-a99cc1ab] { .description-text[data-v-d7692b6f] {
padding: 8px 0; padding: 8px 0;
font-size: 12px; font-size: 12px;
line-height: 1.5; line-height: 1.5;
@@ -2422,41 +2422,41 @@ to { transform: rotate(360deg);
user-select: text; user-select: text;
-webkit-user-select: text; -webkit-user-select: text;
} }
.description-text[data-v-a99cc1ab] p { .description-text[data-v-d7692b6f] p {
margin: 0 0 8px 0; margin: 0 0 8px 0;
} }
.description-text[data-v-a99cc1ab] p:last-child { .description-text[data-v-d7692b6f] p:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.description-text[data-v-a99cc1ab] a { .description-text[data-v-d7692b6f] a {
color: rgba(66, 153, 225, 0.9); color: rgba(66, 153, 225, 0.9);
} }
.description-text[data-v-a99cc1ab] ul, .description-text[data-v-d7692b6f] ul,
.description-text[data-v-a99cc1ab] ol { .description-text[data-v-d7692b6f] ol {
padding-left: 20px; padding-left: 20px;
margin: 4px 0; margin: 4px 0;
} }
.description-text[data-v-a99cc1ab] h1, .description-text[data-v-d7692b6f] h1,
.description-text[data-v-a99cc1ab] h2, .description-text[data-v-d7692b6f] h2,
.description-text[data-v-a99cc1ab] h3 { .description-text[data-v-d7692b6f] h3 {
font-size: 13px; font-size: 13px;
margin: 10px 0 4px 0; margin: 10px 0 4px 0;
font-weight: 600; font-weight: 600;
opacity: 0.95; opacity: 0.95;
} }
.description-text[data-v-a99cc1ab] code { .description-text[data-v-d7692b6f] code {
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
padding: 1px 4px; padding: 1px 4px;
border-radius: 3px; border-radius: 3px;
font-size: 11px; font-size: 11px;
} }
.description-text[data-v-a99cc1ab] img { .description-text[data-v-d7692b6f] img {
max-width: 100%; max-width: 100%;
border-radius: 4px; border-radius: 4px;
} }
/* ── Placeholder (shared) ── */ /* ── Placeholder (shared) ── */
.placeholder[data-v-a99cc1ab] { .placeholder[data-v-d7692b6f] {
font-style: italic; font-style: italic;
color: rgba(226, 232, 240, 0.5); color: rgba(226, 232, 240, 0.5);
text-align: center; text-align: center;
@@ -2465,10 +2465,10 @@ to { transform: rotate(360deg);
} }
/* ── Spinner (Font Awesome) ── */ /* ── Spinner (Font Awesome) ── */
.fa-spinner[data-v-a99cc1ab] { .fa-spinner[data-v-d7692b6f] {
animation: fa-spin-a99cc1ab 1s linear infinite; animation: fa-spin-d7692b6f 1s linear infinite;
} }
@keyframes fa-spin-a99cc1ab { @keyframes fa-spin-d7692b6f {
0% { transform: rotate(0deg); 0% { transform: rotate(0deg);
} }
100% { transform: rotate(360deg); 100% { transform: rotate(360deg);
@@ -15511,8 +15511,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
if (data.filePath !== void 0) filePath.value = data.filePath; if (data.filePath !== void 0) filePath.value = data.filePath;
} }
}; };
props.widget.options.getValue = buildValue; if (props.widget.options) {
props.widget.options.setValue = applyValue; props.widget.options.getValue = buildValue;
props.widget.options.setValue = applyValue;
} else {
console.warn("[LoraInfoWidget] widget.options missing, value persistence disabled");
}
props.widget.serializeValue = async () => buildValue(); props.widget.serializeValue = async () => buildValue();
props.widget.onSetValue = applyValue; props.widget.onSetValue = applyValue;
const widgetIndex = (_b = (_a2 = props.widget.node) == null ? void 0 : _a2.widgets) == null ? void 0 : _b.findIndex( const widgetIndex = (_b = (_a2 = props.widget.node) == null ? void 0 : _a2.widgets) == null ? void 0 : _b.findIndex(
@@ -15641,7 +15645,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
}; };
} }
}); });
const LoraInfoWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a99cc1ab"]]); const LoraInfoWidget = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d7692b6f"]]);
function createVueWidgetCleanup(vueApp, onCleanup) { function createVueWidgetCleanup(vueApp, onCleanup) {
let didUnmount = false; let didUnmount = false;
return () => { return () => {
@@ -16637,7 +16641,7 @@ function createAutocompleteTextWidgetFactory(node, widgetName, modelType, inputO
applyAutocompleteTextLayoutFix( applyAutocompleteTextLayoutFix(
widget, widget,
container, container,
typeof LiteGraph !== "undefined" && LiteGraph.vueNodesMode typeof LiteGraph !== "undefined" && LiteGraph.vueNodesMode === true
); );
} }
const vueCleanup = createVueWidgetCleanup(vueApp, () => { const vueCleanup = createVueWidgetCleanup(vueApp, () => {

File diff suppressed because one or more lines are too long