mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2025-03-05 20:50:17 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(editor): Update design-system and editor dependencies (no-changelog) (#5188)

Browse source
This commit is contained in:
Alex Grozav 2023-01-27 03:09:30 +02:00 committed by GitHub
parent 7e229a3d38
commit 99e35f1e94
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 3073 additions and 2451 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
packages/cli/src/commands/start.ts
View file

@ -204,6 +204,7 @@ export class Start extends Command {
const streams = [ const streams = [
createReadStream(filePath, 'utf-8'), createReadStream(filePath, 'utf-8'),
replaceStream('/{{BASE_PATH}}/', n8nPath, { ignoreCase: false }), replaceStream('/{{BASE_PATH}}/', n8nPath, { ignoreCase: false }),
replaceStream('/%7B%7BBASE_PATH%7D%7D/', n8nPath, { ignoreCase: false }),
replaceStream('/static/', n8nPath + 'static/', { ignoreCase: false }), replaceStream('/static/', n8nPath + 'static/', { ignoreCase: false }),
]; ];
if (filePath.endsWith('index.html')) { if (filePath.endsWith('index.html')) {

59
packages/design-system/package.json
View file

@ -34,48 +34,55 @@
"markdown-it-emoji": "^2.0.0", "markdown-it-emoji": "^2.0.0",
"markdown-it-link-attributes": "^4.0.0", "markdown-it-link-attributes": "^4.0.0",
"markdown-it-task-lists": "^2.1.1", "markdown-it-task-lists": "^2.1.1",
"vue": "^2.7", "vue": "^2.7.14",
"vue-typed-mixins": "^0.2.0", "vue-typed-mixins": "^0.2.0",
"xss": "^1.0.10" "xss": "^1.0.10"
}, },
"devDependencies": { "devDependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.35", "@fortawesome/fontawesome-svg-core": "^1.2.36",
"@fortawesome/free-solid-svg-icons": "^5.15.3", "@fortawesome/free-solid-svg-icons": "^5.15.4",
"@fortawesome/vue-fontawesome": "^2.0.2", "@fortawesome/vue-fontawesome": "^2.0.9",
"@storybook/addon-actions": "^6.5.10", "@storybook/addon-actions": "^6.5.15",
"@storybook/addon-essentials": "^6.5.10", "@storybook/addon-essentials": "^6.5.15",
"@storybook/addon-links": "^6.5.10", "@storybook/addon-links": "^6.5.15",
"@storybook/addon-postcss": "^2.0.0", "@storybook/addon-postcss": "^2.0.0",
"@storybook/vue": "^6.5.10", "@storybook/vue": "^6.5.15",
"@testing-library/jest-dom": "^5.16.4", "@testing-library/jest-dom": "^5.16.5",
"@testing-library/vue": "^5.8.3", "@testing-library/vue": "^5.8.3",
"@types/markdown-it": "^12.2.3", "@types/markdown-it": "^12.2.3",
"@types/markdown-it-emoji": "^2.0.2", "@types/markdown-it-emoji": "^2.0.2",
"@types/markdown-it-link-attributes": "^3.0.1", "@types/markdown-it-link-attributes": "^3.0.1",
"@types/sanitize-html": "^2.6.2", "@types/sanitize-html": "^2.8.0",
"c8": "7.11.0", "@vitejs/plugin-vue2": "^2.2.0",
"core-js": "^3.6.5", "c8": "7.12.0",
"jsdom": "19.0.0", "core-js": "^3.27.1",
"node-notifier": ">=8.0.1", "jsdom": "21.0.0",
"sass": "^1.55.0", "node-notifier": "^10.0.1",
"sass-loader": "^10.1.1", "sass": "^1.57.1",
"sass-loader": "^10.3.1",
"storybook-addon-designs": "^6.3.1", "storybook-addon-designs": "^6.3.1",
"storybook-addon-themes": "^6.1.0", "storybook-addon-themes": "^6.1.0",
"trim": ">=0.0.3", "trim": "^1.0.1",
"vite": "^2.9.5", "vite": "^4.0.4",
"@vitejs/plugin-vue2": "^1.1.2", "vitest": "^0.27.2",
"vitest": "^0.9.3", "vue-class-component": "^7.2.6",
"vue-class-component": "^7.2.3", "vue-loader": "^15.10.1",
"vue-loader": "^15.9.7",
"vue-property-decorator": "^9.1.2", "vue-property-decorator": "^9.1.2",
"vue-template-compiler": "^2.7", "vue-template-compiler": "^2.7.14",
"vue-tsc": "^0.35.0", "vue-tsc": "^1.0.24",
"vue2-boring-avatars": "0.3.4", "vue2-boring-avatars": "0.3.4",
"webpack": "^4.46.0" "webpack": "^4.46.0"
}, },
"dependencies": { "dependencies": {
"element-ui": "~2.15.12", "element-ui": "~2.15.12",
"sanitize-html": "2.7.0", "markdown-it": "^13.0.1",
"vue2-boring-avatars": "0.3.4" "markdown-it-emoji": "^2.0.2",
"markdown-it-link-attributes": "^4.0.1",
"markdown-it-task-lists": "^2.1.1",
"sanitize-html": "2.7.3",
"vue": "^2.7.14",
"vue-typed-mixins": "^0.2.0",
"vue2-boring-avatars": "0.3.8",
"xss": "^1.0.14"
} }
} }

8
packages/design-system/src/components/N8nActionBox/__tests__/__snapshots__/ActionBox.spec.ts.snap
View file

