@akanjs/ui 0.0.149 → 0.0.151

package/cjs/Signal/Object.js

@@ -0,0 +1,95 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Object_exports = {};
+__export(Object_exports, {
+  default: () => Object2
+});
+module.exports = __toCommonJS(Object_exports);
+var import_base = require("@akanjs/base");
+var import_common = require("@akanjs/common");
+var import_constant = require("@akanjs/constant");
+var import_next = require("@akanjs/next");
+var import_react = require("react");
+var import_Modal = require("../Modal");
+function Object2() {
+  return /* @__PURE__ */ React.createElement("div", null);
+}
+const ObjectType = ({ objRef, arrDepth, nullable }) => {
+  const isModelType = !(0, import_base.isGqlScalar)(objRef);
+  const refName = (0, import_constant.getGqlTypeStr)(objRef);
+  const [openDetail, setOpenDetail] = (0, import_react.useState)(false);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: isModelType ? "btn btn-sm btn-primary" : "",
+      onClick: () => {
+        if (isModelType)
+          setOpenDetail(true);
+      }
+    },
+    "[".repeat(arrDepth),
+    refName,
+    "]".repeat(arrDepth),
+    nullable ? "" : "!"
+  ), isModelType ? /* @__PURE__ */ React.createElement(
+    import_Modal.Modal,
+    {
+      title: `Model Type - ${refName}`,
+      open: openDetail,
+      onCancel: () => {
+        setOpenDetail(false);
+      }
+    },
+    openDetail ? /* @__PURE__ */ React.createElement(ObjectDetail, { objRef }) : null
+  ) : null);
+};
+Object2.Type = ObjectType;
+const ObjectDetail = ({ objRef }) => {
+  const classMeta = (0, import_constant.getClassMeta)(objRef);
+  const refName = (0, import_common.lowerlize)((0, import_constant.getGqlTypeStr)(objRef));
+  const modelRefName = (0, import_react.useMemo)(
+    () => classMeta.type === "light" ? (0, import_common.lowerlize)(refName.replace("light", "")) : refName.startsWith("summary") ? refName : refName.replace("Summary", "").replace("Insight", "").replace("Input", ""),
+    []
+  );
+  const fieldMetas = (0, import_constant.getFieldMetas)(objRef);
+  const { l } = (0, import_next.usePage)();
+  return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("table", { className: "table" }, /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement("tr", { className: "text-bold" }, /* @__PURE__ */ React.createElement("th", { className: "text-base" }, "Key"), /* @__PURE__ */ React.createElement("th", { className: "text-center text-base" }, "Type"), /* @__PURE__ */ React.createElement("th", { className: "text-center text-base" }, "Field Name"), /* @__PURE__ */ React.createElement("th", { className: "text-center text-base" }, "Description"), /* @__PURE__ */ React.createElement("th", { className: "text-center text-base" }, "Enum"))), fieldMetas.map(({ key, arrDepth, name, nullable, modelRef, isClass, enum: enumOpt, isMap, of }, idx) => /* @__PURE__ */ React.createElement("tbody", { className: "font-normal", key: idx }, /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("td", { className: "" }, key), /* @__PURE__ */ React.createElement("td", { className: "text-center" }, isClass ? /* @__PURE__ */ React.createElement(ObjectType, { objRef: modelRef, arrDepth }) : `${"[".repeat(arrDepth)}${name}${"]".repeat(arrDepth)}${nullable ? "" : "!"}`, isMap ? /* @__PURE__ */ React.createElement(React.Fragment, null, " => ", (() => {
+    const [valueRef, valueArrDepth] = (0, import_base.getNonArrayModel)(of);
+    if ((0, import_base.isGqlClass)(of))
+      return /* @__PURE__ */ React.createElement(ObjectType, { objRef: valueRef, arrDepth: valueArrDepth });
+    else
+      return `${"[".repeat(valueArrDepth)}${import_base.scalarNameMap.get(of)}${"]".repeat(valueArrDepth)}`;
+  })()) : null), /* @__PURE__ */ React.createElement("td", { className: "text-center" }, l.field(modelRefName, key)), /* @__PURE__ */ React.createElement("td", { className: "text-center" }, l.desc(modelRefName, key)), /* @__PURE__ */ React.createElement("td", { className: "flex flex-wrap items-center justify-center gap-2 text-center" }, enumOpt ? enumOpt.map((opt, idx2) => /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      key: idx2,
+      className: "tooltip tooltip-primary",
+      "data-tip": l.enum(modelRefName, key, opt)
+    },
+    /* @__PURE__ */ React.createElement("button", { className: "btn btn-xs" }, opt)
+  )) : "-"))))));
+};
+Object2.Detail = ObjectDetail;
+const ObjectSchema = ({ objRef }) => {
+  const { l } = (0, import_next.usePage)();
+  const classMeta = (0, import_constant.getClassMeta)(objRef);
+  const refName = (0, import_common.lowerlize)(classMeta.refName);
+  return /* @__PURE__ */ React.createElement("div", { className: "flex break-after-page flex-col gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "mt-24" }), /* @__PURE__ */ React.createElement("div", { className: "text-3xl font-bold" }, refName), /* @__PURE__ */ React.createElement("div", { className: "mb-5" }, " - ", l.field(refName, "modelDesc")), /* @__PURE__ */ React.createElement("div", { className: "text-2xl font-bold" }, "Schema"), /* @__PURE__ */ React.createElement(ObjectDetail, { objRef }));
+};
+Object2.Schema = ObjectSchema;

package/cjs/Signal/PubSub.js

@@ -0,0 +1,191 @@
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var PubSub_exports = {};
+__export(PubSub_exports, {
+  default: () => PubSub
+});
+module.exports = __toCommonJS(PubSub_exports);
+var import_base = require("@akanjs/base");
+var import_common = require("@akanjs/common");
+var import_constant = require("@akanjs/constant");
+var import_next = require("@akanjs/next");
+var import_signal = require("@akanjs/signal");
+var import_store = require("@akanjs/store");
+var import_react = require("react");
+var import_ai = require("react-icons/ai");
+var import_bi = require("react-icons/bi");
+var import_Arg = __toESM(require("./Arg"));
+var import_Listener = __toESM(require("./Listener"));
+var import_Object = __toESM(require("./Object"));
+var import_Response = __toESM(require("./Response"));
+function PubSub() {
+  return /* @__PURE__ */ React.createElement("div", null);
+}
+const PubSubEndpoint = ({ sigRef, gqlMeta, open }) => {
+  const { l } = (0, import_next.usePage)();
+  const sigMeta = (0, import_signal.getSigMeta)(sigRef);
+  const [viewStatus, setViewStatus] = (0, import_react.useState)("doc");
+  const [argMetas] = (0, import_signal.getArgMetas)(sigRef, gqlMeta.key);
+  const gqlArgMetas = argMetas.filter((argMeta) => argMeta.type !== "Upload");
+  const uploadArgMetas = argMetas.filter((argMeta) => argMeta.type === "Upload");
+  return /* @__PURE__ */ React.createElement("div", { className: "collapse-arrow bg-base-300 collapse my-1" }, /* @__PURE__ */ React.createElement("input", { type: "checkbox", checked: open }), /* @__PURE__ */ React.createElement("div", { className: "collapse-title text-xl" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React.createElement("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "Pubsub" ? "btn-info" : "btn-warning"}` }, gqlMeta.type), gqlMeta.key, " ", /* @__PURE__ */ React.createElement("span", { className: "text-sm" }, "(", l.api(sigMeta.refName, gqlMeta.key), ")"))), /* @__PURE__ */ React.createElement("div", { className: "collapse-content bg-base-200 w-full" }, /* @__PURE__ */ React.createElement("div", { className: "mt-4 text-lg" }, "Description", /* @__PURE__ */ React.createElement("hr", { className: "my-2 border-[0.1px] border-gray-400" }), gqlMeta.guards.some((guard) => guard !== "None") ? /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal" }, "- Guards:", gqlMeta.guards.map((guard) => /* @__PURE__ */ React.createElement(
+    "span",
+    {
+      className: `badge ${guard === "Public" ? "badge-success" : guard === "SuperAdmin" ? "badge-error" : guard === "Admin" ? "badge-error" : guard === "User" ? "badge-accent" : guard === "Owner" ? "badge-accent" : guard === "Every" ? "badge-warning" : ""}`,
+      key: guard
+    },
+    guard
+  ))) : null, /* @__PURE__ */ React.createElement("div", { className: "pb-3 pl-3 text-base font-normal" }, "- ", l.apidesc(sigMeta.refName, gqlMeta.key))), /* @__PURE__ */ React.createElement("div", { className: "my-4 flex w-full gap-5 px-5" }, /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      onClick: () => {
+        setViewStatus("doc");
+      },
+      className: `btn btn-success w-1/2 ${viewStatus === "doc" ? "" : "btn-outline"}`
+    },
+    /* @__PURE__ */ React.createElement(import_ai.AiOutlineFileWord, { className: "text-xl" }),
+    " View Doc"
+  ), /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      onClick: () => {
+        setViewStatus("test");
+      },
+      className: `btn btn-primary w-1/2 ${viewStatus === "test" ? "" : "btn-outline"}`
+    },
+    /* @__PURE__ */ React.createElement(import_bi.BiSolidNetworkChart, { className: "text-xl" }),
+    " PubSub"
+  )), viewStatus === "doc" ? /* @__PURE__ */ React.createElement(
+    PubSubInterface,
+    {
+      sigRef,
+      gqlMeta,
+      gqlArgMetas,
+      uploadArgMetas
+    }
+  ) : /* @__PURE__ */ React.createElement(PubSubTry, { sigRef, gqlMeta, gqlArgMetas, uploadArgMetas })));
+};
+PubSub.Endpoint = PubSubEndpoint;
+const PubSubInterface = ({ sigRef, gqlMeta, gqlArgMetas, uploadArgMetas }) => {
+  const sigMeta = (0, import_signal.getSigMeta)(sigRef);
+  const [returnRef, arrDepth] = (0, import_base.getNonArrayModel)(gqlMeta.returns());
+  const isReturnModelType = !(0, import_base.isGqlScalar)(returnRef);
+  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-4" }, uploadArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Form data upload"), /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ React.createElement(import_Arg.default.Table, { sigMeta, gqlMeta, argMetas: uploadArgMetas }))) : null, gqlArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Variables"), /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ React.createElement(import_Arg.default.Table, { sigMeta, gqlMeta, argMetas: gqlArgMetas }))) : null, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-bold" }, /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-2 rounded-md font-normal md:flex-row" }, /* @__PURE__ */ React.createElement("div", { className: "w-full md:w-1/2" }, "Response Type", /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 max-h-[500px] overflow-auto rounded-md p-4 md:h-[500px]" }, "Returns: ", /* @__PURE__ */ React.createElement(import_Object.default.Type, { objRef: returnRef, arrDepth }), isReturnModelType ? /* @__PURE__ */ React.createElement(import_Object.default.Detail, { objRef: returnRef }) : null)), /* @__PURE__ */ React.createElement("div", { className: "w-full md:w-1/2" }, "Response Example", /* @__PURE__ */ React.createElement(import_Response.default.Example, { sigRef, gqlMeta })))));
+};
+PubSub.Interface = PubSubInterface;
+const PubSubTry = ({ sigRef, gqlMeta, gqlArgMetas, uploadArgMetas }) => {
+  const tryJwt = import_store.st.use.tryJwt();
+  const [modelRef, arrDepth] = (0, import_base.getNonArrayModel)(gqlMeta.returns());
+  const isScalar = (0, import_base.isGqlScalar)(modelRef);
+  const returnRef = isScalar || !arrDepth ? modelRef : (0, import_constant.getLightModelRef)(modelRef);
+  const requestExample = (0, import_react.useMemo)(() => JSON.stringify((0, import_signal.makeRequestExample)(sigRef, gqlMeta.key), null, 2), []);
+  const [gqlRequest, setGqlRequest] = (0, import_react.useState)(requestExample);
+  const [uploadRequest, setUploadRequest] = (0, import_react.useState)({});
+  const [unsubscribe, setUnsubscribe] = (0, import_react.useState)(null);
+  const [messages, setMessages] = (0, import_react.useState)(null);
+  const [response, setResponse] = (0, import_react.useState)({
+    status: "ready",
+    data: null
+  });
+  const onSubscribe = () => {
+    setResponse({ status: "loading", data: null });
+    const request = { ...JSON.parse(gqlRequest), ...uploadRequest };
+    const argData = [...gqlArgMetas, ...uploadArgMetas].sort((a, b) => a.idx - b.idx).map((argMeta) => request[argMeta.name]);
+    const fetchFn = import_signal.fetch[`subscribe${(0, import_common.capitalize)(gqlMeta.key)}`].bind(import_signal.fetch);
+    setResponse({ status: "loading", data: messages });
+    const unsubscribe2 = fetchFn([...argData], (data) => {
+      setMessages(
+        (prev) => typeof data === "boolean" ? data : typeof data === "string" ? `${prev}
+${data}` : typeof data === "object" ? [
+          ...prev?.length ? [...prev] : [],
+          data
+        ] : data
+      );
+    });
+    setResponse({ status: "listening", data: messages });
+    setUnsubscribe(() => unsubscribe2);
+  };
+  const onUnsubscribe = () => {
+    if (!unsubscribe)
+      return;
+    unsubscribe();
+    setUnsubscribe(null);
+    setResponse({ status: "ready", data: null });
+    setMessages("");
+  };
+  (0, import_react.useEffect)(() => {
+    if (!unsubscribe)
+      return;
+    return () => {
+      onUnsubscribe();
+    };
+  }, [unsubscribe]);
+  return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-4" }, uploadArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Form data uplaod"), uploadArgMetas.map((argMeta) => /* @__PURE__ */ React.createElement(
+    import_Arg.default.FormData,
+    {
+      key: argMeta.name,
+      argMeta,
+      value: uploadRequest[argMeta.name],
+      onChange: (fileList) => {
+        setUploadRequest({ ...uploadRequest, [argMeta.name]: fileList });
+      }
+    }
+  ))) : null, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "grid gap-2 lg:grid-cols-2" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Variables"), /* @__PURE__ */ React.createElement("div", { className: "w-full items-center justify-center" }, /* @__PURE__ */ React.createElement(
+    import_Arg.default.Json,
+    {
+      value: gqlRequest,
+      onChange: (value) => {
+        setGqlRequest(value);
+      }
+    }
+  )))), /* @__PURE__ */ React.createElement("div", { className: "relative flex items-center justify-center gap-2" }, /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      disabled: !!unsubscribe,
+      className: "btn btn-success w-1/2",
+      onClick: () => {
+        onSubscribe();
+      }
+    },
+    /* @__PURE__ */ React.createElement(import_ai.AiOutlineSwap, { className: "-mt-0.5" }),
+    " Subscribe PubSub"
+  ), /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      disabled: !unsubscribe,
+      className: "btn btn-error w-1/2",
+      onClick: () => {
+        onUnsubscribe();
+      }
+    },
+    /* @__PURE__ */ React.createElement(import_ai.AiOutlineDisconnect, { className: "-mt-0.5" }),
+    " Unsubscribe PubSub"
+  ))), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Response"), /* @__PURE__ */ React.createElement(import_Listener.default.Result, { status: response.status, data: messages })));
+};
+PubSub.Try = PubSubTry;

