@akanjs/ui 0.0.151 → 0.0.153

package/cjs/Pagination.js

@@ -21,6 +21,7 @@ __export(Pagination_exports, {
   Pagination: () => Pagination
 });
 module.exports = __toCommonJS(Pagination_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_client = require("@akanjs/client");
 var import_bi = require("react-icons/bi");
 const Pagination = ({
@@ -61,50 +62,54 @@ const Pagination = ({
       displayNumbers = ["1", "...", ...pageNumbers.slice(-5)];
     }
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-center" }, total > 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      className: (0, import_client.clsx)(
-        "btn btn-ghost btn-square duration-200",
-        currentPage > 1 ? "opacity-100" : "opacity-0 hover:cursor-default hover:opacity-0"
-      ),
-      onClick: handleLeftClick
-    },
-    /* @__PURE__ */ React.createElement(import_bi.BiChevronLeft, null)
-  ), displayNumbers.map((pageNum, index) => {
-    if (pageNum === "...") {
-      return /* @__PURE__ */ React.createElement("button", { key: index, className: "btn btn-ghost btn-square text-primary/40" }, /* @__PURE__ */ React.createElement(import_bi.BiDotsHorizontalRounded, null));
-    }
-    if (Number(pageNum) === currentPage) {
-      return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center justify-center", children: total > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "button",
+      {
+        className: (0, import_client.clsx)(
+          "btn btn-ghost btn-square duration-200",
+          currentPage > 1 ? "opacity-100" : "opacity-0 hover:cursor-default hover:opacity-0"
+        ),
+        onClick: handleLeftClick,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_bi.BiChevronLeft, {})
+      }
+    ),
+    displayNumbers.map((pageNum, index) => {
+      if (pageNum === "...") {
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "btn btn-ghost btn-square text-primary/40", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_bi.BiDotsHorizontalRounded, {}) }, index);
+      }
+      if (Number(pageNum) === currentPage) {
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            className: (0, import_client.clsx)("btn btn-ghost btn-square text-primary", classNames?.activePageNumClassName),
+            children: pageNum
+          },
+          index
+        );
+      }
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "button",
         {
-          key: index,
-          className: (0, import_client.clsx)("btn btn-ghost btn-square text-primary", classNames?.activePageNumClassName)
+          className: (0, import_client.clsx)("btn btn-ghost btn-square text-primary/40", classNames?.pageNumClassName),
+          onClick: () => {
+            onPageSelect(Number(pageNum));
+          },
+          children: pageNum
         },
-        pageNum
+        index
       );
-    }
-    return /* @__PURE__ */ React.createElement(
+    }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "button",
       {
-        key: index,
-        className: (0, import_client.clsx)("btn btn-ghost btn-square text-primary/40", classNames?.pageNumClassName),
-        onClick: () => {
-          onPageSelect(Number(pageNum));
-        }
-      },
-      pageNum
-    );
-  }), /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      className: (0, import_client.clsx)(
-        "btn btn-ghost btn-square duration-200",
-        currentPage < totalPages ? "opacity-100" : "opacity-0 hover:cursor-default hover:opacity-0"
-      ),
-      onClick: handleRightClick
-    },
-    /* @__PURE__ */ React.createElement(import_bi.BiChevronRight, null)
-  )));
+        className: (0, import_client.clsx)(
+          "btn btn-ghost btn-square duration-200",
+          currentPage < totalPages ? "opacity-100" : "opacity-0 hover:cursor-default hover:opacity-0"
+        ),
+        onClick: handleRightClick,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_bi.BiChevronRight, {})
+      }
+    )
+  ] }) });
 };

package/cjs/Popconfirm.js

@@ -1,9 +1,7 @@
 "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)
