dn-react-router-toolkit 0.1.1 → 0.1.3

package/dist/components/modal/modal.js

@@ -0,0 +1,155 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/modal/modal.tsx
+var modal_exports = {};
+__export(modal_exports, {
+  default: () => Modal
+});
+module.exports = __toCommonJS(modal_exports);
+var import_react3 = __toESM(require("react"));
+
+// src/cn.ts
+function cn(...classes) {
+  return classes.filter(Boolean).join(" ").trim();
+}
+
+// src/components/modal/fullscreen_container.tsx
+var import_react = __toESM(require("react"));
+var import_react2 = require("react");
+function useFullscreen(ref) {
+  (0, import_react2.useEffect)(() => {
+    const container = ref.current;
+    if (!container) {
+      return;
+    }
+    const scroll = () => {
+      if (scrollY > 0) {
+        window.scrollTo({
+          top: 0,
+          behavior: "instant"
+        });
+      }
+    };
+    const resize = () => {
+      if (!visualViewport) {
+        return;
+      }
+      container.classList.remove("bottom-0");
+      container.style.height = `${visualViewport?.height}px`;
+      if (visualViewport.height < window.innerHeight) {
+        window.addEventListener("scroll", scroll);
+      } else {
+        window.removeEventListener("scroll", scroll);
+      }
+    };
+    resize();
+    visualViewport?.addEventListener("resize", resize);
+    scroll();
+    return () => {
+      window.removeEventListener("scroll", scroll);
+      visualViewport?.removeEventListener("resize", resize);
+    };
+  }, [ref]);
+  return "fixed inset-0";
+}
+
+// src/components/modal/modal.tsx
+function Modal({
+  open,
+  className,
+  background = "bg-gray-500/25",
+  onBackgroundClick,
+  children,
+  ...props
+}) {
+  const containerRef = (0, import_react3.useRef)(null);
+  const fullscreen = useFullscreen(containerRef);
+  const [mounted, setMounted] = import_react3.default.useState(false);
+  (0, import_react3.useEffect)(() => {
+    if (open) {
+      setMounted(true);
+    } else {
+      setTimeout(() => {
+        setMounted(false);
+      }, 200);
+    }
+    return () => {
+    };
+  }, [open]);
+  const onBackgroundMouseDown = (event) => {
+    event.preventDefault();
+    onBackgroundClick?.();
+  };
+  const onModalMouseDown = (event) => {
+    event.stopPropagation();
+  };
+  const onBackgroundTouchStart = (event) => {
+    event.preventDefault();
+    onBackgroundClick?.();
+  };
+  const onModalTouchStart = (event) => {
+    event.stopPropagation();
+  };
+  return /* @__PURE__ */ import_react3.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: cn(
+        fullscreen,
+        "z-[999] flex flex-col justify-center transition-bg duration-200 md:px-6 overflow-hidden print:px-0 print:block print:overflow-auto",
+        open && mounted ? cn(background, "ease-out") : "bg-transparent ease-in pointer-events-none"
+      ),
+      onMouseDown: onBackgroundMouseDown,
+      onTouchStart: onBackgroundTouchStart
+    },
+    /* @__PURE__ */ import_react3.default.createElement(
+      "div",
+      {
+        className: cn(
+          "relative flex-1 flex flex-col justify-end md:justify-center items-center transition-[opacity transform] duration-200 print:block",
+          open && mounted ? "translate-y-[0px] opacity-100 ease-out" : "translate-y-[100%] md:translate-y-[50px] opacity-0 ease-in"
+        )
+      },
+      (open || mounted) && /* @__PURE__ */ import_react3.default.createElement(
+        "div",
+        {
+          ...props,
+          className: cn(
+            className,
+            "w-full max-h-[92vh] print:w-[unset] print:max-h-[unset] rounded-tl-lg rounded-tr-lg md:rounded-lg overflow-auto print:rounded-none"
+          ),
+          onMouseDown: onModalMouseDown,
+          onTouchStart: onModalTouchStart
+        },
+        children
+      )
+    )
+  );
+}

package/dist/components/modal/modal.mjs

