@wordpress/editor 14.40.2-next.v.202602271551.0 → 14.40.2

package/build/components/post-revisions-preview/revisions-canvas.cjs

@@ -36,7 +36,6 @@ module.exports = __toCommonJS(revisions_canvas_exports);
 var import_clsx = __toESM(require("clsx"));
 var import_components = require("@wordpress/components");
 var import_block_editor = require("@wordpress/block-editor");
-var import_blocks = require("@wordpress/blocks");
 var import_data = require("@wordpress/data");
 var import_element = require("@wordpress/element");
 var import_hooks = require("@wordpress/hooks");
@@ -45,12 +44,8 @@ var import_store = require("../../store/index.cjs");
 var import_visual_editor = __toESM(require("../visual-editor/index.cjs"));
 var import_diff_format_types = require("./diff-format-types.cjs");
 var import_diff_markers = require("./diff-markers.cjs");
-var import_preserve_client_ids = require("./preserve-client-ids.cjs");
-var import_block_diff = require("./block-diff.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
-var { ExperimentalBlockEditorProvider, usePrivateStyleOverride } = (0, import_lock_unlock.unlock)(
-  import_block_editor.privateApis
-);
+var { usePrivateStyleOverride } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
 var REVISION_REMOVED_FILTER_SVG = `
 <svg
 	xmlns="http://www.w3.org/2000/svg"
@@ -77,14 +72,20 @@ var REVISION_REMOVED_FILTER_SVG = `
 var REVISION_DIFF_STYLES = `
 	.is-revision-added {
 		box-shadow: inset 0 0 0 9999px color-mix(in srgb, currentColor 5%, #00a32a 15%), 0 0 0 4px color-mix(in srgb, currentColor 5%, #00a32a 15%);
+		outline: 3px solid #00a32a;
+		outline-offset: 2px;
 	}
 	.is-revision-removed,
 	.revision-diff-removed {
 		text-decoration: line-through;
 		filter: url(#revision-removed-filter);
 	}
+	.is-revision-removed {
+		outline: 3px dashed #d63638;
+		outline-offset: 2px;
+	}
 	.is-revision-modified {
-		outline: 2px solid color-mix(in srgb, currentColor 30%, #dba617 70%) !important;
+		outline: 3px dotted #9a7000 !important;
 		outline-offset: 2px;
 	}
 	.revision-diff-added {
@@ -107,7 +108,7 @@ var REVISION_DIFF_STYLES = `
 function withRevisionDiffClasses(BlockListBlock) {
   return (props) => {
     const { block, className } = props;
-    const diffStatus = block?.__revisionDiffStatus;
+    const diffStatus = block?.__revisionDiffStatus?.status;
     const enhancedClassName = (0, import_clsx.default)(className, {
       "is-revision-added": diffStatus === "added",
       "is-revision-removed": diffStatus === "removed",
@@ -135,68 +136,23 @@ function CanvasContent({ showDiff }) {
     showDiff && diffMarkers
   ] });
 }
-function RevisionsCanvas({ showDiff }) {
+function RevisionsCanvas() {
   (0, import_element.useEffect)(() => {
     (0, import_diff_format_types.registerDiffFormatTypes)();
     return () => {
       (0, import_diff_format_types.unregisterDiffFormatTypes)();
     };
   }, []);
-  const { revision, previousRevision, postType, blockEditorSettings } = (0, import_data.useSelect)((select) => {
-    const {
-      getCurrentRevision,
-      getPreviousRevision,
-      getCurrentPostType
-    } = (0, import_lock_unlock.unlock)(select(import_store.store));
+  const { revision, showDiff } = (0, import_data.useSelect)((select) => {
+    const { getCurrentRevision, isShowingRevisionDiff } = (0, import_lock_unlock.unlock)(
+      select(import_store.store)
+    );
     return {
       revision: getCurrentRevision(),
-      previousRevision: getPreviousRevision(),
-      postType: getCurrentPostType(),
-      blockEditorSettings: select(import_block_editor.store).getSettings()
+      showDiff: isShowingRevisionDiff()
     };
   }, []);
-  const previousBlocksRef = (0, import_element.useRef)([]);
-  const blocks = (0, import_element.useMemo)(() => {
-    const currentContent = revision?.content?.raw ?? "";
-    let parsedBlocks;
-    if (showDiff) {
-      const previousContent = previousRevision?.content?.raw || "";
-      parsedBlocks = (0, import_block_diff.diffRevisionContent)(
-        currentContent,
-        previousContent
-      );
-    } else {
-      parsedBlocks = (0, import_blocks.parse)(currentContent);
-    }
-    if (postType === "wp_navigation") {
-      parsedBlocks = [
-        (0, import_blocks.createBlock)(
-          "core/navigation",
-          { templateLock: false },
-          parsedBlocks
-        )
-      ];
-    }
-    const blocksWithStableIds = (0, import_preserve_client_ids.preserveClientIds)(
-      parsedBlocks,
-      previousBlocksRef.current
-    );
-    previousBlocksRef.current = blocksWithStableIds;
-    return blocksWithStableIds;
-  }, [
-    revision?.content?.raw,
-    previousRevision?.content?.raw,
-    postType,
-    showDiff
-  ]);
-  const settings = (0, import_element.useMemo)(
-    () => ({
-      ...blockEditorSettings,
-      isPreviewMode: true
-    }),
-    [blockEditorSettings]
-  );
-  return revision ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ExperimentalBlockEditorProvider, { value: blocks, settings, children: [
+  return revision ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DiffStyleOverrides, { showDiff }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "editor-revisions-canvas__content", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CanvasContent, { showDiff }) })
   ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "editor-revisions-canvas__loading", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) });

package/build/components/post-revisions-preview/revisions-canvas.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/post-revisions-preview/revisions-canvas.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner } from '@wordpress/components';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { createBlock, parse } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport { useEffect, useMemo, useRef } from '@wordpress/element';\nimport { addFilter } from '@wordpress/hooks';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { store as editorStore } from '../../store';\nimport VisualEditor from '../visual-editor';\nimport {\n\tregisterDiffFormatTypes,\n\tunregisterDiffFormatTypes,\n} from './diff-format-types';\nimport { useDiffMarkers } from './diff-markers';\nimport { preserveClientIds } from './preserve-client-ids';\nimport { diffRevisionContent } from './block-diff';\n\nconst { ExperimentalBlockEditorProvider, usePrivateStyleOverride } = unlock(\n\tblockEditorPrivateApis\n);\n\n// SVG filter for removed blocks: grayscale + red tint\nconst REVISION_REMOVED_FILTER_SVG = `\n<svg\n\txmlns=\"http://www.w3.org/2000/svg\"\n\tviewBox=\"0 0 0 0\"\n\twidth=\"0\"\n\theight=\"0\"\n\tfocusable=\"false\"\n\trole=\"none\"\n\taria-hidden=\"true\"\n\tstyle=\"visibility: hidden; position: absolute; left: -9999px; overflow: hidden;\"\n>\n\t<defs>\n\t\t<filter id=\"revision-removed-filter\" x=\"0\" y=\"0\" width=\"100%\" height=\"100%\">\n\t\t\t<!-- Desaturate and add red tint -->\n\t\t\t<feColorMatrix type=\"matrix\"\n\t\t\t\tvalues=\"0.5 0.3 0.2 0 0.15\n\t\t\t\t        0.2 0.2 0.1 0 0\n\t\t\t\t        0.2 0.2 0.1 0 0\n\t\t\t\t        0   0   0   0.8 0\"/>\n\t\t</filter>\n\t</defs>\n</svg>\n`;\n\n/**\n * CSS for revision diff indicators, injected into the iframe.\n * Uses color-mix() to blend diff colors with currentColor for better integration.\n */\nconst REVISION_DIFF_STYLES = `\n\t.is-revision-added {\n\t\tbox-shadow: inset 0 0 0 9999px color-mix(in srgb, currentColor 5%, #00a32a 15%), 0 0 0 4px color-mix(in srgb, currentColor 5%, #00a32a 15%);\n\t}\n\t.is-revision-removed,\n\t.revision-diff-removed {\n\t\ttext-decoration: line-through;\n\t\tfilter: url(#revision-removed-filter);\n\t}\n\t.is-revision-modified {\n\t\toutline: 2px solid color-mix(in srgb, currentColor 30%, #dba617 70%) !important;\n\t\toutline-offset: 2px;\n\t}\n\t.revision-diff-added {\n\t\tbackground-color: color-mix(in srgb, currentColor 5%, #00a32a 15%);\n\t\ttext-decoration: none;\n\t}\n\t.revision-diff-format-added {\n\t\ttext-decoration: underline wavy color-mix(in srgb, currentColor 30%, #00a32a 70%);\n\t\ttext-decoration-thickness: 2px;\n\t}\n\t.revision-diff-format-removed {\n\t\ttext-decoration: underline wavy color-mix(in srgb, currentColor 20%, #d63638 80%);\n\t\ttext-decoration-thickness: 2px;\n\t}\n\t.revision-diff-format-changed {\n\t\ttext-decoration: underline wavy color-mix(in srgb, currentColor 30%, #dba617 70%);\n\t\ttext-decoration-thickness: 2px;\n\t}\n`;\n\n/**\n * Filter to add diff status CSS classes to blocks.\n *\n * @param {Object} BlockListBlock The original block list block component.\n * @return {Function} Enhanced component with diff status classes.\n */\nfunction withRevisionDiffClasses( BlockListBlock ) {\n\treturn ( props ) => {\n\t\tconst { block, className } = props;\n\t\tconst diffStatus = block?.__revisionDiffStatus;\n\n\t\tconst enhancedClassName = clsx( className, {\n\t\t\t'is-revision-added': diffStatus === 'added',\n\t\t\t'is-revision-removed': diffStatus === 'removed',\n\t\t\t'is-revision-modified': diffStatus === 'modified',\n\t\t} );\n\n\t\treturn <BlockListBlock { ...props } className={ enhancedClassName } />;\n\t};\n}\n\nconst FILTER_NAME = 'editor/revisions-canvas/withRevisionDiffClasses';\n\n// Register the filter at module level to ensure it's available before first render.\naddFilter( 'editor.BlockListBlock', FILTER_NAME, withRevisionDiffClasses );\n\n/**\n * Component to inject diff styles via style overrides.\n * Must be rendered inside ExperimentalBlockEditorProvider.\n *\n * @param {Object}  props          Component props.\n * @param {boolean} props.showDiff Whether to show diff highlighting.\n */\nfunction DiffStyleOverrides( { showDiff } ) {\n\tusePrivateStyleOverride( {\n\t\tcss: showDiff ? REVISION_DIFF_STYLES : '',\n\t} );\n\tusePrivateStyleOverride( {\n\t\tassets: showDiff ? REVISION_REMOVED_FILTER_SVG : '',\n\t\t__unstableType: 'svgs',\n\t} );\n\treturn null;\n}\n\nfunction CanvasContent( { showDiff } ) {\n\tconst [ contentRef, diffMarkers ] = useDiffMarkers();\n\treturn (\n\t\t<>\n\t\t\t<VisualEditor contentRef={ contentRef } />\n\t\t\t{ showDiff && diffMarkers }\n\t\t</>\n\t);\n}\n\n/**\n * Canvas component that renders a post revision in read-only mode.\n *\n * @param {Object}  props          Component props.\n * @param {boolean} props.showDiff Whether to show diff highlighting.\n * @return {React.JSX.Element} The revisions canvas component.\n */\nexport default function RevisionsCanvas( { showDiff } ) {\n\tuseEffect( () => {\n\t\tregisterDiffFormatTypes();\n\t\treturn () => {\n\t\t\tunregisterDiffFormatTypes();\n\t\t};\n\t}, [] );\n\n\tconst { revision, previousRevision, postType, blockEditorSettings } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\tgetCurrentRevision,\n\t\t\t\tgetPreviousRevision,\n\t\t\t\tgetCurrentPostType,\n\t\t\t} = unlock( select( editorStore ) );\n\t\t\treturn {\n\t\t\t\trevision: getCurrentRevision(),\n\t\t\t\tpreviousRevision: getPreviousRevision(),\n\t\t\t\tpostType: getCurrentPostType(),\n\t\t\t\tblockEditorSettings: select( blockEditorStore ).getSettings(),\n\t\t\t};\n\t\t}, [] );\n\n\t// Track previously rendered blocks to preserve clientIds between renders.\n\tconst previousBlocksRef = useRef( [] );\n\n\tconst blocks = useMemo( () => {\n\t\tconst currentContent = revision?.content?.raw ?? '';\n\n\t\tlet parsedBlocks;\n\t\tif ( showDiff ) {\n\t\t\tconst previousContent = previousRevision?.content?.raw || '';\n\t\t\t// diffRevisionContent handles both normal diffing and the case\n\t\t\t// where there's no previous revision (oldest revision shows all as added).\n\t\t\tparsedBlocks = diffRevisionContent(\n\t\t\t\tcurrentContent,\n\t\t\t\tpreviousContent\n\t\t\t);\n\t\t} else {\n\t\t\t// When diff is disabled, just parse the current revision content.\n\t\t\tparsedBlocks = parse( currentContent );\n\t\t}\n\n\t\tif ( postType === 'wp_navigation' ) {\n\t\t\tparsedBlocks = [\n\t\t\t\tcreateBlock(\n\t\t\t\t\t'core/navigation',\n\t\t\t\t\t{ templateLock: false },\n\t\t\t\t\tparsedBlocks\n\t\t\t\t),\n\t\t\t];\n\t\t}\n\n\t\t// Preserve clientIds from previous render to prevent React unmount/remount.\n\t\tconst blocksWithStableIds = preserveClientIds(\n\t\t\tparsedBlocks,\n\t\t\tpreviousBlocksRef.current\n\t\t);\n\n\t\t// Update ref for next render.\n\t\tpreviousBlocksRef.current = blocksWithStableIds;\n\n\t\treturn blocksWithStableIds;\n\t}, [\n\t\trevision?.content?.raw,\n\t\tpreviousRevision?.content?.raw,\n\t\tpostType,\n\t\tshowDiff,\n\t] );\n\n\tconst settings = useMemo(\n\t\t() => ( {\n\t\t\t...blockEditorSettings,\n\t\t\tisPreviewMode: true,\n\t\t} ),\n\t\t[ blockEditorSettings ]\n\t);\n\n\treturn revision ? (\n\t\t<ExperimentalBlockEditorProvider value={ blocks } settings={ settings }>\n\t\t\t<DiffStyleOverrides showDiff={ showDiff } />\n\t\t\t<div className=\"editor-revisions-canvas__content\">\n\t\t\t\t<CanvasContent showDiff={ showDiff } />\n\t\t\t</div>\n\t\t</ExperimentalBlockEditorProvider>\n\t) : (\n\t\t<div className=\"editor-revisions-canvas__loading\">\n\t\t\t<Spinner />\n\t\t</div>\n\t);\n}\n"],
-  "mappings": "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",
-  "names": ["blockEditorPrivateApis", "clsx", "VisualEditor", "editorStore", "blockEditorStore"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner } from '@wordpress/components';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport { addFilter } from '@wordpress/hooks';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { store as editorStore } from '../../store';\nimport VisualEditor from '../visual-editor';\nimport {\n\tregisterDiffFormatTypes,\n\tunregisterDiffFormatTypes,\n} from './diff-format-types';\nimport { useDiffMarkers } from './diff-markers';\n\nconst { usePrivateStyleOverride } = unlock( blockEditorPrivateApis );\n\n// SVG filter for removed blocks: grayscale + red tint\nconst REVISION_REMOVED_FILTER_SVG = `\n<svg\n\txmlns=\"http://www.w3.org/2000/svg\"\n\tviewBox=\"0 0 0 0\"\n\twidth=\"0\"\n\theight=\"0\"\n\tfocusable=\"false\"\n\trole=\"none\"\n\taria-hidden=\"true\"\n\tstyle=\"visibility: hidden; position: absolute; left: -9999px; overflow: hidden;\"\n>\n\t<defs>\n\t\t<filter id=\"revision-removed-filter\" x=\"0\" y=\"0\" width=\"100%\" height=\"100%\">\n\t\t\t<!-- Desaturate and add red tint -->\n\t\t\t<feColorMatrix type=\"matrix\"\n\t\t\t\tvalues=\"0.5 0.3 0.2 0 0.15\n\t\t\t\t        0.2 0.2 0.1 0 0\n\t\t\t\t        0.2 0.2 0.1 0 0\n\t\t\t\t        0   0   0   0.8 0\"/>\n\t\t</filter>\n\t</defs>\n</svg>\n`;\n\n/**\n * CSS for revision diff indicators, injected into the iframe.\n * Uses color-mix() to blend diff colors with currentColor for better integration.\n */\nconst REVISION_DIFF_STYLES = `\n\t.is-revision-added {\n\t\tbox-shadow: inset 0 0 0 9999px color-mix(in srgb, currentColor 5%, #00a32a 15%), 0 0 0 4px color-mix(in srgb, currentColor 5%, #00a32a 15%);\n\t\toutline: 3px solid #00a32a;\n\t\toutline-offset: 2px;\n\t}\n\t.is-revision-removed,\n\t.revision-diff-removed {\n\t\ttext-decoration: line-through;\n\t\tfilter: url(#revision-removed-filter);\n\t}\n\t.is-revision-removed {\n\t\toutline: 3px dashed #d63638;\n\t\toutline-offset: 2px;\n\t}\n\t.is-revision-modified {\n\t\toutline: 3px dotted #9a7000 !important;\n\t\toutline-offset: 2px;\n\t}\n\t.revision-diff-added {\n\t\tbackground-color: color-mix(in srgb, currentColor 5%, #00a32a 15%);\n\t\ttext-decoration: none;\n\t}\n\t.revision-diff-format-added {\n\t\ttext-decoration: underline wavy color-mix(in srgb, currentColor 30%, #00a32a 70%);\n\t\ttext-decoration-thickness: 2px;\n\t}\n\t.revision-diff-format-removed {\n\t\ttext-decoration: underline wavy color-mix(in srgb, currentColor 20%, #d63638 80%);\n\t\ttext-decoration-thickness: 2px;\n\t}\n\t.revision-diff-format-changed {\n\t\ttext-decoration: underline wavy color-mix(in srgb, currentColor 30%, #dba617 70%);\n\t\ttext-decoration-thickness: 2px;\n\t}\n`;\n\n/**\n * Filter to add diff status CSS classes to blocks.\n *\n * @param {Object} BlockListBlock The original block list block component.\n * @return {Function} Enhanced component with diff status classes.\n */\nfunction withRevisionDiffClasses( BlockListBlock ) {\n\treturn ( props ) => {\n\t\tconst { block, className } = props;\n\t\tconst diffStatus = block?.__revisionDiffStatus?.status;\n\n\t\tconst enhancedClassName = clsx( className, {\n\t\t\t'is-revision-added': diffStatus === 'added',\n\t\t\t'is-revision-removed': diffStatus === 'removed',\n\t\t\t'is-revision-modified': diffStatus === 'modified',\n\t\t} );\n\n\t\treturn <BlockListBlock { ...props } className={ enhancedClassName } />;\n\t};\n}\n\nconst FILTER_NAME = 'editor/revisions-canvas/withRevisionDiffClasses';\n\n// Register the filter at module level to ensure it's available before first render.\naddFilter( 'editor.BlockListBlock', FILTER_NAME, withRevisionDiffClasses );\n\n/**\n * Component to inject diff styles via style overrides.\n * Must be rendered inside ExperimentalBlockEditorProvider.\n *\n * @param {Object}  props          Component props.\n * @param {boolean} props.showDiff Whether to show diff highlighting.\n */\nfunction DiffStyleOverrides( { showDiff } ) {\n\tusePrivateStyleOverride( {\n\t\tcss: showDiff ? REVISION_DIFF_STYLES : '',\n\t} );\n\tusePrivateStyleOverride( {\n\t\tassets: showDiff ? REVISION_REMOVED_FILTER_SVG : '',\n\t\t__unstableType: 'svgs',\n\t} );\n\treturn null;\n}\n\nfunction CanvasContent( { showDiff } ) {\n\tconst [ contentRef, diffMarkers ] = useDiffMarkers();\n\treturn (\n\t\t<>\n\t\t\t<VisualEditor contentRef={ contentRef } />\n\t\t\t{ showDiff && diffMarkers }\n\t\t</>\n\t);\n}\n\n/**\n * Canvas component that renders a post revision in read-only mode.\n * Block preparation and settings are handled by the parent EditorProvider.\n *\n * @return {React.JSX.Element} The revisions canvas component.\n */\nexport default function RevisionsCanvas() {\n\tuseEffect( () => {\n\t\tregisterDiffFormatTypes();\n\t\treturn () => {\n\t\t\tunregisterDiffFormatTypes();\n\t\t};\n\t}, [] );\n\n\tconst { revision, showDiff } = useSelect( ( select ) => {\n\t\tconst { getCurrentRevision, isShowingRevisionDiff } = unlock(\n\t\t\tselect( editorStore )\n\t\t);\n\t\treturn {\n\t\t\trevision: getCurrentRevision(),\n\t\t\tshowDiff: isShowingRevisionDiff(),\n\t\t};\n\t}, [] );\n\n\treturn revision ? (\n\t\t<>\n\t\t\t<DiffStyleOverrides showDiff={ showDiff } />\n\t\t\t<div className=\"editor-revisions-canvas__content\">\n\t\t\t\t<CanvasContent showDiff={ showDiff } />\n\t\t\t</div>\n\t\t</>\n\t) : (\n\t\t<div className=\"editor-revisions-canvas__loading\">\n\t\t\t<Spinner />\n\t\t</div>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,wBAAwB;AACxB,0BAAsD;AACtD,kBAA0B;AAC1B,qBAA0B;AAC1B,mBAA0B;AAK1B,yBAAuB;AACvB,mBAAqC;AACrC,2BAAyB;AACzB,+BAGO;AACP,0BAA+B;AAuFtB;AArFT,IAAM,EAAE,wBAAwB,QAAI,2BAAQ,oBAAAA,WAAuB;AAGnE,IAAM,8BAA8B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BpC,IAAM,uBAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2C7B,SAAS,wBAAyB,gBAAiB;AAClD,SAAO,CAAE,UAAW;AACnB,UAAM,EAAE,OAAO,UAAU,IAAI;AAC7B,UAAM,aAAa,OAAO,sBAAsB;AAEhD,UAAM,wBAAoB,YAAAC,SAAM,WAAW;AAAA,MAC1C,qBAAqB,eAAe;AAAA,MACpC,uBAAuB,eAAe;AAAA,MACtC,wBAAwB,eAAe;AAAA,IACxC,CAAE;AAEF,WAAO,4CAAC,kBAAiB,GAAG,OAAQ,WAAY,mBAAoB;AAAA,EACrE;AACD;AAEA,IAAM,cAAc;AAAA,IAGpB,wBAAW,yBAAyB,aAAa,uBAAwB;AASzE,SAAS,mBAAoB,EAAE,SAAS,GAAI;AAC3C,0BAAyB;AAAA,IACxB,KAAK,WAAW,uBAAuB;AAAA,EACxC,CAAE;AACF,0BAAyB;AAAA,IACxB,QAAQ,WAAW,8BAA8B;AAAA,IACjD,gBAAgB;AAAA,EACjB,CAAE;AACF,SAAO;AACR;AAEA,SAAS,cAAe,EAAE,SAAS,GAAI;AACtC,QAAM,CAAE,YAAY,WAAY,QAAI,oCAAe;AACnD,SACC,4EACC;AAAA,gDAAC,qBAAAC,SAAA,EAAa,YAA0B;AAAA,IACtC,YAAY;AAAA,KACf;AAEF;AAQe,SAAR,kBAAmC;AACzC,gCAAW,MAAM;AAChB,0DAAwB;AACxB,WAAO,MAAM;AACZ,8DAA0B;AAAA,IAC3B;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,QAAM,EAAE,UAAU,SAAS,QAAI,uBAAW,CAAE,WAAY;AACvD,UAAM,EAAE,oBAAoB,sBAAsB,QAAI;AAAA,MACrD,OAAQ,aAAAC,KAAY;AAAA,IACrB;AACA,WAAO;AAAA,MACN,UAAU,mBAAmB;AAAA,MAC7B,UAAU,sBAAsB;AAAA,IACjC;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,SAAO,WACN,4EACC;AAAA,gDAAC,sBAAmB,UAAsB;AAAA,IAC1C,4CAAC,SAAI,WAAU,oCACd,sDAAC,iBAAc,UAAsB,GACtC;AAAA,KACD,IAEA,4CAAC,SAAI,WAAU,oCACd,sDAAC,6BAAQ,GACV;AAEF;",
+  "names": ["blockEditorPrivateApis", "clsx", "VisualEditor", "editorStore"]
 }

package/build/components/post-revisions-preview/revisions-slider.cjs

@@ -23,81 +23,105 @@ __export(revisions_slider_exports, {
   default: () => revisions_slider_default
 });
 module.exports = __toCommonJS(revisions_slider_exports);
-var import_element = require("@wordpress/element");
 var import_data = require("@wordpress/data");
 var import_components = require("@wordpress/components");
 var import_core_data = require("@wordpress/core-data");
 var import_i18n = require("@wordpress/i18n");
 var import_date = require("@wordpress/date");
+var import_element = require("@wordpress/element");
+var import_icons = require("@wordpress/icons");
 var import_store = require("../../store/index.cjs");
 var import_lock_unlock = require("../../lock-unlock.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
 function RevisionsSlider() {
-  const { revisions, isLoading, currentRevisionId, revisionKey } = (0, import_data.useSelect)(
-    (select) => {
-      const { getCurrentPostId, getCurrentPostType } = select(import_store.store);
-      const { getRevisions, isResolving, getEntityConfig } = select(import_core_data.store);
-      const postId = getCurrentPostId();
-      const postType = getCurrentPostType();
-      if (!postId || !postType) {
-        return {};
-      }
-      const entityConfig = getEntityConfig("postType", postType);
-      const query = { per_page: -1, context: "edit" };
-      return {
-        revisions: getRevisions("postType", postType, postId, query),
-        isLoading: isResolving("getRevisions", [
-          "postType",
-          postType,
-          postId,
-          query
-        ]),
-        currentRevisionId: (0, import_lock_unlock.unlock)(
-          select(import_store.store)
-        ).getCurrentRevisionId(),
-        revisionKey: entityConfig?.revisionKey || "id"
-      };
-    },
-    []
+  const {
+    revisions: rawRevisions,
+    perPage,
+    currentRevisionId,
+    revisionKey,
+    revisionPage,
+    totalRevisions
+  } = (0, import_data.useSelect)((select) => {
+    const {
+      getCurrentRevisionId,
+      getRevisionPage,
+      getPageRevisions,
+      getRevisionsPerPage
+    } = (0, import_lock_unlock.unlock)(select(import_store.store));
+    const postType = select(import_store.store).getCurrentPostType();
+    if (!postType) {
+      return {};
+    }
+    const entityConfig = select(import_core_data.store).getEntityConfig(
+      "postType",
+      postType
+    );
+    const _revisionKey = entityConfig?.revisionKey || "id";
+    const _revisionPage = getRevisionPage();
+    return {
+      revisions: getPageRevisions(_revisionPage),
+      perPage: getRevisionsPerPage(),
+      currentRevisionId: getCurrentRevisionId(),
+      revisionKey: _revisionKey,
+      revisionPage: _revisionPage,
+      totalRevisions: select(import_store.store).getCurrentPostRevisionsCount()
+    };
+  }, []);
+  const { setCurrentRevisionId, setRevisionPage } = (0, import_lock_unlock.unlock)(
+    (0, import_data.useDispatch)(import_store.store)
+  );
+  const isLoading = !rawRevisions;
+  const totalPages = Math.ceil(totalRevisions / perPage) || 1;
+  const revisions = (0, import_element.useMemo)(
+    () => rawRevisions && [...rawRevisions].reverse(),
+    [rawRevisions]
   );
-  const { setCurrentRevisionId } = (0, import_lock_unlock.unlock)((0, import_data.useDispatch)(import_store.store));
-  const sortedRevisions = (0, import_element.useMemo)(() => {
-    return revisions?.slice().sort((a, b) => new Date(a.date) - new Date(b.date)) ?? [];
-  }, [revisions]);
-  const selectedIndex = sortedRevisions.findIndex(
+  const selectedIndex = revisions?.findIndex(
     (r) => r[revisionKey] === currentRevisionId
   );
   const handleSliderChange = (index) => {
-    const revision = sortedRevisions[index];
+    const revision = revisions?.[index];
     if (revision) {
       setCurrentRevisionId(revision[revisionKey]);
     }
   };
   const dateSettings = (0, import_date.getSettings)();
   const renderTooltipContent = (index) => {
-    const revision = sortedRevisions[index];
+    const revision = revisions?.[index];
     if (!revision) {
       return index;
     }
     return (0, import_date.dateI18n)(dateSettings.formats.datetime, revision.date);
   };
-  if (isLoading) {
+  const showPagination = totalPages > 1;
+  if (isLoading && !showPagination) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {});
   }
-  if (!sortedRevisions.length) {
+  if (!isLoading && !revisions?.length) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "editor-revisions-header__no-revisions", children: (0, import_i18n.__)("No revisions found.") });
   }
-  if (sortedRevisions.length === 1) {
+  if (totalRevisions <= 1) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "editor-revisions-header__no-revisions", children: (0, import_i18n.__)("Only one revision found.") });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  const getPageRangeLabel = (page) => {
+    const end = totalRevisions - (page - 1) * perPage;
+    const start = Math.max(1, end - perPage + 1);
+    return (0, import_i18n.sprintf)(
+      /* translators: 1: first revision number, 2: last revision number */
+      (0, import_i18n.__)("Revisions %1$s\u2013%2$s"),
+      start,
+      end
+    );
+  };
+  const sliderOrSpinner = isLoading || selectedIndex === -1 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_components.RangeControl,
     {
       __next40pxDefaultSize: true,
+      "aria-valuetext": renderTooltipContent(selectedIndex),
       className: "editor-revisions-header__slider",
       hideLabelFromVision: true,
       label: (0, import_i18n.__)("Revision"),
-      max: sortedRevisions.length - 1,
+      max: revisions?.length - 1,
       min: 0,
       marks: true,
       onChange: handleSliderChange,
@@ -106,6 +130,45 @@ function RevisionsSlider() {
       withInputField: false
     }
   );
