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

Merge branch 'main' into mininotation-randomness-docs

Browse source
This commit is contained in:
james-collapse 2025-09-03 20:19:54 +02:00
commit 3e0e903d38
2 changed files with 21 additions and 11 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 }) => export const Autocomplete = ({ doc, label }) =>
h` h`
<div class="autocomplete-info-tooltip"> <div class="autocomplete-info-container">
<h3 class="autocomplete-info-function-name">${label || getDocLabel(doc)}</h3> <div class="autocomplete-info-tooltip">
${doc.description ? `<p class="autocomplete-info-function-description">${doc.description}</p>` : ''} <h3 class="autocomplete-info-function-name">${label || getDocLabel(doc)}</h3>
${buildParamsList(doc.params)} ${doc.description ? `<div class="autocomplete-info-function-description">${doc.description}</div>` : ''}
${buildExamples(doc.examples)} ${buildParamsList(doc.params)}
${buildExamples(doc.examples)}
</div>
</div> </div>
`[0]; `[0];
@ -98,4 +100,4 @@ export const strudelAutocomplete = (context) => {
}; };
export const isAutoCompletionEnabled = (enabled) => export const isAutoCompletionEnabled = (enabled) =>
enabled ? [autocompletion({ override: [strudelAutocomplete] })] : []; enabled ? [autocompletion({ override: [strudelAutocomplete], closeOnBlur: false })] : [];

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

@ -72,21 +72,19 @@
/* Override default styles from the codemirror inline css for autocomplete info tooltip*/ /* Override default styles from the codemirror inline css for autocomplete info tooltip*/
.cm-tooltip.cm-completionInfo { .cm-tooltip.cm-completionInfo {
padding: 12px !important; padding: 0 !important;
padding-bottom: 12px !important;
border: 1px solid var(--foreground) !important; border: 1px solid var(--foreground) !important;
border-radius: 4px !important; border-radius: 4px !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
max-width: 500px !important; max-width: 500px !important;
min-width: 300px !important; min-width: 300px !important;
max-height: 400px !important; max-height: 400px !important;
white-space: normal !important;
overflow: auto !important;
background-color: var(--lineHighlight) !important; background-color: var(--lineHighlight) !important;
} }
/* Main tooltip container */ /* Main tooltip container */
.autocomplete-info-tooltip { .autocomplete-info-container {
padding: 12px !important;
border-radius: 4px !important; border-radius: 4px !important;
color: var(--foreground); color: var(--foreground);
font-family: var(--font-family, 'SF Mono', 'Monaco', monospace); font-family: var(--font-family, 'SF Mono', 'Monaco', monospace);
@ -95,6 +93,16 @@
max-width: 600px; max-width: 600px;
max-height: 400px; max-height: 400px;
min-width: 400px; min-width: 400px;
white-space: normal !important;
overflow-y: auto !important;
}
.autocomplete-info-tooltip {
overflow-y: auto !important;
}
.autocomplete-info-function-description {
white-space: pre-wrap !important;
} }
.autocomplete-info-function-name { .autocomplete-info-function-name {