hacklab/strudel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use white-space instead; fix scrolling; don't close autocomplete tooltips on click

Browse source
This commit is contained in:
Aria 2025-08-26 14:14:00 -05:00
parent 877bc95a58
commit a5886bb9d4
2 changed files with 17 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

14
packages/codemirror/autocomplete.mjs
View file

@ -56,11 +56,13 @@ const buildExamples = (examples) =>
export const Autocomplete = ({ doc, label }) =>
h`
<div class="autocomplete-info-tooltip">
<h3 class="autocomplete-info-function-name">${label || getDocLabel(doc)}</h3>
${doc.description ? `<div class="autocomplete-info-function-description">${doc.description}</div>` : ''}
${buildParamsList(doc.params)}
${buildExamples(doc.examples)}
<div class="autocomplete-info-container">
<div class="autocomplete-info-tooltip">
<h3 class="autocomplete-info-function-name">${label || getDocLabel(doc)}</h3>
${doc.description ? `<div class="autocomplete-info-function-description">${doc.description}</div>` : ''}
${buildParamsList(doc.params)}
${buildExamples(doc.examples)}
</div>
</div>
`[0];
@ -98,4 +100,4 @@ export const strudelAutocomplete = (context) => {
};
export const isAutoCompletionEnabled = (enabled) =>
enabled ? [autocompletion({ override: [strudelAutocomplete] })] : [];
enabled ? [autocompletion({ override: [strudelAutocomplete], closeOnBlur: false })] : [];

15
website/src/repl/Repl.css
View file

@ -79,15 +79,12 @@
max-width: 500px !important;
min-width: 300px !important;
max-height: 400px !important;
white-space: normal !important;
overflow: auto !important;
background-color: var(--lineHighlight) !important;
}
/* Main tooltip container */
.autocomplete-info-tooltip {
.autocomplete-info-container {
padding: 12px !important;
padding-bottom: 12px !important;
border-radius: 4px !important;
color: var(--foreground);
font-family: var(--font-family, 'SF Mono', 'Monaco', monospace);
@ -96,10 +93,16 @@
max-width: 600px;
max-height: 400px;
min-width: 400px;
white-space: normal !important;
overflow-y: auto !important;
}
.autocomplete-info-function-description p {
margin-bottom: 1em;
.autocomplete-info-tooltip {
overflow-y: auto !important;
}
.autocomplete-info-function-description {
white-space: pre-wrap !important;
}
.autocomplete-info-function-name {