@d3plus/docs 3.0.0-alpha.3

package/args/core/components/Tooltip.args.jsx

@@ -0,0 +1,453 @@
+// WARNING: do not edit this file directly, it is generated dynamically from
+// the source JSDOC comments using the npm run docs script.
+
+import React from "react";
+import {argTypes as baseClassArgTypes} from "../utils/BaseClass.args.jsx";
+import {assign} from "@d3plus/dom";
+
+import {Tooltip as D3plusTooltip} from "@d3plus/react";
+export const Tooltip = ({ config }) => <D3plusTooltip config={config} />;
+
+export const argTypes = assign(
+
+  /**
+   * Filters out unused argTypes from the BaseClass primitive and
+   * overrides any defaults that have been changed in Tooltip
+   */
+  Object.keys(baseClassArgTypes)
+    .reduce((obj, k) => (obj[k] = baseClassArgTypes[k], obj), {}),
+
+  /**
+   * Tooltip-specific methods
+   */
+  
+  {
+    arrow: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "d => d[\"arrow\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"arrow\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    arrowStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{content: , background: inherit, border: inherit, border-width: 0 1px 1px 0, height: 10px, position: absolute, transform: rotate(45deg), width: 10px, z-index: -1}",
+      table: {
+        defaultValue: {
+          summary: "{content: , background: inherit, border: inherit, border-width: 0 1px 1px 0, height: 10px, position: absolute, transform: rotate(45deg), width: 10px, z-index: -1}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    background: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "colorDefaults.light",
+      table: {
+        defaultValue: {
+          summary: "colorDefaults.light"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    body: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "d => d[\"body\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"body\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    bodyStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{font-size: 12px, font-weight: 400, z-index: 1}",
+      table: {
+        defaultValue: {
+          summary: "{font-size: 12px, font-weight: 400, z-index: 1}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    border: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "1px solid rgba(0, 0, 0, 0.25)",
+      table: {
+        defaultValue: {
+          summary: "1px solid rgba(0, 0, 0, 0.25)"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    borderRadius: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "4px",
+      table: {
+        defaultValue: {
+          summary: "4px"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    className: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "d3plus-tooltip",
+      table: {
+        defaultValue: {
+          summary: "d3plus-tooltip"
+        }
+      },
+      type: {
+        required: false,
+        summary: "string"
+      }
+    },
+    data: {
+      control: {
+        type: "array"
+      },
+      defaultValue: "[\n\n]",
+      table: {
+        defaultValue: {
+          summary: "[\n\n]"
+        }
+      },
+      type: {
+        required: false,
+        summary: "array"
+      }
+    },
+    footer: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "d => d[\"footer\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"footer\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    footerStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{font-size: 9px, font-weight: 400, margin-top: 5px, z-index: 1}",
+      table: {
+        defaultValue: {
+          summary: "{font-size: 9px, font-weight: 400, margin-top: 5px, z-index: 1}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    height: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "auto",
+      table: {
+        defaultValue: {
+          summary: "auto"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    id: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "(d, i) => `${i}`",
+      table: {
+        defaultValue: {
+          detail: "(d, i) => `${i}`",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    offset: {
+      control: {
+        type: "number"
+      },
+      defaultValue: 5,
+      table: {
+        defaultValue: {
+          summary: 5
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number"
+      }
+    },
+    padding: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "10px",
+      table: {
+        defaultValue: {
+          summary: "10px"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    pointerEvents: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "auto",
+      table: {
+        defaultValue: {
+          summary: "auto"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    position: {
+      control: {
+        type: "array"
+      },
+      defaultValue: "(d) => [\nd.x,\nd.y\n]",
+      table: {
+        defaultValue: {
+          detail: "(d) => [\nd.x,\nd.y\n]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | array | htmlelement | string"
+      }
+    },
+    tableStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{border-collapse: collapse, border-spacing: 0, width: 100%}",
+      table: {
+        defaultValue: {
+          summary: "{border-collapse: collapse, border-spacing: 0, width: 100%}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    tbody: {
+      control: {
+        type: "array"
+      },
+      defaultValue: "[\n\n]",
+      table: {
+        defaultValue: {
+          summary: "[\n\n]"
+        }
+      },
+      type: {
+        required: false,
+        summary: "array"
+      }
+    },
+    tbodyStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{font-size: 12px, text-align: center}",
+      table: {
+        defaultValue: {
+          summary: "{font-size: 12px, text-align: center}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    tdStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{}",
+      table: {
+        defaultValue: {
+          summary: "{}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    thead: {
+      control: {
+        type: "array"
+      },
+      defaultValue: "[\n\n]",
+      table: {
+        defaultValue: {
+          summary: "[\n\n]"
+        }
+      },
+      type: {
+        required: false,
+        summary: "array"
+      }
+    },
+    theadStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{font-size: 12px, font-weight: 600, text-align: center}",
+      table: {
+        defaultValue: {
+          summary: "{font-size: 12px, font-weight: 600, text-align: center}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    title: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "d => d[\"title\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"title\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    titleStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{font-size: 14px, font-weight: 600, margin-bottom: 5px}",
+      table: {
+        defaultValue: {
+          summary: "{font-size: 14px, font-weight: 600, margin-bottom: 5px}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    tooltipStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), color: colorDefaults.dark, font-family: fontFamilyStringify(fontFamily)}",
+      table: {
+        defaultValue: {
+          summary: "{box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), color: colorDefaults.dark, font-family: fontFamilyStringify(fontFamily)}"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    trStyle: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "{border-top: (d, i) => i ? 1px solid rgba(0, 0, 0, 0.1) : none}",
+      table: {
+        defaultValue: {
+          detail: "{border-top: (d, i) => i ? 1px solid rgba(0, 0, 0, 0.1) : none}",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    width: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "150px",
+      table: {
+        defaultValue: {
+          summary: "150px"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    }
+  }
+);

package/args/core/shapes/Area.args.jsx

@@ -0,0 +1,190 @@
+// WARNING: do not edit this file directly, it is generated dynamically from
+// the source JSDOC comments using the npm run docs script.
+
+import React from "react";
+import {argTypes as shapeArgTypes} from "./Shape.args.jsx";
+import {assign} from "@d3plus/dom";
+
+import {Area as D3plusArea} from "@d3plus/react";
+export const Area = ({ config }) => <D3plusArea config={config} />;
+
+export const argTypes = assign(
+
+  /**
+   * Filters out unused argTypes from the Shape primitive and
+   * overrides any defaults that have been changed in Area
+   */
+  Object.keys(shapeArgTypes)
+    .reduce((obj, k) => (obj[k] = shapeArgTypes[k], obj), {}),
+
+  /**
+   * Area-specific methods
+   */
+  
+  {
+    curve: {
+      control: {
+        type: "text"
+      },
+      defaultValue: "linear",
+      table: {
+        defaultValue: {
+          summary: "linear"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | string"
+      }
+    },
+    defined: {
+      control: {},
+      defaultValue: "() => true",
+      table: {
+        defaultValue: {
+          detail: "() => true",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function"
+      }
+    },
+    labelBounds: {
+      control: {},
+      defaultValue: "(d, i, aes) => {\n  const r = largestRect(aes.points);\n  if (!r) return null;\n  return {\n      angle: r.angle,\n      width: r.width,\n      height: r.height,\n      x: r.cx - r.width / 2 - this._x(d, i),\n      y: r.cy - r.height / 2 - this._y(d, i)\n  };\n}",
+      description: "The given function is passed the data point, index, and internally defined properties of the shape and should return an object containing the following values: `width`, `height`, `x`, `y`. If an array is returned from the function, each value will be used in conjunction with each label.",
+      table: {
+        defaultValue: {
+          detail: "(d, i, aes) => {\n  const r = largestRect(aes.points);\n  if (!r) return null;\n  return {\n      angle: r.angle,\n      width: r.width,\n      height: r.height,\n      x: r.cx - r.width / 2 - this._x(d, i),\n      y: r.cy - r.height / 2 - this._y(d, i)\n  };\n}",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function"
+      }
+    },
+    labelConfig: {
+      control: {
+        type: "object"
+      },
+      defaultValue: "Object.assign(this._labelConfig, {textAnchor: middle, verticalAlign: middle})",
+      table: {
+        defaultValue: {
+          summary: "Object.assign(this._labelConfig, {textAnchor: middle, verticalAlign: middle})"
+        }
+      },
+      type: {
+        required: false,
+        summary: "object"
+      }
+    },
+    render: {
+      control: {},
+      table: {
+        defaultValue: {
+          summary: "undefined"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function"
+      }
+    },
+    x: {
+      control: {
+        type: "number"
+      },
+      defaultValue: "d => d[\"x\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"x\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number"
+      }
+    },
+    x0: {
+      control: {
+        type: "number"
+      },
+      defaultValue: "d => d[\"x\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"x\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number"
+      }
+    },
+    x1: {
+      control: {
+        type: "number"
+      },
+      defaultValue: "null",
+      table: {
+        defaultValue: {
+          summary: "null"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number | null"
+      }
+    },
+    y: {
+      control: {
+        type: "number"
+      },
+      defaultValue: 0,
+      table: {
+        defaultValue: {
+          summary: 0
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number"
+      }
+    },
+    y0: {
+      control: {
+        type: "number"
+      },
+      defaultValue: 0,
+      table: {
+        defaultValue: {
+          summary: 0
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number"
+      }
+    },
+    y1: {
+      control: {
+        type: "number"
+      },
+      defaultValue: "d => d[\"y\"]",
+      table: {
+        defaultValue: {
+          detail: "d => d[\"y\"]",
+          summary: "function"
+        }
+      },
+      type: {
+        required: false,
+        summary: "function | number | null"
+      }
+    }
+  }
+);