@cosmograph/ui - npm Package Compare versions

Comparing version 2.0.0-beta.11 to 2.0.0-beta.12

modules/histogram/index.d.ts

@@ -55,7 +55,6 @@ import { HistogramConfig, type HistogramConfigInterface, type HistogramEvents } from './config';
     private _updateScales;
+    private _updateHistogramData;
     private _generateBandIntervals;
     private _mapDataToBars;
     private _countIntervals;
-    private _rollup;
-    private _updateHistogramData;
     private _disableBrush;
@@ -62,0 +61,0 @@ private _mapSelection;

modules/histogram/index.js

@@ -1,2 +0,2 @@
-import{axisBottom as t}from"d3-axis";import{ResizeObserver as i}from"@juggle/resize-observer";import{brushX as s}from"d3-brush";import{scaleSymlog as e,scaleLinear as a}from"d3-scale";import{select as n}from"d3-selection";import{extent as r}from"d3-array";import{HistogramConfig as h}from"./config.js";export{HistogramConfig}from"./config.js";import o from"./style.module.css.js";class _{constructor(s,n){this._config=new h,this._firstRender=!0,this._barWidth=0,this._maxCount=0,this._barsData=[],this._highlightedBarsData=[],this._bandIntervals=[],this._yScale=e(),this._xScale=a(),this._axis=t(this._xScale),this._containerNode=s,this._containerNode.classList.add(o.histogram),this._width=s.offsetWidth,this._height=s.offsetHeight,n&&this._config.init(n),this._histogramWidth=this._width-this._config.padding.left-this._config.padding.right,this._histogramHeight=this._height-this._config.padding.top-this._config.padding.bottom,this._initializeSVG(),this._initializeNoDataDiv(),this._initializeGroups(),this._axis.tickFormat((t=>(null==n?void 0:n.formatter)?null==n?void 0:n.formatter(t):t.toFixed(0))),this._resizeObserver=new i((()=>this.resize())),this._resizeObserver.observe(this._containerNode)}_initializeSVG(){this._svg=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._svg.classList.add(o.histogramSvg),this._containerNode.appendChild(this._svg)}_initializeNoDataDiv(){this._noDataDiv=document.createElement("div"),n(this._noDataDiv).style("display","block").attr("class",o.noData).append("div").text("No histogram data"),this._containerNode.appendChild(this._noDataDiv)}setLoadingState(){n(this._noDataDiv).select("div").text("Data loading...")}_initializeGroups(){this._axisGroup=n(this._svg).append("g").attr("class",o.axis),this._barsGroup=n(this._svg).append("g").attr("class",o.bars),this._highlightedBarsGroup=n(this._svg).append("g").attr("class",o.bars),this._brushGroup=n(this._svg).append("g").attr("class",o.brush)}get _barPadding(){return this._barWidth*this._config.barPadding}getCurrentSelection(){return this._currentSelection}getCurrentSelectionInPixels(){var t;return null!==(t=this._currentSelectionInPixels)&&void 0!==t?t:[]}getBarWidth(){return this._barWidth-this._barPadding}getConfig(){return this._config}setConfig(t){var i,s;const e=JSON.parse(JSON.stringify(this._config));this._config.init(null!=t?t:{}),this._config.allowSelection||this._disableBrush(),this._config.dataStep===(null===(i=e.config)||void 0===i?void 0:i.dataStep)&&this._config.barCount===(null===(s=e.config)||void 0===s?void 0:s.barCount)||(this._updateHistogramData(this._histogramData),this._updateHistogramData(this._highlightedData,!0)),this._config.formatter&&this._axis.tickFormat(this._config.formatter),this.resize()}setSelection(t,i=!1){var s,e,a,n;const r=this._currentSelection;if(t&&this._extent){const i=[Math.max(this._extent[0],Math.min(t[0],this._extent[1])),Math.min(this._extent[1],Math.max(t[1],this._extent[0]))];if(i[0]<i[1])if(this._config.stickySelection){const t=i.map(this._xScale);this._mapSelection(t)}else this._currentSelection=i;else this._currentSelection=void 0}else this._currentSelection=void 0;i||(null==r?void 0:r[0])===(null===(s=this._currentSelection)||void 0===s?void 0:s[0])&&(null==r?void 0:r[1])===(null===(e=this._currentSelection)||void 0===e?void 0:e[1])||null===(n=(a=this._config.events).onBrush)||void 0===n||n.call(a,this._currentSelection,!0),this._brushCurrentSelection()}resize(){const{offsetWidth:t,offsetHeight:i}=this._containerNode;this._width=t,this._height=i,this._histogramWidth=this._width-this._config.padding.left-this._config.padding.right,this._histogramHeight=this._height-this._config.padding.top-this._config.padding.bottom,this._histogramHeight>this._config.padding.top+this._config.padding.bottom&&(this._updateScales(),this._currentSelection&&this.setSelection(this._currentSelection,!0),this._firstRender||this.render())}render(){this._updateBrush(),this._updateBars(),this._updateBars(!0),this._updateAxis(),this._firstRender&&(this._firstRender=!1)}destroy(){this._containerNode.innerHTML=""}_parseData(t){var i;return null!==(i=null==t?void 0:t.map(Number).filter((t=>!isNaN(t))))&&void 0!==i?i:[]}setHistogramData(t,i){if(i&&i[1]<=i[0])return;this._histogramData=[],this._highlightedBarsData=[],this._currentSelection=void 0,this._brushCurrentSelection();const s=this._parseData(t),e=i||r(s),a=e[0]<e[1],h=a&&s.length>1;n(this._noDataDiv).style("display",h?"none":"block").select("div").text(a?"No histogram data":"Empty or invalid histogram data"),h&&(this._histogramData=s,this._extent=e,this._firstRender=!0),this._updateHistogramData(this._histogramData),this._updateScales(),this.render()}setHighlightedData(t){this._histogramData&&(this._highlightedData=this._parseData(t),this._highlightedBarsData=[],this._updateHistogramData(this._highlightedData,!0),this._updateBars(!0))}_updateAxis(){this._histogramData&&(this._axisGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top-this._config.selectionPadding/2+1}px)`).call(this._axis).call((t=>t.select(".domain").remove())),this._axisGroup.selectAll(".tick").select("text").attr("class",o.axisTick).attr("y",0).attr("dy",-2).attr("dx",this._config.labelSideMargin),this._axisGroup.selectAll(".tick:last-of-type text").attr("dx",-this._config.labelSideMargin).style("text-anchor","end"),this._axisGroup.selectAll("line").attr("y2",this._histogramHeight).attr("y1",0).attr("opacity",.1))}_updateBrush(){if(!this._config.allowSelection||this._histogramHeight<0||this._histogramWidth<0)return void this._brushGroup.selectAll("*").remove();const t=this._histogramHeight-this._config.selectionPadding,i=[[0,this._config.selectionPadding/2],[this._histogramWidth,t+this._config.selectionPadding/2]];this._brushInstance=s().extent(i),this._brushInstance.on("end",(({selection:t,sourceEvent:i})=>{var s,e,a,n;i&&(t?(this._config.stickySelection?this._mapSelection(t):this._currentSelection=t.map((t=>this._xScale.invert(t))),null===(e=(s=this._config.events).onBrush)||void 0===e||e.call(s,this._currentSelection)):(this._currentSelection=void 0,null===(n=(a=this._config.events).onBrush)||void 0===n||n.call(a,void 0)),this._brushCurrentSelection())})),this._brushGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top}px)`).call(this._brushInstance).call(this._brushInstance.move,this._currentSelectionInPixels||null),this._brushGroup.select("rect.selection").classed(o.selection,!0).attr("rx",this._config.selectionRadius).attr("ry",this._config.selectionRadius)}_updateBars(t=!1){const i=t?this._highlightedBarsGroup:this._barsGroup;i.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top-this._config.selectionPadding/2}px)`);const s=t?.5:1,e=this._createBars(i,t);!t&&this._config.events.onBarHover&&e.on("mouseover",this._config.events.onBarHover),this._animateBars(e,t,s)}_createBars(t,i){return t.selectAll(`.${i?o.highlightedBar:o.bar}`).data(i?this._highlightedBarsData:this._barsData).join("rect").attr("class",i?o.highlightedBar:o.bar).attr("x",(t=>this._xScale(t.rangeStart)+this._barPadding/2)).attr("width",this.getBarWidth()).attr("rx",this._config.barRadius).attr("ry",this._config.barRadius).attr("y",-this._histogramHeight)}_animateBars(t,i,s){t.transition().duration(300).attr("height",(t=>i&&0===t.count?0:this._yScale(t.count))).style("opacity",(t=>this._yScale(t.count)===this._config.minBarHeight?.4:s))}_updateScales(){if(!this._extent||!this._barsData.length||this._histogramHeight<0||this._histogramWidth<0)this._axisGroup.style("display","none");else{this._axisGroup.style("display","inherit");const t=this._barsData[this._barsData.length-1],i=this._config.dataStep?[this._extent[0],t.rangeEnd]:this._extent;this._xScale.domain(i).range([0,this._histogramWidth]).clamp(!0),this._yScale.range([this._config.minBarHeight,this._histogramHeight-this._config.barTopMargin-this._config.selectionPadding]).domain([0,this._maxCount]).clamp(!0),this._axis.tickValues(i),this._barWidth=this._xScale(t.rangeEnd)-this._xScale(t.rangeStart)}}_generateBandIntervals(){var t;if(!this._extent)return;const i=this._extent[1]-this._extent[0],s=null!==(t=this._config.dataStep)&&void 0!==t?t:isFinite(i)&&this._config.barCount>1?Math.abs(i)/(this._config.barCount-1):1;0!==s&&(this._bandIntervals=Array.from({length:this._config.barCount},((t,i)=>this._extent[0]+i*s)),this._bandIntervals[this._bandIntervals.length-1]=this._extent[1])}_mapDataToBars(t,i=!1){const s=this._bandIntervals.slice(0,-1).map(((t,i)=>[t,this._bandIntervals[i+1]])),e=s.filter((([t,s])=>{if(!i||!this._currentSelection)return!0;const[e,a]=this._currentSelection;return s>e&&t<a})),a=this._countIntervals(t,e),n=new Map(a.map((t=>[`${t.start}-${t.end}`,t.count])));return s.map((([t,i])=>{var s;return{rangeStart:t,rangeEnd:i,count:null!==(s=n.get(`${t}-${i}`))&&void 0!==s?s:0}}))}_countIntervals(t,i){const s=Array.from(t.keys()).sort(((t,i)=>t-i)),e=new Float64Array(s.length+1);for(let i=0;i<s.length;i++)e[i+1]=e[i]+(t.get(s[i])||0);const a=t=>{let i=0,e=s.length;for(;i<e;){const a=i+e>>>1;s[a]<=t?i=a+1:e=a}return i};return i.map((([t,i])=>{const s=a(t),n=a(i);return{start:t,end:i,count:e[n]-e[s]}}))}_rollup(t){const i=new Map;if(!t.length)return i;for(let s=0;s<t.length;s++){const e=t[s];i.set(e,(i.get(e)||0)+1)}return i}_updateHistogramData(t,i=!1){if(this._extent&&(null==t?void 0:t.length)){const s=this._rollup(null!=t?t:[]);i?this._highlightedBarsData=this._mapDataToBars(s,!0):(this._generateBandIntervals(),this._barsData=this._mapDataToBars(s),this._maxCount=Math.max(...this._barsData.map((t=>t.count))))}else i?this._highlightedBarsData=[]:this._barsData=[]}_disableBrush(){this._currentSelection=void 0,this._brushCurrentSelection(),this._brushGroup.selectAll("*").remove()}_mapSelection(t){if(!this._barsData.length)return;const i=this._xScale.invert(t[0]),s=this._xScale.invert(t[1]),e=this._getClosestRange(i),a=this._getClosestRange(s,!0);e&&a&&e.rangeStart<=a.rangeEnd&&t[1]-t[0]>this.getBarWidth()/2?this._currentSelection=[e.rangeStart,a.rangeEnd]:this._currentSelection=void 0}_getClosestRange(t,i){return this._barsData.reduce(((s,e)=>{const a=i?s.rangeEnd:s.rangeStart,n=i?e.rangeEnd:e.rangeStart;return Math.abs(n-t)<Math.abs(a-t)?e:s}))}_brushCurrentSelection(){var t;this._currentSelection?(this._currentSelectionInPixels=this._currentSelection.map(this._xScale),this._brushInstance&&!this._firstRender&&this._brushGroup.call(this._brushInstance.move,this._currentSelectionInPixels)):(this._currentSelectionInPixels=void 0,null===(t=this._brushInstance)||void 0===t||t.clear(this._brushGroup))}}export{_ as Histogram};
+import{axisBottom as t}from"d3-axis";import{ResizeObserver as i}from"@juggle/resize-observer";import{brushX as s}from"d3-brush";import{scaleSymlog as e,scaleLinear as a}from"d3-scale";import{select as n}from"d3-selection";import{extent as r}from"d3-array";import{HistogramConfig as h}from"./config.js";export{HistogramConfig}from"./config.js";import o from"./style.module.css.js";class _{constructor(s,n){this._config=new h,this._firstRender=!0,this._barWidth=0,this._maxCount=0,this._barsData=[],this._highlightedBarsData=[],this._bandIntervals=[],this._yScale=e(),this._xScale=a(),this._axis=t(this._xScale),this._containerNode=s,this._containerNode.classList.add(o.histogram),this._width=s.offsetWidth,this._height=s.offsetHeight,n&&this._config.init(n),this._histogramWidth=this._width-this._config.padding.left-this._config.padding.right,this._histogramHeight=this._height-this._config.padding.top-this._config.padding.bottom,this._initializeSVG(),this._initializeNoDataDiv(),this._initializeGroups(),this._axis.tickFormat((t=>(null==n?void 0:n.formatter)?null==n?void 0:n.formatter(t):t.toFixed(0))),this._resizeObserver=new i((()=>this.resize())),this._resizeObserver.observe(this._containerNode)}_initializeSVG(){this._svg=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._svg.classList.add(o.histogramSvg),this._containerNode.appendChild(this._svg)}_initializeNoDataDiv(){this._noDataDiv=document.createElement("div"),n(this._noDataDiv).style("display","block").attr("class",o.noData).append("div").text("No histogram data"),this._containerNode.appendChild(this._noDataDiv)}setLoadingState(){n(this._noDataDiv).select("div").text("Data loading...")}_initializeGroups(){this._axisGroup=n(this._svg).append("g").attr("class",o.axis),this._barsGroup=n(this._svg).append("g").attr("class",o.bars),this._highlightedBarsGroup=n(this._svg).append("g").attr("class",o.bars),this._brushGroup=n(this._svg).append("g").attr("class",o.brush)}get _barPadding(){return this._barWidth*this._config.barPadding}getCurrentSelection(){return this._currentSelection}getCurrentSelectionInPixels(){var t;return null!==(t=this._currentSelectionInPixels)&&void 0!==t?t:[]}getBarWidth(){return this._barWidth-this._barPadding}getConfig(){return this._config}setConfig(t){var i,s;const e=JSON.parse(JSON.stringify(this._config));this._config.init(null!=t?t:{}),this._config.allowSelection||this._disableBrush(),this._config.dataStep===(null===(i=e.config)||void 0===i?void 0:i.dataStep)&&this._config.barCount===(null===(s=e.config)||void 0===s?void 0:s.barCount)||(this._updateHistogramData(this._histogramData),this._updateHistogramData(this._highlightedData,!0)),this._config.formatter&&this._axis.tickFormat(this._config.formatter),this.resize()}setSelection(t,i=!1){var s,e,a,n;const r=this._currentSelection;if(t&&this._extent){const i=[Math.max(this._extent[0],Math.min(t[0],this._extent[1])),Math.min(this._extent[1],Math.max(t[1],this._extent[0]))];if(i[0]<i[1])if(this._config.stickySelection){const t=i.map(this._xScale);this._mapSelection(t)}else this._currentSelection=i;else this._currentSelection=void 0}else this._currentSelection=void 0;i||(null==r?void 0:r[0])===(null===(s=this._currentSelection)||void 0===s?void 0:s[0])&&(null==r?void 0:r[1])===(null===(e=this._currentSelection)||void 0===e?void 0:e[1])||null===(n=(a=this._config.events).onBrush)||void 0===n||n.call(a,this._currentSelection,!0),this._brushCurrentSelection()}resize(){const{offsetWidth:t,offsetHeight:i}=this._containerNode;this._width=t,this._height=i,this._histogramWidth=this._width-this._config.padding.left-this._config.padding.right,this._histogramHeight=this._height-this._config.padding.top-this._config.padding.bottom,this._histogramHeight>this._config.padding.top+this._config.padding.bottom&&(this._updateScales(),this._currentSelection&&this.setSelection(this._currentSelection,!0),this._firstRender||this.render())}render(){this._updateBrush(),this._updateBars(),this._updateBars(!0),this._updateAxis(),this._firstRender&&(this._firstRender=!1)}destroy(){this._containerNode.innerHTML=""}_parseData(t){var i;return null!==(i=null==t?void 0:t.map(Number).filter((t=>!isNaN(t))))&&void 0!==i?i:[]}setHistogramData(t,i){if(i&&i[1]<=i[0])return;this._histogramData=[],this._highlightedBarsData=[],this._currentSelection=void 0,this._brushCurrentSelection();const s=this._parseData(t),e=i||r(s),a=e[0]<e[1],h=a&&s.length>1;n(this._noDataDiv).style("display",h?"none":"block").select("div").text(a?"No histogram data":"Empty or invalid histogram data"),h&&(this._histogramData=s,this._extent=e,this._firstRender=!0),this._updateHistogramData(this._histogramData),this._updateScales(),this.render()}setHighlightedData(t){this._histogramData&&(this._highlightedData=this._parseData(t),this._highlightedBarsData=[],this._updateHistogramData(this._highlightedData,!0),this._updateBars(!0))}_updateAxis(){this._histogramData&&(this._axisGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top-this._config.selectionPadding/2+1}px)`).call(this._axis).call((t=>t.select(".domain").remove())),this._axisGroup.selectAll(".tick").select("text").attr("class",o.axisTick).attr("y",0).attr("dy",-2).attr("dx",this._config.labelSideMargin),this._axisGroup.selectAll(".tick:last-of-type text").attr("dx",-this._config.labelSideMargin).style("text-anchor","end"),this._axisGroup.selectAll("line").attr("y2",this._histogramHeight).attr("y1",0).attr("opacity",.1))}_updateBrush(){if(!this._config.allowSelection||this._histogramHeight<0||this._histogramWidth<0)return void this._brushGroup.selectAll("*").remove();const t=this._histogramHeight-this._config.selectionPadding,i=[[0,this._config.selectionPadding/2],[this._histogramWidth,t+this._config.selectionPadding/2]];this._brushInstance=s().extent(i),this._brushInstance.on("end",(({selection:t,sourceEvent:i})=>{var s,e,a,n;i&&(t?(this._config.stickySelection?this._mapSelection(t):this._currentSelection=t.map((t=>this._xScale.invert(t))),null===(e=(s=this._config.events).onBrush)||void 0===e||e.call(s,this._currentSelection)):(this._currentSelection=void 0,null===(n=(a=this._config.events).onBrush)||void 0===n||n.call(a,void 0)),this._brushCurrentSelection())})),this._brushGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top}px)`).call(this._brushInstance).call(this._brushInstance.move,this._currentSelectionInPixels||null),this._brushGroup.select("rect.selection").classed(o.selection,!0).attr("rx",this._config.selectionRadius).attr("ry",this._config.selectionRadius)}_updateBars(t=!1){const i=t?this._highlightedBarsGroup:this._barsGroup;i.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top-this._config.selectionPadding/2}px)`);const s=t?.5:1,e=this._createBars(i,t);!t&&this._config.events.onBarHover&&e.on("mouseover",this._config.events.onBarHover),this._animateBars(e,t,s)}_createBars(t,i){return t.selectAll(`.${i?o.highlightedBar:o.bar}`).data(i?this._highlightedBarsData:this._barsData).join("rect").attr("class",i?o.highlightedBar:o.bar).attr("x",(t=>this._xScale(t.rangeStart)+this._barPadding/2)).attr("width",this.getBarWidth()).attr("rx",this._config.barRadius).attr("ry",this._config.barRadius).attr("y",-this._histogramHeight)}_animateBars(t,i,s){t.transition().duration(300).attr("height",(t=>i&&0===t.count?0:this._yScale(t.count))).style("opacity",(t=>this._yScale(t.count)===this._config.minBarHeight?.4:s))}_updateScales(){if(!this._extent||!this._barsData.length||this._histogramHeight<0||this._histogramWidth<0)this._axisGroup.style("display","none");else{this._axisGroup.style("display","inherit");const t=this._barsData[this._barsData.length-1],i=this._config.dataStep?[this._extent[0],t.rangeEnd]:this._extent;this._xScale.domain(i).range([0,this._histogramWidth]).clamp(!0),this._yScale.range([this._config.minBarHeight,this._histogramHeight-this._config.barTopMargin-this._config.selectionPadding]).domain([0,this._maxCount]).clamp(!0),this._axis.tickValues(i),this._barWidth=this._xScale(t.rangeEnd)-this._xScale(t.rangeStart)}}_updateHistogramData(t,i=!1){const s=i?"_highlightedBarsData":"_barsData";if(!this._extent||!(null==t?void 0:t.length))return void(this[s]=[]);const e=new Float64Array(t).sort();i||this._generateBandIntervals();const a=this._mapDataToBars(e,i);this[s]=a,i||(this._maxCount=Math.max(...a.map((t=>t.count))))}_generateBandIntervals(){var t;if(!this._extent)return;const i=this._extent[1]-this._extent[0],s=null!==(t=this._config.dataStep)&&void 0!==t?t:isFinite(i)&&this._config.barCount>1?i/(this._config.barCount-1):1;0!==s&&(this._bandIntervals=Array.from({length:this._config.barCount},((t,i)=>+this._extent[0]+i*s)),this._bandIntervals[this._bandIntervals.length-1]=+this._extent[1])}_mapDataToBars(t,i){const s=new Array(this._bandIntervals.length-1);for(let t=0;t<this._bandIntervals.length-1;t++)s[t]=[this._bandIntervals[t],this._bandIntervals[t+1]];const e=this._currentSelection&&i?s.filter((([t,i])=>{const[s,e]=this._currentSelection;return!(t<s)&&(!(i>=e)||i>s&&t<e)})):s,a=this._countIntervals(t,e);return s.map((([t,i])=>{var s;return{rangeStart:t,rangeEnd:i,count:null!==(s=a.get(`${t}-${i}`))&&void 0!==s?s:0}}))}_countIntervals(t,i){const s=new Map,e=(i,s,e=0,a=t.length)=>{for(;e<a;){const n=e+a>>>1;t[n]<i||s&&t[n]===i?e=n+1:a=n}return e};return i.forEach((([t,i])=>{const a=e(t,!1),n=e(i,!0);s.set(`${t}-${i}`,n-a)})),s}_disableBrush(){this._currentSelection=void 0,this._brushCurrentSelection(),this._brushGroup.selectAll("*").remove()}_mapSelection(t){if(!this._barsData.length)return;const i=this._xScale.invert(t[0]),s=this._xScale.invert(t[1]),e=this._getClosestRange(i),a=this._getClosestRange(s,!0);e&&a&&e.rangeStart<=a.rangeEnd&&t[1]-t[0]>this.getBarWidth()/2?this._currentSelection=[e.rangeStart,a.rangeEnd]:this._currentSelection=void 0}_getClosestRange(t,i){return this._barsData.reduce(((s,e)=>{const a=i?s.rangeEnd:s.rangeStart,n=i?e.rangeEnd:e.rangeStart;return Math.abs(n-t)<Math.abs(a-t)?e:s}))}_brushCurrentSelection(){var t;this._currentSelection?(this._currentSelectionInPixels=this._currentSelection.map(this._xScale),this._brushInstance&&!this._firstRender&&this._brushGroup.call(this._brushInstance.move,this._currentSelectionInPixels)):(this._currentSelectionInPixels=void 0,null===(t=this._brushInstance)||void 0===t||t.clear(this._brushGroup))}}export{_ as Histogram};
 //# sourceMappingURL=index.js.map

