@janga/norna 0.7.22 → 0.7.23

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 (60) hide show
  1. package/astro.config.mjs +3 -0
  2. package/bin/norna-cli.mjs +2 -2
  3. package/package.json +17 -3
  4. package/schemas/category.schema.json +2 -2
  5. package/schemas/config.schema.json +22 -24
  6. package/schemas/content-frontmatter.schema.json +25 -5
  7. package/schemas/page-theme.schema.json +53 -25
  8. package/schemas/sitewide-content.schema.json +19 -18
  9. package/schemas/theme.schema.json +383 -250
  10. package/scripts/check-config.mjs +24 -4
  11. package/scripts/deploy-site.mjs +0 -1
  12. package/scripts/dev-local.mjs +175 -112
  13. package/scripts/lib/content-sync-apply.mjs +34 -0
  14. package/scripts/lib/content-sync-plan.mjs +179 -0
  15. package/scripts/lib/editor-language-service.mjs +128 -0
  16. package/scripts/lib/heading-ids.mjs +1 -1
  17. package/scripts/lib/image-presentation.mjs +2 -0
  18. package/scripts/lib/markdown-links.mjs +182 -0
  19. package/scripts/lib/navigation-model.mjs +25 -14
  20. package/scripts/lib/norna-markdown-blocks.mjs +1 -0
  21. package/scripts/lib/page-aliases.mjs +164 -0
  22. package/scripts/lib/page-markdown.mjs +56 -6
  23. package/scripts/lib/presentation.mjs +19 -37
  24. package/scripts/lib/project-config.mjs +50 -29
  25. package/scripts/lib/schema-definitions.mjs +24 -13
  26. package/scripts/lib/schema-editor-metadata.mjs +43 -30
  27. package/scripts/lib/schema-value-definitions.mjs +6 -2
  28. package/scripts/lib/site-content.mjs +26 -4
  29. package/scripts/lib/site-link-graph.mjs +326 -0
  30. package/scripts/lib/site-page-urls.mjs +10 -0
  31. package/scripts/lib/sitemap.mjs +34 -0
  32. package/scripts/lib/theme-presets.mjs +51 -23
  33. package/scripts/lib/theme-profiles.mjs +7 -5
  34. package/scripts/lib/yaml-config.mjs +6 -2
  35. package/scripts/sync-content-sections.mjs +116 -213
  36. package/scripts/sync-site-public.mjs +23 -2
  37. package/src/components/CodeBlockCopyScript.astro +92 -0
  38. package/src/components/DisplaySettings.astro +4 -4
  39. package/src/components/ImageCarousel.astro +7 -3
  40. package/src/components/NavigationPageTree.astro +44 -60
  41. package/src/components/PageAliasRedirect.astro +49 -0
  42. package/src/components/PageContentsNavigation.astro +21 -0
  43. package/src/components/SectionNavigationScript.astro +62 -6
  44. package/src/components/SiteNavigation.astro +15 -3
  45. package/src/components/SitePage.astro +42 -2
  46. package/src/components/SiteSection.astro +5 -0
  47. package/src/components/SiteTreeNavigation.astro +0 -1
  48. package/src/content.config.ts +5 -2
  49. package/src/layouts/BaseLayout.astro +14 -8
  50. package/src/lib/readerPreferencesScript.mjs +2 -2
  51. package/src/lib/sitePages.ts +3 -2
  52. package/src/pages/[...slug].astro +35 -8
  53. package/src/styles/content.css +494 -0
  54. package/src/styles/foundations.css +284 -0
  55. package/src/styles/global.css +6 -2510
  56. package/src/styles/media.css +523 -0
  57. package/src/styles/navigation.css +495 -0
  58. package/src/styles/page-layout.css +437 -0
  59. package/src/styles/responsive.css +525 -0
  60. package/starters/basic/README.md +1 -1
