@glossarist/concept-browser 0.7.50 → 0.7.52

package/src/components/formula/FormulaDisplay.vue

@@ -7,7 +7,8 @@
  * `<figure>` receives the anchor ID for `{{formula:id}}` mentions.
  */
 import { computed } from 'vue';
-import type { Formula } from '../../adapters/non-verbal/types';
+import type { Formula } from 'glossarist';
+import type { FormulaNotation } from '../../adapters/non-verbal/types';
 import { useNonVerbalEntity } from '../../composables/use-non-verbal-entity';
 import { resolveFallbackChain } from '../../utils/locale';
 import { anchorId } from '../../utils/non-verbal-anchor';
@@ -27,37 +28,38 @@ const k = () => 'formula' as const;
 const { entity, state, error } = useNonVerbalEntity(k, () => props.datasetId, () => props.entityId);
 
 const fallbackChain = computed(() => resolveFallbackChain(props.datasetLocales));
+const form = computed(() => entity.value as Formula | null);
 const anchor = computed(() => anchorId('formula', props.datasetId, props.entityId));
 const descriptionId = computed(() => `${anchor.value}-desc`);
 </script>
 
 <template>
   <figure
-    v-if="entity && state === 'loaded'"
+    v-if="form && state === 'loaded'"
     :id="anchor"
     class="formula-entity"
   >
     <div class="formula__expr-line">
       <FormulaExpression
-        :expression="(entity as Formula).expression"
-        :notation="(entity as Formula).notation"
+        :expression="form.expression"
+        :notation="(form.notation as FormulaNotation | null)"
         :locale="locale"
         :fallback-chain="fallbackChain"
       />
     </div>
 
     <NonVerbalCaption
-      :identifier="(entity as Formula).identifier"
-      :caption="(entity as Formula).caption"
-      :description="(entity as Formula).description"
+      :identifier="form.identifier"
+      :caption="form.caption"
+      :description="form.description"
       :locale="locale"
       :fallback-chain="fallbackChain"
       :description-id="descriptionId"
     />
 
     <NonVerbalSources
-      v-if="(entity as Formula).sources?.length"
-      :sources="(entity as Formula).sources!"
+      v-if="form.sources?.length"
+      :sources="form.sources"
     />
   </figure>
 

package/src/components/formula/FormulaExpression.vue

@@ -16,13 +16,13 @@ import { pickLocaleMap, localeToBcp47 } from '../../utils/locale';
 import { loadPlurimath } from '../../utils/plurimath';
 
 const props = defineProps<{
-  expression: LocalizedString;
-  notation: FormulaNotation;
+  expression: LocalizedString | null;
+  notation: FormulaNotation | null;
   locale: string;
   fallbackChain?: readonly string[];
 }>();
 
-const resolved = computed(() => pickLocaleMap(props.expression, props.locale, props.fallbackChain));
+const resolved = computed(() => pickLocaleMap(props.expression ?? undefined, props.locale, props.fallbackChain));
 const html = ref<string>('');
 const lang = computed(() => resolved.value ? localeToBcp47(resolved.value.locale) : undefined);
 
