@aipanel/ui 1.2.11 → 1.2.12

package/lib/AI-panel-widget/src/context.d.ts

@@ -1,5 +1,5 @@
 import { type Ref } from "vue";
-import type { AIPanelWidgetSessionItem, AIPanelSelectedElementItem, AIPanelRemoveSelectedPayload, AIPanelSessionThinkingState, DisplayMode } from "./types";
+import type { AIPanelWidgetSessionItem, AIPanelSelectedElementItem, AIPanelRemoveSelectedPayload, AIPanelSessionThinkingState, DisplayMode, ProviderSidebarCollapseControl } from "./types";
 import type { FloatingBubbleOffset } from "./components/FloatingBubble/types";
 export interface AIPanelWidgetContext {
     theme: Ref<string>;
@@ -26,6 +26,10 @@ export interface AIPanelWidgetContext {
     reviewPanelVisible: Ref<boolean>;
     /** 是否支持代码审查面板（右上角 </> 按钮）；由 Provider capabilities.reviewPanel 决定 */
     reviewPanelEnabled: Ref<boolean>;
+    /** Provider 接管会话侧栏（隐藏原生会话列表，Provider 自家侧栏渲染）；由 capabilities.sidebar.takeover 决定 */
+    providerSidebar: Ref<boolean>;
+    /** 侧栏折叠开关归属（host=宿主左上角按钮驱动 / provider=Provider 自带开关）；由 capabilities.sidebar.collapseControl 决定 */
+    sidebarCollapseControl: Ref<ProviderSidebarCollapseControl>;
     bubbleOffset: Ref<FloatingBubbleOffset | undefined>;
     mode: Ref<"bubble" | "split">;
     displayMode: Ref<DisplayMode>;

package/lib/AI-panel-widget/src/index-sfc.css

@@ -1 +1 @@
-.aipanel-widget{--ap-bg-main: #ffffff;--ap-bg-secondary: #f8f9fa;--ap-bg-tertiary: #f3f4f6;--ap-overlay-bg: rgba(255, 255, 255, .9);--ap-bg-inverse: #1e1e1e;--ap-text-primary: #282828;--ap-text-secondary: #4b5563;--ap-text-tertiary: #6b7280;--ap-text-placeholder: #9ca3af;--ap-text-inverse: #ffffff;--ap-border-primary: #e5e7eb;--ap-border-secondary: #d1d5db;--ap-primary: #3b82f6;--ap-primary-hover: #2563eb;--ap-primary-bg: rgba(59, 130, 246, .1);--ap-danger: #ef4444;--ap-danger-hover: #dc2626;--ap-danger-active: #b91c1c;--ap-success: #10b981;--ap-state-pending: #f59e0b;--ap-state-completed: #22c55e;--ap-state-ongoing: #5686fe;--ap-overlay: rgba(0, 0, 0, .5);--ap-tooltip-bg: #1e1e1e;--ap-dialog-overlay: rgba(0, 0, 0, .5);--ap-thinking-gradient-1: #10b981;--ap-thinking-gradient-2: #059669;--ap-thinking-glow: rgba(16, 185, 129, .3);--ap-thinking-glow-strong: rgba(16, 185, 129, .6);--ap-skeleton-bg: #e5e7eb;--ap-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--ap-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--ap-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--ap-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--ap-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--ap-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--ap-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--ap-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--ap-trigger-bg: #3b82f6;--ap-trigger-bg-hover: #2563eb;--ap-trigger-bg-active: #1d4ed8;--ap-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--ap-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--ap-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.aipanel-widget.aipanel-theme-dark{--ap-bg-main: #1a1a1a;--ap-bg-secondary: #1e1e1e;--ap-bg-tertiary: #282828;--ap-overlay-bg: rgba(26, 26, 26, .9);--ap-bg-inverse: #ffffff;--ap-text-primary: #f3f4f6;--ap-text-secondary: #d1d5db;--ap-text-tertiary: #9ca3af;--ap-text-placeholder: #6b7280;--ap-text-inverse: #282828;--ap-border-primary: #282828;--ap-border-secondary: #4b5563;--ap-primary: #3b82f6;--ap-primary-hover: #2563eb;--ap-primary-bg: rgba(59, 130, 246, .15);--ap-danger: #ef4444;--ap-danger-hover: #dc2626;--ap-danger-active: #b91c1c;--ap-success: #10b981;--ap-state-pending: #fbbf24;--ap-state-completed: #22c55e;--ap-state-ongoing: #5686fe;--ap-overlay: rgba(26, 26, 26, .9);--ap-tooltip-bg: #282828;--ap-dialog-overlay: rgba(0, 0, 0, .7);--ap-thinking-gradient-1: #34d399;--ap-thinking-gradient-2: #10b981;--ap-thinking-glow: rgba(52, 211, 153, .3);--ap-thinking-glow-strong: rgba(52, 211, 153, .6);--ap-skeleton-bg: #151515;--ap-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--ap-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--ap-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--ap-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--ap-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--ap-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--ap-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--ap-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--ap-trigger-bg: #60a5fa;--ap-trigger-bg-hover: #3b82f6;--ap-trigger-bg-active: #2563eb;--ap-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--ap-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--ap-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.aipanel-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--ap-bg-main);border-radius:16px;box-shadow:var(--ap-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.aipanel-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.aipanel-chat.no-transition,.aipanel-chat.no-transition.open{transition:none!important}.aipanel-chat.minimized{width:320px;height:320px}.aipanel-chat.minimized .aipanel-iframe-container{margin-top:-146px}.aipanel-chat-content{display:flex;flex:1;overflow:hidden}.aipanel-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.aipanel-notification:before{content:"\1f4a1";font-size:16px}.aipanel-dialog-overlay{position:fixed;inset:0;background:var(--ap-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.aipanel-dialog{background:var(--ap-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--ap-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.aipanel-dialog-content{margin-bottom:20px}.aipanel-dialog-message{font-size:15px;color:var(--ap-text-primary);line-height:1.5}.aipanel-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.aipanel-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.aipanel-dialog-btn.cancel{background:var(--ap-bg-tertiary);color:var(--ap-text-primary)}.aipanel-dialog-btn.cancel:hover{background:var(--ap-text-primary);color:var(--ap-bg-main)}.aipanel-dialog-btn.confirm{background:var(--ap-danger);color:#fff}.aipanel-dialog-btn.confirm:hover{background:var(--ap-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.aipanel-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.aipanel-page-notification:before{content:"\1f4a1";font-size:16px}.aipanel-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.aipanel-element-tooltip{position:fixed;background:var(--ap-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--ap-shadow-md);max-width:300px;pointer-events:none;line-height:1}.aipanel-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.aipanel-tooltip-file{font-size:11px;color:var(--ap-text-placeholder);word-break:break-all}.aipanel-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.aipanel-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-aipanel-split{transition:padding .3s ease;min-width:auto}body.has-aipanel-split-right{padding-right:var(--aipanel-split-width, 500px)}body.has-aipanel-split-left{padding-left:var(--aipanel-split-width, 500px)}.aipanel-widget.extension-mode{position:relative;width:100%;height:100%;display:flex}.aipanel-widget.extension-mode .aipanel-select-mode-hint,.aipanel-widget.extension-mode .aipanel-dialog-overlay{position:absolute}
+.aipanel-widget{--ap-bg-main: #ffffff;--ap-bg-secondary: #f9fafb;--ap-bg-tertiary: #ebeef2;--ap-overlay-bg: rgba(249, 250, 251, .92);--ap-text-primary: #0f1115;--ap-text-secondary: #61666b;--ap-text-tertiary: #81858c;--ap-text-placeholder: #adb2b8;--ap-border-faint: rgba(15, 17, 21, .04);--ap-border-primary: rgba(15, 17, 21, .1);--ap-border-secondary: rgba(15, 17, 21, .12);--ap-hover-bg: rgba(38, 49, 72, .06);--ap-elevated-fill: #ffffff;--ap-elevated-hover: #f1f3f5;--ap-press-bg: rgba(38, 49, 72, .1);--ap-primary: #0f1115;--ap-primary-hover: #43454a;--ap-on-primary: #ffffff;--ap-accent: #4176e6;--ap-accent-hover: #5686fe;--ap-accent-bg: rgba(65, 118, 230, .1);--ap-danger: #ec1313;--ap-danger-hover: #c40f0f;--ap-state-pending: #f59e0b;--ap-state-completed: #22c55e;--ap-state-ongoing: #5686fe;--ap-tooltip-bg: #1e1e1e;--ap-dialog-overlay: rgba(0, 0, 0, .24);--ap-dialog-bg: #ffffff;--ap-scrollbar-thumb: #e5e5e5;--ap-scrollbar-thumb-hover: #d4d4d4;--ap-thinking-glow: rgba(86, 134, 254, .3);--ap-thinking-glow-strong: rgba(86, 134, 254, .55);--ap-skeleton-bg: rgba(15, 17, 21, .06);--ap-skeleton-gradient: linear-gradient( 90deg, rgba(15, 17, 21, .04) 25%, rgba(15, 17, 21, .1) 50%, rgba(15, 17, 21, .04) 75% );--ap-shadow-sm: 0 1px 2px rgba(15, 17, 21, .04), 0 1px 3px rgba(15, 17, 21, .06);--ap-shadow-md: 0 2px 8px rgba(15, 17, 21, .06), 0 4px 16px rgba(15, 17, 21, .06);--ap-shadow-lg: 0 0 0 .5px rgba(15, 17, 21, .06), 0 4px 16px rgba(15, 17, 21, .08), 0 16px 48px rgba(15, 17, 21, .1);--ap-shadow-xl: 0 0 0 .5px rgba(15, 17, 21, .08), 0 8px 32px rgba(15, 17, 21, .12), 0 24px 72px rgba(15, 17, 21, .14);--ap-shadow-accent: 0 1px 2px rgba(65, 118, 230, .14), 0 0 0 1px rgba(65, 118, 230, .18);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.aipanel-widget.aipanel-theme-dark{--ap-bg-main: #151517;--ap-bg-secondary: #1b1b1c;--ap-bg-tertiary: #2c2c2e;--ap-overlay-bg: rgba(21, 21, 23, .92);--ap-text-primary: #f9fafb;--ap-text-secondary: #cfd3d6;--ap-text-tertiary: #adb2b8;--ap-text-placeholder: #81858c;--ap-border-faint: rgba(255, 255, 255, .06);--ap-border-primary: rgba(255, 255, 255, .12);--ap-border-secondary: rgba(255, 255, 255, .16);--ap-hover-bg: rgba(255, 255, 255, .08);--ap-elevated-fill: #43454a;--ap-elevated-hover: #353638;--ap-press-bg: rgba(255, 255, 255, .14);--ap-primary: #f9fafb;--ap-primary-hover: #ebeef2;--ap-on-primary: #0f1115;--ap-accent: #679efe;--ap-accent-hover: #5686fe;--ap-accent-bg: rgba(103, 158, 254, .16);--ap-danger: #f25a5a;--ap-danger-hover: #ff8383;--ap-state-pending: #f59e0b;--ap-state-completed: #22c55e;--ap-state-ongoing: #5686fe;--ap-tooltip-bg: #282828;--ap-dialog-overlay: rgba(0, 0, 0, .5);--ap-dialog-bg: #2c2c2e;--ap-scrollbar-thumb: #3c3c3d;--ap-scrollbar-thumb-hover: #545557;--ap-thinking-glow: rgba(103, 158, 254, .35);--ap-thinking-glow-strong: rgba(103, 158, 254, .6);--ap-skeleton-bg: rgba(255, 255, 255, .07);--ap-skeleton-gradient: linear-gradient( 90deg, rgba(255, 255, 255, .05) 25%, rgba(255, 255, 255, .12) 50%, rgba(255, 255, 255, .05) 75% );--ap-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3), 0 1px 3px rgba(0, 0, 0, .24);--ap-shadow-md: 0 2px 8px rgba(0, 0, 0, .3), 0 4px 16px rgba(0, 0, 0, .2);--ap-shadow-lg: 0 0 0 .5px rgba(255, 255, 255, .06), 0 4px 16px rgba(0, 0, 0, .3), 0 16px 48px rgba(0, 0, 0, .25);--ap-shadow-xl: 0 0 0 .5px rgba(255, 255, 255, .08), 0 8px 32px rgba(0, 0, 0, .36), 0 24px 72px rgba(0, 0, 0, .3);--ap-shadow-accent: 0 1px 2px rgba(103, 158, 254, .2), 0 0 0 1px rgba(103, 158, 254, .25)}@supports not selector(::-webkit-scrollbar){.aipanel-widget,.aipanel-widget *{scrollbar-width:thin;scrollbar-color:var(--ap-scrollbar-thumb) transparent}}.aipanel-widget ::-webkit-scrollbar,.aipanel-widget *::-webkit-scrollbar{width:8px;height:8px}.aipanel-widget ::-webkit-scrollbar-track,.aipanel-widget *::-webkit-scrollbar-track{background:transparent}.aipanel-widget ::-webkit-scrollbar-thumb,.aipanel-widget *::-webkit-scrollbar-thumb{border-radius:4px;background:var(--ap-scrollbar-thumb)}.aipanel-widget ::-webkit-scrollbar-thumb:hover,.aipanel-widget *::-webkit-scrollbar-thumb:hover{background:var(--ap-scrollbar-thumb-hover)}.aipanel-widget ::-webkit-scrollbar-corner,.aipanel-widget *::-webkit-scrollbar-corner{background:transparent}.aipanel-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--ap-bg-main);border-radius:16px;box-shadow:var(--ap-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.aipanel-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.aipanel-chat.no-transition,.aipanel-chat.no-transition.open{transition:none!important}.aipanel-chat.minimized{width:320px;height:320px}.aipanel-chat.minimized .aipanel-iframe-container{margin-top:-146px}.aipanel-chat-content{display:flex;flex:1;overflow:hidden}.aipanel-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.aipanel-notification:before{content:"\1f4a1";font-size:16px}.aipanel-dialog-overlay{position:fixed;inset:0;background:var(--ap-dialog-overlay);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.aipanel-dialog{width:min(380px,100%);background:var(--ap-dialog-bg);border-radius:24px;padding:24px 24px 20px;box-shadow:var(--ap-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.aipanel-dialog-content{margin-bottom:20px}.aipanel-dialog-message{font-size:14px;line-height:22px;font-weight:400;color:var(--ap-text-primary)}.aipanel-dialog-actions{display:flex;gap:8px;justify-content:flex-end}.aipanel-dialog-btn{height:36px;padding:0 20px;border-radius:999px;border:1px solid transparent;font-size:14px;line-height:22px;font-weight:500;cursor:pointer;transition:all .2s}.aipanel-dialog-btn.cancel{background:transparent;border-color:var(--ap-border-primary);color:var(--ap-text-secondary)}.aipanel-dialog-btn.cancel:hover{background:var(--ap-hover-bg);color:var(--ap-text-primary)}.aipanel-dialog-btn.confirm{background:var(--ap-danger);color:#fff}.aipanel-dialog-btn.confirm:hover{background:var(--ap-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.aipanel-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.aipanel-page-notification:before{content:"\1f4a1";font-size:16px}.aipanel-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.aipanel-element-tooltip{position:fixed;background:var(--ap-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--ap-shadow-md);max-width:300px;pointer-events:none;line-height:1}.aipanel-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.aipanel-tooltip-file{font-size:11px;color:var(--ap-text-placeholder);word-break:break-all}.aipanel-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.aipanel-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-aipanel-split{transition:padding .3s ease;min-width:auto}body.has-aipanel-split-right{padding-right:var(--aipanel-split-width, 500px)}body.has-aipanel-split-left{padding-left:var(--aipanel-split-width, 500px)}.aipanel-widget.extension-mode{position:relative;width:100%;height:100%;display:flex}.aipanel-widget.extension-mode .aipanel-select-mode-hint,.aipanel-widget.extension-mode .aipanel-dialog-overlay{position:absolute}

package/lib/AI-panel-widget/src/index.vue.cjs

@@ -78,7 +78,9 @@ const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
     splitMode: { type: Object, required: false, default: void 0 },
     splitPanelWidth: { type: Number, required: false, default: 500 },
     hideBubble: { type: Boolean, required: false, default: false },
-    reviewPanelEnabled: { type: Boolean, required: false, default: false }
+    reviewPanelEnabled: { type: Boolean, required: false, default: false },
+    providerSidebar: { type: Boolean, required: false, default: false },
+    sidebarCollapseControl: { type: String, required: false, default: "host" }
   },
   emits: ["update:open", "update:selectMode", "update:sessionListCollapsed", "update:currentSessionId", "update:selectedElements", "update:theme", "update:thinking", "update:splitPanelWidth", "toggle", "close", "toggle-session-list", "toggle-select-mode", "toggle-theme", "create-session", "select-session", "delete-session", "click-selected-node", "remove-selected-node", "clear-selected-nodes", "empty-action", "frame-loaded", "thinking-change", "split-panel-width-change"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -140,6 +142,14 @@ const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
       if (!iframeLoaded.value || !iframeReady.value) return;
       sendMessageToIframe(import_core.WIDGET_MSG.PROMPT_DOCK_VISIBILITY, { visible: promptDockVisible.value });
       sendMessageToIframe(import_core.WIDGET_MSG.MINIMIZE_STATE, { minimized: minimized.value });
+      sendMessageToIframe(import_core.WIDGET_MSG.SIDEBAR_MODE, {
+        mode: props.providerSidebar ? "provider" : "host"
+      });
+      if (props.providerSidebar && props.sidebarCollapseControl === "host") {
+        sendMessageToIframe(import_core.WIDGET_MSG.SIDEBAR_COLLAPSE, {
+          collapsed: localSessionListCollapsed.value
+        });
+      }
       if (props.reviewPanelEnabled) {
         sendMessageToIframe(import_core.WIDGET_MSG.REVIEW_PANEL_TOGGLE, { visible: reviewPanelVisible.value });
       }
@@ -166,6 +176,12 @@ const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
         localDisplayMode.value = val;
       }
     );
+    (0, import_vue2.watch)(
+      () => [props.providerSidebar, props.sidebarCollapseControl],
+      () => {
+        syncStateToIframe();
+      }
+    );
     const handleToggleDisplayMode = () => {
       if (localDisplayMode.value === "extension" || localDisplayMode.value === "extension-selector")
         return;
@@ -207,6 +223,9 @@ const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
         localSessionListCollapsed.value = collapsed;
         emit("update:sessionListCollapsed", collapsed);
         emit("toggle-session-list", collapsed);
+        if (props.providerSidebar && props.sidebarCollapseControl === "host") {
+          sendMessageToIframe(import_core.WIDGET_MSG.SIDEBAR_COLLAPSE, { collapsed });
+        }
       },
       onEmptyAction: () => {
         emit("empty-action");
@@ -387,6 +406,16 @@ const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
         iframeReady.value = true;
         syncStateToIframe();
       }
+      if (event.data?.type === import_core.WIDGET_MSG.SIDEBAR_STATE) {
+        if (props.providerSidebar && props.sidebarCollapseControl === "host") {
+          const collapsed = event.data.collapsed === true;
+          if (collapsed !== localSessionListCollapsed.value) {
+            localSessionListCollapsed.value = collapsed;
+            emit("update:sessionListCollapsed", collapsed);
+            emit("toggle-session-list", collapsed);
+          }
+        }
+      }
     };
     (0, import_vue2.onMounted)(() => {
       if (typeof window !== "undefined") {
@@ -532,6 +561,8 @@ const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
       promptDockVisible,
       reviewPanelVisible,
       reviewPanelEnabled: (0, import_vue2.toRef)(props, "reviewPanelEnabled"),
+      providerSidebar: (0, import_vue2.toRef)(props, "providerSidebar"),
+      sidebarCollapseControl: (0, import_vue2.toRef)(props, "sidebarCollapseControl"),
       bubbleOffset,
       mode: effectiveMode,
       displayMode: localDisplayMode,
@@ -652,6 +683,7 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
             "resolved-theme": $setup.resolvedTheme,
             "split-position": $setup.splitPosition,
             extension: $setup.isExtensionMode,
+            "provider-sidebar": $setup.props.providerSidebar,
             onResize: $setup.handleResize,
             onResizeStart: $setup.handleResizeStart,
             onResizeEnd: $setup.handleResizeEnd,
@@ -720,7 +752,7 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
               ]),
               key: "6"
             } : void 0
-          ]), 1032, ["mode", "open", "minimized", "position-style", "animation-origin", "panel-width", "resizable", "min-width", "max-width", "no-transition", "dragging", "thinking", "resolved-theme", "split-position", "extension", "onResize", "onToggle"]),
+          ]), 1032, ["mode", "open", "minimized", "position-style", "animation-origin", "panel-width", "resizable", "min-width", "max-width", "no-transition", "dragging", "thinking", "resolved-theme", "split-position", "extension", "provider-sidebar", "onResize", "onToggle"]),
           (0, import_vue3.createVNode)($setup["SelectHint"])
         ],
         64

package/lib/AI-panel-widget/src/index.vue.d.ts

@@ -44,6 +44,8 @@ declare const __VLS_base: import("vue").DefineComponent<AIPanelWidgetProps, {
     selectEnabled: boolean;
     theme: import("@aipanel/core").AIPanelWidgetTheme;
     reviewPanelEnabled: boolean;
+    providerSidebar: boolean;
+    sidebarCollapseControl: import("@aipanel/core").ProviderSidebarCollapseControl;
     displayMode: import("@aipanel/core").DisplayMode;
     showSessionListSkeleton: boolean;
     sessionKey: string;

package/lib/AI-panel-widget/src/types.d.ts

@@ -1 +1 @@
-export type { AIPanelWidgetTheme, AIPanelWidgetSession, AIPanelSelectedElement, AIPanelRemoveSelectedPayload, AIPanelWidgetSessionItem, AIPanelSelectedElementItem, AIPanelWidgetProps, AIPanelWidgetEmits, AIPanelSessionThinkingState, DisplayMode, SplitModeOptions, } from "@aipanel/core";
+export type { AIPanelWidgetTheme, AIPanelWidgetSession, AIPanelSelectedElement, AIPanelRemoveSelectedPayload, AIPanelWidgetSessionItem, AIPanelSelectedElementItem, AIPanelWidgetProps, AIPanelWidgetEmits, AIPanelSessionThinkingState, DisplayMode, SplitModeOptions, ProviderSidebarCollapseControl, } from "@aipanel/core";

package/lib/index.cjs

@@ -26,7 +26,7 @@ module.exports = __toCommonJS(lib_exports);
 var import_AI_panel_widget = require("./AI-panel-widget/index.cjs");
 __reExport(lib_exports, require("./AI-panel-widget/index.cjs"), module.exports);
 __reExport(lib_exports, require("./setup.cjs"), module.exports);
-const version = "1.2.11";
+const version = "1.2.12";
 function install(app, options) {
   const components = [
     import_AI_panel_widget.AIPanelWidget

package/lib/index.d.ts

@@ -1,5 +1,5 @@
 import type { App } from 'vue';
-declare const version = "1.2.11";
+declare const version = "1.2.12";
 declare function install(app: App<any>, options?: any): void;
 export { install, version, };
 export * from './AI-panel-widget';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aipanel/ui",
-  "version": "1.2.11",
+  "version": "1.2.12",
   "description": "Reusable AIPanel widget components built with Pagoda CLI",
   "type": "module",
   "main": "lib/index.cjs",
@@ -31,7 +31,7 @@
   },
   "dependencies": {
     "css-selector-generator": "^3.9.2",
-    "@aipanel/core": "1.2.11"
+    "@aipanel/core": "1.2.12"
   },
   "scripts": {
     "build": "pagoda-cli build",

package/es/AI-panel-widget/src/components/SplitTrigger-sfc.css

@@ -1 +0,0 @@
-.aipanel-split-trigger{position:fixed;right:0;top:50%;transform:translateY(-50%);width:20px;height:48px;background:linear-gradient(135deg,#3b82f6,#2563eb);border:none;border-radius:8px 0 0 8px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:-2px 0 8px #3b82f640;transition:right .3s ease,width .25s cubic-bezier(.4,0,.2,1),background .25s ease,box-shadow .25s ease;z-index:99998}.aipanel-split-trigger:hover{width:24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:-3px 0 12px #3b82f659}.aipanel-split-trigger.open{width:20px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px #3b82f640}.aipanel-split-trigger.open:hover{width:24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:-3px 0 12px #3b82f659}.aipanel-split-trigger-icon{display:flex;align-items:center;justify-content:center;transition:transform .25s ease}.aipanel-split-trigger:hover .aipanel-split-trigger-icon{transform:scale(1.1)}.aipanel-split-thinking-indicator{position:absolute;top:6px;right:6px;width:5px;height:5px;background:var(--ap-success);border-radius:50%;animation:aipanel-thinking-pulse 1.5s ease-in-out infinite;box-shadow:0 0 4px #10b98180}@keyframes aipanel-thinking-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}}

package/es/AI-panel-widget/src/components/SplitTrigger.vue.d.ts

@@ -1,18 +0,0 @@
-type __VLS_Props = {
-    open?: boolean;
-    thinking?: boolean;
-    resolvedTheme?: "light" | "dark";
-    panelWidth?: number;
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    toggle: () => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onToggle?: (() => any) | undefined;
-}>, {
-    resolvedTheme: "light" | "dark";
-    thinking: boolean;
-    open: boolean;
-    panelWidth: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;

package/es/AI-panel-widget/src/components/SplitTrigger.vue.mjs

@@ -1,112 +0,0 @@
-import "./SplitTrigger-sfc.css";
-import { defineComponent as _defineComponent } from "vue";
-import { computed } from "vue";
-const __vue_sfc__ = /* @__PURE__ */ _defineComponent({
-  ...{
-    name: "SplitTrigger"
-  },
-  __name: "SplitTrigger",
-  props: {
-    open: { type: Boolean, required: false, default: false },
-    thinking: { type: Boolean, required: false, default: false },
-    resolvedTheme: { type: String, required: false, default: "light" },
-    panelWidth: { type: Number, required: false, default: 500 }
-  },
-  emits: ["toggle"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    __expose();
-    const props = __props;
-    const emit = __emit;
-    const buttonClasses = computed(() => [
-      "aipanel-split-trigger",
-      {
-        open: props.open,
-        thinking: props.thinking,
-        "aipanel-theme-dark": props.resolvedTheme === "dark"
-      }
-    ]);
-    const buttonStyle = computed(() => {
-      if (props.open) {
-        return {
-          right: `${props.panelWidth}px`
-        };
-      }
-      return {};
-    });
-    const handleClick = () => {
-      emit("toggle");
-    };
-    const __returned__ = { props, emit, buttonClasses, buttonStyle, handleClick };
-    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
-    return __returned__;
-  }
-});
-import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle } from "vue";
-const _hoisted_1 = ["aria-expanded"];
-const _hoisted_2 = { class: "aipanel-split-trigger-icon" };
-const _hoisted_3 = {
-  key: 0,
-  viewBox: "0 0 24 24",
-  width: "16",
-  height: "16",
-  fill: "none",
-  stroke: "currentColor",
-  "stroke-width": "2"
-};
-const _hoisted_4 = {
-  key: 1,
-  viewBox: "0 0 24 24",
-  width: "16",
-  height: "16",
-  fill: "none",
-  stroke: "currentColor",
-  "stroke-width": "2"
-};
-const _hoisted_5 = {
-  key: 0,
-  class: "aipanel-split-thinking-indicator"
-};
-function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
-  return _openBlock(), _createElementBlock("button", {
-    class: _normalizeClass($setup.buttonClasses),
-    style: _normalizeStyle($setup.buttonStyle),
-    type: "button",
-    "aria-expanded": $props.open,
-    "aria-label": "\u6253\u5F00 AI \u52A9\u624B",
-    onClick: $setup.handleClick
-  }, [
-    _createElementVNode("span", _hoisted_2, [
-      $props.open ? (_openBlock(), _createElementBlock("svg", _hoisted_3, [..._cache[0] || (_cache[0] = [
-        _createElementVNode(
-          "path",
-          {
-            d: "M9 18l6-6-6-6",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          },
-          null,
-          -1
-          /* CACHED */
-        )
-      ])])) : (_openBlock(), _createElementBlock("svg", _hoisted_4, [..._cache[1] || (_cache[1] = [
-        _createElementVNode(
-          "path",
-          {
-            d: "M15 18l-6-6 6-6",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          },
-          null,
-          -1
-          /* CACHED */
-        )
-      ])]))
-    ]),
-    $props.thinking ? (_openBlock(), _createElementBlock("span", _hoisted_5)) : _createCommentVNode("v-if", true)
-  ], 14, _hoisted_1);
-}
-__vue_sfc__.render = __vue_render__;
-var SplitTrigger_vue_default = __vue_sfc__;
-export {
-  SplitTrigger_vue_default as default
-};

package/lib/AI-panel-widget/src/components/SplitTrigger-sfc.css

@@ -1 +0,0 @@
-.aipanel-split-trigger{position:fixed;right:0;top:50%;transform:translateY(-50%);width:20px;height:48px;background:linear-gradient(135deg,#3b82f6,#2563eb);border:none;border-radius:8px 0 0 8px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:-2px 0 8px #3b82f640;transition:right .3s ease,width .25s cubic-bezier(.4,0,.2,1),background .25s ease,box-shadow .25s ease;z-index:99998}.aipanel-split-trigger:hover{width:24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:-3px 0 12px #3b82f659}.aipanel-split-trigger.open{width:20px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px #3b82f640}.aipanel-split-trigger.open:hover{width:24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:-3px 0 12px #3b82f659}.aipanel-split-trigger-icon{display:flex;align-items:center;justify-content:center;transition:transform .25s ease}.aipanel-split-trigger:hover .aipanel-split-trigger-icon{transform:scale(1.1)}.aipanel-split-thinking-indicator{position:absolute;top:6px;right:6px;width:5px;height:5px;background:var(--ap-success);border-radius:50%;animation:aipanel-thinking-pulse 1.5s ease-in-out infinite;box-shadow:0 0 4px #10b98180}@keyframes aipanel-thinking-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}}

package/lib/AI-panel-widget/src/components/SplitTrigger.vue.cjs

@@ -1,131 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var SplitTrigger_vue_exports = {};
-__export(SplitTrigger_vue_exports, {
-  default: () => SplitTrigger_vue_default
-});
-module.exports = __toCommonJS(SplitTrigger_vue_exports);
-var import_SplitTrigger_sfc = require("./SplitTrigger-sfc.css");
-var import_vue = require("vue");
-var import_vue2 = require("vue");
-var import_vue3 = require("vue");
-const __vue_sfc__ = /* @__PURE__ */ (0, import_vue.defineComponent)({
-  ...{
-    name: "SplitTrigger"
-  },
-  __name: "SplitTrigger",
-  props: {
-    open: { type: Boolean, required: false, default: false },
-    thinking: { type: Boolean, required: false, default: false },
-    resolvedTheme: { type: String, required: false, default: "light" },
-    panelWidth: { type: Number, required: false, default: 500 }
-  },
-  emits: ["toggle"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    __expose();
-    const props = __props;
-    const emit = __emit;
-    const buttonClasses = (0, import_vue2.computed)(() => [
-      "aipanel-split-trigger",
-      {
-        open: props.open,
-        thinking: props.thinking,
-        "aipanel-theme-dark": props.resolvedTheme === "dark"
-      }
-    ]);
-    const buttonStyle = (0, import_vue2.computed)(() => {
-      if (props.open) {
-        return {
-          right: `${props.panelWidth}px`
-        };
-      }
-      return {};
-    });
-    const handleClick = () => {
-      emit("toggle");
-    };
-    const __returned__ = { props, emit, buttonClasses, buttonStyle, handleClick };
-    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
-    return __returned__;
-  }
-});
-const _hoisted_1 = ["aria-expanded"];
-const _hoisted_2 = { class: "aipanel-split-trigger-icon" };
-const _hoisted_3 = {
-  key: 0,
-  viewBox: "0 0 24 24",
-  width: "16",
-  height: "16",
-  fill: "none",
-  stroke: "currentColor",
-  "stroke-width": "2"
-};
-const _hoisted_4 = {
-  key: 1,
-  viewBox: "0 0 24 24",
-  width: "16",
-  height: "16",
-  fill: "none",
-  stroke: "currentColor",
-  "stroke-width": "2"
-};
-const _hoisted_5 = {
-  key: 0,
-  class: "aipanel-split-thinking-indicator"
-};
-function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
-  return (0, import_vue3.openBlock)(), (0, import_vue3.createElementBlock)("button", {
-    class: (0, import_vue3.normalizeClass)($setup.buttonClasses),
-    style: (0, import_vue3.normalizeStyle)($setup.buttonStyle),
-    type: "button",
-    "aria-expanded": $props.open,
-    "aria-label": "\u6253\u5F00 AI \u52A9\u624B",
-    onClick: $setup.handleClick
-  }, [
-    (0, import_vue3.createElementVNode)("span", _hoisted_2, [
-      $props.open ? ((0, import_vue3.openBlock)(), (0, import_vue3.createElementBlock)("svg", _hoisted_3, [..._cache[0] || (_cache[0] = [
-        (0, import_vue3.createElementVNode)(
-          "path",
-          {
-            d: "M9 18l6-6-6-6",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          },
-          null,
-          -1
-          /* CACHED */
-        )
-      ])])) : ((0, import_vue3.openBlock)(), (0, import_vue3.createElementBlock)("svg", _hoisted_4, [..._cache[1] || (_cache[1] = [
-        (0, import_vue3.createElementVNode)(
-          "path",
-          {
-            d: "M15 18l-6-6 6-6",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round"
-          },
-          null,
-          -1
-          /* CACHED */
-        )
-      ])]))
-    ]),
-    $props.thinking ? ((0, import_vue3.openBlock)(), (0, import_vue3.createElementBlock)("span", _hoisted_5)) : (0, import_vue3.createCommentVNode)("v-if", true)
-  ], 14, _hoisted_1);
-}
-__vue_sfc__.render = __vue_render__;
-var SplitTrigger_vue_default = __vue_sfc__;

package/lib/AI-panel-widget/src/components/SplitTrigger.vue.d.ts

@@ -1,18 +0,0 @@
-type __VLS_Props = {
-    open?: boolean;
-    thinking?: boolean;
-    resolvedTheme?: "light" | "dark";
-    panelWidth?: number;
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    toggle: () => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onToggle?: (() => any) | undefined;
-}>, {
-    resolvedTheme: "light" | "dark";
-    thinking: boolean;
-    open: boolean;
-    panelWidth: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;