n8n-editor-ui 1.109.0 → 1.110.0

package/dist/assets/{NodeView-Bi4OfDJp.js → NodeView-DbmrvKR2.js}

@@ -1,80 +1,11 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/NodeCreation-C4-JrWkw.js","assets/index-V25MIkzH.js","assets/index-Am8RmnT4.css","assets/NodeCreation-CxN6JIS_.css","assets/NodeDetailsView-DucQbxES.js","assets/TriggerPanel-BNb8Fkp3.js","assets/RunDataParsedAiContent-Dv43fJJj.js","assets/core-BiQ8TPaF.js","assets/RunDataParsedAiContent-wfIiKsq7.css","assets/ConsumedTokensDetails.vue_vue_type_script_setup_true_lang-Y9jgPwUm.js","assets/InfoAccordion-DVdDpADr.js","assets/InfoAccordion-dxudNqVC.css","assets/TriggerPanel-BFPMKijE.css","assets/useWorkflowActivate-DKZ9PzgK.js","assets/global-link-actions-BfwrTt1h.js","assets/useExecutionDebugging-DiCw9NpL.js","assets/useBeforeUnload-yQFY1z_s.js","assets/canvas-Kg89rGSt.js","assets/readyToRunWorkflows.store-D8qADh9A.js","assets/NodeDetailsView-CjdovDgq.css","assets/NodeDetailsViewV2-By7jano3.js","assets/NodeDetailsViewV2-J_3cfdea.css","assets/SetupWorkflowCredentialsButton-o-0v9TC0.js"])))=>i.map(i=>d[i]);
-import { d as defineComponent, x as computed, r as ref, aY as useNDVStore, a7 as watch, h as createElementBlock, g as openBlock, n as normalizeClass, e as createBlock, f as createCommentVNode, l as unref, p as N8nText, w as withCtx, k as createTextVNode, t as toDisplayString, cv as _sfc_main$a, i as createVNode, aa as _sfc_main$b, _ as _export_sfc, aq as createEventBus, as as useCssModule, v as useSettingsStore, cw as useVueFlow, bZ as toRef, cx as useCanvasMapping, cy as refThrottled, j as createBaseVNode, X as renderSlot, cz as Canvas, K as mergeProps, a1 as useWorkflowsStore, bK as useNodeHelpers, cA as useFocusPanelStore, ad as useNodeTypesStore, cB as useNodeSettingsParameters, cC as useEnvironmentsStore, cD as useDeviceSupport, cE as HTML_NODE_TYPE, cF as isValueExpression, cG as isResourceLocatorValue, cH as AI_TRANSFORM_NODE_TYPE, cI as useResolvedExpression, cj as useThrottleFn, B as withModifiers, cJ as _sfc_main$c, N as N8nIcon, cK as InfoTip, c as useI18n, cL as __unplugin_components_2, cM as __unplugin_components_3, F as Fragment, cN as __unplugin_components_4, cO as __unplugin_components_5, cP as __unplugin_components_6, cQ as __unplugin_components_7, cR as __unplugin_components_8, cS as __unplugin_components_9, cT as N8nInput, O as N8nRadioButtons, ap as normalizeStyle, ch as useStyles, cg as N8nResizeWrapper, cU as getParameterTypeOption, cV as htmlEditorEventBus, cW as parseFromExpression, cX as isValidParameterOption, cY as formatAsExpression, al as useTelemetry, Y as nextTick, cZ as hasFocusOnInput, c_ as isFocusableEl, bA as isChatNode, c$ as truncateBeforeLast, q as N8nButton, ab as I18nT, cf as KeyboardShortcutTooltip, bW as NodeIcon, aM as N8nActionDropdown, d0 as reactive, o as onMounted, c6 as onUnmounted, d1 as _sfc_main$d, D as useI18n$1, b as useRouter, a2 as useRoute, a as useToast, ax as useDocumentTitle, az as useWorkflowHelpers, ay as useWorkflowSaving, Q as useUIStore, af as useSourceControlStore, d2 as useNodeCreatorStore, d3 as useCredentialsStore, d4 as useExternalSecretsStore, at as useRootStore, aZ as useExecutionsStore, cm as useCanvasStore, aw as useNpsSurveyStore, d5 as useHistoryStore, au as useProjectsStore, u as useUsersStore, ar as useTagsStore, a0 as usePushConnectionStore, bk as useTemplatesStore, d6 as useBuilderStore, av as useFoldersStore, d7 as usePostHog, d8 as useAgentRequestStore, bJ as useLogsStore, bL as useRunWorkflow, bO as useCanvasOperations, d9 as useWorkflowExtraction, c9 as useClipboard, bm as useKeybindings, bt as ABOUT_MODAL_KEY, a3 as PLACEHOLDER_EMPTY_WORKFLOW_ID, da as NEW_WORKFLOW_ID, V as VIEWS, db as NDV_UI_OVERHAUL_EXPERIMENT, bP as START_NODE_TYPE, dc as getNodeViewTab, L as MAIN_HEADER_TABS, dd as VALID_WORKFLOW_IMPORT_URL_REGEX, am as useMessage, an as MODAL_CONFIRM, de as jsonParse, aB as getResourcePermissions, bG as CHAT_TRIGGER_NODE_TYPE, bF as MANUAL_CHAT_TRIGGER_NODE_TYPE, df as EVALUATION_TRIGGER_NODE_TYPE, dg as getBounds, dh as onBeforeRouteLeave, b1 as onBeforeMount, ak as WORKFLOW_SETTINGS_MODAL_KEY, bo as useExternalHooks, di as onActivated, dj as onDeactivated, W as onBeforeUnmount, dk as Suspense, dl as defineAsyncComponent, z as N8nCallout, aU as __vitePreload, aE as EnterpriseEditionFeature, dm as NODE_CREATOR_OPEN_SOURCES, dn as EVALUATION_NODE_TYPE, dp as getSampleWorkflowByTemplateId, dq as tryToParseNumber, aO as nodeViewEventBus, bB as NodeConnectionTypes, dr as createCanvasConnectionHandleString, ds as isValidNodeConnectionType, dt as CanvasConnectionMode, du as sourceControlEventBus, dv as getNodesWithNormalizedPosition, aW as h, dw as CanvasNodeRenderType, b0 as STICKY_NODE_TYPE, dx as needsAgentInput, dy as FROM_AI_PARAMETERS_MODAL_KEY, dz as historyBus, dA as DRAG_EVENT_DATA_KEY } from "./index-V25MIkzH.js";
-import { g as globalLinkActionsEventBus } from "./global-link-actions-BfwrTt1h.js";
-import { u as useExecutionDebugging } from "./useExecutionDebugging-DiCw9NpL.js";
-import { u as useBeforeUnload } from "./useBeforeUnload-yQFY1z_s.js";
-import { c as canvasEventBus } from "./canvas-Kg89rGSt.js";
-import { u as useAITemplatesStarterCollectionStore, a as useReadyToRunWorkflowsStore } from "./readyToRunWorkflows.store-D8qADh9A.js";
-const _sfc_main$9 = /* @__PURE__ */ defineComponent({
-  __name: "ExperimentalNodeDetailsDrawer",
-  props: {
-    selectedNodes: {}
-  },
-  setup(__props) {
-    const content2 = computed(
-      () => __props.selectedNodes.length > 1 ? `${__props.selectedNodes.length} nodes selected` : __props.selectedNodes.length > 0 ? __props.selectedNodes[0] : void 0
-    );
-    const lastContent = ref();
-    const { setActiveNodeName } = useNDVStore();
-    function handleOpenNdv() {
-      if (typeof content2.value === "object" && content2.value.data) {
-        setActiveNodeName(content2.value.data.name);
-      }
-    }
-    watch(
-      content2,
-      (newContent) => {
-        if (newContent !== void 0) {
-          lastContent.value = newContent;
-        }
-      },
-      { immediate: true }
-    );
-    return (_ctx, _cache) => {
-      const _component_N8nIconButton = _sfc_main$b;
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass([_ctx.$style.component, content2.value === void 0 ? _ctx.$style.closed : ""])
-      }, [
-        typeof lastContent.value === "string" ? (openBlock(), createBlock(unref(N8nText), {
-          key: 0,
-          color: "text-base"
-        }, {
-          default: withCtx(() => [
-            createTextVNode(toDisplayString(lastContent.value), 1)
-          ]),
-          _: 1
-        })) : lastContent.value !== void 0 ? (openBlock(), createBlock(_sfc_main$a, {
-          key: lastContent.value.id,
-          "node-id": lastContent.value.id
-        }, {
-          actions: withCtx(() => [
-            createVNode(_component_N8nIconButton, {
-              icon: "maximize-2",
-              type: "secondary",
-              text: "",
-              size: "mini",
-              "icon-size": "large",
-              "aria-label": "Expand",
-              onClick: handleOpenNdv
-            })
-          ]),
-          _: 1
-        }, 8, ["node-id"])) : createCommentVNode("", true)
-      ], 2);
-    };
-  }
-});
-const component$1 = "_component_wojby_123";
-const closed = "_closed_wojby_138";
-const style0$5 = {
-  component: component$1,
-  closed
-};
-const cssModules$5 = {
-  "$style": style0$5
-};
-const ExperimentalNodeDetailsDrawer = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__cssModules", cssModules$5]]);
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/NodeCreation-o_K0NT5J.js","assets/index-De29TdKc.js","assets/index-DXNU_2Fk.css","assets/NodeCreation-C4gQlPqI.css","assets/NodeDetailsView-DUVQMLye.js","assets/TriggerPanel-BMnQXPE0.js","assets/RunDataParsedAiContent-DO8FIZ0n.js","assets/core-BKMZD8Mn.js","assets/RunDataParsedAiContent-wfIiKsq7.css","assets/ConsumedTokensDetails.vue_vue_type_script_setup_true_lang-upvzJHw_.js","assets/InfoAccordion-BE3HeAda.js","assets/InfoAccordion-dxudNqVC.css","assets/TriggerPanel-DiD8pi0I.css","assets/useWorkflowActivate-BNP9vQIn.js","assets/global-link-actions-DDCy0nlC.js","assets/useExecutionDebugging-BFA_6rY-.js","assets/useBeforeUnload-Bl2noypd.js","assets/canvas-JvPOqEjf.js","assets/readyToRunWorkflows.store-BGvURDML.js","assets/NodeDetailsView-CjdovDgq.css","assets/NodeDetailsViewV2-BQ8TJyUD.js","assets/NodeDetailsViewV2-J_3cfdea.css","assets/SetupWorkflowCredentialsButton-DxydQJ6C.js"])))=>i.map(i=>d[i]);
+import { d as defineComponent, aq as createEventBus, as as useCssModule, cx as useVueFlow, b_ as toRef, x as computed, cy as useCanvasMapping, r as ref, cz as refThrottled, h as createElementBlock, g as openBlock, n as normalizeClass, l as unref, j as createBaseVNode, X as renderSlot, e as createBlock, f as createCommentVNode, cA as Canvas, K as mergeProps, _ as _export_sfc, a1 as useWorkflowsStore, cB as useExpressionResolveCtx, p as N8nText, w as withCtx, k as createTextVNode, t as toDisplayString, cC as _sfc_main$b, i as createVNode, aa as _sfc_main$c, bO as provide, cD as ExpressionLocalResolveContextSymbol, ad as useNodeTypesStore, bX as NodeIcon, F as Fragment, cE as _sfc_main$d, aG as useTemplateRef, bL as useNodeHelpers, cF as useFocusPanelStore, cG as useNodeSettingsParameters, cH as useEnvironmentsStore, cI as useExperimentalNdvStore, aY as useNDVStore, cJ as useDeviceSupport, cv as useActiveElement, cK as useTelemetryContext, cL as HTML_NODE_TYPE, cM as isValueExpression, cN as isResourceLocatorValue, cO as AI_TRANSFORM_NODE_TYPE, cP as useResolvedExpression, a7 as watch, cl as useThrottleFn, B as withModifiers, N as N8nIcon, cQ as InfoTip, c as useI18n, cR as __unplugin_components_2, cS as __unplugin_components_3, cT as __unplugin_components_4, cU as __unplugin_components_5, cV as __unplugin_components_6, cW as __unplugin_components_7, cX as __unplugin_components_8, cY as __unplugin_components_9, cZ as N8nInput, O as N8nRadioButtons, ap as normalizeStyle, ch as N8nResizeWrapper, c_ as getParameterTypeOption, c$ as htmlEditorEventBus, d0 as parseFromExpression, d1 as isValidParameterOption, d2 as formatAsExpression, al as useTelemetry, Y as nextTick, d3 as hasFocusOnInput, d4 as isFocusableEl, bB as isChatNode, d5 as truncateBeforeLast, q as N8nButton, ab as I18nT, cg as KeyboardShortcutTooltip, aM as N8nActionDropdown, d6 as reactive, o as onMounted, c7 as onUnmounted, d7 as _sfc_main$e, D as useI18n$1, b as useRouter, a2 as useRoute, a as useToast, ax as useDocumentTitle, az as useWorkflowHelpers, ay as useWorkflowSaving, Q as useUIStore, af as useSourceControlStore, d8 as useNodeCreatorStore, v as useSettingsStore, d9 as useCredentialsStore, da as useExternalSecretsStore, at as useRootStore, aZ as useExecutionsStore, co as useCanvasStore, aw as useNpsSurveyStore, db as useHistoryStore, au as useProjectsStore, u as useUsersStore, ar as useTagsStore, a0 as usePushConnectionStore, bk as useTemplatesStore, dc as useBuilderStore, av as useFoldersStore, dd as usePostHog, de as useAgentRequestStore, bK as useLogsStore, bM as useRunWorkflow, bP as useCanvasOperations, df as useWorkflowExtraction, ca as useClipboard, bn as useKeybindings, bu as ABOUT_MODAL_KEY, a3 as PLACEHOLDER_EMPTY_WORKFLOW_ID, dg as NEW_WORKFLOW_ID, V as VIEWS, dh as NDV_UI_OVERHAUL_EXPERIMENT, bQ as START_NODE_TYPE, di as getNodeViewTab, L as MAIN_HEADER_TABS, dj as VALID_WORKFLOW_IMPORT_URL_REGEX, am as useMessage, an as MODAL_CONFIRM, dk as jsonParse, aB as getResourcePermissions, bH as CHAT_TRIGGER_NODE_TYPE, bG as MANUAL_CHAT_TRIGGER_NODE_TYPE, dl as EVALUATION_TRIGGER_NODE_TYPE, dm as getBounds, dn as onBeforeRouteLeave, b1 as onBeforeMount, ak as WORKFLOW_SETTINGS_MODAL_KEY, bp as useExternalHooks, dp as onActivated, dq as onDeactivated, W as onBeforeUnmount, dr as Suspense, ds as defineAsyncComponent, z as N8nCallout, aU as __vitePreload, aE as EnterpriseEditionFeature, dt as NODE_CREATOR_OPEN_SOURCES, du as EVALUATION_NODE_TYPE, dv as getSampleWorkflowByTemplateId, dw as tryToParseNumber, aO as nodeViewEventBus, bC as NodeConnectionTypes, dx as createCanvasConnectionHandleString, dy as CanvasConnectionMode, dz as isValidNodeConnectionType, dA as sourceControlEventBus, dB as getNodesWithNormalizedPosition, aW as h, dC as CanvasNodeRenderType, dD as shouldIgnoreCanvasShortcut, b0 as STICKY_NODE_TYPE, dE as needsAgentInput, dF as FROM_AI_PARAMETERS_MODAL_KEY, dG as historyBus, dH as DRAG_EVENT_DATA_KEY } from "./index-De29TdKc.js";
+import { g as globalLinkActionsEventBus } from "./global-link-actions-DDCy0nlC.js";
+import { u as useExecutionDebugging } from "./useExecutionDebugging-BFA_6rY-.js";
+import { u as useBeforeUnload } from "./useBeforeUnload-Bl2noypd.js";
+import { c as canvasEventBus } from "./canvas-JvPOqEjf.js";
+import { u as useAITemplatesStarterCollectionStore, a as useReadyToRunWorkflowsStore } from "./readyToRunWorkflows.store-BGvURDML.js";
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
   ...{
     inheritAttrs: false
   },
