@wordpress/block-library 10.4.0 → 10.5.2-next.v.202608281122.0

package/build-module/playlist/edit.mjs

@@ -1,4 +1,4 @@
-// packages/block-library/src/playlist/edit.js
+// packages/block-library/src/playlist/edit.jsx
 import clsx from "clsx";
 import { useCallback, useEffect, useMemo, useState } from "@wordpress/element";
 import {
@@ -76,7 +76,13 @@ var PlaylistEdit = ({
   } = attributes;
   const blockProps = useBlockProps();
   const waveformPanelId = `${clientId}-waveform`;
-  const { replaceInnerBlocks, selectBlock } = useDispatch(blockEditorStore);
+  const {
+    replaceInnerBlocks,
+    replaceBlocks,
+    insertBlocks,
+    selectBlock,
+    __unstableMarkNextChangeAsNotPersistent
+  } = useDispatch(blockEditorStore);
   const { createErrorNotice } = useDispatch(noticesStore);
   const dropdownMenuProps = useToolsPanelDropdownMenuProps();
   const colorGradientSettings = useMultipleOriginColorsAndGradients();
@@ -141,6 +147,19 @@ var PlaylistEdit = ({
       setCurrentTrackClientId(validTracks[0].clientId);
     }
   }, [currentTrackClientId, setCurrentTrackClientId, validTracks]);
+  useEffect(() => {
+    if (validTracks.length > 0 || innerBlockTracks.length === 0) {
+      return;
+    }
+    __unstableMarkNextChangeAsNotPersistent();
+    replaceInnerBlocks(clientId, []);
+  }, [
+    clientId,
+    innerBlockTracks,
+    replaceInnerBlocks,
+    validTracks,
+    __unstableMarkNextChangeAsNotPersistent
+  ]);
   const createTrackBlocks = useCallback(
     (media) => {
       if (!media) {
@@ -203,26 +222,32 @@ var PlaylistEdit = ({
       if (newBlocks.length === 0) {
         return;
       }
-      const nextBlocks = [...validTracks, ...newBlocks];
       setCurrentTrackClientId(newBlocks[0].clientId);
-      replaceInnerBlocks(clientId, nextBlocks);
+      insertBlocks(newBlocks, void 0, clientId, false);
       selectBlock(newBlocks[0].clientId);
     },
     [
       clientId,
       createTrackBlocks,
-      replaceInnerBlocks,
+      insertBlocks,
       selectBlock,
       setCurrentTrackClientId,
       validTracks
     ]
   );
+  const removeTrack = useCallback(
+    (trackClientId) => {
+      replaceBlocks(trackClientId, []);
+    },
+    [replaceBlocks]
+  );
   const playlistContext = useMemo(
     () => ({
       currentTrackClientId,
-      setCurrentTrackClientId
+      setCurrentTrackClientId,
+      removeTrack
     }),
-    [currentTrackClientId, setCurrentTrackClientId]
+    [currentTrackClientId, setCurrentTrackClientId, removeTrack]
   );
   const currentTrackData = tracks.find((track) => track.clientId === currentTrackClientId) ?? tracks[0];
   const onTrackEnded = useCallback(() => {
@@ -352,10 +377,19 @@ var PlaylistEdit = ({
       }
     );
   }
-  const innerBlocksProps = useInnerBlocksProps(blockProps, {
-    __experimentalAppenderTagName: "li",
-    renderAppender: false
-  });
+  const { children: innerBlocks, ...trackListProps } = useInnerBlocksProps(
+    {
+      className: clsx("wp-block-playlist__tracklist", {
+        "wp-block-playlist__tracklist-is-hidden": !showTracklist,
+        "wp-block-playlist__tracklist-show-numbers": showNumbers,
+        "wp-block-playlist__tracklist-length-is-hidden": !showTrackLength
+      })
+    },
+    {
+      __experimentalAppenderTagName: "li",
+      renderAppender: false
+    }
+  );
   if (tracks.length === 0) {
     return /* @__PURE__ */ jsx(
       "div",
@@ -384,7 +418,7 @@ var PlaylistEdit = ({
     );
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(BlockControls, { group: "other", __experimentalShareWithChildBlocks: true, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(
       MediaReplaceFlow,
       {
         name: __("Add track"),
@@ -636,17 +670,7 @@ var PlaylistEdit = ({
           showPlayButtonArtwork: showPlayButtonArtwork === true
         }
       ) }),
-      /* @__PURE__ */ jsx(
-        "ol",
-        {
-          className: clsx("wp-block-playlist__tracklist", {
-            "wp-block-playlist__tracklist-is-hidden": !showTracklist,
-            "wp-block-playlist__tracklist-show-numbers": showNumbers,
-            "wp-block-playlist__tracklist-length-is-hidden": !showTrackLength
-          }),
-          children: /* @__PURE__ */ jsx(PlaylistContext.Provider, { value: playlistContext, children: innerBlocksProps.children })
-        }
-      ),
+      /* @__PURE__ */ jsx("ol", { ...trackListProps, children: /* @__PURE__ */ jsx(PlaylistContext.Provider, { value: playlistContext, children: innerBlocks }) }),
       /* @__PURE__ */ jsx(
         Caption,
         {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../src/playlist/edit.js"],
-  "sourcesContent": ["import clsx from 'clsx';\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\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';\nimport { createBlobURL } from '@wordpress/blob';\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 AUDIO_FILE_EXTENSION =\n\t/\\.(aac|aif|aiff|flac|m4a|m4b|mp3|oga|ogg|opus|wav|weba)$/i;\nconst DEFAULT_WAVEFORM_STYLE = 'bars';\nconst FILE_LIST_OBJECT_NAME = '[object FileList]';\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\nfunction isFile( value ) {\n\treturn (\n\t\tObject.prototype.toString.call( value ) === '[object File]' ||\n\t\t( typeof File !== 'undefined' && value instanceof File )\n\t);\n}\n\nfunction isAudioFile( file ) {\n\treturn file.type\n\t\t? file.type.startsWith( 'audio/' )\n\t\t: AUDIO_FILE_EXTENSION.test( file.name );\n}\n\nfunction getTrackIdentifier( track ) {\n\treturn track.id ?? track.src ?? track.blob;\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, selectBlock } = 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\tconst onUploadError = useCallback(\n\t\t( message ) => {\n\t\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\t},\n\t\t[ createErrorNotice ]\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 createTrackBlocks = useCallback(\n\t\t( media ) => {\n\t\t\tif ( ! media ) {\n\t\t\t\treturn [];\n\t\t\t}\n\n\t\t\tlet mediaItems = [ media ];\n\t\t\tif (\n\t\t\t\tObject.prototype.toString.call( media ) ===\n\t\t\t\tFILE_LIST_OBJECT_NAME\n\t\t\t) {\n\t\t\t\tmediaItems = Array.from( media );\n\t\t\t} else if ( Array.isArray( media ) ) {\n\t\t\t\tmediaItems = media;\n\t\t\t}\n\t\t\tlet hasInvalidFile = false;\n\n\t\t\tconst blocks = mediaItems\n\t\t\t\t.map( ( mediaItem ) => {\n\t\t\t\t\tif ( isFile( mediaItem ) ) {\n\t\t\t\t\t\tif ( ! isAudioFile( mediaItem ) ) {\n\t\t\t\t\t\t\thasInvalidFile = true;\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn createBlock( 'core/playlist-track', {\n\t\t\t\t\t\t\tblob: createBlobURL( mediaItem ),\n\t\t\t\t\t\t\ttitle: mediaItem.name,\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\n\t\t\t\t\tconst track = getTrackAttributes( mediaItem );\n\n\t\t\t\t\treturn track.src\n\t\t\t\t\t\t? createBlock( 'core/playlist-track', track )\n\t\t\t\t\t\t: null;\n\t\t\t\t} )\n\t\t\t\t.filter( Boolean );\n\n\t\t\tif ( hasInvalidFile ) {\n\t\t\t\tonUploadError(\n\t\t\t\t\t__( 'Only audio files can be added to a playlist.' )\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn blocks;\n\t\t},\n\t\t[ onUploadError ]\n\t);\n\n\tconst onSelectTracks = useCallback(\n\t\t( media ) => {\n\t\t\tconst newBlocks = createTrackBlocks( media );\n\t\t\tif ( newBlocks.length === 0 ) {\n\t\t\t\treturn;\n\t\t\t}\n\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[\n\t\t\tclientId,\n\t\t\tcreateTrackBlocks,\n\t\t\treplaceInnerBlocks,\n\t\t\tsetCurrentTrackClientId,\n\t\t]\n\t);\n\n\tconst onAddTracks = useCallback(\n\t\t( media ) => {\n\t\t\tconst existingIds = new Set(\n\t\t\t\tvalidTracks\n\t\t\t\t\t.map( ( block ) => getTrackIdentifier( block.attributes ) )\n\t\t\t\t\t.filter( Boolean )\n\t\t\t);\n\t\t\tconst newBlocks = createTrackBlocks( media ).filter(\n\t\t\t\t( block ) =>\n\t\t\t\t\t! existingIds.has( getTrackIdentifier( block.attributes ) )\n\t\t\t);\n\t\t\tif ( newBlocks.length === 0 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst nextBlocks = [ ...validTracks, ...newBlocks ];\n\t\t\tsetCurrentTrackClientId( newBlocks[ 0 ].clientId );\n\t\t\treplaceInnerBlocks( clientId, nextBlocks );\n\t\t\tselectBlock( newBlocks[ 0 ].clientId );\n\t\t},\n\t\t[\n\t\t\tclientId,\n\t\t\tcreateTrackBlocks,\n\t\t\treplaceInnerBlocks,\n\t\t\tselectBlock,\n\t\t\tsetCurrentTrackClientId,\n\t\t\tvalidTracks,\n\t\t]\n\t);\n\n\tconst playlistContext = useMemo(\n\t\t() => ( {\n\t\t\tcurrentTrackClientId,\n\t\t\tsetCurrentTrackClientId,\n\t\t} ),\n\t\t[ currentTrackClientId, 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 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: false,\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=\"add\"\n\t\t\t\t\thandleUpload={ false }\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\" __experimentalShareWithChildBlocks>\n\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\tname={ __( 'Add track' ) }\n\t\t\t\t\tonSelect={ onAddTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple=\"add\"\n\t\t\t\t\thandleUpload={ false }\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<MediaPlaceholder\n\t\t\t\t\tonSelect={ onAddTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple=\"add\"\n\t\t\t\t\thandleUpload={ false }\n\t\t\t\t\tdisableMediaButtons\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\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<ol\n\t\t\t\t\tclassName={ clsx( 'wp-block-playlist__tracklist', {\n\t\t\t\t\t\t'wp-block-playlist__tracklist-is-hidden':\n\t\t\t\t\t\t\t! showTracklist,\n\t\t\t\t\t\t'wp-block-playlist__tracklist-show-numbers':\n\t\t\t\t\t\t\tshowNumbers,\n\t\t\t\t\t\t'wp-block-playlist__tracklist-length-is-hidden':\n\t\t\t\t\t\t\t! showTrackLength,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<PlaylistContext.Provider value={ playlistContext }>\n\t\t\t\t\t\t{ innerBlocksProps.children }\n\t\t\t\t\t</PlaylistContext.Provider>\n\t\t\t\t</ol>\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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",
+  "sources": ["../../src/playlist/edit.jsx"],
+  "sourcesContent": ["import clsx from 'clsx';\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\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';\nimport { createBlobURL } from '@wordpress/blob';\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 AUDIO_FILE_EXTENSION =\n\t/\\.(aac|aif|aiff|flac|m4a|m4b|mp3|oga|ogg|opus|wav|weba)$/i;\nconst DEFAULT_WAVEFORM_STYLE = 'bars';\nconst FILE_LIST_OBJECT_NAME = '[object FileList]';\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\nfunction isFile( value ) {\n\treturn (\n\t\tObject.prototype.toString.call( value ) === '[object File]' ||\n\t\t( typeof File !== 'undefined' && value instanceof File )\n\t);\n}\n\nfunction isAudioFile( file ) {\n\treturn file.type\n\t\t? file.type.startsWith( 'audio/' )\n\t\t: AUDIO_FILE_EXTENSION.test( file.name );\n}\n\nfunction getTrackIdentifier( track ) {\n\treturn track.id ?? track.src ?? track.blob;\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 {\n\t\treplaceInnerBlocks,\n\t\treplaceBlocks,\n\t\tinsertBlocks,\n\t\tselectBlock,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = 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\tconst onUploadError = useCallback(\n\t\t( message ) => {\n\t\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\t},\n\t\t[ createErrorNotice ]\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\t// Clean up placeholder tracks when reverting back to playlist placeholder state\n\tuseEffect( () => {\n\t\tif ( validTracks.length > 0 || innerBlockTracks.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Remove any lingering placeholder track blocks\n\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\treplaceInnerBlocks( clientId, [] );\n\t}, [\n\t\tclientId,\n\t\tinnerBlockTracks,\n\t\treplaceInnerBlocks,\n\t\tvalidTracks,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t] );\n\n\tconst createTrackBlocks = useCallback(\n\t\t( media ) => {\n\t\t\tif ( ! media ) {\n\t\t\t\treturn [];\n\t\t\t}\n\n\t\t\tlet mediaItems = [ media ];\n\t\t\tif (\n\t\t\t\tObject.prototype.toString.call( media ) ===\n\t\t\t\tFILE_LIST_OBJECT_NAME\n\t\t\t) {\n\t\t\t\tmediaItems = Array.from( media );\n\t\t\t} else if ( Array.isArray( media ) ) {\n\t\t\t\tmediaItems = media;\n\t\t\t}\n\t\t\tlet hasInvalidFile = false;\n\n\t\t\tconst blocks = mediaItems\n\t\t\t\t.map( ( mediaItem ) => {\n\t\t\t\t\tif ( isFile( mediaItem ) ) {\n\t\t\t\t\t\tif ( ! isAudioFile( mediaItem ) ) {\n\t\t\t\t\t\t\thasInvalidFile = true;\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn createBlock( 'core/playlist-track', {\n\t\t\t\t\t\t\tblob: createBlobURL( mediaItem ),\n\t\t\t\t\t\t\ttitle: mediaItem.name,\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\n\t\t\t\t\tconst track = getTrackAttributes( mediaItem );\n\n\t\t\t\t\treturn track.src\n\t\t\t\t\t\t? createBlock( 'core/playlist-track', track )\n\t\t\t\t\t\t: null;\n\t\t\t\t} )\n\t\t\t\t.filter( Boolean );\n\n\t\t\tif ( hasInvalidFile ) {\n\t\t\t\tonUploadError(\n\t\t\t\t\t__( 'Only audio files can be added to a playlist.' )\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn blocks;\n\t\t},\n\t\t[ onUploadError ]\n\t);\n\n\tconst onSelectTracks = useCallback(\n\t\t( media ) => {\n\t\t\tconst newBlocks = createTrackBlocks( media );\n\t\t\tif ( newBlocks.length === 0 ) {\n\t\t\t\treturn;\n\t\t\t}\n\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[\n\t\t\tclientId,\n\t\t\tcreateTrackBlocks,\n\t\t\treplaceInnerBlocks,\n\t\t\tsetCurrentTrackClientId,\n\t\t]\n\t);\n\n\tconst onAddTracks = useCallback(\n\t\t( media ) => {\n\t\t\tconst existingIds = new Set(\n\t\t\t\tvalidTracks\n\t\t\t\t\t.map( ( block ) => getTrackIdentifier( block.attributes ) )\n\t\t\t\t\t.filter( Boolean )\n\t\t\t);\n\t\t\tconst newBlocks = createTrackBlocks( media ).filter(\n\t\t\t\t( block ) =>\n\t\t\t\t\t! existingIds.has( getTrackIdentifier( block.attributes ) )\n\t\t\t);\n\t\t\tif ( newBlocks.length === 0 ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetCurrentTrackClientId( newBlocks[ 0 ].clientId );\n\t\t\tinsertBlocks( newBlocks, undefined, clientId, false );\n\t\t\tselectBlock( newBlocks[ 0 ].clientId );\n\t\t},\n\t\t[\n\t\t\tclientId,\n\t\t\tcreateTrackBlocks,\n\t\t\tinsertBlocks,\n\t\t\tselectBlock,\n\t\t\tsetCurrentTrackClientId,\n\t\t\tvalidTracks,\n\t\t]\n\t);\n\n\tconst removeTrack = useCallback(\n\t\t( trackClientId ) => {\n\t\t\t// Not `removeBlock`: it removes the container along with its\n\t\t\t// last inner block, so this would take the playlist with it.\n\t\t\treplaceBlocks( trackClientId, [] );\n\t\t},\n\t\t[ replaceBlocks ]\n\t);\n\n\tconst playlistContext = useMemo(\n\t\t() => ( {\n\t\t\tcurrentTrackClientId,\n\t\t\tsetCurrentTrackClientId,\n\t\t\tremoveTrack,\n\t\t} ),\n\t\t[ currentTrackClientId, setCurrentTrackClientId, removeTrack ]\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 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 { children: innerBlocks, ...trackListProps } = useInnerBlocksProps(\n\t\t{\n\t\t\tclassName: clsx( 'wp-block-playlist__tracklist', {\n\t\t\t\t'wp-block-playlist__tracklist-is-hidden': ! showTracklist,\n\t\t\t\t'wp-block-playlist__tracklist-show-numbers': showNumbers,\n\t\t\t\t'wp-block-playlist__tracklist-length-is-hidden':\n\t\t\t\t\t! showTrackLength,\n\t\t\t} ),\n\t\t},\n\t\t{\n\t\t\t__experimentalAppenderTagName: 'li',\n\t\t\trenderAppender: false,\n\t\t}\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=\"add\"\n\t\t\t\t\thandleUpload={ false }\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={ __( 'Add track' ) }\n\t\t\t\t\tonSelect={ onAddTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple=\"add\"\n\t\t\t\t\thandleUpload={ false }\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<MediaPlaceholder\n\t\t\t\t\tonSelect={ onAddTracks }\n\t\t\t\t\taccept=\"audio/*\"\n\t\t\t\t\tmultiple=\"add\"\n\t\t\t\t\thandleUpload={ false }\n\t\t\t\t\tdisableMediaButtons\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\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<ol { ...trackListProps }>\n\t\t\t\t\t<PlaylistContext.Provider value={ playlistContext }>\n\t\t\t\t\t\t{ innerBlocks }\n\t\t\t\t\t</PlaylistContext.Provider>\n\t\t\t\t</ol>\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/save.mjs

@@ -1,4 +1,4 @@
-// packages/block-library/src/playlist/save.js
+// packages/block-library/src/playlist/save.jsx
 import clsx from "clsx";
 import {
   RichText,

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

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../src/playlist/save.js"],
+  "sources": ["../../src/playlist/save.jsx"],
   "sourcesContent": ["import clsx from 'clsx';\nimport {\n\tRichText,\n\tuseBlockProps,\n\tuseInnerBlocksProps,\n\t__experimentalGetElementClassName,\n} from '@wordpress/block-editor';\n\nexport default function saveWithInnerBlocks( { attributes } ) {\n\tconst {\n\t\tcaption,\n\t\tshowNumbers,\n\t\tshowTracklist,\n\t\tshowArtists,\n\t\tshowTrackLength,\n\t} = attributes;\n\n\tconst blockProps = useBlockProps.save();\n\tconst innerBlocksProps = useInnerBlocksProps.save( blockProps );\n\treturn (\n\t\t<figure { ...innerBlocksProps }>\n\t\t\t<ol\n\t\t\t\tclassName={ clsx( 'wp-block-playlist__tracklist', {\n\t\t\t\t\t'wp-block-playlist__tracklist-is-hidden': ! showTracklist,\n\t\t\t\t\t'wp-block-playlist__tracklist-artist-is-hidden':\n\t\t\t\t\t\t! showArtists,\n\t\t\t\t\t'wp-block-playlist__tracklist-length-is-hidden':\n\t\t\t\t\t\t! showTrackLength,\n\t\t\t\t\t'wp-block-playlist__tracklist-show-numbers': showNumbers,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ innerBlocksProps.children }\n\t\t\t</ol>\n\t\t\t{ ! RichText.isEmpty( caption ) && (\n\t\t\t\t<RichText.Content\n\t\t\t\t\ttagName=\"figcaption\"\n\t\t\t\t\tclassName={ __experimentalGetElementClassName( 'caption' ) }\n\t\t\t\t\tvalue={ caption }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</figure>\n\t);\n}\n"],
   "mappings": ";AAAA,OAAO,UAAU;AACjB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAcL,SACC,KADD;AAZa,SAAR,oBAAsC,EAAE,WAAW,GAAI;AAC7D,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAEJ,QAAM,aAAa,cAAc,KAAK;AACtC,QAAM,mBAAmB,oBAAoB,KAAM,UAAW;AAC9D,SACC,qBAAC,YAAS,GAAG,kBACZ;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAY,KAAM,gCAAgC;AAAA,UACjD,0CAA0C,CAAE;AAAA,UAC5C,iDACC,CAAE;AAAA,UACH,iDACC,CAAE;AAAA,UACH,6CAA6C;AAAA,QAC9C,CAAE;AAAA,QAEA,2BAAiB;AAAA;AAAA,IACpB;AAAA,IACE,CAAE,SAAS,QAAS,OAAQ,KAC7B;AAAA,MAAC,SAAS;AAAA,MAAT;AAAA,QACA,SAAQ;AAAA,QACR,WAAY,kCAAmC,SAAU;AAAA,QACzD,OAAQ;AAAA;AAAA,IACT;AAAA,KAEF;AAEF;",
   "names": []

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

@@ -15,32 +15,40 @@
 			"role": "local"
 		},
 		"id": {
-			"type": "number"
+			"type": "number",
+			"role": "content"
 		},
 		"src": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		},
 		"type": {
 			"type": "string",
 			"default": "audio"
 		},
 		"album": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		},
 		"artist": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		},
 		"image": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		},
 		"imageAlt": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		},
 		"length": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		},
 		"title": {
-			"type": "string"
+			"type": "string",
+			"role": "content"
 		}
 	},
 	"supports": {

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

@@ -1,4 +1,4 @@
-// packages/block-library/src/playlist-track/edit.js
+// packages/block-library/src/playlist-track/edit.jsx
 import { isBlobURL } from "@wordpress/blob";
 import { useContext, useEffect, useRef, useState } from "@wordpress/element";
 import {
@@ -16,7 +16,7 @@ import {
   Button,
   PanelBody,
   TextControl,
-  TextareaControl,
+  TextareaControl as WCTextareaControl,
   BaseControl,
   Spinner
 } from "@wordpress/components";
@@ -45,10 +45,15 @@ var PlaylistTrackEdit = ({
   const showImages = context?.showImages ?? true;
   const imageButton = useRef();
   const blockProps = useBlockProps();
-  const { currentTrackClientId, setCurrentTrackClientId } = useContext(PlaylistContext);
+  const { currentTrackClientId, setCurrentTrackClientId, removeTrack } = useContext(PlaylistContext);
   const { createErrorNotice } = useDispatch(noticesStore);
-  function onUploadError(message) {
+  function onUploadError(message, { removeTrackOnError = false } = {}) {
     createErrorNotice(message, { type: "snackbar" });
+    if (removeTrackOnError) {
+      removeTrack(clientId);
+      return;
+    }
+    setTemporaryURL();
   }
   const hasTrackSource = !!src || !!temporaryURL;
   useEffect(() => {
@@ -66,7 +71,9 @@ var PlaylistTrackEdit = ({
     url: temporaryURL,
     allowedTypes: ALLOWED_MEDIA_TYPES,
     onChange: onSelectTrack,
-    onError: onUploadError
+    onError: (message) => {
+      onUploadError(message, { removeTrackOnError: true });
+    }
   });
   function onSelectTrack(media) {
     const mediaUrl = media?.url ?? media?.source_url;
@@ -122,7 +129,7 @@ var PlaylistTrackEdit = ({
     ) });
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(
+    isSelected && /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(
       MediaReplaceFlow,
       {
         name: __("Replace"),
@@ -136,6 +143,16 @@ var PlaylistTrackEdit = ({
       }
     ) }),
     /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(PanelBody, { title: __("Settings"), children: [
+      isSelected && /* @__PURE__ */ jsx(
+        TextControl,
+        {
+          label: __("Title"),
+          value: title ? stripHTML(title) : "",
+          onChange: (titleValue) => {
+            setAttributes({ title: titleValue });
+          }
+        }
+      ),
       /* @__PURE__ */ jsx(
         TextControl,
         {
@@ -156,16 +173,6 @@ var PlaylistTrackEdit = ({
           }
         }
       ),
-      /* @__PURE__ */ jsx(
-        TextControl,
-        {
-          label: __("Title"),
-          value: title ? stripHTML(title) : "",
-          onChange: (titleValue) => {
-            setAttributes({ title: titleValue });
-          }
-        }
-      ),
       /* @__PURE__ */ jsx(MediaUploadCheck, { children: /* @__PURE__ */ jsxs(BaseControl, { children: [
         /* @__PURE__ */ jsx(BaseControl.VisualLabel, { children: __("Track image") }),
         /* @__PURE__ */ jsxs("div", { className: "editor-video-poster-control", children: [
@@ -208,7 +215,7 @@ var PlaylistTrackEdit = ({
         ] })
       ] }) }),
       !!image && /* @__PURE__ */ jsx(
-        TextareaControl,
+        WCTextareaControl,
         {
           label: __("Alternative text"),
           value: imageAlt || "",
@@ -231,62 +238,62 @@ var PlaylistTrackEdit = ({
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsxs("li", { ...blockProps, children: [
-      !!temporaryURL && /* @__PURE__ */ jsx(Spinner, {}),
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          className: "wp-block-playlist-track__button",
-          onClick: () => setCurrentTrackClientId(clientId),
-          "aria-current": currentTrackClientId === clientId ? "true" : "false",
-          children: [
-            showImages && !!image && /* @__PURE__ */ jsx(
-              "img",
+    /* @__PURE__ */ jsx("li", { ...blockProps, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: "wp-block-playlist-track__button",
+        onClick: () => setCurrentTrackClientId(clientId),
+        "aria-current": currentTrackClientId === clientId ? "true" : "false",
+        children: [
+          showImages && !!image && /* @__PURE__ */ jsx(
+            "img",
+            {
+              className: "wp-block-playlist-track__image",
+              src: image,
+              alt: imageAlt || ""
+            }
+          ),
+          /* @__PURE__ */ jsxs("span", { className: "wp-block-playlist-track__content", children: [
+            /* @__PURE__ */ jsx(
+              PlainText,
               {
-                className: "wp-block-playlist-track__image",
-                src: image,
-                alt: imageAlt || ""
+                tagName: "span",
+                className: "wp-block-playlist-track__title",
+                value: title,
+                "aria-label": __("Track title"),
+                placeholder: __("Track title"),
+                onChange: (value) => {
+                  setAttributes({ title: value });
+                },
+                __experimentalVersion: 2
               }
             ),
-            /* @__PURE__ */ jsxs("span", { className: "wp-block-playlist-track__content", children: [
-              /* @__PURE__ */ jsx(
-                PlainText,
-                {
-                  tagName: "span",
-                  className: "wp-block-playlist-track__title",
-                  value: title,
-                  placeholder: __("Add title"),
-                  onChange: (value) => {
-                    setAttributes({ title: value });
-                  },
-                  __experimentalVersion: 2
-                }
-              ),
-              showArtists && /* @__PURE__ */ jsx(
-                PlainText,
-                {
-                  tagName: "span",
-                  className: "wp-block-playlist-track__artist",
-                  value: artist,
-                  placeholder: __("Add artist"),
-                  onChange: (value) => setAttributes({ artist: value }),
-                  __experimentalVersion: 2
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxs("span", { className: "wp-block-playlist-track__length", children: [
-              length && /* @__PURE__ */ jsx("span", {
-                className: "screen-reader-text",
-                /* translators: Visually hidden label for the track duration (screen reader text). */
-                children: __("Duration:")
-              }),
-              length
-            ] }),
-            /* @__PURE__ */ jsx("span", { className: "screen-reader-text", children: __("Play") })
-          ]
-        }
-      )
-    ] })
+            showArtists && /* @__PURE__ */ jsx(
+              PlainText,
+              {
+                tagName: "span",
+                className: "wp-block-playlist-track__artist",
+                value: artist,
+                "aria-label": __("Track artist"),
+                placeholder: __("Track artist"),
+                onChange: (value) => setAttributes({ artist: value }),
+                __experimentalVersion: 2
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("span", { className: "wp-block-playlist-track__length", children: [
+            length && /* @__PURE__ */ jsx("span", {
+              className: "screen-reader-text",
+              /* translators: Visually hidden label for the track duration (screen reader text). */
+              children: __("Duration:")
+            }),
+            length,
+            !!temporaryURL && /* @__PURE__ */ jsx(Spinner, { className: "wp-block-playlist-track__spinner" })
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "screen-reader-text", children: __("Play") })
+        ]
+      }
+    ) })
   ] });
 };
 var edit_default = PlaylistTrackEdit;