react-hebrew-datepicker
Version:
A beautiful and functional Hebrew date picker component for React with Gregorian conversion support
3 lines (2 loc) • 9.57 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-dom"),r=require("react-icons/io5"),n=require("@hebcal/core"),o=require("react-icons/fa");function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);r<t;r++)n[r]=e[r];return n}function i(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a,i,l=[],c=!0,u=!1;try{if(a=(r=r.call(e)).next,0===t);else for(;!(c=(n=a.call(r)).done)&&(l.push(n.value),l.length!==t);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(u)throw o}}return l}}(e,t)||function(e,t){if(e){if("string"==typeof e)return a(e,t);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?a(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var l=["ניסן","אייר","סיוון","תמוז","אב","אלול","תשרי","חשוון","כסלו","טבת","שבט","אדר א׳","אדר ב׳"],c=["א","ב","ג","ד","ה","ו","ש"],u=function(e,t){for(var r=e.getMonth(),o=e.getFullYear(),a=0;a<Math.abs(t);a++)t>0?(7===++r&&o++,(r>13||!e.isLeapYear()&&r>12)&&(r=1)):(--r<1&&(r=e.isLeapYear()?13:12),6===r&&o--);return new n.HDate(1,r,o)},s=function(t){var a=t.popupRef,i=t.calendarPos,s=t.currentHDate,d=t.selectedHDate,f=t.onChange,p=t.setShowCalendar,m=t.setCurrentHDate,g=t.showMonthYearPicker,y=t.setShowMonthYearPicker,h=t.transitionDirection,b=t.setTransitionDirection,v=t.name,w=e.useRef(null);e.useEffect(function(){if(g&&w.current){var e=w.current.querySelector('[data-year="'.concat(s.getFullYear(),'"]'));e&&setTimeout(function(){e.scrollIntoView({block:"center",behavior:"smooth"})},50)}},[g,s]);var E=new n.HDate(1,s.getMonth(),s.getFullYear()).getDay(),k=s.daysInMonth(),D=Array(E).fill(null).concat(Array.from({length:k},function(e,t){return t+1}));return e.createElement(e.Fragment,null,e.createElement("div",{style:{position:"fixed",inset:0,zIndex:3e3},onClick:function(){return p(!1)}}),e.createElement("div",{ref:a,style:{position:"absolute",top:i.top,left:i.left,backgroundColor:"white",borderRadius:12,boxShadow:"0 4px 15px rgba(0,0,0,0.3)",padding:16,width:320,fontFamily:"Arial, sans-serif",zIndex:1e4}},e.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",marginBottom:10,borderBottom:"1px solid #eee"}},e.createElement("h3",{style:{margin:0,fontSize:16,color:"#4da6ff",cursor:"pointer"},onClick:function(){return y(function(e){return!e})}},l[s.getMonth()-1]," ",new n.HDate(1,s.getMonth(),s.getFullYear()).renderGematriya().split(" ").pop(),e.createElement(o.FaCaretDown,null)),e.createElement("div",{style:{display:"flex",gap:6}},e.createElement("button",{type:"button",className:"arrowBtn icon-tooltip",onClick:function(){b("forward"),m(u(s,1))},style:{background:"transparent",border:"none",fontSize:18,cursor:"pointer",color:"#4da6ff",padding:"8px"}},e.createElement(r.IoArrowDown,null),e.createElement("span",{className:"tooltip-text next"},"חודש הבא")),e.createElement("button",{type:"button",className:"arrowBtn icon-tooltip",onClick:function(){b("backward"),m(u(s,-1))},style:{background:"transparent",border:"none",fontSize:18,cursor:"pointer",color:"#4da6ff",padding:"8px"}},e.createElement(r.IoArrowUp,null),e.createElement("span",{className:"tooltip-text prev"},"חודש קודם")))),g&&e.createElement("div",{style:{display:"flex",justifyContent:"space-between",marginBottom:10}},e.createElement("div",{style:{maxHeight:150,overflowY:"auto",direction:"rtl"}},l.map(function(t,r){return e.createElement("div",{key:r+1,onClick:function(){m(new n.HDate(1,r+1,s.getFullYear())),y(!1)},style:{padding:6,cursor:"pointer",color:s.getMonth()===r+1?"white":"#333",backgroundColor:s.getMonth()===r+1?"#4da6ff":"transparent",borderRadius:6}},t)})),e.createElement("div",{ref:w,style:{maxHeight:150,overflowY:"auto",direction:"rtl"}},Array.from({length:60},function(t,r){var o=s.getFullYear()-30+r,a=new n.HDate(1,1,o).renderGematriya().split(" ").pop();return e.createElement("div",{key:o,"data-year":o,onClick:function(){m(new n.HDate(1,s.getMonth(),o)),y(!1)},style:{padding:6,cursor:"pointer",color:s.getFullYear()===o?"white":"#333",backgroundColor:s.getFullYear()===o?"#4da6ff":"transparent",borderRadius:6}},a)}))),e.createElement("div",{key:s.toString(),className:"calendar-days ".concat("forward"===h?"slide-right":"slide-left"),style:{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gap:6,textAlign:"center"}},c.map(function(t){return e.createElement("div",{key:t,style:{fontWeight:"bold",color:"#4da6ff"}},t)}),D.map(function(t,r){if(!t)return e.createElement("div",{key:r});var o,a,i=d.getDate()===t&&d.getMonth()===s.getMonth()&&d.getFullYear()===s.getFullYear();return e.createElement("button",{key:r,type:"button",onClick:function(){return function(e){if(e){var t=new n.HDate(e+1,s.getMonth(),s.getFullYear()).greg().toISOString().slice(0,10);null==f||f({target:{name:v,value:t}}),p(!1)}}(t)},className:"date-picker-day".concat(i?" selected":""),style:{minWidth:36,minHeight:36,color:i?"#fff":"#444",borderRadius:8,fontSize:14,cursor:"pointer",padding:8,transition:"border .2s,background .2s,color .2s",boxSizing:"border-box",margin:0}},(a=["","א","ב","ג","ד","ה","ו","ז","ח","ט","י"],15===(o=t)?"טו":16===o?"טז":o<=10?a[o]:o<20?"י"+a[o-10]:o<=30?["","י","כ","ל"][Math.floor(o/10)]+a[o%10]:o))})),e.createElement("div",{style:{display:"flex",justifyContent:"space-between",marginTop:12}},e.createElement("button",{type:"button",onClick:function(){var e=new n.HDate;m(e);var t=e.greg().toISOString().slice(0,10);null==f||f({target:{name:v,value:t}}),p(!1)},style:{fontSize:14,color:"#4da6ff",background:"none",border:"none",cursor:"pointer",textDecoration:"underline"}},"היום"),e.createElement("button",{type:"button",onClick:function(){null==f||f({target:{name:v,value:""}}),p(!1)},style:{fontSize:14,color:"#4da6ff",background:"none",border:"none",cursor:"pointer",textDecoration:"underline"}},"נקה"))))},d=["ניסן","אייר","סיוון","תמוז","אב","אלול","תשרי","חשוון","כסלו","טבת","שבט","אדר א׳","אדר ב׳"],f=function(e){try{var t=e.getDate(),r=e.getMonth()-1;(11!==r||e.isLeapYear())&&(12!==r||e.isLeapYear())||(r=11);var n=d[r]||"",o=e.renderGematriya().split(" ").pop();return"".concat((a=t,i=["","א","ב","ג","ד","ה","ו","ז","ח","ט","י"],15===a?"טו":16===a?"טז":a<=10?i[a]:a<20?"י"+i[a-10]:a<=30?["","י","כ","ל"][Math.floor(a/10)]+i[a%10]:a)," ").concat(n," ").concat(o)}catch(e){return console.error("Error formatting Hebrew date:",e),"שגיאה בתאריך"}var a,i};exports.CalendarPopup=s,exports.default=function(o){var a=o.name,l=o.value,c=o.defaultValue,u=o.onChange,d=o.required,p=o.label,m=void 0===p?"בחר תאריך":p,g=o.usePortal,y=void 0!==g&&g,h=o.dir,b=void 0===h?"rtl":h,v=void 0!==l,w=i(e.useState(c||""),2),E=w[0],k=w[1],D=v?l:E,C=D?new Date(D):new Date,x=new n.HDate(C),S=i(e.useState(!1),2),H=S[0],M=S[1],Y=i(e.useState(x),2),F=Y[0],A=Y[1],I=i(e.useState(!1),2),P=I[0],R=I[1],z=i(e.useState({top:0,left:0}),2),q=z[0],j=z[1],B=e.useRef(null),O=e.useRef(),T=i(e.useState("forward"),2),L=T[0],N=T[1];e.useEffect(function(){if(v&&l){var e=new Date(l),t=new n.HDate(e);A(t)}else if(!v&&E){var r=new Date(E),o=new n.HDate(r);A(o)}},[l,E,v]);var W=function(e){var t=e.target.value;v||k(t),u&&u(e)};return e.useEffect(function(){var e=function(e){B.current&&!B.current.contains(e.target)&&(M(!1),R(!1))};return document.addEventListener("mousedown",e),function(){return document.removeEventListener("mousedown",e)}},[]),e.useEffect(function(){if(H&&O.current){var e=O.current.getBoundingClientRect(),t=e.left+window.scrollX+(e.width-320)/2;j({top:e.bottom+window.scrollY+8,left:Math.max(10,t)})}},[H]),e.createElement("div",{style:{position:"relative",maxWidth:360,margin:"auto",fontFamily:"Arial, sans-serif"},dir:b},e.createElement("label",{htmlFor:a,style:{display:"block",marginBottom:6}},m,d&&" *"),e.createElement("div",{style:{display:"flex",alignItems:"center",gap:8}},e.createElement("input",{ref:O,type:"text",id:a,name:a,readOnly:!0,required:d,value:D?f(x):"",placeholder:"בחר תאריך עברי",style:{padding:10,borderRadius:5,border:"1px solid #ccc",width:"100%",backgroundColor:"white",color:"#444",fontWeight:"bold",cursor:"default"},onClick:function(){return M(function(e){return!e})}}),e.createElement("button",{onClick:function(){return M(function(e){return!e})},type:"button",style:{cursor:"pointer",padding:8,color:"#4da6ff",border:"none",borderRadius:6,background:"none",fontSize:22}},e.createElement(r.IoCalendarOutline,null))),H&&(y?t.createPortal(e.createElement(s,{popupRef:B,calendarPos:q,currentHDate:F,selectedHDate:x,onChange:W,setShowCalendar:M,setCurrentHDate:A,setShowMonthYearPicker:R,showMonthYearPicker:P,transitionDirection:L,setTransitionDirection:N,name:a}),document.body):e.createElement(s,{popupRef:B,calendarPos:{top:"calc(100% + 8px)",left:0},currentHDate:F,selectedHDate:x,onChange:W,setShowCalendar:M,setCurrentHDate:A,setShowMonthYearPicker:R,showMonthYearPicker:P,transitionDirection:L,setTransitionDirection:N,name:a})))};
//# sourceMappingURL=index.js.map