@dotss/ui 0.0.10 → 0.0.12

package/DatePicker/DatePicker.cjs

@@ -1,8 +1,9 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@emotion/react/jsx-runtime"),f=require("react"),et=require("../IconButton/IconButton.cjs"),Bt=require("../Menu/Menu.cjs"),Nt=require("../Menu/MenuBlock/MenuBlock.cjs"),Gt=require("../core/useTheme.cjs"),Kt=require("@emotion/styled"),V=require("../utils/getContrastingTextColor/getContrastingTextColor.cjs"),Ut=t=>t&&t.__esModule?t:{default:t},T=Ut(Kt),Vt=T.default.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@emotion/react/jsx-runtime"),d=require("react"),st=require("../IconButton/IconButton.cjs"),Ct=require("../Menu/Menu.cjs"),Jt=require("../Menu/MenuBlock/MenuBlock.cjs");require("../Menu/MenuButton/MenuButton.cjs");const Pt=require("../core/useTheme.cjs"),Qt=require("@emotion/styled"),J=require("../utils/getContrastingTextColor/getContrastingTextColor.cjs"),Zt=t=>t&&t.__esModule?t:{default:t},S=Zt(Qt),te=S.default.div`
+  position: relative;
   display: flex;
   flex-direction: column;
   gap: ${({theme:{spacing:t}})=>t.content(2)}px;
-`,Ct=T.default.div`
+`,ee=S.default.div`
   display: inline-flex;
   align-items: center;
   justify-content: flex-start;
@@ -11,63 +12,79 @@
   cursor: ${({clickable:t})=>t?"pointer":"default"};
 
   ${({theme:{typography:{h4B:t}}})=>({fontSize:t.size,fontWeight:t.weight,lineHeight:t.lineHeight,letterSpacing:t.letterSpacing})};
-`,Jt=T.default.div`
+`,ne=S.default.div`
   display: flex;
   align-items: center;
   justify-content: center;
   gap: ${({theme:{spacing:t}})=>t.content(4)}px;
 
   ${({theme:{typography:{h2B:t}}})=>({fontSize:t.size,fontWeight:t.weight,lineHeight:t.lineHeight,letterSpacing:t.letterSpacing})};
-`,Pt=T.default.div`
+`,re=S.default.div`
   display: flex;
   align-items: center;
-  padding: 0 ${({theme:{spacing:t},edgeSpacing:e})=>t.content(e||0)}px;
+  padding: 0 ${({theme:{spacing:t},edgeSpacing:n})=>t.content(n||0)}px;
 
   & > span {
     margin: 5px 0;
     flex-grow: 1;
     text-align: center;
-    ${({theme:{palette:{grey:t},typography:{b4M:e}}})=>({fontSize:e.size,fontWeight:e.weight,lineHeight:e.lineHeight,letterSpacing:e.letterSpacing,color:t[50]})};
+    ${({theme:{palette:{grey:t},typography:{b4M:n}}})=>({fontSize:n.size,fontWeight:n.weight,lineHeight:n.lineHeight,letterSpacing:n.letterSpacing,color:t[50]})};
   }
-`,Qt=T.default.div`
+`,se=S.default.div`
   overflow: hidden;
-`,Zt=T.default.div`
+`,ie=S.default.div`
   display: flex;
   transform: translate3d(0, 0, 0);
-`,jt=T.default.div`
+`,bt=S.default.div`
   display: flex;
   flex-direction: column;
   min-width: 100%;
   gap: ${({theme:{spacing:t}})=>t.content(2)}px;
   padding: ${({theme:{spacing:t}})=>t.content(2)}px
-    ${({theme:{spacing:t},edgeSpacing:e})=>t.content(e||0)}px;
-`,Rt=T.default.div`
+    ${({theme:{spacing:t},edgeSpacing:n})=>t.content(n||0)}px;
+`,zt=S.default.div`
   display: flex;
   width: 100%;
-`,kt=T.default.div`
+`,It=S.default.div`
   position: relative;
   display: inline-flex;
   align-items: center;
   justify-content: center;
+  flex-direction: column;
+  gap: ${({theme:{spacing:t}})=>t.content(1)}px;
   flex: 1;
-  min-width: 30px;
-  min-height: 30px;
-  max-height: 30px;
   cursor: ${({disabled:t})=>t?"not-allowed":"pointer"};
   pointer-events: ${({disabled:t})=>t?"none":"auto"};
-  & > span {
+  min-width: 30px;
+
+  & > div:nth-of-type(1) {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    min-height: 30px;
     z-index: 1;
+
+    & > span {
+      z-index: 2;
+    }
   }
 
   ${({theme:{typography:{b2R:t}}})=>({fontSize:t.size,fontWeight:t.weight,lineHeight:t.lineHeight,letterSpacing:t.letterSpacing})};
 
-  ${({theme:{palette:{brand:t,grey:e}},variant:r,today:d,selected:s,disabled:l})=>{if(s){let o={fontWeight:700,color:V.default(t.primary.main,[e.white,e[100]]),"&:after":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",backgroundColor:l?t.primary.disable:t.primary.main,borderRadius:"50%"}};return r==="start"&&(o={fontWeight:700,color:V.default(t.primary.main,[e.white,e[100]]),overflow:"hidden","&:before":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",backgroundColor:l?t.primary.disable:t.primary.main,borderTopLeftRadius:100,borderBottomLeftRadius:100},"&:after":{content:'""',position:"absolute",top:"50%",left:30,width:"100%",height:30,transform:"translateY(-50%)",backgroundColor:l?t.primary.disable:t.primary.main}}),r==="end"&&(o={fontWeight:700,color:V.default(t.primary.main,[e.white,e[100]]),overflow:"hidden","&:before":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",backgroundColor:l?t.primary.disable:t.primary.main,borderTopRightRadius:100,borderBottomRightRadius:100},"&:after":{content:'""',position:"absolute",top:"50%",right:30,width:"100%",height:30,transform:"translateY(-50%)",backgroundColor:l?t.primary.disable:t.primary.main}}),r==="middle"&&(o={fontWeight:700,color:V.default(t.primary.main,[e.white,e[100]]),overflow:"hidden","&:after":{content:'""',position:"absolute",top:"50%",left:"50%",width:"calc(100% + 1px)",height:30,transform:"translate(-50%, -50%)",backgroundColor:l?t.primary.disable:t.primary.main}}),o}return d?{"&:after":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",border:`1px solid ${t.primary.main}`,borderRadius:"50%"}}:null}};
+  ${({theme:{palette:{brand:t,grey:n}},variant:r,today:s,selected:o,disabled:u})=>{if(o){let i={fontWeight:700,color:J.default(t.primary.main,[n.white,n[100]]),"& > div:nth-of-type(1):before":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",backgroundColor:u?t.primary.disable:t.primary.main,borderRadius:"50%"}};return r==="start"&&(i={fontWeight:700,color:J.default(t.primary.main,[n.white,n[100]]),overflow:"hidden","& > div:nth-of-type(1):before":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",backgroundColor:u?t.primary.disable:t.primary.main,borderTopLeftRadius:100,borderBottomLeftRadius:100},"& > div:nth-of-type(1):after":{content:'""',position:"absolute",top:"50%",left:30,width:"100%",height:30,transform:"translateY(-50%)",backgroundColor:u?t.primary.disable:t.primary.main}}),r==="end"&&(i={fontWeight:700,color:J.default(t.primary.main,[n.white,n[100]]),overflow:"hidden","& > div:nth-of-type(1):before":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",backgroundColor:u?t.primary.disable:t.primary.main,borderTopRightRadius:100,borderBottomRightRadius:100},"& > div:nth-of-type(1):after":{content:'""',position:"absolute",top:"50%",right:"50%",width:"100%",height:30,transform:"translateY(-50%)",backgroundColor:u?t.primary.disable:t.primary.main}}),r==="middle"&&(i={fontWeight:700,color:J.default(t.primary.main,[n.white,n[100]]),overflow:"hidden","& > div:nth-of-type(1):after":{content:'""',position:"absolute",top:"50%",left:"50%",width:"calc(100% + 1px)",height:30,transform:"translate(-50%, -50%)",backgroundColor:u?t.primary.disable:t.primary.main}}),i}return s?{"& > div:nth-of-type(1):after":{content:'""',position:"absolute",top:"50%",left:"50%",width:30,height:30,transform:"translate(-50%, -50%)",border:`1px solid ${t.primary.main}`,borderRadius:"50%"}}:null}};
 
-  ${({theme:{palette:{grey:t,pink:e,brand:r}},holiday:d,disabled:s,selected:l})=>{let o=null;return d&&(o={color:V.default(l?r.primary.main:"transparent",[e[30],e[100]])}),s&&(o={color:t[30]}),s&&d&&(o={color:e[30]}),o}}
-`,te=T.default.div`
+  ${({theme:{palette:{grey:t,pink:n,brand:r}},holiday:s,disabled:o,selected:u})=>{let i=null;return s&&(i={color:J.default(u?r.primary.main:"transparent",[n[30],n[100]])}),o&&(i={color:t[30]}),o&&s&&(i={color:n[30]}),i}}
+`,oe=S.default.div`
   display: flex;
   align-items: center;
   justify-content: center;
 
   cursor: ${({clickable:t})=>t?"pointer":"default"};
-`,ee=30,ne=f.forwardRef(function({onChange:e,value:r,date:d,minDate:s,maxDate:l,holidayDates:o,disableDates:m,showWeekHead:pt=!1,multiple:w=!1,period:C=!1,enableMonthSelect:W=!1,showToday:gt=!1,edgeSpacing:nt=0,inlineCSS:Ht,...bt},zt){const{spacing:yt}=Gt.default(),[L,rt]=f.useState((typeof d=="string"||typeof d=="number"?new Date(d):d)||new Date),[y,B]=f.useState(()=>Array.isArray(r)&&r.length>0?$(r[0]):$(r)),[H,J]=f.useState(()=>Array.isArray(r)&&r.length>1?$(r[r.length-1]):null),[M,Dt]=f.useState(0),[S,E]=f.useState(1),[$t,xt]=f.useState(!1),[st,wt]=f.useState(!1),it=f.useRef(null),p=f.useRef(null),P=f.useRef(0),R=f.useRef(0),A=f.useRef(!1),N=f.useRef(S),ot=f.useRef(),ct=f.useRef(null),at=f.useRef(null),k=L.getFullYear(),Q=L.getMonth(),St=mt(k,Q),G=I(Q),Y=$(r),F=$(o),_=$(m),lt=O(L,s)||vt(L,s),ut=z(L,l)||vt(L,l),Z=new Date(k,Q-1),tt=new Date(k,Q+1),K=`${k}. ${G}`,q=C&&!!y&&!!H,Mt=[{year:Z.getFullYear(),month:I(Z.getMonth()),weeks:mt(Z.getFullYear(),Z.getMonth())},{year:k,month:G,weeks:St},{year:tt.getFullYear(),month:I(tt.getMonth()),weeks:mt(tt.getFullYear(),tt.getMonth())}],It=Mt[1].weeks.length*(ee+yt.content(2))+yt.content(2),Tt=n=>()=>{w&&(p.current&&(p.current.style.transition="none",p.current.style.cursor="grabbing"),P.current=n,A.current=!0)},b=f.useCallback(()=>{if(!A.current)return;const n=M-R.current,u=Math.abs(M-n),a=M*.1;p.current&&(p.current.style.transform=`translate3d(-${M*S}px, 0, 0)`,p.current.style.cursor="grab",p.current.style.transition="transform 0.2s"),P.current=0,R.current=0,A.current=!1,!(u<=a)&&(M<n?E(g=>g+1):M>n&&E(g=>g-1))},[M,S]),At=n=>()=>{if(!(A.current||S!==1)){if(!C){e==null||e(n,$);return}if(j(n,y)&&Array.isArray(r)&&r.length===1){B(null),J(null),e==null||e([],$);return}else if(j(n,y)&&!Array.isArray(r)&&j(n,r)){B(null),J(null),e==null||e([],$);return}if(!y){B(n),e==null||e(n,$);return}if(!H&&y){const[u,a]=z(n,y)?[y,n]:[n,y];B(u),J(a);const g=Wt([u,a],m);e==null||e(g,$);return}y&&H&&(B(n),J(null),e==null||e(n,$))}},Lt=n=>Tt(n.clientX)(),Et=n=>Tt(n.touches[0].clientX)(),Yt=()=>{$t||(p.current&&(p.current.style.transition="transform 0.2s"),E(n=>n-1))},Ft=()=>{$t||(p.current&&(p.current.style.transition="transform 0.2s"),E(n=>n+1))},ft=()=>wt(n=>!n),_t=n=>{if(!n)return;const[u,a]=n.toString().split(".").map(Number);rt(new Date(u,a-1)),wt(!1)};return f.useLayoutEffect(()=>{var n;Dt(((n=it.current)==null?void 0:n.clientWidth)||0)},[w]),f.useEffect(()=>{const n=()=>{var u;Dt(((u=it.current)==null?void 0:u.clientWidth)||0)};return window.addEventListener("resize",n),window.addEventListener("scroll",n),()=>{window.removeEventListener("resize",n),window.removeEventListener("scroll",n)}},[w]),f.useEffect(()=>{const n=p.current,u=(i,x,D)=>{if(!n||!A.current)return;R.current=i-P.current;const h=x-P.current,v=5;if(A.current=A.current||Math.abs(R.current)>v&&Math.abs(h)<v*2,D.cancelable&&D.preventDefault(),A.current){if(lt&&R.current>0){b();return}if(ut&&R.current<0){b();return}Math.abs(R.current)>=10&&(n.style.transform=`translate3d(${R.current-M*S}px, 0, 0)`,n.style.cursor="grabbing")}},a=i=>u(i.touches[0].clientX,i.touches[0].clientY,i),g=i=>{A.current&&u(i.clientX,i.clientY,i)};return n==null||n.addEventListener("mousemove",g),n==null||n.addEventListener("touchmove",a),()=>{n==null||n.removeEventListener("mousemove",g),n==null||n.removeEventListener("touchmove",a)}},[M,S,b,ut,lt]),f.useEffect(()=>{xt(!0),ot.current=setTimeout(()=>{p.current&&(p.current.style.transition="none"),S>N.current?(E(1),rt(n=>new Date(n.setMonth(n.getMonth()+1))),N.current=1):S<N.current?(rt(n=>new Date(n.setMonth(n.getMonth()-1))),E(1),N.current=1):N.current=S,xt(!1)},200)},[S]),f.useLayoutEffect(()=>{if(!C||!Array.isArray(r))return;const n=Wt(r,m);r.length<n.length&&(e==null||e(n,$))},[C,r,e,m]),f.useEffect(()=>{let n;return st&&(n=setTimeout(()=>{if(at.current){const u=at.current.querySelector("ul"),a=u==null?void 0:u.querySelector(`[data-value="${K}"]`);a==null||a.scrollIntoView({block:"start"})}},200)),()=>{clearTimeout(n)}},[st,K]),f.useEffect(()=>()=>{ot.current&&clearTimeout(ot.current)},[]),c.jsxs(Vt,{ref:zt,...bt,css:Ht,children:[w?c.jsxs(Jt,{children:[c.jsx(et.default,{name:"ChevronLeftLine",size:"small",onClick:Yt,disabled:lt}),c.jsxs(te,{ref:ct,clickable:!!W,onClick:W?ft:void 0,children:[K,W&&c.jsx(et.default,{name:"ArrowDownFill",size:"xSmall"})]}),c.jsx(et.default,{name:"ChevronRightLine",size:"small",onClick:Ft,disabled:ut})]}):c.jsxs(Ct,{ref:ct,clickable:!!W,onClick:W?ft:void 0,children:[K,W&&c.jsx(et.default,{name:"ArrowDownFill",size:"xSmall"})]}),W&&c.jsx(Bt.default,{anchorRef:ct,ref:at,open:st,onClose:ft,onChange:_t,value:K,placement:w?"bottom-center":"bottom-left",width:160,fitToAnchorWidth:!1,maxHeight:368,children:Array.from({length:130},(n,u)=>{const a=1970+u;return Array.from({length:12},(g,i)=>{const x=i+1,D=x<10?`0${x}`:x,h=new Date(a,i+1,0).getDate(),v=`${a}-${D}-${h}`,U=`${a}-${D}-01`;return O(v,s)||z(U,l)?null:c.jsx(Nt.default,{value:`${a}. ${D}`,children:`${a}. ${D}`},`${a}-${D}`)})})}),pt&&c.jsxs(Pt,{edgeSpacing:nt,children:[c.jsx("span",{children:"일"}),c.jsx("span",{children:"월"}),c.jsx("span",{children:"화"}),c.jsx("span",{children:"수"}),c.jsx("span",{children:"목"}),c.jsx("span",{children:"금"}),c.jsx("span",{children:"토"})]}),c.jsx(Qt,{ref:it,children:c.jsxs(Zt,{ref:p,onMouseDown:Lt,onMouseUp:b,onMouseLeave:b,onTouchStart:Et,onTouchEnd:b,onTouchCancel:b,style:{transform:w?`translate3d(-${M*S}px, 0, 0)`:void 0,cursor:w?"grab":void 0,maxHeight:It},children:[w&&Mt.map(({year:n,month:u,weeks:a})=>c.jsx(jt,{edgeSpacing:nt,children:a.map((g,i)=>c.jsx(Rt,{children:g.map((x,D)=>{const h=`${n}-${u}-${X(x||0)}`,v=j(h,new Date),U=Array.isArray(F)?F.includes(h):F===h,dt=Array.isArray(Y)?Y.includes(h):Y===h,ht=!x||(Array.isArray(_)?_.includes(h):_===h)||z(h,l)||O(h,s),qt=q&&j(h,y),Ot=q&&j(h,H),Xt=q&&z(h,y)&&O(h,H);return c.jsx(kt,{variant:qt?"start":Ot?"end":Xt?"middle":void 0,onClick:At(h),today:gt&&v,holiday:U,selected:dt,disabled:ht,children:c.jsx("span",{children:x})},`${n}-${u}-week-row-${D}-${x?h:`${i}-${D}`}`)})},`${n}-${u}-week-row-${String(g)}`))},`week-body-${n}-${u}`)),!w&&c.jsx(jt,{edgeSpacing:nt,children:St.map((n,u)=>c.jsx(Rt,{children:n.map((a,g)=>{const i=`${k}-${G}-${X(a||0)}`,x=j(i,new Date),D=Array.isArray(F)?F.includes(i):F===i,h=Array.isArray(Y)?Y.includes(i):Y===i,v=!a||(Array.isArray(_)?_.includes(i):_===i)||z(i,l)||O(i,s),U=q&&j(i,y),dt=q&&j(i,H),ht=q&&z(i,y)&&O(i,H);return c.jsx(kt,{variant:U?"start":dt?"end":ht?"middle":void 0,onClick:At(i),today:gt&&x,holiday:D,selected:h,disabled:v,children:c.jsx("span",{children:a})},`${k}-${G}-week-row-${n}-${a?i:`${u}-${g}`}`)})},`${k}-${G}-week-row-${String(n)}`))})]})})]})});function mt(t,e){let r=[];const d=new Date(t,e,1),s=new Date(t,e+1,0).getDate(),l=d.getDay();let o=Array.from({length:l}).fill(null);for(let m=1;m<=s;m+=1)o.push(m),(o.length===7||m===s)&&(r.push(o),o=[]);return r=r.map(m=>Array.from({length:7}).map((pt,w)=>m[w]||null)),r}function I(t){return String(t+1).length===1?`0${t+1}`:t+1}function X(t){return String(t).length===1?`0${t}`:t}function $(t){if(Array.isArray(t))return t.map(e=>e instanceof Date?`${e.getFullYear()}-${I(e.getMonth())}-${X(e.getDate())}`:e);if(t instanceof Date)return`${t.getFullYear()}-${I(t.getMonth())}-${X(t.getDate())}`;if(typeof t=="number"){const e=new Date(t);return`${e.getFullYear()}-${I(e.getMonth())}-${X(e.getDate())}`}return t}function z(t,e){if(!t||!e)return!1;const r=t instanceof Date?t:new Date(t);r.setHours(0),r.setMinutes(0),r.setSeconds(0),r.setMilliseconds(0);const d=r.getTime(),s=e instanceof Date?e:new Date(e);s.setHours(0),s.setMinutes(0),s.setSeconds(0),s.setMilliseconds(0);const l=s.getTime();return d>l}function O(t,e){if(!t||!e)return!1;const r=t instanceof Date?t:new Date(t);r.setHours(0),r.setMinutes(0),r.setSeconds(0),r.setMilliseconds(0);const d=r.getTime(),s=e instanceof Date?e:new Date(e);s.setHours(0),s.setMinutes(0),s.setSeconds(0),s.setMilliseconds(0);const l=s.getTime();return d<l}function vt(t,e){if(!t||!e)return!1;const r=t instanceof Date?t:new Date(t),d=e instanceof Date?e:new Date(e);return`${r.getFullYear()}-${r.getMonth()}`==`${d.getFullYear()}-${d.getMonth()}`}function j(t,e){if(!t||!e)return!1;const r=t instanceof Date?t:new Date(t);r.setHours(0),r.setMinutes(0),r.setSeconds(0),r.setMilliseconds(0);const d=r.getTime(),s=e instanceof Date?e:new Date(e);s.setHours(0),s.setMinutes(0),s.setSeconds(0),s.setMilliseconds(0);const l=s.getTime();return d===l}function Wt(t,e){if(!t||!Array.isArray(t)||t.length===0)return[];const r=t.map(m=>m instanceof Date?m:m===null?new Date:new Date(m)),d=new Date(Math.min(...r.map(m=>m.getTime()))),s=new Date(Math.max(...r.map(m=>m.getTime()))),l=[],o=new Date(d);for(;o<=s;){if(Array.isArray(e)&&e.includes(o)){o.setDate(o.getDate()+1);continue}else if(e===o){o.setDate(o.getDate()+1);continue}l.push(`${o.getFullYear()}-${I(o.getMonth())}-${X(o.getDate())}`),o.setDate(o.getDate()+1)}return l}exports.default=ne;
+`,Lt=S.default.span`
+  width: 100%;
+  min-width: 100%;
+  height: 6px;
+  min-height: 6px;
+`,ce=30,ae=d.forwardRef(function({children:n,onChange:r,value:s,date:o,minDate:u,maxDate:i,holidayDates:p,disableDates:N,showWeekHead:it=!1,multiple:j=!1,period:P=!1,enableMonthSelect:W=!1,showToday:wt=!1,edgeSpacing:ot=0,renderEvent:H,inlineCSS:_t,...qt},Ot){const{spacing:St}=Pt.default(),[Y,ct]=d.useState((typeof o=="string"||typeof o=="number"?new Date(o):o)||new Date),[D,G]=d.useState(()=>Array.isArray(s)&&s.length>0?x(s[0]):x(s)),[b,Q]=d.useState(()=>Array.isArray(s)&&s.length>1?x(s[s.length-1]):null),[M,Mt]=d.useState(0),[w,F]=d.useState(1),[jt,Tt]=d.useState(!1),[at,At]=d.useState(!1),lt=d.useRef(null),m=d.useRef(null),Z=d.useRef(0),v=d.useRef(0),T=d.useRef(!1),K=d.useRef(w),ut=d.useRef(),ft=d.useRef(null),dt=d.useRef(null),k=Y.getFullYear(),tt=Y.getMonth(),Rt=xt(k,tt),U=L(tt),_=x(s),q=x(p),O=x(N),ht=X(Y,u)||Yt(Y,u),pt=I(Y,i)||Yt(Y,i),et=new Date(k,tt-1),nt=new Date(k,tt+1),V=`${k}. ${U}`,E=P&&!!D&&!!b,vt=[{year:et.getFullYear(),month:L(et.getMonth()),weeks:xt(et.getFullYear(),et.getMonth())},{year:k,month:U,weeks:Rt},{year:nt.getFullYear(),month:L(nt.getMonth()),weeks:xt(nt.getFullYear(),nt.getMonth())}],mt=typeof H=="function",Et=vt[1].weeks.length*(ce+(mt?10:0)+St.content(2))+St.content(2),kt=e=>()=>{j&&(m.current&&(m.current.style.transition="none",m.current.style.cursor="grabbing"),Z.current=e,T.current=!0)},z=d.useCallback(()=>{if(!T.current)return;const e=M-v.current,f=Math.abs(M-e),l=M*.1;m.current&&(m.current.style.transform=`translate3d(-${M*w}px, 0, 0)`,m.current.style.cursor="grab",m.current.style.transition="transform 0.2s"),Z.current=0,v.current=0,T.current=!1,!(f<=l)&&(M<e?F(y=>y+1):M>e&&F(y=>y-1))},[M,w]),Wt=e=>()=>{if(!(T.current||w!==1)){if(!P){r==null||r(e,x);return}if(R(e,D)&&Array.isArray(s)&&s.length===1){G(null),Q(null),r==null||r([],x);return}else if(R(e,D)&&!Array.isArray(s)&&R(e,s)){G(null),Q(null),r==null||r([],x);return}if(!D){G(e),r==null||r(e,x);return}if(!b&&D){const[f,l]=I(e,D)?[D,e]:[e,D];G(f),Q(l);const y=Ft([f,l],N);r==null||r(y,x);return}D&&b&&(G(e),Q(null),r==null||r(e,x))}},Xt=e=>kt(e.clientX)(),Bt=e=>kt(e.touches[0].clientX)(),Nt=()=>{jt||(m.current&&(m.current.style.transition="transform 0.2s"),F(e=>e-1))},Gt=()=>{jt||(m.current&&(m.current.style.transition="transform 0.2s"),F(e=>e+1))},yt=()=>At(e=>!e),Kt=e=>{if(!e)return;const[f,l]=e.toString().split(".").map(Number);ct(new Date(f,l-1)),At(!1)};return d.useLayoutEffect(()=>{var e;Mt(((e=lt.current)==null?void 0:e.clientWidth)||0)},[j]),d.useEffect(()=>{const e=()=>{var f;Mt(((f=lt.current)==null?void 0:f.clientWidth)||0)};return window.addEventListener("resize",e),window.addEventListener("scroll",e),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e)}},[j]),d.useEffect(()=>{const e=m.current,f=(a,g,$)=>{if(!e||!T.current)return;v.current=a-Z.current;const h=g-Z.current,A=5;if(T.current=T.current||Math.abs(v.current)>A&&Math.abs(h)<A*2,$.cancelable&&$.preventDefault(),T.current){if(ht&&v.current>0){z();return}if(pt&&v.current<0){z();return}Math.abs(v.current)>=10&&(e.style.transform=`translate3d(${v.current-M*w}px, 0, 0)`,e.style.cursor="grabbing")}},l=a=>f(a.touches[0].clientX,a.touches[0].clientY,a),y=a=>{T.current&&f(a.clientX,a.clientY,a)};return e==null||e.addEventListener("mousemove",y),e==null||e.addEventListener("touchmove",l),()=>{e==null||e.removeEventListener("mousemove",y),e==null||e.removeEventListener("touchmove",l)}},[M,w,z,pt,ht]),d.useEffect(()=>{Tt(!0),ut.current=setTimeout(()=>{m.current&&(m.current.style.transition="none"),w>K.current?(F(1),ct(e=>new Date(e.setMonth(e.getMonth()+1))),K.current=1):w<K.current?(ct(e=>new Date(e.setMonth(e.getMonth()-1))),F(1),K.current=1):K.current=w,Tt(!1)},200)},[w]),d.useLayoutEffect(()=>{if(!P||!Array.isArray(s))return;const e=Ft(s,N);s.length<e.length&&(r==null||r(e,x))},[P,s,r,N]),d.useEffect(()=>{let e;return at&&(e=setTimeout(()=>{if(dt.current){const f=dt.current.querySelector("ul"),l=f==null?void 0:f.querySelector(`[data-value="${V}"]`);l==null||l.scrollIntoView({block:"start"})}},200)),()=>{clearTimeout(e)}},[at,V]),d.useEffect(()=>()=>{ut.current&&clearTimeout(ut.current)},[]),c.jsxs(te,{ref:Ot,...qt,css:_t,children:[j?c.jsxs(ne,{children:[c.jsx(st.default,{name:"ChevronLeftLine",size:"small",onClick:Nt,disabled:ht}),c.jsxs(oe,{ref:ft,clickable:!!W,onClick:W?yt:void 0,children:[V,W&&c.jsx(st.default,{name:"ArrowDownFill",size:"xSmall"})]}),c.jsx(st.default,{name:"ChevronRightLine",size:"small",onClick:Gt,disabled:pt})]}):c.jsxs(ee,{ref:ft,clickable:!!W,onClick:W?yt:void 0,children:[V,W&&c.jsx(st.default,{name:"ArrowDownFill",size:"xSmall"})]}),W&&c.jsx(Ct.default,{anchorRef:ft,ref:dt,open:at,onClose:yt,onChange:Kt,value:V,placement:j?"bottom-center":"bottom-left",width:160,fitToAnchorWidth:!1,maxHeight:368,children:Array.from({length:130},(e,f)=>{const l=1970+f;return Array.from({length:12},(y,a)=>{const g=a+1,$=g<10?`0${g}`:g,h=new Date(l,a+1,0).getDate(),A=`${l}-${$}-${h}`,C=`${l}-${$}-01`;return X(A,u)||I(C,i)?null:c.jsx(Jt.default,{value:`${l}. ${$}`,children:`${l}. ${$}`},`${l}-${$}`)})})}),it&&c.jsxs(re,{edgeSpacing:ot,children:[c.jsx("span",{children:"일"}),c.jsx("span",{children:"월"}),c.jsx("span",{children:"화"}),c.jsx("span",{children:"수"}),c.jsx("span",{children:"목"}),c.jsx("span",{children:"금"}),c.jsx("span",{children:"토"})]}),c.jsx(se,{ref:lt,children:c.jsxs(ie,{ref:m,onMouseDown:Xt,onMouseUp:z,onMouseLeave:z,onTouchStart:Bt,onTouchEnd:z,onTouchCancel:z,style:{transform:j?`translate3d(-${M*w}px, 0, 0)`:void 0,cursor:j?"grab":void 0,maxHeight:Et},children:[j&&vt.map(({year:e,month:f,weeks:l})=>c.jsx(bt,{edgeSpacing:ot,children:l.map((y,a)=>c.jsx(zt,{children:y.map((g,$)=>{const h=`${e}-${f}-${B(g||0)}`,A=!g,C=R(h,new Date),gt=Array.isArray(q)?q.includes(h):q===h,Dt=Array.isArray(_)?_.includes(h):_===h,$t=!g||(Array.isArray(O)?O.includes(h):O===h)||I(h,i)||X(h,u),rt=E&&R(h,D),Ut=E&&R(h,b),Vt=E&&I(h,D)&&X(h,b),Ht=H==null?void 0:H(h);return c.jsxs(It,{variant:rt?"start":Ut?"end":Vt?"middle":void 0,onClick:Wt(h),today:wt&&C,holiday:gt,selected:Dt,disabled:$t,children:[c.jsx("div",{children:c.jsx("span",{children:g})}),!A&&Ht,!A&&mt&&!Ht&&c.jsx(Lt,{})]},`${e}-${f}-week-row-${$}-${g?h:`${a}-${$}`}`)})},`${e}-${f}-week-row-${String(y)}`))},`week-body-${e}-${f}`)),!j&&c.jsx(bt,{edgeSpacing:ot,children:Rt.map((e,f)=>c.jsx(zt,{children:e.map((l,y)=>{const a=`${k}-${U}-${B(l||0)}`,g=!l,$=R(a,new Date),h=Array.isArray(q)?q.includes(a):q===a,A=Array.isArray(_)?_.includes(a):_===a,C=!l||(Array.isArray(O)?O.includes(a):O===a)||I(a,i)||X(a,u),gt=E&&R(a,D),Dt=E&&R(a,b),$t=E&&I(a,D)&&X(a,b),rt=H==null?void 0:H(a);return c.jsxs(It,{variant:gt?"start":Dt?"end":$t?"middle":void 0,onClick:Wt(a),today:wt&&$,holiday:h,selected:A,disabled:C,children:[c.jsx("div",{children:c.jsx("span",{children:l})}),!g&&rt,!g&&mt&&!rt&&c.jsx(Lt,{})]},`${k}-${U}-week-row-${e}-${l?a:`${f}-${y}`}`)})},`${k}-${U}-week-row-${String(e)}`))})]})}),n]})});function xt(t,n){let r=[];const s=new Date(t,n,1),o=new Date(t,n+1,0).getDate(),u=s.getDay();let i=Array.from({length:u}).fill(null);for(let p=1;p<=o;p+=1)i.push(p),(i.length===7||p===o)&&(r.push(i),i=[]);return r=r.map(p=>Array.from({length:7}).map((N,it)=>p[it]||null)),r}function L(t){return String(t+1).length===1?`0${t+1}`:t+1}function B(t){return String(t).length===1?`0${t}`:t}function x(t){if(Array.isArray(t))return t.map(n=>n instanceof Date?`${n.getFullYear()}-${L(n.getMonth())}-${B(n.getDate())}`:n);if(t instanceof Date)return`${t.getFullYear()}-${L(t.getMonth())}-${B(t.getDate())}`;if(typeof t=="number"){const n=new Date(t);return`${n.getFullYear()}-${L(n.getMonth())}-${B(n.getDate())}`}return t}function I(t,n){if(!t||!n)return!1;const r=t instanceof Date?t:new Date(t);r.setHours(0),r.setMinutes(0),r.setSeconds(0),r.setMilliseconds(0);const s=r.getTime(),o=n instanceof Date?n:new Date(n);o.setHours(0),o.setMinutes(0),o.setSeconds(0),o.setMilliseconds(0);const u=o.getTime();return s>u}function X(t,n){if(!t||!n)return!1;const r=t instanceof Date?t:new Date(t);r.setHours(0),r.setMinutes(0),r.setSeconds(0),r.setMilliseconds(0);const s=r.getTime(),o=n instanceof Date?n:new Date(n);o.setHours(0),o.setMinutes(0),o.setSeconds(0),o.setMilliseconds(0);const u=o.getTime();return s<u}function Yt(t,n){if(!t||!n)return!1;const r=t instanceof Date?t:new Date(t),s=n instanceof Date?n:new Date(n);return`${r.getFullYear()}-${r.getMonth()}`==`${s.getFullYear()}-${s.getMonth()}`}function R(t,n){if(!t||!n)return!1;const r=t instanceof Date?t:new Date(t);r.setHours(0),r.setMinutes(0),r.setSeconds(0),r.setMilliseconds(0);const s=r.getTime(),o=n instanceof Date?n:new Date(n);o.setHours(0),o.setMinutes(0),o.setSeconds(0),o.setMilliseconds(0);const u=o.getTime();return s===u}function Ft(t,n){if(!t||!Array.isArray(t)||t.length===0)return[];const r=t.map(p=>p instanceof Date?p:p===null?new Date:new Date(p)),s=new Date(Math.min(...r.map(p=>p.getTime()))),o=new Date(Math.max(...r.map(p=>p.getTime()))),u=[],i=new Date(s);for(;i<=o;){if(Array.isArray(n)&&n.includes(i)){i.setDate(i.getDate()+1);continue}else if(n===i){i.setDate(i.getDate()+1);continue}u.push(`${i.getFullYear()}-${L(i.getMonth())}-${B(i.getDate())}`),i.setDate(i.getDate()+1)}return u}exports.default=ae;

package/DatePicker/DatePicker.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 import { GeneralComponentProps } from '../typings/component';
 
 export type DateValue = string | number | Date | null;
@@ -18,6 +18,7 @@ export interface DatePickerProps extends GeneralComponentProps<Omit<HTMLAttribut
     enableMonthSelect?: boolean;
     showToday?: boolean;
     edgeSpacing?: number;
+    renderEvent?: (date: string) => ReactNode;
 }
 declare const DatePicker: import('react').ForwardRefExoticComponent<DatePickerProps & import('react').RefAttributes<HTMLDivElement>>;
 export default DatePicker;