smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: add generic serif fallback before Segoe UI Emoji to fix glyph rendering issue #9351

Browse source
This commit is contained in:
Sachintha Lakmin 2025-04-21 23:40:52 +05:30
parent debf2ad608
commit 48dc8e9367
No known key found for this signature in database
GPG key ID: 6A88A1FE5C8627D0
2 changed files with 21 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

10
packages/common/src/constants.ts
View file

@ -124,6 +124,8 @@ export const CLASSES = {
export const CJK_HAND_DRAWN_FALLBACK_FONT = "Xiaolai";
export const WINDOWS_EMOJI_FALLBACK_FONT = "Segoe UI Emoji";
export const SERIF_FONT_FAMILY = "serif";
/**
* // TODO: shouldn't be really `const`, likely neither have integers as values, due to value for the custom fonts, which should likely be some hash.
*
@ -144,6 +146,14 @@ export const FONT_FAMILY = {
"Liberation Sans": 9,
};
// Fonts to use as fallback before FONT_FAMILY_FALLBACKS
// FONT_FAMILY_FALLBACKS's Segoe UI Emoji fails to properly fallback
// for some glyphs: ∞, ∫, ≠
// so we need to have generic font fallback before it
export const GENERIC_FONT_FAMILIES = [SERIF_FONT_FAMILY];
export const getGenericFontsForFallbacks: () => string[] = () =>
GENERIC_FONT_FAMILIES;
export const FONT_FAMILY_FALLBACKS = {
[CJK_HAND_DRAWN_FALLBACK_FONT]: 100,
[WINDOWS_EMOJI_FALLBACK_FONT]: 1000,

10
packages/common/src/utils.ts
View file

@ -23,6 +23,7 @@ import {
getFontFamilyFallbacks,
isDarwin,
WINDOWS_EMOJI_FALLBACK_FONT,
getGenericFontsForFallbacks,
} from "./constants";
import type { MaybePromise, ResolutionType } from "./utility-types";
@ -102,7 +103,14 @@ export const getFontFamilyString = ({
for (const [fontFamilyString, id] of Object.entries(FONT_FAMILY)) {
if (id === fontFamily) {
// TODO: we should fallback first to generic family names first
return `${fontFamilyString}${getFontFamilyFallbacks(id)
// Fallback to generic family names first, then to specific font family names
// currently only serif is added as a generic font family
return `${fontFamilyString}
${getGenericFontsForFallbacks()
.map((x) => `, ${x}`)
.join("")}
${getFontFamilyFallbacks(fontFamily)
.map((x) => `, ${x}`)
.join("")}`;
}