Merge branch 'master' into next

# Conflicts:
#	sidebars.js

Author: AlexKlimenkov

docs/api/config/autosize.md

@@ -24,70 +24,69 @@ gantt.init("gantt_here");
 
 ### Details
 
-The 'autosize' config defines whether the gantt will fit data inside the sizes of container where it's initialized showing inner scrollbars,
-or modify the sizes of container in order to show all data without inner scrolls:
+The `autosize` config defines whether the Gantt will fit data inside the size of the container where it's initialized and show inner scrollbars,
+or modify the size of the container in order to show all data without inner scrolls:
 
-- [a sample with sizes of gantt div defined in css ](https://snippet.dhtmlx.com/5/b4d4d1b80) - inner scrollbars are active if necessary
-- [a sample with sizes of gantt div calculated by a component](https://snippet.dhtmlx.com/5/c278b3859) - inner scrollbars are disabled
+- [a sample with sizes of Gantt div defined in CSS](https://snippet.dhtmlx.com/2m48u5oz) - inner scrollbars are active if necessary
+- [a sample with sizes of Gantt div calculated by a component](https://snippet.dhtmlx.com/syzmiqwt) - inner scrollbars are disabled
 
-In case gantt should fit a certain area on a page, the size of gantt container must be managed manually:
+In case Gantt should fit a certain area on a page, the size of the Gantt container must be managed manually:
 
-- autosizing should be disabled 
-- width/height of a div should be calculated either by html layout if some ready solution for responsive layouts is used, or manually by code.
+- autosizing should be disabled
+- width/height of a div should be calculated either by HTML layout if some ready solution for responsive layouts is used, or manually by code
 
-## Scrolling to hidden elements 
+## Scrolling to hidden elements
 
-In the default mode, Gantt is scrolled automatically when you use the [showTask](api/method/showtask.md) or [showDate](api/method/showdate.md) method.
-But, when **autosize** is enabled, Gantt increases the size of its container to show itself on the page instead of showing the hidden element.
+In the default mode, Gantt is scrolled automatically when you use the [`showTask()`](api/method/showtask.md) or [`showDate()`](api/method/showdate.md) method.
+But, when `autosize` is enabled, Gantt increases the size of its container to show itself on the page instead of showing the hidden element.
 
 There is no any universal way to escape the problem because the page can also include other elements except for Gantt, and some of the elements also need to be scrolled. Therefore, this problem should be solved depending on the page/application configuration.
 
 In a *simple* configuration, Gantt may be located before or after some elements in your application. And it can work correctly if you scroll the page.
 
-In a *complex* configuration, the Gantt container can be placed into other containers which can also be placed in some other containers. 
-In this case, you need to manually scroll only the elements you need. 
+In a *complex* configuration, the Gantt container can be placed into other containers which can also be placed in some other containers.
+In this case, you need to manually scroll only the elements you need.
 
-One of the ways to make the page to be scrolled to the necessary element is use the **element.scrollIntoView** method:
+One of the ways to make the page scroll to the necessary element is to use the `element.scrollIntoView()` method:
 
 ~~~js
-var attr = gantt.config.task_attribute;
-var timelineElement = document.querySelector(".gantt_task_line["+attr+"='"+id+"']");
-if(timelineElement)
-    timelineElement.scrollIntoView({block:"center"});
+const taskAttribute = gantt.config.task_attribute;
+const timelineElement = document.querySelector(`.gantt_task_line[${taskAttribute}='${id}']`);
+
+timelineElement?.scrollIntoView({ block: "center" });
 ~~~
 
 where id is the task ID you need to show.
 
-Another way is to modify the [showTask](api/method/showtask.md) or [showDate](api/method/showdate.md) method of Gantt:
+Another way is to modify the [`showTask()`](api/method/showtask.md) or [`showDate()`](api/method/showdate.md) method of Gantt:
 
 ~~~js
-var showTask = gantt.showTask;
-
-gantt.showTask = function(id){
-  showTask.apply(this, [id]);
-  var attr = gantt.config.task_attribute;
-  var timelineElement = document.querySelector(".gantt_task_line["+attr+"='"+id+"']");
-  if(timelineElement)
-    timelineElement.scrollIntoView({block:"center"});
+const defaultShowTask = gantt.showTask;
+
+gantt.showTask = function(id) {
+    defaultShowTask.apply(this, [id]);
+    const taskAttribute = gantt.config.task_attribute;
+    const timelineElement = document.querySelector(`.gantt_task_line[${taskAttribute}='${id}']`);
+
+    timelineElement?.scrollIntoView({ block: "center" });
 };
 ~~~
 
 or create a custom function to show the task:
 
 ~~~js
-function showTask(id){
-  gantt.showTask(id);
-  var attr = gantt.config.task_attribute;
-  var timelineElement = document.querySelector(".gantt_task_line["+attr+"='"+id+"']");
-    if(timelineElement)
-      timelineElement.scrollIntoView({block:"center"});
-}
+const showTask = (id) => {
+    gantt.showTask(id);
+    const taskAttribute = gantt.config.task_attribute;
+    const timelineElement = document.querySelector(`.gantt_task_line[${taskAttribute}='${id}']`);
+
+    timelineElement?.scrollIntoView({ block: "center" });
+};
 ~~~
 
 :::note
-sample: [Scrolling to the specified element](https://snippet.dhtmlx.com/or73u6a5)
+Sample: [Scrolling to the specified element](https://snippet.dhtmlx.com/or73u6a5)
 :::
 
 ### Related API
 - [autosize_min_width](api/config/autosize_min_width.md)
-

docs/api/config/date_format.md

@@ -25,27 +25,23 @@ gantt.load("/data/tasks");
 
 ### Details
 
-This config value is used to generate [parse_date](api/template/parse_date.md) and [format_date](api/template/format_date.md) template functions. 
-If you want to use a custom format, you can either change this config, or redefine **parse_date** and **format_date** templates directly.
+This config value is used to generate [`parse_date`](api/template/parse_date.md) and [`format_date`](api/template/format_date.md) template functions.
+If you want to use a custom format, you can either change this config, or redefine `parse_date` and `format_date` templates directly.
 
 ## Loading dates in ISO format
 
-Since v9.1.3, Gantt automatically detects and parses ISO 8601 date strings. The `date_format` config is not needed for ISO strings - they are recognized and parsed directly. 
+Since v9.1.3, Gantt automatically detects and parses ISO 8601 date strings. The `date_format` config is not needed for ISO strings - they are recognized and parsed directly.
 
-When ISO dates are detected on input, they are serialized back as ISO strings automatically when passed to the [DataProcessor](guides/server-side.md). Date-only strings (e.g., `"2026-01-06"`) are serialized back as date-only strings, preserving the original format.
+When ISO dates are detected on input, they are serialized back as ISO strings automatically when passed to the [DataProcessor](api/method/dataprocessor.md). Date-only strings (e.g., `"2026-01-06"`) are serialized back as date-only strings, preserving the original format.
 
 The `date_format` config still applies to non-ISO date strings.
 
 :::tip Gantt v9.1.2 and earlier
 In versions before v9.1.3, ISO dates were not detected automatically. If you are using an older version, you need to override `parse_date` and `format_date` templates to handle ISO strings:
 
 ~~~js
-gantt.templates.parse_date = function(date) {
-    return new Date(date);
-};
-gantt.templates.format_date = function(date) {
-    return date.toISOString();
-};
+gantt.templates.parse_date = (date) => new Date(date);
+gantt.templates.format_date = (date) => date.toISOString();
 ~~~
 
 :::
@@ -54,15 +50,13 @@ For more details, see [Loading dates in ISO format](guides/loading.md#loading-da
 
 ## Changing the date format dynamically
 
-If you need to change the date format dynamically, it is necessary to modify the [parse_date](api/template/parse_date.md) template in the following way:
+If you need to change the date format dynamically, it is necessary to modify the [`parse_date`](api/template/parse_date.md) template in the following way:
 
 ~~~js
-const cfg = gantt.config;
-const strToDate = gantt.date.str_to_date(cfg.date_format, cfg.server_utc);
+const config = gantt.config;
+const parseDate = gantt.date.str_to_date(config.date_format, config.server_utc);
 
-gantt.templates.parse_date = function(date){
-    return strToDate (date);
-};
+gantt.templates.parse_date = (date) => parseDate(date);
 ~~~
 
 ### Related API
@@ -71,4 +65,3 @@ gantt.templates.parse_date = function(date){
 
 ### Related Guides
 - [Date Format Specification](guides/date-format.md)
-

docs/api/method/attachevent.md

@@ -24,8 +24,8 @@ description: "attaches the handler to an inner event of dhtmlxGantt"
 ### Example
 
 ~~~jsx
-gantt.attachEvent("onTaskClick", function(id, e) {
-    alert("You've just clicked an item with id="+id);
+gantt.attachEvent("onTaskClick", (id, e) => {
+    alert(`You've just clicked an item with id=${id}`);
 });
 ~~~
 
@@ -35,47 +35,46 @@ gantt.attachEvent("onTaskClick", function(id, e) {
 ### Details
 
 You can attach several handlers to the same event and all of them will be executed.
-If some of handlers will return *false* - the related operation will be blocked.
+If some of the handlers return *false*, the related operation will be blocked.
 Event handlers are processed in the same order that they were attached.
 
-
-## Properties of settings object 
+## Properties of settings object
 
 The settings object can contain the following properties:
 
-- **id?** - (*string | number*) - the id of the event handler.
+- `id?` - (*string | number*) - the id of the event handler.
 For example, you can easily detach a handler from the specified event:
 
-~~~js
-gantt.attachEvent("onTaskClick", function(){
+~~~js {3}
+gantt.attachEvent("onTaskClick", () => {
     console.log("task click");
-}, {id: "my-click"}); /*!*/
-... //after a while:
+}, { id: "my-click" });
+
+// after a while
 gantt.detachEvent("my-click");
 ~~~
 
-- **once?** - (*boolean*) - defines whether the event will be executed only once.
+- `once?` - (*boolean*) - defines whether the event will be executed only once.
 Set the property to *true* if you want to capture the first triggering of the event, as in:
 
-~~~js
-gantt.attachEvent("onTaskClick", function(){
+~~~js {4}
+gantt.attachEvent("onTaskClick", () => {
     console.log("capture next task click");
     return true;
-}, {once: true}); /*!*/
+}, { once: true });
 ~~~
 
-- **thisObject?** - (*any*) - specifies the `this` object for the listener.
+- `thisObject?` - (*any*) - specifies the `this` object for the listener.
 
-~~~js
-gantt.attachEvent("onTaskClick", function(){
+~~~js {4}
+gantt.attachEvent("onTaskClick", function() {
     // ...
     return true;
-}, {thisObject: this}); /*!*/
+}, { thisObject: this });
 ~~~
 
 ### Related API
 - [detachEvent](api/method/detachevent.md)
 
 ### Related Guides
 - [Event Handling](guides/handling-events.md)
-

docs/api/method/updatetask.md

@@ -20,65 +20,62 @@ description: "updates the specified task"
 ### Example
 
 ~~~jsx
-var taskId = gantt.addTask({
-    id:10,
-    text:"Task #10",
-    start_date:"02-04-2013",
-    duration:8,
-    parent:1
+const taskId = gantt.addTask({
+    id: 10,
+    text: "Task #10",
+    start_date: "2027-04-02",
+    duration: 8,
+    parent: 1
 });
 
-gantt.getTask(taskId).text = "Task #13"; //changes task's data
-gantt.updateTask(taskId); //renders the updated task
+gantt.getTask(taskId).text = "Task #13"; // changes task data
+gantt.updateTask(taskId); // renders the updated task
 ~~~
 
 ### Details
 
 :::note
-The method invokes the [onAfterTaskUpdate](api/event/onaftertaskupdate.md) event. 
+The method invokes the [`onAfterTaskUpdate`](api/event/onaftertaskupdate.md) event.
 :::
 
 :::note
-The method triggers the [DataProcessor](guides/server-side.md) if the dataProcessor is enabled. 
+The method triggers the [DataProcessor](api/method/dataprocessor.md) if the dataProcessor is enabled.
 :::
 
 This method should be called after modifying the task object to update the Gantt's state, repaint related UI elements, and send the changes to the backend.
 
-Calling this method will fire the [onAfterTaskUpdate](api/event/onaftertaskupdate.md) event, which may trigger additional recalculations.
+Calling this method will fire the [`onAfterTaskUpdate`](api/event/onaftertaskupdate.md) event, which may trigger additional recalculations.
 
-If you're using the [DataProcessor](guides/server-side.md), invoking this method will prompt an **update** request to the server.
+If you're using the [DataProcessor](api/method/dataprocessor.md), invoking this method will prompt an **update** request to the server.
 
-For making visual changes that don't require saving, **use the [refreshTask](api/method/refreshtask.md) method instead**. This will repaint the task without invoking extra calculations.
+For making visual changes that don't require saving, **use the [`refreshTask()`](api/method/refreshtask.md) method instead**. This will repaint the task without invoking extra calculations.
 
-~~~js
-gantt.templates.task_class = function(start, end, task){
-    if(task.$active) {
-        return "active_task";
-    }
-};
+~~~js {5}
+gantt.templates.task_class = (startDate, endDate, task) => task.$active ? "active_task" : "";
 
-gantt.attachEvent("onTaskClick", function(id,e){
-    gantt.getTask(id).$active = true;
-    gantt.refreshTask(id); /*!*/
+gantt.attachEvent("onTaskClick", (taskId, event) => {
+    gantt.getTask(taskId).$active = true;
+    gantt.refreshTask(taskId);
 });
 ~~~
 
-
-You can also replace the existing task with new values via setting a new task object as the second parameter of the **updateTask** method: 
+You can also replace the existing task with new values by setting a new task object as the second parameter of the `updateTask()` method:
 
 ~~~js
-var task = {
-    id: 2, text: 'New task text', 
-    start_date: new Date(2025,03,02), 
-    end_date: new Date(2025,03,04), 
-    $source: [1], 
+const updatedTask = {
+    id: 2,
+    text: 'New task text',
+    start_date: new Date(2025, 3, 2),
+    end_date: new Date(2025, 3, 4),
+    $source: [1],
     $target: [2]
-}
-gantt.updateTask(2,task);
+};
+
+gantt.updateTask(2, updatedTask);
 ~~~
 
 :::note
-sample: [Updating task ](https://snippet.dhtmlx.com/fnfpoiik)
+Sample: [Updating task](https://snippet.dhtmlx.com/fnfpoiik)
 :::
 
 ### Related API
@@ -88,4 +85,3 @@ sample: [Updating task ](https://snippet.dhtmlx.com/fnfpoiik)
 
 ### Related Guides
 - [Server-Side Integration](guides/server-side.md)
-