@@ -92,8 +23,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const $style = useCssModule();
-    const settingsStore = useSettingsStore();
-    const { onNodesInitialized, getSelectedNodes } = useVueFlow(props.id);
+    const { onNodesInitialized } = useVueFlow(props.id);
     const workflow = toRef(props, "workflow");
     const workflowObject = toRef(props, "workflowObject");
     const nodes = computed(() => {
@@ -133,25 +63,21 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
             executing: _ctx.executing
           }, _ctx.$attrs), null, 16, ["id", "nodes", "connections", "event-bus", "read-only", "executing"])) : createCommentVNode("", true)
         ], 2),
-        renderSlot(_ctx.$slots, "default"),
-        unref(settingsStore).experimental__dockedNodeSettingsEnabled && !props.readOnly ? (openBlock(), createBlock(ExperimentalNodeDetailsDrawer, {
-          key: 0,
-          "selected-nodes": unref(getSelectedNodes)
-        }, null, 8, ["selected-nodes"])) : createCommentVNode("", true)
+        renderSlot(_ctx.$slots, "default")
       ], 2);
     };
   }
 });
 const wrapper$2 = "_wrapper_jyurh_123";
 const canvas = "_canvas_jyurh_131";
-const style0$4 = {
+const style0$6 = {
   wrapper: wrapper$2,
   canvas
 };
-const cssModules$4 = {
-  "$style": style0$4
+const cssModules$6 = {
+  "$style": style0$6
 };
-const WorkflowCanvas = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__cssModules", cssModules$4]]);
+const WorkflowCanvas = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__cssModules", cssModules$6]]);
 function useExecutionData({ node }) {
   const workflowsStore = useWorkflowsStore();
   const workflowExecution = computed(() => {
@@ -179,6 +105,154 @@ function useExecutionData({ node }) {
     hasNodeRun
   };
 }
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+  __name: "ExperimentalNodeDetailsDrawer",
+  props: {
+    node: {},
+    nodes: {}
+  },
+  emits: ["openNdv"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const expressionResolveCtx = useExpressionResolveCtx(computed(() => __props.node));
+    provide(ExpressionLocalResolveContextSymbol, expressionResolveCtx);
+    return (_ctx, _cache) => {
+      const _component_N8nIconButton = _sfc_main$c;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(_ctx.$style.component)
+      }, [
+        _ctx.nodes.length > 1 ? (openBlock(), createBlock(unref(N8nText), {
+          key: 0,
+          color: "text-base"
+        }, {
+          default: withCtx(() => [
+            createTextVNode(toDisplayString(_ctx.nodes.length) + " nodes selected ", 1)
+          ]),
+          _: 1
+        })) : _ctx.node ? (openBlock(), createBlock(_sfc_main$b, {
+          key: _ctx.node.id,
+          "node-id": _ctx.node.id
+        }, {
+          actions: withCtx(() => [
+            createVNode(_component_N8nIconButton, {
+              icon: "maximize-2",
+              type: "secondary",
+              text: "",
+              size: "mini",
+              "icon-size": "large",
+              "aria-label": "Expand",
+              onClick: _cache[0] || (_cache[0] = ($event) => emit("openNdv"))
+            })
+          ]),
+          _: 1
+        }, 8, ["node-id"])) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+const component$2 = "_component_1u8pj_123";
+const style0$5 = {
+  component: component$2
+};
+const cssModules$5 = {
+  "$style": style0$5
+};
+const ExperimentalNodeDetailsDrawer = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__cssModules", cssModules$5]]);
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  __name: "ExperimentalFocusPanelHeader",
+  props: {
+    node: {},
+    parameter: {},
+    isExecutable: { type: Boolean }
+  },
+  emits: ["execute", "openNdv", "clearParameter"],
+  setup(__props, { emit: __emit }) {
+    const nodeTypesStore = useNodeTypesStore();
+    const nodeType = computed(() => nodeTypesStore.getNodeType(__props.node.type, __props.node.typeVersion));
+    const emit = __emit;
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(N8nText), {
+        tag: "div",
+        size: "small",
+        bold: "",
+        class: normalizeClass(_ctx.$style.component)
+      }, {
+        default: withCtx(() => [
+          createVNode(NodeIcon, {
+            "node-type": nodeType.value,
+            size: 16
+          }, null, 8, ["node-type"]),
+          createBaseVNode("div", {
+            class: normalizeClass(_ctx.$style.breadcrumbs)
+          }, [
+            _ctx.parameter ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+              createVNode(unref(N8nText), {
+                size: "small",
+                color: "text-base",
+                bold: ""
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(_ctx.node.name), 1)
+                ]),
+                _: 1
+              }),
+              createVNode(unref(N8nText), {
+                size: "small",
+                color: "text-light"
+              }, {
+                default: withCtx(() => _cache[3] || (_cache[3] = [
+                  createTextVNode("/")
+                ])),
+                _: 1
+              }),
+              createTextVNode(" " + toDisplayString(_ctx.parameter.displayName), 1)
+            ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+              createTextVNode(toDisplayString(_ctx.node.name), 1)
+            ], 64))
+          ], 2),
+          _ctx.parameter ? (openBlock(), createBlock(unref(_sfc_main$c), {
+            key: 0,
+            icon: "x",
+            size: "small",
+            type: "tertiary",
+            text: "",
+            onClick: _cache[0] || (_cache[0] = ($event) => emit("clearParameter"))
+          })) : (openBlock(), createBlock(unref(_sfc_main$c), {
+            key: 1,
+            icon: "maximize-2",
+            size: "small",
+            type: "tertiary",
+            text: "",
+            onClick: _cache[1] || (_cache[1] = ($event) => emit("openNdv"))
+          })),
+          _ctx.isExecutable ? (openBlock(), createBlock(_sfc_main$d, {
+            key: 2,
+            "data-test-id": "node-execute-button",
+            "node-name": _ctx.node.name,
+            tooltip: `Execute ${_ctx.node.name}`,
+            size: "small",
+            icon: "play",
+            square: true,
+            "hide-label": true,
+            "telemetry-source": "focus",
+            onExecute: _cache[2] || (_cache[2] = ($event) => emit("execute"))
+          }, null, 8, ["node-name", "tooltip"])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["class"]);
+    };
+  }
+});
+const component$1 = "_component_dktdl_123";
+const breadcrumbs = "_breadcrumbs_dktdl_131";
+const style0$4 = {
+  component: component$1,
+  breadcrumbs
+};
+const cssModules$4 = {
+  "$style": style0$4
+};
+const ExperimentalFocusPanelHeader = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__cssModules", cssModules$4]]);
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   ...{ name: "FocusPanel" },
   __name: "FocusPanel",
