@wordpress/block-library 7.15.0 → 7.16.0

package/build-module/video/edit.js

@@ -9,7 +9,7 @@ import classnames from 'classnames';
  */
 
 import { getBlobByURL, isBlobURL } from '@wordpress/blob';
-import { BaseControl, Button, Disabled, PanelBody, Spinner } from '@wordpress/components';
+import { BaseControl, Button, Disabled, PanelBody, Spinner, Placeholder } from '@wordpress/components';
 import { BlockControls, BlockIcon, InspectorControls, MediaPlaceholder, MediaUpload, MediaUploadCheck, MediaReplaceFlow, RichText, useBlockProps, store as blockEditorStore, __experimentalGetElementClassName } from '@wordpress/block-editor';
 import { useRef, useEffect } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
@@ -25,7 +25,18 @@ import { store as noticesStore } from '@wordpress/notices';
 import { createUpgradedEmbedBlock } from '../embed/util';
 import VideoCommonSettings from './edit-common-settings';
 import TracksEditor from './tracks-editor';
-import Tracks from './tracks';
+import Tracks from './tracks'; // Much of this description is duplicated from MediaPlaceholder.
+
+const placeholder = content => {
+  return createElement(Placeholder, {
+    className: "block-editor-media-placeholder",
+    withIllustration: true,
+    icon: icon,
+    label: __('Video'),
+    instructions: __('Upload a video file, pick one from your media library, or add one with a URL.')
+  }, content);
+};
+
 const ALLOWED_MEDIA_TYPES = ['video'];
 const VIDEO_POSTER_ALLOWED_MEDIA_TYPES = ['image'];
 
@@ -148,7 +159,8 @@ function VideoEdit(_ref) {
       accept: "video/*",
       allowedTypes: ALLOWED_MEDIA_TYPES,
       value: attributes,
-      onError: onUploadError
+      onError: onUploadError,
+      placeholder: placeholder
     }));
   }
 

