@djangocfg/ui-tools 2.1.310 → 2.1.313

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.
Files changed (161) hide show
  1. package/README.md +38 -22
  2. package/dist/{DocsLayout-W5JLRNSZ.mjs → DocsLayout-ESVQZO3V.mjs} +3 -3
  3. package/dist/{DocsLayout-W5JLRNSZ.mjs.map → DocsLayout-ESVQZO3V.mjs.map} +1 -1
  4. package/dist/{DocsLayout-ZXD2CUOH.cjs → DocsLayout-KUPDWJ3G.cjs} +48 -48
  5. package/dist/{DocsLayout-ZXD2CUOH.cjs.map → DocsLayout-KUPDWJ3G.cjs.map} +1 -1
  6. package/dist/Player-M3GC3VPE.mjs +4 -0
  7. package/dist/Player-M3GC3VPE.mjs.map +1 -0
  8. package/dist/Player-ZGQKKOWI.css +65 -0
  9. package/dist/Player-ZGQKKOWI.css.map +1 -0
  10. package/dist/Player-ZL2X5LGG.cjs +13 -0
  11. package/dist/Player-ZL2X5LGG.cjs.map +1 -0
  12. package/dist/{chunk-CXVGN6ZW.cjs → chunk-DFTVB66S.cjs} +7 -6
  13. package/dist/chunk-DFTVB66S.cjs.map +1 -0
  14. package/dist/{chunk-2QY3LJR6.mjs → chunk-EUADAUBQ.mjs} +5 -4
  15. package/dist/chunk-EUADAUBQ.mjs.map +1 -0
  16. package/dist/chunk-FX2QFYWF.mjs +2059 -0
  17. package/dist/chunk-FX2QFYWF.mjs.map +1 -0
  18. package/dist/{chunk-6HNAPVZ2.mjs → chunk-GBLQTHWT.mjs} +11 -13
  19. package/dist/chunk-GBLQTHWT.mjs.map +1 -0
  20. package/dist/{chunk-FYLR232K.cjs → chunk-S44PW6NK.cjs} +11 -13
  21. package/dist/chunk-S44PW6NK.cjs.map +1 -0
  22. package/dist/chunk-ZLQHUZDU.cjs +2061 -0
  23. package/dist/chunk-ZLQHUZDU.cjs.map +1 -0
  24. package/dist/components-WYEZL5TE.cjs +26 -0
  25. package/dist/{components-3RTH76CV.cjs.map → components-WYEZL5TE.cjs.map} +1 -1
  26. package/dist/components-ZAGG2PBO.mjs +5 -0
  27. package/dist/{components-5GVVL2Q6.mjs.map → components-ZAGG2PBO.mjs.map} +1 -1
  28. package/dist/index.cjs +36 -220
  29. package/dist/index.cjs.map +1 -1
  30. package/dist/index.css +65 -0
  31. package/dist/index.css.map +1 -1
  32. package/dist/index.d.cts +44 -500
  33. package/dist/index.d.ts +44 -500
  34. package/dist/index.mjs +16 -62
  35. package/dist/index.mjs.map +1 -1
  36. package/package.json +6 -6
  37. package/src/components/markdown/MarkdownMessage/ActionRow.tsx +48 -0
  38. package/src/components/markdown/MarkdownMessage/ChatMessageRow.tsx +97 -0
  39. package/src/components/markdown/MarkdownMessage/CodeBlock.tsx +9 -13
  40. package/src/components/markdown/MarkdownMessage/MarkdownMessage.story.tsx +77 -2
  41. package/src/components/markdown/MarkdownMessage/MarkdownMessage.tsx +2 -3
  42. package/src/components/markdown/MarkdownMessage/README.md +72 -0
  43. package/src/components/markdown/MarkdownMessage/components.tsx +3 -3
  44. package/src/components/markdown/MarkdownMessage/index.ts +6 -0
  45. package/src/index.ts +2 -11
  46. package/src/tools/AudioPlayer/AudioPlayer.story.tsx +454 -107
  47. package/src/tools/AudioPlayer/Player.tsx +80 -0
  48. package/src/tools/AudioPlayer/PlayerShell.tsx +122 -0
  49. package/src/tools/AudioPlayer/README.md +139 -204
  50. package/src/tools/AudioPlayer/audio/audioContext.ts +39 -0
  51. package/src/tools/AudioPlayer/audio/decodePeaks.ts +36 -0
  52. package/src/tools/AudioPlayer/audio/index.ts +4 -0
  53. package/src/tools/AudioPlayer/audio/mediaElementSourceCache.ts +20 -0
  54. package/src/tools/AudioPlayer/audio/peaksCache.ts +37 -0
  55. package/src/tools/AudioPlayer/context/AudioRefContext.tsx +9 -0
  56. package/src/tools/AudioPlayer/context/ControlsContext.tsx +7 -0
  57. package/src/tools/AudioPlayer/context/LevelsContext.tsx +7 -0
  58. package/src/tools/AudioPlayer/context/MetaContext.tsx +16 -0
  59. package/src/tools/AudioPlayer/context/PlayerProvider.tsx +314 -0
  60. package/src/tools/AudioPlayer/context/StateContext.tsx +7 -0
  61. package/src/tools/AudioPlayer/context/index.ts +16 -15
  62. package/src/tools/AudioPlayer/context/selectors.ts +36 -0
  63. package/src/tools/AudioPlayer/hooks/index.ts +12 -39
  64. package/src/tools/AudioPlayer/hooks/useActivePlayer.ts +31 -0
  65. package/src/tools/AudioPlayer/hooks/useAnalyser.ts +62 -0
  66. package/src/tools/AudioPlayer/hooks/useAudioElementEvents.ts +102 -0
  67. package/src/tools/AudioPlayer/hooks/useKeyboardShortcuts.ts +91 -0
  68. package/src/tools/AudioPlayer/hooks/useMediaSession.ts +74 -0
  69. package/src/tools/AudioPlayer/hooks/usePeaks.ts +83 -0
  70. package/src/tools/AudioPlayer/hooks/usePlayerPreferences.ts +21 -0
  71. package/src/tools/AudioPlayer/hooks/usePlayheadLoop.ts +77 -0
  72. package/src/tools/AudioPlayer/hooks/useResizeObserver.ts +20 -0
  73. package/src/tools/AudioPlayer/hooks/useThemeWatcher.ts +22 -0
  74. package/src/tools/AudioPlayer/index.ts +63 -134
  75. package/src/tools/AudioPlayer/lazy.tsx +8 -97
  76. package/src/tools/AudioPlayer/parts/Controls/ControlsRow.tsx +30 -0
  77. package/src/tools/AudioPlayer/parts/Controls/IconButton.tsx +62 -0
  78. package/src/tools/AudioPlayer/parts/Controls/LoopButton.tsx +33 -0
  79. package/src/tools/AudioPlayer/parts/Controls/PlayButton.tsx +86 -0
  80. package/src/tools/AudioPlayer/parts/Controls/SkipButton.tsx +17 -0
  81. package/src/tools/AudioPlayer/parts/Controls/VolumeControl.tsx +171 -0
  82. package/src/tools/AudioPlayer/parts/Controls/index.ts +6 -0
  83. package/src/tools/AudioPlayer/parts/Cover/Cover.tsx +24 -0
  84. package/src/tools/AudioPlayer/parts/Cover/CoverPlaceholder.tsx +27 -0
  85. package/src/tools/AudioPlayer/parts/Cover/ReactivePulse.tsx +66 -0
  86. package/src/tools/AudioPlayer/parts/Cover/index.ts +3 -0
  87. package/src/tools/AudioPlayer/parts/ErrorState/ErrorState.tsx +35 -0
  88. package/src/tools/AudioPlayer/parts/ErrorState/index.ts +1 -0
  89. package/src/tools/AudioPlayer/parts/Layout/CompactLayout.tsx +25 -0
  90. package/src/tools/AudioPlayer/parts/Layout/DefaultLayout.tsx +48 -0
  91. package/src/tools/AudioPlayer/parts/Layout/index.ts +2 -0
  92. package/src/tools/AudioPlayer/parts/Meta/Artist.tsx +14 -0
  93. package/src/tools/AudioPlayer/parts/Meta/TimeDisplay.tsx +49 -0
  94. package/src/tools/AudioPlayer/parts/Meta/Title.tsx +13 -0
  95. package/src/tools/AudioPlayer/parts/Meta/index.ts +3 -0
  96. package/src/tools/AudioPlayer/parts/Skeleton/CoverSkeleton.tsx +13 -0
  97. package/src/tools/AudioPlayer/parts/Skeleton/MetaSkeleton.tsx +10 -0
  98. package/src/tools/AudioPlayer/parts/Skeleton/index.ts +2 -0
  99. package/src/tools/AudioPlayer/parts/Waveform/BarsWaveform.tsx +48 -0
  100. package/src/tools/AudioPlayer/parts/Waveform/LiveWaveform.tsx +95 -0
  101. package/src/tools/AudioPlayer/parts/Waveform/PeaksWaveform.tsx +100 -0
  102. package/src/tools/AudioPlayer/parts/Waveform/ProgressBar.tsx +76 -0
  103. package/src/tools/AudioPlayer/parts/Waveform/Waveform.tsx +74 -0
  104. package/src/tools/AudioPlayer/parts/Waveform/WaveformSkeleton.tsx +16 -0
  105. package/src/tools/AudioPlayer/parts/Waveform/index.ts +8 -0
  106. package/src/tools/AudioPlayer/parts/Waveform/waveformInteraction.ts +106 -0
  107. package/src/tools/AudioPlayer/parts/Waveform/waveformRenderer.ts +91 -0
  108. package/src/tools/AudioPlayer/parts/index.ts +1 -0
  109. package/src/tools/AudioPlayer/store/activePlayerBus.ts +63 -0
  110. package/src/tools/AudioPlayer/store/createLevelsStore.ts +37 -0
  111. package/src/tools/AudioPlayer/store/index.ts +16 -0
  112. package/src/tools/AudioPlayer/store/preferencesStore.ts +104 -0
  113. package/src/tools/AudioPlayer/styles/webview-safe.css +77 -0
  114. package/src/tools/AudioPlayer/types.ts +95 -0
  115. package/src/tools/AudioPlayer/utils/bucketize.ts +27 -0
  116. package/src/tools/AudioPlayer/utils/clamp.ts +5 -0
  117. package/src/tools/AudioPlayer/utils/dpr.ts +19 -0
  118. package/src/tools/AudioPlayer/utils/formatTime.ts +12 -8
  119. package/src/tools/AudioPlayer/utils/index.ts +4 -5
  120. package/src/tools/AudioPlayer/utils/readCssVar.ts +7 -0
  121. package/src/tools/AudioPlayer/utils/resolveCanvasColor.ts +28 -0
  122. package/src/tools/index.ts +5 -75
  123. package/dist/chunk-2QY3LJR6.mjs.map +0 -1
  124. package/dist/chunk-6HNAPVZ2.mjs.map +0 -1
  125. package/dist/chunk-CXVGN6ZW.cjs.map +0 -1
  126. package/dist/chunk-F2N7P5XU.cjs +0 -30
  127. package/dist/chunk-F2N7P5XU.cjs.map +0 -1
  128. package/dist/chunk-FYLR232K.cjs.map +0 -1
  129. package/dist/chunk-HMHIVEMS.mjs +0 -1619
  130. package/dist/chunk-HMHIVEMS.mjs.map +0 -1
  131. package/dist/chunk-JWB2EWQO.mjs +0 -5
  132. package/dist/chunk-JWB2EWQO.mjs.map +0 -1
  133. package/dist/chunk-YZX6FH3H.cjs +0 -1656
  134. package/dist/chunk-YZX6FH3H.cjs.map +0 -1
  135. package/dist/components-3RTH76CV.cjs +0 -27
  136. package/dist/components-5GVVL2Q6.mjs +0 -5
  137. package/dist/components-CPHOUQ5F.cjs +0 -46
  138. package/dist/components-CPHOUQ5F.cjs.map +0 -1
  139. package/dist/components-OTK43IMD.mjs +0 -6
  140. package/dist/components-OTK43IMD.mjs.map +0 -1
  141. package/src/tools/AudioPlayer/components/HybridAudioPlayer.tsx +0 -225
  142. package/src/tools/AudioPlayer/components/HybridCompactPlayer.tsx +0 -163
  143. package/src/tools/AudioPlayer/components/HybridSimplePlayer.tsx +0 -284
  144. package/src/tools/AudioPlayer/components/HybridWaveform.tsx +0 -286
  145. package/src/tools/AudioPlayer/components/ReactiveCover/AudioReactiveCover.tsx +0 -151
  146. package/src/tools/AudioPlayer/components/ReactiveCover/effects/GlowEffect.tsx +0 -110
  147. package/src/tools/AudioPlayer/components/ReactiveCover/effects/MeshEffect.tsx +0 -58
  148. package/src/tools/AudioPlayer/components/ReactiveCover/effects/OrbsEffect.tsx +0 -45
  149. package/src/tools/AudioPlayer/components/ReactiveCover/effects/SpotlightEffect.tsx +0 -82
  150. package/src/tools/AudioPlayer/components/ReactiveCover/effects/index.ts +0 -8
  151. package/src/tools/AudioPlayer/components/ReactiveCover/index.ts +0 -6
  152. package/src/tools/AudioPlayer/components/index.ts +0 -23
  153. package/src/tools/AudioPlayer/context/HybridAudioProvider.tsx +0 -158
  154. package/src/tools/AudioPlayer/effects/index.ts +0 -412
  155. package/src/tools/AudioPlayer/hooks/useAudioBus.ts +0 -76
  156. package/src/tools/AudioPlayer/hooks/useHybridAudio.ts +0 -403
  157. package/src/tools/AudioPlayer/hooks/useHybridAudioAnalysis.ts +0 -96
  158. package/src/tools/AudioPlayer/hooks/useVisualization.tsx +0 -207
  159. package/src/tools/AudioPlayer/types/effects.ts +0 -73
  160. package/src/tools/AudioPlayer/types/index.ts +0 -27
  161. package/src/tools/AudioPlayer/utils/debug.ts +0 -14
