Components
DateTime
Example
Date Range: no date - no date
Time Span: undefined:undefined:undefined - undefined:undefined:undefined
March 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>