@mezzanine-ui/react 0.14.0 → 0.14.2

package/Calendar/Calendar.d.ts

@@ -23,6 +23,16 @@ export interface CalendarProps extends Omit<NativeElementPropsWithoutKeyAndRef<'
      * Other props you may provide to `CalendarYears`
      */
     calendarYearsProps?: Omit<CalendarYearsProps, 'onClick' | 'referenceDate' | 'value' | 'isYearDisabled' | 'isYearInRange' | 'onYearHover'>;
+    /**
+     * Disabled `Month` calendar button click
+     * @default false
+     */
+    disabledMonthSwitch?: boolean;
+    /**
+     * Disabled `Year` calendar button click
+     * @default false
+     */
+    disabledYearSwitch?: boolean;
     /**
      * Use this prop to switch calendars.
      * @default 'day'

package/Calendar/Calendar.js

@@ -17,18 +17,18 @@ import cx from 'clsx';
  */
 const Calendar = forwardRef(function Calendar(props, ref) {
     const { displayMonthLocale: displayMonthLocaleFromConfig, getMonth, getMonthShortName, getYear, } = useCalendarContext();
-    const { calendarDaysProps, calendarMonthsProps, calendarWeeksProps, calendarYearsProps, className, disableOnNext, disableOnPrev, displayMonthLocale = displayMonthLocaleFromConfig, displayWeekDayLocale, isDateDisabled, isDateInRange, isMonthDisabled, isMonthInRange, isWeekDisabled, isWeekInRange, isYearDisabled, isYearInRange, mode = 'day', onChange, onDateHover, onMonthControlClick, onMonthHover, onNext, onPrev, onWeekHover, onYearControlClick, onYearHover, referenceDate, value: valueProp, ...restCalendarProps } = props;
+    const { calendarDaysProps, calendarMonthsProps, calendarWeeksProps, calendarYearsProps, className, disabledMonthSwitch, disableOnNext, disableOnPrev, disabledYearSwitch, displayMonthLocale = displayMonthLocaleFromConfig, displayWeekDayLocale, isDateDisabled, isDateInRange, isMonthDisabled, isMonthInRange, isWeekDisabled, isWeekInRange, isYearDisabled, isYearInRange, mode = 'day', onChange, onDateHover, onMonthControlClick, onMonthHover, onNext, onPrev, onWeekHover, onYearControlClick, onYearHover, referenceDate, value: valueProp, ...restCalendarProps } = props;
     const value = valueProp ? castArray(valueProp) : undefined;
     /** Compute which calendar to use */
     let displayCalendar;
     if (mode === 'day') {
-        displayCalendar = (jsx(CalendarDays, { ...calendarDaysProps, isDateDisabled: isDateDisabled, isDateInRange: isDateInRange, onClick: onChange, onDateHover: onDateHover, referenceDate: referenceDate, displayWeekDayLocale: displayWeekDayLocale, value: value }));
+        displayCalendar = (jsx(CalendarDays, { ...calendarDaysProps, isYearDisabled: isYearDisabled, isMonthDisabled: isMonthDisabled, isDateDisabled: isDateDisabled, isDateInRange: isDateInRange, onClick: onChange, onDateHover: onDateHover, referenceDate: referenceDate, displayWeekDayLocale: displayWeekDayLocale, value: value }));
     }
     else if (mode === 'week') {
-        displayCalendar = (jsx(CalendarWeeks, { ...calendarWeeksProps, isWeekDisabled: isWeekDisabled, isWeekInRange: isWeekInRange, onClick: onChange, onWeekHover: onWeekHover, referenceDate: referenceDate, displayWeekDayLocale: displayWeekDayLocale, value: value }));
+        displayCalendar = (jsx(CalendarWeeks, { ...calendarWeeksProps, isYearDisabled: isYearDisabled, isMonthDisabled: isMonthDisabled, isWeekDisabled: isWeekDisabled, isWeekInRange: isWeekInRange, onClick: onChange, onWeekHover: onWeekHover, referenceDate: referenceDate, displayWeekDayLocale: displayWeekDayLocale, value: value }));
     }
     else if (mode === 'month') {
-        displayCalendar = (jsx(CalendarMonths, { ...calendarMonthsProps, isMonthDisabled: isMonthDisabled, isMonthInRange: isMonthInRange, onClick: onChange, onMonthHover: onMonthHover, referenceDate: referenceDate, value: value }));
+        displayCalendar = (jsx(CalendarMonths, { ...calendarMonthsProps, isYearDisabled: isYearDisabled, isMonthDisabled: isMonthDisabled, isMonthInRange: isMonthInRange, onClick: onChange, onMonthHover: onMonthHover, referenceDate: referenceDate, value: value }));
     }
     else if (mode === 'year') {
         displayCalendar = (jsx(CalendarYears, { ...calendarYearsProps, isYearDisabled: isYearDisabled, isYearInRange: isYearInRange, onClick: onChange, onYearHover: onYearHover, referenceDate: referenceDate, value: value }));
@@ -38,10 +38,10 @@ const Calendar = forwardRef(function Calendar(props, ref) {
     const displayYearRange = `${start} - ${end}`;
     let controls;
     if (mode === 'day' || mode === 'week') {
-        controls = (jsxs(Fragment, { children: [jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton), onClick: onMonthControlClick, children: getMonthShortName(getMonth(referenceDate), displayMonthLocale) }), jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton), onClick: onYearControlClick, children: getYear(referenceDate) })] }));
+        controls = (jsxs(Fragment, { children: [jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton, disabledMonthSwitch && calendarClasses.buttonDisabled), disabled: disabledMonthSwitch, "aria-disabled": disabledMonthSwitch, onClick: onMonthControlClick, children: getMonthShortName(getMonth(referenceDate), displayMonthLocale) }), jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton, disabledYearSwitch && calendarClasses.buttonDisabled), disabled: disabledYearSwitch, "aria-disabled": disabledYearSwitch, onClick: onYearControlClick, children: getYear(referenceDate) })] }));
     }
     else if (mode === 'month') {
-        controls = (jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton), onClick: onYearControlClick, children: getYear(referenceDate) }));
+        controls = (jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton, disabledYearSwitch && calendarClasses.buttonDisabled), disabled: disabledYearSwitch, "aria-disabled": disabledYearSwitch, onClick: onYearControlClick, children: getYear(referenceDate) }));
     }
     else if (mode === 'year') {
         controls = (jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton, calendarClasses.buttonDisabled), disabled: true, "aria-disabled": true, children: displayYearRange }));

