Show images in documentation #10205
Merged
Show images in documentation #10205
Conversation
This file contains 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
…ormatting-toolbar
ExtendedMenu. - DropdownMenu: Encapsulates the dropdown pattern, i.e. a toggle button that opens a floating pane. - MenuButton: A low-level control that adds button behavior to any element; all other buttons are now implemented using it.
- Recognize markdown image syntax; render images in editor - Images with local paths are fetched from the project directory
kazcw
requested review from
Frizi,
farmaazon,
vitvakatu and
AdRiley
as code owners
kazcw
added
the
CI: No changelog needed
farmaazon
approved these changes
Jun 7, 2024
Comment on lines
21
to
23
| if (url.includes('//')) { | ||
| // Not a relative URL, custom fetching not needed. | ||
| return undefined |
There was a problem hiding this comment.
Technically, inside paths, double / is treated as single /, at least on Linuxes. Maybe check for : presence?
There was a problem hiding this comment.
I'll use the URL API.
Comment on lines
37
to
45
| } else { | ||
| // Relative to current module. | ||
| const segments = url.split('/') | ||
| if (segments[0] === '..') { | ||
| return Ok({ rootId, segments: segments.slice(1) }) | ||
| } else { | ||
| return Ok({ rootId, segments: ['src', ...segments] }) | ||
| } | ||
| } |
There was a problem hiding this comment.
We assume we're in src module. Let's put the current module's path somewhere (graph store?) so once we implement opening modules, this part will continue working.
Comment on lines
-21
to
+29
| get: () => props.node.documentation ?? '', | ||
| set: (value) => (astDocumentation.value = value), | ||
| }) | ||
| // This returns the same value as `astDocumentation.state`, but with fewer reactive dependencies. | ||
| const documentation = computed(() => props.node.documentation ?? '') | ||
|
|
||
| syncRef(editing, useFocusDelayed(textEditor).focused) | ||
| </script> | ||
| <template> | ||
| <div v-if="editing || props.node.documentation?.trimStart()" class="GraphNodeComment"> | ||
| <PlainTextEditor | ||
| ref="textEditor" | ||
| v-model="documentation" | ||
| :modelValue="documentation" | ||
| @update:modelValue="astDocumentation.set" |
There was a problem hiding this comment.
Perhaps a matter of taste, but I preferred the old solution here. Or maybe it has some drawbacks?
There was a problem hiding this comment.
It relied on a side effect in a computed setter; Paweł suggested replacing that pattern with a state getter and updating separately.
kazcw
added
CI: Ready to merge
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Pull Request Description
Render markdown image syntax in documentation. Relative URLs are fetched from the project directory; absolute URLs are hotlinked from wherever they point.
Syntax and URL resolution:
doc-images.mov
Closes #10058.
Important Notes
Stacked on #10064.
Checklist
Please ensure that the following checklist has been satisfied before submitting the PR:
Scala,
Java,
TypeScript,
and
Rust
style guides. In case you are using a language not listed above, follow the Rust style guide.