victory-core 37.1.1 → 37.2.0

package/src/victory-util/style.ts

@@ -1,3 +1,8 @@
+import {
+  VictoryTheme,
+  VictoryThemeDefinition,
+} from "../victory-theme/victory-theme";
+
 /**
  * Given an object with CSS/SVG transform definitions, return the string value
  * for use with the `transform` CSS property or SVG attribute. Note that we
@@ -33,29 +38,39 @@ export const toTransformString = function (obj, ...more) {
  * of 5 hex string values in that color scale. If no 'name' parameter
  * is given, it will return the Victory default grayscale.
  * @param {String} name The name of the color scale to return (optional).
+ * @param {Object} theme The theme object to retrieve the color scale from (optional).
  * @returns {Array} An array of 5 hex string values composing a color scale.
  */
-export function getColorScale(name) {
-  const scales = {
-    grayscale: ["#cccccc", "#969696", "#636363", "#252525"],
-    qualitative: [
-      "#334D5C",
-      "#45B29D",
-      "#EFC94C",
-      "#E27A3F",
-      "#DF5A49",
-      "#4F7DA1",
-      "#55DBC1",
-      "#EFDA97",
-      "#E2A37F",
-      "#DF948A",
-    ],
-    heatmap: ["#428517", "#77D200", "#D6D305", "#EC8E19", "#C92B05"],
-    warm: ["#940031", "#C43343", "#DC5429", "#FF821D", "#FFAF55"],
-    cool: ["#2746B9", "#0B69D4", "#2794DB", "#31BB76", "#60E83B"],
-    red: ["#FCAE91", "#FB6A4A", "#DE2D26", "#A50F15", "#750B0E"],
-    blue: ["#002C61", "#004B8F", "#006BC9", "#3795E5", "#65B4F4"],
-    green: ["#354722", "#466631", "#649146", "#8AB25C", "#A9C97E"],
+export function getColorScale(
+  name?: string,
+  theme: VictoryThemeDefinition = VictoryTheme.material,
+) {
+  const {
+    palette: {
+      grayscale = ["#cccccc", "#969696", "#636363", "#252525"],
+      qualitative = [],
+      heatmap = [],
+      warm = [],
+      cool = [],
+      red = [],
+      blue = [],
+      green = [],
+    } = {},
+  } = theme;
+
+  const scales: Record<string, string[]> = {
+    grayscale,
+    qualitative,
+    heatmap,
+    warm,
+    cool,
+    red,
+    blue,
+    green,
   };
-  return name ? scales[name] : scales.grayscale;
+
+  const selectedScale =
+    name && scales[name]?.length ? scales[name] : scales.grayscale;
+
+  return selectedScale;
 }

package/src/victory-util/textsize.ts

@@ -4,6 +4,7 @@ import { defaults, memoize } from "lodash";
 
 // Based on measuring specific character widths
 // as in the following example https://bl.ocks.org/tophtucker/62f93a4658387bb61e4510c37e2e97cf
+// For new fonts: pull gist, open index.html locally, add font files (if not generic), enter font name in `font-family` input
 // prettier-ignore
 const fonts = {
   "American Typewriter": {
@@ -62,6 +63,10 @@ const fonts = {
     widths: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0.2359375,0.2234375,0.3921875,0.7125,0.49375,0.8859375,0.771875,0.2125,0.3078125,0.309375,0.375,0.4234375,0.234375,0.3125,0.234375,0.3,0.5828125,0.365625,0.434375,0.3921875,0.5234375,0.3984375,0.5125,0.4328125,0.46875,0.5125,0.234375,0.234375,0.515625,0.4234375,0.515625,0.340625,0.7609375,0.7359375,0.6359375,0.721875,0.8125,0.6375,0.5875,0.8078125,0.853125,0.4296875,0.503125,0.78125,0.609375,0.9609375,0.8515625,0.8140625,0.6125,0.8140625,0.71875,0.49375,0.7125,0.76875,0.771875,1.125,0.7765625,0.7734375,0.65625,0.321875,0.3078125,0.321875,0.3546875,0.5,0.3375,0.446875,0.5359375,0.45,0.5296875,0.4546875,0.425,0.4921875,0.54375,0.2671875,0.240625,0.5390625,0.25,0.815625,0.5375,0.5234375,0.5390625,0.5421875,0.365625,0.36875,0.35625,0.5171875,0.5015625,0.75,0.5,0.509375,0.44375,0.2421875,0.14375,0.2421875,0.35],
     avg: 0.5116447368421051
   },
+  "Inter": {
+    widths: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0.2796875,0.2890625,0.4671875,0.634375,0.6421875,0.9828125,0.6453125,0.3,0.365625,0.365625,0.5015625,0.6625,0.2890625,0.4609375,0.2890625,0.3609375,0.63125,0.4078125,0.6109375,0.61875,0.646875,0.59375,0.6203125,0.5671875,0.61875,0.6203125,0.2890625,0.303125,0.6625,0.6625,0.6625,0.5125,0.9671875,0.690625,0.6546875,0.73125,0.721875,0.6015625,0.590625,0.746875,0.74375,0.26875,0.571875,0.671875,0.565625,0.9046875,0.7546875,0.765625,0.6390625,0.765625,0.64375,0.6421875,0.646875,0.7453125,0.690625,0.9859375,0.6828125,0.6796875,0.6296875,0.365625,0.3609375,0.365625,0.471875,0.45625,0.3234375,0.5625,0.6125,0.571875,0.6125,0.584375,0.3703125,0.6140625,0.5921875,0.2421875,0.2548828125,0.55,0.2421875,0.8765625,0.5921875,0.6,0.6125,0.6125,0.3765625,0.528125,0.328125,0.5921875,0.5625,0.81875,0.546875,0.5625,0.553125,0.4265625,0.3328125,0.4265625,0.6625],
+    avg: 0.5624362664473683
+  },
   "Montserrat": {
     widths: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0.2625,0.2609375,0.3734375,0.696875,0.615625,0.8296875,0.6703125,0.203125,0.3296875,0.3296875,0.3875,0.575,0.2125,0.3828125,0.2125,0.3953125,0.6625,0.3625,0.56875,0.5640625,0.6625,0.5671875,0.609375,0.5890625,0.6390625,0.609375,0.2125,0.2125,0.575,0.575,0.575,0.5671875,1.034375,0.7171875,0.7546875,0.7203125,0.8265625,0.6703125,0.634375,0.7734375,0.8140625,0.303125,0.5078125,0.7125,0.5890625,0.95625,0.8140625,0.8390625,0.71875,0.8390625,0.7234375,0.615625,0.575,0.7921875,0.6984375,1.1125,0.65625,0.6359375,0.6515625,0.31875,0.396875,0.31875,0.5765625,0.5,0.6,0.590625,0.678125,0.5640625,0.678125,0.6046875,0.375,0.6875,0.678125,0.2703125,0.365625,0.6015625,0.2703125,1.0625,0.678125,0.628125,0.678125,0.678125,0.4015625,0.4890625,0.40625,0.6734375,0.5421875,0.8796875,0.534375,0.5671875,0.5125,0.334375,0.2953125,0.334375,0.575],
     avg: 0.571792763157895

package/src/victory-util/wrapper.tsx

@@ -298,7 +298,8 @@ export function getAllEvents(props) {
   return events || [];
 }
 
-export function getColor(calculatedProps, child, index) {
+// eslint-disable-next-line max-params
+export function getColor(calculatedProps, child, index, theme) {
   // check for styles first
   const { style } = calculatedProps;
   let { colorScale, color } = calculatedProps;
@@ -313,7 +314,7 @@ export function getColor(calculatedProps, child, index) {
   }
   const colors = Array.isArray(colorScale)
     ? colorScale
-    : Style.getColorScale(colorScale);
+    : Style.getColorScale(colorScale, theme);
   return color || colors[index % colors.length];
 }
 
@@ -323,7 +324,8 @@ export function getStyle(theme, style, role) {
   return Helpers.getStyles(style, defaultStyle);
 }
 
-export function getChildStyle(child, index, calculatedProps) {
+// eslint-disable-next-line max-params
+export function getChildStyle(child, index, calculatedProps, theme) {
   const { style, role } = calculatedProps;
   const childStyle = child.props.style || {};
   if (Array.isArray(childStyle)) {
@@ -331,7 +333,9 @@ export function getChildStyle(child, index, calculatedProps) {
   }
   const childRole = child.type && child.type.role;
   const defaultFill =
-    childRole === "stack" ? undefined : getColor(calculatedProps, child, index);
+    childRole === "stack"
+      ? undefined
+      : getColor(calculatedProps, child, index, theme);
   const defaultColor =
     childRole === "line"
       ? { fill: "none", stroke: defaultFill }