Replace fontkit with fontkitten (#238)

Author: delucis

.changeset/perfect-islands-type.md

@@ -0,0 +1,5 @@
+---
+"@capsizecss/unpack": patch
+---
+
+Reduces `@capsizecss/unpack` install size by using a lighter weight package for extracting font file metrics

.changeset/silver-buttons-bake.md

@@ -0,0 +1,15 @@
+---
+"@capsizecss/unpack": major
+---
+
+This package is now ESM-only.
+
+In most projects you can continue to use the package as before. CommonJS (CJS) projects using Node.js <20, should update to use a dynamic import:
+
+```js
+// For CJS projects before Node 20
+const { fromBuffer } = await import('@capsizecss/unpack');
+
+// For all other projects
+import { fromBuffer } from '@capsizecss/unpack';
+```

README.md

@@ -401,7 +401,7 @@ See the [package](packages/unpack/README.md) for documentation.
 ## Thanks
 
 - [Vincent De Oliveira](https://twitter.com/iamvdo) for writing [Deep dive CSS: font metrics, line-height and vertical-align](https://iamvdo.me/en/blog/css-font-metrics-line-height-and-vertical-align), which provided the research needed to build all this.
-- [Devon Govett](https://github.com/devongovett) for creating [Fontkit](https://github.com/foliojs/fontkit), which does all the heavy lifting of extracting the font metrics under the covers.
+- [Devon Govett](https://github.com/devongovett) for creating [Fontkit](https://github.com/foliojs/fontkit). A [fork of Fontkit](https://github.com/delucis/fontkitten) does all the heavy lifting of extracting the font metrics under the covers.
 - [SEEK](https://www.seek.com.au) for giving us the space to do interesting work.
 
 ## License

packages/unpack/README.md

@@ -100,7 +100,7 @@ The font metrics object returned contains the following properties:
 
 ## Thanks
 
-- [Devon Govett](https://github.com/devongovett) for creating [Fontkit](https://github.com/foliojs/fontkit), which does all the heavy lifting of extracting the font metrics under the covers.
+- [Devon Govett](https://github.com/devongovett) for creating [Fontkit](https://github.com/foliojs/fontkit). A [fork of Fontkit](https://github.com/delucis/fontkitten) does all the heavy lifting of extracting the font metrics under the covers.
 - [SEEK](https://www.seek.com.au) for giving us the space to do interesting work.
 
 ## License

packages/unpack/package.json

@@ -23,17 +23,16 @@
     "name": "Michael Taranto",
     "homepage": "https://github.com/michaeltaranto"
   },
+  "type": "module",
   "exports": {
     ".": {
       "@capsizecss/src": "./src/index.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
+      "default": "./dist/index.mjs"
     },
     "./package.json": "./package.json"
   },
-  "main": "./dist/index.cjs",
   "module": "./dist/index.mjs",
-  "types": "./dist/index.d.cts",
+  "types": "./dist/index.d.mts",
   "files": [
     "dist"
   ],
@@ -42,10 +41,9 @@
     "generate": "tsx scripts/generate-weightings"
   },
   "dependencies": {
-    "fontkit": "^2.0.2"
+    "fontkitten": "^1.0.0"
   },
   "devDependencies": {
-    "@types/fontkit": "^2.0.1",
     "@types/node": "^22.18.8",
     "fast-xml-parser": "^4.3.2",
     "sort-keys": "^5.0.0",
@@ -57,11 +55,9 @@
   },
   "publishConfig": {
     "exports": {
-      ".": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs"
-      },
+      ".": "./dist/index.mjs",
       "./package.json": "./package.json"
     }
-  }
+  },
+  "main": "./dist/index.mjs"
 }

packages/unpack/scripts/generate-weightings.ts

@@ -1,8 +1,11 @@
-import fs from 'fs/promises';
-import path from 'path';
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
 import { XMLParser } from 'fast-xml-parser';
 import sortKeys from 'sort-keys';
 
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
 type WikiNewsFeed = {
   feed: {
     doc: {

packages/unpack/src/index.ts

@@ -1,5 +1,9 @@
-import * as fontkit from 'fontkit';
-import type { Font as FontKitFont } from 'fontkit';
+import {
+  create,
+  type Font as FontKitFont,
+  type FontCollection,
+} from 'fontkitten';
+import { readFile } from 'node:fs/promises';
 
 import weightings from './weightings';
 
@@ -83,17 +87,14 @@ const unpackMetricsFromFont = (font: FontKitFont) => {
 
 export type Font = ReturnType<typeof unpackMetricsFromFont>;
 
-const handleCollectionErrors = ({
-  font,
-  postscriptName,
-  apiName,
-  apiParamName,
-}: {
-  font: FontKitFont | null;
-  postscriptName?: string;
-  apiName: string;
-  apiParamName: string;
-}) => {
+function handleCollectionErrors(
+  font: FontKitFont | FontCollection | null,
+  {
+    postscriptName,
+    apiName,
+    apiParamName,
+  }: { postscriptName?: string; apiName: string; apiParamName: string },
+): asserts font is FontKitFont {
   if (postscriptName && font === null) {
     throw new Error(
       [
@@ -108,7 +109,7 @@ const handleCollectionErrors = ({
     );
   }
 
-  if (font !== null && 'fonts' in font && Array.isArray(font.fonts)) {
+  if (font !== null && font.isCollection) {
     const availableNames = font.fonts.map((f) => f.postscriptName);
     throw new Error(
       [
@@ -126,25 +127,18 @@ const handleCollectionErrors = ({
       ].join('\n'),
     );
   }
-};
+}
 
 interface Options {
   postscriptName?: string;
 }
 
-export const fromFile = (path: string, options?: Options): Promise<Font> => {
-  const { postscriptName } = options || {};
-
-  return fontkit.open(path, postscriptName).then((font) => {
-    handleCollectionErrors({
-      font,
-      postscriptName,
-      apiName: 'fromFile',
-      apiParamName: 'path',
-    });
-
-    return unpackMetricsFromFont(font);
-  });
+export const fromFile = async (
+  path: string,
+  options?: Options,
+): Promise<Font> => {
+  const buffer = await readFile(path);
+  return _fromBuffer(buffer, 'fromFile', 'path', options);
 };
 
 const _fromBuffer = async (
@@ -155,10 +149,9 @@ const _fromBuffer = async (
 ) => {
   const { postscriptName } = options || {};
 
-  const fontkitFont = fontkit.create(buffer, postscriptName);
+  const fontkitFont = create(buffer, postscriptName);
 
-  handleCollectionErrors({
-    font: fontkitFont,
+  handleCollectionErrors(fontkitFont, {
     postscriptName,
     apiName,
     apiParamName,

packages/unpack/tsdown.config.ts

@@ -1,4 +1,7 @@
 import { defineConfig } from 'tsdown';
 import { baseConfig } from '../../tsdown.base.config.ts';
 
-export default defineConfig(baseConfig);
+export default defineConfig({
+  ...baseConfig,
+  format: ['esm'],
+});