@wordpress/editor 14.30.1-next.836ecdcae.0 → 14.31.0

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+## 14.31.0 (2025-09-17)
+
 ## 14.30.0 (2025-09-03)
 
 ## 14.29.0 (2025-08-20)

package/build/bindings/api.js

@@ -9,6 +9,7 @@ var _blocks = require("@wordpress/blocks");
 var _patternOverrides = _interopRequireDefault(require("./pattern-overrides"));
 var _postData = _interopRequireDefault(require("./post-data"));
 var _postMeta = _interopRequireDefault(require("./post-meta"));
+var _termData = _interopRequireDefault(require("./term-data"));
 /**
  * WordPress dependencies
  */
@@ -31,5 +32,6 @@ function registerCoreBlockBindingsSources() {
   (0, _blocks.registerBlockBindingsSource)(_patternOverrides.default);
   (0, _blocks.registerBlockBindingsSource)(_postData.default);
   (0, _blocks.registerBlockBindingsSource)(_postMeta.default);
+  (0, _blocks.registerBlockBindingsSource)(_termData.default);
 }
 //# sourceMappingURL=api.js.map

package/build/bindings/api.js.map

@@ -1 +1 @@
-{"version":3,"names":["_blocks","require","_patternOverrides","_interopRequireDefault","_postData","_postMeta","registerCoreBlockBindingsSources","registerBlockBindingsSource","patternOverrides","postData","postMeta"],"sources":["@wordpress/editor/src/bindings/api.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { registerBlockBindingsSource } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport patternOverrides from './pattern-overrides';\nimport postData from './post-data';\nimport postMeta from './post-meta';\n\n/**\n * Function to register core block bindings sources provided by the editor.\n *\n * @example\n * ```js\n * import { registerCoreBlockBindingsSources } from '@wordpress/editor';\n *\n * registerCoreBlockBindingsSources();\n * ```\n */\nexport function registerCoreBlockBindingsSources() {\n\tregisterBlockBindingsSource( patternOverrides );\n\tregisterBlockBindingsSource( postData );\n\tregisterBlockBindingsSource( postMeta );\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAKA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,SAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,SAAA,GAAAF,sBAAA,CAAAF,OAAA;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASK,gCAAgCA,CAAA,EAAG;EAClD,IAAAC,mCAA2B,EAAEC,yBAAiB,CAAC;EAC/C,IAAAD,mCAA2B,EAAEE,iBAAS,CAAC;EACvC,IAAAF,mCAA2B,EAAEG,iBAAS,CAAC;AACxC","ignoreList":[]}
+{"version":3,"names":["_blocks","require","_patternOverrides","_interopRequireDefault","_postData","_postMeta","_termData","registerCoreBlockBindingsSources","registerBlockBindingsSource","patternOverrides","postData","postMeta","termData"],"sources":["@wordpress/editor/src/bindings/api.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { registerBlockBindingsSource } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport patternOverrides from './pattern-overrides';\nimport postData from './post-data';\nimport postMeta from './post-meta';\nimport termData from './term-data';\n\n/**\n * Function to register core block bindings sources provided by the editor.\n *\n * @example\n * ```js\n * import { registerCoreBlockBindingsSources } from '@wordpress/editor';\n *\n * registerCoreBlockBindingsSources();\n * ```\n */\nexport function registerCoreBlockBindingsSources() {\n\tregisterBlockBindingsSource( patternOverrides );\n\tregisterBlockBindingsSource( postData );\n\tregisterBlockBindingsSource( postMeta );\n\tregisterBlockBindingsSource( termData );\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAKA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,SAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,SAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,SAAA,GAAAH,sBAAA,CAAAF,OAAA;AAXA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASM,gCAAgCA,CAAA,EAAG;EAClD,IAAAC,mCAA2B,EAAEC,yBAAiB,CAAC;EAC/C,IAAAD,mCAA2B,EAAEE,iBAAS,CAAC;EACvC,IAAAF,mCAA2B,EAAEG,iBAAS,CAAC;EACvC,IAAAH,mCAA2B,EAAEI,iBAAS,CAAC;AACxC","ignoreList":[]}

package/build/bindings/term-data.js

@@ -0,0 +1,171 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _i18n = require("@wordpress/i18n");
+var _coreData = require("@wordpress/core-data");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Creates the data fields object with the given term data values and ID value.
+ *
+ * @param {Object}        termDataValues The term data values.
+ * @param {string|number} idValue        The ID value to use.
+ * @return {Object} The data fields object.
+ */
+function createDataFields(termDataValues, idValue) {
+  var _termDataValues$count;
+  return {
+    id: {
+      label: (0, _i18n.__)('Term ID'),
+      value: idValue,
+      type: 'string'
+    },
+    name: {
+      label: (0, _i18n.__)('Name'),
+      value: termDataValues?.name,
+      type: 'string'
+    },
+    slug: {
+      label: (0, _i18n.__)('Slug'),
+      value: termDataValues?.slug,
+      type: 'string'
+    },
+    link: {
+      label: (0, _i18n.__)('Link'),
+      value: termDataValues?.link,
+      type: 'string'
+    },
+    description: {
+      label: (0, _i18n.__)('Description'),
+      value: termDataValues?.description,
+      type: 'string'
+    },
+    parent: {
+      label: (0, _i18n.__)('Parent ID'),
+      value: termDataValues?.parent,
+      type: 'string'
+    },
+    count: {
+      label: (0, _i18n.__)('Count'),
+      value: `(${(_termDataValues$count = termDataValues?.count) !== null && _termDataValues$count !== void 0 ? _termDataValues$count : 0})`,
+      type: 'string'
+    }
+  };
+}
+
+/**
+ * Gets a list of term data fields with their values and labels
+ * to be consumed in the needed callbacks.
+ * If the value is not available based on context, like in templates,
+ * it falls back to the default value, label, or key.
+ *
+ * @param {Object} select  The select function from the data store.
+ * @param {Object} context The context provided.
+ * @return {Object} List of term data fields with their value and label.
+ *
+ * @example
+ * ```js
+ * {
+ *     name: {
+ *         label: 'Term Name',
+ *         value: 'Category Name',
+ *     },
+ *     count: {
+ *         label: 'Term Count',
+ *         value: 5,
+ *     },
+ *     ...
+ * }
+ * ```
+ */
+function getTermDataFields(select, context) {
+  const {
+    getEntityRecord
+  } = select(_coreData.store);
+  let termDataValues, dataFields;
+  if (context?.taxonomy && context?.termId) {
+    termDataValues = getEntityRecord('taxonomy', context?.taxonomy, context?.termId);
+    if (!termDataValues && context?.termData) {
+      termDataValues = context.termData;
+    }
+    if (termDataValues) {
+      dataFields = createDataFields(termDataValues, context?.termId);
+    }
+  } else if (context?.termData) {
+    termDataValues = context.termData;
+    dataFields = createDataFields(termDataValues, termDataValues?.term_id);
+  }
+  if (!dataFields || !Object.keys(dataFields).length) {
+    return null;
+  }
+  return dataFields;
+}
+
+/**
+ * @type {WPBlockBindingsSource}
+ */
+var _default = exports.default = {
+  name: 'core/term-data',
+  usesContext: ['taxonomy', 'termId', 'termData'],
+  getValues({
+    select,
+    context,
+    bindings
+  }) {
+    const dataFields = getTermDataFields(select, context);
+    const newValues = {};
+    for (const [attributeName, source] of Object.entries(bindings)) {
+      var _ref;
+      // Use the value, the field label, or the field key.
+      const fieldKey = source.args.key;
+      const {
+        value: fieldValue,
+        label: fieldLabel
+      } = dataFields?.[fieldKey] || {};
+      newValues[attributeName] = (_ref = fieldValue !== null && fieldValue !== void 0 ? fieldValue : fieldLabel) !== null && _ref !== void 0 ? _ref : fieldKey;
+    }
+    return newValues;
+  },
+  // eslint-disable-next-line no-unused-vars
+  setValues({
+    dispatch,
+    context,
+    bindings
+  }) {
+    // Terms are typically not editable through block bindings in most contexts.
+    return false;
+  },
+  canUserEditValue({
+    select,
+    context,
+    args
+  }) {
+    // Terms are typically read-only when displayed.
+    if (context?.termQuery || context?.termQueryId) {
+      return false;
+    }
+
+    // Lock editing when `taxonomy` or `termId` is not defined.
+    if (!context?.taxonomy || !context?.termId) {
+      return false;
+    }
+    const fieldValue = getTermDataFields(select, context)?.[args.key]?.value;
+    // Empty string or `false` could be a valid value, so we need to check if the field value is undefined.
+    if (fieldValue === undefined) {
+      return false;
+    }
+    return false;
+  },
+  getFieldsList({
+    select,
+    context
+  }) {
+    return getTermDataFields(select, context);
+  }
+};
+//# sourceMappingURL=term-data.js.map

package/build/bindings/term-data.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_i18n","require","_coreData","createDataFields","termDataValues","idValue","_termDataValues$count","id","label","__","value","type","name","slug","link","description","parent","count","getTermDataFields","select","context","getEntityRecord","coreDataStore","dataFields","taxonomy","termId","termData","term_id","Object","keys","length","_default","exports","default","usesContext","getValues","bindings","newValues","attributeName","source","entries","_ref","fieldKey","args","key","fieldValue","fieldLabel","setValues","dispatch","canUserEditValue","termQuery","termQueryId","undefined","getFieldsList"],"sources":["@wordpress/editor/src/bindings/term-data.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/**\n * Creates the data fields object with the given term data values and ID value.\n *\n * @param {Object}        termDataValues The term data values.\n * @param {string|number} idValue        The ID value to use.\n * @return {Object} The data fields object.\n */\nfunction createDataFields( termDataValues, idValue ) {\n\treturn {\n\t\tid: {\n\t\t\tlabel: __( 'Term ID' ),\n\t\t\tvalue: idValue,\n\t\t\ttype: 'string',\n\t\t},\n\t\tname: {\n\t\t\tlabel: __( 'Name' ),\n\t\t\tvalue: termDataValues?.name,\n\t\t\ttype: 'string',\n\t\t},\n\t\tslug: {\n\t\t\tlabel: __( 'Slug' ),\n\t\t\tvalue: termDataValues?.slug,\n\t\t\ttype: 'string',\n\t\t},\n\t\tlink: {\n\t\t\tlabel: __( 'Link' ),\n\t\t\tvalue: termDataValues?.link,\n\t\t\ttype: 'string',\n\t\t},\n\t\tdescription: {\n\t\t\tlabel: __( 'Description' ),\n\t\t\tvalue: termDataValues?.description,\n\t\t\ttype: 'string',\n\t\t},\n\t\tparent: {\n\t\t\tlabel: __( 'Parent ID' ),\n\t\t\tvalue: termDataValues?.parent,\n\t\t\ttype: 'string',\n\t\t},\n\t\tcount: {\n\t\t\tlabel: __( 'Count' ),\n\t\t\tvalue: `(${ termDataValues?.count ?? 0 })`,\n\t\t\ttype: 'string',\n\t\t},\n\t};\n}\n\n/**\n * Gets a list of term data fields with their values and labels\n * to be consumed in the needed callbacks.\n * If the value is not available based on context, like in templates,\n * it falls back to the default value, label, or key.\n *\n * @param {Object} select  The select function from the data store.\n * @param {Object} context The context provided.\n * @return {Object} List of term data fields with their value and label.\n *\n * @example\n * ```js\n * {\n *     name: {\n *         label: 'Term Name',\n *         value: 'Category Name',\n *     },\n *     count: {\n *         label: 'Term Count',\n *         value: 5,\n *     },\n *     ...\n * }\n * ```\n */\nfunction getTermDataFields( select, context ) {\n\tconst { getEntityRecord } = select( coreDataStore );\n\n\tlet termDataValues, dataFields;\n\tif ( context?.taxonomy && context?.termId ) {\n\t\ttermDataValues = getEntityRecord(\n\t\t\t'taxonomy',\n\t\t\tcontext?.taxonomy,\n\t\t\tcontext?.termId\n\t\t);\n\n\t\tif ( ! termDataValues && context?.termData ) {\n\t\t\ttermDataValues = context.termData;\n\t\t}\n\n\t\tif ( termDataValues ) {\n\t\t\tdataFields = createDataFields( termDataValues, context?.termId );\n\t\t}\n\t} else if ( context?.termData ) {\n\t\ttermDataValues = context.termData;\n\t\tdataFields = createDataFields(\n\t\t\ttermDataValues,\n\t\t\ttermDataValues?.term_id\n\t\t);\n\t}\n\n\tif ( ! dataFields || ! Object.keys( dataFields ).length ) {\n\t\treturn null;\n\t}\n\n\treturn dataFields;\n}\n\n/**\n * @type {WPBlockBindingsSource}\n */\nexport default {\n\tname: 'core/term-data',\n\tusesContext: [ 'taxonomy', 'termId', 'termData' ],\n\tgetValues( { select, context, bindings } ) {\n\t\tconst dataFields = getTermDataFields( select, context );\n\n\t\tconst newValues = {};\n\t\tfor ( const [ attributeName, source ] of Object.entries( bindings ) ) {\n\t\t\t// Use the value, the field label, or the field key.\n\t\t\tconst fieldKey = source.args.key;\n\t\t\tconst { value: fieldValue, label: fieldLabel } =\n\t\t\t\tdataFields?.[ fieldKey ] || {};\n\t\t\tnewValues[ attributeName ] = fieldValue ?? fieldLabel ?? fieldKey;\n\t\t}\n\t\treturn newValues;\n\t},\n\t// eslint-disable-next-line no-unused-vars\n\tsetValues( { dispatch, context, bindings } ) {\n\t\t// Terms are typically not editable through block bindings in most contexts.\n\t\treturn false;\n\t},\n\tcanUserEditValue( { select, context, args } ) {\n\t\t// Terms are typically read-only when displayed.\n\t\tif ( context?.termQuery || context?.termQueryId ) {\n\t\t\treturn false;\n\t\t}\n\n\t\t// Lock editing when `taxonomy` or `termId` is not defined.\n\t\tif ( ! context?.taxonomy || ! context?.termId ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst fieldValue = getTermDataFields( select, context )?.[ args.key ]\n\t\t\t?.value;\n\t\t// Empty string or `false` could be a valid value, so we need to check if the field value is undefined.\n\t\tif ( fieldValue === undefined ) {\n\t\t\treturn false;\n\t\t}\n\n\t\treturn false;\n\t},\n\tgetFieldsList( { select, context } ) {\n\t\treturn getTermDataFields( select, context );\n\t},\n};\n"],"mappings":"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","ignoreList":[]}

package/build/components/collab-sidebar/add-comment.js

@@ -9,6 +9,7 @@ var _i18n = require("@wordpress/i18n");
 var _data = require("@wordpress/data");
 var _components = require("@wordpress/components");
 var _blockEditor = require("@wordpress/block-editor");
+var _blocks = require("@wordpress/blocks");
 var _commentAuthorInfo = _interopRequireDefault(require("./comment-author-info"));
 var _commentForm = _interopRequireDefault(require("./comment-form"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -36,7 +37,8 @@ function AddComment({
 }) {
   const {
     clientId,
-    blockCommentId
+    blockCommentId,
+    isEmptyDefaultBlock
   } = (0, _data.useSelect)(select => {
     const {
       getSelectedBlock
@@ -44,10 +46,11 @@ function AddComment({
     const selectedBlock = getSelectedBlock();
     return {
       clientId: selectedBlock?.clientId,
-      blockCommentId: selectedBlock?.attributes?.blockCommentId
+      blockCommentId: selectedBlock?.attributes?.blockCommentId,
+      isEmptyDefaultBlock: selectedBlock ? (0, _blocks.isUnmodifiedDefaultBlock)(selectedBlock) : false
     };
   });
-  if (!showCommentBoard || !clientId || undefined !== blockCommentId) {
+  if (!showCommentBoard || !clientId || undefined !== blockCommentId || isEmptyDefaultBlock) {
     return null;
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {

package/build/components/collab-sidebar/add-comment.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_data","_components","_blockEditor","_commentAuthorInfo","_interopRequireDefault","_commentForm","_jsxRuntime","AddComment","onSubmit","showCommentBoard","setShowCommentBoard","clientId","blockCommentId","useSelect","select","getSelectedBlock","blockEditorStore","selectedBlock","attributes","undefined","jsxs","__experimentalVStack","spacing","className","children","jsx","__experimentalHStack","alignment","default","inputComment","onCancel","submitButtonText","_x"],"sources":["@wordpress/editor/src/components/collab-sidebar/add-comment.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { _x } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport CommentAuthorInfo from './comment-author-info';\nimport CommentForm from './comment-form';\n\n/**\n * Renders the UI for adding a comment in the Gutenberg editor's collaboration sidebar.\n *\n * @param {Object}   props                     - The component props.\n * @param {Function} props.onSubmit            - A callback function to be called when the user submits a comment.\n * @param {boolean}  props.showCommentBoard    - The function to edit the comment.\n * @param {Function} props.setShowCommentBoard - The function to delete the comment.\n * @return {React.ReactNode} The rendered comment input UI.\n */\nexport function AddComment( {\n\tonSubmit,\n\tshowCommentBoard,\n\tsetShowCommentBoard,\n} ) {\n\tconst { clientId, blockCommentId } = useSelect( ( select ) => {\n\t\tconst { getSelectedBlock } = select( blockEditorStore );\n\t\tconst selectedBlock = getSelectedBlock();\n\t\treturn {\n\t\t\tclientId: selectedBlock?.clientId,\n\t\t\tblockCommentId: selectedBlock?.attributes?.blockCommentId,\n\t\t};\n\t} );\n\n\tif ( ! showCommentBoard || ! clientId || undefined !== blockCommentId ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing=\"3\"\n\t\t\tclassName=\"editor-collab-sidebar-panel__thread editor-collab-sidebar-panel__active-thread editor-collab-sidebar-panel__focus-thread\"\n\t\t>\n\t\t\t<HStack alignment=\"left\" spacing=\"3\">\n\t\t\t\t<CommentAuthorInfo />\n\t\t\t</HStack>\n\t\t\t<CommentForm\n\t\t\t\tonSubmit={ ( inputComment ) => {\n\t\t\t\t\tonSubmit( inputComment );\n\t\t\t\t} }\n\t\t\t\tonCancel={ () => {\n\t\t\t\t\tsetShowCommentBoard( false );\n\t\t\t\t} }\n\t\t\t\tsubmitButtonText={ _x( 'Comment', 'Add comment button' ) }\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAIA,IAAAG,YAAA,GAAAH,OAAA;AAKA,IAAAI,kBAAA,GAAAC,sBAAA,CAAAL,OAAA;AACA,IAAAM,YAAA,GAAAD,sBAAA,CAAAL,OAAA;AAAyC,IAAAO,WAAA,GAAAP,OAAA;AAfzC;AACA;AACA;;AASA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASQ,UAAUA,CAAE;EAC3BC,QAAQ;EACRC,gBAAgB;EAChBC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC,QAAQ;IAAEC;EAAe,CAAC,GAAG,IAAAC,eAAS,EAAIC,MAAM,IAAM;IAC7D,MAAM;MAAEC;IAAiB,CAAC,GAAGD,MAAM,CAAEE,kBAAiB,CAAC;IACvD,MAAMC,aAAa,GAAGF,gBAAgB,CAAC,CAAC;IACxC,OAAO;MACNJ,QAAQ,EAAEM,aAAa,EAAEN,QAAQ;MACjCC,cAAc,EAAEK,aAAa,EAAEC,UAAU,EAAEN;IAC5C,CAAC;EACF,CAAE,CAAC;EAEH,IAAK,CAAEH,gBAAgB,IAAI,CAAEE,QAAQ,IAAIQ,SAAS,KAAKP,cAAc,EAAG;IACvE,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAN,WAAA,CAAAc,IAAA,EAACnB,WAAA,CAAAoB,oBAAM;IACNC,OAAO,EAAC,GAAG;IACXC,SAAS,EAAC,0HAA0H;IAAAC,QAAA,gBAEpI,IAAAlB,WAAA,CAAAmB,GAAA,EAACxB,WAAA,CAAAyB,oBAAM;MAACC,SAAS,EAAC,MAAM;MAACL,OAAO,EAAC,GAAG;MAAAE,QAAA,eACnC,IAAAlB,WAAA,CAAAmB,GAAA,EAACtB,kBAAA,CAAAyB,OAAiB,IAAE;IAAC,CACd,CAAC,eACT,IAAAtB,WAAA,CAAAmB,GAAA,EAACpB,YAAA,CAAAuB,OAAW;MACXpB,QAAQ,EAAKqB,YAAY,IAAM;QAC9BrB,QAAQ,CAAEqB,YAAa,CAAC;MACzB,CAAG;MACHC,QAAQ,EAAGA,CAAA,KAAM;QAChBpB,mBAAmB,CAAE,KAAM,CAAC;MAC7B,CAAG;MACHqB,gBAAgB,EAAG,IAAAC,QAAE,EAAE,SAAS,EAAE,oBAAqB;IAAG,CAC1D,CAAC;EAAA,CACK,CAAC;AAEX","ignoreList":[]}
+{"version":3,"names":["_i18n","require","_data","_components","_blockEditor","_blocks","_commentAuthorInfo","_interopRequireDefault","_commentForm","_jsxRuntime","AddComment","onSubmit","showCommentBoard","setShowCommentBoard","clientId","blockCommentId","isEmptyDefaultBlock","useSelect","select","getSelectedBlock","blockEditorStore","selectedBlock","attributes","isUnmodifiedDefaultBlock","undefined","jsxs","__experimentalVStack","spacing","className","children","jsx","__experimentalHStack","alignment","default","inputComment","onCancel","submitButtonText","_x"],"sources":["@wordpress/editor/src/components/collab-sidebar/add-comment.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { _x } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { isUnmodifiedDefaultBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport CommentAuthorInfo from './comment-author-info';\nimport CommentForm from './comment-form';\n\n/**\n * Renders the UI for adding a comment in the Gutenberg editor's collaboration sidebar.\n *\n * @param {Object}   props                     - The component props.\n * @param {Function} props.onSubmit            - A callback function to be called when the user submits a comment.\n * @param {boolean}  props.showCommentBoard    - The function to edit the comment.\n * @param {Function} props.setShowCommentBoard - The function to delete the comment.\n * @return {React.ReactNode} The rendered comment input UI.\n */\nexport function AddComment( {\n\tonSubmit,\n\tshowCommentBoard,\n\tsetShowCommentBoard,\n} ) {\n\tconst { clientId, blockCommentId, isEmptyDefaultBlock } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getSelectedBlock } = select( blockEditorStore );\n\t\t\tconst selectedBlock = getSelectedBlock();\n\t\t\treturn {\n\t\t\t\tclientId: selectedBlock?.clientId,\n\t\t\t\tblockCommentId: selectedBlock?.attributes?.blockCommentId,\n\t\t\t\tisEmptyDefaultBlock: selectedBlock\n\t\t\t\t\t? isUnmodifiedDefaultBlock( selectedBlock )\n\t\t\t\t\t: false,\n\t\t\t};\n\t\t}\n\t);\n\n\tif (\n\t\t! showCommentBoard ||\n\t\t! clientId ||\n\t\tundefined !== blockCommentId ||\n\t\tisEmptyDefaultBlock\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing=\"3\"\n\t\t\tclassName=\"editor-collab-sidebar-panel__thread editor-collab-sidebar-panel__active-thread editor-collab-sidebar-panel__focus-thread\"\n\t\t>\n\t\t\t<HStack alignment=\"left\" spacing=\"3\">\n\t\t\t\t<CommentAuthorInfo />\n\t\t\t</HStack>\n\t\t\t<CommentForm\n\t\t\t\tonSubmit={ ( inputComment ) => {\n\t\t\t\t\tonSubmit( inputComment );\n\t\t\t\t} }\n\t\t\t\tonCancel={ () => {\n\t\t\t\t\tsetShowCommentBoard( false );\n\t\t\t\t} }\n\t\t\t\tsubmitButtonText={ _x( 'Comment', 'Add comment button' ) }\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAIA,IAAAG,YAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAKA,IAAAK,kBAAA,GAAAC,sBAAA,CAAAN,OAAA;AACA,IAAAO,YAAA,GAAAD,sBAAA,CAAAN,OAAA;AAAyC,IAAAQ,WAAA,GAAAR,OAAA;AAhBzC;AACA;AACA;;AAUA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASS,UAAUA,CAAE;EAC3BC,QAAQ;EACRC,gBAAgB;EAChBC;AACD,CAAC,EAAG;EACH,MAAM;IAAEC,QAAQ;IAAEC,cAAc;IAAEC;EAAoB,CAAC,GAAG,IAAAC,eAAS,EAChEC,MAAM,IAAM;IACb,MAAM;MAAEC;IAAiB,CAAC,GAAGD,MAAM,CAAEE,kBAAiB,CAAC;IACvD,MAAMC,aAAa,GAAGF,gBAAgB,CAAC,CAAC;IACxC,OAAO;MACNL,QAAQ,EAAEO,aAAa,EAAEP,QAAQ;MACjCC,cAAc,EAAEM,aAAa,EAAEC,UAAU,EAAEP,cAAc;MACzDC,mBAAmB,EAAEK,aAAa,GAC/B,IAAAE,gCAAwB,EAAEF,aAAc,CAAC,GACzC;IACJ,CAAC;EACF,CACD,CAAC;EAED,IACC,CAAET,gBAAgB,IAClB,CAAEE,QAAQ,IACVU,SAAS,KAAKT,cAAc,IAC5BC,mBAAmB,EAClB;IACD,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAP,WAAA,CAAAgB,IAAA,EAACtB,WAAA,CAAAuB,oBAAM;IACNC,OAAO,EAAC,GAAG;IACXC,SAAS,EAAC,0HAA0H;IAAAC,QAAA,gBAEpI,IAAApB,WAAA,CAAAqB,GAAA,EAAC3B,WAAA,CAAA4B,oBAAM;MAACC,SAAS,EAAC,MAAM;MAACL,OAAO,EAAC,GAAG;MAAAE,QAAA,eACnC,IAAApB,WAAA,CAAAqB,GAAA,EAACxB,kBAAA,CAAA2B,OAAiB,IAAE;IAAC,CACd,CAAC,eACT,IAAAxB,WAAA,CAAAqB,GAAA,EAACtB,YAAA,CAAAyB,OAAW;MACXtB,QAAQ,EAAKuB,YAAY,IAAM;QAC9BvB,QAAQ,CAAEuB,YAAa,CAAC;MACzB,CAAG;MACHC,QAAQ,EAAGA,CAAA,KAAM;QAChBtB,mBAAmB,CAAE,KAAM,CAAC;MAC7B,CAAG;MACHuB,gBAAgB,EAAG,IAAAC,QAAE,EAAE,SAAS,EAAE,oBAAqB;IAAG,CAC1D,CAAC;EAAA,CACK,CAAC;AAEX","ignoreList":[]}

package/build/components/collab-sidebar/comment-author-info.js

@@ -45,7 +45,7 @@ var _jsxRuntime = require("react/jsx-runtime");
     } = getSettings();
     const defaultAvatar = __experimentalDiscussionSettings?.avatarURL;
     return {
-      currentUserAvatar: (_userData$avatar_urls = userData?.avatar_urls[48]) !== null && _userData$avatar_urls !== void 0 ? _userData$avatar_urls : defaultAvatar,
+      currentUserAvatar: (_userData$avatar_urls = userData?.avatar_urls?.[48]) !== null && _userData$avatar_urls !== void 0 ? _userData$avatar_urls : defaultAvatar,
       currentUserName: userData?.name
     };
   }, []);
@@ -65,9 +65,9 @@ var _jsxRuntime = require("react/jsx-runtime");
         className: "editor-collab-sidebar-panel__user-name",
         children: name !== null && name !== void 0 ? name : currentUserName
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("time", {
-        dateTime: (0, _date.dateI18n)('c', date !== null && date !== void 0 ? date : currentDate),
+        dateTime: (0, _date.dateI18n)('c', date ? (0, _date.getDate)(date) : currentDate),
         className: "editor-collab-sidebar-panel__user-time",
-        children: (0, _date.dateI18n)(dateTimeFormat, date !== null && date !== void 0 ? date : currentDate)
+        children: (0, _date.dateI18n)(dateTimeFormat, date ? (0, _date.getDate)(date) : currentDate)
       })]
     })]
   });

package/build/components/collab-sidebar/comment-author-info.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_date","_coreData","_data","_blockEditor","_jsxRuntime","CommentAuthorInfo","avatar","name","date","dateSettings","getDateSettings","dateTimeFormat","formats","time","useEntityProp","currentUserAvatar","currentUserName","useSelect","select","_userData$avatar_urls","userData","coreStore","getCurrentUser","getSettings","blockEditorStore","__experimentalDiscussionSettings","defaultAvatar","avatarURL","avatar_urls","currentDate","Date","jsxs","Fragment","children","jsx","src","className","alt","__","width","height","__experimentalVStack","spacing","dateTime","dateI18n","_default","exports","default"],"sources":["@wordpress/editor/src/components/collab-sidebar/comment-author-info.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalVStack as VStack } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { dateI18n, getSettings as getDateSettings } from '@wordpress/date';\nimport { useEntityProp, store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Render author information for a comment.\n *\n * @param {Object} props        - Component properties.\n * @param {string} props.avatar - URL of the author's avatar.\n * @param {string} props.name   - Name of the author.\n * @param {string} props.date   - Date of the comment.\n *\n * @return {React.ReactNode} The JSX element representing the author's information.\n */\nfunction CommentAuthorInfo( { avatar, name, date } ) {\n\tconst dateSettings = getDateSettings();\n\tconst [ dateTimeFormat = dateSettings.formats.time ] = useEntityProp(\n\t\t'root',\n\t\t'site',\n\t\t'time_format'\n\t);\n\n\tconst { currentUserAvatar, currentUserName } = useSelect( ( select ) => {\n\t\tconst userData = select( coreStore ).getCurrentUser();\n\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst { __experimentalDiscussionSettings } = getSettings();\n\t\tconst defaultAvatar = __experimentalDiscussionSettings?.avatarURL;\n\t\treturn {\n\t\t\tcurrentUserAvatar: userData?.avatar_urls[ 48 ] ?? defaultAvatar,\n\t\t\tcurrentUserName: userData?.name,\n\t\t};\n\t}, [] );\n\n\tconst currentDate = new Date();\n\n\treturn (\n\t\t<>\n\t\t\t<img\n\t\t\t\tsrc={ avatar ?? currentUserAvatar }\n\t\t\t\tclassName=\"editor-collab-sidebar-panel__user-avatar\"\n\t\t\t\t// translators: alt text for user avatar image\n\t\t\t\talt={ __( 'User avatar' ) }\n\t\t\t\twidth={ 32 }\n\t\t\t\theight={ 32 }\n\t\t\t/>\n\t\t\t<VStack spacing=\"0\">\n\t\t\t\t<span className=\"editor-collab-sidebar-panel__user-name\">\n\t\t\t\t\t{ name ?? currentUserName }\n\t\t\t\t</span>\n\t\t\t\t<time\n\t\t\t\t\tdateTime={ dateI18n( 'c', date ?? currentDate ) }\n\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__user-time\"\n\t\t\t\t>\n\t\t\t\t\t{ dateI18n( dateTimeFormat, date ?? currentDate ) }\n\t\t\t\t</time>\n\t\t\t</VStack>\n\t\t</>\n\t);\n}\n\nexport default CommentAuthorInfo;\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,SAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,YAAA,GAAAL,OAAA;AAAoE,IAAAM,WAAA,GAAAN,OAAA;AARpE;AACA;AACA;;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,SAASO,iBAAiBA,CAAE;EAAEC,MAAM;EAAEC,IAAI;EAAEC;AAAK,CAAC,EAAG;EACpD,MAAMC,YAAY,GAAG,IAAAC,iBAAe,EAAC,CAAC;EACtC,MAAM,CAAEC,cAAc,GAAGF,YAAY,CAACG,OAAO,CAACC,IAAI,CAAE,GAAG,IAAAC,uBAAa,EACnE,MAAM,EACN,MAAM,EACN,aACD,CAAC;EAED,MAAM;IAAEC,iBAAiB;IAAEC;EAAgB,CAAC,GAAG,IAAAC,eAAS,EAAIC,MAAM,IAAM;IAAA,IAAAC,qBAAA;IACvE,MAAMC,QAAQ,GAAGF,MAAM,CAAEG,eAAU,CAAC,CAACC,cAAc,CAAC,CAAC;IAErD,MAAM;MAAEC;IAAY,CAAC,GAAGL,MAAM,CAAEM,kBAAiB,CAAC;IAClD,MAAM;MAAEC;IAAiC,CAAC,GAAGF,WAAW,CAAC,CAAC;IAC1D,MAAMG,aAAa,GAAGD,gCAAgC,EAAEE,SAAS;IACjE,OAAO;MACNZ,iBAAiB,GAAAI,qBAAA,GAAEC,QAAQ,EAAEQ,WAAW,CAAE,EAAE,CAAE,cAAAT,qBAAA,cAAAA,qBAAA,GAAIO,aAAa;MAC/DV,eAAe,EAAEI,QAAQ,EAAEb;IAC5B,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMsB,WAAW,GAAG,IAAIC,IAAI,CAAC,CAAC;EAE9B,oBACC,IAAA1B,WAAA,CAAA2B,IAAA,EAAA3B,WAAA,CAAA4B,QAAA;IAAAC,QAAA,gBACC,IAAA7B,WAAA,CAAA8B,GAAA;MACCC,GAAG,EAAG7B,MAAM,aAANA,MAAM,cAANA,MAAM,GAAIS,iBAAmB;MACnCqB,SAAS,EAAC;MACV;MAAA;MACAC,GAAG,EAAG,IAAAC,QAAE,EAAE,aAAc,CAAG;MAC3BC,KAAK,EAAG,EAAI;MACZC,MAAM,EAAG;IAAI,CACb,CAAC,eACF,IAAApC,WAAA,CAAA2B,IAAA,EAAClC,WAAA,CAAA4C,oBAAM;MAACC,OAAO,EAAC,GAAG;MAAAT,QAAA,gBAClB,IAAA7B,WAAA,CAAA8B,GAAA;QAAME,SAAS,EAAC,wCAAwC;QAAAH,QAAA,EACrD1B,IAAI,aAAJA,IAAI,cAAJA,IAAI,GAAIS;MAAe,CACpB,CAAC,eACP,IAAAZ,WAAA,CAAA8B,GAAA;QACCS,QAAQ,EAAG,IAAAC,cAAQ,EAAE,GAAG,EAAEpC,IAAI,aAAJA,IAAI,cAAJA,IAAI,GAAIqB,WAAY,CAAG;QACjDO,SAAS,EAAC,wCAAwC;QAAAH,QAAA,EAEhD,IAAAW,cAAQ,EAAEjC,cAAc,EAAEH,IAAI,aAAJA,IAAI,cAAJA,IAAI,GAAIqB,WAAY;MAAC,CAC5C,CAAC;IAAA,CACA,CAAC;EAAA,CACR,CAAC;AAEL;AAAC,IAAAgB,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc1C,iBAAiB","ignoreList":[]}
+{"version":3,"names":["_components","require","_i18n","_date","_coreData","_data","_blockEditor","_jsxRuntime","CommentAuthorInfo","avatar","name","date","dateSettings","getDateSettings","dateTimeFormat","formats","time","useEntityProp","currentUserAvatar","currentUserName","useSelect","select","_userData$avatar_urls","userData","coreStore","getCurrentUser","getSettings","blockEditorStore","__experimentalDiscussionSettings","defaultAvatar","avatarURL","avatar_urls","currentDate","Date","jsxs","Fragment","children","jsx","src","className","alt","__","width","height","__experimentalVStack","spacing","dateTime","dateI18n","getDate","_default","exports","default"],"sources":["@wordpress/editor/src/components/collab-sidebar/comment-author-info.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalVStack as VStack } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tdateI18n,\n\tgetDate,\n\tgetSettings as getDateSettings,\n} from '@wordpress/date';\nimport { useEntityProp, store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Render author information for a comment.\n *\n * @param {Object} props        - Component properties.\n * @param {string} props.avatar - URL of the author's avatar.\n * @param {string} props.name   - Name of the author.\n * @param {string} props.date   - Date of the comment.\n *\n * @return {React.ReactNode} The JSX element representing the author's information.\n */\nfunction CommentAuthorInfo( { avatar, name, date } ) {\n\tconst dateSettings = getDateSettings();\n\tconst [ dateTimeFormat = dateSettings.formats.time ] = useEntityProp(\n\t\t'root',\n\t\t'site',\n\t\t'time_format'\n\t);\n\n\tconst { currentUserAvatar, currentUserName } = useSelect( ( select ) => {\n\t\tconst userData = select( coreStore ).getCurrentUser();\n\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst { __experimentalDiscussionSettings } = getSettings();\n\t\tconst defaultAvatar = __experimentalDiscussionSettings?.avatarURL;\n\t\treturn {\n\t\t\tcurrentUserAvatar: userData?.avatar_urls?.[ 48 ] ?? defaultAvatar,\n\t\t\tcurrentUserName: userData?.name,\n\t\t};\n\t}, [] );\n\n\tconst currentDate = new Date();\n\n\treturn (\n\t\t<>\n\t\t\t<img\n\t\t\t\tsrc={ avatar ?? currentUserAvatar }\n\t\t\t\tclassName=\"editor-collab-sidebar-panel__user-avatar\"\n\t\t\t\t// translators: alt text for user avatar image\n\t\t\t\talt={ __( 'User avatar' ) }\n\t\t\t\twidth={ 32 }\n\t\t\t\theight={ 32 }\n\t\t\t/>\n\t\t\t<VStack spacing=\"0\">\n\t\t\t\t<span className=\"editor-collab-sidebar-panel__user-name\">\n\t\t\t\t\t{ name ?? currentUserName }\n\t\t\t\t</span>\n\t\t\t\t<time\n\t\t\t\t\tdateTime={ dateI18n(\n\t\t\t\t\t\t'c',\n\t\t\t\t\t\tdate ? getDate( date ) : currentDate\n\t\t\t\t\t) }\n\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__user-time\"\n\t\t\t\t>\n\t\t\t\t\t{ dateI18n(\n\t\t\t\t\t\tdateTimeFormat,\n\t\t\t\t\t\tdate ? getDate( date ) : currentDate\n\t\t\t\t\t) }\n\t\t\t\t</time>\n\t\t\t</VStack>\n\t\t</>\n\t);\n}\n\nexport default CommentAuthorInfo;\n"],"mappings":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAKA,IAAAG,SAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,YAAA,GAAAL,OAAA;AAAoE,IAAAM,WAAA,GAAAN,OAAA;AAZpE;AACA;AACA;;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,SAASO,iBAAiBA,CAAE;EAAEC,MAAM;EAAEC,IAAI;EAAEC;AAAK,CAAC,EAAG;EACpD,MAAMC,YAAY,GAAG,IAAAC,iBAAe,EAAC,CAAC;EACtC,MAAM,CAAEC,cAAc,GAAGF,YAAY,CAACG,OAAO,CAACC,IAAI,CAAE,GAAG,IAAAC,uBAAa,EACnE,MAAM,EACN,MAAM,EACN,aACD,CAAC;EAED,MAAM;IAAEC,iBAAiB;IAAEC;EAAgB,CAAC,GAAG,IAAAC,eAAS,EAAIC,MAAM,IAAM;IAAA,IAAAC,qBAAA;IACvE,MAAMC,QAAQ,GAAGF,MAAM,CAAEG,eAAU,CAAC,CAACC,cAAc,CAAC,CAAC;IAErD,MAAM;MAAEC;IAAY,CAAC,GAAGL,MAAM,CAAEM,kBAAiB,CAAC;IAClD,MAAM;MAAEC;IAAiC,CAAC,GAAGF,WAAW,CAAC,CAAC;IAC1D,MAAMG,aAAa,GAAGD,gCAAgC,EAAEE,SAAS;IACjE,OAAO;MACNZ,iBAAiB,GAAAI,qBAAA,GAAEC,QAAQ,EAAEQ,WAAW,GAAI,EAAE,CAAE,cAAAT,qBAAA,cAAAA,qBAAA,GAAIO,aAAa;MACjEV,eAAe,EAAEI,QAAQ,EAAEb;IAC5B,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMsB,WAAW,GAAG,IAAIC,IAAI,CAAC,CAAC;EAE9B,oBACC,IAAA1B,WAAA,CAAA2B,IAAA,EAAA3B,WAAA,CAAA4B,QAAA;IAAAC,QAAA,gBACC,IAAA7B,WAAA,CAAA8B,GAAA;MACCC,GAAG,EAAG7B,MAAM,aAANA,MAAM,cAANA,MAAM,GAAIS,iBAAmB;MACnCqB,SAAS,EAAC;MACV;MAAA;MACAC,GAAG,EAAG,IAAAC,QAAE,EAAE,aAAc,CAAG;MAC3BC,KAAK,EAAG,EAAI;MACZC,MAAM,EAAG;IAAI,CACb,CAAC,eACF,IAAApC,WAAA,CAAA2B,IAAA,EAAClC,WAAA,CAAA4C,oBAAM;MAACC,OAAO,EAAC,GAAG;MAAAT,QAAA,gBAClB,IAAA7B,WAAA,CAAA8B,GAAA;QAAME,SAAS,EAAC,wCAAwC;QAAAH,QAAA,EACrD1B,IAAI,aAAJA,IAAI,cAAJA,IAAI,GAAIS;MAAe,CACpB,CAAC,eACP,IAAAZ,WAAA,CAAA8B,GAAA;QACCS,QAAQ,EAAG,IAAAC,cAAQ,EAClB,GAAG,EACHpC,IAAI,GAAG,IAAAqC,aAAO,EAAErC,IAAK,CAAC,GAAGqB,WAC1B,CAAG;QACHO,SAAS,EAAC,wCAAwC;QAAAH,QAAA,EAEhD,IAAAW,cAAQ,EACTjC,cAAc,EACdH,IAAI,GAAG,IAAAqC,aAAO,EAAErC,IAAK,CAAC,GAAGqB,WAC1B;MAAC,CACI,CAAC;IAAA,CACA,CAAC;EAAA,CACR,CAAC;AAEL;AAAC,IAAAiB,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEc3C,iBAAiB","ignoreList":[]}

package/build/components/collab-sidebar/comment-form.js

@@ -1,14 +1,21 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _reactAutosizeTextarea = _interopRequireDefault(require("react-autosize-textarea"));
 var _element = require("@wordpress/element");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
+var _compose = require("@wordpress/compose");
 var _utils = require("./utils");
 var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * External dependencies
+ */
+
 /**
  * WordPress dependencies
  */
@@ -25,27 +32,36 @@ var _jsxRuntime = require("react/jsx-runtime");
  * @param {Function} props.onCancel         - The function to call when canceling the comment update.
  * @param {Object}   props.thread           - The comment thread object.
  * @param {string}   props.submitButtonText - The text to display on the submit button.
+ * @param {string?}  props.placeholderText  - The placeholder text for the comment input.
+ * @param {number?}  props.rows             - The number of rows for the comment input.
  * @return {React.ReactNode} The CommentForm component.
  */function CommentForm({
   onSubmit,
   onCancel,
   thread,
-  submitButtonText
+  submitButtonText,
+  placeholderText,
+  rows = 4
 }) {
   var _thread$content$raw;
   const [inputComment, setInputComment] = (0, _element.useState)((_thread$content$raw = thread?.content?.raw) !== null && _thread$content$raw !== void 0 ? _thread$content$raw : '');
+  const inputId = (0, _compose.useInstanceId)(CommentForm, 'comment-input');
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.TextareaControl, {
-      __next40pxDefaultSize: true,
-      __nextHasNoMarginBottom: true,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.VisuallyHidden, {
+      as: "label",
+      htmlFor: inputId,
+      children: (0, _i18n.__)('Comment')
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAutosizeTextarea.default, {
+      id: inputId,
       value: inputComment !== null && inputComment !== void 0 ? inputComment : '',
-      onChange: setInputComment,
-      label: (0, _i18n.__)('Comment'),
-      hideLabelFromVision: true
+      onChange: comment => setInputComment(comment.target.value),
+      rows: rows,
+      maxRows: 20,
+      placeholder: placeholderText || ''
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
-      alignment: "left",
       spacing: "3",
       justify: "flex-start",
+      wrap: true,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
         __next40pxDefaultSize: true,
         accessibleWhenDisabled: true,

package/build/components/collab-sidebar/comment-form.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_components","_i18n","_utils","_jsxRuntime","CommentForm","onSubmit","onCancel","thread","submitButtonText","_thread$content$raw","inputComment","setInputComment","useState","content","raw","jsxs","Fragment","children","jsx","TextareaControl","__next40pxDefaultSize","__nextHasNoMarginBottom","value","onChange","label","__","hideLabelFromVision","__experimentalHStack","alignment","spacing","justify","Button","accessibleWhenDisabled","variant","onClick","disabled","sanitizeCommentString","length","text","_x","_default","exports","default"],"sources":["@wordpress/editor/src/components/collab-sidebar/comment-form.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\t__experimentalHStack as HStack,\n\tButton,\n\tTextareaControl,\n} from '@wordpress/components';\nimport { _x, __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { sanitizeCommentString } from './utils';\n\n/**\n * EditComment component.\n *\n * @param {Object}   props                  - The component props.\n * @param {Function} props.onSubmit         - The function to call when updating the comment.\n * @param {Function} props.onCancel         - The function to call when canceling the comment update.\n * @param {Object}   props.thread           - The comment thread object.\n * @param {string}   props.submitButtonText - The text to display on the submit button.\n * @return {React.ReactNode} The CommentForm component.\n */\nfunction CommentForm( { onSubmit, onCancel, thread, submitButtonText } ) {\n\tconst [ inputComment, setInputComment ] = useState(\n\t\tthread?.content?.raw ?? ''\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<TextareaControl\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ inputComment ?? '' }\n\t\t\t\tonChange={ setInputComment }\n\t\t\t\tlabel={ __( 'Comment' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t/>\n\t\t\t<HStack alignment=\"left\" spacing=\"3\" justify=\"flex-start\">\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonSubmit( inputComment );\n\t\t\t\t\t\tsetInputComment( '' );\n\t\t\t\t\t} }\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\t0 === sanitizeCommentString( inputComment ).length\n\t\t\t\t\t}\n\t\t\t\t\ttext={ submitButtonText }\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\tonClick={ onCancel }\n\t\t\t\t\ttext={ _x( 'Cancel', 'Cancel comment button' ) }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</>\n\t);\n}\n\nexport default CommentForm;\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAKA,IAAAE,KAAA,GAAAF,OAAA;AAKA,IAAAG,MAAA,GAAAH,OAAA;AAAgD,IAAAI,WAAA,GAAAJ,OAAA;AAdhD;AACA;AACA;;AASA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,SAASK,WAAWA,CAAE;EAAEC,QAAQ;EAAEC,QAAQ;EAAEC,MAAM;EAAEC;AAAiB,CAAC,EAAG;EAAA,IAAAC,mBAAA;EACxE,MAAM,CAAEC,YAAY,EAAEC,eAAe,CAAE,GAAG,IAAAC,iBAAQ,GAAAH,mBAAA,GACjDF,MAAM,EAAEM,OAAO,EAAEC,GAAG,cAAAL,mBAAA,cAAAA,mBAAA,GAAI,EACzB,CAAC;EAED,oBACC,IAAAN,WAAA,CAAAY,IAAA,EAAAZ,WAAA,CAAAa,QAAA;IAAAC,QAAA,gBACC,IAAAd,WAAA,CAAAe,GAAA,EAAClB,WAAA,CAAAmB,eAAe;MACfC,qBAAqB;MACrBC,uBAAuB;MACvBC,KAAK,EAAGZ,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI,EAAI;MAC5Ba,QAAQ,EAAGZ,eAAiB;MAC5Ba,KAAK,EAAG,IAAAC,QAAE,EAAE,SAAU,CAAG;MACzBC,mBAAmB;IAAA,CACnB,CAAC,eACF,IAAAvB,WAAA,CAAAY,IAAA,EAACf,WAAA,CAAA2B,oBAAM;MAACC,SAAS,EAAC,MAAM;MAACC,OAAO,EAAC,GAAG;MAACC,OAAO,EAAC,YAAY;MAAAb,QAAA,gBACxD,IAAAd,WAAA,CAAAe,GAAA,EAAClB,WAAA,CAAA+B,MAAM;QACNX,qBAAqB;QACrBY,sBAAsB;QACtBC,OAAO,EAAC,SAAS;QACjBC,OAAO,EAAGA,CAAA,KAAM;UACf7B,QAAQ,CAAEK,YAAa,CAAC;UACxBC,eAAe,CAAE,EAAG,CAAC;QACtB,CAAG;QACHwB,QAAQ,EACP,CAAC,KAAK,IAAAC,4BAAqB,EAAE1B,YAAa,CAAC,CAAC2B,MAC5C;QACDC,IAAI,EAAG9B;MAAkB,CACzB,CAAC,eACF,IAAAL,WAAA,CAAAe,GAAA,EAAClB,WAAA,CAAA+B,MAAM;QACNX,qBAAqB;QACrBa,OAAO,EAAC,UAAU;QAClBC,OAAO,EAAG5B,QAAU;QACpBgC,IAAI,EAAG,IAAAC,QAAE,EAAE,QAAQ,EAAE,uBAAwB;MAAG,CAChD,CAAC;IAAA,CACK,CAAC;EAAA,CACR,CAAC;AAEL;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEctC,WAAW","ignoreList":[]}
+{"version":3,"names":["_reactAutosizeTextarea","_interopRequireDefault","require","_element","_components","_i18n","_compose","_utils","_jsxRuntime","CommentForm","onSubmit","onCancel","thread","submitButtonText","placeholderText","rows","_thread$content$raw","inputComment","setInputComment","useState","content","raw","inputId","useInstanceId","jsxs","Fragment","children","jsx","VisuallyHidden","as","htmlFor","__","default","id","value","onChange","comment","target","maxRows","placeholder","__experimentalHStack","spacing","justify","wrap","Button","__next40pxDefaultSize","accessibleWhenDisabled","variant","onClick","disabled","sanitizeCommentString","length","text","_x","_default","exports"],"sources":["@wordpress/editor/src/components/collab-sidebar/comment-form.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport TextareaAutosize from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\t__experimentalHStack as HStack,\n\tButton,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { _x, __ } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { sanitizeCommentString } from './utils';\n\n/**\n * EditComment component.\n *\n * @param {Object}   props                  - The component props.\n * @param {Function} props.onSubmit         - The function to call when updating the comment.\n * @param {Function} props.onCancel         - The function to call when canceling the comment update.\n * @param {Object}   props.thread           - The comment thread object.\n * @param {string}   props.submitButtonText - The text to display on the submit button.\n * @param {string?}  props.placeholderText  - The placeholder text for the comment input.\n * @param {number?}  props.rows             - The number of rows for the comment input.\n * @return {React.ReactNode} The CommentForm component.\n */\nfunction CommentForm( {\n\tonSubmit,\n\tonCancel,\n\tthread,\n\tsubmitButtonText,\n\tplaceholderText,\n\trows = 4,\n} ) {\n\tconst [ inputComment, setInputComment ] = useState(\n\t\tthread?.content?.raw ?? ''\n\t);\n\n\tconst inputId = useInstanceId( CommentForm, 'comment-input' );\n\n\treturn (\n\t\t<>\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ inputId }>\n\t\t\t\t{ __( 'Comment' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<TextareaAutosize\n\t\t\t\tid={ inputId }\n\t\t\t\tvalue={ inputComment ?? '' }\n\t\t\t\tonChange={ ( comment ) =>\n\t\t\t\t\tsetInputComment( comment.target.value )\n\t\t\t\t}\n\t\t\t\trows={ rows }\n\t\t\t\tmaxRows={ 20 }\n\t\t\t\tplaceholder={ placeholderText || '' }\n\t\t\t></TextareaAutosize>\n\t\t\t<HStack spacing=\"3\" justify=\"flex-start\" wrap>\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonSubmit( inputComment );\n\t\t\t\t\t\tsetInputComment( '' );\n\t\t\t\t\t} }\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\t0 === sanitizeCommentString( inputComment ).length\n\t\t\t\t\t}\n\t\t\t\t\ttext={ submitButtonText }\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\tonClick={ onCancel }\n\t\t\t\t\ttext={ _x( 'Cancel', 'Cancel comment button' ) }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</>\n\t);\n}\n\nexport default CommentForm;\n"],"mappings":";;;;;;;AAGA,IAAAA,sBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAKA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AAKA,IAAAK,MAAA,GAAAL,OAAA;AAAgD,IAAAM,WAAA,GAAAN,OAAA;AApBhD;AACA;AACA;;AAGA;AACA;AACA;;AAUA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GACA,SAASO,WAAWA,CAAE;EACrBC,QAAQ;EACRC,QAAQ;EACRC,MAAM;EACNC,gBAAgB;EAChBC,eAAe;EACfC,IAAI,GAAG;AACR,CAAC,EAAG;EAAA,IAAAC,mBAAA;EACH,MAAM,CAAEC,YAAY,EAAEC,eAAe,CAAE,GAAG,IAAAC,iBAAQ,GAAAH,mBAAA,GACjDJ,MAAM,EAAEQ,OAAO,EAAEC,GAAG,cAAAL,mBAAA,cAAAA,mBAAA,GAAI,EACzB,CAAC;EAED,MAAMM,OAAO,GAAG,IAAAC,sBAAa,EAAEd,WAAW,EAAE,eAAgB,CAAC;EAE7D,oBACC,IAAAD,WAAA,CAAAgB,IAAA,EAAAhB,WAAA,CAAAiB,QAAA;IAAAC,QAAA,gBACC,IAAAlB,WAAA,CAAAmB,GAAA,EAACvB,WAAA,CAAAwB,cAAc;MAACC,EAAE,EAAC,OAAO;MAACC,OAAO,EAAGR,OAAS;MAAAI,QAAA,EAC3C,IAAAK,QAAE,EAAE,SAAU;IAAC,CACF,CAAC,eACjB,IAAAvB,WAAA,CAAAmB,GAAA,EAAC3B,sBAAA,CAAAgC,OAAgB;MAChBC,EAAE,EAAGX,OAAS;MACdY,KAAK,EAAGjB,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI,EAAI;MAC5BkB,QAAQ,EAAKC,OAAO,IACnBlB,eAAe,CAAEkB,OAAO,CAACC,MAAM,CAACH,KAAM,CACtC;MACDnB,IAAI,EAAGA,IAAM;MACbuB,OAAO,EAAG,EAAI;MACdC,WAAW,EAAGzB,eAAe,IAAI;IAAI,CACnB,CAAC,eACpB,IAAAN,WAAA,CAAAgB,IAAA,EAACpB,WAAA,CAAAoC,oBAAM;MAACC,OAAO,EAAC,GAAG;MAACC,OAAO,EAAC,YAAY;MAACC,IAAI;MAAAjB,QAAA,gBAC5C,IAAAlB,WAAA,CAAAmB,GAAA,EAACvB,WAAA,CAAAwC,MAAM;QACNC,qBAAqB;QACrBC,sBAAsB;QACtBC,OAAO,EAAC,SAAS;QACjBC,OAAO,EAAGA,CAAA,KAAM;UACftC,QAAQ,CAAEO,YAAa,CAAC;UACxBC,eAAe,CAAE,EAAG,CAAC;QACtB,CAAG;QACH+B,QAAQ,EACP,CAAC,KAAK,IAAAC,4BAAqB,EAAEjC,YAAa,CAAC,CAACkC,MAC5C;QACDC,IAAI,EAAGvC;MAAkB,CACzB,CAAC,eACF,IAAAL,WAAA,CAAAmB,GAAA,EAACvB,WAAA,CAAAwC,MAAM;QACNC,qBAAqB;QACrBE,OAAO,EAAC,UAAU;QAClBC,OAAO,EAAGrC,QAAU;QACpByC,IAAI,EAAG,IAAAC,QAAE,EAAE,QAAQ,EAAE,uBAAwB;MAAG,CAChD,CAAC;IAAA,CACK,CAAC;EAAA,CACR,CAAC;AAEL;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAvB,OAAA,GAEcvB,WAAW","ignoreList":[]}

package/build/components/collab-sidebar/comment-indicator-toolbar.js

@@ -0,0 +1,112 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _components = require("@wordpress/components");
+var _i18n = require("@wordpress/i18n");
+var _element = require("@wordpress/element");
+var _blockEditor = require("@wordpress/block-editor");
+var _clsx = _interopRequireDefault(require("clsx"));
+var _lockUnlock = require("../../lock-unlock");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * External dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+const {
+  CommentIconToolbarSlotFill
+} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+const CommentAvatarIndicator = ({
+  onClick,
+  thread,
+  hasMoreComments
+}) => {
+  const threadParticipants = (0, _element.useMemo)(() => {
+    if (!thread) {
+      return [];
+    }
+    const participantsMap = new Map();
+    const allComments = [thread, ...thread.reply];
+
+    // Sort by date to show participants in chronological order.
+    allComments.sort((a, b) => new Date(a.date) - new Date(b.date));
+    allComments.forEach(comment => {
+      // Track thread participants (original commenter + repliers).
+      if (comment.author_name && comment.author_avatar_urls) {
+        const authorKey = `${comment.author}-${comment.author_name}`;
+        if (!participantsMap.has(authorKey)) {
+          participantsMap.set(authorKey, {
+            name: comment.author_name,
+            avatar: comment.author_avatar_urls?.['48'] || comment.author_avatar_urls?.['96'],
+            isOriginalCommenter: comment.id === thread.id,
+            date: comment.date
+          });
+        }
+      }
+    });
+    return Array.from(participantsMap.values());
+  }, [thread]);
+  const hasUnresolved = thread?.status !== 'approved';
+
+  // Check if this specific thread has more participants due to pagination.
+  // If we have pagination AND this thread + its replies equals or exceeds the API limit,
+  // then this thread likely has more participants that weren't loaded.
+  const threadHasMoreParticipants = hasMoreComments && thread?.reply && 1 + thread.reply.length >= 100;
+  if (!threadParticipants.length) {
+    return null;
+  }
+
+  // Show up to 3 avatars, with overflow indicator.
+  const maxAvatars = 3;
+  const visibleParticipants = threadParticipants.slice(0, maxAvatars);
+  const overflowCount = Math.max(0, threadParticipants.length - maxAvatars);
+
+  // If we hit the comment limit, show "100+" instead of exact overflow count.
+  const overflowText = threadHasMoreParticipants && overflowCount > 0 ? (0, _i18n.__)('100+') : (0, _i18n.sprintf)(
+  // translators: %s: Number of comments.
+  (0, _i18n.__)('+%s'), overflowCount);
+  const overflowTitle = threadHasMoreParticipants && overflowCount > 0 ? (0, _i18n.__)('100+ participants') : (0, _i18n.sprintf)(
+  // translators: %s: Number of comments.
+  (0, _i18n.__)('+%s more participants'), overflowCount);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(CommentIconToolbarSlotFill.Fill, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToolbarButton, {
+      className: (0, _clsx.default)('comment-avatar-indicator', {
+        'has-unresolved': hasUnresolved
+      }),
+      label: (0, _i18n._x)('View comments', 'View comment thread'),
+      onClick: onClick,
+      showTooltip: true,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "comment-avatar-stack",
+        children: [visibleParticipants.map((participant, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+          src: participant.avatar,
+          alt: participant.name,
+          className: "comment-avatar",
+          style: {
+            zIndex: maxAvatars - index
+          }
+        }, participant.name + index)), overflowCount > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "comment-avatar-overflow",
+          style: {
+            zIndex: 0
+          },
+          title: overflowTitle,
+          children: overflowText
+        })]
+      })
+    })
+  });
+};
+var _default = exports.default = CommentAvatarIndicator;
+//# sourceMappingURL=comment-indicator-toolbar.js.map

package/build/components/collab-sidebar/comment-indicator-toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_components","require","_i18n","_element","_blockEditor","_clsx","_interopRequireDefault","_lockUnlock","_jsxRuntime","CommentIconToolbarSlotFill","unlock","blockEditorPrivateApis","CommentAvatarIndicator","onClick","thread","hasMoreComments","threadParticipants","useMemo","participantsMap","Map","allComments","reply","sort","a","b","Date","date","forEach","comment","author_name","author_avatar_urls","authorKey","author","has","set","name","avatar","isOriginalCommenter","id","Array","from","values","hasUnresolved","status","threadHasMoreParticipants","length","maxAvatars","visibleParticipants","slice","overflowCount","Math","max","overflowText","__","sprintf","overflowTitle","jsx","Fill","children","ToolbarButton","className","clsx","label","_x","showTooltip","jsxs","map","participant","index","src","alt","style","zIndex","title","_default","exports","default"],"sources":["@wordpress/editor/src/components/collab-sidebar/comment-indicator-toolbar.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { ToolbarButton } from '@wordpress/components';\nimport { _x, __, sprintf } from '@wordpress/i18n';\nimport { useMemo } from '@wordpress/element';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { CommentIconToolbarSlotFill } = unlock( blockEditorPrivateApis );\n\nconst CommentAvatarIndicator = ( { onClick, thread, hasMoreComments } ) => {\n\tconst threadParticipants = useMemo( () => {\n\t\tif ( ! thread ) {\n\t\t\treturn [];\n\t\t}\n\n\t\tconst participantsMap = new Map();\n\t\tconst allComments = [ thread, ...thread.reply ];\n\n\t\t// Sort by date to show participants in chronological order.\n\t\tallComments.sort( ( a, b ) => new Date( a.date ) - new Date( b.date ) );\n\n\t\tallComments.forEach( ( comment ) => {\n\t\t\t// Track thread participants (original commenter + repliers).\n\t\t\tif ( comment.author_name && comment.author_avatar_urls ) {\n\t\t\t\tconst authorKey = `${ comment.author }-${ comment.author_name }`;\n\t\t\t\tif ( ! participantsMap.has( authorKey ) ) {\n\t\t\t\t\tparticipantsMap.set( authorKey, {\n\t\t\t\t\t\tname: comment.author_name,\n\t\t\t\t\t\tavatar:\n\t\t\t\t\t\t\tcomment.author_avatar_urls?.[ '48' ] ||\n\t\t\t\t\t\t\tcomment.author_avatar_urls?.[ '96' ],\n\t\t\t\t\t\tisOriginalCommenter: comment.id === thread.id,\n\t\t\t\t\t\tdate: comment.date,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\n\t\treturn Array.from( participantsMap.values() );\n\t}, [ thread ] );\n\n\tconst hasUnresolved = thread?.status !== 'approved';\n\n\t// Check if this specific thread has more participants due to pagination.\n\t// If we have pagination AND this thread + its replies equals or exceeds the API limit,\n\t// then this thread likely has more participants that weren't loaded.\n\tconst threadHasMoreParticipants =\n\t\thasMoreComments && thread?.reply && 1 + thread.reply.length >= 100;\n\n\tif ( ! threadParticipants.length ) {\n\t\treturn null;\n\t}\n\n\t// Show up to 3 avatars, with overflow indicator.\n\tconst maxAvatars = 3;\n\tconst visibleParticipants = threadParticipants.slice( 0, maxAvatars );\n\tconst overflowCount = Math.max( 0, threadParticipants.length - maxAvatars );\n\n\t// If we hit the comment limit, show \"100+\" instead of exact overflow count.\n\tconst overflowText =\n\t\tthreadHasMoreParticipants && overflowCount > 0\n\t\t\t? __( '100+' )\n\t\t\t: sprintf(\n\t\t\t\t\t// translators: %s: Number of comments.\n\t\t\t\t\t__( '+%s' ),\n\t\t\t\t\toverflowCount\n\t\t\t  );\n\n\tconst overflowTitle =\n\t\tthreadHasMoreParticipants && overflowCount > 0\n\t\t\t? __( '100+ participants' )\n\t\t\t: sprintf(\n\t\t\t\t\t// translators: %s: Number of comments.\n\t\t\t\t\t__( '+%s more participants' ),\n\t\t\t\t\toverflowCount\n\t\t\t  );\n\n\treturn (\n\t\t<CommentIconToolbarSlotFill.Fill>\n\t\t\t<ToolbarButton\n\t\t\t\tclassName={ clsx( 'comment-avatar-indicator', {\n\t\t\t\t\t'has-unresolved': hasUnresolved,\n\t\t\t\t} ) }\n\t\t\t\tlabel={ _x( 'View comments', 'View comment thread' ) }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tshowTooltip\n\t\t\t>\n\t\t\t\t<div className=\"comment-avatar-stack\">\n\t\t\t\t\t{ visibleParticipants.map( ( participant, index ) => (\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tkey={ participant.name + index }\n\t\t\t\t\t\t\tsrc={ participant.avatar }\n\t\t\t\t\t\t\talt={ participant.name }\n\t\t\t\t\t\t\tclassName=\"comment-avatar\"\n\t\t\t\t\t\t\tstyle={ { zIndex: maxAvatars - index } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t\t{ overflowCount > 0 && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"comment-avatar-overflow\"\n\t\t\t\t\t\t\tstyle={ { zIndex: 0 } }\n\t\t\t\t\t\t\ttitle={ overflowTitle }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ overflowText }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</ToolbarButton>\n\t\t</CommentIconToolbarSlotFill.Fill>\n\t);\n};\n\nexport default CommentAvatarIndicator;\n"],"mappings":"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","ignoreList":[]}