@glossarist/concept-browser 0.7.31 → 0.7.33

package/src/composables/use-concept-content.ts

@@ -0,0 +1,160 @@
+import { computed, ref, watch, type ComputedRef } from 'vue';
+import type { Concept, LocalizedConcept, ConceptSource, Designation } from 'glossarist';
+import type { Manifest } from '../adapters/types';
+import type { RenderOptions } from '../utils/math';
+import { renderMath, cleanContent } from '../utils/math';
+import { getAnnotations } from '../adapters/model-bridge';
+import { getPreferredTerm, entryStatusColor, entryStatusLabel, entryStatusDefinition } from '../utils/concept-helpers';
+import { sortLanguages } from '../utils/lang';
+import { useSiteConfig } from '../config/use-site-config';
+import { useI18n } from '../i18n';
+
+export interface LangContent {
+  lang: string;
+  lc: LocalizedConcept;
+  renderedTerm: string;
+  definition: string;
+  renderedDefinition: string;
+  annotations: string[];
+  renderedAnnotations: string[];
+  notes: string[];
+  renderedNotes: string[];
+  examples: string[];
+  renderedExamples: string[];
+  sources: ConceptSource[];
+  designations: Designation[];
+  renderedDesignations: Map<string, string>;
+  entryStatus: string;
+  classification: string | null;
+  reviewType: string | null;
+  release: string | null;
+  lineageSourceSimilarity: number | null;
+  lcScript: string | null;
+  lcSystem: string | null;
+}
+
+export function useConceptContent(
+  concept: ComputedRef<Concept>,
+  manifest: ComputedRef<Manifest>,
+  renderOpts: ComputedRef<RenderOptions>,
+) {
+  const { locale } = useI18n();
+  const { config: siteConfig } = useSiteConfig();
+
+  const languages = computed(() => {
+    const sorted = sortLanguages(concept.value.languages, manifest.value.languageOrder);
+    const current = locale.value;
+    const idx = sorted.indexOf(current);
+    if (idx > 0) {
+      sorted.splice(idx, 1);
+      sorted.unshift(current);
+    }
+    return sorted;
+  });
+
+  const allLangContent = computed(() => {
+    const result: LangContent[] = [];
+    for (const lang of languages.value) {
+      const lc = concept.value.localization(lang);
+      if (!lc) continue;
+
+      const definition = lc.definitions
+        .map(d => d.content).filter(Boolean).join('\n\n');
+      const annotations = getAnnotations(lc).map(a => a.content).filter(Boolean);
+      const notes = lc.notes.map(n => n.content).filter(Boolean);
+      const examples = lc.examples.map(e => e.content).filter(Boolean);
+      const opts = renderOpts.value;
+
+      result.push({
+        lang,
+        lc,
+        renderedTerm: renderMath(getPreferredTerm(lc, '')),
+        definition,
+        renderedDefinition: renderMath(definition, opts),
+        annotations,
+        renderedAnnotations: annotations.map((a: string) => renderMath(a, opts)),
+        notes,
+        renderedNotes: notes.map(n => renderMath(n, opts)),
+        examples,
+        renderedExamples: examples.map(e => renderMath(e, opts)),
+        sources: lc.sources,
+        designations: lc.terms,
+        renderedDesignations: new Map(lc.terms.map(d => [d.designation, renderMath(d.designation)])),
+        entryStatus: lc.entryStatus ?? '',
+        classification: lc.classification,
+        reviewType: lc.reviewType,
+        release: lc.release,
+        lineageSourceSimilarity: lc.lineageSourceSimilarity,
+        lcScript: lc.script,
+        lcSystem: lc.system,
+      });
+    }
+    return result;
+  });
+
+  const langContentMap = computed(() => {
+    const map = new Map<string, LangContent>();
+    for (const lc of allLangContent.value) map.set(lc.lang, lc);
+    return map;
+  });
+
+  function hasContent(lc: LangContent): boolean {
+    return !!(lc.definition || lc.annotations.length || lc.notes.length || lc.examples.length || lc.sources.length);
+  }
+
+  const collapsedLangs = ref(new Set<string>());
+
+  function initCollapsed() {
+    const mainLangs = siteConfig.value?.defaults?.mainLanguages || [];
+    const mainSet = new Set(mainLangs.length ? mainLangs : ['eng']);
+    const collapsed = new Set<string>();
+    for (const lc of allLangContent.value) {
+      if (!hasContent(lc) && !mainSet.has(lc.lang)) {
+        collapsed.add(lc.lang);
+      }
+    }
+    collapsedLangs.value = collapsed;
+  }
+
+  watch(languages, () => { initCollapsed(); }, { immediate: true });
+
+  const allCollapsed = computed(() => collapsedLangs.value.size === allLangContent.value.length);
+
+  function toggleLang(lang: string) {
+    const s = new Set(collapsedLangs.value);
+    if (s.has(lang)) s.delete(lang); else s.add(lang);
+    collapsedLangs.value = s;
+  }
+
+  function toggleAll() {
+    collapsedLangs.value = allCollapsed.value
+      ? new Set()
+      : new Set(allLangContent.value.map(lc => lc.lang));
+  }
+
+  function plainTruncate(html: string, max: number = 120): string {
+    const text = cleanContent(html).replace(/<[^>]+>/g, '').replace(/\s+/g, ' ').trim();
+    return text.length <= max ? text : text.slice(0, max).trimEnd() + '…';
+  }
+
+  function orderedDesignations(lang: string): Designation[] {
+    const desigs = langContentMap.value.get(lang)?.designations ?? [];
+    const preferred = desigs.filter(d => d.normativeStatus === 'preferred');
+    const admitted = desigs.filter(d => d.normativeStatus === 'admitted' || d.normativeStatus === 'deprecated');
+    const rest = desigs.filter(d => d.normativeStatus !== 'preferred' && d.normativeStatus !== 'admitted' && d.normativeStatus !== 'deprecated');
+    return [...preferred, ...admitted, ...rest];
+  }
+
+  return {
+    languages,
+    allLangContent,
+    langContentMap,
+    hasContent,
+    collapsedLangs,
+    allCollapsed,
+    toggleLang,
+    toggleAll,
+    plainTruncate,
+    orderedDesignations,
+  };
+}

