@atom8n/design-system 2.2.0

package/eslint.config.mjs

@@ -0,0 +1,55 @@
+import storybook from 'eslint-plugin-storybook';
+
+import { defineConfig } from 'eslint/config';
+import { frontendConfig } from '@n8n/eslint-config/frontend';
+
+export default defineConfig(
+	frontendConfig,
+	{
+		rules: {
+			'vue/no-undef-components': ['error', { ignorePatterns: ['N8nDropdownMenuItem'] }],
+
+			// TODO: Remove these
+			'import-x/no-default-export': 'warn',
+			'no-empty': 'warn',
+			'no-prototype-builtins': 'warn',
+			'@typescript-eslint/no-unsafe-argument': 'warn',
+			'@typescript-eslint/no-unsafe-return': 'warn',
+			'@typescript-eslint/no-unsafe-member-access': 'warn',
+			'@typescript-eslint/prefer-optional-chain': 'warn',
+			'@typescript-eslint/prefer-nullish-coalescing': 'warn',
+			'@typescript-eslint/require-await': 'warn',
+			'@typescript-eslint/naming-convention': 'warn',
+			'@typescript-eslint/no-empty-object-type': 'warn',
+			'@typescript-eslint/no-unsafe-assignment': 'warn',
+			'@typescript-eslint/unbound-method': 'warn',
+			'@typescript-eslint/restrict-template-expressions': 'warn',
+			'@typescript-eslint/no-unsafe-call': 'warn',
+		},
+	},
+	{
+		files: ['src/**/*.stories.ts', 'src/**/*.vue', 'src/**/*.spec.ts'],
+		rules: {
+			'@typescript-eslint/naming-convention': [
+				'warn',
+				{
+					selector: ['variable', 'property'],
+					format: ['PascalCase', 'camelCase', 'UPPER_CASE'],
+				},
+			],
+		},
+	},
+	{
+		files: ['src/components/N8nFormInput/validators.ts'],
+		rules: {
+			'@typescript-eslint/naming-convention': [
+				'error',
+				{
+					selector: ['property'],
+					format: ['camelCase', 'UPPER_CASE'],
+				},
+			],
+		},
+	},
+	storybook.configs['flat/recommended'],
+);

package/package.json

@@ -0,0 +1,75 @@
+{
+  "type": "module",
+  "name": "@atom8n/design-system",
+  "version": "2.2.0",
+  "main": "src/index.ts",
+  "import": "src/index.ts",
+  "scripts": {
+    "dev": "pnpm run storybook",
+    "clean": "rimraf dist .turbo",
+    "build": "vite build",
+    "typecheck": "vue-tsc --noEmit",
+    "typecheck:watch": "vue-tsc --watch --noEmit",
+    "test": "vitest run",
+    "test:dev": "vitest",
+    "build:storybook": "storybook build",
+    "storybook": "storybook dev -p 6006 --no-open",
+    "chromatic": "chromatic",
+    "format": "biome format --write .  && prettier --write . --ignore-path ../../../../.prettierignore",
+    "format:check": "biome ci .  && prettier --check . --ignore-path ../../../../.prettierignore",
+    "lint": "eslint src --quiet",
+    "lint:fix": "eslint src --fix",
+    "lint:styles": "stylelint \"src/**/*.{scss,sass,vue}\" --cache",
+    "lint:styles:fix": "stylelint \"src/**/*.{scss,sass,vue}\" --fix --cache"
+  },
+  "devDependencies": {
+    "@n8n/eslint-config": "*",
+    "@n8n/storybook": "*",
+    "@n8n/stylelint-config": "*",
+    "@atom8n/typescript-config": "1.3.0",
+    "@atom8n/vitest-config": "1.5.0",
+    "@testing-library/jest-dom": "catalog:frontend",
+    "@testing-library/user-event": "catalog:frontend",
+    "@testing-library/vue": "catalog:frontend",
+    "@types/lodash": "catalog:",
+    "@types/markdown-it": "^13.0.9",
+    "@types/markdown-it-emoji": "^2.0.2",
+    "@types/markdown-it-link-attributes": "^3.0.5",
+    "@types/sanitize-html": "^2.11.0",
+    "@vitejs/plugin-vue": "catalog:frontend",
+    "@vitest/coverage-v8": "catalog:",
+    "autoprefixer": "^10.4.19",
+    "postcss": "^8.4.38",
+    "sass": "^1.71.1",
+    "tailwindcss": "^3.4.3",
+    "unplugin-icons": "catalog:frontend",
+    "vite": "catalog:",
+    "vitest": "catalog:",
+    "vitest-mock-extended": "catalog:",
+    "vue-tsc": "catalog:frontend",
+    "@vue/test-utils": "catalog:frontend"
+  },
+  "dependencies": {
+    "@internationalized/date": "^3.9.0",
+    "@atom8n/composables": "1.13.0",
+    "@atom8n/utils": "1.21.0",
+    "@tanstack/vue-table": "^8.21.2",
+    "element-plus": "catalog:frontend",
+    "is-emoji-supported": "^0.0.5",
+    "lodash": "catalog:",
+    "markdown-it": "^13.0.2",
+    "markdown-it-emoji": "^2.0.2",
+    "markdown-it-link-attributes": "^4.0.1",
+    "markdown-it-task-lists": "^2.1.1",
+    "parse-diff": "^0.11.1",
+    "reka-ui": "^2.5.0",
+    "sanitize-html": "2.12.1",
+    "vue": "catalog:frontend",
+    "vue-boring-avatars": "^1.3.0",
+    "vue-router": "catalog:frontend",
+    "xss": "catalog:"
+  },
+  "peerDependencies": {
+    "@vueuse/core": "*"
+  }
+}

package/postcss.config.cjs

@@ -0,0 +1,6 @@
+module.exports = {
+	plugins: {
+		// tailwindcss: {},
+		autoprefixer: {},
+	},
+};

package/src/components/N8nIcon/custom/anthropic.svg

