Improves bar visualizer animations and adds initializing state (#987)

Co-authored-by: lukasIO <mail@lukasseiler.de>

Author: mattherzog

.changeset/ninety-cheetahs-tickle.md

@@ -0,0 +1,5 @@
+---
+"@livekit/components-react": patch
+---
+
+Improve bar visualizer animations and add initializing state

packages/react/src/components/participant/BarVisualizer.tsx

@@ -30,7 +30,8 @@ export interface BarVisualizerProps extends React.HTMLProps<HTMLDivElement> {
 }
 
 const sequencerIntervals = new Map<AgentState, number>([
-  ['connecting', 25 * 15],
+  ['connecting', 2000],
+  ['initializing', 2000],
   ['listening', 500],
   ['thinking', 150],
 ]);

packages/react/src/components/participant/animationSequences/connectingSequence.ts

@@ -1,7 +1,7 @@
 export const generateConnectingSequenceBar = (columns: number): number[][] => {
   const seq = [];
 
-  for (let x = 0; x <= columns; x++) {
+  for (let x = 0; x < columns; x++) {
     seq.push([x, columns - 1 - x]);
   }