n8n-editor-ui 1.100.0 → 1.101.0

package/dist/assets/{MainSidebar-DrjvHIqG.css → MainSidebar-DqrgzqvZ.css}

@@ -120,37 +120,56 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._sync_fv3ov_123 {
-  padding: var(--spacing-s) var(--spacing-s) var(--spacing-s) var(--spacing-l);
-  margin: var(--spacing-2xs) 0 calc(var(--spacing-2xs) * -1);
-  background: var(--color-background-light);
-  border-top: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
-  font-size: var(--font-size-2xs);
-}
-._sync_fv3ov_123._isConnected_fv3ov_130 {
-  padding-left: var(--spacing-m);
-  border-left: var(--spacing-3xs) var(--border-style-base) var(--color-foreground-base);
+.el-menu._dropdown_1dr86_123 {
+  border-bottom: 0;
+  background-color: transparent;
 }
-._sync_fv3ov_123._isConnected_fv3ov_130._collapsed_fv3ov_134 {
-  padding-left: var(--spacing-xs);
+.el-menu._dropdown_1dr86_123 > .el-sub-menu > .el-sub-menu__title {
+  height: auto;
+  line-height: initial;
+  border-bottom: 0 !important;
+  padding: 0;
 }
-._sync_fv3ov_123:empty {
+.el-menu._dropdown_1dr86_123 > .el-sub-menu > .el-sub-menu__title .el-sub-menu__icon-arrow {
   display: none;
 }
-._sync_fv3ov_123 button {
-  font-size: var(--font-size-3xs);
+.el-menu._dropdown_1dr86_123 > .el-sub-menu.is-active .el-sub-menu__title {
+  border: 0;
 }
-._branchName_fv3ov_144 {
-  white-space: normal;
-  line-break: anywhere;
+._nestedSubmenu_1dr86_140 .el-menu {
+  max-height: 450px;
+  overflow: auto;
 }
-._collapsed_fv3ov_134 {
-  text-align: center;
-  padding-left: var(--spacing-s);
-  padding-right: var(--spacing-s);
+._submenu_1dr86_145 {
+  padding: 5px 0 !important;
 }
-._collapsed_fv3ov_134 ._connected_fv3ov_154 > span {
-  display: none;
+._submenu_1dr86_145 .el-menu--horizontal .el-menu .el-menu-item,
+._submenu_1dr86_145 .el-menu--horizontal .el-menu .el-sub-menu__title {
+  color: var(--color-text-dark);
+  background-color: var(--color-menu-background);
+}
+._submenu_1dr86_145 .el-menu--horizontal .el-menu .el-menu-item:not(.is-disabled):hover,
+._submenu_1dr86_145 .el-menu--horizontal .el-menu .el-sub-menu__title:not(.is-disabled):hover {
+  background-color: var(--color-menu-hover-background);
+}
+._submenu_1dr86_145 .el-popper {
+  padding: 0 10px !important;
+}
+._submenu_1dr86_145 .el-menu--popup {
+  border: 1px solid var(--color-foreground-base);
+  border-radius: var(--border-radius-base);
+}
+._submenu_1dr86_145 .el-menu--horizontal .el-menu .el-menu-item.is-disabled {
+  opacity: 1;
+  cursor: default;
+  color: var(--color-text-light);
+}
+._submenu_1dr86_145 .el-sub-menu__icon-arrow svg {
+  margin-top: auto;
+}
+._submenu__icon_1dr86_173 {
+  margin-right: var(--spacing-2xs);
+  color: var(--color-text-base);
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -273,31 +292,37 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._gift-icon_1usal_123 {
-  display: flex;
-  position: relative;
+._sync_fv3ov_123 {
+  padding: var(--spacing-s) var(--spacing-s) var(--spacing-s) var(--spacing-l);
+  margin: var(--spacing-2xs) 0 calc(var(--spacing-2xs) * -1);
+  background: var(--color-background-light);
+  border-top: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
+  font-size: var(--font-size-2xs);
 }
-._gift-icon_1usal_123 svg {
-  margin-right: 0 !important;
+._sync_fv3ov_123._isConnected_fv3ov_130 {
+  padding-left: var(--spacing-m);
+  border-left: var(--spacing-3xs) var(--border-style-base) var(--color-foreground-base);
 }
-._gift-icon_1usal_123 ._notification_1usal_130 {
-  height: 0.47em;
-  width: 0.47em;
-  border-radius: 50%;
-  color: var(--color-primary);
-  position: absolute;
-  background-color: var(--color-text-xlight);
-  right: -0.3em;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  top: -0.148em;
+._sync_fv3ov_123._isConnected_fv3ov_130._collapsed_fv3ov_134 {
+  padding-left: var(--spacing-xs);
 }
-._gift-icon_1usal_123 ._notification_1usal_130 div {
-  height: 0.36em;
-  width: 0.36em;
-  background-color: var(--color-primary);
-  border-radius: 50%;
+._sync_fv3ov_123:empty {
+  display: none;
+}
+._sync_fv3ov_123 button {
+  font-size: var(--font-size-3xs);
+}
+._branchName_fv3ov_144 {
+  white-space: normal;
+  line-break: anywhere;
+}
+._collapsed_fv3ov_134 {
+  text-align: center;
+  padding-left: var(--spacing-s);
+  padding-right: var(--spacing-s);
+}
+._collapsed_fv3ov_134 ._connected_fv3ov_154 > span {
+  display: none;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -748,10 +773,10 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-.home[data-v-7c9247d0] {
+.home[data-v-ff344eee] {
   padding: 0 var(--spacing-xs);
 }
-.home[data-v-7c9247d0] .el-menu-item {
+.home[data-v-ff344eee] .el-menu-item {
   padding: var(--spacing-m) var(--spacing-xs) !important;
 }/* BEM support Func
  -------------------------- */
@@ -867,6 +892,142 @@
 --------------------------*/
 /* Break-point
 --------------------------*/
+/* Break-points
+ -------------------------- */
+/* Scrollbar
+ -------------------------- */
+/* Placeholder
+ -------------------------- */
+/* BEM
+ -------------------------- */
+._container_1hqs4_123 {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  gap: var(--spacing-2xs);
+  padding: var(--spacing-2xs) var(--spacing-xs);
+  margin-left: var(--spacing-s);
+  margin-bottom: var(--spacing-3xs);
+  border-radius: var(--border-radius-base);
+  border: var(--border-base);
+  background: var(--color-background-light-base);
+}
+._button_1hqs4_136 {
+  width: 100%;
+}/* BEM support Func
+ -------------------------- */
+/* Transition
+-------------------------- */
+/* Color
+-------------------------- */
+/* Link
+-------------------------- */
+/* Border
+-------------------------- */
+/* Outline
+-------------------------- */
+/* Box shadow
+-------------------------- */
+/* Fill
+-------------------------- */
+/* Typography
+-------------------------- */
+/* z-index
+-------------------------- */
+/* Disable base
+-------------------------- */
+/* Icon
+-------------------------- */
+/* Checkbox
+-------------------------- */
+/* Radio
+-------------------------- */
+/* Select
+-------------------------- */
+/* Alert
+-------------------------- */
+/* MessageBox
+-------------------------- */
+/* Message
+-------------------------- */
+/* Notification
+-------------------------- */
+/* Input
+-------------------------- */
+/* Cascader
+-------------------------- */
+/* Group
+-------------------------- */
+/* Tab
+-------------------------- */
+/* Button
+-------------------------- */
+/* cascader
+-------------------------- */
+/* Switch
+-------------------------- */
+/* Dialog
+-------------------------- */
+/* Table
+-------------------------- */
+/* Pagination
+-------------------------- */
+/* Popup
+-------------------------- */
+/* Popover
+-------------------------- */
+/* Tooltip
+-------------------------- */
+/* Tag
+-------------------------- */
+/* Tree
+-------------------------- */
+/* Dropdown
+-------------------------- */
+/* Badge
+-------------------------- */
+/* Card
+--------------------------*/
+/* Slider
+--------------------------*/
+/* Steps
+--------------------------*/
+/* Menu
+--------------------------*/
+/* Rate
+--------------------------*/
+/* DatePicker
+--------------------------*/
+/* Loading
+--------------------------*/
+/* Scrollbar
+--------------------------*/
+/* Carousel
+--------------------------*/
+/* Collapse
+--------------------------*/
+/* Transfer
+--------------------------*/
+/* Header
+  --------------------------*/
+/* Footer
+--------------------------*/
+/* Main
+--------------------------*/
+/* Timeline
+--------------------------*/
+/* Backtop
+--------------------------*/
+/* Link
+--------------------------*/
+/* Calendar
+--------------------------*/
+/* Form
+-------------------------- */
+/* Avatar
+--------------------------*/
+/* Break-point
+--------------------------*/
 /* Break-points
  -------------------------- */
 /* Scrollbar

package/dist/assets/{NodeCreation-RKvezEeg.css → NodeCreation-32nlvQSy.css}

@@ -120,33 +120,13 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._nodeButtonsWrapper_ebnw3_123 {
+._nodeButtonsWrapper_3rkme_123 {
   position: absolute;
   top: 0;
   right: 0;
   display: flex;
-}
-._addStickyButton_ebnw3_130 {
-  margin-top: var(--spacing-2xs);
-  opacity: 0;
-  transition: 0.1s;
-  transition-timing-function: linear;
-}
-._visibleButton_ebnw3_137 {
-  opacity: 1;
-  pointer-events: all;
-}
-._noEvents_ebnw3_142 {
-  pointer-events: none;
-}
-._nodeCreatorButton_ebnw3_146 {
-  position: absolute;
-  text-align: center;
-  top: var(--spacing-s);
-  right: var(--spacing-s);
+  flex-direction: column;
+  gap: var(--spacing-2xs);
+  padding: var(--spacing-s);
   pointer-events: all !important;
-}
-._nodeCreatorPlus_ebnw3_154 {
-  width: 36px;
-  height: 36px;
 }

package/dist/assets/{NodeCreation-T5AfZVS1.js → NodeCreation-Bq5626Ha.js}

@@ -1,5 +1,6 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/NodeCreator-4g3-zQj6.js","assets/index-ZImlcrmd.js","assets/index-CeLskvTy.css","assets/NodeCreator-B1jJcOYT.css"])))=>i.map(i=>d[i]);
-import { dy as useNodeCreatorStore, bw as useNodeTypesStore, x as computed, c as useI18n, T as useWorkflowsStore, hv as MANUAL_TRIGGER_NODE_TYPE, hw as CHAIN_LLM_LANGCHAIN_NODE_TYPE, bf as NodeConnectionTypes, bo as CHAT_TRIGGER_NODE_TYPE, hx as OPEN_AI_NODE_MESSAGE_ASSISTANT_TYPE, hy as OPEN_AI_NODE_TYPE, hz as SPLIT_IN_BATCHES_NODE_TYPE, hA as NO_OP_NODE_TYPE, hB as WEBHOOK_NODE_TYPE, hC as SCHEDULE_TRIGGER_NODE_TYPE, hD as transformNodeType, aX as useExternalHooks, a2 as useCanvasStore, hE as AI_CATEGORY_LANGUAGE_MODELS, hF as QA_CHAIN_NODE_TYPE, hG as AGENT_NODE_TYPE, hH as BASIC_CHAIN_NODE_TYPE, hI as OPEN_AI_ASSISTANT_NODE_TYPE, aG as STICKY_NODE_TYPE, hJ as sortNodeCreateElements, hK as TRIGGER_NODE_CREATOR_VIEW, dz as NODE_CREATOR_OPEN_SOURCES, d as defineComponent, J as useUIStore, r as ref, c4 as useThrottleFn, o as onMounted, z as onBeforeUnmount, h as resolveComponent, i as createElementBlock, g as openBlock, f as createCommentVNode, e as createBlock, n as normalizeClass, k as createBaseVNode, j as createVNode, w as withCtx, m as unref, b$ as KeyboardShortcutTooltip, ef as defineAsyncComponent, dK as Suspense, F as Fragment, aw as __vitePreload, hL as getMidCanvasPosition, hM as DEFAULT_STICKY_WIDTH, hN as DEFAULT_STICKY_HEIGHT, _ as _export_sfc } from "./index-ZImlcrmd.js";
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/NodeCreator-D7xT3ogw.js","assets/index-7S5ADieN.js","assets/index-BzamKJpD.css","assets/NodeView-DoR46iB5.js","assets/ActionDropdown-BujIG0Jq.js","assets/ActionDropdown-BmC0wfMx.css","assets/useKeybindings-CV0VsjNP.js","assets/useKeybindings-BUK7Ngh6.css","assets/import-curl-DD21H3kK.js","assets/global-link-actions-olwfH36z.js","assets/useExecutionDebugging-DM4nhx6D.js","assets/useBeforeUnload-DveXGtGN.js","assets/NodeView-DL8JxnMc.css","assets/NodeCreator-Dk0sNXFZ.css"])))=>i.map(i=>d[i]);
+import { dR as useNodeCreatorStore, bN as useNodeTypesStore, x as computed, c as useI18n, a3 as useWorkflowsStore, hR as MANUAL_TRIGGER_NODE_TYPE, hS as CHAIN_LLM_LANGCHAIN_NODE_TYPE, bw as NodeConnectionTypes, bF as CHAT_TRIGGER_NODE_TYPE, hT as OPEN_AI_NODE_MESSAGE_ASSISTANT_TYPE, hU as OPEN_AI_NODE_TYPE, hV as SPLIT_IN_BATCHES_NODE_TYPE, hW as NO_OP_NODE_TYPE, hX as WEBHOOK_NODE_TYPE, hY as SCHEDULE_TRIGGER_NODE_TYPE, hZ as transformNodeType, bf as useExternalHooks, ac as useCanvasStore, h_ as AI_CATEGORY_LANGUAGE_MODELS, h$ as QA_CHAIN_NODE_TYPE, i0 as AGENT_NODE_TYPE, i1 as BASIC_CHAIN_NODE_TYPE, i2 as OPEN_AI_ASSISTANT_NODE_TYPE, aR as STICKY_NODE_TYPE, i3 as sortNodeCreateElements, i4 as TRIGGER_NODE_CREATOR_VIEW, dS as NODE_CREATOR_OPEN_SOURCES, d as defineComponent, S as useUIStore, ek as useFocusPanelStore, aN as usePostHog, eu as FOCUS_PANEL_EXPERIMENT, i as createElementBlock, g as openBlock, f as createCommentVNode, e as createBlock, n as normalizeClass, j as createVNode, w as withCtx, $ as _sfc_main$1, m as unref, cd as KeyboardShortcutTooltip, eE as defineAsyncComponent, e2 as Suspense, F as Fragment, aH as __vitePreload, i5 as getMidCanvasPosition, i6 as DEFAULT_STICKY_WIDTH, i7 as DEFAULT_STICKY_HEIGHT, _ as _export_sfc } from "./index-7S5ADieN.js";
+import { u as useExperimentalNdvStore } from "./NodeView-DoR46iB5.js";
 const useActions = () => {
   const nodeCreatorStore = useNodeCreatorStore();
   const nodeTypesStore = useNodeTypesStore();
@@ -272,24 +273,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["addNodes", "toggleNodeCreator"],
   setup(__props, { emit: __emit }) {
     const LazyNodeCreator = defineAsyncComponent(
-      async () => await __vitePreload(() => import("./NodeCreator-4g3-zQj6.js"), true ? __vite__mapDeps([0,1,2,3]) : void 0)
+      async () => await __vitePreload(() => import("./NodeCreator-D7xT3ogw.js"), true ? __vite__mapDeps([0,1,2,3,4,5,6,7,8,9,10,11,12,13]) : void 0)
     );
     const props = __props;
     const emit = __emit;
     const uiStore = useUIStore();
+    const focusPanelStore = useFocusPanelStore();
+    const posthogStore = usePostHog();
     const i18n = useI18n();
+    const experimentalNdvStore = useExperimentalNdvStore();
     const { getAddedNodesAndConnections } = useActions();
-    const wrapperRef = ref();
-    const wrapperBoundingRect = ref();
-    const isStickyNotesButtonVisible = ref(true);
-    const onMouseMove = useThrottleFn((event) => {
-      if (wrapperBoundingRect.value) {
-        const offset = 100;
-        isStickyNotesButtonVisible.value = event.clientX >= wrapperBoundingRect.value.left - offset && event.clientX <= wrapperBoundingRect.value.right + offset && event.clientY >= wrapperBoundingRect.value.top - offset && event.clientY <= wrapperBoundingRect.value.bottom + offset;
-      } else {
-        isStickyNotesButtonVisible.value = true;
-      }
-    }, 250);
+    const isOpenFocusPanelButtonVisible = computed(() => {
+      return posthogStore.getVariant(FOCUS_PANEL_EXPERIMENT.name) === FOCUS_PANEL_EXPERIMENT.variant;
+    });
     function openNodeCreator() {
       emit("toggleNodeCreator", {
         source: NODE_CREATOR_OPEN_SOURCES.ADD_NODE_BUTTON,
@@ -315,67 +311,75 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       emit("addNodes", getAddedNodesAndConnections(value));
       closeNodeCreator(true);
     }
-    function setWrapperRect() {
-      wrapperBoundingRect.value = wrapperRef.value?.getBoundingClientRect();
-    }
-    onMounted(() => {
-      setWrapperRect();
-      document.addEventListener("mousemove", onMouseMove);
-      window.addEventListener("resize", setWrapperRect);
-    });
-    onBeforeUnmount(() => {
-      document.removeEventListener("mousemove", onMouseMove);
-      window.removeEventListener("resize", setWrapperRect);
-    });
     return (_ctx, _cache) => {
-      const _component_n8n_icon_button = resolveComponent("n8n-icon-button");
+      const _component_n8n_icon_button = _sfc_main$1;
       return openBlock(), createElementBlock(Fragment, null, [
         !_ctx.createNodeActive ? (openBlock(), createElementBlock("div", {
           key: 0,
           class: normalizeClass(_ctx.$style.nodeButtonsWrapper)
         }, [
-          createBaseVNode("div", {
-            ref_key: "wrapperRef",
-            ref: wrapperRef,
-            class: normalizeClass(_ctx.$style.nodeCreatorButton),
-            "data-test-id": "node-creator-plus-button"
-          }, [
-            createVNode(KeyboardShortcutTooltip, {
-              label: unref(i18n).baseText("nodeView.openNodesPanel"),
-              shortcut: { keys: ["Tab"] },
-              placement: "left"
-            }, {
-              default: withCtx(() => [
-                createVNode(_component_n8n_icon_button, {
-                  size: "large",
-                  icon: "plus",
-                  type: "tertiary",
-                  class: normalizeClass(_ctx.$style.nodeCreatorPlus),
-                  onClick: openNodeCreator
-                }, null, 8, ["class"])
-              ]),
-              _: 1
-            }, 8, ["label"]),
-            createBaseVNode("div", {
-              class: normalizeClass([_ctx.$style.addStickyButton, isStickyNotesButtonVisible.value ? _ctx.$style.visibleButton : ""]),
-              "data-test-id": "add-sticky-button",
-              onClick: addStickyNote
-            }, [
-              createVNode(KeyboardShortcutTooltip, {
-                label: unref(i18n).baseText("nodeView.addStickyHint"),
-                shortcut: { keys: ["s"], shiftKey: true },
-                placement: "left"
-              }, {
-                default: withCtx(() => [
-                  createVNode(_component_n8n_icon_button, {
-                    type: "tertiary",
-                    icon: ["far", "note-sticky"]
-                  })
-                ]),
-                _: 1
-              }, 8, ["label"])
-            ], 2)
-          ], 2)
+          createVNode(KeyboardShortcutTooltip, {
+            label: unref(i18n).baseText("nodeView.openNodesPanel"),
+            shortcut: { keys: ["Tab"] },
+            placement: "left"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_n8n_icon_button, {
+                size: "large",
+                icon: "plus",
+                type: "tertiary",
+                "data-test-id": "node-creator-plus-button",
+                onClick: openNodeCreator
+              })
+            ]),
+            _: 1
+          }, 8, ["label"]),
+          createVNode(KeyboardShortcutTooltip, {
+            label: unref(i18n).baseText("nodeView.addStickyHint"),
+            shortcut: { keys: ["s"], shiftKey: true },
+            placement: "left"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_n8n_icon_button, {
+                size: "large",
+                type: "tertiary",
+                icon: ["far", "note-sticky"],
+                "data-test-id": "add-sticky-button",
+                onClick: addStickyNote
+              })
+            ]),
+            _: 1
+          }, 8, ["label"]),
+          isOpenFocusPanelButtonVisible.value ? (openBlock(), createBlock(KeyboardShortcutTooltip, {
+            key: 0,
+            label: unref(i18n).baseText("nodeView.openFocusPanel"),
+            shortcut: { keys: ["f"], shiftKey: true },
+            placement: "left"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_n8n_icon_button, {
+                type: "tertiary",
+                size: "large",
+                icon: "list",
+                onClick: unref(focusPanelStore).toggleFocusPanel
+              }, null, 8, ["onClick"])
+            ]),
+            _: 1
+          }, 8, ["label"])) : createCommentVNode("", true),
+          unref(experimentalNdvStore).isEnabled ? (openBlock(), createBlock(_component_n8n_icon_button, {
+            key: 1,
+            type: "tertiary",
+            size: "large",
+            icon: "expand",
+            onClick: unref(experimentalNdvStore).expandAllNodes
+          }, null, 8, ["onClick"])) : createCommentVNode("", true),
+          unref(experimentalNdvStore).isEnabled ? (openBlock(), createBlock(_component_n8n_icon_button, {
+            key: 2,
+            type: "tertiary",
+            size: "large",
+            icon: "compress",
+            onClick: unref(experimentalNdvStore).collapseAllNodes
+          }, null, 8, ["onClick"])) : createCommentVNode("", true)
         ], 2)) : createCommentVNode("", true),
         (openBlock(), createBlock(Suspense, null, {
           default: withCtx(() => [
@@ -391,19 +395,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const nodeButtonsWrapper = "_nodeButtonsWrapper_ebnw3_123";
-const addStickyButton = "_addStickyButton_ebnw3_130";
-const visibleButton = "_visibleButton_ebnw3_137";
-const noEvents = "_noEvents_ebnw3_142";
-const nodeCreatorButton = "_nodeCreatorButton_ebnw3_146";
-const nodeCreatorPlus = "_nodeCreatorPlus_ebnw3_154";
+const nodeButtonsWrapper = "_nodeButtonsWrapper_3rkme_123";
 const style0 = {
-  nodeButtonsWrapper,
-  addStickyButton,
-  visibleButton,
-  noEvents,
-  nodeCreatorButton,
-  nodeCreatorPlus
+  nodeButtonsWrapper
 };
 const cssModules = {
   "$style": style0