@@ -0,0 +1,130 @@
+// src/components/modal/modal.tsx
+import React2, {
+  useEffect as useEffect2,
+  useRef as useRef2
+} from "react";
+
+// src/cn.ts
+function cn(...classes) {
+  return classes.filter(Boolean).join(" ").trim();
+}
+
+// src/components/modal/fullscreen_container.tsx
+import React from "react";
+import {
+  useEffect,
+  useRef
+} from "react";
+function useFullscreen(ref) {
+  useEffect(() => {
+    const container = ref.current;
+    if (!container) {
+      return;
+    }
+    const scroll = () => {
+      if (scrollY > 0) {
+        window.scrollTo({
+          top: 0,
+          behavior: "instant"
+        });
+      }
+    };
+    const resize = () => {
+      if (!visualViewport) {
+        return;
+      }
+      container.classList.remove("bottom-0");
+      container.style.height = `${visualViewport?.height}px`;
+      if (visualViewport.height < window.innerHeight) {
+        window.addEventListener("scroll", scroll);
+      } else {
+        window.removeEventListener("scroll", scroll);
+      }
+    };
+    resize();
+    visualViewport?.addEventListener("resize", resize);
+    scroll();
+    return () => {
+      window.removeEventListener("scroll", scroll);
+      visualViewport?.removeEventListener("resize", resize);
+    };
+  }, [ref]);
+  return "fixed inset-0";
+}
+
+// src/components/modal/modal.tsx
+function Modal({
+  open,
+  className,
+  background = "bg-gray-500/25",
+  onBackgroundClick,
+  children,
+  ...props
+}) {
+  const containerRef = useRef2(null);
+  const fullscreen = useFullscreen(containerRef);
+  const [mounted, setMounted] = React2.useState(false);
+  useEffect2(() => {
+    if (open) {
+      setMounted(true);
+    } else {
+      setTimeout(() => {
+        setMounted(false);
+      }, 200);
+    }
+    return () => {
+    };
+  }, [open]);
+  const onBackgroundMouseDown = (event) => {
+    event.preventDefault();
+    onBackgroundClick?.();
+  };
+  const onModalMouseDown = (event) => {
+    event.stopPropagation();
+  };
+  const onBackgroundTouchStart = (event) => {
+    event.preventDefault();
+    onBackgroundClick?.();
+  };
+  const onModalTouchStart = (event) => {
+    event.stopPropagation();
+  };
+  return /* @__PURE__ */ React2.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: cn(
+        fullscreen,
+        "z-[999] flex flex-col justify-center transition-bg duration-200 md:px-6 overflow-hidden print:px-0 print:block print:overflow-auto",
+        open && mounted ? cn(background, "ease-out") : "bg-transparent ease-in pointer-events-none"
+      ),
+      onMouseDown: onBackgroundMouseDown,
+      onTouchStart: onBackgroundTouchStart
+    },
+    /* @__PURE__ */ React2.createElement(
+      "div",
+      {
+        className: cn(
+          "relative flex-1 flex flex-col justify-end md:justify-center items-center transition-[opacity transform] duration-200 print:block",
+          open && mounted ? "translate-y-[0px] opacity-100 ease-out" : "translate-y-[100%] md:translate-y-[50px] opacity-0 ease-in"
+        )
+      },
+      (open || mounted) && /* @__PURE__ */ React2.createElement(
+        "div",
+        {
+          ...props,
+          className: cn(
+            className,
+            "w-full max-h-[92vh] print:w-[unset] print:max-h-[unset] rounded-tl-lg rounded-tr-lg md:rounded-lg overflow-auto print:rounded-none"
+          ),
+          onMouseDown: onModalMouseDown,
+          onTouchStart: onModalTouchStart
+        },
+        children
+      )
+    )
+  );
+}
+export {
+  Modal as default
+};

package/dist/components/styles.d.mts