@ -1,12 +1,12 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`N8NActionBox > should render correctly 1`] = ` exports[`N8NActionBox > should render correctly 1`] = `
"<div data-test-id=\\"action-box\\" class=\\"n8n-action-box _container_\\"> "<div data-test-id=\\"action-box\\" class=\\"n8n-action-box container\\">
<div class=\\"_emoji_\\"> 😿 </div> <div class=\\"emoji\\"> 😿 </div>
<div class=\\"_heading_\\"> <div class=\\"heading\\">
<n8n-heading-stub tag=\\"span\\" size=\\"xlarge\\" align=\\"center\\">Headline you need to know</n8n-heading-stub> <n8n-heading-stub tag=\\"span\\" size=\\"xlarge\\" align=\\"center\\">Headline you need to know</n8n-heading-stub>
</div> </div>
<div class=\\"_description_\\"> <div class=\\"description\\">
<n8n-text-stub size=\\"medium\\" color=\\"text-base\\" tag=\\"span\\"><span>Long description that you should know something is the way it is because of how it is. </span></n8n-text-stub> <n8n-text-stub size=\\"medium\\" color=\\"text-base\\" tag=\\"span\\"><span>Long description that you should know something is the way it is because of how it is. </span></n8n-text-stub>
</div> </div>
<n8n-button-stub label=\\"Do something\\" type=\\"primary\\" size=\\"large\\"></n8n-button-stub> <n8n-button-stub label=\\"Do something\\" type=\\"primary\\" size=\\"large\\"></n8n-button-stub>

8
packages/design-system/src/components/N8nActionDropdown/__tests__/__snapshots__/ActionDropdown.spec.ts.snap
View file

@ -1,9 +1,9 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nActionDropdown > should render custom styling correctly 1`] = ` exports[`components > N8nActionDropdown > should render custom styling correctly 1`] = `
"<div class=\\"action-dropdown-container\\"> "<div class=\\"action-dropdown-container actionDropdownContainer\\">
<el-dropdown-stub trigger=\\"click\\" size=\\"\\" hideonclick=\\"true\\" placement=\\"bottom\\" visiblearrow=\\"true\\" showtimeout=\\"250\\" hidetimeout=\\"150\\" tabindex=\\"0\\"> <el-dropdown-stub trigger=\\"click\\" size=\\"\\" hideonclick=\\"true\\" placement=\\"bottom\\" visiblearrow=\\"true\\" showtimeout=\\"250\\" hidetimeout=\\"150\\" tabindex=\\"0\\">
<div class=\\"_activator_\\"> <div class=\\"activator\\">
<n8n-icon-stub icon=\\"ellipsis-v\\" size=\\"medium\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"ellipsis-v\\" size=\\"medium\\"></n8n-icon-stub>
</div> </div>
</el-dropdown-stub> </el-dropdown-stub>
@ -11,9 +11,9 @@ exports[`components > N8nActionDropdown > should render custom styling correctly
`; `;
exports[`components > N8nActionDropdown > should render default styling correctly 1`] = ` exports[`components > N8nActionDropdown > should render default styling correctly 1`] = `
"<div class=\\"action-dropdown-container\\"> "<div class=\\"action-dropdown-container actionDropdownContainer\\">
<el-dropdown-stub trigger=\\"click\\" size=\\"\\" hideonclick=\\"true\\" placement=\\"bottom\\" visiblearrow=\\"true\\" showtimeout=\\"250\\" hidetimeout=\\"150\\" tabindex=\\"0\\"> <el-dropdown-stub trigger=\\"click\\" size=\\"\\" hideonclick=\\"true\\" placement=\\"bottom\\" visiblearrow=\\"true\\" showtimeout=\\"250\\" hidetimeout=\\"150\\" tabindex=\\"0\\">
<div class=\\"_activator_\\"> <div class=\\"activator\\">
<n8n-icon-stub icon=\\"ellipsis-v\\" size=\\"medium\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"ellipsis-v\\" size=\\"medium\\"></n8n-icon-stub>
</div> </div>
</el-dropdown-stub> </el-dropdown-stub>

6
packages/design-system/src/components/N8nBadge/__tests__/__snapshots__/Badge.spec.ts.snap
View file

@ -1,7 +1,7 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nBadge > props > should render default theme correctly 1`] = `"<span class=\\"n8n-badge _default_ _badge_\\"><n8n-text-stub bold=\\"true\\" size=\\"large\\" compact=\\"true\\" tag=\\"span\\"><n8n-text-stub size=\\"medium\\" tag=\\"span\\">Default badge</n8n-text-stub></n8n-text-stub></span>"`; exports[`components > N8nBadge > props > should render default theme correctly 1`] = `"<span class=\\"n8n-badge default\\"><n8n-text-stub bold=\\"true\\" size=\\"large\\" compact=\\"true\\" tag=\\"span\\"><n8n-text-stub size=\\"medium\\" tag=\\"span\\">Default badge</n8n-text-stub></n8n-text-stub></span>"`;
exports[`components > N8nBadge > props > should render secondary theme correctly 1`] = `"<span class=\\"n8n-badge _secondary_ _badge_\\"><n8n-text-stub size=\\"medium\\" compact=\\"true\\" tag=\\"span\\"><n8n-text-stub size=\\"medium\\" tag=\\"span\\">Secondary badge</n8n-text-stub></n8n-text-stub></span>"`; exports[`components > N8nBadge > props > should render secondary theme correctly 1`] = `"<span class=\\"n8n-badge secondary\\"><n8n-text-stub size=\\"medium\\" compact=\\"true\\" tag=\\"span\\"><n8n-text-stub size=\\"medium\\" tag=\\"span\\">Secondary badge</n8n-text-stub></n8n-text-stub></span>"`;
exports[`components > N8nBadge > props > should render with default values correctly 1`] = `"<span class=\\"n8n-badge _default_ _badge_\\"><n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><n8n-text-stub size=\\"medium\\" tag=\\"span\\">A Badge</n8n-text-stub></n8n-text-stub></span>"`; exports[`components > N8nBadge > props > should render with default values correctly 1`] = `"<span class=\\"n8n-badge default\\"><n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><n8n-text-stub size=\\"medium\\" tag=\\"span\\">A Badge</n8n-text-stub></n8n-text-stub></span>"`;

10
packages/design-system/src/components/N8nButton/__tests__/__snapshots__/Button.spec.ts.snap
View file

@ -1,17 +1,17 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nButton > overrides > should render correctly 1`] = `"<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button _button_ _secondary_ _medium_ _icon_\\" icon=\\"plus-circle\\" type=\\"secondary\\"><span class=\\"_icon_\\"><n8n-icon-stub icon=\\"plus-circle\\" size=\\"medium\\"></n8n-icon-stub></span><span>Button</span></button>"`; exports[`components > N8nButton > overrides > should render correctly 1`] = `"<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button button secondary medium icon\\" icon=\\"plus-circle\\" type=\\"secondary\\"><span class=\\"icon\\"><n8n-icon-stub icon=\\"plus-circle\\" size=\\"medium\\"></n8n-icon-stub></span><span>Button</span></button>"`;
exports[`components > N8nButton > props > icon > should render icon button 1`] = `"<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button _button_ _primary_ _medium_ _icon_\\"><span class=\\"_icon_\\"><n8n-icon-stub icon=\\"plus-circle\\" size=\\"medium\\"></n8n-icon-stub></span><span>Button</span></button>"`; exports[`components > N8nButton > props > icon > should render icon button 1`] = `"<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button button primary medium icon\\"><span class=\\"icon\\"><n8n-icon-stub icon=\\"plus-circle\\" size=\\"medium\\"></n8n-icon-stub></span><span>Button</span></button>"`;
exports[`components > N8nButton > props > loading > should render loading spinner 1`] = `"<button disabled=\\"disabled\\" aria-disabled=\\"false\\" aria-busy=\\"true\\" aria-live=\\"polite\\" class=\\"button _button_ _primary_ _medium_ _loading_ _icon_\\"><span class=\\"_icon_\\"><n8n-spinner-stub size=\\"medium\\" type=\\"dots\\"></n8n-spinner-stub></span><span>Button</span></button>"`; exports[`components > N8nButton > props > loading > should render loading spinner 1`] = `"<button disabled=\\"disabled\\" aria-disabled=\\"false\\" aria-busy=\\"true\\" aria-live=\\"polite\\" class=\\"button button primary medium loading icon\\"><span class=\\"icon\\"><n8n-spinner-stub size=\\"medium\\" type=\\"dots\\"></n8n-spinner-stub></span><span>Button</span></button>"`;
exports[`components > N8nButton > props > square > should render square button 1`] = ` exports[`components > N8nButton > props > square > should render square button 1`] = `
"<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button _button_ _primary_ _medium_ _square_\\"> "<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button button primary medium square\\">
<!----><span>48</span></button>" <!----><span>48</span></button>"
`; `;
exports[`components > N8nButton > should render correctly 1`] = ` exports[`components > N8nButton > should render correctly 1`] = `
"<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button _button_ _primary_ _medium_\\"> "<button aria-disabled=\\"false\\" aria-busy=\\"false\\" aria-live=\\"polite\\" class=\\"button button primary medium\\">
<!----><span>Button</span></button>" <!----><span>Button</span></button>"
`; `;

42
packages/design-system/src/components/N8nCallout/__tests__/__snapshots__/Callout.spec.ts.snap
View file

