[update] usage in props updated, configuration and working with data …

…updated

docs/api/config/fields-property.md

@@ -18,7 +18,7 @@ The `fields` property in the configuration object controls how the widget interp
 fields?: [{
    id: string,
    label?: string,
-   type: string,
+   type: "number" | "date" | "text",
    sort?: "asc" | "desc" | ((a: any, b: any) => number),   
 }];
 ~~~

docs/api/config/headershape-property.md

@@ -16,7 +16,7 @@ description: You can learn about the headerShape config in the documentation of
 headerShape?: {
   collapsible?: boolean,
   vertical?: boolean,
-  template?: (label: string, fieldId: string, subLabel?: string) => string
+  template?: (label: string, field: string, subLabel?: string) => string
 };
 ~~~
 
@@ -54,7 +54,7 @@ const pivotWidget = new pivot.Pivot("#pivot", {
 
   headerShape: {
     vertical: true,
-    template: (label, fieldId, subLabel) => fieldId + (subLabel ? ` (${subLabel})` : ""),
+    template: (label, field, subLabel) => field + (subLabel ? ` (${subLabel})` : ""),
   },
 });
 ~~~

docs/api/config/methods-property.md

@@ -17,8 +17,8 @@ description: You can learn about the methods config in the documentation of the
     [method: string]:
     {
       type?: 'number' | 'date' | 'text' | [],
-      label?:string,
-      handler?: (values: number[]|string[]|Date[]) => any,
+      label?: string,
+      handler?: (values: number[]) => number,
       branchMode?: "raw"|"result",
       branchMath?: string
     },

docs/api/config/tableshape-property.md

@@ -15,7 +15,7 @@ description: You can learn about the tableShape config in the documentation of t
 ~~~jsx
 tableShape?: {
     templates?: {
-    [fieldName: string]: (
+    [field: string]: (
       value: any,
       operation: string
     ) => any;

docs/guides/configuration.md

@@ -22,7 +22,7 @@ You can configure the *Pivot* appearance and functionality via the corresponding
 
 All instructions about working with data see here: [Working with data](guides/working-with-data)
 
-## Table
+## Datatable 
 
 You can configure and/or customize the following elements of the Pivot table:
 
@@ -31,7 +31,7 @@ You can configure and/or customize the following elements of the Pivot table:
 - cells
 - the table sizes
 
-### Resizing the Pivot table
+### Resizing the table
 
 You can change the size of the table rows and columns, header and footer using the [`tableShape`](/api/config/tableshape-property) property.
 
@@ -212,7 +212,37 @@ pivotWidget.api.on("render-table", (tableConfig) => {
 });
 ~~~
 
-### Switching to the tree mode
+### Sorting in columns
+
+The sorting functionality is enabled by default. A user can click the column's header to sort data. To disable/enable sorting, apply the `sort` parameter of the [`columnShape`](/api/config/columnshape-property) property. In the example below we disable sorting.
+
+~~~jsx {19}
+const pivotWidget = new pivot.Pivot("#pivot", {
+  fields,
+  data,
+  config: {
+    rows: ["studio", "genre"],
+    columns: [],
+    values: [
+      {
+        field: "title",
+        method: "count",
+      },
+      {
+        field: "score",
+        method: "max",
+      },
+    ],
+  },
+  columnShape: {
+    sort: false, 
+  },
+});
+~~~
+
+For more information about sorting data, refer to [Sorting data](/guides/working-with-data#sorting-data).
+
+### Enabling the tree mode
 
 The widget allows presenting data in a hierarchical format with expandable rows. To switch to the tree mode, apply the `tree` parameter of the [`tableShape`](/api/config/tableshape-property) property by setting its value to **true** (default is **false**).
 To specify the parent row, put its name first in the `rows` array of the [`config`](/api/config/config-property) property. 
@@ -357,36 +387,7 @@ const widget = new pivot.Pivot("#pivot", {
 });
 ~~~
 
-### Setting date format
-
-tbd!
-Pivot uses the following characters for setting the date format:
-
-| Character | Definition                                        |Example                  |
-| :-------- | :------------------------------------------------ |:------------------------|
-| %d        | day as a number with leading zero                 | from 01 to 31           |
-| %j        | day as a number                                   | from 1 to 31            |
-| %D        | short name of the day (abbreviation)              | Su Mo Tu Sat            |
-| %l        | full name of the day                              | Sunday Monday Tuesday   |
-| %m        | month as a number with leading zero               | from 01 to 12           |
-| %n        | month as a number                                 | from 1 to 12            |
-| %M        | short name of the month                           | Jan Feb Mar             |
-| %F        | full name of the month                            | January February March  |
-| %y        | year as a number, 2 digits                        | 24                      |
-| %Y        | year as a number, 4 digits                        | 2024                    |
-| %h        | hours 12-format with leading zero                 | from 01 to 12           |
-| %g        | hours 12-format                                   | from 1 to 12            |
-| %H        | hours 24-format with leading zero                 | from 00 to 23           |
-| %G        | hours 24-format                                   | from 0 to 23            |
-| %i        | minutes with leading zero                         | from 01 to 59           |
-| %s        | seconds with leading zero                         | from 01 to 59           |
-| %a        | am or pm                                          | am (for time from midnight until noon) and pm (for time from noon until midnight)|
-| %A        | AM or PM                                          | AM (for time from midnight until noon) and PM (for time from noon until midnight)|
-| %u        | milliseconds                                      | 128                     |
-
-To present the 20th of June, 2024 with the exact time as *2024-09-20 16:47:08.128*, specify "%Y-%m-%d-%H:%i:%s.%u".
-
-You can set the date format using the Pivot locale. 
+
 
 ## Configuration panel
 

docs/guides/loading-exporting-data.md

@@ -306,6 +306,10 @@ document.body.appendChild(exportButton);
 
 The Pivot accepts a date that is parsed into the Date object. By default, the `dateFormat` of the current locale is applied. To redefine the format, change the value of the `dateFormat` property in the **Locale** tag. 
 
+Example:
+
+to be added
+
 Pivot uses the following characters for setting the date format:
 
 | Character | Definition                                        |Example                  |
@@ -332,6 +336,4 @@ Pivot uses the following characters for setting the date format:
 
 To present the 20th of June, 2024 with the exact time as *2024-09-20 16:47:08.128*, specify "%Y-%m-%d-%H:%i:%s.%u".
 
-Example:
 
-to be added

docs/guides/working-with-data.md

@@ -58,7 +58,7 @@ const widget = new pivot.Pivot("#pivot", {
 
 ## Sorting data
 
-The widget API allows configuring sorting settings and the sorting is applied to all areas (values, columns and rows) during aggregation. The sorting in UI is enabled by clicking the column header.
+The widget API allows configuring the sorting settings that are applied applied to all areas (values, columns and rows) during aggregation. The sorting in UI is enabled by clicking the column header.
 
 To set default sorting values, apply the **sort** parameter of the [`fields`](/api/properties/fields-property) property. It accepts either the "asc" or "desc" value, or a custom sorting function.
 
@@ -120,7 +120,7 @@ const widget = new pivot.Pivot("#pivot", {
 });
 ~~~
 
-To make the sorting possible in UI by clicking the column header, apply the `sort` parameter of the [`columnShape`](/api/config/columnshape-property) property. In the example below we disable sorting.
+The sorting functionality is enabled by default. A user can click the column's header to sort data. To disable/enable sorting, apply the `sort` parameter of the [`columnShape`](/api/config/columnshape-property) property. In the example below we disable sorting.
 
 ~~~jsx {19}
 const pivotWidget = new pivot.Pivot("#pivot", {