scribe-widget 1.0.0 → 1.0.2
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/.prettierrc +7 -0
- package/FLOW.md +94 -0
- package/README.md +1 -0
- package/dist/scribe-widget.es.js +1102 -1141
- package/dist/scribe-widget.umd.js +12 -12
- package/package.json +4 -2
- package/src/App.tsx +2 -4
- package/src/index.tsx +35 -18
- package/src/types.ts +2 -2
- package/vite.config.ts +2 -1
package/.prettierrc
ADDED
package/FLOW.md
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
EkaScribe.init(config)
|
|
2
|
+
│
|
|
3
|
+
▼
|
|
4
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
5
|
+
│ src/index.tsx - initEkaScribe() │
|
|
6
|
+
│ 1. Creates new ScribeWidget(config) │
|
|
7
|
+
│ 2. Calls widget.mount() → appends to document.body │
|
|
8
|
+
└──────────────────────────────────────────────────────────────┘
|
|
9
|
+
│
|
|
10
|
+
▼
|
|
11
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
12
|
+
│ src/index.tsx - ScribeWidget class constructor │
|
|
13
|
+
│ 1. Creates <div id="eka-scribe-widget"> │
|
|
14
|
+
│ 2. Attaches Shadow DOM (closed mode) │
|
|
15
|
+
│ 3. Injects CSS into shadow root │
|
|
16
|
+
│ 4. Creates React root inside shadow DOM │
|
|
17
|
+
│ 5. Renders <App config={config} /> │
|
|
18
|
+
└──────────────────────────────────────────────────────────────┘
|
|
19
|
+
│
|
|
20
|
+
▼
|
|
21
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
22
|
+
│ src/App.tsx │
|
|
23
|
+
│ 1. Checks: does config have baseUrl? │
|
|
24
|
+
│ - YES → credentials = { apiKey, baseUrl } │
|
|
25
|
+
│ - NO → credentials = null → shows ConfigState │
|
|
26
|
+
│ 2. Calls useScribeSession(config) hook │
|
|
27
|
+
│ 3. Renders <FloatingPanel> with content based on state │
|
|
28
|
+
└──────────────────────────────────────────────────────────────┘
|
|
29
|
+
│
|
|
30
|
+
▼
|
|
31
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
32
|
+
│ src/hooks/useScribeSession.ts - useEffect │
|
|
33
|
+
│ 1. Checks: config.baseUrl exists? │
|
|
34
|
+
│ - YES → Creates ScribeClient, calls client.init() │
|
|
35
|
+
│ - NO → Skips SDK initialization │
|
|
36
|
+
│ 2. Returns state='idle' initially │
|
|
37
|
+
└──────────────────────────────────────────────────────────────┘
|
|
38
|
+
│
|
|
39
|
+
▼
|
|
40
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
41
|
+
│ User sees: FloatingPanel with IdleState │
|
|
42
|
+
│ ┌─────────────────────────────────────────┐ │
|
|
43
|
+
│ │ [:::] eka.scribe [Start Recording 🎤]│ │
|
|
44
|
+
│ └─────────────────────────────────────────┘ │
|
|
45
|
+
└──────────────────────────────────────────────────────────────┘
|
|
46
|
+
│
|
|
47
|
+
│ User clicks "Start Recording"
|
|
48
|
+
▼
|
|
49
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
50
|
+
│ useScribeSession.ts - startRecording() │
|
|
51
|
+
│ 1. checkMicrophonePermission() │
|
|
52
|
+
│ - 'denied' → showError() │
|
|
53
|
+
│ - 'prompt' → setState('permission'), request access │
|
|
54
|
+
│ - 'granted' → continue │
|
|
55
|
+
│ 2. client.startRecording({ templates, languageHint }) │
|
|
56
|
+
│ 3. setState('recording') │
|
|
57
|
+
│ 4. startTimer() │
|
|
58
|
+
└──────────────────────────────────────────────────────────────┘
|
|
59
|
+
│
|
|
60
|
+
▼
|
|
61
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
62
|
+
│ User sees: RecordingState │
|
|
63
|
+
│ ┌─────────────────────────────────────────┐ │
|
|
64
|
+
│ │ [💬] 00:15 [Pause] [■ Stop] │ │
|
|
65
|
+
│ └─────────────────────────────────────────┘ │
|
|
66
|
+
└──────────────────────────────────────────────────────────────┘
|
|
67
|
+
│
|
|
68
|
+
│ User clicks Stop
|
|
69
|
+
▼
|
|
70
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
71
|
+
│ useScribeSession.ts - stopRecording() │
|
|
72
|
+
│ 1. stopTimer() │
|
|
73
|
+
│ 2. setState('processing') │
|
|
74
|
+
│ 3. await client.endRecording() │
|
|
75
|
+
│ 4. await client.pollForCompletion() ← waits for transcript │
|
|
76
|
+
│ 5. setState('results') │
|
|
77
|
+
│ 6. config.onResult(result) ← YOUR CALLBACK IS CALLED HERE │
|
|
78
|
+
└──────────────────────────────────────────────────────────────┘
|
|
79
|
+
│
|
|
80
|
+
▼
|
|
81
|
+
┌──────────────────────────────────────────────────────────────┐
|
|
82
|
+
│ User sees: ResultsState │
|
|
83
|
+
│ Your onResult callback receives the transcript data │
|
|
84
|
+
└──────────────────────────────────────────────────────────────┘
|
|
85
|
+
|
|
86
|
+
|
|
87
|
+
## Key Files in the Flow
|
|
88
|
+
Step File Function
|
|
89
|
+
1 index.tsx:81-87 initEkaScribe() - entry point
|
|
90
|
+
2 index.tsx:18-45 ScribeWidget constructor - Shadow DOM setup
|
|
91
|
+
3 App.tsx:17-24 Credential check
|
|
92
|
+
4 useScribeSession.ts:34-57 SDK initialization
|
|
93
|
+
5 useScribeSession.ts:98-138 startRecording()
|
|
94
|
+
6 useScribeSession.ts:167-202 stopRecording() → calls your onResult
|
package/README.md
CHANGED