@internetarchive/histogram-date-range 1.2.1-alpha.1 → 1.2.2-alpha-webdev7377.0

package/dist/demo/js/app-root.js

@@ -1,26 +1,26 @@
-import { __decorate } from "tslib";
-import { LitElement, html } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
-import '../../src/histogram-date-range';
-/**
- * This is mainly to test the histogram-date-range within
- * a lit-element.
- */
-let AppRoot = class AppRoot extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.dataSource = {
-            minDate: 1955,
-            maxDate: 2000,
-            minSelectedDate: 1955,
-            maxSelectedDate: 2000,
-            bins: [
-                1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
-            ],
-        };
-    }
-    render() {
-        var _a, _b, _c, _d, _e;
+import { __decorate } from "tslib";
+import { LitElement, html } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import '../../src/histogram-date-range';
+/**
+ * This is mainly to test the histogram-date-range within
+ * a lit-element.
+ */
+let AppRoot = class AppRoot extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.dataSource = {
+            minDate: 1955,
+            maxDate: 2000,
+            minSelectedDate: 1955,
+            maxSelectedDate: 2000,
+            bins: [
+                1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
+            ],
+        };
+    }
+    render() {
+        var _a, _b, _c, _d, _e;
         return html `
       <histogram-date-range
         .minDate=${(_a = this.dataSource) === null || _a === void 0 ? void 0 : _a.minDate}
@@ -32,27 +32,27 @@ let AppRoot = class AppRoot extends LitElement {
       ></histogram-date-range>
 
       <button @click=${this.randomize}>Randomize</button>
-    `;
-    }
-    randomize() {
-        const minDate = Math.round(Math.random() * 1000);
-        const maxDate = minDate + Math.round(Math.random() * 1000);
-        // generate random bins
-        const bins = Array.from({ length: 20 }, () => Math.floor(Math.random() * minDate));
-        this.dataSource = {
-            minDate,
-            maxDate,
-            minSelectedDate: minDate,
-            maxSelectedDate: maxDate,
-            bins: bins,
-        };
-    }
-};
-__decorate([
-    state()
-], AppRoot.prototype, "dataSource", void 0);
-AppRoot = __decorate([
-    customElement('app-root')
-], AppRoot);
-export { AppRoot };
+    `;
+    }
+    randomize() {
+        const minDate = Math.round(Math.random() * 1000);
+        const maxDate = minDate + Math.round(Math.random() * 1000);
+        // generate random bins
+        const bins = Array.from({ length: 20 }, () => Math.floor(Math.random() * minDate));
+        this.dataSource = {
+            minDate,
+            maxDate,
+            minSelectedDate: minDate,
+            maxSelectedDate: maxDate,
+            bins: bins,
+        };
+    }
+};
+__decorate([
+    state()
+], AppRoot.prototype, "dataSource", void 0);
+AppRoot = __decorate([
+    customElement('app-root')
+], AppRoot);
+export { AppRoot };
 //# sourceMappingURL=app-root.js.map

package/dist/index.d.ts

@@ -1 +1 @@
-export { HistogramDateRange } from './src/histogram-date-range';
+export { HistogramDateRange } from './src/histogram-date-range';

package/dist/index.js

@@ -1,2 +1,2 @@
-export { HistogramDateRange } from './src/histogram-date-range';
+export { HistogramDateRange } from './src/histogram-date-range';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["export { HistogramDateRange } from './src/histogram-date-range';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["export { HistogramDateRange } from './src/histogram-date-range';\r\n"]}

package/dist/src/histogram-date-range.d.ts

@@ -1,159 +1,166 @@
-import { LitElement, PropertyValues, SVGTemplateResult, TemplateResult } from 'lit';
-import '@internetarchive/ia-activity-indicator';
-export declare class HistogramDateRange extends LitElement {
-    width: number;
-    height: number;
-    sliderWidth: number;
-    tooltipWidth: number;
-    tooltipHeight: number;
-    updateDelay: number;
-    dateFormat: string;
-    missingDataMessage: string;
-    minDate: string;
-    maxDate: string;
-    disabled: boolean;
-    bins: number[];
-    /** If true, update events will not be canceled by the date inputs receiving focus */
-    updateWhileFocused: boolean;
-    private _tooltipOffset;
-    private _tooltipContent?;
-    private _tooltipVisible;
-    private _isDragging;
-    private _isLoading;
-    private _minSelectedDate;
-    private _maxSelectedDate;
-    private _minDateMS;
-    private _maxDateMS;
-    private _dragOffset;
-    private _histWidth;
-    private _binWidth;
-    private _currentSlider?;
-    private _histData;
-    private _emitUpdatedEventTimer?;
-    private _previousDateRange;
-    disconnectedCallback(): void;
-    updated(changedProps: PropertyValues): void;
-    /**
-     * Set private properties that depend on the attribute bin data
-     *
-     * We're caching these values and not using getters to avoid recalculating all
-     * of the hist data every time the user drags a slider or hovers over a bar
-     * creating a tooltip.
-     */
-    private handleDataUpdate;
-    private calculateHistData;
-    private get hasBinData();
-    private get _numBins();
-    private get histogramLeftEdgeX();
-    private get histogramRightEdgeX();
-    /** component's loading (and disabled) state */
-    get loading(): boolean;
-    set loading(value: boolean);
-    /** formatted minimum date of selected date range */
-    get minSelectedDate(): string;
-    /** updates minSelectedDate if new date is valid */
-    set minSelectedDate(rawDate: string);
-    /** formatted maximum date of selected date range */
-    get maxSelectedDate(): string;
-    /** updates maxSelectedDate if new date is valid */
-    set maxSelectedDate(rawDate: string);
-    /** horizontal position of min date slider */
-    get minSliderX(): number;
-    /** horizontal position of max date slider */
-    get maxSliderX(): number;
-    private get dateRangeMS();
-    private showTooltip;
-    private hideTooltip;
-    private drag;
-    private drop;
-    /**
-     * Adjust the date range based on slider movement
-     *
-     * @param e PointerEvent from the slider being moved
-     */
-    private move;
-    /**
-     * Constrain a proposed value for the minimum (left) slider
-     *
-     * If the value is less than the leftmost valid position, then set it to the
-     * left edge of the histogram (ie the slider width). If the value is greater
-     * than the rightmost valid position (the position of the max slider), then
-     * set it to the position of the max slider
-     */
-    private validMinSliderX;
-    /**
-     * Constrain a proposed value for the maximum (right) slider
-     *
-     * If the value is greater than the rightmost valid position, then set it to
-     * the right edge of the histogram (ie histogram width - slider width). If the
-     * value is less than the leftmost valid position (the position of the min
-     * slider), then set it to the position of the min slider
-     */
-    private validMaxSliderX;
-    private addListeners;
-    private removeListeners;
-    /**
-     * start a timer to emit an update event. this timer can be canceled (and the
-     * event not emitted) if user drags a slider or focuses a date input within
-     * the update delay
-     */
-    private beginEmitUpdateProcess;
-    private cancelPendingUpdateEvent;
-    /**
-     * find position of pointer in relation to the current slider
-     */
-    private setDragOffset;
-    /**
-     * @param x horizontal position of slider
-     * @returns string representation of date
-     */
-    private translatePositionToDate;
-    /**
-     * Returns slider x-position corresponding to given date
-     *
-     * @param date
-     * @returns x-position of slider
-     */
-    private translateDateToPosition;
-    /** ensure that the returned value is between minValue and maxValue */
-    private clamp;
-    private handleInputFocus;
-    private handleMinDateInput;
-    private handleMaxDateInput;
-    private handleKeyUp;
-    private get currentDateRangeString();
-    private getMSFromString;
-    /**
-     * expand or narrow the selected range by moving the slider nearest the
-     * clicked bar to the outer edge of the clicked bar
-     *
-     * @param e Event click event from a histogram bar
-     */
-    private handleBarClick;
-    private get minSliderTemplate();
-    private get maxSliderTemplate();
-    private generateSliderSVG;
-    get selectedRangeTemplate(): SVGTemplateResult;
-    get histogramTemplate(): SVGTemplateResult[];
-    private formatDate;
-    /**
-     * NOTE: we are relying on the lit `live` directive in the template to
-     * ensure that the change to minSelectedDate is noticed and the input value
-     * gets properly re-rendered. see
-     * https://lit.dev/docs/templates/directives/#live
-     */
-    get minInputTemplate(): TemplateResult;
-    get maxInputTemplate(): TemplateResult;
-    get minLabelTemplate(): TemplateResult;
-    get maxLabelTemplate(): TemplateResult;
-    get tooltipTemplate(): TemplateResult;
-    private get noDataTemplate();
-    private get activityIndicatorTemplate();
-    static styles: import("lit").CSSResult;
-    render(): TemplateResult;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'histogram-date-range': HistogramDateRange;
-    }
-}
+import '@internetarchive/ia-activity-indicator';
+import { LitElement, PropertyValues, SVGTemplateResult, TemplateResult } from 'lit';
+export declare class HistogramDateRange extends LitElement {
+    width: number;
+    height: number;
+    sliderWidth: number;
+    tooltipWidth: number;
+    tooltipHeight: number;
+    updateDelay: number;
+    dateFormat: string;
+    /** Optional; falls back to `dateFormat` if not provided */
+    tooltipDateFormat?: string;
+    missingDataMessage: string;
+    minDate: string;
+    maxDate: string;
+    disabled: boolean;
+    bins: number[];
+    /** If true, update events will not be canceled by the date inputs receiving focus */
+    updateWhileFocused: boolean;
+    private _tooltipOffset;
+    private _tooltipContent?;
+    private _tooltipVisible;
+    private _isDragging;
+    private _isLoading;
+    private _minSelectedDate;
+    private _maxSelectedDate;
+    private _minDateMS;
+    private _maxDateMS;
+    private _dragOffset;
+    private _histWidth;
+    private _binWidth;
+    private _currentSlider?;
+    private _histData;
+    private _emitUpdatedEventTimer?;
+    private _previousDateRange;
+    disconnectedCallback(): void;
+    willUpdate(changedProps: PropertyValues): void;
+    /**
+     * Set private properties that depend on the attribute bin data
+     *
+     * We're caching these values and not using getters to avoid recalculating all
+     * of the hist data every time the user drags a slider or hovers over a bar
+     * creating a tooltip.
+     */
+    private handleDataUpdate;
+    private calculateHistData;
+    private get hasBinData();
+    private get _numBins();
+    private get histogramLeftEdgeX();
+    private get histogramRightEdgeX();
+    /**
+     * Returns the consumer-specified tooltip date format if set, falling back to
+     * the general `dateFormat` property and then the default format if none is set.
+     */
+    private get resolvedTooltipDateFormat();
+    /** component's loading (and disabled) state */
+    get loading(): boolean;
+    set loading(value: boolean);
+    /** formatted minimum date of selected date range */
+    get minSelectedDate(): string;
+    /** updates minSelectedDate if new date is valid */
+    set minSelectedDate(rawDate: string);
+    /** formatted maximum date of selected date range */
+    get maxSelectedDate(): string;
+    /** updates maxSelectedDate if new date is valid */
+    set maxSelectedDate(rawDate: string);
+    /** horizontal position of min date slider */
+    get minSliderX(): number;
+    /** horizontal position of max date slider */
+    get maxSliderX(): number;
+    private get dateRangeMS();
+    private showTooltip;
+    private hideTooltip;
+    private drag;
+    private drop;
+    /**
+     * Adjust the date range based on slider movement
+     *
+     * @param e PointerEvent from the slider being moved
+     */
+    private move;
+    /**
+     * Constrain a proposed value for the minimum (left) slider
+     *
+     * If the value is less than the leftmost valid position, then set it to the
+     * left edge of the histogram (ie the slider width). If the value is greater
+     * than the rightmost valid position (the position of the max slider), then
+     * set it to the position of the max slider
+     */
+    private validMinSliderX;
+    /**
+     * Constrain a proposed value for the maximum (right) slider
+     *
+     * If the value is greater than the rightmost valid position, then set it to
+     * the right edge of the histogram (ie histogram width - slider width). If the
+     * value is less than the leftmost valid position (the position of the min
+     * slider), then set it to the position of the min slider
+     */
+    private validMaxSliderX;
+    private addListeners;
+    private removeListeners;
+    /**
+     * start a timer to emit an update event. this timer can be canceled (and the
+     * event not emitted) if user drags a slider or focuses a date input within
+     * the update delay
+     */
+    private beginEmitUpdateProcess;
+    private cancelPendingUpdateEvent;
+    /**
+     * find position of pointer in relation to the current slider
+     */
+    private setDragOffset;
+    /**
+     * @param x horizontal position of slider
+     * @returns string representation of date
+     */
+    private translatePositionToDate;
+    /**
+     * Returns slider x-position corresponding to given date
+     *
+     * @param date
+     * @returns x-position of slider
+     */
+    private translateDateToPosition;
+    /** ensure that the returned value is between minValue and maxValue */
+    private clamp;
+    private handleInputFocus;
+    private handleMinDateInput;
+    private handleMaxDateInput;
+    private handleKeyUp;
+    private get currentDateRangeString();
+    private getMSFromString;
+    /**
+     * expand or narrow the selected range by moving the slider nearest the
+     * clicked bar to the outer edge of the clicked bar
+     *
+     * @param e Event click event from a histogram bar
+     */
+    private handleBarClick;
+    private get minSliderTemplate();
+    private get maxSliderTemplate();
+    private generateSliderSVG;
+    get selectedRangeTemplate(): SVGTemplateResult;
+    get histogramTemplate(): SVGTemplateResult[];
+    private formatDate;
+    /**
+     * NOTE: we are relying on the lit `live` directive in the template to
+     * ensure that the change to minSelectedDate is noticed and the input value
+     * gets properly re-rendered. see
+     * https://lit.dev/docs/templates/directives/#live
+     */
+    get minInputTemplate(): TemplateResult;
+    get maxInputTemplate(): TemplateResult;
+    get minLabelTemplate(): TemplateResult;
+    get maxLabelTemplate(): TemplateResult;
+    get tooltipTemplate(): TemplateResult;
+    private get noDataTemplate();
+    private get activityIndicatorTemplate();
+    static styles: import("lit").CSSResult;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'histogram-date-range': HistogramDateRange;
+    }
+}