Skip to content

Commit f9b18e8

Browse files
serhiipylypchuk1991serhiipylypchuk1991
authored
Merge pull request #49 from DHTMLX/next
2 parents af58b1f + 0a77eb6 commit f9b18e8

4 files changed

Lines changed: 85 additions & 3 deletions

File tree

‎docs/api/config/toolbar.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,8 @@ You can specify the following buttons in the RichText toolbar:
4040
| `outdent` | Decreases paragraph indentation. |
4141
| `line-height` | Adjusts the line spacing (line height). |
4242
| `quote` | Formats the text as a blockquote. |
43-
| `bulleted-list` | Creates a bulleted list. |
44-
| `numbered-list` | Creates a numbered list. |
43+
| `bulleted-list` | Toggles the bulleted list on/off |
44+
| `numbered-list` | Toggles the numbered list on/off |
4545
| `link` | Inserts a hyperlink. |
4646
| `image` | Inserts an image. |
4747
| `line` | Inserts a horizontal line. |

‎docs/api/events/toggle-list.md‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
---
2+
sidebar_label: toggle-list
3+
title: toggle-list Event
4+
description: You can learn about the toggle-list event in the documentation of the DHTMLX JavaScript RichText library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX RichText.
5+
---
6+
7+
# toggle-list
8+
9+
### Description
10+
11+
@short: Fires when the user toggles a list on the selected blocks
12+
13+
The `toggle-list` event powers the context-aware bulleted/numbered list buttons. Instead of inserting a new list, the event inspects the current selection and picks one of four behaviors automatically:
14+
15+
| Mode | When it fires | Result |
16+
| ----------- | --------------------------------------------------------------- | ------------------------------------------------------------------- |
17+
| **Wrap** | The selection covers only paragraphs | Each paragraph becomes a list item inside one new list container |
18+
| **Unwrap** | Every covered item is in a list of the clicked type | The items revert to paragraphs; the list container is removed |
19+
| **Convert** | Every covered item is in a list, but at least one of the lists is of the other type | The list flips its type (bulleted ↔ numbered) in place |
20+
| **Mixed** | The selection mixes paragraphs and list items | Paragraphs become items and everything joins one list of the type |
21+
22+
### Usage
23+
24+
~~~jsx {}
25+
"toggle-list": ({ type: TListType }) => boolean | void;
26+
27+
type TListType = "bulleted" | "numbered";
28+
~~~
29+
30+
### Parameters
31+
32+
The callback of the `toggle-list` event can take an object with the following parameter:
33+
34+
- `type` - the type of the list to toggle. You can specify the following values:
35+
- `"bulleted"` - bulleted (unordered) list
36+
- `"numbered"` - numbered (ordered) list
37+
38+
:::info
39+
To handle inner events, use [**Event Bus methods**](api/overview/event_bus_methods_overview.md)
40+
:::
41+
42+
### Example
43+
44+
~~~jsx {5-9}
45+
// initialize RichText
46+
const editor = new richtext.Richtext("#root", {
47+
// configuration properties
48+
});
49+
// subscribe to the "toggle-list" event
50+
editor.api.on("toggle-list", (obj) => {
51+
console.log(obj.type);
52+
console.log("The list was toggled");
53+
});
54+
~~~
55+
56+
**Change log:** The event was added in v2.0.6

‎docs/api/overview/events_overview.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ You can use these events to extend functionality, track user interaction, or tri
4040
| [](api/events/superscript.md) | @getshort(api/events/superscript.md) |
4141
| [](api/events/toggle-fullscreen-mode.md) | @getshort(api/events/toggle-fullscreen-mode.md)|
4242
| [](api/events/toggle-layout-mode.md) | @getshort(api/events/toggle-layout-mode.md) |
43+
| [](api/events/toggle-list.md) | @getshort(api/events/toggle-list.md) |
4344
| [](api/events/toggle-shortcut-info.md) | @getshort(api/events/toggle-shortcut-info.md) |
4445
| [](api/events/undo.md) | @getshort(api/events/undo.md) |
4546
| [](api/events/update-link.md) | @getshort(api/events/update-link.md) |

‎docs/news/whats_new.md‎

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,33 @@ sidebar_label: What's new
33
title: What's new
44
description: You can explore what's new in DHTMLX RichText and its release history in the documentation of the DHTMLX JavaScript UI library. Browse developer guides and API reference, try out code examples and live demos, and download a free 30-day evaluation version of DHTMLX RichText.
55
---
6+
## Version 2.0.6
67

7-
## Version 2.0.5
8+
Released on May 28, 2026
9+
10+
### New functionality
11+
12+
- Context-aware OL/UL toolbar buttons that toggle or convert lists based on the selection
13+
- Changing list nesting level with the **Indent** and **Outdent** buttons
14+
- Exiting a list or reducing its nesting by pressing Enter in an empty list item
15+
- Distinct color for visited links
16+
17+
### New API
18+
19+
#### New events
20+
21+
- [`toggle-list`](api/events/toggle-list.md) — Fires when toggling a list on the selected blocks
22+
23+
### Fixes
24+
25+
- Incorrect horizontal alignment of list markers
26+
- Inconsistent padding between numbered and bulleted lists
27+
- Clear formatting does not clear block-level properties
28+
- Incorrect styling of headings and blockquotes inside list items
29+
- Stray input element visible inside horizontal lines
30+
- Editor freezes when inserting a horizontal line in the middle or at the end of a list
31+
32+
## Version 2.0.5
833

934
Released on March 6, 2026
1035

0 commit comments

Comments
 (0)