feat(editor): Filter component + implement in If node (#7490)

New Filter component + implementation in If node (v2)

<img width="3283" alt="image"
src="https://github.com/n8n-io/n8n/assets/8850410/35c379ef-4b62-4d06-82e7-673d4edcd652">

---------

Co-authored-by: Giulio Andreini <andreini@netseven.it>
Co-authored-by: Michael Kret <michael.k@radency.com>

packages/editor-ui/src/components/ExpressionParameterInput.vue

@@ -5,20 +5,14 @@
 		@keydown.tab="onBlur"
 	>
 		<div :class="[$style['all-sections'], { [$style['focused']]: isFocused }]">
-			<div
-				:class="[
-					$style['prepend-section'],
-					'el-input-group__prepend',
-					{ [$style['squared']]: isForRecordLocator },
-				]"
-			>
+			<div :class="[$style['prepend-section'], 'el-input-group__prepend']">
 				<ExpressionFunctionIcon />
 			</div>
 			<InlineExpressionEditorInput
 				:modelValue="modelValue"
 				:isReadOnly="isReadOnly"
 				:targetItem="hoveringItem"
-				:isSingleLine="isForRecordLocator"
+				:isSingleLine="isSingleLine"
 				:additionalData="additionalExpressionData"
 				:path="path"
 				@focus="onFocus"
@@ -86,7 +80,7 @@ export default defineComponent({
 			type: Boolean,
 			default: false,
 		},
-		isForRecordLocator: {
+		isSingleLine: {
 			type: Boolean,
 			default: false,
 		},
@@ -182,10 +176,6 @@ export default defineComponent({
 		width: 22px;
 		text-align: center;
 	}
-
-	.squared {
-		border-radius: 0;
-	}
 }
 
 .expression-editor-modal-opener {
@@ -197,7 +187,15 @@ export default defineComponent({
 	line-height: 9px;
 	border: var(--border-base);
 	border-top-left-radius: var(--border-radius-base);
-	border-bottom-right-radius: var(--border-radius-base);
+	border-bottom-right-radius: var(--input-border-bottom-right-radius, var(--border-radius-base));
+	border-right-color: var(
+		--input-border-right-color,
+		var(--input-border-color, var(--border-color-base))
+	);
+	border-bottom-color: var(
+		--input-border-bottom-color,
+		var(--input-border-color, var(--border-color-base))
+	);
 	cursor: pointer;
 
 	svg {