@microcosmmoney/portal-react 3.1.0 → 3.2.1

package/dist/components/territory/territory-page.js

@@ -6,6 +6,7 @@ exports.MicrocosmTerritoryPage = MicrocosmTerritoryPage;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const auth_react_1 = require("@microcosmmoney/auth-react");
+const recharts_1 = require("recharts");
 /* ------------------------------------------------------------------ */
 /*  Inline SVG Icons (24x24 viewBox, stroke 2, round caps)            */
 /* ------------------------------------------------------------------ */
@@ -81,20 +82,118 @@ function TerritoryCard({ unit, onClick }) {
 /* ------------------------------------------------------------------ */
 /*  Detail View                                                       */
 /* ------------------------------------------------------------------ */
+/* ------------------------------------------------------------------ */
+/*  Income Chart (recharts LineChart)                                   */
+/* ------------------------------------------------------------------ */
+function IncomeChart({ territoryId }) {
+    const { data: raw, loading } = (0, auth_react_1.useTerritoryIncome)(territoryId, '30d');
+    const uid = (0, react_1.useId)();
+    const chartData = (0, react_1.useMemo)(() => {
+        if (!raw)
+            return [];
+        // API may return { labels, datasets: { income, cumulative } } or array
+        if (Array.isArray(raw))
+            return raw;
+        if (raw.labels && raw.datasets) {
+            return raw.labels.map((label, i) => ({
+                date: label,
+                income: raw.datasets.income?.[i] ?? 0,
+                cumulative: raw.datasets.cumulative?.[i] ?? 0,
+            }));
+        }
+        return raw.data ?? [];
+    }, [raw]);
+    if (loading)
+        return (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6", children: (0, jsx_runtime_1.jsx)("div", { className: "h-64 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(Spinner, {}) }) });
+    if (chartData.length === 0)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-4 flex items-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)(IconZap, { className: "w-4 h-4 text-cyan-400" }), "Income Trend (30D)"] }), (0, jsx_runtime_1.jsx)("div", { className: "h-64", children: (0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { width: "100%", height: "100%", children: (0, jsx_runtime_1.jsxs)(recharts_1.LineChart, { data: chartData, margin: { top: 5, right: 10, left: 0, bottom: 5 }, children: [(0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3", stroke: "#404040" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "date", tick: { fill: '#a3a3a3', fontSize: 11 }, axisLine: { stroke: '#525252' } }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { tick: { fill: '#a3a3a3', fontSize: 11 }, axisLine: { stroke: '#525252' } }), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, { contentStyle: { backgroundColor: '#171717', border: '1px solid #404040', borderRadius: '8px' }, labelStyle: { color: '#a3a3a3' }, itemStyle: { color: '#fff' } }), (0, jsx_runtime_1.jsx)(recharts_1.Line, { type: "monotone", dataKey: "income", name: "Daily Income", stroke: "#22d3ee", strokeWidth: 2, dot: false, activeDot: { r: 4 } }), (0, jsx_runtime_1.jsx)(recharts_1.Line, { type: "monotone", dataKey: "cumulative", name: "Cumulative", stroke: "#ffffff", strokeWidth: 2, dot: false, activeDot: { r: 4 } })] }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-center gap-6 mt-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-3 h-0.5 bg-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Daily Income" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-3 h-0.5 bg-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Cumulative" })] })] })] }));
+}
+/* ------------------------------------------------------------------ */
+/*  Member Ranking                                                     */
+/* ------------------------------------------------------------------ */
+const RANK_BADGE = { 1: 'bg-cyan-400/20 text-cyan-400', 2: 'bg-white/20 text-white', 3: 'bg-cyan-300/20 text-cyan-300' };
+function MemberRanking({ territoryId }) {
+    const { data: raw, loading } = (0, auth_react_1.useTerritoryRanking)(territoryId, { page_size: 10 });
+    const rankList = (0, react_1.useMemo)(() => {
+        if (!raw)
+            return [];
+        return Array.isArray(raw) ? raw : raw.data ?? [];
+    }, [raw]);
+    if (loading)
+        return (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6", children: (0, jsx_runtime_1.jsx)("div", { className: "h-64 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(Spinner, {}) }) });
+    if (rankList.length === 0)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-4 flex items-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)(IconShield, { className: "w-4 h-4 text-cyan-400" }), "Member Contribution Ranking"] }), (0, jsx_runtime_1.jsx)("div", { className: "space-y-2", children: rankList.map((m, idx) => {
+                    const rank = m.rank ?? idx + 1;
+                    const name = m.nickname || m.display_name || 'Unknown';
+                    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3 p-2 bg-neutral-800 rounded hover:bg-neutral-700 transition-colors", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-8 text-center", children: rank <= 3 ? ((0, jsx_runtime_1.jsxs)("span", { className: `inline-block px-1.5 py-0.5 rounded text-xs font-bold ${RANK_BADGE[rank] ?? ''}`, children: ["#", rank] })) : ((0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-500 font-mono text-sm", children: ["#", rank] })) }), (0, jsx_runtime_1.jsx)("div", { className: "w-8 h-8 rounded-full bg-neutral-700 flex items-center justify-center text-xs text-white font-bold flex-shrink-0", children: name.slice(0, 2).toUpperCase() }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 min-w-0", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-white text-sm truncate", children: name }), m.email && (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs truncate", children: m.email })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right flex-shrink-0", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-white font-mono font-medium text-sm", children: (m.contribution ?? 0).toLocaleString() }), (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-500 text-xs ml-1", children: "MCD" })] })] }, m.user_id || idx));
+                }) })] }));
+}
+/* ------------------------------------------------------------------ */
+/*  KPI History Chart (recharts AreaChart)                             */
+/* ------------------------------------------------------------------ */
+function KPIHistoryChart({ territoryId }) {
+    const { data: raw, loading } = (0, auth_react_1.useTerritoryKPI)(territoryId);
+    const uid = (0, react_1.useId)();
+    const chartData = (0, react_1.useMemo)(() => {
+        if (!raw)
+            return [];
+        if (Array.isArray(raw))
+            return raw;
+        return raw.data ?? [];
+    }, [raw]);
+    if (loading)
+        return (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg p-6", children: (0, jsx_runtime_1.jsx)("div", { className: "h-64 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(Spinner, {}) }) });
+    if (chartData.length === 0)
+        return null;
+    const gradMember = `kpi-member-${uid}`;
+    const gradVolume = `kpi-volume-${uid}`;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-4 flex items-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)(IconEdit3, { className: "w-4 h-4 text-cyan-400" }), "KPI History"] }), (0, jsx_runtime_1.jsx)("div", { className: "h-64", children: (0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { width: "100%", height: "100%", children: (0, jsx_runtime_1.jsxs)(recharts_1.AreaChart, { data: chartData, margin: { top: 5, right: 10, left: 0, bottom: 5 }, children: [(0, jsx_runtime_1.jsxs)("defs", { children: [(0, jsx_runtime_1.jsxs)("linearGradient", { id: gradMember, x1: "0", y1: "0", x2: "0", y2: "1", children: [(0, jsx_runtime_1.jsx)("stop", { offset: "5%", stopColor: "#22d3ee", stopOpacity: 0.3 }), (0, jsx_runtime_1.jsx)("stop", { offset: "95%", stopColor: "#22d3ee", stopOpacity: 0 })] }), (0, jsx_runtime_1.jsxs)("linearGradient", { id: gradVolume, x1: "0", y1: "0", x2: "0", y2: "1", children: [(0, jsx_runtime_1.jsx)("stop", { offset: "5%", stopColor: "#ffffff", stopOpacity: 0.3 }), (0, jsx_runtime_1.jsx)("stop", { offset: "95%", stopColor: "#ffffff", stopOpacity: 0 })] })] }), (0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { strokeDasharray: "3 3", stroke: "#404040" }), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: "date", tick: { fill: '#a3a3a3', fontSize: 11 }, axisLine: { stroke: '#525252' } }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { domain: [0, 100], tick: { fill: '#a3a3a3', fontSize: 11 }, axisLine: { stroke: '#525252' }, tickFormatter: (v) => `${v}%` }), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, { contentStyle: { backgroundColor: '#171717', border: '1px solid #404040', borderRadius: '8px' }, labelStyle: { color: '#a3a3a3' }, formatter: (value) => [`${Number(value).toFixed(1)}%`, ''] }), (0, jsx_runtime_1.jsx)(recharts_1.Area, { type: "monotone", dataKey: "member_progress", name: "Member Progress", stroke: "#22d3ee", strokeWidth: 2, fill: `url(#${gradMember})` }), (0, jsx_runtime_1.jsx)(recharts_1.Area, { type: "monotone", dataKey: "volume_progress", name: "Volume Progress", stroke: "#ffffff", strokeWidth: 2, fill: `url(#${gradVolume})` })] }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-center gap-6 mt-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-3 h-3 rounded-full bg-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Member Progress" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-3 h-3 rounded-full bg-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Volume Progress" })] })] })] }));
+}
+/* ------------------------------------------------------------------ */
+/*  Edit Territory Dialog                                              */
+/* ------------------------------------------------------------------ */
+function EditTerritoryDialog({ territory, open, onClose, onSaved }) {
+    const { update, loading: updating } = (0, auth_react_1.useTerritoryUpdate)();
+    const [name, setName] = (0, react_1.useState)(territory.unit_name);
+    const [desc, setDesc] = (0, react_1.useState)(territory.description || '');
+    const [error, setError] = (0, react_1.useState)('');
+    const handleSave = (0, react_1.useCallback)(async () => {
+        if (!name.trim()) {
+            setError('Name is required');
+            return;
+        }
+        try {
+            setError('');
+            await update(territory.unit_id, { unit_name: name, description: desc });
+            onSaved();
+            onClose();
+        }
+        catch (e) {
+            setError(e.message || 'Update failed');
+        }
+    }, [update, territory.unit_id, name, desc, onSaved, onClose]);
+    if (!open)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "fixed inset-0 z-50 flex items-center justify-center", onClick: onClose, children: [(0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 bg-black/60" }), (0, jsx_runtime_1.jsxs)("div", { className: "relative bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-lg p-6 space-y-4 mx-4", onClick: (e) => e.stopPropagation(), children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-bold text-lg", children: "Edit Territory" }), (0, jsx_runtime_1.jsxs)("p", { className: "text-neutral-500 text-xs font-mono mt-1", children: [territory.unit_type, " \u00B7 ", territory.full_path || territory.short_id || territory.unit_id] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "unit_name *" }), (0, jsx_runtime_1.jsx)("input", { value: name, onChange: (e) => setName(e.target.value), className: "w-full bg-neutral-800 border border-neutral-700 text-white px-3 py-2 rounded text-sm focus:border-cyan-400/50 outline-none" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "description" }), (0, jsx_runtime_1.jsx)("textarea", { value: desc, onChange: (e) => setDesc(e.target.value), rows: 3, className: "w-full bg-neutral-800 border border-neutral-700 text-white px-3 py-2 rounded text-sm focus:border-cyan-400/50 outline-none resize-none" })] })] }), error && (0, jsx_runtime_1.jsx)("p", { className: "text-red-400 text-xs", children: error }), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-end gap-3 pt-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: onClose, disabled: updating, className: "px-4 py-2 text-sm text-neutral-400 border border-neutral-700 rounded hover:bg-neutral-800 transition-colors", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleSave, disabled: updating, className: "px-4 py-2 text-sm text-white bg-cyan-700 hover:bg-cyan-600 rounded transition-colors disabled:opacity-50", children: updating ? 'Saving...' : 'Save' })] })] })] }));
+}
+/* ------------------------------------------------------------------ */
+/*  Detail View (full)                                                 */
+/* ------------------------------------------------------------------ */
 function TerritoryDetailView({ territoryId, territory, onBack }) {
     const { data: detailedStats, loading: statsLoading } = (0, auth_react_1.useTerritoryDetailedStats)(territoryId);
     const { data: members, loading: membersLoading } = (0, auth_react_1.useTerritoryMembers)(territoryId);
+    const [editOpen, setEditOpen] = (0, react_1.useState)(false);
     const stats = detailedStats;
     const memberList = Array.isArray(members) ? members : [];
     const unitType = (territory?.unit_type || 'station');
     const techBonus = TECH_BONUS[unitType.toLowerCase()] ?? 0;
-    const memberCount = territory?.member_count ?? stats?.stats?.member_count ?? 0;
-    const maxCapacity = territory?.max_capacity ?? stats?.stats?.max_capacity ?? 0;
-    const vaultBalance = territory?.vault_balance ?? stats?.stats?.vault_balance ?? 0;
+    const memberCount = territory?.member_count ?? stats?.stats?.member_count ?? stats?.metrics?.member_count ?? 0;
+    const maxCapacity = territory?.max_capacity ?? stats?.stats?.max_capacity ?? stats?.metrics?.max_capacity ?? 0;
+    const vaultBalance = territory?.vault_balance ?? stats?.stats?.vault_balance ?? stats?.metrics?.vault_mcd ?? 0;
     const occupancy = maxCapacity > 0 ? Math.round((memberCount / maxCapacity) * 100) : 0;
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-6", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: onBack, className: "flex items-center gap-2 text-sm text-neutral-400 hover:text-white transition-colors bg-transparent border-none cursor-pointer", children: [(0, jsx_runtime_1.jsx)(IconArrowLeft, { className: "w-4 h-4" }), "Back to list"] }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-5", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-24 h-24 bg-neutral-800 rounded-lg flex items-center justify-center overflow-hidden flex-shrink-0", children: territory?.image_url ? ((0, jsx_runtime_1.jsx)("img", { src: territory.image_url, alt: territory.unit_name, className: "w-full h-full object-cover" })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-neutral-600", children: getTypeIcon(unitType, 'w-10 h-10') })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 min-w-0", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3 flex-wrap", children: [(0, jsx_runtime_1.jsx)("h2", { className: "text-xl font-bold text-white", children: territory?.unit_name ?? territoryId }), territory?.short_id && ((0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-500 font-mono", children: territory.short_id })), (0, jsx_runtime_1.jsxs)("span", { className: `border px-1.5 py-0.5 rounded text-xs capitalize ${getTypeBadgeColor(unitType)}`, children: [getTypeIcon(unitType, 'w-3 h-3 inline-block -mt-0.5 mr-1'), unitType] }), territory?.manager_display_name && ((0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-1 text-xs text-emerald-400 border border-emerald-400/30 px-1.5 py-0.5 rounded", children: [(0, jsx_runtime_1.jsx)(IconShield, { className: "w-3 h-3" }), "Magistrate: ", territory.manager_display_name] }))] }), territory?.full_path && ((0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 text-sm font-mono mt-1", children: territory.full_path })), territory?.description && ((0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-sm mt-2", children: territory.description }))] })] }) }), statsLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: [...Array(4)].map((_, i) => (0, jsx_runtime_1.jsx)(Skeleton, { className: "h-24" }, i)) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconUsers, { className: "w-4 h-4 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400", children: "Members" })] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-2xl font-bold text-white font-mono", children: [fmt(memberCount), (0, jsx_runtime_1.jsxs)("span", { className: "text-sm text-neutral-500 font-normal", children: ["/", fmt(maxCapacity)] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconVault, { className: "w-4 h-4 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400", children: "Vault MCD" })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-2xl font-bold text-white font-mono", children: fmt(Math.round(vaultBalance)) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconZap, { className: "w-4 h-4 text-yellow-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400", children: "Tech Bonus" })] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-2xl font-bold text-yellow-400 font-mono", children: ["+", stats?.tech_bonus ?? techBonus, "%"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconSettings, { className: "w-4 h-4 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400", children: "Occupancy" })] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-2xl font-bold text-white font-mono", children: [occupancy, "%"] })] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-4 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconEdit3, { className: "w-4 h-4 text-cyan-400" }), "KPI Progress"] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400", children: "Occupancy Rate" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-sm text-white font-mono", children: [occupancy, "%"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-2 bg-neutral-800 rounded-full overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-full bg-cyan-400 rounded-full transition-all duration-500", style: { width: `${Math.min(occupancy, 100)}%` } }) })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400", children: "Vault Balance" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-sm text-white font-mono", children: [fmt(Math.round(vaultBalance)), " MCD"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-2 bg-neutral-800 rounded-full overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-full bg-cyan-400 rounded-full transition-all duration-500", style: { width: `${Math.min(vaultBalance > 0 ? Math.max(Math.log10(vaultBalance) * 10, 5) : 0, 100)}%` } }) })] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-3 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconVault, { className: "w-4 h-4 text-cyan-400" }), "Distribution Mechanism"] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-sm leading-relaxed", children: "Each territory vault distributes 1% of its MCD balance daily to all active miners within the territory. The distribution is proportional to each miner's mining activity. Vault balances are replenished through companion yield from mining operations (30% of companion output as MCD) and monthly recycling cycles." })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors", children: [(0, jsx_runtime_1.jsx)("div", { className: "p-4 border-b border-neutral-700/50", children: (0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconUsers, { className: "w-4 h-4 text-cyan-400" }), "Members (", memberList.length, ")"] }) }), (0, jsx_runtime_1.jsx)("div", { className: "overflow-x-auto", children: membersLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "p-6 flex justify-center", children: (0, jsx_runtime_1.jsx)(Spinner, {}) })) : memberList.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "p-8 text-center text-neutral-500 text-sm", children: "No members found" })) : ((0, jsx_runtime_1.jsxs)("table", { className: "w-full text-sm", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { className: "border-b border-neutral-700/50", children: [(0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Name / UID" }), (0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Role" }), (0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Email" }), (0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Joined" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: memberList.map((member, idx) => ((0, jsx_runtime_1.jsxs)("tr", { className: "border-b border-neutral-800/50 hover:bg-neutral-800/30", children: [(0, jsx_runtime_1.jsxs)("td", { className: "px-4 py-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-white", children: member.display_name || member.username || 'Unknown' }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs font-mono", children: member.uid ? `${member.uid.slice(0, 12)}...` : '-' })] }), (0, jsx_runtime_1.jsx)("td", { className: "px-4 py-3", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-300 capitalize", children: member.role || member.level_name || 'Miner' }) }), (0, jsx_runtime_1.jsx)("td", { className: "px-4 py-3", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400 font-mono text-xs", children: member.email ? (member.email.length > 20 ? member.email.slice(0, 20) + '...' : member.email) : '-' }) }), (0, jsx_runtime_1.jsx)("td", { className: "px-4 py-3", children: (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400 flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(IconCalendar, { className: "w-3 h-3" }), member.joined_at || member.created_at
-                                                            ? new Date(member.joined_at || member.created_at).toLocaleDateString()
-                                                            : '-'] }) })] }, member.uid || idx))) })] })) })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: onBack, className: "flex items-center gap-2 text-sm text-neutral-400 hover:text-white transition-colors bg-transparent border-none cursor-pointer", children: [(0, jsx_runtime_1.jsx)(IconArrowLeft, { className: "w-4 h-4" }), "Back to list"] }), territory && ((0, jsx_runtime_1.jsxs)("button", { onClick: () => setEditOpen(true), className: "flex items-center gap-1.5 px-3 py-1.5 text-sm text-white bg-cyan-700 hover:bg-cyan-600 rounded transition-colors", children: [(0, jsx_runtime_1.jsx)(IconEdit3, { className: "w-3.5 h-3.5" }), "Edit"] }))] }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-5", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-28 h-28 bg-neutral-800 rounded-lg flex items-center justify-center overflow-hidden flex-shrink-0", children: territory?.image_url ? ((0, jsx_runtime_1.jsx)("img", { src: territory.image_url, alt: territory.unit_name, className: "w-full h-full object-cover" })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center text-neutral-600", children: [getTypeIcon(unitType, 'w-10 h-10'), (0, jsx_runtime_1.jsx)("span", { className: "text-[10px] mt-1 capitalize", children: unitType })] })) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 min-w-0", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3 flex-wrap", children: [(0, jsx_runtime_1.jsx)("h2", { className: "text-xl font-bold text-white", children: territory?.unit_name ?? territoryId }), territory?.short_id && ((0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-400 font-mono bg-neutral-800 px-2 py-0.5 rounded", children: territory.short_id })), (0, jsx_runtime_1.jsx)("span", { className: `border px-1.5 py-0.5 rounded text-xs capitalize ${getTypeBadgeColor(unitType)}`, children: unitType }), occupancy >= 90 ? ((0, jsx_runtime_1.jsx)("span", { className: "text-xs bg-white/20 text-white px-1.5 py-0.5 rounded", children: "Qualified" })) : ((0, jsx_runtime_1.jsx)("span", { className: "text-xs bg-neutral-500/20 text-neutral-400 px-1.5 py-0.5 rounded", children: "Not Qualified" }))] }), territory?.manager_display_name && ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mt-2 text-xs text-emerald-400", children: [(0, jsx_runtime_1.jsx)(IconShield, { className: "w-3.5 h-3.5" }), "Magistrate: ", territory.manager_display_name] })), territory?.full_path && ((0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 text-sm font-mono mt-1", children: territory.full_path })), territory?.description && ((0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-sm mt-2", children: territory.description }))] })] }) }), statsLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: [...Array(4)].map((_, i) => (0, jsx_runtime_1.jsx)(Skeleton, { className: "h-24" }, i)) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconUsers, { className: "w-5 h-5 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Members" })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-2xl font-bold text-white font-mono", children: fmt(memberCount) }), (0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-neutral-500 mt-1", children: ["Capacity: ", (0, jsx_runtime_1.jsx)("span", { className: "font-mono", children: fmt(maxCapacity) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconVault, { className: "w-5 h-5 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Vault Balance" })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-2xl font-bold text-white font-mono", children: fmt(Math.round(vaultBalance)) }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-500 mt-1", children: "MCD" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconZap, { className: "w-5 h-5 text-yellow-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Tech Bonus" })] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-2xl font-bold text-white font-mono", children: ["+", stats?.tech_bonus ?? techBonus, "%"] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-500 mt-1", children: "Mining output bonus" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconSettings, { className: "w-5 h-5 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "Occupancy" })] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-2xl font-bold text-white font-mono", children: [occupancy, "%"] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-500 mt-1", children: "Members / Capacity" })] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-4 flex items-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)(IconEdit3, { className: "w-4 h-4 text-cyan-400" }), "KPI Progress"] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between text-sm mb-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400", children: "Members" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-white font-mono", children: [fmt(memberCount), " / ", fmt(maxCapacity)] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-2 bg-neutral-800 rounded-full overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-full bg-cyan-400 rounded-full transition-all duration-500", style: { width: `${Math.min(occupancy, 100)}%` } }) }), (0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-neutral-500 font-mono mt-1", children: [occupancy, "% filled"] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between text-sm mb-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400", children: "Vault Balance" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-white font-mono", children: [fmt(Math.round(vaultBalance)), " MCD"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-2 bg-neutral-800 rounded-full overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-full bg-cyan-400 rounded-full transition-all duration-500", style: { width: `${Math.min(vaultBalance > 0 ? Math.max(Math.log10(vaultBalance) * 10, 5) : 0, 100)}%` } }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-500 mt-1", children: "Current vault funds" })] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors p-6", children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold mb-3 flex items-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)(IconSettings, { className: "w-4 h-4 text-cyan-400" }), "Distribution Mechanism"] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-4", children: [(0, jsx_runtime_1.jsx)("h4", { className: "text-white font-semibold text-sm mb-2", children: "Auto Distribution by Contribution" }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-sm", children: "Vault MCD is distributed daily at 1% of balance, allocated to miners proportional to their mining activity." }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 text-xs mt-2", children: "Distribution ratio: Miners 100% (by contribution)" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [(0, jsx_runtime_1.jsx)(IncomeChart, { territoryId: territoryId }), (0, jsx_runtime_1.jsx)(MemberRanking, { territoryId: territoryId })] }), (0, jsx_runtime_1.jsx)(KPIHistoryChart, { territoryId: territoryId }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg hover:border-cyan-400/50 transition-colors", children: [(0, jsx_runtime_1.jsx)("div", { className: "p-4 border-b border-neutral-700/50", children: (0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-semibold flex items-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)(IconUsers, { className: "w-4 h-4 text-cyan-400" }), "Members (", memberList.length, ")"] }) }), (0, jsx_runtime_1.jsx)("div", { className: "overflow-x-auto", children: membersLoading ? ((0, jsx_runtime_1.jsx)("div", { className: "p-6 flex justify-center", children: (0, jsx_runtime_1.jsx)(Spinner, {}) })) : memberList.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "p-8 text-center text-neutral-500 text-sm", children: "No members found" })) : ((0, jsx_runtime_1.jsxs)("table", { className: "w-full text-sm", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { className: "border-b border-neutral-700/50", children: [(0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Name / UID" }), (0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Role" }), (0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Email" }), (0, jsx_runtime_1.jsx)("th", { className: "text-left px-4 py-3 text-neutral-400 font-medium", children: "Joined" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: memberList.map((member, idx) => ((0, jsx_runtime_1.jsxs)("tr", { className: "border-b border-neutral-800/50 hover:bg-neutral-800/30", children: [(0, jsx_runtime_1.jsxs)("td", { className: "px-4 py-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-white", children: member.display_name || member.username || 'Unknown' }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs font-mono", children: member.uid ? `${member.uid.slice(0, 12)}...` : '-' })] }), (0, jsx_runtime_1.jsx)("td", { className: "px-4 py-3", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-300 capitalize", children: member.role || member.level_name || 'Miner' }) }), (0, jsx_runtime_1.jsx)("td", { className: "px-4 py-3", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400 font-mono text-xs", children: member.email ? (member.email.length > 20 ? member.email.slice(0, 20) + '...' : member.email) : '-' }) }), (0, jsx_runtime_1.jsx)("td", { className: "px-4 py-3", children: (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400 flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(IconCalendar, { className: "w-3 h-3" }), member.joined_at || member.created_at ? new Date(member.joined_at || member.created_at).toLocaleDateString() : '-'] }) })] }, member.uid || idx))) })] })) })] }), territory && ((0, jsx_runtime_1.jsx)(EditTerritoryDialog, { territory: territory, open: editOpen, onClose: () => setEditOpen(false), onSaved: () => { } }))] }));
 }
 /* ------------------------------------------------------------------ */
 /*  Main Component                                                    */

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 export { MicrocosmMenuSection } from './components/menu-section';
 export type { MicrocosmMenuSectionProps } from './components/menu-section';
-export { blockchainMenu, web3OsMenu, dashboardMenu, microcosmMenuGroups, getAllMenuItems, resolveMenuPath, } from './menu-config';
-export type { MicrocosmMenuItem, MicrocosmMenuGroup } from './menu-config';
+export { blockchainMenu, web3OsMenu, dashboardMenu, microcosmMenuGroups, getAllMenuItems, resolveMenuPath, getMenuTitle, getMenuDescription, } from './menu-config';
+export type { MicrocosmMenuItem, MicrocosmMenuGroup, MenuLocale } from './menu-config';
 export { TerminalCard, StatBox, TerminalCommand, TerminalPageHeader, TerminalLoading, TerminalError, TerminalEmpty, TerminalBadge, TerminalDataRow, TerminalProgress, } from './components/terminal';
 export { TerminalTable } from './components/terminal-table';
 export type { TerminalTableColumn, TerminalTableProps } from './components/terminal-table';

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MicrocosmVotingPage = exports.MicrocosmOrganizationPage = exports.MicrocosmTerritoryPage = exports.MicrocosmAuctionPage = exports.MicrocosmMCDPage = exports.MicrocosmMiningPage = exports.MicrocosmWalletPage = exports.MicrocosmLendingPage = exports.MicrocosmFragmentPage = exports.MicrocosmLockPeriods = exports.MicrocosmMCDStats = exports.MicrocosmMCCTokenStats = exports.MicrocosmEcosystemStats = exports.MicrocosmMyMining = exports.MicrocosmMiningWeight = exports.MicrocosmMintingStats = exports.MicrocosmPriceChart = exports.MicrocosmAssetsSummary = exports.MicrocosmQuickActions = exports.MicrocosmMarketBar = exports.MicrocosmDashboardOverview = exports.KPIRadialChart = exports.VoteResultBar = exports.MiningProgressBar = exports.TerritoryCard = exports.TerminalTooltip = exports.TerminalInput = exports.TerminalCountdown = exports.TerminalDialog = exports.TerminalTabs = exports.TerminalTable = exports.TerminalProgress = exports.TerminalDataRow = exports.TerminalBadge = exports.TerminalEmpty = exports.TerminalError = exports.TerminalLoading = exports.TerminalPageHeader = exports.TerminalCommand = exports.StatBox = exports.TerminalCard = exports.resolveMenuPath = exports.getAllMenuItems = exports.microcosmMenuGroups = exports.dashboardMenu = exports.web3OsMenu = exports.blockchainMenu = exports.MicrocosmMenuSection = void 0;
+exports.MicrocosmVotingPage = exports.MicrocosmOrganizationPage = exports.MicrocosmTerritoryPage = exports.MicrocosmAuctionPage = exports.MicrocosmMCDPage = exports.MicrocosmMiningPage = exports.MicrocosmWalletPage = exports.MicrocosmLendingPage = exports.MicrocosmFragmentPage = exports.MicrocosmLockPeriods = exports.MicrocosmMCDStats = exports.MicrocosmMCCTokenStats = exports.MicrocosmEcosystemStats = exports.MicrocosmMyMining = exports.MicrocosmMiningWeight = exports.MicrocosmMintingStats = exports.MicrocosmPriceChart = exports.MicrocosmAssetsSummary = exports.MicrocosmQuickActions = exports.MicrocosmMarketBar = exports.MicrocosmDashboardOverview = exports.KPIRadialChart = exports.VoteResultBar = exports.MiningProgressBar = exports.TerritoryCard = exports.TerminalTooltip = exports.TerminalInput = exports.TerminalCountdown = exports.TerminalDialog = exports.TerminalTabs = exports.TerminalTable = exports.TerminalProgress = exports.TerminalDataRow = exports.TerminalBadge = exports.TerminalEmpty = exports.TerminalError = exports.TerminalLoading = exports.TerminalPageHeader = exports.TerminalCommand = exports.StatBox = exports.TerminalCard = exports.getMenuDescription = exports.getMenuTitle = exports.resolveMenuPath = exports.getAllMenuItems = exports.microcosmMenuGroups = exports.dashboardMenu = exports.web3OsMenu = exports.blockchainMenu = exports.MicrocosmMenuSection = void 0;
 // AI-generated · AI-managed · AI-maintained
 var menu_section_1 = require("./components/menu-section");
 Object.defineProperty(exports, "MicrocosmMenuSection", { enumerable: true, get: function () { return menu_section_1.MicrocosmMenuSection; } });
@@ -11,6 +11,8 @@ Object.defineProperty(exports, "dashboardMenu", { enumerable: true, get: functio
 Object.defineProperty(exports, "microcosmMenuGroups", { enumerable: true, get: function () { return menu_config_1.microcosmMenuGroups; } });
 Object.defineProperty(exports, "getAllMenuItems", { enumerable: true, get: function () { return menu_config_1.getAllMenuItems; } });
 Object.defineProperty(exports, "resolveMenuPath", { enumerable: true, get: function () { return menu_config_1.resolveMenuPath; } });
+Object.defineProperty(exports, "getMenuTitle", { enumerable: true, get: function () { return menu_config_1.getMenuTitle; } });
+Object.defineProperty(exports, "getMenuDescription", { enumerable: true, get: function () { return menu_config_1.getMenuDescription; } });
 var terminal_1 = require("./components/terminal");
 Object.defineProperty(exports, "TerminalCard", { enumerable: true, get: function () { return terminal_1.TerminalCard; } });
 Object.defineProperty(exports, "StatBox", { enumerable: true, get: function () { return terminal_1.StatBox; } });

package/dist/menu-config.d.ts

@@ -1,18 +1,29 @@
 import { type LucideIcon } from 'lucide-react';
+export type MenuLocale = 'en' | 'zh' | 'ja' | 'ko';
 export interface MicrocosmMenuItem {
     title: string;
+    titles?: Partial<Record<MenuLocale, string>>;
     key: string;
     path: string;
     icon: LucideIcon;
     description?: string;
+    descriptions?: Partial<Record<MenuLocale, string>>;
     badge?: string;
 }
 export interface MicrocosmMenuGroup {
     title: string;
+    titles?: Partial<Record<MenuLocale, string>>;
     key: string;
     icon: LucideIcon;
     items: MicrocosmMenuItem[];
 }
+/** Resolve localized title — falls back to `item.title` (English) */
+export declare function getMenuTitle(item: {
+    title: string;
+    titles?: Partial<Record<MenuLocale, string>>;
+}, locale?: MenuLocale): string;
+/** Resolve localized description */
+export declare function getMenuDescription(item: MicrocosmMenuItem, locale?: MenuLocale): string;
 export declare const dashboardMenu: MicrocosmMenuGroup;
 export declare const blockchainMenu: MicrocosmMenuGroup;
 export declare const web3OsMenu: MicrocosmMenuGroup;

package/dist/menu-config.js

@@ -1,10 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.microcosmMenuGroups = exports.web3OsMenu = exports.blockchainMenu = exports.dashboardMenu = void 0;
+exports.getMenuTitle = getMenuTitle;
+exports.getMenuDescription = getMenuDescription;
 exports.getAllMenuItems = getAllMenuItems;
 exports.resolveMenuPath = resolveMenuPath;
 // AI-generated · AI-managed · AI-maintained
 const lucide_react_1 = require("lucide-react");
+/** Resolve localized title — falls back to `item.title` (English) */
+function getMenuTitle(item, locale) {
+    if (!locale || !item.titles)
+        return item.title;
+    return item.titles[locale] ?? item.title;
+}
+/** Resolve localized description */
+function getMenuDescription(item, locale) {
+    if (!locale || !item.descriptions)
+        return item.description ?? '';
+    return item.descriptions[locale] ?? item.description ?? '';
+}
 exports.dashboardMenu = {
     title: 'Overview',
     key: 'overview',
@@ -54,31 +68,57 @@ exports.web3OsMenu = {
     items: [
         {
             title: 'Auctions',
+            titles: { zh: '拍卖', ja: 'Auctions', ko: 'Auctions' },
             key: 'auctions',
             path: '/mcc/auctions',
             icon: lucide_react_1.Gift,
             description: 'Territory auction bidding',
+            descriptions: { zh: '领地拍卖竞价', ja: '領地オークション', ko: '영토 경매' },
         },
         {
             title: 'Territories',
+            titles: { zh: '领地管理', ja: 'Territories', ko: 'Territories' },
             key: 'territory',
             path: '/user-system/territory',
             icon: lucide_react_1.Building2,
             description: 'Territory list and details',
+            descriptions: { zh: '领地列表与详情', ja: '領地一覧と詳細', ko: '영토 목록 및 상세' },
+        },
+        {
+            title: 'NFT Fragments',
+            titles: { zh: 'NFT 碎片化', ja: 'NFT Fragments', ko: 'NFT Fragments' },
+            key: 'fragments',
+            path: '/mcc/fragments',
+            icon: lucide_react_1.Puzzle,
+            description: 'Fractionalize territory NFTs',
+            descriptions: { zh: '领地 NFT 碎片化交易', ja: 'NFTフラクション化', ko: 'NFT 분할화' },
+        },
+        {
+            title: 'Lending',
+            titles: { zh: '去中心化借贷', ja: 'Lending', ko: 'Lending' },
+            key: 'lending',
+            path: '/mcc/lending',
+            icon: lucide_react_1.Landmark,
+            description: 'Borrow MCC with NFT collateral',
+            descriptions: { zh: 'NFT 抵押借贷 MCC', ja: 'NFT担保レンディング', ko: 'NFT 담보 대출' },
         },
         {
             title: 'Voting',
+            titles: { zh: '投票', ja: 'Voting', ko: 'Voting' },
             key: 'voting',
             path: '/mcc/voting',
             icon: lucide_react_1.Vote,
             description: 'Community proposal voting',
+            descriptions: { zh: '社区提案投票', ja: '提案投票', ko: '제안 투표' },
         },
         {
             title: 'Organization',
+            titles: { zh: '组织', ja: 'Organization', ko: 'Organization' },
             key: 'organization',
             path: '/user-system/organization',
             icon: lucide_react_1.Users,
             description: 'Organization structure',
+            descriptions: { zh: '组织架构管理', ja: '組織構造', ko: '조직 구조' },
         },
     ],
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@microcosmmoney/portal-react",
-  "version": "3.1.0",
+  "version": "3.2.1",
   "description": "Microcosm Portal UI components for React/Next.js",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",