Components
DateTime
Example
Date Range: no date - no date
Time Span: undefined:undefined:undefined - undefined:undefined:undefined
May 2025
| Su | Mo | Tu | We | Th | Fr | Sa |
|---|---|---|---|---|---|---|
::
::
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43
<Row>
<div className="flex flex-col w-full">
<div className="w-full p-4 border border-1-gray-12 h-32">
<div className="w-full ">
<p className="m-0 p-0">
Date Range:{' '}
<span>
no date
</span>
{' '}-{' '}
<span>
no date
</span>
</p>
<p className="m-0 p-0">
Time Span:{' '}
<span>
undefined:undefined:undefined
</span>
{' '}-{' '}
<span>
undefined:undefined:undefined
</span>
</p>
</div>
</div>
<div className="flex flex-col w-80 mx-auto pt-12 justify-center items-center">
<DateTime.root onChange={onChange}>
<AnonymousComponent mode="range" />
<DateTime.TimeInput type="range" />
<DateTime.Actions className="px-2">
<Button
className="w-full"
onClick={onClick}
variant="primary"
>
Apply Filter
</Button>
</DateTime.Actions>
</DateTime.root>
</div>
</div>
</Row>