@n8n/design-system 2.21.0 → 2.22.0

package/dist/n8n-design-system.es.js

@@ -54981,33 +54981,38 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 	},
 	emits: ["itemClick", "select"],
 	setup(e, { expose: t, emit: n }) {
-		let i = V(null), a = y({
+		let i = e, a = V(null), o = y({
 			name: "NoopIcon",
 			render: () => null
-		}), o = n, s = Ce(), c = (e) => !!s[`item.append.${e}`], l = () => {
-			i.value?.open(T7);
-		}, m = () => {
-			i.value?.close(T7);
-		}, h = V("click"), v = (e) => {
-			e === T7 && (h.value = "hover");
-		}, b = (e) => {
-			e === T7 && (h.value = "click");
+		}), s = n, c = Ce(), m = (e) => !!c[`item.append.${e}`], h = l(() => {
+			let e = i.menu.findIndex((e) => !e.isDivider && e.id === "workflow"), t = i.menu.findIndex((e) => !e.isDivider && e.id === "agent");
+			if (e === -1 || t === -1 || t === e + 1) return i.menu;
+			let n = [...i.menu], [r] = n.splice(t, 1), a = n.findIndex((e) => !e.isDivider && e.id === "workflow");
+			return n.splice(a + 1, 0, r), n;
+		}), v = () => {
+			a.value?.open(T7);
+		}, b = () => {
+			a.value?.close(T7);
+		}, x = V("click"), S = (e) => {
+			e === T7 && (x.value = "hover");
+		}, C = (e) => {
+			e === T7 && (x.value = "click");
 		};
 		return t({
-			open: l,
-			close: m
+			open: v,
+			close: b
 		}), (t, n) => (B(), u(G(Tje), {
 			ref_key: "menuRef",
-			ref: i,
+			ref: a,
 			mode: "horizontal",
 			"unique-opened": "",
-			"menu-trigger": h.value,
+			"menu-trigger": x.value,
 			ellipsis: !1,
 			class: N(t.$style.dropdown),
-			onSelect: n[1] ||= (e) => o("select", e),
-			onKeyup: je(m, ["escape"]),
-			onOpen: v,
-			onClose: b
+			onSelect: n[1] ||= (e) => s("select", e),
+			onKeyup: je(b, ["escape"]),
+			onOpen: S,
+			onClose: C
 		}, {
 			default: q(() => [_(G(ow), {
 				index: T7,
@@ -55018,13 +55023,13 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 				teleported: e.teleport
 			}, {
 				title: q(() => [U(t.$slots, "default")]),
-				default: q(() => [(B(!0), f(r, null, H(e.menu, (e) => (B(), f(r, { key: e.id }, [e.isDivider ? (B(), f("hr", yFe)) : e.submenu ? (B(), u(G(ow), {
+				default: q(() => [(B(!0), f(r, null, H(h.value, (e) => (B(), f(r, { key: e.id }, [e.isDivider ? (B(), f("hr", yFe)) : e.submenu ? (B(), u(G(ow), {
 					key: 1,
 					"popper-class": t.$style.nestedSubmenu,
 					index: e.id,
 					"popper-offset": -10,
-					"expand-close-icon": G(a),
-					"expand-open-icon": G(a),
+					"expand-close-icon": G(o),
+					"expand-open-icon": G(o),
 					"data-test-id": "navigation-submenu"
 				}, {
 					title: q(() => [p("div", { class: N(t.$style.subMenuTitle) }, [U(t.$slots, "item-icon", j({ ref_for: !0 }, { item: e }), () => [e.icon ? (B(), f(r, { key: 0 }, [typeof e.icon == "string" || e.icon.type === "icon" ? (B(), u(G(Ni), {
@@ -55051,7 +55056,7 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 							"data-test-id": "navigation-submenu-item",
 							index: i.id,
 							disabled: i.disabled,
-							onClick: n[0] ||= (e) => o("itemClick", e)
+							onClick: n[0] ||= (e) => s("itemClick", e)
 						}, {
 							default: q(() => [
 								U(t.$slots, "item-icon", j({ ref_for: !0 }, { item: i }), () => [i.icon ? (B(), f(r, { key: 0 }, [typeof i.icon == "string" || i.icon.type === "icon" ? (B(), u(G(Ni), {
@@ -55084,7 +55089,7 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 									}, null, 8, ["class"])]),
 									_: 1
 								}, 8, ["content", "class"])) : d("", !0),
-								c(e.id) ? (B(), f("span", {
+								m(e.id) ? (B(), f("span", {
 									key: 1,
 									class: N(t.$style.menuItemAppend)
 								}, [U(t.$slots, `item.append.${e.id}`, j({ ref_for: !0 }, { item: e }))], 2)) : d("", !0)
@@ -55108,7 +55113,7 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 						disabled: e.disabled,
 						"data-test-id": "navigation-menu-item"
 					}, {
-						default: q(() => [g(W(e.title) + " ", 1), c(e.id) ? (B(), f("span", {
+						default: q(() => [g(W(e.title) + " ", 1), m(e.id) ? (B(), f("span", {
 							key: 0,
 							class: N(t.$style.menuItemAppend)
 						}, [U(t.$slots, `item.append.${e.id}`, j({ ref_for: !0 }, { item: e }))], 2)) : d("", !0)]),
@@ -55167,12 +55172,15 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 					"data-test-id": "node-creator-item-name",
 					textContent: W(e.title)
 				}, null, 10, SFe),
-				e.tag?.pill ? (B(), u(b7, {
+				e.tag?.preview ? (B(), u(C7, {
 					key: 0,
+					size: "small"
+				})) : e.tag?.pill ? (B(), u(b7, {
+					key: 1,
 					size: "small",
 					text: e.tag.text
 				}, null, 8, ["text"])) : e.tag ? (B(), u(G(xC), {
-					key: 1,
+					key: 2,
 					class: N(n.$style.tag),
 					"disable-transitions": "",
 					size: "small",
@@ -55183,14 +55191,14 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 					_: 1
 				}, 8, ["class", "type"])) : d("", !0),
 				e.isNew ? (B(), u(G(q_), {
-					key: 2,
+					key: 3,
 					theme: "success"
 				}, {
 					default: q(() => [g(W(G(t)("nodeCreatorNode.new")), 1)]),
 					_: 1
 				})) : d("", !0),
 				e.isTrigger ? (B(), u(G(Ni), {
-					key: 3,
+					key: 4,
 					icon: "bolt-filled",
 					size: "xsmall",
 					title: G(t)("nodeCreator.nodeItem.triggerIconTitle"),
@@ -55225,7 +55233,7 @@ var XPe = { render: YPe }, ZPe = /* @__PURE__ */ X(/* @__PURE__ */ y({
 	description: "_description_1com9_62",
 	aiIcon: "_aiIcon_1com9_70",
 	triggerIcon: "_triggerIcon_1com9_74"
-} }], ["__scopeId", "data-v-86588678"]]), TFe = ["src"], E7 = /* @__PURE__ */ X(/* @__PURE__ */ y({
+} }], ["__scopeId", "data-v-2d8a72b9"]]), TFe = ["src"], E7 = /* @__PURE__ */ X(/* @__PURE__ */ y({
 	__name: "IconContent",
 	props: {
 		type: {},