dn-react-router-toolkit 0.9.12 → 0.10.0

package/dist/client/index.mjs

@@ -82,126 +82,9 @@ function useUserAgent() {
   const isDesktop = !isMobile && !isTablet;
   return { userAgent, isMobile, isTablet, isDesktop };
 }
-
-// src/client/store_text_editor.tsx
-import {
-  TextEditor
-} from "gw-react-text-editor";
-import { useStoreController } from "react-store-input";
-import { useImperativeHandle, useRef as useRef2 } from "react";
-import { jsx as jsx3 } from "react/jsx-runtime";
-function StoreTextEditor({
-  store,
-  name,
-  getter,
-  setter,
-  defaultValue,
-  ref,
-  ...props
-}) {
-  const controllerRef = useRef2(null);
-  useImperativeHandle(
-    ref,
-    () => controllerRef.current,
-    []
-  );
-  const { dispatch } = useStoreController(store, {
-    onSubscribe: (state) => {
-      const controller = controllerRef.current;
-      if (!controller) {
-        return;
-      }
-      const getResult = () => {
-        if (getter) {
-          return getter(state) || "";
-        }
-        if (name) {
-          return state[name] || "";
-        }
-        return "";
-      };
-      const result = getResult();
-      if (controller.value !== result) {
-        controller.value = result;
-      }
-    },
-    onDispatch: (state) => {
-      const controller = controllerRef.current;
-      if (!controller) {
-        return;
-      }
-      if (setter) {
-        setter(state, controller.value);
-        return;
-      }
-      if (name) {
-        state[name] = controller.value;
-      }
-    }
-  });
-  const getDefaultValue = () => {
-    if (getter) {
-      return getter(store.state);
-    }
-    if (name) {
-      return store.state[name];
-    }
-    return void 0;
-  };
-  return /* @__PURE__ */ jsx3(
-    TextEditor,
-    {
-      ...props,
-      ref: controllerRef,
-      defaultValue: defaultValue ?? getDefaultValue(),
-      onChange: (e) => {
-        dispatch();
-        props.onChange?.(e);
-      }
-    }
-  );
-}
-
-// src/client/editor.tsx
-import { generateMetadata } from "gw-file/client";
-function createAttachFileOptions({
-  cdn,
-  fileUploader
-}) {
-  return {
-    uploadFile: async (file) => {
-      const result = await fileUploader.uploadFile(file, {
-        convertToWebp: true
-      });
-      if (result.isErr) {
-        throw new Error(result.error.message);
-      }
-      return {
-        alt: file.name,
-        src: cdn(result.value.key)
-      };
-    },
-    generateMetadata: (file) => generateMetadata(file, {
-      uploadBlob: async (blob) => {
-        const result = await fileUploader.uploadBlob(blob, "file", {
-          convertToWebp: true
-        });
-        if (result.isErr) {
-          throw new Error(result.error.message);
-        }
-        return {
-          alt: file.name,
-          src: cdn(result.value.key)
-        };
-      }
-    })
-  };
-}
 export {
   EnvLoader,
   FileInput,
-  StoreTextEditor,
-  createAttachFileOptions,
   env,
   useUserAgent
 };

package/dist/crud/crud_form.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
 import { FC, ReactNode } from 'react';
 
 type Props = {
@@ -7,6 +7,6 @@ type Props = {
         actions?: ReactNode;
     }>;
 };
-declare function CrudForm<TModel extends Record<string, unknown>>({ AdminHeader, }: Props): react_jsx_runtime.JSX.Element;
+declare function CrudForm<TModel extends Record<string, unknown>>({ AdminHeader }: Props): react.JSX.Element;
 
 export { CrudForm as default };

package/dist/crud/crud_form.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
 import { FC, ReactNode } from 'react';
 
 type Props = {
@@ -7,6 +7,6 @@ type Props = {
         actions?: ReactNode;
     }>;
 };