package/cjs/Signal/Request.js

@@ -0,0 +1,38 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Request_exports = {};
+__export(Request_exports, {
+  default: () => Request
+});
+module.exports = __toCommonJS(Request_exports);
+var import_ai = require("react-icons/ai");
+var import_Copy = require("../Copy");
+function Request() {
+  return /* @__PURE__ */ React.createElement("div", null);
+}
+const RequestExample = ({ value }) => {
+  return /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement(
+    "textarea",
+    {
+      className: "bg-base-100 min-h-[300px] w-full rounded-md p-4 text-base",
+      value,
+      onChange: () => true
+    }
+  ), /* @__PURE__ */ React.createElement("div", { className: "absolute top-4 right-4" }, /* @__PURE__ */ React.createElement(import_Copy.Copy, { text: value }, /* @__PURE__ */ React.createElement("button", { className: "btn btn-sm" }, /* @__PURE__ */ React.createElement(import_ai.AiOutlineCopy, null), " Copy"))));
+};
+Request.Example = RequestExample;

package/cjs/Signal/Response.js

@@ -0,0 +1,53 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Response_exports = {};
+__export(Response_exports, {
+  default: () => Response
+});
+module.exports = __toCommonJS(Response_exports);
+var import_signal = require("@akanjs/signal");
+var import_react = require("react");
+var import_ai = require("react-icons/ai");
+var import_Copy = require("../Copy");
+function Response() {
+  return /* @__PURE__ */ React.createElement("div", null);
+}
+const ResponseExample = ({ sigRef, gqlMeta }) => {
+  const example = (0, import_react.useMemo)(() => JSON.stringify((0, import_signal.makeResponseExample)(sigRef, gqlMeta.key), null, 2), []);
+  return /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement(
+    "textarea",
+    {
+      className: "bg-base-100 min-h-[500px] w-full rounded-md p-4 text-base",
+      value: example,
+      onChange: () => true
+    }
+  ), /* @__PURE__ */ React.createElement("div", { className: "absolute top-4 right-4" }, /* @__PURE__ */ React.createElement(import_Copy.Copy, { text: example }, /* @__PURE__ */ React.createElement("button", { className: "btn btn-sm" }, /* @__PURE__ */ React.createElement(import_ai.AiOutlineCopy, null), " Copy"))));
+};
+Response.Example = ResponseExample;
+const ResponseResult = ({ status, data }) => {
+  const dataStr = data ? JSON.stringify(data, null, 2) : "";
+  return /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement(
+    "textarea",
+    {
+      className: `textarea ${status === "loading" ? "textarea-disabled" : status === "success" ? "textarea-success border-success" : status === "error" ? "textarea-error text-error border-error" : ""} bg-base-100 min-h-[300px] w-full rounded-md p-4 text-sm font-normal`,
+      value: dataStr,
+      onChange: () => true
+    }
+  ), status === "loading" ? /* @__PURE__ */ React.createElement("div", { className: "animate-fadeIn absolute inset-0 flex items-center justify-center backdrop-blur-sm" }, /* @__PURE__ */ React.createElement("span", { className: "loading loading-dots loading-lg" })) : status === "idle" ? /* @__PURE__ */ React.createElement(React.Fragment, null) : /* @__PURE__ */ React.createElement("div", { className: "absolute top-4 right-4" }, /* @__PURE__ */ React.createElement(import_Copy.Copy, { text: dataStr }, /* @__PURE__ */ React.createElement("button", { className: "btn btn-sm" }, /* @__PURE__ */ React.createElement(import_ai.AiOutlineCopy, null), " Copy"))));
+};
+Response.Result = ResponseResult;

package/cjs/Signal/RestApi.js

@@ -0,0 +1,255 @@
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var RestApi_exports = {};
+__export(RestApi_exports, {
+  default: () => RestApi
+});
+module.exports = __toCommonJS(RestApi_exports);
+var import_base = require("@akanjs/base");
+var import_constant = require("@akanjs/constant");
+var import_next = require("@akanjs/next");
+var import_signal = require("@akanjs/signal");
+var import_store = require("@akanjs/store");
+var import_react = __toESM(require("react"));
+var import_ai = require("react-icons/ai");
+var import_Copy = require("../Copy");
+var import__ = require(".");
+var import_Arg = __toESM(require("./Arg"));
+var import_Response = __toESM(require("./Response"));
+function RestApi() {
+  return /* @__PURE__ */ import_react.default.createElement("div", null);
+}
+const RestApiEndpoints = ({ refName, endpoints, openAll, httpUri }) => {
+  const sigRefs = (0, import_signal.getSignalRefsOnStorage)(refName);
+  if (!sigRefs.length)
+    return null;
+  const tryRoles = import_store.st.use.tryRoles();
+  const gqlInfos = sigRefs.reduce(
+    (acc, sigRef) => [...acc, ...(0, import_signal.getGqlMetas)(sigRef).map((gqlMeta) => ({ key: gqlMeta.key, gqlMeta, sigRef }))],
+    []
+  ).filter(({ key }) => !endpoints || endpoints.includes(key)).sort((a, b) => a.key > b.key ? 1 : -1).filter(({ gqlMeta }) => gqlMeta.signalOption.onlyFor !== "graphql").filter(({ gqlMeta }) => {
+    if (gqlMeta.type === "Pubsub" || gqlMeta.type === "Message")
+      return false;
+    if (gqlMeta.guards.includes("Public") && tryRoles.includes("Public"))
+      return true;
+    if ((gqlMeta.guards.includes("User") || gqlMeta.guards.includes("Every")) && tryRoles.includes("User"))
+      return true;
+    if ((gqlMeta.guards.includes("Admin") || gqlMeta.guards.includes("Every")) && tryRoles.includes("Admin"))
+      return true;
+    if (gqlMeta.guards.includes("SuperAdmin") && tryRoles.includes("SuperAdmin"))
+      return true;
+    return false;
+  });
+  return /* @__PURE__ */ import_react.default.createElement("div", null, gqlInfos.map(({ gqlMeta, sigRef }, idx) => /* @__PURE__ */ import_react.default.createElement(RestApiEndpoint, { key: idx, sigRef, gqlMeta, open: openAll, httpUri })));
+};
+RestApi.Endpoints = RestApiEndpoints;
+const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
+  const { l } = (0, import_next.usePage)();
+  const sigMeta = (0, import_signal.getSigMeta)(sigRef);
+  const [viewStatus, setViewStatus] = (0, import_react.useState)("doc");
+  const [argMetas] = (0, import_signal.getArgMetas)(sigRef, gqlMeta.key);
+  const queryArgMetas = argMetas.filter((argMeta) => argMeta.type === "Query");
+  const paramArgMetas = argMetas.filter((argMeta) => argMeta.type === "Param");
+  const bodyArgMetas = argMetas.filter((argMeta) => argMeta.type === "Body");
+  const uploadArgMetas = argMetas.filter((argMeta) => argMeta.type === "Upload");
+  const prefix = (0, import_signal.getControllerPrefix)(sigMeta);
+  const path = (0, import_signal.getControllerPath)(gqlMeta, paramArgMetas);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "collapse-arrow bg-base-300 collapse my-1" }, /* @__PURE__ */ import_react.default.createElement("input", { type: "checkbox", checked: open }), /* @__PURE__ */ import_react.default.createElement("div", { className: "collapse-title" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ import_react.default.createElement("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "Query" ? "btn-success" : "btn-accent"}` }, gqlMeta.type === "Query" ? "GET" : "POST"), prefix ? `/${prefix}` : "", "/", path, " ", /* @__PURE__ */ import_react.default.createElement("span", { className: "text-lg" }, "(", l.api(sigMeta.refName, gqlMeta.key), ")"))), /* @__PURE__ */ import_react.default.createElement("div", { className: "collapse-content bg-base-200 w-full" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "mt-4 text-lg" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Description"), /* @__PURE__ */ import_react.default.createElement("hr", { className: "my-2 border-[0.1px] border-gray-400" }), gqlMeta.guards.some((guard) => guard !== "None") ? /* @__PURE__ */ import_react.default.createElement("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal" }, "- Guards:", gqlMeta.guards.map((guard) => /* @__PURE__ */ import_react.default.createElement(
+    "span",
+    {
+      className: `badge ${guard === "Public" ? "badge-success" : guard === "SuperAdmin" ? "badge-error" : guard === "Admin" ? "badge-error" : guard === "User" ? "badge-accent" : guard === "Owner" ? "badge-accent" : guard === "Every" ? "badge-warning" : ""}`,
+      key: guard
+    },
+    guard
+  ))) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pb-3 pl-3 text-base font-normal" }, "- ", l.apidesc(sigMeta.refName, gqlMeta.key))), /* @__PURE__ */ import_react.default.createElement("div", { className: "my-4 flex w-full gap-5 px-5" }, /* @__PURE__ */ import_react.default.createElement(
+    "button",
+    {
+      onClick: () => {
+        setViewStatus("doc");
+      },
+      className: `btn btn-success w-1/2 ${viewStatus === "doc" ? "" : "btn-outline"}`
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_ai.AiOutlineFileWord, { className: "text-xl" }),
+    " View Doc"
+  ), /* @__PURE__ */ import_react.default.createElement(
+    "button",
+    {
+      onClick: () => {
+        setViewStatus("test");
+      },
+      className: `btn btn-primary w-1/2 ${viewStatus === "test" ? "" : "btn-outline"}`
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_ai.AiOutlineApi, { className: "text-xl" }),
+    " Restful API"
+  )), viewStatus === "doc" ? /* @__PURE__ */ import_react.default.createElement(
+    RestApiInterface,
+    {
+      sigRef,
+      gqlMeta,
+      queryArgMetas,
+      paramArgMetas,
+      bodyArgMetas,
+      uploadArgMetas
+    }
+  ) : /* @__PURE__ */ import_react.default.createElement(
+    RestApiTry,
+    {
+      sigRef,
+      gqlMeta,
+      queryArgMetas,
+      paramArgMetas,
+      bodyArgMetas,
+      uploadArgMetas,
+      httpUri
+    }
+  )));
+};
+RestApi.Endpoint = RestApiEndpoint;
+const RestApiInterface = ({
+  sigRef,
+  gqlMeta,
+  queryArgMetas,
+  paramArgMetas,
+  bodyArgMetas,
+  uploadArgMetas
+}) => {
+  const sigMeta = (0, import_signal.getSigMeta)(sigRef);
+  const [returnRef, arrDepth] = (0, import_base.getNonArrayModel)(gqlMeta.returns());
+  const isReturnModelType = !(0, import_base.isGqlScalar)(returnRef);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "flex w-full flex-col gap-4" }, uploadArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Form data upload"), /* @__PURE__ */ import_react.default.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ import_react.default.createElement(import_Arg.default.Table, { sigMeta, gqlMeta, argMetas: uploadArgMetas }))) : null, paramArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Parameters"), /* @__PURE__ */ import_react.default.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ import_react.default.createElement(import_Arg.default.Table, { sigMeta, gqlMeta, argMetas: paramArgMetas }))) : null, queryArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Query"), /* @__PURE__ */ import_react.default.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ import_react.default.createElement(import_Arg.default.Table, { sigMeta, gqlMeta, argMetas: queryArgMetas }))) : null, bodyArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Body"), /* @__PURE__ */ import_react.default.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ import_react.default.createElement(import_Arg.default.Table, { sigMeta, gqlMeta, argMetas: bodyArgMetas }))) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-bold" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "flex w-full flex-col gap-2 rounded-md font-normal md:flex-row" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "w-full md:w-1/2" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Response Type"), /* @__PURE__ */ import_react.default.createElement("div", { className: "bg-base-100 max-h-[500px] overflow-auto rounded-md p-4 md:h-[500px]" }, "Returns: ", /* @__PURE__ */ import_react.default.createElement(import__.Signal.Object.Type, { objRef: returnRef, arrDepth }), isReturnModelType ? /* @__PURE__ */ import_react.default.createElement(import__.Signal.Object.Detail, { objRef: returnRef }) : null)), /* @__PURE__ */ import_react.default.createElement("div", { className: "w-full md:w-1/2" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Response Example"), /* @__PURE__ */ import_react.default.createElement(import_Response.default.Example, { sigRef, gqlMeta })))));
+};
+RestApi.Interface = RestApiInterface;
+const RestApiTry = ({
+  sigRef,
+  gqlMeta,
+  queryArgMetas,
+  paramArgMetas,
+  bodyArgMetas,
+  uploadArgMetas,
+  httpUri = import_base.baseClientEnv.serverHttpUri
+}) => {
+  const sigMeta = (0, import_signal.getSigMeta)(sigRef);
+  const tryJwt = import_store.st.use.tryJwt();
+  const paramExample = (0, import_react.useMemo)(() => (0, import_signal.getExampleData)(paramArgMetas, "restapi"), []);
+  const queryExample = (0, import_react.useMemo)(() => (0, import_signal.getExampleData)(queryArgMetas, "restapi"), []);
+  const bodyExample = (0, import_react.useMemo)(() => JSON.stringify((0, import_signal.getExampleData)(bodyArgMetas, "restapi"), null, 2), []);
+  const [paramRequest, setParamRequest] = (0, import_react.useState)(paramExample);
+  const [queryRequest, setQueryRequest] = (0, import_react.useState)(queryExample);
+  const [bodyRequest, setBodyRequest] = (0, import_react.useState)(bodyExample);
+  const [uploadRequest, setUploadRequest] = (0, import_react.useState)({});
+  const [response, setResponse] = (0, import_react.useState)({
+    status: "idle",
+    data: null
+  });
+  const method = gqlMeta.type === "Query" ? "GET" : "POST";
+  const prefix = (0, import_signal.getControllerPrefix)(sigMeta);
+  const path = (0, import_signal.getControllerPath)(gqlMeta, paramArgMetas);
+  const queryString = new URLSearchParams(
+    Object.fromEntries(
+      queryArgMetas.map((argMeta) => {
+        const value = queryRequest[argMeta.name];
+        if (value === void 0 || value === null || value === "" || Array.isArray(value) && value.length === 0)
+          return null;
+        const [argRef] = (0, import_base.getNonArrayModel)(argMeta.returns());
+        if ((0, import_constant.getGqlTypeStr)(argRef) === "JSON")
+          return [argMeta.name, btoa(value)];
+        return [argMeta.name, value];
+      }).filter((entry) => !!entry)
+    )
+  ).toString();
+  const requestPath = paramArgMetas.reduce(
+    (path2, argMeta) => path2.replace(`:${argMeta.name}`, paramRequest[argMeta.name]),
+    `${prefix ? `/${prefix}` : ""}/${path}`
+  ) + (queryString.length ? `?${queryString}` : "");
+  const requestUrl = `${httpUri}${requestPath}`;
+  const getBody = () => {
+    if (!uploadArgMetas.length)
+      return bodyRequest;
+    const formData = new FormData();
+    const bodyObj = JSON.parse(bodyRequest);
+    bodyArgMetas.forEach((argMeta) => {
+      const value = bodyObj[argMeta.name];
+      if (value === void 0 || value === null || value === "")
+        return null;
+      formData.append(argMeta.name, value);
+    });
+    uploadArgMetas.forEach((argMeta) => {
+      const fileList = uploadRequest[argMeta.name];
+      Array.from(fileList).forEach((file) => {
+        formData.append(argMeta.name, file);
+      });
+    });
+    return formData;
+  };
+  const onSend = async () => {
+    setResponse({ status: "loading", data: null });
+    const res = await fetch(requestUrl, {
+      method,
+      headers: {
+        "Content-Type": uploadArgMetas.length ? "application/form-data" : "application/json",
+        Authorization: `Bearer ${tryJwt}`
+      },
+      ...method === "POST" ? { body: getBody() } : {}
+    });
+    const data = await res.json();
+    setResponse(res.ok ? { status: "success", data } : { status: "error", data });
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "flex w-full flex-col gap-4" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "flex items-center gap-2 text-lg" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Request URL:"), /* @__PURE__ */ import_react.default.createElement(import_Copy.Copy, { text: `${httpUri}${requestPath}` }, /* @__PURE__ */ import_react.default.createElement("button", { className: "btn btn-sm btn-outline" }, requestPath, " ", /* @__PURE__ */ import_react.default.createElement(import_ai.AiOutlineCopy, null)))), uploadArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg" }, "Form data uplaod"), uploadArgMetas.map((argMeta) => /* @__PURE__ */ import_react.default.createElement(
+    import_Arg.default.FormData,
+    {
+      key: argMeta.name,
+      argMeta,
+      value: uploadRequest[argMeta.name],
+      onChange: (fileList) => {
+        setUploadRequest({ ...uploadRequest, [argMeta.name]: fileList });
+      }
+    }
+  ))) : null, paramArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", { className: "border-t border-gray-400 pt-5" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Parameters"), paramArgMetas.map((argMeta, idx) => /* @__PURE__ */ import_react.default.createElement(
+    import_Arg.default.Param,
+    {
+      key: idx,
+      argMeta,
+      value: paramRequest[argMeta.name],
+      onChange: (value) => {
+        setParamRequest({ ...paramRequest, [argMeta.name]: value });
+      }
+    }
+  ))) : null, queryArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Queries"), queryArgMetas.map((argMeta, idx) => /* @__PURE__ */ import_react.default.createElement(
+    import_Arg.default.Query,
+    {
+      key: idx,
+      argMeta,
+      value: queryRequest[argMeta.name] ?? "",
+      onChange: (value) => {
+        setQueryRequest({ ...queryRequest, [argMeta.name]: value });
+      }
+    }
+  ))) : null, bodyArgMetas.length ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg" }, "Body"), /* @__PURE__ */ import_react.default.createElement(import_Arg.default.Json, { value: bodyRequest, onChange: setBodyRequest })) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "border-b border-gray-400 pb-5" }, /* @__PURE__ */ import_react.default.createElement("button", { className: "btn bg-success w-full", onClick: () => void onSend() }, /* @__PURE__ */ import_react.default.createElement(import_ai.AiOutlineSend, { className: "-mt-0.5" }), " Send Request")), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "text-lg font-extrabold" }, "Response"), /* @__PURE__ */ import_react.default.createElement(import_Response.default.Result, { status: response.status, data: response.data })));
+};
+RestApi.Try = RestApiTry;