@leeoohoo/ui-apps-devkit 0.1.4 → 0.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leeoohoo/ui-apps-devkit",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "ChatOS UI Apps DevKit (CLI + templates + sandbox) for building installable ChatOS UI Apps plugins.",
   "license": "MIT",
   "type": "module",

package/src/sandbox/server.js

@@ -739,6 +739,16 @@ function htmlPage() {
         box-shadow: 0 14px 40px rgba(0,0,0,0.16);
         z-index: 12;
       }
+      #mcpPanel[data-mode='half'] {
+        right: 0;
+        top: 72px;
+        width: 50vw;
+        height: calc(100vh - 84px);
+        max-height: none;
+        border-right: none;
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
       #mcpPanelHeader {
         padding: 10px 12px;
         display:flex;
@@ -795,6 +805,7 @@ function htmlPage() {
             <div id="sandboxContext" class="muted"></div>
             <button id="btnLlmConfig" class="btn" type="button">AI Config</button>
             <button id="btnMcpTest" class="btn" type="button">MCP Test</button>
+            <button id="btnMcpHalf" class="btn" type="button">Half Test</button>
             <button id="btnInspectorToggle" class="btn" type="button">Inspect</button>
             <button id="btnReload" class="btn" type="button">Reload</button>
           </div>
@@ -950,6 +961,7 @@ const llmModelId = $('#llmModelId');
 const llmStatus = $('#llmStatus');
 const llmKeyStatus = $('#llmKeyStatus');
 const btnMcpTest = $('#btnMcpTest');
+const btnMcpHalf = $('#btnMcpHalf');
 const mcpPanel = $('#mcpPanel');
 const btnMcpClose = $('#btnMcpClose');
 const btnMcpClear = $('#btnMcpClear');
@@ -1128,8 +1140,13 @@ const refreshMcpConfigHint = async () => {
   }
 };
 
-const setMcpPanelOpen = (open) => {
+const setMcpPanelOpen = (open, mode) => {
   if (!mcpPanel) return;
+  if (mode) {
+    mcpPanel.dataset.mode = mode;
+  } else {
+    delete mcpPanel.dataset.mode;
+  }
   mcpPanel.style.display = open ? 'flex' : 'none';
   mcpPanel.setAttribute('aria-hidden', open ? 'false' : 'true');
   if (open) {
@@ -1138,6 +1155,16 @@ const setMcpPanelOpen = (open) => {
   }
 };
 
+const toggleMcpPanel = (mode) => {
+  if (!mcpPanel) return;
+  const currentMode = mcpPanel.dataset.mode || 'panel';
+  if (isMcpPanelOpen() && currentMode === mode) {
+    setMcpPanelOpen(false);
+    return;
+  }
+  setMcpPanelOpen(true, mode);
+};
+
 const runMcpTest = async () => {
   const sendBtn = btnMcpSend;
   try {
@@ -1278,7 +1305,8 @@ if (btnLlmClose) btnLlmClose.addEventListener('click', () => setLlmPanelOpen(fal
 if (btnLlmRefresh) btnLlmRefresh.addEventListener('click', () => refreshLlmConfig());
 if (btnLlmSave) btnLlmSave.addEventListener('click', () => saveLlmConfig());
 if (btnLlmClear) btnLlmClear.addEventListener('click', () => saveLlmConfig({ clearKey: true }));
-if (btnMcpTest) btnMcpTest.addEventListener('click', () => setMcpPanelOpen(!isMcpPanelOpen()));
+if (btnMcpTest) btnMcpTest.addEventListener('click', () => toggleMcpPanel('panel'));
+if (btnMcpHalf) btnMcpHalf.addEventListener('click', () => toggleMcpPanel('half'));
 if (btnMcpClose) btnMcpClose.addEventListener('click', () => setMcpPanelOpen(false));
 if (btnMcpClear)
   btnMcpClear.addEventListener('click', () => {