-declare function CrudForm<TModel extends Record<string, unknown>>({ AdminHeader, }: Props): react_jsx_runtime.JSX.Element;
+declare function CrudForm<TModel extends Record<string, unknown>>({ AdminHeader }: Props): react.JSX.Element;
 
 export { CrudForm as default };

package/dist/crud/crud_form.js

@@ -76,113 +76,19 @@ var FormLabel = createComponent("label", {
 });
 
 // src/crud/crud_form.tsx
-var import_react_store_input3 = require("react-store-input");
-
-// src/client/env_loader.tsx
-var import_react_router2 = require("react-router");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-
-// src/client/file_input.tsx
-var import_react3 = require("react");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-
-// src/client/use_user_agent.tsx
-var import_react_router3 = require("react-router");
-
-// src/client/store_text_editor.tsx
-var import_gw_react_text_editor = require("gw-react-text-editor");
 var import_react_store_input2 = require("react-store-input");
-var import_react4 = require("react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-function StoreTextEditor({
-  store,
-  name,
-  getter,
-  setter,
-  defaultValue,
-  ref,
-  ...props
-}) {
-  const controllerRef = (0, import_react4.useRef)(null);
-  (0, import_react4.useImperativeHandle)(
-    ref,
-    () => controllerRef.current,
-    []
-  );
-  const { dispatch } = (0, import_react_store_input2.useStoreController)(store, {
-    onSubscribe: (state) => {
-      const controller = controllerRef.current;
-      if (!controller) {
-        return;
-      }
-      const getResult = () => {
-        if (getter) {
-          return getter(state) || "";
-        }
-        if (name) {
-          return state[name] || "";
-        }
-        return "";
-      };
-      const result = getResult();
-      if (controller.value !== result) {
-        controller.value = result;
-      }
-    },
-    onDispatch: (state) => {
-      const controller = controllerRef.current;
-      if (!controller) {
-        return;
-      }
-      if (setter) {
-        setter(state, controller.value);
-        return;
-      }
-      if (name) {
-        state[name] = controller.value;
-      }
-    }
-  });
-  const getDefaultValue = () => {
-    if (getter) {
-      return getter(store.state);
-    }
-    if (name) {
-      return store.state[name];
-    }
-    return void 0;
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    import_gw_react_text_editor.TextEditor,
-    {
-      ...props,
-      ref: controllerRef,
-      defaultValue: defaultValue ?? getDefaultValue(),
-      onChange: (e) => {
-        dispatch();
-        props.onChange?.(e);
-      }
-    }
-  );
-}
-
-// src/client/editor.tsx
-var import_client = require("gw-file/client");
-
-// src/crud/crud_form.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
-function CrudForm({
-  AdminHeader
-}) {
+var import_text_editor = require("react-store-input/text-editor");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function CrudForm({ AdminHeader }) {
   const form = useFormContext();
-  const component = (0, import_react_store_input3.useStoreComponent)(form.store);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  const component = (0, import_react_store_input2.useStoreComponent)(form.store);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
       AdminHeader,
       {
         title: `${form.name} ${form.item ? "\uC218\uC815" : "\uCD94\uAC00"}`,
-        actions: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
-          form.item && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        actions: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+          form.item && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             "button",
             {
               type: "button",
@@ -193,64 +99,47 @@ function CrudForm({
               children: "\uC0AD\uC81C\uD558\uAE30"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-            "button",
-            {
-              type: "button",
-              className: "button-primary",
-              onClick: form.submit,
-              children: "\uC800\uC7A5\uD558\uAE30"
-            }
-          )
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", className: "button-primary", onClick: form.submit, children: "\uC800\uC7A5\uD558\uAE30" })
         ] })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "max-w-2xl mx-auto", children: Object.keys(form.columns).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_jsx_runtime6.Fragment, { children: Object.entries(form.columns).map(
-      ([name, value]) => {
-        function InputComponent() {
-          if (value.component) {
-            const Component = value.component;
-            return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Component, { store: form.store, name });
-          }
-          if (value.type === "textarea") {
-            return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-              StoreTextEditor,
-              {
-                store: form.store,
-                name,
-                editor: {
-                  attributes: {
-                    class: "text-editor-form"
-                  }
-                }
-              }
-            );
-          }
-          if (value.options) {
-            const Component = value.options;
-            return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(component.select, { name, className: "select-form", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Component, {}) });
-          }
-          return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-            component.input,
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "max-w-2xl mx-auto", children: Object.keys(form.columns).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: Object.entries(form.columns).map(([name, value]) => {
+      function InputComponent() {
+        if (value.component) {
+          const Component = value.component;
+          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Component, { store: form.store, name });
+        }
+        if (value.type === "textarea") {
+          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            import_text_editor.TextEditor,
             {
+              store: form.store,
               name,
-              type: value.type,
-              className: "input-form"
+              editor: {
+                attributes: {
+                  class: "text-editor-form"
+                }
+              }
             }
           );
         }
-        const v = form.store.state[name];
-        if (typeof v === "boolean") {
-          return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex", children: [
-            value.label,
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "ml-auto", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(InputComponent, {}) })
-          ] });
+        if (value.options) {
+          const Component = value.options;
+          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(component.select, { name, className: "select-form", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Component, {}) });
         }
