@museumwnf/viewer-core 1.14.0 → 1.15.0

package/src/router/index.js

@@ -1,138 +1,138 @@
-import { createRouter, createWebHashHistory } from 'vue-router'
-import { loadEntities } from '../composables/useEntities.js'
-import DetailView from '../views/DetailView.vue'
-import HomeView from '../views/HomeView.vue'
-import ListView from '../views/ListView.vue'
-import NotFoundView from '../views/NotFoundView.vue'
-
-// The routing convention, applied to every website by the one router they
-// share: hash history; every route named; `/<section>` and `/<section>/:id`
-// with the package id; language, page and filters in the query; the shapes
-// of legacy URLs kept as redirect-only entries; a catch-all to one not-found
-// view; scroll restoration owned here, not by a shell or a view.
-
-/**
- * Where the page is after a navigation: where it was when the visitor comes
- * back through history; at the anchor when the URL names one; where it is
- * when only a filter of the same page changed; at the top otherwise —
- * including a change of `page`, which is a new page of results and is read
- * from the beginning, and including the language, which re-renders
- * everything.
- */
-export function defaultScrollBehavior(to, from, savedPosition) {
-  if (savedPosition) return savedPosition
-  if (to.hash) return { el: to.hash, behavior: 'smooth' }
-  if (
-    from.name !== undefined &&
-    to.name === from.name &&
-    sameParams(to.params, from.params) &&
-    String(to.query.page ?? '') === String(from.query.page ?? '')
-  ) {
-    return false
-  }
-  return { top: 0 }
-}
-
-function sameParams(a, b) {
-  const keys = new Set([...Object.keys(a ?? {}), ...Object.keys(b ?? {})])
-  for (const key of keys) {
-    if (String(a?.[key] ?? '') !== String(b?.[key] ?? '')) return false
-  }
-  return true
-}
-
-/**
- * A legacy URL shape becomes a route that only ever redirects: `resolve`
- * receives the matched params (and the route) and answers the canonical
- * location — a name with params, or a path — or nothing, which is the
- * not-found page. It may be async, so a website can load the entity it maps
- * a legacy key through.
- */
-function legacyRoute({ path, resolve, name }, index) {
-  return {
-    path,
-    name: name ?? `legacy-${index}`,
-    component: NotFoundView,
-    meta: { legacy: true },
-    async beforeEnter(to) {
-      const target = await resolve(to.params, to)
-      if (!target) {
-        return { name: 'not-found', params: { pathMatch: to.path.slice(1).split('/') }, replace: true }
-      }
-      const location = typeof target === 'string' ? { path: target } : { ...target }
-      return { ...location, replace: true }
-    },
-  }
-}
-
-/**
- * The three slots every website has — the home page, a list page, a record
- * page — and what renders them. The generic views are the defaults: a plain
- * list of entity names, a paginated list of records, a record's fields,
- * enough to look at a new dataset. A website names the real pages in
- * `config.views` (`{ home, list, detail }`), typically the composed views of
- * `@museumwnf/viewer-layout/views`, and the same route names then render
- * them: `home` for `/`, `<entity>-list` and `<entity>-detail` for every
- * entity `features.entities` publishes. A component a site registers on the
- * `home` name in `extraViews` still wins — the escape hatch stays open.
- */
-export function resolveViews(config = {}) {
-  return {
-    home: HomeView,
-    list: ListView,
-    detail: DetailView,
-    ...Object.fromEntries(Object.entries(config.views ?? {}).filter(([, view]) => view)),
-  }
-}
-
-export function createViewerRouter(config = {}) {
-  const views = resolveViews(config)
-  const routes = [{ path: '/', name: 'home', component: views.home }]
-
-  for (const entity of config.features?.entities ?? []) {
-    routes.push({
-      path: `/${entity}`,
-      name: `${entity}-list`,
-      component: views.list,
-      props: { entity },
-    })
-    routes.push({
-      path: `/${entity}/:id`,
-      name: `${entity}-detail`,
-      component: views.detail,
-      props: (route) => ({ entity, id: route.params.id }),
-    })
-  }
-
-  for (const record of config.extraViews ?? []) {
-    routes.push(record)
-  }
-  for (const record of config.routes ?? []) {
-    routes.push(record)
-  }
-  for (const [index, entry] of (config.legacyRoutes ?? []).entries()) {
-    routes.push(legacyRoute(entry, index))
-  }
-  if (config.notFound !== false) {
-    routes.push({
-      path: '/:pathMatch(.*)*',
-      name: 'not-found',
-      component: config.notFound ?? NotFoundView,
-    })
-  }
-
-  const router = createRouter({
-    history: createWebHashHistory(),
-    routes,
-    scrollBehavior: config.scrollBehavior ?? defaultScrollBehavior,
-  })
-
-  // A route that names the entities it reads has them loaded before its view
-  // exists, so the view never renders against records that are not there yet.
-  router.beforeResolve(async (to) => {
-    const names = [...new Set(to.matched.flatMap((record) => record.meta?.entities ?? []))]
-    if (names.length > 0) await loadEntities(names)
-  })
-
-  return router
-}
+import { createRouter, createWebHashHistory } from 'vue-router'
+import { loadEntities } from '../composables/useEntities.js'
+import DetailView from '../views/DetailView.vue'
+import HomeView from '../views/HomeView.vue'
+import ListView from '../views/ListView.vue'
+import NotFoundView from '../views/NotFoundView.vue'
+
+// The routing convention, applied to every website by the one router they
+// share: hash history; every route named; `/<section>` and `/<section>/:id`
+// with the package id; language, page and filters in the query; the shapes
+// of legacy URLs kept as redirect-only entries; a catch-all to one not-found
+// view; scroll restoration owned here, not by a shell or a view.
+
+/**
+ * Where the page is after a navigation: where it was when the visitor comes
+ * back through history; at the anchor when the URL names one; where it is
+ * when only a filter of the same page changed; at the top otherwise —
+ * including a change of `page`, which is a new page of results and is read
+ * from the beginning, and including the language, which re-renders
+ * everything.
+ */
+export function defaultScrollBehavior(to, from, savedPosition) {
+  if (savedPosition) return savedPosition
+  if (to.hash) return { el: to.hash, behavior: 'smooth' }
+  if (
+    from.name !== undefined &&
+    to.name === from.name &&
+    sameParams(to.params, from.params) &&
+    String(to.query.page ?? '') === String(from.query.page ?? '')
+  ) {
+    return false
+  }
+  return { top: 0 }
+}
+
+function sameParams(a, b) {
+  const keys = new Set([...Object.keys(a ?? {}), ...Object.keys(b ?? {})])
+  for (const key of keys) {
+    if (String(a?.[key] ?? '') !== String(b?.[key] ?? '')) return false
+  }
+  return true
+}
+
+/**
+ * A legacy URL shape becomes a route that only ever redirects: `resolve`
+ * receives the matched params (and the route) and answers the canonical
+ * location — a name with params, or a path — or nothing, which is the
+ * not-found page. It may be async, so a website can load the entity it maps
+ * a legacy key through.
+ */
+function legacyRoute({ path, resolve, name }, index) {
+  return {
+    path,
+    name: name ?? `legacy-${index}`,
+    component: NotFoundView,
+    meta: { legacy: true },
+    async beforeEnter(to) {
+      const target = await resolve(to.params, to)
+      if (!target) {
+        return { name: 'not-found', params: { pathMatch: to.path.slice(1).split('/') }, replace: true }
+      }
+      const location = typeof target === 'string' ? { path: target } : { ...target }
+      return { ...location, replace: true }
+    },
+  }
+}
+
+/**
+ * The three slots every website has — the home page, a list page, a record
+ * page — and what renders them. The generic views are the defaults: a plain
+ * list of entity names, a paginated list of records, a record's fields,
+ * enough to look at a new dataset. A website names the real pages in
+ * `config.views` (`{ home, list, detail }`), typically the composed views of
+ * `@museumwnf/viewer-layout/views`, and the same route names then render
+ * them: `home` for `/`, `<entity>-list` and `<entity>-detail` for every
+ * entity `features.entities` publishes. A component a site registers on the
+ * `home` name in `extraViews` still wins — the escape hatch stays open.
+ */
+export function resolveViews(config = {}) {
+  return {
+    home: HomeView,
+    list: ListView,
+    detail: DetailView,
+    ...Object.fromEntries(Object.entries(config.views ?? {}).filter(([, view]) => view)),
+  }
+}
+
+export function createViewerRouter(config = {}) {
+  const views = resolveViews(config)
+  const routes = [{ path: '/', name: 'home', component: views.home }]
+
+  for (const entity of config.features?.entities ?? []) {
+    routes.push({
+      path: `/${entity}`,
+      name: `${entity}-list`,
+      component: views.list,
+      props: { entity },
+    })
+    routes.push({
+      path: `/${entity}/:id`,
+      name: `${entity}-detail`,
+      component: views.detail,
+      props: (route) => ({ entity, id: route.params.id }),
+    })
+  }
+
+  for (const record of config.extraViews ?? []) {
+    routes.push(record)
+  }
+  for (const record of config.routes ?? []) {
+    routes.push(record)
+  }
+  for (const [index, entry] of (config.legacyRoutes ?? []).entries()) {
+    routes.push(legacyRoute(entry, index))
+  }
+  if (config.notFound !== false) {
+    routes.push({
+      path: '/:pathMatch(.*)*',
+      name: 'not-found',
+      component: config.notFound ?? NotFoundView,
+    })
+  }
+
+  const router = createRouter({
+    history: createWebHashHistory(),
+    routes,
+    scrollBehavior: config.scrollBehavior ?? defaultScrollBehavior,
+  })
+
+  // A route that names the entities it reads has them loaded before its view
+  // exists, so the view never renders against records that are not there yet.
+  router.beforeResolve(async (to) => {
+    const names = [...new Set(to.matched.flatMap((record) => record.meta?.entities ?? []))]
+    if (names.length > 0) await loadEntities(names)
+  })
+
+  return router
+}

