Как создать настраиваемое поле с поддержкой CodeMirror в Laravel Orchid и почему в макете не работает JavaScript? ⇐ Php

[Anonymous]

У меня вопрос о том, как создать собственное поле в Laravel (Orchid) с поддержкой библиотеки CodeMirror. Я ознакомился с документацией и одним видео по этой теме и выполнил следующие шаги:
[*]Написал файл Dashboard.js. [*]Интегрировал этот файл в проект с помощью Vite. [*]Создал собственный контроллер JavaScript. [*]Написал логику в этом контроллере. [*]Создал шаблон Blade для своего поля, указав атрибут data-controller с псевдонимом, зарегистрированным в Dashboard.js. [*]Для этого поля создан собственный класс PHP.
Однако, когда я вставляю это поле в какой-либо макет, кажется, что JavaScript не работает и на выходе отображается только HTML. Подскажите, пожалуйста, как решить эту проблему?

это моя панель управления JS

импортировать MirrorTextArea из "./controllers/mirrorTextArea.js" application.register("mirrorTextArea", MirrorTextArea); это моя виртуальная конф.

import { defineConfig } из 'vite'; импортировать laravel из «laravel-vite-plugin»; экспортировать default defineConfig({ плагины: [ ларавель({ вход: [ 'ресурсы/css/app.css', 'ресурсы/js/app.js', 'ресурсы/js/dashboard.js' ], обновить: правда, }), ], }); это мой клинок

@comComponent($typeForm, get_defined_vars()) @endкомпонент это мой контроллер

import { EditorState } из '@codemirror/state'; импортировать { EditorView, раскладку клавиатуры } из '@codemirror/view'; импортировать { defaultKeymap } из '@codemirror/commands'; класс экспорта по умолчанию расширяет window.Controller { соединять() { константные параметры = { режим: this.data.get('режим'), lineNumbers: this.data.get('lineNumbers'), тема: this.data.get('тема'), }; const textarea = this.element.querySelector('textarea'); // Находим текстовую область внутри элемента контроллера const state = EditorState.create({ doc: textarea.value, // Вы можете установить исходное содержимое из текстовой области }); const view = новый EditorView({ состояние, родитель: текстовая область, handleDOMEvents: { фокус: () => view.focus(), }, }); const viewDOM = view.dom; const viewState = view.state; view.dom = viewDOM; view.state = viewState.extend([keymap(defaultKeymap)]); просмотр.фокус(); } } это мое поле