reaxify 0.0.84 → 0.0.85

package/dist/components/Drawer/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),d=require("../../hooks/useClasses.cjs.js"),i=require("react"),q=require("../../hooks/useKeyDown.cjs.js"),g=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),b=require("../../helpers/cn.cjs.js"),f=require("../Card/index.cjs.js"),R=require("../Portal/index.cjs.js"),C=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),p=i.createContext({open:!1,onClose:()=>{},duration:300,anchor:"start",transitionState:"unmounted"});function x({as:n,ref:a,open:r=!1,onClose:e=()=>{},duration:o=300,anchor:u="end",className:w="",children:y,...v}){const t=d(l=>l.drawer),c=i.useRef(null),m=n||"div",j={entering:"active opacity-100 pointer-events-auto",entered:"active opacity-100 pointer-events-auto",exiting:"opacity-0 pointer-events-none",exited:"opacity-0 pointer-events-none",unmounted:""},D=i.useMemo(()=>{var h;const l={start:"flex-row-reverse",end:"flex-row",top:"flex-col-reverse",bottom:"flex-col"},M=(h=t==null?void 0:t.anchor)==null?void 0:h[u];return[l[u],M]},[u,t==null?void 0:t.anchor]);return i.useImperativeHandle(a,()=>c.current),q(()=>{e==null||e()},{skip:!r,targetKey:"Escape"}),s.jsx(R,{children:s.jsx(C.default,{nodeRef:c,in:r,timeout:o,unmountOnExit:!0,children:l=>s.jsxs(m,{ref:c,style:{transitionDuration:`${o}ms`},"data-open":r,className:g.twMerge("fixed size-full inset-0 flex z-10 bg-black/20 backdrop-blur transition-opacity [--drawer-ratio:1] rtl:[--drawer-ratio:-1]",t==null?void 0:t.base,j[l],D,w),...v,children:[s.jsx("button",{type:"button",onClick:()=>e(),className:"absolute inset-0 size-full cursor-default opacity-0"}),s.jsx(p.Provider,{value:{open:r,onClose:e,transitionState:l,duration:o,anchor:u},children:y})]})})})}function N({children:n,className:a="",...r}){const e=d(t=>t.drawer.menu),{anchor:o,duration:u,transitionState:w}=i.useContext(p),y=i.useMemo(()=>{var m;const t={start:"w-[31.875rem] h-full max-w-[92.5%] rounded-e me-auto",end:"w-[31.875rem] h-full max-w-[92.5%] rounded-s ms-auto",top:"w-full h-[31.875rem] max-h-[92.5%] rounded-b mb-auto",bottom:"w-full h-[31.875rem] max-h-[92.5%] rounded-t mt-auto"},c=(m=e==null?void 0:e.anchor)==null?void 0:m[o];return[t[o],c]},[o,e==null?void 0:e.anchor]),v=i.useMemo(()=>({start:{entering:"translate-x-0",entered:"translate-x-0",exiting:"-translate-x-[calc(100%*var(--drawer-ratio))]",exited:"-translate-x-[calc(100%*var(--drawer-ratio))]",unmounted:""},end:{entering:"translate-x-0",entered:"translate-x-0",exiting:"translate-x-[calc(100%*var(--drawer-ratio))]",exited:"translate-x-[calc(100%*var(--drawer-ratio))]",unmounted:""},top:{entering:"translate-y-0",entered:"translate-y-0",exiting:"-translate-y-full",exited:"-translate-y-full",unmounted:""},bottom:{entering:"translate-y-0",entered:"translate-y-0",exiting:"translate-y-full",exited:"translate-y-full",unmounted:""}})[o],[o]);return s.jsx(f,{as:"div",style:{transitionDuration:`${u}ms`},className:g.twMerge("relative flex flex-col transition-[translate,width] rounded-none",e==null?void 0:e.base,v[w],y,a),...r,children:n})}function S({className:n,...a}){const r=d(e=>e.drawer.header.base);return s.jsx(f.Header,{className:b(r,n),...a})}function k({className:n,...a}){const r=d(e=>e.drawer.body.base);return s.jsx(f.Body,{className:b("flex-1 overflow-auto",r,n),...a})}function H({className:n,...a}){const r=d(e=>e.drawer.footer.base);return s.jsx(f.Footer,{className:b(r,n),...a})}x.Menu=N;x.Header=S;x.Body=k;x.Footer=H;exports.DrawerContext=p;exports.default=x;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),d=require("../../hooks/useClasses.cjs.js"),u=require("react"),q=require("../../node_modules/@tanstack/react-hotkeys/dist/useHotkey.cjs.js"),g=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),v=require("../../helpers/cn.cjs.js"),f=require("../Card/index.cjs.js"),D=require("../Portal/index.cjs.js"),R=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),p=u.createContext({open:!1,onClose:()=>{},duration:300,anchor:"start",transitionState:"unmounted"});function x({as:n,ref:a,open:r=!1,onClose:e=()=>{},duration:o=300,anchor:i="end",className:w="",children:y,...b}){const t=d(l=>l.drawer),c=u.useRef(null),m=n||"div",j={entering:"active opacity-100 pointer-events-auto",entered:"active opacity-100 pointer-events-auto",exiting:"opacity-0 pointer-events-none",exited:"opacity-0 pointer-events-none",unmounted:""},C=u.useMemo(()=>{var h;const l={start:"flex-row-reverse",end:"flex-row",top:"flex-col-reverse",bottom:"flex-col"},M=(h=t==null?void 0:t.anchor)==null?void 0:h[i];return[l[i],M]},[i,t==null?void 0:t.anchor]);return u.useImperativeHandle(a,()=>c.current),q.useHotkey("Escape",()=>e(),{enabled:r}),s.jsx(D,{children:s.jsx(R.default,{nodeRef:c,in:r,timeout:o,unmountOnExit:!0,children:l=>s.jsxs(m,{ref:c,style:{transitionDuration:`${o}ms`},"data-open":r,className:g.twMerge("fixed size-full inset-0 flex z-10 bg-black/20 backdrop-blur transition-opacity [--drawer-ratio:1] rtl:[--drawer-ratio:-1]",t==null?void 0:t.base,j[l],C,w),...b,children:[s.jsx("button",{type:"button",onClick:()=>e(),className:"absolute inset-0 size-full cursor-default opacity-0"}),s.jsx(p.Provider,{value:{open:r,onClose:e,transitionState:l,duration:o,anchor:i},children:y})]})})})}function H({children:n,className:a="",...r}){const e=d(t=>t.drawer.menu),{anchor:o,duration:i,transitionState:w}=u.useContext(p),y=u.useMemo(()=>{var m;const t={start:"w-[31.875rem] h-full max-w-[92.5%] rounded-e me-auto",end:"w-[31.875rem] h-full max-w-[92.5%] rounded-s ms-auto",top:"w-full max-h-[92.5%] rounded-b mb-auto",bottom:"w-full max-h-[92.5%] rounded-t mt-auto"},c=(m=e==null?void 0:e.anchor)==null?void 0:m[o];return[t[o],c]},[o,e==null?void 0:e.anchor]),b=u.useMemo(()=>({start:{entering:"translate-x-0",entered:"translate-x-0",exiting:"-translate-x-[calc(100%*var(--drawer-ratio))]",exited:"-translate-x-[calc(100%*var(--drawer-ratio))]",unmounted:""},end:{entering:"translate-x-0",entered:"translate-x-0",exiting:"translate-x-[calc(100%*var(--drawer-ratio))]",exited:"translate-x-[calc(100%*var(--drawer-ratio))]",unmounted:""},top:{entering:"translate-y-0",entered:"translate-y-0",exiting:"-translate-y-full",exited:"-translate-y-full",unmounted:""},bottom:{entering:"translate-y-0",entered:"translate-y-0",exiting:"translate-y-full",exited:"translate-y-full",unmounted:""}})[o],[o]);return s.jsx(f,{as:"div",style:{transitionDuration:`${i}ms`},className:g.twMerge("relative flex flex-col transition-[translate,width] rounded-none",e==null?void 0:e.base,b[w],y,a),...r,children:n})}function N({className:n,...a}){const r=d(e=>e.drawer.header.base);return s.jsx(f.Header,{className:v(r,n),...a})}function k({className:n,...a}){const r=d(e=>e.drawer.body.base);return s.jsx(f.Body,{className:v("flex-1 overflow-auto",r,n),...a})}function S({className:n,...a}){const r=d(e=>e.drawer.footer.base);return s.jsx(f.Footer,{className:v(r,n),...a})}x.Menu=H;x.Header=N;x.Body=k;x.Footer=S;exports.DrawerContext=p;exports.default=x;

