mirror of
https://github.com/Psychotoxical/psysonic.git
synced 2026-07-22 07:15:47 +00:00
ImAsra
ae2e123a14
* feat: add long press to shuffle with a wave animation to singnify how long to press * refactor: long-press shuffle cleanup Follow-up on the long-press shuffle PR: shared hook/overlay, playback parity, pointer events, broader surface coverage, locales, and tests. * docs: credit ImAsra for long-press album shuffle (PR #888) Add CHANGELOG entry and Settings credits for the hold-to-shuffle play interaction shipped in Psychotoxical/psysonic#888. * fix: restore playAlbumShuffled and long-press hook wiring The follow-up merge dropped playAlbumShuffled and reverted the shared long-press hook in album play buttons, breaking tsc and vitest on PR #888. --------- Co-authored-by: cucadmuh <49571317+cucadmuh@users.noreply.github.com>
21 lines
751 B
TypeScript
21 lines
751 B
TypeScript
interface LongPressWaveOverlayProps {
|
|
active: boolean;
|
|
/** Smaller crest/fill tuned for dense album-card play buttons. */
|
|
size?: 'default' | 'compact';
|
|
}
|
|
|
|
export function LongPressWaveOverlay({ active, size = 'default' }: LongPressWaveOverlayProps) {
|
|
const compact = size === 'compact';
|
|
return (
|
|
<div
|
|
className={`long-press-wave${active ? ' long-press-wave--active' : ''}${compact ? ' long-press-wave--compact' : ''}`}
|
|
aria-hidden="true"
|
|
>
|
|
<svg className="long-press-wave__crest" viewBox="0 0 200 20" preserveAspectRatio="none">
|
|
<path d="M0,10 Q25,18 50,10 T100,10 Q125,18 150,10 T200,10 L200,20 L0,20 Z" fill="currentColor" />
|
|
</svg>
|
|
<div className="long-press-wave__fill" />
|
|
</div>
|
|
);
|
|
}
|