@rxova/brand 0.1.0 → 0.1.2

package/README.md

@@ -98,9 +98,14 @@ once and gets both modes for free.
 
 ## Development
 
+The package lives in a two-package workspace — itself and `apps/preview`, a
+Starlight site that renders it. Run everything from the repo root; Turbo fans the
+tasks out and replays whatever the commit did not touch.
+
 ```sh
 pnpm install
-pnpm run verify   # format, lint, tsc, astro check, social cards, package contract
+pnpm run dev      # the preview site — the only place to *look* at the theme
+pnpm run verify   # audit, dedupe, format, lint, types, astro check, cards, contract
 pnpm run og       # re-render the social cards after a palette or tagline change
 ```
 
@@ -119,7 +124,13 @@ are perfectly correct.
 
 ### Trying a change in a consumer
 
-The package has no `workspace:*` shortcut, so iterate through snapshot releases:
+`apps/preview` links the package by `workspace:*`, so most changes can be seen
+immediately with `pnpm run dev`. It cannot catch a `files` omission, though —
+the link resolves to the source directory, where every file exists. That is what
+`check:exports` is for.
+
+For a real external consumer (the landing, a docs site), iterate through snapshot
+releases:
 
 1. Add a changeset (`pnpm exec changeset`).
 2. Run the **Snapshot** workflow — publishes `0.x.y-next.N` to the `next` tag.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rxova/brand",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "type": "module",
   "description": "Design tokens, Starlight theme and shared site chrome for rxova.org",
   "keywords": [
@@ -15,10 +15,10 @@
   "homepage": "https://rxova.org",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/rxova/brand.git"
+    "url": "git+https://github.com/rxova/brand.git",
+    "directory": "packages/brand"
   },
   "bugs": "https://github.com/rxova/brand/issues",
-  "packageManager": "pnpm@11.9.0",
   "engines": {
     "node": ">=20.19.0"
   },
@@ -48,19 +48,6 @@
       "optional": true
     }
   },
-  "scripts": {
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "format": "prettier --write .",
-    "format:check": "prettier --check .",
-    "typecheck": "tsc --noEmit",
-    "check:astro": "astro check",
-    "check:exports": "node scripts/check-exports.mjs",
-    "og": "node scripts/generate-og.mjs",
-    "check:og": "node scripts/generate-og.mjs --check",
-    "verify": "pnpm run format:check && pnpm run lint && pnpm run typecheck && pnpm run check:astro && pnpm run check:og && pnpm run check:exports",
-    "prepare": "husky"
-  },
   "dependencies": {
     "@fontsource/ibm-plex-mono": "^5.2.5",
     "@fontsource/space-grotesk": "^5.2.5"
@@ -68,30 +55,17 @@
   "devDependencies": {
     "@astrojs/check": "^0.9.9",
     "@astrojs/starlight": "^0.41.4",
-    "@changesets/changelog-github": "^0.7.0",
-    "@changesets/cli": "^2.29.7",
-    "@commitlint/cli": "^21.2.1",
-    "@commitlint/config-conventional": "^21.2.0",
-    "@eslint/js": "^10.0.1",
     "@resvg/resvg-js": "^2.6.2",
     "@types/node": "^26.1.1",
     "astro": "^7.1.3",
-    "eslint": "^10.7.0",
-    "eslint-plugin-astro": "^1.3.0",
-    "globals": "^17.6.0",
-    "husky": "^9.1.7",
-    "lint-staged": "^17.2.0",
-    "prettier": "^3.9.6",
-    "prettier-plugin-astro": "^0.14.0",
     "satori": "^0.29.0",
-    "typescript": "6.0.3",
-    "typescript-eslint": "^8.65.0"
+    "typescript": "6.0.3"
   },
-  "lint-staged": {
-    "*.{ts,tsx,astro,mjs,js}": [
-      "eslint --fix",
-      "prettier --write"
-    ],
-    "*.{json,jsonc,css,md,mdx,yaml,yml}": "prettier --write"
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "check:astro": "astro check",
+    "check:exports": "node scripts/check-exports.mjs",
+    "og": "node scripts/generate-og.mjs",
+    "check:og": "node scripts/generate-og.mjs --check"
   }
-}
+}

