@vite-plugin-opencode-assistant/components 1.0.36 → 1.0.38

package/es/open-code-widget/src/index.vue.js

@@ -20,17 +20,15 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import "./index-sfc.css";
 import { useCssVars as _useCssVars, defineComponent as _defineComponent } from "vue";
 import { useSlots, toRef, ref, watch, computed, nextTick, onMounted, onUnmounted } from "vue";
-import Frame from "./components/Frame.vue.js";
-import Header from "./components/Header.vue.js";
+import ChatPanel from "./components/ChatPanel.vue.js";
 import SelectHint from "./components/SelectHint.vue.js";
-import SelectedNodes from "./components/SelectedNodes.vue.js";
-import SessionList from "./components/SessionList.vue.js";
 import Trigger from "./components/Trigger.vue.js";
 import { useSelection } from "../composables/use-selection";
 import { useSession } from "../composables/use-session";
 import { useWidget } from "../composables/use-widget";
 import { useInspector } from "../composables/use-inspector";
 import { usePersistState } from "../composables/use-persist-state";
+import { useSplitMode } from "../composables/use-split";
 import { provideOpenCodeWidgetContext } from "./context";
 const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValues({}, {
   name: "OpencodeWidget"
@@ -59,9 +57,12 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
     showClearAll: { type: Boolean, required: false, default: true },
     selectEnabled: { type: Boolean, required: false, default: true },
     thinking: { type: Boolean, required: false, default: false },
-    sessionStates: { type: Object, required: false }
+    sessionStates: { type: Object, required: false },
+    displayMode: { type: String, required: false, default: "bubble" },
+    splitMode: { type: Object, required: false, default: void 0 },
+    splitPanelWidth: { type: Number, required: false, default: 500 }
   },
-  emits: ["update:open", "update:selectMode", "update:sessionListCollapsed", "update:currentSessionId", "update:selectedElements", "update:theme", "update:thinking", "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"],
+  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 }) {
     _useCssVars((_ctx) => ({
       "-chatAnimationOrigin.x": chatAnimationOrigin.value.x,
@@ -113,6 +114,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
     const promptDockVisible = ref(true);
     const isRestoring = ref(true);
     const iframeLoaded = ref(false);
+    const splitPanelWidth = ref(props.splitPanelWidth);
     const syncStateToIframe = () => {
       if (!iframeLoaded.value) return;
       sendMessageToIframe("prompt-dock-visibility-change", { visible: promptDockVisible.value });
@@ -134,6 +136,12 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
         localSessionListCollapsed.value = val;
       }
     );
+    watch(
+      () => props.splitPanelWidth,
+      (val) => {
+        splitPanelWidth.value = val;
+      }
+    );
     const {
       buttonActive,
       containerClasses,
@@ -225,6 +233,27 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       }
     });
     const bubbleOffset = ref(void 0);
+    const {
+      effectiveMode,
+      isSplitMode,
+      panelWidth,
+      splitConfig,
+      handleResize,
+      handleToggle: handleSplitToggle
+    } = useSplitMode({
+      displayMode: toRef(props, "displayMode"),
+      splitMode: toRef(props, "splitMode"),
+      open: toRef(props, "open"),
+      onOpenChange: (nextOpen) => {
+        emit("update:open", nextOpen);
+        emit("toggle", nextOpen);
+      },
+      onWidthChange: (width) => {
+        splitPanelWidth.value = width;
+        emit("update:splitPanelWidth", width);
+        emit("split-panel-width-change", width);
+      }
+    });
     usePersistState({
       open: toRef(props, "open"),
       minimized,
@@ -232,6 +261,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       bubbleOffset,
       theme: toRef(props, "theme"),
       sessionListCollapsed: localSessionListCollapsed,
+      splitPanelWidth,
       onRestore: (state) => {
         if (state.open !== void 0 && state.open !== props.open) {
           emit("update:open", state.open);
@@ -371,6 +401,12 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
     const handleBubbleOffsetChange = (offset) => {
       bubbleOffset.value = offset;
     };
+    const handleResizeStart = () => {
+      isDragging.value = true;
+    };
+    const handleResizeEnd = () => {
+      isDragging.value = false;
+    };
     const chatAnimationOrigin = computed(() => {
       const quadrant = bubbleQuadrant.value;
       switch (quadrant) {
@@ -423,6 +459,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       minimized,
       promptDockVisible,
       bubbleOffset,
+      mode: effectiveMode,
       sessionStates: computed(() => {
         var _a;
         return (_a = props.sessionStates) != null ? _a : {};
@@ -459,36 +496,30 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       return dialogResolve;
     }, set dialogResolve(v) {
       dialogResolve = v;
-    }, showConfirmDialog, handleDialogConfirm, handleDialogCancel, frameRef, triggerRef, sendMessageToIframe, localSessionListCollapsed, minimized, promptDockVisible, isRestoring, iframeLoaded, syncStateToIframe, handleFrameLoaded, buttonActive, containerClasses, iframeSource, sessionListTitle, resolvedTheme, handleClose, handleEmptyAction, handleToggle, handleToggleSessionList, handleToggleTheme, sessionItems, handleCreateSession, handleDeleteSession, handleSelectSession, bubbleVisible, hasSelectedElements, selectedElementItems, handleClearSelectedNodes, handleClickSelectedNode, handleRemoveSelectedNode, handleToggleSelectMode, highlightVisible, highlightStyle, tooltipVisible, tooltipStyle, tooltipContent, bubbleOffset, handleToggleMinimize, handleTogglePromptDock, windowWidth, windowHeight, handleWindowResize, bubbleQuadrant, isBubbleOnRightSide, chatPositionStyle, handleBubbleOffsetChange, chatAnimationOrigin, isDragging, get wasOpenBeforeDrag() {
+    }, showConfirmDialog, handleDialogConfirm, handleDialogCancel, frameRef, triggerRef, sendMessageToIframe, localSessionListCollapsed, minimized, promptDockVisible, isRestoring, iframeLoaded, splitPanelWidth, syncStateToIframe, handleFrameLoaded, buttonActive, containerClasses, iframeSource, sessionListTitle, resolvedTheme, handleClose, handleEmptyAction, handleToggle, handleToggleSessionList, handleToggleTheme, sessionItems, handleCreateSession, handleDeleteSession, handleSelectSession, bubbleVisible, hasSelectedElements, selectedElementItems, handleClearSelectedNodes, handleClickSelectedNode, handleRemoveSelectedNode, handleToggleSelectMode, highlightVisible, highlightStyle, tooltipVisible, tooltipStyle, tooltipContent, bubbleOffset, effectiveMode, isSplitMode, panelWidth, splitConfig, handleResize, handleSplitToggle, handleToggleMinimize, handleTogglePromptDock, windowWidth, windowHeight, handleWindowResize, bubbleQuadrant, isBubbleOnRightSide, chatPositionStyle, handleBubbleOffsetChange, handleResizeStart, handleResizeEnd, chatAnimationOrigin, isDragging, get wasOpenBeforeDrag() {
       return wasOpenBeforeDrag;
     }, set wasOpenBeforeDrag(v) {
       wasOpenBeforeDrag = v;
-    }, handleDragStart, handleDragEnd, Frame, Header, SelectHint, SelectedNodes, SessionList, Trigger };
+    }, handleDragStart, handleDragEnd, ChatPanel, SelectHint, Trigger };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
   }
 }));
-import { renderSlot as _renderSlot, withCtx as _withCtx, createSlots as _createSlots, createVNode as _createVNode, toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, createElementVNode as _createElementVNode, vShow as _vShow, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, withDirectives as _withDirectives, Teleport as _Teleport, createBlock as _createBlock } from "vue";
-const _hoisted_1 = {
-  key: 0,
-  class: "opencode-notification",
-  role: "alert"
-};
-const _hoisted_2 = { class: "opencode-chat-content" };
-const _hoisted_3 = { class: "opencode-tooltip-tag" };
-const _hoisted_4 = { class: "opencode-tooltip-file" };
-const _hoisted_5 = {
-  key: 0,
+import { renderSlot as _renderSlot, withCtx as _withCtx, createSlots as _createSlots, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createElementVNode as _createElementVNode, createVNode as _createVNode, vShow as _vShow, normalizeStyle as _normalizeStyle, withDirectives as _withDirectives, toDisplayString as _toDisplayString, createElementBlock as _createElementBlock, Teleport as _Teleport, normalizeClass as _normalizeClass } from "vue";
+const _hoisted_1 = { class: "opencode-tooltip-tag" };
+const _hoisted_2 = { class: "opencode-tooltip-file" };
+const _hoisted_3 = {
+  key: 1,
   class: "opencode-dialog-overlay"
 };
-const _hoisted_6 = {
+const _hoisted_4 = {
   class: "opencode-dialog",
   role: "alertdialog",
   "aria-modal": "true"
 };
-const _hoisted_7 = { class: "opencode-dialog-content" };
-const _hoisted_8 = { class: "opencode-dialog-message" };
-const _hoisted_9 = {
+const _hoisted_5 = { class: "opencode-dialog-content" };
+const _hoisted_6 = { class: "opencode-dialog-message" };
+const _hoisted_7 = {
   key: 0,
   class: "opencode-page-notification",
   role: "alert"
@@ -500,9 +531,10 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
       class: _normalizeClass($setup.containerClasses)
     },
     [
-      _createVNode(
+      !$setup.isSplitMode ? (_openBlock(), _createBlock(
         $setup["Trigger"],
         {
+          key: 0,
           ref: "triggerRef",
           onDragStart: $setup.handleDragStart,
           onDragEnd: $setup.handleDragEnd
@@ -521,116 +553,94 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
         ]),
         1536
         /* NEED_PATCH, DYNAMIC_SLOTS */
-      ),
-      _withDirectives(_createElementVNode(
-        "div",
-        {
-          class: _normalizeClass(["opencode-chat", { open: $props.open, minimized: $setup.minimized, dragging: $setup.isDragging, "no-transition": $setup.isRestoring }]),
-          style: _normalizeStyle($setup.chatPositionStyle)
-        },
-        [
-          _createVNode(
-            $setup["Header"],
-            null,
-            _createSlots({
-              _: 2
-              /* DYNAMIC */
-            }, [
-              $setup.slots["session-toggle-icon"] ? {
-                name: "session-toggle-icon",
-                fn: _withCtx(() => [
-                  _renderSlot(_ctx.$slots, "session-toggle-icon")
-                ]),
-                key: "0"
-              } : void 0,
-              $setup.slots["select-icon"] ? {
-                name: "select-icon",
-                fn: _withCtx(() => [
-                  _renderSlot(_ctx.$slots, "select-icon")
-                ]),
-                key: "1"
-              } : void 0,
-              $setup.slots["close-icon"] ? {
-                name: "close-icon",
-                fn: _withCtx(() => [
-                  _renderSlot(_ctx.$slots, "close-icon")
-                ]),
-                key: "2"
-              } : void 0
-            ]),
-            1024
-            /* DYNAMIC_SLOTS */
-          ),
-          $setup.notificationVisible && $setup.notificationMode === "widget" ? (_openBlock(), _createElementBlock(
-            "div",
-            _hoisted_1,
-            _toDisplayString($setup.notificationMessage),
-            1
-            /* TEXT */
-          )) : _createCommentVNode("v-if", true),
-          _createElementVNode("div", _hoisted_2, [
-            _createVNode($setup["SessionList"], null, {
-              empty: _withCtx(() => [
-                _renderSlot(_ctx.$slots, "sessions-empty", {}, () => [
-                  _cache[0] || (_cache[0] = _createElementVNode(
-                    "div",
-                    { class: "opencode-session-empty" },
-                    "\u6682\u65E0\u4F1A\u8BDD",
-                    -1
-                    /* CACHED */
-                  ))
-                ])
-              ]),
-              _: 3
-              /* FORWARDED */
-            }),
-            _createVNode(
-              $setup["Frame"],
-              { ref: "frameRef" },
-              _createSlots({
-                _: 2
-                /* DYNAMIC */
-              }, [
-                $setup.slots["empty-state"] ? {
-                  name: "empty-state",
-                  fn: _withCtx(() => [
-                    _renderSlot(_ctx.$slots, "empty-state")
-                  ]),
-                  key: "0"
-                } : void 0,
-                $setup.slots.loading ? {
-                  name: "loading",
-                  fn: _withCtx(() => [
-                    _renderSlot(_ctx.$slots, "loading")
-                  ]),
-                  key: "1"
-                } : void 0,
-                $setup.slots.error ? {
-                  name: "error",
-                  fn: _withCtx(() => [
-                    _renderSlot(_ctx.$slots, "error")
-                  ]),
-                  key: "2"
-                } : void 0,
-                $setup.slots.content ? {
-                  name: "content",
-                  fn: _withCtx(() => [
-                    _renderSlot(_ctx.$slots, "content")
-                  ]),
-                  key: "3"
-                } : void 0
-              ]),
-              1536
-              /* NEED_PATCH, DYNAMIC_SLOTS */
-            ),
-            _createVNode($setup["SelectedNodes"])
+      )) : _createCommentVNode("v-if", true),
+      _createVNode($setup["ChatPanel"], {
+        ref: "frameRef",
+        mode: $setup.effectiveMode,
+        open: $props.open,
+        minimized: $setup.minimized,
+        "position-style": $setup.chatPositionStyle,
+        "animation-origin": $setup.chatAnimationOrigin,
+        "panel-width": $setup.panelWidth,
+        resizable: $setup.splitConfig.resizable,
+        "min-width": $setup.splitConfig.minWidth,
+        "max-width": $setup.splitConfig.maxWidth,
+        "no-transition": $setup.isRestoring,
+        dragging: $setup.isDragging,
+        "notification-visible": $setup.notificationVisible,
+        "notification-message": $setup.notificationMessage,
+        "notification-mode": $setup.notificationMode,
+        thinking: $props.thinking,
+        "resolved-theme": $setup.resolvedTheme,
+        onResize: $setup.handleResize,
+        onResizeStart: $setup.handleResizeStart,
+        onResizeEnd: $setup.handleResizeEnd,
+        onToggle: $setup.handleSplitToggle
+      }, _createSlots({
+        "sessions-empty": _withCtx(() => [
+          _renderSlot(_ctx.$slots, "sessions-empty", {}, () => [
+            _cache[0] || (_cache[0] = _createElementVNode(
+              "div",
+              { class: "opencode-session-empty" },
+              "\u6682\u65E0\u4F1A\u8BDD",
+              -1
+              /* CACHED */
+            ))
           ])
-        ],
-        6
-        /* CLASS, STYLE */
-      ), [
-        [_vShow, !$props.selectMode]
-      ]),
+        ]),
+        _: 2
+        /* DYNAMIC */
+      }, [
+        $setup.slots["session-toggle-icon"] ? {
+          name: "session-toggle-icon",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "session-toggle-icon")
+          ]),
+          key: "0"
+        } : void 0,
+        $setup.slots["select-icon"] ? {
+          name: "select-icon",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "select-icon")
+          ]),
+          key: "1"
+        } : void 0,
+        $setup.slots["close-icon"] ? {
+          name: "close-icon",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "close-icon")
+          ]),
+          key: "2"
+        } : void 0,
+        $setup.slots["empty-state"] ? {
+          name: "empty-state",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "empty-state")
+          ]),
+          key: "3"
+        } : void 0,
+        $setup.slots.loading ? {
+          name: "loading",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "loading")
+          ]),
+          key: "4"
+        } : void 0,
+        $setup.slots.error ? {
+          name: "error",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "error")
+          ]),
+          key: "5"
+        } : void 0,
+        $setup.slots.content ? {
+          name: "content",
+          fn: _withCtx(() => [
+            _renderSlot(_ctx.$slots, "content")
+          ]),
+          key: "6"
+        } : void 0
+      ]), 1032, ["mode", "open", "minimized", "position-style", "animation-origin", "panel-width", "resizable", "min-width", "max-width", "no-transition", "dragging", "notification-visible", "notification-message", "notification-mode", "thinking", "resolved-theme", "onResize", "onToggle"]),
       _createVNode($setup["SelectHint"]),
       _withDirectives(_createElementVNode(
         "div",
@@ -653,14 +663,14 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
         [
           _createElementVNode(
             "div",
-            _hoisted_3,
+            _hoisted_1,
             _toDisplayString($setup.tooltipContent.description),
             1
             /* TEXT */
           ),
           _createElementVNode(
             "div",
-            _hoisted_4,
+            _hoisted_2,
             _toDisplayString($setup.tooltipContent.fileInfo),
             1
             /* TEXT */
@@ -671,12 +681,12 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
       ), [
         [_vShow, $setup.tooltipVisible]
       ]),
-      $setup.dialogVisible ? (_openBlock(), _createElementBlock("div", _hoisted_5, [
-        _createElementVNode("div", _hoisted_6, [
-          _createElementVNode("div", _hoisted_7, [
+      $setup.dialogVisible ? (_openBlock(), _createElementBlock("div", _hoisted_3, [
+        _createElementVNode("div", _hoisted_4, [
+          _createElementVNode("div", _hoisted_5, [
             _createElementVNode(
               "div",
-              _hoisted_8,
+              _hoisted_6,
               _toDisplayString($setup.dialogMessage),
               1
               /* TEXT */
@@ -697,7 +707,7 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
       (_openBlock(), _createBlock(_Teleport, { to: "body" }, [
         $setup.notificationVisible && $setup.notificationMode === "page" ? (_openBlock(), _createElementBlock(
           "div",
-          _hoisted_9,
+          _hoisted_7,
           _toDisplayString($setup.notificationMessage),
           1
           /* TEXT */

package/es/open-code-widget/src/types.d.ts

@@ -1,2 +1,2 @@
-export type { OpenCodeWidgetTheme, OpenCodeWidgetSession, OpenCodeSelectedElement, OpenCodeRemoveSelectedPayload, OpenCodeWidgetSessionItem, OpenCodeSelectedElementItem, OpenCodeWidgetProps, OpenCodeWidgetEmits, OpencodeSessionThinkingState, } from "@vite-plugin-opencode-assistant/shared";
+export type { OpenCodeWidgetTheme, OpenCodeWidgetSession, OpenCodeSelectedElement, OpenCodeRemoveSelectedPayload, OpenCodeWidgetSessionItem, OpenCodeSelectedElementItem, OpenCodeWidgetProps, OpenCodeWidgetEmits, OpencodeSessionThinkingState, DisplayMode, SplitModeOptions, } from "@vite-plugin-opencode-assistant/shared";
 export type OpenCodeWidgetThemeLocal = "light" | "dark" | "auto";