@@ -0,0 +1,326 @@
1
+ import { readdir, readFile } from 'node:fs/promises';
2
+ import path from 'node:path';
3
+ import {
4
+ createPageAliasModel,
5
+ } from './page-aliases.mjs';
6
+ import { parsePageMarkdownSource } from './page-markdown.mjs';
7
+ import {
8
+ parseContentFrontmatter,
9
+ splitSiteFile,
10
+ toPosixPath,
11
+ } from './site-content.mjs';
12
+ import {
13
+ sitePagesLabel,
14
+ sitePublicDir,
15
+ sitePublicLabel,
16
+ } from './site-paths.mjs';
17
+ import { getSiteNodePathname } from './site-page-urls.mjs';
18
+ import { getSiteStructure } from './site-structure.mjs';
19
+
20
+ const internalUrlOrigin = 'https://norna.invalid';
21
+ const externalSchemePattern = /^[a-z][a-z0-9+.-]*:/i;
22
+
23
+ const readPublicFiles = async (directory, relativeDirectory = '') => {
24
+ const entries = await readdir(directory, { withFileTypes: true }).catch((error) => {
25
+ if (error?.code === 'ENOENT') return [];
26
+ throw error;
27
+ });
28
+ const files = [];
29
+
30
+ for (const entry of entries.sort((left, right) => left.name.localeCompare(right.name, 'en'))) {
31
+ const relativePath = relativeDirectory
32
+ ? path.join(relativeDirectory, entry.name)
33
+ : entry.name;
34
+ const entryPath = path.join(directory, entry.name);
35
+ if (entry.isDirectory()) {
36
+ files.push(...await readPublicFiles(entryPath, relativePath));
37
+ } else if (entry.isFile()) {
38
+ files.push({
39
+ filePath: entryPath,
40
+ label: `${sitePublicLabel}/${toPosixPath(relativePath)}`,
41
+ pathname: `/${toPosixPath(relativePath)}`,
42
+ });
43
+ }
44
+ }
45
+
46
+ return files;
47
+ };
48
+
49
+ const decodePathname = (pathname) => {
50
+ const decodedSegments = pathname.split('/').map((segment) => decodeURIComponent(segment));
51
+ if (decodedSegments.some((segment) => segment.includes('/') || segment.includes('\\') || segment.includes('\0'))) {
52
+ throw new Error('Encoded slashes, backslashes, and null bytes are not valid internal paths.');
53
+ }
54
+ return decodedSegments.join('/');
55
+ };
56
+
57
+ const decodeFragment = (fragment) => decodeURIComponent(fragment);
58
+
59
+ const getPageLookupPathname = (pathname) => {
60
+ if (pathname === '/' || pathname === '/index.html') return '/';
61
+ if (pathname.endsWith('/index.html')) return pathname.slice(0, -'index.html'.length);
62
+ if (pathname.endsWith('/')) return pathname;
63
+ const finalSegment = pathname.split('/').at(-1) ?? '';
64
+ return finalSegment.includes('.') ? null : `${pathname}/`;
65
+ };
66
+
67
+ const isExternalTarget = (target) => target.startsWith('//') || externalSchemePattern.test(target);
68
+
69
+ export const resolveInternalTarget = (target, sourcePathname) => {
70
+ if (isExternalTarget(target)) return { kind: 'external' };
71
+
72
+ let url;
73
+ try {
74
+ url = new URL(target, `${internalUrlOrigin}${sourcePathname}`);
75
+ } catch {
76
+ return {
77
+ kind: 'invalid',
78
+ reason: 'The target is not a valid relative or site-relative URL.',
79
+ };
80
+ }
81
+
82
+ if (url.origin !== internalUrlOrigin) return { kind: 'external' };
83
+
84
+ try {
85
+ const pathname = decodePathname(url.pathname);
86
+ const fragment = url.hash.length > 1 ? decodeFragment(url.hash.slice(1)) : '';
87
+ return {
88
+ kind: 'internal',
89
+ fragment,
90
+ pageLookupPathname: getPageLookupPathname(pathname),
91
+ pathname,
92
+ query: url.search,
93
+ };
94
+ } catch (error) {
95
+ return {
96
+ kind: 'invalid',
97
+ reason: error instanceof Error ? error.message : String(error),
98
+ };
99
+ }
100
+ };
101
+
102
+ const createPageRecord = ({ contentFile, data = {}, document }) => {
103
+ const pathname = getSiteNodePathname(contentFile);
104
+ const anchors = new Map([['page-title', {
105
+ id: 'page-title',
106
+ line: document.pageTitle?.line ?? 1,
107
+ title: document.pageTitle?.title ?? 'Page title',
108
+ }]]);
109
+
110
+ for (const heading of document.headings) {
111
+ if ((heading.depth !== 2 && heading.depth !== 3) || !heading.id || anchors.has(heading.id)) continue;
112
+ anchors.set(heading.id, heading);
113
+ }
114
+
115
+ return {
116
+ aliases: data.page?.aliases ?? [],
117
+ anchors,
118
+ contentFile,
119
+ document,
120
+ pathname,
121
+ title: document.pageTitle?.title ?? contentFile.pageId,
122
+ };
123
+ };
124
+
125
+ const createIssue = (reference, code, message, fix) => ({
126
+ code,
127
+ fix,
128
+ message,
129
+ reference,
130
+ severity: 'error',
131
+ });
132
+
133
+ const getTargetKey = ({ fragment, pageLookupPathname, pathname }) => {
134
+ const identityPathname = pageLookupPathname ?? pathname;
135
+ return `${identityPathname}${fragment ? `#${fragment}` : ''}`;
136
+ };
137
+
138
+ const looksLikePublicFile = (pathname) => {
139
+ if (pathname.endsWith('/')) return false;
140
+ return (pathname.split('/').at(-1) ?? '').includes('.');
141
+ };
142
+
143
+ export const createSiteLinkGraph = ({ siteStructure, pageDocuments, publicFiles = [] }) => {
144
+ const documentsByDirectory = new Map(pageDocuments.map(({ contentFile, data, document }) => [
145
+ contentFile.pageDirectory,
146
+ { contentFile, data, document },
147
+ ]));
148
+ const pages = siteStructure.contentFiles.map((contentFile) => {
149
+ const pageDocument = documentsByDirectory.get(contentFile.pageDirectory);
150
+ if (!pageDocument) throw new Error(`No parsed Markdown document was provided for ${contentFile.contentLabel}.`);
151
+ return createPageRecord(pageDocument);
152
+ });
153
+ const pagesByPathname = new Map(pages.map((page) => [page.pathname, page]));
154
+ const categoriesByPathname = new Map(siteStructure.categories.map((category) => [
155
+ getSiteNodePathname(category),
156
+ { ...category, pathname: getSiteNodePathname(category) },
157
+ ]));
158
+ const publicFilesByPathname = new Map();
159
+ for (const file of publicFiles) {
160
+ publicFilesByPathname.set(file.pathname, file);
161
+ if (file.pathname === '/index.html') publicFilesByPathname.set('/', file);
162
+ if (file.pathname.endsWith('/index.html')) {
163
+ publicFilesByPathname.set(file.pathname.slice(0, -'index.html'.length), file);
164
+ }
165
+ }
166
+ const aliasModel = createPageAliasModel({
167
+ categories: siteStructure.categories,
168
+ pages,
169
+ publicFiles,
170
+ });
171
+
172
+ const references = [];
173
+ const referencesByTarget = new Map();
174
+ const diagnostics = [...aliasModel.diagnostics];
175
+
176
+ for (const page of pages) {
177
+ for (const sourceReference of page.document.links) {
178
+ const target = resolveInternalTarget(sourceReference.target, page.pathname);
179
+ if (target.kind === 'external') continue;
180
+
181
+ const reference = {
182
+ ...sourceReference,
183
+ sourceContentFile: page.contentFile,
184
+ sourcePage: page,
185
+ target,
186
+ };
187
+ references.push(reference);
188
+
189
+ if (target.kind === 'invalid') {
190
+ diagnostics.push(createIssue(
191
+ reference,
192
+ 'invalid-internal-url',
193
+ `Internal link "${sourceReference.target}" on line ${sourceReference.line} is invalid. ${target.reason}`,
194
+ 'Use a valid fragment, relative URL, site-relative URL, or external URL.',
195
+ ));
196
+ continue;
197
+ }
198
+
199
+ const targetKey = getTargetKey(target);
200
+ if (!referencesByTarget.has(targetKey)) referencesByTarget.set(targetKey, []);
201
+ referencesByTarget.get(targetKey).push(reference);
202
+
203
+ const targetPage = target.pageLookupPathname
204
+ ? pagesByPathname.get(target.pageLookupPathname)
205
+ : null;
206
+ if (targetPage) {
207
+ reference.resolution = { kind: 'page', page: targetPage, pathname: targetPage.pathname };
208
+ if (target.fragment && !targetPage.anchors.has(target.fragment)) {
209
+ const availableAnchors = Array.from(targetPage.anchors.keys());
210
+ const displayedAnchors = availableAnchors.slice(0, 8).map((anchor) => `#${anchor}`);
211
+ const omittedCount = availableAnchors.length - displayedAnchors.length;
212
+ diagnostics.push(createIssue(
213
+ reference,
214
+ 'missing-internal-anchor',
215
+ `Internal link "${sourceReference.target}" on line ${sourceReference.line} points to missing heading anchor "#${target.fragment}" on ${targetPage.pathname}.`,
216
+ availableAnchors.length > 0
217
+ ? `Use an existing anchor: ${displayedAnchors.join(', ')}${omittedCount > 0 ? `, and ${omittedCount} more` : ''}.`
218
+ : 'Add the intended H2 or H3 heading, or remove the fragment from the link.',
219
+ ));
220
+ }
221
+ continue;
222
+ }
223
+
224
+ const targetAlias = target.pageLookupPathname
225
+ ? aliasModel.aliasesByPathname.get(target.pageLookupPathname)
226
+ : null;
227
+ if (targetAlias) {
228
+ const aliasTargetPage = pagesByPathname.get(targetAlias.targetPathname);
229
+ if (!aliasTargetPage) {
230
+ throw new Error(`Page alias "${targetAlias.pathname}" has no target page ${targetAlias.targetPathname}.`);
231
+ }
232
+ reference.resolution = {
233
+ alias: targetAlias,
234
+ kind: 'page-alias',
235
+ page: aliasTargetPage,
236
+ pathname: aliasTargetPage.pathname,
237
+ };
238
+ if (target.fragment && !aliasTargetPage.anchors.has(target.fragment)) {
239
+ const availableAnchors = Array.from(aliasTargetPage.anchors.keys());
240
+ diagnostics.push(createIssue(
241
+ reference,
242
+ 'missing-internal-anchor',
243
+ `Internal link "${sourceReference.target}" on line ${sourceReference.line} points through alias ${targetAlias.pathname} to missing heading anchor "#${target.fragment}" on ${aliasTargetPage.pathname}.`,
244
+ availableAnchors.length > 0
245
+ ? `Use an existing anchor: ${availableAnchors.slice(0, 8).map((anchor) => `#${anchor}`).join(', ')}.`
246
+ : 'Add the intended H2 or H3 heading, or remove the fragment from the link.',
247
+ ));
248
+ }
249
+ continue;
250
+ }
251
+
252
+ const targetCategory = target.pageLookupPathname
253
+ ? categoriesByPathname.get(target.pageLookupPathname)
254
+ : null;
255
+ if (targetCategory) {
256
+ reference.resolution = { category: targetCategory, kind: 'category', pathname: targetCategory.pathname };
257
+ diagnostics.push(createIssue(
258
+ reference,
259
+ 'category-has-no-url',
260
+ `Internal link "${sourceReference.target}" on line ${sourceReference.line} points to navigation category ${targetCategory.pathname}, which does not have its own page.`,
261
+ 'Link to one of the category pages, or replace category.yaml with content.md when the collection needs its own page.',
262
+ ));
263
+ continue;
264
+ }
265
+
266
+ const publicFile = publicFilesByPathname.get(target.pathname);
267
+ if (publicFile) {
268
+ reference.resolution = { file: publicFile, kind: 'public-file', pathname: target.pathname };
269
+ continue;
270
+ }
271
+
272
+ if (looksLikePublicFile(target.pathname)) {
273
+ reference.resolution = { kind: 'missing-public-file', pathname: target.pathname };
274
+ diagnostics.push(createIssue(
275
+ reference,
276
+ 'missing-public-file',
277
+ `Internal link "${sourceReference.target}" on line ${sourceReference.line} points to public file "${target.pathname}", but no matching file exists under ${sitePublicLabel}/.`,
278
+ `Add the file under ${sitePublicLabel}/ with the same relative path, or correct the link.`,
279
+ ));
280
+ continue;
281
+ }
282
+
283
+ const missingPathname = target.pageLookupPathname ?? target.pathname;
284
+ reference.resolution = { kind: 'missing-page', pathname: missingPathname };
285
+ diagnostics.push(createIssue(
286
+ reference,
287
+ 'missing-internal-page',
288
+ `Internal link "${sourceReference.target}" on line ${sourceReference.line} points to page "${missingPathname}", but that page does not exist.`,
289
+ `Correct the link or create the page at the intended position under ${sitePagesLabel}/.`,
290
+ ));
291
+ }
292
+ }
293
+
294
+ return {
295
+ aliasModel,
296
+ aliases: aliasModel.aliases,
297
+ aliasesByPathname: aliasModel.aliasesByPathname,
298
+ categoriesByPathname,
299
+ diagnostics,
300
+ pages,
301
+ pagesByPathname,
302
+ publicFilesByPathname,
303
+ references,
304
+ referencesByTarget,
305
+ };
306
+ };
307
+
308
+ export const getSiteLinkGraph = async (options = {}) => {
309
+ const siteStructure = options.siteStructure ?? await getSiteStructure();
310
+ const [pageDocuments, publicFiles] = await Promise.all([
311
+ Promise.all(siteStructure.contentFiles.map(async (contentFile) => {
312
+ const source = await readFile(contentFile.contentPath, 'utf8');
313
+ const { frontmatterBody } = splitSiteFile(source, contentFile.contentLabel);
314
+ return {
315
+ contentFile,
316
+ data: parseContentFrontmatter(frontmatterBody, contentFile.contentLabel),
317
+ document: await parsePageMarkdownSource(source, { label: contentFile.contentLabel }),
318
+ };
319
+ })),
320
+ readPublicFiles(options.publicDir ?? sitePublicDir),
321
+ ]);
322
+
323
+ return createSiteLinkGraph({ pageDocuments, publicFiles, siteStructure });
324
+ };
325
+
326
+ export const getSitePublicFiles = async (publicDir = sitePublicDir) => readPublicFiles(publicDir);
@@ -0,0 +1,10 @@
1
+ export const getSiteNodePathname = (node) => node.isHome || !node.pagePath
2
+ ? '/'
3
+ : `/${node.pagePath}/`;
4
+
5
+ export const getAbsolutePageUrl = (siteUrl, pathname) => {
6
+ const baseUrl = new URL(siteUrl);
7
+ if (!baseUrl.pathname.endsWith('/')) baseUrl.pathname = `${baseUrl.pathname}/`;
8
+
9
+ return new URL(pathname === '/' ? '' : pathname.replace(/^\//, ''), baseUrl).href;
10
+ };
@@ -0,0 +1,34 @@
1
+ import { getAbsolutePageUrl, getSiteNodePathname } from './site-page-urls.mjs';
2
+
3
+ export const sitemapFilename = 'sitemap.xml';
4
+
5
+ const escapeXml = (value) => String(value)
6
+ .replaceAll('&', '&')
7
+ .replaceAll('<', '&lt;')
8
+ .replaceAll('>', '&gt;')
9
+ .replaceAll('"', '&quot;')
10
+ .replaceAll("'", '&apos;');
11
+
12
+ const compareStrings = (left, right) => left < right ? -1 : left > right ? 1 : 0;
13
+
14
+ export const getSitemapUrls = ({ siteStructure, siteUrl }) => (
15
+ siteStructure.contentFiles
16
+ .map((page) => getSiteNodePathname(page))
17
+ .sort(compareStrings)
18
+ .map((pathname) => getAbsolutePageUrl(siteUrl, pathname))
19
+ );
20
+
21
+ export const createSitemapXml = (options) => {
22
+ const urls = getSitemapUrls(options);
23
+ const lines = [
24
+ '<?xml version="1.0" encoding="UTF-8"?>',
25
+ '<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">',
26
+ ];
27
+
28
+ for (const url of urls) {
29
+ lines.push(' <url>', ` <loc>${escapeXml(url)}</loc>`, ' </url>');
30
+ }
31
+
32
+ lines.push('</urlset>');
33
+ return `${lines.join('\n')}\n`;
34
+ };
@@ -50,25 +50,25 @@ export const themePresetDefinitions = Object.freeze({
50
50
  title: 'Portfolio',
51
51
  description: 'For portfolios and image-led sites, with restrained typography and generous space for images.',
52
52
  recipe: themePresetRecipes.portfolio,
53
- readerControls: Object.freeze({ colorMode: true }),
53
+ readerControls: Object.freeze({ appearance: true }),
54
54
  }),
55
55
  documentation: Object.freeze({
56
56
  title: 'Documentation',
57
57
  description: 'For guides and reference material, with reading-focused typography and compact spacing.',
58
58
  recipe: themePresetRecipes.documentation,
59
- readerControls: Object.freeze({ colorMode: true, focusReading: true }),
59
+ readerControls: Object.freeze({ appearance: true, focusReading: true }),
60
60
  }),
61
61
  project: Object.freeze({
62
62
  title: 'Project',
63
63
  description: 'For project and product sites that balance explanation, code, cards, and images.',
64
64
  recipe: themePresetRecipes.project,
65
- readerControls: Object.freeze({ colorMode: true, focusReading: true }),
65
+ readerControls: Object.freeze({ appearance: true, focusReading: true }),
66
66
  }),
67
67
  statement: Object.freeze({
68
68
  title: 'Statement',
69
69
  description: 'For short, expressive sites, with larger typography, airy spacing, and stronger section emphasis.',
70
70
  recipe: themePresetRecipes.statement,
71
- readerControls: Object.freeze({ colorMode: true }),
71
+ readerControls: Object.freeze({ appearance: true }),
72
72
  }),
73
73
  });
