@testsmith/api-spector 0.0.2 → 0.0.4

package/out/renderer/assets/{index-CHCrooIl.js → index-BbhJgjM1.js}

@@ -9168,18 +9168,20 @@ function IconBtn({
   danger = false,
   alwaysVisible = false
 }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "button",
-    {
-      title: title2,
-      onClick: (e) => {
-        e.stopPropagation();
-        onClick(e);
-      },
-      className: `px-1 py-0.5 rounded transition-colors ${alwaysVisible ? "" : "opacity-0 group-hover:opacity-100"} ${danger ? "hover:text-red-400" : "hover:text-blue-400"} text-surface-400`,
-      children
-    }
-  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative group/tip", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "button",
+      {
+        onClick: (e) => {
+          e.stopPropagation();
+          onClick(e);
+        },
+        className: `px-1 py-0.5 rounded transition-all ${alwaysVisible ? "" : "opacity-0 group-hover:opacity-100"} ${danger ? "hover:text-red-400" : "hover:text-blue-400"} text-surface-400 hover:scale-150`,
+        children
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "pointer-events-none absolute bottom-full left-1/2 -translate-x-1/2 mb-1 z-50 hidden group-hover/tip:block", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "whitespace-nowrap rounded px-1.5 py-0.5 text-[10px] bg-[#1e1b2e] text-gray-300 border border-white/10 shadow-lg", children: title2 }) })
+  ] });
 }
 function RunBtn({ onClick }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -9291,6 +9293,13 @@ function CollectionNode({
 }) {
   const [expanded, setExpanded] = reactExports.useState(true);
   const [renaming, setRenaming] = reactExports.useState(false);
+  const [expandCtrl, setExpandCtrl] = reactExports.useState({ value: true, seq: 0 });
+  function expandAll() {
+    setExpandCtrl((c) => ({ value: true, seq: c.seq + 1 }));
+  }
+  function collapseAll() {
+    setExpandCtrl((c) => ({ value: false, seq: c.seq + 1 }));
+  }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
@@ -9317,6 +9326,8 @@ function CollectionNode({
           ) : /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs font-semibold truncate block", children: col.name }) }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center shrink-0 gap-0", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(RunBtn, { onClick: onRunCollection }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(IconBtn, { title: "Expand all folders", onClick: expandAll, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ExpandAllIcon, {}) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(IconBtn, { title: "Collapse all folders", onClick: collapseAll, children: /* @__PURE__ */ jsxRuntimeExports.jsx(CollapseAllIcon, {}) }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(IconBtn, { title: "Collection data (iterations)", onClick: onSelectCollection, children: /* @__PURE__ */ jsxRuntimeExports.jsx(TableIcon, {}) }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(IconBtn, { title: "Add request", onClick: () => onAddRequest(col.rootFolder.id), children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs", children: "+" }) }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(IconBtn, { title: "Add folder", onClick: () => onAddFolder(col.rootFolder.id, "New Folder"), children: /* @__PURE__ */ jsxRuntimeExports.jsx(FolderIcon, {}) }),
@@ -9334,6 +9345,7 @@ function CollectionNode({
         requests: col.requests,
         activeRequestId,
         depth: 0,
+        expandCtrl,
         onSelectRequest,
         onAddRequest,
         onAddFolder,
@@ -9353,6 +9365,7 @@ function FolderRow({
   folder,
   collectionId,
   depth,
+  expandCtrl,
   onAddRequest,
   onAddFolder,
   onRename,
@@ -9362,6 +9375,9 @@ function FolderRow({
   children
 }) {
   const [expanded, setExpanded] = reactExports.useState(true);
+  reactExports.useEffect(() => {
+    if (expandCtrl.seq > 0) setExpanded(expandCtrl.value);
+  }, [expandCtrl.seq]);
   const [renaming, setRenaming] = reactExports.useState(false);
   const [showSettings, setShowSettings] = reactExports.useState(false);
   const tags2 = folder.tags ?? [];
@@ -9430,6 +9446,7 @@ function FolderContents({
   requests,
   activeRequestId,
   depth,
+  expandCtrl,
   onSelectRequest,
   onAddRequest,
   onAddFolder,
@@ -9449,6 +9466,7 @@ function FolderContents({
         folder: sub,
         collectionId,
         depth: depth + 1,
+        expandCtrl,
         onAddRequest: () => onAddRequest(sub.id),
         onAddFolder: () => onAddFolder(sub.id, "New Folder"),
         onRename: (name2) => onRenameFolder(sub.id, name2),
@@ -9463,6 +9481,7 @@ function FolderContents({
             requests,
             activeRequestId,
             depth: depth + 1,
+            expandCtrl,
             onSelectRequest,
             onAddRequest,
             onAddFolder,
@@ -9576,6 +9595,12 @@ function CopyIcon() {
 function KeyIcon() {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-3 h-3", fill: "none", stroke: "currentColor", strokeWidth: 2, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 7a4 4 0 110 8 4 4 0 010-8zm-7 8l-1 1m0 0l-1 1m1-1l1 1M3 20l5-5" }) });
 }
+function ExpandAllIcon() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-3 h-3", fill: "none", stroke: "currentColor", strokeWidth: 2, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4 6h16M4 12h8M4 18h16M15 15l3 3 3-3" }) });
+}
+function CollapseAllIcon() {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-3 h-3", fill: "none", stroke: "currentColor", strokeWidth: 2, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4 6h16M4 12h8M4 18h16M21 12l-3-3-3 3" }) });
+}
 function ParamsTab({ request, onChange }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     KVTable,
@@ -48189,7 +48214,11 @@ function App() {
     docsModalOpen && /* @__PURE__ */ jsxRuntimeExports.jsx(DocsGeneratorModal, { onClose: () => setDocsModalOpen(false) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "drag-region flex-shrink-0 bg-surface-950 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "no-drag text-[11px] font-medium tracking-widest select-none", style: { color: "var(--text-muted)" }, children: [
       "api ",
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "#6aa3c8" }, children: "Spector" })
+      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "#6aa3c8" }, children: "Spector" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "ml-2 text-[10px] font-normal opacity-50", children: [
+        "v",
+        "0.0.4"
+      ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(Toolbar, { onOpenDocs: () => setDocsModalOpen(true) }),
     workspace ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 min-h-0", children: [

package/out/renderer/assets/{index-B_l1FCkO.css → index-C1Q1TfC-.css}

@@ -510,6 +510,9 @@ video {
   white-space: nowrap;
   border-width: 0;
 }
+.pointer-events-none {
+  pointer-events: none;
+}
 .visible {
   visibility: visible;
 }
@@ -531,9 +534,15 @@ video {
 .inset-0 {
   inset: 0px;
 }
+.bottom-full {
+  bottom: 100%;
+}
 .left-0 {
   left: 0px;
 }
+.left-1\/2 {
+  left: 50%;
+}
 .right-0 {
   right: 0px;
 }
@@ -867,6 +876,10 @@ video {
 .border-collapse {
   border-collapse: collapse;
 }
+.-translate-x-1\/2 {
+  --tw-translate-x: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .transform {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
@@ -1089,6 +1102,9 @@ video {
 .border-transparent {
   border-color: transparent;
 }
+.border-white\/10 {
+  border-color: rgb(255 255 255 / 0.1);
+}
 .border-yellow-800 {
   --tw-border-opacity: 1;
   border-color: rgb(133 77 14 / var(--tw-border-opacity, 1));
@@ -1096,6 +1112,10 @@ video {
 .border-b-blue-500 {
   border-bottom-color: var(--ts-blue-500);
 }
+.bg-\[\#1e1b2e\] {
+  --tw-bg-opacity: 1;
+  background-color: rgb(30 27 46 / var(--tw-bg-opacity, 1));
+}
 .bg-amber-400 {
   --tw-bg-opacity: 1;
   background-color: rgb(251 191 36 / var(--tw-bg-opacity, 1));
@@ -1498,6 +1518,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(16 185 129 / var(--tw-text-opacity, 1));
 }
+.text-gray-300 {
+  --tw-text-opacity: 1;
+  color: rgb(209 213 219 / var(--tw-text-opacity, 1));
+}
 .text-gray-400 {
   --tw-text-opacity: 1;
   color: rgb(156 163 175 / var(--tw-text-opacity, 1));
@@ -1560,11 +1584,19 @@ video {
 .opacity-30 {
   opacity: 0.3;
 }
+.opacity-50 {
+  opacity: 0.5;
+}
 .shadow-2xl {
   --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
   --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
+.shadow-lg {
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
 .shadow-xl {
   --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
@@ -1742,6 +1774,10 @@ body {
 :root.light .text-amber-300 { color: #b45309 !important; }  /* amber-700 */
 :root.light .text-amber-400 { color: #d97706 !important; }  /* amber-500 */  .last\:border-0:last-child {
   border-width: 0px;
+}  .hover\:scale-150:hover {
+  --tw-scale-x: 1.5;
+  --tw-scale-y: 1.5;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }  .hover\:border-blue-500:hover {
   border-color: var(--ts-blue-500);
 }  .hover\:border-surface-500:hover {
@@ -1817,6 +1853,8 @@ body {
   opacity: 0.4;
 }  .disabled\:opacity-50:disabled {
   opacity: 0.5;
+}  .group\/tip:hover .group-hover\/tip\:block {
+  display: block;
 }  .group:hover .group-hover\:opacity-100 {
   opacity: 1;
 }  @media (min-width: 1024px) {

package/out/renderer/index.html

@@ -1,13 +1,16 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>api Spector</title>
-    <script type="module" crossorigin src="./assets/index-CHCrooIl.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/index-B_l1FCkO.css">
-  </head>
-  <body>
-    <div id="root"></div>
-  </body>
-</html>
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>api Spector</title>
+  <script type="module" crossorigin src="./assets/index-BbhJgjM1.js"></script>
+  <link rel="stylesheet" crossorigin href="./assets/index-C1Q1TfC-.css">
+</head>
+
+<body>
+  <div id="root"></div>
+</body>
+
+</html>

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@testsmith/api-spector",
   "productName": "api Spector",
-  "version": "0.0.2",
-  "description": "Local-first API testing tool — inspect, test and mock APIs",
+  "version": "0.0.4",
+  "description": "Local-first API testing tool to inspect, test and mock APIs",
   "repository": {
     "type": "git",
     "url": "https://github.com/testsmith-io/api-spector"

package/readme.md

@@ -1,6 +1,6 @@
 # api Spector
 
-Local-first API testing tool. Inspect, test and mock APIs — secrets stay on your machine.
+Local-first API testing tool. Inspect, test and mock APIs. Secrets stay on your machine.
 
 - GUI built with Electron + React
 - CLI for running tests and mock servers in CI/CD pipelines
@@ -57,7 +57,7 @@ Keeps running until `Ctrl+C`.
 
 ## Workspaces
 
-A workspace is a `.spector` file that references your collections, environments and mock servers. Safe to commit to Git — secrets are encrypted, not stored in plain text.
+A workspace is a `.spector` file that references your collections, environments and mock servers. Safe to commit to Git. Secrets are encrypted, not stored in plain text.
 
 ```
 my-project/
@@ -78,12 +78,12 @@ Secret variables are encrypted with AES-256-GCM using a master password. Set `AP
 export API_SPECTOR_MASTER_KEY="your-password"
 ```
 
-**Windows — PowerShell profile:**
+**Windows (PowerShell profile):**
 ```powershell
 $env:API_SPECTOR_MASTER_KEY = "your-password"
 ```
 
-**Windows — Command Prompt (permanent):**
+**Windows (Command Prompt, permanent):**
 ```cmd
 setx API_SPECTOR_MASTER_KEY "your-password"
 ```