react-audio-wavekit 0.2.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -44,8 +44,8 @@ declare interface AudioWaveformRef {
44
44
  }
45
45
 
46
46
  /**
47
- * 실시간 오디오 주파수 시각화 컴포넌트
48
- * MediaRecorder 오디오를 Web Audio API 분석하여 형태로 렌더링
47
+ * Real-time audio frequency visualization component
48
+ * Analyzes MediaRecorder audio via Web Audio API and renders as bars
49
49
  */
50
50
  export declare const LiveRecorder: ForwardRefExoticComponent<LiveRecorderProps & RefAttributes<LiveRecorderRef>>;
51
51
 
@@ -108,7 +108,7 @@ declare interface LiveStreamingRecorderCanvasProps extends HTMLAttributes<HTMLCa
108
108
  className?: string;
109
109
  /** Inline styles for canvas element */
110
110
  style?: React.CSSProperties;
111
- /** Waveform appearance configuration (barColor, barWidth, etc.) - scrollbar 설정은 Root에서만 유효 */
111
+ /** Waveform appearance configuration (barColor, barWidth, etc.) - scrollbar settings only apply in Root */
112
112
  appearance?: LiveStreamingRecorderAppearance;
113
113
  }
114
114
 
@@ -30,7 +30,7 @@ const LiveStreamingRecorderRoot = react.forwardRef(
30
30
  theme: themeClassName,
31
31
  visibility: hidden ? "hidden" : "auto",
32
32
  autoHide: "leave",
33
- // 마우스가 영역을 벗어나면 숨김 (가장 대중적인 UX)
33
+ // Hide when mouse leaves area (most common UX)
34
34
  autoHideDelay: 400,
35
35
  dragScroll: true,
36
36
  clickScroll: true
@@ -28,7 +28,7 @@ const LiveStreamingRecorderRoot = forwardRef(
28
28
  theme: themeClassName,
29
29
  visibility: hidden ? "hidden" : "auto",
30
30
  autoHide: "leave",
31
- // 마우스가 영역을 벗어나면 숨김 (가장 대중적인 UX)
31
+ // Hide when mouse leaves area (most common UX)
32
32
  autoHideDelay: 400,
33
33
  dragScroll: true,
34
34
  clickScroll: true
@@ -165,9 +165,9 @@ const WaveformRenderer = react.forwardRef(function WaveformRenderer2({ peaks, ap
165
165
  const mins = Math.floor(seconds / 60);
166
166
  const secs = Math.floor(seconds % 60);
167
167
  if (mins > 0) {
168
- return `${mins} ${secs}초`;
168
+ return `${mins} minute${mins > 1 ? "s" : ""} ${secs} second${secs !== 1 ? "s" : ""}`;
169
169
  }
170
- return `${secs}초`;
170
+ return `${secs} second${secs !== 1 ? "s" : ""}`;
171
171
  };
172
172
  const isInteractive = (!!onSeek || !!onSeekStart || !!onSeekDrag || !!onSeekEnd) && !!duration && duration > 0;
173
173
  const isDragEnabled = !!onSeekStart || !!onSeekDrag || !!onSeekEnd;
@@ -176,7 +176,7 @@ const WaveformRenderer = react.forwardRef(function WaveformRenderer2({ peaks, ap
176
176
  {
177
177
  ref: canvasRef,
178
178
  role: isInteractive ? "slider" : "img",
179
- "aria-label": isInteractive ? "오디오 탐색" : "오디오 파형",
179
+ "aria-label": isInteractive ? "Audio seek" : "Audio waveform",
180
180
  "aria-valuemin": isInteractive ? 0 : void 0,
181
181
  "aria-valuemax": isInteractive ? Math.floor(duration) : void 0,
182
182
  "aria-valuenow": isInteractive ? Math.floor(currentTime ?? 0) : void 0,
@@ -163,9 +163,9 @@ const WaveformRenderer = forwardRef(function WaveformRenderer2({ peaks, appearan
163
163
  const mins = Math.floor(seconds / 60);
164
164
  const secs = Math.floor(seconds % 60);
165
165
  if (mins > 0) {
166
- return `${mins} ${secs}초`;
166
+ return `${mins} minute${mins > 1 ? "s" : ""} ${secs} second${secs !== 1 ? "s" : ""}`;
167
167
  }
168
- return `${secs}초`;
168
+ return `${secs} second${secs !== 1 ? "s" : ""}`;
169
169
  };
170
170
  const isInteractive = (!!onSeek || !!onSeekStart || !!onSeekDrag || !!onSeekEnd) && !!duration && duration > 0;
171
171
  const isDragEnabled = !!onSeekStart || !!onSeekDrag || !!onSeekEnd;
@@ -174,7 +174,7 @@ const WaveformRenderer = forwardRef(function WaveformRenderer2({ peaks, appearan
174
174
  {
175
175
  ref: canvasRef,
176
176
  role: isInteractive ? "slider" : "img",
177
- "aria-label": isInteractive ? "오디오 탐색" : "오디오 파형",
177
+ "aria-label": isInteractive ? "Audio seek" : "Audio waveform",
178
178
  "aria-valuemin": isInteractive ? 0 : void 0,
179
179
  "aria-valuemax": isInteractive ? Math.floor(duration) : void 0,
180
180
  "aria-valuenow": isInteractive ? Math.floor(currentTime ?? 0) : void 0,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-audio-wavekit",
3
- "version": "0.2.0",
3
+ "version": "0.2.1",
4
4
  "license": "CC0-1.0",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -42,7 +42,9 @@
42
42
  },
43
43
  "peerDependencies": {
44
44
  "react": ">=18.0.0",
45
- "react-dom": ">=18.0.0"
45
+ "react-dom": ">=18.0.0",
46
+ "overlayscrollbars": "^2.0.0",
47
+ "overlayscrollbars-react": "^0.5.0"
46
48
  },
47
49
  "devDependencies": {
48
50
  "@biomejs/biome": "2.3.8",
@@ -68,8 +70,6 @@
68
70
  "vitest": "^4.0.15"
69
71
  },
70
72
  "dependencies": {
71
- "mpg123-decoder": "^1.0.3",
72
- "overlayscrollbars": "^2.13.0",
73
- "overlayscrollbars-react": "^0.5.6"
73
+ "mpg123-decoder": "^1.0.3"
74
74
  }
75
75
  }