diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..e32b512 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,18 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:3000", + "webRoot": "${workspaceFolder}/packages/fontpicker/src", + "sourceMapPathOverrides": { + "webpack:///./packages/fontpicker/src/*": "${workspaceFolder}/packages/fontpicker/src/*" + } + } + ] +} \ No newline at end of file diff --git a/packages/fontpicker/src/components/FontPicker.tsx b/packages/fontpicker/src/components/FontPicker.tsx index 388e1fd..bb2474a 100644 --- a/packages/fontpicker/src/components/FontPicker.tsx +++ b/packages/fontpicker/src/components/FontPicker.tsx @@ -384,15 +384,16 @@ export default function FontPicker({ // selectedFont should be undefined IFF fontCategories is changed and the currently // selectedFont is not in the new category. if (selectedFont) { - const fontElement = popout.querySelector('.font-preview-' + selectedFont.sane) as HTMLElement - if (fontElement && fontElement instanceof HTMLElement) { - const fontTop = fontElement.offsetTop - const fontBottom = fontTop + fontElement.offsetHeight + const fontPreviewElement = popout.querySelector('.font-preview-' + selectedFont.sane) as HTMLElement + const fontOptionElement = fontPreviewElement?.parentElement + if (fontOptionElement && fontOptionElement instanceof HTMLElement) { + const fontTop = fontOptionElement.offsetTop + const fontBottom = fontTop + fontOptionElement.offsetHeight const popTop = popout.scrollTop const popBottom = popTop + popout.clientHeight if (why === 'opening' || fontTop <= popTop) { popout.scrollTop = fontTop - fontElement.parentElement?.classList.add('selected') + fontOptionElement.classList.add('selected') const optionRef = getOptionsRef()?.get(selectedFont.sane) optionRef?.classList.add('selected') } else if (fontBottom >= popBottom) {