@wordpress/block-library 7.0.1 → 7.1.0-next.e230fbab09.0

package/src/template-part/edit/selection-modal.js

@@ -0,0 +1,115 @@
+/**
+ * WordPress dependencies
+ */
+import { useCallback, useMemo } from '@wordpress/element';
+import { __, sprintf } from '@wordpress/i18n';
+import { store as noticesStore } from '@wordpress/notices';
+import { useDispatch } from '@wordpress/data';
+import { parse } from '@wordpress/blocks';
+import { useAsyncList } from '@wordpress/compose';
+import {
+	__experimentalBlockPatternsList as BlockPatternsList,
+	store as blockEditorStore,
+} from '@wordpress/block-editor';
+
+/**
+ * Internal dependencies
+ */
+import {
+	useAlternativeBlockPatterns,
+	useAlternativeTemplateParts,
+	useCreateTemplatePartFromBlocks,
+} from './utils/hooks';
+import { createTemplatePartId } from './utils/create-template-part-id';
+
+export default function TemplatePartSelectionModal( {
+	setAttributes,
+	onClose,
+	templatePartId = null,
+	area,
+	clientId,
+} ) {
+	// When the templatePartId is undefined,
+	// it means the user is creating a new one from the placeholder.
+	const isReplacingTemplatePartContent = !! templatePartId;
+	const { templateParts } = useAlternativeTemplateParts(
+		area,
+		templatePartId
+	);
+	// We can map template parts to block patters to reuse the BlockPatternsList UI
+	const templartPartsAsBlockPatterns = useMemo( () => {
+		return templateParts.map( ( templatePart ) => ( {
+			name: createTemplatePartId( templatePart.theme, templatePart.slug ),
+			title: templatePart.title.rendered,
+			blocks: parse( templatePart.content.raw ),
+			templatePart,
+		} ) );
+	}, [ templateParts ] );
+	const shownTemplateParts = useAsyncList( templartPartsAsBlockPatterns );
+	const { createSuccessNotice } = useDispatch( noticesStore );
+	const blockPatterns = useAlternativeBlockPatterns( area, clientId );
+	const shownBlockPatterns = useAsyncList( blockPatterns );
+	const { replaceInnerBlocks } = useDispatch( blockEditorStore );
+
+	const onTemplatePartSelect = useCallback( ( templatePart ) => {
+		setAttributes( {
+			slug: templatePart.slug,
+			theme: templatePart.theme,
+			area: undefined,
+		} );
+		createSuccessNotice(
+			sprintf(
+				/* translators: %s: template part title. */
+				__( 'Template Part "%s" inserted.' ),
+				templatePart.title?.rendered || templatePart.slug
+			),
+			{
+				type: 'snackbar',
+			}
+		);
+		onClose();
+	}, [] );
+
+	const createFromBlocks = useCreateTemplatePartFromBlocks(
+		area,
+		setAttributes
+	);
+
+	return (
+		<>
+			<div className="block-library-template-part__selection-content">
+				{ !! templartPartsAsBlockPatterns.length && (
+					<div>
+						<h2>{ __( 'Existing template parts' ) }</h2>
+						<BlockPatternsList
+							blockPatterns={ templartPartsAsBlockPatterns }
+							shownPatterns={ shownTemplateParts }
+							onClickPattern={ ( pattern ) => {
+								onTemplatePartSelect( pattern.templatePart );
+							} }
+						/>
+					</div>
+				) }
+
+				{ !! blockPatterns.length && (
+					<div>
+						<h2>{ __( 'Patterns' ) }</h2>
+						<BlockPatternsList
+							blockPatterns={ blockPatterns }
+							shownPatterns={ shownBlockPatterns }
+							onClickPattern={ ( pattern, blocks ) => {
+								if ( isReplacingTemplatePartContent ) {
+									replaceInnerBlocks( clientId, blocks );
+								} else {
+									createFromBlocks( blocks, pattern.title );
+								}
+
+								onClose();
+							} }
+						/>
+					</div>
+				) }
+			</div>
+		</>
+	);
+}

