diff --git a/packages/frontend/@n8n/design-system/src/components/N8nTag/Tag.vue b/packages/frontend/@n8n/design-system/src/components/N8nTag/Tag.vue index 99f24318379..e2e929bd6c3 100644 --- a/packages/frontend/@n8n/design-system/src/components/N8nTag/Tag.vue +++ b/packages/frontend/@n8n/design-system/src/components/N8nTag/Tag.vue @@ -17,7 +17,7 @@ withDefaults(defineProps(), { v-bind="$attrs" > - {{ text }} + {{ text }} @@ -26,9 +26,10 @@ withDefaults(defineProps(), { display: flex; align-items: center; justify-content: center; - min-width: max-content; + min-width: var(--tag--min-width, max-content); height: var(--tag--height); padding: var(--tag--padding); + max-width: var(--tag--max-width); line-height: var(--tag--line-height); color: var(--tag--color--text); background-color: var(--tag--color--background); @@ -36,6 +37,7 @@ withDefaults(defineProps(), { border-radius: var(--tag--radius); font-size: var(--tag--font-size); transition: background-color 0.3s ease; + user-select: none; &.clickable { cursor: pointer; @@ -47,6 +49,13 @@ withDefaults(defineProps(), { } } +.text { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + .sm { --tag--height: var(--height--2xs); --tag--padding: 0 var(--spacing--4xs); diff --git a/packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiInput.vue b/packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiInput.vue index 9323e536005..6a06a133f30 100644 --- a/packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiInput.vue +++ b/packages/frontend/editor-ui/src/features/ai/instanceAi/components/InstanceAiInput.vue @@ -1,7 +1,7 @@