@vite-plugin-opencode-assistant/components 1.0.25 → 1.0.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/es/index.d.ts +1 -1
  2. package/es/index.js +1 -1
  3. package/es/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.d.ts +0 -1
  4. package/es/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.js +15 -41
  5. package/es/open-code-widget/src/components/Trigger.vue.d.ts +4 -5
  6. package/es/open-code-widget/src/components/Trigger.vue.js +4 -15
  7. package/es/open-code-widget/src/index-sfc.css +1 -1
  8. package/es/open-code-widget/src/index.vue.js +46 -9
  9. package/lib/@vite-plugin-opencode-assistant/components.cjs.js +69 -74
  10. package/lib/@vite-plugin-opencode-assistant/components.es.js +70 -75
  11. package/lib/components.css +1 -1
  12. package/lib/index.d.ts +1 -1
  13. package/lib/index.js +1 -1
  14. package/lib/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.d.ts +0 -1
  15. package/lib/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.js +14 -40
  16. package/lib/open-code-widget/src/components/Trigger.vue.d.ts +4 -5
  17. package/lib/open-code-widget/src/components/Trigger.vue.js +3 -14
  18. package/lib/open-code-widget/src/index-sfc.css +1 -1
  19. package/lib/open-code-widget/src/index.vue.js +45 -8
  20. package/lib/web-types.json +1 -1
  21. package/package.json +2 -2
package/es/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import OpenCodeWidget from './open-code-widget';
2
2
  import type { App } from 'vue';
3
- declare const version = "1.0.25";
3
+ declare const version = "1.0.26";
4
4
  declare function install(app: App<any>, options?: any): void;
5
5
  export { install, version, OpenCodeWidget };
6
6
  export default install;
package/es/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import OpenCodeWidget from "./open-code-widget";
2
- const version = "1.0.25";
2
+ const version = "1.0.26";
3
3
  function install(app, options) {
4
4
  const components = [
5
5
  OpenCodeWidget
package/es/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.d.ts CHANGED
@@ -11,7 +11,6 @@ type __VLS_Slots = {} & {
11
11
  default?: (props: typeof __VLS_5) => any;
12
12
  };
13
13
  declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
14
- isOnRightSide: import("vue").ComputedRef<boolean>;
15
14
  offset: import("vue").ComputedRef<{
16
15
  x: number;
17
16
  y: number;
package/es/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.js CHANGED
@@ -36,26 +36,12 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
36
36
  const props = __props;
37
37
  const emit = __emit;
38
38
  const rootRef = ref(null);
39
- const getInitialState = () => {
40
- if (props.offset) {
41
- return {
42
- x: props.offset.x,
43
- y: props.offset.y,
44
- width: 0,
45
- height: 0
46
- };
47
- }
48
- if (typeof window !== "undefined") {
49
- return {
50
- x: window.innerWidth - 42 - 24,
51
- y: window.innerHeight - 42 - 24,
52
- width: 0,
53
- height: 0
54
- };
55
- }
56
- return { x: 0, y: 0, width: 0, height: 0 };
57
- };
58
- const state = ref(getInitialState());
39
+ const state = ref({
40
+ x: 0,
41
+ y: 0,
42
+ width: 0,
43
+ height: 0
44
+ });
59
45
  const isObject = (val) => val !== null && typeof val === "object";
60
46
  const gapX = computed(
61
47
  () => isObject(props.gap) ? props.gap.x : props.gap
@@ -78,20 +64,16 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
78
64
  const x = `${state.value.x}px`;
79
65
  const y = `${state.value.y}px`;
80
66
  style.transform = `translate3d(${x}, ${y}, 0)`;
81
- if (dragging.value) {
67
+ if (dragging.value || !initialized.value) {
82
68
  style.transition = "none";
83
69
  } else {
84
70
  style.transition = "transform 0.3s ease";
85
71
  }
86
72
  return style;
87
73
  });
88
- const show = ref(true);
89
74
  const updateState = () => {
90
- if (!show.value || !rootRef.value || typeof window === "undefined") return;
75
+ if (!rootRef.value || typeof window === "undefined") return;
91
76
  const rect = rootRef.value.getBoundingClientRect();
92
- if (rect.width === 0 || rect.height === 0) {
93
- return;
94
- }
95
77
  const { offset } = props;
96
78
  let x = offset ? offset.x : windowWidth.value - rect.width - gapX.value;
97
79
  let y = offset ? offset.y : windowHeight.value - rect.height - gapY.value;
@@ -227,11 +209,9 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
227
209
  }
228
210
  };
229
211
  onMounted(() => {
212
+ updateState();
230
213
  requestAnimationFrame(() => {
231
- updateState();
232
- requestAnimationFrame(() => {
233
- initialized.value = true;
234
- });
214
+ initialized.value = true;
235
215
  });
236
216
  if (typeof window !== "undefined") {
237
217
  window.addEventListener("resize", handleResize);
@@ -257,14 +237,10 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
257
237
  updateState,
258
238
  { deep: true }
259
239
  );
260
- const isOnRightSide = computed(() => {
261
- return state.value.x > windowWidth.value / 2;
262
- });
263
240
  __expose({
264
- isOnRightSide,
265
241
  offset: computed(() => ({ x: state.value.x, y: state.value.y }))
266
242
  });
267
- const __returned__ = { props, emit, rootRef, getInitialState, state, isObject, gapX, gapY, windowWidth, windowHeight, boundary, dragging, initialized, rootStyle, show, updateState, touch, get prevX() {
243
+ const __returned__ = { props, emit, rootRef, state, isObject, gapX, gapY, windowWidth, windowHeight, boundary, dragging, initialized, rootStyle, updateState, touch, get prevX() {
268
244
  return prevX;
269
245
  }, set prevX(v) {
270
246
  prevX = v;
@@ -272,15 +248,15 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
272
248
  return prevY;
273
249
  }, set prevY(v) {
274
250
  prevY = v;
275
- }, onTouchStart, onTouchMove, closest, onTouchEnd, onClick, handleResize, isOnRightSide };
251
+ }, onTouchStart, onTouchMove, closest, onTouchEnd, onClick, handleResize };
276
252
  Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
277
253
  return __returned__;
278
254
  }
279
255
  }));
