@@ -1,5 +1,5 @@ 
 {
 	"latest": "3.6.8",
-	"lastUpdateCheck": 1635762940319,
+	"lastUpdateCheck": 1636016463733,
 	"lastNotification": 1635762618236
 }

@@ -1,16 +1,17 @@ 
 import {useState, useReducer, useCallback, useEffect, useMemo} from 'react';
+import {makeStyles} from '@material-ui/core/styles';
 import Typography from '@material-ui/core/Typography';
 import IconButton from '@material-ui/core/IconButton';
 import Icon from '@material-ui/core/Icon';
 import Button from '@material-ui/core/Button';
+import TextField from '@material-ui/core/TextField';
+import Slider from '@material-ui/core/Slider';
+import {DatePicker, TimePicker} from '@material-ui/pickers';
 import moment from 'moment';
-import {makeStyles} from '@material-ui/core/styles';
 import {useTranslation} from 'react-i18next';
-import TextField from '@material-ui/core/TextField';
-import Slider from '@material-ui/core/Slider';
-import RemoveDialog from '../RemoveDialog';
 import useToastStore from '../../stores/useToastStore';
 import useEventStore from '../../stores/useEventStore';
+import RemoveDialog from '../RemoveDialog';
 import {
   useUpdateEventMutation,
   useUpdateCarMutation,
@@ -35,8 +36,8 @@ // States
   const [name, setName] = useState(car?.name ?? '');
   const [seats, setSeats] = useState(car?.seats ?? 4);
   const [meeting, setMeeting] = useState(car?.meeting ?? '');
-  const [date, setDate] = useState(dateMoment.format('YYYY-MM-DD'));
-  const [time, setTime] = useState(dateMoment.format('HH:mm'));
+  const [date, setDate] = useState(dateMoment);
+  const [time, setTime] = useState(dateMoment);
   const [phone, setPhone] = useState(car ? car['phone_number'] : '');
   const [details, setDetails] = useState(car?.details ?? '');
 
@@ -76,7 +77,7 @@ refetchQueries: ['eventByUUID'],
           });
       }
       const departure = moment(
-        `${date} ${time}`,
+        `${moment(date).format('YYYY-MM-DD')} ${moment(time).format('HH:mm')}`,
         'YYYY-MM-DD HH:mm'
       ).toISOString();
       await updateCar({
@@ -141,31 +142,24 @@ className={classes.edit}
         >
           <Icon>done</Icon>
         </IconButton>
-        <TextField
+        <DatePicker
+          id="NewCarDate"
+          className={classes.picker}
+          fullWidth
           label={t('car.creation.date')}
+          format="DD/MM/YYYY"
           value={date}
-          onChange={e => setDate(e.target.value)}
+          onChange={setDate}
+        />
+        <TimePicker
+          id="NewCarTime"
           className={classes.picker}
           fullWidth
-          id="NewCarDate"
-          name="date"
-          type="date"
-          InputLabelProps={{
-            shrink: true,
-          }}
-        />
-        <TextField
           label={t('car.creation.time')}
           value={time}
-          onChange={e => setTime(e.target.value)}
-          className={classes.picker}
-          fullWidth
-          id="NewCarTime"
-          name="time"
-          type="time"
-          InputLabelProps={{
-            shrink: true,
-          }}
+          onChange={setTime}
+          ampm={false}
+          minutesStep={5}
         />
         <TextField
           label={t('car.creation.name')}

@@ -31,17 +31,19 @@ };
 
 const useStyles = makeStyles(theme => ({
   arrow: {
+    position: 'fixed',
+    zIndex: 20,
+    width: 40,
+    minHeight: '100vh',
     alignItems: 'center',
     justifyContent: 'center',
-    zIndex: 2,
-    width: 40,
-    height: '100%',
-    transition: 'background-color 0.5s ease',
+    transition: 'background-color 0.3s ease, box-shadow 0.3s ease',
     '&:not(.slick-disabled)': {
-      backgroundColor: 'rgba(0,0,0,0.05)',
+      backgroundColor: 'rgba(255,255,255,1)',
+      boxShadow: '0 0 4px rgb(1 1 1 / 20%)',
     },
     '&:not(.slick-disabled):hover': {
-      backgroundColor: 'rgba(0,0,0,0.1)',
+      boxShadow: '0 0 0 rgb(1 1 1 / 20%)',
     },
     '&::before': {
       fontSize: 23,

@@ -3,7 +3,13 @@ import Box from '@material-ui/core/Box';
 
 const Dots = ({children}) =>
   createPortal(
-    <Box className="slick-dots" component="ul" display="flex">
+    <Box
+      className="slick-dots"
+      component="ul"
+      height={1}
+      display="flex"
+      alignItems="center"
+    >
       <Box display="flex" margin="0 auto">
         {children}
       </Box>

@@ -17,9 +17,10 @@ swipeToSlide: false,
   swipe: true,
   slidesToScroll: 5,
   slidesToShow: 5,
+  autoPlay: false,
   responsive: [
     {
-      breakpoint: 600,
+      breakpoint: 720,
       settings: {
         slidesToScroll: 1,
         slidesToShow: 1,
@@ -37,15 +38,15 @@ },
     {
       breakpoint: 1280,
       settings: {
-        slidesToScroll: 3,
-        slidesToShow: 3,
+        slidesToScroll: 2,
+        slidesToShow: 2,
       },
     },
     {
       breakpoint: 1920,
       settings: {
-        slidesToScroll: 4,
-        slidesToShow: 4,
+        slidesToScroll: 3,
+        slidesToShow: 3,
       },
     },
   ],

@@ -1,4 +1,3 @@ 
-import {useRef, useEffect} from 'react';
 import {makeStyles} from '@material-ui/core/styles';
 import Container from '@material-ui/core/Container';
 import Slider from 'react-slick';
@@ -14,26 +13,15 @@ toggleNewCar: () => void;
 }
 
 const CarColumns = (props: Props) => {
-  const wrapper = useRef(null);
-  const slider = useRef(null);
   const event = useEventStore(s => s.event);
   const {cars} = event || {};
   const classes = useStyles();
 
-  useEffect(() => {
-    if (wrapper.current)
-      wrapper.current.addEventListener('wheel', e => {
-        e.preventDefault();
-        if (e.deltaY < 0) slider.current.slickPrev();
-        else slider.current.slickNext();
-      });
-  }, [wrapper, slider]);
-
   return (
     <div className={classes.container}>
       <div className={classes.dots} id="slider-dots" />
-      <div className={classes.slider} ref={wrapper}>
-        <Slider ref={slider} {...sliderSettings}>
+      <div className={classes.slider}>
+        <Slider {...sliderSettings}>
           <Container maxWidth="sm" className={classes.slide}>
             <WaitingList />
           </Container>
@@ -65,17 +53,20 @@ };
 
 const useStyles = makeStyles(theme => ({
   container: {
-    height: `calc(100vh - ${theme.mixins.toolbar.minHeight}px)`,
-    overflow: 'hidden',
-    position: 'relative',
-    top: theme.mixins.toolbar.minHeight,
+    minHeight: '100vh',
+    paddingTop: theme.mixins.toolbar.minHeight,
+    paddingLeft: theme.spacing(6),
+    paddingRight: theme.spacing(6),
+    [theme.breakpoints.down('sm')]: {
+      paddingLeft: theme.spacing(),
+      paddingRight: theme.spacing(),
+    },
+    display: 'flex',
+    flexDirection: 'column',
+    overflowX: 'hidden',
+    overflowY: 'auto',
   },
   dots: {
-    position: 'absolute',
-    top: 0,
-    left: 0,
-    zIndex: 20,
-    width: '100%',
     height: 32,
     overflow: 'auto',
     '& overflow': '-moz-scrollbars-none',
@@ -84,7 +75,7 @@ '&::-webkit-scrollbar': {
       height: '0 !important',
     },
     '& .slick-dots': {
-      bottom: 0,
+      position: 'static',
       '& li': {
         display: 'block',
       },
@@ -95,15 +86,10 @@ color: theme.palette.primary.main,
       },
   },
   slider: {
-    height: '100%',
-    zIndex: -20,
-    overflow: 'hidden',
-    '& > div': {
+    flexGrow: 1,
+    height: 1,
+    '& .slick-slider': {
       height: '100%',
-      padding: theme.spacing(4, 6, 0, 6),
-      [theme.breakpoints.down('sm')]: {
-        padding: theme.spacing(4, 1, 0, 1),
-      },
       '& .slick-list': {
         overflow: 'visible',
       },
@@ -111,10 +97,9 @@ cursor: 'grab',
     },
   },
   slide: {
-    minHeight: '100%',
-    outline: 'none',
     padding: theme.spacing(1),
     marginBottom: theme.spacing(12),
+    outline: 'none',
     '& > *': {
       cursor: 'default',
     },

@@ -4,8 +4,9 @@ import {makeStyles} from '@material-ui/core/styles';
 import TextField from '@material-ui/core/TextField';
 import Button from '@material-ui/core/Button';
 import {CircularProgress} from '@material-ui/core';
+import {DatePicker} from '@material-ui/pickers';
+import moment from 'moment';
 import {useTranslation} from 'react-i18next';
-import moment from 'moment';
 import useToastStore from '../../stores/useToastStore';
 
 const Step2 = ({event, addToEvent, createEvent}) => {
@@ -15,7 +16,7 @@ const router = useRouter();
   const addToast = useToastStore(s => s.addToast);
 
   // States
-  const [date, setDate] = useState();
+  const [date, setDate] = useState(null);
   const [address, setAddress] = useState(event.address ?? '');
   const [loading, setLoading] = useState(false);
 
@@ -23,7 +24,10 @@ const onCreate = async evt => {
     if (evt.preventDefault) evt.preventDefault();
     if (loading) return false;
     setLoading(true);
-    const eventData = {date: date ? date : null, address};
+    const eventData = {
+      date: !date ? null : moment(date).format('YYYY-MM-DD'),
+      address,
+    };
     addToEvent(eventData);
     const result = await createEvent(eventData);
     if (!result) addToast(t('event.errors.cant_create'));
@@ -34,15 +38,16 @@ };
 
   return (
     <form onSubmit={onCreate}>
-      <TextField
+      <DatePicker
         id="NewEventDate"
         fullWidth
         label={t('event.creation.date')}
+        format="DD/MM/YYYY"
         value={date}
-        onChange={e => setDate(e.target.value)}
-        name="date"
-        type="date"
-        InputLabelProps={{shrink: true}}
+        onChange={setDate}
+        clearable
+        clearLabel={t('generic.clear')}
+        cancelLabel={t('generic.cancel')}
       />
       <TextField
         label={t('event.creation.address')}

@@ -1,8 +1,8 @@ 
 import {useState, useReducer} from 'react';
+import {useCreateEventMutation} from '../../generated/graphql';
+import useAddToEvents from '../../hooks/useAddToEvents';
 import Step1 from './Step1';
 import Step2 from './Step2';
-import {useCreateEventMutation} from '../../generated/graphql';
-import useAddToEvents from '../../hooks/useAddToEvents';
 
 const STEPS = [Step1, Step2];
 

@@ -1,15 +1,16 @@ 
 import {useRef} from 'react';
+import {makeStyles, createMuiTheme, ThemeProvider} from '@material-ui/core';
 import Typography from '@material-ui/core/Typography';
+import TextField from '@material-ui/core/TextField';
 import Button from '@material-ui/core/Button';
 import Link from '@material-ui/core/Link';
 import Icon from '@material-ui/core/Icon';
 import Box from '@material-ui/core/Box';
-import TextField from '@material-ui/core/TextField';
-import {makeStyles, createMuiTheme, ThemeProvider} from '@material-ui/core';
+import {DatePicker} from '@material-ui/pickers';
 import {useTranslation} from 'react-i18next';
 import moment from 'moment';
+import useEventStore from '../../stores/useEventStore';
 import {caroster} from '../../theme';
-import useEventStore from '../../stores/useEventStore';
 
 const EventDetails = ({onShare}) => {
   const {t} = useTranslation();
@@ -40,20 +41,25 @@ </div>
           )}
           <Typography variant="h6">{t('event.fields.starts_on')}</Typography>
           {isEditing ? (
-            <TextField
+            <DatePicker
               id={`${idPrefix}Date`}
               fullWidth
               label={t('event.creation.date')}
+              format="DD/MM/YYYY"
               value={event.date}
-              onChange={e => setEventUpdate({date: e.target.value})}
-              name="date"
-              type="date"
-              InputLabelProps={{shrink: true}}
+              onChange={date =>
+                setEventUpdate({
+                  date: !date ? null : moment(date).format('YYYY-MM-DD'),
+                })
+              }
+              clearable
+              clearLabel={t('generic.clear')}
+              cancelLabel={t('generic.cancel')}
             />
           ) : (
             <Typography variant="body1" id={`${idPrefix}Date`}>
               {event.date
-                ? moment(event.date).format('DD.MM.YYYY')
+                ? moment(event.date).format('DD/MM/YYYY')
                 : t('event.fields.empty')}
             </Typography>
           )}
@@ -91,7 +97,7 @@ </Typography>
           )}
         </div>
         <Typography variant="h6">{t('event.fields.link')}</Typography>
-        <Typography variant="body">{t('event.fields.link_desc')}</Typography>
+        <Typography>{t('event.fields.link_desc')}</Typography>
         <TextField
           value={window.location.href}
           inputProps={{

@@ -52,7 +52,7 @@ };
 
   return (
     <>
-      <Box p={1} position="fixed" bottom={0} left={0}>
+      <Box p={1} position="fixed" bottom={0} left={0} zIndex={1050}>
         <IconButton
           color="primary"
           aria-label="Languages"

@@ -1,4 +1,5 @@ 
 import {useState, forwardRef, useMemo} from 'react';
+import {makeStyles} from '@material-ui/core/styles';
 import Dialog from '@material-ui/core/Dialog';
 import DialogActions from '@material-ui/core/DialogActions';
 import DialogContent from '@material-ui/core/DialogContent';
@@ -8,12 +9,12 @@ import Slide from '@material-ui/core/Slide';
 import TextField from '@material-ui/core/TextField';
 import Slider from '@material-ui/core/Slider';
 import Typography from '@material-ui/core/Typography';
-import {makeStyles} from '@material-ui/core/styles';
+import {DatePicker, TimePicker} from '@material-ui/pickers';
 import moment from 'moment';
 import {useTranslation} from 'react-i18next';
-import useAddToEvents from '../../hooks/useAddToEvents';
 import useEventStore from '../../stores/useEventStore';
 import useToastsStore from '../../stores/useToastStore';
+import useAddToEvents from '../../hooks/useAddToEvents';
 import {useCreateCarMutation} from '../../generated/graphql';
 
 const NewCarDialog = ({open, toggle}) => {
@@ -32,8 +33,8 @@ // States
   const [name, setName] = useState('');
   const [seats, setSeats] = useState(4);
   const [meeting, setMeeting] = useState('');
-  const [date, setDate] = useState(dateMoment.format('YYYY-MM-DD'));
-  const [time, setTime] = useState(dateMoment.format('HH:mm'));
+  const [date, setDate] = useState(dateMoment);
+  const [time, setTime] = useState(dateMoment);
   const [phone, setPhone] = useState('');
   const [details, setDetails] = useState('');
   const canCreate = !!name && !!seats;
@@ -42,7 +43,7 @@ const onCreate = async e => {
     if (e.preventDefault) e.preventDefault();
     try {
       const departure = moment(
-        `${date} ${time}`,
+        `${moment(date).format('YYYY-MM-DD')} ${moment(time).format('HH:mm')}`,
         'YYYY-MM-DD HH:mm'
       ).toISOString();
       await createCar({
@@ -66,7 +67,7 @@ // Clear states
       setName('');
       setSeats(4);
       setMeeting('');
-      setDate(moment().format('YYYY-MM-DD'));
+      setDate(moment());
       setPhone('');
       setDetails('');
     } catch (error) {
@@ -96,31 +97,24 @@ autoFocus
             id="NewCarName"
             name="name"
           />
-          <TextField
+          <DatePicker
+            id="NewCarDateTime"
+            className={classes.picker}
+            fullWidth
             label={t('car.creation.date')}
+            format="DD/MM/YYYY"
             value={date}
-            onChange={e => setDate(e.target.value)}
+            onChange={setDate}
+          />
+          <TimePicker
+            id="NewCarTime"
             className={classes.picker}
             fullWidth
-            id="NewCarDateTime"
-            name="date"
-            type="date"
-            InputLabelProps={{
-              shrink: true,
-            }}
-          />
-          <TextField
             label={t('car.creation.time')}
             value={time}
-            onChange={e => setTime(e.target.value)}
-            className={classes.picker}
-            fullWidth
-            id="NewCarTime"
-            name="time"
-            type="time"
-            InputLabelProps={{
-              shrink: true,
-            }}
+            onChange={setTime}
+            ampm={false}
+            minutesStep={5}
           />
           <Typography variant="caption">{t('car.creation.seats')}</Typography>
           <Slider

@@ -7,6 +7,7 @@ "cancel": "Cancel",
     "remove": "Remove",
     "save": "Save",
     "confirm": "Confirm",
+    "clear": "Clear",
     "errors": {
       "date_min": "Select an upcoming date",
       "unknown": "An unknown error occurred",

@@ -7,6 +7,7 @@ "cancel": "Annuler",
     "remove": "Supprimer",
     "save": "Enregistrer",
     "confirm": "Confirmer",
+    "clear": "Effacer",
     "errors": {
       "date_min": "Sélectionnez une date à venir",
       "unknown": "Une erreur inconnue c'est produite",

@@ -11,7 +11,9 @@ "gqlgen": "graphql-codegen --config codegen.yml"
   },
   "dependencies": {
     "@apollo/client": "^3.3.7",
+    "@date-io/moment": "1.x",
     "@material-ui/core": "^4.11.3",
+    "@material-ui/pickers": "^3.3.10",
     "@types/node": "^14.14.20",
     "@types/react": "^17.0.0",
     "deepmerge": "^4.2.2",

@@ -1,19 +1,27 @@ 
 import {useEffect} from 'react';
 import {AppProps} from 'next/app';
-import {ThemeProvider} from '@material-ui/core/styles';
 import {ApolloProvider} from '@apollo/client';
+import {ThemeProvider} from '@material-ui/core/styles';
 import CssBaseline from '@material-ui/core/CssBaseline';
+import {MuiPickersUtilsProvider} from '@material-ui/pickers';
+import moment from 'moment';
+import MomentUtils from '@date-io/moment';
 import {useApollo} from '../lib/apolloClient';
-import theme from '../theme';
-import Toasts from '../components/Toasts';
+import {Enum_Userspermissionsuser_Lang} from '../generated/graphql';
+import useLangStore from '../stores/useLangStore';
 import Languages from '../containers/Languages';
 import Metas from '../containers/Metas';
+import Toasts from '../components/Toasts';
+import theme from '../theme';
 import 'moment/locale/fr-ch';
 import '../i18n';
 
+moment.locale('fr-ch');
+
 const App = function (props: AppProps) {
   const {Component, pageProps} = props;
   const apolloClient = useApollo(pageProps);
+  const language = useLangStore(s => s.language);
 
   useEffect(() => {
     // Remove the server-side injected CSS.
@@ -27,10 +35,18 @@ return (
     <ApolloProvider client={apolloClient}>
       <Metas metas={pageProps.metas} />
       <ThemeProvider theme={theme}>
-        <CssBaseline />
-        <Component {...pageProps} />
-        <Toasts />
-        <Languages />
+        <MuiPickersUtilsProvider
+          libInstance={moment}
+          utils={MomentUtils}
+          locale={
+            language === Enum_Userspermissionsuser_Lang.Fr ? 'fr-ch' : 'en'
+          }
+        >
+          <CssBaseline />
+          <Component {...pageProps} />
+          <Toasts />
+          <Languages />
+        </MuiPickersUtilsProvider>
       </ThemeProvider>
     </ApolloProvider>
   );

@@ -5,14 +5,14 @@ 
 const STORAGE_KEY = 'caroster-lang';
 
 type State = {
-  language: Enum_Userspermissionsuser_Lang | null;
+  language: Enum_Userspermissionsuser_Lang;
   setLanguage: (language?: Enum_Userspermissionsuser_Lang) => void;
 };
 
 const useLangStore = create<State>(
   persist(
     set => ({
-      language: null,
+      language: Enum_Userspermissionsuser_Lang.Fr,
       setLanguage: language => set({language}),
     }),
     {

@@ -936,6 +936,13 @@ integrity sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==
   dependencies:
     regenerator-runtime "^0.13.4"
 
+"@babel/runtime@^7.6.0":
+  version "7.16.0"
+  resolved "https://npm-8ee.hidora.com/@babel%2fruntime/-/runtime-7.16.0.tgz#e27b977f2e2088ba24748bf99b5e1dece64e4f0b"
+  integrity sha512-Nht8L0O8YCktmsDV6FqFue7vQLRx3Hb0B37lS5y0jDRqRxlBG4wIJHnf9/bgSE2UyipKFA01YtS+npRdTWBUyw==
+  dependencies:
+    regenerator-runtime "^0.13.4"
+
 "@babel/template@^7.14.5":
   version "7.14.5"
   resolved "https://npm-8ee.hidora.com/@babel%2ftemplate/-/template-7.14.5.tgz#a9bc9d8b33354ff6e55a9c60d1109200a68974f4"
@@ -1000,6 +1007,18 @@ integrity sha512-M/NzBpEL95I5Hh4dwhin5JlE7EzO5PHMAuzjxss3tiOBD46KfQvVedN/3jEPZvdRvtsK2222XfdHogNIttFgcg==
   dependencies:
     "@babel/helper-validator-identifier" "^7.14.5"
     to-fast-properties "^2.0.0"
+
+"@date-io/core@1.x", "@date-io/core@^1.3.13":
+  version "1.3.13"
+  resolved "https://npm-8ee.hidora.com/@date-io%2fcore/-/core-1.3.13.tgz#90c71da493f20204b7a972929cc5c482d078b3fa"
+  integrity sha512-AlEKV7TxjeK+jxWVKcCFrfYAk8spX9aCyiToFIiLPtfQbsjmRGLIhb5VZgptQcJdHtLXo7+m0DuurwFgUToQuA==
+
+"@date-io/moment@1.x":
+  version "1.3.13"
+  resolved "https://npm-8ee.hidora.com/@date-io%2fmoment/-/moment-1.3.13.tgz#56c2772bc4f6675fc6970257e6033e7a7c2960f0"
+  integrity sha512-3kJYusJtQuOIxq6byZlzAHoW/18iExJer9qfRF5DyyzdAk074seTuJfdofjz4RFfTd/Idk8WylOQpWtERqvFuQ==
+  dependencies:
+    "@date-io/core" "^1.3.13"
 
 "@emotion/hash@^0.8.0":
   version "0.8.0"
@@ -1487,6 +1506,18 @@ prop-types "^15.7.2"
     react-is "^16.8.0 || ^17.0.0"
     react-transition-group "^4.4.0"
 
+"@material-ui/pickers@^3.3.10":
+  version "3.3.10"
+  resolved "https://npm-8ee.hidora.com/@material-ui%2fpickers/-/pickers-3.3.10.tgz#f1b0f963348cc191645ef0bdeff7a67c6aa25485"
+  integrity sha512-hS4pxwn1ZGXVkmgD4tpFpaumUaAg2ZzbTrxltfC5yPw4BJV+mGkfnQOB4VpWEYZw2jv65Z0wLwDE/piQiPPZ3w==
+  dependencies:
+    "@babel/runtime" "^7.6.0"
+    "@date-io/core" "1.x"
+    "@types/styled-jsx" "^2.2.8"
+    clsx "^1.0.2"
+    react-transition-group "^4.0.0"
+    rifm "^0.7.0"
+
 "@material-ui/styles@^4.11.4":
   version "4.11.4"
   resolved "https://npm-8ee.hidora.com/@material-ui%2fstyles/-/styles-4.11.4.tgz#eb9dfccfcc2d208243d986457dff025497afa00d"
@@ -1776,6 +1807,13 @@ "@types/source-list-map@*":
   version "0.1.2"
   resolved "https://npm-8ee.hidora.com/@types%2fsource-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9"
   integrity sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==
+
+"@types/styled-jsx@^2.2.8":
+  version "2.2.9"
+  resolved "https://npm-8ee.hidora.com/@types%2fstyled-jsx/-/styled-jsx-2.2.9.tgz#e50b3f868c055bcbf9bc353eca6c10fdad32a53f"
+  integrity sha512-W/iTlIkGEyTBGTEvZCey8EgQlQ5l0DwMqi3iOXlLs2kyBwYTXHKEiU6IZ5EwoRwngL8/dGYuzezSup89ttVHLw==
+  dependencies:
+    "@types/react" "*"
 
 "@types/tapable@^1":
   version "1.0.7"
@@ -2682,7 +2720,7 @@ integrity sha1-0dyXOSAxTfZ/vrlCI7TuNQI56Ws=
   dependencies:
     mimic-response "^1.0.0"
 
-clsx@^1.0.4:
+clsx@^1.0.2, clsx@^1.0.4:
   version "1.1.1"
   resolved "https://npm-8ee.hidora.com/clsx/-/clsx-1.1.1.tgz#98b3134f9abbdf23b2663491ace13c5c03a73188"
   integrity sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==
@@ -5960,7 +5998,7 @@ json2mq "^0.2.0"
     lodash.debounce "^4.0.8"
     resize-observer-polyfill "^1.5.0"
 
-react-transition-group@^4.4.0:
+react-transition-group@^4.0.0, react-transition-group@^4.4.0:
   version "4.4.2"
   resolved "https://npm-8ee.hidora.com/react-transition-group/-/react-transition-group-4.4.2.tgz#8b59a56f09ced7b55cbd53c36768b922890d5470"
   integrity sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==
@@ -6212,6 +6250,13 @@ reusify@^1.0.4:
   version "1.0.4"
   resolved "https://npm-8ee.hidora.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
   integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
+
+rifm@^0.7.0:
+  version "0.7.0"
+  resolved "https://npm-8ee.hidora.com/rifm/-/rifm-0.7.0.tgz#debe951a9c83549ca6b33e5919f716044c2230be"
+  integrity sha512-DSOJTWHD67860I5ojetXdEQRIBvF6YcpNe53j0vn1vp9EUb9N80EiZTxgP+FkDKorWC8PZw052kTF4C1GOivCQ==
+  dependencies:
+    "@babel/runtime" "^7.3.1"
 
 rimraf@^2.6.3:
   version "2.7.1"