diff --git a/packages/design-system/src/components/N8nNodeIcon/NodeIcon.stories.ts b/packages/design-system/src/components/N8nNodeIcon/NodeIcon.stories.ts
index 0341825749..75a7d18496 100644
--- a/packages/design-system/src/components/N8nNodeIcon/NodeIcon.stories.ts
+++ b/packages/design-system/src/components/N8nNodeIcon/NodeIcon.stories.ts
@@ -7,6 +7,7 @@ export default {
};
const DefaultTemplate: StoryFn = (args, { argTypes }) => ({
+ setup: () => ({ args }),
props: Object.keys(argTypes),
components: {
N8nNodeIcon,
diff --git a/packages/design-system/src/components/N8nNotice/Notice.stories.ts b/packages/design-system/src/components/N8nNotice/Notice.stories.ts
index 1ca30d9f1e..7da7555cbb 100644
--- a/packages/design-system/src/components/N8nNotice/Notice.stories.ts
+++ b/packages/design-system/src/components/N8nNotice/Notice.stories.ts
@@ -13,6 +13,7 @@ export default {
};
const SlotTemplate: StoryFn = (args, { argTypes }) => ({
+ setup: () => ({ args }),
props: Object.keys(argTypes),
components: {
N8nNotice,
@@ -22,6 +23,7 @@ const SlotTemplate: StoryFn = (args, { argTypes }) => ({
});
const PropTemplate: StoryFn = (args, { argTypes }) => ({
+ setup: () => ({ args }),
props: Object.keys(argTypes),
components: {
N8nNotice,
diff --git a/packages/design-system/src/components/N8nRadioButtons/RadioButton.vue b/packages/design-system/src/components/N8nRadioButtons/RadioButton.vue
index 221be4b48f..aafc757c51 100644
--- a/packages/design-system/src/components/N8nRadioButtons/RadioButton.vue
+++ b/packages/design-system/src/components/N8nRadioButtons/RadioButton.vue
@@ -9,7 +9,13 @@
}"
aria-checked="true"
>
-
+
+ template: `
`,
methods,
data() {
diff --git a/packages/design-system/src/components/N8nRadioButtons/RadioButtons.vue b/packages/design-system/src/components/N8nRadioButtons/RadioButtons.vue
index 1972d4fd60..78aaa19923 100644
--- a/packages/design-system/src/components/N8nRadioButtons/RadioButtons.vue
+++ b/packages/design-system/src/components/N8nRadioButtons/RadioButtons.vue
@@ -7,7 +7,7 @@
v-for="option in options"
:key="option.value"
v-bind="option"
- :active="value === option.value"
+ :active="modelValue === option.value"
:size="size"
:disabled="disabled || option.disabled"
@click="() => onClick(option)"
@@ -30,7 +30,7 @@ export interface RadioOption {
export default defineComponent({
name: 'n8n-radio-buttons',
props: {
- value: {
+ modelValue: {
type: String,
},
options: {
@@ -52,7 +52,7 @@ export default defineComponent({
if (this.disabled || option.disabled) {
return;
}
- this.$emit('input', option.value);
+ this.$emit('update:modelValue', option.value);
},
},
});
diff --git a/packages/design-system/src/components/N8nResizeWrapper/ResizeWrapper.stories.js b/packages/design-system/src/components/N8nResizeWrapper/ResizeWrapper.stories.js
index d89fea1806..bafd4c621a 100644
--- a/packages/design-system/src/components/N8nResizeWrapper/ResizeWrapper.stories.js
+++ b/packages/design-system/src/components/N8nResizeWrapper/ResizeWrapper.stories.js
@@ -42,7 +42,7 @@ const Template = (args, { argTypes }) => ({
},
template: `
({
+ setup: () => ({ args }),
props: Object.keys(argTypes),
components: {
N8nSelect,
@@ -109,6 +110,7 @@ const selectsWithIcon = ['xlarge', 'large', 'medium', 'small', 'mini']
.join('');
const ManyTemplateWithIcon: StoryFn = (args, { argTypes }) => ({
+ setup: () => ({ args }),
props: Object.keys(argTypes),
components: {
N8nSelect,
@@ -132,6 +134,7 @@ WithIcon.args = {
};
const LimitedWidthTemplate: StoryFn = (args, { argTypes }) => ({
+ setup: () => ({ args }),
props: Object.keys(argTypes),
components: {
N8nSelect,
diff --git a/packages/design-system/src/components/N8nSelect/Select.vue b/packages/design-system/src/components/N8nSelect/Select.vue
index 66307f8068..b0fc0c62e6 100644
--- a/packages/design-system/src/components/N8nSelect/Select.vue
+++ b/packages/design-system/src/components/N8nSelect/Select.vue
@@ -17,15 +17,13 @@
:popper-class="popperClass"
ref="innerSelect"
>
-
+
-
+
-
-
-
+
diff --git a/packages/design-system/src/components/N8nSticky/Sticky.stories.ts b/packages/design-system/src/components/N8nSticky/Sticky.stories.ts
index c4c949bca9..6a4e05d830 100644
--- a/packages/design-system/src/components/N8nSticky/Sticky.stories.ts
+++ b/packages/design-system/src/components/N8nSticky/Sticky.stories.ts
@@ -40,7 +40,7 @@ export default {
};
const methods = {
- onInput: action('input'),
+ onInput: action('update:modelValue'),
onResize: action('resize'),
onResizeEnd: action('resizeend'),
onResizeStart: action('resizestart'),
diff --git a/packages/design-system/src/components/N8nSticky/Sticky.vue b/packages/design-system/src/components/N8nSticky/Sticky.vue
index 1c18ce051c..e56ed76c36 100644
--- a/packages/design-system/src/components/N8nSticky/Sticky.vue
+++ b/packages/design-system/src/components/N8nSticky/Sticky.vue
@@ -16,46 +16,44 @@
@resize="onResize"
@resizestart="onResizeStart"
>
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/design-system/src/components/index.ts b/packages/design-system/src/components/index.ts
index e09181c068..8b41b119d7 100644
--- a/packages/design-system/src/components/index.ts
+++ b/packages/design-system/src/components/index.ts
@@ -26,19 +26,19 @@ export { default as N8nLoading } from './N8nLoading';
export { default as N8nMarkdown } from './N8nMarkdown';
export { default as N8nMenu } from './N8nMenu';
export { default as N8nMenuItem } from './N8nMenuItem';
-// export { default as N8nNodeCreatorNode } from './N8nNodeCreatorNode';
-// export { default as N8nNodeIcon } from './N8nNodeIcon';
-// export { default as N8nNotice } from './N8nNotice';
-// export { default as N8nOption } from './N8nOption';
+export { default as N8nNodeCreatorNode } from './N8nNodeCreatorNode';
+export { default as N8nNodeIcon } from './N8nNodeIcon';
+export { default as N8nNotice } from './N8nNotice';
+export { default as N8nOption } from './N8nOption';
export { default as N8nPopover } from './N8nPopover';
-// export { default as N8nPulse } from './N8nPulse';
-// export { default as N8nRadioButtons } from './N8nRadioButtons';
-// export { default as N8nSelect } from './N8nSelect';
-// export { default as N8nSpinner } from './N8nSpinner';
-// export { default as N8nSticky } from './N8nSticky';
+export { default as N8nPulse } from './N8nPulse';
+export { default as N8nRadioButtons } from './N8nRadioButtons';
+export { default as N8nSelect } from './N8nSelect';
+export { default as N8nSpinner } from './N8nSpinner';
+export { default as N8nSticky } from './N8nSticky';
+export { default as N8nTags } from './N8nTags';
// export { default as N8nTabs } from './N8nTabs';
// export { default as N8nTag } from './N8nTag';
-// export { default as N8nTags } from './N8nTags';
export { default as N8nText } from './N8nText';
export { default as N8nTooltip } from './N8nTooltip';
// export { default as N8nTree } from './N8nTree';
diff --git a/packages/design-system/src/plugin.ts b/packages/design-system/src/plugin.ts
index a39fad9606..9de54425c2 100644
--- a/packages/design-system/src/plugin.ts
+++ b/packages/design-system/src/plugin.ts
@@ -26,22 +26,22 @@ import {
N8nInputNumber,
N8nLink,
N8nLoading,
- // N8nMarkdown,
- // N8nMenu,
- // N8nMenuItem,
- // N8nNodeCreatorNode,
- // N8nNodeIcon,
- // N8nNotice,
- // N8nOption,
+ N8nMarkdown,
+ N8nMenu,
+ N8nMenuItem,
+ N8nNodeCreatorNode,
+ N8nNodeIcon,
+ N8nNotice,
+ N8nOption,
N8nPopover,
- // N8nPulse,
- // N8nRadioButtons,
- // N8nSelect,
- // N8nSpinner,
- // N8nSticky,
+ N8nPulse,
+ N8nRadioButtons,
+ N8nSelect,
+ N8nSpinner,
+ N8nSticky,
+ N8nTags,
// N8nTabs,
// N8nTag,
- // N8nTags,
N8nText,
N8nTooltip,
// N8nTree,
@@ -81,20 +81,20 @@ export const N8nPlugin: Plugin<{}> = {
app.component('n8n-input-number', N8nInputNumber);
app.component('n8n-link', N8nLink);
app.component('n8n-loading', N8nLoading);
- // app.component('n8n-markdown', N8nMarkdown);
- // app.component('n8n-menu', N8nMenu);
- // app.component('n8n-menu-item', N8nMenuItem);
- // app.component('n8n-node-creator-node', N8nNodeCreatorNode);
- // app.component('n8n-node-icon', N8nNodeIcon);
- // app.component('n8n-notice', N8nNotice);
- // app.component('n8n-option', N8nOption);
+ app.component('n8n-markdown', N8nMarkdown);
+ app.component('n8n-menu', N8nMenu);
+ app.component('n8n-menu-item', N8nMenuItem);
+ app.component('n8n-node-creator-node', N8nNodeCreatorNode);
+ app.component('n8n-node-icon', N8nNodeIcon);
+ app.component('n8n-notice', N8nNotice);
+ app.component('n8n-option', N8nOption);
app.component('n8n-popover', N8nPopover);
- // app.component('n8n-pulse', N8nPulse);
- // app.component('n8n-select', N8nSelect);
- // app.component('n8n-spinner', N8nSpinner);
- // app.component('n8n-sticky', N8nSticky);
- // app.component('n8n-radio-buttons', N8nRadioButtons);
- // app.component('n8n-tags', N8nTags);
+ app.component('n8n-pulse', N8nPulse);
+ app.component('n8n-radio-buttons', N8nRadioButtons);
+ app.component('n8n-select', N8nSelect);
+ app.component('n8n-spinner', N8nSpinner);
+ app.component('n8n-sticky', N8nSticky);
+ app.component('n8n-tags', N8nTags);
// app.component('n8n-tabs', N8nTabs);
// app.component('n8n-tag', N8nTag);
app.component('n8n-text', N8nText);
diff --git a/packages/editor-ui/src/components/CredentialsSelect.vue b/packages/editor-ui/src/components/CredentialsSelect.vue
index 83a1fd9593..f6e5d111e0 100644
--- a/packages/editor-ui/src/components/CredentialsSelect.vue
+++ b/packages/editor-ui/src/components/CredentialsSelect.vue
@@ -4,7 +4,7 @@
diff --git a/packages/editor-ui/src/components/InputPanel.vue b/packages/editor-ui/src/components/InputPanel.vue
index 25d62b3657..1910f49b5b 100644
--- a/packages/editor-ui/src/components/InputPanel.vue
+++ b/packages/editor-ui/src/components/InputPanel.vue
@@ -27,8 +27,8 @@
v-if="parentNodes.length"
:popper-append-to-body="true"
size="small"
- :value="currentNodeName"
- @input="onSelect"
+ :modelValue="currentNodeName"
+ @update:modelValue="onSelect"
:no-data-text="$locale.baseText('ndv.input.noNodesFound')"
:placeholder="$locale.baseText('ndv.input.parentNodes')"
filterable
diff --git a/packages/editor-ui/src/components/MainHeader/TabBar.vue b/packages/editor-ui/src/components/MainHeader/TabBar.vue
index 3142a62c5d..0a70cb2fe3 100644
--- a/packages/editor-ui/src/components/MainHeader/TabBar.vue
+++ b/packages/editor-ui/src/components/MainHeader/TabBar.vue
@@ -7,7 +7,7 @@
[$style.menuCollapsed]: mainSidebarCollapsed,
}"
>
-
+