package/build-module/video/edit.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/video/edit.js"],"names":["classnames","getBlobByURL","isBlobURL","BaseControl","Button","Disabled","PanelBody","Spinner","BlockControls","BlockIcon","InspectorControls","MediaPlaceholder","MediaUpload","MediaUploadCheck","MediaReplaceFlow","RichText","useBlockProps","store","blockEditorStore","__experimentalGetElementClassName","useRef","useEffect","__","sprintf","useInstanceId","useDispatch","useSelect","video","icon","createBlock","getDefaultBlockName","noticesStore","createUpgradedEmbedBlock","VideoCommonSettings","TracksEditor","Tracks","ALLOWED_MEDIA_TYPES","VIDEO_POSTER_ALLOWED_MEDIA_TYPES","VideoEdit","isSelected","attributes","className","setAttributes","insertBlocksAfter","onReplace","instanceId","videoPlayer","posterImageButton","id","caption","controls","poster","src","tracks","isTemporaryVideo","mediaUpload","select","getSettings","file","filesList","onFileChange","media","onSelectVideo","onError","onUploadError","allowedTypes","current","load","url","undefined","image","onSelectURL","newSrc","embedBlock","createErrorNotice","message","type","classes","blockProps","onSelectPoster","onRemovePoster","focus","videoPosterDescription","newTracks","open","isEmpty","value"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { getBlobByURL, isBlobURL } from '@wordpress/blob';\nimport {\n\tBaseControl,\n\tButton,\n\tDisabled,\n\tPanelBody,\n\tSpinner,\n} from '@wordpress/components';\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInspectorControls,\n\tMediaPlaceholder,\n\tMediaUpload,\n\tMediaUploadCheck,\n\tMediaReplaceFlow,\n\tRichText,\n\tuseBlockProps,\n\tstore as blockEditorStore,\n\t__experimentalGetElementClassName,\n} from '@wordpress/block-editor';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { video as icon } from '@wordpress/icons';\nimport { createBlock, getDefaultBlockName } from '@wordpress/blocks';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { createUpgradedEmbedBlock } from '../embed/util';\nimport VideoCommonSettings from './edit-common-settings';\nimport TracksEditor from './tracks-editor';\nimport Tracks from './tracks';\n\nconst ALLOWED_MEDIA_TYPES = [ 'video' ];\nconst VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ];\n\nfunction VideoEdit( {\n\tisSelected,\n\tattributes,\n\tclassName,\n\tsetAttributes,\n\tinsertBlocksAfter,\n\tonReplace,\n} ) {\n\tconst instanceId = useInstanceId( VideoEdit );\n\tconst videoPlayer = useRef();\n\tconst posterImageButton = useRef();\n\tconst { id, caption, controls, poster, src, tracks } = attributes;\n\tconst isTemporaryVideo = ! id && isBlobURL( src );\n\tconst mediaUpload = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings().mediaUpload,\n\t\t[]\n\t);\n\n\tuseEffect( () => {\n\t\tif ( ! id && isBlobURL( src ) ) {\n\t\t\tconst file = getBlobByURL( src );\n\t\t\tif ( file ) {\n\t\t\t\tmediaUpload( {\n\t\t\t\t\tfilesList: [ file ],\n\t\t\t\t\tonFileChange: ( [ media ] ) => onSelectVideo( media ),\n\t\t\t\t\tonError: onUploadError,\n\t\t\t\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\t}, [] );\n\n\tuseEffect( () => {\n\t\t// Placeholder may be rendered.\n\t\tif ( videoPlayer.current ) {\n\t\t\tvideoPlayer.current.load();\n\t\t}\n\t}, [ poster ] );\n\n\tfunction onSelectVideo( media ) {\n\t\tif ( ! media || ! media.url ) {\n\t\t\t// In this case there was an error\n\t\t\t// previous attributes should be removed\n\t\t\t// because they may be temporary blob urls.\n\t\t\tsetAttributes( {\n\t\t\t\tsrc: undefined,\n\t\t\t\tid: undefined,\n\t\t\t\tposter: undefined,\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\t// Sets the block's attribute and updates the edit component from the\n\t\t// selected media.\n\t\tsetAttributes( {\n\t\t\tsrc: media.url,\n\t\t\tid: media.id,\n\t\t\tposter:\n\t\t\t\tmedia.image?.src !== media.icon ? media.image?.src : undefined,\n\t\t} );\n\t}\n\n\tfunction onSelectURL( newSrc ) {\n\t\tif ( newSrc !== src ) {\n\t\t\t// Check if there's an embed block that handles this URL.\n\t\t\tconst embedBlock = createUpgradedEmbedBlock( {\n\t\t\t\tattributes: { url: newSrc },\n\t\t\t} );\n\t\t\tif ( undefined !== embedBlock ) {\n\t\t\t\tonReplace( embedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetAttributes( { src: newSrc, id: undefined, poster: undefined } );\n\t\t}\n\t}\n\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tfunction onUploadError( message ) {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t}\n\n\tconst classes = classnames( className, {\n\t\t'is-transient': isTemporaryVideo,\n\t} );\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classes,\n\t} );\n\n\tif ( ! src ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<MediaPlaceholder\n\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tvalue={ attributes }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tfunction onSelectPoster( image ) {\n\t\tsetAttributes( { poster: image.url } );\n\t}\n\n\tfunction onRemovePoster() {\n\t\tsetAttributes( { poster: undefined } );\n\n\t\t// Move focus back to the Media Upload button.\n\t\tposterImageButton.current.focus();\n\t}\n\n\tconst videoPosterDescription = `video-block__poster-image-description-${ instanceId }`;\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls group=\"block\">\n\t\t\t\t<TracksEditor\n\t\t\t\t\ttracks={ tracks }\n\t\t\t\t\tonChange={ ( newTracks ) => {\n\t\t\t\t\t\tsetAttributes( { tracks: newTracks } );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t\t<BlockControls group=\"other\">\n\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\tmediaId={ id }\n\t\t\t\t\tmediaURL={ src }\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\tonSelectURL={ onSelectURL }\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<PanelBody title={ __( 'Settings' ) }>\n\t\t\t\t\t<VideoCommonSettings\n\t\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\t/>\n\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t<BaseControl className=\"editor-video-poster-control\">\n\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t{ __( 'Poster image' ) }\n\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\t\ttitle={ __( 'Select poster image' ) }\n\t\t\t\t\t\t\t\tonSelect={ onSelectPoster }\n\t\t\t\t\t\t\t\tallowedTypes={\n\t\t\t\t\t\t\t\t\tVIDEO_POSTER_ALLOWED_MEDIA_TYPES\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\t\tonClick={ open }\n\t\t\t\t\t\t\t\t\t\tref={ posterImageButton }\n\t\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\t\tvideoPosterDescription\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ ! poster\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Select' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Replace' ) }\n\t\t\t\t\t\t\t\t\t</Button>\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<p id={ videoPosterDescription } hidden>\n\t\t\t\t\t\t\t\t{ poster\n\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/* translators: %s: poster image URL. */\n\t\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t\t'The current poster image url is %s'\n\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\tposter\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t'There is no poster image currently selected'\n\t\t\t\t\t\t\t\t\t  ) }\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t{ !! poster && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tonClick={ onRemovePoster }\n\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</BaseControl>\n\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t\t<figure { ...blockProps }>\n\t\t\t\t{ /*\n\t\t\t\t\tDisable the video tag if the block is not selected\n\t\t\t\t\tso the user clicking on it won't play the\n\t\t\t\t\tvideo when the controls are enabled.\n\t\t\t\t*/ }\n\t\t\t\t<Disabled isDisabled={ ! isSelected }>\n\t\t\t\t\t<video\n\t\t\t\t\t\tcontrols={ controls }\n\t\t\t\t\t\tposter={ poster }\n\t\t\t\t\t\tsrc={ src }\n\t\t\t\t\t\tref={ videoPlayer }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Tracks tracks={ tracks } />\n\t\t\t\t\t</video>\n\t\t\t\t</Disabled>\n\t\t\t\t{ isTemporaryVideo && <Spinner /> }\n\t\t\t\t{ ( ! RichText.isEmpty( caption ) || isSelected ) && (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\ttagName=\"figcaption\"\n\t\t\t\t\t\tclassName={ __experimentalGetElementClassName(\n\t\t\t\t\t\t\t'caption'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\taria-label={ __( 'Video caption text' ) }\n\t\t\t\t\t\tplaceholder={ __( 'Add caption' ) }\n\t\t\t\t\t\tvalue={ caption }\n\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\tsetAttributes( { caption: value } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tinlineToolbar\n\t\t\t\t\t\t__unstableOnSplitAtEnd={ () =>\n\t\t\t\t\t\t\tinsertBlocksAfter(\n\t\t\t\t\t\t\t\tcreateBlock( getDefaultBlockName() )\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</figure>\n\t\t</>\n\t);\n}\n\nexport default VideoEdit;\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/video/edit.js"],"names":["classnames","getBlobByURL","isBlobURL","BaseControl","Button","Disabled","PanelBody","Spinner","Placeholder","BlockControls","BlockIcon","InspectorControls","MediaPlaceholder","MediaUpload","MediaUploadCheck","MediaReplaceFlow","RichText","useBlockProps","store","blockEditorStore","__experimentalGetElementClassName","useRef","useEffect","__","sprintf","useInstanceId","useDispatch","useSelect","video","icon","createBlock","getDefaultBlockName","noticesStore","createUpgradedEmbedBlock","VideoCommonSettings","TracksEditor","Tracks","placeholder","content","ALLOWED_MEDIA_TYPES","VIDEO_POSTER_ALLOWED_MEDIA_TYPES","VideoEdit","isSelected","attributes","className","setAttributes","insertBlocksAfter","onReplace","instanceId","videoPlayer","posterImageButton","id","caption","controls","poster","src","tracks","isTemporaryVideo","mediaUpload","select","getSettings","file","filesList","onFileChange","media","onSelectVideo","onError","onUploadError","allowedTypes","current","load","url","undefined","image","onSelectURL","newSrc","embedBlock","createErrorNotice","message","type","classes","blockProps","onSelectPoster","onRemovePoster","focus","videoPosterDescription","newTracks","open","isEmpty","value"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { getBlobByURL, isBlobURL } from '@wordpress/blob';\nimport {\n\tBaseControl,\n\tButton,\n\tDisabled,\n\tPanelBody,\n\tSpinner,\n\tPlaceholder,\n} from '@wordpress/components';\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInspectorControls,\n\tMediaPlaceholder,\n\tMediaUpload,\n\tMediaUploadCheck,\n\tMediaReplaceFlow,\n\tRichText,\n\tuseBlockProps,\n\tstore as blockEditorStore,\n\t__experimentalGetElementClassName,\n} from '@wordpress/block-editor';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { video as icon } from '@wordpress/icons';\nimport { createBlock, getDefaultBlockName } from '@wordpress/blocks';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { createUpgradedEmbedBlock } from '../embed/util';\nimport VideoCommonSettings from './edit-common-settings';\nimport TracksEditor from './tracks-editor';\nimport Tracks from './tracks';\n\n// Much of this description is duplicated from MediaPlaceholder.\nconst placeholder = ( content ) => {\n\treturn (\n\t\t<Placeholder\n\t\t\tclassName=\"block-editor-media-placeholder\"\n\t\t\twithIllustration={ true }\n\t\t\ticon={ icon }\n\t\t\tlabel={ __( 'Video' ) }\n\t\t\tinstructions={ __(\n\t\t\t\t'Upload a video file, pick one from your media library, or add one with a URL.'\n\t\t\t) }\n\t\t>\n\t\t\t{ content }\n\t\t</Placeholder>\n\t);\n};\n\nconst ALLOWED_MEDIA_TYPES = [ 'video' ];\nconst VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ];\n\nfunction VideoEdit( {\n\tisSelected,\n\tattributes,\n\tclassName,\n\tsetAttributes,\n\tinsertBlocksAfter,\n\tonReplace,\n} ) {\n\tconst instanceId = useInstanceId( VideoEdit );\n\tconst videoPlayer = useRef();\n\tconst posterImageButton = useRef();\n\tconst { id, caption, controls, poster, src, tracks } = attributes;\n\tconst isTemporaryVideo = ! id && isBlobURL( src );\n\tconst mediaUpload = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings().mediaUpload,\n\t\t[]\n\t);\n\n\tuseEffect( () => {\n\t\tif ( ! id && isBlobURL( src ) ) {\n\t\t\tconst file = getBlobByURL( src );\n\t\t\tif ( file ) {\n\t\t\t\tmediaUpload( {\n\t\t\t\t\tfilesList: [ file ],\n\t\t\t\t\tonFileChange: ( [ media ] ) => onSelectVideo( media ),\n\t\t\t\t\tonError: onUploadError,\n\t\t\t\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\t}, [] );\n\n\tuseEffect( () => {\n\t\t// Placeholder may be rendered.\n\t\tif ( videoPlayer.current ) {\n\t\t\tvideoPlayer.current.load();\n\t\t}\n\t}, [ poster ] );\n\n\tfunction onSelectVideo( media ) {\n\t\tif ( ! media || ! media.url ) {\n\t\t\t// In this case there was an error\n\t\t\t// previous attributes should be removed\n\t\t\t// because they may be temporary blob urls.\n\t\t\tsetAttributes( {\n\t\t\t\tsrc: undefined,\n\t\t\t\tid: undefined,\n\t\t\t\tposter: undefined,\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\t// Sets the block's attribute and updates the edit component from the\n\t\t// selected media.\n\t\tsetAttributes( {\n\t\t\tsrc: media.url,\n\t\t\tid: media.id,\n\t\t\tposter:\n\t\t\t\tmedia.image?.src !== media.icon ? media.image?.src : undefined,\n\t\t} );\n\t}\n\n\tfunction onSelectURL( newSrc ) {\n\t\tif ( newSrc !== src ) {\n\t\t\t// Check if there's an embed block that handles this URL.\n\t\t\tconst embedBlock = createUpgradedEmbedBlock( {\n\t\t\t\tattributes: { url: newSrc },\n\t\t\t} );\n\t\t\tif ( undefined !== embedBlock ) {\n\t\t\t\tonReplace( embedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetAttributes( { src: newSrc, id: undefined, poster: undefined } );\n\t\t}\n\t}\n\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tfunction onUploadError( message ) {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t}\n\n\tconst classes = classnames( className, {\n\t\t'is-transient': isTemporaryVideo,\n\t} );\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classes,\n\t} );\n\n\tif ( ! src ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<MediaPlaceholder\n\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tvalue={ attributes }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tfunction onSelectPoster( image ) {\n\t\tsetAttributes( { poster: image.url } );\n\t}\n\n\tfunction onRemovePoster() {\n\t\tsetAttributes( { poster: undefined } );\n\n\t\t// Move focus back to the Media Upload button.\n\t\tposterImageButton.current.focus();\n\t}\n\n\tconst videoPosterDescription = `video-block__poster-image-description-${ instanceId }`;\n\n\treturn (\n\t\t<>\n\t\t\t<BlockControls group=\"block\">\n\t\t\t\t<TracksEditor\n\t\t\t\t\ttracks={ tracks }\n\t\t\t\t\tonChange={ ( newTracks ) => {\n\t\t\t\t\t\tsetAttributes( { tracks: newTracks } );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</BlockControls>\n\t\t\t<BlockControls group=\"other\">\n\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\tmediaId={ id }\n\t\t\t\t\tmediaURL={ src }\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\tonSelectURL={ onSelectURL }\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<PanelBody title={ __( 'Settings' ) }>\n\t\t\t\t\t<VideoCommonSettings\n\t\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\t/>\n\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t<BaseControl className=\"editor-video-poster-control\">\n\t\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t{ __( 'Poster image' ) }\n\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\t\ttitle={ __( 'Select poster image' ) }\n\t\t\t\t\t\t\t\tonSelect={ onSelectPoster }\n\t\t\t\t\t\t\t\tallowedTypes={\n\t\t\t\t\t\t\t\t\tVIDEO_POSTER_ALLOWED_MEDIA_TYPES\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\t\tonClick={ open }\n\t\t\t\t\t\t\t\t\t\tref={ posterImageButton }\n\t\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\t\tvideoPosterDescription\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ ! poster\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Select' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Replace' ) }\n\t\t\t\t\t\t\t\t\t</Button>\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<p id={ videoPosterDescription } hidden>\n\t\t\t\t\t\t\t\t{ poster\n\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/* translators: %s: poster image URL. */\n\t\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t\t'The current poster image url is %s'\n\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\tposter\n\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t'There is no poster image currently selected'\n\t\t\t\t\t\t\t\t\t  ) }\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t{ !! poster && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tonClick={ onRemovePoster }\n\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</BaseControl>\n\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t\t<figure { ...blockProps }>\n\t\t\t\t{ /*\n\t\t\t\t\tDisable the video tag if the block is not selected\n\t\t\t\t\tso the user clicking on it won't play the\n\t\t\t\t\tvideo when the controls are enabled.\n\t\t\t\t*/ }\n\t\t\t\t<Disabled isDisabled={ ! isSelected }>\n\t\t\t\t\t<video\n\t\t\t\t\t\tcontrols={ controls }\n\t\t\t\t\t\tposter={ poster }\n\t\t\t\t\t\tsrc={ src }\n\t\t\t\t\t\tref={ videoPlayer }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Tracks tracks={ tracks } />\n\t\t\t\t\t</video>\n\t\t\t\t</Disabled>\n\t\t\t\t{ isTemporaryVideo && <Spinner /> }\n\t\t\t\t{ ( ! RichText.isEmpty( caption ) || isSelected ) && (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\ttagName=\"figcaption\"\n\t\t\t\t\t\tclassName={ __experimentalGetElementClassName(\n\t\t\t\t\t\t\t'caption'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\taria-label={ __( 'Video caption text' ) }\n\t\t\t\t\t\tplaceholder={ __( 'Add caption' ) }\n\t\t\t\t\t\tvalue={ caption }\n\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\tsetAttributes( { caption: value } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tinlineToolbar\n\t\t\t\t\t\t__unstableOnSplitAtEnd={ () =>\n\t\t\t\t\t\t\tinsertBlocksAfter(\n\t\t\t\t\t\t\t\tcreateBlock( getDefaultBlockName() )\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</figure>\n\t\t</>\n\t);\n}\n\nexport default VideoEdit;\n"]}

