@deephaven/components 1.4.1-beta.0 → 1.4.1-react19.43

package/dist/CopyButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyButton.js","names":["React","vsPassFilled","vsCopy","useCopyToClipboard","Button","jsx","_jsx","CopyButton","_ref","copy","kind","tooltip","className","style","dataTestId","children","copied","copyToClipboard","icon","onClick"],"sources":["../src/CopyButton.tsx"],"sourcesContent":["import React from 'react';\nimport { vsPassFilled, vsCopy } from '@deephaven/icons';\nimport { useCopyToClipboard } from '@deephaven/react-hooks';\nimport Button, { type ButtonKind } from './Button';\n\ntype CopyButtonProps = {\n  /** The value to copy when clicked, accepts string or function returning a string. */\n  copy: string | (() => string);\n  /** The kind of button */\n  kind?: ButtonKind;\n  /** Optional tooltip label ex. 'Copy column name' */\n  tooltip?: string;\n  /** Optional extra classname */\n  className?: string;\n  /** Optional extra styles */\n  style?: React.CSSProperties;\n  /** Optional extra testid */\n  'data-testid'?: string;\n  /** Optional button children */\n  children?: React.ReactNode;\n};\n\n/**\n * Button that has a copy icon, and copies text to a clipboard when clicked.\n */\nfunction CopyButton({\n  copy,\n  kind = 'ghost',\n  tooltip = 'Copy',\n  className,\n  style,\n  'data-testid': dataTestId,\n  children,\n}: CopyButtonProps): JSX.Element {\n  const [copied, copyToClipboard] = useCopyToClipboard();\n  return (\n    <Button\n      kind={kind}\n      className={className}\n      style={style}\n      data-testid={dataTestId}\n      icon={copied ? vsPassFilled : vsCopy}\n      tooltip={copied ? 'Copied' : tooltip}\n      onClick={() => {\n        copyToClipboard(typeof copy === 'function' ? copy() : copy);\n      }}\n    >\n      {children}\n    </Button>\n  );\n}\n\nexport default CopyButton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,EAAEC,MAAM,QAAQ,kBAAkB;AACvD,SAASC,kBAAkB,QAAQ,wBAAwB;AAAC,OACrDC,MAAM;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAmBb;AACA;AACA;AACA,SAASC,UAAUA,CAAAC,IAAA,EAQc;EAAA,IARb;IAClBC,IAAI;IACJC,IAAI,GAAG,OAAO;IACdC,OAAO,GAAG,MAAM;IAChBC,SAAS;IACTC,KAAK;IACL,aAAa,EAAEC,UAAU;IACzBC;EACe,CAAC,GAAAP,IAAA;EAChB,IAAM,CAACQ,MAAM,EAAEC,eAAe,CAAC,GAAGd,kBAAkB,CAAC,CAAC;EACtD,oBACEG,IAAA,CAACF,MAAM;IACLM,IAAI,EAAEA,IAAK;IACXE,SAAS,EAAEA,SAAU;IACrBC,KAAK,EAAEA,KAAM;IACb,eAAaC,UAAW;IACxBI,IAAI,EAAEF,MAAM,GAAGf,YAAY,GAAGC,MAAO;IACrCS,OAAO,EAAEK,MAAM,GAAG,QAAQ,GAAGL,OAAQ;IACrCQ,OAAO,EAAEA,CAAA,KAAM;MACbF,eAAe,CAAC,OAAOR,IAAI,KAAK,UAAU,GAAGA,IAAI,CAAC,CAAC,GAAGA,IAAI,CAAC;IAC7D,CAAE;IAAAM,QAAA,EAEDA;EAAQ,CACH,CAAC;AAEb;AAEA,eAAeR,UAAU"}
+{"version":3,"file":"CopyButton.js","names":["React","vsPassFilled","vsCopy","useCopyToClipboard","Button","jsx","_jsx","CopyButton","_ref","copy","kind","tooltip","className","style","dataTestId","children","copied","copyToClipboard","icon","onClick"],"sources":["../src/CopyButton.tsx"],"sourcesContent":["import React from 'react';\nimport { vsPassFilled, vsCopy } from '@deephaven/icons';\nimport { useCopyToClipboard } from '@deephaven/react-hooks';\nimport Button, { type ButtonKind } from './Button';\n\ntype CopyButtonProps = {\n  /** The value to copy when clicked, accepts string or function returning a string. */\n  copy: string | (() => string);\n  /** The kind of button */\n  kind?: ButtonKind;\n  /** Optional tooltip label ex. 'Copy column name' */\n  tooltip?: string;\n  /** Optional extra classname */\n  className?: string;\n  /** Optional extra styles */\n  style?: React.CSSProperties;\n  /** Optional extra testid */\n  'data-testid'?: string;\n  /** Optional button children */\n  children?: React.ReactNode;\n};\n\n/**\n * Button that has a copy icon, and copies text to a clipboard when clicked.\n */\nfunction CopyButton({\n  copy,\n  kind = 'ghost',\n  tooltip = 'Copy',\n  className,\n  style,\n  'data-testid': dataTestId,\n  children,\n}: CopyButtonProps): JSX.Element {\n  const [copied, copyToClipboard] = useCopyToClipboard();\n  return (\n    <Button\n      kind={kind}\n      className={className}\n      style={style}\n      data-testid={dataTestId}\n      icon={copied ? vsPassFilled : vsCopy}\n      tooltip={copied ? 'Copied' : tooltip}\n      onClick={() => {\n        copyToClipboard(typeof copy === 'function' ? copy() : copy);\n      }}\n    >\n      {children}\n    </Button>\n  );\n}\n\nexport default CopyButton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,EAAEC,MAAM,QAAQ,kBAAkB;AACvD,SAASC,kBAAkB,QAAQ,wBAAwB;AAAC,OACrDC,MAAM;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAmBb;AACA;AACA;AACA,SAASC,UAAUA,CAAAC,IAAA,EAQc;EAAA,IARb;IAClBC,IAAI;IACJC,IAAI,GAAG,OAAO;IACdC,OAAO,GAAG,MAAM;IAChBC,SAAS;IACTC,KAAK;IACL,aAAa,EAAEC,UAAU;IACzBC;EACe,CAAC,GAAAP,IAAA;EAChB,IAAM,CAACQ,MAAM,EAAEC,eAAe,CAAC,GAAGd,kBAAkB,CAAC,CAAC;EACtD,oBACEG,IAAA,CAACF,MAAM;IACLM,IAAI,EAAEA,IAAK;IACXE,SAAS,EAAEA,SAAU;IACrBC,KAAK,EAAEA,KAAM;IACb,eAAaC,UAAW;IACxBI,IAAI,EAAEF,MAAM,GAAGf,YAAY,GAAGC,MAAO;IACrCS,OAAO,EAAEK,MAAM,GAAG,QAAQ,GAAGL,OAAQ;IACrCQ,OAAO,EAAEA,CAAA,KAAM;MACbF,eAAe,CAAC,OAAOR,IAAI,KAAK,UAAU,GAAGA,IAAI,CAAC,CAAC,GAAGA,IAAI,CAAC;IAC7D,CAAE;IAAAM,QAAA,EAEDA;EAAQ,CACH,CAAC;AAEb;AAEA,eAAeR,UAAU","ignoreList":[]}

package/dist/CustomTimeSelect.js

@@ -11,14 +11,13 @@ import classNames from 'classnames';
 import TimeInput from "./TimeInput.js";
 import DropdownMenu from "./menu-actions/DropdownMenu.js";
 import "./CustomTimeSelect.css";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var CUSTOM_OPTION = -1;
-var MENU_NAVIGATION_DIRECTION;
-(function (MENU_NAVIGATION_DIRECTION) {
+var MENU_NAVIGATION_DIRECTION = /*#__PURE__*/function (MENU_NAVIGATION_DIRECTION) {
   MENU_NAVIGATION_DIRECTION["UP"] = "UP";
   MENU_NAVIGATION_DIRECTION["DOWN"] = "DOWN";
-})(MENU_NAVIGATION_DIRECTION || (MENU_NAVIGATION_DIRECTION = {}));
+  return MENU_NAVIGATION_DIRECTION;
+}(MENU_NAVIGATION_DIRECTION || {});
 class CustomTimeSelect extends Component {
   constructor(props) {
     super(props);
@@ -79,7 +78,7 @@ class CustomTimeSelect extends Component {
   }
   focus() {
     var _this$button$current;
-    (_this$button$current = this.button.current) === null || _this$button$current === void 0 ? void 0 : _this$button$current.focus();
+    (_this$button$current = this.button.current) === null || _this$button$current === void 0 || _this$button$current.focus();
   }
   updateInputValue(value) {
     var {
@@ -109,7 +108,7 @@ class CustomTimeSelect extends Component {
           this.updateInputValue(options[keyboardOptionIndex].value);
         }
         this.closeMenu();
-        (_this$button$current2 = this.button.current) === null || _this$button$current2 === void 0 ? void 0 : _this$button$current2.focus();
+        (_this$button$current2 = this.button.current) === null || _this$button$current2 === void 0 || _this$button$current2.focus();
         event.stopPropagation();
         event.preventDefault();
         break;
@@ -209,7 +208,7 @@ class CustomTimeSelect extends Component {
     var _this$button$current3;
     this.updateInputValue(update);
     this.closeMenu();
-    (_this$button$current3 = this.button.current) === null || _this$button$current3 === void 0 ? void 0 : _this$button$current3.focus();
+    (_this$button$current3 = this.button.current) === null || _this$button$current3 === void 0 || _this$button$current3.focus();
   }
   handleOptionFocus(event) {
     this.setState({
@@ -241,7 +240,7 @@ class CustomTimeSelect extends Component {
   }
   focusInput() {
     var _this$input$current;
-    (_this$input$current = this.input.current) === null || _this$input$current === void 0 ? void 0 : _this$input$current.focus();
+    (_this$input$current = this.input.current) === null || _this$input$current === void 0 || _this$input$current.focus();
   }
   focusOption(index) {
     var _this$menuContainer$c2;
@@ -309,7 +308,7 @@ class CustomTimeSelect extends Component {
     });
     if (focusButton) {
       var _this$button$current4;
-      (_this$button$current4 = this.button.current) === null || _this$button$current4 === void 0 ? void 0 : _this$button$current4.focus();
+      (_this$button$current4 = this.button.current) === null || _this$button$current4 === void 0 || _this$button$current4.focus();
     }
   }
   updateKeyboardIndex() {
@@ -381,7 +380,7 @@ class CustomTimeSelect extends Component {
       var option = options[index];
       var key = "option-".concat(index, "-").concat(option.value);
       matchFound = matchFound || option.value === value;
-      optionArray.push( /*#__PURE__*/_jsxs("button", {
+      optionArray.push(/*#__PURE__*/_jsxs("button", {
         type: "button",
         value: index,
         className: classNames('cs-option-btn', {
@@ -397,10 +396,10 @@ class CustomTimeSelect extends Component {
         }), option.title]
       }, key));
     }
-    optionArray.push( /*#__PURE__*/_jsx("hr", {
+    optionArray.push(/*#__PURE__*/_jsx("hr", {
       className: "cs-divider"
     }, "option-divider"));
-    optionArray.push( /*#__PURE__*/_jsxs("button", {
+    optionArray.push(/*#__PURE__*/_jsxs("button", {
       type: "button",
       value: CUSTOM_OPTION,
       className: classNames('cs-option-btn', {
@@ -415,7 +414,7 @@ class CustomTimeSelect extends Component {
         className: "mr-4"
       }), customText]
     }, "option-custom-label"));
-    optionArray.push( /*#__PURE__*/_jsxs("div", {
+    optionArray.push(/*#__PURE__*/_jsxs("div", {
       className: "cs-custom-container",
       children: [/*#__PURE__*/_jsx("span", {
         className: "mr-2"
@@ -433,7 +432,7 @@ class CustomTimeSelect extends Component {
         className: "ml-2"
       })]
     }, "cs-custom-container"));
-    optionArray.push( /*#__PURE__*/_jsx("hr", {
+    optionArray.push(/*#__PURE__*/_jsx("hr", {
       className: "mb-2"
     }, "option-end"));
     return optionArray;

package/dist/CustomTimeSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomTimeSelect.js","names":["React","Component","FontAwesomeIcon","vsCheck","TimeUtils","classNames","TimeInput","DropdownMenu","jsx","_jsx","jsxs","_jsxs","CUSTOM_OPTION","MENU_NAVIGATION_DIRECTION","CustomTimeSelect","constructor","props","_defineProperty","value","valueToTime","toggleMenu","bind","handleMenuKeyDown","closeMenu","handleOptionClick","handleOptionFocus","handleMenuOpened","handleMenuExited","handleCustomInput","csContainer","createRef","menuContainer","button","input","state","keyboardOptionIndex","menuIsOpen","inputWidth","customTime","inputFocused","getSelectedText","options","placeholder","i","length","option","title","formatTime","setInputWidth","current","setState","getBoundingClientRect","width","focus","_this$button$current","updateInputValue","onChange","handleResize","event","_this$button$current2","key","updateFromCustom","stopPropagation","preventDefault","shiftKey","handleMenuNavigation","UP","DOWN","direction","menuOptionsLength","newKeyboardOptionIndex","focusInput","focusOption","scrollOptionIntoView","optionIndex","Number","currentTarget","timeToValue","update","updateAndClose","_this$button$current3","target","_this$menuContainer$c","activeOption","querySelector","HTMLElement","valueIndex","map","indexOf","_this$input$current","index","_this$menuContainer$c2","children","item","openMenu","updateKeyboardIndex","focusButton","arguments","undefined","_this$button$current4","_this$menuContainer$c3","offsetTop","DROP_DOWN_MENU_HEIGHT","scrollTop","renderMenuElement","className","ref","role","onKeyDown","onClick","style","renderOptions","icon","customText","matchFound","optionArray","concat","push","type","onFocus","onBlur","render","disabled","invalid","dataTestId","popperOptions","_objectSpread","placement","modifiers","preventOverflow","enabled","isShown","actions","menuElement","popperClassName","onMenuOpened","onMenuClosed","menuStyle","maxWidth","Math","round","time"],"sources":["../src/CustomTimeSelect.tsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { type PopperOptions } from 'popper.js';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsCheck, type IconDefinition } from '@deephaven/icons';\nimport { TimeUtils } from '@deephaven/utils';\nimport classNames from 'classnames';\nimport TimeInput, { type TimeInputElement } from './TimeInput';\nimport DropdownMenu from './menu-actions/DropdownMenu';\nimport './CustomTimeSelect.scss';\n\nconst CUSTOM_OPTION = -1;\n\nenum MENU_NAVIGATION_DIRECTION {\n  UP = 'UP',\n  DOWN = 'DOWN',\n}\n\ntype CustomTimeSelectProps = {\n  options: { title: string; value: number }[];\n  popperOptions: PopperOptions;\n  value: number | null;\n  onChange: (value: number) => void;\n  disabled: boolean;\n  icon: IconDefinition;\n  placeholder: string;\n  customText: string;\n  // Defaults to converting the value in milliseconds to time in seconds\n  valueToTime: (val: number | null) => number;\n  // Defaults to converting the time in seconds to value in milliseconds\n  timeToValue: (time: number) => number;\n  invalid: boolean;\n  'data-testid'?: string;\n};\n\ntype TimeInSeconds = number;\n\ntype CustomTimeSelectState = {\n  keyboardOptionIndex: number;\n  menuIsOpen: boolean;\n  inputWidth: number;\n  customTime: TimeInSeconds;\n  inputFocused: boolean;\n};\n\nclass CustomTimeSelect extends Component<\n  CustomTimeSelectProps,\n  CustomTimeSelectState\n> {\n  static MENU_NAVIGATION_DIRECTION = MENU_NAVIGATION_DIRECTION;\n\n  static DROP_DOWN_MENU_HEIGHT = 125;\n\n  static defaultProps: Partial<CustomTimeSelectProps> = {\n    onChange(): void {\n      // no-op\n    },\n    value: null,\n    disabled: false,\n    popperOptions: {},\n    icon: vsCheck,\n    customText: 'Custom',\n    placeholder: 'Select a time',\n    valueToTime: value => (value === null ? 0 : Math.round(value / 1000)),\n    timeToValue: time => time * 1000,\n    invalid: false,\n    'data-testid': undefined,\n  };\n\n  constructor(props: CustomTimeSelectProps) {\n    super(props);\n\n    const { value, valueToTime } = props;\n\n    this.toggleMenu = this.toggleMenu.bind(this);\n    this.handleMenuKeyDown = this.handleMenuKeyDown.bind(this);\n    this.closeMenu = this.closeMenu.bind(this);\n\n    this.handleOptionClick = this.handleOptionClick.bind(this);\n    this.handleOptionFocus = this.handleOptionFocus.bind(this);\n\n    this.handleMenuOpened = this.handleMenuOpened.bind(this);\n    this.handleMenuExited = this.handleMenuExited.bind(this);\n    this.handleCustomInput = this.handleCustomInput.bind(this);\n\n    this.csContainer = React.createRef();\n    this.menuContainer = React.createRef();\n    this.button = React.createRef();\n    this.input = React.createRef();\n\n    this.state = {\n      keyboardOptionIndex: 0,\n      menuIsOpen: false,\n      inputWidth: 100,\n      customTime: valueToTime(value),\n      inputFocused: false,\n    };\n  }\n\n  csContainer: React.RefObject<HTMLDivElement>;\n\n  menuContainer: React.RefObject<HTMLDivElement>;\n\n  button: React.RefObject<HTMLButtonElement>;\n\n  input: React.RefObject<TimeInputElement>;\n\n  getSelectedText(): string {\n    const { options, value, placeholder } = this.props;\n    const { customTime } = this.state;\n\n    if (value === null) {\n      return placeholder;\n    }\n\n    for (let i = 0; i < options.length; i += 1) {\n      const option = options[i];\n      if (option.value === value) {\n        return option.title;\n      }\n    }\n\n    return TimeUtils.formatTime(customTime);\n  }\n\n  setInputWidth(): void {\n    if (this.csContainer.current) {\n      this.setState({\n        inputWidth: this.csContainer.current.getBoundingClientRect().width,\n      });\n    }\n  }\n\n  focus(): void {\n    this.button.current?.focus();\n  }\n\n  updateInputValue(value: number): void {\n    const { onChange } = this.props;\n    onChange(value);\n  }\n\n  handleResize(): void {\n    this.setInputWidth();\n  }\n\n  handleMenuKeyDown(event: React.KeyboardEvent<HTMLDivElement>): void {\n    const { keyboardOptionIndex, inputFocused } = this.state;\n    const { options } = this.props;\n\n    switch (event.key) {\n      case 'Enter':\n      case ' ': // Space Bar\n        if (inputFocused) {\n          this.updateFromCustom();\n        } else {\n          this.updateInputValue(options[keyboardOptionIndex].value);\n        }\n        this.closeMenu();\n        this.button.current?.focus();\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'Tab':\n        if (event.shiftKey) {\n          this.handleMenuNavigation(\n            CustomTimeSelect.MENU_NAVIGATION_DIRECTION.UP\n          );\n        } else {\n          this.handleMenuNavigation(\n            CustomTimeSelect.MENU_NAVIGATION_DIRECTION.DOWN\n          );\n        }\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'ArrowUp':\n        this.handleMenuNavigation(\n          CustomTimeSelect.MENU_NAVIGATION_DIRECTION.UP\n        );\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'ArrowDown':\n        this.handleMenuNavigation(\n          CustomTimeSelect.MENU_NAVIGATION_DIRECTION.DOWN\n        );\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'Escape':\n        this.closeMenu();\n        break;\n      default:\n        break;\n    }\n  }\n\n  handleMenuNavigation(direction: MENU_NAVIGATION_DIRECTION): void {\n    const { keyboardOptionIndex, inputFocused } = this.state;\n    const { options } = this.props;\n    const menuOptionsLength = options.length;\n    let newKeyboardOptionIndex = keyboardOptionIndex;\n    switch (direction) {\n      case CustomTimeSelect.MENU_NAVIGATION_DIRECTION.UP:\n        if (!inputFocused && keyboardOptionIndex === 0) {\n          this.focusInput();\n          break;\n        } else if (inputFocused) {\n          this.focusOption(keyboardOptionIndex);\n        }\n\n        if (keyboardOptionIndex > 0 && !inputFocused) {\n          newKeyboardOptionIndex =\n            (newKeyboardOptionIndex - 1) % menuOptionsLength;\n          this.setState({\n            keyboardOptionIndex: newKeyboardOptionIndex,\n          });\n        } else if (keyboardOptionIndex === 0) {\n          newKeyboardOptionIndex = menuOptionsLength - 1;\n          this.setState({\n            keyboardOptionIndex: newKeyboardOptionIndex,\n          });\n        }\n        this.scrollOptionIntoView(newKeyboardOptionIndex);\n        break;\n      case CustomTimeSelect.MENU_NAVIGATION_DIRECTION.DOWN:\n        if (!inputFocused && keyboardOptionIndex === menuOptionsLength - 1) {\n          this.focusInput();\n          break;\n        } else if (inputFocused) {\n          this.focusOption(keyboardOptionIndex);\n        }\n\n        if (\n          keyboardOptionIndex < menuOptionsLength &&\n          !(inputFocused && keyboardOptionIndex === 0)\n        ) {\n          newKeyboardOptionIndex =\n            (newKeyboardOptionIndex + 1) % menuOptionsLength;\n          this.setState({\n            keyboardOptionIndex: newKeyboardOptionIndex,\n          });\n        }\n        this.scrollOptionIntoView(newKeyboardOptionIndex);\n        break;\n      default:\n        break;\n    }\n  }\n\n  handleOptionClick(event: React.MouseEvent<HTMLButtonElement>): void {\n    const optionIndex = Number(event.currentTarget.value);\n    const { options, timeToValue } = this.props;\n    const { customTime } = this.state;\n\n    if (optionIndex === CUSTOM_OPTION) {\n      const update = timeToValue(customTime);\n      this.updateAndClose(update);\n    } else {\n      this.updateAndClose(options[optionIndex].value);\n    }\n  }\n\n  updateAndClose(update: number): void {\n    this.updateInputValue(update);\n    this.closeMenu();\n    this.button.current?.focus();\n  }\n\n  handleOptionFocus(event: React.FocusEvent<HTMLButtonElement>): void {\n    this.setState({ keyboardOptionIndex: Number(event.target.value) });\n  }\n\n  handleMenuOpened(): void {\n    const { options, value } = this.props;\n    const { keyboardOptionIndex } = this.state;\n    this.scrollOptionIntoView(keyboardOptionIndex);\n    const activeOption = this.menuContainer.current?.querySelector(\n      '.cs-option-btn.keyboard-active'\n    );\n    if (activeOption instanceof HTMLElement) {\n      activeOption.focus();\n    }\n\n    if (value === null) {\n      return;\n    }\n    const valueIndex = options.map(option => option.value).indexOf(value);\n    if (valueIndex < 0) {\n      // The custom option should be selected\n      this.focusInput();\n    }\n  }\n\n  focusInput(): void {\n    this.input.current?.focus();\n  }\n\n  focusOption(index: number): void {\n    const options = this.menuContainer.current?.querySelector('.cs-options');\n    if (options && options.children != null) {\n      const option = options.children.item(index);\n      if (option instanceof HTMLElement) {\n        option.focus();\n      }\n    }\n  }\n\n  handleMenuExited(): void {\n    const { menuIsOpen } = this.state;\n    if (menuIsOpen) {\n      this.setState({ menuIsOpen: false, keyboardOptionIndex: 0 });\n    }\n  }\n\n  handleCustomInput(value: number): void {\n    const { timeToValue } = this.props;\n\n    const update = timeToValue(value);\n    this.updateInputValue(update);\n    this.setState({\n      customTime: value,\n    });\n  }\n\n  updateFromCustom(): void {\n    const { timeToValue } = this.props;\n    const { customTime } = this.state;\n\n    const update = timeToValue(customTime);\n    this.updateInputValue(update);\n  }\n\n  toggleMenu(event: React.MouseEvent<HTMLButtonElement>): void {\n    const { menuIsOpen } = this.state;\n    if (menuIsOpen) {\n      this.closeMenu();\n    } else {\n      this.openMenu();\n    }\n    event.stopPropagation();\n  }\n\n  openMenu(): void {\n    this.updateKeyboardIndex();\n    this.setInputWidth();\n    this.setState({ menuIsOpen: true });\n  }\n\n  closeMenu(focusButton = true): void {\n    this.setState({ menuIsOpen: false });\n    if (focusButton) {\n      this.button.current?.focus();\n    }\n  }\n\n  updateKeyboardIndex(): void {\n    const { options, value } = this.props;\n    if (value === null) {\n      return;\n    }\n    const valueIndex = options.map(option => option.value).indexOf(value);\n    if (valueIndex > 0) {\n      this.setState({ keyboardOptionIndex: valueIndex });\n    }\n  }\n\n  scrollOptionIntoView(index: number): void {\n    const options = this.menuContainer.current?.querySelector('.cs-options');\n    if (options && options.children != null) {\n      const activeOption = options.children.item(index);\n      if (\n        activeOption instanceof HTMLElement &&\n        activeOption.offsetTop > CustomTimeSelect.DROP_DOWN_MENU_HEIGHT\n      ) {\n        options.scrollTop =\n          activeOption.offsetTop - CustomTimeSelect.DROP_DOWN_MENU_HEIGHT;\n      } else if (\n        (activeOption instanceof HTMLElement && activeOption.offsetTop < 0) ||\n        index === 0\n      ) {\n        options.scrollTop = 0;\n      }\n    }\n  }\n\n  renderMenuElement(): JSX.Element {\n    const { inputWidth } = this.state;\n    return (\n      <div\n        className=\"cs-menu-container\"\n        ref={this.menuContainer}\n        role=\"presentation\"\n        onKeyDown={this.handleMenuKeyDown}\n        onClick={event => {\n          event.stopPropagation();\n        }}\n        style={{ width: inputWidth }}\n      >\n        <div className=\"cs-options-container\">\n          <div className=\"cs-options\">{this.renderOptions()}</div>\n        </div>\n      </div>\n    );\n  }\n\n  renderOptions(): React.ReactNode {\n    const { options, value, icon, customText } = this.props;\n    const { keyboardOptionIndex, customTime, inputFocused } = this.state;\n\n    let matchFound = false;\n    const optionArray: JSX.Element[] = [];\n    for (let index = 0; index < options.length; index += 1) {\n      const option = options[index];\n      const key = `option-${index}-${option.value}`;\n      matchFound = matchFound || option.value === value;\n      optionArray.push(\n        <button\n          key={key}\n          type=\"button\"\n          value={index}\n          className={classNames('cs-option-btn', {\n            'keyboard-active': keyboardOptionIndex === index && !inputFocused,\n          })}\n          onClick={this.handleOptionClick}\n          onFocus={this.handleOptionFocus}\n        >\n          {option.value === value && (\n            <FontAwesomeIcon icon={icon} className=\"mr-2\" />\n          )}\n          {option.value !== value && <span className=\"mr-4\" />}\n          {option.title}\n        </button>\n      );\n    }\n\n    optionArray.push(<hr className=\"cs-divider\" key=\"option-divider\" />);\n\n    optionArray.push(\n      <button\n        key=\"option-custom-label\"\n        type=\"button\"\n        value={CUSTOM_OPTION}\n        className={classNames('cs-option-btn', {\n          'keyboard-active': inputFocused,\n        })}\n        onClick={this.handleOptionClick}\n        onFocus={this.handleOptionFocus}\n      >\n        {!matchFound && value !== null ? (\n          <FontAwesomeIcon icon={icon} className=\"mr-2\" />\n        ) : (\n          <span className=\"mr-4\" />\n        )}\n        {customText}\n      </button>\n    );\n\n    optionArray.push(\n      <div key=\"cs-custom-container\" className=\"cs-custom-container\">\n        <span className=\"mr-2\" />\n        <TimeInput\n          key=\"option-input\"\n          ref={this.input}\n          onChange={this.handleCustomInput}\n          value={customTime}\n          onFocus={() => this.setState({ inputFocused: true })}\n          onBlur={() => this.setState({ inputFocused: false })}\n        />\n        <span className=\"ml-2\" />\n      </div>\n    );\n\n    optionArray.push(<hr key=\"option-end\" className=\"mb-2\" />);\n\n    return optionArray;\n  }\n\n  render(): JSX.Element {\n    const { disabled, invalid, value, 'data-testid': dataTestId } = this.props;\n    const { menuIsOpen } = this.state;\n    let { popperOptions } = this.props;\n    popperOptions = {\n      placement: 'bottom-end',\n      modifiers: {\n        preventOverflow: { enabled: false },\n      },\n      ...popperOptions,\n    };\n\n    return (\n      <div\n        className=\"input-group cs-container context-menu\"\n        ref={this.csContainer}\n        data-testid={dataTestId}\n      >\n        <div\n          className={classNames('input-group-append cs-dropdown', {\n            'cs-dropdown-invalid': invalid,\n          })}\n        >\n          <button\n            type=\"button\"\n            className={classNames('btn cs-btn form-control', {\n              'cs-btn-invalid': invalid,\n            })}\n            ref={this.button}\n            onClick={this.toggleMenu}\n            disabled={disabled}\n          >\n            <span\n              className={classNames({\n                'text-muted': value === null,\n              })}\n            >\n              {this.getSelectedText()}\n            </span>\n            <span className=\"cs-caret\" />\n            <DropdownMenu\n              isShown={menuIsOpen}\n              actions={{ menuElement: this.renderMenuElement() }}\n              popperOptions={popperOptions}\n              popperClassName=\"CustomTimeSelect\"\n              onMenuOpened={this.handleMenuOpened}\n              onMenuClosed={this.handleMenuExited}\n              menuStyle={{ maxWidth: '100rem' }}\n            />\n          </button>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default CustomTimeSelect;\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AAExC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,OAAO,QAA6B,kBAAkB;AAC/D,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,OAAOC,UAAU,MAAM,YAAY;AAAC,OAC7BC,SAAS;AAAA,OACTC,YAAY;AAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAGnB,IAAMC,aAAa,GAAG,CAAC,CAAC;AAAC,IAEpBC,yBAAyB;AAAA,WAAzBA,yBAAyB;EAAzBA,yBAAyB;EAAzBA,yBAAyB;AAAA,GAAzBA,yBAAyB,KAAzBA,yBAAyB;AAgC9B,MAAMC,gBAAgB,SAASb,SAAS,CAGtC;EAqBAc,WAAWA,CAACC,KAA4B,EAAE;IACxC,KAAK,CAACA,KAAK,CAAC;IAACC,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAEb,IAAM;MAAEC,KAAK;MAAEC;IAAY,CAAC,GAAGH,KAAK;IAEpC,IAAI,CAACI,UAAU,GAAG,IAAI,CAACA,UAAU,CAACC,IAAI,CAAC,IAAI,CAAC;IAC5C,IAAI,CAACC,iBAAiB,GAAG,IAAI,CAACA,iBAAiB,CAACD,IAAI,CAAC,IAAI,CAAC;IAC1D,IAAI,CAACE,SAAS,GAAG,IAAI,CAACA,SAAS,CAACF,IAAI,CAAC,IAAI,CAAC;IAE1C,IAAI,CAACG,iBAAiB,GAAG,IAAI,CAACA,iBAAiB,CAACH,IAAI,CAAC,IAAI,CAAC;IAC1D,IAAI,CAACI,iBAAiB,GAAG,IAAI,CAACA,iBAAiB,CAACJ,IAAI,CAAC,IAAI,CAAC;IAE1D,IAAI,CAACK,gBAAgB,GAAG,IAAI,CAACA,gBAAgB,CAACL,IAAI,CAAC,IAAI,CAAC;IACxD,IAAI,CAACM,gBAAgB,GAAG,IAAI,CAACA,gBAAgB,CAACN,IAAI,CAAC,IAAI,CAAC;IACxD,IAAI,CAACO,iBAAiB,GAAG,IAAI,CAACA,iBAAiB,CAACP,IAAI,CAAC,IAAI,CAAC;IAE1D,IAAI,CAACQ,WAAW,gBAAG7B,KAAK,CAAC8B,SAAS,CAAC,CAAC;IACpC,IAAI,CAACC,aAAa,gBAAG/B,KAAK,CAAC8B,SAAS,CAAC,CAAC;IACtC,IAAI,CAACE,MAAM,gBAAGhC,KAAK,CAAC8B,SAAS,CAAC,CAAC;IAC/B,IAAI,CAACG,KAAK,gBAAGjC,KAAK,CAAC8B,SAAS,CAAC,CAAC;IAE9B,IAAI,CAACI,KAAK,GAAG;MACXC,mBAAmB,EAAE,CAAC;MACtBC,UAAU,EAAE,KAAK;MACjBC,UAAU,EAAE,GAAG;MACfC,UAAU,EAAEnB,WAAW,CAACD,KAAK,CAAC;MAC9BqB,YAAY,EAAE;IAChB,CAAC;EACH;EAUAC,eAAeA,CAAA,EAAW;IACxB,IAAM;MAAEC,OAAO;MAAEvB,KAAK;MAAEwB;IAAY,CAAC,GAAG,IAAI,CAAC1B,KAAK;IAClD,IAAM;MAAEsB;IAAW,CAAC,GAAG,IAAI,CAACJ,KAAK;IAEjC,IAAIhB,KAAK,KAAK,IAAI,EAAE;MAClB,OAAOwB,WAAW;IACpB;IAEA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGF,OAAO,CAACG,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;MAC1C,IAAME,MAAM,GAAGJ,OAAO,CAACE,CAAC,CAAC;MACzB,IAAIE,MAAM,CAAC3B,KAAK,KAAKA,KAAK,EAAE;QAC1B,OAAO2B,MAAM,CAACC,KAAK;MACrB;IACF;IAEA,OAAO1C,SAAS,CAAC2C,UAAU,CAACT,UAAU,CAAC;EACzC;EAEAU,aAAaA,CAAA,EAAS;IACpB,IAAI,IAAI,CAACnB,WAAW,CAACoB,OAAO,EAAE;MAC5B,IAAI,CAACC,QAAQ,CAAC;QACZb,UAAU,EAAE,IAAI,CAACR,WAAW,CAACoB,OAAO,CAACE,qBAAqB,CAAC,CAAC,CAACC;MAC/D,CAAC,CAAC;IACJ;EACF;EAEAC,KAAKA,CAAA,EAAS;IAAA,IAAAC,oBAAA;IACZ,CAAAA,oBAAA,OAAI,CAACtB,MAAM,CAACiB,OAAO,cAAAK,oBAAA,uBAAnBA,oBAAA,CAAqBD,KAAK,CAAC,CAAC;EAC9B;EAEAE,gBAAgBA,CAACrC,KAAa,EAAQ;IACpC,IAAM;MAAEsC;IAAS,CAAC,GAAG,IAAI,CAACxC,KAAK;IAC/BwC,QAAQ,CAACtC,KAAK,CAAC;EACjB;EAEAuC,YAAYA,CAAA,EAAS;IACnB,IAAI,CAACT,aAAa,CAAC,CAAC;EACtB;EAEA1B,iBAAiBA,CAACoC,KAA0C,EAAQ;IAAA,IAAAC,qBAAA;IAClE,IAAM;MAAExB,mBAAmB;MAAEI;IAAa,CAAC,GAAG,IAAI,CAACL,KAAK;IACxD,IAAM;MAAEO;IAAQ,CAAC,GAAG,IAAI,CAACzB,KAAK;IAE9B,QAAQ0C,KAAK,CAACE,GAAG;MACf,KAAK,OAAO;MACZ,KAAK,GAAG;QAAE;QACR,IAAIrB,YAAY,EAAE;UAChB,IAAI,CAACsB,gBAAgB,CAAC,CAAC;QACzB,CAAC,MAAM;UACL,IAAI,CAACN,gBAAgB,CAACd,OAAO,CAACN,mBAAmB,CAAC,CAACjB,KAAK,CAAC;QAC3D;QACA,IAAI,CAACK,SAAS,CAAC,CAAC;QAChB,CAAAoC,qBAAA,OAAI,CAAC3B,MAAM,CAACiB,OAAO,cAAAU,qBAAA,uBAAnBA,qBAAA,CAAqBN,KAAK,CAAC,CAAC;QAC5BK,KAAK,CAACI,eAAe,CAAC,CAAC;QACvBJ,KAAK,CAACK,cAAc,CAAC,CAAC;QACtB;MACF,KAAK,KAAK;QACR,IAAIL,KAAK,CAACM,QAAQ,EAAE;UAClB,IAAI,CAACC,oBAAoB,CACvBnD,gBAAgB,CAACD,yBAAyB,CAACqD,EAC7C,CAAC;QACH,CAAC,MAAM;UACL,IAAI,CAACD,oBAAoB,CACvBnD,gBAAgB,CAACD,yBAAyB,CAACsD,IAC7C,CAAC;QACH;QACAT,KAAK,CAACI,eAAe,CAAC,CAAC;QACvBJ,KAAK,CAACK,cAAc,CAAC,CAAC;QACtB;MACF,KAAK,SAAS;QACZ,IAAI,CAACE,oBAAoB,CACvBnD,gBAAgB,CAACD,yBAAyB,CAACqD,EAC7C,CAAC;QACDR,KAAK,CAACI,eAAe,CAAC,CAAC;QACvBJ,KAAK,CAACK,cAAc,CAAC,CAAC;QACtB;MACF,KAAK,WAAW;QACd,IAAI,CAACE,oBAAoB,CACvBnD,gBAAgB,CAACD,yBAAyB,CAACsD,IAC7C,CAAC;QACDT,KAAK,CAACI,eAAe,CAAC,CAAC;QACvBJ,KAAK,CAACK,cAAc,CAAC,CAAC;QACtB;MACF,KAAK,QAAQ;QACX,IAAI,CAACxC,SAAS,CAAC,CAAC;QAChB;MACF;QACE;IACJ;EACF;EAEA0C,oBAAoBA,CAACG,SAAoC,EAAQ;IAC/D,IAAM;MAAEjC,mBAAmB;MAAEI;IAAa,CAAC,GAAG,IAAI,CAACL,KAAK;IACxD,IAAM;MAAEO;IAAQ,CAAC,GAAG,IAAI,CAACzB,KAAK;IAC9B,IAAMqD,iBAAiB,GAAG5B,OAAO,CAACG,MAAM;IACxC,IAAI0B,sBAAsB,GAAGnC,mBAAmB;IAChD,QAAQiC,SAAS;MACf,KAAKtD,gBAAgB,CAACD,yBAAyB,CAACqD,EAAE;QAChD,IAAI,CAAC3B,YAAY,IAAIJ,mBAAmB,KAAK,CAAC,EAAE;UAC9C,IAAI,CAACoC,UAAU,CAAC,CAAC;UACjB;QACF,CAAC,MAAM,IAAIhC,YAAY,EAAE;UACvB,IAAI,CAACiC,WAAW,CAACrC,mBAAmB,CAAC;QACvC;QAEA,IAAIA,mBAAmB,GAAG,CAAC,IAAI,CAACI,YAAY,EAAE;UAC5C+B,sBAAsB,GACpB,CAACA,sBAAsB,GAAG,CAAC,IAAID,iBAAiB;UAClD,IAAI,CAACnB,QAAQ,CAAC;YACZf,mBAAmB,EAAEmC;UACvB,CAAC,CAAC;QACJ,CAAC,MAAM,IAAInC,mBAAmB,KAAK,CAAC,EAAE;UACpCmC,sBAAsB,GAAGD,iBAAiB,GAAG,CAAC;UAC9C,IAAI,CAACnB,QAAQ,CAAC;YACZf,mBAAmB,EAAEmC;UACvB,CAAC,CAAC;QACJ;QACA,IAAI,CAACG,oBAAoB,CAACH,sBAAsB,CAAC;QACjD;MACF,KAAKxD,gBAAgB,CAACD,yBAAyB,CAACsD,IAAI;QAClD,IAAI,CAAC5B,YAAY,IAAIJ,mBAAmB,KAAKkC,iBAAiB,GAAG,CAAC,EAAE;UAClE,IAAI,CAACE,UAAU,CAAC,CAAC;UACjB;QACF,CAAC,MAAM,IAAIhC,YAAY,EAAE;UACvB,IAAI,CAACiC,WAAW,CAACrC,mBAAmB,CAAC;QACvC;QAEA,IACEA,mBAAmB,GAAGkC,iBAAiB,IACvC,EAAE9B,YAAY,IAAIJ,mBAAmB,KAAK,CAAC,CAAC,EAC5C;UACAmC,sBAAsB,GACpB,CAACA,sBAAsB,GAAG,CAAC,IAAID,iBAAiB;UAClD,IAAI,CAACnB,QAAQ,CAAC;YACZf,mBAAmB,EAAEmC;UACvB,CAAC,CAAC;QACJ;QACA,IAAI,CAACG,oBAAoB,CAACH,sBAAsB,CAAC;QACjD;MACF;QACE;IACJ;EACF;EAEA9C,iBAAiBA,CAACkC,KAA0C,EAAQ;IAClE,IAAMgB,WAAW,GAAGC,MAAM,CAACjB,KAAK,CAACkB,aAAa,CAAC1D,KAAK,CAAC;IACrD,IAAM;MAAEuB,OAAO;MAAEoC;IAAY,CAAC,GAAG,IAAI,CAAC7D,KAAK;IAC3C,IAAM;MAAEsB;IAAW,CAAC,GAAG,IAAI,CAACJ,KAAK;IAEjC,IAAIwC,WAAW,KAAK9D,aAAa,EAAE;MACjC,IAAMkE,MAAM,GAAGD,WAAW,CAACvC,UAAU,CAAC;MACtC,IAAI,CAACyC,cAAc,CAACD,MAAM,CAAC;IAC7B,CAAC,MAAM;MACL,IAAI,CAACC,cAAc,CAACtC,OAAO,CAACiC,WAAW,CAAC,CAACxD,KAAK,CAAC;IACjD;EACF;EAEA6D,cAAcA,CAACD,MAAc,EAAQ;IAAA,IAAAE,qBAAA;IACnC,IAAI,CAACzB,gBAAgB,CAACuB,MAAM,CAAC;IAC7B,IAAI,CAACvD,SAAS,CAAC,CAAC;IAChB,CAAAyD,qBAAA,OAAI,CAAChD,MAAM,CAACiB,OAAO,cAAA+B,qBAAA,uBAAnBA,qBAAA,CAAqB3B,KAAK,CAAC,CAAC;EAC9B;EAEA5B,iBAAiBA,CAACiC,KAA0C,EAAQ;IAClE,IAAI,CAACR,QAAQ,CAAC;MAAEf,mBAAmB,EAAEwC,MAAM,CAACjB,KAAK,CAACuB,MAAM,CAAC/D,KAAK;IAAE,CAAC,CAAC;EACpE;EAEAQ,gBAAgBA,CAAA,EAAS;IAAA,IAAAwD,qBAAA;IACvB,IAAM;MAAEzC,OAAO;MAAEvB;IAAM,CAAC,GAAG,IAAI,CAACF,KAAK;IACrC,IAAM;MAAEmB;IAAoB,CAAC,GAAG,IAAI,CAACD,KAAK;IAC1C,IAAI,CAACuC,oBAAoB,CAACtC,mBAAmB,CAAC;IAC9C,IAAMgD,YAAY,IAAAD,qBAAA,GAAG,IAAI,CAACnD,aAAa,CAACkB,OAAO,cAAAiC,qBAAA,uBAA1BA,qBAAA,CAA4BE,aAAa,CAC5D,gCACF,CAAC;IACD,IAAID,YAAY,YAAYE,WAAW,EAAE;MACvCF,YAAY,CAAC9B,KAAK,CAAC,CAAC;IACtB;IAEA,IAAInC,KAAK,KAAK,IAAI,EAAE;MAClB;IACF;IACA,IAAMoE,UAAU,GAAG7C,OAAO,CAAC8C,GAAG,CAAC1C,MAAM,IAAIA,MAAM,CAAC3B,KAAK,CAAC,CAACsE,OAAO,CAACtE,KAAK,CAAC;IACrE,IAAIoE,UAAU,GAAG,CAAC,EAAE;MAClB;MACA,IAAI,CAACf,UAAU,CAAC,CAAC;IACnB;EACF;EAEAA,UAAUA,CAAA,EAAS;IAAA,IAAAkB,mBAAA;IACjB,CAAAA,mBAAA,OAAI,CAACxD,KAAK,CAACgB,OAAO,cAAAwC,mBAAA,uBAAlBA,mBAAA,CAAoBpC,KAAK,CAAC,CAAC;EAC7B;EAEAmB,WAAWA,CAACkB,KAAa,EAAQ;IAAA,IAAAC,sBAAA;IAC/B,IAAMlD,OAAO,IAAAkD,sBAAA,GAAG,IAAI,CAAC5D,aAAa,CAACkB,OAAO,cAAA0C,sBAAA,uBAA1BA,sBAAA,CAA4BP,aAAa,CAAC,aAAa,CAAC;IACxE,IAAI3C,OAAO,IAAIA,OAAO,CAACmD,QAAQ,IAAI,IAAI,EAAE;MACvC,IAAM/C,MAAM,GAAGJ,OAAO,CAACmD,QAAQ,CAACC,IAAI,CAACH,KAAK,CAAC;MAC3C,IAAI7C,MAAM,YAAYwC,WAAW,EAAE;QACjCxC,MAAM,CAACQ,KAAK,CAAC,CAAC;MAChB;IACF;EACF;EAEA1B,gBAAgBA,CAAA,EAAS;IACvB,IAAM;MAAES;IAAW,CAAC,GAAG,IAAI,CAACF,KAAK;IACjC,IAAIE,UAAU,EAAE;MACd,IAAI,CAACc,QAAQ,CAAC;QAAEd,UAAU,EAAE,KAAK;QAAED,mBAAmB,EAAE;MAAE,CAAC,CAAC;IAC9D;EACF;EAEAP,iBAAiBA,CAACV,KAAa,EAAQ;IACrC,IAAM;MAAE2D;IAAY,CAAC,GAAG,IAAI,CAAC7D,KAAK;IAElC,IAAM8D,MAAM,GAAGD,WAAW,CAAC3D,KAAK,CAAC;IACjC,IAAI,CAACqC,gBAAgB,CAACuB,MAAM,CAAC;IAC7B,IAAI,CAAC5B,QAAQ,CAAC;MACZZ,UAAU,EAAEpB;IACd,CAAC,CAAC;EACJ;EAEA2C,gBAAgBA,CAAA,EAAS;IACvB,IAAM;MAAEgB;IAAY,CAAC,GAAG,IAAI,CAAC7D,KAAK;IAClC,IAAM;MAAEsB;IAAW,CAAC,GAAG,IAAI,CAACJ,KAAK;IAEjC,IAAM4C,MAAM,GAAGD,WAAW,CAACvC,UAAU,CAAC;IACtC,IAAI,CAACiB,gBAAgB,CAACuB,MAAM,CAAC;EAC/B;EAEA1D,UAAUA,CAACsC,KAA0C,EAAQ;IAC3D,IAAM;MAAEtB;IAAW,CAAC,GAAG,IAAI,CAACF,KAAK;IACjC,IAAIE,UAAU,EAAE;MACd,IAAI,CAACb,SAAS,CAAC,CAAC;IAClB,CAAC,MAAM;MACL,IAAI,CAACuE,QAAQ,CAAC,CAAC;IACjB;IACApC,KAAK,CAACI,eAAe,CAAC,CAAC;EACzB;EAEAgC,QAAQA,CAAA,EAAS;IACf,IAAI,CAACC,mBAAmB,CAAC,CAAC;IAC1B,IAAI,CAAC/C,aAAa,CAAC,CAAC;IACpB,IAAI,CAACE,QAAQ,CAAC;MAAEd,UAAU,EAAE;IAAK,CAAC,CAAC;EACrC;EAEAb,SAASA,CAAA,EAA2B;IAAA,IAA1ByE,WAAW,GAAAC,SAAA,CAAArD,MAAA,QAAAqD,SAAA,QAAAC,SAAA,GAAAD,SAAA,MAAG,IAAI;IAC1B,IAAI,CAAC/C,QAAQ,CAAC;MAAEd,UAAU,EAAE;IAAM,CAAC,CAAC;IACpC,IAAI4D,WAAW,EAAE;MAAA,IAAAG,qBAAA;MACf,CAAAA,qBAAA,OAAI,CAACnE,MAAM,CAACiB,OAAO,cAAAkD,qBAAA,uBAAnBA,qBAAA,CAAqB9C,KAAK,CAAC,CAAC;IAC9B;EACF;EAEA0C,mBAAmBA,CAAA,EAAS;IAC1B,IAAM;MAAEtD,OAAO;MAAEvB;IAAM,CAAC,GAAG,IAAI,CAACF,KAAK;IACrC,IAAIE,KAAK,KAAK,IAAI,EAAE;MAClB;IACF;IACA,IAAMoE,UAAU,GAAG7C,OAAO,CAAC8C,GAAG,CAAC1C,MAAM,IAAIA,MAAM,CAAC3B,KAAK,CAAC,CAACsE,OAAO,CAACtE,KAAK,CAAC;IACrE,IAAIoE,UAAU,GAAG,CAAC,EAAE;MAClB,IAAI,CAACpC,QAAQ,CAAC;QAAEf,mBAAmB,EAAEmD;MAAW,CAAC,CAAC;IACpD;EACF;EAEAb,oBAAoBA,CAACiB,KAAa,EAAQ;IAAA,IAAAU,sBAAA;IACxC,IAAM3D,OAAO,IAAA2D,sBAAA,GAAG,IAAI,CAACrE,aAAa,CAACkB,OAAO,cAAAmD,sBAAA,uBAA1BA,sBAAA,CAA4BhB,aAAa,CAAC,aAAa,CAAC;IACxE,IAAI3C,OAAO,IAAIA,OAAO,CAACmD,QAAQ,IAAI,IAAI,EAAE;MACvC,IAAMT,YAAY,GAAG1C,OAAO,CAACmD,QAAQ,CAACC,IAAI,CAACH,KAAK,CAAC;MACjD,IACEP,YAAY,YAAYE,WAAW,IACnCF,YAAY,CAACkB,SAAS,GAAGvF,gBAAgB,CAACwF,qBAAqB,EAC/D;QACA7D,OAAO,CAAC8D,SAAS,GACfpB,YAAY,CAACkB,SAAS,GAAGvF,gBAAgB,CAACwF,qBAAqB;MACnE,CAAC,MAAM,IACJnB,YAAY,YAAYE,WAAW,IAAIF,YAAY,CAACkB,SAAS,GAAG,CAAC,IAClEX,KAAK,KAAK,CAAC,EACX;QACAjD,OAAO,CAAC8D,SAAS,GAAG,CAAC;MACvB;IACF;EACF;EAEAC,iBAAiBA,CAAA,EAAgB;IAC/B,IAAM;MAAEnE;IAAW,CAAC,GAAG,IAAI,CAACH,KAAK;IACjC,oBACEzB,IAAA;MACEgG,SAAS,EAAC,mBAAmB;MAC7BC,GAAG,EAAE,IAAI,CAAC3E,aAAc;MACxB4E,IAAI,EAAC,cAAc;MACnBC,SAAS,EAAE,IAAI,CAACtF,iBAAkB;MAClCuF,OAAO,EAAEnD,KAAK,IAAI;QAChBA,KAAK,CAACI,eAAe,CAAC,CAAC;MACzB,CAAE;MACFgD,KAAK,EAAE;QAAE1D,KAAK,EAAEf;MAAW,CAAE;MAAAuD,QAAA,eAE7BnF,IAAA;QAAKgG,SAAS,EAAC,sBAAsB;QAAAb,QAAA,eACnCnF,IAAA;UAAKgG,SAAS,EAAC,YAAY;UAAAb,QAAA,EAAE,IAAI,CAACmB,aAAa,CAAC;QAAC,CAAM;MAAC,CACrD;IAAC,CACH,CAAC;EAEV;EAEAA,aAAaA,CAAA,EAAoB;IAC/B,IAAM;MAAEtE,OAAO;MAAEvB,KAAK;MAAE8F,IAAI;MAAEC;IAAW,CAAC,GAAG,IAAI,CAACjG,KAAK;IACvD,IAAM;MAAEmB,mBAAmB;MAAEG,UAAU;MAAEC;IAAa,CAAC,GAAG,IAAI,CAACL,KAAK;IAEpE,IAAIgF,UAAU,GAAG,KAAK;IACtB,IAAMC,WAA0B,GAAG,EAAE;IACrC,KAAK,IAAIzB,KAAK,GAAG,CAAC,EAAEA,KAAK,GAAGjD,OAAO,CAACG,MAAM,EAAE8C,KAAK,IAAI,CAAC,EAAE;MACtD,IAAM7C,MAAM,GAAGJ,OAAO,CAACiD,KAAK,CAAC;MAC7B,IAAM9B,GAAG,aAAAwD,MAAA,CAAa1B,KAAK,OAAA0B,MAAA,CAAIvE,MAAM,CAAC3B,KAAK,CAAE;MAC7CgG,UAAU,GAAGA,UAAU,IAAIrE,MAAM,CAAC3B,KAAK,KAAKA,KAAK;MACjDiG,WAAW,CAACE,IAAI,eACd1G,KAAA;QAEE2G,IAAI,EAAC,QAAQ;QACbpG,KAAK,EAAEwE,KAAM;QACbe,SAAS,EAAEpG,UAAU,CAAC,eAAe,EAAE;UACrC,iBAAiB,EAAE8B,mBAAmB,KAAKuD,KAAK,IAAI,CAACnD;QACvD,CAAC,CAAE;QACHsE,OAAO,EAAE,IAAI,CAACrF,iBAAkB;QAChC+F,OAAO,EAAE,IAAI,CAAC9F,iBAAkB;QAAAmE,QAAA,GAE/B/C,MAAM,CAAC3B,KAAK,KAAKA,KAAK,iBACrBT,IAAA,CAACP,eAAe;UAAC8G,IAAI,EAAEA,IAAK;UAACP,SAAS,EAAC;QAAM,CAAE,CAChD,EACA5D,MAAM,CAAC3B,KAAK,KAAKA,KAAK,iBAAIT,IAAA;UAAMgG,SAAS,EAAC;QAAM,CAAE,CAAC,EACnD5D,MAAM,CAACC,KAAK;MAAA,GAbRc,GAcC,CACV,CAAC;IACH;IAEAuD,WAAW,CAACE,IAAI,eAAC5G,IAAA;MAAIgG,SAAS,EAAC;IAAY,GAAK,gBAAkB,CAAC,CAAC;IAEpEU,WAAW,CAACE,IAAI,eACd1G,KAAA;MAEE2G,IAAI,EAAC,QAAQ;MACbpG,KAAK,EAAEN,aAAc;MACrB6F,SAAS,EAAEpG,UAAU,CAAC,eAAe,EAAE;QACrC,iBAAiB,EAAEkC;MACrB,CAAC,CAAE;MACHsE,OAAO,EAAE,IAAI,CAACrF,iBAAkB;MAChC+F,OAAO,EAAE,IAAI,CAAC9F,iBAAkB;MAAAmE,QAAA,GAE/B,CAACsB,UAAU,IAAIhG,KAAK,KAAK,IAAI,gBAC5BT,IAAA,CAACP,eAAe;QAAC8G,IAAI,EAAEA,IAAK;QAACP,SAAS,EAAC;MAAM,CAAE,CAAC,gBAEhDhG,IAAA;QAAMgG,SAAS,EAAC;MAAM,CAAE,CACzB,EACAQ,UAAU;IAAA,GAdP,qBAeE,CACV,CAAC;IAEDE,WAAW,CAACE,IAAI,eACd1G,KAAA;MAA+B8F,SAAS,EAAC,qBAAqB;MAAAb,QAAA,gBAC5DnF,IAAA;QAAMgG,SAAS,EAAC;MAAM,CAAE,CAAC,eACzBhG,IAAA,CAACH,SAAS;QAERoG,GAAG,EAAE,IAAI,CAACzE,KAAM;QAChBuB,QAAQ,EAAE,IAAI,CAAC5B,iBAAkB;QACjCV,KAAK,EAAEoB,UAAW;QAClBiF,OAAO,EAAEA,CAAA,KAAM,IAAI,CAACrE,QAAQ,CAAC;UAAEX,YAAY,EAAE;QAAK,CAAC,CAAE;QACrDiF,MAAM,EAAEA,CAAA,KAAM,IAAI,CAACtE,QAAQ,CAAC;UAAEX,YAAY,EAAE;QAAM,CAAC;MAAE,GALjD,cAML,CAAC,eACF9B,IAAA;QAAMgG,SAAS,EAAC;MAAM,CAAE,CAAC;IAAA,GAVlB,qBAWJ,CACP,CAAC;IAEDU,WAAW,CAACE,IAAI,eAAC5G,IAAA;MAAqBgG,SAAS,EAAC;IAAM,GAA7B,YAA+B,CAAC,CAAC;IAE1D,OAAOU,WAAW;EACpB;EAEAM,MAAMA,CAAA,EAAgB;IACpB,IAAM;MAAEC,QAAQ;MAAEC,OAAO;MAAEzG,KAAK;MAAE,aAAa,EAAE0G;IAAW,CAAC,GAAG,IAAI,CAAC5G,KAAK;IAC1E,IAAM;MAAEoB;IAAW,CAAC,GAAG,IAAI,CAACF,KAAK;IACjC,IAAI;MAAE2F;IAAc,CAAC,GAAG,IAAI,CAAC7G,KAAK;IAClC6G,aAAa,GAAAC,aAAA;MACXC,SAAS,EAAE,YAAY;MACvBC,SAAS,EAAE;QACTC,eAAe,EAAE;UAAEC,OAAO,EAAE;QAAM;MACpC;IAAC,GACEL,aAAa,CACjB;IAED,oBACEpH,IAAA;MACEgG,SAAS,EAAC,uCAAuC;MACjDC,GAAG,EAAE,IAAI,CAAC7E,WAAY;MACtB,eAAa+F,UAAW;MAAAhC,QAAA,eAExBnF,IAAA;QACEgG,SAAS,EAAEpG,UAAU,CAAC,gCAAgC,EAAE;UACtD,qBAAqB,EAAEsH;QACzB,CAAC,CAAE;QAAA/B,QAAA,eAEHjF,KAAA;UACE2G,IAAI,EAAC,QAAQ;UACbb,SAAS,EAAEpG,UAAU,CAAC,yBAAyB,EAAE;YAC/C,gBAAgB,EAAEsH;UACpB,CAAC,CAAE;UACHjB,GAAG,EAAE,IAAI,CAAC1E,MAAO;UACjB6E,OAAO,EAAE,IAAI,CAACzF,UAAW;UACzBsG,QAAQ,EAAEA,QAAS;UAAA9B,QAAA,gBAEnBnF,IAAA;YACEgG,SAAS,EAAEpG,UAAU,CAAC;cACpB,YAAY,EAAEa,KAAK,KAAK;YAC1B,CAAC,CAAE;YAAA0E,QAAA,EAEF,IAAI,CAACpD,eAAe,CAAC;UAAC,CACnB,CAAC,eACP/B,IAAA;YAAMgG,SAAS,EAAC;UAAU,CAAE,CAAC,eAC7BhG,IAAA,CAACF,YAAY;YACX4H,OAAO,EAAE/F,UAAW;YACpBgG,OAAO,EAAE;cAAEC,WAAW,EAAE,IAAI,CAAC7B,iBAAiB,CAAC;YAAE,CAAE;YACnDqB,aAAa,EAAEA,aAAc;YAC7BS,eAAe,EAAC,kBAAkB;YAClCC,YAAY,EAAE,IAAI,CAAC7G,gBAAiB;YACpC8G,YAAY,EAAE,IAAI,CAAC7G,gBAAiB;YACpC8G,SAAS,EAAE;cAAEC,QAAQ,EAAE;YAAS;UAAE,CACnC,CAAC;QAAA,CACI;MAAC,CACN;IAAC,CACH,CAAC;EAEV;AACF;AAACzH,eAAA,CAxeKH,gBAAgB,+BAIeD,yBAAyB;AAAAI,eAAA,CAJxDH,gBAAgB,2BAMW,GAAG;AAAAG,eAAA,CAN9BH,gBAAgB,kBAQkC;EACpD0C,QAAQA,CAAA,EAAS;IACf;EAAA,CACD;EACDtC,KAAK,EAAE,IAAI;EACXwG,QAAQ,EAAE,KAAK;EACfG,aAAa,EAAE,CAAC,CAAC;EACjBb,IAAI,EAAE7G,OAAO;EACb8G,UAAU,EAAE,QAAQ;EACpBvE,WAAW,EAAE,eAAe;EAC5BvB,WAAW,EAAED,KAAK,IAAKA,KAAK,KAAK,IAAI,GAAG,CAAC,GAAGyH,IAAI,CAACC,KAAK,CAAC1H,KAAK,GAAG,IAAI,CAAE;EACrE2D,WAAW,EAAEgE,IAAI,IAAIA,IAAI,GAAG,IAAI;EAChClB,OAAO,EAAE,KAAK;EACd,aAAa,EAAEzB;AACjB,CAAC;AAodH,eAAepF,gBAAgB"}
+{"version":3,"file":"CustomTimeSelect.js","names":["React","Component","FontAwesomeIcon","vsCheck","TimeUtils","classNames","TimeInput","DropdownMenu","jsx","_jsx","jsxs","_jsxs","CUSTOM_OPTION","MENU_NAVIGATION_DIRECTION","CustomTimeSelect","constructor","props","_defineProperty","value","valueToTime","toggleMenu","bind","handleMenuKeyDown","closeMenu","handleOptionClick","handleOptionFocus","handleMenuOpened","handleMenuExited","handleCustomInput","csContainer","createRef","menuContainer","button","input","state","keyboardOptionIndex","menuIsOpen","inputWidth","customTime","inputFocused","getSelectedText","options","placeholder","i","length","option","title","formatTime","setInputWidth","current","setState","getBoundingClientRect","width","focus","_this$button$current","updateInputValue","onChange","handleResize","event","_this$button$current2","key","updateFromCustom","stopPropagation","preventDefault","shiftKey","handleMenuNavigation","UP","DOWN","direction","menuOptionsLength","newKeyboardOptionIndex","focusInput","focusOption","scrollOptionIntoView","optionIndex","Number","currentTarget","timeToValue","update","updateAndClose","_this$button$current3","target","_this$menuContainer$c","activeOption","querySelector","HTMLElement","valueIndex","map","indexOf","_this$input$current","index","_this$menuContainer$c2","children","item","openMenu","updateKeyboardIndex","focusButton","arguments","undefined","_this$button$current4","_this$menuContainer$c3","offsetTop","DROP_DOWN_MENU_HEIGHT","scrollTop","renderMenuElement","className","ref","role","onKeyDown","onClick","style","renderOptions","icon","customText","matchFound","optionArray","concat","push","type","onFocus","onBlur","render","disabled","invalid","dataTestId","popperOptions","_objectSpread","placement","modifiers","preventOverflow","enabled","isShown","actions","menuElement","popperClassName","onMenuOpened","onMenuClosed","menuStyle","maxWidth","Math","round","time"],"sources":["../src/CustomTimeSelect.tsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { type PopperOptions } from 'popper.js';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsCheck, type IconDefinition } from '@deephaven/icons';\nimport { TimeUtils } from '@deephaven/utils';\nimport classNames from 'classnames';\nimport TimeInput, { type TimeInputElement } from './TimeInput';\nimport DropdownMenu from './menu-actions/DropdownMenu';\nimport './CustomTimeSelect.scss';\n\nconst CUSTOM_OPTION = -1;\n\nenum MENU_NAVIGATION_DIRECTION {\n  UP = 'UP',\n  DOWN = 'DOWN',\n}\n\ntype CustomTimeSelectProps = {\n  options: { title: string; value: number }[];\n  popperOptions: PopperOptions;\n  value: number | null;\n  onChange: (value: number) => void;\n  disabled: boolean;\n  icon: IconDefinition;\n  placeholder: string;\n  customText: string;\n  // Defaults to converting the value in milliseconds to time in seconds\n  valueToTime: (val: number | null) => number;\n  // Defaults to converting the time in seconds to value in milliseconds\n  timeToValue: (time: number) => number;\n  invalid: boolean;\n  'data-testid'?: string;\n};\n\ntype TimeInSeconds = number;\n\ntype CustomTimeSelectState = {\n  keyboardOptionIndex: number;\n  menuIsOpen: boolean;\n  inputWidth: number;\n  customTime: TimeInSeconds;\n  inputFocused: boolean;\n};\n\nclass CustomTimeSelect extends Component<\n  CustomTimeSelectProps,\n  CustomTimeSelectState\n> {\n  static MENU_NAVIGATION_DIRECTION = MENU_NAVIGATION_DIRECTION;\n\n  static DROP_DOWN_MENU_HEIGHT = 125;\n\n  static defaultProps: Partial<CustomTimeSelectProps> = {\n    onChange(): void {\n      // no-op\n    },\n    value: null,\n    disabled: false,\n    popperOptions: {},\n    icon: vsCheck,\n    customText: 'Custom',\n    placeholder: 'Select a time',\n    valueToTime: value => (value === null ? 0 : Math.round(value / 1000)),\n    timeToValue: time => time * 1000,\n    invalid: false,\n    'data-testid': undefined,\n  };\n\n  constructor(props: CustomTimeSelectProps) {\n    super(props);\n\n    const { value, valueToTime } = props;\n\n    this.toggleMenu = this.toggleMenu.bind(this);\n    this.handleMenuKeyDown = this.handleMenuKeyDown.bind(this);\n    this.closeMenu = this.closeMenu.bind(this);\n\n    this.handleOptionClick = this.handleOptionClick.bind(this);\n    this.handleOptionFocus = this.handleOptionFocus.bind(this);\n\n    this.handleMenuOpened = this.handleMenuOpened.bind(this);\n    this.handleMenuExited = this.handleMenuExited.bind(this);\n    this.handleCustomInput = this.handleCustomInput.bind(this);\n\n    this.csContainer = React.createRef();\n    this.menuContainer = React.createRef();\n    this.button = React.createRef();\n    this.input = React.createRef();\n\n    this.state = {\n      keyboardOptionIndex: 0,\n      menuIsOpen: false,\n      inputWidth: 100,\n      customTime: valueToTime(value),\n      inputFocused: false,\n    };\n  }\n\n  csContainer: React.RefObject<HTMLDivElement>;\n\n  menuContainer: React.RefObject<HTMLDivElement>;\n\n  button: React.RefObject<HTMLButtonElement>;\n\n  input: React.RefObject<TimeInputElement>;\n\n  getSelectedText(): string {\n    const { options, value, placeholder } = this.props;\n    const { customTime } = this.state;\n\n    if (value === null) {\n      return placeholder;\n    }\n\n    for (let i = 0; i < options.length; i += 1) {\n      const option = options[i];\n      if (option.value === value) {\n        return option.title;\n      }\n    }\n\n    return TimeUtils.formatTime(customTime);\n  }\n\n  setInputWidth(): void {\n    if (this.csContainer.current) {\n      this.setState({\n        inputWidth: this.csContainer.current.getBoundingClientRect().width,\n      });\n    }\n  }\n\n  focus(): void {\n    this.button.current?.focus();\n  }\n\n  updateInputValue(value: number): void {\n    const { onChange } = this.props;\n    onChange(value);\n  }\n\n  handleResize(): void {\n    this.setInputWidth();\n  }\n\n  handleMenuKeyDown(event: React.KeyboardEvent<HTMLDivElement>): void {\n    const { keyboardOptionIndex, inputFocused } = this.state;\n    const { options } = this.props;\n\n    switch (event.key) {\n      case 'Enter':\n      case ' ': // Space Bar\n        if (inputFocused) {\n          this.updateFromCustom();\n        } else {\n          this.updateInputValue(options[keyboardOptionIndex].value);\n        }\n        this.closeMenu();\n        this.button.current?.focus();\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'Tab':\n        if (event.shiftKey) {\n          this.handleMenuNavigation(\n            CustomTimeSelect.MENU_NAVIGATION_DIRECTION.UP\n          );\n        } else {\n          this.handleMenuNavigation(\n            CustomTimeSelect.MENU_NAVIGATION_DIRECTION.DOWN\n          );\n        }\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'ArrowUp':\n        this.handleMenuNavigation(\n          CustomTimeSelect.MENU_NAVIGATION_DIRECTION.UP\n        );\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'ArrowDown':\n        this.handleMenuNavigation(\n          CustomTimeSelect.MENU_NAVIGATION_DIRECTION.DOWN\n        );\n        event.stopPropagation();\n        event.preventDefault();\n        break;\n      case 'Escape':\n        this.closeMenu();\n        break;\n      default:\n        break;\n    }\n  }\n\n  handleMenuNavigation(direction: MENU_NAVIGATION_DIRECTION): void {\n    const { keyboardOptionIndex, inputFocused } = this.state;\n    const { options } = this.props;\n    const menuOptionsLength = options.length;\n    let newKeyboardOptionIndex = keyboardOptionIndex;\n    switch (direction) {\n      case CustomTimeSelect.MENU_NAVIGATION_DIRECTION.UP:\n        if (!inputFocused && keyboardOptionIndex === 0) {\n          this.focusInput();\n          break;\n        } else if (inputFocused) {\n          this.focusOption(keyboardOptionIndex);\n        }\n\n        if (keyboardOptionIndex > 0 && !inputFocused) {\n          newKeyboardOptionIndex =\n            (newKeyboardOptionIndex - 1) % menuOptionsLength;\n          this.setState({\n            keyboardOptionIndex: newKeyboardOptionIndex,\n          });\n        } else if (keyboardOptionIndex === 0) {\n          newKeyboardOptionIndex = menuOptionsLength - 1;\n          this.setState({\n            keyboardOptionIndex: newKeyboardOptionIndex,\n          });\n        }\n        this.scrollOptionIntoView(newKeyboardOptionIndex);\n        break;\n      case CustomTimeSelect.MENU_NAVIGATION_DIRECTION.DOWN:\n        if (!inputFocused && keyboardOptionIndex === menuOptionsLength - 1) {\n          this.focusInput();\n          break;\n        } else if (inputFocused) {\n          this.focusOption(keyboardOptionIndex);\n        }\n\n        if (\n          keyboardOptionIndex < menuOptionsLength &&\n          !(inputFocused && keyboardOptionIndex === 0)\n        ) {\n          newKeyboardOptionIndex =\n            (newKeyboardOptionIndex + 1) % menuOptionsLength;\n          this.setState({\n            keyboardOptionIndex: newKeyboardOptionIndex,\n          });\n        }\n        this.scrollOptionIntoView(newKeyboardOptionIndex);\n        break;\n      default:\n        break;\n    }\n  }\n\n  handleOptionClick(event: React.MouseEvent<HTMLButtonElement>): void {\n    const optionIndex = Number(event.currentTarget.value);\n    const { options, timeToValue } = this.props;\n    const { customTime } = this.state;\n\n    if (optionIndex === CUSTOM_OPTION) {\n      const update = timeToValue(customTime);\n      this.updateAndClose(update);\n    } else {\n      this.updateAndClose(options[optionIndex].value);\n    }\n  }\n\n  updateAndClose(update: number): void {\n    this.updateInputValue(update);\n    this.closeMenu();\n    this.button.current?.focus();\n  }\n\n  handleOptionFocus(event: React.FocusEvent<HTMLButtonElement>): void {\n    this.setState({ keyboardOptionIndex: Number(event.target.value) });\n  }\n\n  handleMenuOpened(): void {\n    const { options, value } = this.props;\n    const { keyboardOptionIndex } = this.state;\n    this.scrollOptionIntoView(keyboardOptionIndex);\n    const activeOption = this.menuContainer.current?.querySelector(\n      '.cs-option-btn.keyboard-active'\n    );\n    if (activeOption instanceof HTMLElement) {\n      activeOption.focus();\n    }\n\n    if (value === null) {\n      return;\n    }\n    const valueIndex = options.map(option => option.value).indexOf(value);\n    if (valueIndex < 0) {\n      // The custom option should be selected\n      this.focusInput();\n    }\n  }\n\n  focusInput(): void {\n    this.input.current?.focus();\n  }\n\n  focusOption(index: number): void {\n    const options = this.menuContainer.current?.querySelector('.cs-options');\n    if (options && options.children != null) {\n      const option = options.children.item(index);\n      if (option instanceof HTMLElement) {\n        option.focus();\n      }\n    }\n  }\n\n  handleMenuExited(): void {\n    const { menuIsOpen } = this.state;\n    if (menuIsOpen) {\n      this.setState({ menuIsOpen: false, keyboardOptionIndex: 0 });\n    }\n  }\n\n  handleCustomInput(value: number): void {\n    const { timeToValue } = this.props;\n\n    const update = timeToValue(value);\n    this.updateInputValue(update);\n    this.setState({\n      customTime: value,\n    });\n  }\n\n  updateFromCustom(): void {\n    const { timeToValue } = this.props;\n    const { customTime } = this.state;\n\n    const update = timeToValue(customTime);\n    this.updateInputValue(update);\n  }\n\n  toggleMenu(event: React.MouseEvent<HTMLButtonElement>): void {\n    const { menuIsOpen } = this.state;\n    if (menuIsOpen) {\n      this.closeMenu();\n    } else {\n      this.openMenu();\n    }\n    event.stopPropagation();\n  }\n\n  openMenu(): void {\n    this.updateKeyboardIndex();\n    this.setInputWidth();\n    this.setState({ menuIsOpen: true });\n  }\n\n  closeMenu(focusButton = true): void {\n    this.setState({ menuIsOpen: false });\n    if (focusButton) {\n      this.button.current?.focus();\n    }\n  }\n\n  updateKeyboardIndex(): void {\n    const { options, value } = this.props;\n    if (value === null) {\n      return;\n    }\n    const valueIndex = options.map(option => option.value).indexOf(value);\n    if (valueIndex > 0) {\n      this.setState({ keyboardOptionIndex: valueIndex });\n    }\n  }\n\n  scrollOptionIntoView(index: number): void {\n    const options = this.menuContainer.current?.querySelector('.cs-options');\n    if (options && options.children != null) {\n      const activeOption = options.children.item(index);\n      if (\n        activeOption instanceof HTMLElement &&\n        activeOption.offsetTop > CustomTimeSelect.DROP_DOWN_MENU_HEIGHT\n      ) {\n        options.scrollTop =\n          activeOption.offsetTop - CustomTimeSelect.DROP_DOWN_MENU_HEIGHT;\n      } else if (\n        (activeOption instanceof HTMLElement && activeOption.offsetTop < 0) ||\n        index === 0\n      ) {\n        options.scrollTop = 0;\n      }\n    }\n  }\n\n  renderMenuElement(): JSX.Element {\n    const { inputWidth } = this.state;\n    return (\n      <div\n        className=\"cs-menu-container\"\n        ref={this.menuContainer}\n        role=\"presentation\"\n        onKeyDown={this.handleMenuKeyDown}\n        onClick={event => {\n          event.stopPropagation();\n        }}\n        style={{ width: inputWidth }}\n      >\n        <div className=\"cs-options-container\">\n          <div className=\"cs-options\">{this.renderOptions()}</div>\n        </div>\n      </div>\n    );\n  }\n\n  renderOptions(): React.ReactNode {\n    const { options, value, icon, customText } = this.props;\n    const { keyboardOptionIndex, customTime, inputFocused } = this.state;\n\n    let matchFound = false;\n    const optionArray: JSX.Element[] = [];\n    for (let index = 0; index < options.length; index += 1) {\n      const option = options[index];\n      const key = `option-${index}-${option.value}`;\n      matchFound = matchFound || option.value === value;\n      optionArray.push(\n        <button\n          key={key}\n          type=\"button\"\n          value={index}\n          className={classNames('cs-option-btn', {\n            'keyboard-active': keyboardOptionIndex === index && !inputFocused,\n          })}\n          onClick={this.handleOptionClick}\n          onFocus={this.handleOptionFocus}\n        >\n          {option.value === value && (\n            <FontAwesomeIcon icon={icon} className=\"mr-2\" />\n          )}\n          {option.value !== value && <span className=\"mr-4\" />}\n          {option.title}\n        </button>\n      );\n    }\n\n    optionArray.push(<hr className=\"cs-divider\" key=\"option-divider\" />);\n\n    optionArray.push(\n      <button\n        key=\"option-custom-label\"\n        type=\"button\"\n        value={CUSTOM_OPTION}\n        className={classNames('cs-option-btn', {\n          'keyboard-active': inputFocused,\n        })}\n        onClick={this.handleOptionClick}\n        onFocus={this.handleOptionFocus}\n      >\n        {!matchFound && value !== null ? (\n          <FontAwesomeIcon icon={icon} className=\"mr-2\" />\n        ) : (\n          <span className=\"mr-4\" />\n        )}\n        {customText}\n      </button>\n    );\n\n    optionArray.push(\n      <div key=\"cs-custom-container\" className=\"cs-custom-container\">\n        <span className=\"mr-2\" />\n        <TimeInput\n          key=\"option-input\"\n          ref={this.input}\n          onChange={this.handleCustomInput}\n          value={customTime}\n          onFocus={() => this.setState({ inputFocused: true })}\n          onBlur={() => this.setState({ inputFocused: false })}\n        />\n        <span className=\"ml-2\" />\n      </div>\n    );\n\n    optionArray.push(<hr key=\"option-end\" className=\"mb-2\" />);\n\n    return optionArray;\n  }\n\n  render(): JSX.Element {\n    const { disabled, invalid, value, 'data-testid': dataTestId } = this.props;\n    const { menuIsOpen } = this.state;\n    let { popperOptions } = this.props;\n    popperOptions = {\n      placement: 'bottom-end',\n      modifiers: {\n        preventOverflow: { enabled: false },\n      },\n      ...popperOptions,\n    };\n\n    return (\n      <div\n        className=\"input-group cs-container context-menu\"\n        ref={this.csContainer}\n        data-testid={dataTestId}\n      >\n        <div\n          className={classNames('input-group-append cs-dropdown', {\n            'cs-dropdown-invalid': invalid,\n          })}\n        >\n          <button\n            type=\"button\"\n            className={classNames('btn cs-btn form-control', {\n              'cs-btn-invalid': invalid,\n            })}\n            ref={this.button}\n            onClick={this.toggleMenu}\n            disabled={disabled}\n          >\n            <span\n              className={classNames({\n                'text-muted': value === null,\n              })}\n            >\n              {this.getSelectedText()}\n            </span>\n            <span className=\"cs-caret\" />\n            <DropdownMenu\n              isShown={menuIsOpen}\n              actions={{ menuElement: this.renderMenuElement() }}\n              popperOptions={popperOptions}\n              popperClassName=\"CustomTimeSelect\"\n              onMenuOpened={this.handleMenuOpened}\n              onMenuClosed={this.handleMenuExited}\n              menuStyle={{ maxWidth: '100rem' }}\n            />\n          </button>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default CustomTimeSelect;\n"],"mappings":"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","ignoreList":[]}

package/dist/DateInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.js","names":["React","useCallback","useState","classNames","Log","MaskedInput","getNextSegmentValue","jsx","_jsx","log","module","DATE_PATTERN","EXAMPLES","DATE_FORMAT","DateInput","forwardRef","props","ref","className","onChange","undefined","defaultValue","onFocus","onBlur","dataTestId","value","setValue","selection","setSelection","handleChange","newValue","debug","children","example","onSelect","pattern","placeholder","displayName"],"sources":["../src/DateInput.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport MaskedInput, { type SelectionSegment } from './MaskedInput';\nimport { getNextSegmentValue } from './DateInputUtils';\n\nconst log = Log.module('DateInput');\n\nconst DATE_PATTERN = '[12][0-9]{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])';\nconst EXAMPLES = ['2000-01-01', '2022-12-31'];\nconst DATE_FORMAT = 'YYYY-MM-DD';\n\ntype DateInputProps = {\n  className?: string;\n  onChange?: (date: string) => void;\n  defaultValue?: string;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  'data-testid'?: string;\n};\n\nconst DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n  (props: DateInputProps, ref) => {\n    const {\n      className = '',\n      onChange = () => undefined,\n      defaultValue = '',\n      onFocus = () => undefined,\n      onBlur = () => undefined,\n      'data-testid': dataTestId,\n    } = props;\n    const [value, setValue] = useState(defaultValue);\n    const [selection, setSelection] = useState<SelectionSegment>();\n\n    const handleChange = useCallback(\n      (newValue: string): void => {\n        log.debug('handleChange', newValue);\n        setValue(newValue);\n        onChange(newValue);\n      },\n      [onChange]\n    );\n\n    return (\n      <div className=\"d-flex flex-row align-items-center\">\n        <MaskedInput\n          ref={ref}\n          className={classNames(className)}\n          example={EXAMPLES}\n          getNextSegmentValue={getNextSegmentValue}\n          onChange={handleChange}\n          onSelect={setSelection}\n          pattern={DATE_PATTERN}\n          placeholder={DATE_FORMAT}\n          selection={selection}\n          value={value}\n          onFocus={onFocus}\n          onBlur={onBlur}\n          data-testid={dataTestId}\n        />\n      </div>\n    );\n  }\n);\nDateInput.displayName = 'DateInput';\n\nexport default DateInput;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACpD,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,GAAG,MAAM,gBAAgB;AAAC,OAC1BC,WAAW;AAAA,SACTC,mBAAmB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAE5B,IAAMC,GAAG,GAAGL,GAAG,CAACM,MAAM,CAAC,WAAW,CAAC;AAEnC,IAAMC,YAAY,GAAG,yDAAyD;AAC9E,IAAMC,QAAQ,GAAG,CAAC,YAAY,EAAE,YAAY,CAAC;AAC7C,IAAMC,WAAW,GAAG,YAAY;AAWhC,IAAMC,SAAS,gBAAGd,KAAK,CAACe,UAAU,CAChC,CAACC,KAAqB,EAAEC,GAAG,KAAK;EAC9B,IAAM;IACJC,SAAS,GAAG,EAAE;IACdC,QAAQ,GAAGA,CAAA,KAAMC,SAAS;IAC1BC,YAAY,GAAG,EAAE;IACjBC,OAAO,GAAGA,CAAA,KAAMF,SAAS;IACzBG,MAAM,GAAGA,CAAA,KAAMH,SAAS;IACxB,aAAa,EAAEI;EACjB,CAAC,GAAGR,KAAK;EACT,IAAM,CAACS,KAAK,EAAEC,QAAQ,CAAC,GAAGxB,QAAQ,CAACmB,YAAY,CAAC;EAChD,IAAM,CAACM,SAAS,EAAEC,YAAY,CAAC,GAAG1B,QAAQ,CAAmB,CAAC;EAE9D,IAAM2B,YAAY,GAAG5B,WAAW,CAC7B6B,QAAgB,IAAW;IAC1BrB,GAAG,CAACsB,KAAK,CAAC,cAAc,EAAED,QAAQ,CAAC;IACnCJ,QAAQ,CAACI,QAAQ,CAAC;IAClBX,QAAQ,CAACW,QAAQ,CAAC;EACpB,CAAC,EACD,CAACX,QAAQ,CACX,CAAC;EAED,oBACEX,IAAA;IAAKU,SAAS,EAAC,oCAAoC;IAAAc,QAAA,eACjDxB,IAAA,CAACH,WAAW;MACVY,GAAG,EAAEA,GAAI;MACTC,SAAS,EAAEf,UAAU,CAACe,SAAS,CAAE;MACjCe,OAAO,EAAErB,QAAS;MAClBN,mBAAmB,EAAEA,mBAAoB;MACzCa,QAAQ,EAAEU,YAAa;MACvBK,QAAQ,EAAEN,YAAa;MACvBO,OAAO,EAAExB,YAAa;MACtByB,WAAW,EAAEvB,WAAY;MACzBc,SAAS,EAAEA,SAAU;MACrBF,KAAK,EAAEA,KAAM;MACbH,OAAO,EAAEA,OAAQ;MACjBC,MAAM,EAAEA,MAAO;MACf,eAAaC;IAAW,CACzB;EAAC,CACC,CAAC;AAEV,CACF,CAAC;AACDV,SAAS,CAACuB,WAAW,GAAG,WAAW;AAEnC,eAAevB,SAAS"}
+{"version":3,"file":"DateInput.js","names":["React","useCallback","useState","classNames","Log","MaskedInput","getNextSegmentValue","jsx","_jsx","log","module","DATE_PATTERN","EXAMPLES","DATE_FORMAT","DateInput","forwardRef","props","ref","className","onChange","undefined","defaultValue","onFocus","onBlur","dataTestId","value","setValue","selection","setSelection","handleChange","newValue","debug","children","example","onSelect","pattern","placeholder","displayName"],"sources":["../src/DateInput.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport MaskedInput, { type SelectionSegment } from './MaskedInput';\nimport { getNextSegmentValue } from './DateInputUtils';\n\nconst log = Log.module('DateInput');\n\nconst DATE_PATTERN = '[12][0-9]{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])';\nconst EXAMPLES = ['2000-01-01', '2022-12-31'];\nconst DATE_FORMAT = 'YYYY-MM-DD';\n\ntype DateInputProps = {\n  className?: string;\n  onChange?: (date: string) => void;\n  defaultValue?: string;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  'data-testid'?: string;\n};\n\nconst DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n  (props: DateInputProps, ref) => {\n    const {\n      className = '',\n      onChange = () => undefined,\n      defaultValue = '',\n      onFocus = () => undefined,\n      onBlur = () => undefined,\n      'data-testid': dataTestId,\n    } = props;\n    const [value, setValue] = useState(defaultValue);\n    const [selection, setSelection] = useState<SelectionSegment>();\n\n    const handleChange = useCallback(\n      (newValue: string): void => {\n        log.debug('handleChange', newValue);\n        setValue(newValue);\n        onChange(newValue);\n      },\n      [onChange]\n    );\n\n    return (\n      <div className=\"d-flex flex-row align-items-center\">\n        <MaskedInput\n          ref={ref}\n          className={classNames(className)}\n          example={EXAMPLES}\n          getNextSegmentValue={getNextSegmentValue}\n          onChange={handleChange}\n          onSelect={setSelection}\n          pattern={DATE_PATTERN}\n          placeholder={DATE_FORMAT}\n          selection={selection}\n          value={value}\n          onFocus={onFocus}\n          onBlur={onBlur}\n          data-testid={dataTestId}\n        />\n      </div>\n    );\n  }\n);\nDateInput.displayName = 'DateInput';\n\nexport default DateInput;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACpD,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,GAAG,MAAM,gBAAgB;AAAC,OAC1BC,WAAW;AAAA,SACTC,mBAAmB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAE5B,IAAMC,GAAG,GAAGL,GAAG,CAACM,MAAM,CAAC,WAAW,CAAC;AAEnC,IAAMC,YAAY,GAAG,yDAAyD;AAC9E,IAAMC,QAAQ,GAAG,CAAC,YAAY,EAAE,YAAY,CAAC;AAC7C,IAAMC,WAAW,GAAG,YAAY;AAWhC,IAAMC,SAAS,gBAAGd,KAAK,CAACe,UAAU,CAChC,CAACC,KAAqB,EAAEC,GAAG,KAAK;EAC9B,IAAM;IACJC,SAAS,GAAG,EAAE;IACdC,QAAQ,GAAGA,CAAA,KAAMC,SAAS;IAC1BC,YAAY,GAAG,EAAE;IACjBC,OAAO,GAAGA,CAAA,KAAMF,SAAS;IACzBG,MAAM,GAAGA,CAAA,KAAMH,SAAS;IACxB,aAAa,EAAEI;EACjB,CAAC,GAAGR,KAAK;EACT,IAAM,CAACS,KAAK,EAAEC,QAAQ,CAAC,GAAGxB,QAAQ,CAACmB,YAAY,CAAC;EAChD,IAAM,CAACM,SAAS,EAAEC,YAAY,CAAC,GAAG1B,QAAQ,CAAmB,CAAC;EAE9D,IAAM2B,YAAY,GAAG5B,WAAW,CAC7B6B,QAAgB,IAAW;IAC1BrB,GAAG,CAACsB,KAAK,CAAC,cAAc,EAAED,QAAQ,CAAC;IACnCJ,QAAQ,CAACI,QAAQ,CAAC;IAClBX,QAAQ,CAACW,QAAQ,CAAC;EACpB,CAAC,EACD,CAACX,QAAQ,CACX,CAAC;EAED,oBACEX,IAAA;IAAKU,SAAS,EAAC,oCAAoC;IAAAc,QAAA,eACjDxB,IAAA,CAACH,WAAW;MACVY,GAAG,EAAEA,GAAI;MACTC,SAAS,EAAEf,UAAU,CAACe,SAAS,CAAE;MACjCe,OAAO,EAAErB,QAAS;MAClBN,mBAAmB,EAAEA,mBAAoB;MACzCa,QAAQ,EAAEU,YAAa;MACvBK,QAAQ,EAAEN,YAAa;MACvBO,OAAO,EAAExB,YAAa;MACtByB,WAAW,EAAEvB,WAAY;MACzBc,SAAS,EAAEA,SAAU;MACrBF,KAAK,EAAEA,KAAM;MACbH,OAAO,EAAEA,OAAQ;MACjBC,MAAM,EAAEA,MAAO;MACf,eAAaC;IAAW,CACzB;EAAC,CACC,CAAC;AAEV,CACF,CAAC;AACDV,SAAS,CAACuB,WAAW,GAAG,WAAW;AAEnC,eAAevB,SAAS","ignoreList":[]}

package/dist/DateInputUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInputUtils.js","names":["getNextNumberSegmentValue","delta","segmentValue","lowerBound","upperBound","length","modValue","newSegmentValue","parseInt","concat","padStart","getNextSegmentValue","range","selectionStart"],"sources":["../src/DateInputUtils.ts"],"sourcesContent":["import { type SelectionSegment } from './MaskedInput';\n\nexport function getNextNumberSegmentValue(\n  delta: number,\n  segmentValue: string,\n  lowerBound: number,\n  upperBound: number,\n  length: number\n): string {\n  const modValue = upperBound - lowerBound + 1;\n  const newSegmentValue =\n    ((((parseInt(segmentValue, 10) - delta - lowerBound) % modValue) +\n      modValue) %\n      modValue) +\n    lowerBound;\n  return `${newSegmentValue}`.padStart(length, '0');\n}\n\nexport function getNextSegmentValue(\n  range: SelectionSegment,\n  delta: number,\n  segmentValue: string\n): string {\n  const { selectionStart } = range;\n  if (selectionStart === 0) {\n    return getNextNumberSegmentValue(delta, segmentValue, 1900, 2099, 4);\n  }\n  if (selectionStart === 5) {\n    return getNextNumberSegmentValue(delta, segmentValue, 1, 12, 2);\n  }\n  if (selectionStart === 8) {\n    return getNextNumberSegmentValue(delta, segmentValue, 1, 31, 2);\n  }\n  if (selectionStart === 11) {\n    // Hours input\n    return getNextNumberSegmentValue(delta, segmentValue, 0, 23, 2);\n  }\n  if (selectionStart === 17 || selectionStart === 14) {\n    // Minutes/seconds input\n    return getNextNumberSegmentValue(delta, segmentValue, 0, 59, 2);\n  }\n  if (selectionStart === 20 || selectionStart === 24 || selectionStart === 28) {\n    // Milli, micro, and nanosecond input\n    return getNextNumberSegmentValue(delta, segmentValue, 0, 999, 3);\n  }\n\n  return segmentValue;\n}\n"],"mappings":"AAEA,OAAO,SAASA,yBAAyBA,CACvCC,KAAa,EACbC,YAAoB,EACpBC,UAAkB,EAClBC,UAAkB,EAClBC,MAAc,EACN;EACR,IAAMC,QAAQ,GAAGF,UAAU,GAAGD,UAAU,GAAG,CAAC;EAC5C,IAAMI,eAAe,GAClB,CAAE,CAACC,QAAQ,CAACN,YAAY,EAAE,EAAE,CAAC,GAAGD,KAAK,GAAGE,UAAU,IAAIG,QAAQ,GAC7DA,QAAQ,IACRA,QAAQ,GACVH,UAAU;EACZ,OAAO,GAAAM,MAAA,CAAGF,eAAe,EAAGG,QAAQ,CAACL,MAAM,EAAE,GAAG,CAAC;AACnD;AAEA,OAAO,SAASM,mBAAmBA,CACjCC,KAAuB,EACvBX,KAAa,EACbC,YAAoB,EACZ;EACR,IAAM;IAAEW;EAAe,CAAC,GAAGD,KAAK;EAChC,IAAIC,cAAc,KAAK,CAAC,EAAE;IACxB,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;EACtE;EACA,IAAIW,cAAc,KAAK,CAAC,EAAE;IACxB,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,CAAC,EAAE;IACxB,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,EAAE,EAAE;IACzB;IACA,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,EAAE,IAAIA,cAAc,KAAK,EAAE,EAAE;IAClD;IACA,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,EAAE,IAAIA,cAAc,KAAK,EAAE,IAAIA,cAAc,KAAK,EAAE,EAAE;IAC3E;IACA,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;EAClE;EAEA,OAAOA,YAAY;AACrB"}
+{"version":3,"file":"DateInputUtils.js","names":["getNextNumberSegmentValue","delta","segmentValue","lowerBound","upperBound","length","modValue","newSegmentValue","parseInt","concat","padStart","getNextSegmentValue","range","selectionStart"],"sources":["../src/DateInputUtils.ts"],"sourcesContent":["import { type SelectionSegment } from './MaskedInput';\n\nexport function getNextNumberSegmentValue(\n  delta: number,\n  segmentValue: string,\n  lowerBound: number,\n  upperBound: number,\n  length: number\n): string {\n  const modValue = upperBound - lowerBound + 1;\n  const newSegmentValue =\n    ((((parseInt(segmentValue, 10) - delta - lowerBound) % modValue) +\n      modValue) %\n      modValue) +\n    lowerBound;\n  return `${newSegmentValue}`.padStart(length, '0');\n}\n\nexport function getNextSegmentValue(\n  range: SelectionSegment,\n  delta: number,\n  segmentValue: string\n): string {\n  const { selectionStart } = range;\n  if (selectionStart === 0) {\n    return getNextNumberSegmentValue(delta, segmentValue, 1900, 2099, 4);\n  }\n  if (selectionStart === 5) {\n    return getNextNumberSegmentValue(delta, segmentValue, 1, 12, 2);\n  }\n  if (selectionStart === 8) {\n    return getNextNumberSegmentValue(delta, segmentValue, 1, 31, 2);\n  }\n  if (selectionStart === 11) {\n    // Hours input\n    return getNextNumberSegmentValue(delta, segmentValue, 0, 23, 2);\n  }\n  if (selectionStart === 17 || selectionStart === 14) {\n    // Minutes/seconds input\n    return getNextNumberSegmentValue(delta, segmentValue, 0, 59, 2);\n  }\n  if (selectionStart === 20 || selectionStart === 24 || selectionStart === 28) {\n    // Milli, micro, and nanosecond input\n    return getNextNumberSegmentValue(delta, segmentValue, 0, 999, 3);\n  }\n\n  return segmentValue;\n}\n"],"mappings":"AAEA,OAAO,SAASA,yBAAyBA,CACvCC,KAAa,EACbC,YAAoB,EACpBC,UAAkB,EAClBC,UAAkB,EAClBC,MAAc,EACN;EACR,IAAMC,QAAQ,GAAGF,UAAU,GAAGD,UAAU,GAAG,CAAC;EAC5C,IAAMI,eAAe,GAClB,CAAE,CAACC,QAAQ,CAACN,YAAY,EAAE,EAAE,CAAC,GAAGD,KAAK,GAAGE,UAAU,IAAIG,QAAQ,GAC7DA,QAAQ,IACRA,QAAQ,GACVH,UAAU;EACZ,OAAO,GAAAM,MAAA,CAAGF,eAAe,EAAGG,QAAQ,CAACL,MAAM,EAAE,GAAG,CAAC;AACnD;AAEA,OAAO,SAASM,mBAAmBA,CACjCC,KAAuB,EACvBX,KAAa,EACbC,YAAoB,EACZ;EACR,IAAM;IAAEW;EAAe,CAAC,GAAGD,KAAK;EAChC,IAAIC,cAAc,KAAK,CAAC,EAAE;IACxB,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;EACtE;EACA,IAAIW,cAAc,KAAK,CAAC,EAAE;IACxB,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,CAAC,EAAE;IACxB,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,EAAE,EAAE;IACzB;IACA,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,EAAE,IAAIA,cAAc,KAAK,EAAE,EAAE;IAClD;IACA,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;EACjE;EACA,IAAIW,cAAc,KAAK,EAAE,IAAIA,cAAc,KAAK,EAAE,IAAIA,cAAc,KAAK,EAAE,EAAE;IAC3E;IACA,OAAOb,yBAAyB,CAACC,KAAK,EAAEC,YAAY,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;EAClE;EAEA,OAAOA,YAAY;AACrB","ignoreList":[]}

package/dist/DateTimeInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../src/DateTimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,aAAa,EAAyB,MAAM,OAAO,CAAC;AAoBzE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAiBF,eAAO,MAAM,aAAa,6FA0DxB,CAAC;AAaH,eAAe,aAAa,CAAC"}
+{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../src/DateTimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,aAAa,EAAyB,MAAM,OAAO,CAAC;AAoBzE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAiBF,eAAO,MAAM,aAAa,6FA0DxB,CAAC;AAIH,eAAe,aAAa,CAAC"}

package/dist/DateTimeInput.js

@@ -74,13 +74,5 @@ export var DateTimeInput = /*#__PURE__*/React.forwardRef((props, ref) => {
   });
 });
 DateTimeInput.displayName = 'DateTimeInput';
-DateTimeInput.defaultProps = {
-  className: '',
-  onChange: () => undefined,
-  defaultValue: '',
-  onFocus: () => undefined,
-  onBlur: () => undefined,
-  'data-testid': undefined
-};
 export default DateTimeInput;
 //# sourceMappingURL=DateTimeInput.js.map

package/dist/DateTimeInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimeInput.js","names":["React","useCallback","useState","classNames","Log","MaskedInput","getNextSegmentValue","addSeparators","jsx","_jsx","log","module","DATE_PATTERN","TIME_PATTERN","FULL_DATE_PATTERN","concat","DATE_VALUE_STRING","DEFAULT_VALUE_STRING","FULL_DATE_FORMAT","fixIncompleteValue","value","length","substring","replace","removeSeparators","EXAMPLES","DateTimeInput","forwardRef","props","ref","className","onChange","undefined","defaultValue","onFocus","onBlur","onSubmit","dataTestId","setValue","selection","setSelection","handleChange","newValue","debug","handleBlur","prevValue","fixedValue","children","example","onSelect","pattern","placeholder","displayName","defaultProps"],"sources":["../src/DateTimeInput.tsx"],"sourcesContent":["import React, { type KeyboardEvent, useCallback, useState } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport MaskedInput, { type SelectionSegment } from './MaskedInput';\nimport { getNextSegmentValue } from './DateInputUtils';\nimport { addSeparators } from './DateTimeInputUtils';\n\nconst log = Log.module('DateTimeInput');\n\n// This could be more restrictive and restrict days to the number of days in the month...\n// But then gotta take leap year into account and everything.\nconst DATE_PATTERN = '[12][0-9]{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])';\n// Put zero width spaces in the nanosecond part of the date to allow jumping between segments\nconst TIME_PATTERN =\n  '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]\\\\.[0-9]{3}\\u200B[0-9]{3}\\u200B[0-9]{3}';\nconst FULL_DATE_PATTERN = `${DATE_PATTERN} ${TIME_PATTERN}`;\nconst DATE_VALUE_STRING = '2022-01-01';\nconst DEFAULT_VALUE_STRING = `${DATE_VALUE_STRING} 00:00:00.000000000`;\nconst FULL_DATE_FORMAT = 'YYYY-MM-DD HH:MM:SS.SSSSSSSSS';\n\nexport type DateTimeInputProps = {\n  className?: string;\n  onChange?: (value: string) => void;\n  defaultValue?: string;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onSubmit?: (event: KeyboardEvent<HTMLInputElement>) => void;\n  'data-testid'?: string;\n};\n\nfunction fixIncompleteValue(value: string): string {\n  if (value != null && value.length >= DATE_VALUE_STRING.length) {\n    return `${value.substring(0, DATE_VALUE_STRING.length)}${value\n      .substring(DATE_VALUE_STRING.length)\n      .replace(/\\u2007/g, '0')}${DEFAULT_VALUE_STRING.substring(value.length)}`;\n  }\n  return value;\n}\n\nfunction removeSeparators(value: string): string {\n  return value.replace(/\\u200B/g, '');\n}\n\nconst EXAMPLES = [addSeparators(DEFAULT_VALUE_STRING)];\n\nexport const DateTimeInput = React.forwardRef<\n  HTMLInputElement,\n  DateTimeInputProps\n>((props, ref) => {\n  const {\n    className = '',\n    onChange = () => undefined,\n    defaultValue = '',\n    onFocus = () => undefined,\n    onBlur = () => undefined,\n    onSubmit,\n    'data-testid': dataTestId,\n  } = props;\n  const [value, setValue] = useState(\n    defaultValue.length > 0 ? addSeparators(defaultValue) : ''\n  );\n  const [selection, setSelection] = useState<SelectionSegment>();\n\n  const handleChange = useCallback(\n    (newValue: string): void => {\n      log.debug('handleChange', newValue);\n      setValue(newValue);\n      onChange(fixIncompleteValue(removeSeparators(newValue)));\n    },\n    [onChange]\n  );\n\n  const handleBlur = useCallback((): void => {\n    const prevValue = removeSeparators(value);\n    const fixedValue = fixIncompleteValue(prevValue);\n    // Update the value displayed in the input\n    // onChange with the fixed value already triggered in handleChange\n    if (fixedValue !== prevValue) {\n      setValue(addSeparators(fixedValue));\n    }\n    onBlur();\n  }, [value, onBlur]);\n\n  return (\n    <div className=\"d-flex flex-row align-items-center\">\n      <MaskedInput\n        ref={ref}\n        className={classNames(className)}\n        example={EXAMPLES}\n        getNextSegmentValue={getNextSegmentValue}\n        onChange={handleChange}\n        onSelect={setSelection}\n        onSubmit={onSubmit}\n        pattern={FULL_DATE_PATTERN}\n        placeholder={FULL_DATE_FORMAT}\n        selection={selection}\n        value={value}\n        onFocus={onFocus}\n        onBlur={handleBlur}\n        data-testid={dataTestId}\n      />\n    </div>\n  );\n});\n\nDateTimeInput.displayName = 'DateTimeInput';\n\nDateTimeInput.defaultProps = {\n  className: '',\n  onChange: () => undefined,\n  defaultValue: '',\n  onFocus: () => undefined,\n  onBlur: () => undefined,\n  'data-testid': undefined,\n};\n\nexport default DateTimeInput;\n"],"mappings":"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"}
+{"version":3,"file":"DateTimeInput.js","names":["React","useCallback","useState","classNames","Log","MaskedInput","getNextSegmentValue","addSeparators","jsx","_jsx","log","module","DATE_PATTERN","TIME_PATTERN","FULL_DATE_PATTERN","concat","DATE_VALUE_STRING","DEFAULT_VALUE_STRING","FULL_DATE_FORMAT","fixIncompleteValue","value","length","substring","replace","removeSeparators","EXAMPLES","DateTimeInput","forwardRef","props","ref","className","onChange","undefined","defaultValue","onFocus","onBlur","onSubmit","dataTestId","setValue","selection","setSelection","handleChange","newValue","debug","handleBlur","prevValue","fixedValue","children","example","onSelect","pattern","placeholder","displayName"],"sources":["../src/DateTimeInput.tsx"],"sourcesContent":["import React, { type KeyboardEvent, useCallback, useState } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport MaskedInput, { type SelectionSegment } from './MaskedInput';\nimport { getNextSegmentValue } from './DateInputUtils';\nimport { addSeparators } from './DateTimeInputUtils';\n\nconst log = Log.module('DateTimeInput');\n\n// This could be more restrictive and restrict days to the number of days in the month...\n// But then gotta take leap year into account and everything.\nconst DATE_PATTERN = '[12][0-9]{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])';\n// Put zero width spaces in the nanosecond part of the date to allow jumping between segments\nconst TIME_PATTERN =\n  '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]\\\\.[0-9]{3}\\u200B[0-9]{3}\\u200B[0-9]{3}';\nconst FULL_DATE_PATTERN = `${DATE_PATTERN} ${TIME_PATTERN}`;\nconst DATE_VALUE_STRING = '2022-01-01';\nconst DEFAULT_VALUE_STRING = `${DATE_VALUE_STRING} 00:00:00.000000000`;\nconst FULL_DATE_FORMAT = 'YYYY-MM-DD HH:MM:SS.SSSSSSSSS';\n\nexport type DateTimeInputProps = {\n  className?: string;\n  onChange?: (value: string) => void;\n  defaultValue?: string;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onSubmit?: (event: KeyboardEvent<HTMLInputElement>) => void;\n  'data-testid'?: string;\n};\n\nfunction fixIncompleteValue(value: string): string {\n  if (value != null && value.length >= DATE_VALUE_STRING.length) {\n    return `${value.substring(0, DATE_VALUE_STRING.length)}${value\n      .substring(DATE_VALUE_STRING.length)\n      .replace(/\\u2007/g, '0')}${DEFAULT_VALUE_STRING.substring(value.length)}`;\n  }\n  return value;\n}\n\nfunction removeSeparators(value: string): string {\n  return value.replace(/\\u200B/g, '');\n}\n\nconst EXAMPLES = [addSeparators(DEFAULT_VALUE_STRING)];\n\nexport const DateTimeInput = React.forwardRef<\n  HTMLInputElement,\n  DateTimeInputProps\n>((props, ref) => {\n  const {\n    className = '',\n    onChange = () => undefined,\n    defaultValue = '',\n    onFocus = () => undefined,\n    onBlur = () => undefined,\n    onSubmit,\n    'data-testid': dataTestId,\n  } = props;\n  const [value, setValue] = useState(\n    defaultValue.length > 0 ? addSeparators(defaultValue) : ''\n  );\n  const [selection, setSelection] = useState<SelectionSegment>();\n\n  const handleChange = useCallback(\n    (newValue: string): void => {\n      log.debug('handleChange', newValue);\n      setValue(newValue);\n      onChange(fixIncompleteValue(removeSeparators(newValue)));\n    },\n    [onChange]\n  );\n\n  const handleBlur = useCallback((): void => {\n    const prevValue = removeSeparators(value);\n    const fixedValue = fixIncompleteValue(prevValue);\n    // Update the value displayed in the input\n    // onChange with the fixed value already triggered in handleChange\n    if (fixedValue !== prevValue) {\n      setValue(addSeparators(fixedValue));\n    }\n    onBlur();\n  }, [value, onBlur]);\n\n  return (\n    <div className=\"d-flex flex-row align-items-center\">\n      <MaskedInput\n        ref={ref}\n        className={classNames(className)}\n        example={EXAMPLES}\n        getNextSegmentValue={getNextSegmentValue}\n        onChange={handleChange}\n        onSelect={setSelection}\n        onSubmit={onSubmit}\n        pattern={FULL_DATE_PATTERN}\n        placeholder={FULL_DATE_FORMAT}\n        selection={selection}\n        value={value}\n        onFocus={onFocus}\n        onBlur={handleBlur}\n        data-testid={dataTestId}\n      />\n    </div>\n  );\n});\n\nDateTimeInput.displayName = 'DateTimeInput';\n\nexport default DateTimeInput;\n"],"mappings":"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","ignoreList":[]}

package/dist/DateTimeInputUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimeInputUtils.js","names":["addSeparators","value","dateTimeMillis","substring","micros","nanos","filter","v","join"],"sources":["../src/DateTimeInputUtils.ts"],"sourcesContent":["/* eslint-disable import/prefer-default-export */\nexport function addSeparators(value: string): string {\n  const dateTimeMillis = value.substring(0, 23);\n  const micros = value.substring(23, 26);\n  const nanos = value.substring(26);\n  return [dateTimeMillis, micros, nanos].filter(v => v !== '').join('\\u200B');\n}\n"],"mappings":"AAAA;AACA,OAAO,SAASA,aAAaA,CAACC,KAAa,EAAU;EACnD,IAAMC,cAAc,GAAGD,KAAK,CAACE,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC;EAC7C,IAAMC,MAAM,GAAGH,KAAK,CAACE,SAAS,CAAC,EAAE,EAAE,EAAE,CAAC;EACtC,IAAME,KAAK,GAAGJ,KAAK,CAACE,SAAS,CAAC,EAAE,CAAC;EACjC,OAAO,CAACD,cAAc,EAAEE,MAAM,EAAEC,KAAK,CAAC,CAACC,MAAM,CAACC,CAAC,IAAIA,CAAC,KAAK,EAAE,CAAC,CAACC,IAAI,CAAC,QAAQ,CAAC;AAC7E"}
+{"version":3,"file":"DateTimeInputUtils.js","names":["addSeparators","value","dateTimeMillis","substring","micros","nanos","filter","v","join"],"sources":["../src/DateTimeInputUtils.ts"],"sourcesContent":["/* eslint-disable import/prefer-default-export */\nexport function addSeparators(value: string): string {\n  const dateTimeMillis = value.substring(0, 23);\n  const micros = value.substring(23, 26);\n  const nanos = value.substring(26);\n  return [dateTimeMillis, micros, nanos].filter(v => v !== '').join('\\u200B');\n}\n"],"mappings":"AAAA;AACA,OAAO,SAASA,aAAaA,CAACC,KAAa,EAAU;EACnD,IAAMC,cAAc,GAAGD,KAAK,CAACE,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC;EAC7C,IAAMC,MAAM,GAAGH,KAAK,CAACE,SAAS,CAAC,EAAE,EAAE,EAAE,CAAC;EACtC,IAAME,KAAK,GAAGJ,KAAK,CAACE,SAAS,CAAC,EAAE,CAAC;EACjC,OAAO,CAACD,cAAc,EAAEE,MAAM,EAAEC,KAAK,CAAC,CAACC,MAAM,CAACC,CAAC,IAAIA,CAAC,KAAK,EAAE,CAAC,CAACC,IAAI,CAAC,QAAQ,CAAC;AAC7E","ignoreList":[]}

package/dist/DebouncedSearchInput.js

@@ -29,7 +29,7 @@ class DebouncedSearchInput extends PureComponent {
   }
   focus() {
     var _this$searchInput$cur;
-    (_this$searchInput$cur = this.searchInput.current) === null || _this$searchInput$cur === void 0 ? void 0 : _this$searchInput$cur.focus();
+    (_this$searchInput$cur = this.searchInput.current) === null || _this$searchInput$cur === void 0 || _this$searchInput$cur.focus();
   }
   handleChange(event) {
     this.setState({

package/dist/DebouncedSearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DebouncedSearchInput.js","names":["React","PureComponent","debounce","SearchInput","jsx","_jsx","DebouncedSearchInput","constructor","props","_defineProperty","searchInput","createRef","handleChange","bind","sendUpdate","debounceMs","state","value","componentDidUpdate","prevProps","setState","focus","_this$searchInput$cur","current","event","target","onChange","render","placeholder","className","matchCount","id","dataTestId","ref","undefined"],"sources":["../src/DebouncedSearchInput.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport debounce from 'lodash.debounce';\nimport SearchInput from './SearchInput';\n\ninterface DebouncedSearchInputProps {\n  value: string;\n  placeholder: string;\n  onChange: (value: string) => void;\n  className: string;\n  matchCount: number;\n  debounceMs: number;\n  id: string;\n  'data-testid'?: string;\n}\n\ninterface DebouncedSearchInputState {\n  value: string;\n}\n\nclass DebouncedSearchInput extends PureComponent<\n  DebouncedSearchInputProps,\n  DebouncedSearchInputState\n> {\n  static defaultProps = {\n    placeholder: 'Search',\n    className: '',\n    matchCount: null,\n    debounceMs: 250,\n    id: '',\n    'data-testid': undefined,\n  };\n\n  constructor(props: DebouncedSearchInputProps) {\n    super(props);\n    this.searchInput = React.createRef();\n    this.handleChange = this.handleChange.bind(this);\n    this.sendUpdate = debounce(this.sendUpdate.bind(this), props.debounceMs);\n\n    this.state = {\n      value: props.value,\n    };\n  }\n\n  componentDidUpdate(prevProps: DebouncedSearchInputProps): void {\n    const { value } = this.props;\n    if (prevProps.value !== value) {\n      // eslint-disable-next-line react/no-did-update-set-state\n      this.setState({ value });\n    }\n  }\n\n  searchInput: React.RefObject<SearchInput>;\n\n  focus(): void {\n    this.searchInput.current?.focus();\n  }\n\n  handleChange(event: React.ChangeEvent<HTMLInputElement>): void {\n    this.setState({ value: event.target.value }, this.sendUpdate);\n  }\n\n  sendUpdate(): void {\n    const { onChange } = this.props;\n    const { value } = this.state;\n    onChange(value);\n  }\n\n  render(): JSX.Element {\n    const {\n      placeholder,\n      className,\n      matchCount,\n      id,\n      'data-testid': dataTestId,\n    } = this.props;\n    const { value } = this.state;\n    return (\n      <SearchInput\n        value={value}\n        placeholder={placeholder}\n        onChange={this.handleChange}\n        className={className}\n        matchCount={matchCount}\n        ref={this.searchInput}\n        id={id}\n        data-testid={dataTestId}\n      />\n    );\n  }\n}\n\nexport default DebouncedSearchInput;\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,OAAOC,QAAQ,MAAM,iBAAiB;AAAC,OAChCC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAiBlB,MAAMC,oBAAoB,SAASL,aAAa,CAG9C;EAUAM,WAAWA,CAACC,KAAgC,EAAE;IAC5C,KAAK,CAACA,KAAK,CAAC;IAACC,eAAA;IACb,IAAI,CAACC,WAAW,gBAAGV,KAAK,CAACW,SAAS,CAAC,CAAC;IACpC,IAAI,CAACC,YAAY,GAAG,IAAI,CAACA,YAAY,CAACC,IAAI,CAAC,IAAI,CAAC;IAChD,IAAI,CAACC,UAAU,GAAGZ,QAAQ,CAAC,IAAI,CAACY,UAAU,CAACD,IAAI,CAAC,IAAI,CAAC,EAAEL,KAAK,CAACO,UAAU,CAAC;IAExE,IAAI,CAACC,KAAK,GAAG;MACXC,KAAK,EAAET,KAAK,CAACS;IACf,CAAC;EACH;EAEAC,kBAAkBA,CAACC,SAAoC,EAAQ;IAC7D,IAAM;MAAEF;IAAM,CAAC,GAAG,IAAI,CAACT,KAAK;IAC5B,IAAIW,SAAS,CAACF,KAAK,KAAKA,KAAK,EAAE;MAC7B;MACA,IAAI,CAACG,QAAQ,CAAC;QAAEH;MAAM,CAAC,CAAC;IAC1B;EACF;EAIAI,KAAKA,CAAA,EAAS;IAAA,IAAAC,qBAAA;IACZ,CAAAA,qBAAA,OAAI,CAACZ,WAAW,CAACa,OAAO,cAAAD,qBAAA,uBAAxBA,qBAAA,CAA0BD,KAAK,CAAC,CAAC;EACnC;EAEAT,YAAYA,CAACY,KAA0C,EAAQ;IAC7D,IAAI,CAACJ,QAAQ,CAAC;MAAEH,KAAK,EAAEO,KAAK,CAACC,MAAM,CAACR;IAAM,CAAC,EAAE,IAAI,CAACH,UAAU,CAAC;EAC/D;EAEAA,UAAUA,CAAA,EAAS;IACjB,IAAM;MAAEY;IAAS,CAAC,GAAG,IAAI,CAAClB,KAAK;IAC/B,IAAM;MAAES;IAAM,CAAC,GAAG,IAAI,CAACD,KAAK;IAC5BU,QAAQ,CAACT,KAAK,CAAC;EACjB;EAEAU,MAAMA,CAAA,EAAgB;IACpB,IAAM;MACJC,WAAW;MACXC,SAAS;MACTC,UAAU;MACVC,EAAE;MACF,aAAa,EAAEC;IACjB,CAAC,GAAG,IAAI,CAACxB,KAAK;IACd,IAAM;MAAES;IAAM,CAAC,GAAG,IAAI,CAACD,KAAK;IAC5B,oBACEX,IAAA,CAACF,WAAW;MACVc,KAAK,EAAEA,KAAM;MACbW,WAAW,EAAEA,WAAY;MACzBF,QAAQ,EAAE,IAAI,CAACd,YAAa;MAC5BiB,SAAS,EAAEA,SAAU;MACrBC,UAAU,EAAEA,UAAW;MACvBG,GAAG,EAAE,IAAI,CAACvB,WAAY;MACtBqB,EAAE,EAAEA,EAAG;MACP,eAAaC;IAAW,CACzB,CAAC;EAEN;AACF;AAACvB,eAAA,CAtEKH,oBAAoB,kBAIF;EACpBsB,WAAW,EAAE,QAAQ;EACrBC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,IAAI;EAChBf,UAAU,EAAE,GAAG;EACfgB,EAAE,EAAE,EAAE;EACN,aAAa,EAAEG;AACjB,CAAC;AA6DH,eAAe5B,oBAAoB"}
+{"version":3,"file":"DebouncedSearchInput.js","names":["React","PureComponent","debounce","SearchInput","jsx","_jsx","DebouncedSearchInput","constructor","props","_defineProperty","searchInput","createRef","handleChange","bind","sendUpdate","debounceMs","state","value","componentDidUpdate","prevProps","setState","focus","_this$searchInput$cur","current","event","target","onChange","render","placeholder","className","matchCount","id","dataTestId","ref","undefined"],"sources":["../src/DebouncedSearchInput.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport debounce from 'lodash.debounce';\nimport SearchInput from './SearchInput';\n\ninterface DebouncedSearchInputProps {\n  value: string;\n  placeholder: string;\n  onChange: (value: string) => void;\n  className: string;\n  matchCount: number;\n  debounceMs: number;\n  id: string;\n  'data-testid'?: string;\n}\n\ninterface DebouncedSearchInputState {\n  value: string;\n}\n\nclass DebouncedSearchInput extends PureComponent<\n  DebouncedSearchInputProps,\n  DebouncedSearchInputState\n> {\n  static defaultProps = {\n    placeholder: 'Search',\n    className: '',\n    matchCount: null,\n    debounceMs: 250,\n    id: '',\n    'data-testid': undefined,\n  };\n\n  constructor(props: DebouncedSearchInputProps) {\n    super(props);\n    this.searchInput = React.createRef();\n    this.handleChange = this.handleChange.bind(this);\n    this.sendUpdate = debounce(this.sendUpdate.bind(this), props.debounceMs);\n\n    this.state = {\n      value: props.value,\n    };\n  }\n\n  componentDidUpdate(prevProps: DebouncedSearchInputProps): void {\n    const { value } = this.props;\n    if (prevProps.value !== value) {\n      // eslint-disable-next-line react/no-did-update-set-state\n      this.setState({ value });\n    }\n  }\n\n  searchInput: React.RefObject<SearchInput>;\n\n  focus(): void {\n    this.searchInput.current?.focus();\n  }\n\n  handleChange(event: React.ChangeEvent<HTMLInputElement>): void {\n    this.setState({ value: event.target.value }, this.sendUpdate);\n  }\n\n  sendUpdate(): void {\n    const { onChange } = this.props;\n    const { value } = this.state;\n    onChange(value);\n  }\n\n  render(): JSX.Element {\n    const {\n      placeholder,\n      className,\n      matchCount,\n      id,\n      'data-testid': dataTestId,\n    } = this.props;\n    const { value } = this.state;\n    return (\n      <SearchInput\n        value={value}\n        placeholder={placeholder}\n        onChange={this.handleChange}\n        className={className}\n        matchCount={matchCount}\n        ref={this.searchInput}\n        id={id}\n        data-testid={dataTestId}\n      />\n    );\n  }\n}\n\nexport default DebouncedSearchInput;\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,OAAOC,QAAQ,MAAM,iBAAiB;AAAC,OAChCC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAiBlB,MAAMC,oBAAoB,SAASL,aAAa,CAG9C;EAUAM,WAAWA,CAACC,KAAgC,EAAE;IAC5C,KAAK,CAACA,KAAK,CAAC;IAACC,eAAA;IACb,IAAI,CAACC,WAAW,gBAAGV,KAAK,CAACW,SAAS,CAAC,CAAC;IACpC,IAAI,CAACC,YAAY,GAAG,IAAI,CAACA,YAAY,CAACC,IAAI,CAAC,IAAI,CAAC;IAChD,IAAI,CAACC,UAAU,GAAGZ,QAAQ,CAAC,IAAI,CAACY,UAAU,CAACD,IAAI,CAAC,IAAI,CAAC,EAAEL,KAAK,CAACO,UAAU,CAAC;IAExE,IAAI,CAACC,KAAK,GAAG;MACXC,KAAK,EAAET,KAAK,CAACS;IACf,CAAC;EACH;EAEAC,kBAAkBA,CAACC,SAAoC,EAAQ;IAC7D,IAAM;MAAEF;IAAM,CAAC,GAAG,IAAI,CAACT,KAAK;IAC5B,IAAIW,SAAS,CAACF,KAAK,KAAKA,KAAK,EAAE;MAC7B;MACA,IAAI,CAACG,QAAQ,CAAC;QAAEH;MAAM,CAAC,CAAC;IAC1B;EACF;EAIAI,KAAKA,CAAA,EAAS;IAAA,IAAAC,qBAAA;IACZ,CAAAA,qBAAA,OAAI,CAACZ,WAAW,CAACa,OAAO,cAAAD,qBAAA,eAAxBA,qBAAA,CAA0BD,KAAK,CAAC,CAAC;EACnC;EAEAT,YAAYA,CAACY,KAA0C,EAAQ;IAC7D,IAAI,CAACJ,QAAQ,CAAC;MAAEH,KAAK,EAAEO,KAAK,CAACC,MAAM,CAACR;IAAM,CAAC,EAAE,IAAI,CAACH,UAAU,CAAC;EAC/D;EAEAA,UAAUA,CAAA,EAAS;IACjB,IAAM;MAAEY;IAAS,CAAC,GAAG,IAAI,CAAClB,KAAK;IAC/B,IAAM;MAAES;IAAM,CAAC,GAAG,IAAI,CAACD,KAAK;IAC5BU,QAAQ,CAACT,KAAK,CAAC;EACjB;EAEAU,MAAMA,CAAA,EAAgB;IACpB,IAAM;MACJC,WAAW;MACXC,SAAS;MACTC,UAAU;MACVC,EAAE;MACF,aAAa,EAAEC;IACjB,CAAC,GAAG,IAAI,CAACxB,KAAK;IACd,IAAM;MAAES;IAAM,CAAC,GAAG,IAAI,CAACD,KAAK;IAC5B,oBACEX,IAAA,CAACF,WAAW;MACVc,KAAK,EAAEA,KAAM;MACbW,WAAW,EAAEA,WAAY;MACzBF,QAAQ,EAAE,IAAI,CAACd,YAAa;MAC5BiB,SAAS,EAAEA,SAAU;MACrBC,UAAU,EAAEA,UAAW;MACvBG,GAAG,EAAE,IAAI,CAACvB,WAAY;MACtBqB,EAAE,EAAEA,EAAG;MACP,eAAaC;IAAW,CACzB,CAAC;EAEN;AACF;AAACvB,eAAA,CAtEKH,oBAAoB,kBAIF;EACpBsB,WAAW,EAAE,QAAQ;EACrBC,SAAS,EAAE,EAAE;EACbC,UAAU,EAAE,IAAI;EAChBf,UAAU,EAAE,GAAG;EACfgB,EAAE,EAAE,EAAE;EACN,aAAa,EAAEG;AACjB,CAAC;AA6DH,eAAe5B,oBAAoB","ignoreList":[]}

package/dist/DragUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"DragUtils.js","names":["flatten","DragUtils","reorder","sourceList","selectedRanges","destinationList","destinationIndex","insertIndex","adjustDestinationIndex","draggedItems","removeItems","splice","list","ranges","items","sortedRanges","map","range","index","sort","a","b","i","length","start","end","adjustedIndex","Math","min","startDragging","document","documentElement","classList","add","stopDragging","remove"],"sources":["../src/DragUtils.ts"],"sourcesContent":["import flatten from 'lodash.flatten';\n\ntype Range = [number, number];\n\nclass DragUtils {\n  /**\n   * Re-orders the provided item lists in place based on the selectedRanges and destinationIndex provided\n   * @param sourceList Array of the source items\n   * @param selectedRanges Array of the selected ranges in the source list\n   * @param destinationList Destination items. If dragging within the same list, set it to sourceItems\n   * @param destinationIndex The index items are being dropped in the destinationList, adjusted for the removed items\n   * @returns The items that were dragged\n   */\n  static reorder<T>(\n    sourceList: T[],\n    selectedRanges: readonly Range[],\n    destinationList: T[],\n    destinationIndex: number\n  ): T[] {\n    const insertIndex =\n      sourceList === destinationList\n        ? DragUtils.adjustDestinationIndex(destinationIndex, selectedRanges)\n        : destinationIndex;\n    const draggedItems = DragUtils.removeItems(sourceList, selectedRanges);\n    destinationList.splice(insertIndex, 0, ...draggedItems);\n    return draggedItems;\n  }\n\n  /**\n   * Removes the provided ranges from the list in place\n   * @param list Array of items to remove the ranges.\n   * @param ranges Array of the ranges to remove.\n   * @returns The removed items, in the order of the ranges removed.\n   */\n  static removeItems<T>(list: T[], ranges: readonly Range[]): T[] {\n    const items = [];\n\n    // Sort them in reverse, so we don't screw up the range indexes\n    const sortedRanges = ranges\n      .map((range, index) => ({ range, index }))\n      .sort((a, b) => b.range[0] - a.range[0]);\n    for (let i = 0; i < sortedRanges.length; i += 1) {\n      const { range, index } = sortedRanges[i];\n      const [start, end] = range;\n      items[index] = list.splice(start, end - start + 1);\n    }\n\n    return flatten(items);\n  }\n\n  /**\n   * Adjusts the destination index for when dropping into the same list you're dragging from.\n   * @param destinationIndex The original destination index\n   * @param ranges The ranges that are moving\n   * @returns Index where item should be inserted after all ranges are removed\n   */\n  static adjustDestinationIndex(\n    destinationIndex: number,\n    ranges: readonly Range[]\n  ): number {\n    let adjustedIndex = destinationIndex;\n    for (let i = 0; i < ranges.length; i += 1) {\n      const [start, end] = ranges[i];\n      if (start > destinationIndex) {\n        break;\n      }\n\n      adjustedIndex -= Math.min(end, destinationIndex - 1) - start + 1;\n    }\n    return adjustedIndex;\n  }\n\n  static startDragging(): void {\n    document.documentElement.classList.add('drag-pointer-events-none');\n  }\n\n  static stopDragging(): void {\n    document.documentElement.classList.remove('drag-pointer-events-none');\n  }\n}\n\nexport default DragUtils;\n"],"mappings":"AAAA,OAAOA,OAAO,MAAM,gBAAgB;AAIpC,MAAMC,SAAS,CAAC;EACd;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,OAAOC,OAAOA,CACZC,UAAe,EACfC,cAAgC,EAChCC,eAAoB,EACpBC,gBAAwB,EACnB;IACL,IAAMC,WAAW,GACfJ,UAAU,KAAKE,eAAe,GAC1BJ,SAAS,CAACO,sBAAsB,CAACF,gBAAgB,EAAEF,cAAc,CAAC,GAClEE,gBAAgB;IACtB,IAAMG,YAAY,GAAGR,SAAS,CAACS,WAAW,CAACP,UAAU,EAAEC,cAAc,CAAC;IACtEC,eAAe,CAACM,MAAM,CAACJ,WAAW,EAAE,CAAC,EAAE,GAAGE,YAAY,CAAC;IACvD,OAAOA,YAAY;EACrB;;EAEA;AACF;AACA;AACA;AACA;AACA;EACE,OAAOC,WAAWA,CAAIE,IAAS,EAAEC,MAAwB,EAAO;IAC9D,IAAMC,KAAK,GAAG,EAAE;;IAEhB;IACA,IAAMC,YAAY,GAAGF,MAAM,CACxBG,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,MAAM;MAAED,KAAK;MAAEC;IAAM,CAAC,CAAC,CAAC,CACzCC,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKA,CAAC,CAACJ,KAAK,CAAC,CAAC,CAAC,GAAGG,CAAC,CAACH,KAAK,CAAC,CAAC,CAAC,CAAC;IAC1C,KAAK,IAAIK,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGP,YAAY,CAACQ,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;MAC/C,IAAM;QAAEL,KAAK;QAAEC;MAAM,CAAC,GAAGH,YAAY,CAACO,CAAC,CAAC;MACxC,IAAM,CAACE,KAAK,EAAEC,GAAG,CAAC,GAAGR,KAAK;MAC1BH,KAAK,CAACI,KAAK,CAAC,GAAGN,IAAI,CAACD,MAAM,CAACa,KAAK,EAAEC,GAAG,GAAGD,KAAK,GAAG,CAAC,CAAC;IACpD;IAEA,OAAOxB,OAAO,CAACc,KAAK,CAAC;EACvB;;EAEA;AACF;AACA;AACA;AACA;AACA;EACE,OAAON,sBAAsBA,CAC3BF,gBAAwB,EACxBO,MAAwB,EAChB;IACR,IAAIa,aAAa,GAAGpB,gBAAgB;IACpC,KAAK,IAAIgB,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGT,MAAM,CAACU,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;MACzC,IAAM,CAACE,KAAK,EAAEC,GAAG,CAAC,GAAGZ,MAAM,CAACS,CAAC,CAAC;MAC9B,IAAIE,KAAK,GAAGlB,gBAAgB,EAAE;QAC5B;MACF;MAEAoB,aAAa,IAAIC,IAAI,CAACC,GAAG,CAACH,GAAG,EAAEnB,gBAAgB,GAAG,CAAC,CAAC,GAAGkB,KAAK,GAAG,CAAC;IAClE;IACA,OAAOE,aAAa;EACtB;EAEA,OAAOG,aAAaA,CAAA,EAAS;IAC3BC,QAAQ,CAACC,eAAe,CAACC,SAAS,CAACC,GAAG,CAAC,0BAA0B,CAAC;EACpE;EAEA,OAAOC,YAAYA,CAAA,EAAS;IAC1BJ,QAAQ,CAACC,eAAe,CAACC,SAAS,CAACG,MAAM,CAAC,0BAA0B,CAAC;EACvE;AACF;AAEA,eAAelC,SAAS"}
+{"version":3,"file":"DragUtils.js","names":["flatten","DragUtils","reorder","sourceList","selectedRanges","destinationList","destinationIndex","insertIndex","adjustDestinationIndex","draggedItems","removeItems","splice","list","ranges","items","sortedRanges","map","range","index","sort","a","b","i","length","start","end","adjustedIndex","Math","min","startDragging","document","documentElement","classList","add","stopDragging","remove"],"sources":["../src/DragUtils.ts"],"sourcesContent":["import flatten from 'lodash.flatten';\n\ntype Range = [number, number];\n\nclass DragUtils {\n  /**\n   * Re-orders the provided item lists in place based on the selectedRanges and destinationIndex provided\n   * @param sourceList Array of the source items\n   * @param selectedRanges Array of the selected ranges in the source list\n   * @param destinationList Destination items. If dragging within the same list, set it to sourceItems\n   * @param destinationIndex The index items are being dropped in the destinationList, adjusted for the removed items\n   * @returns The items that were dragged\n   */\n  static reorder<T>(\n    sourceList: T[],\n    selectedRanges: readonly Range[],\n    destinationList: T[],\n    destinationIndex: number\n  ): T[] {\n    const insertIndex =\n      sourceList === destinationList\n        ? DragUtils.adjustDestinationIndex(destinationIndex, selectedRanges)\n        : destinationIndex;\n    const draggedItems = DragUtils.removeItems(sourceList, selectedRanges);\n    destinationList.splice(insertIndex, 0, ...draggedItems);\n    return draggedItems;\n  }\n\n  /**\n   * Removes the provided ranges from the list in place\n   * @param list Array of items to remove the ranges.\n   * @param ranges Array of the ranges to remove.\n   * @returns The removed items, in the order of the ranges removed.\n   */\n  static removeItems<T>(list: T[], ranges: readonly Range[]): T[] {\n    const items = [];\n\n    // Sort them in reverse, so we don't screw up the range indexes\n    const sortedRanges = ranges\n      .map((range, index) => ({ range, index }))\n      .sort((a, b) => b.range[0] - a.range[0]);\n    for (let i = 0; i < sortedRanges.length; i += 1) {\n      const { range, index } = sortedRanges[i];\n      const [start, end] = range;\n      items[index] = list.splice(start, end - start + 1);\n    }\n\n    return flatten(items);\n  }\n\n  /**\n   * Adjusts the destination index for when dropping into the same list you're dragging from.\n   * @param destinationIndex The original destination index\n   * @param ranges The ranges that are moving\n   * @returns Index where item should be inserted after all ranges are removed\n   */\n  static adjustDestinationIndex(\n    destinationIndex: number,\n    ranges: readonly Range[]\n  ): number {\n    let adjustedIndex = destinationIndex;\n    for (let i = 0; i < ranges.length; i += 1) {\n      const [start, end] = ranges[i];\n      if (start > destinationIndex) {\n        break;\n      }\n\n      adjustedIndex -= Math.min(end, destinationIndex - 1) - start + 1;\n    }\n    return adjustedIndex;\n  }\n\n  static startDragging(): void {\n    document.documentElement.classList.add('drag-pointer-events-none');\n  }\n\n  static stopDragging(): void {\n    document.documentElement.classList.remove('drag-pointer-events-none');\n  }\n}\n\nexport default DragUtils;\n"],"mappings":"AAAA,OAAOA,OAAO,MAAM,gBAAgB;AAIpC,MAAMC,SAAS,CAAC;EACd;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,OAAOC,OAAOA,CACZC,UAAe,EACfC,cAAgC,EAChCC,eAAoB,EACpBC,gBAAwB,EACnB;IACL,IAAMC,WAAW,GACfJ,UAAU,KAAKE,eAAe,GAC1BJ,SAAS,CAACO,sBAAsB,CAACF,gBAAgB,EAAEF,cAAc,CAAC,GAClEE,gBAAgB;IACtB,IAAMG,YAAY,GAAGR,SAAS,CAACS,WAAW,CAACP,UAAU,EAAEC,cAAc,CAAC;IACtEC,eAAe,CAACM,MAAM,CAACJ,WAAW,EAAE,CAAC,EAAE,GAAGE,YAAY,CAAC;IACvD,OAAOA,YAAY;EACrB;;EAEA;AACF;AACA;AACA;AACA;AACA;EACE,OAAOC,WAAWA,CAAIE,IAAS,EAAEC,MAAwB,EAAO;IAC9D,IAAMC,KAAK,GAAG,EAAE;;IAEhB;IACA,IAAMC,YAAY,GAAGF,MAAM,CACxBG,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,MAAM;MAAED,KAAK;MAAEC;IAAM,CAAC,CAAC,CAAC,CACzCC,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKA,CAAC,CAACJ,KAAK,CAAC,CAAC,CAAC,GAAGG,CAAC,CAACH,KAAK,CAAC,CAAC,CAAC,CAAC;IAC1C,KAAK,IAAIK,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGP,YAAY,CAACQ,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;MAC/C,IAAM;QAAEL,KAAK;QAAEC;MAAM,CAAC,GAAGH,YAAY,CAACO,CAAC,CAAC;MACxC,IAAM,CAACE,KAAK,EAAEC,GAAG,CAAC,GAAGR,KAAK;MAC1BH,KAAK,CAACI,KAAK,CAAC,GAAGN,IAAI,CAACD,MAAM,CAACa,KAAK,EAAEC,GAAG,GAAGD,KAAK,GAAG,CAAC,CAAC;IACpD;IAEA,OAAOxB,OAAO,CAACc,KAAK,CAAC;EACvB;;EAEA;AACF;AACA;AACA;AACA;AACA;EACE,OAAON,sBAAsBA,CAC3BF,gBAAwB,EACxBO,MAAwB,EAChB;IACR,IAAIa,aAAa,GAAGpB,gBAAgB;IACpC,KAAK,IAAIgB,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGT,MAAM,CAACU,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;MACzC,IAAM,CAACE,KAAK,EAAEC,GAAG,CAAC,GAAGZ,MAAM,CAACS,CAAC,CAAC;MAC9B,IAAIE,KAAK,GAAGlB,gBAAgB,EAAE;QAC5B;MACF;MAEAoB,aAAa,IAAIC,IAAI,CAACC,GAAG,CAACH,GAAG,EAAEnB,gBAAgB,GAAG,CAAC,CAAC,GAAGkB,KAAK,GAAG,CAAC;IAClE;IACA,OAAOE,aAAa;EACtB;EAEA,OAAOG,aAAaA,CAAA,EAAS;IAC3BC,QAAQ,CAACC,eAAe,CAACC,SAAS,CAACC,GAAG,CAAC,0BAA0B,CAAC;EACpE;EAEA,OAAOC,YAAYA,CAAA,EAAS;IAC1BJ,QAAQ,CAACC,eAAe,CAACC,SAAS,CAACG,MAAM,CAAC,0BAA0B,CAAC;EACvE;AACF;AAEA,eAAelC,SAAS","ignoreList":[]}

package/dist/DraggableItemList.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../scss/custom.scss","../scss/bootstrap_overrides.scss","../src/DraggableItemList.scss","../scss/new_variables.scss"],"names":[],"mappings":"AAAA;AC6LA;AChLA;EACE;EACA;EACA;EACA;;AAEA;EACE,kBD2EM;EC1EN,YDuIS;ECtIT,eDqIY;ECpIZ;EACA;EACA;EACA;;AACA;EACE;;AAIJ;EACE;;ACQF;EACE;EACA,YFoDM;EEnDN,YFgHS;EE/GT,eF8GY;EE7GZ;EACA;EACA;EDRI;EACA;EACA;EACA;;ACFN;EACE;EACA,YFoDM;EEnDN,YFgHS;EE/GT,eF8GY;EE7GZ;EACA;EACA;EDGI;EACA;EACA;EACA;;AAKN;EACE,ODoDE;;ACjDJ;EACE;;AAGF;EACE;EACA;EACA;EACA,cCnEO;;;ADwET;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE,eDmEU;EClEV;EACA;EACA,QApFkB;EAqFlB,aD4EY;;AC1EZ;EACE,kBA7FkB;;AAkGpB;EACE;;AAEA;EACE,kBAtGgB;;AA2GtB;AACE;;AACA;EACE,kBA7GqB;;AA+GrB;EACE,kBA/GyB;;AA0HzB;EACE;EACA,QAzHY;EA0HZ;;AAGJ;EACE;;AAOF;EACE,kBAxI4B;;AAiJlC;EClIF;EAIA,iBACE;EAIF,qBACE;EAIF;EACA;EACA;EACA;;;ADuHF;EACE","file":"DraggableItemList.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore */\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n@import './util.scss';\n","// Styling overrides for bootstrap\n@use 'sass:map';\n\n// Override / set color variables\n$red: var(--dh-color-visual-red);\n$orange: var(--dh-color-visual-orange);\n$yellow: var(--dh-color-visual-yellow);\n$green: var(--dh-color-visual-green);\n$blue: var(--dh-color-visual-blue);\n$purple: var(--dh-color-visual-purple);\n\n// Fallback colors are used if theme isn't loaded\n// this is required for error messages if the API doesn't load\n\n//Define our Gray scale\n$gray-100: var(--dh-color-gray-900, #fcfcfa);\n$gray-200: var(--dh-color-gray-800);\n$gray-300: var(--dh-color-gray-700);\n$gray-400: var(--dh-color-gray-600);\n$gray-500: var(--dh-color-gray-500);\n// intentional duplicate, scale doesn't line up otherwise\n// as we have gray-850 and spectrum doesn't and it is needed\n$gray-600: var(--dh-color-gray-500);\n$gray-700: var(--dh-color-gray-400);\n$gray-800: var(--dh-color-gray-300);\n$gray-850: var(--dh-color-gray-200);\n$gray-900: var(--dh-color-gray-75);\n$black: var(--dh-color-black, #1a171a);\n$white: var(--dh-color-white, #f0f0ee);\n\n//Define some UI colors\n$interfacegray: var(--dh-color-content-bg, #2d2a2e);\n$interfaceblue: var(--dh-color-accent-bg);\n$interfacewhite: $white;\n$interfaceblack: $black;\n$content-bg: var(--dh-color-content-bg, #2d2a2e);\n$background: var(--dh-color-bg, #1a171a);\n$foreground: var(--dh-color-fg, #f0f0ee);\n\n// Extend default Bootstrap $grays map\n$grays-custom: (\n  '850': $gray-850,\n);\n$grays: () !default;\n$grays: map-merge($grays, $grays-custom);\n\n// Extend default Bootstrap $colors map\n$colors-custom: (\n  'black': $black,\n);\n$colors: () !default;\n$colors: map-merge($colors, $colors-custom);\n\n// Override default Bootstrap $theme-colors map by mapping each key to itself.\n// These will then be re-mapped inside of `button-outline-variant` and\n// `button-outline-variant` mixins in `bootstrap_override_mixins_buttons.scss`\n$theme-colors-self-map: ();\n@each $key\n  in (\n    'primary',\n    'secondary',\n    'success',\n    'info',\n    'warning',\n    'danger',\n    'light',\n    'dark'\n  )\n{\n  $theme-colors-self-map: map.set($theme-colors-self-map, $key, $key);\n}\n$theme-colors: () !default;\n$theme-colors: map-merge($theme-colors, $theme-colors-self-map);\n\n// Used by bootstrap_override_mixins_buttons.scss to map Bootstrap colors to\n// DH semantic colors\n$bootstrap-dh-semantic-map: (\n  'primary': 'accent',\n  'secondary': 'neutral',\n  'success': 'positive',\n  'info': 'info',\n  'warning': 'notice',\n  'danger': 'negative',\n  // We shouldn't be using these, but mapping so they work with our custom\n  // `color-yiq` mixin. If we find a way to remove $light + $dark that are\n  // defined in Bootstrap _variables.scss, we should remove these\n  'light': 'neutral',\n  'dark': 'neutral',\n);\n\n//Set default colors\n$body-bg: $black;\n$body-color: $interfacewhite;\n\n// Set brand colors\n$primary: var(--dh-color-accent-bg);\n$primary-hover: var(--dh-color-accent-hover-bg);\n$primary-dark: var(--dh-color-accent-down-bg);\n$secondary: var(--dh-color-neutral-bg);\n$secondary-hover: var(--dh-color-neutral-hover-bg);\n$success: $green;\n$info: $yellow;\n$warning: $orange;\n$danger: var(--dh-color-negative-bg);\n$danger-hover: var(--dh-color-negative-hover-bg);\n// We really don't want to use $light or $dark variables, but Bootstrap defines\n// them in _variables.scss. Explicitly setting them to ensure we are in control\n// of their values. If we can find a way to remove them, we should\n$light: var(--dh-color-gray-light);\n$dark: var(--dh-color-gray-dark);\n// Bootstrap doesn't define $mid, and we want to move away from this particular\n// semantic. Should be deleted by #1635\n$mid: var(--dh-color-gray-mid);\n\n$semantic-colors: (\n  'primary-hover': $primary-hover,\n  'primary-dark': $primary-dark,\n  'mid': $mid,\n  'content-bg': $interfacegray,\n  'background': $interfaceblack,\n  'foreground': $interfacewhite,\n  'secondary-hover': $secondary-hover,\n  'danger-hover': $danger-hover,\n);\n\n$component-active-bg: $primary;\n$theme-color-interval: 9%;\n$yiq-contrasted-threshold: 180;\n\n// Override fonts\n$font-family-sans-serif:\n  'Fira Sans',\n  -apple-system,\n  blinkmacsystemfont,\n  'Segoe UI',\n  'Roboto',\n  'Helvetica Neue',\n  arial,\n  sans-serif; //fira sans then native system ui fallbacks\n$font-family-monospace: 'Fira Mono', menlo, monaco, consolas, 'Liberation Mono',\n  'Courier New', monospace;\n$font-family-base: $font-family-sans-serif;\n\n$headings-font-weight: 400;\n\n//Text overides\n$text-muted: $gray-400;\n\n//Style Selection highlight color\n$text-select-color: var(--dh-color-text-highlight);\n\n//Grid variables, same value as default just making easily accessible\n$grid-gutter-width: 30px;\n\n//Visual Overrides\n$border-radius: 4px;\n$box-shadow: 0 0.1rem 1rem var(--dh-color-dropshadow);\n\n//Override Btn\n$btn-border-radius: 4rem;\n$btn-padding-x: 1.5rem;\n$btn-transition:\n  color 0.12s ease-in-out,\n  background-color 0.12s ease-in-out,\n  border-color 0.12s ease-in-out,\n  box-shadow 0.12s ease-in-out; //default 0.15 is too long\n$btn-border-width: 2px;\n$btn-font-weight: var(--spectrum-global-font-weight-bold);\n$btn-line-height: 1.3;\n\n//Override Inputs\n$input-bg: var(--dh-color-input-bg);\n$input-disabled-bg: var(--dh-color-input-disabled-bg);\n$input-color: var(--dh-color-input-fg);\n$input-border-color: var(--dh-color-input-border);\n$input-placeholder-color: var(--dh-color-input-placeholder);\n$input-focus-border-color: var(--dh-color-input-focus-border);\n\n$input-btn-focus-width: 0.2rem;\n$input-btn-focus-color: color-mix(\n  in srgb,\n  var(--dh-color-accent) 35%,\n  transparent\n);\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;\n$input-btn-line-height: 1.3;\n// Bootstrap uses a calc expression to determine the input height (calc(line-height + 2*padding-y + border)).\n// The padding-y value has to be in rem to match units as it is a SASS calc.\n// Using 0.42145rem with 1.3 line height gets us to spectrum's 32px.\n/* stylelint-disable-next-line number-max-precision */\n$input-btn-padding-y: 0.42145rem;\n\n//checkbox\n$custom-control-indicator-bg: var(--dh-color-input-bg);\n$custom-control-indicator-border-color: var(--dh-color-input-border);\n$custom-checkbox-indicator-border-radius: 2px;\n$custom-control-indicator-border-width: 2px;\n$custom-control-indicator-active-bg: var(--dh-color-input-bg);\n$custom-control-indicator-active-border-color: var(--dh-color-input-fg);\n$custom-control-indicator-checked-bg: var(--dh-color-input-fg);\n$custom-control-indicator-checked-color: black; // used as mask fill color\n$custom-checkbox-indicator-indeterminate-bg: var(--dh-color-input-fg);\n$custom-control-indicator-bg-size: 75% 75%;\n$custom-control-indicator-disabled-bg: var(--dh-color-input-disabled-bg);\n$custom-control-indicator-checked-disabled-bg: var(\n  --dh-color-input-disabled-bg\n);\n$custom-control-label-disabled-color: var(--dh-color-input-disabled-fg);\n\n// The $custom-select-indicator variable is used by Bootstrap to provide the\n// icon for the select dropdown. Inline svgs can't use CSS variables, so we hard\n// code the color to #929192 (the default value of --dh-color-gray-600). PR #1651\n// overrides this icon altogether for known dropdowns, so technically we may not\n// need this, but it's here in case there are any remaining instances.\n$custom-select-indicator-color: #929192;\n$custom-select-bg: var(--dh-color-selector-bg);\n$custom-select-bg-size: 16px 16px;\n//dhSort icon encoded\n$custom-select-indicator: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M4 7l-.4-.8 4-3.7h.8l4 3.7-.4.8H4zm0 2l-.4.8 4 3.7h.8l4-3.7L12 9H4z'/%3E%3C/svg%3E\"),\n  '#',\n  '%23'\n);\n$custom-select-focus-box-shadow: $input-btn-focus-box-shadow;\n$custom-select-disabled-color: $gray-500;\n$custom-select-disabled-bg: $gray-800;\n\n//modal\n$modal-content-bg: $content-bg;\n$modal-content-border-width: 0;\n$modal-md: 550px;\n$close-color: var(--dh-color-text);\n$close-text-shadow: none;\n\n// Toast notification\n$toast-bg: var(--dh-color-accent-100);\n$toast-color: var(--dh-color-text);\n$toast-error-bg: var(--dh-color-negative-bg);\n$toast-error-color: var(--dh-color-text);\n\n//tooltips\n$tooltip-bg: var(--dh-color-tooltip-bg);\n$tooltip-color: var(--dh-color-tooltip-fg);\n$tooltip-box-shadow: 0 0.1rem 1.5rem 0.1rem var(--dh-color-tooltip-box-shadow);\n\n//drowdowns\n$dropdown-bg: $gray-600;\n$dropdown-link-color: $foreground;\n$dropdown-link-hover-color: $foreground;\n$dropdown-link-hover-bg: var(--dh-color-item-list-hover-bg);\n$dropdown-divider-bg: $gray-700;\n\n//context menus\n$contextmenu-bg: var(--dh-color-popover-bg);\n$contextmenu-color: var(--dh-color-text);\n$contextmenu-disabled-color: var(--dh-color-text-disabled);\n$contextmenu-keyboard-selected-bg: var(--dh-color-keyboard-selected-bg);\n$contextmenu-selected-bg: var(--dh-color-item-list-hover-bg);\n$contextmenu-selected-color: var(--dh-color-item-list-selected-fg);\n\n//hr\n$hr-border-color: var(--dh-color-hr);\n\n//links\n$link-color: $gray-400;\n$link-hover-color: $foreground;\n\n//progress-bar\n$progress-bg: $gray-600;\n$progress-border-radius: 1rem;\n\n// Set global options\n$enable-shadows: false;\n$enable-gradients: false;\n$enable-print-styles: false; //I don't think anyone should expect to \"print\" this app.\n\n// Transition times\n$transition: 0.15s;\n$transition-mid: 0.2s;\n$transition-long: 0.3s;\n$transition-slow: 0.6s;\n\n//form-validation icon, uses vsWarning icon encoded here as svg\n$form-feedback-icon-invalid-color: $danger;\n$form-feedback-icon-invalid: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg fill='#{$form-feedback-icon-invalid-color}'%3E%3Cpath d='M7.56 1h.88l6.54 12.26-.44.74H1.44L1 13.26 7.56 1zM8 2.28 2.28 13H13.7L8 2.28zM8.625 12v-1h-1.25v1h1.25zm-1.25-2V6h1.25v4h-1.25z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E \"),\n  '#',\n  '%23'\n);\n\n// This section of variables is not consumed directly by DH, but they need to be\n// defined for sass to compile _variables\n$table-dark-bg: $gray-800;\n$table-dark-accent-bg: var(--dh-color-highlight-hover);\n$table-dark-hover-bg: var(--dh-color-highlight-active);\n$table-dark-border-color: $gray-700;\n$popover-bg: var(--dh-color-tooltip-bg);\n$popover-border-color: var(--dh-color-overlay-modal-bg);\n$popover-header-bg: #000;\n$popover-arrow-outer-color: var(--dh-color-dropshadow);\n$custom-range-thumb-active-bg: var(--dh-color-accent-1100);\n","@import '../scss/custom.scss';\n\n$draggable-item-hover-bg: var(--dh-color-item-list-hover-bg);\n$draggable-item-selected-bg: var(--dh-color-item-list-selected-bg);\n$draggable-item-selected-hover-bg: var(--dh-color-item-list-selected-hover-bg);\n$draggable-item-selected-dragging-bg: var(--dh-color-item-list-selected-bg);\n$draggable-item-dragging-bg: $primary;\n$draggable-item-border: $input-border-width solid transparent;\n$draggable-item-focus-border: $input-border-width solid\n  $input-focus-border-color;\n$draggable-item-grip-color: $mid;\n\n// The element that is currently being dragged with the mouse\n.draggable-item-list-dragging-item {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin: 0 $spacer-2;\n\n  .item-list-item-content {\n    background-color: $draggable-item-dragging-bg;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    margin: 0 0 $spacer-1 0;\n    padding: $spacer-1 $spacer-2;\n    position: relative;\n    color: var(--dh-color-accent-contrast);\n    .btn {\n      color: var(--dh-color-accent-contrast);\n    }\n  }\n\n  &:focus {\n    outline: 0;\n  }\n\n  &.two-dragged,\n  &.multiple-dragged {\n    .item-list-item-content {\n      @include drag-stack(before) {\n        top: 4px;\n        left: 2px;\n        opacity: 0.8;\n        z-index: -1;\n      }\n    }\n  }\n  &.multiple-dragged {\n    .item-list-item-content {\n      @include drag-stack(after) {\n        // It looked weird with 8px\n        top: 7px;\n        left: 4px;\n        opacity: 0.6;\n        z-index: -2;\n      }\n    }\n  }\n\n  .fa-grip-vertical {\n    color: $draggable-item-grip-color;\n  }\n\n  .title {\n    flex-grow: 1;\n  }\n\n  .number-badge {\n    padding: 0 $spacer-2;\n    border-radius: 1rem;\n    background-color: fg-opacity(25);\n    margin-right: $spacer-1;\n  }\n}\n\n.draggable-item-list {\n  .item-list-item {\n    padding: 0;\n    display: flex;\n\n    .draggable-item-list-item {\n      display: flex;\n      flex-grow: 1;\n      flex-direction: row;\n      outline: none;\n    }\n\n    .item-list-item-content {\n      border-radius: $border-radius;\n      margin: 0 $spacer-2 1px $spacer-2;\n      padding: calc(#{$spacer-1} * 0.5) $spacer-1 0 $spacer-2;\n      border: $draggable-item-border;\n      line-height: $btn-line-height;\n\n      &:hover {\n        background-color: $draggable-item-hover-bg;\n      }\n    }\n\n    &.keyboard-active {\n      .item-list-item-content {\n        background-color: transparent;\n\n        &:hover {\n          background-color: $draggable-item-hover-bg;\n        }\n      }\n    }\n\n    &.active {\n      /* stylelint-disable-next-line no-descending-specificity */\n      .item-list-item-content {\n        background-color: $draggable-item-selected-bg;\n\n        &:hover {\n          background-color: $draggable-item-selected-hover-bg;\n        }\n      }\n    }\n  }\n\n  &.is-dragging-from-this,\n  &.is-dragging-over {\n    .item-list-item {\n      .draggable-item-list-item {\n        &:focus {\n          .item-list-item-content {\n            outline: 0;\n            border: $draggable-item-border;\n            box-shadow: none;\n          }\n        }\n        .item-list-item-content:hover {\n          background-color: transparent;\n        }\n      }\n    }\n\n    .item-list-item.active {\n      .draggable-item-list-item {\n        .item-list-item-content {\n          background-color: $draggable-item-selected-dragging-bg;\n        }\n      }\n    }\n  }\n\n  // Sometimes react-beautiful-dnd still adds the `is-dragging-over` class even though drop is disabled\n  // only show the ants if drop isn't disabled\n  &.is-dragging-over:not(.is-drop-disabled) {\n    .item-list-scroll-pane {\n      @include ants-base($foreground, $background);\n    }\n  }\n}\n\n.draggable-item-list-dragging-item-container:focus {\n  outline: 0;\n}\n","@use 'sass:math';\n\n//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents,  two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n  background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n  background-size:\n    $ant-size $ant-thickness,\n    $ant-size $ant-thickness,\n    $ant-thickness $ant-size,\n    $ant-thickness $ant-size;\n  background-position:\n    0 top,\n    0 bottom,\n    left 0,\n    right 0;\n  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n  animation: march 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n  &::#{$pseudo-element} {\n    content: ' ';\n    background: $primary;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    @content;\n  }\n}\n\n$focus-bg-transparency: 12%;\n$hover-bg-transparency: 14%;\n$active-bg-transparency: 28%;\n$exception-transparency: 28%;\n"]}
+{"version":3,"sourceRoot":"","sources":["../scss/custom.scss","../scss/bootstrap_overrides.scss","../src/DraggableItemList.scss","../scss/new_variables.scss"],"names":[],"mappings":"AAAA;AC6LA;AChLA;EACE;EACA;EACA;EACA;;AAEA;EACE,kBD2EM;EC1EN,YDuIS;ECtIT,eDqIY;ECpIZ;EACA;EACA;EACA;;AACA;EACE;;AAIJ;EACE;;ACQF;EACE;EACA,YFoDM;EEnDN,YFgHS;EE/GT,eF8GY;EE7GZ;EACA;EACA;EDRI;EACA;EACA;EACA;;ACFN;EACE;EACA,YFoDM;EEnDN,YFgHS;EE/GT,eF8GY;EE7GZ;EACA;EACA;EDGI;EACA;EACA;EACA;;AAKN;EACE,ODoDE;;ACjDJ;EACE;;AAGF;EACE;EACA;EACA;EACA,cCnEO;;;ADwET;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE,eDmEU;EClEV;EACA;EACA,QApFkB;EAqFlB,aD4EY;;AC1EZ;EACE,kBA7FkB;;AAkGpB;EACE;;AAEA;EACE,kBAtGgB;;AA2GtB;AACE;;AACA;EACE,kBA7GqB;;AA+GrB;EACE,kBA/GyB;;AA0HzB;EACE;EACA,QAzHY;EA0HZ;;AAGJ;EACE;;AAOF;EACE,kBAxI4B;;AAiJlC;EClIF;EAIA,iBACE;EAIF,qBACE;EAIF;EACA;EACA;EACA;;;ADuHF;EACE","file":"DraggableItemList.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore */\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n@import './util.scss';\n","// Styling overrides for bootstrap\n@use 'sass:map';\n\n// Override / set color variables\n$red: var(--dh-color-visual-red);\n$orange: var(--dh-color-visual-orange);\n$yellow: var(--dh-color-visual-yellow);\n$green: var(--dh-color-visual-green);\n$blue: var(--dh-color-visual-blue);\n$purple: var(--dh-color-visual-purple);\n\n// Fallback colors are used if theme isn't loaded\n// this is required for error messages if the API doesn't load\n\n//Define our Gray scale\n$gray-100: var(--dh-color-gray-900, #fcfcfa);\n$gray-200: var(--dh-color-gray-800);\n$gray-300: var(--dh-color-gray-700);\n$gray-400: var(--dh-color-gray-600);\n$gray-500: var(--dh-color-gray-500);\n// intentional duplicate, scale doesn't line up otherwise\n// as we have gray-850 and spectrum doesn't and it is needed\n$gray-600: var(--dh-color-gray-500);\n$gray-700: var(--dh-color-gray-400);\n$gray-800: var(--dh-color-gray-300);\n$gray-850: var(--dh-color-gray-200);\n$gray-900: var(--dh-color-gray-75);\n$black: var(--dh-color-black, #1a171a);\n$white: var(--dh-color-white, #f0f0ee);\n\n//Define some UI colors\n$interfacegray: var(--dh-color-content-bg, #2d2a2e);\n$interfaceblue: var(--dh-color-accent-bg);\n$interfacewhite: $white;\n$interfaceblack: $black;\n$content-bg: var(--dh-color-content-bg, #2d2a2e);\n$background: var(--dh-color-bg, #1a171a);\n$foreground: var(--dh-color-fg, #f0f0ee);\n\n// Extend default Bootstrap $grays map\n$grays-custom: (\n  '850': $gray-850,\n);\n$grays: () !default;\n$grays: map-merge($grays, $grays-custom);\n\n// Extend default Bootstrap $colors map\n$colors-custom: (\n  'black': $black,\n);\n$colors: () !default;\n$colors: map-merge($colors, $colors-custom);\n\n// Override default Bootstrap $theme-colors map by mapping each key to itself.\n// These will then be re-mapped inside of `button-outline-variant` and\n// `button-outline-variant` mixins in `bootstrap_override_mixins_buttons.scss`\n$theme-colors-self-map: ();\n@each $key\n  in (\n    'primary',\n    'secondary',\n    'success',\n    'info',\n    'warning',\n    'danger',\n    'light',\n    'dark'\n  )\n{\n  $theme-colors-self-map: map.set($theme-colors-self-map, $key, $key);\n}\n$theme-colors: () !default;\n$theme-colors: map-merge($theme-colors, $theme-colors-self-map);\n\n// Used by bootstrap_override_mixins_buttons.scss to map Bootstrap colors to\n// DH semantic colors\n$bootstrap-dh-semantic-map: (\n  'primary': 'accent',\n  'secondary': 'neutral',\n  'success': 'positive',\n  'info': 'info',\n  'warning': 'notice',\n  'danger': 'negative',\n  // We shouldn't be using these, but mapping so they work with our custom\n  // `color-yiq` mixin. If we find a way to remove $light + $dark that are\n  // defined in Bootstrap _variables.scss, we should remove these\n  'light': 'neutral',\n  'dark': 'neutral',\n);\n\n//Set default colors\n$body-bg: $black;\n$body-color: $interfacewhite;\n\n// Set brand colors\n$primary: var(--dh-color-accent-bg);\n$primary-hover: var(--dh-color-accent-hover-bg);\n$primary-dark: var(--dh-color-accent-down-bg);\n$secondary: var(--dh-color-neutral-bg);\n$secondary-hover: var(--dh-color-neutral-hover-bg);\n$success: $green;\n$info: $yellow;\n$warning: $orange;\n$danger: var(--dh-color-negative-bg);\n$danger-hover: var(--dh-color-negative-hover-bg);\n// We really don't want to use $light or $dark variables, but Bootstrap defines\n// them in _variables.scss. Explicitly setting them to ensure we are in control\n// of their values. If we can find a way to remove them, we should\n$light: var(--dh-color-gray-light);\n$dark: var(--dh-color-gray-dark);\n// Bootstrap doesn't define $mid, and we want to move away from this particular\n// semantic. Should be deleted by #1635\n$mid: var(--dh-color-gray-mid);\n\n$semantic-colors: (\n  'primary-hover': $primary-hover,\n  'primary-dark': $primary-dark,\n  'mid': $mid,\n  'content-bg': $interfacegray,\n  'background': $interfaceblack,\n  'foreground': $interfacewhite,\n  'secondary-hover': $secondary-hover,\n  'danger-hover': $danger-hover,\n);\n\n$component-active-bg: $primary;\n$theme-color-interval: 9%;\n$yiq-contrasted-threshold: 180;\n\n// Override fonts\n$font-family-sans-serif:\n  'Fira Sans',\n  -apple-system,\n  blinkmacsystemfont,\n  'Segoe UI',\n  'Roboto',\n  'Helvetica Neue',\n  arial,\n  sans-serif; //fira sans then native system ui fallbacks\n$font-family-monospace: 'Fira Mono', menlo, monaco, consolas, 'Liberation Mono',\n  'Courier New', monospace;\n$font-family-base: $font-family-sans-serif;\n\n$headings-font-weight: 400;\n\n//Text overides\n$text-muted: $gray-400;\n\n//Style Selection highlight color\n$text-select-color: var(--dh-color-text-highlight);\n\n//Grid variables, same value as default just making easily accessible\n$grid-gutter-width: 30px;\n\n//Visual Overrides\n$border-radius: 4px;\n$box-shadow: 0 0.1rem 1rem var(--dh-color-dropshadow);\n\n//Override Btn\n$btn-border-radius: 4rem;\n$btn-padding-x: 1.5rem;\n$btn-transition:\n  color 0.12s ease-in-out,\n  background-color 0.12s ease-in-out,\n  border-color 0.12s ease-in-out,\n  box-shadow 0.12s ease-in-out; //default 0.15 is too long\n$btn-border-width: 2px;\n$btn-font-weight: var(--spectrum-global-font-weight-bold);\n$btn-line-height: 1.3;\n\n//Override Inputs\n$input-bg: var(--dh-color-input-bg);\n$input-disabled-bg: var(--dh-color-input-disabled-bg);\n$input-color: var(--dh-color-input-fg);\n$input-border-color: var(--dh-color-input-border);\n$input-placeholder-color: var(--dh-color-input-placeholder);\n$input-focus-border-color: var(--dh-color-input-focus-border);\n\n$input-btn-focus-width: 0.2rem;\n$input-btn-focus-color: color-mix(\n  in srgb,\n  var(--dh-color-accent) 35%,\n  transparent\n);\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;\n$input-btn-line-height: 1.3;\n// Bootstrap uses a calc expression to determine the input height (calc(line-height + 2*padding-y + border)).\n// The padding-y value has to be in rem to match units as it is a SASS calc.\n// Using 0.42145rem with 1.3 line height gets us to spectrum's 32px.\n/* stylelint-disable-next-line number-max-precision */\n$input-btn-padding-y: 0.42145rem;\n\n//checkbox\n$custom-control-indicator-bg: var(--dh-color-input-bg);\n$custom-control-indicator-border-color: var(--dh-color-input-border);\n$custom-checkbox-indicator-border-radius: 2px;\n$custom-control-indicator-border-width: 2px;\n$custom-control-indicator-active-bg: var(--dh-color-input-bg);\n$custom-control-indicator-active-border-color: var(--dh-color-input-fg);\n$custom-control-indicator-checked-bg: var(--dh-color-input-fg);\n$custom-control-indicator-checked-color: black; // used as mask fill color\n$custom-checkbox-indicator-indeterminate-bg: var(--dh-color-input-fg);\n$custom-control-indicator-bg-size: 75% 75%;\n$custom-control-indicator-disabled-bg: var(--dh-color-input-disabled-bg);\n$custom-control-indicator-checked-disabled-bg: var(\n  --dh-color-input-disabled-bg\n);\n$custom-control-label-disabled-color: var(--dh-color-input-disabled-fg);\n\n// The $custom-select-indicator variable is used by Bootstrap to provide the\n// icon for the select dropdown. Inline svgs can't use CSS variables, so we hard\n// code the color to #929192 (the default value of --dh-color-gray-600). PR #1651\n// overrides this icon altogether for known dropdowns, so technically we may not\n// need this, but it's here in case there are any remaining instances.\n$custom-select-indicator-color: #929192;\n$custom-select-bg: var(--dh-color-selector-bg);\n$custom-select-bg-size: 16px 16px;\n//dhSort icon encoded\n$custom-select-indicator: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M4 7l-.4-.8 4-3.7h.8l4 3.7-.4.8H4zm0 2l-.4.8 4 3.7h.8l4-3.7L12 9H4z'/%3E%3C/svg%3E\"),\n  '#',\n  '%23'\n);\n$custom-select-focus-box-shadow: $input-btn-focus-box-shadow;\n$custom-select-disabled-color: $gray-500;\n$custom-select-disabled-bg: $gray-800;\n\n//modal\n$modal-content-bg: $content-bg;\n$modal-content-border-width: 0;\n$modal-md: 550px;\n$close-color: var(--dh-color-text);\n$close-text-shadow: none;\n\n// Toast notification\n$toast-bg: var(--dh-color-accent-100);\n$toast-color: var(--dh-color-text);\n$toast-error-bg: var(--dh-color-negative-bg);\n$toast-error-color: var(--dh-color-text);\n\n//tooltips\n$tooltip-bg: var(--dh-color-tooltip-bg);\n$tooltip-color: var(--dh-color-tooltip-fg);\n$tooltip-box-shadow: 0 0.1rem 1.5rem 0.1rem var(--dh-color-tooltip-box-shadow);\n\n//drowdowns\n$dropdown-bg: $gray-600;\n$dropdown-link-color: $foreground;\n$dropdown-link-hover-color: $foreground;\n$dropdown-link-hover-bg: var(--dh-color-item-list-hover-bg);\n$dropdown-divider-bg: $gray-700;\n\n//context menus\n$contextmenu-bg: var(--dh-color-popover-bg);\n$contextmenu-color: var(--dh-color-text);\n$contextmenu-disabled-color: var(--dh-color-text-disabled);\n$contextmenu-keyboard-selected-bg: var(--dh-color-keyboard-selected-bg);\n$contextmenu-selected-bg: var(--dh-color-item-list-hover-bg);\n$contextmenu-selected-color: var(--dh-color-item-list-selected-fg);\n\n//hr\n$hr-border-color: var(--dh-color-hr);\n\n//links\n$link-color: $gray-400;\n$link-hover-color: $foreground;\n\n//progress-bar\n$progress-bg: $gray-600;\n$progress-border-radius: 1rem;\n\n// Set global options\n$enable-shadows: false;\n$enable-gradients: false;\n$enable-print-styles: false; //I don't think anyone should expect to \"print\" this app.\n\n// Transition times\n$transition: 0.15s;\n$transition-mid: 0.2s;\n$transition-long: 0.3s;\n$transition-slow: 0.6s;\n\n//form-validation icon, uses vsWarning icon encoded here as svg\n$form-feedback-icon-invalid-color: $danger;\n$form-feedback-icon-invalid: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg fill='#{$form-feedback-icon-invalid-color}'%3E%3Cpath d='M7.56 1h.88l6.54 12.26-.44.74H1.44L1 13.26 7.56 1zM8 2.28 2.28 13H13.7L8 2.28zM8.625 12v-1h-1.25v1h1.25zm-1.25-2V6h1.25v4h-1.25z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E \"),\n  '#',\n  '%23'\n);\n\n// This section of variables is not consumed directly by DH, but they need to be\n// defined for sass to compile _variables\n$table-dark-bg: $gray-800;\n$table-dark-accent-bg: var(--dh-color-highlight-hover);\n$table-dark-hover-bg: var(--dh-color-highlight-active);\n$table-dark-border-color: $gray-700;\n$popover-bg: var(--dh-color-tooltip-bg);\n$popover-border-color: var(--dh-color-overlay-modal-bg);\n$popover-header-bg: #000;\n$popover-arrow-outer-color: var(--dh-color-dropshadow);\n$custom-range-thumb-active-bg: var(--dh-color-accent-1100);\n","@import '../scss/custom.scss';\n\n$draggable-item-hover-bg: var(--dh-color-item-list-hover-bg);\n$draggable-item-selected-bg: var(--dh-color-item-list-selected-bg);\n$draggable-item-selected-hover-bg: var(--dh-color-item-list-selected-hover-bg);\n$draggable-item-selected-dragging-bg: var(--dh-color-item-list-selected-bg);\n$draggable-item-dragging-bg: $primary;\n$draggable-item-border: $input-border-width solid transparent;\n$draggable-item-focus-border: $input-border-width solid\n  $input-focus-border-color;\n$draggable-item-grip-color: $mid;\n\n// The element that is currently being dragged with the mouse\n.draggable-item-list-dragging-item {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin: 0 $spacer-2;\n\n  .item-list-item-content {\n    background-color: $draggable-item-dragging-bg;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    margin: 0 0 $spacer-1 0;\n    padding: $spacer-1 $spacer-2;\n    position: relative;\n    color: var(--dh-color-accent-contrast);\n    .btn {\n      color: var(--dh-color-accent-contrast);\n    }\n  }\n\n  &:focus {\n    outline: 0;\n  }\n\n  &.two-dragged,\n  &.multiple-dragged {\n    .item-list-item-content {\n      @include drag-stack(before) {\n        top: 4px;\n        left: 2px;\n        opacity: 0.8;\n        z-index: -1;\n      }\n    }\n  }\n  &.multiple-dragged {\n    .item-list-item-content {\n      @include drag-stack(after) {\n        // It looked weird with 8px\n        top: 7px;\n        left: 4px;\n        opacity: 0.6;\n        z-index: -2;\n      }\n    }\n  }\n\n  .fa-grip-vertical {\n    color: $draggable-item-grip-color;\n  }\n\n  .title {\n    flex-grow: 1;\n  }\n\n  .number-badge {\n    padding: 0 $spacer-2;\n    border-radius: 1rem;\n    background-color: fg-opacity(25);\n    margin-right: $spacer-1;\n  }\n}\n\n.draggable-item-list {\n  .item-list-item {\n    padding: 0;\n    display: flex;\n\n    .draggable-item-list-item {\n      display: flex;\n      flex-grow: 1;\n      flex-direction: row;\n      outline: none;\n    }\n\n    .item-list-item-content {\n      border-radius: $border-radius;\n      margin: 0 $spacer-2 1px $spacer-2;\n      padding: calc(#{$spacer-1} * 0.5) $spacer-1 0 $spacer-2;\n      border: $draggable-item-border;\n      line-height: $btn-line-height;\n\n      &:hover {\n        background-color: $draggable-item-hover-bg;\n      }\n    }\n\n    &.keyboard-active {\n      .item-list-item-content {\n        background-color: transparent;\n\n        &:hover {\n          background-color: $draggable-item-hover-bg;\n        }\n      }\n    }\n\n    &.active {\n      /* stylelint-disable-next-line no-descending-specificity */\n      .item-list-item-content {\n        background-color: $draggable-item-selected-bg;\n\n        &:hover {\n          background-color: $draggable-item-selected-hover-bg;\n        }\n      }\n    }\n  }\n\n  &.is-dragging-from-this,\n  &.is-dragging-over {\n    .item-list-item {\n      .draggable-item-list-item {\n        &:focus {\n          .item-list-item-content {\n            outline: 0;\n            border: $draggable-item-border;\n            box-shadow: none;\n          }\n        }\n        .item-list-item-content:hover {\n          background-color: transparent;\n        }\n      }\n    }\n\n    .item-list-item.active {\n      .draggable-item-list-item {\n        .item-list-item-content {\n          background-color: $draggable-item-selected-dragging-bg;\n        }\n      }\n    }\n  }\n\n  // Sometimes @hello-pangea/dnd still adds the `is-dragging-over` class even though drop is disabled\n  // only show the ants if drop isn't disabled\n  &.is-dragging-over:not(.is-drop-disabled) {\n    .item-list-scroll-pane {\n      @include ants-base($foreground, $background);\n    }\n  }\n}\n\n.draggable-item-list-dragging-item-container:focus {\n  outline: 0;\n}\n","@use 'sass:math';\n\n//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents,  two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n  background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n  background-size:\n    $ant-size $ant-thickness,\n    $ant-size $ant-thickness,\n    $ant-thickness $ant-size,\n    $ant-thickness $ant-size;\n  background-position:\n    0 top,\n    0 bottom,\n    left 0,\n    right 0;\n  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n  animation: march 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n  &::#{$pseudo-element} {\n    content: ' ';\n    background: $primary;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    @content;\n  }\n}\n\n$focus-bg-transparency: 12%;\n$hover-bg-transparency: 14%;\n$active-bg-transparency: 28%;\n$exception-transparency: 28%;\n"]}

package/dist/DraggableItemList.d.ts

@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react';
 import memoize from 'memoizee';
-import { type DraggableChildrenFn } from 'react-beautiful-dnd';
+import { type DraggableChildrenFn } from '@hello-pangea/dnd';
 import { type Range } from '@deephaven/utils';
 import ItemList, { type RenderItemProps, type DefaultListItem, type ItemListProps } from './ItemList';
 import './DraggableItemList.scss';
@@ -25,10 +25,10 @@ type DraggableItemListState = {
 };
 /**
  * Show a draggable item list. It _must_ be used within a `DragDropContext`.
- * This implementation uses react-beautiful-dnd for handling dragging and dropping of items.
- * We use ItemList to handle selection for multi drag and drop (not built in to react-beautiful-dnd).
- * One caveat with the use of react-beautiful-dnd is that it doesn't allow a drag to be initiated while
- * using a modifier key: https://github.com/atlassian/react-beautiful-dnd/issues/1678
+ * This implementation uses @hello-pangea/dnd for handling dragging and dropping of items.
+ * We use ItemList to handle selection for multi drag and drop (not built in to @hello-pangea/dnd).
+ * One caveat with the use of @hello-pangea/dnd is that it doesn't allow a drag to be initiated while
+ * using a modifier key: https://github.com/atlassian/@hello-pangea/dnd/issues/1678
  */
 declare class DraggableItemList<T> extends PureComponent<DraggableItemListProps<T>, DraggableItemListState> {
     static DEFAULT_ROW_HEIGHT: number;
@@ -73,9 +73,9 @@ declare class DraggableItemList<T> extends PureComponent<DraggableItemListProps<
     selectItem(itemIndex: number): void;
     focusItem(itemIndex: number): void;
     scrollToItem(itemIndex: number): void;
-    getCachedDraggableItem: ((draggablePrefix: string, renderItem: DraggableRenderItemFn<T>, item: T, itemIndex: number, isFocused: boolean, isSelected: boolean, isDragDisabled: boolean, style: React.CSSProperties) => JSX.Element) & memoize.Memoized<(draggablePrefix: string, renderItem: DraggableRenderItemFn<T>, item: T, itemIndex: number, isFocused: boolean, isSelected: boolean, isDragDisabled: boolean, style: React.CSSProperties) => JSX.Element>;
+    getCachedDraggableItem: ((draggablePrefix: string, renderItem: DraggableRenderItemFn<T>, item: T, itemIndex: number, isFocused: boolean, isSelected: boolean, isDragDisabled: boolean, style: React.CSSProperties) => import("react/jsx-runtime").JSX.Element) & memoize.Memoized<(draggablePrefix: string, renderItem: DraggableRenderItemFn<T>, item: T, itemIndex: number, isFocused: boolean, isSelected: boolean, isDragDisabled: boolean, style: React.CSSProperties) => import("react/jsx-runtime").JSX.Element>;
     handleSelectionChange(selectedRanges: readonly Range[]): void;
-    getCachedRenderDraggableItem: ((draggablePrefix: string, isDragDisabled: boolean, renderItem: DraggableRenderItemFn<T>) => ({ item, itemIndex, isFocused, isSelected, style }: RenderItemProps<T>) => JSX.Element) & memoize.Memoized<(draggablePrefix: string, isDragDisabled: boolean, renderItem: DraggableRenderItemFn<T>) => ({ item, itemIndex, isFocused, isSelected, style }: RenderItemProps<T>) => JSX.Element>;
+    getCachedRenderDraggableItem: ((draggablePrefix: string, isDragDisabled: boolean, renderItem: DraggableRenderItemFn<T>) => ({ item, itemIndex, isFocused, isSelected, style }: RenderItemProps<T>) => import("react/jsx-runtime").JSX.Element) & memoize.Memoized<(draggablePrefix: string, isDragDisabled: boolean, renderItem: DraggableRenderItemFn<T>) => ({ item, itemIndex, isFocused, isSelected, style }: RenderItemProps<T>) => import("react/jsx-runtime").JSX.Element>;
     getCachedRenderClone: ((draggingItemClassName: string, items: readonly T[], offset: number, renderItem: DraggableRenderItemFn<T>) => DraggableChildrenFn) & memoize.Memoized<(draggingItemClassName: string, items: readonly T[], offset: number, renderItem: DraggableRenderItemFn<T>) => DraggableChildrenFn>;
     render(): JSX.Element;
 }