package/src/siteConfig.js

@@ -1,37 +1,37 @@
-import { getCurrentInstance, inject } from 'vue'
-import { VIEWER_CONFIG } from './injectionKeys.js'
-
-// `dataset.config.js` is the whole declaration of a website. What a site
-// needs outside a component — a composable building an image address, a
-// route helper — reads it from here; a component may inject it as well.
-
-let current = {}
-
-export function setSiteConfig(config) {
-  current = config ?? {}
-}
-
-/** The website's configuration, as `createViewer` received it. */
-export function useSiteConfig() {
-  if (getCurrentInstance()) {
-    const injected = inject(VIEWER_CONFIG, null)
-    if (injected) return injected
-  }
-  return current
-}
-
-const ABSOLUTE = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i
-
-/**
- * The address of a legacy media file, from the path the data package carries
- * and the host `config.media.legacyHost` declares. `size` is one of the
- * legacy server's size names (`zoom`, `hi_res`, `lo_res`, `small`). A path
- * that is already an address is returned as it is.
- */
-export function mediaUrl(path, size = 'hi_res') {
-  if (!path) return null
-  if (ABSOLUTE.test(path)) return path
-  const host = String(useSiteConfig().media?.legacyHost ?? '').replace(/\/+$/, '')
-  if (!host) return null
-  return `${host}/${size}/${String(path).replace(/^\/+/, '')}`
-}
+import { getCurrentInstance, inject } from 'vue'
+import { VIEWER_CONFIG } from './injectionKeys.js'
+
+// `dataset.config.js` is the whole declaration of a website. What a site
+// needs outside a component — a composable building an image address, a
+// route helper — reads it from here; a component may inject it as well.
+
+let current = {}
+
+export function setSiteConfig(config) {
+  current = config ?? {}
+}
+
+/** The website's configuration, as `createViewer` received it. */
+export function useSiteConfig() {
+  if (getCurrentInstance()) {
+    const injected = inject(VIEWER_CONFIG, null)
+    if (injected) return injected
+  }
+  return current
+}
+
+const ABSOLUTE = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i
+
+/**
+ * The address of a legacy media file, from the path the data package carries
+ * and the host `config.media.legacyHost` declares. `size` is one of the
+ * legacy server's size names (`zoom`, `hi_res`, `lo_res`, `small`). A path
+ * that is already an address is returned as it is.
+ */
+export function mediaUrl(path, size = 'hi_res') {
+  if (!path) return null
+  if (ABSOLUTE.test(path)) return path
+  const host = String(useSiteConfig().media?.legacyHost ?? '').replace(/\/+$/, '')
+  if (!host) return null
+  return `${host}/${size}/${String(path).replace(/^\/+/, '')}`
+}

