@wordpress/block-library 7.19.0 → 8.0.0

package/build-module/media-text/edit.js

@@ -4,7 +4,7 @@ import { createElement, Fragment } from "@wordpress/element";
  * External dependencies
  */
 import classnames from 'classnames';
-import { map, filter } from 'lodash';
+import { map } from 'lodash';
 /**
  * WordPress dependencies
  */
@@ -195,7 +195,7 @@ function MediaTextEdit(_ref2) {
     setAttributes({
       mediaWidth: applyWidthConstraints(width)
     });
-    setTemporaryMediaWidth(applyWidthConstraints(width));
+    setTemporaryMediaWidth(null);
   };
 
   const classNames = classnames({
@@ -224,7 +224,7 @@ function MediaTextEdit(_ref2) {
     });
   };
 
-  const imageSizeOptions = map(filter(imageSizes, _ref3 => {
+  const imageSizeOptions = map(imageSizes.filter(_ref3 => {
     let {
       slug
     } = _ref3;
@@ -268,6 +268,7 @@ function MediaTextEdit(_ref2) {
       imageFill: !imageFill
     })
   }), imageFill && mediaUrl && mediaType === 'image' && createElement(FocalPointPicker, {
+    __nextHasNoMarginBottom: true,
     label: __('Focal point picker'),
     url: mediaUrl,
     value: focalPoint,
@@ -290,6 +291,7 @@ function MediaTextEdit(_ref2) {
     isResizable: false,
     imageSizeHelp: __('Select which image size to load.')
   }), mediaUrl && createElement(RangeControl, {
+    __nextHasNoMarginBottom: true,
     label: __('Media width'),
     value: temporaryMediaWidth || mediaWidth,
     onChange: commitWidthChange,

package/build-module/media-text/edit.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/media-text/edit.js"],"names":["classnames","map","filter","__","_x","useSelect","useState","useRef","BlockControls","BlockVerticalAlignmentControl","useInnerBlocksProps","InspectorControls","useBlockProps","__experimentalImageURLInputUI","ImageURLInputUI","__experimentalImageSizeControl","ImageSizeControl","store","blockEditorStore","PanelBody","RangeControl","TextareaControl","ToggleControl","ToolbarButton","ExternalLink","FocalPointPicker","isBlobURL","getBlobTypeByURL","pullLeft","pullRight","coreStore","MediaContainer","DEFAULT_MEDIA_SIZE_SLUG","TEMPLATE","placeholder","WIDTH_CONSTRAINT_PERCENTAGE","applyWidthConstraints","width","Math","max","min","LINK_DESTINATION_MEDIA","LINK_DESTINATION_ATTACHMENT","getImageSourceUrlBySizeSlug","image","slug","media_details","sizes","source_url","attributesFromMedia","attributes","linkDestination","href","setAttributes","media","url","mediaAlt","undefined","mediaId","mediaType","mediaUrl","mediaLink","focalPoint","type","src","media_type","large","newHref","link","alt","id","MediaTextEdit","isSelected","clientId","imageFill","isStackedOnMobile","linkClass","linkTarget","mediaPosition","mediaWidth","rel","verticalAlignment","mediaSizeSlug","imageSizes","isContentLocked","select","__unstableGetContentLockingParent","getSettings","getMedia","context","refMediaContainer","imperativeFocalPointPreview","value","style","current","resizable","x","y","backgroundPosition","temporaryMediaWidth","setTemporaryMediaWidth","onSelectMedia","onSetHref","props","onWidthChange","commitWidthChange","classNames","widthString","gridTemplateColumns","msGridColumns","onMediaAltChange","newMediaAlt","onVerticalAlignmentChange","alignment","imageSizeOptions","name","label","updateImage","newMediaSizeSlug","newUrl","mediaTextGeneralSettings","blockProps","className","innerBlocksProps","template"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { map, filter } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __, _x } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useRef } from '@wordpress/element';\nimport {\n\tBlockControls,\n\tBlockVerticalAlignmentControl,\n\tuseInnerBlocksProps,\n\tInspectorControls,\n\tuseBlockProps,\n\t__experimentalImageURLInputUI as ImageURLInputUI,\n\t__experimentalImageSizeControl as ImageSizeControl,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport {\n\tPanelBody,\n\tRangeControl,\n\tTextareaControl,\n\tToggleControl,\n\tToolbarButton,\n\tExternalLink,\n\tFocalPointPicker,\n} from '@wordpress/components';\nimport { isBlobURL, getBlobTypeByURL } from '@wordpress/blob';\nimport { pullLeft, pullRight } from '@wordpress/icons';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport MediaContainer from './media-container';\nimport { DEFAULT_MEDIA_SIZE_SLUG } from './constants';\n\n/**\n * Constants\n */\nconst TEMPLATE = [\n\t[\n\t\t'core/paragraph',\n\t\t{\n\t\t\tplaceholder: _x( 'Content…', 'content placeholder' ),\n\t\t},\n\t],\n];\n\n// this limits the resize to a safe zone to avoid making broken layouts\nconst WIDTH_CONSTRAINT_PERCENTAGE = 15;\nconst applyWidthConstraints = ( width ) =>\n\tMath.max(\n\t\tWIDTH_CONSTRAINT_PERCENTAGE,\n\t\tMath.min( width, 100 - WIDTH_CONSTRAINT_PERCENTAGE )\n\t);\n\nconst LINK_DESTINATION_MEDIA = 'media';\nconst LINK_DESTINATION_ATTACHMENT = 'attachment';\n\nfunction getImageSourceUrlBySizeSlug( image, slug ) {\n\t// eslint-disable-next-line camelcase\n\treturn image?.media_details?.sizes?.[ slug ]?.source_url;\n}\n\nfunction attributesFromMedia( {\n\tattributes: { linkDestination, href },\n\tsetAttributes,\n} ) {\n\treturn ( media ) => {\n\t\tif ( ! media || ! media.url ) {\n\t\t\tsetAttributes( {\n\t\t\t\tmediaAlt: undefined,\n\t\t\t\tmediaId: undefined,\n\t\t\t\tmediaType: undefined,\n\t\t\t\tmediaUrl: undefined,\n\t\t\t\tmediaLink: undefined,\n\t\t\t\thref: undefined,\n\t\t\t\tfocalPoint: undefined,\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tmedia.type = getBlobTypeByURL( media.url );\n\t\t}\n\n\t\tlet mediaType;\n\t\tlet src;\n\t\t// For media selections originated from a file upload.\n\t\tif ( media.media_type ) {\n\t\t\tif ( media.media_type === 'image' ) {\n\t\t\t\tmediaType = 'image';\n\t\t\t} else {\n\t\t\t\t// only images and videos are accepted so if the media_type is not an image we can assume it is a video.\n\t\t\t\t// video contain the media type of 'file' in the object returned from the rest api.\n\t\t\t\tmediaType = 'video';\n\t\t\t}\n\t\t} else {\n\t\t\t// For media selections originated from existing files in the media library.\n\t\t\tmediaType = media.type;\n\t\t}\n\n\t\tif ( mediaType === 'image' ) {\n\t\t\t// Try the \"large\" size URL, falling back to the \"full\" size URL below.\n\t\t\tsrc =\n\t\t\t\tmedia.sizes?.large?.url ||\n\t\t\t\t// eslint-disable-next-line camelcase\n\t\t\t\tmedia.media_details?.sizes?.large?.source_url;\n\t\t}\n\n\t\tlet newHref = href;\n\t\tif ( linkDestination === LINK_DESTINATION_MEDIA ) {\n\t\t\t// Update the media link.\n\t\t\tnewHref = media.url;\n\t\t}\n\n\t\t// Check if the image is linked to the attachment page.\n\t\tif ( linkDestination === LINK_DESTINATION_ATTACHMENT ) {\n\t\t\t// Update the media link.\n\t\t\tnewHref = media.link;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tmediaAlt: media.alt,\n\t\t\tmediaId: media.id,\n\t\t\tmediaType,\n\t\t\tmediaUrl: src || media.url,\n\t\t\tmediaLink: media.link || undefined,\n\t\t\thref: newHref,\n\t\t\tfocalPoint: undefined,\n\t\t} );\n\t};\n}\n\nfunction MediaTextEdit( { attributes, isSelected, setAttributes, clientId } ) {\n\tconst {\n\t\tfocalPoint,\n\t\thref,\n\t\timageFill,\n\t\tisStackedOnMobile,\n\t\tlinkClass,\n\t\tlinkDestination,\n\t\tlinkTarget,\n\t\tmediaAlt,\n\t\tmediaId,\n\t\tmediaPosition,\n\t\tmediaType,\n\t\tmediaUrl,\n\t\tmediaWidth,\n\t\trel,\n\t\tverticalAlignment,\n\t} = attributes;\n\tconst mediaSizeSlug = attributes.mediaSizeSlug || DEFAULT_MEDIA_SIZE_SLUG;\n\n\tconst { imageSizes, image, isContentLocked } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { __unstableGetContentLockingParent, getSettings } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tisContentLocked:\n\t\t\t\t\t!! __unstableGetContentLockingParent( clientId ),\n\t\t\t\timage:\n\t\t\t\t\tmediaId && isSelected\n\t\t\t\t\t\t? select( coreStore ).getMedia( mediaId, {\n\t\t\t\t\t\t\t\tcontext: 'view',\n\t\t\t\t\t\t  } )\n\t\t\t\t\t\t: null,\n\t\t\t\timageSizes: getSettings()?.imageSizes,\n\t\t\t};\n\t\t},\n\n\t\t[ isSelected, mediaId, clientId ]\n\t);\n\n\tconst refMediaContainer = useRef();\n\tconst imperativeFocalPointPreview = ( value ) => {\n\t\tconst { style } = refMediaContainer.current.resizable;\n\t\tconst { x, y } = value;\n\t\tstyle.backgroundPosition = `${ x * 100 }% ${ y * 100 }%`;\n\t};\n\n\tconst [ temporaryMediaWidth, setTemporaryMediaWidth ] = useState( null );\n\n\tconst onSelectMedia = attributesFromMedia( { attributes, setAttributes } );\n\n\tconst onSetHref = ( props ) => {\n\t\tsetAttributes( props );\n\t};\n\n\tconst onWidthChange = ( width ) => {\n\t\tsetTemporaryMediaWidth( applyWidthConstraints( width ) );\n\t};\n\tconst commitWidthChange = ( width ) => {\n\t\tsetAttributes( {\n\t\t\tmediaWidth: applyWidthConstraints( width ),\n\t\t} );\n\t\tsetTemporaryMediaWidth( applyWidthConstraints( width ) );\n\t};\n\n\tconst classNames = classnames( {\n\t\t'has-media-on-the-right': 'right' === mediaPosition,\n\t\t'is-selected': isSelected,\n\t\t'is-stacked-on-mobile': isStackedOnMobile,\n\t\t[ `is-vertically-aligned-${ verticalAlignment }` ]: verticalAlignment,\n\t\t'is-image-fill': imageFill,\n\t} );\n\tconst widthString = `${ temporaryMediaWidth || mediaWidth }%`;\n\tconst gridTemplateColumns =\n\t\t'right' === mediaPosition\n\t\t\t? `1fr ${ widthString }`\n\t\t\t: `${ widthString } 1fr`;\n\tconst style = {\n\t\tgridTemplateColumns,\n\t\tmsGridColumns: gridTemplateColumns,\n\t};\n\tconst onMediaAltChange = ( newMediaAlt ) => {\n\t\tsetAttributes( { mediaAlt: newMediaAlt } );\n\t};\n\tconst onVerticalAlignmentChange = ( alignment ) => {\n\t\tsetAttributes( { verticalAlignment: alignment } );\n\t};\n\n\tconst imageSizeOptions = map(\n\t\tfilter( imageSizes, ( { slug } ) =>\n\t\t\tgetImageSourceUrlBySizeSlug( image, slug )\n\t\t),\n\t\t( { name, slug } ) => ( { value: slug, label: name } )\n\t);\n\tconst updateImage = ( newMediaSizeSlug ) => {\n\t\tconst newUrl = getImageSourceUrlBySizeSlug( image, newMediaSizeSlug );\n\n\t\tif ( ! newUrl ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tmediaUrl: newUrl,\n\t\t\tmediaSizeSlug: newMediaSizeSlug,\n\t\t} );\n\t};\n\n\tconst mediaTextGeneralSettings = (\n\t\t<PanelBody title={ __( 'Settings' ) }>\n\t\t\t<ToggleControl\n\t\t\t\tlabel={ __( 'Stack on mobile' ) }\n\t\t\t\tchecked={ isStackedOnMobile }\n\t\t\t\tonChange={ () =>\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\tisStackedOnMobile: ! isStackedOnMobile,\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ mediaType === 'image' && (\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Crop image to fill entire column' ) }\n\t\t\t\t\tchecked={ imageFill }\n\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\timageFill: ! imageFill,\n\t\t\t\t\t\t} )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ imageFill && mediaUrl && mediaType === 'image' && (\n\t\t\t\t<FocalPointPicker\n\t\t\t\t\tlabel={ __( 'Focal point picker' ) }\n\t\t\t\t\turl={ mediaUrl }\n\t\t\t\t\tvalue={ focalPoint }\n\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\tsetAttributes( { focalPoint: value } )\n\t\t\t\t\t}\n\t\t\t\t\tonDragStart={ imperativeFocalPointPreview }\n\t\t\t\t\tonDrag={ imperativeFocalPointPreview }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ mediaType === 'image' && (\n\t\t\t\t<TextareaControl\n\t\t\t\t\tlabel={ __( 'Alt text (alternative text)' ) }\n\t\t\t\t\tvalue={ mediaAlt }\n\t\t\t\t\tonChange={ onMediaAltChange }\n\t\t\t\t\thelp={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<ExternalLink href=\"https://www.w3.org/WAI/tutorials/images/decision-tree\">\n\t\t\t\t\t\t\t\t{ __( 'Describe the purpose of the image' ) }\n\t\t\t\t\t\t\t</ExternalLink>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Leave empty if the image is purely decorative.'\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) }\n\t\t\t{ mediaType === 'image' && (\n\t\t\t\t<ImageSizeControl\n\t\t\t\t\tonChangeImage={ updateImage }\n\t\t\t\t\tslug={ mediaSizeSlug }\n\t\t\t\t\timageSizeOptions={ imageSizeOptions }\n\t\t\t\t\tisResizable={ false }\n\t\t\t\t\timageSizeHelp={ __( 'Select which image size to load.' ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ mediaUrl && (\n\t\t\t\t<RangeControl\n\t\t\t\t\tlabel={ __( 'Media width' ) }\n\t\t\t\t\tvalue={ temporaryMediaWidth || mediaWidth }\n\t\t\t\t\tonChange={ commitWidthChange }\n\t\t\t\t\tmin={ WIDTH_CONSTRAINT_PERCENTAGE }\n\t\t\t\t\tmax={ 100 - WIDTH_CONSTRAINT_PERCENTAGE }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</PanelBody>\n\t);\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classNames,\n\t\tstyle,\n\t} );\n\n\tconst innerBlocksProps = useInnerBlocksProps(\n\t\t{ className: 'wp-block-media-text__content' },\n\t\t{ template: TEMPLATE }\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls>{ mediaTextGeneralSettings }</InspectorControls>\n\t\t\t<BlockControls group=\"block\">\n\t\t\t\t{ ! isContentLocked && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<BlockVerticalAlignmentControl\n\t\t\t\t\t\t\tonChange={ onVerticalAlignmentChange }\n\t\t\t\t\t\t\tvalue={ verticalAlignment }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\t\ticon={ pullLeft }\n\t\t\t\t\t\t\ttitle={ __( 'Show media on left' ) }\n\t\t\t\t\t\t\tisActive={ mediaPosition === 'left' }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { mediaPosition: 'left' } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\t\ticon={ pullRight }\n\t\t\t\t\t\t\ttitle={ __( 'Show media on right' ) }\n\t\t\t\t\t\t\tisActive={ mediaPosition === 'right' }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { mediaPosition: 'right' } )\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\n\t\t\t\t{ mediaType === 'image' && (\n\t\t\t\t\t<ImageURLInputUI\n\t\t\t\t\t\turl={ href || '' }\n\t\t\t\t\t\tonChangeUrl={ onSetHref }\n\t\t\t\t\t\tlinkDestination={ linkDestination }\n\t\t\t\t\t\tmediaType={ mediaType }\n\t\t\t\t\t\tmediaUrl={ image && image.source_url }\n\t\t\t\t\t\tmediaLink={ image && image.link }\n\t\t\t\t\t\tlinkTarget={ linkTarget }\n\t\t\t\t\t\tlinkClass={ linkClass }\n\t\t\t\t\t\trel={ rel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</BlockControls>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ mediaPosition === 'right' && <div { ...innerBlocksProps } /> }\n\t\t\t\t<MediaContainer\n\t\t\t\t\tclassName=\"wp-block-media-text__media\"\n\t\t\t\t\tonSelectMedia={ onSelectMedia }\n\t\t\t\t\tonWidthChange={ onWidthChange }\n\t\t\t\t\tcommitWidthChange={ commitWidthChange }\n\t\t\t\t\tref={ refMediaContainer }\n\t\t\t\t\t{ ...{\n\t\t\t\t\t\tfocalPoint,\n\t\t\t\t\t\timageFill,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisStackedOnMobile,\n\t\t\t\t\t\tmediaAlt,\n\t\t\t\t\t\tmediaId,\n\t\t\t\t\t\tmediaPosition,\n\t\t\t\t\t\tmediaType,\n\t\t\t\t\t\tmediaUrl,\n\t\t\t\t\t\tmediaWidth,\n\t\t\t\t\t\tisContentLocked,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t{ mediaPosition !== 'right' && <div { ...innerBlocksProps } /> }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default MediaTextEdit;\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/media-text/edit.js"],"names":["classnames","map","__","_x","useSelect","useState","useRef","BlockControls","BlockVerticalAlignmentControl","useInnerBlocksProps","InspectorControls","useBlockProps","__experimentalImageURLInputUI","ImageURLInputUI","__experimentalImageSizeControl","ImageSizeControl","store","blockEditorStore","PanelBody","RangeControl","TextareaControl","ToggleControl","ToolbarButton","ExternalLink","FocalPointPicker","isBlobURL","getBlobTypeByURL","pullLeft","pullRight","coreStore","MediaContainer","DEFAULT_MEDIA_SIZE_SLUG","TEMPLATE","placeholder","WIDTH_CONSTRAINT_PERCENTAGE","applyWidthConstraints","width","Math","max","min","LINK_DESTINATION_MEDIA","LINK_DESTINATION_ATTACHMENT","getImageSourceUrlBySizeSlug","image","slug","media_details","sizes","source_url","attributesFromMedia","attributes","linkDestination","href","setAttributes","media","url","mediaAlt","undefined","mediaId","mediaType","mediaUrl","mediaLink","focalPoint","type","src","media_type","large","newHref","link","alt","id","MediaTextEdit","isSelected","clientId","imageFill","isStackedOnMobile","linkClass","linkTarget","mediaPosition","mediaWidth","rel","verticalAlignment","mediaSizeSlug","imageSizes","isContentLocked","select","__unstableGetContentLockingParent","getSettings","getMedia","context","refMediaContainer","imperativeFocalPointPreview","value","style","current","resizable","x","y","backgroundPosition","temporaryMediaWidth","setTemporaryMediaWidth","onSelectMedia","onSetHref","props","onWidthChange","commitWidthChange","classNames","widthString","gridTemplateColumns","msGridColumns","onMediaAltChange","newMediaAlt","onVerticalAlignmentChange","alignment","imageSizeOptions","filter","name","label","updateImage","newMediaSizeSlug","newUrl","mediaTextGeneralSettings","blockProps","className","innerBlocksProps","template"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { map } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __, _x } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useRef } from '@wordpress/element';\nimport {\n\tBlockControls,\n\tBlockVerticalAlignmentControl,\n\tuseInnerBlocksProps,\n\tInspectorControls,\n\tuseBlockProps,\n\t__experimentalImageURLInputUI as ImageURLInputUI,\n\t__experimentalImageSizeControl as ImageSizeControl,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport {\n\tPanelBody,\n\tRangeControl,\n\tTextareaControl,\n\tToggleControl,\n\tToolbarButton,\n\tExternalLink,\n\tFocalPointPicker,\n} from '@wordpress/components';\nimport { isBlobURL, getBlobTypeByURL } from '@wordpress/blob';\nimport { pullLeft, pullRight } from '@wordpress/icons';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport MediaContainer from './media-container';\nimport { DEFAULT_MEDIA_SIZE_SLUG } from './constants';\n\n/**\n * Constants\n */\nconst TEMPLATE = [\n\t[\n\t\t'core/paragraph',\n\t\t{\n\t\t\tplaceholder: _x( 'Content…', 'content placeholder' ),\n\t\t},\n\t],\n];\n\n// this limits the resize to a safe zone to avoid making broken layouts\nconst WIDTH_CONSTRAINT_PERCENTAGE = 15;\nconst applyWidthConstraints = ( width ) =>\n\tMath.max(\n\t\tWIDTH_CONSTRAINT_PERCENTAGE,\n\t\tMath.min( width, 100 - WIDTH_CONSTRAINT_PERCENTAGE )\n\t);\n\nconst LINK_DESTINATION_MEDIA = 'media';\nconst LINK_DESTINATION_ATTACHMENT = 'attachment';\n\nfunction getImageSourceUrlBySizeSlug( image, slug ) {\n\t// eslint-disable-next-line camelcase\n\treturn image?.media_details?.sizes?.[ slug ]?.source_url;\n}\n\nfunction attributesFromMedia( {\n\tattributes: { linkDestination, href },\n\tsetAttributes,\n} ) {\n\treturn ( media ) => {\n\t\tif ( ! media || ! media.url ) {\n\t\t\tsetAttributes( {\n\t\t\t\tmediaAlt: undefined,\n\t\t\t\tmediaId: undefined,\n\t\t\t\tmediaType: undefined,\n\t\t\t\tmediaUrl: undefined,\n\t\t\t\tmediaLink: undefined,\n\t\t\t\thref: undefined,\n\t\t\t\tfocalPoint: undefined,\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tmedia.type = getBlobTypeByURL( media.url );\n\t\t}\n\n\t\tlet mediaType;\n\t\tlet src;\n\t\t// For media selections originated from a file upload.\n\t\tif ( media.media_type ) {\n\t\t\tif ( media.media_type === 'image' ) {\n\t\t\t\tmediaType = 'image';\n\t\t\t} else {\n\t\t\t\t// only images and videos are accepted so if the media_type is not an image we can assume it is a video.\n\t\t\t\t// video contain the media type of 'file' in the object returned from the rest api.\n\t\t\t\tmediaType = 'video';\n\t\t\t}\n\t\t} else {\n\t\t\t// For media selections originated from existing files in the media library.\n\t\t\tmediaType = media.type;\n\t\t}\n\n\t\tif ( mediaType === 'image' ) {\n\t\t\t// Try the \"large\" size URL, falling back to the \"full\" size URL below.\n\t\t\tsrc =\n\t\t\t\tmedia.sizes?.large?.url ||\n\t\t\t\t// eslint-disable-next-line camelcase\n\t\t\t\tmedia.media_details?.sizes?.large?.source_url;\n\t\t}\n\n\t\tlet newHref = href;\n\t\tif ( linkDestination === LINK_DESTINATION_MEDIA ) {\n\t\t\t// Update the media link.\n\t\t\tnewHref = media.url;\n\t\t}\n\n\t\t// Check if the image is linked to the attachment page.\n\t\tif ( linkDestination === LINK_DESTINATION_ATTACHMENT ) {\n\t\t\t// Update the media link.\n\t\t\tnewHref = media.link;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tmediaAlt: media.alt,\n\t\t\tmediaId: media.id,\n\t\t\tmediaType,\n\t\t\tmediaUrl: src || media.url,\n\t\t\tmediaLink: media.link || undefined,\n\t\t\thref: newHref,\n\t\t\tfocalPoint: undefined,\n\t\t} );\n\t};\n}\n\nfunction MediaTextEdit( { attributes, isSelected, setAttributes, clientId } ) {\n\tconst {\n\t\tfocalPoint,\n\t\thref,\n\t\timageFill,\n\t\tisStackedOnMobile,\n\t\tlinkClass,\n\t\tlinkDestination,\n\t\tlinkTarget,\n\t\tmediaAlt,\n\t\tmediaId,\n\t\tmediaPosition,\n\t\tmediaType,\n\t\tmediaUrl,\n\t\tmediaWidth,\n\t\trel,\n\t\tverticalAlignment,\n\t} = attributes;\n\tconst mediaSizeSlug = attributes.mediaSizeSlug || DEFAULT_MEDIA_SIZE_SLUG;\n\n\tconst { imageSizes, image, isContentLocked } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { __unstableGetContentLockingParent, getSettings } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tisContentLocked:\n\t\t\t\t\t!! __unstableGetContentLockingParent( clientId ),\n\t\t\t\timage:\n\t\t\t\t\tmediaId && isSelected\n\t\t\t\t\t\t? select( coreStore ).getMedia( mediaId, {\n\t\t\t\t\t\t\t\tcontext: 'view',\n\t\t\t\t\t\t  } )\n\t\t\t\t\t\t: null,\n\t\t\t\timageSizes: getSettings()?.imageSizes,\n\t\t\t};\n\t\t},\n\n\t\t[ isSelected, mediaId, clientId ]\n\t);\n\n\tconst refMediaContainer = useRef();\n\tconst imperativeFocalPointPreview = ( value ) => {\n\t\tconst { style } = refMediaContainer.current.resizable;\n\t\tconst { x, y } = value;\n\t\tstyle.backgroundPosition = `${ x * 100 }% ${ y * 100 }%`;\n\t};\n\n\tconst [ temporaryMediaWidth, setTemporaryMediaWidth ] = useState( null );\n\n\tconst onSelectMedia = attributesFromMedia( { attributes, setAttributes } );\n\n\tconst onSetHref = ( props ) => {\n\t\tsetAttributes( props );\n\t};\n\n\tconst onWidthChange = ( width ) => {\n\t\tsetTemporaryMediaWidth( applyWidthConstraints( width ) );\n\t};\n\tconst commitWidthChange = ( width ) => {\n\t\tsetAttributes( {\n\t\t\tmediaWidth: applyWidthConstraints( width ),\n\t\t} );\n\t\tsetTemporaryMediaWidth( null );\n\t};\n\n\tconst classNames = classnames( {\n\t\t'has-media-on-the-right': 'right' === mediaPosition,\n\t\t'is-selected': isSelected,\n\t\t'is-stacked-on-mobile': isStackedOnMobile,\n\t\t[ `is-vertically-aligned-${ verticalAlignment }` ]: verticalAlignment,\n\t\t'is-image-fill': imageFill,\n\t} );\n\tconst widthString = `${ temporaryMediaWidth || mediaWidth }%`;\n\tconst gridTemplateColumns =\n\t\t'right' === mediaPosition\n\t\t\t? `1fr ${ widthString }`\n\t\t\t: `${ widthString } 1fr`;\n\tconst style = {\n\t\tgridTemplateColumns,\n\t\tmsGridColumns: gridTemplateColumns,\n\t};\n\tconst onMediaAltChange = ( newMediaAlt ) => {\n\t\tsetAttributes( { mediaAlt: newMediaAlt } );\n\t};\n\tconst onVerticalAlignmentChange = ( alignment ) => {\n\t\tsetAttributes( { verticalAlignment: alignment } );\n\t};\n\n\tconst imageSizeOptions = map(\n\t\timageSizes.filter( ( { slug } ) =>\n\t\t\tgetImageSourceUrlBySizeSlug( image, slug )\n\t\t),\n\t\t( { name, slug } ) => ( { value: slug, label: name } )\n\t);\n\tconst updateImage = ( newMediaSizeSlug ) => {\n\t\tconst newUrl = getImageSourceUrlBySizeSlug( image, newMediaSizeSlug );\n\n\t\tif ( ! newUrl ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tmediaUrl: newUrl,\n\t\t\tmediaSizeSlug: newMediaSizeSlug,\n\t\t} );\n\t};\n\n\tconst mediaTextGeneralSettings = (\n\t\t<PanelBody title={ __( 'Settings' ) }>\n\t\t\t<ToggleControl\n\t\t\t\tlabel={ __( 'Stack on mobile' ) }\n\t\t\t\tchecked={ isStackedOnMobile }\n\t\t\t\tonChange={ () =>\n\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\tisStackedOnMobile: ! isStackedOnMobile,\n\t\t\t\t\t} )\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ mediaType === 'image' && (\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Crop image to fill entire column' ) }\n\t\t\t\t\tchecked={ imageFill }\n\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\timageFill: ! imageFill,\n\t\t\t\t\t\t} )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ imageFill && mediaUrl && mediaType === 'image' && (\n\t\t\t\t<FocalPointPicker\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Focal point picker' ) }\n\t\t\t\t\turl={ mediaUrl }\n\t\t\t\t\tvalue={ focalPoint }\n\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\tsetAttributes( { focalPoint: value } )\n\t\t\t\t\t}\n\t\t\t\t\tonDragStart={ imperativeFocalPointPreview }\n\t\t\t\t\tonDrag={ imperativeFocalPointPreview }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ mediaType === 'image' && (\n\t\t\t\t<TextareaControl\n\t\t\t\t\tlabel={ __( 'Alt text (alternative text)' ) }\n\t\t\t\t\tvalue={ mediaAlt }\n\t\t\t\t\tonChange={ onMediaAltChange }\n\t\t\t\t\thelp={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<ExternalLink href=\"https://www.w3.org/WAI/tutorials/images/decision-tree\">\n\t\t\t\t\t\t\t\t{ __( 'Describe the purpose of the image' ) }\n\t\t\t\t\t\t\t</ExternalLink>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Leave empty if the image is purely decorative.'\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) }\n\t\t\t{ mediaType === 'image' && (\n\t\t\t\t<ImageSizeControl\n\t\t\t\t\tonChangeImage={ updateImage }\n\t\t\t\t\tslug={ mediaSizeSlug }\n\t\t\t\t\timageSizeOptions={ imageSizeOptions }\n\t\t\t\t\tisResizable={ false }\n\t\t\t\t\timageSizeHelp={ __( 'Select which image size to load.' ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ mediaUrl && (\n\t\t\t\t<RangeControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Media width' ) }\n\t\t\t\t\tvalue={ temporaryMediaWidth || mediaWidth }\n\t\t\t\t\tonChange={ commitWidthChange }\n\t\t\t\t\tmin={ WIDTH_CONSTRAINT_PERCENTAGE }\n\t\t\t\t\tmax={ 100 - WIDTH_CONSTRAINT_PERCENTAGE }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</PanelBody>\n\t);\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classNames,\n\t\tstyle,\n\t} );\n\n\tconst innerBlocksProps = useInnerBlocksProps(\n\t\t{ className: 'wp-block-media-text__content' },\n\t\t{ template: TEMPLATE }\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<InspectorControls>{ mediaTextGeneralSettings }</InspectorControls>\n\t\t\t<BlockControls group=\"block\">\n\t\t\t\t{ ! isContentLocked && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<BlockVerticalAlignmentControl\n\t\t\t\t\t\t\tonChange={ onVerticalAlignmentChange }\n\t\t\t\t\t\t\tvalue={ verticalAlignment }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\t\ticon={ pullLeft }\n\t\t\t\t\t\t\ttitle={ __( 'Show media on left' ) }\n\t\t\t\t\t\t\tisActive={ mediaPosition === 'left' }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { mediaPosition: 'left' } )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\t\ticon={ pullRight }\n\t\t\t\t\t\t\ttitle={ __( 'Show media on right' ) }\n\t\t\t\t\t\t\tisActive={ mediaPosition === 'right' }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetAttributes( { mediaPosition: 'right' } )\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\n\t\t\t\t{ mediaType === 'image' && (\n\t\t\t\t\t<ImageURLInputUI\n\t\t\t\t\t\turl={ href || '' }\n\t\t\t\t\t\tonChangeUrl={ onSetHref }\n\t\t\t\t\t\tlinkDestination={ linkDestination }\n\t\t\t\t\t\tmediaType={ mediaType }\n\t\t\t\t\t\tmediaUrl={ image && image.source_url }\n\t\t\t\t\t\tmediaLink={ image && image.link }\n\t\t\t\t\t\tlinkTarget={ linkTarget }\n\t\t\t\t\t\tlinkClass={ linkClass }\n\t\t\t\t\t\trel={ rel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</BlockControls>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ mediaPosition === 'right' && <div { ...innerBlocksProps } /> }\n\t\t\t\t<MediaContainer\n\t\t\t\t\tclassName=\"wp-block-media-text__media\"\n\t\t\t\t\tonSelectMedia={ onSelectMedia }\n\t\t\t\t\tonWidthChange={ onWidthChange }\n\t\t\t\t\tcommitWidthChange={ commitWidthChange }\n\t\t\t\t\tref={ refMediaContainer }\n\t\t\t\t\t{ ...{\n\t\t\t\t\t\tfocalPoint,\n\t\t\t\t\t\timageFill,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisStackedOnMobile,\n\t\t\t\t\t\tmediaAlt,\n\t\t\t\t\t\tmediaId,\n\t\t\t\t\t\tmediaPosition,\n\t\t\t\t\t\tmediaType,\n\t\t\t\t\t\tmediaUrl,\n\t\t\t\t\t\tmediaWidth,\n\t\t\t\t\t\tisContentLocked,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t{ mediaPosition !== 'right' && <div { ...innerBlocksProps } /> }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default MediaTextEdit;\n"]}

package/build-module/navigation/edit/are-blocks-dirty.js

@@ -0,0 +1,44 @@
+export function areBlocksDirty(originalBlocks, blocks) {
+  return !isDeepEqual(originalBlocks, blocks, (prop, x) => {
+    // Skip inner blocks of page list during comparison as they
+    // are **always** controlled and may be updated async due to
+    // syncing with entity records. Left unchecked this would
+    // inadvertently trigger the dirty state.
+    if ((x === null || x === void 0 ? void 0 : x.name) === 'core/page-list' && prop === 'innerBlocks') {
+      return true;
+    }
+  });
+}
+/**
+ * Conditionally compares two candidates for deep equality.
+ * Provides an option to skip a given property of an object during comparison.
+ *
+ * @param {*}                  x          1st candidate for comparison
+ * @param {*}                  y          2nd candidate for comparison
+ * @param {Function|undefined} shouldSkip a function which can be used to skip a given property of an object.
+ * @return {boolean}                      whether the two candidates are deeply equal.
+ */
+
+const isDeepEqual = (x, y, shouldSkip) => {
+  if (x === y) {
+    return true;
+  } else if (typeof x === 'object' && x !== null && x !== undefined && typeof y === 'object' && y !== null && y !== undefined) {
+    if (Object.keys(x).length !== Object.keys(y).length) return false;
+
+    for (const prop in x) {
+      if (y.hasOwnProperty(prop)) {
+        // Afford skipping a given property of an object.
+        if (shouldSkip && shouldSkip(prop, x)) {
+          return true;
+        }
+
+        if (!isDeepEqual(x[prop], y[prop], shouldSkip)) return false;
+      } else return false;
+    }
+
+    return true;
+  }
+
+  return false;
+};
+//# sourceMappingURL=are-blocks-dirty.js.map

package/build-module/navigation/edit/are-blocks-dirty.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/are-blocks-dirty.js"],"names":["areBlocksDirty","originalBlocks","blocks","isDeepEqual","prop","x","name","y","shouldSkip","undefined","Object","keys","length","hasOwnProperty"],"mappings":"AAAA,OAAO,SAASA,cAAT,CAAyBC,cAAzB,EAAyCC,MAAzC,EAAkD;AACxD,SAAO,CAAEC,WAAW,CAAEF,cAAF,EAAkBC,MAAlB,EAA0B,CAAEE,IAAF,EAAQC,CAAR,KAAe;AAC5D;AACA;AACA;AACA;AACA,QAAK,CAAAA,CAAC,SAAD,IAAAA,CAAC,WAAD,YAAAA,CAAC,CAAEC,IAAH,MAAY,gBAAZ,IAAgCF,IAAI,KAAK,aAA9C,EAA8D;AAC7D,aAAO,IAAP;AACA;AACD,GARmB,CAApB;AASA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMD,WAAW,GAAG,CAAEE,CAAF,EAAKE,CAAL,EAAQC,UAAR,KAAwB;AAC3C,MAAKH,CAAC,KAAKE,CAAX,EAAe;AACd,WAAO,IAAP;AACA,GAFD,MAEO,IACN,OAAOF,CAAP,KAAa,QAAb,IACAA,CAAC,KAAK,IADN,IAEAA,CAAC,KAAKI,SAFN,IAGA,OAAOF,CAAP,KAAa,QAHb,IAIAA,CAAC,KAAK,IAJN,IAKAA,CAAC,KAAKE,SANA,EAOL;AACD,QAAKC,MAAM,CAACC,IAAP,CAAaN,CAAb,EAAiBO,MAAjB,KAA4BF,MAAM,CAACC,IAAP,CAAaJ,CAAb,EAAiBK,MAAlD,EAA2D,OAAO,KAAP;;AAE3D,SAAM,MAAMR,IAAZ,IAAoBC,CAApB,EAAwB;AACvB,UAAKE,CAAC,CAACM,cAAF,CAAkBT,IAAlB,CAAL,EAAgC;AAC/B;AACA,YAAKI,UAAU,IAAIA,UAAU,CAAEJ,IAAF,EAAQC,CAAR,CAA7B,EAA2C;AAC1C,iBAAO,IAAP;AACA;;AAED,YAAK,CAAEF,WAAW,CAAEE,CAAC,CAAED,IAAF,CAAH,EAAaG,CAAC,CAAEH,IAAF,CAAd,EAAwBI,UAAxB,CAAlB,EACC,OAAO,KAAP;AACD,OARD,MAQO,OAAO,KAAP;AACP;;AAED,WAAO,IAAP;AACA;;AAED,SAAO,KAAP;AACA,CA7BD","sourcesContent":["export function areBlocksDirty( originalBlocks, blocks ) {\n\treturn ! isDeepEqual( originalBlocks, blocks, ( prop, x ) => {\n\t\t// Skip inner blocks of page list during comparison as they\n\t\t// are **always** controlled and may be updated async due to\n\t\t// syncing with entity records. Left unchecked this would\n\t\t// inadvertently trigger the dirty state.\n\t\tif ( x?.name === 'core/page-list' && prop === 'innerBlocks' ) {\n\t\t\treturn true;\n\t\t}\n\t} );\n}\n\n/**\n * Conditionally compares two candidates for deep equality.\n * Provides an option to skip a given property of an object during comparison.\n *\n * @param {*}                  x          1st candidate for comparison\n * @param {*}                  y          2nd candidate for comparison\n * @param {Function|undefined} shouldSkip a function which can be used to skip a given property of an object.\n * @return {boolean}                      whether the two candidates are deeply equal.\n */\nconst isDeepEqual = ( x, y, shouldSkip ) => {\n\tif ( x === y ) {\n\t\treturn true;\n\t} else if (\n\t\ttypeof x === 'object' &&\n\t\tx !== null &&\n\t\tx !== undefined &&\n\t\ttypeof y === 'object' &&\n\t\ty !== null &&\n\t\ty !== undefined\n\t) {\n\t\tif ( Object.keys( x ).length !== Object.keys( y ).length ) return false;\n\n\t\tfor ( const prop in x ) {\n\t\t\tif ( y.hasOwnProperty( prop ) ) {\n\t\t\t\t// Afford skipping a given property of an object.\n\t\t\t\tif ( shouldSkip && shouldSkip( prop, x ) ) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif ( ! isDeepEqual( x[ prop ], y[ prop ], shouldSkip ) )\n\t\t\t\t\treturn false;\n\t\t\t} else return false;\n\t\t}\n\n\t\treturn true;\n\t}\n\n\treturn false;\n};\n"]}

package/build-module/navigation/edit/index.js

@@ -1,3 +1,4 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement, Fragment } from "@wordpress/element";
 
 /**
@@ -9,10 +10,10 @@ import classnames from 'classnames';
  */
 
 import { useState, useEffect, useRef, Platform, useMemo } from '@wordpress/element';
-import { __experimentalOffCanvasEditor as OffCanvasEditor, InspectorControls, useBlockProps, __experimentalRecursionProvider as RecursionProvider, __experimentalUseHasRecursion as useHasRecursion, store as blockEditorStore, withColors, PanelColorSettings, ContrastChecker, getColorClassName, Warning, __experimentalUseBlockOverlayActive as useBlockOverlayActive } from '@wordpress/block-editor';
+import { InspectorControls, useBlockProps, __experimentalRecursionProvider as RecursionProvider, __experimentalUseHasRecursion as useHasRecursion, store as blockEditorStore, withColors, ContrastChecker, getColorClassName, Warning, __experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown, __experimentalUseBlockOverlayActive as useBlockOverlayActive, __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients } from '@wordpress/block-editor';
 import { EntityProvider, store as coreStore } from '@wordpress/core-data';
 import { useDispatch } from '@wordpress/data';
-import { PanelBody, ToggleControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, Button, Spinner, __experimentalHStack as HStack, __experimentalHeading as Heading } from '@wordpress/components';
+import { PanelBody, ToggleControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, Button, Spinner } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import { speak } from '@wordpress/a11y';
 import { createBlock } from '@wordpress/blocks';
@@ -26,7 +27,6 @@ import useNavigationEntities from '../use-navigation-entities';
 import Placeholder from './placeholder';
 import ResponsiveWrapper from './responsive-wrapper';
 import NavigationInnerBlocks from './inner-blocks';
-import NavigationMenuSelector from './navigation-menu-selector';
 import NavigationMenuNameControl from './navigation-menu-name-control';
 import UnsavedInnerBlocks from './unsaved-inner-blocks';
 import NavigationMenuDeleteControl from './navigation-menu-delete-control';
@@ -38,6 +38,7 @@ import useCreateNavigationMenu from './use-create-navigation-menu';
 import { useInnerBlocks } from './use-inner-blocks';
 import { detectColors } from './utils';
 import ManageMenusButton from './manage-menus-button';
+import MenuInspectorControls from './menu-inspector-controls';
 
 function Navigation(_ref) {
   var _window, _attributes$style, _attributes$style$typ;
@@ -208,13 +209,24 @@ function Navigation(_ref) {
     setRef(fallbackNavigationMenus[0].id);
   }, [ref, isCreatingNavigationMenu, fallbackNavigationMenus, hasUncontrolledInnerBlocks]);
   useEffect(() => {
-    if (!hasResolvedNavigationMenus || isConvertingClassicMenu || (fallbackNavigationMenus === null || fallbackNavigationMenus === void 0 ? void 0 : fallbackNavigationMenus.length) > 0 || (classicMenus === null || classicMenus === void 0 ? void 0 : classicMenus.length) !== 1) {
+    if (!hasResolvedNavigationMenus || isConvertingClassicMenu || (fallbackNavigationMenus === null || fallbackNavigationMenus === void 0 ? void 0 : fallbackNavigationMenus.length) > 0 || !(classicMenus !== null && classicMenus !== void 0 && classicMenus.length)) {
       return;
     } // If there's non fallback navigation menus and
-    // only one classic menu then create a new navigation menu based on it.
+    // a classic menu with a `primary` location or slug,
+    // then create a new navigation menu based on it.
+    // Otherwise, use the most recently created classic menu.
 
 
-    convertClassicMenu(classicMenus[0].id, classicMenus[0].name, 'publish');
+    const primaryMenus = classicMenus.filter(classicMenu => classicMenu.locations.includes('primary') || classicMenu.slug === 'primary');
+
+    if (primaryMenus.length) {
+      convertClassicMenu(primaryMenus[0].id, primaryMenus[0].name, 'publish');
+    } else {
+      classicMenus.sort((a, b) => {
+        return b.id - a.id;
+      });
+      convertClassicMenu(classicMenus[0].id, classicMenus[0].name, 'publish');
+    }
   }, [hasResolvedNavigationMenus]);
   const navRef = useRef(); // The standard HTML5 tag for the block wrapper.
 
@@ -291,6 +303,20 @@ function Navigation(_ref) {
     }
   };
 
+  const onSelectClassicMenu = async classicMenu => {
+    const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name, 'draft');
+
+    if (navMenu) {
+      handleUpdateMenu(navMenu.id, {
+        focusNavigationBlock: true
+      });
+    }
+  };
+
+  const onSelectNavigationMenu = menuId => {
+    handleUpdateMenu(menuId);
+  };
+
   useEffect(() => {
     hideClassicMenuConversionNotice();
 
@@ -368,7 +394,8 @@ function Navigation(_ref) {
       showMenuAutoPublishDraftNotice(__('Error occurred while publishing the navigation menu.'));
     });
   }, [isDraftNavigationMenu, navigationMenu]);
-  const stylingInspectorControls = createElement(InspectorControls, null, hasSubmenuIndicatorSetting && createElement(PanelBody, {
+  const colorGradientSettings = useMultipleOriginColorsAndGradients();
+  const stylingInspectorControls = createElement(Fragment, null, createElement(InspectorControls, null, hasSubmenuIndicatorSetting && createElement(PanelBody, {
     title: __('Display')
   }, isResponsive && createElement(Fragment, null, createElement(Button, {
     className: overlayMenuPreviewClasses,
@@ -422,35 +449,43 @@ function Navigation(_ref) {
     },
     disabled: attributes.openSubmenusOnClick,
     label: __('Show arrow')
-  }))), hasColorSettings && createElement(PanelColorSettings, {
+  })))), createElement(InspectorControls, {
+    __experimentalGroup: "color"
+  }, hasColorSettings && createElement(Fragment, null, createElement(ColorGradientSettingsDropdown, _extends({
     __experimentalHasMultipleOrigins: true,
     __experimentalIsRenderedInSidebar: true,
-    title: __('Color'),
-    initialOpen: false,
-    colorSettings: [{
-      value: textColor.color,
-      onChange: setTextColor,
-      label: __('Text')
+    settings: [{
+      colorValue: textColor.color,
+      label: __('Text'),
+      onColorChange: setTextColor,
+      resetAllFilter: () => setTextColor()
     }, {
-      value: backgroundColor.color,
-      onChange: setBackgroundColor,
-      label: __('Background')
+      colorValue: backgroundColor.color,
+      label: __('Background'),
+      onColorChange: setBackgroundColor,
+      resetAllFilter: () => setBackgroundColor()
     }, {
-      value: overlayTextColor.color,
-      onChange: setOverlayTextColor,
-      label: __('Submenu & overlay text')
+      colorValue: overlayTextColor.color,
+      label: __('Submenu & overlay text'),
+      onColorChange: setOverlayTextColor,
+      resetAllFilter: () => setOverlayTextColor()
     }, {
-      value: overlayBackgroundColor.color,
-      onChange: setOverlayBackgroundColor,
-      label: __('Submenu & overlay background')
-    }]
-  }, enableContrastChecking && createElement(Fragment, null, createElement(ContrastChecker, {
+      colorValue: overlayBackgroundColor.color,
+      label: __('Submenu & overlay background'),
+      onColorChange: setOverlayBackgroundColor,
+      resetAllFilter: () => setOverlayBackgroundColor()
+    }],
+    panelId: clientId
+  }, colorGradientSettings, {
+    gradients: [],
+    disableCustomGradients: true
+  })), enableContrastChecking && createElement(Fragment, null, createElement(ContrastChecker, {
     backgroundColor: detectedBackgroundColor,
     textColor: detectedColor
   }), createElement(ContrastChecker, {
     backgroundColor: detectedOverlayBackgroundColor,
     textColor: detectedOverlayColor
-  })))); // If the block has inner blocks, but no menu id, then these blocks are either:
+  }))))); // If the block has inner blocks, but no menu id, then these blocks are either:
   // - inserted via a pattern.
   // - inserted directly via Code View (or otherwise).
   // - from an older version of navigation block added before the block used a wp_navigation entity.
@@ -458,56 +493,20 @@ function Navigation(_ref) {
   // that automatically saves the menu as an entity when changes are made to the inner blocks.
 
   const hasUnsavedBlocks = hasUncontrolledInnerBlocks && !isEntityAvailable;
-
-  const WrappedNavigationMenuSelector = _ref2 => {
-    let {
-      currentMenuId
-    } = _ref2;
-    return createElement(NavigationMenuSelector, {
-      currentMenuId: currentMenuId,
-      clientId: clientId,
-      onSelectNavigationMenu: menuId => {
-        handleUpdateMenu(menuId);
-      },
-      onSelectClassicMenu: async classicMenu => {
-        const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name, 'draft');
-
-        if (navMenu) {
-          handleUpdateMenu(navMenu.id, {
-            focusNavigationBlock: true
-          });
-        }
-      },
-      onCreateNew: createUntitledEmptyNavigationMenu,
-      createNavigationMenuIsSuccess: createNavigationMenuIsSuccess,
-      createNavigationMenuIsError: createNavigationMenuIsError
-      /* translators: %s: The name of a menu. */
-      ,
-      actionLabel: __("Switch to '%s'")
-    });
-  };
-
   const isManageMenusButtonDisabled = !hasManagePermissions || !hasResolvedNavigationMenus;
 
   if (hasUnsavedBlocks && !isCreatingNavigationMenu) {
-    return createElement(TagName, blockProps, createElement(InspectorControls, null, createElement(PanelBody, {
-      title: isOffCanvasNavigationEditorEnabled ? null : __('Menu')
-    }, isOffCanvasNavigationEditorEnabled ? createElement(Fragment, null, createElement(HStack, {
-      className: "wp-block-navigation-off-canvas-editor__header"
-    }, createElement(Heading, {
-      className: "wp-block-navigation-off-canvas-editor__title",
-      level: 2
-    }, __('Menu')), createElement(WrappedNavigationMenuSelector, {
-      currentMenuId: ref
-    })), createElement(OffCanvasEditor, {
-      blocks: innerBlocks,
-      isExpanded: true,
-      selectBlockInCanvas: false
-    })) : createElement(Fragment, null, createElement(WrappedNavigationMenuSelector, {
-      currentMenuId: ref
-    }), createElement(ManageMenusButton, {
-      disabled: isManageMenusButtonDisabled
-    })))), stylingInspectorControls, createElement(ResponsiveWrapper, {
+    return createElement(TagName, blockProps, createElement(MenuInspectorControls, {
+      createNavigationMenuIsSuccess: createNavigationMenuIsSuccess,
+      createNavigationMenuIsError: createNavigationMenuIsError,
+      currentMenuId: ref,
+      isNavigationMenuMissing: isNavigationMenuMissing,
+      innerBlocks: innerBlocks,
+      isManageMenusButtonDisabled: isManageMenusButtonDisabled,
+      onCreateNew: createUntitledEmptyNavigationMenu,
+      onSelectClassicMenu: onSelectClassicMenu,
+      onSelectNavigationMenu: onSelectNavigationMenu
+    }), stylingInspectorControls, createElement(ResponsiveWrapper, {
       id: clientId,
       onToggle: setResponsiveMenuVisibility,
       isOpen: isResponsiveMenuOpen,
@@ -529,20 +528,16 @@ function Navigation(_ref) {
 
 
   if (ref && isNavigationMenuMissing) {
-    return createElement(TagName, blockProps, createElement(InspectorControls, null, createElement(PanelBody, {
-      title: isOffCanvasNavigationEditorEnabled ? null : __('Menu')
-    }, isOffCanvasNavigationEditorEnabled ? createElement(Fragment, null, createElement(HStack, {
-      className: "wp-block-navigation-off-canvas-editor__header"
-    }, createElement(Heading, {
-      className: "wp-block-navigation-off-canvas-editor__title",
-      level: 2
-    }, __('Menu')), createElement(WrappedNavigationMenuSelector, {
-      currentMenuId: null
-    })), createElement("p", null, "Select or create a menu")) : createElement(Fragment, null, createElement(WrappedNavigationMenuSelector, {
-      currentMenuId: null
-    }), createElement(ManageMenusButton, {
-      disabled: isManageMenusButtonDisabled
-    })))), createElement(Warning, null, __('Navigation menu has been deleted or is unavailable. '), createElement(Button, {
+    return createElement(TagName, blockProps, createElement(MenuInspectorControls, {
+      createNavigationMenuIsSuccess: createNavigationMenuIsSuccess,
+      createNavigationMenuIsError: createNavigationMenuIsError,
+      isNavigationMenuMissing: isNavigationMenuMissing,
+      innerBlocks: innerBlocks,
+      isManageMenusButtonDisabled: isManageMenusButtonDisabled,
+      onCreateNew: createUntitledEmptyNavigationMenu,
+      onSelectClassicMenu: onSelectClassicMenu,
+      onSelectNavigationMenu: onSelectNavigationMenu
+    }), createElement(Warning, null, __('Navigation menu has been deleted or is unavailable. '), createElement(Button, {
       onClick: createUntitledEmptyNavigationMenu,
       variant: "link"
     }, __('Create a new menu?'))));
@@ -570,18 +565,8 @@ function Navigation(_ref) {
       clientId: clientId,
       canUserCreateNavigationMenu: canUserCreateNavigationMenu,
       isResolvingCanUserCreateNavigationMenu: isResolvingCanUserCreateNavigationMenu,
-      onSelectNavigationMenu: menuId => {
-        handleUpdateMenu(menuId);
-      },
-      onSelectClassicMenu: async classicMenu => {
-        const navMenu = await convertClassicMenu(classicMenu.id, classicMenu.name, 'draft');
-
-        if (navMenu) {
-          handleUpdateMenu(navMenu.id, {
-            focusNavigationBlock: true
-          });
-        }
-      },
+      onSelectNavigationMenu: onSelectNavigationMenu,
+      onSelectClassicMenu: onSelectClassicMenu,
       onCreateEmpty: createUntitledEmptyNavigationMenu
     }));
   }
@@ -592,24 +577,17 @@ function Navigation(_ref) {
     id: ref
   }, createElement(RecursionProvider, {
     uniqueId: recursionId
-  }, createElement(InspectorControls, null, createElement(PanelBody, {
-    title: isOffCanvasNavigationEditorEnabled ? null : __('Menu')
-  }, isOffCanvasNavigationEditorEnabled ? createElement(Fragment, null, createElement(HStack, {
-    className: "wp-block-navigation-off-canvas-editor__header"
-  }, createElement(Heading, {
-    className: "wp-block-navigation-off-canvas-editor__title",
-    level: 2
-  }, __('Menu')), createElement(WrappedNavigationMenuSelector, {
-    currentMenuId: ref
-  })), createElement(OffCanvasEditor, {
-    blocks: innerBlocks,
-    isExpanded: true,
-    selectBlockInCanvas: false
-  })) : createElement(Fragment, null, createElement(WrappedNavigationMenuSelector, {
-    currentMenuId: ref
-  }), createElement(ManageMenusButton, {
-    disabled: isManageMenusButtonDisabled
-  })))), stylingInspectorControls, isEntityAvailable && createElement(InspectorControls, {
+  }, createElement(MenuInspectorControls, {
+    createNavigationMenuIsSuccess: createNavigationMenuIsSuccess,
+    createNavigationMenuIsError: createNavigationMenuIsError,
+    currentMenuId: ref,
+    isNavigationMenuMissing: isNavigationMenuMissing,
+    innerBlocks: innerBlocks,
+    isManageMenusButtonDisabled: isManageMenusButtonDisabled,
+    onCreateNew: createUntitledEmptyNavigationMenu,
+    onSelectClassicMenu: onSelectClassicMenu,
+    onSelectNavigationMenu: onSelectNavigationMenu
+  }), stylingInspectorControls, isEntityAvailable && createElement(InspectorControls, {
     __experimentalGroup: "advanced"
   }, hasResolvedCanUserUpdateNavigationMenu && canUserUpdateNavigationMenu && createElement(NavigationMenuNameControl, null), hasResolvedCanUserDeleteNavigationMenu && canUserDeleteNavigationMenu && createElement(NavigationMenuDeleteControl, {
     onDelete: function () {