@wordpress/block-library 6.0.2 → 6.0.3

package/build-module/navigation/edit/navigation-menu-name-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/navigation-menu-name-modal.js"],"names":["Button","Flex","FlexItem","Modal","TextControl","useState","__","NavigationMenuNameModal","title","finishButtonText","onFinish","onRequestClose","value","name","setName","event","preventDefault","length"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,MADD,EAECC,IAFD,EAGCC,QAHD,EAICC,KAJD,EAKCC,WALD,QAMO,uBANP;AAOA,SAASC,QAAT,QAAyB,oBAAzB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA,eAAe,SAASC,uBAAT,CAAkC;AAChDC,EAAAA,KADgD;AAEhDC,EAAAA,gBAAgB,GAAGH,EAAE,CAAE,QAAF,CAF2B;AAGhDI,EAAAA,QAHgD;AAIhDC,EAAAA,cAJgD;AAKhDC,EAAAA,KAAK,GAAG;AALwC,CAAlC,EAMX;AACH,QAAM,CAAEC,IAAF,EAAQC,OAAR,IAAoBT,QAAQ,CAAEO,KAAF,CAAlC;AAEA,SACC,cAAC,KAAD;AACC,IAAA,KAAK,EAAGJ,KADT;AAEC,IAAA,UAAU,EAAGF,EAAE,CAAE,QAAF,CAFhB;AAGC,IAAA,cAAc,EAAGK,cAHlB;AAIC,IAAA,gBAAgB,EAAC;AAJlB,KAMC;AACC,IAAA,QAAQ,EAAKI,KAAF,IAAa;AACvBA,MAAAA,KAAK,CAACC,cAAN;AACAN,MAAAA,QAAQ,CAAEG,IAAF,CAAR;AACA;AAJF,KAMC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGP,EAAE,CAAE,MAAF,CADX;AAEC,IAAA,KAAK,EAAGO,IAFT;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IAND,EAWC,cAAC,IAAD;AACC,IAAA,SAAS,EAAC,oEADX;AAEC,IAAA,OAAO,EAAC;AAFT,KAIC,cAAC,QAAD,QACC,cAAC,MAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,OAAO,EAAG,MAAM;AACfH,MAAAA,cAAc;AACd;AAJF,KAMGL,EAAE,CAAE,QAAF,CANL,CADD,CAJD,EAcC,cAAC,QAAD,QACC,cAAC,MAAD;AACC,IAAA,OAAO,EAAC,SADT;AAEC,IAAA,IAAI,EAAC,QAFN;AAGC,IAAA,QAAQ,EAAG,CAAEO,IAAI,CAACI,MAHnB;AAIC,qBAAgB,CAAEJ,IAAI,CAACI;AAJxB,KAMGR,gBANH,CADD,CAdD,CAXD,CAND,CADD;AA8CA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tFlex,\n\tFlexItem,\n\tModal,\n\tTextControl,\n} from '@wordpress/components';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\nexport default function NavigationMenuNameModal( {\n\ttitle,\n\tfinishButtonText = __( 'Create' ),\n\tonFinish,\n\tonRequestClose,\n\tvalue = '',\n} ) {\n\tconst [ name, setName ] = useState( value );\n\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ title }\n\t\t\tcloseLabel={ __( 'Cancel' ) }\n\t\t\tonRequestClose={ onRequestClose }\n\t\t\toverlayClassName=\"wp-block-template-part__placeholder-create-new__title-form\"\n\t\t>\n\t\t\t<form\n\t\t\t\tonSubmit={ ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tonFinish( name );\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<TextControl\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ name }\n\t\t\t\t\tonChange={ setName }\n\t\t\t\t/>\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"wp-block-template-part__placeholder-create-new__title-form-actions\"\n\t\t\t\t\tjustify=\"flex-end\"\n\t\t\t\t>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonRequestClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t\tdisabled={ ! name.length }\n\t\t\t\t\t\t\taria-disabled={ ! name.length }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ finishButtonText }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</form>\n\t\t</Modal>\n\t);\n}\n"]}

package/build-module/navigation/edit/navigation-menu-publish-button.js

@@ -0,0 +1,40 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { ToolbarButton } from '@wordpress/components';
+import { useEntityId, useEntityProp, store as coreStore } from '@wordpress/core-data';
+import { useDispatch } from '@wordpress/data';
+import { useState } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import NavigationMenuNameModal from './navigation-menu-name-modal';
+export default function NavigationMenuPublishButton() {
+  const [isNameModalVisible, setIsNameModalVisible] = useState(false);
+  const id = useEntityId('postType', 'wp_navigation');
+  const [navigationMenuTitle] = useEntityProp('postType', 'wp_navigation', 'title');
+  const {
+    editEntityRecord,
+    saveEditedEntityRecord
+  } = useDispatch(coreStore);
+  return createElement(Fragment, null, createElement(ToolbarButton, {
+    onClick: () => setIsNameModalVisible(true)
+  }, __('Save as')), isNameModalVisible && createElement(NavigationMenuNameModal, {
+    title: __('Save your new navigation menu'),
+    value: navigationMenuTitle,
+    onRequestClose: () => setIsNameModalVisible(false),
+    finishButtonText: __('Save'),
+    onFinish: updatedTitle => {
+      editEntityRecord('postType', 'wp_navigation', id, {
+        title: updatedTitle,
+        status: 'publish'
+      });
+      saveEditedEntityRecord('postType', 'wp_navigation', id);
+    }
+  }));
+}
+//# sourceMappingURL=navigation-menu-publish-button.js.map

