@wordpress/block-library 7.3.10 → 7.6.0

package/build-module/table-of-contents/edit.js

@@ -11,23 +11,28 @@ import { isEqual } from 'lodash';
 import { BlockControls, BlockIcon, InspectorControls, store as blockEditorStore, useBlockProps } from '@wordpress/block-editor';
 import { createBlock, store as blocksStore } from '@wordpress/blocks';
 import { PanelBody, Placeholder, ToggleControl, ToolbarButton, ToolbarGroup } from '@wordpress/components';
+import { useDisabled } from '@wordpress/compose';
 import { useDispatch, useSelect } from '@wordpress/data';
-import { renderToString, useEffect, useState } from '@wordpress/element';
+import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
+import { renderToString, useEffect } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
+import { addQueryArgs, removeQueryArgs } from '@wordpress/url';
 /**
  * Internal dependencies
  */
 
+import icon from './icon';
 import TableOfContentsList from './list';
-import { getHeadingsFromContent, linearToNestedHeadingList } from './utils';
+import { linearToNestedHeadingList } from './utils';
+/** @typedef {import('./utils').HeadingData} HeadingData */
+
 /**
  * Table of Contents block edit component.
  *
  * @param {Object}                       props                                   The props.
  * @param {Object}                       props.attributes                        The block attributes.
- * @param {boolean}                      props.attributes.onlyIncludeCurrentPage
- *                                                                               Whether to only include headings from the current page (if the post is
- *                                                                               paginated).
+ * @param {HeadingData[]}                props.attributes.headings               A list of data for each heading in the post.
+ * @param {boolean}                      props.attributes.onlyIncludeCurrentPage Whether to only include headings from the current page (if the post is paginated).
  * @param {string}                       props.clientId
  * @param {(attributes: Object) => void} props.setAttributes
  *
@@ -37,96 +42,157 @@ import { getHeadingsFromContent, linearToNestedHeadingList } from './utils';
 export default function TableOfContentsEdit(_ref) {
   let {
     attributes: {
+      headings = [],
       onlyIncludeCurrentPage
     },
     clientId,
     setAttributes
   } = _ref;
-  const blockProps = useBlockProps(); // Local state; not saved to block attributes. The saved block is dynamic and uses PHP to generate its content.
-
-  const [headings, setHeadings] = useState([]);
-  const [headingTree, setHeadingTree] = useState([]);
+  const blockProps = useBlockProps();
+  const disabledRef = useDisabled();
+  const listBlockExists = useSelect(select => !!select(blocksStore).getBlockType('core/list'), []);
   const {
-    listBlockExists,
-    postContent
-  } = useSelect(select => ({
-    listBlockExists: !!select(blocksStore).getBlockType('core/list'),
-    // 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
-    postContent: select('core/editor').getEditedPostContent()
-  }), []); // The page this block would be part of on the front-end. For performance
-  // reasons, this is only calculated when onlyIncludeCurrentPage is true.
-
-  const pageIndex = useSelect(select => {
-    if (!onlyIncludeCurrentPage) {
-      return null;
-    }
+    __unstableMarkNextChangeAsNotPersistent,
+    replaceBlocks
+  } = useDispatch(blockEditorStore);
+  /**
+   * The latest heading data, or null if the new data deeply equals the saved
+   * headings attribute.
+   *
+   * Since useSelect forces a re-render when its return value is shallowly
+   * inequal to its prior call, we would be re-rendering this block every time
+   * the stores change, even if the latest headings were deeply equal to the
+   * ones saved in the block attributes.
+   *
+   * By returning null when they're equal, we reduce that to 2 renders: one
+   * when there are new latest headings (and so it returns them), and one when
+   * they haven't changed (so it returns null). As long as the latest heading
+   * data remains the same, further calls of the useSelect callback will
+   * continue to return null, thus preventing any forced re-renders.
+   */
+
+  const latestHeadings = useSelect(select => {
+    var _editorSelectors$getP;
 
     const {
       getBlockAttributes,
-      getBlockIndex,
       getBlockName,
-      getBlockOrder
-    } = select(blockEditorStore);
-    const blockIndex = getBlockIndex(clientId);
-    const blockOrder = getBlockOrder(); // Calculate which page the block will appear in on the front-end by
-    // counting how many <!--nextpage--> tags precede it.
-    // Unfortunately, this implementation only accounts for Page Break and
-    // Classic blocks, so if there are any <!--nextpage--> tags in any
-    // other block, they won't be counted. This will result in the table
-    // of contents showing headings from the wrong page if
-    // onlyIncludeCurrentPage === true. Thankfully, this issue only
-    // affects the editor implementation.
-
-    let page = 1;
-
-    for (let i = 0; i < blockIndex; i++) {
-      const blockName = getBlockName(blockOrder[i]);
+      getClientIdsWithDescendants,
+      __experimentalGetGlobalBlocksByName: getGlobalBlocksByName
+    } = select(blockEditorStore); // FIXME: @wordpress/block-library should not depend on @wordpress/editor.
+    // Blocks can be loaded into a *non-post* block editor, so to avoid
+    // declaring @wordpress/editor as a dependency, we must access its
+    // store by string. When the store is not available, editorSelectors
+    // will be null, and the block's saved markup will lack permalinks.
+    // eslint-disable-next-line @wordpress/data-no-store-string-literals
 
-      if (blockName === 'core/nextpage') {
-        page++;
-      } else if (blockName === 'core/freeform') {
-        var _getBlockAttributes$c;
+    const editorSelectors = select('core/editor');
+    const pageBreakClientIds = getGlobalBlocksByName('core/nextpage');
+    const isPaginated = pageBreakClientIds.length !== 0; // Get the client ids of all blocks in the editor.
+
+    const allBlockClientIds = getClientIdsWithDescendants(); // If onlyIncludeCurrentPage is true, calculate the page (of a paginated post) this block is part of, so we know which headings to include; otherwise, skip the calculation.
+
+    let tocPage = 1;
+
+    if (isPaginated && onlyIncludeCurrentPage) {
+      // We can't use getBlockIndex because it only returns the index
+      // relative to sibling blocks.
+      const tocIndex = allBlockClientIds.indexOf(clientId);
 
-        // Count the page breaks inside the Classic block.
-        const pageBreaks = (_getBlockAttributes$c = getBlockAttributes(blockOrder[i]).content) === null || _getBlockAttributes$c === void 0 ? void 0 : _getBlockAttributes$c.match(/<!--nextpage-->/g);
+      for (const [blockIndex, blockClientId] of allBlockClientIds.entries()) {
+        // If we've reached blocks after the Table of Contents, we've
+        // finished calculating which page the block is on.
+        if (blockIndex >= tocIndex) {
+          break;
+        }
 
-        if (pageBreaks !== null && pageBreaks !== undefined) {
-          page += pageBreaks.length;
+        if (getBlockName(blockClientId) === 'core/nextpage') {
+          tocPage++;
         }
       }
     }
 
-    return page;
-  }, [clientId, onlyIncludeCurrentPage]);
-  useEffect(() => {
-    let latestHeadings;
+    const _latestHeadings = [];
+    /** The page (of a paginated post) a heading will be part of. */
+
+    let headingPage = 1;
+    /**
+     * A permalink to the current post. If the core/editor store is
+     * unavailable, this variable will be null.
+     */
+
+    const permalink = (_editorSelectors$getP = editorSelectors === null || editorSelectors === void 0 ? void 0 : editorSelectors.getPermalink()) !== null && _editorSelectors$getP !== void 0 ? _editorSelectors$getP : null;
+    let headingPageLink = null; // If the core/editor store is available, we can add permalinks to the
+    // generated table of contents.
 
-    if (onlyIncludeCurrentPage) {
-      const pagesOfContent = postContent.split('<!--nextpage-->');
-      latestHeadings = getHeadingsFromContent(pagesOfContent[pageIndex - 1]);
-    } else {
-      latestHeadings = getHeadingsFromContent(postContent);
+    if (typeof permalink === 'string') {
+      headingPageLink = isPaginated ? addQueryArgs(permalink, {
+        page: headingPage
+      }) : permalink;
     }
 
-    if (!isEqual(headings, latestHeadings)) {
-      setHeadings(latestHeadings);
-      setHeadingTree(linearToNestedHeadingList(latestHeadings));
+    for (const blockClientId of allBlockClientIds) {
+      const blockName = getBlockName(blockClientId);
+
+      if (blockName === 'core/nextpage') {
+        headingPage++; // If we're only including headings from the current page (of
+        // a paginated post), then exit the loop if we've reached the
+        // pages after the one with the Table of Contents block.
+
+        if (onlyIncludeCurrentPage && headingPage > tocPage) {
+          break;
+        }
+
+        if (typeof permalink === 'string') {
+          headingPageLink = addQueryArgs(removeQueryArgs(permalink, ['page']), {
+            page: headingPage
+          });
+        }
+      } // If we're including all headings or we've reached headings on
+      // the same page as the Table of Contents block, add them to the
+      // list.
+      else if (!onlyIncludeCurrentPage || headingPage === tocPage) {
+        if (blockName === 'core/heading') {
+          const headingAttributes = getBlockAttributes(blockClientId);
+          const canBeLinked = typeof headingPageLink === 'string' && typeof headingAttributes.anchor === 'string' && headingAttributes.anchor !== '';
+
+          _latestHeadings.push({
+            content: stripHTML(headingAttributes.content),
+            level: headingAttributes.level,
+            link: canBeLinked ? `${headingPageLink}#${headingAttributes.anchor}` : null
+          });
+        }
+      }
     }
-  }, [pageIndex, postContent, onlyIncludeCurrentPage]);
-  const {
-    replaceBlocks
-  } = useDispatch(blockEditorStore);
+
+    if (isEqual(headings, _latestHeadings)) {
+      return null;
+    }
+
+    return _latestHeadings;
+  }, [clientId, onlyIncludeCurrentPage, headings]);
+  useEffect(() => {
+    if (latestHeadings !== null) {
+      // This is required to keep undo working and not create 2 undo steps
+      // for each heading change.
+      __unstableMarkNextChangeAsNotPersistent();
+
+      setAttributes({
+        headings: latestHeadings
+      });
+    }
+  }, [latestHeadings]);
+  const headingTree = linearToNestedHeadingList(headings);
   const toolbarControls = listBlockExists && createElement(BlockControls, null, createElement(ToolbarGroup, null, createElement(ToolbarButton, {
     onClick: () => replaceBlocks(clientId, createBlock('core/list', {
+      ordered: true,
       values: renderToString(createElement(TableOfContentsList, {
         nestedHeadingList: headingTree
       }))
     }))
   }, __('Convert to static list'))));
   const inspectorControls = createElement(InspectorControls, null, createElement(PanelBody, {
-    title: __('Table of Contents settings')
+    title: __('Settings')
   }, createElement(ToggleControl, {
     label: __('Only include current page'),
     checked: onlyIncludeCurrentPage,
@@ -141,14 +207,16 @@ export default function TableOfContentsEdit(_ref) {
   if (headings.length === 0) {
     return createElement(Fragment, null, createElement("div", blockProps, createElement(Placeholder, {
       icon: createElement(BlockIcon, {
-        icon: "list-view"
+        icon: icon
       }),
       label: "Table of Contents",
       instructions: __('Start adding Heading blocks to create a table of contents. Headings with HTML anchors will be linked here.')
     })), inspectorControls);
   }
 
-  return createElement(Fragment, null, createElement("nav", blockProps, createElement("ul", null, createElement(TableOfContentsList, {
+  return createElement(Fragment, null, createElement("nav", blockProps, createElement("ol", {
+    ref: disabledRef
+  }, createElement(TableOfContentsList, {
     nestedHeadingList: headingTree
   }))), toolbarControls, inspectorControls);
 }

package/build-module/table-of-contents/edit.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/edit.js"],"names":["isEqual","BlockControls","BlockIcon","InspectorControls","store","blockEditorStore","useBlockProps","createBlock","blocksStore","PanelBody","Placeholder","ToggleControl","ToolbarButton","ToolbarGroup","useDispatch","useSelect","renderToString","useEffect","useState","__","TableOfContentsList","getHeadingsFromContent","linearToNestedHeadingList","TableOfContentsEdit","attributes","onlyIncludeCurrentPage","clientId","setAttributes","blockProps","headings","setHeadings","headingTree","setHeadingTree","listBlockExists","postContent","select","getBlockType","getEditedPostContent","pageIndex","getBlockAttributes","getBlockIndex","getBlockName","getBlockOrder","blockIndex","blockOrder","page","i","blockName","pageBreaks","content","match","undefined","length","latestHeadings","pagesOfContent","split","replaceBlocks","toolbarControls","values","inspectorControls","value"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEqual } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInspectorControls,\n\tstore as blockEditorStore,\n\tuseBlockProps,\n} from '@wordpress/block-editor';\nimport { createBlock, store as blocksStore } from '@wordpress/blocks';\nimport {\n\tPanelBody,\n\tPlaceholder,\n\tToggleControl,\n\tToolbarButton,\n\tToolbarGroup,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { renderToString, useEffect, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport TableOfContentsList from './list';\nimport { getHeadingsFromContent, linearToNestedHeadingList } from './utils';\n\n/**\n * Table of Contents block edit component.\n *\n * @param {Object}                       props                                   The props.\n * @param {Object}                       props.attributes                        The block attributes.\n * @param {boolean}                      props.attributes.onlyIncludeCurrentPage\n *                                                                               Whether to only include headings from the current page (if the post is\n *                                                                               paginated).\n * @param {string}                       props.clientId\n * @param {(attributes: Object) => void} props.setAttributes\n *\n * @return {WPComponent} The component.\n */\nexport default function TableOfContentsEdit( {\n\tattributes: { onlyIncludeCurrentPage },\n\tclientId,\n\tsetAttributes,\n} ) {\n\tconst blockProps = useBlockProps();\n\n\t// Local state; not saved to block attributes. The saved block is dynamic and uses PHP to generate its content.\n\tconst [ headings, setHeadings ] = useState( [] );\n\tconst [ headingTree, setHeadingTree ] = useState( [] );\n\n\tconst { listBlockExists, postContent } = useSelect(\n\t\t( select ) => ( {\n\t\t\tlistBlockExists: !! select( blocksStore ).getBlockType(\n\t\t\t\t'core/list'\n\t\t\t),\n\t\t\t// FIXME: @wordpress/block-library should not depend on @wordpress/editor.\n\t\t\t// Blocks can be loaded into a *non-post* block editor.\n\t\t\t// eslint-disable-next-line @wordpress/data-no-store-string-literals\n\t\t\tpostContent: select( 'core/editor' ).getEditedPostContent(),\n\t\t} ),\n\t\t[]\n\t);\n\n\t// The page this block would be part of on the front-end. For performance\n\t// reasons, this is only calculated when onlyIncludeCurrentPage is true.\n\tconst pageIndex = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! onlyIncludeCurrentPage ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetBlockIndex,\n\t\t\t\tgetBlockName,\n\t\t\t\tgetBlockOrder,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\tconst blockIndex = getBlockIndex( clientId );\n\t\t\tconst blockOrder = getBlockOrder();\n\n\t\t\t// Calculate which page the block will appear in on the front-end by\n\t\t\t// counting how many <!--nextpage--> tags precede it.\n\t\t\t// Unfortunately, this implementation only accounts for Page Break and\n\t\t\t// Classic blocks, so if there are any <!--nextpage--> tags in any\n\t\t\t// other block, they won't be counted. This will result in the table\n\t\t\t// of contents showing headings from the wrong page if\n\t\t\t// onlyIncludeCurrentPage === true. Thankfully, this issue only\n\t\t\t// affects the editor implementation.\n\t\t\tlet page = 1;\n\t\t\tfor ( let i = 0; i < blockIndex; i++ ) {\n\t\t\t\tconst blockName = getBlockName( blockOrder[ i ] );\n\t\t\t\tif ( blockName === 'core/nextpage' ) {\n\t\t\t\t\tpage++;\n\t\t\t\t} else if ( blockName === 'core/freeform' ) {\n\t\t\t\t\t// Count the page breaks inside the Classic block.\n\t\t\t\t\tconst pageBreaks = getBlockAttributes(\n\t\t\t\t\t\tblockOrder[ i ]\n\t\t\t\t\t).content?.match( /<!--nextpage-->/g );\n\n\t\t\t\t\tif ( pageBreaks !== null && pageBreaks !== undefined ) {\n\t\t\t\t\t\tpage += pageBreaks.length;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn page;\n\t\t},\n\t\t[ clientId, onlyIncludeCurrentPage ]\n\t);\n\n\tuseEffect( () => {\n\t\tlet latestHeadings;\n\n\t\tif ( onlyIncludeCurrentPage ) {\n\t\t\tconst pagesOfContent = postContent.split( '<!--nextpage-->' );\n\n\t\t\tlatestHeadings = getHeadingsFromContent(\n\t\t\t\tpagesOfContent[ pageIndex - 1 ]\n\t\t\t);\n\t\t} else {\n\t\t\tlatestHeadings = getHeadingsFromContent( postContent );\n\t\t}\n\n\t\tif ( ! isEqual( headings, latestHeadings ) ) {\n\t\t\tsetHeadings( latestHeadings );\n\t\t\tsetHeadingTree( linearToNestedHeadingList( latestHeadings ) );\n\t\t}\n\t}, [ pageIndex, postContent, onlyIncludeCurrentPage ] );\n\n\tconst { replaceBlocks } = useDispatch( blockEditorStore );\n\n\tconst toolbarControls = listBlockExists && (\n\t\t<BlockControls>\n\t\t\t<ToolbarGroup>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\tcreateBlock( 'core/list', {\n\t\t\t\t\t\t\t\tvalues: renderToString(\n\t\t\t\t\t\t\t\t\t<TableOfContentsList\n\t\t\t\t\t\t\t\t\t\tnestedHeadingList={ headingTree }\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} )\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Convert to static list' ) }\n\t\t\t\t</ToolbarButton>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n\n\tconst inspectorControls = (\n\t\t<InspectorControls>\n\t\t\t<PanelBody title={ __( 'Table of Contents settings' ) }>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Only include current page' ) }\n\t\t\t\t\tchecked={ onlyIncludeCurrentPage }\n\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\tsetAttributes( { onlyIncludeCurrentPage: value } )\n\t\t\t\t\t}\n\t\t\t\t\thelp={\n\t\t\t\t\t\tonlyIncludeCurrentPage\n\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t'Only including headings from the current page (if the post is paginated).'\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t'Toggle to only include headings from the current page (if the post is paginated).'\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t</InspectorControls>\n\t);\n\n\t// If there are no headings or the only heading is empty.\n\t// Note that the toolbar controls are intentionally omitted since the\n\t// \"Convert to static list\" option is useless to the placeholder state.\n\tif ( headings.length === 0 ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<div { ...blockProps }>\n\t\t\t\t\t<Placeholder\n\t\t\t\t\t\ticon={ <BlockIcon icon=\"list-view\" /> }\n\t\t\t\t\t\tlabel=\"Table of Contents\"\n\t\t\t\t\t\tinstructions={ __(\n\t\t\t\t\t\t\t'Start adding Heading blocks to create a table of contents. Headings with HTML anchors will be linked here.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t{ inspectorControls }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<nav { ...blockProps }>\n\t\t\t\t<ul>\n\t\t\t\t\t<TableOfContentsList nestedHeadingList={ headingTree } />\n\t\t\t\t</ul>\n\t\t\t</nav>\n\t\t\t{ toolbarControls }\n\t\t\t{ inspectorControls }\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/edit.js"],"names":["isEqual","BlockControls","BlockIcon","InspectorControls","store","blockEditorStore","useBlockProps","createBlock","blocksStore","PanelBody","Placeholder","ToggleControl","ToolbarButton","ToolbarGroup","useDisabled","useDispatch","useSelect","__unstableStripHTML","stripHTML","renderToString","useEffect","__","addQueryArgs","removeQueryArgs","icon","TableOfContentsList","linearToNestedHeadingList","TableOfContentsEdit","attributes","headings","onlyIncludeCurrentPage","clientId","setAttributes","blockProps","disabledRef","listBlockExists","select","getBlockType","__unstableMarkNextChangeAsNotPersistent","replaceBlocks","latestHeadings","getBlockAttributes","getBlockName","getClientIdsWithDescendants","__experimentalGetGlobalBlocksByName","getGlobalBlocksByName","editorSelectors","pageBreakClientIds","isPaginated","length","allBlockClientIds","tocPage","tocIndex","indexOf","blockIndex","blockClientId","entries","_latestHeadings","headingPage","permalink","getPermalink","headingPageLink","page","blockName","headingAttributes","canBeLinked","anchor","push","content","level","link","headingTree","toolbarControls","ordered","values","inspectorControls","value"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEqual } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInspectorControls,\n\tstore as blockEditorStore,\n\tuseBlockProps,\n} from '@wordpress/block-editor';\nimport { createBlock, store as blocksStore } from '@wordpress/blocks';\nimport {\n\tPanelBody,\n\tPlaceholder,\n\tToggleControl,\n\tToolbarButton,\n\tToolbarGroup,\n} from '@wordpress/components';\nimport { useDisabled } from '@wordpress/compose';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\nimport { renderToString, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { addQueryArgs, removeQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport icon from './icon';\nimport TableOfContentsList from './list';\nimport { linearToNestedHeadingList } from './utils';\n\n/** @typedef {import('./utils').HeadingData} HeadingData */\n\n/**\n * Table of Contents block edit component.\n *\n * @param {Object}                       props                                   The props.\n * @param {Object}                       props.attributes                        The block attributes.\n * @param {HeadingData[]}                props.attributes.headings               A list of data for each heading in the post.\n * @param {boolean}                      props.attributes.onlyIncludeCurrentPage Whether to only include headings from the current page (if the post is paginated).\n * @param {string}                       props.clientId\n * @param {(attributes: Object) => void} props.setAttributes\n *\n * @return {WPComponent} The component.\n */\nexport default function TableOfContentsEdit( {\n\tattributes: { headings = [], onlyIncludeCurrentPage },\n\tclientId,\n\tsetAttributes,\n} ) {\n\tconst blockProps = useBlockProps();\n\tconst disabledRef = useDisabled();\n\n\tconst listBlockExists = useSelect(\n\t\t( select ) => !! select( blocksStore ).getBlockType( 'core/list' ),\n\t\t[]\n\t);\n\n\tconst {\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\treplaceBlocks,\n\t} = useDispatch( blockEditorStore );\n\n\t/**\n\t * The latest heading data, or null if the new data deeply equals the saved\n\t * headings attribute.\n\t *\n\t * Since useSelect forces a re-render when its return value is shallowly\n\t * inequal to its prior call, we would be re-rendering this block every time\n\t * the stores change, even if the latest headings were deeply equal to the\n\t * ones saved in the block attributes.\n\t *\n\t * By returning null when they're equal, we reduce that to 2 renders: one\n\t * when there are new latest headings (and so it returns them), and one when\n\t * they haven't changed (so it returns null). As long as the latest heading\n\t * data remains the same, further calls of the useSelect callback will\n\t * continue to return null, thus preventing any forced re-renders.\n\t */\n\tconst latestHeadings = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetBlockName,\n\t\t\t\tgetClientIdsWithDescendants,\n\t\t\t\t__experimentalGetGlobalBlocksByName: getGlobalBlocksByName,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\t// FIXME: @wordpress/block-library should not depend on @wordpress/editor.\n\t\t\t// Blocks can be loaded into a *non-post* block editor, so to avoid\n\t\t\t// declaring @wordpress/editor as a dependency, we must access its\n\t\t\t// store by string. When the store is not available, editorSelectors\n\t\t\t// will be null, and the block's saved markup will lack permalinks.\n\t\t\t// eslint-disable-next-line @wordpress/data-no-store-string-literals\n\t\t\tconst editorSelectors = select( 'core/editor' );\n\n\t\t\tconst pageBreakClientIds = getGlobalBlocksByName( 'core/nextpage' );\n\n\t\t\tconst isPaginated = pageBreakClientIds.length !== 0;\n\n\t\t\t// Get the client ids of all blocks in the editor.\n\t\t\tconst allBlockClientIds = getClientIdsWithDescendants();\n\n\t\t\t// If onlyIncludeCurrentPage is true, calculate the page (of a paginated post) this block is part of, so we know which headings to include; otherwise, skip the calculation.\n\t\t\tlet tocPage = 1;\n\n\t\t\tif ( isPaginated && onlyIncludeCurrentPage ) {\n\t\t\t\t// We can't use getBlockIndex because it only returns the index\n\t\t\t\t// relative to sibling blocks.\n\t\t\t\tconst tocIndex = allBlockClientIds.indexOf( clientId );\n\n\t\t\t\tfor ( const [\n\t\t\t\t\tblockIndex,\n\t\t\t\t\tblockClientId,\n\t\t\t\t] of allBlockClientIds.entries() ) {\n\t\t\t\t\t// If we've reached blocks after the Table of Contents, we've\n\t\t\t\t\t// finished calculating which page the block is on.\n\t\t\t\t\tif ( blockIndex >= tocIndex ) {\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t\tif ( getBlockName( blockClientId ) === 'core/nextpage' ) {\n\t\t\t\t\t\ttocPage++;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst _latestHeadings = [];\n\n\t\t\t/** The page (of a paginated post) a heading will be part of. */\n\t\t\tlet headingPage = 1;\n\n\t\t\t/**\n\t\t\t * A permalink to the current post. If the core/editor store is\n\t\t\t * unavailable, this variable will be null.\n\t\t\t */\n\t\t\tconst permalink = editorSelectors?.getPermalink() ?? null;\n\n\t\t\tlet headingPageLink = null;\n\n\t\t\t// If the core/editor store is available, we can add permalinks to the\n\t\t\t// generated table of contents.\n\t\t\tif ( typeof permalink === 'string' ) {\n\t\t\t\theadingPageLink = isPaginated\n\t\t\t\t\t? addQueryArgs( permalink, { page: headingPage } )\n\t\t\t\t\t: permalink;\n\t\t\t}\n\n\t\t\tfor ( const blockClientId of allBlockClientIds ) {\n\t\t\t\tconst blockName = getBlockName( blockClientId );\n\t\t\t\tif ( blockName === 'core/nextpage' ) {\n\t\t\t\t\theadingPage++;\n\n\t\t\t\t\t// If we're only including headings from the current page (of\n\t\t\t\t\t// a paginated post), then exit the loop if we've reached the\n\t\t\t\t\t// pages after the one with the Table of Contents block.\n\t\t\t\t\tif ( onlyIncludeCurrentPage && headingPage > tocPage ) {\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\n\t\t\t\t\tif ( typeof permalink === 'string' ) {\n\t\t\t\t\t\theadingPageLink = addQueryArgs(\n\t\t\t\t\t\t\tremoveQueryArgs( permalink, [ 'page' ] ),\n\t\t\t\t\t\t\t{ page: headingPage }\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t// If we're including all headings or we've reached headings on\n\t\t\t\t// the same page as the Table of Contents block, add them to the\n\t\t\t\t// list.\n\t\t\t\telse if (\n\t\t\t\t\t! onlyIncludeCurrentPage ||\n\t\t\t\t\theadingPage === tocPage\n\t\t\t\t) {\n\t\t\t\t\tif ( blockName === 'core/heading' ) {\n\t\t\t\t\t\tconst headingAttributes = getBlockAttributes(\n\t\t\t\t\t\t\tblockClientId\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tconst canBeLinked =\n\t\t\t\t\t\t\ttypeof headingPageLink === 'string' &&\n\t\t\t\t\t\t\ttypeof headingAttributes.anchor === 'string' &&\n\t\t\t\t\t\t\theadingAttributes.anchor !== '';\n\n\t\t\t\t\t\t_latestHeadings.push( {\n\t\t\t\t\t\t\tcontent: stripHTML( headingAttributes.content ),\n\t\t\t\t\t\t\tlevel: headingAttributes.level,\n\t\t\t\t\t\t\tlink: canBeLinked\n\t\t\t\t\t\t\t\t? `${ headingPageLink }#${ headingAttributes.anchor }`\n\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif ( isEqual( headings, _latestHeadings ) ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\treturn _latestHeadings;\n\t\t},\n\t\t[ clientId, onlyIncludeCurrentPage, headings ]\n\t);\n\n\tuseEffect( () => {\n\t\tif ( latestHeadings !== null ) {\n\t\t\t// This is required to keep undo working and not create 2 undo steps\n\t\t\t// for each heading change.\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tsetAttributes( { headings: latestHeadings } );\n\t\t}\n\t}, [ latestHeadings ] );\n\n\tconst headingTree = linearToNestedHeadingList( headings );\n\n\tconst toolbarControls = listBlockExists && (\n\t\t<BlockControls>\n\t\t\t<ToolbarGroup>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\treplaceBlocks(\n\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\tcreateBlock( 'core/list', {\n\t\t\t\t\t\t\t\tordered: true,\n\t\t\t\t\t\t\t\tvalues: renderToString(\n\t\t\t\t\t\t\t\t\t<TableOfContentsList\n\t\t\t\t\t\t\t\t\t\tnestedHeadingList={ headingTree }\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} )\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Convert to static list' ) }\n\t\t\t\t</ToolbarButton>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n\n\tconst inspectorControls = (\n\t\t<InspectorControls>\n\t\t\t<PanelBody title={ __( 'Settings' ) }>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Only include current page' ) }\n\t\t\t\t\tchecked={ onlyIncludeCurrentPage }\n\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\tsetAttributes( { onlyIncludeCurrentPage: value } )\n\t\t\t\t\t}\n\t\t\t\t\thelp={\n\t\t\t\t\t\tonlyIncludeCurrentPage\n\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t'Only including headings from the current page (if the post is paginated).'\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t'Toggle to only include headings from the current page (if the post is paginated).'\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t</InspectorControls>\n\t);\n\n\t// If there are no headings or the only heading is empty.\n\t// Note that the toolbar controls are intentionally omitted since the\n\t// \"Convert to static list\" option is useless to the placeholder state.\n\tif ( headings.length === 0 ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<div { ...blockProps }>\n\t\t\t\t\t<Placeholder\n\t\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\t\tlabel=\"Table of Contents\"\n\t\t\t\t\t\tinstructions={ __(\n\t\t\t\t\t\t\t'Start adding Heading blocks to create a table of contents. Headings with HTML anchors will be linked here.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t{ inspectorControls }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<nav { ...blockProps }>\n\t\t\t\t<ol ref={ disabledRef }>\n\t\t\t\t\t<TableOfContentsList nestedHeadingList={ headingTree } />\n\t\t\t\t</ol>\n\t\t\t</nav>\n\t\t\t{ toolbarControls }\n\t\t\t{ inspectorControls }\n\t\t</>\n\t);\n}\n"]}

package/build-module/table-of-contents/index.js

@@ -4,6 +4,7 @@
 const metadata = {
   $schema: "https://schemas.wp.org/trunk/block.json",
   apiVersion: 2,
+  __experimental: true,
   name: "core/table-of-contents",
   title: "Table of Contents",
   category: "layout",
@@ -11,24 +12,32 @@ const metadata = {
   keywords: ["document outline", "summary"],
   textdomain: "default",
   attributes: {
+    headings: {
+      type: "array",
+      items: {
+        type: "object"
+      }
+    },
     onlyIncludeCurrentPage: {
       type: "boolean",
       "default": false
     }
   },
-  usesContext: ["postId"],
   supports: {
     html: false
-  }
+  },
+  example: {}
 };
 import edit from './edit';
 import icon from './icon';
+import save from './save';
 const {
   name
 } = metadata;
 export { metadata, name };
 export const settings = {
   icon,
-  edit
+  edit,
+  save
 };
 //# sourceMappingURL=index.js.map

package/build-module/table-of-contents/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/index.js"],"names":["edit","icon","name","metadata","settings"],"mappings":"AAAA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;AAEA,OAAOA,IAAP,MAAiB,QAAjB;AACA,OAAOC,IAAP,MAAiB,QAAjB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAWC,QAAjB;AAEA,SAASA,QAAT,EAAmBD,IAAnB;AAEA,OAAO,MAAME,QAAQ,GAAG;AACvBH,EAAAA,IADuB;AAEvBD,EAAAA;AAFuB,CAAjB","sourcesContent":["/**\n * Internal dependencies\n */\nimport metadata from './block.json';\nimport edit from './edit';\nimport icon from './icon';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n};\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/index.js"],"names":["edit","icon","save","name","metadata","settings"],"mappings":"AAAA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAOA,IAAP,MAAiB,QAAjB;AACA,OAAOC,IAAP,MAAiB,QAAjB;AACA,OAAOC,IAAP,MAAiB,QAAjB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAWC,QAAjB;AAEA,SAASA,QAAT,EAAmBD,IAAnB;AAEA,OAAO,MAAME,QAAQ,GAAG;AACvBJ,EAAAA,IADuB;AAEvBD,EAAAA,IAFuB;AAGvBE,EAAAA;AAHuB,CAAjB","sourcesContent":["/**\n * Internal dependencies\n */\nimport metadata from './block.json';\nimport edit from './edit';\nimport icon from './icon';\nimport save from './save';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n};\n"]}

package/build-module/table-of-contents/list.js

@@ -1,25 +1,33 @@
-import { createElement } from "@wordpress/element";
+import { createElement, Fragment } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
 const ENTRY_CLASS_NAME = 'wp-block-table-of-contents__entry';
 export default function TableOfContentsList(_ref) {
   let {
     nestedHeadingList
   } = _ref;
-  return nestedHeadingList.map((childNode, index) => {
+  return createElement(Fragment, null, nestedHeadingList.map((node, index) => {
     const {
-      anchor,
-      content
-    } = childNode.heading;
-    const entry = anchor ? createElement("a", {
+      content,
+      link
+    } = node.heading;
+    const entry = link ? createElement("a", {
       className: ENTRY_CLASS_NAME,
-      href: anchor
+      href: link
     }, content) : createElement("span", {
       className: ENTRY_CLASS_NAME
     }, content);
     return createElement("li", {
       key: index
-    }, entry, childNode.children ? createElement("ul", null, createElement(TableOfContentsList, {
-      nestedHeadingList: childNode.children
+    }, entry, node.children ? createElement("ol", null, createElement(TableOfContentsList, {
+      nestedHeadingList: node.children
     })) : null);
-  });
+  }));
 }
 //# sourceMappingURL=list.js.map

package/build-module/table-of-contents/list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/list.js"],"names":["ENTRY_CLASS_NAME","TableOfContentsList","nestedHeadingList","map","childNode","index","anchor","content","heading","entry","children"],"mappings":";AAAA,MAAMA,gBAAgB,GAAG,mCAAzB;AAEA,eAAe,SAASC,mBAAT,OAAsD;AAAA,MAAxB;AAAEC,IAAAA;AAAF,GAAwB;AACpE,SAAOA,iBAAiB,CAACC,GAAlB,CAAuB,CAAEC,SAAF,EAAaC,KAAb,KAAwB;AACrD,UAAM;AAAEC,MAAAA,MAAF;AAAUC,MAAAA;AAAV,QAAsBH,SAAS,CAACI,OAAtC;AAEA,UAAMC,KAAK,GAAGH,MAAM,GACnB;AAAG,MAAA,SAAS,EAAGN,gBAAf;AAAkC,MAAA,IAAI,EAAGM;AAAzC,OACGC,OADH,CADmB,GAKnB;AAAM,MAAA,SAAS,EAAGP;AAAlB,OAAuCO,OAAvC,CALD;AAQA,WACC;AAAI,MAAA,GAAG,EAAGF;AAAV,OACGI,KADH,EAEGL,SAAS,CAACM,QAAV,GACD,0BACC,cAAC,mBAAD;AACC,MAAA,iBAAiB,EAAGN,SAAS,CAACM;AAD/B,MADD,CADC,GAME,IARL,CADD;AAYA,GAvBM,CAAP;AAwBA","sourcesContent":["const ENTRY_CLASS_NAME = 'wp-block-table-of-contents__entry';\n\nexport default function TableOfContentsList( { nestedHeadingList } ) {\n\treturn nestedHeadingList.map( ( childNode, index ) => {\n\t\tconst { anchor, content } = childNode.heading;\n\n\t\tconst entry = anchor ? (\n\t\t\t<a className={ ENTRY_CLASS_NAME } href={ anchor }>\n\t\t\t\t{ content }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<span className={ ENTRY_CLASS_NAME }>{ content }</span>\n\t\t);\n\n\t\treturn (\n\t\t\t<li key={ index }>\n\t\t\t\t{ entry }\n\t\t\t\t{ childNode.children ? (\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<TableOfContentsList\n\t\t\t\t\t\t\tnestedHeadingList={ childNode.children }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ul>\n\t\t\t\t) : null }\n\t\t\t</li>\n\t\t);\n\t} );\n}\n"]}
+{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/list.tsx"],"names":["ENTRY_CLASS_NAME","TableOfContentsList","nestedHeadingList","map","node","index","content","link","heading","entry","children"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,gBAAgB,GAAG,mCAAzB;AAEA,eAAe,SAASC,mBAAT,OAIA;AAAA,MAJ8B;AAC5CC,IAAAA;AAD4C,GAI9B;AACd,SACC,8BACGA,iBAAiB,CAACC,GAAlB,CAAuB,CAAEC,IAAF,EAAQC,KAAR,KAAmB;AAC3C,UAAM;AAAEC,MAAAA,OAAF;AAAWC,MAAAA;AAAX,QAAoBH,IAAI,CAACI,OAA/B;AAEA,UAAMC,KAAK,GAAGF,IAAI,GACjB;AAAG,MAAA,SAAS,EAAGP,gBAAf;AAAkC,MAAA,IAAI,EAAGO;AAAzC,OACGD,OADH,CADiB,GAKjB;AAAM,MAAA,SAAS,EAAGN;AAAlB,OAAuCM,OAAvC,CALD;AAQA,WACC;AAAI,MAAA,GAAG,EAAGD;AAAV,OACGI,KADH,EAEGL,IAAI,CAACM,QAAL,GACD,0BACC,cAAC,mBAAD;AACC,MAAA,iBAAiB,EAAGN,IAAI,CAACM;AAD1B,MADD,CADC,GAME,IARL,CADD;AAYA,GAvBC,CADH,CADD;AA4BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport type { WPElement } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { NestedHeadingData } from './utils';\n\nconst ENTRY_CLASS_NAME = 'wp-block-table-of-contents__entry';\n\nexport default function TableOfContentsList( {\n\tnestedHeadingList,\n}: {\n\tnestedHeadingList: NestedHeadingData[];\n} ): WPElement {\n\treturn (\n\t\t<>\n\t\t\t{ nestedHeadingList.map( ( node, index ) => {\n\t\t\t\tconst { content, link } = node.heading;\n\n\t\t\t\tconst entry = link ? (\n\t\t\t\t\t<a className={ ENTRY_CLASS_NAME } href={ link }>\n\t\t\t\t\t\t{ content }\n\t\t\t\t\t</a>\n\t\t\t\t) : (\n\t\t\t\t\t<span className={ ENTRY_CLASS_NAME }>{ content }</span>\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<li key={ index }>\n\t\t\t\t\t\t{ entry }\n\t\t\t\t\t\t{ node.children ? (\n\t\t\t\t\t\t\t<ol>\n\t\t\t\t\t\t\t\t<TableOfContentsList\n\t\t\t\t\t\t\t\t\tnestedHeadingList={ node.children }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ol>\n\t\t\t\t\t\t) : null }\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n"]}

package/build-module/table-of-contents/save.js

@@ -0,0 +1,28 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * WordPress dependencies
+ */
+import { useBlockProps } from '@wordpress/block-editor';
+/**
+ * Internal dependencies
+ */
+
+import TableOfContentsList from './list';
+import { linearToNestedHeadingList } from './utils';
+export default function save(_ref) {
+  let {
+    attributes: {
+      headings = []
+    }
+  } = _ref;
+
+  if (headings.length === 0) {
+    return null;
+  }
+
+  return createElement("nav", useBlockProps.save(), createElement("ol", null, createElement(TableOfContentsList, {
+    nestedHeadingList: linearToNestedHeadingList(headings)
+  })));
+}
+//# sourceMappingURL=save.js.map

package/build-module/table-of-contents/save.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/table-of-contents/save.js"],"names":["useBlockProps","TableOfContentsList","linearToNestedHeadingList","save","attributes","headings","length"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,yBAA9B;AAEA;AACA;AACA;;AACA,OAAOC,mBAAP,MAAgC,QAAhC;AACA,SAASC,yBAAT,QAA0C,SAA1C;AAEA,eAAe,SAASC,IAAT,OAAmD;AAAA,MAApC;AAAEC,IAAAA,UAAU,EAAE;AAAEC,MAAAA,QAAQ,GAAG;AAAb;AAAd,GAAoC;;AACjE,MAAKA,QAAQ,CAACC,MAAT,KAAoB,CAAzB,EAA6B;AAC5B,WAAO,IAAP;AACA;;AACD,SACC,qBAAUN,aAAa,CAACG,IAAd,EAAV,EACC,0BACC,cAAC,mBAAD;AACC,IAAA,iBAAiB,EAAGD,yBAAyB,CAAEG,QAAF;AAD9C,IADD,CADD,CADD;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useBlockProps } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport TableOfContentsList from './list';\nimport { linearToNestedHeadingList } from './utils';\n\nexport default function save( { attributes: { headings = [] } } ) {\n\tif ( headings.length === 0 ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<nav { ...useBlockProps.save() }>\n\t\t\t<ol>\n\t\t\t\t<TableOfContentsList\n\t\t\t\t\tnestedHeadingList={ linearToNestedHeadingList( headings ) }\n\t\t\t\t/>\n\t\t\t</ol>\n\t\t</nav>\n\t);\n}\n"]}

package/build-module/table-of-contents/utils.js

@@ -1,75 +1,12 @@
-/**
- * @typedef WPHeadingData
- *
- * @property {string} anchor  The anchor link to the heading, or '' if none.
- * @property {string} content The plain text content of the heading.
- * @property {number} level   The heading level.
- */
-
-/**
- * Extracts text, anchor, and level from a list of heading elements.
- *
- * @param {NodeList} headingElements The list of heading elements.
- *
- * @return {WPHeadingData[]} The list of heading parameters.
- */
-export function getHeadingsFromHeadingElements(headingElements) {
-  return [...headingElements].map(heading => ({
-    // A little hacky, but since we know at this point that the tag will
-    // be an H1-H6, we can just grab the 2nd character of the tag name and
-    // convert it to an integer. Should be faster than conditionals.
-    level: parseInt(heading.tagName[1], 10),
-    anchor: heading.hasAttribute('id') ? `#${heading.id}` : '',
-    content: heading.textContent
-  }));
-}
-/**
- * Extracts heading data from the provided content.
- *
- * @param {string} content The content to extract heading data from.
- *
- * @return {WPHeadingData[]} The list of heading parameters.
- */
-
-export function getHeadingsFromContent(content) {
-  // Create a temporary container to put the post content into, so we can
-  // use the DOM to find all the headings.
-  const tempPostContentDOM = document.createElement('div');
-  tempPostContentDOM.innerHTML = content; // Remove template elements so that headings inside them aren't counted.
-  // This is only needed for IE11, which doesn't recognize the element and
-  // treats it like a div.
-
-  for (const template of tempPostContentDOM.querySelectorAll('template')) {
-    template.remove();
-  }
-
-  const headingElements = tempPostContentDOM.querySelectorAll('h1:not(:empty), h2:not(:empty), h3:not(:empty), h4:not(:empty), h5:not(:empty), h6:not(:empty)');
-  return getHeadingsFromHeadingElements(headingElements);
-}
-/**
- * @typedef WPNestedHeadingData
- *
- * @property {WPHeadingData}              heading  The heading content, anchor,
- *                                                 and level.
- * @property {number}                     index    The index of this heading
- *                                                 node in the entire nested
- *                                                 list of heading data.
- * @property {WPNestedHeadingData[]|null} children The sub-headings of this
- *                                                 heading, if any.
- */
-
 /**
  * Takes a flat list of heading parameters and nests them based on each header's
  * immediate parent's level.
  *
- * @param {WPHeadingData[]} headingList The flat list of headings to nest.
- * @param {number}          index       The current list index.
+ * @param  headingList The flat list of headings to nest.
  *
- * @return {WPNestedHeadingData[]} The nested list of headings.
+ * @return The nested list of headings.
  */
-
 export function linearToNestedHeadingList(headingList) {
-  let index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
   const nestedHeadingList = [];
   headingList.forEach((heading, key) => {
     if (heading.content === '') {
@@ -78,13 +15,15 @@ export function linearToNestedHeadingList(headingList) {
 
 
     if (heading.level === headingList[0].level) {
+      var _headingList;
+
       // Check that the next iteration will return a value.
       // If it does and the next level is greater than the current level,
       // the next iteration becomes a child of the current iteration.
-      if (headingList[key + 1] !== undefined && headingList[key + 1].level > heading.level) {
-        // We need to calculate the last index before the next iteration that has the same level (siblings).
-        // We then use this last index to slice the array for use in recursion.
-        // This prevents duplicate nodes.
+      if (((_headingList = headingList[key + 1]) === null || _headingList === void 0 ? void 0 : _headingList.level) > heading.level) {
+        // We must calculate the last index before the next iteration that
+        // has the same level (siblings). We then use this index to slice
+        // the array for use in recursion. This prevents duplicate nodes.
         let endOfSlice = headingList.length;
 
         for (let i = key + 1; i < headingList.length; i++) {
@@ -92,19 +31,18 @@ export function linearToNestedHeadingList(headingList) {
             endOfSlice = i;
             break;
           }
-        } // We found a child node: Push a new node onto the return array with children.
+        } // We found a child node: Push a new node onto the return array
+        // with children.
 
 
         nestedHeadingList.push({
           heading,
-          index: index + key,
-          children: linearToNestedHeadingList(headingList.slice(key + 1, endOfSlice), index + key + 1)
+          children: linearToNestedHeadingList(headingList.slice(key + 1, endOfSlice))
         });
       } else {
         // No child node: Push a new node onto the return array.
         nestedHeadingList.push({
           heading,
-          index: index + key,
           children: null
         });
       }