package/src/fonts.css

@@ -10,14 +10,235 @@
  *
  * Weights are deliberately narrow — the ones the design system actually uses.
  * Adding a weight here costs every page on rxova.org, so add only on demand.
+ *
+ * The @font-face rules are declared here rather than `@import`ed from
+ * @fontsource's own per-weight stylesheets, for two reasons:
+ *
+ *  1. `font-display`. Fontsource hardcodes `swap`, which paints every page in
+ *     the fallback face and then re-paints it in Space Grotesk — the flash of
+ *     unstyled text you see on each navigation, because these are multi-page
+ *     sites where every link click is a fresh document. `optional` removes it:
+ *     the browser blocks invisibly for ~100ms, uses the font if it is there
+ *     (which it is, from the HTTP cache, on every navigation after the first)
+ *     and otherwise keeps the fallback for that page with no swap. There is no
+ *     third state where text changes shape after paint.
+ *  2. Nested `@import` serialises. A consumer's stylesheet importing this file
+ *     importing fontsource's meant the browser could not even discover the font
+ *     URLs until two stylesheets had been fetched and parsed, which made the
+ *     swap late enough to always be visible.
+ *
+ * Only woff2 is referenced — fontsource also ships woff, but every browser that
+ * runs an Astro 5 site supports woff2.
+ *
+ * These blocks are transcribed from @fontsource's own stylesheets (the
+ * unicode-ranges especially). When bumping either @fontsource dependency,
+ * re-check them against `node_modules/@fontsource/<pkg>/<weight>.css`.
  */
 
-/* Body, headings and UI. */
-@import '@fontsource/space-grotesk/400.css';
-@import '@fontsource/space-grotesk/500.css';
-@import '@fontsource/space-grotesk/600.css';
-@import '@fontsource/space-grotesk/700.css';
+/* Space Grotesk 400 — latin */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 400;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-400-normal.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Space Grotesk 400 — latin-ext */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 400;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-ext-400-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* Space Grotesk 400 — vietnamese */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 400;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-vietnamese-400-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301,
+    U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* Space Grotesk 500 — latin */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 500;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-500-normal.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Space Grotesk 500 — latin-ext */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 500;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-ext-500-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* Space Grotesk 500 — vietnamese */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 500;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-vietnamese-500-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301,
+    U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* Space Grotesk 600 — latin */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 600;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-600-normal.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Space Grotesk 600 — latin-ext */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 600;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-ext-600-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* Space Grotesk 600 — vietnamese */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 600;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-vietnamese-600-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301,
+    U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* Space Grotesk 700 — latin */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 700;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-700-normal.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* Space Grotesk 700 — latin-ext */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 700;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-latin-ext-700-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* Space Grotesk 700 — vietnamese */
+@font-face {
+  font-family: 'Space Grotesk';
+  font-style: normal;
+  font-weight: 700;
+  font-display: optional;
+  src: url('@fontsource/space-grotesk/files/space-grotesk-vietnamese-700-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301,
+    U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* IBM Plex Mono 400 — latin */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: optional;
+  src: url('@fontsource/ibm-plex-mono/files/ibm-plex-mono-latin-400-normal.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* IBM Plex Mono 400 — latin-ext */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: optional;
+  src: url('@fontsource/ibm-plex-mono/files/ibm-plex-mono-latin-ext-400-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}
+
+/* IBM Plex Mono 500 — latin */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: optional;
+  src: url('@fontsource/ibm-plex-mono/files/ibm-plex-mono-latin-500-normal.woff2') format('woff2');
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
 
-/* Code, package names and install snippets. */
-@import '@fontsource/ibm-plex-mono/400.css';
-@import '@fontsource/ibm-plex-mono/500.css';
+/* IBM Plex Mono 500 — latin-ext */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: optional;
+  src: url('@fontsource/ibm-plex-mono/files/ibm-plex-mono-latin-ext-500-normal.woff2')
+    format('woff2');
+  unicode-range:
+    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
+    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
+    U+A720-A7FF;
+}