@ -1,9 +1,9 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nCallout > should render additional slots correctly 1`] = ` exports[`components > N8nCallout > should render additional slots correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _custom_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout custom\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"code-branch\\" size=\\"large\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"code-branch\\" size=\\"large\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">
@ -15,9 +15,9 @@ exports[`components > N8nCallout > should render additional slots correctly 1`]
`; `;
exports[`components > N8nCallout > should render custom theme correctly 1`] = ` exports[`components > N8nCallout > should render custom theme correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _custom_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout custom\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"code-branch\\" size=\\"large\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"code-branch\\" size=\\"large\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">
@ -28,9 +28,9 @@ exports[`components > N8nCallout > should render custom theme correctly 1`] = `
`; `;
exports[`components > N8nCallout > should render danger theme correctly 1`] = ` exports[`components > N8nCallout > should render danger theme correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _danger_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout danger\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"times-circle\\" size=\\"large\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"times-circle\\" size=\\"large\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">
@ -41,9 +41,9 @@ exports[`components > N8nCallout > should render danger theme correctly 1`] = `
`; `;
exports[`components > N8nCallout > should render info theme correctly 1`] = ` exports[`components > N8nCallout > should render info theme correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _info_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout info\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"info-circle\\" size=\\"large\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"info-circle\\" size=\\"large\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">
@ -54,9 +54,9 @@ exports[`components > N8nCallout > should render info theme correctly 1`] = `
`; `;
exports[`components > N8nCallout > should render secondary theme correctly 1`] = ` exports[`components > N8nCallout > should render secondary theme correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _secondary_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout secondary\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"info-circle\\" size=\\"medium\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"info-circle\\" size=\\"medium\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">
@ -67,9 +67,9 @@ exports[`components > N8nCallout > should render secondary theme correctly 1`] =
`; `;
exports[`components > N8nCallout > should render success theme correctly 1`] = ` exports[`components > N8nCallout > should render success theme correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _success_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout success\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"check-circle\\" size=\\"large\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"check-circle\\" size=\\"large\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">
@ -80,9 +80,9 @@ exports[`components > N8nCallout > should render success theme correctly 1`] = `
`; `;
exports[`components > N8nCallout > should render warning theme correctly 1`] = ` exports[`components > N8nCallout > should render warning theme correctly 1`] = `
"<div role=\\"alert\\" class=\\"n8n-callout _callout_ _warning_\\"> "<div role=\\"alert\\" class=\\"n8n-callout callout warning\\">
<div class=\\"_message-section_\\"> <div class=\\"message-section\\">
<div class=\\"_icon_\\"> <div class=\\"icon\\">
<n8n-icon-stub icon=\\"exclamation-triangle\\" size=\\"large\\"></n8n-icon-stub> <n8n-icon-stub icon=\\"exclamation-triangle\\" size=\\"large\\"></n8n-icon-stub>
</div> </div>
<n8n-text-stub size=\\"small\\" tag=\\"span\\"> <n8n-text-stub size=\\"small\\" tag=\\"span\\">

16
packages/design-system/src/components/N8nCard/__tests__/__snapshots__/Card.spec.ts.snap
View file

@ -1,11 +1,11 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nCard > should render correctly 1`] = ` exports[`components > N8nCard > should render correctly 1`] = `
"<div class=\\"card _card_\\"> "<div class=\\"card\\">
<!----> <!---->
<div class=\\"_content_\\"> <div class=\\"content\\">
<!----> <!---->
<div class=\\"_body_\\">This is a card.</div> <div class=\\"body\\">This is a card.</div>
<!----> <!---->
</div> </div>
<!----> <!---->
@ -13,12 +13,12 @@ exports[`components > N8nCard > should render correctly 1`] = `
`; `;
exports[`components > N8nCard > should render correctly with header and footer 1`] = ` exports[`components > N8nCard > should render correctly with header and footer 1`] = `
"<div class=\\"card _card_\\"> "<div class=\\"card\\">
<!----> <!---->
<div class=\\"_content_\\"> <div class=\\"content\\">
<div class=\\"_header_\\">Header</div> <div class=\\"header\\">Header</div>
<div class=\\"_body_\\">This is a card.</div> <div class=\\"body\\">This is a card.</div>
<div class=\\"_footer_\\">Footer</div> <div class=\\"footer\\">Footer</div>
</div> </div>
<!----> <!---->
</div>" </div>"

6
packages/design-system/src/components/N8nInfoTip/__tests__/__snapshots__/InfoTip.spec.ts.snap
View file

@ -1,9 +1,9 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`N8nInfoTip > should render correctly as note 1`] = `"<div class=\\"n8n-info-tip _info_ _note_ _base_ _bold_\\"><span class=\\"_iconText_\\"><span class=\\"n8n-icon n8n-text _compact_ _size-medium_ _regular_\\"></span><span>Need help doing something?<a href=\\"/docs\\" target=\\"_blank\\">Open docs</a></span></span></div>"`; exports[`N8nInfoTip > should render correctly as note 1`] = `"<div class=\\"n8n-info-tip info note bold\\"><span class=\\"iconText\\"><span class=\\"n8n-icon n8n-text compact size-medium regular\\"></span><span>Need help doing something?<a href=\\"/docs\\" target=\\"_blank\\">Open docs</a></span></span></div>"`;
exports[`N8nInfoTip > should render correctly as tooltip 1`] = ` exports[`N8nInfoTip > should render correctly as tooltip 1`] = `
"<div class=\\"n8n-info-tip _info_ _tooltip_ _base_ _bold_\\"> "<div class=\\"n8n-info-tip info tooltip bold\\">
<n8n-tooltip-stub justifybuttons=\\"flex-end\\" buttons=\\"\\" placement=\\"top\\"><span class=\\"_iconText_\\"><span class=\\"n8n-icon n8n-text _compact_ _size-medium_ _regular_\\"></span></span></n8n-tooltip-stub> <n8n-tooltip-stub justifybuttons=\\"flex-end\\" buttons=\\"\\" placement=\\"top\\" popper-class=\\"tooltipPopper\\"><span class=\\"iconText\\"><span class=\\"n8n-icon n8n-text compact size-medium regular\\"></span></span></n8n-tooltip-stub>
</div>" </div>"
`; `;

14
packages/design-system/src/components/N8nNotice/__tests__/__snapshots__/Notice.spec.ts.snap
View file

@ -1,31 +1,31 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nNotice > props > content > should render HTML 1`] = ` exports[`components > N8nNotice > props > content > should render HTML 1`] = `
"<div id=\\"notice\\" role=\\"alert\\" class=\\"notice _notice_ _warning_\\"> "<div id=\\"notice\\" role=\\"alert\\" class=\\"notice notice warning\\">
<div class=\\"notice-content\\"> <div class=\\"notice-content\\">
<n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><span id=\\"notice-content\\" role=\\"region\\" class=\\"_truncated_\\"><strong>Hello world!</strong> This is a notice.</span></n8n-text-stub> <n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><span id=\\"notice-content\\" role=\\"region\\" class=\\"truncated\\"><strong>Hello world!</strong> This is a notice.</span></n8n-text-stub>
</div> </div>
</div>" </div>"
`; `;
exports[`components > N8nNotice > props > content > should render correctly with content prop 1`] = ` exports[`components > N8nNotice > props > content > should render correctly with content prop 1`] = `
"<div id=\\"notice\\" role=\\"alert\\" class=\\"notice _notice_ _warning_\\"> "<div id=\\"notice\\" role=\\"alert\\" class=\\"notice notice warning\\">
<div class=\\"notice-content\\"> <div class=\\"notice-content\\">
<n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><span id=\\"notice-content\\" role=\\"region\\" class=\\"_truncated_\\">This is a notice.</span></n8n-text-stub> <n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><span id=\\"notice-content\\" role=\\"region\\" class=\\"truncated\\">This is a notice.</span></n8n-text-stub>
</div> </div>
</div>" </div>"
`; `;
exports[`components > N8nNotice > props > content > should sanitize rendered HTML 1`] = ` exports[`components > N8nNotice > props > content > should sanitize rendered HTML 1`] = `
"<div id=\\"notice\\" role=\\"alert\\" class=\\"notice _notice_ _warning_\\"> "<div id=\\"notice\\" role=\\"alert\\" class=\\"notice notice warning\\">
<div class=\\"notice-content\\"> <div class=\\"notice-content\\">
<n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><span id=\\"notice-content\\" role=\\"region\\" class=\\"_truncated_\\"> This is a notice.</span></n8n-text-stub> <n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\"><span id=\\"notice-content\\" role=\\"region\\" class=\\"truncated\\"> This is a notice.</span></n8n-text-stub>
</div> </div>
</div>" </div>"
`; `;
exports[`components > N8nNotice > should render correctly 1`] = ` exports[`components > N8nNotice > should render correctly 1`] = `
"<div id=\\"notice\\" role=\\"alert\\" class=\\"notice _notice_ _warning_\\"> "<div id=\\"notice\\" role=\\"alert\\" class=\\"notice notice warning\\">
<div class=\\"notice-content\\"> <div class=\\"notice-content\\">
<n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\">This is a notice.</n8n-text-stub> <n8n-text-stub size=\\"small\\" compact=\\"true\\" tag=\\"span\\">This is a notice.</n8n-text-stub>
</div> </div>

2
packages/design-system/src/components/N8nSelect/__tests__/__snapshots__/Select.spec.ts.snap
View file

@ -1,7 +1,7 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`components > N8nSelect > should render correctly 1`] = ` exports[`components > N8nSelect > should render correctly 1`] = `
"<div class=\\"n8n-select _container_\\"> "<div class=\\"n8n-select container\\">
<!----> <!---->
<div class=\\"el-select el-select--large\\"> <div class=\\"el-select el-select--large\\">
<!----> <!---->