package/dist/index.d.ts CHANGED
@@ -7,11 +7,11 @@ import { Language } from 'prism-react-renderer';
7
7
  export { Language } from 'prism-react-renderer';
8
8
  import { RJSFSchema, UiSchema, WidgetProps, FieldTemplateProps, ObjectFieldTemplateProps, ArrayFieldTemplateProps, ArrayFieldItemTemplateProps, ErrorListProps } from '@rjsf/utils';
9
9
  import { FormProps, IChangeEvent } from '@rjsf/core';
10
- import * as zustand from 'zustand';
11
10
  import { CommonExternalProps } from 'react-json-tree';
12
11
  import { MediaPlayerInstance } from '@vidstack/react';
13
12
  import * as monaco from 'monaco-editor';
14
13
  import * as zustand_middleware from 'zustand/middleware';
14
+ import * as zustand from 'zustand';
15
15
 
16
16
  interface LoadingFallbackProps {
17
17
  /** Minimum height of the loading container */
@@ -607,467 +607,58 @@ interface LottiePlayerProps {
607
607
  */
608
608
  declare const LazyLottiePlayer: React$1.ComponentType<LottiePlayerProps>;
609
609
 
610
- interface HybridAudioPlayerProps {
611
- /** Show playback controls */
612
- showControls?: boolean;
613
- /** Show frequency waveform */
614
- showWaveform?: boolean;
615
- /** Waveform visualization mode */
616
- waveformMode?: 'frequency' | 'static';
617
- /** Waveform height in pixels */
618
- waveformHeight?: number;
619
- /** Show time display */
620
- showTimer?: boolean;
621
- /** Show volume control */
622
- showVolume?: boolean;
623
- /** Show loop button */
624
- showLoop?: boolean;
625
- /** Additional CSS class */
626
- className?: string;
627
- /** Inline styles */
628
- style?: React.CSSProperties;
629
- }
630
- declare const HybridAudioPlayer: React$1.NamedExoticComponent<HybridAudioPlayerProps>;
631
-
632
- /**
633
- * Audio Reactive Effects - Common utilities and types
634
- *
635
- * Provides reusable effect calculations and configurations
636
- */
637
- type EffectVariant = 'glow' | 'orbs' | 'spotlight' | 'mesh';
638
- type EffectIntensity = 'subtle' | 'medium' | 'strong';
639
- type EffectColorScheme = 'primary' | 'vibrant' | 'cool' | 'warm';
640
- interface AudioLevels {
641
- bass: number;
642
- mid: number;
643
- high: number;
644
- overall: number;
645
- }
646
- interface EffectConfig$1 {
647
- opacity: number;
648
- scale: number;
649
- blur: string;
650
- }
651
- interface EffectColors {
652
- colors: string[];
653
- hueShift: number;
654
- }
655
- interface EffectLayer {
656
- inset: number;
657
- opacity: number;
658
- scale: number;
659
- background: string;
660
- blur: string;
661
- animation?: string;
662
- }
663
- declare const INTENSITY_CONFIG: Record<EffectIntensity, EffectConfig$1>;
664
- declare const COLOR_SCHEMES: Record<EffectColorScheme, string[]>;
665
- /**
666
- * Get effect configuration from intensity setting
667
- */
668
- declare function getEffectConfig(intensity: EffectIntensity): EffectConfig$1;
669
- /**
670
- * Get color array from color scheme
671
- */
672
- declare function getColors(colorScheme: EffectColorScheme): string[];
673
- /**
674
- * Prepare colors with hue shift based on audio levels
675
- */
676
- declare function prepareEffectColors(colorScheme: EffectColorScheme, levels: AudioLevels): EffectColors;
677
- /**
678
- * Calculate glow layer properties
679
- */
680
- declare function calculateGlowLayers(levels: AudioLevels, config: EffectConfig$1, colors: string[]): EffectLayer[];
681
- /**
682
- * Calculate orb positions and properties - highly reactive
683
- */
684
- declare function calculateOrbs(levels: AudioLevels, config: EffectConfig$1, colors: string[], baseSize?: number): {
685
- x: number;
686
- y: number;
687
- size: number;
688
- color: string;
689
- opacity: number;
690
- scale: number;
691
- }[];
692
- /**
693
- * Calculate mesh gradient positions - dynamic and reactive
694
- */
695
- declare function calculateMeshGradients(levels: AudioLevels, config: EffectConfig$1, colors: string[]): ({
696
- width: string;
697
- height: string;
698
- top: string;
699
- right: string;
700
- color: string;
701
- opacity: number;
702
- scale: number;
703
- rotation: number;
704
- blur: string;
705
- bottom?: undefined;
706
- left?: undefined;
707
- isCenter?: undefined;
708
- } | {
709
- width: string;
710
- height: string;
711
- bottom: string;
712
- left: string;
713
- color: string;
714
- opacity: number;
715
- scale: number;
716
- rotation: number;
717
- blur: string;
718
- top?: undefined;
719
- right?: undefined;
720
- isCenter?: undefined;
721
- } | {
722
- width: string;
723
- height: string;
724
- top: string;
725
- left: string;
726
- color: string;
727
- opacity: number;
728
- scale: number;
729
- rotation: number;
730
- blur: string;
731
- right?: undefined;
732
- bottom?: undefined;
733
- isCenter?: undefined;
734
- } | {
735
- width: string;
736
- height: string;
737
- top: string;
738
- left: string;
739
- color: string;
740
- opacity: number;
741
- scale: number;
742
- rotation: number;
743
- isCenter: boolean;
744
- blur: string;
745
- right?: undefined;
746
- bottom?: undefined;
747
- })[];
748
- /**
749
- * Calculate spotlight effect properties - highly reactive
750
- */
751
- declare function calculateSpotlight(levels: AudioLevels, config: EffectConfig$1, colors: string[], rotation: number): {
752
- rotation: number;
753
- inset: number;
754
- colors: {
755
- color: string;
756
- opacity: number;
757
- }[];
758
- pulseInset: number;
759
- pulseOpacity: number;
760
- pulseScale: number;
761
- ringOpacity: number;
762
- ringScale: number;
610
+ type WaveformMode = 'peaks' | 'live' | 'bars' | 'progress' | 'none';
611
+ type WaveformConfig = {
612
+ mode?: WaveformMode;
613
+ peaks?: Float32Array;
614
+ height?: number;
615
+ barWidth?: number;
616
+ barGap?: number;
617
+ bgColor?: string;
618
+ fgColor?: string;
619
+ decodeOnMount?: boolean;
763
620
  };
764
- /**
765
- * CSS for effect animations - can be injected once
766
- */
767
- declare const EFFECT_ANIMATIONS = "\n @keyframes spotlight-spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n @keyframes orb-float-1 {\n 0%, 100% { transform: translate(-50%, -50%) translateY(0); }\n 50% { transform: translate(-50%, -50%) translateY(-15px); }\n }\n\n @keyframes orb-float-2 {\n 0%, 100% { transform: translate(-50%, -50%) translateX(0); }\n 50% { transform: translate(-50%, -50%) translateX(15px); }\n }\n\n @keyframes orb-float-3 {\n 0%, 100% { transform: translate(-50%, -50%) translate(0, 0); }\n 33% { transform: translate(-50%, -50%) translate(10px, -10px); }\n 66% { transform: translate(-50%, -50%) translate(-10px, 10px); }\n }\n\n @keyframes orb-float-4 {\n 0%, 100% { transform: translate(-50%, -50%) translate(0, 0); }\n 50% { transform: translate(-50%, -50%) translate(-15px, -10px); }\n }\n\n @keyframes mesh-float-1 {\n 0%, 100% { transform: translate(0, 0) scale(1); }\n 25% { transform: translate(-5%, 10%) scale(1.05); }\n 50% { transform: translate(5%, 5%) scale(0.95); }\n 75% { transform: translate(-3%, -5%) scale(1.02); }\n }\n\n @keyframes mesh-float-2 {\n 0%, 100% { transform: translate(0, 0) scale(1); }\n 33% { transform: translate(8%, -8%) scale(1.08); }\n 66% { transform: translate(-6%, 6%) scale(0.92); }\n }\n\n @keyframes mesh-float-3 {\n 0%, 100% { transform: translate(0, 0) scale(1); }\n 50% { transform: translate(10%, 10%) scale(1.1); }\n }\n\n @keyframes mesh-float-4 {\n 0%, 100% { transform: translate(0, 0) scale(1) rotate(0deg); }\n 25% { transform: translate(10%, -5%) scale(1.1) rotate(5deg); }\n 50% { transform: translate(-5%, 10%) scale(0.95) rotate(-5deg); }\n 75% { transform: translate(-10%, -10%) scale(1.05) rotate(3deg); }\n }\n\n @keyframes mesh-pulse {\n 0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.3; }\n 50% { transform: translate(-50%, -50%) scale(1.2); opacity: 0.5; }\n }\n\n @keyframes glow-breathe {\n 0%, 100% { opacity: 0.6; transform: scale(1); }\n 50% { opacity: 1; transform: scale(1.05); }\n }\n\n @keyframes glow-rotate {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n @keyframes sparkle-move {\n 0% { opacity: 0; transform: scale(0.8); }\n 50% { opacity: 1; }\n 100% { opacity: 0; transform: scale(1.2); }\n }\n";
768
-
769
- interface AudioBusStore {
770
- /** ID of the currently active (playing) player, null if none */
771
- activeId: string | null;
772
- setActiveId: (id: string | null) => void;
773
- }
774
- declare const useAudioBusStore: zustand.UseBoundStore<zustand.StoreApi<AudioBusStore>>;
775
- interface UseAudioBusReturn {
776
- /** Broadcast: this player is now playing — all others should stop */
777
- announce: () => void;
778
- /** Release: this player stopped (clears activeId if it was ours) */
779
- release: () => void;
780
- }
781
- /**
782
- * @param playerId Stable unique ID for this player instance
783
- * @param onStop Called when another player announces — should pause this player
784
- */
785
- declare function useAudioBus(playerId: string, onStop: () => void): UseAudioBusReturn;
786
-
787
- interface UseHybridAudioOptions {
621
+ type ReactiveCoverMode = false | 'subtle';
622
+ type PlayerVariant = 'default' | 'compact' | 'auto';
623
+ type PlayerErrorReason = 'network' | 'decode' | 'unsupported' | 'unknown';
624
+ type PlayerProps = {
788
625
  src: string;
789
- autoPlay?: boolean;
790
- initialVolume?: number;
791
- loop?: boolean;
792
- crossOrigin?: 'anonymous' | 'use-credentials';
793
- /** Set to true to opt out of global audio bus (player won't stop others and won't be stopped) */
794
- excludeFromBus?: boolean;
795
- onPlay?: () => void;
796
- onPause?: () => void;
797
- onEnded?: () => void;
798
- onTimeUpdate?: (time: number) => void;
799
- onError?: (error: Error) => void;
800
- onReady?: () => void;
801
- }
802
- interface HybridAudioState {
803
- isReady: boolean;
804
- isPlaying: boolean;
805
- currentTime: number;
806
- duration: number;
807
- volume: number;
808
- isMuted: boolean;
809
- isLooping: boolean;
810
- buffered: TimeRanges | null;
811
- error: Error | null;
812
- }
813
- interface HybridAudioControls {
814
- play: () => Promise<void>;
815
- pause: () => void;
816
- togglePlay: () => void;
817
- seek: (time: number) => void;
818
- seekTo: (progress: number) => void;
819
- skip: (seconds: number) => void;
820
- setVolume: (vol: number) => void;
821
- toggleMute: () => void;
822
- toggleLoop: () => void;
823
- setLoop: (enabled: boolean) => void;
824
- restart: () => void;
825
- }
826
- interface HybridWebAudioAPI {
827
- context: AudioContext | null;
828
- analyser: AnalyserNode | null;
829
- sourceNode: MediaElementAudioSourceNode | null;
830
- }
831
- interface UseHybridAudioReturn {
832
- audioRef: React.RefObject<HTMLAudioElement | null>;
833
- state: HybridAudioState;
834
- controls: HybridAudioControls;
835
- webAudio: HybridWebAudioAPI;
836
- }
837
- declare function useHybridAudio(options: UseHybridAudioOptions): UseHybridAudioReturn;
838
-
839
- declare function useHybridAudioAnalysis(analyser: AnalyserNode | null, isPlaying: boolean): AudioLevels;
840
-
841
- type VisualizationVariant = 'glow' | 'orbs' | 'spotlight' | 'mesh' | 'none';
842
- type VisualizationIntensity = 'subtle' | 'medium' | 'strong';
843
- type VisualizationColorScheme = 'primary' | 'vibrant' | 'cool' | 'warm';
844
- interface VisualizationSettings {
845
- /** Enable reactive cover animation */
846
- enabled: boolean;
847
- /** Visual effect variant */
848
- variant: VisualizationVariant;
849
- /** Effect intensity */
850
- intensity: VisualizationIntensity;
851
- /** Color scheme */
852
- colorScheme: VisualizationColorScheme;
853
- /** Playback volume (0-1) */
854
- volume: number;
855
- /** Loop playback */
856
- isLooping: boolean;
857
- }
858
- interface UseVisualizationReturn {
859
- /** Current settings */
860
- settings: VisualizationSettings;
861
- /** Toggle visualization on/off */
862
- toggle: () => void;
863
- /** Set specific setting */
864
- setSetting: <K extends keyof VisualizationSettings>(key: K, value: VisualizationSettings[K]) => void;
865
- /** Cycle to next variant */
866
- nextVariant: () => void;
867
- /** Cycle to next intensity */
868
- nextIntensity: () => void;
869
- /** Cycle to next color scheme */
870
- nextColorScheme: () => void;
871
- /** Reset to defaults */
872
- reset: () => void;
873
- }
874
- type UseAudioVisualizationReturn = UseVisualizationReturn;
875
- interface VisualizationProviderProps {
876
- children: ReactNode;
877
- }
878
- declare function VisualizationProvider({ children }: VisualizationProviderProps): react_jsx_runtime.JSX.Element;
879
- declare function useVisualization(): UseVisualizationReturn;
880
- declare const useAudioVisualization: typeof useVisualization;
881
- declare const VARIANT_INFO: Record<VisualizationVariant, {
882
- label: string;
883
- icon: string;
884
- }>;
885
- declare const INTENSITY_INFO: Record<VisualizationIntensity, {
886
- label: string;
887
- }>;
888
- declare const COLOR_SCHEME_INFO: Record<VisualizationColorScheme, {
889
- label: string;
890
- preview: string;
891
- }>;
892
-
893
- interface HybridSimplePlayerProps {
894
- /** Audio source URL */
895
- src: string;
896
- /** Track title */
626
+ peaks?: Float32Array;
897
627
  title?: string;
898
- /** Artist name */
899
628
  artist?: string;
900
- /** Cover art URL or ReactNode */
901
- coverArt?: string | ReactNode;
902
- /** Cover art size */
903
- coverSize?: 'sm' | 'md' | 'lg';
904
- /** Show frequency waveform */
905
- showWaveform?: boolean;
906
- /** Waveform visualization mode */
907
- waveformMode?: 'frequency' | 'static';
908
- /** Waveform height in pixels */
909
- waveformHeight?: number;
910
- /** Show timer */
911
- showTimer?: boolean;
912
- /** Show volume control */
913
- showVolume?: boolean;
914
- /** Show loop/repeat button */
915
- showLoop?: boolean;
916
- /** Enable audio-reactive cover effects */
917
- reactiveCover?: boolean;
918
- /** Reactive effect variant */
919
- variant?: VisualizationVariant;
920
- /** Reactive effect intensity */
921
- intensity?: EffectIntensity;
922
- /** Reactive effect color scheme */
923
- colorScheme?: EffectColorScheme;
924
- /** Auto-play on load */
925
- autoPlay?: boolean;
926
- /** Loop playback */
927
- loop?: boolean;
928
- /** Initial volume (0-1) */
929
- initialVolume?: number;
930
- /** Layout direction */
931
- layout?: 'vertical' | 'horizontal';
932
- /** Additional class name */
629
+ album?: string;
630
+ cover?: string;
631
+ variant?: PlayerVariant;
933
632
  className?: string;
934
- /** Callbacks */
935
- onPlay?: () => void;
936
- onPause?: () => void;
937
- onEnded?: () => void;
938
- onError?: (error: Error) => void;
939
- }
940
- declare function HybridSimplePlayer(props: HybridSimplePlayerProps): react_jsx_runtime.JSX.Element;
941
-
942
- /**
943
- * HybridCompactPlayer - Single-row audio player
944
- *
945
- * Designed for tight spaces: play/pause + waveform + timer.
946
- * No cover art, no volume slider, no skip buttons.
947
- *
948
- * @example
949
- * <HybridCompactPlayer src="https://example.com/audio.mp3" title="Rain & Thunder" />
950
- *
951
- * @example
952
- * // Lazy-loaded (preferred in app)
953
- * <LazyHybridCompactPlayer src={url} autoPlay />
954
- */
955
-
956
- interface HybridCompactPlayerProps {
957
- /** Audio source URL */
958
- src: string;
959
- /** Track title (shown as tooltip / aria-label) */
960
- title?: string;
961
- /** Auto-play on load */
962
- autoPlay?: boolean;
963
- /** Loop playback */
633
+ waveform?: WaveformConfig;
634
+ reactiveCover?: ReactiveCoverMode;
635
+ autoplay?: boolean;
964
636
  loop?: boolean;
965
- /** Initial volume (0-1) */
966
637
  initialVolume?: number;
967
- /** Waveform visualization mode */
968
- waveformMode?: 'frequency' | 'static';
969
- /** Show timer */
970
- showTimer?: boolean;
971
- /** Button size — 'sm' (h-6 w-6) | 'md' (h-8 w-8, default) */
972
- buttonSize?: 'sm' | 'md';
973
- /** Additional class name */
974
- className?: string;
975
- /** Callbacks */
638
+ muted?: boolean;
639
+ preload?: 'none' | 'metadata' | 'auto';
640
+ exclusive?: boolean;
641
+ onPrev?: () => void;
642
+ onNext?: () => void;
976
643
  onPlay?: () => void;
977
644
  onPause?: () => void;
978
645
  onEnded?: () => void;
979
- onError?: (error: Error) => void;
980
- }
981
-
982
- interface HybridWaveformProps {
983
- /** Visualization mode */
984
- mode?: 'frequency' | 'static';
985
- /** Canvas height in pixels */
986
- height?: number;
987
- /** Bar width in pixels */
988
- barWidth?: number;
989
- /** Gap between bars in pixels */
990
- barGap?: number;
991
- /** Bar border radius */
992
- barRadius?: number;
993
- /** Color for played portion */
994
- progressColor?: string;
995
- /** Color for unplayed portion */
996
- waveColor?: string;
997
- /** Color for buffered regions indicator */
998
- bufferedColor?: string;
999
- /** Additional CSS class */
1000
- className?: string;
1001
- /** Callback when user seeks */
1002
- onSeek?: (time: number) => void;
1003
- }
1004
- declare const HybridWaveform: React$1.NamedExoticComponent<HybridWaveformProps>;
1005
-
1006
- interface AudioReactiveCoverProps {
1007
- children: ReactNode;
1008
- /** 'sm' | 'md' | 'lg' = fixed sizes; 'full' = stretch to container width (aspect-square) */
1009
- size?: 'sm' | 'md' | 'lg' | 'full';
1010
- variant?: EffectVariant;
1011
- intensity?: EffectIntensity;
1012
- colorScheme?: EffectColorScheme;
1013
- onClick?: () => void;
1014
- className?: string;
1015
- }
1016
- declare function AudioReactiveCover({ children, size, variant, intensity, colorScheme, onClick, className, }: AudioReactiveCoverProps): react_jsx_runtime.JSX.Element;
1017
-
1018
- interface GlowEffectData {
1019
- layers: ReturnType<typeof calculateGlowLayers>;
1020
- hueShift: number;
1021
- showPulseRings: boolean;
1022
- showSparkle: boolean;
1023
- }
1024
- interface GlowEffectProps {
1025
- data: GlowEffectData;
1026
- colors: string[];
1027
- isPlaying: boolean;
1028
- }
1029
- declare function GlowEffect({ data, colors, isPlaying }: GlowEffectProps): react_jsx_runtime.JSX.Element;
1030
-
1031
- interface OrbsEffectProps {
1032
- orbs: ReturnType<typeof calculateOrbs>;
1033
- blur: string;
1034
- isPlaying: boolean;
1035
- }
1036
- declare function OrbsEffect({ orbs, blur, isPlaying }: OrbsEffectProps): react_jsx_runtime.JSX.Element;
1037
-
1038
- interface SpotlightEffectProps {
1039
- data: ReturnType<typeof calculateSpotlight>;
1040
- colors: string[];
1041
- blur: string;
1042
- isPlaying: boolean;
1043
- }
1044
- declare function SpotlightEffect({ data, colors, blur, isPlaying }: SpotlightEffectProps): react_jsx_runtime.JSX.Element;
1045
-
1046
- interface MeshEffectProps {
1047
- gradients: ReturnType<typeof calculateMeshGradients>;
1048
- blur: string;
1049
- isPlaying: boolean;
1050
- }
1051
- declare function MeshEffect({ gradients, isPlaying }: MeshEffectProps): react_jsx_runtime.JSX.Element;
646
+ onError?: (reason: PlayerErrorReason, e: unknown) => void;
647
+ onTimeUpdate?: (currentTime: number, duration: number) => void;
648
+ ariaLabel?: string;
649
+ enableKeyboardShortcuts?: boolean;
650
+ seekStartsPlayback?: boolean;
651
+ };
652
+ type PlayerHandle = {
653
+ audio: HTMLAudioElement;
654
+ play: () => Promise<void>;
655
+ pause: () => void;
656
+ seek: (seconds: number) => void;
657
+ getCurrentTime: () => number;
658
+ getDuration: () => number;
659
+ };
1052
660
 
1053
- /**
1054
- * LazyHybridAudioPlayer - Lazy-loaded full-featured audio player
1055
- *
1056
- * Automatically shows loading state while WaveSurfer loads (~200KB)
1057
- */
1058
- declare const LazyHybridAudioPlayer: React$1.ComponentType<HybridAudioPlayerProps>;
1059
- /**
1060
- * LazyHybridSimplePlayer - Lazy-loaded simple audio player
1061
- *
1062
- * Automatically shows loading state while WaveSurfer loads (~200KB)
1063
- */
1064
- declare const LazyHybridSimplePlayer: React$1.ComponentType<HybridSimplePlayerProps>;
1065
- /**
1066
- * LazyHybridCompactPlayer - Lazy-loaded compact single-row audio player
1067
- *
1068
- * Use in tight spaces: play/pause + waveform + timer in one line.
1069
- */
1070
- declare const LazyHybridCompactPlayer: React$1.ComponentType<HybridCompactPlayerProps>;
661
+ declare const LazyPlayer: React$1.ComponentType<PlayerProps>;
1071
662
 
1072
663
  /**
1073
664
  * Video source type definitions
@@ -2073,54 +1664,7 @@ declare function resolveStreamSource(source: SimpleStreamSource, context: VideoP
2073
1664
  */
2074
1665
  declare function resolveFileSource(options: ResolveFileSourceOptions): VideoSourceUnion | null;
2075
1666
 
2076
- interface HybridAudioContextValue {
2077
- state: HybridAudioState;
2078
- controls: HybridAudioControls;
2079
- webAudio: HybridWebAudioAPI;
2080
- audioLevels: AudioLevels;
2081
- audioRef: React.RefObject<HTMLAudioElement | null>;
2082
- }
2083
- interface HybridAudioProviderProps extends UseHybridAudioOptions {
2084
- children: ReactNode;
2085
- }
2086
- declare function HybridAudioProvider({ children, ...options }: HybridAudioProviderProps): react_jsx_runtime.JSX.Element;
2087
- /**
2088
- * Access full hybrid audio context
2089
- */
2090
- declare function useHybridAudioContext(): HybridAudioContextValue;
2091
- /**
2092
- * Access audio state only (read-only)
2093
- */
2094
- declare function useHybridAudioState(): HybridAudioState;
2095
- /**
2096
- * Access audio controls only (no state re-renders)
2097
- */
2098
- declare function useHybridAudioControls(): HybridAudioControls;
2099
- /**
2100
- * Access audio levels for reactive effects
2101
- */
2102
- declare function useHybridAudioLevels(): AudioLevels;
2103
- /**
2104
- * Access Web Audio API for custom visualizations
2105
- */
2106
- declare function useHybridWebAudio(): HybridWebAudioAPI;
2107
-
2108
- /**
2109
- * AudioPlayer types
2110
- */
2111
- interface EqualizerOptions {
2112
- barCount?: number;
2113
- height?: number;
2114
- gap?: number;
2115
- showPeaks?: boolean;
2116
- barColor?: string;
2117
- peakColor?: string;
2118
- }
2119
-
2120
- /**
2121
- * formatTime - Format seconds to mm:ss string
2122
- */
2123
- declare function formatTime(seconds: number): string;
1667
+ declare const Player: React$1.ForwardRefExoticComponent<PlayerProps & React$1.RefAttributes<PlayerHandle>>;
2124
1668
 
2125
1669
  declare function ImageViewer({ images, initialIndex, inDialog, }: ImageViewerProps): react_jsx_runtime.JSX.Element;
2126
1670
 
@@ -2817,4 +2361,4 @@ declare function useBlobUrlCleanup(key: string | null): void;
2817
2361
  */
2818
2362
  declare function generateContentKey(content: ArrayBuffer): string;
2819
2363
 
2820
- export { type ApiKey, ArrayFieldItemTemplate, ArrayFieldTemplate, type AspectRatioValue, type AudioLevels, AudioReactiveCover, type AudioReactiveCoverProps, BaseInputTemplate, type BlobSource, COLOR_SCHEMES, COLOR_SCHEME_INFO, CardLoadingFallback, CheckboxWidget, ColorWidget, type CreateLazyComponentOptions, type CreateVideoErrorFallbackOptions, CronScheduler, type CronSchedulerContextValue, type CronSchedulerProps, CronSchedulerProvider, type CronSchedulerState, CustomInput, type DASHSource, type DataUrlSource, DayChips, DiffEditor, type DiffEditorProps, EFFECT_ANIMATIONS, Editor, type EditorContextValue, type EditorFile, type EditorOptions, type EditorProps, EditorProvider, type EditorRef, type EffectColorScheme, type EffectColors, type EffectConfig$1 as EffectConfig, type EffectIntensity, type EffectLayer, type EffectVariant, type EqualizerOptions, type ErrorFallbackProps, ErrorListTemplate, FieldTemplate, GlowEffect, type GlowEffectData, type HLSSource, type HybridAudioContextValue, type HybridAudioControls, HybridAudioPlayer, type HybridAudioPlayerProps, HybridAudioProvider, type HybridAudioProviderProps, type HybridAudioState, type HybridCompactPlayerProps, HybridSimplePlayer, type HybridSimplePlayerProps, HybridWaveform, type HybridWaveformProps, type HybridWebAudioAPI, INTENSITY_CONFIG, INTENSITY_INFO, type ImageFile, ImageViewer, type ImageViewerProps, JsonSchemaForm, type JsonSchemaFormProps, JsonTreeComponent as JsonTree, type JsonTreeConfig, type JsonTreeProps, LazyCronScheduler, LazyHybridAudioPlayer, LazyHybridCompactPlayer, LazyHybridSimplePlayer, LazyImageViewer, LazyJsonSchemaForm, LazyJsonTree, LazyLottiePlayer, LazyMapContainer, LazyMapView, LazyMermaid, LazyOpenapiViewer, LazyPrettyCode, LazyVideoPlayer, LazyWrapper, type LazyWrapperProps, type LinkRule, LoadingFallback, type LoadingFallbackProps, type LottieDirection, LottiePlayer, type LottiePlayerProps, type LottieSize, type LottieSpeed, type MapContainerProps, MapLoadingFallback, type MapStyleKey, type MapViewport, MarkdownEditor, type MarkdownEditorProps, MarkdownMessage, type MarkdownMessageProps, type MarkerData, type MentionAttrs, type MentionConfig, type MentionItem, type MentionMarkdownRenderer, Mermaid, type MermaidProps, MeshEffect, type MonthDay, MonthDayGrid, NativeProvider, NumberWidget, ObjectFieldTemplate, Playground as OpenapiViewer, OrbsEffect, type PlayerMode, type PlaygroundConfig, type PlaygroundProps$1 as PlaygroundProps, PrettyCode, type PrettyCodeProps$1 as PrettyCodeProps, type ResolveFileSourceOptions, SchedulePreview, type ScheduleType, ScheduleTypeSelector, type SchemaSource, SelectWidget, type SimpleStreamSource, SliderWidget, Spinner, SpotlightEffect, StreamProvider, type StreamSource, SwitchWidget, TextWidget, TimeSelector, type UrlSource, type UseAudioBusReturn, type UseAudioVisualizationReturn, type UseCollapsibleContentOptions, type UseCollapsibleContentResult, type UseEditorReturn, type UseHybridAudioOptions, type UseHybridAudioReturn, type UseLottieOptions, type UseLottieReturn, type UseMonacoReturn, type UseVisualizationReturn, VARIANT_INFO, VideoControls, VideoErrorFallback, type VideoErrorFallbackProps, VideoPlayer, type VideoPlayerContextValue, type VideoPlayerProps, VideoPlayerProvider, type VideoPlayerProviderProps, type VideoPlayerRef, type VideoSourceUnion, VidstackProvider, type VimeoSource, type VisualizationColorScheme, type VisualizationIntensity, VisualizationProvider, type VisualizationProviderProps, type VisualizationSettings, type VisualizationVariant, type WeekDay, type YouTubeSource, buildCron, calculateGlowLayers, calculateMeshGradients, calculateOrbs, calculateSpotlight, createLazyComponent, createVideoErrorFallback, extractTextFromChildren, formatTime, generateContentKey, getColors, getEffectConfig, getRequiredFields, hasRequiredFields, humanizeCron, isSimpleStreamSource, isValidCron, mentionPresets, mergeDefaults, normalizeFormData, parseCron, prepareEffectColors, resolveFileSource, resolvePlayerMode, resolveStreamSource, safeJsonParse, safeJsonStringify, useAudioBus, useAudioBusStore, useAudioCache, useAudioVisualization, useBlobUrlCleanup, useCollapsibleContent, useCronCustom, useCronMonthDays, useCronPreview, useCronScheduler, useCronSchedulerContext, useCronTime, useCronType, useCronWeekDays, useEditor, useEditorContext, useHybridAudio, useHybridAudioAnalysis, useHybridAudioContext, useHybridAudioControls, useHybridAudioLevels, useHybridAudioState, useHybridWebAudio, useImageCache, useLanguage, useLottie, useMediaCacheStore, useMonaco, useVideoCache, useVideoPlayerContext, useVideoPlayerSettings, useVisualization, validateRequiredFields, validateSchema };
2364
+ export { type ApiKey, ArrayFieldItemTemplate, ArrayFieldTemplate, type AspectRatioValue, Player as AudioPlayer, type PlayerProps as AudioPlayerProps, BaseInputTemplate, type BlobSource, CardLoadingFallback, CheckboxWidget, ColorWidget, type CreateLazyComponentOptions, type CreateVideoErrorFallbackOptions, CronScheduler, type CronSchedulerContextValue, type CronSchedulerProps, CronSchedulerProvider, type CronSchedulerState, CustomInput, type DASHSource, type DataUrlSource, DayChips, DiffEditor, type DiffEditorProps, Editor, type EditorContextValue, type EditorFile, type EditorOptions, type EditorProps, EditorProvider, type EditorRef, type ErrorFallbackProps, ErrorListTemplate, FieldTemplate, type HLSSource, type ImageFile, ImageViewer, type ImageViewerProps, JsonSchemaForm, type JsonSchemaFormProps, JsonTreeComponent as JsonTree, type JsonTreeConfig, type JsonTreeProps, LazyPlayer as LazyAudioPlayer, LazyCronScheduler, LazyImageViewer, LazyJsonSchemaForm, LazyJsonTree, LazyLottiePlayer, LazyMapContainer, LazyMapView, LazyMermaid, LazyOpenapiViewer, LazyPrettyCode, LazyVideoPlayer, LazyWrapper, type LazyWrapperProps, type LinkRule, LoadingFallback, type LoadingFallbackProps, type LottieDirection, LottiePlayer, type LottiePlayerProps, type LottieSize, type LottieSpeed, type MapContainerProps, MapLoadingFallback, type MapStyleKey, type MapViewport, MarkdownEditor, type MarkdownEditorProps, MarkdownMessage, type MarkdownMessageProps, type MarkerData, type MentionAttrs, type MentionConfig, type MentionItem, type MentionMarkdownRenderer, Mermaid, type MermaidProps, type MonthDay, MonthDayGrid, NativeProvider, NumberWidget, ObjectFieldTemplate, Playground as OpenapiViewer, type PlayerMode, type PlaygroundConfig, type PlaygroundProps$1 as PlaygroundProps, PrettyCode, type PrettyCodeProps$1 as PrettyCodeProps, type ResolveFileSourceOptions, SchedulePreview, type ScheduleType, ScheduleTypeSelector, type SchemaSource, SelectWidget, type SimpleStreamSource, SliderWidget, Spinner, StreamProvider, type StreamSource, SwitchWidget, TextWidget, TimeSelector, type UrlSource, type UseCollapsibleContentOptions, type UseCollapsibleContentResult, type UseEditorReturn, type UseLottieOptions, type UseLottieReturn, type UseMonacoReturn, VideoControls, VideoErrorFallback, type VideoErrorFallbackProps, VideoPlayer, type VideoPlayerContextValue, type VideoPlayerProps, VideoPlayerProvider, type VideoPlayerProviderProps, type VideoPlayerRef, type VideoSourceUnion, VidstackProvider, type VimeoSource, type WeekDay, type YouTubeSource, buildCron, createLazyComponent, createVideoErrorFallback, extractTextFromChildren, generateContentKey, getRequiredFields, hasRequiredFields, humanizeCron, isSimpleStreamSource, isValidCron, mentionPresets, mergeDefaults, normalizeFormData, parseCron, resolveFileSource, resolvePlayerMode, resolveStreamSource, safeJsonParse, safeJsonStringify, useAudioCache, useBlobUrlCleanup, useCollapsibleContent, useCronCustom, useCronMonthDays, useCronPreview, useCronScheduler, useCronSchedulerContext, useCronTime, useCronType, useCronWeekDays, useEditor, useEditorContext, useImageCache, useLanguage, useLottie, useMediaCacheStore, useMonaco, useVideoCache, useVideoPlayerContext, useVideoPlayerSettings, validateRequiredFields, validateSchema };