@elliemae/ds-time-picker 3.0.0-next.4 → 3.0.0-next.43

package/dist/cjs/DSTimePicker.js

@@ -35,7 +35,7 @@ var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
 var import_react_desc = require("react-desc");
 var import_moment = __toESM(require("moment"));
-var import_TimePickerImpl = require("./TimePickerImpl");
+var import_TimePickerImpl = __toESM(require("./TimePickerImpl"));
 const DSTimePicker = ({
   containerProps = {},
   innerRef,
@@ -55,7 +55,7 @@ const DSTimePicker = ({
   placement = "bottom",
   disabledTimes,
   minutesInterval = 1
-}) => /* @__PURE__ */ import_react.default.createElement(import_TimePickerImpl.TimePickerImpl, {
+}) => /* @__PURE__ */ import_react.default.createElement(import_TimePickerImpl.default, {
   ref: innerRef,
   "aria-label": ariaLabel,
   className,

package/dist/cjs/DSTimePicker.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DSTimePicker.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport Moment from 'moment';\nimport { TimePickerImpl } from './TimePickerImpl';\n\nconst DSTimePicker = ({\n  containerProps = {},\n  innerRef,\n  className = '',\n  disabled = false,\n  value = '',\n  format,\n  style = {},\n  onChange = () => null,\n  onOpen = () => null,\n  isOpen = undefined,\n  clearable = false,\n  hasHeader = true,\n  hasHeaderDisplay = false,\n  'aria-label': ariaLabel,\n  zIndex = 'auto',\n  placement = 'bottom',\n  disabledTimes,\n  minutesInterval = 1,\n}) => (\n  <TimePickerImpl\n    ref={innerRef}\n    aria-label={ariaLabel}\n    className={className}\n    clearable={clearable}\n    containerProps={containerProps}\n    disabled={disabled}\n    format={format}\n    hasHeader={hasHeader}\n    hasHeaderDisplay={hasHeaderDisplay}\n    isOpen={isOpen}\n    onChange={onChange}\n    onOpen={onOpen}\n    placement={placement}\n    style={style}\n    value={value}\n    zIndex={zIndex}\n    minutesInterval={minutesInterval}\n    disabledTimes={disabledTimes}\n  />\n);\n\nDSTimePicker.defaultProps = {\n  format: 'hh:mm:ss A',\n};\n\nconst props = {\n  /** a11y label */\n  'aria-label': PropTypes.string.description('a11y label'),\n  /** inject props to time picker wrapper */\n  containerProps: PropTypes.object.description(\n    'inject props to time picker wrapper',\n  ),\n  /** Whether the time picker is disabled or not */\n  disabled: PropTypes.bool.description(\n    'Whether the time picker is disabled or not',\n  ),\n  /** Time picker value */\n  value: PropTypes.instanceOf(Moment).description('Time picker value'),\n  /** Time format (hh:mm:ss, H:m:s) */\n  format: PropTypes.string.description('Time format (hh:mm:ss, H:m:s)'),\n  /** toggle header style */\n  hasHeader: PropTypes.bool.description('toggle header style'),\n  /** toggle header display */\n  hasHeaderDisplay: PropTypes.bool.description('toggle header display'),\n  /** Handler when time picker value changes */\n  onChange: PropTypes.func.description(\n    'Handler when time picker value changes',\n  ),\n  /** Handler when the time picker menu opens */\n  onOpen: PropTypes.func.description('Handler when the time picker menu opens'),\n  /** Whether the time picker menu is opened or not */\n  isOpen: PropTypes.bool.description(\n    'Whether the time picker menu is opened or not',\n  ),\n  /** ref for time picker input */\n  innerRef: PropTypes.func.description('ref for time picker input'),\n  /** Enable to clear the time picker value */\n  clearable: PropTypes.bool.description(\n    'Enable to clear the time picker value',\n  ),\n  /** class for time picker */\n  className: PropTypes.string.description('class for time picker'),\n  /** style object */\n  style: PropTypes.object.description('style object'),\n  /** z index for menu */\n  zIndex: PropTypes.number.description('z index for menu'),\n  /** DSPopper placement */\n  placement: PropTypes.string.description('DSPopper placement'),\n  /** disabled time */\n  disabledTimes: PropTypes.object.description('disabled time'),\n  /** steps for the picker */\n  minutesInterval: PropTypes.number.description('steps for the picker'),\n};\n\nDSTimePicker.propTypes = props;\nconst DSTimePickerWithSchema = describe(DSTimePicker);\nDSTimePickerWithSchema.propTypes = props;\n\nexport { DSTimePicker, DSTimePickerWithSchema };\nexport default DSTimePicker;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAoC;AACpC,oBAAmB;AACnB,4BAA+B;AAE/B,MAAM,eAAe,CAAC;AAAA,EACpB,iBAAiB;AAAA,EACjB;AAAA,EACA,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA,QAAQ;AAAA,EACR,WAAW,MAAM;AAAA,EACjB,SAAS,MAAM;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,YAAY;AAAA,EACZ;AAAA,EACA,kBAAkB;AAAA,MAElB,mDAAC,sCAAD;AAAA,EACE,KAAK;AAAA,EACL,cAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAIJ,aAAa,eAAe;AAAA,EAC1B,QAAQ;AAAA;AAGV,MAAM,QAAQ;AAAA,EAEZ,cAAc,4BAAU,OAAO,YAAY;AAAA,EAE3C,gBAAgB,4BAAU,OAAO,YAC/B;AAAA,EAGF,UAAU,4BAAU,KAAK,YACvB;AAAA,EAGF,OAAO,4BAAU,WAAW,uBAAQ,YAAY;AAAA,EAEhD,QAAQ,4BAAU,OAAO,YAAY;AAAA,EAErC,WAAW,4BAAU,KAAK,YAAY;AAAA,EAEtC,kBAAkB,4BAAU,KAAK,YAAY;AAAA,EAE7C,UAAU,4BAAU,KAAK,YACvB;AAAA,EAGF,QAAQ,4BAAU,KAAK,YAAY;AAAA,EAEnC,QAAQ,4BAAU,KAAK,YACrB;AAAA,EAGF,UAAU,4BAAU,KAAK,YAAY;AAAA,EAErC,WAAW,4BAAU,KAAK,YACxB;AAAA,EAGF,WAAW,4BAAU,OAAO,YAAY;AAAA,EAExC,OAAO,4BAAU,OAAO,YAAY;AAAA,EAEpC,QAAQ,4BAAU,OAAO,YAAY;AAAA,EAErC,WAAW,4BAAU,OAAO,YAAY;AAAA,EAExC,eAAe,4BAAU,OAAO,YAAY;AAAA,EAE5C,iBAAiB,4BAAU,OAAO,YAAY;AAAA;AAGhD,aAAa,YAAY;AACzB,MAAM,yBAAyB,gCAAS;AACxC,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport Moment from 'moment';\nimport TimePickerImpl from './TimePickerImpl';\n\nconst DSTimePicker = ({\n  containerProps = {},\n  innerRef,\n  className = '',\n  disabled = false,\n  value = '',\n  format,\n  style = {},\n  onChange = () => null,\n  onOpen = () => null,\n  isOpen = undefined,\n  clearable = false,\n  hasHeader = true,\n  hasHeaderDisplay = false,\n  'aria-label': ariaLabel,\n  zIndex = 'auto',\n  placement = 'bottom',\n  disabledTimes,\n  minutesInterval = 1,\n}) => (\n  <TimePickerImpl\n    ref={innerRef}\n    aria-label={ariaLabel}\n    className={className}\n    clearable={clearable}\n    containerProps={containerProps}\n    disabled={disabled}\n    format={format}\n    hasHeader={hasHeader}\n    hasHeaderDisplay={hasHeaderDisplay}\n    isOpen={isOpen}\n    onChange={onChange}\n    onOpen={onOpen}\n    placement={placement}\n    style={style}\n    value={value}\n    zIndex={zIndex}\n    minutesInterval={minutesInterval}\n    disabledTimes={disabledTimes}\n  />\n);\n\nDSTimePicker.defaultProps = {\n  format: 'hh:mm:ss A',\n};\n\nconst props = {\n  /** a11y label */\n  'aria-label': PropTypes.string.description('a11y label'),\n  /** inject props to time picker wrapper */\n  containerProps: PropTypes.object.description(\n    'inject props to time picker wrapper',\n  ),\n  /** Whether the time picker is disabled or not */\n  disabled: PropTypes.bool.description(\n    'Whether the time picker is disabled or not',\n  ),\n  /** Time picker value */\n  value: PropTypes.instanceOf(Moment).description('Time picker value'),\n  /** Time format (hh:mm:ss, H:m:s) */\n  format: PropTypes.string.description('Time format (hh:mm:ss, H:m:s)'),\n  /** toggle header style */\n  hasHeader: PropTypes.bool.description('toggle header style'),\n  /** toggle header display */\n  hasHeaderDisplay: PropTypes.bool.description('toggle header display'),\n  /** Handler when time picker value changes */\n  onChange: PropTypes.func.description(\n    'Handler when time picker value changes',\n  ),\n  /** Handler when the time picker menu opens */\n  onOpen: PropTypes.func.description('Handler when the time picker menu opens'),\n  /** Whether the time picker menu is opened or not */\n  isOpen: PropTypes.bool.description(\n    'Whether the time picker menu is opened or not',\n  ),\n  /** ref for time picker input */\n  innerRef: PropTypes.func.description('ref for time picker input'),\n  /** Enable to clear the time picker value */\n  clearable: PropTypes.bool.description(\n    'Enable to clear the time picker value',\n  ),\n  /** class for time picker */\n  className: PropTypes.string.description('class for time picker'),\n  /** style object */\n  style: PropTypes.object.description('style object'),\n  /** z index for menu */\n  zIndex: PropTypes.number.description('z index for menu'),\n  /** DSPopper placement */\n  placement: PropTypes.string.description('DSPopper placement'),\n  /** disabled time */\n  disabledTimes: PropTypes.object.description('disabled time'),\n  /** steps for the picker */\n  minutesInterval: PropTypes.number.description('steps for the picker'),\n};\n\nDSTimePicker.propTypes = props;\nconst DSTimePickerWithSchema = describe(DSTimePicker);\nDSTimePickerWithSchema.propTypes = props;\n\nexport { DSTimePicker, DSTimePickerWithSchema };\nexport default DSTimePicker;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAoC;AACpC,oBAAmB;AACnB,4BAA2B;AAE3B,MAAM,eAAe,CAAC;AAAA,EACpB,iBAAiB,CAAC;AAAA,EAClB;AAAA,EACA,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,WAAW,MAAM;AAAA,EACjB,SAAS,MAAM;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,YAAY;AAAA,EACZ;AAAA,EACA,kBAAkB;AAAA,MAElB,mDAAC;AAAA,EACC,KAAK;AAAA,EACL,cAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,CACF;AAGF,aAAa,eAAe;AAAA,EAC1B,QAAQ;AACV;AAEA,MAAM,QAAQ;AAAA,EAEZ,cAAc,4BAAU,OAAO,YAAY,YAAY;AAAA,EAEvD,gBAAgB,4BAAU,OAAO,YAC/B,qCACF;AAAA,EAEA,UAAU,4BAAU,KAAK,YACvB,4CACF;AAAA,EAEA,OAAO,4BAAU,WAAW,qBAAM,EAAE,YAAY,mBAAmB;AAAA,EAEnE,QAAQ,4BAAU,OAAO,YAAY,+BAA+B;AAAA,EAEpE,WAAW,4BAAU,KAAK,YAAY,qBAAqB;AAAA,EAE3D,kBAAkB,4BAAU,KAAK,YAAY,uBAAuB;AAAA,EAEpE,UAAU,4BAAU,KAAK,YACvB,wCACF;AAAA,EAEA,QAAQ,4BAAU,KAAK,YAAY,yCAAyC;AAAA,EAE5E,QAAQ,4BAAU,KAAK,YACrB,+CACF;AAAA,EAEA,UAAU,4BAAU,KAAK,YAAY,2BAA2B;AAAA,EAEhE,WAAW,4BAAU,KAAK,YACxB,uCACF;AAAA,EAEA,WAAW,4BAAU,OAAO,YAAY,uBAAuB;AAAA,EAE/D,OAAO,4BAAU,OAAO,YAAY,cAAc;AAAA,EAElD,QAAQ,4BAAU,OAAO,YAAY,kBAAkB;AAAA,EAEvD,WAAW,4BAAU,OAAO,YAAY,oBAAoB;AAAA,EAE5D,eAAe,4BAAU,OAAO,YAAY,eAAe;AAAA,EAE3D,iBAAiB,4BAAU,OAAO,YAAY,sBAAsB;AACtE;AAEA,aAAa,YAAY;AACzB,MAAM,yBAAyB,gCAAS,YAAY;AACpD,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
   "names": []
 }

package/dist/cjs/DSTimePickerMenu.js

@@ -47,13 +47,13 @@ __export(DSTimePickerMenu_exports, {
 var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
 var import_styled_components = __toESM(require("styled-components"));
-var import_TimePickerMenu = require("./TimePickerMenu");
+var import_TimePickerMenu = __toESM(require("./TimePickerMenu"));
 const DSTimePickerMenuWrapper = import_styled_components.default.div`
   display: flex;
   height: 18.6rem;
 `;
 function DSTimePickerMenu(props) {
-  return /* @__PURE__ */ import_react.default.createElement(DSTimePickerMenuWrapper, null, /* @__PURE__ */ import_react.default.createElement(import_TimePickerMenu.TimePickerMenu, __spreadValues({}, props)));
+  return /* @__PURE__ */ import_react.default.createElement(DSTimePickerMenuWrapper, null, /* @__PURE__ */ import_react.default.createElement(import_TimePickerMenu.default, __spreadValues({}, props)));
 }
 var DSTimePickerMenu_default = DSTimePickerMenu;
 module.exports = __toCommonJS(DSTimePickerMenu_exports);

package/dist/cjs/DSTimePickerMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DSTimePickerMenu.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport styled from 'styled-components';\nimport { TimePickerMenu } from './TimePickerMenu';\n\nconst DSTimePickerMenuWrapper = styled.div`\n  display: flex;\n  height: 18.6rem;\n`;\nfunction DSTimePickerMenu(props) {\n  return (\n    <DSTimePickerMenuWrapper>\n      <TimePickerMenu {...props} />\n    </DSTimePickerMenuWrapper>\n  );\n}\nexport { DSTimePickerMenu };\nexport default DSTimePickerMenu;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,+BAAmB;AACnB,4BAA+B;AAE/B,MAAM,0BAA0B,iCAAO;AAAA;AAAA;AAAA;AAIvC,0BAA0B,OAAO;AAC/B,SACE,mDAAC,yBAAD,MACE,mDAAC,sCAAD,mBAAoB;AAAA;AAK1B,IAAO,2BAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport styled from 'styled-components';\nimport TimePickerMenu from './TimePickerMenu';\n\nconst DSTimePickerMenuWrapper = styled.div`\n  display: flex;\n  height: 18.6rem;\n`;\nfunction DSTimePickerMenu(props) {\n  return (\n    <DSTimePickerMenuWrapper>\n      <TimePickerMenu {...props} />\n    </DSTimePickerMenuWrapper>\n  );\n}\nexport { DSTimePickerMenu };\nexport default DSTimePickerMenu;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,+BAAmB;AACnB,4BAA2B;AAE3B,MAAM,0BAA0B,iCAAO;AAAA;AAAA;AAAA;AAIvC,0BAA0B,OAAO;AAC/B,SACE,mDAAC,+BACC,mDAAC,kDAAmB,MAAO,CAC7B;AAEJ;AAEA,IAAO,2BAAQ;",
   "names": []
 }

package/dist/cjs/PickerPanel.js

@@ -91,10 +91,6 @@ class PickerPanel extends import_react.Component {
         this.scrollHandler.updatePosition(listYPosition);
       return listYPosition;
     });
-    this.renderHeader = () => {
-      const { header } = this.props;
-      return /* @__PURE__ */ import_react.default.createElement(PickerHeader, null, header);
-    };
     this.pickerListContainerRef = import_react.default.createRef();
     this.pickerListRef = import_react.default.createRef();
     this.pickerItemRef = import_react.default.createRef();
@@ -104,6 +100,15 @@ class PickerPanel extends import_react.Component {
       activeIndex: 0,
       prevProps: {}
     };
+    this.getOptionValue = this.getOptionValue.bind(this);
+    this.getOptionLabel = this.getOptionLabel.bind(this);
+    this.computeSizes = this.computeSizes.bind(this);
+    this.handleOptionSelect = this.handleOptionSelect.bind(this);
+    this.handleKeyDown = this.handleKeyDown.bind(this);
+    this.moveTo = this.moveTo.bind(this);
+    this.handleStepMoveUp = this.handleStepMoveUp.bind(this);
+    this.handleStepMoveDown = this.handleStepMoveDown.bind(this);
+    this.renderHeader = this.renderHeader.bind(this);
   }
   componentDidMount() {
     this.computeSizes();
@@ -225,6 +230,10 @@ class PickerPanel extends import_react.Component {
     const nextPos = supposedPos <= options.length ? supposedPos : activeIndex + 1;
     this.moveTo(nextPos);
   }
+  renderHeader() {
+    const { header } = this.props;
+    return /* @__PURE__ */ import_react.default.createElement(PickerHeader, null, header);
+  }
   render() {
     const { options, hasHeader, type, time, meridiem, disabledTimes } = this.props;
     const { selectedOption, activeIndex, scrolling } = this.state;

package/dist/cjs/PickerPanel.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/PickerPanel.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable eqeqeq */\n/* eslint-disable react/prop-types */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport { findIndex } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport memoizeOne from 'memoize-one';\nimport { ChevronSmallUp, ChevronSmallDown } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoveElementOnScroll } from './moveElementOnScroll';\nimport { validateIndex } from './utils';\n\nconst blockName = 'time-picker-panel';\n\nconst Container = aggregatedClasses('div')(blockName, null, ({ scrolling }) => ({ scrolling }));\nconst Wrapper = aggregatedClasses('div')(blockName, 'wrapper');\nconst PickerItemListContainer = aggregatedClasses('div')(blockName, 'item-list-container');\nconst PickerItemList = aggregatedClasses('div')(blockName, 'item-list');\nconst PickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst PickerItemContainer = aggregatedClasses('div')(blockName, 'item', ({ selected, disabled }) => ({\n  selected,\n  disabled,\n}));\nconst PickerSelectedOptionSelected = aggregatedClasses('div')(blockName, 'selected-container');\nconst SelectedCircle = aggregatedClasses('div')(blockName, 'selected-circle');\nconst ArrowButtonContainer = aggregatedClasses('div')(blockName, 'arrow-container');\n\nconst getOptionIndex = (options, selectedOption, valueProperty = 'value') => {\n  const index = options.findIndex((option) => option[valueProperty] === selectedOption);\n  return validateIndex(index, options);\n};\n\nconst arrowProps = {\n  buttonType: 'text',\n  fluidHeight: true,\n  fluidWidth: true,\n  size: 's',\n};\n\nexport default class PickerPanel extends Component {\n  computeContainerTranslation = memoizeOne((index) => {\n    const { options, valueProperty } = this.props;\n    const { selectedOption, scrolling } = this.state;\n\n    const selectedOptionIndex = index || getOptionIndex(options, selectedOption, valueProperty);\n    const listYPosition = this.minYListPosition - selectedOptionIndex * this.optionHeight;\n\n    if (this.scrollHandler && !scrolling) this.scrollHandler.updatePosition(listYPosition);\n\n    return listYPosition;\n  });\n\n  constructor(props) {\n    super(props);\n    this.pickerListContainerRef = React.createRef();\n    this.pickerListRef = React.createRef();\n    this.pickerItemRef = React.createRef();\n    this.selectedOptionRef = React.createRef();\n\n    this.state = {\n      selectedOption: props.selected,\n      activeIndex: 0,\n      // eslint-disable-next-line react/no-unused-state\n      prevProps: {},\n    };\n  }\n\n  componentDidMount() {\n    this.computeSizes();\n    const pickerListContainerEl = this.pickerListContainerRef.current;\n    const pickerListEl = this.pickerListRef.current;\n\n    this.scrollHandler = new MoveElementOnScroll(pickerListEl, {\n      container: pickerListContainerEl,\n      min: -this.minYListPosition,\n      max: this.maxYListPosition,\n      onUpdate: (pos, delta) => {\n        const { options } = this.props;\n        const index =\n          options.length - -Math.floor((pos - this.maxYListPosition) / this.optionHeight) + (delta > 0 ? 1 : -1);\n        this.moveTo(index, true);\n      },\n      onEndScroll: () => {\n        this.setState({ scrolling: false });\n      },\n    });\n    this.computeContainerTranslation();\n  }\n\n  componentWillUnmount() {\n    this.scrollHandler.unsubscribe();\n  }\n\n  static getDerivedStateFromProps(nextProps, { prevProps }) {\n    const { selected, valueProperty, options } = nextProps;\n    if (selected !== prevProps.selected) {\n      return {\n        selectedOption: selected,\n        activeIndex: getOptionIndex(options, selected, valueProperty),\n        prevProps: nextProps,\n      };\n    }\n    return null;\n  }\n\n  getOptionValue(option) {\n    const { valueProperty } = this.props;\n    return option[valueProperty];\n  }\n\n  getOptionLabel(option) {\n    const { labelProperty } = this.props;\n    return option[labelProperty];\n  }\n\n  computeSizes() {\n    const { options, numberItemsOnScreen } = this.props;\n    const { offsetHeight: optionHeight } = this.pickerItemRef.current;\n\n    this.optionHeight = optionHeight;\n    this.listHeight = this.optionHeight * numberItemsOnScreen;\n\n    this.minYListPosition = this.listHeight / 2 - this.optionHeight / 2;\n    this.maxYListPosition = this.optionHeight * (options.length - Math.ceil(numberItemsOnScreen / 2));\n  }\n\n  handleOptionSelect(optionValue, index, scrolling) {\n    const { onChange } = this.props;\n    this.setState(\n      (state) => ({\n        ...state,\n        scrolling,\n        selectedOption: optionValue,\n        activeIndex: index,\n      }),\n      () => {\n        onChange(optionValue, index);\n      },\n    );\n  }\n\n  // TODO: this needs a refactor from de FocusGroup\n  // eslint-disable-next-line max-statements\n  handleKeyDown(e) {\n    const { activeIndex } = this.state;\n    const { options } = this.props;\n    const [firstColumn, ...restColumns] = document.getElementsByClassName('em-ds-time-picker-panel');\n    const [lastColumn] = restColumns.slice(-1);\n    const [prev] = document.getElementsByClassName('DayPickerNavigation_button');\n    const focusedElement = document.activeElement;\n\n    switch (e.key) {\n      case 'Home':\n        this.moveTo(0);\n        break;\n      case 'End':\n        this.moveTo(options.length - 1);\n        break;\n      case 'ArrowUp':\n        this.moveTo(activeIndex - 1);\n        break;\n      case 'ArrowDown':\n        this.moveTo(activeIndex + 1);\n        break;\n      case 'Tab': {\n        e.preventDefault();\n        // If it is DateTimePicker, move focus to prev arrow element\n        if (prev && focusedElement === lastColumn) {\n          prev.focus();\n        } else if (focusedElement === lastColumn) {\n          firstColumn.focus();\n        } else {\n          const position = findIndex(restColumns, focusedElement);\n          restColumns[position + 1].focus();\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  }\n\n  moveTo(index, scrolling) {\n    const { options } = this.props;\n    const { selectedOption } = this.state;\n    const validIndex = validateIndex(index, options);\n    const option = options[validIndex];\n    const optionValue = this.getOptionValue(option);\n    if (selectedOption !== optionValue && option.disabled !== true) {\n      this.handleOptionSelect(optionValue, validIndex, scrolling);\n    }\n    // TO-DO: if date disabled, add nextValidOption selection\n  }\n\n  handleStepMoveUp() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex - arrowStep;\n    const nextPos = supposedPos >= 0 ? supposedPos : activeIndex - 1;\n\n    const nextValidOption = options.find((op) => !op.disabled);\n    this.moveTo(nextPos, true, nextValidOption);\n  }\n\n  handleStepMoveDown() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex + arrowStep;\n    const nextPos = supposedPos <= options.length ? supposedPos : activeIndex + 1;\n    this.moveTo(nextPos);\n  }\n\n  renderHeader = () => {\n    const { header } = this.props;\n\n    return <PickerHeader>{header}</PickerHeader>;\n  };\n\n  render() {\n    const { options, hasHeader, type, time, meridiem, disabledTimes } = this.props;\n    const { selectedOption, activeIndex, scrolling } = this.state;\n\n    const listYPosition = this.computeContainerTranslation(activeIndex);\n\n    return (\n      <Wrapper>\n        {hasHeader && this.renderHeader()}\n        <Container classProps={{ scrolling }} onKeyDown={this.handleKeyDown} tabIndex={0}>\n          <PickerSelectedOptionSelected innerRef={this.selectedOptionRef}>\n            <SelectedCircle />\n          </PickerSelectedOptionSelected>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Up\"\n              data-testid={`${type}-chevron-up`}\n              disabled={activeIndex <= 0}\n              icon={<ChevronSmallUp />}\n              onClick={this.handleStepMoveUp}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n          <PickerItemListContainer\n            innerRef={this.pickerListContainerRef}\n            style={{\n              height: this.listHeight,\n            }}\n          >\n            <PickerItemList\n              data-testid={`${type}-list`}\n              innerRef={this.pickerListRef}\n              style={{\n                transform: `translateY(${listYPosition}px)`,\n              }}\n            >\n              {options.map((option, index) => {\n                const value = this.getOptionValue(option);\n                const label = this.getOptionLabel(option);\n                let valueFormatted;\n                if (meridiem === 'AM') valueFormatted = value;\n                else if (meridiem === 'PM' && value === 12) valueFormatted = value;\n                else if (meridiem === 'PM') valueFormatted = value + 12;\n\n                let disabled = false;\n                if (disabledTimes) {\n                  const { from, to } = disabledTimes;\n                  if (\n                    (type === 'hour' && valueFormatted >= from?.hour && valueFormatted < to?.hour) ||\n                    (type === 'minutes' && value >= from?.min && value < to?.min)\n                  ) {\n                    disabled = true;\n                  }\n                  if (type === 'minutes' && (time?.hour() > to?.hour || time?.hour() < from?.hour)) {\n                    disabled = false;\n                  }\n                  if (label === 'am' && from?.hour == 0 && to?.hour >= 12) {\n                    disabled = true;\n                  }\n                  if (label === 'pm' && to?.hour == 24) {\n                    disabled = true;\n                  }\n                }\n\n                option.disabled = disabled;\n\n                return (\n                  <PickerItemContainer\n                    key={value}\n                    classProps={{\n                      selected: selectedOption ? value === selectedOption : index === 0,\n                      disabled,\n                    }}\n                    innerRef={this.pickerItemRef}\n                    onClick={() => {\n                      if (!disabled) this.handleOptionSelect(value, index);\n                    }}\n                  >\n                    {label}\n                  </PickerItemContainer>\n                );\n              })}\n            </PickerItemList>\n          </PickerItemListContainer>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Down\"\n              data-testid={`${type}-chevron-down`}\n              disabled={activeIndex >= options.length - 1}\n              icon={<ChevronSmallDown />}\n              onClick={this.handleStepMoveDown}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n        </Container>\n      </Wrapper>\n    );\n  }\n}\n\nPickerPanel.defaultProps = {\n  valueProperty: 'value',\n  labelProperty: 'label',\n  numberItemsOnScreen: 5, // this number should be impair\n  options: [],\n  arrowStep: 1,\n};\n\nexport { PickerPanel };", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable eqeqeq */\n/* eslint-disable react/prop-types */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport { findIndex } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport memoizeOne from 'memoize-one';\nimport { ChevronSmallUp, ChevronSmallDown } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoveElementOnScroll } from './moveElementOnScroll';\nimport { validateIndex } from './utils';\n\nconst blockName = 'time-picker-panel';\n\nconst Container = aggregatedClasses('div')(blockName, null, ({ scrolling }) => ({ scrolling }));\nconst Wrapper = aggregatedClasses('div')(blockName, 'wrapper');\nconst PickerItemListContainer = aggregatedClasses('div')(blockName, 'item-list-container');\nconst PickerItemList = aggregatedClasses('div')(blockName, 'item-list');\nconst PickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst PickerItemContainer = aggregatedClasses('div')(blockName, 'item', ({ selected, disabled }) => ({\n  selected,\n  disabled,\n}));\nconst PickerSelectedOptionSelected = aggregatedClasses('div')(blockName, 'selected-container');\nconst SelectedCircle = aggregatedClasses('div')(blockName, 'selected-circle');\nconst ArrowButtonContainer = aggregatedClasses('div')(blockName, 'arrow-container');\n\nconst getOptionIndex = (options, selectedOption, valueProperty = 'value') => {\n  const index = options.findIndex((option) => option[valueProperty] === selectedOption);\n  return validateIndex(index, options);\n};\n\nconst arrowProps = {\n  buttonType: 'text',\n  fluidHeight: true,\n  fluidWidth: true,\n  size: 's',\n};\n\nexport default class PickerPanel extends Component {\n  computeContainerTranslation = memoizeOne((index) => {\n    const { options, valueProperty } = this.props;\n    const { selectedOption, scrolling } = this.state;\n\n    const selectedOptionIndex = index || getOptionIndex(options, selectedOption, valueProperty);\n    const listYPosition = this.minYListPosition - selectedOptionIndex * this.optionHeight;\n\n    if (this.scrollHandler && !scrolling) this.scrollHandler.updatePosition(listYPosition);\n\n    return listYPosition;\n  });\n\n  constructor(props) {\n    super(props);\n    this.pickerListContainerRef = React.createRef();\n    this.pickerListRef = React.createRef();\n    this.pickerItemRef = React.createRef();\n    this.selectedOptionRef = React.createRef();\n\n    this.state = {\n      selectedOption: props.selected,\n      activeIndex: 0,\n      // eslint-disable-next-line react/no-unused-state\n      prevProps: {},\n    };\n\n    this.getOptionValue = this.getOptionValue.bind(this);\n    this.getOptionLabel = this.getOptionLabel.bind(this);\n    this.computeSizes = this.computeSizes.bind(this);\n    this.handleOptionSelect = this.handleOptionSelect.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n    this.moveTo = this.moveTo.bind(this);\n    this.handleStepMoveUp = this.handleStepMoveUp.bind(this);\n    this.handleStepMoveDown = this.handleStepMoveDown.bind(this);\n    this.renderHeader = this.renderHeader.bind(this);\n  }\n\n  componentDidMount() {\n    this.computeSizes();\n    const pickerListContainerEl = this.pickerListContainerRef.current;\n    const pickerListEl = this.pickerListRef.current;\n\n    this.scrollHandler = new MoveElementOnScroll(pickerListEl, {\n      container: pickerListContainerEl,\n      min: -this.minYListPosition,\n      max: this.maxYListPosition,\n      onUpdate: (pos, delta) => {\n        const { options } = this.props;\n        const index =\n          options.length - -Math.floor((pos - this.maxYListPosition) / this.optionHeight) + (delta > 0 ? 1 : -1);\n        this.moveTo(index, true);\n      },\n      onEndScroll: () => {\n        this.setState({ scrolling: false });\n      },\n    });\n    this.computeContainerTranslation();\n  }\n\n  componentWillUnmount() {\n    this.scrollHandler.unsubscribe();\n  }\n\n  static getDerivedStateFromProps(nextProps, { prevProps }) {\n    const { selected, valueProperty, options } = nextProps;\n    if (selected !== prevProps.selected) {\n      return {\n        selectedOption: selected,\n        activeIndex: getOptionIndex(options, selected, valueProperty),\n        prevProps: nextProps,\n      };\n    }\n    return null;\n  }\n\n  getOptionValue(option) {\n    const { valueProperty } = this.props;\n    return option[valueProperty];\n  }\n\n  getOptionLabel(option) {\n    const { labelProperty } = this.props;\n    return option[labelProperty];\n  }\n\n  computeSizes() {\n    const { options, numberItemsOnScreen } = this.props;\n    const { offsetHeight: optionHeight } = this.pickerItemRef.current;\n\n    this.optionHeight = optionHeight;\n    this.listHeight = this.optionHeight * numberItemsOnScreen;\n\n    this.minYListPosition = this.listHeight / 2 - this.optionHeight / 2;\n    this.maxYListPosition = this.optionHeight * (options.length - Math.ceil(numberItemsOnScreen / 2));\n  }\n\n  handleOptionSelect(optionValue, index, scrolling) {\n    const { onChange } = this.props;\n    this.setState(\n      (state) => ({\n        ...state,\n        scrolling,\n        selectedOption: optionValue,\n        activeIndex: index,\n      }),\n      () => {\n        onChange(optionValue, index);\n      },\n    );\n  }\n\n  // TODO: this needs a refactor from de FocusGroup\n  // eslint-disable-next-line max-statements\n  handleKeyDown(e) {\n    const { activeIndex } = this.state;\n    const { options } = this.props;\n    const [firstColumn, ...restColumns] = document.getElementsByClassName('em-ds-time-picker-panel');\n    const [lastColumn] = restColumns.slice(-1);\n    const [prev] = document.getElementsByClassName('DayPickerNavigation_button');\n    const focusedElement = document.activeElement;\n\n    switch (e.key) {\n      case 'Home':\n        this.moveTo(0);\n        break;\n      case 'End':\n        this.moveTo(options.length - 1);\n        break;\n      case 'ArrowUp':\n        this.moveTo(activeIndex - 1);\n        break;\n      case 'ArrowDown':\n        this.moveTo(activeIndex + 1);\n        break;\n      case 'Tab': {\n        e.preventDefault();\n        // If it is DateTimePicker, move focus to prev arrow element\n        if (prev && focusedElement === lastColumn) {\n          prev.focus();\n        } else if (focusedElement === lastColumn) {\n          firstColumn.focus();\n        } else {\n          const position = findIndex(restColumns, focusedElement);\n          restColumns[position + 1].focus();\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  }\n\n  moveTo(index, scrolling) {\n    const { options } = this.props;\n    const { selectedOption } = this.state;\n    const validIndex = validateIndex(index, options);\n    const option = options[validIndex];\n    const optionValue = this.getOptionValue(option);\n    if (selectedOption !== optionValue && option.disabled !== true) {\n      this.handleOptionSelect(optionValue, validIndex, scrolling);\n    }\n    // TO-DO: if date disabled, add nextValidOption selection\n  }\n\n  handleStepMoveUp() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex - arrowStep;\n    const nextPos = supposedPos >= 0 ? supposedPos : activeIndex - 1;\n\n    const nextValidOption = options.find((op) => !op.disabled);\n    this.moveTo(nextPos, true, nextValidOption);\n  }\n\n  handleStepMoveDown() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex + arrowStep;\n    const nextPos = supposedPos <= options.length ? supposedPos : activeIndex + 1;\n    this.moveTo(nextPos);\n  }\n\n  renderHeader() {\n    const { header } = this.props;\n\n    return <PickerHeader>{header}</PickerHeader>;\n  }\n\n  render() {\n    const { options, hasHeader, type, time, meridiem, disabledTimes } = this.props;\n    const { selectedOption, activeIndex, scrolling } = this.state;\n\n    const listYPosition = this.computeContainerTranslation(activeIndex);\n\n    return (\n      <Wrapper>\n        {hasHeader && this.renderHeader()}\n        <Container classProps={{ scrolling }} onKeyDown={this.handleKeyDown} tabIndex={0}>\n          <PickerSelectedOptionSelected innerRef={this.selectedOptionRef}>\n            <SelectedCircle />\n          </PickerSelectedOptionSelected>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Up\"\n              data-testid={`${type}-chevron-up`}\n              disabled={activeIndex <= 0}\n              icon={<ChevronSmallUp />}\n              onClick={this.handleStepMoveUp}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n          <PickerItemListContainer\n            innerRef={this.pickerListContainerRef}\n            style={{\n              height: this.listHeight,\n            }}\n          >\n            <PickerItemList\n              data-testid={`${type}-list`}\n              innerRef={this.pickerListRef}\n              style={{\n                transform: `translateY(${listYPosition}px)`,\n              }}\n            >\n              {options.map((option, index) => {\n                const value = this.getOptionValue(option);\n                const label = this.getOptionLabel(option);\n                let valueFormatted;\n                if (meridiem === 'AM') valueFormatted = value;\n                else if (meridiem === 'PM' && value === 12) valueFormatted = value;\n                else if (meridiem === 'PM') valueFormatted = value + 12;\n\n                let disabled = false;\n                if (disabledTimes) {\n                  const { from, to } = disabledTimes;\n                  if (\n                    (type === 'hour' && valueFormatted >= from?.hour && valueFormatted < to?.hour) ||\n                    (type === 'minutes' && value >= from?.min && value < to?.min)\n                  ) {\n                    disabled = true;\n                  }\n                  if (type === 'minutes' && (time?.hour() > to?.hour || time?.hour() < from?.hour)) {\n                    disabled = false;\n                  }\n                  if (label === 'am' && from?.hour == 0 && to?.hour >= 12) {\n                    disabled = true;\n                  }\n                  if (label === 'pm' && to?.hour == 24) {\n                    disabled = true;\n                  }\n                }\n\n                option.disabled = disabled;\n\n                return (\n                  <PickerItemContainer\n                    key={value}\n                    classProps={{\n                      selected: selectedOption ? value === selectedOption : index === 0,\n                      disabled,\n                    }}\n                    innerRef={this.pickerItemRef}\n                    onClick={() => {\n                      if (!disabled) this.handleOptionSelect(value, index);\n                    }}\n                  >\n                    {label}\n                  </PickerItemContainer>\n                );\n              })}\n            </PickerItemList>\n          </PickerItemListContainer>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Down\"\n              data-testid={`${type}-chevron-down`}\n              disabled={activeIndex >= options.length - 1}\n              icon={<ChevronSmallDown />}\n              onClick={this.handleStepMoveDown}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n        </Container>\n      </Wrapper>\n    );\n  }\n}\n\nPickerPanel.defaultProps = {\n  valueProperty: 'value',\n  labelProperty: 'label',\n  numberItemsOnScreen: 5, // this number should be impair\n  options: [],\n  arrowStep: 1,\n};\n\nexport { PickerPanel };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/TimePickerDropdown.js

@@ -27,16 +27,15 @@ var __toCommonJS = /* @__PURE__ */ ((cache) => {
 })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
 var TimePickerDropdown_exports = {};
 __export(TimePickerDropdown_exports, {
-  TimePickerDropdown: () => TimePickerDropdown,
   default: () => TimePickerDropdown_default
 });
 var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_icons = require("@elliemae/ds-icons");
-var import_ds_button = require("@elliemae/ds-button");
-var import_ds_popper = require("@elliemae/ds-popper");
-const TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => /* @__PURE__ */ import_react.default.createElement(import_ds_popper.DSPopper, {
+var import_ds_button = __toESM(require("@elliemae/ds-button"));
+var import_ds_popper = __toESM(require("@elliemae/ds-popper"));
+const TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => /* @__PURE__ */ import_react.default.createElement(import_ds_popper.default, {
   blockName,
   placement,
   contentComponent: menu,
@@ -50,7 +49,7 @@ const TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, z
     }
   },
   showArrow: false,
-  triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
+  triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
     buttonType: "secondary",
     disabled,
     icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.RecentDocuments, null),

package/dist/cjs/TimePickerDropdown.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/TimePickerDropdown.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSPopper } from '@elliemae/ds-popper';\n\nconst TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => (\n  <DSPopper\n    blockName={blockName}\n    placement={placement}\n    contentComponent={menu}\n    isOpen={isOpen}\n    onOpen={onOpen}\n    modifiers={{\n      preventOverflow: {\n        enabled: true,\n        padding: 0,\n        boundariesElement: 'window',\n      },\n    }}\n    showArrow={false}\n    triggerComponent={\n      <DSButton buttonType=\"secondary\" disabled={disabled} icon={<RecentDocuments />} iconSize=\"s\" onClick={onClick} />\n    }\n    zIndex={zIndex}\n  />\n);\n\nTimePickerDropdown.propTypes = {\n  onClick: PropTypes.func,\n  onOpen: PropTypes.func,\n  disabled: PropTypes.bool,\n  isOpen: PropTypes.bool,\n  menu: PropTypes.element,\n  blockName: PropTypes.string,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n};\n\nexport { TimePickerDropdown };\nexport default TimePickerDropdown;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,sBAAgC;AAChC,uBAAyB;AACzB,uBAAyB;AAEzB,MAAM,qBAAqB,CAAC,EAAE,WAAW,OAAO,SAAS,QAAQ,QAAQ,MAAM,QAAQ,WAAW,gBAChG,mDAAC,2BAAD;AAAA,EACE;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,IACT,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,SAAS;AAAA,MACT,mBAAmB;AAAA;AAAA;AAAA,EAGvB,WAAW;AAAA,EACX,kBACE,mDAAC,2BAAD;AAAA,IAAU,YAAW;AAAA,IAAY;AAAA,IAAoB,MAAM,mDAAC,iCAAD;AAAA,IAAqB,UAAS;AAAA,IAAI;AAAA;AAAA,EAE/F;AAAA;AAIJ,mBAAmB,YAAY;AAAA,EAC7B,SAAS,0BAAU;AAAA,EACnB,QAAQ,0BAAU;AAAA,EAClB,UAAU,0BAAU;AAAA,EACpB,QAAQ,0BAAU;AAAA,EAClB,MAAM,0BAAU;AAAA,EAChB,WAAW,0BAAU;AAAA,EACrB,WAAW,0BAAU;AAAA,EACrB,QAAQ,0BAAU;AAAA;AAIpB,IAAO,6BAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport DSPopper from '@elliemae/ds-popper';\n\nconst TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => (\n  <DSPopper\n    blockName={blockName}\n    placement={placement}\n    contentComponent={menu}\n    isOpen={isOpen}\n    onOpen={onOpen}\n    modifiers={{\n      preventOverflow: {\n        enabled: true,\n        padding: 0,\n        boundariesElement: 'window',\n      },\n    }}\n    showArrow={false}\n    triggerComponent={\n      <DSButton buttonType=\"secondary\" disabled={disabled} icon={<RecentDocuments />} iconSize=\"s\" onClick={onClick} />\n    }\n    zIndex={zIndex}\n  />\n);\n\nTimePickerDropdown.propTypes = {\n  onClick: PropTypes.func,\n  onOpen: PropTypes.func,\n  disabled: PropTypes.bool,\n  isOpen: PropTypes.bool,\n  menu: PropTypes.element,\n  blockName: PropTypes.string,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n};\n\nexport default TimePickerDropdown;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,sBAAgC;AAChC,uBAAqB;AACrB,uBAAqB;AAErB,MAAM,qBAAqB,CAAC,EAAE,WAAW,OAAO,SAAS,QAAQ,QAAQ,MAAM,QAAQ,WAAW,gBAChG,mDAAC;AAAA,EACC;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,IACT,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,SAAS;AAAA,MACT,mBAAmB;AAAA,IACrB;AAAA,EACF;AAAA,EACA,WAAW;AAAA,EACX,kBACE,mDAAC;AAAA,IAAS,YAAW;AAAA,IAAY;AAAA,IAAoB,MAAM,mDAAC,qCAAgB;AAAA,IAAI,UAAS;AAAA,IAAI;AAAA,GAAkB;AAAA,EAEjH;AAAA,CACF;AAGF,mBAAmB,YAAY;AAAA,EAC7B,SAAS,0BAAU;AAAA,EACnB,QAAQ,0BAAU;AAAA,EAClB,UAAU,0BAAU;AAAA,EACpB,QAAQ,0BAAU;AAAA,EAClB,MAAM,0BAAU;AAAA,EAChB,WAAW,0BAAU;AAAA,EACrB,WAAW,0BAAU;AAAA,EACrB,QAAQ,0BAAU;AACpB;AAEA,IAAO,6BAAQ;",
   "names": []
 }

package/dist/cjs/TimePickerImpl.js

@@ -53,7 +53,6 @@ var __toCommonJS = /* @__PURE__ */ ((cache) => {
 })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
 var TimePickerImpl_exports = {};
 __export(TimePickerImpl_exports, {
-  TimePickerImpl: () => TimePickerImpl,
   default: () => TimePickerImpl_default
 });
 var React = __toESM(require("react"));
@@ -64,8 +63,8 @@ var import_memoize_one = __toESM(require("memoize-one"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_classnames = require("@elliemae/ds-classnames");
 var import_ds_form = require("@elliemae/ds-form");
-var import_TimePickerMenu = require("./TimePickerMenu");
-var import_TimePickerDropdown = require("./TimePickerDropdown");
+var import_TimePickerMenu = __toESM(require("./TimePickerMenu"));
+var import_TimePickerDropdown = __toESM(require("./TimePickerDropdown"));
 var import_utils = require("./utils");
 const blockName = "time-picker";
 const TimePickerContainer = (0, import_ds_classnames.aggregatedClasses)(import_ds_form.DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({
@@ -150,7 +149,7 @@ const TimePickerImpl = ({
     className: `${className} variant-${!disabled ? "default" : "disabled"}`,
     containerProps,
     disabled,
-    rightAddon: /* @__PURE__ */ import_react.default.createElement(import_TimePickerDropdown.TimePickerDropdown, {
+    rightAddon: /* @__PURE__ */ import_react.default.createElement(import_TimePickerDropdown.default, {
       blockName: timePickerBlockName,
       disabled,
       isOpen: isMenuOpened,
@@ -163,7 +162,7 @@ const TimePickerImpl = ({
       },
       menu: /* @__PURE__ */ import_react.default.createElement("div", {
         ref: timePickerRef
-      }, /* @__PURE__ */ import_react.default.createElement(import_TimePickerMenu.TimePickerMenu, __spreadValues({
+      }, /* @__PURE__ */ import_react.default.createElement(import_TimePickerMenu.default, __spreadValues({
         disabled,
         disabledTimes: disabledTimeRange,
         format,

package/dist/cjs/TimePickerImpl.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/TimePickerImpl.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable no-shadow */\nimport React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport memoizeOne from 'memoize-one';\nimport { getVisibleTimeByFormat } from '@elliemae/ds-utilities';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSInput, DSInputGroup, TimeInputImpl } from '@elliemae/ds-form';\nimport { TimePickerMenu } from './TimePickerMenu';\nimport { TimePickerDropdown } from './TimePickerDropdown';\nimport { convertTimeString } from './utils';\n\nconst blockName = 'time-picker';\n\nconst TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({\n  isMenuOpened,\n}));\n\nconst TimePickerImpl = ({\n  value,\n  onChange,\n  onOpen,\n  format,\n  disabled,\n  hasHeader,\n  hasHeaderDisplay,\n  className,\n  containerProps,\n  placement,\n  zIndex,\n  disabledTimes,\n  minutesInterval,\n}) => {\n  const [time, setTime] = useState();\n  const [isMenuOpened, setIsMenuOpened] = useState(false);\n  const [focusedColumn, setFocusedColumn] = useState(null);\n  const timePickerRef = useRef();\n  useEffect(() => {\n    if (moment(value).isValid()) setTime(moment(value));\n    else if (value === null) setTime(undefined);\n  }, [value]);\n\n  useEffect(() => {\n    window.addEventListener('click', handleClickOutside, false);\n    return () => window.removeEventListener('click', handleClickOutside, false);\n  }, []);\n\n  useEffect(() => {\n    window.addEventListener('keydown', handleKeyDown, false);\n    return () => window.removeEventListener('keydown', handleKeyDown, false);\n  }, []);\n\n  useEffect(() => {\n    if (isMenuOpened) handleChangeFocus();\n  }, [isMenuOpened]);\n\n  const handleClickOutside = () => {\n    if (isMenuOpened) setIsMenuOpened(false);\n  };\n\n  const handleKeyDown = (event) => {\n    const { key } = event;\n    const menuOpenKeys = ['Escape', ' ', 'Enter'];\n    if (menuOpenKeys.includes(key)) setIsMenuOpened(false);\n  };\n\n  const handleChangeFocus = () => {\n    const [firstColumn] = document.getElementsByClassName('em-ds-time-picker-panel');\n    if (firstColumn && !focusedColumn) {\n      setFocusedColumn(firstColumn);\n      firstColumn.focus();\n    }\n  };\n\n  const handlePickerChange = (newTime) => {\n    setTime(moment(newTime));\n    onChange(moment(newTime));\n  };\n\n  const handleInputChange = (newTime) => {\n    setTime(newTime);\n    onChange(newTime);\n  };\n\n  const handleMenuOpen = (isOpen) => {\n    onOpen(isOpen);\n    setIsMenuOpened(isOpen);\n    if (!isOpen) setFocusedColumn(null);\n  };\n\n  const getVisibleTimePanels = memoizeOne((format) => getVisibleTimeByFormat(format));\n  const timePickerBlockName = convertPropToCssClassName(blockName);\n  const visiblePanels = getVisibleTimePanels(format);\n\n  const disabledTimeRange = disabledTimes && {\n    from: convertTimeString(disabledTimes.from),\n    to: convertTimeString(disabledTimes.to),\n  };\n\n  return (\n    <TimePickerContainer\n      className={`${className} variant-${!disabled ? 'default' : 'disabled'}`}\n      containerProps={containerProps}\n      disabled={disabled}\n      rightAddon={\n        <TimePickerDropdown\n          blockName={timePickerBlockName}\n          disabled={disabled}\n          isOpen={isMenuOpened}\n          zIndex={zIndex}\n          placement={placement}\n          onOpen={handleMenuOpen}\n          onClick={(e) => {\n            e.preventDefault();\n            handleMenuOpen(!isMenuOpened);\n          }}\n          menu={\n            <div ref={timePickerRef}>\n              <TimePickerMenu\n                disabled={disabled}\n                disabledTimes={disabledTimeRange}\n                format={format}\n                hasHeader={hasHeader}\n                hasHeaderDisplay={hasHeaderDisplay}\n                onTimeChange={handlePickerChange}\n                minutesInterval={minutesInterval}\n                time={time}\n                {...visiblePanels}\n              />\n            </div>\n          }\n        />\n      }\n    >\n      <DSInput\n        customInputType={({ onChange: handleChange, ...restInputProps }) => (\n          <TimeInputImpl clearable disabled={disabled} format={format} onChange={handleChange} {...restInputProps} />\n        )}\n        isShowElipsisActive={false}\n        disabled={disabled}\n        onChange={handleInputChange}\n        value={time}\n      />\n    </TimePickerContainer>\n  );\n};\n\nTimePickerImpl.propTypes = {\n  value: PropTypes.instanceOf(Date, moment),\n  onChange: PropTypes.func,\n  onOpen: PropTypes.func,\n  format: PropTypes.string,\n  disabled: PropTypes.bool,\n  hasHeader: PropTypes.bool,\n  hasHeaderDisplay: PropTypes.bool,\n  className: PropTypes.string,\n  containerProps: PropTypes.object,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n  disabledTimes: PropTypes.object,\n  minutesInterval: PropTypes.number,\n};\n\nexport { TimePickerImpl };\nexport default TimePickerImpl;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable no-shadow */\nimport React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport memoizeOne from 'memoize-one';\nimport { getVisibleTimeByFormat } from '@elliemae/ds-utilities';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSInput, DSInputGroup, TimeInputImpl } from '@elliemae/ds-form';\nimport TimePickerMenu from './TimePickerMenu';\nimport TimePickerDropdown from './TimePickerDropdown';\nimport { convertTimeString } from './utils';\n\nconst blockName = 'time-picker';\n\nconst TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({\n  isMenuOpened,\n}));\n\nconst TimePickerImpl = ({\n  value,\n  onChange,\n  onOpen,\n  format,\n  disabled,\n  hasHeader,\n  hasHeaderDisplay,\n  className,\n  containerProps,\n  placement,\n  zIndex,\n  disabledTimes,\n  minutesInterval,\n}) => {\n  const [time, setTime] = useState();\n  const [isMenuOpened, setIsMenuOpened] = useState(false);\n  const [focusedColumn, setFocusedColumn] = useState(null);\n  const timePickerRef = useRef();\n  useEffect(() => {\n    if (moment(value).isValid()) setTime(moment(value));\n    else if (value === null) setTime(undefined);\n  }, [value]);\n\n  useEffect(() => {\n    window.addEventListener('click', handleClickOutside, false);\n    return () => window.removeEventListener('click', handleClickOutside, false);\n  }, []);\n\n  useEffect(() => {\n    window.addEventListener('keydown', handleKeyDown, false);\n    return () => window.removeEventListener('keydown', handleKeyDown, false);\n  }, []);\n\n  useEffect(() => {\n    if (isMenuOpened) handleChangeFocus();\n  }, [isMenuOpened]);\n\n  const handleClickOutside = () => {\n    if (isMenuOpened) setIsMenuOpened(false);\n  };\n\n  const handleKeyDown = (event) => {\n    const { key } = event;\n    const menuOpenKeys = ['Escape', ' ', 'Enter'];\n    if (menuOpenKeys.includes(key)) setIsMenuOpened(false);\n  };\n\n  const handleChangeFocus = () => {\n    const [firstColumn] = document.getElementsByClassName('em-ds-time-picker-panel');\n    if (firstColumn && !focusedColumn) {\n      setFocusedColumn(firstColumn);\n      firstColumn.focus();\n    }\n  };\n\n  const handlePickerChange = (newTime) => {\n    setTime(moment(newTime));\n    onChange(moment(newTime));\n  };\n\n  const handleInputChange = (newTime) => {\n    setTime(newTime);\n    onChange(newTime);\n  };\n\n  const handleMenuOpen = (isOpen) => {\n    onOpen(isOpen);\n    setIsMenuOpened(isOpen);\n    if (!isOpen) setFocusedColumn(null);\n  };\n\n  const getVisibleTimePanels = memoizeOne((format) => getVisibleTimeByFormat(format));\n  const timePickerBlockName = convertPropToCssClassName(blockName);\n  const visiblePanels = getVisibleTimePanels(format);\n\n  const disabledTimeRange = disabledTimes && {\n    from: convertTimeString(disabledTimes.from),\n    to: convertTimeString(disabledTimes.to),\n  };\n\n  return (\n    <TimePickerContainer\n      className={`${className} variant-${!disabled ? 'default' : 'disabled'}`}\n      containerProps={containerProps}\n      disabled={disabled}\n      rightAddon={\n        <TimePickerDropdown\n          blockName={timePickerBlockName}\n          disabled={disabled}\n          isOpen={isMenuOpened}\n          zIndex={zIndex}\n          placement={placement}\n          onOpen={handleMenuOpen}\n          onClick={(e) => {\n            e.preventDefault();\n            handleMenuOpen(!isMenuOpened);\n          }}\n          menu={\n            <div ref={timePickerRef}>\n              <TimePickerMenu\n                disabled={disabled}\n                disabledTimes={disabledTimeRange}\n                format={format}\n                hasHeader={hasHeader}\n                hasHeaderDisplay={hasHeaderDisplay}\n                onTimeChange={handlePickerChange}\n                minutesInterval={minutesInterval}\n                time={time}\n                {...visiblePanels}\n              />\n            </div>\n          }\n        />\n      }\n    >\n      <DSInput\n        customInputType={({ onChange: handleChange, ...restInputProps }) => (\n          <TimeInputImpl clearable disabled={disabled} format={format} onChange={handleChange} {...restInputProps} />\n        )}\n        isShowElipsisActive={false}\n        disabled={disabled}\n        onChange={handleInputChange}\n        value={time}\n      />\n    </TimePickerContainer>\n  );\n};\n\nTimePickerImpl.propTypes = {\n  value: PropTypes.instanceOf(Date, moment),\n  onChange: PropTypes.func,\n  onOpen: PropTypes.func,\n  format: PropTypes.string,\n  disabled: PropTypes.bool,\n  hasHeader: PropTypes.bool,\n  hasHeaderDisplay: PropTypes.bool,\n  className: PropTypes.string,\n  containerProps: PropTypes.object,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n  disabledTimes: PropTypes.object,\n  minutesInterval: PropTypes.number,\n};\n\nexport default TimePickerImpl;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/TimePickerMenu.js

@@ -54,7 +54,7 @@ var import_ds_classnames = require("@elliemae/ds-classnames");
 var import_moment = __toESM(require("moment"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_utils = require("./utils");
-var import_PickerPanel = require("./PickerPanel");
+var import_PickerPanel = __toESM(require("./PickerPanel"));
 const blockName = "time-picker-menu";
 const TimePickerContainer = (0, import_ds_classnames.aggregatedClasses)("div")(blockName);
 const TimePickerHeader = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, "header");
@@ -73,6 +73,16 @@ class TimePickerMenu extends import_react.Component {
     this.state = {
       time: (0, import_moment.default)(props.time || "", props.format) || (0, import_moment.default)()
     };
+    this.handleMinuteChange = this.handleMinuteChange.bind(this);
+    this.handleHoursChange = this.handleHoursChange.bind(this);
+    this.handleSecondsChange = this.handleSecondsChange.bind(this);
+    this.handleAMPMChange = this.handleAMPMChange.bind(this);
+    this.updateTime = this.updateTime.bind(this);
+    this.renderHoursPanel = this.renderHoursPanel.bind(this);
+    this.renderMinutesPanel = this.renderMinutesPanel.bind(this);
+    this.renderSecondsPanel = this.renderSecondsPanel.bind(this);
+    this.renderAMPMPanel = this.renderAMPMPanel.bind(this);
+    this.renderHeader = this.renderHeader.bind(this);
   }
   static getDerivedStateFromProps(props, state) {
     if (props.time) {
@@ -138,7 +148,7 @@ class TimePickerMenu extends import_react.Component {
     const withLeadingZeros = format.indexOf("hh") > -1;
     const rangeHours = use12Hours ? (0, import_ds_utilities.range)(1, 13) : (0, import_ds_utilities.range)(24);
     const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && (0, import_ds_utilities.addLeadingZeros)(2)));
-    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
+    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.default, {
       type: "hour",
       time,
       meridiem,
@@ -173,7 +183,7 @@ class TimePickerMenu extends import_react.Component {
         selectedMinute = time.minute();
       }
     }
-    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
+    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.default, {
       type: "minutes",
       time,
       hasHeader,
@@ -191,7 +201,7 @@ class TimePickerMenu extends import_react.Component {
       return null;
     const withLeadingZeros = format.indexOf("ss") > -1;
     const rangeSeconds = (0, import_ds_utilities.range)(60).map(generateOption(withLeadingZeros && (0, import_ds_utilities.addLeadingZeros)(2)));
-    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
+    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.default, {
       type: "seconds",
       hasHeader,
       header: "S",
@@ -215,7 +225,7 @@ class TimePickerMenu extends import_react.Component {
         this.handleAMPMChange("pm");
       }
     }
-    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.PickerPanel, {
+    return /* @__PURE__ */ import_react.default.createElement(import_PickerPanel.default, {
       type: "meridiem",
       hasHeader,
       header: "",

package/dist/cjs/TimePickerMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/TimePickerMenu.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable react/prop-types */\nimport React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport { range, addLeadingZeros } from '@elliemae/ds-utilities';\nimport { isAM } from './utils';\nimport { PickerPanel } from './PickerPanel';\n\nconst blockName = 'time-picker-menu';\n\nconst TimePickerContainer = aggregatedClasses('div')(blockName);\nconst TimePickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');\n\nconst generateOption = (format) => (option) => ({\n  value: option,\n  label: typeof format === 'function' ? format(option) : option,\n});\n\nclass TimePickerMenu extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      time: moment(props.time || '', props.format) || moment(),\n    };\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (props.time) {\n      return { ...state, time: moment(props.time) };\n    }\n    return { ...state, time: undefined };\n  }\n\n  componentDidMount() {\n    const { time } = this.state;\n    this.setState({ time });\n  }\n\n  handleMinuteChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.minute(value));\n  }\n\n  handleHoursChange(value) {\n    const { time } = this.state;\n    const { use12Hours } = this.props;\n    let nextHour = value;\n    if (use12Hours) {\n      if (!isAM(time)) {\n        nextHour = (value % 12) + 12;\n      }\n    }\n    this.updateTime(time.hour(nextHour));\n  }\n\n  handleSecondsChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.second(value));\n  }\n\n  handleAMPMChange(value) {\n    const { time } = this.state;\n    const hour = time.hour();\n    const nextHour = value.toLowerCase() === 'am' ? hour % 12 : (hour % 12) + 12;\n    this.updateTime(time.hour(nextHour));\n  }\n\n  updateTime(time) {\n    const { onTimeChange } = this.props;\n    onTimeChange(time);\n    this.setState({ time });\n  }\n\n  renderHoursPanel() {\n    const { time } = this.state;\n    const { showHours, use12Hours, format, hasHeader, disabledTimes } = this.props;\n    if (!showHours) return null;\n\n    const hour = time.hour(); // in 24 format\n    let selectedHour = use12Hours ? hour % 12 || 12 : hour;\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (hour > from.hour && hour < to.hour) {\n        if (to.hour < 24) {\n          const toFormatted = to.hour % 12 || 12;\n          if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);\n          selectedHour = toFormatted;\n        } else if (from) {\n          selectedHour = (from.hour - 1) % 12 || 12;\n        }\n      }\n    }\n\n    const meridiem = hour >= 12 ? 'PM' : 'AM';\n    const withLeadingZeros = format.indexOf('hh') > -1;\n    const rangeHours = use12Hours ? range(1, 13) : range(24);\n    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"hour\"\n        time={time}\n        meridiem={meridiem}\n        hasHeader={hasHeader}\n        header=\"H\"\n        onChange={this.handleHoursChange}\n        options={hoursOptions}\n        selected={selectedHour}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderMinutesPanel() {\n    const { time } = this.state;\n    const { showMinutes, format, hasHeader, disabledTimes, minutesInterval } = this.props;\n    if (!showMinutes) return null;\n    const withLeadingZeros = format.indexOf('mm') > -1;\n    const rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n\n    let selectedMinute = time.minute();\n    const selectedHour = time.hour();\n\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (selectedHour <= to.hour && selectedHour > from.hour) {\n        if (to) {\n          if (selectedMinute < to.min) this.handleMinuteChange(to.min);\n        } else if (from) {\n          if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);\n        }\n      } else {\n        selectedMinute = time.minute();\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"minutes\"\n        time={time}\n        hasHeader={hasHeader}\n        header=\"M\"\n        onChange={this.handleMinuteChange}\n        options={rangeMinutes}\n        selected={selectedMinute}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderSecondsPanel() {\n    const { time } = this.state;\n    const { showSeconds, format, hasHeader } = this.props;\n    if (!showSeconds) return null;\n    const withLeadingZeros = format.indexOf('ss') > -1;\n    const rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"seconds\"\n        hasHeader={hasHeader}\n        header=\"S\"\n        onChange={this.handleSecondsChange}\n        options={rangeSeconds}\n        selected={time.second()}\n      />\n    );\n  }\n\n  renderAMPMPanel() {\n    const { time } = this.state;\n    const { use12Hours, hasHeader, disabledTimes } = this.props;\n    if (!use12Hours) return null;\n\n    let meridiemSelected = !isAM(time) ? 'pm' : 'am';\n    if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {\n      meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';\n      if (meridiemSelected === 'am' && time.hour() > 12) {\n        this.handleAMPMChange('am');\n      }\n\n      if (meridiemSelected === 'pm' && time.hour() <= 12) {\n        this.handleAMPMChange('pm');\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"meridiem\"\n        hasHeader={hasHeader}\n        header=\"\"\n        onChange={this.handleAMPMChange}\n        options={[\n          { value: 'am', label: 'am' },\n          { value: 'pm', label: 'pm' },\n        ]}\n        selected={meridiemSelected}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderHeader = () => {\n    const { time } = this.state;\n    return <TimePickerHeader>{time.format('hh:mma')}</TimePickerHeader>;\n  };\n\n  render() {\n    const { hasHeaderDisplay } = this.props;\n\n    return (\n      <TimePickerContainer>\n        {hasHeaderDisplay && this.renderHeader()}\n        <TimePickerPanelContainer>\n          {this.renderHoursPanel()}\n          {this.renderMinutesPanel()}\n          {this.renderSecondsPanel()}\n          {this.renderAMPMPanel()}\n        </TimePickerPanelContainer>\n      </TimePickerContainer>\n    );\n  }\n}\n\nTimePickerMenu.defaultProps = {\n  time: moment(),\n  hasHeader: false,\n  use12Hours: true,\n  showSeconds: true,\n  showMinutes: true,\n  showHours: true,\n  disabledTimes: undefined,\n  onTimeChange: () => null,\n};\n\nTimePickerMenu.propTypes = {\n  /** Time value */\n  time: PropTypes.instanceOf(moment),\n  /** If the menu has header or not */\n  hasHeader: PropTypes.bool,\n  /** Whether to use the 12 hours format */\n  use12Hours: PropTypes.bool,\n  /** Whether show 'seconds' or not */\n  showSeconds: PropTypes.bool,\n  /** Whether show 'minutes' or not */\n  showMinutes: PropTypes.bool,\n  /** Whether show 'hours' or not */\n  showHours: PropTypes.bool,\n  /** Handler when time changes */\n  onTimeChange: PropTypes.func,\n  disabledTimes: PropTypes.object,\n};\n\nexport { TimePickerMenu };\nexport default TimePickerMenu;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable react/prop-types */\nimport React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport { range, addLeadingZeros } from '@elliemae/ds-utilities';\nimport { isAM } from './utils';\nimport PickerPanel from './PickerPanel';\n\nconst blockName = 'time-picker-menu';\n\nconst TimePickerContainer = aggregatedClasses('div')(blockName);\nconst TimePickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');\n\nconst generateOption = (format) => (option) => ({\n  value: option,\n  label: typeof format === 'function' ? format(option) : option,\n});\n\nclass TimePickerMenu extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      time: moment(props.time || '', props.format) || moment(),\n    };\n\n    this.handleMinuteChange = this.handleMinuteChange.bind(this);\n    this.handleHoursChange = this.handleHoursChange.bind(this);\n    this.handleSecondsChange = this.handleSecondsChange.bind(this);\n    this.handleAMPMChange = this.handleAMPMChange.bind(this);\n    this.updateTime = this.updateTime.bind(this);\n    this.renderHoursPanel = this.renderHoursPanel.bind(this);\n    this.renderMinutesPanel = this.renderMinutesPanel.bind(this);\n    this.renderSecondsPanel = this.renderSecondsPanel.bind(this);\n    this.renderAMPMPanel = this.renderAMPMPanel.bind(this);\n    this.renderHeader = this.renderHeader.bind(this);\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (props.time) {\n      return { ...state, time: moment(props.time) };\n    }\n    return { ...state, time: undefined };\n  }\n\n  componentDidMount() {\n    const { time } = this.state;\n    this.setState({ time });\n  }\n\n  handleMinuteChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.minute(value));\n  }\n\n  handleHoursChange(value) {\n    const { time } = this.state;\n    const { use12Hours } = this.props;\n    let nextHour = value;\n    if (use12Hours) {\n      if (!isAM(time)) {\n        nextHour = (value % 12) + 12;\n      }\n    }\n    this.updateTime(time.hour(nextHour));\n  }\n\n  handleSecondsChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.second(value));\n  }\n\n  handleAMPMChange(value) {\n    const { time } = this.state;\n    const hour = time.hour();\n    const nextHour = value.toLowerCase() === 'am' ? hour % 12 : (hour % 12) + 12;\n    this.updateTime(time.hour(nextHour));\n  }\n\n  updateTime(time) {\n    const { onTimeChange } = this.props;\n    onTimeChange(time);\n    this.setState({ time });\n  }\n\n  renderHoursPanel() {\n    const { time } = this.state;\n    const { showHours, use12Hours, format, hasHeader, disabledTimes } = this.props;\n    if (!showHours) return null;\n\n    const hour = time.hour(); // in 24 format\n    let selectedHour = use12Hours ? hour % 12 || 12 : hour;\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (hour > from.hour && hour < to.hour) {\n        if (to.hour < 24) {\n          const toFormatted = to.hour % 12 || 12;\n          if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);\n          selectedHour = toFormatted;\n        } else if (from) {\n          selectedHour = (from.hour - 1) % 12 || 12;\n        }\n      }\n    }\n\n    const meridiem = hour >= 12 ? 'PM' : 'AM';\n    const withLeadingZeros = format.indexOf('hh') > -1;\n    const rangeHours = use12Hours ? range(1, 13) : range(24);\n    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"hour\"\n        time={time}\n        meridiem={meridiem}\n        hasHeader={hasHeader}\n        header=\"H\"\n        onChange={this.handleHoursChange}\n        options={hoursOptions}\n        selected={selectedHour}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderMinutesPanel() {\n    const { time } = this.state;\n    const { showMinutes, format, hasHeader, disabledTimes, minutesInterval } = this.props;\n    if (!showMinutes) return null;\n    const withLeadingZeros = format.indexOf('mm') > -1;\n    const rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n\n    let selectedMinute = time.minute();\n    const selectedHour = time.hour();\n\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (selectedHour <= to.hour && selectedHour > from.hour) {\n        if (to) {\n          if (selectedMinute < to.min) this.handleMinuteChange(to.min);\n        } else if (from) {\n          if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);\n        }\n      } else {\n        selectedMinute = time.minute();\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"minutes\"\n        time={time}\n        hasHeader={hasHeader}\n        header=\"M\"\n        onChange={this.handleMinuteChange}\n        options={rangeMinutes}\n        selected={selectedMinute}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderSecondsPanel() {\n    const { time } = this.state;\n    const { showSeconds, format, hasHeader } = this.props;\n    if (!showSeconds) return null;\n    const withLeadingZeros = format.indexOf('ss') > -1;\n    const rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"seconds\"\n        hasHeader={hasHeader}\n        header=\"S\"\n        onChange={this.handleSecondsChange}\n        options={rangeSeconds}\n        selected={time.second()}\n      />\n    );\n  }\n\n  renderAMPMPanel() {\n    const { time } = this.state;\n    const { use12Hours, hasHeader, disabledTimes } = this.props;\n    if (!use12Hours) return null;\n\n    let meridiemSelected = !isAM(time) ? 'pm' : 'am';\n    if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {\n      meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';\n      if (meridiemSelected === 'am' && time.hour() > 12) {\n        this.handleAMPMChange('am');\n      }\n\n      if (meridiemSelected === 'pm' && time.hour() <= 12) {\n        this.handleAMPMChange('pm');\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"meridiem\"\n        hasHeader={hasHeader}\n        header=\"\"\n        onChange={this.handleAMPMChange}\n        options={[\n          { value: 'am', label: 'am' },\n          { value: 'pm', label: 'pm' },\n        ]}\n        selected={meridiemSelected}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderHeader = () => {\n    const { time } = this.state;\n    return <TimePickerHeader>{time.format('hh:mma')}</TimePickerHeader>;\n  };\n\n  render() {\n    const { hasHeaderDisplay } = this.props;\n\n    return (\n      <TimePickerContainer>\n        {hasHeaderDisplay && this.renderHeader()}\n        <TimePickerPanelContainer>\n          {this.renderHoursPanel()}\n          {this.renderMinutesPanel()}\n          {this.renderSecondsPanel()}\n          {this.renderAMPMPanel()}\n        </TimePickerPanelContainer>\n      </TimePickerContainer>\n    );\n  }\n}\n\nTimePickerMenu.defaultProps = {\n  time: moment(),\n  hasHeader: false,\n  use12Hours: true,\n  showSeconds: true,\n  showMinutes: true,\n  showHours: true,\n  disabledTimes: undefined,\n  onTimeChange: () => null,\n};\n\nTimePickerMenu.propTypes = {\n  /** Time value */\n  time: PropTypes.instanceOf(moment),\n  /** If the menu has header or not */\n  hasHeader: PropTypes.bool,\n  /** Whether to use the 12 hours format */\n  use12Hours: PropTypes.bool,\n  /** Whether show 'seconds' or not */\n  showSeconds: PropTypes.bool,\n  /** Whether show 'minutes' or not */\n  showMinutes: PropTypes.bool,\n  /** Whether show 'hours' or not */\n  showHours: PropTypes.bool,\n  /** Handler when time changes */\n  onTimeChange: PropTypes.func,\n  disabledTimes: PropTypes.object,\n};\n\nexport { TimePickerMenu };\nexport default TimePickerMenu;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/moveElementOnScroll.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/moveElementOnScroll.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["export function MoveElementOnScroll(\n  element,\n  {\n    container,\n    min = 0,\n    max = element.offsetHeight,\n    speed = 1,\n    smooth = 2,\n    onUpdate = () => null,\n    onEndScroll = () => null,\n  },\n) {\n  let moving = false;\n  let pos = min;\n  let lastPos = pos;\n\n  // todo: move this to utils if we finally need it\n  const requestFrame = (function() {\n    return (\n      window.requestAnimationFrame ||\n      window.webkitRequestAnimationFrame ||\n      window.mozRequestAnimationFrame ||\n      window.oRequestAnimationFrame ||\n      window.msRequestAnimationFrame ||\n      function(func) {\n        window.setTimeout(func, 1000 / 50);\n      }\n    );\n  })();\n\n  function update() {\n    moving = true;\n    const delta = (pos - lastPos) / smooth;\n    lastPos += delta;\n\n    if (Math.abs(delta) > 0.7) {\n      requestFrame(() => {\n        onUpdate(lastPos, delta);\n        update();\n      });\n    } else {\n      onEndScroll(pos);\n      moving = false;\n    }\n  }\n\n  function scrolling(e) {\n    e.preventDefault(); // disable default scrolling\n    let delta = e.delta || e.wheelDelta;\n    if (delta === undefined) {\n      // for firefox\n      delta = -e.detail;\n      delta *= 10 * speed;\n    }\n\n    pos += -delta * speed;\n    pos = Math.max(min, Math.min(pos, max)); // limit scrolling\n    if (!moving) {\n      update();\n    }\n  }\n\n  container.addEventListener('mousewheel', scrolling, false);\n  container.addEventListener('DOMMouseScroll', scrolling, false);\n\n  return {\n    unsubscribe: () => {\n      container.removeEventListener('mousewheel', scrolling);\n      container.removeEventListener('DOMMouseScroll', scrolling);\n    },\n    updatePosition: newPos => {\n      pos = -newPos;\n      lastPos = -pos;\n    },\n  };\n}\n\nexport default MoveElementOnScroll;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,6BACL,SACA;AAAA,EACE;AAAA,EACA,MAAM;AAAA,EACN,MAAM,QAAQ;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAW,MAAM;AAAA,EACjB,cAAc,MAAM;AAAA,GAEtB;AACA,MAAI,SAAS;AACb,MAAI,MAAM;AACV,MAAI,UAAU;AAGd,QAAM,eAAgB,WAAW;AAC/B,WACE,OAAO,yBACP,OAAO,+BACP,OAAO,4BACP,OAAO,0BACP,OAAO,2BACP,SAAS,MAAM;AACb,aAAO,WAAW,MAAM,MAAO;AAAA;AAAA;AAKrC,oBAAkB;AAChB,aAAS;AACT,UAAM,QAAS,OAAM,WAAW;AAChC,eAAW;AAEX,QAAI,KAAK,IAAI,SAAS,KAAK;AACzB,mBAAa,MAAM;AACjB,iBAAS,SAAS;AAClB;AAAA;AAAA,WAEG;AACL,kBAAY;AACZ,eAAS;AAAA;AAAA;AAIb,qBAAmB,GAAG;AACpB,MAAE;AACF,QAAI,QAAQ,EAAE,SAAS,EAAE;AACzB,QAAI,UAAU,QAAW;AAEvB,cAAQ,CAAC,EAAE;AACX,eAAS,KAAK;AAAA;AAGhB,WAAO,CAAC,QAAQ;AAChB,UAAM,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK;AAClC,QAAI,CAAC,QAAQ;AACX;AAAA;AAAA;AAIJ,YAAU,iBAAiB,cAAc,WAAW;AACpD,YAAU,iBAAiB,kBAAkB,WAAW;AAExD,SAAO;AAAA,IACL,aAAa,MAAM;AACjB,gBAAU,oBAAoB,cAAc;AAC5C,gBAAU,oBAAoB,kBAAkB;AAAA;AAAA,IAElD,gBAAgB,YAAU;AACxB,YAAM,CAAC;AACP,gBAAU,CAAC;AAAA;AAAA;AAAA;AAKjB,IAAO,8BAAQ;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,6BACL,SACA;AAAA,EACE;AAAA,EACA,MAAM;AAAA,EACN,MAAM,QAAQ;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAW,MAAM;AAAA,EACjB,cAAc,MAAM;AAAA,GAEtB;AACA,MAAI,SAAS;AACb,MAAI,MAAM;AACV,MAAI,UAAU;AAGd,QAAM,eAAgB,WAAW;AAC/B,WACE,OAAO,yBACP,OAAO,+BACP,OAAO,4BACP,OAAO,0BACP,OAAO,2BACP,SAAS,MAAM;AACb,aAAO,WAAW,MAAM,MAAO,EAAE;AAAA,IACnC;AAAA,EAEJ,EAAG;AAEH,oBAAkB;AAChB,aAAS;AACT,UAAM,QAAS,OAAM,WAAW;AAChC,eAAW;AAEX,QAAI,KAAK,IAAI,KAAK,IAAI,KAAK;AACzB,mBAAa,MAAM;AACjB,iBAAS,SAAS,KAAK;AACvB,eAAO;AAAA,MACT,CAAC;AAAA,IACH,OAAO;AACL,kBAAY,GAAG;AACf,eAAS;AAAA,IACX;AAAA,EACF;AAEA,qBAAmB,GAAG;AACpB,MAAE,eAAe;AACjB,QAAI,QAAQ,EAAE,SAAS,EAAE;AACzB,QAAI,UAAU,QAAW;AAEvB,cAAQ,CAAC,EAAE;AACX,eAAS,KAAK;AAAA,IAChB;AAEA,WAAO,CAAC,QAAQ;AAChB,UAAM,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,GAAG,CAAC;AACtC,QAAI,CAAC,QAAQ;AACX,aAAO;AAAA,IACT;AAAA,EACF;AAEA,YAAU,iBAAiB,cAAc,WAAW,KAAK;AACzD,YAAU,iBAAiB,kBAAkB,WAAW,KAAK;AAE7D,SAAO;AAAA,IACL,aAAa,MAAM;AACjB,gBAAU,oBAAoB,cAAc,SAAS;AACrD,gBAAU,oBAAoB,kBAAkB,SAAS;AAAA,IAC3D;AAAA,IACA,gBAAgB,YAAU;AACxB,YAAM,CAAC;AACP,gBAAU,CAAC;AAAA,IACb;AAAA,EACF;AACF;AAEA,IAAO,8BAAQ;",
   "names": []
 }

package/dist/cjs/utils.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/utils.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["export const validateIndex = (index, options) => {\n  if (index < 0) return 0;\n  if (index >= options.length) return options.length - 1;\n  return index;\n};\n\nexport const getOptionIndex = (\n  options,\n  selectedOption,\n  valueProperty = 'value',\n) => {\n  const index = options.findIndex(\n    (option) => option[valueProperty] === selectedOption,\n  );\n  return validateIndex(index, options);\n};\n\nexport const isAM = (time) => time && time.hour() < 12;\n\nexport const convertTimeString = (string) => {\n  if (!string) return null;\n  let meridiem = 'AM';\n  if (string.toUpperCase().includes('PM')) meridiem = 'PM';\n\n  const arr = string.split(':');\n  let hour = parseInt(arr[0], 10);\n  if (meridiem === 'PM' && hour !== 12) hour += 12; // formats to 24\n  if (meridiem === 'AM' && hour === 12) hour = 0;\n  if (meridiem === 'PM' && hour === 12) hour = 12;\n\n  const min = parseInt(arr[1], 10);\n  const sec = parseInt(arr[2], 10);\n\n  return {\n    hour,\n    min,\n    sec,\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,gBAAgB,CAAC,OAAO,YAAY;AAC/C,MAAI,QAAQ;AAAG,WAAO;AACtB,MAAI,SAAS,QAAQ;AAAQ,WAAO,QAAQ,SAAS;AACrD,SAAO;AAAA;AAGF,MAAM,iBAAiB,CAC5B,SACA,gBACA,gBAAgB,YACb;AACH,QAAM,QAAQ,QAAQ,UACpB,CAAC,WAAW,OAAO,mBAAmB;AAExC,SAAO,cAAc,OAAO;AAAA;AAGvB,MAAM,OAAO,CAAC,SAAS,QAAQ,KAAK,SAAS;AAE7C,MAAM,oBAAoB,CAAC,WAAW;AAC3C,MAAI,CAAC;AAAQ,WAAO;AACpB,MAAI,WAAW;AACf,MAAI,OAAO,cAAc,SAAS;AAAO,eAAW;AAEpD,QAAM,MAAM,OAAO,MAAM;AACzB,MAAI,OAAO,SAAS,IAAI,IAAI;AAC5B,MAAI,aAAa,QAAQ,SAAS;AAAI,YAAQ;AAC9C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAC7C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAE7C,QAAM,MAAM,SAAS,IAAI,IAAI;AAC7B,QAAM,MAAM,SAAS,IAAI,IAAI;AAE7B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,gBAAgB,CAAC,OAAO,YAAY;AAC/C,MAAI,QAAQ;AAAG,WAAO;AACtB,MAAI,SAAS,QAAQ;AAAQ,WAAO,QAAQ,SAAS;AACrD,SAAO;AACT;AAEO,MAAM,iBAAiB,CAC5B,SACA,gBACA,gBAAgB,YACb;AACH,QAAM,QAAQ,QAAQ,UACpB,CAAC,WAAW,OAAO,mBAAmB,cACxC;AACA,SAAO,cAAc,OAAO,OAAO;AACrC;AAEO,MAAM,OAAO,CAAC,SAAS,QAAQ,KAAK,KAAK,IAAI;AAE7C,MAAM,oBAAoB,CAAC,WAAW;AAC3C,MAAI,CAAC;AAAQ,WAAO;AACpB,MAAI,WAAW;AACf,MAAI,OAAO,YAAY,EAAE,SAAS,IAAI;AAAG,eAAW;AAEpD,QAAM,MAAM,OAAO,MAAM,GAAG;AAC5B,MAAI,OAAO,SAAS,IAAI,IAAI,EAAE;AAC9B,MAAI,aAAa,QAAQ,SAAS;AAAI,YAAQ;AAC9C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAC7C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAE7C,QAAM,MAAM,SAAS,IAAI,IAAI,EAAE;AAC/B,QAAM,MAAM,SAAS,IAAI,IAAI,EAAE;AAE/B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/esm/DSTimePicker.js

@@ -2,7 +2,7 @@ import * as React from "react";
 import React2 from "react";
 import { PropTypes, describe } from "react-desc";
 import Moment from "moment";
-import { TimePickerImpl } from "./TimePickerImpl";
+import TimePickerImpl from "./TimePickerImpl";
 const DSTimePicker = ({
   containerProps = {},
   innerRef,

package/dist/esm/DSTimePicker.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSTimePicker.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport Moment from 'moment';\nimport { TimePickerImpl } from './TimePickerImpl';\n\nconst DSTimePicker = ({\n  containerProps = {},\n  innerRef,\n  className = '',\n  disabled = false,\n  value = '',\n  format,\n  style = {},\n  onChange = () => null,\n  onOpen = () => null,\n  isOpen = undefined,\n  clearable = false,\n  hasHeader = true,\n  hasHeaderDisplay = false,\n  'aria-label': ariaLabel,\n  zIndex = 'auto',\n  placement = 'bottom',\n  disabledTimes,\n  minutesInterval = 1,\n}) => (\n  <TimePickerImpl\n    ref={innerRef}\n    aria-label={ariaLabel}\n    className={className}\n    clearable={clearable}\n    containerProps={containerProps}\n    disabled={disabled}\n    format={format}\n    hasHeader={hasHeader}\n    hasHeaderDisplay={hasHeaderDisplay}\n    isOpen={isOpen}\n    onChange={onChange}\n    onOpen={onOpen}\n    placement={placement}\n    style={style}\n    value={value}\n    zIndex={zIndex}\n    minutesInterval={minutesInterval}\n    disabledTimes={disabledTimes}\n  />\n);\n\nDSTimePicker.defaultProps = {\n  format: 'hh:mm:ss A',\n};\n\nconst props = {\n  /** a11y label */\n  'aria-label': PropTypes.string.description('a11y label'),\n  /** inject props to time picker wrapper */\n  containerProps: PropTypes.object.description(\n    'inject props to time picker wrapper',\n  ),\n  /** Whether the time picker is disabled or not */\n  disabled: PropTypes.bool.description(\n    'Whether the time picker is disabled or not',\n  ),\n  /** Time picker value */\n  value: PropTypes.instanceOf(Moment).description('Time picker value'),\n  /** Time format (hh:mm:ss, H:m:s) */\n  format: PropTypes.string.description('Time format (hh:mm:ss, H:m:s)'),\n  /** toggle header style */\n  hasHeader: PropTypes.bool.description('toggle header style'),\n  /** toggle header display */\n  hasHeaderDisplay: PropTypes.bool.description('toggle header display'),\n  /** Handler when time picker value changes */\n  onChange: PropTypes.func.description(\n    'Handler when time picker value changes',\n  ),\n  /** Handler when the time picker menu opens */\n  onOpen: PropTypes.func.description('Handler when the time picker menu opens'),\n  /** Whether the time picker menu is opened or not */\n  isOpen: PropTypes.bool.description(\n    'Whether the time picker menu is opened or not',\n  ),\n  /** ref for time picker input */\n  innerRef: PropTypes.func.description('ref for time picker input'),\n  /** Enable to clear the time picker value */\n  clearable: PropTypes.bool.description(\n    'Enable to clear the time picker value',\n  ),\n  /** class for time picker */\n  className: PropTypes.string.description('class for time picker'),\n  /** style object */\n  style: PropTypes.object.description('style object'),\n  /** z index for menu */\n  zIndex: PropTypes.number.description('z index for menu'),\n  /** DSPopper placement */\n  placement: PropTypes.string.description('DSPopper placement'),\n  /** disabled time */\n  disabledTimes: PropTypes.object.description('disabled time'),\n  /** steps for the picker */\n  minutesInterval: PropTypes.number.description('steps for the picker'),\n};\n\nDSTimePicker.propTypes = props;\nconst DSTimePickerWithSchema = describe(DSTimePicker);\nDSTimePickerWithSchema.propTypes = props;\n\nexport { DSTimePicker, DSTimePickerWithSchema };\nexport default DSTimePicker;\n"],
-  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,eAAe,CAAC;AAAA,EACpB,iBAAiB;AAAA,EACjB;AAAA,EACA,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA,QAAQ;AAAA,EACR,WAAW,MAAM;AAAA,EACjB,SAAS,MAAM;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,YAAY;AAAA,EACZ;AAAA,EACA,kBAAkB;AAAA,MAElB,qCAAC,gBAAD;AAAA,EACE,KAAK;AAAA,EACL,cAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAIJ,aAAa,eAAe;AAAA,EAC1B,QAAQ;AAAA;AAGV,MAAM,QAAQ;AAAA,EAEZ,cAAc,UAAU,OAAO,YAAY;AAAA,EAE3C,gBAAgB,UAAU,OAAO,YAC/B;AAAA,EAGF,UAAU,UAAU,KAAK,YACvB;AAAA,EAGF,OAAO,UAAU,WAAW,QAAQ,YAAY;AAAA,EAEhD,QAAQ,UAAU,OAAO,YAAY;AAAA,EAErC,WAAW,UAAU,KAAK,YAAY;AAAA,EAEtC,kBAAkB,UAAU,KAAK,YAAY;AAAA,EAE7C,UAAU,UAAU,KAAK,YACvB;AAAA,EAGF,QAAQ,UAAU,KAAK,YAAY;AAAA,EAEnC,QAAQ,UAAU,KAAK,YACrB;AAAA,EAGF,UAAU,UAAU,KAAK,YAAY;AAAA,EAErC,WAAW,UAAU,KAAK,YACxB;AAAA,EAGF,WAAW,UAAU,OAAO,YAAY;AAAA,EAExC,OAAO,UAAU,OAAO,YAAY;AAAA,EAEpC,QAAQ,UAAU,OAAO,YAAY;AAAA,EAErC,WAAW,UAAU,OAAO,YAAY;AAAA,EAExC,eAAe,UAAU,OAAO,YAAY;AAAA,EAE5C,iBAAiB,UAAU,OAAO,YAAY;AAAA;AAGhD,aAAa,YAAY;AACzB,MAAM,yBAAyB,SAAS;AACxC,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport Moment from 'moment';\nimport TimePickerImpl from './TimePickerImpl';\n\nconst DSTimePicker = ({\n  containerProps = {},\n  innerRef,\n  className = '',\n  disabled = false,\n  value = '',\n  format,\n  style = {},\n  onChange = () => null,\n  onOpen = () => null,\n  isOpen = undefined,\n  clearable = false,\n  hasHeader = true,\n  hasHeaderDisplay = false,\n  'aria-label': ariaLabel,\n  zIndex = 'auto',\n  placement = 'bottom',\n  disabledTimes,\n  minutesInterval = 1,\n}) => (\n  <TimePickerImpl\n    ref={innerRef}\n    aria-label={ariaLabel}\n    className={className}\n    clearable={clearable}\n    containerProps={containerProps}\n    disabled={disabled}\n    format={format}\n    hasHeader={hasHeader}\n    hasHeaderDisplay={hasHeaderDisplay}\n    isOpen={isOpen}\n    onChange={onChange}\n    onOpen={onOpen}\n    placement={placement}\n    style={style}\n    value={value}\n    zIndex={zIndex}\n    minutesInterval={minutesInterval}\n    disabledTimes={disabledTimes}\n  />\n);\n\nDSTimePicker.defaultProps = {\n  format: 'hh:mm:ss A',\n};\n\nconst props = {\n  /** a11y label */\n  'aria-label': PropTypes.string.description('a11y label'),\n  /** inject props to time picker wrapper */\n  containerProps: PropTypes.object.description(\n    'inject props to time picker wrapper',\n  ),\n  /** Whether the time picker is disabled or not */\n  disabled: PropTypes.bool.description(\n    'Whether the time picker is disabled or not',\n  ),\n  /** Time picker value */\n  value: PropTypes.instanceOf(Moment).description('Time picker value'),\n  /** Time format (hh:mm:ss, H:m:s) */\n  format: PropTypes.string.description('Time format (hh:mm:ss, H:m:s)'),\n  /** toggle header style */\n  hasHeader: PropTypes.bool.description('toggle header style'),\n  /** toggle header display */\n  hasHeaderDisplay: PropTypes.bool.description('toggle header display'),\n  /** Handler when time picker value changes */\n  onChange: PropTypes.func.description(\n    'Handler when time picker value changes',\n  ),\n  /** Handler when the time picker menu opens */\n  onOpen: PropTypes.func.description('Handler when the time picker menu opens'),\n  /** Whether the time picker menu is opened or not */\n  isOpen: PropTypes.bool.description(\n    'Whether the time picker menu is opened or not',\n  ),\n  /** ref for time picker input */\n  innerRef: PropTypes.func.description('ref for time picker input'),\n  /** Enable to clear the time picker value */\n  clearable: PropTypes.bool.description(\n    'Enable to clear the time picker value',\n  ),\n  /** class for time picker */\n  className: PropTypes.string.description('class for time picker'),\n  /** style object */\n  style: PropTypes.object.description('style object'),\n  /** z index for menu */\n  zIndex: PropTypes.number.description('z index for menu'),\n  /** DSPopper placement */\n  placement: PropTypes.string.description('DSPopper placement'),\n  /** disabled time */\n  disabledTimes: PropTypes.object.description('disabled time'),\n  /** steps for the picker */\n  minutesInterval: PropTypes.number.description('steps for the picker'),\n};\n\nDSTimePicker.propTypes = props;\nconst DSTimePickerWithSchema = describe(DSTimePicker);\nDSTimePickerWithSchema.propTypes = props;\n\nexport { DSTimePicker, DSTimePickerWithSchema };\nexport default DSTimePicker;\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,eAAe,CAAC;AAAA,EACpB,iBAAiB,CAAC;AAAA,EAClB;AAAA,EACA,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,WAAW,MAAM;AAAA,EACjB,SAAS,MAAM;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,YAAY;AAAA,EACZ;AAAA,EACA,kBAAkB;AAAA,MAElB,qCAAC;AAAA,EACC,KAAK;AAAA,EACL,cAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,CACF;AAGF,aAAa,eAAe;AAAA,EAC1B,QAAQ;AACV;AAEA,MAAM,QAAQ;AAAA,EAEZ,cAAc,UAAU,OAAO,YAAY,YAAY;AAAA,EAEvD,gBAAgB,UAAU,OAAO,YAC/B,qCACF;AAAA,EAEA,UAAU,UAAU,KAAK,YACvB,4CACF;AAAA,EAEA,OAAO,UAAU,WAAW,MAAM,EAAE,YAAY,mBAAmB;AAAA,EAEnE,QAAQ,UAAU,OAAO,YAAY,+BAA+B;AAAA,EAEpE,WAAW,UAAU,KAAK,YAAY,qBAAqB;AAAA,EAE3D,kBAAkB,UAAU,KAAK,YAAY,uBAAuB;AAAA,EAEpE,UAAU,UAAU,KAAK,YACvB,wCACF;AAAA,EAEA,QAAQ,UAAU,KAAK,YAAY,yCAAyC;AAAA,EAE5E,QAAQ,UAAU,KAAK,YACrB,+CACF;AAAA,EAEA,UAAU,UAAU,KAAK,YAAY,2BAA2B;AAAA,EAEhE,WAAW,UAAU,KAAK,YACxB,uCACF;AAAA,EAEA,WAAW,UAAU,OAAO,YAAY,uBAAuB;AAAA,EAE/D,OAAO,UAAU,OAAO,YAAY,cAAc;AAAA,EAElD,QAAQ,UAAU,OAAO,YAAY,kBAAkB;AAAA,EAEvD,WAAW,UAAU,OAAO,YAAY,oBAAoB;AAAA,EAE5D,eAAe,UAAU,OAAO,YAAY,eAAe;AAAA,EAE3D,iBAAiB,UAAU,OAAO,YAAY,sBAAsB;AACtE;AAEA,aAAa,YAAY;AACzB,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
   "names": []
 }

package/dist/esm/DSTimePickerMenu.js

@@ -17,7 +17,7 @@ var __spreadValues = (a, b) => {
 import * as React from "react";
 import React2 from "react";
 import styled from "styled-components";
-import { TimePickerMenu } from "./TimePickerMenu";
+import TimePickerMenu from "./TimePickerMenu";
 const DSTimePickerMenuWrapper = styled.div`
   display: flex;
   height: 18.6rem;

package/dist/esm/DSTimePickerMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSTimePickerMenu.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport styled from 'styled-components';\nimport { TimePickerMenu } from './TimePickerMenu';\n\nconst DSTimePickerMenuWrapper = styled.div`\n  display: flex;\n  height: 18.6rem;\n`;\nfunction DSTimePickerMenu(props) {\n  return (\n    <DSTimePickerMenuWrapper>\n      <TimePickerMenu {...props} />\n    </DSTimePickerMenuWrapper>\n  );\n}\nexport { DSTimePickerMenu };\nexport default DSTimePickerMenu;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AAEA,MAAM,0BAA0B,OAAO;AAAA;AAAA;AAAA;AAIvC,0BAA0B,OAAO;AAC/B,SACE,qCAAC,yBAAD,MACE,qCAAC,gBAAD,mBAAoB;AAAA;AAK1B,IAAO,2BAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport styled from 'styled-components';\nimport TimePickerMenu from './TimePickerMenu';\n\nconst DSTimePickerMenuWrapper = styled.div`\n  display: flex;\n  height: 18.6rem;\n`;\nfunction DSTimePickerMenu(props) {\n  return (\n    <DSTimePickerMenuWrapper>\n      <TimePickerMenu {...props} />\n    </DSTimePickerMenuWrapper>\n  );\n}\nexport { DSTimePickerMenu };\nexport default DSTimePickerMenu;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AAEA,MAAM,0BAA0B,OAAO;AAAA;AAAA;AAAA;AAIvC,0BAA0B,OAAO;AAC/B,SACE,qCAAC,+BACC,qCAAC,mCAAmB,MAAO,CAC7B;AAEJ;AAEA,IAAO,2BAAQ;",
   "names": []
 }

package/dist/esm/PickerPanel.js

@@ -61,10 +61,6 @@ class PickerPanel extends Component {
         this.scrollHandler.updatePosition(listYPosition);
       return listYPosition;
     });
-    this.renderHeader = () => {
-      const { header } = this.props;
-      return /* @__PURE__ */ React2.createElement(PickerHeader, null, header);
-    };
     this.pickerListContainerRef = React2.createRef();
     this.pickerListRef = React2.createRef();
     this.pickerItemRef = React2.createRef();
@@ -74,6 +70,15 @@ class PickerPanel extends Component {
       activeIndex: 0,
       prevProps: {}
     };
+    this.getOptionValue = this.getOptionValue.bind(this);
+    this.getOptionLabel = this.getOptionLabel.bind(this);
+    this.computeSizes = this.computeSizes.bind(this);
+    this.handleOptionSelect = this.handleOptionSelect.bind(this);
+    this.handleKeyDown = this.handleKeyDown.bind(this);
+    this.moveTo = this.moveTo.bind(this);
+    this.handleStepMoveUp = this.handleStepMoveUp.bind(this);
+    this.handleStepMoveDown = this.handleStepMoveDown.bind(this);
+    this.renderHeader = this.renderHeader.bind(this);
   }
   componentDidMount() {
     this.computeSizes();
@@ -195,6 +200,10 @@ class PickerPanel extends Component {
     const nextPos = supposedPos <= options.length ? supposedPos : activeIndex + 1;
     this.moveTo(nextPos);
   }
+  renderHeader() {
+    const { header } = this.props;
+    return /* @__PURE__ */ React2.createElement(PickerHeader, null, header);
+  }
   render() {
     const { options, hasHeader, type, time, meridiem, disabledTimes } = this.props;
     const { selectedOption, activeIndex, scrolling } = this.state;

package/dist/esm/PickerPanel.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/PickerPanel.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable eqeqeq */\n/* eslint-disable react/prop-types */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport { findIndex } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport memoizeOne from 'memoize-one';\nimport { ChevronSmallUp, ChevronSmallDown } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoveElementOnScroll } from './moveElementOnScroll';\nimport { validateIndex } from './utils';\n\nconst blockName = 'time-picker-panel';\n\nconst Container = aggregatedClasses('div')(blockName, null, ({ scrolling }) => ({ scrolling }));\nconst Wrapper = aggregatedClasses('div')(blockName, 'wrapper');\nconst PickerItemListContainer = aggregatedClasses('div')(blockName, 'item-list-container');\nconst PickerItemList = aggregatedClasses('div')(blockName, 'item-list');\nconst PickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst PickerItemContainer = aggregatedClasses('div')(blockName, 'item', ({ selected, disabled }) => ({\n  selected,\n  disabled,\n}));\nconst PickerSelectedOptionSelected = aggregatedClasses('div')(blockName, 'selected-container');\nconst SelectedCircle = aggregatedClasses('div')(blockName, 'selected-circle');\nconst ArrowButtonContainer = aggregatedClasses('div')(blockName, 'arrow-container');\n\nconst getOptionIndex = (options, selectedOption, valueProperty = 'value') => {\n  const index = options.findIndex((option) => option[valueProperty] === selectedOption);\n  return validateIndex(index, options);\n};\n\nconst arrowProps = {\n  buttonType: 'text',\n  fluidHeight: true,\n  fluidWidth: true,\n  size: 's',\n};\n\nexport default class PickerPanel extends Component {\n  computeContainerTranslation = memoizeOne((index) => {\n    const { options, valueProperty } = this.props;\n    const { selectedOption, scrolling } = this.state;\n\n    const selectedOptionIndex = index || getOptionIndex(options, selectedOption, valueProperty);\n    const listYPosition = this.minYListPosition - selectedOptionIndex * this.optionHeight;\n\n    if (this.scrollHandler && !scrolling) this.scrollHandler.updatePosition(listYPosition);\n\n    return listYPosition;\n  });\n\n  constructor(props) {\n    super(props);\n    this.pickerListContainerRef = React.createRef();\n    this.pickerListRef = React.createRef();\n    this.pickerItemRef = React.createRef();\n    this.selectedOptionRef = React.createRef();\n\n    this.state = {\n      selectedOption: props.selected,\n      activeIndex: 0,\n      // eslint-disable-next-line react/no-unused-state\n      prevProps: {},\n    };\n  }\n\n  componentDidMount() {\n    this.computeSizes();\n    const pickerListContainerEl = this.pickerListContainerRef.current;\n    const pickerListEl = this.pickerListRef.current;\n\n    this.scrollHandler = new MoveElementOnScroll(pickerListEl, {\n      container: pickerListContainerEl,\n      min: -this.minYListPosition,\n      max: this.maxYListPosition,\n      onUpdate: (pos, delta) => {\n        const { options } = this.props;\n        const index =\n          options.length - -Math.floor((pos - this.maxYListPosition) / this.optionHeight) + (delta > 0 ? 1 : -1);\n        this.moveTo(index, true);\n      },\n      onEndScroll: () => {\n        this.setState({ scrolling: false });\n      },\n    });\n    this.computeContainerTranslation();\n  }\n\n  componentWillUnmount() {\n    this.scrollHandler.unsubscribe();\n  }\n\n  static getDerivedStateFromProps(nextProps, { prevProps }) {\n    const { selected, valueProperty, options } = nextProps;\n    if (selected !== prevProps.selected) {\n      return {\n        selectedOption: selected,\n        activeIndex: getOptionIndex(options, selected, valueProperty),\n        prevProps: nextProps,\n      };\n    }\n    return null;\n  }\n\n  getOptionValue(option) {\n    const { valueProperty } = this.props;\n    return option[valueProperty];\n  }\n\n  getOptionLabel(option) {\n    const { labelProperty } = this.props;\n    return option[labelProperty];\n  }\n\n  computeSizes() {\n    const { options, numberItemsOnScreen } = this.props;\n    const { offsetHeight: optionHeight } = this.pickerItemRef.current;\n\n    this.optionHeight = optionHeight;\n    this.listHeight = this.optionHeight * numberItemsOnScreen;\n\n    this.minYListPosition = this.listHeight / 2 - this.optionHeight / 2;\n    this.maxYListPosition = this.optionHeight * (options.length - Math.ceil(numberItemsOnScreen / 2));\n  }\n\n  handleOptionSelect(optionValue, index, scrolling) {\n    const { onChange } = this.props;\n    this.setState(\n      (state) => ({\n        ...state,\n        scrolling,\n        selectedOption: optionValue,\n        activeIndex: index,\n      }),\n      () => {\n        onChange(optionValue, index);\n      },\n    );\n  }\n\n  // TODO: this needs a refactor from de FocusGroup\n  // eslint-disable-next-line max-statements\n  handleKeyDown(e) {\n    const { activeIndex } = this.state;\n    const { options } = this.props;\n    const [firstColumn, ...restColumns] = document.getElementsByClassName('em-ds-time-picker-panel');\n    const [lastColumn] = restColumns.slice(-1);\n    const [prev] = document.getElementsByClassName('DayPickerNavigation_button');\n    const focusedElement = document.activeElement;\n\n    switch (e.key) {\n      case 'Home':\n        this.moveTo(0);\n        break;\n      case 'End':\n        this.moveTo(options.length - 1);\n        break;\n      case 'ArrowUp':\n        this.moveTo(activeIndex - 1);\n        break;\n      case 'ArrowDown':\n        this.moveTo(activeIndex + 1);\n        break;\n      case 'Tab': {\n        e.preventDefault();\n        // If it is DateTimePicker, move focus to prev arrow element\n        if (prev && focusedElement === lastColumn) {\n          prev.focus();\n        } else if (focusedElement === lastColumn) {\n          firstColumn.focus();\n        } else {\n          const position = findIndex(restColumns, focusedElement);\n          restColumns[position + 1].focus();\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  }\n\n  moveTo(index, scrolling) {\n    const { options } = this.props;\n    const { selectedOption } = this.state;\n    const validIndex = validateIndex(index, options);\n    const option = options[validIndex];\n    const optionValue = this.getOptionValue(option);\n    if (selectedOption !== optionValue && option.disabled !== true) {\n      this.handleOptionSelect(optionValue, validIndex, scrolling);\n    }\n    // TO-DO: if date disabled, add nextValidOption selection\n  }\n\n  handleStepMoveUp() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex - arrowStep;\n    const nextPos = supposedPos >= 0 ? supposedPos : activeIndex - 1;\n\n    const nextValidOption = options.find((op) => !op.disabled);\n    this.moveTo(nextPos, true, nextValidOption);\n  }\n\n  handleStepMoveDown() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex + arrowStep;\n    const nextPos = supposedPos <= options.length ? supposedPos : activeIndex + 1;\n    this.moveTo(nextPos);\n  }\n\n  renderHeader = () => {\n    const { header } = this.props;\n\n    return <PickerHeader>{header}</PickerHeader>;\n  };\n\n  render() {\n    const { options, hasHeader, type, time, meridiem, disabledTimes } = this.props;\n    const { selectedOption, activeIndex, scrolling } = this.state;\n\n    const listYPosition = this.computeContainerTranslation(activeIndex);\n\n    return (\n      <Wrapper>\n        {hasHeader && this.renderHeader()}\n        <Container classProps={{ scrolling }} onKeyDown={this.handleKeyDown} tabIndex={0}>\n          <PickerSelectedOptionSelected innerRef={this.selectedOptionRef}>\n            <SelectedCircle />\n          </PickerSelectedOptionSelected>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Up\"\n              data-testid={`${type}-chevron-up`}\n              disabled={activeIndex <= 0}\n              icon={<ChevronSmallUp />}\n              onClick={this.handleStepMoveUp}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n          <PickerItemListContainer\n            innerRef={this.pickerListContainerRef}\n            style={{\n              height: this.listHeight,\n            }}\n          >\n            <PickerItemList\n              data-testid={`${type}-list`}\n              innerRef={this.pickerListRef}\n              style={{\n                transform: `translateY(${listYPosition}px)`,\n              }}\n            >\n              {options.map((option, index) => {\n                const value = this.getOptionValue(option);\n                const label = this.getOptionLabel(option);\n                let valueFormatted;\n                if (meridiem === 'AM') valueFormatted = value;\n                else if (meridiem === 'PM' && value === 12) valueFormatted = value;\n                else if (meridiem === 'PM') valueFormatted = value + 12;\n\n                let disabled = false;\n                if (disabledTimes) {\n                  const { from, to } = disabledTimes;\n                  if (\n                    (type === 'hour' && valueFormatted >= from?.hour && valueFormatted < to?.hour) ||\n                    (type === 'minutes' && value >= from?.min && value < to?.min)\n                  ) {\n                    disabled = true;\n                  }\n                  if (type === 'minutes' && (time?.hour() > to?.hour || time?.hour() < from?.hour)) {\n                    disabled = false;\n                  }\n                  if (label === 'am' && from?.hour == 0 && to?.hour >= 12) {\n                    disabled = true;\n                  }\n                  if (label === 'pm' && to?.hour == 24) {\n                    disabled = true;\n                  }\n                }\n\n                option.disabled = disabled;\n\n                return (\n                  <PickerItemContainer\n                    key={value}\n                    classProps={{\n                      selected: selectedOption ? value === selectedOption : index === 0,\n                      disabled,\n                    }}\n                    innerRef={this.pickerItemRef}\n                    onClick={() => {\n                      if (!disabled) this.handleOptionSelect(value, index);\n                    }}\n                  >\n                    {label}\n                  </PickerItemContainer>\n                );\n              })}\n            </PickerItemList>\n          </PickerItemListContainer>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Down\"\n              data-testid={`${type}-chevron-down`}\n              disabled={activeIndex >= options.length - 1}\n              icon={<ChevronSmallDown />}\n              onClick={this.handleStepMoveDown}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n        </Container>\n      </Wrapper>\n    );\n  }\n}\n\nPickerPanel.defaultProps = {\n  valueProperty: 'value',\n  labelProperty: 'label',\n  numberItemsOnScreen: 5, // this number should be impair\n  options: [],\n  arrowStep: 1,\n};\n\nexport { PickerPanel };"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable eqeqeq */\n/* eslint-disable react/prop-types */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport { findIndex } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport memoizeOne from 'memoize-one';\nimport { ChevronSmallUp, ChevronSmallDown } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoveElementOnScroll } from './moveElementOnScroll';\nimport { validateIndex } from './utils';\n\nconst blockName = 'time-picker-panel';\n\nconst Container = aggregatedClasses('div')(blockName, null, ({ scrolling }) => ({ scrolling }));\nconst Wrapper = aggregatedClasses('div')(blockName, 'wrapper');\nconst PickerItemListContainer = aggregatedClasses('div')(blockName, 'item-list-container');\nconst PickerItemList = aggregatedClasses('div')(blockName, 'item-list');\nconst PickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst PickerItemContainer = aggregatedClasses('div')(blockName, 'item', ({ selected, disabled }) => ({\n  selected,\n  disabled,\n}));\nconst PickerSelectedOptionSelected = aggregatedClasses('div')(blockName, 'selected-container');\nconst SelectedCircle = aggregatedClasses('div')(blockName, 'selected-circle');\nconst ArrowButtonContainer = aggregatedClasses('div')(blockName, 'arrow-container');\n\nconst getOptionIndex = (options, selectedOption, valueProperty = 'value') => {\n  const index = options.findIndex((option) => option[valueProperty] === selectedOption);\n  return validateIndex(index, options);\n};\n\nconst arrowProps = {\n  buttonType: 'text',\n  fluidHeight: true,\n  fluidWidth: true,\n  size: 's',\n};\n\nexport default class PickerPanel extends Component {\n  computeContainerTranslation = memoizeOne((index) => {\n    const { options, valueProperty } = this.props;\n    const { selectedOption, scrolling } = this.state;\n\n    const selectedOptionIndex = index || getOptionIndex(options, selectedOption, valueProperty);\n    const listYPosition = this.minYListPosition - selectedOptionIndex * this.optionHeight;\n\n    if (this.scrollHandler && !scrolling) this.scrollHandler.updatePosition(listYPosition);\n\n    return listYPosition;\n  });\n\n  constructor(props) {\n    super(props);\n    this.pickerListContainerRef = React.createRef();\n    this.pickerListRef = React.createRef();\n    this.pickerItemRef = React.createRef();\n    this.selectedOptionRef = React.createRef();\n\n    this.state = {\n      selectedOption: props.selected,\n      activeIndex: 0,\n      // eslint-disable-next-line react/no-unused-state\n      prevProps: {},\n    };\n\n    this.getOptionValue = this.getOptionValue.bind(this);\n    this.getOptionLabel = this.getOptionLabel.bind(this);\n    this.computeSizes = this.computeSizes.bind(this);\n    this.handleOptionSelect = this.handleOptionSelect.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n    this.moveTo = this.moveTo.bind(this);\n    this.handleStepMoveUp = this.handleStepMoveUp.bind(this);\n    this.handleStepMoveDown = this.handleStepMoveDown.bind(this);\n    this.renderHeader = this.renderHeader.bind(this);\n  }\n\n  componentDidMount() {\n    this.computeSizes();\n    const pickerListContainerEl = this.pickerListContainerRef.current;\n    const pickerListEl = this.pickerListRef.current;\n\n    this.scrollHandler = new MoveElementOnScroll(pickerListEl, {\n      container: pickerListContainerEl,\n      min: -this.minYListPosition,\n      max: this.maxYListPosition,\n      onUpdate: (pos, delta) => {\n        const { options } = this.props;\n        const index =\n          options.length - -Math.floor((pos - this.maxYListPosition) / this.optionHeight) + (delta > 0 ? 1 : -1);\n        this.moveTo(index, true);\n      },\n      onEndScroll: () => {\n        this.setState({ scrolling: false });\n      },\n    });\n    this.computeContainerTranslation();\n  }\n\n  componentWillUnmount() {\n    this.scrollHandler.unsubscribe();\n  }\n\n  static getDerivedStateFromProps(nextProps, { prevProps }) {\n    const { selected, valueProperty, options } = nextProps;\n    if (selected !== prevProps.selected) {\n      return {\n        selectedOption: selected,\n        activeIndex: getOptionIndex(options, selected, valueProperty),\n        prevProps: nextProps,\n      };\n    }\n    return null;\n  }\n\n  getOptionValue(option) {\n    const { valueProperty } = this.props;\n    return option[valueProperty];\n  }\n\n  getOptionLabel(option) {\n    const { labelProperty } = this.props;\n    return option[labelProperty];\n  }\n\n  computeSizes() {\n    const { options, numberItemsOnScreen } = this.props;\n    const { offsetHeight: optionHeight } = this.pickerItemRef.current;\n\n    this.optionHeight = optionHeight;\n    this.listHeight = this.optionHeight * numberItemsOnScreen;\n\n    this.minYListPosition = this.listHeight / 2 - this.optionHeight / 2;\n    this.maxYListPosition = this.optionHeight * (options.length - Math.ceil(numberItemsOnScreen / 2));\n  }\n\n  handleOptionSelect(optionValue, index, scrolling) {\n    const { onChange } = this.props;\n    this.setState(\n      (state) => ({\n        ...state,\n        scrolling,\n        selectedOption: optionValue,\n        activeIndex: index,\n      }),\n      () => {\n        onChange(optionValue, index);\n      },\n    );\n  }\n\n  // TODO: this needs a refactor from de FocusGroup\n  // eslint-disable-next-line max-statements\n  handleKeyDown(e) {\n    const { activeIndex } = this.state;\n    const { options } = this.props;\n    const [firstColumn, ...restColumns] = document.getElementsByClassName('em-ds-time-picker-panel');\n    const [lastColumn] = restColumns.slice(-1);\n    const [prev] = document.getElementsByClassName('DayPickerNavigation_button');\n    const focusedElement = document.activeElement;\n\n    switch (e.key) {\n      case 'Home':\n        this.moveTo(0);\n        break;\n      case 'End':\n        this.moveTo(options.length - 1);\n        break;\n      case 'ArrowUp':\n        this.moveTo(activeIndex - 1);\n        break;\n      case 'ArrowDown':\n        this.moveTo(activeIndex + 1);\n        break;\n      case 'Tab': {\n        e.preventDefault();\n        // If it is DateTimePicker, move focus to prev arrow element\n        if (prev && focusedElement === lastColumn) {\n          prev.focus();\n        } else if (focusedElement === lastColumn) {\n          firstColumn.focus();\n        } else {\n          const position = findIndex(restColumns, focusedElement);\n          restColumns[position + 1].focus();\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  }\n\n  moveTo(index, scrolling) {\n    const { options } = this.props;\n    const { selectedOption } = this.state;\n    const validIndex = validateIndex(index, options);\n    const option = options[validIndex];\n    const optionValue = this.getOptionValue(option);\n    if (selectedOption !== optionValue && option.disabled !== true) {\n      this.handleOptionSelect(optionValue, validIndex, scrolling);\n    }\n    // TO-DO: if date disabled, add nextValidOption selection\n  }\n\n  handleStepMoveUp() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex - arrowStep;\n    const nextPos = supposedPos >= 0 ? supposedPos : activeIndex - 1;\n\n    const nextValidOption = options.find((op) => !op.disabled);\n    this.moveTo(nextPos, true, nextValidOption);\n  }\n\n  handleStepMoveDown() {\n    const { activeIndex } = this.state;\n    const { arrowStep, options } = this.props;\n    const supposedPos = activeIndex + arrowStep;\n    const nextPos = supposedPos <= options.length ? supposedPos : activeIndex + 1;\n    this.moveTo(nextPos);\n  }\n\n  renderHeader() {\n    const { header } = this.props;\n\n    return <PickerHeader>{header}</PickerHeader>;\n  }\n\n  render() {\n    const { options, hasHeader, type, time, meridiem, disabledTimes } = this.props;\n    const { selectedOption, activeIndex, scrolling } = this.state;\n\n    const listYPosition = this.computeContainerTranslation(activeIndex);\n\n    return (\n      <Wrapper>\n        {hasHeader && this.renderHeader()}\n        <Container classProps={{ scrolling }} onKeyDown={this.handleKeyDown} tabIndex={0}>\n          <PickerSelectedOptionSelected innerRef={this.selectedOptionRef}>\n            <SelectedCircle />\n          </PickerSelectedOptionSelected>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Up\"\n              data-testid={`${type}-chevron-up`}\n              disabled={activeIndex <= 0}\n              icon={<ChevronSmallUp />}\n              onClick={this.handleStepMoveUp}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n          <PickerItemListContainer\n            innerRef={this.pickerListContainerRef}\n            style={{\n              height: this.listHeight,\n            }}\n          >\n            <PickerItemList\n              data-testid={`${type}-list`}\n              innerRef={this.pickerListRef}\n              style={{\n                transform: `translateY(${listYPosition}px)`,\n              }}\n            >\n              {options.map((option, index) => {\n                const value = this.getOptionValue(option);\n                const label = this.getOptionLabel(option);\n                let valueFormatted;\n                if (meridiem === 'AM') valueFormatted = value;\n                else if (meridiem === 'PM' && value === 12) valueFormatted = value;\n                else if (meridiem === 'PM') valueFormatted = value + 12;\n\n                let disabled = false;\n                if (disabledTimes) {\n                  const { from, to } = disabledTimes;\n                  if (\n                    (type === 'hour' && valueFormatted >= from?.hour && valueFormatted < to?.hour) ||\n                    (type === 'minutes' && value >= from?.min && value < to?.min)\n                  ) {\n                    disabled = true;\n                  }\n                  if (type === 'minutes' && (time?.hour() > to?.hour || time?.hour() < from?.hour)) {\n                    disabled = false;\n                  }\n                  if (label === 'am' && from?.hour == 0 && to?.hour >= 12) {\n                    disabled = true;\n                  }\n                  if (label === 'pm' && to?.hour == 24) {\n                    disabled = true;\n                  }\n                }\n\n                option.disabled = disabled;\n\n                return (\n                  <PickerItemContainer\n                    key={value}\n                    classProps={{\n                      selected: selectedOption ? value === selectedOption : index === 0,\n                      disabled,\n                    }}\n                    innerRef={this.pickerItemRef}\n                    onClick={() => {\n                      if (!disabled) this.handleOptionSelect(value, index);\n                    }}\n                  >\n                    {label}\n                  </PickerItemContainer>\n                );\n              })}\n            </PickerItemList>\n          </PickerItemListContainer>\n          <ArrowButtonContainer>\n            <DSButton\n              {...arrowProps}\n              aria-label=\"Chevron Down\"\n              data-testid={`${type}-chevron-down`}\n              disabled={activeIndex >= options.length - 1}\n              icon={<ChevronSmallDown />}\n              onClick={this.handleStepMoveDown}\n              tabIndex={-1}\n            />\n          </ArrowButtonContainer>\n        </Container>\n      </Wrapper>\n    );\n  }\n}\n\nPickerPanel.defaultProps = {\n  valueProperty: 'value',\n  labelProperty: 'label',\n  numberItemsOnScreen: 5, // this number should be impair\n  options: [],\n  arrowStep: 1,\n};\n\nexport { PickerPanel };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/TimePickerDropdown.js

@@ -2,8 +2,8 @@ import * as React from "react";
 import React2 from "react";
 import PropTypes from "prop-types";
 import { RecentDocuments } from "@elliemae/ds-icons";
-import { DSButton } from "@elliemae/ds-button";
-import { DSPopper } from "@elliemae/ds-popper";
+import DSButton from "@elliemae/ds-button";
+import DSPopper from "@elliemae/ds-popper";
 const TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => /* @__PURE__ */ React2.createElement(DSPopper, {
   blockName,
   placement,
@@ -39,7 +39,6 @@ TimePickerDropdown.propTypes = {
 };
 var TimePickerDropdown_default = TimePickerDropdown;
 export {
-  TimePickerDropdown,
   TimePickerDropdown_default as default
 };
 //# sourceMappingURL=TimePickerDropdown.js.map

package/dist/esm/TimePickerDropdown.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/TimePickerDropdown.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSPopper } from '@elliemae/ds-popper';\n\nconst TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => (\n  <DSPopper\n    blockName={blockName}\n    placement={placement}\n    contentComponent={menu}\n    isOpen={isOpen}\n    onOpen={onOpen}\n    modifiers={{\n      preventOverflow: {\n        enabled: true,\n        padding: 0,\n        boundariesElement: 'window',\n      },\n    }}\n    showArrow={false}\n    triggerComponent={\n      <DSButton buttonType=\"secondary\" disabled={disabled} icon={<RecentDocuments />} iconSize=\"s\" onClick={onClick} />\n    }\n    zIndex={zIndex}\n  />\n);\n\nTimePickerDropdown.propTypes = {\n  onClick: PropTypes.func,\n  onOpen: PropTypes.func,\n  disabled: PropTypes.bool,\n  isOpen: PropTypes.bool,\n  menu: PropTypes.element,\n  blockName: PropTypes.string,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n};\n\nexport { TimePickerDropdown };\nexport default TimePickerDropdown;\n"],
-  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,qBAAqB,CAAC,EAAE,WAAW,OAAO,SAAS,QAAQ,QAAQ,MAAM,QAAQ,WAAW,gBAChG,qCAAC,UAAD;AAAA,EACE;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,IACT,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,SAAS;AAAA,MACT,mBAAmB;AAAA;AAAA;AAAA,EAGvB,WAAW;AAAA,EACX,kBACE,qCAAC,UAAD;AAAA,IAAU,YAAW;AAAA,IAAY;AAAA,IAAoB,MAAM,qCAAC,iBAAD;AAAA,IAAqB,UAAS;AAAA,IAAI;AAAA;AAAA,EAE/F;AAAA;AAIJ,mBAAmB,YAAY;AAAA,EAC7B,SAAS,UAAU;AAAA,EACnB,QAAQ,UAAU;AAAA,EAClB,UAAU,UAAU;AAAA,EACpB,QAAQ,UAAU;AAAA,EAClB,MAAM,UAAU;AAAA,EAChB,WAAW,UAAU;AAAA,EACrB,WAAW,UAAU;AAAA,EACrB,QAAQ,UAAU;AAAA;AAIpB,IAAO,6BAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport DSPopper from '@elliemae/ds-popper';\n\nconst TimePickerDropdown = ({ disabled = false, onClick, onOpen, isOpen, menu, zIndex, blockName, placement }) => (\n  <DSPopper\n    blockName={blockName}\n    placement={placement}\n    contentComponent={menu}\n    isOpen={isOpen}\n    onOpen={onOpen}\n    modifiers={{\n      preventOverflow: {\n        enabled: true,\n        padding: 0,\n        boundariesElement: 'window',\n      },\n    }}\n    showArrow={false}\n    triggerComponent={\n      <DSButton buttonType=\"secondary\" disabled={disabled} icon={<RecentDocuments />} iconSize=\"s\" onClick={onClick} />\n    }\n    zIndex={zIndex}\n  />\n);\n\nTimePickerDropdown.propTypes = {\n  onClick: PropTypes.func,\n  onOpen: PropTypes.func,\n  disabled: PropTypes.bool,\n  isOpen: PropTypes.bool,\n  menu: PropTypes.element,\n  blockName: PropTypes.string,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n};\n\nexport default TimePickerDropdown;\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,qBAAqB,CAAC,EAAE,WAAW,OAAO,SAAS,QAAQ,QAAQ,MAAM,QAAQ,WAAW,gBAChG,qCAAC;AAAA,EACC;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,IACT,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,SAAS;AAAA,MACT,mBAAmB;AAAA,IACrB;AAAA,EACF;AAAA,EACA,WAAW;AAAA,EACX,kBACE,qCAAC;AAAA,IAAS,YAAW;AAAA,IAAY;AAAA,IAAoB,MAAM,qCAAC,qBAAgB;AAAA,IAAI,UAAS;AAAA,IAAI;AAAA,GAAkB;AAAA,EAEjH;AAAA,CACF;AAGF,mBAAmB,YAAY;AAAA,EAC7B,SAAS,UAAU;AAAA,EACnB,QAAQ,UAAU;AAAA,EAClB,UAAU,UAAU;AAAA,EACpB,QAAQ,UAAU;AAAA,EAClB,MAAM,UAAU;AAAA,EAChB,WAAW,UAAU;AAAA,EACrB,WAAW,UAAU;AAAA,EACrB,QAAQ,UAAU;AACpB;AAEA,IAAO,6BAAQ;",
   "names": []
 }

package/dist/esm/TimePickerImpl.js

@@ -34,8 +34,8 @@ import memoizeOne from "memoize-one";
 import { getVisibleTimeByFormat } from "@elliemae/ds-utilities";
 import { aggregatedClasses, convertPropToCssClassName } from "@elliemae/ds-classnames";
 import { DSInput, DSInputGroup, TimeInputImpl } from "@elliemae/ds-form";
-import { TimePickerMenu } from "./TimePickerMenu";
-import { TimePickerDropdown } from "./TimePickerDropdown";
+import TimePickerMenu from "./TimePickerMenu";
+import TimePickerDropdown from "./TimePickerDropdown";
 import { convertTimeString } from "./utils";
 const blockName = "time-picker";
 const TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({
@@ -177,7 +177,6 @@ TimePickerImpl.propTypes = {
 };
 var TimePickerImpl_default = TimePickerImpl;
 export {
-  TimePickerImpl,
   TimePickerImpl_default as default
 };
 //# sourceMappingURL=TimePickerImpl.js.map

package/dist/esm/TimePickerImpl.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/TimePickerImpl.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable no-shadow */\nimport React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport memoizeOne from 'memoize-one';\nimport { getVisibleTimeByFormat } from '@elliemae/ds-utilities';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSInput, DSInputGroup, TimeInputImpl } from '@elliemae/ds-form';\nimport { TimePickerMenu } from './TimePickerMenu';\nimport { TimePickerDropdown } from './TimePickerDropdown';\nimport { convertTimeString } from './utils';\n\nconst blockName = 'time-picker';\n\nconst TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({\n  isMenuOpened,\n}));\n\nconst TimePickerImpl = ({\n  value,\n  onChange,\n  onOpen,\n  format,\n  disabled,\n  hasHeader,\n  hasHeaderDisplay,\n  className,\n  containerProps,\n  placement,\n  zIndex,\n  disabledTimes,\n  minutesInterval,\n}) => {\n  const [time, setTime] = useState();\n  const [isMenuOpened, setIsMenuOpened] = useState(false);\n  const [focusedColumn, setFocusedColumn] = useState(null);\n  const timePickerRef = useRef();\n  useEffect(() => {\n    if (moment(value).isValid()) setTime(moment(value));\n    else if (value === null) setTime(undefined);\n  }, [value]);\n\n  useEffect(() => {\n    window.addEventListener('click', handleClickOutside, false);\n    return () => window.removeEventListener('click', handleClickOutside, false);\n  }, []);\n\n  useEffect(() => {\n    window.addEventListener('keydown', handleKeyDown, false);\n    return () => window.removeEventListener('keydown', handleKeyDown, false);\n  }, []);\n\n  useEffect(() => {\n    if (isMenuOpened) handleChangeFocus();\n  }, [isMenuOpened]);\n\n  const handleClickOutside = () => {\n    if (isMenuOpened) setIsMenuOpened(false);\n  };\n\n  const handleKeyDown = (event) => {\n    const { key } = event;\n    const menuOpenKeys = ['Escape', ' ', 'Enter'];\n    if (menuOpenKeys.includes(key)) setIsMenuOpened(false);\n  };\n\n  const handleChangeFocus = () => {\n    const [firstColumn] = document.getElementsByClassName('em-ds-time-picker-panel');\n    if (firstColumn && !focusedColumn) {\n      setFocusedColumn(firstColumn);\n      firstColumn.focus();\n    }\n  };\n\n  const handlePickerChange = (newTime) => {\n    setTime(moment(newTime));\n    onChange(moment(newTime));\n  };\n\n  const handleInputChange = (newTime) => {\n    setTime(newTime);\n    onChange(newTime);\n  };\n\n  const handleMenuOpen = (isOpen) => {\n    onOpen(isOpen);\n    setIsMenuOpened(isOpen);\n    if (!isOpen) setFocusedColumn(null);\n  };\n\n  const getVisibleTimePanels = memoizeOne((format) => getVisibleTimeByFormat(format));\n  const timePickerBlockName = convertPropToCssClassName(blockName);\n  const visiblePanels = getVisibleTimePanels(format);\n\n  const disabledTimeRange = disabledTimes && {\n    from: convertTimeString(disabledTimes.from),\n    to: convertTimeString(disabledTimes.to),\n  };\n\n  return (\n    <TimePickerContainer\n      className={`${className} variant-${!disabled ? 'default' : 'disabled'}`}\n      containerProps={containerProps}\n      disabled={disabled}\n      rightAddon={\n        <TimePickerDropdown\n          blockName={timePickerBlockName}\n          disabled={disabled}\n          isOpen={isMenuOpened}\n          zIndex={zIndex}\n          placement={placement}\n          onOpen={handleMenuOpen}\n          onClick={(e) => {\n            e.preventDefault();\n            handleMenuOpen(!isMenuOpened);\n          }}\n          menu={\n            <div ref={timePickerRef}>\n              <TimePickerMenu\n                disabled={disabled}\n                disabledTimes={disabledTimeRange}\n                format={format}\n                hasHeader={hasHeader}\n                hasHeaderDisplay={hasHeaderDisplay}\n                onTimeChange={handlePickerChange}\n                minutesInterval={minutesInterval}\n                time={time}\n                {...visiblePanels}\n              />\n            </div>\n          }\n        />\n      }\n    >\n      <DSInput\n        customInputType={({ onChange: handleChange, ...restInputProps }) => (\n          <TimeInputImpl clearable disabled={disabled} format={format} onChange={handleChange} {...restInputProps} />\n        )}\n        isShowElipsisActive={false}\n        disabled={disabled}\n        onChange={handleInputChange}\n        value={time}\n      />\n    </TimePickerContainer>\n  );\n};\n\nTimePickerImpl.propTypes = {\n  value: PropTypes.instanceOf(Date, moment),\n  onChange: PropTypes.func,\n  onOpen: PropTypes.func,\n  format: PropTypes.string,\n  disabled: PropTypes.bool,\n  hasHeader: PropTypes.bool,\n  hasHeaderDisplay: PropTypes.bool,\n  className: PropTypes.string,\n  containerProps: PropTypes.object,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n  disabledTimes: PropTypes.object,\n  minutesInterval: PropTypes.number,\n};\n\nexport { TimePickerImpl };\nexport default TimePickerImpl;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable no-shadow */\nimport React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport memoizeOne from 'memoize-one';\nimport { getVisibleTimeByFormat } from '@elliemae/ds-utilities';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSInput, DSInputGroup, TimeInputImpl } from '@elliemae/ds-form';\nimport TimePickerMenu from './TimePickerMenu';\nimport TimePickerDropdown from './TimePickerDropdown';\nimport { convertTimeString } from './utils';\n\nconst blockName = 'time-picker';\n\nconst TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({ isMenuOpened }) => ({\n  isMenuOpened,\n}));\n\nconst TimePickerImpl = ({\n  value,\n  onChange,\n  onOpen,\n  format,\n  disabled,\n  hasHeader,\n  hasHeaderDisplay,\n  className,\n  containerProps,\n  placement,\n  zIndex,\n  disabledTimes,\n  minutesInterval,\n}) => {\n  const [time, setTime] = useState();\n  const [isMenuOpened, setIsMenuOpened] = useState(false);\n  const [focusedColumn, setFocusedColumn] = useState(null);\n  const timePickerRef = useRef();\n  useEffect(() => {\n    if (moment(value).isValid()) setTime(moment(value));\n    else if (value === null) setTime(undefined);\n  }, [value]);\n\n  useEffect(() => {\n    window.addEventListener('click', handleClickOutside, false);\n    return () => window.removeEventListener('click', handleClickOutside, false);\n  }, []);\n\n  useEffect(() => {\n    window.addEventListener('keydown', handleKeyDown, false);\n    return () => window.removeEventListener('keydown', handleKeyDown, false);\n  }, []);\n\n  useEffect(() => {\n    if (isMenuOpened) handleChangeFocus();\n  }, [isMenuOpened]);\n\n  const handleClickOutside = () => {\n    if (isMenuOpened) setIsMenuOpened(false);\n  };\n\n  const handleKeyDown = (event) => {\n    const { key } = event;\n    const menuOpenKeys = ['Escape', ' ', 'Enter'];\n    if (menuOpenKeys.includes(key)) setIsMenuOpened(false);\n  };\n\n  const handleChangeFocus = () => {\n    const [firstColumn] = document.getElementsByClassName('em-ds-time-picker-panel');\n    if (firstColumn && !focusedColumn) {\n      setFocusedColumn(firstColumn);\n      firstColumn.focus();\n    }\n  };\n\n  const handlePickerChange = (newTime) => {\n    setTime(moment(newTime));\n    onChange(moment(newTime));\n  };\n\n  const handleInputChange = (newTime) => {\n    setTime(newTime);\n    onChange(newTime);\n  };\n\n  const handleMenuOpen = (isOpen) => {\n    onOpen(isOpen);\n    setIsMenuOpened(isOpen);\n    if (!isOpen) setFocusedColumn(null);\n  };\n\n  const getVisibleTimePanels = memoizeOne((format) => getVisibleTimeByFormat(format));\n  const timePickerBlockName = convertPropToCssClassName(blockName);\n  const visiblePanels = getVisibleTimePanels(format);\n\n  const disabledTimeRange = disabledTimes && {\n    from: convertTimeString(disabledTimes.from),\n    to: convertTimeString(disabledTimes.to),\n  };\n\n  return (\n    <TimePickerContainer\n      className={`${className} variant-${!disabled ? 'default' : 'disabled'}`}\n      containerProps={containerProps}\n      disabled={disabled}\n      rightAddon={\n        <TimePickerDropdown\n          blockName={timePickerBlockName}\n          disabled={disabled}\n          isOpen={isMenuOpened}\n          zIndex={zIndex}\n          placement={placement}\n          onOpen={handleMenuOpen}\n          onClick={(e) => {\n            e.preventDefault();\n            handleMenuOpen(!isMenuOpened);\n          }}\n          menu={\n            <div ref={timePickerRef}>\n              <TimePickerMenu\n                disabled={disabled}\n                disabledTimes={disabledTimeRange}\n                format={format}\n                hasHeader={hasHeader}\n                hasHeaderDisplay={hasHeaderDisplay}\n                onTimeChange={handlePickerChange}\n                minutesInterval={minutesInterval}\n                time={time}\n                {...visiblePanels}\n              />\n            </div>\n          }\n        />\n      }\n    >\n      <DSInput\n        customInputType={({ onChange: handleChange, ...restInputProps }) => (\n          <TimeInputImpl clearable disabled={disabled} format={format} onChange={handleChange} {...restInputProps} />\n        )}\n        isShowElipsisActive={false}\n        disabled={disabled}\n        onChange={handleInputChange}\n        value={time}\n      />\n    </TimePickerContainer>\n  );\n};\n\nTimePickerImpl.propTypes = {\n  value: PropTypes.instanceOf(Date, moment),\n  onChange: PropTypes.func,\n  onOpen: PropTypes.func,\n  format: PropTypes.string,\n  disabled: PropTypes.bool,\n  hasHeader: PropTypes.bool,\n  hasHeaderDisplay: PropTypes.bool,\n  className: PropTypes.string,\n  containerProps: PropTypes.object,\n  placement: PropTypes.string,\n  zIndex: PropTypes.number,\n  disabledTimes: PropTypes.object,\n  minutesInterval: PropTypes.number,\n};\n\nexport default TimePickerImpl;\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/TimePickerMenu.js

@@ -24,7 +24,7 @@ import { aggregatedClasses } from "@elliemae/ds-classnames";
 import moment from "moment";
 import { range, addLeadingZeros } from "@elliemae/ds-utilities";
 import { isAM } from "./utils";
-import { PickerPanel } from "./PickerPanel";
+import PickerPanel from "./PickerPanel";
 const blockName = "time-picker-menu";
 const TimePickerContainer = aggregatedClasses("div")(blockName);
 const TimePickerHeader = aggregatedClasses("div")(blockName, "header");
@@ -43,6 +43,16 @@ class TimePickerMenu extends Component {
     this.state = {
       time: moment(props.time || "", props.format) || moment()
     };
+    this.handleMinuteChange = this.handleMinuteChange.bind(this);
+    this.handleHoursChange = this.handleHoursChange.bind(this);
+    this.handleSecondsChange = this.handleSecondsChange.bind(this);
+    this.handleAMPMChange = this.handleAMPMChange.bind(this);
+    this.updateTime = this.updateTime.bind(this);
+    this.renderHoursPanel = this.renderHoursPanel.bind(this);
+    this.renderMinutesPanel = this.renderMinutesPanel.bind(this);
+    this.renderSecondsPanel = this.renderSecondsPanel.bind(this);
+    this.renderAMPMPanel = this.renderAMPMPanel.bind(this);
+    this.renderHeader = this.renderHeader.bind(this);
   }
   static getDerivedStateFromProps(props, state) {
     if (props.time) {

package/dist/esm/TimePickerMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/TimePickerMenu.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable react/prop-types */\nimport React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport { range, addLeadingZeros } from '@elliemae/ds-utilities';\nimport { isAM } from './utils';\nimport { PickerPanel } from './PickerPanel';\n\nconst blockName = 'time-picker-menu';\n\nconst TimePickerContainer = aggregatedClasses('div')(blockName);\nconst TimePickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');\n\nconst generateOption = (format) => (option) => ({\n  value: option,\n  label: typeof format === 'function' ? format(option) : option,\n});\n\nclass TimePickerMenu extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      time: moment(props.time || '', props.format) || moment(),\n    };\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (props.time) {\n      return { ...state, time: moment(props.time) };\n    }\n    return { ...state, time: undefined };\n  }\n\n  componentDidMount() {\n    const { time } = this.state;\n    this.setState({ time });\n  }\n\n  handleMinuteChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.minute(value));\n  }\n\n  handleHoursChange(value) {\n    const { time } = this.state;\n    const { use12Hours } = this.props;\n    let nextHour = value;\n    if (use12Hours) {\n      if (!isAM(time)) {\n        nextHour = (value % 12) + 12;\n      }\n    }\n    this.updateTime(time.hour(nextHour));\n  }\n\n  handleSecondsChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.second(value));\n  }\n\n  handleAMPMChange(value) {\n    const { time } = this.state;\n    const hour = time.hour();\n    const nextHour = value.toLowerCase() === 'am' ? hour % 12 : (hour % 12) + 12;\n    this.updateTime(time.hour(nextHour));\n  }\n\n  updateTime(time) {\n    const { onTimeChange } = this.props;\n    onTimeChange(time);\n    this.setState({ time });\n  }\n\n  renderHoursPanel() {\n    const { time } = this.state;\n    const { showHours, use12Hours, format, hasHeader, disabledTimes } = this.props;\n    if (!showHours) return null;\n\n    const hour = time.hour(); // in 24 format\n    let selectedHour = use12Hours ? hour % 12 || 12 : hour;\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (hour > from.hour && hour < to.hour) {\n        if (to.hour < 24) {\n          const toFormatted = to.hour % 12 || 12;\n          if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);\n          selectedHour = toFormatted;\n        } else if (from) {\n          selectedHour = (from.hour - 1) % 12 || 12;\n        }\n      }\n    }\n\n    const meridiem = hour >= 12 ? 'PM' : 'AM';\n    const withLeadingZeros = format.indexOf('hh') > -1;\n    const rangeHours = use12Hours ? range(1, 13) : range(24);\n    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"hour\"\n        time={time}\n        meridiem={meridiem}\n        hasHeader={hasHeader}\n        header=\"H\"\n        onChange={this.handleHoursChange}\n        options={hoursOptions}\n        selected={selectedHour}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderMinutesPanel() {\n    const { time } = this.state;\n    const { showMinutes, format, hasHeader, disabledTimes, minutesInterval } = this.props;\n    if (!showMinutes) return null;\n    const withLeadingZeros = format.indexOf('mm') > -1;\n    const rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n\n    let selectedMinute = time.minute();\n    const selectedHour = time.hour();\n\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (selectedHour <= to.hour && selectedHour > from.hour) {\n        if (to) {\n          if (selectedMinute < to.min) this.handleMinuteChange(to.min);\n        } else if (from) {\n          if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);\n        }\n      } else {\n        selectedMinute = time.minute();\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"minutes\"\n        time={time}\n        hasHeader={hasHeader}\n        header=\"M\"\n        onChange={this.handleMinuteChange}\n        options={rangeMinutes}\n        selected={selectedMinute}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderSecondsPanel() {\n    const { time } = this.state;\n    const { showSeconds, format, hasHeader } = this.props;\n    if (!showSeconds) return null;\n    const withLeadingZeros = format.indexOf('ss') > -1;\n    const rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"seconds\"\n        hasHeader={hasHeader}\n        header=\"S\"\n        onChange={this.handleSecondsChange}\n        options={rangeSeconds}\n        selected={time.second()}\n      />\n    );\n  }\n\n  renderAMPMPanel() {\n    const { time } = this.state;\n    const { use12Hours, hasHeader, disabledTimes } = this.props;\n    if (!use12Hours) return null;\n\n    let meridiemSelected = !isAM(time) ? 'pm' : 'am';\n    if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {\n      meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';\n      if (meridiemSelected === 'am' && time.hour() > 12) {\n        this.handleAMPMChange('am');\n      }\n\n      if (meridiemSelected === 'pm' && time.hour() <= 12) {\n        this.handleAMPMChange('pm');\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"meridiem\"\n        hasHeader={hasHeader}\n        header=\"\"\n        onChange={this.handleAMPMChange}\n        options={[\n          { value: 'am', label: 'am' },\n          { value: 'pm', label: 'pm' },\n        ]}\n        selected={meridiemSelected}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderHeader = () => {\n    const { time } = this.state;\n    return <TimePickerHeader>{time.format('hh:mma')}</TimePickerHeader>;\n  };\n\n  render() {\n    const { hasHeaderDisplay } = this.props;\n\n    return (\n      <TimePickerContainer>\n        {hasHeaderDisplay && this.renderHeader()}\n        <TimePickerPanelContainer>\n          {this.renderHoursPanel()}\n          {this.renderMinutesPanel()}\n          {this.renderSecondsPanel()}\n          {this.renderAMPMPanel()}\n        </TimePickerPanelContainer>\n      </TimePickerContainer>\n    );\n  }\n}\n\nTimePickerMenu.defaultProps = {\n  time: moment(),\n  hasHeader: false,\n  use12Hours: true,\n  showSeconds: true,\n  showMinutes: true,\n  showHours: true,\n  disabledTimes: undefined,\n  onTimeChange: () => null,\n};\n\nTimePickerMenu.propTypes = {\n  /** Time value */\n  time: PropTypes.instanceOf(moment),\n  /** If the menu has header or not */\n  hasHeader: PropTypes.bool,\n  /** Whether to use the 12 hours format */\n  use12Hours: PropTypes.bool,\n  /** Whether show 'seconds' or not */\n  showSeconds: PropTypes.bool,\n  /** Whether show 'minutes' or not */\n  showMinutes: PropTypes.bool,\n  /** Whether show 'hours' or not */\n  showHours: PropTypes.bool,\n  /** Handler when time changes */\n  onTimeChange: PropTypes.func,\n  disabledTimes: PropTypes.object,\n};\n\nexport { TimePickerMenu };\nexport default TimePickerMenu;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable react/prop-types */\nimport React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport { range, addLeadingZeros } from '@elliemae/ds-utilities';\nimport { isAM } from './utils';\nimport PickerPanel from './PickerPanel';\n\nconst blockName = 'time-picker-menu';\n\nconst TimePickerContainer = aggregatedClasses('div')(blockName);\nconst TimePickerHeader = aggregatedClasses('div')(blockName, 'header');\nconst TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');\n\nconst generateOption = (format) => (option) => ({\n  value: option,\n  label: typeof format === 'function' ? format(option) : option,\n});\n\nclass TimePickerMenu extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      time: moment(props.time || '', props.format) || moment(),\n    };\n\n    this.handleMinuteChange = this.handleMinuteChange.bind(this);\n    this.handleHoursChange = this.handleHoursChange.bind(this);\n    this.handleSecondsChange = this.handleSecondsChange.bind(this);\n    this.handleAMPMChange = this.handleAMPMChange.bind(this);\n    this.updateTime = this.updateTime.bind(this);\n    this.renderHoursPanel = this.renderHoursPanel.bind(this);\n    this.renderMinutesPanel = this.renderMinutesPanel.bind(this);\n    this.renderSecondsPanel = this.renderSecondsPanel.bind(this);\n    this.renderAMPMPanel = this.renderAMPMPanel.bind(this);\n    this.renderHeader = this.renderHeader.bind(this);\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (props.time) {\n      return { ...state, time: moment(props.time) };\n    }\n    return { ...state, time: undefined };\n  }\n\n  componentDidMount() {\n    const { time } = this.state;\n    this.setState({ time });\n  }\n\n  handleMinuteChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.minute(value));\n  }\n\n  handleHoursChange(value) {\n    const { time } = this.state;\n    const { use12Hours } = this.props;\n    let nextHour = value;\n    if (use12Hours) {\n      if (!isAM(time)) {\n        nextHour = (value % 12) + 12;\n      }\n    }\n    this.updateTime(time.hour(nextHour));\n  }\n\n  handleSecondsChange(value) {\n    const { time } = this.state;\n    this.updateTime(time.second(value));\n  }\n\n  handleAMPMChange(value) {\n    const { time } = this.state;\n    const hour = time.hour();\n    const nextHour = value.toLowerCase() === 'am' ? hour % 12 : (hour % 12) + 12;\n    this.updateTime(time.hour(nextHour));\n  }\n\n  updateTime(time) {\n    const { onTimeChange } = this.props;\n    onTimeChange(time);\n    this.setState({ time });\n  }\n\n  renderHoursPanel() {\n    const { time } = this.state;\n    const { showHours, use12Hours, format, hasHeader, disabledTimes } = this.props;\n    if (!showHours) return null;\n\n    const hour = time.hour(); // in 24 format\n    let selectedHour = use12Hours ? hour % 12 || 12 : hour;\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (hour > from.hour && hour < to.hour) {\n        if (to.hour < 24) {\n          const toFormatted = to.hour % 12 || 12;\n          if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);\n          selectedHour = toFormatted;\n        } else if (from) {\n          selectedHour = (from.hour - 1) % 12 || 12;\n        }\n      }\n    }\n\n    const meridiem = hour >= 12 ? 'PM' : 'AM';\n    const withLeadingZeros = format.indexOf('hh') > -1;\n    const rangeHours = use12Hours ? range(1, 13) : range(24);\n    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"hour\"\n        time={time}\n        meridiem={meridiem}\n        hasHeader={hasHeader}\n        header=\"H\"\n        onChange={this.handleHoursChange}\n        options={hoursOptions}\n        selected={selectedHour}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderMinutesPanel() {\n    const { time } = this.state;\n    const { showMinutes, format, hasHeader, disabledTimes, minutesInterval } = this.props;\n    if (!showMinutes) return null;\n    const withLeadingZeros = format.indexOf('mm') > -1;\n    const rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n\n    let selectedMinute = time.minute();\n    const selectedHour = time.hour();\n\n    if (disabledTimes) {\n      const { from, to } = disabledTimes;\n      if (selectedHour <= to.hour && selectedHour > from.hour) {\n        if (to) {\n          if (selectedMinute < to.min) this.handleMinuteChange(to.min);\n        } else if (from) {\n          if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);\n        }\n      } else {\n        selectedMinute = time.minute();\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"minutes\"\n        time={time}\n        hasHeader={hasHeader}\n        header=\"M\"\n        onChange={this.handleMinuteChange}\n        options={rangeMinutes}\n        selected={selectedMinute}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderSecondsPanel() {\n    const { time } = this.state;\n    const { showSeconds, format, hasHeader } = this.props;\n    if (!showSeconds) return null;\n    const withLeadingZeros = format.indexOf('ss') > -1;\n    const rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));\n    return (\n      <PickerPanel\n        type=\"seconds\"\n        hasHeader={hasHeader}\n        header=\"S\"\n        onChange={this.handleSecondsChange}\n        options={rangeSeconds}\n        selected={time.second()}\n      />\n    );\n  }\n\n  renderAMPMPanel() {\n    const { time } = this.state;\n    const { use12Hours, hasHeader, disabledTimes } = this.props;\n    if (!use12Hours) return null;\n\n    let meridiemSelected = !isAM(time) ? 'pm' : 'am';\n    if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {\n      meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';\n      if (meridiemSelected === 'am' && time.hour() > 12) {\n        this.handleAMPMChange('am');\n      }\n\n      if (meridiemSelected === 'pm' && time.hour() <= 12) {\n        this.handleAMPMChange('pm');\n      }\n    }\n\n    return (\n      <PickerPanel\n        type=\"meridiem\"\n        hasHeader={hasHeader}\n        header=\"\"\n        onChange={this.handleAMPMChange}\n        options={[\n          { value: 'am', label: 'am' },\n          { value: 'pm', label: 'pm' },\n        ]}\n        selected={meridiemSelected}\n        disabledTimes={disabledTimes}\n      />\n    );\n  }\n\n  renderHeader = () => {\n    const { time } = this.state;\n    return <TimePickerHeader>{time.format('hh:mma')}</TimePickerHeader>;\n  };\n\n  render() {\n    const { hasHeaderDisplay } = this.props;\n\n    return (\n      <TimePickerContainer>\n        {hasHeaderDisplay && this.renderHeader()}\n        <TimePickerPanelContainer>\n          {this.renderHoursPanel()}\n          {this.renderMinutesPanel()}\n          {this.renderSecondsPanel()}\n          {this.renderAMPMPanel()}\n        </TimePickerPanelContainer>\n      </TimePickerContainer>\n    );\n  }\n}\n\nTimePickerMenu.defaultProps = {\n  time: moment(),\n  hasHeader: false,\n  use12Hours: true,\n  showSeconds: true,\n  showMinutes: true,\n  showHours: true,\n  disabledTimes: undefined,\n  onTimeChange: () => null,\n};\n\nTimePickerMenu.propTypes = {\n  /** Time value */\n  time: PropTypes.instanceOf(moment),\n  /** If the menu has header or not */\n  hasHeader: PropTypes.bool,\n  /** Whether to use the 12 hours format */\n  use12Hours: PropTypes.bool,\n  /** Whether show 'seconds' or not */\n  showSeconds: PropTypes.bool,\n  /** Whether show 'minutes' or not */\n  showMinutes: PropTypes.bool,\n  /** Whether show 'hours' or not */\n  showHours: PropTypes.bool,\n  /** Handler when time changes */\n  onTimeChange: PropTypes.func,\n  disabledTimes: PropTypes.object,\n};\n\nexport { TimePickerMenu };\nexport default TimePickerMenu;\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/moveElementOnScroll.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/moveElementOnScroll.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export function MoveElementOnScroll(\n  element,\n  {\n    container,\n    min = 0,\n    max = element.offsetHeight,\n    speed = 1,\n    smooth = 2,\n    onUpdate = () => null,\n    onEndScroll = () => null,\n  },\n) {\n  let moving = false;\n  let pos = min;\n  let lastPos = pos;\n\n  // todo: move this to utils if we finally need it\n  const requestFrame = (function() {\n    return (\n      window.requestAnimationFrame ||\n      window.webkitRequestAnimationFrame ||\n      window.mozRequestAnimationFrame ||\n      window.oRequestAnimationFrame ||\n      window.msRequestAnimationFrame ||\n      function(func) {\n        window.setTimeout(func, 1000 / 50);\n      }\n    );\n  })();\n\n  function update() {\n    moving = true;\n    const delta = (pos - lastPos) / smooth;\n    lastPos += delta;\n\n    if (Math.abs(delta) > 0.7) {\n      requestFrame(() => {\n        onUpdate(lastPos, delta);\n        update();\n      });\n    } else {\n      onEndScroll(pos);\n      moving = false;\n    }\n  }\n\n  function scrolling(e) {\n    e.preventDefault(); // disable default scrolling\n    let delta = e.delta || e.wheelDelta;\n    if (delta === undefined) {\n      // for firefox\n      delta = -e.detail;\n      delta *= 10 * speed;\n    }\n\n    pos += -delta * speed;\n    pos = Math.max(min, Math.min(pos, max)); // limit scrolling\n    if (!moving) {\n      update();\n    }\n  }\n\n  container.addEventListener('mousewheel', scrolling, false);\n  container.addEventListener('DOMMouseScroll', scrolling, false);\n\n  return {\n    unsubscribe: () => {\n      container.removeEventListener('mousewheel', scrolling);\n      container.removeEventListener('DOMMouseScroll', scrolling);\n    },\n    updatePosition: newPos => {\n      pos = -newPos;\n      lastPos = -pos;\n    },\n  };\n}\n\nexport default MoveElementOnScroll;\n"],
-  "mappings": "AAAA;ACAO,6BACL,SACA;AAAA,EACE;AAAA,EACA,MAAM;AAAA,EACN,MAAM,QAAQ;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAW,MAAM;AAAA,EACjB,cAAc,MAAM;AAAA,GAEtB;AACA,MAAI,SAAS;AACb,MAAI,MAAM;AACV,MAAI,UAAU;AAGd,QAAM,eAAgB,WAAW;AAC/B,WACE,OAAO,yBACP,OAAO,+BACP,OAAO,4BACP,OAAO,0BACP,OAAO,2BACP,SAAS,MAAM;AACb,aAAO,WAAW,MAAM,MAAO;AAAA;AAAA;AAKrC,oBAAkB;AAChB,aAAS;AACT,UAAM,QAAS,OAAM,WAAW;AAChC,eAAW;AAEX,QAAI,KAAK,IAAI,SAAS,KAAK;AACzB,mBAAa,MAAM;AACjB,iBAAS,SAAS;AAClB;AAAA;AAAA,WAEG;AACL,kBAAY;AACZ,eAAS;AAAA;AAAA;AAIb,qBAAmB,GAAG;AACpB,MAAE;AACF,QAAI,QAAQ,EAAE,SAAS,EAAE;AACzB,QAAI,UAAU,QAAW;AAEvB,cAAQ,CAAC,EAAE;AACX,eAAS,KAAK;AAAA;AAGhB,WAAO,CAAC,QAAQ;AAChB,UAAM,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK;AAClC,QAAI,CAAC,QAAQ;AACX;AAAA;AAAA;AAIJ,YAAU,iBAAiB,cAAc,WAAW;AACpD,YAAU,iBAAiB,kBAAkB,WAAW;AAExD,SAAO;AAAA,IACL,aAAa,MAAM;AACjB,gBAAU,oBAAoB,cAAc;AAC5C,gBAAU,oBAAoB,kBAAkB;AAAA;AAAA,IAElD,gBAAgB,YAAU;AACxB,YAAM,CAAC;AACP,gBAAU,CAAC;AAAA;AAAA;AAAA;AAKjB,IAAO,8BAAQ;",
+  "mappings": "AAAA;ACAO,6BACL,SACA;AAAA,EACE;AAAA,EACA,MAAM;AAAA,EACN,MAAM,QAAQ;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAW,MAAM;AAAA,EACjB,cAAc,MAAM;AAAA,GAEtB;AACA,MAAI,SAAS;AACb,MAAI,MAAM;AACV,MAAI,UAAU;AAGd,QAAM,eAAgB,WAAW;AAC/B,WACE,OAAO,yBACP,OAAO,+BACP,OAAO,4BACP,OAAO,0BACP,OAAO,2BACP,SAAS,MAAM;AACb,aAAO,WAAW,MAAM,MAAO,EAAE;AAAA,IACnC;AAAA,EAEJ,EAAG;AAEH,oBAAkB;AAChB,aAAS;AACT,UAAM,QAAS,OAAM,WAAW;AAChC,eAAW;AAEX,QAAI,KAAK,IAAI,KAAK,IAAI,KAAK;AACzB,mBAAa,MAAM;AACjB,iBAAS,SAAS,KAAK;AACvB,eAAO;AAAA,MACT,CAAC;AAAA,IACH,OAAO;AACL,kBAAY,GAAG;AACf,eAAS;AAAA,IACX;AAAA,EACF;AAEA,qBAAmB,GAAG;AACpB,MAAE,eAAe;AACjB,QAAI,QAAQ,EAAE,SAAS,EAAE;AACzB,QAAI,UAAU,QAAW;AAEvB,cAAQ,CAAC,EAAE;AACX,eAAS,KAAK;AAAA,IAChB;AAEA,WAAO,CAAC,QAAQ;AAChB,UAAM,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,GAAG,CAAC;AACtC,QAAI,CAAC,QAAQ;AACX,aAAO;AAAA,IACT;AAAA,EACF;AAEA,YAAU,iBAAiB,cAAc,WAAW,KAAK;AACzD,YAAU,iBAAiB,kBAAkB,WAAW,KAAK;AAE7D,SAAO;AAAA,IACL,aAAa,MAAM;AACjB,gBAAU,oBAAoB,cAAc,SAAS;AACrD,gBAAU,oBAAoB,kBAAkB,SAAS;AAAA,IAC3D;AAAA,IACA,gBAAgB,YAAU;AACxB,YAAM,CAAC;AACP,gBAAU,CAAC;AAAA,IACb;AAAA,EACF;AACF;AAEA,IAAO,8BAAQ;",
   "names": []
 }

package/dist/esm/utils.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/utils.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const validateIndex = (index, options) => {\n  if (index < 0) return 0;\n  if (index >= options.length) return options.length - 1;\n  return index;\n};\n\nexport const getOptionIndex = (\n  options,\n  selectedOption,\n  valueProperty = 'value',\n) => {\n  const index = options.findIndex(\n    (option) => option[valueProperty] === selectedOption,\n  );\n  return validateIndex(index, options);\n};\n\nexport const isAM = (time) => time && time.hour() < 12;\n\nexport const convertTimeString = (string) => {\n  if (!string) return null;\n  let meridiem = 'AM';\n  if (string.toUpperCase().includes('PM')) meridiem = 'PM';\n\n  const arr = string.split(':');\n  let hour = parseInt(arr[0], 10);\n  if (meridiem === 'PM' && hour !== 12) hour += 12; // formats to 24\n  if (meridiem === 'AM' && hour === 12) hour = 0;\n  if (meridiem === 'PM' && hour === 12) hour = 12;\n\n  const min = parseInt(arr[1], 10);\n  const sec = parseInt(arr[2], 10);\n\n  return {\n    hour,\n    min,\n    sec,\n  };\n};\n"],
-  "mappings": "AAAA;ACAO,MAAM,gBAAgB,CAAC,OAAO,YAAY;AAC/C,MAAI,QAAQ;AAAG,WAAO;AACtB,MAAI,SAAS,QAAQ;AAAQ,WAAO,QAAQ,SAAS;AACrD,SAAO;AAAA;AAGF,MAAM,iBAAiB,CAC5B,SACA,gBACA,gBAAgB,YACb;AACH,QAAM,QAAQ,QAAQ,UACpB,CAAC,WAAW,OAAO,mBAAmB;AAExC,SAAO,cAAc,OAAO;AAAA;AAGvB,MAAM,OAAO,CAAC,SAAS,QAAQ,KAAK,SAAS;AAE7C,MAAM,oBAAoB,CAAC,WAAW;AAC3C,MAAI,CAAC;AAAQ,WAAO;AACpB,MAAI,WAAW;AACf,MAAI,OAAO,cAAc,SAAS;AAAO,eAAW;AAEpD,QAAM,MAAM,OAAO,MAAM;AACzB,MAAI,OAAO,SAAS,IAAI,IAAI;AAC5B,MAAI,aAAa,QAAQ,SAAS;AAAI,YAAQ;AAC9C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAC7C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAE7C,QAAM,MAAM,SAAS,IAAI,IAAI;AAC7B,QAAM,MAAM,SAAS,IAAI,IAAI;AAE7B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA;AAAA;",
+  "mappings": "AAAA;ACAO,MAAM,gBAAgB,CAAC,OAAO,YAAY;AAC/C,MAAI,QAAQ;AAAG,WAAO;AACtB,MAAI,SAAS,QAAQ;AAAQ,WAAO,QAAQ,SAAS;AACrD,SAAO;AACT;AAEO,MAAM,iBAAiB,CAC5B,SACA,gBACA,gBAAgB,YACb;AACH,QAAM,QAAQ,QAAQ,UACpB,CAAC,WAAW,OAAO,mBAAmB,cACxC;AACA,SAAO,cAAc,OAAO,OAAO;AACrC;AAEO,MAAM,OAAO,CAAC,SAAS,QAAQ,KAAK,KAAK,IAAI;AAE7C,MAAM,oBAAoB,CAAC,WAAW;AAC3C,MAAI,CAAC;AAAQ,WAAO;AACpB,MAAI,WAAW;AACf,MAAI,OAAO,YAAY,EAAE,SAAS,IAAI;AAAG,eAAW;AAEpD,QAAM,MAAM,OAAO,MAAM,GAAG;AAC5B,MAAI,OAAO,SAAS,IAAI,IAAI,EAAE;AAC9B,MAAI,aAAa,QAAQ,SAAS;AAAI,YAAQ;AAC9C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAC7C,MAAI,aAAa,QAAQ,SAAS;AAAI,WAAO;AAE7C,QAAM,MAAM,SAAS,IAAI,IAAI,EAAE;AAC/B,QAAM,MAAM,SAAS,IAAI,IAAI,EAAE;AAE/B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-time-picker",
-  "version": "3.0.0-next.4",
+  "version": "3.0.0-next.43",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Time Picker",
   "files": [
@@ -67,15 +67,15 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-button": "3.0.0-next.4",
-    "@elliemae/ds-classnames": "3.0.0-next.4",
-    "@elliemae/ds-form": "3.0.0-next.4",
-    "@elliemae/ds-icons": "3.0.0-next.4",
-    "@elliemae/ds-popper": "3.0.0-next.4",
-    "@elliemae/ds-utilities": "3.0.0-next.4",
+    "@elliemae/ds-button": "3.0.0-next.43",
+    "@elliemae/ds-classnames": "3.0.0-next.43",
+    "@elliemae/ds-form": "3.0.0-next.43",
+    "@elliemae/ds-icons": "3.0.0-next.43",
+    "@elliemae/ds-popper": "3.0.0-next.43",
+    "@elliemae/ds-utilities": "3.0.0-next.43",
     "memoize-one": "~5.1.1",
     "moment": "~2.29.1",
-    "prop-types": "~15.7.2",
+    "prop-types": "~15.8.1",
     "react-desc": "~4.1.3"
   },
   "devDependencies": {