seek-oss / capsize

Flipping how we define typography in CSS.
https://seek-oss.github.io/capsize/
MIT License
1.48k stars 37 forks source link

xWidthAvg: Add `subset` support for non-latin character sets #177

Closed michaeltaranto closed 4 months ago

michaeltaranto commented 4 months ago

xWidthAvg: Add subset support for non-latin character sets

Previously the xWidthAvg metric was calculated based on the character frequency as measured from English text only. This resulted in the xWidthAvg metric being incorrect for languages that use a different unicode subset range, e.g. Thai.

Supporting Thai now enables adding support for other unicode ranges in the future.

What's changed?

@capsizecss/metrics

The subsets field has been added to the metrics object, providing the xWidthAvg metric for each subset — calculated against the relevant character frequency data.

 {
   "familyName": "Abril Fatface",
   ...
+  "subsets": {
+    "latin": {
+      "xWidthAvg": 512
+    },
+    "thai": {
+      "xWidthAvg": 200
+    }
+  }
 }

There are no changes to any of the other existing metrics.

@capsizecss/core

Fallback font stacks can now be generated per subset, allowing the correct xWidthAvg metric to be used for the relevant subset.

The createFontStack API now accepts subset as an option:

const { fontFamily, fontFaces } = createFontStack(
  [lobster, arial],
  {
    subset: 'thai',
  },
);
changeset-bot[bot] commented 4 months ago

🦋 Changeset detected

Latest commit: 9d7ae2f01fa0c9454429a9235224e8ed3be251e3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages | Name | Type | | ------------------- | ----- | | @capsizecss/core | Minor | | @capsizecss/metrics | Minor | | @capsizecss/unpack | Minor |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR