[{"data":1,"prerenderedAt":76},["ShallowReactive",2],{"content-\u002Fplugins\u002Faio-html-interactive":3,"children-\u002Fplugins\u002Faio-html-interactive":72},{"id":4,"title":5,"author":6,"body":7,"budget_tier":6,"build_tags":6,"created":6,"description":22,"document_type":61,"extension":62,"game":6,"install":63,"investment_tier":6,"league":6,"meta":64,"navigation":65,"patch":6,"path":66,"plugin":6,"profit_per_hour":6,"ratings":6,"seo":67,"skills_count":68,"status":6,"stem":69,"strategy_tier":6,"tags":6,"updated":6,"version":70,"weight":6,"__hash__":71},"content\u002Fplugins\u002Faio-html-interactive.md","aio-html-interactive",null,{"type":8,"value":9,"toc":56},"minimark",[10,13,20,23,28,38,42],[11,12,5],"h1",{"id":5},[14,15,16],"p",{},[17,18,19],"code",{},"v1.0.1",[14,21,22],{},"Bridge Claude to a browser UI in real time. Solves the AI-event-loop gap with a frozen Bun + Vue3 + Tailwind scaffold: browser events become Monitor-tool notifications (server emits MSG:: lines to stdout), Claude pushes broadcast over WebSocket. Claude only edits the APP REGION; runtime, protocol, and vendor blocks stay frozen.",[24,25,27],"h2",{"id":26},"install","Install",[29,30,35],"pre",{"className":31,"code":33,"language":34},[32],"language-text","\u002Fplugin install aio-html-interactive@aiocean-plugins\n","text",[17,36,33],{"__ignoreMap":37},"",[24,39,41],{"id":40},"skills-1","Skills (1)",[43,44,45],"ul",{},[46,47,48,55],"li",{},[49,50,52],"a",{"href":51},"\u002Fplugins\u002Faio-html-interactive\u002Faio-html-interactive",[53,54,5],"strong",{}," — Bridge Claude to a browser UI in real time. The technical problem: Claude runs in a turn-by-turn CLI loop with no event loop — it cannot addEventListener on a t…",{"title":37,"searchDepth":57,"depth":57,"links":58},2,[59,60],{"id":26,"depth":57,"text":27},{"id":40,"depth":57,"text":41},"plugin","md","\u002Fplugin install aio-html-interactive@aiocean-plugins",{},true,"\u002Fplugins\u002Faio-html-interactive",{"title":5,"description":22},1,"plugins\u002Faio-html-interactive","1.0.1","wuQg_dNLCcNQsrSX75mokKsIXRj5dVq9auxHnQ3X8tk",[73],{"path":51,"title":5,"description":74,"document_type":75,"status":6,"budget_tier":6,"game":6,"league":6,"patch":6,"build_tags":6,"ratings":6,"strategy_tier":6,"profit_per_hour":6,"investment_tier":6,"updated":6,"created":6},"Bridge Claude to a browser UI in real time. The technical problem: Claude runs in a turn-by-turn CLI loop with no event loop — it cannot addEventListener on a tab, cannot block on user input. This skill ships a frozen Bun + Vue3 + Tailwind scaffold that solves it via two channels: browser events become Monitor-tool notifications (server emits MSG:: lines to stdout, Monitor pattern-matches → Claude wakes), AI pushes become WebSocket broadcasts (POST \u002Fapi\u002Fpush → all browser tabs). Claude only writes the APP REGION of app.html; the runtime, message protocol, and vendor blocks are frozen. Use when an interactive browser UI must be driven by Claude while a task is in progress — form capture, multi-step decision flow, live preview, approval queue, side-by-side review. Triggers: \"\u002Faio-html-interactive\", \"\u002Finteractive\", \"interactive UI for AI\", \"browser ↔ AI realtime\", \"AI-driven UI\", \"Monitor + WebSocket bridge\", \"làm cái UI tương tác với AI\", \"dựng UI tương tác\", \"realtime browser AI\".","skill",1779707415689]