@buildix/wheel-datepicker
Version:
A modern, customizable wheel datepicker component for React applications, offering intuitive date selection with a smooth scrolling interface.
3 lines (2 loc) • 8.47 kB
JavaScript
;var e=require("react/jsx-runtime"),n=require("react"),t=function(){return t=Object.assign||function(e){for(var n,t=1,r=arguments.length;t<r;t++)for(var a in n=arguments[t])Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a]);return e},t.apply(this,arguments)};function r(e,n){var t={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&n.indexOf(r)<0&&(t[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(r=Object.getOwnPropertySymbols(e);a<r.length;a++)n.indexOf(r[a])<0&&Object.prototype.propertyIsEnumerable.call(e,r[a])&&(t[r[a]]=e[r[a]])}return t}function a(e,n,t){if(t||2===arguments.length)for(var r,a=0,o=n.length;a<o;a++)!r&&a in n||(r||(r=Array.prototype.slice.call(n,0,a)),r[a]=n[a]);return e.concat(r||Array.prototype.slice.call(n))}function o(){var e=new Date;return{year:e.getFullYear(),month:e.getMonth()+1,day:e.getDate()}}function i(e){var n=e.month.toString().padStart(2,"0"),t=e.day.toString().padStart(2,"0");return"".concat(e.year,"/").concat(n,"/").concat(t)}function l(e,n){return new Date(e,n,0).getDate()}function c(e){return!(e.month<1||e.month>12||e.day<1||e.day>l(e.year,e.month))}function u(e,n){return n<=6?31:n<=11||function(e){return(e+12)%33%4==1}(e)?30:29}function s(e){var n=e.month.toString().padStart(2,"0"),t=e.day.toString().padStart(2,"0");return"".concat(e.year,"/").concat(n,"/").concat(t)}function d(){var e=new Date;return function(e,n,t){var r=e<=1600?0:979;e-=e<=1600?621:1600;var a=n>2?e+1:e,o=365*e+parseInt(String((a+3)/4))-parseInt(String((a+99)/100))+parseInt(String((a+399)/400))-80+t+[0,31,59,90,120,151,181,212,243,273,304,334][n-1];return r+=33*parseInt(String(o/12053)),o%=12053,r+=4*parseInt(String(o/1461)),o%=1461,r+=parseInt(String((o-1)/365)),o>365&&(o=(o-1)%365),{year:r,month:o<186?1+parseInt(String(o/31)):7+parseInt(String((o-186)/30)),day:1+(o<186?o%31:(o-186)%30)}}(e.getFullYear(),e.getMonth()+1,e.getDate())}function m(e){return!(e.month<1||e.month>12)&&!(e.day<1||e.day>u(e.year,e.month))}"function"==typeof SuppressedError&&SuppressedError;var f=function(n){var a=n.size,o=void 0===a?"medium":a,i=n.className,l=void 0===i?"":i,c=n.children,u=void 0===c?"":c,s=n.onClick,d=r(n,["size","className","children","onClick"]),m="wd-button wd-button-".concat(o," ").concat(l);return e.jsx("button",t({onClick:s,className:m},d,{children:u}))},h=n.forwardRef(function(n,a){var o=n.label,i=n.error,l=n.className,c=void 0===l?"":l,u=n.value,s=n.name,d=n.rtl,m=void 0!==d&&d,f=r(n,["label","error","className","value","name","rtl"]);return e.jsxs("div",{className:"wd-input-container ".concat(m?"wd-input-rtl":""," ").concat(c),children:[o&&e.jsx("label",{className:"wd-input-label",children:o}),e.jsx("input",t({ref:a,readOnly:!0,className:"wd-input-field ".concat(i?"wd-input-error":""),type:"text",value:u,dir:m?"rtl":"ltr",name:s||"date"},f)),i&&e.jsx("span",{className:"wd-input-error-message",children:i})]})});h.displayName="Input";var p=function(t){var r=t.isOpen,a=t.onClose,o=t.title,i=t.placement,l=void 0===i?"bottom":i,c=t.children,u=t.className,s=void 0===u?"":u,d=t.rtl,m=void 0!==d&&d,f=t.closeIcon;if(n.useEffect(function(){return document.body.style.overflow=r?"hidden":"unset",function(){document.body.style.overflow="unset"}},[r]),!r)return null;var h="wd-modal wd-modal-".concat(l," ").concat(m?"wd-modal-rtl":""," ").concat(s);return e.jsx("div",{className:"wd-modal-overlay",onClick:a,children:e.jsxs("div",{className:h,onClick:function(e){return e.stopPropagation()},dir:m?"rtl":"ltr",children:[o&&e.jsxs("div",{className:"wd-modal-header",children:[e.jsx("h3",{className:"wd-modal-title",children:o}),e.jsx("button",{className:"wd-modal-close",onClick:a,children:f||"×"})]}),e.jsx("div",{className:"wd-modal-content",children:c})]})})},v=function(t){var r=t.items,o=t.onChange,i=t.visibleCount,l=void 0===i?3:i,c=t.value,u=t.scrollContainerClassName,s=t.containerClassName,d=t.itemClassName,m=t.indicatorClassName,f=t.itemHeight,h=t.indicatorBorderColor,p=t.indicatorBorderWidth,v=n.useRef(null),y=n.useRef(null),w=f||40,g=Math.floor(l/2),b=a(a(a([],Array(g).fill(""),!0),r,!0),Array(g).fill(""),!0),j=n.useState(0),x=j[0],N=j[1];n.useEffect(function(){if(void 0!==c){var e=r.indexOf(c);-1!==e&&e!==x&&(N(e),C(e))}},[c,r]);var C=function(e){v.current&&v.current.scrollTo({top:e*w,behavior:"smooth"})};return e.jsxs("div",{className:"wd-wheel-picker-container ".concat(s||""),style:{height:l*w},children:[e.jsx("div",{ref:v,onScroll:function(){var e,n=(null===(e=v.current)||void 0===e?void 0:e.scrollTop)||0,t=Math.round(n/w),a=Math.min(r.length-1,Math.max(0,t));a!==x&&(N(a),null==o||o(r[a])),y.current&&clearTimeout(y.current),y.current=setTimeout(function(){C(a)},150)},className:"wd-wheel-picker-scroll ".concat(u||""),style:{height:"100%"},children:b.map(function(n,t){var a=x+g,i=0===Math.abs(t-a),l=t-g,c=l>=0&&l<r.length;return e.jsx("div",{className:"wd-wheel-picker-item ".concat(i?"wd-wheel-picker-item-selected":"wd-wheel-picker-item-unselected"," ").concat(c?"wd-wheel-picker-item-clickable":""," ").concat(d||""),style:{height:w},onClick:c?function(){N(l),C(l),null==o||o(r[l])}:void 0,children:n},t)})}),e.jsx("div",{className:"wd-wheel-picker-indicator ".concat(m||""),style:{top:"".concat(w*g,"px"),height:"".concat(w,"px"),borderColor:h,borderWidth:p}})]})},y=["فروردین","اردیبهشت","خرداد","تیر","مرداد","شهریور","مهر","آبان","آذر","دی","بهمن","اسفند"],w=["January","February","March","April","May","June","July","August","September","October","November","December"];exports.WheelDatePicker=function(a){var g=a.value,b=a.onChange,j=a.minYear,x=a.maxYear,N=a.className,C=a.input,S=a.modal,k=a.calendarType,O=void 0===k?"jalali":k,M=a.button,I=r(a,["value","onChange","minYear","maxYear","className","input","modal","calendarType","button"]),D="jalali"===O,A="jalali"===O?y:w,E=n.useMemo(function(){return"number"==typeof x?x:"jalali"===O?d().year:o().year},[O,x]),P=n.useMemo(function(){return"number"==typeof j?j:"jalali"===O?1300:1900},[O,j]),T=function(){return g?"jalali"===O?function(e){var n=e.match(/^(\d{4})\/(\d{1,2})\/(\d{1,2})$/);if(!n)return null;var t=parseInt(n[1]),r=parseInt(n[2]),a=parseInt(n[3]);return r<1||r>12||a<1||a>u(t,r)?null:{year:t,month:r,day:a}}(g)||d():function(e){var n=e.match(/^(\d{4})\/(\d{2})\/(\d{2})$/);if(!n)return null;var t=n[1],r=n[2],a=n[3];return{year:Number(t),month:Number(r),day:Number(a)}}(g)||o():"jalali"===O?d():o()},Y=n.useState(T),F=Y[0],z=Y[1],J=n.useState(!1),R=J[0],W=J[1],q=n.useState(F),B=q[0],$=q[1];n.useEffect(function(){var e=T();z(e),$(e)},[g]);var H=n.useMemo(function(){for(var e=[],n=P;n<=E;n++)e.push(n.toString());return e},[P,E]),G=n.useMemo(function(){return"jalali"===O?u(B.year,B.month):l(B.year,B.month)},[B,O]),K=n.useMemo(function(){return Array.from({length:G},function(e,n){return(n+1).toString()})},[G]);n.useEffect(function(){B.day>G&&$(function(e){return t(t({},e),{day:G})})},[G,B.day]);var L=n.useMemo(function(){return g?"jalali"===O?m(F)?s(F):"":c(F)?i(F):"":""},[F,O,g]),Q=e.jsx(v,t({items:K,onChange:function(e){return $(function(n){return t(t({},n),{day:Number(e)})})},value:B.day.toString(),containerClassName:"wd-datepicker-wheel-container",visibleCount:3},I)),U=e.jsx(v,t({items:A,onChange:function(e){return $(function(n){return t(t({},n),{month:"jalali"===O?y.indexOf(e)+1:w.indexOf(e)+1})})},value:A[B.month-1],containerClassName:"wd-datepicker-wheel-container",visibleCount:3},I)),V=e.jsx(v,t({items:H,onChange:function(e){return $(function(n){return t(t({},n),{year:Number(e)})})},value:B.year.toString(),containerClassName:"wd-datepicker-wheel-container",visibleCount:3},I)),X="miladi"===O?[V,U,Q]:[Q,U,V];return e.jsxs(e.Fragment,{children:[e.jsx(h,t({name:null==C?void 0:C.name,value:L,onClick:function(){return W(!0)},label:null==C?void 0:C.label,rtl:D},C)),e.jsx(p,t({placement:"bottom",title:null==S?void 0:S.title,isOpen:R,onClose:function(){$(F),W(!1)},rtl:D},S,{children:e.jsxs("div",{className:"wd-datepicker-modal-content ".concat(D?"wd-datepicker-rtl":""),children:[e.jsx("div",{className:"wd-datepicker-wheels-container ".concat(N||""),children:X}),e.jsx(f,t({className:"wd-datepicker-confirm-button",size:"medium",onClick:function(){if(z(B),W(!1),"jalali"===O){if(m(B)){var e=s(B);null==b||b(e)}}else if(c(B)){e=i(B);null==b||b(e)}}},M,{children:(null==M?void 0:M.text)?M.text:"jalali"===O?"تایید":"set"}))]})}))]})};
//# sourceMappingURL=index.js.map