@atlaskit/editor-plugin-date 0.1.0 → 0.2.0

package/dist/esm/ui/DatePicker/date-picker-input.js

@@ -0,0 +1,247 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+var _templateObject;
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+/** @jsx jsx */
+import React from 'react';
+import { css, jsx } from '@emotion/react';
+import { defineMessages, injectIntl } from 'react-intl-next';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { ErrorMessage } from '@atlaskit/form';
+import TextField from '@atlaskit/textfield';
+import { formatDateType, parseDateType } from '../../utils/formatParse';
+import { adjustDate, findDateSegmentByPosition, isDatePossiblyValid } from '../../utils/internal';
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+var dateTextFieldWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 22px;\n  padding-bottom: ", ";\n"])), "var(--ds-space-150, 12px)");
+var messages = defineMessages({
+  invalidDateError: {
+    id: 'fabric.editor.invalidDateError',
+    defaultMessage: 'Enter a valid date',
+    description: 'Error message when the date typed in is invalid, requesting they inputs a new date'
+  }
+});
+
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var DatePickerInput = /*#__PURE__*/function (_React$Component) {
+  _inherits(DatePickerInput, _React$Component);
+  var _super = _createSuper(DatePickerInput);
+  function DatePickerInput(props) {
+    var _this;
+    _classCallCheck(this, DatePickerInput);
+    _this = _super.call(this, props);
+    /**
+     * Focus the input textfield
+     */
+    _defineProperty(_assertThisInitialized(_this), "focusInput", function () {
+      if (!_this.inputRef) {
+        return;
+      }
+      // Defer to prevent editor scrolling to top (See FS-3227, also ED-2992)
+      _this.autofocusTimeout = setTimeout(function () {
+        var _this$inputRef;
+        (_this$inputRef = _this.inputRef) === null || _this$inputRef === void 0 || _this$inputRef.focus();
+      });
+    });
+    /**
+     * Select all the input text
+     */
+    _defineProperty(_assertThisInitialized(_this), "selectInput", function () {
+      if (!_this.inputRef) {
+        return;
+      }
+      // Defer to prevent editor scrolling to top (See FS-3227, also ED-2992)
+      _this.autoSelectAllTimeout = setTimeout(function () {
+        var _this$inputRef2;
+        (_this$inputRef2 = _this.inputRef) === null || _this$inputRef2 === void 0 || _this$inputRef2.select();
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleInputRef", function (ref) {
+      var _this$props = _this.props,
+        autoFocus = _this$props.autoFocus,
+        autoSelectAll = _this$props.autoSelectAll;
+      if (ref) {
+        _this.inputRef = ref;
+      }
+      if (ref && autoFocus) {
+        _this.focusInput();
+      }
+      if (autoSelectAll) {
+        _this.selectInput();
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleChange", function (evt) {
+      var textFieldValue = evt.target.value;
+      var _this$props2 = _this.props,
+        locale = _this$props2.locale,
+        dispatchAnalyticsEvent = _this$props2.dispatchAnalyticsEvent;
+      var newDate = parseDateType(textFieldValue, locale);
+      if (newDate !== undefined && newDate !== null) {
+        _this.setState({
+          inputText: textFieldValue
+        });
+        _this.props.onNewDate(newDate);
+        if (dispatchAnalyticsEvent) {
+          dispatchAnalyticsEvent({
+            eventType: EVENT_TYPE.TRACK,
+            action: ACTION.TYPING_FINISHED,
+            actionSubject: ACTION_SUBJECT.DATE
+          });
+        }
+      } else {
+        // if invalid, just update state text (to rerender textfield)
+        _this.setState({
+          inputText: textFieldValue
+        });
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleKeyPress", function (event) {
+      var _this$props3 = _this.props,
+        locale = _this$props3.locale,
+        dispatchAnalyticsEvent = _this$props3.dispatchAnalyticsEvent;
+      var textFieldValue = event.target.value;
+
+      // Fire event on every keypress (textfield not necessarily empty)
+      if (dispatchAnalyticsEvent && event.key !== 'Enter' && event.key !== 'Backspace') {
+        dispatchAnalyticsEvent({
+          eventType: EVENT_TYPE.TRACK,
+          action: ACTION.TYPING_STARTED,
+          actionSubject: ACTION_SUBJECT.DATE
+        });
+      }
+      if (event.key !== 'Enter') {
+        return;
+      }
+      if (textFieldValue === '') {
+        _this.props.onEmptySubmit();
+        return;
+      }
+      var newDate = parseDateType(textFieldValue, locale);
+      _this.props.onSubmitDate(newDate);
+    });
+    // arrow keys are only triggered by onKeyDown, not onKeyPress
+    _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function (event) {
+      var _this$inputRef3;
+      var dateString = event.target.value;
+      var locale = _this.props.locale;
+      var adjustment;
+      if (event.key === 'ArrowUp') {
+        adjustment = 1;
+      } else if (event.key === 'ArrowDown') {
+        adjustment = -1;
+      }
+      if (adjustment === undefined) {
+        return;
+      }
+      var dispatchAnalyticsEvent = _this.props.dispatchAnalyticsEvent;
+      var cursorPos = (_this$inputRef3 = _this.inputRef) === null || _this$inputRef3 === void 0 ? void 0 : _this$inputRef3.selectionStart;
+      if (cursorPos === null || cursorPos === undefined) {
+        return;
+      }
+      var activeSegment = findDateSegmentByPosition(cursorPos, dateString, locale);
+      if (activeSegment === undefined) {
+        return;
+      }
+      var dateSegment;
+      switch (activeSegment) {
+        case 'day':
+          dateSegment = ACTION_SUBJECT_ID.DATE_DAY;
+          break;
+        case 'month':
+          dateSegment = ACTION_SUBJECT_ID.DATE_MONTH;
+          break;
+        default:
+          dateSegment = ACTION_SUBJECT_ID.DATE_YEAR;
+      }
+      if (dispatchAnalyticsEvent) {
+        dispatchAnalyticsEvent({
+          eventType: EVENT_TYPE.TRACK,
+          action: adjustment > 0 ? ACTION.INCREMENTED : ACTION.DECREMENTED,
+          actionSubject: ACTION_SUBJECT.DATE_SEGMENT,
+          attributes: {
+            dateSegment: dateSegment
+          }
+        });
+      }
+      var oldDateType = parseDateType(dateString, locale);
+      if (oldDateType === undefined || oldDateType === null) {
+        return;
+      }
+      var newDateType = adjustDate(oldDateType, activeSegment, adjustment);
+      _this.setState({
+        inputText: formatDateType(newDateType, locale)
+      });
+      _this.props.onNewDate(newDateType);
+      _this.setInputSelectionPos = Math.min(cursorPos, dateString.length);
+      event.preventDefault();
+    });
+    var date = props.date;
+    _this.setInputSelectionPos = undefined;
+    var inputText = formatDateType(date, _this.props.locale);
+    _this.state = {
+      inputText: inputText
+    };
+    return _this;
+  }
+  _createClass(DatePickerInput, [{
+    key: "render",
+    value: function render() {
+      var _this$props4 = this.props,
+        locale = _this$props4.locale,
+        formatMessage = _this$props4.intl.formatMessage;
+      var inputText = this.state.inputText;
+      var possiblyValid = isDatePossiblyValid(inputText);
+      var attemptedDateParse = parseDateType(inputText, locale);
+
+      // Don't display an error for an empty input.
+      var displayError = (attemptedDateParse === null || !possiblyValid) && inputText !== '';
+      return jsx("div", {
+        css: dateTextFieldWrapper
+      }, jsx(TextField, {
+        name: "datetextfield",
+        value: inputText,
+        ref: this.handleInputRef,
+        onChange: this.handleChange,
+        onKeyPress: this.handleKeyPress,
+        onKeyDown: this.handleKeyDown,
+        spellCheck: false,
+        autoComplete: "off",
+        isInvalid: displayError
+      }), displayError && jsx(ErrorMessage, null, formatMessage(messages.invalidDateError)));
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      var setInputSelectionPos = this.setInputSelectionPos;
+      if (this.inputRef && setInputSelectionPos !== undefined) {
+        this.inputRef.setSelectionRange(setInputSelectionPos, setInputSelectionPos);
+        this.setInputSelectionPos = undefined;
+      }
+      if (this.inputRef && this.props.autoFocus) {
+        // TODO: Check if input already has focus
+        this.focusInput();
+      }
+
+      // Don't select all text here - would seleect text on each keystroke
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (this.autofocusTimeout !== undefined) {
+        clearTimeout(this.autofocusTimeout);
+      }
+      if (this.autoSelectAllTimeout !== undefined) {
+        clearTimeout(this.autoSelectAllTimeout);
+      }
+    }
+  }]);
+  return DatePickerInput;
+}(React.Component);
+export default injectIntl(DatePickerInput);

package/dist/esm/ui/DatePicker/index.js

@@ -0,0 +1,164 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+var _templateObject;
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+/** @jsx jsx */
+import React from 'react';
+import { css, jsx } from '@emotion/react';
+import ReactDOM from 'react-dom';
+import { injectIntl } from 'react-intl-next';
+import Calendar from '@atlaskit/calendar';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { Popup, withOuterListeners } from '@atlaskit/editor-common/ui';
+import { timestampToIsoFormat, timestampToUTCDate } from '@atlaskit/editor-common/utils';
+import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
+import { N0, N60A } from '@atlaskit/theme/colors';
+import { borderRadius } from '@atlaskit/theme/constants';
+var PopupWithListeners = withOuterListeners(Popup);
+import DatePickerInput from './date-picker-input';
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+var popupContentWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: ", ";\n  border-radius: ", "px;\n  box-shadow: ", ";\n  background-color: ", ";\n"])), "var(--ds-space-025, 2px)", borderRadius(), "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N60A, ", 0 0 1px ").concat(N60A), ")"), "var(--ds-surface-overlay, ".concat(N0, ")"));
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var DatePicker = /*#__PURE__*/function (_React$Component) {
+  _inherits(DatePicker, _React$Component);
+  var _super = _createSuper(DatePicker);
+  function DatePicker(props) {
+    var _this;
+    _classCallCheck(this, DatePicker);
+    _this = _super.call(this, props);
+    _defineProperty(_assertThisInitialized(_this), "handleNewDate", function (date) {
+      _this.props.onTextChanged(date);
+      _this.setState({
+        latestValidDate: date
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleKeyboardSubmitDate", function (date) {
+      _this.props.onSelect(date, INPUT_METHOD.KEYBOARD);
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleEmptySubmitDate", function () {
+      _this.props.onDelete();
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleOnChange", function (_ref) {
+      var day = _ref.day,
+        month = _ref.month,
+        year = _ref.year;
+      var date = {
+        day: day,
+        month: month,
+        year: year
+      };
+      _this.setState({
+        latestValidDate: date
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "closeDatePickerWithAnalytics", function () {
+      _this.props.closeDatePickerWithAnalytics({
+        date: _this.state.latestValidDate
+      });
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleRef", function (ref) {
+      var elm = ref && ReactDOM.findDOMNode(ref);
+      if (elm) {
+        elm.focus();
+      }
+    });
+    var timestamp = props.element.getAttribute('timestamp');
+    if (timestamp) {
+      // Warning: The 'Date' return type of timestampToUTCDate() is not a JS date, it's more similar
+      // to the DateType type
+      var _timestampToUTCDate = timestampToUTCDate(timestamp),
+        day = _timestampToUTCDate.day,
+        month = _timestampToUTCDate.month,
+        year = _timestampToUTCDate.year;
+      var _date = {
+        day: day,
+        month: month,
+        year: year
+      };
+      _this.state = {
+        selected: [timestampToIsoFormat(timestamp)],
+        date: _date,
+        latestValidDate: _date
+      };
+    }
+    return _this;
+  }
+  _createClass(DatePicker, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        element = _this$props.element,
+        _onSelect = _this$props.onSelect,
+        mountTo = _this$props.mountTo,
+        boundariesElement = _this$props.boundariesElement,
+        scrollableElement = _this$props.scrollableElement,
+        intl = _this$props.intl,
+        dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
+        isNew = _this$props.isNew,
+        autoFocus = _this$props.autoFocus,
+        weekStartDay = _this$props.weekStartDay;
+      var timestamp = element.getAttribute('timestamp');
+      if (this.state === null) {
+        // Without this, you can blow up the page by slowing down cpu, opening date, typing after date
+        // then clicking on date lozenge and typing quickly before it opens
+        return null;
+      }
+      var _this$state = this.state,
+        date = _this$state.date,
+        selected = _this$state.selected,
+        latestValidDate = _this$state.latestValidDate;
+      var day = latestValidDate.day,
+        month = latestValidDate.month,
+        year = latestValidDate.year;
+      if (!timestamp) {
+        return null;
+      }
+      return jsx(PopupWithListeners, {
+        target: element,
+        offset: [0, 8],
+        fitHeight: 327,
+        fitWidth: 340,
+        handleClickOutside: this.closeDatePickerWithAnalytics,
+        handleEscapeKeydown: this.closeDatePickerWithAnalytics,
+        zIndex: akEditorFloatingDialogZIndex,
+        mountTo: mountTo,
+        boundariesElement: boundariesElement,
+        scrollableElement: scrollableElement,
+        ariaLabel: null
+      }, jsx("div", {
+        css: popupContentWrapper
+      }, jsx(DatePickerInput, {
+        date: date,
+        onNewDate: this.handleNewDate,
+        onSubmitDate: this.handleKeyboardSubmitDate,
+        onEmptySubmit: this.handleEmptySubmitDate,
+        locale: intl.locale,
+        dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+        autoFocus: autoFocus,
+        autoSelectAll: isNew
+      }), jsx(Calendar, {
+        onChange: this.handleOnChange,
+        onSelect: function onSelect(date) {
+          return _onSelect(date, INPUT_METHOD.PICKER);
+        },
+        day: day,
+        month: month,
+        year: year,
+        selected: selected,
+        ref: this.handleRef,
+        weekStartDay: weekStartDay,
+        testId: 'datepicker'
+      })));
+    }
+  }]);
+  return DatePicker;
+}(React.Component);
+export default injectIntl(DatePicker);

package/dist/esm/utils/formatParse.js

@@ -0,0 +1,79 @@
+import { createLocalizationProvider } from '@atlaskit/locale';
+/**
+ * Attempt to parse a string representing a date in a particular locale to a date object
+ * @param dateString The string representing the date in the given locale, eg '02/12/2000'
+ * @param l10n The localisation provider created by createLocalizationProvider
+ * @returns Editor DateType when can parse, null when can't parse or invalid
+ */
+export function parseDateType(dateString, locale) {
+  try {
+    var l10n = createLocalizationProvider(locale);
+    var date = l10n.parseDate(dateString);
+
+    // If date is invalid
+    if (isNaN(date.getTime())) {
+      return null;
+    }
+    var year = date.getFullYear();
+    if (year < 1000 || year > 9999) {
+      return null;
+    }
+    var dateObj = {
+      day: date.getDate(),
+      month: date.getMonth() + 1,
+      year: year
+    };
+    return dateObj;
+  } catch (e) {
+    return null;
+  }
+}
+
+/**
+ * Convert an EditorDateType to a date string string formatted for a particular locale
+ * @param date The date object
+ * @param locale The locale code string (eg. "en-AU")
+ * @returns Date string, eg "25/5/20"
+ */
+export function formatDateType(date, locale) {
+  var day = date.day,
+    month = date.month,
+    year = date.year;
+  var l10n = createLocalizationProvider(locale);
+
+  // The JS Date api represents month as a number between 0-11 :)
+  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date
+  var dateObj = new Date(year, month - 1, day);
+  return l10n.formatDate(dateObj);
+}
+
+/**
+ * Convert an Editor DateType to a JavaScript Date object
+ * @param date Editor DateType
+ * @returns JavaScript Date object
+ */
+export function dateTypeToDate(date) {
+  var day = date.day,
+    month = date.month,
+    year = date.year;
+  // The JS Date api represents month as a number between 0-11 :)
+  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date
+  var dateObj = new Date(year, month - 1, day);
+  return dateObj;
+}
+
+/**
+ * Convert a JavaScript Date to an editor DateType
+ * @param date JavaScript Date object
+ * @returns Editor DateType
+ */
+export function dateToDateType(date) {
+  var dateObj = {
+    day: date.getDate(),
+    // The JS Date api represents month as a number between 0-11 :)
+    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date
+    month: date.getMonth() + 1,
+    year: date.getFullYear()
+  };
+  return dateObj;
+}

package/dist/esm/utils/internal.js

@@ -0,0 +1,165 @@
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import addDays from 'date-fns/addDays';
+import addMonths from 'date-fns/addMonths';
+import addYears from 'date-fns/addYears';
+import { dateToDateType, dateTypeToDate, formatDateType } from './formatParse';
+function isDigit(c) {
+  if (c === undefined) {
+    return false;
+  }
+  return c >= '0' && c <= '9';
+}
+
+/**
+ * Check if cursor is in first segment of a date.
+ * @param cursorPos Cursor pos, with 0 referring to the left of first char
+ * @param date Date string in any locale
+ */
+function isCursorInFirstDateSegment(cursorPos, date) {
+  var posCounter = cursorPos - 1;
+  var isAdjacent = true;
+  // The date without any non-digit characters on the end
+  var strippedDate = date.replace(/[^0-9]+$/g, '');
+  while (posCounter >= 0 && isAdjacent) {
+    var c = strippedDate[posCounter];
+    if (!isDigit(c)) {
+      isAdjacent = false;
+    }
+    posCounter -= 1;
+  }
+  return isAdjacent;
+}
+
+/**
+ * Check if cursor is in last segment of a date.
+ * @param cursorPos Cursor pos, with 0 referring to the left of first char
+ * @param date Date string in any locale
+ */
+function isCursorInLastDateSegment(cursorPos, date) {
+  var posCounter = cursorPos;
+  var isAdjacent = true;
+  // The date without any non-digit characters on the end
+  var strippedDate = date.replace(/[^0-9]+$/g, '');
+  while (posCounter < strippedDate.length && isAdjacent) {
+    var c = strippedDate[posCounter];
+    if (!isDigit(c)) {
+      isAdjacent = false;
+    }
+    posCounter += 1;
+  }
+  return isAdjacent;
+}
+
+/**
+ * Inconclusively check if a date string is valid - a value of false means it is definitely
+ * invalid, a value of true means it might be valid.
+ * @param date Date string to be parsed
+ */
+export function isDatePossiblyValid(date) {
+  var _iterator = _createForOfIteratorHelper(date),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var c = _step.value;
+      var isNumber = c >= '0' && c <= '9';
+      var isValidPunctuation = '. ,/'.indexOf(c) !== -1;
+      if (!(isNumber || isValidPunctuation)) {
+        return false;
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return true;
+}
+
+/**
+ * Find the segment of a date a position refers to. Eg: pos 2 in 29/03/2020 is in
+ * the day segment.
+ * @param position Cursor position, with 0 referring to the left of the first char
+ * @param date The localised date string
+ * @param locale The language to interpret the date string in
+ */
+export function findDateSegmentByPosition(position, date, locale) {
+  if (position > date.length) {
+    return undefined;
+  }
+  var placeholder = getLocaleDatePlaceholder(locale);
+  if (!placeholder) {
+    return undefined;
+  }
+
+  // The placeholder without any non-digit characters on the end
+  var strippedPlaceholder = placeholder.replace(/[^ymd]+$/g, '');
+  var keyToSegment = {
+    d: 'day',
+    m: 'month',
+    y: 'year'
+  };
+  var firstSegment = keyToSegment[strippedPlaceholder[0]];
+  var lastSegment = keyToSegment[strippedPlaceholder[strippedPlaceholder.length - 1]];
+  var allPossibleSegments = ['day', 'month', 'year'];
+  var middleSegment = allPossibleSegments.filter(function (s) {
+    return s !== firstSegment && s !== lastSegment;
+  })[0];
+  if (isCursorInFirstDateSegment(position, date)) {
+    return firstSegment;
+  }
+  if (isCursorInLastDateSegment(position, date)) {
+    return lastSegment;
+  }
+  return middleSegment;
+}
+
+/**
+ * Generate a placeholder date string for a given locale
+ * eg: locale 'hu-HU' -> 'yyyy. mm. dd.'
+ * @param locale A locale string supported by Intl.DateTimeFormat
+ * @returns A placeholder string. d=1 or 2 digit day, dd=zero padded
+ * day, same for month but letter m, yyyy=year
+ */
+export function getLocaleDatePlaceholder(locale) {
+  var uniqueDateType = {
+    day: 7,
+    month: 1,
+    year: 1992
+  };
+  var localisedDateString = formatDateType(uniqueDateType, locale);
+  var shortDateFormat = localisedDateString.replace(/\d+/g, function (str) {
+    if (!str) {
+      return '';
+    }
+    var num = parseInt(str);
+    switch (num % 100) {
+      case 92:
+        return str.replace(/.{1}/g, 'y');
+      case 1:
+        return str.length === 1 ? 'm' : 'mm';
+      case 7:
+        return str.length === 1 ? 'd' : 'dd';
+    }
+    return '';
+  });
+  return shortDateFormat;
+}
+
+/**
+ * Adjust date segment up or down. Eg. If day is the active segment and adjustment is -1,
+ * reduce the day by one.
+ * @param date Valid datetype
+ * @param activeSegment which part of the date is selected/being adjusted
+ * @param adjustment how many units the segment is being adjusted (can be pos or neg, usually 1 or -1)
+ */
+export function adjustDate(date, activeSegment, adjustment) {
+  var originalDate = dateTypeToDate(date);
+  var newDate = activeSegment === 'day' ? addDays(originalDate, adjustment) : activeSegment === 'month' ? addMonths(originalDate, adjustment) : addYears(originalDate, adjustment);
+  return dateToDateType(newDate);
+}
+export function isToday(date) {
+  var today = new Date();
+  return date !== undefined && today.getDate() === date.day && date.month === today.getMonth() + 1 && date.year === today.getFullYear();
+}