@waveform-playlist/ui-components 9.2.0 → 9.2.1
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/index.d.mts +7 -2
- package/dist/index.d.ts +7 -2
- package/dist/index.js +4 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +4 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +4 -4
package/dist/index.d.mts
CHANGED
|
@@ -702,10 +702,12 @@ interface TrackMenuProps {
|
|
|
702
702
|
declare const TrackMenu: react__default.FC<TrackMenuProps>;
|
|
703
703
|
|
|
704
704
|
type SnapTo = 'bar' | 'beat' | 'off';
|
|
705
|
+
type ScaleMode = 'beats' | 'temporal';
|
|
705
706
|
interface BeatsAndBarsContextValue {
|
|
706
707
|
bpm: number;
|
|
707
708
|
timeSignature: [number, number];
|
|
708
709
|
snapTo: SnapTo;
|
|
710
|
+
scaleMode: ScaleMode;
|
|
709
711
|
ticksPerBeat: number;
|
|
710
712
|
ticksPerBar: number;
|
|
711
713
|
}
|
|
@@ -713,9 +715,12 @@ interface BeatsAndBarsProviderProps {
|
|
|
713
715
|
bpm: number;
|
|
714
716
|
timeSignature: [number, number];
|
|
715
717
|
snapTo: SnapTo;
|
|
718
|
+
/** Which timescale to render. Defaults to `'beats'`. Set to `'temporal'` to
|
|
719
|
+
* show minutes:seconds while keeping snap-to-grid active. */
|
|
720
|
+
scaleMode?: ScaleMode;
|
|
716
721
|
children: react__default.ReactNode;
|
|
717
722
|
}
|
|
718
|
-
declare function BeatsAndBarsProvider({ bpm, timeSignature, snapTo, children, }: BeatsAndBarsProviderProps): react_jsx_runtime.JSX.Element;
|
|
723
|
+
declare function BeatsAndBarsProvider({ bpm, timeSignature, snapTo, scaleMode, children, }: BeatsAndBarsProviderProps): react_jsx_runtime.JSX.Element;
|
|
719
724
|
declare function useBeatsAndBars(): BeatsAndBarsContextValue | null;
|
|
720
725
|
|
|
721
726
|
type Props$1 = {
|
|
@@ -912,4 +917,4 @@ declare const BaseSlider: styled_components_dist_types.IStyledComponentBase<"web
|
|
|
912
917
|
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;
|
|
913
918
|
}>, never>, never>> & string;
|
|
914
919
|
|
|
915
|
-
export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseInputSmall, BaseLabel, BaseSelect, BaseSelectSmall, BaseSlider, type BeatsAndBarsContextValue, BeatsAndBarsProvider, type BeatsAndBarsProviderProps, 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, ClipViewportOriginProvider, CloseButton, Controls$1 as Controls, DevicePixelRatioProvider, DotsIcon, type DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, PianoRollChannel, type PianoRollChannelProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistErrorBoundary, type PlaylistErrorBoundaryProps, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type PrecomputedTickData, type RenderPlayheadFunction, ScreenReaderOnly, type ScrollViewport, ScrollViewportProvider, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, type SmartScaleProps, type SnapTo, 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, getScaleInfo, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useBeatsAndBars, useClipViewportOrigin, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useScrollViewport, useScrollViewportSelector, useTheme, useTrackControls, useVisibleChunkIndices, waveformColorToCss };
|
|
920
|
+
export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseInputSmall, BaseLabel, BaseSelect, BaseSelectSmall, BaseSlider, type BeatsAndBarsContextValue, BeatsAndBarsProvider, type BeatsAndBarsProviderProps, 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, ClipViewportOriginProvider, CloseButton, Controls$1 as Controls, DevicePixelRatioProvider, DotsIcon, type DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, PianoRollChannel, type PianoRollChannelProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistErrorBoundary, type PlaylistErrorBoundaryProps, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type PrecomputedTickData, type RenderPlayheadFunction, type ScaleMode, ScreenReaderOnly, type ScrollViewport, ScrollViewportProvider, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, type SmartScaleProps, type SnapTo, 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, getScaleInfo, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useBeatsAndBars, useClipViewportOrigin, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useScrollViewport, useScrollViewportSelector, useTheme, useTrackControls, useVisibleChunkIndices, waveformColorToCss };
|
package/dist/index.d.ts
CHANGED
|
@@ -702,10 +702,12 @@ interface TrackMenuProps {
|
|
|
702
702
|
declare const TrackMenu: react__default.FC<TrackMenuProps>;
|
|
703
703
|
|
|
704
704
|
type SnapTo = 'bar' | 'beat' | 'off';
|
|
705
|
+
type ScaleMode = 'beats' | 'temporal';
|
|
705
706
|
interface BeatsAndBarsContextValue {
|
|
706
707
|
bpm: number;
|
|
707
708
|
timeSignature: [number, number];
|
|
708
709
|
snapTo: SnapTo;
|
|
710
|
+
scaleMode: ScaleMode;
|
|
709
711
|
ticksPerBeat: number;
|
|
710
712
|
ticksPerBar: number;
|
|
711
713
|
}
|
|
@@ -713,9 +715,12 @@ interface BeatsAndBarsProviderProps {
|
|
|
713
715
|
bpm: number;
|
|
714
716
|
timeSignature: [number, number];
|
|
715
717
|
snapTo: SnapTo;
|
|
718
|
+
/** Which timescale to render. Defaults to `'beats'`. Set to `'temporal'` to
|
|
719
|
+
* show minutes:seconds while keeping snap-to-grid active. */
|
|
720
|
+
scaleMode?: ScaleMode;
|
|
716
721
|
children: react__default.ReactNode;
|
|
717
722
|
}
|
|
718
|
-
declare function BeatsAndBarsProvider({ bpm, timeSignature, snapTo, children, }: BeatsAndBarsProviderProps): react_jsx_runtime.JSX.Element;
|
|
723
|
+
declare function BeatsAndBarsProvider({ bpm, timeSignature, snapTo, scaleMode, children, }: BeatsAndBarsProviderProps): react_jsx_runtime.JSX.Element;
|
|
719
724
|
declare function useBeatsAndBars(): BeatsAndBarsContextValue | null;
|
|
720
725
|
|
|
721
726
|
type Props$1 = {
|
|
@@ -912,4 +917,4 @@ declare const BaseSlider: styled_components_dist_types.IStyledComponentBase<"web
|
|
|
912
917
|
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;
|
|
913
918
|
}>, never>, never>> & string;
|
|
914
919
|
|
|
915
|
-
export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseInputSmall, BaseLabel, BaseSelect, BaseSelectSmall, BaseSlider, type BeatsAndBarsContextValue, BeatsAndBarsProvider, type BeatsAndBarsProviderProps, 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, ClipViewportOriginProvider, CloseButton, Controls$1 as Controls, DevicePixelRatioProvider, DotsIcon, type DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, PianoRollChannel, type PianoRollChannelProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistErrorBoundary, type PlaylistErrorBoundaryProps, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type PrecomputedTickData, type RenderPlayheadFunction, ScreenReaderOnly, type ScrollViewport, ScrollViewportProvider, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, type SmartScaleProps, type SnapTo, 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, getScaleInfo, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useBeatsAndBars, useClipViewportOrigin, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useScrollViewport, useScrollViewportSelector, useTheme, useTrackControls, useVisibleChunkIndices, waveformColorToCss };
|
|
920
|
+
export { AudioPosition, type AudioPositionProps, AutomaticScrollCheckbox, type AutomaticScrollCheckboxProps, BaseButton, BaseCheckbox, BaseCheckboxLabel, BaseCheckboxWrapper, BaseControlButton, BaseInput, BaseInputSmall, BaseLabel, BaseSelect, BaseSelectSmall, BaseSlider, type BeatsAndBarsContextValue, BeatsAndBarsProvider, type BeatsAndBarsProviderProps, 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, ClipViewportOriginProvider, CloseButton, Controls$1 as Controls, DevicePixelRatioProvider, DotsIcon, type DragHandleProps, FadeOverlay, type FadeOverlayProps, type GradientStop, Header, InlineLabel, LoopRegion, LoopRegionMarkers, type LoopRegionMarkersProps, type LoopRegionProps, MasterVolumeControl, type MasterVolumeControlProps, PianoRollChannel, type PianoRollChannelProps, Playhead, type PlayheadProps, PlayheadWithMarker, Playlist, PlaylistErrorBoundary, type PlaylistErrorBoundaryProps, PlaylistInfoContext, type PlaylistProps, PlayoutProvider, type PrecomputedTickData, type RenderPlayheadFunction, type ScaleMode, ScreenReaderOnly, type ScrollViewport, ScrollViewportProvider, Selection, type SelectionProps, SelectionTimeInputs, type SelectionTimeInputsProps, Slider, SliderWrapper, SmartChannel, type SmartChannelProps, SmartScale, type SmartScaleProps, type SnapTo, 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, getScaleInfo, isWaveformGradient, parseTime, pixelsToSamples, pixelsToSeconds, samplesToPixels, samplesToSeconds, secondsToPixels, secondsToSamples, useBeatsAndBars, useClipViewportOrigin, useDevicePixelRatio, usePlaylistInfo, usePlayoutStatus, usePlayoutStatusUpdate, useScrollViewport, useScrollViewportSelector, useTheme, useTrackControls, useVisibleChunkIndices, waveformColorToCss };
|
package/dist/index.js
CHANGED
|
@@ -2298,6 +2298,7 @@ function BeatsAndBarsProvider({
|
|
|
2298
2298
|
bpm,
|
|
2299
2299
|
timeSignature,
|
|
2300
2300
|
snapTo,
|
|
2301
|
+
scaleMode = "beats",
|
|
2301
2302
|
children
|
|
2302
2303
|
}) {
|
|
2303
2304
|
const [numerator, denominator] = timeSignature;
|
|
@@ -2309,10 +2310,11 @@ function BeatsAndBarsProvider({
|
|
|
2309
2310
|
bpm,
|
|
2310
2311
|
timeSignature: ts,
|
|
2311
2312
|
snapTo,
|
|
2313
|
+
scaleMode,
|
|
2312
2314
|
ticksPerBeat: tpBeat,
|
|
2313
2315
|
ticksPerBar: tpBar
|
|
2314
2316
|
};
|
|
2315
|
-
}, [bpm, numerator, denominator, snapTo]);
|
|
2317
|
+
}, [bpm, numerator, denominator, snapTo, scaleMode]);
|
|
2316
2318
|
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(BeatsAndBarsContext.Provider, { value, children });
|
|
2317
2319
|
}
|
|
2318
2320
|
function useBeatsAndBars() {
|
|
@@ -3047,7 +3049,7 @@ var SmartScale = ({ renderTick }) => {
|
|
|
3047
3049
|
const beatsAndBars = useBeatsAndBars();
|
|
3048
3050
|
const tickData = (0, import_react23.useMemo)(() => {
|
|
3049
3051
|
const widthX = (0, import_core7.secondsToPixels)(duration / 1e3, samplesPerPixel, sampleRate);
|
|
3050
|
-
if (beatsAndBars) {
|
|
3052
|
+
if (beatsAndBars && beatsAndBars.scaleMode === "beats") {
|
|
3051
3053
|
const { bpm, timeSignature, ticksPerBar: tpBar, ticksPerBeat: tpBeat } = beatsAndBars;
|
|
3052
3054
|
const canvasInfo2 = /* @__PURE__ */ new Map();
|
|
3053
3055
|
const timeMarkersWithPositions2 = [];
|