@@ -0,0 +1,16 @@
+<svg version="1.1" id="Layer_1" xmlns:x="ns_extend;" xmlns:i="ns_ai;" xmlns:graph="ns_graphs;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 92.2 65" style="enable-background:new 0 0 92.2 65;" xml:space="preserve">
+ <style type="text/css">
+  .st0{fill:#181818;}
+ </style>
+ <metadata>
+  <sfw xmlns="ns_sfw;">
+   <slices>
+   </slices>
+   <sliceSourceBounds bottomLeftOrigin="true" height="65" width="92.2" x="-43.7" y="-98">
+   </sliceSourceBounds>
+  </sfw>
+ </metadata>
+ <path class="st0" d="M66.5,0H52.4l25.7,65h14.1L66.5,0z M25.7,0L0,65h14.4l5.3-13.6h26.9L51.8,65h14.4L40.5,0C40.5,0,25.7,0,25.7,0z
+	 M24.3,39.3l8.8-22.8l8.8,22.8H24.3z">
+ </path>
+</svg>

package/src/components/N8nIcon/custom/binary.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M1 0.642857C1 0.287817 1.27473 0 1.61364 0H4.06818C4.40708 0 4.68182 0.287817 4.68182 0.642857V4.5C4.68182 4.85504 4.40708 5.14286 4.06818 5.14286H1.61364C1.27473 5.14286 1 4.85504 1 4.5V0.642857ZM2.22727 1.28571V3.85714H3.45455V1.28571H2.22727ZM6.31818 0.642857C6.31818 0.287817 6.59292 0 6.93182 0H8.15909C8.49799 0 8.77273 0.287817 8.77273 0.642857V3.85714H9.38636C9.72527 3.85714 10 4.14496 10 4.5C10 4.85504 9.72527 5.14286 9.38636 5.14286H6.93182C6.59292 5.14286 6.31818 4.85504 6.31818 4.5C6.31818 4.14496 6.59292 3.85714 6.93182 3.85714H7.54545V1.28571H6.93182C6.59292 1.28571 6.31818 0.997897 6.31818 0.642857ZM1 7.5C1 7.14496 1.27473 6.85714 1.61364 6.85714H2.84091C3.17981 6.85714 3.45455 7.14496 3.45455 7.5V10.7143H4.06818C4.40708 10.7143 4.68182 11.0021 4.68182 11.3571C4.68182 11.7122 4.40708 12 4.06818 12H1.61364C1.27473 12 1 11.7122 1 11.3571C1 11.0021 1.27473 10.7143 1.61364 10.7143H2.22727V8.14286H1.61364C1.27473 8.14286 1 7.85504 1 7.5ZM6.31818 7.5C6.31818 7.14496 6.59292 6.85714 6.93182 6.85714H9.38636C9.72527 6.85714 10 7.14496 10 7.5V11.3571C10 11.7122 9.72527 12 9.38636 12H6.93182C6.59292 12 6.31818 11.7122 6.31818 11.3571V7.5ZM7.54545 8.14286V10.7143H8.77273V8.14286H7.54545Z" /></svg>

package/src/components/N8nIcon/custom/bolt-filled.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+	<path d="M13.2251 1.02271C13.5179 0.968554 13.8195 1.00233 14.0913 1.11939L14.2055 1.17506L14.3149 1.23951C14.5275 1.37763 14.7014 1.56758 14.8208 1.79127L14.8764 1.90553L14.9214 2.02467C15.0145 2.30522 15.0227 2.60793 14.9438 2.89478C14.9403 2.90772 14.9372 2.92106 14.9331 2.93385L13.0132 8.95338L12.9965 9.00025H19.9995C20.3769 8.99952 20.7471 9.10523 21.0669 9.30592C21.3874 9.50712 21.6437 9.79562 21.8071 10.137C21.9704 10.4783 22.0341 10.8588 21.9897 11.2346C21.9453 11.6105 21.7946 11.9661 21.5561 12.26C21.5375 12.2829 21.5181 12.3052 21.4975 12.3264L11.5971 22.5266L11.5962 22.5256C11.3774 22.7595 11.0907 22.9194 10.7749 22.9778C10.4403 23.0397 10.0944 22.9859 9.7944 22.8254C9.4944 22.665 9.25775 22.4066 9.1235 22.094C8.98941 21.7815 8.96593 21.4327 9.05612 21.1047L9.06686 21.0657L10.9868 15.0462L11.0034 15.0003H3.99948C3.62236 15.0008 3.25253 14.8941 2.93307 14.6936C2.61276 14.4925 2.35617 14.2047 2.19284 13.8635C2.02947 13.5221 1.96581 13.1408 2.01022 12.7649C2.05468 12.3892 2.20544 12.0333 2.44382 11.7395C2.46238 11.7167 2.4819 11.6942 2.50241 11.6731L12.4028 1.47389C12.6215 1.23984 12.9091 1.08117 13.2251 1.02271Z" fill="currentColor" fill-opacity="0.9" style="fill:currentColor;fill-opacity:0.9;"/>
+</svg>

package/src/components/N8nIcon/custom/continue.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M224.975 49.429c17.138-17.139 44.919-17.139 62.057 0l175.546 175.546a43.8 43.8 0 0 1 9.347 13.817l.146.349q.125.298.243.598.1.25.197.5l.147.388q.133.356.261.716l.09.257q.141.407.275.818l.044.136a39 39 0 0 1 .306.988 43.9 43.9 0 0 1 1.802 12.473c0 12.497-5.225 23.774-13.608 31.767L287.032 462.578c-17.138 17.138-44.919 17.138-62.057 0s-17.139-44.92 0-62.059l100.618-100.618H80.458c-24.238 0-43.887-19.649-43.887-43.886s19.65-43.887 43.887-43.887h245.158L224.975 111.486c-17.139-17.138-17.139-44.919 0-62.057" fill="currentColor"/></svg>

package/src/components/N8nIcon/custom/empty-output.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M209.675 387.718c20.945 10.711 30.794 35.749 22.073 58.141-9.306 23.886-36.221 35.695-60.107 26.389-29.106-11.34-56.354-28.746-79.744-52.137-20.47-20.47-36.356-43.894-47.607-68.932l-4.53-10.812-1.517-4.508c-6.284-22.673 5.511-46.874 27.906-55.599 22.392-8.721 47.431 1.129 58.141 22.073l1.945 4.338 2.735 6.453c6.714 14.943 16.204 28.982 28.568 41.346 14.132 14.132 30.44 24.54 47.799 31.304zM91.897 91.905c23.39-23.39 50.638-40.796 79.744-52.137l4.508-1.517c22.673-6.284 46.874 5.512 55.599 27.906 9.303 23.885-2.526 50.781-26.411 60.086-17.359 6.763-33.667 17.171-47.799 31.303-12.364 12.364-21.854 26.403-28.568 41.347l-2.735 6.453-1.945 4.337c-10.71 20.945-35.75 30.794-58.141 22.073-23.886-9.306-35.695-36.221-26.39-60.107 11.341-29.106 28.747-56.353 52.138-79.744M354.462 354.47c12.364-12.364 21.854-26.403 28.568-41.346l2.735-6.453 1.945-4.338c10.71-20.944 35.749-30.794 58.141-22.073 22.394 8.725 34.19 32.926 27.906 55.599l-1.517 4.508-4.53 10.812c-11.251 25.038-27.137 48.462-47.607 68.932-23.39 23.391-50.638 40.797-79.744 52.137-23.886 9.306-50.801-2.503-60.107-26.389-9.303-23.885 2.526-50.78 26.411-60.085l6.453-2.735c14.943-6.715 28.982-16.205 41.346-28.569m65.641-262.565c23.391 23.391 40.796 50.638 52.137 79.744 9.306 23.886-2.503 50.801-26.389 60.107-22.392 8.721-47.431-1.128-58.141-22.073l-1.945-4.337-2.735-6.453c-6.714-14.944-16.204-28.983-28.568-41.347-14.132-14.132-30.44-24.54-47.799-31.303-23.885-9.305-35.714-36.201-26.411-60.086 9.306-23.886 36.221-35.694 60.107-26.389l10.812 4.53c25.038 11.25 48.462 27.137 68.932 47.607" fill="currentColor" /></svg>

package/src/components/N8nIcon/custom/filled-square.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 10 10" fill="currentColor" overflow="hidden" xmlns="http://www.w3.org/2000/svg">
+	<rect x="0" y="0" width="10" height="10" rx="2" ry="2"/>
+</svg>

package/src/components/N8nIcon/custom/form.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" fill="none"><path fill="currentColor" d="M47.267 22.554c-.002.31-.126.608-.344.829l-6.805 6.796a1.13 1.13 0 0 1-.828.344 1.15 1.15 0 0 1-.828-.344 1.18 1.18 0 0 1 0-1.656l5.977-5.969-1.313-1.312-1.383 1.414L28.595 35.78l-4.617.781.781-4.617.336-.336 2.563 2.555c.214.227.515.351.828.343.311.006.611-.119.828-.343a1.18 1.18 0 0 0 0-1.657l-2.563-2.562 8.25-8.273 4.29-4.29 3.757 3.711 1.617-1.617 2.258 2.258c.218.218.342.512.344.82m-17.282 15.15 3.032-3.032v8.297a1.56 1.56 0 0 1-1.563 1.563H4.298a1.56 1.56 0 0 1-1.563-1.563V14.843c0-.405.157-.794.438-1.086l6.304-6.531v5.344H6.251a1.172 1.172 0 1 0 0 2.344h4.43a1.17 1.17 0 0 0 1.171-1.172V5.468h19.602a1.56 1.56 0 0 1 1.563 1.563v13.281L22.86 30.468a1.24 1.24 0 0 0-.328.633l-1.102 6.61c-.06.373.062.753.329 1.023.22.22.517.343.828.343h.195l6.602-1.101a1.16 1.16 0 0 0 .601-.274m-21-16a1.18 1.18 0 0 0 1.172 1.172h15.266a1.172 1.172 0 1 0 0-2.344H10.157a1.17 1.17 0 0 0-1.172 1.172m10.711 14.766a1.17 1.17 0 0 0-1.172-1.172h-8.367a1.172 1.172 0 1 0 0 2.343h8.367a1.17 1.17 0 0 0 1.172-1.172m.86-7.391a1.17 1.17 0 0 0-1.172-1.172h-9.227a1.172 1.172 0 1 0 0 2.344h9.227a1.164 1.164 0 0 0 1.171-1.172M45.75 18.617a1.563 1.563 0 0 0 0-2.203l-1.64-1.64a1.563 1.563 0 0 0-2.204 0l-.93.929 3.852 3.828z"/></svg>

package/src/components/N8nIcon/custom/grip-lines-vertical.svg

@@ -0,0 +1,4 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+	<path d="M9 3L9 21" stroke="currentColor" style="stroke-opacity:1;" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+	<path d="M15 3L15 21" stroke="currentColor" style="stroke-opacity:1;" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/components/N8nIcon/custom/json.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M10.3019 0C10.542 0 10.7678 0.0476193 10.9791 0.142858C11.1905 0.238096 11.373 0.371429 11.5267 0.542858C11.6805 0.714286 11.8005 0.92381 11.887 1.17143C11.9735 1.40952 12.0167 1.67619 12.0167 1.97143L12.0023 3.38571C12.0023 3.50952 12.0023 3.61429 12.0023 3.7C12.0119 3.78571 12.0263 3.87143 12.0455 3.95714C12.0647 4.04286 12.0936 4.13333 12.132 4.22857C12.18 4.31429 12.2425 4.42857 12.3193 4.57143L12.8237 5.24286C12.9198 5.4619 12.9774 5.66667 12.9966 5.85714C13.0158 6.0381 12.9534 6.25238 12.8093 6.5L12.3337 7.11429C12.2569 7.26667 12.1944 7.39524 12.1464 7.5C12.108 7.60476 12.0791 7.70476 12.0599 7.8C12.0407 7.89524 12.0263 7.99524 12.0167 8.1C12.0167 8.20476 12.0167 8.33333 12.0167 8.48571V9.7C12.0167 10.0048 11.9783 10.2952 11.9014 10.5714C11.8342 10.8381 11.7333 11.0714 11.5988 11.2714C11.4739 11.4714 11.3154 11.6286 11.1233 11.7429C10.9311 11.8571 10.7198 11.9143 10.4892 11.9143L9.49487 12C9.48526 12 9.42282 12 9.30753 12C9.19225 12 9.05775 11.9905 8.90404 11.9714C8.75993 11.9619 8.61103 11.9381 8.45731 11.9C8.31321 11.8714 8.20273 11.819 8.12587 11.7429C8.06823 11.6952 8.0202 11.619 7.98177 11.5143C7.95295 11.4095 7.93854 11.3095 7.93854 11.2143C7.93854 11.0238 8.00579 10.8762 8.14028 10.7714C8.27478 10.6667 8.42369 10.6 8.58701 10.5714C8.75993 10.5333 8.92806 10.5143 9.09137 10.5143H9.71102C10.0953 10.5143 10.2826 10.1857 10.273 9.52857L10.2586 8.22857C10.2586 7.94286 10.2682 7.72381 10.2874 7.57143C10.3163 7.40952 10.3595 7.27619 10.4171 7.17143C10.4844 7.06667 10.566 6.9619 10.6621 6.85714C10.7582 6.75238 10.8735 6.60476 11.008 6.41429C11.0944 6.29048 11.1665 6.19048 11.2241 6.11429C11.2818 6.02857 11.3154 5.94762 11.325 5.87143C11.3346 5.79524 11.3154 5.70952 11.2674 5.61429C11.2289 5.51905 11.1569 5.39048 11.0512 5.22857C10.8975 5 10.7678 4.81905 10.6621 4.68571C10.566 4.55238 10.4844 4.42857 10.4171 4.31429C10.3595 4.2 10.3163 4.08095 10.2874 3.95714C10.2682 3.83333 10.2586 3.66191 10.2586 3.44286V2.41429C10.2586 2.29048 10.2538 2.17143 10.2442 2.05714C10.2442 1.94286 10.225 1.84286 10.1866 1.75714C10.1481 1.67143 10.0857 1.60476 9.99923 1.55714C9.92238 1.50952 9.8119 1.48571 9.66779 1.48571H9.01932C9.00972 1.48571 8.97129 1.48571 8.90404 1.48571C8.83679 1.48571 8.75513 1.48095 8.65906 1.47143C8.56299 1.45238 8.46212 1.42857 8.35644 1.4C8.25076 1.36191 8.1595 1.30476 8.08264 1.22857C8.025 1.18095 7.97697 1.10476 7.93854 1C7.90972 0.895238 7.89531 0.795238 7.89531 0.7C7.89531 0.509524 7.96256 0.361905 8.09705 0.257143C8.23155 0.152381 8.38526 0.0857146 8.55819 0.057143C8.73111 0.0190477 8.89924 0 9.06255 0H10.3019Z M3.93745 0C4.10077 0 4.26889 0.0190477 4.44181 0.057143C4.61474 0.0857146 4.76845 0.152381 4.90295 0.257143C5.03745 0.361905 5.10469 0.509524 5.10469 0.7C5.10469 0.795238 5.08548 0.895238 5.04705 1C5.01823 1.10476 4.975 1.18095 4.91736 1.22857C4.8405 1.30476 4.74924 1.36191 4.64356 1.4C4.53788 1.42857 4.43701 1.45238 4.34094 1.47143C4.24487 1.48095 4.16321 1.48571 4.09596 1.48571C4.02871 1.48571 3.99029 1.48571 3.98068 1.48571H3.33221C3.1881 1.48571 3.07282 1.50952 2.98636 1.55714C2.9095 1.60476 2.85186 1.67143 2.81343 1.75714C2.775 1.84286 2.75099 1.94286 2.74138 2.05714C2.74138 2.17143 2.74138 2.29048 2.74138 2.41429V3.44286C2.74138 3.66191 2.72697 3.83333 2.69815 3.95714C2.67893 4.08095 2.6357 4.2 2.56845 4.31429C2.51081 4.42857 2.42915 4.55238 2.32348 4.68571C2.22741 4.81905 2.10251 5 1.9488 5.22857C1.84313 5.39048 1.76627 5.51905 1.71824 5.61429C1.67981 5.70952 1.6654 5.79524 1.675 5.87143C1.68461 5.94762 1.71824 6.02857 1.77588 6.11429C1.83352 6.19048 1.90557 6.29048 1.99203 6.41429C2.12653 6.60476 2.24182 6.75238 2.33789 6.85714C2.43396 6.9619 2.51081 7.06667 2.56845 7.17143C2.6357 7.27619 2.67893 7.40952 2.69815 7.57143C2.72697 7.72381 2.74138 7.94286 2.74138 8.22857L2.72697 9.52857C2.71736 10.1857 2.9047 10.5143 3.28898 10.5143H3.90863C4.07194 10.5143 4.23526 10.5333 4.39858 10.5714C4.57151 10.6 4.72522 10.6667 4.85972 10.7714C4.99421 10.8762 5.06146 11.0238 5.06146 11.2143C5.06146 11.3095 5.04225 11.4095 5.00382 11.5143C4.975 11.619 4.93177 11.6952 4.87413 11.7429C4.79727 11.819 4.68199 11.8714 4.52828 11.9C4.38417 11.9381 4.23526 11.9619 4.08155 11.9714C3.93745 11.9905 3.80775 12 3.69247 12C3.57719 12 3.51474 12 3.50513 12L2.51081 11.9143C2.28024 11.9143 2.06889 11.8571 1.87675 11.7429C1.68461 11.6286 1.52129 11.4714 1.3868 11.2714C1.2619 11.0714 1.16103 10.8381 1.08418 10.5714C1.01693 10.2952 0.983302 10.0048 0.983302 9.7V8.48571C0.983302 8.33333 0.978499 8.20476 0.968892 8.1C0.968892 7.99524 0.959285 7.89524 0.940071 7.8C0.920857 7.70476 0.887232 7.60476 0.839198 7.5C0.80077 7.39524 0.743128 7.26667 0.666272 7.11429L0.190727 6.5C0.0466221 6.25238 -0.0158233 6.0381 0.00339071 5.85714C0.0226046 5.66667 0.0802464 5.4619 0.176316 5.24286L0.680682 4.57143C0.757538 4.42857 0.81518 4.31429 0.853608 4.22857C0.901643 4.13333 0.935267 4.04286 0.954481 3.95714C0.973695 3.87143 0.983302 3.78571 0.983302 3.7C0.992909 3.61429 0.997712 3.50952 0.997712 3.38571L0.983302 1.97143C0.983302 1.67619 1.02653 1.40952 1.113 1.17143C1.19946 0.92381 1.31955 0.714286 1.47326 0.542858C1.62697 0.371429 1.8095 0.238096 2.02086 0.142858C2.23221 0.0476193 2.45797 0 2.69815 0H3.93745Z" /></svg>

package/src/components/N8nIcon/custom/lovable.svg

@@ -0,0 +1,46 @@
+<svg width="121" height="122" viewBox="0 0 121 122" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_572_319" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="121" height="122">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M36.0687 0C55.9888 0 72.1373 16.1551 72.1373 36.0835V49.7975H84.141C104.061 49.7975 120.21 65.9526 120.21 85.8809C120.21 105.809 104.061 121.964 84.141 121.964H0V36.0835C0 16.1551 16.1485 0 36.0687 0Z" fill="url(#paint0_linear_572_319)"/>
+</mask>
+<g mask="url(#mask0_572_319)">
+<g filter="url(#filter0_f_572_319)">
+<ellipse cx="52.7381" cy="65.1011" rx="81.3729" ry="81.1923" fill="#4B73FF"/>
+</g>
+<g filter="url(#filter1_f_572_319)">
+<ellipse cx="61.6734" cy="20.547" rx="104.216" ry="81.1923" fill="#FF66F4"/>
+</g>
+<g filter="url(#filter2_f_572_319)">
+<ellipse cx="78.6659" cy="5.26802" rx="81.3729" ry="71.3042" fill="#FF0105"/>
+</g>
+<g filter="url(#filter3_f_572_319)">
+<ellipse cx="63.121" cy="20.5275" rx="48.9374" ry="48.8288" fill="#FE7B02"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_f_572_319" x="-65.0219" y="-52.4784" width="235.52" height="235.159" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="18.1936" result="effect1_foregroundBlur_572_319"/>
+</filter>
+<filter id="filter1_f_572_319" x="-78.9301" y="-97.0324" width="281.208" height="235.159" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="18.1936" result="effect1_foregroundBlur_572_319"/>
+</filter>
+<filter id="filter2_f_572_319" x="-39.0942" y="-102.423" width="235.52" height="215.383" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="18.1936" result="effect1_foregroundBlur_572_319"/>
+</filter>
+<filter id="filter3_f_572_319" x="-22.2036" y="-64.6884" width="170.649" height="170.432" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="18.1936" result="effect1_foregroundBlur_572_319"/>
+</filter>
+<linearGradient id="paint0_linear_572_319" x1="40.4527" y1="21.4331" x2="76.9327" y2="121.971" gradientUnits="userSpaceOnUse">
+<stop offset="0.025" stop-color="#FF8E63"/>
+<stop offset="0.56" stop-color="#FF7EB0"/>
+<stop offset="0.95" stop-color="#4B73FF"/>
+</linearGradient>
+</defs>
+</svg>

package/src/components/N8nIcon/custom/mcp.svg

@@ -0,0 +1 @@
+<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>ModelContextProtocol</title><path d="M15.688 2.343a2.588 2.588 0 00-3.61 0l-9.626 9.44a.863.863 0 01-1.203 0 .823.823 0 010-1.18l9.626-9.44a4.313 4.313 0 016.016 0 4.116 4.116 0 011.204 3.54 4.3 4.3 0 013.609 1.18l.05.05a4.115 4.115 0 010 5.9l-8.706 8.537a.274.274 0 000 .393l1.788 1.754a.823.823 0 010 1.18.863.863 0 01-1.203 0l-1.788-1.753a1.92 1.92 0 010-2.754l8.706-8.538a2.47 2.47 0 000-3.54l-.05-.049a2.588 2.588 0 00-3.607-.003l-7.172 7.034-.002.002-.098.097a.863.863 0 01-1.204 0 .823.823 0 010-1.18l7.273-7.133a2.47 2.47 0 00-.003-3.537z"></path><path d="M14.485 4.703a.823.823 0 000-1.18.863.863 0 00-1.204 0l-7.119 6.982a4.115 4.115 0 000 5.9 4.314 4.314 0 006.016 0l7.12-6.982a.823.823 0 000-1.18.863.863 0 00-1.204 0l-7.119 6.982a2.588 2.588 0 01-3.61 0 2.47 2.47 0 010-3.54l7.12-6.982z"></path></svg>

package/src/components/N8nIcon/custom/node-dirty.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M10.12 3.3c.911-1.395 3.012-1.349 3.844.14l8.222 14.712c.838 1.5-.246 3.348-1.964 3.348H3.778c-1.718 0-2.802-1.848-1.964-3.348L10.036 3.44zM5.057 18.5h13.886L12 6.073z"/></svg>

package/src/components/N8nIcon/custom/node-ellipsis.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M4.5 9.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5m7.5 0a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5m7.5 0a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5"/></svg>

package/src/components/N8nIcon/custom/node-execution-error.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M12 1c6.075 0 11 4.925 11 11s-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1m5.56 5.44a1.5 1.5 0 0 0-2.12 0L12 9.878l-3.44-3.44A1.5 1.5 0 1 0 6.44 8.56L9.878 12l-3.44 3.44a1.5 1.5 0 1 0 2.122 2.12L12 14.122l3.44 3.44.114.103a1.5 1.5 0 0 0 2.11-2.11l-.104-.114L14.122 12l3.44-3.44a1.5 1.5 0 0 0 0-2.12" clip-rule="evenodd"/></svg>

package/src/components/N8nIcon/custom/node-pin.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.297 2.515A3 3 0 0 1 16 8.5v2.26l.01.138a1 1 0 0 0 .545.756l.006.003 1.774.898.184.1A3 3 0 0 1 20 15.238V16a2 2 0 0 1-2 2h-4.5v4a1.5 1.5 0 0 1-3 0v-4H6a2 2 0 0 1-1.99-1.803L4 16v-.76l.008-.209a3 3 0 0 1 1.657-2.476l1.773-.898.007-.003a1 1 0 0 0 .545-.756L8 10.76V8.5a3 3 0 0 1 0-6h8z"/></svg>

package/src/components/N8nIcon/custom/node-play.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill="currentColor" d="M5.52 2.122c.322-.175.713-.16 1.021.037l14 9a1 1 0 0 1 0 1.682l-14 9A1.001 1.001 0 0 1 5 21V3a1 1 0 0 1 .52-.878"/></svg>

package/src/components/N8nIcon/custom/node-power.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M16.645 5.907a1.5 1.5 0 0 1 2.122.028 9.77 9.77 0 0 1 2.585 4.953 9.9 9.9 0 0 1-.53 5.579 9.66 9.66 0 0 1-3.476 4.357 9.36 9.36 0 0 1-5.28 1.657 9.36 9.36 0 0 1-5.292-1.623 9.66 9.66 0 0 1-3.504-4.335 9.9 9.9 0 0 1-.564-5.576 9.77 9.77 0 0 1 2.556-4.97l.11-.105a1.501 1.501 0 0 1 2.05 2.187l-.166.178a6.8 6.8 0 0 0-1.602 3.266 6.9 6.9 0 0 0 .393 3.884 6.66 6.66 0 0 0 2.413 2.989 6.36 6.36 0 0 0 3.595 1.105 6.36 6.36 0 0 0 3.59-1.128 6.66 6.66 0 0 0 2.394-3.005 6.9 6.9 0 0 0 .37-3.887 6.77 6.77 0 0 0-1.79-3.433 1.5 1.5 0 0 1 .026-2.12"/><path fill="currentColor" d="M12.035 1.481a1.5 1.5 0 0 1 1.5 1.5v9a1.5 1.5 0 0 1-3 0v-9a1.5 1.5 0 0 1 1.5-1.5"/></svg>

package/src/components/N8nIcon/custom/node-success.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M19.94 5.502a1.5 1.5 0 1 1 2.12 2.12L9.687 19.999a1.5 1.5 0 0 1-2.122 0L1.94 14.373a1.5 1.5 0 0 1 2.007-2.225l.115.104 4.564 4.564z"/></svg>

package/src/components/N8nIcon/custom/node-trash.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M21 6a1 1 0 1 1 0 2h-1v12.125c0 .817-.424 1.534-.941 2.019-.522.488-1.256.856-2.059.856H7c-.803 0-1.537-.368-2.059-.856C4.424 21.659 4 20.943 4 20.125V8H3a1 1 0 0 1 0-2zm-7-5a3 3 0 0 1 3 3H7a3 3 0 0 1 3-3z"/></svg>

package/src/components/N8nIcon/custom/node-validation-error.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.0506 2.38452C10.9161 0.882058 13.0845 0.882058 13.95 2.38452L23.3065 18.6267C24.1706 20.1267 23.0883 21.9997 21.3572 21.9998H2.6424C0.911559 21.9994 -0.170877 20.1266 0.693176 18.6267L10.0506 2.38452ZM11.9998 15.9998C11.1715 15.9999 10.4999 16.6715 10.4998 17.4998C10.4998 18.3281 11.1715 18.9997 11.9998 18.9998C12.8282 18.9998 13.4998 18.3282 13.4998 17.4998C13.4997 16.6714 12.8282 15.9998 11.9998 15.9998ZM11.9998 7.49976C11.1715 7.49986 10.4999 8.17148 10.4998 8.99976V12.4998C10.4998 13.3281 11.1715 13.9997 11.9998 13.9998C12.8282 13.9998 13.4998 13.3282 13.4998 12.4998V8.99976C13.4997 8.17142 12.8282 7.49976 11.9998 7.49976Z" fill="currentColor"/>
+</svg>

package/src/components/N8nIcon/custom/pop-out.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M13.3333 12.5525V12.4489C14.2278 12.0756 14.8571 11.1925 14.8571 10.1632V3.61924C14.8571 2.96252 14.5962 2.3327 14.1318 1.86832C13.6675 1.40395 13.0376 1.14307 12.3809 1.14307H5.90473C5.38113 1.14296 4.87098 1.30883 4.44756 1.61684C4.02414 1.92485 3.70926 2.35915 3.54816 2.85734H3.39501C2.70016 2.85734 2.10892 3.10191 1.70206 3.5842C1.30739 4.05124 1.14282 4.67372 1.14282 5.33352V12.0002C1.14282 12.8078 1.43463 13.5346 1.98854 14.0573C2.54168 14.5777 3.30892 14.8535 4.19044 14.8535H7.17711L10.2826 14.8573H10.2842C11.0278 14.8611 11.7645 14.7049 12.336 14.3392C12.9303 13.9582 13.3333 13.3525 13.3333 12.5525ZM3.39501 4.0002H3.42854V10.1625C3.42854 10.8192 3.68942 11.449 4.1538 11.9134C4.61817 12.3777 5.248 12.6386 5.90473 12.6386H12.1874C12.163 12.9571 12.003 13.1948 11.7196 13.3761C11.3897 13.588 10.8891 13.7175 10.2887 13.7144H10.2857L7.17558 13.7106H4.19044C3.54816 13.7106 3.07806 13.5125 2.7733 13.2253C2.47006 12.9403 2.28568 12.5259 2.28568 12.0002V5.33352C2.28568 4.84971 2.40758 4.52057 2.5752 4.32096C2.73139 4.13658 2.98054 4.0002 3.39501 4.0002ZM8.01673 3.80972H11.619C11.7706 3.80972 11.9159 3.86992 12.0231 3.97709C12.1302 4.08425 12.1904 4.22959 12.1904 4.38115V7.98418C12.1904 8.13573 12.1302 8.28107 12.0231 8.38823C11.9159 8.4954 11.7706 8.5556 11.619 8.5556C11.4675 8.5556 11.3221 8.4954 11.215 8.38823C11.1078 8.28107 11.0476 8.13573 11.0476 7.98418V5.76019L7.07044 9.73731C7.0177 9.79186 6.95463 9.83536 6.8849 9.86528C6.81517 9.89519 6.74018 9.91092 6.6643 9.91154C6.58843 9.91217 6.51319 9.89767 6.44298 9.86891C6.37277 9.84014 6.30899 9.79768 6.25536 9.74401C6.20173 9.69033 6.15933 9.62651 6.13063 9.55627C6.10193 9.48603 6.08751 9.41078 6.0882 9.3349C6.0889 9.25903 6.1047 9.18406 6.13468 9.11435C6.16466 9.04465 6.20822 8.98162 6.26282 8.92893L10.24 4.95257H8.01673C7.86517 4.95257 7.71983 4.89237 7.61267 4.7852C7.5055 4.67804 7.4453 4.5327 7.4453 4.38115C7.4453 4.22959 7.5055 4.08425 7.61267 3.97709C7.71983 3.86992 7.86517 3.80972 8.01673 3.80972Z" /></svg>

package/src/components/N8nIcon/custom/resolver.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none">
+  <path d="M23.0877 0H13.9944L16.8048 8.75784H25.8982L18.5411 13.9805L21.3523 22.788C26.0879 19.3383 27.6352 14.1173 25.899 8.75784L23.0877 0ZM2.09058 8.75784H11.1839L13.9944 0H4.90182L2.09058 8.75784C0.353512 14.1173 1.90165 19.3383 6.63727 22.788L9.44769 13.9805L2.09058 8.75784ZM6.63727 22.788L13.9944 28L21.3515 22.788L13.9944 17.4896L6.63727 22.788Z" fill="currentColor"/>
+</svg>

package/src/components/N8nIcon/custom/retry.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M416.648 227.85c23.324 0 42.232 18.908 42.232 42.232v84.462c0 38.872-31.513 70.384-70.385 70.385H191.423v36.402c0 12.541-15.163 18.822-24.031 9.954l-78.63-78.631c-5.498-5.497-5.498-14.411 0-19.908l78.63-78.631c8.868-8.868 24.031-2.587 24.031 9.954v36.398h182.995v-70.385c0-23.324 18.907-42.231 42.23-42.232M304.028 50.669c0-12.541 15.163-18.822 24.031-9.954l78.63 78.631c5.498 5.497 5.498 14.41 0 19.908l-78.63 78.631c-8.868 8.867-24.031 2.587-24.031-9.954v-36.38H121.033v70.385c0 23.324-18.908 42.231-42.231 42.231s-42.23-18.907-42.23-42.231v-84.462c0-38.872 31.512-70.385 70.384-70.385h197.072z" fill="currentColor"/></svg>

package/src/components/N8nIcon/custom/run-once.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M275.114 36.8c22.13 2.247 39.401 20.934 39.401 43.657v307.204h73.142c24.237 0 43.886 19.648 43.886 43.885s-19.648 43.886-43.886 43.886H153.6c-24.238-.001-43.886-19.649-43.886-43.886s19.648-43.885 43.886-43.885h73.143V124.343H153.6c-24.238 0-43.886-19.649-43.886-43.886s19.648-43.885 43.886-43.886h117.029z" fill="currentColor"/></svg>

package/src/components/N8nIcon/custom/schema.svg

@@ -0,0 +1,6 @@
+<svg viewBox="0 -1 14 14" xmlns="http://www.w3.org/2000/svg">
+	<path
+		fill="currentColor"
+		d="M1.63636 0H8.18182C9.08556 0 9.81818 0.732625 9.81818 1.63636C9.81818 2.5401 9.08556 3.27273 8.18182 3.27273H1.63636C0.732626 3.27273 0 2.5401 0 1.63636C0 0.732625 0.732625 0 1.63636 0ZM1.63636 1.09091C1.33512 1.09091 1.09091 1.33512 1.09091 1.63636C1.09091 1.93761 1.33512 2.18182 1.63636 2.18182H8.18182C8.48306 2.18182 8.72727 1.93761 8.72727 1.63636C8.72727 1.33512 8.48306 1.09091 8.18182 1.09091H1.63636Z M7.09091 4.36353H11.4545C12.3583 4.36353 13.0909 5.09615 13.0909 5.99989C13.0909 6.90363 12.3583 7.63625 11.4545 7.63625H7.09091C6.18717 7.63625 5.45454 6.90363 5.45454 5.99989C5.45454 5.09615 6.18717 4.36353 7.09091 4.36353ZM7.09091 5.45443C6.78966 5.45443 6.54545 5.69864 6.54545 5.99989C6.54545 6.30114 6.78966 6.54534 7.09091 6.54534H11.4545C11.7558 6.54534 12 6.30114 12 5.99989C12 5.69864 11.7558 5.45443 11.4545 5.45443H7.09091Z M7.09091 8.72729H11.4545C12.3583 8.72729 13.0909 9.45992 13.0909 10.3637C13.0909 11.2674 12.3583 12 11.4545 12H7.09091C6.18717 12 5.45454 11.2674 5.45454 10.3637C5.45454 9.45992 6.18717 8.72729 7.09091 8.72729ZM7.09091 9.8182C6.78966 9.8182 6.54545 10.0624 6.54545 10.3637C6.54545 10.6649 6.78966 10.9091 7.09091 10.9091H11.4545C11.7558 10.9091 12 10.6649 12 10.3637C12 10.0624 11.7558 9.8182 11.4545 9.8182H7.09091Z"
+	/>
+</svg>

package/src/components/N8nIcon/custom/spinner.svg

@@ -0,0 +1,12 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 2V5" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M12 19V22" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M12 2V5" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M12 19V22" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M22.005 11.9951L19.005 11.9951" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M5.005 11.9951L2.005 11.9951" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M19.0796 19.0676L16.9583 16.9463" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M7.05884 7.04688L4.93752 4.92555" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M4.9375 19.0676L7.05882 16.9463" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+<path d="M16.9583 7.04688L19.0796 4.92556" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/src/components/N8nIcon/custom/status-canceled.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M 14 7 C 14 10.866 10.866 14 7 14 C 3.134 14 0 10.866 0 7 C 0 3.134 3.134 0 7 0 C 10.866 0 14 3.134 14 7 Z M 11.243 6 L 2.758 6 L 2.758 8 L 11.243 8 L 11.243 6 Z" /></svg>

package/src/components/N8nIcon/custom/status-completed.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M 14 7 C 14 10.866 10.866 14 7 14 C 3.134 14 0 10.866 0 7 C 0 3.134 3.134 0 7 0 C 10.866 0 14 3.134 14 7 Z M 2.575 7.728 L 5.782 10.935 L 11.489 5.228 L 10.075 3.814 L 5.782 8.107 L 3.989 6.314 L 2.575 7.728 Z" /></svg>

package/src/components/N8nIcon/custom/status-error.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M 4.207 2.793 L 7 5.586 L 9.793 2.793 L 11.207 4.207 L 8.414 7 L 11.207 9.793 L 9.793 11.207 L 7 8.414 L 4.207 11.207 L 2.793 9.793 L 5.586 7 L 2.793 4.207 L 4.207 2.793 Z M 7 0 C 3.134 0 0 3.134 0 7 C 0 10.866 3.134 14 7 14 C 10.866 14 14 10.866 14 7 C 14 3.134 10.866 0 7 0 Z" /></svg>

package/src/components/N8nIcon/custom/status-new.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M 14 7.006 C 14 8.867 13.162 10.744 11.95 11.956 C 10.738 13.168 8.861 14.006 7 14.006 C 5.139 14.006 3.262 13.168 2.05 11.956 C 0.838 10.744 0 8.867 0 7.006 C 0 5.145 0.838 3.268 2.05 2.056 C 3.262 0.844 5.139 0.006 7 0.006 C 8.861 0.006 10.738 0.844 11.95 2.056 C 13.162 3.268 14 5.145 14 7.006 Z M 10.536 3.47 C 9.576 2.511 8.453 2.006 7 2.006 C 5.547 2.006 4.424 2.511 3.464 3.47 C 2.505 4.43 2 5.553 2 7.006 C 2 8.459 2.505 9.582 3.464 10.542 C 4.424 11.501 5.547 12.006 7 12.006 C 8.453 12.006 9.576 11.501 10.536 10.542 C 11.495 9.582 12 8.459 12 7.006 C 12 5.553 11.495 4.43 10.536 3.47 Z" /></svg>

package/src/components/N8nIcon/custom/status-unknown.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M13.8668 8.36613L11.9048 7.978C11.967 7.66329 12 7.33649 12 7C12 6.66351 11.967 6.3367 11.9048 6.022L13.8668 5.63387C13.9542 6.07571 14 6.5325 14 7C14 7.4675 13.9542 7.92429 13.8668 8.36613ZM12.821 3.11069L11.159 4.22333C10.7934 3.67721 10.3228 3.2066 9.77667 2.84098L10.8893 1.17904C11.6527 1.6901 12.3099 2.34733 12.821 3.11069ZM8.36613 0.133238L7.978 2.09521C7.66329 2.03296 7.33649 2 7 2C6.66351 2 6.3367 2.03296 6.022 2.09521L5.63387 0.133238C6.07571 0.0458286 6.5325 0 7 0C7.4675 0 7.92429 0.0458285 8.36613 0.133238ZM3.11069 1.17904L4.22333 2.84098C3.67721 3.2066 3.2066 3.67721 2.84098 4.22333L1.17904 3.11069C1.6901 2.34733 2.34733 1.6901 3.11069 1.17904ZM0.133238 5.63387C0.0458285 6.07571 0 6.5325 0 7C0 7.4675 0.0458286 7.92429 0.133238 8.36613L2.09521 7.978C2.03296 7.6633 2 7.33649 2 7C2 6.66351 2.03296 6.33671 2.09521 6.022L0.133238 5.63387ZM1.17904 10.8893L2.84098 9.77667C3.2066 10.3228 3.67721 10.7934 4.22333 11.159L3.11069 12.821C2.34733 12.3099 1.6901 11.6527 1.17904 10.8893ZM5.63387 13.8668L6.022 11.9048C6.33671 11.967 6.66351 12 7 12C7.33649 12 7.6633 11.967 7.978 11.9048L8.36613 13.8668C7.92429 13.9542 7.4675 14 7 14C6.5325 14 6.07571 13.9542 5.63387 13.8668ZM10.8893 12.821L9.77667 11.159C10.3228 10.7934 10.7934 10.3228 11.159 9.77667L12.821 10.8893C12.3099 11.6527 11.6527 12.3099 10.8893 12.821Z" /></svg>

package/src/components/N8nIcon/custom/status-waiting.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M7 14C10.866 14 14 10.866 14 7C14 3.13401 10.866 0 7 0C3.13401 0 0 3.13401 0 7C0 10.866 3.13401 14 7 14ZM7 12C4.23858 12 2 9.76142 2 7C2 4.23858 4.23858 2 7 2C9.76142 2 12 4.23858 12 7C12 9.76142 9.76142 12 7 12ZM6 3V8H11C11 5.23858 8.76142 3 6 3Z" /></svg>

package/src/components/N8nIcon/custom/status-warning.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M 14 7 C 14 10.866 10.866 14 7 14 C 3.134 14 0 10.866 0 7 C 0 3.134 3.134 0 7 0 C 10.866 0 14 3.134 14 7 Z M 6.5 9 C 6.224 9 6 9.224 6 9.5 L 6 10.5 C 6 10.776 6.224 11 6.5 11 L 7.5 11 C 7.776 11 8 10.776 8 10.5 L 8 9.5 C 8 9.224 7.776 9 7.5 9 L 6.5 9 Z M 6.5 3 C 6.224 3 6 3.224 6 3.5 L 6 7.5 C 6 7.776 6.224 8 6.5 8 L 7.5 8 C 7.776 8 8 7.776 8 7.5 L 8 3.5 C 8 3.224 7.776 3 7.5 3 L 6.5 3 Z" /></svg>

package/src/components/N8nIcon/custom/text.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M1.78814e-07 0.666667C1.78814e-07 0.298477 0.298477 0 0.666667 0H11.3333C11.7015 0 12 0.298477 12 0.666667C12 1.03486 11.7015 1.33333 11.3333 1.33333H0.666667C0.298477 1.33333 1.78814e-07 1.03486 1.78814e-07 0.666667ZM1.78814e-07 3.62963C1.78814e-07 3.26144 0.298477 2.96296 0.666667 2.96296H11.3333C11.7015 2.96296 12 3.26144 12 3.62963C12 3.99782 11.7015 4.2963 11.3333 4.2963H0.666667C0.298477 4.2963 1.78814e-07 3.99782 1.78814e-07 3.62963ZM0 6.59259C0 6.2244 0.298477 5.92593 0.666667 5.92593H11.3333C11.7015 5.92593 12 6.2244 12 6.59259C12 6.96078 11.7015 7.25926 11.3333 7.25926H0.666667C0.298477 7.25926 0 6.96078 0 6.59259ZM0 9.55556C0 9.18737 0.298477 8.88889 0.666667 8.88889H8.66667C9.03486 8.88889 9.33333 9.18737 9.33333 9.55556C9.33333 9.92375 9.03486 10.2222 8.66667 10.2222H0.666667C0.298477 10.2222 0 9.92375 0 9.55556Z" /></svg>

package/src/components/N8nIcon/custom/toolbox.svg

@@ -0,0 +1,3 @@
+<svg aria-hidden="true" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path style="stroke:currentColor;stroke-opacity: 1;" d="M8 8V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v4m6 12V10a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2ZM8 13v4m8-4v4M2 15h20" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/src/components/N8nIcon/custom/triangle.svg

@@ -0,0 +1 @@
+<svg  viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path 	fill="currentColor" 	d="M214.433 56C232.908 23.9999 279.096 24.0001 297.571 56L477.704 368C496.18 400 473.085 440 436.135 440H75.8685C38.918 440 15.8241 400 34.2993 368L214.433 56ZM256.002 144L131.294 360H380.709L256.002 144Z" /></svg>

package/src/components/N8nIcon/custom/vector-square.svg

@@ -0,0 +1,10 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="2" y="2" width="5" height="5" rx="1" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2"/>
+<rect x="17" y="2" width="5" height="5" rx="1" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2"/>
+<rect x="17" y="17" width="5" height="5" rx="1" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2"/>
+<rect x="2" y="17" width="5" height="5" rx="1" stroke="currentColor" style="stroke:currentColor;stroke-opacity:1;" stroke-width="2"/>
+<rect x="7" y="3" width="10" height="2" fill="currentColor" style="fill:currentColor;fill-opacity:1;"/>
+<rect x="7" y="19" width="10" height="2" fill="currentColor" style="fill:currentColor;fill-opacity:1;"/>
+<rect x="3" y="7" width="2" height="10" fill="currentColor" style="fill:currentColor;fill-opacity:1;"/>
+<rect x="19" y="7" width="2" height="10" fill="currentColor" style="fill:currentColor;fill-opacity:1;"/>
+</svg>

package/src/components/N8nIcon/custom/webhook.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path fill="currentColor" d="M35 37c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4-1.8 4-4 4"/><path fill="currentColor" d="M35 43c-3 0-5.9-1.4-7.8-3.7l3.1-2.5c1.1 1.4 2.9 2.3 4.7 2.3 3.3 0 6-2.7 6-6s-2.7-6-6-6c-1 0-2 .3-2.9.7l-1.7 1L23.3 16l3.5-1.9 5.3 9.4c1-.3 2-.5 3-.5 5.5 0 10 4.5 10 10S40.5 43 35 43"/><path fill="currentColor" d="M14 43C8.5 43 4 38.5 4 33c0-4.6 3.1-8.5 7.5-9.7l1 3.9C9.9 27.9 8 30.3 8 33c0 3.3 2.7 6 6 6s6-2.7 6-6v-2h15v4H23.8c-.9 4.6-5 8-9.8 8"/><path fill="currentColor" d="M14 37c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4-1.8 4-4 4"/><path fill="currentColor" d="M25 19c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4-1.8 4-4 4"/><path fill="currentColor" d="m15.7 34-3.4-2 5.9-9.7c-2-1.9-3.2-4.5-3.2-7.3 0-5.5 4.5-10 10-10s10 4.5 10 10c0 .9-.1 1.7-.3 2.5l-3.9-1c.1-.5.2-1 .2-1.5 0-3.3-2.7-6-6-6s-6 2.7-6 6c0 2.1 1.1 4 2.9 5.1l1.7 1z"/></svg>

package/src/components/N8nLogo/logo-icon.svg

@@ -0,0 +1,3 @@
+<svg xmlns='http://www.w3.org/2000/svg' width="32" height="30">
+  <path fill="#EA4B71" fill-rule="evenodd" clip-rule="evenodd" transform="translate(0, 10)" d="M27.2 6.4A3.2 3.2 0 0 1 24.1 4h-3.667a1.6 1.6 0 0 0-1.578 1.337l-.132.79A3.2 3.2 0 0 1 17.683 8a3.2 3.2 0 0 1 1.04 1.874l.132.789A1.6 1.6 0 0 0 20.433 12h.468a3.201 3.201 0 0 1 6.299.8 3.2 3.2 0 0 1-6.3.8h-.467a3.2 3.2 0 0 1-3.156-2.674l-.132-.789A1.6 1.6 0 0 0 15.567 8.8h-1.268a3.201 3.201 0 0 1-6.198 0H6.299A3.201 3.201 0 0 1 0 8a3.2 3.2 0 0 1 6.3-.8h1.8a3.201 3.201 0 0 1 6.2 0h1.267a1.6 1.6 0 0 0 1.578-1.337l.132-.79A3.2 3.2 0 0 1 20.433 2.4h3.668a3.201 3.201 0 0 1 6.299.8 3.2 3.2 0 0 1-3.2 3.2m0-1.6a1.6 1.6 0 1 0 0-3.2 1.6 1.6 0 0 0 0 3.2m-24 4.8a1.6 1.6 0 1 0 0-3.2 1.6 1.6 0 0 0 0 3.2M12.8 8a1.6 1.6 0 1 1-3.2 0 1.6 1.6 0 0 1 3.2 0m12.8 4.8a1.6 1.6 0 1 1-3.2 0 1.6 1.6 0 0 1 3.2 0" />
+</svg>

package/src/components/N8nLogo/logo-text.svg

@@ -0,0 +1,6 @@
+<svg width="26" height="30">
+  <g fill="#101330" transform="translate(-33, 10)">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M 48.002,6.918 V 6.842 c 0.558,-0.28 1.116,-0.762 1.116,-1.716 0,-1.372 -1.13,-2.198 -2.69,-2.198 -1.598,0 -2.74,0.877 -2.74,2.224 0,0.915 0.533,1.41 1.116,1.69 v 0.076 a 2.16,2.16 0 0 0 -1.42,2.059 c 0,1.385 1.141,2.351 3.032,2.351 1.89,0 2.994,-0.966 2.994,-2.351 A 2.16,2.16 0 0 0 48.002,6.918 m -1.587,-2.82 c 0.635,0 1.104,0.406 1.104,1.092 0,0.686 -0.482,1.093 -1.103,1.093 -0.622,0 -1.142,-0.407 -1.142,-1.093 0,-0.699 0.495,-1.093 1.142,-1.093 m 0,6.01 c -0.735,0 -1.332,-0.47 -1.332,-1.27 0,-0.725 0.495,-1.272 1.32,-1.272 0.812,0 1.307,0.534 1.307,1.297 0,0.775 -0.571,1.245 -1.294,1.245" />
+    <path d="m 51.367,11.2 h 1.624 V 7.758 c 0,-1.131 0.685,-1.627 1.46,-1.627 0.76,0 1.357,0.509 1.357,1.55 v 3.52 h 1.624 V 7.35 c 0,-1.664 -0.964,-2.63 -2.474,-2.63 -0.952,0 -1.485,0.381 -1.865,0.877 h -0.102 l -0.14,-0.75 h -1.484 z m -14.376,0 H 35.367 V 4.848 h 1.485 l 0.14,0.75 h 0.1 c 0.381,-0.496 0.914,-0.877 1.866,-0.877 1.51,0 2.474,0.966 2.474,2.63 v 3.85 H 39.808 V 7.68 c 0,-1.041 -0.596,-1.55 -1.358,-1.55 -0.774,0 -1.459,0.496 -1.459,1.627 z" />
+  </g>
+</svg>

package/src/css/tailwind/index.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/src/index.ts

@@ -0,0 +1,23 @@
+import * as locale from './locale';
+
+export * from './components';
+export * from './plugin';
+export * from './types';
+export * from './utils';
+export * from './directives';
+export { default as N8nSelect2 } from './v2/components/Select/Select.vue';
+export { default as N8nSelect2Item } from './v2/components/Select/SelectItem.vue';
+export type * from './v2/components/Select/Select.types';
+export { default as N8nCheckbox2 } from './v2/components/Checkbox/Checkbox.vue';
+export type * from './v2/components/Checkbox/Checkbox.types';
+export { default as N8nPagination2 } from './v2/components/Pagination/Pagination.vue';
+export type * from './v2/components/Pagination/Pagination.types';
+export { default as N8nInput2 } from './v2/components/Input/Input.vue';
+export type * from './v2/components/Input/Input.types';
+export { default as N8nTooltip2 } from './v2/components/Tooltip/Tooltip.vue';
+export type * from './v2/components/Tooltip/Tooltip.types';
+export { default as N8nLoading2 } from './v2/components/Loading/Loading.vue';
+export type * from './v2/components/Loading/Loading.types';
+export { default as N8nInputNumber2 } from './v2/components/InputNumber/InputNumber.vue';
+export type * from './v2/components/InputNumber/InputNumber.types';
+export { locale };

package/stylelint.config.mjs

@@ -0,0 +1,9 @@
+import { baseConfig } from '@n8n/stylelint-config/base';
+
+export default {
+	...baseConfig,
+	rules: {
+		...baseConfig.rules,
+		'@n8n/css-var-naming': [true, { severity: 'error' }],
+	},
+};

package/tailwind.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+	content: ['./src/**/*.{vue,js,ts}'],
+	darkMode: ['selector', '[data-theme="dark"]'],
+	theme: {
+		extend: {},
+	},
+	plugins: [],
+};