package/build-style/classic-rtl.css

@@ -0,0 +1,85 @@
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+.wp-block-button__link {
+  color: #fff;
+  background-color: #32373c;
+  border-radius: 9999px;
+  box-shadow: none;
+  text-decoration: none;
+  padding: calc(0.667em + 2px) calc(1.333em + 2px);
+  font-size: 1.125em;
+}

package/build-style/classic.css

@@ -0,0 +1,85 @@
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+.wp-block-button__link {
+  color: #fff;
+  background-color: #32373c;
+  border-radius: 9999px;
+  box-shadow: none;
+  text-decoration: none;
+  padding: calc(0.667em + 2px) calc(1.333em + 2px);
+  font-size: 1.125em;
+}

package/build-style/code/style-rtl.css

@@ -74,6 +74,9 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-code {
+  box-sizing: border-box;
+}
 .wp-block-code code {
   display: block;
   font-family: inherit;

package/build-style/code/style.css

@@ -74,6 +74,9 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-code {
+  box-sizing: border-box;
+}
 .wp-block-code code {
   display: block;
   font-family: inherit;

package/build-style/editor-rtl.css

@@ -1104,9 +1104,19 @@ figure.wp-block-gallery .components-spinner {
   flex: 1 0 48px;
   pointer-events: none;
   min-height: 46px;
-  border: 1px dashed currentColor;
   border-radius: 2px;
 }
+.wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  pointer-events: none;
+  background: currentColor;
+  opacity: 0.1;
+}
 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-inserter {
   pointer-events: all;
 }
@@ -1155,6 +1165,9 @@ figure.wp-block-gallery .components-spinner {
 .wp-block-image.wp-block-image.is-selected .components-placeholder .components-placeholder__illustration {
   display: none;
 }
+.wp-block-image.wp-block-image.is-selected .components-placeholder::before {
+  opacity: 0;
+}
 .wp-block-image.wp-block-image .components-placeholder__label,
 .wp-block-image.wp-block-image .components-placeholder__instructions,
 .wp-block-image.wp-block-image .components-button {
@@ -1592,10 +1605,20 @@ figure.wp-block-image:not(.wp-block) {
   bottom: 0;
   right: 0;
   pointer-events: none;
-  border: 1px dashed currentColor;
   border-radius: 2px;
   border-radius: inherit;
 }
+.wp-block-navigation-placeholder__preview::before::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  pointer-events: none;
+  background: currentColor;
+  opacity: 0.1;
+}
 .wp-block-navigation-placeholder__preview > svg {
   fill: currentColor;
 }
@@ -1854,6 +1877,10 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   width: 100%;
 }
 
+.wp-block-navigation__responsive-container-open.components-button {
+  opacity: 1;
+}
+
 /**
  * Submenus.
  */
@@ -2074,6 +2101,22 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   opacity: 0;
 }
 
