@tenphi/cookbook 0.27.0 → 0.30.0

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.
Files changed (54) hide show
  1. package/README.md +13 -11
  2. package/dist/index.d.ts +2 -2
  3. package/dist/index.js +2 -2
  4. package/docs/ai-agents.md +5 -3
  5. package/docs/architecture.md +10 -7
  6. package/docs/authoring.mdx +142 -38
  7. package/docs/cli.md +92 -33
  8. package/docs/component-styles.md +286 -279
  9. package/docs/configuration.md +232 -153
  10. package/docs/content-sources.md +39 -21
  11. package/docs/custom-components.md +117 -169
  12. package/docs/customization-rules.md +23 -14
  13. package/docs/deployment.md +101 -53
  14. package/docs/es/getting-started.md +7 -5
  15. package/docs/es/index.md +1 -1
  16. package/docs/examples.md +65 -28
  17. package/docs/fonts-and-typography.md +32 -27
  18. package/docs/getting-started.md +17 -10
  19. package/docs/ja/getting-started.md +7 -5
  20. package/docs/ja/index.md +1 -1
  21. package/docs/migration.md +188 -65
  22. package/docs/plugins.md +28 -16
  23. package/docs/publishing.md +3 -2
  24. package/docs/quality-checks.md +18 -42
  25. package/docs/recipes.md +38 -54
  26. package/docs/ru/getting-started.md +7 -5
  27. package/docs/ru/index.md +1 -1
  28. package/docs/site-navigation.md +47 -47
  29. package/docs/theme-and-components.md +126 -59
  30. package/docs/troubleshooting.md +4 -3
  31. package/docs/upstream/manifest.json +2 -2
  32. package/docs/upstream/tasty/README.md +404 -381
  33. package/docs/upstream/tasty/docs/README.md +4 -1
  34. package/docs/upstream/tasty/docs/adoption.md +25 -17
  35. package/docs/upstream/tasty/docs/ai-agents.md +42 -34
  36. package/docs/upstream/tasty/docs/comparison.md +9 -8
  37. package/docs/upstream/tasty/docs/configuration.md +187 -69
  38. package/docs/upstream/tasty/docs/debug.md +3 -2
  39. package/docs/upstream/tasty/docs/design-system.md +117 -15
  40. package/docs/upstream/tasty/docs/dsl.md +211 -117
  41. package/docs/upstream/tasty/docs/getting-started.md +81 -24
  42. package/docs/upstream/tasty/docs/injector.md +41 -40
  43. package/docs/upstream/tasty/docs/methodology.md +46 -21
  44. package/docs/upstream/tasty/docs/migration-v3.md +3 -3
  45. package/docs/upstream/tasty/docs/pipeline.md +111 -116
  46. package/docs/upstream/tasty/docs/plugins.md +21 -41
  47. package/docs/upstream/tasty/docs/react-api.md +73 -10
  48. package/docs/upstream/tasty/docs/runtime-benchmarks.md +46 -46
  49. package/docs/upstream/tasty/docs/ssr.md +92 -66
  50. package/docs/upstream/tasty/docs/styles.md +37 -17
  51. package/docs/upstream/tasty/docs/tasty-static.md +175 -57
  52. package/docs/zh/getting-started.md +7 -5
  53. package/docs/zh/index.md +1 -1
  54. package/package.json +3 -3
package/docs/es/index.md CHANGED
@@ -42,7 +42,7 @@ cd docs-site
42
42
  npm run dev
43
43
  ```
44
44
 
45
- Cookbook lee los archivos donde ya están. También puedes [crear un sitio nuevo](./getting-started.md), [documentar exactamente los archivos publicados en npm](./getting-started.md) o [añadir Cookbook a un proyecto Astro](./getting-started.md).
45
+ Cookbook lee los archivos donde ya están. También puedes [crear un sitio nuevo](./getting-started.md#crea-tu-primer-sitio), [documentar exactamente los archivos publicados en npm](./getting-started.md#documenta-un-paquete-npm-publicado) o [añadir Cookbook a un proyecto Astro](./getting-started.md#añádelo-a-un-proyecto-astro-existente).
46
46
 
47
47
  ## Este sitio es el ejemplo
48
48
 
package/docs/examples.md CHANGED
@@ -1,10 +1,15 @@
1
1
  ---
2
2
  title: Working examples
3
- description: Complete configuration patterns for repositories, monorepos, npm content, and shared themes.
3
+ description: Complete configurations for repositories, monorepos, npm content, languages, and preview sites.
4
4
  sidebar:
5
5
  order: 3
6
6
  ---
7
7
 
8
+ These are complete `docs.config.ts` files for common content layouts. For
9
+ branding, component styles, fonts, and shared themes, see the
10
+ [theme recipes](./recipes.md). Every example marked for verification is
11
+ type-checked and built by Cookbook's test suite.
12
+
8
13
  Each example uses the same Astro integration:
9
14
 
10
15
  ```ts
