How to use the office-ui-fabric-react/lib/utilities/dateMath/DateMath.compareDatePart function in office-ui-fabric-react

private _findAvailableDate(initialDate: Date, targetDate: Date, direction: number): Date | undefined {
    // if the target date is available, return it immediately
    if (!this._getIsRestrictedDate(targetDate)) {
      return targetDate;
    }

    while (
      compareDatePart(initialDate, targetDate) !== 0 &&
      this._getIsRestrictedDate(targetDate) &&
      !this._getIsAfterMaxDate(targetDate) &&
      !this._getIsBeforeMinDate(targetDate)
    ) {
      targetDate = addDays(targetDate, direction);
    }

    if (compareDatePart(initialDate, targetDate) !== 0 && !this._getIsRestrictedDate(targetDate)) {
      return targetDate;
    }

    return undefined;
  }

let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays);
    if (dateRangeType !== DateRangeType.Day) {
      dateRange = this._getBoundedDateRange(dateRange, minDate, maxDate);
    }
    dateRange = dateRange.filter(d => {
      return !this._getIsRestrictedDate(d);
    });

    if (onSelectDate) {
      onSelectDate(selectedDate, dateRange);
    }

    // Navigate to next or previous month if needed
    if (autoNavigateOnSelection && selectedDate.getMonth() !== navigatedDate.getMonth()) {
      const compareResult = compareDatePart(selectedDate, navigatedDate);
      if (compareResult < 0) {
        this._onSelectPrevMonth();
      } else if (compareResult > 0) {
        this._onSelectNextMonth();
      }
    }
  };

onHeaderSelect={this._onYearPickerHeaderSelect}
          selectedYear={currentSelectedDate}
          onRenderYear={this._onRenderYear}
          strings={{
            rangeAriaLabel: this._yearRangeToString
          }}
          ref={this._onCalendarYearRef}
        />
      );
    }

    const leftNavigationIcon = navigationIcons.leftNavigation;
    const rightNavigationIcon = navigationIcons.rightNavigation;

    // determine if previous/next years are in bounds
    const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;
    const isNextYearInBounds = maxDate ? compareDatePart(getYearEnd(navigatedDate), maxDate) < 0 : true;

    return (
      <div>
        <div>
          {this.props.onHeaderSelect || !yearPickerHidden ? (
            <div tabindex="{0}" role="button" aria-label="{dateTimeFormatter.formatYear(navigatedDate)}">
              {dateTimeFormatter.formatYear(navigatedDate)}
            </div></div></div>

private renderMonthNavigationButtons = (classNames: IProcessedStyleSet, dayPickerId: string): JSX.Element => {
    const { minDate, maxDate, navigatedDate, allFocusable, strings, navigationIcons, showCloseButton } = this.props;
    const leftNavigationIcon = navigationIcons.leftNavigation;
    const rightNavigationIcon = navigationIcons.rightNavigation;
    const closeNavigationIcon = navigationIcons.closeIcon;

    // determine if previous/next months are in bounds
    const prevMonthInBounds = minDate ? compareDatePart(minDate, getMonthStart(navigatedDate)) < 0 : true;
    const nextMonthInBounds = maxDate ? compareDatePart(getMonthEnd(navigatedDate), maxDate) < 0 : true;

    return (
      <div>
        </div>

private _getIsAfterMaxDate(date: Date): boolean {
    const { maxDate } = this.props;
    return maxDate ? compareDatePart(date, maxDate) >= 1 : false;
  }

private _isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {
    return (!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0);
  }

private _isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {
    return (!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0);
  }