@deephaven/components 1.2.1-plotly-rc.3 → 1.3.0

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","ignoreList":[]}
+{"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"}

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","ignoreList":[]}
+{"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"}

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-input-disabled-fg);\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 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"]}

package/dist/DraggableItemList.js.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableItemList.js","names":["React","PureComponent","classNames","memoize","Draggable","Droppable","FontAwesomeIcon","vsGripper","RangeUtils","ItemList","Tooltip","jsx","_jsx","jsxs","_jsxs","DraggableItemList","renderHandle","children","icon","renderBadge","_ref","text","length","className","renderTextItem","_ref2","badgeText","renderItem","_ref3","_ref4","_item$displayValue","item","isClone","selectedCount","displayValue","value","concat","undefined","getDraggableId","draggablePrefix","itemIndex","getDraggableIndex","draggableId","num","split","pop","parseInt","constructor","props","_defineProperty","isFocused","isSelected","isDragDisabled","style","index","provided","_objectSpread","role","ref","innerRef","tabIndex","draggableProps","dragHandleProps","max","CACHE_SIZE","_ref5","getCachedDraggableItem","draggingItemClassName","items","offset","snapshot","rubric","state","source","handleSelectionChange","bind","itemList","createRef","selectItem","_this$itemList$curren","current","focusItem","_this$itemList$curren2","scrollToItem","_this$itemList$curren3","selectedRanges","setState","count","onSelectionChange","render","droppableId","isDoubleClickSelect","isDropDisabled","isMultiSelect","isStickyBottom","itemCount","onFocusChange","onSelect","onViewportChange","rowHeight","dataTestId","mode","renderClone","getCachedRenderClone","draggingFromThisWith","isDraggingOver","draggingOverWith","droppableProps","focusSelector","isDragSelect","getCachedRenderDraggableItem","DEFAULT_ROW_HEIGHT","isDeselectOnClick","disableSelect"],"sources":["../src/DraggableItemList.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport classNames from 'classnames';\nimport memoize from 'memoizee';\nimport {\n  Draggable,\n  Droppable,\n  type DraggableChildrenFn,\n} from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsGripper } from '@deephaven/icons';\nimport { RangeUtils, type Range } from '@deephaven/utils';\nimport ItemList, {\n  type RenderItemProps,\n  type DefaultListItem,\n  type ItemListProps,\n} from './ItemList';\nimport { Tooltip } from './popper';\nimport './DraggableItemList.scss';\n\nexport type DraggableRenderItemProps<T> = RenderItemProps<T> & {\n  isClone?: boolean;\n  selectedCount?: number;\n};\n\ntype DraggableRenderItemFn<T> = (\n  props: DraggableRenderItemProps<T>\n) => React.ReactNode;\n\ntype DraggableItemListProps<T> = Omit<\n  ItemListProps<T>,\n  'overscanCount' | 'focusSelector' | 'isDragSelect'\n> & {\n  className: string;\n  draggingItemClassName: string;\n  isDropDisabled: boolean;\n  // Whether to allow dragging items from this list\n  isDragDisabled: boolean;\n\n  renderItem: DraggableRenderItemFn<T>;\n  style: React.CSSProperties;\n\n  // The prefix to add to all draggable item IDs\n  draggablePrefix: string;\n  // The ID to give the droppable list\n  droppableId: string;\n\n  'data-testid'?: string;\n};\n\ntype DraggableItemListState = {\n  selectedCount: number;\n};\n\n/**\n * Show a draggable item list. It _must_ be used within a `DragDropContext`.\n * This implementation uses react-beautiful-dnd for handling dragging and dropping of items.\n * We use ItemList to handle selection for multi drag and drop (not built in to react-beautiful-dnd).\n * One caveat with the use of react-beautiful-dnd is that it doesn't allow a drag to be initiated while\n * using a modifier key: https://github.com/atlassian/react-beautiful-dnd/issues/1678\n */\nclass DraggableItemList<T> extends PureComponent<\n  DraggableItemListProps<T>,\n  DraggableItemListState\n> {\n  static DEFAULT_ROW_HEIGHT = 30;\n\n  static defaultProps = {\n    className: '',\n    draggingItemClassName: '',\n    offset: 0,\n    items: [],\n    rowHeight: DraggableItemList.DEFAULT_ROW_HEIGHT,\n    isDeselectOnClick: true,\n    isDoubleClickSelect: true,\n    isDropDisabled: false,\n    isDragDisabled: false,\n    isMultiSelect: false,\n    isStickyBottom: false,\n    disableSelect: false,\n    style: null,\n    onFocusChange(): void {\n      // no-op\n    },\n    onSelect(): void {\n      // no-op\n    },\n    onSelectionChange(): void {\n      // no-op\n    },\n    onViewportChange(): void {\n      // no-op\n    },\n    renderItem: DraggableItemList.renderItem,\n    selectedRanges: [],\n    draggablePrefix: 'draggable-item',\n    droppableId: 'droppable-item-list',\n    'data-testid': undefined,\n  };\n\n  static renderHandle(): JSX.Element {\n    return (\n      <div>\n        <Tooltip>Drag to re-order</Tooltip>\n        <FontAwesomeIcon icon={vsGripper} />\n      </div>\n    );\n  }\n\n  static renderBadge({ text }: { text?: string }): React.ReactNode {\n    return text != null && text.length > 0 ? (\n      <span className=\"number-badge\">{text}</span>\n    ) : null;\n  }\n\n  static renderTextItem({\n    text,\n    badgeText = '',\n    className = '',\n  }: {\n    text?: string;\n    badgeText?: string;\n    className: string;\n  }): JSX.Element {\n    return (\n      <div\n        className={classNames(\n          'item-list-item-content',\n          'draggable-item-list-item-content',\n          className\n        )}\n      >\n        <span className=\"title\">{text}</span>\n        {DraggableItemList.renderBadge({ text: badgeText })}\n        {DraggableItemList.renderHandle()}\n      </div>\n    );\n  }\n\n  static renderItem<P extends DefaultListItem>({\n    item,\n    isClone,\n    selectedCount,\n  }: DraggableRenderItemProps<P>): JSX.Element {\n    const text =\n      item != null ? item.displayValue ?? item.value ?? `${item}` : '';\n    const badgeText =\n      isClone !== undefined && isClone ? `${selectedCount}` : '';\n    const className =\n      isClone !== undefined && isClone ? 'item-list-item-clone' : '';\n    return DraggableItemList.renderTextItem({ text, badgeText, className });\n  }\n\n  static getDraggableId(draggablePrefix: string, itemIndex: number): string {\n    return `${draggablePrefix}/${itemIndex}`;\n  }\n\n  static getDraggableIndex(draggableId: string): number {\n    const num = draggableId.split('/').pop();\n    return parseInt(num !== undefined ? num : '', 10);\n  }\n\n  constructor(props: DraggableItemListProps<T>) {\n    super(props);\n\n    this.handleSelectionChange = this.handleSelectionChange.bind(this);\n\n    this.itemList = React.createRef();\n\n    this.state = {\n      selectedCount: 0,\n    };\n  }\n\n  itemList: React.RefObject<ItemList<T>>;\n\n  selectItem(itemIndex: number): void {\n    this.itemList.current?.selectItem(itemIndex);\n  }\n\n  focusItem(itemIndex: number): void {\n    this.itemList.current?.focusItem(itemIndex);\n  }\n\n  scrollToItem(itemIndex: number): void {\n    this.itemList.current?.scrollToItem(itemIndex);\n  }\n\n  getCachedDraggableItem = memoize(\n    (\n      draggablePrefix: string,\n      renderItem: DraggableRenderItemFn<T>,\n      item: T,\n      itemIndex: number,\n      isFocused: boolean,\n      isSelected: boolean,\n      isDragDisabled: boolean,\n      style: React.CSSProperties\n    ) => (\n      <Draggable\n        key={itemIndex}\n        draggableId={DraggableItemList.getDraggableId(\n          draggablePrefix,\n          itemIndex\n        )}\n        index={itemIndex}\n        isDragDisabled={isDragDisabled}\n      >\n        {provided => (\n          <div\n            role=\"menuitem\"\n            className=\"draggable-item-list-item\"\n            ref={provided.innerRef}\n            tabIndex={-1}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...provided.draggableProps}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...provided.dragHandleProps}\n          >\n            {renderItem({\n              item,\n              itemIndex,\n              isFocused,\n              isSelected,\n              style,\n              isClone: false,\n            })}\n          </div>\n        )}\n      </Draggable>\n    ),\n    { max: ItemList.CACHE_SIZE }\n  );\n\n  handleSelectionChange(selectedRanges: readonly Range[]): void {\n    this.setState({ selectedCount: RangeUtils.count(selectedRanges) });\n\n    const { onSelectionChange } = this.props;\n    onSelectionChange(selectedRanges);\n  }\n\n  getCachedRenderDraggableItem = memoize(\n    (\n      draggablePrefix: string,\n      isDragDisabled: boolean,\n      renderItem: DraggableRenderItemFn<T>\n    ) =>\n      ({ item, itemIndex, isFocused, isSelected, style }: RenderItemProps<T>) =>\n        this.getCachedDraggableItem(\n          draggablePrefix,\n          renderItem,\n          item,\n          itemIndex,\n          isFocused,\n          isSelected,\n          isDragDisabled,\n          style\n        ),\n    { max: 1 }\n  );\n\n  getCachedRenderClone = memoize(\n    (\n      draggingItemClassName: string,\n      items: readonly T[],\n      offset: number,\n      renderItem: DraggableRenderItemFn<T>\n    ): DraggableChildrenFn =>\n      // eslint-disable-next-line react/no-unstable-nested-components, react/display-name, react/function-component-definition\n      (provided, snapshot, rubric) => {\n        // eslint-disable-next-line react/no-this-in-sfc\n        const { selectedCount } = this.state;\n        const { draggableProps, dragHandleProps, innerRef } = provided;\n        const { index: itemIndex } = rubric.source;\n        const item = items[itemIndex - offset];\n        return (\n          <div\n            className={classNames(\n              'draggable-item-list-dragging-item-container',\n              draggingItemClassName\n            )}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...draggableProps}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...dragHandleProps}\n            ref={innerRef}\n          >\n            <div\n              className={classNames(\n                'draggable-item-list-dragging-item',\n                { 'two-dragged': selectedCount === 2 },\n                { 'multiple-dragged': selectedCount > 2 }\n              )}\n            >\n              {renderItem({\n                item,\n                itemIndex,\n                isFocused: false,\n                isSelected: true,\n                style: {},\n                isClone: true,\n                selectedCount,\n              })}\n            </div>\n          </div>\n        );\n      },\n    { max: 1 }\n  );\n\n  render(): JSX.Element {\n    const {\n      className,\n      draggablePrefix,\n      draggingItemClassName,\n      droppableId,\n      isDoubleClickSelect,\n      isDragDisabled,\n      isDropDisabled,\n      isMultiSelect,\n      isStickyBottom,\n      itemCount,\n      items,\n      offset,\n      onFocusChange,\n      onSelect,\n      onViewportChange,\n      renderItem,\n      rowHeight,\n      selectedRanges,\n      style,\n      'data-testid': dataTestId,\n    } = this.props;\n    return (\n      <Droppable\n        isDropDisabled={isDropDisabled}\n        droppableId={droppableId}\n        mode=\"virtual\"\n        renderClone={this.getCachedRenderClone(\n          draggingItemClassName,\n          items,\n          offset,\n          renderItem\n        )}\n        data-testid={dataTestId}\n      >\n        {(provided, snapshot) => (\n          <div\n            role=\"menu\"\n            className={classNames('draggable-item-list', className, {\n              'is-drop-disabled': isDropDisabled,\n              'is-drag-disabled': isDragDisabled,\n              'is-dragging-from-this': snapshot.draggingFromThisWith,\n              'is-dragging-over': snapshot.isDraggingOver,\n              'is-dropping': snapshot.draggingOverWith,\n            })}\n            style={style}\n            ref={provided.innerRef}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...provided.droppableProps}\n          >\n            <ItemList\n              focusSelector=\".draggable-item-list-item\"\n              isDoubleClickSelect={isDoubleClickSelect}\n              isDragSelect={false}\n              isMultiSelect={isMultiSelect}\n              isStickyBottom={isStickyBottom}\n              itemCount={itemCount}\n              items={items}\n              onFocusChange={onFocusChange}\n              onSelect={onSelect}\n              onSelectionChange={this.handleSelectionChange}\n              onViewportChange={onViewportChange}\n              offset={offset}\n              ref={this.itemList}\n              renderItem={this.getCachedRenderDraggableItem(\n                draggablePrefix,\n                isDragDisabled,\n                renderItem\n              )}\n              rowHeight={rowHeight}\n              selectedRanges={selectedRanges}\n            />\n          </div>\n        )}\n      </Droppable>\n    );\n  }\n}\n\nexport default DraggableItemList;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DraggableItemList.js","names":["React","PureComponent","classNames","memoize","Draggable","Droppable","FontAwesomeIcon","vsGripper","RangeUtils","ItemList","Tooltip","jsx","_jsx","jsxs","_jsxs","DraggableItemList","renderHandle","children","icon","renderBadge","_ref","text","length","className","renderTextItem","_ref2","badgeText","renderItem","_ref3","_ref4","_item$displayValue","item","isClone","selectedCount","displayValue","value","concat","undefined","getDraggableId","draggablePrefix","itemIndex","getDraggableIndex","draggableId","num","split","pop","parseInt","constructor","props","_defineProperty","isFocused","isSelected","isDragDisabled","style","index","provided","_objectSpread","role","ref","innerRef","tabIndex","draggableProps","dragHandleProps","max","CACHE_SIZE","_ref5","getCachedDraggableItem","draggingItemClassName","items","offset","snapshot","rubric","state","source","handleSelectionChange","bind","itemList","createRef","selectItem","_this$itemList$curren","current","focusItem","_this$itemList$curren2","scrollToItem","_this$itemList$curren3","selectedRanges","setState","count","onSelectionChange","render","droppableId","isDoubleClickSelect","isDropDisabled","isMultiSelect","isStickyBottom","itemCount","onFocusChange","onSelect","onViewportChange","rowHeight","dataTestId","mode","renderClone","getCachedRenderClone","draggingFromThisWith","isDraggingOver","draggingOverWith","droppableProps","focusSelector","isDragSelect","getCachedRenderDraggableItem","DEFAULT_ROW_HEIGHT","isDeselectOnClick","disableSelect"],"sources":["../src/DraggableItemList.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport classNames from 'classnames';\nimport memoize from 'memoizee';\nimport {\n  Draggable,\n  Droppable,\n  type DraggableChildrenFn,\n} from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsGripper } from '@deephaven/icons';\nimport { RangeUtils, type Range } from '@deephaven/utils';\nimport ItemList, {\n  type RenderItemProps,\n  type DefaultListItem,\n  type ItemListProps,\n} from './ItemList';\nimport { Tooltip } from './popper';\nimport './DraggableItemList.scss';\n\nexport type DraggableRenderItemProps<T> = RenderItemProps<T> & {\n  isClone?: boolean;\n  selectedCount?: number;\n};\n\ntype DraggableRenderItemFn<T> = (\n  props: DraggableRenderItemProps<T>\n) => React.ReactNode;\n\ntype DraggableItemListProps<T> = Omit<\n  ItemListProps<T>,\n  'overscanCount' | 'focusSelector' | 'isDragSelect'\n> & {\n  className: string;\n  draggingItemClassName: string;\n  isDropDisabled: boolean;\n  // Whether to allow dragging items from this list\n  isDragDisabled: boolean;\n\n  renderItem: DraggableRenderItemFn<T>;\n  style: React.CSSProperties;\n\n  // The prefix to add to all draggable item IDs\n  draggablePrefix: string;\n  // The ID to give the droppable list\n  droppableId: string;\n\n  'data-testid'?: string;\n};\n\ntype DraggableItemListState = {\n  selectedCount: number;\n};\n\n/**\n * Show a draggable item list. It _must_ be used within a `DragDropContext`.\n * This implementation uses react-beautiful-dnd for handling dragging and dropping of items.\n * We use ItemList to handle selection for multi drag and drop (not built in to react-beautiful-dnd).\n * One caveat with the use of react-beautiful-dnd is that it doesn't allow a drag to be initiated while\n * using a modifier key: https://github.com/atlassian/react-beautiful-dnd/issues/1678\n */\nclass DraggableItemList<T> extends PureComponent<\n  DraggableItemListProps<T>,\n  DraggableItemListState\n> {\n  static DEFAULT_ROW_HEIGHT = 30;\n\n  static defaultProps = {\n    className: '',\n    draggingItemClassName: '',\n    offset: 0,\n    items: [],\n    rowHeight: DraggableItemList.DEFAULT_ROW_HEIGHT,\n    isDeselectOnClick: true,\n    isDoubleClickSelect: true,\n    isDropDisabled: false,\n    isDragDisabled: false,\n    isMultiSelect: false,\n    isStickyBottom: false,\n    disableSelect: false,\n    style: null,\n    onFocusChange(): void {\n      // no-op\n    },\n    onSelect(): void {\n      // no-op\n    },\n    onSelectionChange(): void {\n      // no-op\n    },\n    onViewportChange(): void {\n      // no-op\n    },\n    renderItem: DraggableItemList.renderItem,\n    selectedRanges: [],\n    draggablePrefix: 'draggable-item',\n    droppableId: 'droppable-item-list',\n    'data-testid': undefined,\n  };\n\n  static renderHandle(): JSX.Element {\n    return (\n      <div>\n        <Tooltip>Drag to re-order</Tooltip>\n        <FontAwesomeIcon icon={vsGripper} />\n      </div>\n    );\n  }\n\n  static renderBadge({ text }: { text?: string }): React.ReactNode {\n    return text != null && text.length > 0 ? (\n      <span className=\"number-badge\">{text}</span>\n    ) : null;\n  }\n\n  static renderTextItem({\n    text,\n    badgeText = '',\n    className = '',\n  }: {\n    text?: string;\n    badgeText?: string;\n    className: string;\n  }): JSX.Element {\n    return (\n      <div\n        className={classNames(\n          'item-list-item-content',\n          'draggable-item-list-item-content',\n          className\n        )}\n      >\n        <span className=\"title\">{text}</span>\n        {DraggableItemList.renderBadge({ text: badgeText })}\n        {DraggableItemList.renderHandle()}\n      </div>\n    );\n  }\n\n  static renderItem<P extends DefaultListItem>({\n    item,\n    isClone,\n    selectedCount,\n  }: DraggableRenderItemProps<P>): JSX.Element {\n    const text =\n      item != null ? item.displayValue ?? item.value ?? `${item}` : '';\n    const badgeText =\n      isClone !== undefined && isClone ? `${selectedCount}` : '';\n    const className =\n      isClone !== undefined && isClone ? 'item-list-item-clone' : '';\n    return DraggableItemList.renderTextItem({ text, badgeText, className });\n  }\n\n  static getDraggableId(draggablePrefix: string, itemIndex: number): string {\n    return `${draggablePrefix}/${itemIndex}`;\n  }\n\n  static getDraggableIndex(draggableId: string): number {\n    const num = draggableId.split('/').pop();\n    return parseInt(num !== undefined ? num : '', 10);\n  }\n\n  constructor(props: DraggableItemListProps<T>) {\n    super(props);\n\n    this.handleSelectionChange = this.handleSelectionChange.bind(this);\n\n    this.itemList = React.createRef();\n\n    this.state = {\n      selectedCount: 0,\n    };\n  }\n\n  itemList: React.RefObject<ItemList<T>>;\n\n  selectItem(itemIndex: number): void {\n    this.itemList.current?.selectItem(itemIndex);\n  }\n\n  focusItem(itemIndex: number): void {\n    this.itemList.current?.focusItem(itemIndex);\n  }\n\n  scrollToItem(itemIndex: number): void {\n    this.itemList.current?.scrollToItem(itemIndex);\n  }\n\n  getCachedDraggableItem = memoize(\n    (\n      draggablePrefix: string,\n      renderItem: DraggableRenderItemFn<T>,\n      item: T,\n      itemIndex: number,\n      isFocused: boolean,\n      isSelected: boolean,\n      isDragDisabled: boolean,\n      style: React.CSSProperties\n    ) => (\n      <Draggable\n        key={itemIndex}\n        draggableId={DraggableItemList.getDraggableId(\n          draggablePrefix,\n          itemIndex\n        )}\n        index={itemIndex}\n        isDragDisabled={isDragDisabled}\n      >\n        {provided => (\n          <div\n            role=\"menuitem\"\n            className=\"draggable-item-list-item\"\n            ref={provided.innerRef}\n            tabIndex={-1}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...provided.draggableProps}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...provided.dragHandleProps}\n          >\n            {renderItem({\n              item,\n              itemIndex,\n              isFocused,\n              isSelected,\n              style,\n              isClone: false,\n            })}\n          </div>\n        )}\n      </Draggable>\n    ),\n    { max: ItemList.CACHE_SIZE }\n  );\n\n  handleSelectionChange(selectedRanges: readonly Range[]): void {\n    this.setState({ selectedCount: RangeUtils.count(selectedRanges) });\n\n    const { onSelectionChange } = this.props;\n    onSelectionChange(selectedRanges);\n  }\n\n  getCachedRenderDraggableItem = memoize(\n    (\n      draggablePrefix: string,\n      isDragDisabled: boolean,\n      renderItem: DraggableRenderItemFn<T>\n    ) =>\n      ({ item, itemIndex, isFocused, isSelected, style }: RenderItemProps<T>) =>\n        this.getCachedDraggableItem(\n          draggablePrefix,\n          renderItem,\n          item,\n          itemIndex,\n          isFocused,\n          isSelected,\n          isDragDisabled,\n          style\n        ),\n    { max: 1 }\n  );\n\n  getCachedRenderClone = memoize(\n    (\n      draggingItemClassName: string,\n      items: readonly T[],\n      offset: number,\n      renderItem: DraggableRenderItemFn<T>\n    ): DraggableChildrenFn =>\n      // eslint-disable-next-line react/no-unstable-nested-components, react/display-name, react/function-component-definition\n      (provided, snapshot, rubric) => {\n        // eslint-disable-next-line react/no-this-in-sfc\n        const { selectedCount } = this.state;\n        const { draggableProps, dragHandleProps, innerRef } = provided;\n        const { index: itemIndex } = rubric.source;\n        const item = items[itemIndex - offset];\n        return (\n          <div\n            className={classNames(\n              'draggable-item-list-dragging-item-container',\n              draggingItemClassName\n            )}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...draggableProps}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...dragHandleProps}\n            ref={innerRef}\n          >\n            <div\n              className={classNames(\n                'draggable-item-list-dragging-item',\n                { 'two-dragged': selectedCount === 2 },\n                { 'multiple-dragged': selectedCount > 2 }\n              )}\n            >\n              {renderItem({\n                item,\n                itemIndex,\n                isFocused: false,\n                isSelected: true,\n                style: {},\n                isClone: true,\n                selectedCount,\n              })}\n            </div>\n          </div>\n        );\n      },\n    { max: 1 }\n  );\n\n  render(): JSX.Element {\n    const {\n      className,\n      draggablePrefix,\n      draggingItemClassName,\n      droppableId,\n      isDoubleClickSelect,\n      isDragDisabled,\n      isDropDisabled,\n      isMultiSelect,\n      isStickyBottom,\n      itemCount,\n      items,\n      offset,\n      onFocusChange,\n      onSelect,\n      onViewportChange,\n      renderItem,\n      rowHeight,\n      selectedRanges,\n      style,\n      'data-testid': dataTestId,\n    } = this.props;\n    return (\n      <Droppable\n        isDropDisabled={isDropDisabled}\n        droppableId={droppableId}\n        mode=\"virtual\"\n        renderClone={this.getCachedRenderClone(\n          draggingItemClassName,\n          items,\n          offset,\n          renderItem\n        )}\n        data-testid={dataTestId}\n      >\n        {(provided, snapshot) => (\n          <div\n            role=\"menu\"\n            className={classNames('draggable-item-list', className, {\n              'is-drop-disabled': isDropDisabled,\n              'is-drag-disabled': isDragDisabled,\n              'is-dragging-from-this': snapshot.draggingFromThisWith,\n              'is-dragging-over': snapshot.isDraggingOver,\n              'is-dropping': snapshot.draggingOverWith,\n            })}\n            style={style}\n            ref={provided.innerRef}\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...provided.droppableProps}\n          >\n            <ItemList\n              focusSelector=\".draggable-item-list-item\"\n              isDoubleClickSelect={isDoubleClickSelect}\n              isDragSelect={false}\n              isMultiSelect={isMultiSelect}\n              isStickyBottom={isStickyBottom}\n              itemCount={itemCount}\n              items={items}\n              onFocusChange={onFocusChange}\n              onSelect={onSelect}\n              onSelectionChange={this.handleSelectionChange}\n              onViewportChange={onViewportChange}\n              offset={offset}\n              ref={this.itemList}\n              renderItem={this.getCachedRenderDraggableItem(\n                draggablePrefix,\n                isDragDisabled,\n                renderItem\n              )}\n              rowHeight={rowHeight}\n              selectedRanges={selectedRanges}\n            />\n          </div>\n        )}\n      </Droppable>\n    );\n  }\n}\n\nexport default DraggableItemList;\n"],"mappings":"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"}

package/dist/EditableItemList.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditableItemList.js","names":["React","useCallback","useMemo","useState","classNames","clamp","vsAdd","vsTrash","RangeUtils","Button","ItemList","jsx","_jsx","jsxs","_jsxs","EditableItemList","props","isInvalid","items","onAdd","undefined","onDelete","validate","inputError","setInputError","selectedRanges","setSelectedRanges","value","setValue","handleSelectionChange","ranges","handleDelete","getItemsInRanges","handleAdd","validationError","handleInputChange","event","inputValue","target","handleInputFocus","handleInputKeyDown","key","containerHeight","length","DEFAULT_ROW_HEIGHT","className","children","style","height","itemCount","map","item","index","isSelected","offset","onSelectionChange","isMultiSelect","placeholder","type","onChange","onFocus","onKeyDown","kind","onClick","disabled","icon","tooltip"],"sources":["../src/EditableItemList.tsx"],"sourcesContent":["import React, {\n  type ChangeEvent,\n  type KeyboardEvent,\n  useCallback,\n  useMemo,\n  useState,\n} from 'react';\nimport classNames from 'classnames';\nimport clamp from 'lodash.clamp';\nimport { vsAdd, vsTrash } from '@deephaven/icons';\nimport { type Range, RangeUtils } from '@deephaven/utils';\nimport Button from './Button';\nimport ItemList from './ItemList';\n\nexport interface EditableItemListProps {\n  isInvalid?: boolean;\n  items: string[];\n  onDelete: (items: string[]) => void;\n  onAdd: (item: string) => void;\n  validate?: (item: string) => Error | null;\n}\n\n// Display a list of items with an input for adding new items, and Add/Delete buttons\nfunction EditableItemList(props: EditableItemListProps): React.ReactElement {\n  const {\n    isInvalid = false,\n    items,\n    onAdd = () => undefined,\n    onDelete = () => undefined,\n    validate = () => null,\n  } = props;\n  const [inputError, setInputError] = useState<Error | null>(null);\n  const [selectedRanges, setSelectedRanges] = useState<readonly Range[]>([]);\n  const [value, setValue] = useState('');\n\n  const handleSelectionChange = useCallback((ranges: readonly Range[]) => {\n    setSelectedRanges(ranges);\n  }, []);\n\n  const handleDelete = useCallback(() => {\n    onDelete(RangeUtils.getItemsInRanges(items, selectedRanges));\n    setSelectedRanges([]);\n  }, [items, selectedRanges, onDelete]);\n\n  const handleAdd = useCallback(() => {\n    if (value === '') {\n      return;\n    }\n    const validationError = validate(value);\n    if (validationError == null) {\n      onAdd(value);\n      setValue('');\n    } else {\n      setInputError(validationError);\n    }\n  }, [value, onAdd, validate]);\n\n  const handleInputChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      const { value: inputValue } = event.target;\n      setValue(inputValue);\n      setInputError(inputValue === '' ? null : validate(inputValue));\n    },\n    [validate]\n  );\n\n  const handleInputFocus = useCallback(() => {\n    setSelectedRanges([]);\n  }, []);\n\n  const handleInputKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Enter') {\n        handleAdd();\n      }\n    },\n    [handleAdd]\n  );\n\n  const containerHeight = useMemo(\n    (): number => 14 + clamp(items.length, 1, 6) * ItemList.DEFAULT_ROW_HEIGHT,\n    [items.length]\n  );\n\n  return (\n    <div\n      className={classNames('editable-item-list-container', {\n        'is-invalid': isInvalid,\n      })}\n    >\n      <div style={{ height: containerHeight }}>\n        <ItemList\n          itemCount={items.length}\n          items={items.map((item, index) => ({\n            value: item,\n            isSelected: RangeUtils.isSelected(selectedRanges, index),\n          }))}\n          offset={0}\n          selectedRanges={selectedRanges}\n          onSelectionChange={handleSelectionChange}\n          isMultiSelect\n        />\n      </div>\n      <div className=\"d-flex flex-row pt-2\">\n        <div className=\"d-flex flex-grow-1\">\n          <input\n            className={classNames('form-control', {\n              'is-invalid': inputError != null,\n            })}\n            placeholder=\"Enter value\"\n            type=\"text\"\n            value={value}\n            onChange={handleInputChange}\n            onFocus={handleInputFocus}\n            onKeyDown={handleInputKeyDown}\n          />\n        </div>\n        <div className=\"d-flex align-items-start mt-1 ml-2\">\n          <Button\n            kind=\"ghost\"\n            onClick={handleAdd}\n            disabled={inputError != null || value === ''}\n            icon={vsAdd}\n            tooltip=\"Add new item\"\n            data-testid=\"add-item-button\"\n          />\n          <Button\n            kind=\"ghost\"\n            onClick={handleDelete}\n            disabled={selectedRanges.length === 0}\n            icon={vsTrash}\n            tooltip=\"Delete selected items\"\n            data-testid=\"delete-item-button\"\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default EditableItemList;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"EditableItemList.js","names":["React","useCallback","useMemo","useState","classNames","clamp","vsAdd","vsTrash","RangeUtils","Button","ItemList","jsx","_jsx","jsxs","_jsxs","EditableItemList","props","isInvalid","items","onAdd","undefined","onDelete","validate","inputError","setInputError","selectedRanges","setSelectedRanges","value","setValue","handleSelectionChange","ranges","handleDelete","getItemsInRanges","handleAdd","validationError","handleInputChange","event","inputValue","target","handleInputFocus","handleInputKeyDown","key","containerHeight","length","DEFAULT_ROW_HEIGHT","className","children","style","height","itemCount","map","item","index","isSelected","offset","onSelectionChange","isMultiSelect","placeholder","type","onChange","onFocus","onKeyDown","kind","onClick","disabled","icon","tooltip"],"sources":["../src/EditableItemList.tsx"],"sourcesContent":["import React, {\n  type ChangeEvent,\n  type KeyboardEvent,\n  useCallback,\n  useMemo,\n  useState,\n} from 'react';\nimport classNames from 'classnames';\nimport clamp from 'lodash.clamp';\nimport { vsAdd, vsTrash } from '@deephaven/icons';\nimport { type Range, RangeUtils } from '@deephaven/utils';\nimport Button from './Button';\nimport ItemList from './ItemList';\n\nexport interface EditableItemListProps {\n  isInvalid?: boolean;\n  items: string[];\n  onDelete: (items: string[]) => void;\n  onAdd: (item: string) => void;\n  validate?: (item: string) => Error | null;\n}\n\n// Display a list of items with an input for adding new items, and Add/Delete buttons\nfunction EditableItemList(props: EditableItemListProps): React.ReactElement {\n  const {\n    isInvalid = false,\n    items,\n    onAdd = () => undefined,\n    onDelete = () => undefined,\n    validate = () => null,\n  } = props;\n  const [inputError, setInputError] = useState<Error | null>(null);\n  const [selectedRanges, setSelectedRanges] = useState<readonly Range[]>([]);\n  const [value, setValue] = useState('');\n\n  const handleSelectionChange = useCallback((ranges: readonly Range[]) => {\n    setSelectedRanges(ranges);\n  }, []);\n\n  const handleDelete = useCallback(() => {\n    onDelete(RangeUtils.getItemsInRanges(items, selectedRanges));\n    setSelectedRanges([]);\n  }, [items, selectedRanges, onDelete]);\n\n  const handleAdd = useCallback(() => {\n    if (value === '') {\n      return;\n    }\n    const validationError = validate(value);\n    if (validationError == null) {\n      onAdd(value);\n      setValue('');\n    } else {\n      setInputError(validationError);\n    }\n  }, [value, onAdd, validate]);\n\n  const handleInputChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      const { value: inputValue } = event.target;\n      setValue(inputValue);\n      setInputError(inputValue === '' ? null : validate(inputValue));\n    },\n    [validate]\n  );\n\n  const handleInputFocus = useCallback(() => {\n    setSelectedRanges([]);\n  }, []);\n\n  const handleInputKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Enter') {\n        handleAdd();\n      }\n    },\n    [handleAdd]\n  );\n\n  const containerHeight = useMemo(\n    (): number => 14 + clamp(items.length, 1, 6) * ItemList.DEFAULT_ROW_HEIGHT,\n    [items.length]\n  );\n\n  return (\n    <div\n      className={classNames('editable-item-list-container', {\n        'is-invalid': isInvalid,\n      })}\n    >\n      <div style={{ height: containerHeight }}>\n        <ItemList\n          itemCount={items.length}\n          items={items.map((item, index) => ({\n            value: item,\n            isSelected: RangeUtils.isSelected(selectedRanges, index),\n          }))}\n          offset={0}\n          selectedRanges={selectedRanges}\n          onSelectionChange={handleSelectionChange}\n          isMultiSelect\n        />\n      </div>\n      <div className=\"d-flex flex-row pt-2\">\n        <div className=\"d-flex flex-grow-1\">\n          <input\n            className={classNames('form-control', {\n              'is-invalid': inputError != null,\n            })}\n            placeholder=\"Enter value\"\n            type=\"text\"\n            value={value}\n            onChange={handleInputChange}\n            onFocus={handleInputFocus}\n            onKeyDown={handleInputKeyDown}\n          />\n        </div>\n        <div className=\"d-flex align-items-start mt-1 ml-2\">\n          <Button\n            kind=\"ghost\"\n            onClick={handleAdd}\n            disabled={inputError != null || value === ''}\n            icon={vsAdd}\n            tooltip=\"Add new item\"\n            data-testid=\"add-item-button\"\n          />\n          <Button\n            kind=\"ghost\"\n            onClick={handleDelete}\n            disabled={selectedRanges.length === 0}\n            icon={vsTrash}\n            tooltip=\"Delete selected items\"\n            data-testid=\"delete-item-button\"\n          />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default EditableItemList;\n"],"mappings":"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"}

package/dist/ErrorBoundary.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorBoundary.js","names":["Log","React","Component","LoadingOverlay","jsx","_jsx","log","module","ErrorBoundary","getDerivedStateFromError","error","constructor","props","state","undefined","componentDidCatch","errorInfo","onError","render","children","className","fallback","errorMessage","concat","isLoading","isLoaded"],"sources":["../src/ErrorBoundary.tsx"],"sourcesContent":["import Log from '@deephaven/log';\nimport React, { Component, type ReactNode } from 'react';\nimport LoadingOverlay from './LoadingOverlay';\n\nconst log = Log.module('ErrorBoundary');\n\nexport interface ErrorBoundaryProps {\n  /** Children to catch errors from */\n  children: ReactNode;\n\n  /** Classname to wrap the error message with */\n  className?: string;\n\n  /** Callback for when an error occurs */\n  onError?: (error: Error, errorInfo: React.ErrorInfo) => void;\n\n  /** Custom fallback element */\n  fallback?: ReactNode;\n}\n\nexport interface ErrorBoundaryState {\n  error?: Error;\n}\n\n/**\n * Error boundary for catching render errors in React. Displays an error message if an error is caught by default, or you can specify a fallback component to render.\n * https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary\n */\nexport class ErrorBoundary extends Component<\n  ErrorBoundaryProps,\n  ErrorBoundaryState\n> {\n  static getDerivedStateFromError(error: Error): ErrorBoundaryState {\n    return { error };\n  }\n\n  constructor(props: ErrorBoundaryProps) {\n    super(props);\n    this.state = { error: undefined };\n  }\n\n  componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n    const { onError } = this.props;\n    log.error('Error caught by ErrorBoundary', error, errorInfo);\n    onError?.(error, errorInfo);\n  }\n\n  render(): ReactNode {\n    const { children, className, fallback } = this.props;\n    const { error } = this.state;\n    if (error != null) {\n      if (fallback != null) {\n        return fallback;\n      }\n\n      return (\n        <div className={className}>\n          <LoadingOverlay\n            errorMessage={`${error}`}\n            isLoading={false}\n            isLoaded={false}\n          />\n        </div>\n      );\n    }\n\n    // We need to check for undefined children because React will throw an error if we return undefined from a render method\n    // Note this behaviour was changed in React 18: https://github.com/reactwg/react-18/discussions/75\n    return children ?? null;\n  }\n}\n\nexport default ErrorBoundary;\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,gBAAgB;AAChC,OAAOC,KAAK,IAAIC,SAAS,QAAwB,OAAO;AAAC,OAClDC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAErB,IAAMC,GAAG,GAAGN,GAAG,CAACO,MAAM,CAAC,eAAe,CAAC;AAoBvC;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,SAASN,SAAS,CAG1C;EACA,OAAOO,wBAAwBA,CAACC,KAAY,EAAsB;IAChE,OAAO;MAAEA;IAAM,CAAC;EAClB;EAEAC,WAAWA,CAACC,KAAyB,EAAE;IACrC,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MAAEH,KAAK,EAAEI;IAAU,CAAC;EACnC;EAEAC,iBAAiBA,CAACL,KAAY,EAAEM,SAA0B,EAAQ;IAChE,IAAM;MAAEC;IAAQ,CAAC,GAAG,IAAI,CAACL,KAAK;IAC9BN,GAAG,CAACI,KAAK,CAAC,+BAA+B,EAAEA,KAAK,EAAEM,SAAS,CAAC;IAC5DC,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAGP,KAAK,EAAEM,SAAS,CAAC;EAC7B;EAEAE,MAAMA,CAAA,EAAc;IAClB,IAAM;MAAEC,QAAQ;MAAEC,SAAS;MAAEC;IAAS,CAAC,GAAG,IAAI,CAACT,KAAK;IACpD,IAAM;MAAEF;IAAM,CAAC,GAAG,IAAI,CAACG,KAAK;IAC5B,IAAIH,KAAK,IAAI,IAAI,EAAE;MACjB,IAAIW,QAAQ,IAAI,IAAI,EAAE;QACpB,OAAOA,QAAQ;MACjB;MAEA,oBACEhB,IAAA;QAAKe,SAAS,EAAEA,SAAU;QAAAD,QAAA,eACxBd,IAAA,CAACF,cAAc;UACbmB,YAAY,KAAAC,MAAA,CAAKb,KAAK,CAAG;UACzBc,SAAS,EAAE,KAAM;UACjBC,QAAQ,EAAE;QAAM,CACjB;MAAC,CACC,CAAC;IAEV;;IAEA;IACA;IACA,OAAON,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAI,IAAI;EACzB;AACF;AAEA,eAAeX,aAAa","ignoreList":[]}
+{"version":3,"file":"ErrorBoundary.js","names":["Log","React","Component","LoadingOverlay","jsx","_jsx","log","module","ErrorBoundary","getDerivedStateFromError","error","constructor","props","state","undefined","componentDidCatch","errorInfo","onError","render","children","className","fallback","errorMessage","concat","isLoading","isLoaded"],"sources":["../src/ErrorBoundary.tsx"],"sourcesContent":["import Log from '@deephaven/log';\nimport React, { Component, type ReactNode } from 'react';\nimport LoadingOverlay from './LoadingOverlay';\n\nconst log = Log.module('ErrorBoundary');\n\nexport interface ErrorBoundaryProps {\n  /** Children to catch errors from */\n  children: ReactNode;\n\n  /** Classname to wrap the error message with */\n  className?: string;\n\n  /** Callback for when an error occurs */\n  onError?: (error: Error, errorInfo: React.ErrorInfo) => void;\n\n  /** Custom fallback element */\n  fallback?: ReactNode;\n}\n\nexport interface ErrorBoundaryState {\n  error?: Error;\n}\n\n/**\n * Error boundary for catching render errors in React. Displays an error message if an error is caught by default, or you can specify a fallback component to render.\n * https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary\n */\nexport class ErrorBoundary extends Component<\n  ErrorBoundaryProps,\n  ErrorBoundaryState\n> {\n  static getDerivedStateFromError(error: Error): ErrorBoundaryState {\n    return { error };\n  }\n\n  constructor(props: ErrorBoundaryProps) {\n    super(props);\n    this.state = { error: undefined };\n  }\n\n  componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n    const { onError } = this.props;\n    log.error('Error caught by ErrorBoundary', error, errorInfo);\n    onError?.(error, errorInfo);\n  }\n\n  render(): ReactNode {\n    const { children, className, fallback } = this.props;\n    const { error } = this.state;\n    if (error != null) {\n      if (fallback != null) {\n        return fallback;\n      }\n\n      return (\n        <div className={className}>\n          <LoadingOverlay\n            errorMessage={`${error}`}\n            isLoading={false}\n            isLoaded={false}\n          />\n        </div>\n      );\n    }\n\n    // We need to check for undefined children because React will throw an error if we return undefined from a render method\n    // Note this behaviour was changed in React 18: https://github.com/reactwg/react-18/discussions/75\n    return children ?? null;\n  }\n}\n\nexport default ErrorBoundary;\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,gBAAgB;AAChC,OAAOC,KAAK,IAAIC,SAAS,QAAwB,OAAO;AAAC,OAClDC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAErB,IAAMC,GAAG,GAAGN,GAAG,CAACO,MAAM,CAAC,eAAe,CAAC;AAoBvC;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,SAASN,SAAS,CAG1C;EACA,OAAOO,wBAAwBA,CAACC,KAAY,EAAsB;IAChE,OAAO;MAAEA;IAAM,CAAC;EAClB;EAEAC,WAAWA,CAACC,KAAyB,EAAE;IACrC,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MAAEH,KAAK,EAAEI;IAAU,CAAC;EACnC;EAEAC,iBAAiBA,CAACL,KAAY,EAAEM,SAA0B,EAAQ;IAChE,IAAM;MAAEC;IAAQ,CAAC,GAAG,IAAI,CAACL,KAAK;IAC9BN,GAAG,CAACI,KAAK,CAAC,+BAA+B,EAAEA,KAAK,EAAEM,SAAS,CAAC;IAC5DC,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAGP,KAAK,EAAEM,SAAS,CAAC;EAC7B;EAEAE,MAAMA,CAAA,EAAc;IAClB,IAAM;MAAEC,QAAQ;MAAEC,SAAS;MAAEC;IAAS,CAAC,GAAG,IAAI,CAACT,KAAK;IACpD,IAAM;MAAEF;IAAM,CAAC,GAAG,IAAI,CAACG,KAAK;IAC5B,IAAIH,KAAK,IAAI,IAAI,EAAE;MACjB,IAAIW,QAAQ,IAAI,IAAI,EAAE;QACpB,OAAOA,QAAQ;MACjB;MAEA,oBACEhB,IAAA;QAAKe,SAAS,EAAEA,SAAU;QAAAD,QAAA,eACxBd,IAAA,CAACF,cAAc;UACbmB,YAAY,KAAAC,MAAA,CAAKb,KAAK,CAAG;UACzBc,SAAS,EAAE,KAAM;UACjBC,QAAQ,EAAE;QAAM,CACjB;MAAC,CACC,CAAC;IAEV;;IAEA;IACA;IACA,OAAON,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAI,IAAI;EACzB;AACF;AAEA,eAAeX,aAAa"}