@flanksource/clicky-ui 0.2.2 → 0.2.4

package/dist/rpc/InlineError.cjs

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const Icon = require("../data/Icon.cjs");
+const utils = require("../lib/utils.cjs");
+const UiChevronRight = require("../icons/components/UiChevronRight.cjs");
+function InlineError({ title, error, className }) {
+  const message = error instanceof Error ? error.message : String(error ?? "");
+  const details = getErrorDetails(error);
+  const hasDetails = Boolean(details.responseBody || details.status || details.url);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("rounded-xl border border-dashed border-red-300 p-6 text-sm", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-red-600", children: title }),
+      message && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-muted-foreground", children: message })
+    ] }),
+    hasDetails && /* @__PURE__ */ jsxRuntime.jsxs("details", { className: "group mt-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("summary", { className: "flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiChevronRight.UiChevronRight, className: "transition-transform group-open:rotate-90" }),
+        "More details"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 space-y-2 text-left font-mono text-xs", children: [
+        (details.method || details.url || details.status) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-muted-foreground", children: [
+          details.method && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+            details.method,
+            " "
+          ] }),
+          details.url,
+          details.status != null && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+            " - ",
+            details.status
+          ] })
+        ] }),
+        details.responseBody && /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs", children: details.responseBody })
+      ] })
+    ] })
+  ] });
+}
+function getErrorDetails(error) {
+  if (error == null || typeof error !== "object") return {};
+  const record = error;
+  const details = {};
+  if (typeof record.method === "string") details.method = record.method;
+  if (typeof record.url === "string") details.url = record.url;
+  if (typeof record.status === "number") details.status = record.status;
+  if (typeof record.responseBody === "string") details.responseBody = record.responseBody;
+  return details;
+}
+exports.InlineError = InlineError;
+//# sourceMappingURL=InlineError.cjs.map

package/dist/rpc/InlineError.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineError.cjs","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Icon } from \"../data/Icon\";\nimport { UiChevronRight } from \"../icons\";\nimport { cn } from \"../lib/utils\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n};\n\ntype ErrorDetails = {\n  method?: string;\n  url?: string;\n  status?: number;\n  responseBody?: string;\n};\n\nexport function InlineError({ title, error, className }: InlineErrorProps) {\n  const message = error instanceof Error ? error.message : String(error ?? \"\");\n  const details = getErrorDetails(error);\n  const hasDetails = Boolean(details.responseBody || details.status || details.url);\n\n  return (\n    <div className={cn(\"rounded-xl border border-dashed border-red-300 p-6 text-sm\", className)}>\n      <div className=\"text-center\">\n        <div className=\"font-medium text-red-600\">{title}</div>\n        {message && <div className=\"mt-1 text-muted-foreground\">{message}</div>}\n      </div>\n      {hasDetails && (\n        <details className=\"group mt-3\">\n          <summary className=\"flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground\">\n            <Icon icon={UiChevronRight} className=\"transition-transform group-open:rotate-90\" />\n            More details\n          </summary>\n          <div className=\"mt-2 space-y-2 text-left font-mono text-xs\">\n            {(details.method || details.url || details.status) && (\n              <div className=\"text-muted-foreground\">\n                {details.method && <span>{details.method} </span>}\n                {details.url}\n                {details.status != null && <span> - {details.status}</span>}\n              </div>\n            )}\n            {details.responseBody && (\n              <pre className=\"max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs\">\n                {details.responseBody}\n              </pre>\n            )}\n          </div>\n        </details>\n      )}\n    </div>\n  );\n}\n\nfunction getErrorDetails(error: unknown): ErrorDetails {\n  if (error == null || typeof error !== \"object\") return {};\n  const record = error as Record<string, unknown>;\n  const details: ErrorDetails = {};\n  if (typeof record.method === \"string\") details.method = record.method;\n  if (typeof record.url === \"string\") details.url = record.url;\n  if (typeof record.status === \"number\") details.status = record.status;\n  if (typeof record.responseBody === \"string\") details.responseBody = record.responseBody;\n  return details;\n}\n"],"names":["cn","jsxs","jsx","Icon","UiChevronRight"],"mappings":";;;;;;AAiBO,SAAS,YAAY,EAAE,OAAO,OAAO,aAA+B;AACzE,QAAM,UAAU,iBAAiB,QAAQ,MAAM,UAAU,OAAO,SAAS,EAAE;AAC3E,QAAM,UAAU,gBAAgB,KAAK;AACrC,QAAM,aAAa,QAAQ,QAAQ,gBAAgB,QAAQ,UAAU,QAAQ,GAAG;AAEhF,yCACG,OAAA,EAAI,WAAWA,MAAAA,GAAG,8DAA8D,SAAS,GACxF,UAAA;AAAA,IAAAC,2BAAAA,KAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,MAAAC,2BAAAA,IAAC,OAAA,EAAI,WAAU,4BAA4B,UAAA,OAAM;AAAA,MAChD,WAAWA,2BAAAA,IAAC,OAAA,EAAI,WAAU,8BAA8B,UAAA,QAAA,CAAQ;AAAA,IAAA,GACnE;AAAA,IACC,cACCD,2BAAAA,KAAC,WAAA,EAAQ,WAAU,cACjB,UAAA;AAAA,MAAAA,2BAAAA,KAAC,WAAA,EAAQ,WAAU,6GACjB,UAAA;AAAA,QAAAC,2BAAAA,IAACC,KAAAA,MAAA,EAAK,MAAMC,eAAAA,gBAAgB,WAAU,6CAA4C;AAAA,QAAE;AAAA,MAAA,GAEtF;AAAA,MACAH,2BAAAA,KAAC,OAAA,EAAI,WAAU,8CACX,UAAA;AAAA,SAAA,QAAQ,UAAU,QAAQ,OAAO,QAAQ,WACzCA,2BAAAA,KAAC,OAAA,EAAI,WAAU,yBACZ,UAAA;AAAA,UAAA,QAAQ,0CAAW,QAAA,EAAM,UAAA;AAAA,YAAA,QAAQ;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UACzC,QAAQ;AAAA,UACR,QAAQ,UAAU,QAAQA,2BAAAA,KAAC,QAAA,EAAK,UAAA;AAAA,YAAA;AAAA,YAAI,QAAQ;AAAA,UAAA,EAAA,CAAO;AAAA,QAAA,GACtD;AAAA,QAED,QAAQ,gBACPC,2BAAAA,IAAC,SAAI,WAAU,0DACZ,kBAAQ,aAAA,CACX;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAAS,gBAAgB,OAA8B;AACrD,MAAI,SAAS,QAAQ,OAAO,UAAU,iBAAiB,CAAA;AACvD,QAAM,SAAS;AACf,QAAM,UAAwB,CAAA;AAC9B,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,QAAQ,SAAU,SAAQ,MAAM,OAAO;AACzD,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,iBAAiB,SAAU,SAAQ,eAAe,OAAO;AAC3E,SAAO;AACT;;"}

