Files
cobble/src/hooks/use-document-dark.ts
T
tbenandClaude Opus 5.5 bea656ade8 Add bot graphics
Bots can now show a concept as a visual: create_graphic (with
update_graphic, read_graphic and list_graphics, on every run, no computer
needed) stores one HTML document in bot_graphics, per user like the
conversation, and the chat renders its [graphic:ID] ref as an inline card
sized to fit, with a large view and a page of its own (no rail).

Graphic HTML is treated as hostile: it is only served at /graphics/<id>
with a CSP sandbox allowing scripts under an origin of its own and no
network, loading only the vendored Chart.js and Mermaid from
/graphics-lib/. The document carries the app's theme vars and scrollbars,
reports its height to the thread, and a frame that navigates away is
closed.

Co-Authored-By: Claude Opus 5.5 <[email protected]>
2026-10-27 08:11:15 +01:00

26 lines
716 B
TypeScript

import { useEffect, useState } from "react";
function readDark() {
return typeof document != "undefined" && document.documentElement.classList.contains("dark");
}
/**
* Whether the page shows the dark theme now (`dark` on the root, set by
* `ThemeInitScript` and the theme toggles), kept live as it changes.
*/
export default function useDocumentDark() {
const [dark, setDark] = useState(false);
useEffect(() => {
setDark(readDark());
const observer = new MutationObserver(() => setDark(readDark()));
observer.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] });
return () => observer.disconnect();
}, []);
return dark;
}