@clxrity/react-audio - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

dist/cjs/types/components/index.d.ts

@@ -1,5 +0,5 @@
-import AudioLibrary, { LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput } from "./lib/AudioLibrary";
-import AudioPlayer from "./lib/AudioPlayer";
-import JustPlayer from "./lib/JustPlayer";
-import Waveform from "./lib/Waveform";
-export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform };
+import AudioLibrary, { LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput } from './lib/AudioLibrary';
+import AudioPlayer from './lib/AudioPlayer';
+import JustPlayer from './lib/JustPlayer';
+import Waveform from './lib/Waveform';
+export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform, };

dist/cjs/types/components/lib/AudioLibrary/component/index.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { LibraryStyles, Track } from "../../../../types";
-interface AudioLibraryProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { LibraryStyles, Track } from '../../../../types';
+interface AudioLibraryProps extends ComponentPropsWithRef<'div'> {
     tracks: Track[];
@@ -5,0 +5,0 @@ styles?: LibraryStyles;

dist/cjs/types/components/lib/AudioLibrary/elements/Player.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef, ReactElement } from "react";
-import { Track } from "../../../../types";
-interface AudioLibraryProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef, ReactElement } from 'react';
+import { Track } from '../../../../types';
+interface AudioLibraryProps extends ComponentPropsWithRef<'div'> {
     currentTrack?: Track;
@@ -10,3 +10,3 @@ trackIndex: number;
 }
-export default function LibraryPlayer({ currentTrack, trackIndex, trackCount, onNext, onPrevious, ...props }: AudioLibraryProps): ReactElement<AudioLibraryProps, "div">;
+export default function LibraryPlayer({ currentTrack, trackIndex, trackCount, onNext, onPrevious, ...props }: AudioLibraryProps): ReactElement<AudioLibraryProps, 'div'>;
 export {};

dist/cjs/types/components/lib/AudioLibrary/elements/ProgressBar.d.ts

@@ -1,3 +0,3 @@
-import { ComponentPropsWithoutRef, ReactElement } from "react";
-interface ProgressBarProps extends ComponentPropsWithoutRef<"input"> {
+import { ComponentPropsWithoutRef, ReactElement } from 'react';
+interface ProgressBarProps extends ComponentPropsWithoutRef<'input'> {
     duration: number;
@@ -7,3 +7,3 @@ currentProgress: number;
 }
-export default function ProgressBar({ duration, currentProgress, buffered, ...props }: ProgressBarProps): ReactElement<ProgressBarProps, "div">;
+export default function ProgressBar({ duration, currentProgress, buffered, ...props }: ProgressBarProps): ReactElement<ProgressBarProps, 'div'>;
 export {};

dist/cjs/types/components/lib/AudioLibrary/elements/TrackItem.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithoutRef, ReactElement } from "react";
-import { Track } from "../../../../types";
-interface TrackItemProps extends ComponentPropsWithoutRef<"li"> {
+import { ComponentPropsWithoutRef, ReactElement } from 'react';
+import { Track } from '../../../../types';
+interface TrackItemProps extends ComponentPropsWithoutRef<'li'> {
     track: Track;
@@ -9,3 +9,3 @@ selected: boolean;
 }
-export default function LibraryTrackItem({ track, selected, trackNumberLabel, color, ...props }: TrackItemProps): ReactElement<TrackItemProps, "li">;
+export default function LibraryTrackItem({ track, selected, trackNumberLabel, color, ...props }: TrackItemProps): ReactElement<TrackItemProps, 'li'>;
 export {};

dist/cjs/types/components/lib/AudioLibrary/elements/VolumeInput.d.ts

@@ -1,7 +0,7 @@
-import { ComponentProps, ReactElement } from "react";
-interface VolumeInputProps extends ComponentProps<"input"> {
+import { ComponentProps, ReactElement } from 'react';
+interface VolumeInputProps extends ComponentProps<'input'> {
     volume: number;
     volumeChange: (volume: number) => void;
 }
-export default function VolumeInput({ volume, volumeChange, ...props }: VolumeInputProps): ReactElement<VolumeInputProps, "input">;
+export default function VolumeInput({ volume, volumeChange, ...props }: VolumeInputProps): ReactElement<VolumeInputProps, 'input'>;
 export {};

dist/cjs/types/components/lib/AudioPlayer/component/index.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { Track } from "../../../../types";
-interface AudioPlayerProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { Track } from '../../../../types';
+interface AudioPlayerProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -5,0 +5,0 @@ }

dist/cjs/types/components/lib/AudioPlayer/elements/TrackInfo.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { Track } from "../../../../types";
-interface TrackInfoProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { Track } from '../../../../types';
+interface TrackInfoProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -5,0 +5,0 @@ }

