DOC-3147: Update split button documentation

modules/ROOT/examples/live-demos/custom-toolbar-split-button/index.js

@@ -6,7 +6,8 @@ tinymce.init({
     editor.ui.registry.addSplitButton('myButton', {
       text: 'My Button',
       icon: 'info',
-      tooltip: 'This is an example split-button',
+      tooltip: 'Execute my action',
+      chevronTooltip: 'My Button menu options',
       onAction: () => editor.insertContent('<p>You clicked the main button</p>'),
       onItemAction: (api, value) => editor.insertContent(value),
       fetch: (callback) => {

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

@@ -322,6 +322,11 @@ editor.execCommand('ToggleToolbarDrawer', false, null, { skip_focus: true });
 
 For more information on the `ToggleToolbarDrawer` command, see: xref:editor-command-identifiers.adoc[Available Commands].
 
+=== Split buttons are now rendered as separate action and chevron buttons.
+// #TINY-8665
+
+Split buttons in {productname} {release-version} now render as two independent, focusable components instead of a single composite element. The main button performs the primary action, while the chevron button controls the dropdown menu. This design improvement enhances accessibility by allowing separate focus targets and ARIA labels for each button.
+
 === The translate API now automatically replaces three dots in a row with an ellipsis character.
 // #TINY-12155
 
@@ -339,6 +344,12 @@ Comments containing HTML-like content are removed from the editor's content by d
 
 {productname} introduces a new configuration option, xref:content-filtering.adoc#allow_html_in_comments[allow_html_in_comments], to give users control over whether HTML-like content in comments should be retained or removed. By default, this content is removed for security, but setting the option to `true` allows HTML-like content in comments to be preserved when needed.
 
+=== Split button tooltip configuration
+// #TINY-8665
+
+The `+chevronTooltip+` property provides custom tooltip text for the chevron button portion of split buttons. When `+chevronTooltip+` is not specified, {productname} automatically generates tooltip text using the pattern `+"{tooltip} menu"+`. The `+setTooltip+` method updates both main and chevron tooltips to maintain consistency.
+
+For more information, see xref:custom-split-toolbar-button.adoc[Split toolbar buttons].
 
 [[changes]]
 == Changes
@@ -350,7 +361,6 @@ Comments containing HTML-like content are removed from the editor's content by d
 
 // CCFR here.
 
-
 === DomParser no longer tries to fix some nodes when parsed with a context
 // #TINY-8205
 

modules/ROOT/pages/creating-a-skin.adoc

@@ -67,6 +67,8 @@ _Do not edit these files directly_. Instead, use them as references when creatin
 * `+modules/oxide/src/less/theme/components/toolbar-button/toolbar-button.less+`
 
 The typical workflow involves copying variables from the theme folder into the skins `skin.less` file and modifying them as needed.
+
+NOTE: Split buttons have undergone structural changes in {productname} {productmajorversion}. Previously they used a single component structure, but now use separate components for the main button and chevron areas. See xref:migration-from-7x.adoc#split-button-css-breaking-change[split button css breaking change]
 ====
 
 [NOTE]

modules/ROOT/pages/custom-split-toolbar-button.adoc

@@ -13,6 +13,8 @@ A split button contains a basic button and a menu button, wrapped up into one to
 |text |string |Primary button |optional |Text displayed if no icon is found.
 |icon |string |Primary button |optional |
 include::partial$misc/admon-predefined-icons-only.adoc[]
+|tooltip |string |Primary button |optional |Text displayed when hovering over the main button.
+|chevronTooltip |string |Chevron button |optional |Text displayed when hovering over the chevron button. If not provided, it will be generated using the tooltip of the main button. ie: `+"{tooltip} menu"+`.
 |onAction |`+(api) => void+` |Primary button |required |Function invoked when the basic button section is clicked.
 |select |`+(value: string) => boolean+` |Choice menu items |optional |default: `false` - Function run on each option when the menu is opened to determine if it should be highlighted as active.
 |columns |number or `+'auto'+` |Drop-down menu |optional |default: `1` - Number of columns for the list of options. When set to more than 1 column, only the icon for each item will be shown.
@@ -35,6 +37,7 @@ include::partial$misc/admon-predefined-icons-only.adoc[]
 3+|
 |setText |`+(text: string) => void+` |Sets the text label to display.
 |setIcon |`+(icon: string) => void+` |Sets the icon of the button.
+|setTooltip |`+(tooltip: string) => void+` |Sets the main button tooltip.
 |===
 
 [[split-button-example-and-explanation]]