* datetime-picker: support for setting minDate and maxDate with callb…

…ack.
easysoft · Jan 29, 2024 · 9b74e0a · 9b74e0a
1 parent b276f07
commit 9b74e0a
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 10 deletions.
diff --git a/lib/datetime-picker/src/component/date-picker-menu.tsx b/lib/datetime-picker/src/component/date-picker-menu.tsx
@@ -112,6 +112,8 @@ export class DatePickerMenu extends Component<DatePickerMenuProps, DatePickerMen
             yearText = i18n.getLang('yearFormat') || '{0}',
             weekNames = i18n.getLang('weekNames'),
             monthNames = i18n.getLang('monthNames'),
+            minDate: minDateSetting = '1970-1-1',
+            maxDate: maxDateSetting = '2099-1-1',
             weekStart,
         } = props;
         const currentDate = date ? new Date(date) : undefined;
@@ -121,8 +123,8 @@ export class DatePickerMenu extends Component<DatePickerMenuProps, DatePickerMen
             select,
         } = state;
         const isSelectDay = select === 'day';
-        const minDate = createDate(props.minDate || '1970-1-1');
-        const maxDate = createDate(props.maxDate || '2099-12-1');
+        const minDate = createDate(typeof minDateSetting === 'function' ? minDateSetting(currentDate) : minDateSetting);
+        const maxDate = createDate(typeof maxDateSetting === 'function' ? maxDateSetting(currentDate) : maxDateSetting);
         return (
             <div className="date-picker-menu row" ref={this.#ref} onClick={this.#handleClick}>
                 {this.#renderMenu(props)}

diff --git a/lib/datetime-picker/src/component/date-picker.tsx b/lib/datetime-picker/src/component/date-picker.tsx
@@ -43,13 +43,13 @@ export class DatePicker<T extends DatePickerOptions = DatePickerOptions> extends
         }
         let date = createDate(value);
         if (minDate) {
-            const min = createDate(minDate);
+            const min = createDate(typeof minDate === 'function' ? minDate(date) : minDate);
             if (date < min) {
                 date = min;
             }
         }
         if (maxDate) {
-            const max = createDate(maxDate);
+            const max = createDate(typeof maxDate === 'function' ? maxDate(date) : maxDate);
             if (date > max) {
                 date = max;
             }

diff --git a/lib/datetime-picker/src/types/date-picker-menu-props.ts b/lib/datetime-picker/src/types/date-picker-menu-props.ts
@@ -1,5 +1,6 @@
 import type {DateLike} from '@zui/helpers/src/date-helper';
-import type {NavItemOptions, NavOptions} from '@zui/nav';
+import type {ListitemProps} from '@zui/list';
+import type {NavOptions} from '@zui/nav';
 import type {ToolbarItemOptions, ToolbarOptions} from '@zui/toolbar';
 
 export type DatePickerMenuProps = {
@@ -11,8 +12,8 @@ export type DatePickerMenuProps = {
     todayText?: string;
     clearText?: string;
     weekStart?: number;
-    menu?: NavItemOptions[] | NavOptions;
+    menu?: ListitemProps[] | NavOptions;
     actions?: ToolbarItemOptions[] | ToolbarOptions;
-    minDate?: DateLike;
-    maxDate?: DateLike;
+    minDate?: DateLike | ((date?: Date) => DateLike);
+    maxDate?: DateLike | ((date?: Date) => DateLike);
 };
diff --git a/lib/datetime-picker/src/types/date-picker-options.ts b/lib/datetime-picker/src/types/date-picker-options.ts
@@ -17,8 +17,8 @@ export interface DatePickerOptions extends PickOptions {
     todayText?: string;
     clearText?: string;
     weekStart?: number;
-    minDate?: DateLike;
-    maxDate?: DateLike;
+    minDate?: DateLike | ((date?: Date) => DateLike);
+    maxDate?: DateLike | ((date?: Date) => DateLike);
     menu?: Item[] | NavOptions;
     actions?: ToolbarItemOptions[] | ToolbarOptions;
     onInvalid?: (value: string) => void;