package/src/template-part/edit/title-modal.js

@@ -0,0 +1,59 @@
+/**
+ * WordPress dependencies
+ */
+import { useState } from '@wordpress/element';
+import { __, sprintf } from '@wordpress/i18n';
+import {
+	TextControl,
+	Flex,
+	FlexItem,
+	Button,
+	Modal,
+} from '@wordpress/components';
+
+export default function TitleModal( { areaLabel, onClose, onSubmit } ) {
+	// Restructure onCreate to set the blocks on local state.
+	// Add modal to confirm title and trigger onCreate.
+	const [ title, setTitle ] = useState( __( 'Untitled Template Part' ) );
+
+	const submitForCreation = ( event ) => {
+		event.preventDefault();
+		onSubmit( title );
+	};
+
+	return (
+		<Modal
+			title={ sprintf(
+				// Translators: %s as template part area title ("Header", "Footer", etc.).
+				__( 'Name and create your new %s' ),
+				areaLabel.toLowerCase()
+			) }
+			closeLabel={ __( 'Cancel' ) }
+			overlayClassName="wp-block-template-part__placeholder-create-new__title-form"
+			onRequestClose={ onClose }
+		>
+			<form onSubmit={ submitForCreation }>
+				<TextControl
+					label={ __( 'Name' ) }
+					value={ title }
+					onChange={ setTitle }
+				/>
+				<Flex
+					className="wp-block-template-part__placeholder-create-new__title-form-actions"
+					justify="flex-end"
+				>
+					<FlexItem>
+						<Button
+							variant="primary"
+							type="submit"
+							disabled={ ! title.length }
+							aria-disabled={ ! title.length }
+						>
+							{ __( 'Create' ) }
+						</Button>
+					</FlexItem>
+				</Flex>
+			</form>
+		</Modal>
+	);
+}

package/src/template-part/edit/utils/hooks.js