38
packages/design-system/src/components/N8nTree/__tests__/__snapshots__/Tree.spec.ts.snap
View file

@ -5,8 +5,8 @@ exports[`components > N8nTree > should render each tree with node class 1`] = `
<div class=\\"nodeClass\\"> <div class=\\"nodeClass\\">
<div><span>hello</span> <div><span>hello</span>
<div class=\\"n8n-tree\\"> <div class=\\"n8n-tree\\">
<div class=\\"nodeClass _indent_\\"> <div class=\\"nodeClass indent\\">
<div class=\\"_simple_\\"><span>test</span><span>:</span><span>world</span></div> <div class=\\"simple\\"><span>test</span><span>:</span><span>world</span></div>
</div> </div>
</div> </div>
</div> </div>
@ -14,11 +14,11 @@ exports[`components > N8nTree > should render each tree with node class 1`] = `
<div class=\\"nodeClass\\"> <div class=\\"nodeClass\\">
<div><span>options</span> <div><span>options</span>
<div class=\\"n8n-tree\\"> <div class=\\"n8n-tree\\">
<div class=\\"nodeClass _indent_\\"> <div class=\\"nodeClass indent\\">
<div class=\\"_simple_\\"><span>0</span><span>:</span><span>yes</span></div> <div class=\\"simple\\"><span>0</span><span>:</span><span>yes</span></div>
</div> </div>
<div class=\\"nodeClass _indent_\\"> <div class=\\"nodeClass indent\\">
<div class=\\"_simple_\\"><span>1</span><span>:</span><span>no</span></div> <div class=\\"simple\\"><span>1</span><span>:</span><span>no</span></div>
</div> </div>
</div> </div>
</div> </div>
@ -29,7 +29,7 @@ exports[`components > N8nTree > should render each tree with node class 1`] = `
exports[`components > N8nTree > should render simple tree 1`] = ` exports[`components > N8nTree > should render simple tree 1`] = `
"<div class=\\"n8n-tree\\"> "<div class=\\"n8n-tree\\">
<div class=\\"\\"> <div class=\\"\\">
<div class=\\"_simple_\\"><span>hello</span><span>:</span><span>world</span></div> <div class=\\"simple\\"><span>hello</span><span>:</span><span>world</span></div>
</div> </div>
</div>" </div>"
`; `;
@ -39,8 +39,8 @@ exports[`components > N8nTree > should render tree 1`] = `
<div class=\\"\\"> <div class=\\"\\">
<div><span>hello</span> <div><span>hello</span>
<div class=\\"n8n-tree\\"> <div class=\\"n8n-tree\\">
<div class=\\"_indent_\\"> <div class=\\"indent\\">
<div class=\\"_simple_\\"><span>test</span><span>:</span><span>world</span></div> <div class=\\"simple\\"><span>test</span><span>:</span><span>world</span></div>
</div> </div>
</div> </div>
</div> </div>
@ -48,11 +48,11 @@ exports[`components > N8nTree > should render tree 1`] = `
<div class=\\"\\"> <div class=\\"\\">
<div><span>options</span> <div><span>options</span>
<div class=\\"n8n-tree\\"> <div class=\\"n8n-tree\\">
<div class=\\"_indent_\\"> <div class=\\"indent\\">
<div class=\\"_simple_\\"><span>0</span><span>:</span><span>yes</span></div> <div class=\\"simple\\"><span>0</span><span>:</span><span>yes</span></div>
</div> </div>
<div class=\\"_indent_\\"> <div class=\\"indent\\">
<div class=\\"_simple_\\"><span>1</span><span>:</span><span>no</span></div> <div class=\\"simple\\"><span>1</span><span>:</span><span>no</span></div>
</div> </div>
</div> </div>
</div> </div>
@ -65,8 +65,8 @@ exports[`components > N8nTree > should render tree with slots 1`] = `
<div class=\\"\\"> <div class=\\"\\">
<div><span>label</span> <div><span>label</span>
<div class=\\"n8n-tree\\"> <div class=\\"n8n-tree\\">
<div class=\\"_indent_\\"> <div class=\\"indent\\">
<div class=\\"_simple_\\"><span>label</span><span>:</span><span>value</span></div> <div class=\\"simple\\"><span>label</span><span>:</span><span>value</span></div>
</div> </div>
</div> </div>
</div> </div>
@ -74,11 +74,11 @@ exports[`components > N8nTree > should render tree with slots 1`] = `
<div class=\\"\\"> <div class=\\"\\">
<div><span>label</span> <div><span>label</span>
<div class=\\"n8n-tree\\"> <div class=\\"n8n-tree\\">
<div class=\\"_indent_\\"> <div class=\\"indent\\">
<div class=\\"_simple_\\"><span>label</span><span>:</span><span>value</span></div> <div class=\\"simple\\"><span>label</span><span>:</span><span>value</span></div>
</div> </div>
<div class=\\"_indent_\\"> <div class=\\"indent\\">
<div class=\\"_simple_\\"><span>label</span><span>:</span><span>value</span></div> <div class=\\"simple\\"><span>label</span><span>:</span><span>value</span></div>
</div> </div>
</div> </div>
</div> </div>

8
packages/design-system/vite.config.ts
View file

@ -38,10 +38,10 @@ export default mergeConfig(
globals: true, globals: true,
environment: 'jsdom', environment: 'jsdom',
setupFiles: ['./src/__tests__/setup.ts'], setupFiles: ['./src/__tests__/setup.ts'],
}, css: {
css: { modules: {
modules: { classNameStrategy: 'non-scoped',
generateScopedName: (name) => `_${name}_`, },
}, },
}, },
}), }),

16
packages/editor-ui/package.json
View file

@ -65,10 +65,11 @@
"pinia": "^2.0.22", "pinia": "^2.0.22",
"prettier": "^2.8.2", "prettier": "^2.8.2",
"prismjs": "^1.17.1", "prismjs": "^1.17.1",
"stream-browserify": "^3.0.0",
"timeago.js": "^4.0.2", "timeago.js": "^4.0.2",
"uuid": "^8.3.2", "uuid": "^8.3.2",
"v-click-outside": "^3.1.2", "v-click-outside": "^3.1.2",
"vue": "^2.7", "vue": "^2.7.14",
"vue-agile": "^2.0.0", "vue-agile": "^2.0.0",
"vue-fragment": "1.5.1", "vue-fragment": "1.5.1",
"vue-i18n": "^8.26.7", "vue-i18n": "^8.26.7",
@ -76,7 +77,7 @@
"vue-json-pretty": "1.9.3", "vue-json-pretty": "1.9.3",
"vue-prism-editor": "^0.3.0", "vue-prism-editor": "^0.3.0",
"vue-router": "^3.6.5", "vue-router": "^3.6.5",
"vue-template-compiler": "^2.7", "vue-template-compiler": "^2.7.14",
"vue-typed-mixins": "^0.2.0", "vue-typed-mixins": "^0.2.0",
"vue2-boring-avatars": "0.3.4", "vue2-boring-avatars": "0.3.4",
"vue2-teleport": "^1.0.1", "vue2-teleport": "^1.0.1",
@ -98,17 +99,16 @@
"@types/lodash.set": "^4.3.6", "@types/lodash.set": "^4.3.6",
"@types/luxon": "^2.0.9", "@types/luxon": "^2.0.9",
"@types/uuid": "^8.3.2", "@types/uuid": "^8.3.2",
"@vitejs/plugin-legacy": "^1.8.2", "@vitejs/plugin-legacy": "^3.0.1",
"@vitejs/plugin-vue2": "^1.1.2", "@vitejs/plugin-vue2": "^2.2.0",
"c8": "^7.12.0", "c8": "^7.12.0",
"jshint": "^2.9.7", "jshint": "^2.9.7",
"sass": "^1.55.0", "sass": "^1.55.0",
"sass-loader": "^10.1.1", "sass-loader": "^10.1.1",
"string-template-parser": "^1.2.6", "string-template-parser": "^1.2.6",
"vite": "2.9.5", "vite": "4.0.4",
"vite-plugin-html": "^3.2.0",
"vite-plugin-monaco-editor": "^1.0.10", "vite-plugin-monaco-editor": "^1.0.10",
"vitest": "0.9.3", "vitest": "0.27.2",
"vue-tsc": "^0.35.0" "vue-tsc": "^1.0.24"
} }
} }

64
packages/editor-ui/src/components/__snapshots__/RunDataSchema.test.ts.snap
View file

@ -3,34 +3,34 @@
exports[`RunDataJsonSchema.vue > renders schema for data 1`] = ` exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
<div> <div>
<div <div
class="_schemaWrapper_1mtap_1" class="schemaWrapper"
> >
<div <div
class="" class=""
> >
<div <div
class="_schema_1mtap_1" class="schema"
> >
<div <div
class="_item_14xdy_1" class="item"
> >
<!----> <!---->
<!----> <!---->
<!----> <!---->
<!----> <!---->
<div <div
class="_sub_14xdy_14" class="sub"
> >
<div <div
class="_item_14xdy_1" class="item"
style="transition-delay: 0s;" style="transition-delay: 0s;"
> >
<div <div
class="_pill_14xdy_51 _mappable_14xdy_70" class="pill mappable"
title="string" title="string"
> >
<span <span
class="_label_14xdy_89" class="label"
data-depth="1" data-depth="1"
data-name="name" data-name="name"
data-path="[\\"name\\"]" data-path="[\\"name\\"]"
@ -50,7 +50,7 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
</span> </span>
</div> </div>
<span <span
class="_text_14xdy_100" class="text"
> >
John John
</span> </span>
@ -59,15 +59,15 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
<!----> <!---->
</div> </div>
<div <div
class="_item_14xdy_1" class="item"
style="transition-delay: 0.033s;" style="transition-delay: 0.033s;"
> >
<div <div
class="_pill_14xdy_51 _mappable_14xdy_70" class="pill mappable"
title="number" title="number"
> >
<span <span
class="_label_14xdy_89" class="label"
data-depth="1" data-depth="1"
data-name="age" data-name="age"
data-path="[\\"age\\"]" data-path="[\\"age\\"]"
@ -87,7 +87,7 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
</span> </span>
</div> </div>
<span <span
class="_text_14xdy_100" class="text"
> >
22 22
</span> </span>
@ -96,15 +96,15 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
<!----> <!---->
</div> </div>
<div <div
class="_item_14xdy_1" class="item"
style="transition-delay: 0.066s;" style="transition-delay: 0.066s;"
> >
<div <div
class="_pill_14xdy_51 _mappable_14xdy_70" class="pill mappable"
title="array" title="array"
> >
<span <span
class="_label_14xdy_89" class="label"
data-depth="1" data-depth="1"
data-name="hobbies" data-name="hobbies"
data-path="[\\"hobbies\\"]" data-path="[\\"hobbies\\"]"
@ -130,7 +130,7 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
type="checkbox" type="checkbox"
/> />
<label <label
class="_toggle_14xdy_20" class="toggle"
for="array-0-2" for="array-0-2"
> >
<font-awesome-icon-stub <font-awesome-icon-stub
@ -138,18 +138,18 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
/> />
</label> </label>
<div <div
class="_sub_14xdy_14" class="sub"
> >
<div <div
class="_item_14xdy_1" class="item"
style="transition-delay: 0s;" style="transition-delay: 0s;"
> >
<div <div
class="_pill_14xdy_51 _mappable_14xdy_70" class="pill mappable"
title="string" title="string"
> >
<span <span
class="_label_14xdy_89" class="label"
data-depth="2" data-depth="2"
data-name="string[0]" data-name="string[0]"
data-path="[\\"hobbies\\"][0]" data-path="[\\"hobbies\\"][0]"
@ -164,14 +164,14 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
hobbies hobbies
</span> </span>
<span <span
class="_arrayIndex_14xdy_94" class="arrayIndex"
> >
[0] [0]
</span> </span>
</span> </span>
</div> </div>
<span <span
class="_text_14xdy_100" class="text"
> >
surfing surfing
</span> </span>
@ -180,15 +180,15 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
<!----> <!---->
</div> </div>
<div <div
class="_item_14xdy_1" class="item"
style="transition-delay: 0.033s;" style="transition-delay: 0.033s;"
> >
<div <div
class="_pill_14xdy_51 _mappable_14xdy_70" class="pill mappable"
title="string" title="string"
> >
<span <span
class="_label_14xdy_89" class="label"
data-depth="2" data-depth="2"
data-name="string[1]" data-name="string[1]"
data-path="[\\"hobbies\\"][1]" data-path="[\\"hobbies\\"][1]"
@ -203,14 +203,14 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
hobbies hobbies
</span> </span>
<span <span
class="_arrayIndex_14xdy_94" class="arrayIndex"
> >
[1] [1]
</span> </span>
</span> </span>
</div> </div>
<span <span
class="_text_14xdy_100" class="text"
> >
traveling traveling
</span> </span>
@ -235,19 +235,19 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
exports[`RunDataJsonSchema.vue > renders schema for empty data 1`] = ` exports[`RunDataJsonSchema.vue > renders schema for empty data 1`] = `
<div> <div>
<div <div
class="_schemaWrapper_1mtap_1" class="schemaWrapper"
> >
<div <div
class="n8n-info-tip _info_3egb8_33 _note_3egb8_16 _base_3egb8_1 _bold_3egb8_12" class="n8n-info-tip info note bold"
> >
<span <span
class="_iconText_3egb8_28" class="iconText"
> >
<span <span
class="n8n-icon n8n-text _compact_e4k11_34 _size-medium_e4k11_19 _regular_e4k11_5" class="n8n-icon n8n-text compact size-medium regular"
> >
<font-awesome-icon-stub <font-awesome-icon-stub
class="_medium_1pnjy_9" class="medium"
icon="info-circle" icon="info-circle"
/> />
</span> </span>