@@ -0,0 +1,9 @@
+declare const inputBackgroundStyle = "text-[16px] border border-neutral-200 outline-none appearance-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-neutral-400";
+declare const formInputStyle = "w-full px-3 text-[16px] border border-neutral-200 outline-none appearance-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-neutral-400 h-[40px]";
+declare const baseButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden";
+declare const primaryButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden px-4 h-[40px] bg-gradient-to-br from-primary-400 to-primary-500 text-white transition-colors";
+declare const disabledButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden h-[40px] px-4 bg-neutral-200 text-neutral-400";
+declare const outlineButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden h-[40px] px-4 bg-white border border-neutral-300 hover:bg-neutral-50";
+declare const dangerousButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden h-[40px] px-4 bg-white border hover:bg-red-50 text-red-600";
+
+export { baseButtonStyle, dangerousButtonStyle, disabledButtonStyle, formInputStyle, inputBackgroundStyle, outlineButtonStyle, primaryButtonStyle };

package/dist/components/styles.d.ts

@@ -0,0 +1,9 @@
+declare const inputBackgroundStyle = "text-[16px] border border-neutral-200 outline-none appearance-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-neutral-400";
+declare const formInputStyle = "w-full px-3 text-[16px] border border-neutral-200 outline-none appearance-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-neutral-400 h-[40px]";
+declare const baseButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden";
+declare const primaryButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden px-4 h-[40px] bg-gradient-to-br from-primary-400 to-primary-500 text-white transition-colors";
+declare const disabledButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden h-[40px] px-4 bg-neutral-200 text-neutral-400";
+declare const outlineButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden h-[40px] px-4 bg-white border border-neutral-300 hover:bg-neutral-50";
+declare const dangerousButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden h-[40px] px-4 bg-white border hover:bg-red-50 text-red-600";
+
+export { baseButtonStyle, dangerousButtonStyle, disabledButtonStyle, formInputStyle, inputBackgroundStyle, outlineButtonStyle, primaryButtonStyle };

package/dist/components/styles.js

@@ -0,0 +1,48 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/styles.ts
+var styles_exports = {};
+__export(styles_exports, {
+  baseButtonStyle: () => baseButtonStyle,
+  dangerousButtonStyle: () => dangerousButtonStyle,
+  disabledButtonStyle: () => disabledButtonStyle,
+  formInputStyle: () => formInputStyle,
+  inputBackgroundStyle: () => inputBackgroundStyle,
+  outlineButtonStyle: () => outlineButtonStyle,
+  primaryButtonStyle: () => primaryButtonStyle
+});
+module.exports = __toCommonJS(styles_exports);
+var inputBackgroundStyle = "text-[16px] border border-neutral-200 outline-none appearance-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-neutral-400";
+var formInputStyle = `w-full px-3 ${inputBackgroundStyle} h-[40px]`;
+var baseButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden";
+var primaryButtonStyle = `${baseButtonStyle} px-4 h-[40px] bg-gradient-to-br from-primary-400 to-primary-500 text-white transition-colors`;
+var disabledButtonStyle = `${baseButtonStyle} h-[40px] px-4 bg-neutral-200 text-neutral-400`;
+var outlineButtonStyle = `${baseButtonStyle} h-[40px] px-4 bg-white border border-neutral-300 hover:bg-neutral-50`;
+var dangerousButtonStyle = `${baseButtonStyle} h-[40px] px-4 bg-white border hover:bg-red-50 text-red-600`;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  baseButtonStyle,
+  dangerousButtonStyle,
+  disabledButtonStyle,
+  formInputStyle,
+  inputBackgroundStyle,
+  outlineButtonStyle,
+  primaryButtonStyle
+});

package/dist/components/styles.mjs

@@ -0,0 +1,17 @@
+// src/components/styles.ts
+var inputBackgroundStyle = "text-[16px] border border-neutral-200 outline-none appearance-none disabled:opacity-50 disabled:cursor-not-allowed placeholder:text-neutral-400";
+var formInputStyle = `w-full px-3 ${inputBackgroundStyle} h-[40px]`;
+var baseButtonStyle = "transition-colors text-sm font-semibold cursor-pointer flex items-center justify-center rounded-lg whitespace-nowrap text-ellipsis overflow-hidden";
+var primaryButtonStyle = `${baseButtonStyle} px-4 h-[40px] bg-gradient-to-br from-primary-400 to-primary-500 text-white transition-colors`;
+var disabledButtonStyle = `${baseButtonStyle} h-[40px] px-4 bg-neutral-200 text-neutral-400`;
+var outlineButtonStyle = `${baseButtonStyle} h-[40px] px-4 bg-white border border-neutral-300 hover:bg-neutral-50`;
+var dangerousButtonStyle = `${baseButtonStyle} h-[40px] px-4 bg-white border hover:bg-red-50 text-red-600`;
+export {
+  baseButtonStyle,
+  dangerousButtonStyle,
+  disabledButtonStyle,
+  formInputStyle,
+  inputBackgroundStyle,
+  outlineButtonStyle,
+  primaryButtonStyle
+};