package/src/styles/base.css

@@ -1,49 +1,49 @@
-/* Structural rules only. Colors, fonts and brand values come from CSS custom
-   properties defined by the website (or by @museumwnf/viewer-layout). */
-
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-}
-
-body {
-  margin: 0;
-  font-family: var(--vc-font-body, system-ui, sans-serif);
-  line-height: var(--vc-line-height, 1.5);
-  background: var(--vc-color-background, transparent);
-  color: var(--vc-color-text, inherit);
-}
-
-img {
-  max-width: 100%;
-  height: auto;
-}
-
-.vc-home,
-.vc-list,
-.vc-detail {
-  max-width: var(--vc-content-width, 60rem);
-  margin-inline: auto;
-  padding: var(--vc-content-padding, 1.5rem);
-}
-
-.vc-detail dl {
-  display: grid;
-  grid-template-columns: max-content 1fr;
-  gap: 0.25rem 1rem;
-}
-
-.vc-detail dt {
-  font-weight: var(--vc-weight-label, 600);
-}
-
-.vc-detail dd {
-  margin: 0;
-}
-
-.vc-pagination {
-  display: flex;
-  gap: 1rem;
-  align-items: baseline;
-}
+/* Structural rules only. Colors, fonts and brand values come from CSS custom
+   properties defined by the website (or by @museumwnf/viewer-layout). */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  font-family: var(--vc-font-body, system-ui, sans-serif);
+  line-height: var(--vc-line-height, 1.5);
+  background: var(--vc-color-background, transparent);
+  color: var(--vc-color-text, inherit);
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+}
+
+.vc-home,
+.vc-list,
+.vc-detail {
+  max-width: var(--vc-content-width, 60rem);
+  margin-inline: auto;
+  padding: var(--vc-content-padding, 1.5rem);
+}
+
+.vc-detail dl {
+  display: grid;
+  grid-template-columns: max-content 1fr;
+  gap: 0.25rem 1rem;
+}
+
+.vc-detail dt {
+  font-weight: var(--vc-weight-label, 600);
+}
+
+.vc-detail dd {
+  margin: 0;
+}
+
+.vc-pagination {
+  display: flex;
+  gap: 1rem;
+  align-items: baseline;
+}

