Comparison periods

Analytics screens compare a range with an earlier one. comparisonRange returns that period:

import { comparisonRange, parseIso, toIso, formatDateRange } from '@devix-labs/date-range-picker';

const { start, end } = picker.getRange();
const [a, b] = comparisonRange(parseIso(start), parseIso(end), 'previousPeriod');

toIso(a); // start of the previous period
formatDateRange(a, b, 'en-GB'); // "30 Aug – 5 Sept 2026"

For partial periods, the comparison has the same number of days as the range and ends the day before it starts. Whole calendar months compare with whole months, so June is compared with May's 31 days, not the 30 days before 1 June.

Keeping the URL in sync#

const picker = createDateRangePicker(input, {
  ...Object.fromEntries(new URLSearchParams(location.search)), // ?start=2026-09-12&end=2026-09-18
  onChange: ({ start, end }) => history.replaceState(null, '', `?start=${start}&end=${end}`),
});