Skip to content

Commit

Permalink
fixed auto collapse the DateFormField after user clicks on a date (#5534
Browse files Browse the repository at this point in the history
)
  • Loading branch information
sachdevavaibhav authored May 30, 2023
1 parent 689e14b commit 4216382
Showing 1 changed file with 9 additions and 4 deletions.
13 changes: 9 additions & 4 deletions src/Components/Common/DateInputV2.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useState, useEffect } from "react";
import { useState, useEffect, MutableRefObject } from "react";
import {
format,
subMonths,
Expand Down Expand Up @@ -90,7 +90,11 @@ const DateInputV2: React.FC<Props> = ({
);
};

const setDateValue = (date: number) => () => {
type CloseFunction = (
focusableElement?: HTMLElement | MutableRefObject<HTMLElement | null>
) => void;

const setDateValue = (date: number, close: CloseFunction) => () => {
isDateWithinConstraints(date) &&
onChange(
new Date(
Expand All @@ -99,6 +103,7 @@ const DateInputV2: React.FC<Props> = ({
date
)
);
close();
};

const getDayCount = (date: Date) => {
Expand Down Expand Up @@ -194,7 +199,7 @@ const DateInputV2: React.FC<Props> = ({
<div>
<div className="container mx-auto text-black">
<Popover className="relative">
{({ open }) => (
{({ open, close }) => (
<div
onBlur={() => {
setIsOpen && setIsOpen(false);
Expand Down Expand Up @@ -310,7 +315,7 @@ const DateInputV2: React.FC<Props> = ({
className="aspect-square w-[14.26%]"
>
<div
onClick={setDateValue(d)}
onClick={setDateValue(d, close)}
className={classNames(
"cursor-pointer flex items-center justify-center text-center h-full text-sm rounded leading-loose transition ease-in-out duration-100 text-black",
value && isSelectedDate(d)
Expand Down

0 comments on commit 4216382

Please sign in to comment.