@@ -17,24 +15,17 @@ var __copyProps = (to, from, except, desc) => {
   }
   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 Popconfirm_exports = {};
 __export(Popconfirm_exports, {
   Popconfirm: () => Popconfirm
 });
 module.exports = __toCommonJS(Popconfirm_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_client = require("@akanjs/client");
 var import_next = require("@akanjs/next");
 var import_web = require("@react-spring/web");
-var import_react = __toESM(require("react"));
+var import_react = require("react");
 var import_bi = require("react-icons/bi");
 //! 디자인 수정, 테마 적용 안됨
 const Popconfirm = ({
@@ -76,41 +67,58 @@ const Popconfirm = ({
   const handleCancel = () => {
     setIsConfirming(false);
   };
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "relative inline-block" }, /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: (0, import_client.clsx)("trigger", triggerClassName),
-      onClick: (e) => {
-        e.stopPropagation();
-        setIsConfirming(true);
-      }
-    },
-    children
-  ), isConfirming && /* @__PURE__ */ import_react.default.createElement(
-    import_web.animated.div,
-    {
-      className: "popconfirm border-base-300 bg-base-100 absolute -right-2 bottom-0 z-10 translate-y-[106%] rounded-lg border p-4 shadow-xl",
-      style: popconfirmProps
-    },
-    /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative inline-block", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "div",
+        {
+          className: (0, import_client.clsx)("trigger", triggerClassName),
+          onClick: (e) => {
+            e.stopPropagation();
+            setIsConfirming(true);
+          },
+          children
+        }
+      ),
+      isConfirming && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        import_web.animated.div,
+        {
+          className: "popconfirm border-base-300 bg-base-100 absolute -right-2 bottom-0 z-10 translate-y-[106%] rounded-lg border p-4 shadow-xl",
+          style: popconfirmProps,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "div",
+              {
+                className: (0, import_client.clsx)(
+                  "bg-base-100 border-base-300 popconfirm-deco absolute -top-2 size-4 rotate-45 rounded-sm border-t border-l",
+                  { "right-10": !decoClassName },
+                  decoClassName
+                )
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_bi.BiMessageRoundedError, { className: "text-orange-500" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mb-2 font-bold whitespace-nowrap", children: title }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mb-2 whitespace-nowrap", children: description })
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-end gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "btn btn-xs btn-outline", onClick: handleCancel, ...cancelButtonProps, children: cancelText ?? l("util.cancel") }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "btn btn-xs", onClick: handleConfirm, ...okButtonProps, children: okText ?? l("util.ok") })
+            ] })
+          ]
+        }
+      )
+    ] }),
+    isConfirming && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
       {
-        className: (0, import_client.clsx)(
-          "bg-base-100 border-base-300 popconfirm-deco absolute -top-2 size-4 rotate-45 rounded-sm border-t border-l",
-          { "right-10": !decoClassName },
-          decoClassName
-        )
-      }
-    ),
-    /* @__PURE__ */ import_react.default.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ import_react.default.createElement(import_bi.BiMessageRoundedError, { className: "text-orange-500" }), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("p", { className: "mb-2 font-bold whitespace-nowrap" }, title), /* @__PURE__ */ import_react.default.createElement("div", { className: "mb-2 whitespace-nowrap" }, description))),
-    /* @__PURE__ */ import_react.default.createElement("div", { className: "flex justify-end gap-2" }, /* @__PURE__ */ import_react.default.createElement("button", { className: "btn btn-xs btn-outline", onClick: handleCancel, ...cancelButtonProps }, cancelText ?? l("util.cancel")), /* @__PURE__ */ import_react.default.createElement("button", { className: "btn btn-xs", onClick: handleConfirm, ...okButtonProps }, okText ?? l("util.ok")))
-  )), isConfirming && /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: "absolute top-0 left-0 h-screen w-full",
-      onClick: () => {
-        setIsConfirming(false);
+        className: "absolute top-0 left-0 h-screen w-full",
+        onClick: () => {
+          setIsConfirming(false);
+        }
       }
-    }
-  ));
+    )
+  ] });
 };

package/cjs/Radio.js

@@ -21,33 +21,37 @@ __export(Radio_exports, {
   Radio: () => Radio
 });
 module.exports = __toCommonJS(Radio_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_client = require("@akanjs/client");
 const Radio = ({ value, children, disabled, className, onChange }) => {
-  return /* @__PURE__ */ React.createElement("div", { className: (0, import_client.clsx)(`flex gap-2`, className) }, children.map((child, idx) => {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-center gap-1", key: idx }, /* @__PURE__ */ React.createElement(
-      "input",
-      {
-        type: "radio",
-        disabled,
-        className: "radio radio-primary radio-sm",
-        checked: value === child.props.value || value === idx,
-        onChange: () => {
-          onChange(child.props.value, idx);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_client.clsx)(`flex gap-2`, className), children: children.map((child, idx) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-center gap-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "input",
+        {
+          type: "radio",
+          disabled,
+          className: "radio radio-primary radio-sm",
+          checked: value === child.props.value || value === idx,
+          onChange: () => {
+            onChange(child.props.value, idx);
+          }
         }
-      }
-    ), /* @__PURE__ */ React.createElement(
-      "button",
-      {
-        className: "bg-transparent",
-        onClick: () => {
-          onChange(child.props.value, idx);
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          className: "bg-transparent",
+          onClick: () => {
+            onChange(child.props.value, idx);
+          },
+          children: child
         }
-      },
-      child
-    ));
-  }));
+      )
+    ] }, idx);
+  }) });
 };
 const Item = ({ value, className, children }) => {
-  return /* @__PURE__ */ React.createElement("div", { className: (0, import_client.clsx)("", className) }, children);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_client.clsx)("", className), children });
 };
 Radio.Item = Item;

package/cjs/RecentTime.js

