Skip to content
Open
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/silent-cougars-serve.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"flowbite-react": patch
---

isClearAction added to onSelectedDateChanged in order to have context which can be used in various scenarios when we need to clear date.
10 changes: 5 additions & 5 deletions packages/ui/src/components/Datepicker/Datepicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ export interface DatepickerProps extends Omit<TextInputProps, "theme"> {
language?: string;
weekStart?: WeekStart;
theme?: DeepPartial<FlowbiteDatepickerTheme>;
onSelectedDateChanged?: (date: Date) => void;
onSelectedDateChanged?: (date: Date, isClearAction: boolean) => void;
}

const DatepickerRender: ForwardRefRenderFunction<DatepickerRef, DatepickerProps> = (
Expand Down Expand Up @@ -137,11 +137,11 @@ const DatepickerRender: ForwardRefRenderFunction<DatepickerRef, DatepickerProps>
const datepickerRef = useRef<HTMLDivElement>(null);

// Triggers when user select the date
const changeSelectedDate = (date: Date, useAutohide: boolean) => {
const changeSelectedDate = (date: Date, useAutohide: boolean, isClearAction?: boolean) => {
setSelectedDate(date);

if (onSelectedDateChanged) {
onSelectedDateChanged(date);
onSelectedDateChanged(date, isClearAction ?? false);
}

if (autoHide && view === Views.Days && useAutohide == true && !inline) {
Expand All @@ -150,7 +150,7 @@ const DatepickerRender: ForwardRefRenderFunction<DatepickerRef, DatepickerProps>
};

const clearDate = () => {
changeSelectedDate(defaultDate, true);
changeSelectedDate(defaultDate, true, true);
if (defaultDate) {
setViewDate(defaultDate);
}
Expand Down Expand Up @@ -336,7 +336,7 @@ const DatepickerRender: ForwardRefRenderFunction<DatepickerRef, DatepickerProps>
type="button"
className={twMerge(theme.popup.footer.button.base, theme.popup.footer.button.clear)}
onClick={() => {
changeSelectedDate(defaultDate, true);
changeSelectedDate(defaultDate, true, true);
if (defaultDate) {
setViewDate(defaultDate);
}
Expand Down