@vite-plugin-opencode-assistant/components 1.0.22 → 1.0.24

package/lib/@vite-plugin-opencode-assistant/components.es.js

@@ -1,4 +1,4 @@
-import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createStaticVNode, createVNode, defineComponent, inject, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, provide, ref, renderList, renderSlot, toDisplayString, toRef, useSlots, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
+import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createStaticVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, provide, ref, renderList, renderSlot, toDisplayString, toRef, useSlots, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
 import { truncate } from "@vite-plugin-opencode-assistant/shared";
 import getCssSelector from "css-selector-generator";
 //#region es/open-code-widget/src/context.js
@@ -13,24 +13,24 @@ function useOpenCodeWidgetContext() {
 }
 //#endregion
 //#region es/open-code-widget/src/components/Frame.vue.js
-var __defProp$1 = Object.defineProperty;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, {
+var __defProp$2 = Object.defineProperty;
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, {
 	enumerable: true,
 	configurable: true,
 	writable: true,
 	value
 }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
-	for (var prop in b || (b = {})) if (__hasOwnProp$1.call(b, prop)) __defNormalProp$1(a, prop, b[prop]);
-	if (__getOwnPropSymbols$1) {
-		for (var prop of __getOwnPropSymbols$1(b)) if (__propIsEnum$1.call(b, prop)) __defNormalProp$1(a, prop, b[prop]);
+var __spreadValues$2 = (a, b) => {
+	for (var prop in b || (b = {})) if (__hasOwnProp$2.call(b, prop)) __defNormalProp$2(a, prop, b[prop]);
+	if (__getOwnPropSymbols$2) {
+		for (var prop of __getOwnPropSymbols$2(b)) if (__propIsEnum$2.call(b, prop)) __defNormalProp$2(a, prop, b[prop]);
 	}
 	return a;
 };
-var __vue_sfc__$6 = /* @__PURE__ */ defineComponent({
+var __vue_sfc__$7 = /* @__PURE__ */ defineComponent({
 	__name: "Frame",
 	setup(__props, { expose: __expose }) {
 		const iframeRef = ref(null);
@@ -38,7 +38,7 @@ var __vue_sfc__$6 = /* @__PURE__ */ defineComponent({
 		function sendMessageToIframe(type, data) {
 			var _a;
 			if (!((_a = iframeRef.value) == null ? void 0 : _a.contentWindow)) return;
-			iframeRef.value.contentWindow.postMessage(__spreadValues$1({ type }, data), "*");
+			iframeRef.value.contentWindow.postMessage(__spreadValues$2({ type }, data), "*");
 		}
 		onMounted(() => {
 			if (iframeRef.value) iframeRef.value.addEventListener("load", () => {
@@ -68,7 +68,7 @@ var __vue_sfc__$6 = /* @__PURE__ */ defineComponent({
 var _hoisted_1$6 = { class: "opencode-iframe-container" };
 var _hoisted_2$4 = { class: "opencode-empty-state-text" };
 var _hoisted_3$4 = ["src"];
-function __vue_render__$6(_ctx, _cache, $props, $setup, $data, $options) {
+function __vue_render__$7(_ctx, _cache, $props, $setup, $data, $options) {
 	return openBlock(), createElementBlock("div", _hoisted_1$6, [
 		createElementVNode("div", { class: normalizeClass(["opencode-empty-state-overlay", { visible: $setup.showEmptyState }]) }, [renderSlot(_ctx.$slots, "empty-state", {}, () => [
 			_cache[1] || (_cache[1] = createElementVNode("div", { class: "opencode-empty-state-icon" }, [createElementVNode("svg", {
@@ -102,11 +102,11 @@ function __vue_render__$6(_ctx, _cache, $props, $setup, $data, $options) {
 		}, null, 8, _hoisted_3$4)])
 	]);
 }
-__vue_sfc__$6.render = __vue_render__$6;
-var Frame_vue_default = __vue_sfc__$6;
+__vue_sfc__$7.render = __vue_render__$7;
+var Frame_vue_default = __vue_sfc__$7;
 //#endregion
 //#region es/open-code-widget/src/components/Header.vue.js
-var __vue_sfc__$5 = /* @__PURE__ */ defineComponent({
+var __vue_sfc__$6 = /* @__PURE__ */ defineComponent({
 	__name: "Header",
 	setup(__props, { expose: __expose }) {
 		__expose();
@@ -220,7 +220,7 @@ var _hoisted_14 = {
 	"stroke-width": "2",
 	"aria-hidden": "true"
 };
-function __vue_render__$5(_ctx, _cache, $props, $setup, $data, $options) {
+function __vue_render__$6(_ctx, _cache, $props, $setup, $data, $options) {
 	return openBlock(), createElementBlock("div", _hoisted_1$5, [
 		createElementVNode("div", _hoisted_2$3, [
 			createElementVNode("button", {
@@ -314,11 +314,11 @@ function __vue_render__$5(_ctx, _cache, $props, $setup, $data, $options) {
 		])
 	]);
 }
-__vue_sfc__$5.render = __vue_render__$5;
-var Header_vue_default = __vue_sfc__$5;
+__vue_sfc__$6.render = __vue_render__$6;
+var Header_vue_default = __vue_sfc__$6;
 //#endregion
 //#region es/open-code-widget/src/components/SelectHint.vue.js
-var __vue_sfc__$4 = /* @__PURE__ */ defineComponent({
+var __vue_sfc__$5 = /* @__PURE__ */ defineComponent({
 	__name: "SelectHint",
 	setup(__props, { expose: __expose }) {
 		__expose();
@@ -335,14 +335,14 @@ var __vue_sfc__$4 = /* @__PURE__ */ defineComponent({
 	}
 });
 var _hoisted_1$4 = { class: "opencode-hint-shortcut" };
-function __vue_render__$4(_ctx, _cache, $props, $setup, $data, $options) {
+function __vue_render__$5(_ctx, _cache, $props, $setup, $data, $options) {
 	return openBlock(), createElementBlock("div", { class: normalizeClass(["opencode-select-mode-hint", { visible: $setup.visible }]) }, [_cache[0] || (_cache[0] = createElementVNode("span", null, "🎯 选择模式已开启 - 点击元素进行选择", -1)), createElementVNode("span", _hoisted_1$4, toDisplayString($setup.shortcutLabel), 1)], 2);
 }
-__vue_sfc__$4.render = __vue_render__$4;
-var SelectHint_vue_default = __vue_sfc__$4;
+__vue_sfc__$5.render = __vue_render__$5;
+var SelectHint_vue_default = __vue_sfc__$5;
 //#endregion
 //#region es/open-code-widget/src/components/SelectedNodes.vue.js
-var __vue_sfc__$3 = /* @__PURE__ */ defineComponent({
+var __vue_sfc__$4 = /* @__PURE__ */ defineComponent({
 	__name: "SelectedNodes",
 	setup(__props, { expose: __expose }) {
 		__expose();
@@ -371,7 +371,7 @@ var _hoisted_3$2 = { class: "opencode-node-content" };
 var _hoisted_4$2 = { class: "opencode-node-text" };
 var _hoisted_5$2 = { class: "opencode-node-file" };
 var _hoisted_6$2 = ["aria-label", "onClick"];
-function __vue_render__$3(_ctx, _cache, $props, $setup, $data, $options) {
+function __vue_render__$4(_ctx, _cache, $props, $setup, $data, $options) {
 	return openBlock(), createElementBlock("div", { class: normalizeClass(["opencode-right-toolbar", { collapsed: $setup.items.length === 0 }]) }, [
 		_cache[1] || (_cache[1] = createElementVNode("div", { class: "opencode-selected-nodes-header" }, [createElementVNode("div", { class: "opencode-selected-nodes-title" }, "已选节点"), createElementVNode("div", { class: "opencode-selected-nodes-desc" }, "选中的节点会在对话时一起发送给助手")], -1)),
 		createElementVNode("div", _hoisted_1$3, [(openBlock(true), createElementBlock(Fragment, null, renderList($setup.items, (item, index) => {
@@ -400,11 +400,11 @@ function __vue_render__$3(_ctx, _cache, $props, $setup, $data, $options) {
 		}, " 一键清空 ")) : createCommentVNode("v-if", true)
 	], 2);
 }
-__vue_sfc__$3.render = __vue_render__$3;
-var SelectedNodes_vue_default = __vue_sfc__$3;
+__vue_sfc__$4.render = __vue_render__$4;
+var SelectedNodes_vue_default = __vue_sfc__$4;
 //#endregion
 //#region es/open-code-widget/src/components/SessionList.vue.js
-var __vue_sfc__$2 = /* @__PURE__ */ defineComponent({
+var __vue_sfc__$3 = /* @__PURE__ */ defineComponent({
 	__name: "SessionList",
 	setup(__props, { expose: __expose }) {
 		__expose();
@@ -469,7 +469,7 @@ var _hoisted_6$1 = { class: "opencode-session-header" };
 var _hoisted_7$1 = { class: "opencode-session-title" };
 var _hoisted_8$1 = ["aria-label", "onClick"];
 var _hoisted_9$1 = { class: "opencode-session-meta" };
-function __vue_render__$2(_ctx, _cache, $props, $setup, $data, $options) {
+function __vue_render__$3(_ctx, _cache, $props, $setup, $data, $options) {
 	return openBlock(), createElementBlock("div", { class: normalizeClass(["opencode-session-list", { collapsed: $setup.collapsed }]) }, [
 		createCommentVNode(" Header "),
 		!$setup.showSkeleton ? (openBlock(), createElementBlock("div", _hoisted_1$2, [_cache[1] || (_cache[1] = createElementVNode("span", { id: "opencode-session-list-title" }, "会话列表", -1)), createElementVNode("button", {
@@ -501,21 +501,377 @@ function __vue_render__$2(_ctx, _cache, $props, $setup, $data, $options) {
 		}), 128)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [createCommentVNode(" Empty State "), renderSlot(_ctx.$slots, "empty")], 64))])], 2112))
 	], 2);
 }
+__vue_sfc__$3.render = __vue_render__$3;
+var SessionList_vue_default = __vue_sfc__$3;
+//#endregion
+//#region es/open-code-widget/src/components/FloatingBubble/FloatingBubble.vue.js
+var __defProp$1 = Object.defineProperty;
+var __defProps$1 = Object.defineProperties;
+var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, {
+	enumerable: true,
+	configurable: true,
+	writable: true,
+	value
+}) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
+	for (var prop in b || (b = {})) if (__hasOwnProp$1.call(b, prop)) __defNormalProp$1(a, prop, b[prop]);
+	if (__getOwnPropSymbols$1) {
+		for (var prop of __getOwnPropSymbols$1(b)) if (__propIsEnum$1.call(b, prop)) __defNormalProp$1(a, prop, b[prop]);
+	}
+	return a;
+};
+var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
+var __vue_sfc__$2 = /* @__PURE__ */ defineComponent(__spreadProps$1(__spreadValues$1({}, { name: "FloatingBubble" }), {
+	__name: "FloatingBubble",
+	props: {
+		offset: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		axis: {
+			type: String,
+			required: false,
+			default: "xy"
+		},
+		magnetic: {
+			type: String,
+			required: false,
+			default: void 0
+		},
+		gap: {
+			type: [Number, Object],
+			required: false,
+			default: 24
+		},
+		teleport: {
+			type: null,
+			required: false,
+			default: "body"
+		}
+	},
+	emits: [
+		"update:offset",
+		"click",
+		"offset-change",
+		"drag-start",
+		"drag-end"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const rootRef = ref(null);
+		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);
+		const gapY = computed(() => isObject(props.gap) ? props.gap.y : props.gap);
+		const windowWidth = ref(typeof window !== "undefined" ? window.innerWidth : 0);
+		const windowHeight = ref(typeof window !== "undefined" ? window.innerHeight : 0);
+		const boundary = computed(() => ({
+			top: gapY.value,
+			right: windowWidth.value - state.value.width - gapX.value,
+			bottom: windowHeight.value - state.value.height - gapY.value,
+			left: gapX.value
+		}));
+		const dragging = ref(false);
+		const initialized = ref(false);
+		const rootStyle = computed(() => {
+			const style = {};
+			style.transform = `translate3d(${`${state.value.x}px`}, ${`${state.value.y}px`}, 0)`;
+			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;
+			const rect = rootRef.value.getBoundingClientRect();
+			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;
+			const maxX = windowWidth.value - rect.width - gapX.value;
+			const maxY = windowHeight.value - rect.height - gapY.value;
+			if (x < gapX.value) x = gapX.value;
+			if (x > maxX) x = maxX;
+			if (y < gapY.value) y = gapY.value;
+			if (y > maxY) y = maxY;
+			state.value = {
+				x,
+				y,
+				width: rect.width,
+				height: rect.height
+			};
+		};
+		const touch = {
+			startX: ref(0),
+			startY: ref(0),
+			deltaX: ref(0),
+			deltaY: ref(0),
+			offsetX: ref(0),
+			offsetY: ref(0),
+			isTap: ref(true),
+			start(e) {
+				this.startX.value = "touches" in e ? e.touches[0].clientX : e.clientX;
+				this.startY.value = "touches" in e ? e.touches[0].clientY : e.clientY;
+				this.deltaX.value = 0;
+				this.deltaY.value = 0;
+				this.offsetX.value = 0;
+				this.offsetY.value = 0;
+				this.isTap.value = true;
+			},
+			move(e) {
+				const clientX = "touches" in e ? e.touches[0].clientX : e.clientX;
+				const clientY = "touches" in e ? e.touches[0].clientY : e.clientY;
+				this.deltaX.value = clientX - this.startX.value;
+				this.deltaY.value = clientY - this.startY.value;
+				this.offsetX.value = Math.abs(this.deltaX.value);
+				this.offsetY.value = Math.abs(this.deltaY.value);
+				const TAP_OFFSET = 5;
+				if (this.isTap.value && (this.offsetX.value > TAP_OFFSET || this.offsetY.value > TAP_OFFSET)) this.isTap.value = false;
+			}
+		};
+		let prevX = 0;
+		let prevY = 0;
+		const onTouchStart = (e) => {
+			touch.start(e);
+			dragging.value = true;
+			prevX = state.value.x;
+			prevY = state.value.y;
+			if (!("touches" in e)) {
+				window.addEventListener("mousemove", onTouchMove, { passive: false });
+				window.addEventListener("mouseup", onTouchEnd);
+			}
+		};
+		const onTouchMove = (e) => {
+			if (e.cancelable) e.preventDefault();
+			const wasTap = touch.isTap.value;
+			touch.move(e);
+			if (wasTap && !touch.isTap.value) emit("drag-start");
+			if (props.axis === "lock") return;
+			if (!touch.isTap.value) {
+				if (props.axis === "x" || props.axis === "xy") {
+					let nextX = prevX + touch.deltaX.value;
+					if (nextX < boundary.value.left) nextX = boundary.value.left;
+					if (nextX > boundary.value.right) nextX = boundary.value.right;
+					state.value.x = nextX;
+				}
+				if (props.axis === "y" || props.axis === "xy") {
+					let nextY = prevY + touch.deltaY.value;
+					if (nextY < boundary.value.top) nextY = boundary.value.top;
+					if (nextY > boundary.value.bottom) nextY = boundary.value.bottom;
+					state.value.y = nextY;
+				}
+				emit("update:offset", {
+					x: state.value.x,
+					y: state.value.y
+				});
+			}
+		};
+		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;
+			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;
+				}
+				if (!touch.isTap.value) {
+					emit("drag-end");
+					const offset = {
+						x: state.value.x,
+						y: state.value.y
+					};
+					emit("update:offset", offset);
+					if (prevX !== offset.x || prevY !== offset.y) emit("offset-change", offset);
+				}
+			});
+		};
+		const onClick = (e) => {
+			if (touch.isTap.value) emit("click", e);
+			else e.stopPropagation();
+		};
+		const handleResize = () => {
+			if (typeof window !== "undefined") {
+				windowWidth.value = window.innerWidth;
+				windowHeight.value = window.innerHeight;
+			}
+		};
+		onMounted(() => {
+			updateState();
+			nextTick(() => {
+				initialized.value = true;
+			});
+			if (typeof window !== "undefined") window.addEventListener("resize", handleResize);
+			if (rootRef.value) rootRef.value.addEventListener("touchmove", onTouchMove, { passive: false });
+		});
+		onUnmounted(() => {
+			if (typeof window !== "undefined") {
+				window.removeEventListener("resize", handleResize);
+				window.removeEventListener("mousemove", onTouchMove);
+				window.removeEventListener("mouseup", onTouchEnd);
+			}
+			if (rootRef.value) rootRef.value.removeEventListener("touchmove", onTouchMove);
+		});
+		watch([
+			windowWidth,
+			windowHeight,
+			gapX,
+			gapY,
+			() => props.offset
+		], 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,
+			state,
+			isObject,
+			gapX,
+			gapY,
+			windowWidth,
+			windowHeight,
+			boundary,
+			dragging,
+			initialized,
+			rootStyle,
+			show,
+			updateState,
+			touch,
+			get prevX() {
+				return prevX;
+			},
+			set prevX(v) {
+				prevX = v;
+			},
+			get prevY() {
+				return prevY;
+			},
+			set prevY(v) {
+				prevY = v;
+			},
+			onTouchStart,
+			onTouchMove,
+			closest,
+			onTouchEnd,
+			onClick,
+			handleResize,
+			isOnRightSide
+		};
+		Object.defineProperty(__returned__, "__isScriptSetup", {
+			enumerable: false,
+			value: true
+		});
+		return __returned__;
+	}
+}));
+function __vue_render__$2(_ctx, _cache, $props, $setup, $data, $options) {
+	return openBlock(), createBlock(Teleport, { to: $props.teleport }, [withDirectives(createElementVNode("div", {
+		ref: "rootRef",
+		class: "floating-bubble",
+		style: normalizeStyle($setup.rootStyle),
+		onTouchstartPassive: $setup.onTouchStart,
+		onTouchend: $setup.onTouchEnd,
+		onTouchcancel: $setup.onTouchEnd,
+		onMousedown: $setup.onTouchStart,
+		onClickCapture: $setup.onClick
+	}, [renderSlot(_ctx.$slots, "default")], 36), [[vShow, $setup.show]])], 8, ["to"]);
+}
 __vue_sfc__$2.render = __vue_render__$2;
-var SessionList_vue_default = __vue_sfc__$2;
+var FloatingBubble_vue_default = __vue_sfc__$2;
 //#endregion
 //#region es/open-code-widget/src/components/Trigger.vue.js
+var STORAGE_KEY = "opencode-bubble-offset";
 var __vue_sfc__$1 = /* @__PURE__ */ defineComponent({
 	__name: "Trigger",
-	setup(__props, { expose: __expose }) {
-		__expose();
-		const { buttonActive: active, open, hotkeyLabel, thinking, handleToggle } = useOpenCodeWidgetContext();
+	emits: [
+		"offset-change",
+		"drag-start",
+		"drag-end"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const { buttonActive: active, open, hotkeyLabel, thinking, resolvedTheme, handleToggle } = useOpenCodeWidgetContext();
+		const loadOffset = () => {
+			try {
+				const saved = localStorage.getItem(STORAGE_KEY);
+				if (saved) {
+					const parsed = JSON.parse(saved);
+					if (parsed && (parsed.x !== 0 || parsed.y !== 0)) return parsed;
+				}
+			} catch (e) {}
+			return {
+				x: 0,
+				y: 0
+			};
+		};
+		const offset = ref(loadOffset());
+		const emit = __emit;
+		const saveOffset = (value) => {
+			try {
+				localStorage.setItem(STORAGE_KEY, JSON.stringify(value));
+			} catch (e) {}
+		};
+		const handleOffsetChange = (value) => {
+			offset.value = value;
+			saveOffset(value);
+			emit("offset-change", value);
+		};
+		const bubbleRef = ref(null);
+		const isOnRightSide = computed(() => {
+			if (typeof window === "undefined") return true;
+			const centerX = window.innerWidth / 2;
+			return offset.value.x > centerX;
+		});
+		onMounted(() => {
+			if (offset.value.x !== 0 || offset.value.y !== 0) emit("offset-change", offset.value);
+		});
+		__expose({
+			isOnRightSide,
+			offset
+		});
 		const __returned__ = {
 			active,
 			open,
 			hotkeyLabel,
 			thinking,
-			handleToggle
+			resolvedTheme,
+			handleToggle,
+			STORAGE_KEY,
+			loadOffset,
+			offset,
+			emit,
+			saveOffset,
+			handleOffsetChange,
+			bubbleRef,
+			isOnRightSide,
+			FloatingBubble: FloatingBubble_vue_default
 		};
 		Object.defineProperty(__returned__, "__isScriptSetup", {
 			enumerable: false,
@@ -526,43 +882,70 @@ var __vue_sfc__$1 = /* @__PURE__ */ defineComponent({
 });
 var _hoisted_1$1 = ["aria-expanded", "title"];
 function __vue_render__$1(_ctx, _cache, $props, $setup, $data, $options) {
-	return openBlock(), createElementBlock("button", {
-		class: normalizeClass(["opencode-button", {
-			active: $setup.active,
-			thinking: $setup.thinking
-		}]),
-		type: "button",
-		"aria-expanded": $setup.open,
-		"aria-label": "打开 AI 助手",
-		title: `AI \u52A9\u624B (${$setup.hotkeyLabel})`,
-		onClick: _cache[0] || (_cache[0] = (...args) => $setup.handleToggle && $setup.handleToggle(...args))
-	}, [renderSlot(_ctx.$slots, "default", {}, () => [_cache[1] || (_cache[1] = createElementVNode("svg", {
-		t: "1775402599580",
-		class: "icon",
-		viewBox: "0 0 1024 1024",
-		version: "1.1",
-		xmlns: "http://www.w3.org/2000/svg",
-		"p-id": "5390",
-		"xmlns:xlink": "http://www.w3.org/1999/xlink",
-		width: "100%",
-		height: "100%"
-	}, [
-		createElementVNode("path", {
-			d: "M512 981.33H85.34c-15.85 0-30.38-8.77-37.77-22.81a42.624 42.624 0 0 1 2.6-44.02L135 791.08C75.25 710.5 42.67 612.6 42.67 512 42.67 253.21 253.21 42.67 512 42.67S981.34 253.21 981.34 512 770.8 981.33 512 981.33zM166.44 896H512c211.73 0 384-172.27 384-384S723.73 128 512 128 128 300.27 128 512c0 91.29 32.83 179.9 92.46 249.46 12.58 14.69 13.73 36 2.77 51.94L166.44 896z",
-			fill: "white",
-			"p-id": "5391"
-		}),
-		createElementVNode("path", {
-			d: "M384 448m-64 0a64 64 0 1 0 128 0 64 64 0 1 0 -128 0Z",
-			fill: "white",
-			"p-id": "5392"
-		}),
-		createElementVNode("path", {
-			d: "M640 448m-64 0a64 64 0 1 0 128 0 64 64 0 1 0 -128 0Z",
-			fill: "white",
-			"p-id": "5393"
-		})
-	], -1))])], 10, _hoisted_1$1);
+	return openBlock(), createBlock($setup["FloatingBubble"], {
+		ref: "bubbleRef",
+		offset: $setup.offset,
+		"onUpdate:offset": _cache[0] || (_cache[0] = ($event) => $setup.offset = $event),
+		axis: "xy",
+		magnetic: "x",
+		gap: 24,
+		onClick: $setup.handleToggle,
+		onOffsetChange: $setup.handleOffsetChange,
+		onDragStart: _cache[1] || (_cache[1] = ($event) => $setup.emit("drag-start")),
+		onDragEnd: _cache[2] || (_cache[2] = ($event) => $setup.emit("drag-end"))
+	}, {
+		default: withCtx(() => [createElementVNode("button", {
+			class: normalizeClass(["opencode-button", {
+				active: $setup.active,
+				thinking: $setup.thinking,
+				"opencode-theme-dark": $setup.resolvedTheme === "dark"
+			}]),
+			type: "button",
+			"aria-expanded": $setup.open,
+			"aria-label": "打开 AI 助手",
+			title: `AI \u52A9\u624B (${$setup.hotkeyLabel})`
+		}, [renderSlot(_ctx.$slots, "default", {}, () => [_cache[3] || (_cache[3] = createElementVNode("svg", {
+			t: "1775402599580",
+			class: "icon",
+			viewBox: "0 0 1024 1024",
+			version: "1.1",
+			xmlns: "http://www.w3.org/2000/svg",
+			"p-id": "5390",
+			"xmlns:xlink": "http://www.w3.org/1999/xlink",
+			width: "100%",
+			height: "100%"
+		}, [
+			createElementVNode("defs", null, [createElementVNode("linearGradient", {
+				id: "opencode-logo-gradient",
+				x1: "0%",
+				y1: "0%",
+				x2: "100%",
+				y2: "100%"
+			}, [createElementVNode("stop", {
+				offset: "0%",
+				style: { "stop-color": "#667eea" }
+			}), createElementVNode("stop", {
+				offset: "100%",
+				style: { "stop-color": "#764ba2" }
+			})])]),
+			createElementVNode("path", {
+				d: "M512 981.33H85.34c-15.85 0-30.38-8.77-37.77-22.81a42.624 42.624 0 0 1 2.6-44.02L135 791.08C75.25 710.5 42.67 612.6 42.67 512 42.67 253.21 253.21 42.67 512 42.67S981.34 253.21 981.34 512 770.8 981.33 512 981.33zM166.44 896H512c211.73 0 384-172.27 384-384S723.73 128 512 128 128 300.27 128 512c0 91.29 32.83 179.9 92.46 249.46 12.58 14.69 13.73 36 2.77 51.94L166.44 896z",
+				fill: "url(#opencode-logo-gradient)",
+				"p-id": "5391"
+			}),
+			createElementVNode("path", {
+				d: "M384 448m-64 0a64 64 0 1 0 128 0 64 64 0 1 0 -128 0Z",
+				fill: "url(#opencode-logo-gradient)",
+				"p-id": "5392"
+			}),
+			createElementVNode("path", {
+				d: "M640 448m-64 0a64 64 0 1 0 128 0 64 64 0 1 0 -128 0Z",
+				fill: "url(#opencode-logo-gradient)",
+				"p-id": "5393"
+			})
+		], -1))])], 10, _hoisted_1$1)]),
+		_: 3
+	}, 8, ["offset", "onClick"]);
 }
 __vue_sfc__$1.render = __vue_render__$1;
 var Trigger_vue_default = __vue_sfc__$1;
@@ -775,11 +1158,7 @@ function useWidget(options) {
 		if (options.theme.value === "auto") return systemTheme.value;
 		return options.theme.value;
 	});
-	const containerClasses = computed(() => [
-		"opencode-widget",
-		options.position.value,
-		`opencode-theme-${resolvedTheme.value}`
-	]);
+	const containerClasses = computed(() => ["opencode-widget", `opencode-theme-${resolvedTheme.value}`]);
 	const buttonActive = computed(() => !!(options.open.value || options.selectMode.value));
 	const iframeSource = computed(() => options.iframeSrc.value || "about:blank");
 	const sessionListTitle = computed(() => options.sessionListCollapsed.value ? "展开会话列表" : "折叠会话列表");
@@ -1228,11 +1607,6 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __vue_sfc__ = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, { name: "OpencodeWidget" }), {
 	__name: "index",
 	props: {
-		position: {
-			type: String,
-			required: false,
-			default: "bottom-right"
-		},
 		open: {
 			type: Boolean,
 			required: false,
@@ -1403,6 +1777,7 @@ var __vue_sfc__ = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
 			if (dialogResolve) dialogResolve(false);
 		};
 		const frameRef = ref(null);
+		const triggerRef = ref(null);
 		const sendMessageToIframe = (type, data) => {
 			var _a;
 			(_a = frameRef.value) == null || _a.sendMessageToIframe(type, data);
@@ -1422,7 +1797,6 @@ var __vue_sfc__ = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
 			localSessionListCollapsed.value = val;
 		});
 		const { buttonActive, containerClasses, iframeSource, sessionListTitle, resolvedTheme, handleClose, handleEmptyAction, handleToggle, handleToggleSessionList, handleToggleTheme } = useWidget({
-			position: toRef(props, "position"),
 			theme: toRef(props, "theme"),
 			open: toRef(props, "open"),
 			selectMode: toRef(props, "selectMode"),
@@ -1503,6 +1877,59 @@ var __vue_sfc__ = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
 			promptDockVisible.value = !promptDockVisible.value;
 			sendMessageToIframe("prompt-dock-visibility-change", { visible: promptDockVisible.value });
 		};
+		const bubbleOffset = ref({
+			x: 0,
+			y: 0
+		});
+		const isBubbleOnRightSide = computed(() => {
+			if (typeof window === "undefined") return true;
+			const centerX = window.innerWidth / 2;
+			return bubbleOffset.value.x > centerX;
+		});
+		const chatPositionStyle = computed(() => {
+			if (typeof window === "undefined") return {};
+			const windowWidth = window.innerWidth;
+			const windowHeight = window.innerHeight;
+			const chatWidth = minimized.value ? 300 : 700;
+			const chatHeight = minimized.value ? 300 : Math.min(windowHeight * .86, windowHeight - 40);
+			const gap = 24;
+			const bubbleSize = 44;
+			const screenMargin = 20;
+			const style = {};
+			if (isBubbleOnRightSide.value) {
+				let rightPos = windowWidth - bubbleOffset.value.x + gap;
+				const maxRight = windowWidth - chatWidth - screenMargin;
+				if (rightPos > maxRight) rightPos = maxRight;
+				style.right = `${rightPos}px`;
+				style.left = "auto";
+			} else {
+				let leftPos = bubbleOffset.value.x + bubbleSize + gap;
+				const maxLeft = windowWidth - chatWidth - screenMargin;
+				if (leftPos > maxLeft) leftPos = maxLeft;
+				style.left = `${leftPos}px`;
+				style.right = "auto";
+			}
+			let bottomPos = windowHeight - bubbleOffset.value.y - bubbleSize;
+			const maxBottom = windowHeight - chatHeight - screenMargin;
+			if (bottomPos > maxBottom) bottomPos = maxBottom;
+			if (bottomPos < screenMargin) bottomPos = screenMargin;
+			style.bottom = `${bottomPos}px`;
+			return style;
+		});
+		const handleBubbleOffsetChange = (offset) => {
+			bubbleOffset.value = offset;
+		};
+		const isDragging = ref(false);
+		let wasOpenBeforeDrag = false;
+		const handleDragStart = () => {
+			isDragging.value = true;
+			wasOpenBeforeDrag = props.open;
+			if (props.open) emit("update:open", false);
+		};
+		const handleDragEnd = () => {
+			isDragging.value = false;
+			if (wasOpenBeforeDrag) emit("update:open", true);
+		};
 		provideOpenCodeWidgetContext({
 			theme: toRef(props, "theme"),
 			resolvedTheme,
@@ -1574,6 +2001,7 @@ var __vue_sfc__ = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
 			handleDialogConfirm,
 			handleDialogCancel,
 			frameRef,
+			triggerRef,
 			sendMessageToIframe,
 			handleFrameLoaded,
 			localSessionListCollapsed,
@@ -1607,6 +2035,19 @@ var __vue_sfc__ = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
 			tooltipContent,
 			handleToggleMinimize,
 			handleTogglePromptDock,
+			bubbleOffset,
+			isBubbleOnRightSide,
+			chatPositionStyle,
+			handleBubbleOffsetChange,
+			isDragging,
+			get wasOpenBeforeDrag() {
+				return wasOpenBeforeDrag;
+			},
+			set wasOpenBeforeDrag(v) {
+				wasOpenBeforeDrag = v;
+			},
+			handleDragStart,
+			handleDragEnd,
 			Frame: Frame_vue_default,
 			Header: Header_vue_default,
 			SelectHint: SelectHint_vue_default,
@@ -1647,16 +2088,24 @@ var _hoisted_9 = {
 };
 function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
 	return openBlock(), createElementBlock("div", { class: normalizeClass($setup.containerClasses) }, [
-		createVNode($setup["Trigger"], null, createSlots({ _: 2 }, [$setup.slots["button-icon"] ? {
+		createVNode($setup["Trigger"], {
+			ref: "triggerRef",
+			onOffsetChange: $setup.handleBubbleOffsetChange,
+			onDragStart: $setup.handleDragStart,
+			onDragEnd: $setup.handleDragEnd
+		}, createSlots({ _: 2 }, [$setup.slots["button-icon"] ? {
 			name: "default",
 			fn: withCtx(() => [renderSlot(_ctx.$slots, "button-icon")]),
 			key: "0"
-		} : void 0]), 1024),
-		createCommentVNode(" <SelectedBubbles v-if=\"bubbleVisible\" /> "),
-		withDirectives(createElementVNode("div", { class: normalizeClass(["opencode-chat", {
-			open: $props.open,
-			minimized: $setup.minimized
-		}]) }, [
+		} : void 0]), 1536),
+		withDirectives(createElementVNode("div", {
+			class: normalizeClass(["opencode-chat", {
+				open: $props.open,
+				minimized: $setup.minimized,
+				dragging: $setup.isDragging
+			}]),
+			style: normalizeStyle($setup.chatPositionStyle)
+		}, [
 			createVNode($setup["Header"], null, createSlots({ _: 2 }, [
 				$setup.slots["session-toggle-icon"] ? {
 					name: "session-toggle-icon",
@@ -1674,7 +2123,6 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
 					key: "2"
 				} : void 0
 			]), 1024),
-			createCommentVNode(" Notification "),
 			$setup.notificationVisible && $setup.notificationMode === "widget" ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString($setup.notificationMessage), 1)) : createCommentVNode("v-if", true),
 			createElementVNode("div", _hoisted_2, [
 				createVNode($setup["SessionList"], null, {
@@ -1705,19 +2153,16 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
 				]), 1536),
 				createVNode($setup["SelectedNodes"])
 			])
-		], 2), [[vShow, !$props.selectMode]]),
+		], 6), [[vShow, !$props.selectMode]]),
 		createVNode($setup["SelectHint"]),
-		createCommentVNode(" Inspector Highlight "),
 		withDirectives(createElementVNode("div", {
 			class: "opencode-element-highlight",
 			style: normalizeStyle(__spreadValues({ display: $setup.highlightVisible ? "block" : "none" }, $setup.highlightStyle))
 		}, null, 4), [[vShow, $setup.highlightVisible]]),
-		createCommentVNode(" Inspector Tooltip "),
 		withDirectives(createElementVNode("div", {
 			class: "opencode-element-tooltip",
 			style: normalizeStyle(__spreadValues({ display: $setup.tooltipVisible ? "block" : "none" }, $setup.tooltipStyle))
 		}, [createElementVNode("div", _hoisted_3, toDisplayString($setup.tooltipContent.description), 1), createElementVNode("div", _hoisted_4, toDisplayString($setup.tooltipContent.fileInfo), 1)], 4), [[vShow, $setup.tooltipVisible]]),
-		createCommentVNode(" Dialog "),
 		$setup.dialogVisible ? (openBlock(), createElementBlock("div", _hoisted_5, [createElementVNode("div", _hoisted_6, [createElementVNode("div", _hoisted_7, [createElementVNode("div", _hoisted_8, toDisplayString($setup.dialogMessage), 1)]), createElementVNode("div", { class: "opencode-dialog-actions" }, [createElementVNode("button", {
 			class: "opencode-dialog-btn cancel",
 			onClick: $setup.handleDialogCancel
@@ -1725,7 +2170,6 @@ function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
 			class: "opencode-dialog-btn confirm",
 			onClick: $setup.handleDialogConfirm
 		}, "确认")])])])) : createCommentVNode("v-if", true),
-		createCommentVNode(" Page-level Notification "),
 		(openBlock(), createBlock(Teleport, { to: "body" }, [$setup.notificationVisible && $setup.notificationMode === "page" ? (openBlock(), createElementBlock("div", _hoisted_9, toDisplayString($setup.notificationMessage), 1)) : createCommentVNode("v-if", true)]))
 	], 2);
 }
@@ -1735,7 +2179,7 @@ __vue_sfc__.render = __vue_render__;
 var open_code_widget_default = __vue_sfc__;
 //#endregion
 //#region es/index.js
-var version = "1.0.22";
+var version = "1.0.24";
 function install(app, options) {
 	[open_code_widget_default].forEach((item) => {
 		if (item.install) app.use(item, options);