@@ -30,6 +30,7 @@ __export(RecentTime_exports, {
   RecentTime: () => RecentTime
 });
 module.exports = __toCommonJS(RecentTime_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_base = require("@akanjs/base");
 var import_client = require("@akanjs/client");
 var import_next = require("@akanjs/next");
@@ -50,37 +51,37 @@ const RecentTime = ({
   if (!date)
     return null;
   if ((0, import_base.dayjs)(0).isSame(date) || (0, import_base.dayjs)(-1).isSame(date))
-    return /* @__PURE__ */ React.createElement("span", null, "--:--");
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "--:--" });
   if (breakUnit === "second")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm:ss") }, datejs.format(dateFormat));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm:ss"), children: datejs.format(dateFormat) });
   if (Math.abs(diffSecs) < 60)
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
   else if (breakUnit === "minute")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.format(dateFormat));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.format(dateFormat) });
   const diffMins = Math.floor(diff / (1e3 * 60));
   if (Math.abs(diffMins) < 60)
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
   else if (breakUnit === "hour")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.format(dateFormat));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.format(dateFormat) });
   const diffHours = Math.floor(diff / (1e3 * 3600));
   if (Math.abs(diffHours) < 24)
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
   else if (breakUnit === "day")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.format(dateFormat));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.format(dateFormat) });
   const diffDays = Math.floor(diff / (1e3 * 3600 * 24));
   if (Math.abs(diffDays) < 7)
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
   else if (breakUnit === "week")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.format(dateFormat));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.format(dateFormat) });
   const diffWeeks = Math.floor(diff / (1e3 * 3600 * 24 * 7));
   if (Math.abs(diffWeeks) < 4)
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
   else if (breakUnit === "month")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.format(dateFormat));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.format(dateFormat) });
   const diffMonths = Math.floor(diff / (1e3 * 3600 * 24 * 30));
   if (Math.abs(diffMonths) < 12)
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
   else if (breakUnit === "year")
-    return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.format(dateFormat));
-  return /* @__PURE__ */ React.createElement("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm") }, datejs.fromNow());
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.format(dateFormat) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_client.clsx)("tooltip", className), "data-tip": datejs.format("YYYY-MM-DD HH:mm"), children: datejs.fromNow() });
 };

package/cjs/Refresh.js

@@ -31,15 +31,16 @@ __export(Refresh_exports, {
   Refresh: () => Refresh
 });
 module.exports = __toCommonJS(Refresh_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_bi = require("react-icons/bi");
 var import_react_simple_pull_to_refresh = __toESM(require("react-simple-pull-to-refresh"));
 const Refresh = ({ children, onRefresh }) => {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_simple_pull_to_refresh.default,
     {
       onRefresh,
-      refreshingContent: /* @__PURE__ */ React.createElement("div", { className: "bg-base-100 fixed left-1/2 flex size-10 -translate-x-1/2 items-center justify-center rounded-full shadow-sm" }, /* @__PURE__ */ React.createElement(import_bi.BiLoaderAlt, { className: "animate-spin text-2xl" }))
-    },
-    children
+      refreshingContent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "bg-base-100 fixed left-1/2 flex size-10 -translate-x-1/2 items-center justify-center rounded-full shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_bi.BiLoaderAlt, { className: "animate-spin text-2xl" }) }),
+      children
+    }
   );
 };

package/cjs/ScreenNavigator.js

@@ -21,6 +21,7 @@ __export(ScreenNavigator_exports, {
   ScreenNavigator: () => ScreenNavigator
 });
 module.exports = __toCommonJS(ScreenNavigator_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_client = require("@akanjs/client");
 var import_react = require("@use-gesture/react");
 var import_react2 = require("react");
@@ -99,23 +100,23 @@ const ScreenNavigator = ({
       setCurrentMenu(menus[1]);
     }
   };
-  return /* @__PURE__ */ React.createElement(ScreenNavigatorContext.Provider, { value: { bind, xValue, onClickMenu, menus, currentMenu, setMenu } }, /* @__PURE__ */ React.createElement(import_react_spring.a.div, { ...bind(), className: "flex h-full w-[200vw] overflow-x-scroll", style: { x: xValue }, ref }, children));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ScreenNavigatorContext.Provider, { value: { bind, xValue, onClickMenu, menus, currentMenu, setMenu }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_spring.a.div, { ...bind(), className: "flex h-full w-[200vw] overflow-x-scroll", style: { x: xValue }, ref, children }) });
 };
 const NavbarItem = ({ menu, children, className }) => {
   const { onClickMenu, currentMenu } = (0, import_react2.useContext)(ScreenNavigatorContext);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
       className: (0, import_client.clsx)(className, currentMenu === menu ? "opacity-100" : "opacity-40"),
       onClick: () => {
         onClickMenu(menu);
-      }
-    },
-    children
+      },
+      children
+    }
   );
 };
 ScreenNavigator.NavbarItem = NavbarItem;
 const Screen = ({ children }) => {
-  return /* @__PURE__ */ React.createElement("div", { className: "h-full w-screen overflow-scroll", style: { touchAction: "pan-y" } }, children);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-full w-screen overflow-scroll", style: { touchAction: "pan-y" }, children });
 };
 ScreenNavigator.Screen = Screen;