n8n-editor-ui 1.101.0 → 1.102.0

package/dist/assets/{RunDataParsedAiContent-9EEUzCKp.css → RunDataParsedAiContent-wfIiKsq7.css}

@@ -120,26 +120,26 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._runText_1mfxw_123 {
+._runText_1ucj0_123 {
   line-height: var(--font-line-height-xloose);
   white-space: pre-line;
 }
-._markdown_1mfxw_128 {
+._markdown_1ucj0_128 {
   white-space: pre-wrap;
 }
-._markdown_1mfxw_128 h1 {
+._markdown_1ucj0_128 h1 {
   font-size: var(--font-size-l);
   line-height: var(--font-line-height-xloose);
 }
-._markdown_1mfxw_128 h2 {
+._markdown_1ucj0_128 h2 {
   font-size: var(--font-size-m);
   line-height: var(--font-line-height-loose);
 }
-._markdown_1mfxw_128 h3 {
+._markdown_1ucj0_128 h3 {
   font-size: var(--font-size-s);
   line-height: var(--font-line-height-regular);
 }
-._markdown_1mfxw_128 pre {
+._markdown_1ucj0_128 pre {
   background: var(--chat--message--pre--background);
   border-radius: var(--border-radius-base);
   line-height: var(--font-line-height-xloose);
@@ -147,30 +147,33 @@
   font-size: var(--font-size-s);
   white-space: pre-wrap;
 }
-._compact_1mfxw_151 ._markdown_1mfxw_128 pre {
+._compact_1ucj0_151 ._markdown_1ucj0_128 pre {
   padding: var(--spacing-3xs);
   font-size: var(--font-size-xs);
 }
-._copyToClipboard_1mfxw_156 {
+._compact_1ucj0_151 ._markdown_1ucj0_128 p {
+  line-height: var(--font-line-height-xloose);
+}
+._copyToClipboard_1ucj0_159 {
   position: absolute;
   right: var(--spacing-s);
   top: var(--spacing-s);
 }
-._compact_1mfxw_151 ._copyToClipboard_1mfxw_156 {
+._compact_1ucj0_151 ._copyToClipboard_1ucj0_159 {
   right: var(--spacing-2xs);
   top: var(--spacing-2xs);
 }
-._rawContent_1mfxw_166 {
+._rawContent_1ucj0_169 {
   position: relative;
 }
-._contentText_1mfxw_170 {
+._contentText_1ucj0_173 {
   padding-top: var(--spacing-s);
   padding-left: var(--spacing-m);
   padding-right: var(--spacing-m);
   font-size: var(--font-size-s);
 }
-._compact_1mfxw_151 ._contentText_1mfxw_170 {
+._compact_1ucj0_151 ._contentText_1ucj0_173 {
   padding-top: 0;
   padding-inline: var(--spacing-2xs);
-  font-size: var(--font-size-xs);
+  font-size: var(--font-size-2xs);
 }

package/dist/assets/{RunDataSearch-R6qtl0Jf.css → RunDataSearch-2eEalFoi.css}

@@ -120,29 +120,30 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._ioSearch_vnmep_123 {
+._ioSearch_yd95p_123 {
   transition: max-width 0.3s cubic-bezier(0.19, 1, 0.22, 1);
 }
-._ioSearch_vnmep_123 ._ioSearchIcon_vnmep_126 {
+._ioSearch_yd95p_123 ._ioSearchIcon_yd95p_126 {
   color: var(--color-foreground-xdark);
   cursor: pointer;
+  vertical-align: middle;
 }
-._ioSearch_vnmep_123 .el-input__prefix {
+._ioSearch_yd95p_123 .el-input__prefix {
   left: 8px;
 }
-._ioSearch_vnmep_123.el-input--prefix .el-input__inner {
+._ioSearch_yd95p_123.el-input--prefix .el-input__inner {
   padding-left: 30px;
 }
-._ioSearch_vnmep_123 input {
+._ioSearch_yd95p_123 input {
   border: 0;
   opacity: 0;
   background: transparent;
   cursor: pointer;
 }
-._ioSearchOpened_vnmep_143 ._ioSearchIcon_vnmep_126 {
+._ioSearchOpened_yd95p_144 ._ioSearchIcon_yd95p_126 {
   cursor: default;
 }
-._ioSearchOpened_vnmep_143 input {
+._ioSearchOpened_yd95p_144 input {
   border: var(--input-border-color, var(--border-color-base)) var(--input-border-style, var(--border-style-base)) var(--border-width-base);
   background: var(--input-background-color, var(--color-foreground-xlight));
   opacity: 1;

package/dist/assets/{RunDataSearch-D5eQUWvi.js → RunDataSearch-oo3_BoLt.js}

@@ -1,4 +1,4 @@
-import { d as defineComponent, R as useDebounce, r as ref, x as computed, c as useI18n, o as onMounted, c5 as onUnmounted, a9 as watch, e as createBlock, g as openBlock, w as withCtx, j as createVNode, aW as N8nIcon, n as normalizeClass, O as normalizeStyle, dU as N8nInput, _ as _export_sfc } from "./index-7S5ADieN.js";
+import { d as defineComponent, S as useDebounce, r as ref, x as computed, c as useI18n, o as onMounted, b$ as onUnmounted, aa as watch, e as createBlock, g as openBlock, w as withCtx, i as createVNode, N as N8nIcon, n as normalizeClass, P as normalizeStyle, dO as N8nInput, _ as _export_sfc } from "./index-V0GOmfo8.js";
 const COLLAPSED_WIDTH = "30px";
 const OPEN_WIDTH = "204px";
 const OPEN_MIN_WIDTH = "120px";
@@ -98,9 +98,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ioSearch = "_ioSearch_vnmep_123";
-const ioSearchIcon = "_ioSearchIcon_vnmep_126";
-const ioSearchOpened = "_ioSearchOpened_vnmep_143";
+const ioSearch = "_ioSearch_yd95p_123";
+const ioSearchIcon = "_ioSearchIcon_yd95p_126";
+const ioSearchOpened = "_ioSearchOpened_yd95p_144";
 const style0 = {
   ioSearch,
   ioSearchIcon,

package/dist/assets/{RunDataTable-CJmmTtEp.js → RunDataTable-6rCOQNCX.js}

@@ -1,5 +1,5 @@
-import { d as defineComponent, aa as useCssModule, x as computed, fv as getCurrentInstance, i as createElementBlock, f as createCommentVNode, g as openBlock, F as Fragment, y as renderList, n as normalizeClass, m as unref, J as renderSlot, k as createBaseVNode, t as toDisplayString, e as createBlock, bh as createSlots, w as withCtx, D as mergeProps, _ as _export_sfc, r as ref, aL as useNDVStore, a3 as useWorkflowsStore, fp as storeToRefs, o as onMounted, a9 as watch, h as resolveComponent, j as createVNode, aT as withDirectives, $ as _sfc_main$2, aU as vShow, c as useI18n, Z as N8nTooltip, l as createTextVNode, f1 as InfoTip, hn as Draggable, hK as TextWithHighlights, hL as MappingPill, hM as shorten, hN as getPairedItemId, hO as getMappedExpression, bf as useExternalHooks, ax as useTelemetry } from "./index-7S5ADieN.js";
-import { u as useExecutionHelpers } from "./useExecutionHelpers-BfF56crp.js";
+import { d as defineComponent, ab as useCssModule, x as computed, ft as getCurrentInstance, h as createElementBlock, f as createCommentVNode, g as openBlock, F as Fragment, y as renderList, n as normalizeClass, l as unref, J as renderSlot, j as createBaseVNode, t as toDisplayString, e as createBlock, bh as createSlots, w as withCtx, D as mergeProps, _ as _export_sfc, ar as useTemplateRef, r as ref, aM as useNDVStore, a4 as useWorkflowsStore, fn as storeToRefs, o as onMounted, aa as watch, O as resolveComponent, i as createVNode, aU as withDirectives, a0 as _sfc_main$2, aV as vShow, c as useI18n, $ as N8nTooltip, k as createTextVNode, eX as InfoTip, hr as Draggable, hN as TextWithHighlights, N as N8nIcon, hO as MappingPill, hP as shorten, hQ as getPairedItemId, hR as getMappedExpression, bf as useExternalHooks, ay as useTelemetry } from "./index-V0GOmfo8.js";
+import { u as useExecutionHelpers } from "./useExecutionHelpers-DvBwGIzz.js";
 const _hoisted_1$1 = {
   key: 0,
   class: "n8n-tree"
@@ -114,10 +114,12 @@ const Tree = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__cssModules", cssModul
 const _imports_0 = "/%7B%7BBASE_PATH%7D%7D/static/data-mapping-gif.gif";
 const _hoisted_1 = ["data-row"];
 const _hoisted_2 = ["data-row"];
-const _hoisted_3 = ["data-test-id"];
-const _hoisted_4 = ["data-row"];
-const _hoisted_5 = ["data-row", "data-col"];
-const _hoisted_6 = { key: 1 };
+const _hoisted_3 = { key: 0 };
+const _hoisted_4 = ["width"];
+const _hoisted_5 = ["data-test-id"];
+const _hoisted_6 = ["data-row"];
+const _hoisted_7 = ["data-row", "data-col"];
+const _hoisted_8 = { key: 1 };
 const MAX_COLUMNS_LIMIT = 40;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "RunDataTable",
@@ -134,13 +136,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     search: { default: "" },
     headerBgColor: { default: "base" },
     compact: { type: Boolean, default: false },
-    disableHoverHighlight: { type: Boolean, default: false }
+    disableHoverHighlight: { type: Boolean, default: false },
+    collapsingColumnName: {}
   },
-  emits: ["activeRowChanged", "displayModeChange", "mounted"],
+  emits: ["activeRowChanged", "displayModeChange", "mounted", "collapsingColumnChanged"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emit = __emit;
     const externalHooks = useExternalHooks();
+    const tableRef = useTemplateRef("tableRef");
     const activeColumn = ref(-1);
     const forceShowGrip = ref(false);
     const draggedColumn = ref(false);
@@ -150,6 +154,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const columnLimit = ref(MAX_COLUMNS_LIMIT);
     const columnLimitExceeded = ref(false);
     const draggableRef = ref();
+    const fixedColumnWidths = ref();
     const ndvStore = useNDVStore();
     const workflowsStore = useWorkflowsStore();
     const i18n = useI18n();
@@ -164,6 +169,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const draggableStickyPosition = computed(() => ndvStore.draggableStickyPos);
     const pairedItemMappings = computed(() => workflowsStore.workflowExecutionPairedItemMappings);
     const tableData = computed(() => convertToTable(props.inputData));
+    const collapsingColumnIndex = computed(() => {
+      if (!props.collapsingColumnName) {
+        return -1;
+      }
+      return tableData.value.columns.indexOf(props.collapsingColumnName);
+    });
     onMounted(() => {
       if (tableData.value?.columns && draggableRef.value) {
         const tbody = draggableRef.value.$refs.wrapper;
@@ -347,9 +358,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ...mappingTelemetry
         };
         void externalHooks.run("runDataTable.onDragEnd", telemetryPayload);
-        telemetry.track("User dragged data for mapping", telemetryPayload, {
-          withPostHog: true
-        });
+        telemetry.track("User dragged data for mapping", telemetryPayload);
       }, 1e3);
     }
     function isSimple(data) {
@@ -421,6 +430,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function switchToJsonView() {
       emit("displayModeChange", "json");
     }
+    function handleSetCollapsingColumn(columnIndex) {
+      emit(
+        "collapsingColumnChanged",
+        collapsingColumnIndex.value === columnIndex ? null : tableData.value.columns[columnIndex] ?? null
+      );
+    }
     watch(focusedMappableInput, (curr) => {
       setTimeout(
         () => {
@@ -429,8 +444,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         curr ? 300 : 150
       );
     });
+    watch(
+      [collapsingColumnIndex, tableRef],
+      ([index, table2]) => {
+        if (index === -1) {
+          fixedColumnWidths.value = void 0;
+          return;
+        }
+        if (table2 === null) {
+          return;
+        }
+        fixedColumnWidths.value = [...table2.querySelectorAll("thead tr th")].map(
+          (el) => el instanceof HTMLElement ? el.getBoundingClientRect().width : 0
+        );
+      },
+      { immediate: true, flush: "post" }
+    );
     return (_ctx, _cache) => {
-      const _component_font_awesome_icon = resolveComponent("font-awesome-icon");
+      const _component_n8n_icon = N8nIcon;
       const _component_i18n_t = resolveComponent("i18n-t");
       return openBlock(), createElementBlock("div", {
         class: normalizeClass([
@@ -438,7 +469,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           {
             [_ctx.$style.highlight]: unref(highlight2),
             [_ctx.$style.lightHeader]: _ctx.headerBgColor === "light",
-            [_ctx.$style.compact]: props.compact
+            [_ctx.$style.compact]: props.compact,
+            [_ctx.$style.hasCollapsingColumn]: fixedColumnWidths.value !== void 0
           }
         ])
       }, [
@@ -487,7 +519,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         key: 0,
                         element: "a",
                         type: "secondary",
-                        icon: "external-link-alt",
+                        icon: "external-link",
                         "data-test-id": "debug-sub-execution",
                         size: "mini",
                         target: "_blank",
@@ -521,8 +553,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ])
         ], 2)) : (openBlock(), createElementBlock("table", {
           key: 1,
+          ref_key: "tableRef",
+          ref: tableRef,
           class: normalizeClass(_ctx.$style.table)
         }, [
+          fixedColumnWidths.value ? (openBlock(), createElementBlock("colgroup", _hoisted_3, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(fixedColumnWidths.value, (width, i) => {
+              return openBlock(), createElementBlock("col", {
+                key: i,
+                width
+              }, null, 8, _hoisted_4);
+            }), 128))
+          ])) : createCommentVNode("", true),
           createBaseVNode("thead", null, [
             createBaseVNode("tr", null, [
               tableData.value.metadata.hasExecutionIds ? (openBlock(), createElementBlock("th", {
@@ -530,7 +572,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 class: normalizeClass(_ctx.$style.executionLinkRowHeader)
               }, null, 2)) : createCommentVNode("", true),
               (openBlock(true), createElementBlock(Fragment, null, renderList(tableData.value.columns || [], (column, i) => {
-                return openBlock(), createElementBlock("th", { key: column }, [
+                return openBlock(), createElementBlock("th", {
+                  key: column,
+                  class: normalizeClass(collapsingColumnIndex.value === i ? _ctx.$style.isCollapsingColumn : "")
+                }, [
                   createVNode(unref(N8nTooltip), {
                     placement: "bottom-start",
                     disabled: !_ctx.mappingEnabled,
@@ -571,11 +616,29 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                               content: getValueToRender(column || ""),
                               search: _ctx.search
                             }, null, 8, ["content", "search"]),
-                            createBaseVNode("div", {
+                            createVNode(unref(N8nTooltip), {
+                              content: unref(i18n).baseText("dataMapping.tableView.columnCollapsing.tooltip"),
+                              disabled: _ctx.mappingEnabled || collapsingColumnIndex.value === i
+                            }, {
+                              default: withCtx(() => [
+                                createVNode(unref(_sfc_main$2), {
+                                  class: normalizeClass(_ctx.$style.collapseColumnButton),
+                                  type: "tertiary",
+                                  size: "xmini",
+                                  text: "",
+                                  icon: collapsingColumnIndex.value === i ? "chevrons-up-down" : "chevrons-down-up",
+                                  "aria-label": unref(i18n).baseText("dataMapping.tableView.columnCollapsing"),
+                                  onClick: ($event) => handleSetCollapsingColumn(i)
+                                }, null, 8, ["class", "icon", "aria-label", "onClick"])
+                              ]),
+                              _: 2
+                            }, 1032, ["content", "disabled"]),
+                            _ctx.mappingEnabled ? (openBlock(), createElementBlock("div", {
+                              key: 0,
                               class: normalizeClass(_ctx.$style.dragButton)
                             }, [
-                              createVNode(_component_font_awesome_icon, { icon: "grip-vertical" })
-                            ], 2)
+                              createVNode(_component_n8n_icon, { icon: "grip-vertical" })
+                            ], 2)) : createCommentVNode("", true)
                           ], 2)
                         ]),
                         _: 2
@@ -583,7 +646,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     ]),
                     _: 2
                   }, 1032, ["disabled"])
-                ]);
+                ], 2);
               }), 128)),
               columnLimitExceeded.value ? (openBlock(), createElementBlock("th", {
                 key: 1,
@@ -608,9 +671,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   ]),
                   default: withCtx(() => [
                     createBaseVNode("span", null, [
-                      createVNode(_component_font_awesome_icon, {
+                      createVNode(_component_n8n_icon, {
                         class: normalizeClass(_ctx.$style["warningTooltip"]),
-                        icon: "exclamation-triangle"
+                        icon: "triangle-alert"
                       }, null, 8, ["class"]),
                       createTextVNode(" " + toDisplayString(unref(i18n).baseText("dataMapping.tableView.tableColumnsExceeded")), 1)
                     ])
@@ -667,7 +730,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                           key: 0,
                           element: "a",
                           type: "secondary",
-                          icon: "external-link-alt",
+                          icon: "external-link",
                           "data-test-id": "debug-sub-execution",
                           size: "mini",
                           target: "_blank",
@@ -679,13 +742,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       ]),
                       _: 2
                     }, 1032, ["content"])
-                  ], 42, _hoisted_4)) : createCommentVNode("", true),
+                  ], 42, _hoisted_6)) : createCommentVNode("", true),
                   (openBlock(true), createElementBlock(Fragment, null, renderList(row, (data, index2) => {
                     return openBlock(), createElementBlock("td", {
                       key: index2,
                       "data-row": index1,
                       "data-col": index2,
-                      class: normalizeClass(hasJsonInColumn(index2) ? _ctx.$style.minColWidth : _ctx.$style.limitColWidth),
+                      class: normalizeClass([
+                        hasJsonInColumn(index2) ? _ctx.$style.minColWidth : _ctx.$style.limitColWidth,
+                        collapsingColumnIndex.value === index2 ? _ctx.$style.isCollapsingColumn : ""
+                      ]),
                       onMouseenter: onMouseEnterCell,
                       onMouseleave: onMouseLeaveCell
                     }, [
@@ -726,13 +792,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         ]),
                         _: 2
                       }, 1032, ["node-class", "value"])) : createCommentVNode("", true)
-                    ], 42, _hoisted_5);
+                    ], 42, _hoisted_7);
                   }), 128)),
-                  columnLimitExceeded.value ? (openBlock(), createElementBlock("td", _hoisted_6)) : createCommentVNode("", true),
+                  columnLimitExceeded.value ? (openBlock(), createElementBlock("td", _hoisted_8)) : createCommentVNode("", true),
                   createBaseVNode("td", {
                     class: normalizeClass(_ctx.$style.tableRightMargin)
                   }, null, 2)
-                ], 10, _hoisted_3);
+                ], 10, _hoisted_5);
               }), 128))
             ]),
             _: 1
@@ -742,38 +808,43 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const dataDisplay = "_dataDisplay_1dwr4_123";
-const compact = "_compact_1dwr4_135";
-const table = "_table_1dwr4_139";
-const lightHeader = "_lightHeader_1dwr4_156";
-const tableRightMargin = "_tableRightMargin_1dwr4_159";
-const nodeClass = "_nodeClass_1dwr4_195";
-const emptyCell = "_emptyCell_1dwr4_199";
-const header = "_header_1dwr4_203";
-const draggableHeader = "_draggableHeader_1dwr4_215";
-const dragButton = "_dragButton_1dwr4_219";
-const highlight = "_highlight_1dwr4_223";
-const draggingHeader = "_draggingHeader_1dwr4_227";
-const activeHeader = "_activeHeader_1dwr4_232";
-const dataKey = "_dataKey_1dwr4_241";
-const value = "_value_1dwr4_250";
-const nestedValue = "_nestedValue_1dwr4_254 _value_1dwr4_250";
-const mappable = "_mappable_1dwr4_259";
-const empty = "_empty_1dwr4_199";
-const limitColWidth = "_limitColWidth_1dwr4_267";
-const minColWidth = "_minColWidth_1dwr4_271";
-const hoveringKey = "_hoveringKey_1dwr4_275";
-const draggingKey = "_draggingKey_1dwr4_279";
-const hoveringRow = "_hoveringRow_1dwr4_295";
-const warningTooltip = "_warningTooltip_1dwr4_300";
-const executionLinkCell = "_executionLinkCell_1dwr4_304";
-const executionLinkRowHeader = "_executionLinkRowHeader_1dwr4_308";
+const dataDisplay = "_dataDisplay_zlszl_123";
+const compact = "_compact_zlszl_135";
+const table = "_table_zlszl_139";
+const lightHeader = "_lightHeader_zlszl_156";
+const tableRightMargin = "_tableRightMargin_zlszl_159";
+const hasCollapsingColumn = "_hasCollapsingColumn_zlszl_194";
+const isCollapsingColumn = "_isCollapsingColumn_zlszl_197";
+const nodeClass = "_nodeClass_zlszl_226";
+const emptyCell = "_emptyCell_zlszl_230";
+const header = "_header_zlszl_234";
+const draggableHeader = "_draggableHeader_zlszl_246";
+const dragButton = "_dragButton_zlszl_250";
+const highlight = "_highlight_zlszl_254";
+const draggingHeader = "_draggingHeader_zlszl_258";
+const activeHeader = "_activeHeader_zlszl_263";
+const dataKey = "_dataKey_zlszl_274";
+const value = "_value_zlszl_283";
+const nestedValue = "_nestedValue_zlszl_287 _value_zlszl_283";
+const mappable = "_mappable_zlszl_292";
+const empty = "_empty_zlszl_230";
+const limitColWidth = "_limitColWidth_zlszl_300";
+const minColWidth = "_minColWidth_zlszl_304";
+const hoveringKey = "_hoveringKey_zlszl_308";
+const draggingKey = "_draggingKey_zlszl_312";
+const hoveringRow = "_hoveringRow_zlszl_328";
+const warningTooltip = "_warningTooltip_zlszl_333";
+const executionLinkCell = "_executionLinkCell_zlszl_337";
+const executionLinkRowHeader = "_executionLinkRowHeader_zlszl_341";
+const collapseColumnButton = "_collapseColumnButton_zlszl_345";
 const style0 = {
   dataDisplay,
   compact,
   table,
   lightHeader,
   tableRightMargin,
+  hasCollapsingColumn,
+  isCollapsingColumn,
   nodeClass,
   emptyCell,
   header,
@@ -794,7 +865,8 @@ const style0 = {
   hoveringRow,
   warningTooltip,
   executionLinkCell,
-  executionLinkRowHeader
+  executionLinkRowHeader,
+  collapseColumnButton
 };
 const cssModules = {
   "$style": style0