@industry-theme/xterm-terminal-panel 0.5.3 → 0.5.5

package/dist/index.css

@@ -16,7 +16,7 @@
   width: 100%;
   height: 100%;
   margin: 0;
-  padding: 5px 0 0 5px;
+  padding: 10px 0 0 10px;
 }
 
 .xterm-helper-textarea {

package/dist/index.js

@@ -32,7 +32,7 @@ import {
   context,
   SpanStatusCode
 } from "@opentelemetry/api";
-var PACKAGE_VERSION = "0.5.1";
+var PACKAGE_VERSION = "0.5.4";
 var TRACER_NAME = "@industry-theme/xterm-terminal-panel";
 var TRACER_VERSION = PACKAGE_VERSION;
 function getTracer() {
@@ -1782,16 +1782,41 @@ var TerminalPanel = ({
 };
 // src/panels/TabbedTerminalPanel.tsx
 import { useTheme as useTheme6 } from "@principal-ade/industry-theme";
-import { Terminal as TerminalIcon2, Lock as Lock2, Unlock as Unlock2, Box, Boxes, Loader2 } from "lucide-react";
+import { Terminal as TerminalIcon2, Lock as Lock2, Unlock as Unlock2, Box, Boxes } from "lucide-react";
 import React2, {
   useState as useState4,
   useCallback as useCallback3,
   useEffect as useEffect4,
   useRef as useRef3
 } from "react";
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs6, Fragment as Fragment2 } from "react/jsx-runtime";
+var ActivityIndicator = ({ color, isAnimating }) => /* @__PURE__ */ jsxs6("div", {
+  style: { display: "flex", gap: 1, alignItems: "center", height: 12 },
+  children: [
+    [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ jsx7("div", {
+      style: {
+        width: 2,
+        height: 10,
+        backgroundColor: color,
+        borderRadius: 1,
+        transformOrigin: "center",
+        transform: isAnimating ? undefined : "scaleY(0.4)",
+        animation: isAnimating ? `waveSine 1.2s ease-in-out ${i * 0.1}s infinite` : "none"
+      }
+    }, i)),
+    /* @__PURE__ */ jsx7("style", {
+      children: `
+        @keyframes waveSine {
+          0%, 100% { transform: scaleY(0.4); }
+          50% { transform: scaleY(1); }
+        }
+      `
+    })
+  ]
+});
 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();
   console.log("[TerminalTabContent] RENDER", { tabId: tab.id, isActive, sessionId });
   const terminalRef = useRef3(null);
   const [localSessionId, setLocalSessionId] = useState4(sessionId);
@@ -2019,15 +2044,32 @@ function TerminalTabContentInner(props, ref) {
     toggleScrollLock: handleToggleScrollLock
   }), [handleScrollToBottom, handleToggleScrollLock]);
   if (!isInitialized) {
-    return /* @__PURE__ */ jsx7("div", {
+    return /* @__PURE__ */ jsxs6("div", {
       style: {
         display: isActive ? "flex" : "none",
         height: "100%",
-        alignItems: "center",
-        justifyContent: "center",
-        color: "#888"
+        width: "100%",
+        backgroundColor: theme.colors.background,
+        padding: "10px 0 0 10px"
       },
-      children: "Initializing terminal..."
+      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 ? {
@@ -2488,30 +2530,12 @@ var TabbedTerminalPanelInner = ({
     const hasInternalActivity = tabSessionId ? activityStates.get(tabSessionId) : false;
     const isWorking = hasExternalWorkingState || hasInternalActivity;
     const isActive = tab.id === activeTabId;
-    if (!isActive && !isWorking)
+    if (!isActive)
       return null;
     const scrollPosition = scrollPositions.get(tab.id) ?? defaultScrollPosition;
-    return /* @__PURE__ */ jsxs6("div", {
-      style: { display: "flex", alignItems: "center", gap: "4px" },
+    return /* @__PURE__ */ jsxs6(Fragment2, {
       children: [
-        isWorking && /* @__PURE__ */ jsx7("div", {
-          style: {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            width: "16px",
-            height: "16px",
-            color: theme.colors.primary
-          },
-          title: "Agent working",
-          children: /* @__PURE__ */ jsx7(Loader2, {
-            size: 12,
-            style: {
-              animation: "spin 1s linear infinite"
-            }
-          })
-        }),
-        isActive && /* @__PURE__ */ jsx7("button", {
+        /* @__PURE__ */ jsx7("button", {
           onClick: (e) => {
             e.stopPropagation();
             handleToggleScrollLock();
@@ -2541,6 +2565,22 @@ var TabbedTerminalPanelInner = ({
           }) : /* @__PURE__ */ jsx7(Unlock2, {
             size: 10
           })
+        }),
+        /* @__PURE__ */ jsx7("div", {
+          style: {
+            position: "absolute",
+            right: "8px",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: "16px",
+            height: "16px"
+          },
+          title: isWorking ? "Terminal active" : "Terminal idle",
+          children: /* @__PURE__ */ jsx7(ActivityIndicator, {
+            color: theme.colors.primary,
+            isAnimating: isWorking ?? false
+          })
         })
       ]
     });
@@ -2700,6 +2740,7 @@ var TabbedTerminalPanelInner = ({
                 style: { opacity: 0.5, marginBottom: "16px" }
               }),
               /* @__PURE__ */ jsx7("p", {
+                style: { fontFamily: theme.fonts.body, fontSize: theme.fontSizes[1] },
                 children: "No terminal sessions"
               }),
               /* @__PURE__ */ jsx7("button", {

package/dist/src/panels/TabbedTerminalPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabbedTerminalPanel.d.ts","sourceRoot":"","sources":["../../../src/panels/TabbedTerminalPanel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAKN,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EACV,wBAAwB,EACxB,WAAW,EAKZ,MAAM,gBAAgB,CAAC;AAoCxB,MAAM,WAAW,qBAAqB;IACpC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AA6zCD,eAAO,MAAM,mBAAmB,EAAkC,CAAC,IAAI,SAAS,OAAO,cAAc,EAAE,OAAO,GAAG,WAAW,EAC1H,KAAK,EAAE,wBAAwB,CAAC,IAAI,CAAC,KAClC,KAAK,CAAC,YAAY,CAAC"}
+{"version":3,"file":"TabbedTerminalPanel.d.ts","sourceRoot":"","sources":["../../../src/panels/TabbedTerminalPanel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAKN,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EACV,wBAAwB,EACxB,WAAW,EAKZ,MAAM,gBAAgB,CAAC;AAkExB,MAAM,WAAW,qBAAqB;IACpC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAq0CD,eAAO,MAAM,mBAAmB,EAAkC,CAAC,IAAI,SAAS,OAAO,cAAc,EAAE,OAAO,GAAG,WAAW,EAC1H,KAAK,EAAE,wBAAwB,CAAC,IAAI,CAAC,KAClC,KAAK,CAAC,YAAY,CAAC"}

package/dist/src/telemetry.d.ts

@@ -1,6 +1,6 @@
 import { trace, context, SpanStatusCode, type Tracer, type Span } from '@opentelemetry/api';
 export declare const TRACER_NAME = "@industry-theme/xterm-terminal-panel";
-export declare const TRACER_VERSION = "0.5.1";
+export declare const TRACER_VERSION = "0.5.4";
 export declare function getTracer(): Tracer;
 export declare function getActiveSpan(): Span | undefined;
 export declare function withSpan<T>(span: Span, fn: () => Promise<T>): Promise<T>;

package/dist/styles.css

@@ -12,7 +12,7 @@
 
 /* Remove default xterm padding */
 .terminal-container-fix .xterm {
-  padding: 5px 0 0 5px;
+  padding: 10px 0 0 10px;
   margin: 0;
   height: 100%;
   width: 100%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@industry-theme/xterm-terminal-panel",
-  "version": "0.5.3",
+  "version": "0.5.5",
   "description": "Industry-themed xterm.js terminal components with panel framework integration",
   "type": "module",
   "main": "dist/index.js",