PopupRangePicker — Documentation
Version 1.6.01 · Last updated April 3, 2026
1. Recommended Setup & Known Limitations
Placement tip
Place the visual where you want it on your dashboard canvas. Then open the Selection Pane and move the visual to the bottom of the layer stack — just above any background elements. This way the popup calendar overlays other visuals when you click it, but stays unobtrusive the rest of the time.
Data requirement
The visual expects exactly one Date field (a true Date column — not DateTime, not text). Only one field is allowed in the data role.
Row limit
The visual processes up to 30,000 date values. If your date column contains more rows, only the first 30,000 will be loaded.
Bookmark support
The visual restores its date selection when you switch between Power BI bookmarks.
Known limitations
Calendar weeks always start on Sunday. Only one date field can be used for filtering — multi-field filtering is not supported. The popup calendar sizes itself to the visual container. Make the container large enough on your canvas for comfortable use.
2. Getting Started
1. In Power BI Desktop, go to the Visualizations pane and import the .pbiviz file (or select it if already installed).
2. Click the PopupRangePicker icon to add it to your report canvas.
3. From the Fields pane, drag a Date column into the Date data role.
4. The visual displays a trigger button showing the selected date range. Click it to open the calendar popup.
3. Format Options
All formatting options are found in the Format pane (paint roller icon) when the visual is selected.
a. Closed Tab Formatting
Controls the appearance of the trigger button that users click to open the calendar. Settings include: Font Size (8–40, default 14), Font Color (default #201f1e), Padding (0–40, default 16), Border Color (default #cccccc), Border Width (0–5, default 1), and Component Position (Left / Right, default Right).
b. Calendar Style
Controls the overall look of the popup calendar. Settings include: Header Font Size (8–30, default 14), Header Font Color (default #201f1e), Day Font Size (8–24, default 12), Day Padding (0–10, default 2), Popup Background (default #ffffff), and Month Height — set to 0 for automatic sizing.
c. Selection Colors
Controls how selected dates and the in-between range are highlighted. Selected Color (default #0066cc), Selected Day Font Color (default #ffffff), Range Color (default #99c7ff), In-Range Font Color (default #003366), Unselected Day Font Color (default #201f1e).
d. Buttons
Controls the action buttons at the bottom of the calendar popup. Clear Button Text (default “Clear”), Apply Button Text (default “Apply”), Auto Apply — when enabled, the filter is applied automatically as you select dates, no need to click Apply (default Off).
e. Default Opening
Sets which date range is selected when the visual first loads. Choose from 18 presets: Today, Yesterday, This Week (Sun–Today), Last 7 Days, Last Week (Sun–Sat), This Week (Mon–Today), Last Week (Mon–Sun), Last 28 Days, Last 30 Days, This Month, Last Month, Last 90 Days, Quarter to Date, This Year (Jan–Today), Last Calendar Year, This Fiscal Year, Last Fiscal Year, All Dates Available.
f. Default Date Settings (Preselection Panel)
When enabled, a side panel with quick-select buttons appears inside the calendar popup. A master toggle turns the panel on or off, and individual toggles control each of the 18 preset buttons. This lets you tailor the quick-select options to only the ranges relevant to your report.
g. Fiscal Year
Defines your organization’s fiscal calendar. When enabled, “This Fiscal Year” and “Last Fiscal Year” presets become available. Enable Fiscal Year (default Off), Fiscal Year Start Month (1–12, default 1), Fiscal Year Start Day (1–31, default 1). For example, if your fiscal year starts on April 1st, set Start Month to 4 and Start Day to 1.
4. How to Use the Visual
Opening the calendar
Click the trigger button (the bar showing the current date range) to open the calendar popup.
Selecting a date range
Click a start date on the calendar, then click an end date. The visual automatically reorders the dates if you click the earlier date second. The days between start and end are highlighted with the range color.
Applying the selection
In manual mode (default), click the Apply button to apply your selection as a filter. In Auto Apply mode, the filter is applied immediately as you select dates. Clicking outside the popup (on the backdrop) also applies the current selection automatically.
Today indicator
Today’s date is always highlighted with a distinct border so you can quickly find it on the calendar.
Using preselection quick buttons
If the Default Date Settings panel is enabled, a side panel with quick-select buttons appears on the left. Click any button to instantly set the corresponding date range. You can resize this panel by dragging the handle between the panel and the calendar.
5. Tips & Edge Cases
Clicking outside with only a start date selected: the visual auto-completes the range using today as the end date.
Clicking outside with no selection: the default date range is re-applied.
“All Dates Available” preset: uses the minimum and maximum dates from your dataset. Requires data to be loaded in the visual to work correctly.
Fiscal Year presets: “This Fiscal Year” and “Last Fiscal Year” only appear when the Fiscal Year card is enabled in the format pane.
Month Height = 0 means automatic height — each month block sizes itself based on available space. Set a fixed value (e.g. 200) if you want uniform month blocks.
Popup sizing: the calendar popup fills the entire visual container. Make the container large enough on your canvas for comfortable interaction.
Layer order matters: if the popup appears behind other visuals, check the Selection Pane and move the PopupRangePicker lower in the layer stack.
6. Contact & Support
Website: bi-template.com — Developer: Emilien Granger