package/dist/rpc/InlineError.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InlineError.d.ts","sourceRoot":"","sources":["../../src/rpc/InlineError.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AASF,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAsCxE"}
+{"version":3,"file":"InlineError.d.ts","sourceRoot":"","sources":["../../src/rpc/InlineError.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AASF,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAmCxE"}

package/dist/rpc/InlineError.js

@@ -1,6 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { Icon } from "../data/Icon.js";
 import { cn } from "../lib/utils.js";
+import { UiChevronRight } from "../icons/components/UiChevronRight.js";
 function InlineError({ title, error, className }) {
   const message = error instanceof Error ? error.message : String(error ?? "");
   const details = getErrorDetails(error);
@@ -12,13 +13,7 @@ function InlineError({ title, error, className }) {
     ] }),
     hasDetails && /* @__PURE__ */ jsxs("details", { className: "group mt-3", children: [
       /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground", children: [
-        /* @__PURE__ */ jsx(
-          Icon,
-          {
-            name: "codicon:chevron-right",
-            className: "transition-transform group-open:rotate-90"
-          }
-        ),
+        /* @__PURE__ */ jsx(Icon, { icon: UiChevronRight, className: "transition-transform group-open:rotate-90" }),
         "More details"
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "mt-2 space-y-2 text-left font-mono text-xs", children: [

package/dist/rpc/InlineError.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineError.js","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Icon } from \"../data/Icon\";\nimport { cn } from \"../lib/utils\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n};\n\ntype ErrorDetails = {\n  method?: string;\n  url?: string;\n  status?: number;\n  responseBody?: string;\n};\n\nexport function InlineError({ title, error, className }: InlineErrorProps) {\n  const message = error instanceof Error ? error.message : String(error ?? \"\");\n  const details = getErrorDetails(error);\n  const hasDetails = Boolean(details.responseBody || details.status || details.url);\n\n  return (\n    <div className={cn(\"rounded-xl border border-dashed border-red-300 p-6 text-sm\", className)}>\n      <div className=\"text-center\">\n        <div className=\"font-medium text-red-600\">{title}</div>\n        {message && <div className=\"mt-1 text-muted-foreground\">{message}</div>}\n      </div>\n      {hasDetails && (\n        <details className=\"group mt-3\">\n          <summary className=\"flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground\">\n            <Icon\n              name=\"codicon:chevron-right\"\n              className=\"transition-transform group-open:rotate-90\"\n            />\n            More details\n          </summary>\n          <div className=\"mt-2 space-y-2 text-left font-mono text-xs\">\n            {(details.method || details.url || details.status) && (\n              <div className=\"text-muted-foreground\">\n                {details.method && <span>{details.method} </span>}\n                {details.url}\n                {details.status != null && <span> - {details.status}</span>}\n              </div>\n            )}\n            {details.responseBody && (\n              <pre className=\"max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs\">\n                {details.responseBody}\n              </pre>\n            )}\n          </div>\n        </details>\n      )}\n    </div>\n  );\n}\n\nfunction getErrorDetails(error: unknown): ErrorDetails {\n  if (error == null || typeof error !== \"object\") return {};\n  const record = error as Record<string, unknown>;\n  const details: ErrorDetails = {};\n  if (typeof record.method === \"string\") details.method = record.method;\n  if (typeof record.url === \"string\") details.url = record.url;\n  if (typeof record.status === \"number\") details.status = record.status;\n  if (typeof record.responseBody === \"string\") details.responseBody = record.responseBody;\n  return details;\n}\n"],"names":[],"mappings":";;;AAgBO,SAAS,YAAY,EAAE,OAAO,OAAO,aAA+B;AACzE,QAAM,UAAU,iBAAiB,QAAQ,MAAM,UAAU,OAAO,SAAS,EAAE;AAC3E,QAAM,UAAU,gBAAgB,KAAK;AACrC,QAAM,aAAa,QAAQ,QAAQ,gBAAgB,QAAQ,UAAU,QAAQ,GAAG;AAEhF,8BACG,OAAA,EAAI,WAAW,GAAG,8DAA8D,SAAS,GACxF,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,4BAA4B,UAAA,OAAM;AAAA,MAChD,WAAW,oBAAC,OAAA,EAAI,WAAU,8BAA8B,UAAA,QAAA,CAAQ;AAAA,IAAA,GACnE;AAAA,IACC,cACC,qBAAC,WAAA,EAAQ,WAAU,cACjB,UAAA;AAAA,MAAA,qBAAC,WAAA,EAAQ,WAAU,6GACjB,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QACV;AAAA,MAAA,GAEJ;AAAA,MACA,qBAAC,OAAA,EAAI,WAAU,8CACX,UAAA;AAAA,SAAA,QAAQ,UAAU,QAAQ,OAAO,QAAQ,WACzC,qBAAC,OAAA,EAAI,WAAU,yBACZ,UAAA;AAAA,UAAA,QAAQ,+BAAW,QAAA,EAAM,UAAA;AAAA,YAAA,QAAQ;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UACzC,QAAQ;AAAA,UACR,QAAQ,UAAU,QAAQ,qBAAC,QAAA,EAAK,UAAA;AAAA,YAAA;AAAA,YAAI,QAAQ;AAAA,UAAA,EAAA,CAAO;AAAA,QAAA,GACtD;AAAA,QAED,QAAQ,gBACP,oBAAC,SAAI,WAAU,0DACZ,kBAAQ,aAAA,CACX;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAAS,gBAAgB,OAA8B;AACrD,MAAI,SAAS,QAAQ,OAAO,UAAU,iBAAiB,CAAA;AACvD,QAAM,SAAS;AACf,QAAM,UAAwB,CAAA;AAC9B,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,QAAQ,SAAU,SAAQ,MAAM,OAAO;AACzD,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,iBAAiB,SAAU,SAAQ,eAAe,OAAO;AAC3E,SAAO;AACT;"}
+{"version":3,"file":"InlineError.js","sources":["../../src/rpc/InlineError.tsx"],"sourcesContent":["import { Icon } from \"../data/Icon\";\nimport { UiChevronRight } from \"../icons\";\nimport { cn } from \"../lib/utils\";\n\nexport type InlineErrorProps = {\n  title: string;\n  error: unknown;\n  className?: string;\n};\n\ntype ErrorDetails = {\n  method?: string;\n  url?: string;\n  status?: number;\n  responseBody?: string;\n};\n\nexport function InlineError({ title, error, className }: InlineErrorProps) {\n  const message = error instanceof Error ? error.message : String(error ?? \"\");\n  const details = getErrorDetails(error);\n  const hasDetails = Boolean(details.responseBody || details.status || details.url);\n\n  return (\n    <div className={cn(\"rounded-xl border border-dashed border-red-300 p-6 text-sm\", className)}>\n      <div className=\"text-center\">\n        <div className=\"font-medium text-red-600\">{title}</div>\n        {message && <div className=\"mt-1 text-muted-foreground\">{message}</div>}\n      </div>\n      {hasDetails && (\n        <details className=\"group mt-3\">\n          <summary className=\"flex cursor-pointer items-center justify-center gap-1 text-xs text-muted-foreground hover:text-foreground\">\n            <Icon icon={UiChevronRight} className=\"transition-transform group-open:rotate-90\" />\n            More details\n          </summary>\n          <div className=\"mt-2 space-y-2 text-left font-mono text-xs\">\n            {(details.method || details.url || details.status) && (\n              <div className=\"text-muted-foreground\">\n                {details.method && <span>{details.method} </span>}\n                {details.url}\n                {details.status != null && <span> - {details.status}</span>}\n              </div>\n            )}\n            {details.responseBody && (\n              <pre className=\"max-h-64 overflow-auto rounded-md bg-muted p-2 text-xs\">\n                {details.responseBody}\n              </pre>\n            )}\n          </div>\n        </details>\n      )}\n    </div>\n  );\n}\n\nfunction getErrorDetails(error: unknown): ErrorDetails {\n  if (error == null || typeof error !== \"object\") return {};\n  const record = error as Record<string, unknown>;\n  const details: ErrorDetails = {};\n  if (typeof record.method === \"string\") details.method = record.method;\n  if (typeof record.url === \"string\") details.url = record.url;\n  if (typeof record.status === \"number\") details.status = record.status;\n  if (typeof record.responseBody === \"string\") details.responseBody = record.responseBody;\n  return details;\n}\n"],"names":[],"mappings":";;;;AAiBO,SAAS,YAAY,EAAE,OAAO,OAAO,aAA+B;AACzE,QAAM,UAAU,iBAAiB,QAAQ,MAAM,UAAU,OAAO,SAAS,EAAE;AAC3E,QAAM,UAAU,gBAAgB,KAAK;AACrC,QAAM,aAAa,QAAQ,QAAQ,gBAAgB,QAAQ,UAAU,QAAQ,GAAG;AAEhF,8BACG,OAAA,EAAI,WAAW,GAAG,8DAA8D,SAAS,GACxF,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,eACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,4BAA4B,UAAA,OAAM;AAAA,MAChD,WAAW,oBAAC,OAAA,EAAI,WAAU,8BAA8B,UAAA,QAAA,CAAQ;AAAA,IAAA,GACnE;AAAA,IACC,cACC,qBAAC,WAAA,EAAQ,WAAU,cACjB,UAAA;AAAA,MAAA,qBAAC,WAAA,EAAQ,WAAU,6GACjB,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAK,MAAM,gBAAgB,WAAU,6CAA4C;AAAA,QAAE;AAAA,MAAA,GAEtF;AAAA,MACA,qBAAC,OAAA,EAAI,WAAU,8CACX,UAAA;AAAA,SAAA,QAAQ,UAAU,QAAQ,OAAO,QAAQ,WACzC,qBAAC,OAAA,EAAI,WAAU,yBACZ,UAAA;AAAA,UAAA,QAAQ,+BAAW,QAAA,EAAM,UAAA;AAAA,YAAA,QAAQ;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UACzC,QAAQ;AAAA,UACR,QAAQ,UAAU,QAAQ,qBAAC,QAAA,EAAK,UAAA;AAAA,YAAA;AAAA,YAAI,QAAQ;AAAA,UAAA,EAAA,CAAO;AAAA,QAAA,GACtD;AAAA,QAED,QAAQ,gBACP,oBAAC,SAAI,WAAU,0DACZ,kBAAQ,aAAA,CACX;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAAS,gBAAgB,OAA8B;AACrD,MAAI,SAAS,QAAQ,OAAO,UAAU,iBAAiB,CAAA;AACvD,QAAM,SAAS;AACf,QAAM,UAAwB,CAAA;AAC9B,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,QAAQ,SAAU,SAAQ,MAAM,OAAO;AACzD,MAAI,OAAO,OAAO,WAAW,SAAU,SAAQ,SAAS,OAAO;AAC/D,MAAI,OAAO,OAAO,iBAAiB,SAAU,SAAQ,eAAe,OAAO;AAC3E,SAAO;AACT;"}

package/dist/rpc/OperationActionDialog.cjs

@@ -0,0 +1,106 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const button = require("../components/button.cjs");
+const Icon = require("../data/Icon.cjs");
+const Modal = require("../overlay/Modal.cjs");
+const CommandForm = require("./CommandForm.cjs");
+const CommandOutput = require("./CommandOutput.cjs");
+const InlineError = require("./InlineError.cjs");
+const UiPlay = require("../icons/components/UiPlay.cjs");
+function OperationActionDialog({
+  operation,
+  client,
+  initialValues,
+  label,
+  defaultAccept = "application/clicky+json",
+  onNavigateAction
+}) {
+  const [open, setOpen] = react.useState(false);
+  const [isExecuting, setIsExecuting] = react.useState(false);
+  const [response, setResponse] = react.useState(null);
+  const [error, setError] = react.useState(null);
+  async function handleExecute(params, headers) {
+    if (onNavigateAction) {
+      const href = hrefForOperationAction(operation.path, params);
+      if (!href) return;
+      const separator = href.includes("?") ? "&" : "?";
+      onNavigateAction(`${href}${separator}autoRun=1`);
+      return;
+    }
+    setIsExecuting(true);
+    setError(null);
+    setResponse(null);
+    try {
+      const result = await client.executeCommand(operation.path, operation.method, params, headers);
+      setResponse(result);
+    } catch (err) {
+      setError(err);
+    } finally {
+      setIsExecuting(false);
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(true), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiPlay.UiPlay }),
+      label
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Modal.Modal, { open, onClose: () => setOpen(false), title: label, size: "lg", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        CommandForm.CommandForm,
+        {
+          parameters: operation.operation.parameters ?? [],
+          onExecute: handleExecute,
+          isPending: isExecuting,
+          method: operation.method,
+          path: operation.path,
+          accept: defaultAccept,
+          initialValues
+        }
+      ),
+      error ? /* @__PURE__ */ jsxRuntime.jsx(InlineError.InlineError, { title: `Failed to execute ${operation.path}`, error }) : response ? /* @__PURE__ */ jsxRuntime.jsx(CommandOutput.CommandOutput, { response }) : null
+    ] }) })
+  ] });
+}
+function hrefForOperationAction(path, params) {
+  const nextParams = { ...params };
+  const args = parseArgsParam(params.args);
+  let route = apiPathToRoutePath(path);
+  for (const [index, name] of pathParamNames(path).entries()) {
+    const value = nextParams[name] || args[index];
+    if (!value) return void 0;
+    route = route.replace(`:${name}`, encodeURIComponent(value));
+    delete nextParams[name];
+    if (!nextParams[name] && value === args[index]) {
+      delete nextParams.args;
+    }
+  }
+  const search = new URLSearchParams();
+  for (const [key, value] of Object.entries(nextParams)) {
+    if (value && key !== "autoRun") search.set(key, value);
+  }
+  const query = search.toString();
+  return query ? `${route}?${query}` : route;
+}
+function apiPathToRoutePath(path) {
+  const cliPath = path.trim().replace(/^\/api\/v1\/?/, "").replace(/^\/+/, "").replace(/\/+$/, "");
+  if (!cliPath) return "/";
+  return `/${cliPath.replace(/\{([^}]+)\}/g, ":$1")}`;
+}
+function pathParamNames(path) {
+  return [...path.matchAll(/\{([^}]+)\}/g)].map((match) => match[1]).filter((name) => Boolean(name));
+}
+function parseArgsParam(value) {
+  if (!value) return [];
+  const trimmed = value.trim();
+  if (!trimmed || trimmed === "[]" || trimmed.toLowerCase() === "null") return [];
+  try {
+    const parsed = JSON.parse(trimmed);
+    if (Array.isArray(parsed)) return parsed.map(String).filter(Boolean);
+  } catch {
+  }
+  return trimmed.split(",").map((part) => part.trim()).filter(Boolean);
+}
+exports.OperationActionDialog = OperationActionDialog;
+//# sourceMappingURL=OperationActionDialog.cjs.map

