dn-react-router-toolkit 0.1.0 → 0.1.1

package/dist/cjs/seo-kit/seo.js

@@ -1,15 +1,11 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.configSEO = configSEO;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 function configSEO(config) {
     return {
         config,
         async init(props = {}) {
-            var _a;
             const canonicalPath = props.canonicalPath;
             const url = canonicalPath
                 ? `${config.origin}${canonicalPath}`
@@ -34,7 +30,7 @@ function configSEO(config) {
                 (typeof config.thumbnail === "function"
                     ? await config.thumbnail()
                     : config.thumbnail);
-            const thumbnailUrl = thumbnail === null || thumbnail === void 0 ? void 0 : thumbnail.url;
+            const thumbnailUrl = thumbnail?.url;
             const socialImage = thumbnail
                 ? [
                     typeof thumbnail === "string"
@@ -56,7 +52,7 @@ function configSEO(config) {
                     ]
                     : []),
                 ...(props.images || []),
-                ...(((_a = props.collection) === null || _a === void 0 ? void 0 : _a.map((portfolio) => portfolio.thumbnail)) || []),
+                ...(props.collection?.map((portfolio) => portfolio.thumbnail) || []),
             ].filter(Boolean);
             const image = images
                 .filter((file) => file.id)
@@ -71,7 +67,7 @@ function configSEO(config) {
                 return [
                     { title: pageTitle },
                     { name: "description", content: description },
-                    { name: "keywords", content: (keywords === null || keywords === void 0 ? void 0 : keywords.join(", ")) || "" },
+                    { name: "keywords", content: keywords?.join(", ") || "" },
                     {
                         tagName: "link",
                         rel: "canonical",
@@ -111,24 +107,21 @@ function configSEO(config) {
                     ? {
                         "@type": "ItemList",
                         numberOfItems: props.collection.length,
-                        itemListElement: props.collection.map((item, index) => {
-                            var _a, _b, _c, _d;
-                            return ({
-                                "@type": "ListItem",
-                                position: index + 1,
+                        itemListElement: props.collection.map((item, index) => ({
+                            "@type": "ListItem",
+                            position: index + 1,
+                            url: item.url,
+                            item: {
+                                "@type": "WebPage",
+                                "@id": `${item.url}#webpage`,
                                 url: item.url,
-                                item: {
-                                    "@type": "WebPage",
-                                    "@id": `${item.url}#webpage`,
-                                    url: item.url,
-                                    name: item.title,
-                                    thumbnailUrl: (_a = item.thumbnail) === null || _a === void 0 ? void 0 : _a.url,
-                                    dateModified: (_b = item.updatedAt) === null || _b === void 0 ? void 0 : _b.toISOString(),
-                                    dateCreated: (_c = item.createdAt) === null || _c === void 0 ? void 0 : _c.toISOString(),
-                                    datePublished: (_d = item.createdAt) === null || _d === void 0 ? void 0 : _d.toISOString(),
-                                },
-                            });
-                        }),
+                                name: item.title,
+                                thumbnailUrl: item.thumbnail?.url,
+                                dateModified: item.updatedAt?.toISOString(),
+                                dateCreated: item.createdAt?.toISOString(),
+                                datePublished: item.createdAt?.toISOString(),
+                            },
+                        })),
                     }
                     : undefined;
                 return {
@@ -141,9 +134,9 @@ function configSEO(config) {
                             name: pageTitle,
                             description,
                             keywords: keywords,
-                            dateModified: updatedAt === null || updatedAt === void 0 ? void 0 : updatedAt.toISOString(),
-                            datePublished: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
-                            dateCreated: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
+                            dateModified: updatedAt?.toISOString(),
+                            datePublished: createdAt?.toISOString(),
+                            dateCreated: createdAt?.toISOString(),
                             primaryImageOfPage: thumbnail
                                 ? {
                                     "@id": thumbnailSchemaId,
@@ -170,9 +163,9 @@ function configSEO(config) {
                                 description,
                                 keywords: keywords,
                                 headline: pageTitle,
-                                dateModified: updatedAt === null || updatedAt === void 0 ? void 0 : updatedAt.toISOString(),
-                                datePublished: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
-                                dateCreated: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
+                                dateModified: updatedAt?.toISOString(),
+                                datePublished: createdAt?.toISOString(),
+                                dateCreated: createdAt?.toISOString(),
                                 isPartOf: {
                                     "@id": websiteSchemaId,
                                 },
@@ -187,8 +180,8 @@ function configSEO(config) {
                                 headline: pageTitle,
                                 description: description,
                                 thumbnailUrl,
-                                datePublished: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
-                                dateModified: updatedAt === null || updatedAt === void 0 ? void 0 : updatedAt.toISOString(),
+                                datePublished: createdAt?.toISOString(),
+                                dateModified: updatedAt?.toISOString(),
                                 isPartOf: { "@id": websiteSchemaId },
                                 image,
                             },
@@ -199,8 +192,8 @@ function configSEO(config) {
                                 url,
                                 name: pageTitle,
                                 description: description,
-                                datePublished: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
-                                dateModified: updatedAt === null || updatedAt === void 0 ? void 0 : updatedAt.toISOString(),
+                                datePublished: createdAt?.toISOString(),
+                                dateModified: updatedAt?.toISOString(),
                                 isPartOf: { "@id": websiteSchemaId },
                                 thumbnailUrl,
                                 image,
@@ -212,8 +205,8 @@ function configSEO(config) {
                                 url,
                                 name: pageTitle,
                                 description: description,
-                                datePublished: createdAt === null || createdAt === void 0 ? void 0 : createdAt.toISOString(),
-                                dateModified: updatedAt === null || updatedAt === void 0 ? void 0 : updatedAt.toISOString(),
+                                datePublished: createdAt?.toISOString(),
+                                dateModified: updatedAt?.toISOString(),
                                 isPartOf: { "@id": websiteSchemaId },
                                 thumbnailUrl,
                                 image,
@@ -250,7 +243,6 @@ function configSEO(config) {
                             },
                         ...additionalStructedData,
                         ...images.map((file) => {
-                            var _a, _b;
                             return {
                                 "@type": "ImageObject",
                                 "@id": `${url}/#${file.id}`,
@@ -258,8 +250,8 @@ function configSEO(config) {
                                 contentUrl: file.url,
                                 name: file.alt,
                                 description: file.alt,
-                                width: (_a = file === null || file === void 0 ? void 0 : file.width) === null || _a === void 0 ? void 0 : _a.toString(),
-                                height: (_b = file === null || file === void 0 ? void 0 : file.height) === null || _b === void 0 ? void 0 : _b.toString(),
+                                width: file?.width?.toString(),
+                                height: file?.height?.toString(),
                                 creditText: config.copyright,
                                 license: `${config.origin}/terms`,
                                 copyrightNotice: config.copyright,
@@ -271,7 +263,7 @@ function configSEO(config) {
             }
             function generateJSONLD() {
                 const structedData = getStructedData();
-                return (react_1.default.createElement("script", { type: "application/ld+json", dangerouslySetInnerHTML: {
+                return ((0, jsx_runtime_1.jsx)("script", { type: "application/ld+json", dangerouslySetInnerHTML: {
                         __html: JSON.stringify(structedData).replace(/</g, "\\u003c"),
                     } }));
             }

package/dist/cjs/seo-kit/seo_loader.js

@@ -1,19 +1,15 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createSEOLoader = createSEOLoader;
+const jsx_runtime_1 = require("react/jsx-runtime");
 const loader_1 = require("./loader");
-const react_1 = __importDefault(require("react"));
 function createSEOLoader(fn = () => ({})) {
     const loader = (0, loader_1.createLoader)(fn);
-    return Object.assign(Object.assign({}, loader), { meta: loader.wrap((data) => data.seo.meta), Page(Fc) {
-            return loader.wrap((data) => {
-                var _a;
-                return (react_1.default.createElement(react_1.default.Fragment, null, (_a = data.seo) === null || _a === void 0 ? void 0 :
-                    _a.generateJSONLD(),
-                    react_1.default.createElement(Fc, Object.assign({}, data))));
-            });
-        } });
+    return {
+        ...loader,
+        meta: loader.wrap((data) => data.seo.meta),
+        Page(Fc) {
+            return loader.wrap((data) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [data.seo?.generateJSONLD(), (0, jsx_runtime_1.jsx)(Fc, { ...data })] })));
+        },
+    };
 }

package/dist/esm/auth-kit/apple_auth.js

@@ -1,5 +1,6 @@
 import { decodeJwt, importPKCS8, SignJWT } from "jose";
 export class AppleAuth {
+    AUTH;
     constructor(AUTH) {
         this.AUTH = AUTH;
     }

package/dist/esm/auth-kit/auth_service.js

@@ -16,14 +16,16 @@ export const REFRESH_TOKEN_COOKIE = createCookie(REFRESH_TOKEN_KEY, {
     sameSite: "strict",
 });
 export class AuthService {
+    repository;
+    JWT_MANAGER;
+    OBJECT_STORAGE;
     constructor({ repository, JWT_MANAGER, OBJECT_STORAGE, }) {
         this.repository = repository;
         this.JWT_MANAGER = JWT_MANAGER;
         this.OBJECT_STORAGE = OBJECT_STORAGE;
     }
     async verify(request) {
-        var _a;
-        const accessToken = ((_a = request === null || request === void 0 ? void 0 : request.headers.get("Authorization")) === null || _a === void 0 ? void 0 : _a.replace("Bearer ", "")) ||
+        const accessToken = request?.headers.get("Authorization")?.replace("Bearer ", "") ||
             (await this.getAccessTokenFromCookies(request));
         if (accessToken) {
             return this.JWT_MANAGER.verifyAccessToken(accessToken);
@@ -37,14 +39,12 @@ export class AuthService {
         return this.refresh(request);
     }
     async getAccessTokenFromCookies(request) {
-        var _a;
         const cookieStore = await ACCESS_TOKEN_COOKIE.parse(request.headers.get("cookie"));
-        return (_a = cookieStore.get(ACCESS_TOKEN_KEY)) === null || _a === void 0 ? void 0 : _a.value;
+        return cookieStore.get(ACCESS_TOKEN_KEY)?.value;
     }
     async getRefreshTokenFromCookies(request) {
-        var _a;
         const cookieStore = await REFRESH_TOKEN_COOKIE.parse(request.headers.get("cookie"));
-        return (_a = cookieStore.get(REFRESH_TOKEN_KEY)) === null || _a === void 0 ? void 0 : _a.value;
+        return cookieStore.get(REFRESH_TOKEN_KEY)?.value;
     }
     async refresh(request) {
         const refreshToken = await this.getRefreshTokenFromCookies(request);

package/dist/esm/auth-kit/client/google_login_button.d.ts

@@ -1,6 +1,5 @@
-import React from "react";
 export declare function GoogleLoginButton({ className, GOOGLE_CLIENT_ID, GOOGLE_REDIRECT_URI, }: {
     className?: string;
     GOOGLE_CLIENT_ID: string;
     GOOGLE_REDIRECT_URI: string;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/esm/auth-kit/client/google_login_button.js

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FcGoogle } from "react-icons/fc";
 import { useSearchParams } from "react-router";
 export function GoogleLoginButton({ className = "max-w-[300px] w-full", GOOGLE_CLIENT_ID, GOOGLE_REDIRECT_URI, }) {
@@ -12,8 +12,5 @@ export function GoogleLoginButton({ className = "max-w-[300px] w-full", GOOGLE_C
     href.searchParams.append("response_type", "code");
     href.searchParams.append("scope", "email profile");
     href.searchParams.append("state", redirectUrl);
-    return (React.createElement("div", { className: className },
-        React.createElement("a", { href: href.toString(), className: "relative flex items-center border border-neutral-300 px-4 py-3 no-underline hover:no-underline bg-white hover:bg-neutral-100 rounded" },
-            React.createElement(FcGoogle, null),
-            React.createElement("p", { className: "text-[14px] text-black absolute left-0 right-0 text-center" }, "\uAD6C\uAE00\uB85C \uACC4\uC18D\uD558\uAE30"))));
+    return (_jsx("div", { className: className, children: _jsxs("a", { href: href.toString(), className: "relative flex items-center border border-neutral-300 px-4 py-3 no-underline hover:no-underline bg-white hover:bg-neutral-100 rounded", children: [_jsx(FcGoogle, {}), _jsx("p", { className: "text-[14px] text-black absolute left-0 right-0 text-center", children: "\uAD6C\uAE00\uB85C \uACC4\uC18D\uD558\uAE30" })] }) }));
 }

package/dist/esm/auth-kit/client/redirect_page.d.ts

@@ -1,2 +1 @@
-import React from "react";
-export declare function RedirectPage(): React.JSX.Element;
+export declare function RedirectPage(): import("react/jsx-runtime").JSX.Element;

package/dist/esm/auth-kit/client/redirect_page.js

@@ -1,4 +1,4 @@
-import React from "react";
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { useNavigate } from "react-router";
 export function RedirectPage() {
@@ -11,5 +11,5 @@ export function RedirectPage() {
             navigate(redirectUrl);
         }
     }, [navigate]);
-    return React.createElement(React.Fragment, null);
+    return _jsx(_Fragment, {});
 }

package/dist/esm/auth-kit/google_auth.js

@@ -1,5 +1,9 @@
 import { BAD_REQUEST, createJsonResponse, INTERNAL_SERVER_ERROR, } from "../http-kit/response";
 export class GoogleAuth {
+    AUTH;
+    GOOGLE_CLIENT_ID;
+    GOOGLE_CLIENT_SECRET;
+    GOOGLE_REDIRECT_URI;
     constructor(AUTH, GOOGLE_CLIENT_ID, GOOGLE_CLIENT_SECRET, GOOGLE_REDIRECT_URI) {
         this.GOOGLE_CLIENT_ID = GOOGLE_CLIENT_ID;
         this.GOOGLE_CLIENT_SECRET = GOOGLE_CLIENT_SECRET;

package/dist/esm/auth-kit/jwt.js

@@ -1,5 +1,6 @@
 import { SignJWT, decodeJwt, jwtVerify } from "jose";
 export class JWTManager {
+    siteOrigin;
     constructor(siteOrigin) {
         this.siteOrigin = siteOrigin;
     }

package/dist/esm/auth-kit/kakao_auth.js

@@ -1,5 +1,6 @@
 import { createJsonResponse } from "../http-kit";
 export class KakaoAuth {
+    AUTH;
     constructor(AUTH) {
         this.AUTH = AUTH;
     }
@@ -22,7 +23,11 @@ export class KakaoAuth {
         };
         const user = await this.AUTH.findUser("kakao", payload);
         if (!user) {
-            throw createJsonResponse(404)(Object.assign(Object.assign({ provider: "kakao" }, payload), { message: "사용자를 찾을 수 없습니다." }));
+            throw createJsonResponse(404)({
+                provider: "kakao",
+                ...payload,
+                message: "사용자를 찾을 수 없습니다.",
+            });
         }
         const { accessToken, refreshToken } = await this.AUTH.issueTokenPair(user);
         return {

package/dist/esm/components/modal/fullscreen_container.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import { type DetailedHTMLProps, type HTMLAttributes } from "react";
 export type Props = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
-export default function FullscreenContainer({ className, children, ...props }: Props): React.JSX.Element;
+export default function FullscreenContainer({ className, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export declare function useFullscreen(ref: React.RefObject<HTMLDivElement | null>): string;

package/dist/esm/components/modal/fullscreen_container.js

@@ -1,22 +1,10 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../../cn";
-import React from "react";
 import { useEffect, useRef, } from "react";
-export default function FullscreenContainer(_a) {
-    var { className, children } = _a, props = __rest(_a, ["className", "children"]);
+export default function FullscreenContainer({ className, children, ...props }) {
     const containerRef = useRef(null);
     useFullscreen(containerRef);
-    return (React.createElement("div", Object.assign({ ref: containerRef }, props, { className: cn("fixed left-0 right-0 top-0 bottom-0", className) }), children));
+    return (_jsx("div", { ref: containerRef, ...props, className: cn("fixed left-0 right-0 top-0 bottom-0", className), children: children }));
 }
 export function useFullscreen(ref) {
     useEffect(() => {
@@ -37,7 +25,7 @@ export function useFullscreen(ref) {
                 return;
             }
             container.classList.remove("bottom-0");
-            container.style.height = `${visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.height}px`;
+            container.style.height = `${visualViewport?.height}px`;
             if (visualViewport.height < window.innerHeight) {
                 window.addEventListener("scroll", scroll);
             }
@@ -46,11 +34,11 @@ export function useFullscreen(ref) {
             }
         };
         resize();
-        visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.addEventListener("resize", resize);
+        visualViewport?.addEventListener("resize", resize);
         scroll();
         return () => {
             window.removeEventListener("scroll", scroll);
-            visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.removeEventListener("resize", resize);
+            visualViewport?.removeEventListener("resize", resize);
         };
     }, [ref]);
     return "fixed inset-0";

package/dist/esm/components/modal/hooks.d.ts

@@ -11,5 +11,5 @@ export declare const ModalContext: React.Context<ModalContextProps>;
 export declare function useModal(): {
     open: () => void;
     close: () => void;
-    Modal: (props: Omit<ModalProps, "open">) => React.JSX.Element;
+    Modal: (props: Omit<ModalProps, "open">) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/esm/components/modal/hooks.js

@@ -1,7 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext, useCallback, useEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import Modal from "./modal";
-import React from "react";
 export function useModalRoot() {
     const [container, setContainer] = useState(null);
     useEffect(() => {
@@ -30,12 +30,10 @@ export const ModalContext = createContext({});
 export function useModal() {
     const ch2 = useRef(null);
     const open = () => {
-        var _a;
-        (_a = ch2.current) === null || _a === void 0 ? void 0 : _a.call(ch2, true);
+        ch2.current?.(true);
     };
     const close = () => {
-        var _a;
-        (_a = ch2.current) === null || _a === void 0 ? void 0 : _a.call(ch2, false);
+        ch2.current?.(false);
     };
     const Component = useCallback(function Component(props) {
         const [isOpen, setIsOpen] = useState(false);
@@ -59,7 +57,7 @@ export function useModal() {
                 // document.body.style.overflow = "";
             };
         }, [isOpen]);
-        return (React.createElement(ModalContext.Provider, { value: { open, close, isOpen } }, createPortal(React.createElement(Modal, Object.assign({}, props, { open: isOpen, onBackgroundClick: close })))));
+        return (_jsx(ModalContext.Provider, { value: { open, close, isOpen }, children: createPortal(_jsx(Modal, { ...props, open: isOpen, onBackgroundClick: close })) }));
     }, []);
     return {
         open,

package/dist/esm/components/modal/modal.d.ts

@@ -7,4 +7,4 @@ export type ModalProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivEle
     always?: boolean;
     background?: string;
 };
-export default function Modal({ open, className, background, onBackgroundClick, children, ...props }: ModalProps): React.JSX.Element;
+export default function Modal({ open, className, background, onBackgroundClick, children, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/modal/modal.js

@@ -1,19 +1,8 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+import { jsx as _jsx } from "react/jsx-runtime";
 import React, { useEffect, useRef, } from "react";
 import { useFullscreen } from "./fullscreen_container";
 import { cn } from "../../cn";
-export default function Modal(_a) {
-    var { open, className, background = "bg-gray-500/25", onBackgroundClick, children } = _a, props = __rest(_a, ["open", "className", "background", "onBackgroundClick", "children"]);
+export default function Modal({ open, className, background = "bg-gray-500/25", onBackgroundClick, children, ...props }) {
     const containerRef = useRef(null);
     const fullscreen = useFullscreen(containerRef);
     const [mounted, setMounted] = React.useState(false);
@@ -34,22 +23,21 @@ export default function Modal(_a) {
     }, [open]);
     const onBackgroundMouseDown = (event) => {
         event.preventDefault();
-        onBackgroundClick === null || onBackgroundClick === void 0 ? void 0 : onBackgroundClick();
+        onBackgroundClick?.();
     };
     const onModalMouseDown = (event) => {
         event.stopPropagation();
     };
     const onBackgroundTouchStart = (event) => {
         event.preventDefault();
-        onBackgroundClick === null || onBackgroundClick === void 0 ? void 0 : onBackgroundClick();
+        onBackgroundClick?.();
     };
     const onModalTouchStart = (event) => {
         event.stopPropagation();
     };
-    return (React.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
+    return (_jsx("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 },
-        React.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
+            : "bg-transparent ease-in pointer-events-none"), onMouseDown: onBackgroundMouseDown, onTouchStart: onBackgroundTouchStart, children: _jsx("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) && (React.createElement("div", Object.assign({}, 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)))));
+                : "translate-y-[100%] md:translate-y-[50px] opacity-0 ease-in"), children: (open || mounted) && (_jsx("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: children })) }) }));
 }

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

@@ -25,7 +25,7 @@ export declare function useDropFileInput<T>({ defaultValue, options, uploadFile,
     fileIds: string[];
     files: FileItem<T>[];
     setFiles: React.Dispatch<React.SetStateAction<FileItem<T>[]>>;
-    Component: ({ className, container, draggingClassName, name, hideMessage, children, ...props }: FileInputProps) => React.JSX.Element;
+    Component: ({ className, container, draggingClassName, name, hideMessage, children, ...props }: FileInputProps) => import("react/jsx-runtime").JSX.Element;
 };
-export declare function DropFileMessageBox(): React.JSX.Element;
+export declare function DropFileMessageBox(): import("react/jsx-runtime").JSX.Element;
 export default useDropFileInput;

package/dist/esm/file-kit/client/drop_file_input.js

@@ -1,15 +1,5 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React, { useState, useCallback, useRef, useEffect, useMemo, } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useRef, useEffect, useMemo, } from "react";
 import { v4 } from "uuid";
 import { cn } from "../../cn";
 export function useDropFileInput({ defaultValue, options, uploadFile, onFileInput, onFileUploaded, limit, } = {}) {
@@ -27,8 +17,7 @@ export function useDropFileInput({ defaultValue, options, uploadFile, onFileInpu
     useEffect(() => {
         fileRef.current = files;
     }, [files]);
-    const Component = useCallback(function Component(_a) {
-        var { className, container = "border border-dashed border-neutral-300 rounded flex items-center justify-center", draggingClassName, name, hideMessage = false, children } = _a, props = __rest(_a, ["className", "container", "draggingClassName", "name", "hideMessage", "children"]);
+    const Component = useCallback(function Component({ className, container = "border border-dashed border-neutral-300 rounded flex items-center justify-center", draggingClassName, name, hideMessage = false, children, ...props }) {
         const [isDragging, setIsDragging] = useState(false);
         const handleDragEnter = useCallback((e) => {
             e.preventDefault();
@@ -80,11 +69,14 @@ export function useDropFileInput({ defaultValue, options, uploadFile, onFileInpu
                     key: v4(),
                 };
                 setFiles((prevFiles) => [...prevFiles, fileItem]);
-                uploadFile === null || uploadFile === void 0 ? void 0 : uploadFile(file, options).then(async (item) => {
-                    await (onFileUploaded === null || onFileUploaded === void 0 ? void 0 : onFileUploaded(item));
+                uploadFile?.(file, options).then(async (item) => {
+                    await onFileUploaded?.(item);
                     setFiles((prevFiles) => prevFiles.map((f) => {
                         if (f.key === fileItem.key) {
-                            return Object.assign(Object.assign({}, f), { item });
+                            return {
+                                ...f,
+                                item,
+                            };
                         }
                         return f;
                     }));
@@ -102,8 +94,7 @@ export function useDropFileInput({ defaultValue, options, uploadFile, onFileInpu
         }, [handleFiles]);
         const inputRef = useRef(null);
         const handleClick = useCallback(() => {
-            var _a;
-            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+            inputRef.current?.click();
         }, []);
         const handleKeyDown = useCallback((e) => {
             if (e.key === "Enter" || e.key === " ") {
@@ -116,22 +107,19 @@ export function useDropFileInput({ defaultValue, options, uploadFile, onFileInpu
                 e.target.value = "";
             }
         }, [handleFiles]);
-        return (React.createElement("div", { className: cn(className, container, (draggingClassName === null || draggingClassName === void 0 ? void 0 : draggingClassName(isDragging)) ||
-                (isDragging ? "bg-neutral-300/25" : "hover:bg-neutral-300/25"), "transition-colors cursor-pointer"), onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, onClick: handleClick, onChange: handleChange, onKeyDown: handleKeyDown, tabIndex: 0, role: "button" },
-            React.createElement("input", Object.assign({}, props, { defaultValue: "", type: "file", hidden: true, ref: inputRef })),
-            React.createElement("input", { name: name, hidden: true, readOnly: true, value: files
-                    .map((file) => {
-                    if (file.item &&
-                        typeof file.item === "object" &&
-                        "id" in file.item) {
-                        return file.item.id;
-                    }
-                    return null;
-                })
-                    .filter(Boolean)
-                    .join(",") }),
-            children ||
-                (!(hideMessage && !isDragging) && React.createElement(DropFileMessageBox, null))));
+        return (_jsxs("div", { className: cn(className, container, draggingClassName?.(isDragging) ||
+                (isDragging ? "bg-neutral-300/25" : "hover:bg-neutral-300/25"), "transition-colors cursor-pointer"), onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, onClick: handleClick, onChange: handleChange, onKeyDown: handleKeyDown, tabIndex: 0, role: "button", children: [_jsx("input", { ...props, defaultValue: "", type: "file", hidden: true, ref: inputRef }), _jsx("input", { name: name, hidden: true, readOnly: true, value: files
+                        .map((file) => {
+                        if (file.item &&
+                            typeof file.item === "object" &&
+                            "id" in file.item) {
+                            return file.item.id;
+                        }
+                        return null;
+                    })
+                        .filter(Boolean)
+                        .join(",") }), children ||
+                    (!(hideMessage && !isDragging) && _jsx(DropFileMessageBox, {}))] }));
     }, [limit, fileRef, files, options, uploadFile, onFileInput, onFileUploaded]);
     const loadedFileIds = files
         .map((file) => {
@@ -151,8 +139,6 @@ export function useDropFileInput({ defaultValue, options, uploadFile, onFileInpu
     };
 }
 export function DropFileMessageBox() {
-    return (React.createElement("div", { className: "text-sm pointer-events-none flex justify-center items-center" },
-        React.createElement("div", { className: "flex flex-col items-center" },
-            React.createElement("span", null, "\uD30C\uC77C\uC744 \uC5EC\uAE30\uB85C \uB04C\uC5B4\uB2E4 \uB193\uAC70\uB098 \uD074\uB9AD\uD574\uC11C \uC120\uD0DD\uD574 \uC8FC\uC138\uC694"))));
+    return (_jsx("div", { className: "text-sm pointer-events-none flex justify-center items-center", children: _jsx("div", { className: "flex flex-col items-center", children: _jsx("span", { children: "\uD30C\uC77C\uC744 \uC5EC\uAE30\uB85C \uB04C\uC5B4\uB2E4 \uB193\uAC70\uB098 \uD074\uB9AD\uD574\uC11C \uC120\uD0DD\uD574 \uC8FC\uC138\uC694" }) }) }));
 }
 export default useDropFileInput;