@museumwnf/viewer-core 1.14.0

package/src/i18n/markdown.js

@@ -0,0 +1,265 @@
+import { Marked } from 'marked'
+
+// One Markdown pipeline for every text on every website, configured here and
+// nowhere else. Its own instance rather than the shared `marked` singleton, so
+// configuring it cannot change how a website renders anything else.
+//
+// Raw HTML is escaped rather than rendered. Texts are written by translators
+// through the GitHub web interface, and the rules they are given say Markdown
+// only; escaping is what makes that a guarantee instead of a request.
+//
+// This is the only place that guarantee lives. viewer-i18n's checker used to
+// reject HTML too, which added nothing here and was wrong about autolinks and
+// code spans; it no longer looks. Anything relaxed in this file is relaxed
+// everywhere, with nothing behind it.
+
+const ESCAPES = { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }
+
+function escapeHtml(text) {
+  return String(text).replace(/[&<>"']/g, (character) => ESCAPES[character])
+}
+
+// Raw HTML is escaped in both, because both render text that came from
+// somewhere else: a translator's file, or a museum record carried in from the
+// legacy system. Neither is a place markup may be authored.
+const escaping = {
+  renderer: {
+    html(token) {
+      return escapeHtml(token?.raw ?? token?.text ?? token ?? '')
+    },
+  },
+}
+
+// `breaks` is the one difference, and it is a difference in the source rather
+// than in policy. A text in the dictionary is written as prose and wraps freely,
+// so a single newline means nothing. A record's field arrives from a database
+// where a newline was typed to be a line break, and dropping it runs the lines
+// together.
+const prose = new Marked({ async: false, gfm: true, breaks: false })
+const record = new Marked({ async: false, gfm: true, breaks: true })
+prose.use(escaping)
+record.use(escaping)
+
+const pipeline = (breaks) => (breaks ? record : prose)
+
+const REGEXP_SPECIAL = /[.*+?^${}()|[\]\\]/g
+function escapeRegExp(text) {
+  return text.replace(REGEXP_SPECIAL, '\\$&')
+}
+
+// A word boundary that also works for a spelling starting or ending in an
+// accented letter — JS's own `\b` is `\w`-based (`[A-Za-z0-9_]`), so it does
+// not see "é" as a word character and misses the boundary right before one.
+const NOT_WORD = '[\\p{L}\\p{N}_]'
+
+/**
+ * A marked inline extension: highlights every occurrence of a glossary
+ * spelling as `<span class="gloss-term" data-gid="…">`, as a token the
+ * parser produces rather than HTML smuggled through the source text — the
+ * escaping above still applies to everything else. One instance per
+ * distinct glossary (see the cache below); built once, matched against
+ * every text rendered with that glossary.
+ */
+function spellingIndex(glossary) {
+  const bySpelling = new Map()
+  for (const { id, spelling } of glossary) {
+    const trimmed = spelling?.trim()
+    if (!trimmed) continue
+    bySpelling.set(trimmed.toLowerCase(), id)
+  }
+
+  // Longest spelling first, so "kufic script" wins over "kufic" when a text
+  // contains both.
+  const spellings = [...bySpelling.keys()].sort((a, b) => b.length - a.length)
+  if (spellings.length === 0) return null
+  return { bySpelling, alternation: spellings.map(escapeRegExp).join('|') }
+}
+
+function glossaryExtension(glossary) {
+  const index = spellingIndex(glossary)
+  if (!index) return null
+  const { bySpelling, alternation } = index
+  const findAnywhere = new RegExp(`(?<!${NOT_WORD})(?:${alternation})(?!${NOT_WORD})`, 'iu')
+  const matchAtStart = new RegExp(`^(?:${alternation})(?!${NOT_WORD})`, 'iu')
+
+  return {
+    name: 'glossaryTerm',
+    level: 'inline',
+    start(src) {
+      return findAnywhere.exec(src)?.index
+    },
+    tokenizer(src) {
+      const match = matchAtStart.exec(src)
+      if (!match) return undefined
+      return {
+        type: 'glossaryTerm',
+        raw: match[0],
+        text: match[0],
+        id: bySpelling.get(match[0].toLowerCase()),
+      }
+    },
+    renderer(token) {
+      return `<span class="gloss-term" data-gid="${escapeHtml(token.id)}">${escapeHtml(token.text)}</span>`
+    },
+  }
+}
+
+// Keyed on the spelling list, not on which text is being rendered — every
+// field of one record shares the same glossary, and re-parsing that list
+// into a regex and a Marked instance for each field would be wasted work.
+const glossaryPipelines = new Map()
+
+function glossaryKey(glossary) {
+  return JSON.stringify([...glossary].sort((a, b) => (a.id < b.id ? -1 : a.id > b.id ? 1 : 0)))
+}
+
+function withGlossary(breaks, glossary) {
+  const key = glossaryKey(glossary)
+  let entry = glossaryPipelines.get(key)
+  if (entry === undefined) {
+    const extension = glossaryExtension(glossary)
+    if (!extension) {
+      entry = null // no usable spelling in this list — fall back below
+    } else {
+      const withProse = new Marked({ async: false, gfm: true, breaks: false })
+      const withRecord = new Marked({ async: false, gfm: true, breaks: true })
+      withProse.use(escaping, { extensions: [extension] })
+      withRecord.use(escaping, { extensions: [extension] })
+      entry = { prose: withProse, record: withRecord }
+    }
+    glossaryPipelines.set(key, entry)
+  }
+  return entry ? (breaks ? entry.record : entry.prose) : pipeline(breaks)
+}
+
+function engineFor(breaks, glossary) {
+  return glossary && glossary.length > 0 ? withGlossary(breaks, glossary) : pipeline(breaks)
+}
+
+// The same key as the render pipelines, for the same reason: a glossary list
+// is rebuilt into a regex once, however many texts get scanned against it.
+const glossaryMatchers = new Map()
+
+function matcherFor(glossary) {
+  const key = glossaryKey(glossary)
+  let matcher = glossaryMatchers.get(key)
+  if (matcher === undefined) {
+    const index = spellingIndex(glossary)
+    matcher = index
+      ? { bySpelling: index.bySpelling, regex: new RegExp(`(?<!${NOT_WORD})(?:${index.alternation})(?!${NOT_WORD})`, 'giu') }
+      : null
+    glossaryMatchers.set(key, matcher)
+  }
+  return matcher
+}
+
+/**
+ * The ids of `glossary` (`[{ id, spelling }]`) whose spelling occurs in
+ * `text`, matched the same word-bounded, case-insensitive way
+ * `renderBlock`/`renderInline` highlight them — a text scanned this way and
+ * the same text rendered with the same list agree on what counts as a hit.
+ * The free-text counterpart to a record's own `glossary_ids`: a dynasty
+ * history or a theme essay has no such column to read, so this scans the
+ * whole glossary against the text instead. One id per term, in no
+ * particular order.
+ */
+export function glossaryIdsIn(text, glossary) {
+  if (!glossary || glossary.length === 0) return []
+  const matcher = matcherFor(glossary)
+  if (!matcher) return []
+  const found = new Set()
+  for (const match of String(text ?? '').matchAll(matcher.regex)) {
+    found.add(matcher.bySpelling.get(match[0].toLowerCase()))
+  }
+  return [...found]
+}
+
+/** A text as one or more paragraphs. `glossary`: `[{ id, spelling }]` to highlight. */
+export function renderBlock(text, { breaks = false, glossary } = {}) {
+  return engineFor(breaks, glossary).parse(String(text ?? ''))
+}
+
+/** A text without the surrounding paragraph, for a heading or a table cell. */
+export function renderInline(text, { breaks = false, glossary } = {}) {
+  return engineFor(breaks, glossary).parseInline(String(text ?? ''))
+}
+
+// Plain text is read off the token tree the same parser produces, never by
+// rewriting the source with a regex: what a Markdown text says is what its
+// tokens say. Raw HTML is dropped, since it was never content; an image is
+// its alt text; a break is a space.
+const BLOCKS = new Set(['paragraph', 'heading', 'blockquote', 'list', 'list_item', 'code', 'table', 'hr', 'html'])
+
+const ENTITIES = { amp: '&', lt: '<', gt: '>', quot: '"', apos: "'", nbsp: ' ' }
+function decodeEntities(text) {
+  return text.replace(/&(#x[0-9a-f]+|#\d+|[a-z]+);/gi, (match, entity) => {
+    if (entity[0] === '#') {
+      const code =
+        entity[1].toLowerCase() === 'x' ? parseInt(entity.slice(2), 16) : parseInt(entity.slice(1), 10)
+      return Number.isFinite(code) ? String.fromCodePoint(code) : match
+    }
+    return ENTITIES[entity.toLowerCase()] ?? match
+  })
+}
+
+function plainText(tokens) {
+  let out = ''
+  for (const token of tokens ?? []) {
+    switch (token.type) {
+      case 'html':
+        break
+      case 'image':
+        out += token.text ?? ''
+        break
+      case 'br':
+      case 'space':
+        out += ' '
+        break
+      case 'list':
+        out += plainText(token.items)
+        break
+      case 'table':
+        out += plainText(token.header)
+        for (const row of token.rows ?? []) out += plainText(row)
+        break
+      default:
+        if (token.tokens?.length) out += plainText(token.tokens)
+        else out += token.text ?? ''
+    }
+    if (BLOCKS.has(token.type)) out += ' '
+  }
+  return out
+}
+
+/** A text as plain text — for an `alt`, a `title`, an option label, a sort key. */
+export function renderPlain(text) {
+  return decodeEntities(plainText(record.lexer(String(text ?? ''))))
+    .replace(/\s+/g, ' ')
+    .trim()
+}
+
+// `md`/`mdInline`/`mdStrip` are `renderBlock`/`renderInline`/`renderPlain`
+// under the one signature and the one convention every site wrote for
+// itself: a missing text is `''`, not an empty paragraph or "undefined", and
+// a record's own line breaks are kept unless a caller says otherwise — a
+// data-package field is typed with breaks on purpose, the way a dictionary
+// entry is not. `renderBlock`/`renderInline`/`renderPlain` stay, for a
+// caller that wants the pipeline's own default (`breaks: false`) instead.
+
+/** `renderBlock`, record convention: `''` for a missing text, line breaks kept by default. */
+export function md(text, { glossary, breaks = true } = {}) {
+  if (!text) return ''
+  return renderBlock(text, { breaks, glossary })
+}
+
+/** `renderInline`, the same convention, for a heading or a table cell. */
+export function mdInline(text, { glossary } = {}) {
+  if (!text) return ''
+  return renderInline(text, { glossary })
+}
+
+/** `renderPlain`, the same convention, for an `alt`, a `title`, a sort key. */
+export function mdStrip(text) {
+  if (!text) return ''
+  return renderPlain(text)
+}

package/src/index.js

@@ -0,0 +1,50 @@
+export { createViewer } from './createViewer.js'
+export { useCatalogueData } from './composables/useCatalogueData.js'
+export { useDataPackage } from './composables/useDataPackage.js'
+export { byId, entityRef, loadEntities, useEntities } from './composables/useEntities.js'
+export { resolveRecordLanguage, useRecordLanguage } from './composables/useRecordLanguage.js'
+export { createI18n, mergeMessages, useI18n, useLocale } from './i18n/index.js'
+export { isRtl, negotiateLanguage } from './i18n/language.js'
+export { md, mdInline, mdStrip, renderBlock, renderInline, renderPlain } from './i18n/markdown.js'
+export { languageLabels, offeredLanguages } from './languages.js'
+export { defaultScrollBehavior, resolveViews } from './router/index.js'
+export { mediaUrl, useSiteConfig } from './siteConfig.js'
+export { sourceUrl, useSiteRights } from './rights.js'
+
+// The list pages: query state, pagination, facets, dates, keyword search.
+export { useListQuery } from './catalogue/listQuery.js'
+export { paginate, sortChronological, usePagination } from './catalogue/pagination.js'
+export { facetOptions, useFacets } from './catalogue/facets.js'
+export {
+  centuryPresets, dateRange, eraLabel, inDateRange, roundOutward, yearBuckets, yearBucketsFromRange,
+} from './catalogue/dates.js'
+export { useSearchLanguage } from './catalogue/searchLanguage.js'
+export {
+  combineExpansions, countryExpansion, glossaryExpansion, parseBooleanQuery, useKeywordIndex,
+} from './catalogue/keywordIndex.js'
+export {
+  effectiveYearTo, eventDateLabel, overlapsRange, useTimelineEvents,
+} from './catalogue/timeline.js'
+
+// The record page: the sheet engine and its derivations.
+export {
+  glossaryEntries, glossaryTermsFor, glossaryTermsForText, sheetRows, useRecordSheet,
+} from './record/recordSheet.js'
+export {
+  citation, relatedRecords, searchGlossary, timelineLinkFor, useGlossaryPopup, useRelatedRecords,
+} from './record/derivations.js'
+export { buildCollectionTree, collectionTreeFromThemes, useCollectionTree } from './record/collectionTree.js'
+export { groupByCountry, partnerHierarchy } from './record/partners.js'
+
+// Conventions every website had written for itself.
+export {
+  PROJECT_ENTRIES, PROJECT_FAMILIES, mwnfLinks, projectFamily, projectName,
+  sectionMeta, useFeaturedRecord, useProjectName, useSection,
+} from './conventions.js'
+
+export { default as I18nText } from './i18n/I18nText.vue'
+export { default as I18nTextInline } from './i18n/I18nTextInline.vue'
+export { default as HomeView } from './views/HomeView.vue'
+export { default as ListView } from './views/ListView.vue'
+export { default as DetailView } from './views/DetailView.vue'
+export { default as NotFoundView } from './views/NotFoundView.vue'

package/src/injectionKeys.js

@@ -0,0 +1 @@
+export const VIEWER_CONFIG = Symbol('viewer-config')

package/src/languages.js

@@ -0,0 +1,49 @@
+import { useDataPackage } from './composables/useDataPackage.js'
+
+// Which languages a website offers, decided by one rule for every website: the
+// languages the package declares for the site, in the package's order, kept
+// only where the site's items actually have content.
+
+export function declaredSiteLanguages(manifest) {
+  const declared = manifest?.site?.languages
+  if (!Array.isArray(declared)) return null
+  return declared.map((entry) => (typeof entry === 'string' ? entry : entry?.code)).filter(Boolean)
+}
+
+/**
+ * `declared ∩ availableLanguages(entity)`, in the declared order. `declared`
+ * defaults to `manifest.site.languages`; a package that carries no such list
+ * offers every language its items have content in, alphabetically.
+ *
+ * A website may pass its own `declared` list to narrow what the package
+ * declares — a language that covers a handful of item sheets is worse than no
+ * switcher — but never to widen it: a code the package does not declare for
+ * this site is dropped even where some items carry it. That keeps the
+ * decision of which languages a site *can* offer in the package, and only the
+ * decision of which of those it *does* offer in the site.
+ */
+export function offeredLanguages({ declared, entity = 'items', manifest, availableLanguages } = {}) {
+  const pkg = useDataPackage()
+  const withContent = (availableLanguages ?? pkg.availableLanguages)(entity)
+  const fromPackage = declaredSiteLanguages(manifest ?? pkg.manifest)
+  if (!declared && !fromPackage) return [...withContent].sort()
+  const list = declared
+    ? fromPackage
+      ? declared.filter((code) => fromPackage.includes(code))
+      : declared
+    : fromPackage
+  return list.filter((code) => withContent.includes(code))
+}
+
+/**
+ * `[{ code, label }]` for the language switcher: the native label the package
+ * declares for each code, the code itself in capitals where it declares none.
+ */
+export function languageLabels(codes, manifest) {
+  const declared = (manifest ?? useDataPackage().manifest)?.site?.languages
+  const labels = new Map()
+  for (const entry of Array.isArray(declared) ? declared : []) {
+    if (entry && typeof entry === 'object' && entry.code) labels.set(entry.code, entry.label)
+  }
+  return codes.map((code) => ({ code, label: labels.get(code) || code.toUpperCase() }))
+}

package/src/legacy/index.js

@@ -0,0 +1,58 @@
+// The legacy URL mappings the four DXA sites decode from `backward_compatibility`
+// — near-identically, because nothing shared did it before this. Pure, no Vue:
+// a site's own composable stays the reactive wrapper around its own
+// `partners` / `countries` / `items` refs, and hands this module plain lists.
+// It is a separate entry point rather than part of the package root because
+// only a site built against DXA's legacy URL shapes needs it — the standalone
+// sites never import it.
+
+/**
+ * A partner's legacy identity, `{ legacyId, countryCode }`, read from its
+ * `backward_compatibility`.
+ *
+ * The DXA sites carry `mwnf3:museums:Mus21:ua` — the third and fourth
+ * colon-separated segments are the legacy id and the two-letter country
+ * code. Sharing History keys its partners differently —
+ * `mwnf3_sharing_history:sh_partners:at_01_d` has no country segment at
+ * all; the country is the key's own prefix, so that shape is decoded apart
+ * rather than by segment index. `countries` (a country's own `code`, its
+ * `backward_compatibility`) is the fallback for a partner carrying no
+ * `backward_compatibility` at all: its `country_id` resolved to the same
+ * two-letter code, so a package still missing the legacy key can be routed
+ * by the country a visitor is already on.
+ */
+export function partnerKey(partner, countries = []) {
+  const parts = String(partner?.backward_compatibility ?? '').split(':')
+  if (parts[0] === 'mwnf3_sharing_history') {
+    const key = parts[2] ?? partner?.id ?? ''
+    return { legacyId: key, countryCode: key.split('_')[0] ?? '' }
+  }
+  if (parts.length > 1) {
+    return { legacyId: parts[2] ?? partner?.id ?? '', countryCode: parts[3] ?? '' }
+  }
+  const country = countries.find((c) => c.id === partner?.country_id)
+  return { legacyId: partner?.id ?? '', countryCode: country?.code ?? '' }
+}
+
+/**
+ * The partner a legacy `/partner/:country/:id` route names, or null — the
+ * reverse of `partnerKey`, scanning `partners` for the one whose key
+ * matches both parts.
+ */
+export function partnerFromKey(partners, countries, countryCode, legacyId) {
+  return (partners ?? []).find((partner) => {
+    const key = partnerKey(partner, countries)
+    return key.legacyId === legacyId && key.countryCode === countryCode
+  }) ?? null
+}
+
+/**
+ * The item a legacy dbUid *path* names, or null. The public item URL keeps
+ * the dbUid path, which is exactly `backward_compatibility` with `:`
+ * swapped for `/` — matched case-insensitively, because Sharing History
+ * stores its keys lowercase.
+ */
+export function itemFromUidPath(items, path) {
+  const needle = String(path ?? '').split('/').join(':').toLowerCase()
+  return (items ?? []).find((item) => item?.backward_compatibility?.toLowerCase() === needle) ?? null
+}