@waveform-playlist/ui-components 5.2.0 → 5.3.0

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import react__default, { FunctionComponent, ReactNode, Dispatch, SetStateAction } from 'react';
 import { Peaks, Bits } from '@waveform-playlist/webaudio-peaks';
-import { Fade, FadeType } from '@waveform-playlist/core';
+import { Fade, FadeType, SpectrogramData, RenderMode } from '@waveform-playlist/core';
 import { DraggableAttributes } from '@dnd-kit/core';
 import { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
 import * as styled_components_dist_utils_hoist from 'styled-components/dist/utils/hoist';
@@ -415,6 +415,40 @@ interface SelectionTimeInputsProps {
 }
 declare const SelectionTimeInputs: react__default.FC<SelectionTimeInputsProps>;
 
+interface SpectrogramWorkerCanvasApi {
+    registerCanvas(canvasId: string, canvas: OffscreenCanvas): void;
+    unregisterCanvas(canvasId: string): void;
+}
+interface SpectrogramChannelProps {
+    /** Channel index (0 = first, 1 = second, etc.) */
+    index: number;
+    /** Computed spectrogram data (not needed when workerApi is provided) */
+    data?: SpectrogramData;
+    /** Width in CSS pixels */
+    length: number;
+    /** Height in CSS pixels */
+    waveHeight: number;
+    /** Device pixel ratio for sharp rendering */
+    devicePixelRatio?: number;
+    /** Samples per pixel at current zoom level */
+    samplesPerPixel: number;
+    /** 256-entry RGB LUT (768 bytes) from getColorMap() */
+    colorLUT?: Uint8Array;
+    /** Frequency scale function: (freqHz, minF, maxF) => [0,1] */
+    frequencyScaleFn?: (f: number, minF: number, maxF: number) => number;
+    /** Min frequency in Hz */
+    minFrequency?: number;
+    /** Max frequency in Hz (defaults to sampleRate/2) */
+    maxFrequency?: number;
+    /** Worker API for transferring canvas ownership. When provided, rendering is done in the worker. */
+    workerApi?: SpectrogramWorkerCanvasApi;
+    /** Clip ID used to construct unique canvas IDs for worker registration */
+    clipId?: string;
+    /** Callback when canvases are registered with the worker, providing canvas IDs and widths */
+    onCanvasesReady?: (canvasIds: string[], canvasWidths: number[]) => void;
+}
+declare const SpectrogramChannel: FunctionComponent<SpectrogramChannelProps>;
+
 interface SmartChannelProps {
     className?: string;
     index: number;
@@ -424,10 +458,55 @@ interface SmartChannelProps {
     isSelected?: boolean;
     /** If true, background is transparent (for use with external progress overlay) */
     transparentBackground?: boolean;
+    /** Render mode: waveform, spectrogram, or both */
+    renderMode?: RenderMode;
+    /** Spectrogram data for this channel */
+    spectrogramData?: SpectrogramData;
+    /** 256-entry RGB LUT from getColorMap() */
+    spectrogramColorLUT?: Uint8Array;
+    /** Samples per pixel at current zoom level */
+    samplesPerPixel?: number;
+    /** Frequency scale function */
+    spectrogramFrequencyScaleFn?: (f: number, minF: number, maxF: number) => number;
+    /** Min frequency in Hz */
+    spectrogramMinFrequency?: number;
+    /** Max frequency in Hz */
+    spectrogramMaxFrequency?: number;
+    /** Worker API for OffscreenCanvas transfer */
+    spectrogramWorkerApi?: SpectrogramWorkerCanvasApi;
+    /** Clip ID for worker canvas registration */
+    spectrogramClipId?: string;
+    /** Callback when canvases are registered with the worker */
+    spectrogramOnCanvasesReady?: (canvasIds: string[], canvasWidths: number[]) => void;
 }
 declare const SmartChannel: FunctionComponent<SmartChannelProps>;
 
-declare const SmartScale: FunctionComponent;
+interface SpectrogramLabelsProps {
+    /** Height per channel in CSS pixels */
+    waveHeight: number;
+    /** Number of audio channels */
+    numChannels: number;
+    /** Frequency scale function */
+    frequencyScaleFn: (f: number, minF: number, maxF: number) => number;
+    /** Min frequency in Hz */
+    minFrequency: number;
+    /** Max frequency in Hz */
+    maxFrequency: number;
+    /** Label text color */
+    labelsColor?: string;
+    /** Label background color */
+    labelsBackground?: string;
+    /** Render mode — in "both" mode spectrogram is half height */
+    renderMode?: 'spectrogram' | 'both';
+    /** Whether clip headers are shown (adds offset) */
+    hasClipHeaders?: boolean;
+}
+declare const SpectrogramLabels: react__default.FC<SpectrogramLabelsProps>;
+
+interface SmartScaleProps {
+    readonly renderTimestamp?: (timeMs: number, pixelPosition: number) => ReactNode;
+}
+declare const SmartScale: FunctionComponent<SmartScaleProps>;
 
 /**
  * Time format utilities for displaying and parsing audio timestamps
@@ -516,6 +595,12 @@ declare const Button: styled_components_dist_types.IStyledComponentBase<"web", s
 
 declare const ButtonGroup: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 
+interface CloseButtonProps {
+    onClick: (e: react__default.MouseEvent) => void;
+    title?: string;
+}
+declare const CloseButton: react__default.FC<CloseButtonProps>;
+
 declare const Controls$1: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 
 declare const Header: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
@@ -526,6 +611,8 @@ declare const VolumeUpIcon: react__default.FC<IconProps>;
 
 declare const TrashIcon: react__default.FC<IconProps>;
 
+declare const DotsIcon: react__default.FC<IconProps>;
+
 /**
  * TrackControls Slider - Compact slider for volume/pan controls
  *
@@ -539,47 +626,15 @@ declare const Slider: styled_components_dist_types.IStyledComponentBase<"web", s
 
 declare const SliderWrapper: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
 
-/**
- * Track Controls with Delete Button
- *
- * Reusable track controls component that includes standard controls
- * (mute, solo, volume, pan) plus a delete button
- */
-
-interface TrackControlsWithDeleteProps {
-    trackIndex: number;
-    trackName: string;
-    muted: boolean;
-    soloed: boolean;
-    volume: number;
-    pan: number;
-    onMuteChange: (muted: boolean) => void;
-    onSoloChange: (soloed: boolean) => void;
-    onVolumeChange: (volume: number) => void;
-    onPanChange: (pan: number) => void;
-    onDelete: () => void;
+interface TrackMenuItem {
+    id: string;
+    label?: string;
+    content: ReactNode;
 }
-/**
- * Track controls with delete button
- *
- * @example
- * ```tsx
- * <TrackControlsWithDelete
- *   trackIndex={0}
- *   trackName="Track 1"
- *   muted={false}
- *   soloed={false}
- *   volume={1.0}
- *   pan={0}
- *   onMuteChange={(muted) => console.log('mute:', muted)}
- *   onSoloChange={(soloed) => console.log('solo:', soloed)}
- *   onVolumeChange={(volume) => console.log('volume:', volume)}
- *   onPanChange={(pan) => console.log('pan:', pan)}
- *   onDelete={() => console.log('delete')}
- * />
- * ```
- */
-declare const TrackControlsWithDelete: react__default.FC<TrackControlsWithDeleteProps>;
+interface TrackMenuProps {
+    items: TrackMenuItem[] | ((onClose: () => void) => TrackMenuItem[]);
+}
+declare const TrackMenu: react__default.FC<TrackMenuProps>;
 
 type Props$1 = {
     children: ReactNode;
@@ -709,4 +764,4 @@ declare const BaseSlider: styled_components_dist_types.IStyledComponentBase<"web
     ref?: ((instance: HTMLInputElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLInputElement> | null | undefined;
 }>, never>, never>> & string;
 
-export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseLabel, BaseSelect, BaseSlider, Button, ButtonGroup, CLIP_BOUNDARY_WIDTH, CLIP_BOUNDARY_WIDTH_TOUCH, CLIP_HEADER_HEIGHT, Channel, type ChannelProps, Clip, ClipBoundary, type ClipBoundaryProps, ClipHeader, ClipHeaderPresentational, type ClipHeaderPresentationalProps, type ClipHeaderProps, type ClipProps, Controls$1 as Controls, type ControlsWrapperProps, DevicePixelRatioProvider, type DragHandleProps$1 as DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type RenderPlayheadFunction, ScreenReaderOnly, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, StyledPlaylist, StyledTimeScale, type TimeFormat, TimeFormatSelect, type TimeFormatSelectProps, TimeInput, type TimeInputProps, TimeScale, type TimeScaleProps, TimescaleLoopRegion, type TimescaleLoopRegionProps, Track, TrackControlsContext, TrackControlsWithDelete, type TrackControlsWithDeleteProps, type TrackProps, TrashIcon, VolumeDownIcon, VolumeUpIcon, type WaveformColor, type WaveformDrawMode, type WaveformGradient, type WaveformPlaylistTheme, darkTheme, defaultTheme, formatTime, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useTheme, useTrackControls, waveformColorToCss };
+export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseLabel, BaseSelect, BaseSlider, Button, ButtonGroup, CLIP_BOUNDARY_WIDTH, CLIP_BOUNDARY_WIDTH_TOUCH, CLIP_HEADER_HEIGHT, Channel, type ChannelProps, Clip, ClipBoundary, type ClipBoundaryProps, ClipHeader, ClipHeaderPresentational, type ClipHeaderPresentationalProps, type ClipHeaderProps, type ClipProps, CloseButton, Controls$1 as Controls, type ControlsWrapperProps, DevicePixelRatioProvider, DotsIcon, type DragHandleProps$1 as DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type RenderPlayheadFunction, ScreenReaderOnly, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, type SmartScaleProps, SpectrogramChannel, type SpectrogramChannelProps, SpectrogramLabels, type SpectrogramLabelsProps, type SpectrogramWorkerCanvasApi, StyledPlaylist, StyledTimeScale, type TimeFormat, TimeFormatSelect, type TimeFormatSelectProps, TimeInput, type TimeInputProps, TimeScale, type TimeScaleProps, TimescaleLoopRegion, type TimescaleLoopRegionProps, Track, TrackControlsContext, TrackMenu, type TrackMenuItem, type TrackMenuProps, type TrackProps, TrashIcon, VolumeDownIcon, VolumeUpIcon, type WaveformColor, type WaveformDrawMode, type WaveformGradient, type WaveformPlaylistTheme, darkTheme, defaultTheme, formatTime, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useTheme, useTrackControls, waveformColorToCss };

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import react__default, { FunctionComponent, ReactNode, Dispatch, SetStateAction } from 'react';
 import { Peaks, Bits } from '@waveform-playlist/webaudio-peaks';
-import { Fade, FadeType } from '@waveform-playlist/core';
+import { Fade, FadeType, SpectrogramData, RenderMode } from '@waveform-playlist/core';
 import { DraggableAttributes } from '@dnd-kit/core';
 import { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
 import * as styled_components_dist_utils_hoist from 'styled-components/dist/utils/hoist';
@@ -415,6 +415,40 @@ interface SelectionTimeInputsProps {
 }
 declare const SelectionTimeInputs: react__default.FC<SelectionTimeInputsProps>;
 
+interface SpectrogramWorkerCanvasApi {
+    registerCanvas(canvasId: string, canvas: OffscreenCanvas): void;
+    unregisterCanvas(canvasId: string): void;
+}
+interface SpectrogramChannelProps {
+    /** Channel index (0 = first, 1 = second, etc.) */
+    index: number;
+    /** Computed spectrogram data (not needed when workerApi is provided) */
+    data?: SpectrogramData;
+    /** Width in CSS pixels */
+    length: number;
+    /** Height in CSS pixels */
+    waveHeight: number;
+    /** Device pixel ratio for sharp rendering */
+    devicePixelRatio?: number;
+    /** Samples per pixel at current zoom level */
+    samplesPerPixel: number;
+    /** 256-entry RGB LUT (768 bytes) from getColorMap() */
+    colorLUT?: Uint8Array;
+    /** Frequency scale function: (freqHz, minF, maxF) => [0,1] */
+    frequencyScaleFn?: (f: number, minF: number, maxF: number) => number;
+    /** Min frequency in Hz */
+    minFrequency?: number;
+    /** Max frequency in Hz (defaults to sampleRate/2) */
+    maxFrequency?: number;
+    /** Worker API for transferring canvas ownership. When provided, rendering is done in the worker. */
+    workerApi?: SpectrogramWorkerCanvasApi;
+    /** Clip ID used to construct unique canvas IDs for worker registration */
+    clipId?: string;
+    /** Callback when canvases are registered with the worker, providing canvas IDs and widths */
+    onCanvasesReady?: (canvasIds: string[], canvasWidths: number[]) => void;
+}
+declare const SpectrogramChannel: FunctionComponent<SpectrogramChannelProps>;
+
 interface SmartChannelProps {
     className?: string;
     index: number;
@@ -424,10 +458,55 @@ interface SmartChannelProps {
     isSelected?: boolean;
     /** If true, background is transparent (for use with external progress overlay) */
     transparentBackground?: boolean;
+    /** Render mode: waveform, spectrogram, or both */
+    renderMode?: RenderMode;
+    /** Spectrogram data for this channel */
+    spectrogramData?: SpectrogramData;
+    /** 256-entry RGB LUT from getColorMap() */
+    spectrogramColorLUT?: Uint8Array;
+    /** Samples per pixel at current zoom level */
+    samplesPerPixel?: number;
+    /** Frequency scale function */
+    spectrogramFrequencyScaleFn?: (f: number, minF: number, maxF: number) => number;
+    /** Min frequency in Hz */
+    spectrogramMinFrequency?: number;
+    /** Max frequency in Hz */
+    spectrogramMaxFrequency?: number;
+    /** Worker API for OffscreenCanvas transfer */
+    spectrogramWorkerApi?: SpectrogramWorkerCanvasApi;
+    /** Clip ID for worker canvas registration */
+    spectrogramClipId?: string;
+    /** Callback when canvases are registered with the worker */
+    spectrogramOnCanvasesReady?: (canvasIds: string[], canvasWidths: number[]) => void;
 }
 declare const SmartChannel: FunctionComponent<SmartChannelProps>;
 
-declare const SmartScale: FunctionComponent;
+interface SpectrogramLabelsProps {
+    /** Height per channel in CSS pixels */
+    waveHeight: number;
+    /** Number of audio channels */
+    numChannels: number;
+    /** Frequency scale function */
+    frequencyScaleFn: (f: number, minF: number, maxF: number) => number;
+    /** Min frequency in Hz */
+    minFrequency: number;
+    /** Max frequency in Hz */
+    maxFrequency: number;
+    /** Label text color */
+    labelsColor?: string;
+    /** Label background color */
+    labelsBackground?: string;
+    /** Render mode — in "both" mode spectrogram is half height */
+    renderMode?: 'spectrogram' | 'both';
+    /** Whether clip headers are shown (adds offset) */
+    hasClipHeaders?: boolean;
+}
+declare const SpectrogramLabels: react__default.FC<SpectrogramLabelsProps>;
+
+interface SmartScaleProps {
+    readonly renderTimestamp?: (timeMs: number, pixelPosition: number) => ReactNode;
+}
+declare const SmartScale: FunctionComponent<SmartScaleProps>;
 
 /**
  * Time format utilities for displaying and parsing audio timestamps
@@ -516,6 +595,12 @@ declare const Button: styled_components_dist_types.IStyledComponentBase<"web", s
 
 declare const ButtonGroup: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 
+interface CloseButtonProps {
+    onClick: (e: react__default.MouseEvent) => void;
+    title?: string;
+}
+declare const CloseButton: react__default.FC<CloseButtonProps>;
+
 declare const Controls$1: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 
 declare const Header: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
@@ -526,6 +611,8 @@ declare const VolumeUpIcon: react__default.FC<IconProps>;
 
 declare const TrashIcon: react__default.FC<IconProps>;
 
+declare const DotsIcon: react__default.FC<IconProps>;
+
 /**
  * TrackControls Slider - Compact slider for volume/pan controls
  *
@@ -539,47 +626,15 @@ declare const Slider: styled_components_dist_types.IStyledComponentBase<"web", s
 
 declare const SliderWrapper: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
 
-/**
- * Track Controls with Delete Button
- *
- * Reusable track controls component that includes standard controls
- * (mute, solo, volume, pan) plus a delete button
- */
-
-interface TrackControlsWithDeleteProps {
-    trackIndex: number;
-    trackName: string;
-    muted: boolean;
-    soloed: boolean;
-    volume: number;
-    pan: number;
-    onMuteChange: (muted: boolean) => void;
-    onSoloChange: (soloed: boolean) => void;
-    onVolumeChange: (volume: number) => void;
-    onPanChange: (pan: number) => void;
-    onDelete: () => void;
+interface TrackMenuItem {
+    id: string;
+    label?: string;
+    content: ReactNode;
 }
-/**
- * Track controls with delete button
- *
- * @example
- * ```tsx
- * <TrackControlsWithDelete
- *   trackIndex={0}
- *   trackName="Track 1"
- *   muted={false}
- *   soloed={false}
- *   volume={1.0}
- *   pan={0}
- *   onMuteChange={(muted) => console.log('mute:', muted)}
- *   onSoloChange={(soloed) => console.log('solo:', soloed)}
- *   onVolumeChange={(volume) => console.log('volume:', volume)}
- *   onPanChange={(pan) => console.log('pan:', pan)}
- *   onDelete={() => console.log('delete')}
- * />
- * ```
- */
-declare const TrackControlsWithDelete: react__default.FC<TrackControlsWithDeleteProps>;
+interface TrackMenuProps {
+    items: TrackMenuItem[] | ((onClose: () => void) => TrackMenuItem[]);
+}
+declare const TrackMenu: react__default.FC<TrackMenuProps>;
 
 type Props$1 = {
     children: ReactNode;
@@ -709,4 +764,4 @@ declare const BaseSlider: styled_components_dist_types.IStyledComponentBase<"web
     ref?: ((instance: HTMLInputElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLInputElement> | null | undefined;
 }>, never>, never>> & string;
 
-export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseLabel, BaseSelect, BaseSlider, Button, ButtonGroup, CLIP_BOUNDARY_WIDTH, CLIP_BOUNDARY_WIDTH_TOUCH, CLIP_HEADER_HEIGHT, Channel, type ChannelProps, Clip, ClipBoundary, type ClipBoundaryProps, ClipHeader, ClipHeaderPresentational, type ClipHeaderPresentationalProps, type ClipHeaderProps, type ClipProps, Controls$1 as Controls, type ControlsWrapperProps, DevicePixelRatioProvider, type DragHandleProps$1 as DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type RenderPlayheadFunction, ScreenReaderOnly, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, StyledPlaylist, StyledTimeScale, type TimeFormat, TimeFormatSelect, type TimeFormatSelectProps, TimeInput, type TimeInputProps, TimeScale, type TimeScaleProps, TimescaleLoopRegion, type TimescaleLoopRegionProps, Track, TrackControlsContext, TrackControlsWithDelete, type TrackControlsWithDeleteProps, type TrackProps, TrashIcon, VolumeDownIcon, VolumeUpIcon, type WaveformColor, type WaveformDrawMode, type WaveformGradient, type WaveformPlaylistTheme, darkTheme, defaultTheme, formatTime, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useTheme, useTrackControls, waveformColorToCss };
+export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseLabel, BaseSelect, BaseSlider, Button, ButtonGroup, CLIP_BOUNDARY_WIDTH, CLIP_BOUNDARY_WIDTH_TOUCH, CLIP_HEADER_HEIGHT, Channel, type ChannelProps, Clip, ClipBoundary, type ClipBoundaryProps, ClipHeader, ClipHeaderPresentational, type ClipHeaderPresentationalProps, type ClipHeaderProps, type ClipProps, CloseButton, Controls$1 as Controls, type ControlsWrapperProps, DevicePixelRatioProvider, DotsIcon, type DragHandleProps$1 as DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type RenderPlayheadFunction, ScreenReaderOnly, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, type SmartScaleProps, SpectrogramChannel, type SpectrogramChannelProps, SpectrogramLabels, type SpectrogramLabelsProps, type SpectrogramWorkerCanvasApi, StyledPlaylist, StyledTimeScale, type TimeFormat, TimeFormatSelect, type TimeFormatSelectProps, TimeInput, type TimeInputProps, TimeScale, type TimeScaleProps, TimescaleLoopRegion, type TimescaleLoopRegionProps, Track, TrackControlsContext, TrackMenu, type TrackMenuItem, type TrackMenuProps, type TrackProps, TrashIcon, VolumeDownIcon, VolumeUpIcon, type WaveformColor, type WaveformDrawMode, type WaveformGradient, type WaveformPlaylistTheme, darkTheme, defaultTheme, formatTime, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useTheme, useTrackControls, waveformColorToCss };