@@ -190,6 +264,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     const props = __props;
     const emit = __emit;
     const inputField = ref();
+    const wrapperRef = useTemplateRef("wrapper");
     const locale = useI18n();
     const nodeHelpers = useNodeHelpers();
     const focusPanelStore = useFocusPanelStore();
@@ -198,12 +273,13 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     const telemetry = useTelemetry();
     const nodeSettingsParameters = useNodeSettingsParameters();
     const environmentsStore = useEnvironmentsStore();
+    const experimentalNdvStore = useExperimentalNdvStore();
+    const ndvStore = useNDVStore();
     const deviceSupport = useDeviceSupport();
-    const styles = useStyles();
-    const focusedNodeParameter = computed(() => focusPanelStore.focusedNodeParameters[0]);
-    const resolvedParameter = computed(
-      () => focusedNodeParameter.value && focusPanelStore.isRichParameter(focusedNodeParameter.value) ? focusedNodeParameter.value : void 0
-    );
+    const vueFlow = useVueFlow(workflowsStore.workflowId);
+    const activeElement = useActiveElement();
+    useTelemetryContext({ view_shown: "focus_panel" });
+    const resolvedParameter = computed(() => focusPanelStore.resolvedParameter);
     const inputValue = ref("");
     const focusPanelActive = computed(() => focusPanelStore.focusPanelActive);
     const focusPanelWidth = computed(() => focusPanelStore.focusPanelWidth);
