Date range
Required range with Until left open
Required range with From left open
Required range with either end left open
Comparing seasons
Nights from the first day to the last.
Type both days, such as 12 May and 16 May.
Month grain on Date range
Date filter on or after a day
Date filter on or before a day
Date filter between two days
Cannot be changed
Only the owner can change this.
Source
<div data-kit-role="form-group" id="range-period">
<fieldset>
<legend id="range-period-label">Period</legend>
<div data-kit-dates='{"direction":"backward","firstDay":"mon","last":"2025-04-09","locale":"en-GB","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2025-04-09"}' data-kit-role="date-range" id="range-period-control-date-range">
<span data-kit-region="end"><label for="range-period-control" hidden>From</label><label for="range-period-control">Dates</label><input id="range-period-control" data-kit-region="first" type="text" autocomplete="off" value="Last 30 days" aria-describedby="range-period-control-resolved range-period-control-preset-dates" aria-expanded="false" aria-controls="range-period-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span><span data-kit-region="preset-names" aria-hidden="true">Today
Last 7 days
Last 30 days
Month to date
Last month
Year to date</span></span>
<span data-kit-region="end"><label for="range-period-control-last">Until</label><input id="range-period-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="range-period-control-resolved" hidden><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span></span>
<span id="range-period-control-preset-dates" data-kit-region="preset-dates"><time datetime="2025-04-09/2025-04-09" aria-hidden="true">9 April 2025</time><time datetime="2025-04-03/2025-04-09" aria-hidden="true"><span>3 – </span><wbr><span>9 April 2025</span></time><time datetime="2025-03-11/2025-04-09"><span>11 March – </span><wbr><span>9 April 2025</span></time><time datetime="2025-04-01/2025-04-09" aria-hidden="true"><span>1 – </span><wbr><span>9 April 2025</span></time><time datetime="2025-03-01/2025-03-31" aria-hidden="true">March 2025</time><time datetime="2025-01-01/2025-04-09" aria-hidden="true"><span>1 January – </span><wbr><span>9 April 2025</span></time></span>
<span id="range-period-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="range-period-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="period[first]" value="2025-03-11">
<input type="hidden" name="period[last]" value="2025-04-09">
<input type="hidden" name="period[preset]" value="last_30_days">
<input type="hidden" name="period[compare]" value="previous_period">
<input type="hidden" name="period[compare_first]" value="2025-02-09">
<input type="hidden" name="period[compare_last]" value="2025-03-10">
<div data-kit-role="popover" id="range-period-control-layer" popover="manual" data-kit-region="presets-and-months">
<ul data-kit-region="presets">
<li>
<button type="button" value="today">
<span data-kit-region="name">Today</span>
<time datetime="2025-04-09/2025-04-09">9 April 2025</time>
</button>
</li><li>
<button type="button" value="last_7_days">
<span data-kit-region="name">Last 7 days</span>
<time datetime="2025-04-03/2025-04-09"><span>3 – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button aria-current="true" type="button" value="last_30_days">
<span data-kit-region="name">Last 30 days</span>
<time datetime="2025-03-11/2025-04-09"><span>11 March – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button type="button" value="month_to_date">
<span data-kit-region="name">Month to date</span>
<time datetime="2025-04-01/2025-04-09"><span>1 – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button type="button" value="last_month">
<span data-kit-region="name">Last month</span>
<time datetime="2025-03-01/2025-03-31">March 2025</time>
</button>
</li><li>
<button type="button" value="year_to_date">
<span data-kit-region="name">Year to date</span>
<time datetime="2025-01-01/2025-04-09"><span>1 January – </span><wbr><span>9 April 2025</span></time>
</button>
</li>
</ul>
<div id="range-period-control-months" data-kit-region="months"></div>
<div data-kit-region="compare">
<span id="range-period-control-compare">Compare</span>
<ul aria-labelledby="range-period-control-compare">
<li>
<button type="button" value="previous_period" aria-current="true">
<span data-kit-region="name">Previous period</span>
<time datetime="2025-02-09/2025-03-10"><span>9 February – </span><wbr><span>10 March 2025</span></time>
</button>
</li><li>
<button type="button" value="previous_year">
<span data-kit-region="name">Same period last year</span>
<time datetime="2024-03-11/2024-04-09"><span>11 March – </span><wbr><span>9 April 2024</span></time>
</button>
</li><li>
<button type="button" value="none">
<span data-kit-region="name">None</span>
</button>
</li>
</ul>
</div>
</div>
</div>
</fieldset>
</div>
<div data-kit-role="form-group" id="range-required-last">
<fieldset>
<legend id="range-required-last-label">Period</legend>
<div data-kit-role="date-range" id="range-required-last-control-date-range" data-kit-dates='{"direction":"either","firstDay":"mon","locale":"en-GB","openEnd":true,"openEnds":"last","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}'>
<span data-kit-region="end"><label for="range-required-last-control">From</label><label for="range-required-last-control" hidden>Dates</label><input id="range-required-last-control" data-kit-region="first" type="text" autocomplete="off" value="1 September 2026" aria-describedby="range-required-last-control-resolved" required aria-expanded="false" aria-controls="range-required-last-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span data-kit-region="end"><label for="range-required-last-control-last">Until</label><input id="range-required-last-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="range-required-last-control-resolved"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="range-required-last-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="range-required-last-control-resolved" data-kit-region="resolved" aria-live="polite">From 1 September 2026</span>
<button type="button" id="range-required-last-control-calendar" data-kit-role="icon-action" data-kit-region="calendar" aria-label="Calendar"><svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg></button>
<input type="hidden" name="required_last[first]" value="2026-09-01">
<input type="hidden" name="required_last[last]" value="">
<input type="hidden" name="required_last[preset]" value="">
<div data-kit-role="popover" id="range-required-last-control-layer" popover="manual" data-kit-region="presets-and-months"><div id="range-required-last-control-months" data-kit-region="months"></div></div>
</div>
</fieldset>
</div>
<div data-kit-role="form-group" id="range-required-first">
<fieldset>
<legend id="range-required-first-label">Period</legend>
<div data-kit-role="date-range" id="range-required-first-control-date-range" data-kit-dates='{"direction":"either","firstDay":"mon","locale":"en-GB","openEnd":true,"openEnds":"first","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}'>
<span data-kit-region="end"><label for="range-required-first-control">From</label><label for="range-required-first-control" hidden>Dates</label><input id="range-required-first-control" data-kit-region="first" type="text" autocomplete="off" value="" aria-describedby="range-required-first-control-resolved" aria-expanded="false" aria-controls="range-required-first-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span data-kit-region="end"><label for="range-required-first-control-last">Until</label><input id="range-required-first-control-last" data-kit-region="last" type="text" autocomplete="off" value="30 September 2026" aria-describedby="range-required-first-control-resolved" required><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="range-required-first-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="range-required-first-control-resolved" data-kit-region="resolved" aria-live="polite">Until 30 September 2026</span>
<button type="button" id="range-required-first-control-calendar" data-kit-role="icon-action" data-kit-region="calendar" aria-label="Calendar"><svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg></button>
<input type="hidden" name="required_first[first]" value="">
<input type="hidden" name="required_first[last]" value="2026-09-30">
<input type="hidden" name="required_first[preset]" value="">
<div data-kit-role="popover" id="range-required-first-control-layer" popover="manual" data-kit-region="presets-and-months"><div id="range-required-first-control-months" data-kit-region="months"></div></div>
</div>
</fieldset>
</div>
<div data-kit-role="form-group" id="range-required-either">
<fieldset>
<legend id="range-required-either-label">Period</legend>
<div data-kit-role="date-range" id="range-required-either-control-date-range" data-kit-dates='{"direction":"either","firstDay":"mon","locale":"en-GB","openEnd":true,"openEnds":"either","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}'>
<span data-kit-region="end"><label for="range-required-either-control">From</label><label for="range-required-either-control" hidden>Dates</label><input id="range-required-either-control" data-kit-region="first" type="text" autocomplete="off" value="" aria-describedby="range-required-either-control-resolved range-required-either-control-required" aria-expanded="false" aria-controls="range-required-either-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span data-kit-region="end"><label for="range-required-either-control-last">Until</label><input id="range-required-either-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="range-required-either-control-resolved range-required-either-control-required"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="range-required-either-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="range-required-either-control-required" hidden>Enter at least one date.</span>
<span id="range-required-either-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button type="button" id="range-required-either-control-calendar" data-kit-role="icon-action" data-kit-region="calendar" aria-label="Calendar"><svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg></button>
<input type="hidden" name="required_either[first]" value="">
<input type="hidden" name="required_either[last]" value="">
<input type="hidden" name="required_either[preset]" value="">
<div data-kit-role="popover" id="range-required-either-control-layer" popover="manual" data-kit-region="presets-and-months"><div id="range-required-either-control-months" data-kit-region="months"></div></div>
</div>
</fieldset>
</div>
<div data-kit-role="form-group" id="range-seasons">
<fieldset>
<legend id="range-seasons-label">Period</legend>
<div data-kit-role="date-range" id="range-seasons-control-date-range" data-kit-dates='{"comparisons":{"previousPeriod":"2026-04-20/2026-07-10","previousYear":"2025-09-08/2025-12-20"},"direction":"backward","firstDay":"mon","locale":"en-GB","presetComparisons":{"autumn":{"previousPeriod":"2026-04-20/2026-07-10","previousYear":"2025-09-08/2025-12-20"},"summer":{"previousPeriod":"2026-01-12/2026-03-27","previousYear":"2025-04-21/2025-07-18"}},"quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-12-18"}'>
<span data-kit-region="end"><label for="range-seasons-control" hidden>From</label><label for="range-seasons-control">Dates</label><input id="range-seasons-control" data-kit-region="first" type="text" autocomplete="off" value="Autumn season" aria-describedby="range-seasons-control-resolved range-seasons-control-preset-dates" aria-expanded="false" aria-controls="range-seasons-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span><span data-kit-region="preset-names" aria-hidden="true">Autumn season
Summer season</span></span>
<span data-kit-region="end"><label for="range-seasons-control-last">Until</label><input id="range-seasons-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="range-seasons-control-resolved" hidden><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="range-seasons-control-preset-dates" data-kit-region="preset-dates"><time datetime="2026-09-01/2026-12-18"><span>1 September – </span><wbr><span>18 December 2026</span></time><time datetime="2026-04-20/2026-07-10" aria-hidden="true"><span>20 April – </span><wbr><span>10 July 2026</span></time></span>
<span id="range-seasons-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="range-seasons-control-calendar" type="button"><svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg></button>
<input type="hidden" name="season[first]" value="2026-09-01">
<input type="hidden" name="season[last]" value="2026-12-18">
<input type="hidden" name="season[preset]" value="autumn">
<input type="hidden" name="season[compare]" value="previous_period">
<input type="hidden" name="season[compare_first]" value="2026-04-20">
<input type="hidden" name="season[compare_last]" value="2026-07-10">
<div data-kit-role="popover" id="range-seasons-control-layer" popover="manual" data-kit-region="presets-and-months">
<ul data-kit-region="presets">
<li><button type="button" value="autumn" aria-current="true"><span data-kit-region="name">Autumn season</span><time datetime="2026-09-01/2026-12-18"><span>1 September – </span><wbr><span>18 December 2026</span></time></button></li>
<li><button type="button" value="summer"><span data-kit-region="name">Summer season</span><time datetime="2026-04-20/2026-07-10"><span>20 April – </span><wbr><span>10 July 2026</span></time></button></li>
</ul>
<div id="range-seasons-control-months" data-kit-region="months"></div>
<div data-kit-region="compare">
<span id="range-seasons-control-compare">Compare</span>
<ul aria-labelledby="range-seasons-control-compare">
<li><button type="button" value="previous_period" aria-current="true"><span data-kit-region="name">Previous period</span><time datetime="2026-04-20/2026-07-10"><span>20 April – </span><wbr><span>10 July 2026</span></time></button></li>
<li><button type="button" value="previous_year"><span data-kit-region="name">Same period last year</span><time datetime="2025-09-08/2025-12-20"><span>8 September – </span><wbr><span>20 December 2025</span></time></button></li>
<li><button type="button" value="none"><span data-kit-region="name">None</span></button></li>
</ul>
</div>
</div>
</div>
</fieldset>
</div>
<div data-kit-role="form-group" data-kit-holds="help" id="range-stay">
<fieldset>
<legend id="range-stay-label">Stay</legend>
<div data-kit-dates='{"direction":"forward","first":"2025-04-09","firstDay":"sun","locale":"en","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2025-04-09"}' data-kit-role="date-range" id="range-stay-control-date-range">
<span data-kit-region="end"><label for="range-stay-control">From</label><label for="range-stay-control" hidden>Dates</label><input id="range-stay-control" data-kit-region="first" type="text" autocomplete="off" value="November 26, 2025" aria-describedby="range-stay-control-resolved range-stay-help" aria-expanded="false" aria-controls="range-stay-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">January 28, 2025
February 28, 2025
March 28, 2025
April 28, 2025
May 28, 2025
June 28, 2025
July 28, 2025
August 28, 2025
September 28, 2025
October 28, 2025
November 28, 2025
December 28, 2025</span><span data-kit-region="preset-names" aria-hidden="true">This weekend
Next week</span></span>
<span data-kit-region="end"><label for="range-stay-control-last">Until</label><input id="range-stay-control-last" data-kit-region="last" type="text" autocomplete="off" value="November 30, 2025" aria-describedby="range-stay-control-resolved range-stay-help"><span data-kit-region="widest-dates" aria-hidden="true">January 28, 2025
February 28, 2025
March 28, 2025
April 28, 2025
May 28, 2025
June 28, 2025
July 28, 2025
August 28, 2025
September 28, 2025
October 28, 2025
November 28, 2025
December 28, 2025</span></span>
<span id="range-stay-control-preset-dates" data-kit-region="preset-dates" hidden><time datetime="2025-04-12/2025-04-13" aria-hidden="true"><span>April 12 – </span><wbr><span>13, 2025</span></time><time datetime="2025-04-14/2025-04-20" aria-hidden="true"><span>April 14 – </span><wbr><span>20, 2025</span></time></span>
<span id="range-stay-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="range-stay-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="stay[first]" value="2025-11-26">
<input type="hidden" name="stay[last]" value="2025-11-30">
<input type="hidden" name="stay[preset]">
<div data-kit-role="popover" id="range-stay-control-layer" popover="manual" data-kit-region="presets-and-months">
<ul data-kit-region="presets">
<li>
<button type="button" value="this_weekend">
<span data-kit-region="name">This weekend</span>
<time datetime="2025-04-12/2025-04-13"><span>April 12 – </span><wbr><span>13, 2025</span></time>
</button>
</li><li>
<button type="button" value="next_week">
<span data-kit-region="name">Next week</span>
<time datetime="2025-04-14/2025-04-20"><span>April 14 – </span><wbr><span>20, 2025</span></time>
</button>
</li>
</ul>
<div id="range-stay-control-months" data-kit-region="months"></div>
</div>
</div>
</fieldset>
<output for="range-stay-control"><time datetime="2025-11-26/2025-11-30"><span>November 26 – </span><wbr><span>30, 2025</span></time></output>
<span data-kit-region="help" id="range-stay-help">Nights from the first day to the last.</span>
</div>
<div data-kit-role="form-group" data-kit-state="error" id="range-trip">
<fieldset>
<legend id="range-trip-label">Trip</legend>
<div data-kit-dates='{"direction":"forward","first":"2025-04-09","firstDay":"mon","locale":"en-GB","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2025-04-09"}' data-kit-role="date-range" id="range-trip-control-date-range">
<span data-kit-region="end"><label for="range-trip-control">From</label><label for="range-trip-control" hidden>Dates</label><input id="range-trip-control" data-kit-region="first" type="text" autocomplete="off" value="12 May" aria-describedby="range-trip-control-resolved range-trip-error" aria-invalid="true" aria-expanded="false" aria-controls="range-trip-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span></span>
<span data-kit-region="end"><label for="range-trip-control-last">Until</label><input id="range-trip-control-last" data-kit-region="last" type="text" autocomplete="off" value="end of May" aria-describedby="range-trip-control-resolved range-trip-error" aria-invalid="true"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span></span>
<span id="range-trip-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="range-trip-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="range-trip-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="trip[first]" value="12 May">
<input type="hidden" name="trip[last]" value="end of May">
<input type="hidden" name="trip[preset]">
<div data-kit-role="popover" id="range-trip-control-layer" popover="manual" data-kit-region="presets-and-months">
<div id="range-trip-control-months" data-kit-region="months"></div>
</div>
</div>
</fieldset>
<output for="range-trip-control">12 May – end of May</output>
<span data-kit-region="error" id="range-trip-error">Type both days, such as 12 May and 16 May.</span>
</div>
<div data-kit-role="form-group" id="month-range">
<fieldset>
<legend id="month-range-label">Period</legend>
<div data-kit-dates="{"direction":"either","firstDay":"mon","grain":"month","locale":"en-GB","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}" data-kit-role="date-range" id="month-range-control-date-range">
<span data-kit-region="end"><label for="month-range-control">From</label><label for="month-range-control" hidden>Dates</label><input id="month-range-control" data-kit-region="first" type="text" autocomplete="off" value="" aria-describedby="month-range-control-resolved" aria-expanded="false" aria-controls="month-range-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">January 2026
February 2026
March 2026
April 2026
May 2026
June 2026
July 2026
August 2026
September 2026
October 2026
November 2026
December 2026</span><span data-kit-region="preset-names" aria-hidden="true">This month
Last month
This quarter
Last quarter
Year to date</span></span>
<span data-kit-region="end"><label for="month-range-control-last">Until</label><input id="month-range-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="month-range-control-resolved"><span data-kit-region="widest-dates" aria-hidden="true">January 2026
February 2026
March 2026
April 2026
May 2026
June 2026
July 2026
August 2026
September 2026
October 2026
November 2026
December 2026</span></span>
<span id="month-range-control-preset-dates" data-kit-region="preset-dates" hidden><time datetime="2026-09-01/2026-09-30" aria-hidden="true">September 2026</time><time datetime="2026-08-01/2026-08-31" aria-hidden="true">August 2026</time><time datetime="2026-07-01/2026-09-30" aria-hidden="true"><span>July 2026 – </span><wbr><span>September 2026</span></time><time datetime="2026-04-01/2026-06-30" aria-hidden="true"><span>April 2026 – </span><wbr><span>June 2026</span></time><time datetime="2026-01-01/2026-09-30" aria-hidden="true"><span>January 2026 – </span><wbr><span>September 2026</span></time></span>
<span id="month-range-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="month-range-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="month_period[first]" value="">
<input type="hidden" name="month_period[last]" value="">
<input type="hidden" name="month_period[preset]">
<input type="hidden" name="month_period[compare]" value="previous_period">
<input type="hidden" name="month_period[compare_first]" value="">
<input type="hidden" name="month_period[compare_last]" value="">
<div data-kit-role="popover" id="month-range-control-layer" popover="manual" data-kit-region="presets-and-months">
<ul data-kit-region="presets">
<li>
<button type="button" value="this_month">
<span data-kit-region="name">This month</span>
<time datetime="2026-09-01/2026-09-30">September 2026</time>
</button>
</li><li>
<button type="button" value="last_month">
<span data-kit-region="name">Last month</span>
<time datetime="2026-08-01/2026-08-31">August 2026</time>
</button>
</li><li>
<button type="button" value="this_quarter">
<span data-kit-region="name">This quarter</span>
<time datetime="2026-07-01/2026-09-30"><span>July 2026 – </span><wbr><span>September 2026</span></time>
</button>
</li><li>
<button type="button" value="last_quarter">
<span data-kit-region="name">Last quarter</span>
<time datetime="2026-04-01/2026-06-30"><span>April 2026 – </span><wbr><span>June 2026</span></time>
</button>
</li><li>
<button type="button" value="year_to_date">
<span data-kit-region="name">Year to date</span>
<time datetime="2026-01-01/2026-09-30"><span>January 2026 – </span><wbr><span>September 2026</span></time>
</button>
</li>
</ul>
<div id="month-range-control-months" data-kit-region="months"></div>
<div data-kit-region="compare">
<span id="month-range-control-compare">Compare</span>
<ul aria-labelledby="month-range-control-compare">
<li><button type="button" value="previous_period" aria-current="true"><span data-kit-region="name">Previous period</span><time hidden></time></button></li>
<li><button type="button" value="previous_year"><span data-kit-region="name">Same period last year</span><time hidden></time></button></li>
<li><button type="button" value="none"><span data-kit-region="name">None</span></button></li>
</ul>
</div>
</div>
</div>
</fieldset>
</div>
<div data-kit-region="filter">
<button data-kit-role="secondary-action" popovertarget="date-filter-after" type="button">
<span data-kit-region="label"><span data-kit-region="name">Issued</span></span>
</button><div data-kit-role="popover" id="date-filter-after" popover="auto">
<div data-kit-role="form-group" id="filter-range-after">
<fieldset>
<legend id="filter-range-after-label">Issued</legend>
<div data-kit-dates="{"direction":"either","firstDay":"mon","locale":"en-GB","openEnd":true,"openEnds":"either","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}" data-kit-role="date-range" id="filter-range-after-control-date-range">
<span data-kit-region="end"><label for="filter-range-after-control">From</label><label for="filter-range-after-control" hidden>Dates</label><input id="filter-range-after-control" data-kit-region="first" type="text" autocomplete="off" value="" aria-describedby="filter-range-after-control-resolved" aria-expanded="false" aria-controls="filter-range-after-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span data-kit-region="end"><label for="filter-range-after-control-last">Until</label><input id="filter-range-after-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="filter-range-after-control-resolved"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="filter-range-after-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="filter-range-after-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="filter-range-after-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="issued_after[first]" value="">
<input type="hidden" name="issued_after[last]" value="">
<input type="hidden" name="issued_after[preset]">
<div data-kit-role="popover" id="filter-range-after-control-layer" popover="manual" data-kit-region="presets-and-months">
<div id="filter-range-after-control-months" data-kit-region="months"></div>
</div>
</div>
</fieldset>
</div>
</div></div>
</details><details data-specimen-case>
<div data-kit-region="filter">
<button data-kit-role="secondary-action" popovertarget="date-filter-before" type="button">
<span data-kit-region="label"><span data-kit-region="name">Issued</span></span>
</button><div data-kit-role="popover" id="date-filter-before" popover="auto">
<div data-kit-role="form-group" id="filter-range-before">
<fieldset>
<legend id="filter-range-before-label">Issued</legend>
<div data-kit-dates="{"direction":"either","firstDay":"mon","locale":"en-GB","openEnd":true,"openEnds":"either","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}" data-kit-role="date-range" id="filter-range-before-control-date-range">
<span data-kit-region="end"><label for="filter-range-before-control">From</label><label for="filter-range-before-control" hidden>Dates</label><input id="filter-range-before-control" data-kit-region="first" type="text" autocomplete="off" value="" aria-describedby="filter-range-before-control-resolved" aria-expanded="false" aria-controls="filter-range-before-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span data-kit-region="end"><label for="filter-range-before-control-last">Until</label><input id="filter-range-before-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="filter-range-before-control-resolved"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="filter-range-before-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="filter-range-before-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="filter-range-before-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="issued_before[first]" value="">
<input type="hidden" name="issued_before[last]" value="">
<input type="hidden" name="issued_before[preset]">
<div data-kit-role="popover" id="filter-range-before-control-layer" popover="manual" data-kit-region="presets-and-months">
<div id="filter-range-before-control-months" data-kit-region="months"></div>
</div>
</div>
</fieldset>
</div>
</div></div>
</details><details data-specimen-case>
<div data-kit-region="filter">
<button data-kit-role="secondary-action" popovertarget="date-filter-between" type="button">
<span data-kit-region="label"><span data-kit-region="name">Issued</span></span>
</button><div data-kit-role="popover" id="date-filter-between" popover="auto">
<div data-kit-role="form-group" id="filter-range-between">
<fieldset>
<legend id="filter-range-between-label">Issued</legend>
<div data-kit-dates="{"direction":"either","firstDay":"mon","locale":"en-GB","openEnd":true,"openEnds":"either","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2026-09-15"}" data-kit-role="date-range" id="filter-range-between-control-date-range">
<span data-kit-region="end"><label for="filter-range-between-control">From</label><label for="filter-range-between-control" hidden>Dates</label><input id="filter-range-between-control" data-kit-region="first" type="text" autocomplete="off" value="" aria-describedby="filter-range-between-control-resolved" aria-expanded="false" aria-controls="filter-range-between-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span data-kit-region="end"><label for="filter-range-between-control-last">Until</label><input id="filter-range-between-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="filter-range-between-control-resolved"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2026
28 February 2026
28 March 2026
28 April 2026
28 May 2026
28 June 2026
28 July 2026
28 August 2026
28 September 2026
28 October 2026
28 November 2026
28 December 2026</span></span>
<span id="filter-range-between-control-preset-dates" data-kit-region="preset-dates" hidden></span>
<span id="filter-range-between-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="filter-range-between-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="issued_between[first]" value="">
<input type="hidden" name="issued_between[last]" value="">
<input type="hidden" name="issued_between[preset]">
<div data-kit-role="popover" id="filter-range-between-control-layer" popover="manual" data-kit-region="presets-and-months">
<div id="filter-range-between-control-months" data-kit-region="months"></div>
</div>
</div>
</fieldset>
</div>
</div></div>
<div data-kit-role="form-group" data-kit-holds="help" id="range-period-disabled">
<fieldset>
<legend id="range-period-disabled-label">Period</legend>
<div data-kit-dates='{"direction":"backward","firstDay":"mon","last":"2025-04-09","locale":"en-GB","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2025-04-09"}' data-kit-role="date-range" id="range-period-disabled-control-date-range">
<span data-kit-region="end"><label for="range-period-disabled-control" hidden>From</label><label for="range-period-disabled-control">Dates</label><input disabled id="range-period-disabled-control" data-kit-region="first" type="text" autocomplete="off" value="Last 30 days" aria-describedby="range-period-disabled-control-resolved range-period-disabled-help range-period-disabled-control-preset-dates" aria-expanded="false" aria-controls="range-period-disabled-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span><span data-kit-region="preset-names" aria-hidden="true">Today
Last 7 days
Last 30 days
Month to date
Last month
Year to date</span></span>
<span data-kit-region="end"><label for="range-period-disabled-control-last">Until</label><input disabled id="range-period-disabled-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="range-period-disabled-control-resolved range-period-disabled-help" hidden><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span></span>
<span id="range-period-disabled-control-preset-dates" data-kit-region="preset-dates"><time datetime="2025-04-09/2025-04-09" aria-hidden="true">9 April 2025</time><time datetime="2025-04-03/2025-04-09" aria-hidden="true"><span>3 – </span><wbr><span>9 April 2025</span></time><time datetime="2025-03-11/2025-04-09"><span>11 March – </span><wbr><span>9 April 2025</span></time><time datetime="2025-04-01/2025-04-09" aria-hidden="true"><span>1 – </span><wbr><span>9 April 2025</span></time><time datetime="2025-03-01/2025-03-31" aria-hidden="true">March 2025</time><time datetime="2025-01-01/2025-04-09" aria-hidden="true"><span>1 January – </span><wbr><span>9 April 2025</span></time></span>
<span id="range-period-disabled-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button disabled aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="range-period-disabled-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input disabled type="hidden" name="period[first]" value="2025-03-11">
<input disabled type="hidden" name="period[last]" value="2025-04-09">
<input disabled type="hidden" name="period[preset]" value="last_30_days">
<input disabled type="hidden" name="period[compare]" value="previous_period">
<input disabled type="hidden" name="period[compare_first]" value="2025-02-09">
<input disabled type="hidden" name="period[compare_last]" value="2025-03-10">
<div data-kit-role="popover" id="range-period-disabled-control-layer" popover="manual" data-kit-region="presets-and-months">
<ul data-kit-region="presets">
<li>
<button disabled type="button" value="today">
<span data-kit-region="name">Today</span>
<time datetime="2025-04-09/2025-04-09">9 April 2025</time>
</button>
</li><li>
<button disabled type="button" value="last_7_days">
<span data-kit-region="name">Last 7 days</span>
<time datetime="2025-04-03/2025-04-09"><span>3 – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button disabled aria-current="true" type="button" value="last_30_days">
<span data-kit-region="name">Last 30 days</span>
<time datetime="2025-03-11/2025-04-09"><span>11 March – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button disabled type="button" value="month_to_date">
<span data-kit-region="name">Month to date</span>
<time datetime="2025-04-01/2025-04-09"><span>1 – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button disabled type="button" value="last_month">
<span data-kit-region="name">Last month</span>
<time datetime="2025-03-01/2025-03-31">March 2025</time>
</button>
</li><li>
<button disabled type="button" value="year_to_date">
<span data-kit-region="name">Year to date</span>
<time datetime="2025-01-01/2025-04-09"><span>1 January – </span><wbr><span>9 April 2025</span></time>
</button>
</li>
</ul>
<div id="range-period-disabled-control-months" data-kit-region="months"></div>
<div data-kit-region="compare">
<span id="range-period-disabled-control-compare">Compare</span>
<ul aria-labelledby="range-period-disabled-control-compare">
<li>
<button disabled type="button" value="previous_period" aria-current="true">
<span data-kit-region="name">Previous period</span>
<time datetime="2025-02-09/2025-03-10"><span>9 February – </span><wbr><span>10 March 2025</span></time>
</button>
</li><li>
<button disabled type="button" value="previous_year">
<span data-kit-region="name">Same period last year</span>
<time datetime="2024-03-11/2024-04-09"><span>11 March – </span><wbr><span>9 April 2024</span></time>
</button>
</li><li>
<button disabled type="button" value="none">
<span data-kit-region="name">None</span>
</button>
</li>
</ul>
</div>
</div>
</div>
</fieldset>
<span data-kit-region="help" id="range-period-disabled-help">Only the owner can change this.</span>
</div>
Date range, open
Source
<div data-kit-role="form-group" id="range-monday">
<fieldset>
<legend id="range-monday-label">Period</legend>
<div data-kit-dates='{"direction":"backward","firstDay":"mon","last":"2025-04-09","locale":"en-GB","quarters":{"names":[["1st quarter","Q1"],["2nd quarter","Q2"],["3rd quarter","Q3"],["4th quarter","Q4"]],"words":[]},"today":"2025-04-09"}' data-kit-role="date-range" id="range-monday-control-date-range">
<span data-kit-region="end"><label for="range-monday-control" hidden>From</label><label for="range-monday-control">Dates</label><input id="range-monday-control" data-kit-region="first" type="text" autocomplete="off" value="Last 30 days" aria-describedby="range-monday-control-resolved range-monday-control-preset-dates" aria-expanded="false" aria-controls="range-monday-control-layer"><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span><span data-kit-region="preset-names" aria-hidden="true">Today
Last 7 days
Last 30 days
Month to date
Last month
Year to date</span></span>
<span data-kit-region="end"><label for="range-monday-control-last">Until</label><input id="range-monday-control-last" data-kit-region="last" type="text" autocomplete="off" value="" aria-describedby="range-monday-control-resolved" hidden><span data-kit-region="widest-dates" aria-hidden="true">28 January 2025
28 February 2025
28 March 2025
28 April 2025
28 May 2025
28 June 2025
28 July 2025
28 August 2025
28 September 2025
28 October 2025
28 November 2025
28 December 2025</span></span>
<span id="range-monday-control-preset-dates" data-kit-region="preset-dates"><time datetime="2025-04-09/2025-04-09" aria-hidden="true">9 April 2025</time><time datetime="2025-04-03/2025-04-09" aria-hidden="true"><span>3 – </span><wbr><span>9 April 2025</span></time><time datetime="2025-03-11/2025-04-09"><span>11 March – </span><wbr><span>9 April 2025</span></time><time datetime="2025-04-01/2025-04-09" aria-hidden="true"><span>1 – </span><wbr><span>9 April 2025</span></time><time datetime="2025-03-01/2025-03-31" aria-hidden="true">March 2025</time><time datetime="2025-01-01/2025-04-09" aria-hidden="true"><span>1 January – </span><wbr><span>9 April 2025</span></time></span>
<span id="range-monday-control-resolved" data-kit-region="resolved" aria-live="polite"></span>
<button aria-label="Calendar" data-kit-region="calendar" data-kit-role="icon-action" id="range-monday-control-calendar" type="button">
<svg data-kit-icon="calendar-blank" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Z"></path></svg>
</button>
<input type="hidden" name="period[first]" value="2025-03-11">
<input type="hidden" name="period[last]" value="2025-04-09">
<input type="hidden" name="period[preset]" value="last_30_days">
<input type="hidden" name="period[compare]" value="previous_period">
<input type="hidden" name="period[compare_first]" value="2025-02-09">
<input type="hidden" name="period[compare_last]" value="2025-03-10">
<div data-kit-role="popover" id="range-monday-control-layer" popover="manual" data-kit-region="presets-and-months">
<ul data-kit-region="presets">
<li>
<button type="button" value="today">
<span data-kit-region="name">Today</span>
<time datetime="2025-04-09/2025-04-09">9 April 2025</time>
</button>
</li><li>
<button type="button" value="last_7_days">
<span data-kit-region="name">Last 7 days</span>
<time datetime="2025-04-03/2025-04-09"><span>3 – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button aria-current="true" type="button" value="last_30_days">
<span data-kit-region="name">Last 30 days</span>
<time datetime="2025-03-11/2025-04-09"><span>11 March – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button type="button" value="month_to_date">
<span data-kit-region="name">Month to date</span>
<time datetime="2025-04-01/2025-04-09"><span>1 – </span><wbr><span>9 April 2025</span></time>
</button>
</li><li>
<button type="button" value="last_month">
<span data-kit-region="name">Last month</span>
<time datetime="2025-03-01/2025-03-31">March 2025</time>
</button>
</li><li>
<button type="button" value="year_to_date">
<span data-kit-region="name">Year to date</span>
<time datetime="2025-01-01/2025-04-09"><span>1 January – </span><wbr><span>9 April 2025</span></time>
</button>
</li>
</ul>
<div id="range-monday-control-months" data-kit-region="months"></div>
<div data-kit-region="compare">
<span id="range-monday-control-compare">Compare</span>
<ul aria-labelledby="range-monday-control-compare">
<li>
<button type="button" value="previous_period" aria-current="true">
<span data-kit-region="name">Previous period</span>
<time datetime="2025-02-09/2025-03-10"><span>9 February – </span><wbr><span>10 March 2025</span></time>
</button>
</li><li>
<button type="button" value="previous_year">
<span data-kit-region="name">Same period last year</span>
<time datetime="2024-03-11/2024-04-09"><span>11 March – </span><wbr><span>9 April 2024</span></time>
</button>
</li><li>
<button type="button" value="none">
<span data-kit-region="name">None</span>
</button>
</li>
</ul>
</div>
</div>
</div>
</fieldset>
</div>