feat: add configurable bar count for ScaleLoader (#617)

* [ScaleLoader] Configurable bar count

* Update src/ScaleLoader.tsx

* Update src/ScaleLoader.tsx

* Update src/ScaleLoader.tsx

* Update src/ScaleLoader.tsx

---------

Co-authored-by: David Hu <davidhu314@gmail.com>

Author: BlueManCZ

src/ScaleLoader.tsx

@@ -19,8 +19,9 @@ function ScaleLoader({
   width = 4,
   radius = 2,
   margin = 2,
+  barCount = 5,
   ...additionalprops
-}: LoaderHeightWidthRadiusProps): JSX.Element | null {
+}: LoaderHeightWidthRadiusProps & { barCount: number }): JSX.Element | null {
   const wrapper: React.CSSProperties = {
     display: "inherit",
     ...cssOverride,
@@ -45,11 +46,9 @@ function ScaleLoader({
 
   return (
     <span style={wrapper} {...additionalprops}>
-      <span style={style(1)} />
-      <span style={style(2)} />
-      <span style={style(3)} />
-      <span style={style(4)} />
-      <span style={style(5)} />
+      {[...Array(barCount)].map((_, i) => (
+        <span key={i} style={style(i + 1)} />
+      ))}
     </span>
   );
 }