dn-react-router-toolkit 0.5.8 → 0.6.0

package/dist/crud/index.mjs

@@ -1,6 +1,6 @@
 // src/crud/crud_form_provider.tsx
 import { useNavigate } from "react-router";
-import { useStore } from "dn-react-toolkit/store";
+import { useStore } from "react-store-input";
 import { createContext, useContext } from "react";
 import React from "react";
 var FormContext = createContext({});
@@ -66,10 +66,9 @@ function CrudFormProvider({
               return value2.map((v) => converter(v));
             }
             if (typeof value2 === "object") {
-              return Object.entries(value2).reduce(
-                reducer,
-                {}
-              );
+              return Object.entries(
+                value2
+              ).reduce(reducer, {});
             }
           };
           return {
@@ -117,119 +116,161 @@ function CrudFormProvider({
 }
 
 // src/crud/crud_form.tsx
-import {
-  SyncInput,
-  SyncSelect,
-  SyncSwitch,
-  useSyncTextEditor
-} from "dn-react-toolkit/store";
+import React6 from "react";
+import { createTextEditor } from "dn-react-text-editor";
+import { Input, Select } from "react-store-input";
+
+// src/client/env_loader.tsx
 import React2 from "react";
-import { moment } from "dn-react-toolkit/utils";
-import { createTextEditor } from "dn-react-toolkit/text_editor";
-var textarea = createTextEditor();
-function CrudForm({ AdminLayout }) {
+import { useRouteLoaderData } from "react-router";
+
+// src/client/file_input.tsx
+import "react";
+import React3 from "react";
+
+// src/client/use_user_agent.tsx
+import { useRouteLoaderData as useRouteLoaderData2 } from "react-router";
+
+// src/client/store_text_editor.tsx
+import "dn-react-text-editor";
+import { useStoreController } from "react-store-input";
+import React4 from "react";
+function createStoreTextEditor(TextEditor2) {
+  function StoreComponent({
+    store,
+    name,
+    defaultValue,
+    ...props
+  }) {
+    const { ref, onChange } = useStoreController(
+      store,
+      {
+        ref: props.ref,
+        onSubscribe: (state, element) => {
+          const result = (props.getter ? props.getter(state) : name ? state[name] : "") || "";
+          if (element.value !== result) {
+            element.value = result;
+          }
+        },
+        onDispatch: (state, element) => {
+          if (props.setter) {
+            props.setter(state, element.value);
+            return;
+          }
+          if (name) {
+            state[name] = element.value;
+          }
+        }
+      }
+    );
+    const getDefaultValue = () => {
+      if (props.getter) {
+        return props.getter(store.state);
+      }
+      if (name) {
+        return store.state[name];
+      }
+      return void 0;
+    };
+    return /* @__PURE__ */ React4.createElement(
+      TextEditor2,
+      {
+        ...props,
+        ref,
+        defaultValue: defaultValue ?? getDefaultValue(),
+        onChange: (e) => {
+          onChange();
+          props.onChange?.(e);
+        }
+      }
+    );
+  }
+  return StoreComponent;
+}
+
+// src/form/create_form_component.tsx
+import { cn } from "dn-react-toolkit/utils";
+import React5 from "react";
+function createComponent(tag, options) {
+  return function FormComponent({ className, ...props }) {
+    const Tag = tag;
+    return /* @__PURE__ */ React5.createElement(Tag, { ...props, className: cn(options.className, className) });
+  };
+}
+
+// src/form/form_components.tsx
+var FormEntry = createComponent("div", {
+  className: "flex-1"
+});
+var FormRow = createComponent("div", {
+  className: "flex-1 flex gap-4 mb-6"
+});
+var FormLabel = createComponent("label", {
+  className: "flex-1 font-semibold mb-2.5 block"
+});
+
+// src/crud/crud_form.tsx
+var TextEditor = createStoreTextEditor(createTextEditor());
+function CrudForm({ AdminHeader }) {
   const form = useFormContext();
-  return /* @__PURE__ */ React2.createElement(
-    AdminLayout,
+  return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(
+    AdminHeader,
     {
       title: `${form.name} ${form.item ? "\uC218\uC815" : "\uCD94\uAC00"}`,
-      actions: /* @__PURE__ */ React2.createElement("button", { type: "button", className: "button-primary", onClick: form.submit }, "\uC800\uC7A5\uD558\uAE30"),
-      className: "max-w-3xl mx-auto"
-    },
-    Object.keys(form.columns).length > 0 && /* @__PURE__ */ React2.createElement(React2.Fragment, null, Object.entries(
-      form.columns
-    ).map(([key, value]) => {
-      const createComponent = () => {
-        if (value.component) {
-          return /* @__PURE__ */ React2.createElement(value.component, { store: form.store, property: key });
-        }
-        if (value.type === "checkbox") {
-          return /* @__PURE__ */ React2.createElement(SyncSwitch, { store: form.store, property: key });
-        }
-        if (value.type === "number") {
-          return /* @__PURE__ */ React2.createElement(
-            SyncInput,
-            {
-              store: form.store,
-              property: key,
-              className: "input-form",
-              type: "number",
-              serializer: (value2) => {
-                if (value2 === void 0 || value2 === null) {
-                  return "";
-                }
-                return String(value2);
-              },
-              deserializer: (value2) => {
-                const parsed = Number(value2);
-                if (isNaN(parsed)) {
-                  return void 0;
-                }
-                return parsed;
-              }
-            }
-          );
-        }
-        if (value.type === "datetime") {
-          return /* @__PURE__ */ React2.createElement(
-            SyncInput,
-            {
-              store: form.store,
-              property: key,
-              className: "input-form",
-              type: "datetime-local",
-              serializer: (value2) => {
-                if (value2 instanceof Date) {
-                  return moment(value2).toISOString(true).slice(0, 16);
-                }
-                return String(value2);
-              },
-              deserializer: (value2) => {
-                if (!value2) {
-                  return void 0;
-                }
-                return moment(value2).toDate();
-              }
-            }
-          );
-        }
-        if (value.type === "textarea") {
-          const Editor = useSyncTextEditor(textarea);
-          return /* @__PURE__ */ React2.createElement(
-            Editor.SyncTextEditor,
-            {
-              store: form.store,
-              property: key
-            }
-          );
-        }
-        if (value.options) {
-          const Component = value.options;
-          return /* @__PURE__ */ React2.createElement(SyncSelect, { store: form.store, property: key }, /* @__PURE__ */ React2.createElement(Component, null));
-        }
-        return /* @__PURE__ */ React2.createElement(
-          SyncInput,
+      actions: /* @__PURE__ */ React6.createElement(
+        "button",
+        {
+          type: "button",
+          className: "button-primary",
+          onClick: form.submit
+        },
+        "\uC800\uC7A5\uD558\uAE30"
+      )
+    }
+  ), /* @__PURE__ */ React6.createElement("div", { className: "max-w-2xl mx-auto" }, Object.keys(form.columns).length > 0 && /* @__PURE__ */ React6.createElement(React6.Fragment, null, Object.entries(
+    form.columns
+  ).map(([key, value]) => {
+    function InputComponent() {
+      if (value.type === "textarea") {
+        return /* @__PURE__ */ React6.createElement(TextEditor, { store: form.store, name: key });
+      }
+      if (value.options) {
+        const Component = value.options;
+        return /* @__PURE__ */ React6.createElement(
+          Select,
           {
             store: form.store,
-            property: key,
-            type: value.type,
-            className: "input-form"
-          }
+            name: key,
+            className: "select-form"
+          },
+          /* @__PURE__ */ React6.createElement(Component, null)
         );
-      };
-      return /* @__PURE__ */ React2.createElement("label", { key }, value.label, createComponent());
-    })),
-    form.item && /* @__PURE__ */ React2.createElement(
-      "button",
-      {
-        className: "button-dangerous mt-8",
-        onClick: () => {
-          form.delete();
+      }
+      return /* @__PURE__ */ React6.createElement(
+        Input,
+        {
+          store: form.store,
+          name: key,
+          type: value.type,
+          className: "input-form"
         }
-      },
-      "\uC0AD\uC81C\uD558\uAE30"
-    )
-  );
+      );
+    }
+    const v = form.store.state[key];
+    if (typeof v === "boolean") {
+      return /* @__PURE__ */ React6.createElement("div", { className: "flex" }, value.label, /* @__PURE__ */ React6.createElement("div", { className: "ml-auto" }, /* @__PURE__ */ React6.createElement(InputComponent, null)));
+    }
+    return /* @__PURE__ */ React6.createElement(FormRow, null, /* @__PURE__ */ React6.createElement(FormEntry, null, /* @__PURE__ */ React6.createElement(FormLabel, { key }, value.label), /* @__PURE__ */ React6.createElement(InputComponent, null)));
+  })), form.item && /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      className: "button-dangerous mt-8",
+      onClick: () => {
+        form.delete();
+      }
+    },
+    "\uC0AD\uC81C\uD558\uAE30"
+  )));
 }
 
 // src/table/loader.tsx