package/dist/date.d.mts

@@ -0,0 +1,3 @@
+declare const formatHumanDateTime: (value: string | Date) => string;
+
+export { formatHumanDateTime };

package/dist/date.d.ts

@@ -0,0 +1,3 @@
+declare const formatHumanDateTime: (value: string | Date) => string;
+
+export { formatHumanDateTime };

package/dist/date.js

@@ -0,0 +1,63 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/date.ts
+var date_exports = {};
+__export(date_exports, {
+  formatHumanDateTime: () => formatHumanDateTime
+});
+module.exports = __toCommonJS(date_exports);
+var import_moment_timezone = __toESM(require("moment-timezone"));
+var formatHumanDateTime = (value) => {
+  const date = (0, import_moment_timezone.default)(value).tz("Asia/Seoul");
+  const now = (0, import_moment_timezone.default)().tz("Asia/Seoul");
+  if (date.isAfter(now.clone().subtract(1, "minute"))) {
+    return "\uBC29\uAE08 \uC804";
+  }
+  if (date.isAfter(now.clone().subtract(1, "hour"))) {
+    const diff = now.diff(date, "minute");
+    return `${diff}\uBD84 \uC804`;
+  }
+  if (date.isAfter(now.clone().subtract(6, "hours"))) {
+    const diff = now.diff(date, "hour");
+    return `${diff}\uC2DC\uAC04 \uC804`;
+  }
+  if (date.isAfter(now.clone().subtract(1, "week"))) {
+    const diff = now.diff(date, "day");
+    return `${diff}\uC77C \uC804`;
+  }
+  if (date.isSame(now, "year")) {
+    return date.format("M\uC6D4 D\uC77C");
+  }
+  return date.format("YYYY\uB144 M\uC6D4 D\uC77C");
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  formatHumanDateTime
+});

package/dist/date.mjs

@@ -0,0 +1,28 @@
+// src/date.ts
+import moment from "moment-timezone";
+var formatHumanDateTime = (value) => {
+  const date = moment(value).tz("Asia/Seoul");
+  const now = moment().tz("Asia/Seoul");
+  if (date.isAfter(now.clone().subtract(1, "minute"))) {
+    return "\uBC29\uAE08 \uC804";
+  }
+  if (date.isAfter(now.clone().subtract(1, "hour"))) {
+    const diff = now.diff(date, "minute");
+    return `${diff}\uBD84 \uC804`;
+  }
+  if (date.isAfter(now.clone().subtract(6, "hours"))) {
+    const diff = now.diff(date, "hour");
+    return `${diff}\uC2DC\uAC04 \uC804`;
+  }
+  if (date.isAfter(now.clone().subtract(1, "week"))) {
+    const diff = now.diff(date, "day");
+    return `${diff}\uC77C \uC804`;
+  }
+  if (date.isSame(now, "year")) {
+    return date.format("M\uC6D4 D\uC77C");
+  }
+  return date.format("YYYY\uB144 M\uC6D4 D\uC77C");
+};
+export {
+  formatHumanDateTime
+};

package/dist/file-kit/cdn.d.mts

@@ -0,0 +1,5 @@
+declare const createCDN: (origin: string) => <T extends string | undefined>(key: T, { width }?: {
+    width?: number;
+}) => T extends undefined ? T : string;
+
+export { createCDN };

package/dist/file-kit/cdn.d.ts

@@ -0,0 +1,5 @@
+declare const createCDN: (origin: string) => <T extends string | undefined>(key: T, { width }?: {
+    width?: number;
+}) => T extends undefined ? T : string;
+
+export { createCDN };

package/dist/file-kit/cdn.js

