Skip to content

Commit 440876d

Browse files
committed
Update Readme
1 parent f1d23cd commit 440876d

File tree

3 files changed

+67
-29
lines changed

3 files changed

+67
-29
lines changed

README.md

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -22,14 +22,6 @@ Experience the [Demo App: Click here to explore the react-voice-visualizer](http
2222

2323
This README provides a comprehensive guide to effectively utilizing the library's features.
2424

25-
## Version 2.x.x Release Notes
26-
27-
**Breaking Changes:**
28-
- Ref Handling Update: In this version, the library has been enhanced to manage audio references (audioRef) internally. Users no longer need to pass ref={audioRef} separately to components. This change offers a more seamless and intuitive experience.
29-
30-
**New Features:**
31-
- Preloaded Audio Blob Support: Version 2.x.x introduces the capability to set preloaded audio blobs. Users now have the flexibility to load audio blobs from various sources, such as user inputs or files using `setPreloadedAudioBlob` function, expanding the library's versatility in different scenarios.
32-
3325
## Installation
3426

3527
To integrate the React Voice Visualizer library into your project, simply install it via npm or yarn:
@@ -44,6 +36,14 @@ or
4436
yarn add react-voice-visualizer
4537
```
4638

39+
## Version 2.x.x Release Notes
40+
41+
**Breaking Changes:**
42+
- Ref Handling Update: In this version, the library has been enhanced to manage audio references (audioRef) internally. Users no longer need to pass ref={audioRef} separately to components. This change offers a more seamless and intuitive experience.
43+
44+
**New Features:**
45+
- Preloaded Audio Blob Support: Version 2.x.x introduces the capability to set preloaded audio blobs. Users now have the flexibility to load audio blobs from various sources, such as user inputs or files using `setPreloadedAudioBlob` function, expanding the library's versatility in different scenarios.
46+
4747
## [Demo App](https://react-voice-visualizer.vercel.app/)
4848
For a live demonstration of the React Voice Visualizer library, you can check out the [Demo Voice Visualizer App](https://react-voice-visualizer.vercel.app/). This app showcases various features and functionalities of the library in action.
4949

@@ -170,7 +170,6 @@ A component that visualizes the real-time audio wave during recording.
170170

171171
| Props | Description | Default | Type |
172172
|:--------------------------------------------------|:--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|:--------------|:-----------------------------|
173-
| **`ref`** | A reference to the audio element - `audioRef` from the `useVoiceVisualizer` hook. | - | `React.RefObject` (Required) |
174173
| **`controls`** | Provides the audio recording controls and states required for visualization. | - | `Controls` (Required) |
175174
| **`height`** | The height of the visualization canvas. | `200` | `string \| number` (Optional) |
176175
| **`width`** | The width of the visualization canvas. | `100%` | `string \| number` (Optional) |
@@ -187,7 +186,7 @@ A component that visualizes the real-time audio wave during recording.
187186
| **`animateCurrentPick`** | Whether to animate the current pick in the visualization. | `true` | `boolean` (Optional) |
188187
| **`onlyRecording`** | Whether to show the visualization only during voice recording. | `false` | `boolean` (Optional) |
189188
| **`isDefaultUIShown`** | Whether to show a default UI on Canvas before recording. If you want to create your own UI, set it to false. | `true` | `boolean` (Optional) |
190-
| **`mainContainerClassName`** | The CSS class name for the main container. | - | `string` (Optional) |
189+
| **`mainContainerClassName`** | The CSS class name for the main container. | - | `string` (Optional) |
191190
| **`canvasContainerClassName`** | The CSS class name for the container of the visualization canvas. | - | `string` (Optional) |
192191
| **`isProgressIndicatorShown`** | Whether to show the progress indicator after recording. | `true` | `boolean` (Optional) |
193192
| **`progressIndicatorClassName`** | The CSS class name for the progress indicator. | - | `string` (Optional) |

package-lock.json

Lines changed: 57 additions & 19 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@
5858
"react-dom": "^18.2.0"
5959
},
6060
"devDependencies": {
61+
"@types/node": "^20.14.2",
6162
"@types/react": "^18.2.14",
6263
"@types/react-dom": "^18.2.6",
6364
"@typescript-eslint/eslint-plugin": "^6.6.0",

0 commit comments

Comments
 (0)