package/src/testing/checkOfferedLanguages.js

@@ -1,67 +1,67 @@
-import { useDataPackage } from '../composables/useDataPackage.js'
-import { declaredSiteLanguages, offeredLanguages } from '../languages.js'
-
-// One check of a website's language declaration, shared by every website so
-// that the rule is tested once rather than rewritten seven times. It returns
-// the problems it finds, as sentences; a website's test asserts the list is
-// empty.
-
-/**
- * Checks `config.languages` and `config.navigation.languages` against the
- * data package: only languages with item content are offered; the order is
- * the package's declared order; every offered language has a label, and the
- * switcher lists exactly the offered languages.
- *
- * A website that narrows the package's declaration passes the same `declared`
- * list it gave `offeredLanguages()`, so the check expects the narrowed set —
- * the two helpers apply one rule, and a website that narrows in the config
- * but not in the test would otherwise be told its own list is wrong.
- */
-export function checkOfferedLanguages(
-  config,
-  { declared, entity = 'items', manifest, availableLanguages } = {},
-) {
-  const pkg = useDataPackage()
-  const withContent = (availableLanguages ?? pkg.availableLanguages)(entity)
-  const fromPackage = declaredSiteLanguages(manifest ?? pkg.manifest)
-  const offered = config?.languages ?? []
-  const problems = []
-
-  if (offered.length === 0) {
-    problems.push('The website offers no language.')
-  }
-  for (const code of offered) {
-    if (!withContent.includes(code)) {
-      problems.push(`"${code}" is offered but no ${entity} carry it.`)
-    }
-  }
-  if (declared || fromPackage) {
-    const expected = offeredLanguages({ declared, entity, manifest, availableLanguages })
-    if (offered.join(',') !== expected.join(',')) {
-      const source = declared ? 'the website narrows the package to' : 'the package declares'
-      problems.push(
-        `The offered languages are [${offered.join(', ')}] where ${source} [${expected.join(', ')}].`,
-      )
-    }
-  } else {
-    const sorted = [...offered].sort()
-    if (offered.join(',') !== sorted.join(',')) {
-      problems.push('The package declares no site languages, so the offered list has to be alphabetical.')
-    }
-  }
-
-  const switcher = config?.navigation?.languages
-  if (switcher !== undefined) {
-    const codes = (switcher ?? []).map((entry) => (typeof entry === 'string' ? entry : entry?.code))
-    if (codes.join(',') !== offered.join(',')) {
-      problems.push(`The switcher lists [${codes.join(', ')}] where the website offers [${offered.join(', ')}].`)
-    }
-    for (const entry of switcher ?? []) {
-      if (typeof entry === 'object' && !(typeof entry.label === 'string' && entry.label.trim())) {
-        problems.push(`"${entry.code}" has no label in the switcher.`)
-      }
-    }
-  }
-
-  return problems
-}
+import { useDataPackage } from '../composables/useDataPackage.js'
+import { declaredSiteLanguages, offeredLanguages } from '../languages.js'
+
+// One check of a website's language declaration, shared by every website so
+// that the rule is tested once rather than rewritten seven times. It returns
+// the problems it finds, as sentences; a website's test asserts the list is
+// empty.
+
+/**
+ * Checks `config.languages` and `config.navigation.languages` against the
+ * data package: only languages with item content are offered; the order is
+ * the package's declared order; every offered language has a label, and the
+ * switcher lists exactly the offered languages.
+ *
+ * A website that narrows the package's declaration passes the same `declared`
+ * list it gave `offeredLanguages()`, so the check expects the narrowed set —
+ * the two helpers apply one rule, and a website that narrows in the config
+ * but not in the test would otherwise be told its own list is wrong.
+ */
+export function checkOfferedLanguages(
+  config,
+  { declared, entity = 'items', manifest, availableLanguages } = {},
+) {
+  const pkg = useDataPackage()
+  const withContent = (availableLanguages ?? pkg.availableLanguages)(entity)
+  const fromPackage = declaredSiteLanguages(manifest ?? pkg.manifest)
+  const offered = config?.languages ?? []
+  const problems = []
+
+  if (offered.length === 0) {
+    problems.push('The website offers no language.')
+  }
+  for (const code of offered) {
+    if (!withContent.includes(code)) {
+      problems.push(`"${code}" is offered but no ${entity} carry it.`)
+    }
+  }
+  if (declared || fromPackage) {
+    const expected = offeredLanguages({ declared, entity, manifest, availableLanguages })
+    if (offered.join(',') !== expected.join(',')) {
+      const source = declared ? 'the website narrows the package to' : 'the package declares'
+      problems.push(
+        `The offered languages are [${offered.join(', ')}] where ${source} [${expected.join(', ')}].`,
+      )
+    }
+  } else {
+    const sorted = [...offered].sort()
+    if (offered.join(',') !== sorted.join(',')) {
+      problems.push('The package declares no site languages, so the offered list has to be alphabetical.')
+    }
+  }
+
+  const switcher = config?.navigation?.languages
+  if (switcher !== undefined) {
+    const codes = (switcher ?? []).map((entry) => (typeof entry === 'string' ? entry : entry?.code))
+    if (codes.join(',') !== offered.join(',')) {
+      problems.push(`The switcher lists [${codes.join(', ')}] where the website offers [${offered.join(', ')}].`)
+    }
+    for (const entry of switcher ?? []) {
+      if (typeof entry === 'object' && !(typeof entry.label === 'string' && entry.label.trim())) {
+        problems.push(`"${entry.code}" has no label in the switcher.`)
+      }
+    }
+  }
+
+  return problems
+}

package/src/testing/index.js

@@ -1,3 +1,3 @@
-export { checkOfferedLanguages } from './checkOfferedLanguages.js'
-export { checkRoutes, checkSectionMeta, checkTextsRendered, mountSite } from './smoke.js'
-export { defineViewerConfig } from './viteConfig.js'
+export { checkOfferedLanguages } from './checkOfferedLanguages.js'
+export { checkRoutes, checkSectionMeta, checkTextsRendered, mountSite } from './smoke.js'
+export { defineViewerConfig } from './viteConfig.js'