package/dist/rpc/OperationActionDialog.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperationActionDialog.cjs","sources":["../../src/rpc/OperationActionDialog.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Button } from \"../components/button\";\nimport { Icon } from \"../data/Icon\";\nimport { UiPlay } from \"../icons\";\nimport { Modal } from \"../overlay/Modal\";\nimport { CommandForm } from \"./CommandForm\";\nimport { CommandOutput } from \"./CommandOutput\";\nimport { InlineError } from \"./InlineError\";\nimport type { ExecutionResponse, ResolvedOperation } from \"./types\";\nimport type { OperationsApiClient } from \"./useOperations\";\n\nexport type OperationActionDialogProps = {\n  operation: ResolvedOperation;\n  client: OperationsApiClient;\n  initialValues: Record<string, string>;\n  label: string;\n  defaultAccept?: string;\n  onNavigateAction?: (href: string) => void;\n};\n\nexport function OperationActionDialog({\n  operation,\n  client,\n  initialValues,\n  label,\n  defaultAccept = \"application/clicky+json\",\n  onNavigateAction,\n}: OperationActionDialogProps) {\n  const [open, setOpen] = useState(false);\n  const [isExecuting, setIsExecuting] = useState(false);\n  const [response, setResponse] = useState<ExecutionResponse | null>(null);\n  const [error, setError] = useState<unknown>(null);\n\n  async function handleExecute(params: Record<string, string>, headers: Record<string, string>) {\n    if (onNavigateAction) {\n      const href = hrefForOperationAction(operation.path, params);\n      if (!href) return;\n      const separator = href.includes(\"?\") ? \"&\" : \"?\";\n      onNavigateAction(`${href}${separator}autoRun=1`);\n      return;\n    }\n\n    setIsExecuting(true);\n    setError(null);\n    setResponse(null);\n    try {\n      const result = await client.executeCommand(operation.path, operation.method, params, headers);\n      setResponse(result);\n    } catch (err) {\n      setError(err);\n    } finally {\n      setIsExecuting(false);\n    }\n  }\n\n  return (\n    <>\n      <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={() => setOpen(true)}>\n        <Icon icon={UiPlay} />\n        {label}\n      </Button>\n      <Modal open={open} onClose={() => setOpen(false)} title={label} size=\"lg\">\n        <div className=\"space-y-4\">\n          <CommandForm\n            parameters={operation.operation.parameters ?? []}\n            onExecute={handleExecute}\n            isPending={isExecuting}\n            method={operation.method}\n            path={operation.path}\n            accept={defaultAccept}\n            initialValues={initialValues}\n          />\n\n          {error ? (\n            <InlineError title={`Failed to execute ${operation.path}`} error={error} />\n          ) : response ? (\n            <CommandOutput response={response} />\n          ) : null}\n        </div>\n      </Modal>\n    </>\n  );\n}\n\nfunction hrefForOperationAction(path: string, params: Record<string, string>): string | undefined {\n  const nextParams = { ...params };\n  const args = parseArgsParam(params.args);\n  let route = apiPathToRoutePath(path);\n\n  for (const [index, name] of pathParamNames(path).entries()) {\n    const value = nextParams[name] || args[index];\n    if (!value) return undefined;\n    route = route.replace(`:${name}`, encodeURIComponent(value));\n    delete nextParams[name];\n    if (!nextParams[name] && value === args[index]) {\n      delete nextParams.args;\n    }\n  }\n\n  const search = new URLSearchParams();\n  for (const [key, value] of Object.entries(nextParams)) {\n    if (value && key !== \"autoRun\") search.set(key, value);\n  }\n  const query = search.toString();\n  return query ? `${route}?${query}` : route;\n}\n\nfunction apiPathToRoutePath(path: string): string {\n  const cliPath = path\n    .trim()\n    .replace(/^\\/api\\/v1\\/?/, \"\")\n    .replace(/^\\/+/, \"\")\n    .replace(/\\/+$/, \"\");\n  if (!cliPath) return \"/\";\n  return `/${cliPath.replace(/\\{([^}]+)\\}/g, \":$1\")}`;\n}\n\nfunction pathParamNames(path: string): string[] {\n  return [...path.matchAll(/\\{([^}]+)\\}/g)]\n    .map((match) => match[1])\n    .filter((name): name is string => Boolean(name));\n}\n\nfunction parseArgsParam(value: string | undefined): string[] {\n  if (!value) return [];\n  const trimmed = value.trim();\n  if (!trimmed || trimmed === \"[]\" || trimmed.toLowerCase() === \"null\") return [];\n  try {\n    const parsed = JSON.parse(trimmed);\n    if (Array.isArray(parsed)) return parsed.map(String).filter(Boolean);\n  } catch {\n    // Fall back to comma-delimited args below.\n  }\n  return trimmed\n    .split(\",\")\n    .map((part) => part.trim())\n    .filter(Boolean);\n}\n"],"names":["useState","jsxs","Fragment","Button","jsx","Icon","UiPlay","Modal","CommandForm","InlineError","CommandOutput"],"mappings":"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"}

