@vite-plugin-opencode-assistant/components 1.0.37 → 1.0.39

package/es/open-code-widget/src/components/Header.vue.js

@@ -16,6 +16,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent({
       resolvedTheme,
       minimized,
       promptDockVisible,
+      mode,
       handleToggleSessionList,
       handleToggleSelectMode,
       handleToggleTheme,
@@ -23,6 +24,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent({
       handleToggleMinimize,
       handleTogglePromptDock
     } = useOpenCodeWidgetContext();
+    const isSplitMode = computed(() => mode.value === "split");
     const themeIconTitle = computed(() => {
       const themeLabels = {
         auto: "\u81EA\u52A8",
@@ -39,12 +41,12 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent({
       };
       return `\u5207\u6362\u4E3B\u9898 - \u5F53\u524D: ${themeLabels[theme.value]}`;
     });
-    const __returned__ = { title, sessionListTitle, sessionListCollapsed, selectMode, selectEnabled, theme, resolvedTheme, minimized, promptDockVisible, handleToggleSessionList, handleToggleSelectMode, handleToggleTheme, handleClose, handleToggleMinimize, handleTogglePromptDock, themeIconTitle, themeIconLabel };
+    const __returned__ = { title, sessionListTitle, sessionListCollapsed, selectMode, selectEnabled, theme, resolvedTheme, minimized, promptDockVisible, mode, handleToggleSessionList, handleToggleSelectMode, handleToggleTheme, handleClose, handleToggleMinimize, handleTogglePromptDock, isSplitMode, themeIconTitle, themeIconLabel };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
   }
 });
-import { renderSlot as _renderSlot, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, normalizeClass as _normalizeClass, toDisplayString as _toDisplayString, createStaticVNode as _createStaticVNode } from "vue";
+import { renderSlot as _renderSlot, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, normalizeClass as _normalizeClass, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createStaticVNode as _createStaticVNode } from "vue";
 const _hoisted_1 = { class: "opencode-chat-header" };
 const _hoisted_2 = { class: "opencode-chat-header-left" };
 const _hoisted_3 = ["title", "aria-label", "aria-expanded"];
@@ -203,7 +205,8 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
       /* TEXT */
     ),
     _createElementVNode("div", _hoisted_10, [
-      _createElementVNode("button", {
+      !$setup.isSplitMode ? (_openBlock(), _createElementBlock("button", {
+        key: 0,
         class: "opencode-header-btn prompt-dock",
         type: "button",
         title: $setup.promptDockVisible ? "\u9690\u85CF\u5BF9\u8BDD\u6846" : "\u663E\u793A\u5BF9\u8BDD\u6846",
@@ -230,8 +233,9 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
             /* CACHED */
           ))
         ])
-      ], 8, _hoisted_11),
-      _createElementVNode("button", {
+      ], 8, _hoisted_11)) : _createCommentVNode("v-if", true),
+      !$setup.isSplitMode ? (_openBlock(), _createElementBlock("button", {
+        key: 1,
         class: "opencode-header-btn minimize",
         type: "button",
         title: $setup.minimized ? "\u5C55\u5F00" : "\u6700\u5C0F\u5316",
@@ -258,8 +262,9 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
             )
           ])]))
         ])
-      ], 8, _hoisted_12),
-      _createElementVNode("button", {
+      ], 8, _hoisted_12)) : _createCommentVNode("v-if", true),
+      !$setup.isSplitMode ? (_openBlock(), _createElementBlock("button", {
+        key: 2,
         class: "opencode-header-btn close",
         type: "button",
         title: "\u5173\u95ED",
@@ -285,7 +290,7 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
             /* CACHED */
           ))
         ])
-      ])
+      ])) : _createCommentVNode("v-if", true)
     ])
   ]);
 }

package/es/open-code-widget/src/components/ResizeHandle-sfc.css

@@ -0,0 +1 @@
+.opencode-resize-handle{position:absolute;left:0;top:0;bottom:0;width:6px;cursor:col-resize;background:transparent;z-index:10;transition:background .2s ease}.opencode-resize-handle:hover,.opencode-resize-handle.resizing{background:var(--oc-primary-bg)}.opencode-resize-handle:after{content:"";position:absolute;left:2px;top:50%;transform:translateY(-50%);width:2px;height:40px;background:var(--oc-border-secondary);border-radius:1px;opacity:0;transition:opacity .2s ease}.opencode-resize-handle:hover:after,.opencode-resize-handle.resizing:after{opacity:1}

