@d3plus/docs 3.0.5 → 3.0.7

package/args/core/charts/Rings.args.jsx

@@ -27,6 +27,7 @@ export const argTypes = assign(
       control: {
         type: "text"
       },
+      description: "Sets the center node to be the node with the given id.",
       table: {
         defaultValue: {
           summary: "undefined"
@@ -39,6 +40,7 @@ export const argTypes = assign(
     },
     hover: {
       control: {},
+      description: "If *value* is specified, sets the hover method to the specified function and returns the current class instance.",
       table: {
         defaultValue: {
           summary: "undefined"
@@ -51,13 +53,13 @@ export const argTypes = assign(
     },
     links: {
       control: {
-        type: "array"
+        type: "object"
       },
-      defaultValue: "[\n\n]",
-      description: "= []",
+      defaultValue: "[  ]",
+      description: "A predefined *Array* of edges that connect each object passed to the [node](#Rings.node) method. The `source` and `target` keys in each link need to map to the nodes in one of three ways:\n1. The index of the node in the nodes array (as in [this](http://d3plus.org/examples/d3plus-network/getting-started/) example).\n2. The actual node *Object* itself.\n3. A *String* value matching the `id` of the node.\n\nThe value passed should either be an *Array* of data or a *String* representing a filepath or URL to be loaded. An optional formatting function can be passed as a second argument to this method. This custom function will be passed the data that has been loaded, as long as there are no errors. This function should return the final links *Array*.",
       table: {
         defaultValue: {
-          summary: "[\n\n]"
+          summary: "[  ]"
         }
       },
       type: {
@@ -70,6 +72,7 @@ export const argTypes = assign(
         type: "boolean"
       },
       defaultValue: false,
+      description: "Toggles the visibility of the status message that is displayed when no data is supplied to the visualization.",
       table: {
         defaultValue: {
           summary: false
@@ -82,8 +85,9 @@ export const argTypes = assign(
     },
     nodeGroupBy: {
       control: {
-        type: "text"
+        type: "object"
       },
+      description: "If *value* is specified, sets the node group accessor(s) to the specified string, function, or array of values and returns the current class instance. This method overrides the default .groupBy() function from being used with the data passed to .nodes(). If *value* is not specified, returns the current node group accessor.",
       table: {
         defaultValue: {
           summary: "undefined"
@@ -96,13 +100,13 @@ export const argTypes = assign(
     },
     nodes: {
       control: {
-        type: "array"
+        type: "object"
       },
-      defaultValue: "[\n\n]",
-      description: "= []",
+      defaultValue: "[  ]",
+      description: "The list of nodes to be used for drawing the rings network. The value passed should either be an *Array* of data or a *String* representing a filepath or URL to be loaded.\n\nAdditionally, a custom formatting function can be passed as a second argument to this method. This custom function will be passed the data that has been loaded, as long as there are no errors. This function should return the final node *Array*.",
       table: {
         defaultValue: {
-          summary: "[\n\n]"
+          summary: "[  ]"
         }
       },
       type: {
@@ -120,6 +124,7 @@ export const argTypes = assign(
         "mouseleave.shape": "() => {\n  this.hover(false);\n}",
         "mousemove.shape": "(d, i, x, event) => {\n  defaultMouseMove(d, i, x, event);\n  if (this._focus && this._focus === d.id) {\n      this.hover(false);\n      this._on.mouseenter.bind(this)(d, i, x, event);\n      this._focus = undefined;\n  } else {\n      const id = this._nodeGroupBy && this._nodeGroupBy[this._drawDepth](d, i) ? this._nodeGroupBy[this._drawDepth](d, i) : this._id(d, i), links = this._linkLookup[id], node = this._nodeLookup[id];\n      const filterIds = [\n          node.id\n      ];\n      const xDomain = [\n          node.x - node.r,\n          node.x + node.r\n      ], yDomain = [\n          node.y - node.r,\n          node.y + node.r\n      ];\n      links.forEach((l)=>{\n          filterIds.push(l.id);\n          if (l.x - l.r < xDomain[0]) xDomain[0] = l.x - l.r;\n          if (l.x + l.r > xDomain[1]) xDomain[1] = l.x + l.r;\n          if (l.y - l.r < yDomain[0]) yDomain[0] = l.y - l.r;\n          if (l.y + l.r > yDomain[1]) yDomain[1] = l.y + l.r;\n      });\n      this.hover((h, x)=>{\n          if (h.source && h.target) return h.source.id === node.id || h.target.id === node.id;\n          else return filterIds.includes(this._ids(h, x)[this._drawDepth]);\n      });\n  }\n}"
       },
+      description: "Adds or removes a *listener* to each object for the specified event *typenames*. If a *listener* is not specified, returns the currently assigned listener for the specified event *typename*. Mirrors the core [d3-selection](https://github.com/d3/d3-selection#selection_on) behavior.",
       table: {
         defaultValue: {
           summary: {
@@ -140,6 +145,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "Circle",
+      description: "Changes the primary shape used to represent each data point in a visualization. Not all visualizations support changing shapes, this method can be provided the String name of a D3plus shape class (for example, \"Rect\" or \"Circle\"), or an accessor Function that returns the String class name to be used for each individual data point.",
       table: {
         defaultValue: {
           summary: "Circle"
@@ -147,7 +153,7 @@ export const argTypes = assign(
       },
       type: {
         required: false,
-        summary: "function | string"
+        summary: "string | function"
       }
     },
     shapeConfig: {
@@ -155,6 +161,7 @@ export const argTypes = assign(
         type: "object"
       },
       defaultValue: "assign(this._shapeConfig, {ariaLabel: (d, i) => {\n  const validSize = this._size ? `, ${this._size(d, i)}` : \"\";\n  return `${this._drawLabel(d, i)}${validSize}.`;\n}, labelConfig: {duration: 0, fontMin: 1, fontResize: true, labelPadding: 0, textAnchor: middle, verticalAlign: middle}, Path: {fill: none, label: false, stroke: #eee, strokeWidth: 1}})",
+      description: "If *value* is specified, sets the config method for each shape and returns the current class instance.",
       table: {
         defaultValue: {
           detail: "assign(this._shapeConfig, {ariaLabel: (d, i) => {\n  const validSize = this._size ? `, ${this._size(d, i)}` : \"\";\n  return `${this._drawLabel(d, i)}${validSize}.`;\n}, labelConfig: {duration: 0, fontMin: 1, fontResize: true, labelPadding: 0, textAnchor: middle, verticalAlign: middle}, Path: {fill: none, label: false, stroke: #eee, strokeWidth: 1}})",
@@ -170,6 +177,7 @@ export const argTypes = assign(
       control: {
         type: "text"
       },
+      description: "If *value* is specified, sets the size accessor to the specified function or data key and returns the current class instance. If *value* is not specified, returns the current size accessor.",
       table: {
         defaultValue: {
           summary: "undefined"
@@ -184,6 +192,7 @@ export const argTypes = assign(
       control: {
         type: "number"
       },
+      description: "If *value* is specified, sets the size scale maximum to the specified number and returns the current class instance. If *value* is not specified, returns the current size scale maximum. By default, the maximum size is determined by half the distance of the two closest nodes.",
       table: {
         defaultValue: {
           summary: "undefined"
@@ -199,6 +208,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: 5,
+      description: "If *value* is specified, sets the size scale minimum to the specified number and returns the current class instance. If *value* is not specified, returns the current size scale minimum.",
       table: {
         defaultValue: {
           summary: 5
@@ -214,6 +224,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "sqrt",
+      description: "If *value* is specified, sets the size scale to the specified string and returns the current class instance. If *value* is not specified, returns the current size scale.",
       table: {
         defaultValue: {
           summary: "sqrt"

package/args/core/charts/Sankey.args.jsx

@@ -25,6 +25,7 @@ export const argTypes = assign(
   {
     hover: {
       control: {},
+      description: "If *value* is specified, sets the hover method to the specified function and returns the current class instance.",
       table: {
         defaultValue: {
           summary: "undefined"
@@ -37,10 +38,10 @@ export const argTypes = assign(
     },
     links: {
       control: {
-        type: "array"
+        type: "object"
       },
       defaultValue: "d => d[\"links\"]",
-      description: "= []",
+      description: "A predefined *Array* of edges that connect each object passed to the [node](#Sankey.node) method. The `source` and `target` keys in each link need to map to the nodes in one of one way:\n1. A *String* value matching the `id` of the node.\n\nThe value passed should be an *Array* of data. An optional formatting function can be passed as a second argument to this method. This custom function will be passed the data that has been loaded, as long as there are no errors. This function should return the final links *Array*.",
       table: {
         defaultValue: {
           detail: "d => d[\"links\"]",
@@ -57,6 +58,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "source",
+      description: "The key inside of each link Object that references the source node.",
       table: {
         defaultValue: {
           summary: "source"
@@ -72,6 +74,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "target",
+      description: "The key inside of each link Object that references the target node.",
       table: {
         defaultValue: {
           summary: "target"
@@ -87,6 +90,7 @@ export const argTypes = assign(
         type: "boolean"
       },
       defaultValue: false,
+      description: "Toggles the visibility of the status message that is displayed when no data is supplied to the visualization.",
       table: {
         defaultValue: {
           summary: false
@@ -102,6 +106,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "sankeyAligns.justify",
+      description: "Sets the nodeAlign property of the sankey layout, which can either be \"left\", \"right\", \"center\", or \"justify\".",
       table: {
         defaultValue: {
           summary: "sankeyAligns.justify"
@@ -117,6 +122,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "d => d[\"id\"]",
+      description: "If *value* is specified, sets the node id accessor(s) to the specified array of values and returns the current class instance. If *value* is not specified, returns the current node group accessor.",
       table: {
         defaultValue: {
           detail: "d => d[\"id\"]",
@@ -133,6 +139,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: 8,
+      description: "If *value* is specified, sets the padding of the node and returns the current class instance. If *value* is not specified, returns the current nodePadding. By default, the nodePadding size is 8.",
       table: {
         defaultValue: {
           summary: 8
@@ -148,6 +155,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: 30,
+      description: "If *value* is specified, sets the width of the node and returns the current class instance. If *value* is not specified, returns the current nodeWidth. By default, the nodeWidth size is 30.",
       table: {
         defaultValue: {
           summary: 30
@@ -160,10 +168,10 @@ export const argTypes = assign(
     },
     nodes: {
       control: {
-        type: "array"
+        type: "object"
       },
       defaultValue: "d => d[\"nodes\"]",
-      description: "= []",
+      description: "The list of nodes to be used for drawing the network. The value passed must be an *Array* of data.\n\nAdditionally, a custom formatting function can be passed as a second argument to this method. This custom function will be passed the data that has been loaded, as long as there are no errors. This function should return the final node *Array*.",
       table: {
         defaultValue: {
           detail: "d => d[\"nodes\"]",
@@ -184,6 +192,7 @@ export const argTypes = assign(
         "mouseleave.shape": "() => {\n  this.hover(false);\n}",
         "mousemove.shape": "(d, i, x, event) => {\n  defaultMouseMove(d, i, x, event);\n  if (this._focus && this._focus === d.id) {\n      this.hover(false);\n      this._on.mouseenter.bind(this)(d, i, x, event);\n      this._focus = undefined;\n  } else {\n      const id = this._nodeId(d, i), node = this._nodeLookup[id], nodeLookup = Object.keys(this._nodeLookup).reduce((all, item)=>{\n          all[this._nodeLookup[item]] = !isNaN(item) ? parseInt(item, 10) : item;\n          return all;\n      }, {});\n      const links = this._linkLookup[node];\n      const filterIds = [\n          id\n      ];\n      links.forEach((l)=>{\n          filterIds.push(nodeLookup[l]);\n      });\n      this.hover((h, x)=>{\n          if (h.source && h.target) {\n              return h.source.id === id || h.target.id === id;\n          } else {\n              return filterIds.includes(this._nodeId(h, x));\n          }\n      });\n  }\n}"
       },
+      description: "Adds or removes a *listener* to each object for the specified event *typenames*. If a *listener* is not specified, returns the currently assigned listener for the specified event *typename*. Mirrors the core [d3-selection](https://github.com/d3/d3-selection#selection_on) behavior.",
       table: {
         defaultValue: {
           summary: {
@@ -203,6 +212,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "Rect",
+      description: "Changes the primary shape used to represent each data point in a visualization. Not all visualizations support changing shapes, this method can be provided the String name of a D3plus shape class (for example, \"Rect\" or \"Circle\"), or an accessor Function that returns the String class name to be used for each individual data point.",
       table: {
         defaultValue: {
           summary: "Rect"
@@ -210,7 +220,7 @@ export const argTypes = assign(
       },
       type: {
         required: false,
-        summary: "function | string"
+        summary: "string | function"
       }
     },
     shapeConfig: {
@@ -218,6 +228,7 @@ export const argTypes = assign(
         type: "object"
       },
       defaultValue: "assign(this._shapeConfig, {Path: {fill: none, hoverStyle: {stroke-width: (d) => Math.max(1, Math.abs(d.source.y1 - d.source.y0) * (d.value / d.source.value) - 2)}, label: false, stroke: #DBDBDB, strokeOpacity: 0.5, strokeWidth: (d) => Math.max(1, Math.abs(d.source.y1 - d.source.y0) * (d.value / d.source.value) - 2)}, Rect: {}})",
+      description: "If *value* is specified, sets the config method for each shape and returns the current class instance.",
       table: {
         defaultValue: {
           detail: "assign(this._shapeConfig, {Path: {fill: none, hoverStyle: {stroke-width: (d) => Math.max(1, Math.abs(d.source.y1 - d.source.y0) * (d.value / d.source.value) - 2)}, label: false, stroke: #DBDBDB, strokeOpacity: 0.5, strokeWidth: (d) => Math.max(1, Math.abs(d.source.y1 - d.source.y0) * (d.value / d.source.value) - 2)}, Rect: {}})",
@@ -234,6 +245,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: 1,
+      description: "If *value* is specified, sets the width of the links and returns the current class instance. If *value* is not specified, returns the current value accessor.",
       table: {
         defaultValue: {
           summary: 1

package/args/core/charts/Tree.args.jsx

@@ -23,12 +23,32 @@ export const argTypes = assign(
    */
   
   {
+    legendTooltip: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "assign(this._legendTooltip, {title: legendLabel.bind(this)})",
+      description: "If *value* is specified, sets the config method for the legend tooltip and returns the current class instance.",
+      table: {
+        defaultValue: {
+          summary: "assign(this._legendTooltip, {title: legendLabel.bind(this)})"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
     orient: {
       control: {
-        type: "text"
+        type: "radio"
       },
       defaultValue: "vertical",
-      description: "Accepts either \"vertical\" or \"horizontal\".",
+      description: "Changes the orientation of the entire Tree, either \"vertical\" (top to bottom) or \"horizontal\" (left to right).",
+      options: [
+        "vertical",
+        "horizontal"
+      ],
       table: {
         defaultValue: {
           summary: "vertical"
@@ -36,12 +56,13 @@ export const argTypes = assign(
       },
       type: {
         required: false,
-        summary: "string"
+        summary: "'vertical' | 'horizontal'"
       }
     },
     separation: {
       control: {},
       defaultValue: "(a, b) => a.parent === b.parent ? 1 : 2",
+      description: "If *value* is specified, sets the separation accessor to the specified function. If *value* is not specified, returns the current separation accessor.\n\nFrom the [d3-hierarchy documentation](https://github.com/d3/d3-hierarchy#tree_separation):\n> The separation accessor is used to separate neighboring nodes. The separation function is passed two nodes a and b, and must return the desired separation. The nodes are typically siblings, though the nodes may be more distantly related if the layout decides to place such nodes adjacent.",
       table: {
         defaultValue: {
           detail: "(a, b) => a.parent === b.parent ? 1 : 2",
@@ -58,6 +79,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "Circle",
+      description: "Changes the primary shape used to represent each data point in a visualization. Not all visualizations support changing shapes, this method can be provided the String name of a D3plus shape class (for example, \"Rect\" or \"Circle\"), or an accessor Function that returns the String class name to be used for each individual data point.",
       table: {
         defaultValue: {
           summary: "Circle"
@@ -65,17 +87,35 @@ export const argTypes = assign(
       },
       type: {
         required: false,
-        summary: "function | string"
+        summary: "string | function"
       }
     },
     shapeConfig: {
       control: {
         type: "object"
       },
-      defaultValue: "assign(this._shapeConfig, {ariaLabel: (d, i) => this._treeData ? `${this._treeData.i.depth}. ${this._drawLabel(d, i)}.` : , labelConfig: {fontColor: #444}, Path: {fill: none, stroke: #ccc, strokeWidth: 1}, r: 5, width: 10, height: 10})",
+      defaultValue: "assign(this._shapeConfig, {ariaLabel: (d, i) => this._treeData ? `${this._treeData.i.depth}. ${this._drawLabel(d, i)}.` : , labelConfig: {fontColor: colorDefaults.dark}, Path: {fill: none, stroke: colorDefaults.missing, strokeWidth: 2}, r: 7, width: 12, height: 12})",
+      description: "If *value* is specified, sets the config method for each shape and returns the current class instance.",
+      table: {
+        defaultValue: {
+          detail: "assign(this._shapeConfig, {ariaLabel: (d, i) => this._treeData ? `${this._treeData.i.depth}. ${this._drawLabel(d, i)}.` : , labelConfig: {fontColor: colorDefaults.dark}, Path: {fill: none, stroke: colorDefaults.missing, strokeWidth: 2}, r: 7, width: 12, height: 12})",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    tooltipConfig: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "assign(this._tooltipConfig, {title: (d, i, x) => (this._drawLabel(d, i, x.depth - 1))})",
+      description: "If *value* is specified, sets the config method for the tooltip and returns the current class instance.",
       table: {
         defaultValue: {
-          detail: "assign(this._shapeConfig, {ariaLabel: (d, i) => this._treeData ? `${this._treeData.i.depth}. ${this._drawLabel(d, i)}.` : , labelConfig: {fontColor: #444}, Path: {fill: none, stroke: #ccc, strokeWidth: 1}, r: 5, width: 10, height: 10})",
+          detail: "assign(this._tooltipConfig, {title: (d, i, x) => (this._drawLabel(d, i, x.depth - 1))})",
           summary: "function"
         }
       },

package/args/core/charts/Treemap.args.jsx

@@ -28,6 +28,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: 1,
+      description: "If *value* is specified, sets the inner and outer padding accessor to the specified function or number and returns the current class instance. If *value* is not specified, returns the current padding accessor.",
       table: {
         defaultValue: {
           summary: 1
@@ -43,6 +44,7 @@ export const argTypes = assign(
         type: "boolean"
       },
       defaultValue: "(config, arr) => {\n  if (arr.length === this._filteredData.length) return false;\n  return defaultLegend.bind(this)(config, arr);\n}",
+      description: "If *value* is specified, toggles the legend based on the specified boolean and returns the current class instance.",
       table: {
         defaultValue: {
           detail: "(config, arr) => {\n  if (arr.length === this._filteredData.length) return false;\n  return defaultLegend.bind(this)(config, arr);\n}",
@@ -57,6 +59,7 @@ export const argTypes = assign(
     legendSort: {
       control: {},
       defaultValue: "(a, b) => this._sum(b) - this._sum(a)",
+      description: "A JavaScript [sort comparator function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) used to sort the legend.",
       table: {
         defaultValue: {
           detail: "(a, b) => this._sum(b) - this._sum(a)",
@@ -72,10 +75,11 @@ export const argTypes = assign(
       control: {
         type: "object"
       },
-      defaultValue: "assign({}, this._legendTooltip, {tbody: [\n\n]})",
+      defaultValue: "assign({}, this._legendTooltip, {tbody: [  ]})",
+      description: "If *value* is specified, sets the config method for the legend tooltip and returns the current class instance.",
       table: {
         defaultValue: {
-          summary: "assign({}, this._legendTooltip, {tbody: [\n\n]})"
+          summary: "assign({}, this._legendTooltip, {tbody: [  ]})"
         }
       },
       type: {
@@ -88,6 +92,7 @@ export const argTypes = assign(
         type: "object"
       },
       defaultValue: "assign({}, this._shapeConfig, {ariaLabel: (d, i) => {\n  const rank = this._rankData ? `${this._rankData.indexOf(d) + 1}. ` : \"\";\n  return `${rank}${this._drawLabel(d, i)}, ${this._sum(d, i)}.`;\n}, labelConfig: {fontMax: 32, fontMin: 8, fontResize: true, padding: 5}})",
+      description: "If *value* is specified, sets the config method for each shape and returns the current class instance.",
       table: {
         defaultValue: {
           detail: "assign({}, this._shapeConfig, {ariaLabel: (d, i) => {\n  const rank = this._rankData ? `${this._rankData.indexOf(d) + 1}. ` : \"\";\n  return `${rank}${this._drawLabel(d, i)}, ${this._sum(d, i)}.`;\n}, labelConfig: {fontMax: 32, fontMin: 8, fontResize: true, padding: 5}})",
@@ -101,9 +106,10 @@ export const argTypes = assign(
     },
     sort: {
       control: {
-        type: "array"
+        type: "object"
       },
       defaultValue: "(a, b) => {\n  const aggA = isAggregated(a);\n  const aggB = isAggregated(b);\n  return aggA && !aggB ? 1 : !aggA && aggB ? -1 : b.value - a.value;\n}",
+      description: "If *comparator* is specified, sets the sort order for the treemap using the specified comparator function. If *comparator* is not specified, returns the current group sort order, which defaults to descending order by the associated input data's numeric value attribute.",
       table: {
         defaultValue: {
           detail: "(a, b) => {\n  const aggA = isAggregated(a);\n  const aggB = isAggregated(b);\n  return aggA && !aggB ? 1 : !aggA && aggB ? -1 : b.value - a.value;\n}",
@@ -120,6 +126,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: "d => d[\"value\"]",
+      description: "If *value* is specified, sets the sum accessor to the specified function or number and returns the current class instance. If *value* is not specified, returns the current sum accessor.",
       table: {
         defaultValue: {
           detail: "d => d[\"value\"]",
@@ -136,6 +143,7 @@ export const argTypes = assign(
         type: "number"
       },
       defaultValue: "this._sum",
+      description: "If *value* is specified, sets the accesor for the value used in the threshold algorithm, and returns the current class instance.",
       table: {
         defaultValue: {
           summary: "this._sum"
@@ -151,6 +159,7 @@ export const argTypes = assign(
         type: "text"
       },
       defaultValue: "treemapSquarify",
+      description: "Sets the tiling method used when calcuating the size and position of the rectangles.\r\n\r\nCan either be a string referring to a d3-hierarchy [tiling method](https://github.com/d3/d3-hierarchy#treemap-tiling), or a custom function in the same format.",
       table: {
         defaultValue: {
           summary: "treemapSquarify"
@@ -165,10 +174,11 @@ export const argTypes = assign(
       control: {
         type: "object"
       },
-      defaultValue: "assign({}, this._tooltipConfig, {tbody: [\n[\n() => this._translate(Share),\n(d, i, x) => `${formatAbbreviate(x.share * 100, this._locale)}%`\n]\n]})",
+      defaultValue: "assign({}, this._tooltipConfig, {tbody: [ [\n  () => this._translate(Share),\n(d, i, x) => `${formatAbbreviate(x.share * 100, this._locale)}%`\n] ]})",
+      description: "If *value* is specified, sets the config method for the tooltip and returns the current class instance.",
       table: {
         defaultValue: {
-          detail: "assign({}, this._tooltipConfig, {tbody: [\n[\n() => this._translate(Share),\n(d, i, x) => `${formatAbbreviate(x.share * 100, this._locale)}%`\n]\n]})",
+          detail: "assign({}, this._tooltipConfig, {tbody: [ [\n  () => this._translate(Share),\n(d, i, x) => `${formatAbbreviate(x.share * 100, this._locale)}%`\n] ]})",
           summary: "function"
         }
       },