@@ -40,16 +45,31 @@ export default defineDocsConfig({
40
45
  site: { title: "SDK documentation" },
41
46
  content: {
42
47
  sources: [
43
- { id: "api", root: "packages/api", glob: "**/*.md", routeBase: "/api" },
44
- { id: "ui", root: "packages/ui", glob: "**/*.md", routeBase: "/ui" },
48
+ {
49
+ id: "api",
50
+ root: "packages/api",
51
+ glob: "**/*.md",
52
+ exclude: ["node_modules/**", "dist/**", "CHANGELOG.md"],
53
+ routeBase: "/api",
54
+ },
55
+ {
56
+ id: "ui",
57
+ root: "packages/ui",
58
+ glob: "**/*.md",
59
+ exclude: ["node_modules/**", "dist/**", "CHANGELOG.md"],
60
+ routeBase: "/ui",
61
+ },
45
62
  ],
46
63
  },
47
64
  });
48
65
  ```
49
66
 
50
- Use `source:ui/README.md` for an explicit link to the UI package. Ordinary relative
51
- links stay in their own source mount when the same file appears in several
52
- versions. A relative frontmatter slug is appended to that source's `routeBase`.
67
+ Glob sources skip only paths beginning with `_` and the declared `exclude`
68
+ patterns, so exclude each package's dependencies, build output, and changelog.
69
+ Use `source:ui/README.md` for an explicit link to the UI package. Ordinary
70
+ relative links stay in their own source mount when the same file appears in
71
+ several mounts. A frontmatter `slug`, even one starting with `/`, is appended
72
+ to that source's `routeBase`.
53
73
 
54
74
  ## Locked npm documentation
55
75
 
@@ -71,34 +91,51 @@ with instructions instead of rendering the old version.
71
91
  A package source can specify `registry` for an alternative registry. The default
72
92
  is the npm public registry. Keep credentials out of committed configuration.
73
93
 
74
- ## Share configuration and themes
94
+ ## English and French
75
95
 
76
- A preset is an ordinary exported `DocsConfig` object:
96
+ Create `docs/index.md`, `docs/guide.md`, `docs/fr/index.md`, and
97
+ `docs/fr/guide.md`. Routes are `/`, `/guide`, `/fr`, and `/fr/guide`.
77
98
 
78
- ```ts cookbook-verify=shared-theme
79
- import { defineDocsConfig, mergeDocsConfig } from "@tenphi/cookbook/config";
99
+ ```ts cookbook-verify=locales
100
+ import { defineDocsConfig } from "@tenphi/cookbook/config";
80
101
 
81
- const company = defineDocsConfig({
82
- theme: {
83
- brand: { from: "#315efb" },
84
- tokens: { $radius: "8px" },
102
+ export default defineDocsConfig({
103
+ site: { title: "Acme docs", url: "https://docs.example.com" },
104
+ content: { sources: [{ glob: "docs/**/*.md", base: "docs" }] },
105
+ locales: {
106
+ root: { label: "English", lang: "en" },
107
+ fr: { label: "Français" },
85
108
  },
86
- markdown: { rawHtml: "sanitize" },
87
- });
88
-
89
- export default mergeDocsConfig(company, {
90
- site: { title: "Product docs" },
91
- theme: { tokens: { "$content-width": "52rem" } },
109
+ defaultLocale: "root",
110
+ navigation: ["/", "/guide"],
111
+ translations: { fr: { appearance: "Présentation" } },
92
112
  });
93
113
  ```
94
114
 
