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

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

@@ -1,11 +1,11 @@
 <template>
-	<div :class="$style.sqlEditor" v-on-click-outside="onBlur">
+	<div v-on-click-outside="onBlur" :class="$style.sqlEditor">
 		<div ref="sqlEditor" data-test-id="sql-editor-container"></div>
 		<InlineExpressionEditorOutput
 			:segments="segments"
-			:isReadOnly="isReadOnly"
+			:is-read-only="isReadOnly"
 			:visible="isFocused"
-			:hoveringItemNumber="hoveringItemNumber"
+			:hovering-item-number="hoveringItemNumber"
 		/>
 	</div>
 </template>
@@ -66,7 +66,7 @@ type SQLEditorData = {
 };
 
 export default defineComponent({
-	name: 'sql-editor',
+	name: 'SqlEditor',
 	components: {
 		InlineExpressionEditorOutput,
 	},
@@ -100,21 +100,6 @@ export default defineComponent({
 			skipSegments: ['Statement', 'CompositeIdentifier', 'Parens'],
 		};
 	},
-	watch: {
-		'ndvStore.ndvInputData'() {
-			this.editor?.dispatch({
-				changes: {
-					from: 0,
-					to: this.editor.state.doc.length,
-					insert: this.modelValue,
-				},
-			});
-
-			setTimeout(() => {
-				this.editor?.contentDOM.blur();
-			});
-		},
-	},
 	computed: {
 		doc(): string {
 			return this.editor?.state.doc.toString() ?? '';
@@ -188,6 +173,21 @@ export default defineComponent({
 			return extensions;
 		},
 	},
+	watch: {
+		'ndvStore.ndvInputData'() {
+			this.editor?.dispatch({
+				changes: {
+					from: 0,
+					to: this.editor.state.doc.length,
+					insert: this.modelValue,
+				},
+			});
+
+			setTimeout(() => {
+				this.editor?.contentDOM.blur();
+			});
+		},
+	},
 	mounted() {
 		if (!this.isReadOnly) codeNodeEditorEventBus.on('error-line-number', this.highlightLine);