@deephaven/iris-grid 0.27.0 → 0.27.1-beta.3

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.
package/dist/IrisGrid.js CHANGED
@@ -19,6 +19,7 @@ import { dhEye, dhFilterFilled, dhGraphLineUp, dhTriangleDownSquare, vsClose, vs
19
19
  import dh from '@deephaven/jsapi-shim';
20
20
  import { DateUtils, Formatter, FormatterUtils, TableUtils } from '@deephaven/jsapi-utils';
21
21
  import { assertNotNull, copyToClipboard, Pending, PromiseUtils, ValidationError } from '@deephaven/utils';
22
+ import { Type as FilterType } from '@deephaven/filters';
22
23
  import throttle from 'lodash.throttle';
23
24
  import debounce from 'lodash.debounce';
24
25
  import clamp from 'lodash.clamp';
@@ -52,6 +53,7 @@ import GotoRow from "./GotoRow.js";
52
53
  var log = Log.module('IrisGrid');
53
54
  var UPDATE_DOWNLOAD_THROTTLE = 500;
54
55
  var SET_FILTER_DEBOUNCE = 250;
56
+ var SEEK_ROW_DEBOUNCE = 250;
55
57
  var SET_CONDITIONAL_FORMAT_DEBOUNCE = 250;
56
58
  var DEFAULT_AGGREGATION_SETTINGS = Object.freeze({
57
59
  aggregations: [],
@@ -370,6 +372,15 @@ export class IrisGrid extends Component {
370
372
  ref: this.handleTooltipRef
371
373
  }, "View full contents"));
372
374
  }));
375
+ _defineProperty(this, "handleGotoValueChanged", input => {
376
+ this.setState({
377
+ gotoValue: input
378
+ });
379
+ this.debouncedSeekRow(input);
380
+ });
381
+ _defineProperty(this, "debouncedSeekRow", debounce(input => {
382
+ this.seekRow(input);
383
+ }, SEEK_ROW_DEBOUNCE));
373
384
  this.handleAdvancedFilterChange = this.handleAdvancedFilterChange.bind(this);
374
385
  this.handleAdvancedFilterSortChange = this.handleAdvancedFilterSortChange.bind(this);
375
386
  this.handleAdvancedFilterDone = this.handleAdvancedFilterDone.bind(this);
@@ -430,6 +441,10 @@ export class IrisGrid extends Component {
430
441
  this.handleOverflowClose = this.handleOverflowClose.bind(this);
431
442
  this.getColumnBoundingRect = this.getColumnBoundingRect.bind(this);
432
443
  this.handleGotoRowSelectedRowNumberChanged = this.handleGotoRowSelectedRowNumberChanged.bind(this);
444
+ this.handleGotoValueSelectedColumnNameChanged = this.handleGotoValueSelectedColumnNameChanged.bind(this);
445
+ this.handleGotoValueSelectedFilterChanged = this.handleGotoValueSelectedFilterChanged.bind(this);
446
+ this.handleGotoValueChanged = this.handleGotoValueChanged.bind(this);
447
+ this.handleGotoValueSubmitted = this.handleGotoValueSubmitted.bind(this);
433
448
  this.grid = null;
434
449
  this.gridWrapper = null;
435
450
  this.lastLoadedConfig = null;
@@ -586,9 +601,13 @@ export class IrisGrid extends Component {
586
601
  showOverflowModal: false,
587
602
  overflowText: '',
588
603
  overflowButtonTooltipProps: null,
589
- isGotoRowShown: false,
604
+ isGotoShown: false,
590
605
  gotoRow: '',
591
606
  gotoRowError: '',
607
+ gotoValueError: '',
608
+ gotoValueSelectedColumnName: _model.columns[0].name,
609
+ gotoValueSelectedFilter: FilterType.eq,
610
+ gotoValue: '',
592
611
  columnHeaderGroups: columnHeaderGroups !== null && columnHeaderGroups !== void 0 ? columnHeaderGroups : _model.initialColumnHeaderGroups
593
612
  };
594
613
  }
@@ -1661,22 +1680,30 @@ export class IrisGrid extends Component {
1661
1680
  }
