{open && options && (
<>
setOpen(false)} style={{ position: "fixed", inset: 0, zIndex: 19 }} />
{options.map(opt => (
))}
)}
);
};
const ToggleChip = ({ label, on, onClick, icon }) => (
);
const ModelCard = ({ m, onOpen }) => (
e.currentTarget.style.boxShadow = "var(--shadow-md), inset 0 0 0 1px var(--orange)"}
onMouseLeave={e => e.currentTarget.style.boxShadow = ""}
>
{m.featured &&
Demo flagship}
{m.task}
{m.size}
{m.license}
{window.hwLabelFull ? window.hwLabelFull(m.id) : "1× H100 80GB"}
{modelCarbonFR(m.id)} g/Mtok
{m.downloads}
{m.likes}
{m.updated}
EU deployable
View details
);
// ============ Screen 2: Model Detail ============
const DetailScreen = () => {
const { go, modelId } = useNav();
const m = MODELS.find(x => x.id === modelId) || MODELS[0];
const hw = window.hwFor ? window.hwFor(m.id) : { costPerH: 2.40 };
const [tab, setTab] = useState1("overview");
return (
{/* Left col */}
{m.name}
{m.task}
{m.size}
{m.license}
{hw.ctx} ctx
EU deployable
Bare metal compatible
{/* Tabs */}
{[
["overview", "Overview"],
["modelcard", "Model card"],
["files", "Files"],
["benchmark", "Benchmark"],
["license", "License"],
].map(([id, label]) => (
))}
{/* Tab content */}
{tab === "overview" &&
}
{tab === "modelcard" &&
}
{tab === "files" &&
}
{tab === "benchmark" &&
}
{tab === "license" &&
}
{/* Right col — deploy panel */}
Deployment express
Launch in 3 minutes
Paris (Cloud Avenue PA-1)
Primary · +3 Cloud Avenue regions available
{hw.gpu} bare metal
Active cost
€{hw.costPerH.toFixed(2)}/h
Scale-to-zero ON · €0/h inactif
Billed per second · Cancel anytime
);
};
const DeployField = ({ label, children }) => (
);
const SovereignToggle = ({ locked }) => (
Strict sovereignty
Zero data flow outside EU. AI Act & GDPR compliant.
);
Object.assign(window, { CatalogueScreen, DetailScreen, MODELS });