package/es/open-code-widget/src/components/ResizeHandle.vue.d.ts

@@ -0,0 +1,19 @@
+type __VLS_Props = {
+    width: number;
+    minWidth?: number;
+    maxWidth?: number;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    resize: (width: number) => any;
+    "resize-start": () => any;
+    "resize-end": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onResize?: ((width: number) => any) | undefined;
+    "onResize-start"?: (() => any) | undefined;
+    "onResize-end"?: (() => any) | undefined;
+}>, {
+    width: number;
+    minWidth: number;
+    maxWidth: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/es/open-code-widget/src/components/ResizeHandle.vue.js

@@ -0,0 +1,91 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import "./ResizeHandle-sfc.css";
+import { defineComponent as _defineComponent } from "vue";
+import { ref, onUnmounted } from "vue";
+const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValues({}, {
+  name: "ResizeHandle"
+}), {
+  __name: "ResizeHandle",
+  props: {
+    width: { type: Number, required: true, default: 500 },
+    minWidth: { type: Number, required: false, default: 400 },
+    maxWidth: { type: Number, required: false, default: 800 }
+  },
+  emits: ["resize", "resize-start", "resize-end"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emit = __emit;
+    const isResizing = ref(false);
+    const startX = ref(0);
+    const startWidth = ref(0);
+    const handleMouseDown = (e) => {
+      e.preventDefault();
+      isResizing.value = true;
+      startX.value = e.clientX;
+      startWidth.value = props.width;
+      emit("resize-start");
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+    };
+    const handleMouseMove = (e) => {
+      if (!isResizing.value) return;
+      const deltaX = startX.value - e.clientX;
+      const newWidth = Math.max(props.minWidth, Math.min(props.maxWidth, startWidth.value + deltaX));
+      emit("resize", newWidth);
+    };
+    const handleMouseUp = () => {
+      isResizing.value = false;
+      emit("resize-end");
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+    const handleDoubleClick = () => {
+      emit("resize", 500);
+    };
+    onUnmounted(() => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    });
+    const __returned__ = { props, emit, isResizing, startX, startWidth, handleMouseDown, handleMouseMove, handleMouseUp, handleDoubleClick };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+}));
+import { normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
+function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock(), _createElementBlock(
+    "div",
+    {
+      class: _normalizeClass(["opencode-resize-handle", { resizing: $setup.isResizing }]),
+      onMousedown: $setup.handleMouseDown,
+      onDblclick: $setup.handleDoubleClick
+    },
+    null,
+    34
+    /* CLASS, NEED_HYDRATION */
+  );
+}
+__vue_sfc__.render = __vue_render__;
+var ResizeHandle_vue_default = __vue_sfc__;
+export {
+  ResizeHandle_vue_default as default
+};

package/es/open-code-widget/src/components/SplitTrigger-sfc.css

@@ -0,0 +1 @@
+.opencode-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 rgba(59,130,246,.25);transition:right .3s ease,width .25s cubic-bezier(.4,0,.2,1),background .25s ease,box-shadow .25s ease;z-index:99998}.opencode-split-trigger:hover{width:24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:-3px 0 12px rgba(59,130,246,.35)}.opencode-split-trigger.open{width:20px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px rgba(59,130,246,.25)}.opencode-split-trigger.open:hover{width:24px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:-3px 0 12px rgba(59,130,246,.35)}.opencode-split-trigger-icon{display:flex;align-items:center;justify-content:center;transition:transform .25s ease}.opencode-split-trigger:hover .opencode-split-trigger-icon{transform:scale(1.1)}.opencode-split-thinking-indicator{position:absolute;top:6px;right:6px;width:5px;height:5px;background:var(--oc-success);border-radius:50%;animation:opencode-thinking-pulse 1.5s ease-in-out infinite;box-shadow:0 0 4px rgba(16,185,129,.5)}@keyframes opencode-thinking-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}}

