@colisweb/rescript-toolkit 4.29.3 → 5.0.1

package/src/form/Reform.res

@@ -127,7 +127,7 @@ module Make = (Config: Config) => {
     let {handleChange, getFieldError, getFieldState, validateField, state} = useFormContext()
 
     {
-      handleChange: handleChange(field),
+      handleChange: handleChange(field, ...),
       error: getFieldError(Field(field)),
       state: getFieldState(Field(field)),
       validate: () => validateField(Field(field)),
@@ -369,32 +369,32 @@ module Make = (Config: Config) => {
       },
     )
 
-    let getFieldState = field =>
-      state.fieldsState
-      ->Belt.List.fromArray
-      ->Belt.List.getBy(((nameField, _nameFieldState)) =>
-        switch nameField == field {
-        | true => true
-        | _ => false
-        }
-      )
-        |> (
-          field =>
-            switch field {
-            | Some((_nameField, nameFieldState)) => nameFieldState
-            | None => Pristine
-            }
+    let getFieldState = field => {
+      let tmp =
+        state.fieldsState
+        ->Belt.List.fromArray
+        ->Belt.List.getBy(((nameField, _nameFieldState)) =>
+          switch nameField == field {
+          | true => true
+          | _ => false
+          }
         )
 
+      switch tmp {
+      | Some((_nameField, nameFieldState)) => nameFieldState
+      | None => Pristine
+      }
+    }
+
     let getFieldError = field =>
-      getFieldState(field) |> (
+      (
         x =>
           switch x {
           | Error(error) => Some(error)
           | NestedErrors(_errors) => None
           | _ => None
           }
-      )
+      )(getFieldState(field))
 
     let getNestedFieldError = (field, subfield, index) =>
       switch getFieldState(field) {

package/src/form/Toolkit__Form.res

@@ -26,12 +26,13 @@ module Make = (StateLenses: Config) => {
     let make = (~field, ~elements, ~inline=?) =>
       <Field
         field
-        render={({handleChange, error, value}) => <>
-          <Toolkit__Ui_RadioGroup
-            defaultValue=value onChange={v => handleChange(v)} elements ?inline
-          />
-          <ErrorMessage ?error />
-        </>}
+        render={({handleChange, error, value}) =>
+          <React.Fragment>
+            <Toolkit__Ui_RadioGroup
+              defaultValue=value onChange={v => handleChange(v)} elements ?inline
+            />
+            <ErrorMessage ?error />
+          </React.Fragment>}
       />
   }
   module Input = {
@@ -75,7 +76,7 @@ module Make = (StateLenses: Config) => {
             | _ => validate()
             }
 
-          <>
+          <React.Fragment>
             <div
               className={cx([
                 "flex",
@@ -142,7 +143,7 @@ module Make = (StateLenses: Config) => {
               </div>
             </div>
             <ErrorMessage ?error className=?errorClassName />
-          </>
+          </React.Fragment>
         }}
       />
     }
@@ -185,7 +186,7 @@ module Make = (StateLenses: Config) => {
             | _ => validate()
             }
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -214,7 +215,7 @@ module Make = (StateLenses: Config) => {
               onBlur
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
     }
@@ -258,7 +259,7 @@ module Make = (StateLenses: Config) => {
             | _ => validate()
             }
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -295,7 +296,7 @@ module Make = (StateLenses: Config) => {
               isInvalid
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
   }
@@ -327,7 +328,7 @@ module Make = (StateLenses: Config) => {
             | _ => validate()
             }
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -353,7 +354,7 @@ module Make = (StateLenses: Config) => {
               onBlur
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
   }
@@ -363,18 +364,19 @@ module Make = (StateLenses: Config) => {
     let make = (~field, ~label, ~name=?, ~disabled=?, ~className=?) =>
       <Field
         field
-        render={({handleChange, error, value}) => <>
-          <Toolkit__Ui_Checkbox
-            ?className
-            checked={value->Obj.magic}
-            value={value->Obj.magic}
-            ?name
-            ?disabled
-            onChange={(checked, _value) => handleChange(checked)}>
-            label
-          </Toolkit__Ui_Checkbox>
-          <ErrorMessage ?error />
-        </>}
+        render={({handleChange, error, value}) =>
+          <React.Fragment>
+            <Toolkit__Ui_Checkbox
+              ?className
+              checked={value->Obj.magic}
+              value={value->Obj.magic}
+              ?name
+              ?disabled
+              onChange={(checked, _value) => handleChange(checked)}>
+              label
+            </Toolkit__Ui_Checkbox>
+            <ErrorMessage ?error />
+          </React.Fragment>}
       />
   }
 
@@ -404,7 +406,7 @@ module Make = (StateLenses: Config) => {
             }
           }
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -432,7 +434,7 @@ module Make = (StateLenses: Config) => {
               }}
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
     }
@@ -466,7 +468,7 @@ module Make = (StateLenses: Config) => {
             }
           }
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -496,7 +498,7 @@ module Make = (StateLenses: Config) => {
               }}
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
     }
