refactor(editor): Move editor-ui and design-system to frontend dir (no-changelog) (#13564)

This commit is contained in:
Alex Grozav
2025-02-28 14:28:30 +02:00
committed by GitHub
parent 684353436d
commit f5743176e5
1635 changed files with 805 additions and 1079 deletions

View File

@@ -0,0 +1,6 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`ChangePasswordModal > should render correctly 1`] = `
"<!--teleport start-->
<!--teleport end-->"
`;

View File

@@ -0,0 +1,184 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`InputPanel > should render 1`] = `
<div>
<div
class="run-data container"
data-test-id="ndv-input-panel"
data-v-2e5cd75c=""
>
<!--v-if-->
<!--v-if-->
<div
class="header"
data-v-2e5cd75c=""
>
<div
class="titleSection"
>
<span
class="title"
>
Input
</span>
<div
class="n8n-radio-buttons radioGroup"
data-test-id="input-panel-mode"
role="radiogroup"
>
<label
aria-checked="true"
class="n8n-radio-button container hoverable"
role="radio"
tabindex="-1"
>
<div
class="button active medium"
data-test-id="radio-button-mapping"
>
Mapping
</div>
</label>
<label
aria-checked="false"
class="n8n-radio-button container hoverable"
role="radio"
tabindex="-1"
>
<div
class="button medium"
data-test-id="radio-button-debugging"
>
Debugging
</div>
</label>
</div>
</div>
<div
class="displayModes"
data-test-id="run-data-pane-header"
data-v-2e5cd75c=""
>
<!---->
<div
class="n8n-radio-buttons radioGroup"
data-test-id="ndv-run-data-display-mode"
data-v-2e5cd75c=""
role="radiogroup"
>
<label
aria-checked="true"
class="n8n-radio-button container hoverable"
role="radio"
tabindex="-1"
>
<div
class="button active medium"
data-test-id="radio-button-schema"
>
Schema
</div>
</label>
<label
aria-checked="false"
class="n8n-radio-button container hoverable"
role="radio"
tabindex="-1"
>
<div
class="button medium"
data-test-id="radio-button-table"
>
Table
</div>
</label>
<label
aria-checked="false"
class="n8n-radio-button container hoverable"
role="radio"
tabindex="-1"
>
<div
class="button medium"
data-test-id="radio-button-json"
>
JSON
</div>
</label>
</div>
<!--v-if-->
<!--v-if-->
<div
class="editModeActions"
data-v-2e5cd75c=""
style="display: none;"
>
<button
aria-live="polite"
class="button button tertiary medium"
data-v-2e5cd75c=""
>
<!--v-if-->
<span>
Cancel
</span>
</button>
<button
aria-live="polite"
class="button button primary medium ml-2xs ml-2xs"
data-v-2e5cd75c=""
>
<!--v-if-->
<span>
Save
</span>
</button>
</div>
</div>
</div>
<!--v-if-->
<!--v-if-->
<!--v-if-->
<!--v-if-->
<!--v-if-->
<div
class="dataContainer"
data-test-id="ndv-data-container"
data-v-2e5cd75c=""
>
<!---->
</div>
<!--v-if-->
<transition-stub
appear="false"
class="uiBlocker"
css="true"
data-v-1a77a378=""
data-v-2e5cd75c=""
mode="out-in"
name="fade"
persisted="true"
>
<div
aria-hidden="true"
class="n8n-block-ui uiBlocker"
data-v-1a77a378=""
role="dialog"
style="display: none;"
/>
</transition-stub>
</div>
</div>
`;

View File

@@ -0,0 +1,26 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`MultipleParameter > should render correctly 1`] = `
"<div data-v-a47e4507="" class="duplicate-parameter">
<div data-v-a47e4507="" class="container" data-test-id="input-label">
<div class="labelRow"><label class="n8n-input-label inputLabel heading underline small">
<div class="main-content">
<div class="title"><span class="n8n-text text-dark size-small bold">Additional Fields <!--v-if--></span></div>
<!--v-if-->
</div>
<div class="trailing-content">
<!--v-if-->
<!--v-if-->
<!--v-if-->
</div>
</label>
<!--v-if-->
</div>
</div>
<div data-v-a47e4507="" class="add-item-wrapper">
<div data-v-a47e4507="" class="no-items-exist"><span data-v-a47e4507="" class="n8n-text size-small regular">Currently no items exist</span></div><button data-v-a47e4507="" class="button button tertiary medium block" aria-live="polite">
<!--v-if--><span>Add item</span>
</button>
</div>
</div>"
`;

View File

@@ -0,0 +1,55 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`PushConnectionTracker > should not render error when connected and connection not requested 1`] = `
<div>
<span>
</span>
</div>
`;
exports[`PushConnectionTracker > should not render error when connected and connection requested 1`] = `
<div>
<span>
</span>
</div>
`;
exports[`PushConnectionTracker > should render error when disconnected and connection requested 1`] = `
<div>
<span>
<div
class="push-connection-lost primary-color"
>
<span
class="el-tooltip__trigger"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-exclamation-triangle fa-w-18"
data-icon="exclamation-triangle"
data-prefix="fas"
focusable="false"
role="img"
viewBox="0 0 576 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
class=""
d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
fill="currentColor"
/>
</svg>
  Connection lost
</span>
<!--teleport start-->
<!--teleport end-->
</div>
</span>
</div>
`;