package/dist/rpc/OperationActionDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OperationActionDialog.d.ts","sourceRoot":"","sources":["../../src/rpc/OperationActionDialog.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAqB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACpE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,MAAM,MAAM,0BAA0B,GAAG;IACvC,SAAS,EAAE,iBAAiB,CAAC;IAC7B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,EACpC,SAAS,EACT,MAAM,EACN,aAAa,EACb,KAAK,EACL,aAAyC,EACzC,gBAAgB,GACjB,EAAE,0BAA0B,2CAuD5B"}
+{"version":3,"file":"OperationActionDialog.d.ts","sourceRoot":"","sources":["../../src/rpc/OperationActionDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAqB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACpE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,MAAM,MAAM,0BAA0B,GAAG;IACvC,SAAS,EAAE,iBAAiB,CAAC;IAC7B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,EACpC,SAAS,EACT,MAAM,EACN,aAAa,EACb,KAAK,EACL,aAAyC,EACzC,gBAAgB,GACjB,EAAE,0BAA0B,2CAuD5B"}

package/dist/rpc/OperationActionDialog.js

@@ -6,6 +6,7 @@ import { Modal } from "../overlay/Modal.js";
 import { CommandForm } from "./CommandForm.js";
 import { CommandOutput } from "./CommandOutput.js";
 import { InlineError } from "./InlineError.js";
+import { UiPlay } from "../icons/components/UiPlay.js";
 function OperationActionDialog({
   operation,
   client,
@@ -40,7 +41,7 @@ function OperationActionDialog({
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(true), children: [
-      /* @__PURE__ */ jsx(Icon, { name: "codicon:play" }),
+      /* @__PURE__ */ jsx(Icon, { icon: UiPlay }),
       label
     ] }),
     /* @__PURE__ */ jsx(Modal, { open, onClose: () => setOpen(false), title: label, size: "lg", children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [

package/dist/rpc/OperationActionDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"OperationActionDialog.js","sources":["../../src/rpc/OperationActionDialog.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Button } from \"../components/button\";\nimport { Icon } from \"../data/Icon\";\nimport { Modal } from \"../overlay/Modal\";\nimport { CommandForm } from \"./CommandForm\";\nimport { CommandOutput } from \"./CommandOutput\";\nimport { InlineError } from \"./InlineError\";\nimport type { ExecutionResponse, ResolvedOperation } from \"./types\";\nimport type { OperationsApiClient } from \"./useOperations\";\n\nexport type OperationActionDialogProps = {\n  operation: ResolvedOperation;\n  client: OperationsApiClient;\n  initialValues: Record<string, string>;\n  label: string;\n  defaultAccept?: string;\n  onNavigateAction?: (href: string) => void;\n};\n\nexport function OperationActionDialog({\n  operation,\n  client,\n  initialValues,\n  label,\n  defaultAccept = \"application/clicky+json\",\n  onNavigateAction,\n}: OperationActionDialogProps) {\n  const [open, setOpen] = useState(false);\n  const [isExecuting, setIsExecuting] = useState(false);\n  const [response, setResponse] = useState<ExecutionResponse | null>(null);\n  const [error, setError] = useState<unknown>(null);\n\n  async function handleExecute(params: Record<string, string>, headers: Record<string, string>) {\n    if (onNavigateAction) {\n      const href = hrefForOperationAction(operation.path, params);\n      if (!href) return;\n      const separator = href.includes(\"?\") ? \"&\" : \"?\";\n      onNavigateAction(`${href}${separator}autoRun=1`);\n      return;\n    }\n\n    setIsExecuting(true);\n    setError(null);\n    setResponse(null);\n    try {\n      const result = await client.executeCommand(operation.path, operation.method, params, headers);\n      setResponse(result);\n    } catch (err) {\n      setError(err);\n    } finally {\n      setIsExecuting(false);\n    }\n  }\n\n  return (\n    <>\n      <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={() => setOpen(true)}>\n        <Icon name=\"codicon:play\" />\n        {label}\n      </Button>\n      <Modal open={open} onClose={() => setOpen(false)} title={label} size=\"lg\">\n        <div className=\"space-y-4\">\n          <CommandForm\n            parameters={operation.operation.parameters ?? []}\n            onExecute={handleExecute}\n            isPending={isExecuting}\n            method={operation.method}\n            path={operation.path}\n            accept={defaultAccept}\n            initialValues={initialValues}\n          />\n\n          {error ? (\n            <InlineError title={`Failed to execute ${operation.path}`} error={error} />\n          ) : response ? (\n            <CommandOutput response={response} />\n          ) : null}\n        </div>\n      </Modal>\n    </>\n  );\n}\n\nfunction hrefForOperationAction(path: string, params: Record<string, string>): string | undefined {\n  const nextParams = { ...params };\n  const args = parseArgsParam(params.args);\n  let route = apiPathToRoutePath(path);\n\n  for (const [index, name] of pathParamNames(path).entries()) {\n    const value = nextParams[name] || args[index];\n    if (!value) return undefined;\n    route = route.replace(`:${name}`, encodeURIComponent(value));\n    delete nextParams[name];\n    if (!nextParams[name] && value === args[index]) {\n      delete nextParams.args;\n    }\n  }\n\n  const search = new URLSearchParams();\n  for (const [key, value] of Object.entries(nextParams)) {\n    if (value && key !== \"autoRun\") search.set(key, value);\n  }\n  const query = search.toString();\n  return query ? `${route}?${query}` : route;\n}\n\nfunction apiPathToRoutePath(path: string): string {\n  const cliPath = path\n    .trim()\n    .replace(/^\\/api\\/v1\\/?/, \"\")\n    .replace(/^\\/+/, \"\")\n    .replace(/\\/+$/, \"\");\n  if (!cliPath) return \"/\";\n  return `/${cliPath.replace(/\\{([^}]+)\\}/g, \":$1\")}`;\n}\n\nfunction pathParamNames(path: string): string[] {\n  return [...path.matchAll(/\\{([^}]+)\\}/g)]\n    .map((match) => match[1])\n    .filter((name): name is string => Boolean(name));\n}\n\nfunction parseArgsParam(value: string | undefined): string[] {\n  if (!value) return [];\n  const trimmed = value.trim();\n  if (!trimmed || trimmed === \"[]\" || trimmed.toLowerCase() === \"null\") return [];\n  try {\n    const parsed = JSON.parse(trimmed);\n    if (Array.isArray(parsed)) return parsed.map(String).filter(Boolean);\n  } catch {\n    // Fall back to comma-delimited args below.\n  }\n  return trimmed\n    .split(\",\")\n    .map((part) => part.trim())\n    .filter(Boolean);\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"OperationActionDialog.js","sources":["../../src/rpc/OperationActionDialog.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Button } from \"../components/button\";\nimport { Icon } from \"../data/Icon\";\nimport { UiPlay } from \"../icons\";\nimport { Modal } from \"../overlay/Modal\";\nimport { CommandForm } from \"./CommandForm\";\nimport { CommandOutput } from \"./CommandOutput\";\nimport { InlineError } from \"./InlineError\";\nimport type { ExecutionResponse, ResolvedOperation } from \"./types\";\nimport type { OperationsApiClient } from \"./useOperations\";\n\nexport type OperationActionDialogProps = {\n  operation: ResolvedOperation;\n  client: OperationsApiClient;\n  initialValues: Record<string, string>;\n  label: string;\n  defaultAccept?: string;\n  onNavigateAction?: (href: string) => void;\n};\n\nexport function OperationActionDialog({\n  operation,\n  client,\n  initialValues,\n  label,\n  defaultAccept = \"application/clicky+json\",\n  onNavigateAction,\n}: OperationActionDialogProps) {\n  const [open, setOpen] = useState(false);\n  const [isExecuting, setIsExecuting] = useState(false);\n  const [response, setResponse] = useState<ExecutionResponse | null>(null);\n  const [error, setError] = useState<unknown>(null);\n\n  async function handleExecute(params: Record<string, string>, headers: Record<string, string>) {\n    if (onNavigateAction) {\n      const href = hrefForOperationAction(operation.path, params);\n      if (!href) return;\n      const separator = href.includes(\"?\") ? \"&\" : \"?\";\n      onNavigateAction(`${href}${separator}autoRun=1`);\n      return;\n    }\n\n    setIsExecuting(true);\n    setError(null);\n    setResponse(null);\n    try {\n      const result = await client.executeCommand(operation.path, operation.method, params, headers);\n      setResponse(result);\n    } catch (err) {\n      setError(err);\n    } finally {\n      setIsExecuting(false);\n    }\n  }\n\n  return (\n    <>\n      <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={() => setOpen(true)}>\n        <Icon icon={UiPlay} />\n        {label}\n      </Button>\n      <Modal open={open} onClose={() => setOpen(false)} title={label} size=\"lg\">\n        <div className=\"space-y-4\">\n          <CommandForm\n            parameters={operation.operation.parameters ?? []}\n            onExecute={handleExecute}\n            isPending={isExecuting}\n            method={operation.method}\n            path={operation.path}\n            accept={defaultAccept}\n            initialValues={initialValues}\n          />\n\n          {error ? (\n            <InlineError title={`Failed to execute ${operation.path}`} error={error} />\n          ) : response ? (\n            <CommandOutput response={response} />\n          ) : null}\n        </div>\n      </Modal>\n    </>\n  );\n}\n\nfunction hrefForOperationAction(path: string, params: Record<string, string>): string | undefined {\n  const nextParams = { ...params };\n  const args = parseArgsParam(params.args);\n  let route = apiPathToRoutePath(path);\n\n  for (const [index, name] of pathParamNames(path).entries()) {\n    const value = nextParams[name] || args[index];\n    if (!value) return undefined;\n    route = route.replace(`:${name}`, encodeURIComponent(value));\n    delete nextParams[name];\n    if (!nextParams[name] && value === args[index]) {\n      delete nextParams.args;\n    }\n  }\n\n  const search = new URLSearchParams();\n  for (const [key, value] of Object.entries(nextParams)) {\n    if (value && key !== \"autoRun\") search.set(key, value);\n  }\n  const query = search.toString();\n  return query ? `${route}?${query}` : route;\n}\n\nfunction apiPathToRoutePath(path: string): string {\n  const cliPath = path\n    .trim()\n    .replace(/^\\/api\\/v1\\/?/, \"\")\n    .replace(/^\\/+/, \"\")\n    .replace(/\\/+$/, \"\");\n  if (!cliPath) return \"/\";\n  return `/${cliPath.replace(/\\{([^}]+)\\}/g, \":$1\")}`;\n}\n\nfunction pathParamNames(path: string): string[] {\n  return [...path.matchAll(/\\{([^}]+)\\}/g)]\n    .map((match) => match[1])\n    .filter((name): name is string => Boolean(name));\n}\n\nfunction parseArgsParam(value: string | undefined): string[] {\n  if (!value) return [];\n  const trimmed = value.trim();\n  if (!trimmed || trimmed === \"[]\" || trimmed.toLowerCase() === \"null\") return [];\n  try {\n    const parsed = JSON.parse(trimmed);\n    if (Array.isArray(parsed)) return parsed.map(String).filter(Boolean);\n  } catch {\n    // Fall back to comma-delimited args below.\n  }\n  return trimmed\n    .split(\",\")\n    .map((part) => part.trim())\n    .filter(Boolean);\n}\n"],"names":[],"mappings":"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"}

package/dist/rpc/OperationCatalog.cjs

@@ -0,0 +1,342 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const reactQuery = require("@tanstack/react-query");
+const button = require("../components/button.cjs");
+const Icon = require("../data/Icon.cjs");
+const MethodBadge = require("../data/MethodBadge.cjs");
+const Modal = require("../overlay/Modal.cjs");
+const classify = require("./classify.cjs");
+const clickyMetadata = require("./clickyMetadata.cjs");
+const EndpointList = require("./EndpointList.cjs");
+const ExecutionResult = require("./ExecutionResult.cjs");
+const FilterForm = require("./FilterForm.cjs");
+const types = require("./types.cjs");
+const useOperations = require("./useOperations.cjs");
+const formMetadata = require("./formMetadata.cjs");
+const UiTable = require("../icons/components/UiTable.cjs");
+const UiListFlat = require("../icons/components/UiListFlat.cjs");
+const UiAdd = require("../icons/components/UiAdd.cjs");
+const defaultCommandHref = (operationId) => `/commands/${operationId}`;
+function defaultRenderError(err, title) {
+  const message = err instanceof Error ? err.message : String(err ?? "");
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl border border-destructive/40 bg-destructive/5 p-4 text-sm text-destructive", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: title }),
+    message && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 whitespace-pre-wrap text-xs opacity-80", children: message })
+  ] });
+}
+function OperationCatalog({
+  definition,
+  entities,
+  client,
+  renderLink,
+  allOperations = false,
+  operationIdPrefix,
+  listOperationId,
+  surfaceKey,
+  getCommandHref = defaultCommandHref,
+  renderError = defaultRenderError,
+  kind,
+  commandRuntime
+}) {
+  const { operations, isLoading } = useOperations.useOperations(client);
+  const [view, setView] = react.useState("table");
+  const [activeAction, setActiveAction] = react.useState(null);
+  const [actionResult, setActionResult] = react.useState(null);
+  const [actionError, setActionError] = react.useState("");
+  const [isExecutingAction, setIsExecutingAction] = react.useState(false);
+  const surfaceOps = react.useMemo(
+    () => clickyMetadata.filterOperationsBySurface(operations, surfaceKey),
+    [operations, surfaceKey]
+  );
+  const useSurfaceMetadata = surfaceOps.length > 0;
+  const domainOps = react.useMemo(() => {
+    if (useSurfaceMetadata) {
+      return surfaceOps;
+    }
+    return (allOperations ? operations : classify.filterOperationsByDomain(operations, entities)).filter(
+      (op) => operationIdPrefix ? (op.operation.operationId ?? "").startsWith(operationIdPrefix) : true
+    );
+  }, [allOperations, entities, operationIdPrefix, operations, surfaceOps, useSurfaceMetadata]);
+  const listEndpoint = react.useMemo(() => {
+    if (useSurfaceMetadata) {
+      return clickyMetadata.findSurfaceListOperation(domainOps, surfaceKey);
+    }
+    return listOperationId ? domainOps.find((op) => op.method === "get" && op.operation.operationId === listOperationId) : classify.findListEndpoint(domainOps, entities);
+  }, [domainOps, entities, listOperationId, surfaceKey, useSurfaceMetadata]);
+  const [filters, setFilters] = react.useState(() => readFiltersFromUrl());
+  const listParameters = (listEndpoint == null ? void 0 : listEndpoint.operation.parameters) ?? [];
+  react.useEffect(() => {
+    writeFiltersToUrl(filters);
+  }, [filters]);
+  const listQuery = reactQuery.useQuery({
+    queryKey: ["operation-list", listEndpoint == null ? void 0 : listEndpoint.method, listEndpoint == null ? void 0 : listEndpoint.path, filters],
+    queryFn: () => client.executeCommand(
+      listEndpoint.path,
+      listEndpoint.method,
+      formMetadata.packParameterValues(filters, listEndpoint.operation.parameters ?? []),
+      {
+        Accept: "application/json+clicky"
+      }
+    ),
+    enabled: !!listEndpoint && view === "table",
+    staleTime: 3e4,
+    retry: 0
+  });
+  const lookupQuery = reactQuery.useQuery({
+    queryKey: ["operation-lookup", listEndpoint == null ? void 0 : listEndpoint.method, listEndpoint == null ? void 0 : listEndpoint.path, filters],
+    queryFn: async () => {
+      var _a;
+      return await ((_a = client.lookupFilters) == null ? void 0 : _a.call(
+        client,
+        listEndpoint.path,
+        listEndpoint.method,
+        formMetadata.packParameterValues(filters, listParameters),
+        { Accept: "application/json+clicky" }
+      )) ?? { filters: {} };
+    },
+    enabled: !!listEndpoint && view === "table" && !!client.lookupFilters,
+    staleTime: 3e4,
+    retry: 0
+  });
+  const actionOps = react.useMemo(() => {
+    if (useSurfaceMetadata) {
+      return clickyMetadata.findSurfaceCollectionActions(domainOps, surfaceKey);
+    }
+    return domainOps.filter(
+      (op) => {
+        var _a;
+        return op.method !== "get" && !op.path.includes("{") && !((_a = op.operation.parameters) == null ? void 0 : _a.some((p) => p.in === "path" || types.isPositionalParam(p)));
+      }
+    );
+  }, [domainOps, surfaceKey, useSurfaceMetadata]);
+  const filterBarConfig = react.useMemo(() => {
+    const options = {
+      includeLocations: ["query"]
+    };
+    if (lookupQuery.data != null) {
+      options.lookup = lookupQuery.data;
+    }
+    return formMetadata.parametersToFormConfig(listParameters, filters, setFilters, options);
+  }, [filters, listParameters, lookupQuery.data]);
+  const hasTable = !!listEndpoint;
+  const showTable = hasTable && view === "table";
+  const sectionLabel = kind === "configuration" || definition.key.startsWith("config-") ? "Configuration" : "Operations";
+  const activeActionMeta = activeAction ? clickyMetadata.getOperationClickyMeta(activeAction) : void 0;
+  const actionLockedValues = react.useMemo(() => {
+    const meta = activeActionMeta;
+    if (!activeAction || meta == null || !meta.supportsFilterMode) {
+      return {};
+    }
+    const locked = {};
+    for (const param of activeAction.operation.parameters ?? []) {
+      const value = filters[param.name];
+      if (param.in === "query" && value) {
+        locked[param.name] = value;
+      }
+    }
+    if (meta.idParam) {
+      locked[meta.idParam] = "all";
+    }
+    if ((activeAction.operation.parameters ?? []).some((param) => param.name === "filter")) {
+      locked.filter = Object.entries(filters).filter(([, value]) => value).map(([key, value]) => `${key}=${value}`).join(", ") || "current list filters";
+    }
+    return locked;
+  }, [activeAction, activeActionMeta, filters]);
+  async function executeAction(values) {
+    if (!activeAction) return;
+    setIsExecutingAction(true);
+    setActionError("");
+    try {
+      const response = await client.executeCommand(
+        activeAction.path,
+        activeAction.method,
+        formMetadata.packParameterValues(values, activeAction.operation.parameters ?? []),
+        { Accept: "application/json+clicky" }
+      );
+      setActionResult(response);
+      await listQuery.refetch();
+    } catch (err) {
+      setActionResult(null);
+      setActionError(err instanceof Error ? err.message : String(err ?? "Unknown error"));
+    } finally {
+      setIsExecutingAction(false);
+    }
+  }
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(SkeletonBlock, { className: "h-10 w-72" }),
+      /* @__PURE__ */ jsxRuntime.jsx(SkeletonBlock, { className: "h-4 w-[32rem]" }),
+      Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(SkeletonBlock, { className: "h-12" }, i))
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs uppercase tracking-[0.18em] text-muted-foreground", children: sectionLabel }),
+        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: definition.title }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 max-w-2xl text-sm text-muted-foreground", children: definition.description })
+      ] }),
+      hasTable && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1 rounded-lg border p-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            type: "button",
+            variant: view === "table" ? "secondary" : "ghost",
+            size: "sm",
+            className: "h-7 w-7 p-0",
+            "aria-label": "Table view",
+            "aria-pressed": view === "table",
+            onClick: () => setView("table"),
+            children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiTable.UiTable })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            type: "button",
+            variant: view === "endpoints" ? "secondary" : "ghost",
+            size: "sm",
+            className: "h-7 w-7 p-0",
+            "aria-label": "Endpoint list view",
+            "aria-pressed": view === "endpoints",
+            onClick: () => setView("endpoints"),
+            children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiListFlat.UiListFlat })
+          }
+        )
+      ] })
+    ] }),
+    actionOps.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: actionOps.map((op) => {
+      var _a;
+      const commandName = op.operation.operationId || op.path;
+      const tooltip = op.operation.description ? `${commandName} — ${op.operation.description}` : commandName;
+      if (useSurfaceMetadata) {
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          button.Button,
+          {
+            type: "button",
+            variant: "outline",
+            size: "sm",
+            title: tooltip,
+            onClick: () => {
+              setActiveAction(op);
+              setActionResult(null);
+              setActionError("");
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiAdd.UiAdd, className: "text-xs" }),
+              op.operation.summary || ((_a = clickyMetadata.getOperationClickyMeta(op)) == null ? void 0 : _a.actionName) || commandName
+            ]
+          },
+          `${op.method}:${op.path}`
+        );
+      }
+      return renderLink({
+        key: `${op.method}:${op.path}`,
+        to: getCommandHref(op.operation.operationId ?? commandName, op),
+        title: tooltip,
+        className: "inline-flex items-center gap-1.5 rounded-lg border px-3 py-1.5 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground",
+        children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiAdd.UiAdd, className: "text-xs" }),
+          op.operation.summary || commandName
+        ] })
+      });
+    }) }),
+    showTable ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: listQuery.isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
+      ExecutionResult.ExecutionResult,
+      {
+        loading: true,
+        loadingMessage: `Loading ${definition.title} results…`,
+        emptyMessage: "No records returned",
+        ariaLabel: `${definition.title} results`,
+        className: "mt-0"
+      }
+    ) : listQuery.isError ? renderError(listQuery.error, `Failed to load ${(listEndpoint == null ? void 0 : listEndpoint.path) ?? ""}`) : listQuery.data ? /* @__PURE__ */ jsxRuntime.jsx(
+      ExecutionResult.ExecutionResult,
+      {
+        response: listQuery.data,
+        emptyMessage: "No records returned",
+        ariaLabel: `${definition.title} results`,
+        className: "mt-0",
+        ...commandRuntime ? { commandRuntime } : {},
+        ...filterBarConfig.search ? { search: filterBarConfig.search } : {},
+        ...filterBarConfig.timeRange ? { timeRange: filterBarConfig.timeRange } : {},
+        ...filterBarConfig.filters.length > 0 ? { externalFilters: filterBarConfig.filters } : {}
+      }
+    ) : null }) : /* @__PURE__ */ jsxRuntime.jsx(
+      EndpointList.EndpointList,
+      {
+        operations: domainOps,
+        definition,
+        renderLink,
+        getCommandHref
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Modal.Modal,
+      {
+        open: activeAction != null,
+        onClose: () => setActiveAction(null),
+        title: (activeAction == null ? void 0 : activeAction.operation.summary) || (activeActionMeta == null ? void 0 : activeActionMeta.actionName) || (activeAction == null ? void 0 : activeAction.operation.operationId) || "Action",
+        size: "lg",
+        children: activeAction && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(MethodBadge.MethodBadge, { method: activeAction.method }),
+            /* @__PURE__ */ jsxRuntime.jsx("code", { className: "rounded-md bg-muted px-2 py-1 text-sm", children: activeAction.path })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            FilterForm.FilterForm,
+            {
+              client,
+              path: activeAction.path,
+              method: activeAction.method,
+              parameters: activeAction.operation.parameters ?? [],
+              lockedValues: actionLockedValues,
+              enableLookup: Boolean(activeActionMeta == null ? void 0 : activeActionMeta.supportsLookup),
+              submitLabel: "Execute request",
+              submittingLabel: "Executing…",
+              isSubmitting: isExecutingAction,
+              onSubmit: executeAction
+            }
+          ),
+          actionError ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-md border border-destructive/40 bg-destructive/5 p-3 text-sm text-destructive", children: actionError }) : actionResult ? /* @__PURE__ */ jsxRuntime.jsx(
+            ExecutionResult.ExecutionResult,
+            {
+              response: actionResult,
+              className: "mt-0",
+              ...commandRuntime ? { commandRuntime } : {}
+            }
+          ) : null
+        ] })
+      }
+    )
+  ] });
+}
+function readFiltersFromUrl() {
+  if (typeof window === "undefined") return {};
+  const search = new URLSearchParams(window.location.search);
+  const values = {};
+  for (const [key, value] of search.entries()) {
+    if (key.startsWith("__")) continue;
+    if (value !== "") values[key] = value;
+  }
+  return values;
+}
+function SkeletonBlock({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `animate-pulse rounded-md bg-muted ${className ?? ""}`.trim() });
+}
+function writeFiltersToUrl(filters) {
+  if (typeof window === "undefined") return;
+  const search = new URLSearchParams();
+  for (const [key, value] of Object.entries(filters)) {
+    if (value !== "") search.set(key, value);
+  }
+  const query = search.toString();
+  const next = `${window.location.pathname}${query ? `?${query}` : ""}${window.location.hash}`;
+  if (next !== `${window.location.pathname}${window.location.search}${window.location.hash}`) {
+    window.history.replaceState(window.history.state, "", next);
+  }
+}
+exports.OperationCatalog = OperationCatalog;
+//# sourceMappingURL=OperationCatalog.cjs.map