Character Counter

[1520229462]

Issue Id you have worked upon -

580

Briefly explain your program logic -

The core idea of the provided code is to create a character counter application using React and the Material-UI library. The code defines a functional component called MainCharacterCounter that maintains various state variables to track the text input and perform character counting operations.

Here are the key points of the code:

1. The code imports necessary dependencies from React and Material-UI, including the useState hook for managing state.

2. Inside the MainCharacterCounter component, several state variables are defined using the useState hook. These variables include text (to store the input text), characterCount, wordCount, spaceCount, tabCount, lineBreakCount, and characterFrequency.

3. The handleTextChange function is called whenever the input text changes. It updates the text state and invokes the countCharacters function to perform character counting operations.

4. The handleKeyDown function is triggered when a key is pressed. If the pressed key is the Tab key, it prevents the default behavior, inserts a tab character at the current cursor position in the text, updates the text state, increments the tabCount state, and adjusts the cursor position.

5. The countCharacters function takes a text parameter and performs various counting operations. It splits the text into an array of characters and words using the split method. It calculates the character count by removing whitespace characters, sets the word count by counting the number of words, and counts the occurrences of spaces, tabs, and line breaks using the filter method. It also calculates the frequency of each unique character using an object (characterFrequency).

6. The return statement renders the UI elements using Material-UI components. It displays a text input field, and below it, it shows the character count, word count, space count, tab count, line break count, and character frequency.

Screenshots(Attach 2 screenshots of your own input and output) -

By raising this PR I affirm that -

• [x] My code follows the guidelines of this project.
  

• [x] I have performed a self-review of my own code.
  

• [x] I have commented my code.
  

• [x] My code gives the correct output.
  

• [x] I affirm that I strictly follow contributing guidelines and code of conduct.

[SarthakKeshari]

Congratulations 🎉 @1520229462 on your contribution. Thanks for adding value to this repository. 😊

Project is live at - https://calc-for-everything-psi.vercel.app/