@@ -530,10 +571,10 @@ import {
 } from "react-router";
 
 // node_modules/react-icons/lib/iconBase.mjs
-import React4 from "react";
+import React8 from "react";
 
 // node_modules/react-icons/lib/iconContext.mjs
-import React3 from "react";
+import React7 from "react";
 var DefaultContext = {
   color: void 0,
   size: void 0,
@@ -541,7 +582,7 @@ var DefaultContext = {
   style: void 0,
   attr: void 0
 };
-var IconContext = React3.createContext && /* @__PURE__ */ React3.createContext(DefaultContext);
+var IconContext = React7.createContext && /* @__PURE__ */ React7.createContext(DefaultContext);
 
 // node_modules/react-icons/lib/iconBase.mjs
 var _excluded = ["attr", "size", "title"];
@@ -630,12 +671,12 @@ function _toPrimitive(t, r) {
   return ("string" === r ? String : Number)(t);
 }
 function Tree2Element(tree) {
-  return tree && tree.map((node, i) => /* @__PURE__ */ React4.createElement(node.tag, _objectSpread({
+  return tree && tree.map((node, i) => /* @__PURE__ */ React8.createElement(node.tag, _objectSpread({
     key: i
   }, node.attr), Tree2Element(node.child)));
 }
 function GenIcon(data) {
-  return (props) => /* @__PURE__ */ React4.createElement(IconBase, _extends({
+  return (props) => /* @__PURE__ */ React8.createElement(IconBase, _extends({
     attr: _objectSpread({}, data.attr)
   }, props), Tree2Element(data.child));
 }
@@ -650,7 +691,7 @@ function IconBase(props) {
     var className;
     if (conf.className) className = conf.className;
     if (props.className) className = (className ? className + " " : "") + props.className;
-    return /* @__PURE__ */ React4.createElement("svg", _extends({
+    return /* @__PURE__ */ React8.createElement("svg", _extends({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
@@ -662,9 +703,9 @@ function IconBase(props) {
       height: computedSize,
       width: computedSize,
       xmlns: "http://www.w3.org/2000/svg"
-    }), title && /* @__PURE__ */ React4.createElement("title", null, title), props.children);
+    }), title && /* @__PURE__ */ React8.createElement("title", null, title), props.children);
   };
-  return IconContext !== void 0 ? /* @__PURE__ */ React4.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
+  return IconContext !== void 0 ? /* @__PURE__ */ React8.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
 }
 
 // node_modules/react-icons/go/index.mjs
@@ -679,9 +720,9 @@ function GoSearch(props) {
 }
 
 // src/table/buttons.tsx
-import { cn } from "dn-react-toolkit/utils";
+import { cn as cn2 } from "dn-react-toolkit/utils";
 import { Link, useLocation, useSearchParams } from "react-router";
-import React5 from "react";
+import React9 from "react";
 function TablePageButtons({
   MAX_PAGES_TO_SHOW,
   total,
@@ -694,7 +735,7 @@ function TablePageButtons({
   const currentPage = Math.floor(offset / limit) + 1;
   const startButton = (Math.ceil(currentPage / MAX_PAGES_TO_SHOW) - 1) * MAX_PAGES_TO_SHOW;
   const endButton = Math.min(startButton + MAX_PAGES_TO_SHOW - 1, pages);
-  return /* @__PURE__ */ React5.createElement(React5.Fragment, null, pages > 1 && /* @__PURE__ */ React5.createElement("div", { className: "flex justify-center items-center my-8 gap-4 text-neutral-400" }, startButton > 1 && /* @__PURE__ */ React5.createElement(
+  return /* @__PURE__ */ React9.createElement(React9.Fragment, null, pages > 1 && /* @__PURE__ */ React9.createElement("div", { className: "flex justify-center items-center my-8 gap-4 text-neutral-400" }, startButton > 1 && /* @__PURE__ */ React9.createElement(
     Link,
     {
       to: (() => {
@@ -713,7 +754,7 @@ function TablePageButtons({
       pages - startButton
     )
   }).map((_, index2) => {
-    return /* @__PURE__ */ React5.createElement(
+    return /* @__PURE__ */ React9.createElement(
       Link,
       {
         key: index2,
@@ -724,14 +765,14 @@ function TablePageButtons({
           );
           return `${pathname}?${searchParams.toString()}`;
         })(),
-        className: cn(
+        className: cn2(
           "w-6 block text-center transition-colors",
           currentPage === startButton + index2 + 1 ? "font-bold text-primary" : "hover:text-primary"
         )
       },
       startButton + index2 + 1
     );
-  }), endButton < pages && /* @__PURE__ */ React5.createElement(
+  }), endButton < pages && /* @__PURE__ */ React9.createElement(
     Link,
     {
       to: (() => {
@@ -748,9 +789,9 @@ function TablePageButtons({
 }
 
 // src/table/table.tsx
-import { cn as cn2 } from "dn-react-toolkit/utils";
+import { cn as cn3 } from "dn-react-toolkit/utils";
 import { Link as Link2, useSearchParams as useSearchParams2 } from "react-router";
-import React6 from "react";
+import React10 from "react";
 function Table({
   className = "min-w-full whitespace-nowrap",
   data,
@@ -765,15 +806,15 @@ function Table({
   const keys = Object.entries(columns).filter((entry) => entry[1]).map(([key]) => key);
   const sortedArray = [...data];
   const [_, setSearchParams] = useSearchParams2();
-  return /* @__PURE__ */ React6.createElement(
+  return /* @__PURE__ */ React10.createElement(
     "table",
     {
-      className: cn2(
+      className: cn3(
         className,
         "text-[15px] border-separate border-spacing-0"
       )
     },
-    /* @__PURE__ */ React6.createElement("thead", null, /* @__PURE__ */ React6.createElement("tr", null, keys.map((key) => {
+    /* @__PURE__ */ React10.createElement("thead", null, /* @__PURE__ */ React10.createElement("tr", null, keys.map((key) => {
       const value = columns[key];
       function getReactNode() {
         if (value && typeof value === "object" && "label" in value) {
@@ -784,10 +825,10 @@ function Table({
       function Head() {
         const reactNode = getReactNode();
         if (typeof reactNode === "string") {
-          return /* @__PURE__ */ React6.createElement(
+          return /* @__PURE__ */ React10.createElement(
             "button",
             {
-              className: cn2(
+              className: cn3(
                 orderBy === key ? "text-neutral-900 font-medium" : "text-neutral-500",
                 "px-4 h-14 flex items-center w-full"
               ),
@@ -803,28 +844,28 @@ function Table({
               }
             },
             reactNode,
-            orderBy === key && /* @__PURE__ */ React6.createElement("div", { className: "ml-0.5" }, direction === "asc" ? /* @__PURE__ */ React6.createElement(GoArrowUp, null) : /* @__PURE__ */ React6.createElement(GoArrowDown, null))
+            orderBy === key && /* @__PURE__ */ React10.createElement("div", { className: "ml-0.5" }, direction === "asc" ? /* @__PURE__ */ React10.createElement(GoArrowUp, null) : /* @__PURE__ */ React10.createElement(GoArrowDown, null))
           );
         }
-        return /* @__PURE__ */ React6.createElement(React6.Fragment, null, reactNode);
+        return /* @__PURE__ */ React10.createElement(React10.Fragment, null, reactNode);
       }
-      return /* @__PURE__ */ React6.createElement(
+      return /* @__PURE__ */ React10.createElement(
         "th",
         {
           key,
-          className: cn2("border-y font-normal")
+          className: cn3("border-y font-normal")
         },
-        /* @__PURE__ */ React6.createElement(Head, null)
+        /* @__PURE__ */ React10.createElement(Head, null)
       );
     }))),
-    /* @__PURE__ */ React6.createElement("tbody", null, sortedArray.length === 0 && /* @__PURE__ */ React6.createElement("tr", null, /* @__PURE__ */ React6.createElement(
+    /* @__PURE__ */ React10.createElement("tbody", null, sortedArray.length === 0 && /* @__PURE__ */ React10.createElement("tr", null, /* @__PURE__ */ React10.createElement(
       "td",
       {
         colSpan: keys.length,
         className: "px-4 h-14 text-neutral-400 text-center"
       },
       "\uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4."
-    )), sortedArray.map((item, i) => /* @__PURE__ */ React6.createElement("tr", { key: i, className: "hover:bg-gray-50 transition-colors" }, keys.map((key, i2) => {
+    )), sortedArray.map((item, i) => /* @__PURE__ */ React10.createElement("tr", { key: i, className: "hover:bg-gray-50 transition-colors" }, keys.map((key, i2) => {
       const value = item[key];
       function Content() {
         if (key in columns) {
@@ -832,35 +873,35 @@ function Table({
           if (column && typeof column === "object" && "mapper" in column) {
             const mapper = column.mapper;
             if (mapper) {
-              return /* @__PURE__ */ React6.createElement(React6.Fragment, null, mapper(item));
+              return /* @__PURE__ */ React10.createElement(React10.Fragment, null, mapper(item));
             }
           }
         }
-        return /* @__PURE__ */ React6.createElement(React6.Fragment, null, String(value));
+        return /* @__PURE__ */ React10.createElement(React10.Fragment, null, String(value));
       }
-      const linkedContent = getLink ? /* @__PURE__ */ React6.createElement(
+      const linkedContent = getLink ? /* @__PURE__ */ React10.createElement(
         Link2,
         {
           to: getLink(item),
           className: "block content-center px-4 w-full h-full"
         },
-        /* @__PURE__ */ React6.createElement(Content, null)
-      ) : /* @__PURE__ */ React6.createElement(Content, null);
-      const cell = Mapper ? /* @__PURE__ */ React6.createElement(Mapper, { item, index: i2 }, linkedContent) : linkedContent;
-      return /* @__PURE__ */ React6.createElement("td", { key, className: "px-0 h-14 border-b" }, cell);
+        /* @__PURE__ */ React10.createElement(Content, null)
+      ) : /* @__PURE__ */ React10.createElement(Content, null);
+      const cell = Mapper ? /* @__PURE__ */ React10.createElement(Mapper, { item, index: i2 }, linkedContent) : linkedContent;
+      return /* @__PURE__ */ React10.createElement("td", { key, className: "px-0 h-14 border-b" }, cell);
     }))))
   );
 }
 
 // src/table/page.tsx
-import React7 from "react";
+import React11 from "react";
 function createTablePage({
   name,
   columns,
   primaryKey = "id"
 }) {
   return function TablePage({
-    AdminLayout
+    AdminHeader
   }) {
     const { pathname } = useLocation2();
     const { table } = useLoaderData();
@@ -873,73 +914,70 @@ function createTablePage({
       navigate(`${pathname}?${searchParams2.toString()}`);
     };
     const [searchParams] = useSearchParams3();
-    return /* @__PURE__ */ React7.createElement(
-      AdminLayout,
+    return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(
+      AdminHeader,
       {
         title: name,
-        actions: /* @__PURE__ */ React7.createElement(Link3, { to: `${pathname}/new`, className: "button-primary" }, name, " \uCD94\uAC00")
+        actions: /* @__PURE__ */ React11.createElement(Link3, { to: `${pathname}/new`, className: "button-primary" }, name, " \uCD94\uAC00")
+      }
+    ), /* @__PURE__ */ React11.createElement("div", { className: "max-w-7xl mx-auto" }, searchKey && /* @__PURE__ */ React11.createElement(
+      "form",
+      {
+        className: "h-18 px-4 flex items-center border-t",
+        onSubmit: (e) => {
+          e.preventDefault();
+          const formData = new FormData(e.currentTarget);
+          const query = formData.get("query");
+          search(query);
+        }
       },
-      searchKey && /* @__PURE__ */ React7.createElement(
-        "form",
+      /* @__PURE__ */ React11.createElement(
+        "button",
         {
-          className: "h-18 px-4 flex items-center border-t",
-          onSubmit: (e) => {
-            e.preventDefault();
-            const formData = new FormData(e.currentTarget);
-            const query = formData.get("query");
-            search(query);
-          }
+          type: "submit",
+          className: "w-10 h-10 flex justify-center items-center"
         },
-        /* @__PURE__ */ React7.createElement(
-          "button",
-          {
-            type: "submit",
-            className: "w-10 h-10 flex justify-center items-center"
-          },
-          /* @__PURE__ */ React7.createElement(GoSearch, { className: "text-xl mr-4" })
-        ),
-        /* @__PURE__ */ React7.createElement(
-          "input",
-          {
-            className: "outline-none h-full flex-1",
-            placeholder: "\uC5EC\uAE30\uC5D0 \uAC80\uC0C9\uD558\uC138\uC694...",
-            name: "query",
-            defaultValue: searchParams.get("query") ?? ""
-          }
-        )
-      ),
-      /* @__PURE__ */ React7.createElement(
-        Table,
-        {
-          data: items,
-          columns,
-          getLink: primaryKey ? (item) => `${pathname}/${item[primaryKey]}` : void 0,
-          limit,
-          offset,
-          orderBy,
-          direction
-        }
+        /* @__PURE__ */ React11.createElement(GoSearch, { className: "text-xl mr-4" })
       ),
-      /* @__PURE__ */ React7.createElement(
-        TablePageButtons,
+      /* @__PURE__ */ React11.createElement(
+        "input",
         {
-          total,
-          limit,
-          offset,
-          MAX_PAGES_TO_SHOW: 10
+          className: "outline-none h-full flex-1",
+          placeholder: "\uC5EC\uAE30\uC5D0 \uAC80\uC0C9\uD558\uC138\uC694...",
+          name: "query",
+          defaultValue: searchParams.get("query") ?? ""
         }
       )
-    );
+    ), /* @__PURE__ */ React11.createElement(
+      Table,
+      {
+        data: items,
+        columns,
+        getLink: primaryKey ? (item) => `${pathname}/${item[primaryKey]}` : void 0,
+        limit,
+        offset,
+        orderBy,
+        direction
+      }
+    ), /* @__PURE__ */ React11.createElement(
+      TablePageButtons,
+      {
+        total,
+        limit,
+        offset,
+        MAX_PAGES_TO_SHOW: 10
+      }
+    )));
   };
 }
 
 // src/crud/crud_page.tsx
-import React8 from "react";
+import React12 from "react";
 function crudPage({
   name,
   tablePageOptions,
   formOptions,
-  AdminLayout
+  AdminHeader
 }) {
   return (prefix2) => {
     return function Page() {
@@ -950,10 +988,10 @@ function crudPage({
           ...tablePageOptions,
           name
         });
-        return /* @__PURE__ */ React8.createElement(Component, { AdminLayout });
+        return /* @__PURE__ */ React12.createElement(Component, { AdminHeader });
       }
       if (pathname.startsWith(prefix2)) {
-        return /* @__PURE__ */ React8.createElement(
+        return /* @__PURE__ */ React12.createElement(
           CrudFormProvider,
           {
             item: data?.item,
@@ -961,7 +999,7 @@ function crudPage({
             name,
             columns: formOptions.columns
           },
-          formOptions.form ? /* @__PURE__ */ React8.createElement(formOptions.form, null) : /* @__PURE__ */ React8.createElement(CrudForm, { AdminLayout })
+          formOptions.form ? /* @__PURE__ */ React12.createElement(formOptions.form, null) : /* @__PURE__ */ React12.createElement(CrudForm, { AdminHeader })
         );
       }
     };
@@ -982,14 +1020,14 @@ var generateHandlers = (handlers) => {
 
 // src/crud/generate_pages.tsx
 import { useLocation as useLocation4 } from "react-router";
-import React9 from "react";
+import React13 from "react";
 var generatePages = (pages) => {
   return function Page() {
     const { pathname } = useLocation4();
     for (const route2 of Object.keys(pages)) {
       if (pathname.startsWith(route2)) {
         const Page2 = pages[route2](route2);
-        return /* @__PURE__ */ React9.createElement(Page2, null);
+        return /* @__PURE__ */ React13.createElement(Page2, null);
       }
     }
   };