@industry-theme/xterm-terminal-panel 0.5.36 → 0.7.0

package/dist/index.js

@@ -35,7 +35,7 @@ import {
 // package.json
 var package_default = {
   name: "@industry-theme/xterm-terminal-panel",
-  version: "0.5.36",
+  version: "0.7.0",
   description: "Industry-themed xterm.js terminal components with panel framework integration",
   type: "module",
   main: "dist/index.js",
@@ -1281,11 +1281,568 @@ var ThemedTerminalWithProvider = forwardRef2((props, ref) => {
   });
 });
 ThemedTerminalWithProvider.displayName = "ThemedTerminalWithProvider";
-// src/hooks/useThemedTerminal.ts
+// src/renderer/XtermRenderer.tsx
+import { forwardRef as forwardRef3, useImperativeHandle as useImperativeHandle2, useRef as useRef2 } from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var XtermRenderer = forwardRef3((props, ref) => {
+  const {
+    transparent,
+    enableSearch = true,
+    enableWebLinks = true,
+    cursorBlink = true,
+    convertEol = true,
+    ...rest
+  } = props;
+  const innerRef = useRef2(null);
+  useImperativeHandle2(ref, () => ({
+    write: (data) => innerRef.current?.write(data),
+    clear: () => innerRef.current?.clear(),
+    focus: () => innerRef.current?.focus(),
+    blur: () => innerRef.current?.blur(),
+    fit: () => innerRef.current?.fit(),
+    resize: (cols, rows) => innerRef.current?.resize(cols, rows),
+    scrollToBottom: () => innerRef.current?.scrollToBottom(),
+    scrollLines: (delta) => {
+      innerRef.current?.getTerminal()?.scrollLines(delta);
+    },
+    getDimensions: () => {
+      const term = innerRef.current?.getTerminal();
+      if (!term || !term.cols || !term.rows)
+        return null;
+      return { cols: term.cols, rows: term.rows };
+    },
+    getScrollPosition: () => innerRef.current?.getScrollPosition() ?? {
+      isAtTop: false,
+      isAtBottom: true,
+      isScrollLocked: false
+    },
+    isScrollLocked: () => innerRef.current?.isScrollLocked() ?? false
+  }), []);
+  return /* @__PURE__ */ jsx4(ThemedTerminalWithProvider, {
+    ref: innerRef,
+    ...rest,
+    enableSearch,
+    enableWebLinks,
+    cursorBlink,
+    convertEol,
+    hideHeader: true,
+    activityDetection: false,
+    allowTransparency: transparent
+  });
+});
+XtermRenderer.displayName = "XtermRenderer";
+// src/components/TerminalSession.tsx
 import { useTheme as useTheme2 } from "@principal-ade/industry-theme";