package/src/composables/use-concept-edges.ts

@@ -0,0 +1,181 @@
+import { computed, type ComputedRef } from 'vue';
+import type { Concept, RelatedConcept } from 'glossarist';
+import type { Manifest, GraphEdge } from '../adapters/types';
+import { getFactory } from '../adapters/factory';
+import { conceptUri } from '../adapters/model-bridge';
+import { useVocabularyStore } from '../stores/vocabulary';
+import { useDsStyle } from '../utils/dataset-style';
+import { categorizeRelationship, relationshipLabel, INVERSE_RELATIONSHIPS } from '../utils/relationship-categories';
+import { langLabel } from '../utils/lang';
+import { escapeAttr } from '../utils/escape';
+import { useI18n } from '../i18n';
+
+export interface EdgeDisplay {
+  uri: string;
+  conceptId: string;
+  designation: string;
+  tooltip: string;
+  isLocal: boolean;
+  badge: { id: string; title: string } | null;
+}
+
+export function useConceptEdges(
+  concept: ComputedRef<Concept>,
+  registerId: ComputedRef<string>,
+  manifest: ComputedRef<Manifest>,
+  edges: ComputedRef<GraphEdge[]>,
+) {
+  const factory = getFactory();
+  const store = useVocabularyStore();
+  const { getColor } = useDsStyle();
+  const { locale } = useI18n();
+
+  const conceptUriValue = computed(() =>
+    conceptUri(concept.value, registerId.value, manifest.value.uriBase)
+  );
+
+  const outgoingEdges = computed(() =>
+    store.graph.getUniqueEdges(conceptUriValue.value, 'outgoing', 'target')
+      .filter(e => e.type !== 'domain' && e.type !== 'section')
+  );
+
+  const incomingEdges = computed(() =>
+    store.graph.getUniqueEdges(conceptUriValue.value, 'incoming', 'source')
+      .filter(e => e.type !== 'domain' && e.type !== 'section')
+  );
+
+  const edgeDisplayCache = computed(() => {
+    const cache = new Map<string, EdgeDisplay>();
+    for (const e of edges.value) {
+      const uri = e.source === conceptUriValue.value ? e.target : e.source;
+      if (cache.has(uri)) continue;
+      const resolution = factory.resolve(uri, registerId.value);
+      const isLocal = resolution.type === 'internal' && resolution.registerId === registerId.value;
+      const conceptId = uri.match(/\/concept\/([^/]+)$/)?.[1] ?? uri.split('/').pop() ?? uri;
+      const node = store.graph.getNode(uri);
+      const designation = node
+        ? (node.designations[locale.value] || node.designations.eng || Object.values(node.designations)[0] || '')
+        : '';
+      const tooltipLines: string[] = [uri];
+      if (node) {
+        for (const [lang, des] of Object.entries(node.designations)) {
+          tooltipLines.push(`${langLabel(lang)}: ${des}`);
+        }
+      }
+      let badge: { id: string; title: string } | null = null;
+      if (resolution.type === 'internal' && resolution.registerId !== registerId.value) {
+        const m = store.manifests.get(resolution.registerId);
+        badge = { id: resolution.registerId, title: m?.shortname || m?.title || resolution.registerId };
+      } else if (resolution.type === 'site') {
+        badge = { id: '', title: resolution.label };
+      } else if (resolution.type === 'url') {
+        badge = { id: '', title: resolution.label };
+      }
+      cache.set(uri, { uri, conceptId, designation, tooltip: tooltipLines.join('\n'), isLocal, badge });
+    }
+    return cache;
+  });
+
+  function getEdgeDisplay(uri: string): EdgeDisplay {
+    return edgeDisplayCache.value.get(uri) ?? { uri, conceptId: uri, designation: '', tooltip: uri, isLocal: false, badge: null };
+  }
+
+  function edgeBadgeColor(type: string, direction: 'out' | 'in'): string {
+    if (type === 'supersedes' || type === 'superseded_by') {
+      return direction === 'out' ? 'text-orange-700 bg-orange-50' : 'text-red-700 bg-red-50';
+    }
+    return categorizeRelationship(type).color;
+  }
+
+  function inverseEdgeType(type: string): string {
+    return INVERSE_RELATIONSHIPS[type] || type;
+  }
+
+  // Concept-level related concepts (managed concept cross-references)
+  const conceptRelated = computed(() => {
+    const direct = concept.value.relatedConcepts?.filter(rc => !INVERSE_RELATIONSHIPS[rc.type]) ?? [];
+    const derived = incomingEdges.value
+      .filter(e => INVERSE_RELATIONSHIPS[e.type])
+      .map(e => {
+        const parsed = factory.resolve(e.source, registerId.value);
+        const sourceUrn = parsed.type === 'internal'
+          ? store.manifests.get(parsed.registerId)?.datasetUri
+          : null;
+        const conceptId = e.source.match(/\/concept\/([^/]+)$/)?.[1];
+        return {
+          type: INVERSE_RELATIONSHIPS[e.type],
+          ref: sourceUrn && conceptId ? { source: sourceUrn, id: conceptId } : null,
+          content: '',
+        };
+      });
+    return [...direct, ...derived];
+  });
+
+  function resolveRelatedRef(ref: { source: string | null; id: string | null } | null) {
+    return factory.resolveRelatedRef(ref, registerId.value);
+  }
+
+  const resolvedRefs = computed(() => {
+    const map = new Map<string, { target: { registerId: string; conceptId: string } | null }>();
+    for (const cr of conceptRelated.value) {
+      const key = `${cr.ref?.source ?? ''}:${cr.ref?.id ?? ''}`;
+      if (map.has(key)) continue;
+      map.set(key, { target: resolveRelatedRef(cr.ref) });
+    }
+    return map;
+  });
+
+  function getResolvedRef(ref: { source: string | null; id: string | null } | null) {
+    if (!ref) return { target: null };
+    const key = `${ref.source ?? ''}:${ref.id ?? ''}`;
+    return resolvedRefs.value.get(key) ?? { target: resolveRelatedRef(ref) };
+  }
+
+  function relatedLabel(dr: { content?: string | null; ref?: { source: string | null; id: string | null } | null }): string {
+    if (dr.content) return dr.content;
+    const resolved = dr.ref ? getResolvedRef(dr.ref).target : null;
+    if (resolved) {
+      const m = store.manifests.get(resolved.registerId);
+      const dsLabel = m?.shortname || m?.title || resolved.registerId;
+      return `${resolved.conceptId} (${dsLabel})`;
+    }
+    return dr.ref ? `${dr.ref.id || ''} (${dr.ref.source || ''})`.trim() : '';
+  }
+
+  async function navigateEdge(edge: GraphEdge) {
+    const uri = edge.source === conceptUriValue.value ? edge.target : edge.source;
+    const resolution = factory.resolve(uri);
+    const router = (await import('vue-router')).useRouter();
+
+    if (resolution.type === 'internal') {
+      router.push({ name: 'concept', params: { registerId: resolution.registerId, conceptId: resolution.conceptId } });
+    } else if (resolution.type === 'site') {
+      window.open(`${resolution.baseUrl}/resolve/${encodeURIComponent(uri)}`, '_blank', 'noopener');
+    } else if (resolution.type === 'url') {
+      window.open(resolution.url, '_blank', 'noopener');
+    }
+  }
+
+  async function navigateRelated(ref: { source: string | null; id: string | null }) {
+    const target = resolveRelatedRef(ref);
+    if (!target) return;
+    const router = (await import('vue-router')).useRouter();
+    router.push({ name: 'concept', params: { registerId: target.registerId, conceptId: target.conceptId } });
+  }
+
+  return {
+    conceptUriValue,
+    outgoingEdges,
+    incomingEdges,
+    edgeDisplayCache,
+    getEdgeDisplay,
+    edgeBadgeColor,
+    inverseEdgeType,
+    conceptRelated,
+    resolveRelatedRef,
+    getResolvedRef,
+    relatedLabel,
+    navigateEdge,
+    navigateRelated,
+  };
+}

