var __defProp = Object.defineProperty; var __name = (target, value) => __defProp(target, "name", { value, configurable: true }); import { d as defineComponent, u as useSettingStore, r as ref, a as useTitleEditorStore, b as useCanvasStore, w as watch, L as LGraphGroup, c as app, e as LGraphNode, o as onMounted, f as onUnmounted, g as openBlock, h as createElementBlock, i as createVNode, E as EditableText, n as normalizeStyle, j as createCommentVNode, k as LiteGraph, _ as _export_sfc, B as BaseStyle, s as script$c, l as resolveComponent, m as mergeProps, p as renderSlot, q as computed, t as resolveDirective, v as withDirectives, x as createBlock, y as withCtx, z as unref, A as createBaseVNode, C as normalizeClass, D as script$d, F as useCommandStore, G as useDialogStore, S as SettingDialogHeader, H as SettingDialogContent, I as useWorkspaceStore, J as onBeforeUnmount, K as useKeybindingStore, M as Fragment, N as renderList, T as Teleport, O as resolveDynamicComponent, P as pushScopeId, Q as popScopeId, R as script$e, U as getWidth, V as getHeight, W as getOuterWidth, X as getOuterHeight, Y as getVNodeProp, Z as isArray, $ as vShow, a0 as isNotEmpty, a1 as UniqueComponentId, a2 as ZIndex, a3 as resolveFieldData, a4 as focus, a5 as OverlayEventBus, a6 as isEmpty, a7 as addStyle, a8 as relativePosition, a9 as absolutePosition, aa as ConnectedOverlayScrollHandler, ab as isTouchDevice, ac as equals, ad as findLastIndex, ae as findSingle, af as script$f, ag as script$g, ah as script$h, ai as script$i, aj as script$j, ak as script$k, al as Ripple, am as toDisplayString, an as Transition, ao as createSlots, ap as createTextVNode, aq as useNodeFrequencyStore, ar as useNodeBookmarkStore, as as highlightQuery, at as script$l, au as formatNumberWithSuffix, av as NodeSourceType, aw as useI18n, ax as useNodeDefStore, ay as NodePreview, az as NodeSearchFilter, aA as script$m, aB as SearchFilterChip, aC as watchEffect, aD as toRaw, aE as LinkReleaseTriggerAction, aF as useEventListener, aG as nextTick, aH as markRaw, aI as useModelToNodeStore, aJ as usePragmaticDroppable, aK as ComfyNodeDefImpl, aL as ComfyModelDef, aM as LGraph, aN as LLink, aO as DragAndScale, aP as LGraphCanvas, aQ as ContextMenu, aR as LGraphBadge, aS as script$o, aT as script$q, aU as script$r, aV as normalizeProps, aW as ToastEventBus, aX as setAttribute, aY as TransitionGroup, aZ as useToast, a_ as useToastStore, a$ as useExecutionStore, b0 as useWorkflowStore, b1 as useTitle, b2 as withModifiers, b3 as script$s, b4 as resolve, b5 as script$t, b6 as script$u, b7 as isPrintableCharacter, b8 as guardReactiveProps, b9 as useMenuItemStore, ba as script$x, bb as nestedPosition, bc as useQueueSettingsStore, bd as storeToRefs, be as isRef, bf as script$y, bg as useQueuePendingTaskCountStore, bh as useLocalStorage, bi as useDraggable, bj as watchDebounced, bk as inject, bl as useElementBounding, bm as script$z, bn as lodashExports, bo as useEventBus, bp as provide, bq as api, br as i18n, bs as useWorkflowBookmarkStore, bt as useSidebarTabStore } from "./index-CgU1oKZt.js"; import { s as script$n, a as script$p, b as script$v, c as script$w } from "./index-DYEEBf64.js"; const _sfc_main$m = /* @__PURE__ */ defineComponent({ __name: "TitleEditor", setup(__props) { const settingStore = useSettingStore(); const showInput = ref(false); const editedTitle = ref(""); const inputStyle = ref({ position: "fixed", left: "0px", top: "0px", width: "200px", height: "20px", fontSize: "12px" }); const titleEditorStore = useTitleEditorStore(); const canvasStore = useCanvasStore(); const previousCanvasDraggable = ref(true); const onEdit = /* @__PURE__ */ __name((newValue) => { if (titleEditorStore.titleEditorTarget && newValue.trim() !== "") { titleEditorStore.titleEditorTarget.title = newValue.trim(); app.graph.setDirtyCanvas(true, true); } showInput.value = false; titleEditorStore.titleEditorTarget = null; canvasStore.canvas.allow_dragcanvas = previousCanvasDraggable.value; }, "onEdit"); watch( () => titleEditorStore.titleEditorTarget, (target) => { if (target === null) { return; } editedTitle.value = target.title; showInput.value = true; previousCanvasDraggable.value = canvasStore.canvas.allow_dragcanvas; canvasStore.canvas.allow_dragcanvas = false; if (target instanceof LGraphGroup) { const group = target; const [x, y] = group.pos; const [w, h] = group.size; const [left, top] = app.canvasPosToClientPos([x, y]); inputStyle.value.left = `${left}px`; inputStyle.value.top = `${top}px`; const width = w * app.canvas.ds.scale; const height = group.titleHeight * app.canvas.ds.scale; inputStyle.value.width = `${width}px`; inputStyle.value.height = `${height}px`; const fontSize = group.font_size * app.canvas.ds.scale; inputStyle.value.fontSize = `${fontSize}px`; } else if (target instanceof LGraphNode) { const node = target; const [x, y] = node.getBounding(); const canvasWidth = node.width; const canvasHeight = LiteGraph.NODE_TITLE_HEIGHT; const [left, top] = app.canvasPosToClientPos([x, y]); inputStyle.value.left = `${left}px`; inputStyle.value.top = `${top}px`; const width = canvasWidth * app.canvas.ds.scale; const height = canvasHeight * app.canvas.ds.scale; inputStyle.value.width = `${width}px`; inputStyle.value.height = `${height}px`; const fontSize = 12 * app.canvas.ds.scale; inputStyle.value.fontSize = `${fontSize}px`; } } ); const canvasEventHandler = /* @__PURE__ */ __name((event) => { if (!settingStore.get("Comfy.Group.DoubleClickTitleToEdit")) { return; } if (event.detail.subType === "group-double-click") { const group = event.detail.group; const [x, y] = group.pos; const e = event.detail.originalEvent; const relativeY = e.canvasY - y; if (relativeY > group.titleHeight) { return; } titleEditorStore.titleEditorTarget = group; } }, "canvasEventHandler"); const extension = { name: "Comfy.NodeTitleEditor", nodeCreated(node) { const originalCallback = node.onNodeTitleDblClick; node.onNodeTitleDblClick = function(e, ...args) { if (!settingStore.get("Comfy.Node.DoubleClickTitleToEdit")) { return; } titleEditorStore.titleEditorTarget = this; if (typeof originalCallback === "function") { originalCallback.call(this, e, ...args); } }; } }; onMounted(() => { document.addEventListener("litegraph:canvas", canvasEventHandler); app.registerExtension(extension); }); onUnmounted(() => { document.removeEventListener("litegraph:canvas", canvasEventHandler); }); return (_ctx, _cache) => { return showInput.value ? (openBlock(), createElementBlock("div", { key: 0, class: "group-title-editor node-title-editor", style: normalizeStyle(inputStyle.value) }, [ createVNode(EditableText, { isEditing: showInput.value, modelValue: editedTitle.value, onEdit }, null, 8, ["isEditing", "modelValue"]) ], 4)) : createCommentVNode("", true); }; } }); const TitleEditor = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-fc3f26e3"]]); var theme$8 = /* @__PURE__ */ __name(function theme(_ref) { var dt = _ref.dt; return "\n.p-overlaybadge {\n position: relative;\n}\n\n.p-overlaybadge .p-badge {\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n transform-origin: 100% 0;\n margin: 0;\n outline-width: ".concat(dt("overlaybadge.outline.width"), ";\n outline-style: solid;\n outline-color: ").concat(dt("overlaybadge.outline.color"), ";\n}\n"); }, "theme"); var classes$9 = { root: "p-overlaybadge" }; var OverlayBadgeStyle = BaseStyle.extend({ name: "overlaybadge", theme: theme$8, classes: classes$9 }); var script$1$9 = { name: "OverlayBadge", "extends": script$c, style: OverlayBadgeStyle, provide: /* @__PURE__ */ __name(function provide2() { return { $pcOverlayBadge: this, $parentInstance: this }; }, "provide") }; var script$b = { name: "OverlayBadge", "extends": script$1$9, inheritAttrs: false, components: { Badge: script$c } }; function render$d(_ctx, _cache, $props, $setup, $data, $options) { var _component_Badge = resolveComponent("Badge"); return openBlock(), createElementBlock("div", mergeProps({ "class": _ctx.cx("root") }, _ctx.ptmi("root")), [renderSlot(_ctx.$slots, "default"), createVNode(_component_Badge, mergeProps(_ctx.$props, { pt: _ctx.ptm("pcBadge") }), null, 16, ["pt"])], 16); } __name(render$d, "render$d"); script$b.render = render$d; const _sfc_main$l = /* @__PURE__ */ defineComponent({ __name: "SidebarIcon", props: { icon: String, selected: Boolean, tooltip: { type: String, default: "" }, class: { type: String, default: "" }, iconBadge: { type: [String, Function], default: "" } }, emits: ["click"], setup(__props, { emit: __emit }) { const props = __props; const emit = __emit; const overlayValue = computed( () => typeof props.iconBadge === "function" ? props.iconBadge() || "" : props.iconBadge ); const shouldShowBadge = computed(() => !!overlayValue.value); return (_ctx, _cache) => { const _directive_tooltip = resolveDirective("tooltip"); return withDirectives((openBlock(), createBlock(unref(script$d), { class: normalizeClass(props.class), text: "", pt: { root: { class: `side-bar-button ${props.selected ? "p-button-primary side-bar-button-selected" : "p-button-secondary"}`, "aria-label": props.tooltip } }, onClick: _cache[0] || (_cache[0] = ($event) => emit("click", $event)) }, { icon: withCtx(() => [ shouldShowBadge.value ? (openBlock(), createBlock(unref(script$b), { key: 0, value: overlayValue.value }, { default: withCtx(() => [ createBaseVNode("i", { class: normalizeClass(props.icon + " side-bar-button-icon") }, null, 2) ]), _: 1 }, 8, ["value"])) : (openBlock(), createElementBlock("i", { key: 1, class: normalizeClass(props.icon + " side-bar-button-icon") }, null, 2)) ]), _: 1 }, 8, ["class", "pt"])), [ [_directive_tooltip, { value: props.tooltip, showDelay: 300, hideDelay: 300 }] ]); }; } }); const SidebarIcon = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-caa3ee9c"]]); const _sfc_main$k = /* @__PURE__ */ defineComponent({ __name: "SidebarThemeToggleIcon", setup(__props) { const settingStore = useSettingStore(); const currentTheme = computed(() => settingStore.get("Comfy.ColorPalette")); const icon = computed( () => currentTheme.value !== "light" ? "pi pi-moon" : "pi pi-sun" ); const commandStore = useCommandStore(); const toggleTheme = /* @__PURE__ */ __name(() => { commandStore.execute("Comfy.ToggleTheme"); }, "toggleTheme"); return (_ctx, _cache) => { return openBlock(), createBlock(SidebarIcon, { icon: icon.value, onClick: toggleTheme, tooltip: _ctx.$t("sideToolbar.themeToggle"), class: "comfy-vue-theme-toggle" }, null, 8, ["icon", "tooltip"]); }; } }); const _sfc_main$j = /* @__PURE__ */ defineComponent({ __name: "SidebarSettingsToggleIcon", setup(__props) { const dialogStore = useDialogStore(); const showSetting = /* @__PURE__ */ __name(() => { dialogStore.showDialog({ headerComponent: SettingDialogHeader, component: SettingDialogContent }); }, "showSetting"); return (_ctx, _cache) => { return openBlock(), createBlock(SidebarIcon, { icon: "pi pi-cog", class: "comfy-settings-btn", onClick: showSetting, tooltip: _ctx.$t("settings") }, null, 8, ["tooltip"]); }; } }); const _withScopeId$6 = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-b6bfc188"), n = n(), popScopeId(), n), "_withScopeId$6"); const _hoisted_1$g = { class: "side-tool-bar-end" }; const _hoisted_2$d = { key: 0, class: "sidebar-content-container h-full overflow-y-auto overflow-x-hidden" }; const _sfc_main$i = /* @__PURE__ */ defineComponent({ __name: "SideToolbar", setup(__props) { const workspaceStore = useWorkspaceStore(); const settingStore = useSettingStore(); const teleportTarget = computed( () => settingStore.get("Comfy.Sidebar.Location") === "left" ? ".comfyui-body-left" : ".comfyui-body-right" ); const isSmall = computed( () => settingStore.get("Comfy.Sidebar.Size") === "small" ); const tabs = computed(() => workspaceStore.getSidebarTabs()); const selectedTab = computed(() => workspaceStore.sidebarTab.activeSidebarTab); const mountCustomTab = /* @__PURE__ */ __name((tab, el) => { tab.render(el); }, "mountCustomTab"); const onTabClick = /* @__PURE__ */ __name((item3) => { workspaceStore.sidebarTab.toggleSidebarTab(item3.id); }, "onTabClick"); onBeforeUnmount(() => { tabs.value.forEach((tab) => { if (tab.type === "custom" && tab.destroy) { tab.destroy(); } }); }); const keybindingStore = useKeybindingStore(); const getTabTooltipSuffix = /* @__PURE__ */ __name((tab) => { const keybinding = keybindingStore.getKeybindingByCommandId( `Workspace.ToggleSidebarTab.${tab.id}` ); return keybinding ? ` (${keybinding.combo.toString()})` : ""; }, "getTabTooltipSuffix"); return (_ctx, _cache) => { return openBlock(), createElementBlock(Fragment, null, [ (openBlock(), createBlock(Teleport, { to: teleportTarget.value }, [ createBaseVNode("nav", { class: normalizeClass("side-tool-bar-container" + (isSmall.value ? " small-sidebar" : "")) }, [ (openBlock(true), createElementBlock(Fragment, null, renderList(tabs.value, (tab) => { return openBlock(), createBlock(SidebarIcon, { key: tab.id, icon: tab.icon, iconBadge: tab.iconBadge, tooltip: tab.tooltip + getTabTooltipSuffix(tab), selected: tab.id === selectedTab.value?.id, class: normalizeClass(tab.id + "-tab-button"), onClick: /* @__PURE__ */ __name(($event) => onTabClick(tab), "onClick") }, null, 8, ["icon", "iconBadge", "tooltip", "selected", "class", "onClick"]); }), 128)), createBaseVNode("div", _hoisted_1$g, [ createVNode(_sfc_main$k), createVNode(_sfc_main$j) ]) ], 2) ], 8, ["to"])), selectedTab.value ? (openBlock(), createElementBlock("div", _hoisted_2$d, [ selectedTab.value.type === "vue" ? (openBlock(), createBlock(resolveDynamicComponent(selectedTab.value.component), { key: 0 })) : (openBlock(), createElementBlock("div", { key: 1, ref: /* @__PURE__ */ __name((el) => { if (el) mountCustomTab( selectedTab.value, el ); }, "ref") }, null, 512)) ])) : createCommentVNode("", true) ], 64); }; } }); const SideToolbar = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-b6bfc188"]]); var theme$7 = /* @__PURE__ */ __name(function theme2(_ref) { var dt = _ref.dt; return "\n.p-splitter {\n display: flex;\n flex-wrap: nowrap;\n border: 1px solid ".concat(dt("splitter.border.color"), ";\n background: ").concat(dt("splitter.background"), ";\n border-radius: ").concat(dt("border.radius.md"), ";\n color: ").concat(dt("splitter.color"), ";\n}\n\n.p-splitter-vertical {\n flex-direction: column;\n}\n\n.p-splitter-gutter {\n flex-grow: 0;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1;\n background: ").concat(dt("splitter.gutter.background"), ";\n}\n\n.p-splitter-gutter-handle {\n border-radius: ").concat(dt("splitter.handle.border.radius"), ";\n background: ").concat(dt("splitter.handle.background"), ";\n transition: outline-color ").concat(dt("splitter.transition.duration"), ", box-shadow ").concat(dt("splitter.transition.duration"), ";\n outline-color: transparent;\n}\n\n.p-splitter-gutter-handle:focus-visible {\n box-shadow: ").concat(dt("splitter.handle.focus.ring.shadow"), ";\n outline: ").concat(dt("splitter.handle.focus.ring.width"), " ").concat(dt("splitter.handle.focus.ring.style"), " ").concat(dt("splitter.handle.focus.ring.color"), ";\n outline-offset: ").concat(dt("splitter.handle.focus.ring.offset"), ";\n}\n\n.p-splitter-horizontal.p-splitter-resizing {\n cursor: col-resize;\n user-select: none;\n}\n\n.p-splitter-vertical.p-splitter-resizing {\n cursor: row-resize;\n user-select: none;\n}\n\n.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {\n height: ").concat(dt("splitter.handle.size"), ";\n width: 100%;\n}\n\n.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {\n width: ").concat(dt("splitter.handle.size"), ";\n height: 100%;\n}\n\n.p-splitter-horizontal > .p-splitter-gutter {\n cursor: col-resize;\n}\n\n.p-splitter-vertical > .p-splitter-gutter {\n cursor: row-resize;\n}\n\n.p-splitterpanel {\n flex-grow: 1;\n overflow: hidden;\n}\n\n.p-splitterpanel-nested {\n display: flex;\n}\n\n.p-splitterpanel .p-splitter {\n flex-grow: 1;\n border: 0 none;\n}\n"); }, "theme"); var classes$8 = { root: /* @__PURE__ */ __name(function root(_ref2) { var props = _ref2.props; return ["p-splitter p-component", "p-splitter-" + props.layout]; }, "root"), gutter: "p-splitter-gutter", gutterHandle: "p-splitter-gutter-handle" }; var inlineStyles$4 = { root: /* @__PURE__ */ __name(function root2(_ref3) { var props = _ref3.props; return [{ display: "flex", "flex-wrap": "nowrap" }, props.layout === "vertical" ? { "flex-direction": "column" } : ""]; }, "root") }; var SplitterStyle = BaseStyle.extend({ name: "splitter", theme: theme$7, classes: classes$8, inlineStyles: inlineStyles$4 }); var script$1$8 = { name: "BaseSplitter", "extends": script$e, props: { layout: { type: String, "default": "horizontal" }, gutterSize: { type: Number, "default": 4 }, stateKey: { type: String, "default": null }, stateStorage: { type: String, "default": "session" }, step: { type: Number, "default": 5 } }, style: SplitterStyle, provide: /* @__PURE__ */ __name(function provide3() { return { $pcSplitter: this, $parentInstance: this }; }, "provide") }; function _toConsumableArray$2(r) { return _arrayWithoutHoles$2(r) || _iterableToArray$2(r) || _unsupportedIterableToArray$2(r) || _nonIterableSpread$2(); } __name(_toConsumableArray$2, "_toConsumableArray$2"); function _nonIterableSpread$2() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } __name(_nonIterableSpread$2, "_nonIterableSpread$2"); function _unsupportedIterableToArray$2(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$2(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$2(r, a) : void 0; } } __name(_unsupportedIterableToArray$2, "_unsupportedIterableToArray$2"); function _iterableToArray$2(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); } __name(_iterableToArray$2, "_iterableToArray$2"); function _arrayWithoutHoles$2(r) { if (Array.isArray(r)) return _arrayLikeToArray$2(r); } __name(_arrayWithoutHoles$2, "_arrayWithoutHoles$2"); function _arrayLikeToArray$2(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } __name(_arrayLikeToArray$2, "_arrayLikeToArray$2"); var script$a = { name: "Splitter", "extends": script$1$8, inheritAttrs: false, emits: ["resizestart", "resizeend", "resize"], dragging: false, mouseMoveListener: null, mouseUpListener: null, touchMoveListener: null, touchEndListener: null, size: null, gutterElement: null, startPos: null, prevPanelElement: null, nextPanelElement: null, nextPanelSize: null, prevPanelSize: null, panelSizes: null, prevPanelIndex: null, timer: null, data: /* @__PURE__ */ __name(function data() { return { prevSize: null }; }, "data"), mounted: /* @__PURE__ */ __name(function mounted() { var _this = this; if (this.panels && this.panels.length) { var initialized = false; if (this.isStateful()) { initialized = this.restoreState(); } if (!initialized) { var children = _toConsumableArray$2(this.$el.children).filter(function(child) { return child.getAttribute("data-pc-name") === "splitterpanel"; }); var _panelSizes = []; this.panels.map(function(panel, i) { var panelInitialSize = panel.props && panel.props.size ? panel.props.size : null; var panelSize = panelInitialSize || 100 / _this.panels.length; _panelSizes[i] = panelSize; children[i].style.flexBasis = "calc(" + panelSize + "% - " + (_this.panels.length - 1) * _this.gutterSize + "px)"; }); this.panelSizes = _panelSizes; this.prevSize = parseFloat(_panelSizes[0]).toFixed(4); } } }, "mounted"), beforeUnmount: /* @__PURE__ */ __name(function beforeUnmount() { this.clear(); this.unbindMouseListeners(); }, "beforeUnmount"), methods: { isSplitterPanel: /* @__PURE__ */ __name(function isSplitterPanel(child) { return child.type.name === "SplitterPanel"; }, "isSplitterPanel"), onResizeStart: /* @__PURE__ */ __name(function onResizeStart(event, index, isKeyDown) { this.gutterElement = event.currentTarget || event.target.parentElement; this.size = this.horizontal ? getWidth(this.$el) : getHeight(this.$el); if (!isKeyDown) { this.dragging = true; this.startPos = this.layout === "horizontal" ? event.pageX || event.changedTouches[0].pageX : event.pageY || event.changedTouches[0].pageY; } this.prevPanelElement = this.gutterElement.previousElementSibling; this.nextPanelElement = this.gutterElement.nextElementSibling; if (isKeyDown) { this.prevPanelSize = this.horizontal ? getOuterWidth(this.prevPanelElement, true) : getOuterHeight(this.prevPanelElement, true); this.nextPanelSize = this.horizontal ? getOuterWidth(this.nextPanelElement, true) : getOuterHeight(this.nextPanelElement, true); } else { this.prevPanelSize = 100 * (this.horizontal ? getOuterWidth(this.prevPanelElement, true) : getOuterHeight(this.prevPanelElement, true)) / this.size; this.nextPanelSize = 100 * (this.horizontal ? getOuterWidth(this.nextPanelElement, true) : getOuterHeight(this.nextPanelElement, true)) / this.size; } this.prevPanelIndex = index; this.$emit("resizestart", { originalEvent: event, sizes: this.panelSizes }); this.$refs.gutter[index].setAttribute("data-p-gutter-resizing", true); this.$el.setAttribute("data-p-resizing", true); }, "onResizeStart"), onResize: /* @__PURE__ */ __name(function onResize(event, step, isKeyDown) { var newPos, newPrevPanelSize, newNextPanelSize; if (isKeyDown) { if (this.horizontal) { newPrevPanelSize = 100 * (this.prevPanelSize + step) / this.size; newNextPanelSize = 100 * (this.nextPanelSize - step) / this.size; } else { newPrevPanelSize = 100 * (this.prevPanelSize - step) / this.size; newNextPanelSize = 100 * (this.nextPanelSize + step) / this.size; } } else { if (this.horizontal) newPos = event.pageX * 100 / this.size - this.startPos * 100 / this.size; else newPos = event.pageY * 100 / this.size - this.startPos * 100 / this.size; newPrevPanelSize = this.prevPanelSize + newPos; newNextPanelSize = this.nextPanelSize - newPos; } if (this.validateResize(newPrevPanelSize, newNextPanelSize)) { this.prevPanelElement.style.flexBasis = "calc(" + newPrevPanelSize + "% - " + (this.panels.length - 1) * this.gutterSize + "px)"; this.nextPanelElement.style.flexBasis = "calc(" + newNextPanelSize + "% - " + (this.panels.length - 1) * this.gutterSize + "px)"; this.panelSizes[this.prevPanelIndex] = newPrevPanelSize; this.panelSizes[this.prevPanelIndex + 1] = newNextPanelSize; this.prevSize = parseFloat(newPrevPanelSize).toFixed(4); } this.$emit("resize", { originalEvent: event, sizes: this.panelSizes }); }, "onResize"), onResizeEnd: /* @__PURE__ */ __name(function onResizeEnd(event) { if (this.isStateful()) { this.saveState(); } this.$emit("resizeend", { originalEvent: event, sizes: this.panelSizes }); this.$refs.gutter.forEach(function(gutter) { return gutter.setAttribute("data-p-gutter-resizing", false); }); this.$el.setAttribute("data-p-resizing", false); this.clear(); }, "onResizeEnd"), repeat: /* @__PURE__ */ __name(function repeat(event, index, step) { this.onResizeStart(event, index, true); this.onResize(event, step, true); }, "repeat"), setTimer: /* @__PURE__ */ __name(function setTimer(event, index, step) { var _this2 = this; if (!this.timer) { this.timer = setInterval(function() { _this2.repeat(event, index, step); }, 40); } }, "setTimer"), clearTimer: /* @__PURE__ */ __name(function clearTimer() { if (this.timer) { clearInterval(this.timer); this.timer = null; } }, "clearTimer"), onGutterKeyUp: /* @__PURE__ */ __name(function onGutterKeyUp() { this.clearTimer(); this.onResizeEnd(); }, "onGutterKeyUp"), onGutterKeyDown: /* @__PURE__ */ __name(function onGutterKeyDown(event, index) { switch (event.code) { case "ArrowLeft": { if (this.layout === "horizontal") { this.setTimer(event, index, this.step * -1); } event.preventDefault(); break; } case "ArrowRight": { if (this.layout === "horizontal") { this.setTimer(event, index, this.step); } event.preventDefault(); break; } case "ArrowDown": { if (this.layout === "vertical") { this.setTimer(event, index, this.step * -1); } event.preventDefault(); break; } case "ArrowUp": { if (this.layout === "vertical") { this.setTimer(event, index, this.step); } event.preventDefault(); break; } } }, "onGutterKeyDown"), onGutterMouseDown: /* @__PURE__ */ __name(function onGutterMouseDown(event, index) { this.onResizeStart(event, index); this.bindMouseListeners(); }, "onGutterMouseDown"), onGutterTouchStart: /* @__PURE__ */ __name(function onGutterTouchStart(event, index) { this.onResizeStart(event, index); this.bindTouchListeners(); event.preventDefault(); }, "onGutterTouchStart"), onGutterTouchMove: /* @__PURE__ */ __name(function onGutterTouchMove(event) { this.onResize(event); event.preventDefault(); }, "onGutterTouchMove"), onGutterTouchEnd: /* @__PURE__ */ __name(function onGutterTouchEnd(event) { this.onResizeEnd(event); this.unbindTouchListeners(); event.preventDefault(); }, "onGutterTouchEnd"), bindMouseListeners: /* @__PURE__ */ __name(function bindMouseListeners() { var _this3 = this; if (!this.mouseMoveListener) { this.mouseMoveListener = function(event) { return _this3.onResize(event); }; document.addEventListener("mousemove", this.mouseMoveListener); } if (!this.mouseUpListener) { this.mouseUpListener = function(event) { _this3.onResizeEnd(event); _this3.unbindMouseListeners(); }; document.addEventListener("mouseup", this.mouseUpListener); } }, "bindMouseListeners"), bindTouchListeners: /* @__PURE__ */ __name(function bindTouchListeners() { var _this4 = this; if (!this.touchMoveListener) { this.touchMoveListener = function(event) { return _this4.onResize(event.changedTouches[0]); }; document.addEventListener("touchmove", this.touchMoveListener); } if (!this.touchEndListener) { this.touchEndListener = function(event) { _this4.resizeEnd(event); _this4.unbindTouchListeners(); }; document.addEventListener("touchend", this.touchEndListener); } }, "bindTouchListeners"), validateResize: /* @__PURE__ */ __name(function validateResize(newPrevPanelSize, newNextPanelSize) { if (newPrevPanelSize > 100 || newPrevPanelSize < 0) return false; if (newNextPanelSize > 100 || newNextPanelSize < 0) return false; var prevPanelMinSize = getVNodeProp(this.panels[this.prevPanelIndex], "minSize"); if (this.panels[this.prevPanelIndex].props && prevPanelMinSize && prevPanelMinSize > newPrevPanelSize) { return false; } var newPanelMinSize = getVNodeProp(this.panels[this.prevPanelIndex + 1], "minSize"); if (this.panels[this.prevPanelIndex + 1].props && newPanelMinSize && newPanelMinSize > newNextPanelSize) { return false; } return true; }, "validateResize"), unbindMouseListeners: /* @__PURE__ */ __name(function unbindMouseListeners() { if (this.mouseMoveListener) { document.removeEventListener("mousemove", this.mouseMoveListener); this.mouseMoveListener = null; } if (this.mouseUpListener) { document.removeEventListener("mouseup", this.mouseUpListener); this.mouseUpListener = null; } }, "unbindMouseListeners"), unbindTouchListeners: /* @__PURE__ */ __name(function unbindTouchListeners() { if (this.touchMoveListener) { document.removeEventListener("touchmove", this.touchMoveListener); this.touchMoveListener = null; } if (this.touchEndListener) { document.removeEventListener("touchend", this.touchEndListener); this.touchEndListener = null; } }, "unbindTouchListeners"), clear: /* @__PURE__ */ __name(function clear() { this.dragging = false; this.size = null; this.startPos = null; this.prevPanelElement = null; this.nextPanelElement = null; this.prevPanelSize = null; this.nextPanelSize = null; this.gutterElement = null; this.prevPanelIndex = null; }, "clear"), isStateful: /* @__PURE__ */ __name(function isStateful() { return this.stateKey != null; }, "isStateful"), getStorage: /* @__PURE__ */ __name(function getStorage() { switch (this.stateStorage) { case "local": return window.localStorage; case "session": return window.sessionStorage; default: throw new Error(this.stateStorage + ' is not a valid value for the state storage, supported values are "local" and "session".'); } }, "getStorage"), saveState: /* @__PURE__ */ __name(function saveState() { if (isArray(this.panelSizes)) { this.getStorage().setItem(this.stateKey, JSON.stringify(this.panelSizes)); } }, "saveState"), restoreState: /* @__PURE__ */ __name(function restoreState() { var _this5 = this; var storage = this.getStorage(); var stateString = storage.getItem(this.stateKey); if (stateString) { this.panelSizes = JSON.parse(stateString); var children = _toConsumableArray$2(this.$el.children).filter(function(child) { return child.getAttribute("data-pc-name") === "splitterpanel"; }); children.forEach(function(child, i) { child.style.flexBasis = "calc(" + _this5.panelSizes[i] + "% - " + (_this5.panels.length - 1) * _this5.gutterSize + "px)"; }); return true; } return false; }, "restoreState") }, computed: { panels: /* @__PURE__ */ __name(function panels() { var _this6 = this; var panels2 = []; this.$slots["default"]().forEach(function(child) { if (_this6.isSplitterPanel(child)) { panels2.push(child); } else if (child.children instanceof Array) { child.children.forEach(function(nestedChild) { if (_this6.isSplitterPanel(nestedChild)) { panels2.push(nestedChild); } }); } }); return panels2; }, "panels"), gutterStyle: /* @__PURE__ */ __name(function gutterStyle() { if (this.horizontal) return { width: this.gutterSize + "px" }; else return { height: this.gutterSize + "px" }; }, "gutterStyle"), horizontal: /* @__PURE__ */ __name(function horizontal() { return this.layout === "horizontal"; }, "horizontal"), getPTOptions: /* @__PURE__ */ __name(function getPTOptions() { var _this$$parentInstance; return { context: { nested: (_this$$parentInstance = this.$parentInstance) === null || _this$$parentInstance === void 0 ? void 0 : _this$$parentInstance.nestedState } }; }, "getPTOptions") } }; var _hoisted_1$f = ["onMousedown", "onTouchstart", "onTouchmove", "onTouchend"]; var _hoisted_2$c = ["aria-orientation", "aria-valuenow", "onKeydown"]; function render$c(_ctx, _cache, $props, $setup, $data, $options) { return openBlock(), createElementBlock("div", mergeProps({ "class": _ctx.cx("root"), style: _ctx.sx("root"), "data-p-resizing": false }, _ctx.ptmi("root", $options.getPTOptions)), [(openBlock(true), createElementBlock(Fragment, null, renderList($options.panels, function(panel, i) { return openBlock(), createElementBlock(Fragment, { key: i }, [(openBlock(), createBlock(resolveDynamicComponent(panel), { tabindex: "-1" })), i !== $options.panels.length - 1 ? (openBlock(), createElementBlock("div", mergeProps({ key: 0, ref_for: true, ref: "gutter", "class": _ctx.cx("gutter"), role: "separator", tabindex: "-1", onMousedown: /* @__PURE__ */ __name(function onMousedown($event) { return $options.onGutterMouseDown($event, i); }, "onMousedown"), onTouchstart: /* @__PURE__ */ __name(function onTouchstart($event) { return $options.onGutterTouchStart($event, i); }, "onTouchstart"), onTouchmove: /* @__PURE__ */ __name(function onTouchmove($event) { return $options.onGutterTouchMove($event, i); }, "onTouchmove"), onTouchend: /* @__PURE__ */ __name(function onTouchend($event) { return $options.onGutterTouchEnd($event, i); }, "onTouchend"), "data-p-gutter-resizing": false }, _ctx.ptm("gutter")), [createBaseVNode("div", mergeProps({ "class": _ctx.cx("gutterHandle"), tabindex: "0", style: [$options.gutterStyle], "aria-orientation": _ctx.layout, "aria-valuenow": $data.prevSize, onKeyup: _cache[0] || (_cache[0] = function() { return $options.onGutterKeyUp && $options.onGutterKeyUp.apply($options, arguments); }), onKeydown: /* @__PURE__ */ __name(function onKeydown($event) { return $options.onGutterKeyDown($event, i); }, "onKeydown"), ref_for: true }, _ctx.ptm("gutterHandle")), null, 16, _hoisted_2$c)], 16, _hoisted_1$f)) : createCommentVNode("", true)], 64); }), 128))], 16); } __name(render$c, "render$c"); script$a.render = render$c; var classes$7 = { root: /* @__PURE__ */ __name(function root3(_ref) { var instance = _ref.instance; return ["p-splitterpanel", { "p-splitterpanel-nested": instance.isNested }]; }, "root") }; var SplitterPanelStyle = BaseStyle.extend({ name: "splitterpanel", classes: classes$7 }); var script$1$7 = { name: "BaseSplitterPanel", "extends": script$e, props: { size: { type: Number, "default": null }, minSize: { type: Number, "default": null } }, style: SplitterPanelStyle, provide: /* @__PURE__ */ __name(function provide4() { return { $pcSplitterPanel: this, $parentInstance: this }; }, "provide") }; var script$9 = { name: "SplitterPanel", "extends": script$1$7, inheritAttrs: false, data: /* @__PURE__ */ __name(function data2() { return { nestedState: null }; }, "data"), computed: { isNested: /* @__PURE__ */ __name(function isNested() { var _this = this; return this.$slots["default"]().some(function(child) { _this.nestedState = child.type.name === "Splitter" ? true : null; return _this.nestedState; }); }, "isNested"), getPTOptions: /* @__PURE__ */ __name(function getPTOptions2() { return { context: { nested: this.isNested } }; }, "getPTOptions") } }; function render$b(_ctx, _cache, $props, $setup, $data, $options) { return openBlock(), createElementBlock("div", mergeProps({ ref: "container", "class": _ctx.cx("root") }, _ctx.ptmi("root", $options.getPTOptions)), [renderSlot(_ctx.$slots, "default")], 16); } __name(render$b, "render$b"); script$9.render = render$b; const _sfc_main$h = /* @__PURE__ */ defineComponent({ __name: "LiteGraphCanvasSplitterOverlay", setup(__props) { const settingStore = useSettingStore(); const sidebarLocation = computed( () => settingStore.get("Comfy.Sidebar.Location") ); const sidebarPanelVisible = computed( () => useWorkspaceStore().sidebarTab.activeSidebarTab !== null ); const gutterClass = computed(() => { return sidebarPanelVisible.value ? "" : "gutter-hidden"; }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(script$a), { class: "splitter-overlay", "pt:gutter": gutterClass.value }, { default: withCtx(() => [ sidebarLocation.value === "left" ? withDirectives((openBlock(), createBlock(unref(script$9), { key: 0, class: "side-bar-panel", minSize: 10, size: 20 }, { default: withCtx(() => [ renderSlot(_ctx.$slots, "side-bar-panel", {}, void 0, true) ]), _: 3 }, 512)), [ [vShow, sidebarPanelVisible.value] ]) : createCommentVNode("", true), createVNode(unref(script$9), { class: "graph-canvas-panel relative", size: 100 }, { default: withCtx(() => [ renderSlot(_ctx.$slots, "graph-canvas-panel", {}, void 0, true) ]), _: 3 }), sidebarLocation.value === "right" ? withDirectives((openBlock(), createBlock(unref(script$9), { key: 1, class: "side-bar-panel", minSize: 10, size: 20 }, { default: withCtx(() => [ renderSlot(_ctx.$slots, "side-bar-panel", {}, void 0, true) ]), _: 3 }, 512)), [ [vShow, sidebarPanelVisible.value] ]) : createCommentVNode("", true) ]), _: 3 }, 8, ["pt:gutter"]); }; } }); const LiteGraphCanvasSplitterOverlay = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-b9df3042"]]); var theme$6 = /* @__PURE__ */ __name(function theme3(_ref) { var dt = _ref.dt; return "\n.p-autocomplete {\n display: inline-flex;\n}\n\n.p-autocomplete-loader {\n position: absolute;\n top: 50%;\n margin-top: -0.5rem;\n right: ".concat(dt("autocomplete.padding.x"), ";\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-loader {\n right: calc(").concat(dt("autocomplete.dropdown.width"), " + ").concat(dt("autocomplete.padding.x"), ");\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n flex: 1 1 auto;\n width: 1%;\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input,\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input-multiple {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.p-autocomplete-dropdown {\n cursor: pointer;\n display: inline-flex;\n cursor: pointer;\n user-select: none;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n position: relative;\n width: ").concat(dt("autocomplete.dropdown.width"), ";\n border-top-right-radius: ").concat(dt("autocomplete.dropdown.border.radius"), ";\n border-bottom-right-radius: ").concat(dt("autocomplete.dropdown.border.radius"), ";\n background: ").concat(dt("autocomplete.dropdown.background"), ";\n border: 1px solid ").concat(dt("autocomplete.dropdown.border.color"), ";\n border-left: 0 none;\n color: ").concat(dt("autocomplete.dropdown.color"), ";\n transition: background ").concat(dt("autocomplete.transition.duration"), ", color ").concat(dt("autocomplete.transition.duration"), ", border-color ").concat(dt("autocomplete.transition.duration"), ", outline-color ").concat(dt("autocomplete.transition.duration"), ", box-shadow ").concat(dt("autocomplete.transition.duration"), ";\n outline-color: transparent;\n}\n\n.p-autocomplete-dropdown:not(:disabled):hover {\n background: ").concat(dt("autocomplete.dropdown.hover.background"), ";\n border-color: ").concat(dt("autocomplete.dropdown.hover.border.color"), ";\n color: ").concat(dt("autocomplete.dropdown.hover.color"), ";\n}\n\n.p-autocomplete-dropdown:not(:disabled):active {\n background: ").concat(dt("autocomplete.dropdown.active.background"), ";\n border-color: ").concat(dt("autocomplete.dropdown.active.border.color"), ";\n color: ").concat(dt("autocomplete.dropdown.active.color"), ";\n}\n\n.p-autocomplete-dropdown:focus-visible {\n box-shadow: ").concat(dt("autocomplete.dropdown.focus.ring.shadow"), ";\n outline: ").concat(dt("autocomplete.dropdown.focus.ring.width"), " ").concat(dt("autocomplete.dropdown.focus.ring.style"), " ").concat(dt("autocomplete.dropdown.focus.ring.color"), ";\n outline-offset: ").concat(dt("autocomplete.dropdown.focus.ring.offset"), ";\n}\n\n.p-autocomplete .p-autocomplete-overlay {\n min-width: 100%;\n}\n\n.p-autocomplete-overlay {\n position: absolute;\n overflow: auto;\n top: 0;\n left: 0;\n background: ").concat(dt("autocomplete.overlay.background"), ";\n color: ").concat(dt("autocomplete.overlay.color"), ";\n border: 1px solid ").concat(dt("autocomplete.overlay.border.color"), ";\n border-radius: ").concat(dt("autocomplete.overlay.border.radius"), ";\n box-shadow: ").concat(dt("autocomplete.overlay.shadow"), ";\n}\n\n.p-autocomplete-list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n display: flex;\n flex-direction: column;\n gap: ").concat(dt("autocomplete.list.gap"), ";\n padding: ").concat(dt("autocomplete.list.padding"), ";\n}\n\n.p-autocomplete-option {\n cursor: pointer;\n white-space: nowrap;\n position: relative;\n overflow: hidden;\n display: flex;\n align-items: center;\n padding: ").concat(dt("autocomplete.option.padding"), ";\n border: 0 none;\n color: ").concat(dt("autocomplete.option.color"), ";\n background: transparent;\n transition: background ").concat(dt("autocomplete.transition.duration"), ", color ").concat(dt("autocomplete.transition.duration"), ", border-color ").concat(dt("autocomplete.transition.duration"), ";\n border-radius: ").concat(dt("autocomplete.option.border.radius"), ";\n}\n\n.p-autocomplete-option:not(.p-autocomplete-option-selected):not(.p-disabled).p-focus {\n background: ").concat(dt("autocomplete.option.focus.background"), ";\n color: ").concat(dt("autocomplete.option.focus.color"), ";\n}\n\n.p-autocomplete-option-selected {\n background: ").concat(dt("autocomplete.option.selected.background"), ";\n color: ").concat(dt("autocomplete.option.selected.color"), ";\n}\n\n.p-autocomplete-option-selected.p-focus {\n background: ").concat(dt("autocomplete.option.selected.focus.background"), ";\n color: ").concat(dt("autocomplete.option.selected.focus.color"), ";\n}\n\n.p-autocomplete-option-group {\n margin: 0;\n padding: ").concat(dt("autocomplete.option.group.padding"), ";\n color: ").concat(dt("autocomplete.option.group.color"), ";\n background: ").concat(dt("autocomplete.option.group.background"), ";\n font-weight: ").concat(dt("autocomplete.option.group.font.weight"), ";\n}\n\n.p-autocomplete-input-multiple {\n margin: 0;\n list-style-type: none;\n cursor: text;\n overflow: hidden;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n padding: calc(").concat(dt("autocomplete.padding.y"), " / 2) ").concat(dt("autocomplete.padding.x"), ";\n gap: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n color: ").concat(dt("autocomplete.color"), ";\n background: ").concat(dt("autocomplete.background"), ";\n border: 1px solid ").concat(dt("autocomplete.border.color"), ";\n border-radius: ").concat(dt("autocomplete.border.radius"), ";\n width: 100%;\n transition: background ").concat(dt("autocomplete.transition.duration"), ", color ").concat(dt("autocomplete.transition.duration"), ", border-color ").concat(dt("autocomplete.transition.duration"), ", outline-color ").concat(dt("autocomplete.transition.duration"), ", box-shadow ").concat(dt("autocomplete.transition.duration"), ";\n outline-color: transparent;\n box-shadow: ").concat(dt("autocomplete.shadow"), ";\n}\n\n.p-autocomplete:not(.p-disabled):hover .p-autocomplete-input-multiple {\n border-color: ").concat(dt("autocomplete.hover.border.color"), ";\n}\n\n.p-autocomplete:not(.p-disabled).p-focus .p-autocomplete-input-multiple {\n border-color: ").concat(dt("autocomplete.focus.border.color"), ";\n box-shadow: ").concat(dt("autocomplete.focus.ring.shadow"), ";\n outline: ").concat(dt("autocomplete.focus.ring.width"), " ").concat(dt("autocomplete.focus.ring.style"), " ").concat(dt("autocomplete.focus.ring.color"), ";\n outline-offset: ").concat(dt("autocomplete.focus.ring.offset"), ";\n}\n\n.p-autocomplete.p-invalid .p-autocomplete-input-multiple {\n border-color: ").concat(dt("autocomplete.invalid.border.color"), ";\n}\n\n.p-variant-filled.p-autocomplete-input-multiple {\n background: ").concat(dt("autocomplete.filled.background"), ";\n}\n\n.p-autocomplete:not(.p-disabled).p-focus .p-variant-filled.p-autocomplete-input-multiple {\n background: ").concat(dt("autocomplete.filled.focus.background"), ";\n}\n\n.p-autocomplete.p-disabled .p-autocomplete-input-multiple {\n opacity: 1;\n background: ").concat(dt("autocomplete.disabled.background"), ";\n color: ").concat(dt("autocomplete.disabled.color"), ";\n}\n\n.p-autocomplete-chip.p-chip {\n padding-top: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n padding-bottom: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n border-radius: ").concat(dt("autocomplete.chip.border.radius"), ";\n}\n\n.p-autocomplete-input-multiple:has(.p-autocomplete-chip) {\n padding-left: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n padding-right: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n}\n\n.p-autocomplete-chip-item.p-focus .p-autocomplete-chip {\n background: ").concat(dt("inputchips.chip.focus.background"), ";\n color: ").concat(dt("inputchips.chip.focus.color"), ";\n}\n\n.p-autocomplete-input-chip {\n flex: 1 1 auto;\n display: inline-flex;\n padding-top: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n padding-bottom: calc(").concat(dt("autocomplete.padding.y"), " / 2);\n}\n\n.p-autocomplete-input-chip input {\n border: 0 none;\n outline: 0 none;\n background: transparent;\n margin: 0;\n padding: 0;\n box-shadow: none;\n border-radius: 0;\n width: 100%;\n font-family: inherit;\n font-feature-settings: inherit;\n font-size: 1rem;\n color: inherit;\n}\n\n.p-autocomplete-input-chip input::placeholder {\n color: ").concat(dt("autocomplete.placeholder.color"), ";\n}\n\n.p-autocomplete-empty-message {\n padding: ").concat(dt("autocomplete.empty.message.padding"), ";\n}\n\n.p-autocomplete-fluid {\n display: flex;\n}\n\n.p-autocomplete-fluid:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n width: 1%;\n}\n"); }, "theme"); var inlineStyles$3 = { root: { position: "relative" } }; var classes$6 = { root: /* @__PURE__ */ __name(function root4(_ref2) { var instance = _ref2.instance, props = _ref2.props; return ["p-autocomplete p-component p-inputwrapper", { "p-disabled": props.disabled, "p-invalid": props.invalid, "p-focus": instance.focused, "p-inputwrapper-filled": props.modelValue || isNotEmpty(instance.inputValue), "p-inputwrapper-focus": instance.focused, "p-autocomplete-open": instance.overlayVisible, "p-autocomplete-fluid": instance.hasFluid }]; }, "root"), pcInput: "p-autocomplete-input", inputMultiple: /* @__PURE__ */ __name(function inputMultiple(_ref3) { var props = _ref3.props, instance = _ref3.instance; return ["p-autocomplete-input-multiple", { "p-variant-filled": props.variant ? props.variant === "filled" : instance.$primevue.config.inputStyle === "filled" || instance.$primevue.config.inputVariant === "filled" }]; }, "inputMultiple"), chipItem: /* @__PURE__ */ __name(function chipItem(_ref4) { var instance = _ref4.instance, i = _ref4.i; return ["p-autocomplete-chip-item", { "p-focus": instance.focusedMultipleOptionIndex === i }]; }, "chipItem"), pcChip: "p-autocomplete-chip", chipIcon: "p-autocomplete-chip-icon", inputChip: "p-autocomplete-input-chip", loader: "p-autocomplete-loader", dropdown: "p-autocomplete-dropdown", overlay: "p-autocomplete-overlay p-component", list: "p-autocomplete-list", optionGroup: "p-autocomplete-option-group", option: /* @__PURE__ */ __name(function option(_ref5) { var instance = _ref5.instance, _option = _ref5.option, i = _ref5.i, getItemOptions = _ref5.getItemOptions; return ["p-autocomplete-option", { "p-autocomplete-option-selected": instance.isSelected(_option), "p-focus": instance.focusedOptionIndex === instance.getOptionIndex(i, getItemOptions), "p-disabled": instance.isOptionDisabled(_option) }]; }, "option"), emptyMessage: "p-autocomplete-empty-message" }; var AutoCompleteStyle = BaseStyle.extend({ name: "autocomplete", theme: theme$6, classes: classes$6, inlineStyles: inlineStyles$3 }); var script$1$6 = { name: "BaseAutoComplete", "extends": script$e, props: { modelValue: null, suggestions: { type: Array, "default": null }, optionLabel: null, optionDisabled: null, optionGroupLabel: null, optionGroupChildren: null, scrollHeight: { type: String, "default": "14rem" }, dropdown: { type: Boolean, "default": false }, dropdownMode: { type: String, "default": "blank" }, multiple: { type: Boolean, "default": false }, loading: { type: Boolean, "default": false }, variant: { type: String, "default": null }, invalid: { type: Boolean, "default": false }, disabled: { type: Boolean, "default": false }, placeholder: { type: String, "default": null }, dataKey: { type: String, "default": null }, minLength: { type: Number, "default": 1 }, delay: { type: Number, "default": 300 }, appendTo: { type: [String, Object], "default": "body" }, forceSelection: { type: Boolean, "default": false }, completeOnFocus: { type: Boolean, "default": false }, inputId: { type: String, "default": null }, inputStyle: { type: Object, "default": null }, inputClass: { type: [String, Object], "default": null }, panelStyle: { type: Object, "default": null }, panelClass: { type: [String, Object], "default": null }, overlayStyle: { type: Object, "default": null }, overlayClass: { type: [String, Object], "default": null }, dropdownIcon: { type: String, "default": null }, dropdownClass: { type: [String, Object], "default": null }, loader: { type: String, "default": null }, loadingIcon: { type: String, "default": null }, removeTokenIcon: { type: String, "default": null }, chipIcon: { type: String, "default": null }, virtualScrollerOptions: { type: Object, "default": null }, autoOptionFocus: { type: Boolean, "default": false }, selectOnFocus: { type: Boolean, "default": false }, focusOnHover: { type: Boolean, "default": true }, searchLocale: { type: String, "default": void 0 }, searchMessage: { type: String, "default": null }, selectionMessage: { type: String, "default": null }, emptySelectionMessage: { type: String, "default": null }, emptySearchMessage: { type: String, "default": null }, tabindex: { type: Number, "default": 0 }, typeahead: { type: Boolean, "default": true }, ariaLabel: { type: String, "default": null }, ariaLabelledby: { type: String, "default": null }, fluid: { type: Boolean, "default": null } }, style: AutoCompleteStyle, provide: /* @__PURE__ */ __name(function provide5() { return { $pcAutoComplete: this, $parentInstance: this }; }, "provide") }; function _typeof$1$1(o) { "@babel/helpers - typeof"; return _typeof$1$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof$1$1(o); } __name(_typeof$1$1, "_typeof$1$1"); function _toConsumableArray$1(r) { return _arrayWithoutHoles$1(r) || _iterableToArray$1(r) || _unsupportedIterableToArray$1(r) || _nonIterableSpread$1(); } __name(_toConsumableArray$1, "_toConsumableArray$1"); function _nonIterableSpread$1() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } __name(_nonIterableSpread$1, "_nonIterableSpread$1"); function _unsupportedIterableToArray$1(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$1(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$1(r, a) : void 0; } } __name(_unsupportedIterableToArray$1, "_unsupportedIterableToArray$1"); function _iterableToArray$1(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); } __name(_iterableToArray$1, "_iterableToArray$1"); function _arrayWithoutHoles$1(r) { if (Array.isArray(r)) return _arrayLikeToArray$1(r); } __name(_arrayWithoutHoles$1, "_arrayWithoutHoles$1"); function _arrayLikeToArray$1(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } __name(_arrayLikeToArray$1, "_arrayLikeToArray$1"); var script$8 = { name: "AutoComplete", "extends": script$1$6, inheritAttrs: false, emits: ["update:modelValue", "change", "focus", "blur", "item-select", "item-unselect", "option-select", "option-unselect", "dropdown-click", "clear", "complete", "before-show", "before-hide", "show", "hide"], inject: { $pcFluid: { "default": null } }, outsideClickListener: null, resizeListener: null, scrollHandler: null, overlay: null, virtualScroller: null, searchTimeout: null, dirty: false, data: /* @__PURE__ */ __name(function data3() { return { id: this.$attrs.id, clicked: false, focused: false, focusedOptionIndex: -1, focusedMultipleOptionIndex: -1, overlayVisible: false, searching: false }; }, "data"), watch: { "$attrs.id": /* @__PURE__ */ __name(function $attrsId(newValue) { this.id = newValue || UniqueComponentId(); }, "$attrsId"), suggestions: /* @__PURE__ */ __name(function suggestions() { if (this.searching) { this.show(); this.focusedOptionIndex = this.overlayVisible && this.autoOptionFocus ? this.findFirstFocusedOptionIndex() : -1; this.searching = false; } this.autoUpdateModel(); }, "suggestions") }, mounted: /* @__PURE__ */ __name(function mounted2() { this.id = this.id || UniqueComponentId(); this.autoUpdateModel(); }, "mounted"), updated: /* @__PURE__ */ __name(function updated() { if (this.overlayVisible) { this.alignOverlay(); } }, "updated"), beforeUnmount: /* @__PURE__ */ __name(function beforeUnmount2() { this.unbindOutsideClickListener(); this.unbindResizeListener(); if (this.scrollHandler) { this.scrollHandler.destroy(); this.scrollHandler = null; } if (this.overlay) { ZIndex.clear(this.overlay); this.overlay = null; } }, "beforeUnmount"), methods: { getOptionIndex: /* @__PURE__ */ __name(function getOptionIndex(index, fn) { return this.virtualScrollerDisabled ? index : fn && fn(index)["index"]; }, "getOptionIndex"), getOptionLabel: /* @__PURE__ */ __name(function getOptionLabel(option2) { return this.optionLabel ? resolveFieldData(option2, this.optionLabel) : option2; }, "getOptionLabel"), getOptionValue: /* @__PURE__ */ __name(function getOptionValue(option2) { return option2; }, "getOptionValue"), getOptionRenderKey: /* @__PURE__ */ __name(function getOptionRenderKey(option2, index) { return (this.dataKey ? resolveFieldData(option2, this.dataKey) : this.getOptionLabel(option2)) + "_" + index; }, "getOptionRenderKey"), getPTOptions: /* @__PURE__ */ __name(function getPTOptions3(option2, itemOptions, index, key) { return this.ptm(key, { context: { selected: this.isSelected(option2), focused: this.focusedOptionIndex === this.getOptionIndex(index, itemOptions), disabled: this.isOptionDisabled(option2) } }); }, "getPTOptions"), isOptionDisabled: /* @__PURE__ */ __name(function isOptionDisabled(option2) { return this.optionDisabled ? resolveFieldData(option2, this.optionDisabled) : false; }, "isOptionDisabled"), isOptionGroup: /* @__PURE__ */ __name(function isOptionGroup(option2) { return this.optionGroupLabel && option2.optionGroup && option2.group; }, "isOptionGroup"), getOptionGroupLabel: /* @__PURE__ */ __name(function getOptionGroupLabel(optionGroup) { return resolveFieldData(optionGroup, this.optionGroupLabel); }, "getOptionGroupLabel"), getOptionGroupChildren: /* @__PURE__ */ __name(function getOptionGroupChildren(optionGroup) { return resolveFieldData(optionGroup, this.optionGroupChildren); }, "getOptionGroupChildren"), getAriaPosInset: /* @__PURE__ */ __name(function getAriaPosInset(index) { var _this = this; return (this.optionGroupLabel ? index - this.visibleOptions.slice(0, index).filter(function(option2) { return _this.isOptionGroup(option2); }).length : index) + 1; }, "getAriaPosInset"), show: /* @__PURE__ */ __name(function show(isFocus) { this.$emit("before-show"); this.dirty = true; this.overlayVisible = true; this.focusedOptionIndex = this.focusedOptionIndex !== -1 ? this.focusedOptionIndex : this.autoOptionFocus ? this.findFirstFocusedOptionIndex() : -1; isFocus && focus(this.multiple ? this.$refs.focusInput : this.$refs.focusInput.$el); }, "show"), hide: /* @__PURE__ */ __name(function hide(isFocus) { var _this2 = this; var _hide = /* @__PURE__ */ __name(function _hide2() { _this2.$emit("before-hide"); _this2.dirty = isFocus; _this2.overlayVisible = false; _this2.clicked = false; _this2.focusedOptionIndex = -1; isFocus && focus(_this2.multiple ? _this2.$refs.focusInput : _this2.$refs.focusInput.$el); }, "_hide"); setTimeout(function() { _hide(); }, 0); }, "hide"), onFocus: /* @__PURE__ */ __name(function onFocus(event) { if (this.disabled) { return; } if (!this.dirty && this.completeOnFocus) { this.search(event, event.target.value, "focus"); } this.dirty = true; this.focused = true; if (this.overlayVisible) { this.focusedOptionIndex = this.focusedOptionIndex !== -1 ? this.focusedOptionIndex : this.overlayVisible && this.autoOptionFocus ? this.findFirstFocusedOptionIndex() : -1; this.scrollInView(this.focusedOptionIndex); } this.$emit("focus", event); }, "onFocus"), onBlur: /* @__PURE__ */ __name(function onBlur(event) { this.dirty = false; this.focused = false; this.focusedOptionIndex = -1; this.$emit("blur", event); }, "onBlur"), onKeyDown: /* @__PURE__ */ __name(function onKeyDown(event) { if (this.disabled) { event.preventDefault(); return; } switch (event.code) { case "ArrowDown": this.onArrowDownKey(event); break; case "ArrowUp": this.onArrowUpKey(event); break; case "ArrowLeft": this.onArrowLeftKey(event); break; case "ArrowRight": this.onArrowRightKey(event); break; case "Home": this.onHomeKey(event); break; case "End": this.onEndKey(event); break; case "PageDown": this.onPageDownKey(event); break; case "PageUp": this.onPageUpKey(event); break; case "Enter": case "NumpadEnter": this.onEnterKey(event); break; case "Escape": this.onEscapeKey(event); break; case "Tab": this.onTabKey(event); break; case "Backspace": this.onBackspaceKey(event); break; } this.clicked = false; }, "onKeyDown"), onInput: /* @__PURE__ */ __name(function onInput(event) { var _this3 = this; if (this.typeahead) { if (this.searchTimeout) { clearTimeout(this.searchTimeout); } var query = event.target.value; if (!this.multiple) { this.updateModel(event, query); } if (query.length === 0) { this.hide(); this.$emit("clear"); } else { if (query.length >= this.minLength) { this.focusedOptionIndex = -1; this.searchTimeout = setTimeout(function() { _this3.search(event, query, "input"); }, this.delay); } else { this.hide(); } } } }, "onInput"), onChange: /* @__PURE__ */ __name(function onChange(event) { var _this4 = this; if (this.forceSelection) { var valid = false; if (this.visibleOptions && !this.multiple) { var value = this.multiple ? this.$refs.focusInput.value : this.$refs.focusInput.$el.value; var matchedValue = this.visibleOptions.find(function(option2) { return _this4.isOptionMatched(option2, value || ""); }); if (matchedValue !== void 0) { valid = true; !this.isSelected(matchedValue) && this.onOptionSelect(event, matchedValue); } } if (!valid) { if (this.multiple) this.$refs.focusInput.value = ""; else this.$refs.focusInput.$el.value = ""; this.$emit("clear"); !this.multiple && this.updateModel(event, null); } } }, "onChange"), onMultipleContainerFocus: /* @__PURE__ */ __name(function onMultipleContainerFocus() { if (this.disabled) { return; } this.focused = true; }, "onMultipleContainerFocus"), onMultipleContainerBlur: /* @__PURE__ */ __name(function onMultipleContainerBlur() { this.focusedMultipleOptionIndex = -1; this.focused = false; }, "onMultipleContainerBlur"), onMultipleContainerKeyDown: /* @__PURE__ */ __name(function onMultipleContainerKeyDown(event) { if (this.disabled) { event.preventDefault(); return; } switch (event.code) { case "ArrowLeft": this.onArrowLeftKeyOnMultiple(event); break; case "ArrowRight": this.onArrowRightKeyOnMultiple(event); break; case "Backspace": this.onBackspaceKeyOnMultiple(event); break; } }, "onMultipleContainerKeyDown"), onContainerClick: /* @__PURE__ */ __name(function onContainerClick(event) { this.clicked = true; if (this.disabled || this.searching || this.loading || this.isInputClicked(event) || this.isDropdownClicked(event)) { return; } if (!this.overlay || !this.overlay.contains(event.target)) { focus(this.multiple ? this.$refs.focusInput : this.$refs.focusInput.$el); } }, "onContainerClick"), onDropdownClick: /* @__PURE__ */ __name(function onDropdownClick(event) { var query = void 0; if (this.overlayVisible) { this.hide(true); } else { var target = this.multiple ? this.$refs.focusInput : this.$refs.focusInput.$el; focus(target); query = target.value; if (this.dropdownMode === "blank") this.search(event, "", "dropdown"); else if (this.dropdownMode === "current") this.search(event, query, "dropdown"); } this.$emit("dropdown-click", { originalEvent: event, query }); }, "onDropdownClick"), onOptionSelect: /* @__PURE__ */ __name(function onOptionSelect(event, option2) { var isHide = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : true; var value = this.getOptionValue(option2); if (this.multiple) { this.$refs.focusInput.value = ""; if (!this.isSelected(option2)) { this.updateModel(event, [].concat(_toConsumableArray$1(this.modelValue || []), [value])); } } else { this.updateModel(event, value); } this.$emit("item-select", { originalEvent: event, value: option2 }); this.$emit("option-select", { originalEvent: event, value: option2 }); isHide && this.hide(true); }, "onOptionSelect"), onOptionMouseMove: /* @__PURE__ */ __name(function onOptionMouseMove(event, index) { if (this.focusOnHover) { this.changeFocusedOptionIndex(event, index); } }, "onOptionMouseMove"), onOverlayClick: /* @__PURE__ */ __name(function onOverlayClick(event) { OverlayEventBus.emit("overlay-click", { originalEvent: event, target: this.$el }); }, "onOverlayClick"), onOverlayKeyDown: /* @__PURE__ */ __name(function onOverlayKeyDown(event) { switch (event.code) { case "Escape": this.onEscapeKey(event); break; } }, "onOverlayKeyDown"), onArrowDownKey: /* @__PURE__ */ __name(function onArrowDownKey(event) { if (!this.overlayVisible) { return; } var optionIndex = this.focusedOptionIndex !== -1 ? this.findNextOptionIndex(this.focusedOptionIndex) : this.clicked ? this.findFirstOptionIndex() : this.findFirstFocusedOptionIndex(); this.changeFocusedOptionIndex(event, optionIndex); event.preventDefault(); }, "onArrowDownKey"), onArrowUpKey: /* @__PURE__ */ __name(function onArrowUpKey(event) { if (!this.overlayVisible) { return; } if (event.altKey) { if (this.focusedOptionIndex !== -1) { this.onOptionSelect(event, this.visibleOptions[this.focusedOptionIndex]); } this.overlayVisible && this.hide(); event.preventDefault(); } else { var optionIndex = this.focusedOptionIndex !== -1 ? this.findPrevOptionIndex(this.focusedOptionIndex) : this.clicked ? this.findLastOptionIndex() : this.findLastFocusedOptionIndex(); this.changeFocusedOptionIndex(event, optionIndex); event.preventDefault(); } }, "onArrowUpKey"), onArrowLeftKey: /* @__PURE__ */ __name(function onArrowLeftKey(event) { var target = event.currentTarget; this.focusedOptionIndex = -1; if (this.multiple) { if (isEmpty(target.value) && this.hasSelectedOption) { focus(this.$refs.multiContainer); this.focusedMultipleOptionIndex = this.modelValue.length; } else { event.stopPropagation(); } } }, "onArrowLeftKey"), onArrowRightKey: /* @__PURE__ */ __name(function onArrowRightKey(event) { this.focusedOptionIndex = -1; this.multiple && event.stopPropagation(); }, "onArrowRightKey"), onHomeKey: /* @__PURE__ */ __name(function onHomeKey(event) { var currentTarget = event.currentTarget; var len = currentTarget.value.length; currentTarget.setSelectionRange(0, event.shiftKey ? len : 0); this.focusedOptionIndex = -1; event.preventDefault(); }, "onHomeKey"), onEndKey: /* @__PURE__ */ __name(function onEndKey(event) { var currentTarget = event.currentTarget; var len = currentTarget.value.length; currentTarget.setSelectionRange(event.shiftKey ? 0 : len, len); this.focusedOptionIndex = -1; event.preventDefault(); }, "onEndKey"), onPageUpKey: /* @__PURE__ */ __name(function onPageUpKey(event) { this.scrollInView(0); event.preventDefault(); }, "onPageUpKey"), onPageDownKey: /* @__PURE__ */ __name(function onPageDownKey(event) { this.scrollInView(this.visibleOptions.length - 1); event.preventDefault(); }, "onPageDownKey"), onEnterKey: /* @__PURE__ */ __name(function onEnterKey(event) { if (!this.typeahead) { if (this.multiple) { this.updateModel(event, [].concat(_toConsumableArray$1(this.modelValue || []), [event.target.value])); this.$refs.focusInput.value = ""; } } else { if (!this.overlayVisible) { this.focusedOptionIndex = -1; this.onArrowDownKey(event); } else { if (this.focusedOptionIndex !== -1) { this.onOptionSelect(event, this.visibleOptions[this.focusedOptionIndex]); } this.hide(); } } }, "onEnterKey"), onEscapeKey: /* @__PURE__ */ __name(function onEscapeKey(event) { this.overlayVisible && this.hide(true); event.preventDefault(); }, "onEscapeKey"), onTabKey: /* @__PURE__ */ __name(function onTabKey(event) { if (this.focusedOptionIndex !== -1) { this.onOptionSelect(event, this.visibleOptions[this.focusedOptionIndex]); } this.overlayVisible && this.hide(); }, "onTabKey"), onBackspaceKey: /* @__PURE__ */ __name(function onBackspaceKey(event) { if (this.multiple) { if (isNotEmpty(this.modelValue) && !this.$refs.focusInput.value) { var removedValue = this.modelValue[this.modelValue.length - 1]; var newValue = this.modelValue.slice(0, -1); this.$emit("update:modelValue", newValue); this.$emit("item-unselect", { originalEvent: event, value: removedValue }); this.$emit("option-unselect", { originalEvent: event, value: removedValue }); } event.stopPropagation(); } }, "onBackspaceKey"), onArrowLeftKeyOnMultiple: /* @__PURE__ */ __name(function onArrowLeftKeyOnMultiple() { this.focusedMultipleOptionIndex = this.focusedMultipleOptionIndex < 1 ? 0 : this.focusedMultipleOptionIndex - 1; }, "onArrowLeftKeyOnMultiple"), onArrowRightKeyOnMultiple: /* @__PURE__ */ __name(function onArrowRightKeyOnMultiple() { this.focusedMultipleOptionIndex++; if (this.focusedMultipleOptionIndex > this.modelValue.length - 1) { this.focusedMultipleOptionIndex = -1; focus(this.$refs.focusInput); } }, "onArrowRightKeyOnMultiple"), onBackspaceKeyOnMultiple: /* @__PURE__ */ __name(function onBackspaceKeyOnMultiple(event) { if (this.focusedMultipleOptionIndex !== -1) { this.removeOption(event, this.focusedMultipleOptionIndex); } }, "onBackspaceKeyOnMultiple"), onOverlayEnter: /* @__PURE__ */ __name(function onOverlayEnter(el) { ZIndex.set("overlay", el, this.$primevue.config.zIndex.overlay); addStyle(el, { position: "absolute", top: "0", left: "0" }); this.alignOverlay(); }, "onOverlayEnter"), onOverlayAfterEnter: /* @__PURE__ */ __name(function onOverlayAfterEnter() { this.bindOutsideClickListener(); this.bindScrollListener(); this.bindResizeListener(); this.$emit("show"); }, "onOverlayAfterEnter"), onOverlayLeave: /* @__PURE__ */ __name(function onOverlayLeave() { this.unbindOutsideClickListener(); this.unbindScrollListener(); this.unbindResizeListener(); this.$emit("hide"); this.overlay = null; }, "onOverlayLeave"), onOverlayAfterLeave: /* @__PURE__ */ __name(function onOverlayAfterLeave(el) { ZIndex.clear(el); }, "onOverlayAfterLeave"), alignOverlay: /* @__PURE__ */ __name(function alignOverlay() { var target = this.multiple ? this.$refs.multiContainer : this.$refs.focusInput.$el; if (this.appendTo === "self") { relativePosition(this.overlay, target); } else { this.overlay.style.minWidth = getOuterWidth(target) + "px"; absolutePosition(this.overlay, target); } }, "alignOverlay"), bindOutsideClickListener: /* @__PURE__ */ __name(function bindOutsideClickListener() { var _this5 = this; if (!this.outsideClickListener) { this.outsideClickListener = function(event) { if (_this5.overlayVisible && _this5.overlay && _this5.isOutsideClicked(event)) { _this5.hide(); } }; document.addEventListener("click", this.outsideClickListener); } }, "bindOutsideClickListener"), unbindOutsideClickListener: /* @__PURE__ */ __name(function unbindOutsideClickListener() { if (this.outsideClickListener) { document.removeEventListener("click", this.outsideClickListener); this.outsideClickListener = null; } }, "unbindOutsideClickListener"), bindScrollListener: /* @__PURE__ */ __name(function bindScrollListener() { var _this6 = this; if (!this.scrollHandler) { this.scrollHandler = new ConnectedOverlayScrollHandler(this.$refs.container, function() { if (_this6.overlayVisible) { _this6.hide(); } }); } this.scrollHandler.bindScrollListener(); }, "bindScrollListener"), unbindScrollListener: /* @__PURE__ */ __name(function unbindScrollListener() { if (this.scrollHandler) { this.scrollHandler.unbindScrollListener(); } }, "unbindScrollListener"), bindResizeListener: /* @__PURE__ */ __name(function bindResizeListener() { var _this7 = this; if (!this.resizeListener) { this.resizeListener = function() { if (_this7.overlayVisible && !isTouchDevice()) { _this7.hide(); } }; window.addEventListener("resize", this.resizeListener); } }, "bindResizeListener"), unbindResizeListener: /* @__PURE__ */ __name(function unbindResizeListener() { if (this.resizeListener) { window.removeEventListener("resize", this.resizeListener); this.resizeListener = null; } }, "unbindResizeListener"), isOutsideClicked: /* @__PURE__ */ __name(function isOutsideClicked(event) { return !this.overlay.contains(event.target) && !this.isInputClicked(event) && !this.isDropdownClicked(event); }, "isOutsideClicked"), isInputClicked: /* @__PURE__ */ __name(function isInputClicked(event) { if (this.multiple) return event.target === this.$refs.multiContainer || this.$refs.multiContainer.contains(event.target); else return event.target === this.$refs.focusInput.$el; }, "isInputClicked"), isDropdownClicked: /* @__PURE__ */ __name(function isDropdownClicked(event) { return this.$refs.dropdownButton ? event.target === this.$refs.dropdownButton || this.$refs.dropdownButton.contains(event.target) : false; }, "isDropdownClicked"), isOptionMatched: /* @__PURE__ */ __name(function isOptionMatched(option2, value) { var _this$getOptionLabel; return this.isValidOption(option2) && ((_this$getOptionLabel = this.getOptionLabel(option2)) === null || _this$getOptionLabel === void 0 ? void 0 : _this$getOptionLabel.toLocaleLowerCase(this.searchLocale)) === value.toLocaleLowerCase(this.searchLocale); }, "isOptionMatched"), isValidOption: /* @__PURE__ */ __name(function isValidOption(option2) { return isNotEmpty(option2) && !(this.isOptionDisabled(option2) || this.isOptionGroup(option2)); }, "isValidOption"), isValidSelectedOption: /* @__PURE__ */ __name(function isValidSelectedOption(option2) { return this.isValidOption(option2) && this.isSelected(option2); }, "isValidSelectedOption"), isEquals: /* @__PURE__ */ __name(function isEquals(value1, value2) { return equals(value1, value2, this.equalityKey); }, "isEquals"), isSelected: /* @__PURE__ */ __name(function isSelected(option2) { var _this8 = this; var optionValue = this.getOptionValue(option2); return this.multiple ? (this.modelValue || []).some(function(value) { return _this8.isEquals(value, optionValue); }) : this.isEquals(this.modelValue, this.getOptionValue(option2)); }, "isSelected"), findFirstOptionIndex: /* @__PURE__ */ __name(function findFirstOptionIndex() { var _this9 = this; return this.visibleOptions.findIndex(function(option2) { return _this9.isValidOption(option2); }); }, "findFirstOptionIndex"), findLastOptionIndex: /* @__PURE__ */ __name(function findLastOptionIndex() { var _this10 = this; return findLastIndex(this.visibleOptions, function(option2) { return _this10.isValidOption(option2); }); }, "findLastOptionIndex"), findNextOptionIndex: /* @__PURE__ */ __name(function findNextOptionIndex(index) { var _this11 = this; var matchedOptionIndex = index < this.visibleOptions.length - 1 ? this.visibleOptions.slice(index + 1).findIndex(function(option2) { return _this11.isValidOption(option2); }) : -1; return matchedOptionIndex > -1 ? matchedOptionIndex + index + 1 : index; }, "findNextOptionIndex"), findPrevOptionIndex: /* @__PURE__ */ __name(function findPrevOptionIndex(index) { var _this12 = this; var matchedOptionIndex = index > 0 ? findLastIndex(this.visibleOptions.slice(0, index), function(option2) { return _this12.isValidOption(option2); }) : -1; return matchedOptionIndex > -1 ? matchedOptionIndex : index; }, "findPrevOptionIndex"), findSelectedOptionIndex: /* @__PURE__ */ __name(function findSelectedOptionIndex() { var _this13 = this; return this.hasSelectedOption ? this.visibleOptions.findIndex(function(option2) { return _this13.isValidSelectedOption(option2); }) : -1; }, "findSelectedOptionIndex"), findFirstFocusedOptionIndex: /* @__PURE__ */ __name(function findFirstFocusedOptionIndex() { var selectedIndex = this.findSelectedOptionIndex(); return selectedIndex < 0 ? this.findFirstOptionIndex() : selectedIndex; }, "findFirstFocusedOptionIndex"), findLastFocusedOptionIndex: /* @__PURE__ */ __name(function findLastFocusedOptionIndex() { var selectedIndex = this.findSelectedOptionIndex(); return selectedIndex < 0 ? this.findLastOptionIndex() : selectedIndex; }, "findLastFocusedOptionIndex"), search: /* @__PURE__ */ __name(function search(event, query, source) { if (query === void 0 || query === null) { return; } if (source === "input" && query.trim().length === 0) { return; } this.searching = true; this.$emit("complete", { originalEvent: event, query }); }, "search"), removeOption: /* @__PURE__ */ __name(function removeOption(event, index) { var _this14 = this; var removedOption = this.modelValue[index]; var value = this.modelValue.filter(function(_, i) { return i !== index; }).map(function(option2) { return _this14.getOptionValue(option2); }); this.updateModel(event, value); this.$emit("item-unselect", { originalEvent: event, value: removedOption }); this.$emit("option-unselect", { originalEvent: event, value: removedOption }); this.dirty = true; focus(this.multiple ? this.$refs.focusInput : this.$refs.focusInput.$el); }, "removeOption"), changeFocusedOptionIndex: /* @__PURE__ */ __name(function changeFocusedOptionIndex(event, index) { if (this.focusedOptionIndex !== index) { this.focusedOptionIndex = index; this.scrollInView(); if (this.selectOnFocus) { this.onOptionSelect(event, this.visibleOptions[index], false); } } }, "changeFocusedOptionIndex"), scrollInView: /* @__PURE__ */ __name(function scrollInView() { var _this15 = this; var index = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : -1; this.$nextTick(function() { var id = index !== -1 ? "".concat(_this15.id, "_").concat(index) : _this15.focusedOptionId; var element = findSingle(_this15.list, 'li[id="'.concat(id, '"]')); if (element) { element.scrollIntoView && element.scrollIntoView({ block: "nearest", inline: "start" }); } else if (!_this15.virtualScrollerDisabled) { _this15.virtualScroller && _this15.virtualScroller.scrollToIndex(index !== -1 ? index : _this15.focusedOptionIndex); } }); }, "scrollInView"), autoUpdateModel: /* @__PURE__ */ __name(function autoUpdateModel() { if (this.selectOnFocus && this.autoOptionFocus && !this.hasSelectedOption) { this.focusedOptionIndex = this.findFirstFocusedOptionIndex(); this.onOptionSelect(null, this.visibleOptions[this.focusedOptionIndex], false); } }, "autoUpdateModel"), updateModel: /* @__PURE__ */ __name(function updateModel(event, value) { this.$emit("update:modelValue", value); this.$emit("change", { originalEvent: event, value }); }, "updateModel"), flatOptions: /* @__PURE__ */ __name(function flatOptions(options) { var _this16 = this; return (options || []).reduce(function(result, option2, index) { result.push({ optionGroup: option2, group: true, index }); var optionGroupChildren = _this16.getOptionGroupChildren(option2); optionGroupChildren && optionGroupChildren.forEach(function(o) { return result.push(o); }); return result; }, []); }, "flatOptions"), overlayRef: /* @__PURE__ */ __name(function overlayRef(el) { this.overlay = el; }, "overlayRef"), listRef: /* @__PURE__ */ __name(function listRef(el, contentRef) { this.list = el; contentRef && contentRef(el); }, "listRef"), virtualScrollerRef: /* @__PURE__ */ __name(function virtualScrollerRef(el) { this.virtualScroller = el; }, "virtualScrollerRef") }, computed: { visibleOptions: /* @__PURE__ */ __name(function visibleOptions() { return this.optionGroupLabel ? this.flatOptions(this.suggestions) : this.suggestions || []; }, "visibleOptions"), inputValue: /* @__PURE__ */ __name(function inputValue() { if (isNotEmpty(this.modelValue)) { if (_typeof$1$1(this.modelValue) === "object") { var label = this.getOptionLabel(this.modelValue); return label != null ? label : this.modelValue; } else { return this.modelValue; } } else { return ""; } }, "inputValue"), hasSelectedOption: /* @__PURE__ */ __name(function hasSelectedOption() { return isNotEmpty(this.modelValue); }, "hasSelectedOption"), equalityKey: /* @__PURE__ */ __name(function equalityKey() { return this.dataKey; }, "equalityKey"), searchResultMessageText: /* @__PURE__ */ __name(function searchResultMessageText() { return isNotEmpty(this.visibleOptions) && this.overlayVisible ? this.searchMessageText.replaceAll("{0}", this.visibleOptions.length) : this.emptySearchMessageText; }, "searchResultMessageText"), searchMessageText: /* @__PURE__ */ __name(function searchMessageText() { return this.searchMessage || this.$primevue.config.locale.searchMessage || ""; }, "searchMessageText"), emptySearchMessageText: /* @__PURE__ */ __name(function emptySearchMessageText() { return this.emptySearchMessage || this.$primevue.config.locale.emptySearchMessage || ""; }, "emptySearchMessageText"), selectionMessageText: /* @__PURE__ */ __name(function selectionMessageText() { return this.selectionMessage || this.$primevue.config.locale.selectionMessage || ""; }, "selectionMessageText"), emptySelectionMessageText: /* @__PURE__ */ __name(function emptySelectionMessageText() { return this.emptySelectionMessage || this.$primevue.config.locale.emptySelectionMessage || ""; }, "emptySelectionMessageText"), selectedMessageText: /* @__PURE__ */ __name(function selectedMessageText() { return this.hasSelectedOption ? this.selectionMessageText.replaceAll("{0}", this.multiple ? this.modelValue.length : "1") : this.emptySelectionMessageText; }, "selectedMessageText"), listAriaLabel: /* @__PURE__ */ __name(function listAriaLabel() { return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.listLabel : void 0; }, "listAriaLabel"), focusedOptionId: /* @__PURE__ */ __name(function focusedOptionId() { return this.focusedOptionIndex !== -1 ? "".concat(this.id, "_").concat(this.focusedOptionIndex) : null; }, "focusedOptionId"), focusedMultipleOptionId: /* @__PURE__ */ __name(function focusedMultipleOptionId() { return this.focusedMultipleOptionIndex !== -1 ? "".concat(this.id, "_multiple_option_").concat(this.focusedMultipleOptionIndex) : null; }, "focusedMultipleOptionId"), ariaSetSize: /* @__PURE__ */ __name(function ariaSetSize() { var _this17 = this; return this.visibleOptions.filter(function(option2) { return !_this17.isOptionGroup(option2); }).length; }, "ariaSetSize"), virtualScrollerDisabled: /* @__PURE__ */ __name(function virtualScrollerDisabled() { return !this.virtualScrollerOptions; }, "virtualScrollerDisabled"), panelId: /* @__PURE__ */ __name(function panelId() { return this.id + "_panel"; }, "panelId"), hasFluid: /* @__PURE__ */ __name(function hasFluid() { return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid; }, "hasFluid") }, components: { InputText: script$f, VirtualScroller: script$g, Portal: script$h, ChevronDownIcon: script$i, SpinnerIcon: script$j, Chip: script$k }, directives: { ripple: Ripple } }; function _typeof$4(o) { "@babel/helpers - typeof"; return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof$4(o); } __name(_typeof$4, "_typeof$4"); function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function(r2) { return Object.getOwnPropertyDescriptor(e, r2).enumerable; })), t.push.apply(t, o); } return t; } __name(ownKeys$3, "ownKeys$3"); function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), true).forEach(function(r2) { _defineProperty$4(e, r2, t[r2]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function(r2) { Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2)); }); } return e; } __name(_objectSpread$3, "_objectSpread$3"); function _defineProperty$4(e, r, t) { return (r = _toPropertyKey$4(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; } __name(_defineProperty$4, "_defineProperty$4"); function _toPropertyKey$4(t) { var i = _toPrimitive$4(t, "string"); return "symbol" == _typeof$4(i) ? i : i + ""; } __name(_toPropertyKey$4, "_toPropertyKey$4"); function _toPrimitive$4(t, r) { if ("object" != _typeof$4(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$4(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } __name(_toPrimitive$4, "_toPrimitive$4"); var _hoisted_1$e = ["aria-activedescendant"]; var _hoisted_2$b = ["id", "aria-label", "aria-setsize", "aria-posinset"]; var _hoisted_3$9 = ["id", "placeholder", "tabindex", "disabled", "aria-label", "aria-labelledby", "aria-expanded", "aria-controls", "aria-activedescendant", "aria-invalid"]; var _hoisted_4$4 = ["disabled", "aria-expanded", "aria-controls"]; var _hoisted_5$3 = ["id"]; var _hoisted_6$2 = ["id", "aria-label"]; var _hoisted_7$1 = ["id"]; var _hoisted_8$1 = ["id", "aria-label", "aria-selected", "aria-disabled", "aria-setsize", "aria-posinset", "onClick", "onMousemove", "data-p-selected", "data-p-focus", "data-p-disabled"]; function render$a(_ctx, _cache, $props, $setup, $data, $options) { var _component_InputText = resolveComponent("InputText"); var _component_Chip = resolveComponent("Chip"); var _component_SpinnerIcon = resolveComponent("SpinnerIcon"); var _component_VirtualScroller = resolveComponent("VirtualScroller"); var _component_Portal = resolveComponent("Portal"); var _directive_ripple = resolveDirective("ripple"); return openBlock(), createElementBlock("div", mergeProps({ ref: "container", "class": _ctx.cx("root"), style: _ctx.sx("root"), onClick: _cache[11] || (_cache[11] = function() { return $options.onContainerClick && $options.onContainerClick.apply($options, arguments); }) }, _ctx.ptmi("root")), [!_ctx.multiple ? (openBlock(), createBlock(_component_InputText, { key: 0, ref: "focusInput", id: _ctx.inputId, type: "text", "class": normalizeClass([_ctx.cx("pcInput"), _ctx.inputClass]), style: normalizeStyle(_ctx.inputStyle), value: $options.inputValue, placeholder: _ctx.placeholder, tabindex: !_ctx.disabled ? _ctx.tabindex : -1, fluid: $options.hasFluid, disabled: _ctx.disabled, invalid: _ctx.invalid, variant: _ctx.variant, autocomplete: "off", role: "combobox", "aria-label": _ctx.ariaLabel, "aria-labelledby": _ctx.ariaLabelledby, "aria-haspopup": "listbox", "aria-autocomplete": "list", "aria-expanded": $data.overlayVisible, "aria-controls": $options.panelId, "aria-activedescendant": $data.focused ? $options.focusedOptionId : void 0, onFocus: $options.onFocus, onBlur: $options.onBlur, onKeydown: $options.onKeyDown, onInput: $options.onInput, onChange: $options.onChange, unstyled: _ctx.unstyled, pt: _ctx.ptm("pcInput") }, null, 8, ["id", "class", "style", "value", "placeholder", "tabindex", "fluid", "disabled", "invalid", "variant", "aria-label", "aria-labelledby", "aria-expanded", "aria-controls", "aria-activedescendant", "onFocus", "onBlur", "onKeydown", "onInput", "onChange", "unstyled", "pt"])) : createCommentVNode("", true), _ctx.multiple ? (openBlock(), createElementBlock("ul", mergeProps({ key: 1, ref: "multiContainer", "class": _ctx.cx("inputMultiple"), tabindex: "-1", role: "listbox", "aria-orientation": "horizontal", "aria-activedescendant": $data.focused ? $options.focusedMultipleOptionId : void 0, onFocus: _cache[5] || (_cache[5] = function() { return $options.onMultipleContainerFocus && $options.onMultipleContainerFocus.apply($options, arguments); }), onBlur: _cache[6] || (_cache[6] = function() { return $options.onMultipleContainerBlur && $options.onMultipleContainerBlur.apply($options, arguments); }), onKeydown: _cache[7] || (_cache[7] = function() { return $options.onMultipleContainerKeyDown && $options.onMultipleContainerKeyDown.apply($options, arguments); }) }, _ctx.ptm("inputMultiple")), [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.modelValue, function(option2, i) { return openBlock(), createElementBlock("li", mergeProps({ key: "".concat(i, "_").concat($options.getOptionLabel(option2)), id: $data.id + "_multiple_option_" + i, "class": _ctx.cx("chipItem", { i }), role: "option", "aria-label": $options.getOptionLabel(option2), "aria-selected": true, "aria-setsize": _ctx.modelValue.length, "aria-posinset": i + 1, ref_for: true }, _ctx.ptm("chipItem")), [renderSlot(_ctx.$slots, "chip", mergeProps({ "class": _ctx.cx("pcChip"), value: option2, index: i, removeCallback: /* @__PURE__ */ __name(function removeCallback(event) { return $options.removeOption(event, i); }, "removeCallback"), ref_for: true }, _ctx.ptm("pcChip")), function() { return [createVNode(_component_Chip, { "class": normalizeClass(_ctx.cx("pcChip")), label: $options.getOptionLabel(option2), removeIcon: _ctx.chipIcon || _ctx.removeTokenIcon, removable: "", unstyled: _ctx.unstyled, onRemove: /* @__PURE__ */ __name(function onRemove2($event) { return $options.removeOption($event, i); }, "onRemove"), pt: _ctx.ptm("pcChip") }, { removeicon: withCtx(function() { return [renderSlot(_ctx.$slots, _ctx.$slots.chipicon ? "chipicon" : "removetokenicon", { "class": normalizeClass(_ctx.cx("chipIcon")), index: i, removeCallback: /* @__PURE__ */ __name(function removeCallback(event) { return $options.removeOption(event, i); }, "removeCallback") })]; }), _: 2 }, 1032, ["class", "label", "removeIcon", "unstyled", "onRemove", "pt"])]; })], 16, _hoisted_2$b); }), 128)), createBaseVNode("li", mergeProps({ "class": _ctx.cx("inputChip"), role: "option" }, _ctx.ptm("inputChip")), [createBaseVNode("input", mergeProps({ ref: "focusInput", id: _ctx.inputId, type: "text", style: _ctx.inputStyle, "class": _ctx.inputClass, placeholder: _ctx.placeholder, tabindex: !_ctx.disabled ? _ctx.tabindex : -1, disabled: _ctx.disabled, autocomplete: "off", role: "combobox", "aria-label": _ctx.ariaLabel, "aria-labelledby": _ctx.ariaLabelledby, "aria-haspopup": "listbox", "aria-autocomplete": "list", "aria-expanded": $data.overlayVisible, "aria-controls": $data.id + "_list", "aria-activedescendant": $data.focused ? $options.focusedOptionId : void 0, "aria-invalid": _ctx.invalid || void 0, onFocus: _cache[0] || (_cache[0] = function() { return $options.onFocus && $options.onFocus.apply($options, arguments); }), onBlur: _cache[1] || (_cache[1] = function() { return $options.onBlur && $options.onBlur.apply($options, arguments); }), onKeydown: _cache[2] || (_cache[2] = function() { return $options.onKeyDown && $options.onKeyDown.apply($options, arguments); }), onInput: _cache[3] || (_cache[3] = function() { return $options.onInput && $options.onInput.apply($options, arguments); }), onChange: _cache[4] || (_cache[4] = function() { return $options.onChange && $options.onChange.apply($options, arguments); }) }, _ctx.ptm("input")), null, 16, _hoisted_3$9)], 16)], 16, _hoisted_1$e)) : createCommentVNode("", true), $data.searching || _ctx.loading ? renderSlot(_ctx.$slots, _ctx.$slots.loader ? "loader" : "loadingicon", { key: 2, "class": normalizeClass(_ctx.cx("loader")) }, function() { return [_ctx.loader || _ctx.loadingIcon ? (openBlock(), createElementBlock("i", mergeProps({ key: 0, "class": ["pi-spin", _ctx.cx("loader"), _ctx.loader, _ctx.loadingIcon], "aria-hidden": "true" }, _ctx.ptm("loader")), null, 16)) : (openBlock(), createBlock(_component_SpinnerIcon, mergeProps({ key: 1, "class": _ctx.cx("loader"), spin: "", "aria-hidden": "true" }, _ctx.ptm("loader")), null, 16, ["class"]))]; }) : createCommentVNode("", true), renderSlot(_ctx.$slots, _ctx.$slots.dropdown ? "dropdown" : "dropdownbutton", { toggleCallback: /* @__PURE__ */ __name(function toggleCallback(event) { return $options.onDropdownClick(event); }, "toggleCallback") }, function() { return [_ctx.dropdown ? (openBlock(), createElementBlock("button", mergeProps({ key: 0, ref: "dropdownButton", type: "button", "class": [_ctx.cx("dropdown"), _ctx.dropdownClass], disabled: _ctx.disabled, "aria-haspopup": "listbox", "aria-expanded": $data.overlayVisible, "aria-controls": $options.panelId, onClick: _cache[8] || (_cache[8] = function() { return $options.onDropdownClick && $options.onDropdownClick.apply($options, arguments); }) }, _ctx.ptm("dropdown")), [renderSlot(_ctx.$slots, "dropdownicon", { "class": normalizeClass(_ctx.dropdownIcon) }, function() { return [(openBlock(), createBlock(resolveDynamicComponent(_ctx.dropdownIcon ? "span" : "ChevronDownIcon"), mergeProps({ "class": _ctx.dropdownIcon }, _ctx.ptm("dropdownIcon")), null, 16, ["class"]))]; })], 16, _hoisted_4$4)) : createCommentVNode("", true)]; }), createBaseVNode("span", mergeProps({ role: "status", "aria-live": "polite", "class": "p-hidden-accessible" }, _ctx.ptm("hiddenSearchResult"), { "data-p-hidden-accessible": true }), toDisplayString($options.searchResultMessageText), 17), createVNode(_component_Portal, { appendTo: _ctx.appendTo }, { "default": withCtx(function() { return [createVNode(Transition, mergeProps({ name: "p-connected-overlay", onEnter: $options.onOverlayEnter, onAfterEnter: $options.onOverlayAfterEnter, onLeave: $options.onOverlayLeave, onAfterLeave: $options.onOverlayAfterLeave }, _ctx.ptm("transition")), { "default": withCtx(function() { return [$data.overlayVisible ? (openBlock(), createElementBlock("div", mergeProps({ key: 0, ref: $options.overlayRef, id: $options.panelId, "class": [_ctx.cx("overlay"), _ctx.panelClass, _ctx.overlayClass], style: _objectSpread$3(_objectSpread$3(_objectSpread$3({}, _ctx.panelStyle), _ctx.overlayStyle), {}, { "max-height": $options.virtualScrollerDisabled ? _ctx.scrollHeight : "" }), onClick: _cache[9] || (_cache[9] = function() { return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments); }), onKeydown: _cache[10] || (_cache[10] = function() { return $options.onOverlayKeyDown && $options.onOverlayKeyDown.apply($options, arguments); }) }, _ctx.ptm("overlay")), [renderSlot(_ctx.$slots, "header", { value: _ctx.modelValue, suggestions: $options.visibleOptions }), createVNode(_component_VirtualScroller, mergeProps({ ref: $options.virtualScrollerRef }, _ctx.virtualScrollerOptions, { style: { height: _ctx.scrollHeight }, items: $options.visibleOptions, tabindex: -1, disabled: $options.virtualScrollerDisabled, pt: _ctx.ptm("virtualScroller") }), createSlots({ content: withCtx(function(_ref) { var styleClass = _ref.styleClass, contentRef = _ref.contentRef, items = _ref.items, getItemOptions = _ref.getItemOptions, contentStyle = _ref.contentStyle, itemSize = _ref.itemSize; return [createBaseVNode("ul", mergeProps({ ref: /* @__PURE__ */ __name(function ref2(el) { return $options.listRef(el, contentRef); }, "ref"), id: $data.id + "_list", "class": [_ctx.cx("list"), styleClass], style: contentStyle, role: "listbox", "aria-label": $options.listAriaLabel }, _ctx.ptm("list")), [(openBlock(true), createElementBlock(Fragment, null, renderList(items, function(option2, i) { return openBlock(), createElementBlock(Fragment, { key: $options.getOptionRenderKey(option2, $options.getOptionIndex(i, getItemOptions)) }, [$options.isOptionGroup(option2) ? (openBlock(), createElementBlock("li", mergeProps({ key: 0, id: $data.id + "_" + $options.getOptionIndex(i, getItemOptions), style: { height: itemSize ? itemSize + "px" : void 0 }, "class": _ctx.cx("optionGroup"), role: "option", ref_for: true }, _ctx.ptm("optionGroup")), [renderSlot(_ctx.$slots, "optiongroup", { option: option2.optionGroup, index: $options.getOptionIndex(i, getItemOptions) }, function() { return [createTextVNode(toDisplayString($options.getOptionGroupLabel(option2.optionGroup)), 1)]; })], 16, _hoisted_7$1)) : withDirectives((openBlock(), createElementBlock("li", mergeProps({ key: 1, id: $data.id + "_" + $options.getOptionIndex(i, getItemOptions), style: { height: itemSize ? itemSize + "px" : void 0 }, "class": _ctx.cx("option", { option: option2, i, getItemOptions }), role: "option", "aria-label": $options.getOptionLabel(option2), "aria-selected": $options.isSelected(option2), "aria-disabled": $options.isOptionDisabled(option2), "aria-setsize": $options.ariaSetSize, "aria-posinset": $options.getAriaPosInset($options.getOptionIndex(i, getItemOptions)), onClick: /* @__PURE__ */ __name(function onClick($event) { return $options.onOptionSelect($event, option2); }, "onClick"), onMousemove: /* @__PURE__ */ __name(function onMousemove($event) { return $options.onOptionMouseMove($event, $options.getOptionIndex(i, getItemOptions)); }, "onMousemove"), "data-p-selected": $options.isSelected(option2), "data-p-focus": $data.focusedOptionIndex === $options.getOptionIndex(i, getItemOptions), "data-p-disabled": $options.isOptionDisabled(option2), ref_for: true }, $options.getPTOptions(option2, getItemOptions, i, "option")), [renderSlot(_ctx.$slots, "option", { option: option2, index: $options.getOptionIndex(i, getItemOptions) }, function() { return [createTextVNode(toDisplayString($options.getOptionLabel(option2)), 1)]; })], 16, _hoisted_8$1)), [[_directive_ripple]])], 64); }), 128)), !items || items && items.length === 0 ? (openBlock(), createElementBlock("li", mergeProps({ key: 0, "class": _ctx.cx("emptyMessage"), role: "option" }, _ctx.ptm("emptyMessage")), [renderSlot(_ctx.$slots, "empty", {}, function() { return [createTextVNode(toDisplayString($options.searchResultMessageText), 1)]; })], 16)) : createCommentVNode("", true)], 16, _hoisted_6$2)]; }), _: 2 }, [_ctx.$slots.loader ? { name: "loader", fn: withCtx(function(_ref2) { var options = _ref2.options; return [renderSlot(_ctx.$slots, "loader", { options })]; }), key: "0" } : void 0]), 1040, ["style", "items", "disabled", "pt"]), renderSlot(_ctx.$slots, "footer", { value: _ctx.modelValue, suggestions: $options.visibleOptions }), createBaseVNode("span", mergeProps({ role: "status", "aria-live": "polite", "class": "p-hidden-accessible" }, _ctx.ptm("hiddenSelectedMessage"), { "data-p-hidden-accessible": true }), toDisplayString($options.selectedMessageText), 17)], 16, _hoisted_5$3)) : createCommentVNode("", true)]; }), _: 3 }, 16, ["onEnter", "onAfterEnter", "onLeave", "onAfterLeave"])]; }), _: 3 }, 8, ["appendTo"])], 16); } __name(render$a, "render$a"); script$8.render = render$a; const _sfc_main$g = { name: "AutoCompletePlus", extends: script$8, emits: ["focused-option-changed"], mounted() { if (typeof script$8.mounted === "function") { script$8.mounted.call(this); } this.$watch( () => this.focusedOptionIndex, (newVal, oldVal) => { this.$emit("focused-option-changed", newVal); } ); } }; const _withScopeId$5 = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-37f672ab"), n = n(), popScopeId(), n), "_withScopeId$5"); const _hoisted_1$d = { class: "option-container flex justify-between items-center px-2 py-0 cursor-pointer overflow-hidden w-full" }; const _hoisted_2$a = { class: "option-display-name font-semibold flex flex-col" }; const _hoisted_3$8 = { key: 0 }; const _hoisted_4$3 = /* @__PURE__ */ _withScopeId$5(() => /* @__PURE__ */ createBaseVNode("i", { class: "pi pi-bookmark-fill text-sm mr-1" }, null, -1)); const _hoisted_5$2 = [ _hoisted_4$3 ]; const _hoisted_6$1 = ["innerHTML"]; const _hoisted_7 = /* @__PURE__ */ _withScopeId$5(() => /* @__PURE__ */ createBaseVNode("span", null, " ", -1)); const _hoisted_8 = ["innerHTML"]; const _hoisted_9 = { key: 0, class: "option-category font-light text-sm text-gray-400 overflow-hidden text-ellipsis whitespace-nowrap" }; const _hoisted_10 = { class: "option-badges" }; const _sfc_main$f = /* @__PURE__ */ defineComponent({ __name: "NodeSearchItem", props: { nodeDef: {}, currentQuery: {} }, setup(__props) { const settingStore = useSettingStore(); const showCategory = computed( () => settingStore.get("Comfy.NodeSearchBoxImpl.ShowCategory") ); const showIdName = computed( () => settingStore.get("Comfy.NodeSearchBoxImpl.ShowIdName") ); const showNodeFrequency = computed( () => settingStore.get("Comfy.NodeSearchBoxImpl.ShowNodeFrequency") ); const nodeFrequencyStore = useNodeFrequencyStore(); const nodeFrequency = computed( () => nodeFrequencyStore.getNodeFrequency(props.nodeDef) ); const nodeBookmarkStore = useNodeBookmarkStore(); const isBookmarked = computed( () => nodeBookmarkStore.isBookmarked(props.nodeDef) ); const props = __props; return (_ctx, _cache) => { return openBlock(), createElementBlock("div", _hoisted_1$d, [ createBaseVNode("div", _hoisted_2$a, [ createBaseVNode("div", null, [ isBookmarked.value ? (openBlock(), createElementBlock("span", _hoisted_3$8, _hoisted_5$2)) : createCommentVNode("", true), createBaseVNode("span", { innerHTML: unref(highlightQuery)(_ctx.nodeDef.display_name, _ctx.currentQuery) }, null, 8, _hoisted_6$1), _hoisted_7, showIdName.value ? (openBlock(), createBlock(unref(script$l), { key: 1, severity: "secondary" }, { default: withCtx(() => [ createBaseVNode("span", { innerHTML: unref(highlightQuery)(_ctx.nodeDef.name, _ctx.currentQuery) }, null, 8, _hoisted_8) ]), _: 1 })) : createCommentVNode("", true) ]), showCategory.value ? (openBlock(), createElementBlock("div", _hoisted_9, toDisplayString(_ctx.nodeDef.category.replaceAll("/", " > ")), 1)) : createCommentVNode("", true) ]), createBaseVNode("div", _hoisted_10, [ _ctx.nodeDef.experimental ? (openBlock(), createBlock(unref(script$l), { key: 0, value: _ctx.$t("experimental"), severity: "primary" }, null, 8, ["value"])) : createCommentVNode("", true), _ctx.nodeDef.deprecated ? (openBlock(), createBlock(unref(script$l), { key: 1, value: _ctx.$t("deprecated"), severity: "danger" }, null, 8, ["value"])) : createCommentVNode("", true), showNodeFrequency.value && nodeFrequency.value > 0 ? (openBlock(), createBlock(unref(script$l), { key: 2, value: unref(formatNumberWithSuffix)(nodeFrequency.value, { roundToInt: true }), severity: "secondary" }, null, 8, ["value"])) : createCommentVNode("", true), _ctx.nodeDef.nodeSource.type !== unref(NodeSourceType).Unknown ? (openBlock(), createBlock(unref(script$k), { key: 3, class: "text-sm font-light" }, { default: withCtx(() => [ createTextVNode(toDisplayString(_ctx.nodeDef.nodeSource.displayText), 1) ]), _: 1 })) : createCommentVNode("", true) ]) ]); }; } }); const NodeSearchItem = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-37f672ab"]]); const _withScopeId$4 = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-2d409367"), n = n(), popScopeId(), n), "_withScopeId$4"); const _hoisted_1$c = { class: "comfy-vue-node-search-container" }; const _hoisted_2$9 = { key: 0, class: "comfy-vue-node-preview-container" }; const _hoisted_3$7 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ createBaseVNode("h3", null, "Add node filter condition", -1)); const _hoisted_4$2 = { class: "_dialog-body" }; const _sfc_main$e = /* @__PURE__ */ defineComponent({ __name: "NodeSearchBox", props: { filters: {}, searchLimit: { default: 64 } }, emits: ["addFilter", "removeFilter", "addNode"], setup(__props, { emit: __emit }) { const settingStore = useSettingStore(); const { t } = useI18n(); const enableNodePreview = computed( () => settingStore.get("Comfy.NodeSearchBoxImpl.NodePreview") ); const props = __props; const nodeSearchFilterVisible = ref(false); const inputId = `comfy-vue-node-search-box-input-${Math.random()}`; const suggestions2 = ref([]); const hoveredSuggestion = ref(null); const currentQuery = ref(""); const placeholder = computed(() => { return props.filters.length === 0 ? t("searchNodes") + "..." : ""; }); const nodeDefStore = useNodeDefStore(); const nodeFrequencyStore = useNodeFrequencyStore(); const search2 = /* @__PURE__ */ __name((query) => { const queryIsEmpty = query === "" && props.filters.length === 0; currentQuery.value = query; suggestions2.value = queryIsEmpty ? nodeFrequencyStore.topNodeDefs : [ ...nodeDefStore.nodeSearchService.searchNode(query, props.filters, { limit: props.searchLimit }) ]; }, "search"); const emit = __emit; const reFocusInput = /* @__PURE__ */ __name(() => { const inputElement = document.getElementById(inputId); if (inputElement) { inputElement.blur(); inputElement.focus(); } }, "reFocusInput"); onMounted(reFocusInput); const onAddFilter = /* @__PURE__ */ __name((filterAndValue) => { nodeSearchFilterVisible.value = false; emit("addFilter", filterAndValue); reFocusInput(); }, "onAddFilter"); const onRemoveFilter = /* @__PURE__ */ __name((event, filterAndValue) => { event.stopPropagation(); event.preventDefault(); emit("removeFilter", filterAndValue); reFocusInput(); }, "onRemoveFilter"); const setHoverSuggestion = /* @__PURE__ */ __name((index) => { if (index === -1) { hoveredSuggestion.value = null; return; } const value = suggestions2.value[index]; hoveredSuggestion.value = value; }, "setHoverSuggestion"); return (_ctx, _cache) => { return openBlock(), createElementBlock("div", _hoisted_1$c, [ enableNodePreview.value ? (openBlock(), createElementBlock("div", _hoisted_2$9, [ hoveredSuggestion.value ? (openBlock(), createBlock(NodePreview, { nodeDef: hoveredSuggestion.value, key: hoveredSuggestion.value?.name || "" }, null, 8, ["nodeDef"])) : createCommentVNode("", true) ])) : createCommentVNode("", true), createVNode(unref(script$d), { icon: "pi pi-filter", severity: "secondary", class: "_filter-button", onClick: _cache[0] || (_cache[0] = ($event) => nodeSearchFilterVisible.value = true) }), createVNode(unref(script$m), { visible: nodeSearchFilterVisible.value, "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => nodeSearchFilterVisible.value = $event), class: "_dialog" }, { header: withCtx(() => [ _hoisted_3$7 ]), default: withCtx(() => [ createBaseVNode("div", _hoisted_4$2, [ createVNode(NodeSearchFilter, { onAddFilter }) ]) ]), _: 1 }, 8, ["visible"]), createVNode(_sfc_main$g, { "model-value": props.filters, class: "comfy-vue-node-search-box", scrollHeight: "40vh", placeholder: placeholder.value, "input-id": inputId, "append-to": "self", suggestions: suggestions2.value, "min-length": 0, delay: 100, loading: !unref(nodeFrequencyStore).isLoaded, onComplete: _cache[2] || (_cache[2] = ($event) => search2($event.query)), onOptionSelect: _cache[3] || (_cache[3] = ($event) => emit("addNode", $event.value)), onFocusedOptionChanged: _cache[4] || (_cache[4] = ($event) => setHoverSuggestion($event)), "complete-on-focus": "", "auto-option-focus": "", "force-selection": "", multiple: "", optionLabel: "display_name" }, { option: withCtx(({ option: option2 }) => [ createVNode(NodeSearchItem, { nodeDef: option2, currentQuery: currentQuery.value }, null, 8, ["nodeDef", "currentQuery"]) ]), chip: withCtx(({ value }) => [ createVNode(SearchFilterChip, { onRemove: /* @__PURE__ */ __name(($event) => onRemoveFilter($event, value), "onRemove"), text: value[1], badge: value[0].invokeSequence.toUpperCase(), "badge-class": value[0].invokeSequence + "-badge" }, null, 8, ["onRemove", "text", "badge", "badge-class"]) ]), _: 1 }, 8, ["model-value", "placeholder", "suggestions", "loading"]) ]); }; } }); const NodeSearchBox = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-2d409367"]]); class ConnectingLinkImpl { static { __name(this, "ConnectingLinkImpl"); } node; slot; input; output; pos; constructor(node, slot, input, output, pos) { this.node = node; this.slot = slot; this.input = input; this.output = output; this.pos = pos; } static createFromPlainObject(obj) { return new ConnectingLinkImpl( obj.node, obj.slot, obj.input, obj.output, obj.pos ); } get type() { const result = this.input ? this.input.type : this.output.type; return result === -1 ? null : result; } /** * Which slot type is release and need to be reconnected. * - 'output' means we need a new node's outputs slot to connect with this link */ get releaseSlotType() { return this.output ? "input" : "output"; } connectTo(newNode) { const newNodeSlots = this.releaseSlotType === "output" ? newNode.outputs : newNode.inputs; if (!newNodeSlots) return; const newNodeSlot = newNodeSlots.findIndex( (slot) => LiteGraph.isValidConnection(slot.type, this.type) ); if (newNodeSlot === -1) { console.warn( `Could not find slot with type ${this.type} on node ${newNode.title}. This should never happen` ); return; } if (this.releaseSlotType === "input") { this.node.connect(this.slot, newNode, newNodeSlot); } else { newNode.connect(newNodeSlot, this.node, this.slot); } } } const _sfc_main$d = /* @__PURE__ */ defineComponent({ __name: "NodeSearchBoxPopover", setup(__props) { const settingStore = useSettingStore(); const visible = ref(false); const dismissable = ref(true); const triggerEvent = ref(null); const getNewNodeLocation = /* @__PURE__ */ __name(() => { if (triggerEvent.value === null) { return [100, 100]; } const originalEvent = triggerEvent.value.detail.originalEvent; return [originalEvent.canvasX, originalEvent.canvasY]; }, "getNewNodeLocation"); const nodeFilters = ref([]); const addFilter = /* @__PURE__ */ __name((filter) => { nodeFilters.value.push(filter); }, "addFilter"); const removeFilter = /* @__PURE__ */ __name((filter) => { nodeFilters.value = nodeFilters.value.filter( (f) => toRaw(f) !== toRaw(filter) ); }, "removeFilter"); const clearFilters = /* @__PURE__ */ __name(() => { nodeFilters.value = []; }, "clearFilters"); const closeDialog = /* @__PURE__ */ __name(() => { visible.value = false; }, "closeDialog"); const addNode = /* @__PURE__ */ __name((nodeDef) => { const node = app.addNodeOnGraph(nodeDef, { pos: getNewNodeLocation() }); const eventDetail = triggerEvent.value.detail; if (eventDetail.subType === "empty-release") { eventDetail.linkReleaseContext.links.forEach((link) => { ConnectingLinkImpl.createFromPlainObject(link).connectTo(node); }); } window.setTimeout(() => { closeDialog(); }, 100); }, "addNode"); const newSearchBoxEnabled = computed( () => settingStore.get("Comfy.NodeSearchBoxImpl") === "default" ); const showSearchBox = /* @__PURE__ */ __name((e) => { if (newSearchBoxEnabled.value) { if (e.detail.originalEvent?.pointerType === "touch") { setTimeout(() => { showNewSearchBox(e); }, 128); } else { showNewSearchBox(e); } } else { canvasStore.canvas.showSearchBox(e.detail.originalEvent); } }, "showSearchBox"); const nodeDefStore = useNodeDefStore(); const showNewSearchBox = /* @__PURE__ */ __name((e) => { if (e.detail.linkReleaseContext) { const links = e.detail.linkReleaseContext.links; if (links.length === 0) { console.warn("Empty release with no links! This should never happen"); return; } const firstLink = ConnectingLinkImpl.createFromPlainObject(links[0]); const filter = nodeDefStore.nodeSearchService.getFilterById( firstLink.releaseSlotType ); const dataType = firstLink.type; addFilter([filter, dataType]); } visible.value = true; triggerEvent.value = e; dismissable.value = false; setTimeout(() => { dismissable.value = true; }, 300); }, "showNewSearchBox"); const showContextMenu = /* @__PURE__ */ __name((e) => { const links = e.detail.linkReleaseContext.links; if (links.length === 0) { console.warn("Empty release with no links! This should never happen"); return; } const firstLink = ConnectingLinkImpl.createFromPlainObject(links[0]); const mouseEvent = e.detail.originalEvent; const commonOptions = { e: mouseEvent, allow_searchbox: true, showSearchBox: /* @__PURE__ */ __name(() => showSearchBox(e), "showSearchBox") }; const connectionOptions = firstLink.output ? { nodeFrom: firstLink.node, slotFrom: firstLink.output } : { nodeTo: firstLink.node, slotTo: firstLink.input }; canvasStore.canvas.showConnectionMenu({ ...connectionOptions, ...commonOptions }); }, "showContextMenu"); const canvasStore = useCanvasStore(); watchEffect(() => { if (canvasStore.canvas) { LiteGraph.release_link_on_empty_shows_menu = false; canvasStore.canvas.allow_searchbox = false; } }); const canvasEventHandler = /* @__PURE__ */ __name((e) => { if (e.detail.subType === "empty-double-click") { showSearchBox(e); } else if (e.detail.subType === "empty-release") { handleCanvasEmptyRelease(e); } else if (e.detail.subType === "group-double-click") { const group = e.detail.group; const [x, y] = group.pos; const relativeY = e.detail.originalEvent.canvasY - y; if (relativeY > group.titleHeight) { showSearchBox(e); } } }, "canvasEventHandler"); const linkReleaseAction = computed(() => { return settingStore.get("Comfy.LinkRelease.Action"); }); const linkReleaseActionShift = computed(() => { return settingStore.get("Comfy.LinkRelease.ActionShift"); }); const handleCanvasEmptyRelease = /* @__PURE__ */ __name((e) => { const originalEvent = e.detail.originalEvent; const shiftPressed = originalEvent.shiftKey; const action = shiftPressed ? linkReleaseActionShift.value : linkReleaseAction.value; switch (action) { case LinkReleaseTriggerAction.SEARCH_BOX: showSearchBox(e); break; case LinkReleaseTriggerAction.CONTEXT_MENU: showContextMenu(e); break; case LinkReleaseTriggerAction.NO_ACTION: default: break; } }, "handleCanvasEmptyRelease"); onMounted(() => { document.addEventListener("litegraph:canvas", canvasEventHandler); }); onUnmounted(() => { document.removeEventListener("litegraph:canvas", canvasEventHandler); }); return (_ctx, _cache) => { return openBlock(), createElementBlock("div", null, [ createVNode(unref(script$m), { visible: visible.value, "onUpdate:visible": _cache[0] || (_cache[0] = ($event) => visible.value = $event), modal: "", "dismissable-mask": dismissable.value, onHide: clearFilters, pt: { root: { class: "invisible-dialog-root", role: "search" }, mask: { class: "node-search-box-dialog-mask" }, transition: { enterFromClass: "opacity-0 scale-75", // 100ms is the duration of the transition in the dialog component enterActiveClass: "transition-all duration-100 ease-out", leaveActiveClass: "transition-all duration-100 ease-in", leaveToClass: "opacity-0 scale-75" } } }, { container: withCtx(() => [ createVNode(NodeSearchBox, { filters: nodeFilters.value, onAddFilter: addFilter, onRemoveFilter: removeFilter, onAddNode: addNode }, null, 8, ["filters"]) ]), _: 1 }, 8, ["visible", "dismissable-mask"]) ]); }; } }); const _sfc_main$c = /* @__PURE__ */ defineComponent({ __name: "NodeTooltip", setup(__props) { let idleTimeout; const nodeDefStore = useNodeDefStore(); const tooltipRef = ref(); const tooltipText = ref(""); const left = ref(); const top = ref(); const getHoveredWidget = /* @__PURE__ */ __name(() => { const node = app.canvas.node_over; if (!node.widgets) return; const graphPos = app.canvas.graph_mouse; const x = graphPos[0] - node.pos[0]; const y = graphPos[1] - node.pos[1]; for (const w of node.widgets) { let widgetWidth, widgetHeight; if (w.computeSize) { ; [widgetWidth, widgetHeight] = w.computeSize(node.size[0]); } else { widgetWidth = w.width || node.size[0]; widgetHeight = LiteGraph.NODE_WIDGET_HEIGHT; } if (w.last_y !== void 0 && x >= 6 && x <= widgetWidth - 12 && y >= w.last_y && y <= w.last_y + widgetHeight) { return w; } } }, "getHoveredWidget"); const hideTooltip = /* @__PURE__ */ __name(() => tooltipText.value = null, "hideTooltip"); const showTooltip = /* @__PURE__ */ __name(async (tooltip) => { if (!tooltip) return; left.value = app.canvas.mouse[0] + "px"; top.value = app.canvas.mouse[1] + "px"; tooltipText.value = tooltip; await nextTick(); const rect = tooltipRef.value.getBoundingClientRect(); if (rect.right > window.innerWidth) { left.value = app.canvas.mouse[0] - rect.width + "px"; } if (rect.top < 0) { top.value = app.canvas.mouse[1] + rect.height + "px"; } }, "showTooltip"); const onIdle = /* @__PURE__ */ __name(() => { const { canvas } = app; const node = canvas.node_over; if (!node) return; const ctor = node.constructor; const nodeDef = nodeDefStore.nodeDefsByName[node.type]; if (ctor.title_mode !== LiteGraph.NO_TITLE && canvas.graph_mouse[1] < node.pos[1]) { return showTooltip(nodeDef.description); } if (node.flags?.collapsed) return; const inputSlot = canvas.isOverNodeInput( node, canvas.graph_mouse[0], canvas.graph_mouse[1], [0, 0] ); if (inputSlot !== -1) { const inputName = node.inputs[inputSlot].name; return showTooltip(nodeDef.input.getInput(inputName)?.tooltip); } const outputSlot = canvas.isOverNodeOutput( node, canvas.graph_mouse[0], canvas.graph_mouse[1], [0, 0] ); if (outputSlot !== -1) { return showTooltip(nodeDef.output.all?.[outputSlot]?.tooltip); } const widget = getHoveredWidget(); if (widget && !widget.element) { return showTooltip( widget.tooltip ?? nodeDef.input.getInput(widget.name)?.tooltip ); } }, "onIdle"); const onMouseMove = /* @__PURE__ */ __name((e) => { hideTooltip(); clearTimeout(idleTimeout); if (e.target.nodeName !== "CANVAS") return; idleTimeout = window.setTimeout(onIdle, 500); }, "onMouseMove"); useEventListener(window, "mousemove", onMouseMove); useEventListener(window, "click", hideTooltip); return (_ctx, _cache) => { return tooltipText.value ? (openBlock(), createElementBlock("div", { key: 0, ref_key: "tooltipRef", ref: tooltipRef, class: "node-tooltip", style: normalizeStyle({ left: left.value, top: top.value }) }, toDisplayString(tooltipText.value), 5)) : createCommentVNode("", true); }; } }); const NodeTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-79ec8c53"]]); const _hoisted_1$b = { viewBox: "0 0 1024 1024", width: "1.2em", height: "1.2em" }; const _hoisted_2$8 = /* @__PURE__ */ createBaseVNode("path", { fill: "currentColor", d: "M921.088 103.232L584.832 889.024L465.52 544.512L121.328 440.48zM1004.46.769c-6.096 0-13.52 1.728-22.096 5.36L27.708 411.2c-34.383 14.592-36.56 42.704-4.847 62.464l395.296 123.584l129.36 403.264c9.28 15.184 20.496 22.72 31.263 22.72c11.936 0 23.296-9.152 31.04-27.248l408.272-953.728C1029.148 16.368 1022.86.769 1004.46.769" }, null, -1); const _hoisted_3$6 = [ _hoisted_2$8 ]; function render$9(_ctx, _cache) { return openBlock(), createElementBlock("svg", _hoisted_1$b, [..._hoisted_3$6]); } __name(render$9, "render$9"); const __unplugin_components_1 = markRaw({ name: "simple-line-icons-cursor", render: render$9 }); const _hoisted_1$a = { viewBox: "0 0 24 24", width: "1.2em", height: "1.2em" }; const _hoisted_2$7 = /* @__PURE__ */ createBaseVNode("path", { fill: "currentColor", d: "M10.05 23q-.75 0-1.4-.337T7.575 21.7L1.2 12.375l.6-.575q.475-.475 1.125-.55t1.175.3L7 13.575V4q0-.425.288-.712T8 3t.713.288T9 4v13.425l-3.7-2.6l3.925 5.725q.125.2.35.325t.475.125H17q.825 0 1.413-.587T19 19V5q0-.425.288-.712T20 4t.713.288T21 5v14q0 1.65-1.175 2.825T17 23zM11 12V2q0-.425.288-.712T12 1t.713.288T13 2v10zm4 0V3q0-.425.288-.712T16 2t.713.288T17 3v9zm-2.85 4.5" }, null, -1); const _hoisted_3$5 = [ _hoisted_2$7 ]; function render$8(_ctx, _cache) { return openBlock(), createElementBlock("svg", _hoisted_1$a, [..._hoisted_3$5]); } __name(render$8, "render$8"); const __unplugin_components_0$1 = markRaw({ name: "material-symbols-pan-tool-outline", render: render$8 }); var theme$5 = /* @__PURE__ */ __name(function theme4(_ref) { _ref.dt; return "\n.p-buttongroup .p-button {\n margin: 0;\n}\n\n.p-buttongroup .p-button:not(:last-child),\n.p-buttongroup .p-button:not(:last-child):hover {\n border-right: 0 none;\n}\n\n.p-buttongroup .p-button:not(:first-of-type):not(:last-of-type) {\n border-radius: 0;\n}\n\n.p-buttongroup .p-button:first-of-type:not(:only-of-type) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.p-buttongroup .p-button:last-of-type:not(:only-of-type) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.p-buttongroup .p-button:focus {\n position: relative;\n z-index: 1;\n}\n"; }, "theme"); var classes$5 = { root: "p-buttongroup p-component" }; var ButtonGroupStyle = BaseStyle.extend({ name: "buttongroup", theme: theme$5, classes: classes$5 }); var script$1$5 = { name: "BaseButtonGroup", "extends": script$e, style: ButtonGroupStyle, provide: /* @__PURE__ */ __name(function provide6() { return { $pcButtonGroup: this, $parentInstance: this }; }, "provide") }; var script$7 = { name: "ButtonGroup", "extends": script$1$5, inheritAttrs: false }; function render$7(_ctx, _cache, $props, $setup, $data, $options) { return openBlock(), createElementBlock("span", mergeProps({ "class": _ctx.cx("root"), role: "group" }, _ctx.ptmi("root")), [renderSlot(_ctx.$slots, "default")], 16); } __name(render$7, "render$7"); script$7.render = render$7; const _sfc_main$b = /* @__PURE__ */ defineComponent({ __name: "GraphCanvasMenu", setup(__props) { const { t } = useI18n(); const commandStore = useCommandStore(); const canvasStore = useCanvasStore(); const settingStore = useSettingStore(); const linkHidden = computed( () => settingStore.get("Comfy.LinkRenderMode") === LiteGraph.HIDDEN_LINK ); let interval = null; const repeat2 = /* @__PURE__ */ __name((command) => { if (interval) return; const cmd = /* @__PURE__ */ __name(() => commandStore.execute(command), "cmd"); cmd(); interval = window.setInterval(cmd, 100); }, "repeat"); const stopRepeat = /* @__PURE__ */ __name(() => { if (interval) { clearInterval(interval); interval = null; } }, "stopRepeat"); return (_ctx, _cache) => { const _component_i_material_symbols58pan_tool_outline = __unplugin_components_0$1; const _component_i_simple_line_icons58cursor = __unplugin_components_1; const _directive_tooltip = resolveDirective("tooltip"); return openBlock(), createBlock(unref(script$7), { class: "p-buttongroup-vertical absolute bottom-[10px] right-[10px] z-[1000] pointer-events-auto" }, { default: withCtx(() => [ withDirectives(createVNode(unref(script$d), { severity: "secondary", icon: "pi pi-plus", onMousedown: _cache[0] || (_cache[0] = ($event) => repeat2("Comfy.Canvas.ZoomIn")), onMouseup: stopRepeat }, null, 512), [ [ _directive_tooltip, unref(t)("graphCanvasMenu.zoomIn"), void 0, { left: true } ] ]), withDirectives(createVNode(unref(script$d), { severity: "secondary", icon: "pi pi-minus", onMousedown: _cache[1] || (_cache[1] = ($event) => repeat2("Comfy.Canvas.ZoomOut")), onMouseup: stopRepeat }, null, 512), [ [ _directive_tooltip, unref(t)("graphCanvasMenu.zoomOut"), void 0, { left: true } ] ]), withDirectives(createVNode(unref(script$d), { severity: "secondary", icon: "pi pi-expand", onClick: _cache[2] || (_cache[2] = () => unref(commandStore).execute("Comfy.Canvas.ResetView")) }, null, 512), [ [ _directive_tooltip, unref(t)("graphCanvasMenu.resetView"), void 0, { left: true } ] ]), withDirectives((openBlock(), createBlock(unref(script$d), { severity: "secondary", onClick: _cache[3] || (_cache[3] = () => unref(commandStore).execute("Comfy.Canvas.ToggleLock")) }, { icon: withCtx(() => [ unref(canvasStore).canvas?.read_only ? (openBlock(), createBlock(_component_i_material_symbols58pan_tool_outline, { key: 0 })) : (openBlock(), createBlock(_component_i_simple_line_icons58cursor, { key: 1 })) ]), _: 1 })), [ [ _directive_tooltip, unref(t)( "graphCanvasMenu." + (unref(canvasStore).canvas?.read_only ? "panMode" : "selectMode") ) + " (Space)", void 0, { left: true } ] ]), withDirectives(createVNode(unref(script$d), { severity: "secondary", icon: linkHidden.value ? "pi pi-eye-slash" : "pi pi-eye", onClick: _cache[4] || (_cache[4] = () => unref(commandStore).execute("Comfy.Canvas.ToggleLinkVisibility")), "data-testid": "toggle-link-visibility-button" }, null, 8, ["icon"]), [ [ _directive_tooltip, unref(t)("graphCanvasMenu.toggleLinkVisibility"), void 0, { left: true } ] ]) ]), _: 1 }); }; } }); const GraphCanvasMenu = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-444d3768"]]); const _sfc_main$a = /* @__PURE__ */ defineComponent({ __name: "GraphCanvas", emits: ["ready"], setup(__props, { emit: __emit }) { const emit = __emit; const canvasRef = ref(null); const settingStore = useSettingStore(); const nodeDefStore = useNodeDefStore(); const workspaceStore = useWorkspaceStore(); const canvasStore = useCanvasStore(); const modelToNodeStore = useModelToNodeStore(); const betaMenuEnabled = computed( () => settingStore.get("Comfy.UseNewMenu") !== "Disabled" ); const canvasMenuEnabled = computed( () => settingStore.get("Comfy.Graph.CanvasMenu") ); const tooltipEnabled = computed(() => settingStore.get("Comfy.EnableTooltips")); watchEffect(() => { const canvasInfoEnabled = settingStore.get("Comfy.Graph.CanvasInfo"); if (canvasStore.canvas) { canvasStore.canvas.show_info = canvasInfoEnabled; } }); watchEffect(() => { const zoomSpeed = settingStore.get("Comfy.Graph.ZoomSpeed"); if (canvasStore.canvas) { canvasStore.canvas.zoom_speed = zoomSpeed; } }); watchEffect(() => { nodeDefStore.showDeprecated = settingStore.get("Comfy.Node.ShowDeprecated"); }); watchEffect(() => { nodeDefStore.showExperimental = settingStore.get( "Comfy.Node.ShowExperimental" ); }); watchEffect(() => { const spellcheckEnabled = settingStore.get("Comfy.TextareaWidget.Spellcheck"); const textareas = document.querySelectorAll("textarea.comfy-multiline-input"); textareas.forEach((textarea) => { textarea.spellcheck = spellcheckEnabled; textarea.focus(); textarea.blur(); }); }); watchEffect(() => { if (!canvasStore.canvas) return; if (canvasStore.canvas.dragging_canvas) { canvasStore.canvas.canvas.style.cursor = "grabbing"; return; } if (canvasStore.canvas.read_only) { canvasStore.canvas.canvas.style.cursor = "grab"; return; } canvasStore.canvas.canvas.style.cursor = "default"; }); usePragmaticDroppable(() => canvasRef.value, { onDrop: /* @__PURE__ */ __name((event) => { const loc = event.location.current.input; const dndData = event.source.data; if (dndData.type === "tree-explorer-node") { const node = dndData.data; if (node.data instanceof ComfyNodeDefImpl) { const nodeDef = node.data; const pos = app.clientPosToCanvasPos([ loc.clientX - 20, loc.clientY ]); app.addNodeOnGraph(nodeDef, { pos }); } else if (node.data instanceof ComfyModelDef) { const model = node.data; const pos = app.clientPosToCanvasPos([loc.clientX, loc.clientY]); const nodeAtPos = app.graph.getNodeOnPos(pos[0], pos[1]); let targetProvider = null; let targetGraphNode = null; if (nodeAtPos) { const providers = modelToNodeStore.getAllNodeProviders( model.directory ); for (const provider of providers) { if (provider.nodeDef.name === nodeAtPos.comfyClass) { targetGraphNode = nodeAtPos; targetProvider = provider; } } } if (!targetGraphNode) { const provider = modelToNodeStore.getNodeProvider(model.directory); if (provider) { targetGraphNode = app.addNodeOnGraph(provider.nodeDef, { pos }); targetProvider = provider; } } if (targetGraphNode) { const widget = targetGraphNode.widgets.find( (widget2) => widget2.name === targetProvider.key ); if (widget) { widget.value = model.file_name; } } } } }, "onDrop") }); onMounted(async () => { window["LiteGraph"] = LiteGraph; window["LGraph"] = LGraph; window["LLink"] = LLink; window["LGraphNode"] = LGraphNode; window["LGraphGroup"] = LGraphGroup; window["DragAndScale"] = DragAndScale; window["LGraphCanvas"] = LGraphCanvas; window["ContextMenu"] = ContextMenu; window["LGraphBadge"] = LGraphBadge; app.vueAppReady = true; workspaceStore.spinner = true; await app.setup(canvasRef.value); canvasStore.canvas = app.canvas; workspaceStore.spinner = false; window["app"] = app; window["graph"] = app.graph; emit("ready"); }); return (_ctx, _cache) => { return openBlock(), createElementBlock(Fragment, null, [ (openBlock(), createBlock(Teleport, { to: ".graph-canvas-container" }, [ betaMenuEnabled.value ? (openBlock(), createBlock(LiteGraphCanvasSplitterOverlay, { key: 0 }, { "side-bar-panel": withCtx(() => [ createVNode(SideToolbar) ]), "graph-canvas-panel": withCtx(() => [ canvasMenuEnabled.value ? (openBlock(), createBlock(GraphCanvasMenu, { key: 0 })) : createCommentVNode("", true) ]), _: 1 })) : createCommentVNode("", true), createVNode(TitleEditor), !betaMenuEnabled.value && canvasMenuEnabled.value ? (openBlock(), createBlock(GraphCanvasMenu, { key: 1 })) : createCommentVNode("", true), createBaseVNode("canvas", { ref_key: "canvasRef", ref: canvasRef, id: "graph-canvas", tabindex: "1" }, null, 512) ])), createVNode(_sfc_main$d), tooltipEnabled.value ? (openBlock(), createBlock(NodeTooltip, { key: 0 })) : createCommentVNode("", true) ], 64); }; } }); function _typeof$3(o) { "@babel/helpers - typeof"; return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof$3(o); } __name(_typeof$3, "_typeof$3"); function _defineProperty$3(e, r, t) { return (r = _toPropertyKey$3(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; } __name(_defineProperty$3, "_defineProperty$3"); function _toPropertyKey$3(t) { var i = _toPrimitive$3(t, "string"); return "symbol" == _typeof$3(i) ? i : i + ""; } __name(_toPropertyKey$3, "_toPropertyKey$3"); function _toPrimitive$3(t, r) { if ("object" != _typeof$3(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$3(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } __name(_toPrimitive$3, "_toPrimitive$3"); var theme$4 = /* @__PURE__ */ __name(function theme5(_ref) { var dt = _ref.dt; return "\n.p-toast {\n width: ".concat(dt("toast.width"), ";\n white-space: pre-line;\n word-break: break-word;\n}\n\n.p-toast-message {\n margin: 0 0 1rem 0;\n}\n\n.p-toast-message-icon {\n flex-shrink: 0;\n font-size: ").concat(dt("toast.icon.size"), ";\n width: ").concat(dt("toast.icon.size"), ";\n height: ").concat(dt("toast.icon.size"), ";\n}\n\n.p-toast-message-content {\n display: flex;\n align-items: flex-start;\n padding: ").concat(dt("toast.content.padding"), ";\n gap: ").concat(dt("toast.content.gap"), ";\n}\n\n.p-toast-message-text {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n gap: ").concat(dt("toast.text.gap"), ";\n}\n\n.p-toast-summary {\n font-weight: ").concat(dt("toast.summary.font.weight"), ";\n font-size: ").concat(dt("toast.summary.font.size"), ";\n}\n\n.p-toast-detail {\n font-weight: ").concat(dt("toast.detail.font.weight"), ";\n font-size: ").concat(dt("toast.detail.font.size"), ";\n}\n\n.p-toast-close-button {\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n position: relative;\n cursor: pointer;\n background: transparent;\n transition: background ").concat(dt("toast.transition.duration"), ", color ").concat(dt("toast.transition.duration"), ", outline-color ").concat(dt("toast.transition.duration"), ", box-shadow ").concat(dt("toast.transition.duration"), ";\n outline-color: transparent;\n color: inherit;\n width: ").concat(dt("toast.close.button.width"), ";\n height: ").concat(dt("toast.close.button.height"), ";\n border-radius: ").concat(dt("toast.close.button.border.radius"), ";\n margin: -25% 0 0 0;\n right: -25%;\n padding: 0;\n border: none;\n user-select: none;\n}\n\n.p-toast-message-info,\n.p-toast-message-success,\n.p-toast-message-warn,\n.p-toast-message-error,\n.p-toast-message-secondary,\n.p-toast-message-contrast {\n border-width: ").concat(dt("toast.border.width"), ";\n border-style: solid;\n backdrop-filter: blur(").concat(dt("toast.blur"), ");\n border-radius: ").concat(dt("toast.border.radius"), ";\n}\n\n.p-toast-close-icon {\n font-size: ").concat(dt("toast.close.icon.size"), ";\n width: ").concat(dt("toast.close.icon.size"), ";\n height: ").concat(dt("toast.close.icon.size"), ";\n}\n\n.p-toast-close-button:focus-visible {\n outline-width: ").concat(dt("focus.ring.width"), ";\n outline-style: ").concat(dt("focus.ring.style"), ";\n outline-offset: ").concat(dt("focus.ring.offset"), ";\n}\n\n.p-toast-message-info {\n background: ").concat(dt("toast.info.background"), ";\n border-color: ").concat(dt("toast.info.border.color"), ";\n color: ").concat(dt("toast.info.color"), ";\n box-shadow: ").concat(dt("toast.info.shadow"), ";\n}\n\n.p-toast-message-info .p-toast-detail {\n color: ").concat(dt("toast.info.detail.color"), ";\n}\n\n.p-toast-message-info .p-toast-close-button:focus-visible {\n outline-color: ").concat(dt("toast.info.close.button.focus.ring.color"), ";\n box-shadow: ").concat(dt("toast.info.close.button.focus.ring.shadow"), ";\n}\n\n.p-toast-message-info .p-toast-close-button:hover {\n background: ").concat(dt("toast.info.close.button.hover.background"), ";\n}\n\n.p-toast-message-success {\n background: ").concat(dt("toast.success.background"), ";\n border-color: ").concat(dt("toast.success.border.color"), ";\n color: ").concat(dt("toast.success.color"), ";\n box-shadow: ").concat(dt("toast.success.shadow"), ";\n}\n\n.p-toast-message-success .p-toast-detail {\n color: ").concat(dt("toast.success.detail.color"), ";\n}\n\n.p-toast-message-success .p-toast-close-button:focus-visible {\n outline-color: ").concat(dt("toast.success.close.button.focus.ring.color"), ";\n box-shadow: ").concat(dt("toast.success.close.button.focus.ring.shadow"), ";\n}\n\n.p-toast-message-success .p-toast-close-button:hover {\n background: ").concat(dt("toast.success.close.button.hover.background"), ";\n}\n\n.p-toast-message-warn {\n background: ").concat(dt("toast.warn.background"), ";\n border-color: ").concat(dt("toast.warn.border.color"), ";\n color: ").concat(dt("toast.warn.color"), ";\n box-shadow: ").concat(dt("toast.warn.shadow"), ";\n}\n\n.p-toast-message-warn .p-toast-detail {\n color: ").concat(dt("toast.warn.detail.color"), ";\n}\n\n.p-toast-message-warn .p-toast-close-button:focus-visible {\n outline-color: ").concat(dt("toast.warn.close.button.focus.ring.color"), ";\n box-shadow: ").concat(dt("toast.warn.close.button.focus.ring.shadow"), ";\n}\n\n.p-toast-message-warn .p-toast-close-button:hover {\n background: ").concat(dt("toast.warn.close.button.hover.background"), ";\n}\n\n.p-toast-message-error {\n background: ").concat(dt("toast.error.background"), ";\n border-color: ").concat(dt("toast.error.border.color"), ";\n color: ").concat(dt("toast.error.color"), ";\n box-shadow: ").concat(dt("toast.error.shadow"), ";\n}\n\n.p-toast-message-error .p-toast-detail {\n color: ").concat(dt("toast.error.detail.color"), ";\n}\n\n.p-toast-message-error .p-toast-close-button:focus-visible {\n outline-color: ").concat(dt("toast.error.close.button.focus.ring.color"), ";\n box-shadow: ").concat(dt("toast.error.close.button.focus.ring.shadow"), ";\n}\n\n.p-toast-message-error .p-toast-close-button:hover {\n background: ").concat(dt("toast.error.close.button.hover.background"), ";\n}\n\n.p-toast-message-secondary {\n background: ").concat(dt("toast.secondary.background"), ";\n border-color: ").concat(dt("toast.secondary.border.color"), ";\n color: ").concat(dt("toast.secondary.color"), ";\n box-shadow: ").concat(dt("toast.secondary.shadow"), ";\n}\n\n.p-toast-message-secondary .p-toast-detail {\n color: ").concat(dt("toast.secondary.detail.color"), ";\n}\n\n.p-toast-message-secondary .p-toast-close-button:focus-visible {\n outline-color: ").concat(dt("toast.secondary.close.button.focus.ring.color"), ";\n box-shadow: ").concat(dt("toast.secondary.close.button.focus.ring.shadow"), ";\n}\n\n.p-toast-message-secondary .p-toast-close-button:hover {\n background: ").concat(dt("toast.secondary.close.button.hover.background"), ";\n}\n\n.p-toast-message-contrast {\n background: ").concat(dt("toast.contrast.background"), ";\n border-color: ").concat(dt("toast.contrast.border.color"), ";\n color: ").concat(dt("toast.contrast.color"), ";\n box-shadow: ").concat(dt("toast.contrast.shadow"), ";\n}\n\n.p-toast-message-contrast .p-toast-detail {\n color: ").concat(dt("toast.contrast.detail.color"), ";\n}\n\n.p-toast-message-contrast .p-toast-close-button:focus-visible {\n outline-color: ").concat(dt("toast.contrast.close.button.focus.ring.color"), ";\n box-shadow: ").concat(dt("toast.contrast.close.button.focus.ring.shadow"), ";\n}\n\n.p-toast-message-contrast .p-toast-close-button:hover {\n background: ").concat(dt("toast.contrast.close.button.hover.background"), ";\n}\n\n.p-toast-top-center {\n transform: translateX(-50%);\n}\n\n.p-toast-bottom-center {\n transform: translateX(-50%);\n}\n\n.p-toast-center {\n min-width: 20vw;\n transform: translate(-50%, -50%);\n}\n\n.p-toast-message-enter-from {\n opacity: 0;\n transform: translateY(50%);\n}\n\n.p-toast-message-leave-from {\n max-height: 1000px;\n}\n\n.p-toast .p-toast-message.p-toast-message-leave-to {\n max-height: 0;\n opacity: 0;\n margin-bottom: 0;\n overflow: hidden;\n}\n\n.p-toast-message-enter-active {\n transition: transform 0.3s, opacity 0.3s;\n}\n\n.p-toast-message-leave-active {\n transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;\n}\n"); }, "theme"); var inlineStyles$2 = { root: /* @__PURE__ */ __name(function root5(_ref2) { var position = _ref2.position; return { position: "fixed", top: position === "top-right" || position === "top-left" || position === "top-center" ? "20px" : position === "center" ? "50%" : null, right: (position === "top-right" || position === "bottom-right") && "20px", bottom: (position === "bottom-left" || position === "bottom-right" || position === "bottom-center") && "20px", left: position === "top-left" || position === "bottom-left" ? "20px" : position === "center" || position === "top-center" || position === "bottom-center" ? "50%" : null }; }, "root") }; var classes$4 = { root: /* @__PURE__ */ __name(function root6(_ref3) { var props = _ref3.props; return ["p-toast p-component p-toast-" + props.position]; }, "root"), message: /* @__PURE__ */ __name(function message(_ref4) { var props = _ref4.props; return ["p-toast-message", { "p-toast-message-info": props.message.severity === "info" || props.message.severity === void 0, "p-toast-message-warn": props.message.severity === "warn", "p-toast-message-error": props.message.severity === "error", "p-toast-message-success": props.message.severity === "success", "p-toast-message-secondary": props.message.severity === "secondary", "p-toast-message-contrast": props.message.severity === "contrast" }]; }, "message"), messageContent: "p-toast-message-content", messageIcon: /* @__PURE__ */ __name(function messageIcon(_ref5) { var props = _ref5.props; return ["p-toast-message-icon", _defineProperty$3(_defineProperty$3(_defineProperty$3(_defineProperty$3({}, props.infoIcon, props.message.severity === "info"), props.warnIcon, props.message.severity === "warn"), props.errorIcon, props.message.severity === "error"), props.successIcon, props.message.severity === "success")]; }, "messageIcon"), messageText: "p-toast-message-text", summary: "p-toast-summary", detail: "p-toast-detail", closeButton: "p-toast-close-button", closeIcon: "p-toast-close-icon" }; var ToastStyle = BaseStyle.extend({ name: "toast", theme: theme$4, classes: classes$4, inlineStyles: inlineStyles$2 }); var script$2$2 = { name: "BaseToast", "extends": script$e, props: { group: { type: String, "default": null }, position: { type: String, "default": "top-right" }, autoZIndex: { type: Boolean, "default": true }, baseZIndex: { type: Number, "default": 0 }, breakpoints: { type: Object, "default": null }, closeIcon: { type: String, "default": void 0 }, infoIcon: { type: String, "default": void 0 }, warnIcon: { type: String, "default": void 0 }, errorIcon: { type: String, "default": void 0 }, successIcon: { type: String, "default": void 0 }, closeButtonProps: { type: null, "default": null } }, style: ToastStyle, provide: /* @__PURE__ */ __name(function provide7() { return { $pcToast: this, $parentInstance: this }; }, "provide") }; var script$1$4 = { name: "ToastMessage", hostName: "Toast", "extends": script$e, emits: ["close"], closeTimeout: null, props: { message: { type: null, "default": null }, templates: { type: Object, "default": null }, closeIcon: { type: String, "default": null }, infoIcon: { type: String, "default": null }, warnIcon: { type: String, "default": null }, errorIcon: { type: String, "default": null }, successIcon: { type: String, "default": null }, closeButtonProps: { type: null, "default": null } }, mounted: /* @__PURE__ */ __name(function mounted3() { var _this = this; if (this.message.life) { this.closeTimeout = setTimeout(function() { _this.close({ message: _this.message, type: "life-end" }); }, this.message.life); } }, "mounted"), beforeUnmount: /* @__PURE__ */ __name(function beforeUnmount3() { this.clearCloseTimeout(); }, "beforeUnmount"), methods: { close: /* @__PURE__ */ __name(function close(params) { this.$emit("close", params); }, "close"), onCloseClick: /* @__PURE__ */ __name(function onCloseClick() { this.clearCloseTimeout(); this.close({ message: this.message, type: "close" }); }, "onCloseClick"), clearCloseTimeout: /* @__PURE__ */ __name(function clearCloseTimeout() { if (this.closeTimeout) { clearTimeout(this.closeTimeout); this.closeTimeout = null; } }, "clearCloseTimeout") }, computed: { iconComponent: /* @__PURE__ */ __name(function iconComponent() { return { info: !this.infoIcon && script$n, success: !this.successIcon && script$o, warn: !this.warnIcon && script$p, error: !this.errorIcon && script$q }[this.message.severity]; }, "iconComponent"), closeAriaLabel: /* @__PURE__ */ __name(function closeAriaLabel() { return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : void 0; }, "closeAriaLabel") }, components: { TimesIcon: script$r, InfoCircleIcon: script$n, CheckIcon: script$o, ExclamationTriangleIcon: script$p, TimesCircleIcon: script$q }, directives: { ripple: Ripple } }; function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof$1(o); } __name(_typeof$1, "_typeof$1"); function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function(r2) { return Object.getOwnPropertyDescriptor(e, r2).enumerable; })), t.push.apply(t, o); } return t; } __name(ownKeys$1, "ownKeys$1"); function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function(r2) { _defineProperty$1(e, r2, t[r2]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function(r2) { Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2)); }); } return e; } __name(_objectSpread$1, "_objectSpread$1"); function _defineProperty$1(e, r, t) { return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; } __name(_defineProperty$1, "_defineProperty$1"); function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$1(i) ? i : i + ""; } __name(_toPropertyKey$1, "_toPropertyKey$1"); function _toPrimitive$1(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } __name(_toPrimitive$1, "_toPrimitive$1"); var _hoisted_1$9 = ["aria-label"]; function render$1$2(_ctx, _cache, $props, $setup, $data, $options) { var _directive_ripple = resolveDirective("ripple"); return openBlock(), createElementBlock("div", mergeProps({ "class": [_ctx.cx("message"), $props.message.styleClass], role: "alert", "aria-live": "assertive", "aria-atomic": "true" }, _ctx.ptm("message")), [$props.templates.container ? (openBlock(), createBlock(resolveDynamicComponent($props.templates.container), { key: 0, message: $props.message, closeCallback: $options.onCloseClick }, null, 8, ["message", "closeCallback"])) : (openBlock(), createElementBlock("div", mergeProps({ key: 1, "class": [_ctx.cx("messageContent"), $props.message.contentStyleClass] }, _ctx.ptm("messageContent")), [!$props.templates.message ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [(openBlock(), createBlock(resolveDynamicComponent($props.templates.messageicon ? $props.templates.messageicon : $props.templates.icon ? $props.templates.icon : $options.iconComponent && $options.iconComponent.name ? $options.iconComponent : "span"), mergeProps({ "class": _ctx.cx("messageIcon") }, _ctx.ptm("messageIcon")), null, 16, ["class"])), createBaseVNode("div", mergeProps({ "class": _ctx.cx("messageText") }, _ctx.ptm("messageText")), [createBaseVNode("span", mergeProps({ "class": _ctx.cx("summary") }, _ctx.ptm("summary")), toDisplayString($props.message.summary), 17), createBaseVNode("div", mergeProps({ "class": _ctx.cx("detail") }, _ctx.ptm("detail")), toDisplayString($props.message.detail), 17)], 16)], 64)) : (openBlock(), createBlock(resolveDynamicComponent($props.templates.message), { key: 1, message: $props.message }, null, 8, ["message"])), $props.message.closable !== false ? (openBlock(), createElementBlock("div", normalizeProps(mergeProps({ key: 2 }, _ctx.ptm("buttonContainer"))), [withDirectives((openBlock(), createElementBlock("button", mergeProps({ "class": _ctx.cx("closeButton"), type: "button", "aria-label": $options.closeAriaLabel, onClick: _cache[0] || (_cache[0] = function() { return $options.onCloseClick && $options.onCloseClick.apply($options, arguments); }), autofocus: "" }, _objectSpread$1(_objectSpread$1({}, $props.closeButtonProps), _ctx.ptm("closeButton"))), [(openBlock(), createBlock(resolveDynamicComponent($props.templates.closeicon || "TimesIcon"), mergeProps({ "class": [_ctx.cx("closeIcon"), $props.closeIcon] }, _ctx.ptm("closeIcon")), null, 16, ["class"]))], 16, _hoisted_1$9)), [[_directive_ripple]])], 16)) : createCommentVNode("", true)], 16))], 16); } __name(render$1$2, "render$1$2"); script$1$4.render = render$1$2; function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); } __name(_toConsumableArray, "_toConsumableArray"); function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } __name(_nonIterableSpread, "_nonIterableSpread"); function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } } __name(_unsupportedIterableToArray, "_unsupportedIterableToArray"); function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); } __name(_iterableToArray, "_iterableToArray"); function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); } __name(_arrayWithoutHoles, "_arrayWithoutHoles"); function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } __name(_arrayLikeToArray, "_arrayLikeToArray"); var messageIdx = 0; var script$6 = { name: "Toast", "extends": script$2$2, inheritAttrs: false, emits: ["close", "life-end"], data: /* @__PURE__ */ __name(function data4() { return { messages: [] }; }, "data"), styleElement: null, mounted: /* @__PURE__ */ __name(function mounted4() { ToastEventBus.on("add", this.onAdd); ToastEventBus.on("remove", this.onRemove); ToastEventBus.on("remove-group", this.onRemoveGroup); ToastEventBus.on("remove-all-groups", this.onRemoveAllGroups); if (this.breakpoints) { this.createStyle(); } }, "mounted"), beforeUnmount: /* @__PURE__ */ __name(function beforeUnmount4() { this.destroyStyle(); if (this.$refs.container && this.autoZIndex) { ZIndex.clear(this.$refs.container); } ToastEventBus.off("add", this.onAdd); ToastEventBus.off("remove", this.onRemove); ToastEventBus.off("remove-group", this.onRemoveGroup); ToastEventBus.off("remove-all-groups", this.onRemoveAllGroups); }, "beforeUnmount"), methods: { add: /* @__PURE__ */ __name(function add(message2) { if (message2.id == null) { message2.id = messageIdx++; } this.messages = [].concat(_toConsumableArray(this.messages), [message2]); }, "add"), remove: /* @__PURE__ */ __name(function remove(params) { var index = this.messages.findIndex(function(m) { return m.id === params.message.id; }); if (index !== -1) { this.messages.splice(index, 1); this.$emit(params.type, { message: params.message }); } }, "remove"), onAdd: /* @__PURE__ */ __name(function onAdd(message2) { if (this.group == message2.group) { this.add(message2); } }, "onAdd"), onRemove: /* @__PURE__ */ __name(function onRemove(message2) { this.remove({ message: message2, type: "close" }); }, "onRemove"), onRemoveGroup: /* @__PURE__ */ __name(function onRemoveGroup(group) { if (this.group === group) { this.messages = []; } }, "onRemoveGroup"), onRemoveAllGroups: /* @__PURE__ */ __name(function onRemoveAllGroups() { this.messages = []; }, "onRemoveAllGroups"), onEnter: /* @__PURE__ */ __name(function onEnter() { this.$refs.container.setAttribute(this.attributeSelector, ""); if (this.autoZIndex) { ZIndex.set("modal", this.$refs.container, this.baseZIndex || this.$primevue.config.zIndex.modal); } }, "onEnter"), onLeave: /* @__PURE__ */ __name(function onLeave() { var _this = this; if (this.$refs.container && this.autoZIndex && isEmpty(this.messages)) { setTimeout(function() { ZIndex.clear(_this.$refs.container); }, 200); } }, "onLeave"), createStyle: /* @__PURE__ */ __name(function createStyle() { if (!this.styleElement && !this.isUnstyled) { var _this$$primevue; this.styleElement = document.createElement("style"); this.styleElement.type = "text/css"; setAttribute(this.styleElement, "nonce", (_this$$primevue = this.$primevue) === null || _this$$primevue === void 0 || (_this$$primevue = _this$$primevue.config) === null || _this$$primevue === void 0 || (_this$$primevue = _this$$primevue.csp) === null || _this$$primevue === void 0 ? void 0 : _this$$primevue.nonce); document.head.appendChild(this.styleElement); var innerHTML = ""; for (var breakpoint in this.breakpoints) { var breakpointStyle = ""; for (var styleProp in this.breakpoints[breakpoint]) { breakpointStyle += styleProp + ":" + this.breakpoints[breakpoint][styleProp] + "!important;"; } innerHTML += "\n @media screen and (max-width: ".concat(breakpoint, ") {\n .p-toast[").concat(this.attributeSelector, "] {\n ").concat(breakpointStyle, "\n }\n }\n "); } this.styleElement.innerHTML = innerHTML; } }, "createStyle"), destroyStyle: /* @__PURE__ */ __name(function destroyStyle() { if (this.styleElement) { document.head.removeChild(this.styleElement); this.styleElement = null; } }, "destroyStyle") }, computed: { attributeSelector: /* @__PURE__ */ __name(function attributeSelector() { return UniqueComponentId(); }, "attributeSelector") }, components: { ToastMessage: script$1$4, Portal: script$h } }; function _typeof$2(o) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof$2(o); } __name(_typeof$2, "_typeof$2"); function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function(r2) { return Object.getOwnPropertyDescriptor(e, r2).enumerable; })), t.push.apply(t, o); } return t; } __name(ownKeys$2, "ownKeys$2"); function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function(r2) { _defineProperty$2(e, r2, t[r2]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function(r2) { Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2)); }); } return e; } __name(_objectSpread$2, "_objectSpread$2"); function _defineProperty$2(e, r, t) { return (r = _toPropertyKey$2(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; } __name(_defineProperty$2, "_defineProperty$2"); function _toPropertyKey$2(t) { var i = _toPrimitive$2(t, "string"); return "symbol" == _typeof$2(i) ? i : i + ""; } __name(_toPropertyKey$2, "_toPropertyKey$2"); function _toPrimitive$2(t, r) { if ("object" != _typeof$2(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$2(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } __name(_toPrimitive$2, "_toPrimitive$2"); function render$6(_ctx, _cache, $props, $setup, $data, $options) { var _component_ToastMessage = resolveComponent("ToastMessage"); var _component_Portal = resolveComponent("Portal"); return openBlock(), createBlock(_component_Portal, null, { "default": withCtx(function() { return [createBaseVNode("div", mergeProps({ ref: "container", "class": _ctx.cx("root"), style: _ctx.sx("root", true, { position: _ctx.position }) }, _ctx.ptmi("root")), [createVNode(TransitionGroup, mergeProps({ name: "p-toast-message", tag: "div", onEnter: $options.onEnter, onLeave: $options.onLeave }, _objectSpread$2({}, _ctx.ptm("transition"))), { "default": withCtx(function() { return [(openBlock(true), createElementBlock(Fragment, null, renderList($data.messages, function(msg) { return openBlock(), createBlock(_component_ToastMessage, { key: msg.id, message: msg, templates: _ctx.$slots, closeIcon: _ctx.closeIcon, infoIcon: _ctx.infoIcon, warnIcon: _ctx.warnIcon, errorIcon: _ctx.errorIcon, successIcon: _ctx.successIcon, closeButtonProps: _ctx.closeButtonProps, unstyled: _ctx.unstyled, onClose: _cache[0] || (_cache[0] = function($event) { return $options.remove($event); }), pt: _ctx.pt }, null, 8, ["message", "templates", "closeIcon", "infoIcon", "warnIcon", "errorIcon", "successIcon", "closeButtonProps", "unstyled", "pt"]); }), 128))]; }), _: 1 }, 16, ["onEnter", "onLeave"])], 16)]; }), _: 1 }); } __name(render$6, "render$6"); script$6.render = render$6; const _sfc_main$9 = /* @__PURE__ */ defineComponent({ __name: "GlobalToast", setup(__props) { const toast = useToast(); const toastStore = useToastStore(); const settingStore = useSettingStore(); watch( () => toastStore.messagesToAdd, (newMessages) => { if (newMessages.length === 0) { return; } newMessages.forEach((message2) => { toast.add(message2); }); toastStore.messagesToAdd = []; }, { deep: true } ); watch( () => toastStore.messagesToRemove, (messagesToRemove) => { if (messagesToRemove.length === 0) { return; } messagesToRemove.forEach((message2) => { toast.remove(message2); }); toastStore.messagesToRemove = []; }, { deep: true } ); watch( () => toastStore.removeAllRequested, (requested) => { if (requested) { toast.removeAllGroups(); toastStore.removeAllRequested = false; } } ); function updateToastPosition() { const styleElement = document.getElementById("dynamic-toast-style") || createStyleElement(); const rect = document.querySelector(".graph-canvas-container").getBoundingClientRect(); styleElement.textContent = ` .p-toast.p-component.p-toast-top-right { top: ${rect.top + 20}px !important; right: ${window.innerWidth - (rect.left + rect.width) + 20}px !important; } `; } __name(updateToastPosition, "updateToastPosition"); function createStyleElement() { const style = document.createElement("style"); style.id = "dynamic-toast-style"; document.head.appendChild(style); return style; } __name(createStyleElement, "createStyleElement"); watch( () => settingStore.get("Comfy.UseNewMenu"), () => nextTick(updateToastPosition), { immediate: true } ); watch( () => settingStore.get("Comfy.Sidebar.Location"), () => nextTick(updateToastPosition), { immediate: true } ); return (_ctx, _cache) => { return openBlock(), createBlock(unref(script$6)); }; } }); const _sfc_main$8 = /* @__PURE__ */ defineComponent({ __name: "UnloadWindowConfirmDialog", setup(__props) { const settingStore = useSettingStore(); const handleBeforeUnload = /* @__PURE__ */ __name((event) => { if (settingStore.get("Comfy.Window.UnloadConfirmation")) { event.preventDefault(); return true; } return void 0; }, "handleBeforeUnload"); onMounted(() => { window.addEventListener("beforeunload", handleBeforeUnload); }); onBeforeUnmount(() => { window.removeEventListener("beforeunload", handleBeforeUnload); }); return (_ctx, _cache) => { return openBlock(), createElementBlock("div"); }; } }); const DEFAULT_TITLE = "ComfyUI"; const TITLE_SUFFIX = " - ComfyUI"; const _sfc_main$7 = /* @__PURE__ */ defineComponent({ __name: "BrowserTabTitle", setup(__props) { const executionStore = useExecutionStore(); const executionText = computed( () => executionStore.isIdle ? "" : `[${executionStore.executionProgress}%]` ); const settingStore = useSettingStore(); const betaMenuEnabled = computed( () => settingStore.get("Comfy.UseNewMenu") !== "Disabled" ); const workflowStore = useWorkflowStore(); const isUnsavedText = computed( () => workflowStore.activeWorkflow?.unsaved ? " *" : "" ); const workflowNameText = computed(() => { const workflowName = workflowStore.activeWorkflow?.name; return workflowName ? isUnsavedText.value + workflowName + TITLE_SUFFIX : DEFAULT_TITLE; }); const nodeExecutionTitle = computed( () => executionStore.executingNode && executionStore.executingNodeProgress ? `${executionText.value}[${executionStore.executingNodeProgress}%] ${executionStore.executingNode.type}` : "" ); const workflowTitle = computed( () => executionText.value + (betaMenuEnabled.value ? workflowNameText.value : DEFAULT_TITLE) ); const title = computed(() => nodeExecutionTitle.value || workflowTitle.value); useTitle(title); return (_ctx, _cache) => { return openBlock(), createElementBlock("div"); }; } }); const _withScopeId$3 = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-84e785b8"), n = n(), popScopeId(), n), "_withScopeId$3"); const _hoisted_1$8 = { class: "workflow-label text-sm max-w-[150px] truncate inline-block" }; const _hoisted_2$6 = { class: "relative" }; const _hoisted_3$4 = { key: 0, class: "status-indicator" }; const _sfc_main$6 = /* @__PURE__ */ defineComponent({ __name: "WorkflowTabs", props: { class: {} }, setup(__props) { const props = __props; const workflowStore = useWorkflowStore(); const workflowToOption = /* @__PURE__ */ __name((workflow) => ({ label: workflow.name, tooltip: workflow.path, value: workflow.key, unsaved: workflow.unsaved }), "workflowToOption"); const optionToWorkflow = /* @__PURE__ */ __name((option2) => workflowStore.workflowLookup[option2.value], "optionToWorkflow"); const options = computed( () => workflowStore.openWorkflows.map(workflowToOption) ); const selectedWorkflow = computed( () => workflowStore.activeWorkflow ? workflowToOption(workflowStore.activeWorkflow) : null ); const onWorkflowChange = /* @__PURE__ */ __name((option2) => { if (!option2) { return; } if (selectedWorkflow.value?.value === option2.value) { return; } const workflow = optionToWorkflow(option2); workflow.load(); }, "onWorkflowChange"); const onCloseWorkflow = /* @__PURE__ */ __name((option2) => { const workflow = optionToWorkflow(option2); app.workflowManager.closeWorkflow(workflow); }, "onCloseWorkflow"); return (_ctx, _cache) => { const _directive_tooltip = resolveDirective("tooltip"); return openBlock(), createBlock(unref(script$s), { class: normalizeClass(["workflow-tabs bg-transparent flex flex-wrap", props.class]), modelValue: selectedWorkflow.value, "onUpdate:modelValue": onWorkflowChange, options: options.value, optionLabel: "label", dataKey: "value" }, { option: withCtx(({ option: option2 }) => [ withDirectives((openBlock(), createElementBlock("span", _hoisted_1$8, [ createTextVNode(toDisplayString(option2.label), 1) ])), [ [_directive_tooltip, option2.tooltip] ]), createBaseVNode("div", _hoisted_2$6, [ option2.unsaved ? (openBlock(), createElementBlock("span", _hoisted_3$4, "•")) : createCommentVNode("", true), createVNode(unref(script$d), { class: "close-button p-0 w-auto", icon: "pi pi-times", text: "", severity: "secondary", size: "small", onClick: withModifiers(($event) => onCloseWorkflow(option2), ["stop"]) }, null, 8, ["onClick"]) ]) ]), _: 1 }, 8, ["class", "modelValue", "options"]); }; } }); const WorkflowTabs = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-84e785b8"]]); var theme$3 = /* @__PURE__ */ __name(function theme6(_ref) { var dt = _ref.dt; return "\n.p-menubar {\n display: flex;\n align-items: center;\n background: ".concat(dt("menubar.background"), ";\n border: 1px solid ").concat(dt("menubar.border.color"), ";\n border-radius: ").concat(dt("menubar.border.radius"), ";\n color: ").concat(dt("menubar.color"), ";\n padding: ").concat(dt("menubar.padding"), ";\n gap: ").concat(dt("menubar.gap"), ";\n}\n\n.p-menubar-start,\n.p-megamenu-end {\n display: flex;\n align-items: center;\n}\n\n.p-menubar-root-list,\n.p-menubar-submenu {\n display: flex;\n margin: 0;\n padding: 0;\n list-style: none;\n outline: 0 none;\n}\n\n.p-menubar-root-list {\n align-items: center;\n flex-wrap: wrap;\n gap: ").concat(dt("menubar.gap"), ";\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content {\n border-radius: ").concat(dt("menubar.base.item.border.radius"), ";\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n padding: ").concat(dt("menubar.base.item.padding"), ";\n}\n\n.p-menubar-item-content {\n transition: background ").concat(dt("menubar.transition.duration"), ", color ").concat(dt("menubar.transition.duration"), ";\n border-radius: ").concat(dt("menubar.item.border.radius"), ";\n color: ").concat(dt("menubar.item.color"), ";\n}\n\n.p-menubar-item-link {\n cursor: pointer;\n display: flex;\n align-items: center;\n text-decoration: none;\n overflow: hidden;\n position: relative;\n color: inherit;\n padding: ").concat(dt("menubar.item.padding"), ";\n gap: ").concat(dt("menubar.item.gap"), ";\n user-select: none;\n outline: 0 none;\n}\n\n.p-menubar-item-label {\n line-height: 1;\n}\n\n.p-menubar-item-icon {\n color: ").concat(dt("menubar.item.icon.color"), ";\n}\n\n.p-menubar-submenu-icon {\n color: ").concat(dt("menubar.submenu.icon.color"), ";\n margin-left: auto;\n font-size: ").concat(dt("menubar.submenu.icon.size"), ";\n width: ").concat(dt("menubar.submenu.icon.size"), ";\n height: ").concat(dt("menubar.submenu.icon.size"), ";\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content {\n color: ").concat(dt("menubar.item.focus.color"), ";\n background: ").concat(dt("menubar.item.focus.background"), ";\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-item-icon {\n color: ").concat(dt("menubar.item.icon.focus.color"), ";\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-submenu-icon {\n color: ").concat(dt("menubar.submenu.icon.focus.color"), ";\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover {\n color: ").concat(dt("menubar.item.focus.color"), ";\n background: ").concat(dt("menubar.item.focus.background"), ";\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-item-icon {\n color: ").concat(dt("menubar.item.icon.focus.color"), ";\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-submenu-icon {\n color: ").concat(dt("menubar.submenu.icon.focus.color"), ";\n}\n\n.p-menubar-item-active > .p-menubar-item-content {\n color: ").concat(dt("menubar.item.active.color"), ";\n background: ").concat(dt("menubar.item.active.background"), ";\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-item-icon {\n color: ").concat(dt("menubar.item.icon.active.color"), ";\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n color: ").concat(dt("menubar.submenu.icon.active.color"), ";\n}\n\n.p-menubar-submenu {\n display: none;\n position: absolute;\n min-width: 12.5rem;\n z-index: 1;\n background: ").concat(dt("menubar.submenu.background"), ";\n border: 1px solid ").concat(dt("menubar.submenu.border.color"), ";\n border-radius: ").concat(dt("menubar.border.radius"), ";\n box-shadow: ").concat(dt("menubar.submenu.shadow"), ";\n color: ").concat(dt("menubar.submenu.color"), ";\n flex-direction: column;\n padding: ").concat(dt("menubar.submenu.padding"), ";\n gap: ").concat(dt("menubar.submenu.gap"), ";\n}\n\n.p-menubar-submenu .p-menubar-separator {\n border-top: 1px solid ").concat(dt("menubar.separator.border.color"), ";\n}\n\n.p-menubar-submenu .p-menubar-item {\n position: relative;\n}\n\n .p-menubar-submenu > .p-menubar-item-active > .p-menubar-submenu {\n display: block;\n left: 100%;\n top: 0;\n}\n\n.p-menubar-end {\n margin-left: auto;\n align-self: center;\n}\n\n.p-menubar-button {\n display: none;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n width: ").concat(dt("menubar.mobile.button.size"), ";\n height: ").concat(dt("menubar.mobile.button.size"), ";\n position: relative;\n color: ").concat(dt("menubar.mobile.button.color"), ";\n border: 0 none;\n background: transparent;\n border-radius: ").concat(dt("menubar.mobile.button.border.radius"), ";\n transition: background ").concat(dt("menubar.transition.duration"), ", color ").concat(dt("menubar.transition.duration"), ", outline-color ").concat(dt("menubar.transition.duration"), ";\n outline-color: transparent;\n}\n\n.p-menubar-button:hover {\n color: ").concat(dt("menubar.mobile.button.hover.color"), ";\n background: ").concat(dt("menubar.mobile.button.hover.background"), ";\n}\n\n.p-menubar-button:focus-visible {\n box-shadow: ").concat(dt("menubar.mobile.button.focus.ring.shadow"), ";\n outline: ").concat(dt("menubar.mobile.button.focus.ring.width"), " ").concat(dt("menubar.mobile.button.focus.ring.style"), " ").concat(dt("menubar.mobile.button.focus.ring.color"), ";\n outline-offset: ").concat(dt("menubar.mobile.button.focus.ring.offset"), ";\n}\n\n.p-menubar-mobile {\n position: relative;\n}\n\n.p-menubar-mobile .p-menubar-button {\n display: flex;\n}\n\n.p-menubar-mobile .p-menubar-root-list {\n position: absolute;\n display: none;\n width: 100%;\n padding: ").concat(dt("menubar.submenu.padding"), ";\n background: ").concat(dt("menubar.submenu.background"), ";\n border: 1px solid ").concat(dt("menubar.submenu.border.color"), ";\n box-shadow: ").concat(dt("menubar.submenu.shadow"), ";\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content {\n border-radius: ").concat(dt("menubar.item.border.radius"), ";\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n padding: ").concat(dt("menubar.item.padding"), ";\n}\n\n.p-menubar-mobile-active .p-menubar-root-list {\n display: flex;\n flex-direction: column;\n top: 100%;\n left: 0;\n z-index: 1;\n}\n\n.p-menubar-mobile .p-menubar-root-list .p-menubar-item {\n width: 100%;\n position: static;\n}\n\n.p-menubar-mobile .p-menubar-root-list .p-menubar-separator {\n border-top: 1px solid ").concat(dt("menubar.separator.border.color"), ";\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content .p-menubar-submenu-icon {\n margin-left: auto;\n transition: transform 0.2s;\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n transform: rotate(-180deg);\n}\n\n.p-menubar-mobile .p-menubar-submenu .p-menubar-submenu-icon {\n transition: transform 0.2s;\n transform: rotate(90deg);\n}\n\n.p-menubar-mobile .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n transform: rotate(-90deg);\n}\n\n.p-menubar-mobile .p-menubar-submenu {\n width: 100%;\n position: static;\n box-shadow: none;\n border: 0 none;\n padding-left: ").concat(dt("menubar.submenu.mobile.indent"), ";\n}\n"); }, "theme"); var inlineStyles$1 = { submenu: /* @__PURE__ */ __name(function submenu(_ref2) { var instance = _ref2.instance, processedItem = _ref2.processedItem; return { display: instance.isItemActive(processedItem) ? "flex" : "none" }; }, "submenu") }; var classes$3 = { root: /* @__PURE__ */ __name(function root7(_ref3) { var instance = _ref3.instance; return ["p-menubar p-component", { "p-menubar-mobile": instance.queryMatches, "p-menubar-mobile-active": instance.mobileActive }]; }, "root"), start: "p-menubar-start", button: "p-menubar-button", rootList: "p-menubar-root-list", item: /* @__PURE__ */ __name(function item(_ref4) { var instance = _ref4.instance, processedItem = _ref4.processedItem; return ["p-menubar-item", { "p-menubar-item-active": instance.isItemActive(processedItem), "p-focus": instance.isItemFocused(processedItem), "p-disabled": instance.isItemDisabled(processedItem) }]; }, "item"), itemContent: "p-menubar-item-content", itemLink: "p-menubar-item-link", itemIcon: "p-menubar-item-icon", itemLabel: "p-menubar-item-label", submenuIcon: "p-menubar-submenu-icon", submenu: "p-menubar-submenu", separator: "p-menubar-separator", end: "p-menubar-end" }; var MenubarStyle = BaseStyle.extend({ name: "menubar", theme: theme$3, classes: classes$3, inlineStyles: inlineStyles$1 }); var script$2$1 = { name: "BaseMenubar", "extends": script$e, props: { model: { type: Array, "default": null }, buttonProps: { type: null, "default": null }, breakpoint: { type: String, "default": "960px" }, ariaLabelledby: { type: String, "default": null }, ariaLabel: { type: String, "default": null } }, style: MenubarStyle, provide: /* @__PURE__ */ __name(function provide8() { return { $pcMenubar: this, $parentInstance: this }; }, "provide") }; var script$1$3 = { name: "MenubarSub", hostName: "Menubar", "extends": script$e, emits: ["item-mouseenter", "item-click", "item-mousemove"], props: { items: { type: Array, "default": null }, root: { type: Boolean, "default": false }, popup: { type: Boolean, "default": false }, mobileActive: { type: Boolean, "default": false }, templates: { type: Object, "default": null }, level: { type: Number, "default": 0 }, menuId: { type: String, "default": null }, focusedItemId: { type: String, "default": null }, activeItemPath: { type: Object, "default": null } }, list: null, methods: { getItemId: /* @__PURE__ */ __name(function getItemId(processedItem) { return "".concat(this.menuId, "_").concat(processedItem.key); }, "getItemId"), getItemKey: /* @__PURE__ */ __name(function getItemKey(processedItem) { return this.getItemId(processedItem); }, "getItemKey"), getItemProp: /* @__PURE__ */ __name(function getItemProp(processedItem, name, params) { return processedItem && processedItem.item ? resolve(processedItem.item[name], params) : void 0; }, "getItemProp"), getItemLabel: /* @__PURE__ */ __name(function getItemLabel(processedItem) { return this.getItemProp(processedItem, "label"); }, "getItemLabel"), getItemLabelId: /* @__PURE__ */ __name(function getItemLabelId(processedItem) { return "".concat(this.menuId, "_").concat(processedItem.key, "_label"); }, "getItemLabelId"), getPTOptions: /* @__PURE__ */ __name(function getPTOptions4(processedItem, index, key) { return this.ptm(key, { context: { item: processedItem.item, index, active: this.isItemActive(processedItem), focused: this.isItemFocused(processedItem), disabled: this.isItemDisabled(processedItem), level: this.level } }); }, "getPTOptions"), isItemActive: /* @__PURE__ */ __name(function isItemActive(processedItem) { return this.activeItemPath.some(function(path) { return path.key === processedItem.key; }); }, "isItemActive"), isItemVisible: /* @__PURE__ */ __name(function isItemVisible(processedItem) { return this.getItemProp(processedItem, "visible") !== false; }, "isItemVisible"), isItemDisabled: /* @__PURE__ */ __name(function isItemDisabled(processedItem) { return this.getItemProp(processedItem, "disabled"); }, "isItemDisabled"), isItemFocused: /* @__PURE__ */ __name(function isItemFocused(processedItem) { return this.focusedItemId === this.getItemId(processedItem); }, "isItemFocused"), isItemGroup: /* @__PURE__ */ __name(function isItemGroup(processedItem) { return isNotEmpty(processedItem.items); }, "isItemGroup"), onItemClick: /* @__PURE__ */ __name(function onItemClick(event, processedItem) { this.getItemProp(processedItem, "command", { originalEvent: event, item: processedItem.item }); this.$emit("item-click", { originalEvent: event, processedItem, isFocus: true }); }, "onItemClick"), onItemMouseEnter: /* @__PURE__ */ __name(function onItemMouseEnter(event, processedItem) { this.$emit("item-mouseenter", { originalEvent: event, processedItem }); }, "onItemMouseEnter"), onItemMouseMove: /* @__PURE__ */ __name(function onItemMouseMove(event, processedItem) { this.$emit("item-mousemove", { originalEvent: event, processedItem }); }, "onItemMouseMove"), getAriaPosInset: /* @__PURE__ */ __name(function getAriaPosInset2(index) { return index - this.calculateAriaSetSize.slice(0, index).length + 1; }, "getAriaPosInset"), getMenuItemProps: /* @__PURE__ */ __name(function getMenuItemProps(processedItem, index) { return { action: mergeProps({ "class": this.cx("itemLink"), tabindex: -1, "aria-hidden": true }, this.getPTOptions(processedItem, index, "itemLink")), icon: mergeProps({ "class": [this.cx("itemIcon"), this.getItemProp(processedItem, "icon")] }, this.getPTOptions(processedItem, index, "itemIcon")), label: mergeProps({ "class": this.cx("itemLabel") }, this.getPTOptions(processedItem, index, "itemLabel")), submenuicon: mergeProps({ "class": this.cx("submenuIcon") }, this.getPTOptions(processedItem, index, "submenuIcon")) }; }, "getMenuItemProps") }, computed: { calculateAriaSetSize: /* @__PURE__ */ __name(function calculateAriaSetSize() { var _this = this; return this.items.filter(function(processedItem) { return _this.isItemVisible(processedItem) && _this.getItemProp(processedItem, "separator"); }); }, "calculateAriaSetSize"), getAriaSetSize: /* @__PURE__ */ __name(function getAriaSetSize() { var _this2 = this; return this.items.filter(function(processedItem) { return _this2.isItemVisible(processedItem) && !_this2.getItemProp(processedItem, "separator"); }).length; }, "getAriaSetSize") }, components: { AngleRightIcon: script$t, AngleDownIcon: script$u }, directives: { ripple: Ripple } }; var _hoisted_1$1$2 = ["id", "aria-label", "aria-disabled", "aria-expanded", "aria-haspopup", "aria-level", "aria-setsize", "aria-posinset", "data-p-active", "data-p-focused", "data-p-disabled"]; var _hoisted_2$5 = ["onClick", "onMouseenter", "onMousemove"]; var _hoisted_3$3 = ["href", "target"]; var _hoisted_4$1 = ["id"]; var _hoisted_5$1 = ["id"]; function render$1$1(_ctx, _cache, $props, $setup, $data, $options) { var _component_MenubarSub = resolveComponent("MenubarSub", true); var _directive_ripple = resolveDirective("ripple"); return openBlock(), createElementBlock("ul", mergeProps({ "class": $props.level === 0 ? _ctx.cx("rootList") : _ctx.cx("submenu") }, $props.level === 0 ? _ctx.ptm("rootList") : _ctx.ptm("submenu")), [(openBlock(true), createElementBlock(Fragment, null, renderList($props.items, function(processedItem, index) { return openBlock(), createElementBlock(Fragment, { key: $options.getItemKey(processedItem) }, [$options.isItemVisible(processedItem) && !$options.getItemProp(processedItem, "separator") ? (openBlock(), createElementBlock("li", mergeProps({ key: 0, id: $options.getItemId(processedItem), style: $options.getItemProp(processedItem, "style"), "class": [_ctx.cx("item", { processedItem }), $options.getItemProp(processedItem, "class")], role: "menuitem", "aria-label": $options.getItemLabel(processedItem), "aria-disabled": $options.isItemDisabled(processedItem) || void 0, "aria-expanded": $options.isItemGroup(processedItem) ? $options.isItemActive(processedItem) : void 0, "aria-haspopup": $options.isItemGroup(processedItem) && !$options.getItemProp(processedItem, "to") ? "menu" : void 0, "aria-level": $props.level + 1, "aria-setsize": $options.getAriaSetSize, "aria-posinset": $options.getAriaPosInset(index), ref_for: true }, $options.getPTOptions(processedItem, index, "item"), { "data-p-active": $options.isItemActive(processedItem), "data-p-focused": $options.isItemFocused(processedItem), "data-p-disabled": $options.isItemDisabled(processedItem) }), [createBaseVNode("div", mergeProps({ "class": _ctx.cx("itemContent"), onClick: /* @__PURE__ */ __name(function onClick($event) { return $options.onItemClick($event, processedItem); }, "onClick"), onMouseenter: /* @__PURE__ */ __name(function onMouseenter($event) { return $options.onItemMouseEnter($event, processedItem); }, "onMouseenter"), onMousemove: /* @__PURE__ */ __name(function onMousemove($event) { return $options.onItemMouseMove($event, processedItem); }, "onMousemove"), ref_for: true }, $options.getPTOptions(processedItem, index, "itemContent")), [!$props.templates.item ? withDirectives((openBlock(), createElementBlock("a", mergeProps({ key: 0, href: $options.getItemProp(processedItem, "url"), "class": _ctx.cx("itemLink"), target: $options.getItemProp(processedItem, "target"), tabindex: "-1", ref_for: true }, $options.getPTOptions(processedItem, index, "itemLink")), [$props.templates.itemicon ? (openBlock(), createBlock(resolveDynamicComponent($props.templates.itemicon), { key: 0, item: processedItem.item, "class": normalizeClass(_ctx.cx("itemIcon")) }, null, 8, ["item", "class"])) : $options.getItemProp(processedItem, "icon") ? (openBlock(), createElementBlock("span", mergeProps({ key: 1, "class": [_ctx.cx("itemIcon"), $options.getItemProp(processedItem, "icon")], ref_for: true }, $options.getPTOptions(processedItem, index, "itemIcon")), null, 16)) : createCommentVNode("", true), createBaseVNode("span", mergeProps({ id: $options.getItemLabelId(processedItem), "class": _ctx.cx("itemLabel"), ref_for: true }, $options.getPTOptions(processedItem, index, "itemLabel")), toDisplayString($options.getItemLabel(processedItem)), 17, _hoisted_4$1), $options.getItemProp(processedItem, "items") ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [$props.templates.submenuicon ? (openBlock(), createBlock(resolveDynamicComponent($props.templates.submenuicon), { key: 0, root: $props.root, active: $options.isItemActive(processedItem), "class": normalizeClass(_ctx.cx("submenuIcon")) }, null, 8, ["root", "active", "class"])) : (openBlock(), createBlock(resolveDynamicComponent($props.root ? "AngleDownIcon" : "AngleRightIcon"), mergeProps({ key: 1, "class": _ctx.cx("submenuIcon"), ref_for: true }, $options.getPTOptions(processedItem, index, "submenuIcon")), null, 16, ["class"]))], 64)) : createCommentVNode("", true)], 16, _hoisted_3$3)), [[_directive_ripple]]) : (openBlock(), createBlock(resolveDynamicComponent($props.templates.item), { key: 1, item: processedItem.item, root: $props.root, hasSubmenu: $options.getItemProp(processedItem, "items"), label: $options.getItemLabel(processedItem), props: $options.getMenuItemProps(processedItem, index) }, null, 8, ["item", "root", "hasSubmenu", "label", "props"]))], 16, _hoisted_2$5), $options.isItemVisible(processedItem) && $options.isItemGroup(processedItem) ? (openBlock(), createBlock(_component_MenubarSub, { key: 0, id: $options.getItemId(processedItem) + "_list", menuId: $props.menuId, role: "menu", style: normalizeStyle(_ctx.sx("submenu", true, { processedItem })), focusedItemId: $props.focusedItemId, items: processedItem.items, mobileActive: $props.mobileActive, activeItemPath: $props.activeItemPath, templates: $props.templates, level: $props.level + 1, "aria-labelledby": $options.getItemLabelId(processedItem), pt: _ctx.pt, unstyled: _ctx.unstyled, onItemClick: _cache[0] || (_cache[0] = function($event) { return _ctx.$emit("item-click", $event); }), onItemMouseenter: _cache[1] || (_cache[1] = function($event) { return _ctx.$emit("item-mouseenter", $event); }), onItemMousemove: _cache[2] || (_cache[2] = function($event) { return _ctx.$emit("item-mousemove", $event); }) }, null, 8, ["id", "menuId", "style", "focusedItemId", "items", "mobileActive", "activeItemPath", "templates", "level", "aria-labelledby", "pt", "unstyled"])) : createCommentVNode("", true)], 16, _hoisted_1$1$2)) : createCommentVNode("", true), $options.isItemVisible(processedItem) && $options.getItemProp(processedItem, "separator") ? (openBlock(), createElementBlock("li", mergeProps({ key: 1, id: $options.getItemId(processedItem), "class": [_ctx.cx("separator"), $options.getItemProp(processedItem, "class")], style: $options.getItemProp(processedItem, "style"), role: "separator", ref_for: true }, _ctx.ptm("separator")), null, 16, _hoisted_5$1)) : createCommentVNode("", true)], 64); }), 128))], 16); } __name(render$1$1, "render$1$1"); script$1$3.render = render$1$1; var script$5 = { name: "Menubar", "extends": script$2$1, inheritAttrs: false, emits: ["focus", "blur"], matchMediaListener: null, data: /* @__PURE__ */ __name(function data5() { return { id: this.$attrs.id, mobileActive: false, focused: false, focusedItemInfo: { index: -1, level: 0, parentKey: "" }, activeItemPath: [], dirty: false, query: null, queryMatches: false }; }, "data"), watch: { "$attrs.id": /* @__PURE__ */ __name(function $attrsId2(newValue) { this.id = newValue || UniqueComponentId(); }, "$attrsId"), activeItemPath: /* @__PURE__ */ __name(function activeItemPath(newPath) { if (isNotEmpty(newPath)) { this.bindOutsideClickListener(); this.bindResizeListener(); } else { this.unbindOutsideClickListener(); this.unbindResizeListener(); } }, "activeItemPath") }, outsideClickListener: null, container: null, menubar: null, mounted: /* @__PURE__ */ __name(function mounted5() { this.id = this.id || UniqueComponentId(); this.bindMatchMediaListener(); }, "mounted"), beforeUnmount: /* @__PURE__ */ __name(function beforeUnmount5() { this.mobileActive = false; this.unbindOutsideClickListener(); this.unbindResizeListener(); this.unbindMatchMediaListener(); if (this.container) { ZIndex.clear(this.container); } this.container = null; }, "beforeUnmount"), methods: { getItemProp: /* @__PURE__ */ __name(function getItemProp2(item3, name) { return item3 ? resolve(item3[name]) : void 0; }, "getItemProp"), getItemLabel: /* @__PURE__ */ __name(function getItemLabel2(item3) { return this.getItemProp(item3, "label"); }, "getItemLabel"), isItemDisabled: /* @__PURE__ */ __name(function isItemDisabled2(item3) { return this.getItemProp(item3, "disabled"); }, "isItemDisabled"), isItemVisible: /* @__PURE__ */ __name(function isItemVisible2(item3) { return this.getItemProp(item3, "visible") !== false; }, "isItemVisible"), isItemGroup: /* @__PURE__ */ __name(function isItemGroup2(item3) { return isNotEmpty(this.getItemProp(item3, "items")); }, "isItemGroup"), isItemSeparator: /* @__PURE__ */ __name(function isItemSeparator(item3) { return this.getItemProp(item3, "separator"); }, "isItemSeparator"), getProccessedItemLabel: /* @__PURE__ */ __name(function getProccessedItemLabel(processedItem) { return processedItem ? this.getItemLabel(processedItem.item) : void 0; }, "getProccessedItemLabel"), isProccessedItemGroup: /* @__PURE__ */ __name(function isProccessedItemGroup(processedItem) { return processedItem && isNotEmpty(processedItem.items); }, "isProccessedItemGroup"), toggle: /* @__PURE__ */ __name(function toggle(event) { var _this = this; if (this.mobileActive) { this.mobileActive = false; ZIndex.clear(this.menubar); this.hide(); } else { this.mobileActive = true; ZIndex.set("menu", this.menubar, this.$primevue.config.zIndex.menu); setTimeout(function() { _this.show(); }, 1); } this.bindOutsideClickListener(); event.preventDefault(); }, "toggle"), show: /* @__PURE__ */ __name(function show2() { focus(this.menubar); }, "show"), hide: /* @__PURE__ */ __name(function hide2(event, isFocus) { var _this2 = this; if (this.mobileActive) { this.mobileActive = false; setTimeout(function() { focus(_this2.$refs.menubutton); }, 0); } this.activeItemPath = []; this.focusedItemInfo = { index: -1, level: 0, parentKey: "" }; isFocus && focus(this.menubar); this.dirty = false; }, "hide"), onFocus: /* @__PURE__ */ __name(function onFocus2(event) { this.focused = true; this.focusedItemInfo = this.focusedItemInfo.index !== -1 ? this.focusedItemInfo : { index: this.findFirstFocusedItemIndex(), level: 0, parentKey: "" }; this.$emit("focus", event); }, "onFocus"), onBlur: /* @__PURE__ */ __name(function onBlur2(event) { this.focused = false; this.focusedItemInfo = { index: -1, level: 0, parentKey: "" }; this.searchValue = ""; this.dirty = false; this.$emit("blur", event); }, "onBlur"), onKeyDown: /* @__PURE__ */ __name(function onKeyDown2(event) { var metaKey = event.metaKey || event.ctrlKey; switch (event.code) { case "ArrowDown": this.onArrowDownKey(event); break; case "ArrowUp": this.onArrowUpKey(event); break; case "ArrowLeft": this.onArrowLeftKey(event); break; case "ArrowRight": this.onArrowRightKey(event); break; case "Home": this.onHomeKey(event); break; case "End": this.onEndKey(event); break; case "Space": this.onSpaceKey(event); break; case "Enter": case "NumpadEnter": this.onEnterKey(event); break; case "Escape": this.onEscapeKey(event); break; case "Tab": this.onTabKey(event); break; case "PageDown": case "PageUp": case "Backspace": case "ShiftLeft": case "ShiftRight": break; default: if (!metaKey && isPrintableCharacter(event.key)) { this.searchItems(event, event.key); } break; } }, "onKeyDown"), onItemChange: /* @__PURE__ */ __name(function onItemChange(event) { var processedItem = event.processedItem, isFocus = event.isFocus; if (isEmpty(processedItem)) return; var index = processedItem.index, key = processedItem.key, level = processedItem.level, parentKey = processedItem.parentKey, items = processedItem.items; var grouped = isNotEmpty(items); var activeItemPath3 = this.activeItemPath.filter(function(p) { return p.parentKey !== parentKey && p.parentKey !== key; }); grouped && activeItemPath3.push(processedItem); this.focusedItemInfo = { index, level, parentKey }; this.activeItemPath = activeItemPath3; grouped && (this.dirty = true); isFocus && focus(this.menubar); }, "onItemChange"), onItemClick: /* @__PURE__ */ __name(function onItemClick2(event) { var originalEvent = event.originalEvent, processedItem = event.processedItem; var grouped = this.isProccessedItemGroup(processedItem); var root11 = isEmpty(processedItem.parent); var selected = this.isSelected(processedItem); if (selected) { var index = processedItem.index, key = processedItem.key, level = processedItem.level, parentKey = processedItem.parentKey; this.activeItemPath = this.activeItemPath.filter(function(p) { return key !== p.key && key.startsWith(p.key); }); this.focusedItemInfo = { index, level, parentKey }; this.dirty = !root11; focus(this.menubar); } else { if (grouped) { this.onItemChange(event); } else { var rootProcessedItem = root11 ? processedItem : this.activeItemPath.find(function(p) { return p.parentKey === ""; }); this.hide(originalEvent); this.changeFocusedItemIndex(originalEvent, rootProcessedItem ? rootProcessedItem.index : -1); this.mobileActive = false; focus(this.menubar); } } }, "onItemClick"), onItemMouseEnter: /* @__PURE__ */ __name(function onItemMouseEnter2(event) { if (this.dirty) { this.onItemChange(event); } }, "onItemMouseEnter"), onItemMouseMove: /* @__PURE__ */ __name(function onItemMouseMove2(event) { if (this.focused) { this.changeFocusedItemIndex(event, event.processedItem.index); } }, "onItemMouseMove"), menuButtonClick: /* @__PURE__ */ __name(function menuButtonClick(event) { this.toggle(event); }, "menuButtonClick"), menuButtonKeydown: /* @__PURE__ */ __name(function menuButtonKeydown(event) { (event.code === "Enter" || event.code === "NumpadEnter" || event.code === "Space") && this.menuButtonClick(event); }, "menuButtonKeydown"), onArrowDownKey: /* @__PURE__ */ __name(function onArrowDownKey2(event) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var root11 = processedItem ? isEmpty(processedItem.parent) : null; if (root11) { var grouped = this.isProccessedItemGroup(processedItem); if (grouped) { this.onItemChange({ originalEvent: event, processedItem }); this.focusedItemInfo = { index: -1, parentKey: processedItem.key }; this.onArrowRightKey(event); } } else { var itemIndex = this.focusedItemInfo.index !== -1 ? this.findNextItemIndex(this.focusedItemInfo.index) : this.findFirstFocusedItemIndex(); this.changeFocusedItemIndex(event, itemIndex); } event.preventDefault(); }, "onArrowDownKey"), onArrowUpKey: /* @__PURE__ */ __name(function onArrowUpKey2(event) { var _this3 = this; var processedItem = this.visibleItems[this.focusedItemInfo.index]; var root11 = isEmpty(processedItem.parent); if (root11) { var grouped = this.isProccessedItemGroup(processedItem); if (grouped) { this.onItemChange({ originalEvent: event, processedItem }); this.focusedItemInfo = { index: -1, parentKey: processedItem.key }; var itemIndex = this.findLastItemIndex(); this.changeFocusedItemIndex(event, itemIndex); } } else { var parentItem = this.activeItemPath.find(function(p) { return p.key === processedItem.parentKey; }); if (this.focusedItemInfo.index === 0) { this.focusedItemInfo = { index: -1, parentKey: parentItem ? parentItem.parentKey : "" }; this.searchValue = ""; this.onArrowLeftKey(event); this.activeItemPath = this.activeItemPath.filter(function(p) { return p.parentKey !== _this3.focusedItemInfo.parentKey; }); } else { var _itemIndex = this.focusedItemInfo.index !== -1 ? this.findPrevItemIndex(this.focusedItemInfo.index) : this.findLastFocusedItemIndex(); this.changeFocusedItemIndex(event, _itemIndex); } } event.preventDefault(); }, "onArrowUpKey"), onArrowLeftKey: /* @__PURE__ */ __name(function onArrowLeftKey2(event) { var _this4 = this; var processedItem = this.visibleItems[this.focusedItemInfo.index]; var parentItem = processedItem ? this.activeItemPath.find(function(p) { return p.key === processedItem.parentKey; }) : null; if (parentItem) { this.onItemChange({ originalEvent: event, processedItem: parentItem }); this.activeItemPath = this.activeItemPath.filter(function(p) { return p.parentKey !== _this4.focusedItemInfo.parentKey; }); event.preventDefault(); } else { var itemIndex = this.focusedItemInfo.index !== -1 ? this.findPrevItemIndex(this.focusedItemInfo.index) : this.findLastFocusedItemIndex(); this.changeFocusedItemIndex(event, itemIndex); event.preventDefault(); } }, "onArrowLeftKey"), onArrowRightKey: /* @__PURE__ */ __name(function onArrowRightKey2(event) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var parentItem = processedItem ? this.activeItemPath.find(function(p) { return p.key === processedItem.parentKey; }) : null; if (parentItem) { var grouped = this.isProccessedItemGroup(processedItem); if (grouped) { this.onItemChange({ originalEvent: event, processedItem }); this.focusedItemInfo = { index: -1, parentKey: processedItem.key }; this.onArrowDownKey(event); } } else { var itemIndex = this.focusedItemInfo.index !== -1 ? this.findNextItemIndex(this.focusedItemInfo.index) : this.findFirstFocusedItemIndex(); this.changeFocusedItemIndex(event, itemIndex); event.preventDefault(); } }, "onArrowRightKey"), onHomeKey: /* @__PURE__ */ __name(function onHomeKey2(event) { this.changeFocusedItemIndex(event, this.findFirstItemIndex()); event.preventDefault(); }, "onHomeKey"), onEndKey: /* @__PURE__ */ __name(function onEndKey2(event) { this.changeFocusedItemIndex(event, this.findLastItemIndex()); event.preventDefault(); }, "onEndKey"), onEnterKey: /* @__PURE__ */ __name(function onEnterKey2(event) { if (this.focusedItemInfo.index !== -1) { var element = findSingle(this.menubar, 'li[id="'.concat("".concat(this.focusedItemId), '"]')); var anchorElement = element && findSingle(element, 'a[data-pc-section="itemlink"]'); anchorElement ? anchorElement.click() : element && element.click(); var processedItem = this.visibleItems[this.focusedItemInfo.index]; var grouped = this.isProccessedItemGroup(processedItem); !grouped && (this.focusedItemInfo.index = this.findFirstFocusedItemIndex()); } event.preventDefault(); }, "onEnterKey"), onSpaceKey: /* @__PURE__ */ __name(function onSpaceKey(event) { this.onEnterKey(event); }, "onSpaceKey"), onEscapeKey: /* @__PURE__ */ __name(function onEscapeKey2(event) { if (this.focusedItemInfo.level !== 0) { var _focusedItemInfo = this.focusedItemInfo; this.hide(event, false); this.focusedItemInfo = { index: Number(_focusedItemInfo.parentKey.split("_")[0]), level: 0, parentKey: "" }; } event.preventDefault(); }, "onEscapeKey"), onTabKey: /* @__PURE__ */ __name(function onTabKey2(event) { if (this.focusedItemInfo.index !== -1) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var grouped = this.isProccessedItemGroup(processedItem); !grouped && this.onItemChange({ originalEvent: event, processedItem }); } this.hide(); }, "onTabKey"), bindOutsideClickListener: /* @__PURE__ */ __name(function bindOutsideClickListener2() { var _this5 = this; if (!this.outsideClickListener) { this.outsideClickListener = function(event) { var isOutsideContainer = _this5.container && !_this5.container.contains(event.target); var isOutsideTarget = !(_this5.target && (_this5.target === event.target || _this5.target.contains(event.target))); if (isOutsideContainer && isOutsideTarget) { _this5.hide(); } }; document.addEventListener("click", this.outsideClickListener); } }, "bindOutsideClickListener"), unbindOutsideClickListener: /* @__PURE__ */ __name(function unbindOutsideClickListener2() { if (this.outsideClickListener) { document.removeEventListener("click", this.outsideClickListener); this.outsideClickListener = null; } }, "unbindOutsideClickListener"), bindResizeListener: /* @__PURE__ */ __name(function bindResizeListener2() { var _this6 = this; if (!this.resizeListener) { this.resizeListener = function(event) { if (!isTouchDevice()) { _this6.hide(event, true); } _this6.mobileActive = false; }; window.addEventListener("resize", this.resizeListener); } }, "bindResizeListener"), unbindResizeListener: /* @__PURE__ */ __name(function unbindResizeListener2() { if (this.resizeListener) { window.removeEventListener("resize", this.resizeListener); this.resizeListener = null; } }, "unbindResizeListener"), bindMatchMediaListener: /* @__PURE__ */ __name(function bindMatchMediaListener() { var _this7 = this; if (!this.matchMediaListener) { var query = matchMedia("(max-width: ".concat(this.breakpoint, ")")); this.query = query; this.queryMatches = query.matches; this.matchMediaListener = function() { _this7.queryMatches = query.matches; _this7.mobileActive = false; }; this.query.addEventListener("change", this.matchMediaListener); } }, "bindMatchMediaListener"), unbindMatchMediaListener: /* @__PURE__ */ __name(function unbindMatchMediaListener() { if (this.matchMediaListener) { this.query.removeEventListener("change", this.matchMediaListener); this.matchMediaListener = null; } }, "unbindMatchMediaListener"), isItemMatched: /* @__PURE__ */ __name(function isItemMatched(processedItem) { var _this$getProccessedIt; return this.isValidItem(processedItem) && ((_this$getProccessedIt = this.getProccessedItemLabel(processedItem)) === null || _this$getProccessedIt === void 0 ? void 0 : _this$getProccessedIt.toLocaleLowerCase().startsWith(this.searchValue.toLocaleLowerCase())); }, "isItemMatched"), isValidItem: /* @__PURE__ */ __name(function isValidItem(processedItem) { return !!processedItem && !this.isItemDisabled(processedItem.item) && !this.isItemSeparator(processedItem.item) && this.isItemVisible(processedItem.item); }, "isValidItem"), isValidSelectedItem: /* @__PURE__ */ __name(function isValidSelectedItem(processedItem) { return this.isValidItem(processedItem) && this.isSelected(processedItem); }, "isValidSelectedItem"), isSelected: /* @__PURE__ */ __name(function isSelected2(processedItem) { return this.activeItemPath.some(function(p) { return p.key === processedItem.key; }); }, "isSelected"), findFirstItemIndex: /* @__PURE__ */ __name(function findFirstItemIndex() { var _this8 = this; return this.visibleItems.findIndex(function(processedItem) { return _this8.isValidItem(processedItem); }); }, "findFirstItemIndex"), findLastItemIndex: /* @__PURE__ */ __name(function findLastItemIndex() { var _this9 = this; return findLastIndex(this.visibleItems, function(processedItem) { return _this9.isValidItem(processedItem); }); }, "findLastItemIndex"), findNextItemIndex: /* @__PURE__ */ __name(function findNextItemIndex(index) { var _this10 = this; var matchedItemIndex = index < this.visibleItems.length - 1 ? this.visibleItems.slice(index + 1).findIndex(function(processedItem) { return _this10.isValidItem(processedItem); }) : -1; return matchedItemIndex > -1 ? matchedItemIndex + index + 1 : index; }, "findNextItemIndex"), findPrevItemIndex: /* @__PURE__ */ __name(function findPrevItemIndex(index) { var _this11 = this; var matchedItemIndex = index > 0 ? findLastIndex(this.visibleItems.slice(0, index), function(processedItem) { return _this11.isValidItem(processedItem); }) : -1; return matchedItemIndex > -1 ? matchedItemIndex : index; }, "findPrevItemIndex"), findSelectedItemIndex: /* @__PURE__ */ __name(function findSelectedItemIndex() { var _this12 = this; return this.visibleItems.findIndex(function(processedItem) { return _this12.isValidSelectedItem(processedItem); }); }, "findSelectedItemIndex"), findFirstFocusedItemIndex: /* @__PURE__ */ __name(function findFirstFocusedItemIndex() { var selectedIndex = this.findSelectedItemIndex(); return selectedIndex < 0 ? this.findFirstItemIndex() : selectedIndex; }, "findFirstFocusedItemIndex"), findLastFocusedItemIndex: /* @__PURE__ */ __name(function findLastFocusedItemIndex() { var selectedIndex = this.findSelectedItemIndex(); return selectedIndex < 0 ? this.findLastItemIndex() : selectedIndex; }, "findLastFocusedItemIndex"), searchItems: /* @__PURE__ */ __name(function searchItems(event, _char) { var _this13 = this; this.searchValue = (this.searchValue || "") + _char; var itemIndex = -1; var matched = false; if (this.focusedItemInfo.index !== -1) { itemIndex = this.visibleItems.slice(this.focusedItemInfo.index).findIndex(function(processedItem) { return _this13.isItemMatched(processedItem); }); itemIndex = itemIndex === -1 ? this.visibleItems.slice(0, this.focusedItemInfo.index).findIndex(function(processedItem) { return _this13.isItemMatched(processedItem); }) : itemIndex + this.focusedItemInfo.index; } else { itemIndex = this.visibleItems.findIndex(function(processedItem) { return _this13.isItemMatched(processedItem); }); } if (itemIndex !== -1) { matched = true; } if (itemIndex === -1 && this.focusedItemInfo.index === -1) { itemIndex = this.findFirstFocusedItemIndex(); } if (itemIndex !== -1) { this.changeFocusedItemIndex(event, itemIndex); } if (this.searchTimeout) { clearTimeout(this.searchTimeout); } this.searchTimeout = setTimeout(function() { _this13.searchValue = ""; _this13.searchTimeout = null; }, 500); return matched; }, "searchItems"), changeFocusedItemIndex: /* @__PURE__ */ __name(function changeFocusedItemIndex(event, index) { if (this.focusedItemInfo.index !== index) { this.focusedItemInfo.index = index; this.scrollInView(); } }, "changeFocusedItemIndex"), scrollInView: /* @__PURE__ */ __name(function scrollInView2() { var index = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : -1; var id = index !== -1 ? "".concat(this.id, "_").concat(index) : this.focusedItemId; var element = findSingle(this.menubar, 'li[id="'.concat(id, '"]')); if (element) { element.scrollIntoView && element.scrollIntoView({ block: "nearest", inline: "start" }); } }, "scrollInView"), createProcessedItems: /* @__PURE__ */ __name(function createProcessedItems(items) { var _this14 = this; var level = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; var parent = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {}; var parentKey = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : ""; var processedItems3 = []; items && items.forEach(function(item3, index) { var key = (parentKey !== "" ? parentKey + "_" : "") + index; var newItem = { item: item3, index, level, key, parent, parentKey }; newItem["items"] = _this14.createProcessedItems(item3.items, level + 1, newItem, key); processedItems3.push(newItem); }); return processedItems3; }, "createProcessedItems"), containerRef: /* @__PURE__ */ __name(function containerRef(el) { this.container = el; }, "containerRef"), menubarRef: /* @__PURE__ */ __name(function menubarRef(el) { this.menubar = el ? el.$el : void 0; }, "menubarRef") }, computed: { processedItems: /* @__PURE__ */ __name(function processedItems() { return this.createProcessedItems(this.model || []); }, "processedItems"), visibleItems: /* @__PURE__ */ __name(function visibleItems() { var _this15 = this; var processedItem = this.activeItemPath.find(function(p) { return p.key === _this15.focusedItemInfo.parentKey; }); return processedItem ? processedItem.items : this.processedItems; }, "visibleItems"), focusedItemId: /* @__PURE__ */ __name(function focusedItemId() { return this.focusedItemInfo.index !== -1 ? "".concat(this.id).concat(isNotEmpty(this.focusedItemInfo.parentKey) ? "_" + this.focusedItemInfo.parentKey : "", "_").concat(this.focusedItemInfo.index) : null; }, "focusedItemId") }, components: { MenubarSub: script$1$3, BarsIcon: script$v } }; function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) { return typeof o2; } : function(o2) { return o2 && "function" == typeof Symbol && o2.constructor === Symbol && o2 !== Symbol.prototype ? "symbol" : typeof o2; }, _typeof(o); } __name(_typeof, "_typeof"); function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function(r2) { return Object.getOwnPropertyDescriptor(e, r2).enumerable; })), t.push.apply(t, o); } return t; } __name(ownKeys, "ownKeys"); function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function(r2) { _defineProperty(e, r2, t[r2]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) { Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2)); }); } return e; } __name(_objectSpread, "_objectSpread"); function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; } __name(_defineProperty, "_defineProperty"); function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; } __name(_toPropertyKey, "_toPropertyKey"); function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } __name(_toPrimitive, "_toPrimitive"); var _hoisted_1$7 = ["aria-haspopup", "aria-expanded", "aria-controls", "aria-label"]; function render$5(_ctx, _cache, $props, $setup, $data, $options) { var _component_BarsIcon = resolveComponent("BarsIcon"); var _component_MenubarSub = resolveComponent("MenubarSub"); return openBlock(), createElementBlock("div", mergeProps({ ref: $options.containerRef, "class": _ctx.cx("root") }, _ctx.ptmi("root")), [_ctx.$slots.start ? (openBlock(), createElementBlock("div", mergeProps({ key: 0, "class": _ctx.cx("start") }, _ctx.ptm("start")), [renderSlot(_ctx.$slots, "start")], 16)) : createCommentVNode("", true), renderSlot(_ctx.$slots, _ctx.$slots.button ? "button" : "menubutton", { id: $data.id, "class": normalizeClass(_ctx.cx("button")), toggleCallback: /* @__PURE__ */ __name(function toggleCallback(event) { return $options.menuButtonClick(event); }, "toggleCallback") }, function() { var _ctx$$primevue$config; return [_ctx.model && _ctx.model.length > 0 ? (openBlock(), createElementBlock("a", mergeProps({ key: 0, ref: "menubutton", role: "button", tabindex: "0", "class": _ctx.cx("button"), "aria-haspopup": _ctx.model.length && _ctx.model.length > 0 ? true : false, "aria-expanded": $data.mobileActive, "aria-controls": $data.id, "aria-label": (_ctx$$primevue$config = _ctx.$primevue.config.locale.aria) === null || _ctx$$primevue$config === void 0 ? void 0 : _ctx$$primevue$config.navigation, onClick: _cache[0] || (_cache[0] = function($event) { return $options.menuButtonClick($event); }), onKeydown: _cache[1] || (_cache[1] = function($event) { return $options.menuButtonKeydown($event); }) }, _objectSpread(_objectSpread({}, _ctx.buttonProps), _ctx.ptm("button"))), [renderSlot(_ctx.$slots, _ctx.$slots.buttonicon ? "buttonicon" : "menubuttonicon", {}, function() { return [createVNode(_component_BarsIcon, normalizeProps(guardReactiveProps(_ctx.ptm("buttonicon"))), null, 16)]; })], 16, _hoisted_1$7)) : createCommentVNode("", true)]; }), createVNode(_component_MenubarSub, { ref: $options.menubarRef, id: $data.id + "_list", role: "menubar", items: $options.processedItems, templates: _ctx.$slots, root: true, mobileActive: $data.mobileActive, tabindex: "0", "aria-activedescendant": $data.focused ? $options.focusedItemId : void 0, menuId: $data.id, focusedItemId: $data.focused ? $options.focusedItemId : void 0, activeItemPath: $data.activeItemPath, level: 0, "aria-labelledby": _ctx.ariaLabelledby, "aria-label": _ctx.ariaLabel, pt: _ctx.pt, unstyled: _ctx.unstyled, onFocus: $options.onFocus, onBlur: $options.onBlur, onKeydown: $options.onKeyDown, onItemClick: $options.onItemClick, onItemMouseenter: $options.onItemMouseEnter, onItemMousemove: $options.onItemMouseMove }, null, 8, ["id", "items", "templates", "mobileActive", "aria-activedescendant", "menuId", "focusedItemId", "activeItemPath", "aria-labelledby", "aria-label", "pt", "unstyled", "onFocus", "onBlur", "onKeydown", "onItemClick", "onItemMouseenter", "onItemMousemove"]), _ctx.$slots.end ? (openBlock(), createElementBlock("div", mergeProps({ key: 1, "class": _ctx.cx("end") }, _ctx.ptm("end")), [renderSlot(_ctx.$slots, "end")], 16)) : createCommentVNode("", true)], 16); } __name(render$5, "render$5"); script$5.render = render$5; const _withScopeId$2 = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-9646ca0a"), n = n(), popScopeId(), n), "_withScopeId$2"); const _hoisted_1$6 = ["href"]; const _hoisted_2$4 = { class: "p-menubar-item-label" }; const _hoisted_3$2 = { key: 1, class: "ml-auto border border-surface rounded text-muted text-xs p-1 keybinding-tag" }; const _sfc_main$5 = /* @__PURE__ */ defineComponent({ __name: "CommandMenubar", setup(__props) { const settingStore = useSettingStore(); const dropdownDirection = computed( () => settingStore.get("Comfy.UseNewMenu") === "Top" ? "down" : "up" ); const menuItemsStore = useMenuItemStore(); const items = menuItemsStore.menuItems; return (_ctx, _cache) => { return openBlock(), createBlock(unref(script$5), { model: unref(items), class: "top-menubar border-none p-0 bg-transparent", pt: { rootList: "gap-0 flex-nowrap w-auto", submenu: `dropdown-direction-${dropdownDirection.value}`, item: "relative" } }, { item: withCtx(({ item: item3, props }) => [ createBaseVNode("a", mergeProps({ class: "p-menubar-item-link" }, props.action, { href: item3.url, target: "_blank" }), [ item3.icon ? (openBlock(), createElementBlock("span", { key: 0, class: normalizeClass(["p-menubar-item-icon", item3.icon]) }, null, 2)) : createCommentVNode("", true), createBaseVNode("span", _hoisted_2$4, toDisplayString(item3.label), 1), item3?.comfyCommand?.keybinding ? (openBlock(), createElementBlock("span", _hoisted_3$2, toDisplayString(item3.comfyCommand.keybinding.combo.toString()), 1)) : createCommentVNode("", true) ], 16, _hoisted_1$6) ]), _: 1 }, 8, ["model", "pt"]); }; } }); const CommandMenubar = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-9646ca0a"]]); var theme$2 = /* @__PURE__ */ __name(function theme7(_ref) { var dt = _ref.dt; return "\n.p-panel {\n border: 1px solid ".concat(dt("panel.border.color"), ";\n border-radius: ").concat(dt("panel.border.radius"), ";\n background: ").concat(dt("panel.background"), ";\n color: ").concat(dt("panel.color"), ";\n}\n\n.p-panel-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ").concat(dt("panel.header.padding"), ";\n background: ").concat(dt("panel.header.background"), ";\n color: ").concat(dt("panel.header.color"), ";\n border-style: solid;\n border-width: ").concat(dt("panel.header.border.width"), ";\n border-color: ").concat(dt("panel.header.border.color"), ";\n border-radius: ").concat(dt("panel.header.border.radius"), ";\n}\n\n.p-panel-toggleable .p-panel-header {\n padding: ").concat(dt("panel.toggleable.header.padding"), ";\n}\n\n.p-panel-title {\n line-height: 1;\n font-weight: ").concat(dt("panel.title.font.weight"), ";\n}\n\n.p-panel-content {\n padding: ").concat(dt("panel.content.padding"), ";\n}\n\n.p-panel-footer {\n padding: ").concat(dt("panel.footer.padding"), ";\n}\n"); }, "theme"); var classes$2 = { root: /* @__PURE__ */ __name(function root8(_ref2) { var props = _ref2.props; return ["p-panel p-component", { "p-panel-toggleable": props.toggleable }]; }, "root"), header: "p-panel-header", title: "p-panel-title", headerActions: "p-panel-header-actions", pcToggleButton: "p-panel-toggle-button", contentContainer: "p-panel-content-container", content: "p-panel-content", footer: "p-panel-footer" }; var PanelStyle = BaseStyle.extend({ name: "panel", theme: theme$2, classes: classes$2 }); var script$1$2 = { name: "BasePanel", "extends": script$e, props: { header: String, toggleable: Boolean, collapsed: Boolean, toggleButtonProps: { type: Object, "default": /* @__PURE__ */ __name(function _default() { return { severity: "secondary", text: true, rounded: true }; }, "_default") } }, style: PanelStyle, provide: /* @__PURE__ */ __name(function provide9() { return { $pcPanel: this, $parentInstance: this }; }, "provide") }; var script$4 = { name: "Panel", "extends": script$1$2, inheritAttrs: false, emits: ["update:collapsed", "toggle"], data: /* @__PURE__ */ __name(function data6() { return { id: this.$attrs.id, d_collapsed: this.collapsed }; }, "data"), watch: { "$attrs.id": /* @__PURE__ */ __name(function $attrsId3(newValue) { this.id = newValue || UniqueComponentId(); }, "$attrsId"), collapsed: /* @__PURE__ */ __name(function collapsed(newValue) { this.d_collapsed = newValue; }, "collapsed") }, mounted: /* @__PURE__ */ __name(function mounted6() { this.id = this.id || UniqueComponentId(); }, "mounted"), methods: { toggle: /* @__PURE__ */ __name(function toggle2(event) { this.d_collapsed = !this.d_collapsed; this.$emit("update:collapsed", this.d_collapsed); this.$emit("toggle", { originalEvent: event, value: this.d_collapsed }); }, "toggle"), onKeyDown: /* @__PURE__ */ __name(function onKeyDown3(event) { if (event.code === "Enter" || event.code === "NumpadEnter" || event.code === "Space") { this.toggle(event); event.preventDefault(); } }, "onKeyDown") }, computed: { buttonAriaLabel: /* @__PURE__ */ __name(function buttonAriaLabel() { return this.toggleButtonProps && this.toggleButtonProps.ariaLabel ? this.toggleButtonProps.ariaLabel : this.header; }, "buttonAriaLabel") }, components: { PlusIcon: script$w, MinusIcon: script$x, Button: script$d }, directives: { ripple: Ripple } }; var _hoisted_1$5 = ["id"]; var _hoisted_2$3 = ["id", "aria-labelledby"]; function render$4(_ctx, _cache, $props, $setup, $data, $options) { var _component_Button = resolveComponent("Button"); return openBlock(), createElementBlock("div", mergeProps({ "class": _ctx.cx("root") }, _ctx.ptmi("root")), [createBaseVNode("div", mergeProps({ "class": _ctx.cx("header") }, _ctx.ptm("header")), [renderSlot(_ctx.$slots, "header", { id: $data.id + "_header", "class": normalizeClass(_ctx.cx("title")) }, function() { return [_ctx.header ? (openBlock(), createElementBlock("span", mergeProps({ key: 0, id: $data.id + "_header", "class": _ctx.cx("title") }, _ctx.ptm("title")), toDisplayString(_ctx.header), 17, _hoisted_1$5)) : createCommentVNode("", true)]; }), createBaseVNode("div", mergeProps({ "class": _ctx.cx("headerActions") }, _ctx.ptm("headerActions")), [renderSlot(_ctx.$slots, "icons"), _ctx.toggleable ? (openBlock(), createBlock(_component_Button, mergeProps({ key: 0, id: $data.id + "_header", "class": _ctx.cx("pcToggleButton"), "aria-label": $options.buttonAriaLabel, "aria-controls": $data.id + "_content", "aria-expanded": !$data.d_collapsed, unstyled: _ctx.unstyled, onClick: $options.toggle, onKeydown: $options.onKeyDown }, _ctx.toggleButtonProps, { pt: _ctx.ptm("pcToggleButton") }), { icon: withCtx(function(slotProps) { return [renderSlot(_ctx.$slots, _ctx.$slots.toggleicon ? "toggleicon" : "togglericon", { collapsed: $data.d_collapsed }, function() { return [(openBlock(), createBlock(resolveDynamicComponent($data.d_collapsed ? "PlusIcon" : "MinusIcon"), mergeProps({ "class": slotProps["class"] }, _ctx.ptm("pcToggleButton")["icon"]), null, 16, ["class"]))]; })]; }), _: 3 }, 16, ["id", "class", "aria-label", "aria-controls", "aria-expanded", "unstyled", "onClick", "onKeydown", "pt"])) : createCommentVNode("", true)], 16)], 16), createVNode(Transition, mergeProps({ name: "p-toggleable-content" }, _ctx.ptm("transition")), { "default": withCtx(function() { return [withDirectives(createBaseVNode("div", mergeProps({ id: $data.id + "_content", "class": _ctx.cx("contentContainer"), role: "region", "aria-labelledby": $data.id + "_header" }, _ctx.ptm("contentContainer")), [createBaseVNode("div", mergeProps({ "class": _ctx.cx("content") }, _ctx.ptm("content")), [renderSlot(_ctx.$slots, "default")], 16), _ctx.$slots.footer ? (openBlock(), createElementBlock("div", mergeProps({ key: 0, "class": _ctx.cx("footer") }, _ctx.ptm("footer")), [renderSlot(_ctx.$slots, "footer")], 16)) : createCommentVNode("", true)], 16, _hoisted_2$3), [[vShow, !$data.d_collapsed]])]; }), _: 3 }, 16)], 16); } __name(render$4, "render$4"); script$4.render = render$4; const _hoisted_1$4 = { viewBox: "0 0 24 24", width: "1.2em", height: "1.2em" }; const _hoisted_2$2 = /* @__PURE__ */ createBaseVNode("g", { fill: "none", stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2" }, [ /* @__PURE__ */ createBaseVNode("path", { d: "M16 12H3m13 6H3m7-12H3m18 12V8a2 2 0 0 0-2-2h-5" }), /* @__PURE__ */ createBaseVNode("path", { d: "m16 8l-2-2l2-2" }) ], -1); const _hoisted_3$1 = [ _hoisted_2$2 ]; function render$3(_ctx, _cache) { return openBlock(), createElementBlock("svg", _hoisted_1$4, [..._hoisted_3$1]); } __name(render$3, "render$3"); const __unplugin_components_0 = markRaw({ name: "lucide-list-start", render: render$3 }); var theme$1 = /* @__PURE__ */ __name(function theme8(_ref) { var dt = _ref.dt; return "\n.p-tieredmenu {\n background: ".concat(dt("tieredmenu.background"), ";\n color: ").concat(dt("tieredmenu.color"), ";\n border: 1px solid ").concat(dt("tieredmenu.border.color"), ";\n border-radius: ").concat(dt("tieredmenu.border.radius"), ";\n min-width: 12.5rem;\n}\n\n.p-tieredmenu-root-list,\n.p-tieredmenu-submenu {\n margin: 0;\n padding: ").concat(dt("tieredmenu.list.padding"), ";\n list-style: none;\n outline: 0 none;\n display: flex;\n flex-direction: column;\n gap: ").concat(dt("tieredmenu.list.gap"), ";\n}\n\n.p-tieredmenu-submenu {\n position: absolute;\n min-width: 100%;\n z-index: 1;\n background: ").concat(dt("tieredmenu.background"), ";\n color: ").concat(dt("tieredmenu.color"), ";\n border: 1px solid ").concat(dt("tieredmenu.border.color"), ";\n border-radius: ").concat(dt("tieredmenu.border.radius"), ";\n box-shadow: ").concat(dt("tieredmenu.shadow"), ";\n}\n\n.p-tieredmenu-item {\n position: relative;\n}\n\n.p-tieredmenu-item-content {\n transition: background ").concat(dt("tieredmenu.transition.duration"), ", color ").concat(dt("tieredmenu.transition.duration"), ";\n border-radius: ").concat(dt("tieredmenu.item.border.radius"), ";\n color: ").concat(dt("tieredmenu.item.color"), ";\n}\n\n.p-tieredmenu-item-link {\n cursor: pointer;\n display: flex;\n align-items: center;\n text-decoration: none;\n overflow: hidden;\n position: relative;\n color: inherit;\n padding: ").concat(dt("tieredmenu.item.padding"), ";\n gap: ").concat(dt("tieredmenu.item.gap"), ";\n user-select: none;\n outline: 0 none;\n}\n\n.p-tieredmenu-item-label {\n line-height: 1;\n}\n\n.p-tieredmenu-item-icon {\n color: ").concat(dt("tieredmenu.item.icon.color"), ";\n}\n\n.p-tieredmenu-submenu-icon {\n color: ").concat(dt("tieredmenu.submenu.icon.color"), ";\n margin-left: auto;\n font-size: ").concat(dt("tieredmenu.submenu.icon.size"), ";\n width: ").concat(dt("tieredmenu.submenu.icon.size"), ";\n height: ").concat(dt("tieredmenu.submenu.icon.size"), ";\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content {\n color: ").concat(dt("tieredmenu.item.focus.color"), ";\n background: ").concat(dt("tieredmenu.item.focus.background"), ";\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content .p-tieredmenu-item-icon {\n color: ").concat(dt("tieredmenu.item.icon.focus.color"), ";\n}\n\n.p-tieredmenu-item.p-focus > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n color: ").concat(dt("tieredmenu.submenu.icon.focus.color"), ";\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover {\n color: ").concat(dt("tieredmenu.item.focus.color"), ";\n background: ").concat(dt("tieredmenu.item.focus.background"), ";\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover .p-tieredmenu-item-icon {\n color: ").concat(dt("tieredmenu.item.icon.focus.color"), ";\n}\n\n.p-tieredmenu-item:not(.p-disabled) > .p-tieredmenu-item-content:hover .p-tieredmenu-submenu-icon {\n color: ").concat(dt("tieredmenu.submenu.icon.focus.color"), ";\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content {\n color: ").concat(dt("tieredmenu.item.active.color"), ";\n background: ").concat(dt("tieredmenu.item.active.background"), ";\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-item-icon {\n color: ").concat(dt("tieredmenu.item.icon.active.color"), ";\n}\n\n.p-tieredmenu-item-active > .p-tieredmenu-item-content .p-tieredmenu-submenu-icon {\n color: ").concat(dt("tieredmenu.submenu.icon.active.color"), ";\n}\n\n.p-tieredmenu-separator {\n border-top: 1px solid ").concat(dt("tieredmenu.separator.border.color"), ";\n}\n\n.p-tieredmenu-overlay {\n box-shadow: ").concat(dt("tieredmenu.shadow"), ";\n}\n\n.p-tieredmenu-enter-from,\n.p-tieredmenu-leave-active {\n opacity: 0;\n}\n\n.p-tieredmenu-enter-active {\n transition: opacity 250ms;\n}\n"); }, "theme"); var inlineStyles = { submenu: /* @__PURE__ */ __name(function submenu2(_ref2) { var instance = _ref2.instance, processedItem = _ref2.processedItem; return { display: instance.isItemActive(processedItem) ? "flex" : "none" }; }, "submenu") }; var classes$1 = { root: /* @__PURE__ */ __name(function root9(_ref3) { _ref3.instance; var props = _ref3.props; return ["p-tieredmenu p-component", { "p-tieredmenu-overlay": props.popup }]; }, "root"), start: "p-tieredmenu-start", rootList: "p-tieredmenu-root-list", item: /* @__PURE__ */ __name(function item2(_ref4) { var instance = _ref4.instance, processedItem = _ref4.processedItem; return ["p-tieredmenu-item", { "p-tieredmenu-item-active": instance.isItemActive(processedItem), "p-focus": instance.isItemFocused(processedItem), "p-disabled": instance.isItemDisabled(processedItem) }]; }, "item"), itemContent: "p-tieredmenu-item-content", itemLink: "p-tieredmenu-item-link", itemIcon: "p-tieredmenu-item-icon", itemLabel: "p-tieredmenu-item-label", submenuIcon: "p-tieredmenu-submenu-icon", submenu: "p-tieredmenu-submenu", separator: "p-tieredmenu-separator", end: "p-tieredmenu-end" }; var TieredMenuStyle = BaseStyle.extend({ name: "tieredmenu", theme: theme$1, classes: classes$1, inlineStyles }); var script$2 = { name: "BaseTieredMenu", "extends": script$e, props: { popup: { type: Boolean, "default": false }, model: { type: Array, "default": null }, appendTo: { type: [String, Object], "default": "body" }, autoZIndex: { type: Boolean, "default": true }, baseZIndex: { type: Number, "default": 0 }, disabled: { type: Boolean, "default": false }, tabindex: { type: Number, "default": 0 }, ariaLabelledby: { type: String, "default": null }, ariaLabel: { type: String, "default": null } }, style: TieredMenuStyle, provide: /* @__PURE__ */ __name(function provide10() { return { $pcTieredMenu: this, $parentInstance: this }; }, "provide") }; var script$1$1 = { name: "TieredMenuSub", hostName: "TieredMenu", "extends": script$e, emits: ["item-click", "item-mouseenter", "item-mousemove"], container: null, props: { menuId: { type: String, "default": null }, focusedItemId: { type: String, "default": null }, items: { type: Array, "default": null }, visible: { type: Boolean, "default": false }, level: { type: Number, "default": 0 }, templates: { type: Object, "default": null }, activeItemPath: { type: Object, "default": null }, tabindex: { type: Number, "default": 0 } }, methods: { getItemId: /* @__PURE__ */ __name(function getItemId2(processedItem) { return "".concat(this.menuId, "_").concat(processedItem.key); }, "getItemId"), getItemKey: /* @__PURE__ */ __name(function getItemKey2(processedItem) { return this.getItemId(processedItem); }, "getItemKey"), getItemProp: /* @__PURE__ */ __name(function getItemProp3(processedItem, name, params) { return processedItem && processedItem.item ? resolve(processedItem.item[name], params) : void 0; }, "getItemProp"), getItemLabel: /* @__PURE__ */ __name(function getItemLabel3(processedItem) { return this.getItemProp(processedItem, "label"); }, "getItemLabel"), getItemLabelId: /* @__PURE__ */ __name(function getItemLabelId2(processedItem) { return "".concat(this.menuId, "_").concat(processedItem.key, "_label"); }, "getItemLabelId"), getPTOptions: /* @__PURE__ */ __name(function getPTOptions5(processedItem, index, key) { return this.ptm(key, { context: { item: processedItem.item, index, active: this.isItemActive(processedItem), focused: this.isItemFocused(processedItem), disabled: this.isItemDisabled(processedItem) } }); }, "getPTOptions"), isItemActive: /* @__PURE__ */ __name(function isItemActive2(processedItem) { return this.activeItemPath.some(function(path) { return path.key === processedItem.key; }); }, "isItemActive"), isItemVisible: /* @__PURE__ */ __name(function isItemVisible3(processedItem) { return this.getItemProp(processedItem, "visible") !== false; }, "isItemVisible"), isItemDisabled: /* @__PURE__ */ __name(function isItemDisabled3(processedItem) { return this.getItemProp(processedItem, "disabled"); }, "isItemDisabled"), isItemFocused: /* @__PURE__ */ __name(function isItemFocused2(processedItem) { return this.focusedItemId === this.getItemId(processedItem); }, "isItemFocused"), isItemGroup: /* @__PURE__ */ __name(function isItemGroup3(processedItem) { return isNotEmpty(processedItem.items); }, "isItemGroup"), onEnter: /* @__PURE__ */ __name(function onEnter2() { nestedPosition(this.container, this.level); }, "onEnter"), onItemClick: /* @__PURE__ */ __name(function onItemClick3(event, processedItem) { this.getItemProp(processedItem, "command", { originalEvent: event, item: processedItem.item }); this.$emit("item-click", { originalEvent: event, processedItem, isFocus: true }); }, "onItemClick"), onItemMouseEnter: /* @__PURE__ */ __name(function onItemMouseEnter3(event, processedItem) { this.$emit("item-mouseenter", { originalEvent: event, processedItem }); }, "onItemMouseEnter"), onItemMouseMove: /* @__PURE__ */ __name(function onItemMouseMove3(event, processedItem) { this.$emit("item-mousemove", { originalEvent: event, processedItem }); }, "onItemMouseMove"), getAriaSetSize: /* @__PURE__ */ __name(function getAriaSetSize2() { var _this = this; return this.items.filter(function(processedItem) { return _this.isItemVisible(processedItem) && !_this.getItemProp(processedItem, "separator"); }).length; }, "getAriaSetSize"), getAriaPosInset: /* @__PURE__ */ __name(function getAriaPosInset3(index) { var _this2 = this; return index - this.items.slice(0, index).filter(function(processedItem) { return _this2.isItemVisible(processedItem) && _this2.getItemProp(processedItem, "separator"); }).length + 1; }, "getAriaPosInset"), getMenuItemProps: /* @__PURE__ */ __name(function getMenuItemProps2(processedItem, index) { return { action: mergeProps({ "class": this.cx("itemLink"), tabindex: -1, "aria-hidden": true }, this.getPTOptions(processedItem, index, "itemLink")), icon: mergeProps({ "class": [this.cx("itemIcon"), this.getItemProp(processedItem, "icon")] }, this.getPTOptions(processedItem, index, "itemIcon")), label: mergeProps({ "class": this.cx("itemLabel") }, this.getPTOptions(processedItem, index, "itemLabel")), submenuicon: mergeProps({ "class": this.cx("submenuIcon") }, this.getPTOptions(processedItem, index, "submenuIcon")) }; }, "getMenuItemProps"), containerRef: /* @__PURE__ */ __name(function containerRef2(el) { this.container = el; }, "containerRef") }, components: { AngleRightIcon: script$t }, directives: { ripple: Ripple } }; var _hoisted_1$1$1 = ["tabindex"]; var _hoisted_2$1 = ["id", "aria-label", "aria-disabled", "aria-expanded", "aria-haspopup", "aria-level", "aria-setsize", "aria-posinset", "data-p-active", "data-p-focused", "data-p-disabled"]; var _hoisted_3 = ["onClick", "onMouseenter", "onMousemove"]; var _hoisted_4 = ["href", "target"]; var _hoisted_5 = ["id"]; var _hoisted_6 = ["id"]; function render$1(_ctx, _cache, $props, $setup, $data, $options) { var _component_AngleRightIcon = resolveComponent("AngleRightIcon"); var _component_TieredMenuSub = resolveComponent("TieredMenuSub", true); var _directive_ripple = resolveDirective("ripple"); return openBlock(), createBlock(Transition, mergeProps({ name: "p-tieredmenu", onEnter: $options.onEnter }, _ctx.ptm("menu.transition")), { "default": withCtx(function() { return [($props.level === 0 ? true : $props.visible) ? (openBlock(), createElementBlock("ul", mergeProps({ key: 0, ref: $options.containerRef, "class": $props.level === 0 ? _ctx.cx("rootList") : _ctx.cx("submenu"), tabindex: $props.tabindex }, $props.level === 0 ? _ctx.ptm("rootList") : _ctx.ptm("submenu")), [(openBlock(true), createElementBlock(Fragment, null, renderList($props.items, function(processedItem, index) { return openBlock(), createElementBlock(Fragment, { key: $options.getItemKey(processedItem) }, [$options.isItemVisible(processedItem) && !$options.getItemProp(processedItem, "separator") ? (openBlock(), createElementBlock("li", mergeProps({ key: 0, id: $options.getItemId(processedItem), style: $options.getItemProp(processedItem, "style"), "class": [_ctx.cx("item", { processedItem }), $options.getItemProp(processedItem, "class")], role: "menuitem", "aria-label": $options.getItemLabel(processedItem), "aria-disabled": $options.isItemDisabled(processedItem) || void 0, "aria-expanded": $options.isItemGroup(processedItem) ? $options.isItemActive(processedItem) : void 0, "aria-haspopup": $options.isItemGroup(processedItem) && !$options.getItemProp(processedItem, "to") ? "menu" : void 0, "aria-level": $props.level + 1, "aria-setsize": $options.getAriaSetSize(), "aria-posinset": $options.getAriaPosInset(index), ref_for: true }, $options.getPTOptions(processedItem, index, "item"), { "data-p-active": $options.isItemActive(processedItem), "data-p-focused": $options.isItemFocused(processedItem), "data-p-disabled": $options.isItemDisabled(processedItem) }), [createBaseVNode("div", mergeProps({ "class": _ctx.cx("itemContent"), onClick: /* @__PURE__ */ __name(function onClick($event) { return $options.onItemClick($event, processedItem); }, "onClick"), onMouseenter: /* @__PURE__ */ __name(function onMouseenter($event) { return $options.onItemMouseEnter($event, processedItem); }, "onMouseenter"), onMousemove: /* @__PURE__ */ __name(function onMousemove($event) { return $options.onItemMouseMove($event, processedItem); }, "onMousemove"), ref_for: true }, $options.getPTOptions(processedItem, index, "itemContent")), [!$props.templates.item ? withDirectives((openBlock(), createElementBlock("a", mergeProps({ key: 0, href: $options.getItemProp(processedItem, "url"), "class": _ctx.cx("itemLink"), target: $options.getItemProp(processedItem, "target"), tabindex: "-1", ref_for: true }, $options.getPTOptions(processedItem, index, "itemLink")), [$props.templates.itemicon ? (openBlock(), createBlock(resolveDynamicComponent($props.templates.itemicon), { key: 0, item: processedItem.item, "class": normalizeClass(_ctx.cx("itemIcon")) }, null, 8, ["item", "class"])) : $options.getItemProp(processedItem, "icon") ? (openBlock(), createElementBlock("span", mergeProps({ key: 1, "class": [_ctx.cx("itemIcon"), $options.getItemProp(processedItem, "icon")], ref_for: true }, $options.getPTOptions(processedItem, index, "itemIcon")), null, 16)) : createCommentVNode("", true), createBaseVNode("span", mergeProps({ id: $options.getItemLabelId(processedItem), "class": _ctx.cx("itemLabel"), ref_for: true }, $options.getPTOptions(processedItem, index, "itemLabel")), toDisplayString($options.getItemLabel(processedItem)), 17, _hoisted_5), $options.getItemProp(processedItem, "items") ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [$props.templates.submenuicon ? (openBlock(), createBlock(resolveDynamicComponent($props.templates.submenuicon), mergeProps({ key: 0, "class": _ctx.cx("submenuIcon"), active: $options.isItemActive(processedItem), ref_for: true }, $options.getPTOptions(processedItem, index, "submenuIcon")), null, 16, ["class", "active"])) : (openBlock(), createBlock(_component_AngleRightIcon, mergeProps({ key: 1, "class": _ctx.cx("submenuIcon"), ref_for: true }, $options.getPTOptions(processedItem, index, "submenuIcon")), null, 16, ["class"]))], 64)) : createCommentVNode("", true)], 16, _hoisted_4)), [[_directive_ripple]]) : (openBlock(), createBlock(resolveDynamicComponent($props.templates.item), { key: 1, item: processedItem.item, hasSubmenu: $options.getItemProp(processedItem, "items"), label: $options.getItemLabel(processedItem), props: $options.getMenuItemProps(processedItem, index) }, null, 8, ["item", "hasSubmenu", "label", "props"]))], 16, _hoisted_3), $options.isItemVisible(processedItem) && $options.isItemGroup(processedItem) ? (openBlock(), createBlock(_component_TieredMenuSub, { key: 0, id: $options.getItemId(processedItem) + "_list", style: normalizeStyle(_ctx.sx("submenu", true, { processedItem })), "aria-labelledby": $options.getItemLabelId(processedItem), role: "menu", menuId: $props.menuId, focusedItemId: $props.focusedItemId, items: processedItem.items, templates: $props.templates, activeItemPath: $props.activeItemPath, level: $props.level + 1, visible: $options.isItemActive(processedItem) && $options.isItemGroup(processedItem), pt: _ctx.pt, unstyled: _ctx.unstyled, onItemClick: _cache[0] || (_cache[0] = function($event) { return _ctx.$emit("item-click", $event); }), onItemMouseenter: _cache[1] || (_cache[1] = function($event) { return _ctx.$emit("item-mouseenter", $event); }), onItemMousemove: _cache[2] || (_cache[2] = function($event) { return _ctx.$emit("item-mousemove", $event); }) }, null, 8, ["id", "style", "aria-labelledby", "menuId", "focusedItemId", "items", "templates", "activeItemPath", "level", "visible", "pt", "unstyled"])) : createCommentVNode("", true)], 16, _hoisted_2$1)) : createCommentVNode("", true), $options.isItemVisible(processedItem) && $options.getItemProp(processedItem, "separator") ? (openBlock(), createElementBlock("li", mergeProps({ key: 1, id: $options.getItemId(processedItem), style: $options.getItemProp(processedItem, "style"), "class": [_ctx.cx("separator"), $options.getItemProp(processedItem, "class")], role: "separator", ref_for: true }, _ctx.ptm("separator")), null, 16, _hoisted_6)) : createCommentVNode("", true)], 64); }), 128))], 16, _hoisted_1$1$1)) : createCommentVNode("", true)]; }), _: 1 }, 16, ["onEnter"]); } __name(render$1, "render$1"); script$1$1.render = render$1; var script$3 = { name: "TieredMenu", "extends": script$2, inheritAttrs: false, emits: ["focus", "blur", "before-show", "before-hide", "hide", "show"], outsideClickListener: null, scrollHandler: null, resizeListener: null, target: null, container: null, menubar: null, searchTimeout: null, searchValue: null, data: /* @__PURE__ */ __name(function data7() { return { id: this.$attrs.id, focused: false, focusedItemInfo: { index: -1, level: 0, parentKey: "" }, activeItemPath: [], visible: !this.popup, submenuVisible: false, dirty: false }; }, "data"), watch: { "$attrs.id": /* @__PURE__ */ __name(function $attrsId4(newValue) { this.id = newValue || UniqueComponentId(); }, "$attrsId"), activeItemPath: /* @__PURE__ */ __name(function activeItemPath2(newPath) { if (!this.popup) { if (isNotEmpty(newPath)) { this.bindOutsideClickListener(); this.bindResizeListener(); } else { this.unbindOutsideClickListener(); this.unbindResizeListener(); } } }, "activeItemPath") }, mounted: /* @__PURE__ */ __name(function mounted7() { this.id = this.id || UniqueComponentId(); }, "mounted"), beforeUnmount: /* @__PURE__ */ __name(function beforeUnmount6() { this.unbindOutsideClickListener(); this.unbindResizeListener(); if (this.scrollHandler) { this.scrollHandler.destroy(); this.scrollHandler = null; } if (this.container && this.autoZIndex) { ZIndex.clear(this.container); } this.target = null; this.container = null; }, "beforeUnmount"), methods: { getItemProp: /* @__PURE__ */ __name(function getItemProp4(item3, name) { return item3 ? resolve(item3[name]) : void 0; }, "getItemProp"), getItemLabel: /* @__PURE__ */ __name(function getItemLabel4(item3) { return this.getItemProp(item3, "label"); }, "getItemLabel"), isItemDisabled: /* @__PURE__ */ __name(function isItemDisabled4(item3) { return this.getItemProp(item3, "disabled"); }, "isItemDisabled"), isItemVisible: /* @__PURE__ */ __name(function isItemVisible4(item3) { return this.getItemProp(item3, "visible") !== false; }, "isItemVisible"), isItemGroup: /* @__PURE__ */ __name(function isItemGroup4(item3) { return isNotEmpty(this.getItemProp(item3, "items")); }, "isItemGroup"), isItemSeparator: /* @__PURE__ */ __name(function isItemSeparator2(item3) { return this.getItemProp(item3, "separator"); }, "isItemSeparator"), getProccessedItemLabel: /* @__PURE__ */ __name(function getProccessedItemLabel2(processedItem) { return processedItem ? this.getItemLabel(processedItem.item) : void 0; }, "getProccessedItemLabel"), isProccessedItemGroup: /* @__PURE__ */ __name(function isProccessedItemGroup2(processedItem) { return processedItem && isNotEmpty(processedItem.items); }, "isProccessedItemGroup"), toggle: /* @__PURE__ */ __name(function toggle3(event) { this.visible ? this.hide(event, true) : this.show(event); }, "toggle"), show: /* @__PURE__ */ __name(function show3(event, isFocus) { if (this.popup) { this.$emit("before-show"); this.visible = true; this.target = this.target || event.currentTarget; this.relatedTarget = event.relatedTarget || null; } isFocus && focus(this.menubar); }, "show"), hide: /* @__PURE__ */ __name(function hide3(event, isFocus) { if (this.popup) { this.$emit("before-hide"); this.visible = false; } this.activeItemPath = []; this.focusedItemInfo = { index: -1, level: 0, parentKey: "" }; isFocus && focus(this.relatedTarget || this.target || this.menubar); this.dirty = false; }, "hide"), onFocus: /* @__PURE__ */ __name(function onFocus3(event) { this.focused = true; if (!this.popup) { this.focusedItemInfo = this.focusedItemInfo.index !== -1 ? this.focusedItemInfo : { index: this.findFirstFocusedItemIndex(), level: 0, parentKey: "" }; } this.$emit("focus", event); }, "onFocus"), onBlur: /* @__PURE__ */ __name(function onBlur3(event) { this.focused = false; this.focusedItemInfo = { index: -1, level: 0, parentKey: "" }; this.searchValue = ""; this.dirty = false; this.$emit("blur", event); }, "onBlur"), onKeyDown: /* @__PURE__ */ __name(function onKeyDown4(event) { if (this.disabled) { event.preventDefault(); return; } var metaKey = event.metaKey || event.ctrlKey; switch (event.code) { case "ArrowDown": this.onArrowDownKey(event); break; case "ArrowUp": this.onArrowUpKey(event); break; case "ArrowLeft": this.onArrowLeftKey(event); break; case "ArrowRight": this.onArrowRightKey(event); break; case "Home": this.onHomeKey(event); break; case "End": this.onEndKey(event); break; case "Space": this.onSpaceKey(event); break; case "Enter": case "NumpadEnter": this.onEnterKey(event); break; case "Escape": this.onEscapeKey(event); break; case "Tab": this.onTabKey(event); break; case "PageDown": case "PageUp": case "Backspace": case "ShiftLeft": case "ShiftRight": break; default: if (!metaKey && isPrintableCharacter(event.key)) { this.searchItems(event, event.key); } break; } }, "onKeyDown"), onItemChange: /* @__PURE__ */ __name(function onItemChange2(event) { var processedItem = event.processedItem, isFocus = event.isFocus; if (isEmpty(processedItem)) return; var index = processedItem.index, key = processedItem.key, level = processedItem.level, parentKey = processedItem.parentKey, items = processedItem.items; var grouped = isNotEmpty(items); var activeItemPath3 = this.activeItemPath.filter(function(p) { return p.parentKey !== parentKey && p.parentKey !== key; }); if (grouped) { activeItemPath3.push(processedItem); this.submenuVisible = true; } this.focusedItemInfo = { index, level, parentKey }; this.activeItemPath = activeItemPath3; grouped && (this.dirty = true); isFocus && focus(this.menubar); }, "onItemChange"), onOverlayClick: /* @__PURE__ */ __name(function onOverlayClick2(event) { OverlayEventBus.emit("overlay-click", { originalEvent: event, target: this.target }); }, "onOverlayClick"), onItemClick: /* @__PURE__ */ __name(function onItemClick4(event) { var originalEvent = event.originalEvent, processedItem = event.processedItem; var grouped = this.isProccessedItemGroup(processedItem); var root11 = isEmpty(processedItem.parent); var selected = this.isSelected(processedItem); if (selected) { var index = processedItem.index, key = processedItem.key, level = processedItem.level, parentKey = processedItem.parentKey; this.activeItemPath = this.activeItemPath.filter(function(p) { return key !== p.key && key.startsWith(p.key); }); this.focusedItemInfo = { index, level, parentKey }; this.dirty = !root11; focus(this.menubar); } else { if (grouped) { this.onItemChange(event); } else { var rootProcessedItem = root11 ? processedItem : this.activeItemPath.find(function(p) { return p.parentKey === ""; }); this.hide(originalEvent); this.changeFocusedItemIndex(originalEvent, rootProcessedItem ? rootProcessedItem.index : -1); focus(this.menubar); } } }, "onItemClick"), onItemMouseEnter: /* @__PURE__ */ __name(function onItemMouseEnter4(event) { if (this.dirty) { this.onItemChange(event); } }, "onItemMouseEnter"), onItemMouseMove: /* @__PURE__ */ __name(function onItemMouseMove4(event) { if (this.focused) { this.changeFocusedItemIndex(event, event.processedItem.index); } }, "onItemMouseMove"), onArrowDownKey: /* @__PURE__ */ __name(function onArrowDownKey3(event) { var itemIndex = this.focusedItemInfo.index !== -1 ? this.findNextItemIndex(this.focusedItemInfo.index) : this.findFirstFocusedItemIndex(); this.changeFocusedItemIndex(event, itemIndex); event.preventDefault(); }, "onArrowDownKey"), onArrowUpKey: /* @__PURE__ */ __name(function onArrowUpKey3(event) { if (event.altKey) { if (this.focusedItemInfo.index !== -1) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var grouped = this.isProccessedItemGroup(processedItem); !grouped && this.onItemChange({ originalEvent: event, processedItem }); } this.popup && this.hide(event, true); event.preventDefault(); } else { var itemIndex = this.focusedItemInfo.index !== -1 ? this.findPrevItemIndex(this.focusedItemInfo.index) : this.findLastFocusedItemIndex(); this.changeFocusedItemIndex(event, itemIndex); event.preventDefault(); } }, "onArrowUpKey"), onArrowLeftKey: /* @__PURE__ */ __name(function onArrowLeftKey3(event) { var _this = this; var processedItem = this.visibleItems[this.focusedItemInfo.index]; var parentItem = this.activeItemPath.find(function(p) { return p.key === processedItem.parentKey; }); var root11 = isEmpty(processedItem.parent); if (!root11) { this.focusedItemInfo = { index: -1, parentKey: parentItem ? parentItem.parentKey : "" }; this.searchValue = ""; this.onArrowDownKey(event); } this.activeItemPath = this.activeItemPath.filter(function(p) { return p.parentKey !== _this.focusedItemInfo.parentKey; }); event.preventDefault(); }, "onArrowLeftKey"), onArrowRightKey: /* @__PURE__ */ __name(function onArrowRightKey3(event) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var grouped = this.isProccessedItemGroup(processedItem); if (grouped) { this.onItemChange({ originalEvent: event, processedItem }); this.focusedItemInfo = { index: -1, parentKey: processedItem.key }; this.searchValue = ""; this.onArrowDownKey(event); } event.preventDefault(); }, "onArrowRightKey"), onHomeKey: /* @__PURE__ */ __name(function onHomeKey3(event) { this.changeFocusedItemIndex(event, this.findFirstItemIndex()); event.preventDefault(); }, "onHomeKey"), onEndKey: /* @__PURE__ */ __name(function onEndKey3(event) { this.changeFocusedItemIndex(event, this.findLastItemIndex()); event.preventDefault(); }, "onEndKey"), onEnterKey: /* @__PURE__ */ __name(function onEnterKey3(event) { if (this.focusedItemInfo.index !== -1) { var element = findSingle(this.menubar, 'li[id="'.concat("".concat(this.focusedItemId), '"]')); var anchorElement = element && findSingle(element, '[data-pc-section="itemlink"]'); anchorElement ? anchorElement.click() : element && element.click(); if (!this.popup) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var grouped = this.isProccessedItemGroup(processedItem); !grouped && (this.focusedItemInfo.index = this.findFirstFocusedItemIndex()); } } event.preventDefault(); }, "onEnterKey"), onSpaceKey: /* @__PURE__ */ __name(function onSpaceKey2(event) { this.onEnterKey(event); }, "onSpaceKey"), onEscapeKey: /* @__PURE__ */ __name(function onEscapeKey3(event) { if (this.popup || this.focusedItemInfo.level !== 0) { var _focusedItemInfo = this.focusedItemInfo; this.hide(event, false); this.focusedItemInfo = { index: Number(_focusedItemInfo.parentKey.split("_")[0]), level: 0, parentKey: "" }; this.popup && focus(this.target); } event.preventDefault(); }, "onEscapeKey"), onTabKey: /* @__PURE__ */ __name(function onTabKey3(event) { if (this.focusedItemInfo.index !== -1) { var processedItem = this.visibleItems[this.focusedItemInfo.index]; var grouped = this.isProccessedItemGroup(processedItem); !grouped && this.onItemChange({ originalEvent: event, processedItem }); } this.hide(); }, "onTabKey"), onEnter: /* @__PURE__ */ __name(function onEnter3(el) { if (this.autoZIndex) { ZIndex.set("menu", el, this.baseZIndex + this.$primevue.config.zIndex.menu); } addStyle(el, { position: "absolute", top: "0", left: "0" }); this.alignOverlay(); focus(this.menubar); this.scrollInView(); }, "onEnter"), onAfterEnter: /* @__PURE__ */ __name(function onAfterEnter() { this.bindOutsideClickListener(); this.bindScrollListener(); this.bindResizeListener(); this.$emit("show"); }, "onAfterEnter"), onLeave: /* @__PURE__ */ __name(function onLeave2() { this.unbindOutsideClickListener(); this.unbindScrollListener(); this.unbindResizeListener(); this.$emit("hide"); this.container = null; this.dirty = false; }, "onLeave"), onAfterLeave: /* @__PURE__ */ __name(function onAfterLeave(el) { if (this.autoZIndex) { ZIndex.clear(el); } }, "onAfterLeave"), alignOverlay: /* @__PURE__ */ __name(function alignOverlay2() { absolutePosition(this.container, this.target); var targetWidth = getOuterWidth(this.target); if (targetWidth > getOuterWidth(this.container)) { this.container.style.minWidth = getOuterWidth(this.target) + "px"; } }, "alignOverlay"), bindOutsideClickListener: /* @__PURE__ */ __name(function bindOutsideClickListener3() { var _this2 = this; if (!this.outsideClickListener) { this.outsideClickListener = function(event) { var isOutsideContainer = _this2.container && !_this2.container.contains(event.target); var isOutsideTarget = _this2.popup ? !(_this2.target && (_this2.target === event.target || _this2.target.contains(event.target))) : true; if (isOutsideContainer && isOutsideTarget) { _this2.hide(); } }; document.addEventListener("click", this.outsideClickListener); } }, "bindOutsideClickListener"), unbindOutsideClickListener: /* @__PURE__ */ __name(function unbindOutsideClickListener3() { if (this.outsideClickListener) { document.removeEventListener("click", this.outsideClickListener); this.outsideClickListener = null; } }, "unbindOutsideClickListener"), bindScrollListener: /* @__PURE__ */ __name(function bindScrollListener2() { var _this3 = this; if (!this.scrollHandler) { this.scrollHandler = new ConnectedOverlayScrollHandler(this.target, function(event) { _this3.hide(event, true); }); } this.scrollHandler.bindScrollListener(); }, "bindScrollListener"), unbindScrollListener: /* @__PURE__ */ __name(function unbindScrollListener2() { if (this.scrollHandler) { this.scrollHandler.unbindScrollListener(); } }, "unbindScrollListener"), bindResizeListener: /* @__PURE__ */ __name(function bindResizeListener3() { var _this4 = this; if (!this.resizeListener) { this.resizeListener = function(event) { if (!isTouchDevice()) { _this4.hide(event, true); } }; window.addEventListener("resize", this.resizeListener); } }, "bindResizeListener"), unbindResizeListener: /* @__PURE__ */ __name(function unbindResizeListener3() { if (this.resizeListener) { window.removeEventListener("resize", this.resizeListener); this.resizeListener = null; } }, "unbindResizeListener"), isItemMatched: /* @__PURE__ */ __name(function isItemMatched2(processedItem) { var _this$getProccessedIt; return this.isValidItem(processedItem) && ((_this$getProccessedIt = this.getProccessedItemLabel(processedItem)) === null || _this$getProccessedIt === void 0 ? void 0 : _this$getProccessedIt.toLocaleLowerCase().startsWith(this.searchValue.toLocaleLowerCase())); }, "isItemMatched"), isValidItem: /* @__PURE__ */ __name(function isValidItem2(processedItem) { return !!processedItem && !this.isItemDisabled(processedItem.item) && !this.isItemSeparator(processedItem.item) && this.isItemVisible(processedItem.item); }, "isValidItem"), isValidSelectedItem: /* @__PURE__ */ __name(function isValidSelectedItem2(processedItem) { return this.isValidItem(processedItem) && this.isSelected(processedItem); }, "isValidSelectedItem"), isSelected: /* @__PURE__ */ __name(function isSelected3(processedItem) { return this.activeItemPath.some(function(p) { return p.key === processedItem.key; }); }, "isSelected"), findFirstItemIndex: /* @__PURE__ */ __name(function findFirstItemIndex2() { var _this5 = this; return this.visibleItems.findIndex(function(processedItem) { return _this5.isValidItem(processedItem); }); }, "findFirstItemIndex"), findLastItemIndex: /* @__PURE__ */ __name(function findLastItemIndex2() { var _this6 = this; return findLastIndex(this.visibleItems, function(processedItem) { return _this6.isValidItem(processedItem); }); }, "findLastItemIndex"), findNextItemIndex: /* @__PURE__ */ __name(function findNextItemIndex2(index) { var _this7 = this; var matchedItemIndex = index < this.visibleItems.length - 1 ? this.visibleItems.slice(index + 1).findIndex(function(processedItem) { return _this7.isValidItem(processedItem); }) : -1; return matchedItemIndex > -1 ? matchedItemIndex + index + 1 : index; }, "findNextItemIndex"), findPrevItemIndex: /* @__PURE__ */ __name(function findPrevItemIndex2(index) { var _this8 = this; var matchedItemIndex = index > 0 ? findLastIndex(this.visibleItems.slice(0, index), function(processedItem) { return _this8.isValidItem(processedItem); }) : -1; return matchedItemIndex > -1 ? matchedItemIndex : index; }, "findPrevItemIndex"), findSelectedItemIndex: /* @__PURE__ */ __name(function findSelectedItemIndex2() { var _this9 = this; return this.visibleItems.findIndex(function(processedItem) { return _this9.isValidSelectedItem(processedItem); }); }, "findSelectedItemIndex"), findFirstFocusedItemIndex: /* @__PURE__ */ __name(function findFirstFocusedItemIndex2() { var selectedIndex = this.findSelectedItemIndex(); return selectedIndex < 0 ? this.findFirstItemIndex() : selectedIndex; }, "findFirstFocusedItemIndex"), findLastFocusedItemIndex: /* @__PURE__ */ __name(function findLastFocusedItemIndex2() { var selectedIndex = this.findSelectedItemIndex(); return selectedIndex < 0 ? this.findLastItemIndex() : selectedIndex; }, "findLastFocusedItemIndex"), searchItems: /* @__PURE__ */ __name(function searchItems2(event, _char) { var _this10 = this; this.searchValue = (this.searchValue || "") + _char; var itemIndex = -1; var matched = false; if (this.focusedItemInfo.index !== -1) { itemIndex = this.visibleItems.slice(this.focusedItemInfo.index).findIndex(function(processedItem) { return _this10.isItemMatched(processedItem); }); itemIndex = itemIndex === -1 ? this.visibleItems.slice(0, this.focusedItemInfo.index).findIndex(function(processedItem) { return _this10.isItemMatched(processedItem); }) : itemIndex + this.focusedItemInfo.index; } else { itemIndex = this.visibleItems.findIndex(function(processedItem) { return _this10.isItemMatched(processedItem); }); } if (itemIndex !== -1) { matched = true; } if (itemIndex === -1 && this.focusedItemInfo.index === -1) { itemIndex = this.findFirstFocusedItemIndex(); } if (itemIndex !== -1) { this.changeFocusedItemIndex(event, itemIndex); } if (this.searchTimeout) { clearTimeout(this.searchTimeout); } this.searchTimeout = setTimeout(function() { _this10.searchValue = ""; _this10.searchTimeout = null; }, 500); return matched; }, "searchItems"), changeFocusedItemIndex: /* @__PURE__ */ __name(function changeFocusedItemIndex2(event, index) { if (this.focusedItemInfo.index !== index) { this.focusedItemInfo.index = index; this.scrollInView(); } }, "changeFocusedItemIndex"), scrollInView: /* @__PURE__ */ __name(function scrollInView3() { var index = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : -1; var id = index !== -1 ? "".concat(this.id, "_").concat(index) : this.focusedItemId; var element = findSingle(this.menubar, 'li[id="'.concat(id, '"]')); if (element) { element.scrollIntoView && element.scrollIntoView({ block: "nearest", inline: "start" }); } }, "scrollInView"), createProcessedItems: /* @__PURE__ */ __name(function createProcessedItems2(items) { var _this11 = this; var level = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0; var parent = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {}; var parentKey = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : ""; var processedItems3 = []; items && items.forEach(function(item3, index) { var key = (parentKey !== "" ? parentKey + "_" : "") + index; var newItem = { item: item3, index, level, key, parent, parentKey }; newItem["items"] = _this11.createProcessedItems(item3.items, level + 1, newItem, key); processedItems3.push(newItem); }); return processedItems3; }, "createProcessedItems"), containerRef: /* @__PURE__ */ __name(function containerRef3(el) { this.container = el; }, "containerRef"), menubarRef: /* @__PURE__ */ __name(function menubarRef2(el) { this.menubar = el ? el.$el : void 0; }, "menubarRef") }, computed: { processedItems: /* @__PURE__ */ __name(function processedItems2() { return this.createProcessedItems(this.model || []); }, "processedItems"), visibleItems: /* @__PURE__ */ __name(function visibleItems2() { var _this12 = this; var processedItem = this.activeItemPath.find(function(p) { return p.key === _this12.focusedItemInfo.parentKey; }); return processedItem ? processedItem.items : this.processedItems; }, "visibleItems"), focusedItemId: /* @__PURE__ */ __name(function focusedItemId2() { return this.focusedItemInfo.index !== -1 ? "".concat(this.id).concat(isNotEmpty(this.focusedItemInfo.parentKey) ? "_" + this.focusedItemInfo.parentKey : "", "_").concat(this.focusedItemInfo.index) : null; }, "focusedItemId") }, components: { TieredMenuSub: script$1$1, Portal: script$h } }; var _hoisted_1$3 = ["id"]; function render$2(_ctx, _cache, $props, $setup, $data, $options) { var _component_TieredMenuSub = resolveComponent("TieredMenuSub"); var _component_Portal = resolveComponent("Portal"); return openBlock(), createBlock(_component_Portal, { appendTo: _ctx.appendTo, disabled: !_ctx.popup }, { "default": withCtx(function() { return [createVNode(Transition, mergeProps({ name: "p-connected-overlay", onEnter: $options.onEnter, onAfterEnter: $options.onAfterEnter, onLeave: $options.onLeave, onAfterLeave: $options.onAfterLeave }, _ctx.ptm("transition")), { "default": withCtx(function() { return [$data.visible ? (openBlock(), createElementBlock("div", mergeProps({ key: 0, ref: $options.containerRef, id: $data.id, "class": _ctx.cx("root"), onClick: _cache[0] || (_cache[0] = function() { return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments); }) }, _ctx.ptmi("root")), [_ctx.$slots.start ? (openBlock(), createElementBlock("div", mergeProps({ key: 0, "class": _ctx.cx("start") }, _ctx.ptm("start")), [renderSlot(_ctx.$slots, "start")], 16)) : createCommentVNode("", true), createVNode(_component_TieredMenuSub, { ref: $options.menubarRef, id: $data.id + "_list", tabindex: !_ctx.disabled ? _ctx.tabindex : -1, role: "menubar", "aria-label": _ctx.ariaLabel, "aria-labelledby": _ctx.ariaLabelledby, "aria-disabled": _ctx.disabled || void 0, "aria-orientation": "vertical", "aria-activedescendant": $data.focused ? $options.focusedItemId : void 0, menuId: $data.id, focusedItemId: $data.focused ? $options.focusedItemId : void 0, items: $options.processedItems, templates: _ctx.$slots, activeItemPath: $data.activeItemPath, level: 0, visible: $data.submenuVisible, pt: _ctx.pt, unstyled: _ctx.unstyled, onFocus: $options.onFocus, onBlur: $options.onBlur, onKeydown: $options.onKeyDown, onItemClick: $options.onItemClick, onItemMouseenter: $options.onItemMouseEnter, onItemMousemove: $options.onItemMouseMove }, null, 8, ["id", "tabindex", "aria-label", "aria-labelledby", "aria-disabled", "aria-activedescendant", "menuId", "focusedItemId", "items", "templates", "activeItemPath", "visible", "pt", "unstyled", "onFocus", "onBlur", "onKeydown", "onItemClick", "onItemMouseenter", "onItemMousemove"]), _ctx.$slots.end ? (openBlock(), createElementBlock("div", mergeProps({ key: 1, "class": _ctx.cx("end") }, _ctx.ptm("end")), [renderSlot(_ctx.$slots, "end")], 16)) : createCommentVNode("", true)], 16, _hoisted_1$3)) : createCommentVNode("", true)]; }), _: 3 }, 16, ["onEnter", "onAfterEnter", "onLeave", "onAfterLeave"])]; }), _: 3 }, 8, ["appendTo", "disabled"]); } __name(render$2, "render$2"); script$3.render = render$2; var theme9 = /* @__PURE__ */ __name(function theme10(_ref) { var dt = _ref.dt; return "\n.p-splitbutton {\n display: inline-flex;\n position: relative;\n border-radius: ".concat(dt("splitbutton.border.radius"), ";\n}\n\n.p-splitbutton-button {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: 0 none;\n}\n\n.p-splitbutton-button:focus-visible,\n.p-splitbutton-dropdown:focus-visible {\n z-index: 1;\n}\n\n.p-splitbutton-button:not(:disabled):hover,\n.p-splitbutton-button:not(:disabled):active {\n border-right: 0 none;\n}\n\n.p-splitbutton-dropdown {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.p-splitbutton .p-menu {\n min-width: 100%;\n}\n\n.p-splitbutton-fluid {\n display: flex;\n}\n\n.p-splitbutton-rounded .p-splitbutton-dropdown {\n border-top-right-radius: ").concat(dt("splitbutton.rounded.border.radius"), ";\n border-bottom-right-radius: ").concat(dt("splitbutton.rounded.border.radius"), ";\n}\n\n.p-splitbutton-rounded .p-splitbutton-button {\n border-top-left-radius: ").concat(dt("splitbutton.rounded.border.radius"), ";\n border-bottom-left-radius: ").concat(dt("splitbutton.rounded.border.radius"), ";\n}\n\n.p-splitbutton-raised {\n box-shadow: ").concat(dt("splitbutton.raised.shadow"), ";\n}\n"); }, "theme"); var classes = { root: /* @__PURE__ */ __name(function root10(_ref2) { var instance = _ref2.instance, props = _ref2.props; return ["p-splitbutton p-component", { "p-splitbutton-raised": props.raised, "p-splitbutton-rounded": props.rounded, "p-splitbutton-fluid": instance.hasFluid }]; }, "root"), pcButton: "p-splitbutton-button", pcDropdown: "p-splitbutton-dropdown" }; var SplitButtonStyle = BaseStyle.extend({ name: "splitbutton", theme: theme9, classes }); var script$1 = { name: "BaseSplitButton", "extends": script$e, props: { label: { type: String, "default": null }, icon: { type: String, "default": null }, model: { type: Array, "default": null }, autoZIndex: { type: Boolean, "default": true }, baseZIndex: { type: Number, "default": 0 }, appendTo: { type: [String, Object], "default": "body" }, disabled: { type: Boolean, "default": false }, fluid: { type: Boolean, "default": null }, "class": { type: null, "default": null }, style: { type: null, "default": null }, buttonProps: { type: null, "default": null }, menuButtonProps: { type: null, "default": null }, menuButtonIcon: { type: String, "default": void 0 }, dropdownIcon: { type: String, "default": void 0 }, severity: { type: String, "default": null }, raised: { type: Boolean, "default": false }, rounded: { type: Boolean, "default": false }, text: { type: Boolean, "default": false }, outlined: { type: Boolean, "default": false }, size: { type: String, "default": null }, plain: { type: Boolean, "default": false } }, style: SplitButtonStyle, provide: /* @__PURE__ */ __name(function provide11() { return { $pcSplitButton: this, $parentInstance: this }; }, "provide") }; var script = { name: "SplitButton", "extends": script$1, inheritAttrs: false, emits: ["click"], inject: { $pcFluid: { "default": null } }, data: /* @__PURE__ */ __name(function data8() { return { id: this.$attrs.id, isExpanded: false }; }, "data"), watch: { "$attrs.id": /* @__PURE__ */ __name(function $attrsId5(newValue) { this.id = newValue || UniqueComponentId(); }, "$attrsId") }, mounted: /* @__PURE__ */ __name(function mounted8() { var _this = this; this.id = this.id || UniqueComponentId(); this.$watch("$refs.menu.visible", function(newValue) { _this.isExpanded = newValue; }); }, "mounted"), methods: { onDropdownButtonClick: /* @__PURE__ */ __name(function onDropdownButtonClick(event) { if (event) { event.preventDefault(); } this.$refs.menu.toggle({ currentTarget: this.$el, relatedTarget: this.$refs.button.$el }); this.isExpanded = this.$refs.menu.visible; }, "onDropdownButtonClick"), onDropdownKeydown: /* @__PURE__ */ __name(function onDropdownKeydown(event) { if (event.code === "ArrowDown" || event.code === "ArrowUp") { this.onDropdownButtonClick(); event.preventDefault(); } }, "onDropdownKeydown"), onDefaultButtonClick: /* @__PURE__ */ __name(function onDefaultButtonClick(event) { if (this.isExpanded) { this.$refs.menu.hide(event); } this.$emit("click", event); }, "onDefaultButtonClick") }, computed: { containerClass: /* @__PURE__ */ __name(function containerClass() { return [this.cx("root"), this["class"]]; }, "containerClass"), hasFluid: /* @__PURE__ */ __name(function hasFluid2() { return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid; }, "hasFluid") }, components: { PVSButton: script$d, PVSMenu: script$3, ChevronDownIcon: script$i } }; var _hoisted_1$2 = ["data-p-severity"]; function render(_ctx, _cache, $props, $setup, $data, $options) { var _component_PVSButton = resolveComponent("PVSButton"); var _component_PVSMenu = resolveComponent("PVSMenu"); return openBlock(), createElementBlock("div", mergeProps({ "class": $options.containerClass, style: _ctx.style }, _ctx.ptmi("root"), { "data-p-severity": _ctx.severity }), [createVNode(_component_PVSButton, mergeProps({ type: "button", "class": _ctx.cx("pcButton"), label: _ctx.label, disabled: _ctx.disabled, severity: _ctx.severity, text: _ctx.text, icon: _ctx.icon, outlined: _ctx.outlined, size: _ctx.size, fluid: _ctx.fluid, "aria-label": _ctx.label, onClick: $options.onDefaultButtonClick }, _ctx.buttonProps, { pt: _ctx.ptm("pcButton"), unstyled: _ctx.unstyled }), createSlots({ "default": withCtx(function() { return [renderSlot(_ctx.$slots, "default")]; }), _: 2 }, [_ctx.$slots.icon ? { name: "icon", fn: withCtx(function(slotProps) { return [renderSlot(_ctx.$slots, "icon", { "class": normalizeClass(slotProps["class"]) }, function() { return [createBaseVNode("span", mergeProps({ "class": [_ctx.icon, slotProps["class"]] }, _ctx.ptm("pcButton")["icon"], { "data-pc-section": "buttonicon" }), null, 16)]; })]; }), key: "0" } : void 0]), 1040, ["class", "label", "disabled", "severity", "text", "icon", "outlined", "size", "fluid", "aria-label", "onClick", "pt", "unstyled"]), createVNode(_component_PVSButton, mergeProps({ ref: "button", type: "button", "class": _ctx.cx("pcDropdown"), disabled: _ctx.disabled, "aria-haspopup": "true", "aria-expanded": $data.isExpanded, "aria-controls": $data.id + "_overlay", onClick: $options.onDropdownButtonClick, onKeydown: $options.onDropdownKeydown, severity: _ctx.severity, text: _ctx.text, outlined: _ctx.outlined, size: _ctx.size, unstyled: _ctx.unstyled }, _ctx.menuButtonProps, { pt: _ctx.ptm("pcDropdown") }), { icon: withCtx(function(slotProps) { return [renderSlot(_ctx.$slots, _ctx.$slots.dropdownicon ? "dropdownicon" : "menubuttonicon", { "class": normalizeClass(slotProps["class"]) }, function() { return [(openBlock(), createBlock(resolveDynamicComponent(_ctx.menuButtonIcon || _ctx.dropdownIcon ? "span" : "ChevronDownIcon"), mergeProps({ "class": [_ctx.dropdownIcon || _ctx.menuButtonIcon, slotProps["class"]] }, _ctx.ptm("pcDropdown")["icon"], { "data-pc-section": "menubuttonicon" }), null, 16, ["class"]))]; })]; }), _: 3 }, 16, ["class", "disabled", "aria-expanded", "aria-controls", "onClick", "onKeydown", "severity", "text", "outlined", "size", "unstyled", "pt"]), createVNode(_component_PVSMenu, { ref: "menu", id: $data.id + "_overlay", model: _ctx.model, popup: true, autoZIndex: _ctx.autoZIndex, baseZIndex: _ctx.baseZIndex, appendTo: _ctx.appendTo, unstyled: _ctx.unstyled, pt: _ctx.ptm("pcMenu") }, createSlots({ _: 2 }, [_ctx.$slots.menuitemicon ? { name: "itemicon", fn: withCtx(function(slotProps) { return [renderSlot(_ctx.$slots, "menuitemicon", { item: slotProps.item, "class": normalizeClass(slotProps["class"]) })]; }), key: "0" } : void 0, _ctx.$slots.item ? { name: "item", fn: withCtx(function(slotProps) { return [renderSlot(_ctx.$slots, "item", { item: slotProps.item, hasSubmenu: slotProps.hasSubmenu, label: slotProps.label, props: slotProps.props })]; }), key: "1" } : void 0]), 1032, ["id", "model", "autoZIndex", "baseZIndex", "appendTo", "unstyled", "pt"])], 16, _hoisted_1$2); } __name(render, "render"); script.render = render; const minQueueCount = 1; const _sfc_main$4 = /* @__PURE__ */ defineComponent({ __name: "BatchCountEdit", props: { class: { default: "" } }, setup(__props) { const props = __props; const queueSettingsStore = useQueueSettingsStore(); const { batchCount } = storeToRefs(queueSettingsStore); const settingStore = useSettingStore(); const maxQueueCount = computed( () => settingStore.get("Comfy.QueueButton.BatchCountLimit") ); const handleClick = /* @__PURE__ */ __name((increment) => { let newCount; if (increment) { const originalCount = batchCount.value - 1; newCount = originalCount * 2; } else { const originalCount = batchCount.value + 1; newCount = Math.floor(originalCount / 2); } batchCount.value = newCount; }, "handleClick"); return (_ctx, _cache) => { const _directive_tooltip = resolveDirective("tooltip"); return withDirectives((openBlock(), createElementBlock("div", { class: normalizeClass(["batch-count", props.class]) }, [ createVNode(unref(script$y), { class: "w-14", modelValue: unref(batchCount), "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(batchCount) ? batchCount.value = $event : null), min: minQueueCount, max: maxQueueCount.value, fluid: "", showButtons: "", pt: { incrementButton: { class: "w-6", onmousedown: /* @__PURE__ */ __name(() => { handleClick(true); }, "onmousedown") }, decrementButton: { class: "w-6", onmousedown: /* @__PURE__ */ __name(() => { handleClick(false); }, "onmousedown") } } }, null, 8, ["modelValue", "max", "pt"]) ], 2)), [ [ _directive_tooltip, _ctx.$t("menu.batchCount"), void 0, { bottom: true } ] ]); }; } }); const BatchCountEdit = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-713442be"]]); const _withScopeId$1 = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-2b80bf74"), n = n(), popScopeId(), n), "_withScopeId$1"); const _hoisted_1$1 = { class: "queue-button-group flex" }; const _sfc_main$3 = /* @__PURE__ */ defineComponent({ __name: "ComfyQueueButton", setup(__props) { const workspaceStore = useWorkspaceStore(); const queueCountStore = storeToRefs(useQueuePendingTaskCountStore()); const { mode: queueMode } = storeToRefs(useQueueSettingsStore()); const { t } = useI18n(); const queueModeMenuItemLookup = { disabled: { key: "disabled", label: "Queue", icon: "pi pi-play", tooltip: t("menu.disabledTooltip"), command: /* @__PURE__ */ __name(() => { queueMode.value = "disabled"; }, "command") }, instant: { key: "instant", label: "Queue (Instant)", icon: "pi pi-forward", tooltip: t("menu.instantTooltip"), command: /* @__PURE__ */ __name(() => { queueMode.value = "instant"; }, "command") }, change: { key: "change", label: "Queue (Change)", icon: "pi pi-step-forward-alt", tooltip: t("menu.changeTooltip"), command: /* @__PURE__ */ __name(() => { queueMode.value = "change"; }, "command") } }; const activeQueueModeMenuItem = computed( () => queueModeMenuItemLookup[queueMode.value] ); const queueModeMenuItems = computed( () => Object.values(queueModeMenuItemLookup) ); const executingPrompt = computed(() => !!queueCountStore.count.value); const hasPendingTasks = computed(() => queueCountStore.count.value > 1); const commandStore = useCommandStore(); const queuePrompt = /* @__PURE__ */ __name((e) => { const commandId = e.shiftKey ? "Comfy.QueuePromptFront" : "Comfy.QueuePrompt"; commandStore.execute(commandId); }, "queuePrompt"); return (_ctx, _cache) => { const _component_i_lucide58list_start = __unplugin_components_0; const _directive_tooltip = resolveDirective("tooltip"); return openBlock(), createElementBlock("div", _hoisted_1$1, [ withDirectives((openBlock(), createBlock(unref(script), { class: "comfyui-queue-button", label: activeQueueModeMenuItem.value.label, severity: "primary", onClick: queuePrompt, model: queueModeMenuItems.value, "data-testid": "queue-button" }, { icon: withCtx(() => [ unref(workspaceStore).shiftDown ? (openBlock(), createBlock(_component_i_lucide58list_start, { key: 0 })) : (openBlock(), createElementBlock("i", { key: 1, class: normalizeClass(activeQueueModeMenuItem.value.icon) }, null, 2)) ]), item: withCtx(({ item: item3 }) => [ withDirectives(createVNode(unref(script$d), { label: item3.label, icon: item3.icon, severity: item3.key === unref(queueMode) ? "primary" : "secondary", text: "" }, null, 8, ["label", "icon", "severity"]), [ [_directive_tooltip, item3.tooltip] ]) ]), _: 1 }, 8, ["label", "model"])), [ [ _directive_tooltip, unref(workspaceStore).shiftDown ? _ctx.$t("menu.queueWorkflowFront") : _ctx.$t("menu.queueWorkflow"), void 0, { bottom: true } ] ]), createVNode(BatchCountEdit), createVNode(unref(script$7), { class: "execution-actions flex flex-nowrap" }, { default: withCtx(() => [ withDirectives(createVNode(unref(script$d), { icon: "pi pi-times", severity: executingPrompt.value ? "danger" : "secondary", disabled: !executingPrompt.value, text: "", onClick: _cache[0] || (_cache[0] = () => unref(commandStore).execute("Comfy.Interrupt")) }, null, 8, ["severity", "disabled"]), [ [ _directive_tooltip, _ctx.$t("menu.interrupt"), void 0, { bottom: true } ] ]), withDirectives(createVNode(unref(script$d), { icon: "pi pi-stop", severity: hasPendingTasks.value ? "danger" : "secondary", disabled: !hasPendingTasks.value, text: "", onClick: _cache[1] || (_cache[1] = () => unref(commandStore).execute("Comfy.ClearPendingTasks")) }, null, 8, ["severity", "disabled"]), [ [ _directive_tooltip, _ctx.$t("sideToolbar.queueTab.clearPendingTasks"), void 0, { bottom: true } ] ]) ]), _: 1 }) ]); }; } }); const ComfyQueueButton = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-2b80bf74"]]); const overlapThreshold = 20; const _sfc_main$2 = /* @__PURE__ */ defineComponent({ __name: "ComfyActionbar", setup(__props) { const settingsStore = useSettingStore(); const commandStore = useCommandStore(); const visible = computed( () => settingsStore.get("Comfy.UseNewMenu") !== "Disabled" ); const panelRef = ref(null); const dragHandleRef = ref(null); const isDocked = useLocalStorage("Comfy.MenuPosition.Docked", false); const storedPosition = useLocalStorage("Comfy.MenuPosition.Floating", { x: 0, y: 0 }); const { x, y, style, isDragging } = useDraggable(panelRef, { initialValue: { x: 0, y: 0 }, handle: dragHandleRef, containerElement: document.body }); watchDebounced( [x, y], ([newX, newY]) => { storedPosition.value = { x: newX, y: newY }; }, { debounce: 300 } ); const setInitialPosition = /* @__PURE__ */ __name(() => { if (x.value !== 0 || y.value !== 0) { return; } if (storedPosition.value.x !== 0 || storedPosition.value.y !== 0) { x.value = storedPosition.value.x; y.value = storedPosition.value.y; captureLastDragState(); return; } if (panelRef.value) { const screenWidth = window.innerWidth; const screenHeight = window.innerHeight; const menuWidth = panelRef.value.offsetWidth; const menuHeight = panelRef.value.offsetHeight; if (menuWidth === 0 || menuHeight === 0) { return; } x.value = (screenWidth - menuWidth) / 2; y.value = screenHeight - menuHeight - 10; captureLastDragState(); } }, "setInitialPosition"); onMounted(setInitialPosition); watch(visible, (newVisible) => { if (newVisible) { nextTick(setInitialPosition); } }); const lastDragState = ref({ x: x.value, y: y.value, windowWidth: window.innerWidth, windowHeight: window.innerHeight }); const captureLastDragState = /* @__PURE__ */ __name(() => { lastDragState.value = { x: x.value, y: y.value, windowWidth: window.innerWidth, windowHeight: window.innerHeight }; }, "captureLastDragState"); watch( isDragging, (newIsDragging) => { if (!newIsDragging) { captureLastDragState(); } }, { immediate: true } ); const adjustMenuPosition = /* @__PURE__ */ __name(() => { if (panelRef.value) { const screenWidth = window.innerWidth; const screenHeight = window.innerHeight; const menuWidth = panelRef.value.offsetWidth; const menuHeight = panelRef.value.offsetHeight; const distanceRight = lastDragState.value.windowWidth - (lastDragState.value.x + menuWidth); const distanceBottom = lastDragState.value.windowHeight - (lastDragState.value.y + menuHeight); const anchorRight = distanceRight < lastDragState.value.x; const anchorBottom = distanceBottom < lastDragState.value.y; if (anchorRight) { x.value = screenWidth - (lastDragState.value.windowWidth - lastDragState.value.x); } else { x.value = lastDragState.value.x; } if (anchorBottom) { y.value = screenHeight - (lastDragState.value.windowHeight - lastDragState.value.y); } else { y.value = lastDragState.value.y; } x.value = lodashExports.clamp(x.value, 0, screenWidth - menuWidth); y.value = lodashExports.clamp(y.value, 0, screenHeight - menuHeight); } }, "adjustMenuPosition"); useEventListener(window, "resize", adjustMenuPosition); const topMenuRef = inject("topMenuRef"); const topMenuBounds = useElementBounding(topMenuRef); const isOverlappingWithTopMenu = computed(() => { if (!panelRef.value) { return false; } const { height } = panelRef.value.getBoundingClientRect(); const actionbarBottom = y.value + height; const topMenuBottom = topMenuBounds.bottom.value; const overlapPixels = Math.min(actionbarBottom, topMenuBottom) - Math.max(y.value, topMenuBounds.top.value); return overlapPixels > overlapThreshold; }); watch(isDragging, (newIsDragging) => { if (!newIsDragging) { isDocked.value = isOverlappingWithTopMenu.value; } else { isDocked.value = false; } }); const eventBus = useEventBus("topMenu"); watch([isDragging, isOverlappingWithTopMenu], ([dragging, overlapping]) => { eventBus.emit("updateHighlight", { isDragging: dragging, isOverlapping: overlapping }); }); return (_ctx, _cache) => { const _directive_tooltip = resolveDirective("tooltip"); return openBlock(), createBlock(unref(script$4), { class: normalizeClass(["actionbar w-fit", { "is-dragging": unref(isDragging), "is-docked": unref(isDocked) }]), style: normalizeStyle(unref(style)) }, { default: withCtx(() => [ createBaseVNode("div", { class: "actionbar-content flex items-center", ref_key: "panelRef", ref: panelRef }, [ createBaseVNode("span", { class: "drag-handle cursor-move mr-2 p-0!", ref_key: "dragHandleRef", ref: dragHandleRef }, null, 512), createVNode(ComfyQueueButton), createVNode(unref(script$z), { layout: "vertical", class: "mx-1" }), createVNode(unref(script$7), { class: "flex flex-nowrap" }, { default: withCtx(() => [ withDirectives(createVNode(unref(script$d), { icon: "pi pi-refresh", severity: "secondary", text: "", onClick: _cache[0] || (_cache[0] = () => unref(commandStore).execute("Comfy.RefreshNodeDefinitions")) }, null, 512), [ [ _directive_tooltip, _ctx.$t("menu.refresh"), void 0, { bottom: true } ] ]) ]), _: 1 }) ], 512) ]), _: 1 }, 8, ["style", "class"]); }; } }); const Actionbar = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-2e54db00"]]); const _withScopeId = /* @__PURE__ */ __name((n) => (pushScopeId("data-v-b13fdc92"), n = n(), popScopeId(), n), "_withScopeId"); const _hoisted_1 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createBaseVNode("h1", { class: "comfyui-logo mx-2" }, "ComfyUI", -1)); const _hoisted_2 = { class: "flex-grow" }; const _sfc_main$1 = /* @__PURE__ */ defineComponent({ __name: "TopMenubar", setup(__props) { const settingStore = useSettingStore(); const workflowTabsPosition = computed( () => settingStore.get("Comfy.Workflow.WorkflowTabsPosition") ); const betaMenuEnabled = computed( () => settingStore.get("Comfy.UseNewMenu") !== "Disabled" ); const teleportTarget = computed( () => settingStore.get("Comfy.UseNewMenu") === "Top" ? ".comfyui-body-top" : ".comfyui-body-bottom" ); const menuRight = ref(null); onMounted(() => { if (menuRight.value) { menuRight.value.appendChild(app.menu.element); } }); const topMenuRef = ref(null); provide("topMenuRef", topMenuRef); const eventBus = useEventBus("topMenu"); const isDropZone = ref(false); const isDroppable = ref(false); eventBus.on((event, payload) => { if (event === "updateHighlight") { isDropZone.value = payload.isDragging; isDroppable.value = payload.isOverlapping && payload.isDragging; } }); return (_ctx, _cache) => { return openBlock(), createBlock(Teleport, { to: teleportTarget.value }, [ withDirectives(createBaseVNode("div", { ref_key: "topMenuRef", ref: topMenuRef, class: normalizeClass(["comfyui-menu flex items-center", { dropzone: isDropZone.value, "dropzone-active": isDroppable.value }]) }, [ _hoisted_1, createVNode(CommandMenubar), createVNode(unref(script$z), { layout: "vertical", class: "mx-2" }), createBaseVNode("div", _hoisted_2, [ workflowTabsPosition.value === "Topbar" ? (openBlock(), createBlock(WorkflowTabs, { key: 0 })) : createCommentVNode("", true) ]), createBaseVNode("div", { class: "comfyui-menu-right", ref_key: "menuRight", ref: menuRight }, null, 512), createVNode(Actionbar) ], 2), [ [vShow, betaMenuEnabled.value] ]) ], 8, ["to"]); }; } }); const TopMenubar = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-b13fdc92"]]); function setupAutoQueueHandler() { const queueCountStore = useQueuePendingTaskCountStore(); const queueSettingsStore = useQueueSettingsStore(); let graphHasChanged = false; let internalCount = 0; api.addEventListener("graphChanged", () => { if (queueSettingsStore.mode === "change") { if (internalCount) { graphHasChanged = true; } else { graphHasChanged = false; app.queuePrompt(0, queueSettingsStore.batchCount); internalCount++; } } }); queueCountStore.$subscribe( () => { internalCount = queueCountStore.count; if (!internalCount && !app.lastExecutionError) { if (queueSettingsStore.mode === "instant" || queueSettingsStore.mode === "change" && graphHasChanged) { graphHasChanged = false; app.queuePrompt(0, queueSettingsStore.batchCount); } } }, { detached: true } ); } __name(setupAutoQueueHandler, "setupAutoQueueHandler"); const _sfc_main = /* @__PURE__ */ defineComponent({ __name: "GraphView", setup(__props) { setupAutoQueueHandler(); const { t } = useI18n(); const toast = useToast(); const settingStore = useSettingStore(); const executionStore = useExecutionStore(); const theme11 = computed(() => settingStore.get("Comfy.ColorPalette")); watch( theme11, (newTheme) => { const DARK_THEME_CLASS = "dark-theme"; const isDarkTheme = newTheme !== "light"; if (isDarkTheme) { document.body.classList.add(DARK_THEME_CLASS); } else { document.body.classList.remove(DARK_THEME_CLASS); } }, { immediate: true } ); watchEffect(() => { const fontSize = settingStore.get("Comfy.TextareaWidget.FontSize"); document.documentElement.style.setProperty( "--comfy-textarea-font-size", `${fontSize}px` ); }); watchEffect(() => { const padding = settingStore.get("Comfy.TreeExplorer.ItemPadding"); document.documentElement.style.setProperty( "--comfy-tree-explorer-item-padding", `${padding}px` ); }); watchEffect(() => { const locale = settingStore.get("Comfy.Locale"); if (locale) { i18n.global.locale.value = locale; } }); watchEffect(() => { const useNewMenu = settingStore.get("Comfy.UseNewMenu"); if (useNewMenu === "Disabled") { app.ui.menuContainer.style.removeProperty("display"); app.ui.restoreMenuPosition(); } else { app.ui.menuContainer.style.setProperty("display", "none"); } }); const init = /* @__PURE__ */ __name(() => { settingStore.addSettings(app.ui.settings); useKeybindingStore().loadCoreKeybindings(); useSidebarTabStore().registerCoreSidebarTabs(); app.extensionManager = useWorkspaceStore(); }, "init"); const queuePendingTaskCountStore = useQueuePendingTaskCountStore(); const onStatus = /* @__PURE__ */ __name((e) => { queuePendingTaskCountStore.update(e); }, "onStatus"); const reconnectingMessage = { severity: "error", summary: t("reconnecting") }; const onReconnecting = /* @__PURE__ */ __name(() => { toast.remove(reconnectingMessage); toast.add(reconnectingMessage); }, "onReconnecting"); const onReconnected = /* @__PURE__ */ __name(() => { toast.remove(reconnectingMessage); toast.add({ severity: "success", summary: t("reconnected"), life: 2e3 }); }, "onReconnected"); const workflowStore = useWorkflowStore(); const workflowBookmarkStore = useWorkflowBookmarkStore(); app.workflowManager.executionStore = executionStore; app.workflowManager.workflowStore = workflowStore; app.workflowManager.workflowBookmarkStore = workflowBookmarkStore; onMounted(() => { api.addEventListener("status", onStatus); api.addEventListener("reconnecting", onReconnecting); api.addEventListener("reconnected", onReconnected); executionStore.bindExecutionEvents(); try { init(); } catch (e) { console.error("Failed to init ComfyUI frontend", e); } }); onBeforeUnmount(() => { api.removeEventListener("status", onStatus); api.removeEventListener("reconnecting", onReconnecting); api.removeEventListener("reconnected", onReconnected); executionStore.unbindExecutionEvents(); }); const onGraphReady = /* @__PURE__ */ __name(() => { requestIdleCallback( () => { useKeybindingStore().loadUserKeybindings(); useNodeBookmarkStore().migrateLegacyBookmarks(); useNodeDefStore().nodeSearchService.endsWithFilterStartSequence(""); useNodeFrequencyStore().loadNodeFrequencies(); }, { timeout: 1e3 } ); }, "onGraphReady"); return (_ctx, _cache) => { return openBlock(), createElementBlock(Fragment, null, [ createVNode(TopMenubar), createVNode(_sfc_main$a, { onReady: onGraphReady }), createVNode(_sfc_main$9), createVNode(_sfc_main$8), createVNode(_sfc_main$7) ], 64); }; } }); export { _sfc_main as default }; //# sourceMappingURL=GraphView-DmeOoKWv.js.map