@museumwnf/viewer-layout 3.2.1 → 3.3.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.
- package/README.md +46 -2
- package/dist/{FeaturedRecord-Dw6uf3ax.js → FeaturedRecord-BJ8LaWGP.js} +1 -1
- package/dist/{ItemDetailView-CCbM_mwL.js → ItemDetailView-CfUtRLOV.js} +3 -3
- package/dist/{OnDisplayIn-eSG5r48j.js → OnDisplayIn-Dv8i7uvH.js} +1 -1
- package/dist/{Theme-wWxk-ihS.js → Theme-Db88mckV.js} +2 -2
- package/dist/{TimelineEventList-BhkWyY5-.js → TimelineEventList-COjkXEzS.js} +3 -3
- package/dist/{TimelineResultsView-DfgxLwGt.js → TimelineResultsView-CmHomvV_.js} +486 -486
- package/dist/{content-BxaDJIvY.js → content-p0tqKkcD.js} +2 -2
- package/dist/content.js +4 -4
- package/dist/dxa.js +6 -6
- package/dist/index.js +4 -4
- package/dist/viewer-layout.css +1 -1
- package/dist/views.js +3 -3
- package/package.json +8 -2
- package/src/dxa/testing.js +834 -0
- package/src/styles/dxa-exhibition.css +365 -0
- package/src/styles/dxa-gallery.css +342 -0
- package/src/tokens.reference.css +13 -7
package/README.md
CHANGED
|
@@ -18,6 +18,8 @@ all the packages:
|
|
|
18
18
|
| `@museumwnf/viewer-layout/views` | composed views | whole pages driven by a spec the website declares, with slots it fills | viewer-core's data layer, the site config and the router |
|
|
19
19
|
| `@museumwnf/viewer-layout/components` | composed views | `SiteShell`, the frame composed from `dataset.config.js` | the site config and the current route |
|
|
20
20
|
| `@museumwnf/viewer-layout/dxa` | DXA family layer | the gallery and exhibition pages and shells, the family-only blocks, `standardRoutes`, `galleryConfig` / `exhibitionConfig` | the entries above, `@museumwnf/viewer-core` and `@museumwnf/viewer-core/dxa` |
|
|
21
|
+
| `@museumwnf/viewer-layout/dxa/gallery.css`, `/dxa/exhibition.css` | DXA family layer | each family's stylesheet: its fonts, page reset and page column, and its theme as a function of the palette | the palette a site's `theme/tokens.css` sets |
|
|
22
|
+
| `@museumwnf/viewer-layout/dxa/testing` | DXA family layer | each family's smoke test, `describeGallerySmoke` / `describeExhibitionSmoke` | the site's config, texts and package, in the site's own Vitest |
|
|
21
23
|
| `@museumwnf/viewer-layout/style.css` | — | one stylesheet for every entry, the family styles included | — |
|
|
22
24
|
| `@museumwnf/viewer-layout/tokens.reference.css` | — | every token the package reads, with its fallback | — |
|
|
23
25
|
|
|
@@ -432,8 +434,8 @@ export default {
|
|
|
432
434
|
| View | Declaration | Slots |
|
|
433
435
|
|---|---|---|
|
|
434
436
|
| `HomeView` | `config.home` or the same as props: `title`, `intro` (Markdown), `cards: [{ title, description, action, to \| href }]`, `featured: { entity, heading, action, route, eyebrow, meta, seed, filter }` — the pick is `useFeaturedRecord`, among the records `filter` keeps (viewer-core 2.2.0) — `panels` (the welcome and the record as `.mwnf-panel` boxes) | `before`, default, `after` |
|
|
435
|
-
| `CatalogueResultsView` | `spec`: `entity`, `keys`, `facets` (viewer-core's facet spec), `facetScope: 'all' \| 'matching'`, `controls: [{ key, type: 'select' \| 'year' \| 'query' \| 'checkbox', label, placeholder, anyLabel, hideEmpty }]`, `filterMode: 'apply' \| 'immediate'`, `scope(record, filters)`, `match(record, filters)`, `narrow(list, filters, helpers)` (a rule over the whole list — a keyword index, say), `dates: { mode, begin, end }`, `sort`, `pageSize`, `variant: 'list' \| 'grid'`, `record(record, helpers)`, `recordRoute`, `summary(context)`, `title`, `filterTitle`, `empty`, `actionLabel`, `pagination` | `before`, `filters`, `actions`, `aside`, `empty`, `after` — each given `{ filters, active, apply, reset, goToPage, matching, pageInfo, options }`, enough to compose the panel in the aside or a second pagination |
|
|
436
|
-
| `RecordView` | `spec` and `id`: `entity`, `translations`, `attribution`, `fields` (viewer-core's `sheetRows` spec, or a function of the context), `sections`, `layout`, `shortDescription`, `media(record, ctx)`, `mediaVariant`, `credits`, `workingNumber`, `citation: { project, permalink: true \| false \| string, heading } \| false` (the permalink is `sourceUrl(currentRoute)` — null, so no address, until the website declares `site.origin` — unless the spec disables it with `false` or overrides it with a string), `related: { variant, heading, record, route } \| false`, `back: { label, to \| href }`, `title(ctx)` | `header`, `before-sheet`, `after-sheet`, `aside`, `source` (under the citation; default `SourceCredit`), `related`, `after`, and one named after every `custom` or `link` row — each given `{ record, text, language, languages, select, dir, glossary, ready, attribution, t, tr }`; `related` also `records` (the rows) and `outside` (the related records the package does not carry) |
|
|
437
|
+
| `CatalogueResultsView` | `spec`: `entity`, `keys`, `facets` (viewer-core's facet spec), `facetScope: 'all' \| 'matching'`, `controls: [{ key, type: 'select' \| 'year' \| 'query' \| 'checkbox', label, placeholder, anyLabel, hideEmpty }]`, `filterMode: 'apply' \| 'immediate'`, `scope(record, filters)`, `match(record, filters)`, `narrow(list, filters, helpers)` (a rule over the whole list — a keyword index, say), `dates: { mode, begin, end }`, `sort`, `pageSize`, `variant: 'list' \| 'grid'`, `boxed: true` (the results in the site's content box: framed by the `.mwnf-panel` tokens, a gap under the filters, narrow year fields), `record(record, helpers)`, `recordRoute`, `summary(context)`, `title`, `filterTitle`, `empty`, `actionLabel`, `pagination` | `before`, `filters`, `actions`, `aside`, `empty`, `after` — each given `{ filters, active, apply, reset, goToPage, matching, pageInfo, options }`, enough to compose the panel in the aside or a second pagination |
|
|
438
|
+
| `RecordView` | `spec` and `id`: `entity`, `translations`, `attribution`, `fields` (viewer-core's `sheetRows` spec, or a function of the context), `sections`, `layout`, `shortDescription`, `media(record, ctx)`, `mediaVariant`, `spaced: true` (a gap under every block of pictures and under the sheet), `credits`, `workingNumber`, `citation: { project, permalink: true \| false \| string, heading } \| false` (the permalink is `sourceUrl(currentRoute)` — null, so no address, until the website declares `site.origin` — unless the spec disables it with `false` or overrides it with a string), `related: { variant, heading, record, route } \| false`, `back: { label, to \| href }`, `title(ctx)` | `header`, `before-sheet`, `after-sheet`, `aside`, `source` (under the citation; default `SourceCredit`), `related`, `after`, and one named after every `custom` or `link` row — each given `{ record, text, language, languages, select, dir, glossary, ready, attribution, t, tr }`; `related` also `records` (the rows) and `outside` (the related records the package does not carry) |
|
|
437
439
|
| `ItemDetailView` (`/dxa`) | Every `RecordView` prop (`spec`, `id`, `entity`) plus `dataGetter(id) => record \| null \| undefined` — a website's own language-subset record lookup (an exhibition's per-build `itemById.get`); omitted, every `id` `RecordView` itself finds is treated as present (the gallery shape); supplied and it reports `id` missing, `NotFoundView` renders before `RecordView` ever mounts (the exhibition shape's per-language-build 404), and it also narrows the related block's `records`/outside-reference split the same way. The DXA gallery/exhibition item sheet's own blocks, on top of `spec`: `sourceDatabase: { label?, chipClass(record, ctx), addToCollection: { label? } \| false } \| false` (the source-database line + `backward_compatibility` code + "add to my collection" link — `chipClass` is a site's own project→colour map, the name comes from `useProjects()`), `notice: { show(record, ctx), label } \| false` (the Explore-partner notice), `museum: { route(partnerId, ctx) } \| false` (the holding-museum row: the item's holder text, then the partner as `PartnerPanel`'s `summary` — "About {name}, {city}, {country}" — linked through `route`; `route` returning null keeps the name without a link, for a hidden partner; `false` keeps the holder text alone; decision D3), and on `spec.related`: `title`, `description` (entries, above the block), `notInPackageLabel`, `outsideChip(ref, ctx)` (an outside reference's chip — `TODO(#1727)`, no `project_id` on a stub yet), `artisticIntroductionLabel` (with `useProjects().links(record.project_id).artisticIntroductionUrl`), `databaseLabel` (ditto, `.relatedDatabaseUrl`), `overallDatabase: { label, linkLabel } \| false` (`mwnfLinks.overallDatabase`), `onDisplayIn: { linkPendingLabel } \| false` (`record.gallery_references`, by `kind`), `download: false` (default on, `record.action.download`/`.downloadPdf`, prints), `glossary: false` (default on, `GlossaryTool`), `dynasties(record, language, ctx) => { records, tr } \| null` (`DynastyList`), `media: false` (default on, `record.media`, a `SheetSection`), `timeline(record, ctx) => TimelineInfo \| null` (`TimelineLookup` — see `docs/slot-catalogue.md`) | Every `RecordView` slot, forwarded straight through by name, unmodified, **except** `before-sheet`/`museum`/`related`: each always has this view's own default content (above), which a website's own slot still replaces entirely — "a slot fills, the default content renders otherwise" |
|
|
438
440
|
| `EssayView` | `spec` and `id`: `tree` (a `useCollectionTree` result, or `{ purpose \| rootId, childType?, entity?, order? }` / `{ themes: true \| 'themes', childType? }` for the view to build one), `entity` (the tree's items — also the tree's own translations entity when `tree` carries none of its own, a pre-built tree or a declarative form with no `entity`/`themes`; falls back to `'collections'`), `route` (a node's own page: a route name or `(node, ctx) => to \| href`), `heading(ctx)`, `placeholder` (a regex a synthesized title matches, falling back to the English title, then the internal name), `quote` / `body` (a field of the node's translation, a dotted path into it such as `'extra.intro_text'`, or a function `(ctx) => Markdown`; default `'quote'`/`'description'`, `false` to drop), `glossary`, `items: { of(node) => ids, caption(item, node, ctx) => override, meta(item, ctx) => [string] (the grid's caption lines), badge(item, ctx) => string, route }`, `panel: { variants(item, ctx) => [{ id, image, alt, caption: { title, justification, fields: [{ label (entry name), value }] } }], fields(item, node, ctx) => [{ label, value }] (the fallback when a variant carries no fields of its own) } \| false`, `navigation: 'tree' \| 'siblings' \| false` (`tree` crosses a branch boundary, `siblings` stays inside the parent), `breadcrumb`, `tabs: true \| 'siblings' \| 'children'` (the strip: `true`/`'siblings'` — the node's own siblings, the default; `'children'` — the node's own children, e.g. a theme's chapters), `about(node) => boolean \| { panel?, navigation? }` (essay only; a plain boolean drops both the picture panel and the navigation, an object keeps the named piece instead), `aboutKeeps: ['panel' \| 'navigation']` (the spec-wide equivalent, when every about page in this spec keeps the same piece), `numbering: 'roman' \| 'decimal' \| false` (counts a node among its true siblings — for a themes-package tree, whose `root` is `null`, that's every node whose own `tree.parents(id)` is also empty, so a themes tree numbers its top-level themes I, II, III); `previous`, `next`, `backTo`, `inThisTheme` (the strip's label), `seeAll` (the panel's link to the selected record) — entry names, defaulting to shared entries every bundle carries: `core.pagination.previous`/`.next`, `record.action.backToResults`, `core.nav.inThisSection`, `catalogue.results.seeDatabaseEntry` | `header`, `before-body`, `after-body`, `panel`, `thumbnails`, `aside`, `justifications`, `navigation`, `after` (default `SourceCredit` — nothing until the website declares `site.origin`) — each given `{ node, text, language, tree, items, selected, select, selectedVariant, selectVariant, breadcrumb, previous, next, t, tr }` |
|
|
439
441
|
| `LinkListView` | `spec`: `title` (entry), `groups: [{ heading (entry), links: [{ label, href \| to, note? }] }] \| (ctx) => groups` (`label`/`note` are Markdown, rendered inline through `mdInline`), `back: { label, to \| href } \| false`, `empty` (entry) | `before`, `group` (given `{ group }`; the default renders the heading and its links — replace it for a citation list that is not link-shaped), `after` |
|
|
@@ -557,10 +559,52 @@ every `legacyRoutes` resolver targeting those names) working unmodified.
|
|
|
557
559
|
Full page-by-page prop/slot/entry table in
|
|
558
560
|
[`docs/slot-catalogue.md`](docs/slot-catalogue.md#dxa-family-pages-museumwnfviewer-layoutdxa).
|
|
559
561
|
|
|
562
|
+
### The family's stylesheet, theme and smoke test
|
|
563
|
+
|
|
564
|
+
Since 3.3.0 what every site of a family shared by copy is here once:
|
|
565
|
+
|
|
566
|
+
- **`@museumwnf/viewer-layout/dxa/gallery.css`** and **`/dxa/exhibition.css`**:
|
|
567
|
+
the fonts, the page reset, the 1350px page column with its sticky header
|
|
568
|
+
and menu grid, and the family's theme — every `--mwnf-*` token the family
|
|
569
|
+
sets, read from the palette. A site imports its family's stylesheet after
|
|
570
|
+
`style.css` and before its own theme, so that its own values win:
|
|
571
|
+
|
|
572
|
+
```js
|
|
573
|
+
import '@museumwnf/viewer-layout/style.css'
|
|
574
|
+
import '@museumwnf/viewer-layout/dxa/gallery.css'
|
|
575
|
+
import '../theme/tokens.css'
|
|
576
|
+
import '../theme/overrides.css'
|
|
577
|
+
```
|
|
578
|
+
|
|
579
|
+
The site's `theme/tokens.css` then holds its palette — legacy's five
|
|
580
|
+
colours for a gallery (`--theme-dark`, `--theme-medium-dark`,
|
|
581
|
+
`--theme-medium`, `--theme-light`, `--background-color`), legacy's six for
|
|
582
|
+
an exhibition (`--main-color`, `--secondary-color`, `--contrast-color` and
|
|
583
|
+
their `-text-color`s) — and any token that differs from the family's.
|
|
584
|
+
`theme/overrides.css` stays the escape hatch.
|
|
585
|
+
- **`@museumwnf/viewer-layout/dxa/testing`**: `describeGallerySmoke` and
|
|
586
|
+
`describeExhibitionSmoke`, the smoke test every site of the family runs.
|
|
587
|
+
A site's `tests/smoke.test.js` calls its family's with its config, its
|
|
588
|
+
texts, its package and — for a gallery — the records of its own dataset the
|
|
589
|
+
tests look for (the function's documentation names each), and may add
|
|
590
|
+
tests of its own after the call. The suite runs in the site's own Vitest,
|
|
591
|
+
which processes this package (viewer-core's `defineViewerConfig` inlines
|
|
592
|
+
it).
|
|
593
|
+
|
|
560
594
|
## Theming
|
|
561
595
|
|
|
562
596
|
Every color, font, spacing, radius comes from a `--mwnf-*` CSS custom property with a neutral fallback. Full list: [`tokens.reference.css`](src/tokens.reference.css) (also exported as `@museumwnf/viewer-layout/tokens.reference.css`) — copy it into your website as `theme/tokens.css` and set values.
|
|
563
597
|
|
|
598
|
+
**Links read one colour.** Every link takes `--mwnf-link-text`, and
|
|
599
|
+
`--mwnf-link-hover-text` where it changes colour under the pointer. A
|
|
600
|
+
component whose links a site may want different has a token of its own that
|
|
601
|
+
falls back to them — `--mwnf-back-link-color`, `--mwnf-link-list-link-color`,
|
|
602
|
+
`--mwnf-partner-link-color`, `--mwnf-dxa-item-link`,
|
|
603
|
+
`--mwnf-related-media-link-color`, `--mwnf-on-display-link-color`,
|
|
604
|
+
`--mwnf-card-accordion-child-hover-color`. **`--mwnf-color-accent` is a
|
|
605
|
+
surface colour** (active backgrounds, rules, bands) and colours no text: a
|
|
606
|
+
theme can paint its menu or its bands in it without hiding a link.
|
|
607
|
+
|
|
564
608
|
Below `48rem` the navigation folds its links behind a menu button, the
|
|
565
609
|
`split` banner stacks its two columns, and the banner captions are hidden.
|
|
566
610
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { y as e } from "./TimelineEventList-
|
|
1
|
+
import { y as e } from "./TimelineEventList-COjkXEzS.js";
|
|
2
2
|
import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, openBlock as s, renderList as c, renderSlot as l, toDisplayString as u, useSlots as d, withCtx as f } from "vue";
|
|
3
3
|
//#region src/content/FeaturedRecord.vue
|
|
4
4
|
var p = {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { n as e, o as t } from "./TimelineEventList-
|
|
2
|
-
import { i as n, n as r, o as i, r as a, t as o } from "./OnDisplayIn-
|
|
3
|
-
import { s } from "./TimelineResultsView-
|
|
1
|
+
import { n as e, o as t } from "./TimelineEventList-COjkXEzS.js";
|
|
2
|
+
import { i as n, n as r, o as i, r as a, t as o } from "./OnDisplayIn-Dv8i7uvH.js";
|
|
3
|
+
import { s } from "./TimelineResultsView-CmHomvV_.js";
|
|
4
4
|
import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createSlots as ee, createTextVNode as m, createVNode as h, guardReactiveProps as g, normalizeClass as _, normalizeProps as v, openBlock as y, renderList as b, renderSlot as x, toDisplayString as S, unref as C, useSlots as te, withCtx as w } from "vue";
|
|
5
5
|
import { NotFoundView as ne, byId as T, loadEntities as re, mdInline as E, mdStrip as ie, mwnfLinks as D, partnerView as ae, useDataPackage as oe, useI18n as se, useProjects as ce } from "@museumwnf/viewer-core";
|
|
6
6
|
//#region src/dxa/ItemDetailView.vue
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { l as e, y as t } from "./TimelineEventList-
|
|
1
|
+
import { l as e, y as t } from "./TimelineEventList-COjkXEzS.js";
|
|
2
2
|
import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, mergeProps as u, normalizeClass as d, openBlock as f, ref as p, renderList as m, renderSlot as h, resolveDynamicComponent as g, toDisplayString as _, unref as v, vModelSelect as y, vModelText as b, watch as x, withCtx as S, withDirectives as C, withKeys as w } from "vue";
|
|
3
3
|
import { useI18n as T } from "@museumwnf/viewer-core/i18n";
|
|
4
4
|
import { md as E, mdInline as D, searchGlossary as ee } from "@museumwnf/viewer-core";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { s as e, y as t } from "./TimelineEventList-
|
|
2
|
-
import { o as n } from "./TimelineResultsView-
|
|
1
|
+
import { s as e, y as t } from "./TimelineEventList-COjkXEzS.js";
|
|
2
|
+
import { o as n } from "./TimelineResultsView-CmHomvV_.js";
|
|
3
3
|
import { A as r, F as i, h as a, m as o } from "./data-BfyYB8ff.js";
|
|
4
4
|
import { n as s, r as c, t as l } from "./themeSpecs-C_uGarTs.js";
|
|
5
5
|
import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, createVNode as _, normalizeClass as v, onMounted as ee, openBlock as y, ref as b, renderList as x, toDisplayString as S, unref as C, vModelCheckbox as w, watch as T, withCtx as E, withDirectives as D } from "vue";
|
|
@@ -24,8 +24,8 @@ var N = [
|
|
|
24
24
|
}
|
|
25
25
|
},
|
|
26
26
|
setup(e) {
|
|
27
|
-
let r = e, a = c()?.appContext.components.RouterLink ?? null,
|
|
28
|
-
return (t, r) =>
|
|
27
|
+
let r = e, a = /^[a-z][a-z0-9+.-]*:/i, o = c()?.appContext.components.RouterLink ?? null, s = t(() => typeof r.to == "string" && a.test(r.to)), u = t(() => !!(r.to && o && !s.value)), d = t(() => r.href || (typeof r.to == "string" ? r.to : ""));
|
|
28
|
+
return (t, r) => u.value ? (p(), n(_(y(o)), l({
|
|
29
29
|
key: 0,
|
|
30
30
|
to: e.to
|
|
31
31
|
}, t.$attrs), {
|
|
@@ -33,7 +33,7 @@ var N = [
|
|
|
33
33
|
_: 3
|
|
34
34
|
}, 16, ["to"])) : (p(), i("a", l({
|
|
35
35
|
key: 1,
|
|
36
|
-
href:
|
|
36
|
+
href: d.value || void 0,
|
|
37
37
|
target: e.external ? "_blank" : void 0,
|
|
38
38
|
rel: e.external ? "noopener" : void 0
|
|
39
39
|
}, t.$attrs), [g(t.$slots, "default")], 16, N));
|