1662
1681
  toggleGotoRow() {
1663
1682
  var row = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
1683
+ var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
1684
+ var columnName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
1664
1685
  var {
1665
- isGotoRowShown
1686
+ isGotoShown
1666
1687
  } = this.state;
1667
- if (row) {
1688
+ if (row || value) {
1668
1689
  // if invoked with a row, keep open instead of toggle
1669
1690
  this.setState({
1670
- isGotoRowShown: true,
1691
+ isGotoShown: true,
1671
1692
  gotoRow: row,
1672
- gotoRowError: ''
1693
+ gotoValue: value,
1694
+ gotoValueSelectedColumnName: columnName,
1695
+ gotoRowError: '',
1696
+ gotoValueError: ''
1673
1697
  });
1698
+ this.focusRowInGrid(row);
1674
1699
  return;
1675
1700
  }
1676
1701
  this.setState({
1677
- isGotoRowShown: !isGotoRowShown,
1702
+ isGotoShown: !isGotoShown,
1678
1703
  gotoRow: '',
1679
- gotoRowError: ''
1704
+ gotoValue: '',
1705
+ gotoRowError: '',
1706
+ gotoValueError: ''
1680
1707
  });
1681
1708
  }
1682
1709
  commitPending() {
@@ -1838,12 +1865,12 @@ export class IrisGrid extends Component {
1838
1865
  }
1839
1866
  handleGotoRowOpened() {
1840
1867
  this.setState({
1841
- isGotoRowShown: true
1868
+ isGotoShown: true
1842
1869
  });
1843
1870
  }
1844
1871
  handleGotoRowClosed() {
1845
1872
  this.setState({
1846
- isGotoRowShown: false
1873
+ isGotoShown: false
1847
1874
  });
1848
1875
  }
1849
1876
  handleAdvancedMenuClosed(columnIndex) {
@@ -2382,6 +2409,86 @@ export class IrisGrid extends Component {
2382
2409
  log.error('Attempted to handleDownloadTable for user without download CSV permission.');
2383
2410
  }
2384
2411
  }
2412
+ seekRow(inputString) {
2413
+ var _arguments = arguments,
2414
+ _this5 = this;
2415
+ return _asyncToGenerator(function* () {
2416
+ var isBackwards = _arguments.length > 1 && _arguments[1] !== undefined ? _arguments[1] : false;
2417
+ var {
2418
+ gotoValueSelectedColumnName: selectedColumnName,
2419
+ gotoValueSelectedFilter
2420
+ } = _this5.state;
2421
+ var {
2422
+ model
2423
+ } = _this5.props;
2424
+ if (!model.isSeekRowAvailable) {
2425
+ return;
2426
+ }
2427
+ if (inputString === '') {
2428
+ return;
2429
+ }
2430
+ var columnIndex = model.getColumnIndexByName(selectedColumnName);
2431
+ if (columnIndex === undefined) {
2432
+ return;
2433
+ }
2434
+ var selectedColumn = model.columns[columnIndex];
2435
+ var searchFromRow;
2436
+ if (_this5.grid) {
2437
+ ({
2438
+ selectionEndRow: searchFromRow
2439
+ } = _this5.grid.state);
2440
+ }
2441
+ if (searchFromRow == null) {
2442
+ searchFromRow = 0;
2443
+ }
2444
+ var isContains = gotoValueSelectedFilter === FilterType.contains;
2445
+ var isEquals = gotoValueSelectedFilter === FilterType.eq || gotoValueSelectedFilter === FilterType.eqIgnoreCase;
2446
+ try {
2447
+ var _this5$grid;
2448
+ var columnDataType = TableUtils.getNormalizedType(selectedColumn.type);
2449
+ var rowIndex;
2450
+ switch (columnDataType) {
2451
+ case TableUtils.dataType.STRING:
2452
+ {
2453
+ rowIndex = yield model.seekRow(isBackwards === true ? searchFromRow - 1 : searchFromRow + 1, selectedColumn, dh.ValueType.STRING, inputString, isEquals, isContains, isBackwards !== null && isBackwards !== void 0 ? isBackwards : false);
2454
+ break;
2455
+ }
2456
+ case TableUtils.dataType.DATETIME:
2457
+ {
2458
+ var {
2459
+ formatter
2460
+ } = model;
2461
+ var [startDate] = DateUtils.parseDateRange(inputString, formatter.timeZone);
2462
+ rowIndex = yield model.seekRow(isBackwards === true ? searchFromRow - 1 : searchFromRow + 1, selectedColumn, dh.ValueType.DATETIME, startDate, undefined, undefined, isBackwards !== null && isBackwards !== void 0 ? isBackwards : false);
2463
+ break;
2464
+ }
2465
+ case TableUtils.dataType.DECIMAL:
2466
+ case TableUtils.dataType.INT:
2467
+ {
2468
+ if (!TableUtils.isBigDecimalType(selectedColumn.type) && !TableUtils.isBigIntegerType(selectedColumn.type)) {
2469
+ var inputValue = parseInt(inputString, 10);
2470
+ rowIndex = yield model.seekRow(searchFromRow, selectedColumn, dh.ValueType.NUMBER, inputValue, undefined, undefined, isBackwards !== null && isBackwards !== void 0 ? isBackwards : false);
2471
+ } else {
2472
+ rowIndex = yield model.seekRow(searchFromRow, selectedColumn, dh.ValueType.STRING, inputString, undefined, undefined, isBackwards !== null && isBackwards !== void 0 ? isBackwards : false);
2473
+ }
2474
+ break;
2475
+ }
2476
+ default:
2477
+ {
2478
+ rowIndex = yield model.seekRow(searchFromRow, selectedColumn, dh.ValueType.STRING, inputString, undefined, undefined, isBackwards !== null && isBackwards !== void 0 ? isBackwards : false);
2479
+ }
2480
+ }
2481
+ (_this5$grid = _this5.grid) === null || _this5$grid === void 0 ? void 0 : _this5$grid.setFocusRow(rowIndex);
2482
+ _this5.setState({
2483
+ gotoValueError: ''
2484
+ });
2485
+ } catch (e) {
2486
+ _this5.setState({
2487
+ gotoValueError: 'invalid input'
2488
+ });
2489
+ }
2490
+ })();
2491
+ }
2385
2492
  handleCancelDownloadTable() {
2386
2493
  var _this$tableSaver;
2387
2494
  (_this$tableSaver = this.tableSaver) === null || _this$tableSaver === void 0 ? void 0 : _this$tableSaver.cancelDownload();
@@ -2529,7 +2636,8 @@ export class IrisGrid extends Component {
2529
2636
  });
2530
2637
  if (rowNumber === '') {
2531
2638
  this.setState({
2532
- gotoRowError: ''
2639
+ gotoRowError: '',
2640
+ gotoValueError: ''
2533
2641
  });
2534
2642
  return;
2535
2643
  }
@@ -2541,20 +2649,23 @@ export class IrisGrid extends Component {
2541
2649
  } else if (rowInt === 0) {
2542
2650
  var _this$grid23;
2543
2651
  this.setState({
2544
- gotoRowError: ''
2652
+ gotoRowError: '',
2653
+ gotoValueError: ''
2545
2654
  });
2546
2655
  (_this$grid23 = this.grid) === null || _this$grid23 === void 0 ? void 0 : _this$grid23.setFocusRow(0);
2547
2656
  } else if (rowInt < 0) {
2548
2657
  var _this$grid24;
2549
2658
  this.setState({
2550
- gotoRowError: ''
2659
+ gotoRowError: '',
2660
+ gotoValueError: ''
2551
2661
  });
2552
2662
  (_this$grid24 = this.grid) === null || _this$grid24 === void 0 ? void 0 : _this$grid24.setFocusRow(rowInt + rowCount);
2553
2663
  } else {
2554
2664
  var _this$grid25;
2555
2665
  (_this$grid25 = this.grid) === null || _this$grid25 === void 0 ? void 0 : _this$grid25.setFocusRow(rowInt - 1);
2556
2666
  this.setState({
2557
- gotoRowError: ''
2667
+ gotoRowError: '',
2668
+ gotoValueError: ''
2558
2669
  });
2559
2670
  }
2560
2671
  }
@@ -2649,10 +2760,28 @@ export class IrisGrid extends Component {
2649
2760
  }
2650
2761
  })));
