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

package/es/index.d.ts

@@ -1,6 +1,6 @@
 import OpenCodeWidget from './open-code-widget';
 import type { App } from 'vue';
-declare const version = "1.0.25";
+declare const version = "1.0.27";
 declare function install(app: App<any>, options?: any): void;
 export { install, version, OpenCodeWidget };
 export default install;

package/es/index.js

@@ -1,5 +1,5 @@
 import OpenCodeWidget from "./open-code-widget";
-const version = "1.0.25";
+const version = "1.0.27";
 function install(app, options) {
   const components = [
     OpenCodeWidget

package/es/open-code-widget/composables/use-inspector.js

@@ -202,35 +202,20 @@ function findFileInfo(element, inspector) {
   return fallbackFileInfo || { file: null, line: null, column: null };
 }
 function getPreciseElementAtPoint(x, y, boundary) {
-  var _a, _b;
-  const highlight = document.querySelector(".opencode-element-highlight");
-  const tooltip = document.querySelector(".opencode-element-tooltip");
-  const highlightDisplay = ((_a = highlight == null ? void 0 : highlight.getAttribute("style")) == null ? void 0 : _a.includes("display: block")) ? "block" : "none";
-  const tooltipDisplay = ((_b = tooltip == null ? void 0 : tooltip.getAttribute("style")) == null ? void 0 : _b.includes("display: block")) ? "block" : "none";
-  if (highlight) highlight.style.display = "none";
-  if (tooltip) tooltip.style.display = "none";
-  let element = null;
-  try {
-    const elements = document.elementsFromPoint(x, y);
-    for (const el of elements) {
-      if (el.closest("#vue-inspector-container")) continue;
-      if (el.closest(".opencode-widget")) continue;
-      if (el.hasAttribute("data-v-inspector-ignore")) continue;
-      if (boundary) {
-        if (boundary.contains(el) || el === boundary) {
-          element = el;
-          break;
-        }
-      } else {
-        element = el;
-        break;
+  const elements = document.elementsFromPoint(x, y);
+  for (const el of elements) {
+    if (el.closest("#vue-inspector-container")) continue;
+    if (el.closest(".opencode-widget")) continue;
+    if (el.hasAttribute("data-v-inspector-ignore")) continue;
+    if (boundary) {
+      if (boundary.contains(el) || el === boundary) {
+        return el;
       }
+    } else {
+      return el;
     }
-  } finally {
-    if (highlight) highlight.style.display = highlightDisplay;
-    if (tooltip) tooltip.style.display = tooltipDisplay;
   }
-  return element;
+  return null;
 }
 function useInspector(options) {
   const highlightVisible = ref(false);
@@ -245,67 +230,99 @@ function useInspector(options) {
   const tooltipContent = ref({ description: "", fileInfo: "" });
   const INSPECTOR_CHECK_INTERVAL = 500;
   let inspectorCheckTimer = null;
+  let currentHighlightElement = null;
+  let currentFileInfo = { file: null, line: null, column: null };
+  let currentPrimary = "#3b82f6";
+  let currentPrimaryBg = "rgba(59, 130, 246, 0.1)";
+  let currentDescription = "";
+  let currentFileInfoText = "";
   function handleMouseMoveCore(e) {
     var _a, _b;
     if (!options.selectMode.value) return;
     const inspector = window.__VUE_INSPECTOR__;
+    const highlight = document.querySelector(".opencode-element-highlight");
+    const tooltip = document.querySelector(".opencode-element-tooltip");
+    if (highlight) highlight.style.pointerEvents = "none";
+    if (tooltip) tooltip.style.pointerEvents = "none";
     let elementToHighlight = null;
+    let targetNode = null;
     let fileInfo = { file: null, line: null, column: null };
-    if (inspector) {
-      const { targetNode, params } = inspector.getTargetNode(e);
-      if (targetNode) {
-        const preciseElement = getPreciseElementAtPoint(e.clientX, e.clientY, targetNode);
-        elementToHighlight = preciseElement || targetNode;
-        if (params && params.file) {
-          fileInfo = {
-            file: params.file,
-            line: (_a = params.line) != null ? _a : null,
-            column: (_b = params.column) != null ? _b : null
-          };
-        } else if (elementToHighlight) {
-          fileInfo = findFileInfo(elementToHighlight, inspector);
+    try {
+      if (inspector) {
+        const result = inspector.getTargetNode(e);
+        targetNode = result.targetNode;
+        const params = result.params;
+        if (targetNode) {
+          const preciseElement = getPreciseElementAtPoint(e.clientX, e.clientY, targetNode);
+          elementToHighlight = preciseElement || targetNode;
+          if (params && params.file) {
+            fileInfo = {
+              file: params.file,
+              line: (_a = params.line) != null ? _a : null,
+              column: (_b = params.column) != null ? _b : null
+            };
+          } else {
+            fileInfo = findFileInfo(targetNode, inspector);
+          }
         }
       }
-    }
-    if (!elementToHighlight) {
-      elementToHighlight = getPreciseElementAtPoint(e.clientX, e.clientY, null);
-    }
-    if (elementToHighlight && !fileInfo.file) {
-      fileInfo = getFileInfoFromVueInstance(elementToHighlight) || fileInfo;
+      if (!elementToHighlight) {
+        elementToHighlight = getPreciseElementAtPoint(e.clientX, e.clientY, null);
+      }
+      if (elementToHighlight && !fileInfo.file) {
+        fileInfo = getFileInfoFromVueInstance(elementToHighlight) || fileInfo;
+      }
+    } finally {
+      if (highlight) highlight.style.pointerEvents = "";
+      if (tooltip) tooltip.style.pointerEvents = "";
     }
     if (elementToHighlight) {
-      const rect = elementToHighlight.getBoundingClientRect();
-      const widget = document.querySelector(".opencode-widget");
-      let primary = "#3b82f6";
-      let primaryBg = "rgba(59, 130, 246, 0.1)";
-      if (widget) {
-        const style = getComputedStyle(widget);
-        primary = style.getPropertyValue("--oc-primary").trim() || primary;
-        primaryBg = style.getPropertyValue("--oc-primary-bg").trim() || primaryBg;
+      const elementChanged = currentHighlightElement !== elementToHighlight;
+      if (elementChanged) {
+        currentHighlightElement = elementToHighlight;
+        currentFileInfo = fileInfo;
+        const widget = document.querySelector(".opencode-widget");
+        if (widget) {
+          const style = getComputedStyle(widget);
+          currentPrimary = style.getPropertyValue("--oc-primary").trim() || currentPrimary;
+          currentPrimaryBg = style.getPropertyValue("--oc-primary-bg").trim() || currentPrimaryBg;
+        }
+        currentDescription = getElementDescription(elementToHighlight);
+      } else if (!currentFileInfo.file && fileInfo.file) {
+        currentFileInfo = fileInfo;
       }
-      highlightVisible.value = true;
-      highlightStyle.value = {
-        top: `${rect.top}px`,
-        left: `${rect.left}px`,
-        width: `${rect.width}px`,
-        height: `${rect.height}px`,
-        border: `2px solid ${primary}`,
-        background: primaryBg
-      };
-      const description = getElementDescription(elementToHighlight);
-      const fileName = fileInfo.file ? fileInfo.file.split("/").pop() : "";
+      const fileName = currentFileInfo.file ? currentFileInfo.file.split("/").pop() : "";
       let lineInfo = "";
-      if (fileInfo.line) {
-        lineInfo = `:${fileInfo.line}`;
-        if (fileInfo.column) {
-          lineInfo += `:${fileInfo.column}`;
+      if (currentFileInfo.line) {
+        lineInfo = `:${currentFileInfo.line}`;
+        if (currentFileInfo.column) {
+          lineInfo += `:${currentFileInfo.column}`;
         }
       }
-      tooltipContent.value = {
-        description,
-        fileInfo: fileName ? `${fileName}${lineInfo}` : ""
-      };
-      tooltipVisible.value = true;
+      const newFileInfoText = fileName ? `${fileName}${lineInfo}` : "";
+      const fileInfoChanged = currentFileInfoText !== newFileInfoText;
+      if (elementChanged || fileInfoChanged) {
+        currentFileInfoText = newFileInfoText;
+        tooltipContent.value = {
+          description: currentDescription,
+          fileInfo: currentFileInfoText
+        };
+      }
+      const rect = elementToHighlight.getBoundingClientRect();
+      const newTop = `${rect.top}px`;
+      const newLeft = `${rect.left}px`;
+      const newWidth = `${rect.width}px`;
+      const newHeight = `${rect.height}px`;
+      if (highlightStyle.value.top !== newTop || highlightStyle.value.left !== newLeft || highlightStyle.value.width !== newWidth || highlightStyle.value.height !== newHeight) {
+        highlightStyle.value = {
+          top: newTop,
+          left: newLeft,
+          width: newWidth,
+          height: newHeight,
+          border: `2px solid ${currentPrimary}`,
+          background: currentPrimaryBg
+        };
+      }
       const tooltipHeight = 50;
       const tooltipWidth = 200;
       let tooltipTop = rect.top - tooltipHeight - 8;
@@ -316,13 +333,31 @@ function useInspector(options) {
       if (tooltipLeft + tooltipWidth > window.innerWidth - 10) {
         tooltipLeft = window.innerWidth - tooltipWidth - 10;
       }
-      tooltipStyle.value = {
-        top: `${tooltipTop}px`,
-        left: `${tooltipLeft}px`
-      };
+      const newTooltipTop = `${tooltipTop}px`;
+      const newTooltipLeft = `${tooltipLeft}px`;
+      if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) {
+        tooltipStyle.value = {
+          top: newTooltipTop,
+          left: newTooltipLeft
+        };
+      }
+      if (!highlightVisible.value) {
+        highlightVisible.value = true;
+      }
+      if (!tooltipVisible.value) {
+        tooltipVisible.value = true;
+      }
     } else {
-      highlightVisible.value = false;
-      tooltipVisible.value = false;
+      currentHighlightElement = null;
+      currentDescription = "";
+      currentFileInfoText = "";
+      currentFileInfo = { file: null, line: null, column: null };
+      if (highlightVisible.value) {
+        highlightVisible.value = false;
+      }
+      if (tooltipVisible.value) {
+        tooltipVisible.value = false;
+      }
     }
   }
   const handleMouseMove = throttle(handleMouseMoveCore, 16);
@@ -394,6 +429,10 @@ function useInspector(options) {
       }
       document.removeEventListener("mousemove", handleMouseMove);
       document.removeEventListener("keydown", handleKeydown, true);
+      currentHighlightElement = null;
+      currentDescription = "";
+      currentFileInfoText = "";
+      currentFileInfo = { file: null, line: null, column: null };
       highlightVisible.value = false;
       tooltipVisible.value = false;
     }

package/es/open-code-widget/composables/use-persist-state.d.ts

@@ -0,0 +1,24 @@
+import { type Ref } from "vue";
+import type { FloatingBubbleOffset } from "../src/components/FloatingBubble/types";
+import type { OpenCodeWidgetTheme } from "../src/types";
+export interface WidgetPersistState {
+    open: boolean;
+    minimized: boolean;
+    promptDockVisible: boolean;
+    bubbleOffset?: FloatingBubbleOffset;
+    theme: OpenCodeWidgetTheme;
+    sessionListCollapsed: boolean;
+}
+export interface UsePersistStateOptions {
+    open: Ref<boolean>;
+    minimized: Ref<boolean>;
+    promptDockVisible: Ref<boolean>;
+    bubbleOffset: Ref<FloatingBubbleOffset | undefined>;
+    theme: Ref<OpenCodeWidgetTheme>;
+    sessionListCollapsed: Ref<boolean>;
+    onRestore?: (state: Partial<WidgetPersistState>) => void;
+}
+export declare function usePersistState(options: UsePersistStateOptions): {
+    restoreState: () => Partial<WidgetPersistState> | null;
+    persistState: () => void;
+};

package/es/open-code-widget/composables/use-persist-state.js

@@ -0,0 +1,59 @@
+import { watch, onMounted } from "vue";
+const STORAGE_KEY = "opencode-widget-state";
+function loadState() {
+  if (typeof window === "undefined") return null;
+  try {
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored) {
+      return JSON.parse(stored);
+    }
+  } catch (e) {
+    console.warn("[OpenCodeWidget] Failed to load persisted state:", e);
+  }
+  return null;
+}
+function saveState(state) {
+  if (typeof window === "undefined") return;
+  try {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(state));
+  } catch (e) {
+    console.warn("[OpenCodeWidget] Failed to save state:", e);
+  }
+}
+function usePersistState(options) {
+  const restoreState = () => {
+    const saved = loadState();
+    if (options.onRestore) {
+      options.onRestore(saved || {});
+    }
+    return saved;
+  };
+  const getCurrentState = () => ({
+    open: options.open.value,
+    minimized: options.minimized.value,
+    promptDockVisible: options.promptDockVisible.value,
+    bubbleOffset: options.bubbleOffset.value,
+    theme: options.theme.value,
+    sessionListCollapsed: options.sessionListCollapsed.value
+  });
+  const persistState = () => {
+    saveState(getCurrentState());
+  };
+  onMounted(() => {
+    restoreState();
+    watch(
+      [options.open, options.minimized, options.promptDockVisible, options.bubbleOffset, options.theme, options.sessionListCollapsed],
+      () => {
+        persistState();
+      },
+      { deep: true }
+    );
+  });
+  return {
+    restoreState,
+    persistState
+  };
+}
+export {
+  usePersistState
+};

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

@@ -1 +1 @@
-.floating-bubble{position:fixed;top:0;left:0;z-index:999999;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:none;will-change:transform}.floating-bubble:active{cursor:grabbing}
+.floating-bubble{position:fixed;top:0;left:0;z-index:999999;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:none;will-change:transform}.floating-bubble:active{cursor:grabbing}body.floating-bubble-dragging *{pointer-events:none!important}body.floating-bubble-dragging .floating-bubble,body.floating-bubble-dragging .floating-bubble *{pointer-events:auto!important}

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

@@ -11,20 +11,19 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_5) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
-    isOnRightSide: import("vue").ComputedRef<boolean>;
     offset: import("vue").ComputedRef<{
         x: number;
         y: number;
     }>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    click: (event: MouseEvent) => any;
     "update:offset": (value: FloatingBubbleOffset) => any;
+    click: (event: MouseEvent) => any;
     "offset-change": (offset: FloatingBubbleOffset) => any;
     "drag-start": () => any;
     "drag-end": () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onClick?: ((event: MouseEvent) => any) | undefined;
     "onUpdate:offset"?: ((value: FloatingBubbleOffset) => any) | undefined;
+    onClick?: ((event: MouseEvent) => any) | undefined;
     "onOffset-change"?: ((offset: FloatingBubbleOffset) => any) | undefined;
     "onDrag-start"?: (() => any) | undefined;
     "onDrag-end"?: (() => any) | undefined;

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

@@ -36,26 +36,12 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
     const props = __props;
     const emit = __emit;
     const rootRef = ref(null);
-    const getInitialState = () => {
-      if (props.offset) {
-        return {
-          x: props.offset.x,
-          y: props.offset.y,
-          width: 0,
-          height: 0
-        };
-      }
-      if (typeof window !== "undefined") {
-        return {
-          x: window.innerWidth - 42 - 24,
-          y: window.innerHeight - 42 - 24,
-          width: 0,
-          height: 0
-        };
-      }
-      return { x: 0, y: 0, width: 0, height: 0 };
-    };
-    const state = ref(getInitialState());
+    const state = ref({
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0
+    });
     const isObject = (val) => val !== null && typeof val === "object";
     const gapX = computed(
       () => isObject(props.gap) ? props.gap.x : props.gap
@@ -71,6 +57,27 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       bottom: windowHeight.value - state.value.height - gapY.value,
       left: gapX.value
     }));
+    const closest = (arr, target) => {
+      return arr.reduce(
+        (pre, cur) => Math.abs(pre - target) < Math.abs(cur - target) ? pre : cur
+      );
+    };
+    const applyMagnetic = () => {
+      if (props.magnetic === "x") {
+        const nextX = closest(
+          [boundary.value.left, boundary.value.right],
+          state.value.x
+        );
+        state.value.x = nextX;
+      }
+      if (props.magnetic === "y") {
+        const nextY = closest(
+          [boundary.value.top, boundary.value.bottom],
+          state.value.y
+        );
+        state.value.y = nextY;
+      }
+    };
     const dragging = ref(false);
     const initialized = ref(false);
     const rootStyle = computed(() => {
@@ -78,20 +85,16 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       const x = `${state.value.x}px`;
       const y = `${state.value.y}px`;
       style.transform = `translate3d(${x}, ${y}, 0)`;
-      if (dragging.value) {
+      if (dragging.value || !initialized.value) {
         style.transition = "none";
       } else {
         style.transition = "transform 0.3s ease";
       }
       return style;
     });
-    const show = ref(true);
     const updateState = () => {
-      if (!show.value || !rootRef.value || typeof window === "undefined") return;
+      if (!rootRef.value || typeof window === "undefined") return;
       const rect = rootRef.value.getBoundingClientRect();
-      if (rect.width === 0 || rect.height === 0) {
-        return;
-      }
       const { offset } = props;
       let x = offset ? offset.x : windowWidth.value - rect.width - gapX.value;
       let y = offset ? offset.y : windowHeight.value - rect.height - gapY.value;
@@ -101,12 +104,22 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       if (x > maxX) x = maxX;
       if (y < gapY.value) y = gapY.value;
       if (y > maxY) y = maxY;
+      const oldX = state.value.x;
+      const oldY = state.value.y;
       state.value = {
         x,
         y,
         width: rect.width,
         height: rect.height
       };
+      if (!dragging.value) {
+        applyMagnetic();
+        if (state.value.x !== oldX || state.value.y !== oldY) {
+          const offset2 = { x: state.value.x, y: state.value.y };
+          emit("update:offset", offset2);
+          emit("offset-change", offset2);
+        }
+      }
     };
     const touch = {
       startX: ref(0),
@@ -145,6 +158,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       dragging.value = true;
       prevX = state.value.x;
       prevY = state.value.y;
+      document.body.classList.add("floating-bubble-dragging");
       if (!("touches" in e)) {
         window.addEventListener("mousemove", onTouchMove, { passive: false });
         window.addEventListener("mouseup", onTouchEnd);
@@ -177,32 +191,15 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
         emit("update:offset", offset);
       }
     };
-    const closest = (arr, target) => {
-      return arr.reduce(
-        (pre, cur) => Math.abs(pre - target) < Math.abs(cur - target) ? pre : cur
-      );
-    };
     const onTouchEnd = (e) => {
       dragging.value = false;
+      document.body.classList.remove("floating-bubble-dragging");
       if (e && !("touches" in e) && e.type === "mouseup") {
         window.removeEventListener("mousemove", onTouchMove);
         window.removeEventListener("mouseup", onTouchEnd);
       }
       requestAnimationFrame(() => {
-        if (props.magnetic === "x") {
-          const nextX = closest(
-            [boundary.value.left, boundary.value.right],
-            state.value.x
-          );
-          state.value.x = nextX;
-        }
-        if (props.magnetic === "y") {
-          const nextY = closest(
-            [boundary.value.top, boundary.value.bottom],
-            state.value.y
-          );
-          state.value.y = nextY;
-        }
+        applyMagnetic();
         if (!touch.isTap.value) {
           emit("drag-end");
           const offset = { x: state.value.x, y: state.value.y };
@@ -227,11 +224,9 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       }
     };
     onMounted(() => {
+      updateState();
       requestAnimationFrame(() => {
-        updateState();
-        requestAnimationFrame(() => {
-          initialized.value = true;
-        });
+        initialized.value = true;
       });
       if (typeof window !== "undefined") {
         window.addEventListener("resize", handleResize);
@@ -243,6 +238,7 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       }
     });
     onUnmounted(() => {
+      document.body.classList.remove("floating-bubble-dragging");
       if (typeof window !== "undefined") {
         window.removeEventListener("resize", handleResize);
         window.removeEventListener("mousemove", onTouchMove);
@@ -257,14 +253,10 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       updateState,
       { deep: true }
     );
-    const isOnRightSide = computed(() => {
-      return state.value.x > windowWidth.value / 2;
-    });
     __expose({
-      isOnRightSide,
       offset: computed(() => ({ x: state.value.x, y: state.value.y }))
     });
-    const __returned__ = { props, emit, rootRef, getInitialState, state, isObject, gapX, gapY, windowWidth, windowHeight, boundary, dragging, initialized, rootStyle, show, updateState, touch, get prevX() {
+    const __returned__ = { props, emit, rootRef, state, isObject, gapX, gapY, windowWidth, windowHeight, boundary, closest, applyMagnetic, dragging, initialized, rootStyle, updateState, touch, get prevX() {
       return prevX;
     }, set prevX(v) {
       prevX = v;
@@ -272,15 +264,15 @@ const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValue
       return prevY;
     }, set prevY(v) {
       prevY = v;
-    }, onTouchStart, onTouchMove, closest, onTouchEnd, onClick, handleResize, isOnRightSide };
+    }, onTouchStart, onTouchMove, onTouchEnd, onClick, handleResize };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
   }
 }));
-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";
+import { renderSlot as _renderSlot, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
 function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
   return _openBlock(), _createBlock(_Teleport, { to: $props.teleport }, [
-    _withDirectives(_createElementVNode(
+    _createElementVNode(
       "div",
       {
         ref: "rootRef",
@@ -297,9 +289,7 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
       ],
       36
       /* STYLE, NEED_HYDRATION */
-    ), [
-      [_vShow, $setup.show && $setup.initialized]
-    ])
+    )
   ], 8, ["to"]);
 }
 __vue_sfc__.render = __vue_render__;

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

@@ -4,20 +4,17 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_13) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<{}, {
-    isOnRightSide: import("vue").ComputedRef<boolean>;
     offset: import("vue").Ref<{
         x: number;
         y: number;
-    }, FloatingBubbleOffset | {
+    } | undefined, FloatingBubbleOffset | {
         x: number;
         y: number;
-    }>;
+    } | undefined>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "offset-change": (offset: FloatingBubbleOffset) => any;
     "drag-start": () => any;
     "drag-end": () => any;
 }, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
-    "onOffset-change"?: ((offset: FloatingBubbleOffset) => any) | undefined;
     "onDrag-start"?: (() => any) | undefined;
     "onDrag-end"?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;