@deephaven/components 0.13.9-uuid-filter.2 → 0.13.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,8 +1,8 @@
1
1
  import React from 'react';
2
- interface EditableItemListProps {
2
+ export interface EditableItemListProps {
3
3
  isInvalid?: boolean;
4
4
  items: string[];
5
- onDelete: (item: string) => void;
5
+ onDelete: (items: string[]) => void;
6
6
  onAdd: (item: string) => void;
7
7
  validate?: (item: string) => Error | null;
8
8
  }
@@ -1 +1 @@
1
- {"version":3,"file":"EditableItemList.d.ts","sourceRoot":"","sources":["../src/EditableItemList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAOf,UAAU,qBAAqB;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,KAAK,GAAG,IAAI,CAAC;CAC3C;AAGD,QAAA,MAAM,gBAAgB,UAAW,qBAAqB,KAAG,MAAM,YA+H9D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1
+ {"version":3,"file":"EditableItemList.d.ts","sourceRoot":"","sources":["../src/EditableItemList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,KAAK,GAAG,IAAI,CAAC;CAC3C;AAGD,QAAA,MAAM,gBAAgB,UAAW,qBAAqB,KAAG,MAAM,YAmH9D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
@@ -2,6 +2,7 @@ import React, { useCallback, useMemo, useState } from 'react';
2
2
  import classNames from 'classnames';
3
3
  import clamp from 'lodash.clamp';
4
4
  import { vsAdd, vsTrash } from '@deephaven/icons';
5
+ import { RangeUtils } from '@deephaven/utils';
5
6
  import { Button, ItemList } from "./index.js";
6
7
 
7
8
  // Display a list of items with an input for adding new items, and Add/Delete buttons
@@ -14,20 +15,15 @@ var EditableItemList = props => {
14
15
  validate = () => null
15
16
  } = props;
16
17
  var [inputError, setInputError] = useState(null);
17
- var [selectedIndex, setSelectedIndex] = useState();
18
+ var [selectedRanges, setSelectedRanges] = useState([]);
18
19
  var [value, setValue] = useState('');
19
- var handleSelect = useCallback(index => {
20
- setSelectedIndex(index);
20
+ var handleSelectionChange = useCallback(ranges => {
21
+ setSelectedRanges(ranges);
21
22
  }, []);
22
23
  var handleDelete = useCallback(() => {
23
- var newIndex = selectedIndex === items.length - 1 ? items.length - 2 : selectedIndex;
24
-
25
- if (selectedIndex !== undefined && selectedIndex >= 0 && selectedIndex < items.length) {
26
- onDelete(items[selectedIndex]);
27
- }
28
-
29
- setSelectedIndex(newIndex === -1 ? undefined : newIndex);
30
- }, [items, selectedIndex, onDelete]);
24
+ onDelete(RangeUtils.getItemsInRanges(items, selectedRanges));
25
+ setSelectedRanges([]);
26
+ }, [items, selectedRanges, onDelete]);
31
27
  var handleAdd = useCallback(() => {
32
28
  if (value === '') {
33
29
  return;
@@ -50,14 +46,13 @@ var EditableItemList = props => {
50
46
  setInputError(inputValue === '' ? null : validate(inputValue));
51
47
  }, [validate]);
52
48
  var handleInputFocus = useCallback(() => {
53
- setSelectedIndex(undefined);
49
+ setSelectedRanges([]);
54
50
  }, []);
55
51
  var handleInputKeyDown = useCallback(event => {
56
52
  if (event.key === 'Enter') {
57
53
  handleAdd();
58
54
  }
59
55
  }, [handleAdd]);
60
- var selectedRanges = useMemo(() => selectedIndex === undefined ? [] : [[selectedIndex, selectedIndex]], [selectedIndex]);
61
56
  var containerHeight = useMemo(() => 14 + clamp(items.length, 1, 6) * ItemList.DEFAULT_ROW_HEIGHT, [items.length]);
62
57
  return /*#__PURE__*/React.createElement("div", {
63
58
  className: classNames('editable-item-list-container', {
@@ -71,11 +66,12 @@ var EditableItemList = props => {
71
66
  itemCount: items.length,
72
67
  items: items.map((item, index) => ({
73
68
  value: item,
74
- isSelected: index === selectedIndex
69
+ isSelected: RangeUtils.isSelected(selectedRanges, index)
75
70
  })),
76
71
  offset: 0,
77
- onSelect: handleSelect,
78
- selectedRanges: selectedRanges
72
+ selectedRanges: selectedRanges,
73
+ onSelectionChange: handleSelectionChange,
74
+ isMultiSelect: true
79
75
  })), /*#__PURE__*/React.createElement("div", {
80
76
  className: "d-flex flex-row pt-2"
81
77
  }, /*#__PURE__*/React.createElement("div", {
@@ -102,9 +98,9 @@ var EditableItemList = props => {
102
98
  }), /*#__PURE__*/React.createElement(Button, {
103
99
  kind: "ghost",
104
100
  onClick: handleDelete,
105
- disabled: selectedIndex === undefined,
101
+ disabled: selectedRanges.length === 0,
106
102
  icon: vsTrash,
107
- tooltip: "Delete selected item",
103
+ tooltip: "Delete selected items",
108
104
  "data-testid": "delete-item-button"
109
105
  }))));
110
106
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/EditableItemList.tsx"],"names":["React","useCallback","useMemo","useState","classNames","clamp","vsAdd","vsTrash","Button","ItemList","EditableItemList","props","isInvalid","items","onAdd","undefined","onDelete","validate","inputError","setInputError","selectedIndex","setSelectedIndex","value","setValue","handleSelect","index","handleDelete","newIndex","length","handleAdd","validationError","handleInputChange","event","inputValue","target","handleInputFocus","handleInputKeyDown","key","selectedRanges","containerHeight","DEFAULT_ROW_HEIGHT","height","map","item","isSelected"],"mappings":"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","sourcesContent":["import React, {\n ChangeEvent,\n 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 { Range } from '@deephaven/utils';\nimport { Button, ItemList } from '.';\n\ninterface EditableItemListProps {\n isInvalid?: boolean;\n items: string[];\n onDelete: (item: 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\nconst 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 [selectedIndex, setSelectedIndex] = useState<number | undefined>();\n const [value, setValue] = useState('');\n\n const handleSelect = useCallback(index => {\n setSelectedIndex(index);\n }, []);\n\n const handleDelete = useCallback(() => {\n const newIndex =\n selectedIndex === items.length - 1 ? items.length - 2 : selectedIndex;\n if (\n selectedIndex !== undefined &&\n selectedIndex >= 0 &&\n selectedIndex < items.length\n ) {\n onDelete(items[selectedIndex]);\n }\n setSelectedIndex(newIndex === -1 ? undefined : newIndex);\n }, [items, selectedIndex, 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 setSelectedIndex(undefined);\n }, []);\n\n const handleInputKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Enter') {\n handleAdd();\n }\n },\n [handleAdd]\n );\n\n const selectedRanges = useMemo(\n (): Range[] =>\n selectedIndex === undefined ? [] : [[selectedIndex, selectedIndex]],\n [selectedIndex]\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: index === selectedIndex,\n }))}\n offset={0}\n onSelect={handleSelect}\n selectedRanges={selectedRanges}\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={selectedIndex === undefined}\n icon={vsTrash}\n tooltip=\"Delete selected item\"\n data-testid=\"delete-item-button\"\n />\n </div>\n </div>\n </div>\n );\n};\n\nexport default EditableItemList;\n"],"file":"EditableItemList.js"}
1
+ {"version":3,"sources":["../src/EditableItemList.tsx"],"names":["React","useCallback","useMemo","useState","classNames","clamp","vsAdd","vsTrash","RangeUtils","Button","ItemList","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","height","map","item","index","isSelected"],"mappings":"AAAA,OAAOA,KAAP,IAGEC,WAHF,EAIEC,OAJF,EAKEC,QALF,QAMO,OANP;AAOA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,cAAlB;AACA,SAASC,KAAT,EAAgBC,OAAhB,QAA+B,kBAA/B;AACA,SAAgBC,UAAhB,QAAkC,kBAAlC;SACSC,M,EAAQC,Q;;AAUjB;AACA,IAAMC,gBAAgB,GAAIC,KAAD,IAAsD;AAC7E,MAAM;AACJC,IAAAA,SAAS,GAAG,KADR;AAEJC,IAAAA,KAFI;AAGJC,IAAAA,KAAK,GAAG,MAAMC,SAHV;AAIJC,IAAAA,QAAQ,GAAG,MAAMD,SAJb;AAKJE,IAAAA,QAAQ,GAAG,MAAM;AALb,MAMFN,KANJ;AAOA,MAAM,CAACO,UAAD,EAAaC,aAAb,IAA8BjB,QAAQ,CAAe,IAAf,CAA5C;AACA,MAAM,CAACkB,cAAD,EAAiBC,iBAAjB,IAAsCnB,QAAQ,CAAU,EAAV,CAApD;AACA,MAAM,CAACoB,KAAD,EAAQC,QAAR,IAAoBrB,QAAQ,CAAC,EAAD,CAAlC;AAEA,MAAMsB,qBAAqB,GAAGxB,WAAW,CAAEyB,MAAD,IAAqB;AAC7DJ,IAAAA,iBAAiB,CAACI,MAAD,CAAjB;AACD,GAFwC,EAEtC,EAFsC,CAAzC;AAIA,MAAMC,YAAY,GAAG1B,WAAW,CAAC,MAAM;AACrCgB,IAAAA,QAAQ,CAACT,UAAU,CAACoB,gBAAX,CAA4Bd,KAA5B,EAAmCO,cAAnC,CAAD,CAAR;AACAC,IAAAA,iBAAiB,CAAC,EAAD,CAAjB;AACD,GAH+B,EAG7B,CAACR,KAAD,EAAQO,cAAR,EAAwBJ,QAAxB,CAH6B,CAAhC;AAKA,MAAMY,SAAS,GAAG5B,WAAW,CAAC,MAAM;AAClC,QAAIsB,KAAK,KAAK,EAAd,EAAkB;AAChB;AACD;;AACD,QAAMO,eAAe,GAAGZ,QAAQ,CAACK,KAAD,CAAhC;;AACA,QAAIO,eAAe,IAAI,IAAvB,EAA6B;AAC3Bf,MAAAA,KAAK,CAACQ,KAAD,CAAL;AACAC,MAAAA,QAAQ,CAAC,EAAD,CAAR;AACD,KAHD,MAGO;AACLJ,MAAAA,aAAa,CAACU,eAAD,CAAb;AACD;AACF,GAX4B,EAW1B,CAACP,KAAD,EAAQR,KAAR,EAAeG,QAAf,CAX0B,CAA7B;AAaA,MAAMa,iBAAiB,GAAG9B,WAAW,CAClC+B,KAAD,IAA0C;AACxC,QAAM;AAAET,MAAAA,KAAK,EAAEU;AAAT,QAAwBD,KAAK,CAACE,MAApC;AACAV,IAAAA,QAAQ,CAACS,UAAD,CAAR;AACAb,IAAAA,aAAa,CAACa,UAAU,KAAK,EAAf,GAAoB,IAApB,GAA2Bf,QAAQ,CAACe,UAAD,CAApC,CAAb;AACD,GALkC,EAMnC,CAACf,QAAD,CANmC,CAArC;AASA,MAAMiB,gBAAgB,GAAGlC,WAAW,CAAC,MAAM;AACzCqB,IAAAA,iBAAiB,CAAC,EAAD,CAAjB;AACD,GAFmC,EAEjC,EAFiC,CAApC;AAIA,MAAMc,kBAAkB,GAAGnC,WAAW,CACnC+B,KAAD,IAA0B;AACxB,QAAIA,KAAK,CAACK,GAAN,KAAc,OAAlB,EAA2B;AACzBR,MAAAA,SAAS;AACV;AACF,GALmC,EAMpC,CAACA,SAAD,CANoC,CAAtC;AASA,MAAMS,eAAe,GAAGpC,OAAO,CAC7B,MAAc,KAAKG,KAAK,CAACS,KAAK,CAACyB,MAAP,EAAe,CAAf,EAAkB,CAAlB,CAAL,GAA4B7B,QAAQ,CAAC8B,kBAD3B,EAE7B,CAAC1B,KAAK,CAACyB,MAAP,CAF6B,CAA/B;AAKA,sBACE;AACE,IAAA,SAAS,EAAEnC,UAAU,CAAC,8BAAD,EAAiC;AACpD,oBAAcS;AADsC,KAAjC;AADvB,kBAKE;AAAK,IAAA,KAAK,EAAE;AAAE4B,MAAAA,MAAM,EAAEH;AAAV;AAAZ,kBACE,oBAAC,QAAD;AACE,IAAA,SAAS,EAAExB,KAAK,CAACyB,MADnB;AAEE,IAAA,KAAK,EAAEzB,KAAK,CAAC4B,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,MAAkB;AACjCrB,MAAAA,KAAK,EAAEoB,IAD0B;AAEjCE,MAAAA,UAAU,EAAErC,UAAU,CAACqC,UAAX,CAAsBxB,cAAtB,EAAsCuB,KAAtC;AAFqB,KAAlB,CAAV,CAFT;AAME,IAAA,MAAM,EAAE,CANV;AAOE,IAAA,cAAc,EAAEvB,cAPlB;AAQE,IAAA,iBAAiB,EAAEI,qBARrB;AASE,IAAA,aAAa;AATf,IADF,CALF,eAkBE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AACE,IAAA,SAAS,EAAErB,UAAU,CAAC,cAAD,EAAiB;AACpC,oBAAce,UAAU,IAAI;AADQ,KAAjB,CADvB;AAIE,IAAA,WAAW,EAAC,aAJd;AAKE,IAAA,IAAI,EAAC,MALP;AAME,IAAA,KAAK,EAAEI,KANT;AAOE,IAAA,QAAQ,EAAEQ,iBAPZ;AAQE,IAAA,OAAO,EAAEI,gBARX;AASE,IAAA,SAAS,EAAEC;AATb,IADF,CADF,eAcE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE,oBAAC,MAAD;AACE,IAAA,IAAI,EAAC,OADP;AAEE,IAAA,OAAO,EAAEP,SAFX;AAGE,IAAA,QAAQ,EAAEV,UAAU,IAAI,IAAd,IAAsBI,KAAK,KAAK,EAH5C;AAIE,IAAA,IAAI,EAAEjB,KAJR;AAKE,IAAA,OAAO,EAAC,cALV;AAME,mBAAY;AANd,IADF,eASE,oBAAC,MAAD;AACE,IAAA,IAAI,EAAC,OADP;AAEE,IAAA,OAAO,EAAEqB,YAFX;AAGE,IAAA,QAAQ,EAAEN,cAAc,CAACkB,MAAf,KAA0B,CAHtC;AAIE,IAAA,IAAI,EAAEhC,OAJR;AAKE,IAAA,OAAO,EAAC,uBALV;AAME,mBAAY;AANd,IATF,CAdF,CAlBF,CADF;AAsDD,CAnHD;;AAqHA,eAAeI,gBAAf","sourcesContent":["import React, {\n ChangeEvent,\n 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 { Range, RangeUtils } from '@deephaven/utils';\nimport { Button, ItemList } from '.';\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\nconst 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<Range[]>([]);\n const [value, setValue] = useState('');\n\n const handleSelectionChange = useCallback((ranges: 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"],"file":"EditableItemList.js"}
@@ -170,7 +170,7 @@ class ItemListItem extends Component {
170
170
  onMouseUp: this.handleMouseUp,
171
171
  tabIndex: -1,
172
172
  ref: this.itemRef,
173
- role: "presentation",
173
+ role: "listitem",
174
174
  style: style,
175
175
  onFocus: this.handleFocus,
176
176
  onBlur: this.handleBlur,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/ItemListItem.tsx"],"names":["React","Component","classNames","Log","log","module","ItemListItem","handleKeyDown","constructor","props","handleBlur","bind","handleFocus","handleClick","handleContextMenu","handleDragStart","handleDrag","handleDragOver","handleDragEnd","handleDrop","handleDoubleClick","handleMouseDown","handleMouseMove","handleMouseUp","itemRef","createRef","e","itemIndex","onBlur","onFocus","onClick","onContextMenu","onDragStart","onDrag","preventDefault","onDragOver","onDragEnd","onDrop","onDoubleClick","onMouseMove","onMouseDown","onMouseUp","render","isDraggable","isFocused","isSelected","style","children","dataTestId","active","disableSelect","undefined"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport classNames from 'classnames';\nimport './ItemListItem.scss';\nimport Log from '@deephaven/log';\n\nconst log = Log.module('ItemListItem');\n\ninterface ItemListItemProps {\n isDraggable: boolean;\n isFocused: boolean;\n isSelected: boolean;\n itemIndex: number;\n disableSelect: boolean;\n onBlur(index: number, e: React.FocusEvent<HTMLDivElement>): void;\n onClick(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onContextMenu(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onDragStart(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDrag(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDragOver(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDragEnd(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDrop(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDoubleClick(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onFocus(index: number, e: React.FocusEvent<HTMLDivElement>): void;\n onMouseDown(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onMouseMove(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onMouseUp(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n style: React.CSSProperties;\n children: React.ReactNode;\n 'data-testid'?: string;\n}\n\nclass ItemListItem extends Component<ItemListItemProps, Record<string, never>> {\n static defaultProps = {\n children: null,\n isDraggable: false,\n isFocused: false,\n isSelected: false,\n itemIndex: 0,\n disableSelect: false,\n 'data-testid': undefined,\n\n onBlur(): void {\n // no-op\n },\n onClick(): void {\n // no-op\n },\n onContextMenu(): void {\n // no-op\n },\n onDragStart(): void {\n // no-op\n },\n onDrag(): void {\n // no-op\n },\n onDragOver(): void {\n // no-op\n },\n onDragEnd(): void {\n // no-op\n },\n onDrop(): void {\n // no-op\n },\n onDoubleClick(): void {\n // no-op\n },\n onFocus(): void {\n // no-op\n },\n onMouseDown(): void {\n // no-op\n },\n onMouseMove(): void {\n // no-op\n },\n onMouseUp(): void {\n // no-op\n },\n style: {},\n };\n\n static handleKeyDown(): boolean {\n log.log('ItemListItem.handleKeyDown false');\n return false;\n }\n\n constructor(props: ItemListItemProps) {\n super(props);\n\n this.handleBlur = this.handleBlur.bind(this);\n this.handleFocus = this.handleFocus.bind(this);\n this.handleClick = this.handleClick.bind(this);\n this.handleContextMenu = this.handleContextMenu.bind(this);\n this.handleDragStart = this.handleDragStart.bind(this);\n this.handleDrag = this.handleDrag.bind(this);\n this.handleDragOver = this.handleDragOver.bind(this);\n this.handleDragEnd = this.handleDragEnd.bind(this);\n this.handleDrop = this.handleDrop.bind(this);\n this.handleDoubleClick = this.handleDoubleClick.bind(this);\n this.handleMouseDown = this.handleMouseDown.bind(this);\n this.handleMouseMove = this.handleMouseMove.bind(this);\n this.handleMouseUp = this.handleMouseUp.bind(this);\n\n this.itemRef = React.createRef();\n }\n\n itemRef: React.RefObject<HTMLDivElement>;\n\n handleBlur(e: React.FocusEvent<HTMLDivElement>): void {\n const { itemIndex, onBlur } = this.props;\n onBlur(itemIndex, e);\n }\n\n handleFocus(e: React.FocusEvent<HTMLDivElement>): void {\n const { itemIndex, onFocus } = this.props;\n onFocus(itemIndex, e);\n }\n\n handleClick(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onClick } = this.props;\n onClick(itemIndex, e);\n }\n\n handleContextMenu(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onContextMenu } = this.props;\n onContextMenu(itemIndex, e);\n }\n\n handleDragStart(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDragStart } = this.props;\n onDragStart(itemIndex, e);\n }\n\n handleDrag(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDrag } = this.props;\n onDrag(itemIndex, e);\n }\n\n handleDragOver(e: React.DragEvent<HTMLDivElement>): void {\n // Have to call preventDefault otherwise onDrop won't get triggered\n e.preventDefault();\n const { itemIndex, onDragOver } = this.props;\n onDragOver(itemIndex, e);\n }\n\n handleDragEnd(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDragEnd } = this.props;\n onDragEnd(itemIndex, e);\n }\n\n handleDrop(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDrop } = this.props;\n onDrop(itemIndex, e);\n }\n\n handleDoubleClick(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onDoubleClick } = this.props;\n onDoubleClick(itemIndex, e);\n }\n\n handleMouseMove(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onMouseMove } = this.props;\n onMouseMove(itemIndex, e);\n }\n\n handleMouseDown(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onMouseDown } = this.props;\n onMouseDown(itemIndex, e);\n }\n\n handleMouseUp(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onMouseUp } = this.props;\n onMouseUp(itemIndex, e);\n }\n\n render(): JSX.Element {\n const {\n isDraggable,\n isFocused,\n isSelected,\n style,\n children,\n 'data-testid': dataTestId,\n } = this.props;\n return (\n <div\n className={classNames(\n 'item-list-item',\n { active: isSelected },\n { 'is-focused': isFocused },\n { 'is-draggable': isDraggable }\n )}\n onKeyDown={ItemListItem.handleKeyDown}\n onContextMenu={this.handleContextMenu}\n onClick={this.handleClick}\n onDrag={this.handleDrag}\n onDragStart={this.handleDragStart}\n onDragOver={this.handleDragOver}\n onDragEnd={this.handleDragEnd}\n onDrop={this.handleDrop}\n onDoubleClick={this.handleDoubleClick}\n onMouseDown={this.handleMouseDown}\n onMouseMove={this.handleMouseMove}\n onMouseUp={this.handleMouseUp}\n tabIndex={-1}\n ref={this.itemRef}\n role=\"presentation\"\n style={style}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n draggable={isDraggable}\n data-testid={dataTestId}\n >\n {children}\n </div>\n );\n }\n}\n\nexport default ItemListItem;\n"],"file":"ItemListItem.js"}
1
+ {"version":3,"sources":["../src/ItemListItem.tsx"],"names":["React","Component","classNames","Log","log","module","ItemListItem","handleKeyDown","constructor","props","handleBlur","bind","handleFocus","handleClick","handleContextMenu","handleDragStart","handleDrag","handleDragOver","handleDragEnd","handleDrop","handleDoubleClick","handleMouseDown","handleMouseMove","handleMouseUp","itemRef","createRef","e","itemIndex","onBlur","onFocus","onClick","onContextMenu","onDragStart","onDrag","preventDefault","onDragOver","onDragEnd","onDrop","onDoubleClick","onMouseMove","onMouseDown","onMouseUp","render","isDraggable","isFocused","isSelected","style","children","dataTestId","active","disableSelect","undefined"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport classNames from 'classnames';\nimport './ItemListItem.scss';\nimport Log from '@deephaven/log';\n\nconst log = Log.module('ItemListItem');\n\ninterface ItemListItemProps {\n isDraggable: boolean;\n isFocused: boolean;\n isSelected: boolean;\n itemIndex: number;\n disableSelect: boolean;\n onBlur(index: number, e: React.FocusEvent<HTMLDivElement>): void;\n onClick(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onContextMenu(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onDragStart(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDrag(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDragOver(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDragEnd(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDrop(index: number, e: React.DragEvent<HTMLDivElement>): void;\n onDoubleClick(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onFocus(index: number, e: React.FocusEvent<HTMLDivElement>): void;\n onMouseDown(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onMouseMove(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n onMouseUp(index: number, e: React.MouseEvent<HTMLDivElement>): void;\n style: React.CSSProperties;\n children: React.ReactNode;\n 'data-testid'?: string;\n}\n\nclass ItemListItem extends Component<ItemListItemProps, Record<string, never>> {\n static defaultProps = {\n children: null,\n isDraggable: false,\n isFocused: false,\n isSelected: false,\n itemIndex: 0,\n disableSelect: false,\n 'data-testid': undefined,\n\n onBlur(): void {\n // no-op\n },\n onClick(): void {\n // no-op\n },\n onContextMenu(): void {\n // no-op\n },\n onDragStart(): void {\n // no-op\n },\n onDrag(): void {\n // no-op\n },\n onDragOver(): void {\n // no-op\n },\n onDragEnd(): void {\n // no-op\n },\n onDrop(): void {\n // no-op\n },\n onDoubleClick(): void {\n // no-op\n },\n onFocus(): void {\n // no-op\n },\n onMouseDown(): void {\n // no-op\n },\n onMouseMove(): void {\n // no-op\n },\n onMouseUp(): void {\n // no-op\n },\n style: {},\n };\n\n static handleKeyDown(): boolean {\n log.log('ItemListItem.handleKeyDown false');\n return false;\n }\n\n constructor(props: ItemListItemProps) {\n super(props);\n\n this.handleBlur = this.handleBlur.bind(this);\n this.handleFocus = this.handleFocus.bind(this);\n this.handleClick = this.handleClick.bind(this);\n this.handleContextMenu = this.handleContextMenu.bind(this);\n this.handleDragStart = this.handleDragStart.bind(this);\n this.handleDrag = this.handleDrag.bind(this);\n this.handleDragOver = this.handleDragOver.bind(this);\n this.handleDragEnd = this.handleDragEnd.bind(this);\n this.handleDrop = this.handleDrop.bind(this);\n this.handleDoubleClick = this.handleDoubleClick.bind(this);\n this.handleMouseDown = this.handleMouseDown.bind(this);\n this.handleMouseMove = this.handleMouseMove.bind(this);\n this.handleMouseUp = this.handleMouseUp.bind(this);\n\n this.itemRef = React.createRef();\n }\n\n itemRef: React.RefObject<HTMLDivElement>;\n\n handleBlur(e: React.FocusEvent<HTMLDivElement>): void {\n const { itemIndex, onBlur } = this.props;\n onBlur(itemIndex, e);\n }\n\n handleFocus(e: React.FocusEvent<HTMLDivElement>): void {\n const { itemIndex, onFocus } = this.props;\n onFocus(itemIndex, e);\n }\n\n handleClick(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onClick } = this.props;\n onClick(itemIndex, e);\n }\n\n handleContextMenu(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onContextMenu } = this.props;\n onContextMenu(itemIndex, e);\n }\n\n handleDragStart(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDragStart } = this.props;\n onDragStart(itemIndex, e);\n }\n\n handleDrag(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDrag } = this.props;\n onDrag(itemIndex, e);\n }\n\n handleDragOver(e: React.DragEvent<HTMLDivElement>): void {\n // Have to call preventDefault otherwise onDrop won't get triggered\n e.preventDefault();\n const { itemIndex, onDragOver } = this.props;\n onDragOver(itemIndex, e);\n }\n\n handleDragEnd(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDragEnd } = this.props;\n onDragEnd(itemIndex, e);\n }\n\n handleDrop(e: React.DragEvent<HTMLDivElement>): void {\n const { itemIndex, onDrop } = this.props;\n onDrop(itemIndex, e);\n }\n\n handleDoubleClick(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onDoubleClick } = this.props;\n onDoubleClick(itemIndex, e);\n }\n\n handleMouseMove(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onMouseMove } = this.props;\n onMouseMove(itemIndex, e);\n }\n\n handleMouseDown(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onMouseDown } = this.props;\n onMouseDown(itemIndex, e);\n }\n\n handleMouseUp(e: React.MouseEvent<HTMLDivElement>): void {\n const { itemIndex, onMouseUp } = this.props;\n onMouseUp(itemIndex, e);\n }\n\n render(): JSX.Element {\n const {\n isDraggable,\n isFocused,\n isSelected,\n style,\n children,\n 'data-testid': dataTestId,\n } = this.props;\n return (\n <div\n className={classNames(\n 'item-list-item',\n { active: isSelected },\n { 'is-focused': isFocused },\n { 'is-draggable': isDraggable }\n )}\n onKeyDown={ItemListItem.handleKeyDown}\n onContextMenu={this.handleContextMenu}\n onClick={this.handleClick}\n onDrag={this.handleDrag}\n onDragStart={this.handleDragStart}\n onDragOver={this.handleDragOver}\n onDragEnd={this.handleDragEnd}\n onDrop={this.handleDrop}\n onDoubleClick={this.handleDoubleClick}\n onMouseDown={this.handleMouseDown}\n onMouseMove={this.handleMouseMove}\n onMouseUp={this.handleMouseUp}\n tabIndex={-1}\n ref={this.itemRef}\n role=\"listitem\"\n style={style}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n draggable={isDraggable}\n data-testid={dataTestId}\n >\n {children}\n </div>\n );\n }\n}\n\nexport default ItemListItem;\n"],"file":"ItemListItem.js"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deephaven/components",
3
- "version": "0.13.9-uuid-filter.2+26442b8",
3
+ "version": "0.13.12",
4
4
  "description": "Deephaven React component library",
5
5
  "author": "Deephaven Data Labs LLC",
6
6
  "license": "Apache-2.0",
@@ -30,10 +30,10 @@
30
30
  "start": "cross-env NODE_ENV=development npm run watch"
31
31
  },
32
32
  "dependencies": {
33
- "@deephaven/icons": "^0.13.9-uuid-filter.2+26442b8",
34
- "@deephaven/log": "^0.13.9-uuid-filter.2+26442b8",
35
- "@deephaven/react-hooks": "^0.13.9-uuid-filter.2+26442b8",
36
- "@deephaven/utils": "^0.13.9-uuid-filter.2+26442b8",
33
+ "@deephaven/icons": "^0.13.12",
34
+ "@deephaven/log": "^0.13.12",
35
+ "@deephaven/react-hooks": "^0.13.12",
36
+ "@deephaven/utils": "^0.13.12",
37
37
  "@fortawesome/fontawesome-svg-core": "1.2.36",
38
38
  "@fortawesome/react-fontawesome": "^0.1.15",
39
39
  "bootstrap": "4.6.1",
@@ -58,8 +58,8 @@
58
58
  "react-dom": "^17.x"
59
59
  },
60
60
  "devDependencies": {
61
- "@deephaven/mocks": "^0.13.9-uuid-filter.2+26442b8",
62
- "@deephaven/tsconfig": "^0.13.9-uuid-filter.2+26442b8"
61
+ "@deephaven/mocks": "^0.13.12",
62
+ "@deephaven/tsconfig": "^0.13.12"
63
63
  },
64
64
  "files": [
65
65
  "dist",
@@ -71,5 +71,5 @@
71
71
  "publishConfig": {
72
72
  "access": "public"
73
73
  },
74
- "gitHead": "26442b88756cfe4f515a98e51697a7f006e65e1f"
74
+ "gitHead": "62c1f67dd27a8c15f103a3942ff14c0ad94a2eec"
75
75
  }