c2768e2188
2 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
Henrik Giesel
|
c2768e2188
|
Translate Editor entirely to Svelte (#1403)
* Translate editor to Svelte Make editor fields grid rather than flexbox Refactor ButtonToolbar margins Remove remaining svelte.d.ts symlinks Implement saveNow Fix text surrounding Remove HTML editor button Clean up some empty files Add visual for new field state badges * Adds new IconConstrain.svelte to generalize the icon handling for IconButton and Badge Implement sticky functionality again Enable Editable and Codable field state badges Add shortcuts to FieldState badges Add Shift+F9 shortcut back Add inline padding back to editor fields, tag editor and toolbar Make Editable and Codable only "visually hidden" This way they are still updated in the background Otherwise reshowing them will always start them up empty Make empty editing area focusable Start with moving fieldsKey and currentFieldKey to context.ts Fix Codable being wrong size when opening for first time Add back drag'n'drop Make ButtonItem display: contents again * This will break the gap between ButtonGroup items, however once we have a newer Chromium version we should use CSS gap property anyway Fix most of typing issues Use --label-color background color LabelContainer Add back red color for dupes Generalize the editor toolbar in the multiroot editor to widgets Implement Notification.svelte for showing cloze hints Add colorful icon to notification Hook up Editable to EditingArea Move EditingArea into EditorField Include editorField in editor/context Fix rebasing issues Uniformly use SvelteComponentTyped Take LabelContainer out of EditingArea Use mirror-dom and node-store to export editable content Fix editable update mechanism Prepare passing the editing inputs as slots Pass in editing inputs as slots Use codable options again in codemirror Delete editor/lib.ts Remove CodableAdapter, Use more generic CodeMirror component Fix clicking LabelContainer to focus Use prettier Rename Editable to ContentEditable Fix writing Mathjax from Codable to Editable Correctly adjust output HTML from editable Refactor EditableStyles out of EditableContainer Pass Image and Mathjax Handle via slots to Editable Make Editable add its editingInputApi Make Editable hideable Fix font size not being set correctly Refactor both fieldFocused and focusInCodable to focusInEditable Fix focusIfField Bring back $activeInput Fix ClozeButton Remove signifyCustomInput Refactor MathjaxHandle Refactor out some logic into store-subscribe Fix Mathjax editor Use focusTrap instead of focusing div Delegate focus back to editingInput when refocusing focusTrap Elegantly move focus between editing inputs when closing/opening Make Codable tabbable Automatically move caret to end on editable and codable + remove from editingInput api Fix ButtonDropdown having two rows and missing button margins Make svelte_check and eslint pass Satisfy editor svelte_check Save field updates to db again Await editable styles before mounting content editable Remove unused import from OldEditorAdapter Add copyright header to OldEditorAdapter Update button active state from contenteditable * Use activateStickyShortcuts after waiting for noteEditorPromise * Set fields via stores, make tags correctly set * Add explaining comment to setFields * Fix ClozeButton * Send focus and blur events again * Fix Codable not correctly updating on blur with invalid HTML * Remove old code for special Enter behavior in tags * Do not use logical properties for ButtonToolbar margins * Remove getCurrentField Instead use noteEditor->currentField or noteEditor->activeInput * Remove Extensible type * Use context-property for NoteEditor, EditorField and EditingArea * Rename parameter in mirror-dom.allowResubscription * Fix cutOrCopy * Refactor context.ts into the individual components * Move focusing of editingArea up to editorField * Rename promiseResolve -> promiseWithResolver * Rename Editable->RichTextInput and Codable->PlainTextInput * Remove now unnecessary type assertion for `getNoteEditor` and `getEditingArea` * Refocus field after adding, so subscription to editing area is refreshed |
||
|
Damien Elmes
|
a3d9f90af5 |
update to latest rules_nodejs & switch to ts_project
ts_library() is deprecated and will presumably be dropped from a future rules_nodejs, and it wasn't working with the jest tests after updating, so we switch over to ts_project(). There are some downsides: - It's a bit slower, as the worker mode doesn't appear to function at the moment. - Getting it working with a mix of source files and generated files was quite tricky, especially as things behave differently on Windows, and differently when editing with VS Code. Solved with a small patch to the rules, and a wrapper script that copies everything into the bin folder first. To keep VS Code working correctly as well, the built files are symlinked into the source folder. - TS libraries are not implicitly linked to node_modules, so they can't be imported with an absolute name like "lib/proto" - we need to use relative paths like "../lib/proto" instead. Adjusting "paths" in tsconfig.json makes it work for TS compilation, but then it fails at the esbuild stage. We could resolve it by wrapping the TS libraries in a subsequent js_library() call, but that has the downside of losing the transient dependencies, meaning they need to be listed again. Alternatively we might be able to solve it in the future by adjusting esbuild, but for now the paths have been made relative to keep things simple. Upsides: - Along with updates to the Svelte tooling, Svelte typing has improved. All exports made in a Svelte file are now visible to other files that import them, and we no longer rebuild the Svelte files when TS files are updated, as the Svelte files do no type checking themselves, and are just a simple transpilation. Svelte-check now works on Windows again, and there should be no errors when editing in VS Code after you've built the project. The only downside seems to be that cmd+clicking on a Svelte imports jumps to the .d.ts file instead of the original now; presumably they'll fix that in a future plugin update. - Each subfolder now has its own tsconfig.json, and tsc can be called directly for testing purposes (but beware it will place build products in the source tree): ts/node_modules/.bin/tsc -b ts - We can drop the custom esbuild_toolchain, as it's included in the latest rules_nodejs. Other changes: - "image_module_support" is moved into lib/, and imported with <reference types=...> - Images are now imported directly from their npm package; the extra copy step has been removed. Windows users may need to use "bazel clean" before building this, due to old files lying around in the build folder. |