modules/legend/color/range/config.d.ts

@@ -43,2 +43,7 @@ import { Config } from '../../../../utils';
     /**
+     * Whether to use display colors `extent` as discrete segments or continuous gradient.
+     * @default false
+     */
+    discreteColors?: boolean;
+    /**
      * The event handlers for the color legend.
@@ -84,3 +89,4 @@ * @default undefined
     maxSubLabel: string;
+    discreteColors: undefined;
     events: RangeColorLegendEvents;
 }

modules/legend/color/range/config.js

@@ -1,2 +0,2 @@
-import{Config as i,defaultFormatter as t}from"../../../../utils.js";class e extends i{constructor(){super(...arguments),this.label="",this.labelFormatter=t,this.extent=void 0,this.extentLabels=void 0,this.enableEvents=!0,this.showSublabels=!1,this.minSubLabel="min",this.maxSubLabel="max",this.events={onClick:void 0,onHover:void 0,onMaxClick:void 0,onMinClick:void 0}}}export{e as RangeColorLegendConfig};
+import{Config as i,defaultFormatter as t}from"../../../../utils.js";class s extends i{constructor(){super(...arguments),this.label="",this.labelFormatter=t,this.extent=void 0,this.extentLabels=void 0,this.enableEvents=!0,this.showSublabels=!1,this.minSubLabel="min",this.maxSubLabel="max",this.discreteColors=void 0,this.events={onClick:void 0,onHover:void 0,onMaxClick:void 0,onMinClick:void 0}}}export{s as RangeColorLegendConfig};
 //# sourceMappingURL=config.js.map

modules/legend/color/range/index.js

@@ -1,2 +0,2 @@
-import{RangeColorLegendConfig as e}from"./config.js";import t from"./style.module.css.js";class i{constructor(i,n){this._config=new e,this._extentElements=null,this._isHidden=!1,this._fallbackTimeout=null,this._handleClick=e=>{var t,i;this._config.enableEvents&&(null===(i=null===(t=this._config.events)||void 0===t?void 0:t.onClick)||void 0===i||i.call(t,e))},this._handleHover=e=>{var t,i;this._config.enableEvents&&(null===(i=null===(t=this._config.events)||void 0===t?void 0:t.onHover)||void 0===i||i.call(t,e))},this._handleColorElementClick=e=>{var t,i,n,l;if(!this._config.enableEvents)return;const s=e.currentTarget.className.includes("min")?"min":"max",a="min"===s?null===(t=this._config.events)||void 0===t?void 0:t.onMinClick:null===(i=this._config.events)||void 0===i?void 0:i.onMaxClick;if(a){const t="min"===s?0:1;a(null===(n=this._config.extent)||void 0===n?void 0:n["min"===s?0:this._config.extent.length-1],null===(l=this._config.extentLabels)||void 0===l?void 0:l[t],e)}},this._handleColorElementHover=e=>{var i,n,l,s;if(!this._config.enableEvents||!this._config.extent)return;const a=e.currentTarget;if(!a)return;const o=a.classList.contains("min")?"min":"max",d="mouseenter"===e.type,r="min"===o?0:this._config.extent.length-1,c=null===(i=this._config.extent)||void 0===i?void 0:i[r],h=null===(n=this._config.extentLabels)||void 0===n?void 0:n[r];a.classList.toggle(t.hovered,d),null===(s=null===(l=this._config.events)||void 0===l?void 0:l.onHover)||void 0===s||s.call(l,{target:a,type:o,color:c,value:h})},this._containerNode=i,this._containerNode.classList.add(t.container),this._createElements(),this.setConfig(n)}get extentElements(){return this._extentElements}get config(){return this._config}hide(){this._isHidden=!0,this._containerNode.classList.remove(t.enabled),this._containerNode.classList.add(t.disabled)}show(){this._isHidden=!1,this._containerNode.classList.remove(t.disabled),this._containerNode.classList.add(t.enabled)}setConfig(e){this._config.init(null!=e?e:{}),this._updateLegend()}destroy(){this._legend&&(this._resetFallbackAnimationTimeout(),this._legend.removeEventListener("click",this._handleClick),this._legend.removeEventListener("mouseover",this._handleHover),this._extentElements&&["min","max"].forEach((e=>{const t=this._extentElements[e];t.removeEventListener("click",this._handleColorElementClick),t.removeEventListener("mouseenter",this._handleColorElementHover),t.removeEventListener("mouseleave",this._handleColorElementHover)})),this._containerNode.removeChild(this._legend),this._containerNode.removeChild(this._fallbackDiv))}setLoadingState(){this._fallbackDiv.textContent="Data loading..."}_createElements(){this._legend=document.createElement("div"),this._legend.classList.add(t.legend),this._legendElements=this._createLegend(),this._gradientElement=this._createGradientElement(),this._fallbackDiv=this._createFallbackMessage(),this._legend.appendChild(this._legendElements),this._legend.appendChild(this._gradientElement),this._containerNode.appendChild(this._legend),this._containerNode.appendChild(this._fallbackDiv),this._isHidden||this.show()}_createLegend(){const e=document.createElement("div");e.classList.add("legend-content");const t=document.createElement("div");return t.classList.add("name"),this._extentElements={min:this._createLabelExtent("min"),max:this._createLabelExtent("max")},e.appendChild(this._extentElements.min),e.appendChild(t),e.appendChild(this._extentElements.max),e}_createLabelExtent(e){const t=document.createElement("div");t.classList.add("extent"),t.classList.add(e);const i=document.createElement("div");return i.classList.add("label"),t.appendChild(i),t.addEventListener("click",this._handleColorElementClick),t.addEventListener("mouseenter",this._handleColorElementHover),t.addEventListener("mouseleave",this._handleColorElementHover),t}_createFallbackMessage(){const e=document.createElement("div");return e.classList.add(t.fallback),e.textContent="No legend data",e}_resetFallbackAnimationTimeout(){this._fallbackTimeout&&(clearTimeout(this._fallbackTimeout),this._fallbackTimeout=null)}_createGradientElement(){const e=document.createElement("div");return e.classList.add("gradient"),e}_updateLegend(){var e;if(this._config.extent){this._resetFallbackAnimationTimeout(),this._fallbackDiv.style.display="none";const i=this._legendElements.querySelector(".name");i&&(i.textContent=null!==(e=this._config.label)&&void 0!==e?e:""),this._updateLabelWrapper("min"),this._updateLabelWrapper("max"),this._updateGradient(),this._legend.classList.remove(t.disabled),this._legend.classList.add(t.enabled)}else this._resetFallbackAnimationTimeout(),this._fallbackDiv.textContent="No legend data",this._legend.classList.remove(t.enabled),this._legend.classList.add(t.disabled),"block"!==this._fallbackDiv.style.display&&(this._fallbackTimeout=setTimeout((()=>{this._fallbackDiv.style.display="block"}),450))}_updateGradient(){var e,t,i;if(!this._config.extent)return;const n=`linear-gradient(to right, ${1===(null===(e=this._config.extent)||void 0===e?void 0:e.length)?`${this._getColor(this._config.extent[0])} 0%, ${this._getColor(this._config.extent[0])} 100%`:null!==(i=null===(t=this._config.extent)||void 0===t?void 0:t.map(((e,t)=>{const i=t/(this._config.extent.length-1)*100;return`${this._getColor(e)} ${i}%`})).join(", "))&&void 0!==i?i:""})`;this._gradientElement.style.backgroundImage=n}_updateLabelWrapper(e){var t;const i=this._legendElements.querySelector(".extent:"+("min"===e?"first-child":"last-child"));if(!i)return;const n="min"===e?0:1,l=null===(t=this._config.extentLabels)||void 0===t?void 0:t[n],s=i.querySelector(".label");s&&void 0!==l&&(s.textContent=this._formatLabel(l)),this._updateSublabel(i,e)}_updateSublabel(e,t){let i=e.querySelector(".sublabel");this._config.showSublabels?(i||(i=document.createElement("div"),i.classList.add("sublabel"),e.appendChild(i)),i.textContent="min"===t?this._config.minSubLabel:this._config.maxSubLabel):i&&i.remove()}_formatLabel(e){return"string"==typeof e?e:this._config.labelFormatter?this._config.labelFormatter(e):e.toString()}_getColor(e){return Array.isArray(e)?`rgba(${e[0]}, ${e[1]}, ${e[2]}, ${e[3]})`:e}}export{i as RangeColorLegend};
+import{RangeColorLegendConfig as e}from"./config.js";import t from"./style.module.css.js";class i{constructor(i,n){this._config=new e,this._extentElements=null,this._isHidden=!1,this._fallbackTimeout=null,this._handleClick=e=>{var t,i;this._config.enableEvents&&(null===(i=null===(t=this._config.events)||void 0===t?void 0:t.onClick)||void 0===i||i.call(t,e))},this._handleHover=e=>{var t,i;this._config.enableEvents&&(null===(i=null===(t=this._config.events)||void 0===t?void 0:t.onHover)||void 0===i||i.call(t,e))},this._handleColorElementClick=e=>{var t,i,n,s;if(!this._config.enableEvents)return;const l=e.currentTarget.className.includes("min")?"min":"max",a="min"===l?null===(t=this._config.events)||void 0===t?void 0:t.onMinClick:null===(i=this._config.events)||void 0===i?void 0:i.onMaxClick;if(a){const t="min"===l?0:1;a(null===(n=this._config.extent)||void 0===n?void 0:n["min"===l?0:this._config.extent.length-1],null===(s=this._config.extentLabels)||void 0===s?void 0:s[t],e)}},this._handleColorElementHover=e=>{var i,n,s,l;if(!this._config.enableEvents||!this._config.extent)return;const a=e.currentTarget;if(!a)return;const o=a.classList.contains("min")?"min":"max",d="mouseenter"===e.type,r="min"===o?0:this._config.extent.length-1,c=null===(i=this._config.extent)||void 0===i?void 0:i[r],h=null===(n=this._config.extentLabels)||void 0===n?void 0:n[r];a.classList.toggle(t.hovered,d),null===(l=null===(s=this._config.events)||void 0===s?void 0:s.onHover)||void 0===l||l.call(s,{target:a,type:o,color:c,value:h})},this._containerNode=i,this._containerNode.classList.add(t.container),this._createElements(),this.setConfig(n)}get extentElements(){return this._extentElements}get config(){return this._config}hide(){this._isHidden=!0,this._containerNode.classList.remove(t.enabled),this._containerNode.classList.add(t.disabled)}show(){this._isHidden=!1,this._containerNode.classList.remove(t.disabled),this._containerNode.classList.add(t.enabled)}setConfig(e){this._config.init(null!=e?e:{}),this._updateLegend()}destroy(){this._legend&&(this._resetFallbackAnimationTimeout(),this._legend.removeEventListener("click",this._handleClick),this._legend.removeEventListener("mouseover",this._handleHover),this._extentElements&&["min","max"].forEach((e=>{const t=this._extentElements[e];t.removeEventListener("click",this._handleColorElementClick),t.removeEventListener("mouseenter",this._handleColorElementHover),t.removeEventListener("mouseleave",this._handleColorElementHover)})),this._containerNode.removeChild(this._legend),this._containerNode.removeChild(this._fallbackDiv))}setLoadingState(){this._fallbackDiv.textContent="Data loading..."}_createElements(){this._legend=document.createElement("div"),this._legend.classList.add(t.legend),this._legendElements=this._createLegend(),this._gradientElement=this._createGradientElement(),this._fallbackDiv=this._createFallbackMessage(),this._legend.appendChild(this._legendElements),this._legend.appendChild(this._gradientElement),this._containerNode.appendChild(this._legend),this._containerNode.appendChild(this._fallbackDiv),this._isHidden||this.show()}_createLegend(){const e=document.createElement("div");e.classList.add("legend-content");const t=document.createElement("div");return t.classList.add("name"),this._extentElements={min:this._createLabelExtent("min"),max:this._createLabelExtent("max")},e.appendChild(this._extentElements.min),e.appendChild(t),e.appendChild(this._extentElements.max),e}_createLabelExtent(e){const t=document.createElement("div");t.classList.add("extent"),t.classList.add(e);const i=document.createElement("div");return i.classList.add("label"),t.appendChild(i),t.addEventListener("click",this._handleColorElementClick),t.addEventListener("mouseenter",this._handleColorElementHover),t.addEventListener("mouseleave",this._handleColorElementHover),t}_createFallbackMessage(){const e=document.createElement("div");return e.classList.add(t.fallback),e.textContent="No legend data",e}_resetFallbackAnimationTimeout(){this._fallbackTimeout&&(clearTimeout(this._fallbackTimeout),this._fallbackTimeout=null)}_createGradientElement(){const e=document.createElement("div");return e.classList.add("gradient"),e}_updateLegend(){var e;if(this._config.extent){this._resetFallbackAnimationTimeout(),this._fallbackDiv.style.display="none";const i=this._legendElements.querySelector(".name");i&&(i.textContent=null!==(e=this._config.label)&&void 0!==e?e:""),this._updateLabelWrapper("min"),this._updateLabelWrapper("max"),this._updateGradient(),this._legend.classList.remove(t.disabled),this._legend.classList.add(t.enabled)}else this._resetFallbackAnimationTimeout(),this._fallbackDiv.textContent="No legend data",this._legend.classList.remove(t.enabled),this._legend.classList.add(t.disabled),"block"!==this._fallbackDiv.style.display&&(this._fallbackTimeout=setTimeout((()=>{this._fallbackDiv.style.display="block"}),450))}_updateGradient(){if(this._config.extent)if(this._config.discreteColors){const e=this._config.extent.map(((e,t)=>`${this._getColor(e)} ${t/this._config.extent.length*100}% ${(t+1)/this._config.extent.length*100}%`)).join(", ");this._gradientElement.style.backgroundImage=`linear-gradient(to right, ${e})`}else{const e=this._config.extent.map(((e,t)=>`${this._getColor(e)} ${t/(this._config.extent.length-1)*100}%`)).join(", ");this._gradientElement.style.backgroundImage=`linear-gradient(to right, ${e})`}}_updateLabelWrapper(e){var t;const i=this._legendElements.querySelector(".extent:"+("min"===e?"first-child":"last-child"));if(!i)return;const n="min"===e?0:1,s=null===(t=this._config.extentLabels)||void 0===t?void 0:t[n],l=i.querySelector(".label");l&&void 0!==s&&(l.textContent=this._formatLabel(s)),this._updateSublabel(i,e)}_updateSublabel(e,t){let i=e.querySelector(".sublabel");this._config.showSublabels?(i||(i=document.createElement("div"),i.classList.add("sublabel"),e.appendChild(i)),i.textContent="min"===t?this._config.minSubLabel:this._config.maxSubLabel):i&&i.remove()}_formatLabel(e){return"string"==typeof e?e:this._config.labelFormatter?this._config.labelFormatter(e):e.toString()}_getColor(e){return Array.isArray(e)?`rgba(${e[0]}, ${e[1]}, ${e[2]}, ${e[3]})`:e}}export{i as RangeColorLegend};
 //# sourceMappingURL=index.js.map

modules/timeline/index.d.ts

@@ -62,3 +62,2 @@ import 'd3-transition';
     private _countIntervals;
-    private _rollup;
     setSelection(selectionRange?: [Date, Date] | [number, number], renderOnly?: boolean): void;
@@ -65,0 +64,0 @@ private _setSelectionInPixels;

modules/timeline/index.js

@@ -1,2 +0,2 @@
-import"d3-transition";import{ResizeObserver as i}from"@juggle/resize-observer";import{axisBottom as t}from"d3-axis";import{brushX as e}from"d3-brush";import{scaleSymlog as s,scaleTime as n,scaleLinear as a}from"d3-scale";import{select as o}from"d3-selection";import{extent as h,range as r}from"d3-array";import{play as l,pause as c}from"./assets.js";import{TimelineConfig as _}from"./config.js";export{TimelineConfig}from"./config.js";import{defaultDateFormat as d}from"./format.js";import u from"./style.module.css.js";import{getInnerDimensions as g}from"../../utils.js";class m{constructor(e,o){this._config=new _,this._isAnimationRunning=!1,this._svgParser=new DOMParser,this._height=0,this._width=0,this._timelineWidth=0,this._timelineHeight=0,this._barWidth=0,this._maxCount=0,this._barsData=[],this._highlightedBarsData=[],this._bandIntervals=[],this._isNumericTimeline=!1,this._firstRender=!0,this._yScale=s(),this._timeScale=n(),this._numScale=a(),this._activeAxisScale=this._timeScale,this._timeAxis=t(this._timeScale),this._numAxis=t(this._numScale),this._toggleAnimation=i=>{i.preventDefault(),this._isAnimationRunning?this.pauseAnimation():this.playAnimation()},this._disableAnimation=()=>{var i,t;this.pauseAnimation(),null===(i=this._animationControlDiv)||void 0===i||i.removeEventListener("click",this._toggleAnimation),null===(t=this._animationControlDiv)||void 0===t||t.remove()},this.playAnimation=()=>{var i,t,e,s;clearInterval(this._animationInterval),this._currentSelectionInPixels&&(this._animationInterval=setInterval(this._animateSelection,this._config.animationSpeed),this._isAnimationRunning=!0,null===(t=(i=this._config.events).onAnimationPlay)||void 0===t||t.call(i,this._isAnimationRunning,this._currentSelection)),null===(e=this._pauseButtonSvg)||void 0===e||e.classList.remove(u.hidden),null===(s=this._playButtonSvg)||void 0===s||s.classList.add(u.hidden)},this.pauseAnimation=()=>{var i,t,e,s;clearInterval(this._animationInterval),this._isAnimationRunning=!1,null===(t=(i=this._config.events).onAnimationPause)||void 0===t||t.call(i,this._isAnimationRunning,this._currentSelection),null===(e=this._pauseButtonSvg)||void 0===e||e.classList.add(u.hidden),null===(s=this._playButtonSvg)||void 0===s||s.classList.remove(u.hidden)},this.stopAnimation=()=>{var i,t;this.pauseAnimation(),this.setSelection(void 0),null===(t=(i=this._config.events).onBrush)||void 0===t||t.call(i,void 0)},this._animateSelection=()=>{var i,t;const e=this._currentSelectionInPixels;e&&void 0!==e[0]&&void 0!==e[1]&&(this._setSelectionInPixels([e[0]+this._barWidth,e[1]+this._barWidth]),e[1]!==(null===(i=this._currentSelectionInPixels)||void 0===i?void 0:i[1])&&void 0!==(null===(t=this._currentSelectionInPixels)||void 0===t?void 0:t[1])||this.stopAnimation())},this._checkLastTickPosition=()=>{var i;const t=this._axisGroup.selectAll(".tick:last-of-type").nodes();if(null==t?void 0:t.length){const e=t[0],s=null==e?void 0:e.getBoundingClientRect().right,n=null===(i=this._svg)||void 0===i?void 0:i.getBoundingClientRect().right;e.style.display=s>=n?"none":"inherit"}},this.destroy=()=>{this._containerNode.innerHTML="",clearInterval(this._animationInterval)},o&&this._config.init(o),this._containerNode=e,this._animationControlDiv=document.createElement("div"),this._animationControlDiv.classList.add(u.animationControl),this._initializeSVG(),this._initializeNoDataDiv(),this._initializeGroups(),this._resizeObserver=new i((()=>{this.resize()})),this._resizeObserver.observe(this._containerNode)}_initializeSVG(){this._svg=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._svg.classList.add(u.timelineSvg),this._containerNode.classList.add(u.timeline),this._containerNode.appendChild(this._svg)}async _initAnimationControls(){this._containerNode.insertBefore(this._animationControlDiv,this._svg);await(async()=>{var i,t;if(!this._animationControlDiv.firstChild){const e=this._svgParser.parseFromString(l,"image/svg+xml").firstChild,s=this._svgParser.parseFromString(c,"image/svg+xml").firstChild;this._pauseButtonSvg=null===(i=this._animationControlDiv)||void 0===i?void 0:i.appendChild(s),this._playButtonSvg=null===(t=this._animationControlDiv)||void 0===t?void 0:t.appendChild(e)}})().then((()=>{var i,t,e,s,n;this._isAnimationRunning?(null===(e=this._playButtonSvg)||void 0===e||e.classList.add(u.playAnimation,u.hidden),null===(s=this._pauseButtonSvg)||void 0===s||s.classList.add(u.pauseAnimation)):(null===(i=this._playButtonSvg)||void 0===i||i.classList.add(u.playAnimation),null===(t=this._pauseButtonSvg)||void 0===t||t.classList.add(u.pauseAnimation,u.hidden)),this._currentSelection||null===(n=this._animationControlDiv)||void 0===n||n.classList.add(u.disabled),this._animationControlDiv.addEventListener("click",this._toggleAnimation)}))}_initializeNoDataDiv(){this._noDataDiv=document.createElement("div"),o(this._noDataDiv).style("display","block").attr("class",u.noData).append("div").text("No timeline data"),this._containerNode.appendChild(this._noDataDiv)}setLoadingState(){o(this._noDataDiv).select("div").text("Data loading...")}_initializeGroups(){this._axisGroup=o(this._svg).append("g").attr("class",u.axis),this._barsGroup=o(this._svg).append("g").attr("class",u.bars),this._highlightedBarsGroup=o(this._svg).append("g").attr("class",u.bars),this._brushGroup=o(this._svg).append("g").attr("class",u.brush)}get _barPadding(){return this._barWidth*this._config.barPadding}getCurrentSelection(){return this._currentSelection}getCurrentSelectionInPixels(){return this._currentSelectionInPixels}getBarWidth(){return this._barWidth-this._barPadding}getConfig(){return this._config}getIsAnimationRunning(){return this._isAnimationRunning}setConfig(i){var t,e,s,n,a,o;const h=JSON.parse(JSON.stringify(this._config));this._config.init(null!=i?i:{}),this._config.formatter?(this._timeAxis.tickFormat(this._config.formatter),this._numAxis.tickFormat(this._config.formatter)):(this._timeAxis.tickFormat((i=>d(i,this._isNumericTimeline))),this._numAxis.tickFormat((i=>d(i,this._isNumericTimeline)))),(null===(t=this._config)||void 0===t?void 0:t.showAnimationControls)?(null===(e=this._animationControlDiv)||void 0===e?void 0:e.isConnected)||this._initAnimationControls():this._animationControlDiv&&this._disableAnimation(),this._config.allowSelection||this._disableBrush(),(null===(s=this._config)||void 0===s?void 0:s.dataStep)===(null===(n=h.config)||void 0===n?void 0:n.dataStep)&&(null===(a=this._config)||void 0===a?void 0:a.barCount)===(null===(o=h.config)||void 0===o?void 0:o.barCount)||(this._updateTimelineData(this._timeData),this._updateTimelineData(this._highlightedData,!0)),this.resize()}_parseData(i){if(!i||!i.length)return[];const t=[];if(i[0]instanceof Date)for(const e of i){const i=e instanceof Date?e.getTime():e;isNaN(i)||t.push(this._normalizeTimeToMilliseconds(i))}else for(const e of i)isNaN(e)||t.push(this._normalizeTimeToMilliseconds(e));return t}setTimeData(i,t){if(t&&t[1]<=t[0])return;if(this._highlightedBarsData=[],this._timeData=[],this._currentSelection=void 0,this._brushCurrentSelection(),i&&i.length>1){const t=i[0],e=t instanceof Date&&!isNaN(t.getTime()),s="number"==typeof t&&new Date(t).getFullYear()>1970;this._isNumericTimeline=!e&&!s}const e=this._parseData(i),s=t||h(e),n=s[0]<s[1],a=n&&e.length>1;o(this._animationControlDiv).style("display",a?"flex":"none"),o(this._noDataDiv).style("display",a?"none":"block").select("div").text(n?"No timeline data":"Empty or invalid timeline data"),a&&(this._timeData=e,this._extent=s,this._firstRender=!0),this._updateTimelineData(this._timeData),this._updateScales(),this.render()}setHighlightedData(i){this._timeData&&(this._highlightedData=this._parseData(i),this._highlightedBarsData=[],this._updateTimelineData(this._highlightedData,!0),this._updateBars(!0))}_updateTimelineData(i=[],t=!1){if(this._extent&&(null==i?void 0:i.length)){const e=this._rollup(i);t?this._highlightedBarsData=this._mapDataToBars(e,!0):(this._generateBandIntervals(),this._barsData=this._mapDataToBars(e),this._maxCount=Math.max(...this._barsData.map((i=>i.count))))}else t?this._highlightedBarsData=[]:this._barsData=[]}_generateBandIntervals(){var i;if(!this._extent)return;const t=+this._extent[1]-+this._extent[0],e=null!==(i=this._config.dataStep)&&void 0!==i?i:isFinite(t)&&this._config.barCount>1?Math.abs(t)/(this._config.barCount-1):1;0!==e&&(this._bandIntervals=Array.from({length:this._config.barCount},((i,t)=>+this._extent[0]+t*e)),this._bandIntervals[this._bandIntervals.length-1]=+this._extent[1])}_mapDataToBars(i,t=!1){const e=this._bandIntervals.slice(0,-1).map(((i,t)=>[i,this._bandIntervals[t+1]])),s=e.filter((([i,e])=>{if(!t||!this._currentSelection)return!0;const[s,n]=this._currentSelection;return e>+s&&i<+n})),n=this._countIntervals(i,s),a=new Map(n.map((i=>[`${i.start}-${i.end}`,i.count])));return e.map((([i,t])=>{var e;return{rangeStart:this._isNumericTimeline?i:new Date(i),rangeEnd:this._isNumericTimeline?t:new Date(t),count:null!==(e=a.get(`${i}-${t}`))&&void 0!==e?e:0}}))}_countIntervals(i,t){const e=Array.from(i.keys()).sort(((i,t)=>i-t)),s=new Float64Array(e.length+1);for(let t=0;t<e.length;t++)s[t+1]=s[t]+(i.get(e[t])||0);const n=i=>{let t=0,s=e.length;for(;t<s;){const n=t+s>>>1;e[n]<=i?t=n+1:s=n}return t};return t.map((([i,t])=>{const e=n(i),a=n(t);return{start:i,end:t,count:s[a]-s[e]}}))}_rollup(i){const t=new Map;if(!i.length)return t;for(let e=0;e<i.length;e++){const s=i[e];t.set(s,(t.get(s)||0)+1)}return t}setSelection(i,t=!1){var e,s,n,a,o,h,r;const l=this._currentSelection;if(i&&this._extent){const t=[Math.max(+this._extent[0],Math.min(+i[0],+this._extent[1])),Math.min(+this._extent[1],Math.max(+i[1],+this._extent[0]))];if(t[0]<t[1]){if(this._config.stickySelection){const i=t.map(this._activeAxisScale);this._mapSelection(i)}else this._currentSelection=t;null===(e=this._animationControlDiv)||void 0===e||e.classList.remove(u.disabled)}else this._currentSelection=void 0,null===(s=this._animationControlDiv)||void 0===s||s.classList.add(u.disabled)}else this._currentSelection=void 0,null===(n=this._animationControlDiv)||void 0===n||n.classList.add(u.disabled);t||(null==l?void 0:l[0])===(null===(a=this._currentSelection)||void 0===a?void 0:a[0])&&(null==l?void 0:l[1])===(null===(o=this._currentSelection)||void 0===o?void 0:o[1])||null===(r=(h=this._config.events).onBrush)||void 0===r||r.call(h,this._currentSelection,!0),this._brushCurrentSelection()}_setSelectionInPixels(i){var t,e,s,n,a;if(i){const s=[Math.max(0,Math.min(i[0],this._timelineWidth)),Math.min(this._timelineWidth,Math.max(i[1],0))];s[0]<s[1]?(this._currentSelection=s.map((i=>this._activeAxisScale.invert(i))),null===(t=this._animationControlDiv)||void 0===t||t.classList.remove(u.disabled)):(this._currentSelection=void 0,null===(e=this._animationControlDiv)||void 0===e||e.classList.add(u.disabled))}else this._currentSelection=void 0,null===(s=this._animationControlDiv)||void 0===s||s.classList.add(u.disabled);null===(a=(n=this._config.events).onBrush)||void 0===a||a.call(n,this._currentSelection),this._brushCurrentSelection()}updateDimensions(){const{height:i,width:t}=g(this._containerNode),{offsetWidth:e}=this._animationControlDiv;this._width=t,this._height=i,this._timelineWidth=this._width-this._config.padding.left-this._config.padding.right-e,this._timelineHeight=this._height-this._config.padding.top-this._config.padding.bottom}resize(){this.updateDimensions(),this._timelineHeight>this._config.padding.top+this._config.padding.bottom&&(this._updateScales(),this._checkLastTickPosition(),this._currentSelection&&this.setSelection(this._currentSelection,!0),this.render())}render(){this._firstRender&&(this.updateDimensions(),this._updateScales(),this._checkLastTickPosition()),this._updateBrush(),this._updateBars(),this._updateBars(!0),this._updateAxis(),this._firstRender&&(this._firstRender=!1)}_updateAxis(){this._timeData&&(this._axisGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top+this._config.axisTickHeight+1+this._config.selectionPadding/2}px)`).call(this._isNumericTimeline?this._numAxis:this._timeAxis).call((i=>i.select(".domain").remove())),this._axisGroup.selectAll(".tick").select("text").attr("class",u.axisTick).attr("y",0).attr("dy",-this._config.axisTickHeight).attr("dx","5px"),this._axisGroup.selectAll("line").attr("class",u.axisLine).attr("y2",-this._config.axisTickHeight))}_updateBrush(){if(!this._config.allowSelection||this._timelineHeight<0||this._timelineWidth<0)return void this._brushGroup.selectAll("*").remove();const i=this._timelineHeight-this._config.selectionPadding,t=[[0,this._config.selectionPadding/2],[this._timelineWidth,i+this._config.selectionPadding/2]];this._brushInstance=e().extent(t),this._brushInstance.on("end",(({selection:i,sourceEvent:t})=>{var e,s,n,a,o,h;t&&(i?(this._config.stickySelection?this._mapSelection(i):this._currentSelection=i.map((i=>this._activeAxisScale.invert(i))),null===(e=this._animationControlDiv)||void 0===e||e.classList.remove(u.disabled),null===(n=(s=this._config.events).onBrush)||void 0===n||n.call(s,this._currentSelection)):(this._currentSelection=void 0,null===(o=(a=this._config.events).onBrush)||void 0===o||o.call(a,void 0),null===(h=this._animationControlDiv)||void 0===h||h.classList.add(u.disabled)),this._brushCurrentSelection())})),this._brushGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top}px)`).call(this._brushInstance).call(this._brushInstance.move,this._currentSelectionInPixels||null),this._brushGroup.select("rect.selection").classed(u.selection,!0).attr("rx",this._config.selectionRadius).attr("ry",this._config.selectionRadius)}_updateBars(i=!1){const t=i?this._highlightedBarsGroup:this._barsGroup;t.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top-this._config.selectionPadding/2}px)`);const e=i?.5:1,s=this._createBars(t,i);!i&&this._config.events.onBarHover&&s.on("mouseover",this._config.events.onBarHover),this._animateBars(s,i,e)}_createBars(i,t){return i.selectAll(`.${t?u.highlightedBar:u.bar}`).data(t?this._highlightedBarsData:this._barsData).join("rect").attr("class",t?u.highlightedBar:u.bar).attr("x",(i=>this._activeAxisScale(i.rangeStart)+this._barPadding/2)).attr("width",this.getBarWidth()).attr("rx",this._config.barRadius).attr("ry",this._config.barRadius).attr("y",-this._timelineHeight)}_animateBars(i,t,e){i.transition().duration(this._isAnimationRunning?0:300).attr("height",(i=>t&&0===i.count?0:this._yScale(i.count))).style("opacity",(i=>this._yScale(i.count)===this._config.minBarHeight?.4:e))}_updateScales(){if(!this._extent||!this._barsData.length||this._timelineHeight<0||this._timelineWidth<0)return void this._axisGroup.style("display","none");this._axisGroup.style("display","inherit");const i=this._barsData[this._barsData.length-1];if(this._config.tickStep){const i=r(+this._extent[0],+this._extent[1],this._config.tickStep),t=this._isNumericTimeline?i:i.map((i=>new Date(i)));(this._isNumericTimeline?this._numAxis:this._timeAxis).tickValues(t)}this._yScale.range([this._config.minBarHeight,this._timelineHeight-this._config.barTopMargin-this._config.selectionPadding]).domain([0,this._maxCount]).clamp(!0);const t=[this._extent[0],i.rangeEnd],e=[0,this._timelineWidth],s=this._isNumericTimeline?this._numScale:this._timeScale;s.domain(t),s.range(e),s.clamp(!0),this._activeAxisScale=s;const n=this._barsData[0],a=this._activeAxisScale(n.rangeEnd)-this._activeAxisScale(n.rangeStart);this._barWidth=a}_disableBrush(){var i,t;null===(i=this._brushInstance)||void 0===i||i.clear(this._brushGroup),this._currentSelectionInPixels=void 0,this._currentSelection=void 0,this.pauseAnimation(),this._brushGroup.selectAll("*").remove(),this._config.showAnimationControls&&(null===(t=this._animationControlDiv)||void 0===t||t.classList.add(u.disabled))}_mapSelection(i){if(!this._barsData.length)return;const t=this._activeAxisScale.invert(i[0]),e=this._activeAxisScale.invert(i[1]),s=this._getClosestRange(+t),n=this._getClosestRange(+e,!0);s&&n&&s.rangeStart<=n.rangeEnd&&i[1]-i[0]>this.getBarWidth()/2?this._currentSelection=[s.rangeStart,n.rangeEnd]:this._currentSelection=void 0}_getClosestRange(i,t){return this._barsData.reduce(((e,s)=>{const n=t?e.rangeEnd:e.rangeStart,a=t?s.rangeEnd:s.rangeStart;return Math.abs(+a-+i)<Math.abs(+n-+i)?s:e}))}_brushCurrentSelection(){var i;this._currentSelection?(this._currentSelectionInPixels=this._currentSelection.map(this._activeAxisScale),this._brushInstance&&!this._firstRender&&this._brushGroup.call(this._brushInstance.move,this._currentSelectionInPixels)):(this._currentSelectionInPixels=void 0,null===(i=this._brushInstance)||void 0===i||i.clear(this._brushGroup))}_normalizeTimeToMilliseconds(i){if(i<1e13)return i;const t=10**(Math.floor(Math.log10(i))-12);return Math.round(i/t*1e3)/1e3}}export{m as Timeline};
+import"d3-transition";import{ResizeObserver as i}from"@juggle/resize-observer";import{axisBottom as t}from"d3-axis";import{brushX as e}from"d3-brush";import{scaleSymlog as s,scaleTime as n,scaleLinear as a}from"d3-scale";import{select as o}from"d3-selection";import{extent as h,range as r}from"d3-array";import{play as l,pause as c}from"./assets.js";import{TimelineConfig as _}from"./config.js";export{TimelineConfig}from"./config.js";import{defaultDateFormat as d}from"./format.js";import u from"./style.module.css.js";import{getInnerDimensions as g}from"../../utils.js";class m{constructor(e,o){this._config=new _,this._isAnimationRunning=!1,this._svgParser=new DOMParser,this._height=0,this._width=0,this._timelineWidth=0,this._timelineHeight=0,this._barWidth=0,this._maxCount=0,this._barsData=[],this._highlightedBarsData=[],this._bandIntervals=[],this._isNumericTimeline=!1,this._firstRender=!0,this._yScale=s(),this._timeScale=n(),this._numScale=a(),this._activeAxisScale=this._timeScale,this._timeAxis=t(this._timeScale),this._numAxis=t(this._numScale),this._toggleAnimation=i=>{i.preventDefault(),this._isAnimationRunning?this.pauseAnimation():this.playAnimation()},this._disableAnimation=()=>{var i,t;this.pauseAnimation(),null===(i=this._animationControlDiv)||void 0===i||i.removeEventListener("click",this._toggleAnimation),null===(t=this._animationControlDiv)||void 0===t||t.remove()},this.playAnimation=()=>{var i,t,e,s;clearInterval(this._animationInterval),this._currentSelectionInPixels&&(this._animationInterval=setInterval(this._animateSelection,this._config.animationSpeed),this._isAnimationRunning=!0,null===(t=(i=this._config.events).onAnimationPlay)||void 0===t||t.call(i,this._isAnimationRunning,this._currentSelection)),null===(e=this._pauseButtonSvg)||void 0===e||e.classList.remove(u.hidden),null===(s=this._playButtonSvg)||void 0===s||s.classList.add(u.hidden)},this.pauseAnimation=()=>{var i,t,e,s;clearInterval(this._animationInterval),this._isAnimationRunning=!1,null===(t=(i=this._config.events).onAnimationPause)||void 0===t||t.call(i,this._isAnimationRunning,this._currentSelection),null===(e=this._pauseButtonSvg)||void 0===e||e.classList.add(u.hidden),null===(s=this._playButtonSvg)||void 0===s||s.classList.remove(u.hidden)},this.stopAnimation=()=>{var i,t;this.pauseAnimation(),this.setSelection(void 0),null===(t=(i=this._config.events).onBrush)||void 0===t||t.call(i,void 0)},this._animateSelection=()=>{var i,t;const e=this._currentSelectionInPixels;e&&void 0!==e[0]&&void 0!==e[1]&&(this._setSelectionInPixels([e[0]+this._barWidth,e[1]+this._barWidth]),e[1]!==(null===(i=this._currentSelectionInPixels)||void 0===i?void 0:i[1])&&void 0!==(null===(t=this._currentSelectionInPixels)||void 0===t?void 0:t[1])||this.stopAnimation())},this._checkLastTickPosition=()=>{var i;const t=this._axisGroup.selectAll(".tick:last-of-type").nodes();if(null==t?void 0:t.length){const e=t[0],s=null==e?void 0:e.getBoundingClientRect().right,n=null===(i=this._svg)||void 0===i?void 0:i.getBoundingClientRect().right;e.style.display=s>=n?"none":"inherit"}},this.destroy=()=>{this._containerNode.innerHTML="",clearInterval(this._animationInterval)},o&&this._config.init(o),this._containerNode=e,this._animationControlDiv=document.createElement("div"),this._animationControlDiv.classList.add(u.animationControl),this._initializeSVG(),this._initializeNoDataDiv(),this._initializeGroups(),this._resizeObserver=new i((()=>{this.resize()})),this._resizeObserver.observe(this._containerNode)}_initializeSVG(){this._svg=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._svg.classList.add(u.timelineSvg),this._containerNode.classList.add(u.timeline),this._containerNode.appendChild(this._svg)}async _initAnimationControls(){this._containerNode.insertBefore(this._animationControlDiv,this._svg);await(async()=>{var i,t;if(!this._animationControlDiv.firstChild){const e=this._svgParser.parseFromString(l,"image/svg+xml").firstChild,s=this._svgParser.parseFromString(c,"image/svg+xml").firstChild;this._pauseButtonSvg=null===(i=this._animationControlDiv)||void 0===i?void 0:i.appendChild(s),this._playButtonSvg=null===(t=this._animationControlDiv)||void 0===t?void 0:t.appendChild(e)}})().then((()=>{var i,t,e,s,n;this._isAnimationRunning?(null===(e=this._playButtonSvg)||void 0===e||e.classList.add(u.playAnimation,u.hidden),null===(s=this._pauseButtonSvg)||void 0===s||s.classList.add(u.pauseAnimation)):(null===(i=this._playButtonSvg)||void 0===i||i.classList.add(u.playAnimation),null===(t=this._pauseButtonSvg)||void 0===t||t.classList.add(u.pauseAnimation,u.hidden)),this._currentSelection||null===(n=this._animationControlDiv)||void 0===n||n.classList.add(u.disabled),this._animationControlDiv.addEventListener("click",this._toggleAnimation)}))}_initializeNoDataDiv(){this._noDataDiv=document.createElement("div"),o(this._noDataDiv).style("display","block").attr("class",u.noData).append("div").text("No timeline data"),this._containerNode.appendChild(this._noDataDiv)}setLoadingState(){o(this._noDataDiv).select("div").text("Data loading...")}_initializeGroups(){this._axisGroup=o(this._svg).append("g").attr("class",u.axis),this._barsGroup=o(this._svg).append("g").attr("class",u.bars),this._highlightedBarsGroup=o(this._svg).append("g").attr("class",u.bars),this._brushGroup=o(this._svg).append("g").attr("class",u.brush)}get _barPadding(){return this._barWidth*this._config.barPadding}getCurrentSelection(){return this._currentSelection}getCurrentSelectionInPixels(){return this._currentSelectionInPixels}getBarWidth(){return this._barWidth-this._barPadding}getConfig(){return this._config}getIsAnimationRunning(){return this._isAnimationRunning}setConfig(i){var t,e,s,n,a,o;const h=JSON.parse(JSON.stringify(this._config));this._config.init(null!=i?i:{}),this._config.formatter?(this._timeAxis.tickFormat(this._config.formatter),this._numAxis.tickFormat(this._config.formatter)):(this._timeAxis.tickFormat((i=>d(i,this._isNumericTimeline))),this._numAxis.tickFormat((i=>d(i,this._isNumericTimeline)))),(null===(t=this._config)||void 0===t?void 0:t.showAnimationControls)?(null===(e=this._animationControlDiv)||void 0===e?void 0:e.isConnected)||this._initAnimationControls():this._animationControlDiv&&this._disableAnimation(),this._config.allowSelection||this._disableBrush(),(null===(s=this._config)||void 0===s?void 0:s.dataStep)===(null===(n=h.config)||void 0===n?void 0:n.dataStep)&&(null===(a=this._config)||void 0===a?void 0:a.barCount)===(null===(o=h.config)||void 0===o?void 0:o.barCount)||(this._updateTimelineData(this._timeData),this._updateTimelineData(this._highlightedData,!0)),this.resize()}_parseData(i){if(!i||!i.length)return[];const t=[];if(i[0]instanceof Date)for(const e of i){const i=e instanceof Date?e.getTime():e;isNaN(i)||t.push(this._normalizeTimeToMilliseconds(i))}else for(const e of i)isNaN(e)||t.push(this._normalizeTimeToMilliseconds(e));return t}setTimeData(i,t){if(t&&t[1]<=t[0])return;if(this._highlightedBarsData=[],this._timeData=[],this._currentSelection=void 0,this._brushCurrentSelection(),i&&i.length>1){const t=i[0],e=t instanceof Date&&!isNaN(t.getTime()),s="number"==typeof t&&new Date(t).getFullYear()>1970;this._isNumericTimeline=!e&&!s}const e=this._parseData(i),s=t||h(e),n=s[0]<s[1],a=n&&e.length>1;o(this._animationControlDiv).style("display",a?"flex":"none"),o(this._noDataDiv).style("display",a?"none":"block").select("div").text(n?"No timeline data":"Empty or invalid timeline data"),a&&(this._timeData=e,this._extent=s,this._firstRender=!0),this._updateTimelineData(this._timeData),this._updateScales(),this.render()}setHighlightedData(i){this._timeData&&(this._highlightedData=this._parseData(i),this._highlightedBarsData=[],this._updateTimelineData(this._highlightedData,!0),this._updateBars(!0))}_updateTimelineData(i=[],t=!1){const e=t?"_highlightedBarsData":"_barsData";if(!this._extent||!i.length)return void(this[e]=[]);t||this._generateBandIntervals();const s=new Float64Array(i).sort(),n=this._mapDataToBars(s,t);this[e]=n,t||(this._maxCount=Math.max(...n.map((i=>i.count))))}_generateBandIntervals(){var i;if(!this._extent)return;const t=+this._extent[1]-+this._extent[0],e=null!==(i=this._config.dataStep)&&void 0!==i?i:isFinite(t)&&this._config.barCount>1?Math.abs(t)/(this._config.barCount-1):1;0!==e&&(this._bandIntervals=Array.from({length:this._config.barCount},((i,t)=>+this._extent[0]+t*e)),this._bandIntervals[this._bandIntervals.length-1]=+this._extent[1])}_mapDataToBars(i,t){const e=this._bandIntervals.slice(0,-1).map(((i,t)=>[i,this._bandIntervals[t+1]])),s=this._currentSelection&&t?e.filter((([i,t])=>{const[e,s]=this._currentSelection;return!(i<+e)&&(!(t>=+s)||t>+e&&i<+s)})):e,n=this._countIntervals(i,s);return e.map((([i,t])=>{var e;return{rangeStart:this._isNumericTimeline?i:new Date(i),rangeEnd:this._isNumericTimeline?t:new Date(t),count:null!==(e=n.get(`${i}-${t}`))&&void 0!==e?e:0}}))}_countIntervals(i,t){const e=new Map,s=(t,e,s=0,n=i.length)=>{for(;s<n;){const a=s+n>>>1;i[a]<t||e&&i[a]===t?s=a+1:n=a}return s};return t.forEach((([i,t])=>{const n=s(i,!1),a=s(t,!0);e.set(`${i}-${t}`,a-n)})),e}setSelection(i,t=!1){var e,s,n,a,o,h,r;const l=this._currentSelection;if(i&&this._extent){const t=[Math.max(+this._extent[0],Math.min(+i[0],+this._extent[1])),Math.min(+this._extent[1],Math.max(+i[1],+this._extent[0]))];if(t[0]<t[1]){if(this._config.stickySelection){const i=t.map(this._activeAxisScale);this._mapSelection(i)}else this._currentSelection=t;null===(e=this._animationControlDiv)||void 0===e||e.classList.remove(u.disabled)}else this._currentSelection=void 0,null===(s=this._animationControlDiv)||void 0===s||s.classList.add(u.disabled)}else this._currentSelection=void 0,null===(n=this._animationControlDiv)||void 0===n||n.classList.add(u.disabled);t||(null==l?void 0:l[0])===(null===(a=this._currentSelection)||void 0===a?void 0:a[0])&&(null==l?void 0:l[1])===(null===(o=this._currentSelection)||void 0===o?void 0:o[1])||null===(r=(h=this._config.events).onBrush)||void 0===r||r.call(h,this._currentSelection,!0),this._brushCurrentSelection()}_setSelectionInPixels(i){var t,e,s,n,a;if(i){const s=[Math.max(0,Math.min(i[0],this._timelineWidth)),Math.min(this._timelineWidth,Math.max(i[1],0))];s[0]<s[1]?(this._currentSelection=s.map((i=>this._activeAxisScale.invert(i))),null===(t=this._animationControlDiv)||void 0===t||t.classList.remove(u.disabled)):(this._currentSelection=void 0,null===(e=this._animationControlDiv)||void 0===e||e.classList.add(u.disabled))}else this._currentSelection=void 0,null===(s=this._animationControlDiv)||void 0===s||s.classList.add(u.disabled);null===(a=(n=this._config.events).onBrush)||void 0===a||a.call(n,this._currentSelection),this._brushCurrentSelection()}updateDimensions(){const{height:i,width:t}=g(this._containerNode),{offsetWidth:e}=this._animationControlDiv;this._width=t,this._height=i,this._timelineWidth=this._width-this._config.padding.left-this._config.padding.right-e,this._timelineHeight=this._height-this._config.padding.top-this._config.padding.bottom}resize(){this.updateDimensions(),this._timelineHeight>this._config.padding.top+this._config.padding.bottom&&(this._updateScales(),this._checkLastTickPosition(),this._currentSelection&&this.setSelection(this._currentSelection,!0),this.render())}render(){this._firstRender&&(this.updateDimensions(),this._updateScales(),this._checkLastTickPosition()),this._updateBrush(),this._updateBars(),this._updateBars(!0),this._updateAxis(),this._firstRender&&(this._firstRender=!1)}_updateAxis(){this._timeData&&(this._axisGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top+this._config.axisTickHeight+1+this._config.selectionPadding/2}px)`).call(this._isNumericTimeline?this._numAxis:this._timeAxis).call((i=>i.select(".domain").remove())),this._axisGroup.selectAll(".tick").select("text").attr("class",u.axisTick).attr("y",0).attr("dy",-this._config.axisTickHeight).attr("dx","5px"),this._axisGroup.selectAll("line").attr("class",u.axisLine).attr("y2",-this._config.axisTickHeight))}_updateBrush(){if(!this._config.allowSelection||this._timelineHeight<0||this._timelineWidth<0)return void this._brushGroup.selectAll("*").remove();const i=this._timelineHeight-this._config.selectionPadding,t=[[0,this._config.selectionPadding/2],[this._timelineWidth,i+this._config.selectionPadding/2]];this._brushInstance=e().extent(t),this._brushInstance.on("end",(({selection:i,sourceEvent:t})=>{var e,s,n,a,o,h;t&&(i?(this._config.stickySelection?this._mapSelection(i):this._currentSelection=i.map((i=>this._activeAxisScale.invert(i))),null===(e=this._animationControlDiv)||void 0===e||e.classList.remove(u.disabled),null===(n=(s=this._config.events).onBrush)||void 0===n||n.call(s,this._currentSelection)):(this._currentSelection=void 0,null===(o=(a=this._config.events).onBrush)||void 0===o||o.call(a,void 0),null===(h=this._animationControlDiv)||void 0===h||h.classList.add(u.disabled)),this._brushCurrentSelection())})),this._brushGroup.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top}px)`).call(this._brushInstance).call(this._brushInstance.move,this._currentSelectionInPixels||null),this._brushGroup.select("rect.selection").classed(u.selection,!0).attr("rx",this._config.selectionRadius).attr("ry",this._config.selectionRadius)}_updateBars(i=!1){const t=i?this._highlightedBarsGroup:this._barsGroup;t.style("transform",`translate(${this._config.padding.left}px, ${this._config.padding.top-this._config.selectionPadding/2}px)`);const e=i?.5:1,s=this._createBars(t,i);!i&&this._config.events.onBarHover&&s.on("mouseover",this._config.events.onBarHover),this._animateBars(s,i,e)}_createBars(i,t){return i.selectAll(`.${t?u.highlightedBar:u.bar}`).data(t?this._highlightedBarsData:this._barsData).join("rect").attr("class",t?u.highlightedBar:u.bar).attr("x",(i=>this._activeAxisScale(i.rangeStart)+this._barPadding/2)).attr("width",this.getBarWidth()).attr("rx",this._config.barRadius).attr("ry",this._config.barRadius).attr("y",-this._timelineHeight)}_animateBars(i,t,e){i.transition().duration(this._isAnimationRunning?0:300).attr("height",(i=>t&&0===i.count?0:this._yScale(i.count))).style("opacity",(i=>this._yScale(i.count)===this._config.minBarHeight?.4:e))}_updateScales(){if(!this._extent||!this._barsData.length||this._timelineHeight<0||this._timelineWidth<0)return void this._axisGroup.style("display","none");this._axisGroup.style("display","inherit");const i=this._barsData[this._barsData.length-1];if(this._config.tickStep){const i=r(+this._extent[0],+this._extent[1],this._config.tickStep),t=this._isNumericTimeline?i:i.map((i=>new Date(i)));(this._isNumericTimeline?this._numAxis:this._timeAxis).tickValues(t)}this._yScale.range([this._config.minBarHeight,this._timelineHeight-this._config.barTopMargin-this._config.selectionPadding]).domain([0,this._maxCount]).clamp(!0);const t=[this._extent[0],i.rangeEnd],e=[0,this._timelineWidth],s=this._isNumericTimeline?this._numScale:this._timeScale;s.domain(t),s.range(e),s.clamp(!0),this._activeAxisScale=s;const n=this._barsData[0],a=this._activeAxisScale(n.rangeEnd)-this._activeAxisScale(n.rangeStart);this._barWidth=a}_disableBrush(){var i,t;null===(i=this._brushInstance)||void 0===i||i.clear(this._brushGroup),this._currentSelectionInPixels=void 0,this._currentSelection=void 0,this.pauseAnimation(),this._brushGroup.selectAll("*").remove(),this._config.showAnimationControls&&(null===(t=this._animationControlDiv)||void 0===t||t.classList.add(u.disabled))}_mapSelection(i){if(!this._barsData.length)return;const t=this._activeAxisScale.invert(i[0]),e=this._activeAxisScale.invert(i[1]),s=this._getClosestRange(+t),n=this._getClosestRange(+e,!0);s&&n&&s.rangeStart<=n.rangeEnd&&i[1]-i[0]>this.getBarWidth()/2?this._currentSelection=[s.rangeStart,n.rangeEnd]:this._currentSelection=void 0}_getClosestRange(i,t){return this._barsData.reduce(((e,s)=>{const n=t?e.rangeEnd:e.rangeStart,a=t?s.rangeEnd:s.rangeStart;return Math.abs(+a-+i)<Math.abs(+n-+i)?s:e}))}_brushCurrentSelection(){var i;this._currentSelection?(this._currentSelectionInPixels=this._currentSelection.map(this._activeAxisScale),this._brushInstance&&!this._firstRender&&this._brushGroup.call(this._brushInstance.move,this._currentSelectionInPixels)):(this._currentSelectionInPixels=void 0,null===(i=this._brushInstance)||void 0===i||i.clear(this._brushGroup))}_normalizeTimeToMilliseconds(i){if(i<1e13)return i;const t=10**(Math.floor(Math.log10(i))-12);return Math.round(i/t*1e3)/1e3}}export{m as Timeline};
 //# sourceMappingURL=index.js.map

modules/timeline/types.d.ts

@@ -8,6 +8,6 @@ export type Padding = {
 export type BarData = {
-    rangeStart: number;
-    rangeEnd: number;
+    rangeStart: number | Date;
+    rangeEnd: number | Date;
     count: number;
 };
 export type BarsData = BarData[];

package.json

 {
   "name": "@cosmograph/ui",
-  "version": "2.0.0-beta.11",
+  "version": "2.0.0-beta.12",
   "description": "Cosmograph UI Components",
@@ -5,0 +5,0 @@ "author": "cosmograph-org",

No alert changes

Improved metrics

Lines of code

1435

increased by0.07%

Worsened metrics

Total package byte prevSize

349657

decreased by-0.69%

No dependency changes