+.components-popover.wp-block-paragraph__drop-zone .components-popover__content {
+  border: none;
+  outline: none;
+  box-shadow: none;
+}
+.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-backdrop {
+  position: absolute;
+}
+.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-foreground {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  background-color: var(--wp-admin-theme-color);
+  border-radius: 2px;
+}
+
 .wp-block-post-excerpt .wp-block-post-excerpt__excerpt.is-inline {
   display: inline-block;
 }
@@ -2268,6 +2311,10 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   border: 1px dashed;
 }
 
+.editor-styles-wrapper .wp-block-site-title a {
+  color: inherit;
+}
+
 .wp-block-social-links .wp-social-link {
   line-height: 0;
 }
@@ -2523,6 +2570,28 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   outline: 1px solid #ddd;
 }
 
+.wp-block-video.wp-block-video.is-selected .components-placeholder {
+  color: #1e1e1e;
+  background-color: #fff;
+  box-shadow: inset 0 0 0 1px #1e1e1e;
+  border: none;
+  border-radius: 2px;
+}
+.wp-block-video.wp-block-video.is-selected .components-placeholder > svg {
+  opacity: 0;
+}
+.wp-block-video.wp-block-video.is-selected .components-placeholder .components-placeholder__illustration {
+  display: none;
+}
+.wp-block-video.wp-block-video.is-selected .components-placeholder::before {
+  opacity: 0;
+}
+.wp-block-video.wp-block-video .components-placeholder__label,
+.wp-block-video.wp-block-video .components-placeholder__instructions,
+.wp-block-video.wp-block-video .components-button {
+  transition: none;
+}
+
 .wp-block[data-align=center] > .wp-block-video {
   text-align: center;
 }
