@wordpress/block-library 9.38.0 → 9.39.0

package/build-module/post-excerpt/edit.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/post-excerpt/edit.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useEntityProp, store as coreStore } from '@wordpress/core-data';\nimport { useMemo } from '@wordpress/element';\nimport {\n\tAlignmentToolbar,\n\tBlockControls,\n\tInspectorControls,\n\tRichText,\n\tWarning,\n\tuseBlockProps,\n\tuseBlockEditingMode,\n} from '@wordpress/block-editor';\nimport {\n\tToggleControl,\n\tRangeControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport {\n\tuseCanEditEntity,\n\tuseToolsPanelDropdownMenuProps,\n} from '../utils/hooks';\n\nconst ELLIPSIS = '\u2026';\n\nexport default function PostExcerptEditor( {\n\tattributes: { textAlign, moreText, showMoreOnNewLine, excerptLength },\n\tsetAttributes,\n\tisSelected,\n\tcontext: { postId, postType, queryId },\n} ) {\n\tconst blockEditingMode = useBlockEditingMode();\n\tconst showControls = blockEditingMode === 'default';\n\tconst isDescendentOfQueryLoop = Number.isFinite( queryId );\n\tconst userCanEdit = useCanEditEntity( 'postType', postType, postId );\n\tconst [\n\t\trawExcerpt,\n\t\tsetExcerpt,\n\t\t{ rendered: renderedExcerpt, protected: isProtected } = {},\n\t] = useEntityProp( 'postType', postType, 'excerpt', postId );\n\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\t/**\n\t * Check if the post type supports excerpts.\n\t * Add an exception and return early for the \"page\" post type,\n\t * which is registered without support for the excerpt UI,\n\t * but supports saving the excerpt to the database.\n\t * See: https://core.trac.wordpress.org/browser/branches/6.1/src/wp-includes/post.php#L65\n\t * Without this exception, users that have excerpts saved to the database will\n\t * not be able to edit the excerpts.\n\t */\n\tconst postTypeSupportsExcerpts = useSelect(\n\t\t( select ) => {\n\t\t\tif ( postType === 'page' ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\treturn !! select( coreStore ).getPostType( postType )?.supports\n\t\t\t\t?.excerpt;\n\t\t},\n\t\t[ postType ]\n\t);\n\n\t/**\n\t * The excerpt is editable if:\n\t * - The user can edit the post\n\t * - It is not a descendent of a Query Loop block\n\t * - The post type supports excerpts\n\t */\n\tconst isEditable =\n\t\tuserCanEdit && ! isDescendentOfQueryLoop && postTypeSupportsExcerpts;\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: clsx( {\n\t\t\t[ `has-text-align-${ textAlign }` ]: textAlign,\n\t\t} ),\n\t} );\n\n\t/**\n\t * translators: If your word count is based on single characters (e.g. East Asian characters),\n\t * enter 'characters_excluding_spaces' or 'characters_including_spaces'. Otherwise, enter 'words'.\n\t * Do not translate into your own language.\n\t */\n\tconst wordCountType = _x( 'words', 'Word count type. Do not translate!' );\n\n\t/**\n\t * When excerpt is editable, strip the html tags from\n\t * rendered excerpt. This will be used if the entity's\n\t * excerpt has been produced from the content.\n\t */\n\tconst strippedRenderedExcerpt = useMemo( () => {\n\t\tif ( ! renderedExcerpt ) {\n\t\t\treturn '';\n\t\t}\n\t\tconst document = new window.DOMParser().parseFromString(\n\t\t\trenderedExcerpt,\n\t\t\t'text/html'\n\t\t);\n\t\treturn document.body.textContent || document.body.innerText || '';\n\t}, [ renderedExcerpt ] );\n\n\tif ( ! postType || ! postId ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<BlockControls>\n\t\t\t\t\t<AlignmentToolbar\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ ( newAlign ) =>\n\t\t\t\t\t\t\tsetAttributes( { textAlign: newAlign } )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</BlockControls>\n\t\t\t\t<div { ...blockProps }>\n\t\t\t\t\t<p>{ __( 'This block will display the excerpt.' ) }</p>\n\t\t\t\t</div>\n\t\t\t</>\n\t\t);\n\t}\n\tif ( isProtected && ! userCanEdit ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<Warning>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'The content is currently protected and does not have the available excerpt.'\n\t\t\t\t\t) }\n\t\t\t\t</Warning>\n\t\t\t</div>\n\t\t);\n\t}\n\tconst readMoreLink = (\n\t\t<RichText\n\t\t\tidentifier=\"moreText\"\n\t\t\tclassName=\"wp-block-post-excerpt__more-link\"\n\t\t\ttagName=\"a\"\n\t\t\taria-label={ __( '\u201CRead more\u201D link text' ) }\n\t\t\tplaceholder={ __( 'Add \"read more\" link text' ) }\n\t\t\tvalue={ moreText }\n\t\t\tonChange={ ( newMoreText ) =>\n\t\t\t\tsetAttributes( { moreText: newMoreText } )\n\t\t\t}\n\t\t\twithoutInteractiveFormatting\n\t\t/>\n\t);\n\tconst excerptClassName = clsx( 'wp-block-post-excerpt__excerpt', {\n\t\t'is-inline': ! showMoreOnNewLine,\n\t} );\n\n\t/**\n\t * The excerpt length setting needs to be applied to both\n\t * the raw and the rendered excerpt depending on which is being used.\n\t */\n\tconst rawOrRenderedExcerpt = (\n\t\trawExcerpt || strippedRenderedExcerpt\n\t).trim();\n\n\tlet trimmedExcerpt = '';\n\tif ( wordCountType === 'words' ) {\n\t\ttrimmedExcerpt = rawOrRenderedExcerpt\n\t\t\t.split( ' ', excerptLength )\n\t\t\t.join( ' ' );\n\t} else if ( wordCountType === 'characters_excluding_spaces' ) {\n\t\t/*\n\t\t * 1. Split the excerpt at the character limit,\n\t\t * then join the substrings back into one string.\n\t\t * 2. Count the number of spaces in the excerpt\n\t\t * by comparing the lengths of the string with and without spaces.\n\t\t * 3. Add the number to the length of the visible excerpt,\n\t\t * so that the spaces are excluded from the word count.\n\t\t */\n\t\tconst excerptWithSpaces = rawOrRenderedExcerpt\n\t\t\t.split( '', excerptLength )\n\t\t\t.join( '' );\n\n\t\tconst numberOfSpaces =\n\t\t\texcerptWithSpaces.length -\n\t\t\texcerptWithSpaces.replaceAll( ' ', '' ).length;\n\n\t\ttrimmedExcerpt = rawOrRenderedExcerpt\n\t\t\t.split( '', excerptLength + numberOfSpaces )\n\t\t\t.join( '' );\n\t} else if ( wordCountType === 'characters_including_spaces' ) {\n\t\ttrimmedExcerpt = rawOrRenderedExcerpt\n\t\t\t.split( '', excerptLength )\n\t\t\t.join( '' );\n\t}\n\n\tconst isTrimmed = trimmedExcerpt !== rawOrRenderedExcerpt;\n\n\tconst excerptContent = isEditable ? (\n\t\t<RichText\n\t\t\tclassName={ excerptClassName }\n\t\t\taria-label={ __( 'Excerpt text' ) }\n\t\t\tvalue={\n\t\t\t\tisSelected\n\t\t\t\t\t? rawOrRenderedExcerpt\n\t\t\t\t\t: ( ! isTrimmed\n\t\t\t\t\t\t\t? rawOrRenderedExcerpt\n\t\t\t\t\t\t\t: trimmedExcerpt + ELLIPSIS ) ||\n\t\t\t\t\t  __( 'No excerpt found' )\n\t\t\t}\n\t\t\tonChange={ setExcerpt }\n\t\t\ttagName=\"p\"\n\t\t/>\n\t) : (\n\t\t<p className={ excerptClassName }>\n\t\t\t{ ! isTrimmed\n\t\t\t\t? rawOrRenderedExcerpt || __( 'No excerpt found' )\n\t\t\t\t: trimmedExcerpt + ELLIPSIS }\n\t\t</p>\n\t);\n\treturn (\n\t\t<>\n\t\t\t{ showControls && (\n\t\t\t\t<BlockControls>\n\t\t\t\t\t<AlignmentToolbar\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ ( newAlign ) =>\n\t\t\t\t\t\t\tsetAttributes( { textAlign: newAlign } )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</BlockControls>\n\t\t\t) }\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tshowMoreOnNewLine: true,\n\t\t\t\t\t\t\texcerptLength: 55,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => showMoreOnNewLine !== true }\n\t\t\t\t\t\tlabel={ __( 'Show link on new line' ) }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showMoreOnNewLine: true } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show link on new line' ) }\n\t\t\t\t\t\t\tchecked={ showMoreOnNewLine }\n\t\t\t\t\t\t\tonChange={ ( newShowMoreOnNewLine ) =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tshowMoreOnNewLine: newShowMoreOnNewLine,\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</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => excerptLength !== 55 }\n\t\t\t\t\t\tlabel={ __( 'Max number of words' ) }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { excerptLength: 55 } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tlabel={ __( 'Max number of words' ) }\n\t\t\t\t\t\t\tvalue={ excerptLength }\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tsetAttributes( { excerptLength: value } );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tmin=\"10\"\n\t\t\t\t\t\t\tmax=\"100\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ excerptContent }\n\t\t\t\t{ ! showMoreOnNewLine && ' ' }\n\t\t\t\t{ showMoreOnNewLine ? (\n\t\t\t\t\t<p className=\"wp-block-post-excerpt__more-text\">\n\t\t\t\t\t\t{ readMoreLink }\n\t\t\t\t\t</p>\n\t\t\t\t) : (\n\t\t\t\t\treadMoreLink\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],
-  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,eAAe,SAAS,iBAAiB;AAClD,SAAS,eAAe;AACxB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP;AAAA,EACC;AAAA,EACA;AAAA,EACA,4BAA4B;AAAA,EAC5B,gCAAgC;AAAA,OAC1B;AACP,SAAS,IAAI,UAAU;AACvB,SAAS,iBAAiB;AAK1B;AAAA,EACC;AAAA,EACA;AAAA,OACM;AAkFJ,mBAEE,KAFF;AAhFH,IAAM,WAAW;AAEF,SAAR,kBAAoC;AAAA,EAC1C,YAAY,EAAE,WAAW,UAAU,mBAAmB,cAAc;AAAA,EACpE;AAAA,EACA;AAAA,EACA,SAAS,EAAE,QAAQ,UAAU,QAAQ;AACtC,GAAI;AACH,QAAM,mBAAmB,oBAAoB;AAC7C,QAAM,eAAe,qBAAqB;AAC1C,QAAM,0BAA0B,OAAO,SAAU,OAAQ;AACzD,QAAM,cAAc,iBAAkB,YAAY,UAAU,MAAO;AACnE,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA,EAAE,UAAU,iBAAiB,WAAW,YAAY,IAAI,CAAC;AAAA,EAC1D,IAAI,cAAe,YAAY,UAAU,WAAW,MAAO;AAE3D,QAAM,oBAAoB,+BAA+B;AAWzD,QAAM,2BAA2B;AAAA,IAChC,CAAE,WAAY;AACb,UAAK,aAAa,QAAS;AAC1B,eAAO;AAAA,MACR;AACA,aAAO,CAAC,CAAE,OAAQ,SAAU,EAAE,YAAa,QAAS,GAAG,UACpD;AAAA,IACJ;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAQA,QAAM,aACL,eAAe,CAAE,2BAA2B;AAE7C,QAAM,aAAa,cAAe;AAAA,IACjC,WAAW,KAAM;AAAA,MAChB,CAAE,kBAAmB,SAAU,EAAG,GAAG;AAAA,IACtC,CAAE;AAAA,EACH,CAAE;AAOF,QAAM,gBAAgB,GAAI,SAAS,oCAAqC;AAOxE,QAAM,0BAA0B,QAAS,MAAM;AAC9C,QAAK,CAAE,iBAAkB;AACxB,aAAO;AAAA,IACR;AACA,UAAM,WAAW,IAAI,OAAO,UAAU,EAAE;AAAA,MACvC;AAAA,MACA;AAAA,IACD;AACA,WAAO,SAAS,KAAK,eAAe,SAAS,KAAK,aAAa;AAAA,EAChE,GAAG,CAAE,eAAgB,CAAE;AAEvB,MAAK,CAAE,YAAY,CAAE,QAAS;AAC7B,WACC,iCACC;AAAA,0BAAC,iBACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ;AAAA,UACR,UAAW,CAAE,aACZ,cAAe,EAAE,WAAW,SAAS,CAAE;AAAA;AAAA,MAEzC,GACD;AAAA,MACA,oBAAC,SAAM,GAAG,YACT,8BAAC,OAAI,aAAI,sCAAuC,GAAG,GACpD;AAAA,OACD;AAAA,EAEF;AACA,MAAK,eAAe,CAAE,aAAc;AACnC,WACC,oBAAC,SAAM,GAAG,YACT,8BAAC,WACE;AAAA,MACD;AAAA,IACD,GACD,GACD;AAAA,EAEF;AACA,QAAM,eACL;AAAA,IAAC;AAAA;AAAA,MACA,YAAW;AAAA,MACX,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,cAAa,GAAI,iCAAwB;AAAA,MACzC,aAAc,GAAI,2BAA4B;AAAA,MAC9C,OAAQ;AAAA,MACR,UAAW,CAAE,gBACZ,cAAe,EAAE,UAAU,YAAY,CAAE;AAAA,MAE1C,8BAA4B;AAAA;AAAA,EAC7B;AAED,QAAM,mBAAmB,KAAM,kCAAkC;AAAA,IAChE,aAAa,CAAE;AAAA,EAChB,CAAE;AAMF,QAAM,wBACL,cAAc,yBACb,KAAK;AAEP,MAAI,iBAAiB;AACrB,MAAK,kBAAkB,SAAU;AAChC,qBAAiB,qBACf,MAAO,KAAK,aAAc,EAC1B,KAAM,GAAI;AAAA,EACb,WAAY,kBAAkB,+BAAgC;AAS7D,UAAM,oBAAoB,qBACxB,MAAO,IAAI,aAAc,EACzB,KAAM,EAAG;AAEX,UAAM,iBACL,kBAAkB,SAClB,kBAAkB,WAAY,KAAK,EAAG,EAAE;AAEzC,qBAAiB,qBACf,MAAO,IAAI,gBAAgB,cAAe,EAC1C,KAAM,EAAG;AAAA,EACZ,WAAY,kBAAkB,+BAAgC;AAC7D,qBAAiB,qBACf,MAAO,IAAI,aAAc,EACzB,KAAM,EAAG;AAAA,EACZ;AAEA,QAAM,YAAY,mBAAmB;AAErC,QAAM,iBAAiB,aACtB;AAAA,IAAC;AAAA;AAAA,MACA,WAAY;AAAA,MACZ,cAAa,GAAI,cAAe;AAAA,MAChC,OACC,aACG,wBACE,CAAE,YACF,uBACA,iBAAiB,aACnB,GAAI,kBAAmB;AAAA,MAE3B,UAAW;AAAA,MACX,SAAQ;AAAA;AAAA,EACT,IAEA,oBAAC,OAAE,WAAY,kBACZ,WAAE,YACD,wBAAwB,GAAI,kBAAmB,IAC/C,iBAAiB,UACrB;AAED,SACC,iCACG;AAAA,oBACD,oBAAC,iBACA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ;AAAA,QACR,UAAW,CAAE,aACZ,cAAe,EAAE,WAAW,SAAS,CAAE;AAAA;AAAA,IAEzC,GACD;AAAA,IAED,oBAAC,qBACA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,UAAW;AAAA,QACvB,UAAW,MAAM;AAChB,wBAAe;AAAA,YACd,mBAAmB;AAAA,YACnB,eAAe;AAAA,UAChB,CAAE;AAAA,QACH;AAAA,QACA;AAAA,QAEA;AAAA;AAAA,YAAC;AAAA;AAAA,cACA,UAAW,MAAM,sBAAsB;AAAA,cACvC,OAAQ,GAAI,uBAAwB;AAAA,cACpC,YAAa,MACZ,cAAe,EAAE,mBAAmB,KAAK,CAAE;AAAA,cAE5C,kBAAgB;AAAA,cAEhB;AAAA,gBAAC;AAAA;AAAA,kBACA,OAAQ,GAAI,uBAAwB;AAAA,kBACpC,SAAU;AAAA,kBACV,UAAW,CAAE,yBACZ,cAAe;AAAA,oBACd,mBAAmB;AAAA,kBACpB,CAAE;AAAA;AAAA,cAEJ;AAAA;AAAA,UACD;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACA,UAAW,MAAM,kBAAkB;AAAA,cACnC,OAAQ,GAAI,qBAAsB;AAAA,cAClC,YAAa,MACZ,cAAe,EAAE,eAAe,GAAG,CAAE;AAAA,cAEtC,kBAAgB;AAAA,cAEhB;AAAA,gBAAC;AAAA;AAAA,kBACA,uBAAqB;AAAA,kBACrB,OAAQ,GAAI,qBAAsB;AAAA,kBAClC,OAAQ;AAAA,kBACR,UAAW,CAAE,UAAW;AACvB,kCAAe,EAAE,eAAe,MAAM,CAAE;AAAA,kBACzC;AAAA,kBACA,KAAI;AAAA,kBACJ,KAAI;AAAA;AAAA,cACL;AAAA;AAAA,UACD;AAAA;AAAA;AAAA,IACD,GACD;AAAA,IACA,qBAAC,SAAM,GAAG,YACP;AAAA;AAAA,MACA,CAAE,qBAAqB;AAAA,MACvB,oBACD,oBAAC,OAAE,WAAU,oCACV,wBACH,IAEA;AAAA,OAEF;AAAA,KACD;AAEF;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useEntityProp, store as coreStore } from '@wordpress/core-data';\nimport { useMemo } from '@wordpress/element';\nimport {\n\tAlignmentToolbar,\n\tBlockControls,\n\tInspectorControls,\n\tRichText,\n\tWarning,\n\tuseBlockProps,\n\tuseBlockEditingMode,\n} from '@wordpress/block-editor';\nimport {\n\tToggleControl,\n\tRangeControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport {\n\tuseCanEditEntity,\n\tuseToolsPanelDropdownMenuProps,\n} from '../utils/hooks';\n\nconst ELLIPSIS = '\u2026';\n\nexport default function PostExcerptEditor( {\n\tattributes: { textAlign, moreText, showMoreOnNewLine, excerptLength },\n\tsetAttributes,\n\tisSelected,\n\tcontext: { postId, postType, queryId },\n} ) {\n\tconst blockEditingMode = useBlockEditingMode();\n\tconst showControls = blockEditingMode === 'default';\n\tconst isDescendentOfQueryLoop = Number.isFinite( queryId );\n\tconst userCanEdit = useCanEditEntity( 'postType', postType, postId );\n\tconst [\n\t\trawExcerpt,\n\t\tsetExcerpt,\n\t\t{ rendered: renderedExcerpt, protected: isProtected } = {},\n\t] = useEntityProp( 'postType', postType, 'excerpt', postId );\n\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\t/**\n\t * Check if the post type supports excerpts.\n\t * Add an exception and return early for the \"page\" post type,\n\t * which is registered without support for the excerpt UI,\n\t * but supports saving the excerpt to the database.\n\t * See: https://core.trac.wordpress.org/browser/branches/6.1/src/wp-includes/post.php#L65\n\t * Without this exception, users that have excerpts saved to the database will\n\t * not be able to edit the excerpts.\n\t */\n\tconst postTypeSupportsExcerpts = useSelect(\n\t\t( select ) => {\n\t\t\tif ( postType === 'page' ) {\n\t\t\t\treturn true;\n\t\t\t}\n\t\t\treturn !! select( coreStore ).getPostType( postType )?.supports\n\t\t\t\t?.excerpt;\n\t\t},\n\t\t[ postType ]\n\t);\n\n\t/**\n\t * The excerpt is editable if:\n\t * - The user can edit the post\n\t * - It is not a descendent of a Query Loop block\n\t * - The post type supports excerpts\n\t */\n\tconst isEditable =\n\t\tuserCanEdit && ! isDescendentOfQueryLoop && postTypeSupportsExcerpts;\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: clsx( {\n\t\t\t[ `has-text-align-${ textAlign }` ]: textAlign,\n\t\t} ),\n\t} );\n\n\t/**\n\t * translators: If your word count is based on single characters (e.g. East Asian characters),\n\t * enter 'characters_excluding_spaces' or 'characters_including_spaces'. Otherwise, enter 'words'.\n\t * Do not translate into your own language.\n\t */\n\tconst wordCountType = _x( 'words', 'Word count type. Do not translate!' );\n\n\t/**\n\t * When excerpt is editable, strip the html tags from\n\t * rendered excerpt. This will be used if the entity's\n\t * excerpt has been produced from the content.\n\t */\n\tconst strippedRenderedExcerpt = useMemo( () => {\n\t\tif ( ! renderedExcerpt ) {\n\t\t\treturn '';\n\t\t}\n\t\tconst document = new window.DOMParser().parseFromString(\n\t\t\trenderedExcerpt,\n\t\t\t'text/html'\n\t\t);\n\t\treturn document.body.textContent || document.body.innerText || '';\n\t}, [ renderedExcerpt ] );\n\n\tif ( ! postType || ! postId ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<BlockControls>\n\t\t\t\t\t<AlignmentToolbar\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ ( newAlign ) =>\n\t\t\t\t\t\t\tsetAttributes( { textAlign: newAlign } )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</BlockControls>\n\t\t\t\t<div { ...blockProps }>\n\t\t\t\t\t<p>{ __( 'This block will display the excerpt.' ) }</p>\n\t\t\t\t</div>\n\t\t\t</>\n\t\t);\n\t}\n\tif ( isProtected && ! userCanEdit ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<Warning>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'The content is currently protected and does not have the available excerpt.'\n\t\t\t\t\t) }\n\t\t\t\t</Warning>\n\t\t\t</div>\n\t\t);\n\t}\n\tconst readMoreLink = (\n\t\t<RichText\n\t\t\tidentifier=\"moreText\"\n\t\t\tclassName=\"wp-block-post-excerpt__more-link\"\n\t\t\ttagName=\"a\"\n\t\t\taria-label={ __( '\u201CRead more\u201D link text' ) }\n\t\t\tplaceholder={ __( 'Add \"read more\" link text' ) }\n\t\t\tvalue={ moreText }\n\t\t\tonChange={ ( newMoreText ) =>\n\t\t\t\tsetAttributes( { moreText: newMoreText } )\n\t\t\t}\n\t\t\twithoutInteractiveFormatting\n\t\t/>\n\t);\n\tconst excerptClassName = clsx( 'wp-block-post-excerpt__excerpt', {\n\t\t'is-inline': ! showMoreOnNewLine,\n\t} );\n\n\t/**\n\t * The excerpt length setting needs to be applied to both\n\t * the raw and the rendered excerpt depending on which is being used.\n\t */\n\tconst rawOrRenderedExcerpt = (\n\t\trawExcerpt || strippedRenderedExcerpt\n\t).trim();\n\n\tlet trimmedExcerpt = '';\n\tif ( wordCountType === 'words' ) {\n\t\ttrimmedExcerpt = rawOrRenderedExcerpt\n\t\t\t.split( /\\s+/, excerptLength )\n\t\t\t.join( ' ' );\n\t} else if ( wordCountType === 'characters_excluding_spaces' ) {\n\t\t/*\n\t\t * 1. Split the excerpt at the character limit,\n\t\t * then join the substrings back into one string.\n\t\t * 2. Count the number of spaces in the excerpt\n\t\t * by comparing the lengths of the string with and without spaces.\n\t\t * 3. Add the number to the length of the visible excerpt,\n\t\t * so that the spaces are excluded from the word count.\n\t\t */\n\t\tconst excerptWithSpaces = rawOrRenderedExcerpt\n\t\t\t.split( '', excerptLength )\n\t\t\t.join( '' );\n\n\t\tconst numberOfSpaces =\n\t\t\texcerptWithSpaces.length -\n\t\t\texcerptWithSpaces.replaceAll( ' ', '' ).length;\n\n\t\ttrimmedExcerpt = rawOrRenderedExcerpt\n\t\t\t.split( '', excerptLength + numberOfSpaces )\n\t\t\t.join( '' );\n\t} else if ( wordCountType === 'characters_including_spaces' ) {\n\t\ttrimmedExcerpt = rawOrRenderedExcerpt\n\t\t\t.split( '', excerptLength )\n\t\t\t.join( '' );\n\t}\n\n\tconst isTrimmed = trimmedExcerpt !== rawOrRenderedExcerpt;\n\n\tconst excerptContent = isEditable ? (\n\t\t<RichText\n\t\t\tclassName={ excerptClassName }\n\t\t\taria-label={ __( 'Excerpt text' ) }\n\t\t\tvalue={\n\t\t\t\tisSelected\n\t\t\t\t\t? rawOrRenderedExcerpt\n\t\t\t\t\t: ( ! isTrimmed\n\t\t\t\t\t\t\t? rawOrRenderedExcerpt\n\t\t\t\t\t\t\t: trimmedExcerpt + ELLIPSIS ) ||\n\t\t\t\t\t  __( 'No excerpt found' )\n\t\t\t}\n\t\t\tonChange={ setExcerpt }\n\t\t\ttagName=\"p\"\n\t\t/>\n\t) : (\n\t\t<p className={ excerptClassName }>\n\t\t\t{ ! isTrimmed\n\t\t\t\t? rawOrRenderedExcerpt || __( 'No excerpt found' )\n\t\t\t\t: trimmedExcerpt + ELLIPSIS }\n\t\t</p>\n\t);\n\treturn (\n\t\t<>\n\t\t\t{ showControls && (\n\t\t\t\t<BlockControls>\n\t\t\t\t\t<AlignmentToolbar\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ ( newAlign ) =>\n\t\t\t\t\t\t\tsetAttributes( { textAlign: newAlign } )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</BlockControls>\n\t\t\t) }\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tshowMoreOnNewLine: true,\n\t\t\t\t\t\t\texcerptLength: 55,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => showMoreOnNewLine !== true }\n\t\t\t\t\t\tlabel={ __( 'Show link on new line' ) }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { showMoreOnNewLine: true } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Show link on new line' ) }\n\t\t\t\t\t\t\tchecked={ showMoreOnNewLine }\n\t\t\t\t\t\t\tonChange={ ( newShowMoreOnNewLine ) =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tshowMoreOnNewLine: newShowMoreOnNewLine,\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</ToolsPanelItem>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => excerptLength !== 55 }\n\t\t\t\t\t\tlabel={ __( 'Max number of words' ) }\n\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\tsetAttributes( { excerptLength: 55 } )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tlabel={ __( 'Max number of words' ) }\n\t\t\t\t\t\t\tvalue={ excerptLength }\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tsetAttributes( { excerptLength: value } );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tmin=\"10\"\n\t\t\t\t\t\t\tmax=\"100\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ excerptContent }\n\t\t\t\t{ ! showMoreOnNewLine && ' ' }\n\t\t\t\t{ showMoreOnNewLine ? (\n\t\t\t\t\t<p className=\"wp-block-post-excerpt__more-text\">\n\t\t\t\t\t\t{ readMoreLink }\n\t\t\t\t\t</p>\n\t\t\t\t) : (\n\t\t\t\t\treadMoreLink\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/shortcode/block.json

@@ -16,7 +16,8 @@
 	"supports": {
 		"className": false,
 		"customClassName": false,
-		"html": false
+		"html": false,
+		"customCSS": false
 	},
 	"editorStyle": "wp-block-shortcode-editor"
 }

