@smoove/google-fonts 0.1.1 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -8
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Typed, tree-shakeable [Google Fonts](https://fonts.google.com) for
|
|
4
4
|
[smoove](https://smoove.dev). Each family is its own module exporting a
|
|
5
|
-
`Font` subclass, loaded from the Google Fonts CDN
|
|
5
|
+
`Font` subclass, loaded from the Google Fonts CDN, so a project only pulls the
|
|
6
6
|
families it imports.
|
|
7
7
|
|
|
8
8
|
## Install
|
|
@@ -19,9 +19,9 @@ pnpm add konva @smoove/core @smoove/google-fonts
|
|
|
19
19
|
import { Composition, Sequence, Text } from "@smoove/core";
|
|
20
20
|
import NotoSans from "@smoove/google-fonts/noto-sans";
|
|
21
21
|
|
|
22
|
-
// Register a subset of faces
|
|
22
|
+
// Register a subset of faces...
|
|
23
23
|
const font = new NotoSans({ weights: ["400", "600"], styles: ["normal", "italic"] });
|
|
24
|
-
//
|
|
24
|
+
// ...or omit weights/styles to register every face the family ships:
|
|
25
25
|
// const font = new NotoSans();
|
|
26
26
|
|
|
27
27
|
// Pick a character subset (default "latin"); typed to the family's subsets:
|
|
@@ -33,13 +33,13 @@ seq.add(new Text({ font, text: "Hello" })); // preferred face (400
|
|
|
33
33
|
seq.add(new Text({ font: font.face("600"), text: "Hi" })); // a specific face
|
|
34
34
|
```
|
|
35
35
|
|
|
36
|
-
`weights`, `styles`, and `subset` are typed **per family
|
|
36
|
+
`weights`, `styles`, and `subset` are typed **per family**, so the editor only
|
|
37
37
|
offers the values that family actually provides. A bare `new NotoSans()`
|
|
38
38
|
registers all faces in the `latin` subset.
|
|
39
39
|
|
|
40
40
|
**Subsets.** Each face is loaded from a single character subset (default
|
|
41
41
|
`"latin"`). Exactly one subset is used so the browser and headless (skia)
|
|
42
|
-
rendering load the same file
|
|
42
|
+
rendering load the same file. Pick the `subset` matching your text (e.g.
|
|
43
43
|
`"cyrillic"`, `"greek"`, `"latin-ext"`). An unknown subset warns and falls back
|
|
44
44
|
to `latin`.
|
|
45
45
|
|
|
@@ -49,7 +49,7 @@ server rendering (the renderer downloads + disk-caches the CDN font files).
|
|
|
49
49
|
|
|
50
50
|
## How it works
|
|
51
51
|
|
|
52
|
-
- **No build.** The package is consumed as TypeScript source
|
|
52
|
+
- **No build.** The package is consumed as TypeScript source: `exports` point at
|
|
53
53
|
`src/*.ts`, and your bundler (Vite, etc.) transpiles. There is no `dist`.
|
|
54
54
|
- **CDN delivery.** Each face's `src` is a `fonts.gstatic.com` woff2 URL. The
|
|
55
55
|
browser fetches it; the server downloads + caches it.
|
|
@@ -60,7 +60,7 @@ server rendering (the renderer downloads + disk-caches the CDN font files).
|
|
|
60
60
|
|
|
61
61
|
The per-font modules and `src/manifest.ts` are generated from the Google Webfonts
|
|
62
62
|
Developer API and committed. The key is a free Google Cloud API key with the
|
|
63
|
-
**Web Fonts Developer API** enabled
|
|
63
|
+
**Web Fonts Developer API** enabled. It is needed only to regenerate, never at runtime.
|
|
64
64
|
|
|
65
65
|
Put it in a `.env` file (git-ignored; `cp .env.example .env`):
|
|
66
66
|
|
|
@@ -76,7 +76,7 @@ pnpm --filter @smoove/google-fonts generate
|
|
|
76
76
|
```
|
|
77
77
|
|
|
78
78
|
The script auto-loads `packages/google-fonts/.env` (via Node's `--env-file`). You
|
|
79
|
-
can also pass the key inline instead: `GOOGLE_FONTS_API_KEY=<key> pnpm
|
|
79
|
+
can also pass the key inline instead: `GOOGLE_FONTS_API_KEY=<key> pnpm ... generate`.
|
|
80
80
|
|
|
81
81
|
The metadata catalog (no font modules pulled) is importable for tooling:
|
|
82
82
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@smoove/google-fonts",
|
|
3
|
-
"version": "0.1.
|
|
4
|
-
"description": "Typed, tree-shakeable Google Fonts for smoove
|
|
3
|
+
"version": "0.1.2",
|
|
4
|
+
"description": "Typed, tree-shakeable Google Fonts for smoove. One Font subclass per family, imported as TS source with no build step.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
],
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"konva": ">=10",
|
|
24
|
-
"@smoove/core": "^0.1.
|
|
24
|
+
"@smoove/core": "^0.1.2"
|
|
25
25
|
},
|
|
26
26
|
"devDependencies": {
|
|
27
27
|
"@types/node": "^22.10.0"
|