@yr-kits/dev-copilot 0.1.0 → 0.1.2

package/dist/index.mjs

@@ -1,850 +1,7 @@
-import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import "./dev-copilot-context-CA9bqV_U.mjs";
+import { t as DevCopilotProvider } from "./dev-copilot-provider-D0_wEEem.mjs";
+import "./app/index.mjs";
+import { t as CopilotOverlayWidget } from "./copilot-overlay-ClRoIHew.mjs";
+import "./widgets/copilot-overlay/index.mjs";
 
-//#region src/lib/config.ts
-const defaultConfig = {
-	enabled: process.env.NODE_ENV === "development",
-	allowedPaths: ["."]
-};
-const resolveDevCopilotConfig = (config) => {
-	const nextConfig = config ?? {};
-	return {
-		...defaultConfig,
-		...nextConfig
-	};
-};
-
-//#endregion
-//#region src/components/dev-copilot-provider.tsx
-const DevCopilotContext = createContext(null);
-function DevCopilotProvider({ config, children }) {
-	const resolvedConfig = resolveDevCopilotConfig(config);
-	return /* @__PURE__ */ jsx(DevCopilotContext.Provider, {
-		value: resolvedConfig,
-		children
-	});
-}
-const useDevCopilotConfig = () => {
-	const context = useContext(DevCopilotContext);
-	if (!context) throw new Error("DevCopilotProvider 내부에서만 사용할 수 있습니다.");
-	return context;
-};
-
-//#endregion
-//#region src/lib/api-client.ts
-const API_BASE_URL = "http://127.0.0.1:3339";
-const parseResponse = async (response) => {
-	const payload = await response.json();
-	if (!response.ok) {
-		const errorMessage = typeof payload === "object" && payload && "error" in payload ? payload.error : "요청 처리 중 오류가 발생했습니다.";
-		throw new Error(errorMessage);
-	}
-	return payload;
-};
-const createCopilotApiClient = () => {
-	const post = async (path, body) => {
-		return parseResponse(await fetch(`${API_BASE_URL}${path}`, {
-			method: "POST",
-			headers: { "Content-Type": "application/json" },
-			body: JSON.stringify(body)
-		}));
-	};
-	return {
-		status: async (agent) => {
-			const query = agent ? `?agent=${agent}` : "";
-			return parseResponse(await fetch(`${API_BASE_URL}/status${query}`));
-		},
-		chat: (payload) => post("/chat", payload),
-		apply: (payload) => post("/apply", payload)
-	};
-};
-
-//#endregion
-//#region src/hooks/use-selection-capture.ts
-const OVERLAY_ATTRIBUTE = "data-dev-copilot-overlay";
-const toSelectionText = () => {
-	return window.getSelection()?.toString().trim() ?? "";
-};
-const isNodeInsideOverlay = (node) => {
-	if (!node) return false;
-	const element = node instanceof Element ? node : node.parentElement;
-	return Boolean(element?.closest(`[${OVERLAY_ATTRIBUTE}]`));
-};
-const isInsideOverlay = (target) => {
-	return target instanceof Element && Boolean(target.closest(`[${OVERLAY_ATTRIBUTE}]`));
-};
-const useSelectionCapture = () => {
-	const [selectedText, setSelectedText] = useState("");
-	const syncSelection = useCallback((event) => {
-		const selection = window.getSelection();
-		const startedInsideOverlay = isNodeInsideOverlay(selection?.anchorNode ?? null);
-		const endedInsideOverlay = isNodeInsideOverlay(selection?.focusNode ?? null);
-		if (isInsideOverlay(event.target) || startedInsideOverlay || endedInsideOverlay) return;
-		const nextSelectedText = selection?.toString().trim() ?? toSelectionText();
-		if (!nextSelectedText) return;
-		setSelectedText(nextSelectedText);
-	}, []);
-	useEffect(() => {
-		document.addEventListener("mouseup", syncSelection);
-		document.addEventListener("keyup", syncSelection);
-		return () => {
-			document.removeEventListener("mouseup", syncSelection);
-			document.removeEventListener("keyup", syncSelection);
-		};
-	}, [syncSelection]);
-	return {
-		selectedText,
-		setSelectedText,
-		clearSelection: () => setSelectedText("")
-	};
-};
-
-//#endregion
-//#region src/components/icons.tsx
-const SparklesIcon = (props) => {
-	return /* @__PURE__ */ jsxs("svg", {
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "1.8",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			/* @__PURE__ */ jsx("path", { d: "M12 3.75 13.68 8.32 18.25 10 13.68 11.68 12 16.25 10.32 11.68 5.75 10 10.32 8.32 12 3.75Z" }),
-			/* @__PURE__ */ jsx("path", { d: "M18.5 3.75 19.08 5.42 20.75 6 19.08 6.58 18.5 8.25 17.92 6.58 16.25 6 17.92 5.42 18.5 3.75Z" }),
-			/* @__PURE__ */ jsx("path", { d: "M6 15.5 7 18.25 9.75 19.25 7 20.25 6 23 5 20.25 2.25 19.25 5 18.25 6 15.5Z" })
-		]
-	});
-};
-const PanelRightOpenIcon = (props) => {
-	return /* @__PURE__ */ jsxs("svg", {
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "1.8",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			/* @__PURE__ */ jsx("rect", {
-				x: "3.75",
-				y: "4.75",
-				width: "16.5",
-				height: "14.5",
-				rx: "2.25"
-			}),
-			/* @__PURE__ */ jsx("path", { d: "M8.75 4.75v14.5" }),
-			/* @__PURE__ */ jsx("path", { d: "m13 9.25 3 2.75-3 2.75" })
-		]
-	});
-};
-const PanelRightCloseIcon = (props) => {
-	return /* @__PURE__ */ jsxs("svg", {
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "1.8",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			/* @__PURE__ */ jsx("rect", {
-				x: "3.75",
-				y: "4.75",
-				width: "16.5",
-				height: "14.5",
-				rx: "2.25"
-			}),
-			/* @__PURE__ */ jsx("path", { d: "M15.25 4.75v14.5" }),
-			/* @__PURE__ */ jsx("path", { d: "m11 9.25-3 2.75 3 2.75" })
-		]
-	});
-};
-
-//#endregion
-//#region src/components/dev-copilot-overlay.tsx
-const FLOATING_BUTTON_SIZE = 48;
-const DRAG_CLICK_THRESHOLD = 4;
-const PANEL_WIDTH = "min(1028px, calc(100vw - 48px))";
-const INPUT_PANEL_WIDTH = 420;
-const RAIL_WIDTH = 36;
-const AGENT_LABELS = {
-	codex: "Codex CLI",
-	claude: "Claude Code CLI"
-};
-const UI_LABELS = {
-	title: "Dev Copilot",
-	subtitle: "텍스트를 선택한 뒤 프롬프트를 입력하세요.",
-	promptPlaceholder: "무엇을 도와드릴까요?",
-	askButton: "질문",
-	editButton: "코드 수정 제안",
-	applyButton: "미리보기 적용"
-};
-const styleText = `
-.yrdc-trigger{transition:transform 150ms ease-out, box-shadow 150ms ease-out}
-.yrdc-trigger:hover{transform:scale(1.05)}
-.yrdc-pressable{transition:transform 150ms ease-out, background-color 150ms ease-out, opacity 150ms ease-out}
-.yrdc-pressable:hover{transform:translateY(-1px)}
-.yrdc-spinner{animation:yrdc-spin 1s linear infinite}
-.yrdc-field:focus{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.14);border-color:#93c5fd}
-@keyframes yrdc-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
-`;
-function DevCopilotOverlay() {
-	const config = useDevCopilotConfig();
-	const apiClient = useMemo(() => createCopilotApiClient(), []);
-	const { selectedText, setSelectedText } = useSelectionCapture();
-	const [open, setOpen] = useState(false);
-	const [prompt, setPrompt] = useState("");
-	const [busy, setBusy] = useState(false);
-	const [error, setError] = useState(null);
-	const [chatResult, setChatResult] = useState(null);
-	const [toastMessage, setToastMessage] = useState(null);
-	const [agentStatus, setAgentStatus] = useState(null);
-	const [selectedAgent, setSelectedAgent] = useState("codex");
-	const [position, setPosition] = useState(null);
-	const [showResponsePanel, setShowResponsePanel] = useState(false);
-	const containerRef = useRef(null);
-	const suppressMainToggleClickRef = useRef(false);
-	const dragStateRef = useRef(null);
-	useEffect(() => {
-		const onResize = () => {
-			setPosition((prev) => {
-				if (!prev) return prev;
-				return {
-					x: Math.min(Math.max(prev.x, 0), Math.max(0, window.innerWidth - FLOATING_BUTTON_SIZE)),
-					y: Math.min(Math.max(prev.y, 0), Math.max(0, window.innerHeight - FLOATING_BUTTON_SIZE))
-				};
-			});
-		};
-		window.addEventListener("resize", onResize);
-		return () => window.removeEventListener("resize", onResize);
-	}, []);
-	useEffect(() => {
-		if (!open) return;
-		let ignore = false;
-		apiClient.status(selectedAgent).then((status) => {
-			if (!ignore) setAgentStatus(status);
-		}).catch((caughtError) => {
-			if (!ignore) setAgentStatus({
-				available: false,
-				authenticated: false,
-				agent: selectedAgent,
-				message: caughtError instanceof Error ? caughtError.message : "로컬 에이전트 상태 확인에 실패했습니다."
-			});
-		});
-		return () => {
-			ignore = true;
-		};
-	}, [
-		apiClient,
-		open,
-		selectedAgent
-	]);
-	useEffect(() => {
-		if (!open) return;
-		const onPointerDownOutside = (event) => {
-			const target = event.target;
-			if (!(target instanceof Node)) return;
-			if (containerRef.current?.contains(target)) return;
-			setOpen(false);
-			setShowResponsePanel(false);
-			dragStateRef.current = null;
-			suppressMainToggleClickRef.current = false;
-		};
-		document.addEventListener("pointerdown", onPointerDownOutside);
-		return () => {
-			document.removeEventListener("pointerdown", onPointerDownOutside);
-		};
-	}, [open]);
-	if (!config.enabled) return null;
-	const onPointerDown = (event) => {
-		if (event.button !== 0) return;
-		const wrapperRect = containerRef.current?.getBoundingClientRect();
-		const originX = position?.x ?? wrapperRect?.left ?? 0;
-		const originY = position?.y ?? wrapperRect?.top ?? 0;
-		event.currentTarget.setPointerCapture(event.pointerId);
-		dragStateRef.current = {
-			pointerId: event.pointerId,
-			startX: event.clientX,
-			startY: event.clientY,
-			originX,
-			originY,
-			moved: false
-		};
-	};
-	const onPointerMove = (event) => {
-		const dragState = dragStateRef.current;
-		if (!dragState || dragState.pointerId !== event.pointerId) return;
-		const deltaX = event.clientX - dragState.startX;
-		const deltaY = event.clientY - dragState.startY;
-		if (!(Math.abs(deltaX) > DRAG_CLICK_THRESHOLD || Math.abs(deltaY) > DRAG_CLICK_THRESHOLD) && !dragState.moved) return;
-		dragState.moved = true;
-		setPosition({
-			x: Math.min(Math.max(dragState.originX + deltaX, 0), Math.max(0, window.innerWidth - FLOATING_BUTTON_SIZE)),
-			y: Math.min(Math.max(dragState.originY + deltaY, 0), Math.max(0, window.innerHeight - FLOATING_BUTTON_SIZE))
-		});
-	};
-	const onPointerEnd = (event) => {
-		if (dragStateRef.current?.pointerId !== event.pointerId) return;
-		suppressMainToggleClickRef.current = dragStateRef.current.moved;
-		dragStateRef.current = null;
-		event.currentTarget.releasePointerCapture(event.pointerId);
-	};
-	const onMainToggleClick = () => {
-		if (suppressMainToggleClickRef.current) {
-			suppressMainToggleClickRef.current = false;
-			return;
-		}
-		setOpen((prev) => {
-			const next = !prev;
-			if (!next) {
-				setPosition(null);
-				dragStateRef.current = null;
-				suppressMainToggleClickRef.current = false;
-			}
-			return next;
-		});
-	};
-	const previousResponse = chatResult ? [`message:\n${chatResult.message}`, chatResult.patchPreview ? `patchPreview:\n${chatResult.patchPreview}` : ""].filter(Boolean).join("\n\n") : void 0;
-	const onSubmit = async (mode) => {
-		if (agentStatus && (!agentStatus.available || !agentStatus.authenticated)) {
-			setError(agentStatus.message);
-			return;
-		}
-		if (!prompt.trim()) {
-			setError("프롬프트를 입력해 주세요.");
-			return;
-		}
-		setBusy(true);
-		setError(null);
-		setShowResponsePanel(true);
-		try {
-			const currentRoute = typeof window !== "undefined" ? window.location.pathname : void 0;
-			setChatResult(await apiClient.chat({
-				selectedText,
-				prompt,
-				mode,
-				context: {
-					route: currentRoute,
-					fileHints: config.allowedPaths,
-					previousResponse,
-					agent: selectedAgent
-				}
-			}));
-		} catch (caughtError) {
-			setError(caughtError instanceof Error ? caughtError.message : "요청 처리 중 오류가 발생했습니다.");
-		} finally {
-			setBusy(false);
-		}
-	};
-	const onApply = async () => {
-		if (!chatResult?.patchId) {
-			setError("적용 가능한 패치가 없습니다.");
-			return;
-		}
-		setBusy(true);
-		setError(null);
-		setShowResponsePanel(true);
-		try {
-			const result = await apiClient.apply({
-				patchId: chatResult.patchId,
-				approvalToken: `approve:${chatResult.patchId}`
-			});
-			if (result.applied) {
-				setToastMessage(result.summary);
-				window.setTimeout(() => {
-					setToastMessage(null);
-				}, 3e3);
-			}
-		} catch (caughtError) {
-			setError(caughtError instanceof Error ? caughtError.message : "패치 적용 중 오류가 발생했습니다.");
-		} finally {
-			setBusy(false);
-		}
-	};
-	const floatingWrapperStyle = position ? {
-		position: "fixed",
-		zIndex: 2147483e3,
-		left: `${position.x}px`,
-		top: `${position.y}px`
-	} : {
-		position: "fixed",
-		right: 24,
-		bottom: 24,
-		zIndex: 2147483e3
-	};
-	const panelStyle = {
-		position: "relative",
-		marginTop: 12,
-		display: "grid",
-		gridTemplateColumns: showResponsePanel ? `${INPUT_PANEL_WIDTH}px ${RAIL_WIDTH}px minmax(0, 1fr)` : `${INPUT_PANEL_WIDTH}px ${RAIL_WIDTH}px`,
-		width: showResponsePanel ? PANEL_WIDTH : INPUT_PANEL_WIDTH + RAIL_WIDTH,
-		maxHeight: "calc(100vh - 96px)",
-		overflow: "hidden",
-		border: "1px solid #e5e7eb",
-		borderRadius: 24,
-		background: "#f8fafc",
-		boxShadow: "0 18px 60px rgba(15, 23, 42, 0.16)",
-		color: "#0f172a",
-		fontFamily: "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif"
-	};
-	return /* @__PURE__ */ jsxs(Fragment, { children: [
-		/* @__PURE__ */ jsx("style", { children: styleText }),
-		toastMessage ? /* @__PURE__ */ jsx("div", {
-			style: toastStyle,
-			children: /* @__PURE__ */ jsx("p", {
-				"aria-live": "polite",
-				style: { margin: 0 },
-				children: toastMessage
-			})
-		}) : null,
-		/* @__PURE__ */ jsxs("div", {
-			ref: containerRef,
-			style: floatingWrapperStyle,
-			[OVERLAY_ATTRIBUTE]: "",
-			children: [/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("button", {
-				type: "button",
-				className: "yrdc-trigger",
-				style: triggerButtonStyle,
-				onClick: onMainToggleClick,
-				onPointerDown,
-				onPointerMove,
-				onPointerUp: onPointerEnd,
-				onPointerCancel: onPointerEnd,
-				"aria-label": "Dev Copilot 열기",
-				title: "Dev Copilot 열기/닫기 / 드래그해서 이동",
-				children: /* @__PURE__ */ jsx(SparklesIcon, {
-					"aria-hidden": true,
-					style: {
-						width: 16,
-						height: 16
-					}
-				})
-			}) }), open ? /* @__PURE__ */ jsxs("section", {
-				style: panelStyle,
-				children: [
-					/* @__PURE__ */ jsx("div", {
-						style: railStyle,
-						children: /* @__PURE__ */ jsx("button", {
-							type: "button",
-							className: "yrdc-pressable",
-							style: railToggleStyle,
-							onClick: () => setShowResponsePanel((prev) => !prev),
-							"aria-label": showResponsePanel ? "응답 패널 닫기" : "응답 패널 열기",
-							title: showResponsePanel ? "응답 패널 닫기" : "응답 패널 열기",
-							children: showResponsePanel ? /* @__PURE__ */ jsx(PanelRightCloseIcon, {
-								"aria-hidden": true,
-								style: {
-									width: 14,
-									height: 14
-								}
-							}) : /* @__PURE__ */ jsx(PanelRightOpenIcon, {
-								"aria-hidden": true,
-								style: {
-									width: 14,
-									height: 14
-								}
-							})
-						})
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						style: inputPanelStyle,
-						children: [
-							/* @__PURE__ */ jsxs("header", { children: [/* @__PURE__ */ jsx("p", {
-								style: titleStyle,
-								children: UI_LABELS.title
-							}), /* @__PURE__ */ jsx("p", {
-								style: subtitleStyle,
-								children: UI_LABELS.subtitle
-							})] }),
-							/* @__PURE__ */ jsxs("div", {
-								style: statusBoxStyle,
-								children: [
-									/* @__PURE__ */ jsxs("p", {
-										style: statusLineStyle,
-										children: ["로컬 에이전트: ", AGENT_LABELS[selectedAgent]]
-									}),
-									agentStatus?.model ? /* @__PURE__ */ jsxs("p", {
-										style: statusLineStyle,
-										children: ["모델: ", agentStatus.model]
-									}) : null,
-									agentStatus ? /* @__PURE__ */ jsxs("p", {
-										style: {
-											...statusLineStyle,
-											color: agentStatus.authenticated ? "#15803d" : "#dc2626"
-										},
-										children: [agentStatus.message, agentStatus.loginCommand ? ` 터미널에서 ${agentStatus.loginCommand} 실행` : ""]
-									}) : null
-								]
-							}),
-							/* @__PURE__ */ jsx("label", {
-								style: labelStyle,
-								children: "에이전트"
-							}),
-							/* @__PURE__ */ jsx("div", {
-								style: agentToggleRowStyle,
-								children: ["codex", "claude"].map((agent) => {
-									const active = selectedAgent === agent;
-									return /* @__PURE__ */ jsx("button", {
-										type: "button",
-										className: "yrdc-pressable",
-										onClick: () => setSelectedAgent(agent),
-										disabled: busy,
-										style: {
-											...agentToggleButtonStyle,
-											background: active ? "#111827" : "#e2e8f0",
-											color: active ? "#ffffff" : "#1e293b",
-											opacity: busy ? .6 : 1
-										},
-										children: AGENT_LABELS[agent]
-									}, agent);
-								})
-							}),
-							/* @__PURE__ */ jsx("label", {
-								style: labelStyle,
-								children: "선택 텍스트"
-							}),
-							/* @__PURE__ */ jsx("textarea", {
-								value: selectedText,
-								onChange: (event) => setSelectedText(event.target.value),
-								rows: 5,
-								className: "yrdc-field",
-								style: textareaStyle
-							}),
-							/* @__PURE__ */ jsx("label", {
-								style: labelStyle,
-								children: "프롬프트"
-							}),
-							/* @__PURE__ */ jsx("textarea", {
-								value: prompt,
-								onChange: (event) => setPrompt(event.target.value),
-								rows: 4,
-								placeholder: UI_LABELS.promptPlaceholder,
-								className: "yrdc-field",
-								style: textareaStyle
-							}),
-							/* @__PURE__ */ jsxs("div", {
-								style: buttonRowStyle,
-								children: [/* @__PURE__ */ jsx("button", {
-									type: "button",
-									className: "yrdc-pressable",
-									onClick: () => onSubmit("answer"),
-									disabled: busy || Boolean(agentStatus && !agentStatus.authenticated),
-									style: {
-										...buttonStyle,
-										background: "#111827",
-										color: "#ffffff",
-										opacity: busy || Boolean(agentStatus && !agentStatus.authenticated) ? .55 : 1
-									},
-									children: UI_LABELS.askButton
-								}), /* @__PURE__ */ jsx("button", {
-									type: "button",
-									className: "yrdc-pressable",
-									onClick: () => onSubmit("edit"),
-									disabled: busy || Boolean(agentStatus && !agentStatus.authenticated),
-									style: {
-										...buttonStyle,
-										background: "#2563eb",
-										color: "#ffffff",
-										opacity: busy || Boolean(agentStatus && !agentStatus.authenticated) ? .55 : 1
-									},
-									children: UI_LABELS.editButton
-								})]
-							})
-						]
-					}),
-					showResponsePanel ? /* @__PURE__ */ jsx("aside", {
-						style: responsePanelStyle,
-						children: /* @__PURE__ */ jsxs("div", {
-							style: {
-								display: "flex",
-								flexDirection: "column",
-								minHeight: 320,
-								height: "100%"
-							},
-							children: [/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", {
-								style: titleStyle,
-								children: "응답"
-							}) }), /* @__PURE__ */ jsx("div", {
-								style: responseCardStyle,
-								children: busy ? /* @__PURE__ */ jsxs("div", {
-									style: busyContainerStyle,
-									children: [/* @__PURE__ */ jsx("span", {
-										className: "yrdc-spinner",
-										style: spinnerStyle
-									}), /* @__PURE__ */ jsxs("span", { children: [AGENT_LABELS[selectedAgent], " 응답을 기다리는 중입니다."] })]
-								}) : chatResult ? /* @__PURE__ */ jsxs("article", {
-									style: articleStyle,
-									children: [
-										error ? /* @__PURE__ */ jsx("p", {
-											style: errorBoxStyle,
-											children: error
-										}) : null,
-										chatResult.warnings.length ? /* @__PURE__ */ jsx("div", {
-											style: warningBoxStyle,
-											children: chatResult.warnings.map((warning) => /* @__PURE__ */ jsx("p", {
-												style: { margin: 0 },
-												children: warning
-											}, warning))
-										}) : null,
-										/* @__PURE__ */ jsx("p", {
-											style: messageStyle,
-											children: chatResult.message
-										}),
-										chatResult.patchPreview ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("pre", {
-											style: patchPreviewStyle,
-											children: chatResult.patchPreview
-										}), chatResult.patchId ? /* @__PURE__ */ jsx("button", {
-											type: "button",
-											className: "yrdc-pressable",
-											onClick: onApply,
-											disabled: busy,
-											style: {
-												...buttonStyle,
-												alignSelf: "flex-start",
-												background: "#15803d",
-												color: "#ffffff",
-												opacity: busy ? .55 : 1
-											},
-											children: UI_LABELS.applyButton
-										}) : null] }) : null
-									]
-								}) : error ? /* @__PURE__ */ jsx("p", {
-									style: errorBoxStyle,
-									children: error
-								}) : /* @__PURE__ */ jsx("p", {
-									style: placeholderStyle,
-									children: "질문 또는 코드 수정 제안을 실행하면 이 영역에 결과가 표시됩니다."
-								})
-							})]
-						})
-					}) : null
-				]
-			}) : null]
-		})
-	] });
-}
-const triggerButtonStyle = {
-	display: "flex",
-	width: FLOATING_BUTTON_SIZE,
-	height: FLOATING_BUTTON_SIZE,
-	borderRadius: 9999,
-	border: "1px solid #f2d675",
-	background: "#fff4b8",
-	color: "#ffb03d",
-	alignItems: "center",
-	justifyContent: "center",
-	boxShadow: "0 12px 28px rgba(15, 23, 42, 0.18)",
-	cursor: "grab"
-};
-const railStyle = {
-	display: "flex",
-	minHeight: 320,
-	alignItems: "center",
-	justifyContent: "center",
-	borderLeft: "1px solid #e5e7eb",
-	background: "#f8fafc"
-};
-const railToggleStyle = {
-	display: "flex",
-	width: 24,
-	height: 24,
-	border: "0",
-	background: "transparent",
-	color: "#64748b",
-	cursor: "pointer",
-	alignItems: "center",
-	justifyContent: "center"
-};
-const inputPanelStyle = {
-	padding: 16,
-	minHeight: 0,
-	overflowY: "auto",
-	background: "#ffffff"
-};
-const responsePanelStyle = {
-	minHeight: 0,
-	overflow: "hidden",
-	padding: 16,
-	borderLeft: "1px solid #e5e7eb",
-	background: "#f8fafc"
-};
-const titleStyle = {
-	margin: 0,
-	fontSize: 18,
-	fontWeight: 700,
-	lineHeight: 1.4,
-	color: "#111827"
-};
-const subtitleStyle = {
-	margin: "4px 0 0",
-	fontSize: 14,
-	lineHeight: 1.5,
-	color: "#6b7280"
-};
-const statusBoxStyle = {
-	marginTop: 12,
-	border: "1px solid #e5e7eb",
-	borderRadius: 16,
-	background: "#ffffff",
-	padding: "12px 14px",
-	fontSize: 14,
-	lineHeight: 1.6,
-	color: "#6b7280"
-};
-const statusLineStyle = { margin: 0 };
-const labelStyle = {
-	display: "block",
-	marginTop: 16,
-	fontSize: 14,
-	lineHeight: 1.5,
-	color: "#6b7280"
-};
-const textareaStyle = {
-	width: "100%",
-	resize: "vertical",
-	borderRadius: 16,
-	border: "1px solid #e5e7eb",
-	background: "#ffffff",
-	padding: "12px 14px",
-	marginTop: 6,
-	fontSize: 15,
-	lineHeight: 1.7,
-	color: "#111827",
-	boxSizing: "border-box",
-	minHeight: 132
-};
-const agentToggleRowStyle = {
-	display: "flex",
-	gap: 8,
-	marginTop: 6
-};
-const agentToggleButtonStyle = {
-	border: 0,
-	borderRadius: 10,
-	padding: "8px 12px",
-	fontSize: 13,
-	fontWeight: 600,
-	lineHeight: 1.2,
-	cursor: "pointer"
-};
-const buttonRowStyle = {
-	display: "flex",
-	alignItems: "center",
-	gap: 8,
-	marginTop: 16
-};
-const buttonStyle = {
-	border: 0,
-	borderRadius: 12,
-	padding: "10px 14px",
-	fontSize: 14,
-	fontWeight: 600,
-	lineHeight: 1,
-	cursor: "pointer"
-};
-const responseCardStyle = {
-	marginTop: 12,
-	minHeight: 0,
-	flex: 1,
-	overflowY: "auto",
-	borderRadius: 18,
-	border: "1px solid #e5e7eb",
-	background: "#ffffff",
-	padding: 16
-};
-const busyContainerStyle = {
-	display: "flex",
-	height: "100%",
-	minHeight: 192,
-	alignItems: "center",
-	justifyContent: "center",
-	gap: 12,
-	color: "#6b7280",
-	fontSize: 14
-};
-const spinnerStyle = {
-	display: "inline-block",
-	width: 18,
-	height: 18,
-	borderRadius: 9999,
-	border: "2px solid #d1d5db",
-	borderTopColor: "#2563eb"
-};
-const articleStyle = {
-	display: "flex",
-	flexDirection: "column",
-	gap: 12
-};
-const errorBoxStyle = {
-	margin: 0,
-	border: "1px solid #fca5a5",
-	borderRadius: 12,
-	background: "#fef2f2",
-	padding: "10px 12px",
-	fontSize: 14,
-	lineHeight: 1.6,
-	color: "#dc2626",
-	whiteSpace: "pre-wrap"
-};
-const warningBoxStyle = {
-	display: "flex",
-	flexDirection: "column",
-	gap: 6,
-	border: "1px solid #fca5a5",
-	borderRadius: 12,
-	background: "#fef2f2",
-	padding: "10px 12px",
-	fontSize: 14,
-	lineHeight: 1.6,
-	color: "#dc2626"
-};
-const messageStyle = {
-	margin: 0,
-	whiteSpace: "pre-wrap",
-	fontSize: 15,
-	lineHeight: 1.7,
-	color: "#111827"
-};
-const patchPreviewStyle = {
-	margin: 0,
-	maxHeight: 288,
-	overflow: "auto",
-	borderRadius: 12,
-	border: "1px solid #e5e7eb",
-	background: "#f8fafc",
-	padding: 12,
-	fontSize: 13,
-	lineHeight: 1.6,
-	color: "#111827",
-	fontFamily: "ui-monospace, SFMono-Regular, SFMono-Regular, Menlo, Consolas, monospace",
-	whiteSpace: "pre-wrap",
-	wordBreak: "break-word"
-};
-const placeholderStyle = {
-	margin: 0,
-	fontSize: 14,
-	lineHeight: 1.6,
-	color: "#6b7280"
-};
-const toastStyle = {
-	position: "fixed",
-	top: 16,
-	right: 16,
-	zIndex: 2147483600,
-	maxWidth: 360,
-	borderRadius: 16,
-	border: "1px solid #bbf7d0",
-	background: "#f0fdf4",
-	color: "#15803d",
-	padding: "12px 14px",
-	boxShadow: "0 12px 28px rgba(15, 23, 42, 0.12)",
-	fontFamily: "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
-	fontSize: 14,
-	lineHeight: 1.6
-};
-
-//#endregion
-export { DevCopilotOverlay, DevCopilotProvider, useSelectionCapture };
-//# sourceMappingURL=index.mjs.map
+export { CopilotOverlayWidget as DevCopilotOverlay, DevCopilotProvider };