refactor(editor): Improve linting for component and prop names (no-changelog) (#8169)

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

@@ -139,15 +139,15 @@ function focusFirstInput() {
 				<span v-if="!editing">{{ data.key }}</span>
 				<n8n-form-input
 					v-else
+					ref="keyInputRef"
+					v-model="modelValue.key"
 					label
 					name="key"
 					data-test-id="variable-row-key-input"
 					:placeholder="i18n.baseText('variables.editing.key.placeholder')"
 					required
-					validateOnBlur
-					:validationRules="keyValidationRules"
-					v-model="modelValue.key"
-					ref="keyInputRef"
+					validate-on-blur
+					:validation-rules="keyValidationRules"
 					@validate="(value) => onValidate('key', value)"
 				/>
 			</div>
@@ -157,14 +157,14 @@ function focusFirstInput() {
 				<span v-if="!editing">{{ data.value }}</span>
 				<n8n-form-input
 					v-else
+					ref="valueInputRef"
+					v-model="modelValue.value"
 					label
 					name="value"
 					data-test-id="variable-row-value-input"
 					:placeholder="i18n.baseText('variables.editing.value.placeholder')"
-					validateOnBlur
-					:validationRules="valueValidationRules"
-					v-model="modelValue.value"
-					ref="valueInputRef"
+					validate-on-blur
+					:validation-rules="valueValidationRules"
 					@validate="(value) => onValidate('value', value)"
 				/>
 			</div>