@canopy-iiif/app 0.10.14 → 0.10.16
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/lib/build/iiif.js +4 -0
- package/lib/build/pages.js +20 -2
- package/lib/common.js +33 -2
- package/lib/search/search.js +12 -2
- package/package.json +1 -1
- package/ui/dist/index.mjs +17 -3
- package/ui/dist/index.mjs.map +2 -2
- package/ui/dist/server.mjs +17 -3
- package/ui/dist/server.mjs.map +2 -2
- package/ui/styles/base/_heading.scss +7 -0
- package/ui/styles/base/_utilities.scss +4 -0
- package/ui/styles/components/_work.scss +36 -0
- package/ui/styles/components/index.scss +1 -0
- package/ui/styles/index.css +103 -65
- package/ui/styles/index.scss +1 -1
package/lib/build/iiif.js
CHANGED
|
@@ -12,6 +12,7 @@ const {
|
|
|
12
12
|
ensureDirSync,
|
|
13
13
|
htmlShell,
|
|
14
14
|
rootRelativeHref,
|
|
15
|
+
canopyBodyClassForType,
|
|
15
16
|
} = require("../common");
|
|
16
17
|
const mdx = require("./mdx");
|
|
17
18
|
const {log, logLine, logResponse} = require("./log");
|
|
@@ -1618,12 +1619,15 @@ async function buildIiifCollectionPages(CONFIG) {
|
|
|
1618
1619
|
} catch (_) {}
|
|
1619
1620
|
let pageBody = body;
|
|
1620
1621
|
const headExtra = headSegments.join("") + vendorTag;
|
|
1622
|
+
const pageType = (pageDetails && pageDetails.type) || "work";
|
|
1623
|
+
const bodyClass = canopyBodyClassForType(pageType);
|
|
1621
1624
|
let html = htmlShell({
|
|
1622
1625
|
title,
|
|
1623
1626
|
body: pageBody,
|
|
1624
1627
|
cssHref: null,
|
|
1625
1628
|
scriptHref: jsRel,
|
|
1626
1629
|
headExtra,
|
|
1630
|
+
bodyClass,
|
|
1627
1631
|
});
|
|
1628
1632
|
try {
|
|
1629
1633
|
html = require("../common").applyBaseToHtml(html);
|
package/lib/build/pages.js
CHANGED
|
@@ -1,4 +1,13 @@
|
|
|
1
|
-
const {
|
|
1
|
+
const {
|
|
2
|
+
fs,
|
|
3
|
+
fsp,
|
|
4
|
+
path,
|
|
5
|
+
CONTENT_DIR,
|
|
6
|
+
OUT_DIR,
|
|
7
|
+
ensureDirSync,
|
|
8
|
+
htmlShell,
|
|
9
|
+
canopyBodyClassForType,
|
|
10
|
+
} = require('../common');
|
|
2
11
|
const { log } = require('./log');
|
|
3
12
|
const mdx = require('./mdx');
|
|
4
13
|
const navigation = require('../components/navigation');
|
|
@@ -210,7 +219,16 @@ async function renderContentMdxToHtml(filePath, outPath, extraProps = {}) {
|
|
|
210
219
|
if (extraStyles.length) headSegments.push(extraStyles.join(''));
|
|
211
220
|
if (extraScripts.length) headSegments.push(extraScripts.join(''));
|
|
212
221
|
const headExtra = headSegments.join('') + vendorTag;
|
|
213
|
-
const
|
|
222
|
+
const typeForClass = resolvedType || 'page';
|
|
223
|
+
const bodyClass = canopyBodyClassForType(typeForClass);
|
|
224
|
+
const html = htmlShell({
|
|
225
|
+
title,
|
|
226
|
+
body,
|
|
227
|
+
cssHref: null,
|
|
228
|
+
scriptHref: jsRel,
|
|
229
|
+
headExtra,
|
|
230
|
+
bodyClass,
|
|
231
|
+
});
|
|
214
232
|
const { applyBaseToHtml } = require('../common');
|
|
215
233
|
return applyBaseToHtml(html);
|
|
216
234
|
}
|
package/lib/common.js
CHANGED
|
@@ -64,7 +64,35 @@ async function cleanDir(dir) {
|
|
|
64
64
|
await fsp.mkdir(dir, { recursive: true });
|
|
65
65
|
}
|
|
66
66
|
|
|
67
|
-
function
|
|
67
|
+
function normalizeClassList(value) {
|
|
68
|
+
if (!value) return '';
|
|
69
|
+
const list = Array.isArray(value) ? value : [value];
|
|
70
|
+
const classes = [];
|
|
71
|
+
for (const entry of list) {
|
|
72
|
+
if (!entry && entry !== 0) continue;
|
|
73
|
+
const raw = String(entry)
|
|
74
|
+
.split(/\s+/)
|
|
75
|
+
.map((segment) => segment.trim())
|
|
76
|
+
.filter(Boolean);
|
|
77
|
+
classes.push(...raw);
|
|
78
|
+
}
|
|
79
|
+
const unique = classes.filter(Boolean);
|
|
80
|
+
return unique.length ? unique.join(' ') : '';
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
function canopyBodyClassForType(type) {
|
|
84
|
+
const raw = String(type == null || type === '' ? 'page' : type)
|
|
85
|
+
.trim()
|
|
86
|
+
.toLowerCase();
|
|
87
|
+
const slug = raw
|
|
88
|
+
.replace(/[^a-z0-9_-]+/g, '-')
|
|
89
|
+
.replace(/^-+/, '')
|
|
90
|
+
.replace(/-+$/, '');
|
|
91
|
+
if (!slug) return 'canopy-type-page';
|
|
92
|
+
return `canopy-type-${slug}`;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
function htmlShell({ title, body, cssHref, scriptHref, headExtra, bodyClass }) {
|
|
68
96
|
const scriptTag = scriptHref ? `<script defer src="${scriptHref}"></script>` : '';
|
|
69
97
|
const extra = headExtra ? String(headExtra) : '';
|
|
70
98
|
const cssTag = cssHref ? `<link rel="stylesheet" href="${cssHref}">` : '';
|
|
@@ -72,7 +100,9 @@ function htmlShell({ title, body, cssHref, scriptHref, headExtra }) {
|
|
|
72
100
|
const htmlClass = appearance === 'dark' ? ' class="dark"' : '';
|
|
73
101
|
const hasCustomTitle = /<title\b/i.test(extra);
|
|
74
102
|
const titleTag = hasCustomTitle ? '' : `<title>${title}</title>`;
|
|
75
|
-
|
|
103
|
+
const bodyClassName = normalizeClassList(bodyClass);
|
|
104
|
+
const bodyAttr = bodyClassName ? ` class="${bodyClassName}"` : '';
|
|
105
|
+
return `<!doctype html><html lang="en"${htmlClass}><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/>${titleTag}${extra}${cssTag}${scriptTag}</head><body${bodyAttr}>${body}</body></html>`;
|
|
76
106
|
}
|
|
77
107
|
|
|
78
108
|
function withBase(href) {
|
|
@@ -173,4 +203,5 @@ module.exports = {
|
|
|
173
203
|
absoluteUrl,
|
|
174
204
|
applyBaseToHtml,
|
|
175
205
|
rootRelativeHref,
|
|
206
|
+
canopyBodyClassForType,
|
|
176
207
|
};
|
package/lib/search/search.js
CHANGED
|
@@ -1,7 +1,16 @@
|
|
|
1
1
|
const React = require('react');
|
|
2
2
|
const ReactDOMServer = require('react-dom/server');
|
|
3
3
|
const crypto = require('crypto');
|
|
4
|
-
const {
|
|
4
|
+
const {
|
|
5
|
+
path,
|
|
6
|
+
withBase,
|
|
7
|
+
rootRelativeHref,
|
|
8
|
+
ensureDirSync,
|
|
9
|
+
OUT_DIR,
|
|
10
|
+
htmlShell,
|
|
11
|
+
fsp,
|
|
12
|
+
canopyBodyClassForType,
|
|
13
|
+
} = require('../common');
|
|
5
14
|
|
|
6
15
|
async function ensureSearchRuntime() {
|
|
7
16
|
const { fs, path } = require('../common');
|
|
@@ -172,7 +181,8 @@ async function buildSearchPage() {
|
|
|
172
181
|
headExtra = `<script>window.CANOPY_BASE_PATH=${JSON.stringify(BASE_PATH)}</script>` + headExtra;
|
|
173
182
|
}
|
|
174
183
|
} catch (_) {}
|
|
175
|
-
|
|
184
|
+
const bodyClass = canopyBodyClassForType('search');
|
|
185
|
+
let html = htmlShell({ title: 'Search', body, cssHref: null, scriptHref: jsRel, headExtra, bodyClass });
|
|
176
186
|
try { html = require('../common').applyBaseToHtml(html); } catch (_) {}
|
|
177
187
|
await fsp.writeFile(outPath, html, 'utf8');
|
|
178
188
|
console.log('Search: Built', path.relative(process.cwd(), outPath));
|
package/package.json
CHANGED
package/ui/dist/index.mjs
CHANGED
|
@@ -228,9 +228,23 @@ function Grid({
|
|
|
228
228
|
|
|
229
229
|
// ui/src/layout/Container.jsx
|
|
230
230
|
import React5 from "react";
|
|
231
|
-
function Container({
|
|
232
|
-
|
|
233
|
-
|
|
231
|
+
function Container({
|
|
232
|
+
className = "",
|
|
233
|
+
variant = "content",
|
|
234
|
+
children,
|
|
235
|
+
...rest
|
|
236
|
+
}) {
|
|
237
|
+
const variantClass = variant === "wide" ? "max-w-wide" : "max-w-content";
|
|
238
|
+
const classes = ["mx-auto", variantClass, "w-full", className].filter(Boolean).join(" ");
|
|
239
|
+
return /* @__PURE__ */ React5.createElement(
|
|
240
|
+
"div",
|
|
241
|
+
{
|
|
242
|
+
className: classes,
|
|
243
|
+
...rest,
|
|
244
|
+
style: { ...rest.style, padding: "1.618rem" }
|
|
245
|
+
},
|
|
246
|
+
children
|
|
247
|
+
);
|
|
234
248
|
}
|
|
235
249
|
|
|
236
250
|
// ui/src/layout/Button.jsx
|