View File

@@ -0,0 +1,852 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`RunDataJson.vue > renders json values properly 1`] = `
<div>
<div
class="jsonDisplay"
>
<!---->
<div
class=""
>
<div
class="vjs-tree is-virtual json-data"
>
<div
class="vjs-tree-list"
style="height: 500px;"
>
<div
class="vjs-tree-list-holder"
style="height: 340px;"
>
<div
class="vjs-tree-list-holder-inner"
style="transform: translateY(0px);"
>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<!---->
</div>
<!---->
<span>
<span
class="vjs-tree-brackets"
>
[
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-tree-brackets"
>
{
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="list"
data-path="[0].list"
data-target="mappable"
data-value="{{ $('Set').item.json.list }}"
>
<span>
<!--v-if-->
"list"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-tree-brackets"
>
[
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-value vjs-value-number"
>
<span
class="content mappable ph-no-capture"
data-depth="3"
data-name="list[0]"
data-path="[0].list[0]"
data-target="mappable"
data-value="{{ $('Set').item.json.list[0] }}"
>
<span>
<!--v-if-->
1
</span>
</span>
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-value vjs-value-number"
>
<span
class="content mappable ph-no-capture"
data-depth="3"
data-name="list[1]"
data-path="[0].list[1]"
data-target="mappable"
data-value="{{ $('Set').item.json.list[1] }}"
>
<span>
<!--v-if-->
2
</span>
</span>
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-value vjs-value-number"
>
<span
class="content mappable ph-no-capture"
data-depth="3"
data-name="list[2]"
data-path="[0].list[2]"
data-target="mappable"
data-value="{{ $('Set').item.json.list[2] }}"
>
<span>
<!--v-if-->
3
</span>
</span>
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-tree-brackets"
>
]
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="record"
data-path="[0].record"
data-target="mappable"
data-value="{{ $('Set').item.json.record }}"
>
<span>
<!--v-if-->
"record"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-tree-brackets"
>
{
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="3"
data-name="name"
data-path="[0].record.name"
data-target="mappable"
data-value="{{ $('Set').item.json.record.name }}"
>
<span>
<!--v-if-->
"name"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-value vjs-value-string"
>
<span
class="content"
>
<span>
<!--v-if-->
"Joe"
</span>
</span>
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-tree-brackets"
>
}
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="myNumber"
data-path="[0].myNumber"
data-target="mappable"
data-value="{{ $('Set').item.json.myNumber }}"
>
<span>
<!--v-if-->
"myNumber"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-value vjs-value-number"
>
<span
class="content"
>
<span>
<!--v-if-->
123
</span>
</span>
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="myStringNumber"
data-path="[0].myStringNumber"
data-target="mappable"
data-value="{{ $('Set').item.json.myStringNumber }}"
>
<span>
<!--v-if-->
"myStringNumber"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-value vjs-value-string"
>
<span
class="content"
>
<span>
<!--v-if-->
"456"
</span>
</span>
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="myStringText"
data-path="[0].myStringText"
data-target="mappable"
data-value="{{ $('Set').item.json.myStringText }}"
>
<span>
<!--v-if-->
"myStringText"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-value vjs-value-string"
>
<span
class="content"
>
<span>
<!--v-if-->
"abc"
</span>
</span>
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="nil"
data-path="[0].nil"
data-target="mappable"
data-value="{{ $('Set').item.json.nil }}"
>
<span>
<!--v-if-->
"nil"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-value vjs-value-null"
>
<span
class="content"
>
<span>
<!--v-if-->
null
</span>
</span>
</span>
<span>
,
</span>
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<span
class="vjs-key"
>
<span
class="content mappable"
data-depth="2"
data-name="d"
data-path="[0].d"
data-target="mappable"
data-value="{{ $('Set').item.json.d }}"
>
<span>
<!--v-if-->
"d"
</span>
</span>
<span
class="vjs-colon"
>
:
</span>
</span>
<span>
<span
class="vjs-value vjs-value-undefined"
>
<span
class="content"
>
<span />
</span>
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<div
class="vjs-indent-unit has-line"
/>
<!---->
</div>
<!---->
<span>
<span
class="vjs-tree-brackets"
>
}
</span>
<!---->
<!---->
</span>
</div>
<div
class="vjs-tree-node"
>
<!---->
<!---->
<div
class="vjs-indent"
>
<!---->
</div>
<!---->
<span>
<span
class="vjs-tree-brackets"
>
]
</span>
<!---->
<!---->
</span>
</div>
</div>
</div>
</div>
</div>
<!--teleport start-->
<!--teleport end-->
</div>
</div>
</div>
`;