livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2024-11-10 09:03:02 +08:00
Code Issues Projects Releases Packages Wiki Activity

Highlight range when showing hover details (#2747)

Browse source
This commit is contained in:
Jonatan Kłosko 2024-08-16 16:07:44 +02:00 committed by GitHub
parent 72c65ba34c
commit 403be80603
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 38 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets/js/hooks/cell_editor/live_editor.js
View file

@ -1,6 +1,5 @@
import {
EditorView,
hoverTooltip,
keymap,
highlightSpecialChars,
drawSelection,
@ -57,6 +56,7 @@ import {
import { ancestorNode, closestNode } from "./live_editor/codemirror/tree_utils";
import { selectingClass } from "./live_editor/codemirror/selecting_class";
import { globalPubsub } from "../../lib/pubsub";
import { hoverDetails } from "./live_editor/codemirror/hover_details";
/**
* Mounts cell source editor with real-time collaboration mechanism.
@ -352,7 +352,7 @@ export default class LiveEditor {
this.intellisense
? [
autocompletion({ override: [this.completionSource.bind(this)] }),
hoverTooltip(this.docsHoverTooltipSource.bind(this)),
hoverDetails(this.docsHoverTooltipSource.bind(this)),
signature(this.signatureSource.bind(this), {
activateOnTyping: settings.editor_auto_signature,
}),

26
assets/js/hooks/cell_editor/live_editor/codemirror/hover_details.js Normal file
View file

@ -0,0 +1,26 @@
import { Decoration, EditorView, hoverTooltip } from "@codemirror/view";
import { RangeSet } from "@codemirror/state";
/**
* Returns an extension that enables hover details tooltip.
*/
export function hoverDetails(hoverTooltipSource) {
const tooltipExtension = hoverTooltip(hoverTooltipSource);
const decorationsExtension = EditorView.decorations.from(
tooltipExtension.active,
(tooltips) => {
const backgroundDecoration = Decoration.mark({
class: "cm-hoverDocsSelection",
});
const decorationRanges = tooltips.map((tooltip) =>
backgroundDecoration.range(tooltip.pos, tooltip.end),
);
return RangeSet.of(decorationRanges, true);
},
);
return [tooltipExtension, decorationsExtension];
}

4
assets/js/hooks/cell_editor/live_editor/codemirror/theme.js vendored
View file

@ -289,6 +289,10 @@ function buildEditorTheme(colors, { dark }) {
},
},
".cm-hoverDocsSelection": {
backgroundColor: colors.selectionMatchBackground,
},
// Signature
".cm-tooltip.cm-signatureHint": {

12
assets/package-lock.json generated
View file

@ -1970,9 +1970,9 @@
"integrity": "sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A=="
},
"node_modules/@codemirror/view": {
"version": "6.27.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.27.0.tgz",
"integrity": "sha512-8kqX1sHbVW1lVzWwrjAbh4dR7eKhV8eIQ952JKaBXOoXE04WncoqCy4DMU701LSrPZ3N2Q4zsTawz7GQ+2mrUw==",
"version": "6.32.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.32.0.tgz",
"integrity": "sha512-AgVNvED2QTsZp5e3syoHLsrWtwJFYWdx1Vr/m3f4h1ATQz0ax60CfXF3Htdmk69k2MlYZw8gXesnQdHtzyVmAw==",
"dependencies": {
"@codemirror/state": "^6.4.0",
"style-mod": "^4.1.0",
@ -16265,9 +16265,9 @@
"integrity": "sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A=="
},
"@codemirror/view": {
"version": "6.27.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.27.0.tgz",
"integrity": "sha512-8kqX1sHbVW1lVzWwrjAbh4dR7eKhV8eIQ952JKaBXOoXE04WncoqCy4DMU701LSrPZ3N2Q4zsTawz7GQ+2mrUw==",
"version": "6.32.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.32.0.tgz",
"integrity": "sha512-AgVNvED2QTsZp5e3syoHLsrWtwJFYWdx1Vr/m3f4h1ATQz0ax60CfXF3Htdmk69k2MlYZw8gXesnQdHtzyVmAw==",
"requires": {
"@codemirror/state": "^6.4.0",
"style-mod": "^4.1.0",