@@ -0,0 +1,158 @@
+/**
+ * External dependencies
+ */
+import { find, kebabCase } from 'lodash';
+
+/**
+ * WordPress dependencies
+ */
+import { useDispatch, useSelect } from '@wordpress/data';
+import { store as coreStore } from '@wordpress/core-data';
+import { store as blockEditorStore } from '@wordpress/block-editor';
+import { useMemo } from '@wordpress/element';
+import { serialize } from '@wordpress/blocks';
+import { __ } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import { createTemplatePartId } from './create-template-part-id';
+
+/**
+ * Retrieves the available template parts for the given area.
+ *
+ * @param {string} area       Template part area.
+ * @param {string} excludedId Template part ID to exclude.
+ *
+ * @return {{ templateParts: Array, isResolving: boolean }} array of template parts.
+ */
+export function useAlternativeTemplateParts( area, excludedId ) {
+	const { templateParts, isResolving } = useSelect( ( select ) => {
+		const { getEntityRecords, isResolving: _isResolving } = select(
+			coreStore
+		);
+		const query = { per_page: -1 };
+		return {
+			templateParts: getEntityRecords(
+				'postType',
+				'wp_template_part',
+				query
+			),
+			isLoading: _isResolving( 'getEntityRecords', [
+				'postType',
+				'wp_template_part',
+				query,
+			] ),
+		};
+	}, [] );
+
+	const filteredTemplateParts = useMemo( () => {
+		if ( ! templateParts ) {
+			return [];
+		}
+		return (
+			templateParts.filter(
+				( templatePart ) =>
+					createTemplatePartId(
+						templatePart.theme,
+						templatePart.slug
+					) !== excludedId &&
+					( ! area ||
+						'uncategorized' === area ||
+						templatePart.area === area )
+			) || []
+		);
+	}, [ templateParts, area ] );
+
+	return {
+		templateParts: filteredTemplateParts,
+		isResolving,
+	};
+}
+
+/**
+ * Retrieves the available block patterns for the given area.
+ *
+ * @param {string} area     Template part area.
+ * @param {string} clientId Block Client ID. (The container of the block can impact allowed blocks).
+ *
+ * @return {Array} array of block patterns.
+ */
+export function useAlternativeBlockPatterns( area, clientId ) {
+	return useSelect(
+		( select ) => {
+			const blockNameWithArea = area
+				? `core/template-part/${ area }`
+				: 'core/template-part';
+			const {
+				getBlockRootClientId,
+				__experimentalGetPatternsByBlockTypes,
+			} = select( blockEditorStore );
+			const rootClientId = getBlockRootClientId( clientId );
+			return __experimentalGetPatternsByBlockTypes(
+				blockNameWithArea,
+				rootClientId
+			);
+		},
+		[ area, clientId ]
+	);
+}
+
+export function useCreateTemplatePartFromBlocks( area, setAttributes ) {
+	const { saveEntityRecord } = useDispatch( coreStore );
+
+	return async ( blocks = [], title = __( 'Untitled Template Part' ) ) => {
+		// If we have `area` set from block attributes, means an exposed
+		// block variation was inserted. So add this prop to the template
+		// part entity on creation. Afterwards remove `area` value from
+		// block attributes.
+		const record = {
+			title,
+			slug: kebabCase( title ),
+			content: serialize( blocks ),
+			// `area` is filterable on the server and defaults to `UNCATEGORIZED`
+			// if provided value is not allowed.
+			area,
+		};
+		const templatePart = await saveEntityRecord(
+			'postType',
+			'wp_template_part',
+			record
+		);
+		setAttributes( {
+			slug: templatePart.slug,
+			theme: templatePart.theme,
+			area: undefined,
+		} );
+	};
+}
+
+/**
+ * Retrieves the template part area object.
+ *
+ * @param {string} area Template part area identifier.
+ *
+ * @return {{icon: Object, label: string, tagName: string}} Template Part area.
+ */
+export function useTemplatePartArea( area ) {
+	return useSelect(
+		( select ) => {
+			// FIXME: @wordpress/block-library should not depend on @wordpress/editor.
+			// Blocks can be loaded into a *non-post* block editor.
+			// eslint-disable-next-line @wordpress/data-no-store-string-literals
+			const definedAreas = select(
+				'core/editor'
+			).__experimentalGetDefaultTemplatePartAreas();
+
+			const selectedArea = find( definedAreas, { area } );
+			const defaultArea = find( definedAreas, { area: 'uncategorized' } );
+
+			return {
+				icon: selectedArea?.icon || defaultArea?.icon,
+				label: selectedArea?.label || __( 'Template Part' ),
+				tagName: selectedArea?.area_tag ?? 'div',
+			};
+		},
+		[ area ]
+	);
+}

package/src/template-part/editor.scss

