nearpay-datepicker-react 0.2.2 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs.js CHANGED
@@ -2573,7 +2573,7 @@ const Week = () => {
2573
2573
  }
2574
2574
  return 0;
2575
2575
  }, [startWeekOn]);
2576
- return (jsxRuntimeExports.jsx("div", { className: "grid grid-cols-7 border-b border-gray-300 dark:border-zinc-700 py-2", children: DAYS.map(item => (jsxRuntimeExports.jsx("div", { className: "tracking-wide text-gray-500 text-center", children: ucFirst(shortString(dateFormat(new Date(2022, 10, 6 + item + startDateModifier), "ddd", i18n) || "")) }, item))) }));
2576
+ return (jsxRuntimeExports.jsx("div", { className: "grid grid-cols-7 border-b border-gray-300 dark:border-zinc-700 py-2", children: DAYS.map(item => (jsxRuntimeExports.jsx("div", { className: "tracking-wide text-gray-500 text-center", children: ucFirst(shortString(dateFormat(new Date(2022, 10, 6 + item + startDateModifier), "ddd", i18n) || "", i18n === "ar" ? 7 : 3)) }, item))) }));
2577
2577
  };
2578
2578
 
2579
2579
  const Years = (props) => {
@@ -2973,8 +2973,12 @@ const Input = (e) => {
2973
2973
  div.classList.remove("hidden");
2974
2974
  div.classList.add("block");
2975
2975
  // window.innerWidth === 767
2976
- const popoverOnUp = popoverDirection == "up";
2977
- const popoverOnDown = popoverDirection === "down";
2976
+ const popoverOnUp = popoverDirection === "up" ||
2977
+ popoverDirection === "up-left" ||
2978
+ popoverDirection === "up-right";
2979
+ const popoverOnDown = popoverDirection === "down" ||
2980
+ popoverDirection === "down-left" ||
2981
+ popoverDirection === "down-right";
2978
2982
  if (popoverOnUp ||
2979
2983
  (window.innerWidth > 767 &&
2980
2984
  window.screen.height - 100 < div.getBoundingClientRect().bottom &&
@@ -3281,13 +3285,32 @@ const Datepicker = (props) => {
3281
3285
  const detail = container.getBoundingClientRect();
3282
3286
  const screenCenter = window.innerWidth / 2;
3283
3287
  const containerCenter = (detail.right - detail.x) / 2 + detail.x;
3284
- if (containerCenter > screenCenter) {
3288
+ const alignRight = () => {
3285
3289
  arrow.classList.add("right-0");
3286
3290
  arrow.classList.add("mr-3.5");
3287
3291
  calendarContainer.classList.add("right-0");
3292
+ };
3293
+ const alignLeft = () => {
3294
+ arrow.classList.remove("right-0");
3295
+ arrow.classList.remove("mr-3.5");
3296
+ calendarContainer.classList.remove("right-0");
3297
+ };
3298
+ if (popoverDirection === "down-left" || popoverDirection === "up-left") {
3299
+ alignRight();
3300
+ }
3301
+ else if (popoverDirection === "down-right" || popoverDirection === "up-right") {
3302
+ alignLeft();
3303
+ }
3304
+ else {
3305
+ if (containerCenter > screenCenter) {
3306
+ alignRight();
3307
+ }
3308
+ else {
3309
+ alignLeft();
3310
+ }
3288
3311
  }
3289
3312
  }
3290
- }, []);
3313
+ }, [popoverDirection]);
3291
3314
  require$$0.useEffect(() => {
3292
3315
  if (value && value.startDate && value.endDate) {
3293
3316
  if (dateIsSameOrBefore(value.startDate, value.endDate, "date")) {