package/dist/components/Drawer/index.d.ts

@@ -3,16 +3,14 @@ import { ComponentProps, ElementType } from 'react';
 import { TransitionStatus } from 'react-transition-group';
 type Anchor = "start" | "end" | "top" | "bottom";
 type Context = {
-    open: boolean;
-    onClose: VoidFunction;
     duration: number;
     anchor: Anchor;
     transitionState: TransitionStatus;
-};
+} & ToggleProps;
 type DrawerBaseProps = {
     anchor?: Anchor;
     duration?: number;
-} & ToggleProps;
+} & Partial<ToggleProps>;
 type DrawerProps<E extends ElementType> = ComponentPropsWithAs<E, DrawerBaseProps>;
 type DrawerMenuProps = Omit<ComponentProps<"div">, "as" | "ref">;
 type DrawerHeaderProps = ComponentProps<"div">;

package/dist/components/Drawer/index.es.js

@@ -1,14 +1,14 @@
 "use client";
 import { jsx as s, jsxs as N } from "react/jsx-runtime";
 import d from "../../hooks/useClasses.es.js";
-import { createContext as k, useRef as H, useMemo as y, useImperativeHandle as M, useContext as z } from "react";
-import B from "../../hooks/useKeyDown.es.js";
+import { createContext as H, useRef as k, useMemo as y, useImperativeHandle as M, useContext as z } from "react";
+import { useHotkey as B } from "../../node_modules/@tanstack/react-hotkeys/dist/useHotkey.es.js";
 import { twMerge as h } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
 import v from "../../helpers/cn.es.js";
 import m from "../Card/index.es.js";
 import F from "../Portal/index.es.js";
 import S from "../../node_modules/react-transition-group/esm/Transition.es.js";