@@ -1,82 +1,24 @@
-
-.wp-block-template-part__placeholder-preview-dropdown-content,
-.wp-block-template-part__preview-dropdown-content {
-	.components-popover__content {
-		min-width: 320px;
-		padding: 0;
-	}
-}
-
-.wp-block-template-part__selection-preview-search-form {
-	border-bottom: $border-width solid $gray-300;
-}
-
-.wp-block-template-part__selection-preview-container {
-	background: $white;
-	padding-bottom: 16px;
-
-	.wp-block-template-part__selection-preview-item {
-		border-radius: $radius-block-ui;
-		cursor: pointer;
-		margin-top: $grid-unit-20;
-		transition: all 0.05s ease-in-out;
-		border: $border-width solid $gray-300;
-		width: 100%;
-		background-color: $white;
-
-		&:hover {
-			border: $border-width solid var(--wp-admin-theme-color);
-		}
-
-		&:focus {
-			box-shadow: inset 0 0 0 1px $white, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-
-			// Windows High Contrast mode will show this outline, but not the box-shadow.
-			outline: 2px solid transparent;
-		}
-
-		&.is-placeholder {
-			min-height: 100px;
-		}
-
-		.block-editor-block-preview__container {
-			border-bottom: $border-width solid $gray-300;
-		}
+.block-editor-template-part__selection-modal {
+	// To keep modal dimensions consistent as subsections are navigated, width
+	// and height are used instead of max-(width/height).
+	@include break-small() {
+		width: calc(100% - #{ $grid-unit-20 * 2 });
+		height: calc(100% - #{ $header-height * 2 });
 	}
-
-	.wp-block-template-part__selection-preview-item-title {
-		padding: $grid-unit-05;
-		font-size: $helptext-font-size;
-		text-align: left;
+	@include break-medium() {
+		width: $break-medium - $grid-unit-20 * 2;
 	}
-
-	.wp-block-template-part__selection-panel-group-header {
-		padding: $grid-unit-20 $grid-unit-20 0;
-	}
-
-	.wp-block-template-part__selection-panel-group-content {
-		padding: 0 $grid-unit-20;
-	}
-
-	.wp-block-template-part__selection-panel-group-title {
-		color: var(--wp-admin-theme-color);
-		text-transform: uppercase;
-		font-size: 11px;
-		font-weight: 500;
+	@include break-large() {
+		height: 70%;
 	}
 }
 
-.wp-block-template-part__placeholder-create-new__title-form {
-	.wp-block-template-part__placeholder-create-new__title-form-actions {
-		padding-top: $grid-unit-15;
-		// Unsure why these styles need to be added since we are using the Flex component with
-		// flex-end setting.  Created issue https://github.com/WordPress/gutenberg/issues/33735 to
-		// attempt document this issue.
-		display: flex;
-		justify-content: flex-end;
+.block-library-template-part__selection-content .block-editor-block-patterns-list {
+	display: grid;
+	grid-template-columns: 1fr 1fr;
+	grid-gap: $grid-unit-10;
 
-		.components-flex-item {
-			margin-left: $grid-unit-15;
-		}
+	.block-editor-block-patterns-list__list-item {
+		margin-bottom: 0;
 	}
 }

package/src/template-part/index.js

@@ -10,6 +10,7 @@ import { store as coreDataStore } from '@wordpress/core-data';
 import { select } from '@wordpress/data';
 import { symbolFilled } from '@wordpress/icons';
 import { addFilter } from '@wordpress/hooks';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -39,7 +40,9 @@ export const settings = {
 			return;
 		}
 
-		return startCase( entity.title?.rendered || entity.slug );
+		return (
+			decodeEntities( entity.title?.rendered ) || startCase( entity.slug )
+		);
 	},
 	edit,
 };

package/src/video/edit.js

@@ -91,9 +91,9 @@ function VideoEdit( {
 
 	function onSelectVideo( media ) {
 		if ( ! media || ! media.url ) {
-			// in this case there was an error
+			// In this case there was an error
 			// previous attributes should be removed
-			// because they may be temporary blob urls
+			// because they may be temporary blob urls.
 			setAttributes( {
 				src: undefined,
 				id: undefined,
@@ -102,8 +102,8 @@ function VideoEdit( {
 			return;
 		}
 
-		// sets the block's attribute and updates the edit component from the
-		// selected media
+		// Sets the block's attribute and updates the edit component from the
+		// selected media.
 		setAttributes( {
 			src: media.url,
 			id: media.id,

package/src/video/edit.native.js

@@ -84,7 +84,7 @@ class VideoEdit extends Component {
 	}
 
 	componentWillUnmount() {
-		// this action will only exist if the user pressed the trash button on the block holder
+		// This action will only exist if the user pressed the trash button on the block holder.
 		if (
 			hasAction( 'blocks.onRemoveBlockCheckUpload' ) &&
 			this.state.isUploadInProgress
@@ -98,7 +98,7 @@ class VideoEdit extends Component {
 
 	static getDerivedStateFromProps( props, state ) {
 		// Avoid a UI flicker in the toolbar by insuring that isCaptionSelected
-		// is updated immediately any time the isSelected prop becomes false
+		// is updated immediately any time the isSelected prop becomes false.
 		return {
 			isCaptionSelected: props.isSelected && state.isCaptionSelected,
 		};
@@ -362,7 +362,7 @@ class VideoEdit extends Component {
 						clientId={ this.props.clientId }
 						isSelected={ this.state.isCaptionSelected }
 						onFocus={ this.onFocusCaption }
-						onBlur={ this.props.onBlur } // always assign onBlur as props
+						onBlur={ this.props.onBlur } // Always assign onBlur as props.
 						insertBlocksAfter={ this.props.insertBlocksAfter }
 					/>
 				</View>

package/src/video/style.native.scss

@@ -31,6 +31,7 @@
 	color: $gray-dark;
 	font-size: 14;
 	margin-top: 5;
+	text-align: center;
 }
 
 .modalIcon {

package/build/navigation/edit/existing-menus-options.js

@@ -1,62 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _element = require("@wordpress/element");
-
-var _components = require("@wordpress/components");
-
-var _i18n = require("@wordpress/i18n");
-
-var _htmlEntities = require("@wordpress/html-entities");
-
-/**
- * WordPress dependencies
- */
-const ExistingMenusOptions = _ref => {
-  let {
-    showNavigationMenus,
-    showClassicMenus = false,
-    navigationMenus,
-    classicMenus,
-    onSelectNavigationMenu,
-    onSelectClassicMenu,
-    actionLabel
-  } = _ref;
-  const hasNavigationMenus = !!(navigationMenus !== null && navigationMenus !== void 0 && navigationMenus.length);
-  const hasClassicMenus = !!(classicMenus !== null && classicMenus !== void 0 && classicMenus.length);
-  /* translators: %s: The name of a menu. */
-
-  const createActionLabel = (0, _i18n.__)("Create from '%s'");
-  actionLabel = actionLabel || createActionLabel;
-  return (0, _element.createElement)(_element.Fragment, null, showNavigationMenus && hasNavigationMenus && (0, _element.createElement)(_components.MenuGroup, {
-    label: (0, _i18n.__)('Menus')
-  }, navigationMenus.map(menu => {
-    const label = (0, _htmlEntities.decodeEntities)(menu.title.rendered);
-    return (0, _element.createElement)(_components.MenuItem, {
-      onClick: () => {
-        onSelectNavigationMenu(menu);
-      },
-      key: menu.id,
-      "aria-label": (0, _i18n.sprintf)(actionLabel, label)
-    }, label);
-  })), showClassicMenus && hasClassicMenus && (0, _element.createElement)(_components.MenuGroup, {
-    label: (0, _i18n.__)('Classic Menus')
-  }, classicMenus.map(menu => {
-    const label = (0, _htmlEntities.decodeEntities)(menu.name);
-    return (0, _element.createElement)(_components.MenuItem, {
-      onClick: () => {
-        onSelectClassicMenu(menu);
-      },
-      key: menu.id,
-      "aria-label": (0, _i18n.sprintf)(createActionLabel, label)
-    }, label);
-  })));
-};
-
-var _default = ExistingMenusOptions;
-exports.default = _default;
-//# sourceMappingURL=existing-menus-options.js.map

package/build/navigation/edit/existing-menus-options.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/existing-menus-options.js"],"names":["ExistingMenusOptions","showNavigationMenus","showClassicMenus","navigationMenus","classicMenus","onSelectNavigationMenu","onSelectClassicMenu","actionLabel","hasNavigationMenus","length","hasClassicMenus","createActionLabel","map","menu","label","title","rendered","id","name"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AALA;AACA;AACA;AAKA,MAAMA,oBAAoB,GAAG,QAQtB;AAAA,MARwB;AAC9BC,IAAAA,mBAD8B;AAE9BC,IAAAA,gBAAgB,GAAG,KAFW;AAG9BC,IAAAA,eAH8B;AAI9BC,IAAAA,YAJ8B;AAK9BC,IAAAA,sBAL8B;AAM9BC,IAAAA,mBAN8B;AAO9BC,IAAAA;AAP8B,GAQxB;AACN,QAAMC,kBAAkB,GAAG,CAAC,EAAEL,eAAF,aAAEA,eAAF,eAAEA,eAAe,CAAEM,MAAnB,CAA5B;AACA,QAAMC,eAAe,GAAG,CAAC,EAAEN,YAAF,aAAEA,YAAF,eAAEA,YAAY,CAAEK,MAAhB,CAAzB;AAEA;;AACA,QAAME,iBAAiB,GAAG,cAAI,kBAAJ,CAA1B;AAEAJ,EAAAA,WAAW,GAAGA,WAAW,IAAII,iBAA7B;AAEA,SACC,qDACGV,mBAAmB,IAAIO,kBAAvB,IACD,4BAAC,qBAAD;AAAW,IAAA,KAAK,EAAG,cAAI,OAAJ;AAAnB,KACGL,eAAe,CAACS,GAAhB,CAAuBC,IAAF,IAAY;AAClC,UAAMC,KAAK,GAAG,kCAAgBD,IAAI,CAACE,KAAL,CAAWC,QAA3B,CAAd;AACA,WACC,4BAAC,oBAAD;AACC,MAAA,OAAO,EAAG,MAAM;AACfX,QAAAA,sBAAsB,CAAEQ,IAAF,CAAtB;AACA,OAHF;AAIC,MAAA,GAAG,EAAGA,IAAI,CAACI,EAJZ;AAKC,oBAAa,mBAASV,WAAT,EAAsBO,KAAtB;AALd,OAOGA,KAPH,CADD;AAWA,GAbC,CADH,CAFF,EAmBGZ,gBAAgB,IAAIQ,eAApB,IACD,4BAAC,qBAAD;AAAW,IAAA,KAAK,EAAG,cAAI,eAAJ;AAAnB,KACGN,YAAY,CAACQ,GAAb,CAAoBC,IAAF,IAAY;AAC/B,UAAMC,KAAK,GAAG,kCAAgBD,IAAI,CAACK,IAArB,CAAd;AACA,WACC,4BAAC,oBAAD;AACC,MAAA,OAAO,EAAG,MAAM;AACfZ,QAAAA,mBAAmB,CAAEO,IAAF,CAAnB;AACA,OAHF;AAIC,MAAA,GAAG,EAAGA,IAAI,CAACI,EAJZ;AAKC,oBAAa,mBACZN,iBADY,EAEZG,KAFY;AALd,OAUGA,KAVH,CADD;AAcA,GAhBC,CADH,CApBF,CADD;AA2CA,CA5DD;;eA8Ded,oB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuGroup, MenuItem } from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { decodeEntities } from '@wordpress/html-entities';\n\nconst ExistingMenusOptions = ( {\n\tshowNavigationMenus,\n\tshowClassicMenus = false,\n\tnavigationMenus,\n\tclassicMenus,\n\tonSelectNavigationMenu,\n\tonSelectClassicMenu,\n\tactionLabel,\n} ) => {\n\tconst hasNavigationMenus = !! navigationMenus?.length;\n\tconst hasClassicMenus = !! classicMenus?.length;\n\n\t/* translators: %s: The name of a menu. */\n\tconst createActionLabel = __( \"Create from '%s'\" );\n\n\tactionLabel = actionLabel || createActionLabel;\n\n\treturn (\n\t\t<>\n\t\t\t{ showNavigationMenus && hasNavigationMenus && (\n\t\t\t\t<MenuGroup label={ __( 'Menus' ) }>\n\t\t\t\t\t{ navigationMenus.map( ( menu ) => {\n\t\t\t\t\t\tconst label = decodeEntities( menu.title.rendered );\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tonSelectNavigationMenu( menu );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tkey={ menu.id }\n\t\t\t\t\t\t\t\taria-label={ sprintf( actionLabel, label ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t\t{ showClassicMenus && hasClassicMenus && (\n\t\t\t\t<MenuGroup label={ __( 'Classic Menus' ) }>\n\t\t\t\t\t{ classicMenus.map( ( menu ) => {\n\t\t\t\t\t\tconst label = decodeEntities( menu.name );\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tonSelectClassicMenu( menu );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tkey={ menu.id }\n\t\t\t\t\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t\t\t\t\tcreateActionLabel,\n\t\t\t\t\t\t\t\t\tlabel\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{ label }\n\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport default ExistingMenusOptions;\n"]}

package/build/navigation/use-convert-classic-menu.js

@@ -1,59 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useConvertClassicMenu;
-
-var _element = require("@wordpress/element");
-
-var _useNavigationEntities = _interopRequireDefault(require("./use-navigation-entities"));
-
-var _menuItemsToBlocks = _interopRequireDefault(require("./menu-items-to-blocks"));
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-function useConvertClassicMenu(onFinish) {
-  const [selectedMenu, setSelectedMenu] = (0, _element.useState)();
-  const [isAwaitingMenuItemResolution, setIsAwaitingMenuItemResolution] = (0, _element.useState)(false);
-  const [menuName, setMenuName] = (0, _element.useState)('');
-  const {
-    menuItems,
-    hasResolvedMenuItems
-  } = (0, _useNavigationEntities.default)(selectedMenu);
-  const createFromMenu = (0, _element.useCallback)(name => {
-    const {
-      innerBlocks: blocks
-    } = (0, _menuItemsToBlocks.default)(menuItems);
-    onFinish(blocks, name);
-  }, [menuItems, _menuItemsToBlocks.default, onFinish]);
-  (0, _element.useEffect)(() => {
-    // If the user selected a menu but we had to wait for menu items to
-    // finish resolving, then create the block once resolution finishes.
-    if (isAwaitingMenuItemResolution && hasResolvedMenuItems) {
-      createFromMenu(menuName);
-      setIsAwaitingMenuItemResolution(false);
-    }
-  }, [isAwaitingMenuItemResolution, hasResolvedMenuItems, menuName]);
-  return (0, _element.useCallback)((id, name) => {
-    setSelectedMenu(id); // If we have menu items, create the block right away.
-
-    if (hasResolvedMenuItems) {
-      createFromMenu(name);
-      return;
-    } // Otherwise, create the block when resolution finishes.
-
-
-    setIsAwaitingMenuItemResolution(true); // Store the name to use later.
-
-    setMenuName(name);
-  }, [hasResolvedMenuItems, createFromMenu]);
-}
-//# sourceMappingURL=use-convert-classic-menu.js.map

package/build/navigation/use-convert-classic-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["@wordpress/block-library/src/navigation/use-convert-classic-menu.js"],"names":["useConvertClassicMenu","onFinish","selectedMenu","setSelectedMenu","isAwaitingMenuItemResolution","setIsAwaitingMenuItemResolution","menuName","setMenuName","menuItems","hasResolvedMenuItems","createFromMenu","name","innerBlocks","blocks","menuItemsToBlocks","id"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIe,SAASA,qBAAT,CAAgCC,QAAhC,EAA2C;AACzD,QAAM,CAAEC,YAAF,EAAgBC,eAAhB,IAAoC,wBAA1C;AACA,QAAM,CACLC,4BADK,EAELC,+BAFK,IAGF,uBAAU,KAAV,CAHJ;AAIA,QAAM,CAAEC,QAAF,EAAYC,WAAZ,IAA4B,uBAAU,EAAV,CAAlC;AAEA,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAAsC,oCAC3CP,YAD2C,CAA5C;AAIA,QAAMQ,cAAc,GAAG,0BACpBC,IAAF,IAAY;AACX,UAAM;AAAEC,MAAAA,WAAW,EAAEC;AAAf,QAA0B,gCAAmBL,SAAnB,CAAhC;AACAP,IAAAA,QAAQ,CAAEY,MAAF,EAAUF,IAAV,CAAR;AACA,GAJqB,EAKtB,CAAEH,SAAF,EAAaM,0BAAb,EAAgCb,QAAhC,CALsB,CAAvB;AAQA,0BAAW,MAAM;AAChB;AACA;AACA,QAAKG,4BAA4B,IAAIK,oBAArC,EAA4D;AAC3DC,MAAAA,cAAc,CAAEJ,QAAF,CAAd;AACAD,MAAAA,+BAA+B,CAAE,KAAF,CAA/B;AACA;AACD,GAPD,EAOG,CAAED,4BAAF,EAAgCK,oBAAhC,EAAsDH,QAAtD,CAPH;AASA,SAAO,0BACN,CAAES,EAAF,EAAMJ,IAAN,KAAgB;AACfR,IAAAA,eAAe,CAAEY,EAAF,CAAf,CADe,CAGf;;AACA,QAAKN,oBAAL,EAA4B;AAC3BC,MAAAA,cAAc,CAAEC,IAAF,CAAd;AACA;AACA,KAPc,CASf;;;AACAN,IAAAA,+BAA+B,CAAE,IAAF,CAA/B,CAVe,CAWf;;AACAE,IAAAA,WAAW,CAAEI,IAAF,CAAX;AACA,GAdK,EAeN,CAAEF,oBAAF,EAAwBC,cAAxB,CAfM,CAAP;AAiBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useState, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useNavigationEntities from './use-navigation-entities';\nimport menuItemsToBlocks from './menu-items-to-blocks';\n\nexport default function useConvertClassicMenu( onFinish ) {\n\tconst [ selectedMenu, setSelectedMenu ] = useState();\n\tconst [\n\t\tisAwaitingMenuItemResolution,\n\t\tsetIsAwaitingMenuItemResolution,\n\t] = useState( false );\n\tconst [ menuName, setMenuName ] = useState( '' );\n\n\tconst { menuItems, hasResolvedMenuItems } = useNavigationEntities(\n\t\tselectedMenu\n\t);\n\n\tconst createFromMenu = useCallback(\n\t\t( name ) => {\n\t\t\tconst { innerBlocks: blocks } = menuItemsToBlocks( menuItems );\n\t\t\tonFinish( blocks, name );\n\t\t},\n\t\t[ menuItems, menuItemsToBlocks, onFinish ]\n\t);\n\n\tuseEffect( () => {\n\t\t// If the user selected a menu but we had to wait for menu items to\n\t\t// finish resolving, then create the block once resolution finishes.\n\t\tif ( isAwaitingMenuItemResolution && hasResolvedMenuItems ) {\n\t\t\tcreateFromMenu( menuName );\n\t\t\tsetIsAwaitingMenuItemResolution( false );\n\t\t}\n\t}, [ isAwaitingMenuItemResolution, hasResolvedMenuItems, menuName ] );\n\n\treturn useCallback(\n\t\t( id, name ) => {\n\t\t\tsetSelectedMenu( id );\n\n\t\t\t// If we have menu items, create the block right away.\n\t\t\tif ( hasResolvedMenuItems ) {\n\t\t\t\tcreateFromMenu( name );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Otherwise, create the block when resolution finishes.\n\t\t\tsetIsAwaitingMenuItemResolution( true );\n\t\t\t// Store the name to use later.\n\t\t\tsetMenuName( name );\n\t\t},\n\t\t[ hasResolvedMenuItems, createFromMenu ]\n\t);\n}\n"]}