Merge branch 'feature/7.6.0/DOC-2578' into feature/7.6.0/DOC-2578_TINY-11494

Author: kemister85

modules/ROOT/examples/live-demos/context-toolbar-labels/index.html

@@ -0,0 +1,9 @@
+<textarea id="context-toolbar-labels">
+  <p>Clicking on the example image below will show the newly configured context toolbar.</p>
+
+  {{logofordemoshtml}}
+
+  <p>Select a word in this sentence, to see the other newly configured context toolbar.</p>
+
+  <p>Clicking on text should not invoke the context toolbar</p>
+</textarea>

modules/ROOT/examples/live-demos/context-toolbar-labels/index.js

@@ -0,0 +1,34 @@
+tinymce.init({
+  selector: 'textarea#context-toolbar-labels',
+  height: 350,
+  setup: (editor) => {
+    editor.ui.registry.addContextToolbar('imagealignment', {
+      predicate: (node) => node.nodeName.toLowerCase() === 'img',
+      position: 'node',
+      scope: 'node',
+      items: [
+        {
+          name: 'Formatting',
+          items: ['alignleft', 'aligncenter', 'alignright']
+        },
+        {
+          label: 'Copy',
+          items: ['copy', 'paste']
+        }
+      ],
+    });
+
+    editor.ui.registry.addContextToolbar('textselection', {
+      predicate: (node) => !editor.selection.isCollapsed(),
+      position: 'selection',
+      scope: 'node',
+      items: [
+        {
+          name: 'Format',
+          items: ['bold', 'italic', 'underline']
+        },
+      ],
+    });
+  },
+  content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }'
+});

modules/ROOT/pages/7.6.0-release-notes.adoc

@@ -168,8 +168,41 @@ In {productname} {release-version}, the focus behaviour has now been improved in
 * Creating a new comment within an existing conversation now brings the focus to the corresponding conversation card.
 * Starting a new conversation now brings the focus to the newly created conversation card.
 
+==== Added tooltips to conversation and comment kebab menus
+
+In previous versions of **Comments**, the kebab menu button in the comments sidebar was missing a tooltip for users relying on assistive technologies.
+
+{productname} {release-version} addresses this issue, by adding an `aria-label` with the description "Comment Actions" to the sidebar comment menu button, ensuring a tooltip is displayed on hover. This update improves accessibility and aligns the user experience across different menu buttons.
+
 For information on the **Comments** plugin, see: xref:introduction-to-tiny-comments.adoc[Introduction to {companyname} Comments].
 
+=== Comments
+
+The {productname} {release-version} release includes an accompanying release of the **Comments** premium plugin.
+
+**Comments** Premium plugin includes the following fixes and improvements.
+
+==== The caret in comment textarea returned to its previous location before closing the mentions menu by selecting with the mouse.
+// #TINY-11453
+
+Previously, when closing the Mentions dropdown in a Comment textarea by clicking away, the caret would revert to its previous position, disregarding the user’s mouse-click location. This issue occurred because the logic for handling caret positioning did not account for mouse interactions, resulting in a disjointed and confusing user experience.
+
+In {productname} {release-version} this issue was addressed. Now, the caret now accurately reflects the user’s intended position when the Mentions dropdown is closed via a mouse-click.
+
+For information on the **Comments** plugin, see: xref:introduction-to-tiny-comments.adoc[Introduction to {companyname} Comments].
+
+=== Enhanced Code Editor
+// #TINY-11298
+
+The {productname} {release-version} release includes an accompanying release of the **Enhanced Code Editor** premium plugin.
+
+**Enhanced Code Editor** Premium plugin includes the following fix.
+
+==== Spelling error in tooltip for `fullscreen` toggle button
+
+The tooltip for the `fullscreen` toggle button was incorrectly labeled as `Fullsceen`. {productname} {release-version} addresses this issue which has now been corrected to `Fullscreen`.
+
+For information on the **Enhanced Code Editor** plugin, see: xref:advcode.adoc[Enhanced Code Editor]
 
 [[accompanying-premium-plugin-end-of-life-announcement]]
 == Accompanying Premium plugin end-of-life announcement
@@ -213,7 +246,33 @@ For information on using Enhanced Skins & Icon Packs, see: xref:enhanced-skins-a
 === <TINY-vwxyz 1 changelog entry>
 // #TINY-vwxyz1
 
-== New `+disabled+` option for disabling all user interactions
+=== Add Labels and Groups for Context Toolbar Buttons
+// #TINY-11095
+
+The release of {productname} {release-version} introduces the ability to organize context toolbar buttons into groups with optional labels or titles. This enhancement, available from {productname} 7.6.0 onward, improves toolbar usability by enabling clearer categorization of buttons.
+
+The `items` object structure now supports defining groups with an optional `name` property for titles or a `label` property for identifying the group. This feature allows developers to create more intuitive and accessible toolbars by visually segmenting functionality.
+
+Example of a context toolbar configuration with groups and labels:
+
+.Example
+[source,js]
+----
+items: [
+  {
+    name: 'Formatting', // Optional, used as the group's title
+    items: [ 'bold', 'italic' ] // Array of registered button names
+  },
+  {
+    label: 'History', // Optional, used as a label for the group
+    items: [ 'undo', 'redo' ] // Array of registered button names
+  },
+]
+----
+
+For more details on configuring context toolbar groups and labels, see: xref:contexttoolbar.adoc#add-labels-and-groups-for-context-toolbar-buttons[Context Toolbar].
+
+=== New `+disabled+` option for disabling all user interactions
 
 A new `+disabled+` option has been introduced to {productname} in version {release-version}. This option allows integrators to disable all user interactions with the editor, including cursor placement, content modifications, and UI components. When set to `+true+`, the editor behaves similarly to the readonly mode changes introduced in {productname} 7.4.0 but ensures complete non-interactivity.
 
@@ -245,6 +304,24 @@ A new `+onSetup+` API has been introduced for context forms, enabling integrator
 
 For more details, refer to xref:contextform.adoc#form[Context Form].
 
+=== Added placeholder support for context form input fields
+// #TINY-11459
+
+A new `placeholder` option has been introduced to the context form API, addressing the need for inline guidance within input fields. This feature enables developers to specify placeholder text that appears inside input fields until the field is focused or a value is entered. By providing contextual hints, this enhancement improves usability and enhances the user experience.
+
+.Example: Using a placeholder in a context form input field
+[source,js]
+----
+editor.ui.registry.addContextForm('upload-url', {
+  launch: {
+    type: 'contextformtogglebutton',
+    icon: 'link',
+    tooltip: 'Upload from URL'
+  },
+  placeholder: 'Enter URL here...', ....
+});
+----
+
 
 [[changes]]
 == Changes

modules/ROOT/pages/contexttoolbar.adoc

@@ -27,6 +27,41 @@ This example shows how the quickbars plugin adds the standard selection context
 
 liveDemo::context-toolbar[height="600", tab="js"]
 
+[[add-labels-and-groups-for-context-toolbar-buttons]]
+== Add labels and groups for context toolbar buttons
+
+From {productname} 7.6.0 onward, registering a context toolbar allows specifying `items` as an object that supports grouping with optional names and labels. This improvement enhances toolbar usability by organizing buttons into titled or labeled groups.
+
+The object structure takes two optional properties: `name` and `label`.
+
+* `name`: property is used as the group's title for the group that contains the buttons.
+* `label`: property is used as a label for each group of buttons.
+
+[NOTE]
+If neither `name` nor `label` is specified, the behavior defaults to ungrouped buttons.
+
+The object structure for `items` is as follows:
+
+.Example of a context toolbar configuration with groups and labels
+[source,js]
+----
+items: [
+  {
+    name: 'Formatting', // Optional, used as the group's title
+    items: [ 'bold', 'italic' ] // Array of registered button names
+  },
+  {
+    label: 'History', // Optional, used as a label for the group
+    items: [ 'undo', 'redo' ] // Array of registered button names
+  },
+  {
+    items: [ 'undo', 'italic' ] // No name or label specified, default behavior applies
+  }
+]
+----
+
+liveDemo::context-toolbar-labels[height="600", tab="js"]
+
 == Launching a context toolbar programmatically
 
 There is an `+editor+` event called `+contexttoolbar-show+` that can be fired to show a context toolbar at the current selection. The event takes a parameter `+toolbarKey+` which specifies the name of the registered context form or context toolbar to show.