package/build-module/navigation/edit/navigation-menu-publish-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/navigation-menu-publish-button.js"],"names":["ToolbarButton","useEntityId","useEntityProp","store","coreStore","useDispatch","useState","__","NavigationMenuNameModal","NavigationMenuPublishButton","isNameModalVisible","setIsNameModalVisible","id","navigationMenuTitle","editEntityRecord","saveEditedEntityRecord","updatedTitle","title","status"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,uBAA9B;AACA,SACCC,WADD,EAECC,aAFD,EAGCC,KAAK,IAAIC,SAHV,QAIO,sBAJP;AAKA,SAASC,WAAT,QAA4B,iBAA5B;AACA,SAASC,QAAT,QAAyB,oBAAzB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,uBAAP,MAAoC,8BAApC;AAEA,eAAe,SAASC,2BAAT,GAAuC;AACrD,QAAM,CAAEC,kBAAF,EAAsBC,qBAAtB,IAAgDL,QAAQ,CAAE,KAAF,CAA9D;AACA,QAAMM,EAAE,GAAGX,WAAW,CAAE,UAAF,EAAc,eAAd,CAAtB;AACA,QAAM,CAAEY,mBAAF,IAA0BX,aAAa,CAC5C,UAD4C,EAE5C,eAF4C,EAG5C,OAH4C,CAA7C;AAKA,QAAM;AAAEY,IAAAA,gBAAF;AAAoBC,IAAAA;AAApB,MAA+CV,WAAW,CAC/DD,SAD+D,CAAhE;AAIA,SACC,8BACC,cAAC,aAAD;AAAe,IAAA,OAAO,EAAG,MAAMO,qBAAqB,CAAE,IAAF;AAApD,KACGJ,EAAE,CAAE,SAAF,CADL,CADD,EAIGG,kBAAkB,IACnB,cAAC,uBAAD;AACC,IAAA,KAAK,EAAGH,EAAE,CAAE,+BAAF,CADX;AAEC,IAAA,KAAK,EAAGM,mBAFT;AAGC,IAAA,cAAc,EAAG,MAAMF,qBAAqB,CAAE,KAAF,CAH7C;AAIC,IAAA,gBAAgB,EAAGJ,EAAE,CAAE,MAAF,CAJtB;AAKC,IAAA,QAAQ,EAAKS,YAAF,IAAoB;AAC9BF,MAAAA,gBAAgB,CAAE,UAAF,EAAc,eAAd,EAA+BF,EAA/B,EAAmC;AAClDK,QAAAA,KAAK,EAAED,YAD2C;AAElDE,QAAAA,MAAM,EAAE;AAF0C,OAAnC,CAAhB;AAIAH,MAAAA,sBAAsB,CACrB,UADqB,EAErB,eAFqB,EAGrBH,EAHqB,CAAtB;AAKA;AAfF,IALF,CADD;AA0BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { ToolbarButton } from '@wordpress/components';\nimport {\n\tuseEntityId,\n\tuseEntityProp,\n\tstore as coreStore,\n} from '@wordpress/core-data';\nimport { useDispatch } from '@wordpress/data';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport NavigationMenuNameModal from './navigation-menu-name-modal';\n\nexport default function NavigationMenuPublishButton() {\n\tconst [ isNameModalVisible, setIsNameModalVisible ] = useState( false );\n\tconst id = useEntityId( 'postType', 'wp_navigation' );\n\tconst [ navigationMenuTitle ] = useEntityProp(\n\t\t'postType',\n\t\t'wp_navigation',\n\t\t'title'\n\t);\n\tconst { editEntityRecord, saveEditedEntityRecord } = useDispatch(\n\t\tcoreStore\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<ToolbarButton onClick={ () => setIsNameModalVisible( true ) }>\n\t\t\t\t{ __( 'Save as' ) }\n\t\t\t</ToolbarButton>\n\t\t\t{ isNameModalVisible && (\n\t\t\t\t<NavigationMenuNameModal\n\t\t\t\t\ttitle={ __( 'Save your new navigation menu' ) }\n\t\t\t\t\tvalue={ navigationMenuTitle }\n\t\t\t\t\tonRequestClose={ () => setIsNameModalVisible( false ) }\n\t\t\t\t\tfinishButtonText={ __( 'Save' ) }\n\t\t\t\t\tonFinish={ ( updatedTitle ) => {\n\t\t\t\t\t\teditEntityRecord( 'postType', 'wp_navigation', id, {\n\t\t\t\t\t\t\ttitle: updatedTitle,\n\t\t\t\t\t\t\tstatus: 'publish',\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsaveEditedEntityRecord(\n\t\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t\t'wp_navigation',\n\t\t\t\t\t\t\tid\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</>\n\t);\n}\n"]}

package/build-module/navigation/edit/navigation-menu-selector.js

@@ -0,0 +1,36 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { MenuGroup, MenuItem, MenuItemsChoice } from '@wordpress/components';
+import { useEntityId } from '@wordpress/core-data';
+import { __ } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import useNavigationMenu from '../use-navigation-menu';
+export default function NavigationMenuSelector({
+  onSelect,
+  onCreateNew
+}) {
+  const {
+    navigationMenus
+  } = useNavigationMenu();
+  const navigationMenuId = useEntityId('postType', 'wp_navigation');
+  return createElement(Fragment, null, createElement(MenuGroup, null, createElement(MenuItemsChoice, {
+    value: navigationMenuId,
+    onSelect: selectedId => onSelect(navigationMenus.find(post => post.id === selectedId)),
+    choices: navigationMenus.map(({
+      id,
+      title
+    }) => ({
+      value: id,
+      label: title.rendered
+    }))
+  })), createElement(MenuGroup, null, createElement(MenuItem, {
+    onClick: onCreateNew
+  }, __('Create new menu'))));
+}
+//# sourceMappingURL=navigation-menu-selector.js.map

package/build-module/navigation/edit/navigation-menu-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/navigation-menu-selector.js"],"names":["MenuGroup","MenuItem","MenuItemsChoice","useEntityId","__","useNavigationMenu","NavigationMenuSelector","onSelect","onCreateNew","navigationMenus","navigationMenuId","selectedId","find","post","id","map","title","value","label","rendered"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,QAApB,EAA8BC,eAA9B,QAAqD,uBAArD;AACA,SAASC,WAAT,QAA4B,sBAA5B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,iBAAP,MAA8B,wBAA9B;AAEA,eAAe,SAASC,sBAAT,CAAiC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAjC,EAA6D;AAC3E,QAAM;AAAEC,IAAAA;AAAF,MAAsBJ,iBAAiB,EAA7C;AACA,QAAMK,gBAAgB,GAAGP,WAAW,CAAE,UAAF,EAAc,eAAd,CAApC;AAEA,SACC,8BACC,cAAC,SAAD,QACC,cAAC,eAAD;AACC,IAAA,KAAK,EAAGO,gBADT;AAEC,IAAA,QAAQ,EAAKC,UAAF,IACVJ,QAAQ,CACPE,eAAe,CAACG,IAAhB,CACGC,IAAF,IAAYA,IAAI,CAACC,EAAL,KAAYH,UADzB,CADO,CAHV;AASC,IAAA,OAAO,EAAGF,eAAe,CAACM,GAAhB,CAAqB,CAAE;AAAED,MAAAA,EAAF;AAAME,MAAAA;AAAN,KAAF,MAAuB;AACrDC,MAAAA,KAAK,EAAEH,EAD8C;AAErDI,MAAAA,KAAK,EAAEF,KAAK,CAACG;AAFwC,KAAvB,CAArB;AATX,IADD,CADD,EAiBC,cAAC,SAAD,QACC,cAAC,QAAD;AAAU,IAAA,OAAO,EAAGX;AAApB,KACGJ,EAAE,CAAE,iBAAF,CADL,CADD,CAjBD,CADD;AAyBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { MenuGroup, MenuItem, MenuItemsChoice } from '@wordpress/components';\nimport { useEntityId } from '@wordpress/core-data';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useNavigationMenu from '../use-navigation-menu';\n\nexport default function NavigationMenuSelector( { onSelect, onCreateNew } ) {\n\tconst { navigationMenus } = useNavigationMenu();\n\tconst navigationMenuId = useEntityId( 'postType', 'wp_navigation' );\n\n\treturn (\n\t\t<>\n\t\t\t<MenuGroup>\n\t\t\t\t<MenuItemsChoice\n\t\t\t\t\tvalue={ navigationMenuId }\n\t\t\t\t\tonSelect={ ( selectedId ) =>\n\t\t\t\t\t\tonSelect(\n\t\t\t\t\t\t\tnavigationMenus.find(\n\t\t\t\t\t\t\t\t( post ) => post.id === selectedId\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\tchoices={ navigationMenus.map( ( { id, title } ) => ( {\n\t\t\t\t\t\tvalue: id,\n\t\t\t\t\t\tlabel: title.rendered,\n\t\t\t\t\t} ) ) }\n\t\t\t\t/>\n\t\t\t</MenuGroup>\n\t\t\t<MenuGroup>\n\t\t\t\t<MenuItem onClick={ onCreateNew }>\n\t\t\t\t\t{ __( 'Create new menu' ) }\n\t\t\t\t</MenuItem>\n\t\t\t</MenuGroup>\n\t\t</>\n\t);\n}\n"]}

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