+import {
+  forwardRef as forwardRef4,
+  useCallback as useCallback2,
+  useEffect as useEffect2,
+  useImperativeHandle as useImperativeHandle3,
+  useRef as useRef3,
+  useState as useState2
+} from "react";
+
+// src/components/TerminalOverlay.tsx
+import { Monitor as Monitor2 } from "lucide-react";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+var TerminalOverlay = ({ state, theme }) => /* @__PURE__ */ jsxs3("div", {
+  style: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: theme.colors.background,
+    opacity: state.opacity ?? 1,
+    gap: "16px",
+    padding: "32px",
+    zIndex: 10
+  },
+  children: [
+    /* @__PURE__ */ jsx5(Monitor2, {
+      size: 48,
+      color: theme.colors.textSecondary
+    }),
+    /* @__PURE__ */ jsx5("div", {
+      style: {
+        fontSize: "16px",
+        fontWeight: "500",
+        color: theme.colors.text,
+        textAlign: "center"
+      },
+      children: state.message
+    }),
+    state.subtitle && /* @__PURE__ */ jsx5("div", {
+      style: {
+        fontSize: "14px",
+        color: theme.colors.textSecondary,
+        textAlign: "center",
+        maxWidth: "400px"
+      },
+      children: state.subtitle
+    }),
+    state.actions && state.actions.length > 0 && /* @__PURE__ */ jsx5("div", {
+      style: {
+        display: "flex",
+        gap: "12px",
+        marginTop: "8px"
+      },
+      children: state.actions.map((action) => /* @__PURE__ */ jsxs3("button", {
+        type: "button",
+        onClick: action.onClick,
+        style: {
+          padding: "8px 16px",
+          backgroundColor: action.primary ? theme.colors.primary : "transparent",
+          color: action.primary ? "#ffffff" : theme.colors.text,
+          border: action.primary ? "none" : `1px solid ${theme.colors.border}`,
+          borderRadius: "6px",
+          cursor: "pointer",
+          fontSize: "14px",
+          fontWeight: "500",
+          display: "flex",
+          alignItems: "center",
+          gap: "8px",
+          transition: "all 0.2s"
+        },
+        onMouseEnter: (e) => {
+          if (action.primary) {
+            e.currentTarget.style.opacity = "0.8";
+          } else {
+            e.currentTarget.style.backgroundColor = theme.colors.backgroundSecondary;
+          }
+        },
+        onMouseLeave: (e) => {
+          if (action.primary) {
+            e.currentTarget.style.opacity = "1";
+          } else {
+            e.currentTarget.style.backgroundColor = "transparent";
+          }
+        },
+        children: [
+          action.icon,
+          action.label
+        ]
+      }, action.label))
+    })
+  ]
+});
+
+// src/components/TerminalSession.tsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var TerminalSession = forwardRef4((props, ref) => {
+  const {
+    actions,
+    renderer: Renderer = XtermRenderer,
+    transparent,
+    backgroundColor,
+    defaultScrollLocked,
+    autoFocus = true,
+    isVisible = true,
+    scrollback = 1e4,
+    sessionId: sessionIdProp = null,
+    onSessionCreated,
+    cwd,
+    command,
+    sessionContext,
+    persistOnUnmount = false,
+    enableOwnership = false,
+    isForeign = false,
+    events,
+    activityDetection = false,
+    activityTimeout = 500,
+    onActivityChange,
+    onScrollPositionChange,
+    onLinkClick,
+    onShortcut,
+    overlayState,
+    isWorking = false,
+    workingMessage,
+    workingSubtitle
+  } = props;
+  const { theme } = useTheme2();
+  const rendererRef = useRef3(null);
+  const [localSessionId, setLocalSessionId] = useState2(sessionIdProp);
+  const [isInitialized, setIsInitialized] = useState2(false);
+  const hasInitializedRef = useRef3(false);
+  const pendingSessionIdRef = useRef3(null);
+  const [shouldRenderTerminal, setShouldRenderTerminal] = useState2(true);
+  const [ownerWindowId, setOwnerWindowId] = useState2(null);
+  const needsRefreshOnResizeRef = useRef3(false);
+  const [scrollPosition, setScrollPosition] = useState2({
+    isAtTop: false,
+    isAtBottom: true,
+    isScrollLocked: defaultScrollLocked ?? false
+  });
+  const isActiveRef = useRef3(false);
+  const activityStartedAtRef = useRef3(0);
+  const activityTimerRef = useRef3(null);
+  const claimAndConnect = useCallback2(async (targetSessionId, force = false) => {
+    if (!enableOwnership)
+      return;
+    try {
+      if (actions.claimTerminalOwnership) {
+        await actions.claimTerminalOwnership(targetSessionId, force);
+      }
+      if (force && actions.requestTerminalDataPort) {
+        await actions.requestTerminalDataPort(targetSessionId);
+      }
+      setShouldRenderTerminal(true);
+      setOwnerWindowId(null);
+      if (force) {
+        needsRefreshOnResizeRef.current = true;
+      }
+    } catch (error) {
+      console.error("[TerminalSession] Failed to claim ownership:", error);
+      throw error;
+    }
+  }, [actions, enableOwnership]);
+  useEffect2(() => {
+    if (hasInitializedRef.current)
+      return;
+    hasInitializedRef.current = true;
+    let mounted = true;
+    const tracer = getTracer();
+    const init = async () => {
+      try {
+        if (sessionIdProp) {
+          const span2 = tracer.startSpan("terminal.session.reconnect", {
+            attributes: {
+              "session.id": sessionIdProp,
+              "session.context": sessionContext ?? "",
+              "session.isForeign": isForeign
+            }
+          });
+          if (enableOwnership) {
+            if (isForeign && actions.checkTerminalOwnership) {
+              const status = await actions.checkTerminalOwnership(sessionIdProp);
+              if (status.ownedByWindowId && !status.ownedByThisWindow) {
+                setShouldRenderTerminal(false);
+                setOwnerWindowId(status.ownedByWindowId);
+                span2.addEvent("terminal.session.reconnect_blocked", {
+                  "owner.windowId": status.ownedByWindowId
+                });
+              }
+            } else {
+              await claimAndConnect(sessionIdProp);
+            }
+          }
+          if (mounted) {
+            setLocalSessionId(sessionIdProp);
+            setIsInitialized(true);
+          }
+          span2.setStatus({ code: SpanStatusCode.OK });
+          span2.end();
+          return;
+        }
+        if (!actions.createTerminalSession) {
+          if (mounted)
+            setIsInitialized(true);
+          return;
+        }
+        const span = tracer.startSpan("terminal.session.create", {
+          attributes: {
+            "session.cwd": cwd ?? "",
+            "session.context": sessionContext ?? ""
+          }
+        });
+        const newId = await actions.createTerminalSession({
+          cwd,
+          command,
+          context: sessionContext
+        });
+        pendingSessionIdRef.current = newId;
+        span.setAttribute("session.id", newId);
+        if (!mounted) {
+          span.setStatus({ code: SpanStatusCode.OK });
+          span.end();
+          return;
+        }
+        if (enableOwnership) {
+          await claimAndConnect(newId);
+        }
+        setLocalSessionId(newId);
+        setIsInitialized(true);
+        onSessionCreated?.(newId);
+        span.setStatus({ code: SpanStatusCode.OK });
+        span.end();
+      } catch (err) {
+        console.error("[TerminalSession] init failed:", err);
+        const errSpan = tracer.startSpan("terminal.session.error", {
+          attributes: {
+            "session.context": sessionContext ?? "",
+            "session.action": sessionIdProp ? "reconnect" : "create"
+          }
+        });
+        errSpan.recordException(err);
+        errSpan.setStatus({
+          code: SpanStatusCode.ERROR,
+          message: err instanceof Error ? err.message : "Unknown error"
+        });
+        errSpan.end();
+        if (mounted)
+          setIsInitialized(true);
+      }
+    };
+    init();
+    return () => {
+      mounted = false;
+      if (!persistOnUnmount && pendingSessionIdRef.current && actions.destroyTerminalSession) {
+        const tracer2 = getTracer();
+        const span = tracer2.startSpan("terminal.session.destroy", {
+          attributes: { "session.id": pendingSessionIdRef.current }
+        });
+        Promise.resolve(actions.destroyTerminalSession(pendingSessionIdRef.current)).then(() => {
+          span.setStatus({ code: SpanStatusCode.OK });
+          span.end();
+        }).catch((err) => {
+          span.recordException(err);
+          span.setStatus({ code: SpanStatusCode.ERROR });
+          span.end();
+        });
+      }
+    };
+  }, []);
+  const observeActivity = useCallback2(() => {
+    if (!activityDetection)
+      return;
+    const now = Date.now();
+    const emitBus = (isWorking2) => {
+      if (!events || !localSessionId)
+        return;
+      events.emit({
+        type: "terminal:activity-changed",
+        source: "TerminalSession",
+        timestamp: Date.now(),
+        payload: {
+          sessionId: localSessionId,
+          activityType: isWorking2 ? "started" : "stopped",
+          isWorking: isWorking2
+        }
+      });
+    };
+    if (!isActiveRef.current) {
+      isActiveRef.current = true;
+      activityStartedAtRef.current = now;
+      onActivityChange?.({ isActive: true, startedAt: now });
+      emitBus(true);
+    }
+    if (activityTimerRef.current)
+      clearTimeout(activityTimerRef.current);
+    activityTimerRef.current = setTimeout(() => {
+      if (isActiveRef.current) {
+        isActiveRef.current = false;
+        onActivityChange?.({
+          isActive: false,
+          duration: Date.now() - activityStartedAtRef.current
+        });
+        emitBus(false);
+      }
+    }, activityTimeout);
+  }, [activityDetection, activityTimeout, onActivityChange, events, localSessionId]);
+  useEffect2(() => {
+    if (!localSessionId || !isInitialized || !shouldRenderTerminal)
+      return;
+    if (!actions.onTerminalData)
+      return;
+    const unsubscribe = actions.onTerminalData(localSessionId, (data) => {
+      rendererRef.current?.write(data);
+      observeActivity();
+    });
+    return () => {
+      unsubscribe();
+    };
+  }, [localSessionId, isInitialized, shouldRenderTerminal, actions, observeActivity]);
+  useEffect2(() => {
+    return () => {
+      if (activityTimerRef.current)
+        clearTimeout(activityTimerRef.current);
+    };
+  }, []);
+  const handleData = useCallback2((data) => {
+    if (localSessionId && actions.writeToTerminal) {
+      actions.writeToTerminal(localSessionId, data);
+    }
+  }, [localSessionId, actions]);
+  const handleResize = useCallback2((cols, rows) => {
+    if (localSessionId && actions.resizeTerminal) {
+      actions.resizeTerminal(localSessionId, cols, rows);
+    }
+  }, [localSessionId, actions]);
+  const handleReady = useCallback2((cols, rows) => {
+    if (!localSessionId || !actions.resizeTerminal)
+      return;
+    const shouldForce = needsRefreshOnResizeRef.current;
+    if (!shouldForce) {
+      actions.resizeTerminal(localSessionId, cols, rows, false);
+      return;
+    }
+    needsRefreshOnResizeRef.current = false;
+    const restoreAndResize = async () => {
+      let bufferRestored = false;
+      if (actions.getTerminalBuffer && rendererRef.current) {
+        try {
+          const buffer = await actions.getTerminalBuffer(localSessionId);
+          if (buffer) {
+            rendererRef.current.write(buffer);
+            bufferRestored = true;
+          }
+        } catch (err) {
+          console.warn("[TerminalSession] Failed to restore buffer:", err);
+        }
+      }
+      actions.resizeTerminal(localSessionId, cols, rows, !bufferRestored);
+    };
+    restoreAndResize();
+  }, [localSessionId, actions]);
+  const handleLinkClickInternal = useCallback2((url, modifiers) => {
+    onLinkClick?.(url, modifiers);
+    if (localSessionId && events) {
+      events.emit({
+        type: "terminal:link-click",
+        source: "TerminalSession",
+        timestamp: Date.now(),
+        payload: {
+          url,
+          sessionId: localSessionId,
+          shiftKey: modifiers.shiftKey,
+          metaKey: modifiers.metaKey,
+          ctrlKey: modifiers.ctrlKey,
+          altKey: modifiers.altKey
+        }
+      });
+    }
+  }, [localSessionId, events, onLinkClick]);
+  const handleShortcutInternal = useCallback2((evt) => {
+    onShortcut?.(evt);
+    if (localSessionId && events) {
+      events.emit({
+        type: "terminal:shortcut",
+        source: "TerminalSession",
+        timestamp: Date.now(),
+        payload: {
+          shortcut: evt.shortcut,
+          sessionId: localSessionId
+        }
+      });
+    }
+  }, [localSessionId, events, onShortcut]);
+  const handleScrollPositionChangeInternal = useCallback2((p) => {
+    setScrollPosition(p);
+    onScrollPositionChange?.(p);
+  }, [onScrollPositionChange]);
+  useEffect2(() => {
+    if (!enableOwnership)
+      return;
+    if (!localSessionId || !actions.onOwnershipLost)
+      return;
+    const unsubscribe = actions.onOwnershipLost((data) => {
+      if (data.sessionId === localSessionId) {
+        setShouldRenderTerminal(false);
+        setOwnerWindowId(data.newOwnerWindowId);
+      }
+    });
+    return () => {
+      unsubscribe();
+    };
+  }, [enableOwnership, localSessionId, actions]);
+  const handleTakeControl = useCallback2(async () => {
+    if (!localSessionId)
+      return;
+    await claimAndConnect(localSessionId, true);
+  }, [localSessionId, claimAndConnect]);
+  useImperativeHandle3(ref, () => ({
+    scrollToBottom: () => rendererRef.current?.scrollToBottom(),
+    toggleScrollLock: () => {
+      if (scrollPosition.isScrollLocked) {
+        rendererRef.current?.scrollLines(-1);
+      } else {
+        rendererRef.current?.scrollToBottom();
+      }
+    },
+    focus: () => rendererRef.current?.focus(),
+    clear: () => rendererRef.current?.clear(),
+    getSessionId: () => localSessionId
+  }), [scrollPosition.isScrollLocked, localSessionId]);
+  if (!isInitialized) {
+    return /* @__PURE__ */ jsxs4("div", {
+      style: {
+        display: "flex",
+        height: "100%",
+        width: "100%",
+        backgroundColor: transparent ? "transparent" : theme.colors.background,
+        padding: "10px 0 0 10px"
+      },
+      children: [
+        /* @__PURE__ */ jsx6("div", {
+          style: {
+            width: "8px",
+            height: "17px",
+            backgroundColor: theme.colors.text,
+            animation: "terminal-session-cursor-blink 1s step-end infinite"
+          }
+        }),
+        /* @__PURE__ */ jsx6("style", {
+          children: `@keyframes terminal-session-cursor-blink {
+              0%, 100% { opacity: 1; }
+              50% { opacity: 0; }
+            }`
+        })
+      ]
+    });
+  }
+  const ownershipLostOverlay = enableOwnership && !shouldRenderTerminal ? {
+    message: "This terminal is active in another window",
+    subtitle: ownerWindowId ? `Window ID: ${ownerWindowId}` : "Another window owns this terminal session",
+    actions: [
+      {
+        label: "Take Control",
+        onClick: handleTakeControl,
+        primary: true
+      }
+    ],
+    opacity: 1
+  } : undefined;
+  const effectiveOverlay = ownershipLostOverlay ?? overlayState;
+  return /* @__PURE__ */ jsxs4("div", {
+    style: { position: "relative", height: "100%", width: "100%" },
+    children: [
+      /* @__PURE__ */ jsx6(Renderer, {
+        ref: rendererRef,
+        onData: shouldRenderTerminal ? handleData : undefined,
+        onResize: shouldRenderTerminal ? handleResize : undefined,
+        onReady: shouldRenderTerminal ? handleReady : undefined,
+        onLinkClick: shouldRenderTerminal ? handleLinkClickInternal : undefined,
+        onScrollPositionChange: shouldRenderTerminal ? handleScrollPositionChangeInternal : undefined,
+        onShortcut: handleShortcutInternal,
+        autoFocus: autoFocus && shouldRenderTerminal,
+        isVisible,
+        defaultScrollLocked,
+        scrollback,
+        transparent,
+        backgroundColor
+      }, shouldRenderTerminal ? "active" : "overlay"),
+      effectiveOverlay && /* @__PURE__ */ jsx6(TerminalOverlay, {
+        state: effectiveOverlay,
+        theme
+      }),
+      isWorking && !effectiveOverlay && /* @__PURE__ */ jsx6(WorkingOverlay, {
+        theme,
+        message: workingMessage,
+        subtitle: workingSubtitle
+      })
+    ]
+  });
+});
+TerminalSession.displayName = "TerminalSession";
+// src/hooks/useThemedTerminal.ts
+import { useTheme as useTheme3 } from "@principal-ade/industry-theme";
 import { useMemo } from "react";
 function useThemedTerminal() {
-  const { theme } = useTheme2();
+  const { theme } = useTheme3();
   const terminalOptions = useMemo(() => ({
     cursorBlink: true,
     fontSize: 14,
@@ -1317,14 +1874,14 @@ function useThemedTerminal() {
   };
 }
 // src/components/TabBar/TabBar.tsx
-import { useTheme as useTheme4 } from "@principal-ade/industry-theme";
+import { useTheme as useTheme5 } from "@principal-ade/industry-theme";
 import { Plus } from "lucide-react";
-import { useState as useState2, useCallback as useCallback3 } from "react";
+import { useState as useState3, useCallback as useCallback4 } from "react";
 
 // src/components/TabBar/TabButton.tsx
-import { useTheme as useTheme3 } from "@principal-ade/industry-theme";
-import { useCallback as useCallback2 } from "react";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { useTheme as useTheme4 } from "@principal-ade/industry-theme";
+import { useCallback as useCallback3 } from "react";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 var TabButton = ({
   tab,
   isActive,
@@ -1347,10 +1904,10 @@ var TabButton = ({
   onDragLeave,
   isBeingDragged: _isBeingDragged = false
 }) => {
-  const { theme } = useTheme3();
+  const { theme } = useTheme4();
   const showCloseButton = isHovered || isActive;
   const closable = tab.closable !== false;
-  const handleDragStart = useCallback2((e) => {
+  const handleDragStart = useCallback3((e) => {
     const target = e.currentTarget;
     e.dataTransfer.setData("application/x-tab-association", tab.id);
     e.dataTransfer.effectAllowed = "move";
@@ -1375,27 +1932,27 @@ var TabButton = ({
     }
     onDragStart?.(tab.id);
   }, [tab.id, onDragStart]);
-  const handleDragEnd = useCallback2(() => {
+  const handleDragEnd = useCallback3(() => {
     onDragEnd?.();
   }, [onDragEnd]);
-  const handleDragOver = useCallback2((e) => {
+  const handleDragOver = useCallback3((e) => {
     if (canAcceptDrop) {
       e.preventDefault();
       e.dataTransfer.dropEffect = "move";
     }
   }, [canAcceptDrop]);
-  const handleDrop = useCallback2((e) => {
+  const handleDrop = useCallback3((e) => {
     e.preventDefault();
     const draggedTabId = e.dataTransfer.getData("application/x-tab-association");
     if (draggedTabId && draggedTabId !== tab.id) {
       onDrop?.(draggedTabId);
     }
   }, [tab.id, onDrop]);
-  const handleDragEnter = useCallback2((e) => {
+  const handleDragEnter = useCallback3((e) => {
     e.preventDefault();
     onDragEnter?.();
   }, [onDragEnter]);
-  const handleDragLeave = useCallback2((e) => {
+  const handleDragLeave = useCallback3((e) => {
     e.preventDefault();
     onDragLeave?.();
   }, [onDragLeave]);
@@ -1409,7 +1966,7 @@ var TabButton = ({
     }
     return {};
   };
-  return /* @__PURE__ */ jsxs3("div", {
+  return /* @__PURE__ */ jsxs5("div", {
     "data-tab-id": tab.id,
     draggable,
     onDragStart: draggable ? handleDragStart : undefined,
@@ -1445,7 +2002,7 @@ var TabButton = ({
       ...getDragOverStyles()
     },
     children: [
-      closable && showCloseButton && /* @__PURE__ */ jsx4("button", {
+      closable && showCloseButton && /* @__PURE__ */ jsx7("button", {
         onClick: (e) => {
           e.stopPropagation();
           onClose();
@@ -1477,7 +2034,7 @@ var TabButton = ({
       (() => {
         const icon = renderIcon ? renderIcon(tab) : undefined;
         const displayIcon = icon !== undefined ? icon : tab.icon;
-        return displayIcon ? /* @__PURE__ */ jsx4("div", {
+        return displayIcon ? /* @__PURE__ */ jsx7("div", {
           style: { flexShrink: 0, display: "flex", alignItems: "center", pointerEvents: "none" },
           children: displayIcon
         }) : null;
@@ -1485,7 +2042,7 @@ var TabButton = ({
       (() => {
         const label = renderLabel ? renderLabel(tab) : undefined;
         const displayLabel = label !== undefined ? label : tab.label;
-        return /* @__PURE__ */ jsx4("span", {
+        return /* @__PURE__ */ jsx7("span", {
           style: {
             overflow: "hidden",
             textOverflow: "ellipsis",
@@ -1496,7 +2053,7 @@ var TabButton = ({
           children: displayLabel
         });
       })(),
-      renderAccessory ? renderAccessory(tab) : keyboardHint && /* @__PURE__ */ jsx4("span", {
+      renderAccessory ? renderAccessory(tab) : keyboardHint && /* @__PURE__ */ jsx7("span", {
         style: {
           fontSize: theme.fontSizes[0],
           color: theme.colors.textSecondary,
@@ -1511,7 +2068,7 @@ var TabButton = ({
 TabButton.displayName = "TabButton";
 
 // src/components/TabBar/TabBar.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 var TabBar = ({
   tabs,
   activeTabId,
@@ -1529,31 +2086,31 @@ var TabBar = ({
   canDropOnTab,
   enableDragAndDrop = false
 }) => {
-  const { theme } = useTheme4();
-  const [hoveredTabId, setHoveredTabId] = useState2(null);
-  const [draggedTabId, setDraggedTabId] = useState2(null);
-  const [dragOverTabId, setDragOverTabId] = useState2(null);
-  const handleDragStart = useCallback3((tabId) => {
+  const { theme } = useTheme5();
+  const [hoveredTabId, setHoveredTabId] = useState3(null);
+  const [draggedTabId, setDraggedTabId] = useState3(null);
+  const [dragOverTabId, setDragOverTabId] = useState3(null);
+  const handleDragStart = useCallback4((tabId) => {
     setDraggedTabId(tabId);
   }, []);
-  const handleDragEnd = useCallback3(() => {
+  const handleDragEnd = useCallback4(() => {
     setDraggedTabId(null);
     setDragOverTabId(null);
   }, []);
-  const handleDrop = useCallback3((targetTabId, draggedId) => {
+  const handleDrop = useCallback4((targetTabId, draggedId) => {
     if (draggedId !== targetTabId) {
       onTabDrop?.(draggedId, targetTabId);
     }
     setDraggedTabId(null);
     setDragOverTabId(null);
   }, [onTabDrop]);
-  const handleDragEnter = useCallback3((tabId) => {
+  const handleDragEnter = useCallback4((tabId) => {
     setDragOverTabId(tabId);
   }, []);
-  const handleDragLeave = useCallback3(() => {
+  const handleDragLeave = useCallback4(() => {
     setDragOverTabId(null);
   }, []);
-  return /* @__PURE__ */ jsxs4("div", {
+  return /* @__PURE__ */ jsxs6("div", {
     className,
     style: {
       display: "flex",
@@ -1563,7 +2120,7 @@ var TabBar = ({
       boxSizing: "border-box"
     },
     children: [
-      leftSection && /* @__PURE__ */ jsx5("div", {
+      leftSection && /* @__PURE__ */ jsx8("div", {
         style: {
           display: "flex",
           alignItems: "center",
@@ -1576,7 +2133,7 @@ var TabBar = ({
         },
         children: leftSection
       }),
-      /* @__PURE__ */ jsx5("div", {
+      /* @__PURE__ */ jsx8("div", {
         style: {
           display: "flex",
           alignItems: "center",
@@ -1588,7 +2145,7 @@ var TabBar = ({
         },
         children: tabs.map((tab, index) => {
           const canDrop = enableDragAndDrop && draggedTabId !== null && draggedTabId !== tab.id ? canDropOnTab ? canDropOnTab(draggedTabId, tab.id) : true : false;
-          return /* @__PURE__ */ jsx5(TabButton, {
+          return /* @__PURE__ */ jsx8(TabButton, {
             tab,
             isActive: tab.id === activeTabId,
             isHovered: tab.id === hoveredTabId,
@@ -1612,7 +2169,7 @@ var TabBar = ({
           }, tab.id);
         })
       }),
-      rightSection !== undefined ? rightSection && /* @__PURE__ */ jsx5("div", {
+      rightSection !== undefined ? rightSection && /* @__PURE__ */ jsx8("div", {
         style: {
           display: "flex",
           alignItems: "center",
@@ -1624,7 +2181,7 @@ var TabBar = ({
           boxSizing: "border-box"
         },
         children: rightSection
-      }) : onNewTab && /* @__PURE__ */ jsx5("div", {
+      }) : onNewTab && /* @__PURE__ */ jsx8("div", {
         style: {
           display: "flex",
           alignItems: "center",
@@ -1635,7 +2192,7 @@ var TabBar = ({
           borderBottom: `1px solid ${theme.colors.border}`,
           boxSizing: "border-box"
         },
-        children: /* @__PURE__ */ jsx5("button", {
+        children: /* @__PURE__ */ jsx8("button", {
           onClick: onNewTab,
           style: {
             display: "flex",
@@ -1656,7 +2213,7 @@ var TabBar = ({
             e.currentTarget.style.backgroundColor = "transparent";
           },
           title: "New Tab (⌘T)",
-          children: /* @__PURE__ */ jsx5(Plus, {
+          children: /* @__PURE__ */ jsx8(Plus, {
             size: 14
           })
         })
@@ -1670,14 +2227,14 @@ function isTabOfType(tab, contentType) {
   return tab.contentType === contentType;
 }
 // src/hooks/useTabKeyboardShortcuts.ts
-import { useEffect as useEffect2 } from "react";
+import { useEffect as useEffect3 } from "react";
 var useTabKeyboardShortcuts = ({
   onNewTab,
   onCloseTab,
   onSwitchToTab,
   enabled = true
 }) => {
-  useEffect2(() => {
+  useEffect3(() => {
     if (!enabled)
       return;
     const handleKeyDown = (e) => {
@@ -1698,358 +2255,29 @@ var useTabKeyboardShortcuts = ({
         e.preventDefault();
         e.stopPropagation();
         const index = parseInt(e.key, 10) - 1;
-        onSwitchToTab(index);
-        return;
-      }
-    };
-    window.addEventListener("keydown", handleKeyDown);
-    return () => window.removeEventListener("keydown", handleKeyDown);
-  }, [enabled, onNewTab, onCloseTab, onSwitchToTab]);
-};
-// src/panels/TerminalPanel.tsx
-import { useTheme as useTheme5 } from "@principal-ade/industry-theme";
-import { Lock, Unlock, ArrowDown } from "lucide-react";
-import { useCallback as useCallback4, useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
-
-// src/panel-types/index.ts
-function getTerminalSessions(context2) {
-  return context2.terminal?.data ?? [];
-}
-function getTerminalSession(context2, sessionId) {
-  const sessions = getTerminalSessions(context2);
-  return sessions.find((s) => s.id === sessionId);
-}
-function isTerminalLoading(context2) {
-  return context2.terminal?.loading ?? false;
-}
-function getRepositoryPath(context2) {
-  return context2.currentScope.repository?.path ?? null;
-}
-function getWorkspacePath(context2) {
-  return context2.currentScope.workspace?.path ?? null;
-}
-function getTerminalDirectory(context2, terminalScope = "repository") {
-  switch (terminalScope) {
-    case "workspace":
-      return getWorkspacePath(context2);
-    case "repository":
-      return getRepositoryPath(context2) ?? getWorkspacePath(context2);
-    default:
-      return getRepositoryPath(context2) ?? getWorkspacePath(context2);
-  }
-}
-function getTerminalSlice(context2) {
-  return context2.terminal;
-}
-
-// src/panels/TerminalPanel.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-var TerminalPanel = ({
-  context: context2,
-  actions,
-  events: _events,
-  terminalScope = "repository",
-  allowTransparency = false,
-  backgroundColor
-}) => {
-  const { theme } = useTheme5();
-  const [sessionId, setSessionId] = useState3(null);
-  const [error, setError] = useState3(null);
-  const [isInitializing, setIsInitializing] = useState3(true);
-  const [scrollPosition, setScrollPosition] = useState3({
-    isAtTop: false,
-    isAtBottom: true,
-    isScrollLocked: false
-  });
-  const terminalRef = useRef2(null);
-  const isScrollLockedRef = useRef2(scrollPosition.isScrollLocked);
-  const terminalDirectory = getTerminalDirectory(context2, terminalScope);
-  const pendingSessionIdRef = useRef2(null);
-  useEffect3(() => {
-    let mounted = true;
-    const initTerminal = async () => {
-      try {
-        if (!actions.createTerminalSession) {
-          throw new Error("Terminal actions not available. Host must provide createTerminalSession action.");
-        }
-        const id = await actions.createTerminalSession({
-          cwd: terminalDirectory || undefined
-        });
-        pendingSessionIdRef.current = id;
-        if (actions.claimTerminalOwnership) {
-          await actions.claimTerminalOwnership(id);
-        }
-        if (mounted) {
-          setSessionId(id);
-          setIsInitializing(false);
-        }
-      } catch (err) {
-        if (mounted) {
-          setError(err instanceof Error ? err.message : String(err));
-          setIsInitializing(false);
-        }
-      }
-    };
-    initTerminal();
-    return () => {
-      mounted = false;
-      if (pendingSessionIdRef.current && actions.destroyTerminalSession) {
-        actions.destroyTerminalSession(pendingSessionIdRef.current);
-      }
-    };
-  }, []);
-  useEffect3(() => {
-    if (!sessionId)
-      return;
-    if (!actions.onTerminalData) {
-      setError("Host does not provide onTerminalData. Terminal data cannot be displayed.");
-      return;
-    }
-    let cursorMovedToHome = false;
-    let lastWriteTime = 0;
-    let autoScrollTimeout = null;
-    const unsubscribe = actions.onTerminalData(sessionId, (data) => {
-      if (!terminalRef.current)
-        return;
-      if (data.includes("\x1B[H")) {
-        cursorMovedToHome = true;
-        lastWriteTime = Date.now();
-      }
-      terminalRef.current.write(data);
-      if (cursorMovedToHome && isScrollLockedRef.current) {
-        if (autoScrollTimeout)
-          clearTimeout(autoScrollTimeout);
-        autoScrollTimeout = setTimeout(() => {
-          const timeSinceLastWrite = Date.now() - lastWriteTime;
-          if (timeSinceLastWrite >= 100 && cursorMovedToHome && terminalRef.current) {
-            terminalRef.current.write("\x1B[9999;1H");
-            cursorMovedToHome = false;
-          }
-        }, 100);
-      }
-      lastWriteTime = Date.now();
-    });
-    return () => {
-      if (autoScrollTimeout)
-        clearTimeout(autoScrollTimeout);
-      unsubscribe();
-    };
-  }, [sessionId, actions.onTerminalData]);
-  const handleTerminalData = useCallback4((data) => {
-    if (sessionId && actions.writeToTerminal) {
-      actions.writeToTerminal(sessionId, data);
-    }
-  }, [sessionId, actions.writeToTerminal]);
-  const hasNotifiedPtyRef = useRef2(false);
-  const handleTerminalResize = useCallback4((cols, rows) => {
-    if (sessionId && actions.resizeTerminal) {
-      const isInitialNotification = !hasNotifiedPtyRef.current;
-      actions.resizeTerminal(sessionId, cols, rows);
-      if (isInitialNotification && actions.writeToTerminal) {
-        setTimeout(() => {
-          actions.writeToTerminal(sessionId, "\f");
-        }, 50);
-      }
-      hasNotifiedPtyRef.current = true;
-    }
-  }, [sessionId, actions.resizeTerminal, actions.writeToTerminal]);
-  useEffect3(() => {
-    hasNotifiedPtyRef.current = false;
-  }, [sessionId]);
-  useEffect3(() => {
-    if (!sessionId || !actions.resizeTerminal)
-      return;
-    if (hasNotifiedPtyRef.current)
-      return;
-    const term = terminalRef.current?.getTerminal();
-    if (!term || !term.cols || !term.rows)
-      return;
-    actions.resizeTerminal(sessionId, term.cols, term.rows);
-    hasNotifiedPtyRef.current = true;
-    if (actions.writeToTerminal) {
-      const writeFn = actions.writeToTerminal;
-      setTimeout(() => writeFn(sessionId, "\f"), 50);
-    }
-  }, [sessionId, actions.resizeTerminal, actions.writeToTerminal]);
-  const handleScrollPositionChange = useCallback4((position) => {
-    setScrollPosition(position);
-    isScrollLockedRef.current = position.isScrollLocked;
-  }, []);
-  const sessionInfo = sessionId ? getTerminalSession(context2, sessionId) : undefined;
-  if (error) {
-    return /* @__PURE__ */ jsxs5("div", {
-      style: {
-        padding: "20px",
-        color: "#ef4444",
-        backgroundColor: allowTransparency ? "transparent" : "#1a1a1a",
-        height: "100%",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        flexDirection: "column",
-        gap: "10px"
-      },
-      children: [
-        /* @__PURE__ */ jsx6("div", {
-          style: { fontSize: "16px", fontWeight: "bold" },
-          children: "Terminal Error"
-        }),
-        /* @__PURE__ */ jsx6("div", {
-          style: { fontSize: "14px", opacity: 0.8 },
-          children: error
-        })
-      ]
-    });
-  }
-  if (isInitializing || !sessionId) {
-    return /* @__PURE__ */ jsx6("div", {
-      style: {
-        padding: "20px",
-        color: "#a0a0a0",
-        backgroundColor: allowTransparency ? "transparent" : "#1a1a1a",
-        height: "100%",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center"
-      },
-      children: "Initializing terminal..."
-    });
-  }
-  const handleScrollToBottom = () => {
-    terminalRef.current?.scrollToBottom();
-  };
-  const handleToggleScrollLock = () => {
-    if (scrollPosition.isScrollLocked) {
-      const terminal = terminalRef.current?.getTerminal();
-      if (terminal) {
-        terminal.scrollLines(-1);
-      }
-    } else {
-      terminalRef.current?.scrollToBottom();
-    }
-  };
-  return /* @__PURE__ */ jsxs5("div", {
-    style: { height: "100%", width: "100%", display: "flex", flexDirection: "column" },
-    children: [
-      /* @__PURE__ */ jsxs5("div", {
-        style: {
-          display: "flex",
-          gap: "8px",
-          padding: "8px 12px",
-          backgroundColor: allowTransparency ? "transparent" : theme.colors.backgroundSecondary,
-          borderBottom: `1px solid ${theme.colors.border}`,
-          alignItems: "center"
-        },
-        children: [
-          /* @__PURE__ */ jsxs5("span", {
-            style: {
-              fontSize: "12px",
-              color: theme.colors.textSecondary,
-              marginRight: "auto",
-              fontFamily: theme.fonts.monospace
-            },
-            children: [
-              sessionInfo?.cwd || "Terminal",
-              " • ",
-              sessionInfo?.shell
-            ]
-          }),
-          /* @__PURE__ */ jsxs5("button", {
-            onClick: handleToggleScrollLock,
-            style: {
-              display: "flex",
-              alignItems: "center",
-              gap: "4px",
-              fontSize: "11px",
-              padding: "4px 8px",
-              borderRadius: "4px",
-              backgroundColor: scrollPosition.isScrollLocked ? `${theme.colors.success}22` : `${theme.colors.warning}22`,
-              color: scrollPosition.isScrollLocked ? theme.colors.success : theme.colors.warning,
-              border: `1px solid ${scrollPosition.isScrollLocked ? `${theme.colors.success}44` : `${theme.colors.warning}44`}`,
-              cursor: "pointer",
-              transition: "opacity 0.2s"
-            },
-            onMouseEnter: (e) => e.currentTarget.style.opacity = "0.8",
-            onMouseLeave: (e) => e.currentTarget.style.opacity = "1",
-            title: scrollPosition.isScrollLocked ? "Click to unlock scroll" : "Click to lock scroll to bottom",
-            children: [
-              scrollPosition.isScrollLocked ? /* @__PURE__ */ jsx6(Lock, {
-                size: 12
-              }) : /* @__PURE__ */ jsx6(Unlock, {
-                size: 12
-              }),
-              /* @__PURE__ */ jsx6("span", {
-                children: scrollPosition.isScrollLocked ? "Locked" : "Unlocked"
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsxs5("button", {
-            onClick: handleScrollToBottom,
-            disabled: scrollPosition.isAtBottom,
-            style: {
-              display: "flex",
-              alignItems: "center",
-              gap: "4px",
-              fontSize: "11px",
-              padding: "4px 10px",
-              borderRadius: "4px",
-              backgroundColor: scrollPosition.isAtBottom ? theme.colors.backgroundHover : theme.colors.accent,
-              color: scrollPosition.isAtBottom ? theme.colors.textTertiary : theme.colors.text,
-              border: `1px solid ${theme.colors.border}`,
-              cursor: scrollPosition.isAtBottom ? "not-allowed" : "pointer",
-              transition: "opacity 0.2s",
-              opacity: scrollPosition.isAtBottom ? 0.5 : 1
-            },
-            onMouseEnter: (e) => !scrollPosition.isAtBottom && (e.currentTarget.style.opacity = "0.8"),
-            onMouseLeave: (e) => !scrollPosition.isAtBottom && (e.currentTarget.style.opacity = "1"),
-            title: "Scroll to bottom and lock",
-            children: [
-              /* @__PURE__ */ jsx6(ArrowDown, {
-                size: 12
-              }),
-              /* @__PURE__ */ jsx6("span", {
-                children: "Bottom"
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx6("div", {
-        style: { flex: 1 },
-        children: /* @__PURE__ */ jsx6(ThemedTerminalWithProvider, {
-          ref: terminalRef,
-          onData: handleTerminalData,
-          onResize: handleTerminalResize,
-          onScrollPositionChange: handleScrollPositionChange,
-          hideHeader: true,
-          autoFocus: true,
-          convertEol: true,
-          cursorBlink: true,
-          scrollback: 1e4,
-          enableSearch: true,
-          enableWebLinks: true,
-          allowTransparency,
-          backgroundColor
-        })
-      })
-    ]
-  });
+        onSwitchToTab(index);
+        return;
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [enabled, onNewTab, onCloseTab, onSwitchToTab]);
 };
 // src/panels/TabbedTerminalPanel.tsx
 import { useTheme as useTheme6 } from "@principal-ade/industry-theme";
 import { CollapsibleSplitPane } from "@principal-ade/panels";
-import { Terminal as TerminalIcon2, Lock as Lock2, Unlock as Unlock2, Box, Boxes, Paperclip } from "lucide-react";
+import { Terminal as TerminalIcon2, Lock, Unlock, Box, Boxes, Paperclip } from "lucide-react";
 import React3, {
   useState as useState4,
   useCallback as useCallback5,
   useEffect as useEffect4,
-  useRef as useRef3
+  useRef as useRef4
 } from "react";
-import { jsx as jsx7, jsxs as jsxs6, Fragment as Fragment2 } from "react/jsx-runtime";
-var ActivityIndicator = ({ color, isAnimating }) => /* @__PURE__ */ jsxs6("div", {
+import { jsx as jsx9, jsxs as jsxs7, Fragment as Fragment2 } from "react/jsx-runtime";
+var ActivityIndicator = ({ color, isAnimating }) => /* @__PURE__ */ jsxs7("div", {
   style: { display: "flex", gap: 1, alignItems: "center", height: 12 },
   children: [
-    [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx7("div", {
+    [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx9("div", {
       style: {
         width: 2,
         height: 10,
@@ -2060,7 +2288,7 @@ var ActivityIndicator = ({ color, isAnimating }) => /* @__PURE__ */ jsxs6("div",
         animation: isAnimating ? `waveSine 1.2s ease-in-out ${i * 0.1}s infinite` : "none"
       }
     }, i)),
-    /* @__PURE__ */ jsx7("style", {
+    /* @__PURE__ */ jsx9("style", {
       children: `
         @keyframes waveSine {
           0%, 100% { transform: scaleY(0.4); }
@@ -2071,376 +2299,69 @@ var ActivityIndicator = ({ color, isAnimating }) => /* @__PURE__ */ jsxs6("div",
   ]
 });
 function TerminalTabContentInner(props, ref) {
-  const { tab, sessionId, isActive, isVisible, actions, events, terminalContext, onSessionCreated, onScrollPositionChange, isForeign = false, defaultScrollLocked, activityDetection = true, activityTimeout = 500, autoShowBlinds = false, onActivityStateChange } = props;
-  const { theme } = useTheme6();
-  const terminalRef = useRef3(null);
-  const [localSessionId, setLocalSessionId] = useState4(sessionId);
-  const [isInitialized, setIsInitialized] = useState4(false);
-  const hasInitializedRef = useRef3(false);
-  const [scrollPosition, setScrollPosition] = useState4({
-    isAtTop: false,
-    isAtBottom: true,
-    isScrollLocked: false
-  });
-  const [shouldRenderTerminal, setShouldRenderTerminal] = useState4(true);
-  const [ownerWindowId, setOwnerWindowId] = useState4(null);
-  const needsRefreshOnResizeRef = useRef3(false);
-  const claimAndConnect = useCallback5(async (targetSessionId, force = false) => {
-    try {
-      if (actions.claimTerminalOwnership) {
-        await actions.claimTerminalOwnership(targetSessionId, force);
-      }
-      if (force && actions.requestTerminalDataPort) {
-        await actions.requestTerminalDataPort(targetSessionId);
-      }
-      setShouldRenderTerminal(true);
-      setOwnerWindowId(null);
-      if (force) {
-        needsRefreshOnResizeRef.current = true;
-      }
-    } catch (error) {
-      console.error("[TerminalTabContent] Failed to claim ownership:", error);
-      throw error;
-    }
-  }, [actions]);
-  useEffect4(() => {
-    if (hasInitializedRef.current) {
-      return;
-    }
-    hasInitializedRef.current = true;
-    let mounted = true;
-    const initSession = async () => {
-      try {
-        if (sessionId) {
-          const tracer2 = getTracer();
-          const reconnectSpan = tracer2.startSpan("terminal.session.reconnect", {
-            attributes: {
-              "session.id": sessionId,
-              "session.context": `${terminalContext}:${tab.id}`,
-              "session.isForeign": isForeign
-            }
-          });
-          reconnectSpan.addEvent("terminal.session.reconnecting", {
-            "session.id": sessionId,
-            "reconnect.reason": "component_remount"
-          });
-          if (isForeign && actions.checkTerminalOwnership) {
-            const status = await actions.checkTerminalOwnership(sessionId);
-            if (status.ownedByWindowId && !status.ownedByThisWindow) {
-              setShouldRenderTerminal(false);
-              setOwnerWindowId(status.ownedByWindowId);
-              reconnectSpan.addEvent("terminal.session.reconnect_blocked", {
-                "session.id": sessionId,
-                "owner.windowId": status.ownedByWindowId
-              });
-            }
-          } else {
-            await claimAndConnect(sessionId);
-            reconnectSpan.addEvent("terminal.session.reconnected", {
-              "session.id": sessionId
-            });
-          }
-          reconnectSpan.setStatus({ code: SpanStatusCode.OK });
-          reconnectSpan.end();
-          setLocalSessionId(sessionId);
-          setIsInitialized(true);
-          return;
-        }
-        if (!actions.createTerminalSession) {
-          return;
-        }
-        const newSessionId = await actions.createTerminalSession({
-          cwd: tab.directory,
-          command: tab.command,
-          context: `${terminalContext}:${tab.id}`
-        });
-        if (!mounted)
-          return;
-        const tracer = getTracer();
-        const span = tracer.startSpan("terminal.session", {
-          attributes: {
-            "session.id": newSessionId,
-            "session.cwd": tab.directory,
-            "session.context": `${terminalContext}:${tab.id}`
-          }
-        });
-        span.addEvent("terminal.session.created", {
-          "session.id": newSessionId,
-          "session.cwd": tab.directory
-        });
-        span.setStatus({ code: SpanStatusCode.OK });
-        span.end();
-        setLocalSessionId(newSessionId);
-        setIsInitialized(true);
-        onSessionCreated(tab.id, newSessionId);
-        await claimAndConnect(newSessionId);
-      } catch (error) {
-        console.error("[TerminalTabContent] Failed to create session:", error);
-        const tracer = getTracer();
-        const span = tracer.startSpan("terminal.session", {
-          attributes: {
-            "session.action": "create",
-            "error.occurred": true
-          }
-        });
-        span.addEvent("terminal.session.error", {
-          "error.message": error instanceof Error ? error.message : "Unknown error"
-        });
-        span.recordException(error);
-        span.setStatus({ code: SpanStatusCode.ERROR, message: "Session creation failed" });
-        span.end();
-      }
-    };
-    initSession();
-    return () => {
-      mounted = false;
-    };
-  }, []);
-  useEffect4(() => {
-    if (!localSessionId || !isInitialized || !shouldRenderTerminal) {
-      return;
-    }
-    if (!actions.onTerminalData) {
-      return;
-    }
-    const tracer = getTracer();
-    const subscribeSpan = tracer.startSpan("terminal.data.subscribe", {
-      attributes: {
-        "session.id": localSessionId,
-        "tab.id": tab.id
-      }
-    });
-    subscribeSpan.addEvent("terminal.data.subscribed", {
-      "session.id": localSessionId
-    });
-    console.log("[TerminalTabContent] SUBSCRIBING to terminal data", { tabId: tab.id, sessionId: localSessionId });
-    let hasReceivedData = false;
-    const unsubscribe = actions.onTerminalData(localSessionId, (data) => {
-      if (terminalRef.current) {
-        if (!hasReceivedData) {
-          hasReceivedData = true;
-          subscribeSpan.addEvent("terminal.data.first_received", {
-            "session.id": localSessionId,
-            "data.length": data.length
-          });
-        }
-        terminalRef.current.write(data);
-      }
-    });
-    subscribeSpan.setStatus({ code: SpanStatusCode.OK });
-    subscribeSpan.end();
-    return () => {
-      const unsubscribeSpan = tracer.startSpan("terminal.data.unsubscribe", {
-        attributes: {
-          "session.id": localSessionId,
-          "tab.id": tab.id,
-          "data.wasReceived": hasReceivedData
-        }
-      });
-      unsubscribeSpan.addEvent("terminal.data.unsubscribed", {
-        "session.id": localSessionId
-      });
-      unsubscribeSpan.setStatus({ code: SpanStatusCode.OK });
-      unsubscribeSpan.end();
-      console.log("[TerminalTabContent] UNSUBSCRIBING from terminal data", { tabId: tab.id, sessionId: localSessionId });
-      unsubscribe();
-    };
-  }, [localSessionId, isInitialized, actions, shouldRenderTerminal, tab.id]);
-  const handleData = useCallback5((data) => {
-    if (localSessionId && actions.writeToTerminal) {
-      actions.writeToTerminal(localSessionId, data);
-    }
-  }, [localSessionId, actions]);
-  const handleResize = useCallback5((cols, rows) => {
-    if (localSessionId && actions.resizeTerminal) {
-      actions.resizeTerminal(localSessionId, cols, rows);
-    }
-  }, [localSessionId, actions]);
-  const handleReady = useCallback5((cols, rows) => {
-    if (!localSessionId || !actions.resizeTerminal) {
-      return;
-    }
-    const shouldForce = needsRefreshOnResizeRef.current;
-    if (!shouldForce) {
-      actions.resizeTerminal(localSessionId, cols, rows, false);
-      return;
-    }
-    needsRefreshOnResizeRef.current = false;
-    const restoreBufferAndResize = async () => {
-      let bufferRestored = false;
-      if (actions.getTerminalBuffer && terminalRef.current) {
-        try {
-          const buffer = await actions.getTerminalBuffer(localSessionId);
-          if (buffer) {
-            terminalRef.current.write(buffer);
-            bufferRestored = true;
-          }
-        } catch (error) {
-          console.warn("[TabbedTerminalPanel] Failed to restore buffer:", error);
-        }
-      }
-      const forceResize = !bufferRestored;
-      actions.resizeTerminal(localSessionId, cols, rows, forceResize);
-    };
-    restoreBufferAndResize();
-  }, [localSessionId, actions]);
-  const handleLinkClick = useCallback5((url, modifiers) => {
-    if (localSessionId) {
-      events.emit({
-        type: "terminal:link-click",
-        source: "TabbedTerminalPanel",
-        timestamp: Date.now(),
-        payload: {
-          url,
-          sessionId: localSessionId,
-          shiftKey: modifiers.shiftKey,
-          metaKey: modifiers.metaKey,
-          ctrlKey: modifiers.ctrlKey,
-          altKey: modifiers.altKey
-        }
-      });
-    }
-  }, [localSessionId, events]);
-  useEffect4(() => {
-    if (!localSessionId || !actions.onOwnershipLost) {
-      return;
-    }
-    const unsubscribe = actions.onOwnershipLost((data) => {
-      if (data.sessionId === localSessionId) {
-        setShouldRenderTerminal(false);
-        setOwnerWindowId(data.newOwnerWindowId);
-      }
-    });
-    return () => {
-      unsubscribe();
-    };
-  }, [localSessionId, actions]);
-  const handleTakeControl = useCallback5(async () => {
-    if (!localSessionId) {
-      return;
-    }
-    await claimAndConnect(localSessionId, true);
-  }, [localSessionId, claimAndConnect]);
+  const {
+    tab,
+    sessionId,
+    isActive,
+    isVisible,
+    actions,
+    events,
+    terminalContext,
+    onSessionCreated,
+    onScrollPositionChange,
+    isForeign = false,
+    defaultScrollLocked,
+    activityDetection = true,
+    activityTimeout = 500,
+    autoShowBlinds = false,
+    onActivityStateChange
+  } = props;
+  const [isWorkingFromActivity, setIsWorkingFromActivity] = useState4(false);
+  const sessionRef = useRef4(null);
+  const handleSessionCreated = useCallback5((sid) => onSessionCreated(tab.id, sid), [onSessionCreated, tab.id]);
   const handleScrollPositionChange = useCallback5((position) => {
-    setScrollPosition(position);
     onScrollPositionChange?.(tab.id, position);
-  }, [tab.id, onScrollPositionChange]);
-  const handleShortcut = useCallback5((shortcutEvent) => {
-    if (localSessionId) {
-      events.emit({
-        type: "terminal:shortcut",
-        source: "TabbedTerminalPanel",
-        timestamp: Date.now(),
-        payload: {
-          shortcut: shortcutEvent.shortcut,
-          sessionId: localSessionId
-        }
-      });
-    }
-  }, [localSessionId, events]);
+  }, [onScrollPositionChange, tab.id]);
   const handleActivityChange = useCallback5((state) => {
-    if (localSessionId) {
-      onActivityStateChange?.(localSessionId, state.isActive);
-      events.emit({
-        type: "terminal:activity-changed",
-        source: "TabbedTerminalPanel",
-        timestamp: Date.now(),
-        payload: {
-          sessionId: localSessionId,
-          activityType: state.isActive ? "started" : "stopped",
-          isWorking: state.isActive
-        }
-      });
+    const sid = sessionRef.current?.getSessionId();
+    if (sid) {
+      onActivityStateChange?.(sid, state.isActive);
     }
-  }, [localSessionId, events, onActivityStateChange]);
-  const handleScrollToBottom = useCallback5(() => {
-    terminalRef.current?.scrollToBottom();
-  }, []);
-  const handleToggleScrollLock = useCallback5(() => {
-    if (scrollPosition.isScrollLocked) {
-      const terminal = terminalRef.current?.getTerminal();
-      if (terminal) {
-        terminal.scrollLines(-1);
-      }
-    } else {
-      terminalRef.current?.scrollToBottom();
+    if (autoShowBlinds) {
+      setIsWorkingFromActivity(state.isActive);
     }
-  }, [scrollPosition.isScrollLocked]);
+  }, [autoShowBlinds, onActivityStateChange]);
   React3.useImperativeHandle(ref, () => ({
-    scrollToBottom: handleScrollToBottom,
-    toggleScrollLock: handleToggleScrollLock
-  }), [handleScrollToBottom, handleToggleScrollLock]);
-  if (!isInitialized) {
-    return /* @__PURE__ */ jsxs6("div", {
-      style: {
-        display: isActive ? "flex" : "none",
-        height: "100%",
-        width: "100%",
-        backgroundColor: theme.colors.background,
-        padding: "10px 0 0 10px"
-      },
-      children: [
-        /* @__PURE__ */ jsx7("div", {
-          style: {
-            width: "8px",
-            height: "17px",
-            backgroundColor: theme.colors.text,
-            animation: "blink 1s step-end infinite"
-          }
-        }),
-        /* @__PURE__ */ jsx7("style", {
-          children: `
-              @keyframes blink {
-                0%, 100% { opacity: 1; }
-                50% { opacity: 0; }
-              }
-            `
-        })
-      ]
-    });
-  }
-  const overlayState = !shouldRenderTerminal ? {
-    message: "This terminal is active in another window",
-    subtitle: ownerWindowId ? `Window ID: ${ownerWindowId}` : "Another window owns this terminal session",
-    actions: [
-      {
-        label: "Take Control",
-        onClick: handleTakeControl,
-        primary: true
-      }
-    ],
-    opacity: 1
-  } : undefined;
-  return /* @__PURE__ */ jsx7("div", {
+    scrollToBottom: () => sessionRef.current?.scrollToBottom(),
+    toggleScrollLock: () => sessionRef.current?.toggleScrollLock()
+  }), []);
+  return /* @__PURE__ */ jsx9("div", {
     style: {
       display: isActive ? "flex" : "none",
       flexDirection: "column",
       height: "100%",
       width: "100%"
     },
-    children: /* @__PURE__ */ jsx7(ThemedTerminalWithProvider, {
-      ref: terminalRef,
-      onData: shouldRenderTerminal ? handleData : undefined,
-      onResize: shouldRenderTerminal ? handleResize : undefined,
-      onReady: shouldRenderTerminal ? handleReady : undefined,
-      onLinkClick: shouldRenderTerminal ? handleLinkClick : undefined,
-      onScrollPositionChange: shouldRenderTerminal ? handleScrollPositionChange : undefined,
-      onShortcut: handleShortcut,
-      hideHeader: true,
-      autoFocus: isActive && shouldRenderTerminal,
-      isVisible: isVisible && isActive,
-      defaultScrollLocked,
-      convertEol: true,
-      cursorBlink: shouldRenderTerminal,
-      scrollback: 1e4,
-      enableSearch: true,
+    children: /* @__PURE__ */ jsx9(TerminalSession, {
+      ref: sessionRef,
+      actions,
+      events,
+      sessionId,
+      onSessionCreated: handleSessionCreated,
+      cwd: tab.directory,
+      command: tab.command,
+      sessionContext: `${terminalContext}:${tab.id}`,
+      enableOwnership: true,
+      isForeign,
       activityDetection,
       activityTimeout,
-      autoShowBlinds,
-      onActivityChange: shouldRenderTerminal ? handleActivityChange : undefined,
-      enableWebLinks: true,
-      overlayState
-    }, shouldRenderTerminal ? "active" : "overlay")
+      onActivityChange: handleActivityChange,
+      onScrollPositionChange: handleScrollPositionChange,
+      defaultScrollLocked,
+      autoFocus: isActive,
+      isVisible: isVisible && isActive,
+      isWorking: autoShowBlinds && isWorkingFromActivity
+    })
   });
 }
 var areTerminalTabContentPropsEqual = (prevProps, nextProps) => {
@@ -2597,8 +2518,8 @@ var TabbedTerminalPanelInner = ({
       }
     }));
   }, [tabs]);
-  const tabRefsMap = useRef3(new Map);
-  const refCallbacksMap = useRef3(new Map);
+  const tabRefsMap = useRef4(new Map);
+  const refCallbacksMap = useRef4(new Map);
   const getRefCallback = useCallback5((tabId) => {
     let callback = refCallbacksMap.current.get(tabId);
     if (!callback) {
@@ -2613,9 +2534,9 @@ var TabbedTerminalPanelInner = ({
     }
     return callback;
   }, []);
-  const hasInitializedRef = useRef3(false);
-  const isCreatingTabRef = useRef3(false);
-  const headerRef = useRef3(null);
+  const hasInitializedRef = useRef4(false);
+  const isCreatingTabRef = useRef4(false);
+  const headerRef = useRef4(null);
   const handleTabScrollPositionChange = useCallback5((tabId, position) => {
     setScrollPositions((prev) => new Map(prev).set(tabId, position));
   }, []);
@@ -2888,9 +2809,9 @@ var TabbedTerminalPanelInner = ({
     if (!isActive)
       return null;
     const scrollPosition = scrollPositions.get(tab.id) ?? defaultScrollPosition;
-    return /* @__PURE__ */ jsxs6(Fragment2, {
+    return /* @__PURE__ */ jsxs7(Fragment2, {
       children: [
-        /* @__PURE__ */ jsx7("button", {
+        /* @__PURE__ */ jsx9("button", {
           onClick: (e) => {
             e.stopPropagation();
             handleToggleScrollLock();
@@ -2915,13 +2836,13 @@ var TabbedTerminalPanelInner = ({
             e.currentTarget.style.backgroundColor = "transparent";
           },
           title: scrollPosition.isScrollLocked ? "Scroll locked" : "Scroll unlocked",
-          children: scrollPosition.isScrollLocked ? /* @__PURE__ */ jsx7(Lock2, {
+          children: scrollPosition.isScrollLocked ? /* @__PURE__ */ jsx9(Lock, {
             size: 10
-          }) : /* @__PURE__ */ jsx7(Unlock2, {
+          }) : /* @__PURE__ */ jsx9(Unlock, {
             size: 10
           })
         }),
-        /* @__PURE__ */ jsx7("div", {
+        /* @__PURE__ */ jsx9("div", {
           style: {
             position: "absolute",
             right: "8px",
@@ -2932,7 +2853,7 @@ var TabbedTerminalPanelInner = ({
             height: "16px"
           },
           title: isWorking ? "Terminal active" : "Terminal idle",
-          children: /* @__PURE__ */ jsx7(ActivityIndicator, {
+          children: /* @__PURE__ */ jsx9(ActivityIndicator, {
             color: theme.colors.primary,
             isAnimating: isWorking ?? false
           })
@@ -2941,7 +2862,7 @@ var TabbedTerminalPanelInner = ({
     });
   }, [activeTabId, scrollPositions, defaultScrollPosition, handleToggleScrollLock, theme, sessionIds, workingStates, activityStates]);
   const renderTerminalWithAssociation = useCallback5((tab, isActive, sessionId, association) => {
-    const terminalContent = /* @__PURE__ */ jsx7(TerminalTabContent, {
+    const terminalContent = /* @__PURE__ */ jsx9(TerminalTabContent, {
       ref: getRefCallback(tab.id),
       tab,
       sessionId,
@@ -2960,7 +2881,7 @@ var TabbedTerminalPanelInner = ({
       onActivityStateChange: handleActivityStateChange
     }, `terminal-${tab.id}`);
     const hasAssociation = !!association;
-    const secondaryContent = hasAssociation && renderAssociatedContent ? renderAssociatedContent(association.associatedTabId, isActive) : /* @__PURE__ */ jsx7("div", {
+    const secondaryContent = hasAssociation && renderAssociatedContent ? renderAssociatedContent(association.associatedTabId, isActive) : /* @__PURE__ */ jsx9("div", {
       style: {
         height: "100%",
         display: "flex",
@@ -2972,12 +2893,12 @@ var TabbedTerminalPanelInner = ({
       },
       children: "Drag a tab here to associate it with this terminal"
     });
-    const headerConfig = hasAssociation && getAssociatedHeader ? getAssociatedHeader(association.associatedTabId) : { title: "Drop zone", icon: /* @__PURE__ */ jsx7(Paperclip, {
+    const headerConfig = hasAssociation && getAssociatedHeader ? getAssociatedHeader(association.associatedTabId) : { title: "Drop zone", icon: /* @__PURE__ */ jsx9(Paperclip, {
       size: 14
     }) };
     const isCollapsed = hasAssociation ? association.collapsed : true;
     const handleCollapsedChange = hasAssociation ? (collapsed) => onAssociationCollapsedChange?.(tab.id, collapsed) : undefined;
-    return /* @__PURE__ */ jsx7(CollapsibleSplitPane, {
+    return /* @__PURE__ */ jsx9(CollapsibleSplitPane, {
       style: { height: "100%" },
       primaryContent: terminalContent,
       secondaryContent,
@@ -3052,7 +2973,7 @@ var TabbedTerminalPanelInner = ({
       setActiveTabId(activeTabId);
     }
   }, [activeTabId, tabs, onTabAssociate, setActiveTabId]);
-  return /* @__PURE__ */ jsxs6("div", {
+  return /* @__PURE__ */ jsxs7("div", {
     style: {
       display: "flex",
       flexDirection: "column",
@@ -3060,15 +2981,15 @@ var TabbedTerminalPanelInner = ({
       backgroundColor: theme.colors.background
     },
     children: [
-      !hideHeader && /* @__PURE__ */ jsx7("div", {
+      !hideHeader && /* @__PURE__ */ jsx9("div", {
         ref: headerRef,
-        children: /* @__PURE__ */ jsx7(TabBar, {
+        children: /* @__PURE__ */ jsx9(TabBar, {
           tabs: genericTabs,
           activeTabId,
           onTabClick: switchTab,
           onTabClose: closeTab,
           onNewTab: addNewTab,
-          leftSection: /* @__PURE__ */ jsx7("button", {
+          leftSection: /* @__PURE__ */ jsx9("button", {
             onClick: () => onShowAllTerminalsChange?.(!showAllTerminals),
             style: {
               display: "flex",
@@ -3093,9 +3014,9 @@ var TabbedTerminalPanelInner = ({
               }
             },
             title: showAllTerminals ? "Showing all terminals (click to filter by context)" : "Show all terminals",
-            children: showAllTerminals ? /* @__PURE__ */ jsx7(Boxes, {
+            children: showAllTerminals ? /* @__PURE__ */ jsx9(Boxes, {
               size: 14
-            }) : /* @__PURE__ */ jsx7(Box, {
+            }) : /* @__PURE__ */ jsx9(Box, {
               size: 14
             })
           }),
@@ -3108,7 +3029,7 @@ var TabbedTerminalPanelInner = ({
           canDropOnTab
         })
       }),
-      /* @__PURE__ */ jsxs6("div", {
+      /* @__PURE__ */ jsxs7("div", {
         style: {
           flex: 1,
           display: "flex",
@@ -3162,7 +3083,7 @@ var TabbedTerminalPanelInner = ({
               const customContent = renderTabContent(tab, isActive, sessionId, width);
               if (customContent === null && tab.contentType === "terminal") {
                 const association = associations?.[tab.id];
-                return /* @__PURE__ */ jsx7("div", {
+                return /* @__PURE__ */ jsx9("div", {
                   style: {
                     display: isActive ? "flex" : "none",
                     flexDirection: "column",
@@ -3173,7 +3094,7 @@ var TabbedTerminalPanelInner = ({
                 }, tab.id);
               }
               const hasBeenActivated = activatedTabs.has(tab.id);
-              return /* @__PURE__ */ jsx7("div", {
+              return /* @__PURE__ */ jsx9("div", {
                 style: {
                   display: isActive ? "flex" : "none",
                   flexDirection: "column",
@@ -3185,7 +3106,7 @@ var TabbedTerminalPanelInner = ({
             }
             if (tab.contentType === "terminal") {
               const association = associations?.[tab.id];
-              return /* @__PURE__ */ jsx7("div", {
+              return /* @__PURE__ */ jsx9("div", {
                 style: {
                   display: isActive ? "flex" : "none",
                   flexDirection: "column",
@@ -3195,7 +3116,7 @@ var TabbedTerminalPanelInner = ({
                 children: renderTerminalWithAssociation(tab, isActive, sessionId, association)
               }, tab.id);
             }
-            return /* @__PURE__ */ jsxs6("div", {
+            return /* @__PURE__ */ jsxs7("div", {
               style: {
                 display: isActive ? "flex" : "none",
                 alignItems: "center",
@@ -3204,20 +3125,20 @@ var TabbedTerminalPanelInner = ({
                 color: theme.colors.textSecondary
               },
               children: [
-                /* @__PURE__ */ jsxs6("p", {
+                /* @__PURE__ */ jsxs7("p", {
                   children: [
                     "Unknown content type: ",
                     tab.contentType
                   ]
                 }),
-                /* @__PURE__ */ jsx7("p", {
+                /* @__PURE__ */ jsx9("p", {
                   style: { fontSize: theme.fontSizes[0], marginTop: "8px" },
                   children: "Provide a renderTabContent prop to render custom tab types"
                 })
               ]
             }, tab.id);
           }),
-          tabs.length === 0 && /* @__PURE__ */ jsxs6("div", {
+          tabs.length === 0 && /* @__PURE__ */ jsxs7("div", {
             style: {
               display: "flex",
               flexDirection: "column",
@@ -3227,11 +3148,11 @@ var TabbedTerminalPanelInner = ({
               color: theme.colors.textSecondary
             },
             children: [
-              /* @__PURE__ */ jsx7(TerminalIcon2, {
+              /* @__PURE__ */ jsx9(TerminalIcon2, {
                 size: 32,
                 style: { opacity: 0.5, marginBottom: "16px" }
               }),
-              /* @__PURE__ */ jsx7("button", {
+              /* @__PURE__ */ jsx9("button", {
                 onClick: () => addNewTab(),
                 style: {
                   marginTop: "16px",
@@ -3460,33 +3381,43 @@ var terminalPanelToolsMetadata = {
 };
 
 // src/panel-exports.ts
-var panels = [
-  {
-    metadata: {
-      id: "com.principal.terminal",
-      name: "Terminal",
-      icon: "terminal",
-      version: "0.1.0",
-      author: "Principal",
-      description: "Integrated terminal emulator with industry theming",
-      slices: ["terminal"],
-      tools: terminalPanelTools
-    },
-    component: TerminalPanel,
-    onMount: async (_context) => {
-      console.log("Terminal Panel mounted for repository:", _context.currentScope.repository?.path);
-    },
-    onUnmount: async (_context) => {
-      console.log("Terminal Panel unmounting");
-    }
-  }
-];
+var panels = [];
 var onPackageLoad = async () => {
   console.log("Panel package loaded - Terminal Panel Extension");
 };
 var onPackageUnload = async () => {
   console.log("Panel package unloading - Terminal Panel Extension");
 };
+// src/panel-types/index.ts
+function getTerminalSessions(context2) {
+  return context2.terminal?.data ?? [];
+}
+function getTerminalSession(context2, sessionId) {
+  const sessions = getTerminalSessions(context2);
+  return sessions.find((s) => s.id === sessionId);
+}
+function isTerminalLoading(context2) {
+  return context2.terminal?.loading ?? false;
+}
+function getRepositoryPath(context2) {
+  return context2.currentScope.repository?.path ?? null;
+}
+function getWorkspacePath(context2) {
+  return context2.currentScope.workspace?.path ?? null;
+}
+function getTerminalDirectory(context2, terminalScope = "repository") {
+  switch (terminalScope) {
+    case "workspace":
+      return getWorkspacePath(context2);
+    case "repository":
+      return getRepositoryPath(context2) ?? getWorkspacePath(context2);
+    default:
+      return getRepositoryPath(context2) ?? getWorkspacePath(context2);
+  }
+}
+function getTerminalSlice(context2) {
+  return context2.terminal;
+}
 export {
   writeToTerminalTool,
   withSpanSync,
@@ -3516,10 +3447,12 @@ export {
   context,
   closeTerminalSessionTool,
   clearTerminalTool,
+  XtermRenderer,
   WorkingOverlay,
   ThemedTerminalWithProvider,
   ThemedTerminal,
-  TerminalPanel,
+  TerminalSession,
+  TerminalOverlay,
   TabbedTerminalPanel,
   TabButton,
   TabBar,