@six-group/ui-library 3.0.0-beta.1.7

package/dist/cjs/six-timepicker.cjs.entry.js

@@ -0,0 +1,504 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-341df120.js');
+const types = require('./types-0c28e484.js');
+const sixTimepicker_types = require('./six-timepicker.types-c58cc88b.js');
+const executionControl = require('./execution-control-3bc9c7c4.js');
+const eventListeners = require('./event-listeners-4a8d66d5.js');
+const slot = require('./slot-8abe833c.js');
+
+var SixTimeFormat;
+(function (SixTimeFormat) {
+  SixTimeFormat["HHmmss"] = "HH:mm:ss";
+  SixTimeFormat["hhmmssaa"] = "hh:mm:ss:aa";
+  SixTimeFormat["HHmmssms"] = "HH:mm:ss:ms";
+  SixTimeFormat["hhmmssmsaa"] = "hh:mm:ss:ms:aa";
+  SixTimeFormat["HHmm"] = "HH:mm";
+  SixTimeFormat["hhmmaa"] = "hh:mm:aa";
+  SixTimeFormat["HH"] = "HH";
+  SixTimeFormat["hhaa"] = "hh:aa";
+  SixTimeFormat["mm"] = "mm";
+  SixTimeFormat["ss"] = "ss";
+  SixTimeFormat["ms"] = "ms";
+})(SixTimeFormat || (SixTimeFormat = {}));
+
+/*
+ * Returns the current time in the format of your choice
+ */
+const getCurrentTimeIn24Hours = () => {
+  const now = new Date();
+  return {
+    hours: now.getHours(),
+    minutes: now.getMinutes(),
+    seconds: now.getSeconds(),
+    milliseconds: now.getMilliseconds(),
+    has24Hours: true,
+  };
+};
+const HOURS_IN_12_HOUR_CLOCK_FORMAT = 12;
+const getHoursIn12HourFormat = (hours) => hours > HOURS_IN_12_HOUR_CLOCK_FORMAT ? hours - HOURS_IN_12_HOUR_CLOCK_FORMAT : hours;
+const getCurrentTimeIn12Hours = () => {
+  const now = new Date();
+  const hours = now.getHours();
+  return {
+    hours: getHoursIn12HourFormat(hours),
+    minutes: now.getMinutes(),
+    seconds: now.getSeconds(),
+    milliseconds: now.getMilliseconds(),
+    has24Hours: false,
+    period: hours >= HOURS_IN_12_HOUR_CLOCK_FORMAT ? sixTimepicker_types.SixTimePeriod.PM : sixTimepicker_types.SixTimePeriod.AM,
+  };
+};
+const getCurrentTime = (has24Hours = true) => {
+  return has24Hours ? getCurrentTimeIn24Hours() : getCurrentTimeIn12Hours();
+};
+const TIME_FORMAT_SEPARATOR = ':';
+const isValidTimeString = (timeStr, format) => {
+  const timeStringParts = timeStr.split(TIME_FORMAT_SEPARATOR);
+  const timeFormatParts = format.split(TIME_FORMAT_SEPARATOR);
+  return timeStringParts.length === timeFormatParts.length;
+};
+const parseTimeString = (timeStr, format) => {
+  const timeStringParts = timeStr.split(TIME_FORMAT_SEPARATOR);
+  const timeFormatParts = format.split(TIME_FORMAT_SEPARATOR);
+  if (!isValidTimeString(timeStr, format)) {
+    console.error(`Timestring did not match expected format.\nExpected format: ${format}\nReceived timestring: ${timeStr}`);
+  }
+  const sixTime = {};
+  timeStringParts.forEach((timeStringPart, i) => {
+    const formatStringPart = timeFormatParts[i];
+    const sixTimePropertyName = sixTimepicker_types.TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP[formatStringPart];
+    if (sixTimePropertyName !== undefined) {
+      if (formatStringPart === sixTimepicker_types.TIME_FORMAT_CHAR.PERIOD) {
+        sixTime.period = timeStringPart.toUpperCase() === sixTimepicker_types.SixTimePeriod.PM ? sixTimepicker_types.SixTimePeriod.PM : sixTimepicker_types.SixTimePeriod.AM;
+      }
+      else {
+        sixTime[sixTimePropertyName] = Number(timeStringPart);
+      }
+    }
+    if (formatStringPart === sixTimepicker_types.TIME_FORMAT_CHAR.HOUR_24) {
+      sixTime.has24Hours = true;
+    }
+    else if (formatStringPart === sixTimepicker_types.TIME_FORMAT_CHAR.HOUR_12) {
+      sixTime.has24Hours = false;
+    }
+  });
+  return sixTime;
+};
+const createTimeString = (time, format) => {
+  return format
+    .split(TIME_FORMAT_SEPARATOR)
+    .map((timeFormatPart) => {
+    const sixTimePropertyName = sixTimepicker_types.TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP[timeFormatPart];
+    const paddingLength = timeFormatPart === sixTimepicker_types.TIME_FORMAT_CHAR.MILLISECOND ? 3 : 2;
+    return String(time[sixTimePropertyName]).padStart(paddingLength, '0');
+  })
+    .join(TIME_FORMAT_SEPARATOR);
+};
+
+const sixTimepickerCss = ":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block;font-family:var(--six-font-family)}.timepicker_clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.timepicker_clear:hover{color:var(--six-input-icon-color-hover)}.timepicker_clear:focus{outline:none}.timepicker_clear--right{right:0;position:absolute}.timepicker_clear--left{right:35px;position:absolute}.timepicker__container{position:relative}.timepicker__popup{display:flex;justify-content:center;min-width:min-content;min-height:145px;background-color:white;padding:0.5em 0.5em 1.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.timepicker__popup--is-up{bottom:100%}.timepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.timepicker__separator{display:flex;align-items:center}.timepicker__item--wide{padding-left:0.5rem;padding-right:0.5rem}.input--empty .timepicker_clear{visibility:hidden}.input--hide{display:none}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}";
+
+const TAG = `[SIX-TIMEPICKER]`;
+const DEBOUNCE_TIMEPICKER_LISTENER = 'debounced-timepicker';
+const MIN_POPUP_HEIGHT = 145;
+let SixTimepicker = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.sixChange = index.createEvent(this, "six-timepicker-change", 7);
+    this.sixChangeDebounced = index.createEvent(this, "six-timepicker-change-debounced", 7);
+    this.sixClear = index.createEvent(this, "six-timepicker-clear", 7);
+    this.eventListeners = new eventListeners.EventListeners();
+    /**
+     * Define the time format. Valid formats are:
+     *
+     * HH:mm:ss
+     * hh:mm:ss:aa
+     * HH:mm:ss:ms
+     * hh:mm:ss:ms:aa
+     * HH:mm
+     * hh:mm:aa
+     * HH
+     * hh:aa
+     * mm
+     * ss
+     * ms
+     *
+     * where HH is the 24 hour format
+     * and hh is the 12 hour format
+     *
+     * Please notice that when using the 12-hour-clock (hh)
+     * you always need a period indicator (aa). So the time can be parsed as either am or pm
+     * */
+    this.format = SixTimeFormat.HHmmss;
+    /**
+     * Define the separator to be shown between the time unit pickers.
+     * Please be aware that this property will modify the displayed separator only.
+     * The separator for a timestring is always expected to be a colon (eg. '13:52:20')
+     * */
+    this.separator = TIME_FORMAT_SEPARATOR;
+    /** Indicates whether or not the timepicker dropdown is open on startup. You can use this in lieu of the show/hide methods. */
+    this.open = false;
+    /** Indicates whether or not the timepicker should be shown as an inline (always open) component */
+    this.inline = false;
+    /**
+     * If `true` the user can only select a time via the timepicker but not directly edit the input field.
+     */
+    this.readonly = false;
+    /**
+     * If `true` the component is disabled.
+     */
+    this.disabled = false;
+    /** Timepicker size. */
+    this.size = 'medium';
+    /** Set to display the error text on blur and not when typing */
+    this.errorOnBlur = false;
+    /** The input's error text. Alternatively, you can use the error-text slot. */
+    this.errorText = '';
+    /** The input's label. Alternatively, you can use the label slot. */
+    this.label = '';
+    /** The input's name attribute. */
+    this.name = '';
+    /** Set to true to add a clear button when the input is populated. */
+    this.clearable = false;
+    /** Set the position of the icon */
+    this.iconPosition = 'left';
+    /**
+     * Enable this option to prevent the panel from being clipped when the component is placed inside a container with
+     * `overflow: auto|scroll`.
+     */
+    this.hoist = false;
+    /**
+     * Set the amount of time, in milliseconds, to wait to trigger faster switching between timeunits (e.g. hours).
+     */
+    this.timeout = executionControl.DEFAULT_DEBOUNCE_FAST;
+    /**
+     * Set the amount of time, in milliseconds, to wait between switching to next timeunit (e.g. next hour) when mouse button is held pressed.
+     */
+    this.interval = executionControl.DEFAULT_DEBOUNCE_INSANELY_FAST;
+    /**
+     * Set the amount of time, in milliseconds, to wait to trigger the `six-timepicker-change-debounced` event.
+     * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce
+     * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click
+     * (and keep pressed) and once you release
+     */
+    this.debounce = executionControl.DEFAULT_DEBOUNCE_FAST;
+    this.isPopupContentUp = false;
+    this.isDropDownContentUp = false;
+    this.defaultValue = null;
+    this.handleInputChange = (event) => {
+      event.stopPropagation();
+      const inputValue = this.inputElement.value;
+      if (!isValidTimeString(inputValue, this.format)) {
+        this.sixChange.emit({
+          value: {},
+          valueAsString: '',
+        });
+        return;
+      }
+      this.internalValue = parseTimeString(inputValue, this.format);
+      this.sixChange.emit({
+        value: this.internalValue,
+        valueAsString: createTimeString(this.internalValue, this.format),
+      });
+    };
+    this.handleSixTimepickerChangeDebounced = ({ detail }) => {
+      this.sixChangeDebounced.emit(detail);
+    };
+    this.handleChange = (event, property) => {
+      // stop propagation, since the timepicker should not expose the events of the underlying item-picker
+      event.stopPropagation();
+      // update the internal state
+      this.internalValue[property] = event.detail;
+      const timeString = createTimeString(this.internalValue, this.format);
+      // fire timepicker's own event
+      this.sixChange.emit({
+        changedProperty: property,
+        value: this.internalValue,
+        valueAsString: timeString,
+      });
+      // update the input value
+      this.value = timeString;
+    };
+    this.handleDocumentMouseDown = (event) => {
+      // Close when clicking outside of the containing element
+      const path = event.composedPath();
+      if (!path.includes(this.host)) {
+        this.closePopup();
+        return;
+      }
+    };
+    this.handleClearClick = (event) => {
+      event.stopPropagation();
+      this.value = undefined;
+      this.sixClear.emit();
+    };
+  }
+  async resizeHandler() {
+    this.calcIsPopupContentUp();
+    this.moveOpenHoistedPopup();
+  }
+  async scrollHandler() {
+    this.calcIsPopupContentUp();
+    this.moveOpenHoistedPopup();
+  }
+  debounceChanged() {
+    this.eventListeners.removeByIdentifier(DEBOUNCE_TIMEPICKER_LISTENER);
+    this.eventListeners.add(this.host, 'six-timepicker-change', executionControl.debounce(this.handleSixTimepickerChangeDebounced, this.debounce), DEBOUNCE_TIMEPICKER_LISTENER);
+  }
+  /**
+   * Update the native input element when the value changes
+   */
+  valueChanged(newValue) {
+    if (this.value !== newValue) {
+      this.value = newValue;
+    }
+    this.setupInternalTime();
+    this.sixChange.emit({
+      value: this.internalValue,
+      valueAsString: createTimeString(this.internalValue, this.format),
+    });
+  }
+  /** Checks for validity and shows the browser's validation message if the control is invalid. */
+  async reportValidity() {
+    return this.inputElement.reportValidity();
+  }
+  /** Checks for validity. */
+  async checkValidity() {
+    return this.inputElement.checkValidity();
+  }
+  /** Sets a custom validation message. If `message` is not empty, the field will be considered invalid. */
+  async setCustomValidity(message) {
+    await this.inputElement.setCustomValidity(message);
+  }
+  /** Resets the formcontrol */
+  async reset() {
+    this.internalValue = this.defaultValue;
+    this.inputElement.value = createTimeString(this.internalValue, this.format);
+    await this.inputElement.reset();
+  }
+  componentWillLoad() {
+    this.setupInternalTime();
+    if (this.inline) {
+      this.open = true;
+    }
+    if (this.open) {
+      this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);
+    }
+  }
+  componentDidLoad() {
+    this.eventListeners.add(this.host, 'six-timepicker-change', executionControl.debounce(this.handleSixTimepickerChangeDebounced, this.debounce), DEBOUNCE_TIMEPICKER_LISTENER);
+    this.eventListeners.add(this.inputElement, 'six-input-input', executionControl.debounce(this.handleInputChange, this.debounce));
+  }
+  disconnectedCallback() {
+    this.eventListeners.removeAll();
+  }
+  calcIsPopupContentUp() {
+    if (!this.inputElement || !this.wrapper) {
+      return;
+    }
+    const inputBoundingRect = this.inputElement.getBoundingClientRect();
+    const wrapperBoundingRect = this.wrapper.getBoundingClientRect();
+    const minPopupHeight = Math.max(wrapperBoundingRect.height, MIN_POPUP_HEIGHT);
+    const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;
+    this.isPopupContentUp = moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + minPopupHeight;
+  }
+  /*
+   * The position of the hoisted timepicker needs to be correctly calculated since the position changes to fixed.
+   * Thus if the user scrolls or adjusts the screen size we need to recalculate the timepicker position.
+   */
+  moveOpenHoistedPopup() {
+    if (!this.hoist || !this.open) {
+      return;
+    }
+    const popupBoundingClientRect = this.popup.getBoundingClientRect();
+    const popupHeight = popupBoundingClientRect.height;
+    const inputBoundingClientRect = this.inputElement.getBoundingClientRect();
+    const inputTop = inputBoundingClientRect.top;
+    const inputHeight = inputBoundingClientRect.height;
+    this.calcIsPopupContentUp();
+    if (this.isPopupContentUp) {
+      this.popup.style.top = `${inputTop - popupHeight}px`;
+    }
+    else {
+      this.popup.style.top = `${inputTop + inputHeight}px`;
+    }
+  }
+  getSixTimeUnitPicker(params) {
+    return (index.h("six-item-picker", { class: params.class, timeout: this.timeout, interval: this.interval, padded: true, min: params.min, max: params.max, value: this.internalValue[params.propertyName], items: params.items, type: params.type || types.ItemPickerType.NUMBER, "padding-length": params.paddingLength, "onSix-item-picker-change": (event) => this.handleChange(event, params.propertyName) }));
+  }
+  setupInternalTime() {
+    if (this.is12HourClock() && !this.format.includes(sixTimepicker_types.TIME_FORMAT_CHAR.PERIOD)) {
+      console.error(`${TAG} You provided a 12-hour-clock format but are missing the period (am or pm) in the time-format-string!`);
+    }
+    if (this.value === null || this.value === undefined) {
+      this.internalValue = sixTimepicker_types.isNil(this.defaultTime)
+        ? getCurrentTime(this.is24HourClock())
+        : parseTimeString(this.defaultTime, this.format);
+    }
+    else {
+      this.internalValue = parseTimeString(this.value, this.format);
+    }
+    this.defaultValue = this.internalValue;
+  }
+  getHour24Picker() {
+    if (!this.is24HourClock()) {
+      return;
+    }
+    return this.getSixTimeUnitPicker({ min: 0, max: 23, propertyName: sixTimepicker_types.SixTimePropertyName.HOURS });
+  }
+  is24HourClock() {
+    return this.format.includes(sixTimepicker_types.TIME_FORMAT_CHAR.HOUR_24);
+  }
+  getHour12Picker() {
+    if (!this.is12HourClock()) {
+      return;
+    }
+    return this.getSixTimeUnitPicker({ min: 0, max: 11, propertyName: sixTimepicker_types.SixTimePropertyName.HOURS });
+  }
+  is12HourClock() {
+    return this.format.includes(sixTimepicker_types.TIME_FORMAT_CHAR.HOUR_12);
+  }
+  getAmPmPicker() {
+    if (!this.is12HourClock()) {
+      return;
+    }
+    const items = ['AM', 'PM'];
+    return this.getSixTimeUnitPicker({
+      items,
+      type: types.ItemPickerType.CUSTOM,
+      propertyName: sixTimepicker_types.SixTimePropertyName.PERIOD,
+    });
+  }
+  getMinutePicker() {
+    if (!this.format.includes(sixTimepicker_types.TIME_FORMAT_CHAR.MINUTE)) {
+      return;
+    }
+    return this.getSixTimeUnitPicker({ min: 0, max: 59, propertyName: sixTimepicker_types.SixTimePropertyName.MINUTES });
+  }
+  getSecondsPicker() {
+    if (!this.format.includes(sixTimepicker_types.TIME_FORMAT_CHAR.SECOND)) {
+      return;
+    }
+    return this.getSixTimeUnitPicker({ min: 0, max: 59, propertyName: sixTimepicker_types.SixTimePropertyName.SECONDS });
+  }
+  getMillisecondsPicker() {
+    if (!this.format.includes(sixTimepicker_types.TIME_FORMAT_CHAR.MILLISECOND)) {
+      return;
+    }
+    return this.getSixTimeUnitPicker({
+      min: 0,
+      max: 999,
+      class: 'timepicker__item--wide',
+      paddingLength: 3,
+      propertyName: sixTimepicker_types.SixTimePropertyName.MILLISECONDS,
+    });
+  }
+  getSeparator() {
+    return (index.h("div", { class: "timepicker__separator" }, index.h("span", null, this.separator)));
+  }
+  getContent() {
+    const elementsInOrder = [
+      this.getHour24Picker(),
+      this.getHour12Picker(),
+      this.getMinutePicker(),
+      this.getSecondsPicker(),
+      this.getMillisecondsPicker(),
+    ];
+    const visibleElements = elementsInOrder.filter((el) => el !== undefined);
+    return visibleElements.map((el, idx) => {
+      if (idx === visibleElements.length - 1) {
+        return [el];
+      }
+      return [el, this.getSeparator()];
+    });
+  }
+  openPopup() {
+    if (!this.open && !this.disabled) {
+      this.open = true;
+      this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);
+    }
+  }
+  closePopup() {
+    if (this.inline) {
+      return;
+    }
+    this.open = false;
+    this.eventListeners.remove(document, 'mousedown', this.handleDocumentMouseDown);
+  }
+  renderClearable() {
+    return (this.clearable && (index.h("button", { slot: "suffix", class: {
+        timepicker_clear: true,
+        'timepicker_clear--right': this.iconPosition === 'left',
+        'timepicker_clear--left': this.iconPosition === 'right',
+      }, type: "button", onClick: this.handleClearClick, tabindex: "-1" }, index.h("six-icon", { size: "small" }, "clear"))));
+  }
+  renderCustomIcon() {
+    const icon = slot.hasSlot(this.host, 'custom-icon') ? (index.h("slot", { name: "custom-icon" })) : (index.h("six-icon", { size: this.size === 'large' ? 'medium' : this.size }, "watch_later"));
+    return (index.h("span", { slot: "prefix", part: "icon", class: {
+        prefix: true,
+        'prefix--right': this.iconPosition === 'right',
+      } }, icon));
+  }
+  calcIsDropDownContentUp() {
+    if (!this.inputElement || !this.wrapper) {
+      return;
+    }
+    const inputBoundingRect = this.inputElement.getBoundingClientRect();
+    const wrapperBoundingRect = this.wrapper.getBoundingClientRect();
+    const minPopupHeight = Math.max(wrapperBoundingRect.height, MIN_POPUP_HEIGHT);
+    const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;
+    this.isDropDownContentUp = moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + minPopupHeight;
+  }
+  /*
+   * If the popup is hoisted we popup is hoisted its position will change to fix to not be clipped of by a containing container.
+   * To render the popup correctly we render it normally, and then assign this screenposition to the fixed popup
+   */
+  adjustPopupForHoisting() {
+    if (!this.hoist) {
+      return;
+    }
+    // execute after dropdown has been rendered to make sure the popup reference is correctly set
+    setTimeout(() => {
+      if (!this.popup) {
+        return;
+      }
+      // take a snapshot of normally rendered popup
+      const popupBoundingClientRect = this.popup.getBoundingClientRect();
+      // apply screen position to fixed popup
+      this.popup.style.position = 'fixed';
+      ['top', 'left', 'width', 'height'].forEach((property) => {
+        this.popup.style[property] = `${popupBoundingClientRect[property]}px`;
+      });
+      const inputBoundingClientRect = this.inputElement.getBoundingClientRect();
+      const inputTop = inputBoundingClientRect.top;
+      const popupTop = popupBoundingClientRect.top;
+      this.calcIsDropDownContentUp();
+      // check screen position to check whether the popup should be moved above or below the trigger element
+      if (this.isDropDownContentUp && inputTop < popupTop) {
+        //  move popup above input field if timepicker is at bottom of screen
+        this.popup.style.top = `${popupTop - popupBoundingClientRect.height - inputBoundingClientRect.height}px`;
+      }
+    }, 0);
+  }
+  render() {
+    this.adjustPopupForHoisting();
+    return (index.h("div", { part: "container", ref: (el) => (this.wrapper = el), class: "timepicker__container" }, index.h("six-input", { ref: (el) => (this.inputElement = el), part: "input", onClick: () => this.openPopup(), value: this.value, placeholder: this.placeholder, readonly: this.readonly, disabled: this.disabled, size: this.size, name: this.name, label: this.label, required: this.required, "error-text": this.errorText, "error-on-blur": this.errorOnBlur, class: {
+        'input--empty': !this.value,
+        'input--hide': this.inline,
+      } }, this.renderCustomIcon(), this.renderClearable(), slot.hasSlot(this.host, 'error-text') ? (index.h("span", { slot: "error-text" }, index.h("slot", { name: "error-text" }))) : null, slot.hasSlot(this.host, 'label') ? (index.h("span", { slot: "label" }, index.h("slot", { name: "label" }))) : null), this.open && (index.h("div", { ref: (el) => (this.popup = el), part: "popup", class: {
+        timepicker__popup: true,
+        'timepicker__popup--is-up': this.placement ? this.placement === 'top' : this.isPopupContentUp,
+        'timepicker__popup--is-inline': this.inline,
+      } }, ...this.getContent(), this.getAmPmPicker()))));
+  }
+  get host() { return index.getElement(this); }
+  static get watchers() { return {
+    "debounce": ["debounceChanged"],
+    "value": ["valueChanged"]
+  }; }
+};
+SixTimepicker.style = sixTimepickerCss;
+
+exports.six_timepicker = SixTimepicker;

