Repository navigation
React client - #8
Open
jlee-kitware wants to merge 2 commits into
Open
jlee-kitware wants to merge 2 commits into
jlee-kitware wants to merge 2 commits into
Conversation
Adds react-components/ mirroring vue-components/: the Monaco editor as a React component, with utils/ and themes/ shared by alias rather than copied. The module descriptor picks the bundle from server.client_type, and the widget declares value/onChange for react instead of v-model, since react has no two-way binding directive. The completion/hover callbacks keep the same trigger contract, so python consumers are unchanged. Also fixes the monaco worker URL: the module serves its assets from a versioned directory but the bundle asked for the unversioned path, so worker creation failed and monaco fell back to the main thread. The base is now derived from the script tag that loaded the bundle.
Aligns with trame-vtklocal and trame-rca: the widget declares react props and events through self.props/self.events rather than _attr_names, which is the documented surface and the only one that routes events correctly. react-components is TypeScript now, built against react 19 to match the version trame-client ships. That removes two workarounds: the classic jsx runtime (needed only because react 18's jsx-runtime reaches into internals react 19 dropped) and a global process shim. Vite stays on 4 here rather than 8, since vite-plugin-monaco-editor needs esbuild and the rolldown-based vite 8 no longer provides it. CI builds the react bundle after the vue one in both the test and release jobs; the vue build empties the shared serve directory, so order matters.
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The editor only worked under the Vue client, so apps running with
client_type="react"had no code editor.Adds a React bundle alongside the Vue one.
setup()serves whichever matches theserver's client type. The widget branches as well, since the editor is v-model
based and the two clients spell that binding differently: React declares
valueand
onChangethroughself.props/self.events, Vue keepsmodelValueandinput. Same shape as trame-vtklocal. Completion and hover still go throughwindow.trame.trigger, so the Python side is unchanged. The component is TSXbuilt against React 19, the version trame-client ships.
For review:
.umd.cjsas well as.umd.js, since thatis what the React bundle builds as. Without it, workers fall back to the old
unversioned path and 404.
react-componentsstays on Vite 4:vite-plugin-monaco-editorneedsesbuild,which the rolldown based Vite 8 dropped.
--emptyOutDiron theshared serve directory.
@sharedaliases tovue-components/srcsoutils/andthemes/exist once.trame-rca keeps parallel copies instead; happy to match that if preferred.
Verified against the example and a real app: editor mounts and binds, edits round
trip, completion and hover populate from Python, workers load from the versioned
directory.