useSessionStorage Hook: initialization issue

[WouterCypers]

Describe the bug

When using the useSessionStorage hook and initialising the value to an empty string, React yields the folowwing error:

Warning: A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from undefined to a defined value, which should not happen. Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components

The hook seems to save the empty string as undefined instead of a literal ''.

Reproducer

No response

PrimeReact version

9.2.1

React version

18.x

Language

TypeScript

Build / Runtime

Next.js

Browser(s)

No response

Steps to reproduce the behavior

1. Create a variable using useSessionStorage initialised to '':

  const [usernameInput, setUsernameInput] = useSessionStorage(
    '',
    'usernameInput'
  );

2. Use it on an InputText element:

          <InputText
            value={usernameInput}
            onChange={(e) => setUsernameInput(e.target.value)}
          />

3. Check console log.
   

Expected behavior

No error.

[melloware]

Thanks for the reproducer I was able to reproduce it and fix it. See PR.