diff --git a/src/components/modules/api/tooltip.ts b/src/components/modules/api/tooltip.ts index 3b2b5ba15..0877a5b0e 100644 --- a/src/components/modules/api/tooltip.ts +++ b/src/components/modules/api/tooltip.ts @@ -46,14 +46,14 @@ export default class TooltipAPI extends Module { * @param {TooltipOptions} options - tooltip options */ public show(element: HTMLElement, content: TooltipContent, options?: TooltipOptions): void { - tooltip.show(element, content, options); + tooltip.show(element, content, options, this.config); } /** * Method hides tooltip on HTML page */ public hide(): void { - tooltip.hide(); + tooltip.hide(false, this.config); } /** @@ -64,6 +64,6 @@ export default class TooltipAPI extends Module { * @param {TooltipOptions} options - tooltip options */ public onHover(element: HTMLElement, content: TooltipContent, options?: TooltipOptions): void { - tooltip.onHover(element, content, options); + tooltip.onHover(element, content, options, this.config); } } diff --git a/src/components/modules/toolbar/index.ts b/src/components/modules/toolbar/index.ts index 575a87865..0c7b7540e 100644 --- a/src/components/modules/toolbar/index.ts +++ b/src/components/modules/toolbar/index.ts @@ -397,7 +397,7 @@ export default class Toolbar extends Module { tooltip.onHover(this.nodes.plusButton, tooltipContent, { hidingDelay: 400, - }); + }, this.config); /** * Fill Actions Zone: @@ -416,7 +416,8 @@ export default class Toolbar extends Module { I18n.ui(I18nInternalNS.ui.blockTunes.toggler, 'Click to tune'), { hidingDelay: 400, - } + }, + this.config ); /** diff --git a/src/components/modules/toolbar/inline.ts b/src/components/modules/toolbar/inline.ts index 03294ed84..357d71fbf 100644 --- a/src/components/modules/toolbar/inline.ts +++ b/src/components/modules/toolbar/inline.ts @@ -477,7 +477,7 @@ export default class InlineToolbar extends Module { tooltip.onHover(this.nodes.conversionToggler, I18n.ui(I18nInternalNS.ui.inlineToolbar.converter, 'Convert to'), { placement: 'top', hidingDelay: 100, - }); + }, this.config); } } @@ -606,7 +606,7 @@ export default class InlineToolbar extends Module { tooltip.onHover(button, tooltipContent, { placement: 'top', hidingDelay: 100, - }); + }, this.config); } instance.checkState(SelectionUtils.get()); diff --git a/src/components/utils/tooltip.ts b/src/components/utils/tooltip.ts index 95789bdac..cf2ba6370 100644 --- a/src/components/utils/tooltip.ts +++ b/src/components/utils/tooltip.ts @@ -4,6 +4,7 @@ */ import CodeXTooltips from 'codex-tooltip'; import type { TooltipOptions, TooltipContent } from 'codex-tooltip/types'; +import { EditorConfig } from '../../../types'; /** * Tooltips lib: CodeX Tooltips @@ -16,13 +17,15 @@ let lib: null | CodeXTooltips = null; * If library is needed, but it is not initialized yet, this function will initialize it * * For example, if editor was destroyed and then initialized again + * + * @param {string} nonce - The nonce to apply to the injected styles. */ -function prepare(): void { +export function prepare(nonce?: string): void { if (lib) { return; } - lib = new CodeXTooltips(); + lib = new CodeXTooltips(nonce); } /** @@ -31,9 +34,10 @@ function prepare(): void { * @param {HTMLElement} element - any HTML element in DOM * @param content - tooltip's content * @param options - showing settings + * @param {EditorConfig} config - The EditorJS config */ -export function show(element: HTMLElement, content: TooltipContent, options?: TooltipOptions): void { - prepare(); +export function show(element: HTMLElement, content: TooltipContent, options?: TooltipOptions, config?: EditorConfig): void { + prepare(config?.style.nonce); lib?.show(element, content, options); } @@ -42,9 +46,10 @@ export function show(element: HTMLElement, content: TooltipContent, options?: To * Hides tooltip * * @param skipHidingDelay — pass true to immediately hide the tooltip + * @param {EditorConfig} config - The EditorJS config */ -export function hide(skipHidingDelay = false): void { - prepare(); +export function hide(skipHidingDelay = false, config?: EditorConfig): void { + prepare(config?.style.nonce); lib?.hide(skipHidingDelay); } @@ -55,9 +60,10 @@ export function hide(skipHidingDelay = false): void { * @param {HTMLElement} element - any HTML element in DOM * @param content - tooltip's content * @param options - showing settings + * @param {EditorConfig} config - The EditorJS config */ -export function onHover(element: HTMLElement, content: TooltipContent, options?: TooltipOptions): void { - prepare(); +export function onHover(element: HTMLElement, content: TooltipContent, options?: TooltipOptions, config?: EditorConfig): void { + prepare(config?.style.nonce); lib?.onHover(element, content, options); }