@wordpress/block-library 10.1.0 → 10.2.0

package/build-module/playlist/edit.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/playlist/edit.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { v4 as uuid } from 'uuid';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect } from '@wordpress/element';\nimport {\n\tstore as blockEditorStore,\n\tMediaPlaceholder,\n\tMediaReplaceFlow,\n\tBlockIcon,\n\tuseBlockProps,\n\tuseInnerBlocksProps,\n\tBlockControls,\n\tInspectorControls,\n\tInnerBlocks,\n} from '@wordpress/block-editor';\nimport {\n\tToggleControl,\n\tDisabled,\n\tSelectControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { __ } from '@wordpress/i18n';\nimport { audio as icon } from '@wordpress/icons';\nimport { createBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { Caption } from '../utils/caption';\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\nimport { WaveformPlayer } from '../utils/waveform-player';\nimport { getTrackAttributes } from './utils';\n\nconst ALLOWED_MEDIA_TYPES = [ 'audio' ];\n\nconst PlaylistEdit = ( {\n\tattributes,\n\tsetAttributes,\n\tisSelected,\n\tinsertBlocksAfter,\n\tclientId,\n} ) => {\n\tconst {\n\t\torder,\n\t\tshowTracklist,\n\t\tshowNumbers,\n\t\tshowImages,\n\t\tshowArtists,\n\t\tshowTrackLength,\n\t\tcurrentTrack,\n\t} = attributes;\n\n\t// Extract the waveform style from the block style variation class.\n\tconst waveformStyle =\n\t\tattributes.className?.match( /is-style-([\\w-]+)/ )?.[ 1 ] || 'bars';\n\tconst blockProps = useBlockProps();\n\tconst { replaceInnerBlocks, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tfunction onUploadError( message ) {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t}\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst { innerBlockTracks } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlock: _getBlock } = select( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tinnerBlockTracks: _getBlock( clientId )?.innerBlocks ?? [],\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t// Ensure that each inner block has a unique ID,\n\t// even if a track is duplicated.\n\tuseEffect( () => {\n\t\tconst seen = new Set();\n\t\tlet hasDuplicates = false;\n\t\tconst updatedBlocks = innerBlockTracks.map( ( block ) => {\n\t\t\tif ( seen.has( block.attributes.uniqueId ) ) {\n\t\t\t\thasDuplicates = true;\n\t\t\t\treturn {\n\t\t\t\t\t...block,\n\t\t\t\t\tattributes: {\n\t\t\t\t\t\t...block.attributes,\n\t\t\t\t\t\tuniqueId: uuid(),\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\t\t\tseen.add( block.attributes.uniqueId );\n\t\t\treturn block;\n\t\t} );\n\t\tif ( hasDuplicates ) {\n\t\t\treplaceInnerBlocks( clientId, updatedBlocks );\n\t\t}\n\t}, [ innerBlockTracks, clientId, replaceInnerBlocks ] );\n\n\t// Create a list of tracks from the inner blocks,\n\t// but skip blocks that do not have a uniqueId attribute, such as the media placeholder.\n\tconst validTracks = innerBlockTracks.filter(\n\t\t( block ) => !! block.attributes.uniqueId\n\t);\n\tconst tracks = validTracks.map( ( block ) => block.attributes );\n\tconst firstTrackId = validTracks[ 0 ]?.attributes?.uniqueId;\n\n\t// updateBlockAttributes is used to force updating the parent playlist block\n\t// when the currentTrack changes. Using setAttributes directly does not update\n\t// the currentTrack when multiple tracks are moved at the same time.\n\tuseEffect( () => {\n\t\tif ( tracks.length === 0 ) {\n\t\t\t// If there are no tracks but currentTrack is set, set it to null.\n\t\t\tif ( currentTrack !== null ) {\n\t\t\t\tupdateBlockAttributes( clientId, { currentTrack: null } );\n\t\t\t}\n\t\t} else if (\n\t\t\t// If the currentTrack is not the first track, update it to the first track.\n\t\t\tfirstTrackId &&\n\t\t\tfirstTrackId !== currentTrack\n\t\t) {\n\t\t\tupdateBlockAttributes( clientId, { currentTrack: firstTrackId } );\n\t\t}\n\t}, [\n\t\ttracks,\n\t\tcurrentTrack,\n\t\tfirstTrackId,\n\t\tclientId,\n\t\tupdateBlockAttributes,\n\t] );\n\n\tconst onSelectTracks = useCallback(\n\t\t( media ) => {\n\t\t\tif ( ! media ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! Array.isArray( media ) ) {\n\t\t\t\tmedia = [ media ];\n\t\t\t}\n\n\t\t\tconst trackList = media.map( getTrackAttributes );\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tsetAttributes( {\n\t\t\t\tcurrentTrack:\n\t\t\t\t\ttrackList.length > 0 ? trackList[ 0 ].uniqueId : null,\n\t\t\t} );\n\n\t\t\tconst newBlocks = trackList.map( ( track ) =>\n\t\t\t\tcreateBlock( 'core/playlist-track', track )\n\t\t\t);\n\t\t\t// Replace the inner blocks with the new tracks.\n\t\t\treplaceInnerBlocks( clientId, newBlocks );\n\t\t},\n\t\t[\n\t\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\t\tsetAttributes,\n\t\t\treplaceInnerBlocks,\n\t\t\tclientId,\n\t\t]\n\t);\n\n\t// Get current track data by finding the track with matching uniqueId.\n\tconst currentTrackData = tracks.find(\n\t\t( track ) => track.uniqueId === currentTrack\n\t);\n\n\t// Handle track end - advance to next track or loop to first.\n\tconst onTrackEnded = useCallback( () => {\n\t\tconst currentIndex = tracks.findIndex(\n\t\t\t( track ) => track.uniqueId === currentTrack\n\t\t);\n\t\tconst nextTrack = tracks[ currentIndex + 1 ] || tracks[ 0 ];\n\t\tif ( nextTrack?.uniqueId ) {\n\t\t\tsetAttributes( { currentTrack: nextTrack.uniqueId } );\n\t\t}\n\t}, [ currentTrack, tracks, setAttributes ] );\n\n\tconst onChangeOrder = useCallback(\n\t\t( trackOrder ) => {\n\t\t\tconst sortedBlocks = [ ...innerBlockTracks ].sort( ( a, b ) => {\n\t\t\t\tconst titleA = a.attributes.title || '';\n\t\t\t\tconst titleB = b.attributes.title || '';\n\n\t\t\t\tif ( trackOrder === 'asc' ) {\n\t\t\t\t\treturn titleA.localeCompare( titleB );\n\t\t\t\t}\n\t\t\t\treturn titleB.localeCompare( titleA );\n\t\t\t} );\n\t\t\tconst firstUniqueId = sortedBlocks[ 0 ]?.attributes?.uniqueId;\n\t\t\treplaceInnerBlocks( clientId, sortedBlocks );\n\t\t\tsetAttributes( {\n\t\t\t\torder: trackOrder,\n\t\t\t\tcurrentTrack:\n\t\t\t\t\tfirstUniqueId && firstUniqueId !== currentTrack\n\t\t\t\t\t\t? firstUniqueId\n\t\t\t\t\t\t: currentTrack,\n\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tclientId,\n\t\t\tcurrentTrack,\n\t\t\tinnerBlockTracks,\n\t\t\treplaceInnerBlocks,\n\t\t\tsetAttributes,\n\t\t]\n\t);\n\n\tfunction toggleAttribute( attribute ) {\n\t\treturn ( newValue ) => {\n\t\t\tsetAttributes( { [ attribute ]: newValue } );\n\t\t};\n\t}\n\n\tconst hasSelectedChild = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).hasSelectedInnerBlock( clientId ),\n\t\t[ clientId ]\n\t);\n\n\tconst hasAnySelected = isSelected || hasSelectedChild;\n\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\t__experimentalAppenderTagName: 'li',\n\t\trenderAppender: hasAnySelected && InnerBlocks.ButtonBlockAppender,\n\t} );\n\n\tif ( tracks.length === 0 ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\t{ ...blockProps }\n\t\t\t\tclassName={ clsx( 'is-placeholder', blockProps.className ) }\n\t\t\t>\n\t\t\t\t<MediaPlaceholder\n\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\tlabels={ {\n\t\t\t\t\t\ttitle: __( 'Playlist' ),\n\t\t\t\t\t\tinstructions: __(\n\t\t\t\t\t\t\t'Upload an audio file or pick one from your media library.'\n\t\t\t\t\t\t),\n\t\t\t\t\t} }\n\t\t\t\t\tonSelect={ onSelectTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls group=\"other\">\n\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\tname={ __( 'Edit' ) }\n\t\t\t\t\tonSelect={ onSelectTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple\n\t\t\t\t\tmediaIds={ tracks\n\t\t\t\t\t\t.filter( ( track ) => track.id )\n\t\t\t\t\t\t.map( ( track ) => track.id ) }\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tshowTracklist: true,\n\t\t\t\t\t\t\tshowArtists: true,\n\t\t\t\t\t\t\tshowNumbers: true,\n\t\t\t\t\t\t\tshowTrackLength: true,\n\t\t\t\t\t\t\tshowImages: true,\n\t\t\t\t\t\t\torder: 'asc',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Show Tracklist' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => showTracklist !== true }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showTracklist: true } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show Tracklist' ) }\n\t\t\t\t\t\t\tonChange={ toggleAttribute( 'showTracklist' ) }\n\t\t\t\t\t\t\tchecked={ showTracklist }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t{ showTracklist && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Show artist name in Tracklist' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => showArtists !== true }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { showArtists: true } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t\t'Show artist name in Tracklist'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t\t\t'showArtists'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tchecked={ showArtists }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Show number in Tracklist' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => showNumbers !== true }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { showNumbers: true } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Show number in Tracklist' ) }\n\t\t\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t\t\t'showNumbers'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tchecked={ showNumbers }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Show track length in Tracklist' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => showTrackLength !== true }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { showTrackLength: true } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t\t'Show track length in Tracklist'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t\t\t'showTrackLength'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tchecked={ showTrackLength }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Show images' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => showImages !== true }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showImages: true } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show images' ) }\n\t\t\t\t\t\t\tonChange={ toggleAttribute( 'showImages' ) }\n\t\t\t\t\t\t\tchecked={ showImages }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Order' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => order !== 'asc' }\n\t\t\t\t\t\tonDeselect={ () => setAttributes( { order: 'asc' } ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tlabel={ __( 'Order' ) }\n\t\t\t\t\t\t\tvalue={ order }\n\t\t\t\t\t\t\toptions={ [\n\t\t\t\t\t\t\t\t{ label: __( 'Descending' ), value: 'desc' },\n\t\t\t\t\t\t\t\t{ label: __( 'Ascending' ), value: 'asc' },\n\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\tonChange={ ( value ) => onChangeOrder( value ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t<figure { ...blockProps }>\n\t\t\t\t<Disabled isDisabled={ ! isSelected }>\n\t\t\t\t\t<WaveformPlayer\n\t\t\t\t\t\tsrc={ currentTrackData?.src }\n\t\t\t\t\t\ttitle={ currentTrackData?.title }\n\t\t\t\t\t\tartist={ currentTrackData?.artist }\n\t\t\t\t\t\timage={ currentTrackData?.image }\n\t\t\t\t\t\twaveformStyle={ waveformStyle }\n\t\t\t\t\t\tonEnded={ onTrackEnded }\n\t\t\t\t\t/>\n\t\t\t\t</Disabled>\n\t\t\t\t{ showTracklist && (\n\t\t\t\t\t<ol\n\t\t\t\t\t\tclassName={ clsx( 'wp-block-playlist__tracklist', {\n\t\t\t\t\t\t\t'wp-block-playlist__tracklist-show-numbers':\n\t\t\t\t\t\t\t\tshowNumbers,\n\t\t\t\t\t\t\t'wp-block-playlist__tracklist-length-is-hidden':\n\t\t\t\t\t\t\t\t! showTrackLength,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ innerBlocksProps.children }\n\t\t\t\t\t</ol>\n\t\t\t\t) }\n\t\t\t\t<Caption\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tinsertBlocksAfter={ insertBlocksAfter }\n\t\t\t\t\tlabel={ __( 'Playlist caption text' ) }\n\t\t\t\t\tshowToolbarButton={ isSelected }\n\t\t\t\t\tstyle={ { marginTop: 16 } }\n\t\t\t\t/>\n\t\t\t</figure>\n\t\t</>\n\t);\n};\n\nexport default PlaylistEdit;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useEffect, useMemo, useState } from '@wordpress/element';\nimport {\n\tstore as blockEditorStore,\n\tMediaPlaceholder,\n\tMediaReplaceFlow,\n\tBlockIcon,\n\tuseBlockProps,\n\tuseInnerBlocksProps,\n\tBlockControls,\n\tInspectorControls,\n\tInnerBlocks,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n} from '@wordpress/block-editor';\nimport {\n\tToggleControl,\n\tDisabled,\n\tSelectControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { __, _x } from '@wordpress/i18n';\nimport { playlist as icon } from '@wordpress/icons';\nimport { createBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { Caption } from '../utils/caption';\nimport { useToolsPanelDropdownMenuProps } from '../utils/hooks';\nimport { WaveformPlayer } from '../utils/waveform-player';\nimport { PlaylistContext } from './context';\nimport { getTrackAttributes } from './utils';\n\nconst ALLOWED_MEDIA_TYPES = [ 'audio' ];\nconst DEFAULT_WAVEFORM_STYLE = 'bars';\nconst WAVEFORM_STYLE_OPTIONS = [\n\t{ label: _x( 'Bars', 'waveform style option' ), value: 'bars' },\n\t{ label: _x( 'Mirror', 'waveform style option' ), value: 'mirror' },\n\t{ label: _x( 'Line', 'waveform style option' ), value: 'line' },\n\t{ label: _x( 'Blocks', 'waveform style option' ), value: 'blocks' },\n\t{ label: _x( 'Dots', 'waveform style option' ), value: 'dots' },\n\t{ label: _x( 'Seekbar', 'waveform style option' ), value: 'seekbar' },\n];\n\nconst PlaylistEdit = ( {\n\tattributes,\n\tsetAttributes,\n\tisSelected,\n\tinsertBlocksAfter,\n\tclientId,\n} ) => {\n\tconst {\n\t\torder,\n\t\tshowTracklist,\n\t\tshowNumbers,\n\t\tshowImages,\n\t\tshowPlayButtonArtwork,\n\t\tshowArtists,\n\t\tshowTrackLength,\n\t\twaveformStyle = DEFAULT_WAVEFORM_STYLE,\n\t\twaveformColor,\n\t\twaveformGradient,\n\t\twaveformBackgroundColor,\n\t\twaveformBackgroundGradient,\n\t} = attributes;\n\n\tconst blockProps = useBlockProps();\n\tconst waveformPanelId = `${ clientId }-waveform`;\n\tconst { replaceInnerBlocks } = useDispatch( blockEditorStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\n\tconst colors = useMemo(\n\t\t() =>\n\t\t\tcolorGradientSettings.colors.flatMap(\n\t\t\t\t( origin ) => origin?.colors ?? []\n\t\t\t),\n\t\t[ colorGradientSettings.colors ]\n\t);\n\tconst gradients = useMemo(\n\t\t() =>\n\t\t\tcolorGradientSettings.gradients.flatMap(\n\t\t\t\t( origin ) => origin?.gradients ?? []\n\t\t\t),\n\t\t[ colorGradientSettings.gradients ]\n\t);\n\tconst hasColors =\n\t\tcolors.length > 0 || ! colorGradientSettings.disableCustomColors;\n\tconst hasGradients =\n\t\tgradients.length > 0 || ! colorGradientSettings.disableCustomGradients;\n\tconst waveformGradientValue = waveformGradient;\n\tconst waveformBackgroundGradientValue = waveformBackgroundGradient;\n\tlet waveformColorGradientChange;\n\tlet waveformBackgroundColorGradientChange;\n\tfunction onUploadError( message ) {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t}\n\tconst [ currentTrackClientId, setCurrentTrackClientId ] = useState( null );\n\n\tconst { innerBlockTracks } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlock: _getBlock } = select( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tinnerBlockTracks: _getBlock( clientId )?.innerBlocks ?? [],\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t// Create a list of tracks from the inner blocks,\n\t// but skip blocks that do not have a source, such as the media placeholder.\n\tconst validTracks = useMemo(\n\t\t() =>\n\t\t\tinnerBlockTracks.filter(\n\t\t\t\t( block ) => !! block.attributes.src || !! block.attributes.blob\n\t\t\t),\n\t\t[ innerBlockTracks ]\n\t);\n\tconst tracks = useMemo(\n\t\t() =>\n\t\t\tvalidTracks.map( ( block ) => ( {\n\t\t\t\t...block.attributes,\n\t\t\t\tclientId: block.clientId,\n\t\t\t} ) ),\n\t\t[ validTracks ]\n\t);\n\n\tuseEffect( () => {\n\t\tif ( validTracks.length === 0 ) {\n\t\t\tif ( currentTrackClientId !== null ) {\n\t\t\t\tsetCurrentTrackClientId( null );\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentTrackExists = validTracks.some(\n\t\t\t( block ) => block.clientId === currentTrackClientId\n\t\t);\n\t\tif ( ! currentTrackExists ) {\n\t\t\tsetCurrentTrackClientId( validTracks[ 0 ].clientId );\n\t\t}\n\t}, [ currentTrackClientId, setCurrentTrackClientId, validTracks ] );\n\n\tconst playlistContext = useMemo(\n\t\t() => ( { currentTrackClientId, setCurrentTrackClientId } ),\n\t\t[ currentTrackClientId, setCurrentTrackClientId ]\n\t);\n\n\tconst onSelectTracks = useCallback(\n\t\t( media ) => {\n\t\t\tif ( ! media ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! Array.isArray( media ) ) {\n\t\t\t\tmedia = [ media ];\n\t\t\t}\n\n\t\t\tconst trackList = media.map( getTrackAttributes );\n\n\t\t\tconst newBlocks = trackList.map( ( track ) =>\n\t\t\t\tcreateBlock( 'core/playlist-track', track )\n\t\t\t);\n\t\t\tsetCurrentTrackClientId( newBlocks[ 0 ]?.clientId ?? null );\n\t\t\t// Replace the inner blocks with the new tracks.\n\t\t\treplaceInnerBlocks( clientId, newBlocks );\n\t\t},\n\t\t[ replaceInnerBlocks, clientId, setCurrentTrackClientId ]\n\t);\n\n\t// Get current track data by finding the track with matching client ID.\n\tconst currentTrackData =\n\t\ttracks.find( ( track ) => track.clientId === currentTrackClientId ) ??\n\t\ttracks[ 0 ];\n\n\t// Handle track end - advance to next track or loop to first.\n\tconst onTrackEnded = useCallback( () => {\n\t\tconst currentIndex = tracks.findIndex(\n\t\t\t( track ) => track.clientId === currentTrackClientId\n\t\t);\n\t\tconst nextTrack = tracks[ currentIndex + 1 ] || tracks[ 0 ];\n\t\tif ( nextTrack?.clientId ) {\n\t\t\tsetCurrentTrackClientId( nextTrack.clientId );\n\t\t}\n\t}, [ currentTrackClientId, setCurrentTrackClientId, tracks ] );\n\n\tconst onChangeOrder = useCallback(\n\t\t( trackOrder ) => {\n\t\t\tconst sortedBlocks = [ ...innerBlockTracks ].sort( ( a, b ) => {\n\t\t\t\tconst titleA = a.attributes.title || '';\n\t\t\t\tconst titleB = b.attributes.title || '';\n\n\t\t\t\tif ( trackOrder === 'asc' ) {\n\t\t\t\t\treturn titleA.localeCompare( titleB );\n\t\t\t\t}\n\t\t\t\treturn titleB.localeCompare( titleA );\n\t\t\t} );\n\t\t\treplaceInnerBlocks( clientId, sortedBlocks );\n\t\t\tsetCurrentTrackClientId( sortedBlocks[ 0 ]?.clientId ?? null );\n\t\t\tsetAttributes( {\n\t\t\t\torder: trackOrder,\n\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tclientId,\n\t\t\tinnerBlockTracks,\n\t\t\treplaceInnerBlocks,\n\t\t\tsetAttributes,\n\t\t\tsetCurrentTrackClientId,\n\t\t]\n\t);\n\n\tfunction toggleAttribute( attribute ) {\n\t\treturn ( newValue ) => {\n\t\t\tsetAttributes( { [ attribute ]: newValue } );\n\t\t};\n\t}\n\n\tconst onChangeWaveformStyle = useCallback(\n\t\t( newWaveformStyle ) => {\n\t\t\tsetAttributes( {\n\t\t\t\twaveformStyle:\n\t\t\t\t\tnewWaveformStyle === DEFAULT_WAVEFORM_STYLE\n\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t: newWaveformStyle,\n\t\t\t} );\n\t\t},\n\t\t[ setAttributes ]\n\t);\n\n\tfunction updateWaveformColor( colorValue ) {\n\t\tconst isSettingColor = colorValue !== undefined;\n\t\tif ( ! isSettingColor && waveformColorGradientChange === 'gradient' ) {\n\t\t\twaveformColorGradientChange = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\twaveformColorGradientChange = 'color';\n\n\t\tsetAttributes( {\n\t\t\twaveformColor: colorValue,\n\t\t\twaveformGradient: undefined,\n\t\t} );\n\t}\n\n\tfunction updateWaveformGradient( gradientValue ) {\n\t\tconst isSettingGradient = gradientValue !== undefined;\n\t\tif ( ! isSettingGradient && waveformColorGradientChange === 'color' ) {\n\t\t\twaveformColorGradientChange = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\twaveformColorGradientChange = 'gradient';\n\n\t\tsetAttributes( {\n\t\t\twaveformGradient: gradientValue,\n\t\t\twaveformColor: undefined,\n\t\t} );\n\t}\n\n\tfunction updateWaveformBackgroundColor( colorValue ) {\n\t\tconst isSettingColor = colorValue !== undefined;\n\t\tif (\n\t\t\t! isSettingColor &&\n\t\t\twaveformBackgroundColorGradientChange === 'gradient'\n\t\t) {\n\t\t\twaveformBackgroundColorGradientChange = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\twaveformBackgroundColorGradientChange = 'color';\n\n\t\tsetAttributes( {\n\t\t\twaveformBackgroundColor: colorValue,\n\t\t\twaveformBackgroundGradient: undefined,\n\t\t} );\n\t}\n\n\tfunction updateWaveformBackgroundGradient( gradientValue ) {\n\t\tconst isSettingGradient = gradientValue !== undefined;\n\t\tif (\n\t\t\t! isSettingGradient &&\n\t\t\twaveformBackgroundColorGradientChange === 'color'\n\t\t) {\n\t\t\twaveformBackgroundColorGradientChange = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\twaveformBackgroundColorGradientChange = 'gradient';\n\n\t\tsetAttributes( {\n\t\t\twaveformBackgroundGradient: gradientValue,\n\t\t\twaveformBackgroundColor: undefined,\n\t\t} );\n\t}\n\n\tconst hasSelectedChild = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).hasSelectedInnerBlock( clientId ),\n\t\t[ clientId ]\n\t);\n\n\tconst hasAnySelected = isSelected || hasSelectedChild;\n\n\tconst colorSettings = [];\n\tif ( hasColors || hasGradients ) {\n\t\tcolorSettings.push(\n\t\t\t{\n\t\t\t\tcolorValue: hasColors ? waveformColor : undefined,\n\t\t\t\tgradientValue: hasGradients ? waveformGradientValue : undefined,\n\t\t\t\tlabel: __( 'Waveform & Play button' ),\n\t\t\t\tonColorChange: hasColors ? updateWaveformColor : undefined,\n\t\t\t\tonGradientChange: hasGradients\n\t\t\t\t\t? updateWaveformGradient\n\t\t\t\t\t: undefined,\n\t\t\t\tisShownByDefault: true,\n\t\t\t\tclearable: true,\n\t\t\t\tenableAlpha: true,\n\t\t\t\tresetAllFilter: () => ( {\n\t\t\t\t\twaveformColor: undefined,\n\t\t\t\t\twaveformGradient: undefined,\n\t\t\t\t} ),\n\t\t\t},\n\t\t\t{\n\t\t\t\tcolorValue: hasColors ? waveformBackgroundColor : undefined,\n\t\t\t\tgradientValue: hasGradients\n\t\t\t\t\t? waveformBackgroundGradientValue\n\t\t\t\t\t: undefined,\n\t\t\t\tlabel: __( 'Waveform background' ),\n\t\t\t\tonColorChange: hasColors\n\t\t\t\t\t? updateWaveformBackgroundColor\n\t\t\t\t\t: undefined,\n\t\t\t\tonGradientChange: hasGradients\n\t\t\t\t\t? updateWaveformBackgroundGradient\n\t\t\t\t\t: undefined,\n\t\t\t\tisShownByDefault: true,\n\t\t\t\tclearable: true,\n\t\t\t\tenableAlpha: true,\n\t\t\t\tresetAllFilter: () => ( {\n\t\t\t\t\twaveformBackgroundColor: undefined,\n\t\t\t\t\twaveformBackgroundGradient: undefined,\n\t\t\t\t} ),\n\t\t\t}\n\t\t);\n\t}\n\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\t__experimentalAppenderTagName: 'li',\n\t\trenderAppender: hasAnySelected && InnerBlocks.ButtonBlockAppender,\n\t} );\n\n\tif ( tracks.length === 0 ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\t{ ...blockProps }\n\t\t\t\tclassName={ clsx( 'is-placeholder', blockProps.className ) }\n\t\t\t>\n\t\t\t\t<MediaPlaceholder\n\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\tlabels={ {\n\t\t\t\t\t\ttitle: __( 'Playlist' ),\n\t\t\t\t\t\tinstructions: __(\n\t\t\t\t\t\t\t'Upload an audio file or pick one from your media library.'\n\t\t\t\t\t\t),\n\t\t\t\t\t} }\n\t\t\t\t\tonSelect={ onSelectTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls group=\"other\">\n\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\tname={ __( 'Edit' ) }\n\t\t\t\t\tonSelect={ onSelectTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple\n\t\t\t\t\tmediaIds={ tracks\n\t\t\t\t\t\t.filter( ( track ) => track.id )\n\t\t\t\t\t\t.map( ( track ) => track.id ) }\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tshowTracklist: true,\n\t\t\t\t\t\t\tshowArtists: true,\n\t\t\t\t\t\t\tshowNumbers: true,\n\t\t\t\t\t\t\tshowTrackLength: true,\n\t\t\t\t\t\t\tshowImages: true,\n\t\t\t\t\t\t\tshowPlayButtonArtwork: false,\n\t\t\t\t\t\t\torder: 'asc',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Show tracklist' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => showTracklist !== true }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showTracklist: true } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show tracklist' ) }\n\t\t\t\t\t\t\tonChange={ toggleAttribute( 'showTracklist' ) }\n\t\t\t\t\t\t\tchecked={ showTracklist }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t{ showTracklist && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Show artist name in tracklist' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => showArtists !== true }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { showArtists: true } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t\t'Show artist name in tracklist'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t\t\t'showArtists'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tchecked={ showArtists }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t'Show track numbers in tracklist'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => showNumbers !== true }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { showNumbers: true } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t\t'Show track numbers in tracklist'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t\t\t'showNumbers'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tchecked={ showNumbers }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t'Show track duration in tracklist'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => showTrackLength !== true }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { showTrackLength: true } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t\t'Show track duration in tracklist'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t\t\t'showTrackLength'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tchecked={ showTrackLength }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Show tracklist images' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => showImages !== true }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showImages: true } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show tracklist images' ) }\n\t\t\t\t\t\t\tonChange={ toggleAttribute( 'showImages' ) }\n\t\t\t\t\t\t\tchecked={ showImages }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Show track image on play button' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => showPlayButtonArtwork === true }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showPlayButtonArtwork: false } )\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show track image on play button' ) }\n\t\t\t\t\t\t\tonChange={ toggleAttribute(\n\t\t\t\t\t\t\t\t'showPlayButtonArtwork'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tchecked={ showPlayButtonArtwork === true }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Order' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () => order !== 'asc' }\n\t\t\t\t\t\tonDeselect={ () => setAttributes( { order: 'asc' } ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\tlabel={ __( 'Order' ) }\n\t\t\t\t\t\t\tvalue={ order }\n\t\t\t\t\t\t\toptions={ [\n\t\t\t\t\t\t\t\t{ label: __( 'Descending' ), value: 'desc' },\n\t\t\t\t\t\t\t\t{ label: __( 'Ascending' ), value: 'asc' },\n\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\tonChange={ ( value ) => onChangeOrder( value ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t<InspectorControls group=\"styles\">\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Waveform' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\twaveformStyle: undefined,\n\t\t\t\t\t\t\twaveformColor: undefined,\n\t\t\t\t\t\t\twaveformGradient: undefined,\n\t\t\t\t\t\t\twaveformBackgroundColor: undefined,\n\t\t\t\t\t\t\twaveformBackgroundGradient: undefined,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ waveformPanelId }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t{ colorSettings.length > 0 && (\n\t\t\t\t\t\t<div className=\"wp-block-playlist__waveform-color-controls\">\n\t\t\t\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t\tsettings={ colorSettings }\n\t\t\t\t\t\t\t\tpanelId={ waveformPanelId }\n\t\t\t\t\t\t\t\t{ ...colorGradientSettings }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\tlabel={ __( 'Shape' ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\thasValue={ () =>\n\t\t\t\t\t\t\twaveformStyle !== DEFAULT_WAVEFORM_STYLE\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tonChangeWaveformStyle( DEFAULT_WAVEFORM_STYLE )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tpanelId={ waveformPanelId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\tlabel={ __( 'Shape' ) }\n\t\t\t\t\t\t\tvalue={ waveformStyle }\n\t\t\t\t\t\t\toptions={ WAVEFORM_STYLE_OPTIONS }\n\t\t\t\t\t\t\tonChange={ onChangeWaveformStyle }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t<figure { ...blockProps }>\n\t\t\t\t<Disabled isDisabled={ ! isSelected }>\n\t\t\t\t\t<WaveformPlayer\n\t\t\t\t\t\tsrc={ currentTrackData?.src }\n\t\t\t\t\t\ttitle={ currentTrackData?.title }\n\t\t\t\t\t\tartist={ currentTrackData?.artist }\n\t\t\t\t\t\timage={ currentTrackData?.image }\n\t\t\t\t\t\timageAlt={ currentTrackData?.imageAlt }\n\t\t\t\t\t\twaveformStyle={ waveformStyle }\n\t\t\t\t\t\tcolor={ waveformColor }\n\t\t\t\t\t\tgradient={ waveformGradientValue }\n\t\t\t\t\t\tbackgroundColor={ waveformBackgroundColor }\n\t\t\t\t\t\tbackgroundGradient={ waveformBackgroundGradientValue }\n\t\t\t\t\t\tonEnded={ onTrackEnded }\n\t\t\t\t\t\tshowPlayButtonArtwork={ showPlayButtonArtwork === true }\n\t\t\t\t\t/>\n\t\t\t\t</Disabled>\n\t\t\t\t{ showTracklist && (\n\t\t\t\t\t<ol\n\t\t\t\t\t\tclassName={ clsx( 'wp-block-playlist__tracklist', {\n\t\t\t\t\t\t\t'wp-block-playlist__tracklist-show-numbers':\n\t\t\t\t\t\t\t\tshowNumbers,\n\t\t\t\t\t\t\t'wp-block-playlist__tracklist-length-is-hidden':\n\t\t\t\t\t\t\t\t! showTrackLength,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<PlaylistContext.Provider value={ playlistContext }>\n\t\t\t\t\t\t\t{ innerBlocksProps.children }\n\t\t\t\t\t\t</PlaylistContext.Provider>\n\t\t\t\t\t</ol>\n\t\t\t\t) }\n\t\t\t\t<Caption\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tinsertBlocksAfter={ insertBlocksAfter }\n\t\t\t\t\tlabel={ __( 'Playlist caption text' ) }\n\t\t\t\t\tshowToolbarButton={ isSelected }\n\t\t\t\t\tstyle={ { marginTop: 16 } }\n\t\t\t\t/>\n\t\t\t</figure>\n\t\t</>\n\t);\n};\n\nexport default PlaylistEdit;\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/playlist/index.mjs

@@ -1,5 +1,5 @@
 // packages/block-library/src/playlist/index.js
-import { audio as icon } from "@wordpress/icons";
+import { playlist as icon } from "@wordpress/icons";
 import initBlock from "../utils/init-block.mjs";
 import metadata from "./block.json";
 import edit from "./edit.mjs";

package/build-module/playlist/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/playlist/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { audio as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport initBlock from '../utils/init-block';\nimport metadata from './block.json';\nimport edit from './edit';\nimport save from './save';\n\nconst { name } = metadata;\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"],
-  "mappings": ";AAGA,SAAS,SAAS,YAAY;AAK9B,OAAO,eAAe;AACtB,OAAO,cAAc;AACrB,OAAO,UAAU;AACjB,OAAO,UAAU;AAEjB,IAAM,EAAE,KAAK,IAAI;AAGV,IAAM,WAAW;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACD;AAEO,IAAM,OAAO,MAAM,UAAW,EAAE,MAAM,UAAU,SAAS,CAAE;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { playlist as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport initBlock from '../utils/init-block';\nimport metadata from './block.json';\nimport edit from './edit';\nimport save from './save';\n\nconst { name } = metadata;\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"],
+  "mappings": ";AAGA,SAAS,YAAY,YAAY;AAKjC,OAAO,eAAe;AACtB,OAAO,cAAc;AACrB,OAAO,UAAU;AACjB,OAAO,UAAU;AAEjB,IAAM,EAAE,KAAK,IAAI;AAGV,IAAM,WAAW;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACD;AAEO,IAAM,OAAO,MAAM,UAAW,EAAE,MAAM,UAAU,SAAS,CAAE;",
   "names": []
 }

package/build-module/playlist/utils.mjs

@@ -1,23 +1,33 @@
 // packages/block-library/src/playlist/utils.js
-import { v4 as uuid } from "uuid";
 import { __ } from "@wordpress/i18n";
+function getTrackImageAttributes(image) {
+  const imageSrc = image?.src ?? image?.url;
+  if (imageSrc?.endsWith("/images/media/audio.svg")) {
+    return {
+      image: "",
+      imageAlt: ""
+    };
+  }
+  return {
+    // Note: Image is not available when a new track is uploaded.
+    image: imageSrc,
+    imageAlt: imageSrc ? image?.alt || image?.alt_text || "" : void 0
+  };
+}
 function getTrackAttributes(media) {
   return {
     id: media.id || media.url,
     // Attachment ID or URL.
-    uniqueId: uuid(),
-    // Unique ID for the track.
     src: media.url,
     title: media.title,
     artist: media.artist || media?.meta?.artist || media?.media_details?.artist || __("Unknown artist"),
     album: media.album || media?.meta?.album || media?.media_details?.album || __("Unknown album"),
     length: media?.fileLength || media?.media_details?.length_formatted,
-    // Prevent using the default media attachment icon as the track image.
-    // Note: Image is not available when a new track is uploaded.
-    image: media?.image?.src && media?.image?.src.endsWith("/images/media/audio.svg") ? "" : media?.image?.src
+    ...getTrackImageAttributes(media?.image)
   };
 }
 export {
-  getTrackAttributes
+  getTrackAttributes,
+  getTrackImageAttributes
 };
 //# sourceMappingURL=utils.mjs.map

package/build-module/playlist/utils.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/playlist/utils.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport { v4 as uuid } from 'uuid';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Transform media library data into track block attributes.\n *\n * @param {Object} media - Media object from the media library.\n * @return {Object} Track attributes for the playlist-track block.\n */\nexport function getTrackAttributes( media ) {\n\treturn {\n\t\tid: media.id || media.url, // Attachment ID or URL.\n\t\tuniqueId: uuid(), // Unique ID for the track.\n\t\tsrc: media.url,\n\t\ttitle: media.title,\n\t\tartist:\n\t\t\tmedia.artist ||\n\t\t\tmedia?.meta?.artist ||\n\t\t\tmedia?.media_details?.artist ||\n\t\t\t__( 'Unknown artist' ),\n\t\talbum:\n\t\t\tmedia.album ||\n\t\t\tmedia?.meta?.album ||\n\t\t\tmedia?.media_details?.album ||\n\t\t\t__( 'Unknown album' ),\n\t\tlength: media?.fileLength || media?.media_details?.length_formatted,\n\t\t// Prevent using the default media attachment icon as the track image.\n\t\t// Note: Image is not available when a new track is uploaded.\n\t\timage:\n\t\t\tmedia?.image?.src &&\n\t\t\tmedia?.image?.src.endsWith( '/images/media/audio.svg' )\n\t\t\t\t? ''\n\t\t\t\t: media?.image?.src,\n\t};\n}\n"],
-  "mappings": ";AAGA,SAAS,MAAM,YAAY;AAK3B,SAAS,UAAU;AAQZ,SAAS,mBAAoB,OAAQ;AAC3C,SAAO;AAAA,IACN,IAAI,MAAM,MAAM,MAAM;AAAA;AAAA,IACtB,UAAU,KAAK;AAAA;AAAA,IACf,KAAK,MAAM;AAAA,IACX,OAAO,MAAM;AAAA,IACb,QACC,MAAM,UACN,OAAO,MAAM,UACb,OAAO,eAAe,UACtB,GAAI,gBAAiB;AAAA,IACtB,OACC,MAAM,SACN,OAAO,MAAM,SACb,OAAO,eAAe,SACtB,GAAI,eAAgB;AAAA,IACrB,QAAQ,OAAO,cAAc,OAAO,eAAe;AAAA;AAAA;AAAA,IAGnD,OACC,OAAO,OAAO,OACd,OAAO,OAAO,IAAI,SAAU,yBAA0B,IACnD,KACA,OAAO,OAAO;AAAA,EACnB;AACD;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Transform media library image data into track image attributes.\n *\n * @param {Object} image - Image object from the media library.\n * @return {Object} Track image attributes for the playlist-track block.\n */\nexport function getTrackImageAttributes( image ) {\n\tconst imageSrc = image?.src ?? image?.url;\n\n\t// Prevent using the default media attachment icon as the track image.\n\tif ( imageSrc?.endsWith( '/images/media/audio.svg' ) ) {\n\t\treturn {\n\t\t\timage: '',\n\t\t\timageAlt: '',\n\t\t};\n\t}\n\n\treturn {\n\t\t// Note: Image is not available when a new track is uploaded.\n\t\timage: imageSrc,\n\t\timageAlt: imageSrc ? image?.alt || image?.alt_text || '' : undefined,\n\t};\n}\n\n/**\n * Transform media library data into track block attributes.\n *\n * @param {Object} media - Media object from the media library.\n * @return {Object} Track attributes for the playlist-track block.\n */\nexport function getTrackAttributes( media ) {\n\treturn {\n\t\tid: media.id || media.url, // Attachment ID or URL.\n\t\tsrc: media.url,\n\t\ttitle: media.title,\n\t\tartist:\n\t\t\tmedia.artist ||\n\t\t\tmedia?.meta?.artist ||\n\t\t\tmedia?.media_details?.artist ||\n\t\t\t__( 'Unknown artist' ),\n\t\talbum:\n\t\t\tmedia.album ||\n\t\t\tmedia?.meta?.album ||\n\t\t\tmedia?.media_details?.album ||\n\t\t\t__( 'Unknown album' ),\n\t\tlength: media?.fileLength || media?.media_details?.length_formatted,\n\t\t...getTrackImageAttributes( media?.image ),\n\t};\n}\n"],
+  "mappings": ";AAGA,SAAS,UAAU;AAQZ,SAAS,wBAAyB,OAAQ;AAChD,QAAM,WAAW,OAAO,OAAO,OAAO;AAGtC,MAAK,UAAU,SAAU,yBAA0B,GAAI;AACtD,WAAO;AAAA,MACN,OAAO;AAAA,MACP,UAAU;AAAA,IACX;AAAA,EACD;AAEA,SAAO;AAAA;AAAA,IAEN,OAAO;AAAA,IACP,UAAU,WAAW,OAAO,OAAO,OAAO,YAAY,KAAK;AAAA,EAC5D;AACD;AAQO,SAAS,mBAAoB,OAAQ;AAC3C,SAAO;AAAA,IACN,IAAI,MAAM,MAAM,MAAM;AAAA;AAAA,IACtB,KAAK,MAAM;AAAA,IACX,OAAO,MAAM;AAAA,IACb,QACC,MAAM,UACN,OAAO,MAAM,UACb,OAAO,eAAe,UACtB,GAAI,gBAAiB;AAAA,IACtB,OACC,MAAM,SACN,OAAO,MAAM,SACb,OAAO,eAAe,SACtB,GAAI,eAAgB;AAAA,IACrB,QAAQ,OAAO,cAAc,OAAO,eAAe;AAAA,IACnD,GAAG,wBAAyB,OAAO,KAAM;AAAA,EAC1C;AACD;",
   "names": []
 }

package/build-module/playlist/view.mjs

@@ -1,21 +1,48 @@
 // packages/block-library/src/playlist/view.js
 import { store, getContext, getElement } from "@wordpress/interactivity";
-import { initWaveformPlayer, logPlayError } from "../utils/waveform-utils.mjs";
+import {
+  initWaveformPlayer,
+  logPlayError,
+  setupPlayButtonArtwork,
+  updateSeekControlLabel
+} from "../utils/waveform-utils.mjs";
 var playerState = /* @__PURE__ */ new WeakMap();
+var playlistPlayerState = /* @__PURE__ */ new Map();
 var { state } = store(
   "core/playlist",
   {
     state: {
       playlists: {},
       get isCurrentTrack() {
-        const { currentId, uniqueId } = getContext();
-        return currentId === uniqueId;
+        const { currentId, trackId } = getContext();
+        return currentId === trackId;
+      },
+      get isCurrentTrackPlaying() {
+        const { currentId, isPlaying, trackId } = getContext();
+        return currentId === trackId && !!isPlaying;
+      },
+      get trackButtonActionLabel() {
+        const { labelPauseTrack, labelSelectTrack } = getContext();
+        return state.isCurrentTrackPlaying ? labelPauseTrack : labelSelectTrack;
       }
     },
     actions: {
       changeTrack() {
         const context = getContext();
-        context.currentId = context.uniqueId;
+        if (context.currentId === context.trackId) {
+          const player = playlistPlayerState.get(
+            context.playlistId
+          )?.instance;
+          if (player?.isPlaying) {
+            context.isPlaying = false;
+            player.pause();
+          } else {
+            player?.play()?.catch(logPlayError);
+          }
+          return;
+        }
+        context.isPlaying = false;
+        context.currentId = context.trackId;
       }
     },
     callbacks: {
@@ -42,32 +69,63 @@ var { state } = store(
 );
 function initPlayer(ref, track, shouldAutoPlay, context) {
   const existing = playerState.get(ref);
+  const showPlayButtonArtwork = context.showPlayButtonArtwork === true;
+  const playerArtwork = showPlayButtonArtwork ? "" : track.image;
   if (existing?.instance) {
-    existing.instance.loadTrack(track.url, track.title, track.artist, {
-      artwork: track.image
-    }).then(() => {
-      existing.url = track.url;
-      if (shouldAutoPlay) {
-        existing.instance.play()?.catch(logPlayError);
-      }
-    }).catch(logPlayError);
-    return;
+    const shouldRecreatePlayer = !!existing.instance.artworkEl !== !!playerArtwork;
+    if (shouldRecreatePlayer) {
+      existing.destroy?.();
+      playerState.delete(ref);
+    } else {
+      playlistPlayerState.set(context.playlistId, existing);
+      existing.instance.loadTrack(track.url, track.title, track.artist, {
+        artwork: playerArtwork,
+        artworkAlt: playerArtwork ? track.imageAlt : ""
+      }).then(() => {
+        existing.url = track.url;
+        if (existing.instance.artworkEl) {
+          existing.instance.artworkEl.alt = track.imageAlt || "";
+        }
+        updateSeekControlLabel(
+          existing.instance,
+          track.title || ref.dataset.labelSeek
+        );
+        if (showPlayButtonArtwork) {
+          setupPlayButtonArtwork(
+            existing.container,
+            track.image
+          );
+        }
+        if (shouldAutoPlay) {
+          existing.instance.play()?.catch(logPlayError);
+        }
+      }).catch(logPlayError);
+      return;
+    }
   }
   const labels = {
     play: ref.dataset.labelPlay,
-    pause: ref.dataset.labelPause
+    pause: ref.dataset.labelPause,
+    seek: ref.dataset.labelSeek,
+    seekValueText: ref.dataset.labelSeekValue
   };
   const player = initWaveformPlayer(ref, {
     src: track.url,
     title: track.title,
     artist: track.artist,
     image: track.image,
+    imageAlt: track.imageAlt,
+    waveformColor: ref.dataset.waveformPlayerColor,
+    waveformGradient: ref.dataset.waveformPlayerGradient,
+    backgroundColor: ref.dataset.waveformPlayerBackgroundColor,
+    backgroundGradient: ref.dataset.waveformPlayerBackgroundGradient,
     autoPlay: shouldAutoPlay,
     labels,
     waveformStyle: context.waveformStyle,
+    showPlayButtonArtwork,
     onEnded: () => {
       const currentIndex = context.tracks.findIndex(
-        (uniqueId) => uniqueId === context.currentId
+        (trackId) => trackId === context.currentId
       );
       const nextTrack = context.tracks[currentIndex + 1];
       if (nextTrack) {
@@ -75,10 +133,27 @@ function initPlayer(ref, track, shouldAutoPlay, context) {
       }
     }
   });
-  playerState.set(ref, {
+  const setIsPlaying = (isPlaying) => {
+    context.isPlaying = isPlaying;
+  };
+  const onPlay = () => setIsPlaying(true);
+  const onPause = () => setIsPlaying(false);
+  player.container.addEventListener("waveformplayer:play", onPlay);
+  player.container.addEventListener("waveformplayer:pause", onPause);
+  player.container.addEventListener("waveformplayer:ended", onPause);
+  const destroy = () => {
+    player.container.removeEventListener("waveformplayer:play", onPlay);
+    player.container.removeEventListener("waveformplayer:pause", onPause);
+    player.container.removeEventListener("waveformplayer:ended", onPause);
+    player.destroy();
+  };
+  const nextState = {
     url: track.url,
     instance: player.instance,
-    destroy: player.destroy
-  });
+    container: player.container,
+    destroy
+  };
+  playerState.set(ref, nextState);
+  playlistPlayerState.set(context.playlistId, nextState);
 }
 //# sourceMappingURL=view.mjs.map

package/build-module/playlist/view.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/playlist/view.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { store, getContext, getElement } from '@wordpress/interactivity';\n\n/**\n * Internal dependencies\n */\nimport { initWaveformPlayer, logPlayError } from '../utils/waveform-utils';\n\n/**\n * Store player state for each element.\n */\nconst playerState = new WeakMap();\n\nconst { state } = store(\n\t'core/playlist',\n\t{\n\t\tstate: {\n\t\t\tplaylists: {},\n\t\t\tget isCurrentTrack() {\n\t\t\t\tconst { currentId, uniqueId } = getContext();\n\t\t\t\treturn currentId === uniqueId;\n\t\t\t},\n\t\t},\n\t\tactions: {\n\t\t\tchangeTrack() {\n\t\t\t\tconst context = getContext();\n\t\t\t\tcontext.currentId = context.uniqueId;\n\t\t\t},\n\t\t},\n\t\tcallbacks: {\n\t\t\tinitWaveformPlayer() {\n\t\t\t\tconst context = getContext();\n\t\t\t\tconst { ref } = getElement();\n\n\t\t\t\tif ( ! context.currentId || ! ref ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst track =\n\t\t\t\t\tstate.playlists[ context.playlistId ]?.tracks[\n\t\t\t\t\t\tcontext.currentId\n\t\t\t\t\t];\n\t\t\t\tif ( ! track?.url ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst existing = playerState.get( ref );\n\n\t\t\t\t// Skip if we already initialized with this exact URL.\n\t\t\t\tif ( existing?.url === track.url ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Autoplay if we're switching from a different track (user action),\n\t\t\t\t// but not on initial page load (when existing has no URL).\n\t\t\t\tconst shouldAutoPlay = !! existing?.url;\n\n\t\t\t\tinitPlayer( ref, track, shouldAutoPlay, context );\n\t\t\t},\n\t\t},\n\t},\n\t{ lock: true }\n);\n\n/**\n * Initialize the waveform player for a given element.\n *\n * @param {Element} ref            - The container element.\n * @param {Object}  track          - The track data.\n * @param {boolean} shouldAutoPlay - Whether to auto-play after initialization.\n * @param {Object}  context        - The Interactivity API context.\n */\nfunction initPlayer( ref, track, shouldAutoPlay, context ) {\n\tconst existing = playerState.get( ref );\n\n\t// If a player already exists, load the new track without recreating.\n\tif ( existing?.instance ) {\n\t\texisting.instance\n\t\t\t.loadTrack( track.url, track.title, track.artist, {\n\t\t\t\tartwork: track.image,\n\t\t\t} )\n\t\t\t.then( () => {\n\t\t\t\texisting.url = track.url;\n\t\t\t\tif ( shouldAutoPlay ) {\n\t\t\t\t\texisting.instance.play()?.catch( logPlayError );\n\t\t\t\t}\n\t\t\t} )\n\t\t\t.catch( logPlayError );\n\t\treturn;\n\t}\n\n\t// Read translated labels from server-rendered data attributes.\n\tconst labels = {\n\t\tplay: ref.dataset.labelPlay,\n\t\tpause: ref.dataset.labelPause,\n\t};\n\n\t// Initialize using the shared core.\n\tconst player = initWaveformPlayer( ref, {\n\t\tsrc: track.url,\n\t\ttitle: track.title,\n\t\tartist: track.artist,\n\t\timage: track.image,\n\t\tautoPlay: shouldAutoPlay,\n\t\tlabels,\n\t\twaveformStyle: context.waveformStyle,\n\t\tonEnded: () => {\n\t\t\t// Advance to next track (autoPlay handles playback).\n\t\t\tconst currentIndex = context.tracks.findIndex(\n\t\t\t\t( uniqueId ) => uniqueId === context.currentId\n\t\t\t);\n\t\t\tconst nextTrack = context.tracks[ currentIndex + 1 ];\n\t\t\tif ( nextTrack ) {\n\t\t\t\tcontext.currentId = nextTrack;\n\t\t\t}\n\t\t},\n\t} );\n\n\t// Store state for cleanup, including instance for loadTrack reuse.\n\tplayerState.set( ref, {\n\t\turl: track.url,\n\t\tinstance: player.instance,\n\t\tdestroy: player.destroy,\n\t} );\n}\n"],
-  "mappings": ";AAGA,SAAS,OAAO,YAAY,kBAAkB;AAK9C,SAAS,oBAAoB,oBAAoB;AAKjD,IAAM,cAAc,oBAAI,QAAQ;AAEhC,IAAM,EAAE,MAAM,IAAI;AAAA,EACjB;AAAA,EACA;AAAA,IACC,OAAO;AAAA,MACN,WAAW,CAAC;AAAA,MACZ,IAAI,iBAAiB;AACpB,cAAM,EAAE,WAAW,SAAS,IAAI,WAAW;AAC3C,eAAO,cAAc;AAAA,MACtB;AAAA,IACD;AAAA,IACA,SAAS;AAAA,MACR,cAAc;AACb,cAAM,UAAU,WAAW;AAC3B,gBAAQ,YAAY,QAAQ;AAAA,MAC7B;AAAA,IACD;AAAA,IACA,WAAW;AAAA,MACV,qBAAqB;AACpB,cAAM,UAAU,WAAW;AAC3B,cAAM,EAAE,IAAI,IAAI,WAAW;AAE3B,YAAK,CAAE,QAAQ,aAAa,CAAE,KAAM;AACnC;AAAA,QACD;AAEA,cAAM,QACL,MAAM,UAAW,QAAQ,UAAW,GAAG,OACtC,QAAQ,SACT;AACD,YAAK,CAAE,OAAO,KAAM;AACnB;AAAA,QACD;AAEA,cAAM,WAAW,YAAY,IAAK,GAAI;AAGtC,YAAK,UAAU,QAAQ,MAAM,KAAM;AAClC;AAAA,QACD;AAIA,cAAM,iBAAiB,CAAC,CAAE,UAAU;AAEpC,mBAAY,KAAK,OAAO,gBAAgB,OAAQ;AAAA,MACjD;AAAA,IACD;AAAA,EACD;AAAA,EACA,EAAE,MAAM,KAAK;AACd;AAUA,SAAS,WAAY,KAAK,OAAO,gBAAgB,SAAU;AAC1D,QAAM,WAAW,YAAY,IAAK,GAAI;AAGtC,MAAK,UAAU,UAAW;AACzB,aAAS,SACP,UAAW,MAAM,KAAK,MAAM,OAAO,MAAM,QAAQ;AAAA,MACjD,SAAS,MAAM;AAAA,IAChB,CAAE,EACD,KAAM,MAAM;AACZ,eAAS,MAAM,MAAM;AACrB,UAAK,gBAAiB;AACrB,iBAAS,SAAS,KAAK,GAAG,MAAO,YAAa;AAAA,MAC/C;AAAA,IACD,CAAE,EACD,MAAO,YAAa;AACtB;AAAA,EACD;AAGA,QAAM,SAAS;AAAA,IACd,MAAM,IAAI,QAAQ;AAAA,IAClB,OAAO,IAAI,QAAQ;AAAA,EACpB;AAGA,QAAM,SAAS,mBAAoB,KAAK;AAAA,IACvC,KAAK,MAAM;AAAA,IACX,OAAO,MAAM;AAAA,IACb,QAAQ,MAAM;AAAA,IACd,OAAO,MAAM;AAAA,IACb,UAAU;AAAA,IACV;AAAA,IACA,eAAe,QAAQ;AAAA,IACvB,SAAS,MAAM;AAEd,YAAM,eAAe,QAAQ,OAAO;AAAA,QACnC,CAAE,aAAc,aAAa,QAAQ;AAAA,MACtC;AACA,YAAM,YAAY,QAAQ,OAAQ,eAAe,CAAE;AACnD,UAAK,WAAY;AAChB,gBAAQ,YAAY;AAAA,MACrB;AAAA,IACD;AAAA,EACD,CAAE;AAGF,cAAY,IAAK,KAAK;AAAA,IACrB,KAAK,MAAM;AAAA,IACX,UAAU,OAAO;AAAA,IACjB,SAAS,OAAO;AAAA,EACjB,CAAE;AACH;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { store, getContext, getElement } from '@wordpress/interactivity';\n\n/**\n * Internal dependencies\n */\nimport {\n\tinitWaveformPlayer,\n\tlogPlayError,\n\tsetupPlayButtonArtwork,\n\tupdateSeekControlLabel,\n} from '../utils/waveform-utils';\n\n/**\n * Store player state for each element.\n */\nconst playerState = new WeakMap();\nconst playlistPlayerState = new Map();\n\nconst { state } = store(\n\t'core/playlist',\n\t{\n\t\tstate: {\n\t\t\tplaylists: {},\n\t\t\tget isCurrentTrack() {\n\t\t\t\tconst { currentId, trackId } = getContext();\n\t\t\t\treturn currentId === trackId;\n\t\t\t},\n\t\t\tget isCurrentTrackPlaying() {\n\t\t\t\tconst { currentId, isPlaying, trackId } = getContext();\n\t\t\t\treturn currentId === trackId && !! isPlaying;\n\t\t\t},\n\t\t\tget trackButtonActionLabel() {\n\t\t\t\tconst { labelPauseTrack, labelSelectTrack } = getContext();\n\t\t\t\treturn state.isCurrentTrackPlaying\n\t\t\t\t\t? labelPauseTrack\n\t\t\t\t\t: labelSelectTrack;\n\t\t\t},\n\t\t},\n\t\tactions: {\n\t\t\tchangeTrack() {\n\t\t\t\tconst context = getContext();\n\t\t\t\tif ( context.currentId === context.trackId ) {\n\t\t\t\t\tconst player = playlistPlayerState.get(\n\t\t\t\t\t\tcontext.playlistId\n\t\t\t\t\t)?.instance;\n\t\t\t\t\tif ( player?.isPlaying ) {\n\t\t\t\t\t\tcontext.isPlaying = false;\n\t\t\t\t\t\tplayer.pause();\n\t\t\t\t\t} else {\n\t\t\t\t\t\tplayer?.play()?.catch( logPlayError );\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tcontext.isPlaying = false;\n\t\t\t\tcontext.currentId = context.trackId;\n\t\t\t},\n\t\t},\n\t\tcallbacks: {\n\t\t\tinitWaveformPlayer() {\n\t\t\t\tconst context = getContext();\n\t\t\t\tconst { ref } = getElement();\n\n\t\t\t\tif ( ! context.currentId || ! ref ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst track =\n\t\t\t\t\tstate.playlists[ context.playlistId ]?.tracks[\n\t\t\t\t\t\tcontext.currentId\n\t\t\t\t\t];\n\t\t\t\tif ( ! track?.url ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst existing = playerState.get( ref );\n\n\t\t\t\t// Skip if we already initialized with this exact URL.\n\t\t\t\tif ( existing?.url === track.url ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Autoplay if we're switching from a different track (user action),\n\t\t\t\t// but not on initial page load (when existing has no URL).\n\t\t\t\tconst shouldAutoPlay = !! existing?.url;\n\n\t\t\t\tinitPlayer( ref, track, shouldAutoPlay, context );\n\t\t\t},\n\t\t},\n\t},\n\t{ lock: true }\n);\n\n/**\n * Initialize the waveform player for a given element.\n *\n * @param {Element} ref            - The container element.\n * @param {Object}  track          - The track data.\n * @param {boolean} shouldAutoPlay - Whether to auto-play after initialization.\n * @param {Object}  context        - The Interactivity API context.\n */\nfunction initPlayer( ref, track, shouldAutoPlay, context ) {\n\tconst existing = playerState.get( ref );\n\tconst showPlayButtonArtwork = context.showPlayButtonArtwork === true;\n\tconst playerArtwork = showPlayButtonArtwork ? '' : track.image;\n\n\t// If a player already exists, load the new track without recreating.\n\tif ( existing?.instance ) {\n\t\tconst shouldRecreatePlayer =\n\t\t\t!! existing.instance.artworkEl !== !! playerArtwork;\n\n\t\tif ( shouldRecreatePlayer ) {\n\t\t\texisting.destroy?.();\n\t\t\tplayerState.delete( ref );\n\t\t} else {\n\t\t\tplaylistPlayerState.set( context.playlistId, existing );\n\t\t\texisting.instance\n\t\t\t\t.loadTrack( track.url, track.title, track.artist, {\n\t\t\t\t\tartwork: playerArtwork,\n\t\t\t\t\tartworkAlt: playerArtwork ? track.imageAlt : '',\n\t\t\t\t} )\n\t\t\t\t.then( () => {\n\t\t\t\t\texisting.url = track.url;\n\t\t\t\t\tif ( existing.instance.artworkEl ) {\n\t\t\t\t\t\texisting.instance.artworkEl.alt = track.imageAlt || '';\n\t\t\t\t\t}\n\t\t\t\t\t// loadTrack() preserves the previous explicit seekLabel option.\n\t\t\t\t\tupdateSeekControlLabel(\n\t\t\t\t\t\texisting.instance,\n\t\t\t\t\t\ttrack.title || ref.dataset.labelSeek\n\t\t\t\t\t);\n\t\t\t\t\tif ( showPlayButtonArtwork ) {\n\t\t\t\t\t\tsetupPlayButtonArtwork(\n\t\t\t\t\t\t\texisting.container,\n\t\t\t\t\t\t\ttrack.image\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t\tif ( shouldAutoPlay ) {\n\t\t\t\t\t\texisting.instance.play()?.catch( logPlayError );\n\t\t\t\t\t}\n\t\t\t\t} )\n\t\t\t\t.catch( logPlayError );\n\t\t\treturn;\n\t\t}\n\t}\n\n\t// Read translated labels from server-rendered data attributes.\n\tconst labels = {\n\t\tplay: ref.dataset.labelPlay,\n\t\tpause: ref.dataset.labelPause,\n\t\tseek: ref.dataset.labelSeek,\n\t\tseekValueText: ref.dataset.labelSeekValue,\n\t};\n\n\t// Initialize using the shared core.\n\tconst player = initWaveformPlayer( ref, {\n\t\tsrc: track.url,\n\t\ttitle: track.title,\n\t\tartist: track.artist,\n\t\timage: track.image,\n\t\timageAlt: track.imageAlt,\n\t\twaveformColor: ref.dataset.waveformPlayerColor,\n\t\twaveformGradient: ref.dataset.waveformPlayerGradient,\n\t\tbackgroundColor: ref.dataset.waveformPlayerBackgroundColor,\n\t\tbackgroundGradient: ref.dataset.waveformPlayerBackgroundGradient,\n\t\tautoPlay: shouldAutoPlay,\n\t\tlabels,\n\t\twaveformStyle: context.waveformStyle,\n\t\tshowPlayButtonArtwork,\n\t\tonEnded: () => {\n\t\t\t// Advance to next track (autoPlay handles playback).\n\t\t\tconst currentIndex = context.tracks.findIndex(\n\t\t\t\t( trackId ) => trackId === context.currentId\n\t\t\t);\n\t\t\tconst nextTrack = context.tracks[ currentIndex + 1 ];\n\t\t\tif ( nextTrack ) {\n\t\t\t\tcontext.currentId = nextTrack;\n\t\t\t}\n\t\t},\n\t} );\n\tconst setIsPlaying = ( isPlaying ) => {\n\t\tcontext.isPlaying = isPlaying;\n\t};\n\tconst onPlay = () => setIsPlaying( true );\n\tconst onPause = () => setIsPlaying( false );\n\tplayer.container.addEventListener( 'waveformplayer:play', onPlay );\n\tplayer.container.addEventListener( 'waveformplayer:pause', onPause );\n\tplayer.container.addEventListener( 'waveformplayer:ended', onPause );\n\tconst destroy = () => {\n\t\tplayer.container.removeEventListener( 'waveformplayer:play', onPlay );\n\t\tplayer.container.removeEventListener( 'waveformplayer:pause', onPause );\n\t\tplayer.container.removeEventListener( 'waveformplayer:ended', onPause );\n\t\tplayer.destroy();\n\t};\n\n\t// Store state for cleanup, including instance for loadTrack reuse.\n\tconst nextState = {\n\t\turl: track.url,\n\t\tinstance: player.instance,\n\t\tcontainer: player.container,\n\t\tdestroy,\n\t};\n\tplayerState.set( ref, nextState );\n\tplaylistPlayerState.set( context.playlistId, nextState );\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/playlist-track/block.json

@@ -1,7 +1,6 @@
 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
 	"apiVersion": 3,
-	"__experimental": true,
 	"name": "core/playlist-track",
 	"title": "Playlist track",
 	"category": "media",
@@ -9,7 +8,7 @@
 	"description": "Playlist track.",
 	"keywords": [ "music", "sound" ],
 	"textdomain": "default",
-	"usesContext": [ "showArtists", "currentTrack" ],
+	"usesContext": [ "showArtists", "showImages" ],
 	"attributes": {
 		"blob": {
 			"type": "string",
@@ -18,9 +17,6 @@
 		"id": {
 			"type": "number"
 		},
-		"uniqueId": {
-			"type": "string"
-		},
 		"src": {
 			"type": "string"
 		},
@@ -37,6 +33,9 @@
 		"image": {
 			"type": "string"
 		},
+		"imageAlt": {
+			"type": "string"
+		},
 		"length": {
 			"type": "string"
 		},