package/Calendar/CalendarDays.d.ts

@@ -2,7 +2,9 @@
 import { DateType } from '@mezzanine-ui/core/calendar';
 import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
 import { CalendarDayOfWeekProps } from './CalendarDayOfWeek';
-export interface CalendarDaysProps extends Pick<CalendarDayOfWeekProps, 'displayWeekDayLocale'>, Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick' | 'children'> {
+import type { CalendarYearsProps } from './CalendarYears';
+import type { CalendarMonthsProps } from './CalendarMonths';
+export interface CalendarDaysProps extends Pick<CalendarDayOfWeekProps, 'displayWeekDayLocale'>, Pick<CalendarYearsProps, 'isYearDisabled'>, Pick<CalendarMonthsProps, 'isMonthDisabled'>, Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick' | 'children'> {
     /**
      * Provide if you have a custom disabling logic. The method takes the date object as its parameter.
      */

package/Calendar/CalendarDays.js

@@ -13,7 +13,7 @@ import cx from 'clsx';
  */
 function CalendarDays(props) {
     const { displayWeekDayLocale: displayWeekDayLocaleFromConfig, getCalendarGrid, getDate, getMonth, getNow, isDateIncluded, isSameDate, setDate, setMonth, } = useCalendarContext();
-    const { className, displayWeekDayLocale = displayWeekDayLocaleFromConfig, isDateDisabled, isDateInRange, onClick: onClickProp, onDateHover, referenceDate, value, ...rest } = props;
+    const { className, displayWeekDayLocale = displayWeekDayLocaleFromConfig, isYearDisabled, isMonthDisabled, isDateDisabled, isDateInRange, onClick: onClickProp, onDateHover, referenceDate, value, ...rest } = props;
     const daysGrid = useMemo(() => getCalendarGrid(referenceDate), [getCalendarGrid, referenceDate]);
     return (jsxs("div", { ...rest, className: cx(calendarClasses.board, className), children: [jsx(CalendarDayOfWeek, { displayWeekDayLocale: displayWeekDayLocale }), daysGrid.map((week, index) => (jsx("div", { className: calendarClasses.row, children: week.map((dateNum) => {
                     const isPrevMonth = index === 0 && dateNum > 7;
@@ -26,7 +26,7 @@ function CalendarDays(props) {
                             ? thisMonth + 1
                             : thisMonth;
                     const date = setDate(setMonth(referenceDate, month), dateNum);
-                    const disabled = isDateDisabled && isDateDisabled(date);
+                    const disabled = ((isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(date)) || (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(date)) || (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date))) || false;
                     const inactive = !disabled && (isPrevMonth || isNextMonth);
                     const inRange = !inactive && isDateInRange && isDateInRange(date);
                     const active = !disabled && !inactive && value && isDateIncluded(date, value);

package/Calendar/CalendarMonths.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import { DateType } from '@mezzanine-ui/core/calendar';
+import type { CalendarYearsProps } from './CalendarYears';
 import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
-export interface CalendarMonthsProps extends Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick' | 'children'> {
+export interface CalendarMonthsProps extends Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick' | 'children'>, Pick<CalendarYearsProps, 'isYearDisabled'> {
     /**
      * The locale you want to use when rendering the names of month.
      * If none provided, it will use the `displayMonthLocale` from calendar context.

package/Calendar/CalendarMonths.js

@@ -10,12 +10,13 @@ import cx from 'clsx';
  */
 function CalendarMonths(props) {
     const { displayMonthLocale: displayMonthLocaleFromConfig, getMonthShortNames, isMonthIncluded, setMonth, } = useCalendarContext();
-    const { className, displayMonthLocale = displayMonthLocaleFromConfig, isMonthDisabled, isMonthInRange, onClick: onClickProp, onMonthHover, referenceDate, value, ...rest } = props;
+    const { className, displayMonthLocale = displayMonthLocaleFromConfig, isMonthDisabled, isMonthInRange, isYearDisabled, onClick: onClickProp, onMonthHover, referenceDate, value, ...rest } = props;
     const monthNames = getMonthShortNames(displayMonthLocale);
     return (jsx("div", { className: cx(calendarClasses.board, className), ...rest, children: jsx("div", { className: calendarClasses.twelveGrid, children: calendarMonths.map((month) => {
                 const monthDateType = setMonth(referenceDate, month);
                 const active = value && isMonthIncluded(monthDateType, value);
-                const disabled = isMonthDisabled && isMonthDisabled(monthDateType);
+                /** @NOTE Current month should be disabled when current year is disabled */
+                const disabled = ((isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(monthDateType)) || (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(monthDateType))) || false;
                 const inRange = isMonthInRange && isMonthInRange(monthDateType);
                 const onClick = onClickProp ? () => { onClickProp(monthDateType); } : undefined;
                 const onMouseEnter = onMonthHover ? () => { onMonthHover(monthDateType); } : undefined;

package/Calendar/CalendarWeeks.d.ts

@@ -2,7 +2,9 @@
 import { DateType } from '@mezzanine-ui/core/calendar';
 import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
 import { CalendarDayOfWeekProps } from './CalendarDayOfWeek';
-export interface CalendarWeeksProps extends Pick<CalendarDayOfWeekProps, 'displayWeekDayLocale'>, Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick' | 'children'> {
+import type { CalendarYearsProps } from './CalendarYears';
+import type { CalendarMonthsProps } from './CalendarMonths';
+export interface CalendarWeeksProps extends Pick<CalendarDayOfWeekProps, 'displayWeekDayLocale'>, Pick<CalendarYearsProps, 'isYearDisabled'>, Pick<CalendarMonthsProps, 'isMonthDisabled'>, Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick' | 'children'> {
     /**
      * Provide if you have a custom disabling logic.
      * The method takes the date object of first date in week as its parameter.

package/Calendar/CalendarWeeks.js

@@ -13,7 +13,7 @@ import cx from 'clsx';
  */
 function CalendarWeeks(props) {
     const { displayWeekDayLocale: displayWeekDayLocaleFromConfig, getCalendarGrid, getDate, getMonth, getNow, isInMonth, isSameDate, isWeekIncluded, setDate, setMonth, } = useCalendarContext();
-    const { className, displayWeekDayLocale = displayWeekDayLocaleFromConfig, isWeekDisabled, isWeekInRange, onClick: onClickProp, onWeekHover, referenceDate, value, ...rest } = props;
+    const { className, displayWeekDayLocale = displayWeekDayLocaleFromConfig, isYearDisabled, isMonthDisabled, isWeekDisabled, isWeekInRange, onClick: onClickProp, onWeekHover, referenceDate, value, ...rest } = props;
     const daysGrid = useMemo(() => getCalendarGrid(referenceDate), [getCalendarGrid, referenceDate]);
     return (jsxs("div", { ...rest, className: cx(calendarClasses.board, className), children: [jsx(CalendarDayOfWeek, { displayWeekDayLocale: displayWeekDayLocale }), daysGrid.map((week, index) => {
                 const dates = [];
@@ -32,7 +32,7 @@ function CalendarWeeks(props) {
                     const date = setDate(setMonth(referenceDate, month), dateNum);
                     dates.push(date);
                 });
-                const disabled = isWeekDisabled && isWeekDisabled(dates[0]);
+                const disabled = ((isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(dates[0])) || (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(dates[0])) || (isWeekDisabled === null || isWeekDisabled === void 0 ? void 0 : isWeekDisabled(dates[0]))) || false;
                 const inactive = !disabled && (weekStartInPrevMonth || weekStartInNextMonth);
                 const active = !disabled && !inactive && value && isWeekIncluded(dates[0], value);
                 const inRange = !disabled && !inactive && isWeekInRange && isWeekInRange(dates[0]);

package/DatePicker/DatePicker.js

@@ -18,7 +18,7 @@ import { FormControlContext } from '../Form/FormControlContext.js';
 const DatePicker = forwardRef(function DatePicker(props, ref) {
     const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
     const { defaultDateFormat, getNow, } = useCalendarContext();
-    const { calendarProps, className, clearable = true, defaultValue, disableOnNext, disableOnPrev, disabled = disabledFromFormControl || false, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultDateFormat, fullWidth = fullWidthFromFormControl || false, inputProps, isDateDisabled, isMonthDisabled, isYearDisabled, mode = 'day', onCalendarToggle: onCalendarToggleProp, onChange: onChangeProp, placeholder, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl || false, size, value: valueProp, ...restTriggerProps } = props;
+    const { calendarProps, className, clearable = true, defaultValue, disabledMonthSwitch = false, disableOnNext, disableOnPrev, disabledYearSwitch = false, disabled = disabledFromFormControl || false, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultDateFormat, fullWidth = fullWidthFromFormControl || false, inputProps, isDateDisabled, isMonthDisabled, isWeekDisabled, isYearDisabled, mode = 'day', onCalendarToggle: onCalendarToggleProp, onChange: onChangeProp, placeholder, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl || false, size, value: valueProp, ...restTriggerProps } = props;
     const { onBlur: onBlurProp, onKeyDown: onKeyDownProp, onFocus: onFocusProp, size: inputSize = format.length + 2, ...restInputProp } = inputProps || {};
     const formats = useMemo(() => [
         format,
@@ -128,7 +128,7 @@ const DatePicker = forwardRef(function DatePicker(props, ref) {
         onCalendarToggle(!open);
     };
     const suffixActionIcon = (jsx(Icon, { icon: CalendarIcon, onClick: onIconClick }));
-    return (jsxs(Fragment, { children: [jsx(PickerTrigger, { ...restTriggerProps, ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputProps: resolvedInputProps, inputRef: inputRef, onChange: onInputChange, onClear: onClear, placeholder: placeholder, prefix: prefix, readOnly: readOnly, required: required, size: size, suffixActionIcon: suffixActionIcon, value: inputValue }), jsx(DatePickerCalendar, { ref: calendarRef, anchor: anchorRef, calendarProps: calendarProps, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isYearDisabled: isYearDisabled, mode: mode, onChange: onCalendarChange, open: open, popperProps: popperProps, referenceDate: referenceDate, value: internalValue })] }));
+    return (jsxs(Fragment, { children: [jsx(PickerTrigger, { ...restTriggerProps, ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputProps: resolvedInputProps, inputRef: inputRef, onChange: onInputChange, onClear: onClear, placeholder: placeholder, prefix: prefix, readOnly: readOnly, required: required, size: size, suffixActionIcon: suffixActionIcon, value: inputValue }), jsx(DatePickerCalendar, { ref: calendarRef, anchor: anchorRef, calendarProps: calendarProps, disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isWeekDisabled: isWeekDisabled, isYearDisabled: isYearDisabled, mode: mode, onChange: onCalendarChange, open: open, popperProps: popperProps, referenceDate: referenceDate, value: internalValue })] }));
 });
 var DatePicker$1 = DatePicker;
 

package/DatePicker/DatePickerCalendar.d.ts

@@ -2,11 +2,11 @@ import { CalendarMode, DateType } from '@mezzanine-ui/core/calendar';
 import { RefObject } from 'react';
 import { CalendarProps } from '../Calendar';
 import { InputTriggerPopperProps } from '../_internal/InputTriggerPopper';
-export interface DatePickerCalendarProps extends Pick<InputTriggerPopperProps, 'anchor' | 'fadeProps' | 'open'>, Pick<CalendarProps, 'disableOnNext' | 'disableOnPrev' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isYearDisabled' | 'onChange' | 'referenceDate'> {
+export interface DatePickerCalendarProps extends Pick<InputTriggerPopperProps, 'anchor' | 'fadeProps' | 'open'>, Pick<CalendarProps, 'disabledMonthSwitch' | 'disableOnNext' | 'disableOnPrev' | 'disabledYearSwitch' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isWeekDisabled' | 'isYearDisabled' | 'onChange' | 'referenceDate'> {
     /**
      * Other calendar props you may provide to `Calendar`.
      */
-    calendarProps?: Omit<CalendarProps, 'disableOnNext' | 'disableOnPrev' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isYearDisabled' | 'locale' | 'mode' | 'onChange' | 'onMonthControlClick' | 'onNext' | 'onPrev' | 'onYearControlClick' | 'referenceDate' | 'updateReferenceDate' | 'value'>;
+    calendarProps?: Omit<CalendarProps, 'disableOnNext' | 'disableOnPrev' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isWeekDisabled' | 'isYearDisabled' | 'locale' | 'mode' | 'onChange' | 'onMonthControlClick' | 'onNext' | 'onPrev' | 'onYearControlClick' | 'referenceDate' | 'updateReferenceDate' | 'value'>;
     /**
      * React ref for calendar component.
      */

package/DatePicker/DatePickerCalendar.js

@@ -10,7 +10,7 @@ import Calendar from '../Calendar/Calendar.js';
  */
 const DatePickerCalendar = forwardRef(function DatePickerCalendar(props, ref) {
     const { displayMonthLocale: displayMonthLocaleFromConfig, getMonth, getYear, setMonth, setYear, } = useCalendarContext();
-    const { anchor, calendarProps, calendarRef, disableOnNext, disableOnPrev, displayMonthLocale = displayMonthLocaleFromConfig, fadeProps, isDateDisabled, isMonthDisabled, isYearDisabled, mode = 'day', onChange: onChangeProp, open, popperProps, referenceDate: referenceDateProp, value, } = props;
+    const { anchor, calendarProps, calendarRef, disabledMonthSwitch, disableOnNext, disableOnPrev, disabledYearSwitch, displayMonthLocale = displayMonthLocaleFromConfig, fadeProps, isDateDisabled, isMonthDisabled, isWeekDisabled, isYearDisabled, mode = 'day', onChange: onChangeProp, open, popperProps, referenceDate: referenceDateProp, value, } = props;
     const { className: calendarClassName, ...restCalendarProps } = calendarProps || {};
     const { currentMode, onMonthControlClick, onNext, onPrev, onYearControlClick, popModeStack, referenceDate, updateReferenceDate, } = useCalendarControls(referenceDateProp, mode);
     const onChange = useMemo(() => {
@@ -55,7 +55,7 @@ const DatePickerCalendar = forwardRef(function DatePickerCalendar(props, ref) {
         setYear,
         getYear,
     ]);
-    return (jsx(InputTriggerPopper, { ...popperProps, ref: ref, anchor: anchor, open: open, fadeProps: fadeProps, children: jsx(Calendar, { ...restCalendarProps, ref: calendarRef, className: calendarClassName, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isYearDisabled: isYearDisabled, mode: currentMode, onChange: onChange, onMonthControlClick: onMonthControlClick, onNext: onNext, onPrev: onPrev, onYearControlClick: onYearControlClick, referenceDate: referenceDate, value: value }) }));
+    return (jsx(InputTriggerPopper, { ...popperProps, ref: ref, anchor: anchor, open: open, fadeProps: fadeProps, children: jsx(Calendar, { ...restCalendarProps, ref: calendarRef, className: calendarClassName, disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isWeekDisabled: isWeekDisabled, isYearDisabled: isYearDisabled, mode: currentMode, onChange: onChange, onMonthControlClick: onMonthControlClick, onNext: onNext, onPrev: onPrev, onYearControlClick: onYearControlClick, referenceDate: referenceDate, value: value }) }));
 });
 var DatePickerCalendar$1 = DatePickerCalendar;
 

package/DateRangePicker/DateRangePicker.d.ts

@@ -3,7 +3,7 @@ import { DateType } from '@mezzanine-ui/core/calendar';
 import { RangePickerValue } from '@mezzanine-ui/core/picker';
 import { DateRangePickerCalendarProps } from './DateRangePickerCalendar';
 import { RangePickerTriggerProps } from '../Picker';
-export interface DateRangePickerProps extends Pick<DateRangePickerCalendarProps, 'calendarProps' | 'displayMonthLocale' | 'fadeProps' | 'mode' | 'popperProps' | 'isDateDisabled' | 'isMonthDisabled' | 'isYearDisabled'>, Pick<RangePickerTriggerProps, 'className' | 'clearable' | 'disabled' | 'error' | 'fullWidth' | 'inputFromPlaceholder' | 'inputFromProps' | 'inputToPlaceholder' | 'inputToProps' | 'prefix' | 'readOnly' | 'required' | 'size'> {
+export interface DateRangePickerProps extends Pick<DateRangePickerCalendarProps, 'calendarProps' | 'disabledMonthSwitch' | 'disableOnNext' | 'disableOnPrev' | 'disabledYearSwitch' | 'displayMonthLocale' | 'fadeProps' | 'mode' | 'popperProps' | 'isDateDisabled' | 'isWeekDisabled' | 'isMonthDisabled' | 'isYearDisabled'>, Pick<RangePickerTriggerProps, 'className' | 'clearable' | 'disabled' | 'error' | 'fullWidth' | 'inputFromPlaceholder' | 'inputFromProps' | 'inputToPlaceholder' | 'inputToProps' | 'prefix' | 'readOnly' | 'required' | 'size'> {
     /**
      * Default value for date range picker.
      */

package/DateRangePicker/DateRangePicker.js

@@ -18,7 +18,7 @@ import { FormControlContext } from '../Form/FormControlContext.js';
 const DateRangePicker = forwardRef(function DateRangePicker(props, ref) {
     const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
     const { defaultDateFormat, getNow, isBetween, } = useCalendarContext();
-    const { calendarProps, className, clearable = true, defaultValue, disabled = disabledFromFormControl || false, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultDateFormat, fullWidth = fullWidthFromFormControl || false, inputFromPlaceholder, inputFromProps, inputToPlaceholder, inputToProps, isDateDisabled, isMonthDisabled, isYearDisabled, mode = 'day', onCalendarToggle: onCalendarToggleProp, onChange: onChangeProp, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl || false, size, value: valueProp, } = props;
+    const { calendarProps, className, clearable = true, defaultValue, disabledMonthSwitch = false, disableOnNext, disableOnPrev, disabledYearSwitch = false, disabled = disabledFromFormControl || false, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultDateFormat, fullWidth = fullWidthFromFormControl || false, inputFromPlaceholder, inputFromProps, inputToPlaceholder, inputToProps, isDateDisabled, isWeekDisabled, isMonthDisabled, isYearDisabled, mode = 'day', onCalendarToggle: onCalendarToggleProp, onChange: onChangeProp, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl || false, size, value: valueProp, } = props;
     const { onBlur: onFromBlurProp, onKeyDown: onFromKeyDownProp, onFocus: onFromFocusProp, ...restInputFromProps } = inputFromProps || {};
     const { onBlur: onToBlurProp, onKeyDown: onToKeyDownProp, onFocus: onToFocusProp, ...restInputToProps } = inputToProps || {};
     const formats = useMemo(() => [
@@ -182,7 +182,7 @@ const DateRangePicker = forwardRef(function DateRangePicker(props, ref) {
         onCalendarToggle(!open);
     };
     const suffixActionIcon = (jsx(Icon, { icon: CalendarIcon, onClick: onIconClick }));
-    return (jsxs(Fragment, { children: [jsx(RangePickerTrigger, { ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputFromPlaceholder: inputFromPlaceholder, inputFromProps: resolvedInputFromProps, inputFromRef: inputFromRef, inputFromValue: inputFromValue, inputToPlaceholder: inputToPlaceholder, inputToProps: resolvedInputToProps, inputToRef: inputToRef, inputToValue: inputToValue, onClear: onClear, onInputFromChange: onInputFromChange, onInputToChange: onInputToChange, prefix: prefix, readOnly: readOnly, required: required, size: size, suffixActionIcon: suffixActionIcon }), jsx(DateRangePickerCalendar, { ref: calendarRef, open: open, anchor: anchorRef, calendarProps: calendarProps, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, isDateDisabled: isDateDisabled, isDateInRange: getIsInRangeHandler('date'), isMonthDisabled: isMonthDisabled, isMonthInRange: getIsInRangeHandler('month'), isWeekInRange: getIsInRangeHandler('week'), isYearDisabled: isYearDisabled, isYearInRange: getIsInRangeHandler('year'), mode: mode, onChange: onCalendarChangeWithCloseControl, onDateHover: onCalendarHover, onWeekHover: onCalendarHover, onMonthHover: onCalendarHover, onYearHover: onCalendarHover, popperProps: popperProps, referenceDate: referenceDate, value: calendarValue })] }));
+    return (jsxs(Fragment, { children: [jsx(RangePickerTrigger, { ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputFromPlaceholder: inputFromPlaceholder, inputFromProps: resolvedInputFromProps, inputFromRef: inputFromRef, inputFromValue: inputFromValue, inputToPlaceholder: inputToPlaceholder, inputToProps: resolvedInputToProps, inputToRef: inputToRef, inputToValue: inputToValue, onClear: onClear, onInputFromChange: onInputFromChange, onInputToChange: onInputToChange, prefix: prefix, readOnly: readOnly, required: required, size: size, suffixActionIcon: suffixActionIcon }), jsx(DateRangePickerCalendar, { ref: calendarRef, open: open, anchor: anchorRef, calendarProps: calendarProps, disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, isDateDisabled: isDateDisabled, isDateInRange: getIsInRangeHandler('date'), isMonthDisabled: isMonthDisabled, isMonthInRange: getIsInRangeHandler('month'), isWeekDisabled: isWeekDisabled, isWeekInRange: getIsInRangeHandler('week'), isYearDisabled: isYearDisabled, isYearInRange: getIsInRangeHandler('year'), mode: mode, onChange: onCalendarChangeWithCloseControl, onDateHover: onCalendarHover, onWeekHover: onCalendarHover, onMonthHover: onCalendarHover, onYearHover: onCalendarHover, popperProps: popperProps, referenceDate: referenceDate, value: calendarValue })] }));
 });
 var DateRangePicker$1 = DateRangePicker;
 

package/DateRangePicker/DateRangePickerCalendar.d.ts

@@ -1,7 +1,7 @@
 import { RefObject } from 'react';
 import { CalendarProps } from '../Calendar';
 import { InputTriggerPopperProps } from '../_internal/InputTriggerPopper';
-export interface DateRangePickerCalendarProps extends Pick<InputTriggerPopperProps, 'anchor' | 'fadeProps' | 'open'>, Pick<CalendarProps, 'value' | 'onChange' | 'displayMonthLocale' | 'mode' | 'isDateInRange' | 'isDateDisabled' | 'isMonthDisabled' | 'isMonthInRange' | 'isWeekInRange' | 'isYearDisabled' | 'isYearInRange' | 'onDateHover' | 'onWeekHover' | 'onMonthHover' | 'onYearHover' | 'referenceDate'> {
+export interface DateRangePickerCalendarProps extends Pick<InputTriggerPopperProps, 'anchor' | 'fadeProps' | 'open'>, Pick<CalendarProps, 'value' | 'onChange' | 'disabledMonthSwitch' | 'disabledYearSwitch' | 'disableOnNext' | 'disableOnPrev' | 'displayMonthLocale' | 'mode' | 'isDateInRange' | 'isDateDisabled' | 'isMonthDisabled' | 'isMonthInRange' | 'isWeekDisabled' | 'isWeekInRange' | 'isYearDisabled' | 'isYearInRange' | 'onDateHover' | 'onWeekHover' | 'onMonthHover' | 'onYearHover' | 'referenceDate'> {
     /**
      * Other props you may pass to calendar component.
      */

package/DateRangePicker/DateRangePickerCalendar.js

@@ -12,7 +12,7 @@ import cx from 'clsx';
  */
 const DateRangePickerCalendar = forwardRef(function DateRangePickerCalendar(props, ref) {
     const { displayMonthLocale: displayMonthLocaleFromConfig, getMonth, getYear, setMonth, setYear, } = useCalendarContext();
-    const { anchor, calendarProps, displayMonthLocale = displayMonthLocaleFromConfig, fadeProps, firstCalendarRef, isDateDisabled, isDateInRange, isMonthDisabled, isMonthInRange, isWeekInRange, isYearDisabled, isYearInRange, mode = 'day', onChange: onChangeProp, onDateHover, onMonthHover, onWeekHover, onYearHover, open, popperProps, referenceDate: referenceDateProp, secondCalendarRef, value, } = props;
+    const { anchor, calendarProps, disabledMonthSwitch, disableOnNext, disableOnPrev, disabledYearSwitch, displayMonthLocale = displayMonthLocaleFromConfig, fadeProps, firstCalendarRef, isDateDisabled, isDateInRange, isMonthDisabled, isMonthInRange, isWeekDisabled, isWeekInRange, isYearDisabled, isYearInRange, mode = 'day', onChange: onChangeProp, onDateHover, onMonthHover, onWeekHover, onYearHover, open, popperProps, referenceDate: referenceDateProp, secondCalendarRef, value, } = props;
     const { className, ...restCalendarProps } = calendarProps || {};
     const { currentMode, onMonthControlClick: onMonthControlClickFromHook, onFirstNext, onFirstPrev, onSecondNext, onSecondPrev, onYearControlClick: onYearControlClickFromHook, popModeStack, referenceDates, updateFirstReferenceDate, updateSecondReferenceDate, } = useDateRangeCalendarControls(referenceDateProp, mode);
     const onChangeFactory = useCallback((calendar) => {
@@ -89,9 +89,9 @@ const DateRangePickerCalendar = forwardRef(function DateRangePickerCalendar(prop
     const isSettingSecondCalendar = currentMode !== mode && !controlPanelOnLeft;
     return (jsx(InputTriggerPopper, { ...popperProps, ref: ref, anchor: anchor, open: open, fadeProps: fadeProps, children: jsxs("div", { className: dateRangePickerClasses.calendarGroup, children: [jsx(Calendar, { ...restCalendarProps, className: cx(dateRangePickerClasses.calendar, {
                         [dateRangePickerClasses.calendarInactive]: isSettingSecondCalendar,
-                    }, className), displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isDateInRange: isDateInRange, isMonthDisabled: isMonthDisabled, isMonthInRange: isMonthInRange, isWeekInRange: isWeekInRange, isYearDisabled: isYearDisabled, isYearInRange: isYearInRange, mode: controlPanelOnLeft ? currentMode : mode, onChange: onChangeFactory(0), onDateHover: currentMode === mode ? onDateHover : undefined, onMonthHover: currentMode === mode ? onMonthHover : undefined, onWeekHover: currentMode === mode ? onWeekHover : undefined, onYearHover: currentMode === mode ? onYearHover : undefined, onMonthControlClick: onMonthControlClickFactory(0), onNext: isSettingFirstCalendar ? onFirstNext : undefined, onPrev: onFirstPrev, onYearControlClick: onYearControlClickFactory(0), ref: firstCalendarRef, referenceDate: referenceDates[0], value: isSettingFirstCalendar ? referenceDates[0] : value }), jsx(Calendar, { ...restCalendarProps, className: cx(dateRangePickerClasses.calendar, {
+                    }, className), disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isDateInRange: isDateInRange, isMonthDisabled: isMonthDisabled, isMonthInRange: isMonthInRange, isWeekDisabled: isWeekDisabled, isWeekInRange: isWeekInRange, isYearDisabled: isYearDisabled, isYearInRange: isYearInRange, mode: controlPanelOnLeft ? currentMode : mode, onChange: onChangeFactory(0), onDateHover: currentMode === mode ? onDateHover : undefined, onMonthHover: currentMode === mode ? onMonthHover : undefined, onWeekHover: currentMode === mode ? onWeekHover : undefined, onYearHover: currentMode === mode ? onYearHover : undefined, onMonthControlClick: onMonthControlClickFactory(0), onNext: isSettingFirstCalendar ? onFirstNext : undefined, onPrev: onFirstPrev, onYearControlClick: onYearControlClickFactory(0), ref: firstCalendarRef, referenceDate: referenceDates[0], value: isSettingFirstCalendar ? referenceDates[0] : value }), jsx(Calendar, { ...restCalendarProps, className: cx(dateRangePickerClasses.calendar, {
                         [dateRangePickerClasses.calendarInactive]: isSettingFirstCalendar,
-                    }, className), displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isDateInRange: isDateInRange, isMonthDisabled: isMonthDisabled, isMonthInRange: isMonthInRange, isWeekInRange: isWeekInRange, isYearDisabled: isYearDisabled, isYearInRange: isYearInRange, mode: !controlPanelOnLeft ? currentMode : mode, onChange: onChangeFactory(1), onDateHover: currentMode === mode ? onDateHover : undefined, onMonthHover: currentMode === mode ? onMonthHover : undefined, onWeekHover: currentMode === mode ? onWeekHover : undefined, onYearHover: currentMode === mode ? onYearHover : undefined, onMonthControlClick: onMonthControlClickFactory(1), onNext: onSecondNext, onPrev: isSettingSecondCalendar ? onSecondPrev : undefined, onYearControlClick: onYearControlClickFactory(1), ref: secondCalendarRef, referenceDate: referenceDates[1], value: isSettingSecondCalendar ? referenceDates[1] : value })] }) }));
+                    }, className), disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isDateInRange: isDateInRange, isMonthDisabled: isMonthDisabled, isMonthInRange: isMonthInRange, isWeekDisabled: isWeekDisabled, isWeekInRange: isWeekInRange, isYearDisabled: isYearDisabled, isYearInRange: isYearInRange, mode: !controlPanelOnLeft ? currentMode : mode, onChange: onChangeFactory(1), onDateHover: currentMode === mode ? onDateHover : undefined, onMonthHover: currentMode === mode ? onMonthHover : undefined, onWeekHover: currentMode === mode ? onWeekHover : undefined, onYearHover: currentMode === mode ? onYearHover : undefined, onMonthControlClick: onMonthControlClickFactory(1), onNext: onSecondNext, onPrev: isSettingSecondCalendar ? onSecondPrev : undefined, onYearControlClick: onYearControlClickFactory(1), ref: secondCalendarRef, referenceDate: referenceDates[1], value: isSettingSecondCalendar ? referenceDates[1] : value })] }) }));
 });
 var DateRangePickerCalendar$1 = DateRangePickerCalendar;
 

package/DateTimePicker/DateTimePicker.js

@@ -18,7 +18,7 @@ const DateTimePicker = forwardRef(function DateTimePicker(props, ref) {
     const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
     const { defaultDateFormat, defaultTimeFormat, getNow, startOf, } = useCalendarContext();
     const defaultFormat = `${defaultDateFormat} ${defaultTimeFormat}`;
-    const { calendarProps, className, clearable = true, confirmText, defaultValue, disableOnNext, disableOnPrev, disabled = disabledFromFormControl, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultFormat, fullWidth = fullWidthFromFormControl, hideHour, hideMinute, hideSecond, hourPrefix, hourStep, inputProps, isDateDisabled, isMonthDisabled, isYearDisabled, minutePrefix, minuteStep, onChange: onChangeProp, onPanelToggle: onPanelToggleProp, placeholder, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl, secondPrefix, secondStep, size: sizeProp, value: valueProp, } = props;
+    const { calendarProps, className, clearable = true, confirmText, defaultValue, disabledMonthSwitch = false, disableOnNext, disableOnPrev, disabledYearSwitch = false, disabled = disabledFromFormControl, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultFormat, fullWidth = fullWidthFromFormControl, hideHour, hideMinute, hideSecond, hourPrefix, hourStep, inputProps, isDateDisabled, isMonthDisabled, isWeekDisabled, isYearDisabled, minutePrefix, minuteStep, onChange: onChangeProp, onPanelToggle: onPanelToggleProp, placeholder, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl, secondPrefix, secondStep, size: sizeProp, value: valueProp, } = props;
     const { onBlur: onBlurProp, onKeyDown: onKeyDownProp, onFocus: onFocusProp, size: inputSize = format.length + 2, ...restInputProp } = inputProps || {};
     const formats = useMemo(() => [format, defaultFormat], [defaultFormat, format]);
     /** Panel open control */
@@ -115,7 +115,7 @@ const DateTimePicker = forwardRef(function DateTimePicker(props, ref) {
         onPanelToggle(!open);
     };
     const suffixActionIcon = (jsx(Icon, { icon: ClockIcon, onClick: onIconClick }));
-    return (jsxs(Fragment, { children: [jsx(PickerTrigger, { ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputProps: resolvedInputProps, inputRef: inputRef, onChange: onInputChange, onClear: onClear, placeholder: placeholder, prefix: prefix, readOnly: readOnly, required: required, size: sizeProp, suffixActionIcon: suffixActionIcon, value: inputValue }), jsx(DateTimePickerPanel, { ref: panelRef, anchor: anchorRef, calendarProps: calendarProps, confirmText: confirmText, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, hideHour: hideHour, hideMinute: hideMinute, hideSecond: hideSecond, hourPrefix: hourPrefix, hourStep: hourStep, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isYearDisabled: isYearDisabled, minutePrefix: minutePrefix, minuteStep: minuteStep, onChange: onChange, onConfirm: onConfirm, open: open, popperProps: popperProps, referenceDate: referenceDate, secondPrefix: secondPrefix, secondStep: secondStep, value: internalValue })] }));
+    return (jsxs(Fragment, { children: [jsx(PickerTrigger, { ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputProps: resolvedInputProps, inputRef: inputRef, onChange: onInputChange, onClear: onClear, placeholder: placeholder, prefix: prefix, readOnly: readOnly, required: required, size: sizeProp, suffixActionIcon: suffixActionIcon, value: inputValue }), jsx(DateTimePickerPanel, { ref: panelRef, anchor: anchorRef, calendarProps: calendarProps, confirmText: confirmText, disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, hideHour: hideHour, hideMinute: hideMinute, hideSecond: hideSecond, hourPrefix: hourPrefix, hourStep: hourStep, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isWeekDisabled: isWeekDisabled, isYearDisabled: isYearDisabled, minutePrefix: minutePrefix, minuteStep: minuteStep, onChange: onChange, onConfirm: onConfirm, open: open, popperProps: popperProps, referenceDate: referenceDate, secondPrefix: secondPrefix, secondStep: secondStep, value: internalValue })] }));
 });
 var DateTimePicker$1 = DateTimePicker;
 

package/DateTimePicker/DateTimePickerPanel.d.ts

@@ -4,11 +4,11 @@ import { TimePanelProps } from '../TimePanel';
 import { CalendarProps } from '../Calendar';
 import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
 import { InputTriggerPopperProps } from '../_internal/InputTriggerPopper';
-export interface DateTimePickerPanelProps extends Omit<TimePanelProps, Exclude<keyof NativeElementPropsWithoutKeyAndRef<'div'>, 'className' | 'style' | 'id'> | 'withoutAction' | 'onChange' | 'value' | 'withoutAction'>, Pick<InputTriggerPopperProps, 'anchor' | 'fadeProps' | 'open'>, Pick<CalendarProps, 'disableOnNext' | 'disableOnPrev' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isYearDisabled' | 'onChange' | 'referenceDate'> {
+export interface DateTimePickerPanelProps extends Omit<TimePanelProps, Exclude<keyof NativeElementPropsWithoutKeyAndRef<'div'>, 'className' | 'style' | 'id'> | 'withoutAction' | 'onChange' | 'value' | 'withoutAction'>, Pick<InputTriggerPopperProps, 'anchor' | 'fadeProps' | 'open'>, Pick<CalendarProps, 'disabledMonthSwitch' | 'disableOnNext' | 'disableOnPrev' | 'disabledYearSwitch' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isWeekDisabled' | 'isYearDisabled' | 'onChange' | 'referenceDate'> {
     /**
      * Other calendar props you may provide to `Calendar`.
      */
-    calendarProps?: Omit<CalendarProps, 'disableOnNext' | 'disableOnPrev' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isYearDisabled' | 'locale' | 'mode' | 'onChange' | 'onMonthControlClick' | 'onNext' | 'onPrev' | 'onYearControlClick' | 'referenceDate' | 'updateReferenceDate' | 'value'>;
+    calendarProps?: Omit<CalendarProps, 'disabledMonthSwitch' | 'disableOnNext' | 'disableOnPrev' | 'disabledYearSwitch' | 'displayMonthLocale' | 'isDateDisabled' | 'isMonthDisabled' | 'isYearDisabled' | 'locale' | 'mode' | 'onChange' | 'onMonthControlClick' | 'onNext' | 'onPrev' | 'onYearControlClick' | 'referenceDate' | 'updateReferenceDate' | 'value'>;
     /**
      * Change Handler. Receive `DateType` as props.
      */

package/DateTimePicker/DateTimePickerPanel.js

@@ -14,7 +14,7 @@ import cx from 'clsx';
  */
 const DateTimePickerPanel = forwardRef(function TimePickerPanel(props, ref) {
     const { displayMonthLocale: displayMonthLocaleFromConfig, getMonth, getYear, setMonth, setYear, setHour, setMinute, setSecond, getHour, getMinute, getSecond, } = useCalendarContext();
-    const { anchor, calendarProps, className, confirmText, disableOnNext, disableOnPrev, displayMonthLocale = displayMonthLocaleFromConfig, fadeProps, hideHour, hideMinute, hideSecond, hourPrefix, hourStep, isDateDisabled, isMonthDisabled, isYearDisabled, minutePrefix, minuteStep, onChange: onChangeProp, onConfirm, open, popperProps, referenceDate: referenceDateProp, secondPrefix, secondStep, value, ...restHostProps } = props;
+    const { anchor, calendarProps, className, confirmText, disabledMonthSwitch, disableOnNext, disableOnPrev, disabledYearSwitch, displayMonthLocale = displayMonthLocaleFromConfig, fadeProps, hideHour, hideMinute, hideSecond, hourPrefix, hourStep, isDateDisabled, isMonthDisabled, isWeekDisabled, isYearDisabled, minutePrefix, minuteStep, onChange: onChangeProp, onConfirm, open, popperProps, referenceDate: referenceDateProp, secondPrefix, secondStep, value, ...restHostProps } = props;
     const mode = 'day';
     const { currentMode, onMonthControlClick, onNext, onPrev, onYearControlClick, popModeStack, referenceDate, updateReferenceDate, } = useCalendarControls(referenceDateProp, mode);
     const onCalendarChange = (target) => {
@@ -43,7 +43,7 @@ const DateTimePickerPanel = forwardRef(function TimePickerPanel(props, ref) {
             onChangeProp(result);
         }
     };
-    return (jsx(InputTriggerPopper, { ...popperProps, ref: ref, anchor: anchor, open: open, fadeProps: fadeProps, children: jsxs("div", { ...restHostProps, className: cx(dateTimePickerClasses.panel, className), children: [jsxs("div", { className: dateTimePickerClasses.panelSelectors, children: [jsx(Calendar, { ...calendarProps, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isYearDisabled: isYearDisabled, mode: currentMode, onChange: onCalendarChange, onMonthControlClick: onMonthControlClick, onNext: onNext, onPrev: onPrev, onYearControlClick: onYearControlClick, referenceDate: referenceDate, value: value, className: dateTimePickerClasses.panelCalendar }), jsx(TimePanel, { hideHour: hideHour, hourStep: hourStep, hideMinute: hideMinute, minuteStep: minuteStep, hideSecond: hideSecond, secondStep: secondStep, hourPrefix: hourPrefix, minutePrefix: minutePrefix, secondPrefix: secondPrefix, onChange: onTimePanelChange, value: value, withoutAction: true })] }), jsx(TimePanelAction, { onConfirm: onConfirm, confirmText: confirmText })] }) }));
+    return (jsx(InputTriggerPopper, { ...popperProps, ref: ref, anchor: anchor, open: open, fadeProps: fadeProps, children: jsxs("div", { ...restHostProps, className: cx(dateTimePickerClasses.panel, className), children: [jsxs("div", { className: dateTimePickerClasses.panelSelectors, children: [jsx(Calendar, { ...calendarProps, disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isWeekDisabled: isWeekDisabled, isYearDisabled: isYearDisabled, mode: currentMode, onChange: onCalendarChange, onMonthControlClick: onMonthControlClick, onNext: onNext, onPrev: onPrev, onYearControlClick: onYearControlClick, referenceDate: referenceDate, value: value, className: dateTimePickerClasses.panelCalendar }), jsx(TimePanel, { hideHour: hideHour, hourStep: hourStep, hideMinute: hideMinute, minuteStep: minuteStep, hideSecond: hideSecond, secondStep: secondStep, hourPrefix: hourPrefix, minutePrefix: minutePrefix, secondPrefix: secondPrefix, onChange: onTimePanelChange, value: value, withoutAction: true })] }), jsx(TimePanelAction, { onConfirm: onConfirm, confirmText: confirmText })] }) }));
 });
 var DateTimePickerPanel$1 = DateTimePickerPanel;
 

package/Portal/Portal.js

@@ -7,12 +7,15 @@ const Portal = (props) => {
     const { children, container, disablePortal = false, } = props;
     const [portalElement, setPortalElement] = useState(() => (disablePortal
         ? null
-        : getElement(container) || document.body));
+        : getElement(container)));
     useEffect(() => {
         if (!disablePortal) {
             setPortalElement(getElement(container) || document.body);
         }
     }, [container, disablePortal]);
+    /** This element is fully client side, so `return null` on server side */
+    if (typeof window === 'undefined')
+        return null;
     if (disablePortal || !portalElement) {
         return jsx(Fragment, { children: children });
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mezzanine-ui/react",
-  "version": "0.14.0",
+  "version": "0.14.2",
   "description": "React components for mezzanine-ui",
   "author": "Mezzanine",
   "repository": {
@@ -28,9 +28,9 @@
     "react-dom": "^18.2.0"
   },
   "dependencies": {
-    "@mezzanine-ui/core": "^0.14.0",
-    "@mezzanine-ui/icons": "^0.14.0",
-    "@mezzanine-ui/system": "^0.14.0",
+    "@mezzanine-ui/core": "^0.14.2",
+    "@mezzanine-ui/icons": "^0.14.2",
+    "@mezzanine-ui/system": "^0.14.2",
     "@popperjs/core": "^2.11.6",
     "@types/react-transition-group": "^4.4.8",
     "clsx": "^2.0.0",