package/tsconfig.json

@@ -0,0 +1,21 @@
+{
+	"extends": "@n8n/typescript-config/tsconfig.frontend.json",
+	"compilerOptions": {
+		"baseUrl": ".",
+		"rootDirs": [".", "../composables/src"],
+		"outDir": "dist",
+		"types": ["vite/client", "unplugin-icons/types/vue", "vitest/globals"],
+		"typeRoots": [
+			"./node_modules/@testing-library",
+			"./node_modules/@types",
+			"../../../../node_modules",
+			"../../../../node_modules/@types"
+		],
+		"paths": {
+			"@n8n/design-system*": ["./src*"],
+			"@n8n/composables*": ["../composables/src*"],
+			"@n8n/utils*": ["../../../@n8n/utils/src*"]
+		}
+	},
+	"include": ["src/**/*.ts", "src/**/*.vue", ".storybook/**/*.ts"]
+}

package/vite.config.mts

@@ -0,0 +1,66 @@
+import vue from '@vitejs/plugin-vue';
+import { resolve } from 'path';
+import { defineConfig, mergeConfig } from 'vite';
+import icons from 'unplugin-icons/vite';
+import { vitestConfig } from '@n8n/vitest-config/frontend';
+import svgLoader from 'vite-svg-loader';
+
+const packagesDir = resolve(__dirname, '..', '..', '..');
+
+export default mergeConfig(
+	defineConfig({
+		plugins: [
+			vue(),
+			svgLoader({
+				svgoConfig: {
+					plugins: [
+						{
+							name: 'preset-default',
+							params: {
+								overrides: {
+									// disable a default plugin
+									cleanupIds: false,
+									// preserve viewBox for scalability
+									removeViewBox: false,
+								},
+							},
+						},
+					],
+				},
+			}),
+			icons({
+				compiler: 'vue3',
+				autoInstall: true,
+			}),
+		],
+		resolve: {
+			alias: {
+				'@': resolve(__dirname, 'src'),
+				'@n8n/design-system': resolve(__dirname, 'src'),
+				'@n8n/composables(.*)': resolve(packagesDir, 'frontend', '@n8n', 'composables', 'src$1'),
+				'@n8n/utils(.*)': resolve(packagesDir, '@n8n', 'utils', 'src$1'),
+			},
+		},
+		build: {
+			lib: {
+				entry: resolve(__dirname, 'src', 'index.ts'),
+				name: 'N8nDesignSystem',
+				fileName: (format) => `n8n-design-system.${format}.js`,
+			},
+			rollupOptions: {
+				// make sure to externalize deps that shouldn't be bundled
+				// into your library
+				external: ['vue'],
+				output: {
+					exports: 'named',
+					// Provide global variables to use in the UMD build
+					// for externalized deps
+					globals: {
+						vue: 'Vue',
+					},
+				},
+			},
+		},
+	}),
+	vitestConfig,
+);