Add a partial property to DateRange aragon#514

lcoenen · Oct 13, 2019 · cfec9b5 · cfec9b5
1 parent 1c9a438
commit cfec9b5
Show file tree

Hide file tree

Showing 4 changed files with 15,252 additions and 18 deletions.
diff --git a/devbox/apps/DateRange.js b/devbox/apps/DateRange.js
@@ -3,17 +3,34 @@ import styled from 'styled-components'
 import { _DateRange as DateRange, unselectable } from '@aragon/ui'
 
 export default function() {
-  const [selectedDateRange, setSelectedDateRange] = useState({
+	const initialState = {
     start: null,
     end: null,
-  })
+  }
+  const [selectedDateRange, setSelectedDateRange] = useState(initialState)
+  const [selectedStartDateRange, setSelectedStartDateRange] = useState(initialState)
+  const [selectedEndDateRange, setSelectedEndDateRange] = useState(initialState)
   return (
     <Main>
       <Container>
         <DateRange
           startDate={selectedDateRange.start}
           endDate={selectedDateRange.end}
           onChange={setSelectedDateRange}
+        />
+				With partial = 'start'
+        <DateRange
+          startDate={selectedStartDateRange.start}
+          endDate={selectedStartDateRange.end}
+          onChange={setSelectedStartDateRange}
+					partial="start"
+        />
+				With partial = 'end'
+        <DateRange
+          startDate={selectedEndDateRange.start}
+          endDate={selectedEndDateRange.end}
+          onChange={setSelectedEndDateRange}
+					partial="end"
         />
       </Container>
     </Main>