satan-date-picker
Version:
A Nepali date picker component for React
893 lines (867 loc) • 43.1 kB
JavaScript
'use strict';
var React = require('react');
var DefaultContext = {
color: undefined,
size: undefined,
className: undefined,
style: undefined,
attr: undefined
};
var IconContext = React.createContext && /*#__PURE__*/React.createContext(DefaultContext);
var _excluded = ["attr", "size", "title"];
function _objectWithoutProperties(source, excluded) {
if (source == null) return {};
var target = _objectWithoutPropertiesLoose(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for (i = 0; i < sourceSymbolKeys.length; i++) {
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
target[key] = source[key];
}
}
return target;
}
function _objectWithoutPropertiesLoose(source, excluded) {
if (source == null) return {};
var target = {};
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
}
return target;
}
function _extends() {
_extends = Object.assign ? Object.assign.bind() : function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends.apply(this, arguments);
}
function ownKeys(e, r) {
var t = Object.keys(e);
if (Object.getOwnPropertySymbols) {
var o = Object.getOwnPropertySymbols(e);
r && (o = o.filter(function (r) {
return Object.getOwnPropertyDescriptor(e, r).enumerable;
})), t.push.apply(t, o);
}
return t;
}
function _objectSpread(e) {
for (var r = 1; r < arguments.length; r++) {
var t = null != arguments[r] ? arguments[r] : {};
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
_defineProperty(e, r, t[r]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
});
}
return e;
}
function _defineProperty(obj, key, value) {
key = _toPropertyKey(key);
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _toPropertyKey(t) {
var i = _toPrimitive(t, "string");
return "symbol" == typeof i ? i : i + "";
}
function _toPrimitive(t, r) {
if ("object" != typeof t || !t) return t;
var e = t[Symbol.toPrimitive];
if (void 0 !== e) {
var i = e.call(t, r);
if ("object" != typeof i) return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return ("string" === r ? String : Number)(t);
}
function Tree2Element(tree) {
return tree && tree.map((node, i) => /*#__PURE__*/React.createElement(node.tag, _objectSpread({
key: i
}, node.attr), Tree2Element(node.child)));
}
function GenIcon(data) {
return props => /*#__PURE__*/React.createElement(IconBase, _extends({
attr: _objectSpread({}, data.attr)
}, props), Tree2Element(data.child));
}
function IconBase(props) {
var elem = conf => {
var {
attr,
size,
title
} = props,
svgProps = _objectWithoutProperties(props, _excluded);
var computedSize = size || conf.size || "1em";
var className;
if (conf.className) className = conf.className;
if (props.className) className = (className ? className + " " : "") + props.className;
return /*#__PURE__*/React.createElement("svg", _extends({
stroke: "currentColor",
fill: "currentColor",
strokeWidth: "0"
}, conf.attr, attr, svgProps, {
className: className,
style: _objectSpread(_objectSpread({
color: props.color || conf.color
}, conf.style), props.style),
height: computedSize,
width: computedSize,
xmlns: "http://www.w3.org/2000/svg"
}), title && /*#__PURE__*/React.createElement("title", null, title), props.children);
};
return IconContext !== undefined ? /*#__PURE__*/React.createElement(IconContext.Consumer, null, conf => elem(conf)) : elem(DefaultContext);
}
// THIS FILE IS AUTO GENERATED
function FaArrowLeft(props){return GenIcon({"attr":{"viewBox":"0 0 448 512"},"child":[{"tag":"path","attr":{"d":"M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.2 288 416 288c17.7 0 32-14.3 32-32s-14.3-32-32-32l-306.7 0L214.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"},"child":[]}]})(props);}function FaArrowRight(props){return GenIcon({"attr":{"viewBox":"0 0 448 512"},"child":[{"tag":"path","attr":{"d":"M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z"},"child":[]}]})(props);}function FaCalendarDay(props){return GenIcon({"attr":{"viewBox":"0 0 448 512"},"child":[{"tag":"path","attr":{"d":"M128 0c17.7 0 32 14.3 32 32l0 32 128 0 0-32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 32 48 0c26.5 0 48 21.5 48 48l0 48L0 160l0-48C0 85.5 21.5 64 48 64l48 0 0-32c0-17.7 14.3-32 32-32zM0 192l448 0 0 272c0 26.5-21.5 48-48 48L48 512c-26.5 0-48-21.5-48-48L0 192zm80 64c-8.8 0-16 7.2-16 16l0 96c0 8.8 7.2 16 16 16l96 0c8.8 0 16-7.2 16-16l0-96c0-8.8-7.2-16-16-16l-96 0z"},"child":[]}]})(props);}
const StnNepaliDatePicker = /*#__PURE__*/React.forwardRef(({
dateFormat = '%D, %M %d, %y',
onDateSelect,
defaultDate = '',
language = 'nepali'
}, ref) => {
const calendarData = {
bsMonths: ['बैशाख', 'जेठ', 'असार', 'साउन', 'भदौ', 'असोज', 'कार्तिक', 'मंसिर', 'पौष', 'माघ', 'फागुन', 'चैत'],
enMonths: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
bsDays: ['आइत', 'सोम', 'मंगल', 'बुध', 'बिही', 'शुक्र', 'शनि'],
enDays: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
nepaliNumbers: ['०', '१', '२', '३', '४', '५', '६', '७', '८', '९'],
bsMonthUpperDays: [[30, 31], [31, 32], [31, 32], [31, 32], [31, 32], [30, 31], [29, 30], [29, 30], [29, 30], [29, 30], [29, 30], [30, 31]],
extractedBsMonthData: [[0, 1, 1, 22, 1, 3, 1, 1, 1, 3, 1, 22, 1, 3, 1, 3, 1, 22, 1, 3, 1, 19, 1, 3, 1, 1, 3, 1, 2, 2, 1, 3, 1], [1, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 2, 2, 2, 3, 2, 2, 2, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 2, 2, 2, 2, 2, 1, 1, 1, 2, 2, 2, 2, 2, 1, 3, 1, 1, 2], [0, 1, 2, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 3, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 1, 1, 1, 2, 2, 2, 2, 2, 1, 3, 1, 1, 2], [1, 2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 1, 3, 2, 2, 1, 3, 1, 2, 2, 2, 1, 2], [59, 1, 26, 1, 28, 1, 2, 1, 12], [0, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 5, 1, 1, 2, 2, 1, 3, 1, 2, 1, 2], [0, 12, 1, 3, 1, 3, 1, 5, 1, 11, 1, 3, 1, 3, 1, 18, 1, 3, 1, 3, 1, 18, 1, 3, 1, 3, 1, 27, 1, 2], [1, 2, 2, 2, 2, 1, 2, 2, 2, 2, 2, 2, 2, 3, 1, 3, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 2, 2, 2, 15, 2, 4], [0, 1, 2, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 3, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 2, 2, 2, 15, 2, 4], [1, 1, 3, 1, 3, 1, 14, 1, 3, 1, 1, 1, 3, 1, 14, 1, 3, 1, 3, 1, 3, 1, 18, 1, 3, 1, 3, 1, 3, 1, 14, 1, 3, 15, 1, 2, 1, 1], [0, 1, 1, 3, 1, 3, 1, 10, 1, 3, 1, 3, 1, 1, 1, 3, 1, 3, 1, 10, 1, 3, 1, 3, 1, 3, 1, 3, 1, 14, 1, 3, 1, 3, 1, 3, 1, 3, 1, 10, 1, 20, 1, 1, 1], [1, 2, 2, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 3, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 3, 1, 3, 1, 2, 2, 2, 2, 2, 2, 2, 1, 3, 1, 3, 1, 20, 3]],
minBsYear: 1970,
maxBsYear: 2100,
minAdYear: 1913,
maxAdYear: 2043,
minAdDateEqBsDate: {
ad: {
year: 1913,
month: 3,
date: 13
},
bs: {
year: 1970,
month: 1,
date: 1
}
}
};
const calendarFunctions = {
getNepaliNumber: number => {
if (typeof number !== 'number' || number < 0) throw new Error('Number should be positive integer');
const prefixNum = Math.floor(number / 10);
const suffixNum = number % 10;
return prefixNum !== 0 ? calendarFunctions.getNepaliNumber(prefixNum) + calendarData.nepaliNumbers[suffixNum] : calendarData.nepaliNumbers[suffixNum];
},
getEnglishNumber: number => String(number),
nepaliPad: num => {
const str = calendarFunctions.getNepaliNumber(num);
return str.length < 2 ? calendarData.nepaliNumbers[0] + str : str;
},
englishPad: num => String(num).padStart(2, '0'),
getBsDateInYYYYMMDD: (bsYear, bsMonth, bsDate) => {
return `${calendarFunctions.getNepaliNumber(bsYear)}-${calendarFunctions.nepaliPad(bsMonth)}-${calendarFunctions.nepaliPad(bsDate)}`;
},
getAdDateInYYYYMMDD: (adYear, adMonth, adDate) => {
return `${adYear}-${calendarFunctions.englishPad(adMonth)}-${calendarFunctions.englishPad(adDate)}`;
},
getNumberByNepaliNumber: nepaliNumber => {
let number = 0;
for (let i = 0; i < nepaliNumber.length; i++) {
const numIndex = calendarData.nepaliNumbers.indexOf(nepaliNumber.charAt(i));
if (numIndex === -1) throw new Error('Invalid nepali number');
number = number * 10 + numIndex;
}
return number;
},
parseNumber: (numberStr, lang = 'nepali') => {
try {
if (lang === 'nepali' && /[०१२३४५६७८९]/.test(numberStr)) {
return calendarFunctions.getNumberByNepaliNumber(numberStr);
}
return parseInt(numberStr);
} catch (error) {
console.error('Error parsing number:', numberStr, error);
return null;
}
},
getBsMonthInfoByBsDate: (bsYear, bsMonth, bsDate, dateFormatPattern) => {
const daysNumFromMinBsYear = calendarFunctions.getTotalDaysNumFromMinBsYear(bsYear, bsMonth, bsDate);
const adDate = new Date(calendarData.minAdDateEqBsDate.ad.year, calendarData.minAdDateEqBsDate.ad.month, calendarData.minAdDateEqBsDate.ad.date - 1);
adDate.setDate(adDate.getDate() + daysNumFromMinBsYear);
const bsMonthFirstAdDate = calendarFunctions.getAdDateByBsDate(bsYear, bsMonth, 1);
const bsMonthDays = calendarFunctions.getBsMonthDays(bsYear, bsMonth);
bsDate = bsDate > bsMonthDays ? bsMonthDays : bsDate;
const eqAdDate = calendarFunctions.getAdDateByBsDate(bsYear, bsMonth, bsDate);
const weekDay = eqAdDate.getDay() + 1;
const formattedDate = calendarFunctions.bsDateFormat(dateFormatPattern, bsYear, bsMonth, bsDate);
return {
bsYear,
bsMonth,
bsDate,
weekDay,
formattedDate,
adDate: eqAdDate,
bsMonthFirstAdDate,
bsMonthDays
};
},
getAdMonthInfoByAdDate: (adYear, adMonth, adDate, dateFormatPattern) => {
const date = new Date(adYear, adMonth - 1, adDate);
const weekDay = date.getDay() + 1;
const firstDayOfMonth = new Date(adYear, adMonth - 1, 1);
const daysInMonth = new Date(adYear, adMonth, 0).getDate();
const formattedDate = calendarFunctions.adDateFormat(dateFormatPattern, adYear, adMonth, adDate);
return {
adYear,
adMonth,
weekDay,
formattedDate,
adDate: date,
adMonthFirstDay: firstDayOfMonth,
adMonthDays: daysInMonth
};
},
getAdDateByBsDate: (bsYear, bsMonth, bsDate) => {
const daysNumFromMinBsYear = calendarFunctions.getTotalDaysNumFromMinBsYear(bsYear, bsMonth, bsDate);
const adDate = new Date(calendarData.minAdDateEqBsDate.ad.year, calendarData.minAdDateEqBsDate.ad.month, calendarData.minAdDateEqBsDate.ad.date - 1);
adDate.setDate(adDate.getDate() + daysNumFromMinBsYear);
return adDate;
},
getBsDateByAdDate: (adYear, adMonth, adDate) => {
let bsYear = adYear + 57;
let bsMonth = (adMonth + 9) % 12;
bsMonth = bsMonth === 0 ? 12 : bsMonth;
let bsDate = 1;
if (adMonth < 4) {
bsYear -= 1;
} else if (adMonth === 4) {
const bsYearFirstAdDate = calendarFunctions.getAdDateByBsDate(bsYear, 1, 1);
if (adDate < bsYearFirstAdDate.getDate()) bsYear -= 1;
}
const bsMonthFirstAdDate = calendarFunctions.getAdDateByBsDate(bsYear, bsMonth, 1);
if (adDate >= 1 && adDate < bsMonthFirstAdDate.getDate()) {
bsMonth = bsMonth !== 1 ? bsMonth - 1 : 12;
const bsMonthDays = calendarFunctions.getBsMonthDays(bsYear, bsMonth);
bsDate = bsMonthDays - (bsMonthFirstAdDate.getDate() - adDate) + 1;
} else {
bsDate = adDate - bsMonthFirstAdDate.getDate() + 1;
}
return {
bsYear,
bsMonth,
bsDate
};
},
getTotalDaysNumFromMinBsYear: (bsYear, bsMonth, bsDate) => {
if (bsYear < calendarData.minBsYear || bsYear > calendarData.maxBsYear) return null;
let daysNumFromMinBsYear = 0;
const diffYears = bsYear - calendarData.minBsYear;
for (let month = 1; month <= 12; month++) {
if (month < bsMonth) {
daysNumFromMinBsYear += calendarFunctions.getMonthDaysNumFormMinBsYear(month, diffYears + 1);
} else {
daysNumFromMinBsYear += calendarFunctions.getMonthDaysNumFormMinBsYear(month, diffYears);
}
}
if (bsYear > 2085 && bsYear < 2088) daysNumFromMinBsYear += bsDate - 2;else if (bsYear === 2085 && bsMonth > 5) daysNumFromMinBsYear += bsDate - 2;else if (bsYear === 2081 && bsMonth === 3) daysNumFromMinBsYear += bsDate + 1;else if (bsYear === 2081 && bsMonth === 12) daysNumFromMinBsYear += bsDate - 1;else if (bsYear > 2088) daysNumFromMinBsYear += bsDate - 4;else if (bsYear === 2088 && bsMonth > 5) daysNumFromMinBsYear += bsDate - 4;else daysNumFromMinBsYear += bsDate;
return daysNumFromMinBsYear;
},
getMonthDaysNumFormMinBsYear: (bsMonth, yearDiff) => {
let yearCount = 0;
let monthDaysFromMinBsYear = 0;
if (yearDiff === 0) return 0;
const bsMonthData = calendarData.extractedBsMonthData[bsMonth - 1];
for (let i = 0; i < bsMonthData.length; i++) {
if (bsMonthData[i] === 0) continue;
const bsMonthUpperDaysIndex = i % 2;
if (yearDiff > yearCount + bsMonthData[i]) {
yearCount += bsMonthData[i];
monthDaysFromMinBsYear += calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex] * bsMonthData[i];
} else {
monthDaysFromMinBsYear += calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex] * (yearDiff - yearCount);
break;
}
}
return monthDaysFromMinBsYear;
},
getBsMonthDays: (bsYear, bsMonth) => {
let yearCount = 0;
const totalYears = bsYear + 1 - calendarData.minBsYear;
const bsMonthData = calendarData.extractedBsMonthData[bsMonth - 1];
for (let i = 0; i < bsMonthData.length; i++) {
if (bsMonthData[i] === 0) continue;
const bsMonthUpperDaysIndex = i % 2;
yearCount += bsMonthData[i];
if (totalYears <= yearCount) {
if (bsYear === 2085 && bsMonth === 5 || bsYear === 2088 && bsMonth === 5) return calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex] - 2;else if (bsYear === 2081 && bsMonth === 2) return calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex + 1];else if (bsYear === 2081 && bsMonth === 3) return calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex - 1];else if (bsYear === 2081 && bsMonth === 11) return calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex] - 1;else if (bsYear === 2081 && bsMonth === 12) return calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex] + 1;else return calendarData.bsMonthUpperDays[bsMonth - 1][bsMonthUpperDaysIndex];
}
}
return null;
},
bsDateFormat: (dateFormatPattern, bsYear, bsMonth, bsDate) => {
const eqAdDate = calendarFunctions.getAdDateByBsDate(bsYear, bsMonth, bsDate);
const weekDay = eqAdDate.getDay() + 1;
let formattedDate = dateFormatPattern;
formattedDate = formattedDate.replace(/%d/g, calendarFunctions.getNepaliNumber(bsDate));
formattedDate = formattedDate.replace(/%y/g, calendarFunctions.getNepaliNumber(bsYear));
formattedDate = formattedDate.replace(/%m/g, calendarFunctions.getNepaliNumber(bsMonth));
formattedDate = formattedDate.replace(/%M/g, calendarData.bsMonths[bsMonth - 1]);
formattedDate = formattedDate.replace(/%D/g, calendarData.bsDays[weekDay - 1]);
return formattedDate;
},
adDateFormat: (dateFormatPattern, adYear, adMonth, adDate) => {
const date = new Date(adYear, adMonth - 1, adDate);
const weekDay = date.getDay() + 1;
let formattedDate = dateFormatPattern;
formattedDate = formattedDate.replace(/%d/g, adDate);
formattedDate = formattedDate.replace(/%y/g, adYear);
formattedDate = formattedDate.replace(/%m/g, adMonth);
formattedDate = formattedDate.replace(/%M/g, calendarData.enMonths[adMonth - 1]);
formattedDate = formattedDate.replace(/%D/g, calendarData.enDays[weekDay - 1]);
return formattedDate;
},
parseFormattedBsDate: (dateFormat, dateFormattedText) => {
let diffTextNum = 0;
const extractedFormattedBsDate = {
bsYear: null,
bsMonth: null,
bsDate: null,
bsDay: null
};
let processedText = dateFormattedText;
if (/[0-9]/.test(dateFormattedText)) {
processedText = processedText.replace(/[0-9]/g, match => calendarData.nepaliNumbers[parseInt(match)]);
}
for (let i = 0; i < dateFormat.length; i++) {
if (dateFormat.charAt(i) === '%') {
const valueOf = dateFormat.substring(i, i + 2);
const endChar = dateFormat.charAt(i + 2) || '';
const tempText = processedText.substring(i + diffTextNum);
const endIndex = endChar !== '' ? tempText.indexOf(endChar) : tempText.length;
const value = tempText.substring(0, endIndex > -1 ? endIndex : tempText.length);
try {
if (valueOf === '%y') {
extractedFormattedBsDate.bsYear = calendarFunctions.parseNumber(value, 'nepali');
diffTextNum += value.length - 2;
} else if (valueOf === '%d') {
extractedFormattedBsDate.bsDate = calendarFunctions.parseNumber(value, 'nepali');
diffTextNum += value.length - 2;
} else if (valueOf === '%D') {
extractedFormattedBsDate.bsDay = calendarData.bsDays.indexOf(value) + 1;
diffTextNum += value.length - 2;
} else if (valueOf === '%m') {
extractedFormattedBsDate.bsMonth = calendarFunctions.parseNumber(value, 'nepali');
diffTextNum += value.length - 2;
} else if (valueOf === '%M') {
extractedFormattedBsDate.bsMonth = calendarData.bsMonths.indexOf(value) + 1;
diffTextNum += value.length - 2;
}
} catch (error) {
console.error('Error parsing date segment:', value, error);
return null;
}
}
}
if (!extractedFormattedBsDate.bsDay && extractedFormattedBsDate.bsYear && extractedFormattedBsDate.bsMonth && extractedFormattedBsDate.bsDate) {
const eqAdDate = calendarFunctions.getAdDateByBsDate(extractedFormattedBsDate.bsYear, extractedFormattedBsDate.bsMonth, extractedFormattedBsDate.bsDate);
extractedFormattedBsDate.bsDay = eqAdDate.getDay() + 1;
}
return extractedFormattedBsDate;
},
parseFormattedAdDate: (dateFormat, dateFormattedText) => {
let diffTextNum = 0;
const extractedFormattedAdDate = {
adYear: null,
adMonth: null,
adDate: null,
adDay: null
};
const processedText = dateFormattedText;
for (let i = 0; i < dateFormat.length; i++) {
if (dateFormat.charAt(i) === '%') {
const valueOf = dateFormat.substring(i, i + 2);
const endChar = dateFormat.charAt(i + 2) || '';
const tempText = processedText.substring(i + diffTextNum);
const endIndex = endChar !== '' ? tempText.indexOf(endChar) : tempText.length;
const value = tempText.substring(0, endIndex > -1 ? endIndex : tempText.length);
try {
if (valueOf === '%y') {
extractedFormattedAdDate.adYear = parseInt(value);
diffTextNum += value.length - 2;
} else if (valueOf === '%d') {
extractedFormattedAdDate.adDate = parseInt(value);
diffTextNum += value.length - 2;
} else if (valueOf === '%D') {
extractedFormattedAdDate.adDay = calendarData.enDays.indexOf(value) + 1;
diffTextNum += value.length - 2;
} else if (valueOf === '%m') {
extractedFormattedAdDate.adMonth = parseInt(value);
diffTextNum += value.length - 2;
} else if (valueOf === '%M') {
extractedFormattedAdDate.adMonth = calendarData.enMonths.indexOf(value) + 1;
diffTextNum += value.length - 2;
}
} catch (error) {
console.error('Error parsing date segment:', value, error);
return null;
}
}
}
if (!extractedFormattedAdDate.adDay && extractedFormattedAdDate.adYear && extractedFormattedAdDate.adMonth && extractedFormattedAdDate.adDate) {
const eqAdDate = new Date(extractedFormattedAdDate.adYear, extractedFormattedAdDate.adMonth - 1, extractedFormattedAdDate.adDate);
extractedFormattedAdDate.adDay = eqAdDate.getDay() + 1;
}
return extractedFormattedAdDate;
}
};
const [isOpen, setIsOpen] = React.useState(false);
const [selectedDateInfo, setSelectedDateInfo] = React.useState(null);
const [calendarDataState, setCalendarDataState] = React.useState(null);
const [showMonthDropdown, setShowMonthDropdown] = React.useState(false);
const [showYearDropdown, setShowYearDropdown] = React.useState(false);
const [currentLanguage, setCurrentLanguage] = React.useState(language);
const pickerRef = React.useRef(null);
React.useEffect(() => {
const setDefaultDate = () => {
const currentDate = new Date();
let initialDateInfo = null;
if (!defaultDate) {
if (currentLanguage === 'nepali') {
const bsDate = calendarFunctions.getBsDateByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate());
initialDateInfo = calendarFunctions.getBsMonthInfoByBsDate(bsDate.bsYear, bsDate.bsMonth, bsDate.bsDate, dateFormat);
} else {
initialDateInfo = calendarFunctions.getAdMonthInfoByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate(), dateFormat);
}
} else {
if (currentLanguage === 'nepali') {
let parsedDate = calendarFunctions.parseFormattedBsDate(dateFormat, defaultDate);
if (!parsedDate || !parsedDate.bsYear || !parsedDate.bsMonth || !parsedDate.bsDate) {
const parts = defaultDate.split('-');
if (parts.length === 3) {
const [yearStr, monthStr, dateStr] = parts;
const isNepaliNumeral = /[०१२३४५६७८९]/.test(defaultDate);
const year = calendarFunctions.parseNumber(yearStr, isNepaliNumeral ? 'nepali' : 'english');
const month = calendarFunctions.parseNumber(monthStr, isNepaliNumeral ? 'nepali' : 'english');
const date = calendarFunctions.parseNumber(dateStr, isNepaliNumeral ? 'nepali' : 'english');
if (year && month && date) {
parsedDate = {
bsYear: year,
bsMonth: month,
bsDate: date
};
}
}
}
if (parsedDate && parsedDate.bsYear && parsedDate.bsMonth && parsedDate.bsDate) {
initialDateInfo = calendarFunctions.getBsMonthInfoByBsDate(parsedDate.bsYear, parsedDate.bsMonth, parsedDate.bsDate, dateFormat);
}
} else {
let parsedDate = calendarFunctions.parseFormattedAdDate(dateFormat, defaultDate);
if (!parsedDate || !parsedDate.adYear || !parsedDate.adMonth || !parsedDate.adDate) {
const parts = defaultDate.split('-');
if (parts.length === 3) {
const [yearStr, monthStr, dateStr] = parts;
const year = parseInt(yearStr);
const month = parseInt(monthStr);
const date = parseInt(dateStr);
if (year && month && date) {
parsedDate = {
adYear: year,
adMonth: month,
adDate: date
};
}
}
}
if (parsedDate && parsedDate.adYear && parsedDate.adMonth && parsedDate.adDate) {
initialDateInfo = calendarFunctions.getAdMonthInfoByAdDate(parsedDate.adYear, parsedDate.adMonth, parsedDate.adDate, dateFormat);
}
}
}
if (!initialDateInfo) {
console.warn('Invalid defaultDate, falling back to current date:', defaultDate);
if (currentLanguage === 'nepali') {
const bsDate = calendarFunctions.getBsDateByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate());
initialDateInfo = calendarFunctions.getBsMonthInfoByBsDate(bsDate.bsYear, bsDate.bsMonth, bsDate.bsDate, dateFormat);
} else {
initialDateInfo = calendarFunctions.getAdMonthInfoByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate(), dateFormat);
}
}
setSelectedDateInfo(initialDateInfo);
setCalendarDataState(initialDateInfo);
};
setDefaultDate();
}, [defaultDate, dateFormat, currentLanguage]);
React.useEffect(() => {
const handleClickOutside = event => {
if (pickerRef.current && !pickerRef.current.contains(event.target)) setIsOpen(false);
};
document.addEventListener('mousedown', handleClickOutside);
return () => document.removeEventListener('mousedown', handleClickOutside);
}, []);
const handleDateSelect = (year, month, date) => {
let dateInfo;
if (currentLanguage === 'nepali') {
year = Math.max(calendarData.minBsYear, Math.min(calendarData.maxBsYear, year));
month = Math.max(1, Math.min(12, month));
const maxDays = calendarFunctions.getBsMonthDays(year, month);
date = Math.max(1, Math.min(maxDays, date));
dateInfo = calendarFunctions.getBsMonthInfoByBsDate(year, month, date, dateFormat);
const bsDateFormatted = calendarFunctions.getBsDateInYYYYMMDD(year, month, date);
const adDateFormatted = calendarFunctions.getAdDateInYYYYMMDD(dateInfo.adDate);
setSelectedDateInfo({
...dateInfo,
adDate: dateInfo.adDate,
bsDate: bsDateFormatted
});
setCalendarDataState(dateInfo);
onDateSelect?.({
...dateInfo,
bsDate: bsDateFormatted,
adDate: adDateFormatted
});
} else {
year = Math.max(calendarData.minAdYear, Math.min(calendarData.maxAdYear, year));
month = Math.max(1, Math.min(12, month));
const maxDays = new Date(year, month, 0).getDate();
date = Math.max(1, Math.min(maxDays, date));
dateInfo = calendarFunctions.getAdMonthInfoByAdDate(year, month, date, dateFormat);
const adDateFormatted = calendarFunctions.getAdDateInYYYYMMDD(year, month, date);
const bsDate = calendarFunctions.getBsDateByAdDate(year, month, date);
const bsDateFormatted = calendarFunctions.getBsDateInYYYYMMDD(bsDate.bsYear, bsDate.bsMonth, bsDate.bsDate);
setSelectedDateInfo({
...dateInfo,
adDate: dateInfo.adDate,
bsDate: bsDateFormatted
});
setCalendarDataState(dateInfo);
onDateSelect?.({
...dateInfo,
adDate: adDateFormatted,
bsDate: bsDateFormatted
});
}
setIsOpen(false);
};
const handlePrevMonth = () => {
if (currentLanguage === 'nepali') {
const prevMonth = calendarDataState.bsMonth - 1 > 0 ? calendarDataState.bsMonth - 1 : 12;
const prevYear = prevMonth === 12 ? calendarDataState.bsYear - 1 : calendarDataState.bsYear;
setCalendarDataState(calendarFunctions.getBsMonthInfoByBsDate(prevYear, prevMonth, calendarDataState.bsDate, dateFormat));
} else {
const prevMonth = calendarDataState.adMonth - 1 > 0 ? calendarDataState.adMonth - 1 : 12;
const prevYear = prevMonth === 12 ? calendarDataState.adYear - 1 : calendarDataState.adYear;
setCalendarDataState(calendarFunctions.getAdMonthInfoByAdDate(prevYear, prevMonth, calendarDataState.adDate, dateFormat));
}
};
const handleNextMonth = () => {
if (currentLanguage === 'nepali') {
const nextMonth = calendarDataState.bsMonth + 1 <= 12 ? calendarDataState.bsMonth + 1 : 1;
const nextYear = nextMonth === 1 ? calendarDataState.bsYear + 1 : calendarDataState.bsYear;
setCalendarDataState(calendarFunctions.getBsMonthInfoByBsDate(nextYear, nextMonth, calendarDataState.bsDate, dateFormat));
} else {
const nextMonth = calendarDataState.adMonth + 1 <= 12 ? calendarDataState.adMonth + 1 : 1;
const nextYear = nextMonth === 1 ? calendarDataState.adYear + 1 : calendarDataState.adYear;
setCalendarDataState(calendarFunctions.getAdMonthInfoByAdDate(nextYear, nextMonth, calendarDataState.adDate, dateFormat));
}
};
const handleToday = () => {
const currentDate = new Date();
if (currentLanguage === 'nepali') {
const bsDate = calendarFunctions.getBsDateByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate());
setCalendarDataState(calendarFunctions.getBsMonthInfoByBsDate(bsDate.bsYear, bsDate.bsMonth, bsDate.bsDate, dateFormat));
} else {
setCalendarDataState(calendarFunctions.getAdMonthInfoByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate(), dateFormat));
}
};
const renderDays = () => {
if (!calendarDataState || !selectedDateInfo) return null;
const currentDate = new Date();
const currentBsDate = calendarFunctions.getBsDateByAdDate(currentDate.getFullYear(), currentDate.getMonth() + 1, currentDate.getDate());
if (currentLanguage === 'nepali') {
const weekCoverInMonth = Math.ceil((calendarDataState.bsMonthFirstAdDate.getDay() + calendarDataState.bsMonthDays) / 7);
const preMonth = calendarDataState.bsMonth - 1 || 12;
const preYear = preMonth === 12 ? calendarDataState.bsYear - 1 : calendarDataState.bsYear;
const preMonthDays = calendarFunctions.getBsMonthDays(preYear, preMonth);
const days = [];
for (let i = 0; i < weekCoverInMonth; i++) {
const week = [];
for (let k = 1; k <= 7; k++) {
const calendarDate = i * 7 + k - calendarDataState.bsMonthFirstAdDate.getDay();
const isToday = calendarDataState.bsYear === currentBsDate.bsYear && calendarDataState.bsMonth === currentBsDate.bsMonth && calendarDate === currentBsDate.bsDate;
const isSelected = calendarDataState.bsYear === selectedDateInfo.bsYear && calendarDataState.bsMonth === selectedDateInfo.bsMonth && calendarDate === selectedDateInfo.bsDate;
if (calendarDate <= 0) {
week.push(/*#__PURE__*/React.createElement("td", {
key: `${i}-${k}`,
className: "other-month-date"
}, calendarFunctions.getNepaliNumber(preMonthDays + calendarDate)));
} else if (calendarDate > calendarDataState.bsMonthDays) {
week.push(/*#__PURE__*/React.createElement("td", {
key: `${i}-${k}`,
className: "other-month-date"
}, calendarFunctions.getNepaliNumber(calendarDate - calendarDataState.bsMonthDays)));
} else {
week.push(/*#__PURE__*/React.createElement("td", {
key: `${i}-${k}`,
className: `current-month-date ${isToday ? 'today' : ''} ${isSelected && !isToday ? 'selected' : ''}`,
onClick: () => handleDateSelect(calendarDataState.bsYear, calendarDataState.bsMonth, calendarDate)
}, calendarFunctions.getNepaliNumber(calendarDate)));
}
}
days.push(/*#__PURE__*/React.createElement("tr", {
key: i
}, week));
}
return days;
} else {
const weekCoverInMonth = Math.ceil((calendarDataState.adMonthFirstDay.getDay() + calendarDataState.adMonthDays) / 7);
const preMonth = calendarDataState.adMonth - 1 || 12;
const preYear = preMonth === 12 ? calendarDataState.adYear - 1 : calendarDataState.adYear;
const preMonthDays = new Date(preYear, preMonth, 0).getDate();
const days = [];
for (let i = 0; i < weekCoverInMonth; i++) {
const week = [];
for (let k = 1; k <= 7; k++) {
const calendarDate = i * 7 + k - calendarDataState.adMonthFirstDay.getDay();
const isToday = calendarDataState.adYear === currentDate.getFullYear() && calendarDataState.adMonth === currentDate.getMonth() + 1 && calendarDate === currentDate.getDate();
const isSelected = calendarDataState.adYear === selectedDateInfo.adYear && calendarDataState.adMonth === selectedDateInfo.adMonth && calendarDate === selectedDateInfo.adDate;
if (calendarDate <= 0) {
week.push(/*#__PURE__*/React.createElement("td", {
key: `${i}-${k}`,
className: "other-month-date"
}, preMonthDays + calendarDate));
} else if (calendarDate > calendarDataState.adMonthDays) {
week.push(/*#__PURE__*/React.createElement("td", {
key: `${i}-${k}`,
className: "other-month-date"
}, calendarDate - calendarDataState.adMonthDays));
} else {
week.push(/*#__PURE__*/React.createElement("td", {
key: `${i}-${k}`,
className: `current-month-date ${isToday ? 'today' : ''} ${isSelected && !isToday ? 'selected' : ''}`,
onClick: () => handleDateSelect(calendarDataState.adYear, calendarDataState.adMonth, calendarDate)
}, calendarDate));
}
}
days.push(/*#__PURE__*/React.createElement("tr", {
key: i
}, week));
}
return days;
}
};
if (!calendarDataState) return null;
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
className: "nepali-date-picker-container"
}, /*#__PURE__*/React.createElement("input", {
type: "text",
value: selectedDateInfo ? `${selectedDateInfo.formattedDate} (${calendarFunctions.getAdDateInYYYYMMDD(selectedDateInfo.adDate.getFullYear(), selectedDateInfo.adDate.getMonth() + 1, selectedDateInfo.adDate.getDate())})` : `${calendarDataState.formattedDate} (${calendarFunctions.getAdDateInYYYYMMDD(calendarDataState.adDate.getFullYear(), calendarDataState.adDate.getMonth() + 1, calendarDataState.adDate.getDate())})`,
onClick: () => setIsOpen(!isOpen),
readOnly: true,
ref: ref
}), isOpen && /*#__PURE__*/React.createElement("div", {
className: "nepali-date-picker",
ref: pickerRef
}, /*#__PURE__*/React.createElement("div", {
className: "calendar-wrapper"
}, /*#__PURE__*/React.createElement("div", {
className: "calendar-controller"
}, /*#__PURE__*/React.createElement("button", {
type: "button",
className: "prev-btn",
onClick: handlePrevMonth
}, /*#__PURE__*/React.createElement(FaArrowLeft, null)), /*#__PURE__*/React.createElement("button", {
type: "button",
className: "today-btn",
onClick: handleToday
}, /*#__PURE__*/React.createElement(FaCalendarDay, null)), /*#__PURE__*/React.createElement("div", {
className: "current-month-txt",
onClick: () => setShowMonthDropdown(!showMonthDropdown)
}, currentLanguage === 'nepali' ? calendarData.bsMonths[calendarDataState.bsMonth - 1] : calendarData.enMonths[calendarDataState.adMonth - 1], showMonthDropdown && /*#__PURE__*/React.createElement("div", {
className: "drop-down-content"
}, (currentLanguage === 'nepali' ? calendarData.bsMonths : calendarData.enMonths).map((month, index) => /*#__PURE__*/React.createElement("div", {
key: month,
onClick: () => {
if (currentLanguage === 'nepali') {
setCalendarDataState(calendarFunctions.getBsMonthInfoByBsDate(calendarDataState.bsYear, index + 1, calendarDataState.bsDate, dateFormat));
} else {
setCalendarDataState(calendarFunctions.getAdMonthInfoByAdDate(calendarDataState.adYear, index + 1, calendarDataState.adDate, dateFormat));
}
setShowMonthDropdown(false);
}
}, month)))), /*#__PURE__*/React.createElement("div", {
className: "current-year-txt",
onClick: () => setShowYearDropdown(!showYearDropdown)
}, currentLanguage === 'nepali' ? calendarFunctions.getNepaliNumber(calendarDataState.bsYear) : calendarDataState.adYear, showYearDropdown && /*#__PURE__*/React.createElement("div", {
className: "drop-down-content"
}, Array.from({
length: (currentLanguage === 'nepali' ? 2100 - 1970 : 2043 - 1913) + 1
}, (_, i) => (currentLanguage === 'nepali' ? 1970 : 1913) + i).map(year => /*#__PURE__*/React.createElement("div", {
key: year,
onClick: () => {
if (currentLanguage === 'nepali') {
setCalendarDataState(calendarFunctions.getBsMonthInfoByBsDate(year, calendarDataState.bsMonth, calendarDataState.bsDate, dateFormat));
} else {
setCalendarDataState(calendarFunctions.getAdMonthInfoByAdDate(year, calendarDataState.adMonth, calendarDataState.adDate, dateFormat));
}
setShowYearDropdown(false);
}
}, currentLanguage === 'nepali' ? calendarFunctions.getNepaliNumber(year) : year)))), /*#__PURE__*/React.createElement("button", {
type: "button",
className: "next-btn",
onClick: handleNextMonth
}, /*#__PURE__*/React.createElement(FaArrowRight, null))), /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, (currentLanguage === 'nepali' ? calendarData.bsDays : calendarData.enDays).map(day => /*#__PURE__*/React.createElement("td", {
key: day
}, day)))), /*#__PURE__*/React.createElement("tbody", null, renderDays()))))), /*#__PURE__*/React.createElement("style", null, `
.nepali-date-picker-container {
position: relative;
display: inline-block;
font-family: Arial, sans-serif;
}
.nepali-date-picker-container input {
width: 280px;
padding: 8px 12px;
font-size: 14px;
line-height: 1.3;
color: #333;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
}
.nepali-date-picker {
background: #fff;
border: 1px solid #ddd;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
padding: 10px;
position: absolute;
z-index: 9999;
top: calc(100% + 5px);
left: 0;
}
.calendar-wrapper table {
border-collapse: collapse;
width: auto;
}
.calendar-wrapper thead {
background: #f5f5f5;
color: #333;
}
.calendar-wrapper td {
border: 1px solid #e0e0e0;
padding: 4px 8px;
text-align: center;
font-size: 14px;
width: 18px;
height: 8px;
}
.calendar-wrapper tbody td {
cursor: pointer;
}
.current-month-date:hover {
background-color: #718fcd;
color: white;
font-weight: bold;
}
.other-month-date {
color: #999;
cursor: default;
}
.current-month-date.today {
background-color: #4caf50;
color: white;
font-weight: bold;
}
.current-month-date.selected {
background-color: #c8e6c9;
color: #333;
font-weight: bold;
}
.calendar-controller {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10px;
}
.calendar-controller button {
width: 30px;
height: 30px;
border: none;
background: #f0f0f0;
cursor: pointer;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s;
font-size: 12px;
}
.calendar-controller button:hover {
background: #e0e0e0;
}
.prev-btn { color: #4caf50; }
.next-btn { color: #4caf50; }
.today-btn { color: #1976d2; }
.current-month-txt, .current-year-txt {
color: #333;
cursor: pointer;
font-weight: bold;
padding: 0 8px;
position: relative;
line-height: 30px;
font-size: 12px;
}
.current-month-txt:hover, .current-year-txt:hover {
color: #1976d2;
text-decoration: underline;
}
.drop-down-content {
background-color: #fff;
border: 1px solid #ddd;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
position: absolute;
max-height: 200px;
overflow-y: auto;
width: auto;
min-width: 60px;
z-index: 1000;
border-radius: 4px;
font-size: 12px;
}
.drop-down-content div {
padding: 5px 10px;
text-align: left;
cursor: pointer;
}
.drop-down-content div:hover {
background: #718fcd;
color: white;
}
`));
});
StnNepaliDatePicker.displayName = 'StnNepaliDatePicker';
module.exports = StnNepaliDatePicker;