feat(editor): Migrate copyPaste mixin to composables (no-changelog) (#8179)

packages/editor-ui/src/styles/plugins/_codemirror.scss

@@ -0,0 +1,73 @@
+.cm-tooltip-autocomplete:after {
+	padding: var(--spacing-2xs) var(--spacing-s);
+	border-top: 1px solid var(--color-foreground-dark);
+}
+
+.code-node-editor .cm-tooltip-autocomplete:after {
+	display: block;
+	content: 'n8n supports all JavaScript functions, including those not listed.';
+}
+
+// Custom autocomplete item type icons
+// 1. Native and n8n extension functions:
+.cm-completionIcon-extension-function,
+.cm-completionIcon-native-function {
+	&::after {
+		content: 'ƒ';
+	}
+}
+
+.cm-tooltip-autocomplete {
+	background-color: var(--color-background-xlight) !important;
+
+	.cm-tooltip {
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
+	li .cm-completionLabel {
+		color: var(--color-success);
+	}
+}
+
+.ͼ2 .cm-tooltip-autocomplete ul li[aria-selected] {
+	background-color: var(--color-autocomplete-selected-background);
+}
+
+.ͼ2 .cm-tooltip-autocomplete ul li[aria-selected] .cm-completionLabel {
+	color: var(--color-autocomplete-selected-font) !important;
+	font-weight: 600;
+}
+
+.autocomplete-info-container {
+	display: flex;
+	flex-direction: column;
+	padding: var(--spacing-4xs) 0;
+}
+
+.cm-completionInfo {
+	background-color: var(--color-background-xlight) !important;
+
+	.autocomplete-info-header {
+		color: var(--color-text-dark);
+		line-height: var(--font-line-height-compact);
+		margin-bottom: var(--spacing-2xs);
+	}
+
+	.autocomplete-info-name {
+		color: var(--color-success);
+		font-weight: var(--font-weight-bold);
+	}
+
+	.autocomplete-info-description {
+		code {
+			background-color: var(--color-background-base);
+			padding: 0 2px;
+		}
+		p {
+			line-height: var(--font-line-height-compact);
+			margin-top: 0;
+			margin-bottom: var(--spacing-4xs);
+		}
+	}
+}

packages/editor-ui/src/styles/plugins/index.scss

@@ -0,0 +1 @@
+@import "codemirror";