feat(threejs): add visibility optimization, host styling, transparent background
- Add visibility-based animation pause (IntersectionObserver + wrapped rAF) - Zero CPU usage when widget scrolls out of view - Apply host style variables via useHostStyles - Support transparent WebGL background (alpha: true) - Use light-dark() for theme-aware fallback colors - Tool no longer echoes code back in result - Document performance features in README
This commit is contained in:
parent
8c3b1daf7e
commit
d60224f363
1 changed files with 142 additions and 56 deletions
|
|
@ -5,7 +5,7 @@
|
|||
* props to the actual widget component.
|
||||
*/
|
||||
import type { App, McpUiHostContext } from "@modelcontextprotocol/ext-apps";
|
||||
import { useApp } from "@modelcontextprotocol/ext-apps/react";
|
||||
import { useApp, useHostStyles } from "@modelcontextprotocol/ext-apps/react";
|
||||
import type { CallToolResult } from "@modelcontextprotocol/sdk/types.js";
|
||||
import { StrictMode, useState, useCallback, useEffect } from "react";
|
||||
import { createRoot } from "react-dom/client";
|
||||
|
|
@ -78,6 +78,9 @@ function McpAppWrapper() {
|
|||
},
|
||||
});
|
||||
|
||||
// Apply host styling (theme, CSS variables, fonts)
|
||||
useHostStyles(app);
|
||||
|
||||
// Get initial host context after connection
|
||||
useEffect(() => {
|
||||
if (app) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue