dmed-voice-assistant 1.0.3 → 1.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.
@@ -0,0 +1,513 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = require("react");
8
+ var _material = require("@mui/material");
9
+ var _Grid = _interopRequireDefault(require("@mui/material/Grid2"));
10
+ var _svgs = require("./components/svgs");
11
+ var _StyledSelect = _interopRequireDefault(require("./components/StyledSelect"));
12
+ var _RecordListItem = _interopRequireDefault(require("./components/RecordListItem"));
13
+ var _recorderJs = _interopRequireDefault(require("recorder-js"));
14
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
15
+ const apiUrl = 'https://api.origintechx.dev/qa/v1/diagnose/voice';
16
+ const getVoiceFileName = date => {
17
+ const year = date.getFullYear(); // Get the full year (YYYY)
18
+ const month = String(date.getMonth() + 1).padStart(2, '0'); // Get the month (MM), pad with leading zero if necessary
19
+ const day = String(date.getDate()).padStart(2, '0'); // Get the day (DD), pad with leading zero if necessary
20
+
21
+ return `Voice${year}${month}${day}.wav`;
22
+ };
23
+ const getTimeValues = totalSeconds => {
24
+ const hours = Math.floor(totalSeconds / 3600); // Get hours
25
+ let minutes = Math.floor(totalSeconds % 3600 / 60); // Get minutes
26
+ let seconds = totalSeconds % 60; // Get seconds
27
+
28
+ minutes = minutes < 10 ? `0${minutes}` : minutes;
29
+ seconds = seconds < 10 ? `0${seconds}` : seconds;
30
+ return {
31
+ hours,
32
+ minutes,
33
+ seconds
34
+ }; // Return the values separately
35
+ };
36
+ const getAudioDuration = async blob => {
37
+ const audioContext = new AudioContext();
38
+ const arrayBuffer = await blob.arrayBuffer();
39
+ const audioBuffer = await audioContext.decodeAudioData(arrayBuffer);
40
+ const duration = audioBuffer.duration;
41
+ return parseInt(duration);
42
+ };
43
+ const RecorderBox = _ref => {
44
+ let {
45
+ mode = 'recorder',
46
+ recordHistoryList,
47
+ setMode,
48
+ onNewRecordEvent,
49
+ onRecordDataChange
50
+ } = _ref;
51
+ const [isVoiceMode, setIsVoiceMode] = (0, _react.useState)(false);
52
+ const [isStartedRecord, setIsStartedRecord] = (0, _react.useState)(false);
53
+ const [selectedVoice, setSelectedVoice] = (0, _react.useState)("");
54
+ const [voiceList, setVoiceList] = (0, _react.useState)([]);
55
+ const languageList = ['Auto-Detect', 'English', 'Chinese (Simplified)'];
56
+ const [selectedLanguage, setSelectedLanguage] = (0, _react.useState)("");
57
+ const [recordList, setRecordList] = (0, _react.useState)(recordHistoryList);
58
+ const [newRecordFileName, setNewRecordFileName] = (0, _react.useState)("");
59
+ const [newRecordTime, setNewRecordTime] = (0, _react.useState)(0);
60
+ const [isRunning, setIsRunning] = (0, _react.useState)(false);
61
+ const [intervalId, setIntervalId] = (0, _react.useState)(null);
62
+ const [audioBlob, setAudioBlob] = (0, _react.useState)(null);
63
+ const [audioUrl, setAudioUrl] = (0, _react.useState)('');
64
+ const [audioSize, setAudioSize] = (0, _react.useState)(0);
65
+ const mediaRecorderRef = (0, _react.useRef)(null);
66
+ const handleVoiceChange = event => {
67
+ setSelectedVoice(event.target.value);
68
+ };
69
+ const handleLanguageChange = event => {
70
+ setSelectedLanguage(event.target.value);
71
+ };
72
+ const initRecorder = async () => {
73
+ try {
74
+ const stream = await navigator.mediaDevices.getUserMedia({
75
+ audio: true
76
+ });
77
+ const audioContext = new (window.AudioContext || window.webkitAudioContext)();
78
+ const newRecorder = new _recorderJs.default(audioContext);
79
+ await newRecorder.init(stream);
80
+ mediaRecorderRef.current = newRecorder;
81
+ } catch (error) {
82
+ console.error("Unable to access microphone", error);
83
+ }
84
+ };
85
+ const startRecording = async () => {
86
+ if (!mediaRecorderRef.current) {
87
+ await initRecorder();
88
+ }
89
+ if (mediaRecorderRef.current) {
90
+ setAudioBlob(null);
91
+ mediaRecorderRef.current.start();
92
+ setIsStartedRecord(true);
93
+ setNewRecordFileName(getVoiceFileName(new Date()));
94
+ startCounting();
95
+ }
96
+ };
97
+ const stopRecording = () => {
98
+ if (mediaRecorderRef.current) {
99
+ mediaRecorderRef.current.stop().then(async _ref2 => {
100
+ let {
101
+ blob
102
+ } = _ref2;
103
+ setAudioBlob(blob);
104
+ setAudioUrl(URL.createObjectURL(blob));
105
+ console.log(blob);
106
+ let temp = [...recordList];
107
+ const newVoice = {
108
+ audioURL: URL.createObjectURL(blob),
109
+ name: newRecordFileName,
110
+ date: new Date(),
111
+ size: blob.size,
112
+ time: await getAudioDuration(blob)
113
+ };
114
+ temp.push(newVoice);
115
+ setRecordList(temp);
116
+ if (onNewRecordEvent) {
117
+ onNewRecordEvent(newVoice);
118
+ }
119
+ if (onRecordDataChange) {
120
+ onRecordDataChange(temp);
121
+ }
122
+ });
123
+ setIsStartedRecord(false);
124
+ stopCounting();
125
+ setNewRecordTime(0);
126
+ setAudioSize(0);
127
+ }
128
+ };
129
+ const handleStartRecord = async () => {
130
+ if (isVoiceMode) return;
131
+ if (!isStartedRecord) {
132
+ startRecording();
133
+ } else {
134
+ stopRecording();
135
+ }
136
+ };
137
+ const handleModeChange = () => {
138
+ if (mode === "recorder") {
139
+ setMode("recognition");
140
+ } else if (mode === "recognition") {
141
+ setMode("recorder");
142
+ }
143
+ };
144
+ const handleSteupChange = () => {
145
+ if (isStartedRecord) return;
146
+ setIsVoiceMode(!isVoiceMode);
147
+ };
148
+ const handleLabelChange = (id, newLabel) => {
149
+ setRecordList(prevRecords => prevRecords.map((record, index) => index === id ? {
150
+ ...record,
151
+ label: newLabel
152
+ } : record));
153
+ };
154
+ const handleDelete = id => {
155
+ setRecordList(prevRecords => prevRecords.filter((record, index) => index !== id));
156
+ };
157
+ const startCounting = () => {
158
+ if (isRunning) return; // Prevent starting a new interval if already running
159
+ const id = setInterval(async () => {
160
+ setNewRecordTime(prevCount => prevCount + 1); // Increment count every 1000ms
161
+ await mediaRecorderRef.current.audioRecorder.getBuffer(blob => {
162
+ setAudioSize((blob[0].byteLength / 1024 / 1024).toFixed(2));
163
+ });
164
+ }, 1000);
165
+ setIntervalId(id); // Store the interval ID
166
+ setIsRunning(true); // Set the counter as running
167
+ };
168
+ const stopCounting = () => {
169
+ clearInterval(intervalId); // Stop the interval using the interval ID
170
+ setIsRunning(false); // Set the counter as not running
171
+ };
172
+ (0, _react.useEffect)(() => {
173
+ const fetchAudioInputDevices = async () => {
174
+ try {
175
+ // Request permission to access media devices
176
+ await navigator.mediaDevices.getUserMedia({
177
+ audio: true
178
+ });
179
+
180
+ // Enumerate all media devices
181
+ const devices = await navigator.mediaDevices.enumerateDevices();
182
+
183
+ // Filter only audio input devices
184
+ const audioInputs = devices.filter(device => device.kind === "audioinput");
185
+ let temp = ['Auto-Detect'];
186
+ audioInputs.forEach(device => {
187
+ temp.push(device.label);
188
+ });
189
+ setVoiceList(temp);
190
+ } catch (error) {
191
+ console.error("Error accessing audio devices:", error);
192
+ }
193
+ };
194
+ fetchAudioInputDevices();
195
+ }, []);
196
+ (0, _react.useEffect)(() => {
197
+ // uploadRecording();
198
+ }, [audioBlob]);
199
+ return /*#__PURE__*/React.createElement(_material.Box, {
200
+ className: "bg-[#0B0B0B] rounded-[5px] border p-[20px] w-[850px]"
201
+ }, /*#__PURE__*/React.createElement(_Grid.default, {
202
+ container: true,
203
+ spacing: 2
204
+ }, /*#__PURE__*/React.createElement(_Grid.default, {
205
+ size: 6
206
+ }, /*#__PURE__*/React.createElement(_material.Box, {
207
+ className: "flex items-center justify-between"
208
+ }, /*#__PURE__*/React.createElement(_material.Typography, {
209
+ className: "!text-[24px] !font-[600]",
210
+ color: "#EAE5DC"
211
+ }, "Voice assistant"), /*#__PURE__*/React.createElement(_material.Box, {
212
+ className: "flex items-center px-[10px] py-[4px] bg-[#006FFF4D] rounded-[89.1px] cursor-pointer h-[28px]",
213
+ sx: {
214
+ border: '0.9px solid #006FFFB2'
215
+ },
216
+ onClick: handleModeChange
217
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.MicIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
218
+ className: "!font-600 !text-[14px]",
219
+ color: "#EAE5DC"
220
+ }, "Recorder mode"))), /*#__PURE__*/React.createElement(_material.Box, {
221
+ className: "flex items-center justify-between mt-4"
222
+ }, !isStartedRecord ? /*#__PURE__*/React.createElement(_material.Box, {
223
+ className: "flex items-center space-x-1 cursor-pointer px-[9px] py-[6px] rounded-[5px] bg-[#0B0B0B]",
224
+ sx: {
225
+ '&:hover': {
226
+ boxShadow: '0px 0px 5px 1px #44C63380',
227
+ cursor: isVoiceMode && 'not-allowed'
228
+ }
229
+ },
230
+ onClick: handleStartRecord
231
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.StartIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
232
+ className: "!font-400 !text-[16px]",
233
+ color: "#EAE5DC"
234
+ }, "Start")) : /*#__PURE__*/React.createElement(_material.Box, {
235
+ className: "flex items-center space-x-1 cursor-pointer px-[9px] py-[6px] rounded-[5px] bg-[#0B0B0B]",
236
+ sx: {
237
+ border: '0.9px solid #F3151580',
238
+ '&:hover': {
239
+ boxShadow: '0px 0px 5px 1px #F3151580'
240
+ }
241
+ },
242
+ onClick: handleStartRecord
243
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.SmallPauseIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
244
+ className: "!font-400 !text-[14px]",
245
+ color: "#EAE5DC"
246
+ }, "Stop")), /*#__PURE__*/React.createElement(_material.Box, {
247
+ className: "flex items-center space-x-1 cursor-pointer px-[9px] py-[6px] rounded-[5px] bg-[#0B0B0B]",
248
+ sx: {
249
+ '&:hover': {
250
+ boxShadow: '0px 0px 5px 2px #58585880',
251
+ cursor: isStartedRecord && 'not-allowed'
252
+ }
253
+ },
254
+ onClick: handleSteupChange
255
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.SettingIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
256
+ className: "!font-400 !text-[14px]",
257
+ color: "#EAE5DC"
258
+ }, "Setup"))), /*#__PURE__*/React.createElement(_material.Box, {
259
+ className: "rounded-[5px] bg-[#A3DBFE] mt-2"
260
+ }, /*#__PURE__*/React.createElement(_material.Box, {
261
+ className: "flex items-center justify-between p-[4.5px]"
262
+ }, /*#__PURE__*/React.createElement(_material.Box, {
263
+ className: "flex items-center space-x-1 rounded-[5px] px-[5px] py-[2px] bg-[#0B0B0B]",
264
+ sx: {
265
+ boxShadow: '0px 0px 1.8px 0px #00000040'
266
+ }
267
+ }, /*#__PURE__*/React.createElement(_material.Box, null, !isStartedRecord ? /*#__PURE__*/React.createElement(_svgs.StopIcon, null) : /*#__PURE__*/React.createElement(_svgs.RedStopIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
268
+ className: "!font-[600] !text-[14px]",
269
+ color: "#A3DBFE"
270
+ }, !isStartedRecord ? 'STOP' : 'REC')), /*#__PURE__*/React.createElement(_material.Typography, {
271
+ className: "!font-400 !text-[20px] px-[9px]",
272
+ color: "#1A2123",
273
+ sx: {
274
+ fontFamily: "Space Grotesk !important"
275
+ }
276
+ }, "01.08.2024")), /*#__PURE__*/React.createElement(_material.Box, {
277
+ className: "flex justify-between p-[9px]"
278
+ }, /*#__PURE__*/React.createElement(_material.Typography, {
279
+ className: "!font-400 !text-[36px]",
280
+ color: "#1A2123",
281
+ sx: {
282
+ fontFamily: "Space Grotesk !important"
283
+ }
284
+ }, getTimeValues(newRecordTime).hours, /*#__PURE__*/React.createElement("span", {
285
+ style: {
286
+ color: '#494A48',
287
+ fontWeight: "300",
288
+ fontSize: "16px"
289
+ }
290
+ }, "h"), " ", getTimeValues(newRecordTime).minutes, /*#__PURE__*/React.createElement("span", {
291
+ style: {
292
+ color: '#494A48',
293
+ fontWeight: "300",
294
+ fontSize: "16px"
295
+ }
296
+ }, "m"), " ", getTimeValues(newRecordTime).seconds, /*#__PURE__*/React.createElement("span", {
297
+ style: {
298
+ color: '#494A48',
299
+ fontWeight: "300",
300
+ fontSize: "16px"
301
+ }
302
+ }, "s")), /*#__PURE__*/React.createElement(_material.Box, {
303
+ className: "flex flex-col space-y-3 text-right"
304
+ }, /*#__PURE__*/React.createElement(_material.Typography, {
305
+ className: "!font-400 !text-[16px]",
306
+ color: "#494A48",
307
+ sx: {
308
+ fontFamily: "Space Grotesk !important"
309
+ }
310
+ }, audioSize, " ", /*#__PURE__*/React.createElement("span", {
311
+ style: {
312
+ fontSize: "14px",
313
+ fontFamily: "Space Grotesk !important"
314
+ }
315
+ }, "MB")), isStartedRecord && /*#__PURE__*/React.createElement(_material.Typography, {
316
+ className: "!font-bold !text-[16px]",
317
+ color: "#494A48",
318
+ sx: {
319
+ fontFamily: "Space Grotesk !important"
320
+ }
321
+ }, newRecordFileName))))), /*#__PURE__*/React.createElement(_Grid.default, {
322
+ size: 6,
323
+ className: `w-full ${isVoiceMode ? 'pr-[10px]' : ''}`
324
+ }, isVoiceMode && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_material.Box, {
325
+ className: "flex space-x-1 w-full"
326
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.MicIcon, null)), /*#__PURE__*/React.createElement(_material.Box, {
327
+ className: "flex-1"
328
+ }, /*#__PURE__*/React.createElement(_material.Typography, {
329
+ className: "!font-[600] !text-[16px]",
330
+ color: "#EAE5DC"
331
+ }, "Voice"), /*#__PURE__*/React.createElement(_material.Typography, {
332
+ className: "!font-400 !text-[14px] pt-1",
333
+ color: "#EAE5DC"
334
+ }, "Input device"), /*#__PURE__*/React.createElement(_StyledSelect.default, {
335
+ className: "mt-1",
336
+ fullWidth: true,
337
+ displayEmpty: true,
338
+ value: selectedVoice,
339
+ onChange: handleVoiceChange,
340
+ renderValue: selected => {
341
+ if (selected === "") {
342
+ return /*#__PURE__*/React.createElement("span", {
343
+ style: {
344
+ fontSize: '12.6px',
345
+ fontWeight: '400',
346
+ lineHeight: '25.2px',
347
+ color: '#EAE5DC99'
348
+ }
349
+ }, "Auto-Detect");
350
+ }
351
+ return /*#__PURE__*/React.createElement("span", {
352
+ style: {
353
+ fontSize: '12.6px',
354
+ fontWeight: '400',
355
+ lineHeight: '25.2px',
356
+ color: '#EAE5DC99'
357
+ }
358
+ }, voiceList[selected]);
359
+ },
360
+ MenuProps: {
361
+ PaperProps: {
362
+ sx: {
363
+ marginTop: "5px",
364
+ padding: '5px',
365
+ background: '#0B0B0B',
366
+ border: '0.9px solid #565656',
367
+ '& .MuiList-root': {
368
+ padding: "unset"
369
+ },
370
+ '& .MuiMenuItem-root': {
371
+ padding: "7.2px 9px",
372
+ color: '#EAE5DC99',
373
+ fontFamily: 'Reddit Sans',
374
+ fontSize: '12.6px',
375
+ fontWeight: '400',
376
+ lineHeight: '25.2px'
377
+ },
378
+ '& .MuiMenuItem-root:hover': {
379
+ background: "#A3DBFE99",
380
+ color: '#1A2123'
381
+ },
382
+ '& .MuiMenuItem-root.Mui-selected': {
383
+ background: "#A3DBFE",
384
+ color: '#1A2123'
385
+ },
386
+ '& .MuiMenuItem-root.Mui-selected:hover': {
387
+ background: "#A3DBFE99",
388
+ color: '#1A2123'
389
+ }
390
+ }
391
+ }
392
+ }
393
+ }, voiceList.map((device, index) => {
394
+ return /*#__PURE__*/React.createElement(_material.MenuItem, {
395
+ value: index,
396
+ key: index
397
+ }, device);
398
+ })))), /*#__PURE__*/React.createElement(_material.Box, {
399
+ className: "flex space-x-1 w-full mt-2"
400
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.LanguageIcon, null)), /*#__PURE__*/React.createElement(_material.Box, {
401
+ className: "flex-1"
402
+ }, /*#__PURE__*/React.createElement(_material.Typography, {
403
+ className: "!font-[600] !text-[16px]",
404
+ color: "#EAE5DC"
405
+ }, "Language"), /*#__PURE__*/React.createElement(_material.Typography, {
406
+ className: "!font-400 !text-[14px] pt-1",
407
+ color: "#EAE5DC"
408
+ }, "Prefer language"), /*#__PURE__*/React.createElement(_StyledSelect.default, {
409
+ className: "mt-1",
410
+ fullWidth: true,
411
+ displayEmpty: true,
412
+ value: selectedLanguage,
413
+ onChange: handleLanguageChange,
414
+ renderValue: selected => {
415
+ if (selected === "") {
416
+ return /*#__PURE__*/React.createElement("span", {
417
+ style: {
418
+ fontSize: '12.6px',
419
+ fontWeight: '400',
420
+ lineHeight: '25.2px',
421
+ color: '#EAE5DC99'
422
+ }
423
+ }, "Auto-Detect");
424
+ }
425
+ return /*#__PURE__*/React.createElement("span", {
426
+ style: {
427
+ fontSize: '12.6px',
428
+ fontWeight: '400',
429
+ lineHeight: '25.2px',
430
+ color: '#EAE5DC99'
431
+ }
432
+ }, languageList[selected]);
433
+ },
434
+ MenuProps: {
435
+ PaperProps: {
436
+ sx: {
437
+ marginTop: "5px",
438
+ padding: '5px',
439
+ background: '#0B0B0B',
440
+ border: '0.9px solid #565656',
441
+ '& .MuiList-root': {
442
+ padding: "unset"
443
+ },
444
+ '& .MuiMenuItem-root': {
445
+ padding: "7.2px 9px",
446
+ color: '#EAE5DC99',
447
+ fontFamily: 'Reddit Sans',
448
+ fontSize: '12.6px',
449
+ fontWeight: '400',
450
+ lineHeight: '25.2px'
451
+ },
452
+ '& .MuiMenuItem-root:hover': {
453
+ background: "#A3DBFE99",
454
+ color: '#1A2123'
455
+ },
456
+ '& .MuiMenuItem-root.Mui-selected': {
457
+ background: "#A3DBFE",
458
+ color: '#1A2123'
459
+ },
460
+ '& .MuiMenuItem-root.Mui-selected:hover': {
461
+ background: "#A3DBFE99",
462
+ color: '#1A2123'
463
+ }
464
+ }
465
+ }
466
+ }
467
+ }, /*#__PURE__*/React.createElement(_material.MenuItem, {
468
+ value: 0
469
+ }, "Auto-Detect"), /*#__PURE__*/React.createElement(_material.MenuItem, {
470
+ value: 1
471
+ }, "English"), /*#__PURE__*/React.createElement(_material.MenuItem, {
472
+ value: 2
473
+ }, "Chinese (Simplified)"))))), !isVoiceMode && /*#__PURE__*/React.createElement(React.Fragment, null, recordList.length === 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_material.Box, {
474
+ className: "flex flex-col items-center justify-center h-full"
475
+ }, /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.BoxIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
476
+ className: "!font-[600] !text-[16px] pt-2",
477
+ color: "#EAE5DC",
478
+ sx: {
479
+ fontFamily: "Afacad !important"
480
+ }
481
+ }, "Record Empty"), /*#__PURE__*/React.createElement(_material.Box, {
482
+ className: "flex items-center space-x-1 mt-1"
483
+ }, /*#__PURE__*/React.createElement(_material.Typography, {
484
+ className: "!font-400 !text-[14px]",
485
+ color: "#EAE5DC",
486
+ sx: {
487
+ fontFamily: "Afacad !important"
488
+ }
489
+ }, "Push"), /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_svgs.SmallStartIcon, null)), /*#__PURE__*/React.createElement(_material.Typography, {
490
+ className: "!font-400 !text-[16px]",
491
+ color: "#EAE5DC",
492
+ sx: {
493
+ fontFamily: "Afacad !important"
494
+ }
495
+ }, "to start")))), recordList.length > 0 && /*#__PURE__*/React.createElement(_material.Box, {
496
+ className: "flex flex-col space-y-2 p-[10px] scrollableBox",
497
+ sx: {
498
+ maxHeight: "225px"
499
+ }
500
+ }, recordList.map((record, index) => {
501
+ return /*#__PURE__*/React.createElement(_RecordListItem.default, {
502
+ audioURL: record.audioURL,
503
+ label: record.name,
504
+ capacity: record.size,
505
+ time: record.time,
506
+ createdDate: record.date,
507
+ key: index,
508
+ onLabelChange: newLabel => handleLabelChange(index, newLabel),
509
+ onDelete: () => handleDelete(index)
510
+ });
511
+ }))))));
512
+ };
513
+ var _default = exports.default = RecorderBox;
package/package.json CHANGED
@@ -1,10 +1,9 @@
1
1
  {
2
2
  "name": "dmed-voice-assistant",
3
- "version": "1.0.3",
4
- "main": "src/VoiceAssistant/index.js",
3
+ "version": "1.1.0",
4
+ "main": "dist/VoiceAssistant/index.js",
5
5
  "files": [
6
- "src/VoiceAssistant",
7
- "src/shared"
6
+ "dist"
8
7
  ],
9
8
  "dependencies": {
10
9
  "@emotion/react": "^11.13.5",
@@ -1,53 +0,0 @@
1
- import { Box, Typography } from "@mui/material";
2
-
3
- const RecognitionListItem = ({
4
- data
5
- }) => {
6
- return (
7
- <Box>
8
- <Box className="flex items-center justify-between p-[4.5px] bg-[#F6F8FA]">
9
- <Box className="flex items-center space-x-1 p-[4px]">
10
- <Typography className="!font-bold !text-[14px]" color="#494A48">
11
- {data.result.length}
12
- </Typography>
13
- <Typography className="!font-400 !text-[12px]" color="#494A48">
14
- words
15
- </Typography>
16
- </Box>
17
- <Typography className="px-[4px] !font-400 !text-[14px]" color="#494A48">
18
- {data.date.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit', hour12: true })}
19
- </Typography>
20
- </Box>
21
- <Box
22
- className="flex items-center flex-wrap space-x-1 mt-1 p-[9px]"
23
- sx={{ maxWidth: "387px", overflow: "hidden" }}
24
- >
25
- {
26
- data.result.map((item, index) => {
27
- return (
28
- <Box className="flex items-center" key={index}>
29
- <Typography
30
- className="!font-400 !text-[16px]" color="#494A48"
31
- sx={{ fontFamily: "Space Grotesk !important" }}
32
- >
33
- {item}
34
- </Typography>
35
- {
36
- index !== data.result.length - 1 &&
37
- <Typography
38
- className="!font-400 !text-[16px]" color="#494A4880"
39
- sx={{ fontFamily: "Fira Sans !important" }}
40
- >
41
- ,
42
- </Typography>
43
- }
44
- </Box>
45
- )
46
- })
47
- }
48
- </Box>
49
- </Box>
50
- )
51
- };
52
-
53
- export default RecognitionListItem;