@glossarist/concept-browser 0.4.9 → 0.4.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glossarist/concept-browser",
-  "version": "0.4.9",
+  "version": "0.4.12",
   "description": "Vue SPA for browsing Glossarist terminology datasets with cross-reference resolution, graph visualization, and multi-language support",
   "type": "module",
   "bin": {

package/src/components/AppSidebar.vue

@@ -22,7 +22,6 @@ const {
   taxonomyKeys,
   taxonomyLabels,
   treeRoots,
-  supportingClasses,
   toggleExpand,
   childClasses,
   hasChildren,
@@ -167,19 +166,6 @@ function selectTaxonomy(key: string) {
               </div>
             </template>
 
-            <!-- Supporting classes -->
-            <div v-if="supportingClasses.length" class="mt-2 pt-2 border-t border-ink-100/40">
-              <div class="text-[10px] uppercase tracking-wide text-ink-300 mb-1 px-2">Supporting</div>
-              <button v-for="cls in supportingClasses" :key="cls.compact"
-                @click="selectClass(cls.compact)"
-                class="w-full flex items-center gap-1.5 px-2 py-1 rounded-lg text-[11px] transition-colors"
-                :class="activeClassId === cls.compact && !activeTaxonomy ? 'bg-ink-800/8 text-blue-700 font-medium' : 'text-ink-400 hover:bg-ink-50'"
-              >
-                <span class="w-3 text-ink-200">·</span>
-                <span class="flex-1 text-left">{{ cls.label }}</span>
-              </button>
-            </div>
-
             <!-- SKOS Taxonomies -->
             <div class="mt-2 pt-2 border-t border-ink-100/40">
               <div class="text-[10px] uppercase tracking-wide text-ink-300 mb-1 px-2">Taxonomies</div>

package/src/components/ConceptDetail.vue

@@ -15,6 +15,7 @@ import { useDsStyle } from '../utils/dataset-style';
 import { getFactory } from '../adapters/factory';
 import { useRenderOptions } from '../composables/use-render-options';
 import { categorizeRelationship, relationshipLabel, relationshipDefinition } from '../utils/relationship-categories';
+import { useSiteConfig } from '../config/use-site-config';
 import ConceptTimeline from './ConceptTimeline.vue';
 import ConceptRdfView from './ConceptRdfView.vue';
 import FormatDownloads from './FormatDownloads.vue';
@@ -32,6 +33,7 @@ const props = defineProps<{
 const router = useRouter();
 const store = useVocabularyStore();
 const { getColor } = useDsStyle();
+const { config: siteConfig } = useSiteConfig();
 const factory = getFactory();
 
 const activeTab = ref<'rdf' | 'definition' | 'history'>('definition');
@@ -75,17 +77,9 @@ const languages = computed(() => {
   });
 });
 
-// Collapsible language sections — auto-collapse non-eng when 6+ languages
+// Collapsible language sections — expand all with content, collapse those without
 const collapsedLangs = ref(new Set<string>());
 
-function initCollapsed(langs: string[]) {
-  if (langs.length >= 6) {
-    collapsedLangs.value = new Set(langs.filter(l => l !== 'eng'));
-  }
-}
-
-watch(languages, (langs) => { initCollapsed(langs); }, { immediate: true });
-
 const engConcept = computed((): LocalizedConcept | null => {
   return props.concept.localization('eng') ?? null;
 });
@@ -192,6 +186,20 @@ function hasContent(lc: LangContent): boolean {
   return !!(lc.definition || lc.notes.length || lc.examples.length || lc.sources.length);
 }
 
+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) {

package/src/components/GraphPanel.vue

@@ -115,6 +115,7 @@ interface SimNode extends SimulationNodeDatum {
   register: string;
   conceptId: string;
   designation: string;
+  altDesignations: string[];
   hasDesignation: boolean;
   loaded: boolean;
   nodeType?: 'concept' | 'domain';
@@ -178,11 +179,15 @@ function buildSimulation(width: number, height: number) {
   const simNodes: SimNode[] = renderNodes.map(n => {
     const lang = uiStore.selectedLang;
     const desig = n.designations[lang] || Object.values(n.designations)[0] || '';
+    const alts = Object.entries(n.designations)
+      .filter(([l, t]) => l !== lang && t && t !== desig)
+      .map(([, t]) => t);
     return {
       uri: n.uri,
       register: n.register,
       conceptId: n.conceptId,
       designation: desig,
+      altDesignations: alts,
       hasDesignation: !!n.designations[lang],
       loaded: n.loaded,
       nodeType: n.nodeType,
@@ -272,6 +277,20 @@ function buildSimulation(width: number, height: number) {
       return '#636588';
     });
 
+  conceptNodes.append('text')
+    .attr('dy', -9)
+    .attr('y', 7)
+    .attr('text-anchor', 'middle')
+    .attr('font-size', '6px')
+    .attr('font-family', '"DM Sans", system-ui, sans-serif')
+    .attr('fill', '#a0a1b5')
+    .attr('pointer-events', 'none')
+    .text(d => {
+      if (labelMode.value !== 'designation') return '';
+      const alts = d.altDesignations.slice(0, 2);
+      return alts.join(' · ');
+    });
+
   const dragBehavior = drag<SVGGElement, SimNode>()
     .on('start', (event: D3DragEvent<SVGGElement, SimNode, SimNode>, d) => {
       if (!event.active) simulation?.alphaTarget(0.3).restart();

package/src/composables/use-ontology-nav.ts

@@ -2,7 +2,6 @@ import { ref, computed } from 'vue';
 import {
   getClass,
   getClassTree,
-  getAllClasses,
   type OwlClass,
 } from '../adapters/ontology-schema';
 
@@ -53,15 +52,6 @@ function hasChildren(cls: OwlClass): boolean {
 
 const treeRoots = getClassTree();
 
-const supportingClasses = computed(() =>
-  getAllClasses().filter(
-    c => c.children.length === 0
-      && !c.subClassOf?.startsWith('gloss:')
-      && c.compact !== 'gloss:Concept'
-      && c.compact !== 'gloss:ConceptCollection'
-  )
-);
-
 const allNavItems = computed(() => {
   const items: { id: string; label: string; depth: number }[] = [];
   function walk(classes: OwlClass[], depth: number) {
@@ -82,7 +72,6 @@ export function useOntologyNav() {
     taxonomyKeys,
     taxonomyLabels,
     treeRoots,
-    supportingClasses,
     allNavItems,
     toggleExpand,
     childClasses,

package/src/config/types.ts

@@ -152,6 +152,7 @@ export interface SiteConfig {
   defaults: {
     language?: string;
     languageOrder?: string[];
+    mainLanguages?: string[];
   };
   email?: string;
   pages?: PageConfig[];

package/src/config/use-site-config.ts

@@ -27,7 +27,7 @@ export interface RuntimeSiteConfig {
   social?: Record<string, string>;
   nav?: { label: string; route: string }[];
   footerNav?: { label: string; route: string }[];
-  defaults?: { language?: string; languageOrder?: string[] };
+  defaults?: { language?: string; languageOrder?: string[]; mainLanguages?: string[] };
   email?: string;
   pages?: PageConfig[];
   contributors?: { name: string; role?: string; organization?: string; url?: string; email?: string }[];

package/src/views/AboutView.vue

@@ -15,7 +15,7 @@ const manifest = computed(() => store.manifests.get(resolvedId.value));
 </script>
 
 <template>
-  <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+  <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <!-- Breadcrumb -->
     <nav aria-label="Breadcrumb" class="flex items-center gap-1.5 text-sm text-ink-400 mb-6">
       <router-link :to="{ name: 'home' }" class="hover:text-ink-700 transition-colors">Home</router-link>

package/src/views/ContributorsView.vue

@@ -14,7 +14,7 @@ const contributors = config.value?.contributors as Contributor[] | undefined;
 </script>
 
 <template>
-  <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+  <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <nav aria-label="Breadcrumb" class="flex items-center gap-1.5 text-sm text-ink-400 mb-6">
       <router-link :to="{ name: 'home' }" class="hover:text-ink-700 transition-colors">Home</router-link>
       <span class="text-ink-200">/</span>

package/src/views/NewsView.vue

@@ -78,7 +78,7 @@ function formatDate(dateStr: string) {
 </script>
 
 <template>
-  <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+  <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <nav aria-label="Breadcrumb" class="flex items-center gap-1.5 text-sm text-ink-400 mb-6">
       <router-link :to="{ name: 'home' }" class="hover:text-ink-700 transition-colors">Home</router-link>
       <span class="text-ink-200">/</span>

package/src/views/PageView.vue

@@ -43,7 +43,7 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+  <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <nav aria-label="Breadcrumb" class="flex items-center gap-1.5 text-sm text-ink-400 mb-6">
       <router-link :to="{ name: 'home' }" class="hover:text-ink-700 transition-colors">Home</router-link>
       <template v-if="registerId">

package/src/views/ResolveView.vue

@@ -47,7 +47,7 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="max-w-3xl mx-auto px-4 py-16 text-center">
+  <div class="max-w-5xl mx-auto px-4 py-16 text-center">
     <template v-if="error">
       <h1 class="text-2xl font-serif text-ink-800 mb-4">Concept not found</h1>
       <p class="text-ink-500 mb-2">The following concept URI could not be resolved:</p>

package/src/views/StatsView.vue

@@ -68,7 +68,7 @@ function coverageColor(ratio: number): string {
 </script>
 
 <template>
-  <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+  <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <!-- Breadcrumb -->
     <nav aria-label="Breadcrumb" class="flex items-center gap-1.5 text-sm text-ink-400 mb-6">
       <router-link :to="{ name: 'home' }" class="hover:text-ink-700 transition-colors">Home</router-link>