@glossarist/concept-browser 0.1.0

package/src/components/LanguageDetail.vue

@@ -0,0 +1,211 @@
+<script setup lang="ts">
+import type { LocalizedConcept, Designation, ConceptSource } from '../adapters/types';
+import { computed } from 'vue';
+import { langName, langLabel } from '../utils/lang';
+import { renderMath } from '../utils/math';
+import type { XrefResolver } from '../utils/math';
+import { useRouter } from 'vue-router';
+import { useVocabularyStore } from '../stores/vocabulary';
+import { getFactory } from '../adapters/factory';
+
+const props = defineProps<{
+  localizedConcepts: Record<string, LocalizedConcept>;
+  activeLang: string;
+}>();
+
+const emit = defineEmits<{
+  (e: 'update:activeLang', lang: string): void;
+}>();
+
+const lc = computed(() => props.localizedConcepts[props.activeLang]);
+const availableLangs = computed(() => Object.keys(props.localizedConcepts).sort());
+
+const designations = computed(() => lc.value?.['gl:designation'] ?? []);
+const definition = computed(() => {
+  const defs = lc.value?.['gl:definition'];
+  if (defs?.length) {
+    const content = defs.map(d => d['gl:content']).filter(Boolean).join('\n\n');
+    if (content) return content;
+  }
+  return '';
+});
+const notes = computed(() => {
+  return lc.value?.['gl:notes']?.map(n => n['gl:content']).filter(Boolean) ?? [];
+});
+const examples = computed(() => lc.value?.['gl:examples']?.map(e => e['gl:content']).filter(Boolean) ?? []);
+const sources = computed(() => lc.value?.['gl:source'] ?? []);
+
+const hasContent = computed(() =>
+  definition.value || notes.value.length > 0 || examples.value.length > 0 || designations.value.length > 1
+);
+
+const isTermOnly = computed(() =>
+  !definition.value && notes.value.length === 0 && examples.value.length === 0
+);
+
+function normativeStatus(status: string): string {
+  return status === 'preferred' ? 'Preferred' : status;
+}
+function normativeColor(status: string): string {
+  if (status === 'preferred') return 'bg-emerald-50 text-emerald-700';
+  if (status === 'deprecated') return 'bg-red-50 text-red-700';
+  return 'bg-amber-50 text-amber-700';
+}
+function entryStatusColor(status: string): string {
+  if (status === 'valid' || status === 'Standard') return 'badge-green';
+  if (status === 'superseded') return 'bg-red-50 text-red-700';
+  if (status === 'withdrawn') return 'bg-red-100 text-red-800';
+  if (status === 'draft') return 'badge-yellow';
+  return 'badge-gray';
+}
+function designationTypeLabel(type: string): string {
+  const labels: Record<string, string> = {
+    'gl:Expression': 'Expression',
+    'gl:Symbol': 'Symbol',
+    'gl:Abbreviation': 'Abbreviation',
+    'gl:GraphicalSymbol': 'Graphical',
+  };
+  return labels[type] ?? type;
+}
+function designationTypeColor(type: string): string {
+  if (type === 'gl:Symbol') return 'badge-purple';
+  if (type === 'gl:Abbreviation') return 'badge-yellow';
+  return 'badge-blue';
+}
+
+const router = useRouter();
+const store = useVocabularyStore();
+
+function escapeAttr(s: string) {
+  return s.replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+}
+
+const factory = getFactory();
+
+const xrefResolver: XrefResolver = (uri, term) => {
+  return `<a href="#" class="xref-link" data-uri="${escapeAttr(uri)}">${escapeAttr(term)}</a>`;
+};
+
+function handleContentClick(e: MouseEvent) {
+  const target = (e.target as HTMLElement).closest('.xref-link') as HTMLElement | null;
+  if (!target) return;
+  e.preventDefault();
+  const uri = target.dataset.uri;
+  if (uri) {
+    const resolution = factory.resolve(uri);
+    if (resolution.type === 'internal') {
+      store.viewConcept(resolution.registerId, resolution.conceptId);
+      router.push({ name: 'concept', params: { registerId: resolution.registerId, conceptId: resolution.conceptId } });
+    }
+  }
+}
+</script>
+
+<template>
+  <div class="space-y-5" @click="handleContentClick">
+    <!-- Language selector -->
+    <div class="flex flex-wrap gap-1.5">
+      <button
+        v-for="lang in availableLangs"
+        :key="lang"
+        @click="emit('update:activeLang', lang)"
+        :class="[
+          activeLang === lang
+            ? 'bg-ink-800 text-white'
+            : 'bg-surface-raised text-ink-600 hover:bg-ink-50 border border-ink-100'
+        ]"
+        class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors flex items-center gap-1.5"
+      >
+        <span class="text-xs font-semibold text-ink-500 bg-ink-50 px-1.5 py-0.5 rounded">{{ langLabel(lang) }}</span>
+        {{ langName(lang) }}
+      </button>
+    </div>
+
+    <!-- Content for selected language -->
+    <div v-if="lc">
+      <!-- Entry status -->
+      <div v-if="lc['gl:entryStatus']" class="flex items-center gap-2 mb-4">
+        <span class="badge" :class="entryStatusColor(lc['gl:entryStatus'])">{{ lc['gl:entryStatus'] }}</span>
+      </div>
+
+      <!-- Designations -->
+      <div v-if="designations.length > 0" class="card p-5">
+        <div class="section-label">Designations</div>
+        <div class="space-y-2 mt-3">
+          <div v-for="(d, i) in designations" :key="i" class="flex items-center gap-2 flex-wrap">
+            <span class="font-medium text-ink-800 text-lg" v-html="renderMath(d['gl:term'])"></span>
+            <span class="badge text-[10px]" :class="designationTypeColor(d['@type'])">{{ designationTypeLabel(d['@type']) }}</span>
+            <span class="badge text-[10px]" :class="normativeColor(d['gl:normativeStatus'])">{{ normativeStatus(d['gl:normativeStatus']) }}</span>
+            <span v-if="d['gl:gender']" class="text-xs text-ink-300">{{ d['gl:gender'] }}</span>
+            <span v-if="d['gl:plurality']" class="text-xs text-ink-300">{{ d['gl:plurality'] }}</span>
+          </div>
+        </div>
+      </div>
+
+      <!-- Definition -->
+      <div v-if="definition" class="card p-5">
+        <div class="section-label">Definition</div>
+        <div class="text-ink-800 leading-relaxed mt-3" v-html="renderMath(definition, xrefResolver)"></div>
+      </div>
+
+      <!-- Notes -->
+      <div v-if="notes.length" class="card p-5">
+        <div class="section-label">Notes</div>
+        <div class="space-y-3 mt-3">
+          <div v-for="(note, i) in notes" :key="i" class="text-ink-600 text-sm leading-relaxed">
+            <span class="font-medium text-ink-400 text-xs uppercase tracking-wide">Note {{ i + 1 }}</span>
+            <div class="mt-1" v-html="renderMath(note, xrefResolver)"></div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Examples -->
+      <div v-if="examples.length" class="card p-5">
+        <div class="section-label">Examples</div>
+        <div class="space-y-3 mt-3">
+          <div v-for="(ex, i) in examples" :key="i" class="text-ink-600 text-sm leading-relaxed">
+            <span class="font-medium text-ink-400 text-xs uppercase tracking-wide">Example {{ i + 1 }}</span>
+            <div class="mt-1" v-html="renderMath(ex, xrefResolver)"></div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Sources -->
+      <div v-if="sources.length" class="card p-5">
+        <div class="section-label">Sources</div>
+        <div class="space-y-3 mt-3">
+          <div v-for="(src, i) in sources" :key="i" class="text-sm">
+            <div class="flex items-center gap-1.5 flex-wrap mb-1">
+              <span v-if="src['gl:sourceType']" class="badge badge-blue text-[10px]">{{ src['gl:sourceType'] }}</span>
+              <span v-if="src['gl:sourceStatus']" class="badge badge-gray text-[10px]">{{ src['gl:sourceStatus'] }}</span>
+            </div>
+            <div class="text-ink-700">
+              <span v-if="src['gl:origin']?.['gl:ref']" class="font-medium">{{ src['gl:origin']['gl:ref'] }}</span>
+              <span v-if="src['gl:origin']?.['gl:clause']">, {{ src['gl:origin']['gl:clause'] }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Term-only state -->
+      <div v-if="isTermOnly" class="card p-5">
+        <div class="flex items-start gap-3">
+          <div class="w-8 h-8 rounded-full bg-ink-50 flex items-center justify-center flex-shrink-0 mt-0.5">
+            <span class="text-xs font-semibold text-ink-500 bg-ink-50 px-1.5 py-0.5 rounded">{{ langLabel(activeLang) }}</span>
+          </div>
+          <div>
+            <p class="text-sm text-ink-600 font-medium">Term only in {{ langName(activeLang) }}</p>
+            <p class="text-xs text-ink-400 mt-1 leading-relaxed">
+              This concept has a registered designation in {{ langName(activeLang) }} but no definition or notes.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- No data for this language -->
+    <div v-else class="card p-5 text-center">
+      <p class="text-sm text-ink-400">No data available for {{ langName(activeLang) }}.</p>
+    </div>
+  </div>
+</template>

package/src/components/NavIcon.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+const icons: Record<string, string> = {
+  home: 'M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-4 0a1 1 0 01-1-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 01-1 1',
+  search: 'M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z',
+  graph: 'M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1',
+  newspaper: 'M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z',
+  users: 'M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z',
+  info: 'M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z',
+  chart: 'M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z',
+  list: 'M4 6h16M4 10h16M4 14h16M4 18h16',
+};
+
+defineProps<{ name: string }>();
+</script>
+
+<template>
+  <svg class="w-4 h-4 text-ink-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" :d="icons[name] || icons.info" />
+  </svg>
+</template>

package/src/components/SearchBar.vue

@@ -0,0 +1,241 @@
+<script setup lang="ts">
+import { useRouter } from 'vue-router';
+import { useUiStore } from '../stores/ui';
+import { useVocabularyStore } from '../stores/vocabulary';
+import { ref, watch, onMounted, computed, nextTick } from 'vue';
+import type { SearchHit } from '../adapters/types';
+import { langLabel, langName } from '../utils/lang';
+import { useDsStyle } from '../utils/dataset-style';
+
+const router = useRouter();
+const ui = useUiStore();
+const store = useVocabularyStore();
+const { getStyle } = useDsStyle();
+const query = ref('');
+const results = ref<SearchHit[]>([]);
+const searched = ref(false);
+const selectedIdx = ref(-1);
+const loading = ref(false);
+const searchError = ref<string | null>(null);
+const searchInputEl = ref<HTMLInputElement | null>(null);
+let debounceTimer: ReturnType<typeof setTimeout> | null = null;
+
+async function doSearch() {
+  const q = query.value.trim();
+  if (!q) return;
+  ui.searchQuery = q;
+  loading.value = true;
+  searchError.value = null;
+  try {
+    results.value = await store.searchAcrossDatasets(q);
+  } catch (e: any) {
+    searchError.value = e.message || 'Search failed';
+  } finally {
+    loading.value = false;
+  }
+  searched.value = true;
+  selectedIdx.value = -1;
+  router.replace({ query: { q } });
+}
+
+function onInput() {
+  if (debounceTimer) clearTimeout(debounceTimer);
+  debounceTimer = setTimeout(async () => {
+    const q = query.value.trim();
+    if (q.length >= 2) {
+      await doSearch();
+    } else if (q.length === 0) {
+      results.value = [];
+      searched.value = false;
+      selectedIdx.value = -1;
+    }
+  }, 300);
+}
+
+function clearSearch() {
+  query.value = '';
+  results.value = [];
+  searched.value = false;
+  selectedIdx.value = -1;
+  router.replace({ query: {} });
+}
+
+// Group results by dataset
+interface GroupedResults {
+  registerId: string;
+  title: string;
+  style: { light: string; dark: string; color: string };
+  hits: SearchHit[];
+}
+
+const groupedResults = computed(() => {
+  const capped = results.value.slice(0, 100);
+  const map = new Map<string, SearchHit[]>();
+  for (const hit of capped) {
+    const group = map.get(hit.registerId) ?? [];
+    group.push(hit);
+    map.set(hit.registerId, group);
+  }
+  const groups: GroupedResults[] = [];
+  for (const [registerId, hits] of map) {
+    const m = store.manifests.get(registerId);
+    groups.push({
+      registerId,
+      title: m?.title ?? registerId,
+      style: getStyle(registerId),
+      hits,
+    });
+  }
+  return groups;
+});
+
+// Flatten for keyboard navigation
+const flatHits = computed(() => groupedResults.value.flatMap(g => g.hits));
+const hitIndexMap = computed(() => {
+  const map = new Map<SearchHit, number>();
+  flatHits.value.forEach((hit, i) => map.set(hit, i));
+  return map;
+});
+
+function goToHit(hit: SearchHit) {
+  router.push({
+    name: 'concept',
+    params: { registerId: hit.registerId, conceptId: hit.conceptId },
+  });
+}
+
+function onKeydown(e: KeyboardEvent) {
+  if (!searched.value || flatHits.value.length === 0) return;
+
+  if (e.key === 'ArrowDown') {
+    e.preventDefault();
+    selectedIdx.value = Math.min(selectedIdx.value + 1, flatHits.value.length - 1);
+    scrollToSelected();
+  } else if (e.key === 'ArrowUp') {
+    e.preventDefault();
+    selectedIdx.value = Math.max(selectedIdx.value - 1, -1);
+    scrollToSelected();
+  } else if (e.key === 'Enter' && selectedIdx.value >= 0) {
+    e.preventDefault();
+    goToHit(flatHits.value[selectedIdx.value]);
+  }
+}
+
+function scrollToSelected() {
+  nextTick(() => {
+    document.querySelector<HTMLElement>('.search-hit-selected')?.scrollIntoView({ block: 'nearest' });
+  });
+}
+
+// Sync with UI store search query
+watch(() => ui.searchQuery, (q) => {
+  if (q && q !== query.value) {
+    query.value = q;
+    doSearch();
+  }
+});
+
+onMounted(() => {
+  if (ui.searchQuery) {
+    query.value = ui.searchQuery;
+    doSearch();
+  }
+});
+</script>
+
+<template>
+  <div class="max-w-2xl mx-auto px-0">
+    <form @submit.prevent="doSearch" class="mb-6 sm:mb-8">
+      <div class="flex gap-2">
+        <div class="relative flex-1">
+          <input
+            ref="searchInputEl"
+            v-model="query"
+            @input="onInput"
+            @keydown="onKeydown"
+            type="text"
+            aria-label="Search terms across all datasets"
+            placeholder="Search terms across all datasets..."
+            class="w-full pl-9 pr-8 py-2.5 text-sm bg-surface border border-ink-100 rounded-lg focus:ring-2 focus:ring-ink-200 focus:border-ink-400 outline-none placeholder:text-ink-300 transition-all"
+            autofocus
+          />
+          <svg v-if="!loading" class="absolute left-3 top-3 w-4 h-4 text-ink-300" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
+          </svg>
+          <svg v-else class="absolute left-3 top-3 w-4 h-4 text-ink-400 animate-spin" fill="none" viewBox="0 0 24 24">
+            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+          </svg>
+          <button
+            v-if="query"
+            @click="clearSearch"
+            type="button"
+            class="absolute right-2.5 top-2.5 text-ink-300 hover:text-ink-600 transition-colors"
+          >
+            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>
+          </button>
+        </div>
+        <button type="submit" class="btn-primary" :disabled="loading">Search</button>
+      </div>
+    </form>
+
+    <div v-if="loading" class="text-center py-16">
+      <svg class="w-8 h-8 text-ink-300 animate-spin mx-auto mb-4" fill="none" viewBox="0 0 24 24">
+        <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+        <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+      </svg>
+      <p class="text-sm text-ink-400">Searching across datasets...</p>
+    </div>
+
+    <div v-else-if="searchError" class="text-center py-16">
+      <div class="card p-8 border-red-200 bg-red-50/50 max-w-md mx-auto">
+        <p class="text-red-700 font-medium mb-1">Search failed</p>
+        <p class="text-sm text-red-600/80 mb-4">{{ searchError }}</p>
+        <button @click="doSearch" class="btn-primary">Retry</button>
+      </div>
+    </div>
+
+    <div v-else-if="searched">
+      <p class="text-sm text-ink-400 mb-4">{{ results.length }} result{{ results.length === 1 ? '' : 's' }} for &ldquo;{{ ui.searchQuery }}&rdquo;</p>
+      <div v-if="results.length === 0" class="text-center py-16">
+        <div class="text-ink-200 text-5xl mb-4 font-serif">&empty;</div>
+        <p class="text-ink-500 font-medium">No concepts found matching your search</p>
+        <p class="text-sm text-ink-300 mt-1">Try a different term or check the spelling.</p>
+      </div>
+
+      <!-- Grouped results -->
+      <div v-else class="space-y-6">
+        <div v-for="group in groupedResults" :key="group.registerId">
+          <!-- Dataset header -->
+          <div class="flex items-center gap-2 mb-2">
+            <span class="w-2 h-2 rounded-full flex-shrink-0" :style="{ backgroundColor: group.style.color }"></span>
+            <span class="text-xs font-semibold text-ink-500 uppercase tracking-wide">{{ group.title }}</span>
+            <span class="text-xs text-ink-300">{{ group.hits.length }} result{{ group.hits.length === 1 ? '' : 's' }}</span>
+          </div>
+          <!-- Hits -->
+          <div class="space-y-1.5">
+            <button
+              v-for="hit in group.hits"
+              :key="hit.conceptId + hit.language"
+              @click="goToHit(hit)"
+              :class="selectedIdx === hitIndexMap.get(hit) ? 'bg-ink-50 border-ink-200 search-hit-selected' : ''"
+              class="card-hover p-3 w-full text-left flex items-center justify-between group"
+            >
+              <div class="min-w-0">
+                <span class="font-medium text-ink-800 group-hover:text-ink-900 transition-colors">{{ hit.designation }}</span>
+                <span class="text-xs text-ink-300 ml-2 font-mono">{{ hit.conceptId }}</span>
+              </div>
+              <div class="flex items-center gap-2 flex-shrink-0">
+                <span class="text-xs font-semibold text-ink-500 bg-ink-50 px-1.5 py-0.5 rounded">{{ langName(hit.language) }}</span>
+              </div>
+            </button>
+          </div>
+        </div>
+      </div>
+
+      <div v-if="results.length > 100" class="text-center text-sm text-ink-300 mt-6 pt-4 border-t border-ink-100/60">
+        Showing first 100 of {{ results.length }} results. Refine your search for more specific matches.
+      </div>
+    </div>
+  </div>
+</template>

package/src/composables/use-dataset-loader.ts

@@ -0,0 +1,27 @@
+import { ref, onMounted, watch } from 'vue';
+import { useVocabularyStore } from '../stores/vocabulary';
+
+export function useDatasetLoader(registerId: () => string) {
+  const store = useVocabularyStore();
+  const loading = ref(false);
+  const localError = ref<string | null>(null);
+
+  async function ensureLoaded() {
+    const id = registerId();
+    const adapter = store.datasets.get(id);
+    if (adapter?.index) return;
+    loading.value = true;
+    localError.value = null;
+    try {
+      await store.loadDataset(id);
+    } catch (e: any) {
+      localError.value = e.message || 'Failed to load dataset';
+    }
+    loading.value = false;
+  }
+
+  onMounted(ensureLoaded);
+  watch(registerId, ensureLoaded);
+
+  return { loading, localError, ensureLoaded };
+}

package/src/config/types.ts

@@ -0,0 +1,130 @@
+// === Branding ===
+
+export interface FontConfig {
+  family: string;
+  source: 'google' | 'url' | 'local';
+  weights?: number[];
+  url?: string;
+}
+
+export interface LogoConfig {
+  path: string;
+  alt: string;
+  url?: string;
+  remoteUrl?: string;
+}
+
+export interface SiteBranding {
+  primaryColor?: string;
+  darkColor?: string;
+  fonts?: {
+    header?: FontConfig;
+    body?: FontConfig;
+  };
+  logo?: LogoConfig;
+  footerLogo?: LogoConfig;
+  favicon?: string;
+  ownerName?: string;
+  ownerUrl?: string;
+}
+
+// === Features ===
+
+export interface PoweredByConfig {
+  title: string;
+  url: string;
+}
+
+export interface SiteFeatures {
+  news?: boolean;
+  stats?: boolean;
+  graph?: boolean;
+  about?: boolean;
+  search?: boolean;
+  poweredBy?: PoweredByConfig;
+}
+
+// === Analytics ===
+
+export interface AnalyticsConfig {
+  googleAnalyticsId?: string;
+}
+
+// === Navigation ===
+
+export interface NavItem {
+  label: string;
+  route: string;
+}
+
+export interface SocialLinks {
+  github?: string;
+  twitter?: string;
+  [key: string]: string | undefined;
+}
+
+// === Routing ===
+
+export type RoutingType = 'site' | 'url';
+
+export interface RoutingEntry {
+  uri: string;
+  type: RoutingType;
+  targetDataset?: string;
+  baseUrl?: string;
+  url?: string;
+  label: string;
+}
+
+// === Dataset ===
+
+export interface DatasetConfig {
+  id: string;
+  uri: string;
+  uriAliases?: string[];
+  gcrPackage: string;
+  sourceRepo?: string;
+  title: string;
+  description?: string;
+  owner?: string;
+  color?: string;
+  tags?: string[];
+  languageOrder?: string[];
+}
+
+// === Pages ===
+
+export type PageType = 'news' | 'contributors' | 'about' | 'stats' | 'custom';
+
+export interface PageConfig {
+  type: PageType;
+  route: string;
+  title: string;
+  icon: string;
+  source?: string;
+  datasetScoped?: boolean;
+}
+
+// === Site Config ===
+
+export interface SiteConfig {
+  id: string;
+  domain: string;
+  title: string;
+  subtitle?: string;
+  description?: string;
+  datasets: DatasetConfig[];
+  routing: RoutingEntry[];
+  branding: SiteBranding;
+  analytics?: AnalyticsConfig;
+  features?: SiteFeatures;
+  social?: SocialLinks;
+  nav?: NavItem[];
+  footerNav?: NavItem[];
+  defaults: {
+    language?: string;
+    languageOrder?: string[];
+  };
+  email?: string;
+  pages?: PageConfig[];
+}