package/build-module/tab/add-tab-toolbar-control.mjs

@@ -1,29 +1,51 @@
 // packages/block-library/src/tab/add-tab-toolbar-control.js
+import { sprintf, __ } from "@wordpress/i18n";
 import { createBlock } from "@wordpress/blocks";
 import {
   BlockControls,
   store as blockEditorStore
 } from "@wordpress/block-editor";
 import { ToolbarGroup, ToolbarButton } from "@wordpress/components";
-import { __ } from "@wordpress/i18n";
-import { useDispatch } from "@wordpress/data";
+import { useDispatch, useSelect } from "@wordpress/data";
 import { jsx } from "react/jsx-runtime";
-function AddTabToolbarControl({ attributes, tabsClientId }) {
+function AddTabToolbarControl({ tabsClientId }) {
   const { insertBlock } = useDispatch(blockEditorStore);
-  const { className, fontFamily, fontSize } = attributes;
+  const { tabPanelsClientId, nextTabIndex } = useSelect(
+    (select) => {
+      if (!tabsClientId) {
+        return {
+          tabPanelsClientId: null,
+          nextTabIndex: 0
+        };
+      }
+      const { getBlocks } = select(blockEditorStore);
+      const innerBlocks = getBlocks(tabsClientId);
+      const tabPanels = innerBlocks.find(
+        (block) => block.name === "core/tab-panels"
+      );
+      return {
+        tabPanelsClientId: tabPanels?.clientId || null,
+        nextTabIndex: (tabPanels?.innerBlocks.length || 0) + 1
+      };
+    },
+    [tabsClientId]
+  );
   const addTab = () => {
+    if (!tabPanelsClientId) {
+      return;
+    }
     const newTabBlock = createBlock("core/tab", {
-      className,
-      fontFamily,
-      fontSize
+      anchor: "tab-" + nextTabIndex,
+      /* translators: %d: tab number */
+      label: sprintf(__("Tab %d"), nextTabIndex)
     });
-    insertBlock(newTabBlock, void 0, tabsClientId);
+    insertBlock(newTabBlock, void 0, tabPanelsClientId);
   };
-  return /* @__PURE__ */ jsx(BlockControls, { group: "block", children: /* @__PURE__ */ jsx(ToolbarGroup, { children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(ToolbarGroup, { children: /* @__PURE__ */ jsx(
     ToolbarButton,
     {
       className: "components-toolbar__control",
-      label: __("Add Tab"),
+      label: __("Add a new tab"),
       onClick: addTab,
       showTooltip: true,
       text: __("Add Tab")

package/build-module/tab/add-tab-toolbar-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/tab/add-tab-toolbar-control.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createBlock } from '@wordpress/blocks';\nimport {\n\tBlockControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { ToolbarGroup, ToolbarButton } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * \"Add Tab\" button in the block toolbar for the tab block.\n * @param {Object} props\n * @param {Object} props.attributes   The block attributes.\n * @param {string} props.tabsClientId The client ID of the parent tabs block.\n * @return {JSX.Element} The toolbar control element.\n */\nexport default function AddTabToolbarControl( { attributes, tabsClientId } ) {\n\tconst { insertBlock } = useDispatch( blockEditorStore );\n\n\tconst { className, fontFamily, fontSize } = attributes;\n\n\tconst addTab = () => {\n\t\tconst newTabBlock = createBlock( 'core/tab', {\n\t\t\tclassName,\n\t\t\tfontFamily,\n\t\t\tfontSize,\n\t\t} );\n\t\tinsertBlock( newTabBlock, undefined, tabsClientId );\n\t};\n\n\treturn (\n\t\t<BlockControls group=\"block\">\n\t\t\t<ToolbarGroup>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tclassName=\"components-toolbar__control\"\n\t\t\t\t\tlabel={ __( 'Add Tab' ) }\n\t\t\t\t\tonClick={ addTab }\n\t\t\t\t\tshowTooltip\n\t\t\t\t\ttext={ __( 'Add Tab' ) }\n\t\t\t\t/>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B;AAAA,EACC;AAAA,EACA,SAAS;AAAA,OACH;AACP,SAAS,cAAc,qBAAqB;AAC5C,SAAS,UAAU;AACnB,SAAS,mBAAmB;AA0BxB;AAjBW,SAAR,qBAAuC,EAAE,YAAY,aAAa,GAAI;AAC5E,QAAM,EAAE,YAAY,IAAI,YAAa,gBAAiB;AAEtD,QAAM,EAAE,WAAW,YAAY,SAAS,IAAI;AAE5C,QAAM,SAAS,MAAM;AACpB,UAAM,cAAc,YAAa,YAAY;AAAA,MAC5C;AAAA,MACA;AAAA,MACA;AAAA,IACD,CAAE;AACF,gBAAa,aAAa,QAAW,YAAa;AAAA,EACnD;AAEA,SACC,oBAAC,iBAAc,OAAM,SACpB,8BAAC,gBACA;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,OAAQ,GAAI,SAAU;AAAA,MACtB,SAAU;AAAA,MACV,aAAW;AAAA,MACX,MAAO,GAAI,SAAU;AAAA;AAAA,EACtB,GACD,GACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { sprintf, __ } from '@wordpress/i18n';\nimport { createBlock } from '@wordpress/blocks';\nimport {\n\tBlockControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { ToolbarGroup, ToolbarButton } from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * \"Add Tab\" button in the block toolbar for the tab block.\n * Inserts new tabs into the tab-panels block.\n *\n * @param {Object} props\n * @param {string} props.tabsClientId The client ID of the parent tabs block.\n * @return {JSX.Element} The toolbar control element.\n */\nexport default function AddTabToolbarControl( { tabsClientId } ) {\n\tconst { insertBlock } = useDispatch( blockEditorStore );\n\n\t// Find the tab-panels block within the tabs block\n\tconst { tabPanelsClientId, nextTabIndex } = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! tabsClientId ) {\n\t\t\t\treturn {\n\t\t\t\t\ttabPanelsClientId: null,\n\t\t\t\t\tnextTabIndex: 0,\n\t\t\t\t};\n\t\t\t}\n\t\t\tconst { getBlocks } = select( blockEditorStore );\n\t\t\tconst innerBlocks = getBlocks( tabsClientId );\n\t\t\tconst tabPanels = innerBlocks.find(\n\t\t\t\t( block ) => block.name === 'core/tab-panels'\n\t\t\t);\n\t\t\treturn {\n\t\t\t\ttabPanelsClientId: tabPanels?.clientId || null,\n\t\t\t\tnextTabIndex: ( tabPanels?.innerBlocks.length || 0 ) + 1,\n\t\t\t};\n\t\t},\n\t\t[ tabsClientId ]\n\t);\n\n\tconst addTab = () => {\n\t\tif ( ! tabPanelsClientId ) {\n\t\t\treturn;\n\t\t}\n\t\tconst newTabBlock = createBlock( 'core/tab', {\n\t\t\tanchor: 'tab-' + nextTabIndex,\n\t\t\t/* translators: %d: tab number */\n\t\t\tlabel: sprintf( __( 'Tab %d' ), nextTabIndex ),\n\t\t} );\n\t\tinsertBlock( newTabBlock, undefined, tabPanelsClientId );\n\t\t// @TODO: Possible select and focus the tabs-menu-item active tab RichText editor?\n\t};\n\n\treturn (\n\t\t<BlockControls group=\"other\">\n\t\t\t<ToolbarGroup>\n\t\t\t\t<ToolbarButton\n\t\t\t\t\tclassName=\"components-toolbar__control\"\n\t\t\t\t\tlabel={ __( 'Add a new tab' ) }\n\t\t\t\t\tonClick={ addTab }\n\t\t\t\t\tshowTooltip\n\t\t\t\t\ttext={ __( 'Add Tab' ) }\n\t\t\t\t/>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,SAAS,UAAU;AAC5B,SAAS,mBAAmB;AAC5B;AAAA,EACC;AAAA,EACA,SAAS;AAAA,OACH;AACP,SAAS,cAAc,qBAAqB;AAC5C,SAAS,aAAa,iBAAiB;AAmDnC;AAzCW,SAAR,qBAAuC,EAAE,aAAa,GAAI;AAChE,QAAM,EAAE,YAAY,IAAI,YAAa,gBAAiB;AAGtD,QAAM,EAAE,mBAAmB,aAAa,IAAI;AAAA,IAC3C,CAAE,WAAY;AACb,UAAK,CAAE,cAAe;AACrB,eAAO;AAAA,UACN,mBAAmB;AAAA,UACnB,cAAc;AAAA,QACf;AAAA,MACD;AACA,YAAM,EAAE,UAAU,IAAI,OAAQ,gBAAiB;AAC/C,YAAM,cAAc,UAAW,YAAa;AAC5C,YAAM,YAAY,YAAY;AAAA,QAC7B,CAAE,UAAW,MAAM,SAAS;AAAA,MAC7B;AACA,aAAO;AAAA,QACN,mBAAmB,WAAW,YAAY;AAAA,QAC1C,eAAgB,WAAW,YAAY,UAAU,KAAM;AAAA,MACxD;AAAA,IACD;AAAA,IACA,CAAE,YAAa;AAAA,EAChB;AAEA,QAAM,SAAS,MAAM;AACpB,QAAK,CAAE,mBAAoB;AAC1B;AAAA,IACD;AACA,UAAM,cAAc,YAAa,YAAY;AAAA,MAC5C,QAAQ,SAAS;AAAA;AAAA,MAEjB,OAAO,QAAS,GAAI,QAAS,GAAG,YAAa;AAAA,IAC9C,CAAE;AACF,gBAAa,aAAa,QAAW,iBAAkB;AAAA,EAExD;AAEA,SACC,oBAAC,iBAAc,OAAM,SACpB,8BAAC,gBACA;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,OAAQ,GAAI,eAAgB;AAAA,MAC5B,SAAU;AAAA,MACV,aAAW;AAAA,MACX,MAAO,GAAI,SAAU;AAAA;AAAA,EACtB,GACD,GACD;AAEF;",
   "names": []
 }

package/build-module/tab/block.json

@@ -14,11 +14,25 @@
 			"default": ""
 		}
 	},
-	"parent": [ "core/tabs" ],
+	"parent": [
+		"core/tab-panels"
+	],
+	"usesContext": [
+		"core/tabs-activeTabIndex",
+		"core/tabs-editorActiveTabIndex"
+	],
 	"supports": {
 		"anchor": true,
 		"html": false,
 		"reusable": false,
+		"color": {
+			"background": true,
+			"text": true,
+			"__experimentalDefaultControls": {
+				"background": true,
+				"text": true
+			}
+		},
 		"layout": {
 			"allowSwitching": true,
 			"allowInheriting": false,
@@ -38,9 +52,9 @@
 			"__experimentalDefaultControls": {
 				"fontSize": true,
 				"__experimentalFontFamily": true
-			},
-			"__experimentalSkipSerialization": true
-		}
+			}
+		},
+		"renaming": true
 	},
 	"providesContext": {
 		"core/tab-label": "label"

package/build-module/tab/controls.mjs

@@ -8,6 +8,7 @@ import { __ } from "@wordpress/i18n";
 import { useDispatch } from "@wordpress/data";
 import { decodeEntities } from "@wordpress/html-entities";
 import AddTabToolbarControl from "./add-tab-toolbar-control.mjs";
+import RemoveTabToolbarControl from "./remove-tab-toolbar-control.mjs";
 import slugFromLabel from "./slug-from-label.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 function Controls({
@@ -20,14 +21,9 @@ function Controls({
   const { label } = attributes;
   const { updateBlockAttributes } = useDispatch(blockEditorStore);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      AddTabToolbarControl,
-      {
-        tabsClientId,
-        attributes
-      }
-    ),
-    /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(PanelBody, { title: __("Tab Settings"), children: [
+    /* @__PURE__ */ jsx(AddTabToolbarControl, { tabsClientId }),
+    /* @__PURE__ */ jsx(RemoveTabToolbarControl, { tabsClientId }),
+    /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(PanelBody, { title: __("Settings"), children: [
       /* @__PURE__ */ jsx(
         TextControl,
         {

package/build-module/tab/controls.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/tab/controls.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tInspectorControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { PanelBody, TextControl, ToggleControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport AddTabToolbarControl from './add-tab-toolbar-control';\nimport slugFromLabel from './slug-from-label';\n\nexport default function Controls( {\n\tattributes,\n\tsetAttributes,\n\ttabsClientId,\n\tblockIndex,\n\tisDefaultTab,\n} ) {\n\tconst { label } = attributes;\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\treturn (\n\t\t<>\n\t\t\t<AddTabToolbarControl\n\t\t\t\ttabsClientId={ tabsClientId }\n\t\t\t\tattributes={ attributes }\n\t\t\t/>\n\t\t\t<InspectorControls>\n\t\t\t\t<PanelBody title={ __( 'Tab Settings' ) }>\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\tlabel={ __( 'Tab Label' ) }\n\t\t\t\t\t\tvalue={ decodeEntities( label ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tlabel: value,\n\t\t\t\t\t\t\t\tanchor: slugFromLabel( value, blockIndex ),\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Default Tab' ) }\n\t\t\t\t\t\tchecked={ isDefaultTab }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\t\t\t\t\tactiveTabIndex: value ? blockIndex : 0,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'If toggled, this tab will be selected when the page loads.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
-  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA,SAAS;AAAA,OACH;AACP,SAAS,WAAW,aAAa,qBAAqB;AACtD,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAK/B,OAAO,0BAA0B;AACjC,OAAO,mBAAmB;AAcxB,mBACC,KAKC,YANF;AAZa,SAAR,SAA2B;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,EAAE,MAAM,IAAI;AAElB,QAAM,EAAE,sBAAsB,IAAI,YAAa,gBAAiB;AAEhE,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IACA,oBAAC,qBACA,+BAAC,aAAU,OAAQ,GAAI,cAAe,GACrC;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,WAAY;AAAA,UACxB,OAAQ,eAAgB,KAAM;AAAA,UAC9B,UAAW,CAAE,UAAW;AACvB,0BAAe;AAAA,cACd,OAAO;AAAA,cACP,QAAQ,cAAe,OAAO,UAAW;AAAA,YAC1C,CAAE;AAAA,UACH;AAAA,UACA,uBAAqB;AAAA;AAAA,MACtB;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,aAAc;AAAA,UAC1B,SAAU;AAAA,UACV,UAAW,CAAE,UAAW;AACvB,kCAAuB,cAAc;AAAA,cACpC,gBAAgB,QAAQ,aAAa;AAAA,YACtC,CAAE;AAAA,UACH;AAAA,UACA,MAAO;AAAA,YACN;AAAA,UACD;AAAA;AAAA,MACD;AAAA,OACD,GACD;AAAA,KACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tInspectorControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { PanelBody, TextControl, ToggleControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport AddTabToolbarControl from './add-tab-toolbar-control';\nimport RemoveTabToolbarControl from './remove-tab-toolbar-control';\nimport slugFromLabel from './slug-from-label';\n\nexport default function Controls( {\n\tattributes,\n\tsetAttributes,\n\ttabsClientId,\n\tblockIndex,\n\tisDefaultTab,\n} ) {\n\tconst { label } = attributes;\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\treturn (\n\t\t<>\n\t\t\t<AddTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<RemoveTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<InspectorControls>\n\t\t\t\t<PanelBody title={ __( 'Settings' ) }>\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\tlabel={ __( 'Tab Label' ) }\n\t\t\t\t\t\tvalue={ decodeEntities( label ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tlabel: value,\n\t\t\t\t\t\t\t\tanchor: slugFromLabel( value, blockIndex ),\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Default Tab' ) }\n\t\t\t\t\t\tchecked={ isDefaultTab }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\t\t\t\t\tactiveTabIndex: value ? blockIndex : 0,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'If toggled, this tab will be selected when the page loads.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
+  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA,SAAS;AAAA,OACH;AACP,SAAS,WAAW,aAAa,qBAAqB;AACtD,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAK/B,OAAO,0BAA0B;AACjC,OAAO,6BAA6B;AACpC,OAAO,mBAAmB;AAcxB,mBACC,KAGC,YAJF;AAZa,SAAR,SAA2B;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,EAAE,MAAM,IAAI;AAElB,QAAM,EAAE,sBAAsB,IAAI,YAAa,gBAAiB;AAEhE,SACC,iCACC;AAAA,wBAAC,wBAAqB,cAA8B;AAAA,IACpD,oBAAC,2BAAwB,cAA8B;AAAA,IACvD,oBAAC,qBACA,+BAAC,aAAU,OAAQ,GAAI,UAAW,GACjC;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,WAAY;AAAA,UACxB,OAAQ,eAAgB,KAAM;AAAA,UAC9B,UAAW,CAAE,UAAW;AACvB,0BAAe;AAAA,cACd,OAAO;AAAA,cACP,QAAQ,cAAe,OAAO,UAAW;AAAA,YAC1C,CAAE;AAAA,UACH;AAAA,UACA,uBAAqB;AAAA;AAAA,MACtB;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,aAAc;AAAA,UAC1B,SAAU;AAAA,UACV,UAAW,CAAE,UAAW;AACvB,kCAAuB,cAAc;AAAA,cACpC,gBAAgB,QAAQ,aAAa;AAAA,YACtC,CAAE;AAAA,UACH;AAAA,UACA,MAAO;AAAA,YACN;AAAA,UACD;AAAA;AAAA,MACD;AAAA,OACD,GACD;AAAA,KACD;AAEF;",
   "names": []
 }

package/build-module/tab/edit.mjs

@@ -4,70 +4,35 @@ import { __ } from "@wordpress/i18n";
 import {
   useBlockProps,
   useInnerBlocksProps,
-  getTypographyClassesAndStyles as useTypographyProps,
-  __experimentalUseColorProps as useColorProps,
   store as blockEditorStore
 } from "@wordpress/block-editor";
 import { useSelect, useDispatch } from "@wordpress/data";
-import {
-  useMemo,
-  useRef,
-  useEffect,
-  useCallback,
-  useState
-} from "@wordpress/element";
+import { useMemo, useRef, useEffect } from "@wordpress/element";
 import Controls from "./controls.mjs";
 import slugFromLabel from "./slug-from-label.mjs";
-import TabsList from "./tabs-list.mjs";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 var TEMPLATE = [
   [
     "core/paragraph",
     {
-      placeholder: __("Type / to add a block to tab")
+      placeholder: __("Type / to choose a block")
     }
   ]
 ];
-var { requestAnimationFrame, cancelAnimationFrame } = window;
+var { cancelAnimationFrame } = window;
 function Edit({
   attributes,
   clientId,
+  context,
   isSelected,
   setAttributes,
   __unstableLayoutClassNames: layoutClassNames
 }) {
-  const { selectBlock } = useDispatch(blockEditorStore);
-  const innerBlocksRef = useRef(null);
   const focusRef = useRef();
-  const [isInitialMount, setIsInitialMount] = useState(true);
-  const labelElementRef = useRef(null);
   const { anchor, label } = attributes;
-  const labelRef = useCallback(
-    (node) => {
-      labelElementRef.current = node;
-      if (node && isInitialMount) {
-        const animationId = requestAnimationFrame(() => {
-          if (node) {
-            node.focus();
-          }
-        });
-        focusRef.current = animationId;
-        setIsInitialMount(false);
-      }
-    },
-    [isInitialMount]
-  );
-  useEffect(() => {
-    if (!label && !isInitialMount && labelElementRef.current) {
-      const animationId = requestAnimationFrame(() => {
-        if (labelElementRef.current) {
-          labelElementRef.current.focus();
-        }
-      });
-      focusRef.current = animationId;
-      return () => cancelAnimationFrame(focusRef.current);
-    }
-  }, [label, isInitialMount]);
+  const activeTabIndex = context["core/tabs-activeTabIndex"] ?? 0;
+  const editorActiveTabIndex = context["core/tabs-editorActiveTabIndex"];
+  const effectiveActiveIndex = editorActiveTabIndex ?? activeTabIndex;
   useEffect(() => {
     return () => {
       if (focusRef.current) {
@@ -75,99 +40,74 @@ function Edit({
       }
     };
   }, []);
-  const {
-    blockIndex,
-    hasInnerBlocksSelected,
-    tabsHasSelectedBlock,
-    tabsClientId,
-    tabsAttributes,
-    forceDisplay,
-    isTabsClientSelected,
-    isDefaultTab,
-    siblingTabs
-  } = useSelect(
+  const { blockIndex, hasInnerBlocksSelected, tabsClientId } = useSelect(
     (select) => {
       const {
         getBlockRootClientId,
         getBlockIndex,
-        isBlockSelected,
-        hasSelectedInnerBlock,
-        getBlockAttributes,
-        getBlocks
+        hasSelectedInnerBlock
       } = select(blockEditorStore);
-      const rootClientId = getBlockRootClientId(clientId);
-      const hasTabSelected = hasSelectedInnerBlock(rootClientId, true);
-      const rootAttributes = getBlockAttributes(rootClientId);
-      const { activeTabIndex } = rootAttributes;
-      const _isTabsClientSelected = isBlockSelected(rootClientId);
+      const tabPanelsClientId = getBlockRootClientId(clientId);
+      const _tabsClientId = getBlockRootClientId(tabPanelsClientId);
       const _blockIndex = getBlockIndex(clientId);
-      const _isDefaultTab = activeTabIndex === _blockIndex;
       const _hasInnerBlocksSelected = hasSelectedInnerBlock(
         clientId,
         true
       );
-      const _siblingTabs = getBlocks(rootClientId);
       return {
         blockIndex: _blockIndex,
         hasInnerBlocksSelected: _hasInnerBlocksSelected,
-        tabsClientId: rootClientId,
-        forceDisplay: _isDefaultTab && _isTabsClientSelected,
-        tabsHasSelectedBlock: hasTabSelected,
-        isTabsClientSelected: _isTabsClientSelected,
-        isDefaultTab: _isDefaultTab,
-        tabsAttributes: rootAttributes,
-        siblingTabs: _siblingTabs
+        tabsClientId: _tabsClientId
       };
     },
     [clientId]
   );
+  const { updateBlockAttributes, __unstableMarkNextChangeAsNotPersistent } = useDispatch(blockEditorStore);
+  useEffect(() => {
+    const isTabSelected = isSelected || hasInnerBlocksSelected;
+    if (isTabSelected && tabsClientId && effectiveActiveIndex !== blockIndex) {
+      __unstableMarkNextChangeAsNotPersistent();
+      updateBlockAttributes(tabsClientId, {
+        editorActiveTabIndex: blockIndex
+      });
+    }
+  }, [
+    isSelected,
+    hasInnerBlocksSelected,
+    tabsClientId,
+    effectiveActiveIndex,
+    blockIndex,
+    updateBlockAttributes,
+    __unstableMarkNextChangeAsNotPersistent
+  ]);
+  const isActiveTab = effectiveActiveIndex === blockIndex;
+  const isDefaultTab = activeTabIndex === blockIndex;
   const isSelectedTab = useMemo(() => {
-    if (isSelected || hasInnerBlocksSelected || forceDisplay) {
+    if (isSelected || hasInnerBlocksSelected) {
       return true;
     }
-    if (isDefaultTab && !isTabsClientSelected && !isSelected && !tabsHasSelectedBlock) {
+    if (isActiveTab) {
       return true;
     }
     return false;
-  }, [
-    isSelected,
-    hasInnerBlocksSelected,
-    forceDisplay,
-    isDefaultTab,
-    isTabsClientSelected,
-    tabsHasSelectedBlock
-  ]);
+  }, [isSelected, hasInnerBlocksSelected, isActiveTab]);
   const tabPanelId = useMemo(
     () => anchor || slugFromLabel(label, blockIndex),
     [anchor, label, blockIndex]
   );
   const tabLabelId = useMemo(() => `${tabPanelId}--tab`, [tabPanelId]);
-  const tabItemColorProps = useColorProps(tabsAttributes);
-  const tabContentTypographyProps = useTypographyProps(attributes);
   const blockProps = useBlockProps({
-    hidden: !isSelectedTab
+    hidden: !isSelectedTab,
+    "aria-labelledby": tabLabelId,
+    id: tabPanelId,
+    role: "tabpanel",
+    tabIndex: isSelectedTab ? 0 : -1,
+    className: clsx("wp-block-tab__editor-content", layoutClassNames)
   });
-  const innerBlocksProps = useInnerBlocksProps(
-    {
-      "aria-labelledby": tabLabelId,
-      id: tabPanelId,
-      role: "tabpanel",
-      ref: innerBlocksRef,
-      tabIndex: isSelectedTab ? 0 : -1,
-      className: clsx(
-        tabContentTypographyProps.className,
-        "tabs__tab-editor-content",
-        layoutClassNames
-      ),
-      style: {
-        ...tabContentTypographyProps.style
-      }
-    },
-    {
-      template: TEMPLATE
-    }
-  );
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { ...blockProps, children: [
+  const innerBlocksProps = useInnerBlocksProps(blockProps, {
+    template: TEMPLATE
+  });
+  return /* @__PURE__ */ jsxs("section", { ...innerBlocksProps, children: [
     /* @__PURE__ */ jsx(
       Controls,
       {
@@ -178,28 +118,8 @@ function Edit({
         isDefaultTab
       }
     ),
-    isSelectedTab && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        TabsList,
-        {
-          siblingTabs,
-          currentClientId: clientId,
-          currentBlockIndex: blockIndex,
-          currentLabel: label,
-          tabItemColorProps,
-          onSelectTab: selectBlock,
-          onLabelChange: (value) => setAttributes({
-            label: value,
-            anchor: slugFromLabel(value, blockIndex)
-          }),
-          labelRef,
-          focusRef,
-          labelElementRef
-        }
-      ),
-      /* @__PURE__ */ jsx("section", { ...innerBlocksProps })
-    ] })
-  ] }) });
+    isSelectedTab && innerBlocksProps.children
+  ] });
 }
 export {
   Edit as default

package/build-module/tab/edit.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/tab/edit.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseBlockProps,\n\tuseInnerBlocksProps,\n\tgetTypographyClassesAndStyles as useTypographyProps,\n\t__experimentalUseColorProps as useColorProps,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n\tuseCallback,\n\tuseState,\n} from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport Controls from './controls';\nimport slugFromLabel from './slug-from-label';\nimport TabsList from './tabs-list';\n\nconst TEMPLATE = [\n\t[\n\t\t'core/paragraph',\n\t\t{\n\t\t\tplaceholder: __( 'Type / to add a block to tab' ),\n\t\t},\n\t],\n];\n\nconst { requestAnimationFrame, cancelAnimationFrame } = window;\n\nexport default function Edit( {\n\tattributes,\n\tclientId,\n\tisSelected,\n\tsetAttributes,\n\t__unstableLayoutClassNames: layoutClassNames,\n} ) {\n\tconst { selectBlock } = useDispatch( blockEditorStore );\n\n\tconst innerBlocksRef = useRef( null );\n\tconst focusRef = useRef();\n\tconst [ isInitialMount, setIsInitialMount ] = useState( true );\n\tconst labelElementRef = useRef( null );\n\n\tconst { anchor, label } = attributes;\n\n\t// Callback ref that stores the element and focuses on initial mount.\n\tconst labelRef = useCallback(\n\t\t( node ) => {\n\t\t\tlabelElementRef.current = node;\n\t\t\tif ( node && isInitialMount ) {\n\t\t\t\t// Focus immediately when ref is set on initial mount.\n\t\t\t\tconst animationId = requestAnimationFrame( () => {\n\t\t\t\t\tif ( node ) {\n\t\t\t\t\t\tnode.focus();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tfocusRef.current = animationId;\n\t\t\t\tsetIsInitialMount( false );\n\t\t\t}\n\t\t},\n\t\t[ isInitialMount ]\n\t);\n\n\t// Focus the label RichText component when no label exists (after initial mount).\n\tuseEffect( () => {\n\t\tif ( ! label && ! isInitialMount && labelElementRef.current ) {\n\t\t\tconst animationId = requestAnimationFrame( () => {\n\t\t\t\tif ( labelElementRef.current ) {\n\t\t\t\t\tlabelElementRef.current.focus();\n\t\t\t\t}\n\t\t\t} );\n\t\t\tfocusRef.current = animationId;\n\t\t\treturn () => cancelAnimationFrame( focusRef.current );\n\t\t}\n\t}, [ label, isInitialMount ] );\n\n\t// Clean up animation frames on unmount.\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( focusRef.current ) {\n\t\t\t\tcancelAnimationFrame( focusRef.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\tconst {\n\t\tblockIndex,\n\t\thasInnerBlocksSelected,\n\t\ttabsHasSelectedBlock,\n\t\ttabsClientId,\n\t\ttabsAttributes,\n\t\tforceDisplay,\n\t\tisTabsClientSelected,\n\t\tisDefaultTab,\n\t\tsiblingTabs,\n\t} = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockIndex,\n\t\t\t\tisBlockSelected,\n\t\t\t\thasSelectedInnerBlock,\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetBlocks,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\t// Get data from core/tabs.\n\t\t\tconst rootClientId = getBlockRootClientId( clientId );\n\t\t\tconst hasTabSelected = hasSelectedInnerBlock( rootClientId, true );\n\t\t\tconst rootAttributes = getBlockAttributes( rootClientId );\n\t\t\tconst { activeTabIndex } = rootAttributes;\n\t\t\tconst _isTabsClientSelected = isBlockSelected( rootClientId );\n\n\t\t\t// Get data about this instance of core/tab.\n\t\t\tconst _blockIndex = getBlockIndex( clientId );\n\t\t\tconst _isDefaultTab = activeTabIndex === _blockIndex;\n\t\t\tconst _hasInnerBlocksSelected = hasSelectedInnerBlock(\n\t\t\t\tclientId,\n\t\t\t\ttrue\n\t\t\t);\n\n\t\t\t// Get all sibling tabs from parent.\n\t\t\tconst _siblingTabs = getBlocks( rootClientId );\n\n\t\t\treturn {\n\t\t\t\tblockIndex: _blockIndex,\n\t\t\t\thasInnerBlocksSelected: _hasInnerBlocksSelected,\n\t\t\t\ttabsClientId: rootClientId,\n\t\t\t\tforceDisplay: _isDefaultTab && _isTabsClientSelected,\n\t\t\t\ttabsHasSelectedBlock: hasTabSelected,\n\t\t\t\tisTabsClientSelected: _isTabsClientSelected,\n\t\t\t\tisDefaultTab: _isDefaultTab,\n\t\t\t\ttabsAttributes: rootAttributes,\n\t\t\t\tsiblingTabs: _siblingTabs,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\t/**\n\t * This hook determines if the current tab is selected. This is true if it is the active tab, or if it is selected directly.\n\t */\n\tconst isSelectedTab = useMemo( () => {\n\t\tif ( isSelected || hasInnerBlocksSelected || forceDisplay ) {\n\t\t\treturn true;\n\t\t}\n\t\tif (\n\t\t\tisDefaultTab &&\n\t\t\t! isTabsClientSelected &&\n\t\t\t! isSelected &&\n\t\t\t! tabsHasSelectedBlock\n\t\t) {\n\t\t\treturn true;\n\t\t}\n\t\treturn false;\n\t}, [\n\t\tisSelected,\n\t\thasInnerBlocksSelected,\n\t\tforceDisplay,\n\t\tisDefaultTab,\n\t\tisTabsClientSelected,\n\t\ttabsHasSelectedBlock,\n\t] );\n\n\t// Use a custom anchor, if set. Otherwise fall back to the slug generated from the label text.\n\tconst tabPanelId = useMemo(\n\t\t() => anchor || slugFromLabel( label, blockIndex ),\n\t\t[ anchor, label, blockIndex ]\n\t);\n\tconst tabLabelId = useMemo( () => `${ tabPanelId }--tab`, [ tabPanelId ] );\n\n\tconst tabItemColorProps = useColorProps( tabsAttributes );\n\tconst tabContentTypographyProps = useTypographyProps( attributes );\n\n\tconst blockProps = useBlockProps( {\n\t\thidden: ! isSelectedTab,\n\t} );\n\n\tconst innerBlocksProps = useInnerBlocksProps(\n\t\t{\n\t\t\t'aria-labelledby': tabLabelId,\n\t\t\tid: tabPanelId,\n\t\t\trole: 'tabpanel',\n\t\t\tref: innerBlocksRef,\n\t\t\ttabIndex: isSelectedTab ? 0 : -1,\n\t\t\tclassName: clsx(\n\t\t\t\ttabContentTypographyProps.className,\n\t\t\t\t'tabs__tab-editor-content',\n\t\t\t\tlayoutClassNames\n\t\t\t),\n\t\t\tstyle: {\n\t\t\t\t...tabContentTypographyProps.style,\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\ttemplate: TEMPLATE,\n\t\t}\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<Controls\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\ttabsClientId={ tabsClientId }\n\t\t\t\t\tblockIndex={ blockIndex }\n\t\t\t\t\tisDefaultTab={ isDefaultTab }\n\t\t\t\t/>\n\t\t\t\t{ isSelectedTab && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<TabsList\n\t\t\t\t\t\t\tsiblingTabs={ siblingTabs }\n\t\t\t\t\t\t\tcurrentClientId={ clientId }\n\t\t\t\t\t\t\tcurrentBlockIndex={ blockIndex }\n\t\t\t\t\t\t\tcurrentLabel={ label }\n\t\t\t\t\t\t\ttabItemColorProps={ tabItemColorProps }\n\t\t\t\t\t\t\tonSelectTab={ selectBlock }\n\t\t\t\t\t\t\tonLabelChange={ ( value ) =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tlabel: value,\n\t\t\t\t\t\t\t\t\tanchor: slugFromLabel( value, blockIndex ),\n\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tlabelRef={ labelRef }\n\t\t\t\t\t\t\tfocusRef={ focusRef }\n\t\t\t\t\t\t\tlabelElementRef={ labelElementRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<section { ...innerBlocksProps } />\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseBlockProps,\n\tuseInnerBlocksProps,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useMemo, useRef, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Controls from './controls';\nimport slugFromLabel from './slug-from-label';\n\nconst TEMPLATE = [\n\t[\n\t\t'core/paragraph',\n\t\t{\n\t\t\tplaceholder: __( 'Type / to choose a block' ),\n\t\t},\n\t],\n];\n\nconst { cancelAnimationFrame } = window;\n\nexport default function Edit( {\n\tattributes,\n\tclientId,\n\tcontext,\n\tisSelected,\n\tsetAttributes,\n\t__unstableLayoutClassNames: layoutClassNames,\n} ) {\n\tconst focusRef = useRef();\n\n\tconst { anchor, label } = attributes;\n\n\t// Consume tab indices from context\n\tconst activeTabIndex = context[ 'core/tabs-activeTabIndex' ] ?? 0;\n\tconst editorActiveTabIndex = context[ 'core/tabs-editorActiveTabIndex' ];\n\tconst effectiveActiveIndex = editorActiveTabIndex ?? activeTabIndex;\n\n\t// Clean up animation frames on unmount.\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( focusRef.current ) {\n\t\t\t\tcancelAnimationFrame( focusRef.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\tconst { blockIndex, hasInnerBlocksSelected, tabsClientId } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetBlockIndex,\n\t\t\t\thasSelectedInnerBlock,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\t// Get the tab-panels parent first\n\t\t\tconst tabPanelsClientId = getBlockRootClientId( clientId );\n\t\t\t// Then get the tabs parent\n\t\t\tconst _tabsClientId = getBlockRootClientId( tabPanelsClientId );\n\n\t\t\t// Get data about this instance of core/tab.\n\t\t\tconst _blockIndex = getBlockIndex( clientId );\n\t\t\tconst _hasInnerBlocksSelected = hasSelectedInnerBlock(\n\t\t\t\tclientId,\n\t\t\t\ttrue\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tblockIndex: _blockIndex,\n\t\t\t\thasInnerBlocksSelected: _hasInnerBlocksSelected,\n\t\t\t\ttabsClientId: _tabsClientId,\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst { updateBlockAttributes, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\t// Sync editorActiveTabIndex when this tab is selected directly\n\tuseEffect( () => {\n\t\t// Only update if this tab is selected and not already the active index\n\t\tconst isTabSelected = isSelected || hasInnerBlocksSelected;\n\t\tif (\n\t\t\tisTabSelected &&\n\t\t\ttabsClientId &&\n\t\t\teffectiveActiveIndex !== blockIndex\n\t\t) {\n\t\t\t// Mark as non-persistent so it doesn't add to undo history\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: blockIndex,\n\t\t\t} );\n\t\t}\n\t}, [\n\t\tisSelected,\n\t\thasInnerBlocksSelected,\n\t\ttabsClientId,\n\t\teffectiveActiveIndex,\n\t\tblockIndex,\n\t\tupdateBlockAttributes,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t] );\n\n\t// Determine if this is the currently active tab (for editor visibility)\n\tconst isActiveTab = effectiveActiveIndex === blockIndex;\n\n\t// Determine if this is the default tab (for the \"Default Tab\" toggle in controls)\n\tconst isDefaultTab = activeTabIndex === blockIndex;\n\n\t/**\n\t * This hook determines if the current tab panel should be visible.\n\t * This is true if it is the editor active tab, or if it is selected directly.\n\t */\n\tconst isSelectedTab = useMemo( () => {\n\t\t// Show if this tab is directly selected or has selected inner blocks\n\t\tif ( isSelected || hasInnerBlocksSelected ) {\n\t\t\treturn true;\n\t\t}\n\t\t// Always show the active tab (at effectiveActiveIndex) regardless of other selection state.\n\t\t// This ensures the tab panel remains visible when editing labels in tabs-menu.\n\t\tif ( isActiveTab ) {\n\t\t\treturn true;\n\t\t}\n\t\treturn false;\n\t}, [ isSelected, hasInnerBlocksSelected, isActiveTab ] );\n\n\t// Use a custom anchor, if set. Otherwise fall back to the slug generated from the label text.\n\tconst tabPanelId = useMemo(\n\t\t() => anchor || slugFromLabel( label, blockIndex ),\n\t\t[ anchor, label, blockIndex ]\n\t);\n\tconst tabLabelId = useMemo( () => `${ tabPanelId }--tab`, [ tabPanelId ] );\n\n\tconst blockProps = useBlockProps( {\n\t\thidden: ! isSelectedTab,\n\t\t'aria-labelledby': tabLabelId,\n\t\tid: tabPanelId,\n\t\trole: 'tabpanel',\n\t\ttabIndex: isSelectedTab ? 0 : -1,\n\t\tclassName: clsx( 'wp-block-tab__editor-content', layoutClassNames ),\n\t} );\n\n\tconst innerBlocksProps = useInnerBlocksProps( blockProps, {\n\t\ttemplate: TEMPLATE,\n\t} );\n\n\treturn (\n\t\t<section { ...innerBlocksProps }>\n\t\t\t<Controls\n\t\t\t\tattributes={ attributes }\n\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\ttabsClientId={ tabsClientId }\n\t\t\t\tblockIndex={ blockIndex }\n\t\t\t\tisDefaultTab={ isDefaultTab }\n\t\t\t/>\n\t\t\t{ isSelectedTab && innerBlocksProps.children }\n\t\t</section>\n\t);\n}\n"],
+  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,UAAU;AACnB;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AAAA,OACH;AACP,SAAS,WAAW,mBAAmB;AACvC,SAAS,SAAS,QAAQ,iBAAiB;AAK3C,OAAO,cAAc;AACrB,OAAO,mBAAmB;AA4IxB,SACC,KADD;AA1IF,IAAM,WAAW;AAAA,EAChB;AAAA,IACC;AAAA,IACA;AAAA,MACC,aAAa,GAAI,0BAA2B;AAAA,IAC7C;AAAA,EACD;AACD;AAEA,IAAM,EAAE,qBAAqB,IAAI;AAElB,SAAR,KAAuB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,4BAA4B;AAC7B,GAAI;AACH,QAAM,WAAW,OAAO;AAExB,QAAM,EAAE,QAAQ,MAAM,IAAI;AAG1B,QAAM,iBAAiB,QAAS,0BAA2B,KAAK;AAChE,QAAM,uBAAuB,QAAS,gCAAiC;AACvE,QAAM,uBAAuB,wBAAwB;AAGrD,YAAW,MAAM;AAChB,WAAO,MAAM;AACZ,UAAK,SAAS,SAAU;AACvB,6BAAsB,SAAS,OAAQ;AAAA,MACxC;AAAA,IACD;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,QAAM,EAAE,YAAY,wBAAwB,aAAa,IAAI;AAAA,IAC5D,CAAE,WAAY;AACb,YAAM;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,MACD,IAAI,OAAQ,gBAAiB;AAG7B,YAAM,oBAAoB,qBAAsB,QAAS;AAEzD,YAAM,gBAAgB,qBAAsB,iBAAkB;AAG9D,YAAM,cAAc,cAAe,QAAS;AAC5C,YAAM,0BAA0B;AAAA,QAC/B;AAAA,QACA;AAAA,MACD;AAEA,aAAO;AAAA,QACN,YAAY;AAAA,QACZ,wBAAwB;AAAA,QACxB,cAAc;AAAA,MACf;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAEA,QAAM,EAAE,uBAAuB,wCAAwC,IACtE,YAAa,gBAAiB;AAG/B,YAAW,MAAM;AAEhB,UAAM,gBAAgB,cAAc;AACpC,QACC,iBACA,gBACA,yBAAyB,YACxB;AAED,8CAAwC;AACxC,4BAAuB,cAAc;AAAA,QACpC,sBAAsB;AAAA,MACvB,CAAE;AAAA,IACH;AAAA,EACD,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAGF,QAAM,cAAc,yBAAyB;AAG7C,QAAM,eAAe,mBAAmB;AAMxC,QAAM,gBAAgB,QAAS,MAAM;AAEpC,QAAK,cAAc,wBAAyB;AAC3C,aAAO;AAAA,IACR;AAGA,QAAK,aAAc;AAClB,aAAO;AAAA,IACR;AACA,WAAO;AAAA,EACR,GAAG,CAAE,YAAY,wBAAwB,WAAY,CAAE;AAGvD,QAAM,aAAa;AAAA,IAClB,MAAM,UAAU,cAAe,OAAO,UAAW;AAAA,IACjD,CAAE,QAAQ,OAAO,UAAW;AAAA,EAC7B;AACA,QAAM,aAAa,QAAS,MAAM,GAAI,UAAW,SAAS,CAAE,UAAW,CAAE;AAEzE,QAAM,aAAa,cAAe;AAAA,IACjC,QAAQ,CAAE;AAAA,IACV,mBAAmB;AAAA,IACnB,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,UAAU,gBAAgB,IAAI;AAAA,IAC9B,WAAW,KAAM,gCAAgC,gBAAiB;AAAA,EACnE,CAAE;AAEF,QAAM,mBAAmB,oBAAqB,YAAY;AAAA,IACzD,UAAU;AAAA,EACX,CAAE;AAEF,SACC,qBAAC,aAAU,GAAG,kBACb;AAAA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IACE,iBAAiB,iBAAiB;AAAA,KACrC;AAEF;",
   "names": []
 }

package/build-module/tab/remove-tab-toolbar-control.mjs

@@ -0,0 +1,73 @@
+// packages/block-library/src/tab/remove-tab-toolbar-control.js
+import {
+  BlockControls,
+  store as blockEditorStore
+} from "@wordpress/block-editor";
+import { ToolbarGroup, ToolbarButton } from "@wordpress/components";
+import { __ } from "@wordpress/i18n";
+import { useDispatch, useSelect } from "@wordpress/data";
+import { jsx } from "react/jsx-runtime";
+function RemoveTabToolbarControl({ tabsClientId }) {
+  const {
+    removeBlock,
+    updateBlockAttributes,
+    selectBlock,
+    __unstableMarkNextChangeAsNotPersistent
+  } = useDispatch(blockEditorStore);
+  const { activeTabClientId, tabCount, editorActiveTabIndex } = useSelect(
+    (select) => {
+      if (!tabsClientId) {
+        return {
+          activeTabClientId: null,
+          tabCount: 0,
+          editorActiveTabIndex: 0
+        };
+      }
+      const { getBlocks, getBlockAttributes } = select(blockEditorStore);
+      const tabsAttributes = getBlockAttributes(tabsClientId);
+      const activeIndex = tabsAttributes?.editorActiveTabIndex ?? tabsAttributes?.activeTabIndex ?? 0;
+      const innerBlocks = getBlocks(tabsClientId);
+      const tabPanels = innerBlocks.find(
+        (block) => block.name === "core/tab-panels"
+      );
+      const tabs = tabPanels?.innerBlocks || [];
+      const activeTab = tabs[activeIndex];
+      return {
+        activeTabClientId: activeTab?.clientId || null,
+        tabCount: tabs.length,
+        editorActiveTabIndex: activeIndex
+      };
+    },
+    [tabsClientId]
+  );
+  const removeTab = () => {
+    if (!activeTabClientId || tabCount <= 1) {
+      return;
+    }
+    const newActiveIndex = editorActiveTabIndex >= tabCount - 1 ? tabCount - 2 : editorActiveTabIndex;
+    __unstableMarkNextChangeAsNotPersistent();
+    updateBlockAttributes(tabsClientId, {
+      editorActiveTabIndex: newActiveIndex
+    });
+    removeBlock(activeTabClientId, false);
+    if (tabsClientId) {
+      selectBlock(tabsClientId);
+    }
+  };
+  const isDisabled = tabCount <= 1 || !activeTabClientId;
+  return /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(ToolbarGroup, { children: /* @__PURE__ */ jsx(
+    ToolbarButton,
+    {
+      className: "components-toolbar__control",
+      label: __("Remove the current tab"),
+      onClick: removeTab,
+      showTooltip: true,
+      text: __("Remove Tab"),
+      disabled: isDisabled
+    }
+  ) }) });
+}
+export {
+  RemoveTabToolbarControl as default
+};
+//# sourceMappingURL=remove-tab-toolbar-control.mjs.map