@deephaven/components 0.5.2-beta.0 → 0.6.1-demo.10

package/dist/TimeInput.js

@@ -1,56 +1,25 @@
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 import React, { useEffect, useState } from 'react';
 import Log from '@deephaven/log';
 import { TimeUtils } from '@deephaven/utils';
-import MaskedInput from './MaskedInput';
+import MaskedInput from "./MaskedInput.js";
 var log = Log.module('TimeInput');
 var TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';
 var EXAMPLES = ['00:00:00', '12:34:56', '23:59:59'];
 // Forward ref causes a false positive for display-name in eslint:
 // https://github.com/yannickcr/eslint-plugin-react/issues/2269
 // eslint-disable-next-line react/display-name
-var TimeInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$allowValueWrap = props.allowValueWrapping,
-      allowValueWrapping = _props$allowValueWrap === void 0 ? true : _props$allowValueWrap,
-      _props$className = props.className,
-      className = _props$className === void 0 ? '' : _props$className,
-      _props$onChange = props.onChange,
-      onChange = _props$onChange === void 0 ? function () {
-    return false;
-  } : _props$onChange,
-      _props$value = props.value,
-      propsValue = _props$value === void 0 ? 0 : _props$value,
-      _props$onFocus = props.onFocus,
-      onFocus = _props$onFocus === void 0 ? function () {
-    return false;
-  } : _props$onFocus,
-      _props$onBlur = props.onBlur,
-      onBlur = _props$onBlur === void 0 ? function () {
-    return false;
-  } : _props$onBlur;
-
-  var _useState = useState(TimeUtils.formatTime(propsValue)),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  var _useState3 = useState(),
-      _useState4 = _slicedToArray(_useState3, 2),
-      selection = _useState4[0],
-      setSelection = _useState4[1];
-
-  useEffect(function () {
+var TimeInput = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var {
+    allowValueWrapping = true,
+    className = '',
+    onChange = () => false,
+    value: propsValue = 0,
+    onFocus = () => false,
+    onBlur = () => false
+  } = props;
+  var [value, setValue] = useState(TimeUtils.formatTime(propsValue));
+  var [selection, setSelection] = useState();
+  useEffect(() => {
     setValue(TimeUtils.formatTime(propsValue));
   }, [propsValue]);
 
@@ -101,16 +70,10 @@ var TimeInput = /*#__PURE__*/React.forwardRef(function (props, ref) {
 TimeInput.defaultProps = {
   allowValueWrapping: true,
   className: '',
-  onChange: function onChange() {
-    return false;
-  },
+  onChange: () => false,
   value: 0,
-  onFocus: function onFocus() {
-    return false;
-  },
-  onBlur: function onBlur() {
-    return false;
-  }
+  onFocus: () => false,
+  onBlur: () => false
 };
 export default TimeInput;
 //# sourceMappingURL=TimeInput.js.map

package/dist/TimeInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TimeInput.tsx"],"names":["React","useEffect","useState","Log","TimeUtils","MaskedInput","log","module","TIME_PATTERN","EXAMPLES","TimeInput","forwardRef","props","ref","allowValueWrapping","className","onChange","value","propsValue","onFocus","onBlur","formatTime","setValue","selection","setSelection","getNextSegmentValue","range","delta","segmentValue","maxValue","selectionStart","newSegmentValue","parseInt","Number","isNaN","Math","min","max","padStart","handleChange","newValue","debug","isTimeString","parseTime","handleSelect","newSelection","defaultProps"],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport Log from '@deephaven/log';\nimport { TimeUtils } from '@deephaven/utils';\nimport MaskedInput, { SelectionSegment } from './MaskedInput';\n\nconst log = Log.module('TimeInput');\n\nconst TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';\nconst EXAMPLES = ['00:00:00', '12:34:56', '23:59:59'];\n\ntype TimeInputProps = {\n  allowValueWrapping?: boolean;\n  className?: string;\n  onChange?(timeInSec: number): void;\n  value?: number;\n  onFocus?(): void;\n  onBlur?(): void;\n};\n\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n  (props: TimeInputProps, ref) => {\n    const {\n      allowValueWrapping = true,\n      className = '',\n      onChange = () => false,\n      value: propsValue = 0,\n      onFocus = () => false,\n      onBlur = () => false,\n    } = props;\n    const [value, setValue] = useState(TimeUtils.formatTime(propsValue));\n    const [selection, setSelection] = useState<SelectionSegment>();\n    useEffect(() => {\n      setValue(TimeUtils.formatTime(propsValue));\n    }, [propsValue]);\n\n    function getNextSegmentValue(\n      range: SelectionSegment,\n      delta: number,\n      segmentValue: string\n    ): string {\n      // Delta is backward because negative Y is up\n      const maxValue = range.selectionStart === 0 ? 24 : 60;\n      let newSegmentValue = parseInt(segmentValue, 10) - delta;\n      if (Number.isNaN(newSegmentValue)) {\n        newSegmentValue = 0;\n      } else if (allowValueWrapping) {\n        // Add max value and re-mod so we don't get negative values after mod\n        newSegmentValue = ((newSegmentValue % maxValue) + maxValue) % maxValue;\n      } else {\n        newSegmentValue = Math.min(Math.max(0, newSegmentValue), maxValue - 1);\n      }\n      return `${newSegmentValue}`.padStart(2, '0');\n    }\n\n    function handleChange(newValue: string): void {\n      log.debug('handleChange', newValue);\n      setValue(newValue);\n\n      // Only send a change if the value is actually valid\n      if (TimeUtils.isTimeString(newValue)) {\n        onChange(TimeUtils.parseTime(newValue));\n      }\n    }\n\n    function handleSelect(newSelection: SelectionSegment) {\n      setSelection(newSelection);\n    }\n\n    return (\n      <MaskedInput\n        ref={ref}\n        className={className}\n        example={EXAMPLES}\n        getNextSegmentValue={getNextSegmentValue}\n        onChange={handleChange}\n        onSelect={handleSelect}\n        pattern={TIME_PATTERN}\n        selection={selection}\n        value={value}\n        onFocus={onFocus}\n        onBlur={onBlur}\n      />\n    );\n  }\n);\n\nTimeInput.defaultProps = {\n  allowValueWrapping: true,\n  className: '',\n  onChange: () => false,\n  value: 0,\n  onFocus: () => false,\n  onBlur: () => false,\n};\n\nexport default TimeInput;\n"],"file":"TimeInput.js"}
+{"version":3,"sources":["../src/TimeInput.tsx"],"names":["React","useEffect","useState","Log","TimeUtils","MaskedInput","log","module","TIME_PATTERN","EXAMPLES","TimeInput","forwardRef","props","ref","allowValueWrapping","className","onChange","value","propsValue","onFocus","onBlur","setValue","formatTime","selection","setSelection","getNextSegmentValue","range","delta","segmentValue","maxValue","selectionStart","newSegmentValue","parseInt","Number","isNaN","Math","min","max","padStart","handleChange","newValue","debug","isTimeString","parseTime","handleSelect","newSelection","defaultProps"],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport Log from '@deephaven/log';\nimport { TimeUtils } from '@deephaven/utils';\nimport MaskedInput, { SelectionSegment } from './MaskedInput';\n\nconst log = Log.module('TimeInput');\n\nconst TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';\nconst EXAMPLES = ['00:00:00', '12:34:56', '23:59:59'];\n\ntype TimeInputProps = {\n  allowValueWrapping?: boolean;\n  className?: string;\n  onChange?(timeInSec: number): void;\n  value?: number;\n  onFocus?(): void;\n  onBlur?(): void;\n};\n\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst TimeInput = React.forwardRef<HTMLInputElement, TimeInputProps>(\n  (props: TimeInputProps, ref) => {\n    const {\n      allowValueWrapping = true,\n      className = '',\n      onChange = () => false,\n      value: propsValue = 0,\n      onFocus = () => false,\n      onBlur = () => false,\n    } = props;\n    const [value, setValue] = useState(TimeUtils.formatTime(propsValue));\n    const [selection, setSelection] = useState<SelectionSegment>();\n    useEffect(() => {\n      setValue(TimeUtils.formatTime(propsValue));\n    }, [propsValue]);\n\n    function getNextSegmentValue(\n      range: SelectionSegment,\n      delta: number,\n      segmentValue: string\n    ): string {\n      // Delta is backward because negative Y is up\n      const maxValue = range.selectionStart === 0 ? 24 : 60;\n      let newSegmentValue = parseInt(segmentValue, 10) - delta;\n      if (Number.isNaN(newSegmentValue)) {\n        newSegmentValue = 0;\n      } else if (allowValueWrapping) {\n        // Add max value and re-mod so we don't get negative values after mod\n        newSegmentValue = ((newSegmentValue % maxValue) + maxValue) % maxValue;\n      } else {\n        newSegmentValue = Math.min(Math.max(0, newSegmentValue), maxValue - 1);\n      }\n      return `${newSegmentValue}`.padStart(2, '0');\n    }\n\n    function handleChange(newValue: string): void {\n      log.debug('handleChange', newValue);\n      setValue(newValue);\n\n      // Only send a change if the value is actually valid\n      if (TimeUtils.isTimeString(newValue)) {\n        onChange(TimeUtils.parseTime(newValue));\n      }\n    }\n\n    function handleSelect(newSelection: SelectionSegment) {\n      setSelection(newSelection);\n    }\n\n    return (\n      <MaskedInput\n        ref={ref}\n        className={className}\n        example={EXAMPLES}\n        getNextSegmentValue={getNextSegmentValue}\n        onChange={handleChange}\n        onSelect={handleSelect}\n        pattern={TIME_PATTERN}\n        selection={selection}\n        value={value}\n        onFocus={onFocus}\n        onBlur={onBlur}\n      />\n    );\n  }\n);\n\nTimeInput.defaultProps = {\n  allowValueWrapping: true,\n  className: '',\n  onChange: () => false,\n  value: 0,\n  onFocus: () => false,\n  onBlur: () => false,\n};\n\nexport default TimeInput;\n"],"file":"TimeInput.js"}

package/dist/TimeSlider.js

@@ -1,20 +1,8 @@
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 /* eslint-disable react/no-array-index-key */
 // array maps being used are static, this is fine.
 import React, { useCallback, useMemo, useRef, useState, useEffect } from 'react';
 import classNames from 'classnames';
-import TimeInput from './TimeInput';
+import TimeInput from "./TimeInput.js";
 import StyleExports from "./TimeSlider.module.css";
 import "./TimeSlider.css";
 var HANDLE_SIZE = parseInt(StyleExports['handle-size'], 10);
@@ -27,33 +15,24 @@ var SNAP_NEAREST_MINUTES = 5 * 60; // rounds in 5 minute intervals
  * Creates a time slider for setting a start and end time, that can also run overnight
  * @param {startTime, endTime, onChange} props takes times in seconds 0 - 86399 and a callback
  */
-var TimeSlider = function TimeSlider(_ref) {
-  var propStartTime = _ref.startTime,
-      propEndTime = _ref.endTime,
-      onChange = _ref.onChange,
-      _ref$isStartModified = _ref.isStartModified,
-      isStartModified = _ref$isStartModified === void 0 ? false : _ref$isStartModified,
-      _ref$isEndModified = _ref.isEndModified,
-      isEndModified = _ref$isEndModified === void 0 ? false : _ref$isEndModified;
-
-  var _useState = useState(propStartTime),
-      _useState2 = _slicedToArray(_useState, 2),
-      startTime = _useState2[0],
-      setStartTime = _useState2[1];
-
-  var _useState3 = useState(propEndTime),
-      _useState4 = _slicedToArray(_useState3, 2),
-      endTime = _useState4[0],
-      setEndTime = _useState4[1];
-
+var TimeSlider = (_ref) => {
+  var {
+    startTime: propStartTime,
+    endTime: propEndTime,
+    onChange,
+    isStartModified = false,
+    isEndModified = false
+  } = _ref;
+  var [startTime, setStartTime] = useState(propStartTime);
+  var [endTime, setEndTime] = useState(propEndTime);
   var track = useRef(null); // we need the track width while calulculating time from handle drag
   // updates state if props change
 
-  useEffect(function () {
+  useEffect(() => {
     setStartTime(propStartTime);
     setEndTime(propEndTime);
   }, [propStartTime, propEndTime]);
-  var updateTime = useCallback(function (newStartTime, newEndTime) {
+  var updateTime = useCallback((newStartTime, newEndTime) => {
     var start = newStartTime;
     var end = newEndTime;
 
@@ -72,10 +51,10 @@ var TimeSlider = function TimeSlider(_ref) {
       endTime: end
     });
   }, [setStartTime, setEndTime, onChange]);
-  var handleStartTimeChange = useCallback(function (newStartTime) {
+  var handleStartTimeChange = useCallback(newStartTime => {
     updateTime(newStartTime, endTime);
   }, [updateTime, endTime]);
-  var handleEndTimeChange = useCallback(function (newEndTime) {
+  var handleEndTimeChange = useCallback(newEndTime => {
     updateTime(startTime, newEndTime);
   }, [updateTime, startTime]);
   return /*#__PURE__*/React.createElement("div", {
@@ -95,12 +74,10 @@ var TimeSlider = function TimeSlider(_ref) {
     endTime: endTime
   }), /*#__PURE__*/React.createElement("div", {
     className: "ticks"
-  }, Array(24).fill(null).map(function (value, index) {
-    return /*#__PURE__*/React.createElement("div", {
-      className: "tick",
-      key: index
-    });
-  })), /*#__PURE__*/React.createElement(Handle, {
+  }, Array(24).fill(null).map((value, index) => /*#__PURE__*/React.createElement("div", {
+    className: "tick",
+    key: index
+  }))), /*#__PURE__*/React.createElement(Handle, {
     track: track,
     time: startTime,
     setTime: handleStartTimeChange
@@ -114,33 +91,24 @@ var TimeSlider = function TimeSlider(_ref) {
     className: "tick-label"
   }, "0:00"), /*#__PURE__*/React.createElement("div", {
     className: "tick-label-wrapper"
-  }, Array(24).fill(null).map(function (value, index) {
-    return /*#__PURE__*/React.createElement("div", {
-      className: "tick-label",
-      key: index
-    }, "".concat(index + 1, ":00"));
-  }))));
+  }, Array(24).fill(null).map((value, index) => /*#__PURE__*/React.createElement("div", {
+    className: "tick-label",
+    key: index
+  }, "".concat(index + 1, ":00"))))));
 };
 
-var PopOvers = function PopOvers(props) {
-  var startTime = props.startTime,
-      endTime = props.endTime,
-      onStartTimeChange = props.onStartTimeChange,
-      onEndTimeChange = props.onEndTimeChange,
-      isStartModified = props.isStartModified,
-      isEndModified = props.isEndModified;
-
-  var _useState5 = useState(startTime > endTime ? endTime : startTime),
-      _useState6 = _slicedToArray(_useState5, 2),
-      firstTime = _useState6[0],
-      setFirstTime = _useState6[1];
-
-  var _useState7 = useState(startTime > endTime ? startTime : endTime),
-      _useState8 = _slicedToArray(_useState7, 2),
-      secondTime = _useState8[0],
-      setSecondTime = _useState8[1];
-
-  useEffect(function () {
+var PopOvers = props => {
+  var {
+    startTime,
+    endTime,
+    onStartTimeChange,
+    onEndTimeChange,
+    isStartModified,
+    isEndModified
+  } = props;
+  var [firstTime, setFirstTime] = useState(startTime > endTime ? endTime : startTime);
+  var [secondTime, setSecondTime] = useState(startTime > endTime ? startTime : endTime);
+  useEffect(() => {
     setFirstTime(startTime > endTime ? endTime : startTime);
     setSecondTime(startTime > endTime ? startTime : endTime);
   }, [startTime, endTime]);
@@ -201,9 +169,11 @@ var PopOvers = function PopOvers(props) {
 /**
  * Shades the area between or outside of handles according to if start or endtime is greater.
  */
-var TrackFills = function TrackFills(props) {
-  var startTime = props.startTime,
-      endTime = props.endTime;
+var TrackFills = props => {
+  var {
+    startTime,
+    endTime
+  } = props;
   return /*#__PURE__*/React.createElement("div", {
     className: "track-fills"
   }, startTime > endTime && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
@@ -227,10 +197,12 @@ var TrackFills = function TrackFills(props) {
 /**
  * Creates a draggable handle the sets the time
  */
-var Handle = function Handle(props) {
-  var track = props.track,
-      time = props.time,
-      setTime = props.setTime;
+var Handle = props => {
+  var {
+    track,
+    time,
+    setTime
+  } = props;
   /**
    * Takes the time and generate our translation string taking into account handle offset.
    * The handle offset changes for the first and last tick range dynmaically. Normally,
@@ -239,7 +211,7 @@ var Handle = function Handle(props) {
    * @param {number} t time in seconds
    */
 
-  var transform = useMemo(function () {
+  var transform = useMemo(() => {
     var ONE_HOUR = 60 * 60;
     var handleOffset = HANDLE_SIZE / 2;
 
@@ -251,7 +223,7 @@ var Handle = function Handle(props) {
 
     return "translateX(calc(".concat(time / SECONDS_IN_DAY * 100, "% - ").concat(handleOffset, "px))");
   }, [time]);
-  var calculatePositionAsTime = useCallback(function (clientX) {
+  var calculatePositionAsTime = useCallback(clientX => {
     if (!track.current) {
       return 0;
     }
@@ -266,39 +238,41 @@ var Handle = function Handle(props) {
     var limitMax = Math.min(SECONDS_IN_DAY, roundedTime);
     return limitMax;
   }, [track]);
-  var handleMouseMove = useCallback(function (_ref2) {
-    var clientX = _ref2.clientX;
+  var handleMouseMove = useCallback((_ref2) => {
+    var {
+      clientX
+    } = _ref2;
     setTime(calculatePositionAsTime(clientX));
   }, [setTime, calculatePositionAsTime]);
-  var handleMouseUp = useCallback(function (_ref3) {
-    var clientX = _ref3.clientX;
+  var handleMouseUp = useCallback((_ref3) => {
+    var {
+      clientX
+    } = _ref3;
     setTime(calculatePositionAsTime(clientX));
     window.removeEventListener('mousemove', handleMouseMove);
     window.removeEventListener('mouseup', handleMouseUp);
     document.documentElement.classList.remove('drag-pointer-events-none');
   }, [setTime, calculatePositionAsTime, handleMouseMove]);
-  var startDragListening = useCallback(function () {
+  var startDragListening = useCallback(() => {
     window.addEventListener('mousemove', handleMouseMove);
     window.addEventListener('mouseup', handleMouseUp);
     document.documentElement.classList.add('drag-pointer-events-none');
   }, [handleMouseMove, handleMouseUp]);
-  var stopDragListening = useCallback(function () {
+  var stopDragListening = useCallback(() => {
     window.removeEventListener('mousemove', handleMouseMove);
     window.removeEventListener('mouseup', handleMouseUp);
     document.documentElement.classList.remove('drag-pointer-events-none');
   }, [handleMouseMove, handleMouseUp]);
-  var handleMouseDown = useCallback(function () {
+  var handleMouseDown = useCallback(() => {
     startDragListening();
   }, [startDragListening]);
-  useEffect(function () {
-    return function () {
-      stopDragListening();
-    };
+  useEffect(() => () => {
+    stopDragListening();
   }, [stopDragListening]);
   return /*#__PURE__*/React.createElement("div", {
     className: "handle-track",
     style: {
-      transform: transform
+      transform
     }
   }, /*#__PURE__*/React.createElement("button", {
     className: "handle",

package/dist/TimeSlider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TimeSlider.tsx"],"names":["React","useCallback","useMemo","useRef","useState","useEffect","classNames","TimeInput","StyleExports","HANDLE_SIZE","parseInt","POPOVER_WIDTH","SECONDS_IN_DAY","SNAP_NEAREST_MINUTES","TimeSlider","propStartTime","startTime","propEndTime","endTime","onChange","isStartModified","isEndModified","setStartTime","setEndTime","track","updateTime","newStartTime","newEndTime","start","end","handleStartTimeChange","handleEndTimeChange","Array","fill","map","value","index","PopOvers","props","onStartTimeChange","onEndTimeChange","firstTime","setFirstTime","secondTime","setSecondTime","onFirstTimeChange","onSecondTimeChange","flexBasis","modified","TrackFills","transform","Handle","time","setTime","ONE_HOUR","handleOffset","calculatePositionAsTime","clientX","current","trackRect","getBoundingClientRect","leftEdge","Math","max","left","preciseTime","min","width","roundedTime","round","limitMax","handleMouseMove","handleMouseUp","window","removeEventListener","document","documentElement","classList","remove","startDragListening","addEventListener","add","stopDragListening","handleMouseDown"],"mappings":";;;;;;;;;;;;AAAA;AACA;AAEA,OAAOA,KAAP,IACEC,WADF,EAEEC,OAFF,EAGEC,MAHF,EAIEC,QAJF,EAKEC,SALF,QAMO,OANP;AAOA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,SAAP,MAAsB,aAAtB;AACA,OAAOC,YAAP;AACA;AAEA,IAAMC,WAAW,GAAGC,QAAQ,CAACF,YAAY,CAAC,aAAD,CAAb,EAA8B,EAA9B,CAA5B;AACA,IAAMG,aAAa,GAAGD,QAAQ,CAACF,YAAY,CAAC,eAAD,CAAb,EAAgC,EAAhC,CAA9B;AACA,IAAMI,cAAc,GAAG,KAAK,EAAL,GAAU,EAAV,GAAe,CAAtC,C,CAAyC;;AACzC,IAAMC,oBAAoB,GAAG,IAAI,EAAjC,C,CAAqC;;AAUrC;AACA;AACA;AACA;AACA,IAAMC,UAAU,GAAG,SAAbA,UAAa,OAMiB;AAAA,MALvBC,aAKuB,QALlCC,SAKkC;AAAA,MAJzBC,WAIyB,QAJlCC,OAIkC;AAAA,MAHlCC,QAGkC,QAHlCA,QAGkC;AAAA,kCAFlCC,eAEkC;AAAA,MAFlCA,eAEkC,qCAFhB,KAEgB;AAAA,gCADlCC,aACkC;AAAA,MADlCA,aACkC,mCADlB,KACkB;;AAClC,kBAAkCjB,QAAQ,CAACW,aAAD,CAA1C;AAAA;AAAA,MAAOC,SAAP;AAAA,MAAkBM,YAAlB;;AACA,mBAA8BlB,QAAQ,CAACa,WAAD,CAAtC;AAAA;AAAA,MAAOC,OAAP;AAAA,MAAgBK,UAAhB;;AAEA,MAAMC,KAAK,GAAGrB,MAAM,CAAiB,IAAjB,CAApB,CAJkC,CAIU;AAE5C;;AACAE,EAAAA,SAAS,CAAC,YAAM;AACdiB,IAAAA,YAAY,CAACP,aAAD,CAAZ;AACAQ,IAAAA,UAAU,CAACN,WAAD,CAAV;AACD,GAHQ,EAGN,CAACF,aAAD,EAAgBE,WAAhB,CAHM,CAAT;AAKA,MAAMQ,UAAU,GAAGxB,WAAW,CAC5B,UAACyB,YAAD,EAAuBC,UAAvB,EAA8C;AAC5C,QAAIC,KAAK,GAAGF,YAAZ;AACA,QAAIG,GAAG,GAAGF,UAAV;;AACA,QAAIC,KAAK,KAAKC,GAAd,EAAmB;AACjB,UAAIA,GAAG,GAAGjB,cAAV,EAA0B;AACxBiB,QAAAA,GAAG,IAAI,CAAP;AACD,OAFD,MAEO;AACLD,QAAAA,KAAK,IAAI,CAAT;AACD;AACF;;AAEDN,IAAAA,YAAY,CAACM,KAAD,CAAZ;AACAL,IAAAA,UAAU,CAACM,GAAD,CAAV;AACAV,IAAAA,QAAQ,CAAC;AAAEH,MAAAA,SAAS,EAAEY,KAAb;AAAoBV,MAAAA,OAAO,EAAEW;AAA7B,KAAD,CAAR;AACD,GAf2B,EAgB5B,CAACP,YAAD,EAAeC,UAAf,EAA2BJ,QAA3B,CAhB4B,CAA9B;AAmBA,MAAMW,qBAAqB,GAAG7B,WAAW,CACvC,UAACyB,YAAD,EAA0B;AACxBD,IAAAA,UAAU,CAACC,YAAD,EAAeR,OAAf,CAAV;AACD,GAHsC,EAIvC,CAACO,UAAD,EAAaP,OAAb,CAJuC,CAAzC;AAOA,MAAMa,mBAAmB,GAAG9B,WAAW,CACrC,UAAC0B,UAAD,EAAwB;AACtBF,IAAAA,UAAU,CAACT,SAAD,EAAYW,UAAZ,CAAV;AACD,GAHoC,EAIrC,CAACF,UAAD,EAAaT,SAAb,CAJqC,CAAvC;AAOA,sBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE,oBAAC,QAAD;AACE,IAAA,SAAS,EAAEA,SADb;AAEE,IAAA,OAAO,EAAEE,OAFX;AAGE,IAAA,iBAAiB,EAAEY,qBAHrB;AAIE,IAAA,eAAe,EAAEC,mBAJnB;AAKE,IAAA,eAAe,EAAEX,eALnB;AAME,IAAA,aAAa,EAAEC;AANjB,IADF,eASE;AAAK,IAAA,SAAS,EAAC,OAAf;AAAuB,IAAA,GAAG,EAAEG;AAA5B,kBACE,oBAAC,UAAD;AAAY,IAAA,SAAS,EAAER,SAAvB;AAAkC,IAAA,OAAO,EAAEE;AAA3C,IADF,eAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGc,KAAK,CAAC,EAAD,CAAL,CACEC,IADF,CACO,IADP,EAEEC,GAFF,CAEM,UAACC,KAAD,EAAQC,KAAR;AAAA,wBACH;AAAK,MAAA,SAAS,EAAC,MAAf;AAAsB,MAAA,GAAG,EAAEA;AAA3B,MADG;AAAA,GAFN,CADH,CAFF,eASE,oBAAC,MAAD;AACE,IAAA,KAAK,EAAEZ,KADT;AAEE,IAAA,IAAI,EAAER,SAFR;AAGE,IAAA,OAAO,EAAEc;AAHX,IATF,eAcE,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAEN,KAAf;AAAsB,IAAA,IAAI,EAAEN,OAA5B;AAAqC,IAAA,OAAO,EAAEa;AAA9C,IAdF,CATF,eA0BE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,YADF,eAEE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGC,KAAK,CAAC,EAAD,CAAL,CACEC,IADF,CACO,IADP,EAEEC,GAFF,CAEM,UAACC,KAAD,EAAQC,KAAR;AAAA,wBACH;AAAK,MAAA,SAAS,EAAC,YAAf;AAA4B,MAAA,GAAG,EAAEA;AAAjC,iBAA4CA,KAAK,GAAG,CAApD,SADG;AAAA,GAFN,CADH,CAFF,CA1BF,CADF;AAuCD,CA1FD;;AAqGA,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAuC;AACtD,MACEtB,SADF,GAOIsB,KAPJ,CACEtB,SADF;AAAA,MAEEE,OAFF,GAOIoB,KAPJ,CAEEpB,OAFF;AAAA,MAGEqB,iBAHF,GAOID,KAPJ,CAGEC,iBAHF;AAAA,MAIEC,eAJF,GAOIF,KAPJ,CAIEE,eAJF;AAAA,MAKEpB,eALF,GAOIkB,KAPJ,CAKElB,eALF;AAAA,MAMEC,aANF,GAOIiB,KAPJ,CAMEjB,aANF;;AASA,mBAAkCjB,QAAQ,CACxCY,SAAS,GAAGE,OAAZ,GAAsBA,OAAtB,GAAgCF,SADQ,CAA1C;AAAA;AAAA,MAAOyB,SAAP;AAAA,MAAkBC,YAAlB;;AAGA,mBAAoCtC,QAAQ,CAC1CY,SAAS,GAAGE,OAAZ,GAAsBF,SAAtB,GAAkCE,OADQ,CAA5C;AAAA;AAAA,MAAOyB,UAAP;AAAA,MAAmBC,aAAnB;;AAIAvC,EAAAA,SAAS,CAAC,YAAM;AACdqC,IAAAA,YAAY,CAAC1B,SAAS,GAAGE,OAAZ,GAAsBA,OAAtB,GAAgCF,SAAjC,CAAZ;AACA4B,IAAAA,aAAa,CAAC5B,SAAS,GAAGE,OAAZ,GAAsBF,SAAtB,GAAkCE,OAAnC,CAAb;AACD,GAHQ,EAGN,CAACF,SAAD,EAAYE,OAAZ,CAHM,CAAT;;AAKA,WAAS2B,iBAAT,CAA2BV,KAA3B,EAA0C;AACxC,QAAInB,SAAS,IAAIE,OAAjB,EAA0B;AACxBqB,MAAAA,iBAAiB,CAACJ,KAAD,CAAjB;AACD,KAFD,MAEO;AACLK,MAAAA,eAAe,CAACL,KAAD,CAAf;AACD;AACF;;AAED,WAASW,kBAAT,CAA4BX,KAA5B,EAA2C;AACzC,QAAInB,SAAS,IAAIE,OAAjB,EAA0B;AACxBsB,MAAAA,eAAe,CAACL,KAAD,CAAf;AACD,KAFD,MAEO;AACLI,MAAAA,iBAAiB,CAACJ,KAAD,CAAjB;AACD;AACF;;AAED,sBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,KAAK,EAAE;AACLY,MAAAA,SAAS,iBAAWN,SAAS,GAAG7B,cAAb,GAA+B,GAAzC,iBACPD,aAAa,GAAG,CADT;AADJ;AAFT,IADF,eASE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AACE,IAAA,SAAS,EAAEL,UAAU,CAAC;AACpB0C,MAAAA,QAAQ,EAAEhC,SAAS,GAAGE,OAAZ,GAAsBE,eAAtB,GAAwCC;AAD9B,KAAD;AADvB,KAKGL,SAAS,IAAIE,OAAb,GAAuB,YAAvB,GAAsC,UALzC,CADF,eAQE,oBAAC,SAAD;AACE,IAAA,kBAAkB,EAAE,KADtB;AAEE,IAAA,KAAK,EAAEuB,SAFT;AAGE,IAAA,QAAQ,EAAEI;AAHZ,IARF,CATF,eAuBE;AAAK,IAAA,SAAS,EAAC;AAAf,IAvBF,eAwBE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AACE,IAAA,SAAS,EAAEvC,UAAU,CAAC;AACpB0C,MAAAA,QAAQ,EAAEhC,SAAS,GAAGE,OAAZ,GAAsBE,eAAtB,GAAwCC;AAD9B,KAAD;AADvB,KAKGL,SAAS,GAAGE,OAAZ,GAAsB,YAAtB,GAAqC,UALxC,CADF,eAQE,oBAAC,SAAD;AACE,IAAA,kBAAkB,EAAE,KADtB;AAEE,IAAA,KAAK,EAAEyB,UAFT;AAGE,IAAA,QAAQ,EAAEG;AAHZ,IARF,CAxBF,eAsCE;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,SAAS,iBACN,CAACnC,cAAc,GAAG+B,UAAlB,IAAgC/B,cAAjC,GAAmD,GAD5C,iBAEFD,aAAa,GAAG,CAFd;AADJ;AAFT,IAtCF,CADF;AAiDD,CAvFD;;AA8FA;AACA;AACA;AACA,IAAMsC,UAAU,GAAG,SAAbA,UAAa,CAACX,KAAD,EAAyC;AAC1D,MAAQtB,SAAR,GAA+BsB,KAA/B,CAAQtB,SAAR;AAAA,MAAmBE,OAAnB,GAA+BoB,KAA/B,CAAmBpB,OAAnB;AACA,sBACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACGF,SAAS,GAAGE,OAAZ,iBACC,uDACE;AACE,IAAA,SAAS,EAAC,6BADZ;AAEE,IAAA,KAAK,EAAE;AAAEgC,MAAAA,SAAS,mBAAYhC,OAAO,GAAGN,cAAtB;AAAX;AAFT,IADF,eAKE;AACE,IAAA,SAAS,EAAC,2BADZ;AAEE,IAAA,KAAK,EAAE;AACLsC,MAAAA,SAAS,mBACP,CAACtC,cAAc,GAAGI,SAAlB,IAA+BJ,cADxB;AADJ;AAFT,IALF,CAFJ,EAiBGI,SAAS,GAAGE,OAAZ,iBACC;AACE,IAAA,SAAS,EAAC,8BADZ;AAEE,IAAA,KAAK,EAAE;AACLgC,MAAAA,SAAS,uBACNlC,SAAS,GAAGJ,cAAb,GAA+B,GADxB,uBAEI,CAACM,OAAO,GAAGF,SAAX,IAAwBJ,cAF5B;AADJ;AAFT,IAlBJ,CADF;AA8BD,CAhCD;;AAwCA;AACA;AACA;AACA,IAAMuC,MAAM,GAAG,SAATA,MAAS,CAACb,KAAD,EAAqC;AAClD,MAAQd,KAAR,GAAiCc,KAAjC,CAAQd,KAAR;AAAA,MAAe4B,IAAf,GAAiCd,KAAjC,CAAec,IAAf;AAAA,MAAqBC,OAArB,GAAiCf,KAAjC,CAAqBe,OAArB;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;;AACE,MAAMH,SAAS,GAAGhD,OAAO,CAAC,YAAM;AAC9B,QAAMoD,QAAQ,GAAG,KAAK,EAAtB;AACA,QAAIC,YAAY,GAAG9C,WAAW,GAAG,CAAjC;;AACA,QAAI2C,IAAI,GAAGE,QAAX,EAAqB;AACnBC,MAAAA,YAAY,GAAIH,IAAI,GAAGE,QAAR,IAAqB7C,WAAW,GAAG,CAAnC,CAAf,CADmB,CACmC;AACvD,KAFD,MAEO,IAAI2C,IAAI,GAAG,KAAKE,QAAhB,EAA0B;AAC/BC,MAAAA,YAAY,GACV9C,WAAW,GAAG,CAAd,GACC,KAAKG,cAAc,GAAG,KAAK0C,QAA3B,CAAD,IACGF,IAAI,GAAG,KAAKE,QADf,KAEG7C,WAAW,GAAG,CAFjB,CAFF,CAD+B,CAKR;AACxB;;AACD,qCACG2C,IAAI,GAAGxC,cAAR,GAA0B,GAD5B,iBAEO2C,YAFP;AAGD,GAfwB,EAetB,CAACH,IAAD,CAfsB,CAAzB;AAiBA,MAAMI,uBAAuB,GAAGvD,WAAW,CACzC,UAACwD,OAAD,EAAqB;AACnB,QAAI,CAACjC,KAAK,CAACkC,OAAX,EAAoB;AAClB,aAAO,CAAP;AACD;;AACD,QAAMC,SAAS,GAAGnC,KAAK,CAACkC,OAAN,CAAcE,qBAAd,EAAlB;AACA,QAAMC,QAAQ,GAAGC,IAAI,CAACC,GAAL,CAASN,OAAO,GAAGE,SAAS,CAACK,IAA7B,EAAmC,CAAnC,CAAjB,CALmB,CAMnB;;AACA,QAAMC,WAAW,GACfrD,cAAc,GAAGkD,IAAI,CAACI,GAAL,CAAS,CAAT,EAAYL,QAAQ,GAAGF,SAAS,CAACQ,KAAjC,CADnB,CAPmB,CASnB;;AACA,QAAMC,WAAW,GACfvD,oBAAoB,GAAGiD,IAAI,CAACO,KAAL,CAAWJ,WAAW,GAAGpD,oBAAzB,CADzB,CAVmB,CAYnB;;AACA,QAAMyD,QAAQ,GAAGR,IAAI,CAACI,GAAL,CAAStD,cAAT,EAAyBwD,WAAzB,CAAjB;AACA,WAAOE,QAAP;AACD,GAhBwC,EAiBzC,CAAC9C,KAAD,CAjByC,CAA3C;AAoBA,MAAM+C,eAAe,GAAGtE,WAAW,CACjC,iBAA6B;AAAA,QAA1BwD,OAA0B,SAA1BA,OAA0B;AAC3BJ,IAAAA,OAAO,CAACG,uBAAuB,CAACC,OAAD,CAAxB,CAAP;AACD,GAHgC,EAIjC,CAACJ,OAAD,EAAUG,uBAAV,CAJiC,CAAnC;AAOA,MAAMgB,aAAa,GAAGvE,WAAW,CAC/B,iBAA6B;AAAA,QAA1BwD,OAA0B,SAA1BA,OAA0B;AAC3BJ,IAAAA,OAAO,CAACG,uBAAuB,CAACC,OAAD,CAAxB,CAAP;AAEAgB,IAAAA,MAAM,CAACC,mBAAP,CAA2B,WAA3B,EAAwCH,eAAxC;AACAE,IAAAA,MAAM,CAACC,mBAAP,CAA2B,SAA3B,EAAsCF,aAAtC;AACAG,IAAAA,QAAQ,CAACC,eAAT,CAAyBC,SAAzB,CAAmCC,MAAnC,CAA0C,0BAA1C;AACD,GAP8B,EAQ/B,CAACzB,OAAD,EAAUG,uBAAV,EAAmCe,eAAnC,CAR+B,CAAjC;AAWA,MAAMQ,kBAAkB,GAAG9E,WAAW,CAAC,YAAM;AAC3CwE,IAAAA,MAAM,CAACO,gBAAP,CAAwB,WAAxB,EAAqCT,eAArC;AACAE,IAAAA,MAAM,CAACO,gBAAP,CAAwB,SAAxB,EAAmCR,aAAnC;AACAG,IAAAA,QAAQ,CAACC,eAAT,CAAyBC,SAAzB,CAAmCI,GAAnC,CAAuC,0BAAvC;AACD,GAJqC,EAInC,CAACV,eAAD,EAAkBC,aAAlB,CAJmC,CAAtC;AAMA,MAAMU,iBAAiB,GAAGjF,WAAW,CAAC,YAAM;AAC1CwE,IAAAA,MAAM,CAACC,mBAAP,CAA2B,WAA3B,EAAwCH,eAAxC;AACAE,IAAAA,MAAM,CAACC,mBAAP,CAA2B,SAA3B,EAAsCF,aAAtC;AACAG,IAAAA,QAAQ,CAACC,eAAT,CAAyBC,SAAzB,CAAmCC,MAAnC,CAA0C,0BAA1C;AACD,GAJoC,EAIlC,CAACP,eAAD,EAAkBC,aAAlB,CAJkC,CAArC;AAMA,MAAMW,eAAe,GAAGlF,WAAW,CAAC,YAAM;AACxC8E,IAAAA,kBAAkB;AACnB,GAFkC,EAEhC,CAACA,kBAAD,CAFgC,CAAnC;AAIA1E,EAAAA,SAAS,CACP;AAAA,WAAM,YAAM;AACV6E,MAAAA,iBAAiB;AAClB,KAFD;AAAA,GADO,EAIP,CAACA,iBAAD,CAJO,CAAT;AAOA,sBACE;AAAK,IAAA,SAAS,EAAC,cAAf;AAA8B,IAAA,KAAK,EAAE;AAAEhC,MAAAA,SAAS,EAATA;AAAF;AAArC,kBACE;AACE,IAAA,SAAS,EAAC,QADZ;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,kBAAW,aAHb;AAIE,IAAA,WAAW,EAAEiC;AAJf,IADF,CADF;AAUD,CAlGD;;AAoGA,eAAerE,UAAf","sourcesContent":["/* eslint-disable react/no-array-index-key */\n// array maps being used are static, this is fine.\n\nimport React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  useEffect,\n} from 'react';\nimport classNames from 'classnames';\nimport TimeInput from './TimeInput';\nimport StyleExports from './TimeSlider.module.scss';\nimport './TimeSlider.scss';\n\nconst HANDLE_SIZE = parseInt(StyleExports['handle-size'], 10);\nconst POPOVER_WIDTH = parseInt(StyleExports['popover-width'], 10);\nconst SECONDS_IN_DAY = 24 * 60 * 60 - 1; // Max is actually 23:59:59\nconst SNAP_NEAREST_MINUTES = 5 * 60; // rounds in 5 minute intervals\n\ntype TimeSliderProps = {\n  startTime: number;\n  endTime: number;\n  onChange(value: { startTime: number; endTime: number }): void;\n  isStartModified?: boolean;\n  isEndModified?: boolean;\n};\n\n/**\n * Creates a time slider for setting a start and end time, that can also run overnight\n * @param {startTime, endTime, onChange} props takes times in seconds 0 - 86399 and a callback\n */\nconst TimeSlider = ({\n  startTime: propStartTime,\n  endTime: propEndTime,\n  onChange,\n  isStartModified = false,\n  isEndModified = false,\n}: TimeSliderProps): JSX.Element => {\n  const [startTime, setStartTime] = useState(propStartTime);\n  const [endTime, setEndTime] = useState(propEndTime);\n\n  const track = useRef<HTMLDivElement>(null); // we need the track width while calulculating time from handle drag\n\n  // updates state if props change\n  useEffect(() => {\n    setStartTime(propStartTime);\n    setEndTime(propEndTime);\n  }, [propStartTime, propEndTime]);\n\n  const updateTime = useCallback(\n    (newStartTime: number, newEndTime: number) => {\n      let start = newStartTime;\n      let end = newEndTime;\n      if (start === end) {\n        if (end < SECONDS_IN_DAY) {\n          end += 1;\n        } else {\n          start -= 1;\n        }\n      }\n\n      setStartTime(start);\n      setEndTime(end);\n      onChange({ startTime: start, endTime: end });\n    },\n    [setStartTime, setEndTime, onChange]\n  );\n\n  const handleStartTimeChange = useCallback(\n    (newStartTime: number) => {\n      updateTime(newStartTime, endTime);\n    },\n    [updateTime, endTime]\n  );\n\n  const handleEndTimeChange = useCallback(\n    (newEndTime: number) => {\n      updateTime(startTime, newEndTime);\n    },\n    [updateTime, startTime]\n  );\n\n  return (\n    <div className=\"time-slider\">\n      <PopOvers\n        startTime={startTime}\n        endTime={endTime}\n        onStartTimeChange={handleStartTimeChange}\n        onEndTimeChange={handleEndTimeChange}\n        isStartModified={isStartModified}\n        isEndModified={isEndModified}\n      />\n      <div className=\"track\" ref={track}>\n        <TrackFills startTime={startTime} endTime={endTime} />\n        <div className=\"ticks\">\n          {Array(24)\n            .fill(null)\n            .map((value, index) => (\n              <div className=\"tick\" key={index} />\n            ))}\n        </div>\n        <Handle\n          track={track}\n          time={startTime}\n          setTime={handleStartTimeChange}\n        />\n        <Handle track={track} time={endTime} setTime={handleEndTimeChange} />\n      </div>\n\n      <div className=\"tick-labels\">\n        <div className=\"tick-label\">0:00</div>\n        <div className=\"tick-label-wrapper\">\n          {Array(24)\n            .fill(null)\n            .map((value, index) => (\n              <div className=\"tick-label\" key={index}>{`${index + 1}:00`}</div>\n            ))}\n        </div>\n      </div>\n    </div>\n  );\n};\n\ntype PopOversProps = {\n  startTime: number;\n  endTime: number;\n  onStartTimeChange(time: number): void;\n  onEndTimeChange(time: number): void;\n  isStartModified: boolean;\n  isEndModified: boolean;\n};\n\nconst PopOvers = (props: PopOversProps): JSX.Element => {\n  const {\n    startTime,\n    endTime,\n    onStartTimeChange,\n    onEndTimeChange,\n    isStartModified,\n    isEndModified,\n  } = props;\n\n  const [firstTime, setFirstTime] = useState(\n    startTime > endTime ? endTime : startTime\n  );\n  const [secondTime, setSecondTime] = useState(\n    startTime > endTime ? startTime : endTime\n  );\n\n  useEffect(() => {\n    setFirstTime(startTime > endTime ? endTime : startTime);\n    setSecondTime(startTime > endTime ? startTime : endTime);\n  }, [startTime, endTime]);\n\n  function onFirstTimeChange(value: number) {\n    if (startTime <= endTime) {\n      onStartTimeChange(value);\n    } else {\n      onEndTimeChange(value);\n    }\n  }\n\n  function onSecondTimeChange(value: number) {\n    if (startTime <= endTime) {\n      onEndTimeChange(value);\n    } else {\n      onStartTimeChange(value);\n    }\n  }\n\n  return (\n    <div className=\"time-slider-popovers\">\n      <div\n        className=\"flex\"\n        style={{\n          flexBasis: `calc(${(firstTime / SECONDS_IN_DAY) * 100}% - ${\n            POPOVER_WIDTH / 2\n          }px)`,\n        }}\n      />\n      <div className=\"handle-popper\">\n        <label\n          className={classNames({\n            modified: startTime < endTime ? isStartModified : isEndModified,\n          })}\n        >\n          {startTime <= endTime ? 'Start Time' : 'End Time'}\n        </label>\n        <TimeInput\n          allowValueWrapping={false}\n          value={firstTime}\n          onChange={onFirstTimeChange}\n        />\n      </div>\n      <div className=\"flex-spacer\" />\n      <div className=\"handle-popper\">\n        <label\n          className={classNames({\n            modified: startTime > endTime ? isStartModified : isEndModified,\n          })}\n        >\n          {startTime > endTime ? 'Start Time' : 'End Time'}\n        </label>\n        <TimeInput\n          allowValueWrapping={false}\n          value={secondTime}\n          onChange={onSecondTimeChange}\n        />\n      </div>\n      <div\n        className=\"flex\"\n        style={{\n          flexBasis: `calc(${\n            ((SECONDS_IN_DAY - secondTime) / SECONDS_IN_DAY) * 100\n          }% - ${POPOVER_WIDTH / 2}px)`,\n        }}\n      />\n    </div>\n  );\n};\n\ntype TrackFillsProps = {\n  startTime: number;\n  endTime: number;\n};\n\n/**\n * Shades the area between or outside of handles according to if start or endtime is greater.\n */\nconst TrackFills = (props: TrackFillsProps): JSX.Element => {\n  const { startTime, endTime } = props;\n  return (\n    <div className=\"track-fills\">\n      {startTime > endTime && (\n        <>\n          <div\n            className=\"track-fill track-fill-start\"\n            style={{ transform: `scaleX(${endTime / SECONDS_IN_DAY})` }}\n          />\n          <div\n            className=\"track-fill track-fill-end\"\n            style={{\n              transform: `scaleX(${\n                (SECONDS_IN_DAY - startTime) / SECONDS_IN_DAY\n              })`,\n            }}\n          />\n        </>\n      )}\n      {startTime < endTime && (\n        <div\n          className=\"track-fill track-fill-middle\"\n          style={{\n            transform: `translateX(${\n              (startTime / SECONDS_IN_DAY) * 100\n            }%) scaleX(${(endTime - startTime) / SECONDS_IN_DAY})`,\n          }}\n        />\n      )}\n    </div>\n  );\n};\n\ntype HandleProps = {\n  track: React.RefObject<HTMLDivElement>;\n  time: number;\n  setTime(time: number): void;\n};\n\n/**\n * Creates a draggable handle the sets the time\n */\nconst Handle = (props: HandleProps): JSX.Element => {\n  const { track, time, setTime } = props;\n\n  /**\n   * Takes the time and generate our translation string taking into account handle offset.\n   * The handle offset changes for the first and last tick range dynmaically. Normally,\n   * the center of the handle (size/2) is the selection origin, but at edges, it becomes either\n   * end of the handle, requireing a relative offset range of 0 - 0.5,  and 0.5 - 1 of handle size.\n   * @param {number} t time in seconds\n   */\n  const transform = useMemo(() => {\n    const ONE_HOUR = 60 * 60;\n    let handleOffset = HANDLE_SIZE / 2;\n    if (time < ONE_HOUR) {\n      handleOffset = (time / ONE_HOUR) * (HANDLE_SIZE / 2); // 0 - 0.5 Handle size\n    } else if (time > 23 * ONE_HOUR) {\n      handleOffset =\n        HANDLE_SIZE / 2 +\n        (1 / (SECONDS_IN_DAY - 23 * ONE_HOUR)) *\n          (time - 23 * ONE_HOUR) *\n          (HANDLE_SIZE / 2); // 0.5 - 1 Handle size\n    }\n    return `translateX(calc(${\n      (time / SECONDS_IN_DAY) * 100\n    }% - ${handleOffset}px))`;\n  }, [time]);\n\n  const calculatePositionAsTime = useCallback(\n    (clientX: number) => {\n      if (!track.current) {\n        return 0;\n      }\n      const trackRect = track.current.getBoundingClientRect();\n      const leftEdge = Math.max(clientX - trackRect.left, 0);\n      // get position as 0-1 on slider and mulitply by seconds in a day to convert to time\n      const preciseTime =\n        SECONDS_IN_DAY * Math.min(1, leftEdge / trackRect.width);\n      // snap to nearest N(5) minute interval\n      const roundedTime =\n        SNAP_NEAREST_MINUTES * Math.round(preciseTime / SNAP_NEAREST_MINUTES);\n      // prevent over-rounding to 24:00:00\n      const limitMax = Math.min(SECONDS_IN_DAY, roundedTime);\n      return limitMax;\n    },\n    [track]\n  );\n\n  const handleMouseMove = useCallback(\n    ({ clientX }: MouseEvent) => {\n      setTime(calculatePositionAsTime(clientX));\n    },\n    [setTime, calculatePositionAsTime]\n  );\n\n  const handleMouseUp = useCallback(\n    ({ clientX }: MouseEvent) => {\n      setTime(calculatePositionAsTime(clientX));\n\n      window.removeEventListener('mousemove', handleMouseMove);\n      window.removeEventListener('mouseup', handleMouseUp);\n      document.documentElement.classList.remove('drag-pointer-events-none');\n    },\n    [setTime, calculatePositionAsTime, handleMouseMove]\n  );\n\n  const startDragListening = useCallback(() => {\n    window.addEventListener('mousemove', handleMouseMove);\n    window.addEventListener('mouseup', handleMouseUp);\n    document.documentElement.classList.add('drag-pointer-events-none');\n  }, [handleMouseMove, handleMouseUp]);\n\n  const stopDragListening = useCallback(() => {\n    window.removeEventListener('mousemove', handleMouseMove);\n    window.removeEventListener('mouseup', handleMouseUp);\n    document.documentElement.classList.remove('drag-pointer-events-none');\n  }, [handleMouseMove, handleMouseUp]);\n\n  const handleMouseDown = useCallback(() => {\n    startDragListening();\n  }, [startDragListening]);\n\n  useEffect(\n    () => () => {\n      stopDragListening();\n    },\n    [stopDragListening]\n  );\n\n  return (\n    <div className=\"handle-track\" style={{ transform }}>\n      <button\n        className=\"handle\"\n        type=\"button\"\n        aria-label=\"Change time\"\n        onMouseDown={handleMouseDown}\n      />\n    </div>\n  );\n};\n\nexport default TimeSlider;\n"],"file":"TimeSlider.js"}
+{"version":3,"sources":["../src/TimeSlider.tsx"],"names":["React","useCallback","useMemo","useRef","useState","useEffect","classNames","TimeInput","StyleExports","HANDLE_SIZE","parseInt","POPOVER_WIDTH","SECONDS_IN_DAY","SNAP_NEAREST_MINUTES","TimeSlider","startTime","propStartTime","endTime","propEndTime","onChange","isStartModified","isEndModified","setStartTime","setEndTime","track","updateTime","newStartTime","newEndTime","start","end","handleStartTimeChange","handleEndTimeChange","Array","fill","map","value","index","PopOvers","props","onStartTimeChange","onEndTimeChange","firstTime","setFirstTime","secondTime","setSecondTime","onFirstTimeChange","onSecondTimeChange","flexBasis","modified","TrackFills","transform","Handle","time","setTime","ONE_HOUR","handleOffset","calculatePositionAsTime","clientX","current","trackRect","getBoundingClientRect","leftEdge","Math","max","left","preciseTime","min","width","roundedTime","round","limitMax","handleMouseMove","handleMouseUp","window","removeEventListener","document","documentElement","classList","remove","startDragListening","addEventListener","add","stopDragListening","handleMouseDown"],"mappings":"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","sourcesContent":["/* eslint-disable react/no-array-index-key */\n// array maps being used are static, this is fine.\n\nimport React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  useEffect,\n} from 'react';\nimport classNames from 'classnames';\nimport TimeInput from './TimeInput';\nimport StyleExports from './TimeSlider.module.scss';\nimport './TimeSlider.scss';\n\nconst HANDLE_SIZE = parseInt(StyleExports['handle-size'], 10);\nconst POPOVER_WIDTH = parseInt(StyleExports['popover-width'], 10);\nconst SECONDS_IN_DAY = 24 * 60 * 60 - 1; // Max is actually 23:59:59\nconst SNAP_NEAREST_MINUTES = 5 * 60; // rounds in 5 minute intervals\n\ntype TimeSliderProps = {\n  startTime: number;\n  endTime: number;\n  onChange(value: { startTime: number; endTime: number }): void;\n  isStartModified?: boolean;\n  isEndModified?: boolean;\n};\n\n/**\n * Creates a time slider for setting a start and end time, that can also run overnight\n * @param {startTime, endTime, onChange} props takes times in seconds 0 - 86399 and a callback\n */\nconst TimeSlider = ({\n  startTime: propStartTime,\n  endTime: propEndTime,\n  onChange,\n  isStartModified = false,\n  isEndModified = false,\n}: TimeSliderProps): JSX.Element => {\n  const [startTime, setStartTime] = useState(propStartTime);\n  const [endTime, setEndTime] = useState(propEndTime);\n\n  const track = useRef<HTMLDivElement>(null); // we need the track width while calulculating time from handle drag\n\n  // updates state if props change\n  useEffect(() => {\n    setStartTime(propStartTime);\n    setEndTime(propEndTime);\n  }, [propStartTime, propEndTime]);\n\n  const updateTime = useCallback(\n    (newStartTime: number, newEndTime: number) => {\n      let start = newStartTime;\n      let end = newEndTime;\n      if (start === end) {\n        if (end < SECONDS_IN_DAY) {\n          end += 1;\n        } else {\n          start -= 1;\n        }\n      }\n\n      setStartTime(start);\n      setEndTime(end);\n      onChange({ startTime: start, endTime: end });\n    },\n    [setStartTime, setEndTime, onChange]\n  );\n\n  const handleStartTimeChange = useCallback(\n    (newStartTime: number) => {\n      updateTime(newStartTime, endTime);\n    },\n    [updateTime, endTime]\n  );\n\n  const handleEndTimeChange = useCallback(\n    (newEndTime: number) => {\n      updateTime(startTime, newEndTime);\n    },\n    [updateTime, startTime]\n  );\n\n  return (\n    <div className=\"time-slider\">\n      <PopOvers\n        startTime={startTime}\n        endTime={endTime}\n        onStartTimeChange={handleStartTimeChange}\n        onEndTimeChange={handleEndTimeChange}\n        isStartModified={isStartModified}\n        isEndModified={isEndModified}\n      />\n      <div className=\"track\" ref={track}>\n        <TrackFills startTime={startTime} endTime={endTime} />\n        <div className=\"ticks\">\n          {Array(24)\n            .fill(null)\n            .map((value, index) => (\n              <div className=\"tick\" key={index} />\n            ))}\n        </div>\n        <Handle\n          track={track}\n          time={startTime}\n          setTime={handleStartTimeChange}\n        />\n        <Handle track={track} time={endTime} setTime={handleEndTimeChange} />\n      </div>\n\n      <div className=\"tick-labels\">\n        <div className=\"tick-label\">0:00</div>\n        <div className=\"tick-label-wrapper\">\n          {Array(24)\n            .fill(null)\n            .map((value, index) => (\n              <div className=\"tick-label\" key={index}>{`${index + 1}:00`}</div>\n            ))}\n        </div>\n      </div>\n    </div>\n  );\n};\n\ntype PopOversProps = {\n  startTime: number;\n  endTime: number;\n  onStartTimeChange(time: number): void;\n  onEndTimeChange(time: number): void;\n  isStartModified: boolean;\n  isEndModified: boolean;\n};\n\nconst PopOvers = (props: PopOversProps): JSX.Element => {\n  const {\n    startTime,\n    endTime,\n    onStartTimeChange,\n    onEndTimeChange,\n    isStartModified,\n    isEndModified,\n  } = props;\n\n  const [firstTime, setFirstTime] = useState(\n    startTime > endTime ? endTime : startTime\n  );\n  const [secondTime, setSecondTime] = useState(\n    startTime > endTime ? startTime : endTime\n  );\n\n  useEffect(() => {\n    setFirstTime(startTime > endTime ? endTime : startTime);\n    setSecondTime(startTime > endTime ? startTime : endTime);\n  }, [startTime, endTime]);\n\n  function onFirstTimeChange(value: number) {\n    if (startTime <= endTime) {\n      onStartTimeChange(value);\n    } else {\n      onEndTimeChange(value);\n    }\n  }\n\n  function onSecondTimeChange(value: number) {\n    if (startTime <= endTime) {\n      onEndTimeChange(value);\n    } else {\n      onStartTimeChange(value);\n    }\n  }\n\n  return (\n    <div className=\"time-slider-popovers\">\n      <div\n        className=\"flex\"\n        style={{\n          flexBasis: `calc(${(firstTime / SECONDS_IN_DAY) * 100}% - ${\n            POPOVER_WIDTH / 2\n          }px)`,\n        }}\n      />\n      <div className=\"handle-popper\">\n        <label\n          className={classNames({\n            modified: startTime < endTime ? isStartModified : isEndModified,\n          })}\n        >\n          {startTime <= endTime ? 'Start Time' : 'End Time'}\n        </label>\n        <TimeInput\n          allowValueWrapping={false}\n          value={firstTime}\n          onChange={onFirstTimeChange}\n        />\n      </div>\n      <div className=\"flex-spacer\" />\n      <div className=\"handle-popper\">\n        <label\n          className={classNames({\n            modified: startTime > endTime ? isStartModified : isEndModified,\n          })}\n        >\n          {startTime > endTime ? 'Start Time' : 'End Time'}\n        </label>\n        <TimeInput\n          allowValueWrapping={false}\n          value={secondTime}\n          onChange={onSecondTimeChange}\n        />\n      </div>\n      <div\n        className=\"flex\"\n        style={{\n          flexBasis: `calc(${\n            ((SECONDS_IN_DAY - secondTime) / SECONDS_IN_DAY) * 100\n          }% - ${POPOVER_WIDTH / 2}px)`,\n        }}\n      />\n    </div>\n  );\n};\n\ntype TrackFillsProps = {\n  startTime: number;\n  endTime: number;\n};\n\n/**\n * Shades the area between or outside of handles according to if start or endtime is greater.\n */\nconst TrackFills = (props: TrackFillsProps): JSX.Element => {\n  const { startTime, endTime } = props;\n  return (\n    <div className=\"track-fills\">\n      {startTime > endTime && (\n        <>\n          <div\n            className=\"track-fill track-fill-start\"\n            style={{ transform: `scaleX(${endTime / SECONDS_IN_DAY})` }}\n          />\n          <div\n            className=\"track-fill track-fill-end\"\n            style={{\n              transform: `scaleX(${\n                (SECONDS_IN_DAY - startTime) / SECONDS_IN_DAY\n              })`,\n            }}\n          />\n        </>\n      )}\n      {startTime < endTime && (\n        <div\n          className=\"track-fill track-fill-middle\"\n          style={{\n            transform: `translateX(${\n              (startTime / SECONDS_IN_DAY) * 100\n            }%) scaleX(${(endTime - startTime) / SECONDS_IN_DAY})`,\n          }}\n        />\n      )}\n    </div>\n  );\n};\n\ntype HandleProps = {\n  track: React.RefObject<HTMLDivElement>;\n  time: number;\n  setTime(time: number): void;\n};\n\n/**\n * Creates a draggable handle the sets the time\n */\nconst Handle = (props: HandleProps): JSX.Element => {\n  const { track, time, setTime } = props;\n\n  /**\n   * Takes the time and generate our translation string taking into account handle offset.\n   * The handle offset changes for the first and last tick range dynmaically. Normally,\n   * the center of the handle (size/2) is the selection origin, but at edges, it becomes either\n   * end of the handle, requireing a relative offset range of 0 - 0.5,  and 0.5 - 1 of handle size.\n   * @param {number} t time in seconds\n   */\n  const transform = useMemo(() => {\n    const ONE_HOUR = 60 * 60;\n    let handleOffset = HANDLE_SIZE / 2;\n    if (time < ONE_HOUR) {\n      handleOffset = (time / ONE_HOUR) * (HANDLE_SIZE / 2); // 0 - 0.5 Handle size\n    } else if (time > 23 * ONE_HOUR) {\n      handleOffset =\n        HANDLE_SIZE / 2 +\n        (1 / (SECONDS_IN_DAY - 23 * ONE_HOUR)) *\n          (time - 23 * ONE_HOUR) *\n          (HANDLE_SIZE / 2); // 0.5 - 1 Handle size\n    }\n    return `translateX(calc(${\n      (time / SECONDS_IN_DAY) * 100\n    }% - ${handleOffset}px))`;\n  }, [time]);\n\n  const calculatePositionAsTime = useCallback(\n    (clientX: number) => {\n      if (!track.current) {\n        return 0;\n      }\n      const trackRect = track.current.getBoundingClientRect();\n      const leftEdge = Math.max(clientX - trackRect.left, 0);\n      // get position as 0-1 on slider and mulitply by seconds in a day to convert to time\n      const preciseTime =\n        SECONDS_IN_DAY * Math.min(1, leftEdge / trackRect.width);\n      // snap to nearest N(5) minute interval\n      const roundedTime =\n        SNAP_NEAREST_MINUTES * Math.round(preciseTime / SNAP_NEAREST_MINUTES);\n      // prevent over-rounding to 24:00:00\n      const limitMax = Math.min(SECONDS_IN_DAY, roundedTime);\n      return limitMax;\n    },\n    [track]\n  );\n\n  const handleMouseMove = useCallback(\n    ({ clientX }: MouseEvent) => {\n      setTime(calculatePositionAsTime(clientX));\n    },\n    [setTime, calculatePositionAsTime]\n  );\n\n  const handleMouseUp = useCallback(\n    ({ clientX }: MouseEvent) => {\n      setTime(calculatePositionAsTime(clientX));\n\n      window.removeEventListener('mousemove', handleMouseMove);\n      window.removeEventListener('mouseup', handleMouseUp);\n      document.documentElement.classList.remove('drag-pointer-events-none');\n    },\n    [setTime, calculatePositionAsTime, handleMouseMove]\n  );\n\n  const startDragListening = useCallback(() => {\n    window.addEventListener('mousemove', handleMouseMove);\n    window.addEventListener('mouseup', handleMouseUp);\n    document.documentElement.classList.add('drag-pointer-events-none');\n  }, [handleMouseMove, handleMouseUp]);\n\n  const stopDragListening = useCallback(() => {\n    window.removeEventListener('mousemove', handleMouseMove);\n    window.removeEventListener('mouseup', handleMouseUp);\n    document.documentElement.classList.remove('drag-pointer-events-none');\n  }, [handleMouseMove, handleMouseUp]);\n\n  const handleMouseDown = useCallback(() => {\n    startDragListening();\n  }, [startDragListening]);\n\n  useEffect(\n    () => () => {\n      stopDragListening();\n    },\n    [stopDragListening]\n  );\n\n  return (\n    <div className=\"handle-track\" style={{ transform }}>\n      <button\n        className=\"handle\"\n        type=\"button\"\n        aria-label=\"Change time\"\n        onMouseDown={handleMouseDown}\n      />\n    </div>\n  );\n};\n\nexport default TimeSlider;\n"],"file":"TimeSlider.js"}

package/dist/ToastNotification.js

@@ -2,22 +2,23 @@ import React from 'react';
 import classNames from 'classnames';
 import { CSSTransition } from 'react-transition-group';
 import { vsClose } from '@deephaven/icons';
-import Button from './Button';
-import ThemeExport from './ThemeExport';
+import Button from "./Button.js";
+import ThemeExport from "./ThemeExport.js";
 import "./ToastNotification.css";
 
-var ToastNotification = function ToastNotification(_ref) {
-  var buttons = _ref.buttons,
-      _ref$isShown = _ref.isShown,
-      isShown = _ref$isShown === void 0 ? false : _ref$isShown,
-      classNamesProp = _ref.classNames,
-      message = _ref.message,
-      type = _ref.type,
-      onClick = _ref.onClick,
-      onDismiss = _ref.onDismiss;
+var ToastNotification = (_ref) => {
+  var {
+    buttons,
+    isShown = false,
+    classNames: classNamesProp,
+    message,
+    type,
+    onClick,
+    onDismiss
+  } = _ref;
   var hasButtons = buttons && buttons.length !== 0;
   return /*#__PURE__*/React.createElement(CSSTransition, {
-    "in": isShown,
+    in: isShown,
     timeout: ThemeExport.transitionMs,
     classNames: "toast-notification-slide-up",
     mountOnEnter: true,
@@ -32,7 +33,7 @@ var ToastNotification = function ToastNotification(_ref) {
   }, /*#__PURE__*/React.createElement("span", {
     className: "message"
   }, message)), /*#__PURE__*/React.createElement(CSSTransition, {
-    "in": hasButtons,
+    in: hasButtons,
     timeout: ThemeExport.transitionSlowMs,
     classNames: "fade",
     mountOnEnter: true,

package/dist/ToastNotification.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/ToastNotification.tsx"],"names":["React","classNames","CSSTransition","vsClose","Button","ThemeExport","ToastNotification","buttons","isShown","classNamesProp","message","type","onClick","onDismiss","hasButtons","length","transitionMs","transitionSlowMs","TYPE","Object","freeze","ERROR"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,aAAT,QAA8B,wBAA9B;AACA,SAASC,OAAT,QAAwB,kBAAxB;AACA,OAAOC,MAAP,MAAmB,UAAnB;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA;;AAeA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAQiB;AAAA,MAPzCC,OAOyC,QAPzCA,OAOyC;AAAA,0BANzCC,OAMyC;AAAA,MANzCA,OAMyC,6BAN/B,KAM+B;AAAA,MAL7BC,cAK6B,QALzCR,UAKyC;AAAA,MAJzCS,OAIyC,QAJzCA,OAIyC;AAAA,MAHzCC,IAGyC,QAHzCA,IAGyC;AAAA,MAFzCC,OAEyC,QAFzCA,OAEyC;AAAA,MADzCC,SACyC,QADzCA,SACyC;AACzC,MAAMC,UAAU,GAAGP,OAAO,IAAIA,OAAO,CAACQ,MAAR,KAAmB,CAAjD;AAEA,sBACE,oBAAC,aAAD;AACE,UAAIP,OADN;AAEE,IAAA,OAAO,EAAEH,WAAW,CAACW,YAFvB;AAGE,IAAA,UAAU,EAAC,6BAHb;AAIE,IAAA,YAAY,MAJd;AAKE,IAAA,aAAa;AALf,kBAOE;AACE,IAAA,SAAS,EAAEf,UAAU,CAAC,oBAAD,EAAuBQ,cAAvB,EAAuCE,IAAvC,CADvB;AAEE,IAAA,IAAI,EAAC,cAFP;AAGE,IAAA,OAAO,EAAEC,OAHX;AAIE,IAAA,UAAU,EAAEA;AAJd,kBAME;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA2BF,OAA3B,CADF,CANF,eASE,oBAAC,aAAD;AACE,UAAII,UADN;AAEE,IAAA,OAAO,EAAET,WAAW,CAACY,gBAFvB;AAGE,IAAA,UAAU,EAAC,MAHb;AAIE,IAAA,YAAY,MAJd;AAKE,IAAA,aAAa;AALf,kBAOE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCV,OAApC,CAPF,CATF,EAkBGM,SAAS,iBACR,oBAAC,MAAD;AACE,IAAA,IAAI,EAAC,OADP;AAEE,IAAA,IAAI,EAAEV,OAFR;AAGE,IAAA,OAAO,EAAC,oBAHV;AAIE,IAAA,SAAS,EAAC,MAJZ;AAKE,IAAA,OAAO,EAAEU;AALX,IAnBJ,CAPF,CADF;AAsCD,CAjDD;;AAmDAP,iBAAiB,CAACY,IAAlB,GAAyBC,MAAM,CAACC,MAAP,CAAc;AACrCC,EAAAA,KAAK,EAAE;AAD8B,CAAd,CAAzB;AAIA,eAAef,iBAAf","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { CSSTransition } from 'react-transition-group';\nimport { vsClose } from '@deephaven/icons';\nimport Button from './Button';\nimport ThemeExport from './ThemeExport';\nimport './ToastNotification.scss';\n\ntype ToastNotificationProps = {\n  buttons?: typeof Button[];\n  classNames?: string;\n  isShown?: boolean;\n  message?: string;\n  type?: string;\n\n  onClick?: React.EventHandler<\n    React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>\n  >;\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n};\n\nconst ToastNotification = ({\n  buttons,\n  isShown = false,\n  classNames: classNamesProp,\n  message,\n  type,\n  onClick,\n  onDismiss,\n}: ToastNotificationProps): JSX.Element => {\n  const hasButtons = buttons && buttons.length !== 0;\n\n  return (\n    <CSSTransition\n      in={isShown}\n      timeout={ThemeExport.transitionMs}\n      classNames=\"toast-notification-slide-up\"\n      mountOnEnter\n      unmountOnExit\n    >\n      <div\n        className={classNames('toast-notification', classNamesProp, type)}\n        role=\"presentation\"\n        onClick={onClick}\n        onKeyPress={onClick}\n      >\n        <div className=\"message-container\">\n          <span className=\"message\">{message}</span>\n        </div>\n        <CSSTransition\n          in={hasButtons}\n          timeout={ThemeExport.transitionSlowMs}\n          classNames=\"fade\"\n          mountOnEnter\n          unmountOnExit\n        >\n          <div className=\"buttons-container\">{buttons}</div>\n        </CSSTransition>\n        {onDismiss && (\n          <Button\n            kind=\"ghost\"\n            icon={vsClose}\n            tooltip=\"Close notification\"\n            className=\"my-2\"\n            onClick={onDismiss}\n          />\n        )}\n      </div>\n    </CSSTransition>\n  );\n};\n\nToastNotification.TYPE = Object.freeze({\n  ERROR: 'error',\n});\n\nexport default ToastNotification;\n"],"file":"ToastNotification.js"}
+{"version":3,"sources":["../src/ToastNotification.tsx"],"names":["React","classNames","CSSTransition","vsClose","Button","ThemeExport","ToastNotification","buttons","isShown","classNamesProp","message","type","onClick","onDismiss","hasButtons","length","transitionMs","transitionSlowMs","TYPE","Object","freeze","ERROR"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,aAAT,QAA8B,wBAA9B;AACA,SAASC,OAAT,QAAwB,kBAAxB;OACOC,M;OACAC,W;;;AAgBP,IAAMC,iBAAiB,GAAG,UAQiB;AAAA,MARhB;AACzBC,IAAAA,OADyB;AAEzBC,IAAAA,OAAO,GAAG,KAFe;AAGzBP,IAAAA,UAAU,EAAEQ,cAHa;AAIzBC,IAAAA,OAJyB;AAKzBC,IAAAA,IALyB;AAMzBC,IAAAA,OANyB;AAOzBC,IAAAA;AAPyB,GAQgB;AACzC,MAAMC,UAAU,GAAGP,OAAO,IAAIA,OAAO,CAACQ,MAAR,KAAmB,CAAjD;AAEA,sBACE,oBAAC,aAAD;AACE,IAAA,EAAE,EAAEP,OADN;AAEE,IAAA,OAAO,EAAEH,WAAW,CAACW,YAFvB;AAGE,IAAA,UAAU,EAAC,6BAHb;AAIE,IAAA,YAAY,MAJd;AAKE,IAAA,aAAa;AALf,kBAOE;AACE,IAAA,SAAS,EAAEf,UAAU,CAAC,oBAAD,EAAuBQ,cAAvB,EAAuCE,IAAvC,CADvB;AAEE,IAAA,IAAI,EAAC,cAFP;AAGE,IAAA,OAAO,EAAEC,OAHX;AAIE,IAAA,UAAU,EAAEA;AAJd,kBAME;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAM,IAAA,SAAS,EAAC;AAAhB,KAA2BF,OAA3B,CADF,CANF,eASE,oBAAC,aAAD;AACE,IAAA,EAAE,EAAEI,UADN;AAEE,IAAA,OAAO,EAAET,WAAW,CAACY,gBAFvB;AAGE,IAAA,UAAU,EAAC,MAHb;AAIE,IAAA,YAAY,MAJd;AAKE,IAAA,aAAa;AALf,kBAOE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAoCV,OAApC,CAPF,CATF,EAkBGM,SAAS,iBACR,oBAAC,MAAD;AACE,IAAA,IAAI,EAAC,OADP;AAEE,IAAA,IAAI,EAAEV,OAFR;AAGE,IAAA,OAAO,EAAC,oBAHV;AAIE,IAAA,SAAS,EAAC,MAJZ;AAKE,IAAA,OAAO,EAAEU;AALX,IAnBJ,CAPF,CADF;AAsCD,CAjDD;;AAmDAP,iBAAiB,CAACY,IAAlB,GAAyBC,MAAM,CAACC,MAAP,CAAc;AACrCC,EAAAA,KAAK,EAAE;AAD8B,CAAd,CAAzB;AAIA,eAAef,iBAAf","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { CSSTransition } from 'react-transition-group';\nimport { vsClose } from '@deephaven/icons';\nimport Button from './Button';\nimport ThemeExport from './ThemeExport';\nimport './ToastNotification.scss';\n\ntype ToastNotificationProps = {\n  buttons?: typeof Button[];\n  classNames?: string;\n  isShown?: boolean;\n  message?: string;\n  type?: string;\n\n  onClick?: React.EventHandler<\n    React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>\n  >;\n  onDismiss?: React.MouseEventHandler<HTMLButtonElement>;\n};\n\nconst ToastNotification = ({\n  buttons,\n  isShown = false,\n  classNames: classNamesProp,\n  message,\n  type,\n  onClick,\n  onDismiss,\n}: ToastNotificationProps): JSX.Element => {\n  const hasButtons = buttons && buttons.length !== 0;\n\n  return (\n    <CSSTransition\n      in={isShown}\n      timeout={ThemeExport.transitionMs}\n      classNames=\"toast-notification-slide-up\"\n      mountOnEnter\n      unmountOnExit\n    >\n      <div\n        className={classNames('toast-notification', classNamesProp, type)}\n        role=\"presentation\"\n        onClick={onClick}\n        onKeyPress={onClick}\n      >\n        <div className=\"message-container\">\n          <span className=\"message\">{message}</span>\n        </div>\n        <CSSTransition\n          in={hasButtons}\n          timeout={ThemeExport.transitionSlowMs}\n          classNames=\"fade\"\n          mountOnEnter\n          unmountOnExit\n        >\n          <div className=\"buttons-container\">{buttons}</div>\n        </CSSTransition>\n        {onDismiss && (\n          <Button\n            kind=\"ghost\"\n            icon={vsClose}\n            tooltip=\"Close notification\"\n            className=\"my-2\"\n            onClick={onDismiss}\n          />\n        )}\n      </div>\n    </CSSTransition>\n  );\n};\n\nToastNotification.TYPE = Object.freeze({\n  ERROR: 'error',\n});\n\nexport default ToastNotification;\n"],"file":"ToastNotification.js"}

package/dist/UISwitch.js

@@ -2,14 +2,15 @@ import React from 'react';
 import classNames from 'classnames';
 import "./UISwitch.css";
 
-var UISwitch = function UISwitch(_ref) {
-  var on = _ref.on,
-      id = _ref.id,
-      className = _ref.className,
-      isInvalid = _ref.isInvalid,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      onClick = _ref.onClick;
+var UISwitch = (_ref) => {
+  var {
+    on,
+    id,
+    className,
+    isInvalid,
+    disabled = false,
+    onClick
+  } = _ref;
   return /*#__PURE__*/React.createElement("button", {
     type: "button",
     className: classNames('btn', 'btn-switch', className, {

package/dist/UISwitch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/UISwitch.tsx"],"names":["React","classNames","UISwitch","on","id","className","isInvalid","disabled","onClick","active"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA;;AAWA,IAAMC,QAAQ,GAAG,SAAXA,QAAW;AAAA,MACfC,EADe,QACfA,EADe;AAAA,MAEfC,EAFe,QAEfA,EAFe;AAAA,MAGfC,SAHe,QAGfA,SAHe;AAAA,MAIfC,SAJe,QAIfA,SAJe;AAAA,2BAKfC,QALe;AAAA,MAKfA,QALe,8BAKJ,KALI;AAAA,MAMfC,OANe,QAMfA,OANe;AAAA,sBAQf;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,SAAS,EAAEP,UAAU,CACnB,KADmB,EAEnB,YAFmB,EAGnBI,SAHmB,EAInB;AAAEI,MAAAA,MAAM,EAAEN;AAAV,KAJmB,EAKnB;AAAE,oBAAcG;AAAhB,KALmB,CAFvB;AASE,IAAA,EAAE,EAAEF,EATN;AAUE,IAAA,OAAO,EAAEI,OAVX;AAWE,IAAA,QAAQ,EAAED;AAXZ,kBAaE;AAAK,IAAA,SAAS,EAAC;AAAf,IAbF,CARe;AAAA,CAAjB;;AAyBA,eAAeL,QAAf","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport './UISwitch.scss';\n\ntype UISwitchProps = {\n  on: boolean;\n  onClick: React.MouseEventHandler<HTMLButtonElement>;\n  id?: string;\n  className?: string;\n  isInvalid?: boolean;\n  disabled?: boolean;\n};\n\nconst UISwitch = ({\n  on,\n  id,\n  className,\n  isInvalid,\n  disabled = false,\n  onClick,\n}: UISwitchProps): JSX.Element => (\n  <button\n    type=\"button\"\n    className={classNames(\n      'btn',\n      'btn-switch',\n      className,\n      { active: on },\n      { 'is-invalid': isInvalid }\n    )}\n    id={id}\n    onClick={onClick}\n    disabled={disabled}\n  >\n    <div className=\"handle\" />\n  </button>\n);\n\nexport default UISwitch;\n"],"file":"UISwitch.js"}
+{"version":3,"sources":["../src/UISwitch.tsx"],"names":["React","classNames","UISwitch","on","id","className","isInvalid","disabled","onClick","active"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;;;AAYA,IAAMC,QAAQ,GAAG;AAAA,MAAC;AAChBC,IAAAA,EADgB;AAEhBC,IAAAA,EAFgB;AAGhBC,IAAAA,SAHgB;AAIhBC,IAAAA,SAJgB;AAKhBC,IAAAA,QAAQ,GAAG,KALK;AAMhBC,IAAAA;AANgB,GAAD;AAAA,sBAQf;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,SAAS,EAAEP,UAAU,CACnB,KADmB,EAEnB,YAFmB,EAGnBI,SAHmB,EAInB;AAAEI,MAAAA,MAAM,EAAEN;AAAV,KAJmB,EAKnB;AAAE,oBAAcG;AAAhB,KALmB,CAFvB;AASE,IAAA,EAAE,EAAEF,EATN;AAUE,IAAA,OAAO,EAAEI,OAVX;AAWE,IAAA,QAAQ,EAAED;AAXZ,kBAaE;AAAK,IAAA,SAAS,EAAC;AAAf,IAbF,CARe;AAAA,CAAjB;;AAyBA,eAAeL,QAAf","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport './UISwitch.scss';\n\ntype UISwitchProps = {\n  on: boolean;\n  onClick: React.MouseEventHandler<HTMLButtonElement>;\n  id?: string;\n  className?: string;\n  isInvalid?: boolean;\n  disabled?: boolean;\n};\n\nconst UISwitch = ({\n  on,\n  id,\n  className,\n  isInvalid,\n  disabled = false,\n  onClick,\n}: UISwitchProps): JSX.Element => (\n  <button\n    type=\"button\"\n    className={classNames(\n      'btn',\n      'btn-switch',\n      className,\n      { active: on },\n      { 'is-invalid': isInvalid }\n    )}\n    id={id}\n    onClick={onClick}\n    disabled={disabled}\n  >\n    <div className=\"handle\" />\n  </button>\n);\n\nexport default UISwitch;\n"],"file":"UISwitch.js"}