@mehdiraized/noa_jalali_datepicker/dist/index.umd.js

A modern, Persian (Jalali) date picker for React applications. This date picker supports both light and dark themes, providing a sleek and user-friendly interface for selecting dates.

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("jalali-moment"),require("classnames")):"function"==typeof define&&define.amd?define(["exports","react","jalali-moment","classnames"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).NoaJalaliDatepicker={},e.React,e.moment,e.classNames)}(this,(function(e,t,a,r){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=l(t),n=l(a),o=l(r);const d=(e,t)=>t<=6?31:t<=11||(e=>n.default.jIsLeapYear(e))(e)?30:29,u=["فروردین","اردیبهشت","خرداد","تیر","مرداد","شهریور","مهر","آبان","آذر","دی","بهمن","اسفند"],m=["ش","ی","د","س","چ","پ","ج"],c={xs:{base:"text-xs",header:"text-sm"},sm:{base:"text-sm",header:"text-base"},md:{base:"text-base",header:"text-lg"},lg:{base:"text-lg",header:"text-xl"},xl:{base:"text-xl",header:"text-2xl"}};e.DatePicker=({onChange:e,value:a,disabled:r=!1,placeholderText:l="تاریخ انتخاب کنید",size:i="md",dir:f="rtl",className:y="",containerClassName:p="relative",inputClassName:h="w-full px-3 py-2 border rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50",popupClassName:g="absolute top-full left-0 mt-1 bg-white border border-gray-200 rounded-lg shadow-lg z-50 min-w-[280px]",headerClassName:b="flex items-center justify-between p-3 border-b border-gray-200",weeksClassName:x="grid grid-cols-7 gap-1 p-2",weekItemClassName:v="text-center text-sm font-medium text-gray-500",daysClassName:N="grid grid-cols-7 gap-1 p-2",dayClassName:j="flex items-center justify-center p-2 rounded-md hover:bg-gray-100 cursor-pointer text-sm transition-colors",selectedDayClassName:C="bg-blue-500 text-white hover:bg-blue-600",holidayClassName:E="text-red-500",todayClassName:k="ring-2 ring-blue-500",monthsGridClassName:Y="grid grid-cols-3 gap-2 p-3",monthItemClassName:w="p-2 text-center rounded-md hover:bg-gray-100 cursor-pointer text-sm transition-colors",selectedMonthClassName:D="bg-blue-500 text-white hover:bg-blue-600",yearsGridClassName:M="grid grid-cols-3 gap-2 p-3 max-h-[300px] overflow-y-auto",yearItemClassName:$="p-2 text-center rounded-md hover:bg-gray-100 cursor-pointer text-sm transition-colors",selectedYearClassName:S="bg-blue-500 text-white hover:bg-blue-600",arrowClassName:L="cursor-pointer p-1 rounded hover:bg-gray-100 transition-colors"})=>{const[I,q]=t.useState(!1),A=a?n.default(a).locale("fa"):null,[B,T]=t.useState(A?{year:A.jYear(),month:A.jMonth(),day:A.jDate()}:null),[z,F]=t.useState(n.default().jYear()),[G,P]=t.useState(n.default().jMonth()+1),[R,W]=t.useState("day"),[_,J]=t.useState(!1),O=t.useRef(null),H=n.default(),K=H.jYear(),Q=H.jMonth()+1,U=H.jDate(),V=B?`${B.year}/${String(B.month+1).padStart(2,"0")}/${String(B.day).padStart(2,"0")}`:l,X=(e,t,a)=>6===n.default(`${e}/${t}/${a}`,"jYYYY/jMM/jDD").jDay(),Z=d(z,G),ee=Array.from({length:Z},((e,t)=>({year:z,month:G,day:t+1}))),te=(ae=z,re=G,n.default(`${ae}/${re}/01`,"jYYYY/jMM/jDD").jDay());var ae,re;return t.useEffect((()=>{const e=e=>{O.current&&!O.current.contains(e.target)&&J(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[_]),s.default.createElement("div",{className:o.default(p,y),ref:O,dir:f},s.default.createElement("div",{className:o.default(h,c[i].base,r?"opacity-50 cursor-not-allowed":"cursor-pointer"),onClick:()=>{r||(!_&&B&&(F(B.year),P(B.month)),J(!_),W("day"))},onFocus:()=>q(!0),onBlur:()=>q(!1),tabIndex:0},V),_&&!r&&s.default.createElement("div",{className:g},s.default.createElement("div",{className:b},s.default.createElement("button",{className:L,onClick:e=>{e.preventDefault(),1===G?(P(12),F(z-1)):P(G-1)}},s.default.createElement("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},s.default.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"}))),s.default.createElement("div",{className:"flex items-center space-x-2"},s.default.createElement("span",{className:"cursor-pointer hover:text-blue-500 transition-colors",onClick:()=>W("month")},u[G-1]),s.default.createElement("span",null,"/"),s.default.createElement("span",{className:"cursor-pointer hover:text-blue-500 transition-colors",onClick:()=>W("year")},z)),s.default.createElement("button",{className:L,onClick:e=>{e.preventDefault(),12===G?(P(1),F(z+1)):P(G+1)}},s.default.createElement("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},s.default.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 19l-7-7 7-7"})))),"day"===R&&s.default.createElement(s.default.Fragment,null,s.default.createElement("div",{className:x},m.map((e=>s.default.createElement("div",{key:e,className:v},e)))),s.default.createElement("div",{className:N},Array.from({length:te},((e,t)=>s.default.createElement("div",{key:`empty-${t}`}))),ee.map((t=>s.default.createElement("div",{key:`${t.year}-${t.month}-${t.day}`,className:o.default(j,X(t.year,t.month,t.day)&&E,(null==B?void 0:B.year)===t.year&&(null==B?void 0:B.month)===t.month&&(null==B?void 0:B.day)===t.day&&C,K===t.year&&Q===t.month&&U===t.day&&k),onClick:()=>(t=>{T(t);const a=n.default.from(`${t.year}/${t.month}/${t.day}`,"fa","jYYYY/jMM/jDD").format("YYYY-MM-DD");e(a),J(!1)})(t)},t.day))))),"month"===R&&s.default.createElement("div",{className:Y},u.map(((e,t)=>s.default.createElement("div",{key:e,className:o.default(w,G===t+1&&D),onClick:()=>{P(t+1),W("day")}},e)))),"year"===R&&s.default.createElement("div",{className:M},Array.from({length:110},((e,t)=>z-100+t)).sort(((e,t)=>t-e)).map((e=>s.default.createElement("div",{key:e,className:o.default($,z===e&&S),onClick:()=>{F(e),W("month")}},e))))))},Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=index.umd.js.map