Skip to content

Commit 403e3a6

Browse files
serhiipylypchuk1991serhiipylypchuk1991
committed
[update] events description
1 parent b573291 commit 403e3a6

34 files changed

Lines changed: 615 additions & 381 deletions

‎docs/api/events/align.md‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -8,33 +8,41 @@ description: You can learn about the align event in the documentation of the DHT
88

99
### Description
1010

11-
@short: Fires when ...
11+
@short: Fires when text alignment is changed via the menubar/toolbar or Event Bus methods
1212

1313
### Usage
1414

1515
~~~jsx {}
16-
"align": ...;
16+
"align": ({
17+
align: "left" | "center" | "right" | "justify"
18+
}) => boolean | void;
1719
~~~
1820

1921
### Parameters
2022

21-
The callback of the **align** event can take an object with the following parameters:
23+
The callback of the **align** event can take an object with the following parameter:
2224

23-
...
25+
- `align` - a text alignment. You can specify one of the following values: `"left" | "center" | "right" | "justify"`
2426

2527
:::info
26-
For handling the inner events you can use the [**Event Bus methods**](api/overview/main_overview.md/#event-bus-methods)
28+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
2729
:::
2830

2931
### Example
3032

31-
~~~jsx {7-9}
32-
// create RichText
33+
~~~jsx {5-12}
34+
// initialize RichText
3335
const editor = new richtext.Richtext("#root", {
34-
...
36+
// configuration parameters
3537
});
3638
// subscribe on the "align" event
3739
editor.api.on("align", (obj) => {
38-
console.log(obj);
40+
console.log(`Align to: ${obj.align}`);
3941
});
42+
// align the text to the left
43+
editor.api.exec("align", {
44+
align: "left"
45+
});
4046
~~~
47+
48+
**Change log:** The event was added in v2.0

‎docs/api/events/clear-text-format.md‎

Lines changed: 12 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,33 +8,31 @@ description: You can learn about the clear-text-format event in the documentatio
88

99
### Description
1010

11-
@short: Fires when ...
11+
@short: Fires when a text format is cleared via the menubar/toolbar or Event Bus methods
1212

1313
### Usage
1414

1515
~~~jsx {}
16-
"clear-text-format": ...;
16+
"clear-text-format": () => boolean | void;
1717
~~~
1818

19-
### Parameters
20-
21-
The callback of the **clear-text-format** event can take an object with the following parameters:
22-
23-
...
24-
2519
:::info
26-
For handling the inner events you can use the [**Event Bus methods**](api/overview/main_overview.md/#event-bus-methods)
20+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
2721
:::
2822

2923
### Example
3024

31-
~~~jsx {7-9}
32-
// create RichText
25+
~~~jsx {5-10}
26+
// initialize RichText
3327
const editor = new richtext.Richtext("#root", {
34-
...
28+
// configuration parameters
3529
});
3630
// subscribe on the "clear-text-format" event
37-
editor.api.on("clear-text-format", (obj) => {
38-
console.log(obj);
31+
editor.api.on("clear-text-format", () => {
32+
console.log("Text format was cleared");
3933
});
34+
// clear text format
35+
editor.api.exec("clear-text-format", {});
4036
~~~
37+
38+
**Change log:** The event was added in v2.0

‎docs/api/events/copy.md‎

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,33 +8,29 @@ description: You can learn about the copy event in the documentation of the DHTM
88

99
### Description
1010

11-
@short: Fires when ...
11+
@short: Fires when copying selected text
1212

1313
### Usage
1414

1515
~~~jsx {}
16-
"copy": ...;
16+
"copy": () => boolean | void;
1717
~~~
1818

19-
### Parameters
20-
21-
The callback of the **copy** event can take an object with the following parameters:
22-
23-
...
24-
2519
:::info
26-
For handling the inner events you can use the [**Event Bus methods**](api/overview/main_overview.md/#event-bus-methods)
20+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
2721
:::
2822

2923
### Example
3024

31-
~~~jsx {7-9}
32-
// create RichText
25+
~~~jsx {5-8}
26+
// initialize RichText
3327
const editor = new richtext.Richtext("#root", {
34-
...
28+
// configuration parameters
3529
});
3630
// subscribe on the "copy" event
37-
editor.api.on("copy", (obj) => {
38-
console.log(obj);
31+
editor.api.on("copy", () => {
32+
console.log("Selected text was copied");
3933
});
4034
~~~
35+
36+
**Change log:** The event was added in v2.0

‎docs/api/events/create-new.md‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,33 +8,37 @@ description: You can learn about the create-new event in the documentation of th
88

99
### Description
1010

11-
@short: Fires when ...
11+
@short: Fires when pressing the "New" option within the menubar or via Event Bus methods
1212

1313
### Usage
1414

1515
~~~jsx {}
16-
"create-new": ...;
16+
"create-new": ({ reset?: boolean }) => boolean | void;
1717
~~~
1818

1919
### Parameters
2020

21-
The callback of the **create-new** event can take an object with the following parameters:
21+
The callback of the **create-new** event can take an object with the following parameter:
2222

23-
...
23+
- `reset` - resets the history when creating a new file
2424

2525
:::info
26-
For handling the inner events you can use the [**Event Bus methods**](api/overview/main_overview.md/#event-bus-methods)
26+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
2727
:::
2828

2929
### Example
3030

31-
~~~jsx {7-9}
32-
// create RichText
31+
~~~jsx {5-10}
32+
// initialize RichText
3333
const editor = new richtext.Richtext("#root", {
34-
...
34+
// configuration parameters
3535
});
3636
// subscribe on the "create-new" event
37-
editor.api.on("create-new", (obj) => {
38-
console.log(obj);
37+
editor.api.on("create-new", ({ reset }) => {
38+
console.log(`Document has been cleared. History has ${reset ? "" : "not"} been reset.`);
3939
});
40+
// create new file and reset the history
41+
editor.api.exec("create-new", { reset: true });
4042
~~~
43+
44+
**Change log:** The event was added in v2.0

‎docs/api/events/cut.md‎

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,33 +8,29 @@ description: You can learn about the cut event in the documentation of the DHTML
88

99
### Description
1010

11-
@short: Fires when ...
11+
@short: Fires when cutting selected text
1212

1313
### Usage
1414

1515
~~~jsx {}
16-
"cut": ...;
16+
"cut": () => boolean | void;
1717
~~~
1818

19-
### Parameters
20-
21-
The callback of the **cut** event can take an object with the following parameters:
22-
23-
...
24-
2519
:::info
26-
For handling the inner events you can use the [**Event Bus methods**](api/overview/main_overview.md/#event-bus-methods)
20+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
2721
:::
2822

2923
### Example
3024

31-
~~~jsx {7-9}
32-
// create RichText
25+
~~~jsx {5-8}
26+
// initialize RichText
3327
const editor = new richtext.Richtext("#root", {
34-
...
28+
// configuration parameters
3529
});
3630
// subscribe on the "cut" event
37-
editor.api.on("cut", (obj) => {
38-
console.log(obj);
31+
editor.api.on("cut", () => {
32+
console.log("Selected text was cut");
3933
});
4034
~~~
35+
36+
**Change log:** The event was added in v2.0

‎docs/api/events/delete-link.md‎

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,33 +8,29 @@ description: You can learn about the delete-link event in the documentation of t
88

99
### Description
1010

11-
@short: Fires when ...
11+
@short: Fires when deleting link
1212

1313
### Usage
1414

1515
~~~jsx {}
16-
"delete-link": ...;
16+
"delete-link": () => boolean | void;
1717
~~~
1818

19-
### Parameters
20-
21-
The callback of the **delete-link** event can take an object with the following parameters:
22-
23-
...
24-
2519
:::info
26-
For handling the inner events you can use the [**Event Bus methods**](api/overview/main_overview.md/#event-bus-methods)
20+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
2721
:::
2822

2923
### Example
3024

31-
~~~jsx {7-9}
32-
// create RichText
25+
~~~jsx {5-8}
26+
// initialize RichText
3327
const editor = new richtext.Richtext("#root", {
34-
...
28+
// configuration parameters
3529
});
3630
// subscribe on the "delete-link" event
37-
editor.api.on("delete-link", (obj) => {
38-
console.log(obj);
31+
editor.api.on("delete-link", () => {
32+
console.log("The link was deleted");
3933
});
4034
~~~
35+
36+
**Change log:** The event was added in v2.0

‎docs/api/events/export.md‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
---
2+
sidebar_label: export
3+
title: export Event
4+
description: You can learn about the export 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+
# export
8+
9+
### Description
10+
11+
@short: Fires after pressing the "Export" option in the menubar or via Event Bus methods
12+
13+
### Usage
14+
15+
~~~jsx {}
16+
"export": ({ options: IExportOptions; result?: any }) => boolean | void;
17+
18+
interface IExportOptions {
19+
format?: "docx" | "pdf";
20+
url?: string;
21+
download?: boolean;
22+
fileName?: string;
23+
}
24+
~~~
25+
26+
### Parameters
27+
28+
The callback of **export** event can take an object with the following parameters:
29+
30+
- `format` - a text format
31+
- `url` - a path to the place the file to be exported
32+
- `download` - an ability to download a file
33+
- `fileName` - a file name to be exported
34+
35+
:::info
36+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
37+
:::
38+
39+
### Example
40+
41+
~~~jsx {5-15}
42+
// initialize RichText
43+
const editor = new richtext.Richtext("#root", {
44+
// configuration parameters
45+
});
46+
// subscribe on the "export" event
47+
editor.api.on("export", (obj) => {
48+
console.log(obj);
49+
console.log("The file was exported");
50+
});
51+
// export value as pdf file
52+
editor.api.exec("export", {
53+
format: "pdf",
54+
download: false,
55+
fileName: "some file"
56+
});
57+
~~~
58+
59+
**Change log:** The event was added in v2.0

‎docs/api/events/import.md‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
---
2+
sidebar_label: import
3+
title: import Event
4+
description: You can learn about the import 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+
# import
8+
9+
### Description
10+
11+
@short: Fires after pressing the "Import" option in the menubar or via Event Bus methods
12+
13+
### Usage
14+
15+
~~~jsx {}
16+
"import": ({ html?: string }) => boolean | void;
17+
~~~
18+
19+
### Parameters
20+
21+
The callback of **import** event can take an object with the following parameter:
22+
23+
- `html` - a text value in the html format
24+
25+
:::info
26+
For handling inner events you can use [**Event Bus methods**](/category/event-bus-methods/)
27+
:::
28+
29+
### Example
30+
31+
~~~jsx {5-13}
32+
// initialize RichText
33+
const editor = new richtext.Richtext("#root", {
34+
// configuration parameters
35+
});
36+
// subscribe on the "import" event
37+
editor.api.on("import", (obj) => {
38+
console.log(obj.html);
39+
console.log("The new value was imported");
40+
});
41+
// import new value
42+
editor.api.exec("import", {
43+
html: "<h2>some value</h2>" // simply calls setValue
44+
});
45+
~~~
46+
47+
**Change log:** The event was added in v2.0

0 commit comments

Comments
 (0)