@@ -524,7 +526,7 @@ module Make = (StateLenses: Config) => {
         render={({handleChange, error, value}) => {
           let isInvalid = error->Option.isSome
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -549,7 +551,7 @@ module Make = (StateLenses: Config) => {
               options
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
     }
@@ -579,7 +581,7 @@ module Make = (StateLenses: Config) => {
             }
           }
 
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -603,7 +605,7 @@ module Make = (StateLenses: Config) => {
               placeholder
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
     }
@@ -622,18 +624,19 @@ module Make = (StateLenses: Config) => {
     ) =>
       <Field
         field
-        render={({handleChange, value}) => <>
-          <Toolkit__Ui_Switch
-            ?label
-            onChange={value => handleChange(value)}
-            name=id
-            checked=value
-            ?size
-            ?displayTitle
-            ?switchClassName
-            className=?{labelClassName}
-          />
-        </>}
+        render={({handleChange, value}) =>
+          <React.Fragment>
+            <Toolkit__Ui_Switch
+              ?label
+              onChange={value => handleChange(value)}
+              name=id
+              checked=value
+              ?size
+              ?displayTitle
+              ?switchClassName
+              className=?{labelClassName}
+            />
+          </React.Fragment>}
       />
   }
 
@@ -652,7 +655,7 @@ module Make = (StateLenses: Config) => {
       <Field
         field
         render={({handleChange, value, error}) => {
-          <>
+          <React.Fragment>
             {switch label {
             | None => React.null
             | Some(label) =>
@@ -684,7 +687,7 @@ module Make = (StateLenses: Config) => {
                 <FormattedMessage defaultMessage="Choisissez une date" />,
               )}
               labelFormatter={date => {
-                <>
+                <React.Fragment>
                   <span>
                     <FormattedDate
                       value={date} weekday=#long day=#numeric month=#long year=#numeric
@@ -694,11 +697,11 @@ module Make = (StateLenses: Config) => {
                     className="border inline-flex items-center justify-center w-8 h-8 rounded border-primary-700 text-primary-700">
                     <ReactIcons.FaPencilAlt size={18} />
                   </div>
-                </>
+                </React.Fragment>
               }}
             />
             <ErrorMessage ?error />
-          </>
+          </React.Fragment>
         }}
       />
     }

package/src/hooks/Toolkit__Hooks.res

@@ -15,7 +15,7 @@ let useIsFirstMount = ReactUse.useFirstMountState
 let useUpdateEffect = (fn, deps) => {
   let isFirstMount = useIsFirstMount()
 
-  React.useEffect1(() =>
+  React.useEffect(() =>
     if !isFirstMount {
       fn()
     } else {
@@ -24,7 +24,6 @@ let useUpdateEffect = (fn, deps) => {
   , deps)
 }
 
-let useIsMounted = ReactUse.useMountedState
 let useTimeoutFn = ReactUse.useTimeoutFn
 let useDebounce = ReactUse.useDebounce
 let useDebounce2 = ReactUse.useDebounce2
@@ -34,7 +33,7 @@ let useDebounce4 = ReactUse.useDebounce4
 let useUpdate = () => {
   let (_, setState) = React.useState(_ => 0)
 
-  React.useCallback1(() => setState(SafeIncrement.increment), [])
+  React.useCallback(() => setState(SafeIncrement.increment), [])
 }
 
 let useDebounceValue = (~debounceDuration=200, value) => {
@@ -51,7 +50,7 @@ let useGetSet = initialStateGetter => {
   let state = React.useRef(initialStateGetter())
   let update = useUpdate()
 
-  React.useMemo1(() => (
+  React.useMemo(() => (
     // get
     () => state.current,
     // set
@@ -65,7 +64,7 @@ let usePrevious = ReactUse.usePrevious
 let useInitialPrevious = value => {
   let previousRef = React.useRef(value)
 
-  React.useEffect(() => {
+  React.useEffectOnEveryRender(() => {
     previousRef.current = value
     None
   })
@@ -106,7 +105,7 @@ let useFetcher = (~options: option<Swr.fetcherOptions>=?, key: 'key, fn: 'fn): f
     ),
   )
 
-  (data->Obj.magic, isValidating, () => Promise.Js.fromBsPromise(mutate(.))->Promise.Js.toResult)
+  (data->Obj.magic, isValidating, () => Promise.Js.fromBsPromise(mutate())->Promise.Js.toResult)
 }
 
 let useOptionalFetcher = (~options: option<Swr.fetcherOptions>=?, key: 'key, fn: 'fn): fetcher<
@@ -124,7 +123,7 @@ let useOptionalFetcher = (~options: option<Swr.fetcherOptions>=?, key: 'key, fn:
     ),
   )
 
-  (data->Obj.magic, isValidating, () => mutate(.)->Promise.Js.fromBsPromise->Promise.Js.toResult)
+  (data->Obj.magic, isValidating, () => mutate()->Promise.Js.fromBsPromise->Promise.Js.toResult)
 }
 
 // ----------------------
@@ -143,9 +142,9 @@ let useDisclosure = (~defaultIsOpen=?, ()) => {
 
   {
     isOpen,
-    show: React.useCallback(() => setIsOpen(_ => true)),
-    hide: React.useCallback(() => setIsOpen(_ => false)),
-    toggle: React.useCallback(() => setIsOpen(isOpen => !isOpen)),
+    show: React.useCallback(() => setIsOpen(_ => true), []),
+    hide: React.useCallback(() => setIsOpen(_ => false), []),
+    toggle: React.useCallback(() => setIsOpen(isOpen => !isOpen), []),
   }
 }
 
@@ -162,7 +161,7 @@ type clipboard = {
 
 let useClipboard = (~onCopyNotificationMessage: option<string>=?, value: string) => {
   let (hasCopied, setHasCopied) = React.useState(() => false)
-  let onCopy = React.useCallback1(() => {
+  let onCopy = React.useCallback(() => {
     onCopyNotificationMessage->Option.forEach(message =>
       Toolkit__Ui_Snackbar.show(~title=message, ~variant=#success, ())->ignore
     )
@@ -171,7 +170,7 @@ let useClipboard = (~onCopyNotificationMessage: option<string>=?, value: string)
     setHasCopied(_ => didCopy)
   }, [value])
 
-  React.useEffect1(() =>
+  React.useEffect(() =>
     hasCopied
       ? {
           let id = Js.Global.setTimeout(() => setHasCopied(_ => false), 1500)
@@ -198,9 +197,9 @@ let useRequest = (~debounce=true, fn, deps) => {
   let lastCallId = React.useRef(0)
   let canceled = React.useRef(false)
   let (state, set) = React.useState(() => NotAsked)
-  let isMounted = useIsMounted(.)
+  let isMounted = ReactUse.useMountedState(.)
 
-  let trigger = React.useCallback1(args => {
+  let trigger = React.useCallback(args => {
     lastCallId.current = lastCallId.current->SafeIncrement.increment
     let callId = lastCallId.current
 
@@ -211,7 +210,7 @@ let useRequest = (~debounce=true, fn, deps) => {
     fn(args)->Promise.map(result => {
       let isCanceled = (debounce ? callId !== lastCallId.current : false) || canceled.current
 
-      if isMounted(.) && !isCanceled {
+      if isMounted() && !isCanceled {
         set(_ => Done(result))
       }
 
@@ -219,7 +218,7 @@ let useRequest = (~debounce=true, fn, deps) => {
     })
   }, deps)
 
-  let cancel = React.useCallback0(() => canceled.current = true)
+  let cancel = React.useCallback(() => canceled.current = true, [])
 
   (state, trigger, cancel)
 }
@@ -242,14 +241,14 @@ type mediaQuery = {
 }
 
 let useMediaQuery = () => {
-  let isXs = React.useMemo0(() => matchMedia("(max-width: 639px)").matches)
-  let isSm = React.useMemo0(() => matchMedia("(min-width: 640px)").matches)
-  let isLg = React.useMemo0(() => matchMedia("(min-width: 1024px)").matches)
+  let isXs = React.useMemo(() => matchMedia("(max-width: 639px)").matches, [])
+  let isSm = React.useMemo(() => matchMedia("(min-width: 640px)").matches, [])
+  let isLg = React.useMemo(() => matchMedia("(min-width: 1024px)").matches, [])
   {isXs, isSm, isLg}
 }
 
 let useOnClickOutside = (ref: React.ref<Js.Nullable.t<Dom.element>>, handler) => {
-  React.useEffect2(() => {
+  React.useEffect(() => {
     let listener = event => {
       switch ref.current->Js.Nullable.toOption {
       | None => ()
@@ -288,7 +287,7 @@ let useIsVisibleOnViewport = (~options: option<ReactUse.intersectionOptions<'a>>
     }),
   )
 
-  React.useEffect1(() => {
+  React.useEffect(() => {
     intersection
     ->Js.Nullable.toOption
     ->Option.forEach(intersection => {
@@ -309,16 +308,14 @@ let useQueryParams = (~decoder, ~defaultParams) => {
     location->search
   }
 
-  React.useMemo1(
-    () =>
-      queryString
-      ->Js.String2.sliceToEnd(~from=1)
-      ->Qs.parse
-      ->Obj.magic
-      ->decoder
-      ->Result.getWithDefault(defaultParams),
-    [queryString],
-  )
+  React.useMemo(() =>
+    queryString
+    ->Js.String2.sliceToEnd(~from=1)
+    ->Qs.parse
+    ->Obj.magic
+    ->decoder
+    ->Result.getWithDefault(defaultParams)
+  , [queryString])
 }
 
 type localstorageStateOptions<'state> = {defaultValue?: 'state, storageSync?: bool}
@@ -329,31 +326,15 @@ external useLocalStorageState: (
   localstorageStateOptions<'state>,
 ) => ('state, ('state => 'state) => unit) = "default"
 
-// ----------------------
-// useIsMounted
-// ----------------------
-
-let useIsMounted = () => {
-  let mountedRef = React.useRef(false)
-  let get = React.useCallback0(() => mountedRef.current)
-
-  React.useEffect(() => {
-    mountedRef.current = true
-    Some(() => mountedRef.current = false)
-  })
-
-  get
-}
-
 external promiseErrorToJsObj: Js.Promise.error => Js.Exn.t = "%identity"
 
 let usePromise = (~debounce=true, fn, deps) => {
   let lastCallId = React.useRef(0)
   let canceled = React.useRef(false)
   let (state, set) = React.useState(() => NotAsked)
-  let isMounted = useIsMounted()
+  let isMounted = ReactUse.useMountedState()
 
-  let trigger = React.useCallback1(args => {
+  let trigger = React.useCallback(args => {
     lastCallId.current = lastCallId.current->SafeIncrement.increment
 
     let callId = lastCallId.current
@@ -372,7 +353,7 @@ let usePromise = (~debounce=true, fn, deps) => {
     })
   }, deps)
 
-  let cancel = React.useCallback0(() => canceled.current = true)
+  let cancel = React.useCallback(() => canceled.current = true, [])
 
   (state, trigger, cancel)
 }
@@ -386,9 +367,9 @@ let usePromiseV2 = (~debounce=true, fn, deps) => {
   let lastCallId = React.useRef(0)
   let canceled = React.useRef(false)
   let (state, set) = React.useState(() => NotAsked)
-  let isMounted = useIsMounted()
+  let isMounted = ReactUse.useMountedState()
 
-  let trigger = React.useCallback1(() => {
+  let trigger = React.useCallback(() => {
     lastCallId.current = lastCallId.current->SafeIncrement.increment
 
     fn()
@@ -411,12 +392,12 @@ let usePromiseV2 = (~debounce=true, fn, deps) => {
     ->ignore
   }, deps)
 
-  let cancel = React.useCallback0(() => {
+  let cancel = React.useCallback(() => {
     canceled.current = true
     ()
-  })
+  }, [])
 
-  React.useEffect1(() => {
+  React.useEffect(() => {
     trigger()
     None
   }, deps)
@@ -433,9 +414,9 @@ let usePromiseV3 = (~debounce=true, fn, deps) => {
   let lastCallId = React.useRef(0)
   let canceled = React.useRef(false)
   let (state, set) = React.useState(() => NotAsked)
-  let isMounted = useIsMounted()
+  let isMounted = ReactUse.useMountedState()
 
-  let trigger = React.useCallback1(() => {
+  let trigger = React.useCallback(() => {
     lastCallId.current = lastCallId.current->SafeIncrement.increment
 
     fn()
@@ -458,12 +439,12 @@ let usePromiseV3 = (~debounce=true, fn, deps) => {
     ->ignore
   }, deps)
 
-  let cancel = React.useCallback0(() => {
+  let cancel = React.useCallback(() => {
     canceled.current = true
     ()
-  })
+  }, [])
 
-  React.useEffect1(() => {
+  React.useEffect(() => {
     trigger()
     None
   }, deps)

package/src/hooks/index.md

@@ -26,9 +26,9 @@ module API = {
     module Config = {
       type argument = unit;
 
-      [@decco]
+      [@spice]
       type response = array(user)
-      [@decco]
+      [@spice]
       and user = {
         name: string
       };