Connection error box style fix (#14469)

* Modified modal styles, limiting height of basic modal to 480px.

* wip - added new attachCalloutDialogStyler. Moved callout-specific styler code out of modal.ts

* Moved attach styler code to workbench/common. Added custom styles to imageCalloutDialog

* Moved styler code into calloutDialog. Added callout-specific theme colors to colorRegistry. Removed color styles from modal and callout stylesheets.

* Added CalloutDialogModal that extends CalloutDialog so that the callout can be instantiated from core. Revised calloutDialog so the position cn be passed in from where it is instantiated.

* Revised refactor of modal and image/link callouts so that callout dialog invoked by core can also use the styler. Removed unused properties from dialog code.

* Added conditional to dialogModal to use correct styler for callouts.

* Cleaned up styles. Modified custom colors.

* Wrapped call to positionCalloutDialog in conditional.

* Style, colors, styler and modal updates to align callout with latest OPAC toolkit styles.

* Moved calloutDialog stylesheet

* Consolidated styler code and added a flexible custom styler to provide values for dialogModal

* Added image callout code.

* Remove image callout dialog until wired fully

* Test fixes

Co-authored-by: chlafreniere <hichise@gmail.com>
This commit is contained in:
Hale Rankin
2021-03-05 17:34:02 -08:00
committed by GitHub
parent 0ef99ab42a
commit 972b649beb
11 changed files with 235 additions and 166 deletions

View File

@@ -220,11 +220,12 @@ export class MarkdownToolbarComponent extends AngularDisposable {
DOM.EventHelper.stop(event, true);
let triggerElement = event.target as HTMLElement;
let needsTransform = true;
let calloutResult: ILinkCalloutDialogOptions;
let linkCalloutResult: ILinkCalloutDialogOptions;
if (type === MarkdownButtonType.LINK_PREVIEW) {
calloutResult = await this.createCallout(type, triggerElement);
linkCalloutResult = await this.createCallout(type, triggerElement);
// If no URL is present, no-op
if (!calloutResult.insertUnescapedLinkUrl) {
if (!linkCalloutResult.insertUnescapedLinkUrl) {
return;
}
// If cell edit mode isn't WYSIWYG, use result from callout. No need for further transformation.
@@ -234,15 +235,18 @@ export class MarkdownToolbarComponent extends AngularDisposable {
// Otherwise, re-focus on the output element, and insert the link directly.
this.output?.nativeElement?.focus();
// Callout is responsible for returning escaped strings
document.execCommand('insertHTML', false, `<a href="${calloutResult?.insertUnescapedLinkUrl}">${calloutResult?.insertUnescapedLinkLabel}</a>`);
document.execCommand('insertHTML', false, `<a href="${linkCalloutResult?.insertUnescapedLinkUrl}">${linkCalloutResult?.insertUnescapedLinkLabel}</a>`);
return;
}
}
const transformer = new MarkdownTextTransformer(this._notebookService, this.cellModel);
if (needsTransform) {
await transformer.transformText(type);
} else if (!needsTransform) {
await insertFormattedMarkdown(calloutResult?.insertEscapedMarkdown, this.getCellEditorControl());
if (type === MarkdownButtonType.LINK_PREVIEW) {
await insertFormattedMarkdown(linkCalloutResult?.insertEscapedMarkdown, this.getCellEditorControl());
}
}
}
@@ -283,7 +287,7 @@ export class MarkdownToolbarComponent extends AngularDisposable {
if (type === MarkdownButtonType.LINK_PREVIEW) {
const defaultLabel = this.getCurrentSelectionText();
this._linkCallout = this._instantiationService.createInstance(LinkCalloutDialog, this.insertLinkHeading, dialogProperties, dialogPosition, defaultLabel);
this._linkCallout = this._instantiationService.createInstance(LinkCalloutDialog, this.insertLinkHeading, dialogPosition, dialogProperties, defaultLabel);
this._linkCallout.render();
calloutOptions = await this._linkCallout.open();
}