Skip to content

Feature: Request for Adding useCharacterCount Hook #7063

Open
@h1un

Description

Description

I have implemented a new useCharacterCount hook inspired by the existing useCharacterLimit functionality. This hook helps track the number of characters in real-time within text input fields or rich text editors.

Although useCharacterLimit and useCharacterCount are not typically used together, an issue arises when both hooks are used simultaneously, causing the following error:

ToolbarContext.tsx:100 Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.
I am currently facing difficulties resolving this issue and would appreciate help fixing it so that both hooks can work together. Also, I would like to ask whether it would be appropriate to submit a pull request for this.

You can find the implementation of the useCharacterCount hook here.

Impact

Text Input Validation: Track the number of characters a user types in real-time and display an alert when the character count exceeds a set limit.
Rich Text Editing: Track character count in a rich text editor as users type, which can be useful for applications like document editing.
Form Validation: Dynamically validate form inputs based on character count, ensuring the form is only submitted if the character count is within the allowed range.

I request that the useCharacterCount hook be improved to work seamlessly alongside useCharacterLimit, resolving the issue when both hooks are used together. Also, I would like to know if it would be appropriate to submit a pull request for this.

Metadata

Assignees

No one assigned

    Labels

    enhancementImprovement over existing feature

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions