@akanjs/ui 0.0.151 → 0.0.153

package/esm/Signal/RestApi.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { baseClientEnv, getNonArrayModel, isGqlScalar } from "@akanjs/base";
 import { getGqlTypeStr } from "@akanjs/constant";
 import { usePage } from "@akanjs/next";
@@ -12,14 +13,14 @@ import {
   getSignalRefsOnStorage
 } from "@akanjs/signal";
 import { st } from "@akanjs/store";
-import React, { useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { AiOutlineApi, AiOutlineCopy, AiOutlineFileWord, AiOutlineSend } from "react-icons/ai";
 import { Copy } from "../Copy";
 import { Signal } from ".";
 import Arg from "./Arg";
 import Response from "./Response";
 function RestApi() {
-  return /* @__PURE__ */ React.createElement("div", null);
+  return /* @__PURE__ */ jsx("div", {});
 }
 const RestApiEndpoints = ({ refName, endpoints, openAll, httpUri }) => {
   const sigRefs = getSignalRefsOnStorage(refName);
@@ -42,7 +43,7 @@ const RestApiEndpoints = ({ refName, endpoints, openAll, httpUri }) => {
       return true;
     return false;
   });
-  return /* @__PURE__ */ React.createElement("div", null, gqlInfos.map(({ gqlMeta, sigRef }, idx) => /* @__PURE__ */ React.createElement(RestApiEndpoint, { key: idx, sigRef, gqlMeta, open: openAll, httpUri })));
+  return /* @__PURE__ */ jsx("div", { children: gqlInfos.map(({ gqlMeta, sigRef }, idx) => /* @__PURE__ */ jsx(RestApiEndpoint, { sigRef, gqlMeta, open: openAll, httpUri }, idx)) });
 };
 RestApi.Endpoints = RestApiEndpoints;
 const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
@@ -56,55 +57,92 @@ const RestApiEndpoint = ({ sigRef, gqlMeta, open, httpUri }) => {
   const uploadArgMetas = argMetas.filter((argMeta) => argMeta.type === "Upload");
   const prefix = getControllerPrefix(sigMeta);
   const path = getControllerPath(gqlMeta, paramArgMetas);
-  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" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React.createElement("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "Query" ? "btn-success" : "btn-accent"}` }, gqlMeta.type === "Query" ? "GET" : "POST"), prefix ? `/${prefix}` : "", "/", path, " ", /* @__PURE__ */ React.createElement("span", { className: "text-lg" }, "(", 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" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "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(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(AiOutlineApi, { className: "text-xl" }),
-    " Restful API"
-  )), viewStatus === "doc" ? /* @__PURE__ */ React.createElement(
-    RestApiInterface,
-    {
-      sigRef,
-      gqlMeta,
-      queryArgMetas,
-      paramArgMetas,
-      bodyArgMetas,
-      uploadArgMetas
-    }
-  ) : /* @__PURE__ */ React.createElement(
-    RestApiTry,
-    {
-      sigRef,
-      gqlMeta,
-      queryArgMetas,
-      paramArgMetas,
-      bodyArgMetas,
-      uploadArgMetas,
-      httpUri
-    }
-  )));
+  return /* @__PURE__ */ jsxs("div", { className: "collapse-arrow bg-base-300 collapse my-1", children: [
+    /* @__PURE__ */ jsx("input", { type: "checkbox", checked: open }),
+    /* @__PURE__ */ jsx("div", { className: "collapse-title", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx("div", { className: `btn btn-xs w-16 ${gqlMeta.type === "Query" ? "btn-success" : "btn-accent"}`, children: gqlMeta.type === "Query" ? "GET" : "POST" }),
+      prefix ? `/${prefix}` : "",
+      "/",
+      path,
+      " ",
+      /* @__PURE__ */ jsxs("span", { className: "text-lg", children: [
+        "(",
+        l.api(sigMeta.refName, gqlMeta.key),
+        ")"
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "collapse-content bg-base-200 w-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: "mt-4 text-lg", children: [
+        /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Description" }),
+        /* @__PURE__ */ jsx("hr", { className: "my-2 border-[0.1px] border-gray-400" }),
+        gqlMeta.guards.some((guard) => guard !== "None") ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pb-3 pl-3 text-base font-normal", children: [
+          "- Guards:",
+          gqlMeta.guards.map((guard) => /* @__PURE__ */ jsx(
+            "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" : ""}`,
+              children: guard
+            },
+            guard
+          ))
+        ] }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "pb-3 pl-3 text-base font-normal", children: [
+          "- ",
+          l.apidesc(sigMeta.refName, gqlMeta.key)
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "my-4 flex w-full gap-5 px-5", children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => {
+              setViewStatus("doc");
+            },
+            className: `btn btn-success w-1/2 ${viewStatus === "doc" ? "" : "btn-outline"}`,
+            children: [
+              /* @__PURE__ */ jsx(AiOutlineFileWord, { className: "text-xl" }),
+              " View Doc"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => {
+              setViewStatus("test");
+            },
+            className: `btn btn-primary w-1/2 ${viewStatus === "test" ? "" : "btn-outline"}`,
+            children: [
+              /* @__PURE__ */ jsx(AiOutlineApi, { className: "text-xl" }),
+              " Restful API"
+            ]
+          }
+        )
+      ] }),
+      viewStatus === "doc" ? /* @__PURE__ */ jsx(
+        RestApiInterface,
+        {
+          sigRef,
+          gqlMeta,
+          queryArgMetas,
+          paramArgMetas,
+          bodyArgMetas,
+          uploadArgMetas
+        }
+      ) : /* @__PURE__ */ jsx(
+        RestApiTry,
+        {
+          sigRef,
+          gqlMeta,
+          queryArgMetas,
+          paramArgMetas,
+          bodyArgMetas,
+          uploadArgMetas,
+          httpUri
+        }
+      )
+    ] })
+  ] });
 };
 RestApi.Endpoint = RestApiEndpoint;
 const RestApiInterface = ({
@@ -118,7 +156,38 @@ const RestApiInterface = ({
   const sigMeta = getSigMeta(sigRef);
   const [returnRef, arrDepth] = getNonArrayModel(gqlMeta.returns());
   const isReturnModelType = !isGqlScalar(returnRef);
-  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 font-extrabold" }, "Form data upload"), /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ React.createElement(Arg.Table, { sigMeta, gqlMeta, argMetas: uploadArgMetas }))) : null, paramArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Parameters"), /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ React.createElement(Arg.Table, { sigMeta, gqlMeta, argMetas: paramArgMetas }))) : null, queryArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Query"), /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ React.createElement(Arg.Table, { sigMeta, gqlMeta, argMetas: queryArgMetas }))) : null, bodyArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Body"), /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3" }, /* @__PURE__ */ React.createElement(Arg.Table, { sigMeta, gqlMeta, argMetas: bodyArgMetas }))) : 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" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "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(Signal.Object.Type, { objRef: returnRef, arrDepth }), isReturnModelType ? /* @__PURE__ */ React.createElement(Signal.Object.Detail, { objRef: returnRef }) : null)), /* @__PURE__ */ React.createElement("div", { className: "w-full md:w-1/2" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Response Example"), /* @__PURE__ */ React.createElement(Response.Example, { sigRef, gqlMeta })))));
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-4", children: [
+    uploadArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Form data upload" }),
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: uploadArgMetas }) })
+    ] }) : null,
+    paramArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Parameters" }),
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: paramArgMetas }) })
+    ] }) : null,
+    queryArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Query" }),
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: queryArgMetas }) })
+    ] }) : null,
+    bodyArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Body" }),
+      /* @__PURE__ */ jsx("div", { className: "bg-base-100 overflow-x-auto rounded-md p-3", children: /* @__PURE__ */ jsx(Arg.Table, { sigMeta, gqlMeta, argMetas: bodyArgMetas }) })
+    ] }) : null,
+    /* @__PURE__ */ jsx("div", { className: "text-lg font-bold", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-2 rounded-md font-normal md:flex-row", children: [
+      /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2", children: [
+        /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Response Type" }),
+        /* @__PURE__ */ jsxs("div", { className: "bg-base-100 max-h-[500px] overflow-auto rounded-md p-4 md:h-[500px]", children: [
+          "Returns: ",
+          /* @__PURE__ */ jsx(Signal.Object.Type, { objRef: returnRef, arrDepth }),
+          isReturnModelType ? /* @__PURE__ */ jsx(Signal.Object.Detail, { objRef: returnRef }) : null
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "w-full md:w-1/2", children: [
+        /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Response Example" }),
+        /* @__PURE__ */ jsx(Response.Example, { sigRef, gqlMeta })
+      ] })
+    ] }) })
+  ] });
 };
 RestApi.Interface = RestApiInterface;
 const RestApiTry = ({
@@ -196,37 +265,70 @@ const RestApiTry = ({
     const data = await res.json();
     setResponse(res.ok ? { status: "success", data } : { status: "error", data });
   };
-  return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 text-lg" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Request URL:"), /* @__PURE__ */ React.createElement(Copy, { text: `${httpUri}${requestPath}` }, /* @__PURE__ */ React.createElement("button", { className: "btn btn-sm btn-outline" }, requestPath, " ", /* @__PURE__ */ React.createElement(AiOutlineCopy, null)))), uploadArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Form data uplaod"), uploadArgMetas.map((argMeta) => /* @__PURE__ */ React.createElement(
-    Arg.FormData,
-    {
-      key: argMeta.name,
-      argMeta,
-      value: uploadRequest[argMeta.name],
-      onChange: (fileList) => {
-        setUploadRequest({ ...uploadRequest, [argMeta.name]: fileList });
-      }
-    }
-  ))) : null, paramArgMetas.length ? /* @__PURE__ */ React.createElement("div", { className: "border-t border-gray-400 pt-5" }, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Parameters"), paramArgMetas.map((argMeta, idx) => /* @__PURE__ */ React.createElement(
-    Arg.Param,
-    {
-      key: idx,
-      argMeta,
-      value: paramRequest[argMeta.name],
-      onChange: (value) => {
-        setParamRequest({ ...paramRequest, [argMeta.name]: value });
-      }
-    }
-  ))) : null, queryArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Queries"), queryArgMetas.map((argMeta, idx) => /* @__PURE__ */ React.createElement(
-    Arg.Query,
-    {
-      key: idx,
-      argMeta,
-      value: queryRequest[argMeta.name] ?? "",
-      onChange: (value) => {
-        setQueryRequest({ ...queryRequest, [argMeta.name]: value });
-      }
-    }
-  ))) : null, bodyArgMetas.length ? /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg" }, "Body"), /* @__PURE__ */ React.createElement(Arg.Json, { value: bodyRequest, onChange: setBodyRequest })) : null, /* @__PURE__ */ React.createElement("div", { className: "border-b border-gray-400 pb-5" }, /* @__PURE__ */ React.createElement("button", { className: "btn bg-success w-full", onClick: () => void onSend() }, /* @__PURE__ */ React.createElement(AiOutlineSend, { className: "-mt-0.5" }), " Send Request")), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "text-lg font-extrabold" }, "Response"), /* @__PURE__ */ React.createElement(Response.Result, { status: response.status, data: response.data })));
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-lg", children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Request URL:" }),
+      /* @__PURE__ */ jsx(Copy, { text: `${httpUri}${requestPath}`, children: /* @__PURE__ */ jsxs("button", { className: "btn btn-sm btn-outline", children: [
+        requestPath,
+        " ",
+        /* @__PURE__ */ jsx(AiOutlineCopy, {})
+      ] }) })
+    ] }),
+    uploadArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg", children: "Form data uplaod" }),
+      uploadArgMetas.map((argMeta) => /* @__PURE__ */ jsx(
+        Arg.FormData,
+        {
+          argMeta,
+          value: uploadRequest[argMeta.name],
+          onChange: (fileList) => {
+            setUploadRequest({ ...uploadRequest, [argMeta.name]: fileList });
+          }
+        },
+        argMeta.name
+      ))
+    ] }) : null,
+    paramArgMetas.length ? /* @__PURE__ */ jsxs("div", { className: "border-t border-gray-400 pt-5", children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Parameters" }),
+      paramArgMetas.map((argMeta, idx) => /* @__PURE__ */ jsx(
+        Arg.Param,
+        {
+          argMeta,
+          value: paramRequest[argMeta.name],
+          onChange: (value) => {
+            setParamRequest({ ...paramRequest, [argMeta.name]: value });
+          }
+        },
+        idx
+      ))
+    ] }) : null,
+    queryArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Queries" }),
+      queryArgMetas.map((argMeta, idx) => /* @__PURE__ */ jsx(
+        Arg.Query,
+        {
+          argMeta,
+          value: queryRequest[argMeta.name] ?? "",
+          onChange: (value) => {
+            setQueryRequest({ ...queryRequest, [argMeta.name]: value });
+          }
+        },
+        idx
+      ))
+    ] }) : null,
+    bodyArgMetas.length ? /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg", children: "Body" }),
+      /* @__PURE__ */ jsx(Arg.Json, { value: bodyRequest, onChange: setBodyRequest })
+    ] }) : null,
+    /* @__PURE__ */ jsx("div", { className: "border-b border-gray-400 pb-5", children: /* @__PURE__ */ jsxs("button", { className: "btn bg-success w-full", onClick: () => void onSend(), children: [
+      /* @__PURE__ */ jsx(AiOutlineSend, { className: "-mt-0.5" }),
+      " Send Request"
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-lg font-extrabold", children: "Response" }),
+      /* @__PURE__ */ jsx(Response.Result, { status: response.status, data: response.data })
+    ] })
+  ] });
 };
 RestApi.Try = RestApiTry;
 export {

package/esm/Signal/WebSocket.js

@@ -1,10 +1,11 @@
 "use client";
+import { jsx } from "react/jsx-runtime";
 import { getGqlMetas, getSignalRefsOnStorage } from "@akanjs/signal";
 import { st } from "@akanjs/store";
 import Message from "./Message";
 import PubSub from "./PubSub";
 function WebSocket() {
-  return /* @__PURE__ */ React.createElement("div", null);
+  return /* @__PURE__ */ jsx("div", {});
 }
 const WebSocketEndpoints = ({ refName, openAll }) => {
   const sigRefs = getSignalRefsOnStorage(refName);
@@ -25,13 +26,13 @@ const WebSocketEndpoints = ({ refName, openAll }) => {
       return true;
     return false;
   });
-  return /* @__PURE__ */ React.createElement("div", null, gqlInfos.map(({ gqlMeta, sigRef }, idx) => {
+  return /* @__PURE__ */ jsx("div", { children: gqlInfos.map(({ gqlMeta, sigRef }, idx) => {
     if (gqlMeta.type === "Pubsub") {
-      return /* @__PURE__ */ React.createElement(PubSub.Endpoint, { key: idx, sigRef, gqlMeta, open: openAll });
+      return /* @__PURE__ */ jsx(PubSub.Endpoint, { sigRef, gqlMeta, open: openAll }, idx);
     } else {
-      return /* @__PURE__ */ React.createElement(Message.Endpoint, { key: idx, sigRef, gqlMeta, open: openAll });
+      return /* @__PURE__ */ jsx(Message.Endpoint, { sigRef, gqlMeta, open: openAll }, idx);
     }
-  }));
+  }) });
 };
 WebSocket.Endpoints = WebSocketEndpoints;
 export {