From 143608db37eff9c52c88e12c4d9173bcb0b4a3d0 Mon Sep 17 00:00:00 2001
From: Codex <codex@example.com>
Date: Sat, 7 Mar 2026 06:35:29 +0000
Subject: [PATCH] Add centralized unit definitions

---
 .../src/lib/components/Calculator.svelte      |  2 +
 .../lib/components/QuickDefinitionCard.svelte | 67 +++++++++++++++++++
 hdyc-svelte/src/lib/data/unitDefinitions.ts   | 54 +++++++++++++++
 3 files changed, 123 insertions(+)
 create mode 100644 hdyc-svelte/src/lib/components/QuickDefinitionCard.svelte
 create mode 100644 hdyc-svelte/src/lib/data/unitDefinitions.ts

diff --git a/hdyc-svelte/src/lib/components/Calculator.svelte b/hdyc-svelte/src/lib/components/Calculator.svelte
index 2ca4bce..69c76e8 100644
--- a/hdyc-svelte/src/lib/components/Calculator.svelte
+++ b/hdyc-svelte/src/lib/components/Calculator.svelte
@@ -3,6 +3,7 @@
   import type { CalculatorDef } from '$lib/data/calculators';
   import { page } from '$app/stores';
   import { onMount } from 'svelte';
+  import QuickDefinitionCard from '$lib/components/QuickDefinitionCard.svelte';
   import QuickConversionExample from '$lib/components/QuickConversionExample.svelte';
   import QuickConversionTable from '$lib/components/QuickConversionTable.svelte';
 
@@ -116,6 +117,7 @@
   </div>
   <QuickConversionTable {config} />
   <QuickConversionExample {config} />
+  <QuickDefinitionCard {config} />
 </div>
 
 <style>
diff --git a/hdyc-svelte/src/lib/components/QuickDefinitionCard.svelte b/hdyc-svelte/src/lib/components/QuickDefinitionCard.svelte
new file mode 100644
index 0000000..f71e353
--- /dev/null
+++ b/hdyc-svelte/src/lib/components/QuickDefinitionCard.svelte
@@ -0,0 +1,67 @@
+<script lang="ts">
+  import { getDefinition } from '$lib/data/unitDefinitions';
+  import type { CalculatorDef } from '$lib/data/calculators';
+
+  export let config: CalculatorDef;
+
+  const label1 = config.labels.in1 || 'Unit 1';
+  const label2 = config.labels.in2 || 'Unit 2';
+
+  const def1 = getDefinition(label1);
+  const def2 = getDefinition(label2);
+</script>
+
+<section class="definition-card">
+  <h3>Unit definitions</h3>
+  <div class="definition-grid">
+    <article>
+      <strong>{label1}</strong>
+      <p>{def1 ?? `Definition pending for ${label1}.`}</p>
+    </article>
+    <article>
+      <strong>{label2}</strong>
+      <p>{def2 ?? `Definition pending for ${label2}.`}</p>
+    </article>
+  </div>
+</section>
+
+<style>
+  .definition-card {
+    margin: 0 2rem 2rem;
+    padding: 1.25rem 1.5rem;
+    border-radius: 12px;
+    background: var(--section-bg);
+    border: 1px solid var(--border);
+  }
+
+  .definition-card h3 {
+    margin: 0 0 0.75rem;
+    font-size: 1rem;
+    font-weight: 600;
+  }
+
+  .definition-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    gap: 1rem;
+  }
+
+  .definition-grid article {
+    background: var(--card-bg);
+    border: 1px solid var(--border);
+    border-radius: 10px;
+    padding: 0.9rem;
+  }
+
+  .definition-grid strong {
+    display: block;
+    font-size: 0.95rem;
+    margin-bottom: 0.4rem;
+  }
+
+  .definition-grid p {
+    margin: 0;
+    font-size: 0.85rem;
+    color: var(--text-muted);
+  }
+</style>
diff --git a/hdyc-svelte/src/lib/data/unitDefinitions.ts b/hdyc-svelte/src/lib/data/unitDefinitions.ts
new file mode 100644
index 0000000..9ebc14b
--- /dev/null
+++ b/hdyc-svelte/src/lib/data/unitDefinitions.ts
@@ -0,0 +1,54 @@
+import { calculators } from './calculators';
+
+const domainDescriptions: Record<string, string> = {
+  length: 'linear or spatial distance measurement',
+  weight: 'mass or force quantity',
+  temperature: 'thermal energy level',
+  volume: 'three-dimensional capacity',
+  area: 'two-dimensional surface measurement',
+  speed: 'rate of change of position',
+  pressure: 'force exerted per unit area',
+  energy: 'capacity to do work',
+  power: 'rate of energy transfer',
+  data: 'digital information volume',
+  time: 'temporal duration',
+  angle: 'angular measurement',
+  'number-systems': 'numeric representation systems',
+  radiation: 'ionizing emission metrics',
+  electrical: 'electricity-related magnitude',
+  force: 'force or torque measurement',
+  light: 'luminous intensity',
+  other: 'specialized measurement',
+};
+
+const definitions: Record<string, string> = {};
+
+const formatLabel = (label: string): string => {
+  if (!label) return '';
+  return label
+    .replace(/\b([A-Z])/g, ' $1')
+    .replace(/\s+/g, ' ')
+    .trim();
+};
+
+const buildDefinition = (label: string, categoryKey: string): string => {
+  if (!label) return '';
+  const desc = domainDescriptions[categoryKey] || 'measurement';
+  return `${label} is used to express ${desc}. Understanding ${label} keeps calculations aligned across the ${categoryKey} domain.`;
+};
+
+calculators.forEach(calc => {
+  const { category, labels } = calc;
+  Object.values(labels).forEach(label => {
+    if (!label) return;
+    if (!definitions[label]) {
+      definitions[label] = buildDefinition(label, category);
+    }
+  });
+});
+
+export function getDefinition(label: string): string | undefined {
+  return definitions[label];
+}
+
+export const unitDefinitions = definitions;