+  if (!showPagination) {
+    return sliderOrSpinner;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalHStack, { spacing: 2, expanded: true, wrap: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_components.Button,
+      {
+        icon: import_icons.chevronLeft,
+        label: revisionPage < totalPages ? getPageRangeLabel(revisionPage + 1) : (0, import_i18n.__)("No older revisions"),
+        onClick: () => setRevisionPage(revisionPage + 1),
+        disabled: isLoading || revisionPage >= totalPages,
+        size: "compact",
+        accessibleWhenDisabled: true
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        style: {
+          flex: 1,
+          minWidth: 0,
+          display: "flex",
+          justifyContent: "center"
+        },
+        children: sliderOrSpinner
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_components.Button,
+      {
+        icon: import_icons.chevronRight,
+        label: revisionPage > 1 ? getPageRangeLabel(revisionPage - 1) : (0, import_i18n.__)("No newer revisions"),
+        onClick: () => setRevisionPage(revisionPage - 1),
+        disabled: isLoading || revisionPage <= 1,
+        size: "compact",
+        accessibleWhenDisabled: true
+      }
+    )
+  ] });
 }
 var revisions_slider_default = RevisionsSlider;
 //# sourceMappingURL=revisions-slider.cjs.map

package/build/components/post-revisions-preview/revisions-slider.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/post-revisions-preview/revisions-slider.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { RangeControl, Spinner } from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __ } from '@wordpress/i18n';\nimport { dateI18n, getSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\n/**\n * Slider component for navigating revisions.\n *\n * @return {React.JSX.Element} The revisions slider component.\n */\nfunction RevisionsSlider() {\n\tconst { revisions, isLoading, currentRevisionId, revisionKey } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getCurrentPostId, getCurrentPostType } =\n\t\t\t\tselect( editorStore );\n\t\t\tconst { getRevisions, isResolving, getEntityConfig } =\n\t\t\t\tselect( coreStore );\n\n\t\t\tconst postId = getCurrentPostId();\n\t\t\tconst postType = getCurrentPostType();\n\n\t\t\tif ( ! postId || ! postType ) {\n\t\t\t\treturn {};\n\t\t\t}\n\n\t\t\tconst entityConfig = getEntityConfig( 'postType', postType );\n\t\t\tconst query = { per_page: -1, context: 'edit' };\n\t\t\treturn {\n\t\t\t\trevisions: getRevisions( 'postType', postType, postId, query ),\n\t\t\t\tisLoading: isResolving( 'getRevisions', [\n\t\t\t\t\t'postType',\n\t\t\t\t\tpostType,\n\t\t\t\t\tpostId,\n\t\t\t\t\tquery,\n\t\t\t\t] ),\n\t\t\t\tcurrentRevisionId: unlock(\n\t\t\t\t\tselect( editorStore )\n\t\t\t\t).getCurrentRevisionId(),\n\t\t\t\trevisionKey: entityConfig?.revisionKey || 'id',\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst { setCurrentRevisionId } = unlock( useDispatch( editorStore ) );\n\n\tconst sortedRevisions = useMemo( () => {\n\t\treturn (\n\t\t\trevisions\n\t\t\t\t?.slice()\n\t\t\t\t.sort( ( a, b ) => new Date( a.date ) - new Date( b.date ) ) ??\n\t\t\t[]\n\t\t);\n\t}, [ revisions ] );\n\n\tconst selectedIndex = sortedRevisions.findIndex(\n\t\t( r ) => r[ revisionKey ] === currentRevisionId\n\t);\n\n\tconst handleSliderChange = ( index ) => {\n\t\tconst revision = sortedRevisions[ index ];\n\t\tif ( revision ) {\n\t\t\tsetCurrentRevisionId( revision[ revisionKey ] );\n\t\t}\n\t};\n\n\t// Format date for tooltip.\n\tconst dateSettings = getDateSettings();\n\tconst renderTooltipContent = ( index ) => {\n\t\tconst revision = sortedRevisions[ index ];\n\t\tif ( ! revision ) {\n\t\t\treturn index;\n\t\t}\n\t\treturn dateI18n( dateSettings.formats.datetime, revision.date );\n\t};\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\tif ( ! sortedRevisions.length ) {\n\t\treturn (\n\t\t\t<span className=\"editor-revisions-header__no-revisions\">\n\t\t\t\t{ __( 'No revisions found.' ) }\n\t\t\t</span>\n\t\t);\n\t}\n\n\tif ( sortedRevisions.length === 1 ) {\n\t\treturn (\n\t\t\t<span className=\"editor-revisions-header__no-revisions\">\n\t\t\t\t{ __( 'Only one revision found.' ) }\n\t\t\t</span>\n\t\t);\n\t}\n\n\treturn (\n\t\t<RangeControl\n\t\t\t__next40pxDefaultSize\n\t\t\tclassName=\"editor-revisions-header__slider\"\n\t\t\thideLabelFromVision\n\t\t\tlabel={ __( 'Revision' ) }\n\t\t\tmax={ sortedRevisions.length - 1 }\n\t\t\tmin={ 0 }\n\t\t\tmarks\n\t\t\tonChange={ handleSliderChange }\n\t\t\trenderTooltipContent={ renderTooltipContent }\n\t\t\tvalue={ selectedIndex }\n\t\t\twithInputField={ false }\n\t\t/>\n\t);\n}\n\nexport default RevisionsSlider;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAwB;AACxB,kBAAuC;AACvC,wBAAsC;AACtC,uBAAmC;AACnC,kBAAmB;AACnB,kBAAyD;AAKzD,mBAAqC;AACrC,yBAAuB;AA0Ed;AAnET,SAAS,kBAAkB;AAC1B,QAAM,EAAE,WAAW,WAAW,mBAAmB,YAAY,QAAI;AAAA,IAChE,CAAE,WAAY;AACb,YAAM,EAAE,kBAAkB,mBAAmB,IAC5C,OAAQ,aAAAA,KAAY;AACrB,YAAM,EAAE,cAAc,aAAa,gBAAgB,IAClD,OAAQ,iBAAAC,KAAU;AAEnB,YAAM,SAAS,iBAAiB;AAChC,YAAM,WAAW,mBAAmB;AAEpC,UAAK,CAAE,UAAU,CAAE,UAAW;AAC7B,eAAO,CAAC;AAAA,MACT;AAEA,YAAM,eAAe,gBAAiB,YAAY,QAAS;AAC3D,YAAM,QAAQ,EAAE,UAAU,IAAI,SAAS,OAAO;AAC9C,aAAO;AAAA,QACN,WAAW,aAAc,YAAY,UAAU,QAAQ,KAAM;AAAA,QAC7D,WAAW,YAAa,gBAAgB;AAAA,UACvC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACD,CAAE;AAAA,QACF,uBAAmB;AAAA,UAClB,OAAQ,aAAAD,KAAY;AAAA,QACrB,EAAE,qBAAqB;AAAA,QACvB,aAAa,cAAc,eAAe;AAAA,MAC3C;AAAA,IACD;AAAA,IACA,CAAC;AAAA,EACF;AAEA,QAAM,EAAE,qBAAqB,QAAI,+BAAQ,yBAAa,aAAAA,KAAY,CAAE;AAEpE,QAAM,sBAAkB,wBAAS,MAAM;AACtC,WACC,WACG,MAAM,EACP,KAAM,CAAE,GAAG,MAAO,IAAI,KAAM,EAAE,IAAK,IAAI,IAAI,KAAM,EAAE,IAAK,CAAE,KAC5D,CAAC;AAAA,EAEH,GAAG,CAAE,SAAU,CAAE;AAEjB,QAAM,gBAAgB,gBAAgB;AAAA,IACrC,CAAE,MAAO,EAAG,WAAY,MAAM;AAAA,EAC/B;AAEA,QAAM,qBAAqB,CAAE,UAAW;AACvC,UAAM,WAAW,gBAAiB,KAAM;AACxC,QAAK,UAAW;AACf,2BAAsB,SAAU,WAAY,CAAE;AAAA,IAC/C;AAAA,EACD;AAGA,QAAM,mBAAe,YAAAE,aAAgB;AACrC,QAAM,uBAAuB,CAAE,UAAW;AACzC,UAAM,WAAW,gBAAiB,KAAM;AACxC,QAAK,CAAE,UAAW;AACjB,aAAO;AAAA,IACR;AACA,eAAO,sBAAU,aAAa,QAAQ,UAAU,SAAS,IAAK;AAAA,EAC/D;AAEA,MAAK,WAAY;AAChB,WAAO,4CAAC,6BAAQ;AAAA,EACjB;AAEA,MAAK,CAAE,gBAAgB,QAAS;AAC/B,WACC,4CAAC,UAAK,WAAU,yCACb,8BAAI,qBAAsB,GAC7B;AAAA,EAEF;AAEA,MAAK,gBAAgB,WAAW,GAAI;AACnC,WACC,4CAAC,UAAK,WAAU,yCACb,8BAAI,0BAA2B,GAClC;AAAA,EAEF;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,uBAAqB;AAAA,MACrB,WAAU;AAAA,MACV,qBAAmB;AAAA,MACnB,WAAQ,gBAAI,UAAW;AAAA,MACvB,KAAM,gBAAgB,SAAS;AAAA,MAC/B,KAAM;AAAA,MACN,OAAK;AAAA,MACL,UAAW;AAAA,MACX;AAAA,MACA,OAAQ;AAAA,MACR,gBAAiB;AAAA;AAAA,EAClB;AAEF;AAEA,IAAO,2BAAQ;",
-  "names": ["editorStore", "coreStore", "getDateSettings"]
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tRangeControl,\n\tSpinner,\n\tButton,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { dateI18n, getSettings as getDateSettings } from '@wordpress/date';\nimport { useMemo } from '@wordpress/element';\nimport { chevronLeft, chevronRight } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\n/**\n * Slider component for navigating revisions with pagination.\n *\n * @return {React.JSX.Element} The revisions slider component.\n */\nfunction RevisionsSlider() {\n\tconst {\n\t\trevisions: rawRevisions,\n\t\tperPage,\n\t\tcurrentRevisionId,\n\t\trevisionKey,\n\t\trevisionPage,\n\t\ttotalRevisions,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetCurrentRevisionId,\n\t\t\tgetRevisionPage,\n\t\t\tgetPageRevisions,\n\t\t\tgetRevisionsPerPage,\n\t\t} = unlock( select( editorStore ) );\n\n\t\tconst postType = select( editorStore ).getCurrentPostType();\n\t\tif ( ! postType ) {\n\t\t\treturn {};\n\t\t}\n\n\t\tconst entityConfig = select( coreStore ).getEntityConfig(\n\t\t\t'postType',\n\t\t\tpostType\n\t\t);\n\t\tconst _revisionKey = entityConfig?.revisionKey || 'id';\n\t\tconst _revisionPage = getRevisionPage();\n\n\t\treturn {\n\t\t\trevisions: getPageRevisions( _revisionPage ),\n\t\t\tperPage: getRevisionsPerPage(),\n\t\t\tcurrentRevisionId: getCurrentRevisionId(),\n\t\t\trevisionKey: _revisionKey,\n\t\t\trevisionPage: _revisionPage,\n\t\t\ttotalRevisions:\n\t\t\t\tselect( editorStore ).getCurrentPostRevisionsCount(),\n\t\t};\n\t}, [] );\n\n\tconst { setCurrentRevisionId, setRevisionPage } = unlock(\n\t\tuseDispatch( editorStore )\n\t);\n\n\tconst isLoading = ! rawRevisions;\n\tconst totalPages = Math.ceil( totalRevisions / perPage ) || 1;\n\n\t// Reverse desc\u2192asc so the slider reads oldest (left) \u2192 newest (right).\n\tconst revisions = useMemo(\n\t\t() => rawRevisions && [ ...rawRevisions ].reverse(),\n\t\t[ rawRevisions ]\n\t);\n\n\tconst selectedIndex = revisions?.findIndex(\n\t\t( r ) => r[ revisionKey ] === currentRevisionId\n\t);\n\n\tconst handleSliderChange = ( index ) => {\n\t\tconst revision = revisions?.[ index ];\n\t\tif ( revision ) {\n\t\t\tsetCurrentRevisionId( revision[ revisionKey ] );\n\t\t}\n\t};\n\n\t// Format date for tooltip.\n\tconst dateSettings = getDateSettings();\n\tconst renderTooltipContent = ( index ) => {\n\t\tconst revision = revisions?.[ index ];\n\t\tif ( ! revision ) {\n\t\t\treturn index;\n\t\t}\n\t\treturn dateI18n( dateSettings.formats.datetime, revision.date );\n\t};\n\n\tconst showPagination = totalPages > 1;\n\n\tif ( isLoading && ! showPagination ) {\n\t\treturn <Spinner />;\n\t}\n\n\tif ( ! isLoading && ! revisions?.length ) {\n\t\treturn (\n\t\t\t<span className=\"editor-revisions-header__no-revisions\">\n\t\t\t\t{ __( 'No revisions found.' ) }\n\t\t\t</span>\n\t\t);\n\t}\n\n\tif ( totalRevisions <= 1 ) {\n\t\treturn (\n\t\t\t<span className=\"editor-revisions-header__no-revisions\">\n\t\t\t\t{ __( 'Only one revision found.' ) }\n\t\t\t</span>\n\t\t);\n\t}\n\n\tconst getPageRangeLabel = ( page ) => {\n\t\tconst end = totalRevisions - ( page - 1 ) * perPage;\n\t\tconst start = Math.max( 1, end - perPage + 1 );\n\t\treturn sprintf(\n\t\t\t/* translators: 1: first revision number, 2: last revision number */\n\t\t\t__( 'Revisions %1$s\u2013%2$s' ),\n\t\t\tstart,\n\t\t\tend\n\t\t);\n\t};\n\n\tconst sliderOrSpinner =\n\t\tisLoading || selectedIndex === -1 ? (\n\t\t\t<Spinner />\n\t\t) : (\n\t\t\t<RangeControl\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\taria-valuetext={ renderTooltipContent( selectedIndex ) }\n\t\t\t\tclassName=\"editor-revisions-header__slider\"\n\t\t\t\thideLabelFromVision\n\t\t\t\tlabel={ __( 'Revision' ) }\n\t\t\t\tmax={ revisions?.length - 1 }\n\t\t\t\tmin={ 0 }\n\t\t\t\tmarks\n\t\t\t\tonChange={ handleSliderChange }\n\t\t\t\trenderTooltipContent={ renderTooltipContent }\n\t\t\t\tvalue={ selectedIndex }\n\t\t\t\twithInputField={ false }\n\t\t\t/>\n\t\t);\n\n\tif ( ! showPagination ) {\n\t\treturn sliderOrSpinner;\n\t}\n\n\treturn (\n\t\t<HStack spacing={ 2 } expanded wrap={ false }>\n\t\t\t<Button\n\t\t\t\ticon={ chevronLeft }\n\t\t\t\tlabel={\n\t\t\t\t\trevisionPage < totalPages\n\t\t\t\t\t\t? getPageRangeLabel( revisionPage + 1 )\n\t\t\t\t\t\t: __( 'No older revisions' )\n\t\t\t\t}\n\t\t\t\tonClick={ () => setRevisionPage( revisionPage + 1 ) }\n\t\t\t\tdisabled={ isLoading || revisionPage >= totalPages }\n\t\t\t\tsize=\"compact\"\n\t\t\t\taccessibleWhenDisabled\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tstyle={ {\n\t\t\t\t\tflex: 1,\n\t\t\t\t\tminWidth: 0,\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ sliderOrSpinner }\n\t\t\t</div>\n\t\t\t<Button\n\t\t\t\ticon={ chevronRight }\n\t\t\t\tlabel={\n\t\t\t\t\trevisionPage > 1\n\t\t\t\t\t\t? getPageRangeLabel( revisionPage - 1 )\n\t\t\t\t\t\t: __( 'No newer revisions' )\n\t\t\t\t}\n\t\t\t\tonClick={ () => setRevisionPage( revisionPage - 1 ) }\n\t\t\t\tdisabled={ isLoading || revisionPage <= 1 }\n\t\t\t\tsize=\"compact\"\n\t\t\t\taccessibleWhenDisabled\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n\nexport default RevisionsSlider;\n"],
+  "mappings": "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",
+  "names": ["editorStore", "coreStore", "getDateSettings", "HStack"]
 }