@@ -34,7 +34,7 @@ const PLURIMATH_FORMAT: Record<FormulaNotation, string> = {
 
 async function render() {
   const r = resolved.value;
-  if (!r) { html.value = ''; return; }
+  if (!r || !props.notation) { html.value = ''; return; }
   try {
     const Plurimath = await loadPlurimath();
     const p = new Plurimath(r.text, PLURIMATH_FORMAT[props.notation]);

package/src/components/non-verbal/NonVerbalCaption.vue

@@ -22,20 +22,20 @@ import type { LocalizedString } from '../../adapters/non-verbal/types';
 import { pickLocaleMap, localeToBcp47 } from '../../utils/locale';
 
 const props = defineProps<{
-  identifier?: string;
-  caption?: LocalizedString;
-  description?: LocalizedString;
+  identifier?: string | null;
+  caption?: LocalizedString | null;
+  description?: LocalizedString | null;
   locale: string;
   fallbackChain?: readonly string[];
   descriptionId?: string;
 }>();
 
 const captionResolved = computed(() =>
-  pickLocaleMap(props.caption, props.locale, props.fallbackChain),
+  pickLocaleMap(props.caption ?? undefined, props.locale, props.fallbackChain),
 );
 
 const descriptionResolved = computed(() =>
-  pickLocaleMap(props.description, props.locale, props.fallbackChain),
+  pickLocaleMap(props.description ?? undefined, props.locale, props.fallbackChain),
 );
 
 const captionLang = computed(() =>

package/src/components/non-verbal/NonVerbalSources.vue

@@ -6,20 +6,12 @@
  * so the rendering matches the rest of the app. Each source may carry a
  * modification note (e.g. "Adapted.") which is rendered alongside.
  */
-import type { Citation } from 'glossarist';
-import type { NonVerbalSource } from '../../adapters/non-verbal/types';
+import type { ConceptSource } from 'glossarist';
 import CitationDisplay from '../CitationDisplay.vue';
 
 defineProps<{
-  sources: NonVerbalSource[];
+  sources: ConceptSource[];
 }>();
-
-// CitationDisplay expects glossarist's Citation class. NonVerbalSource.origin
-// is wire-compatible at runtime but typed differently on the consumer side;
-// cast once at this boundary.
-function asCitation(origin: NonVerbalSource['origin']): Citation | null {
-  return (origin as unknown as Citation) ?? null;
-}
 </script>
 
 <template>
@@ -27,7 +19,7 @@ function asCitation(origin: NonVerbalSource['origin']): Citation | null {
     <div class="nv-sources__label">Sources</div>
     <ol class="nv-sources__list">
       <li v-for="(src, i) in sources" :key="i" class="nv-source">
-        <CitationDisplay v-if="asCitation(src.origin)" :citation="asCitation(src.origin)!" />
+        <CitationDisplay v-if="src.origin" :citation="src.origin" />
         <span v-if="src.modification" class="nv-source__modification">
           — {{ src.modification }}
         </span>

package/src/components/table/TableDisplay.vue

@@ -6,7 +6,8 @@
  * TableMarkup (HTML / Markdown / AsciiDoc) based on `content.kind`.
  */
 import { computed } from 'vue';
-import type { Table } from '../../adapters/non-verbal/types';
+import type { Table } from 'glossarist';
+import type { TableContent, TableFormat } from '../../adapters/non-verbal/types';
 import { useNonVerbalEntity } from '../../composables/use-non-verbal-entity';
 import { resolveFallbackChain } from '../../utils/locale';
 import { anchorId } from '../../utils/non-verbal-anchor';
@@ -31,12 +32,13 @@ const anchor = computed(() => anchorId('table', props.datasetId, props.entityId)
 const descriptionId = computed(() => `${anchor.value}-desc`);
 
 const table = computed<Table | null>(() => entity.value as Table | null);
+const content = computed<TableContent | null>(() => (table.value?.content ?? null) as TableContent | null);
 const structuredContent = computed(() => {
-  const c = table.value?.content;
+  const c = content.value;
   return c && c.kind === 'structured' ? c : null;
 });
 const markup = computed(() => {
-  const c = table.value?.content;
+  const c = content.value;
   return c && c.kind === 'markup' ? c.markup : null;
 });
 </script>
@@ -56,7 +58,7 @@ const markup = computed(() => {
     <TableMarkup
       v-else-if="markup"
       :content="markup"
-      :format="table.format"
+      :format="(table.format as TableFormat | null)"
       :locale="locale"
       :fallback-chain="fallbackChain"
     />

package/src/components/table/TableMarkup.vue

@@ -18,7 +18,7 @@ import { renderAsciiDocLite } from '../../utils/asciidoc-lite';
 
 const props = defineProps<{
   content: LocalizedString;
-  format?: TableFormat;
+  format?: TableFormat | null;
   locale: string;
   fallbackChain?: readonly string[];
 }>();

package/src/composables/use-color-theme.ts

@@ -0,0 +1,82 @@
+/**
+ * useColorTheme — emits CSS custom properties for every colorable
+ * semantic category, scoped per dataset/group via [data-ds] / [data-group]
+ * attribute selectors.
+ *
+ * Components consume via `var(--rel-lifecycle-light)` etc. Theme
+ * switching is a single class swap on `<html>` — no JS recompute.
+ */
+import { watchEffect, onScopeDispose } from 'vue';
+import { useSiteConfig } from '../config/use-site-config';
+import { useVocabularyStore } from '../stores/vocabulary';
+import { createColorTheme, type ColorPair } from '../utils/color-theme';
+import type { DatasetColorSpec } from '../config/types';
+
+function kebab(s: string): string {
+  return s.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase().replace(/[^a-z0-9-]/g, '-');
+}
+
+function setVar(root: HTMLElement, name: string, value: string): void {
+  root.style.setProperty(name, value);
+}
+
+function emitPair(root: HTMLElement, prefix: string, key: string, pair: ColorPair): void {
+  const safeKey = kebab(key);
+  setVar(root, `--${prefix}-${safeKey}-light`, pair.light);
+  setVar(root, `--${prefix}-${safeKey}-dark`, pair.dark);
+}
+
+export function useColorTheme(): void {
+  const { config } = useSiteConfig();
+  const store = useVocabularyStore();
+
+  const disposers: Array<() => void> = [];
+
+  watchEffect(() => {
+    const siteColors = config.value?.colors;
+    const theme = createColorTheme(siteColors);
+    const root = document.documentElement;
+
+    /* Global category + type colors — emit on :root */
+    for (const cat of Object.keys(theme.defaults.relationshipCategory)) {
+      emitPair(root, 'rel-cat', cat, theme.relationshipCategoryColor(cat));
+    }
+    for (const type of Object.keys(theme.defaults.relationshipType)) {
+      emitPair(root, 'rel-type', type, theme.relationshipTypeColor(type));
+    }
+    for (const status of Object.keys(theme.defaults.conceptStatus)) {
+      emitPair(root, 'concept-status', status, theme.conceptStatusColor(status));
+    }
+    for (const kind of Object.keys(theme.defaults.groupKind)) {
+      emitPair(root, 'group-kind', kind, theme.groupKindColor(kind));
+    }
+  });
+
+  /* Per-dataset colors — emit on [data-ds="<id>"] scoped wrappers.
+     Uses a stable wrapper element so the variables don't leak globally. */
+  watchEffect(() => {
+    const siteColors = config.value?.colors;
+    const theme = createColorTheme(siteColors);
+
+    for (const ds of store.datasetList) {
+      const declared = ds.manifest?.color as DatasetColorSpec | undefined;
+      const pair = theme.datasetColor(ds.id, declared);
+      const scopeId = `ds-color-scope-${ds.id.replace(/[^a-zA-Z0-9]/g, '_')}`;
+      let scope = document.getElementById(scopeId);
+      if (!scope) {
+        scope = document.createElement('div');
+        scope.id = scopeId;
+        scope.setAttribute('data-ds', ds.id);
+        scope.style.display = 'none';
+        document.head.appendChild(scope);
+        disposers.push(() => scope?.remove());
+      }
+      setVar(scope, '--ds-light', pair.light);
+      setVar(scope, '--ds-dark', pair.dark);
+    }
+  });
+
+  onScopeDispose(() => {
+    for (const dispose of disposers) dispose();
+  });
+}

package/src/composables/use-format-registry.ts

@@ -0,0 +1,42 @@
+export type FormatAvailability = 'per-concept' | 'aggregate' | 'both';
+export type SerializeMode = 'build' | 'runtime';
+
+export interface FormatDescriptor {
+  id: string;
+  extension: string;
+  mediaType: string;
+  label: string;
+  available: FormatAvailability;
+  serialize: SerializeMode;
+}
+
+const REGISTRY = new Map<string, FormatDescriptor>();
+
+export function registerFormat(desc: FormatDescriptor): void {
+  REGISTRY.set(desc.id, desc);
+}
+
+export function unregisterFormat(id: string): void {
+  REGISTRY.delete(id);
+}
+
+export function getFormat(id: string): FormatDescriptor | undefined {
+  return REGISTRY.get(id);
+}
+
+export function listFormats(opts: { availability?: FormatAvailability } = {}): FormatDescriptor[] {
+  const filter = opts.availability;
+  return [...REGISTRY.values()]
+    .filter(f => !filter || f.available === filter || f.available === 'both')
+    .sort((a, b) => a.label.localeCompare(b.label));
+}
+
+export function clearFormats(): void {
+  REGISTRY.clear();
+}
+
+registerFormat({ id: 'ttl',    extension: 'ttl',     mediaType: 'text/turtle',           label: 'Turtle',      available: 'both',         serialize: 'build' });
+registerFormat({ id: 'jsonld', extension: 'jsonld',  mediaType: 'application/ld+json',   label: 'JSON-LD',     available: 'both',         serialize: 'build' });
+registerFormat({ id: 'yaml',   extension: 'yaml',   mediaType: 'application/yaml',       label: 'YAML',        available: 'per-concept',  serialize: 'build' });
+registerFormat({ id: 'tbx',    extension: 'tbx.xml', mediaType: 'application/x-tbx',     label: 'TBX',         available: 'aggregate',    serialize: 'build' });
+registerFormat({ id: 'jsonl',  extension: 'jsonl',  mediaType: 'application/jsonl+json', label: 'JSON-Lines',  available: 'aggregate',    serialize: 'build' });

package/src/composables/use-non-verbal-entity.ts

@@ -8,7 +8,8 @@
  */
 import { ref, watch, shallowRef } from 'vue';
 import { getFactory } from '../adapters/factory';
-import type { NonVerbalEntity, NonVerbalKind } from '../adapters/non-verbal/types';
+import type { NonVerbalKind } from '../adapters/non-verbal/types';
+import type { NonVerbalEntity } from 'glossarist';
 
 export type LoadState = 'loading' | 'loaded' | 'not-found' | 'error';
 

package/src/composables/useDatasetSeries.ts

@@ -0,0 +1,258 @@
+/**
+ * Dataset series — groups related editions of the same vocabulary.
+ *
+ * A "series" is a family of datasets that share a base name but differ in
+ * edition year/status. e.g. `viml-2022`, `viml-2013`, `viml-2000`, `viml-1968`
+ * all belong to the `viml` series.
+ *
+ * Resolution order (most authoritative first):
+ *   1. Explicit `datasetGroups` from site-config with `series: true` —
+ *      config-driven series have stable ids, labels, and orderings.
+ *   2. Auto-derivation by naming convention — `name-YYYY` → `name`. Used
+ *      only when NO configured groups exist (backward compat).
+ *
+ * Within a series, editions are sorted by year ascending so the timeline
+ * reads naturally left-to-right / top-to-bottom.
+ */
+
+import { computed } from 'vue';
+import { useVocabularyStore } from '../stores/vocabulary';
+import { useSiteConfig } from '../config/use-site-config';
+import { resolveGroupKind } from '../config/group-types';
+import type { Manifest } from '../adapters/types';
+
+export interface DatasetSeriesMember {
+  id: string;
+  ref: string;
+  year?: number;
+  status: string;
+  isCurrent: boolean;
+  isActive: boolean;
+  conceptCount?: number;
+  registerId: string;
+}
+
+export interface DatasetSeries {
+  /** Stable series key, e.g. `viml`. */
+  key: string;
+  /** Display title for the series, e.g. `VIML` or `International Vocabulary of Legal Metrology`. */
+  title: string;
+  /** Optional description from config. */
+  description?: string;
+  /** Optional accent color from config. Accepts single hex or { light, dark }. */
+  color?: string | { light: string; dark: string };
+  /** All known editions, oldest first. */
+  members: DatasetSeriesMember[];
+  /** The current (newest valid) member, if any. */
+  current?: DatasetSeriesMember;
+  /** Total concept count across the series (sum of members). */
+  totalConcepts: number;
+  /** Whether this series was explicitly configured (vs auto-derived). */
+  configured: boolean;
+}
+
+const YEAR_SUFFIX = /[-_:](\d{4})([a-z]?)$/i;
+
+/** Strip trailing year from a dataset id to get the series key. */
+export function deriveSeriesKey(id: string): string {
+  return id.replace(YEAR_SUFFIX, '').replace(/[-_:]+$/, '');
+}
+
+/** Extract a year from a string. Prefers the ISO convention
+ *  (`:YYYY`, `:YYYYa`) used in ISO/IEC standard references, then
+ *  falls back to a year-as-suffix match (`-YYYY`, `_YYYY`, ` YYYY`),
+ *  then a bare 4-digit year. Returns undefined for out-of-range or
+ *  4-digit runs that are clearly standard numbers (e.g. `ISO 10241`
+ *  → 1024 is rejected because it's not preceded by `:`). */
+export function extractYear(source: string): number | undefined {
+  if (!source) return undefined;
+  const isoMatch = source.match(/:(\d{4})([a-z]?)$/i);
+  if (isoMatch) {
+    const year = parseInt(isoMatch[1], 10);
+    if (year >= 1900 && year <= 2100) return year;
+  }
+  const suffixMatch = source.match(/[-_\s](\d{4})([a-z]?)$/i);
+  if (suffixMatch) {
+    const year = parseInt(suffixMatch[1], 10);
+    if (year >= 1900 && year <= 2100) return year;
+  }
+  if (/^\d{4}$/.test(source.trim())) {
+    const year = parseInt(source.trim(), 10);
+    if (year >= 1900 && year <= 2100) return year;
+  }
+  return undefined;
+}
+
+/** Build the series title from a member — `OIML V 1:2022` → `OIML V 1`.
+ *  Returns the dataset id when the manifest is unavailable. */
+function deriveSeriesTitle(m: Manifest | undefined): string {
+  if (!m) return '';
+  const ref = m.ref ?? m.title;
+  return ref.replace(/[:\s-]\d{4}([a-z]?)$/i, '').trim() || m.title;
+}
+
+function manifestToMember(m: Manifest, activeDatasetId?: string): DatasetSeriesMember {
+  const year = extractYear(m.id) ?? extractYear(m.ref ?? '') ?? extractYear(m.title);
+  return {
+    id: m.id,
+    ref: m.ref ?? m.title,
+    year,
+    status: m.status ?? m.editionStatus ?? 'unknown',
+    isCurrent: false,
+    isActive: m.id === activeDatasetId,
+    conceptCount: m.conceptCount,
+    registerId: m.id,
+  };
+}
+
+/**
+ * Group manifests into series. Pure function.
+ *
+ * Strategy:
+ *   1. If `configuredGroups` is provided AND has any group whose `kind` is
+ *      `lineage` (or the legacy `series: true` flag), use ONLY configured
+ *      lineage groups — config is the source of truth.
+ *   2. Otherwise, fall back to auto-derivation by naming convention.
+ */
+export function groupManifestsIntoSeries(
+  manifests: Manifest[],
+  activeDatasetId?: string,
+  configuredGroups?: Array<{
+    id: string;
+    label?: string;
+    description?: string;
+    color?: string | { light: string; dark: string };
+    datasets: string[];
+    series?: boolean;
+    kind?: 'lineage' | 'topic' | 'family' | 'collection' | 'default';
+    current?: string;
+  }>,
+): DatasetSeries[] {
+  const manifestMap = new Map(manifests.map(m => [m.id, m] as const));
+
+  /* Strategy 1: config-driven lineage series */
+  const configSeries = (configuredGroups ?? []).filter(g => resolveGroupKind(g) === 'lineage');
+  if (configSeries.length > 0) {
+    const series: DatasetSeries[] = [];
+    for (const g of configSeries) {
+      const members: DatasetSeriesMember[] = [];
+      /* Include EVERY dataset in the config, even if its manifest isn't loaded
+         yet. Without this, visiting /dataset/viml-2000 (only manifest loaded)
+         would shrink the series to one member and mis-mark viml-2000 as current. */
+      for (const id of g.datasets) {
+        const m = manifestMap.get(id);
+        if (m) {
+          members.push(manifestToMember(m, activeDatasetId));
+        } else {
+          /* Stub member from id alone — year derived from `<name>-YYYY` pattern. */
+          members.push({
+            id,
+            ref: id,
+            year: extractYear(id),
+            status: 'unknown',
+            isCurrent: false,
+            isActive: id === activeDatasetId,
+            conceptCount: undefined,
+            registerId: id,
+          });
+        }
+      }
+      if (members.length === 0) continue;
+      members.sort((a, b) => (a.year ?? 0) - (b.year ?? 0));
+
+      /* Determine current edition:
+         1. Explicit `current` field from config (most authoritative)
+         2. Newest member with status='valid'
+         3. Last member (newest by year) */
+      let current: DatasetSeriesMember | undefined;
+      if (g.current) {
+        current = members.find(m => m.id === g.current);
+      }
+      if (!current) {
+        const validMembers = members.filter(m => m.status === 'valid');
+        current = validMembers[validMembers.length - 1] ?? members[members.length - 1];
+      }
+      if (current) current.isCurrent = true;
+
+      const totalConcepts = members.reduce((sum, m) => sum + (m.conceptCount ?? 0), 0);
+      series.push({
+        key: g.id,
+        title: g.label ?? (deriveSeriesTitle(manifestMap.get(members[0].id)) || g.id),
+        description: g.description,
+        color: g.color,
+        members,
+        current,
+        totalConcepts,
+        configured: true,
+      });
+    }
+    return series;
+  }
+
+  /* Strategy 2: auto-derive by naming convention */
+  const groups = new Map<string, Manifest[]>();
+  for (const m of manifests) {
+    const key = deriveSeriesKey(m.id);
+    if (!groups.has(key)) groups.set(key, []);
+    groups.get(key)!.push(m);
+  }
+
+  const series: DatasetSeries[] = [];
+  for (const [key, members] of groups) {
+    if (members.length === 0) continue;
+    const enriched = members.map(m => manifestToMember(m, activeDatasetId));
+    enriched.sort((a, b) => (a.year ?? 0) - (b.year ?? 0));
+    const validMembers = enriched.filter(m => m.status === 'valid');
+    const current = validMembers[validMembers.length - 1] ?? enriched[enriched.length - 1];
+    if (current) current.isCurrent = true;
+    const totalConcepts = enriched.reduce((sum, m) => sum + (m.conceptCount ?? 0), 0);
+    series.push({
+      key,
+      title: deriveSeriesTitle(members[0]),
+      members: enriched,
+      current,
+      totalConcepts,
+      configured: false,
+    });
+  }
+
+  series.sort((a, b) => a.key.localeCompare(b.key));
+  return series;
+}
+
+/**
+ * Composable — exposes series for the currently-loaded datasets.
+ * Reactive: re-derives when the store's dataset list changes.
+ */
+export function useDatasetSeries(activeDatasetId?: () => string | undefined) {
+  const store = useVocabularyStore();
+  const { datasetGroups } = useSiteConfig();
+
+  const series = computed<DatasetSeries[]>(() => {
+    const manifests: Manifest[] = [];
+    for (const [, adapter] of store.datasets.entries()) {
+      const m = adapter.manifest;
+      if (m) manifests.push(m);
+    }
+    const activeId = activeDatasetId?.();
+    const configured = datasetGroups.value?.map(g => ({
+      id: g.id,
+      label: g.label,
+      description: g.description,
+      color: g.color,
+      datasets: g.datasets,
+      series: g.series,
+      kind: g.kind,
+      current: g.current,
+    }));
+    return groupManifestsIntoSeries(manifests, activeId, configured);
+  });
+
+  const seriesForActive = computed<DatasetSeries | undefined>(() => {
+    const activeId = activeDatasetId?.();
+    if (!activeId) return undefined;
+    return series.value.find(s => s.members.some(m => m.id === activeId));
+  });
+
+  return { series, seriesForActive };
+}