overleaf/services/web/frontend/js/features/source-editor/extensions/font-load.ts
Alf Eaton e025088065 Merge pull request #13241 from overleaf/ae-extensions-documentation
Add documentation for CodeMirror extensions

GitOrigin-RevId: e5f07084173f201919272f9d46dcdaef4b817874
2023-07-17 10:28:53 +00:00

33 lines
1.1 KiB
TypeScript

import { ViewPlugin } from '@codemirror/view'
import { StateEffect } from '@codemirror/state'
import { updateHasEffect } from '../utils/effects'
const fontLoadEffect = StateEffect.define<readonly FontFace[]>()
export const hasFontLoadedEffect = updateHasEffect(fontLoadEffect)
/**
* A custom extension that listens for an event indicating that fonts have finished loading,
* then dispatches an effect which other extensions can use to recalculate values.
*/
export const fontLoad = ViewPlugin.define(view => {
function listener(this: FontFaceSet, event: FontFaceSetLoadEvent) {
view.dispatch({ effects: fontLoadEffect.of(event.fontfaces) })
}
const fontLoadSupport = 'fonts' in document
if (fontLoadSupport) {
// TypeScript doesn't appear to know the correct type for the listener
document.fonts.addEventListener('loadingdone', listener as EventListener)
}
return {
destroy() {
if (fontLoadSupport) {
document.fonts.removeEventListener(
'loadingdone',
listener as EventListener
)
}
},
}
})