@nexus-cross/design-system 2.0.2 → 2.0.4

package/dist/chunks/{chunk-XEHFB62A.js → chunk-NRO7I4EI.js}

@@ -3,10 +3,6 @@
 var react = require('react');
 
 // src/hooks/useCheckDevice.ts
-function getMatchMedia(query) {
-  if (typeof window === "undefined") return false;
-  return window.matchMedia(query).matches;
-}
 var DEFAULT_BREAKPOINTS = {
   mobile: 0,
   tablet: 768,
@@ -47,8 +43,8 @@ function useCheckDevice(breakPoints) {
   }, [serialized]);
   const [result, setResult] = react.useState(() => {
     const init = {};
-    for (const [key, query] of Object.entries(queries)) {
-      init[key] = getMatchMedia(query);
+    for (const key of Object.keys(queries)) {
+      init[key] = false;
     }
     return init;
   });

package/dist/chunks/{chunk-LNC3TV6N.mjs → chunk-P4JV4WRB.mjs}

@@ -209,7 +209,7 @@ var ImageUpload = React.forwardRef(
         ]
       }
     );
-    const coverPreview = /* @__PURE__ */ jsx("div", { className: "nexus-image-upload__container", children: /* @__PURE__ */ jsxs(
+    const coverPreview = /* @__PURE__ */ jsx("div", { className: "nexus-image-upload__container nexus-image-upload__container--preview-cover", children: /* @__PURE__ */ jsxs(
       "div",
       {
         role: "button",

package/dist/chunks/{chunk-U53UA76K.js → chunk-R744EATX.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var chunkHHXDOKXY_js = require('./chunk-HHXDOKXY.js');
+var chunkF24AY3HI_js = require('./chunk-F24AY3HI.js');
 var chunkNHDGKOAM_js = require('./chunk-NHDGKOAM.js');
 var chunkT2IY2TSR_js = require('./chunk-T2IY2TSR.js');
-var chunkXEHFB62A_js = require('./chunk-XEHFB62A.js');
+var chunkNRO7I4EI_js = require('./chunk-NRO7I4EI.js');
 var chunkINP2AH3B_js = require('./chunk-INP2AH3B.js');
-var chunkHUPAHDJ7_js = require('./chunk-HUPAHDJ7.js');
+var chunkTAHDSSA6_js = require('./chunk-TAHDSSA6.js');
 var chunkCZC76ZD5_js = require('./chunk-CZC76ZD5.js');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -51,7 +51,7 @@ var Component = ({
 };
 var ModalComponent = React.forwardRef(
   ({ className, modal, breakPoints, scrollFreeze: scrollFreeze2, scrollRelease: scrollRelease2, deleteModal, resolveModal }, ref) => {
-    const { isMobile } = chunkXEHFB62A_js.useCheckDevice_default(breakPoints);
+    const { isMobile } = chunkNRO7I4EI_js.useCheckDevice_default(breakPoints);
     const [status, setStatus] = React.useState("");
     const clickOutSideTarget = React.useMemo(() => {
       if (modal.props?.clickOutSideRef) {
@@ -190,21 +190,25 @@ var ModalPortal = ({ children, selector }) => {
   return mounted && element && children ? reactDom.createPortal(children, element) : null;
 };
 var ModalPortal_default = ModalPortal;
-var ModalContainer = ({ className = "", breakPoints, ...defaultOption }) => {
-  const [modals, setModals] = React.useState(chunkHUPAHDJ7_js.Modal_default.modalList);
+var ModalContainer = ({
+  className = "",
+  breakPoints = chunkTAHDSSA6_js.defaultBreakPoints,
+  ...defaultOption
+}) => {
+  const [modals, setModals] = React.useState(chunkTAHDSSA6_js.Modal_default.modalList);
   const setModalClose = React.useCallback((params) => {
     if (!params) return;
     const { modalId, hasClose, close } = params;
     if (!hasClose) {
-      chunkHUPAHDJ7_js.Modal_default.modalList = chunkHUPAHDJ7_js.Modal_default.modalList.map(
+      chunkTAHDSSA6_js.Modal_default.modalList = chunkTAHDSSA6_js.Modal_default.modalList.map(
         (m) => m.id === modalId ? { ...m, close } : m
       );
     }
   }, []);
   React.useEffect(() => {
-    chunkHUPAHDJ7_js.Modal_default.observe({ options: defaultOption, observeFunction: setModals });
+    chunkTAHDSSA6_js.Modal_default.observe({ options: defaultOption, observeFunction: setModals });
     return () => {
-      chunkHUPAHDJ7_js.Modal_default.unobserve();
+      chunkTAHDSSA6_js.Modal_default.unobserve();
     };
   }, [defaultOption]);
   return /* @__PURE__ */ jsxRuntime.jsx("div", { id: "modal-wrapper", className, children: modals.map(
@@ -214,8 +218,8 @@ var ModalContainer = ({ className = "", breakPoints, ...defaultOption }) => {
         ref: setModalClose,
         modal: m,
         breakPoints,
-        deleteModal: (id) => chunkHUPAHDJ7_js.Modal_default.deleteModal(id),
-        resolveModal: (params) => chunkHUPAHDJ7_js.Modal_default.resolveModal(params),
+        deleteModal: (id) => chunkTAHDSSA6_js.Modal_default.deleteModal(id),
+        resolveModal: (params) => chunkTAHDSSA6_js.Modal_default.resolveModal(params),
         scrollFreeze: chunkT2IY2TSR_js.scrollFreeze,
         scrollRelease: chunkT2IY2TSR_js.scrollRelease
       },
@@ -226,8 +230,8 @@ var ModalContainer = ({ className = "", breakPoints, ...defaultOption }) => {
         ref: setModalClose,
         modal: m,
         breakPoints,
-        deleteModal: (id) => chunkHUPAHDJ7_js.Modal_default.deleteModal(id),
-        resolveModal: (params) => chunkHUPAHDJ7_js.Modal_default.resolveModal(params),
+        deleteModal: (id) => chunkTAHDSSA6_js.Modal_default.deleteModal(id),
+        resolveModal: (params) => chunkTAHDSSA6_js.Modal_default.resolveModal(params),
         scrollFreeze: chunkT2IY2TSR_js.scrollFreeze,
         scrollRelease: chunkT2IY2TSR_js.scrollRelease
       },
@@ -414,6 +418,7 @@ var ModalTemplate = React.forwardRef(
     desc,
     hideHeader = false,
     hideFooter = true,
+    hideCloseBtn = false,
     dimClose,
     footer,
     close,
@@ -427,7 +432,7 @@ var ModalTemplate = React.forwardRef(
     const { dimCloseEnable } = getModalDefaultOption();
     const isBottomSheet = layout === "bottom-sheet";
     const isDraggable = layout === "draggable";
-    const dragHandlers = chunkHHXDOKXY_js.useDraggableBottomSheet({
+    const dragHandlers = chunkF24AY3HI_js.useDraggableBottomSheet({
       enabled: isBottomSheet && enableDrag,
       onClose: () => close(false),
       threshold: 0.5,
@@ -568,7 +573,7 @@ var ModalTemplate = React.forwardRef(
                       ref: modalHeaderRef,
                       onMouseDown: isDraggable && enableDrag ? windowDrag.handleMouseDown : void 0,
                       children: [
-                        /* @__PURE__ */ jsxRuntime.jsx(
+                        !hideCloseBtn && /* @__PURE__ */ jsxRuntime.jsx(
                           "button",
                           {
                             type: "button",
@@ -619,28 +624,28 @@ var ModalTemplate_default = ModalTemplate;
 var openModal = ((arg1, arg2 = {}) => {
   if ("component" in arg1) {
     const { component, props = {}, options = {} } = arg1;
-    return chunkHUPAHDJ7_js.Modal_default.openModal({
+    return chunkTAHDSSA6_js.Modal_default.openModal({
       component,
       props: { ...props, ...options }
     });
   } else {
-    return chunkHUPAHDJ7_js.Modal_default.openModal({
+    return chunkTAHDSSA6_js.Modal_default.openModal({
       component: arg1,
       props: arg2
     });
   }
 });
 var closeModal = (id, isAnimation) => {
-  return chunkHUPAHDJ7_js.Modal_default.closeModal(id, isAnimation);
+  return chunkTAHDSSA6_js.Modal_default.closeModal(id, isAnimation);
 };
 var checkModal = (params) => {
-  return chunkHUPAHDJ7_js.Modal_default.checkModal(params);
+  return chunkTAHDSSA6_js.Modal_default.checkModal(params);
 };
 var resetModal = () => {
-  return chunkHUPAHDJ7_js.Modal_default.resetModal();
+  return chunkTAHDSSA6_js.Modal_default.resetModal();
 };
 var getModalDefaultOption = () => {
-  return chunkHUPAHDJ7_js.Modal_default.getDefaultOption();
+  return chunkTAHDSSA6_js.Modal_default.getDefaultOption();
 };
 
 exports.ModalContainer_default = ModalContainer_default;

package/dist/chunks/{chunk-HUPAHDJ7.js → chunk-TAHDSSA6.js}

@@ -10,6 +10,11 @@ var defaultModalOption = {
   animation: { name: "pop-fade", duration: 300 },
   dimCloseEnable: true
 };
+var defaultBreakPoints = {
+  isDesktop: "(min-width: 1280px)",
+  isTablet: "screen and (min-width: 768px) and (max-width: 1279px)",
+  isMobile: "(max-width: 767px)"
+};
 
 // src/modal/Modal.ts
 var Modal = class {
@@ -270,4 +275,5 @@ function useModal() {
 }
 
 exports.Modal_default = Modal_default;
+exports.defaultBreakPoints = defaultBreakPoints;
 exports.useModal = useModal;

package/dist/chunks/{chunk-YEWKPWK3.mjs → chunk-U6OEUBIF.mjs}

@@ -1,10 +1,6 @@
 import { useMemo, useState, useEffect } from 'react';
 
 // src/hooks/useCheckDevice.ts
-function getMatchMedia(query) {
-  if (typeof window === "undefined") return false;
-  return window.matchMedia(query).matches;
-}
 var DEFAULT_BREAKPOINTS = {
   mobile: 0,
   tablet: 768,
@@ -45,8 +41,8 @@ function useCheckDevice(breakPoints) {
   }, [serialized]);
   const [result, setResult] = useState(() => {
     const init = {};
-    for (const [key, query] of Object.entries(queries)) {
-      init[key] = getMatchMedia(query);
+    for (const key of Object.keys(queries)) {
+      init[key] = false;
     }
     return init;
   });

package/dist/chunks/{chunk-VCN7DMCQ.js → chunk-USPFWZ7H.js}

@@ -231,7 +231,7 @@ var ImageUpload = React__namespace.forwardRef(
         ]
       }
     );
-    const coverPreview = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nexus-image-upload__container", children: /* @__PURE__ */ jsxRuntime.jsxs(
+    const coverPreview = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nexus-image-upload__container nexus-image-upload__container--preview-cover", children: /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
         role: "button",

package/dist/chunks/{chunk-U56AGSLE.mjs → chunk-WBCXHGRL.mjs}

@@ -23,9 +23,9 @@ function useDraggableBottomSheet({
       if (!enabled) return;
       const touch = e.touches[0];
       const target = e.currentTarget;
-      const modalInner = target.querySelector(".modal-inner");
+      const modalInner = target.querySelector(".nexus-modal-inner");
       if (!modalInner) return;
-      const scrollableElement = e.target.closest(".modal-body");
+      const scrollableElement = e.target.closest(".nexus-modal-body");
       if (scrollableElement && scrollableElement.scrollTop > 0) return;
       dragStateRef.current = {
         isDragging: true,

package/dist/hooks/useCheckDevice.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCheckDevice.d.ts","sourceRoot":"","sources":["../../src/hooks/useCheckDevice.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,WAAW;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,KAAK,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAoDjD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,iBAAS,cAAc,IAAI;IAAE,MAAM,EAAE,OAAO,CAAC;IAAC,MAAM,EAAE,OAAO,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC;AAClF,iBAAS,cAAc,CAAC,WAAW,EAAE,WAAW,GAAG,SAAS,GAAG,iBAAiB,CAAC;AACjF,iBAAS,cAAc,CAAC,WAAW,EAAE,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAkDlF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"useCheckDevice.d.ts","sourceRoot":"","sources":["../../src/hooks/useCheckDevice.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,WAAW;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,KAAK,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAiDhD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,iBAAS,cAAc,IAAI;IACzB,MAAM,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,OAAO,CAAA;CACjB,CAAA;AACD,iBAAS,cAAc,CAAC,WAAW,EAAE,WAAW,GAAG,SAAS,GAAG,iBAAiB,CAAA;AAChF,iBAAS,cAAc,CACrB,WAAW,EAAE,kBAAkB,GAC9B,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;AAmD1B,eAAe,cAAc,CAAA"}

package/dist/hooks/useCheckDevice.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var chunkXEHFB62A_js = require('../chunks/chunk-XEHFB62A.js');
+var chunkNRO7I4EI_js = require('../chunks/chunk-NRO7I4EI.js');
 
 
 
-module.exports = chunkXEHFB62A_js.useCheckDevice_default;
+module.exports = chunkNRO7I4EI_js.useCheckDevice_default;

package/dist/hooks/useCheckDevice.mjs

@@ -1 +1 @@
-export { useCheckDevice_default as default } from '../chunks/chunk-YEWKPWK3.mjs';
+export { useCheckDevice_default as default } from '../chunks/chunk-U6OEUBIF.mjs';

package/dist/hooks/useDraggableBottomSheet.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkHHXDOKXY_js = require('../chunks/chunk-HHXDOKXY.js');
+var chunkF24AY3HI_js = require('../chunks/chunk-F24AY3HI.js');
 
 
 
 Object.defineProperty(exports, "useDraggableBottomSheet", {
   enumerable: true,
-  get: function () { return chunkHHXDOKXY_js.useDraggableBottomSheet; }
+  get: function () { return chunkF24AY3HI_js.useDraggableBottomSheet; }
 });

package/dist/hooks/useDraggableBottomSheet.mjs

@@ -1 +1 @@
-export { useDraggableBottomSheet } from '../chunks/chunk-U56AGSLE.mjs';
+export { useDraggableBottomSheet } from '../chunks/chunk-WBCXHGRL.mjs';

package/dist/hooks/useModal.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkHUPAHDJ7_js = require('../chunks/chunk-HUPAHDJ7.js');
+var chunkTAHDSSA6_js = require('../chunks/chunk-TAHDSSA6.js');
 
 
 
 Object.defineProperty(exports, "useModal", {
   enumerable: true,
-  get: function () { return chunkHUPAHDJ7_js.useModal; }
+  get: function () { return chunkTAHDSSA6_js.useModal; }
 });

package/dist/hooks/useModal.mjs

@@ -1 +1 @@
-export { useModal } from '../chunks/chunk-6H7V2I3X.mjs';
+export { useModal } from '../chunks/chunk-FY2N42XN.mjs';

package/dist/image-upload.js

@@ -1,15 +1,15 @@
 'use strict';
 
-var chunkVCN7DMCQ_js = require('./chunks/chunk-VCN7DMCQ.js');
+var chunkUSPFWZ7H_js = require('./chunks/chunk-USPFWZ7H.js');
 require('./chunks/chunk-CZC76ZD5.js');
 
 
 
 Object.defineProperty(exports, "ImageUpload", {
   enumerable: true,
-  get: function () { return chunkVCN7DMCQ_js.ImageUpload; }
+  get: function () { return chunkUSPFWZ7H_js.ImageUpload; }
 });
 Object.defineProperty(exports, "imageUploadVariants", {
   enumerable: true,
-  get: function () { return chunkVCN7DMCQ_js.imageUploadVariants; }
+  get: function () { return chunkUSPFWZ7H_js.imageUploadVariants; }
 });

package/dist/image-upload.mjs

@@ -1,2 +1,2 @@
-export { ImageUpload, imageUploadVariants } from './chunks/chunk-LNC3TV6N.mjs';
+export { ImageUpload, imageUploadVariants } from './chunks/chunk-P4JV4WRB.mjs';
 import './chunks/chunk-MCKOWMLS.mjs';

package/dist/index.js

@@ -9,7 +9,7 @@ var chunkDICN6GKE_js = require('./chunks/chunk-DICN6GKE.js');
 var chunkDYPPVXQF_js = require('./chunks/chunk-DYPPVXQF.js');
 var chunkLYPBQI3Y_js = require('./chunks/chunk-LYPBQI3Y.js');
 var chunkLTS674LF_js = require('./chunks/chunk-LTS674LF.js');
-var chunkVCN7DMCQ_js = require('./chunks/chunk-VCN7DMCQ.js');
+var chunkUSPFWZ7H_js = require('./chunks/chunk-USPFWZ7H.js');
 var chunkQK6NCII4_js = require('./chunks/chunk-QK6NCII4.js');
 var chunkBLGQHR3M_js = require('./chunks/chunk-BLGQHR3M.js');
 var chunkDLFV7ZZV_js = require('./chunks/chunk-DLFV7ZZV.js');
@@ -44,13 +44,13 @@ var chunkXGIJZ3NZ_js = require('./chunks/chunk-XGIJZ3NZ.js');
 var chunk2BINGHGR_js = require('./chunks/chunk-2BINGHGR.js');
 var chunk4ENXP7WH_js = require('./chunks/chunk-4ENXP7WH.js');
 var chunkMA2VCCIY_js = require('./chunks/chunk-MA2VCCIY.js');
-var chunkU53UA76K_js = require('./chunks/chunk-U53UA76K.js');
-var chunkHHXDOKXY_js = require('./chunks/chunk-HHXDOKXY.js');
+var chunkR744EATX_js = require('./chunks/chunk-R744EATX.js');
+var chunkF24AY3HI_js = require('./chunks/chunk-F24AY3HI.js');
 var chunkNHDGKOAM_js = require('./chunks/chunk-NHDGKOAM.js');
 var chunkT2IY2TSR_js = require('./chunks/chunk-T2IY2TSR.js');
-var chunkXEHFB62A_js = require('./chunks/chunk-XEHFB62A.js');
+var chunkNRO7I4EI_js = require('./chunks/chunk-NRO7I4EI.js');
 var chunkINP2AH3B_js = require('./chunks/chunk-INP2AH3B.js');
-var chunkHUPAHDJ7_js = require('./chunks/chunk-HUPAHDJ7.js');
+var chunkTAHDSSA6_js = require('./chunks/chunk-TAHDSSA6.js');
 var chunkP3DZKXG4_js = require('./chunks/chunk-P3DZKXG4.js');
 var chunkWKCXACMZ_js = require('./chunks/chunk-WKCXACMZ.js');
 var chunkS2GMEC43_js = require('./chunks/chunk-S2GMEC43.js');
@@ -438,11 +438,11 @@ Object.defineProperty(exports, "DatePicker", {
 });
 Object.defineProperty(exports, "ImageUpload", {
   enumerable: true,
-  get: function () { return chunkVCN7DMCQ_js.ImageUpload; }
+  get: function () { return chunkUSPFWZ7H_js.ImageUpload; }
 });
 Object.defineProperty(exports, "imageUploadVariants", {
   enumerable: true,
-  get: function () { return chunkVCN7DMCQ_js.imageUploadVariants; }
+  get: function () { return chunkUSPFWZ7H_js.imageUploadVariants; }
 });
 Object.defineProperty(exports, "ClientOnly", {
   enumerable: true,
@@ -794,43 +794,43 @@ Object.defineProperty(exports, "avatarVariants", {
 });
 Object.defineProperty(exports, "ModalContainer", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.ModalContainer_default; }
+  get: function () { return chunkR744EATX_js.ModalContainer_default; }
 });
 Object.defineProperty(exports, "ModalPortalTarget", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.ModalPortalTarget_default; }
+  get: function () { return chunkR744EATX_js.ModalPortalTarget_default; }
 });
 Object.defineProperty(exports, "ModalTemplate", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.ModalTemplate_default; }
+  get: function () { return chunkR744EATX_js.ModalTemplate_default; }
 });
 Object.defineProperty(exports, "checkModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.checkModal; }
+  get: function () { return chunkR744EATX_js.checkModal; }
 });
 Object.defineProperty(exports, "closeModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.closeModal; }
+  get: function () { return chunkR744EATX_js.closeModal; }
 });
 Object.defineProperty(exports, "getModalDefaultOption", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.getModalDefaultOption; }
+  get: function () { return chunkR744EATX_js.getModalDefaultOption; }
 });
 Object.defineProperty(exports, "modal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.openModal; }
+  get: function () { return chunkR744EATX_js.openModal; }
 });
 Object.defineProperty(exports, "openModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.openModal; }
+  get: function () { return chunkR744EATX_js.openModal; }
 });
 Object.defineProperty(exports, "resetModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.resetModal; }
+  get: function () { return chunkR744EATX_js.resetModal; }
 });
 Object.defineProperty(exports, "useDraggableBottomSheet", {
   enumerable: true,
-  get: function () { return chunkHHXDOKXY_js.useDraggableBottomSheet; }
+  get: function () { return chunkF24AY3HI_js.useDraggableBottomSheet; }
 });
 Object.defineProperty(exports, "useDraggableWindow", {
   enumerable: true,
@@ -846,7 +846,7 @@ Object.defineProperty(exports, "scrollRelease", {
 });
 Object.defineProperty(exports, "useCheckDevice", {
   enumerable: true,
-  get: function () { return chunkXEHFB62A_js.useCheckDevice_default; }
+  get: function () { return chunkNRO7I4EI_js.useCheckDevice_default; }
 });
 Object.defineProperty(exports, "useClickOutside", {
   enumerable: true,
@@ -854,7 +854,7 @@ Object.defineProperty(exports, "useClickOutside", {
 });
 Object.defineProperty(exports, "useModal", {
   enumerable: true,
-  get: function () { return chunkHUPAHDJ7_js.useModal; }
+  get: function () { return chunkTAHDSSA6_js.useModal; }
 });
 Object.defineProperty(exports, "Button", {
   enumerable: true,

package/dist/index.mjs

@@ -7,7 +7,7 @@ export { Slider, sliderVariants } from './chunks/chunk-H2G5FMRN.mjs';
 export { TagInput, tagInputVariants } from './chunks/chunk-H2V7RHYV.mjs';
 export { NxImage } from './chunks/chunk-WZFKTTVX.mjs';
 export { DatePicker } from './chunks/chunk-FBC53TOS.mjs';
-export { ImageUpload, imageUploadVariants } from './chunks/chunk-LNC3TV6N.mjs';
+export { ImageUpload, imageUploadVariants } from './chunks/chunk-P4JV4WRB.mjs';
 export { ClientOnly } from './chunks/chunk-AOXXE5UQ.mjs';
 export { Skeleton } from './chunks/chunk-P2T72N62.mjs';
 export { Countdown, useCountdown } from './chunks/chunk-LI7SFBUQ.mjs';
@@ -42,13 +42,13 @@ export { TextArea, textAreaVariants } from './chunks/chunk-ZU4AWAFT.mjs';
 export { NumberInput, numberInputBind, numberInputVariants } from './chunks/chunk-RL5UAEGQ.mjs';
 export { PriceInput, priceInputVariants } from './chunks/chunk-WGGBE4ZD.mjs';
 export { Avatar, avatarVariants } from './chunks/chunk-YLO4UKSC.mjs';
-export { ModalContainer_default as ModalContainer, ModalPortalTarget_default as ModalPortalTarget, ModalTemplate_default as ModalTemplate, checkModal, closeModal, getModalDefaultOption, openModal as modal, openModal, resetModal } from './chunks/chunk-3VFBPFZF.mjs';
-export { useDraggableBottomSheet } from './chunks/chunk-U56AGSLE.mjs';
+export { ModalContainer_default as ModalContainer, ModalPortalTarget_default as ModalPortalTarget, ModalTemplate_default as ModalTemplate, checkModal, closeModal, getModalDefaultOption, openModal as modal, openModal, resetModal } from './chunks/chunk-7WWQ5DS3.mjs';
+export { useDraggableBottomSheet } from './chunks/chunk-WBCXHGRL.mjs';
 export { useDraggableWindow } from './chunks/chunk-4J3GCZ7W.mjs';
 export { scrollFreeze, scrollRelease } from './chunks/chunk-54IA2P2Z.mjs';
-export { useCheckDevice_default as useCheckDevice } from './chunks/chunk-YEWKPWK3.mjs';
+export { useCheckDevice_default as useCheckDevice } from './chunks/chunk-U6OEUBIF.mjs';
 export { useClickOutside_default as useClickOutside } from './chunks/chunk-OTGS6BDQ.mjs';
-export { useModal } from './chunks/chunk-6H7V2I3X.mjs';
+export { useModal } from './chunks/chunk-FY2N42XN.mjs';
 export { Button, buttonVariants } from './chunks/chunk-VVXQZ4XH.mjs';
 export { Chip, chipVariants } from './chunks/chunk-RX5UKRYK.mjs';
 export { Badge, badgeVariants } from './chunks/chunk-CUTMLBC3.mjs';

package/dist/modal/components/ModalContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContainer.d.ts","sourceRoot":"","sources":["../../../src/modal/components/ModalContainer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAa,MAAM,UAAU,CAAC;AAC9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAM9D,KAAK,KAAK,GAAG,kBAAkB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,cAAc,GAAI,8CAAmD,KAAK,4CA4D/E,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ModalContainer.d.ts","sourceRoot":"","sources":["../../../src/modal/components/ModalContainer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAa,MAAM,UAAU,CAAC;AAC9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAO9D,KAAK,KAAK,GAAG,kBAAkB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,cAAc,GAAI,8CAIrB,KAAK,4CA4DP,CAAC;AAEF,eAAe,cAAc,CAAC"}

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

@@ -5,6 +5,7 @@ interface PropsType extends ModalTemplatePropsType {
     layout?: ModalLayout;
     hideHeader?: boolean;
     hideFooter?: boolean;
+    hideCloseBtn?: boolean;
     footer?: ReactElement | string;
     innerClassName?: string;
     bodyClassName?: string;

package/dist/modal/components/ModalTemplate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalTemplate.d.ts","sourceRoot":"","sources":["../../../src/modal/components/ModalTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,YAAY,EAMlB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAKvD,OAAO,EACL,KAAK,WAAW,EASjB,MAAM,0BAA0B,CAAC;AAElC,UAAU,SAAU,SAAQ,sBAAsB;IAChD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAkBD,QAAA,MAAM,aAAa,kFA0PlB,CAAC;AAIF,YAAY,EAAE,SAAS,IAAI,kBAAkB,EAAE,CAAC;AAChD,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ModalTemplate.d.ts","sourceRoot":"","sources":["../../../src/modal/components/ModalTemplate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,YAAY,EAMlB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAKvD,OAAO,EACL,KAAK,WAAW,EASjB,MAAM,0BAA0B,CAAC;AAElC,UAAU,SAAU,SAAQ,sBAAsB;IAChD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAkBD,QAAA,MAAM,aAAa,kFA6PlB,CAAC;AAIF,YAAY,EAAE,SAAS,IAAI,kBAAkB,EAAE,CAAC;AAChD,eAAe,aAAa,CAAC"}

package/dist/modal/constants.d.ts

@@ -1,3 +1,17 @@
+import type { BreakPoints } from '../hooks/useCheckDevice';
 import type { DefaultModalOption } from './types';
 export declare const defaultModalOption: DefaultModalOption;
+/**
+ * ModalContainer 의 기본 breakPoints.
+ *
+ * useCheckDevice 의 숫자형 default { mobile: 0, tablet: 768, desktop: 1280 } 와
+ * 매칭 영역이 동일하다. ModalComponent 가 `isMobile` 키로 디바이스를 판별하므로,
+ * 키 이름을 legacy 형식 (`isMobile`, `isTablet`, `isDesktop`) 으로 통일하기 위해
+ * 기본값을 별도로 둔다.
+ *
+ * - mobile  : 0 ~ 767px
+ * - tablet  : 768 ~ 1279px
+ * - desktop : 1280px+
+ */
+export declare const defaultBreakPoints: Required<BreakPoints>;
 //# sourceMappingURL=constants.d.ts.map

package/dist/modal/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/modal/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,eAAO,MAAM,kBAAkB,EAAE,kBAGhC,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/modal/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,eAAO,MAAM,kBAAkB,EAAE,kBAGhC,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB,EAAE,QAAQ,CAAC,WAAW,CAIpD,CAAC"}

package/dist/modal/index.js

@@ -1,53 +1,53 @@
 'use strict';
 
-var chunkU53UA76K_js = require('../chunks/chunk-U53UA76K.js');
-require('../chunks/chunk-HHXDOKXY.js');
+var chunkR744EATX_js = require('../chunks/chunk-R744EATX.js');
+require('../chunks/chunk-F24AY3HI.js');
 require('../chunks/chunk-NHDGKOAM.js');
 require('../chunks/chunk-T2IY2TSR.js');
-require('../chunks/chunk-XEHFB62A.js');
+require('../chunks/chunk-NRO7I4EI.js');
 require('../chunks/chunk-INP2AH3B.js');
-var chunkHUPAHDJ7_js = require('../chunks/chunk-HUPAHDJ7.js');
+var chunkTAHDSSA6_js = require('../chunks/chunk-TAHDSSA6.js');
 require('../chunks/chunk-CZC76ZD5.js');
 
 
 
 Object.defineProperty(exports, "ModalContainer", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.ModalContainer_default; }
+  get: function () { return chunkR744EATX_js.ModalContainer_default; }
 });
 Object.defineProperty(exports, "ModalPortalTarget", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.ModalPortalTarget_default; }
+  get: function () { return chunkR744EATX_js.ModalPortalTarget_default; }
 });
 Object.defineProperty(exports, "ModalTemplate", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.ModalTemplate_default; }
+  get: function () { return chunkR744EATX_js.ModalTemplate_default; }
 });
 Object.defineProperty(exports, "checkModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.checkModal; }
+  get: function () { return chunkR744EATX_js.checkModal; }
 });
 Object.defineProperty(exports, "closeModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.closeModal; }
+  get: function () { return chunkR744EATX_js.closeModal; }
 });
 Object.defineProperty(exports, "getModalDefaultOption", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.getModalDefaultOption; }
+  get: function () { return chunkR744EATX_js.getModalDefaultOption; }
 });
 Object.defineProperty(exports, "modal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.openModal; }
+  get: function () { return chunkR744EATX_js.openModal; }
 });
 Object.defineProperty(exports, "openModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.openModal; }
+  get: function () { return chunkR744EATX_js.openModal; }
 });
 Object.defineProperty(exports, "resetModal", {
   enumerable: true,
-  get: function () { return chunkU53UA76K_js.resetModal; }
+  get: function () { return chunkR744EATX_js.resetModal; }
 });
 Object.defineProperty(exports, "useModal", {
   enumerable: true,
-  get: function () { return chunkHUPAHDJ7_js.useModal; }
+  get: function () { return chunkTAHDSSA6_js.useModal; }
 });

package/dist/modal/index.mjs

@@ -1,8 +1,8 @@
-export { ModalContainer_default as ModalContainer, ModalPortalTarget_default as ModalPortalTarget, ModalTemplate_default as ModalTemplate, checkModal, closeModal, getModalDefaultOption, openModal as modal, openModal, resetModal } from '../chunks/chunk-3VFBPFZF.mjs';
-import '../chunks/chunk-U56AGSLE.mjs';
+export { ModalContainer_default as ModalContainer, ModalPortalTarget_default as ModalPortalTarget, ModalTemplate_default as ModalTemplate, checkModal, closeModal, getModalDefaultOption, openModal as modal, openModal, resetModal } from '../chunks/chunk-7WWQ5DS3.mjs';
+import '../chunks/chunk-WBCXHGRL.mjs';
 import '../chunks/chunk-4J3GCZ7W.mjs';
 import '../chunks/chunk-54IA2P2Z.mjs';
-import '../chunks/chunk-YEWKPWK3.mjs';
+import '../chunks/chunk-U6OEUBIF.mjs';
 import '../chunks/chunk-OTGS6BDQ.mjs';
-export { useModal } from '../chunks/chunk-6H7V2I3X.mjs';
+export { useModal } from '../chunks/chunk-FY2N42XN.mjs';
 import '../chunks/chunk-MCKOWMLS.mjs';

package/dist/schemas/_all.json

@@ -1828,6 +1828,11 @@
               "default": true,
               "description": "Hide footer"
             },
+            "hideCloseBtn": {
+              "type": "boolean",
+              "default": false,
+              "description": "Hide the X close button in the header"
+            },
             "footer": {
               "description": "Custom footer (ReactElement)"
             },
@@ -1879,15 +1884,15 @@
             },
             "className": {
               "type": "string",
-              "description": "Root wrapper style"
+              "description": "Root wrapper style — applied to the full-screen `position: fixed; inset: 0` flex container that centers the modal. NOTE: width / max-width / height utilities (`w-[400px]`, `max-w-[92vw]`, `h-*`) MUST NOT go here — they will resize the wrap layer, not the panel. Put sizing on `innerClassName` instead."
             },
             "innerClassName": {
               "type": "string",
-              "description": "Modal body style"
+              "description": "Modal panel (the actual dialog box) style — apply ALL sizing utilities here: `w-[400px]`, `max-w-[92vw]`, `min-h-*`, `max-h-[80vh]`, `rounded-*`, panel background, etc. This is the most common override point."
             },
             "bodyClassName": {
               "type": "string",
-              "description": "Body area style"
+              "description": "Body area style (inside the panel, between header and footer)"
             },
             "footerClassName": {
               "type": "string",
@@ -1903,7 +1908,7 @@
             }
           },
           "additionalProperties": false,
-          "description": "Modal template. All modal components must be wrapped with ModalTemplate.\n\nWHEN TO USE:\n  • Force user decision (delete confirm, submit confirm, blocking dialog)\n  • Long form/flow that needs full attention\n  • Side panel that doesn't block main flow → Drawer instead\n  • Inline contextual UI → Popover instead\n  • Short hint → Tooltip instead\n\nPREFERRED API: use modal() / useModal() imperative API rather than mounting <ModalTemplate> directly. modal() handles stacking, focus return, ESC, and background scroll automatically.\n\nANTI-PATTERNS:\n  ✗ Custom <div className=\"fixed inset-0\"> → modal() (loses focus trap, a11y)\n  ✗ Direct <ModalTemplate> mount in render tree → wrap with modal()\n  ✗ Modal with no title for screen readers → always pass title prop\n  ✗ Multiple modals stacking confusingly → use isAlone:true to close prior modals"
+          "description": "Modal template. All modal components must be wrapped with ModalTemplate.\n\nWHEN TO USE:\n  • Force user decision (delete confirm, submit confirm, blocking dialog)\n  • Long form/flow that needs full attention\n  • Side panel that doesn't block main flow → Drawer instead\n  • Inline contextual UI → Popover instead\n  • Short hint → Tooltip instead\n\nPREFERRED API: use modal() / useModal() imperative API rather than mounting <ModalTemplate> directly. modal() handles stacking, focus return, ESC, and background scroll automatically.\n\nSIZING (must read — most common AI mistake):\n  • The modal has TWO layers:\n      1. wrap   = full-screen `position: fixed; inset: 0` flex container → controlled by `className`\n      2. panel  = the actual dialog box rendered at the center → controlled by `innerClassName`\n  • Sizing utilities (`w-*`, `max-w-*`, `min-w-*`, `h-*`, `max-h-*`) MUST go on `innerClassName`.\n  • Putting `w-[400px] max-w-[92vw]` on `className` shrinks the wrap (the centering layer), NOT the panel — the panel keeps its default width and the modal looks broken.\n\nANTI-PATTERNS:\n  ✗ Custom <div className=\"fixed inset-0\"> → modal() (loses focus trap, a11y)\n  ✗ Direct <ModalTemplate> mount in render tree → wrap with modal()\n  ✗ Modal with no title for screen readers → always pass title prop\n  ✗ Multiple modals stacking confusingly → use isAlone:true to close prior modals\n  ✗ <ModalTemplate className=\"w-[400px] max-w-[92vw]\"> → put sizing on `innerClassName` instead"
         }
       },
       "$schema": "http://json-schema.org/draft-07/schema#"