// Shared atoms: Icons, Chip, formatters — exposed globally for other Babel scripts const { useState, useEffect, useRef, useMemo, useCallback } = React; // ---------- Icons (lucide-inspired, original strokes) ---------- const Icon = { Dashboard: (p) => (), Box: (p) => (), Move: (p) => (), Sparkle: (p) => (), Chart: (p) => (), Gear: (p) => (), Search: (p) => (), Plus: (p) => (), Minus: (p) => (), Bell: (p) => (), Flag: (p) => (), Trash: (p) => (), Edit: (p) => (), More: (p) => (), Check: (p) => (), X: (p) => (), ArrowDown: (p) => (), ArrowUp: (p) => (), ArrowRight: (p) => (), ArrowLeft: (p) => (), Warning: (p) => (), AlertCircle: (p) => (), InfoCircle: (p) => (), Trend: (p) => (), Truck: (p) => (), Globe: (p) => (), User: (p) => (), Tag: (p) => (), Filter: (p) => (), Download: (p) => (), Print: (p) => (), Folder: (p) => (), Layers: (p) => (), Clock: (p) => (), Receive: (p) => (), Issue: (p) => (), Adjust: (p) => (), Sun: (p) => (), Moon: (p) => (), Map: (p) => () }; // ---------- Formatters ---------- function fmtThousands(n, decimals = 0) { if (n == null || isNaN(n)) return '—'; return Number(n).toLocaleString('en-US', { minimumFractionDigits: decimals, maximumFractionDigits: decimals }); } function fmtCurrency(n) { if (n == null || isNaN(n)) return '—'; return Number(n).toLocaleString('en-US', { maximumFractionDigits: 0 }); } function fmtDate(s, lang) { if (!s) return '—'; const d = new Date(s); if (lang === 'th') { return d.toLocaleDateString('th-TH', { day: '2-digit', month: 'short' }); } return d.toLocaleDateString('en-US', { day: '2-digit', month: 'short' }); } function daysSince(s) { if (!s) return null; const d = new Date(s); const today = new Date('2026-04-01'); // simulate "now" after March data return Math.max(0, Math.floor((today - d) / 86400000)); } // ---------- Chip / Pill ---------- function StatusPill({ status, t }) { const label = t['status_' + status] || status; return {label}; } function ABCBadge({ abc }) { return {abc}; } // ---------- Sparkline ---------- function Sparkline({ data, color }) { if (!data || !data.length) return null; const max = Math.max(...data, 1); const min = 0; const w = 90, h = 28; const step = w / Math.max(data.length - 1, 1); const pts = data.map((v, i) => `${(i*step).toFixed(1)},${(h - (v-min)/(max-min) * (h-4) - 2).toFixed(1)}`).join(' '); return ( ); } // ---------- Pie / donut chart ---------- function PieChart({ slices, hovered, setHovered, centerLabel, size = 200, thickness = 38, unit }) { const total = slices.reduce((s, x) => s + (x.value || 0), 0) || 1; const r = size / 2; const inner = r - thickness; let acc = 0; // For a 100% single slice, render as a full ring instead of arc (which would degenerate) const onlyOne = slices.filter(s => s.value > 0).length === 1; return (

{centerLabel && (

{centerLabel.primary}

{unit &&

{unit}

}

{centerLabel.secondary}

)}

); } function useOutsideClick(ref, onOutside) { useEffect(() => { function handler(e) { if (ref.current && !ref.current.contains(e.target)) onOutside(); } document.addEventListener('mousedown', handler); return () => document.removeEventListener('mousedown', handler); }, [ref, onOutside]); } // ---------- Toast system ---------- const ToastContext = React.createContext(null); function ToastProvider({ children }) { const [toasts, setToasts] = useState([]); const push = useCallback((msg, kind = 'ok') => { const id = Math.random().toString(36).slice(2); setToasts(t => [...t, { id, msg, kind }]); setTimeout(() => setToasts(t => t.filter(x => x.id !== id)), 2400); }, []); return ( {children}

{toasts.map(t => (

{t.kind === 'ok' && } {t.kind === 'bad' && } {t.msg}

))}

); } function useToast() { return React.useContext(ToastContext); } // ---------- Category labels ---------- function catLabel(cat, t) { return t['cat_' + cat] || cat; } // Generate sparkline data from monthlyDemand function genSpark(product) { const base = product.monthlyDemand / 30; const arr = []; let seed = 0; for (let i = 0; i < product.sku.length; i++) seed = (seed * 31 + product.sku.charCodeAt(i)) >>> 0; for (let i = 0; i < 12; i++) { seed = (seed * 1664525 + 1013904223) >>> 0; const v = base * (0.4 + (seed % 1000) / 800); arr.push(v); } return arr; } Object.assign(window, { Icon, fmtThousands, fmtCurrency, fmtDate, daysSince, StatusPill, ABCBadge, Sparkline, PieChart, useOutsideClick, ToastProvider, useToast, catLabel, genSpark });