@@ -0,0 +1,189 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { serialize, createBlock } from '@wordpress/blocks';
+import { Placeholder, Button, DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';
+import { store as coreStore } from '@wordpress/core-data';
+import { useDispatch } from '@wordpress/data';
+import { useCallback, useState, useEffect } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+import { navigation, chevronDown, Icon } from '@wordpress/icons';
+/**
+ * Internal dependencies
+ */
+
+import useNavigationEntities from '../../use-navigation-entities';
+import PlaceholderPreview from './placeholder-preview';
+import menuItemsToBlocks from '../../menu-items-to-blocks';
+import NavigationMenuNameModal from '../navigation-menu-name-modal';
+import useNavigationMenu from '../../use-navigation-menu';
+
+const ExistingMenusDropdown = ({
+  canSwitchNavigationMenu,
+  navigationMenus,
+  setSelectedMenu,
+  onFinish,
+  menus,
+  onCreateFromMenu
+}) => {
+  const toggleProps = {
+    variant: 'primary',
+    className: 'wp-block-navigation-placeholder__actions__dropdown'
+  };
+  return createElement(DropdownMenu, {
+    text: __('Select existing menu'),
+    icon: chevronDown,
+    toggleProps: toggleProps,
+    popoverProps: {
+      isAlternate: true
+    }
+  }, ({
+    onClose
+  }) => createElement(Fragment, null, createElement(MenuGroup, {
+    label: "Menus"
+  }, canSwitchNavigationMenu && navigationMenus.map(menu => {
+    return createElement(MenuItem, {
+      onClick: () => {
+        setSelectedMenu(menu.id);
+        onFinish(menu);
+      },
+      onClose: onClose,
+      key: menu.id
+    }, menu.title.rendered);
+  })), createElement(MenuGroup, {
+    label: "Classic Menus"
+  }, menus.map(menu => {
+    return createElement(MenuItem, {
+      onClick: () => {
+        setSelectedMenu(menu.id);
+        onCreateFromMenu(menu.name);
+      },
+      onClose: onClose,
+      key: menu.id
+    }, menu.name);
+  }))));
+};
+
+export default function NavigationPlaceholder({
+  onFinish,
+  canSwitchNavigationMenu,
+  hasResolvedNavigationMenus
+}) {
+  const [selectedMenu, setSelectedMenu] = useState();
+  const [isCreatingFromMenu, setIsCreatingFromMenu] = useState(false);
+  const [menuName, setMenuName] = useState('');
+  const [isNewMenuModalVisible, setIsNewMenuModalVisible] = useState(false);
+  const [createEmpty, setCreateEmpty] = useState(false);
+  const {
+    saveEntityRecord
+  } = useDispatch(coreStore); // This callback uses data from the two placeholder steps and only creates
+  // a new navigation menu when the user completes the final step.
+
+  const createNavigationMenu = useCallback(async (title = __('Untitled Navigation Menu'), blocks = []) => {
+    const record = {
+      title,
+      content: serialize(blocks),
+      status: 'publish'
+    };
+    const navigationMenu = await saveEntityRecord('postType', 'wp_navigation', record);
+    return navigationMenu;
+  }, [serialize, saveEntityRecord]);
+
+  const onFinishMenuCreation = async (navigationMenuTitle, blocks) => {
+    const navigationMenu = await createNavigationMenu(navigationMenuTitle, blocks);
+    onFinish(navigationMenu);
+  };
+
+  const {
+    isResolvingPages,
+    menus,
+    isResolvingMenus,
+    menuItems,
+    hasResolvedMenuItems,
+    hasPages,
+    hasMenus
+  } = useNavigationEntities(selectedMenu);
+  const isStillLoading = isResolvingPages || isResolvingMenus;
+  const createFromMenu = useCallback(name => {
+    const {
+      innerBlocks: blocks
+    } = menuItemsToBlocks(menuItems);
+    onFinishMenuCreation(name, blocks);
+  }, [menuItems, menuItemsToBlocks, onFinish]);
+
+  const onCreateFromMenu = name => {
+    // If we have menu items, create the block right away.
+    if (hasResolvedMenuItems) {
+      createFromMenu(name);
+      return;
+    } // Otherwise, create the block when resolution finishes.
+
+
+    setIsCreatingFromMenu(true); // Store the name to use later.
+
+    setMenuName(name);
+  };
+
+  const onCreateEmptyMenu = name => {
+    onFinishMenuCreation(name, []);
+  };
+
+  const onCreateAllPages = name => {
+    const block = [createBlock('core/page-list')];
+    onFinishMenuCreation(name, block);
+    setIsNewMenuModalVisible(true);
+  };
+
+  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 (isCreatingFromMenu && hasResolvedMenuItems) {
+      createFromMenu(menuName);
+      setIsCreatingFromMenu(false);
+    }
+  }, [isCreatingFromMenu, hasResolvedMenuItems, menuName]);
+  const {
+    navigationMenus
+  } = useNavigationMenu();
+  return createElement(Fragment, null, (!hasResolvedNavigationMenus || isStillLoading) && createElement(PlaceholderPreview, {
+    isLoading: true
+  }), hasResolvedNavigationMenus && !isStillLoading && createElement(Placeholder, {
+    className: "wp-block-navigation-placeholder"
+  }, createElement(PlaceholderPreview, null), createElement("div", {
+    className: "wp-block-navigation-placeholder__controls"
+  }, createElement("div", {
+    className: "wp-block-navigation-placeholder__actions"
+  }, createElement("div", {
+    className: "wp-block-navigation-placeholder__actions__indicator"
+  }, createElement(Icon, {
+    icon: navigation
+  }), ' ', __('Navigation')), hasMenus || navigationMenus.length ? createElement(ExistingMenusDropdown, {
+    canSwitchNavigationMenu: canSwitchNavigationMenu,
+    navigationMenus: navigationMenus,
+    setSelectedMenu: setSelectedMenu,
+    onFinish: onFinish,
+    menus: menus,
+    onCreateFromMenu: onCreateFromMenu
+  }) : undefined, hasPages ? createElement(Button, {
+    variant: hasMenus || canSwitchNavigationMenu ? 'tertiary' : 'primary',
+    onClick: () => {
+      setIsNewMenuModalVisible(true);
+      setCreateEmpty(false);
+    }
+  }, __('Add all pages')) : undefined, createElement(Button, {
+    variant: "tertiary",
+    onClick: () => {
+      setIsNewMenuModalVisible(true);
+      setCreateEmpty(true);
+    }
+  }, __('Start empty'))))), isNewMenuModalVisible && createElement(NavigationMenuNameModal, {
+    title: __('Create your new navigation menu'),
+    onRequestClose: () => {
+      setIsNewMenuModalVisible(false);
+    },
+    onFinish: createEmpty ? onCreateEmptyMenu : onCreateAllPages
+  }));
+}
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/placeholder/index.js"],"names":["serialize","createBlock","Placeholder","Button","DropdownMenu","MenuGroup","MenuItem","store","coreStore","useDispatch","useCallback","useState","useEffect","__","navigation","chevronDown","Icon","useNavigationEntities","PlaceholderPreview","menuItemsToBlocks","NavigationMenuNameModal","useNavigationMenu","ExistingMenusDropdown","canSwitchNavigationMenu","navigationMenus","setSelectedMenu","onFinish","menus","onCreateFromMenu","toggleProps","variant","className","isAlternate","onClose","map","menu","id","title","rendered","name","NavigationPlaceholder","hasResolvedNavigationMenus","selectedMenu","isCreatingFromMenu","setIsCreatingFromMenu","menuName","setMenuName","isNewMenuModalVisible","setIsNewMenuModalVisible","createEmpty","setCreateEmpty","saveEntityRecord","createNavigationMenu","blocks","record","content","status","navigationMenu","onFinishMenuCreation","navigationMenuTitle","isResolvingPages","isResolvingMenus","menuItems","hasResolvedMenuItems","hasPages","hasMenus","isStillLoading","createFromMenu","innerBlocks","onCreateEmptyMenu","onCreateAllPages","block","length","undefined"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { serialize, createBlock } from '@wordpress/blocks';\nimport {\n\tPlaceholder,\n\tButton,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n} from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch } from '@wordpress/data';\nimport { useCallback, useState, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { navigation, chevronDown, Icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\n\nimport useNavigationEntities from '../../use-navigation-entities';\nimport PlaceholderPreview from './placeholder-preview';\nimport menuItemsToBlocks from '../../menu-items-to-blocks';\nimport NavigationMenuNameModal from '../navigation-menu-name-modal';\nimport useNavigationMenu from '../../use-navigation-menu';\n\nconst ExistingMenusDropdown = ( {\n\tcanSwitchNavigationMenu,\n\tnavigationMenus,\n\tsetSelectedMenu,\n\tonFinish,\n\tmenus,\n\tonCreateFromMenu,\n} ) => {\n\tconst toggleProps = {\n\t\tvariant: 'primary',\n\t\tclassName: 'wp-block-navigation-placeholder__actions__dropdown',\n\t};\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttext={ __( 'Select existing menu' ) }\n\t\t\ticon={ chevronDown }\n\t\t\ttoggleProps={ toggleProps }\n\t\t\tpopoverProps={ { isAlternate: true } }\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<MenuGroup label=\"Menus\">\n\t\t\t\t\t\t{ canSwitchNavigationMenu &&\n\t\t\t\t\t\t\tnavigationMenus.map( ( menu ) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\tsetSelectedMenu( menu.id );\n\t\t\t\t\t\t\t\t\t\t\tonFinish( menu );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\t\t\tkey={ menu.id }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ menu.title.rendered }\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t<MenuGroup label=\"Classic Menus\">\n\t\t\t\t\t\t{ menus.map( ( menu ) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tsetSelectedMenu( menu.id );\n\t\t\t\t\t\t\t\t\t\tonCreateFromMenu( menu.name );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\t\tkey={ menu.id }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ menu.name }\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</MenuGroup>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n};\n\nexport default function NavigationPlaceholder( {\n\tonFinish,\n\tcanSwitchNavigationMenu,\n\thasResolvedNavigationMenus,\n} ) {\n\tconst [ selectedMenu, setSelectedMenu ] = useState();\n\n\tconst [ isCreatingFromMenu, setIsCreatingFromMenu ] = useState( false );\n\n\tconst [ menuName, setMenuName ] = useState( '' );\n\n\tconst [ isNewMenuModalVisible, setIsNewMenuModalVisible ] = useState(\n\t\tfalse\n\t);\n\n\tconst [ createEmpty, setCreateEmpty ] = useState( false );\n\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\n\t// This callback uses data from the two placeholder steps and only creates\n\t// a new navigation menu when the user completes the final step.\n\tconst createNavigationMenu = useCallback(\n\t\tasync ( title = __( 'Untitled Navigation Menu' ), blocks = [] ) => {\n\t\t\tconst record = {\n\t\t\t\ttitle,\n\t\t\t\tcontent: serialize( blocks ),\n\t\t\t\tstatus: 'publish',\n\t\t\t};\n\n\t\t\tconst navigationMenu = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_navigation',\n\t\t\t\trecord\n\t\t\t);\n\n\t\t\treturn navigationMenu;\n\t\t},\n\t\t[ serialize, saveEntityRecord ]\n\t);\n\n\tconst onFinishMenuCreation = async ( navigationMenuTitle, blocks ) => {\n\t\tconst navigationMenu = await createNavigationMenu(\n\t\t\tnavigationMenuTitle,\n\t\t\tblocks\n\t\t);\n\t\tonFinish( navigationMenu );\n\t};\n\n\tconst {\n\t\tisResolvingPages,\n\t\tmenus,\n\t\tisResolvingMenus,\n\t\tmenuItems,\n\t\thasResolvedMenuItems,\n\t\thasPages,\n\t\thasMenus,\n\t} = useNavigationEntities( selectedMenu );\n\n\tconst isStillLoading = isResolvingPages || isResolvingMenus;\n\n\tconst createFromMenu = useCallback(\n\t\t( name ) => {\n\t\t\tconst { innerBlocks: blocks } = menuItemsToBlocks( menuItems );\n\t\t\tonFinishMenuCreation( name, blocks );\n\t\t},\n\t\t[ menuItems, menuItemsToBlocks, onFinish ]\n\t);\n\n\tconst onCreateFromMenu = ( name ) => {\n\t\t// If we have menu items, create the block right away.\n\t\tif ( hasResolvedMenuItems ) {\n\t\t\tcreateFromMenu( name );\n\t\t\treturn;\n\t\t}\n\n\t\t// Otherwise, create the block when resolution finishes.\n\t\tsetIsCreatingFromMenu( true );\n\t\t// Store the name to use later.\n\t\tsetMenuName( name );\n\t};\n\n\tconst onCreateEmptyMenu = ( name ) => {\n\t\tonFinishMenuCreation( name, [] );\n\t};\n\n\tconst onCreateAllPages = ( name ) => {\n\t\tconst block = [ createBlock( 'core/page-list' ) ];\n\t\tonFinishMenuCreation( name, block );\n\t\tsetIsNewMenuModalVisible( true );\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 ( isCreatingFromMenu && hasResolvedMenuItems ) {\n\t\t\tcreateFromMenu( menuName );\n\t\t\tsetIsCreatingFromMenu( false );\n\t\t}\n\t}, [ isCreatingFromMenu, hasResolvedMenuItems, menuName ] );\n\n\tconst { navigationMenus } = useNavigationMenu();\n\n\treturn (\n\t\t<>\n\t\t\t{ ( ! hasResolvedNavigationMenus || isStillLoading ) && (\n\t\t\t\t<PlaceholderPreview isLoading />\n\t\t\t) }\n\t\t\t{ hasResolvedNavigationMenus && ! isStillLoading && (\n\t\t\t\t<Placeholder className=\"wp-block-navigation-placeholder\">\n\t\t\t\t\t<PlaceholderPreview />\n\t\t\t\t\t<div className=\"wp-block-navigation-placeholder__controls\">\n\t\t\t\t\t\t<div className=\"wp-block-navigation-placeholder__actions\">\n\t\t\t\t\t\t\t<div className=\"wp-block-navigation-placeholder__actions__indicator\">\n\t\t\t\t\t\t\t\t<Icon icon={ navigation } />{ ' ' }\n\t\t\t\t\t\t\t\t{ __( 'Navigation' ) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{ hasMenus || navigationMenus.length ? (\n\t\t\t\t\t\t\t\t<ExistingMenusDropdown\n\t\t\t\t\t\t\t\t\tcanSwitchNavigationMenu={\n\t\t\t\t\t\t\t\t\t\tcanSwitchNavigationMenu\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tnavigationMenus={ navigationMenus }\n\t\t\t\t\t\t\t\t\tsetSelectedMenu={ setSelectedMenu }\n\t\t\t\t\t\t\t\t\tonFinish={ onFinish }\n\t\t\t\t\t\t\t\t\tmenus={ menus }\n\t\t\t\t\t\t\t\t\tonCreateFromMenu={ onCreateFromMenu }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : undefined }\n\t\t\t\t\t\t\t{ hasPages ? (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\thasMenus || canSwitchNavigationMenu\n\t\t\t\t\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t\t\t\t\t: 'primary'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tsetIsNewMenuModalVisible( true );\n\t\t\t\t\t\t\t\t\t\tsetCreateEmpty( false );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Add all pages' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) : undefined }\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tsetIsNewMenuModalVisible( true );\n\t\t\t\t\t\t\t\t\tsetCreateEmpty( true );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Start empty' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</Placeholder>\n\t\t\t) }\n\t\t\t{ isNewMenuModalVisible && (\n\t\t\t\t<NavigationMenuNameModal\n\t\t\t\t\ttitle={ __( 'Create your new navigation menu' ) }\n\t\t\t\t\tonRequestClose={ () => {\n\t\t\t\t\t\tsetIsNewMenuModalVisible( false );\n\t\t\t\t\t} }\n\t\t\t\t\tonFinish={\n\t\t\t\t\t\tcreateEmpty ? onCreateEmptyMenu : onCreateAllPages\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}

