Refactor to Vue 3 recommended ESLint rules

These updates ensure better adherence to Vue 3 standards and improve
overall code quality and readability.

- Update ESLint configuration from Vue 2.x to Vue 3 rules.
- Switch from "essential" to strictest "recommended" ESLint ruleset.
- Adjust ESLint script to treat warnings as errors by using
  `--max-warnings=0` flag. This enforces stricter code quality controls
  provided by Vue 3 rules.

src/presentation/components/Code/TheCodeArea.vue

@@ -1,7 +1,8 @@
 <template>
   <SizeObserver
-    v-on:sizeChanged="sizeChanged()"
-    v-non-collapsing>
+    v-non-collapsing
+    @size-changed="sizeChanged()"
+  >
     <div
       :id="editorId"
       class="code-area"
@@ -24,18 +25,18 @@ import { NonCollapsing } from '@/presentation/components/Scripts/View/Cards/NonC
 import ace from './ace-importer';
 
 export default defineComponent({
-  props: {
-    theme: {
-      type: String,
-      default: undefined,
-    },
-  },
   components: {
     SizeObserver,
   },
   directives: {
     NonCollapsing,
   },
+  props: {
+    theme: {
+      type: String,
+      default: undefined,
+    },
+  },
   setup(props) {
     const { onStateChange, currentState } = injectKey((keys) => keys.useCollectionState);
     const { events } = injectKey((keys) => keys.useAutoUnsubscribedEvents);