Skip to content

Commit fbfcca5

Browse files
SamyPesseSamyPesse
authored
Fix rendering of font in ogimage (#3299)
1 parent 664ae8b commit fbfcca5

24 files changed

+624
-72
lines changed

‎.changeset/poor-dodos-lick.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@gitbook/fonts": minor
3+
---
4+
5+
Initial version of the package

‎.changeset/warm-roses-sleep.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"gitbook": patch
3+
---
4+
5+
Fix ogimage using incorrect Google Font depending on language.

‎bun.lock

Lines changed: 91 additions & 7 deletions
Large diffs are not rendered by default.

‎package.json

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,9 @@
77
"turbo": "^2.5.0",
88
"vercel": "^39.3.0"
99
},
10-
"packageManager": "[email protected].11",
10+
"packageManager": "[email protected].15",
1111
"overrides": {
1212
"@codemirror/state": "6.4.1",
13-
"@gitbook/api": "^0.120.0",
1413
"react": "^19.0.0",
1514
"react-dom": "^19.0.0"
1615
},
@@ -34,7 +33,12 @@
3433
"download:env": "op read op://gitbook-x-dev/gitbook-open/.env.local >> .env.local",
3534
"clean": "turbo run clean"
3635
},
37-
"workspaces": ["packages/*"],
36+
"workspaces": {
37+
"packages": ["packages/*"],
38+
"catalog": {
39+
"@gitbook/api": "^0.120.0"
40+
}
41+
},
3842
"patchedDependencies": {
3943
"[email protected]": "patches/[email protected]",
4044
"@vercel/[email protected]": "patches/@vercel%[email protected]"

‎packages/cache-tags/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
},
1111
"version": "0.3.1",
1212
"dependencies": {
13-
"@gitbook/api": "^0.120.0",
13+
"@gitbook/api": "catalog:",
1414
"assert-never": "^1.2.1"
1515
},
1616
"devDependencies": {

‎packages/fonts/.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
dist/
2+
src/data/*.json

‎packages/fonts/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# `@gitbook/fonts`
2+
3+
Utilities to lookup default fonts supported by GitBook.

‎packages/fonts/bin/generate.ts

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import fs from 'node:fs/promises';
2+
import path from 'node:path';
3+
4+
import { APIv2 } from 'google-font-metadata';
5+
6+
import { CustomizationDefaultFont } from '@gitbook/api';
7+
8+
import type { FontDefinitions } from '../src/types';
9+
10+
const googleFontsMap: { [fontName in CustomizationDefaultFont]: string } = {
11+
[CustomizationDefaultFont.Inter]: 'inter',
12+
[CustomizationDefaultFont.FiraSans]: 'fira-sans-extra-condensed',
13+
[CustomizationDefaultFont.IBMPlexSerif]: 'ibm-plex-serif',
14+
[CustomizationDefaultFont.Lato]: 'lato',
15+
[CustomizationDefaultFont.Merriweather]: 'merriweather',
16+
[CustomizationDefaultFont.NotoSans]: 'noto-sans',
17+
[CustomizationDefaultFont.OpenSans]: 'open-sans',
18+
[CustomizationDefaultFont.Overpass]: 'overpass',
19+
[CustomizationDefaultFont.Poppins]: 'poppins',
20+
[CustomizationDefaultFont.Raleway]: 'raleway',
21+
[CustomizationDefaultFont.Roboto]: 'roboto',
22+
[CustomizationDefaultFont.RobotoSlab]: 'roboto-slab',
23+
[CustomizationDefaultFont.SourceSansPro]: 'source-sans-3',
24+
[CustomizationDefaultFont.Ubuntu]: 'ubuntu',
25+
[CustomizationDefaultFont.ABCFavorit]: 'inter',
26+
};
27+
28+
/**
29+
* Scripts to generate the list of all icons.
30+
*/
31+
async function main() {
32+
// @ts-expect-error - we build the object
33+
const output: FontDefinitions = {};
34+
35+
for (const font of Object.values(CustomizationDefaultFont)) {
36+
const googleFontName = googleFontsMap[font];
37+
const fontMetadata = APIv2[googleFontName.toLowerCase()];
38+
if (!fontMetadata) {
39+
throw new Error(`Font ${googleFontName} not found`);
40+
}
41+
42+
output[font] = {
43+
font: googleFontName,
44+
unicodeRange: fontMetadata.unicodeRange,
45+
variants: {
46+
'400': {},
47+
'700': {},
48+
},
49+
};
50+
51+
Object.keys(output[font].variants).forEach((weight) => {
52+
const variants = fontMetadata.variants[weight];
53+
const normalVariant = variants.normal;
54+
if (!normalVariant) {
55+
throw new Error(`Font ${googleFontName} has no normal variant`);
56+
}
57+
58+
output[font].variants[weight] = {};
59+
Object.entries(normalVariant).forEach(([script, url]) => {
60+
output[font].variants[weight][script] = url.url.woff;
61+
});
62+
});
63+
}
64+
65+
await writeDataFile('fonts', JSON.stringify(output, null, 2));
66+
}
67+
68+
/**
69+
* We write both in dist and src as the build process might have happen already
70+
* and tsc doesn't copy the files.
71+
*/
72+
async function writeDataFile(name, content) {
73+
const srcData = path.resolve(__dirname, '../src/data');
74+
const distData = path.resolve(__dirname, '../dist/data');
75+
76+
// Ensure the directories exists
77+
await Promise.all([
78+
fs.mkdir(srcData, { recursive: true }),
79+
fs.mkdir(distData, { recursive: true }),
80+
]);
81+
82+
await Promise.all([
83+
fs.writeFile(path.resolve(srcData, `${name}.json`), content),
84+
fs.writeFile(path.resolve(distData, `${name}.json`), content),
85+
]);
86+
}
87+
88+
main().catch((error) => {
89+
console.error(`Error generating icons list: ${error}`);
90+
process.exit(1);
91+
});

‎packages/fonts/package.json

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "@gitbook/fonts",
3+
"type": "module",
4+
"exports": {
5+
".": {
6+
"types": "./dist/index.d.ts",
7+
"development": "./src/index.ts",
8+
"default": "./dist/index.js"
9+
}
10+
},
11+
"version": "0.0.0",
12+
"dependencies": {
13+
"@gitbook/api": "catalog:"
14+
},
15+
"devDependencies": {
16+
"google-font-metadata": "^6.0.3",
17+
"typescript": "^5.5.3"
18+
},
19+
"scripts": {
20+
"generate": "bun ./bin/generate.js",
21+
"build": "tsc --project tsconfig.build.json",
22+
"typecheck": "tsc --noEmit",
23+
"dev": "tsc -w",
24+
"clean": "rm -rf ./dist && rm -rf ./src/data",
25+
"unit": "bun test"
26+
},
27+
"files": ["dist", "src", "bin", "README.md", "CHANGELOG.md"],
28+
"engines": {
29+
"node": ">=20.0.0"
30+
}
31+
}

