@nectary/components 2.12.0 → 2.12.2

package/lib/cjs/date-picker/index.js

@@ -0,0 +1,383 @@
+"use strict";
+
+require('../icon-button');
+require('../icon');
+require('../text');
+var _utils = require('../utils');
+var _utils2 = require('./utils');
+const templateHTML = '<style>:host{display:block;outline:0}#content{width:fit-content;box-sizing:border-box;padding:16px;display:flex;flex-direction:column;gap:8px}#month{display:flex;flex-direction:column;row-gap:8px}.week{display:flex;flex-direction:row;column-gap:8px}.week.empty{display:none}.day{all:initial;font:var(--sinch-comp-date-picker-font-day);width:24px;height:24px;line-height:22px;color:var(--sinch-comp-date-picker-day-color-default-text-initial);background-color:var(--sinch-comp-date-picker-day-color-default-background-initial);border:1px solid var(--sinch-comp-date-picker-day-color-default-border-initial);border-radius:var(--sinch-comp-date-picker-day-shape-radius);text-align:center;box-sizing:border-box;user-select:none;cursor:pointer}.day:focus-visible{outline:1px solid var(--sinch-comp-date-picker-day-color-default-outline-focus);outline-offset:1px}.day:disabled{cursor:initial;color:var(--sinch-comp-date-picker-day-color-disabled-text-initial)}.day:enabled:hover{background-color:var(--sinch-comp-date-picker-day-color-default-background-hover)}.day:enabled.range{background-color:var(--sinch-comp-date-picker-day-color-default-range-background)}.day:enabled.selected{color:var(--sinch-comp-date-picker-day-color-checked-text-initial);background-color:var(--sinch-comp-date-picker-day-color-checked-background-initial);border-color:var(--sinch-comp-date-picker-day-color-checked-border-initial)}.day.today{font:var(--sinch-comp-date-picker-font-today);color:var(--sinch-comp-date-picker-today-color-default-text-initial);background-color:var(--sinch-comp-date-picker-today-color-default-background-initial);border-color:var(--sinch-comp-date-picker-today-color-default-border-initial)}.day.today:hover{background-color:var(--sinch-comp-date-picker-today-color-default-background-hover)}.day.today:disabled{color:var(--sinch-comp-date-picker-today-color-disabled-text-initial);border-color:var(--sinch-comp-date-picker-today-color-disabled-border-initial)}.day.today.selected{color:var(--sinch-comp-date-picker-today-color-checked-text-initial);background-color:var(--sinch-comp-date-picker-today-color-checked-background-initial);border-color:var(--sinch-comp-date-picker-today-color-checked-border-initial)}#week-day-names{display:flex;flex-direction:row;gap:8px;height:24px}.week-day-name{font:var(--sinch-comp-date-picker-font-weekday);color:var(--sinch-comp-date-picker-weekday-color-default-text-initial);text-align:center;width:24px;height:24px;line-height:24px;user-select:none;text-transform:uppercase}#content-header{display:flex;flex-direction:row;height:32px;align-items:center}#date{flex:1;text-align:center;text-transform:capitalize;--sinch-com-text-font:var(--sinch-comp-date-picker-font-header);--sinch-global-color-text:var(--sinch-comp-date-picker-header-color-default-text-initial)}#prev-year{margin-left:-4px}#next-year{margin-right:-4px}</style><div id="content"><div id="content-header"><sinch-icon-button id="prev-year" size="s"><sinch-icon id="icon-prev-year" slot="icon" name="keyboard_double_arrow_left"></sinch-icon></sinch-icon-button><sinch-icon-button id="prev-month" size="s"><sinch-icon id="icon-prev-month" slot="icon" name="keyboard_arrow_left"></sinch-icon></sinch-icon-button><sinch-text id="date" type="m" emphasized aria-live="polite"></sinch-text><sinch-icon-button id="next-month" size="s"><sinch-icon id="icon-next-month" slot="icon" name="keyboard_arrow_right"></sinch-icon></sinch-icon-button><sinch-icon-button id="next-year" size="s"><sinch-icon id="icon-next-year" slot="icon" name="keyboard_double_arrow_right"></sinch-icon></sinch-icon-button></div><div id="week-day-names"><div class="week-day-name"></div><div class="week-day-name"></div><div class="week-day-name"></div><div class="week-day-name"></div><div class="week-day-name"></div><div class="week-day-name"></div><div class="week-day-name"></div></div><div id="month"><div class="week"><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button></div><div class="week"><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button></div><div class="week"><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button></div><div class="week"><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button></div><div class="week"><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button></div><div class="week"><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button><button class="day"></button></div></div></div>';
+const template = document.createElement('template');
+template.innerHTML = templateHTML;
+(0, _utils.defineCustomElement)('sinch-date-picker', class extends _utils.NectaryElement {
+  #$month;
+  #$weeks;
+  #$days;
+  #$weekDayNames;
+  #uiDate = null;
+  #date1 = null;
+  #date2 = null;
+  #minDate = null;
+  #maxDate = null;
+  #$prevMonth;
+  #$nextMonth;
+  #$prevYear;
+  #$nextYear;
+  #$date;
+  #monthNames;
+  #controller = null;
+  #isHoverSubscribed = false;
+  constructor() {
+    super();
+    const shadowRoot = this.attachShadow();
+    shadowRoot.appendChild(template.content.cloneNode(true));
+    this.#$prevMonth = shadowRoot.querySelector('#prev-month');
+    this.#$nextMonth = shadowRoot.querySelector('#next-month');
+    this.#$prevYear = shadowRoot.querySelector('#prev-year');
+    this.#$nextYear = shadowRoot.querySelector('#next-year');
+    this.#$date = shadowRoot.querySelector('#date');
+    this.#$month = shadowRoot.querySelector('#month');
+    this.#$days = [];
+    this.#$weeks = [];
+    this.#monthNames = [];
+    shadowRoot.querySelectorAll('.week').forEach((week, i) => {
+      this.#$weeks.push(week);
+      this.#$days[i] = [];
+      week.querySelectorAll('.day').forEach(day => {
+        this.#$days[i].push(day);
+      });
+    });
+    this.#$weekDayNames = Array.from(shadowRoot.querySelectorAll('#week-day-names > .week-day-name'));
+  }
+  connectedCallback() {
+    this.#controller = new AbortController();
+    const options = {
+      signal: this.#controller.signal
+    };
+    this.#$prevMonth.addEventListener('click', this.#onPrevMonthClick, options);
+    this.#$nextMonth.addEventListener('click', this.#onNextMonthClick, options);
+    this.#$prevYear.addEventListener('click', this.#onPrevYearClick, options);
+    this.#$nextYear.addEventListener('click', this.#onNextYearClick, options);
+    this.#$month.addEventListener('click', this.#onDateClick, options);
+    this.addEventListener('-change', this.#onChangeReactHandler, options);
+  }
+  disconnectedCallback() {
+    this.#unsubscribeRangeHover();
+    this.#controller.abort();
+    this.#controller = null;
+  }
+  static get observedAttributes() {
+    return ['value', 'min', 'max', 'locale', 'range', 'prev-year-aria-label', 'next-year-aria-label', 'prev-month-aria-label', 'next-month-aria-label'];
+  }
+  attributeChangedCallback(name, prevValue, newVal) {
+    switch (name) {
+      case 'value':
+        {
+          this.#onValueChange();
+          break;
+        }
+      case 'min':
+        {
+          this.#minDate = (0, _utils2.isoToDate)(newVal);
+          if (this.#uiDate !== null) {
+            (0, _utils2.clampMinDate)(this.#uiDate, this.#minDate);
+          }
+          this.#render();
+          break;
+        }
+      case 'max':
+        {
+          this.#maxDate = (0, _utils2.isoToDate)(newVal);
+          if (this.#uiDate !== null) {
+            (0, _utils2.clampMaxDate)(this.#uiDate, this.#maxDate);
+          }
+          this.#render();
+          break;
+        }
+      case 'locale':
+        {
+          const names = (0, _utils2.getDayNames)(newVal);
+          this.#$weekDayNames.forEach(($day, i) => {
+            $day.textContent = names[i];
+          });
+          this.#monthNames = (0, _utils2.getMonthNames)(newVal);
+          this.#render();
+          break;
+        }
+      case 'range':
+        {
+          const isRange = (0, _utils.isAttrTrue)(newVal);
+          if (isRange) {
+            this.#onValueChange();
+          } else {
+            this.#unsubscribeRangeHover();
+          }
+          break;
+        }
+      case 'prev-year-aria-label':
+        {
+          (0, _utils.updateAttribute)(this.#$prevYear, 'aria-label', newVal);
+          break;
+        }
+      case 'next-year-aria-label':
+        {
+          (0, _utils.updateAttribute)(this.#$nextYear, 'aria-label', newVal);
+          break;
+        }
+      case 'prev-month-aria-label':
+        {
+          (0, _utils.updateAttribute)(this.#$prevMonth, 'aria-label', newVal);
+          break;
+        }
+      case 'next-month-aria-label':
+        {
+          (0, _utils.updateAttribute)(this.#$nextMonth, 'aria-label', newVal);
+          break;
+        }
+    }
+  }
+  set locale(value) {
+    (0, _utils.updateAttribute)(this, 'locale', value);
+  }
+  get locale() {
+    return (0, _utils.getAttribute)(this, 'locale', '');
+  }
+  set value(value) {
+    (0, _utils.updateAttribute)(this, 'value', value);
+  }
+  get value() {
+    return (0, _utils.getAttribute)(this, 'value', '');
+  }
+  set min(value) {
+    (0, _utils.updateAttribute)(this, 'min', value);
+  }
+  get min() {
+    return (0, _utils.getAttribute)(this, 'min', '');
+  }
+  set max(value) {
+    (0, _utils.updateAttribute)(this, 'max', value);
+  }
+  get max() {
+    return (0, _utils.getAttribute)(this, 'max', '');
+  }
+  set range(isRanged) {
+    (0, _utils.updateBooleanAttribute)(this, 'range', isRanged);
+  }
+  get range() {
+    return (0, _utils.getBooleanAttribute)(this, 'range');
+  }
+  set prevMonthAriaLabel(value) {
+    (0, _utils.updateAttribute)(this, 'prev-month-aria-label', value);
+  }
+  get prevMonthAriaLabel() {
+    return (0, _utils.getAttribute)(this, 'prev-month-aria-label', '');
+  }
+  set nextMonthAriaLabel(value) {
+    (0, _utils.updateAttribute)(this, 'next-month-aria-label', value);
+  }
+  get nextMonthAriaLabel() {
+    return (0, _utils.getAttribute)(this, 'next-month-aria-label', '');
+  }
+  get prevYearButtonRect() {
+    return (0, _utils.getRect)(this.#$prevYear);
+  }
+  get nextYearButtonRect() {
+    return (0, _utils.getRect)(this.#$nextYear);
+  }
+  get prevMonthButtonRect() {
+    return (0, _utils.getRect)(this.#$prevMonth);
+  }
+  get nextMonthButtonRect() {
+    return (0, _utils.getRect)(this.#$nextMonth);
+  }
+  nthButtonRect(index) {
+    if (index < 0 || index > 30) {
+      return null;
+    }
+    const indexOffset = this.#$days[0].findIndex(el => el.getAttribute('data-date') !== null);
+    if (indexOffset < 0) {
+      return null;
+    }
+    const rowIndex = Math.floor((indexOffset + index) / 7);
+    const colIndex = (indexOffset + index) % 7;
+    const $el = this.#$days[rowIndex]?.[colIndex];
+    if ($el == null) {
+      return null;
+    }
+    return (0, _utils.getRect)($el);
+  }
+  #onPrevMonthClick = e => {
+    e.stopPropagation();
+    (0, _utils2.decMonth)(this.#uiDate, this.#minDate);
+    this.#render();
+  };
+  #onNextMonthClick = e => {
+    e.stopPropagation();
+    (0, _utils2.incMonth)(this.#uiDate, this.#maxDate);
+    this.#render();
+  };
+  #onPrevYearClick = e => {
+    e.stopPropagation();
+    (0, _utils2.decYear)(this.#uiDate, this.#minDate);
+    this.#render();
+  };
+  #onNextYearClick = e => {
+    e.stopPropagation();
+    (0, _utils2.incYear)(this.#uiDate, this.#maxDate);
+    this.#render();
+  };
+  #onDateMouseEnter = e => {
+    if (this.#date1 !== null && this.#date2 === null) {
+      const hoverDateIso = (0, _utils.getTargetAttribute)(e, 'data-date');
+      if (hoverDateIso === null) {
+        return;
+      }
+      const hoverDate = (0, _utils2.isoToDate)(hoverDateIso);
+      const todayDate = (0, _utils2.today)();
+      for (const week of this.#$days) {
+        for (const $day of week) {
+          if ($day.hasAttribute('disabled')) {
+            continue;
+          }
+          const dayDate = (0, _utils2.isoToDate)($day.getAttribute('data-date'));
+          (0, _utils.setClass)($day, 'range', !(0, _utils2.areDatesEqual)(todayDate, dayDate) && ((0, _utils2.isDateBetween)(dayDate, this.#date1, hoverDate) || (0, _utils2.isDateBetween)(dayDate, hoverDate, this.#date1)));
+        }
+      }
+    }
+  };
+  #onDateClick = e => {
+    e.stopPropagation();
+    const dateIso = (0, _utils.getTargetAttribute)(e, 'data-date');
+    if (dateIso === null || dateIso.length === 0) {
+      return;
+    }
+    if (this.range) {
+      if (this.#date1 !== null && this.#date2 === null) {
+        const date2 = (0, _utils2.isoToDate)(dateIso);
+        const dateTuple = (0, _utils2.sortDates)([this.#date1, date2]);
+        const value = (0, _utils.packCsv)(dateTuple.map(_utils2.dateToIso));
+        this.#date1 = dateTuple[0];
+        this.#date2 = dateTuple[1];
+        this.#unsubscribeRangeHover();
+        this.#render();
+        this.dispatchEvent(new CustomEvent('-change', {
+          detail: value
+        }));
+        return;
+      }
+      this.#date1 = (0, _utils2.isoToDate)(dateIso);
+      this.#date2 = null;
+      this.#subscribeRangeHover();
+      this.#render();
+      return;
+    }
+    this.dispatchEvent(new CustomEvent('-change', {
+      detail: dateIso
+    }));
+  };
+  #onValueChange() {
+    const value = this.value;
+    this.#date1 = null;
+    this.#date2 = null;
+    if (this.range) {
+      const isoDates = (0, _utils.unpackCsv)(value);
+      if (isoDates.length === 2) {
+        const date1 = (0, _utils2.isoToDate)(isoDates[0]);
+        const date2 = (0, _utils2.isoToDate)(isoDates[1]);
+        if ((0, _utils2.isValidDate)(date1) && (0, _utils2.isValidDate)(date2)) {
+          [this.#date1, this.#date2] = (0, _utils2.sortDates)([date1, date2]);
+          if (this.#uiDate === null || !(0, _utils2.isDateOnScreen)(this.#uiDate, date1) && !(0, _utils2.isDateOnScreen)(this.#uiDate, date2)) {
+            this.#uiDate = (0, _utils2.cloneDate)(this.#date1);
+          }
+        } else {
+          this.#uiDate = null;
+        }
+      } else if (isoDates.length === 1) {
+        const date1 = (0, _utils2.isoToDate)(isoDates[0]);
+        if ((0, _utils2.isValidDate)(date1)) {
+          this.#uiDate = date1;
+        }
+      }
+    } else {
+      const valueDate = (0, _utils2.isoToDate)(value);
+      if ((0, _utils2.isValidDate)(valueDate)) {
+        this.#date1 = valueDate;
+        this.#uiDate = (0, _utils2.cloneDate)(this.#date1);
+      } else {
+        this.#uiDate = null;
+      }
+    }
+    if (this.#uiDate === null) {
+      this.#uiDate = (0, _utils2.today)();
+    }
+    if (this.#minDate !== null) {
+      (0, _utils2.clampMinDate)(this.#uiDate, this.#minDate);
+    }
+    if (this.#maxDate !== null) {
+      (0, _utils2.clampMaxDate)(this.#uiDate, this.#maxDate);
+    }
+    this.#render();
+  }
+  #render() {
+    if (this.#uiDate === null || this.#minDate === null || this.#maxDate === null || this.locale === null) {
+      return;
+    }
+    const todayDate = (0, _utils2.today)();
+    const month = (0, _utils2.getCalendarMonth)(this.#uiDate);
+    (0, _utils.updateBooleanAttribute)(this.#$prevMonth, 'disabled', (0, _utils2.canGoPrevMonth)(this.#uiDate, this.#minDate) === false);
+    (0, _utils.updateBooleanAttribute)(this.#$nextMonth, 'disabled', (0, _utils2.canGoNextMonth)(this.#uiDate, this.#maxDate) === false);
+    (0, _utils.updateBooleanAttribute)(this.#$prevYear, 'disabled', (0, _utils2.canGoPrevYear)(this.#uiDate, this.#minDate) === false);
+    (0, _utils.updateBooleanAttribute)(this.#$nextYear, 'disabled', (0, _utils2.canGoNextYear)(this.#uiDate, this.#maxDate) === false);
+    this.#$date.textContent = `${this.#monthNames[this.#uiDate.getUTCMonth()]} ${this.#uiDate.getUTCFullYear()}`;
+    for (let wi = 0; wi < this.#$days.length; wi++) {
+      const $week = this.#$days[wi];
+      let isEmptyWeek = true;
+      for (let di = 0; di < $week.length; di++) {
+        const $day = $week[di];
+        const week = month[wi];
+        const day = week?.[di];
+        $day.classList.remove('selected', 'range', 'today');
+        if (day == null) {
+          $day.textContent = '';
+          $day.removeAttribute('data-date');
+          $day.setAttribute('disabled', '');
+          $day.setAttribute('aria-hidden', 'true');
+        } else {
+          const dayIso = (0, _utils2.dateToIso)(day);
+          $day.textContent = day.getUTCDate().toString();
+          $day.setAttribute('data-date', dayIso);
+          if ((0, _utils2.isDateBetween)(day, this.#minDate, this.#maxDate)) {
+            $day.removeAttribute('disabled');
+            $day.removeAttribute('aria-hidden');
+          } else {
+            $day.setAttribute('disabled', '');
+            $day.setAttribute('aria-hidden', 'true');
+          }
+          if ((0, _utils2.areDatesEqual)(day, this.#date1) || (0, _utils2.areDatesEqual)(day, this.#date2)) {
+            $day.classList.add('selected');
+          } else if ((0, _utils2.areDatesEqual)(day, todayDate)) {
+            $day.classList.add('today');
+          } else if ((0, _utils2.isDateBetween)(day, this.#date1, this.#date2)) {
+            $day.classList.add('range');
+          }
+          isEmptyWeek = false;
+        }
+      }
+      (0, _utils.setClass)(this.#$weeks[wi], 'empty', isEmptyWeek);
+    }
+  }
+  #subscribeRangeHover() {
+    if (!this.#isHoverSubscribed) {
+      this.#$month.addEventListener('mouseover', this.#onDateMouseEnter);
+      this.#isHoverSubscribed = true;
+    }
+  }
+  #unsubscribeRangeHover() {
+    if (this.#isHoverSubscribed) {
+      this.#$month.removeEventListener('mouseover', this.#onDateMouseEnter);
+      this.#isHoverSubscribed = false;
+    }
+  }
+  #onChangeReactHandler = e => {
+    (0, _utils.getReactEventHandler)(this, 'on-change')?.(e);
+  };
+});

package/lib/cjs/date-picker/types.js

@@ -0,0 +1 @@
+"use strict";

package/lib/cjs/date-picker/utils.js

@@ -0,0 +1,171 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.today = exports.sortDates = exports.isoToDate = exports.isValidDate = exports.isDateOnScreen = exports.isDateBetween = exports.incYear = exports.incMonth = exports.getMonthNames = exports.getDayNames = exports.getCalendarMonth = exports.decYear = exports.decMonth = exports.dateToIso = exports.compareDates = exports.cloneDate = exports.clampMinDate = exports.clampMaxDate = exports.canGoPrevYear = exports.canGoPrevMonth = exports.canGoNextYear = exports.canGoNextMonth = exports.areDatesEqual = void 0;
+const DAYS_IN_WEEK = 7;
+const pad = value => {
+  return value.toString().padStart(2, '0');
+};
+const getCalendarMonth = (date, options) => {
+  const {
+    firstDayOfWeek
+  } = {
+    firstDayOfWeek: 1,
+    ...options
+  };
+  const firstDateOfMonth = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), 1));
+  const lastDateOfMonth = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + 1, 0));
+  const firstWeekdayOfMonth = firstDateOfMonth.getUTCDay();
+  const lastWeekdayOfMonth = lastDateOfMonth.getUTCDay();
+  const daysInMonth = lastDateOfMonth.getUTCDate();
+  const daysToPrepend = (firstWeekdayOfMonth - firstDayOfWeek + DAYS_IN_WEEK) % DAYS_IN_WEEK;
+  const daysToAppend = (DAYS_IN_WEEK - 1 - lastWeekdayOfMonth + firstDayOfWeek) % DAYS_IN_WEEK;
+  const month = [];
+  let week = [];
+  for (let i = 1 - daysToPrepend; i <= daysInMonth + daysToAppend + 1; i++) {
+    if (i <= 0 || i > daysInMonth) {
+      week.push(null);
+    } else {
+      const result = new Date(date);
+      result.setUTCDate(i);
+      week.push(result);
+    }
+    if (week.length === 7) {
+      month.push(week);
+      week = [];
+    }
+  }
+  return month;
+};
+exports.getCalendarMonth = getCalendarMonth;
+const dateToIso = date => {
+  return `${date.getUTCFullYear()}-${pad(date.getUTCMonth() + 1)}-${pad(date.getUTCDate())}`;
+};
+exports.dateToIso = dateToIso;
+const isoToDate = value => {
+  return new Date(`${value.substring(0, 10)}T00:00:00Z`);
+};
+exports.isoToDate = isoToDate;
+const today = () => {
+  const today = new Date();
+  return new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth(), today.getUTCDate()));
+};
+exports.today = today;
+const getDayNames = locale => {
+  const formatter = new Intl.DateTimeFormat(locale, {
+    weekday: 'narrow',
+    timeZone: 'UTC'
+  });
+  return [1, 2, 3, 4, 5, 6, 7].map(dd => {
+    const date = new Date(Date.UTC(2018, 0, dd));
+    return formatter.format(date);
+  });
+};
+exports.getDayNames = getDayNames;
+const getMonthNames = locale => {
+  const formatter = new Intl.DateTimeFormat(locale, {
+    month: 'short',
+    timeZone: 'UTC'
+  });
+  return [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11].map(mm => {
+    const date = new Date(Date.UTC(2018, mm, 1));
+    return formatter.format(date);
+  });
+};
+exports.getMonthNames = getMonthNames;
+const isValidDate = value => {
+  return value instanceof Date && !isNaN(value);
+};
+exports.isValidDate = isValidDate;
+const compareDates = (a, b) => {
+  return a.getTime() - b.getTime();
+};
+exports.compareDates = compareDates;
+const clampMinDate = (date, min) => {
+  if (compareDates(min, date) > 0) {
+    date.setTime(min.getTime());
+  }
+};
+exports.clampMinDate = clampMinDate;
+const clampMaxDate = (date, max) => {
+  if (compareDates(date, max) > 0) {
+    date.setTime(max.getTime());
+  }
+};
+exports.clampMaxDate = clampMaxDate;
+const incMonth = (date, max) => {
+  date.setUTCMonth(date.getUTCMonth() + 1);
+  clampMaxDate(date, max);
+};
+exports.incMonth = incMonth;
+const decMonth = (date, min) => {
+  date.setUTCMonth(date.getUTCMonth() - 1);
+  clampMinDate(date, min);
+};
+exports.decMonth = decMonth;
+const incYear = (date, max) => {
+  date.setUTCFullYear(date.getUTCFullYear() + 1);
+  clampMaxDate(date, max);
+};
+exports.incYear = incYear;
+const decYear = (date, min) => {
+  date.setUTCFullYear(date.getUTCFullYear() - 1);
+  clampMinDate(date, min);
+};
+exports.decYear = decYear;
+const canGoPrevMonth = (date, min) => {
+  const prevMonth = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), 0));
+  return compareDates(prevMonth, min) >= 0;
+};
+exports.canGoPrevMonth = canGoPrevMonth;
+const canGoNextMonth = (date, max) => {
+  const nextMonth = new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + 1, 1));
+  return compareDates(max, nextMonth) >= 0;
+};
+exports.canGoNextMonth = canGoNextMonth;
+const canGoNextYear = (date, max) => {
+  const nextYear = new Date(Date.UTC(date.getUTCFullYear() + 1, 0, 1));
+  return compareDates(max, nextYear) >= 0;
+};
+exports.canGoNextYear = canGoNextYear;
+const canGoPrevYear = (date, min) => {
+  const prevYear = new Date(Date.UTC(date.getUTCFullYear(), 0, 0));
+  return compareDates(prevYear, min) >= 0;
+};
+exports.canGoPrevYear = canGoPrevYear;
+const isDateBetween = (date, min, max) => {
+  if (min === null || max === null) {
+    return false;
+  }
+  return compareDates(date, min) >= 0 && compareDates(max, date) >= 0;
+};
+exports.isDateBetween = isDateBetween;
+const areDatesEqual = (a, b) => {
+  if (b === null) {
+    return false;
+  }
+  return compareDates(a, b) === 0;
+};
+exports.areDatesEqual = areDatesEqual;
+const cloneDate = date => {
+  return new Date(date.getTime());
+};
+exports.cloneDate = cloneDate;
+const sortDates = dateTuple => {
+  if (compareDates(dateTuple[0], dateTuple[1]) > 0) {
+    return [dateTuple[1], dateTuple[0]];
+  }
+  return dateTuple;
+};
+exports.sortDates = sortDates;
+const isDateOnScreen = (uiDate, date) => {
+  if (uiDate === null || date === null) {
+    return false;
+  }
+  const firstDateOfMonth = new Date(Date.UTC(uiDate.getUTCFullYear(), uiDate.getUTCMonth(), 1));
+  const lastDateOfMonth = new Date(Date.UTC(uiDate.getUTCFullYear(), uiDate.getUTCMonth() + 1, 0));
+  return isDateBetween(date, firstDateOfMonth, lastDateOfMonth);
+};
+exports.isDateOnScreen = isDateOnScreen;