10
packages/editor-ui/src/shims.d.ts vendored
View file

@ -5,6 +5,16 @@ declare module 'markdown-it-emoji';
declare module 'markdown-it-task-lists'; declare module 'markdown-it-task-lists';
declare global { declare global {
interface ImportMeta {
env: {
DEV: boolean;
PROD: boolean;
NODE_ENV: 'development' | 'production';
VUE_APP_URL_BASE_API: string;
VUE_APP_ENDPOINT_REST?: string;
};
}
interface Window { interface Window {
BASE_PATH: string; BASE_PATH: string;
} }

18
packages/editor-ui/src/stores/n8nRootStore.ts
View file

@ -5,14 +5,12 @@ import { defineStore } from 'pinia';
import Vue from 'vue'; import Vue from 'vue';
import { useNodeTypesStore } from './nodeTypes'; import { useNodeTypesStore } from './nodeTypes';
const { VUE_APP_URL_BASE_API, VUE_APP_ENDPOINT_REST } = import.meta.env;
export const useRootStore = defineStore(STORES.ROOT, { export const useRootStore = defineStore(STORES.ROOT, {
state: (): RootState => ({ state: (): RootState => ({
// @ts-ignore baseUrl:
baseUrl: import.meta.env.VUE_APP_URL_BASE_API VUE_APP_URL_BASE_API ?? window.BASE_PATH === '/{{BASE_PATH}}/' ? '/' : window.BASE_PATH,
? import.meta.env.VUE_APP_URL_BASE_API
: window.BASE_PATH === '/%BASE_PATH%/'
? '/'
: window.BASE_PATH,
defaultLocale: 'en', defaultLocale: 'en',
endpointWebhook: 'webhook', endpointWebhook: 'webhook',
endpointWebhookTest: 'webhook-test', endpointWebhookTest: 'webhook-test',
@ -44,16 +42,16 @@ export const useRootStore = defineStore(STORES.ROOT, {
getRestUrl(): string { getRestUrl(): string {
let endpoint = 'rest'; let endpoint = 'rest';
if (import.meta.env.VUE_APP_ENDPOINT_REST) { if (VUE_APP_ENDPOINT_REST) {
endpoint = import.meta.env.VUE_APP_ENDPOINT_REST; endpoint = VUE_APP_ENDPOINT_REST;
} }
return `${this.baseUrl}${endpoint}`; return `${this.baseUrl}${endpoint}`;
}, },
getRestApiContext(): IRestApiContext { getRestApiContext(): IRestApiContext {
let endpoint = 'rest'; let endpoint = 'rest';
if (import.meta.env.VUE_APP_ENDPOINT_REST) { if (VUE_APP_ENDPOINT_REST) {
endpoint = import.meta.env.VUE_APP_ENDPOINT_REST; endpoint = VUE_APP_ENDPOINT_REST;
} }
return { return {
baseUrl: `${this.baseUrl}${endpoint}`, baseUrl: `${this.baseUrl}${endpoint}`,

28
packages/editor-ui/vite.config.ts
View file

@ -1,18 +1,26 @@
import vue from '@vitejs/plugin-vue2'; import vue from '@vitejs/plugin-vue2';
import { createHtmlPlugin } from 'vite-plugin-html';
import legacy from '@vitejs/plugin-legacy'; import legacy from '@vitejs/plugin-legacy';
import monacoEditorPlugin from 'vite-plugin-monaco-editor'; import monacoEditorPlugin from 'vite-plugin-monaco-editor';
import path, { resolve } from 'path'; import path, { resolve } from 'path';
import { defineConfig, mergeConfig, PluginOption } from 'vite'; import { defineConfig, mergeConfig, PluginOption } from 'vite';
import { defineConfig as defineVitestConfig } from 'vitest/config'; import { defineConfig as defineVitestConfig } from 'vitest/config';
import packageJSON from './package.json'; import packageJSON from './package.json';
const vendorChunks = ['vue', 'vue-router']; const vendorChunks = ['vue', 'vue-router'];
const n8nChunks = ['n8n-workflow', 'n8n-design-system'];
const ignoreChunks = [ const ignoreChunks = [
'vue2-boring-avatars', 'vue2-boring-avatars',
'vue-template-compiler', 'vue-template-compiler',
'jquery', 'jquery',
'@fontsource/open-sans', '@fontsource/open-sans',
'normalize-wheel',
'stream-browserify',
'lodash.camelcase',
'lodash.debounce',
'lodash.get',
'lodash.orderby',
'lodash.set',
]; ];
const isScopedPackageToIgnore = (str: string) => /@codemirror\//.test(str); const isScopedPackageToIgnore = (str: string) => /@codemirror\//.test(str);
@ -22,7 +30,7 @@ function renderChunks() {
const chunks: Record<string, string[]> = {}; const chunks: Record<string, string[]> = {};
Object.keys(dependencies).forEach((key) => { Object.keys(dependencies).forEach((key) => {
if ([...vendorChunks, ...ignoreChunks].includes(key)) { if ([...vendorChunks, ...n8nChunks, ...ignoreChunks].includes(key)) {
return; return;
} }
@ -46,19 +54,13 @@ export default mergeConfig(
define: { define: {
// This causes test to fail but is required for actually running it // This causes test to fail but is required for actually running it
...(process.env.NODE_ENV !== 'test' ? { global: 'globalThis' } : {}), ...(process.env.NODE_ENV !== 'test' ? { global: 'globalThis' } : {}),
BASE_PATH: `'${publicPath}'`,
}, },
plugins: [ plugins: [
legacy({ legacy({
targets: ['defaults', 'not IE 11'], targets: ['defaults', 'not IE 11'],
}), }),
vue(), vue(),
...(createHtmlPlugin({
inject: {
data: {
BASE_PATH: publicPath,
},
},
}) as PluginOption[]),
monacoEditorPlugin({ monacoEditorPlugin({
publicPath: 'assets/monaco-editor', publicPath: 'assets/monaco-editor',
customDistPath: (root: string, buildOutDir: string, base: string) => customDistPath: (root: string, buildOutDir: string, base: string) =>
@ -68,7 +70,7 @@ export default mergeConfig(
resolve: { resolve: {
alias: [ alias: [
{ find: '@', replacement: resolve(__dirname, 'src') }, { find: '@', replacement: resolve(__dirname, 'src') },
{ find: 'stream', replacement: '' }, { find: 'stream', replacement: 'stream-browserify' },
{ {
find: /^n8n-design-system\//, find: /^n8n-design-system\//,
replacement: resolve(__dirname, '..', 'design-system', 'src') + '/', replacement: resolve(__dirname, '..', 'design-system', 'src') + '/',
@ -108,6 +110,7 @@ export default mergeConfig(
output: { output: {
manualChunks: { manualChunks: {
vendor: vendorChunks, vendor: vendorChunks,
n8n: n8nChunks,
...renderChunks(), ...renderChunks(),
}, },
}, },
@ -119,6 +122,11 @@ export default mergeConfig(
globals: true, globals: true,
environment: 'jsdom', environment: 'jsdom',
setupFiles: ['./src/__tests__/setup.ts'], setupFiles: ['./src/__tests__/setup.ts'],
css: {
modules: {
classNameStrategy: 'non-scoped',
},
},
}, },
}), }),
); );

5
packages/editor-ui/vue.config.js
View file

@ -6,10 +6,6 @@ module.exports = {
config.resolve.symlinks(false); config.resolve.symlinks(false);
// config.plugins.delete("prefetch"); // enable when language package grows // config.plugins.delete("prefetch"); // enable when language package grows
}, },
// transpileDependencies: [
// // 'node_modules/quill'
// /\/node_modules\/quill\//
// ]
pluginOptions: { pluginOptions: {
webpackBundleAnalyzer: { webpackBundleAnalyzer: {
openAnalyzer: false, openAnalyzer: false,
@ -50,5 +46,4 @@ module.exports = {
}, },
}, },
}, },
publicPath: process.env.VUE_APP_PUBLIC_PATH ?? '/',
}; };

5165
pnpm-lock.yaml
View file

File diff suppressed because it is too large Load diff