[update] headerShape.cellStyle updated, number formatting upd

Author: tbshag2

docs/api/config/headershape-property.md

@@ -16,7 +16,14 @@ description: You can learn about the headerShape config in the documentation of
 headerShape?: {
     collapsible?: boolean,
     vertical?: boolean,
-    template?: (label: string, field: string, subLabel?: string) => string
+    template?: (label: string, field: string, subLabel?: string) => string,
+    cellStyle?: (
+        field: string, 
+        value: any, 
+        area: "rows"|"columns"|"values", 
+        method?: string,
+        isTotal?: boolean) 
+        => string,
 };
 ~~~
 
@@ -28,7 +35,7 @@ headerShape?: {
     - `field` (string) - (required) a string representing the field name the cell corresponds to. For the header of the tree column the field is ""
     - `value` (string | number | date) - (required) the value of a cell 
     - `area` - (required) a string indicating the area of the table where a cell resides ("rows", "columns" or "values" area)
-    - `method` string - (optional) a string that can represent the operation performed for a field from the "values` area (e.g., "sum", "count", etc.) or the name of a predicate set for a field from the "columns" area
+    - `method` (string) - (optional) a string that can represent the operation performed for a field from the "values` area (e.g., "sum", "count", etc.) or the name of a predicate set for a field from the "columns" area
     - `isTotal` - (optional) defines whether a cell belongs to a total column
 - `template` - (optional) defines the format of text in headers. By default, for the fields applied as rows the value of the `label` parameter is displayed and for the fields applied as values the label and method are shown (e.g., *Oil(count)*). The function takes the field id, label and the method or predicate id (if any) and returns the processed value. The default template is as follows: 
 ~~~js
@@ -58,7 +65,7 @@ const table = new pivot.Pivot("#root", {
     },
     headerShape: {
         vertical: true,
-        template: (label, field, subLabel) => field + (subLabel ? ` (${subLabel})` : "")
+        template: (label, field, subLabel) => field + (subLabel ? ` (${subLabel})` : ""),
     }
 });
 ~~~

docs/api/config/tableshape-property.md

@@ -39,7 +39,13 @@ tableShape?: {
         left?: boolean,
         right?: boolean,
     },
-    cellStyle?: (field: string, value: any, area: string, method?: string, isTotal?: string) => string,
+    cellStyle?: (
+    field: string, 
+    value: any, 
+    area: "rows"|"columns"|"values", 
+    method?: string,
+    isTotal?: "row"|"column"|"both") 
+    => string,
 };
 ~~~
 

docs/guides/localization.md

@@ -267,20 +267,15 @@ To present the 20th of June, 2024 with the exact time as *2024-09-20 16:47:08.12
 
 ## Number formatting
 
-By default, all fields with the *number* type are localized according to the locale (the value in the `lang` field of the locale). The [`Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) object enables language-sensitive number formatting. In case you need to set a custom format to a specific field, use the `format` parameter of the [`fields`](/api/config/fields-property) property. By default, the format for numeric values limits fraction digits to 3 and applies group separation for the integer part. The `format` parameter allows you to display numeric values without group separation (for example, years):
+By default, all fields with the number type are localized according to the locale (the value in the `lang` field of the locale). Pivot uses [`Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) specification. By default the fraction digits are limited to 3 and group separation is applied for the integer part. 
+In case you do not need to format specific fields with numeric values or need to set a custom format, use the the `format` parameter of the [`fields`](/api/config/fields-property) property. It can be either *false* to cancel formatting or an object with format settings (refer to [Custom number formatting](/guides/custom-formatting/#custom-number-formatting)). 
 
-~~~js
+~~~jsx
 const fields = [
      { id: "year", label: "Year", type: "number", format: false},
 ];
 ~~~
 
-For more information, refer to [Custom number formatting](/guides/custom-formatting/#custom-number-formatting).
-
-:::info
-In case you need to disable formatting of some fields, set the `format` parameter of the [`fields`](/api/config/fields-property) property to *false*. 
-:::
-
 ## Example
 
 In this snippet you can see how to switch between several locales:

docs/guides/stylization.md

@@ -155,6 +155,16 @@ const widget = new pivot.Pivot("#pivot", {
 });
 ~~~
 
+It's also possible to customize the style of total columns and total rows via the `wx-total` class:
+
+~~~html
+<style>
+    .wx-cell.wx-total {
+        background: #fafafb;
+        font-weight: var(--wx-header-font-weight);
+    }
+</style>
+~~~
 
 ## Marking cells