diff --git a/snippets/LimitedWordTextarea.md b/snippets/LimitedWordTextarea.md new file mode 100644 index 000000000..189b54ff1 --- /dev/null +++ b/snippets/LimitedWordTextarea.md @@ -0,0 +1,61 @@ +### LimitedWordTextarea + +Renders a textarea component with a word limit. + +Use the `React.useState()` hook to create the `content` and `wordCount` state variables and set their values to `value` and `0` respectively. +Create a method `setFormattedContent`, which uses `String.prototype.split(' ')` to turn the input into an array of words and check if the result of applying `Array.prototype.filter(Boolean)` has a `length` longer than `limit`. +If the afforementioned `length` exceeds the `limit`, trim the input, otherwise return the raw input, updating `content` and `wordCount` accordingly in both cases. +Use the `React.useEffect()` hook to call the `setFormattedContent` method on the value of the `content` state variable. +Use a`
` to wrap both the`