re #119776.
This commit is contained in:
parent
ad5970666d
commit
d0c212ce1e
4 changed files with 64 additions and 5 deletions
|
@ -345,9 +345,27 @@
|
|||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part .cell-collapse-preview {
|
||||
padding: 0px 8px;
|
||||
}
|
||||
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part .cell-collapse-preview .monaco-tokenized-source {
|
||||
font-size: var(--notebook-cell-input-preview-font-size);
|
||||
font-family: var(--notebook-cell-input-preview-font-family);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part .cell-collapse-preview .monaco-tokenized-source:after {
|
||||
color: grey;
|
||||
margin: 0.1em 0.2em 0 0.2em;
|
||||
content: "⋯";
|
||||
display: inline;
|
||||
line-height: 1em;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part .codicon {
|
||||
position: absolute;
|
||||
padding: 2px 6px;
|
||||
padding: 4px 6px;
|
||||
left: -30px;
|
||||
bottom: 0;
|
||||
cursor: pointer;
|
||||
|
|
|
@ -588,10 +588,13 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
|
|||
const { bottomToolbarGap, bottomToolbarHeight } = this._notebookOptions.computeBottomToolbarDimensions(this.viewModel?.viewType);
|
||||
|
||||
const styleSheets: string[] = [];
|
||||
const fontFamily = this._fontInfo?.fontFamily ?? `"SF Mono", Monaco, Menlo, Consolas, "Ubuntu Mono", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace`;
|
||||
|
||||
styleSheets.push(`
|
||||
:root {
|
||||
--notebook-cell-output-font-size: ${fontSize}px;
|
||||
--notebook-cell-input-preview-font-size: ${fontSize}px;
|
||||
--notebook-cell-input-preview-font-family: ${fontFamily};
|
||||
}
|
||||
`);
|
||||
|
||||
|
@ -771,7 +774,12 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
|
|||
styleSheets.push(`.notebookOverlay .monaco-list .monaco-list-row .cell-focus-indicator-bottom { height: ${cellBottomMargin}px; }`);
|
||||
styleSheets.push(`.notebookOverlay .monaco-list .monaco-list-row .cell-shadow-container-bottom { top: ${cellBottomMargin}px; }`);
|
||||
|
||||
styleSheets.push(`.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part { margin-left: ${codeCellLeftMargin + cellRunGutter}px; height: ${collapsedIndicatorHeight}px; }`);
|
||||
styleSheets.push(`
|
||||
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part { margin-left: ${codeCellLeftMargin + cellRunGutter}px; height: ${collapsedIndicatorHeight}px; }
|
||||
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-collapsed-part .cell-collapse-preview {
|
||||
line-height: ${collapsedIndicatorHeight}px;
|
||||
}
|
||||
`);
|
||||
|
||||
styleSheets.push(`.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-bottom-toolbar-container { height: ${bottomToolbarHeight}px }`);
|
||||
styleSheets.push(`.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .cell-list-top-cell-toolbar-container { height: ${bottomToolbarHeight}px }`);
|
||||
|
|
|
@ -8,6 +8,9 @@ import { raceCancellation } from 'vs/base/common/async';
|
|||
import { CancellationTokenSource } from 'vs/base/common/cancellation';
|
||||
import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
|
||||
import { IDimension } from 'vs/editor/common/editorCommon';
|
||||
import { IReadonlyTextBuffer } from 'vs/editor/common/model';
|
||||
import { TokenizationRegistry } from 'vs/editor/common/modes';
|
||||
import { tokenizeToString } from 'vs/editor/common/modes/textToHtmlTokenizer';
|
||||
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
|
||||
import { IOpenerService } from 'vs/platform/opener/common/opener';
|
||||
import { CellFocusMode, CodeCellRenderTemplate, IActiveNotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
|
||||
|
@ -241,6 +244,34 @@ export class CodeCell extends Disposable {
|
|||
return true;
|
||||
}
|
||||
|
||||
private getRichText(buffer: IReadonlyTextBuffer, language: string) {
|
||||
return tokenizeToString(buffer.getLineContent(1), TokenizationRegistry.get(language)!);
|
||||
}
|
||||
|
||||
private removeInputCollapsePreview() {
|
||||
const children = this.templateData.collapsedPart.children;
|
||||
let collapsePreviewElements = [];
|
||||
|
||||
for (let i = 0; i < children.length; i++) {
|
||||
if (children[i].classList.contains('cell-collapse-preview')) {
|
||||
collapsePreviewElements.push(children[i]);
|
||||
}
|
||||
}
|
||||
|
||||
collapsePreviewElements.forEach(element => {
|
||||
element.parentElement?.removeChild(element);
|
||||
});
|
||||
}
|
||||
|
||||
private updateInputCollaseElement(): void {
|
||||
this.removeInputCollapsePreview();
|
||||
const richEditorText = this.getRichText(this.viewCell.textBuffer, this.viewCell.language);
|
||||
const element = DOM.$('div');
|
||||
element.classList.add('cell-collapse-preview');
|
||||
DOM.safeInnerHtml(element, richEditorText);
|
||||
this.templateData.collapsedPart.appendChild(element);
|
||||
}
|
||||
|
||||
private viewUpdateInputCollapsed(): void {
|
||||
DOM.hide(this.templateData.cellContainer);
|
||||
DOM.hide(this.templateData.runButtonContainer);
|
||||
|
@ -248,6 +279,7 @@ export class CodeCell extends Disposable {
|
|||
DOM.show(this.templateData.outputContainer);
|
||||
this.templateData.container.classList.toggle('collapsed', true);
|
||||
this._outputContainerRenderer.viewUpdateShowOutputs();
|
||||
this.updateInputCollaseElement();
|
||||
|
||||
this.relayoutCell();
|
||||
}
|
||||
|
@ -257,9 +289,8 @@ export class CodeCell extends Disposable {
|
|||
DOM.show(this.templateData.runButtonContainer);
|
||||
DOM.show(this.templateData.collapsedPart);
|
||||
DOM.hide(this.templateData.outputContainer);
|
||||
|
||||
this.removeInputCollapsePreview();
|
||||
this._outputContainerRenderer.viewUpdateHideOuputs();
|
||||
|
||||
this.templateData.container.classList.toggle('collapsed', false);
|
||||
this.templateData.container.classList.toggle('output-collapsed', true);
|
||||
|
||||
|
@ -274,6 +305,7 @@ export class CodeCell extends Disposable {
|
|||
this.templateData.container.classList.toggle('collapsed', true);
|
||||
this.templateData.container.classList.toggle('output-collapsed', true);
|
||||
this._outputContainerRenderer.viewUpdateHideOuputs();
|
||||
this.updateInputCollaseElement();
|
||||
this.relayoutCell();
|
||||
}
|
||||
|
||||
|
@ -281,6 +313,7 @@ export class CodeCell extends Disposable {
|
|||
DOM.show(this.templateData.cellContainer);
|
||||
DOM.show(this.templateData.runButtonContainer);
|
||||
DOM.hide(this.templateData.collapsedPart);
|
||||
this.removeInputCollapsePreview();
|
||||
DOM.show(this.templateData.outputContainer);
|
||||
this.templateData.container.classList.toggle('collapsed', false);
|
||||
this.templateData.container.classList.toggle('output-collapsed', false);
|
||||
|
|
|
@ -138,7 +138,7 @@ export class NotebookOptions {
|
|||
editorTopPadding: EDITOR_TOP_PADDING,
|
||||
editorBottomPadding: 4,
|
||||
editorBottomPaddingWithoutStatusBar: 12,
|
||||
collapsedIndicatorHeight: 24,
|
||||
collapsedIndicatorHeight: 28,
|
||||
showCellStatusBar,
|
||||
globalToolbar,
|
||||
consolidatedOutputButton,
|
||||
|
|
Loading…
Reference in a new issue