@industry-theme/xterm-terminal-panel 0.8.6 → 0.8.8

package/dist/index.css

@@ -177,6 +177,18 @@
   }
 }
 
+@keyframes copy-feedback-in {
+  from {
+    opacity: 0;
+    transform: translateX(-50%)translateY(-6px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateX(-50%)translateY(0);
+  }
+}
+
 .terminal-working-overlay {
   animation: blinds-down .3s ease-out forwards;
 }

package/dist/index.js

@@ -11,6 +11,7 @@ import { WebLinksAddon } from "@xterm/addon-web-links";
 import { WebglAddon } from "@xterm/addon-webgl";
 import { Terminal } from "@xterm/xterm";
 import {
+  Check,
   ChevronDown,
   ExternalLink,
   Monitor,
@@ -36,7 +37,7 @@ import {
 // package.json
 var package_default = {
   name: "@industry-theme/xterm-terminal-panel",
-  version: "0.8.5",
+  version: "0.8.7",
   description: "Industry-themed xterm.js terminal components with panel framework integration",
   type: "module",
   sideEffects: [
@@ -130,7 +131,7 @@ var package_default = {
     "@industry-theme/agent-panels": "^0.3.0",
     "@industry-theme/principal-view-panels": "0.12.79",
     "@opentelemetry/api": "^1.9.0",
-    "@principal-ade/industry-theme": "^0.1.22",
+    "@principal-ade/industry-theme": "^0.1.24",
     "@principal-ade/panel-framework-core": "0.5.1",
     "@principal-ade/panels": "1.0.81",
     "@principal-ai/repository-abstraction": "^0.5.7",
@@ -464,6 +465,9 @@ var ThemedTerminal = forwardRef(({
   const [terminal, setTerminal] = useState(null);
   const [isClosingOverlay, setIsClosingOverlay] = useState(false);
   const [selectionDrag, setSelectionDrag] = useState(null);
+  const [copyFeedback, setCopyFeedback] = useState(false);
+  const copyFeedbackTimeoutRef = useRef(null);
+  const resolvedThemeRef = useRef(null);
   const fitAddonRef = useRef(null);
   const searchAddonRef = useRef(null);
   const webglAddonRef = useRef(null);
@@ -772,6 +776,7 @@ var ThemedTerminal = forwardRef(({
     const config = initialConfigRef.current;
     const baseTheme = createTerminalTheme(theme);
     const initialTheme = config.allowTransparency ? { ...baseTheme, background: config.backgroundColor ?? "rgba(0,0,0,0)" } : baseTheme;
+    resolvedThemeRef.current = initialTheme;
     const term = new Terminal({
       cursorBlink: config.cursorBlink,
       cursorStyle: config.cursorStyle,
@@ -1037,9 +1042,13 @@ var ThemedTerminal = forwardRef(({
   useEffect(() => {
     if (terminal) {
       const nextTheme = createTerminalTheme(theme);
-      terminal.options.theme = transparentBg ? { ...nextTheme, background: transparentBg } : nextTheme;
+      const applied = transparentBg ? { ...nextTheme, background: transparentBg } : nextTheme;
+      resolvedThemeRef.current = applied;
+      if (!copyFeedback) {
+        terminal.options.theme = applied;
+      }
     }
-  }, [terminal, theme, transparentBg]);
+  }, [terminal, theme, transparentBg, copyFeedback]);
   useEffect(() => {
     if (!terminal || !onReady) {
       return;
@@ -1115,6 +1124,46 @@ var ThemedTerminal = forwardRef(({
       scrollDisposable.dispose();
     };
   }, [terminal, enableSelectionDrag]);
+  useEffect(() => {
+    if (!terminal)
+      return;
+    const el = terminalRef.current;
+    if (!el)
+      return;
+    const COPY_FEEDBACK_MS = 600;
+    const handleCopy = () => {
+      const text = terminal.getSelection();
+      if (!text || text.trim().length === 0)
+        return;
+      setSelectionDrag(null);
+      const base = resolvedThemeRef.current ?? terminal.options.theme ?? {};
+      const flash = theme.colors.success + "aa";
+      terminal.options.theme = {
+        ...base,
+        selectionBackground: flash,
+        selectionInactiveBackground: flash
+      };
+      setCopyFeedback(true);
+      if (copyFeedbackTimeoutRef.current) {
+        clearTimeout(copyFeedbackTimeoutRef.current);
+      }
+      copyFeedbackTimeoutRef.current = setTimeout(() => {
+        if (resolvedThemeRef.current) {
+          terminal.options.theme = resolvedThemeRef.current;
+        }
+        setCopyFeedback(false);
+        copyFeedbackTimeoutRef.current = null;
+      }, COPY_FEEDBACK_MS);
+    };
+    el.addEventListener("copy", handleCopy);
+    return () => {
+      el.removeEventListener("copy", handleCopy);
+      if (copyFeedbackTimeoutRef.current) {
+        clearTimeout(copyFeedbackTimeoutRef.current);
+        copyFeedbackTimeoutRef.current = null;
+      }
+    };
+  }, [terminal, theme]);
   useEffect(() => {
     const terminalElement = terminalRef.current;
     if (!terminalElement)
@@ -1372,6 +1421,35 @@ var ThemedTerminal = forwardRef(({
             metadata: selectionDragMetadata,
             onDragEnd: () => setSelectionDrag(null)
           }),
+          copyFeedback && /* @__PURE__ */ jsxs3("div", {
+            style: {
+              position: "absolute",
+              top: 12,
+              left: "50%",
+              transform: "translateX(-50%)",
+              display: "flex",
+              alignItems: "center",
+              gap: 6,
+              padding: "6px 12px",
+              background: theme.colors.success,
+              color: theme.colors.textOnPrimary ?? theme.colors.background,
+              borderRadius: 6,
+              fontSize: 12,
+              fontWeight: 600,
+              fontFamily: 'Menlo, Monaco, "Courier New", monospace',
+              boxShadow: "0 2px 8px rgba(0,0,0,0.25)",
+              pointerEvents: "none",
+              zIndex: 1001,
+              animation: "copy-feedback-in 0.15s ease-out"
+            },
+            children: [
+              /* @__PURE__ */ jsx3(Check, {
+                size: 14,
+                strokeWidth: 3
+              }),
+              "Copied!"
+            ]
+          }),
           overlayState && /* @__PURE__ */ jsxs3("div", {
             style: {
               position: "absolute",
@@ -2192,7 +2270,7 @@ var TabButton = ({
       justifyContent: "center",
       gap: "6px",
       padding: "6px 8px",
-      backgroundColor: isActive ? theme.colors.backgroundSecondary : theme.colors.backgroundDark ?? theme.colors.backgroundSecondary,
+      backgroundColor: isActive ? theme.colors.backgroundDark ?? theme.colors.backgroundSecondary : theme.colors.background,
       borderBottom: isActive ? "1px solid transparent" : `1px solid ${theme.colors.border}`,
       cursor: draggable ? "grab" : "pointer",
       userSelect: "none",

package/dist/src/components/ThemedTerminal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemedTerminal.d.ts","sourceRoot":"","sources":["../../../src/components/ThemedTerminal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAkC3D,OAAO,4BAA4B,CAAC;AAGpC,OAAO,KAAK,EAGV,mBAAmB,EACnB,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AAMjC,OAAO,8BAA8B,CAAC;AAEtC,MAAM,WAAW,4BAA6B,SAAQ,mBAAmB;IACvE,KAAK,EAAE,KAAK,CAAC;CACd;AAsBD,eAAO,MAAM,cAAc,4HAg0C1B,CAAC"}
+{"version":3,"file":"ThemedTerminal.d.ts","sourceRoot":"","sources":["../../../src/components/ThemedTerminal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAoC3D,OAAO,4BAA4B,CAAC;AAGpC,OAAO,KAAK,EAGV,mBAAmB,EACnB,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AAMjC,OAAO,8BAA8B,CAAC;AAEtC,MAAM,WAAW,4BAA6B,SAAQ,mBAAmB;IACvE,KAAK,EAAE,KAAK,CAAC;CACd;AAsBD,eAAO,MAAM,cAAc,4HA45C1B,CAAC"}

package/dist/styles.css

@@ -212,6 +212,18 @@
   }
 }
 
+/* Copy confirmation pill entrance */
+@keyframes copy-feedback-in {
+  from {
+    opacity: 0;
+    transform: translateX(-50%) translateY(-6px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(-50%) translateY(0);
+  }
+}
+
 /* Working overlay container */
 .terminal-working-overlay {
   animation: blinds-down 0.3s ease-out forwards;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@industry-theme/xterm-terminal-panel",
-  "version": "0.8.6",
+  "version": "0.8.8",
   "description": "Industry-themed xterm.js terminal components with panel framework integration",
   "type": "module",
   "sideEffects": [
@@ -94,7 +94,7 @@
     "@industry-theme/agent-panels": "^0.3.0",
     "@industry-theme/principal-view-panels": "0.12.79",
     "@opentelemetry/api": "^1.9.0",
-    "@principal-ade/industry-theme": "^0.1.22",
+    "@principal-ade/industry-theme": "^0.1.24",
     "@principal-ade/panel-framework-core": "0.5.1",
     "@principal-ade/panels": "1.0.81",
     "@principal-ai/repository-abstraction": "^0.5.7",