DateRangePicker¶
What It Does¶
Captures a start and end date in one controlled component.
Signature¶
db.DateRangePicker(name: 'str', label: 'Optional[str]' = None, start: 'str' = '', end: 'str' = '', on_change: 'Optional[Callable[[Dict[str, str]], None]]' = None, disabled: 'bool' = False, loading: 'bool' = False, animated: 'bool' = False, animation: 'Optional[str]' = None, animation_delay: 'Optional[float]' = None) -> 'VNode'
Parameters¶
| Name | Type | Default | Notes |
|---|---|---|---|
name |
str |
required |
|
label |
Optional[str] |
None |
|
start |
str |
'' |
|
end |
str |
'' |
|
on_change |
Optional[Callable[[Dict[str, str]], None]] |
None |
|
disabled |
bool |
False |
|
loading |
bool |
False |
|
animated |
bool |
False |
|
animation |
Optional[str] |
None |
|
animation_delay |
Optional[float] |
None |
Example¶
import brickflowui as db
node = db.DateRangePicker(name="window", label="Window", start="2026-05-01", end="2026-05-07", on_change=lambda value: None)
Integration Notes¶
- DateRangePicker emits a dictionary shaped like
{"start": "YYYY-MM-DD", "end": "YYYY-MM-DD"}. - Use it for filters, compare-period controls, and data-refresh windows.
Responsive Notes¶
Check the component inside a realistic layout, not only in isolation, so spacing, overflow, and action density stay comfortable on smaller screens.
Accessibility Notes¶
Pair this component with clear visible copy and predictable state changes so keyboard and assistive-technology users are not surprised.