-const g = k({
+const g = H({
   open: !1,
   onClose: () => {
   },
@@ -28,28 +28,23 @@ function f({
   children: w,
   ...p
 }) {
-  const e = d((l) => l.drawer), u = H(null), c = n || "div", D = {
+  const e = d((l) => l.drawer), u = k(null), c = n || "div", C = {
     entering: "active opacity-100 pointer-events-auto",
     entered: "active opacity-100 pointer-events-auto",
     exiting: "opacity-0 pointer-events-none",
     exited: "opacity-0 pointer-events-none",
     unmounted: ""
-  }, R = y(() => {
+  }, D = y(() => {
     var b;
     const l = {
       start: "flex-row-reverse",
       end: "flex-row",
       top: "flex-col-reverse",
       bottom: "flex-col"
-    }, C = (b = e == null ? void 0 : e.anchor) == null ? void 0 : b[i];
-    return [l[i], C];
+    }, R = (b = e == null ? void 0 : e.anchor) == null ? void 0 : b[i];
+    return [l[i], R];
   }, [i, e == null ? void 0 : e.anchor]);
-  return M(a, () => u.current), B(
-    () => {
-      t == null || t();
-    },
-    { skip: !r, targetKey: "Escape" }
-  ), /* @__PURE__ */ s(F, { children: /* @__PURE__ */ s(S, { nodeRef: u, in: r, timeout: o, unmountOnExit: !0, children: (l) => /* @__PURE__ */ N(
+  return M(a, () => u.current), B("Escape", () => t(), { enabled: r }), /* @__PURE__ */ s(F, { children: /* @__PURE__ */ s(S, { nodeRef: u, in: r, timeout: o, unmountOnExit: !0, children: (l) => /* @__PURE__ */ N(
     c,
     {
       ref: u,
@@ -58,8 +53,8 @@ function f({
       className: h(
         "fixed size-full inset-0 flex z-10 bg-black/20 backdrop-blur transition-opacity [--drawer-ratio:1] rtl:[--drawer-ratio:-1]",
         e == null ? void 0 : e.base,
-        D[l],
-        R,
+        C[l],
+        D,
         x
       ),
       ...p,
@@ -95,8 +90,8 @@ function j({ children: n, className: a = "", ...r }) {
     const e = {
       start: "w-[31.875rem] h-full max-w-[92.5%] rounded-e me-auto",
       end: "w-[31.875rem] h-full max-w-[92.5%] rounded-s ms-auto",
-      top: "w-full h-[31.875rem] max-h-[92.5%] rounded-b mb-auto",
-      bottom: "w-full h-[31.875rem] max-h-[92.5%] rounded-t mt-auto"
+      top: "w-full max-h-[92.5%] rounded-b mb-auto",
+      bottom: "w-full max-h-[92.5%] rounded-t mt-auto"
     }, u = (c = t == null ? void 0 : t.anchor) == null ? void 0 : c[o];
     return [e[o], u];
   }, [o, t == null ? void 0 : t.anchor]), p = y(() => ({
@@ -150,7 +145,7 @@ function E({ className: n, ...a }) {
   const r = d((t) => t.drawer.header.base);
   return /* @__PURE__ */ s(m.Header, { className: v(r, n), ...a });
 }
-function K({ className: n, ...a }) {
+function P({ className: n, ...a }) {
   const r = d((t) => t.drawer.body.base);
   return /* @__PURE__ */ s(
     m.Body,
@@ -160,14 +155,14 @@ function K({ className: n, ...a }) {
     }
   );
 }
-function P({ className: n, ...a }) {
+function $({ className: n, ...a }) {
   const r = d((t) => t.drawer.footer.base);
   return /* @__PURE__ */ s(m.Footer, { className: v(r, n), ...a });
 }
 f.Menu = j;
 f.Header = E;
-f.Body = K;
-f.Footer = P;
+f.Body = P;
+f.Footer = $;
 export {
   g as DrawerContext,
   f as default

package/dist/components/Menu/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";const r=require("react/jsx-runtime"),E=require("../../hooks/useClasses.cjs.js"),t=require("react"),N=require("../../hooks/useKeyDown.cjs.js"),k=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),W=require("../Portal/index.cjs.js"),I=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),w=t.createContext({open:!1,onClose:()=>{},transitionState:"unmounted",closeOnClick:!1});function H({as:o,ref:u,open:s,onClose:a,closeOnClick:y=!1,anchorEl:c=null,className:b,children:x,...C}){const M=E(e=>e.menu.base),d=o||"div",n=16,i=t.useRef(null),f=t.useRef({left:n,right:n,top:n}),O={entering:"scale-100 opacity-100",entered:"scale-100 opacity-100",exiting:"scale-90 opacity-0",exited:"scale-90 opacity-0",unmounted:""},R=t.useCallback(e=>{f.current=e},[]),q=t.useCallback(e=>{var l,h,p;(l=i.current)==null||l.style.setProperty("--left",`${e.left}px`),(h=i.current)==null||h.style.setProperty("--right",`${e.right}px`),(p=i.current)==null||p.style.setProperty("--top",`${e.top}px`)},[]),m=t.useCallback(()=>{var P,z;if(!s||!c)return;const e=c.getBoundingClientRect(),l=window.innerWidth,h=window.innerHeight,p=((P=i.current)==null?void 0:P.offsetWidth)||150,L=((z=i.current)==null?void 0:z.offsetHeight)||200;let g=e.left,j=e.right,v=e.bottom;g=Math.min(Math.max(g,n),l-p-n),j=Math.min(Math.max(l-e.right,n),l-p-n),v=Math.min(Math.max(v,n),h-L-n),R({left:g,right:j,top:v}),q({left:g,right:j,top:v})},[s,c,R,q]);return t.useEffect(()=>{m()},[m,x]),t.useEffect(()=>{const e=()=>{m()};return window.addEventListener("scroll",e),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e),window.removeEventListener("resize",e)}},[m]),t.useImperativeHandle(u,()=>i.current),N(()=>{a==null||a()},{skip:!s,targetKey:"Escape"}),r.jsx(W,{children:r.jsx(I.default,{nodeRef:i,in:s,timeout:300,unmountOnExit:!0,children:e=>r.jsx(w.Provider,{value:{open:s,onClose:a,transitionState:e,closeOnClick:y},children:r.jsxs(S,{children:[r.jsx($,{}),r.jsx(d,{ref:i,"data-open":s,className:k.twMerge("w-fit min-w-[12.5rem] bg-white shadow rounded p-2 transition-[scale,opacity] absolute top-[var(--top)] left-[var(--left)] right-auto origin-top-left rtl:left-auto rtl:right-[var(--right)] rtl:origin-top-right",M,O[e],b),...C,children:x})]})})})})}function S({children:o}){const{transitionState:u}=t.useContext(w),s={entering:"active pointer-events-auto",entered:"active pointer-events-auto",exiting:"pointer-events-none",exited:"pointer-events-none",unmounted:""};return r.jsx("div",{className:k.twMerge("fixed inset-0 size-full flex flex-col bg-transparent transition-opacity overflow-hidden z-10",s[u]),children:o})}function $(){const{onClose:o}=t.useContext(w);return r.jsx("button",{type:"button",className:"w-full flex-1 opacity-0 cursor-default lg:absolute lg:size-full lg:inset-0",onClick:o})}function B({as:o,closeOnClick:u,type:s="button",className:a,children:y,onClick:c,...b}){const x=o||"div",C=E(f=>f.menu.item.base),{closeOnClick:M,onClose:d}=t.useContext(w),n=u??M,i=f=>{n&&(d==null||d()),c==null||c(f)};return r.jsx(x,{type:s,className:k.twMerge("flex items-center px-3 py-2 w-full text-dark text-base font-normal rounded transition-colors hover:bg-dark hover:text-white",C,a),onClick:i,...b,children:y})}H.Item=B;module.exports=H;
+"use client";"use strict";const i=require("react/jsx-runtime"),z=require("../../hooks/useClasses.cjs.js"),t=require("react"),N=require("../../node_modules/@tanstack/react-hotkeys/dist/useHotkey.cjs.js"),j=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),W=require("../Portal/index.cjs.js"),I=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),b=t.createContext({open:!1,onClose:()=>{},transitionState:"unmounted",closeOnClick:!1});function E({as:o,ref:l,open:s,onClose:c,closeOnClick:u=!1,anchorEl:d=null,className:m,children:h,...C}){const M=z(e=>e.menu.base),f=o||"div",n=16,r=t.useRef(null),p=t.useRef({left:n,right:n,top:n}),O={entering:"scale-100 opacity-100",entered:"scale-100 opacity-100",exiting:"scale-90 opacity-0",exited:"scale-90 opacity-0",unmounted:""},R=t.useCallback(e=>{p.current=e},[]),H=t.useCallback(e=>{var a,v,x;(a=r.current)==null||a.style.setProperty("--left",`${e.left}px`),(v=r.current)==null||v.style.setProperty("--right",`${e.right}px`),(x=r.current)==null||x.style.setProperty("--top",`${e.top}px`)},[]),g=t.useCallback(()=>{var q,P;if(!s||!d)return;const e=d.getBoundingClientRect(),a=window.innerWidth,v=window.innerHeight,x=((q=r.current)==null?void 0:q.offsetWidth)||150,L=((P=r.current)==null?void 0:P.offsetHeight)||200;let w=e.left,k=e.right,y=e.bottom;w=Math.min(Math.max(w,n),a-x-n),k=Math.min(Math.max(a-e.right,n),a-x-n),y=Math.min(Math.max(y,n),v-L-n),R({left:w,right:k,top:y}),H({left:w,right:k,top:y})},[s,d,R,H]);return t.useEffect(()=>{g()},[g,h]),t.useEffect(()=>{const e=()=>{g()};return window.addEventListener("scroll",e),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e),window.removeEventListener("resize",e)}},[g]),t.useImperativeHandle(l,()=>r.current),N.useHotkey("Escape",()=>c==null?void 0:c(),{enabled:s}),i.jsx(W,{children:i.jsx(I.default,{nodeRef:r,in:s,timeout:300,unmountOnExit:!0,children:e=>i.jsx(b.Provider,{value:{open:s,onClose:c,transitionState:e,closeOnClick:u},children:i.jsxs(S,{children:[i.jsx($,{}),i.jsx(f,{ref:r,"data-open":s,className:j.twMerge("w-fit min-w-[12.5rem] bg-white shadow rounded p-2 transition-[scale,opacity] absolute top-[var(--top)] left-[var(--left)] right-auto origin-top-left rtl:left-auto rtl:right-[var(--right)] rtl:origin-top-right",M,O[e],m),...C,children:h})]})})})})}function S({children:o}){const{transitionState:l}=t.useContext(b),s={entering:"active pointer-events-auto",entered:"active pointer-events-auto",exiting:"pointer-events-none",exited:"pointer-events-none",unmounted:""};return i.jsx("div",{className:j.twMerge("fixed inset-0 size-full flex flex-col bg-transparent transition-opacity overflow-hidden z-10",s[l]),children:o})}function $(){const{onClose:o}=t.useContext(b);return i.jsx("button",{type:"button",className:"w-full flex-1 opacity-0 cursor-default lg:absolute lg:size-full lg:inset-0",onClick:o})}function B({as:o,closeOnClick:l,className:s,children:c,onClick:u,...d}){const m=o||"button",h=m==="button"?"button":void 0,C=z(p=>p.menu.item.base),{closeOnClick:M,onClose:f}=t.useContext(b),n=l??M,r=p=>{n&&(f==null||f()),u==null||u(p)};return i.jsx(m,{type:h,className:j.twMerge("flex items-center px-3 py-2 w-full text-dark text-base font-normal rounded cursor-pointer transition-colors hover:bg-dark hover:text-white",C,s),onClick:r,...d,children:c})}E.Item=B;module.exports=E;

package/dist/components/Menu/index.d.ts

@@ -1,9 +1,9 @@
 import { ComponentPropsWithAs, ToggleProps } from '../../types';
 import { ElementType } from 'react';
-type MenuProps = ToggleProps & {
+type MenuProps = {
     anchorEl?: HTMLElement | null;
     closeOnClick?: boolean;
-};
+} & ToggleProps;
 type MenuItemProps = {
     closeOnClick?: boolean;
 };
@@ -11,5 +11,5 @@ declare function Menu<E extends ElementType = "div">({ as, ref, open, onClose, c
 declare namespace Menu {
     var Item: typeof MenuItem;
 }
-declare function MenuItem<E extends ElementType = "button">({ as, closeOnClick: itemCloseOnClick, type, className, children, onClick, ...props }: ComponentPropsWithAs<E, MenuItemProps>): import("react/jsx-runtime").JSX.Element;
+declare function MenuItem<E extends ElementType = "button">({ as, closeOnClick: itemCloseOnClick, className, children, onClick, ...props }: ComponentPropsWithAs<E, MenuItemProps>): import("react/jsx-runtime").JSX.Element;
 export default Menu;

package/dist/components/Menu/index.es.js

@@ -1,30 +1,30 @@
 "use client";
-import { jsx as i, jsxs as $ } from "react/jsx-runtime";
+import { jsx as r, jsxs as $ } from "react/jsx-runtime";
 import W from "../../hooks/useClasses.es.js";
 import { createContext as j, useRef as L, useCallback as k, useEffect as N, useImperativeHandle as B, useContext as P } from "react";
-import K from "../../hooks/useKeyDown.es.js";
-import { twMerge as z } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
-import D from "../Portal/index.es.js";
-import T from "../../node_modules/react-transition-group/esm/Transition.es.js";
-const x = j({
+import { useHotkey as T } from "../../node_modules/@tanstack/react-hotkeys/dist/useHotkey.es.js";
+import { twMerge as H } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
+import q from "../Portal/index.es.js";
+import A from "../../node_modules/react-transition-group/esm/Transition.es.js";
+const y = j({
   open: !1,
   onClose: () => {
   },
   transitionState: "unmounted",
   closeOnClick: !1
 });
-function q({
-  as: r,
-  ref: c,
+function D({
+  as: i,
+  ref: l,
   open: o,
-  onClose: a,
-  closeOnClick: w = !1,
-  anchorEl: s = null,
-  className: y,
-  children: m,
+  onClose: s,
+  closeOnClick: c = !1,
+  anchorEl: u = null,
+  className: p,
+  children: h,
   ...b
 }) {
-  const C = W((t) => t.menu.base), u = r || "div", e = 16, n = L(null), f = L({
+  const C = W((t) => t.menu.base), f = i || "div", e = 16, n = L(null), d = L({
     left: e,
     right: e,
     top: e
@@ -34,71 +34,66 @@ function q({
     exiting: "scale-90 opacity-0",
     exited: "scale-90 opacity-0",
     unmounted: ""
-  }, H = k((t) => {
-    f.current = t;
+  }, z = k((t) => {
+    d.current = t;
   }, []), O = k((t) => {
-    var l, h, d;
-    (l = n.current) == null || l.style.setProperty("--left", `${t.left}px`), (h = n.current) == null || h.style.setProperty("--right", `${t.right}px`), (d = n.current) == null || d.style.setProperty("--top", `${t.top}px`);
-  }, []), p = k(() => {
+    var a, v, m;
+    (a = n.current) == null || a.style.setProperty("--left", `${t.left}px`), (v = n.current) == null || v.style.setProperty("--right", `${t.right}px`), (m = n.current) == null || m.style.setProperty("--top", `${t.top}px`);
+  }, []), g = k(() => {
     var R, E;
-    if (!o || !s) return;
-    const t = s.getBoundingClientRect(), l = window.innerWidth, h = window.innerHeight, d = ((R = n.current) == null ? void 0 : R.offsetWidth) || 150, S = ((E = n.current) == null ? void 0 : E.offsetHeight) || 200;
-    let g = t.left, M = t.right, v = t.bottom;
-    g = Math.min(Math.max(g, e), l - d - e), M = Math.min(
-      Math.max(l - t.right, e),
-      l - d - e
-    ), v = Math.min(Math.max(v, e), h - S - e), H({ left: g, right: M, top: v }), O({ left: g, right: M, top: v });
-  }, [o, s, H, O]);
+    if (!o || !u) return;
+    const t = u.getBoundingClientRect(), a = window.innerWidth, v = window.innerHeight, m = ((R = n.current) == null ? void 0 : R.offsetWidth) || 150, S = ((E = n.current) == null ? void 0 : E.offsetHeight) || 200;
+    let x = t.left, M = t.right, w = t.bottom;
+    x = Math.min(Math.max(x, e), a - m - e), M = Math.min(
+      Math.max(a - t.right, e),
+      a - m - e
+    ), w = Math.min(Math.max(w, e), v - S - e), z({ left: x, right: M, top: w }), O({ left: x, right: M, top: w });
+  }, [o, u, z, O]);
   return N(() => {
-    p();
-  }, [p, m]), N(() => {
+    g();
+  }, [g, h]), N(() => {
     const t = () => {
-      p();
+      g();
     };
     return window.addEventListener("scroll", t), window.addEventListener("resize", t), () => {
       window.removeEventListener("scroll", t), window.removeEventListener("resize", t);
     };
-  }, [p]), B(c, () => n.current), K(
-    () => {
-      a == null || a();
-    },
-    { skip: !o, targetKey: "Escape" }
-  ), /* @__PURE__ */ i(D, { children: /* @__PURE__ */ i(T, { nodeRef: n, in: o, timeout: 300, unmountOnExit: !0, children: (t) => /* @__PURE__ */ i(
-    x.Provider,
+  }, [g]), B(l, () => n.current), T("Escape", () => s == null ? void 0 : s(), { enabled: o }), /* @__PURE__ */ r(q, { children: /* @__PURE__ */ r(A, { nodeRef: n, in: o, timeout: 300, unmountOnExit: !0, children: (t) => /* @__PURE__ */ r(
+    y.Provider,
     {
       value: {
         open: o,
-        onClose: a,
+        onClose: s,
         transitionState: t,
-        closeOnClick: w
+        closeOnClick: c
       },
-      children: /* @__PURE__ */ $(A, { children: [
-        /* @__PURE__ */ i(F, {}),
-        /* @__PURE__ */ i(
-          u,
+      children: /* @__PURE__ */ $(F, { children: [
+        /* @__PURE__ */ r(G, {}),
+        /* @__PURE__ */ r(
+          f,
           {
             ref: n,
             "data-open": o,
-            className: z(
+            className: H(
               "w-fit min-w-[12.5rem] bg-white shadow rounded p-2 transition-[scale,opacity] absolute top-[var(--top)] left-[var(--left)] right-auto origin-top-left rtl:left-auto rtl:right-[var(--right)] rtl:origin-top-right",
               C,
               I[t],
-              y
+              p
             ),
             ...b,
-            children: m
+            children: h
           }
         )
       ] })
     }
   ) }) });
 }
-function A({ children: r }) {
-  const { transitionState: c } = P(x);
-  return /* @__PURE__ */ i(
+function F({ children: i }) {
+  const { transitionState: l } = P(y);
+  return /* @__PURE__ */ r(
     "div",
     {
-      className: z(
+      className: H(
         "fixed inset-0 size-full flex flex-col bg-transparent transition-opacity overflow-hidden z-10",
         {
           entering: "active pointer-events-auto",
@@ -106,51 +101,50 @@ function A({ children: r }) {
           exiting: "pointer-events-none",
           exited: "pointer-events-none",
           unmounted: ""
-        }[c]
+        }[l]
       ),
-      children: r
+      children: i
     }
   );
 }
-function F() {
-  const { onClose: r } = P(x);
-  return /* @__PURE__ */ i(
+function G() {
+  const { onClose: i } = P(y);
+  return /* @__PURE__ */ r(
     "button",
     {
       type: "button",
       className: "w-full flex-1 opacity-0 cursor-default lg:absolute lg:size-full lg:inset-0",
-      onClick: r
+      onClick: i
     }
   );
 }
-function G({
-  as: r,
-  closeOnClick: c,
-  type: o = "button",
-  className: a,
-  children: w,
-  onClick: s,
-  ...y
+function J({
+  as: i,
+  closeOnClick: l,
+  className: o,
+  children: s,
+  onClick: c,
+  ...u
 }) {
-  const m = r || "div", b = W((f) => f.menu.item.base), { closeOnClick: C, onClose: u } = P(x), e = c ?? C, n = (f) => {
-    e && (u == null || u()), s == null || s(f);
+  const p = i || "button", h = p === "button" ? "button" : void 0, b = W((d) => d.menu.item.base), { closeOnClick: C, onClose: f } = P(y), e = l ?? C, n = (d) => {
+    e && (f == null || f()), c == null || c(d);
   };
-  return /* @__PURE__ */ i(
-    m,
+  return /* @__PURE__ */ r(
+    p,
     {
-      type: o,
-      className: z(
-        "flex items-center px-3 py-2 w-full text-dark text-base font-normal rounded transition-colors hover:bg-dark hover:text-white",
+      type: h,
+      className: H(
+        "flex items-center px-3 py-2 w-full text-dark text-base font-normal rounded cursor-pointer transition-colors hover:bg-dark hover:text-white",
         b,
-        a
+        o
       ),
       onClick: n,
-      ...y,
-      children: w
+      ...u,
+      children: s
     }
   );
 }
-q.Item = G;
+D.Item = J;
 export {
-  q as default
+  D as default
 };

package/dist/components/Modal/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),y=require("../../helpers/cn.cjs.js"),c=require("../../hooks/useClasses.cjs.js"),u=require("react"),q=require("../../hooks/useKeyDown.cjs.js"),v=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),x=require("../Card/index.cjs.js"),z=require("../Portal/index.cjs.js"),w=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),g=u.createContext({size:"md",open:!1,onClose:()=>{},transitionState:"unmounted",duration:300});function l({as:t,ref:n,size:s="md",open:e=!1,onClose:o=()=>{},duration:r=300,className:f,children:p,...b}){const d=c(m=>m.modal.base),a=u.useRef(null),M=t||"div",j={entering:"active opacity-100 pointer-events-auto",entered:"active opacity-100 pointer-events-auto",exiting:"opacity-0 pointer-events-none",exited:"opacity-0 pointer-events-none",unmounted:""};return u.useImperativeHandle(n,()=>a.current),q(()=>{o==null||o()},{skip:!e,targetKey:"Escape"}),i.jsx(z,{children:i.jsx(w.default,{nodeRef:a,in:e,timeout:r,unmountOnExit:!0,children:m=>i.jsxs(M,{ref:a,"data-open":e,style:{transitionDuration:`${r}ms`},className:v.twMerge("modal fixed size-full inset-0 flex flex-col z-10 bg-black/20 transition-opacity backdrop-blur p-4",d,j[m],f),...b,children:[i.jsx("button",{type:"button",onClick:()=>o(),className:"absolute inset-0 cursor-default opacity-0"}),i.jsx(g.Provider,{value:{size:s,open:e,onClose:o,transitionState:m,duration:r},children:p})]})})})}function N({className:t,children:n,...s}){const e=c(d=>d.modal.dialog),{size:o,transitionState:r,duration:f}=u.useContext(g),p={entering:"scale-100",entered:"scale-100",exiting:"scale-75",exited:"scale-75",unmounted:""},b=u.useMemo(()=>{var a;return[{sm:"min-[576px]:w-[300px]",md:"min-[576px]:w-[500px]",lg:"min-[992px]:w-[800px]"}[o],(a=e==null?void 0:e.size)==null?void 0:a[o]]},[o,e==null?void 0:e.size]);return i.jsx(x,{as:"div",style:{transitionDuration:`${f}ms`},className:v.twMerge("max-w-full max-h-full m-auto transition-transform",e==null?void 0:e.base,b,p[r],t),...s,children:n})}function S({className:t,...n}){const s=c(e=>e.modal.header.base);return i.jsx(x.Header,{className:y(s,t),...n})}function h({className:t,...n}){const s=c(e=>e.modal.body.base);return i.jsx(x.Body,{className:y(s,t),...n})}function D({className:t,...n}){const s=c(e=>e.modal.footer.base);return i.jsx(x.Footer,{className:y(s,t),...n})}l.Dialog=N;l.Header=S;l.Body=h;l.Footer=D;exports.ModalContext=g;exports.default=l;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),y=require("../../helpers/cn.cjs.js"),l=require("../../hooks/useClasses.cjs.js"),u=require("react"),q=require("../../node_modules/@tanstack/react-hotkeys/dist/useHotkey.cjs.js"),g=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),x=require("../Card/index.cjs.js"),z=require("../Portal/index.cjs.js"),C=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),v=u.createContext({size:"md",open:!1,onClose:()=>{},transitionState:"unmounted",duration:300});function c({as:t,ref:n,size:o="md",open:e=!1,onClose:a=()=>{},duration:r=300,className:f,children:p,...b}){const d=l(m=>m.modal.base),i=u.useRef(null),M=t||"div",j={entering:"active opacity-100 pointer-events-auto",entered:"active opacity-100 pointer-events-auto",exiting:"opacity-0 pointer-events-none",exited:"opacity-0 pointer-events-none",unmounted:""};return u.useImperativeHandle(n,()=>i.current),q.useHotkey("Escape",()=>a(),{enabled:e}),s.jsx(z,{children:s.jsx(C.default,{nodeRef:i,in:e,timeout:r,unmountOnExit:!0,children:m=>s.jsxs(M,{ref:i,"data-open":e,style:{transitionDuration:`${r}ms`},className:g.twMerge("modal fixed size-full inset-0 flex flex-col z-10 bg-black/20 transition-opacity backdrop-blur p-4",d,j[m],f),...b,children:[s.jsx("button",{type:"button",onClick:()=>a(),className:"absolute inset-0 cursor-default opacity-0"}),s.jsx(v.Provider,{value:{size:o,open:e,onClose:a,transitionState:m,duration:r},children:p})]})})})}function w({className:t,children:n,...o}){const e=l(d=>d.modal.dialog),{size:a,transitionState:r,duration:f}=u.useContext(v),p={entering:"scale-100",entered:"scale-100",exiting:"scale-75",exited:"scale-75",unmounted:""},b=u.useMemo(()=>{var i;return[{sm:"min-[576px]:w-[300px]",md:"min-[576px]:w-[500px]",lg:"min-[992px]:w-[800px]"}[a],(i=e==null?void 0:e.size)==null?void 0:i[a]]},[a,e==null?void 0:e.size]);return s.jsx(x,{as:"div",style:{transitionDuration:`${f}ms`},className:g.twMerge("max-w-full max-h-full m-auto transition-transform",e==null?void 0:e.base,b,p[r],t),...o,children:n})}function H({className:t,...n}){const o=l(e=>e.modal.header.base);return s.jsx(x.Header,{className:y(o,t),...n})}function N({className:t,...n}){const o=l(e=>e.modal.body.base);return s.jsx(x.Body,{className:y(o,t),...n})}function S({className:t,...n}){const o=l(e=>e.modal.footer.base);return s.jsx(x.Footer,{className:y(o,t),...n})}c.Dialog=w;c.Header=H;c.Body=N;c.Footer=S;exports.ModalContext=v;exports.default=c;

package/dist/components/Modal/index.d.ts

@@ -3,15 +3,13 @@ import { ComponentProps, ElementType } from 'react';
 import { TransitionStatus } from 'react-transition-group';
 type Context = {
     size: Size;
-    open: boolean;
-    onClose: VoidFunction;
     transitionState: TransitionStatus;
     duration: number;
-};
+} & ToggleProps;
 type ModalProps = {
     size?: Size;
     duration?: number;
-} & ToggleProps;
+} & Partial<ToggleProps>;
 type ModalDialogProps = Omit<ComponentProps<"div">, "as" | "ref">;
 type ModalHeaderProps = ComponentProps<"div">;
 type ModalBodyProps = ComponentProps<"div">;

package/dist/components/Modal/index.es.js

@@ -1,14 +1,14 @@
 "use client";
-import { jsx as i, jsxs as M } from "react/jsx-runtime";
-import y from "../../helpers/cn.es.js";
+import { jsx as a, jsxs as C } from "react/jsx-runtime";
+import b from "../../helpers/cn.es.js";
 import l from "../../hooks/useClasses.es.js";
-import { createContext as w, useRef as N, useImperativeHandle as h, useContext as D, useMemo as k } from "react";
-import C from "../../hooks/useKeyDown.es.js";
-import { twMerge as b } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
+import { createContext as M, useRef as N, useImperativeHandle as h, useContext as w, useMemo as H } from "react";
+import { useHotkey as k } from "../../node_modules/@tanstack/react-hotkeys/dist/useHotkey.es.js";
+import { twMerge as y } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
 import d from "../Card/index.es.js";
-import H from "../Portal/index.es.js";
+import D from "../Portal/index.es.js";
 import S from "../../node_modules/react-transition-group/esm/Transition.es.js";
-const v = w({
+const v = M({
   size: "md",
   open: !1,
   onClose: () => {
@@ -17,36 +17,31 @@ const v = w({
   duration: 300
 });
 function u({
-  as: e,
+  as: t,
   ref: o,
   size: n = "md",
-  open: t = !1,
-  onClose: a = () => {
+  open: e = !1,
+  onClose: i = () => {
   },
   duration: r = 300,
   className: p,
   children: f,
   ...x
 }) {
-  const m = l((c) => c.modal.base), s = N(null), g = e || "div", z = {
+  const m = l((c) => c.modal.base), s = N(null), g = t || "div", z = {
     entering: "active opacity-100 pointer-events-auto",
     entered: "active opacity-100 pointer-events-auto",
     exiting: "opacity-0 pointer-events-none",
     exited: "opacity-0 pointer-events-none",
     unmounted: ""
   };
-  return h(o, () => s.current), C(
-    () => {
-      a == null || a();
-    },
-    { skip: !t, targetKey: "Escape" }
-  ), /* @__PURE__ */ i(H, { children: /* @__PURE__ */ i(S, { nodeRef: s, in: t, timeout: r, unmountOnExit: !0, children: (c) => /* @__PURE__ */ M(
+  return h(o, () => s.current), k("Escape", () => i(), { enabled: e }), /* @__PURE__ */ a(D, { children: /* @__PURE__ */ a(S, { nodeRef: s, in: e, timeout: r, unmountOnExit: !0, children: (c) => /* @__PURE__ */ C(
     g,
     {
       ref: s,
-      "data-open": t,
+      "data-open": e,
       style: { transitionDuration: `${r}ms` },
-      className: b(
+      className: y(
         "modal fixed size-full inset-0 flex flex-col z-10 bg-black/20 transition-opacity backdrop-blur p-4",
         m,
         z[c],
@@ -54,18 +49,18 @@ function u({
       ),
       ...x,
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ a(
           "button",
           {
             type: "button",
-            onClick: () => a(),
+            onClick: () => i(),
             className: "absolute inset-0 cursor-default opacity-0"
           }
         ),
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ a(
           v.Provider,
           {
-            value: { size: n, open: t, onClose: a, transitionState: c, duration: r },
+            value: { size: n, open: e, onClose: i, transitionState: c, duration: r },
             children: f
           }
         )
@@ -73,49 +68,49 @@ function u({
     }
   ) }) });
 }
-function B({ className: e, children: o, ...n }) {
-  const t = l((m) => m.modal.dialog), { size: a, transitionState: r, duration: p } = D(v), f = {
+function B({ className: t, children: o, ...n }) {
+  const e = l((m) => m.modal.dialog), { size: i, transitionState: r, duration: p } = w(v), f = {
     entering: "scale-100",
     entered: "scale-100",
     exiting: "scale-75",
     exited: "scale-75",
     unmounted: ""
-  }, x = k(() => {
+  }, x = H(() => {
     var s;
     return [{
       sm: "min-[576px]:w-[300px]",
       md: "min-[576px]:w-[500px]",
       lg: "min-[992px]:w-[800px]"
-    }[a], (s = t == null ? void 0 : t.size) == null ? void 0 : s[a]];
-  }, [a, t == null ? void 0 : t.size]);
-  return /* @__PURE__ */ i(
+    }[i], (s = e == null ? void 0 : e.size) == null ? void 0 : s[i]];
+  }, [i, e == null ? void 0 : e.size]);
+  return /* @__PURE__ */ a(
     d,
     {
       as: "div",
       style: { transitionDuration: `${p}ms` },
-      className: b(
+      className: y(
         "max-w-full max-h-full m-auto transition-transform",
-        t == null ? void 0 : t.base,
+        e == null ? void 0 : e.base,
         x,
         f[r],
-        e
+        t
       ),
       ...n,
       children: o
     }
   );
 }
-function F({ className: e, ...o }) {
-  const n = l((t) => t.modal.header.base);
-  return /* @__PURE__ */ i(d.Header, { className: y(n, e), ...o });
+function F({ className: t, ...o }) {
+  const n = l((e) => e.modal.header.base);
+  return /* @__PURE__ */ a(d.Header, { className: b(n, t), ...o });
 }
-function R({ className: e, ...o }) {
-  const n = l((t) => t.modal.body.base);
-  return /* @__PURE__ */ i(d.Body, { className: y(n, e), ...o });
+function R({ className: t, ...o }) {
+  const n = l((e) => e.modal.body.base);
+  return /* @__PURE__ */ a(d.Body, { className: b(n, t), ...o });
 }
-function j({ className: e, ...o }) {
-  const n = l((t) => t.modal.footer.base);
-  return /* @__PURE__ */ i(d.Footer, { className: y(n, e), ...o });
+function j({ className: t, ...o }) {
+  const n = l((e) => e.modal.footer.base);
+  return /* @__PURE__ */ a(d.Footer, { className: b(n, t), ...o });
 }
 u.Dialog = B;
 u.Header = F;

package/dist/helpers/scrollIntoView.cjs.js

@@ -1 +1 @@
-"use client";"use strict";function t(e,o={block:"center",inline:"center",behavior:"smooth"}){e.scrollIntoView(o)}module.exports=t;
+"use client";"use strict";function i(t,n={block:"center",inline:"center",behavior:"smooth"}){const o=typeof t=="string"?document.querySelector(t):t;o==null||o.scrollIntoView(n)}module.exports=i;

package/dist/helpers/scrollIntoView.d.ts

@@ -1 +1 @@
-export default function scrollIntoView(element: HTMLElement, option?: ScrollIntoViewOptions): void;
+export default function scrollIntoView(el: HTMLElement | string, option?: ScrollIntoViewOptions | boolean | undefined): void;

package/dist/helpers/scrollIntoView.es.js

@@ -1,11 +1,12 @@
 "use client";
-function n(e, o = {
+function i(t, n = {
   block: "center",
   inline: "center",
   behavior: "smooth"
 }) {
-  e.scrollIntoView(o);
+  const o = typeof t == "string" ? document.querySelector(t) : t;
+  o == null || o.scrollIntoView(n);
 }
 export {
-  n as default
+  i as default
 };

package/dist/hooks/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useClasses.cjs.js"),s=require("./useCreateRipple.cjs.js"),u=require("./useDebounce.cjs.js"),t=require("./useDocumentVisible.cjs.js"),r=require("./useIsOffline.cjs.js"),i=require("./useKeyDown.cjs.js"),o=require("./usePersistedState.cjs.js"),n=require("./useToggle.cjs.js");exports.useClasses=e;exports.useCreateRipple=s;exports.useDebounce=u;exports.useDocumentVisible=t;exports.useIsOffline=r;exports.useKeyDown=i;exports.usePersistedState=o;exports.useToggle=n;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useClasses.cjs.js"),s=require("./useCreateRipple.cjs.js"),u=require("./useDebounce.cjs.js"),t=require("./useDocumentVisible.cjs.js"),r=require("./useIsOffline.cjs.js"),i=require("./usePersistedState.cjs.js"),o=require("./useToggle.cjs.js");exports.useClasses=e;exports.useCreateRipple=s;exports.useDebounce=u;exports.useDocumentVisible=t;exports.useIsOffline=r;exports.usePersistedState=i;exports.useToggle=o;