package/dist/cjs/six-timepicker.types-c58cc88b.js

@@ -0,0 +1,54 @@
+'use strict';
+
+const isString = (value) => typeof value === 'string';
+// only use '==' instead of '===' to also catch undefined and void
+const isNil = (value) => value == null;
+const isDate = (value) => value instanceof Date;
+const isNumber = (value) => value === 'number';
+
+/*
+ * Defines the different time periods for the 12-hour-clock
+ */
+exports.SixTimePeriod = void 0;
+(function (SixTimePeriod) {
+  SixTimePeriod["AM"] = "AM";
+  SixTimePeriod["PM"] = "PM";
+})(exports.SixTimePeriod || (exports.SixTimePeriod = {}));
+exports.SixTimePropertyName = void 0;
+(function (SixTimePropertyName) {
+  SixTimePropertyName["HOURS"] = "hours";
+  SixTimePropertyName["MINUTES"] = "minutes";
+  SixTimePropertyName["SECONDS"] = "seconds";
+  SixTimePropertyName["MILLISECONDS"] = "milliseconds";
+  SixTimePropertyName["HAS_24_HOURS"] = "has24Hours";
+  SixTimePropertyName["PERIOD"] = "period";
+})(exports.SixTimePropertyName || (exports.SixTimePropertyName = {}));
+/*
+ * Defines the different time units allowed to use in a timestring
+ */
+exports.TIME_FORMAT_CHAR = void 0;
+(function (TIME_FORMAT_CHAR) {
+  TIME_FORMAT_CHAR["HOUR_24"] = "HH";
+  TIME_FORMAT_CHAR["HOUR_12"] = "hh";
+  TIME_FORMAT_CHAR["MINUTE"] = "mm";
+  TIME_FORMAT_CHAR["SECOND"] = "ss";
+  TIME_FORMAT_CHAR["MILLISECOND"] = "ms";
+  TIME_FORMAT_CHAR["PERIOD"] = "aa";
+})(exports.TIME_FORMAT_CHAR || (exports.TIME_FORMAT_CHAR = {}));
+/*
+ * Defines a mapping from the time format unit characters to the sixTime property name
+ */
+const TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP = {
+  [exports.TIME_FORMAT_CHAR.HOUR_24]: 'hours',
+  [exports.TIME_FORMAT_CHAR.HOUR_12]: 'hours',
+  [exports.TIME_FORMAT_CHAR.MINUTE]: 'minutes',
+  [exports.TIME_FORMAT_CHAR.SECOND]: 'seconds',
+  [exports.TIME_FORMAT_CHAR.MILLISECOND]: 'milliseconds',
+  [exports.TIME_FORMAT_CHAR.PERIOD]: 'period',
+};
+
+exports.TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP = TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP;
+exports.isDate = isDate;
+exports.isNil = isNil;
+exports.isNumber = isNumber;
+exports.isString = isString;