@@ -0,0 +1,34 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/file-kit/cdn.ts
+var cdn_exports = {};
+__export(cdn_exports, {
+  createCDN: () => createCDN
+});
+module.exports = __toCommonJS(cdn_exports);
+var createCDN = (origin) => {
+  return (key, { width } = {}) => {
+    return key ? `${origin}/${key}${width ? `?w=${width}` : ""}` : void 0;
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createCDN
+});

package/dist/file-kit/cdn.mjs

@@ -0,0 +1,9 @@
+// src/file-kit/cdn.ts
+var createCDN = (origin) => {
+  return (key, { width } = {}) => {
+    return key ? `${origin}/${key}${width ? `?w=${width}` : ""}` : void 0;
+  };
+};
+export {
+  createCDN
+};

package/dist/file-kit/client/drop_file_input.d.mts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { FileUploaderOptions } from './file_uploader.mjs';
+
+type FileInputProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "defaultValue" | "onChange"> & {
+    container?: string;
+    accept?: string;
+    multiple?: boolean;
+    name?: string;
+    hideMessage?: boolean;
+    draggingClassName?: (value: boolean) => string;
+};
+type FileItem<T> = {
+    key: string;
+    item?: T;
+};
+type Props<T> = {
+    defaultValue?: T | T[];
+    options?: FileUploaderOptions;
+    uploadFile?: (file: File, options?: FileUploaderOptions) => Promise<T>;
+    onFileInput?: (files: File[]) => void;
+    onFileUploaded?: (file: T) => Promise<void>;
+    onChange?: (files: FileItem<T>[]) => void;
+    limit?: number;
+};
+declare function useDropFileInput<T>({ defaultValue, options, uploadFile, onFileInput, onFileUploaded, limit, }?: Props<T>): {
+    fileIds: string[];
+    files: FileItem<T>[];
+    setFiles: React.Dispatch<React.SetStateAction<FileItem<T>[]>>;
+    Component: ({ className, container, draggingClassName, name, hideMessage, children, ...props }: FileInputProps) => React.JSX.Element;
+};
+declare function DropFileMessageBox(): React.JSX.Element;
+
+export { DropFileMessageBox, type FileInputProps, type FileItem, useDropFileInput as default, useDropFileInput };

package/dist/{esm/file-kit → file-kit}/client/drop_file_input.d.ts

@@ -1,6 +1,7 @@
-import React from "react";
-import { type FileUploaderOptions } from "./file_uploader";
-export type FileInputProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "defaultValue" | "onChange"> & {
+import React from 'react';
+import { FileUploaderOptions } from './file_uploader.js';
+
+type FileInputProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "defaultValue" | "onChange"> & {
     container?: string;
     accept?: string;
     multiple?: boolean;
@@ -8,7 +9,7 @@ export type FileInputProps = Omit<React.DetailedHTMLProps<React.InputHTMLAttribu
     hideMessage?: boolean;
     draggingClassName?: (value: boolean) => string;
 };
-export type FileItem<T> = {
+type FileItem<T> = {
     key: string;
     item?: T;
 };
@@ -21,11 +22,12 @@ type Props<T> = {
     onChange?: (files: FileItem<T>[]) => void;
     limit?: number;
 };
-export declare function useDropFileInput<T>({ defaultValue, options, uploadFile, onFileInput, onFileUploaded, limit, }?: Props<T>): {
+declare function useDropFileInput<T>({ defaultValue, options, uploadFile, onFileInput, onFileUploaded, limit, }?: Props<T>): {
     fileIds: string[];
     files: FileItem<T>[];
     setFiles: React.Dispatch<React.SetStateAction<FileItem<T>[]>>;
-    Component: ({ className, container, draggingClassName, name, hideMessage, children, ...props }: FileInputProps) => import("react/jsx-runtime").JSX.Element;
+    Component: ({ className, container, draggingClassName, name, hideMessage, children, ...props }: FileInputProps) => React.JSX.Element;
 };
-export declare function DropFileMessageBox(): import("react/jsx-runtime").JSX.Element;
-export default useDropFileInput;
+declare function DropFileMessageBox(): React.JSX.Element;
+
+export { DropFileMessageBox, type FileInputProps, type FileItem, useDropFileInput as default, useDropFileInput };