@canopy-iiif/app 0.13.4 → 0.13.5
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/package.json +1 -1
- package/ui/dist/index.mjs +108 -85
- package/ui/dist/index.mjs.map +4 -4
- package/ui/dist/server.mjs +62 -39
- package/ui/dist/server.mjs.map +4 -4
package/ui/dist/server.mjs
CHANGED
|
@@ -3159,8 +3159,30 @@ function MdxSearchTabs(props) {
|
|
|
3159
3159
|
return /* @__PURE__ */ React30.createElement("div", { "data-canopy-search-tabs": "1" }, /* @__PURE__ */ React30.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
|
|
3160
3160
|
}
|
|
3161
3161
|
|
|
3162
|
-
// ui/src/search
|
|
3162
|
+
// ui/src/search/MdxSearch.jsx
|
|
3163
3163
|
import React31 from "react";
|
|
3164
|
+
function MdxSearch(props = {}) {
|
|
3165
|
+
const {
|
|
3166
|
+
layout,
|
|
3167
|
+
tabsProps = {},
|
|
3168
|
+
summaryProps = {},
|
|
3169
|
+
resultsProps = {},
|
|
3170
|
+
className = "",
|
|
3171
|
+
showTabs = true,
|
|
3172
|
+
showSummary = true,
|
|
3173
|
+
showResults = true,
|
|
3174
|
+
children
|
|
3175
|
+
} = props || {};
|
|
3176
|
+
const resultsPayload = resultsProps && typeof resultsProps === "object" ? { ...resultsProps } : {};
|
|
3177
|
+
if (typeof layout !== "undefined" && layout !== null && !resultsPayload.layout) {
|
|
3178
|
+
resultsPayload.layout = layout;
|
|
3179
|
+
}
|
|
3180
|
+
const classes = ["canopy-search", className].filter(Boolean).join(" ");
|
|
3181
|
+
return /* @__PURE__ */ React31.createElement("section", { className: classes, "data-canopy-search": "1" }, showTabs ? /* @__PURE__ */ React31.createElement(MdxSearchTabs, { ...tabsProps }) : null, showSummary ? /* @__PURE__ */ React31.createElement(SearchSummary, { ...summaryProps }) : null, showResults ? /* @__PURE__ */ React31.createElement(MdxSearchResults, { ...resultsPayload }) : null, children || null);
|
|
3182
|
+
}
|
|
3183
|
+
|
|
3184
|
+
// ui/src/search-form/MdxSearchFormModal.jsx
|
|
3185
|
+
import React32 from "react";
|
|
3164
3186
|
function MdxSearchFormModal(props = {}) {
|
|
3165
3187
|
const {
|
|
3166
3188
|
placeholder = "Search\u2026",
|
|
@@ -3176,11 +3198,11 @@ function MdxSearchFormModal(props = {}) {
|
|
|
3176
3198
|
const text = typeof label === "string" && label.trim() ? label.trim() : buttonLabel;
|
|
3177
3199
|
const resolvedSearchPath = resolveSearchPath(searchPath);
|
|
3178
3200
|
const data = { placeholder, hotkey, maxResults, groupOrder, label: text, searchPath: resolvedSearchPath };
|
|
3179
|
-
return /* @__PURE__ */
|
|
3201
|
+
return /* @__PURE__ */ React32.createElement("div", { "data-canopy-search-form": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React32.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React32.createElement(SearchPanelForm, { placeholder, buttonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React32.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React32.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
|
|
3180
3202
|
}
|
|
3181
3203
|
|
|
3182
3204
|
// ui/src/iiif/ManifestPrimitives.jsx
|
|
3183
|
-
import
|
|
3205
|
+
import React33 from "react";
|
|
3184
3206
|
import {
|
|
3185
3207
|
Label as CloverLabel,
|
|
3186
3208
|
Metadata as CloverMetadata,
|
|
@@ -3205,28 +3227,28 @@ function ensureMetadata(items) {
|
|
|
3205
3227
|
function Label({ manifest, label, ...rest }) {
|
|
3206
3228
|
const intl = label || manifest && manifest.label;
|
|
3207
3229
|
if (!hasInternationalValue(intl)) return null;
|
|
3208
|
-
return /* @__PURE__ */
|
|
3230
|
+
return /* @__PURE__ */ React33.createElement(CloverLabel, { label: intl, ...rest });
|
|
3209
3231
|
}
|
|
3210
3232
|
function Summary({ manifest, summary, ...rest }) {
|
|
3211
3233
|
const intl = summary || manifest && manifest.summary;
|
|
3212
3234
|
if (!hasInternationalValue(intl)) return null;
|
|
3213
|
-
return /* @__PURE__ */
|
|
3235
|
+
return /* @__PURE__ */ React33.createElement(CloverSummary, { summary: intl, ...rest });
|
|
3214
3236
|
}
|
|
3215
3237
|
function Metadata({ manifest, metadata, ...rest }) {
|
|
3216
3238
|
const items = ensureMetadata(metadata || manifest && manifest.metadata);
|
|
3217
3239
|
if (!items.length) return null;
|
|
3218
|
-
return /* @__PURE__ */
|
|
3240
|
+
return /* @__PURE__ */ React33.createElement(CloverMetadata, { metadata: items, ...rest });
|
|
3219
3241
|
}
|
|
3220
3242
|
function RequiredStatement({ manifest, requiredStatement, ...rest }) {
|
|
3221
3243
|
const stmt = requiredStatement || manifest && manifest.requiredStatement;
|
|
3222
3244
|
if (!stmt || !hasInternationalValue(stmt.label) || !hasInternationalValue(stmt.value)) {
|
|
3223
3245
|
return null;
|
|
3224
3246
|
}
|
|
3225
|
-
return /* @__PURE__ */
|
|
3247
|
+
return /* @__PURE__ */ React33.createElement(CloverRequiredStatement, { requiredStatement: stmt, ...rest });
|
|
3226
3248
|
}
|
|
3227
3249
|
|
|
3228
3250
|
// ui/src/docs/CodeBlock.jsx
|
|
3229
|
-
import
|
|
3251
|
+
import React34 from "react";
|
|
3230
3252
|
function parseHighlightAttr(attr) {
|
|
3231
3253
|
if (!attr) return /* @__PURE__ */ new Set();
|
|
3232
3254
|
const cleaned = String(attr || "").trim();
|
|
@@ -3272,10 +3294,10 @@ var highlightBaseStyle = {
|
|
|
3272
3294
|
};
|
|
3273
3295
|
function DocsCodeBlock(props = {}) {
|
|
3274
3296
|
const { children, ...rest } = props;
|
|
3275
|
-
const childArray =
|
|
3276
|
-
const codeElement = childArray.find((el) =>
|
|
3297
|
+
const childArray = React34.Children.toArray(children);
|
|
3298
|
+
const codeElement = childArray.find((el) => React34.isValidElement(el));
|
|
3277
3299
|
if (!codeElement || !codeElement.props) {
|
|
3278
|
-
return
|
|
3300
|
+
return React34.createElement("pre", props);
|
|
3279
3301
|
}
|
|
3280
3302
|
const {
|
|
3281
3303
|
className = "",
|
|
@@ -3290,8 +3312,8 @@ function DocsCodeBlock(props = {}) {
|
|
|
3290
3312
|
const highlightSet = parseHighlightAttr(highlightAttr);
|
|
3291
3313
|
const copyAttr = codeProps["data-copy"];
|
|
3292
3314
|
const enableCopy = copyAttr !== void 0 ? copyAttr === true || copyAttr === "true" || copyAttr === "" : false;
|
|
3293
|
-
const [copied, setCopied] =
|
|
3294
|
-
const handleCopy =
|
|
3315
|
+
const [copied, setCopied] = React34.useState(false);
|
|
3316
|
+
const handleCopy = React34.useCallback(async () => {
|
|
3295
3317
|
const text = rawCode;
|
|
3296
3318
|
try {
|
|
3297
3319
|
if (typeof navigator !== "undefined" && navigator.clipboard && navigator.clipboard.writeText) {
|
|
@@ -3356,20 +3378,20 @@ function DocsCodeBlock(props = {}) {
|
|
|
3356
3378
|
const highlight = highlightSet.has(lineNumber);
|
|
3357
3379
|
const style = highlight ? { ...baseLineStyle, ...highlightBaseStyle } : baseLineStyle;
|
|
3358
3380
|
const displayLine = line === "" ? " " : line;
|
|
3359
|
-
return
|
|
3381
|
+
return React34.createElement(
|
|
3360
3382
|
"span",
|
|
3361
3383
|
{ key: lineNumber, style },
|
|
3362
|
-
|
|
3384
|
+
React34.createElement("span", { style: lineContentStyle }, displayLine)
|
|
3363
3385
|
);
|
|
3364
3386
|
});
|
|
3365
|
-
return
|
|
3387
|
+
return React34.createElement(
|
|
3366
3388
|
"div",
|
|
3367
3389
|
{ style: containerStyle },
|
|
3368
|
-
showHeader ?
|
|
3390
|
+
showHeader ? React34.createElement(
|
|
3369
3391
|
"div",
|
|
3370
3392
|
{ style: headerStyle },
|
|
3371
|
-
|
|
3372
|
-
enableCopy ?
|
|
3393
|
+
React34.createElement("span", null, showFilename ? filename : null),
|
|
3394
|
+
enableCopy ? React34.createElement(
|
|
3373
3395
|
"button",
|
|
3374
3396
|
{
|
|
3375
3397
|
type: "button",
|
|
@@ -3388,29 +3410,29 @@ function DocsCodeBlock(props = {}) {
|
|
|
3388
3410
|
copied ? "Copied" : "Copy"
|
|
3389
3411
|
) : null
|
|
3390
3412
|
) : null,
|
|
3391
|
-
|
|
3413
|
+
React34.createElement(
|
|
3392
3414
|
"pre",
|
|
3393
3415
|
{ ...preRest, className: preClassName, style: mergedPreStyle },
|
|
3394
|
-
|
|
3416
|
+
React34.createElement("code", { style: codeStyle }, lineElements)
|
|
3395
3417
|
)
|
|
3396
3418
|
);
|
|
3397
3419
|
}
|
|
3398
3420
|
|
|
3399
3421
|
// ui/src/docs/MarkdownTable.jsx
|
|
3400
|
-
import
|
|
3422
|
+
import React35 from "react";
|
|
3401
3423
|
function MarkdownTable({ className = "", ...rest }) {
|
|
3402
3424
|
const merged = ["markdown-table", className].filter(Boolean).join(" ");
|
|
3403
|
-
return /* @__PURE__ */
|
|
3425
|
+
return /* @__PURE__ */ React35.createElement("div", { className: "markdown-table__frame" }, /* @__PURE__ */ React35.createElement("table", { className: merged, ...rest }));
|
|
3404
3426
|
}
|
|
3405
3427
|
|
|
3406
3428
|
// ui/src/docs/Diagram.jsx
|
|
3407
|
-
import
|
|
3429
|
+
import React36 from "react";
|
|
3408
3430
|
function CanopyDiagram() {
|
|
3409
|
-
return /* @__PURE__ */
|
|
3431
|
+
return /* @__PURE__ */ React36.createElement("div", { className: "canopy-diagram" }, /* @__PURE__ */ React36.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--collections" }, /* @__PURE__ */ React36.createElement("h3", null, "IIIF Collection(s)"), /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__section-summary" }, "Source collections contribute 105 total manifests that Canopy retrieves as-is via IIIF endpoints."), /* @__PURE__ */ React36.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Collection A"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "70 Manifests"), /* @__PURE__ */ React36.createElement("li", null, "IIIF Images + A/V"), /* @__PURE__ */ React36.createElement("li", null, "Textual Annotations"))), /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Collection B"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "35 Manifests"), /* @__PURE__ */ React36.createElement("li", null, "IIIF Images + A/V"), /* @__PURE__ */ React36.createElement("li", null, "Textual Annotations"))))), /* @__PURE__ */ React36.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React36.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--build" }, /* @__PURE__ */ React36.createElement("h3", null, "Canopy Build Process"), /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__section-summary" }, "Canopy syncs manifests, page content, and annotations before bundling the site."), /* @__PURE__ */ React36.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Automated content"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "105 manifests \u2192 105 work pages"), /* @__PURE__ */ React36.createElement("li", null, "One page per manifest"), /* @__PURE__ */ React36.createElement("li", null, "Customize page layout"))), /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Contextual content"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "Markdown & MDX pages"), /* @__PURE__ */ React36.createElement("li", null, "Author narratives & tours"), /* @__PURE__ */ React36.createElement("li", null, "Reference manifests inline"))), /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Search index"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "Combines works + pages"), /* @__PURE__ */ React36.createElement("li", null, "Customize result layout"), /* @__PURE__ */ React36.createElement("li", null, "Optional annotations"))))), /* @__PURE__ */ React36.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React36.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--output" }, /* @__PURE__ */ React36.createElement("h3", null, "Static Digital Project"), /* @__PURE__ */ React36.createElement("span", { className: "canopy-diagram__section-summary" }, "The output is a lightweight bundle of HTML, CSS, JS, and JSON assets that can deploy anywhere."), /* @__PURE__ */ React36.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Work pages"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "105 generated HTML pages"), /* @__PURE__ */ React36.createElement("li", null, "Each links back to source manifests"), /* @__PURE__ */ React36.createElement("li", null, "Styled with Canopy components"))), /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Custom pages"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "Markdown & MDX-authored content"), /* @__PURE__ */ React36.createElement("li", null, "Reusable layouts for narratives"), /* @__PURE__ */ React36.createElement("li", null, "Embed IIIF media & interstitials"))), /* @__PURE__ */ React36.createElement("article", null, /* @__PURE__ */ React36.createElement("h4", null, "Search bundle"), /* @__PURE__ */ React36.createElement("ul", null, /* @__PURE__ */ React36.createElement("li", null, "Static FlexSearch index"), /* @__PURE__ */ React36.createElement("li", null, "Works + pages share records"), /* @__PURE__ */ React36.createElement("li", null, "Optional annotation dataset"))))));
|
|
3410
3432
|
}
|
|
3411
3433
|
|
|
3412
3434
|
// ui/src/docs/ThemeShowcase.jsx
|
|
3413
|
-
import
|
|
3435
|
+
import React37 from "react";
|
|
3414
3436
|
|
|
3415
3437
|
// ../../node_modules/@radix-ui/colors/index.mjs
|
|
3416
3438
|
var colors_exports = {};
|
|
@@ -7243,21 +7265,21 @@ var ACCENT_COLOR_NAMES = [
|
|
|
7243
7265
|
"sky"
|
|
7244
7266
|
];
|
|
7245
7267
|
var GRAY_COLOR_NAMES = ["gray", "mauve", "slate", "sage", "olive", "sand"];
|
|
7246
|
-
var Section = ({ title, description, children }) => /* @__PURE__ */
|
|
7247
|
-
var ColorScaleRow = ({ label, prefix }) => /* @__PURE__ */
|
|
7268
|
+
var Section = ({ title, description, children }) => /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase__section" }, /* @__PURE__ */ React37.createElement("h3", { className: "canopy-theme-showcase__section-title" }, title), description ? /* @__PURE__ */ React37.createElement("p", { className: "canopy-theme-showcase__section-description" }, description) : null, children);
|
|
7269
|
+
var ColorScaleRow = ({ label, prefix }) => /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase__scale-row" }, /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase__scale-label" }, /* @__PURE__ */ React37.createElement("strong", null, label)), /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase__scale-track" }, COLOR_STOPS.map((stop) => /* @__PURE__ */ React37.createElement(
|
|
7248
7270
|
"div",
|
|
7249
7271
|
{
|
|
7250
7272
|
key: `${label}-${stop}`,
|
|
7251
7273
|
className: "canopy-theme-showcase__scale-stop"
|
|
7252
7274
|
},
|
|
7253
|
-
/* @__PURE__ */
|
|
7275
|
+
/* @__PURE__ */ React37.createElement(
|
|
7254
7276
|
"span",
|
|
7255
7277
|
{
|
|
7256
7278
|
className: "canopy-theme-showcase__scale-chip",
|
|
7257
7279
|
style: { backgroundColor: `var(${prefix}-${stop})` }
|
|
7258
7280
|
}
|
|
7259
7281
|
),
|
|
7260
|
-
/* @__PURE__ */
|
|
7282
|
+
/* @__PURE__ */ React37.createElement("span", { className: "canopy-theme-showcase__scale-token" }, stop)
|
|
7261
7283
|
))));
|
|
7262
7284
|
function ThemeShowcase() {
|
|
7263
7285
|
const accentColors = ACCENT_COLOR_NAMES;
|
|
@@ -7268,15 +7290,15 @@ function ThemeShowcase() {
|
|
|
7268
7290
|
if (!scale) return null;
|
|
7269
7291
|
return scale[`${name}9`] || Object.values(scale)[8];
|
|
7270
7292
|
};
|
|
7271
|
-
const ColorsLabeled = ({ colors }) => /* @__PURE__ */
|
|
7293
|
+
const ColorsLabeled = ({ colors }) => /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase__swatch-grid" }, colors.map((name) => {
|
|
7272
7294
|
const colorValue = getRadixSwatch(name);
|
|
7273
|
-
return /* @__PURE__ */
|
|
7295
|
+
return /* @__PURE__ */ React37.createElement("div", { key: name, className: "canopy-theme-showcase__swatch" }, /* @__PURE__ */ React37.createElement(
|
|
7274
7296
|
"div",
|
|
7275
7297
|
{
|
|
7276
7298
|
className: "canopy-theme-showcase__swatch-chip",
|
|
7277
7299
|
style: { background: colorValue || "var(--color-gray-200)" }
|
|
7278
7300
|
}
|
|
7279
|
-
), /* @__PURE__ */
|
|
7301
|
+
), /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase__swatch-label" }, name));
|
|
7280
7302
|
}));
|
|
7281
7303
|
const styles = `
|
|
7282
7304
|
.canopy-theme-showcase__section {
|
|
@@ -7360,13 +7382,13 @@ function ThemeShowcase() {
|
|
|
7360
7382
|
font-weight: 300;
|
|
7361
7383
|
}
|
|
7362
7384
|
`;
|
|
7363
|
-
return /* @__PURE__ */
|
|
7385
|
+
return /* @__PURE__ */ React37.createElement("div", { className: "canopy-theme-showcase" }, /* @__PURE__ */ React37.createElement("style", { dangerouslySetInnerHTML: { __html: styles } }), /* @__PURE__ */ React37.createElement(
|
|
7364
7386
|
Section,
|
|
7365
7387
|
{
|
|
7366
7388
|
title: "Color scales",
|
|
7367
7389
|
description: "Accent and gray ramps from the active theme."
|
|
7368
7390
|
},
|
|
7369
|
-
/* @__PURE__ */
|
|
7391
|
+
/* @__PURE__ */ React37.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "1.5rem" } }, COLOR_SCALES.map((scale) => /* @__PURE__ */ React37.createElement(
|
|
7370
7392
|
ColorScaleRow,
|
|
7371
7393
|
{
|
|
7372
7394
|
key: scale.label,
|
|
@@ -7374,20 +7396,20 @@ function ThemeShowcase() {
|
|
|
7374
7396
|
prefix: scale.prefix
|
|
7375
7397
|
}
|
|
7376
7398
|
)))
|
|
7377
|
-
), /* @__PURE__ */
|
|
7399
|
+
), /* @__PURE__ */ React37.createElement(
|
|
7378
7400
|
Section,
|
|
7379
7401
|
{
|
|
7380
7402
|
title: "Accent palette options",
|
|
7381
7403
|
description: "All accent color families available via Radix Themes."
|
|
7382
7404
|
},
|
|
7383
|
-
/* @__PURE__ */
|
|
7384
|
-
), /* @__PURE__ */
|
|
7405
|
+
/* @__PURE__ */ React37.createElement(ColorsLabeled, { colors: accentColors })
|
|
7406
|
+
), /* @__PURE__ */ React37.createElement(
|
|
7385
7407
|
Section,
|
|
7386
7408
|
{
|
|
7387
7409
|
title: "Gray palette options",
|
|
7388
7410
|
description: "Neutral ramps you can assign via the theme block."
|
|
7389
7411
|
},
|
|
7390
|
-
/* @__PURE__ */
|
|
7412
|
+
/* @__PURE__ */ React37.createElement(ColorsLabeled, { colors: grayColors })
|
|
7391
7413
|
));
|
|
7392
7414
|
}
|
|
7393
7415
|
export {
|
|
@@ -7413,6 +7435,7 @@ export {
|
|
|
7413
7435
|
MdxRelatedItems as RelatedItems,
|
|
7414
7436
|
RequiredStatement,
|
|
7415
7437
|
Scroll,
|
|
7438
|
+
MdxSearch as Search,
|
|
7416
7439
|
MdxSearchFormModal as SearchFormModal,
|
|
7417
7440
|
SearchPanel,
|
|
7418
7441
|
SearchPanelForm,
|