Update changelog and typscript children as type

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 - **[FIX]** Add a maximum width on `QrCard`
 - **[FIX]** Fix the `font-size` and `line-height` of `TextBody`, `TextSubHeader` and `TextTitle` components.
+- **[NEW]** Add `FocusVisibleProvider` and `useFocusVisible` utils to polyfill :focus-visible css pseudo class.
 - [...]
 
 # v29.0.0 (20/04/2020)

src/_utils/focusVisible/index.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useEffect, useState, ReactNode } from 'react'
+import React, { PropsWithChildren, createContext, useEffect, useState } from 'react'
 
 import {
  KEYS_TRIGGERING_KEYBOARD_NAVIGATION,
@@ -7,10 +7,6 @@ import {
 
 // A React hook based on: https://github.com/WICG/focus-visible
 
-interface FocusVisibleProviderProps {
- children: ReactNode
-}
-
 const pointerMoveEventList = [
  'mousedown',
  'mouseup',
@@ -26,7 +22,7 @@ const pointerDownEventList = ['mousedown', 'pointerdown', 'touchstart']
 
 export const FocusVisibleContext = createContext(false)
 
-export const FocusVisibleProvider = ({ children }: FocusVisibleProviderProps) => {
+export const FocusVisibleProvider = (props: PropsWithChildren<{}>) => {
  /* When the provider first loads, assume the user is in pointer modality. */
  const [hadKeyboardEvent, setHadKeyboardEvent] = useState(false)
 
@@ -102,7 +98,9 @@ export const FocusVisibleProvider = ({ children }: FocusVisibleProviderProps) =>
  }, [])
 
  return (
- <FocusVisibleContext.Provider value={hadKeyboardEvent}>{children}</FocusVisibleContext.Provider>
+ <FocusVisibleContext.Provider value={hadKeyboardEvent}>
+ {props.children}
+ </FocusVisibleContext.Provider>
  )
 }