‎packages/fonts/src/__snapshots__/getDefaultFont.test.ts.snap

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
// Bun Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`getDefaultFont should return correct object for Latin text 1`] = `
4+
{
5+
"font": "Inter",
6+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hjp-Ek-_0ew.woff",
7+
}
8+
`;
9+
10+
exports[`getDefaultFont should return correct object for Cyrillic text 1`] = `
11+
{
12+
"font": "Inter",
13+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZthjp-Ek-_0ewmM.woff",
14+
}
15+
`;
16+
17+
exports[`getDefaultFont should return correct object for Greek text 1`] = `
18+
{
19+
"font": "Inter",
20+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZxhjp-Ek-_0ewmM.woff",
21+
}
22+
`;
23+
24+
exports[`getDefaultFont should handle mixed script text 1`] = `
25+
{
26+
"font": "Inter",
27+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZthjp-Ek-_0ewmM.woff",
28+
}
29+
`;
30+
31+
exports[`getDefaultFont should handle different font weights: regular 1`] = `
32+
{
33+
"font": "Inter",
34+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hjp-Ek-_0ew.woff",
35+
}
36+
`;
37+
38+
exports[`getDefaultFont should handle different font weights: bold 1`] = `
39+
{
40+
"font": "Inter",
41+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYAZ9hjp-Ek-_0ew.woff",
42+
}
43+
`;
44+
45+
exports[`getDefaultFont should handle different fonts: inter 1`] = `
46+
{
47+
"font": "Inter",
48+
"url": "https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hjp-Ek-_0ew.woff",
49+
}
50+
`;
51+
52+
exports[`getDefaultFont should handle different fonts: roboto 1`] = `
53+
{
54+
"font": "Roboto",
55+
"url": "https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu4mxMKTU1Kg.woff",
56+
}
57+
`;

0 commit comments

Comments
 (0)