{"version":3,"file":"bubble.js","names":["merge","Emitter","BaseTheme","BaseTooltip","Range","icons","Quill","TOOLBAR_CONFIG","header","BubbleTooltip","TEMPLATE","join","constructor","quill","bounds","on","events","EDITOR_CHANGE","type","range","oldRange","source","SELECTION_CHANGE","length","sources","USER","show","root","style","left","width","offsetWidth","lines","getLines","index","getBounds","position","lastLine","getIndex","Math","min","indexBounds","document","activeElement","textbox","hasFocus","hide","listen","querySelector","addEventListener","classList","remove","SCROLL_OPTIMIZE","setTimeout","contains","getSelection","cancel","reference","shift","arrow","marginLeft","BubbleTheme","options","modules","toolbar","container","add","extendToolbar","tooltip","appendChild","buildButtons","querySelectorAll","buildPickers","DEFAULTS","handlers","link","value","format","theme","edit","default"],"sources":["../../src/themes/bubble.ts"],"sourcesContent":["import { merge } from 'lodash-es';\nimport Emitter from '../core/emitter.js';\nimport BaseTheme, { BaseTooltip } from './base.js';\nimport { Range } from '../core/selection.js';\nimport type { Bounds } from '../core/selection.js';\nimport icons from '../ui/icons.js';\nimport Quill from '../core/quill.js';\nimport type { ThemeOptions } from '../core/theme.js';\nimport type Toolbar from '../modules/toolbar.js';\nimport type { ToolbarConfig } from '../modules/toolbar.js';\n\nconst TOOLBAR_CONFIG: ToolbarConfig = [\n ['bold', 'italic', 'link'],\n [{ header: 1 }, { header: 2 }, 'blockquote'],\n];\n\nclass BubbleTooltip extends BaseTooltip {\n static TEMPLATE = [\n '',\n '
',\n ].join('');\n\n constructor(quill: Quill, bounds?: HTMLElement) {\n super(quill, bounds);\n this.quill.on(\n Emitter.events.EDITOR_CHANGE,\n (type, range, oldRange, source) => {\n if (type !== Emitter.events.SELECTION_CHANGE) return;\n if (\n range != null &&\n range.length > 0 &&\n source === Emitter.sources.USER\n ) {\n this.show();\n // Lock our width so we will expand beyond our offsetParent boundaries\n this.root.style.left = '0px';\n this.root.style.width = '';\n this.root.style.width = `${this.root.offsetWidth}px`;\n const lines = this.quill.getLines(range.index, range.length);\n if (lines.length === 1) {\n const bounds = this.quill.getBounds(range);\n if (bounds != null) {\n this.position(bounds);\n }\n } else {\n const lastLine = lines[lines.length - 1];\n const index = this.quill.getIndex(lastLine);\n const length = Math.min(\n lastLine.length() - 1,\n range.index + range.length - index,\n );\n const indexBounds = this.quill.getBounds(new Range(index, length));\n if (indexBounds != null) {\n this.position(indexBounds);\n }\n }\n } else if (\n document.activeElement !== this.textbox &&\n this.quill.hasFocus()\n ) {\n this.hide();\n }\n },\n );\n }\n\n listen() {\n super.listen();\n // @ts-expect-error Fix me later\n this.root.querySelector('.ql-close').addEventListener('click', () => {\n this.root.classList.remove('ql-editing');\n });\n this.quill.on(Emitter.events.SCROLL_OPTIMIZE, () => {\n // Let selection be restored by toolbar handlers before repositioning\n setTimeout(() => {\n if (this.root.classList.contains('ql-hidden')) return;\n const range = this.quill.getSelection();\n if (range != null) {\n const bounds = this.quill.getBounds(range);\n if (bounds != null) {\n this.position(bounds);\n }\n }\n }, 1);\n });\n }\n\n cancel() {\n this.show();\n }\n\n position(reference: Bounds) {\n const shift = super.position(reference);\n const arrow = this.root.querySelector('.ql-tooltip-arrow');\n // @ts-expect-error\n arrow.style.marginLeft = '';\n if (shift !== 0) {\n // @ts-expect-error\n arrow.style.marginLeft = `${-1 * shift - arrow.offsetWidth / 2}px`;\n }\n return shift;\n }\n}\n\nclass BubbleTheme extends BaseTheme {\n tooltip: BubbleTooltip;\n\n constructor(quill: Quill, options: ThemeOptions) {\n if (\n options.modules.toolbar != null &&\n options.modules.toolbar.container == null\n ) {\n options.modules.toolbar.container = TOOLBAR_CONFIG;\n }\n super(quill, options);\n this.quill.container.classList.add('ql-bubble');\n }\n\n extendToolbar(toolbar: Toolbar) {\n // @ts-expect-error\n this.tooltip = new BubbleTooltip(this.quill, this.options.bounds);\n if (toolbar.container != null) {\n this.tooltip.root.appendChild