Textarea doesn't update value when it's an empty string

[andesol]

Consider this simplified example:

import { useState } from 'react';
import { Button, Textarea } from "@canonical/react-components";

function App() {
  const [data, setData] = useState("Default text");

  return (
      <div>
        <Button onClick={() => setData("")}>
          Show nothing
        </Button>
        <p>Current data is: {data}</p>
        <Textarea
          value={data}
          onChange={(e) => setData(e.target.value)}
        />
      </div>
    );
}

This is the default scenario:

I'd expect clicking the button to clear the value in the Textarea. However, while the state is correctly updated (to an empty string), the Textarea still shows the previous value.

[andesol]

It looks like this line should be

props.value ?? innerValue

[bartaz]

Good catch @andesol. Care to propose a PR? I guess it would be good to have a test case that catches this as well.

[andesol]

@bartaz Indeed, here's the PR https://github.com/canonical/react-components/pull/1070