dist/cjs/types/components/lib/AudioPlayer/index.d.ts

@@ -1,2 +0,2 @@
-import AudioPlayer from "./component";
+import AudioPlayer from './component';
 export default AudioPlayer;

dist/cjs/types/components/lib/JustPlayer/component/index.d.ts

@@ -1,3 +0,3 @@
-import { ComponentProps, ReactElement } from "react";
-import { Track } from "../../../../types";
+import { ComponentProps, ReactElement } from 'react';
+import { Track } from '../../../../types';
 interface Props extends ComponentProps<'div'> {
@@ -13,3 +13,3 @@ track: Track;
  */
-export default function JustPlayer({ track, style, size, ...props }: Props): ReactElement<Props, "div">;
+export default function JustPlayer({ track, style, size, ...props }: Props): ReactElement<Props, 'div'>;
 export {};

dist/cjs/types/components/lib/JustPlayer/index.d.ts

@@ -1,2 +0,2 @@
-import JustPlayer from "./component";
+import JustPlayer from './component';
 export default JustPlayer;

dist/cjs/types/components/lib/Waveform/elements/Canvas.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { AnalyzerData } from "../../../../types";
-interface CanvasProps extends ComponentPropsWithRef<"canvas"> {
+import { ComponentPropsWithRef } from 'react';
+import { AnalyzerData } from '../../../../types';
+interface CanvasProps extends ComponentPropsWithRef<'canvas'> {
     analyzerdData: AnalyzerData;
@@ -5,0 +5,0 @@ color: string;

dist/cjs/types/components/lib/Waveform/elements/Player.d.ts

@@ -1,4 +0,4 @@
-import { ComponentProps, RefObject } from "react";
-import { Track } from "../../../../types";
-interface Props extends ComponentProps<"div"> {
+import { ComponentProps, RefObject } from 'react';
+import { Track } from '../../../../types';
+interface Props extends ComponentProps<'div'> {
     audioElement: RefObject<HTMLAudioElement>;
@@ -5,0 +5,0 @@ track: Track;

dist/cjs/types/components/lib/Waveform/index.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { Track } from "../../../types";
-interface WaveformProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { Track } from '../../../types';
+interface WaveformProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -5,0 +5,0 @@ color?: string;

dist/cjs/types/components/ui/Button/index.d.ts

@@ -1,6 +0,6 @@
-import { ComponentPropsWithoutRef } from "react";
-interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
-    size?: "sm" | "md" | "lg";
+import { ComponentPropsWithoutRef } from 'react';
+interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
+    size?: 'sm' | 'md' | 'lg';
     color?: string;
-    theme?: "light" | "dark";
+    theme?: 'light' | 'dark';
 }
@@ -7,0 +7,0 @@ /**

dist/cjs/types/components/ui/Progress/index.d.ts

@@ -1,2 +0,2 @@
-interface ProgressBarProps extends React.ComponentPropsWithoutRef<"input"> {
+interface ProgressBarProps extends React.ComponentPropsWithoutRef<'input'> {
     duration: number;
@@ -3,0 +3,0 @@ current_progress: number;

dist/cjs/types/components/ui/Volume/index.d.ts

@@ -1,3 +0,3 @@
-import { ComponentProps } from "react";
-interface VolumeProps extends ComponentProps<"div"> {
+import { ComponentProps } from 'react';
+interface VolumeProps extends ComponentProps<'div'> {
     volume: number;
@@ -4,0 +4,0 @@ volumeChange: (volume: number) => void;

dist/cjs/types/index.d.ts

@@ -1,3 +0,3 @@
-import { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform } from "./components";
-import { type Track } from "./types";
-export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, Track, VolumeInput, Waveform };
+import { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform } from './components';
+import { type Track } from './types';
+export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, Track, VolumeInput, Waveform, };

dist/cjs/types/types/index.d.ts

@@ -18,3 +18,3 @@ import React from 'react';
     boxShadow?: string;
-    theme?: "light" | "dark";
+    theme?: 'light' | 'dark';
     border?: string;
@@ -21,0 +21,0 @@ }

dist/cjs/types/utils/animateBars.d.ts

@@ -9,3 +9,3 @@ interface AnimateBarsParams {
 }
-export default function animateBars({ analyzer, canvas, canvasCtx, dataArray, bufferLength, color }: AnimateBarsParams): void;
+export default function animateBars({ analyzer, canvas, canvasCtx, dataArray, bufferLength, color, }: AnimateBarsParams): void;
 export {};

dist/esm/types/components/index.d.ts

@@ -1,5 +0,5 @@
-import AudioLibrary, { LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput } from "./lib/AudioLibrary";
-import AudioPlayer from "./lib/AudioPlayer";
-import JustPlayer from "./lib/JustPlayer";
-import Waveform from "./lib/Waveform";
-export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform };
+import AudioLibrary, { LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput } from './lib/AudioLibrary';
+import AudioPlayer from './lib/AudioPlayer';
+import JustPlayer from './lib/JustPlayer';
+import Waveform from './lib/Waveform';
+export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform, };

dist/esm/types/components/lib/AudioLibrary/component/index.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { LibraryStyles, Track } from "../../../../types";
-interface AudioLibraryProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { LibraryStyles, Track } from '../../../../types';
+interface AudioLibraryProps extends ComponentPropsWithRef<'div'> {
     tracks: Track[];
@@ -5,0 +5,0 @@ styles?: LibraryStyles;

dist/esm/types/components/lib/AudioLibrary/elements/Player.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef, ReactElement } from "react";
-import { Track } from "../../../../types";
-interface AudioLibraryProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef, ReactElement } from 'react';
+import { Track } from '../../../../types';
+interface AudioLibraryProps extends ComponentPropsWithRef<'div'> {
     currentTrack?: Track;
@@ -10,3 +10,3 @@ trackIndex: number;
 }
-export default function LibraryPlayer({ currentTrack, trackIndex, trackCount, onNext, onPrevious, ...props }: AudioLibraryProps): ReactElement<AudioLibraryProps, "div">;
+export default function LibraryPlayer({ currentTrack, trackIndex, trackCount, onNext, onPrevious, ...props }: AudioLibraryProps): ReactElement<AudioLibraryProps, 'div'>;
 export {};

dist/esm/types/components/lib/AudioLibrary/elements/ProgressBar.d.ts

@@ -1,3 +0,3 @@
-import { ComponentPropsWithoutRef, ReactElement } from "react";
-interface ProgressBarProps extends ComponentPropsWithoutRef<"input"> {
+import { ComponentPropsWithoutRef, ReactElement } from 'react';
+interface ProgressBarProps extends ComponentPropsWithoutRef<'input'> {
     duration: number;
@@ -7,3 +7,3 @@ currentProgress: number;
 }
-export default function ProgressBar({ duration, currentProgress, buffered, ...props }: ProgressBarProps): ReactElement<ProgressBarProps, "div">;
+export default function ProgressBar({ duration, currentProgress, buffered, ...props }: ProgressBarProps): ReactElement<ProgressBarProps, 'div'>;
 export {};

dist/esm/types/components/lib/AudioLibrary/elements/TrackItem.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithoutRef, ReactElement } from "react";
-import { Track } from "../../../../types";
-interface TrackItemProps extends ComponentPropsWithoutRef<"li"> {
+import { ComponentPropsWithoutRef, ReactElement } from 'react';
+import { Track } from '../../../../types';
+interface TrackItemProps extends ComponentPropsWithoutRef<'li'> {
     track: Track;
@@ -9,3 +9,3 @@ selected: boolean;
 }
-export default function LibraryTrackItem({ track, selected, trackNumberLabel, color, ...props }: TrackItemProps): ReactElement<TrackItemProps, "li">;
+export default function LibraryTrackItem({ track, selected, trackNumberLabel, color, ...props }: TrackItemProps): ReactElement<TrackItemProps, 'li'>;
 export {};

dist/esm/types/components/lib/AudioLibrary/elements/VolumeInput.d.ts

@@ -1,7 +0,7 @@
-import { ComponentProps, ReactElement } from "react";
-interface VolumeInputProps extends ComponentProps<"input"> {
+import { ComponentProps, ReactElement } from 'react';
+interface VolumeInputProps extends ComponentProps<'input'> {
     volume: number;
     volumeChange: (volume: number) => void;
 }
-export default function VolumeInput({ volume, volumeChange, ...props }: VolumeInputProps): ReactElement<VolumeInputProps, "input">;
+export default function VolumeInput({ volume, volumeChange, ...props }: VolumeInputProps): ReactElement<VolumeInputProps, 'input'>;
 export {};

dist/esm/types/components/lib/AudioPlayer/component/index.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { Track } from "../../../../types";
-interface AudioPlayerProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { Track } from '../../../../types';
+interface AudioPlayerProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -5,0 +5,0 @@ }

dist/esm/types/components/lib/AudioPlayer/elements/TrackInfo.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { Track } from "../../../../types";
-interface TrackInfoProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { Track } from '../../../../types';
+interface TrackInfoProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -5,0 +5,0 @@ }

dist/esm/types/components/lib/AudioPlayer/index.d.ts

@@ -1,2 +0,2 @@
-import AudioPlayer from "./component";
+import AudioPlayer from './component';
 export default AudioPlayer;

dist/esm/types/components/lib/JustPlayer/component/index.d.ts

@@ -1,3 +0,3 @@
-import { ComponentProps, ReactElement } from "react";
-import { Track } from "../../../../types";
+import { ComponentProps, ReactElement } from 'react';
+import { Track } from '../../../../types';
 interface Props extends ComponentProps<'div'> {
@@ -13,3 +13,3 @@ track: Track;
  */
-export default function JustPlayer({ track, style, size, ...props }: Props): ReactElement<Props, "div">;
+export default function JustPlayer({ track, style, size, ...props }: Props): ReactElement<Props, 'div'>;
 export {};

dist/esm/types/components/lib/JustPlayer/index.d.ts

@@ -1,2 +0,2 @@
-import JustPlayer from "./component";
+import JustPlayer from './component';
 export default JustPlayer;

dist/esm/types/components/lib/Waveform/elements/Canvas.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { AnalyzerData } from "../../../../types";
-interface CanvasProps extends ComponentPropsWithRef<"canvas"> {
+import { ComponentPropsWithRef } from 'react';
+import { AnalyzerData } from '../../../../types';
+interface CanvasProps extends ComponentPropsWithRef<'canvas'> {
     analyzerdData: AnalyzerData;
@@ -5,0 +5,0 @@ color: string;

dist/esm/types/components/lib/Waveform/elements/Player.d.ts

@@ -1,4 +0,4 @@
-import { ComponentProps, RefObject } from "react";
-import { Track } from "../../../../types";
-interface Props extends ComponentProps<"div"> {
+import { ComponentProps, RefObject } from 'react';
+import { Track } from '../../../../types';
+interface Props extends ComponentProps<'div'> {
     audioElement: RefObject<HTMLAudioElement>;
@@ -5,0 +5,0 @@ track: Track;

dist/esm/types/components/lib/Waveform/index.d.ts

@@ -1,4 +0,4 @@
-import { ComponentPropsWithRef } from "react";
-import { Track } from "../../../types";
-interface WaveformProps extends ComponentPropsWithRef<"div"> {
+import { ComponentPropsWithRef } from 'react';
+import { Track } from '../../../types';
+interface WaveformProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -5,0 +5,0 @@ color?: string;

dist/esm/types/components/ui/Button/index.d.ts

@@ -1,6 +0,6 @@
-import { ComponentPropsWithoutRef } from "react";
-interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
-    size?: "sm" | "md" | "lg";
+import { ComponentPropsWithoutRef } from 'react';
+interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
+    size?: 'sm' | 'md' | 'lg';
     color?: string;
-    theme?: "light" | "dark";
+    theme?: 'light' | 'dark';
 }
@@ -7,0 +7,0 @@ /**

dist/esm/types/components/ui/Progress/index.d.ts

@@ -1,2 +0,2 @@
-interface ProgressBarProps extends React.ComponentPropsWithoutRef<"input"> {
+interface ProgressBarProps extends React.ComponentPropsWithoutRef<'input'> {
     duration: number;
@@ -3,0 +3,0 @@ current_progress: number;

dist/esm/types/components/ui/Volume/index.d.ts

@@ -1,3 +0,3 @@
-import { ComponentProps } from "react";
-interface VolumeProps extends ComponentProps<"div"> {
+import { ComponentProps } from 'react';
+interface VolumeProps extends ComponentProps<'div'> {
     volume: number;
@@ -4,0 +4,0 @@ volumeChange: (volume: number) => void;

dist/esm/types/index.d.ts

@@ -1,3 +0,3 @@
-import { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform } from "./components";
-import { type Track } from "./types";
-export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, Track, VolumeInput, Waveform };
+import { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, VolumeInput, Waveform } from './components';
+import { type Track } from './types';
+export { AudioLibrary, AudioPlayer, JustPlayer, LibraryPlayer, LibraryTrackItem, ProgressBar, Track, VolumeInput, Waveform, };

dist/esm/types/types/index.d.ts

@@ -18,3 +18,3 @@ import React from 'react';
     boxShadow?: string;
-    theme?: "light" | "dark";
+    theme?: 'light' | 'dark';
     border?: string;
@@ -21,0 +21,0 @@ }

dist/esm/types/utils/animateBars.d.ts

@@ -9,3 +9,3 @@ interface AnimateBarsParams {
 }
-export default function animateBars({ analyzer, canvas, canvasCtx, dataArray, bufferLength, color }: AnimateBarsParams): void;
+export default function animateBars({ analyzer, canvas, canvasCtx, dataArray, bufferLength, color, }: AnimateBarsParams): void;
 export {};

dist/index.d.ts

@@ -20,7 +20,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
     boxShadow?: string;
-    theme?: "light" | "dark";
+    theme?: 'light' | 'dark';
     border?: string;
 }
 
-interface AudioLibraryProps$1 extends ComponentPropsWithRef<"div"> {
+interface AudioLibraryProps$1 extends ComponentPropsWithRef<'div'> {
     tracks: Track[];
@@ -31,3 +31,3 @@ styles?: LibraryStyles;
 
-interface AudioLibraryProps extends ComponentPropsWithRef<"div"> {
+interface AudioLibraryProps extends ComponentPropsWithRef<'div'> {
     currentTrack?: Track;
@@ -39,5 +39,5 @@ trackIndex: number;
 }
-declare function LibraryPlayer({ currentTrack, trackIndex, trackCount, onNext, onPrevious, ...props }: AudioLibraryProps): ReactElement<AudioLibraryProps, "div">;
+declare function LibraryPlayer({ currentTrack, trackIndex, trackCount, onNext, onPrevious, ...props }: AudioLibraryProps): ReactElement<AudioLibraryProps, 'div'>;
 
-interface ProgressBarProps extends ComponentPropsWithoutRef<"input"> {
+interface ProgressBarProps extends ComponentPropsWithoutRef<'input'> {
     duration: number;
@@ -47,5 +47,5 @@ currentProgress: number;
 }
-declare function ProgressBar({ duration, currentProgress, buffered, ...props }: ProgressBarProps): ReactElement<ProgressBarProps, "div">;
+declare function ProgressBar({ duration, currentProgress, buffered, ...props }: ProgressBarProps): ReactElement<ProgressBarProps, 'div'>;
 
-interface TrackItemProps extends ComponentPropsWithoutRef<"li"> {
+interface TrackItemProps extends ComponentPropsWithoutRef<'li'> {
     track: Track;
@@ -56,11 +56,11 @@ selected: boolean;
 }
-declare function LibraryTrackItem({ track, selected, trackNumberLabel, color, ...props }: TrackItemProps): ReactElement<TrackItemProps, "li">;
+declare function LibraryTrackItem({ track, selected, trackNumberLabel, color, ...props }: TrackItemProps): ReactElement<TrackItemProps, 'li'>;
 
-interface VolumeInputProps extends ComponentProps<"input"> {
+interface VolumeInputProps extends ComponentProps<'input'> {
     volume: number;
     volumeChange: (volume: number) => void;
 }
-declare function VolumeInput({ volume, volumeChange, ...props }: VolumeInputProps): ReactElement<VolumeInputProps, "input">;
+declare function VolumeInput({ volume, volumeChange, ...props }: VolumeInputProps): ReactElement<VolumeInputProps, 'input'>;
 
-interface AudioPlayerProps extends ComponentPropsWithRef<"div"> {
+interface AudioPlayerProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -80,5 +80,5 @@ }
  */
-declare function JustPlayer({ track, style, size, ...props }: Props): ReactElement<Props, "div">;
+declare function JustPlayer({ track, style, size, ...props }: Props): ReactElement<Props, 'div'>;
 
-interface WaveformProps extends ComponentPropsWithRef<"div"> {
+interface WaveformProps extends ComponentPropsWithRef<'div'> {
     track: Track;
@@ -85,0 +85,0 @@ color?: string;

package.json

 {
   "name": "@clxrity/react-audio",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "A simple audio player for React",
@@ -64,2 +64,3 @@ "main": "dist/cjs/index.js",
     "postcss": "^8.4.41",
+    "prettier": "3.3.3",
     "rollup": "^4.21.0",
@@ -80,5 +81,6 @@ "rollup-plugin-dts": "^6.1.1",
     "build": "rollup -c",
+    "release": "pnpm build && changeset version && changeset publish",
     "test": "cd test && pnpm dev",
-    "release": "pnpm build && changeset version && changeset publish"
+    "lint": "prettier -c --write ./src/*"
   }
 }

README.md

@@ -1,5 +0,3 @@
-# `@clxrity/react-audio`
+# `@clxrity/react-audio` <img src="./icon.png" width="32px" height="32px" style="display:inline-block;" />
 
-## [ BETA ]
-
 A react audio player component library.
@@ -10,5 +8,7 @@
 ```
+
 ```zsh
 pnpm add @clxrity/react-audio
 ```
+
 ```zsh
@@ -24,8 +24,8 @@ yarn add @clxrity/react-audio
 
-| Component                              | Controls                                                 | Customizable |
-| -------------------------------------- | -------------------------------------------------------- | :----------: |
-| [**`<JustPlayer/>`**](#justplayer)     | Play/pause                                               |      ✅      |
-| [**`<Waveform />`**](#waveform)        | Play/pause, volume, progress, mute/unmute                |      ✅      |
-| [**`<AudioPlayer/>`**](#audioplayer)   | Play/pause, volume, progress, mute/unmute                |      ✅      |
-| [**`<AudioLibrary/>`**](#audiolibrary) | Play/pause, volume, progress, mute/unmute, next/previous |      ✅      |
+| Component                              | Controls                                                 | Customizable | Display Track Info |
+| -------------------------------------- | -------------------------------------------------------- | :----------: | :----------------: |
+| [**`<JustPlayer/>`**](#justplayer)     | Play/pause                                               |      ✅      |         ❌         |
+| [**`<Waveform />`**](#waveform)        | Play/pause, volume, progress, mute/unmute                |      ✅      |         ❌         |
+| [**`<AudioPlayer/>`**](#audioplayer)   | Play/pause, volume, progress, mute/unmute                |      ✅      |         ✅         |
+| [**`<AudioLibrary/>`**](#audiolibrary) | Play/pause, volume, progress, mute/unmute, next/previous |      ✅      |         ✅         |
 
@@ -38,22 +38,22 @@ ---
 
-- _Just a play button_
-- Customizable style
-- Loading state
+-   _Just a play button_
+-   Customizable style
+-   Loading state
 
 #### Use-case
 
-- Best for mapping over audio files in a visually small listed component
+-   Best for mapping over audio files in a visually small listed component
 
 ```tsx
-"use client";
-import { JustPlayer } from "@clxrity/react-audio";
+'use client'
+import { JustPlayer } from '@clxrity/react-audio'
 
 export default function Component() {
-  return (
-    <JustPlayer
-      track={{
-        src: "/audio.wav",
-      }}
-    />
-  );
+    return (
+        <JustPlayer
+            track={{
+                src: '/audio.wav',
+            }}
+        />
+    )
 }
@@ -88,30 +88,30 @@ ```
 
-- Audio wave visualizer
-- Screen responsive
-- Volume controls
-- Progress bar
+-   Audio wave visualizer
+-   Screen responsive
+-   Volume controls
+-   Progress bar
 
 ### Use-case
 
-- Best for displaying the audio wave
+-   Best for displaying the audio wave
 
 ```tsx
-"use client";
-import { type Track, Waveform } from "@clxrity/react-audio";
+'use client'
+import { type Track, Waveform } from '@clxrity/react-audio'
 
 const track: Track = {
-  // ...
-};
+    // ...
+}
 
 export default function Component() {
-  return (
-    <Waveform
-      track={track}
-      size={{
-        width: window.innerWidth,
-        height: window.innerHeight,
-      }}
-      color="#ff0000"
-    />
-  );
+    return (
+        <Waveform
+            track={track}
+            size={{
+                width: window.innerWidth,
+                height: window.innerHeight,
+            }}
+            color="#ff0000"
+        />
+    )
 }
@@ -125,18 +125,18 @@ ```
 ```tsx
-"use client";
+'use client'
 
 export default function Component() {
-  return (
-    <Waveform
-      track={track}
-      canvasStyles={{
-        borderRadius: "0.5rem",
-        border: "1px solid #333",
-      }}
-      size={{
-        width: 300,
-        height: 120,
-      }}
-    />
-  );
+    return (
+        <Waveform
+            track={track}
+            canvasStyles={{
+                borderRadius: '0.5rem',
+                border: '1px solid #333',
+            }}
+            size={{
+                width: 300,
+                height: 120,
+            }}
+        />
+    )
 }
@@ -153,27 +153,27 @@ ```
 
-- Visualized audio player
-- Screen responsive
-- Volume controls
-- Progress bar
+-   Visualized audio player
+-   Screen responsive
+-   Volume controls
+-   Progress bar
 
 ### Use-case
 
-- Best for displaying a singular audio track
+-   Best for displaying a singular audio track
 
 ```tsx
-"use client";
-import { type Track, AudioPlayer } from "@clxrity/react-audio";
+'use client'
+import { type Track, AudioPlayer } from '@clxrity/react-audio'
 
 const track: Track = {
-  src: "/audio.wav",
-  title: "Track Title",
-  author: {
-    name: "Track Author",
-    url: "https://www.someurl.com",
-  },
-  thumbnail: "./favicon.ico",
-};
+    src: '/audio.wav',
+    title: 'Track Title',
+    author: {
+        name: 'Track Author',
+        url: 'https://www.someurl.com',
+    },
+    thumbnail: './favicon.ico',
+}
 
 export default function Component() {
-  return <AudioPlayer track={track} />;
+    return <AudioPlayer track={track} />
 }
@@ -191,24 +191,24 @@ ```
 
-- A visualized audio library with multiple tracks
-- Controls
-- Progress bar
-- Volume control
-- Screen responsive
-- Autoplay next song
+-   A visualized audio library with multiple tracks
+-   Controls
+-   Progress bar
+-   Volume control
+-   Screen responsive
+-   Autoplay next song
 
 ### Use-case
 
-- Best for displaying collections of audio files
+-   Best for displaying collections of audio files
 
 ```tsx
-"use client";
-import { AudioLibrary } from "@clxrity/react-audio";
-import { tracks } from "./data";
+'use client'
+import { AudioLibrary } from '@clxrity/react-audio'
+import { tracks } from './data'
 
 export default function Component() {
-  return (
-    <div>
-      <AudioLibrary tracks={tracks} />
-    </div>
-  );
+    return (
+        <div>
+            <AudioLibrary tracks={tracks} />
+        </div>
+    )
 }
@@ -223,10 +223,10 @@ ```
 <AudioLibrary
-  tracks={tracks}
-  styles={{
-    backgroundColor: "transparent",
-    textColor: "white",
-    boxShadow: "10px 5px 5px red",
-    theme: "dark",
-    border: "1px solid white",
-  }}
+    tracks={tracks}
+    styles={{
+        backgroundColor: 'transparent',
+        textColor: 'white',
+        boxShadow: '10px 5px 5px red',
+        theme: 'dark',
+        border: '1px solid white',
+    }}
 />
@@ -241,50 +241,50 @@ ```
 import {
-  LibraryPlayer, // The player component
-  LibraryTrackItem, // Individual track component
-} from "@clxrity/react-audio";
+    LibraryPlayer, // The player component
+    LibraryTrackItem, // Individual track component
+} from '@clxrity/react-audio'
 ```
 
-- Define states yourself
+-   Define states yourself
 
 ```tsx
-"use client";
+'use client'
 import {
-  type Track,
-  // ...
-} from "@clxrity/react-audio";
-import { useState } from "react";
+    type Track,
+    // ...
+} from '@clxrity/react-audio'
+import { useState } from 'react'
 
 const tracks: Track[] = [
-  // ...
-];
+    // ...
+]
 
 export default function Component() {
-  const [currentTrackIndex, setCurrentTrackIndex] = useState(-1);
+    const [currentTrackIndex, setCurrentTrackIndex] = useState(-1)
 
-  const currentTrack = tracks[currentTrackIndex];
+    const currentTrack = tracks[currentTrackIndex]
 
-  return (
-    <div>
-      <h1>My songs</h1>
-      <ul>
-        {tracks.map((track, index) => (
-          <LibraryTrackItem
-            key={index}
-            selected={index === currentTrackIndex}
-            track={track}
-            trackNumberLabel={index}
-            onClick={() => setCurrentTrackIndex(index)}
-          />
-        ))}
-      </ul>
-      <LibraryPlayer
-        key={currentTrackIndex}
-        currentTrack={currentTrack}
-        trackIndex={current}
-        trackCount={tracks.length}
-        onNext={() => setCurrentTrackIndex((i) => i + 1)}
-        onPrev={() => setCurrentTrackIndex((i) => i - 1)}
-      />
-    </div>
-  );
+    return (
+        <div>
+            <h1>My songs</h1>
+            <ul>
+                {tracks.map((track, index) => (
+                    <LibraryTrackItem
+                        key={index}
+                        selected={index === currentTrackIndex}
+                        track={track}
+                        trackNumberLabel={index}
+                        onClick={() => setCurrentTrackIndex(index)}
+                    />
+                ))}
+            </ul>
+            <LibraryPlayer
+                key={currentTrackIndex}
+                currentTrack={currentTrack}
+                trackIndex={current}
+                trackCount={tracks.length}
+                onNext={() => setCurrentTrackIndex((i) => i + 1)}
+                onPrev={() => setCurrentTrackIndex((i) => i - 1)}
+            />
+        </div>
+    )
 }
@@ -299,6 +299,6 @@ ```
 
-- Uploads with [react-hook-form](https://react-hook-form.com/)
-- Store audio files with [firebase](https://firebase.google.com/)
-- Hover card with [shadcnui](https://ui.shadcn.com/)
+-   Uploads with [react-hook-form](https://react-hook-form.com/)
+-   Store audio files with [firebase](https://firebase.google.com/)
+-   Hover card with [shadcnui](https://ui.shadcn.com/)
 
 ##### See [examples](/examples/README.md) for more specific usage demonstrations

No alert changes

Improved metrics

Total package byte prevSize

3857950

increased by0.56%

Number of package files

240

increased by33.33%

Lines of code

5848

increased by9.49%

Worsened metrics

Dev dependency count

16

increased by6.67%

No dependency changes