@@ -227,19 +303,22 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
         "displayOptions"
       );
     });
+    const node = computed(() => {
+      if (!experimentalNdvStore.isNdvInFocusPanelEnabled || resolvedParameter.value) {
+        return resolvedParameter.value?.node;
+      }
+      const selected = vueFlow.getSelectedNodes.value[0]?.id;
+      return selected ? workflowsStore.allNodes.find((n) => n.id === selected) : void 0;
+    });
+    const multipleNodesSelected = computed(() => vueFlow.getSelectedNodes.value.length > 1);
     const isExecutable = computed(() => {
-      if (!resolvedParameter.value) return false;
+      if (!node.value) return false;
       if (!isDisplayed.value) return false;
       const foreignCredentials = nodeHelpers.getForeignCredentialsIfSharingEnabled(
-        resolvedParameter.value.node.credentials
-      );
-      return nodeHelpers.isNodeExecutable(
-        resolvedParameter.value.node,
-        !props.isCanvasReadOnly,
-        foreignCredentials
+        node.value.credentials
       );
+      return nodeHelpers.isNodeExecutable(node.value, !props.isCanvasReadOnly, foreignCredentials);
     });
-    const node = computed(() => resolvedParameter.value?.node);
     const { workflowRunData } = useExecutionData({ node });
     const hasNodeRun = computed(() => {
       if (!node.value) return true;
@@ -362,6 +441,14 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       }
     }
     function closeFocusPanel() {
+      if (experimentalNdvStore.isNdvInFocusPanelEnabled && resolvedParameter.value) {
+        focusPanelStore.unsetParameters();
+        telemetry.track("User removed focused param", {
+          source: "closeIcon",
+          parameters: focusPanelStore.focusedNodeParametersInTelemetryFormat
+        });
+        return;
+      }
       telemetry.track("User closed focus panel", {
         source: "closeIcon",
         parameters: focusPanelStore.focusedNodeParametersInTelemetryFormat
@@ -424,12 +511,31 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       },
       { immediate: true }
     );
+    watch(activeElement, (active) => {
+      if (!node.value || !active || !wrapperRef.value?.contains(active)) {
+        return;
+      }
+      const path = active.closest(".parameter-input")?.getAttribute("data-parameter-path");
+      if (!path) {
+        return;
+      }
+      telemetry.track("User focused focus panel", {
+        node_id: node.value.id,
+        node_type: node.value.type,
+        parameter_path: path
+      });
+    });
     function onResize(event) {
       focusPanelStore.updateWidth(event.width);
     }
     const onResizeThrottle = useThrottleFn(onResize, 10);
+    function onOpenNdv() {
+      if (node.value) {
+        ndvStore.setActiveNodeName(node.value.name, "focus_panel");
+      }
+    }
     return (_ctx, _cache) => {
-      const _component_NodeExecuteButton = _sfc_main$c;
+      const _component_NodeExecuteButton = _sfc_main$d;
       const _component_N8nIcon = N8nIcon;
       const _component_ParameterOptions = __unplugin_components_2;
       const _component_ExpressionEditorModalInput = __unplugin_components_3;
@@ -442,6 +548,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       const _component_N8nRadioButtons = N8nRadioButtons;
       return focusPanelActive.value ? (openBlock(), createElementBlock("div", {
         key: 0,
+        ref: "wrapper",
         class: normalizeClass(_ctx.$style.wrapper),
         onKeydown: _cache[9] || (_cache[9] = withModifiers(() => {
         }, ["stop"]))
@@ -450,20 +557,30 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
           width: focusPanelWidth.value,
           "supported-directions": ["left"],
           "min-width": 300,
-          "max-width": 1e3,
+          "max-width": unref(experimentalNdvStore).isNdvInFocusPanelEnabled ? void 0 : 1e3,
           "grid-size": 8,
-          style: normalizeStyle({ width: `${focusPanelWidth.value}px`, zIndex: unref(styles).APP_Z_INDEXES.FOCUS_PANEL }),
+          style: normalizeStyle({ width: `${focusPanelWidth.value}px` }),
           onResize: unref(onResizeThrottle)
         }, {
           default: withCtx(() => [
             createBaseVNode("div", {
               class: normalizeClass(_ctx.$style.container)
             }, [
-              resolvedParameter.value ? (openBlock(), createElementBlock("div", {
+              unref(experimentalNdvStore).isNdvInFocusPanelEnabled && node.value && !multipleNodesSelected.value ? (openBlock(), createBlock(ExperimentalFocusPanelHeader, {
                 key: 0,
+                node: node.value,
+                parameter: resolvedParameter.value?.parameter,
+                "is-executable": isExecutable.value,
+                onExecute,
+                onOpenNdv,
+                onClearParameter: closeFocusPanel
+              }, null, 8, ["node", "parameter", "is-executable"])) : createCommentVNode("", true),
+              resolvedParameter.value ? (openBlock(), createElementBlock("div", {
+                key: 1,
                 class: normalizeClass(_ctx.$style.content)
               }, [
-                createBaseVNode("div", {
+                !unref(experimentalNdvStore).isNdvInFocusPanelEnabled ? (openBlock(), createElementBlock("div", {
+                  key: 0,
                   class: normalizeClass(_ctx.$style.tabHeader)
                 }, [
                   createBaseVNode("div", {
@@ -511,7 +628,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
                       onClick: closeFocusPanel
                     }, null, 8, ["class"])
                   ], 2)
-                ], 2),
+                ], 2)) : createCommentVNode("", true),
                 createBaseVNode("div", {
                   class: normalizeClass(_ctx.$style.parameterDetailsWrapper)
                 }, [
@@ -674,8 +791,13 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
                     ], 64)) : createCommentVNode("", true)
                   ], 2)) : createCommentVNode("", true)
                 ], 2)
-              ], 2)) : (openBlock(), createElementBlock("div", {
-                key: 1,
+              ], 2)) : node.value && unref(experimentalNdvStore).isNdvInFocusPanelEnabled ? (openBlock(), createBlock(ExperimentalNodeDetailsDrawer, {
+                key: 2,
+                node: node.value,
+                nodes: unref(vueFlow).getSelectedNodes.value,
+                onOpenNdv
+              }, null, 8, ["node", "nodes"])) : (openBlock(), createElementBlock("div", {
+                key: 3,
                 class: normalizeClass([_ctx.$style.content, _ctx.$style.emptyContent])
               }, [
                 createBaseVNode("div", {
@@ -738,32 +860,32 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             ], 2)
           ]),
           _: 1
-        }, 8, ["width", "style", "onResize"])
+        }, 8, ["width", "max-width", "style", "onResize"])
       ], 34)) : createCommentVNode("", true);
     };
   }
 });
-const wrapper$1 = "_wrapper_1ebmp_123";
-const container = "_container_1ebmp_132";
-const content = "_content_1ebmp_138";
-const emptyContent = "_emptyContent_1ebmp_144";
-const emptyText = "_emptyText_1ebmp_149";
-const focusParameterWrapper = "_focusParameterWrapper_1ebmp_155";
-const iconWrapper$1 = "_iconWrapper_1ebmp_162";
-const pointerIcon = "_pointerIcon_1ebmp_166";
-const tabHeader = "_tabHeader_1ebmp_176";
-const tabHeaderText = "_tabHeaderText_1ebmp_183";
-const buttonWrapper = "_buttonWrapper_1ebmp_188";
-const parameterDetailsWrapper = "_parameterDetailsWrapper_1ebmp_193";
-const parameterOptionsWrapper = "_parameterOptionsWrapper_1ebmp_200";
-const noExecutionDataTip = "_noExecutionDataTip_1ebmp_204";
-const editorContainer = "_editorContainer_1ebmp_207";
-const editor = "_editor_1ebmp_207";
-const delayedShow = "_delayedShow_1ebmp_222";
-const triggerShow = "_triggerShow_1ebmp_1";
-const closeButton = "_closeButton_1ebmp_233";
-const heightFull = "_heightFull_1ebmp_237";
-const forceHover = "_forceHover_1ebmp_241";
+const wrapper$1 = "_wrapper_1yhze_123";
+const container = "_container_1yhze_135";
+const content = "_content_1yhze_141";
+const emptyContent = "_emptyContent_1yhze_147";
+const emptyText = "_emptyText_1yhze_152";
+const focusParameterWrapper = "_focusParameterWrapper_1yhze_158";
+const iconWrapper$1 = "_iconWrapper_1yhze_165";
+const pointerIcon = "_pointerIcon_1yhze_169";
+const tabHeader = "_tabHeader_1yhze_179";
+const tabHeaderText = "_tabHeaderText_1yhze_186";
+const buttonWrapper = "_buttonWrapper_1yhze_191";
+const parameterDetailsWrapper = "_parameterDetailsWrapper_1yhze_196";
+const parameterOptionsWrapper = "_parameterOptionsWrapper_1yhze_203";
+const noExecutionDataTip = "_noExecutionDataTip_1yhze_207";
+const editorContainer = "_editorContainer_1yhze_210";
+const editor = "_editor_1yhze_210";
+const delayedShow = "_delayedShow_1yhze_225";
+const triggerShow = "_triggerShow_1yhze_1";
+const closeButton = "_closeButton_1yhze_236";
+const heightFull = "_heightFull_1yhze_240";
+const forceHover = "_forceHover_1yhze_244";
 const style0$3 = {
   wrapper: wrapper$1,
   container,
@@ -1062,7 +1184,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
       () => props.stopping ? i18n.baseText("nodeView.stoppingCurrentExecution") : i18n.baseText("nodeView.stopCurrentExecution")
     );
     return (_ctx, _cache) => {
-      const _component_N8nIconButton = _sfc_main$b;
+      const _component_N8nIconButton = _sfc_main$c;
       return openBlock(), createBlock(_component_N8nIconButton, {
         icon: "square",
         size: "large",
@@ -1080,7 +1202,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const i18n = useI18n();
     return (_ctx, _cache) => {
-      const _component_N8nIconButton = _sfc_main$b;
+      const _component_N8nIconButton = _sfc_main$c;
       return openBlock(), createBlock(_component_N8nIconButton, {
         class: "stop-execution",
         icon: "square",
@@ -1112,7 +1234,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
         createBaseVNode("div", {
           class: normalizeClass(unref($style).iconWrapper)
         }, [
-          createVNode(_sfc_main$d, { theme: "blank" })
+          createVNode(_sfc_main$e, { theme: "blank" })
         ], 2),
         createBaseVNode("span", {
           class: normalizeClass(unref($style).text)
@@ -1190,16 +1312,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "NodeView",
   setup(__props) {
     const LazyNodeCreation = defineAsyncComponent(
-      async () => await __vitePreload(() => import("./NodeCreation-C4-JrWkw.js"), true ? __vite__mapDeps([0,1,2,3]) : void 0)
+      async () => await __vitePreload(() => import("./NodeCreation-o_K0NT5J.js"), true ? __vite__mapDeps([0,1,2,3]) : void 0)
     );
     const LazyNodeDetailsView = defineAsyncComponent(
-      async () => await __vitePreload(() => import("./NodeDetailsView-DucQbxES.js"), true ? __vite__mapDeps([4,1,2,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]) : void 0)
+      async () => await __vitePreload(() => import("./NodeDetailsView-DUVQMLye.js"), true ? __vite__mapDeps([4,1,2,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]) : void 0)
     );
     const LazyNodeDetailsViewV2 = defineAsyncComponent(
-      async () => await __vitePreload(() => import("./NodeDetailsViewV2-By7jano3.js"), true ? __vite__mapDeps([20,1,2,5,6,7,8,9,10,11,12,13,14,15,16,17,18,21]) : void 0)
+      async () => await __vitePreload(() => import("./NodeDetailsViewV2-BQ8TJyUD.js"), true ? __vite__mapDeps([20,1,2,5,6,7,8,9,10,11,12,13,14,15,16,17,18,21]) : void 0)
     );
     const LazySetupWorkflowCredentialsButton = defineAsyncComponent(
-      async () => await __vitePreload(() => import("./SetupWorkflowCredentialsButton-o-0v9TC0.js"), true ? __vite__mapDeps([22,1,2]) : void 0)
+      async () => await __vitePreload(() => import("./SetupWorkflowCredentialsButton-DxydQJ6C.js"), true ? __vite__mapDeps([22,1,2]) : void 0)
     );
     const $style = useCssModule();
     const router = useRouter();
@@ -1667,7 +1789,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           return;
         }
       }
-      setNodeActive(id);
+      setNodeActive(id, "canvas_default_view");
     }
     function onOpenSubWorkflow(id) {
       tryToOpenSubworkflowInNewTab(id);
@@ -1781,7 +1903,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     async function onOpenRenameNodeModal(id) {
       const currentName = workflowsStore.getNodeById(id)?.name ?? "";
       const activeElement = document.activeElement;
-      if (activeElement && activeElement.tagName === "INPUT") {
+      if (activeElement && shouldIgnoreCanvasShortcut(activeElement)) {
         return;
       }
       if (!keyBindingsEnabled.value || document.querySelector(".rename-prompt")) return;
@@ -1996,7 +2118,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function onSwitchActiveNode(nodeName) {
       const node = workflowsStore.getNodeByName(nodeName);
       if (!node) return;
-      setNodeActiveByName(nodeName);
+      setNodeActiveByName(nodeName, "other");
       selectNodes([node.id]);
     }
     function onOpenSelectiveNodeCreator(node, connectionType, connectionIndex = 0) {
@@ -2390,7 +2512,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       registerCustomAction({
         key: "openNodeDetail",
         action: ({ node }) => {
-          setNodeActiveByName(node);
+          setNodeActiveByName(node, "other");
         }
       });
       registerCustomAction({
@@ -2406,7 +2528,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       registerCustomAction({
         key: "showNodeCreator",
         action: () => {
-          ndvStore.activeNodeName = null;
+          ndvStore.unsetActiveNodeName();
           void nextTick(() => {
             void onOpenNodeCreatorForTriggerNodes(NODE_CREATOR_OPEN_SOURCES.TAB);
           });
@@ -2427,7 +2549,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function updateNodeRoute(nodeId) {
       const nodeUi = workflowsStore.findNodeByPartialId(nodeId);
       if (nodeUi) {
-        setNodeActive(nodeUi.id);
+        setNodeActive(nodeUi.id, "other");
       } else {
         toast.showToast({
           title: i18n.baseText("nodeView.showMessage.ndvUrl.missingNodes.title"),
@@ -2473,13 +2595,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           parameters: {},
           draggable: false
         };
-        fallbackNodes.value = builderStore.isAIBuilderEnabled && builderStore.isAssistantEnabled ? [aiPromptItem] : [addNodesItem];
+        fallbackNodes.value = builderStore.isAIBuilderEnabled && builderStore.isAssistantEnabled && builderStore.assistantMessages.length === 0 ? [aiPromptItem] : [addNodesItem];
       }
     );
     watch(
       () => route.params.nodeId,
       async (newId) => {
-        if (typeof newId !== "string" || newId === "") ndvStore.activeNodeName = null;
+        if (typeof newId !== "string" || newId === "") ndvStore.unsetActiveNodeName();
         else {
           updateNodeRoute(newId);
         }
@@ -2719,9 +2841,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   key: 0,
                   "create-node-active": unref(nodeCreatorStore).isCreateNodeActive,
                   "node-view-scale": viewportTransform.value.zoom,
+                  "focus-panel-active": unref(focusPanelStore).focusPanelActive,
                   onToggleNodeCreator,
                   onAddNodes: onAddNodesAndConnections
-                }, null, 8, ["create-node-active", "node-view-scale"])) : createCommentVNode("", true)
+                }, null, 8, ["create-node-active", "node-view-scale", "focus-panel-active"])) : createCommentVNode("", true)
               ]),
               _: 1
             })),