280
- import { renderSlot as _renderSlot, vShow as _vShow, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, withDirectives as _withDirectives, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
256
+ import { renderSlot as _renderSlot, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
281
257
  function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
282
258
  return _openBlock(), _createBlock(_Teleport, { to: $props.teleport }, [
283
- _withDirectives(_createElementVNode(
259
+ _createElementVNode(
284
260
  "div",
285
261
  {
286
262
  ref: "rootRef",
@@ -297,9 +273,7 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
297
273
  ],
298
274
  36
299
275
  /* STYLE, NEED_HYDRATION */
300
- ), [
301
- [_vShow, $setup.show && $setup.initialized]
302
- ])
276
+ )
303
277
  ], 8, ["to"]);
304
278
  }
305
279
  __vue_sfc__.render = __vue_render__;
package/es/open-code-widget/src/components/Trigger.vue.d.ts CHANGED
@@ -4,20 +4,19 @@ type __VLS_Slots = {} & {
4
4
  default?: (props: typeof __VLS_13) => any;
5
5
  };
6
6
  declare const __VLS_component: import("vue").DefineComponent<{}, {
7
- isOnRightSide: import("vue").ComputedRef<boolean>;
8
7
  offset: import("vue").Ref<{
9
8
  x: number;
10
9
  y: number;
11
- }, FloatingBubbleOffset | {
10
+ } | undefined, FloatingBubbleOffset | {
12
11
  x: number;
13
12
  y: number;
14
- }>;
13
+ } | undefined>;
15
14
  }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
16
- "offset-change": (offset: FloatingBubbleOffset) => any;
15
+ "offset-change": (offset: FloatingBubbleOffset | undefined) => any;
17
16
  "drag-start": () => any;
18
17
  "drag-end": () => any;
19
18
  }, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
20
- "onOffset-change"?: ((offset: FloatingBubbleOffset) => any) | undefined;
19
+ "onOffset-change"?: ((offset: FloatingBubbleOffset | undefined) => any) | undefined;
21
20
  "onDrag-start"?: (() => any) | undefined;
22
21
  "onDrag-end"?: (() => any) | undefined;
23
22
  }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
package/es/open-code-widget/src/components/Trigger.vue.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import "./Trigger-sfc.css";
2
2
  import { defineComponent as _defineComponent } from "vue";
3
- import { ref, computed, onMounted } from "vue";
3
+ import { ref, watch } from "vue";
4
4
  import { useOpenCodeWidgetContext } from "../context";
5
5
  import FloatingBubble from "./FloatingBubble/FloatingBubble.vue.js";
6
6
  const STORAGE_KEY = "opencode-bubble-offset";
@@ -27,7 +27,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent({
27
27
  }
28
28
  } catch (e) {
29
29
  }
30
- return { x: 0, y: 0 };
30
+ return void 0;
31
31
  };
32
32
  const offset = ref(loadOffset());
33
33
  const emit = __emit;
@@ -42,22 +42,11 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent({
42
42
  saveOffset(value);
43
43
  emit("offset-change", value);
44
44
  };
45
- const bubbleRef = ref(null);
46
- const isOnRightSide = computed(() => {
47
- if (typeof window === "undefined") return true;
48
- const centerX = window.innerWidth / 2;
49
- return offset.value.x > centerX;
50
- });
51
- onMounted(() => {
52
- if (offset.value.x !== 0 || offset.value.y !== 0) {
53
- emit("offset-change", offset.value);
54
- }
55
- });
45
+ watch(offset, handleOffsetChange, { immediate: true });
56
46
  __expose({
57
- isOnRightSide,
58
47
  offset
59
48
  });
60
- const __returned__ = { active, open, hotkeyLabel, thinking, resolvedTheme, handleToggle, STORAGE_KEY, loadOffset, offset, emit, saveOffset, handleOffsetChange, bubbleRef, isOnRightSide, FloatingBubble };
49
+ const __returned__ = { active, open, hotkeyLabel, thinking, resolvedTheme, handleToggle, STORAGE_KEY, loadOffset, offset, emit, saveOffset, handleOffsetChange, FloatingBubble };
61
50
  Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
62
51
  return __returned__;
63
52
  }
package/es/open-code-widget/src/index-sfc.css CHANGED
@@ -1 +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:translateY(20px) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.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-chat.open{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.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;display:none;transition:all .1s ease;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;display:none;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)}}
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.minimized{width:300px;height:300px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.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;display:none;transition:all .1s ease;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;display:none;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)}}
package/es/open-code-widget/src/index.vue.js CHANGED
@@ -18,7 +18,7 @@ var __spreadValues = (a, b) => {
18
18
  };
19
19
  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
20
  import "./index-sfc.css";
21
- import { defineComponent as _defineComponent } from "vue";
21
+ import { useCssVars as _useCssVars, defineComponent as _defineComponent } from "vue";
22
22
  import { useSlots, toRef, ref, watch, computed } from "vue";
23
23
  import Frame from "./components/Frame.vue.js";
24
24
  import Header from "./components/Header.vue.js";
@@ -61,6 +61,10 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
61
61
  },
62
62
  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"],
63
63
  setup(__props, { expose: __expose, emit: __emit }) {
64
+ _useCssVars((_ctx) => ({
65
+ "-chatAnimationOrigin.x": chatAnimationOrigin.value.x,
66
+ "-chatAnimationOrigin.y": chatAnimationOrigin.value.y
67
+ }));
64
68
  const props = __props;
65
69
  const emit = __emit;
66
70
  const slots = useSlots();
@@ -219,13 +223,31 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
219
223
  promptDockVisible.value = !promptDockVisible.value;
220
224
  sendMessageToIframe("prompt-dock-visibility-change", { visible: promptDockVisible.value });
221
225
  };