95
- Each `theme.brand` or `theme.palette` color replaces the corresponding color in
96
- the preset. Supply the complete Glaze declaration for a color you override.
115
+ Navigation adapts to real translations. Missing translations use a real fallback
116
+ in the language picker; they do not generate phantom routes or alternate links.
117
+ See [languages](./configuration.md#languages) and
118
+ [translations](./configuration.md#translations).
119
+
120
+ ## Preview publishing
121
+
122
+ Set the preview's own URL and Astro `base` if hosted in a subdirectory. Serve
123
+ private previews behind host authentication.
97
124
 
98
- Objects merge recursively, arrays replace, and inputs are not mutated. Tasty
99
- styles preserve their default values when adding conditional overrides. A preset
100
- can live in a shared workspace package. Component overrides remain partial Tasty
101
- objects and merge into Cookbook's complete base styles inside the renderer.
125
+ ```ts cookbook-verify=preview
126
+ import { defineDocsConfig } from "@tenphi/cookbook/config";
127
+
128
+ export default defineDocsConfig({
129
+ site: {
130
+ title: "Acme preview",
131
+ url: "https://preview.example.com",
132
+ seo: { index: false, copyPage: false },
133
+ },
134
+ tableOfContents: { mobile: true },
135
+ });
136
+ ```
102
137
 
103
- For complete branding, font, locale, and preview configurations, see
104
- [configuration recipes](./recipes.md).
138
+ Build, run `cookbook check-build`, deploy that output, then run
139
+ `cookbook check-build --url https://preview.example.com/`. See
140
+ [deployment](./deployment.md) for production metadata, host headers, and sitemap
141
+ checks, and [troubleshooting](./troubleshooting.md) when a check fails.
@@ -6,12 +6,10 @@ Start with the [theme overview](./theme-and-components.md) for brand colors and
6
6
  design tokens. Cookbook configures font loading at build time and applies
7
7
  named presets to the rendered site.
8
8
 
9
- ## Typography presets
9
+ ## Default fonts
10
10
 
11
- The base [typography presets](./upstream/tasty/docs/styles.md#preset) are
12
- `body`, `heading`, `h1` through `h6`, `navigation`, `small`, and `code`. Onest
13
- Variable is self-hosted and used for body and heading text by default, with a
14
- continuous weight range from `100` to `900`. This supports intermediate preset
11
+ Onest Variable is self-hosted and used for body and heading text by default,
12
+ with a continuous weight range from `100` to `900`. This supports intermediate preset
15
13
  weights such as `450` for navigation and `610` for headings. JetBrains Mono
16
14
  Variable is self-hosted for code with weights from `100` to `800`.
17
15
 
@@ -19,19 +17,7 @@ Both default fonts bundle their Latin subset and require no Google Fonts
19
17
  requests at build time or in the browser. For other character sets, configure
20
18
  `theme.fonts` with a Google family or local files as described below.
21
19
 
22
- Specialized roles preserve the component sizes while sharing their base typography:
23
-
24
- | Preset | Used for | Base typography |
25
- | -------------- | ----------------- | --------------------------------------------------- |
26
- | `hero-title` | Hero heading | `h1`, with a larger responsive size |
27
- | `hero-tagline` | Hero description | `body`, with a responsive size and 1.55 line height |
28
- | `prose` | Markdown content | `body`, at 1.025rem |
29
- | `inline-code` | Code within prose | `code`, at 0.875em |
30
-
31
- Customize these through `theme.presets` as well. Changes to the base font family,
32
- weight, tracking, and other shared fields continue to flow into the derived roles.
33
-
34
- ### Change font families
20
+ ## Change font families
35
21
 
36
22
  Set `theme.fonts` to load fonts and apply them to the matching presets. A Google
37
23
  Fonts family needs only its name:
@@ -84,11 +70,14 @@ theme: {
84
70
 
85
71
  The `body` role also feeds navigation and small text. `heading` feeds `h1`
86
72
  through `h6`, while `code` covers code text. Each role has a system fallback.
73
+
74
+ ### Font loading and caching
75
+
87
76
  Cookbook emits font faces through Tasty with `font-display: swap`. Google CSS
88
77
  and font files are downloaded at build time and cached in
89
78
  `<Astro cacheDir>/cookbook-fonts`. Files are served from your own site's
90
79
  `_cookbook/fonts/` path by default, including the deployment base. Visitors make
91
- no Google Fonts requests. Existing local-file definitions keep working.
80
+ no Google Fonts requests.
92
81
 
93
82
  ```ts
94
83
  theme: {
@@ -111,13 +100,24 @@ for other axes. Styles and weights that do not exist are rejected for explicit
111
100
  requests. For static fonts, browsers select their nearest real weight;
112
101
  intermediate weights require a variable font.
113
102
 
114
- Migration: name-only Google font configuration now downloads the required
115
- weights and italics and serves them locally. This increases the initial build's
116
- font downloads and removes visitors' external font dependency. Set
117
- `fontLoading.google: "remote"` to retain CDN delivery. Existing CSS-variable
118
- weights that cannot be resolved from presets require explicit `weights`.
103
+ ## Typography presets
104
+
105
+ The base [typography presets](./upstream/tasty/docs/styles.md#preset) are
106
+ `body`, `heading`, `h1` through `h6`, `navigation`, `small`, and `code`.
107
+
108
+ Specialized roles preserve the component sizes while sharing their base typography:
109
+
110
+ | Preset | Used for | Base typography |
111
+ | -------------- | ----------------- | --------------------------------------------------- |
112
+ | `hero-title` | Hero heading | `h1`, with a larger responsive size |
113
+ | `hero-tagline` | Hero description | `body`, with a responsive size and 1.55 line height |
114
+ | `prose` | Markdown content | `body`, at 1.025rem |
115
+ | `inline-code` | Code within prose | `code`, at 0.875em |
119
116
 
120
- ### Adjust presets
117
+ Customize these through `theme.presets` as well. Changes to the base font family,
118
+ weight, tracking, and other shared fields continue to flow into the derived roles.
119
+
120
+ ## Adjust presets
121
121
 
122
122
  Presets merge property-by-property, so changing size, weight, or line height
123
123
  does not require copying the rest of the preset. `theme.presets` takes precedence
@@ -144,7 +144,11 @@ theme: {
144
144
 
145
145
  For a system or already loaded font, set its CSS family directly with
146
146
  `theme.presets.<role>.fontFamily`. This does not load a font file. Additional
147
- named presets are available to custom MDX components.
147
+ named presets are available to custom MDX components; a new preset starts from
148
+ the `body` values.
149
+
150
+ Each preset accepts `fontFamily`, `fontSize`, `lineHeight`, `letterSpacing`,
151
+ `fontWeight`, `boldFontWeight`, `fontStyle`, `textTransform`, and `iconSize`.
148
152
 
149
153
  Heading presets reference the `heading` family and weights; body, navigation,
150
154
  and controls reference `body`. Semantic `strong` and `b` elements use Tasty's
@@ -171,5 +175,6 @@ Cookbook applies each semantic typography role through its complete Tasty
171
175
  `preset`, so configured fields such as `fontStyle` and `textTransform` are not
172
176
  silently omitted.
173
177
 
174
- The exported `DEFAULT_THEME_TOKENS` and `DEFAULT_TYPOGRAPHY_PRESETS` constants
178
+ The `DEFAULT_THEME_TOKENS` and `DEFAULT_TYPOGRAPHY_PRESETS` constants exported
179
+ from `@tenphi/cookbook`
175
180
  are useful when building a theme editor or presenting a reset action.
@@ -75,11 +75,6 @@ With no documentation configuration, it uses README/docs conventions.
75
75
 
76
76
  ## Configure the site
77
77
 
78
- Start with the complete [brand, logo, and font recipes](./recipes.md).
79
- For deeper style changes or new components, read the
80
- [customization rules](./customization-rules.md). These rules and upstream
81
- references are also included in the installed Cookbook package.
82
-
83
78
  Create `docs.config.ts` next to `astro.config.ts`:
84
79
 
85
80
  ```ts
@@ -105,11 +100,19 @@ and `defineComponent()` with `theme.customStyles` to add a new element. The
105
100
  [component styles reference](./component-styles.md) lists every customizable
106
101
  sub-element.
107
102
 
103
+ For complete starting points, see the [brand, logo, and font recipes](./recipes.md).
104
+ Before deeper style changes or new components, read the
105
+ [customization rules](./customization-rules.md). These rules and upstream
106
+ references are also included in the installed Cookbook package.
107
+
108
108
  The integration and CLI load the same configuration. Supported filenames are
109
109
  `docs.config.ts`, `.mts`, `.js`, and `.mjs`, in that order. An explicit integration
110
110
  `config` object takes precedence; `configFile: false` disables discovery.
111
111
  Use `cookbook({ configFile: "./config/manual.ts" })` and
112
112
  `cookbook doctor --config ./config/manual.ts` for a nonstandard location.
113
+ Because `root` resolves from the configuration file's directory, that file
114
+ needs `root: ".."` to keep reading `README.md` and `docs/` from the app
115
+ directory.
113
116
 
114
117
  ## Monorepo roots
115
118
 
@@ -133,9 +136,13 @@ npm run validate
133
136
  npm run preview
134
137
  ```
135
138
 
136
- See [working examples](./examples.md), [authoring components](./authoring.mdx),
137
- the [AI agent workflow](./ai-agents.md), and [deployment](./deployment.md). Existing users should read the
138
- [version-specific upgrade guide](./migration.md).
139
+ `validate` type-checks the project, runs Cookbook's preflight, builds the site,
140
+ and checks the output. In a project you set up yourself, add the scripts listed
141
+ in [CLI commands](./cli.md) or run `npx @tenphi/cookbook doctor`. Then
142
+ [deploy](./deployment.md) the `dist/` directory. If validation fails, see
143
+ [troubleshooting](./troubleshooting.md).
139
144
 
140
- For a complete configuration to adapt, start with the [recipes](./recipes.md).
141
- If validation fails, see [troubleshooting](./troubleshooting.md).
145
+ Continue with [working examples](./examples.md),
146
+ [authoring components](./authoring.mdx), and the
147
+ [AI agent workflow](./ai-agents.md). Existing users should read the
148
+ [version-specific upgrade guide](./migration.md).
@@ -63,8 +63,6 @@ Cookbook には Astro 用レンダラーが含まれ、`docs.config.ts` を自
63
63
 
64
64
  ## サイトを設定する
65
65
 
66
- まずは[ブランド、ロゴ、フォントのレシピ](../recipes.md)をご覧ください。より細かなスタイル変更や新しいコンポーネントには、[カスタマイズのルール](../customization-rules.md)を参照してください。これらのルールと参照先は、インストールされる Cookbook パッケージにも含まれます。
67
-
68
66
  `astro.config.ts` と同じ場所に `docs.config.ts` を作成します。
69
67
 
70
68
  ```ts
@@ -83,9 +81,11 @@ export default defineDocsConfig({
83
81
  });
84
82
  ```
85
83
 
86
- `theme.fonts` を変更すると、[名前で指定する Google Fonts や独自のフォントファイル](../fonts-and-typography.md)を使えます。タイポグラフィの詳細には `theme.presets`、組み込み要素には `theme.styles`、新しい要素には `defineComponent()` と `theme.customStyles` を使用します。[テーマガイド](../theme-and-components.md)が出発点となり、[コンポーネントスタイルのリファレンス](../component-styles.md)にはカスタマイズ可能なすべてのパーツが載っています。
84
+ `theme.fonts` を変更すると、[名前で指定する Google Fonts や独自のフォントファイル](../fonts-and-typography.md#change-font-families)を使えます。タイポグラフィの詳細には `theme.presets`、組み込み要素には `theme.styles`、新しい要素には `defineComponent()` と `theme.customStyles` を使用します。[テーマガイド](../theme-and-components.md)が出発点となり、[コンポーネントスタイルのリファレンス](../component-styles.md)にはカスタマイズ可能なすべてのパーツが載っています。
85
+
86
+ 完全な出発点として[ブランド、ロゴ、フォントのレシピ](../recipes.md)を用意しています。より細かなスタイル変更や新しいコンポーネントには、[カスタマイズのルール](../customization-rules.md)を参照してください。これらのルールと参照先は、インストールされる Cookbook パッケージにも含まれます。
87
87
 
88
- 統合と CLI は同じ設定を読み込みます。対応するファイル名は優先順に `docs.config.ts`、`.mts`、`.js`、`.mjs` です。統合に明示した `config` オブジェクトが優先され、`configFile: false` で自動検出を無効にできます。標準以外の場所では `cookbook({ configFile: "./config/manual.ts" })` と `cookbook doctor --config ./config/manual.ts` を使用してください。
88
+ 統合と CLI は同じ設定を読み込みます。対応するファイル名は優先順に `docs.config.ts`、`.mts`、`.js`、`.mjs` です。統合に明示した `config` オブジェクトが優先され、`configFile: false` で自動検出を無効にできます。標準以外の場所では `cookbook({ configFile: "./config/manual.ts" })` と `cookbook doctor --config ./config/manual.ts` を使用してください。 `root` は設定ファイルのディレクトリを基準に解決されるため、このファイルでは `root: ".."` を指定して、アプリのディレクトリにある `README.md` と `docs/` を引き続き読み込むようにします。
89
89
 
90
90
  ## モノレポのルート
91
91
 
@@ -106,4 +106,6 @@ npm run validate
106
106
  npm run preview
107
107
  ```
108
108
 
109
- ほかのガイドは現在英語で公開されています。[使用例](../examples.md)、[執筆用コンポーネント](../authoring.mdx)、[AI エージェントの作業手順](../ai-agents.md)、[デプロイ](../deployment.md)、[バージョン別のアップグレードガイド](../migration.md)を参照してください。設定例には[レシピ](../recipes.md)、検証に失敗した場合には[トラブルシューティング](../troubleshooting.md)が役立ちます。
109
+ `validate` はプロジェクトの型チェック、Cookbook の事前チェック、サイトのビルド、出力の検証を行います。自分で構成したプロジェクトでは、[CLI コマンド](../cli.md)に記載されたスクリプトを追加するか、`npx @tenphi/cookbook doctor` を実行してください。
110
+
111
+ ほかのガイドは現在英語で公開されています。[使用例](../examples.md)、[執筆用コンポーネント](../authoring.mdx)、[AI エージェントの作業手順](../ai-agents.md)、[デプロイ](../deployment.md)、[バージョン別のアップグレードガイド](../migration.md)を参照してください。検証に失敗した場合は[トラブルシューティング](../troubleshooting.md)を参照してください。
package/docs/ja/index.md CHANGED
@@ -42,7 +42,7 @@ cd docs-site
42
42
  npm run dev
43
43
  ```
44
44
 
45
- Cookbook はファイルを現在の場所から読み込みます。[新しいサイトを作る](./getting-started.md)、[npm に公開されたファイルをそのまま文書化する](./getting-started.md)、[既存の Astro プロジェクトに追加する](./getting-started.md)方法もあります。
45
+ Cookbook はファイルを現在の場所から読み込みます。[新しいサイトを作る](./getting-started.md#最初のサイトを作る)、[npm に公開されたファイルをそのまま文書化する](./getting-started.md#公開済みの-npm-パッケージを文書化する)、[既存の Astro プロジェクトに追加する](./getting-started.md#既存の-astro-プロジェクトに追加する)方法もあります。
46
46
 
47
47
  ## このサイト自体が使用例
48
48
 
package/docs/migration.md CHANGED
@@ -5,6 +5,9 @@ sidebar:
5
5
  order: 9
6
6
  ---
7
7
 
8
+ Upgrade the Cookbook runtime with your package manager, then apply the notes
9
+ for every version range you cross, starting with the oldest.
10
+
8
11
  ## Upgrade the site runtime
9
12
 
10
13
  Check your current `@tenphi/cookbook`, Astro, and Node versions first. Read the
@@ -38,7 +41,179 @@ upgrade the site's Cookbook runtime or package-manager dependencies. Commit the
38
41
  documentation lock separately when intentionally updating imported content.
39
42
  Local Markdown needs no lock update.
40
43
 
41
- ## Upcoming theme API cleanup
44
+ ## Upcoming Tasty upgrade
45
+
46
+ Cookbook now uses Tasty 3.14 and the Tasty ESLint plugin 1.12. Built-in themes
47
+ need no configuration migration. Review custom styles for these changes from
48
+ Tasty 3.12:
49
+
50
+ - Color opacity suffixes such as `#accent-text.5` now emit `color-mix()`. If the
51
+ palette color is already translucent, the suffix multiplies its alpha rather
52
+ than replacing it. For `#accent-text.$fade`, set `$fade` to a number such as
53
+ `".5"`, rather than a percentage such as `"50%"`.
54
+ - `false` now omits spacing, size, and `outlineOffset` declarations. Use an
55
+ explicit value such as `"0"` or `"auto"` if a custom style relied on the old
56
+ implicit default. `transition: "none"` now correctly disables transitions,
57
+ including the built-in reduced-motion states.
58
+
59
+ The linter now checks `mergeStyles` arguments directly: the first argument is a
60
+ base style object and later arguments are partial overrides. Remove a custom
61
+ `styleFunctions.mergeStyles` registration if you copied the old configuration;
62
+ it is superseded by the built-in signature. Module-scope constants no longer
63
+ need `tasty/no-runtime-styles-mutation` suppressions; values computed during
64
+ rendering still do.
65
+
66
+ ## 0.28.x to 0.29
67
+
68
+ Cookbook 0.29 updates Tasty to 3.11, aligns the built-in styles with Tasty's
69
+ style guidelines, and checks component overrides the way the build uses them.
70
+
71
+ ### Style overrides
72
+
73
+ Review overrides of the properties below.
74
+
75
+ Direction-dependent styles now follow the page's writing direction. Override
76
+ `Steps` with `inlinePadding` and `inlineBorder`, `Steps.Item`,
77
+ `MarkdownCodeBlock.Pre`, and `SearchButton` with `inlinePadding` (and
78
+ `blockPadding`), and the `SkipLink`, `HeaderLinks.Panel`, and
79
+ `HeaderLinks.Close` positions with `blockInset` and `inlineInset`. A physical
80
+ `padding`, `border`, or `inset` override no longer replaces those
81
+ declarations. `MarkdownTable.HeaderCell` rounds both top corners of each cell
82
+ in the first header row.
83
+
84
+ Built-in styles hide elements with Tasty's `hide` instead of `display: none`.
85
+ `hide` takes priority over `display`, so override `hide` to show or hide
86
+ `MobileMenuToggle`, `Pagination`, `Search.Close`,
87
+ `SearchResults.EngineControls`, `SearchResults.SuppressedClear`, and the
88
+ `Document` utilities `PrintHidden`, `DesktopBlock`, `DesktopFlex`,
89
+ `NarrowBlock`, and `MobileBlock`.
90
+
91
+ `theme.styles.Card` overrides of `fill`, `shadow`, and `translate` now also
92
+ apply to linked Cards. Their hover and pressed values are `:any-link & :hover`
93
+ and `:any-link & :active` states of those properties, so a plain value such as
94
+ `fill: "#surface"` also replaces them.
95
+
96
+ The `clear` palette role is removed. Tasty 3.11 compiles `#clear` to
97
+ `transparent` without reading a theme token, so a customized
98
+ `theme.palette.clear` no longer has any effect. A leftover entry now defines an
99
+ unused custom color; delete it.
100
+
101
+ GitHub alerts (`MarkdownAlert`) now use the status palette roles that `Callout`
102
+ uses: `info`, `success`, `warning`, and `danger`, instead of `blue`, `green`,
103
+ and `red`. The default colors are unchanged. If you set `theme.palette.blue`,
104
+ `green`, or `red` to restyle alerts, set `info`, `success`, or `danger`
105
+ instead; those also restyle Callouts.
106
+
107
+ ### Component overrides and edit links
108
+
109
+ `components.overrides` accepts only the
110
+ [documented slot names](./configuration.md#components). An unknown name, such
111
+ as a misspelled `Foter`, used to be ignored and now fails validation with
112
+ `DOCS_CONFIG_UNKNOWN_KEY`.
113
+
114
+ `cookbook doctor` resolves override paths from the Astro project directory,
115
+ as the build does. Start local paths with `./`: a value such as
116
+ `src/Header.astro` is a package specifier, which the build cannot resolve
117
+ either, and doctor now reports it as `DOCS_COMPONENT_UNRESOLVED`.
118
+
119
+ Package pages no longer get an edit link from `editLink.baseUrl`. That link
120
+ pointed into your repository at a file that exists only in the npm artifact.
121
+ A package page still shows an edit link when its own frontmatter sets
122
+ `editUrl`.
123
+
124
+ ## 0.23.x to 0.28
125
+
126
+ These releases need no configuration changes, but they can affect custom
127
+ scripts, hard-coded links, and apps that share the reader's appearance:
128
+
129
+ - **Client navigation (0.24):** internal links swap pages without a full
130
+ reload. Bundled scripts are not rerun after a client navigation, so attach
131
+ custom browser behavior through custom-element lifecycle callbacks or
132
+ initialize it on `astro:page-load`. See
133
+ [client navigation](./site-navigation.md#client-navigation).
134
+ - **Prefetching (0.25):** Astro's hover and focus prefetching is enabled by
135
+ default. Set `prefetch: false` in the Astro configuration to turn it off;
136
+ explicit Astro `prefetch` settings are preserved.
137
+ - **Page URLs (0.25.1):** page URLs follow Astro's `trailingSlash` and
138
+ `build.format`. With the default directory output, internal links, canonicals,
139
+ and `llms.txt` use a trailing slash, such as `/guide/`. See
140
+ [deployment](./deployment.md#public-url-and-base-path).
141
+ - **Appearance storage (0.25.4):** the reader's color scheme and contrast are
142
+ stored together in one `cookbook-appearance` entry. A scheme saved under the
143
+ previous `cookbook-theme` key is still read and moves to the new entry on the
144
+ next change. See [reader appearance](./theme-and-components.md#reader-appearance).
145
+
146
+ ## 0.22.x to 0.23
147
+
148
+ Cookbook 0.23 extends Tasty `data-element` identities to all owned anatomy,
149
+ expresses state with data modifiers, and uses one responsive width scale.
150
+
151
+ ### Root hooks, anatomy, and button variants
152
+
153
+ Existing component root classes and Logo’s root `class` prop remain supported.
154
+ Stable generated-content root classes remain available for global ownership, including
155
+ `.cookbook-markdown-content`, `.cookbook-heading-wrapper`, `.td-code-block`,
156
+ `.tasty-code`, `.cookbook-alert`, and `.td-mermaid`. Custom roots may also use classes
157
+ or `data-component`.
158
+
159
+ Owned sub-elements use `data-element` identities, and state uses data modifiers.
160
+ Keep identity matching in structural `$` selectors. For example, hero actions use
161
+ `data-element="Action"` with `data-primary`, `data-secondary`, or `data-minimal`.
162
+ When customizing `Hero.PrimaryAction`, keep its variant condition in a property
163
+ map, such as `color: { "@own(primary)": "#accent-text" }`.
164
+
165
+ The code-block wrapper owns `data-diff` and `data-copy-state`; code and line rules
166
+ use plain `diff` or `copy-state=copied` state keys. Line insertion/deletion flags
167
+ belong to the line itself and use `@own(inserted)` / `@own(deleted)`.
168
+
169
+ Heading wrappers carry `data-heading` and `level=h1` through `level=h6` states.
170
+ Linked Cards carry `data-block` for prose spacing. Shared `@prose`, `@prose-block`,
171
+ and `@prose-heading` conditions keep repeated Markdown declarations readable while
172
+ preserving isolated `data-not-content` descendants and conditional omissions.
173
+
174
+ Syntax transformers may emit root classes. Token/category hooks use modifiers,
175
+ for example `SyntaxHighlight: { Keyword: { color: { "@own(syntax-keyword)": "#accent-text" } } }`.
176
+ Tasty-generated style hashes and library-owned Pagefind sub-element classes remain.
177
+
178
+ Hero buttons stay stationary on hover. Minimal actions share secondary outline
179
+ padding, background, and border width, with a transparent border (`border: "#clear"`).
180
+ Pagination links keep their border at rest; hover changes only colors,
181
+ preserving `theme.styles.Pagination.Link` border width and style.
182
+
183
+ ### Responsive states
184
+
185
+ Responsive aliases now use one width scale: `@sm` (>40rem), `@md` (≥50rem), and
186
+ `@lg` (≥72rem). The conditions select wider viewports;
187
+ the exclusive 40rem boundary preserves the former `@small` behavior. The renderer
188
+ keeps its existing responsive thresholds.
189
+ Use these replacements for the removed shortcuts in custom style maps:
190
+
191
+ | Removed alias | Replacement |
192
+ | ---------------- | -------------------- |
193
+ | `@small` | `!@sm` |
194
+ | `@mobile` | `!@md` |
195
+ | `@narrow-layout` | `!@lg` |
196
+ | `@desktop` | `@md` |
197
+ | `@compact` | `@media(w <= 23rem)` |
198
+ | `@shell-mobile` | `@media(w <= 48rem)` |
199
+ | `@shell-desktop` | `@media(w > 48rem)` |
200
+ | `@medium-layout` | `@md & !@lg` |
201
+ | `@popover-open` | `:popover-open` |
202
+
203
+ Inside a selected descendant's condition, use `@own(:popover-open)`.
204
+ The shell and medium-layout aliases were unused by built-in components;
205
+ PackageVersion's 23rem rule is now a direct media condition. Define a project
206
+ alias in `theme.states` if you need a named threshold across your own components.
207
+
208
+ If you customized `theme.states`, rename your breakpoint definitions and invert
209
+ the old upper-bound conditions. For example, `"@mobile": "@media(w < 43rem)"`
210
+ becomes `"@md": "@media(w >= 43rem)"`.
211
+
212
+ ## 0.20.x to 0.21
213
+
214
+ Cookbook 0.21 removes the legacy theme naming and styling compatibility paths.
215
+ 0.21.2 moved Header, Footer, and logo anatomy to `data-element` identities and
216
+ heading levels to state maps.
42
217
 
43
218
  Use canonical Glaze palette names throughout configuration and color
44
219
  references. Replace `theme.palette.textSoft` with `theme.palette["text-soft"]`
@@ -65,6 +240,8 @@ For a custom component, use `defineComponent(name, options)`. For custom global
65
240
  rules, pass `resolveComponentStyles(name, baseStyles)` to `useGlobalStyles()`.
66
241
  Both merge `theme.customStyles[name]` into the complete base styles during
67
242
  server rendering. See [custom components](./custom-components.md).
243
+ The compact language selector's former `Compact` hook is now a root state:
244
+ customize it with `LanguageSelect: { border: { "[data-compact]": "4px solid #border" } }`.
68
245
 
69
246
  ## 0.19.x to 0.20
70
247
 
@@ -118,8 +295,9 @@ These changes were introduced in 0.18:
118
295
  - **Google fonts:** family-name shorthand loads preset weights and italics and
119
296
  self-hosts the files. The initial build requires network access. Preserve the
120
297
  Astro font cache for offline rebuilds, use local files for checked-in assets,
121
- or select `theme.fontLoading.google: "remote"` for CDN delivery. See
122
- [fonts](./fonts-and-typography.md#change-font-families).
298
+ or select `theme.fontLoading.google: "remote"` for CDN delivery. Weights set
299
+ through CSS variables that cannot be resolved from presets require explicit
300
+ `weights`. See [fonts](./fonts-and-typography.md#change-font-families).
123
301
  - **Colors:** body tone 0 and heading tone 4 remain the reading defaults.
124
302
  The default logo uses fixed Glaze colors (`logo-surface` and `logo-mark`), so
125
303
  its book stays light in dark mode. Customize these independently of accents.
@@ -168,6 +346,13 @@ Version 0.17.1 restored strong body/heading colors with absolute Glaze tones.
168
346
  If you added temporary contrast workarounds in 0.17.0, compare them with those
169
347
  defaults before carrying them forward.
170
348
 
349
+ ## 0.14 to 0.15
350
+
351
+ The Appearance panel combines the color scheme and contrast controls in
352
+ `ThemeSelect`. Replace `ThemeSelect` `Select` and `Picker` overrides with
353
+ `Trigger` and `Panel`, and move `ContrastSelect` overrides to the same
354
+ `ThemeSelect` panel and option sub-elements.
355
+
171
356
  ## Upgrading from before 0.14
172
357
 
173
358
  The shared-configuration and source-identity changes shipped in **0.14.0**.
@@ -200,65 +385,3 @@ Apply these steps if your project still uses the earlier contracts:
200
385
 
201
386
  See [authoring](./authoring.mdx) for component usage and
202
387
  [working examples](./examples.md) for repository configuration patterns.
203
-
204
- ## Root hooks, anatomy, and button variants
205
-
206
- Existing component root classes and Logo’s root `class` prop remain supported.
207
- Stable generated-content root classes remain available for global ownership, including
208
- `.cookbook-markdown-content`, `.cookbook-heading-wrapper`, `.td-code-block`,
209
- `.tasty-code`, `.cookbook-alert`, and `.td-mermaid`. Custom roots may also use classes
210
- or `data-component`.
211
-
212
- Owned sub-elements use `data-element` identities, and state uses data modifiers.
213
- Keep identity matching in structural `$` selectors. For example, hero actions use
214
- `data-element="Action"` with `data-primary`, `data-secondary`, or `data-minimal`.
215
- When customizing `Hero.PrimaryAction`, keep its variant condition in a property
216
- map, such as `color: { "@own(primary)": "#accent-text" }`.
217
-
218
- The code-block wrapper owns `data-diff` and `data-copy-state`; code and line rules
219
- use plain `diff` or `copy-state=copied` state keys. Line insertion/deletion flags
220
- belong to the line itself and use `@own(inserted)` / `@own(deleted)`.
221
-
222
- Heading wrappers carry `data-heading` and `level=h1` through `level=h6` states.
223
- Linked Cards carry `data-block` for prose spacing. Shared `@prose`, `@prose-block`,
224
- and `@prose-heading` conditions keep repeated Markdown declarations readable while
225
- preserving isolated `data-not-content` descendants and conditional omissions.
226
-
227
- Syntax transformers may emit root classes. Token/category hooks use modifiers,
228
- for example `SyntaxHighlight: { Keyword: { color: { "@own(syntax-keyword)": "#accent-text" } } }`.
229
- Tasty-generated style hashes and library-owned Pagefind sub-element classes remain.
230
-
231
- Hero buttons stay stationary on hover. Minimal actions share secondary outline
232
- padding, background, and border width, with a transparent border (`border: "#clear"`).
233
- Pagination links keep their border at rest; hover changes only colors,
234
- preserving `theme.styles.Pagination.Link` border width and style.
235
-
236
- ## Smaller shared state set
237
-
238
- Responsive aliases now use one width scale: `@sm` (>40rem), `@md` (≥50rem), and
239
- `@lg` (≥72rem). The conditions select wider viewports;
240
- the exclusive 40rem boundary preserves the former `@small` behavior. The renderer
241
- keeps its existing responsive thresholds.
242
- Use these replacements for the removed shortcuts in custom style maps:
243
-
244
- | Removed alias | Replacement |
245
- | ---------------- | -------------------- |
246
- | `@small` | `!@sm` |
247
- | `@mobile` | `!@md` |
248
- | `@narrow-layout` | `!@lg` |
249
- | `@desktop` | `@md` |
250
- | `@compact` | `@media(w <= 23rem)` |
251
- | `@shell-mobile` | `@media(w <= 48rem)` |
252
- | `@shell-desktop` | `@media(w > 48rem)` |
253
- | `@medium-layout` | `@md & !@lg` |
254
- | `@popover-open` | `:is(:popover-open)` |
255
-
256
- Inside a selected descendant's condition, use `@own(:is(:popover-open))`.
257
- The `:is()` wrapper accommodates the pinned linter's pseudo-class list.
258
- The shell and medium-layout aliases were unused by built-in components;
259
- PackageVersion's 23rem rule is now a direct media condition. Define a project
260
- alias in `theme.states` if you need a named threshold across your own components.
261
-
262
- If you customized `theme.states`, rename your breakpoint definitions and invert
263
- the old upper-bound conditions. For example, `"@mobile": "@media(w < 43rem)"`
264
- becomes `"@md": "@media(w >= 43rem)"`.