74
74
 
@@ -115,35 +115,56 @@ export const resolveThemeConfig = (theme = {}, sourceLabel = 'theme.yaml') => {
115
115
  const overrides = structuredClone(theme ?? {});
116
116
  delete overrides.preset;
117
117
 
118
- return {
118
+ const resolved = {
119
119
  preset: presetName,
120
120
  ...mergeDeep(getThemePreset(presetName, sourceLabel), overrides),
121
121
  };
122
+
123
+ if (
124
+ overrides.images?.presentation === 'prose-aligned'
125
+ && overrides.images.maxAvailableHeightPercent === undefined
126
+ ) {
127
+ delete resolved.images.maxAvailableHeightPercent;
128
+ }
129
+
130
+ return resolved;
122
131
  };
123
132
 
124
133
  const mergePageThemePart = (base, override, keys) => Object.fromEntries(keys
125
134
  .filter((key) => override?.[key] !== undefined || base?.[key] !== undefined)
126
135
  .map((key) => [key, override?.[key] ?? base?.[key]]));
127
136
 
128
- export const mergePageThemeConfig = (base = {}, override = {}) => ({
129
- ...base,
130
- layout: {
131
- ...(base.layout ?? {}),
132
- ...mergePageThemePart(base.layout, override.layout, ['contentSpacing', 'textWidth']),
133
- },
134
- images: {
137
+ export const mergePageThemeConfig = (base = {}, override = {}) => {
138
+ const images = {
135
139
  ...(base.images ?? {}),
136
140
  ...mergePageThemePart(base.images, override.images, [
141
+ 'presentation',
137
142
  'width',
138
143
  'maxAvailableWidthPercent',
139
144
  'maxAvailableHeightPercent',
140
145
  ]),
141
- },
142
- sections: {
143
- ...(base.sections ?? {}),
144
- ...mergePageThemePart(base.sections, override.sections, ['backgroundPattern']),
145
- },
146
- });
146
+ };
147
+
148
+ if (
149
+ override.images?.presentation === 'prose-aligned'
150
+ && override.images.maxAvailableHeightPercent === undefined
151
+ ) {
152
+ delete images.maxAvailableHeightPercent;
153
+ }
154
+
155
+ return {
156
+ ...base,
157
+ layout: {
158
+ ...(base.layout ?? {}),
159
+ ...mergePageThemePart(base.layout, override.layout, ['contentSpacing', 'textWidth']),
160
+ },
161
+ images,
162
+ sections: {
163
+ ...(base.sections ?? {}),
164
+ ...mergePageThemePart(base.sections, override.sections, ['backgroundPattern']),
165
+ },
166
+ };
167
+ };
147
168
 
148
169
  const quote = (value) => JSON.stringify(value);
149
170
  const responsiveValueLines = (label, value, indent = 2) => {
@@ -158,7 +179,7 @@ const responsiveValueLines = (label, value, indent = 2) => {
158
179
  export const renderThemePresetReference = (presetName, sourceLabel = 'theme.yaml') => {
159
180
  const preset = getThemePreset(presetName, sourceLabel);
160
181
  const metadata = getThemePresetMetadata(presetName);
161
- const { colorMode, readerControls, corners, layout, images, blocks, typography, palette, sections } = preset;
182
+ const { appearance, readerControls, corners, layout, images, blocks, typography, palette, sections } = preset;
162
183
 
163
184
  return [
164
185
  `# Original values for Norna's "${presetName}" theme preset.`,
@@ -169,12 +190,12 @@ export const renderThemePresetReference = (presetName, sourceLabel = 'theme.yaml
169
190
  `preset: ${presetName}`,
170
191
  '',
171
192
  '# Initial appearance. System follows the visitor\'s operating-system preference.',
172
- 'colorMode:',
173
- ` default: ${colorMode.default}`,
193
+ 'appearance:',
194
+ ` default: ${appearance.default}`,
174
195
  '',
175
196
  '# Optional reader controls shown with the always-available reading-width choice.',
176
197
  'readerControls:',
177
- ` colorMode: ${readerControls.colorMode === true}`,
198
+ ` appearance: ${readerControls.appearance === true}`,
178
199
  ` focusReading: ${readerControls.focusReading === true}`,
179
200
  '',
180
201
  '# Alternatives: square, rounded.',
@@ -194,11 +215,18 @@ export const renderThemePresetReference = (presetName, sourceLabel = 'theme.yaml
194
215
  ' # firstSectionTop, headingToBlock, imageGap, and sectionGap.',
195
216
  '',
196
217
  'images:',
218
+ ' # Alternatives: prose-aligned, centered-fit.',
219
+ ` presentation: ${images.presentation}`,
197
220
  ' # width accepts a positive CSS length.',
198
221
  ` width: ${images.width}`,
199
222
  ' # Percent values must be greater than 0 and at most 100.',
200
223
  ...responsiveValueLines('maxAvailableWidthPercent', images.maxAvailableWidthPercent),
201
- ...responsiveValueLines('maxAvailableHeightPercent', images.maxAvailableHeightPercent),
224
+ ...(images.maxAvailableHeightPercent
225
+ ? [
226
+ ' # Viewport-height limits apply only to centered-fit presentation.',
227
+ ...responsiveValueLines('maxAvailableHeightPercent', images.maxAvailableHeightPercent),
228
+ ]
229
+ : []),
202
230
  '',
203
231
  'blocks:',
204
232
  ' cardList:',
@@ -3,15 +3,15 @@ import { freezeDeep, mergeDeep } from './object.mjs';
3
3
  export const themeProfileDefinitions = freezeDeep({
4
4
  color: {
5
5
  'near-monochrome-dark': {
6
- colorMode: { default: 'dark' },
6
+ appearance: { default: 'dark' },
7
7
  palette: 'near-monochrome',
8
8
  },
9
9
  'near-monochrome-adaptive': {
10
- colorMode: { default: 'system' },
10
+ appearance: { default: 'system' },
11
11
  palette: 'near-monochrome',
12
12
  },
13
13
  'warm-paper-adaptive': {
14
- colorMode: { default: 'system' },
14
+ appearance: { default: 'system' },
15
15
  palette: 'warm-paper',
16
16
  },
17
17
  },
@@ -112,6 +112,7 @@ export const themeProfileDefinitions = freezeDeep({
112
112
  media: {
113
113
  prominent: {
114
114
  images: {
115
+ presentation: 'centered-fit',
115
116
  width: '1000px',
116
117
  maxAvailableWidthPercent: { desktop: 100, mobile: 100 },
117
118
  maxAvailableHeightPercent: { desktop: 78, mobile: 68 },
@@ -119,20 +120,21 @@ export const themeProfileDefinitions = freezeDeep({
119
120
  },
120
121
  supporting: {
121
122
  images: {
123
+ presentation: 'prose-aligned',
122
124
  width: '920px',
123
125
  maxAvailableWidthPercent: { desktop: 100, mobile: 100 },
124
- maxAvailableHeightPercent: { desktop: 74, mobile: 68 },
125
126
  },
126
127
  },
127
128
  balanced: {
128
129
  images: {
130
+ presentation: 'prose-aligned',
129
131
  width: '840px',
130
132
  maxAvailableWidthPercent: { desktop: 100, mobile: 100 },
131
- maxAvailableHeightPercent: { desktop: 70, mobile: 62 },
132
133
  },
133
134
  },
134
135
  immersive: {
135
136
  images: {
137
+ presentation: 'centered-fit',
136
138
  width: '1080px',
137
139
  maxAvailableWidthPercent: { desktop: 100, mobile: 100 },
138
140
  maxAvailableHeightPercent: { desktop: 80, mobile: 70 },
@@ -32,8 +32,12 @@ const getLegacyThemeHint = (issue, data) => {
32
32
  return 'Section background pattern "cycling" was replaced by "accented".';
33
33
  }
34
34
 
35
- if (location === 'readerControls' && issue.keys?.includes('appearance')) {
36
- return 'Reader control "appearance" was replaced by "colorMode".';
35
+ if (location === '' && issue.keys?.includes('colorMode')) {
36
+ return 'Theme setting "colorMode" was replaced by "appearance".';
37
+ }
38
+
39
+ if (location === 'readerControls' && issue.keys?.includes('colorMode')) {
40
+ return 'Reader control "colorMode" was replaced by "appearance".';
37
41
  }
38
42
 
39
43
  if (location === 'readerControls' && issue.keys?.includes('readingWidth')) {