2651
2762
  }
2763
+ handleGotoValueSelectedColumnNameChanged(columnName) {
2764
+ this.setState({
2765
+ gotoValueSelectedColumnName: columnName,
2766
+ gotoValueError: ''
2767
+ });
2768
+ }
2769
+ handleGotoValueSelectedFilterChanged(value) {
2770
+ this.setState({
2771
+ gotoValueSelectedFilter: value,
2772
+ gotoValueError: ''
2773
+ });
2774
+ }
2775
+ handleGotoValueSubmitted(isBackwards) {
2776
+ var {
2777
+ gotoValue
2778
+ } = this.state;
2779
+ this.seekRow(gotoValue, isBackwards);
2780
+ }
2652
2781
  render() {
2653
2782
  var _rollupConfig$columns3,
2654
2783
  _rollupConfig$columns4,
2655
- _this5 = this,
2784
+ _this6 = this,
2656
2785
  _this$grid27,
2657
2786
  _this$grid27$state$dr,
2658
2787
  _openOptions;
@@ -2731,9 +2860,12 @@ export class IrisGrid extends Component {
2731
2860
  showOverflowModal,
2732
2861
  overflowText,
2733
2862
  overflowButtonTooltipProps,
2734
- isGotoRowShown,
2863
+ isGotoShown,
2735
2864
  gotoRow,
2736
- gotoRowError
2865
+ gotoRowError,
2866
+ gotoValueError,
2867
+ gotoValueSelectedColumnName,
2868
+ gotoValue
2737
2869
  } = this.state;
2738
2870
  if (!isReady) {
2739
2871
  return null;
@@ -2861,7 +2993,7 @@ export class IrisGrid extends Component {
2861
2993
  var columnIndex = visibleColumns[i];
2862
2994
  var columnX = _allColumnXs.get(columnIndex);
2863
2995
  var columnWidth = _allColumnWidths.get(columnIndex);
2864
- var modelColumn = _this5.getModelColumn(columnIndex);
2996
+ var modelColumn = _this6.getModelColumn(columnIndex);
2865
2997
  if (modelColumn != null) {
2866
2998
  var isFilterable = model.isFilterable(modelColumn);
2867
2999
  if (isFilterable && columnX != null && columnWidth != null && columnWidth > 0) {
@@ -2887,21 +3019,21 @@ export class IrisGrid extends Component {
2887
3019
  'filter-set': isFilterSet
2888
3020
  }),
2889
3021
  onClick: () => {
2890
- _this5.setState({
3022
+ _this6.setState({
2891
3023
  shownAdvancedFilter: columnIndex
2892
3024
  });
2893
3025
  },
2894
3026
  onContextMenu: event => {
2895
- var _this5$grid;
2896
- (_this5$grid = _this5.grid) === null || _this5$grid === void 0 ? void 0 : _this5$grid.handleContextMenu(event);
3027
+ var _this6$grid;
3028
+ (_this6$grid = _this6.grid) === null || _this6$grid === void 0 ? void 0 : _this6$grid.handleContextMenu(event);
2897
3029
  },
2898
3030
  onMouseEnter: () => {
2899
- _this5.setState({
3031
+ _this6.setState({
2900
3032
  hoverAdvancedFilter: columnIndex
2901
3033
  });
2902
3034
  },
2903
3035
  onMouseLeave: () => {
2904
- _this5.setState({
3036
+ _this6.setState({
2905
3037
  hoverAdvancedFilter: null
2906
3038
  });
2907
3039
  }
@@ -2951,7 +3083,7 @@ export class IrisGrid extends Component {
2951
3083
  width: columnWidth,
2952
3084
  height: columnHeaderHeight
2953
3085
  };
2954
- var _modelColumn = _this5.getModelColumn(columnIndex);
3086
+ var _modelColumn = _this6.getModelColumn(columnIndex);
2955
3087
  if (_modelColumn != null) {
2956
3088
  var _column3 = model.columns[_modelColumn];
2957
3089
  var _advancedFilter2 = advancedFilters.get(_modelColumn);
@@ -2966,9 +3098,9 @@ export class IrisGrid extends Component {
2966
3098
  style: _style2
2967
3099
  }, /*#__PURE__*/React.createElement(Popper, {
2968
3100
  className: "advanced-filter-menu-popper",
2969
- onEntered: _this5.getAdvancedMenuOpenedHandler(columnIndex),
3101
+ onEntered: _this6.getAdvancedMenuOpenedHandler(columnIndex),
2970
3102
  onExited: () => {
2971
- _this5.handleAdvancedMenuClosed(columnIndex);
3103
+ _this6.handleAdvancedMenuClosed(columnIndex);
2972
3104
  },
2973
3105
  isShown: shownAdvancedFilter === columnIndex,
2974
3106
  interactive: true,
@@ -2976,7 +3108,7 @@ export class IrisGrid extends Component {
2976
3108
  options: {
2977
3109
  positionFixed: true
2978
3110
  }
2979
- }, _this5.getCachedAdvancedFilterMenuActions(model, _column3, advancedFilterOptions, sortDirection, formatter)));
3111
+ }, _this6.getCachedAdvancedFilterMenuActions(model, _column3, advancedFilterOptions, sortDirection, formatter)));
2980
3112
  advancedFilterMenus.push(element);
2981
3113
  }
2982
3114
  }
@@ -2985,7 +3117,7 @@ export class IrisGrid extends Component {
2985
3117
  _loop3();
2986
3118
  }
2987
3119
  }
2988
- var optionItems = this.getCachedOptionItems(onCreateChart !== undefined && model.isChartBuilderAvailable, model.isCustomColumnsAvailable, model.isFormatColumnsAvailable, model.isRollupAvailable, model.isTotalsAvailable, model.isSelectDistinctAvailable, model.isExportAvailable, this.toggleFilterBarAction, this.toggleSearchBarAction, this.toggleGotoRowAction, isFilterBarShown, showSearchBar, canDownloadCsv, this.isTableSearchAvailable(), isGotoRowShown, advancedSettings.size > 0);
3120
+ var optionItems = this.getCachedOptionItems(onCreateChart !== undefined && model.isChartBuilderAvailable, model.isCustomColumnsAvailable, model.isFormatColumnsAvailable, model.isRollupAvailable, model.isTotalsAvailable, model.isSelectDistinctAvailable, model.isExportAvailable, this.toggleFilterBarAction, this.toggleSearchBarAction, this.toggleGotoRowAction, isFilterBarShown, showSearchBar, canDownloadCsv, this.isTableSearchAvailable(), isGotoShown, advancedSettings.size > 0);
2989
3121
  var openOptionsStack = openOptions.map(option => {
2990
3122
  switch (option.type) {
2991
3123
  case OptionType.CHART_BUILDER:
@@ -3197,10 +3329,11 @@ export class IrisGrid extends Component {
3197
3329
  tooltip: "Table Options"
3198
3330
  })), focusField, loadingElement, filterBar, columnTooltip, advancedFilterMenus, overflowButtonTooltipProps && this.getOverflowButtonTooltip(overflowButtonTooltipProps)), /*#__PURE__*/React.createElement(GotoRow, {
3199
3331
  model: model,
3200
- isShown: isGotoRowShown,
3332
+ isShown: isGotoShown,
3201
3333
  gotoRow: gotoRow,
3202
3334
  gotoRowError: gotoRowError,
3203
- onSubmit: this.handleGotoRowSelectedRowNumberSubmit,
3335
+ gotoValueError: gotoValueError,
3336
+ onGotoRowSubmit: this.handleGotoRowSelectedRowNumberSubmit,
3204
3337
  onGotoRowNumberChanged: this.handleGotoRowSelectedRowNumberChanged,
3205
3338
  onClose: this.handleGotoRowClosed,
3206
3339
  onEntering: this.handleAnimationStart,
@@ -3209,7 +3342,13 @@ export class IrisGrid extends Component {
3209
3342
  this.handleAnimationStart();
3210
3343
  this.focus();
3211
3344
  },
3212
- onExited: this.handleAnimationEnd
3345
+ onExited: this.handleAnimationEnd,
3346
+ gotoValueSelectedColumnName: gotoValueSelectedColumnName,
3347
+ gotoValue: gotoValue,
3348
+ onGotoValueSelectedColumnNameChanged: this.handleGotoValueSelectedColumnNameChanged,
3349
+ onGotoValueSelectedFilterChanged: this.handleGotoValueSelectedFilterChanged,
3350
+ onGotoValueChanged: this.handleGotoValueChanged,
3351
+ onGotoValueSubmit: this.handleGotoValueSubmitted
3213
3352
  }), /*#__PURE__*/React.createElement(PendingDataBottomBar, {
3214
3353
  error: pendingSaveError,
3215
3354
  isSaving: pendingSavePromise != null,