package/src/data/taxonomies.json

@@ -221,6 +221,18 @@
         "prefLabel": "not equal",
         "definition": "The concept is not equal to the source."
       }
+    },
+    "colors": {
+      "identical": "badge-green",
+      "similar": "badge-blue",
+      "modified": "badge-yellow",
+      "restyle": "badge-yellow",
+      "context_added": "badge-blue",
+      "generalisation": "badge-purple",
+      "specialisation": "badge-purple",
+      "unspecified": "badge-gray",
+      "related": "badge-gray",
+      "not_equal": "bg-red-50 text-red-700"
     }
   },
   "relationshipType": {
@@ -940,4 +952,4 @@
       }
     }
   }
-}
+}

package/src/graph/GraphEngine.ts

@@ -98,6 +98,21 @@ export class GraphEngine {
     return result;
   }
 
+  getUniqueEdges(uri: string, direction: 'outgoing' | 'incoming' | 'both', dedupeBy: 'source' | 'target' = 'target'): GraphEdge[] {
+    const raw = direction === 'outgoing'
+      ? this.getEdges(uri)
+      : direction === 'incoming'
+        ? this.getIncomingEdges(uri)
+        : [...this.getEdges(uri), ...this.getIncomingEdges(uri)];
+    const seen = new Set<string>();
+    return raw.filter(e => {
+      const key = `${e[dedupeBy]}\0${e.type}`;
+      if (seen.has(key)) return false;
+      seen.add(key);
+      return true;
+    });
+  }
+
   getNeighbors(uri: string): { outgoing: string[]; incoming: string[] } {
     const outgoing: string[] = [];
     const adj = this.adjacency.get(uri);

package/src/utils/concept-helpers.ts

@@ -2,17 +2,15 @@ import type { LocalizedConcept } from 'glossarist';
 import { ontology } from '../adapters/ontology-registry';
 
 export function entryStatusColor(status: string): string {
-  return ontology.getColor('entryStatus', status) ?? 'badge-gray';
+  return ontology.getDisplay('entryStatus', status).color;
 }
 
 export function conceptStatusColor(status: string | null): string {
-  if (!status) return 'badge-gray';
-  return ontology.getColor('conceptStatus', status) ?? 'badge-gray';
+  return ontology.getDisplay('conceptStatus', status).color;
 }
 
 export function conceptStatusLabel(status: string | null): string {
-  if (!status) return '';
-  return ontology.getLabel('conceptStatus', status) || status;
+  return ontology.getDisplay('conceptStatus', status).label;
 }
 
 export function conceptStatusDefinition(status: string | null): string | null {
@@ -21,8 +19,7 @@ export function conceptStatusDefinition(status: string | null): string | null {
 }
 
 export function entryStatusLabel(status: string | null): string {
-  if (!status) return '';
-  return ontology.getLabel('entryStatus', status) || status;
+  return ontology.getDisplay('entryStatus', status).label;
 }
 
 export function entryStatusDefinition(status: string | null): string | null {

package/src/utils/designation-registry.ts

@@ -9,52 +9,28 @@ export interface DesignationTypeInfo {
 }
 
 export function designationTypeInfo(designation: Designation): DesignationTypeInfo {
-  const type = designation.type;
-  const concept = ontology.getConcept('designationType', type);
-  return {
-    label: concept?.prefLabel ?? type,
-    color: ontology.getColor('designationType', type) ?? 'bg-gray-50 text-gray-700',
-    definition: concept?.definition ?? undefined,
-  };
+  return ontology.getDisplay('designationType', designation.type, 'bg-gray-50 text-gray-700');
 }
 
 export function normativeStatusInfo(status: string | null): { label: string; color: string; definition?: string } {
-  if (!status) return { label: '', color: 'bg-gray-50 text-gray-700' };
-  const concept = ontology.getConcept('normativeStatus', status);
-  return {
-    label: concept?.prefLabel ?? status,
-    color: ontology.getColor('normativeStatus', status) ?? 'bg-gray-50 text-gray-700',
-    definition: concept?.definition ?? undefined,
-  };
+  return ontology.getDisplay('normativeStatus', status, 'bg-gray-50 text-gray-700');
 }
 
 export function sourceStatusInfo(status: string | null): { label: string; color: string; definition?: string } {
-  if (!status) return { label: '', color: 'badge-gray' };
-  const concept = ontology.getConcept('sourceStatus', status);
-  return {
-    label: concept?.prefLabel ?? status,
-    color: 'badge-gray',
-    definition: concept?.definition ?? undefined,
-  };
+  return ontology.getDisplay('sourceStatus', status, 'badge-gray');
 }
 
 export function sourceTypeInfo(type: string | null): { label: string; color: string; definition?: string } {
-  if (!type) return { label: '', color: 'badge-gray' };
-  const concept = ontology.getConcept('sourceType', type);
-  return {
-    label: concept?.prefLabel ?? type,
-    color: ontology.getColor('sourceType', type) ?? 'badge-gray',
-    definition: concept?.definition ?? undefined,
-  };
+  return ontology.getDisplay('sourceType', type, 'badge-gray');
 }
 
 export function termTypeInfo(termType: string | null): { label: string; category: string; definition?: string } {
   if (!termType) return { label: '', category: '' };
-  const concept = ontology.getConcept('termType', termType);
+  const display = ontology.getDisplay('termType', termType);
   return {
-    label: concept?.prefLabel ?? termType,
-    category: concept?.broader ?? '',
-    definition: concept?.definition ?? undefined,
+    label: display.label,
+    category: ontology.getBroader('termType', termType) ?? '',
+    definition: display.definition,
   };
 }
 
@@ -68,18 +44,20 @@ export function abbreviationDetails(designation: Designation): string[] {
   return parts;
 }
 
+const GRAMMAR_BOOLEAN_POS = ['noun', 'verb', 'adj', 'adverb', 'preposition', 'participle'] as const;
+
 export function grammarBadges(gi: GrammarInfo): { label: string; definition?: string }[] {
   const badges: { label: string; definition?: string }[] = [];
   if (gi.gender) {
-    const concept = ontology.getConcept('grammarGender', gi.gender);
-    badges.push({ label: concept?.prefLabel ?? gi.gender, definition: concept?.definition ?? undefined });
+    const display = ontology.getDisplay('grammarGender', gi.gender);
+    badges.push({ label: display.label, definition: display.definition });
   }
   if (gi.number) {
-    const concept = ontology.getConcept('grammarNumber', gi.number);
-    badges.push({ label: concept?.prefLabel ?? gi.number, definition: concept?.definition ?? undefined });
+    const display = ontology.getDisplay('grammarNumber', gi.number);
+    badges.push({ label: display.label, definition: display.definition });
   }
   if (gi.partOfSpeech) badges.push({ label: gi.partOfSpeech });
-  for (const pos of ['noun', 'verb', 'adj', 'adverb', 'preposition', 'participle'] as const) {
+  for (const pos of GRAMMAR_BOOLEAN_POS) {
     if (gi[pos]) badges.push({ label: pos });
   }
   return badges;

package/src/utils/index.ts

@@ -1,2 +1,3 @@
 export { langName, langLabel, DEFAULT_LANG } from './lang';
 export { deduplicateSearchHits } from './search';
+export { slugify } from './slugify';

package/src/utils/slugify.ts

@@ -0,0 +1,3 @@
+export function slugify(text: string): string {
+  return text.toLowerCase().replace(/[^\w\s-]/g, '').replace(/[\s/]+/g, '-');
+}