@mtes-mct/monitor-ui 1.7.2 → 1.7.3

package/index.js

@@ -0,0 +1,3424 @@
+import styled, { createGlobalStyle, css, ThemeProvider as ThemeProvider$1 } from 'styled-components';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useMemo, useCallback, useReducer, forwardRef, useRef, useImperativeHandle, useState, useEffect } from 'react';
+import { Checkbox as Checkbox$1, DateRangePicker as DateRangePicker$1, DatePicker as DatePicker$1, TagPicker, Radio, SelectPicker, Input } from 'rsuite';
+import { useField, useFormikContext } from 'formik';
+
+/* eslint-disable sort-keys-fix/sort-keys-fix, typescript-sort-keys/string-enum */
+
+var constants = /*#__PURE__*/Object.freeze({
+    __proto__: null
+});
+
+/* eslint-disable sort-keys-fix/sort-keys-fix, typescript-sort-keys/interface */
+const THEME = {
+    // https://xd.adobe.com/view/b6d4c472-3fbe-4dec-9f14-38fe03872a3e-e387/screen/b9bdc1ba-5f07-4c4f-bd44-2d38b2c6f663/specs/
+    color: {
+        /** INTERFACE COLORS */
+        // Neutral Colors
+        gunMetal: '#282F3E',
+        // TODO Make that charcoal object 100 & 50
+        charcoal: '#3B4559',
+        charcoalShadow: 'rgba(59, 69, 89, 0.5)',
+        slateGray: '#707785',
+        lightGray: '#CCCFD6',
+        gainsboro: '#E5E5EB',
+        cultured: '#F7F7FA',
+        white: '#FFFFFF',
+        // Accentuation Colors
+        blueYonder: {
+            25: '#D4DDE7',
+            100: '#567A9E'
+        },
+        blueGray: {
+            100: '#5697D2',
+            25: '#D4E5F4'
+        },
+        babyBlueEyes: '#99C9FF',
+        // Notification Colors
+        mediumSeaGreen: '#29B361',
+        goldenPoppy: '#FAC11A',
+        maximumRed: '#E1000F',
+        /** CONTEXTUAL COLORS */
+        // Risk Factor
+        cadetGray: '#8E9A9F',
+        grullo: '#B89B8C',
+        copperRed: '#CF6A4E',
+        chineseRed: '#A13112',
+        // Vessel Track
+        darkCornflowerBlue: '#2A4670',
+        jungleGreen: '#1C9B7B',
+        // Beacon Malfunction
+        powderBlue: '#9ED7D9',
+        wheat: '#EDD6A4',
+        // goldenPoppy: '#FAC11A',
+        // maximumRed: '#E1000F',
+        // charcoal: '#3B4559',
+        // mediumSeaGreen: '#29B361',
+        opal: '#A5BCC0',
+        // Regulation Areas
+        yaleBlue: '#295375',
+        glaucous: '#6284A6',
+        blueNcs: '#3690C0',
+        iceberg: '#67A9CF',
+        lightSteelBlue: '#9AB4D6',
+        lightPeriwinkle: '#CDCFEA',
+        aliceBlue: '#EBF0F4',
+        lightCyan: '#C7EAE5',
+        middleBlueGreen: '#91CFC9',
+        verdigris: '#56B3AB',
+        viridianGreen: '#01A29D',
+        paoloVeroneseGreen: '#21977F',
+        skobeloff: '#01686B',
+        blueSapphire: '#01536A',
+        indigoDye: '#033E54',
+        lightCoral: '#FA8282'
+    }
+};
+
+const Field$2 = styled.div `
+  display: flex;
+  flex-direction: column;
+`;
+
+function Fieldset(nativeProps) {
+    return jsx(StyledField, { as: "fieldset", ...nativeProps });
+}
+const StyledField = styled(Field$2) `
+  border: 0;
+  margin: 0;
+  padding: 0;
+`;
+
+const Label = styled.label `
+  color: ${p => p.theme.color.slateGray};
+  display: ${p => (p.isHidden ? 'none' : 'table')};
+  font-size: 13px;
+  line-height: 1.4;
+  margin-bottom: 0.5rem;
+`;
+
+function Legend({ isHidden = false, ...nativeProps }) {
+    return jsx(Label, { as: "legend", isHidden: isHidden, ...nativeProps });
+}
+
+function Checkbox({ label, onChange, ...originalProps }) {
+    const key = useMemo(() => `${originalProps.name}-${String(originalProps.defaultChecked)}`, [originalProps.defaultChecked, originalProps.name]);
+    const handleChange = useCallback((_, isChecked) => {
+        if (!onChange) {
+            return;
+        }
+        onChange(isChecked);
+    }, [onChange]);
+    return (jsx(Checkbox$1, { id: originalProps.name, onChange: handleChange, ...originalProps, children: label }, key));
+}
+
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+/**
+ * lodash (Custom Build) <https://lodash.com/>
+ * Build: `lodash modularize exports="npm" -o ./`
+ * Copyright jQuery Foundation and other contributors <https://jquery.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */
+
+/** Used as the `TypeError` message for "Functions" methods. */
+var FUNC_ERROR_TEXT = 'Expected a function';
+
+/** Used as references for various `Number` constants. */
+var NAN = 0 / 0;
+
+/** `Object#toString` result references. */
+var symbolTag = '[object Symbol]';
+
+/** Used to match leading and trailing whitespace. */
+var reTrim = /^\s+|\s+$/g;
+
+/** Used to detect bad signed hexadecimal string values. */
+var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
+
+/** Used to detect binary string values. */
+var reIsBinary = /^0b[01]+$/i;
+
+/** Used to detect octal string values. */
+var reIsOctal = /^0o[0-7]+$/i;
+
+/** Built-in method references without a dependency on `root`. */
+var freeParseInt = parseInt;
+
+/** Detect free variable `global` from Node.js. */
+var freeGlobal = typeof commonjsGlobal == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
+
+/** Detect free variable `self`. */
+var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
+
+/** Used as a reference to the global object. */
+var root = freeGlobal || freeSelf || Function('return this')();
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/**
+ * Used to resolve the
+ * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+ * of values.
+ */
+var objectToString = objectProto.toString;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeMax = Math.max,
+    nativeMin = Math.min;
+
+/**
+ * Gets the timestamp of the number of milliseconds that have elapsed since
+ * the Unix epoch (1 January 1970 00:00:00 UTC).
+ *
+ * @static
+ * @memberOf _
+ * @since 2.4.0
+ * @category Date
+ * @returns {number} Returns the timestamp.
+ * @example
+ *
+ * _.defer(function(stamp) {
+ *   console.log(_.now() - stamp);
+ * }, _.now());
+ * // => Logs the number of milliseconds it took for the deferred invocation.
+ */
+var now = function() {
+  return root.Date.now();
+};
+
+/**
+ * Creates a debounced function that delays invoking `func` until after `wait`
+ * milliseconds have elapsed since the last time the debounced function was
+ * invoked. The debounced function comes with a `cancel` method to cancel
+ * delayed `func` invocations and a `flush` method to immediately invoke them.
+ * Provide `options` to indicate whether `func` should be invoked on the
+ * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
+ * with the last arguments provided to the debounced function. Subsequent
+ * calls to the debounced function return the result of the last `func`
+ * invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the debounced function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+ * for details over the differences between `_.debounce` and `_.throttle`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to debounce.
+ * @param {number} [wait=0] The number of milliseconds to delay.
+ * @param {Object} [options={}] The options object.
+ * @param {boolean} [options.leading=false]
+ *  Specify invoking on the leading edge of the timeout.
+ * @param {number} [options.maxWait]
+ *  The maximum time `func` is allowed to be delayed before it's invoked.
+ * @param {boolean} [options.trailing=true]
+ *  Specify invoking on the trailing edge of the timeout.
+ * @returns {Function} Returns the new debounced function.
+ * @example
+ *
+ * // Avoid costly calculations while the window size is in flux.
+ * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
+ *
+ * // Invoke `sendMail` when clicked, debouncing subsequent calls.
+ * jQuery(element).on('click', _.debounce(sendMail, 300, {
+ *   'leading': true,
+ *   'trailing': false
+ * }));
+ *
+ * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
+ * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
+ * var source = new EventSource('/stream');
+ * jQuery(source).on('message', debounced);
+ *
+ * // Cancel the trailing debounced invocation.
+ * jQuery(window).on('popstate', debounced.cancel);
+ */
+function debounce(func, wait, options) {
+  var lastArgs,
+      lastThis,
+      maxWait,
+      result,
+      timerId,
+      lastCallTime,
+      lastInvokeTime = 0,
+      leading = false,
+      maxing = false,
+      trailing = true;
+
+  if (typeof func != 'function') {
+    throw new TypeError(FUNC_ERROR_TEXT);
+  }
+  wait = toNumber(wait) || 0;
+  if (isObject(options)) {
+    leading = !!options.leading;
+    maxing = 'maxWait' in options;
+    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+
+  function invokeFunc(time) {
+    var args = lastArgs,
+        thisArg = lastThis;
+
+    lastArgs = lastThis = undefined;
+    lastInvokeTime = time;
+    result = func.apply(thisArg, args);
+    return result;
+  }
+
+  function leadingEdge(time) {
+    // Reset any `maxWait` timer.
+    lastInvokeTime = time;
+    // Start the timer for the trailing edge.
+    timerId = setTimeout(timerExpired, wait);
+    // Invoke the leading edge.
+    return leading ? invokeFunc(time) : result;
+  }
+
+  function remainingWait(time) {
+    var timeSinceLastCall = time - lastCallTime,
+        timeSinceLastInvoke = time - lastInvokeTime,
+        result = wait - timeSinceLastCall;
+
+    return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;
+  }
+
+  function shouldInvoke(time) {
+    var timeSinceLastCall = time - lastCallTime,
+        timeSinceLastInvoke = time - lastInvokeTime;
+
+    // Either this is the first call, activity has stopped and we're at the
+    // trailing edge, the system time has gone backwards and we're treating
+    // it as the trailing edge, or we've hit the `maxWait` limit.
+    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
+      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
+  }
+
+  function timerExpired() {
+    var time = now();
+    if (shouldInvoke(time)) {
+      return trailingEdge(time);
+    }
+    // Restart the timer.
+    timerId = setTimeout(timerExpired, remainingWait(time));
+  }
+
+  function trailingEdge(time) {
+    timerId = undefined;
+
+    // Only invoke if we have `lastArgs` which means `func` has been
+    // debounced at least once.
+    if (trailing && lastArgs) {
+      return invokeFunc(time);
+    }
+    lastArgs = lastThis = undefined;
+    return result;
+  }
+
+  function cancel() {
+    if (timerId !== undefined) {
+      clearTimeout(timerId);
+    }
+    lastInvokeTime = 0;
+    lastArgs = lastCallTime = lastThis = timerId = undefined;
+  }
+
+  function flush() {
+    return timerId === undefined ? result : trailingEdge(now());
+  }
+
+  function debounced() {
+    var time = now(),
+        isInvoking = shouldInvoke(time);
+
+    lastArgs = arguments;
+    lastThis = this;
+    lastCallTime = time;
+
+    if (isInvoking) {
+      if (timerId === undefined) {
+        return leadingEdge(lastCallTime);
+      }
+      if (maxing) {
+        // Handle invocations in a tight loop.
+        timerId = setTimeout(timerExpired, wait);
+        return invokeFunc(lastCallTime);
+      }
+    }
+    if (timerId === undefined) {
+      timerId = setTimeout(timerExpired, wait);
+    }
+    return result;
+  }
+  debounced.cancel = cancel;
+  debounced.flush = flush;
+  return debounced;
+}
+
+/**
+ * Creates a throttled function that only invokes `func` at most once per
+ * every `wait` milliseconds. The throttled function comes with a `cancel`
+ * method to cancel delayed `func` invocations and a `flush` method to
+ * immediately invoke them. Provide `options` to indicate whether `func`
+ * should be invoked on the leading and/or trailing edge of the `wait`
+ * timeout. The `func` is invoked with the last arguments provided to the
+ * throttled function. Subsequent calls to the throttled function return the
+ * result of the last `func` invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the throttled function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+ * for details over the differences between `_.throttle` and `_.debounce`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to throttle.
+ * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
+ * @param {Object} [options={}] The options object.
+ * @param {boolean} [options.leading=true]
+ *  Specify invoking on the leading edge of the timeout.
+ * @param {boolean} [options.trailing=true]
+ *  Specify invoking on the trailing edge of the timeout.
+ * @returns {Function} Returns the new throttled function.
+ * @example
+ *
+ * // Avoid excessively updating the position while scrolling.
+ * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
+ *
+ * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
+ * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
+ * jQuery(element).on('click', throttled);
+ *
+ * // Cancel the trailing throttled invocation.
+ * jQuery(window).on('popstate', throttled.cancel);
+ */
+function throttle(func, wait, options) {
+  var leading = true,
+      trailing = true;
+
+  if (typeof func != 'function') {
+    throw new TypeError(FUNC_ERROR_TEXT);
+  }
+  if (isObject(options)) {
+    leading = 'leading' in options ? !!options.leading : leading;
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+  return debounce(func, wait, {
+    'leading': leading,
+    'maxWait': wait,
+    'trailing': trailing
+  });
+}
+
+/**
+ * Checks if `value` is the
+ * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
+ * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an object, else `false`.
+ * @example
+ *
+ * _.isObject({});
+ * // => true
+ *
+ * _.isObject([1, 2, 3]);
+ * // => true
+ *
+ * _.isObject(_.noop);
+ * // => true
+ *
+ * _.isObject(null);
+ * // => false
+ */
+function isObject(value) {
+  var type = typeof value;
+  return !!value && (type == 'object' || type == 'function');
+}
+
+/**
+ * Checks if `value` is object-like. A value is object-like if it's not `null`
+ * and has a `typeof` result of "object".
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
+ * @example
+ *
+ * _.isObjectLike({});
+ * // => true
+ *
+ * _.isObjectLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isObjectLike(_.noop);
+ * // => false
+ *
+ * _.isObjectLike(null);
+ * // => false
+ */
+function isObjectLike(value) {
+  return !!value && typeof value == 'object';
+}
+
+/**
+ * Checks if `value` is classified as a `Symbol` primitive or object.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
+ * @example
+ *
+ * _.isSymbol(Symbol.iterator);
+ * // => true
+ *
+ * _.isSymbol('abc');
+ * // => false
+ */
+function isSymbol(value) {
+  return typeof value == 'symbol' ||
+    (isObjectLike(value) && objectToString.call(value) == symbolTag);
+}
+
+/**
+ * Converts `value` to a number.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to process.
+ * @returns {number} Returns the number.
+ * @example
+ *
+ * _.toNumber(3.2);
+ * // => 3.2
+ *
+ * _.toNumber(Number.MIN_VALUE);
+ * // => 5e-324
+ *
+ * _.toNumber(Infinity);
+ * // => Infinity
+ *
+ * _.toNumber('3.2');
+ * // => 3.2
+ */
+function toNumber(value) {
+  if (typeof value == 'number') {
+    return value;
+  }
+  if (isSymbol(value)) {
+    return NAN;
+  }
+  if (isObject(value)) {
+    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
+    value = isObject(other) ? (other + '') : other;
+  }
+  if (typeof value != 'string') {
+    return value === 0 ? value : +value;
+  }
+  value = value.replace(reTrim, '');
+  var isBinary = reIsBinary.test(value);
+  return (isBinary || reIsOctal.test(value))
+    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
+    : (reIsBadHex.test(value) ? NAN : +value);
+}
+
+var lodash_throttle = throttle;
+
+/**
+ * Force component re-rendering
+ *
+ * @see https://reactjs.org/docs/hooks-faq.html#is-there-something-like-forceupdate
+ */
+function useForceUpdate() {
+    // eslint-disable-next-line @typescript-eslint/naming-convention, @typescript-eslint/no-unused-vars
+    const [_, forceUpdate] = useReducer(x => x + 1, 0);
+    const forceDebouncedUpdate = useMemo(() => lodash_throttle(forceUpdate, 500), [forceUpdate]);
+    return { forceDebouncedUpdate, forceUpdate };
+}
+
+var dayjs_min = {exports: {}};
+
+var hasRequiredDayjs_min;
+
+function requireDayjs_min () {
+	if (hasRequiredDayjs_min) return dayjs_min.exports;
+	hasRequiredDayjs_min = 1;
+	(function (module, exports) {
+		!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",f="month",h="quarter",c="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,f),s=n-i<0,u=e.clone().add(r+(s?-1:1),f);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:f,y:c,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:h}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p=function(t){return t instanceof _},S=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},w=function(t,e){if(p(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},O=v;O.l=S,O.i=p,O.w=function(t,e){return w(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=S(t.locale,null,!0),this.parse(t);}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(O.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.$x=t.x||{},this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return O},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=w(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return w(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<w(t)},m.$g=function(t,e,n){return O.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!O.u(e)||e,h=O.p(t),l=function(t,e){var i=O.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return O.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(h){case c:return r?l(1,0):l(31,11);case f:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=O.p(t),h="set"+(this.$u?"UTC":""),l=(n={},n[a]=h+"Date",n[d]=h+"Date",n[f]=h+"Month",n[c]=h+"FullYear",n[u]=h+"Hours",n[s]=h+"Minutes",n[i]=h+"Seconds",n[r]=h+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===f||o===c){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[O.p(t)]()},m.add=function(r,h){var d,l=this;r=Number(r);var $=O.p(h),y=function(t){var e=w(l);return O.w(e.date(e.date()+Math.round(t*r)),l)};if($===f)return this.set(f,this.$M+r);if($===c)return this.set(c,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return O.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=O.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,f=n.months,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},c=function(t){return O.s(s%12||12,t,"0")},d=n.meridiem||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r},$={YY:String(this.$y).slice(-2),YYYY:this.$y,M:a+1,MM:O.s(a+1,2,"0"),MMM:h(n.monthsShort,a,f,3),MMMM:h(f,a),D:this.$D,DD:O.s(this.$D,2,"0"),d:String(this.$W),dd:h(n.weekdaysMin,this.$W,o,2),ddd:h(n.weekdaysShort,this.$W,o,3),dddd:o[this.$W],H:String(s),HH:O.s(s,2,"0"),h:c(1),hh:c(2),a:d(s,u,!0),A:d(s,u,!1),m:String(u),mm:O.s(u,2,"0"),s:String(this.$s),ss:O.s(this.$s,2,"0"),SSS:O.s(this.$ms,3,"0"),Z:i};return r.replace(y,(function(t,e){return e||$[t]||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=O.p(d),M=w(r),m=(M.utcOffset()-this.utcOffset())*e,v=this-M,g=O.m(this,M);return g=($={},$[c]=g/12,$[f]=g,$[h]=g/3,$[o]=(v-m)/6048e5,$[a]=(v-m)/864e5,$[u]=v/n,$[s]=v/e,$[i]=v/t,$)[y]||v,l?g:O.a(g)},m.daysInMonth=function(){return this.endOf(f).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=S(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return O.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),T=_.prototype;return w.prototype=T,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",f],["$y",c],["$D",d]].forEach((function(t){T[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),w.extend=function(t,e){return t.$i||(t(e,_,w),t.$i=!0),w},w.locale=S,w.isDayjs=p,w.unix=function(t){return w(1e3*t)},w.en=D[g],w.Ls=D,w.p={},w}));
+} (dayjs_min));
+	return dayjs_min.exports;
+}
+
+var dayjs_minExports = requireDayjs_min();
+
+var timezone$1 = {exports: {}};
+
+(function (module, exports) {
+	!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t={year:0,month:1,day:2,hour:3,minute:4,second:5},e={};return function(n,i,o){var r,a=function(t,n,i){void 0===i&&(i={});var o=new Date(t),r=function(t,n){void 0===n&&(n={});var i=n.timeZoneName||"short",o=t+"|"+i,r=e[o];return r||(r=new Intl.DateTimeFormat("en-US",{hour12:!1,timeZone:t,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit",timeZoneName:i}),e[o]=r),r}(n,i);return r.formatToParts(o)},u=function(e,n){for(var i=a(e,n),r=[],u=0;u<i.length;u+=1){var f=i[u],s=f.type,m=f.value,c=t[s];c>=0&&(r[c]=parseInt(m,10));}var d=r[3],l=24===d?0:d,v=r[0]+"-"+r[1]+"-"+r[2]+" "+l+":"+r[4]+":"+r[5]+":000",h=+e;return (o.utc(v).valueOf()-(h-=h%1e3))/6e4},f=i.prototype;f.tz=function(t,e){void 0===t&&(t=r);var n=this.utcOffset(),i=this.toDate(),a=i.toLocaleString("en-US",{timeZone:t}),u=Math.round((i-new Date(a))/1e3/60),f=o(a).$set("millisecond",this.$ms).utcOffset(15*-Math.round(i.getTimezoneOffset()/15)-u,!0);if(e){var s=f.utcOffset();f=f.add(n-s,"minute");}return f.$x.$timezone=t,f},f.offsetName=function(t){var e=this.$x.$timezone||o.tz.guess(),n=a(this.valueOf(),e,{timeZoneName:t}).find((function(t){return "timezonename"===t.type.toLowerCase()}));return n&&n.value};var s=f.startOf;f.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return s.call(this,t,e);var n=o(this.format("YYYY-MM-DD HH:mm:ss:SSS"));return s.call(n,t,e).tz(this.$x.$timezone,!0)},o.tz=function(t,e,n){var i=n&&e,a=n||e||r,f=u(+o(),a);if("string"!=typeof t)return o(t).tz(a);var s=function(t,e,n){var i=t-60*e*1e3,o=u(i,n);if(e===o)return [i,e];var r=u(i-=60*(o-e)*1e3,n);return o===r?[i,o]:[t-60*Math.min(o,r)*1e3,Math.max(o,r)]}(o.utc(t,i).valueOf(),f,a),m=s[0],c=s[1],d=o(m).utcOffset(c);return d.$x.$timezone=a,d},o.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},o.tz.setDefault=function(t){r=t;};}}));
+} (timezone$1));
+
+var timezone = timezone$1.exports;
+
+var utc$1 = {exports: {}};
+
+(function (module, exports) {
+	!function(t,i){module.exports=i();}(commonjsGlobal,(function(){var t="minute",i=/[+-]\d\d(?::?\d\d)?/g,e=/([+-]|\d\d)/g;return function(s,f,n){var u=f.prototype;n.utc=function(t){var i={date:t,utc:!0,args:arguments};return new f(i)},u.utc=function(i){var e=n(this.toDate(),{locale:this.$L,utc:!0});return i?e.add(this.utcOffset(),t):e},u.local=function(){return n(this.toDate(),{locale:this.$L,utc:!1})};var o=u.parse;u.parse=function(t){t.utc&&(this.$u=!0),this.$utils().u(t.$offset)||(this.$offset=t.$offset),o.call(this,t);};var r=u.init;u.init=function(){if(this.$u){var t=this.$d;this.$y=t.getUTCFullYear(),this.$M=t.getUTCMonth(),this.$D=t.getUTCDate(),this.$W=t.getUTCDay(),this.$H=t.getUTCHours(),this.$m=t.getUTCMinutes(),this.$s=t.getUTCSeconds(),this.$ms=t.getUTCMilliseconds();}else r.call(this);};var a=u.utcOffset;u.utcOffset=function(s,f){var n=this.$utils().u;if(n(s))return this.$u?0:n(this.$offset)?a.call(this):this.$offset;if("string"==typeof s&&(s=function(t){void 0===t&&(t="");var s=t.match(i);if(!s)return null;var f=(""+s[0]).match(e)||["-",0,0],n=f[0],u=60*+f[1]+ +f[2];return 0===u?0:"+"===n?u:-u}(s),null===s))return this;var u=Math.abs(s)<=16?60*s:s,o=this;if(f)return o.$offset=u,o.$u=0===s,o;if(0!==s){var r=this.$u?this.toDate().getTimezoneOffset():-1*this.utcOffset();(o=this.local().add(u+r,t)).$offset=u,o.$x.$localOffset=r;}else o=this.utc();return o};var h=u.format;u.format=function(t){var i=t||(this.$u?"YYYY-MM-DDTHH:mm:ss[Z]":"");return h.call(this,i)},u.valueOf=function(){var t=this.$utils().u(this.$offset)?0:this.$offset+(this.$x.$localOffset||this.$d.getTimezoneOffset());return this.$d.valueOf()-6e4*t},u.isUTC=function(){return !!this.$u},u.toISOString=function(){return this.toDate().toISOString()},u.toString=function(){return this.toDate().toUTCString()};var l=u.toDate;u.toDate=function(t){return "s"===t&&this.$offset?n(this.format("YYYY-MM-DD HH:mm:ss:SSS")).toDate():l.call(this)};var c=u.diff;u.diff=function(t,i,e){if(t&&this.$u===t.$u)return c.call(this,t,i,e);var s=this.local(),f=n(t).local();return c.call(s,f,i,e)};}}));
+} (utc$1));
+
+var utc = utc$1.exports;
+
+var fr$1 = {exports: {}};
+
+(function (module, exports) {
+	!function(e,n){module.exports=n(requireDayjs_min());}(commonjsGlobal,(function(e){function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=n(e),i={name:"fr",weekdays:"dimanche_lundi_mardi_mercredi_jeudi_vendredi_samedi".split("_"),weekdaysShort:"dim._lun._mar._mer._jeu._ven._sam.".split("_"),weekdaysMin:"di_lu_ma_me_je_ve_sa".split("_"),months:"janvier_février_mars_avril_mai_juin_juillet_août_septembre_octobre_novembre_décembre".split("_"),monthsShort:"janv._févr._mars_avr._mai_juin_juil._août_sept._oct._nov._déc.".split("_"),weekStart:1,yearStart:4,formats:{LT:"HH:mm",LTS:"HH:mm:ss",L:"DD/MM/YYYY",LL:"D MMMM YYYY",LLL:"D MMMM YYYY HH:mm",LLLL:"dddd D MMMM YYYY HH:mm"},relativeTime:{future:"dans %s",past:"il y a %s",s:"quelques secondes",m:"une minute",mm:"%d minutes",h:"une heure",hh:"%d heures",d:"un jour",dd:"%d jours",M:"un mois",MM:"%d mois",y:"un an",yy:"%d ans"},ordinal:function(e){return ""+e+(1===e?"er":"")}};return t.default.locale(i,null,!0),i}));
+} (fr$1));
+
+dayjs_minExports.extend(timezone);
+dayjs_minExports.extend(utc);
+dayjs_minExports.locale('fr');
+dayjs_minExports.tz.setDefault('UTC');
+
+// TODO Use `date-fns` instead of `dayjs`.
+/**
+ * Get a Dayjs instance of a UTC date treated as if it was a locally timezoned one
+ *
+ * @example
+ * `2022-01-02T03:04:05.006Z` => `2022-01-02T03:04:05.006+01:00` (or `+02:00` during DST) in Europe/Paris timezone.
+ */
+function getLocalizedDayjs(utcDate) {
+    // The number of minutes returned by getTimezoneOffset() is positive if the local time zone is behind UTC,
+    // and negative if the local time zone is ahead of UTC. For example, for UTC+10, -600 will be returned.
+    const timezoneOffsetInMinutes = utcDate.getTimezoneOffset();
+    return dayjs_minExports(utcDate).add(timezoneOffsetInMinutes, 'minutes');
+}
+
+// TODO Use `date-fns` instead of `dayjs`.
+/**
+ * Get a Dayjs instance of a locally timezoned date treated as if it was a UTC one
+ *
+ * @example
+ * `2022-01-02T03:04:05.006+01:00` => `2022-01-02T03:04:05.006Z`.
+ */
+function getUtcizedDayjs(localDate) {
+    const definedLocalDate = localDate || new Date();
+    // The number of minutes returned by getTimezoneOffset() is positive if the local time zone is behind UTC,
+    // and negative if the local time zone is ahead of UTC. For example, for UTC+10, -600 will be returned.
+    const timezoneOffsetInMinutes = definedLocalDate.getTimezoneOffset();
+    return dayjs_minExports(definedLocalDate).subtract(timezoneOffsetInMinutes, 'minutes');
+}
+
+function NumberInputWithRef({ defaultValue, max, min, onBack, onClick, onFilled, onFocus, onFormatError, onInput, onNext, onPrevious, size, ...nativeProps }, ref) {
+    const inputRef = useRef();
+    const placeholder = useMemo(() => '-'.repeat(size), [size]);
+    useImperativeHandle(ref, () => inputRef.current);
+    const handleClick = useCallback((event) => {
+        // event.stopPropagation()
+        if (onClick) {
+            onClick(event);
+        }
+    }, [onClick]);
+    const handleFocus = useCallback((event) => {
+        inputRef.current.select();
+        if (onFocus) {
+            onFocus(event);
+        }
+    }, [onFocus]);
+    const handleInput = useCallback(() => {
+        onFormatError(false);
+        const { value } = inputRef.current;
+        if (onInput) {
+            onInput(value);
+        }
+        if (value.length !== size) {
+            return;
+        }
+        const valueAsNumber = Number(inputRef.current.value);
+        if (Number.isNaN(valueAsNumber) || valueAsNumber < min || valueAsNumber > max) {
+            onFormatError(true);
+            return;
+        }
+        if (onFilled && value.length === size) {
+            onFilled();
+        }
+    }, [max, min, onFilled, onFormatError, onInput, size]);
+    const handleKeyDown = useCallback((event) => {
+        if (onPrevious &&
+            event.key === 'ArrowLeft' &&
+            inputRef.current.selectionStart === 0 &&
+            // We don't want to call that function when the user is selecting the input text
+            inputRef.current.selectionEnd === inputRef.current.selectionStart) {
+            event.preventDefault();
+            onPrevious();
+            return;
+        }
+        if (onNext &&
+            event.key === 'ArrowRight' &&
+            inputRef.current.selectionStart === inputRef.current.value.length &&
+            // We don't want to call that function when the user is selecting the input text
+            inputRef.current.selectionEnd === inputRef.current.selectionStart) {
+            event.preventDefault();
+            onNext();
+            return;
+        }
+        if (onBack && event.key === 'Backspace' && !inputRef.current.value.length) {
+            event.preventDefault();
+            onBack();
+        }
+    }, [onBack, onNext, onPrevious]);
+    return (jsx(StyledNumberInput, { ref: inputRef, defaultValue: defaultValue, maxLength: size, onClick: handleClick, onFocus: handleFocus, onInput: handleInput, onKeyDown: handleKeyDown, pattern: "\\d*", placeholder: placeholder, size: size, type: "text", ...nativeProps }, String(defaultValue)));
+}
+const NumberInput = forwardRef(NumberInputWithRef);
+const StyledNumberInput = styled.input `
+  background-color: transparent;
+  border: 0;
+  font-size: inherit;
+  outline: none;
+  padding: 0;
+  text-align: center;
+  /* 1 digit = 0.5rem */
+  width: ${p => p.size * 0.5}rem;
+
+  ::placeholder {
+    color: ${p => p.theme.color.slateGray};
+  }
+`;
+
+// TODO Use `date-fns` instead of `dayjs`.
+function formatNumberAsDoubleDigit(numberLike) {
+    return String(numberLike).padStart(2, '0');
+}
+function getDateFromDateAndTimeTuple(dateTuple, timeTuple, isEnd = false) {
+    const [year, month, day] = dateTuple;
+    const [hour, minute] = timeTuple;
+    const rawDateAsDayjs = dayjs_minExports()
+        .year(Number(year))
+        .month(Number(month) - 1)
+        .date(Number(day))
+        .hour(Number(hour))
+        .minute(Number(minute));
+    return isEnd
+        ? rawDateAsDayjs
+            .endOf('minute')
+            // TODO For some reason the API can't handle miliseconds in dates.
+            // That's why we set it to 0 (instead of 999)
+            .millisecond(0)
+            .toDate()
+        : rawDateAsDayjs.startOf('minute').toDate();
+}
+function getDateTupleFromDate(date) {
+    if (!date) {
+        return undefined;
+    }
+    return [
+        String(date.getFullYear()),
+        formatNumberAsDoubleDigit(date.getMonth() + 1),
+        formatNumberAsDoubleDigit(date.getDate())
+    ];
+}
+/**
+ * Generate a list of ranged time options.
+ *
+ * @example
+ * ```
+ * (minutesRange = 30) => ([
+ *   { label: '00:00', value: ['00', '00'] },
+ *   { label: '00:30', value: ['00', '30'] },
+ *   { label: '01:00', value: ['01', '00'] },
+ *   { label: '01:30', value: ['01', '30'] },
+ *   { label: '02:00', value: ['02', '00'] },
+ *   ...
+ * ])
+ * ```
+ */
+const getRangedTimeOptions = (minutesRange) => {
+    const perHourOptionsLength = 60 / minutesRange;
+    const totalOptionsLength = 24 * perHourOptionsLength;
+    return new Array(totalOptionsLength).fill(undefined).map((_, index) => {
+        const hour = Math.floor(index / perHourOptionsLength);
+        const minute = minutesRange * (index % perHourOptionsLength);
+        const label = `${String(hour).padStart(2, '0')}:${String(minute).padStart(2, '0')}`;
+        const value = [formatNumberAsDoubleDigit(hour), formatNumberAsDoubleDigit(minute)];
+        return {
+            label,
+            value
+        };
+    });
+};
+function getTimeTupleFromDate(date) {
+    if (!date) {
+        return undefined;
+    }
+    return [formatNumberAsDoubleDigit(date.getHours()), formatNumberAsDoubleDigit(date.getMinutes())];
+}
+
+function DateInputWithRef({ defaultValue, isEndDate = false, isForcedFocused, isStartDate = false, onBack, onChange, onClick, onNext, onPrevious }, ref) {
+    const boxSpanRef = useRef();
+    const dayInputRef = useRef();
+    const monthInputRef = useRef();
+    const yearInputRef = useRef();
+    const [hasFormatError, setHasFormatError] = useState(false);
+    const [hasValidationError, setHasValidationError] = useState(false);
+    const [isFocused, setIsFocused] = useState(false);
+    useImperativeHandle(ref, () => ({
+        boxSpan: boxSpanRef.current,
+        focus: (isInLastInputOfTheGroup = false) => {
+            if (isInLastInputOfTheGroup) {
+                yearInputRef.current.focus();
+            }
+            else {
+                dayInputRef.current.focus();
+            }
+        }
+    }));
+    const currentUtcYear = useMemo(() => getUtcizedDayjs().year(), []);
+    const handleBlur = useCallback(() => {
+        setIsFocused(false);
+    }, []);
+    const handleFocus = useCallback(() => {
+        setIsFocused(true);
+    }, []);
+    const handleFormatError = useCallback((hasNextFormatError) => {
+        setHasFormatError(hasNextFormatError);
+    }, []);
+    const submit = useCallback(() => {
+        setHasValidationError(false);
+        switch (window.document.activeElement) {
+            case dayInputRef.current:
+                monthInputRef.current.focus();
+                break;
+            case monthInputRef.current:
+                yearInputRef.current.focus();
+                break;
+        }
+        if (!yearInputRef.current.value.length ||
+            !monthInputRef.current.value.length ||
+            !dayInputRef.current.value.length) {
+            if ((monthInputRef.current.value.length && !dayInputRef.current.value.length) ||
+                (yearInputRef.current.value.length &&
+                    (!dayInputRef.current.value.length || !monthInputRef.current.value.length))) {
+                setHasValidationError(true);
+            }
+            return;
+        }
+        const nextDateTuple = [
+            String(yearInputRef.current.value),
+            formatNumberAsDoubleDigit(monthInputRef.current.value),
+            formatNumberAsDoubleDigit(dayInputRef.current.value)
+        ];
+        onChange(nextDateTuple);
+    }, [onChange]);
+    return (jsxs(Box$6, { ref: boxSpanRef, hasError: hasFormatError || hasValidationError, isFocused: isForcedFocused || isFocused, children: [isStartDate && 'Du ', isEndDate && 'Au ', jsx(NumberInput, { ref: dayInputRef, "data-cy": `date-range-picker-${isStartDate ? 'start' : 'end'}-day`, defaultValue: defaultValue && formatNumberAsDoubleDigit(defaultValue[2]), max: 31, min: 1, onBack: onBack, onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: () => monthInputRef.current.focus(), onPrevious: onPrevious, size: 2 }), "/", jsx(NumberInput, { ref: monthInputRef, "data-cy": `date-range-picker-${isStartDate ? 'start' : 'end'}-month`, defaultValue: defaultValue && formatNumberAsDoubleDigit(defaultValue[1]), max: 12, min: 1, onBack: () => dayInputRef.current.focus(), onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: () => yearInputRef.current.focus(), onPrevious: () => dayInputRef.current.focus(), size: 2 }), "/", jsx(NumberInput, { ref: yearInputRef, "data-cy": `date-range-picker-${isStartDate ? 'start' : 'end'}-year`, defaultValue: defaultValue && defaultValue[0], max: currentUtcYear, min: 2020, onBack: () => monthInputRef.current.focus(), onBlur: handleBlur, onClick: onClick, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: onNext, onPrevious: () => monthInputRef.current.focus(), size: 4 })] }));
+}
+const DateInput = forwardRef(DateInputWithRef);
+const Box$6 = styled.span `
+  background-color: ${p => p.theme.color.gainsboro};
+  box-shadow: ${p => p.hasError || p.isFocused
+    ? `inset 0px 0px 0px 1px ${p.hasError ? p.theme.color.maximumRed : p.theme.color.blueGray[100]}`
+    : 'none'};
+  color: ${p => p.theme.color.slateGray};
+  display: inline-block;
+  font-size: inherit;
+  padding: 0.3125rem 0.5rem 0.4375rem;
+  user-select: none;
+
+  :hover {
+    box-shadow: ${p => `inset 0px 0px 0px 1px ${p.theme.color.blueYonder[100]}`};
+  }
+`;
+
+/**
+ * Capitalize the first letter of a string
+ */
+function capitalizeFirstLetter(text) {
+    return text.charAt(0).toUpperCase() + text.slice(1);
+}
+
+function getUtcDayjs() {
+    return dayjs_minExports().utc();
+}
+
+function sortDates(dates) {
+    return dates
+        .map(date => date.toISOString())
+        .sort()
+        .map(dateAsIsoString => dayjs_minExports(dateAsIsoString).toDate());
+}
+
+function stopMouseEventPropagation(event) {
+    event.stopPropagation();
+}
+
+var formatDistanceLocale = {
+  lessThanXSeconds: {
+    one: 'moins d’une seconde',
+    other: 'moins de {{count}} secondes'
+  },
+  xSeconds: {
+    one: '1 seconde',
+    other: '{{count}} secondes'
+  },
+  halfAMinute: '30 secondes',
+  lessThanXMinutes: {
+    one: 'moins d’une minute',
+    other: 'moins de {{count}} minutes'
+  },
+  xMinutes: {
+    one: '1 minute',
+    other: '{{count}} minutes'
+  },
+  aboutXHours: {
+    one: 'environ 1 heure',
+    other: 'environ {{count}} heures'
+  },
+  xHours: {
+    one: '1 heure',
+    other: '{{count}} heures'
+  },
+  xDays: {
+    one: '1 jour',
+    other: '{{count}} jours'
+  },
+  aboutXWeeks: {
+    one: 'environ 1 semaine',
+    other: 'environ {{count}} semaines'
+  },
+  xWeeks: {
+    one: '1 semaine',
+    other: '{{count}} semaines'
+  },
+  aboutXMonths: {
+    one: 'environ 1 mois',
+    other: 'environ {{count}} mois'
+  },
+  xMonths: {
+    one: '1 mois',
+    other: '{{count}} mois'
+  },
+  aboutXYears: {
+    one: 'environ 1 an',
+    other: 'environ {{count}} ans'
+  },
+  xYears: {
+    one: '1 an',
+    other: '{{count}} ans'
+  },
+  overXYears: {
+    one: 'plus d’un an',
+    other: 'plus de {{count}} ans'
+  },
+  almostXYears: {
+    one: 'presqu’un an',
+    other: 'presque {{count}} ans'
+  }
+};
+
+var formatDistance = function formatDistance(token, count, options) {
+  var result;
+  var form = formatDistanceLocale[token];
+
+  if (typeof form === 'string') {
+    result = form;
+  } else if (count === 1) {
+    result = form.one;
+  } else {
+    result = form.other.replace('{{count}}', String(count));
+  }
+
+  if (options !== null && options !== void 0 && options.addSuffix) {
+    if (options.comparison && options.comparison > 0) {
+      return 'dans ' + result;
+    } else {
+      return 'il y a ' + result;
+    }
+  }
+
+  return result;
+};
+
+function buildFormatLongFn(args) {
+  return function () {
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    // TODO: Remove String()
+    var width = options.width ? String(options.width) : args.defaultWidth;
+    var format = args.formats[width] || args.formats[args.defaultWidth];
+    return format;
+  };
+}
+
+var dateFormats = {
+  full: 'EEEE d MMMM y',
+  long: 'd MMMM y',
+  medium: 'd MMM y',
+  short: 'dd/MM/y'
+};
+var timeFormats = {
+  full: 'HH:mm:ss zzzz',
+  long: 'HH:mm:ss z',
+  medium: 'HH:mm:ss',
+  short: 'HH:mm'
+};
+var dateTimeFormats = {
+  full: "{{date}} 'à' {{time}}",
+  long: "{{date}} 'à' {{time}}",
+  medium: '{{date}}, {{time}}',
+  short: '{{date}}, {{time}}'
+};
+var formatLong = {
+  date: buildFormatLongFn({
+    formats: dateFormats,
+    defaultWidth: 'full'
+  }),
+  time: buildFormatLongFn({
+    formats: timeFormats,
+    defaultWidth: 'full'
+  }),
+  dateTime: buildFormatLongFn({
+    formats: dateTimeFormats,
+    defaultWidth: 'full'
+  })
+};
+
+var formatRelativeLocale = {
+  lastWeek: "eeee 'dernier à' p",
+  yesterday: "'hier à' p",
+  today: "'aujourd’hui à' p",
+  tomorrow: "'demain à' p'",
+  nextWeek: "eeee 'prochain à' p",
+  other: 'P'
+};
+
+var formatRelative = function formatRelative(token, _date, _baseDate, _options) {
+  return formatRelativeLocale[token];
+};
+
+function buildLocalizeFn(args) {
+  return function (dirtyIndex, options) {
+    var context = options !== null && options !== void 0 && options.context ? String(options.context) : 'standalone';
+    var valuesArray;
+
+    if (context === 'formatting' && args.formattingValues) {
+      var defaultWidth = args.defaultFormattingWidth || args.defaultWidth;
+      var width = options !== null && options !== void 0 && options.width ? String(options.width) : defaultWidth;
+      valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth];
+    } else {
+      var _defaultWidth = args.defaultWidth;
+
+      var _width = options !== null && options !== void 0 && options.width ? String(options.width) : args.defaultWidth;
+
+      valuesArray = args.values[_width] || args.values[_defaultWidth];
+    }
+
+    var index = args.argumentCallback ? args.argumentCallback(dirtyIndex) : dirtyIndex; // @ts-ignore: For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it!
+
+    return valuesArray[index];
+  };
+}
+
+var eraValues = {
+  narrow: ['av. J.-C', 'ap. J.-C'],
+  abbreviated: ['av. J.-C', 'ap. J.-C'],
+  wide: ['avant Jésus-Christ', 'après Jésus-Christ']
+};
+var quarterValues = {
+  narrow: ['T1', 'T2', 'T3', 'T4'],
+  abbreviated: ['1er trim.', '2ème trim.', '3ème trim.', '4ème trim.'],
+  wide: ['1er trimestre', '2ème trimestre', '3ème trimestre', '4ème trimestre']
+};
+var monthValues = {
+  narrow: ['J', 'F', 'M', 'A', 'M', 'J', 'J', 'A', 'S', 'O', 'N', 'D'],
+  abbreviated: ['janv.', 'févr.', 'mars', 'avr.', 'mai', 'juin', 'juil.', 'août', 'sept.', 'oct.', 'nov.', 'déc.'],
+  wide: ['janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre']
+};
+var dayValues = {
+  narrow: ['D', 'L', 'M', 'M', 'J', 'V', 'S'],
+  short: ['di', 'lu', 'ma', 'me', 'je', 've', 'sa'],
+  abbreviated: ['dim.', 'lun.', 'mar.', 'mer.', 'jeu.', 'ven.', 'sam.'],
+  wide: ['dimanche', 'lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi']
+};
+var dayPeriodValues = {
+  narrow: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'minuit',
+    noon: 'midi',
+    morning: 'mat.',
+    afternoon: 'ap.m.',
+    evening: 'soir',
+    night: 'mat.'
+  },
+  abbreviated: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'minuit',
+    noon: 'midi',
+    morning: 'matin',
+    afternoon: 'après-midi',
+    evening: 'soir',
+    night: 'matin'
+  },
+  wide: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'minuit',
+    noon: 'midi',
+    morning: 'du matin',
+    afternoon: 'de l’après-midi',
+    evening: 'du soir',
+    night: 'du matin'
+  }
+};
+
+var ordinalNumber = function ordinalNumber(dirtyNumber, options) {
+  var number = Number(dirtyNumber);
+  var unit = options === null || options === void 0 ? void 0 : options.unit;
+  if (number === 0) return '0';
+  var feminineUnits = ['year', 'week', 'hour', 'minute', 'second'];
+  var suffix;
+
+  if (number === 1) {
+    suffix = unit && feminineUnits.includes(unit) ? 'ère' : 'er';
+  } else {
+    suffix = 'ème';
+  }
+
+  return number + suffix;
+};
+
+var localize = {
+  ordinalNumber: ordinalNumber,
+  era: buildLocalizeFn({
+    values: eraValues,
+    defaultWidth: 'wide'
+  }),
+  quarter: buildLocalizeFn({
+    values: quarterValues,
+    defaultWidth: 'wide',
+    argumentCallback: function argumentCallback(quarter) {
+      return quarter - 1;
+    }
+  }),
+  month: buildLocalizeFn({
+    values: monthValues,
+    defaultWidth: 'wide'
+  }),
+  day: buildLocalizeFn({
+    values: dayValues,
+    defaultWidth: 'wide'
+  }),
+  dayPeriod: buildLocalizeFn({
+    values: dayPeriodValues,
+    defaultWidth: 'wide'
+  })
+};
+
+function buildMatchFn(args) {
+  return function (string) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var width = options.width;
+    var matchPattern = width && args.matchPatterns[width] || args.matchPatterns[args.defaultMatchWidth];
+    var matchResult = string.match(matchPattern);
+
+    if (!matchResult) {
+      return null;
+    }
+
+    var matchedString = matchResult[0];
+    var parsePatterns = width && args.parsePatterns[width] || args.parsePatterns[args.defaultParseWidth];
+    var key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, function (pattern) {
+      return pattern.test(matchedString);
+    }) : findKey(parsePatterns, function (pattern) {
+      return pattern.test(matchedString);
+    });
+    var value;
+    value = args.valueCallback ? args.valueCallback(key) : key;
+    value = options.valueCallback ? options.valueCallback(value) : value;
+    var rest = string.slice(matchedString.length);
+    return {
+      value: value,
+      rest: rest
+    };
+  };
+}
+
+function findKey(object, predicate) {
+  for (var key in object) {
+    if (object.hasOwnProperty(key) && predicate(object[key])) {
+      return key;
+    }
+  }
+
+  return undefined;
+}
+
+function findIndex(array, predicate) {
+  for (var key = 0; key < array.length; key++) {
+    if (predicate(array[key])) {
+      return key;
+    }
+  }
+
+  return undefined;
+}
+
+function buildMatchPatternFn(args) {
+  return function (string) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var matchResult = string.match(args.matchPattern);
+    if (!matchResult) return null;
+    var matchedString = matchResult[0];
+    var parseResult = string.match(args.parsePattern);
+    if (!parseResult) return null;
+    var value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0];
+    value = options.valueCallback ? options.valueCallback(value) : value;
+    var rest = string.slice(matchedString.length);
+    return {
+      value: value,
+      rest: rest
+    };
+  };
+}
+
+var matchOrdinalNumberPattern = /^(\d+)(ième|ère|ème|er|e)?/i;
+var parseOrdinalNumberPattern = /\d+/i;
+var matchEraPatterns = {
+  narrow: /^(av\.J\.C|ap\.J\.C|ap\.J\.-C)/i,
+  abbreviated: /^(av\.J\.-C|av\.J-C|apr\.J\.-C|apr\.J-C|ap\.J-C)/i,
+  wide: /^(avant Jésus-Christ|après Jésus-Christ)/i
+};
+var parseEraPatterns = {
+  any: [/^av/i, /^ap/i]
+};
+var matchQuarterPatterns = {
+  narrow: /^T?[1234]/i,
+  abbreviated: /^[1234](er|ème|e)? trim\.?/i,
+  wide: /^[1234](er|ème|e)? trimestre/i
+};
+var parseQuarterPatterns = {
+  any: [/1/i, /2/i, /3/i, /4/i]
+};
+var matchMonthPatterns = {
+  narrow: /^[jfmasond]/i,
+  abbreviated: /^(janv|févr|mars|avr|mai|juin|juill|juil|août|sept|oct|nov|déc)\.?/i,
+  wide: /^(janvier|février|mars|avril|mai|juin|juillet|août|septembre|octobre|novembre|décembre)/i
+};
+var parseMonthPatterns = {
+  narrow: [/^j/i, /^f/i, /^m/i, /^a/i, /^m/i, /^j/i, /^j/i, /^a/i, /^s/i, /^o/i, /^n/i, /^d/i],
+  any: [/^ja/i, /^f/i, /^mar/i, /^av/i, /^ma/i, /^juin/i, /^juil/i, /^ao/i, /^s/i, /^o/i, /^n/i, /^d/i]
+};
+var matchDayPatterns = {
+  narrow: /^[lmjvsd]/i,
+  short: /^(di|lu|ma|me|je|ve|sa)/i,
+  abbreviated: /^(dim|lun|mar|mer|jeu|ven|sam)\.?/i,
+  wide: /^(dimanche|lundi|mardi|mercredi|jeudi|vendredi|samedi)/i
+};
+var parseDayPatterns = {
+  narrow: [/^d/i, /^l/i, /^m/i, /^m/i, /^j/i, /^v/i, /^s/i],
+  any: [/^di/i, /^lu/i, /^ma/i, /^me/i, /^je/i, /^ve/i, /^sa/i]
+};
+var matchDayPeriodPatterns = {
+  narrow: /^(a|p|minuit|midi|mat\.?|ap\.?m\.?|soir|nuit)/i,
+  any: /^([ap]\.?\s?m\.?|du matin|de l'après[-\s]midi|du soir|de la nuit)/i
+};
+var parseDayPeriodPatterns = {
+  any: {
+    am: /^a/i,
+    pm: /^p/i,
+    midnight: /^min/i,
+    noon: /^mid/i,
+    morning: /mat/i,
+    afternoon: /ap/i,
+    evening: /soir/i,
+    night: /nuit/i
+  }
+};
+var match = {
+  ordinalNumber: buildMatchPatternFn({
+    matchPattern: matchOrdinalNumberPattern,
+    parsePattern: parseOrdinalNumberPattern,
+    valueCallback: function valueCallback(value) {
+      return parseInt(value);
+    }
+  }),
+  era: buildMatchFn({
+    matchPatterns: matchEraPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseEraPatterns,
+    defaultParseWidth: 'any'
+  }),
+  quarter: buildMatchFn({
+    matchPatterns: matchQuarterPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseQuarterPatterns,
+    defaultParseWidth: 'any',
+    valueCallback: function valueCallback(index) {
+      return index + 1;
+    }
+  }),
+  month: buildMatchFn({
+    matchPatterns: matchMonthPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseMonthPatterns,
+    defaultParseWidth: 'any'
+  }),
+  day: buildMatchFn({
+    matchPatterns: matchDayPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseDayPatterns,
+    defaultParseWidth: 'any'
+  }),
+  dayPeriod: buildMatchFn({
+    matchPatterns: matchDayPeriodPatterns,
+    defaultMatchWidth: 'any',
+    parsePatterns: parseDayPeriodPatterns,
+    defaultParseWidth: 'any'
+  })
+};
+
+/**
+ * @type {Locale}
+ * @category Locales
+ * @summary French locale.
+ * @language French
+ * @iso-639-2 fra
+ * @author Jean Dupouy [@izeau]{@link https://github.com/izeau}
+ * @author François B [@fbonzon]{@link https://github.com/fbonzon}
+ */
+
+var locale = {
+  code: 'fr',
+  formatDistance: formatDistance,
+  formatLong: formatLong,
+  formatRelative: formatRelative,
+  localize: localize,
+  match: match,
+  options: {
+    weekStartsOn: 1
+    /* Monday */
+    ,
+    firstWeekContainsDate: 4
+  }
+};
+var fr = locale;
+
+new Array(24).fill(undefined).map((_, index) => ({
+    label: String(index).padStart(2, '0'),
+    value: index
+}));
+const RSUITE_CALENDAR_LOCALE = {
+    // TODO Why this doesn't work?
+    dateLocale: fr,
+    formattedDayPattern: 'dd/MM/yyyy',
+    formattedMonthPattern: 'MM/yyyy',
+    friday: 'V',
+    hours: 'Heures',
+    minutes: 'Minutes',
+    monday: 'L',
+    ok: 'Valider',
+    saturday: 'S',
+    seconds: 'Secondes',
+    sunday: 'D',
+    thursday: 'J',
+    today: 'Aujourd’hui',
+    tuesday: 'M',
+    wednesday: 'M',
+    yesterday: 'Hier'
+};
+var STATUS;
+(function (STATUS) {
+    STATUS["END_DATE"] = "END_DATE";
+    STATUS["NO_DATE"] = "NO_DATE";
+    STATUS["START_DATE"] = "START_DATE";
+})(STATUS || (STATUS = {}));
+
+function RangeCalendarPicker({ defaultValue, isHistorical, onChange }) {
+    const boxRef = useRef();
+    const selectedFirstDate = useRef();
+    const calendarRef = useRef();
+    const [isFirstLoad, setIsFirstLoad] = useState(true);
+    const controlledValue = useMemo(() => (defaultValue ? sortDates(defaultValue) : undefined), [defaultValue]);
+    const utcTodayAsDayjs = useMemo(() => getUtcDayjs().endOf('day'), []);
+    const disabledDate = useMemo(() => (date) => isHistorical ? getUtcizedDayjs(date).isAfter(utcTodayAsDayjs) : false, [isHistorical, utcTodayAsDayjs]);
+    const handleSelect = useCallback((nextDate) => {
+        if (!selectedFirstDate.current) {
+            selectedFirstDate.current = nextDate;
+            return;
+        }
+        const sortedDateRange = sortDates([selectedFirstDate.current, nextDate]);
+        const [startDate, endDate] = sortedDateRange;
+        const startDateTuple = getDateTupleFromDate(startDate);
+        const endDateTuple = getDateTupleFromDate(endDate);
+        const nextDateTupleRange = [startDateTuple, endDateTuple];
+        onChange(nextDateTupleRange);
+    }, [onChange]);
+    const renderTitle = useCallback((date) => capitalizeFirstLetter(dayjs_minExports(date).format('MMMM YYYY')), []);
+    useEffect(() => {
+        // We wait for the <Box /> to render so that `boxRef` is defined
+        // and can be used as a container for <RsuiteDateRangePicker />
+        setIsFirstLoad(false);
+    }, []);
+    return (jsx(Box$5, { ref: boxRef, onClick: stopMouseEventPropagation, children: !isFirstLoad && (jsx(DateRangePicker$1, { ref: calendarRef, container: boxRef.current, disabledDate: disabledDate, format: "yyyy-MM-dd", locale: RSUITE_CALENDAR_LOCALE, onSelect: handleSelect, open: true, ranges: [], renderTitle: renderTitle, 
+            // `defaultValue` seems to be immediatly cancelled so we come down to using a controlled `value`
+            value: controlledValue })) }));
+}
+const Box$5 = styled.div `
+  height: 0;
+  position: relative;
+  user-select: none;
+
+  .rs-picker-toggle {
+    display: none;
+  }
+
+  .rs-picker-daterange-panel {
+    height: 290px;
+  }
+
+  .rs-picker-daterange-menu {
+    border: solid 1px ${p => p.theme.color.lightGray};
+    border-radius: 0;
+    margin-top: 0.25rem;
+
+    .rs-picker-daterange-header,
+    .rs-calendar-header-time-toolbar,
+    .rs-picker-toolbar {
+      display: none;
+    }
+
+    .rs-calendar {
+      height: auto !important;
+      padding: 0;
+
+      :first-child {
+        border-right: solid 1px ${p => p.theme.color.lightGray};
+      }
+
+      .rs-calendar-header {
+        border-bottom: solid 1px ${p => p.theme.color.lightGray};
+        padding: 0.5rem;
+
+        .rs-calendar-header-month-toolbar {
+          align-items: center;
+          color: ${p => p.theme.color.slateGray};
+          display: flex;
+          justify-content: space-between;
+
+          .rs-calendar-header-title {
+            font-size: inherit;
+            text-transform: uppercase;
+
+            &.rs-calendar-header-error {
+              color: ${p => p.theme.color.slateGray};
+
+              :hover {
+                color: ${p => p.theme.color.slateGray};
+              }
+            }
+          }
+        }
+      }
+
+      .rs-calendar-view {
+        padding: 0.75rem 0.5rem 0;
+
+        .rs-calendar-table-cell {
+          padding: 0 0 0.25rem 0;
+          width: 33px;
+
+          &.rs-calendar-table-cell-in-range:before {
+            background-color: ${p => p.theme.color.blueGray[25]};
+            height: 33px;
+            margin-top: 0;
+          }
+
+          > .rs-calendar-table-cell-content {
+            align-items: center;
+            border-radius: 0 !important;
+            display: inline-flex;
+            height: 33px;
+            justify-content: center;
+            padding-bottom: 3px;
+            width: 33px;
+          }
+          :hover .rs-calendar-table-cell-content {
+            background-color: ${p => p.theme.color.blueYonder[25]};
+            color: ${p => p.theme.color.blueYonder[100]};
+          }
+          &[role='columnheader'] .rs-calendar-table-cell-content,
+          &[role='columnheader']:hover .rs-calendar-table-cell-content {
+            background-color: transparent;
+            color: ${p => p.theme.color.slateGray};
+          }
+          &.rs-calendar-table-cell-disabled .rs-calendar-table-cell-content {
+            background-color: transparent;
+            color: ${p => p.theme.color.lightGray};
+          }
+          &.rs-calendar-table-cell-selected > .rs-calendar-table-cell-content {
+            background-color: ${p => p.theme.color.blueGray[100]};
+          }
+        }
+      }
+    }
+  }
+`;
+
+function RangedTimePicker({ filter, minutesRange, onChange }) {
+    const rangedTimeOptions = useMemo(() => getRangedTimeOptions(minutesRange), [minutesRange]);
+    const filteredRangedTimeOptions = useMemo(() => rangedTimeOptions.filter(({ label }) => filter.test(label)), [filter, rangedTimeOptions]);
+    const [selectedOptionIndex, setSelectedOptionIndex] = useState(0);
+    const handleBoxKeyDown = useCallback((event) => {
+        if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            const nextSelectedOptionIndex = selectedOptionIndex < filteredRangedTimeOptions.length - 1 ? selectedOptionIndex + 1 : 0;
+            setSelectedOptionIndex(nextSelectedOptionIndex);
+            window.document.querySelectorAll('.js-ranged-time-picker-option')[nextSelectedOptionIndex]?.scrollIntoView();
+        }
+        if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            const nextSelectedOptionIndex = selectedOptionIndex > 0 ? selectedOptionIndex - 1 : filteredRangedTimeOptions.length - 1;
+            setSelectedOptionIndex(nextSelectedOptionIndex);
+            window.document.querySelectorAll('.js-ranged-time-picker-option')[nextSelectedOptionIndex]?.scrollIntoView();
+        }
+        if (['Enter', 'Space', 'Tab'].includes(event.key)) {
+            const selectedRangedTimeOption = filteredRangedTimeOptions[selectedOptionIndex];
+            if (!selectedRangedTimeOption) {
+                return;
+            }
+            onChange(selectedRangedTimeOption.value);
+        }
+    }, [filteredRangedTimeOptions, selectedOptionIndex, onChange]);
+    useEffect(() => {
+        window.addEventListener('keydown', handleBoxKeyDown, {
+            // eslint-disable-next-line @typescript-eslint/naming-convention
+            once: true
+        });
+        return () => {
+            window.removeEventListener('keydown', handleBoxKeyDown);
+        };
+    }, [handleBoxKeyDown]);
+    useEffect(() => {
+        setSelectedOptionIndex(0);
+    }, [filteredRangedTimeOptions]);
+    if (!filteredRangedTimeOptions.length) {
+        return jsx(Fragment, {});
+    }
+    return (jsx(Box$4, { onClick: stopMouseEventPropagation, role: "listbox", children: filteredRangedTimeOptions.map(({ label, value }, index) => (jsx(Option, { "aria-selected": false, className: "js-ranged-time-picker-option", isSelected: index === selectedOptionIndex, onClick: () => onChange(value), role: "option", tabIndex: -1, children: label }, label))) }));
+}
+const Box$4 = styled.div `
+  background-color: ${p => p.theme.color.gainsboro};
+  display: flex;
+  flex-direction: column;
+  left: -1px;
+  max-height: 10rem;
+  overflow: auto;
+  position: absolute;
+  /* Non-WebKit Firefox Compatibility */
+  scrollbar-color: ${p => p.theme.color.lightGray};
+  scrollbar-width: thin;
+  top: 2.25rem;
+  z-index: 9999;
+
+  ::-webkit-scrollbar {
+    -webkit-appearance: none;
+  }
+  ::-webkit-scrollbar:vertical {
+    width: 0.33rem;
+  }
+  ::-webkit-scrollbar-thumb {
+    border: 0;
+    background-color: ${p => p.theme.color.lightGray};
+  }
+  ::-webkit-scrollbar-track {
+    background-color: ${p => p.theme.color.gainsboro};
+  }
+`;
+const Option = styled.div `
+  background-color: ${p => (p.isSelected ? p.theme.color.blueGray[100] : 'transparent')};
+  cursor: pointer;
+  line-height: 1;
+  padding: 5px 9px 7px 8px;
+  text-align: center;
+
+  :hover {
+    background-color: ${p => (p.isSelected ? p.theme.color.blueGray[100] : p.theme.color.blueYonder[25])};
+  }
+`;
+
+function TimeInputWithRef({ defaultValue, isStartDate = false, minutesRange = 15, onBack, onChange, onFocus, onNext, onPrevious }, ref) {
+    const boxSpanRef = useRef();
+    const hourInputRef = useRef();
+    const minuteInputRef = useRef();
+    const [controlledDefaultValue, setControlledDefaultValue] = useState(defaultValue);
+    const [hasFormatError, setHasFormatError] = useState(false);
+    const [hasValidationError, setHasValidationError] = useState(false);
+    const [isFocused, setIsFocused] = useState(false);
+    useImperativeHandle(ref, () => ({
+        boxSpan: boxSpanRef.current,
+        focus: (isInLastInputOfTheGroup = false) => {
+            if (isInLastInputOfTheGroup) {
+                minuteInputRef.current.focus();
+            }
+            else {
+                hourInputRef.current.focus();
+            }
+        }
+    }));
+    const isRangedTimePickerOpenRef = useRef(false);
+    const [rangedTimePickerFilter, setRangedTimePickerFilter] = useState(/.*/);
+    const { forceUpdate } = useForceUpdate();
+    const closeRangedTimePicker = useCallback(() => {
+        isRangedTimePickerOpenRef.current = false;
+        forceUpdate();
+    }, [forceUpdate]);
+    const handleBack = useCallback(() => {
+        if (!onBack) {
+            return;
+        }
+        closeRangedTimePicker();
+        onBack();
+    }, [closeRangedTimePicker, onBack]);
+    const handleBlur = useCallback(() => {
+        setIsFocused(false);
+    }, []);
+    const handleClickOutside = useCallback((event) => {
+        const target = event.target;
+        if (hourInputRef.current.contains(target) || minuteInputRef.current.contains(target)) {
+            return;
+        }
+        closeRangedTimePicker();
+    }, [closeRangedTimePicker]);
+    const handleFocus = useCallback(() => {
+        setIsFocused(true);
+        if (onFocus) {
+            onFocus();
+        }
+    }, [onFocus]);
+    const handleFormatError = useCallback((hasNextFormatError) => {
+        setHasFormatError(hasNextFormatError);
+    }, []);
+    const handleRangedTimePickedChange = useCallback((nextTimeTuple) => {
+        closeRangedTimePicker();
+        setControlledDefaultValue(nextTimeTuple);
+        onChange(nextTimeTuple);
+    }, [closeRangedTimePicker, onChange]);
+    const handleHourInput = useCallback((nextValue) => {
+        // eslint-disable-next-line no-nested-ternary
+        const nextRangedTimePickerFilter = nextValue.length ? new RegExp(`^${nextValue}`) : /.*/;
+        setRangedTimePickerFilter(nextRangedTimePickerFilter);
+    }, []);
+    const openRangedTimePicker = useCallback(() => {
+        isRangedTimePickerOpenRef.current = true;
+        forceUpdate();
+    }, [forceUpdate]);
+    useEffect(() => {
+        window.document.addEventListener('click', handleClickOutside);
+        return () => {
+            window.document.removeEventListener('click', handleClickOutside);
+        };
+    }, [handleClickOutside]);
+    const submit = useCallback(() => {
+        setHasValidationError(false);
+        if (window.document.activeElement === hourInputRef.current) {
+            minuteInputRef.current.focus();
+        }
+        if (!hourInputRef.current.value.length || !minuteInputRef.current.value.length) {
+            if (minuteInputRef.current.value.length && !hourInputRef.current.value.length) {
+                setHasValidationError(true);
+            }
+            return;
+        }
+        closeRangedTimePicker();
+        const nextTimeTuple = [hourInputRef.current.value, minuteInputRef.current.value];
+        onChange(nextTimeTuple);
+    }, [closeRangedTimePicker, onChange]);
+    return (jsxs(Box$3, { ref: boxSpanRef, hasError: hasFormatError || hasValidationError, isFocused: isFocused, children: [jsxs(Fragment, { children: [jsx(NumberInput, { ref: hourInputRef, "data-cy": `date-range-picker-${isStartDate ? 'start' : 'end'}-hour`, defaultValue: controlledDefaultValue && controlledDefaultValue[0], max: 23, min: 0, onBack: handleBack, onBlur: handleBlur, onClick: openRangedTimePicker, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onInput: handleHourInput, onNext: () => minuteInputRef.current.focus(), onPrevious: onPrevious, size: 2 }), ":", jsx(NumberInput, { ref: minuteInputRef, "data-cy": `date-range-picker-${isStartDate ? 'start' : 'end'}-minute`, defaultValue: controlledDefaultValue && controlledDefaultValue[1], max: 59, min: 0, onBack: () => hourInputRef.current.focus(), onBlur: handleBlur, onClick: openRangedTimePicker, onFilled: submit, onFocus: handleFocus, onFormatError: handleFormatError, onNext: onNext, onPrevious: () => hourInputRef.current.focus(), size: 2 })] }), isRangedTimePickerOpenRef.current && (jsx(RangedTimePicker, { filter: rangedTimePickerFilter, minutesRange: minutesRange, onChange: handleRangedTimePickedChange }))] }));
+}
+const TimeInput = forwardRef(TimeInputWithRef);
+const Box$3 = styled.span `
+  background-color: ${p => p.theme.color.gainsboro};
+  box-shadow: ${p => p.hasError || p.isFocused
+    ? `inset 0px 0px 0px 1px ${p.hasError ? p.theme.color.maximumRed : p.theme.color.blueGray[100]}`
+    : 'none'};
+  color: ${p => p.theme.color.slateGray};
+  display: inline-block;
+  font-size: inherit;
+  padding: 0.3125rem 0.5rem 0.4375rem;
+  position: relative;
+  user-select: none;
+
+  :hover {
+    box-shadow: ${p => `inset 0px 0px 0px 1px ${p.theme.color.blueYonder[100]}`};
+  }
+`;
+
+var DateRangePosition;
+(function (DateRangePosition) {
+    DateRangePosition["END"] = "END";
+    DateRangePosition["START"] = "START";
+})(DateRangePosition || (DateRangePosition = {}));
+
+function DateRangePicker({ defaultValue, isHistorical = false, isLabelHidden = false, label, minutesRange = 15, onChange, withTime = false }) {
+    const startDateInputRef = useRef();
+    const startTimeInputRef = useRef();
+    const endDateInputRef = useRef();
+    const endTimeInputRef = useRef();
+    const isRangeCalendarPickerOpenRef = useRef(false);
+    const selectedStartDateRef = useRef(defaultValue ? getLocalizedDayjs(defaultValue[0]).toDate() : undefined);
+    const selectedEndDateRef = useRef(defaultValue ? getLocalizedDayjs(defaultValue[1]).toDate() : undefined);
+    const selectedStartDateTupleRef = useRef(getDateTupleFromDate(selectedStartDateRef.current));
+    const selectedEndDateTupleRef = useRef(getDateTupleFromDate(selectedEndDateRef.current));
+    const selectedStartTimeTupleRef = useRef(getTimeTupleFromDate(selectedStartDateRef.current));
+    const selectedEndTimeTupleRef = useRef(getTimeTupleFromDate(selectedEndDateRef.current));
+    const { forceUpdate } = useForceUpdate();
+    const rangeCalendarPickerDefaultValue = useMemo(() => selectedStartDateTupleRef.current && selectedEndDateTupleRef.current
+        ? [
+            getDateFromDateAndTimeTuple(selectedStartDateTupleRef.current, ['00', '00']),
+            getDateFromDateAndTimeTuple(selectedEndDateTupleRef.current, ['00', '00'], true)
+        ]
+        : undefined, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [selectedEndDateTupleRef.current, selectedStartDateTupleRef.current]);
+    const submit = useCallback(() => {
+        if (!onChange || !selectedStartDateRef.current || !selectedEndDateRef.current) {
+            return;
+        }
+        const utcizedStartDate = getUtcizedDayjs(selectedStartDateRef.current).toDate();
+        const utcizedEndDate = getUtcizedDayjs(selectedEndDateRef.current).toDate();
+        const nextDateRange = [utcizedStartDate, utcizedEndDate];
+        onChange(nextDateRange);
+    }, [onChange]);
+    const closeRangeCalendarPicker = useCallback(() => {
+        isRangeCalendarPickerOpenRef.current = false;
+        forceUpdate();
+    }, [forceUpdate]);
+    const handleClickOutside = useCallback((event) => {
+        const target = event.target;
+        if (startDateInputRef.current.boxSpan.contains(target) || endDateInputRef.current.boxSpan.contains(target)) {
+            return;
+        }
+        closeRangeCalendarPicker();
+    }, [closeRangeCalendarPicker]);
+    const handleEndDateInputNext = useCallback(() => {
+        if (!withTime) {
+            return;
+        }
+        endTimeInputRef.current.focus();
+    }, [withTime]);
+    const handleEndDateInputPrevious = useCallback(() => {
+        if (withTime) {
+            startTimeInputRef.current.focus(true);
+            return;
+        }
+        startDateInputRef.current.focus(true);
+    }, [withTime]);
+    const handleStartDateInputNext = useCallback(() => {
+        if (withTime) {
+            startTimeInputRef.current.focus();
+            return;
+        }
+        endDateInputRef.current.focus();
+    }, [withTime]);
+    const handleDateInputFilled = useCallback((position, nextDateTuple) => {
+        if (position === DateRangePosition.START) {
+            selectedStartDateTupleRef.current = nextDateTuple;
+            // If there is no time input or a start time has already been selected,
+            if (!withTime || selectedStartTimeTupleRef.current) {
+                // we must update the selected start date and call onChange()
+                const startTimeTuple = (withTime ? selectedStartTimeTupleRef.current : ['00', '00']);
+                const nextStartDate = getDateFromDateAndTimeTuple(nextDateTuple, startTimeTuple);
+                selectedStartDateRef.current = nextStartDate;
+                submit();
+            }
+            handleStartDateInputNext();
+        }
+        else {
+            selectedEndDateTupleRef.current = nextDateTuple;
+            // If there is no time input or an end time has already been selected,
+            if (!withTime || selectedEndTimeTupleRef.current) {
+                // we must update the selected end date and call onChange()
+                const endTimeTuple = (withTime ? selectedEndTimeTupleRef.current : ['23', '59']);
+                const nextEndDate = getDateFromDateAndTimeTuple(nextDateTuple, endTimeTuple, true);
+                selectedEndDateRef.current = nextEndDate;
+                submit();
+            }
+            handleEndDateInputNext();
+        }
+    }, [handleEndDateInputNext, handleStartDateInputNext, submit, withTime]);
+    const handleRangeCalendarPickerChange = useCallback((nextDateTupleRange) => {
+        const [nextStartDateTuple, nextEndDateTuple] = nextDateTupleRange;
+        // If this is a date picker without a time input,
+        if (!withTime) {
+            // we have to fix the start date at the beginning of the day
+            const nextStartDate = getDateFromDateAndTimeTuple(nextStartDateTuple, ['00', '00']);
+            // and the end date at the end of the day
+            const nextEndDate = getDateFromDateAndTimeTuple(nextEndDateTuple, ['23', '59'], true);
+            selectedStartDateRef.current = nextStartDate;
+            selectedEndDateRef.current = nextEndDate;
+        }
+        // If this is a date picker with a time input,
+        else {
+            // we include the selected start time if it exists, set it at the beginning of the day if not
+            const nextStartDate = getDateFromDateAndTimeTuple(nextStartDateTuple, selectedStartTimeTupleRef.current || ['00', '00']);
+            selectedStartDateRef.current = nextStartDate;
+            // we include the selected end time if it exists, set it at the end of the day if not
+            const nextEndDate = getDateFromDateAndTimeTuple(nextEndDateTuple, selectedEndTimeTupleRef.current || ['23', '59'], true);
+            selectedEndDateRef.current = nextEndDate;
+        }
+        selectedStartDateTupleRef.current = nextStartDateTuple;
+        selectedStartTimeTupleRef.current = getTimeTupleFromDate(selectedStartDateRef.current);
+        selectedEndDateTupleRef.current = nextEndDateTuple;
+        selectedEndTimeTupleRef.current = getTimeTupleFromDate(selectedEndDateRef.current);
+        closeRangeCalendarPicker();
+        forceUpdate();
+        submit();
+    }, [closeRangeCalendarPicker, forceUpdate, submit, withTime]);
+    const handleTimeInputFilled = useCallback((position, nextTimeTuple) => {
+        if (position === DateRangePosition.START) {
+            // If a start date has already been selected
+            if (selectedStartDateTupleRef.current) {
+                // we must update the selected start date accordingly and submit it
+                const nextStartDate = getDateFromDateAndTimeTuple(selectedStartDateTupleRef.current, nextTimeTuple);
+                selectedStartDateRef.current = nextStartDate;
+                submit();
+            }
+            selectedStartTimeTupleRef.current = nextTimeTuple;
+            endDateInputRef.current.focus();
+        }
+        else {
+            // If an end date has already been selected
+            if (selectedEndDateTupleRef.current) {
+                // we must update the selected end date accordingly and submit it
+                const nextEndDate = getDateFromDateAndTimeTuple(selectedEndDateTupleRef.current, nextTimeTuple, true);
+                selectedEndDateRef.current = nextEndDate;
+                submit();
+            }
+            selectedEndTimeTupleRef.current = nextTimeTuple;
+        }
+        submit();
+    }, [submit]);
+    const openRangeCalendarPicker = useCallback(() => {
+        isRangeCalendarPickerOpenRef.current = true;
+        forceUpdate();
+    }, [forceUpdate]);
+    useEffect(() => {
+        window.document.addEventListener('click', handleClickOutside);
+        return () => {
+            window.document.removeEventListener('click', handleClickOutside);
+        };
+    }, [handleClickOutside]);
+    return (jsxs(Fieldset, { className: "DateRangePicker", children: [jsx(Legend, { isHidden: isLabelHidden, children: label }), jsxs(Box$2, { children: [jsx(Field$1, { children: jsx(DateInput, { ref: startDateInputRef, defaultValue: selectedStartDateTupleRef.current, isForcedFocused: isRangeCalendarPickerOpenRef.current, isStartDate: true, onChange: nextDateTuple => handleDateInputFilled(DateRangePosition.START, nextDateTuple), onClick: openRangeCalendarPicker, onNext: handleStartDateInputNext }) }), withTime && (jsx(Field$1, { isTimeField: true, children: jsx(TimeInput, { ref: startTimeInputRef, defaultValue: selectedStartTimeTupleRef.current, isStartDate: true, minutesRange: minutesRange, onBack: () => startDateInputRef.current.focus(true), onChange: nextTimeTuple => handleTimeInputFilled(DateRangePosition.START, nextTimeTuple), onFocus: closeRangeCalendarPicker, onNext: () => endDateInputRef.current.focus(), onPrevious: () => startDateInputRef.current.focus(true) }) })), jsx(Field$1, { isEndDateField: true, children: jsx(DateInput, { ref: endDateInputRef, defaultValue: selectedEndDateTupleRef.current, isEndDate: true, isForcedFocused: isRangeCalendarPickerOpenRef.current, onBack: handleEndDateInputPrevious, onChange: nextDateTuple => handleDateInputFilled(DateRangePosition.END, nextDateTuple), onClick: openRangeCalendarPicker, onNext: handleEndDateInputNext, onPrevious: handleEndDateInputPrevious }) }), withTime && (jsx(Field$1, { isTimeField: true, children: jsx(TimeInput, { ref: endTimeInputRef, defaultValue: selectedEndTimeTupleRef.current, minutesRange: minutesRange, onBack: () => endDateInputRef.current.focus(true), onChange: nextTimeTuple => handleTimeInputFilled(DateRangePosition.END, nextTimeTuple), onFocus: closeRangeCalendarPicker, onPrevious: () => endDateInputRef.current.focus(true) }) }))] }), isRangeCalendarPickerOpenRef.current && (jsx(RangeCalendarPicker, { defaultValue: rangeCalendarPickerDefaultValue, isHistorical: isHistorical, onChange: handleRangeCalendarPickerChange }))] }));
+}
+const Box$2 = styled.div `
+  * {
+    font-weight: 500;
+    line-height: 1;
+  }
+
+  color: ${p => p.theme.color.gunMetal};
+  font-size: 13px;
+  position: relative;
+`;
+const Field$1 = styled.span `
+  font-size: inherit;
+  margin-left: ${p => {
+    if (p.isEndDateField) {
+        return '0.625rem';
+    }
+    return p.isTimeField ? '0.125rem' : 0;
+}};
+`;
+
+function CalendarPicker({ defaultValue, isHistorical, onChange }) {
+    const boxRef = useRef();
+    const calendarRef = useRef();
+    const [isFirstLoad, setIsFirstLoad] = useState(true);
+    const utcTodayAsDayjs = useMemo(() => getUtcDayjs().endOf('day'), []);
+    const disabledDate = useMemo(() => (date) => date && isHistorical ? getUtcizedDayjs(date).isAfter(utcTodayAsDayjs) : false, [isHistorical, utcTodayAsDayjs]);
+    const handleSelect = useCallback((nextDate) => {
+        const nextDateTuple = getDateTupleFromDate(nextDate);
+        onChange(nextDateTuple);
+    }, [onChange]);
+    useEffect(() => {
+        // We wait for the <Box /> to render so that `boxRef` is defined
+        // and can be used as a container for <RsuiteDateRangePicker />
+        setIsFirstLoad(false);
+    }, []);
+    return (jsxs(Fragment, { children: [jsx(GlobalStyleToHideBodyDialog, {}), jsx(Box$1, { ref: boxRef, onClick: stopMouseEventPropagation, children: !isFirstLoad && (jsx(DatePicker$1, { ref: calendarRef, container: boxRef.current, disabledDate: disabledDate, format: "yyyy-MM-dd", locale: RSUITE_CALENDAR_LOCALE, oneTap: true, onSelect: handleSelect, open: true, ranges: [], 
+                    // `defaultValue` seems to be immediatly cancelled so we come down to using a controlled `value`
+                    value: defaultValue })) })] }));
+}
+const GlobalStyleToHideBodyDialog = createGlobalStyle `
+  body > div[role="dialog"].rs-picker-date-menu {
+    display: none;
+  }
+`;
+const Box$1 = styled.div `
+  height: 0;
+  position: relative;
+  user-select: none;
+
+  .rs-picker-toggle {
+    display: none;
+  }
+
+  .rs-picker-date-panel {
+    height: 290px;
+  }
+
+  .rs-picker-date-menu {
+    border: solid 1px ${p => p.theme.color.lightGray};
+    border-radius: 0;
+    margin-top: 0.25rem;
+
+    .rs-picker-date-header,
+    .rs-calendar-header-time-toolbar,
+    .rs-picker-toolbar {
+      display: none;
+    }
+
+    .rs-calendar {
+      height: auto !important;
+      padding: 0;
+
+      :first-child {
+        border-right: solid 1px ${p => p.theme.color.lightGray};
+      }
+
+      .rs-calendar-header {
+        border-bottom: solid 1px ${p => p.theme.color.lightGray};
+        padding: 0.5rem;
+
+        .rs-calendar-header-month-toolbar {
+          align-items: center;
+          color: ${p => p.theme.color.slateGray};
+          display: flex;
+          justify-content: space-between;
+
+          .rs-calendar-header-title {
+            font-size: inherit;
+            text-transform: uppercase;
+
+            &.rs-calendar-header-error {
+              color: ${p => p.theme.color.slateGray};
+
+              :hover {
+                color: ${p => p.theme.color.slateGray};
+              }
+            }
+          }
+        }
+      }
+
+      .rs-calendar-view {
+        padding: 0.75rem 0.5rem 0;
+
+        .rs-calendar-table-cell {
+          padding: 0 0 0.25rem 0;
+          width: 33px;
+
+          &.rs-calendar-table-cell-in-range:before {
+            background-color: ${p => p.theme.color.blueGray[25]};
+            height: 33px;
+            margin-top: 0;
+          }
+
+          > .rs-calendar-table-cell-content {
+            align-items: center;
+            border-radius: 0 !important;
+            display: inline-flex;
+            height: 33px;
+            justify-content: center;
+            padding-bottom: 3px;
+            width: 33px;
+          }
+          :hover .rs-calendar-table-cell-content {
+            background-color: ${p => p.theme.color.blueYonder[25]};
+            color: ${p => p.theme.color.blueYonder[100]};
+          }
+          &[role='columnheader'] .rs-calendar-table-cell-content,
+          &[role='columnheader']:hover .rs-calendar-table-cell-content {
+            background-color: transparent;
+            color: ${p => p.theme.color.slateGray};
+          }
+          &.rs-calendar-table-cell-disabled .rs-calendar-table-cell-content {
+            background-color: transparent;
+            color: ${p => p.theme.color.lightGray};
+          }
+          &.rs-calendar-table-cell-selected > .rs-calendar-table-cell-content {
+            background-color: ${p => p.theme.color.blueGray[100]};
+          }
+        }
+      }
+    }
+  }
+`;
+
+function DatePicker({ defaultValue, isHistorical = false, isLabelHidden = false, label, minutesRange = 15, onChange, withTime = false }) {
+    const dateInputRef = useRef();
+    const timeInputRef = useRef();
+    const isCalendarPickerOpenRef = useRef(false);
+    const selectedDateRef = useRef(defaultValue ? getLocalizedDayjs(defaultValue).toDate() : undefined);
+    const selectedDateTupleRef = useRef(getDateTupleFromDate(selectedDateRef.current));
+    const selectedTimeTupleRef = useRef(getTimeTupleFromDate(selectedDateRef.current));
+    const { forceUpdate } = useForceUpdate();
+    const rangeCalendarPickerDefaultValue = useMemo(() => selectedDateTupleRef.current
+        ? getDateFromDateAndTimeTuple(selectedDateTupleRef.current, ['00', '00'])
+        : undefined, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [selectedDateTupleRef.current]);
+    const submit = useCallback(() => {
+        if (!onChange || !selectedDateRef.current) {
+            return;
+        }
+        const nextDate = getUtcizedDayjs(selectedDateRef.current).toDate();
+        onChange(nextDate);
+    }, [onChange]);
+    const closeCalendarPicker = useCallback(() => {
+        isCalendarPickerOpenRef.current = false;
+        forceUpdate();
+    }, [forceUpdate]);
+    const handleClickOutside = useCallback((event) => {
+        const target = event.target;
+        if (dateInputRef.current.boxSpan.contains(target)) {
+            return;
+        }
+        closeCalendarPicker();
+    }, [closeCalendarPicker]);
+    const handleDateInputNext = useCallback(() => {
+        if (!withTime) {
+            return;
+        }
+        timeInputRef.current.focus();
+    }, [withTime]);
+    const handleDateInputFilled = useCallback((nextDateTuple) => {
+        selectedDateTupleRef.current = nextDateTuple;
+        // If there is no time input or a time has already been selected,
+        if (!withTime || selectedTimeTupleRef.current) {
+            // we must update the selected date and call onChange()
+            const timeTuple = (withTime ? selectedTimeTupleRef.current : ['00', '00']);
+            const nextDate = getDateFromDateAndTimeTuple(nextDateTuple, timeTuple);
+            selectedDateRef.current = nextDate;
+            submit();
+        }
+        handleDateInputNext();
+    }, [handleDateInputNext, submit, withTime]);
+    const handleCalendarPickerChange = useCallback((nextDateTuple) => {
+        // If this is a date picker without a time input,
+        if (!withTime) {
+            // we have to fix the date at the beginning of the day
+            const nextDate = getDateFromDateAndTimeTuple(nextDateTuple, ['00', '00']);
+            selectedDateRef.current = nextDate;
+        }
+        // If this is a date picker with a time input,
+        else {
+            // we include the selected time if it exists, set it at the beginning of the day if not
+            const nextDate = getDateFromDateAndTimeTuple(nextDateTuple, selectedTimeTupleRef.current || ['00', '00']);
+            selectedDateRef.current = nextDate;
+        }
+        selectedDateTupleRef.current = nextDateTuple;
+        selectedTimeTupleRef.current = getTimeTupleFromDate(selectedDateRef.current);
+        closeCalendarPicker();
+        forceUpdate();
+        submit();
+    }, [closeCalendarPicker, forceUpdate, submit, withTime]);
+    const handleTimeInputFilled = useCallback((nextTimeTuple) => {
+        // If a date has already been selected
+        if (selectedDateTupleRef.current) {
+            // we must update the selected date accordingly and submit it
+            const nextDate = getDateFromDateAndTimeTuple(selectedDateTupleRef.current, nextTimeTuple);
+            selectedDateRef.current = nextDate;
+            submit();
+        }
+        selectedTimeTupleRef.current = nextTimeTuple;
+        submit();
+    }, [submit]);
+    const openCalendarPicker = useCallback(() => {
+        isCalendarPickerOpenRef.current = true;
+        forceUpdate();
+    }, [forceUpdate]);
+    useEffect(() => {
+        window.document.addEventListener('click', handleClickOutside);
+        return () => {
+            window.document.removeEventListener('click', handleClickOutside);
+        };
+    }, [handleClickOutside]);
+    return (jsxs(Fieldset, { className: "DateRangePicker", children: [jsx(Legend, { isHidden: isLabelHidden, children: label }), jsxs(Box, { children: [jsx(Field, { children: jsx(DateInput, { ref: dateInputRef, defaultValue: selectedDateTupleRef.current, isForcedFocused: isCalendarPickerOpenRef.current, onChange: handleDateInputFilled, onClick: openCalendarPicker, onNext: handleDateInputNext }) }), withTime && (jsx(Field, { isTimeField: true, children: jsx(TimeInput, { ref: timeInputRef, defaultValue: selectedTimeTupleRef.current, minutesRange: minutesRange, onBack: () => dateInputRef.current.focus(true), onChange: handleTimeInputFilled, onFocus: closeCalendarPicker, onPrevious: () => dateInputRef.current.focus(true) }) }))] }), isCalendarPickerOpenRef.current && (jsx(CalendarPicker, { defaultValue: rangeCalendarPickerDefaultValue, isHistorical: isHistorical, onChange: handleCalendarPickerChange }))] }));
+}
+const Box = styled.div `
+  * {
+    font-weight: 500;
+    line-height: 1;
+  }
+
+  color: ${p => p.theme.color.gunMetal};
+  font-size: 13px;
+  position: relative;
+`;
+const Field = styled.span `
+  font-size: inherit;
+  margin-left: ${p => {
+    if (p.isEndDateField) {
+        return '0.625rem';
+    }
+    return p.isTimeField ? '0.125rem' : 0;
+}};
+`;
+
+function _isPlaceholder(a) {
+  return a != null && typeof a === 'object' && a['@@functional/placeholder'] === true;
+}
+
+/**
+ * Optimized internal one-arity curry function.
+ *
+ * @private
+ * @category Function
+ * @param {Function} fn The function to curry.
+ * @return {Function} The curried function.
+ */
+
+function _curry1(fn) {
+  return function f1(a) {
+    if (arguments.length === 0 || _isPlaceholder(a)) {
+      return f1;
+    } else {
+      return fn.apply(this, arguments);
+    }
+  };
+}
+
+/**
+ * Optimized internal two-arity curry function.
+ *
+ * @private
+ * @category Function
+ * @param {Function} fn The function to curry.
+ * @return {Function} The curried function.
+ */
+
+function _curry2(fn) {
+  return function f2(a, b) {
+    switch (arguments.length) {
+      case 0:
+        return f2;
+
+      case 1:
+        return _isPlaceholder(a) ? f2 : _curry1(function (_b) {
+          return fn(a, _b);
+        });
+
+      default:
+        return _isPlaceholder(a) && _isPlaceholder(b) ? f2 : _isPlaceholder(a) ? _curry1(function (_a) {
+          return fn(_a, b);
+        }) : _isPlaceholder(b) ? _curry1(function (_b) {
+          return fn(a, _b);
+        }) : fn(a, b);
+    }
+  };
+}
+
+function _arity(n, fn) {
+  /* eslint-disable no-unused-vars */
+  switch (n) {
+    case 0:
+      return function () {
+        return fn.apply(this, arguments);
+      };
+
+    case 1:
+      return function (a0) {
+        return fn.apply(this, arguments);
+      };
+
+    case 2:
+      return function (a0, a1) {
+        return fn.apply(this, arguments);
+      };
+
+    case 3:
+      return function (a0, a1, a2) {
+        return fn.apply(this, arguments);
+      };
+
+    case 4:
+      return function (a0, a1, a2, a3) {
+        return fn.apply(this, arguments);
+      };
+
+    case 5:
+      return function (a0, a1, a2, a3, a4) {
+        return fn.apply(this, arguments);
+      };
+
+    case 6:
+      return function (a0, a1, a2, a3, a4, a5) {
+        return fn.apply(this, arguments);
+      };
+
+    case 7:
+      return function (a0, a1, a2, a3, a4, a5, a6) {
+        return fn.apply(this, arguments);
+      };
+
+    case 8:
+      return function (a0, a1, a2, a3, a4, a5, a6, a7) {
+        return fn.apply(this, arguments);
+      };
+
+    case 9:
+      return function (a0, a1, a2, a3, a4, a5, a6, a7, a8) {
+        return fn.apply(this, arguments);
+      };
+
+    case 10:
+      return function (a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        return fn.apply(this, arguments);
+      };
+
+    default:
+      throw new Error('First argument to _arity must be a non-negative integer no greater than ten');
+  }
+}
+
+/**
+ * Optimized internal three-arity curry function.
+ *
+ * @private
+ * @category Function
+ * @param {Function} fn The function to curry.
+ * @return {Function} The curried function.
+ */
+
+function _curry3(fn) {
+  return function f3(a, b, c) {
+    switch (arguments.length) {
+      case 0:
+        return f3;
+
+      case 1:
+        return _isPlaceholder(a) ? f3 : _curry2(function (_b, _c) {
+          return fn(a, _b, _c);
+        });
+
+      case 2:
+        return _isPlaceholder(a) && _isPlaceholder(b) ? f3 : _isPlaceholder(a) ? _curry2(function (_a, _c) {
+          return fn(_a, b, _c);
+        }) : _isPlaceholder(b) ? _curry2(function (_b, _c) {
+          return fn(a, _b, _c);
+        }) : _curry1(function (_c) {
+          return fn(a, b, _c);
+        });
+
+      default:
+        return _isPlaceholder(a) && _isPlaceholder(b) && _isPlaceholder(c) ? f3 : _isPlaceholder(a) && _isPlaceholder(b) ? _curry2(function (_a, _b) {
+          return fn(_a, _b, c);
+        }) : _isPlaceholder(a) && _isPlaceholder(c) ? _curry2(function (_a, _c) {
+          return fn(_a, b, _c);
+        }) : _isPlaceholder(b) && _isPlaceholder(c) ? _curry2(function (_b, _c) {
+          return fn(a, _b, _c);
+        }) : _isPlaceholder(a) ? _curry1(function (_a) {
+          return fn(_a, b, c);
+        }) : _isPlaceholder(b) ? _curry1(function (_b) {
+          return fn(a, _b, c);
+        }) : _isPlaceholder(c) ? _curry1(function (_c) {
+          return fn(a, b, _c);
+        }) : fn(a, b, c);
+    }
+  };
+}
+
+/**
+ * Tests whether or not an object is an array.
+ *
+ * @private
+ * @param {*} val The object to test.
+ * @return {Boolean} `true` if `val` is an array, `false` otherwise.
+ * @example
+ *
+ *      _isArray([]); //=> true
+ *      _isArray(null); //=> false
+ *      _isArray({}); //=> false
+ */
+var _isArray = Array.isArray || function _isArray(val) {
+  return val != null && val.length >= 0 && Object.prototype.toString.call(val) === '[object Array]';
+};
+
+function _isTransformer(obj) {
+  return obj != null && typeof obj['@@transducer/step'] === 'function';
+}
+
+/**
+ * Returns a function that dispatches with different strategies based on the
+ * object in list position (last argument). If it is an array, executes [fn].
+ * Otherwise, if it has a function with one of the given method names, it will
+ * execute that function (functor case). Otherwise, if it is a transformer,
+ * uses transducer created by [transducerCreator] to return a new transformer
+ * (transducer case).
+ * Otherwise, it will default to executing [fn].
+ *
+ * @private
+ * @param {Array} methodNames properties to check for a custom implementation
+ * @param {Function} transducerCreator transducer factory if object is transformer
+ * @param {Function} fn default ramda implementation
+ * @return {Function} A function that dispatches on object in list position
+ */
+
+function _dispatchable(methodNames, transducerCreator, fn) {
+  return function () {
+    if (arguments.length === 0) {
+      return fn();
+    }
+
+    var obj = arguments[arguments.length - 1];
+
+    if (!_isArray(obj)) {
+      var idx = 0;
+
+      while (idx < methodNames.length) {
+        if (typeof obj[methodNames[idx]] === 'function') {
+          return obj[methodNames[idx]].apply(obj, Array.prototype.slice.call(arguments, 0, -1));
+        }
+
+        idx += 1;
+      }
+
+      if (_isTransformer(obj)) {
+        var transducer = transducerCreator.apply(null, Array.prototype.slice.call(arguments, 0, -1));
+        return transducer(obj);
+      }
+    }
+
+    return fn.apply(this, arguments);
+  };
+}
+
+var _xfBase = {
+  init: function () {
+    return this.xf['@@transducer/init']();
+  },
+  result: function (result) {
+    return this.xf['@@transducer/result'](result);
+  }
+};
+
+function _isString(x) {
+  return Object.prototype.toString.call(x) === '[object String]';
+}
+
+/**
+ * Tests whether or not an object is similar to an array.
+ *
+ * @private
+ * @category Type
+ * @category List
+ * @sig * -> Boolean
+ * @param {*} x The object to test.
+ * @return {Boolean} `true` if `x` has a numeric length property and extreme indices defined; `false` otherwise.
+ * @example
+ *
+ *      _isArrayLike([]); //=> true
+ *      _isArrayLike(true); //=> false
+ *      _isArrayLike({}); //=> false
+ *      _isArrayLike({length: 10}); //=> false
+ *      _isArrayLike({0: 'zero', 9: 'nine', length: 10}); //=> true
+ *      _isArrayLike({nodeType: 1, length: 1}) // => false
+ */
+
+var _isArrayLike =
+/*#__PURE__*/
+_curry1(function isArrayLike(x) {
+  if (_isArray(x)) {
+    return true;
+  }
+
+  if (!x) {
+    return false;
+  }
+
+  if (typeof x !== 'object') {
+    return false;
+  }
+
+  if (_isString(x)) {
+    return false;
+  }
+
+  if (x.length === 0) {
+    return true;
+  }
+
+  if (x.length > 0) {
+    return x.hasOwnProperty(0) && x.hasOwnProperty(x.length - 1);
+  }
+
+  return false;
+});
+
+var XWrap =
+/*#__PURE__*/
+function () {
+  function XWrap(fn) {
+    this.f = fn;
+  }
+
+  XWrap.prototype['@@transducer/init'] = function () {
+    throw new Error('init not implemented on XWrap');
+  };
+
+  XWrap.prototype['@@transducer/result'] = function (acc) {
+    return acc;
+  };
+
+  XWrap.prototype['@@transducer/step'] = function (acc, x) {
+    return this.f(acc, x);
+  };
+
+  return XWrap;
+}();
+
+function _xwrap(fn) {
+  return new XWrap(fn);
+}
+
+/**
+ * Creates a function that is bound to a context.
+ * Note: `R.bind` does not provide the additional argument-binding capabilities of
+ * [Function.prototype.bind](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind).
+ *
+ * @func
+ * @memberOf R
+ * @since v0.6.0
+ * @category Function
+ * @category Object
+ * @sig (* -> *) -> {*} -> (* -> *)
+ * @param {Function} fn The function to bind to context
+ * @param {Object} thisObj The context to bind `fn` to
+ * @return {Function} A function that will execute in the context of `thisObj`.
+ * @see R.partial
+ * @example
+ *
+ *      const log = R.bind(console.log, console);
+ *      R.pipe(R.assoc('a', 2), R.tap(log), R.assoc('a', 3))({a: 1}); //=> {a: 3}
+ *      // logs {a: 2}
+ * @symb R.bind(f, o)(a, b) = f.call(o, a, b)
+ */
+
+var bind =
+/*#__PURE__*/
+_curry2(function bind(fn, thisObj) {
+  return _arity(fn.length, function () {
+    return fn.apply(thisObj, arguments);
+  });
+});
+
+function _arrayReduce(xf, acc, list) {
+  var idx = 0;
+  var len = list.length;
+
+  while (idx < len) {
+    acc = xf['@@transducer/step'](acc, list[idx]);
+
+    if (acc && acc['@@transducer/reduced']) {
+      acc = acc['@@transducer/value'];
+      break;
+    }
+
+    idx += 1;
+  }
+
+  return xf['@@transducer/result'](acc);
+}
+
+function _iterableReduce(xf, acc, iter) {
+  var step = iter.next();
+
+  while (!step.done) {
+    acc = xf['@@transducer/step'](acc, step.value);
+
+    if (acc && acc['@@transducer/reduced']) {
+      acc = acc['@@transducer/value'];
+      break;
+    }
+
+    step = iter.next();
+  }
+
+  return xf['@@transducer/result'](acc);
+}
+
+function _methodReduce(xf, acc, obj, methodName) {
+  return xf['@@transducer/result'](obj[methodName](bind(xf['@@transducer/step'], xf), acc));
+}
+
+var symIterator = typeof Symbol !== 'undefined' ? Symbol.iterator : '@@iterator';
+function _reduce(fn, acc, list) {
+  if (typeof fn === 'function') {
+    fn = _xwrap(fn);
+  }
+
+  if (_isArrayLike(list)) {
+    return _arrayReduce(fn, acc, list);
+  }
+
+  if (typeof list['fantasy-land/reduce'] === 'function') {
+    return _methodReduce(fn, acc, list, 'fantasy-land/reduce');
+  }
+
+  if (list[symIterator] != null) {
+    return _iterableReduce(fn, acc, list[symIterator]());
+  }
+
+  if (typeof list.next === 'function') {
+    return _iterableReduce(fn, acc, list);
+  }
+
+  if (typeof list.reduce === 'function') {
+    return _methodReduce(fn, acc, list, 'reduce');
+  }
+
+  throw new TypeError('reduce: list must be array or iterable');
+}
+
+function _has(prop, obj) {
+  return Object.prototype.hasOwnProperty.call(obj, prop);
+}
+
+var toString = Object.prototype.toString;
+
+var _isArguments =
+/*#__PURE__*/
+function () {
+  return toString.call(arguments) === '[object Arguments]' ? function _isArguments(x) {
+    return toString.call(x) === '[object Arguments]';
+  } : function _isArguments(x) {
+    return _has('callee', x);
+  };
+}();
+
+var hasEnumBug = !
+/*#__PURE__*/
+{
+  toString: null
+}.propertyIsEnumerable('toString');
+var nonEnumerableProps = ['constructor', 'valueOf', 'isPrototypeOf', 'toString', 'propertyIsEnumerable', 'hasOwnProperty', 'toLocaleString']; // Safari bug
+
+var hasArgsEnumBug =
+/*#__PURE__*/
+function () {
+
+  return arguments.propertyIsEnumerable('length');
+}();
+
+var contains = function contains(list, item) {
+  var idx = 0;
+
+  while (idx < list.length) {
+    if (list[idx] === item) {
+      return true;
+    }
+
+    idx += 1;
+  }
+
+  return false;
+};
+/**
+ * Returns a list containing the names of all the enumerable own properties of
+ * the supplied object.
+ * Note that the order of the output array is not guaranteed to be consistent
+ * across different JS platforms.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.1.0
+ * @category Object
+ * @sig {k: v} -> [k]
+ * @param {Object} obj The object to extract properties from
+ * @return {Array} An array of the object's own properties.
+ * @see R.keysIn, R.values, R.toPairs
+ * @example
+ *
+ *      R.keys({a: 1, b: 2, c: 3}); //=> ['a', 'b', 'c']
+ */
+
+
+var keys = typeof Object.keys === 'function' && !hasArgsEnumBug ?
+/*#__PURE__*/
+_curry1(function keys(obj) {
+  return Object(obj) !== obj ? [] : Object.keys(obj);
+}) :
+/*#__PURE__*/
+_curry1(function keys(obj) {
+  if (Object(obj) !== obj) {
+    return [];
+  }
+
+  var prop, nIdx;
+  var ks = [];
+
+  var checkArgsLength = hasArgsEnumBug && _isArguments(obj);
+
+  for (prop in obj) {
+    if (_has(prop, obj) && (!checkArgsLength || prop !== 'length')) {
+      ks[ks.length] = prop;
+    }
+  }
+
+  if (hasEnumBug) {
+    nIdx = nonEnumerableProps.length - 1;
+
+    while (nIdx >= 0) {
+      prop = nonEnumerableProps[nIdx];
+
+      if (_has(prop, obj) && !contains(ks, prop)) {
+        ks[ks.length] = prop;
+      }
+
+      nIdx -= 1;
+    }
+  }
+
+  return ks;
+});
+
+/**
+ * Gives a single-word string description of the (native) type of a value,
+ * returning such answers as 'Object', 'Number', 'Array', or 'Null'. Does not
+ * attempt to distinguish user Object types any further, reporting them all as
+ * 'Object'.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.8.0
+ * @category Type
+ * @sig (* -> {*}) -> String
+ * @param {*} val The value to test
+ * @return {String}
+ * @example
+ *
+ *      R.type({}); //=> "Object"
+ *      R.type(1); //=> "Number"
+ *      R.type(false); //=> "Boolean"
+ *      R.type('s'); //=> "String"
+ *      R.type(null); //=> "Null"
+ *      R.type([]); //=> "Array"
+ *      R.type(/[A-z]/); //=> "RegExp"
+ *      R.type(() => {}); //=> "Function"
+ *      R.type(undefined); //=> "Undefined"
+ */
+
+var type =
+/*#__PURE__*/
+_curry1(function type(val) {
+  return val === null ? 'Null' : val === undefined ? 'Undefined' : Object.prototype.toString.call(val).slice(8, -1);
+});
+
+function _arrayFromIterator(iter) {
+  var list = [];
+  var next;
+
+  while (!(next = iter.next()).done) {
+    list.push(next.value);
+  }
+
+  return list;
+}
+
+function _includesWith(pred, x, list) {
+  var idx = 0;
+  var len = list.length;
+
+  while (idx < len) {
+    if (pred(x, list[idx])) {
+      return true;
+    }
+
+    idx += 1;
+  }
+
+  return false;
+}
+
+function _functionName(f) {
+  // String(x => x) evaluates to "x => x", so the pattern may not match.
+  var match = String(f).match(/^function (\w*)/);
+  return match == null ? '' : match[1];
+}
+
+// Based on https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
+function _objectIs(a, b) {
+  // SameValue algorithm
+  if (a === b) {
+    // Steps 1-5, 7-10
+    // Steps 6.b-6.e: +0 != -0
+    return a !== 0 || 1 / a === 1 / b;
+  } else {
+    // Step 6.a: NaN == NaN
+    return a !== a && b !== b;
+  }
+}
+
+var _objectIs$1 = typeof Object.is === 'function' ? Object.is : _objectIs;
+
+/**
+ * private _uniqContentEquals function.
+ * That function is checking equality of 2 iterator contents with 2 assumptions
+ * - iterators lengths are the same
+ * - iterators values are unique
+ *
+ * false-positive result will be returned for comparison of, e.g.
+ * - [1,2,3] and [1,2,3,4]
+ * - [1,1,1] and [1,2,3]
+ * */
+
+function _uniqContentEquals(aIterator, bIterator, stackA, stackB) {
+  var a = _arrayFromIterator(aIterator);
+
+  var b = _arrayFromIterator(bIterator);
+
+  function eq(_a, _b) {
+    return _equals(_a, _b, stackA.slice(), stackB.slice());
+  } // if *a* array contains any element that is not included in *b*
+
+
+  return !_includesWith(function (b, aItem) {
+    return !_includesWith(eq, aItem, b);
+  }, b, a);
+}
+
+function _equals(a, b, stackA, stackB) {
+  if (_objectIs$1(a, b)) {
+    return true;
+  }
+
+  var typeA = type(a);
+
+  if (typeA !== type(b)) {
+    return false;
+  }
+
+  if (typeof a['fantasy-land/equals'] === 'function' || typeof b['fantasy-land/equals'] === 'function') {
+    return typeof a['fantasy-land/equals'] === 'function' && a['fantasy-land/equals'](b) && typeof b['fantasy-land/equals'] === 'function' && b['fantasy-land/equals'](a);
+  }
+
+  if (typeof a.equals === 'function' || typeof b.equals === 'function') {
+    return typeof a.equals === 'function' && a.equals(b) && typeof b.equals === 'function' && b.equals(a);
+  }
+
+  switch (typeA) {
+    case 'Arguments':
+    case 'Array':
+    case 'Object':
+      if (typeof a.constructor === 'function' && _functionName(a.constructor) === 'Promise') {
+        return a === b;
+      }
+
+      break;
+
+    case 'Boolean':
+    case 'Number':
+    case 'String':
+      if (!(typeof a === typeof b && _objectIs$1(a.valueOf(), b.valueOf()))) {
+        return false;
+      }
+
+      break;
+
+    case 'Date':
+      if (!_objectIs$1(a.valueOf(), b.valueOf())) {
+        return false;
+      }
+
+      break;
+
+    case 'Error':
+      return a.name === b.name && a.message === b.message;
+
+    case 'RegExp':
+      if (!(a.source === b.source && a.global === b.global && a.ignoreCase === b.ignoreCase && a.multiline === b.multiline && a.sticky === b.sticky && a.unicode === b.unicode)) {
+        return false;
+      }
+
+      break;
+  }
+
+  var idx = stackA.length - 1;
+
+  while (idx >= 0) {
+    if (stackA[idx] === a) {
+      return stackB[idx] === b;
+    }
+
+    idx -= 1;
+  }
+
+  switch (typeA) {
+    case 'Map':
+      if (a.size !== b.size) {
+        return false;
+      }
+
+      return _uniqContentEquals(a.entries(), b.entries(), stackA.concat([a]), stackB.concat([b]));
+
+    case 'Set':
+      if (a.size !== b.size) {
+        return false;
+      }
+
+      return _uniqContentEquals(a.values(), b.values(), stackA.concat([a]), stackB.concat([b]));
+
+    case 'Arguments':
+    case 'Array':
+    case 'Object':
+    case 'Boolean':
+    case 'Number':
+    case 'String':
+    case 'Date':
+    case 'Error':
+    case 'RegExp':
+    case 'Int8Array':
+    case 'Uint8Array':
+    case 'Uint8ClampedArray':
+    case 'Int16Array':
+    case 'Uint16Array':
+    case 'Int32Array':
+    case 'Uint32Array':
+    case 'Float32Array':
+    case 'Float64Array':
+    case 'ArrayBuffer':
+      break;
+
+    default:
+      // Values of other types are only equal if identical.
+      return false;
+  }
+
+  var keysA = keys(a);
+
+  if (keysA.length !== keys(b).length) {
+    return false;
+  }
+
+  var extendedStackA = stackA.concat([a]);
+  var extendedStackB = stackB.concat([b]);
+  idx = keysA.length - 1;
+
+  while (idx >= 0) {
+    var key = keysA[idx];
+
+    if (!(_has(key, b) && _equals(b[key], a[key], extendedStackA, extendedStackB))) {
+      return false;
+    }
+
+    idx -= 1;
+  }
+
+  return true;
+}
+
+/**
+ * Returns `true` if its arguments are equivalent, `false` otherwise. Handles
+ * cyclical data structures.
+ *
+ * Dispatches symmetrically to the `equals` methods of both arguments, if
+ * present.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.15.0
+ * @category Relation
+ * @sig a -> b -> Boolean
+ * @param {*} a
+ * @param {*} b
+ * @return {Boolean}
+ * @example
+ *
+ *      R.equals(1, 1); //=> true
+ *      R.equals(1, '1'); //=> false
+ *      R.equals([1, 2, 3], [1, 2, 3]); //=> true
+ *
+ *      const a = {}; a.v = a;
+ *      const b = {}; b.v = b;
+ *      R.equals(a, b); //=> true
+ */
+
+var equals =
+/*#__PURE__*/
+_curry2(function equals(a, b) {
+  return _equals(a, b, [], []);
+});
+
+function _complement(f) {
+  return function () {
+    return !f.apply(this, arguments);
+  };
+}
+
+function _filter(fn, list) {
+  var idx = 0;
+  var len = list.length;
+  var result = [];
+
+  while (idx < len) {
+    if (fn(list[idx])) {
+      result[result.length] = list[idx];
+    }
+
+    idx += 1;
+  }
+
+  return result;
+}
+
+function _isObject(x) {
+  return Object.prototype.toString.call(x) === '[object Object]';
+}
+
+var XFilter =
+/*#__PURE__*/
+function () {
+  function XFilter(f, xf) {
+    this.xf = xf;
+    this.f = f;
+  }
+
+  XFilter.prototype['@@transducer/init'] = _xfBase.init;
+  XFilter.prototype['@@transducer/result'] = _xfBase.result;
+
+  XFilter.prototype['@@transducer/step'] = function (result, input) {
+    return this.f(input) ? this.xf['@@transducer/step'](result, input) : result;
+  };
+
+  return XFilter;
+}();
+
+var _xfilter =
+/*#__PURE__*/
+_curry2(function _xfilter(f, xf) {
+  return new XFilter(f, xf);
+});
+
+/**
+ * Takes a predicate and a `Filterable`, and returns a new filterable of the
+ * same type containing the members of the given filterable which satisfy the
+ * given predicate. Filterable objects include plain objects or any object
+ * that has a filter method such as `Array`.
+ *
+ * Dispatches to the `filter` method of the second argument, if present.
+ *
+ * Acts as a transducer if a transformer is given in list position.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.1.0
+ * @category List
+ * @sig Filterable f => (a -> Boolean) -> f a -> f a
+ * @param {Function} pred
+ * @param {Array} filterable
+ * @return {Array} Filterable
+ * @see R.reject, R.transduce, R.addIndex
+ * @example
+ *
+ *      const isEven = n => n % 2 === 0;
+ *
+ *      R.filter(isEven, [1, 2, 3, 4]); //=> [2, 4]
+ *
+ *      R.filter(isEven, {a: 1, b: 2, c: 3, d: 4}); //=> {b: 2, d: 4}
+ */
+
+var filter =
+/*#__PURE__*/
+_curry2(
+/*#__PURE__*/
+_dispatchable(['fantasy-land/filter', 'filter'], _xfilter, function (pred, filterable) {
+  return _isObject(filterable) ? _reduce(function (acc, key) {
+    if (pred(filterable[key])) {
+      acc[key] = filterable[key];
+    }
+
+    return acc;
+  }, {}, keys(filterable)) : // else
+  _filter(pred, filterable);
+}));
+
+/**
+ * The complement of [`filter`](#filter).
+ *
+ * Acts as a transducer if a transformer is given in list position. Filterable
+ * objects include plain objects or any object that has a filter method such
+ * as `Array`.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.1.0
+ * @category List
+ * @sig Filterable f => (a -> Boolean) -> f a -> f a
+ * @param {Function} pred
+ * @param {Array} filterable
+ * @return {Array}
+ * @see R.filter, R.transduce, R.addIndex
+ * @example
+ *
+ *      const isOdd = (n) => n % 2 !== 0;
+ *
+ *      R.reject(isOdd, [1, 2, 3, 4]); //=> [2, 4]
+ *
+ *      R.reject(isOdd, {a: 1, b: 2, c: 3, d: 4}); //=> {b: 2, d: 4}
+ */
+
+var reject =
+/*#__PURE__*/
+_curry2(function reject(pred, filterable) {
+  return filter(_complement(pred), filterable);
+});
+
+/**
+ * Creates a new object with the own properties of the two provided objects. If
+ * a key exists in both objects, the provided function is applied to the key
+ * and the values associated with the key in each object, with the result being
+ * used as the value associated with the key in the returned object.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.19.0
+ * @category Object
+ * @sig ((String, a, a) -> a) -> {a} -> {a} -> {a}
+ * @param {Function} fn
+ * @param {Object} l
+ * @param {Object} r
+ * @return {Object}
+ * @see R.mergeDeepWithKey, R.merge, R.mergeWith
+ * @example
+ *
+ *      let concatValues = (k, l, r) => k == 'values' ? R.concat(l, r) : r
+ *      R.mergeWithKey(concatValues,
+ *                     { a: true, thing: 'foo', values: [10, 20] },
+ *                     { b: true, thing: 'bar', values: [15, 35] });
+ *      //=> { a: true, b: true, thing: 'bar', values: [10, 20, 15, 35] }
+ * @symb R.mergeWithKey(f, { x: 1, y: 2 }, { y: 5, z: 3 }) = { x: 1, y: f('y', 2, 5), z: 3 }
+ */
+
+var mergeWithKey =
+/*#__PURE__*/
+_curry3(function mergeWithKey(fn, l, r) {
+  var result = {};
+  var k;
+
+  for (k in l) {
+    if (_has(k, l)) {
+      result[k] = _has(k, r) ? fn(k, l[k], r[k]) : l[k];
+    }
+  }
+
+  for (k in r) {
+    if (_has(k, r) && !_has(k, result)) {
+      result[k] = r[k];
+    }
+  }
+
+  return result;
+});
+
+/**
+ * Creates a new object with the own properties of the two provided objects.
+ * If a key exists in both objects:
+ * - and both associated values are also objects then the values will be
+ *   recursively merged.
+ * - otherwise the provided function is applied to the key and associated values
+ *   using the resulting value as the new value associated with the key.
+ * If a key only exists in one object, the value will be associated with the key
+ * of the resulting object.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.24.0
+ * @category Object
+ * @sig ((String, a, a) -> a) -> {a} -> {a} -> {a}
+ * @param {Function} fn
+ * @param {Object} lObj
+ * @param {Object} rObj
+ * @return {Object}
+ * @see R.mergeWithKey, R.mergeDeepWith
+ * @example
+ *
+ *      let concatValues = (k, l, r) => k == 'values' ? R.concat(l, r) : r
+ *      R.mergeDeepWithKey(concatValues,
+ *                         { a: true, c: { thing: 'foo', values: [10, 20] }},
+ *                         { b: true, c: { thing: 'bar', values: [15, 35] }});
+ *      //=> { a: true, b: true, c: { thing: 'bar', values: [10, 20, 15, 35] }}
+ */
+
+var mergeDeepWithKey =
+/*#__PURE__*/
+_curry3(function mergeDeepWithKey(fn, lObj, rObj) {
+  return mergeWithKey(function (k, lVal, rVal) {
+    if (_isObject(lVal) && _isObject(rVal)) {
+      return mergeDeepWithKey(fn, lVal, rVal);
+    } else {
+      return fn(k, lVal, rVal);
+    }
+  }, lObj, rObj);
+});
+
+/**
+ * Creates a new object with the own properties of the first object merged with
+ * the own properties of the second object. If a key exists in both objects:
+ * - and both values are objects, the two values will be recursively merged
+ * - otherwise the value from the second object will be used.
+ *
+ * @func
+ * @memberOf R
+ * @since v0.24.0
+ * @category Object
+ * @sig {a} -> {a} -> {a}
+ * @param {Object} lObj
+ * @param {Object} rObj
+ * @return {Object}
+ * @see R.merge, R.mergeDeepLeft, R.mergeDeepWith, R.mergeDeepWithKey
+ * @example
+ *
+ *      R.mergeDeepRight({ name: 'fred', age: 10, contact: { email: 'moo@example.com' }},
+ *                       { age: 40, contact: { email: 'baa@example.com' }});
+ *      //=> { name: 'fred', age: 40, contact: { email: 'baa@example.com' }}
+ */
+
+var mergeDeepRight =
+/*#__PURE__*/
+_curry2(function mergeDeepRight(lObj, rObj) {
+  return mergeDeepWithKey(function (k, lVal, rVal) {
+    return rVal;
+  }, lObj, rObj);
+});
+
+function MultiCheckbox({ defaultValue = [], isInline = false, isLabelHidden = false, label, name, onChange, options }) {
+    const checkedOptionValues = useRef(defaultValue);
+    const key = useMemo(() => `${name}-${JSON.stringify(defaultValue)}`, [defaultValue, name]);
+    const handleChange = useCallback((nextOptionValue, isChecked) => {
+        const nextCheckedOptionValues = isChecked
+            ? [...checkedOptionValues.current, nextOptionValue]
+            : reject(equals(nextOptionValue))(checkedOptionValues.current);
+        checkedOptionValues.current = nextCheckedOptionValues;
+        if (onChange) {
+            const normalizedNextValue = nextCheckedOptionValues.length ? nextCheckedOptionValues : undefined;
+            onChange(normalizedNextValue);
+        }
+    }, [onChange]);
+    return (jsxs(Fieldset, { children: [jsx(Legend, { isHidden: isLabelHidden, children: label }), jsx(ChecboxesBox$1, { isInline: isInline, children: options.map((option, index) => (jsx(Checkbox
+                // eslint-disable-next-line react/no-array-index-key
+                , { defaultChecked: defaultValue.includes(option.value), label: option.label, name: `${name}${index}`, onChange: (isChecked) => handleChange(option.value, isChecked) }, `${name}-${index}`))) })] }, key));
+}
+const ChecboxesBox$1 = styled.div `
+  color: ${p => p.theme.color.gunMetal};
+  display: flex;
+  flex-direction: ${p => (p.isInline ? 'row' : 'column')};
+  font-weight: 500;
+
+  > .rs-checkbox {
+    > .rs-checkbox-checker {
+      padding-left: 28px;
+      padding-top: 2px;
+
+      .rs-checkbox-wrapper {
+        left: 2px;
+        top: 0 !important;
+      }
+    }
+  }
+
+  ${p => p.isInline &&
+    css `
+      > .rs-checkbox:not(:first-child) {
+        margin-left: 0.75rem;
+      }
+    `}
+`;
+
+function MultiSelect({ fixedWidth = 5, isLabelHidden = false, label, onChange, options, 
+// eslint-disable-next-line @typescript-eslint/naming-convention
+searchable = false, ...originalProps }) {
+    const key = useMemo(() => `${originalProps.name}-${JSON.stringify(originalProps.defaultValue)}`, [originalProps.defaultValue, originalProps.name]);
+    const handleChange = useCallback((nextValue) => {
+        if (!onChange) {
+            return;
+        }
+        const normalizedNextValue = !nextValue || !nextValue.length ? undefined : nextValue;
+        onChange(normalizedNextValue);
+    }, [onChange]);
+    return (jsxs(Field$2, { children: [jsx(Label, { htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledTagPicker, { data: options, fixedWidth: fixedWidth, id: originalProps.name, onChange: handleChange, searchable: searchable, ...originalProps }, key)] }));
+}
+// TODO A width seems to be mandatory in rsuite which is a very dirty behavior.
+// We should hack that.
+const StyledTagPicker = styled(TagPicker) `
+  cursor: pointer;
+  width: ${p => p.fixedWidth}rem;
+
+  > .rs-picker-toggle {
+    cursor: inherit;
+  }
+`;
+
+function MultiRadio({ defaultValue, isInline = false, isLabelHidden = false, label, name, onChange, options }) {
+    const [checkedOptionValue, setCheckedOptionValue] = useState(undefined);
+    const key = useMemo(() => `${name}-${String(checkedOptionValue)}}`, [checkedOptionValue, name]);
+    const handleChange = useCallback((nextOptionValue, isChecked) => {
+        const nextCheckedOptionValue = isChecked ? nextOptionValue : undefined;
+        setCheckedOptionValue(nextCheckedOptionValue);
+        if (onChange) {
+            onChange(nextCheckedOptionValue);
+        }
+    }, [onChange]);
+    // TODO There may be a better solution.
+    // A key change is not enough to force radio checked check changes
+    // on `defaultValue` property update (even when appending `defaultValue` to `key`),
+    // we need to force a second re-render in order for the changes to be applied.
+    useEffect(() => {
+        setCheckedOptionValue(defaultValue);
+    }, [defaultValue]);
+    return (jsxs(Fieldset, { children: [jsx(Legend, { isHidden: isLabelHidden, children: label }), jsx(ChecboxesBox, { isInline: isInline, children: options.map((option, index) => (jsx(Radio
+                // eslint-disable-next-line react/no-array-index-key
+                , { defaultChecked: option.value === checkedOptionValue, name: name, onChange: (_, isChecked) => handleChange(option.value, isChecked), children: option.label }, `${name}-${index}`))) })] }, key));
+}
+const ChecboxesBox = styled.div `
+  color: ${p => p.theme.color.gunMetal};
+  display: flex;
+  flex-direction: ${p => (p.isInline ? 'row' : 'column')};
+  font-weight: 500;
+
+  > .rs-radio {
+    > .rs-radio-checker {
+      padding-left: 28px;
+      padding-top: 2px;
+
+      .rs-radio-wrapper {
+        left: 2px;
+        top: 3px !important;
+      }
+    }
+  }
+
+  ${p => p.isInline &&
+    css `
+      > .rs-radio:not(:first-child) {
+        margin-left: 0.75rem;
+      }
+    `}
+`;
+
+function Select({ isLabelHidden = false, label, onChange, options, 
+// eslint-disable-next-line @typescript-eslint/naming-convention
+searchable = false, ...originalProps }) {
+    const key = useMemo(() => `${originalProps.name}-${JSON.stringify(originalProps.defaultValue)}`, [originalProps.defaultValue, originalProps.name]);
+    const handleChange = useCallback((nextValue) => {
+        if (!onChange) {
+            return;
+        }
+        const normalizedNextValue = nextValue ?? undefined;
+        onChange(normalizedNextValue);
+    }, [onChange]);
+    return (jsxs(Field$2, { children: [jsx(Label, { htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledSelectPicker, { data: options, id: originalProps.name, 
+                // The `unknown` type from Rsuite library is wrong. It should be inferred from `data` prop type.
+                // `onChange: ((value: unknown, event: React.SyntheticEvent<Element, Event>) => void) | undefined`
+                onChange: handleChange, searchable: searchable, ...originalProps }, key)] }));
+}
+const StyledSelectPicker = styled(SelectPicker) ``;
+
+function Textarea({ isLabelHidden = false, label, onChange, rows = 3, ...originalProps }) {
+    const inputRef = useRef();
+    const key = useMemo(() => `${originalProps.name}-${JSON.stringify(originalProps.defaultValue)}`, [originalProps.defaultValue, originalProps.name]);
+    const handleChange = useCallback(() => {
+        if (!onChange) {
+            return;
+        }
+        const nextValue = inputRef.current.value.trim();
+        const normalizedNextValue = nextValue.length ? nextValue : undefined;
+        onChange(normalizedNextValue);
+    }, [onChange]);
+    return (jsxs(Field$2, { children: [jsx(Label, { htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput$1, { ref: inputRef, as: "textarea", id: originalProps.name, onChange: handleChange, rows: rows, ...originalProps }, key)] }));
+}
+const StyledInput$1 = styled(Input) `
+  background-color: ${p => p.theme.color.gainsboro};
+  border: 0;
+  width: 100%;
+`;
+
+function TextInput({ isLabelHidden = false, label, onChange, ...originalProps }) {
+    const key = useMemo(() => `${originalProps.name}-${JSON.stringify(originalProps.defaultValue)}`, [originalProps.defaultValue, originalProps.name]);
+    const handleChange = useCallback((nextValue) => {
+        if (!onChange) {
+            return;
+        }
+        const normalizedNextValue = nextValue && nextValue.trim().length ? nextValue : undefined;
+        onChange(normalizedNextValue);
+    }, [onChange]);
+    return (jsxs(Field$2, { children: [jsx(Label, { htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(StyledInput, { id: originalProps.name, onChange: handleChange, ...originalProps }, key)] }));
+}
+const StyledInput = styled(Input) `
+  background-color: ${p => p.theme.color.gainsboro};
+  width: 100%;
+`;
+
+function FormikCheckbox({ name, ...originalProps }) {
+    const [field, , helpers] = useField(name);
+    const value = useMemo(() => field.value, [field.value]);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const setValue = useMemo(() => helpers.setValue, [helpers.setValue]);
+    const handleChange = useCallback((isChecked) => {
+        setValue(isChecked);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(Checkbox, { defaultChecked: value, name: name, onChange: handleChange, ...originalProps });
+}
+
+function FormikDatePicker({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    const { setValue } = helpers;
+    // We don't include `setValues` in `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(DatePicker, { onChange: setValue, ...originalProps });
+}
+
+function FormikDateRangePicker({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    const { setValue } = helpers;
+    // We don't include `setValues` in  `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(DateRangePicker, { onChange: setValue, ...originalProps });
+}
+
+function FormikEffect({ onChange }) {
+    const { values } = useFormikContext();
+    useEffect(() => {
+        onChange(values);
+    }, [onChange, values]);
+    return jsx(Fragment, {});
+}
+
+function FormikMultiCheckbox({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const { setValue } = helpers;
+    const handleChange = useCallback((nextValue) => {
+        setValue(nextValue);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(MultiCheckbox, { name: name, onChange: handleChange, ...originalProps });
+}
+
+function FormikMultiSelect({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const { setValue } = helpers;
+    const handleChange = useCallback((nextValue) => {
+        setValue(nextValue);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(MultiSelect, { name: name, onChange: handleChange, ...originalProps });
+}
+
+function FormikMultiRadio({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const { setValue } = helpers;
+    const handleChange = useCallback((nextValue) => {
+        setValue(nextValue);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(MultiRadio, { name: name, onChange: handleChange, ...originalProps });
+}
+
+function FormikSelect({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const { setValue } = helpers;
+    const handleChange = useCallback((nextValue) => {
+        setValue(nextValue);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(Select, { name: name, onChange: handleChange, ...originalProps });
+}
+
+function FormikTextarea({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const { setValue } = helpers;
+    const handleChange = useCallback((nextValue) => {
+        setValue(nextValue);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(Textarea, { name: name, onChange: handleChange, ...originalProps });
+}
+
+function FormikTextInput({ name, ...originalProps }) {
+    const [, , helpers] = useField(name);
+    // We don't include `setValues` in `useCallback()` and `useEffect()` dependencies
+    // both because it is useless and it will trigger infinite hook calls
+    const { setValue } = helpers;
+    const handleChange = useCallback((nextValue) => {
+        setValue(nextValue);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(() => () => setValue(undefined), []);
+    return jsx(TextInput, { name: name, onChange: handleChange, ...originalProps });
+}
+
+const UntypedStyledComponentsThemeProvider = ThemeProvider$1;
+function ThemeProvider({ children, theme = {} }) {
+    const finalTheme = mergeDeepRight(THEME, theme);
+    return jsx(UntypedStyledComponentsThemeProvider, { theme: finalTheme, children: children });
+}
+
+export { Checkbox, DatePicker, DateRangePicker, Field$2 as Field, Fieldset, FormikCheckbox, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikSelect, FormikTextInput, FormikTextarea, Label, Legend, constants as MUI, MultiCheckbox, MultiRadio, MultiSelect, Select, THEME, TextInput, Textarea, ThemeProvider };
+//# sourceMappingURL=index.js.map