stream-chat-react 14.0.0-beta.8 → 14.0.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/cjs/{WithAudioPlayback.58b0b39b.js → WithAudioPlayback.d26afa91.js} +1009 -985
- package/dist/cjs/WithAudioPlayback.d26afa91.js.map +1 -0
- package/dist/cjs/emojis.js +1 -1
- package/dist/cjs/index.js +584 -442
- package/dist/cjs/index.js.map +1 -1
- package/dist/css/index.css +76 -25
- package/dist/css/index.css.map +1 -1
- package/dist/es/{WithAudioPlayback.2ffdc4c5.mjs → WithAudioPlayback.9b779236.mjs} +1195 -1171
- package/dist/es/WithAudioPlayback.9b779236.mjs.map +1 -0
- package/dist/es/emojis.mjs +1 -1
- package/dist/es/index.mjs +636 -494
- package/dist/es/index.mjs.map +1 -1
- package/dist/types/components/Attachment/Audio.d.ts.map +1 -1
- package/dist/types/components/Attachment/FileAttachment.d.ts.map +1 -1
- package/dist/types/components/Attachment/components/DownloadButton.d.ts +12 -3
- package/dist/types/components/Attachment/components/DownloadButton.d.ts.map +1 -1
- package/dist/types/components/AudioPlayback/plugins/AudioPlayerNotificationsPlugin.d.ts.map +1 -1
- package/dist/types/components/Dialog/components/ContextMenu.d.ts.map +1 -1
- package/dist/types/components/FileIcon/FileIcon.d.ts +1 -3
- package/dist/types/components/FileIcon/FileIcon.d.ts.map +1 -1
- package/dist/types/components/FileIcon/FileIconSet.d.ts +10 -10
- package/dist/types/components/FileIcon/FileIconSet.d.ts.map +1 -1
- package/dist/types/components/Icons/icons.d.ts +4 -0
- package/dist/types/components/Icons/icons.d.ts.map +1 -1
- package/dist/types/components/Message/utils.d.ts +1 -0
- package/dist/types/components/Message/utils.d.ts.map +1 -1
- package/dist/types/components/MessageActions/MessageActions.d.ts.map +1 -1
- package/dist/types/components/MessageActions/MessageActions.defaults.d.ts.map +1 -1
- package/dist/types/components/MessageActions/downloadUtils.d.ts +25 -0
- package/dist/types/components/MessageActions/downloadUtils.d.ts.map +1 -0
- package/dist/types/components/MessageActions/hooks/useBaseMessageActionSetFilter.d.ts.map +1 -1
- package/dist/types/i18n/Streami18n.d.ts +3 -4
- package/dist/types/i18n/Streami18n.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/cjs/WithAudioPlayback.58b0b39b.js.map +0 -1
- package/dist/es/WithAudioPlayback.2ffdc4c5.mjs.map +0 -1
|
@@ -372,715 +372,6 @@ const useTypingContext = (componentName) => {
|
|
|
372
372
|
}
|
|
373
373
|
return contextValue;
|
|
374
374
|
};
|
|
375
|
-
const DEFAULT_PLAYBACK_RATES = [1, 1.5, 2];
|
|
376
|
-
const isSeekable = (audioElement) => !(audioElement.duration === Infinity || isNaN(audioElement.duration));
|
|
377
|
-
const defaultRegisterAudioPlayerError = ({
|
|
378
|
-
error
|
|
379
|
-
} = {}) => {
|
|
380
|
-
if (!error) return;
|
|
381
|
-
console.error("[AUDIO PLAYER]", error);
|
|
382
|
-
};
|
|
383
|
-
const elementIsPlaying = (audioElement) => audioElement && !(audioElement.paused || audioElement.ended);
|
|
384
|
-
class AudioPlayer {
|
|
385
|
-
constructor({
|
|
386
|
-
durationSeconds,
|
|
387
|
-
fileSize,
|
|
388
|
-
id,
|
|
389
|
-
mimeType,
|
|
390
|
-
playbackRates: customPlaybackRates,
|
|
391
|
-
plugins,
|
|
392
|
-
pool,
|
|
393
|
-
src,
|
|
394
|
-
title,
|
|
395
|
-
waveformData
|
|
396
|
-
}) {
|
|
397
|
-
this._plugins = /* @__PURE__ */ new Map();
|
|
398
|
-
this.playTimeout = void 0;
|
|
399
|
-
this.unsubscribeEventListeners = null;
|
|
400
|
-
this._disposed = false;
|
|
401
|
-
this._metadataProbe = null;
|
|
402
|
-
this._restoringPosition = false;
|
|
403
|
-
this._removalTimeout = void 0;
|
|
404
|
-
this.setDurationSeconds = (durationSeconds2) => {
|
|
405
|
-
this._data.durationSeconds = durationSeconds2;
|
|
406
|
-
this.state.partialNext({ durationSeconds: durationSeconds2 });
|
|
407
|
-
};
|
|
408
|
-
this.setPlaybackStartSafetyTimeout = () => {
|
|
409
|
-
clearTimeout(this.playTimeout);
|
|
410
|
-
this.playTimeout = setTimeout(() => {
|
|
411
|
-
if (!this.elementRef) return;
|
|
412
|
-
try {
|
|
413
|
-
this.elementRef.pause();
|
|
414
|
-
this.state.partialNext({ isPlaying: false });
|
|
415
|
-
} catch (e) {
|
|
416
|
-
this.registerError({ errCode: "failed-to-start" });
|
|
417
|
-
}
|
|
418
|
-
}, 2e3);
|
|
419
|
-
};
|
|
420
|
-
this.updateDurationFromElement = (element) => {
|
|
421
|
-
const duration = element.duration;
|
|
422
|
-
if (typeof duration !== "number" || isNaN(duration) || !isFinite(duration) || duration <= 0) {
|
|
423
|
-
return;
|
|
424
|
-
}
|
|
425
|
-
this.setDurationSeconds(duration);
|
|
426
|
-
};
|
|
427
|
-
this.clearMetadataProbe = () => {
|
|
428
|
-
const probe = this._metadataProbe;
|
|
429
|
-
this._metadataProbe = null;
|
|
430
|
-
this._metadataProbePromise = void 0;
|
|
431
|
-
if (!probe) return;
|
|
432
|
-
try {
|
|
433
|
-
probe.pause();
|
|
434
|
-
} catch {
|
|
435
|
-
}
|
|
436
|
-
probe.removeAttribute("src");
|
|
437
|
-
try {
|
|
438
|
-
probe.load();
|
|
439
|
-
} catch {
|
|
440
|
-
}
|
|
441
|
-
};
|
|
442
|
-
this.preloadMetadata = () => {
|
|
443
|
-
if (this._disposed || this.durationSeconds != null || !this.src || this._metadataProbePromise || typeof document === "undefined") {
|
|
444
|
-
return;
|
|
445
|
-
}
|
|
446
|
-
const probe = document.createElement("audio");
|
|
447
|
-
probe.preload = "metadata";
|
|
448
|
-
this._metadataProbe = probe;
|
|
449
|
-
this._metadataProbePromise = new Promise((resolve) => {
|
|
450
|
-
const cleanup = () => {
|
|
451
|
-
probe.removeEventListener("loadedmetadata", handleLoadedMetadata);
|
|
452
|
-
probe.removeEventListener("error", handleError);
|
|
453
|
-
if (this._metadataProbe === probe) {
|
|
454
|
-
this.clearMetadataProbe();
|
|
455
|
-
} else {
|
|
456
|
-
this._metadataProbePromise = void 0;
|
|
457
|
-
}
|
|
458
|
-
resolve();
|
|
459
|
-
};
|
|
460
|
-
const handleLoadedMetadata = () => {
|
|
461
|
-
this.updateDurationFromElement(probe);
|
|
462
|
-
cleanup();
|
|
463
|
-
};
|
|
464
|
-
const handleError = () => {
|
|
465
|
-
cleanup();
|
|
466
|
-
};
|
|
467
|
-
probe.addEventListener("loadedmetadata", handleLoadedMetadata, { once: true });
|
|
468
|
-
probe.addEventListener("error", handleError, { once: true });
|
|
469
|
-
probe.src = this.src;
|
|
470
|
-
try {
|
|
471
|
-
probe.load();
|
|
472
|
-
} catch {
|
|
473
|
-
cleanup();
|
|
474
|
-
}
|
|
475
|
-
});
|
|
476
|
-
};
|
|
477
|
-
this.clearPlaybackStartSafetyTimeout = () => {
|
|
478
|
-
if (!this.elementRef) return;
|
|
479
|
-
clearTimeout(this.playTimeout);
|
|
480
|
-
this.playTimeout = void 0;
|
|
481
|
-
};
|
|
482
|
-
this.clearPendingLoadedMeta = () => {
|
|
483
|
-
const pending = this._pendingLoadedMeta;
|
|
484
|
-
if (pending?.element && pending.onLoaded) {
|
|
485
|
-
pending.element.removeEventListener("loadedmetadata", pending.onLoaded);
|
|
486
|
-
}
|
|
487
|
-
this._pendingLoadedMeta = void 0;
|
|
488
|
-
};
|
|
489
|
-
this.restoreSavedPosition = (elementRef) => {
|
|
490
|
-
const saved = this.secondsElapsed;
|
|
491
|
-
if (!saved || saved <= 0) return;
|
|
492
|
-
const apply = () => {
|
|
493
|
-
const duration = elementRef.duration;
|
|
494
|
-
const clamped = typeof duration === "number" && !isNaN(duration) && isFinite(duration) ? Math.min(saved, duration) : saved;
|
|
495
|
-
try {
|
|
496
|
-
if (elementRef.currentTime === clamped) return;
|
|
497
|
-
elementRef.currentTime = clamped;
|
|
498
|
-
this.setSecondsElapsed(clamped);
|
|
499
|
-
} catch {
|
|
500
|
-
}
|
|
501
|
-
};
|
|
502
|
-
if (elementRef.readyState < 1) {
|
|
503
|
-
this.clearPendingLoadedMeta();
|
|
504
|
-
this._restoringPosition = true;
|
|
505
|
-
const onLoaded = () => {
|
|
506
|
-
if (this._pendingLoadedMeta?.onLoaded !== onLoaded) return;
|
|
507
|
-
this._pendingLoadedMeta = void 0;
|
|
508
|
-
if (this.elementRef !== elementRef) {
|
|
509
|
-
this._restoringPosition = false;
|
|
510
|
-
return;
|
|
511
|
-
}
|
|
512
|
-
apply();
|
|
513
|
-
this._restoringPosition = false;
|
|
514
|
-
};
|
|
515
|
-
elementRef.addEventListener("loadedmetadata", onLoaded, { once: true });
|
|
516
|
-
this._pendingLoadedMeta = { element: elementRef, onLoaded };
|
|
517
|
-
} else {
|
|
518
|
-
this._restoringPosition = true;
|
|
519
|
-
apply();
|
|
520
|
-
this._restoringPosition = false;
|
|
521
|
-
}
|
|
522
|
-
};
|
|
523
|
-
this.elementIsReady = () => {
|
|
524
|
-
if (this._elementIsReadyPromise) return this._elementIsReadyPromise;
|
|
525
|
-
this._elementIsReadyPromise = new Promise((resolve) => {
|
|
526
|
-
if (!this.elementRef) return resolve(false);
|
|
527
|
-
const element = this.elementRef;
|
|
528
|
-
const handleLoaded = () => {
|
|
529
|
-
element.removeEventListener("loadedmetadata", handleLoaded);
|
|
530
|
-
resolve(element.readyState > 0);
|
|
531
|
-
};
|
|
532
|
-
element.addEventListener("loadedmetadata", handleLoaded);
|
|
533
|
-
});
|
|
534
|
-
return this._elementIsReadyPromise;
|
|
535
|
-
};
|
|
536
|
-
this.setRef = (elementRef) => {
|
|
537
|
-
if (elementIsPlaying(this.elementRef)) {
|
|
538
|
-
this.releaseElement({ resetState: false });
|
|
539
|
-
}
|
|
540
|
-
this.clearPendingLoadedMeta();
|
|
541
|
-
this.clearMetadataProbe();
|
|
542
|
-
this._restoringPosition = false;
|
|
543
|
-
this._elementIsReadyPromise = void 0;
|
|
544
|
-
this.state.partialNext({ elementRef });
|
|
545
|
-
if (elementRef) {
|
|
546
|
-
this.registerSubscriptions();
|
|
547
|
-
}
|
|
548
|
-
};
|
|
549
|
-
this.setSecondsElapsed = (secondsElapsed) => {
|
|
550
|
-
const duration = this.elementRef?.duration ?? this.durationSeconds;
|
|
551
|
-
this.state.partialNext({
|
|
552
|
-
progressPercent: duration && secondsElapsed ? secondsElapsed / duration * 100 : 0,
|
|
553
|
-
secondsElapsed
|
|
554
|
-
});
|
|
555
|
-
};
|
|
556
|
-
this.canPlayMimeType = (mimeType2) => {
|
|
557
|
-
if (!mimeType2) return false;
|
|
558
|
-
if (this.elementRef) return !!this.elementRef.canPlayType(mimeType2);
|
|
559
|
-
return !!new Audio().canPlayType(mimeType2);
|
|
560
|
-
};
|
|
561
|
-
this.play = async (params) => {
|
|
562
|
-
if (this._disposed) return;
|
|
563
|
-
const elementRef = this.ensureElementRef();
|
|
564
|
-
if (elementIsPlaying(this.elementRef)) {
|
|
565
|
-
if (this.isPlaying) return;
|
|
566
|
-
this.state.partialNext({ isPlaying: true });
|
|
567
|
-
return;
|
|
568
|
-
}
|
|
569
|
-
const { currentPlaybackRate, playbackRates: playbackRates2 } = {
|
|
570
|
-
currentPlaybackRate: this.currentPlaybackRate,
|
|
571
|
-
playbackRates: this.playbackRates,
|
|
572
|
-
...params
|
|
573
|
-
};
|
|
574
|
-
if (!this.canPlayRecord) {
|
|
575
|
-
this.registerError({ errCode: "not-playable" });
|
|
576
|
-
return;
|
|
577
|
-
}
|
|
578
|
-
this.restoreSavedPosition(elementRef);
|
|
579
|
-
elementRef.playbackRate = currentPlaybackRate ?? this.currentPlaybackRate;
|
|
580
|
-
this.setPlaybackStartSafetyTimeout();
|
|
581
|
-
try {
|
|
582
|
-
await elementRef.play();
|
|
583
|
-
this.state.partialNext({
|
|
584
|
-
currentPlaybackRate,
|
|
585
|
-
isPlaying: true,
|
|
586
|
-
playbackRates: playbackRates2
|
|
587
|
-
});
|
|
588
|
-
this._pool.setActiveAudioPlayer(this);
|
|
589
|
-
} catch (e) {
|
|
590
|
-
this.registerError({ error: e });
|
|
591
|
-
this.state.partialNext({ isPlaying: false });
|
|
592
|
-
} finally {
|
|
593
|
-
this.clearPlaybackStartSafetyTimeout();
|
|
594
|
-
}
|
|
595
|
-
};
|
|
596
|
-
this.pause = () => {
|
|
597
|
-
if (!elementIsPlaying(this.elementRef)) return;
|
|
598
|
-
this.clearPlaybackStartSafetyTimeout();
|
|
599
|
-
this.elementRef.pause();
|
|
600
|
-
this.state.partialNext({ isPlaying: false });
|
|
601
|
-
};
|
|
602
|
-
this.stop = () => {
|
|
603
|
-
this.pause();
|
|
604
|
-
this.state.partialNext({ isPlaying: false });
|
|
605
|
-
this.setSecondsElapsed(0);
|
|
606
|
-
if (this.elementRef) this.elementRef.currentTime = 0;
|
|
607
|
-
};
|
|
608
|
-
this.togglePlay = async () => this.isPlaying ? this.pause() : await this.play();
|
|
609
|
-
this.increasePlaybackRate = () => {
|
|
610
|
-
let currentPlaybackRateIndex = this.state.getLatestValue().playbackRates.findIndex((rate) => rate === this.currentPlaybackRate);
|
|
611
|
-
if (currentPlaybackRateIndex === -1) {
|
|
612
|
-
currentPlaybackRateIndex = 0;
|
|
613
|
-
}
|
|
614
|
-
const nextIndex = currentPlaybackRateIndex === this.playbackRates.length - 1 ? 0 : currentPlaybackRateIndex + 1;
|
|
615
|
-
const currentPlaybackRate = this.playbackRates[nextIndex];
|
|
616
|
-
this.state.partialNext({ currentPlaybackRate });
|
|
617
|
-
if (this.elementRef) {
|
|
618
|
-
this.elementRef.playbackRate = currentPlaybackRate;
|
|
619
|
-
}
|
|
620
|
-
};
|
|
621
|
-
this.seek = throttle(async ({ clientX, currentTarget }) => {
|
|
622
|
-
let element = this.elementRef;
|
|
623
|
-
if (!this.elementRef) {
|
|
624
|
-
element = this.ensureElementRef();
|
|
625
|
-
const isReady = await this.elementIsReady();
|
|
626
|
-
if (!isReady) return;
|
|
627
|
-
}
|
|
628
|
-
if (!currentTarget || !element) return;
|
|
629
|
-
if (!isSeekable(element)) {
|
|
630
|
-
this.registerError({ errCode: "seek-not-supported" });
|
|
631
|
-
return;
|
|
632
|
-
}
|
|
633
|
-
const { width, x } = currentTarget.getBoundingClientRect();
|
|
634
|
-
const ratio = (clientX - x) / width;
|
|
635
|
-
if (ratio > 1 || ratio < 0) return;
|
|
636
|
-
const currentTime = ratio * element.duration;
|
|
637
|
-
this.setSecondsElapsed(currentTime);
|
|
638
|
-
element.currentTime = currentTime;
|
|
639
|
-
}, 16);
|
|
640
|
-
this.registerError = (params) => {
|
|
641
|
-
defaultRegisterAudioPlayerError(params);
|
|
642
|
-
this.plugins.forEach(({ onError }) => onError?.({ player: this, ...params }));
|
|
643
|
-
};
|
|
644
|
-
this.requestRemoval = () => {
|
|
645
|
-
this._disposed = true;
|
|
646
|
-
this.cancelScheduledRemoval();
|
|
647
|
-
this.clearPendingLoadedMeta();
|
|
648
|
-
this.clearMetadataProbe();
|
|
649
|
-
this._restoringPosition = false;
|
|
650
|
-
this.releaseElement({ resetState: true });
|
|
651
|
-
this.unsubscribeEventListeners?.();
|
|
652
|
-
this.unsubscribeEventListeners = null;
|
|
653
|
-
this.plugins.forEach(({ onRemove }) => onRemove?.({ player: this }));
|
|
654
|
-
this._pool.deregister(this.id);
|
|
655
|
-
};
|
|
656
|
-
this.cancelScheduledRemoval = () => {
|
|
657
|
-
clearTimeout(this._removalTimeout);
|
|
658
|
-
this._removalTimeout = void 0;
|
|
659
|
-
};
|
|
660
|
-
this.scheduleRemoval = (ms = 0) => {
|
|
661
|
-
this.cancelScheduledRemoval();
|
|
662
|
-
this._removalTimeout = setTimeout(() => {
|
|
663
|
-
if (this.disposed) return;
|
|
664
|
-
this.requestRemoval();
|
|
665
|
-
}, ms);
|
|
666
|
-
};
|
|
667
|
-
this.releaseElementForHandoff = () => {
|
|
668
|
-
if (!this.elementRef) return;
|
|
669
|
-
this.releaseElement({ resetState: false });
|
|
670
|
-
this.unsubscribeEventListeners?.();
|
|
671
|
-
this.unsubscribeEventListeners = null;
|
|
672
|
-
};
|
|
673
|
-
this.registerSubscriptions = () => {
|
|
674
|
-
this.unsubscribeEventListeners?.();
|
|
675
|
-
const audioElement = this.elementRef;
|
|
676
|
-
if (!audioElement) return;
|
|
677
|
-
const handleEnded = () => {
|
|
678
|
-
if (audioElement) {
|
|
679
|
-
this.updateDurationFromElement(audioElement);
|
|
680
|
-
}
|
|
681
|
-
this.stop();
|
|
682
|
-
};
|
|
683
|
-
const handleError = (e) => {
|
|
684
|
-
const audio = e.currentTarget;
|
|
685
|
-
const state = { isPlaying: false };
|
|
686
|
-
if (!audio?.error?.code) {
|
|
687
|
-
this.state.partialNext(state);
|
|
688
|
-
return;
|
|
689
|
-
}
|
|
690
|
-
if (audio.error.code === 4) {
|
|
691
|
-
state.canPlayRecord = false;
|
|
692
|
-
this.state.partialNext(state);
|
|
693
|
-
}
|
|
694
|
-
const errorMsg = [
|
|
695
|
-
void 0,
|
|
696
|
-
"MEDIA_ERR_ABORTED: fetch aborted by user",
|
|
697
|
-
"MEDIA_ERR_NETWORK: network failed while fetching",
|
|
698
|
-
"MEDIA_ERR_DECODE: audio fetched but couldn’t decode",
|
|
699
|
-
"MEDIA_ERR_SRC_NOT_SUPPORTED: source not supported"
|
|
700
|
-
][audio?.error?.code];
|
|
701
|
-
if (!errorMsg) return;
|
|
702
|
-
defaultRegisterAudioPlayerError({ error: new Error(errorMsg + ` (${audio.src})`) });
|
|
703
|
-
};
|
|
704
|
-
const handleTimeupdate = () => {
|
|
705
|
-
const t = audioElement?.currentTime ?? 0;
|
|
706
|
-
if (this._restoringPosition && t === 0) return;
|
|
707
|
-
if (!this.isPlaying && t === 0 && this.secondsElapsed > 0) return;
|
|
708
|
-
this.setSecondsElapsed(t);
|
|
709
|
-
};
|
|
710
|
-
const handleLoadedMetadata = () => {
|
|
711
|
-
if (audioElement) {
|
|
712
|
-
this.updateDurationFromElement(audioElement);
|
|
713
|
-
}
|
|
714
|
-
};
|
|
715
|
-
audioElement.addEventListener("ended", handleEnded);
|
|
716
|
-
audioElement.addEventListener("error", handleError);
|
|
717
|
-
audioElement.addEventListener("loadedmetadata", handleLoadedMetadata);
|
|
718
|
-
audioElement.addEventListener("timeupdate", handleTimeupdate);
|
|
719
|
-
this.unsubscribeEventListeners = () => {
|
|
720
|
-
audioElement.pause();
|
|
721
|
-
audioElement.removeEventListener("ended", handleEnded);
|
|
722
|
-
audioElement.removeEventListener("error", handleError);
|
|
723
|
-
audioElement.removeEventListener("loadedmetadata", handleLoadedMetadata);
|
|
724
|
-
audioElement.removeEventListener("timeupdate", handleTimeupdate);
|
|
725
|
-
};
|
|
726
|
-
};
|
|
727
|
-
this._data = {
|
|
728
|
-
durationSeconds,
|
|
729
|
-
fileSize,
|
|
730
|
-
id,
|
|
731
|
-
mimeType,
|
|
732
|
-
src,
|
|
733
|
-
title,
|
|
734
|
-
waveformData
|
|
735
|
-
};
|
|
736
|
-
this._pool = pool;
|
|
737
|
-
this.setPlugins(() => plugins ?? []);
|
|
738
|
-
const playbackRates = customPlaybackRates?.length ? customPlaybackRates : DEFAULT_PLAYBACK_RATES;
|
|
739
|
-
const canPlayRecord = mimeType ? !!new Audio().canPlayType(mimeType) : true;
|
|
740
|
-
this.state = new StateStore({
|
|
741
|
-
canPlayRecord,
|
|
742
|
-
currentPlaybackRate: playbackRates[0],
|
|
743
|
-
durationSeconds,
|
|
744
|
-
elementRef: null,
|
|
745
|
-
isPlaying: false,
|
|
746
|
-
playbackError: null,
|
|
747
|
-
playbackRates,
|
|
748
|
-
progressPercent: 0,
|
|
749
|
-
secondsElapsed: 0
|
|
750
|
-
});
|
|
751
|
-
this.plugins.forEach((p) => p.onInit?.({ player: this }));
|
|
752
|
-
this.preloadMetadata();
|
|
753
|
-
}
|
|
754
|
-
get plugins() {
|
|
755
|
-
return Array.from(this._plugins.values());
|
|
756
|
-
}
|
|
757
|
-
get canPlayRecord() {
|
|
758
|
-
return this.state.getLatestValue().canPlayRecord;
|
|
759
|
-
}
|
|
760
|
-
get elementRef() {
|
|
761
|
-
return this.state.getLatestValue().elementRef;
|
|
762
|
-
}
|
|
763
|
-
get isPlaying() {
|
|
764
|
-
return this.state.getLatestValue().isPlaying;
|
|
765
|
-
}
|
|
766
|
-
get currentPlaybackRate() {
|
|
767
|
-
return this.state.getLatestValue().currentPlaybackRate;
|
|
768
|
-
}
|
|
769
|
-
get playbackRates() {
|
|
770
|
-
return this.state.getLatestValue().playbackRates;
|
|
771
|
-
}
|
|
772
|
-
get durationSeconds() {
|
|
773
|
-
return this.state.getLatestValue().durationSeconds;
|
|
774
|
-
}
|
|
775
|
-
get fileSize() {
|
|
776
|
-
return this._data.fileSize;
|
|
777
|
-
}
|
|
778
|
-
get id() {
|
|
779
|
-
return this._data.id;
|
|
780
|
-
}
|
|
781
|
-
get src() {
|
|
782
|
-
return this._data.src;
|
|
783
|
-
}
|
|
784
|
-
get mimeType() {
|
|
785
|
-
return this._data.mimeType;
|
|
786
|
-
}
|
|
787
|
-
get title() {
|
|
788
|
-
return this._data.title;
|
|
789
|
-
}
|
|
790
|
-
get waveformData() {
|
|
791
|
-
return this._data.waveformData;
|
|
792
|
-
}
|
|
793
|
-
get secondsElapsed() {
|
|
794
|
-
return this.state.getLatestValue().secondsElapsed;
|
|
795
|
-
}
|
|
796
|
-
get progressPercent() {
|
|
797
|
-
return this.state.getLatestValue().progressPercent;
|
|
798
|
-
}
|
|
799
|
-
get disposed() {
|
|
800
|
-
return this._disposed;
|
|
801
|
-
}
|
|
802
|
-
ensureElementRef() {
|
|
803
|
-
if (this._disposed) {
|
|
804
|
-
throw new Error("AudioPlayer is disposed");
|
|
805
|
-
}
|
|
806
|
-
if (!this.elementRef) {
|
|
807
|
-
const el = this._pool.acquireElement({
|
|
808
|
-
ownerId: this.id,
|
|
809
|
-
src: this.src
|
|
810
|
-
});
|
|
811
|
-
this.setRef(el);
|
|
812
|
-
}
|
|
813
|
-
return this.elementRef;
|
|
814
|
-
}
|
|
815
|
-
setDescriptor(descriptor) {
|
|
816
|
-
const previousSrc = this.src;
|
|
817
|
-
this._data = { ...this._data, ...descriptor };
|
|
818
|
-
if (descriptor.src !== previousSrc && this.elementRef) {
|
|
819
|
-
this.elementRef.src = descriptor.src;
|
|
820
|
-
}
|
|
821
|
-
if (descriptor.src && descriptor.src !== previousSrc) {
|
|
822
|
-
this.clearMetadataProbe();
|
|
823
|
-
if (descriptor.durationSeconds == null) {
|
|
824
|
-
this.setDurationSeconds(void 0);
|
|
825
|
-
this.preloadMetadata();
|
|
826
|
-
} else {
|
|
827
|
-
this.setDurationSeconds(descriptor.durationSeconds);
|
|
828
|
-
}
|
|
829
|
-
return;
|
|
830
|
-
}
|
|
831
|
-
if (descriptor.durationSeconds != null) {
|
|
832
|
-
this.setDurationSeconds(descriptor.durationSeconds);
|
|
833
|
-
}
|
|
834
|
-
}
|
|
835
|
-
releaseElement({ resetState }) {
|
|
836
|
-
this.clearPendingLoadedMeta();
|
|
837
|
-
this.clearMetadataProbe();
|
|
838
|
-
this._restoringPosition = false;
|
|
839
|
-
if (resetState) {
|
|
840
|
-
this.stop();
|
|
841
|
-
} else {
|
|
842
|
-
this.state.partialNext({ isPlaying: false });
|
|
843
|
-
if (this.elementRef) {
|
|
844
|
-
try {
|
|
845
|
-
this.elementRef.pause();
|
|
846
|
-
} catch {
|
|
847
|
-
}
|
|
848
|
-
}
|
|
849
|
-
}
|
|
850
|
-
if (this.elementRef) {
|
|
851
|
-
this._pool.releaseElement(this.id);
|
|
852
|
-
this.setRef(null);
|
|
853
|
-
}
|
|
854
|
-
}
|
|
855
|
-
setPlugins(setter) {
|
|
856
|
-
this._plugins = setter(this.plugins).reduce((acc, plugin) => {
|
|
857
|
-
if (plugin.id) {
|
|
858
|
-
acc.set(plugin.id, plugin);
|
|
859
|
-
}
|
|
860
|
-
return acc;
|
|
861
|
-
}, /* @__PURE__ */ new Map());
|
|
862
|
-
}
|
|
863
|
-
}
|
|
864
|
-
class AudioPlayerPool {
|
|
865
|
-
constructor(config) {
|
|
866
|
-
this.state = new StateStore({
|
|
867
|
-
activeAudioPlayer: null
|
|
868
|
-
});
|
|
869
|
-
this.pool = /* @__PURE__ */ new Map();
|
|
870
|
-
this.audios = /* @__PURE__ */ new Map();
|
|
871
|
-
this.sharedAudio = null;
|
|
872
|
-
this.sharedOwnerId = null;
|
|
873
|
-
this.getOrAdd = (params) => {
|
|
874
|
-
const { playbackRates, plugins, ...descriptor } = params;
|
|
875
|
-
let player = this.pool.get(params.id);
|
|
876
|
-
if (player) {
|
|
877
|
-
if (!player.disposed) {
|
|
878
|
-
player.setDescriptor(descriptor);
|
|
879
|
-
return player;
|
|
880
|
-
}
|
|
881
|
-
this.deregister(params.id);
|
|
882
|
-
}
|
|
883
|
-
player = new AudioPlayer({
|
|
884
|
-
playbackRates,
|
|
885
|
-
plugins,
|
|
886
|
-
...descriptor,
|
|
887
|
-
pool: this
|
|
888
|
-
});
|
|
889
|
-
this.pool.set(params.id, player);
|
|
890
|
-
return player;
|
|
891
|
-
};
|
|
892
|
-
this.acquireElement = ({ ownerId, src }) => {
|
|
893
|
-
if (!this.allowConcurrentPlayback) {
|
|
894
|
-
if (!this.sharedAudio) {
|
|
895
|
-
this.sharedAudio = new Audio();
|
|
896
|
-
}
|
|
897
|
-
if (this.sharedOwnerId && this.sharedOwnerId !== ownerId) {
|
|
898
|
-
const previous = this.pool.get(this.sharedOwnerId);
|
|
899
|
-
previous?.pause();
|
|
900
|
-
previous?.releaseElementForHandoff();
|
|
901
|
-
}
|
|
902
|
-
this.sharedOwnerId = ownerId;
|
|
903
|
-
if (this.sharedAudio.src !== src) {
|
|
904
|
-
this.sharedAudio.src = src;
|
|
905
|
-
}
|
|
906
|
-
return this.sharedAudio;
|
|
907
|
-
}
|
|
908
|
-
let audio = this.audios.get(ownerId);
|
|
909
|
-
if (!audio) {
|
|
910
|
-
audio = new Audio();
|
|
911
|
-
this.audios.set(ownerId, audio);
|
|
912
|
-
}
|
|
913
|
-
if (audio.src !== src) {
|
|
914
|
-
audio.src = src;
|
|
915
|
-
}
|
|
916
|
-
return audio;
|
|
917
|
-
};
|
|
918
|
-
this.releaseElement = (ownerId) => {
|
|
919
|
-
if (!this.allowConcurrentPlayback) {
|
|
920
|
-
if (this.sharedOwnerId !== ownerId) return;
|
|
921
|
-
const el2 = this.sharedAudio;
|
|
922
|
-
if (el2) {
|
|
923
|
-
try {
|
|
924
|
-
el2.pause();
|
|
925
|
-
} catch {
|
|
926
|
-
}
|
|
927
|
-
el2.removeAttribute("src");
|
|
928
|
-
el2.load();
|
|
929
|
-
}
|
|
930
|
-
this.sharedOwnerId = null;
|
|
931
|
-
return;
|
|
932
|
-
}
|
|
933
|
-
const el = this.audios.get(ownerId);
|
|
934
|
-
if (!el) return;
|
|
935
|
-
try {
|
|
936
|
-
el.pause();
|
|
937
|
-
} catch {
|
|
938
|
-
}
|
|
939
|
-
el.removeAttribute("src");
|
|
940
|
-
el.load();
|
|
941
|
-
this.audios.delete(ownerId);
|
|
942
|
-
};
|
|
943
|
-
this.setActiveAudioPlayer = (activeAudioPlayer) => {
|
|
944
|
-
if (this.allowConcurrentPlayback) return;
|
|
945
|
-
this.state.partialNext({ activeAudioPlayer });
|
|
946
|
-
};
|
|
947
|
-
this.remove = (id) => {
|
|
948
|
-
const player = this.pool.get(id);
|
|
949
|
-
if (!player) return;
|
|
950
|
-
player.requestRemoval();
|
|
951
|
-
};
|
|
952
|
-
this.clear = () => {
|
|
953
|
-
this.players.forEach((player) => {
|
|
954
|
-
this.remove(player.id);
|
|
955
|
-
});
|
|
956
|
-
};
|
|
957
|
-
this.registerSubscriptions = () => {
|
|
958
|
-
this.players.forEach((p) => {
|
|
959
|
-
if (p.elementRef) {
|
|
960
|
-
p.registerSubscriptions();
|
|
961
|
-
}
|
|
962
|
-
});
|
|
963
|
-
};
|
|
964
|
-
this.allowConcurrentPlayback = !!config?.allowConcurrentPlayback;
|
|
965
|
-
}
|
|
966
|
-
get players() {
|
|
967
|
-
return Array.from(this.pool.values());
|
|
968
|
-
}
|
|
969
|
-
get activeAudioPlayer() {
|
|
970
|
-
return this.state.getLatestValue().activeAudioPlayer;
|
|
971
|
-
}
|
|
972
|
-
/** Removes the AudioPlayer instance from the pool of players */
|
|
973
|
-
deregister(id) {
|
|
974
|
-
if (this.pool.has(id)) {
|
|
975
|
-
this.pool.delete(id);
|
|
976
|
-
}
|
|
977
|
-
if (this.activeAudioPlayer?.id === id) {
|
|
978
|
-
this.setActiveAudioPlayer(null);
|
|
979
|
-
}
|
|
980
|
-
}
|
|
981
|
-
}
|
|
982
|
-
const audioPlayerNotificationsPluginFactory = ({
|
|
983
|
-
addNotification,
|
|
984
|
-
panel = "channel",
|
|
985
|
-
t
|
|
986
|
-
}) => {
|
|
987
|
-
const errors = {
|
|
988
|
-
"failed-to-start": new Error(t("Failed to play the recording")),
|
|
989
|
-
"not-playable": new Error(
|
|
990
|
-
t("Recording format is not supported and cannot be reproduced")
|
|
991
|
-
),
|
|
992
|
-
"seek-not-supported": new Error(t("Cannot seek in the recording"))
|
|
993
|
-
};
|
|
994
|
-
return {
|
|
995
|
-
id: "AudioPlayerNotificationsPlugin",
|
|
996
|
-
onError: ({ errCode, error: e }) => {
|
|
997
|
-
const error = (errCode && errors[errCode]) ?? e ?? new Error(t("Error reproducing the recording"));
|
|
998
|
-
addNotification({
|
|
999
|
-
emitter: "AudioPlayer",
|
|
1000
|
-
error,
|
|
1001
|
-
message: error.message,
|
|
1002
|
-
severity: "error",
|
|
1003
|
-
targetPanels: [panel],
|
|
1004
|
-
type: "browser:audio:playback:error"
|
|
1005
|
-
});
|
|
1006
|
-
}
|
|
1007
|
-
};
|
|
1008
|
-
};
|
|
1009
|
-
const NOTIFICATION_TARGET_PANELS = [
|
|
1010
|
-
"channel",
|
|
1011
|
-
"thread",
|
|
1012
|
-
"channel-list",
|
|
1013
|
-
"thread-list"
|
|
1014
|
-
];
|
|
1015
|
-
const isNotificationTargetPanel = (value) => typeof value === "string" && NOTIFICATION_TARGET_PANELS.includes(value);
|
|
1016
|
-
const getNotificationTargetPanel = (notification) => {
|
|
1017
|
-
const targetTag = notification.tags?.find((tag) => tag.startsWith("target:"));
|
|
1018
|
-
if (targetTag) {
|
|
1019
|
-
const candidate = targetTag.slice("target:".length);
|
|
1020
|
-
if (isNotificationTargetPanel(candidate)) return candidate;
|
|
1021
|
-
}
|
|
1022
|
-
const panel = notification.origin.context?.panel;
|
|
1023
|
-
return isNotificationTargetPanel(panel) ? panel : void 0;
|
|
1024
|
-
};
|
|
1025
|
-
const getNotificationTargetPanels = (notification) => {
|
|
1026
|
-
const targetPanels = (notification.tags ?? []).filter((tag) => tag.startsWith("target:")).map((tag) => tag.slice("target:".length)).filter(
|
|
1027
|
-
(value) => isNotificationTargetPanel(value)
|
|
1028
|
-
);
|
|
1029
|
-
if (targetPanels.length > 0) {
|
|
1030
|
-
return Array.from(new Set(targetPanels));
|
|
1031
|
-
}
|
|
1032
|
-
const panel = notification.origin.context?.panel;
|
|
1033
|
-
return isNotificationTargetPanel(panel) ? [panel] : [];
|
|
1034
|
-
};
|
|
1035
|
-
const getNotificationTargetTag = (panel) => `target:${panel}`;
|
|
1036
|
-
const addNotificationTargetTag = (panel, tags) => {
|
|
1037
|
-
if (!panel) return tags ?? [];
|
|
1038
|
-
return Array.from(/* @__PURE__ */ new Set([getNotificationTargetTag(panel), ...tags ?? []]));
|
|
1039
|
-
};
|
|
1040
|
-
const isNotificationForPanel = (notification, panel, options) => {
|
|
1041
|
-
const explicitTargetPanels = getNotificationTargetPanels(notification);
|
|
1042
|
-
if (explicitTargetPanels.length > 0) {
|
|
1043
|
-
return explicitTargetPanels.includes(panel);
|
|
1044
|
-
}
|
|
1045
|
-
const resolvedPanel = options?.fallbackPanel ?? "channel";
|
|
1046
|
-
return resolvedPanel === panel;
|
|
1047
|
-
};
|
|
1048
|
-
const variantToClass = {
|
|
1049
|
-
danger: "str-chat__button--destructive",
|
|
1050
|
-
primary: "str-chat__button--primary",
|
|
1051
|
-
secondary: "str-chat__button--secondary"
|
|
1052
|
-
};
|
|
1053
|
-
const appearanceToClass = {
|
|
1054
|
-
ghost: "str-chat__button--ghost",
|
|
1055
|
-
outline: "str-chat__button--outline",
|
|
1056
|
-
solid: "str-chat__button--solid"
|
|
1057
|
-
};
|
|
1058
|
-
const sizeToClass = {
|
|
1059
|
-
lg: "str-chat__button--size-lg",
|
|
1060
|
-
md: "str-chat__button--size-md",
|
|
1061
|
-
sm: "str-chat__button--size-sm",
|
|
1062
|
-
xs: "str-chat__button--size-xs"
|
|
1063
|
-
};
|
|
1064
|
-
const Button = forwardRef(function Button2({ appearance, children, circular, className, inverseTheme, size: size2, variant, ...props }, ref) {
|
|
1065
|
-
return /* @__PURE__ */ jsx(
|
|
1066
|
-
"button",
|
|
1067
|
-
{
|
|
1068
|
-
ref,
|
|
1069
|
-
type: "button",
|
|
1070
|
-
...props,
|
|
1071
|
-
className: clsx(
|
|
1072
|
-
"str-chat__button",
|
|
1073
|
-
variant != null && variantToClass[variant],
|
|
1074
|
-
appearance != null && appearanceToClass[appearance],
|
|
1075
|
-
circular && "str-chat__button--circular",
|
|
1076
|
-
inverseTheme && "str-chat__theme-inverse",
|
|
1077
|
-
size2 != null && sizeToClass[size2],
|
|
1078
|
-
className
|
|
1079
|
-
),
|
|
1080
|
-
children: /* @__PURE__ */ jsx("div", { className: "str-chat__button__content", children })
|
|
1081
|
-
}
|
|
1082
|
-
);
|
|
1083
|
-
});
|
|
1084
375
|
const BaseIcon = ({ className, ...props }) => /* @__PURE__ */ jsx(
|
|
1085
376
|
"svg",
|
|
1086
377
|
{
|
|
@@ -1609,6 +900,16 @@ const IconChecks = createIcon(
|
|
|
1609
900
|
}
|
|
1610
901
|
)
|
|
1611
902
|
);
|
|
903
|
+
const IconDownload = createIcon(
|
|
904
|
+
"IconDownload",
|
|
905
|
+
/* @__PURE__ */ jsx(
|
|
906
|
+
"path",
|
|
907
|
+
{
|
|
908
|
+
d: "M2.375 11.25C2.375 10.8358 2.71079 10.5 3.125 10.5C3.53921 10.5 3.875 10.8358 3.875 11.25V15.5H16.125V11.25C16.125 10.8358 16.4608 10.5 16.875 10.5C17.2892 10.5 17.625 10.8358 17.625 11.25V16.25C17.625 16.6642 17.2892 17 16.875 17H3.125C2.71079 17 2.375 16.6642 2.375 16.25V11.25ZM9.25 2.5C9.25 2.08579 9.58579 1.75 10 1.75C10.4142 1.75 10.75 2.08579 10.75 2.5V9.43945L12.5947 7.59473C12.8876 7.30183 13.3624 7.30183 13.6553 7.59473C13.9482 7.88762 13.9482 8.36238 13.6553 8.65527L10.5303 11.7803C10.2374 12.0732 9.76262 12.0732 9.46973 11.7803L6.34473 8.65527C6.05183 8.36238 6.05183 7.88762 6.34473 7.59473C6.63762 7.30183 7.11238 7.30183 7.40527 7.59473L9.25 9.43945V2.5Z",
|
|
909
|
+
fill: "currentColor"
|
|
910
|
+
}
|
|
911
|
+
)
|
|
912
|
+
);
|
|
1612
913
|
const IconEdit = createIcon(
|
|
1613
914
|
"IconEdit",
|
|
1614
915
|
/* @__PURE__ */ jsx(
|
|
@@ -1899,301 +1200,1019 @@ const IconUserAdd = createIcon(
|
|
|
1899
1200
|
/* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_14246_498359)", children: /* @__PURE__ */ jsx(
|
|
1900
1201
|
"path",
|
|
1901
1202
|
{
|
|
1902
|
-
d: "M15.625 10.625H19.375M17.5 8.75V12.5M8.4375 12.5C11.0263 12.5 13.125 10.4013 13.125 7.8125C13.125 5.22367 11.0263 3.125 8.4375 3.125C5.84867 3.125 3.75 5.22367 3.75 7.8125C3.75 10.4013 5.84867 12.5 8.4375 12.5ZM8.4375 12.5C5.74688 12.5 3.48047 13.7148 1.875 15.625M8.4375 12.5C11.1281 12.5 13.3945 13.7148 15 15.625",
|
|
1203
|
+
d: "M15.625 10.625H19.375M17.5 8.75V12.5M8.4375 12.5C11.0263 12.5 13.125 10.4013 13.125 7.8125C13.125 5.22367 11.0263 3.125 8.4375 3.125C5.84867 3.125 3.75 5.22367 3.75 7.8125C3.75 10.4013 5.84867 12.5 8.4375 12.5ZM8.4375 12.5C5.74688 12.5 3.48047 13.7148 1.875 15.625M8.4375 12.5C11.1281 12.5 13.3945 13.7148 15 15.625",
|
|
1204
|
+
fill: "none",
|
|
1205
|
+
stroke: "currentColor",
|
|
1206
|
+
strokeLinecap: "round",
|
|
1207
|
+
strokeLinejoin: "round",
|
|
1208
|
+
strokeWidth: "1.5"
|
|
1209
|
+
}
|
|
1210
|
+
) }),
|
|
1211
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14246_498359", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
1212
|
+
] })
|
|
1213
|
+
);
|
|
1214
|
+
const IconUserCheck = createIcon(
|
|
1215
|
+
"IconUserCheck",
|
|
1216
|
+
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1217
|
+
/* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_14236_425131)", children: /* @__PURE__ */ jsx(
|
|
1218
|
+
"path",
|
|
1219
|
+
{
|
|
1220
|
+
d: "M8.4375 12.5C11.0263 12.5 13.125 10.4013 13.125 7.8125C13.125 5.22367 11.0263 3.125 8.4375 3.125C5.84867 3.125 3.75 5.22367 3.75 7.8125C3.75 10.4013 5.84867 12.5 8.4375 12.5ZM8.4375 12.5C5.74688 12.5 3.48047 13.7148 1.875 15.625M8.4375 12.5C11.1281 12.5 13.3945 13.7148 15 15.625M15.625 11.25L16.875 12.5L19.375 10",
|
|
1221
|
+
fill: "none",
|
|
1222
|
+
stroke: "currentColor",
|
|
1223
|
+
strokeLinecap: "round",
|
|
1224
|
+
strokeLinejoin: "round",
|
|
1225
|
+
strokeWidth: "1.5"
|
|
1226
|
+
}
|
|
1227
|
+
) }),
|
|
1228
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14236_425131", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
1229
|
+
] })
|
|
1230
|
+
);
|
|
1231
|
+
const IconUserRemove = createIcon(
|
|
1232
|
+
"IconUserRemove",
|
|
1233
|
+
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1234
|
+
/* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_14246_434209)", children: /* @__PURE__ */ jsx(
|
|
1235
|
+
"path",
|
|
1236
|
+
{
|
|
1237
|
+
d: "M15.625 10.625H19.375M8.4375 12.5C11.0263 12.5 13.125 10.4013 13.125 7.8125C13.125 5.22367 11.0263 3.125 8.4375 3.125C5.84867 3.125 3.75 5.22367 3.75 7.8125C3.75 10.4013 5.84867 12.5 8.4375 12.5ZM8.4375 12.5C5.74688 12.5 3.48047 13.7148 1.875 15.625M8.4375 12.5C11.1281 12.5 13.3945 13.7148 15 15.625",
|
|
1238
|
+
fill: "none",
|
|
1239
|
+
stroke: "currentColor",
|
|
1240
|
+
strokeLinecap: "round",
|
|
1241
|
+
strokeLinejoin: "round",
|
|
1242
|
+
strokeWidth: "1.5"
|
|
1243
|
+
}
|
|
1244
|
+
) }),
|
|
1245
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14246_434209", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
1246
|
+
] })
|
|
1247
|
+
);
|
|
1248
|
+
const IconPin = createIcon(
|
|
1249
|
+
"IconPin",
|
|
1250
|
+
/* @__PURE__ */ jsx(
|
|
1251
|
+
"path",
|
|
1252
|
+
{
|
|
1253
|
+
d: "M7.52271 12.4773L3.75006 16.25M17.9422 7.68279C18.0594 7.56559 18.1252 7.40668 18.1252 7.24099C18.1252 7.0753 18.0594 6.9164 17.9422 6.7992L13.2032 2.05779C13.086 1.94067 12.9271 1.87488 12.7614 1.87488C12.5957 1.87488 12.4368 1.94067 12.3196 2.05779L7.84303 6.54685C7.84303 6.54685 5.67506 5.46326 3.35943 7.33201C3.29077 7.38697 3.23447 7.45581 3.19424 7.53402C3.154 7.61224 3.13072 7.69806 3.12593 7.78589C3.12114 7.87371 3.13493 7.96156 3.16642 8.04369C3.19791 8.12581 3.24637 8.20037 3.30865 8.26248L11.7383 16.6914C11.8015 16.7541 11.8773 16.8025 11.9606 16.8336C12.044 16.8646 12.133 16.8775 12.2218 16.8713C12.3105 16.8652 12.3969 16.8402 12.4752 16.798C12.5535 16.7558 12.6219 16.6973 12.6758 16.6265C13.3313 15.7547 14.361 13.9633 13.4657 12.1734L17.9422 7.68279Z",
|
|
1254
|
+
fill: "none",
|
|
1255
|
+
stroke: "currentColor",
|
|
1256
|
+
strokeLinecap: "round",
|
|
1257
|
+
strokeLinejoin: "round",
|
|
1258
|
+
strokeWidth: "1.5"
|
|
1259
|
+
}
|
|
1260
|
+
)
|
|
1261
|
+
);
|
|
1262
|
+
const IconPlayFill = createIcon(
|
|
1263
|
+
"IconPlayFill",
|
|
1264
|
+
/* @__PURE__ */ jsx("path", { d: "M18.75 10C18.7505 10.2122 18.6961 10.4209 18.5921 10.6059C18.488 10.7908 18.3379 10.9457 18.1562 11.0555L6.9 17.9414C6.71022 18.0576 6.49287 18.1211 6.27037 18.1252C6.04788 18.1293 5.82832 18.0739 5.63438 17.9648C5.44227 17.8574 5.28225 17.7008 5.17075 17.511C5.05926 17.3213 5.00032 17.1052 5 16.8852V3.11484C5.00032 2.89475 5.05926 2.67872 5.17075 2.48896C5.28225 2.2992 5.44227 2.14257 5.63438 2.03516C5.82832 1.92605 6.04788 1.87071 6.27037 1.87483C6.49287 1.87895 6.71022 1.94239 6.9 2.05859L18.1562 8.94453C18.3379 9.05428 18.488 9.20916 18.5921 9.39411C18.6961 9.57906 18.7505 9.78779 18.75 10Z" })
|
|
1265
|
+
);
|
|
1266
|
+
const IconPlus = createIcon(
|
|
1267
|
+
"IconPlus",
|
|
1268
|
+
/* @__PURE__ */ jsx(
|
|
1269
|
+
"path",
|
|
1270
|
+
{
|
|
1271
|
+
d: "M3.125 10H16.875M10 3.125V16.875",
|
|
1272
|
+
fill: "none",
|
|
1273
|
+
stroke: "currentColor",
|
|
1274
|
+
strokeLinecap: "round",
|
|
1275
|
+
strokeLinejoin: "round",
|
|
1276
|
+
strokeWidth: "2"
|
|
1277
|
+
}
|
|
1278
|
+
)
|
|
1279
|
+
);
|
|
1280
|
+
const IconPlusSmall = createIcon(
|
|
1281
|
+
"IconPlusSmall",
|
|
1282
|
+
/* @__PURE__ */ jsx(
|
|
1283
|
+
"path",
|
|
1284
|
+
{
|
|
1285
|
+
d: "M3.125 10H16.875M10 3.125V16.875",
|
|
1286
|
+
fill: "none",
|
|
1287
|
+
stroke: "currentColor",
|
|
1288
|
+
strokeLinecap: "round",
|
|
1289
|
+
strokeLinejoin: "round",
|
|
1290
|
+
strokeWidth: "1.5"
|
|
1291
|
+
}
|
|
1292
|
+
)
|
|
1293
|
+
);
|
|
1294
|
+
const IconCommand = createIcon(
|
|
1295
|
+
"IconCommand",
|
|
1296
|
+
/* @__PURE__ */ jsx(
|
|
1297
|
+
"path",
|
|
1298
|
+
{
|
|
1299
|
+
d: "M6.25 7.5L9.375 10L6.25 12.5M10.625 12.5H13.75M3.125 3.75H16.875C17.2202 3.75 17.5 4.02982 17.5 4.375V15.625C17.5 15.9702 17.2202 16.25 16.875 16.25H3.125C2.77982 16.25 2.5 15.9702 2.5 15.625V4.375C2.5 4.02982 2.77982 3.75 3.125 3.75Z",
|
|
1300
|
+
fill: "none",
|
|
1301
|
+
stroke: "currentColor",
|
|
1302
|
+
strokeLinecap: "round",
|
|
1303
|
+
strokeLinejoin: "round",
|
|
1304
|
+
strokeWidth: "1.5"
|
|
1305
|
+
}
|
|
1306
|
+
)
|
|
1307
|
+
);
|
|
1308
|
+
const IconCopy = createIcon(
|
|
1309
|
+
"IconCopy",
|
|
1310
|
+
/* @__PURE__ */ jsx(
|
|
1311
|
+
"path",
|
|
1312
|
+
{
|
|
1313
|
+
d: "M13.125 13.125H16.875V3.125H6.875V6.875M3.125 6.875H13.125V16.875H3.125V6.875Z",
|
|
1314
|
+
fill: "none",
|
|
1315
|
+
stroke: "currentColor",
|
|
1316
|
+
strokeLinecap: "round",
|
|
1317
|
+
strokeLinejoin: "round",
|
|
1318
|
+
strokeWidth: "1.5"
|
|
1319
|
+
}
|
|
1320
|
+
)
|
|
1321
|
+
);
|
|
1322
|
+
const IconBolt = createIcon(
|
|
1323
|
+
"IconBolt",
|
|
1324
|
+
/* @__PURE__ */ jsx("path", { d: "M16.7071 9.80157L7.95711 19.1766C7.86438 19.2755 7.74198 19.3416 7.60839 19.3649C7.47479 19.3882 7.33724 19.3674 7.2165 19.3057C7.09576 19.244 6.99837 19.1446 6.93904 19.0227C6.8797 18.9007 6.86164 18.7628 6.88757 18.6297L8.03289 12.9008L3.53054 11.2102C3.43385 11.174 3.34762 11.1144 3.27956 11.0368C3.2115 10.9592 3.16373 10.8659 3.14052 10.7653C3.1173 10.6647 3.11937 10.5599 3.14653 10.4603C3.17369 10.3607 3.2251 10.2694 3.29617 10.1945L12.0462 0.819538C12.1389 0.720581 12.2613 0.654468 12.3949 0.631176C12.5285 0.607884 12.666 0.628675 12.7868 0.690414C12.9075 0.752152 13.0049 0.851488 13.0642 0.97343C13.1236 1.09537 13.1416 1.2333 13.1157 1.36641L11.9673 7.10157L16.4696 8.78985C16.5656 8.82626 16.6511 8.88576 16.7187 8.96307C16.7862 9.04039 16.8336 9.13315 16.8568 9.23316C16.88 9.33317 16.8781 9.43734 16.8515 9.53648C16.8248 9.63562 16.7742 9.72666 16.704 9.80157H16.7071Z" })
|
|
1325
|
+
);
|
|
1326
|
+
const IconTranslate = createIcon(
|
|
1327
|
+
"IconTranslate",
|
|
1328
|
+
/* @__PURE__ */ jsx(
|
|
1329
|
+
"path",
|
|
1330
|
+
{
|
|
1331
|
+
d: "M18.75 16.875L14.375 8.125L10 16.875M11.25 14.375H17.5M7.5 2.5V4.375M2.5 4.375H12.5M10 4.375C10 6.36412 9.20982 8.27178 7.8033 9.6783C6.39678 11.0848 4.48912 11.875 2.5 11.875M5.42734 6.875C5.94442 8.33751 6.90226 9.60371 8.16893 10.4992C9.4356 11.3947 10.9488 11.8753 12.5 11.875",
|
|
1332
|
+
fill: "none",
|
|
1333
|
+
stroke: "currentColor",
|
|
1334
|
+
strokeLinecap: "round",
|
|
1335
|
+
strokeLinejoin: "round",
|
|
1336
|
+
strokeWidth: "1.5"
|
|
1337
|
+
}
|
|
1338
|
+
)
|
|
1339
|
+
);
|
|
1340
|
+
const IconDelete = createIcon(
|
|
1341
|
+
"IconDelete",
|
|
1342
|
+
/* @__PURE__ */ jsx(
|
|
1343
|
+
"path",
|
|
1344
|
+
{
|
|
1345
|
+
d: "M16.875 4.375H3.125M8.125 8.125V13.125M11.875 8.125V13.125M15.625 4.375V16.25C15.625 16.4158 15.5592 16.5747 15.4419 16.6919C15.3247 16.8092 15.1658 16.875 15 16.875H5C4.83424 16.875 4.67527 16.8092 4.55806 16.6919C4.44085 16.5747 4.375 16.4158 4.375 16.25V4.375M13.125 4.375V3.125C13.125 2.79348 12.9933 2.47554 12.7589 2.24112C12.5245 2.0067 12.2065 1.875 11.875 1.875H8.125C7.79348 1.875 7.47554 2.0067 7.24112 2.24112C7.0067 2.47554 6.875 2.79348 6.875 3.125V4.375",
|
|
1346
|
+
fill: "none",
|
|
1347
|
+
stroke: "currentColor",
|
|
1348
|
+
strokeLinecap: "round",
|
|
1349
|
+
strokeLinejoin: "round",
|
|
1350
|
+
strokeWidth: "1.5"
|
|
1351
|
+
}
|
|
1352
|
+
)
|
|
1353
|
+
);
|
|
1354
|
+
const IconTrophy = createIcon(
|
|
1355
|
+
"IconTrophy",
|
|
1356
|
+
/* @__PURE__ */ jsx(
|
|
1357
|
+
"path",
|
|
1358
|
+
{
|
|
1359
|
+
d: "M7.5 17.5H12.5M10 14.375V17.5M4.53125 10H3.75C3.08696 10 2.45107 9.73661 1.98223 9.26777C1.51339 8.79893 1.25 8.16304 1.25 7.5V6.25C1.25 6.08424 1.31585 5.92527 1.43306 5.80806C1.55027 5.69085 1.70924 5.625 1.875 5.625H4.375M15.4688 10H16.25C16.913 10 17.5489 9.73661 18.0178 9.26777C18.4866 8.79893 18.75 8.16304 18.75 7.5V6.25C18.75 6.08424 18.6842 5.92527 18.5669 5.80806C18.4497 5.69085 18.2908 5.625 18.125 5.625H15.625M4.375 3.75H15.625V8.67969C15.625 11.7812 13.1445 14.3516 10.043 14.375C9.30068 14.3807 8.5646 14.2394 7.87718 13.9592C7.18975 13.6791 6.56458 13.2656 6.03769 12.7427C5.5108 12.2198 5.09262 11.5978 4.80725 10.9126C4.52188 10.2273 4.37498 9.49231 4.375 8.75V3.75Z",
|
|
1360
|
+
fill: "none",
|
|
1361
|
+
stroke: "currentColor",
|
|
1362
|
+
strokeLinecap: "round",
|
|
1363
|
+
strokeLinejoin: "round",
|
|
1364
|
+
strokeWidth: "1.5"
|
|
1365
|
+
}
|
|
1366
|
+
)
|
|
1367
|
+
);
|
|
1368
|
+
const IconUnpin = createIcon(
|
|
1369
|
+
"IconUnpin",
|
|
1370
|
+
/* @__PURE__ */ jsx(
|
|
1371
|
+
"path",
|
|
1372
|
+
{
|
|
1373
|
+
d: "M7.52271 12.4773L3.75006 16.25M3.75006 3.12498L16.2501 16.875M14.4532 11.1828L17.9415 7.68279C18.0586 7.56559 18.1244 7.40668 18.1244 7.24099C18.1244 7.0753 18.0586 6.9164 17.9415 6.7992L13.2032 2.05779C13.086 1.94067 12.9271 1.87488 12.7614 1.87488C12.5957 1.87488 12.4368 1.94067 12.3196 2.05779L9.09615 5.28904M6.58756 6.24998C5.74537 6.18435 4.57271 6.3531 3.35943 7.33201C3.29077 7.38697 3.23447 7.45581 3.19424 7.53402C3.154 7.61224 3.13072 7.69806 3.12593 7.78589C3.12114 7.87371 3.13493 7.96156 3.16642 8.04369C3.19791 8.12581 3.24637 8.20037 3.30865 8.26248L11.7383 16.6914C11.8015 16.7541 11.8773 16.8025 11.9606 16.8336C12.044 16.8646 12.133 16.8775 12.2218 16.8713C12.3105 16.8652 12.3969 16.8402 12.4752 16.798C12.5535 16.7558 12.6219 16.6973 12.6758 16.6265C13.0829 16.0851 13.6344 15.1898 13.779 14.1594",
|
|
1374
|
+
fill: "none",
|
|
1375
|
+
stroke: "currentColor",
|
|
1376
|
+
strokeLinecap: "round",
|
|
1377
|
+
strokeLinejoin: "round",
|
|
1378
|
+
strokeWidth: "1.5"
|
|
1379
|
+
}
|
|
1380
|
+
)
|
|
1381
|
+
);
|
|
1382
|
+
const IconVideo = createIcon(
|
|
1383
|
+
"IconVideo",
|
|
1384
|
+
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1385
|
+
/* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_14111_491476)", children: /* @__PURE__ */ jsx(
|
|
1386
|
+
"path",
|
|
1387
|
+
{
|
|
1388
|
+
d: "M15.625 8.75L19.375 6.25V13.75L15.625 11.25M2.5 5H15C15.3452 5 15.625 5.27982 15.625 5.625V14.375C15.625 14.7202 15.3452 15 15 15H2.5C2.15482 15 1.875 14.7202 1.875 14.375V5.625C1.875 5.27982 2.15482 5 2.5 5Z",
|
|
1389
|
+
fill: "none",
|
|
1390
|
+
stroke: "currentColor",
|
|
1391
|
+
strokeLinecap: "round",
|
|
1392
|
+
strokeLinejoin: "round",
|
|
1393
|
+
strokeWidth: "1.5"
|
|
1394
|
+
}
|
|
1395
|
+
) }),
|
|
1396
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14111_491476", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
1397
|
+
] }),
|
|
1398
|
+
{ "data-rtl-mirror": "" }
|
|
1399
|
+
);
|
|
1400
|
+
const IconVideoFill = createIcon(
|
|
1401
|
+
"IconVideoFill",
|
|
1402
|
+
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1403
|
+
/* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_14064_467281)", children: /* @__PURE__ */ jsx("path", { d: "M15 5.625V14.375C15 14.7065 14.8683 15.0245 14.6339 15.2589C14.3995 15.4933 14.0815 15.625 13.75 15.625H2.5C2.16848 15.625 1.85054 15.4933 1.61612 15.2589C1.3817 15.0245 1.25 14.7065 1.25 14.375V5.625C1.25 5.29348 1.3817 4.97554 1.61612 4.74112C1.85054 4.5067 2.16848 4.375 2.5 4.375H13.75C14.0815 4.375 14.3995 4.5067 14.6339 4.74112C14.8683 4.97554 15 5.29348 15 5.625ZM19.5312 5.64453C19.4431 5.62295 19.3513 5.62029 19.2621 5.63672C19.1728 5.65315 19.088 5.68829 19.0133 5.73984L16.3891 7.48906C16.3463 7.51762 16.3112 7.55631 16.2869 7.6017C16.2626 7.64708 16.25 7.69776 16.25 7.74922V12.2508C16.25 12.3022 16.2626 12.3529 16.2869 12.3983C16.3112 12.4437 16.3463 12.4824 16.3891 12.5109L19.0281 14.2703C19.1269 14.3362 19.2424 14.3726 19.3611 14.3752C19.4798 14.3779 19.5968 14.3466 19.6984 14.2852C19.7924 14.2254 19.8695 14.1425 19.9223 14.0444C19.9751 13.9464 20.0019 13.8364 20 13.725V6.25C20.0001 6.11139 19.9541 5.97668 19.8692 5.86708C19.7843 5.75747 19.6655 5.67918 19.5312 5.64453Z" }) }),
|
|
1404
|
+
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14064_467281", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
1405
|
+
] }),
|
|
1406
|
+
{ "data-rtl-mirror": "" }
|
|
1407
|
+
);
|
|
1408
|
+
const IconAudio = createIcon(
|
|
1409
|
+
"IconAudio",
|
|
1410
|
+
/* @__PURE__ */ jsx(
|
|
1411
|
+
"path",
|
|
1412
|
+
{
|
|
1413
|
+
d: "M15.625 8.125V11.875M18.125 6.875V13.125M6.875 13.125H3.125C2.95924 13.125 2.80027 13.0592 2.68306 12.9419C2.56585 12.8247 2.5 12.6658 2.5 12.5V7.5C2.5 7.33424 2.56585 7.17527 2.68306 7.05806C2.80027 6.94085 2.95924 6.875 3.125 6.875H6.875L12.5 2.5V17.5L6.875 13.125Z",
|
|
1414
|
+
fill: "none",
|
|
1415
|
+
stroke: "currentColor",
|
|
1416
|
+
strokeLinecap: "round",
|
|
1417
|
+
strokeLinejoin: "round",
|
|
1418
|
+
strokeWidth: "1.5"
|
|
1419
|
+
}
|
|
1420
|
+
),
|
|
1421
|
+
{ "data-rtl-mirror": "" }
|
|
1422
|
+
);
|
|
1423
|
+
const IconArchive = createIcon(
|
|
1424
|
+
"IconArchive",
|
|
1425
|
+
/* @__PURE__ */ jsx(
|
|
1426
|
+
"path",
|
|
1427
|
+
{
|
|
1428
|
+
d: "M16.875 7.5V15C16.875 15.1658 16.8092 15.3247 16.6919 15.4419C16.5747 15.5592 16.4158 15.625 16.25 15.625H3.75C3.58424 15.625 3.42527 15.5592 3.30806 15.4419C3.19085 15.3247 3.125 15.1658 3.125 15V7.5M8.125 10.625H11.875M2.5 4.375H17.5C17.8452 4.375 18.125 4.65482 18.125 5V6.875C18.125 7.22018 17.8452 7.5 17.5 7.5H2.5C2.15482 7.5 1.875 7.22018 1.875 6.875V5C1.875 4.65482 2.15482 4.375 2.5 4.375Z",
|
|
1429
|
+
fill: "none",
|
|
1430
|
+
stroke: "currentColor",
|
|
1431
|
+
strokeLinecap: "round",
|
|
1432
|
+
strokeLinejoin: "round",
|
|
1433
|
+
strokeWidth: "1.5"
|
|
1434
|
+
}
|
|
1435
|
+
)
|
|
1436
|
+
);
|
|
1437
|
+
const IconLoading = createIcon(
|
|
1438
|
+
"IconLoading",
|
|
1439
|
+
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1440
|
+
/* @__PURE__ */ jsx(
|
|
1441
|
+
"path",
|
|
1442
|
+
{
|
|
1443
|
+
d: "M17.5 10C17.5 14.1422 14.1422 17.5 10 17.5C5.85787 17.5 2.5 14.1422 2.5 10C2.5 5.85787 5.85787 2.5 10 2.5C14.1422 2.5 17.5 5.85787 17.5 10Z",
|
|
1444
|
+
fill: "none",
|
|
1445
|
+
stroke: "currentColor",
|
|
1446
|
+
strokeOpacity: "0.3",
|
|
1447
|
+
strokeWidth: "2"
|
|
1448
|
+
}
|
|
1449
|
+
),
|
|
1450
|
+
/* @__PURE__ */ jsx(
|
|
1451
|
+
"path",
|
|
1452
|
+
{
|
|
1453
|
+
d: "M17.4544 10.8334C17.0701 14.3097 14.3098 17.07 10.8335 17.4543",
|
|
1903
1454
|
fill: "none",
|
|
1904
1455
|
stroke: "currentColor",
|
|
1905
1456
|
strokeLinecap: "round",
|
|
1906
|
-
|
|
1907
|
-
|
|
1457
|
+
strokeWidth: "2"
|
|
1458
|
+
}
|
|
1459
|
+
)
|
|
1460
|
+
] })
|
|
1461
|
+
);
|
|
1462
|
+
const IconGiphy = createIcon(
|
|
1463
|
+
"IconGiphy",
|
|
1464
|
+
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1465
|
+
/* @__PURE__ */ jsx("rect", { fill: "black", height: "20", rx: "10", width: "20" }),
|
|
1466
|
+
/* @__PURE__ */ jsx(
|
|
1467
|
+
"path",
|
|
1468
|
+
{
|
|
1469
|
+
clipRule: "evenodd",
|
|
1470
|
+
d: "M6.5997 5.50024H13.4008V14.4999H6.59912L6.5997 5.50024Z",
|
|
1471
|
+
fill: "black",
|
|
1472
|
+
fillRule: "evenodd"
|
|
1473
|
+
}
|
|
1474
|
+
),
|
|
1475
|
+
/* @__PURE__ */ jsx("path", { d: "M5.24023 5.1665H6.59998V14.8335H5.24023V5.1665Z", fill: "#04FF8E" }),
|
|
1476
|
+
/* @__PURE__ */ jsx("path", { d: "M13.4004 7.8335H14.7601V14.8335H13.4004V7.8335Z", fill: "#8E2EFF" }),
|
|
1477
|
+
/* @__PURE__ */ jsx("path", { d: "M5.24023 14.4998H14.7602V15.8333H5.24023V14.4998Z", fill: "#00C5FF" }),
|
|
1478
|
+
/* @__PURE__ */ jsx("path", { d: "M5.24023 4.16675H10.6804V5.50025H5.24023V4.16675Z", fill: "#FFF152" }),
|
|
1479
|
+
/* @__PURE__ */ jsx(
|
|
1480
|
+
"path",
|
|
1481
|
+
{
|
|
1482
|
+
d: "M13.4003 6.83316V5.50025H12.0399V4.16675H10.6802V8.16666H14.76V6.83316",
|
|
1483
|
+
fill: "#FF5B5B"
|
|
1484
|
+
}
|
|
1485
|
+
),
|
|
1486
|
+
/* @__PURE__ */ jsx("path", { d: "M13.4004 9.5V8.1665H14.7601", fill: "#551C99" }),
|
|
1487
|
+
/* @__PURE__ */ jsx(
|
|
1488
|
+
"path",
|
|
1489
|
+
{
|
|
1490
|
+
clipRule: "evenodd",
|
|
1491
|
+
d: "M10.6802 4.16675V5.50025H9.31982",
|
|
1492
|
+
fill: "#999131",
|
|
1493
|
+
fillRule: "evenodd"
|
|
1494
|
+
}
|
|
1495
|
+
)
|
|
1496
|
+
] })
|
|
1497
|
+
);
|
|
1498
|
+
const DEFAULT_PLAYBACK_RATES = [1, 1.5, 2];
|
|
1499
|
+
const isSeekable = (audioElement) => !(audioElement.duration === Infinity || isNaN(audioElement.duration));
|
|
1500
|
+
const defaultRegisterAudioPlayerError = ({
|
|
1501
|
+
error
|
|
1502
|
+
} = {}) => {
|
|
1503
|
+
if (!error) return;
|
|
1504
|
+
console.error("[AUDIO PLAYER]", error);
|
|
1505
|
+
};
|
|
1506
|
+
const elementIsPlaying = (audioElement) => audioElement && !(audioElement.paused || audioElement.ended);
|
|
1507
|
+
class AudioPlayer {
|
|
1508
|
+
constructor({
|
|
1509
|
+
durationSeconds,
|
|
1510
|
+
fileSize,
|
|
1511
|
+
id,
|
|
1512
|
+
mimeType,
|
|
1513
|
+
playbackRates: customPlaybackRates,
|
|
1514
|
+
plugins,
|
|
1515
|
+
pool,
|
|
1516
|
+
src,
|
|
1517
|
+
title,
|
|
1518
|
+
waveformData
|
|
1519
|
+
}) {
|
|
1520
|
+
this._plugins = /* @__PURE__ */ new Map();
|
|
1521
|
+
this.playTimeout = void 0;
|
|
1522
|
+
this.unsubscribeEventListeners = null;
|
|
1523
|
+
this._disposed = false;
|
|
1524
|
+
this._metadataProbe = null;
|
|
1525
|
+
this._restoringPosition = false;
|
|
1526
|
+
this._removalTimeout = void 0;
|
|
1527
|
+
this.setDurationSeconds = (durationSeconds2) => {
|
|
1528
|
+
this._data.durationSeconds = durationSeconds2;
|
|
1529
|
+
this.state.partialNext({ durationSeconds: durationSeconds2 });
|
|
1530
|
+
};
|
|
1531
|
+
this.setPlaybackStartSafetyTimeout = () => {
|
|
1532
|
+
clearTimeout(this.playTimeout);
|
|
1533
|
+
this.playTimeout = setTimeout(() => {
|
|
1534
|
+
if (!this.elementRef) return;
|
|
1535
|
+
try {
|
|
1536
|
+
this.elementRef.pause();
|
|
1537
|
+
this.state.partialNext({ isPlaying: false });
|
|
1538
|
+
} catch (e) {
|
|
1539
|
+
this.registerError({ errCode: "failed-to-start" });
|
|
1540
|
+
}
|
|
1541
|
+
}, 2e3);
|
|
1542
|
+
};
|
|
1543
|
+
this.updateDurationFromElement = (element) => {
|
|
1544
|
+
const duration = element.duration;
|
|
1545
|
+
if (typeof duration !== "number" || isNaN(duration) || !isFinite(duration) || duration <= 0) {
|
|
1546
|
+
return;
|
|
1547
|
+
}
|
|
1548
|
+
this.setDurationSeconds(duration);
|
|
1549
|
+
};
|
|
1550
|
+
this.clearMetadataProbe = () => {
|
|
1551
|
+
const probe = this._metadataProbe;
|
|
1552
|
+
this._metadataProbe = null;
|
|
1553
|
+
this._metadataProbePromise = void 0;
|
|
1554
|
+
if (!probe) return;
|
|
1555
|
+
try {
|
|
1556
|
+
probe.pause();
|
|
1557
|
+
} catch {
|
|
1558
|
+
}
|
|
1559
|
+
probe.removeAttribute("src");
|
|
1560
|
+
try {
|
|
1561
|
+
probe.load();
|
|
1562
|
+
} catch {
|
|
1563
|
+
}
|
|
1564
|
+
};
|
|
1565
|
+
this.preloadMetadata = () => {
|
|
1566
|
+
if (this._disposed || this.durationSeconds != null || !this.src || this._metadataProbePromise || typeof document === "undefined") {
|
|
1567
|
+
return;
|
|
1568
|
+
}
|
|
1569
|
+
const probe = document.createElement("audio");
|
|
1570
|
+
probe.preload = "metadata";
|
|
1571
|
+
this._metadataProbe = probe;
|
|
1572
|
+
this._metadataProbePromise = new Promise((resolve) => {
|
|
1573
|
+
const cleanup = () => {
|
|
1574
|
+
probe.removeEventListener("loadedmetadata", handleLoadedMetadata);
|
|
1575
|
+
probe.removeEventListener("error", handleError);
|
|
1576
|
+
if (this._metadataProbe === probe) {
|
|
1577
|
+
this.clearMetadataProbe();
|
|
1578
|
+
} else {
|
|
1579
|
+
this._metadataProbePromise = void 0;
|
|
1580
|
+
}
|
|
1581
|
+
resolve();
|
|
1582
|
+
};
|
|
1583
|
+
const handleLoadedMetadata = () => {
|
|
1584
|
+
this.updateDurationFromElement(probe);
|
|
1585
|
+
cleanup();
|
|
1586
|
+
};
|
|
1587
|
+
const handleError = () => {
|
|
1588
|
+
cleanup();
|
|
1589
|
+
};
|
|
1590
|
+
probe.addEventListener("loadedmetadata", handleLoadedMetadata, { once: true });
|
|
1591
|
+
probe.addEventListener("error", handleError, { once: true });
|
|
1592
|
+
probe.src = this.src;
|
|
1593
|
+
try {
|
|
1594
|
+
probe.load();
|
|
1595
|
+
} catch {
|
|
1596
|
+
cleanup();
|
|
1597
|
+
}
|
|
1598
|
+
});
|
|
1599
|
+
};
|
|
1600
|
+
this.clearPlaybackStartSafetyTimeout = () => {
|
|
1601
|
+
if (!this.elementRef) return;
|
|
1602
|
+
clearTimeout(this.playTimeout);
|
|
1603
|
+
this.playTimeout = void 0;
|
|
1604
|
+
};
|
|
1605
|
+
this.clearPendingLoadedMeta = () => {
|
|
1606
|
+
const pending = this._pendingLoadedMeta;
|
|
1607
|
+
if (pending?.element && pending.onLoaded) {
|
|
1608
|
+
pending.element.removeEventListener("loadedmetadata", pending.onLoaded);
|
|
1609
|
+
}
|
|
1610
|
+
this._pendingLoadedMeta = void 0;
|
|
1611
|
+
};
|
|
1612
|
+
this.restoreSavedPosition = (elementRef) => {
|
|
1613
|
+
const saved = this.secondsElapsed;
|
|
1614
|
+
if (!saved || saved <= 0) return;
|
|
1615
|
+
const apply = () => {
|
|
1616
|
+
const duration = elementRef.duration;
|
|
1617
|
+
const clamped = typeof duration === "number" && !isNaN(duration) && isFinite(duration) ? Math.min(saved, duration) : saved;
|
|
1618
|
+
try {
|
|
1619
|
+
if (elementRef.currentTime === clamped) return;
|
|
1620
|
+
elementRef.currentTime = clamped;
|
|
1621
|
+
this.setSecondsElapsed(clamped);
|
|
1622
|
+
} catch {
|
|
1623
|
+
}
|
|
1624
|
+
};
|
|
1625
|
+
if (elementRef.readyState < 1) {
|
|
1626
|
+
this.clearPendingLoadedMeta();
|
|
1627
|
+
this._restoringPosition = true;
|
|
1628
|
+
const onLoaded = () => {
|
|
1629
|
+
if (this._pendingLoadedMeta?.onLoaded !== onLoaded) return;
|
|
1630
|
+
this._pendingLoadedMeta = void 0;
|
|
1631
|
+
if (this.elementRef !== elementRef) {
|
|
1632
|
+
this._restoringPosition = false;
|
|
1633
|
+
return;
|
|
1634
|
+
}
|
|
1635
|
+
apply();
|
|
1636
|
+
this._restoringPosition = false;
|
|
1637
|
+
};
|
|
1638
|
+
elementRef.addEventListener("loadedmetadata", onLoaded, { once: true });
|
|
1639
|
+
this._pendingLoadedMeta = { element: elementRef, onLoaded };
|
|
1640
|
+
} else {
|
|
1641
|
+
this._restoringPosition = true;
|
|
1642
|
+
apply();
|
|
1643
|
+
this._restoringPosition = false;
|
|
1644
|
+
}
|
|
1645
|
+
};
|
|
1646
|
+
this.elementIsReady = () => {
|
|
1647
|
+
if (this._elementIsReadyPromise) return this._elementIsReadyPromise;
|
|
1648
|
+
this._elementIsReadyPromise = new Promise((resolve) => {
|
|
1649
|
+
if (!this.elementRef) return resolve(false);
|
|
1650
|
+
const element = this.elementRef;
|
|
1651
|
+
const handleLoaded = () => {
|
|
1652
|
+
element.removeEventListener("loadedmetadata", handleLoaded);
|
|
1653
|
+
resolve(element.readyState > 0);
|
|
1654
|
+
};
|
|
1655
|
+
element.addEventListener("loadedmetadata", handleLoaded);
|
|
1656
|
+
});
|
|
1657
|
+
return this._elementIsReadyPromise;
|
|
1658
|
+
};
|
|
1659
|
+
this.setRef = (elementRef) => {
|
|
1660
|
+
if (elementIsPlaying(this.elementRef)) {
|
|
1661
|
+
this.releaseElement({ resetState: false });
|
|
1662
|
+
}
|
|
1663
|
+
this.clearPendingLoadedMeta();
|
|
1664
|
+
this.clearMetadataProbe();
|
|
1665
|
+
this._restoringPosition = false;
|
|
1666
|
+
this._elementIsReadyPromise = void 0;
|
|
1667
|
+
this.state.partialNext({ elementRef });
|
|
1668
|
+
if (elementRef) {
|
|
1669
|
+
this.registerSubscriptions();
|
|
1670
|
+
}
|
|
1671
|
+
};
|
|
1672
|
+
this.setSecondsElapsed = (secondsElapsed) => {
|
|
1673
|
+
const duration = this.elementRef?.duration ?? this.durationSeconds;
|
|
1674
|
+
this.state.partialNext({
|
|
1675
|
+
progressPercent: duration && secondsElapsed ? secondsElapsed / duration * 100 : 0,
|
|
1676
|
+
secondsElapsed
|
|
1677
|
+
});
|
|
1678
|
+
};
|
|
1679
|
+
this.canPlayMimeType = (mimeType2) => {
|
|
1680
|
+
if (!mimeType2) return false;
|
|
1681
|
+
if (this.elementRef) return !!this.elementRef.canPlayType(mimeType2);
|
|
1682
|
+
return !!new Audio().canPlayType(mimeType2);
|
|
1683
|
+
};
|
|
1684
|
+
this.play = async (params) => {
|
|
1685
|
+
if (this._disposed) return;
|
|
1686
|
+
const elementRef = this.ensureElementRef();
|
|
1687
|
+
if (elementIsPlaying(this.elementRef)) {
|
|
1688
|
+
if (this.isPlaying) return;
|
|
1689
|
+
this.state.partialNext({ isPlaying: true });
|
|
1690
|
+
return;
|
|
1691
|
+
}
|
|
1692
|
+
const { currentPlaybackRate, playbackRates: playbackRates2 } = {
|
|
1693
|
+
currentPlaybackRate: this.currentPlaybackRate,
|
|
1694
|
+
playbackRates: this.playbackRates,
|
|
1695
|
+
...params
|
|
1696
|
+
};
|
|
1697
|
+
if (!this.canPlayRecord) {
|
|
1698
|
+
this.registerError({ errCode: "not-playable" });
|
|
1699
|
+
return;
|
|
1908
1700
|
}
|
|
1909
|
-
|
|
1910
|
-
|
|
1911
|
-
|
|
1912
|
-
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
|
|
1922
|
-
|
|
1923
|
-
|
|
1924
|
-
|
|
1701
|
+
this.restoreSavedPosition(elementRef);
|
|
1702
|
+
elementRef.playbackRate = currentPlaybackRate ?? this.currentPlaybackRate;
|
|
1703
|
+
this.setPlaybackStartSafetyTimeout();
|
|
1704
|
+
try {
|
|
1705
|
+
await elementRef.play();
|
|
1706
|
+
this.state.partialNext({
|
|
1707
|
+
currentPlaybackRate,
|
|
1708
|
+
isPlaying: true,
|
|
1709
|
+
playbackRates: playbackRates2
|
|
1710
|
+
});
|
|
1711
|
+
this._pool.setActiveAudioPlayer(this);
|
|
1712
|
+
} catch (e) {
|
|
1713
|
+
this.registerError({ error: e });
|
|
1714
|
+
this.state.partialNext({ isPlaying: false });
|
|
1715
|
+
} finally {
|
|
1716
|
+
this.clearPlaybackStartSafetyTimeout();
|
|
1925
1717
|
}
|
|
1926
|
-
|
|
1927
|
-
|
|
1928
|
-
|
|
1929
|
-
);
|
|
1930
|
-
|
|
1931
|
-
|
|
1932
|
-
|
|
1933
|
-
|
|
1934
|
-
|
|
1935
|
-
{
|
|
1936
|
-
|
|
1937
|
-
|
|
1938
|
-
|
|
1939
|
-
|
|
1940
|
-
|
|
1941
|
-
|
|
1718
|
+
};
|
|
1719
|
+
this.pause = () => {
|
|
1720
|
+
if (!elementIsPlaying(this.elementRef)) return;
|
|
1721
|
+
this.clearPlaybackStartSafetyTimeout();
|
|
1722
|
+
this.elementRef.pause();
|
|
1723
|
+
this.state.partialNext({ isPlaying: false });
|
|
1724
|
+
};
|
|
1725
|
+
this.stop = () => {
|
|
1726
|
+
this.pause();
|
|
1727
|
+
this.state.partialNext({ isPlaying: false });
|
|
1728
|
+
this.setSecondsElapsed(0);
|
|
1729
|
+
if (this.elementRef) this.elementRef.currentTime = 0;
|
|
1730
|
+
};
|
|
1731
|
+
this.togglePlay = async () => this.isPlaying ? this.pause() : await this.play();
|
|
1732
|
+
this.increasePlaybackRate = () => {
|
|
1733
|
+
let currentPlaybackRateIndex = this.state.getLatestValue().playbackRates.findIndex((rate) => rate === this.currentPlaybackRate);
|
|
1734
|
+
if (currentPlaybackRateIndex === -1) {
|
|
1735
|
+
currentPlaybackRateIndex = 0;
|
|
1942
1736
|
}
|
|
1943
|
-
|
|
1944
|
-
|
|
1945
|
-
|
|
1946
|
-
)
|
|
1947
|
-
|
|
1948
|
-
|
|
1949
|
-
|
|
1950
|
-
|
|
1951
|
-
|
|
1952
|
-
|
|
1953
|
-
|
|
1954
|
-
|
|
1955
|
-
|
|
1956
|
-
|
|
1957
|
-
|
|
1958
|
-
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
|
-
|
|
1962
|
-
|
|
1963
|
-
|
|
1964
|
-
);
|
|
1965
|
-
const
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
{
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
|
|
1976
|
-
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
1992
|
-
);
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
1997
|
-
|
|
1998
|
-
|
|
1999
|
-
|
|
2000
|
-
|
|
2001
|
-
|
|
2002
|
-
|
|
2003
|
-
|
|
2004
|
-
|
|
2005
|
-
|
|
2006
|
-
)
|
|
2007
|
-
|
|
2008
|
-
|
|
2009
|
-
|
|
2010
|
-
|
|
2011
|
-
|
|
2012
|
-
|
|
2013
|
-
|
|
2014
|
-
|
|
2015
|
-
|
|
2016
|
-
|
|
2017
|
-
|
|
1737
|
+
const nextIndex = currentPlaybackRateIndex === this.playbackRates.length - 1 ? 0 : currentPlaybackRateIndex + 1;
|
|
1738
|
+
const currentPlaybackRate = this.playbackRates[nextIndex];
|
|
1739
|
+
this.state.partialNext({ currentPlaybackRate });
|
|
1740
|
+
if (this.elementRef) {
|
|
1741
|
+
this.elementRef.playbackRate = currentPlaybackRate;
|
|
1742
|
+
}
|
|
1743
|
+
};
|
|
1744
|
+
this.seek = throttle(async ({ clientX, currentTarget }) => {
|
|
1745
|
+
let element = this.elementRef;
|
|
1746
|
+
if (!this.elementRef) {
|
|
1747
|
+
element = this.ensureElementRef();
|
|
1748
|
+
const isReady = await this.elementIsReady();
|
|
1749
|
+
if (!isReady) return;
|
|
1750
|
+
}
|
|
1751
|
+
if (!currentTarget || !element) return;
|
|
1752
|
+
if (!isSeekable(element)) {
|
|
1753
|
+
this.registerError({ errCode: "seek-not-supported" });
|
|
1754
|
+
return;
|
|
1755
|
+
}
|
|
1756
|
+
const { width, x } = currentTarget.getBoundingClientRect();
|
|
1757
|
+
const ratio = (clientX - x) / width;
|
|
1758
|
+
if (ratio > 1 || ratio < 0) return;
|
|
1759
|
+
const currentTime = ratio * element.duration;
|
|
1760
|
+
this.setSecondsElapsed(currentTime);
|
|
1761
|
+
element.currentTime = currentTime;
|
|
1762
|
+
}, 16);
|
|
1763
|
+
this.registerError = (params) => {
|
|
1764
|
+
defaultRegisterAudioPlayerError(params);
|
|
1765
|
+
this.plugins.forEach(({ onError }) => onError?.({ player: this, ...params }));
|
|
1766
|
+
};
|
|
1767
|
+
this.requestRemoval = () => {
|
|
1768
|
+
this._disposed = true;
|
|
1769
|
+
this.cancelScheduledRemoval();
|
|
1770
|
+
this.clearPendingLoadedMeta();
|
|
1771
|
+
this.clearMetadataProbe();
|
|
1772
|
+
this._restoringPosition = false;
|
|
1773
|
+
this.releaseElement({ resetState: true });
|
|
1774
|
+
this.unsubscribeEventListeners?.();
|
|
1775
|
+
this.unsubscribeEventListeners = null;
|
|
1776
|
+
this.plugins.forEach(({ onRemove }) => onRemove?.({ player: this }));
|
|
1777
|
+
this._pool.deregister(this.id);
|
|
1778
|
+
};
|
|
1779
|
+
this.cancelScheduledRemoval = () => {
|
|
1780
|
+
clearTimeout(this._removalTimeout);
|
|
1781
|
+
this._removalTimeout = void 0;
|
|
1782
|
+
};
|
|
1783
|
+
this.scheduleRemoval = (ms = 0) => {
|
|
1784
|
+
this.cancelScheduledRemoval();
|
|
1785
|
+
this._removalTimeout = setTimeout(() => {
|
|
1786
|
+
if (this.disposed) return;
|
|
1787
|
+
this.requestRemoval();
|
|
1788
|
+
}, ms);
|
|
1789
|
+
};
|
|
1790
|
+
this.releaseElementForHandoff = () => {
|
|
1791
|
+
if (!this.elementRef) return;
|
|
1792
|
+
this.releaseElement({ resetState: false });
|
|
1793
|
+
this.unsubscribeEventListeners?.();
|
|
1794
|
+
this.unsubscribeEventListeners = null;
|
|
1795
|
+
};
|
|
1796
|
+
this.registerSubscriptions = () => {
|
|
1797
|
+
this.unsubscribeEventListeners?.();
|
|
1798
|
+
const audioElement = this.elementRef;
|
|
1799
|
+
if (!audioElement) return;
|
|
1800
|
+
const handleEnded = () => {
|
|
1801
|
+
if (audioElement) {
|
|
1802
|
+
this.updateDurationFromElement(audioElement);
|
|
1803
|
+
}
|
|
1804
|
+
this.stop();
|
|
1805
|
+
};
|
|
1806
|
+
const handleError = (e) => {
|
|
1807
|
+
const audio = e.currentTarget;
|
|
1808
|
+
const state = { isPlaying: false };
|
|
1809
|
+
if (!audio?.error?.code) {
|
|
1810
|
+
this.state.partialNext(state);
|
|
1811
|
+
return;
|
|
1812
|
+
}
|
|
1813
|
+
if (audio.error.code === 4) {
|
|
1814
|
+
state.canPlayRecord = false;
|
|
1815
|
+
this.state.partialNext(state);
|
|
1816
|
+
}
|
|
1817
|
+
const errorMsg = [
|
|
1818
|
+
void 0,
|
|
1819
|
+
"MEDIA_ERR_ABORTED: fetch aborted by user",
|
|
1820
|
+
"MEDIA_ERR_NETWORK: network failed while fetching",
|
|
1821
|
+
"MEDIA_ERR_DECODE: audio fetched but couldn’t decode",
|
|
1822
|
+
"MEDIA_ERR_SRC_NOT_SUPPORTED: source not supported"
|
|
1823
|
+
][audio?.error?.code];
|
|
1824
|
+
if (!errorMsg) return;
|
|
1825
|
+
defaultRegisterAudioPlayerError({ error: new Error(errorMsg + ` (${audio.src})`) });
|
|
1826
|
+
};
|
|
1827
|
+
const handleTimeupdate = () => {
|
|
1828
|
+
const t = audioElement?.currentTime ?? 0;
|
|
1829
|
+
if (this._restoringPosition && t === 0) return;
|
|
1830
|
+
if (!this.isPlaying && t === 0 && this.secondsElapsed > 0) return;
|
|
1831
|
+
this.setSecondsElapsed(t);
|
|
1832
|
+
};
|
|
1833
|
+
const handleLoadedMetadata = () => {
|
|
1834
|
+
if (audioElement) {
|
|
1835
|
+
this.updateDurationFromElement(audioElement);
|
|
1836
|
+
}
|
|
1837
|
+
};
|
|
1838
|
+
audioElement.addEventListener("ended", handleEnded);
|
|
1839
|
+
audioElement.addEventListener("error", handleError);
|
|
1840
|
+
audioElement.addEventListener("loadedmetadata", handleLoadedMetadata);
|
|
1841
|
+
audioElement.addEventListener("timeupdate", handleTimeupdate);
|
|
1842
|
+
this.unsubscribeEventListeners = () => {
|
|
1843
|
+
audioElement.pause();
|
|
1844
|
+
audioElement.removeEventListener("ended", handleEnded);
|
|
1845
|
+
audioElement.removeEventListener("error", handleError);
|
|
1846
|
+
audioElement.removeEventListener("loadedmetadata", handleLoadedMetadata);
|
|
1847
|
+
audioElement.removeEventListener("timeupdate", handleTimeupdate);
|
|
1848
|
+
};
|
|
1849
|
+
};
|
|
1850
|
+
this._data = {
|
|
1851
|
+
durationSeconds,
|
|
1852
|
+
fileSize,
|
|
1853
|
+
id,
|
|
1854
|
+
mimeType,
|
|
1855
|
+
src,
|
|
1856
|
+
title,
|
|
1857
|
+
waveformData
|
|
1858
|
+
};
|
|
1859
|
+
this._pool = pool;
|
|
1860
|
+
this.setPlugins(() => plugins ?? []);
|
|
1861
|
+
const playbackRates = customPlaybackRates?.length ? customPlaybackRates : DEFAULT_PLAYBACK_RATES;
|
|
1862
|
+
const canPlayRecord = mimeType ? !!new Audio().canPlayType(mimeType) : true;
|
|
1863
|
+
this.state = new StateStore({
|
|
1864
|
+
canPlayRecord,
|
|
1865
|
+
currentPlaybackRate: playbackRates[0],
|
|
1866
|
+
durationSeconds,
|
|
1867
|
+
elementRef: null,
|
|
1868
|
+
isPlaying: false,
|
|
1869
|
+
playbackError: null,
|
|
1870
|
+
playbackRates,
|
|
1871
|
+
progressPercent: 0,
|
|
1872
|
+
secondsElapsed: 0
|
|
1873
|
+
});
|
|
1874
|
+
this.plugins.forEach((p) => p.onInit?.({ player: this }));
|
|
1875
|
+
this.preloadMetadata();
|
|
1876
|
+
}
|
|
1877
|
+
get plugins() {
|
|
1878
|
+
return Array.from(this._plugins.values());
|
|
1879
|
+
}
|
|
1880
|
+
get canPlayRecord() {
|
|
1881
|
+
return this.state.getLatestValue().canPlayRecord;
|
|
1882
|
+
}
|
|
1883
|
+
get elementRef() {
|
|
1884
|
+
return this.state.getLatestValue().elementRef;
|
|
1885
|
+
}
|
|
1886
|
+
get isPlaying() {
|
|
1887
|
+
return this.state.getLatestValue().isPlaying;
|
|
1888
|
+
}
|
|
1889
|
+
get currentPlaybackRate() {
|
|
1890
|
+
return this.state.getLatestValue().currentPlaybackRate;
|
|
1891
|
+
}
|
|
1892
|
+
get playbackRates() {
|
|
1893
|
+
return this.state.getLatestValue().playbackRates;
|
|
1894
|
+
}
|
|
1895
|
+
get durationSeconds() {
|
|
1896
|
+
return this.state.getLatestValue().durationSeconds;
|
|
1897
|
+
}
|
|
1898
|
+
get fileSize() {
|
|
1899
|
+
return this._data.fileSize;
|
|
1900
|
+
}
|
|
1901
|
+
get id() {
|
|
1902
|
+
return this._data.id;
|
|
1903
|
+
}
|
|
1904
|
+
get src() {
|
|
1905
|
+
return this._data.src;
|
|
1906
|
+
}
|
|
1907
|
+
get mimeType() {
|
|
1908
|
+
return this._data.mimeType;
|
|
1909
|
+
}
|
|
1910
|
+
get title() {
|
|
1911
|
+
return this._data.title;
|
|
1912
|
+
}
|
|
1913
|
+
get waveformData() {
|
|
1914
|
+
return this._data.waveformData;
|
|
1915
|
+
}
|
|
1916
|
+
get secondsElapsed() {
|
|
1917
|
+
return this.state.getLatestValue().secondsElapsed;
|
|
1918
|
+
}
|
|
1919
|
+
get progressPercent() {
|
|
1920
|
+
return this.state.getLatestValue().progressPercent;
|
|
1921
|
+
}
|
|
1922
|
+
get disposed() {
|
|
1923
|
+
return this._disposed;
|
|
1924
|
+
}
|
|
1925
|
+
ensureElementRef() {
|
|
1926
|
+
if (this._disposed) {
|
|
1927
|
+
throw new Error("AudioPlayer is disposed");
|
|
2018
1928
|
}
|
|
2019
|
-
|
|
2020
|
-
|
|
2021
|
-
|
|
2022
|
-
|
|
2023
|
-
|
|
2024
|
-
);
|
|
2025
|
-
const IconTranslate = createIcon(
|
|
2026
|
-
"IconTranslate",
|
|
2027
|
-
/* @__PURE__ */ jsx(
|
|
2028
|
-
"path",
|
|
2029
|
-
{
|
|
2030
|
-
d: "M18.75 16.875L14.375 8.125L10 16.875M11.25 14.375H17.5M7.5 2.5V4.375M2.5 4.375H12.5M10 4.375C10 6.36412 9.20982 8.27178 7.8033 9.6783C6.39678 11.0848 4.48912 11.875 2.5 11.875M5.42734 6.875C5.94442 8.33751 6.90226 9.60371 8.16893 10.4992C9.4356 11.3947 10.9488 11.8753 12.5 11.875",
|
|
2031
|
-
fill: "none",
|
|
2032
|
-
stroke: "currentColor",
|
|
2033
|
-
strokeLinecap: "round",
|
|
2034
|
-
strokeLinejoin: "round",
|
|
2035
|
-
strokeWidth: "1.5"
|
|
1929
|
+
if (!this.elementRef) {
|
|
1930
|
+
const el = this._pool.acquireElement({
|
|
1931
|
+
ownerId: this.id,
|
|
1932
|
+
src: this.src
|
|
1933
|
+
});
|
|
1934
|
+
this.setRef(el);
|
|
2036
1935
|
}
|
|
2037
|
-
|
|
2038
|
-
|
|
2039
|
-
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
-
|
|
2044
|
-
d: "M16.875 4.375H3.125M8.125 8.125V13.125M11.875 8.125V13.125M15.625 4.375V16.25C15.625 16.4158 15.5592 16.5747 15.4419 16.6919C15.3247 16.8092 15.1658 16.875 15 16.875H5C4.83424 16.875 4.67527 16.8092 4.55806 16.6919C4.44085 16.5747 4.375 16.4158 4.375 16.25V4.375M13.125 4.375V3.125C13.125 2.79348 12.9933 2.47554 12.7589 2.24112C12.5245 2.0067 12.2065 1.875 11.875 1.875H8.125C7.79348 1.875 7.47554 2.0067 7.24112 2.24112C7.0067 2.47554 6.875 2.79348 6.875 3.125V4.375",
|
|
2045
|
-
fill: "none",
|
|
2046
|
-
stroke: "currentColor",
|
|
2047
|
-
strokeLinecap: "round",
|
|
2048
|
-
strokeLinejoin: "round",
|
|
2049
|
-
strokeWidth: "1.5"
|
|
1936
|
+
return this.elementRef;
|
|
1937
|
+
}
|
|
1938
|
+
setDescriptor(descriptor) {
|
|
1939
|
+
const previousSrc = this.src;
|
|
1940
|
+
this._data = { ...this._data, ...descriptor };
|
|
1941
|
+
if (descriptor.src !== previousSrc && this.elementRef) {
|
|
1942
|
+
this.elementRef.src = descriptor.src;
|
|
2050
1943
|
}
|
|
2051
|
-
|
|
2052
|
-
);
|
|
2053
|
-
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
stroke: "currentColor",
|
|
2061
|
-
strokeLinecap: "round",
|
|
2062
|
-
strokeLinejoin: "round",
|
|
2063
|
-
strokeWidth: "1.5"
|
|
1944
|
+
if (descriptor.src && descriptor.src !== previousSrc) {
|
|
1945
|
+
this.clearMetadataProbe();
|
|
1946
|
+
if (descriptor.durationSeconds == null) {
|
|
1947
|
+
this.setDurationSeconds(void 0);
|
|
1948
|
+
this.preloadMetadata();
|
|
1949
|
+
} else {
|
|
1950
|
+
this.setDurationSeconds(descriptor.durationSeconds);
|
|
1951
|
+
}
|
|
1952
|
+
return;
|
|
2064
1953
|
}
|
|
2065
|
-
|
|
2066
|
-
);
|
|
2067
|
-
const IconUnpin = createIcon(
|
|
2068
|
-
"IconUnpin",
|
|
2069
|
-
/* @__PURE__ */ jsx(
|
|
2070
|
-
"path",
|
|
2071
|
-
{
|
|
2072
|
-
d: "M7.52271 12.4773L3.75006 16.25M3.75006 3.12498L16.2501 16.875M14.4532 11.1828L17.9415 7.68279C18.0586 7.56559 18.1244 7.40668 18.1244 7.24099C18.1244 7.0753 18.0586 6.9164 17.9415 6.7992L13.2032 2.05779C13.086 1.94067 12.9271 1.87488 12.7614 1.87488C12.5957 1.87488 12.4368 1.94067 12.3196 2.05779L9.09615 5.28904M6.58756 6.24998C5.74537 6.18435 4.57271 6.3531 3.35943 7.33201C3.29077 7.38697 3.23447 7.45581 3.19424 7.53402C3.154 7.61224 3.13072 7.69806 3.12593 7.78589C3.12114 7.87371 3.13493 7.96156 3.16642 8.04369C3.19791 8.12581 3.24637 8.20037 3.30865 8.26248L11.7383 16.6914C11.8015 16.7541 11.8773 16.8025 11.9606 16.8336C12.044 16.8646 12.133 16.8775 12.2218 16.8713C12.3105 16.8652 12.3969 16.8402 12.4752 16.798C12.5535 16.7558 12.6219 16.6973 12.6758 16.6265C13.0829 16.0851 13.6344 15.1898 13.779 14.1594",
|
|
2073
|
-
fill: "none",
|
|
2074
|
-
stroke: "currentColor",
|
|
2075
|
-
strokeLinecap: "round",
|
|
2076
|
-
strokeLinejoin: "round",
|
|
2077
|
-
strokeWidth: "1.5"
|
|
1954
|
+
if (descriptor.durationSeconds != null) {
|
|
1955
|
+
this.setDurationSeconds(descriptor.durationSeconds);
|
|
2078
1956
|
}
|
|
2079
|
-
|
|
2080
|
-
)
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
2087
|
-
|
|
2088
|
-
|
|
2089
|
-
|
|
2090
|
-
|
|
2091
|
-
|
|
2092
|
-
|
|
1957
|
+
}
|
|
1958
|
+
releaseElement({ resetState }) {
|
|
1959
|
+
this.clearPendingLoadedMeta();
|
|
1960
|
+
this.clearMetadataProbe();
|
|
1961
|
+
this._restoringPosition = false;
|
|
1962
|
+
if (resetState) {
|
|
1963
|
+
this.stop();
|
|
1964
|
+
} else {
|
|
1965
|
+
this.state.partialNext({ isPlaying: false });
|
|
1966
|
+
if (this.elementRef) {
|
|
1967
|
+
try {
|
|
1968
|
+
this.elementRef.pause();
|
|
1969
|
+
} catch {
|
|
1970
|
+
}
|
|
2093
1971
|
}
|
|
2094
|
-
) }),
|
|
2095
|
-
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14111_491476", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
2096
|
-
] }),
|
|
2097
|
-
{ "data-rtl-mirror": "" }
|
|
2098
|
-
);
|
|
2099
|
-
const IconVideoFill = createIcon(
|
|
2100
|
-
"IconVideoFill",
|
|
2101
|
-
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
2102
|
-
/* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_14064_467281)", children: /* @__PURE__ */ jsx("path", { d: "M15 5.625V14.375C15 14.7065 14.8683 15.0245 14.6339 15.2589C14.3995 15.4933 14.0815 15.625 13.75 15.625H2.5C2.16848 15.625 1.85054 15.4933 1.61612 15.2589C1.3817 15.0245 1.25 14.7065 1.25 14.375V5.625C1.25 5.29348 1.3817 4.97554 1.61612 4.74112C1.85054 4.5067 2.16848 4.375 2.5 4.375H13.75C14.0815 4.375 14.3995 4.5067 14.6339 4.74112C14.8683 4.97554 15 5.29348 15 5.625ZM19.5312 5.64453C19.4431 5.62295 19.3513 5.62029 19.2621 5.63672C19.1728 5.65315 19.088 5.68829 19.0133 5.73984L16.3891 7.48906C16.3463 7.51762 16.3112 7.55631 16.2869 7.6017C16.2626 7.64708 16.25 7.69776 16.25 7.74922V12.2508C16.25 12.3022 16.2626 12.3529 16.2869 12.3983C16.3112 12.4437 16.3463 12.4824 16.3891 12.5109L19.0281 14.2703C19.1269 14.3362 19.2424 14.3726 19.3611 14.3752C19.4798 14.3779 19.5968 14.3466 19.6984 14.2852C19.7924 14.2254 19.8695 14.1425 19.9223 14.0444C19.9751 13.9464 20.0019 13.8364 20 13.725V6.25C20.0001 6.11139 19.9541 5.97668 19.8692 5.86708C19.7843 5.75747 19.6655 5.67918 19.5312 5.64453Z" }) }),
|
|
2103
|
-
/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_14064_467281", children: /* @__PURE__ */ jsx("rect", { fill: "white", height: "20", width: "20" }) }) })
|
|
2104
|
-
] }),
|
|
2105
|
-
{ "data-rtl-mirror": "" }
|
|
2106
|
-
);
|
|
2107
|
-
const IconAudio = createIcon(
|
|
2108
|
-
"IconAudio",
|
|
2109
|
-
/* @__PURE__ */ jsx(
|
|
2110
|
-
"path",
|
|
2111
|
-
{
|
|
2112
|
-
d: "M15.625 8.125V11.875M18.125 6.875V13.125M6.875 13.125H3.125C2.95924 13.125 2.80027 13.0592 2.68306 12.9419C2.56585 12.8247 2.5 12.6658 2.5 12.5V7.5C2.5 7.33424 2.56585 7.17527 2.68306 7.05806C2.80027 6.94085 2.95924 6.875 3.125 6.875H6.875L12.5 2.5V17.5L6.875 13.125Z",
|
|
2113
|
-
fill: "none",
|
|
2114
|
-
stroke: "currentColor",
|
|
2115
|
-
strokeLinecap: "round",
|
|
2116
|
-
strokeLinejoin: "round",
|
|
2117
|
-
strokeWidth: "1.5"
|
|
2118
1972
|
}
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
);
|
|
2122
|
-
const IconArchive = createIcon(
|
|
2123
|
-
"IconArchive",
|
|
2124
|
-
/* @__PURE__ */ jsx(
|
|
2125
|
-
"path",
|
|
2126
|
-
{
|
|
2127
|
-
d: "M16.875 7.5V15C16.875 15.1658 16.8092 15.3247 16.6919 15.4419C16.5747 15.5592 16.4158 15.625 16.25 15.625H3.75C3.58424 15.625 3.42527 15.5592 3.30806 15.4419C3.19085 15.3247 3.125 15.1658 3.125 15V7.5M8.125 10.625H11.875M2.5 4.375H17.5C17.8452 4.375 18.125 4.65482 18.125 5V6.875C18.125 7.22018 17.8452 7.5 17.5 7.5H2.5C2.15482 7.5 1.875 7.22018 1.875 6.875V5C1.875 4.65482 2.15482 4.375 2.5 4.375Z",
|
|
2128
|
-
fill: "none",
|
|
2129
|
-
stroke: "currentColor",
|
|
2130
|
-
strokeLinecap: "round",
|
|
2131
|
-
strokeLinejoin: "round",
|
|
2132
|
-
strokeWidth: "1.5"
|
|
1973
|
+
if (this.elementRef) {
|
|
1974
|
+
this._pool.releaseElement(this.id);
|
|
1975
|
+
this.setRef(null);
|
|
2133
1976
|
}
|
|
2134
|
-
|
|
2135
|
-
)
|
|
2136
|
-
|
|
2137
|
-
|
|
2138
|
-
|
|
2139
|
-
|
|
2140
|
-
|
|
2141
|
-
|
|
2142
|
-
|
|
2143
|
-
|
|
2144
|
-
|
|
2145
|
-
|
|
2146
|
-
|
|
1977
|
+
}
|
|
1978
|
+
setPlugins(setter) {
|
|
1979
|
+
this._plugins = setter(this.plugins).reduce((acc, plugin) => {
|
|
1980
|
+
if (plugin.id) {
|
|
1981
|
+
acc.set(plugin.id, plugin);
|
|
1982
|
+
}
|
|
1983
|
+
return acc;
|
|
1984
|
+
}, /* @__PURE__ */ new Map());
|
|
1985
|
+
}
|
|
1986
|
+
}
|
|
1987
|
+
class AudioPlayerPool {
|
|
1988
|
+
constructor(config) {
|
|
1989
|
+
this.state = new StateStore({
|
|
1990
|
+
activeAudioPlayer: null
|
|
1991
|
+
});
|
|
1992
|
+
this.pool = /* @__PURE__ */ new Map();
|
|
1993
|
+
this.audios = /* @__PURE__ */ new Map();
|
|
1994
|
+
this.sharedAudio = null;
|
|
1995
|
+
this.sharedOwnerId = null;
|
|
1996
|
+
this.getOrAdd = (params) => {
|
|
1997
|
+
const { playbackRates, plugins, ...descriptor } = params;
|
|
1998
|
+
let player = this.pool.get(params.id);
|
|
1999
|
+
if (player) {
|
|
2000
|
+
if (!player.disposed) {
|
|
2001
|
+
player.setDescriptor(descriptor);
|
|
2002
|
+
return player;
|
|
2003
|
+
}
|
|
2004
|
+
this.deregister(params.id);
|
|
2147
2005
|
}
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2006
|
+
player = new AudioPlayer({
|
|
2007
|
+
playbackRates,
|
|
2008
|
+
plugins,
|
|
2009
|
+
...descriptor,
|
|
2010
|
+
pool: this
|
|
2011
|
+
});
|
|
2012
|
+
this.pool.set(params.id, player);
|
|
2013
|
+
return player;
|
|
2014
|
+
};
|
|
2015
|
+
this.acquireElement = ({ ownerId, src }) => {
|
|
2016
|
+
if (!this.allowConcurrentPlayback) {
|
|
2017
|
+
if (!this.sharedAudio) {
|
|
2018
|
+
this.sharedAudio = new Audio();
|
|
2019
|
+
}
|
|
2020
|
+
if (this.sharedOwnerId && this.sharedOwnerId !== ownerId) {
|
|
2021
|
+
const previous = this.pool.get(this.sharedOwnerId);
|
|
2022
|
+
previous?.pause();
|
|
2023
|
+
previous?.releaseElementForHandoff();
|
|
2024
|
+
}
|
|
2025
|
+
this.sharedOwnerId = ownerId;
|
|
2026
|
+
if (this.sharedAudio.src !== src) {
|
|
2027
|
+
this.sharedAudio.src = src;
|
|
2028
|
+
}
|
|
2029
|
+
return this.sharedAudio;
|
|
2157
2030
|
}
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
);
|
|
2161
|
-
|
|
2162
|
-
"IconGiphy",
|
|
2163
|
-
/* @__PURE__ */ jsxs(Fragment, { children: [
|
|
2164
|
-
/* @__PURE__ */ jsx("rect", { fill: "black", height: "20", rx: "10", width: "20" }),
|
|
2165
|
-
/* @__PURE__ */ jsx(
|
|
2166
|
-
"path",
|
|
2167
|
-
{
|
|
2168
|
-
clipRule: "evenodd",
|
|
2169
|
-
d: "M6.5997 5.50024H13.4008V14.4999H6.59912L6.5997 5.50024Z",
|
|
2170
|
-
fill: "black",
|
|
2171
|
-
fillRule: "evenodd"
|
|
2031
|
+
let audio = this.audios.get(ownerId);
|
|
2032
|
+
if (!audio) {
|
|
2033
|
+
audio = new Audio();
|
|
2034
|
+
this.audios.set(ownerId, audio);
|
|
2172
2035
|
}
|
|
2173
|
-
|
|
2174
|
-
|
|
2175
|
-
|
|
2176
|
-
|
|
2177
|
-
|
|
2178
|
-
|
|
2179
|
-
|
|
2180
|
-
|
|
2181
|
-
|
|
2182
|
-
|
|
2036
|
+
if (audio.src !== src) {
|
|
2037
|
+
audio.src = src;
|
|
2038
|
+
}
|
|
2039
|
+
return audio;
|
|
2040
|
+
};
|
|
2041
|
+
this.releaseElement = (ownerId) => {
|
|
2042
|
+
if (!this.allowConcurrentPlayback) {
|
|
2043
|
+
if (this.sharedOwnerId !== ownerId) return;
|
|
2044
|
+
const el2 = this.sharedAudio;
|
|
2045
|
+
if (el2) {
|
|
2046
|
+
try {
|
|
2047
|
+
el2.pause();
|
|
2048
|
+
} catch {
|
|
2049
|
+
}
|
|
2050
|
+
el2.removeAttribute("src");
|
|
2051
|
+
el2.load();
|
|
2052
|
+
}
|
|
2053
|
+
this.sharedOwnerId = null;
|
|
2054
|
+
return;
|
|
2055
|
+
}
|
|
2056
|
+
const el = this.audios.get(ownerId);
|
|
2057
|
+
if (!el) return;
|
|
2058
|
+
try {
|
|
2059
|
+
el.pause();
|
|
2060
|
+
} catch {
|
|
2183
2061
|
}
|
|
2062
|
+
el.removeAttribute("src");
|
|
2063
|
+
el.load();
|
|
2064
|
+
this.audios.delete(ownerId);
|
|
2065
|
+
};
|
|
2066
|
+
this.setActiveAudioPlayer = (activeAudioPlayer) => {
|
|
2067
|
+
if (this.allowConcurrentPlayback) return;
|
|
2068
|
+
this.state.partialNext({ activeAudioPlayer });
|
|
2069
|
+
};
|
|
2070
|
+
this.remove = (id) => {
|
|
2071
|
+
const player = this.pool.get(id);
|
|
2072
|
+
if (!player) return;
|
|
2073
|
+
player.requestRemoval();
|
|
2074
|
+
};
|
|
2075
|
+
this.clear = () => {
|
|
2076
|
+
this.players.forEach((player) => {
|
|
2077
|
+
this.remove(player.id);
|
|
2078
|
+
});
|
|
2079
|
+
};
|
|
2080
|
+
this.registerSubscriptions = () => {
|
|
2081
|
+
this.players.forEach((p) => {
|
|
2082
|
+
if (p.elementRef) {
|
|
2083
|
+
p.registerSubscriptions();
|
|
2084
|
+
}
|
|
2085
|
+
});
|
|
2086
|
+
};
|
|
2087
|
+
this.allowConcurrentPlayback = !!config?.allowConcurrentPlayback;
|
|
2088
|
+
}
|
|
2089
|
+
get players() {
|
|
2090
|
+
return Array.from(this.pool.values());
|
|
2091
|
+
}
|
|
2092
|
+
get activeAudioPlayer() {
|
|
2093
|
+
return this.state.getLatestValue().activeAudioPlayer;
|
|
2094
|
+
}
|
|
2095
|
+
/** Removes the AudioPlayer instance from the pool of players */
|
|
2096
|
+
deregister(id) {
|
|
2097
|
+
if (this.pool.has(id)) {
|
|
2098
|
+
this.pool.delete(id);
|
|
2099
|
+
}
|
|
2100
|
+
if (this.activeAudioPlayer?.id === id) {
|
|
2101
|
+
this.setActiveAudioPlayer(null);
|
|
2102
|
+
}
|
|
2103
|
+
}
|
|
2104
|
+
}
|
|
2105
|
+
const SEEK_NOT_SUPPORTED_NOTIFICATION_DEBOUNCE_INTERVAL_MS = 1e3;
|
|
2106
|
+
const audioPlayerNotificationsPluginFactory = ({
|
|
2107
|
+
addNotification,
|
|
2108
|
+
panel = "channel",
|
|
2109
|
+
t
|
|
2110
|
+
}) => {
|
|
2111
|
+
const errors = {
|
|
2112
|
+
"failed-to-start": new Error(t("Failed to play the recording")),
|
|
2113
|
+
"not-playable": new Error(
|
|
2114
|
+
t("Recording format is not supported and cannot be reproduced")
|
|
2184
2115
|
),
|
|
2185
|
-
|
|
2186
|
-
|
|
2187
|
-
|
|
2188
|
-
|
|
2189
|
-
|
|
2190
|
-
|
|
2191
|
-
|
|
2192
|
-
|
|
2116
|
+
"seek-not-supported": new Error(t("Cannot seek in the recording"))
|
|
2117
|
+
};
|
|
2118
|
+
let lastSeekNotSupportedNotificationAt;
|
|
2119
|
+
return {
|
|
2120
|
+
id: "AudioPlayerNotificationsPlugin",
|
|
2121
|
+
onError: ({ errCode, error: e }) => {
|
|
2122
|
+
if (errCode === "seek-not-supported") {
|
|
2123
|
+
const now = Date.now();
|
|
2124
|
+
if (typeof lastSeekNotSupportedNotificationAt === "number" && now - lastSeekNotSupportedNotificationAt < SEEK_NOT_SUPPORTED_NOTIFICATION_DEBOUNCE_INTERVAL_MS) {
|
|
2125
|
+
return;
|
|
2126
|
+
}
|
|
2127
|
+
lastSeekNotSupportedNotificationAt = now;
|
|
2193
2128
|
}
|
|
2194
|
-
|
|
2195
|
-
|
|
2196
|
-
|
|
2129
|
+
const error = (errCode && errors[errCode]) ?? e ?? new Error(t("Error reproducing the recording"));
|
|
2130
|
+
addNotification({
|
|
2131
|
+
emitter: "AudioPlayer",
|
|
2132
|
+
error,
|
|
2133
|
+
message: error.message,
|
|
2134
|
+
severity: "error",
|
|
2135
|
+
targetPanels: [panel],
|
|
2136
|
+
type: "browser:audio:playback:error"
|
|
2137
|
+
});
|
|
2138
|
+
}
|
|
2139
|
+
};
|
|
2140
|
+
};
|
|
2141
|
+
const NOTIFICATION_TARGET_PANELS = [
|
|
2142
|
+
"channel",
|
|
2143
|
+
"thread",
|
|
2144
|
+
"channel-list",
|
|
2145
|
+
"thread-list"
|
|
2146
|
+
];
|
|
2147
|
+
const isNotificationTargetPanel = (value) => typeof value === "string" && NOTIFICATION_TARGET_PANELS.includes(value);
|
|
2148
|
+
const getNotificationTargetPanel = (notification) => {
|
|
2149
|
+
const targetTag = notification.tags?.find((tag) => tag.startsWith("target:"));
|
|
2150
|
+
if (targetTag) {
|
|
2151
|
+
const candidate = targetTag.slice("target:".length);
|
|
2152
|
+
if (isNotificationTargetPanel(candidate)) return candidate;
|
|
2153
|
+
}
|
|
2154
|
+
const panel = notification.origin.context?.panel;
|
|
2155
|
+
return isNotificationTargetPanel(panel) ? panel : void 0;
|
|
2156
|
+
};
|
|
2157
|
+
const getNotificationTargetPanels = (notification) => {
|
|
2158
|
+
const targetPanels = (notification.tags ?? []).filter((tag) => tag.startsWith("target:")).map((tag) => tag.slice("target:".length)).filter(
|
|
2159
|
+
(value) => isNotificationTargetPanel(value)
|
|
2160
|
+
);
|
|
2161
|
+
if (targetPanels.length > 0) {
|
|
2162
|
+
return Array.from(new Set(targetPanels));
|
|
2163
|
+
}
|
|
2164
|
+
const panel = notification.origin.context?.panel;
|
|
2165
|
+
return isNotificationTargetPanel(panel) ? [panel] : [];
|
|
2166
|
+
};
|
|
2167
|
+
const getNotificationTargetTag = (panel) => `target:${panel}`;
|
|
2168
|
+
const addNotificationTargetTag = (panel, tags) => {
|
|
2169
|
+
if (!panel) return tags ?? [];
|
|
2170
|
+
return Array.from(/* @__PURE__ */ new Set([getNotificationTargetTag(panel), ...tags ?? []]));
|
|
2171
|
+
};
|
|
2172
|
+
const isNotificationForPanel = (notification, panel, options) => {
|
|
2173
|
+
const explicitTargetPanels = getNotificationTargetPanels(notification);
|
|
2174
|
+
if (explicitTargetPanels.length > 0) {
|
|
2175
|
+
return explicitTargetPanels.includes(panel);
|
|
2176
|
+
}
|
|
2177
|
+
const resolvedPanel = options?.fallbackPanel ?? "channel";
|
|
2178
|
+
return resolvedPanel === panel;
|
|
2179
|
+
};
|
|
2180
|
+
const variantToClass = {
|
|
2181
|
+
danger: "str-chat__button--destructive",
|
|
2182
|
+
primary: "str-chat__button--primary",
|
|
2183
|
+
secondary: "str-chat__button--secondary"
|
|
2184
|
+
};
|
|
2185
|
+
const appearanceToClass = {
|
|
2186
|
+
ghost: "str-chat__button--ghost",
|
|
2187
|
+
outline: "str-chat__button--outline",
|
|
2188
|
+
solid: "str-chat__button--solid"
|
|
2189
|
+
};
|
|
2190
|
+
const sizeToClass = {
|
|
2191
|
+
lg: "str-chat__button--size-lg",
|
|
2192
|
+
md: "str-chat__button--size-md",
|
|
2193
|
+
sm: "str-chat__button--size-sm",
|
|
2194
|
+
xs: "str-chat__button--size-xs"
|
|
2195
|
+
};
|
|
2196
|
+
const Button = forwardRef(function Button2({ appearance, children, circular, className, inverseTheme, size: size2, variant, ...props }, ref) {
|
|
2197
|
+
return /* @__PURE__ */ jsx(
|
|
2198
|
+
"button",
|
|
2199
|
+
{
|
|
2200
|
+
ref,
|
|
2201
|
+
type: "button",
|
|
2202
|
+
...props,
|
|
2203
|
+
className: clsx(
|
|
2204
|
+
"str-chat__button",
|
|
2205
|
+
variant != null && variantToClass[variant],
|
|
2206
|
+
appearance != null && appearanceToClass[appearance],
|
|
2207
|
+
circular && "str-chat__button--circular",
|
|
2208
|
+
inverseTheme && "str-chat__theme-inverse",
|
|
2209
|
+
size2 != null && sizeToClass[size2],
|
|
2210
|
+
className
|
|
2211
|
+
),
|
|
2212
|
+
children: /* @__PURE__ */ jsx("div", { className: "str-chat__button__content", children })
|
|
2213
|
+
}
|
|
2214
|
+
);
|
|
2215
|
+
});
|
|
2197
2216
|
const UnMemoizedEmptyStateIndicator = (props) => {
|
|
2198
2217
|
const { listType, messageText } = props;
|
|
2199
2218
|
const { t } = useTranslationContext("EmptyStateIndicator");
|
|
@@ -2666,6 +2685,7 @@ const OPTIONAL_MESSAGE_ACTIONS = {
|
|
|
2666
2685
|
};
|
|
2667
2686
|
const MESSAGE_ACTIONS = {
|
|
2668
2687
|
delete: "delete",
|
|
2688
|
+
download: "download",
|
|
2669
2689
|
edit: "edit",
|
|
2670
2690
|
flag: "flag",
|
|
2671
2691
|
markUnread: "markUnread",
|
|
@@ -2700,6 +2720,9 @@ const getMessageActions = (actions, {
|
|
|
2700
2720
|
if (canDelete && messageActions.indexOf(MESSAGE_ACTIONS.delete) > -1) {
|
|
2701
2721
|
messageActionsAfterPermission.push(MESSAGE_ACTIONS.delete);
|
|
2702
2722
|
}
|
|
2723
|
+
if (messageActions.indexOf(MESSAGE_ACTIONS.download) > -1) {
|
|
2724
|
+
messageActionsAfterPermission.push(MESSAGE_ACTIONS.download);
|
|
2725
|
+
}
|
|
2703
2726
|
if (canDelete && messageActions.indexOf(OPTIONAL_MESSAGE_ACTIONS.deleteForMe) > -1) {
|
|
2704
2727
|
messageActionsAfterPermission.push(OPTIONAL_MESSAGE_ACTIONS.deleteForMe);
|
|
2705
2728
|
}
|
|
@@ -4534,203 +4557,204 @@ const useActiveAudioPlayer = () => {
|
|
|
4534
4557
|
return activeAudioPlayer;
|
|
4535
4558
|
};
|
|
4536
4559
|
export {
|
|
4537
|
-
|
|
4538
|
-
|
|
4560
|
+
IconLocation as $,
|
|
4561
|
+
IconExclamationMark as A,
|
|
4539
4562
|
Button as B,
|
|
4540
4563
|
ComponentContext as C,
|
|
4541
|
-
|
|
4542
|
-
|
|
4543
|
-
|
|
4544
|
-
|
|
4545
|
-
|
|
4546
|
-
|
|
4547
|
-
|
|
4548
|
-
|
|
4564
|
+
IconNoSign as D,
|
|
4565
|
+
isMessageDeleted as E,
|
|
4566
|
+
isMessageErrorRetryable as F,
|
|
4567
|
+
ACTIONS_NOT_WORKING_IN_THREAD as G,
|
|
4568
|
+
useNotificationApi as H,
|
|
4569
|
+
IconDownload as I,
|
|
4570
|
+
IconArrowUpRight as J,
|
|
4571
|
+
IconPin as K,
|
|
4549
4572
|
LocalizedFormat as L,
|
|
4550
|
-
|
|
4551
|
-
|
|
4552
|
-
|
|
4553
|
-
|
|
4554
|
-
|
|
4555
|
-
|
|
4556
|
-
|
|
4557
|
-
|
|
4558
|
-
|
|
4559
|
-
|
|
4560
|
-
|
|
4561
|
-
|
|
4562
|
-
|
|
4563
|
-
|
|
4564
|
-
|
|
4573
|
+
mapToUserNameOrId as M,
|
|
4574
|
+
IconClock as N,
|
|
4575
|
+
IconCheckmark1Small as O,
|
|
4576
|
+
IconChecks as P,
|
|
4577
|
+
getReadByTooltipText as Q,
|
|
4578
|
+
messageHasAttachments as R,
|
|
4579
|
+
messageTextHasEmojisOnly as S,
|
|
4580
|
+
isDate as T,
|
|
4581
|
+
getDateString as U,
|
|
4582
|
+
IconTranslate as V,
|
|
4583
|
+
useMessageComposerContext as W,
|
|
4584
|
+
useIsCooldownActive as X,
|
|
4585
|
+
IconXmarkSmall as Y,
|
|
4586
|
+
IconImage as Z,
|
|
4587
|
+
IconPoll as _,
|
|
4565
4588
|
useMessageComposerController as a,
|
|
4566
|
-
|
|
4567
|
-
|
|
4568
|
-
|
|
4569
|
-
|
|
4570
|
-
|
|
4571
|
-
|
|
4572
|
-
|
|
4573
|
-
|
|
4574
|
-
|
|
4575
|
-
|
|
4576
|
-
|
|
4577
|
-
|
|
4578
|
-
|
|
4579
|
-
|
|
4580
|
-
|
|
4581
|
-
|
|
4582
|
-
|
|
4583
|
-
|
|
4584
|
-
|
|
4585
|
-
|
|
4586
|
-
|
|
4587
|
-
|
|
4588
|
-
|
|
4589
|
-
|
|
4590
|
-
|
|
4591
|
-
|
|
4592
|
-
|
|
4593
|
-
|
|
4594
|
-
|
|
4595
|
-
|
|
4596
|
-
|
|
4597
|
-
|
|
4598
|
-
|
|
4599
|
-
|
|
4600
|
-
|
|
4601
|
-
|
|
4602
|
-
|
|
4603
|
-
|
|
4604
|
-
|
|
4605
|
-
|
|
4606
|
-
|
|
4607
|
-
|
|
4608
|
-
|
|
4609
|
-
|
|
4610
|
-
|
|
4611
|
-
|
|
4612
|
-
|
|
4613
|
-
|
|
4614
|
-
|
|
4615
|
-
|
|
4616
|
-
|
|
4617
|
-
|
|
4618
|
-
|
|
4619
|
-
|
|
4620
|
-
|
|
4621
|
-
|
|
4622
|
-
|
|
4623
|
-
|
|
4624
|
-
|
|
4625
|
-
|
|
4626
|
-
|
|
4627
|
-
|
|
4628
|
-
|
|
4629
|
-
|
|
4589
|
+
areMessagePropsEqual as a$,
|
|
4590
|
+
IconFile as a0,
|
|
4591
|
+
IconLink as a1,
|
|
4592
|
+
IconVideo as a2,
|
|
4593
|
+
IconCamera as a3,
|
|
4594
|
+
IconVoice as a4,
|
|
4595
|
+
IconBookmark as a5,
|
|
4596
|
+
IconBell as a6,
|
|
4597
|
+
IconChevronDown as a7,
|
|
4598
|
+
IconMinus as a8,
|
|
4599
|
+
IconPlusSmall as a9,
|
|
4600
|
+
MessageComposerContextProvider as aA,
|
|
4601
|
+
useTypingContext as aB,
|
|
4602
|
+
useChatViewContext as aC,
|
|
4603
|
+
MESSAGE_ACTIONS as aD,
|
|
4604
|
+
LegacyThreadContext as aE,
|
|
4605
|
+
IconEmojiAdd as aF,
|
|
4606
|
+
IconReply as aG,
|
|
4607
|
+
IconEmoji as aH,
|
|
4608
|
+
IconMore as aI,
|
|
4609
|
+
IconUserCheck as aJ,
|
|
4610
|
+
IconBookmarkRemove as aK,
|
|
4611
|
+
IconBellOff as aL,
|
|
4612
|
+
IconNotification as aM,
|
|
4613
|
+
IconEdit as aN,
|
|
4614
|
+
IconCopy as aO,
|
|
4615
|
+
IconUnpin as aP,
|
|
4616
|
+
IconQuote as aQ,
|
|
4617
|
+
IconThread as aR,
|
|
4618
|
+
areMessageUIPropsEqual as aS,
|
|
4619
|
+
isDateSeparatorMessage as aT,
|
|
4620
|
+
isMessageBlocked as aU,
|
|
4621
|
+
messageHasSingleAttachment as aV,
|
|
4622
|
+
messageHasGiphyAttachment as aW,
|
|
4623
|
+
messageHasReactions as aX,
|
|
4624
|
+
messageHasQuotedMessage as aY,
|
|
4625
|
+
isMessageEdited as aZ,
|
|
4626
|
+
countEmojis as a_,
|
|
4627
|
+
IconCheckmark as aa,
|
|
4628
|
+
DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD as ab,
|
|
4629
|
+
IconTrophy as ac,
|
|
4630
|
+
IconReorder as ad,
|
|
4631
|
+
IconMinusCircle as ae,
|
|
4632
|
+
IconSend as af,
|
|
4633
|
+
IconAudio as ag,
|
|
4634
|
+
IconUserAdd as ah,
|
|
4635
|
+
IconMute as ai,
|
|
4636
|
+
IconGiphy as aj,
|
|
4637
|
+
IconFlag as ak,
|
|
4638
|
+
IconUserRemove as al,
|
|
4639
|
+
IconAttachment as am,
|
|
4640
|
+
IconCommand as an,
|
|
4641
|
+
CHANNEL_CONTAINER_ID as ao,
|
|
4642
|
+
IconPlus as ap,
|
|
4643
|
+
IconUnsupportedAttachment as aq,
|
|
4644
|
+
IconExclamationTriangleFill as ar,
|
|
4645
|
+
useAudioPlayer as as,
|
|
4646
|
+
IconMicrophoneSolid as at,
|
|
4647
|
+
IconVideoFill as au,
|
|
4648
|
+
IconRetry as av,
|
|
4649
|
+
IconArrowDownCircle as aw,
|
|
4650
|
+
IconBolt as ax,
|
|
4651
|
+
IconDelete as ay,
|
|
4652
|
+
IconUpload as az,
|
|
4630
4653
|
useChannelActionContext as b,
|
|
4631
|
-
|
|
4632
|
-
|
|
4633
|
-
|
|
4634
|
-
|
|
4635
|
-
|
|
4636
|
-
|
|
4637
|
-
|
|
4638
|
-
|
|
4639
|
-
|
|
4640
|
-
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
|
|
4648
|
-
|
|
4649
|
-
|
|
4650
|
-
|
|
4651
|
-
|
|
4652
|
-
|
|
4653
|
-
|
|
4654
|
-
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
|
|
4659
|
-
|
|
4660
|
-
|
|
4661
|
-
|
|
4662
|
-
|
|
4663
|
-
|
|
4664
|
-
|
|
4665
|
-
|
|
4666
|
-
|
|
4667
|
-
|
|
4668
|
-
|
|
4669
|
-
|
|
4670
|
-
|
|
4671
|
-
|
|
4672
|
-
|
|
4673
|
-
|
|
4674
|
-
|
|
4675
|
-
|
|
4676
|
-
|
|
4677
|
-
|
|
4678
|
-
|
|
4679
|
-
|
|
4680
|
-
|
|
4681
|
-
|
|
4682
|
-
|
|
4683
|
-
|
|
4684
|
-
|
|
4685
|
-
|
|
4686
|
-
|
|
4687
|
-
|
|
4688
|
-
|
|
4689
|
-
|
|
4690
|
-
|
|
4691
|
-
|
|
4692
|
-
|
|
4693
|
-
|
|
4694
|
-
|
|
4654
|
+
getNotificationTargetTag as b$,
|
|
4655
|
+
getMessageActions as b0,
|
|
4656
|
+
processMessages as b1,
|
|
4657
|
+
insertIntro as b2,
|
|
4658
|
+
getGroupStyles as b3,
|
|
4659
|
+
getLastReceived as b4,
|
|
4660
|
+
IconArrowUp as b5,
|
|
4661
|
+
isIntroMessage as b6,
|
|
4662
|
+
isLocalMessage as b7,
|
|
4663
|
+
getIsFirstUnreadMessage as b8,
|
|
4664
|
+
IconArrowDown as b9,
|
|
4665
|
+
useEditMessageHandler as bA,
|
|
4666
|
+
useMentionsHandlers as bB,
|
|
4667
|
+
Channel as bC,
|
|
4668
|
+
ChatViewContext as bD,
|
|
4669
|
+
ChatView as bE,
|
|
4670
|
+
useActiveThread as bF,
|
|
4671
|
+
ChatViewSelectorButton as bG,
|
|
4672
|
+
ChatViewChannelsSelectorButton as bH,
|
|
4673
|
+
ChatViewThreadsSelectorButton as bI,
|
|
4674
|
+
defaultChatViewSelectorItemSet as bJ,
|
|
4675
|
+
createIcon as bK,
|
|
4676
|
+
IconMessageBubble as bL,
|
|
4677
|
+
IconMessageBubbleFill as bM,
|
|
4678
|
+
IconThreadFill as bN,
|
|
4679
|
+
LoadingChannel as bO,
|
|
4680
|
+
LoadingErrorIndicator as bP,
|
|
4681
|
+
validateAndGetMessage as bQ,
|
|
4682
|
+
OPTIONAL_MESSAGE_ACTIONS as bR,
|
|
4683
|
+
getImages as bS,
|
|
4684
|
+
getNonImageAttachments as bT,
|
|
4685
|
+
makeIntroMessage as bU,
|
|
4686
|
+
makeDateMessageId as bV,
|
|
4687
|
+
hasMoreMessagesProbably as bW,
|
|
4688
|
+
SYSTEM_NOTIFICATION_TAG as bX,
|
|
4689
|
+
isNotificationTargetPanel as bY,
|
|
4690
|
+
getNotificationTargetPanel as bZ,
|
|
4691
|
+
getNotificationTargetPanels as b_,
|
|
4692
|
+
DEFAULT_NEXT_CHANNEL_PAGE_SIZE as ba,
|
|
4693
|
+
EmptyStateIndicator as bb,
|
|
4694
|
+
useNotificationTarget as bc,
|
|
4695
|
+
getChannel as bd,
|
|
4696
|
+
IconSearch as be,
|
|
4697
|
+
IconXCircle as bf,
|
|
4698
|
+
useChannelListContext as bg,
|
|
4699
|
+
DEFAULT_JUMP_TO_PAGE_SIZE as bh,
|
|
4700
|
+
ChannelListContextProvider as bi,
|
|
4701
|
+
IconLeave as bj,
|
|
4702
|
+
IconArchive as bk,
|
|
4703
|
+
IconExclamationCircleFill as bl,
|
|
4704
|
+
useThreadsViewContext as bm,
|
|
4705
|
+
IconMessageBubbles as bn,
|
|
4706
|
+
IconRefresh as bo,
|
|
4707
|
+
hasSystemNotificationTag as bp,
|
|
4708
|
+
IconEyeFill as bq,
|
|
4709
|
+
defaultDateTimeParser as br,
|
|
4710
|
+
isLanguageSupported as bs,
|
|
4711
|
+
ChatProvider as bt,
|
|
4712
|
+
TranslationProvider as bu,
|
|
4713
|
+
useActiveAudioPlayer as bv,
|
|
4714
|
+
WithAudioPlayback as bw,
|
|
4715
|
+
defaultRegisterAudioPlayerError as bx,
|
|
4716
|
+
elementIsPlaying as by,
|
|
4717
|
+
AudioPlayer as bz,
|
|
4695
4718
|
useTranslationContext as c,
|
|
4696
|
-
|
|
4697
|
-
|
|
4698
|
-
|
|
4699
|
-
|
|
4700
|
-
|
|
4701
|
-
|
|
4702
|
-
|
|
4703
|
-
|
|
4704
|
-
|
|
4705
|
-
|
|
4706
|
-
|
|
4707
|
-
|
|
4708
|
-
|
|
4709
|
-
|
|
4710
|
-
|
|
4711
|
-
|
|
4719
|
+
addNotificationTargetTag as c0,
|
|
4720
|
+
useLegacyThreadContext as c1,
|
|
4721
|
+
ThreadContext as c2,
|
|
4722
|
+
ThreadProvider as c3,
|
|
4723
|
+
ChannelActionContext as c4,
|
|
4724
|
+
ChannelActionProvider as c5,
|
|
4725
|
+
ChannelListContext as c6,
|
|
4726
|
+
ChannelStateContext as c7,
|
|
4727
|
+
ChannelStateProvider as c8,
|
|
4728
|
+
ChatContext as c9,
|
|
4729
|
+
ComponentProvider as ca,
|
|
4730
|
+
MessageComposerContext as cb,
|
|
4731
|
+
TranslationContext as cc,
|
|
4732
|
+
TypingContext as cd,
|
|
4733
|
+
TypingProvider as ce,
|
|
4734
|
+
isDayOrMoment as cf,
|
|
4735
|
+
isNumberOrString as cg,
|
|
4712
4736
|
useChannelStateContext as d,
|
|
4713
4737
|
useChatContext as e,
|
|
4714
4738
|
isNotificationForPanel as f,
|
|
4715
|
-
|
|
4716
|
-
|
|
4739
|
+
IconPauseFill as g,
|
|
4740
|
+
IconPlayFill as h,
|
|
4717
4741
|
isMessageBounced as i,
|
|
4718
|
-
|
|
4719
|
-
|
|
4720
|
-
|
|
4721
|
-
|
|
4722
|
-
|
|
4723
|
-
|
|
4742
|
+
getDefaultExportFromCjs as j,
|
|
4743
|
+
defaultTranslatorFunction as k,
|
|
4744
|
+
calendar as l,
|
|
4745
|
+
IconLoading as m,
|
|
4746
|
+
useComponentContext as n,
|
|
4747
|
+
isNetworkSendFailure as o,
|
|
4724
4748
|
predefinedFormatters as p,
|
|
4725
|
-
|
|
4726
|
-
|
|
4727
|
-
|
|
4728
|
-
|
|
4749
|
+
isUserMuted as q,
|
|
4750
|
+
useThreadContext as r,
|
|
4751
|
+
usePopoverPosition as s,
|
|
4752
|
+
IconXmark as t,
|
|
4729
4753
|
useStateStore as u,
|
|
4730
|
-
|
|
4731
|
-
|
|
4732
|
-
|
|
4733
|
-
|
|
4734
|
-
|
|
4754
|
+
IconUser as v,
|
|
4755
|
+
IconExclamationMarkFill as w,
|
|
4756
|
+
IconChevronRight as x,
|
|
4757
|
+
IconChevronLeft as y,
|
|
4758
|
+
IconArrowLeft as z
|
|
4735
4759
|
};
|
|
4736
|
-
//# sourceMappingURL=WithAudioPlayback.
|
|
4760
|
+
//# sourceMappingURL=WithAudioPlayback.9b779236.mjs.map
|