@@ -2719,19 +2788,19 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   -webkit-backdrop-filter: none;
           backdrop-filter: none;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder,
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder,
+.wp-block-post-featured-image .components-placeholder {
   justify-content: center;
   align-items: center;
   padding: 0;
   min-height: 200px;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-form-file-upload,
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder .components-form-file-upload {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-form-file-upload,
+.wp-block-post-featured-image .components-placeholder .components-form-file-upload {
   display: none;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button.components-button,
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder .components-button.components-button {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button,
+.wp-block-post-featured-image .components-placeholder .components-button {
   padding: 0;
   display: flex;
   justify-content: center;
@@ -2745,51 +2814,61 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   border-style: solid;
   color: #fff;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button.components-button > svg,
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder .components-button.components-button > svg {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button > svg,
+.wp-block-post-featured-image .components-placeholder .components-button > svg {
   color: inherit;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where(.has-border-color),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where(.has-border-color) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where(.has-border-color),
+.wp-block-post-featured-image .components-placeholder:where(.has-border-color),
+.wp-block-post-featured-image img:where(.has-border-color) {
   border-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-top-color"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-top-color"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-top-color"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-top-color"]),
+.wp-block-post-featured-image img:where([style*="border-top-color"]) {
   border-top-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-right-color"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-right-color"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-right-color"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-right-color"]),
+.wp-block-post-featured-image img:where([style*="border-right-color"]) {
   border-left-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-bottom-color"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-bottom-color"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-bottom-color"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-bottom-color"]),
+.wp-block-post-featured-image img:where([style*="border-bottom-color"]) {
   border-bottom-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-left-color"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-left-color"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-left-color"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-left-color"]),
+.wp-block-post-featured-image img:where([style*="border-left-color"]) {
   border-right-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-width"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-width"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-width"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-width"]),
+.wp-block-post-featured-image img:where([style*="border-width"]) {
   border-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-top-width"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-top-width"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-top-width"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-top-width"]),
+.wp-block-post-featured-image img:where([style*="border-top-width"]) {
   border-top-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-right-width"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-right-width"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-right-width"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-right-width"]),
+.wp-block-post-featured-image img:where([style*="border-right-width"]) {
   border-left-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-bottom-width"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-bottom-width"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-bottom-width"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-bottom-width"]),
+.wp-block-post-featured-image img:where([style*="border-bottom-width"]) {
   border-bottom-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-left-width"]),
-.wp-block-post-featured-image.wp-block-post-featured-image .components-placeholder:where([style*="border-left-width"]) {
+.wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*="border-left-width"]),
+.wp-block-post-featured-image .components-placeholder:where([style*="border-left-width"]),
+.wp-block-post-featured-image img:where([style*="border-left-width"]) {
   border-right-style: solid;
 }
-.wp-block-post-featured-image.wp-block-post-featured-image[style*=height] .components-placeholder {
+.wp-block-post-featured-image[style*=height] .components-placeholder {
   min-height: 48px;
   min-width: 48px;
   height: 100%;