Jann/investment-sandbox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Closes #016 - Deploy Native KaTeX Rig & Dual-Handbook System

Browse Source
This commit is contained in:
Antigravity Agent
2026-06-13 15:16:57 +02:00
parent 59e0a04bfa
commit 94ccf63a38
26 changed files with 1074 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

130
components/modules/crypto/CryptoBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,130 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface CryptoBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function CryptoBlueprintModal({ isOpen, onClose }: CryptoBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-cyan-400 to-sky-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-cyan-400" /> Crypto Bayes Module - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">System Inputs &amp; Signals</h3>
<p className="text-xs text-slate-400 mt-1">Operational breakdown of key indicators used by the multi-model pipeline.</p>
</div>
{/* Core Indicators */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-cyan-400 uppercase tracking-wider font-mono">1. Funding Rates (Leverage Skew)</h4>
<p className="text-xs text-slate-400 leading-relaxed">
Reflects periodic payments exchanged between long and short traders. Extremely positive funding rates signal retail over-leverage and high risk of long liquidation squeezes (bearish indicators). Negative rates signal retail panic and potential short squeezes (bullish indicators).
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-cyan-400 uppercase tracking-wider font-mono">2. Open Interest Change (Capital Velocity)</h4>
<p className="text-xs text-slate-400 leading-relaxed">
Measures the net speed at which new contracts are being opened or closed. A sharp increase in Open Interest accompanied by price moves confirms a strong momentum transition, indicating institutional volume entry.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-cyan-400 uppercase tracking-wider font-mono">3. Retail Skew (Contrarian Filter)</h4>
<p className="text-xs text-slate-400 leading-relaxed">
Calculates the proportion of long contracts held by retail accounts. The system operates under a contrarian framework: when retail long positioning is at extreme bullishness (e.g. Retail Skew &gt; 1.50), the system dampens bullish forecast probabilities.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-cyan-400 uppercase tracking-wider font-mono">4. Whale Inflows (Accumulation Vectors)</h4>
<p className="text-xs text-slate-400 leading-relaxed">
Tracks large volume transactions moving from spot exchanges to private cold storage. Accumulation inflows decrease available supply on exchanges, establishing a spot-supply mismatch that supports upward spot pricing pressure.
</p>
</div>
</div>
{/* Interface Legend */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Interface Layout &amp; Metrics Legend</h3>
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-800/60 space-y-4 text-xs">
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div>
<strong className="text-slate-200 block mb-1">Expected Value (E: %)</strong>
<p className="text-slate-400 leading-relaxed">
Calculated as the Posterior Expected Value E = alpha / (alpha + beta) based on successes (alpha) and failures (beta). A value of e.g. **E: 85.5%** suggests that the estimator-horizon combination is highly calibrated.
</p>
</div>
<div>
<strong className="text-slate-200 block mb-1">Raw Trackers ("62/14")</strong>
<p className="text-slate-400 leading-relaxed">
Represents the absolute counts of success and failure outcomes: **62** successfully resolved direction predictions (alpha) and **14** false alarms or incorrect directional forecasts (beta).
</p>
</div>
<div>
<strong className="text-slate-200 block mb-1">Horizon Forecasts</strong>
<p className="text-slate-400 leading-relaxed">
Displays direction (▲ UP / ▼ DOWN) and probability forecast for BTC, ETH, or SOL at horizons T+1 (24h), T+5 (5d), and T+10 (10d).
</p>
</div>
</div>
</div>
</div>
{/* Operational Dynamics */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Simulator &amp; Ingestion Loops</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-cyan-400">Posterior Calibration Simulator:</strong> Clicking **"+1 Success (All)"** or **"+1 False Alarm (All)"** simulates model feedback loops. It increments the success or failure count across all 15 independent trackers, storing updated states immediately in `localStorage` to evaluate how expected accuracies drift when models perform well or poorly.
</p>
<p>
<strong className="text-cyan-400">Background Evaluation Loop:</strong> When a user logs a manual forecast, the app registers predictions for all 15 trackers. In dev mode, the targets resolve quickly: T+1 in 60 seconds, T+5 in 5 minutes, and T+10 in 10 minutes. A background worker queries `/api/finance?region=crypto` to resolve the actual price change, updates the trackers in `localStorage`, and displays the success rates.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

11
components/modules/crypto/CryptoDemo.tsx
View File

@@ -6,6 +6,7 @@ import { predictCryptoTrend, calculateBetaPosterior } from '@/lib/math/statistic
import 'katex/dist/katex.min.css';
import { BlockMath, InlineMath } from 'react-katex';
import CryptoMathModal from './CryptoMathModal';
import CryptoBlueprintModal from './CryptoBlueprintModal';
import {
Cpu, Search, RefreshCw, BarChart2, TrendingUp, AlertCircle, Info,
ChevronDown, ChevronUp, ArrowUpRight, ArrowDownRight, Compass, ShieldAlert, Sparkles,
@@ -114,6 +115,7 @@ export default function CryptoDemo() {
const [searchError, setSearchError] = useState(false);
const [showMathAccordion, setShowMathAccordion] = useState(false);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [simulatedTrialLogged, setSimulatedTrialLogged] = useState(false);
const [lastTrialSuccess, setLastTrialSuccess] = useState(false);
@@ -556,6 +558,14 @@ export default function CryptoDemo() {
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-cyan-400 justify-center h-11"
>
<Cpu className="w-3.5 h-3.5" />
<span>⚙️ Operational Blueprint</span>
</button>
<div className="bg-slate-900 border border-slate-800 rounded-xl px-4 py-2 flex items-center gap-3 h-11">
<Cpu className="text-cyan-400 w-5 h-5 animate-spin-slow" />
<div>
@@ -1002,6 +1012,7 @@ export default function CryptoDemo() {
</div>
<CryptoMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<CryptoBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

16
components/modules/crypto/CryptoMathModal.tsx
View File

@@ -65,11 +65,11 @@ export default function CryptoMathModal({ isOpen, onClose }: CryptoMathModalProp
<span className="block text-rose-400 font-bold">State 1 (S1)</span>
<span>Bearish Squeeze / Crackdown</span>
</div>
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block text-slate-300 font-bold">State 2 (S2)</span>
<span>Consolidation / Mean Reversion</span>
</div>
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block text-emerald-400 font-bold">State 3 (S3)</span>
<span>Parabolic Bull Run</span>
</div>
@@ -117,10 +117,10 @@ export default function CryptoMathModal({ isOpen, onClose }: CryptoMathModalProp
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-800/60 space-y-3">
<span className="text-xs font-semibold text-slate-200 block">Ensemble Feature Inputs:</span>
<ul className="text-xs text-slate-400 list-disc pl-5 space-y-1">
<li><strong className="text-cyan-400">Funding Rates (\\(FR_t\\)):</strong> Measures leverage imbalance in futures contracts.</li>
<li><strong className="text-cyan-400">Open Interest Volatility (\\(OI_t\\)):</strong> Captures the contract buildup speed.</li>
<li><strong className="text-cyan-400">Long/Short Retail Skew (\\(LS_t\\)):</strong> Identifies retail sentiment extremes.</li>
<li><strong className="text-cyan-400">Whale Accumulation Inflows (\\(W_t\\)):</strong> Proxy for cold-wallet transfer velocities.</li>
<li><strong className="text-cyan-400">Funding Rates (<InlineMath math="FR_t" />):</strong> Measures leverage imbalance in futures contracts.</li>
<li><strong className="text-cyan-400">Open Interest Volatility (<InlineMath math="OI_t" />):</strong> Captures the contract buildup speed.</li>
<li><strong className="text-cyan-400">Long/Short Retail Skew (<InlineMath math="LS_t" />):</strong> Identifies retail sentiment extremes.</li>
<li><strong className="text-cyan-400">Whale Accumulation Inflows (<InlineMath math="W_t" />):</strong> Proxy for cold-wallet transfer velocities.</li>
</ul>
<p className="text-xs text-slate-400 leading-relaxed pt-2">
The Random Forest ensemble evaluates 10 non-linear decision trees to output the short-term and medium-term trend probabilities:
@@ -135,7 +135,7 @@ export default function CryptoMathModal({ isOpen, onClose }: CryptoMathModalProp
<p className="text-xs leading-relaxed text-slate-400">
Raw ML forecasts are susceptible to regime drift. We implement a self-correcting Beta-Binomial update. The continuous probability output from the Random Forest model is mapped into a discrete Binomial likelihood by defining the Trust-Weight Hyperparameter (<InlineMath math="w" />) as the Effective Sample Size (ESS):
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 space-y-4">
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 space-y-4">
<div>
<p className="text-xs text-slate-350 mb-2 font-semibold">1. Prior Distribution (Accuracy History):</p>
<BlockMath math="\\theta \\sim \\text{Beta}(\\alpha_{\\text{prior}}, \\beta_{\\text{prior}})" />
@@ -165,7 +165,7 @@ export default function CryptoMathModal({ isOpen, onClose }: CryptoMathModalProp
<p className="text-xs leading-relaxed text-slate-400">
To resolve a single operational point-estimate from our posterior distribution, we integrate out the continuous parameter <InlineMath math="\\theta" /> to calculate the mathematical expectation of the posterior distribution:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 space-y-4">
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 space-y-4">
<p className="text-xs text-slate-350 font-semibold">Posterior Expectation Integral Proof:</p>
<BlockMath math="\\mathbb{E}[\\theta \\mid \\text{Data}] = \\int_{0}^{1} \\theta \\cdot P(\\theta \\mid \\text{Data}) \\, d\\theta = \\int_{0}^{1} \\theta \\cdot \\frac{\\theta^{\\alpha_{\\text{post}}-1}(1-\\theta)^{\\beta_{\\text{post}}-1}}{\\text{B}(\\alpha_{\\text{post}}, \\beta_{\\text{post}})} \\, d\\theta" />
<p className="text-xs text-slate-400 leading-relaxed">

99
components/modules/events/EconometricsBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,99 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface EconometricsBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function EconometricsBlueprintModal({ isOpen, onClose }: EconometricsBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-355">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-indigo-400 to-purple-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-indigo-400" /> Econometric Events - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-355 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Event Studies &amp; Models</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of the econometric event study solver.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-indigo-400 uppercase tracking-wider font-mono">1. Event Window Parameter Configuration</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Allows defining the timeline partitions for analysis:
* **Estimation Window**: Historical baseline period (e.g. 120 days) used to estimate the normal asset return relationships.
* **Gap Window**: Separation buffer (e.g. 10 days) to prevent event-related leakages from skewing parameters.
* **Event Window**: Analysis window surrounding the event day (e.g. [-5, +5]).
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-indigo-400 uppercase tracking-wider font-mono">2. Abnormal Returns (AR)</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Computes daily differences between the actual stock return and its expected "normal" return (using market-adjusted models or CAPM parameters derived during the estimation window).
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-indigo-400 uppercase tracking-wider font-mono">3. Cumulative Abnormal Returns (CAR)</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Integrates and sums the daily abnormal returns across the event window. Determines whether an event (e.g. earnings release, regulatory fine, supply-chain shock) created statistically significant excess wealth changes.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Interface Actions &amp; Chart Displays</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-indigo-400 font-semibold">Event Parameters Input Mask:</strong> Edit estimation days, gap days, event horizons, and click **"Run Event Study Solver"**. Initiates server-side calculations.
</p>
<p>
<strong className="text-indigo-400 font-semibold">CAR Event Charts:</strong> Renders a Recharts line chart illustrating the trajectory of Cumulative Abnormal Returns ($CAR$) across the event window. A significant deviation from zero indicates market inefficiency or corporate information shocks.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

28
components/modules/events/EconometricsMathModal.tsx
View File

@@ -26,7 +26,7 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
@@ -61,7 +61,7 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
If an active event's date is in the past:
</p>
<ul className="list-disc pl-5 text-xs text-slate-400 space-y-1">
<li>FMP API fetches relative prices $P_t$ for $t \in [T-30, T+30]$ (60-day historical window).</li>
<li>FMP API fetches relative prices <InlineMath math="P_t" /> for <InlineMath math="t \in [T-30, T+30]" /> (60-day historical window).</li>
<li>Asset curves and the user's manual score are frozen under <code className="bg-slate-950 px-1 py-0.5 rounded text-[10px] text-slate-300">archivedEvents</code> in <code className="bg-slate-950 px-1 py-0.5 text-slate-300 rounded text-[10px]">econometrics_storage.json</code>.</li>
<li>Future edits to the active matrix will <strong>never</strong> modify archived price vectors.</li>
</ul>
@@ -70,10 +70,10 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
<div className="space-y-3">
<h4 className="text-xs font-bold text-rose-400 uppercase tracking-wider font-mono">B. Endogenous Calibration</h4>
<p className="text-xs leading-relaxed text-slate-400">
Active future matrix cells pre-fill suggested scores by looking up the corresponding historical LMM coefficient <InlineMath math="\\beta_{\\text{asset}\\_\\text{event}\\_\\text{post}}" /> and scaling it to our native score scale:
Active future matrix cells pre-fill suggested scores by looking up the corresponding historical LMM coefficient <InlineMath math="\beta_{\text{asset}\_\text{event}\_\text{post}}" /> and scaling it to our native score scale:
</p>
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2">
<BlockMath math="\\text{Score}_{\\text{suggested}} = \\max\\left(-3, \\min\\left(3, \\text{Round}(\\beta_{\\text{estimate}} \\times 100)\\right)\\right)" />
<BlockMath math="\text{Score}_{\text{suggested}} = \max\left(-3, \min\left(3, \text{Round}(\beta_{\text{estimate}} \times 100)\right)\right)" />
</div>
</div>
@@ -83,17 +83,17 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
The engine estimates direct event drift and impact returns, isolating asset-level intercepts as random deviances and purging macro volatility using VIX indices:
</p>
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2">
<BlockMath math="Y_{it} = X_{it}\\beta + Z_{it}b_i + \\varepsilon_{it}" />
<BlockMath math="Y_{it} = X_{it}\beta + Z_{it}b_i + \varepsilon_{it}" />
<p className="text-[11px] text-slate-400 mt-2 font-mono leading-relaxed">
{"Where:"}
<br />
{"- "}<InlineMath math="Y_{it}" />{" is the log-return "}<InlineMath math="\\ln(P_t/P_0)" />{" of asset "}<InlineMath math="i" />{" at relative index "}<InlineMath math="t \\in [-30, 30]" />{"."}
{"- "}<InlineMath math="Y_{it}" />{" is the log-return "}<InlineMath math="\ln(P_t/P_0)" />{" of asset "}<InlineMath math="i" />{" at relative index "}<InlineMath math="t \in [-30, 30]" />{"."}
<br />
{"- "}<InlineMath math="X_{it}" />{" design matrix elements isolate Pre-Event Drift ("}<InlineMath math="t < 0" />{") and Post-Event Impact ("}<InlineMath math="t \\ge 0" />{") while controlling for systemic covariates (VIX)."}
{"- "}<InlineMath math="X_{it}" />{" design matrix elements isolate Pre-Event Drift ("}<InlineMath math="t < 0" />{") and Post-Event Impact ("}<InlineMath math="t \ge 0" />{") while controlling for systemic covariates (VIX)."}
<br />
{"- "}<InlineMath math="b_i \\sim N(0, \\sigma_b^2)" />{" random intercept captures unique baseline asset variance."}
{"- "}<InlineMath math="b_i \sim N(0, \sigma_b^2)" />{" random intercept captures unique baseline asset variance."}
<br />
{"- "}<InlineMath math="\\varepsilon_{it} \\sim N(0, \\sigma^2)" />{" residuals noise."}
{"- "}<InlineMath math="\varepsilon_{it} \sim N(0, \sigma^2)" />{" residuals noise."}
</p>
</div>
</div>
@@ -106,15 +106,15 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div>
<p className="text-xs text-slate-400 mb-1">Logistic Probability Projection:</p>
<BlockMath math="P(\\text{Bullish}) = \\frac{1}{1 + e^{-\\text{Score}}}" />
<BlockMath math="P(\text{Bullish}) = \frac{1}{1 + e^{-\text{Score}}}" />
</div>
<div>
<p className="text-xs text-slate-400 mb-1">Optimal Youden Index (J):</p>
<BlockMath math="J = \\text{Sensitivity} + \\text{Specificity} - 1 = \\text{TPR} + (1 - \\text{FPR}) - 1" />
<BlockMath math="J = \text{Sensitivity} + \text{Specificity} - 1 = \text{TPR} + (1 - \text{FPR}) - 1" />
</div>
<div>
<p className="text-xs text-slate-400 mb-1">{"Inverting probability optimal threshold "}<InlineMath math="P^*" />{" back to native score "}<InlineMath math="S^*" />{" via Logit:"}</p>
<BlockMath math="S^* = \\ln\\left(\\frac{P^*}{1 - P^*}\\right)" />
<BlockMath math="S^* = \ln\left(\frac{P^*}{1 - P^*}\right)" />
</div>
</div>
</div>
@@ -126,7 +126,7 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
</p>
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div>
<BlockMath math="\\hat{S}(t) = \\prod_{t_i \\le t} \\left(1 - \\frac{d_i}{n_i}\\right)" />
<BlockMath math="\hat{S}(t) = \prod_{t_i \le t} \left(1 - \frac{d_i}{n_i}\right)" />
<p className="text-[11px] text-slate-400 mt-2 font-mono leading-relaxed">
{"Where:"}
<br />
@@ -137,7 +137,7 @@ export default function EconometricsMathModal({ isOpen, onClose }: EconometricsM
</div>
<div>
<p className="text-xs text-slate-400 mb-1">Reversal trigger with 1% Volatility Buffer:</p>
<BlockMath math="\\text{Sign}(\\text{Score}) \\times \\text{Return} \\le -0.01" />
<BlockMath math="\text{Sign}(\text{Score}) \times \text{Return} \le -0.01" />
</div>
</div>
</div>

13
components/modules/events/EventsDemo.tsx
View File

@@ -19,6 +19,7 @@ import {
import 'katex/dist/katex.min.css';
import { BlockMath, InlineMath } from 'react-katex';
import EconometricsMathModal from './EconometricsMathModal';
import EconometricsBlueprintModal from './EconometricsBlueprintModal';
import {
Activity,
BarChart4,
@@ -247,6 +248,7 @@ export default function EventsDemo() {
const [tauPre, setTauPre] = useState<number>(7);
const [tauPost, setTauPost] = useState<number>(3);
const [isMathModalOpen, setIsMathModalOpen] = useState<boolean>(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState<boolean>(false);
const [selectedSurvivalAsset, setSelectedSurvivalAsset] = useState<string>('Apple');
const [showLmmDiagnostics, setShowLmmDiagnostics] = useState<boolean>(false);
@@ -604,11 +606,19 @@ export default function EventsDemo() {
<button
onClick={() => setIsMathModalOpen(true)}
className="flex items-center gap-1.5 px-3 py-2 rounded-lg bg-slate-950/80 hover:bg-slate-905 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-rose-400"
className="flex items-center gap-1.5 px-3 py-2 rounded-lg bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-rose-400"
>
<BookOpen className="w-3.5 h-3.5" />
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-3 py-2 rounded-lg bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-rose-400 animate-pulse-slow"
>
<Compass className="w-3.5 h-3.5" />
<span>⚙️ Operational Blueprint</span>
</button>
</div>
</div>
</div>
@@ -1326,6 +1336,7 @@ export default function EventsDemo() {
</div>
<EconometricsMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<EconometricsBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

96
components/modules/insider/InsiderBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,96 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface InsiderBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function InsiderBlueprintModal({ isOpen, onClose }: InsiderBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-amber-400 to-yellow-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-amber-400" /> Insider Trades - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Insider Trade Ingestion &amp; Filters</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of corporate insider trade tracking.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-amber-400 uppercase tracking-wider font-mono">1. SEC Form 4 Tracking</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Monitors corporate insider purchases and sales filed on SEC Form 4. Concentrates on high-ranking corporate officers (CEO, CFO, COO) and board directors, whose trading behaviors exhibit historical correlation with forward stock performance.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-amber-400 uppercase tracking-wider font-mono">2. Trade Size Filters</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Filters transactions by absolute dollar size (prioritizing trades exceeding $100k) and percentage weight change relative to the insider's existing ownership stake. This helps eliminate routine stock option exercises and automated sales.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-amber-400 uppercase tracking-wider font-mono">3. DEV_MODE Interception</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
When the offline shield is active, the `/api/insider` route short-circuits live FMP calls and serves a high-fidelity local database file to guarantee zero API consumption costs.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Interface Layout &amp; Mechanics</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-amber-400 font-semibold">Insider Trades Ledger:</strong> Displays raw trade data: Tickers, Insider Names, Roles (CEO, Director, etc.), Buy/Sell transaction types, trade dates, shares traded, prices per share, and calculated total transaction values.
</p>
<p>
<strong className="text-amber-400 font-semibold">API Layer Status Badge:</strong> Displays the status in the top control bar, showing `🟢 LIVE API` or `🟡 DEV-ARCHIV AKTIV` depending on the environment shield.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

11
components/modules/insider/InsiderDemo.tsx
View File

@@ -7,6 +7,7 @@ import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContaine
import 'katex/dist/katex.min.css';
import { BlockMath, InlineMath } from 'react-katex';
import InsiderMathModal from './InsiderMathModal';
import InsiderBlueprintModal from './InsiderBlueprintModal';
import {
Shield, User, Landmark, ChevronDown, ChevronUp, Radio, Building2, AlertTriangle, Percent,
BookOpen
@@ -80,6 +81,7 @@ export default function InsiderDemo() {
}[] | null>(null);
const [showMathAccordion, setShowMathAccordion] = useState(false);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [isShieldActive, setIsShieldActive] = useState(false);
const [loading, setLoading] = useState(false);
const [errorMsg, setErrorMsg] = useState<string | null>(null);
@@ -273,6 +275,14 @@ export default function InsiderDemo() {
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-purple-400 justify-center h-11"
>
<Radio className="w-3.5 h-3.5" />
<span>⚙️ Operational Blueprint</span>
</button>
<div className="bg-slate-900 border border-slate-800 rounded-xl px-4 py-2 flex items-center gap-3 h-11">
<Shield className="text-purple-400 w-5 h-5" />
<div>
@@ -700,6 +710,7 @@ export default function InsiderDemo() {
</div>
<InsiderMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<InsiderBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

16
components/modules/insider/InsiderMathModal.tsx
View File

@@ -26,8 +26,8 @@ export default function InsiderMathModal({ isOpen, onClose }: InsiderMathModalPr
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-300">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-330">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/40 border-b border-slate-800/60">
@@ -70,8 +70,8 @@ export default function InsiderMathModal({ isOpen, onClose }: InsiderMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
Insiders have unique company information, but clusters yield highest significance. A cluster is registered if:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2">
<BlockMath math="\\text{Count}_{\\text{insiders}} \\ge 3 \\quad \\text{within a rolling 14-day window}" />
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2">
<BlockMath math="\text{Count}_{\text{insiders}} \ge 3 \quad \text{within a rolling 14-day window}" />
<p className="text-[11px] text-slate-400 font-mono mt-2 text-center">
Insiders must represent distinct entities (e.g. CEO, CFO, and Directors trading concurrently).
</p>
@@ -83,8 +83,8 @@ export default function InsiderMathModal({ isOpen, onClose }: InsiderMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
The Insider Intensity Score scales signals based on size, conviction value, and count of participants:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2">
<BlockMath math="I_{\\text{score}} = \\ln\\left(\\sum_{k=1}^N \\text{Volume}_{\\text{shares}, k}\\right) \\times \\left(\\frac{\\sum_{k=1}^N \\text{Value}_{\\text{USD}, k}}{\\text{Market Cap}}\\right) \\times \\text{Count}_{\\text{insiders}}" />
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2">
<BlockMath math="I_{\text{score}} = \ln\left(\sum_{k=1}^N \text{Volume}_{\text{shares}, k}\right) \times \left(\frac{\sum_{k=1}^N \text{Value}_{\text{USD}, k}}{\text{Market Cap}}\right) \times \text{Count}_{\text{insiders}}" />
</div>
</div>
@@ -93,9 +93,9 @@ export default function InsiderMathModal({ isOpen, onClose }: InsiderMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
The engine cross-references corporate clusters with the Overreaction Scanner, isolating stocks with the highest rebound probabilities:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2">
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2">
<p className="text-xs leading-relaxed font-mono">
{"If "}<InlineMath math="\\text{Alert} \\in \\text{Scanner}_{\\text{Oversold}}" />{" and "}<InlineMath math="\\text{Cluster} \\in \\text{Insider}_{\\text{Active}}" />{":"}
{"If "}<InlineMath math="\text{Alert} \in \text{Scanner}_{\text{Oversold}}" />{" and "}<InlineMath math="\text{Cluster} \in \text{Insider}_{\text{Active}}" />{":"}
<br/>
Prioritize tickers showing asymmetric insider buying during panic drops, suggesting fundamental divergence from market sentiment.
</p>

99
components/modules/macro/MacroBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,99 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface MacroBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function MacroBlueprintModal({ isOpen, onClose }: MacroBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-blue-400 to-indigo-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-blue-400" /> FRED Macro - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-355 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Macro Ingestion &amp; Thresholds</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of Federal Reserve Economic Data (FRED) integration.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-blue-400 uppercase tracking-wider font-mono">1. FRED Ingestion channels</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Queries Federal Reserve API endpoints to ingest 21 distinct macro credit, inflation, labor, and housing vectors. Bypasses external calls in `DEV_MODE` to read from local cache backups.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-blue-400 uppercase tracking-wider font-mono">2. Z-Score Normalization</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Applies rolling historical mean and standard deviation scaling to convert raw indicators (e.g. housing starts, Delinquencies) into standardized Z-scores, indicating how far the current economy drifts from historical norms.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-blue-400 uppercase tracking-wider font-mono">3. Cockpit Alerts System</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Standardizes warnings into green (safe), amber (watch), and flashing red (recession risk) lights. Evaluates interest rate curves, inflation velocity, credit delinquencies, and housing contractions.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Cockpit Status Alert Rationale</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-blue-400 font-semibold">Inflation &amp; Consumer Health Card:</strong> Sets off a `RED` trigger if CPI inflation YoY climbs above 3.0%, credit card delinquencies exceed 4.5%, or personal savings fall below 3.0%.
</p>
<p>
<strong className="text-blue-400 font-semibold">Valuation &amp; Liquidity Card:</strong> Sets off `RED` if S&amp;P 500-to-GDP ratio (Buffett Indicator) rises past 150%, or the M2 money supply growth rate turns negative.
</p>
<p>
<strong className="text-blue-400 font-semibold">Yield Curve &amp; Credit Spread Card:</strong> Sets off `RED` if the 10Y-2Y yield curve spread inverts (spread &lt; 0.0%) or high-yield credit spreads rise past 5.0%.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

15
components/modules/macro/MacroIndicatorsDemo.tsx
View File

@@ -4,6 +4,7 @@ import React, { useState, useEffect, useMemo } from 'react';
import { LineChart, Line, ResponsiveContainer } from 'recharts';
import 'katex/dist/katex.min.css';
import MacroMathModal from './MacroMathModal';
import MacroBlueprintModal from './MacroBlueprintModal';
import {
TrendingUp, Landmark, AlertCircle, BookOpen, Percent,
ArrowDownRight, ArrowUpRight, Minus, Activity, ShieldAlert, Coins,
@@ -37,6 +38,7 @@ export default function MacroIndicatorsDemo() {
const [error, setError] = useState<string | null>(null);
const [payload, setPayload] = useState<MacroDataPayload | null>(null);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [isAccordionOpen, setIsAccordionOpen] = useState(false); // Collapsible accordion closed by default
useEffect(() => {
@@ -281,13 +283,21 @@ export default function MacroIndicatorsDemo() {
<div className="flex items-center gap-3 w-full md:w-auto justify-end">
<button
onClick={() => setIsMathModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-955/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-indigo-400 w-full md:w-auto justify-center h-11 cursor-pointer"
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-indigo-400 w-full md:w-auto justify-center h-11 cursor-pointer"
>
<BookOpen className="w-4 h-4" />
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-indigo-400 w-full md:w-auto justify-center h-11 cursor-pointer animate-pulse-slow"
>
<Activity className="w-4 h-4" />
<span>⚙️ Operational Blueprint</span>
</button>
<div className="bg-slate-955/80 border border-slate-800 rounded-xl px-4 py-2 text-right shrink-0 h-11 flex flex-col justify-center">
<div className="bg-slate-950/80 border border-slate-800 rounded-xl px-4 py-2 text-right shrink-0 h-11 flex flex-col justify-center">
<div className="text-[9px] text-slate-555 uppercase font-mono">Last Update</div>
<div className="font-mono text-xs text-slate-300">
{new Date(payload.timestamp).toLocaleTimeString()}
@@ -586,6 +596,7 @@ export default function MacroIndicatorsDemo() {
</div>
<MacroMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<MacroBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

30
components/modules/macro/MacroMathModal.tsx
View File

@@ -26,7 +26,7 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-5xl h-[85vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
@@ -70,13 +70,13 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Buffett Ratio Equation:</p>
<BlockMath math="\\text{Buffett Ratio} = \\frac{\\text{Wilshire 5000 Total Market Index}}{\\text{Gross Domestic Product}} \\approx \\frac{\\text{S\\&P 500} \\times 1000}{\\text{Gross Domestic Product}}" />
<BlockMath math="\text{Buffett Ratio} = \frac{\text{Wilshire 5000 Total Market Index}}{\text{Gross Domestic Product}} \approx \frac{\text{S\&P 500} \times 1000}{\text{Gross Domestic Product}}" />
<p className="text-[10px] text-slate-500 mt-3 font-mono leading-relaxed">
Where:
<br />
- <InlineMath math="\\text{Wilshire 5000 Total Market Index}" /> (originally FRED Series ID: 'WILL5000PR') represents the price performance of all active US equities. Due to the discontinuation of Wilshire series on FRED in June 2024, the S&P 500 index ('SP500') scaled by 1000 serves as the active proxy.
- <InlineMath math="\text{Wilshire 5000 Total Market Index}" /> (originally FRED Series ID: 'WILL5000PR') represents the price performance of all active US equities. Due to the discontinuation of Wilshire series on FRED in June 2024, the S&P 500 index ('SP500') scaled by 1000 serves as the active proxy.
<br />
- <InlineMath math="\\text{Gross Domestic Product}" /> is nominal US GDP (FRED Series ID: 'GDPA').
- <InlineMath math="\text{Gross Domestic Product}" /> is nominal US GDP (FRED Series ID: 'GDPA').
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
@@ -96,20 +96,20 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Net Liquidity Equation:</p>
<BlockMath math="\\text{Net Liquidity}_t = A_{\\text{Fed}, t} - \\text{TGA}_t - \\text{RRP}_t" />
<BlockMath math="\text{Net Fed Liquidity}_t = A_{\text{Fed}, t} - \text{TGA}_t - \text{RRP}_t" />
<p className="text-[10px] text-slate-500 mt-3 font-mono leading-relaxed">
Where:
<br />
- <InlineMath math="A_{\\text{Fed}, t}" /> represents Total Federal Reserve Assets (the asset side of the Fed Balance Sheet).
- <InlineMath math="A_{\text{Fed}, t}" /> represents Total Federal Reserve Assets (the asset side of the Fed Balance Sheet).
<br />
- <InlineMath math="\\text{TGA}_t" /> represents the Treasury General Account balance (the US Government's cash account held at the Federal Reserve).
- <InlineMath math="\text{TGA}_t" /> represents the Treasury General Account balance (the US Government's cash account held at the Federal Reserve).
<br />
- <InlineMath math="\\text{RRP}_t" /> represents the Reverse Repurchase Agreement facility usage volume (liquidity parked overnight by money market funds at the Fed).
- <InlineMath math="\text{RRP}_t" /> represents the Reverse Repurchase Agreement facility usage volume (liquidity parked overnight by money market funds at the Fed).
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
<strong className="text-indigo-300">Liquidity Dynamics:</strong>
An increase in <InlineMath math="A_{\\text{Fed}, t}" /> (Quantitative Easing) injects reserves into the banking system. Conversely, when the Treasury increases the <InlineMath math="\\text{TGA}" /> balance or when money market funds park cash in the <InlineMath math="\\text{RRP}" />, liquidity is drained from active circulation. A shrinking Net Liquidity Proxy acts as a powerful brake on risk assets (Equities & Cryptocurrencies), whereas expanding liquidity acts as a tailwind.
An increase in <InlineMath math="A_{\text{Fed}, t}" /> (Quantitative Easing) injects reserves into the banking system. Conversely, when the Treasury increases the <InlineMath math="\text{TGA}" /> balance or when money market funds park cash in the <InlineMath math="\text{RRP}" />, liquidity is drained from active circulation. A shrinking Net Fed Liquidity Proxy acts as a powerful brake on risk assets (Equities & Cryptocurrencies), whereas expanding liquidity acts as a tailwind.
</p>
</div>
</div>
@@ -125,7 +125,7 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">2S10S Spread Equation:</p>
<BlockMath math="\\text{Spread}_{2S10S} = Y_{10Y} - Y_{2Y}" />
<BlockMath math="\text{Spread}_{2S10S} = Y_{10Y} - Y_{2Y}" />
<p className="text-[10px] text-slate-500 mt-3 font-mono leading-relaxed">
Where:
<br />
@@ -135,7 +135,7 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
<strong className="text-indigo-300">Inversion & Un-Inversion:</strong> A negative spread (<InlineMath math="\\text{Spread}_{2S10S} < 0" />) represents an inverted yield curve, which has historically preceded US economic recessions. The "un-inversion" process, where the spread returns to positive territory, typically occurs during late-cycle phases or central bank pivot periods, signaling imminent macroeconomic contraction as short-term yields fall rapidly in anticipation of rate cuts.
<strong className="text-indigo-300">Inversion & Un-Inversion:</strong> A negative spread (<InlineMath math="\text{Spread}_{2S10S} < 0" />) represents an inverted yield curve, which has historically preceded US economic recessions. The "un-inversion" process, where the spread returns to positive territory, typically occurs during late-cycle phases or central bank pivot periods, signaling imminent macroeconomic contraction as short-term yields fall rapidly in anticipation of rate cuts.
</p>
</div>
</div>
@@ -151,13 +151,13 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Consumer Credit Distress Index (CDI):</p>
<BlockMath math="\\text{CDI}_t = \\frac{\\text{Credit Card Delinquency Rate}_t}{\\text{Personal Savings Rate}_t}" />
<BlockMath math="\text{CDI}_t = \frac{\text{Credit Card Delinquency Rate}_t}{\text{Personal Savings Rate}_t}" />
<p className="text-[10px] text-slate-500 mt-3 font-mono leading-relaxed">
Where:
<br />
- <InlineMath math="\\text{Credit Card Delinquency Rate}_t" /> measures the delinquency rate on credit card loans at top 100 commercial banks (FRED Series ID: 'DRCCLACBS').
- <InlineMath math="\text{Credit Card Delinquency Rate}_t" /> measures the delinquency rate on credit card loans at top 100 commercial banks (FRED Series ID: 'DRCCLACBS').
<br />
- <InlineMath math="\\text{Personal Savings Rate}_t" /> represents personal savings as a percentage of disposable personal income (FRED Series ID: 'PSAVERT').
- <InlineMath math="\text{Personal Savings Rate}_t" /> represents personal savings as a percentage of disposable personal income (FRED Series ID: 'PSAVERT').
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
@@ -182,7 +182,7 @@ export default function MacroMathModal({ isOpen, onClose }: MacroMathModalProps)
</div>
<div>
<strong className="text-indigo-300 block mb-1">II. Mortgage Applications Index Proxy [FRED: MORTGAGE30US]:</strong>
Tracks the weekly demand for residential purchase mortgages. Because direct MBA applications index data is proprietary, the system computes a mortgage application index proxy derived from the 30-Year Fixed Rate Mortgage Average: <InlineMath math="\\text{Mortgage Index Proxy} = \\frac{1000}{\\text{30-Year Mortgage Rate}}" />.
Tracks the weekly demand for residential purchase mortgages. Because direct MBA applications index data is proprietary, the system computes a mortgage application index proxy derived from the 30-Year Fixed Rate Mortgage Average: <InlineMath math="\text{Mortgage Index Proxy} = \frac{1000}{\text{30-Year Mortgage Rate}}" />.
</div>
<div>
<strong className="text-indigo-300 block mb-1">III. Case-Shiller Home Price Index [FRED: CSUSHPISA]:</strong>

92
components/modules/sandbox/SandboxBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,92 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface SandboxBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function SandboxBlueprintModal({ isOpen, onClose }: SandboxBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-violet-400 to-fuchsia-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-violet-400" /> Portfolio Sandbox - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Portfolio Optimization Controls</h3>
<p className="text-xs text-slate-400 mt-1">Operational specifications of the portfolio management sandbox cockpit.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-violet-400 uppercase tracking-wider font-mono">1. Kelly Sizing Controls</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Uses success probability inputs and payout odds ratios (average win size / average loss size) to calculate the theoretical optimal leverage size. Enforces a **Half-Kelly** safety buffer by scaling the target bet size by 0.5. This prevents severe downside variance and reduces capital depletion risk.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-violet-400 uppercase tracking-wider font-mono">2. Weight Calculations</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Computes the dynamic percentage allocation weights of individual portfolio holdings. It adjusts weights in real-time as asset prices fluctuate or shares are added/removed, ensuring capital exposure remains aligned with target limits.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Interface Actions &amp; Computes</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-violet-400 font-semibold">Asset Allocation Cockpit:</strong> Allows editing absolute stock quantities and purchasing prices. Computes the aggregate portfolio value, average cost basis, and dollar/percentage changes.
</p>
<p>
<strong className="text-violet-400 font-semibold">Synthetic Portfolio Return (Rpt):</strong> Aggregates historical daily log-returns of individual assets, weighted by current allocations, to chart the hypothetical historical equity curve of the combined portfolio.
</p>
<p>
<strong className="text-violet-400 font-semibold">Swamy-Arora Panel Solver:</strong> Executes a server-side Swamy-Arora random effects regression. Estimates the beta coefficients, residual errors, and variance parameters across panel data structures, allowing architects to model multi-asset risk dynamics.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

11
components/modules/sandbox/SandboxDemo.tsx
View File

@@ -7,6 +7,7 @@ import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContai
import 'katex/dist/katex.min.css';
import { BlockMath, InlineMath } from 'react-katex';
import SandboxMathModal from './SandboxMathModal';
import SandboxBlueprintModal from './SandboxBlueprintModal';
import {
TrendingUp, Wallet, ArrowDownRight, ArrowUpRight, Percent, Plus, FolderSync,
HelpCircle, Settings, Calendar, DollarSign, Tag, Check, AlertCircle, ChevronDown, ChevronUp, Sparkles,
@@ -59,6 +60,7 @@ export default function SandboxDemo() {
const [showMathAccordion, setShowMathAccordion] = useState(false);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [showMsciBenchmark, setShowMsciBenchmark] = useState(true);
// Kelly Position Sizing states
@@ -411,6 +413,14 @@ export default function SandboxDemo() {
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-3 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-emerald-400 justify-center h-[58px] shrink-0"
>
<Settings className="w-3.5 h-3.5" />
<span>⚙️ Operational Blueprint</span>
</button>
{/* Net Worth Card */}
<div className="flex-1 md:flex-initial bg-slate-950/80 border border-slate-800 rounded-xl p-3 px-5 min-w-[140px]">
<div className="text-[10px] text-slate-400 uppercase font-semibold">Total Value</div>
@@ -1356,6 +1366,7 @@ export default function SandboxDemo() {
</div>
<SandboxMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<SandboxBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

24
components/modules/sandbox/SandboxMathModal.tsx
View File

@@ -26,7 +26,7 @@ export default function SandboxMathModal({ isOpen, onClose }: SandboxMathModalPr
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
@@ -39,7 +39,7 @@ export default function SandboxMathModal({ isOpen, onClose }: SandboxMathModalPr
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-955/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
@@ -60,11 +60,11 @@ export default function SandboxMathModal({ isOpen, onClose }: SandboxMathModalPr
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div>
<p className="text-xs text-slate-400 mb-1">Active Percentage Weighting (<InlineMath math="w_i" />) Calculation:</p>
<BlockMath math="w_i = \\frac{\\text{Shares}_i \\times P_{\\text{current}, i}}{\\sum_{j} \\text{Shares}_j \\times P_{\\text{current}, j}}" />
<BlockMath math="w_i = \frac{\text{Shares}_i \times P_{\text{current}, i}}{\sum_{j} \text{Shares}_j \times P_{\text{current}, j}}" />
</div>
<div className="border-t border-slate-850 pt-3">
<p className="text-xs text-slate-400 mb-1">Synthetic Portfolio Log Return (<InlineMath math="R_{pt}" />):</p>
<BlockMath math="R_{pt} = \\sum_{i} w_i \\times \\ln\\left(\\frac{P_{t, i}}{P_{t-1, i}}\\right)" />
<BlockMath math="R_{pt} = \sum_{i} w_i \times \ln\left(\frac{P_{t, i}}{P_{t-1, i}}\right)" />
</div>
</div>
</div>
@@ -80,19 +80,19 @@ export default function SandboxMathModal({ isOpen, onClose }: SandboxMathModalPr
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2">
<div>
<p className="text-xs text-slate-400 mb-1">Panel Model Specification with VIX Controls:</p>
<BlockMath math="R_{ptj} = \\beta_0 + \\beta_{\\text{drift}} \\text{Pre}_t + \\beta_{\\text{impact}} \\text{Post}_t + \\beta_{\\text{VIX}} VIX_{tj} + u_j + e_{ptj}" />
<BlockMath math="R_{ptj} = \beta_0 + \beta_{\text{drift}} \text{Pre}_t + \beta_{\text{impact}} \text{Post}_t + \beta_{\text{VIX}} VIX_{tj} + u_j + e_{ptj}" />
<p className="text-[10px] text-slate-500 mt-2 font-mono leading-relaxed">
where:
<br />
- <InlineMath math="t \\in [-30, +30]" /> is the relative day offset from event date <InlineMath math="T_j" />.
- <InlineMath math="t \in [-30, +30]" /> is the relative day offset from event date <InlineMath math="T_j" />.
<br />
- <InlineMath math="\\text{Pre}_t = \\mathbb{I}(t < 0)" /> and <InlineMath math="\\text{Post}_t = \\mathbb{I}(t > 0)" /> are relative phase indicators.
- <InlineMath math="\text{Pre}_t = \mathbb{I}(t < 0)" /> and <InlineMath math="\text{Post}_t = \mathbb{I}(t > 0)" /> are relative phase indicators.
<br />
- <InlineMath math="VIX_{tj}" /> is the background market-wide volatility covariate.
<br />
- <InlineMath math="u_j \\sim N(0, \\sigma_u^2)" /> is the random group intercept (event instance shock).
- <InlineMath math="u_j \sim N(0, \sigma_u^2)" /> is the random group intercept (event instance shock).
<br />
- <InlineMath math="e_{ptj} \\sim N(0, \\sigma_e^2)" /> is the residual error.
- <InlineMath math="e_{ptj} \sim N(0, \sigma_e^2)" /> is the residual error.
</p>
</div>
</div>
@@ -109,7 +109,7 @@ export default function SandboxMathModal({ isOpen, onClose }: SandboxMathModalPr
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div>
<p className="text-xs text-slate-400 mb-1">Theoretical Kelly Fraction (<InlineMath math="f^*" />) Equation:</p>
<BlockMath math="f^* = \\frac{p \\cdot b - (1 - p)}{b}" />
<BlockMath math="f^* = \frac{p \cdot b - (1 - p)}{b}" />
<p className="text-[10px] text-slate-500 mt-2 font-mono leading-relaxed">
where:
<br />
@@ -120,9 +120,9 @@ export default function SandboxMathModal({ isOpen, onClose }: SandboxMathModalPr
</div>
<div className="border-t border-slate-850 pt-3">
<p className="text-xs text-slate-400 mb-1">Fractional Kelly (Half-Kelly) Safety Buffer:</p>
<BlockMath math="f_{\\text{applied}} = \\max\\left(0, 0.5 \\times f^*\\right)" />
<BlockMath math="f_{\text{applied}} = \max\left(0, 0.5 \times f^*\right)" />
<p className="text-xs text-slate-400 leading-relaxed mt-2">
To mitigate estimation variance and protect against catastrophic drawdown due to model error or fat-tailed market returns, the cockpit clips the suggested sizing to a **Half-Kelly** multiplier ($0.5$).
To mitigate estimation variance and protect against catastrophic drawdown due to model error or fat-tailed market returns, the cockpit clips the suggested sizing to a **Half-Kelly** multiplier (<InlineMath math="0.5" />).
</p>
</div>
</div>

99
components/modules/scanner/ScannerBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,99 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface ScannerBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function ScannerBlueprintModal({ isOpen, onClose }: ScannerBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-emerald-400 to-teal-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-emerald-400" /> Anomalies Scanner - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Scanner Metrics &amp; Signals</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of the anomaly scanner and valuation filters.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider font-mono">1. 52-Week Drop Mechanics</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Filters the stock database for liquid companies trading at significant percentage discounts relative to their 52-week peak. Isolates severe drawdowns caused by asymmetric market overreactions.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider font-mono">2. Welles Wilder RSI-14 Velocity</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Uses the smoothed Wilder Relative Strength Index to identify deep oversold thresholds (RSI &lt; 25). Momentum velocity measures standard deviation shocks in the indicator to forecast buy-exhaustion and selloff capitulations.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider font-mono">3. FMP Valuation Overlay</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Parses active valuation multiples: Price-to-Earnings (P/E), Price-to-Book (P/B), Dividend Yield, and Price/Earnings-to-Growth (PEG) ratios. Analyzes whether the selloff is justified fundamentally or is a dislocation from value.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">User Actions &amp; Interface Mechanics</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-emerald-400 font-semibold">Diagnostic Drawers:</strong> Clicking on any row in the scanner table opens an interactive drawer where you can analyze the drop catalyst: *Systemic Selloff, Supply Chain Disruption, Executive Shift, Regulatory Issue / Fine,* or *Earnings Miss*.
</p>
<p>
<strong className="text-emerald-400 font-semibold">GJR-GARCH Rebound Probability:</strong> The drawer displays a real-time rebound probability score. The GJR-GARCH model calculates conditional downside volatility, while the selected catalyst dynamically adjusts the rebound expectations based on historical asset-recovery statistics.
</p>
<p>
<strong className="text-emerald-400 font-semibold">Deep-Check Search Mask:</strong> Permits manual lookup of individual tickers. Ingests cash flow and balance sheet metrics from the backend API, displaying current Sloan ratios and GJR-GARCH conditional Value-at-Risk limits.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

13
components/modules/scanner/ScannerDemo.tsx
View File

@@ -7,6 +7,7 @@ import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContai
import 'katex/dist/katex.min.css';
import { BlockMath, InlineMath } from 'react-katex';
import ScannerMathModal from './ScannerMathModal';
import ScannerBlueprintModal from './ScannerBlueprintModal';
import {
ShieldAlert, Sparkles, RefreshCw, Flame, Search, Plus, Trash2,
ChevronDown, ChevronUp, AlertTriangle, CheckCircle2, XCircle, Info, Clock, Play,
@@ -48,6 +49,7 @@ export default function ScannerDemo() {
const [showMathAccordion, setShowMathAccordion] = useState(false);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [isShieldActive, setIsShieldActive] = useState(false);
// Cache for metadata and prices retrieved dynamically
@@ -344,7 +346,7 @@ export default function ScannerDemo() {
const renderCategoryTable = (title: string, description: string, assets: any[]) => {
return (
<div className="bg-slate-955/40 border border-slate-850 rounded-2xl p-5 space-y-3">
<div className="bg-slate-900/40 border border-slate-850 rounded-2xl p-5 space-y-3">
<div className="flex justify-between items-center border-b border-slate-900 pb-2">
<div>
<h4 className="font-bold text-white text-sm">{title}</h4>
@@ -586,6 +588,14 @@ export default function ScannerDemo() {
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-3 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-amber-400 justify-center animate-pulse-slow"
>
<Info className="w-3.5 h-3.5" />
<span>⚙️ Operational Blueprint</span>
</button>
<button
onClick={handleMarketScan}
disabled={scanning}
@@ -934,6 +944,7 @@ export default function ScannerDemo() {
</div>
<ScannerMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<ScannerBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

30
components/modules/scanner/ScannerMathModal.tsx
View File

@@ -26,7 +26,7 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
@@ -60,15 +60,15 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
Scans the entire corporate equity universe daily, segmenting equities into three distinct market capitalization classes to identify localized overreactions:
</p>
<div className="grid grid-cols-3 gap-3 text-[11px] text-slate-400 font-mono text-center">
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block font-bold text-slate-300">Mega Caps</span>
<span>&gt; $100B</span>
</div>
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block font-bold text-slate-300">Mid Caps</span>
<span>$10B - $100B</span>
</div>
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block font-bold text-slate-300">Small Caps</span>
<span>&lt; $10B</span>
</div>
@@ -80,21 +80,21 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
Calculates price distance ratios relative to support levels:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div>
<p className="text-xs text-slate-400 mb-1">1. 52-Week High Deviation:</p>
<BlockMath math="\\Delta_{52w} = \\frac{P_{\\text{current}} - P_{52w\\_high}}{P_{52w\\_high}}" />
<BlockMath math="\Delta_{52w} = \frac{P_{\text{current}} - P_{52w\_high}}{P_{52w\_high}}" />
</div>
<div>
<p className="text-xs text-slate-400 mb-1">2. 50-Day Moving Average Drop:</p>
<BlockMath math="\\Delta_{MA} = \\frac{P_{\\text{current}} - \\text{MA}_{50}}{\\text{MA}_{50}}" />
<BlockMath math="\Delta_{MA} = \frac{P_{\text{current}} - \text{MA}_{50}}{\text{MA}_{50}}" />
</div>
<div>
<p className="text-xs text-slate-400 mb-1">3. Relative Strength Index (RSI-14) with smoothing:</p>
<BlockMath math="\\text{RSI} = 100 - \\frac{100}{1 + \\text{RS}}" />
<BlockMath math="\\text{RS} = \\frac{\\text{Smoothed Gain}_t}{\\text{Smoothed Loss}_t}" />
<BlockMath math="\text{RSI} = 100 - \frac{100}{1 + \text{RS}}" />
<BlockMath math="\text{RS} = \frac{\text{Smoothed Gain}_t}{\text{Smoothed Loss}_t}" />
<p className="text-[11px] text-slate-500 mt-2 font-mono">
where smoothed elements use Welles Wilder alpha = 1/14. Deep oversold signals trigger at RSI &lt; 30.
where smoothed elements use Welles Wilder <InlineMath math="\alpha = 1/14" />. Deep oversold signals trigger at <InlineMath math="\text{RSI} < 30" />.
</p>
</div>
</div>
@@ -105,21 +105,21 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
To avoid value traps, technical drop factors are coupled with valuation metrics fetched in real-time from FMP:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<ul className="list-disc pl-5 text-xs text-slate-400 space-y-2 font-mono">
<li><strong>Trailing P/E</strong>: Measures the price relative to trailing 12-month earnings.</li>
<li><strong>Price-to-Book</strong>: Measures the asset backing relative to equity capital.</li>
<li><strong>Dividend Yield (%)</strong>: Tangible dividend payouts to measure cash backflow support.</li>
<li><strong>PEG Ratio</strong>: Relates PE multiple to annual earnings growth:
<BlockMath math="\\text{PEG} = \\frac{\\text{PE Ratio}}{\\text{Earnings Growth Rate} \\times 100}" />
<BlockMath math="\text{PEG} = \frac{\text{PE Ratio}}{\text{Earnings Growth Rate} \times 100}" />
</li>
</ul>
<div className="border-t border-slate-850 pt-3">
<p className="text-xs text-slate-400 mb-1">Implicit Forward P/E calculation from PEG relationship:</p>
<BlockMath math="\\text{Forward PE} = \\frac{\\text{Trailing PE}}{1 + g_{\\text{implicit}}}" />
<BlockMath math="g_{\\text{implicit}} = \\frac{\\text{Trailing PE}}{\\text{PEG} \\times 100}" />
<BlockMath math="\text{Forward PE} = \frac{\text{Trailing PE}}{1 + g_{\text{implicit}}}" />
<BlockMath math="g_{\text{implicit}} = \frac{\text{Trailing PE}}{\text{PEG} \times 100}" />
<p className="text-[11px] text-slate-500 mt-2 font-mono">
If PEG is unavailable, a default growth rate of 10% is assumed as a conservative fallback baseline.
If PEG is unavailable, a default growth rate of <InlineMath math="10\%" /> is assumed as a conservative fallback baseline.
</p>
</div>
</div>

29
components/modules/tech/AiSpecialSilo.tsx
View File

@@ -4,6 +4,7 @@ import React, { useState, useEffect } from 'react';
import { LineChart, Line, ResponsiveContainer } from 'recharts';
import 'katex/dist/katex.min.css';
import TechMathModal from './TechMathModal';
import TechBlueprintModal from './TechBlueprintModal';
import {
Cpu, AlertCircle, BookOpen, Activity, Zap, TrendingUp, TrendingDown,
ArrowUpRight, ArrowDownRight, Minus, Server, Wallet
@@ -89,7 +90,9 @@ export default function AiSpecialSilo() {
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [payload, setPayload] = useState<Payload | null>(null);
const [activeTab, setActiveTab] = useState<'matrix' | 'supply_chain'>('matrix');
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [isShieldActive, setIsShieldActive] = useState(false);
useEffect(() => {
@@ -230,13 +233,21 @@ export default function AiSpecialSilo() {
<div className="flex items-center gap-3 w-full md:w-auto justify-end">
<button
onClick={() => setIsMathModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-955/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-teal-400 w-full md:w-auto justify-center h-11 cursor-pointer"
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-teal-400 w-full md:w-auto justify-center h-11 cursor-pointer"
>
<BookOpen className="w-4 h-4" />
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-teal-400 w-full md:w-auto justify-center h-11 cursor-pointer animate-pulse-slow"
>
<Cpu className="w-4 h-4" />
<span>⚙️ Operational Blueprint</span>
</button>
<div className="bg-slate-955/80 border border-slate-800 rounded-xl px-4 py-2 text-right shrink-0 h-11 flex flex-col justify-center">
<div className="bg-slate-950/80 border border-slate-800 rounded-xl px-4 py-2 text-right shrink-0 h-11 flex flex-col justify-center">
<div className="text-[9px] text-slate-500 uppercase font-mono">Archive State</div>
<div className="font-mono text-xs text-slate-300">
{new Date(payload.timestamp).toLocaleTimeString()}
@@ -418,7 +429,7 @@ export default function AiSpecialSilo() {
: '#f43f5e';
return (
<div key={ticker} className="bg-slate-950/40 border border-slate-850 rounded-xl p-3 flex justify-between items-center hover:bg-slate-955/60 transition-colors">
<div key={ticker} className="bg-slate-950/40 border border-slate-850 rounded-xl p-3 flex justify-between items-center hover:bg-slate-900/60 transition-colors">
<div className="space-y-0.5 w-1/4">
<div className="text-xs font-bold text-slate-200">{ticker}</div>
<div className="text-[9px] text-slate-500 font-mono">
@@ -483,7 +494,7 @@ export default function AiSpecialSilo() {
: '#10b981';
return (
<div key={ticker} className="bg-slate-955/40 border border-slate-850 rounded-xl p-3 flex justify-between items-center hover:bg-slate-955/60 transition-colors">
<div key={ticker} className="bg-slate-950/40 border border-slate-850 rounded-xl p-3 flex justify-between items-center hover:bg-slate-900/60 transition-colors">
<div className="space-y-0.5 w-1/4">
<div className="text-xs font-bold text-slate-200">{ticker}</div>
<div className="text-[9px] text-slate-500 font-mono">
@@ -543,7 +554,7 @@ export default function AiSpecialSilo() {
: '#10b981';
return (
<div key={ticker} className="bg-slate-955/40 border border-slate-850 rounded-xl p-3 flex justify-between items-center hover:bg-slate-955/60 transition-colors">
<div key={ticker} className="bg-slate-950/40 border border-slate-850 rounded-xl p-3 flex justify-between items-center hover:bg-slate-900/60 transition-colors">
<div className="space-y-0.5 w-1/4">
<div className="text-xs font-bold text-slate-200">{ticker}</div>
<div className="text-[9px] text-slate-500 font-mono">
@@ -592,7 +603,7 @@ export default function AiSpecialSilo() {
</p>
</div>
<div className="flex items-center gap-4 text-xs font-mono text-slate-400 bg-slate-955/80 border border-slate-850 px-3 py-1.5 rounded-xl">
<div className="flex items-center gap-4 text-xs font-mono text-slate-400 bg-slate-900/80 border border-slate-850 px-3 py-1.5 rounded-xl">
<div>
NVDA Inventory: <span className="text-slate-200 font-semibold">{supplyChain.data[supplyChain.data.length - 1].aggregateObligations / 1000}B$</span>
</div>
@@ -629,7 +640,7 @@ export default function AiSpecialSilo() {
: 'text-emerald-400';
return (
<tr key={row.quarter} className="hover:bg-slate-955/20 transition-colors">
<tr key={row.quarter} className="hover:bg-slate-900/20 transition-colors">
<td className="py-3 font-semibold text-slate-300">{row.quarter}</td>
<td className="py-3 text-right text-slate-300">{row.nvdaInvTurnover.toFixed(2)}x</td>
<td className="py-3 text-right text-slate-355">{(row.aggregateObligations / 1000).toFixed(1)}B$</td>
@@ -648,6 +659,10 @@ export default function AiSpecialSilo() {
isOpen={isMathModalOpen}
onClose={() => setIsMathModalOpen(false)}
/>
<TechBlueprintModal
isOpen={isBlueprintModalOpen}
onClose={() => setIsBlueprintModalOpen(false)}
/>
</div>
);

96
components/modules/tech/TechBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,96 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface TechBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function TechBlueprintModal({ isOpen, onClose }: TechBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-355">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-teal-400 to-indigo-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-teal-400" /> AI &amp; Tech Silo - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">CapEx Cycle &amp; Infrastructure Indicators</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of tech overcapacity diagnosis.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-teal-400 uppercase tracking-wider font-mono">1. Monetization Gap &amp; ROI-to-CapEx</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Monitors segment revenues (e.g. Azure, AWS, Google Cloud, Meta Family of Apps) against capital spending growth. A negative monetization gap signals segment revenues are growing slower than capital investments. A collapsing ROI-to-CapEx ratio highlights write-down risks.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-teal-400 uppercase tracking-wider font-mono">2. Supply-Chain Velocity Index</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Compares cloud buyers' future purchase obligations (disclosed in notes of 10-Q reports) against Nvidia's spot inventory turnover speeds. A collapsing velocity index indicates buyers are cutting back forward purchase commitments relative to hardware supplier stockpiles.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-teal-400 uppercase tracking-wider font-mono">3. Cluster Leverage (D/E &amp; CapEx/Dep)</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Monitors CapEx-to-depreciation ratios (ratios &gt; 3x indicate hyper-aggressive server capacity additions) alongside Debt-to-Equity changes to assess whether the AI cluster construction is funded by leverage, exposing firms to massive future amortization drag.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Interface Layout &amp; Mechanics</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-teal-400 font-semibold">Sloan Accrual Card &amp; Indicators:</strong> Integrates the Sloan Ratio indicator at the top of the silo dashboard, classifying reported revenues into Safe or Anomaly regimes.
</p>
<p>
<strong className="text-teal-400 font-semibold">Silo Dashboard Sparklines:</strong> Displays quarterly trajectories for MSFT, GOOGL, META, AMZN, and AMD segment revenue and capital growth rates.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

78
components/modules/tech/TechMathModal.tsx
View File

@@ -26,7 +26,7 @@ export default function TechMathModal({ isOpen, onClose }: TechMathModalProps) {
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-5xl h-[85vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
@@ -67,28 +67,28 @@ export default function TechMathModal({ isOpen, onClose }: TechMathModalProps) {
<p className="text-xs leading-relaxed text-slate-400">
When technology companies deploy huge amounts of capital for AI clusters and computing nodes, standard revenue metrics may hide margin pressure. The Monetization Gap and ROI-to-CapEx metrics track this by isolating the growth of targeted cloud/AI segments against the velocity of capital investments:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div className="bg-slate-900/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">
{"Formula for Monetization Gap (\\(G_{\\text{monetization}}\\)):"}
{"Formula for Monetization Gap ("}<InlineMath math="G_{\text{monetization}}" />{"):"}
</p>
<BlockMath math="G_{\\text{monetization}, i, t} = \\Delta \\text{Rev}_{\\text{segment}, i, t} - \\Delta \\text{CapEx}_{i, t}" />
<BlockMath math="G_{\text{monetization}, i, t} = \Delta \text{Rev}_{\text{segment}, i, t} - \Delta \text{CapEx}_{i, t}" />
<p className="text-xs text-slate-300 my-2 font-semibold">
{"Formula for ROI-to-CapEx Ratio (\\(R_{\\text{ROI}}\\)):"}
{"Formula for ROI-to-CapEx Ratio ("}<InlineMath math="R_{\text{ROI}}" />{"):"}
</p>
<BlockMath math="R_{\\text{ROI}, i, t} = \\frac{\\text{Rev}_{\\text{segment}, i, t} - \\text{Rev}_{\\text{segment}, i, t-1}}{\\text{CapEx}_{i, t}} \\times 100" />
<BlockMath math="R_{\text{ROI}, i, t} = \frac{\text{Rev}_{\text{segment}, i, t} - \text{Rev}_{\text{segment}, i, t-1}}{\text{CapEx}_{i, t}} \times 100" />
<p className="text-[10px] text-slate-500 mt-3 font-mono leading-relaxed">
{"Where:"}
<br />
{"- "}<InlineMath math="\\Delta \\text{Rev}_{\\text{segment}, i, t}" />{" is the quarter-over-quarter percentage growth rate of isolated Cloud/Segment revenue (e.g., Azure for MSFT, Google Cloud for GOOGL, Data Center for NVDA/AMD, Family of Apps for META)."}
{"- "}<InlineMath math="\Delta \text{Rev}_{\text{segment}, i, t}" />{" is the quarter-over-quarter percentage growth rate of isolated Cloud/Segment revenue (e.g., Azure for MSFT, Google Cloud for GOOGL, Data Center for NVDA/AMD, Family of Apps for META)."}
<br />
{"- "}<InlineMath math="\\Delta \\text{CapEx}_{i, t}" />{" is the quarter-over-quarter percentage growth rate of Capital Expenditures."}
{"- "}<InlineMath math="\Delta \text{CapEx}_{i, t}" />{" is the quarter-over-quarter percentage growth rate of Capital Expenditures."}
<br />
{"- "}<InlineMath math="\\text{CapEx}_{i, t}" />{" is the absolute quarterly capital expenditure of the firm in millions."}
{"- "}<InlineMath math="\text{CapEx}_{i, t}" />{" is the absolute quarterly capital expenditure of the firm in millions."}
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
<strong className="text-teal-300">Strategic Rationale:</strong>{" A negative Monetization Gap (\\(G_{\\text{monetization}} < 0\\)) indicates that capital spending is growing faster than segment monetization, suggesting diminishing marginal returns. A collapsing ROI-to-CapEx ratio signals that the capital investment is failing to spark immediate segment growth, leading to eventual asset write-downs."}
<strong className="text-teal-300">Strategic Rationale:</strong>{" A negative Monetization Gap ("}<InlineMath math="G_{\text{monetization}} < 0" />{") indicates that capital spending is growing faster than segment monetization, suggesting diminishing marginal returns. A collapsing "}<InlineMath math="R_{\text{ROI}}" />{" ratio signals that the capital investment is failing to spark immediate segment growth, leading to eventual asset write-downs."}
</p>
</div>
</div>
@@ -101,22 +101,22 @@ export default function TechMathModal({ isOpen, onClose }: TechMathModalProps) {
<p className="text-xs leading-relaxed text-slate-400">
Supply-chain stress is a reliable leading indicator of demand contraction. We monitor the relationship between the key hardware supplier (Nvidia) and the primary cloud buyers (MSFT, GOOGL, META) by comparing buyers' future purchase commitments with the supplier's inventory speeds:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div className="bg-slate-900/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Nvidia Inventory Turnover (Annualized):</p>
<BlockMath math="\\text{Turnover}_{\\text{NVDA}, t} = \\frac{\\text{COGS}_{\\text{NVDA}, t}}{\\text{Inventory}_{\\text{NVDA}, t}} \\times 4" />
<BlockMath math="\text{Turnover}_{\text{NVDA}, t} = \frac{\text{COGS}_{\text{NVDA}, t}}{\text{Inventory}_{\text{NVDA}, t}} \times 4" />
<p className="text-xs text-slate-300 my-2 font-semibold">
{"Supply-Chain Velocity Index (\\(V_{\\text{sc}}\\)):"}
{"Supply-Chain Velocity Index ("}<InlineMath math="V_{\text{sc}}" />{"):"}
</p>
<BlockMath math="V_{\\text{sc}, t} = \\frac{\\sum_{j \\in \\text{Buyers}} \\text{Purchase Obligations}_{j, t}}{\\text{Inventory}_{\\text{NVDA}, t}}" />
<BlockMath math="V_{\text{sc}, t} = \frac{\sum_{j \in \text{Buyers}} \text{Purchase Obligations}_{j, t}}{\text{Inventory}_{\text{NVDA}, t}}" />
<p className="text-[10px] text-slate-555 mt-3 font-mono leading-relaxed">
{"Where:"}
<br />
{"- "}<InlineMath math="\\text{COGS}_{\\text{NVDA}, t}" />{" is Nvidia's quarterly Cost of Goods Sold."}
{"- "}<InlineMath math="\text{COGS}_{\text{NVDA}, t}" />{" is Nvidia's quarterly Cost of Goods Sold."}
<br />
{"- "}<InlineMath math="\\text{Inventory}_{\\text{NVDA}, t}" />{" is Nvidia's total inventory value on its balance sheet."}
{"- "}<InlineMath math="\text{Inventory}_{\text{NVDA}, t}" />{" is Nvidia's total inventory value on its balance sheet."}
<br />
{"- "}<InlineMath math="\\text{Purchase Obligations}_{j, t}" />{" represents the forward purchase commitments disclosed in the notes of 10-Q filing reports by the buyers (MSFT, GOOGL, META)."}
{"- "}<InlineMath math="\text{Purchase Obligations}_{j, t}" />{" represents the forward purchase commitments disclosed in the notes of 10-Q filing reports by the buyers (MSFT, GOOGL, META)."}
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
@@ -133,20 +133,20 @@ export default function TechMathModal({ isOpen, onClose }: TechMathModalProps) {
<p className="text-xs leading-relaxed text-slate-400">
Aggressive cluster construction requires significant debt or capital consumption. We measure the balance sheet risk of massive computing nodes using the Debt-to-Equity (D/E) and CapEx-to-Depreciation ratios:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div className="bg-slate-900/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Debt-to-Equity Shift Ratio:</p>
<BlockMath math="\\text{D/E}_{i, t} = \\frac{\\text{Total Debt}_{i, t}}{\\text{Shareholders' Equity}_{i, t}}" />
<BlockMath math="\text{D/E}_{i, t} = \frac{\text{Total Debt}_{i, t}}{\text{Shareholders' Equity}_{i, t}}" />
<p className="text-xs text-slate-300 my-2 font-semibold">
{"CapEx-to-Depreciation Ratio (\\(R_{\\text{capex-dep}}\\)):"}
{"CapEx-to-Depreciation Ratio ("}<InlineMath math="R_{\text{capex-dep}}" />{"):"}
</p>
<BlockMath math="R_{\\text{capex-dep}, i, t} = \\frac{\\text{CapEx}_{i, t}}{\\text{Depreciation}_{i, t}}" />
<BlockMath math="R_{\text{capex-dep}, i, t} = \frac{\text{CapEx}_{i, t}}{\text{Depreciation}_{i, t}}" />
<p className="text-[10px] text-slate-555 mt-3 font-mono leading-relaxed">
{"Where:"}
<br />
{"- "}<InlineMath math="\\text{Total Debt}_{i, t}" />{" represents short-term and long-term interest-bearing debt."}
{"- "}<InlineMath math="\text{Total Debt}_{i, t}" />{" represents short-term and long-term interest-bearing debt."}
<br />
{"- "}<InlineMath math="\\text{Depreciation}_{i, t}" />{" represents the quarterly depreciation expense, reflecting the wear-and-tear of existing physical server arrays."}
{"- "}<InlineMath math="\text{Depreciation}_{i, t}" />{" represents the quarterly depreciation expense, reflecting the wear-and-tear of existing physical server arrays."}
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
@@ -163,24 +163,24 @@ export default function TechMathModal({ isOpen, onClose }: TechMathModalProps) {
<p className="text-xs leading-relaxed text-slate-400">
Investment hyper-leverage creates systematic feedback loops in equity markets. We model the amplification of tech sector risk (asymmetric beta expansion) using a non-linear scaling model:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div className="bg-slate-900/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Systemic Tech Beta Model:</p>
<BlockMath math="\\beta_{\\text{tech}, t} = \\beta_{0} \\times \\left(1 + \\gamma \\times \\frac{\\sum_{i} \\text{CapEx}_{i, t}}{\\sum_{i} \\text{Depreciation}_{i, t}}\\right) \\times e^{\\lambda \\times (1 - V_{\\text{sc}, t})}" />
<BlockMath math="\beta_{\text{tech}, t} = \beta_{0} \times \left(1 + \gamma \times \frac{\sum_{i} \text{CapEx}_{i, t}}{\sum_{i} \text{Depreciation}_{i, t}}\right) \times e^{\lambda \times (1 - V_{\text{sc}, t})}" />
<p className="text-[10px] text-slate-555 mt-3 font-mono leading-relaxed">
{"Where:"}
<br />
{"- "}<InlineMath math="\\beta_{0}" />{" is the baseline systematic tech beta (historically ~1.10)."}
{"- "}<InlineMath math="\beta_{0}" />{" is the baseline systematic tech beta (historically ~1.10)."}
<br />
{"- "}<InlineMath math="\\gamma" />{" represents the investment intensity multiplier (e.g. 0.05)."}
{"- "}<InlineMath math="\gamma" />{" represents the investment intensity multiplier (e.g. 0.05)."}
<br />
{"- "}<InlineMath math="\\lambda" />{" represents the supply-chain velocity damping constant (e.g. 0.12)."}
{"- "}<InlineMath math="\lambda" />{" represents the supply-chain velocity damping constant (e.g. 0.12)."}
<br />
{"- "}<InlineMath math="V_{\\text{sc}, t}" />{" is the Supply-Chain Velocity Index calculated in Section 2."}
{"- "}<InlineMath math="V_{\text{sc}, t}" />{" is the Supply-Chain Velocity Index calculated in Section 2."}
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
<strong className="text-teal-300">Economic Rationale:</strong>{" This equation demonstrates that tech equity risk is not static. As CapEx outstrips depreciation (building massive infrastructure) and the Supply-Chain Velocity Index collapses (build-up of unsellable inventory), the systemic beta "}<InlineMath math="\\beta_{\\text{tech}, t}" />{" expands exponentially. Under these parameters, any minor disappointment in earnings results in an asymmetric downward repricing."}
<strong className="text-teal-300">Economic Rationale:</strong>{" This equation demonstrates that tech equity risk is not static. As CapEx outstrips depreciation (building massive infrastructure) and the Supply-Chain Velocity Index collapses (build-up of unsellable inventory), the systemic beta "}<InlineMath math="\beta_{\text{tech}, t}" />{" expands exponentially. Under these parameters, any minor disappointment in earnings results in an asymmetric downward repricing."}
</p>
</div>
</div>
@@ -193,26 +193,26 @@ export default function TechMathModal({ isOpen, onClose }: TechMathModalProps) {
<p className="text-xs leading-relaxed text-slate-400">
The Sloan Ratio identifies discrepancies between reported net income and actual cash flows. A high proportion of non-cash accruals signals low earnings quality and is a historically proven accounting anomaly predictor:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div className="bg-slate-900/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">
{"Formula for Accruals (\\(\\text{Accruals}\\)):"}
{"Formula for Accruals ("}<InlineMath math="\text{Accruals}" />{"):"}
</p>
<BlockMath math="\\text{Accruals}_{t} = \\text{Net Income}_{t} - (\\text{CFO}_{t} + \\text{CFI}_{t})" />
<BlockMath math="\text{Accruals}_{t} = \text{Net Income}_{t} - (\text{CFO}_{t} + \text{CFI}_{t})" />
<p className="text-xs text-slate-300 my-2 font-semibold">
{"Formula for Sloan Ratio (\\(\\text{Sloan Ratio}\\)):"}
{"Formula for Sloan Ratio ("}<InlineMath math="\text{Sloan Ratio}" />{"):"}
</p>
<BlockMath math="\\text{Sloan Ratio}_{t} = \\frac{\\text{Accruals}_{t}}{\\text{Total Assets}_{t}} \\times 100" />
<BlockMath math="\text{Sloan Ratio}_{t} = \frac{\text{Accruals}_{t}}{\text{Total Assets}_{t}} \times 100" />
<p className="text-[10px] text-slate-555 mt-3 font-mono leading-relaxed">
{"Where:"}
<br />
{"- "}<InlineMath math="\\text{Net Income}_{t}" />{" is the company's net income for the fiscal period."}
{"- "}<InlineMath math="\text{Net Income}_{t}" />{" is the company's net income for the fiscal period."}
<br />
{"- "}<InlineMath math="\\text{CFO}_{t}" />{" is Cash Flow from Operations (operating cash flow)."}
{"- "}<InlineMath math="\text{CFO}_{t}" />{" is Cash Flow from Operations (operating cash flow)."}
<br />
{"- "}<InlineMath math="\\text{CFI}_{t}" />{" is Cash Flow from Investing activities."}
{"- "}<InlineMath math="\text{CFI}_{t}" />{" is Cash Flow from Investing activities."}
<br />
{"- "}<InlineMath math="\\text{Total Assets}_{t}" />{" is the total assets reported on the balance sheet at the end of the period."}
{"- "}<InlineMath math="\text{Total Assets}_{t}" />{" is the total assets reported on the balance sheet at the end of the period."}
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">

106
components/modules/whale/WhaleBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,106 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface WhaleBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function WhaleBlueprintModal({ isOpen, onClose }: WhaleBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-sky-400 to-blue-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-sky-400" /> Whale Satellites - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Whale Ingestion &amp; Filters</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of boutique manager tracking and conviction scoring.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-sky-400 uppercase tracking-wider font-mono">1. Boutique Manager Filter</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
The universe is restricted to active boutique investment firms holding between $100M and $5B in Assets Under Management (AUM), exhibiting an Active Share exceeding 80%. This excludes large index-trackers and highlights alpha-generating concentrated stock pickers.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-sky-400 uppercase tracking-wider font-mono">2. Concentration Index (CI)</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Prioritizes portfolios where the top 10 holdings represent more than 50% of the total reported holdings value. This ensures that the positions tracked reflect high-conviction ideas where managers are willing to expose significant capital.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-sky-400 uppercase tracking-wider font-mono">3. Velocity of Conviction (VoC)</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Measures the quarterly change in portfolio weighting for each asset. It isolates managers' active additions or liquidations ($\Delta W_i$), sorting the dashboard holdings strictly by positive conviction velocity to find accumulating trends.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-sky-400 uppercase tracking-wider font-mono">4. 13F Filing Lag Warning</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Form 13F filings are submitted up to 45 days after the end of the calendar quarter. The system displays these shifts as lagging indicators and overlays them with volume markers to confirm whether the manager is still actively buying.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">Interface Layout &amp; Mechanics</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-sky-400 font-semibold">Whale Profile Cards:</strong> The left sidebar allows selecting the active boutique manager (e.g. Scion Asset Management, Akre Capital, Mairs &amp; Power). Displays their current AUM, Concentration index, and top holdings size.
</p>
<p>
<strong className="text-sky-400 font-semibold">Transactions Ledger:</strong> The right table shows the selected manager's quarterly additions and reductions. Shows security names, tickers, shares held, reported values, portfolio weights, and calculated VoC deltas.
</p>
<p>
<strong className="text-sky-400 font-semibold">DEV_MODE Offline Protection:</strong> When offline, the `/api/whale/screener` endpoint bypasses SEC EDGAR connections and returns stored mock files, indicating isShieldActive: true.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

26
components/modules/whale/WhaleMathModal.tsx
View File

@@ -26,8 +26,8 @@ export default function WhaleMathModal({ isOpen, onClose }: WhaleMathModalProps)
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-5xl h-[85vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-5xl h-[85vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-355">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/50 border-b border-slate-800/80">
@@ -50,7 +50,7 @@ export default function WhaleMathModal({ isOpen, onClose }: WhaleMathModalProps)
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-300 scrollbar-thin">
{/* Executive Overview */}
<div className="bg-slate-955/30 rounded-2xl p-5 border border-slate-850 space-y-2">
<div className="bg-slate-950/30 rounded-2xl p-5 border border-slate-850 space-y-2">
<h3 className="text-sm font-bold text-slate-100 flex items-center gap-2">
<ShieldAlert className="w-4 h-4 text-blue-400" /> Executive Overview
</h3>
@@ -67,10 +67,10 @@ export default function WhaleMathModal({ isOpen, onClose }: WhaleMathModalProps)
<p className="text-xs leading-relaxed text-slate-400">
Institutional investment managers with over $100 million in Assets Under Management (AUM) are legally mandated by the SEC to submit Form 13F within 45 days after the end of each calendar quarter. This lag presents a structural challenge for quantitative models, as holdings data represents historical positions:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 text-xs space-y-3 text-slate-400 leading-relaxed">
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 my-2 text-xs space-y-3 text-slate-400 leading-relaxed">
<div>
<strong className="text-blue-300 block mb-1">I. Retrospective Analysis:</strong>
Positions disclosed on day \(T + 45\) reflect the portfolio state at day \(T\). As a result, short-term momentum models cannot directly trade 13F filings.
Positions disclosed on day <InlineMath math="T + 45" /> reflect the portfolio state at day <InlineMath math="T" />. As a result, short-term momentum models cannot directly trade 13F filings.
</div>
<div>
<strong className="text-blue-300 block mb-1">II. Informational Asymmetry:</strong>
@@ -87,26 +87,26 @@ export default function WhaleMathModal({ isOpen, onClose }: WhaleMathModalProps)
<p className="text-xs leading-relaxed text-slate-400">
Rather than tracking the absolute number of shares bought or sold, the screener measures changes in the relative portfolio weight of each asset. This normalizes for AUM changes caused by overall market movements:
</p>
<div className="bg-slate-955/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div className="bg-slate-950/40 p-5 rounded-2xl border border-slate-850 my-2 space-y-4">
<div>
<p className="text-xs text-slate-300 mb-2 font-semibold">Velocity of Conviction (VoC) Delta:</p>
<BlockMath math="\\text{VoC}_{i} = w_{i, t} - w_{i, t-1}" />
<BlockMath math="\text{VoC}_{i} = w_{i, t} - w_{i, t-1}" />
<p className="text-xs text-slate-300 my-2 font-semibold">Asset Portfolio Weight Calculation:</p>
<BlockMath math="w_{i, t} = \\frac{V_{i, t}}{\\sum_{j} V_{j, t}} \\times 100" />
<BlockMath math="w_{i, t} = \frac{V_{i, t}}{\sum_{j} V_{j, t}} \times 100" />
<p className="text-[10px] text-slate-500 mt-3 font-mono leading-relaxed">
Where:
<br />
- <InlineMath math="w_{i, t}" /> is the portfolio weight of asset \(i\) at the end of the current quarter \(t\) (expressed as a percentage).
- <InlineMath math="w_{i, t}" /> is the portfolio weight of asset <InlineMath math="i" /> at the end of the current quarter <InlineMath math="t" /> (expressed as a percentage).
<br />
- <InlineMath math="w_{i, t-1}" /> is the portfolio weight of asset \(i\) at the end of the previous quarter \(t-1\).
- <InlineMath math="w_{i, t-1}" /> is the portfolio weight of asset <InlineMath math="i" /> at the end of the previous quarter <InlineMath math="t-1" />.
<br />
- <InlineMath math="V_{i, t}" /> is the market value of the position in asset \(i\) as reported in the 13F filing for quarter \(t\).
- <InlineMath math="V_{i, t}" /> is the market value of the position in asset <InlineMath math="i" /> as reported in the 13F filing for quarter <InlineMath math="t" />.
<br />
- <InlineMath math="\\sum_{j} V_{j, t}" /> represents the total market value of all reported equity holdings in the filing for quarter \(t\) (AUM proxy).
- <InlineMath math="\sum_{j} V_{j, t}" /> represents the total market value of all reported equity holdings in the filing for quarter <InlineMath math="t" /> (AUM proxy).
</p>
</div>
<p className="text-xs leading-relaxed text-slate-400">
<strong className="text-blue-300">Strategic Rationale:</strong> A positive VoC delta {"\\(\\text{VoC}_i > 0\\)"} indicates that the manager has actively allocated capital to the asset relative to other holdings, suggesting high-conviction buying. Conversely, a negative delta {"\\(\\text{VoC}_i < 0\\)"} indicates relative allocation decreases, showing active selling or profit-taking.
<strong className="text-blue-300">Strategic Rationale:</strong> A positive VoC delta <InlineMath math="\text{VoC}_i > 0" /> indicates that the manager has actively allocated capital to the asset relative to other holdings, suggesting high-conviction buying. Conversely, a negative delta <InlineMath math="\text{VoC}_i < 0" /> indicates relative allocation decreases, showing active selling or profit-taking.
</p>
</div>
</div>

15
components/modules/whale/WhaleScreener.tsx
View File

@@ -2,6 +2,7 @@
import React, { useState, useEffect } from 'react';
import WhaleMathModal from './WhaleMathModal';
import WhaleBlueprintModal from './WhaleBlueprintModal';
import {
Compass, ArrowUpRight, ArrowDownRight, Minus, BookOpen, AlertCircle, RefreshCw, Layers, DollarSign, Calendar, TrendingUp
} from 'lucide-react';
@@ -33,6 +34,7 @@ export default function WhaleScreener() {
const [positions, setPositions] = useState<PositionDelta[]>([]);
const [isShieldActive, setIsShieldActive] = useState(false);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [refreshKey, setRefreshKey] = useState(0);
useEffect(() => {
@@ -123,18 +125,26 @@ export default function WhaleScreener() {
<div className="flex items-center gap-3 w-full md:w-auto justify-end">
<button
onClick={() => setRefreshKey(prev => prev + 1)}
className="flex items-center justify-center p-2.5 rounded-xl bg-slate-955/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all text-slate-400 hover:text-slate-200 h-11 w-11 cursor-pointer"
className="flex items-center justify-center p-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all text-slate-400 hover:text-slate-200 h-11 w-11 cursor-pointer"
title="Refresh holdings"
>
<RefreshCw className="w-4 h-4" />
</button>
<button
onClick={() => setIsMathModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-955/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-blue-400 w-full md:w-auto justify-center h-11 cursor-pointer"
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-blue-400 w-full md:w-auto justify-center h-11 cursor-pointer"
>
<BookOpen className="w-4 h-4" />
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-2.5 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-blue-400 w-full md:w-auto justify-center h-11 cursor-pointer animate-pulse-slow"
>
<Compass className="w-4 h-4" />
<span>⚙️ Operational Blueprint</span>
</button>
</div>
</div>
</div>
@@ -259,6 +269,7 @@ export default function WhaleScreener() {
</div>
<WhaleMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<WhaleBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}