@overlap.ai/react-video-subtitles 1.2.1 → 2.1.0
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/hooks/useRelativeNumber.d.ts +2 -0
- package/dist/hooks/useTextStyle.d.ts +1 -0
- package/dist/index.esm.js +712 -171
- package/dist/index.js +710 -169
- package/dist/types/components.d.ts +1 -0
- package/dist/types/subtitles.d.ts +11 -6
- package/dist/utils/saveSubtitlePreset.d.ts +27 -0
- package/package.json +7 -2
|
@@ -15,5 +15,6 @@ export interface SubtitleTextProps {
|
|
|
15
15
|
randomColors?: StyleConfig['randomColors'];
|
|
16
16
|
highlightWords?: string[];
|
|
17
17
|
highlightWordsColor?: string;
|
|
18
|
+
lineCount?: number;
|
|
18
19
|
}
|
|
19
20
|
export type SubtitleComponent = React.ComponentType<SubtitleTextProps> | React.MemoExoticComponent<React.ComponentType<SubtitleTextProps>>;
|
|
@@ -16,7 +16,7 @@ export interface StyleConfig {
|
|
|
16
16
|
name: string;
|
|
17
17
|
captionPosition: "bottom" | "middle";
|
|
18
18
|
amplifiedColor: string;
|
|
19
|
-
amplifiedOpacity?:
|
|
19
|
+
amplifiedOpacity?: number;
|
|
20
20
|
amplifySpokenWords: boolean;
|
|
21
21
|
fontFamily: string;
|
|
22
22
|
fontWeight: string;
|
|
@@ -33,26 +33,30 @@ export interface StyleConfig {
|
|
|
33
33
|
shadowEnabled?: boolean;
|
|
34
34
|
shadowIntensity?: number;
|
|
35
35
|
backgroundColor?: string;
|
|
36
|
-
backgroundOpacity?:
|
|
36
|
+
backgroundOpacity?: number;
|
|
37
37
|
backgroundPadding?: string | number;
|
|
38
38
|
backgroundPaddingX?: string | number;
|
|
39
39
|
backgroundPaddingY?: string | number;
|
|
40
40
|
backgroundBorderRadius?: string | number;
|
|
41
41
|
backgroundFillStyle?: "wrap" | "none";
|
|
42
42
|
textSpacing?: string | number;
|
|
43
|
-
|
|
43
|
+
lineCount?: number;
|
|
44
|
+
maxCharsPerLine?: number;
|
|
45
|
+
textAlign?: string;
|
|
46
|
+
lineSpacing?: number;
|
|
47
|
+
animationStyle?: string | 'spring-word' | 'fade' | 'fade-word' | 'intense' | 'tiktok';
|
|
44
48
|
isItalic?: boolean;
|
|
45
49
|
shinyWordHighlight?: boolean;
|
|
46
50
|
shinySegmentHighlight?: boolean;
|
|
47
51
|
verticalStretch?: string | number;
|
|
48
|
-
opacity?:
|
|
52
|
+
opacity?: number;
|
|
49
53
|
textHighlightPersists?: boolean;
|
|
50
54
|
currentWordBlock?: boolean;
|
|
51
55
|
currentWordBlockBorderRadius?: string | number;
|
|
52
56
|
currentWordBlockBackgroundColor?: string;
|
|
53
|
-
currentWordBlockOpacity?:
|
|
57
|
+
currentWordBlockOpacity?: number;
|
|
54
58
|
currentWordBlockPadding?: string | number;
|
|
55
|
-
amplifyOpacityTransitionDuration?:
|
|
59
|
+
amplifyOpacityTransitionDuration?: number;
|
|
56
60
|
randomColors?: {
|
|
57
61
|
enabled?: boolean | string;
|
|
58
62
|
colors?: Array<{
|
|
@@ -72,6 +76,7 @@ export interface StyleConfig {
|
|
|
72
76
|
export interface SubtitlesProps {
|
|
73
77
|
words: SegmentWord[];
|
|
74
78
|
maxCharsPerLine?: number;
|
|
79
|
+
lineCount?: number;
|
|
75
80
|
styleConfig: StyleConfig;
|
|
76
81
|
x: number;
|
|
77
82
|
y: number;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export function saveSubtitlePreset(presetData: any): Promise<{
|
|
2
|
+
success: boolean;
|
|
3
|
+
id: any;
|
|
4
|
+
error?: undefined;
|
|
5
|
+
} | {
|
|
6
|
+
success: boolean;
|
|
7
|
+
error: any;
|
|
8
|
+
id?: undefined;
|
|
9
|
+
}>;
|
|
10
|
+
export function updateSubtitlePreset(id: any, presetData: any): Promise<{
|
|
11
|
+
success: boolean;
|
|
12
|
+
id: any;
|
|
13
|
+
error?: undefined;
|
|
14
|
+
} | {
|
|
15
|
+
success: boolean;
|
|
16
|
+
error: any;
|
|
17
|
+
id?: undefined;
|
|
18
|
+
}>;
|
|
19
|
+
export function deleteSubtitlePreset(id: any): Promise<{
|
|
20
|
+
success: boolean;
|
|
21
|
+
id: any;
|
|
22
|
+
error?: undefined;
|
|
23
|
+
} | {
|
|
24
|
+
success: boolean;
|
|
25
|
+
error: any;
|
|
26
|
+
id?: undefined;
|
|
27
|
+
}>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@overlap.ai/react-video-subtitles",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "A React component for rendering animated subtitles in videos",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.esm.js",
|
|
@@ -14,7 +14,9 @@
|
|
|
14
14
|
"build": "npx rollup -c",
|
|
15
15
|
"typecheck": "tsc --noEmit",
|
|
16
16
|
"test-build": "rm -rf *.tgz && rm -rf dist && npm run build && npm pack && cd test-subtitles && npm uninstall @overlap.ai/react-video-subtitles && rm -rf node_modules && npm install && npm install $(ls ../*.tgz) && npm start",
|
|
17
|
-
"dev": "vite",
|
|
17
|
+
"dev": "concurrently \"vite\" \"node dev-server.js\"",
|
|
18
|
+
"dev:client": "vite",
|
|
19
|
+
"dev:server": "node dev-server.js",
|
|
18
20
|
"test:build": "cd test-subtitles && npm start",
|
|
19
21
|
"test:both": "concurrently \"npm run dev\" \"npm run test:build\""
|
|
20
22
|
},
|
|
@@ -45,7 +47,10 @@
|
|
|
45
47
|
"@types/react-dom": "^18.0.0",
|
|
46
48
|
"@vitejs/plugin-react": "^4.3.4",
|
|
47
49
|
"concurrently": "^8.0.0",
|
|
50
|
+
"cors": "^2.8.5",
|
|
51
|
+
"express": "^4.18.2",
|
|
48
52
|
"firebase": "^10.14.1",
|
|
53
|
+
"firebase-admin": "^12.0.0",
|
|
49
54
|
"postcss": "^8.4.0",
|
|
50
55
|
"rollup": "^3.0.0",
|
|
51
56
|
"rollup-plugin-copy": "^3.5.0",
|