package/build/components/post-text-editor/index.cjs

@@ -36,6 +36,8 @@ module.exports = __toCommonJS(post_text_editor_exports);
 var import_react_autosize_textarea = __toESM(require("react-autosize-textarea"));
 var import_i18n = require("@wordpress/i18n");
 var import_core_data = require("@wordpress/core-data");
+var import_element = require("@wordpress/element");
+var import_blocks = require("@wordpress/blocks");
 var import_data = require("@wordpress/data");
 var import_compose = require("@wordpress/compose");
 var import_components = require("@wordpress/components");
@@ -43,15 +45,28 @@ var import_store = require("../../store/index.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
 function PostTextEditor() {
   const instanceId = (0, import_compose.useInstanceId)(PostTextEditor);
-  const { value, type, id } = (0, import_data.useSelect)((select) => {
-    const { getCurrentPostType, getCurrentPostId, getEditedPostContent } = select(import_store.store);
+  const { content, blocks, type, id } = (0, import_data.useSelect)((select) => {
+    const { getEditedEntityRecord } = select(import_core_data.store);
+    const { getCurrentPostType, getCurrentPostId } = select(import_store.store);
+    const _type = getCurrentPostType();
+    const _id = getCurrentPostId();
+    const editedRecord = getEditedEntityRecord("postType", _type, _id);
     return {
-      value: getEditedPostContent(),
-      type: getCurrentPostType(),
-      id: getCurrentPostId()
+      content: editedRecord?.content,
+      blocks: editedRecord?.blocks,
+      type: _type,
+      id: _id
     };
   }, []);
   const { editEntityRecord } = (0, import_data.useDispatch)(import_core_data.store);
+  const value = (0, import_element.useMemo)(() => {
+    if (content instanceof Function) {
+      return content({ blocks });
+    } else if (blocks) {
+      return (0, import_blocks.__unstableSerializeAndClean)(blocks);
+    }
+    return content;
+  }, [content, blocks]);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_components.VisuallyHidden,

package/build/components/post-text-editor/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/post-text-editor/index.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport Textarea from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\nimport { VisuallyHidden } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\n\n/**\n * Displays the Post Text Editor along with content in Visual and Text mode.\n *\n * @return {React.ReactNode} The rendered PostTextEditor component.\n */\nexport default function PostTextEditor() {\n\tconst instanceId = useInstanceId( PostTextEditor );\n\tconst { value, type, id } = useSelect( ( select ) => {\n\t\tconst { getCurrentPostType, getCurrentPostId, getEditedPostContent } =\n\t\t\tselect( editorStore );\n\t\treturn {\n\t\t\tvalue: getEditedPostContent(),\n\t\t\ttype: getCurrentPostType(),\n\t\t\tid: getCurrentPostId(),\n\t\t};\n\t}, [] );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\n\treturn (\n\t\t<>\n\t\t\t<VisuallyHidden\n\t\t\t\tas=\"label\"\n\t\t\t\thtmlFor={ `post-content-${ instanceId }` }\n\t\t\t>\n\t\t\t\t{ __( 'Type text or HTML' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<Textarea\n\t\t\t\tautoComplete=\"off\"\n\t\t\t\tdir=\"auto\"\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ ( event ) => {\n\t\t\t\t\teditEntityRecord( 'postType', type, id, {\n\t\t\t\t\t\tcontent: event.target.value,\n\t\t\t\t\t\tblocks: undefined,\n\t\t\t\t\t\tselection: undefined,\n\t\t\t\t\t} );\n\t\t\t\t} }\n\t\t\t\tclassName=\"editor-post-text-editor\"\n\t\t\t\tid={ `post-content-${ instanceId }` }\n\t\t\t\tplaceholder={ __( 'Start writing with text or HTML' ) }\n\t\t\t/>\n\t\t</>\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qCAAqB;AAKrB,kBAAmB;AACnB,uBAAmC;AACnC,kBAAuC;AACvC,qBAA8B;AAC9B,wBAA+B;AAK/B,mBAAqC;AAqBnC;AAda,SAAR,iBAAkC;AACxC,QAAM,iBAAa,8BAAe,cAAe;AACjD,QAAM,EAAE,OAAO,MAAM,GAAG,QAAI,uBAAW,CAAE,WAAY;AACpD,UAAM,EAAE,oBAAoB,kBAAkB,qBAAqB,IAClE,OAAQ,aAAAA,KAAY;AACrB,WAAO;AAAA,MACN,OAAO,qBAAqB;AAAA,MAC5B,MAAM,mBAAmB;AAAA,MACzB,IAAI,iBAAiB;AAAA,IACtB;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,EAAE,iBAAiB,QAAI,yBAAa,iBAAAC,KAAU;AAEpD,SACC,4EACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,IAAG;AAAA,QACH,SAAU,gBAAiB,UAAW;AAAA,QAEpC,8BAAI,mBAAoB;AAAA;AAAA,IAC3B;AAAA,IACA;AAAA,MAAC,+BAAAC;AAAA,MAAA;AAAA,QACA,cAAa;AAAA,QACb,KAAI;AAAA,QACJ;AAAA,QACA,UAAW,CAAE,UAAW;AACvB,2BAAkB,YAAY,MAAM,IAAI;AAAA,YACvC,SAAS,MAAM,OAAO;AAAA,YACtB,QAAQ;AAAA,YACR,WAAW;AAAA,UACZ,CAAE;AAAA,QACH;AAAA,QACA,WAAU;AAAA,QACV,IAAK,gBAAiB,UAAW;AAAA,QACjC,iBAAc,gBAAI,iCAAkC;AAAA;AAAA,IACrD;AAAA,KACD;AAEF;",
-  "names": ["editorStore", "coreStore", "Textarea"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport Textarea from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useMemo } from '@wordpress/element';\nimport { __unstableSerializeAndClean } from '@wordpress/blocks';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\nimport { VisuallyHidden } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\n\n/**\n * Displays the Post Text Editor along with content in Visual and Text mode.\n *\n * @return {React.ReactNode} The rendered PostTextEditor component.\n */\nexport default function PostTextEditor() {\n\tconst instanceId = useInstanceId( PostTextEditor );\n\tconst { content, blocks, type, id } = useSelect( ( select ) => {\n\t\tconst { getEditedEntityRecord } = select( coreStore );\n\t\tconst { getCurrentPostType, getCurrentPostId } = select( editorStore );\n\t\tconst _type = getCurrentPostType();\n\t\tconst _id = getCurrentPostId();\n\t\tconst editedRecord = getEditedEntityRecord( 'postType', _type, _id );\n\n\t\treturn {\n\t\t\tcontent: editedRecord?.content,\n\t\t\tblocks: editedRecord?.blocks,\n\t\t\ttype: _type,\n\t\t\tid: _id,\n\t\t};\n\t}, [] );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\t// Replicates the logic found in getEditedPostContent().\n\tconst value = useMemo( () => {\n\t\tif ( content instanceof Function ) {\n\t\t\treturn content( { blocks } );\n\t\t} else if ( blocks ) {\n\t\t\t// If we have parsed blocks already, they should be our source of truth.\n\t\t\t// Parsing applies block deprecations and legacy block conversions that\n\t\t\t// unparsed content will not have.\n\t\t\treturn __unstableSerializeAndClean( blocks );\n\t\t}\n\t\treturn content;\n\t}, [ content, blocks ] );\n\n\treturn (\n\t\t<>\n\t\t\t<VisuallyHidden\n\t\t\t\tas=\"label\"\n\t\t\t\thtmlFor={ `post-content-${ instanceId }` }\n\t\t\t>\n\t\t\t\t{ __( 'Type text or HTML' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<Textarea\n\t\t\t\tautoComplete=\"off\"\n\t\t\t\tdir=\"auto\"\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ ( event ) => {\n\t\t\t\t\teditEntityRecord( 'postType', type, id, {\n\t\t\t\t\t\tcontent: event.target.value,\n\t\t\t\t\t\tblocks: undefined,\n\t\t\t\t\t\tselection: undefined,\n\t\t\t\t\t} );\n\t\t\t\t} }\n\t\t\t\tclassName=\"editor-post-text-editor\"\n\t\t\t\tid={ `post-content-${ instanceId }` }\n\t\t\t\tplaceholder={ __( 'Start writing with text or HTML' ) }\n\t\t\t/>\n\t\t</>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qCAAqB;AAKrB,kBAAmB;AACnB,uBAAmC;AACnC,qBAAwB;AACxB,oBAA4C;AAC5C,kBAAuC;AACvC,qBAA8B;AAC9B,wBAA+B;AAK/B,mBAAqC;AAsCnC;AA/Ba,SAAR,iBAAkC;AACxC,QAAM,iBAAa,8BAAe,cAAe;AACjD,QAAM,EAAE,SAAS,QAAQ,MAAM,GAAG,QAAI,uBAAW,CAAE,WAAY;AAC9D,UAAM,EAAE,sBAAsB,IAAI,OAAQ,iBAAAA,KAAU;AACpD,UAAM,EAAE,oBAAoB,iBAAiB,IAAI,OAAQ,aAAAC,KAAY;AACrE,UAAM,QAAQ,mBAAmB;AACjC,UAAM,MAAM,iBAAiB;AAC7B,UAAM,eAAe,sBAAuB,YAAY,OAAO,GAAI;AAEnE,WAAO;AAAA,MACN,SAAS,cAAc;AAAA,MACvB,QAAQ,cAAc;AAAA,MACtB,MAAM;AAAA,MACN,IAAI;AAAA,IACL;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,EAAE,iBAAiB,QAAI,yBAAa,iBAAAD,KAAU;AAEpD,QAAM,YAAQ,wBAAS,MAAM;AAC5B,QAAK,mBAAmB,UAAW;AAClC,aAAO,QAAS,EAAE,OAAO,CAAE;AAAA,IAC5B,WAAY,QAAS;AAIpB,iBAAO,2CAA6B,MAAO;AAAA,IAC5C;AACA,WAAO;AAAA,EACR,GAAG,CAAE,SAAS,MAAO,CAAE;AAEvB,SACC,4EACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,IAAG;AAAA,QACH,SAAU,gBAAiB,UAAW;AAAA,QAEpC,8BAAI,mBAAoB;AAAA;AAAA,IAC3B;AAAA,IACA;AAAA,MAAC,+BAAAE;AAAA,MAAA;AAAA,QACA,cAAa;AAAA,QACb,KAAI;AAAA,QACJ;AAAA,QACA,UAAW,CAAE,UAAW;AACvB,2BAAkB,YAAY,MAAM,IAAI;AAAA,YACvC,SAAS,MAAM,OAAO;AAAA,YACtB,QAAQ;AAAA,YACR,WAAW;AAAA,UACZ,CAAE;AAAA,QACH;AAAA,QACA,WAAU;AAAA,QACV,IAAK,gBAAiB,UAAW;AAAA,QACjC,iBAAc,gBAAI,iCAAkC;AAAA;AAAA,IACrD;AAAA,KACD;AAEF;",
+  "names": ["coreStore", "editorStore", "Textarea"]
 }

package/build/components/preferences-modal/index.cjs

@@ -69,13 +69,16 @@ function EditorPreferencesModal({ extraSections = {} }) {
 }
 function PreferencesModalContents({ extraSections = {} }) {
   const isLargeViewport = (0, import_compose.useViewportMatch)("medium");
-  const showBlockBreadcrumbsOption = (0, import_data.useSelect)(
+  const { showBlockBreadcrumbsOption, showCollaborationOptions } = (0, import_data.useSelect)(
     (select) => {
-      const { getEditorSettings } = select(import_store.store);
+      const { getEditorSettings, isCollaborationEnabledForCurrentPost } = (0, import_lock_unlock.unlock)(select(import_store.store));
       const { get } = select(import_preferences.store);
       const isRichEditingEnabled = getEditorSettings().richEditingEnabled;
       const isDistractionFreeEnabled = get("core", "distractionFree");
-      return !isDistractionFreeEnabled && isLargeViewport && isRichEditingEnabled;
+      return {
+        showBlockBreadcrumbsOption: !isDistractionFreeEnabled && isLargeViewport && isRichEditingEnabled,
+        showCollaborationOptions: isCollaborationEnabledForCurrentPost()
+      };
     },
     [isLargeViewport]
   );
@@ -137,7 +140,35 @@ function PreferencesModalContents({ extraSections = {} }) {
                     ),
                     label: (0, import_i18n.__)("Show starter patterns")
                   }
-                )
+                ),
+                showCollaborationOptions && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    PreferenceToggleControl,
+                    {
+                      scope: "core",
+                      featureName: "showCollaborationCursor",
+                      help: (0, import_i18n.__)(
+                        "Show your own avatar inside blocks during collaborative editing sessions."
+                      ),
+                      label: (0, import_i18n.__)(
+                        "Show avatar in blocks"
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    PreferenceToggleControl,
+                    {
+                      scope: "core",
+                      featureName: "showCollaborationNotifications",
+                      help: (0, import_i18n.__)(
+                        "Show notifications when collaborators join, leave, or save the post."
+                      ),
+                      label: (0, import_i18n.__)(
+                        "Show collaboration notifications"
+                      )
+                    }
+                  )
+                ] })
               ]
             }
           ),
@@ -394,6 +425,7 @@ function PreferencesModalContents({ extraSections = {} }) {
     ].filter(Boolean),
     [
       showBlockBreadcrumbsOption,
+      showCollaborationOptions,
       extraSections,
       setIsInserterOpened,
       setIsListViewOpened,