-        return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FormRow, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(FormEntry, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FormLabel, { children: value.label }, name),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(InputComponent, {})
-        ] }) }, name);
+        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(component.input, { name, type: value.type, className: "input-form" });
+      }
+      const v = form.store.state[name];
+      if (typeof v === "boolean") {
+        return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex", children: [
+          value.label,
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "ml-auto", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(InputComponent, {}) })
+        ] });
       }
-    ) }) })
+      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(FormRow, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(FormEntry, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(FormLabel, { children: value.label }, name),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(InputComponent, {})
+      ] }) }, name);
+    }) }) })
   ] });
 }

package/dist/crud/crud_form.mjs

@@ -1,10 +1,7 @@
 // src/crud/crud_form_provider.tsx
 import { useNavigate } from "react-router";
 import { useStore } from "react-store-input";
-import {
-  createContext,
-  useContext
-} from "react";
+import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 var FormContext = createContext({});
 function useFormContext() {
@@ -44,116 +41,18 @@ var FormLabel = createComponent("label", {
 
 // src/crud/crud_form.tsx
 import { useStoreComponent } from "react-store-input";
-
-// src/client/env_loader.tsx
-import { useRouteLoaderData } from "react-router";
-import { jsx as jsx3 } from "react/jsx-runtime";
-
-// src/client/file_input.tsx
-import {
-  useRef
-} from "react";
-import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
-
-// src/client/use_user_agent.tsx
-import { useRouteLoaderData as useRouteLoaderData2 } from "react-router";
-
-// src/client/store_text_editor.tsx
-import {
-  TextEditor
-} from "gw-react-text-editor";
-import { useStoreController } from "react-store-input";
-import { useImperativeHandle, useRef as useRef2 } from "react";
-import { jsx as jsx5 } from "react/jsx-runtime";
-function StoreTextEditor({
-  store,
-  name,
-  getter,
-  setter,
-  defaultValue,
-  ref,
-  ...props
-}) {
-  const controllerRef = useRef2(null);
-  useImperativeHandle(
-    ref,
-    () => controllerRef.current,
-    []
-  );
-  const { dispatch } = useStoreController(store, {
-    onSubscribe: (state) => {
-      const controller = controllerRef.current;
-      if (!controller) {
-        return;
-      }
-      const getResult = () => {
-        if (getter) {
-          return getter(state) || "";
-        }
-        if (name) {
-          return state[name] || "";
-        }
-        return "";
-      };
-      const result = getResult();
-      if (controller.value !== result) {
-        controller.value = result;
-      }
-    },
-    onDispatch: (state) => {
-      const controller = controllerRef.current;
-      if (!controller) {
-        return;
-      }
-      if (setter) {
-        setter(state, controller.value);
-        return;
-      }
-      if (name) {
-        state[name] = controller.value;
-      }
-    }
-  });
-  const getDefaultValue = () => {
-    if (getter) {
-      return getter(store.state);
-    }
-    if (name) {
-      return store.state[name];
-    }
-    return void 0;
-  };
-  return /* @__PURE__ */ jsx5(
-    TextEditor,
-    {
-      ...props,
-      ref: controllerRef,
-      defaultValue: defaultValue ?? getDefaultValue(),
-      onChange: (e) => {
-        dispatch();
-        props.onChange?.(e);
-      }
-    }
-  );
-}
-
-// src/client/editor.tsx
-import { generateMetadata } from "gw-file/client";
-
-// src/crud/crud_form.tsx
-import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
-function CrudForm({
-  AdminHeader
-}) {
+import { TextEditor } from "react-store-input/text-editor";
+import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
+function CrudForm({ AdminHeader }) {
   const form = useFormContext();
   const component = useStoreComponent(form.store);
-  return /* @__PURE__ */ jsxs2(Fragment2, { children: [
-    /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx3(
       AdminHeader,
       {
         title: `${form.name} ${form.item ? "\uC218\uC815" : "\uCD94\uAC00"}`,
-        actions: /* @__PURE__ */ jsxs2(Fragment2, { children: [
-          form.item && /* @__PURE__ */ jsx6(
+        actions: /* @__PURE__ */ jsxs(Fragment, { children: [
+          form.item && /* @__PURE__ */ jsx3(
             "button",
             {
               type: "button",
@@ -164,65 +63,48 @@ function CrudForm({
               children: "\uC0AD\uC81C\uD558\uAE30"
             }
           ),
-          /* @__PURE__ */ jsx6(
-            "button",
-            {
-              type: "button",
-              className: "button-primary",
-              onClick: form.submit,
-              children: "\uC800\uC7A5\uD558\uAE30"
-            }
-          )
+          /* @__PURE__ */ jsx3("button", { type: "button", className: "button-primary", onClick: form.submit, children: "\uC800\uC7A5\uD558\uAE30" })
         ] })
       }
     ),
-    /* @__PURE__ */ jsx6("div", { className: "max-w-2xl mx-auto", children: Object.keys(form.columns).length > 0 && /* @__PURE__ */ jsx6(Fragment2, { children: Object.entries(form.columns).map(
-      ([name, value]) => {
-        function InputComponent() {
-          if (value.component) {
-            const Component = value.component;
-            return /* @__PURE__ */ jsx6(Component, { store: form.store, name });
-          }
-          if (value.type === "textarea") {
-            return /* @__PURE__ */ jsx6(
-              StoreTextEditor,
-              {
-                store: form.store,
-                name,
-                editor: {
-                  attributes: {
-                    class: "text-editor-form"
-                  }
-                }
-              }
-            );
-          }
-          if (value.options) {
-            const Component = value.options;
-            return /* @__PURE__ */ jsx6(component.select, { name, className: "select-form", children: /* @__PURE__ */ jsx6(Component, {}) });
-          }
-          return /* @__PURE__ */ jsx6(
-            component.input,
+    /* @__PURE__ */ jsx3("div", { className: "max-w-2xl mx-auto", children: Object.keys(form.columns).length > 0 && /* @__PURE__ */ jsx3(Fragment, { children: Object.entries(form.columns).map(([name, value]) => {
+      function InputComponent() {
+        if (value.component) {
+          const Component = value.component;
+          return /* @__PURE__ */ jsx3(Component, { store: form.store, name });
+        }
+        if (value.type === "textarea") {
+          return /* @__PURE__ */ jsx3(
+            TextEditor,
             {
+              store: form.store,
               name,
-              type: value.type,
-              className: "input-form"
+              editor: {
+                attributes: {
+                  class: "text-editor-form"
+                }
+              }
             }
           );
         }
-        const v = form.store.state[name];
-        if (typeof v === "boolean") {
-          return /* @__PURE__ */ jsxs2("div", { className: "flex", children: [
-            value.label,
-            /* @__PURE__ */ jsx6("div", { className: "ml-auto", children: /* @__PURE__ */ jsx6(InputComponent, {}) })
-          ] });
+        if (value.options) {
+          const Component = value.options;
+          return /* @__PURE__ */ jsx3(component.select, { name, className: "select-form", children: /* @__PURE__ */ jsx3(Component, {}) });
         }
-        return /* @__PURE__ */ jsx6(FormRow, { children: /* @__PURE__ */ jsxs2(FormEntry, { children: [
-          /* @__PURE__ */ jsx6(FormLabel, { children: value.label }, name),
-          /* @__PURE__ */ jsx6(InputComponent, {})
-        ] }) }, name);
+        return /* @__PURE__ */ jsx3(component.input, { name, type: value.type, className: "input-form" });
+      }
+      const v = form.store.state[name];
+      if (typeof v === "boolean") {
+        return /* @__PURE__ */ jsxs("div", { className: "flex", children: [
+          value.label,
+          /* @__PURE__ */ jsx3("div", { className: "ml-auto", children: /* @__PURE__ */ jsx3(InputComponent, {}) })
+        ] });
       }
-    ) }) })
+      return /* @__PURE__ */ jsx3(FormRow, { children: /* @__PURE__ */ jsxs(FormEntry, { children: [
+        /* @__PURE__ */ jsx3(FormLabel, { children: value.label }, name),
+        /* @__PURE__ */ jsx3(InputComponent, {})
+      ] }) }, name);
+    }) }) })
   ] });
 }
 export {

package/dist/crud/crud_form_provider.d.mts

@@ -1,9 +1,8 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { HTMLInputTypeAttribute, FC, ReactNode } from 'react';
 import { Store } from 'react-store-input';
 
-type FormColumnValue<TModel> = {
+type FormColumnValue<TModel extends {}> = {
     label?: string;
     type?: HTMLInputTypeAttribute | "textarea";
     defaultValue?: TModel[keyof TModel];
@@ -13,10 +12,10 @@ type FormColumnValue<TModel> = {
     }>;
     options?: FC;
 };
-type FormColumns<TModel> = Partial<{
+type FormColumns<TModel extends {}> = Partial<{
     [K in keyof TModel]: FormColumnValue<TModel>;
 }>;
-type FormContextProps<TModel> = {
+type FormContextProps<TModel extends {}> = {
     name: string;
     item?: TModel;
     store: Store<TModel>;
@@ -25,8 +24,8 @@ type FormContextProps<TModel> = {
     columns: FormColumns<TModel>;
 };
 declare const FormContext: react.Context<{}>;
-declare function useFormContext<TModel>(): FormContextProps<TModel>;
-type CrudFormProps<TModel> = {
+declare function useFormContext<TModel extends {}>(): FormContextProps<TModel>;
+type CrudFormProps<TModel extends {}> = {
     primaryKey?: keyof TModel;
     name: string;
     prefix: string;
@@ -34,6 +33,6 @@ type CrudFormProps<TModel> = {
     columns?: FormColumns<TModel>;
     children?: ReactNode;
 };
-declare function CrudFormProvider<TModel>({ primaryKey, name, prefix, item, columns, children, }: CrudFormProps<TModel>): react_jsx_runtime.JSX.Element;
+declare function CrudFormProvider<TModel extends {}>({ primaryKey, name, prefix, item, columns, children, }: CrudFormProps<TModel>): react.JSX.Element;
 
 export { type CrudFormProps, type FormColumnValue, type FormColumns, FormContext, type FormContextProps, CrudFormProvider as default, useFormContext };