td-plots 1.2.3 → 1.3.1

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/index.js CHANGED
@@ -5860,17 +5860,17 @@ var Loading = function () {
5860
5860
  var Plot$2 = React.lazy(function () { return import('react-plotly.js'); });
5861
5861
  var HistogramPlot = function (props) {
5862
5862
  var _a, _b;
5863
- var data = props.data, title = props.title, xAxisTitle = props.xAxisTitle, _c = props.barColor, barColor = _c === void 0 ? 'rgb(72, 72, 74)' : _c, _d = props.unselectedBarColor, unselectedBarColor = _d === void 0 ? 'rgba(203, 195, 195, 0.88)' : _d, _e = props.selectorsColor, selectorsColor = _e === void 0 ? 'black' : _e, _f = props.showMeanLine, showMeanLine = _f === void 0 ? true : _f, _g = props.showAllDataMeanLine, showAllDataMeanLine = _g === void 0 ? true : _g, containerStyleOverrides = props.containerStyleOverrides, _h = props.unselectedData, unselectedData = _h === void 0 ? [] : _h, _j = props.handleClickOrSelection, handleClickOrSelection = _j === void 0 ? function () { } : _j, _k = props.onDeselect, onDeselect = _k === void 0 ? function () { } : _k, plotId = props.plotId, _l = props.selectByBin, selectByBin = _l === void 0 ? false : _l;
5863
+ var data = props.data, title = props.title, xAxisTitle = props.xAxisTitle, _c = props.barColor, barColor = _c === void 0 ? 'rgb(72, 72, 74)' : _c, _d = props.unselectedBarColor, unselectedBarColor = _d === void 0 ? 'rgba(203, 195, 195, 0.88)' : _d, _e = props.selectorsColor, selectorsColor = _e === void 0 ? 'black' : _e, _f = props.showMeanLines, showMeanLines = _f === void 0 ? true : _f, containerStyleOverrides = props.containerStyleOverrides, _g = props.unselectedData, unselectedData = _g === void 0 ? [] : _g, _h = props.handleClickOrSelection, handleClickOrSelection = _h === void 0 ? function () { } : _h, _j = props.onDeselect, onDeselect = _j === void 0 ? function () { } : _j, plotId = props.plotId, _k = props.selectByBin, selectByBin = _k === void 0 ? false : _k;
5864
5864
  // Ref for plot container
5865
5865
  var containerRef = React.useRef(null);
5866
5866
  // Track any selections made in this plot so we can style the selection box.
5867
- var _m = React.useState(null), selectedRange = _m[0], setSelectedRange = _m[1];
5867
+ var _l = React.useState(null), selectedRange = _l[0], setSelectedRange = _l[1];
5868
5868
  // Set the bins based on the entire data set.
5869
5869
  var nBins = Math.ceil(Math.sqrt(data.length + unselectedData.length));
5870
5870
  // Plotly determines "nice" bins which consequently means it internally decides the axis range. We need
5871
5871
  // to access that information once the plot has been initialized so that we can prevent the
5872
5872
  // axis range from changing during interaction. Dates use strings.
5873
- var _o = React.useState(undefined), fixedXAxisRange = _o[0], setFixedXAxisRange = _o[1];
5873
+ var _m = React.useState(undefined), fixedXAxisRange = _m[0], setFixedXAxisRange = _m[1];
5874
5874
  // Once the plot is drawn, record the initial axis range so we can keep it fixed.
5875
5875
  // figure should be Readonly<Plotly.Figure> but react-plotly.js doesn't expose that type, so we use any.
5876
5876
  var handlePlotUpdate = function (figure, graphDiv) {
@@ -5886,7 +5886,6 @@ var HistogramPlot = function (props) {
5886
5886
  var computedRange = typeof (range[0]) === 'string'
5887
5887
  ? [new Date(range[0]), new Date(range[1])]
5888
5888
  : [range[0], range[1]];
5889
- console.log('Captured range from onUpdate:', computedRange);
5890
5889
  setFixedXAxisRange(computedRange);
5891
5890
  }
5892
5891
  }
@@ -6018,11 +6017,12 @@ var HistogramPlot = function (props) {
6018
6017
  handleClickOrSelection(minValue, maxValue);
6019
6018
  }
6020
6019
  };
6021
- console.log('fixed range', fixedXAxisRange);
6022
6020
  // Create the selected range box
6023
6021
  var selectedRangeBox = React.useMemo(function () {
6024
6022
  if (!selectedRange)
6025
6023
  return [];
6024
+ if (unselectedData.length === 0)
6025
+ return []; // Don't show the box if the entire dataset is selected.
6026
6026
  // Create a multiply-like effect by using a semi-transparent dark overlay
6027
6027
  var multiplyColor = 'rgba(29, 104, 185, 0.1)';
6028
6028
  return [{
@@ -6039,7 +6039,7 @@ var HistogramPlot = function (props) {
6039
6039
  },
6040
6040
  layer: 'above' // Ensure the selection box is above the bars
6041
6041
  }];
6042
- }, [selectedRange]);
6042
+ }, [selectedRange, unselectedData]);
6043
6043
  var unselectedTrace = {
6044
6044
  x: unselectedData,
6045
6045
  type: 'histogram',
@@ -6078,7 +6078,7 @@ var HistogramPlot = function (props) {
6078
6078
  // Calculate the mean of the selected data using normalized data
6079
6079
  var meanValue = (_a = calculateMean(data)) !== null && _a !== void 0 ? _a : 0; // Default to 0 if no data
6080
6080
  var meanLineRadius = 0.01; // distance from the top of the y axis to the top/bottom end of the mean line
6081
- var meanLine = showMeanLine ? [{
6081
+ var meanLine = (showMeanLines && data.length > 0) ? [{
6082
6082
  type: 'line',
6083
6083
  x0: meanValue,
6084
6084
  y0: 1 - meanLineRadius,
@@ -6093,7 +6093,7 @@ var HistogramPlot = function (props) {
6093
6093
  // Draw mean line for all data
6094
6094
  var allData = tslib.__spreadArray(tslib.__spreadArray([], data, true), unselectedData, true);
6095
6095
  var allDataMeanValue = (_b = calculateMean(allData)) !== null && _b !== void 0 ? _b : 0;
6096
- var allDataMeanLine = (showAllDataMeanLine && unselectedData.length > 0) ? [{
6096
+ var allDataMeanLine = (showMeanLines && unselectedData.length > 0 && data.length > 0) ? [{
6097
6097
  type: 'line',
6098
6098
  x0: allDataMeanValue,
6099
6099
  y0: 1 - meanLineRadius,
@@ -6162,7 +6162,7 @@ var HistogramPlot = function (props) {
6162
6162
  dragmode: 'select', // Enable drag to select
6163
6163
  selectdirection: 'h', // User can select in horizontal direction only
6164
6164
  shapes: tslib.__spreadArray(tslib.__spreadArray(tslib.__spreadArray([], allDataMeanLine, true), meanLine, true), selectedRangeBox, true), // Add the mean line and selection box
6165
- annotations: (showMeanLine && meanLine) ? [{
6165
+ annotations: (showMeanLines && meanLine && data.length > 0) ? [{
6166
6166
  x: meanValue,
6167
6167
  y: 1 + meanLineRadius + 0.04, // Position above the mean line. Value set with respect to the paper coordinates.
6168
6168
  yref: 'paper',