222
- const bubbleOffset = ref({ x: 0, y: 0 });
223
- const isBubbleOnRightSide = computed(() => {
224
- if (typeof window === "undefined") return true;
226
+ const bubbleOffset = ref(void 0);
227
+ const bubbleQuadrant = computed(() => {
228
+ var _a, _b, _c, _d;
229
+ if (typeof window === "undefined") return "bottom-right";
225
230
  const centerX = window.innerWidth / 2;
226
- return bubbleOffset.value.x > centerX;
231
+ const centerY = window.innerHeight / 2;
232
+ const bubbleSize = 44;
233
+ const effectiveX = ((_b = (_a = bubbleOffset.value) == null ? void 0 : _a.x) != null ? _b : window.innerWidth - bubbleSize - 24) + bubbleSize / 2;
234
+ const effectiveY = ((_d = (_c = bubbleOffset.value) == null ? void 0 : _c.y) != null ? _d : window.innerHeight - bubbleSize - 24) + bubbleSize / 2;
235
+ if (effectiveX >= centerX && effectiveY >= centerY) {
236
+ return "bottom-right";
237
+ } else if (effectiveX < centerX && effectiveY >= centerY) {
238
+ return "bottom-left";
239
+ } else if (effectiveX >= centerX && effectiveY < centerY) {
240
+ return "top-right";
241
+ } else {
242
+ return "top-left";
243
+ }
244
+ });
245
+ const isBubbleOnRightSide = computed(() => {
246
+ const quadrant = bubbleQuadrant.value;
247
+ return quadrant === "top-right" || quadrant === "bottom-right";
227
248
  });
228
249
  const chatPositionStyle = computed(() => {
250
+ var _a;
229
251
  if (typeof window === "undefined") return {};
230
252
  const windowWidth = window.innerWidth;
231
253
  const windowHeight = window.innerHeight;
@@ -234,9 +256,10 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
234
256
  const gap = 24;
235
257
  const bubbleSize = 44;
236
258
  const screenMargin = 20;
259
+ const effectiveOffset = (_a = bubbleOffset.value) != null ? _a : { x: windowWidth - bubbleSize - gap, y: windowHeight - bubbleSize - gap };
237
260
  const style = {};
238
261
  if (isBubbleOnRightSide.value) {
239
- let rightPos = windowWidth - bubbleOffset.value.x + gap;
262
+ let rightPos = windowWidth - effectiveOffset.x + gap;
240
263
  const maxRight = windowWidth - chatWidth - screenMargin;
241
264
  if (rightPos > maxRight) {
242
265
  rightPos = maxRight;
@@ -244,7 +267,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
244
267
  style.right = `${rightPos}px`;
245
268
  style.left = "auto";
246
269
  } else {
247
- let leftPos = bubbleOffset.value.x + bubbleSize + gap;
270
+ let leftPos = effectiveOffset.x + bubbleSize + gap;
248
271
  const maxLeft = windowWidth - chatWidth - screenMargin;
249
272
  if (leftPos > maxLeft) {
250
273
  leftPos = maxLeft;
@@ -252,7 +275,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
252
275
  style.left = `${leftPos}px`;
253
276
  style.right = "auto";
254
277
  }
255
- let bottomPos = windowHeight - bubbleOffset.value.y - bubbleSize;
278
+ let bottomPos = windowHeight - effectiveOffset.y - bubbleSize;
256
279
  const maxBottom = windowHeight - chatHeight - screenMargin;
257
280
  if (bottomPos > maxBottom) {
258
281
  bottomPos = maxBottom;
@@ -266,6 +289,20 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
266
289
  const handleBubbleOffsetChange = (offset) => {
267
290
  bubbleOffset.value = offset;
268
291
  };
292
+ const chatAnimationOrigin = computed(() => {
293
+ const quadrant = bubbleQuadrant.value;
294
+ switch (quadrant) {
295
+ case "top-left":
296
+ return { x: "-20px", y: "-20px" };
297
+ case "top-right":
298
+ return { x: "20px", y: "-20px" };
299
+ case "bottom-left":
300
+ return { x: "-20px", y: "20px" };
301
+ case "bottom-right":
302
+ default:
303
+ return { x: "20px", y: "20px" };
304
+ }
305
+ });
269
306
  const isDragging = ref(false);
270
307
  let wasOpenBeforeDrag = false;
271
308
  const handleDragStart = () => {
@@ -334,7 +371,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
334
371
  return dialogResolve;
335
372
  }, set dialogResolve(v) {
336
373
  dialogResolve = v;
337
- }, showConfirmDialog, handleDialogConfirm, handleDialogCancel, frameRef, triggerRef, sendMessageToIframe, handleFrameLoaded, localSessionListCollapsed, minimized, promptDockVisible, 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, handleToggleMinimize, handleTogglePromptDock, bubbleOffset, isBubbleOnRightSide, chatPositionStyle, handleBubbleOffsetChange, isDragging, get wasOpenBeforeDrag() {
374
+ }, showConfirmDialog, handleDialogConfirm, handleDialogCancel, frameRef, triggerRef, sendMessageToIframe, handleFrameLoaded, localSessionListCollapsed, minimized, promptDockVisible, 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, handleToggleMinimize, handleTogglePromptDock, bubbleOffset, bubbleQuadrant, isBubbleOnRightSide, chatPositionStyle, handleBubbleOffsetChange, chatAnimationOrigin, isDragging, get wasOpenBeforeDrag() {
338
375
  return wasOpenBeforeDrag;
339
376
  }, set wasOpenBeforeDrag(v) {
340
377
  wasOpenBeforeDrag = v;
package/lib/@vite-plugin-opencode-assistant/components.cjs.js CHANGED
@@ -592,27 +592,12 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
592
592
  const props = __props;
593
593
  const emit = __emit;
594
594
  const rootRef = (0, vue.ref)(null);
595
- const getInitialState = () => {
596
- if (props.offset) return {
597
- x: props.offset.x,
598
- y: props.offset.y,
599
- width: 0,
600
- height: 0
601
- };
602
- if (typeof window !== "undefined") return {
603
- x: window.innerWidth - 42 - 24,
604
- y: window.innerHeight - 42 - 24,
605
- width: 0,
606
- height: 0
607
- };
608
- return {
609
- x: 0,
610
- y: 0,
611
- width: 0,
612
- height: 0
613
- };
614
- };
615
- const state = (0, vue.ref)(getInitialState());
595
+ const state = (0, vue.ref)({
596
+ x: 0,
597
+ y: 0,
598
+ width: 0,
599
+ height: 0
600
+ });
616
601
  const isObject = (val) => val !== null && typeof val === "object";
617
602
  const gapX = (0, vue.computed)(() => isObject(props.gap) ? props.gap.x : props.gap);
618
603
  const gapY = (0, vue.computed)(() => isObject(props.gap) ? props.gap.y : props.gap);
@@ -629,15 +614,13 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
629
614
  const rootStyle = (0, vue.computed)(() => {
630
615
  const style = {};
631
616
  style.transform = `translate3d(${`${state.value.x}px`}, ${`${state.value.y}px`}, 0)`;
632
- if (dragging.value) style.transition = "none";
617
+ if (dragging.value || !initialized.value) style.transition = "none";
633
618
  else style.transition = "transform 0.3s ease";
634
619
  return style;
635
620
  });
636
- const show = (0, vue.ref)(true);
637
621
  const updateState = () => {
638
- if (!show.value || !rootRef.value || typeof window === "undefined") return;
622
+ if (!rootRef.value || typeof window === "undefined") return;
639
623
  const rect = rootRef.value.getBoundingClientRect();
640
- if (rect.width === 0 || rect.height === 0) return;
641
624
  const { offset } = props;
642
625
  let x = offset ? offset.x : windowWidth.value - rect.width - gapX.value;
643
626
  let y = offset ? offset.y : windowHeight.value - rect.height - gapY.value;
@@ -759,11 +742,9 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
759
742
  }
760
743
  };
761
744
  (0, vue.onMounted)(() => {
745
+ updateState();
762
746
  requestAnimationFrame(() => {
763
- updateState();
764
- requestAnimationFrame(() => {
765
- initialized.value = true;
766
- });
747
+ initialized.value = true;
767
748
  });
768
749
  if (typeof window !== "undefined") window.addEventListener("resize", handleResize);
769
750
  if (rootRef.value) rootRef.value.addEventListener("touchmove", onTouchMove, { passive: false });
@@ -783,21 +764,14 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
783
764
  gapY,
784
765
  () => props.offset
785
766
  ], updateState, { deep: true });
786
- const isOnRightSide = (0, vue.computed)(() => {
787
- return state.value.x > windowWidth.value / 2;
788
- });
789
- __expose({
790
- isOnRightSide,
791
- offset: (0, vue.computed)(() => ({
792
- x: state.value.x,
793
- y: state.value.y
794
- }))
795
- });
767
+ __expose({ offset: (0, vue.computed)(() => ({
768
+ x: state.value.x,
769
+ y: state.value.y
770
+ })) });
796
771
  const __returned__ = {
797
772
  props,
798
773
  emit,
799
774
  rootRef,
800
- getInitialState,
801
775
  state,
802
776
  isObject,
803
777
  gapX,
@@ -808,7 +782,6 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
808
782
  dragging,
809
783
  initialized,
810
784
  rootStyle,
811
- show,
812
785
  updateState,
813
786
  touch,
814
787
  get prevX() {
@@ -828,8 +801,7 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
828
801
  closest,
829
802
  onTouchEnd,
830
803
  onClick,
831
- handleResize,
832
- isOnRightSide
804
+ handleResize
833
805
  };
834
806
  Object.defineProperty(__returned__, "__isScriptSetup", {
835
807
  enumerable: false,
@@ -839,7 +811,7 @@ var __vue_sfc__$2 = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps$1(__s
839
811
  }
840
812
  }));
841
813
  function __vue_render__$2(_ctx, _cache, $props, $setup, $data, $options) {
842
- return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Teleport, { to: $props.teleport }, [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
814
+ return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Teleport, { to: $props.teleport }, [(0, vue.createElementVNode)("div", {
843
815
  ref: "rootRef",
844
816
  class: "floating-bubble",
845
817
  style: (0, vue.normalizeStyle)($setup.rootStyle),
@@ -848,7 +820,7 @@ function __vue_render__$2(_ctx, _cache, $props, $setup, $data, $options) {
848
820
  onTouchcancel: $setup.onTouchEnd,
849
821
  onMousedown: $setup.onTouchStart,
850
822
  onClickCapture: $setup.onClick
851
- }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 36), [[vue.vShow, $setup.show && $setup.initialized]])], 8, ["to"]);
823
+ }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 36)], 8, ["to"]);
852
824
  }
853
825
  __vue_sfc__$2.render = __vue_render__$2;
854
826
  var FloatingBubble_vue_default = __vue_sfc__$2;
@@ -872,10 +844,6 @@ var __vue_sfc__$1 = /* @__PURE__ */ (0, vue.defineComponent)({
872
844
  if (parsed && (parsed.x !== 0 || parsed.y !== 0)) return parsed;
873
845
  }
874
846
  } catch (e) {}
875
- return {
876
- x: 0,
877
- y: 0
878
- };
879
847
  };
880
848
  const offset = (0, vue.ref)(loadOffset());
881
849
  const emit = __emit;
@@ -889,19 +857,8 @@ var __vue_sfc__$1 = /* @__PURE__ */ (0, vue.defineComponent)({
889
857
  saveOffset(value);
890
858
  emit("offset-change", value);
891
859
  };
892
- const bubbleRef = (0, vue.ref)(null);
893
- const isOnRightSide = (0, vue.computed)(() => {
894
- if (typeof window === "undefined") return true;
895
- const centerX = window.innerWidth / 2;
896
- return offset.value.x > centerX;
897
- });
898
- (0, vue.onMounted)(() => {
899
- if (offset.value.x !== 0 || offset.value.y !== 0) emit("offset-change", offset.value);
900
- });
901
- __expose({
902
- isOnRightSide,
903
- offset
904
- });
860
+ (0, vue.watch)(offset, handleOffsetChange, { immediate: true });
861
+ __expose({ offset });
905
862
  const __returned__ = {
906
863
  active,
907
864
  open,
@@ -915,8 +872,6 @@ var __vue_sfc__$1 = /* @__PURE__ */ (0, vue.defineComponent)({
915
872
  emit,
916
873
  saveOffset,
917
874
  handleOffsetChange,
918
- bubbleRef,
919
- isOnRightSide,
920
875
  FloatingBubble: FloatingBubble_vue_default
921
876
  };
922
877
  Object.defineProperty(__returned__, "__isScriptSetup", {
@@ -1787,6 +1742,10 @@ var __vue_sfc__ = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps(__sprea
1787
1742
  "thinking-change"
1788
1743
  ],
1789
1744
  setup(__props, { expose: __expose, emit: __emit }) {
1745
+ (0, vue.useCssVars)((_ctx) => ({
1746
+ "-chatAnimationOrigin.x": chatAnimationOrigin.value.x,
1747
+ "-chatAnimationOrigin.y": chatAnimationOrigin.value.y
1748
+ }));
1790
1749
  const props = __props;
1791
1750
  const emit = __emit;
1792
1751
  const slots = (0, vue.useSlots)();
@@ -1923,16 +1882,26 @@ var __vue_sfc__ = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps(__sprea
1923
1882
  promptDockVisible.value = !promptDockVisible.value;
1924
1883
  sendMessageToIframe("prompt-dock-visibility-change", { visible: promptDockVisible.value });
1925
1884
  };
1926
- const bubbleOffset = (0, vue.ref)({
1927
- x: 0,
1928
- y: 0
1885
+ const bubbleOffset = (0, vue.ref)(void 0);
1886
+ const bubbleQuadrant = (0, vue.computed)(() => {
1887
+ var _a, _b, _c, _d;
1888
+ if (typeof window === "undefined") return "bottom-right";
1889
+ const centerX = window.innerWidth / 2;
1890
+ const centerY = window.innerHeight / 2;
1891
+ const bubbleSize = 44;
1892
+ const effectiveX = ((_b = (_a = bubbleOffset.value) == null ? void 0 : _a.x) != null ? _b : window.innerWidth - bubbleSize - 24) + bubbleSize / 2;
1893
+ const effectiveY = ((_d = (_c = bubbleOffset.value) == null ? void 0 : _c.y) != null ? _d : window.innerHeight - bubbleSize - 24) + bubbleSize / 2;
1894
+ if (effectiveX >= centerX && effectiveY >= centerY) return "bottom-right";
1895
+ else if (effectiveX < centerX && effectiveY >= centerY) return "bottom-left";
1896
+ else if (effectiveX >= centerX && effectiveY < centerY) return "top-right";
1897
+ else return "top-left";
1929
1898
  });
1930
1899
  const isBubbleOnRightSide = (0, vue.computed)(() => {
1931
- if (typeof window === "undefined") return true;
1932
- const centerX = window.innerWidth / 2;
1933
- return bubbleOffset.value.x > centerX;
1900
+ const quadrant = bubbleQuadrant.value;
1901
+ return quadrant === "top-right" || quadrant === "bottom-right";
1934
1902
  });
1935
1903
  const chatPositionStyle = (0, vue.computed)(() => {
1904
+ var _a;
1936
1905
  if (typeof window === "undefined") return {};
1937
1906
  const windowWidth = window.innerWidth;
1938
1907
  const windowHeight = window.innerHeight;
@@ -1941,21 +1910,25 @@ var __vue_sfc__ = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps(__sprea
1941
1910
  const gap = 24;
1942
1911
  const bubbleSize = 44;
1943
1912
  const screenMargin = 20;
1913
+ const effectiveOffset = (_a = bubbleOffset.value) != null ? _a : {
1914
+ x: windowWidth - bubbleSize - gap,
1915
+ y: windowHeight - bubbleSize - gap
1916
+ };
1944
1917
  const style = {};
1945
1918
  if (isBubbleOnRightSide.value) {
1946
- let rightPos = windowWidth - bubbleOffset.value.x + gap;
1919
+ let rightPos = windowWidth - effectiveOffset.x + gap;
1947
1920
  const maxRight = windowWidth - chatWidth - screenMargin;
1948
1921
  if (rightPos > maxRight) rightPos = maxRight;
1949
1922
  style.right = `${rightPos}px`;
1950
1923
  style.left = "auto";
1951
1924
  } else {
1952
- let leftPos = bubbleOffset.value.x + bubbleSize + gap;
1925
+ let leftPos = effectiveOffset.x + bubbleSize + gap;
1953
1926
  const maxLeft = windowWidth - chatWidth - screenMargin;
1954
1927
  if (leftPos > maxLeft) leftPos = maxLeft;
1955
1928
  style.left = `${leftPos}px`;
1956
1929
  style.right = "auto";
1957
1930
  }
1958
- let bottomPos = windowHeight - bubbleOffset.value.y - bubbleSize;
1931
+ let bottomPos = windowHeight - effectiveOffset.y - bubbleSize;
1959
1932
  const maxBottom = windowHeight - chatHeight - screenMargin;
1960
1933
  if (bottomPos > maxBottom) bottomPos = maxBottom;
1961
1934
  if (bottomPos < screenMargin) bottomPos = screenMargin;
@@ -1965,6 +1938,26 @@ var __vue_sfc__ = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps(__sprea
1965
1938
  const handleBubbleOffsetChange = (offset) => {
1966
1939
  bubbleOffset.value = offset;
1967
1940
  };
1941
+ const chatAnimationOrigin = (0, vue.computed)(() => {
1942
+ switch (bubbleQuadrant.value) {
1943
+ case "top-left": return {
1944
+ x: "-20px",
1945
+ y: "-20px"
1946
+ };
1947
+ case "top-right": return {
1948
+ x: "20px",
1949
+ y: "-20px"
1950
+ };
1951
+ case "bottom-left": return {
1952
+ x: "-20px",
1953
+ y: "20px"
1954
+ };
1955
+ default: return {
1956
+ x: "20px",
1957
+ y: "20px"
1958
+ };
1959
+ }
1960
+ });
1968
1961
  const isDragging = (0, vue.ref)(false);
1969
1962
  let wasOpenBeforeDrag = false;
1970
1963
  const handleDragStart = () => {
@@ -2082,9 +2075,11 @@ var __vue_sfc__ = /* @__PURE__ */ (0, vue.defineComponent)(__spreadProps(__sprea
2082
2075
  handleToggleMinimize,
2083
2076
  handleTogglePromptDock,
2084
2077
  bubbleOffset,
2078
+ bubbleQuadrant,
2085
2079
  isBubbleOnRightSide,
2086
2080
  chatPositionStyle,
2087
2081
  handleBubbleOffsetChange,
2082
+ chatAnimationOrigin,
2088
2083
  isDragging,
2089
2084
  get wasOpenBeforeDrag() {
2090
2085
  return wasOpenBeforeDrag;
@@ -2225,7 +2220,7 @@ __vue_sfc__.render = __vue_render__;
2225
2220
  var open_code_widget_default = __vue_sfc__;
2226
2221
  //#endregion
2227
2222
  //#region es/index.js
2228
- var version = "1.0.25";
2223
+ var version = "1.0.26";
2229
2224
  function install(app, options) {
2230
2225
  [open_code_widget_default].forEach((item) => {
2231
2226
  if (item.install) app.use(item, options);