package/build-module/navigation/{placeholder-preview.js → edit/placeholder/placeholder-preview.js}

@@ -1,13 +1,22 @@
 import { createElement } from "@wordpress/element";
 
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
+
 import { Icon, search } from '@wordpress/icons';
 
-const PlaceholderPreview = () => {
+const PlaceholderPreview = ({
+  isLoading
+}) => {
   return createElement("ul", {
-    className: "wp-block-navigation-placeholder__preview wp-block-navigation__container"
+    className: classnames('wp-block-navigation-placeholder__preview', 'wp-block-navigation__container', {
+      'is-loading': isLoading
+    })
   }, createElement("li", {
     className: "wp-block-navigation-item"
   }, "\u200B"), createElement("li", {

package/build-module/navigation/edit/placeholder/placeholder-preview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/placeholder/placeholder-preview.js"],"names":["classnames","Icon","search","PlaceholderPreview","isLoading"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,EAAeC,MAAf,QAA6B,kBAA7B;;AAEA,MAAMC,kBAAkB,GAAG,CAAE;AAAEC,EAAAA;AAAF,CAAF,KAAqB;AAC/C,SACC;AACC,IAAA,SAAS,EAAGJ,UAAU,CACrB,0CADqB,EAErB,gCAFqB,EAGrB;AAAE,oBAAcI;AAAhB,KAHqB;AADvB,KAOC;AAAI,IAAA,SAAS,EAAC;AAAd,cAPD,EAQC;AAAI,IAAA,SAAS,EAAC;AAAd,cARD,EASC;AAAI,IAAA,SAAS,EAAC;AAAd,cATD,EAUC;AAAI,IAAA,SAAS,EAAC;AAAd,KACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGF;AAAb,IADD,CAVD,CADD;AAgBA,CAjBD;;AAmBA,eAAeC,kBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, search } from '@wordpress/icons';\n\nconst PlaceholderPreview = ( { isLoading } ) => {\n\treturn (\n\t\t<ul\n\t\t\tclassName={ classnames(\n\t\t\t\t'wp-block-navigation-placeholder__preview',\n\t\t\t\t'wp-block-navigation__container',\n\t\t\t\t{ 'is-loading': isLoading }\n\t\t\t) }\n\t\t>\n\t\t\t<li className=\"wp-block-navigation-item\">&#8203;</li>\n\t\t\t<li className=\"wp-block-navigation-item\">&#8203;</li>\n\t\t\t<li className=\"wp-block-navigation-item\">&#8203;</li>\n\t\t\t<li className=\"wp-block-navigation-placeholder__preview-search-icon\">\n\t\t\t\t<Icon icon={ search } />\n\t\t\t</li>\n\t\t</ul>\n\t);\n};\n\nexport default PlaceholderPreview;\n"]}

package/build-module/navigation/edit/responsive-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/responsive-wrapper.js"],"names":["classnames","close","Icon","Button","SVG","Rect","__","ResponsiveWrapper","children","id","isOpen","isResponsive","onToggle","isHiddenByDefault","responsiveContainerClasses","openButtonClasses","modalId"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,KAAT,EAAgBC,IAAhB,QAA4B,kBAA5B;AACA,SAASC,MAAT,QAAuB,uBAAvB;AACA,SAASC,GAAT,EAAcC,IAAd,QAA0B,uBAA1B;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA,eAAe,SAASC,iBAAT,CAA4B;AAC1CC,EAAAA,QAD0C;AAE1CC,EAAAA,EAF0C;AAG1CC,EAAAA,MAH0C;AAI1CC,EAAAA,YAJ0C;AAK1CC,EAAAA,QAL0C;AAM1CC,EAAAA;AAN0C,CAA5B,EAOX;AACH,MAAK,CAAEF,YAAP,EAAsB;AACrB,WAAOH,QAAP;AACA;;AACD,QAAMM,0BAA0B,GAAGd,UAAU,CAC5C,2CAD4C,EAE5C;AACC,oBAAgBU,MADjB;AAEC,yBAAqBG;AAFtB,GAF4C,CAA7C;AAOA,QAAME,iBAAiB,GAAGf,UAAU,CACnC,gDADmC,EAEnC;AAAE,oBAAgBa;AAAlB,GAFmC,CAApC;AAKA,QAAMG,OAAO,GAAI,GAAGP,EAAI,QAAxB;AAEA,SACC,8BACG,CAAEC,MAAF,IACD,cAAC,MAAD;AACC,qBAAc,MADf;AAEC,qBAAgBA,MAFjB;AAGC,kBAAaJ,EAAE,CAAE,WAAF,CAHhB;AAIC,IAAA,SAAS,EAAGS,iBAJb;AAKC,IAAA,OAAO,EAAG,MAAMH,QAAQ,CAAE,IAAF;AALzB,KAOC,cAAC,GAAD;AACC,IAAA,KAAK,EAAC,4BADP;AAEC,IAAA,OAAO,EAAC,WAFT;AAGC,IAAA,KAAK,EAAC,IAHP;AAIC,IAAA,MAAM,EAAC,IAJR;AAKC,IAAA,IAAI,EAAC,KALN;AAMC,mBAAY,MANb;AAOC,IAAA,SAAS,EAAC;AAPX,KASC,cAAC,IAAD;AAAM,IAAA,CAAC,EAAC,GAAR;AAAY,IAAA,CAAC,EAAC,KAAd;AAAoB,IAAA,KAAK,EAAC,IAA1B;AAA+B,IAAA,MAAM,EAAC;AAAtC,IATD,EAUC,cAAC,IAAD;AAAM,IAAA,CAAC,EAAC,GAAR;AAAY,IAAA,CAAC,EAAC,IAAd;AAAmB,IAAA,KAAK,EAAC,IAAzB;AAA8B,IAAA,MAAM,EAAC;AAArC,IAVD,CAPD,CAFF,EAwBC;AACC,IAAA,SAAS,EAAGE,0BADb;AAEC,IAAA,EAAE,EAAGE,OAFN;AAGC,mBAAc,CAAEN;AAHjB,KAKC;AACC,IAAA,SAAS,EAAC,uCADX;AAEC,IAAA,QAAQ,EAAC;AAFV,KAIC;AACC,IAAA,SAAS,EAAC,wCADX;AAEC,IAAA,IAAI,EAAC,QAFN;AAGC,kBAAW,MAHZ;AAIC,uBAAmB,GAAGM,OAAS;AAJhC,KAMC,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,iDADX;AAEC,kBAAaV,EAAE,CAAE,YAAF,CAFhB;AAGC,IAAA,OAAO,EAAG,MAAMM,QAAQ,CAAE,KAAF;AAHzB,KAKC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGX;AAAb,IALD,CAND,EAaC;AACC,IAAA,SAAS,EAAC,mDADX;AAEC,IAAA,EAAE,EAAI,GAAGe,OAAS;AAFnB,KAIGR,QAJH,CAbD,CAJD,CALD,CAxBD,CADD;AA0DA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { close, Icon } from '@wordpress/icons';\nimport { Button } from '@wordpress/components';\nimport { SVG, Rect } from '@wordpress/primitives';\nimport { __ } from '@wordpress/i18n';\n\nexport default function ResponsiveWrapper( {\n\tchildren,\n\tid,\n\tisOpen,\n\tisResponsive,\n\tonToggle,\n\tisHiddenByDefault,\n} ) {\n\tif ( ! isResponsive ) {\n\t\treturn children;\n\t}\n\tconst responsiveContainerClasses = classnames(\n\t\t'wp-block-navigation__responsive-container',\n\t\t{\n\t\t\t'is-menu-open': isOpen,\n\t\t\t'hidden-by-default': isHiddenByDefault,\n\t\t}\n\t);\n\tconst openButtonClasses = classnames(\n\t\t'wp-block-navigation__responsive-container-open',\n\t\t{ 'always-shown': isHiddenByDefault }\n\t);\n\n\tconst modalId = `${ id }-modal`;\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isOpen && (\n\t\t\t\t<Button\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-label={ __( 'Open menu' ) }\n\t\t\t\t\tclassName={ openButtonClasses }\n\t\t\t\t\tonClick={ () => onToggle( true ) }\n\t\t\t\t>\n\t\t\t\t\t<SVG\n\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\trole=\"img\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tfocusable=\"false\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Rect x=\"4\" y=\"7.5\" width=\"16\" height=\"1.5\" />\n\t\t\t\t\t\t<Rect x=\"4\" y=\"15\" width=\"16\" height=\"1.5\" />\n\t\t\t\t\t</SVG>\n\t\t\t\t</Button>\n\t\t\t) }\n\n\t\t\t<div\n\t\t\t\tclassName={ responsiveContainerClasses }\n\t\t\t\tid={ modalId }\n\t\t\t\taria-hidden={ ! isOpen }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"wp-block-navigation__responsive-close\"\n\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"wp-block-navigation__responsive-dialog\"\n\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\taria-labelledby={ `${ modalId }-title` }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"wp-block-navigation__responsive-container-close\"\n\t\t\t\t\t\t\taria-label={ __( 'Close menu' ) }\n\t\t\t\t\t\t\tonClick={ () => onToggle( false ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon icon={ close } />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"wp-block-navigation__responsive-container-content\"\n\t\t\t\t\t\t\tid={ `${ modalId }-content` }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}

package/build-module/navigation/edit/unsaved-inner-blocks.js

@@ -0,0 +1,136 @@
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+/**
+ * WordPress dependencies
+ */
+
+import { useInnerBlocksProps } from '@wordpress/block-editor';
+import { serialize } from '@wordpress/blocks';
+import { Disabled, Spinner } from '@wordpress/components';
+import { store as coreStore } from '@wordpress/core-data';
+import { useDispatch, useSelect } from '@wordpress/data';
+import { useCallback, useContext, useEffect, useRef } from '@wordpress/element';
+import { __, sprintf } from '@wordpress/i18n';
+/**
+ * Internal dependencies
+ */
+
+import useNavigationMenu from '../use-navigation-menu';
+import useTemplatePartAreaLabel from '../use-template-part-area-label';
+
+const NOOP = () => {};
+
+const EMPTY_OBJECT = {};
+const DRAFT_MENU_PARAMS = ['postType', 'wp_navigation', {
+  status: 'draft',
+  per_page: -1
+}];
+export default function UnsavedInnerBlocks({
+  blockProps,
+  blocks,
+  clientId,
+  hasSavedUnsavedInnerBlocks,
+  onSave,
+  hasSelection
+}) {
+  // The block will be disabled in a block preview, use this as a way of
+  // avoiding the side-effects of this component for block previews.
+  const isDisabled = useContext(Disabled.Context);
+  const savingLock = useRef(false);
+  const innerBlocksProps = useInnerBlocksProps(blockProps, {
+    renderAppender: hasSelection ? undefined : false,
+    // Make the inner blocks 'controlled'. This allows the block to always
+    // work with controlled inner blocks, smoothing out the switch to using
+    // an entity.
+    value: blocks,
+    onChange: NOOP,
+    onInput: NOOP
+  });
+  const {
+    saveEntityRecord
+  } = useDispatch(coreStore);
+  const {
+    isSaving,
+    draftNavigationMenus,
+    hasResolvedDraftNavigationMenus
+  } = useSelect(select => {
+    if (isDisabled) {
+      return EMPTY_OBJECT;
+    }
+
+    const {
+      getEntityRecords,
+      hasFinishedResolution,
+      isSavingEntityRecord
+    } = select(coreStore);
+    return {
+      isSaving: isSavingEntityRecord('postType', 'wp_navigation'),
+      draftNavigationMenus: getEntityRecords(...DRAFT_MENU_PARAMS),
+      hasResolvedDraftNavigationMenus: hasFinishedResolution('getEntityRecords', DRAFT_MENU_PARAMS)
+    };
+  }, [isDisabled]);
+  const {
+    hasResolvedNavigationMenus,
+    navigationMenus
+  } = useNavigationMenu();
+  const createNavigationMenu = useCallback(async title => {
+    const record = {
+      title,
+      content: serialize(blocks),
+      status: 'draft'
+    };
+    const navigationMenu = await saveEntityRecord('postType', 'wp_navigation', record);
+    return navigationMenu;
+  }, [blocks, serialize, saveEntityRecord]); // Because we can't conditionally call hooks, pass an undefined client id
+  // arg to bypass the expensive `useTemplateArea` code. The hook will return
+  // early.
+
+  const area = useTemplatePartAreaLabel(isDisabled ? undefined : clientId); // Automatically save the uncontrolled blocks.
+
+  useEffect(async () => {
+    // The block will be disabled when used in a BlockPreview.
+    // In this case avoid automatic creation of a wp_navigation post.
+    // Otherwise the user will be spammed with lots of menus!
+    //
+    // Also ensure other navigation menus have loaded so an
+    // accurate name can be created.
+    //
+    // Don't try saving when another save is already
+    // in progress.
+    //
+    // And finally only create the menu when the block is selected,
+    // which is an indication they want to start editing.
+    if (isDisabled || hasSavedUnsavedInnerBlocks || isSaving || savingLock.current || !hasResolvedDraftNavigationMenus || !hasResolvedNavigationMenus || !hasSelection) {
+      return;
+    }
+
+    savingLock.current = true;
+    const title = area ? sprintf( // translators: %s: the name of a menu (e.g. Header navigation).
+    __('%s navigation'), area) : // translators: 'navigation' as in website navigation.
+    __('Navigation'); // Determine how many menus start with the automatic title.
+
+    const matchingMenuTitleCount = [...draftNavigationMenus, ...navigationMenus].reduce((count, menu) => {
+      var _menu$title, _menu$title$raw;
+
+      return menu !== null && menu !== void 0 && (_menu$title = menu.title) !== null && _menu$title !== void 0 && (_menu$title$raw = _menu$title.raw) !== null && _menu$title$raw !== void 0 && _menu$title$raw.startsWith(title) ? count + 1 : count;
+    }, 0); // Append a number to the end of the title if a menu with
+    // the same name exists.
+
+    const titleWithCount = matchingMenuTitleCount > 0 ? `${title} ${matchingMenuTitleCount + 1}` : title;
+    const menu = await createNavigationMenu(titleWithCount);
+    onSave(menu);
+    savingLock.current = false;
+  }, [isDisabled, isSaving, hasResolvedDraftNavigationMenus, hasResolvedNavigationMenus, draftNavigationMenus, navigationMenus, hasSelection, createNavigationMenu, area]);
+  return createElement(Fragment, null, createElement("nav", blockProps, createElement("div", {
+    className: "wp-block-navigation__unsaved-changes"
+  }, createElement(Disabled, {
+    className: classnames('wp-block-navigation__unsaved-changes-overlay', {
+      'is-saving': hasSelection
+    })
+  }, createElement("div", innerBlocksProps)), hasSelection && createElement(Spinner, null))));
+}
+//# sourceMappingURL=unsaved-inner-blocks.js.map

package/build-module/navigation/edit/unsaved-inner-blocks.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/unsaved-inner-blocks.js"],"names":["classnames","useInnerBlocksProps","serialize","Disabled","Spinner","store","coreStore","useDispatch","useSelect","useCallback","useContext","useEffect","useRef","__","sprintf","useNavigationMenu","useTemplatePartAreaLabel","NOOP","EMPTY_OBJECT","DRAFT_MENU_PARAMS","status","per_page","UnsavedInnerBlocks","blockProps","blocks","clientId","hasSavedUnsavedInnerBlocks","onSave","hasSelection","isDisabled","Context","savingLock","innerBlocksProps","renderAppender","undefined","value","onChange","onInput","saveEntityRecord","isSaving","draftNavigationMenus","hasResolvedDraftNavigationMenus","select","getEntityRecords","hasFinishedResolution","isSavingEntityRecord","hasResolvedNavigationMenus","navigationMenus","createNavigationMenu","title","record","content","navigationMenu","area","current","matchingMenuTitleCount","reduce","count","menu","raw","startsWith","titleWithCount"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useInnerBlocksProps } from '@wordpress/block-editor';\nimport { serialize } from '@wordpress/blocks';\nimport { Disabled, Spinner } from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useCallback, useContext, useEffect, useRef } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport useNavigationMenu from '../use-navigation-menu';\nimport useTemplatePartAreaLabel from '../use-template-part-area-label';\n\nconst NOOP = () => {};\nconst EMPTY_OBJECT = {};\nconst DRAFT_MENU_PARAMS = [\n\t'postType',\n\t'wp_navigation',\n\t{ status: 'draft', per_page: -1 },\n];\n\nexport default function UnsavedInnerBlocks( {\n\tblockProps,\n\tblocks,\n\tclientId,\n\thasSavedUnsavedInnerBlocks,\n\tonSave,\n\thasSelection,\n} ) {\n\t// The block will be disabled in a block preview, use this as a way of\n\t// avoiding the side-effects of this component for block previews.\n\tconst isDisabled = useContext( Disabled.Context );\n\tconst savingLock = useRef( false );\n\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\trenderAppender: hasSelection ? undefined : false,\n\n\t\t// Make the inner blocks 'controlled'. This allows the block to always\n\t\t// work with controlled inner blocks, smoothing out the switch to using\n\t\t// an entity.\n\t\tvalue: blocks,\n\t\tonChange: NOOP,\n\t\tonInput: NOOP,\n\t} );\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\n\tconst {\n\t\tisSaving,\n\t\tdraftNavigationMenus,\n\t\thasResolvedDraftNavigationMenus,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tif ( isDisabled ) {\n\t\t\t\treturn EMPTY_OBJECT;\n\t\t\t}\n\n\t\t\tconst {\n\t\t\t\tgetEntityRecords,\n\t\t\t\thasFinishedResolution,\n\t\t\t\tisSavingEntityRecord,\n\t\t\t} = select( coreStore );\n\n\t\t\treturn {\n\t\t\t\tisSaving: isSavingEntityRecord( 'postType', 'wp_navigation' ),\n\t\t\t\tdraftNavigationMenus: getEntityRecords( ...DRAFT_MENU_PARAMS ),\n\t\t\t\thasResolvedDraftNavigationMenus: hasFinishedResolution(\n\t\t\t\t\t'getEntityRecords',\n\t\t\t\t\tDRAFT_MENU_PARAMS\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ isDisabled ]\n\t);\n\n\tconst { hasResolvedNavigationMenus, navigationMenus } = useNavigationMenu();\n\n\tconst createNavigationMenu = useCallback(\n\t\tasync ( title ) => {\n\t\t\tconst record = {\n\t\t\t\ttitle,\n\t\t\t\tcontent: serialize( blocks ),\n\t\t\t\tstatus: 'draft',\n\t\t\t};\n\n\t\t\tconst navigationMenu = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_navigation',\n\t\t\t\trecord\n\t\t\t);\n\n\t\t\treturn navigationMenu;\n\t\t},\n\t\t[ blocks, serialize, saveEntityRecord ]\n\t);\n\n\t// Because we can't conditionally call hooks, pass an undefined client id\n\t// arg to bypass the expensive `useTemplateArea` code. The hook will return\n\t// early.\n\tconst area = useTemplatePartAreaLabel( isDisabled ? undefined : clientId );\n\n\t// Automatically save the uncontrolled blocks.\n\tuseEffect( async () => {\n\t\t// The block will be disabled when used in a BlockPreview.\n\t\t// In this case avoid automatic creation of a wp_navigation post.\n\t\t// Otherwise the user will be spammed with lots of menus!\n\t\t//\n\t\t// Also ensure other navigation menus have loaded so an\n\t\t// accurate name can be created.\n\t\t//\n\t\t// Don't try saving when another save is already\n\t\t// in progress.\n\t\t//\n\t\t// And finally only create the menu when the block is selected,\n\t\t// which is an indication they want to start editing.\n\t\tif (\n\t\t\tisDisabled ||\n\t\t\thasSavedUnsavedInnerBlocks ||\n\t\t\tisSaving ||\n\t\t\tsavingLock.current ||\n\t\t\t! hasResolvedDraftNavigationMenus ||\n\t\t\t! hasResolvedNavigationMenus ||\n\t\t\t! hasSelection\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tsavingLock.current = true;\n\t\tconst title = area\n\t\t\t? sprintf(\n\t\t\t\t\t// translators: %s: the name of a menu (e.g. Header navigation).\n\t\t\t\t\t__( '%s navigation' ),\n\t\t\t\t\tarea\n\t\t\t  )\n\t\t\t: // translators: 'navigation' as in website navigation.\n\t\t\t  __( 'Navigation' );\n\n\t\t// Determine how many menus start with the automatic title.\n\t\tconst matchingMenuTitleCount = [\n\t\t\t...draftNavigationMenus,\n\t\t\t...navigationMenus,\n\t\t].reduce(\n\t\t\t( count, menu ) =>\n\t\t\t\tmenu?.title?.raw?.startsWith( title ) ? count + 1 : count,\n\t\t\t0\n\t\t);\n\n\t\t// Append a number to the end of the title if a menu with\n\t\t// the same name exists.\n\t\tconst titleWithCount =\n\t\t\tmatchingMenuTitleCount > 0\n\t\t\t\t? `${ title } ${ matchingMenuTitleCount + 1 }`\n\t\t\t\t: title;\n\n\t\tconst menu = await createNavigationMenu( titleWithCount );\n\t\tonSave( menu );\n\t\tsavingLock.current = false;\n\t}, [\n\t\tisDisabled,\n\t\tisSaving,\n\t\thasResolvedDraftNavigationMenus,\n\t\thasResolvedNavigationMenus,\n\t\tdraftNavigationMenus,\n\t\tnavigationMenus,\n\t\thasSelection,\n\t\tcreateNavigationMenu,\n\t\tarea,\n\t] );\n\n\treturn (\n\t\t<>\n\t\t\t<nav { ...blockProps }>\n\t\t\t\t<div className=\"wp-block-navigation__unsaved-changes\">\n\t\t\t\t\t<Disabled\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'wp-block-navigation__unsaved-changes-overlay',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-saving': hasSelection,\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\t\t<div { ...innerBlocksProps } />\n\t\t\t\t\t</Disabled>\n\t\t\t\t\t{ hasSelection && <Spinner /> }\n\t\t\t\t</div>\n\t\t\t</nav>\n\t\t</>\n\t);\n}\n"]}

package/build-module/navigation/{block-navigation-list.js → edit/use-list-view-modal.js}

@@ -4,9 +4,13 @@ import { createElement } from "@wordpress/element";
  * WordPress dependencies
  */
 import { __experimentalListView as ListView, store as blockEditorStore } from '@wordpress/block-editor';
+import { ToolbarButton, Modal } from '@wordpress/components';
 import { useSelect } from '@wordpress/data';
 import { useRef, useEffect, useState } from '@wordpress/element';
-export default function BlockNavigationList({
+import { __ } from '@wordpress/i18n';
+import { listView } from '@wordpress/icons';
+
+function NavigationBlockListView({
   clientId,
   __experimentalFeatures
 }) {
@@ -30,4 +34,29 @@ export default function BlockNavigationList({
     __experimentalFeatures: __experimentalFeatures
   }));
 }
-//# sourceMappingURL=block-navigation-list.js.map
+
+export default function useListViewModal(clientId, __experimentalFeatures) {
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const listViewToolbarButton = createElement(ToolbarButton, {
+    className: "components-toolbar__control",
+    label: __('Open list view'),
+    onClick: () => setIsModalOpen(true),
+    icon: listView
+  });
+  const listViewModal = isModalOpen && createElement(Modal, {
+    title: __('List View'),
+    closeLabel: __('Close'),
+    onRequestClose: () => {
+      setIsModalOpen(false);
+    },
+    shouldCloseOnClickOutside: false
+  }, createElement(NavigationBlockListView, {
+    clientId: clientId,
+    __experimentalFeatures: __experimentalFeatures
+  }));
+  return {
+    listViewToolbarButton,
+    listViewModal
+  };
+}
+//# sourceMappingURL=use-list-view-modal.js.map

package/build-module/navigation/edit/use-list-view-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/navigation/edit/use-list-view-modal.js"],"names":["__experimentalListView","ListView","store","blockEditorStore","ToolbarButton","Modal","useSelect","useRef","useEffect","useState","__","listView","NavigationBlockListView","clientId","__experimentalFeatures","blocks","select","__unstableGetClientIdsTree","listViewRef","minHeight","setMinHeight","current","clientHeight","useListViewModal","isModalOpen","setIsModalOpen","listViewToolbarButton","listViewModal"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,sBAAsB,IAAIC,QAD3B,EAECC,KAAK,IAAIC,gBAFV,QAGO,yBAHP;AAIA,SAASC,aAAT,EAAwBC,KAAxB,QAAqC,uBAArC;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,MAAT,EAAiBC,SAAjB,EAA4BC,QAA5B,QAA4C,oBAA5C;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,QAAT,QAAyB,kBAAzB;;AAEA,SAASC,uBAAT,CAAkC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,CAAlC,EAAyE;AACxE,QAAMC,MAAM,GAAGT,SAAS,CACrBU,MAAF,IACCA,MAAM,CAAEb,gBAAF,CAAN,CAA2Bc,0BAA3B,CAAuDJ,QAAvD,CAFsB,EAGvB,CAAEA,QAAF,CAHuB,CAAxB;AAMA,QAAMK,WAAW,GAAGX,MAAM,EAA1B;AACA,QAAM,CAAEY,SAAF,EAAaC,YAAb,IAA8BX,QAAQ,CAAE,GAAF,CAA5C;AACAD,EAAAA,SAAS,CAAE,MAAM;AAAA;;AAChBY,IAAAA,YAAY,0BAAEF,WAAF,aAAEA,WAAF,+CAAEA,WAAW,CAAEG,OAAf,yDAAE,qBAAsBC,YAAxB,yEAAwC,GAAxC,CAAZ;AACA,GAFQ,EAEN,EAFM,CAAT;AAIA,SACC;AAAK,IAAA,KAAK,EAAG;AAAEH,MAAAA;AAAF;AAAb,KACC,cAAC,QAAD;AACC,IAAA,GAAG,EAAGD,WADP;AAEC,IAAA,MAAM,EAAGH,MAFV;AAGC,IAAA,eAAe,MAHhB;AAIC,IAAA,gBAAgB,MAJjB;AAKC,IAAA,sBAAsB,EAAGD;AAL1B,IADD,CADD;AAWA;;AAED,eAAe,SAASS,gBAAT,CAA2BV,QAA3B,EAAqCC,sBAArC,EAA8D;AAC5E,QAAM,CAAEU,WAAF,EAAeC,cAAf,IAAkChB,QAAQ,CAAE,KAAF,CAAhD;AAEA,QAAMiB,qBAAqB,GAC1B,cAAC,aAAD;AACC,IAAA,SAAS,EAAC,6BADX;AAEC,IAAA,KAAK,EAAGhB,EAAE,CAAE,gBAAF,CAFX;AAGC,IAAA,OAAO,EAAG,MAAMe,cAAc,CAAE,IAAF,CAH/B;AAIC,IAAA,IAAI,EAAGd;AAJR,IADD;AASA,QAAMgB,aAAa,GAAGH,WAAW,IAChC,cAAC,KAAD;AACC,IAAA,KAAK,EAAGd,EAAE,CAAE,WAAF,CADX;AAEC,IAAA,UAAU,EAAGA,EAAE,CAAE,OAAF,CAFhB;AAGC,IAAA,cAAc,EAAG,MAAM;AACtBe,MAAAA,cAAc,CAAE,KAAF,CAAd;AACA,KALF;AAMC,IAAA,yBAAyB,EAAG;AAN7B,KAQC,cAAC,uBAAD;AACC,IAAA,QAAQ,EAAGZ,QADZ;AAEC,IAAA,sBAAsB,EAAGC;AAF1B,IARD,CADD;AAgBA,SAAO;AACNY,IAAAA,qBADM;AAENC,IAAAA;AAFM,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalListView as ListView,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { ToolbarButton, Modal } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useRef, useEffect, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { listView } from '@wordpress/icons';\n\nfunction NavigationBlockListView( { clientId, __experimentalFeatures } ) {\n\tconst blocks = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).__unstableGetClientIdsTree( clientId ),\n\t\t[ clientId ]\n\t);\n\n\tconst listViewRef = useRef();\n\tconst [ minHeight, setMinHeight ] = useState( 300 );\n\tuseEffect( () => {\n\t\tsetMinHeight( listViewRef?.current?.clientHeight ?? 300 );\n\t}, [] );\n\n\treturn (\n\t\t<div style={ { minHeight } }>\n\t\t\t<ListView\n\t\t\t\tref={ listViewRef }\n\t\t\t\tblocks={ blocks }\n\t\t\t\tshowBlockMovers\n\t\t\t\tshowNestedBlocks\n\t\t\t\t__experimentalFeatures={ __experimentalFeatures }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default function useListViewModal( clientId, __experimentalFeatures ) {\n\tconst [ isModalOpen, setIsModalOpen ] = useState( false );\n\n\tconst listViewToolbarButton = (\n\t\t<ToolbarButton\n\t\t\tclassName=\"components-toolbar__control\"\n\t\t\tlabel={ __( 'Open list view' ) }\n\t\t\tonClick={ () => setIsModalOpen( true ) }\n\t\t\ticon={ listView }\n\t\t/>\n\t);\n\n\tconst listViewModal = isModalOpen && (\n\t\t<Modal\n\t\t\ttitle={ __( 'List View' ) }\n\t\t\tcloseLabel={ __( 'Close' ) }\n\t\t\tonRequestClose={ () => {\n\t\t\t\tsetIsModalOpen( false );\n\t\t\t} }\n\t\t\tshouldCloseOnClickOutside={ false }\n\t\t>\n\t\t\t<NavigationBlockListView\n\t\t\t\tclientId={ clientId }\n\t\t\t\t__experimentalFeatures={ __experimentalFeatures }\n\t\t\t/>\n\t\t</Modal>\n\t);\n\n\treturn {\n\t\tlistViewToolbarButton,\n\t\tlistViewModal,\n\t};\n}\n"]}