package/es/open-code-widget/src/components/SplitTrigger.vue.d.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    open?: boolean;
+    thinking?: boolean;
+    resolvedTheme?: "light" | "dark";
+    panelWidth?: number;
+};
+declare const _default: 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>;
+export default _default;

package/es/open-code-widget/src/components/SplitTrigger.vue.js

@@ -0,0 +1,130 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import "./SplitTrigger-sfc.css";
+import { defineComponent as _defineComponent } from "vue";
+import { computed } from "vue";
+const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValues({}, {
+  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(() => [
+      "opencode-split-trigger",
+      {
+        open: props.open,
+        thinking: props.thinking,
+        "opencode-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: "opencode-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: "opencode-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/es/open-code-widget/src/context.d.ts

@@ -24,6 +24,7 @@ export interface OpenCodeWidgetContext {
     minimized: Ref<boolean>;
     promptDockVisible: Ref<boolean>;
     bubbleOffset: Ref<FloatingBubbleOffset | undefined>;
+    mode: Ref<"bubble" | "split">;
     sessionStates: Ref<Record<string, OpencodeSessionThinkingState>>;
     iframeSource: Ref<string>;
     buttonActive: Ref<boolean>;

package/es/open-code-widget/src/index-sfc.css

@@ -1 +1 @@
-.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-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}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-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}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:300px;height:300px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-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 rgba(59,130,246,.4),0 0 0 2px rgba(59,130,246,.2);animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--oc-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}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-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 rgba(59,130,246,.4),0 0 0 2px rgba(59,130,246,.2);animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-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){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}
+.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-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}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-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}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:300px;height:300px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-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 rgba(59,130,246,.4),0 0 0 2px rgba(59,130,246,.2);animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--oc-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}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-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 rgba(59,130,246,.4),0 0 0 2px rgba(59,130,246,.2);animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-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){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{padding-right:var(--opencode-split-width, 500px);transition:padding-right .3s ease;min-width:auto}body.has-opencode-split *:not(.opencode-chat):not(.opencode-chat *){max-width:calc(100vw - var(--opencode-split-width, 500px))!important}

package/es/open-code-widget/src/index.vue.d.ts

@@ -1,23 +1,23 @@
 import type { OpenCodeWidgetProps } from "./types";
-declare var __VLS_11: {}, __VLS_16: {}, __VLS_18: {}, __VLS_20: {}, __VLS_25: {}, __VLS_32: {}, __VLS_34: {}, __VLS_36: {}, __VLS_38: {};
+declare var __VLS_11: {}, __VLS_25: {}, __VLS_27: {}, __VLS_29: {}, __VLS_31: {}, __VLS_33: {}, __VLS_35: {}, __VLS_37: {}, __VLS_39: {};
 type __VLS_Slots = {} & {
     'button-icon'?: (props: typeof __VLS_11) => any;
 } & {
-    'session-toggle-icon'?: (props: typeof __VLS_16) => any;
+    'session-toggle-icon'?: (props: typeof __VLS_25) => any;
 } & {
-    'select-icon'?: (props: typeof __VLS_18) => any;
+    'select-icon'?: (props: typeof __VLS_27) => any;
 } & {
-    'close-icon'?: (props: typeof __VLS_20) => any;
+    'close-icon'?: (props: typeof __VLS_29) => any;
 } & {
-    'sessions-empty'?: (props: typeof __VLS_25) => any;
+    'sessions-empty'?: (props: typeof __VLS_31) => any;
 } & {
-    'empty-state'?: (props: typeof __VLS_32) => any;
+    'empty-state'?: (props: typeof __VLS_33) => any;
 } & {
-    loading?: (props: typeof __VLS_34) => any;
+    loading?: (props: typeof __VLS_35) => any;
 } & {
-    error?: (props: typeof __VLS_36) => any;
+    error?: (props: typeof __VLS_37) => any;
 } & {
-    content?: (props: typeof __VLS_38) => any;
+    content?: (props: typeof __VLS_39) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<OpenCodeWidgetProps, {
     showNotification: (message: string, options?: {
@@ -27,49 +27,9 @@ declare const __VLS_component: import("vue").DefineComponent<OpenCodeWidgetProps
     showConfirmDialog: (message: string) => Promise<boolean>;
     sendMessageToIframe: (type: string, data?: Record<string, unknown>) => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    close: () => any;
-    toggle: (value: boolean) => any;
-    "create-session": () => any;
-    "update:open": (value: boolean) => any;
-    "delete-session": (session: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetSession) => any;
-    "update:selectMode": (value: boolean) => any;
-    "update:sessionListCollapsed": (value: boolean) => any;
-    "update:currentSessionId": (value: string | null) => any;
-    "update:selectedElements": (value: import("@vite-plugin-opencode-assistant/shared").OpenCodeSelectedElement[]) => any;
-    "update:theme": (value: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetTheme) => any;
-    "update:thinking": (value: boolean) => any;
-    "toggle-session-list": (value: boolean) => any;
-    "toggle-select-mode": (value: boolean) => any;
-    "toggle-theme": (value: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetTheme) => any;
-    "select-session": (session: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetSession) => any;
-    "click-selected-node": (element: import("@vite-plugin-opencode-assistant/shared").OpenCodeSelectedElement) => any;
-    "remove-selected-node": (payload: import("@vite-plugin-opencode-assistant/shared").OpenCodeRemoveSelectedPayload) => any;
-    "clear-selected-nodes": () => any;
-    "empty-action": () => any;
-    "frame-loaded": () => any;
-    "thinking-change": (value: boolean) => any;
+    [x: string]: any;
 }, string, import("vue").PublicProps, Readonly<OpenCodeWidgetProps> & Readonly<{
-    onClose?: (() => any) | undefined;
-    onToggle?: ((value: boolean) => any) | undefined;
-    "onCreate-session"?: (() => any) | undefined;
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    "onDelete-session"?: ((session: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetSession) => any) | undefined;
-    "onUpdate:selectMode"?: ((value: boolean) => any) | undefined;
-    "onUpdate:sessionListCollapsed"?: ((value: boolean) => any) | undefined;
-    "onUpdate:currentSessionId"?: ((value: string | null) => any) | undefined;
-    "onUpdate:selectedElements"?: ((value: import("@vite-plugin-opencode-assistant/shared").OpenCodeSelectedElement[]) => any) | undefined;
-    "onUpdate:theme"?: ((value: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetTheme) => any) | undefined;
-    "onUpdate:thinking"?: ((value: boolean) => any) | undefined;
-    "onToggle-session-list"?: ((value: boolean) => any) | undefined;
-    "onToggle-select-mode"?: ((value: boolean) => any) | undefined;
-    "onToggle-theme"?: ((value: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetTheme) => any) | undefined;
-    "onSelect-session"?: ((session: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetSession) => any) | undefined;
-    "onClick-selected-node"?: ((element: import("@vite-plugin-opencode-assistant/shared").OpenCodeSelectedElement) => any) | undefined;
-    "onRemove-selected-node"?: ((payload: import("@vite-plugin-opencode-assistant/shared").OpenCodeRemoveSelectedPayload) => any) | undefined;
-    "onClear-selected-nodes"?: (() => any) | undefined;
-    "onEmpty-action"?: (() => any) | undefined;
-    "onFrame-loaded"?: (() => any) | undefined;
-    "onThinking-change"?: ((value: boolean) => any) | undefined;
+    [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
 }>, {
     frameLoading: boolean;
     showEmptyState: boolean;
@@ -82,16 +42,19 @@ declare const __VLS_component: import("vue").DefineComponent<OpenCodeWidgetProps
     selectMode: boolean;
     selectEnabled: boolean;
     theme: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetTheme;
-    selectShortcutLabel: string;
-    showClearAll: boolean;
     showSessionListSkeleton: boolean;
     sessionKey: string;
     sessions: import("@vite-plugin-opencode-assistant/shared").OpenCodeWidgetSession[];
     thinking: boolean;
+    showClearAll: boolean;
     open: boolean;
+    selectShortcutLabel: string;
     hotkeyLabel: string;
+    splitPanelWidth: number;
     currentSessionId: string | null;
     selectedElements: import("@vite-plugin-opencode-assistant/shared").OpenCodeSelectedElement[];
+    displayMode: import("@vite-plugin-opencode-assistant/shared").DisplayMode;
+    splitMode: import("@vite-plugin-opencode-assistant/shared").SplitModeOptions;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;