Replace instances of lodash.range with native code

Author: carbonrobot

packages/victory-area/src/victory-area.test.tsx

@@ -1,8 +1,8 @@
 import { fireEvent, render, screen } from "@testing-library/react";
-import { range } from "lodash";
 import React from "react";
 import { Area, VictoryArea, VictoryAreaProps } from "victory-area";
 import { VictoryChart } from "victory-chart";
+import { Helpers } from 'victory-core';
 import { curveCatmullRom } from "victory-vendor/d3-shape";
 import { calculateD3Path } from "../../../test/helpers/svg";
 
@@ -115,7 +115,7 @@ describe("components/victory-area", () => {
         scale: "linear",
         interpolation: "linear",
         sortKey: "x",
-        data: range(5)
+        data: Helpers.range(5)
           // eslint-disable-next-line max-nested-callbacks
           .map((i) => ({ x: i, y: i, y0: 0 }))
           .reverse(),
@@ -145,7 +145,7 @@ describe("components/victory-area", () => {
         interpolation: "linear",
         sortKey: "x",
         sortOrder: "descending",
-        data: range(5)
+        data: Helpers.range(5)
           .map((i) => ({ x: i, y: i, y0: 0 }))
           .reverse(),
       };

packages/victory-bar/src/victory-bar.test.tsx

@@ -1,8 +1,9 @@
 import * as React from "react";
 import { render, fireEvent, screen } from "@testing-library/react";
-import { range } from "lodash";
 import { VictoryChart } from "victory-chart";
 import { Bar, VictoryBar } from "victory-bar";
+import { Helpers } from "victory-core";
+
 import { isBar, getBarHeight } from "../../../test/helpers";
 
 describe("components/victory-bar", () => {
@@ -70,14 +71,14 @@ describe("components/victory-bar", () => {
 
   describe("rendering data", () => {
     it("renders bars for {x, y} shaped data (default)", () => {
-      const data = range(10).map((i) => ({ x: i, y: i }));
+      const data = Helpers.range(10).map((i) => ({ x: i, y: i }));
       const { container } = render(<VictoryBar data={data} />);
       const bars = container.querySelectorAll("path");
       expect(bars.length).toEqual(10);
     });
 
     it("renders ordered bars when sortKey is passed", () => {
-      const data = range(5)
+      const data = Helpers.range(5)
         .map((i) => ({ x: i, y: i }))
         .reverse();
       const { container } = render(<VictoryBar data={data} sortKey="x" />);
@@ -94,7 +95,7 @@ describe("components/victory-bar", () => {
     });
 
     it("renders reverse ordered bars when sortOrder is descending", () => {
-      const data = range(5)
+      const data = Helpers.range(5)
         .map((i) => ({ x: i, y: i }))
         .reverse();
       const { container } = render(
@@ -112,14 +113,16 @@ describe("components/victory-bar", () => {
     });
 
     it("renders bars for array-shaped data", () => {
-      const data = range(20).map((i) => [i, i]);
+      const data = Helpers.range(20).map((i) => [i, i]);
       const { container } = render(<VictoryBar data={data} x={0} y={1} />);
       const bars = container.querySelectorAll("path");
       expect(bars).toHaveLength(20);
     });
 
     it("renders bars for deeply-nested data", () => {
-      const data = range(8).map((i) => ({ a: { b: [{ x: i, y: i }] } }));
+      const data = Helpers.range(8).map((i) => ({
+        a: { b: [{ x: i, y: i }] },
+      }));
       const { container } = render(
         <VictoryBar data={data} x="a.b[0].x" y="a.b[0].y" />,
       );
@@ -128,7 +131,7 @@ describe("components/victory-bar", () => {
     });
 
     it("renders bars values with null accessor", () => {
-      const data = range(8);
+      const data = Helpers.range(8);
       const { container } = render(
         // @ts-expect-error "'null' is not assignable to 'x'"
         <VictoryBar data={data} x={null} y={null} />,
@@ -249,14 +252,14 @@ describe("components/victory-bar", () => {
 
   describe("accessibility", () => {
     it("adds an aria role to each bar in the series", () => {
-      const data = range(10).map((y, x) => ({ x, y }));
+      const data = Helpers.range(10).map((y, x) => ({ x, y }));
       render(<VictoryBar data={data} />);
       const presentationElements = screen.getAllByRole("presentation");
       expect(presentationElements).toHaveLength(11); // bars plus container
     });
 
     it("applies aria-label and tabIndex to the Bar primitive", () => {
-      const data = range(5, 11).map((y, x) => ({ y, x }));
+      const data = Helpers.range(5, 11).map((y, x) => ({ y, x }));
       const { container } = render(
         <VictoryBar
           data={data}

packages/victory-candlestick/src/helper-methods.test.ts

@@ -1,6 +1,6 @@
-import { range } from "lodash";
 import { fromJS } from "immutable";
 import { getData, getDomain } from "victory-candlestick/lib/helper-methods";
+import { Helpers } from "victory-core";
 
 const immutableGetDataTest = {
   createData: (x) => fromJS(x),
@@ -16,7 +16,7 @@ const getDataTest = {
     describe("getData", () => {
       it("sorts data by sortKey", () => {
         const data = createData(
-          range(5)
+          Helpers.range(5)
             .map((i) => ({ x: i, open: i, close: i, high: i, low: i }))
             .reverse(),
         );

packages/victory-candlestick/src/victory-candlestick.test.tsx

@@ -1,8 +1,8 @@
 import { fireEvent, render, screen } from "@testing-library/react";
-import { range } from "lodash";
 import React from "react";
 import { Candle, VictoryCandlestick } from "victory-candlestick";
 import { VictoryChart } from "victory-chart";
+import { Helpers } from "victory-core";
 
 const MyCandle = () => <div data-testid="my-candle" />;
 
@@ -66,7 +66,7 @@ describe("components/victory-candlestick", () => {
 
   describe("rendering data", () => {
     it("renders injected points for {x, y} shaped data (default)", () => {
-      const data = range(5).map((i) => ({
+      const data = Helpers.range(5).map((i) => ({
         x: i,
         open: i,
         close: i,
@@ -80,7 +80,7 @@ describe("components/victory-candlestick", () => {
     });
 
     it("renders points for {x, y} shaped data (default)", () => {
-      const data = range(5).map((i) => ({
+      const data = Helpers.range(5).map((i) => ({
         x: i,
         open: i,
         close: i,
@@ -93,7 +93,7 @@ describe("components/victory-candlestick", () => {
     });
 
     it("renders ordered bars when sortKey is passed", () => {
-      const data = range(5)
+      const data = Helpers.range(5)
         .map((i) => ({ x: i, open: i, close: i, high: i, low: i }))
         .reverse();
       const { container } = render(
@@ -108,7 +108,7 @@ describe("components/victory-candlestick", () => {
     });
 
     it("renders reverse ordered bars when sortOrder is descending", () => {
-      const data = range(5)
+      const data = Helpers.range(5)
         .map((i) => ({ x: i, open: i, close: i, high: i, low: i }))
         .reverse();
       const { container } = render(
@@ -123,7 +123,7 @@ describe("components/victory-candlestick", () => {
     });
 
     it("renders points for array-shaped data", () => {
-      const data = range(10).map((i) => [i, i, i, i, i]);
+      const data = Helpers.range(10).map((i) => [i, i, i, i, i]);
       const { container } = render(
         <VictoryCandlestick
           data={data}
@@ -139,7 +139,7 @@ describe("components/victory-candlestick", () => {
     });
 
     it("renders points for deeply-nested data", () => {
-      const data = range(20).map((i) => ({
+      const data = Helpers.range(20).map((i) => ({
         a: { b: [{ x: i, open: i, close: i, high: i, low: i }] },
       }));
       const { container } = render(
@@ -157,7 +157,7 @@ describe("components/victory-candlestick", () => {
     });
 
     it("renders data values with null accessor", () => {
-      const data = range(10);
+      const data = Helpers.range(10);
       const { container } = render(
         // @ts-expect-error "'null' is not assignable to 'x'"
         <VictoryCandlestick

packages/victory-core/src/victory-util/axis.tsx

@@ -6,7 +6,6 @@ import {
   isObject,
   invert,
   uniq,
-  range,
   orderBy,
   values,
   includes,
@@ -207,7 +206,7 @@ function getTickArray(props) {
   if (tickValues && Collection.containsStrings(tickValues)) {
     ticks = stringMap
       ? tickValues.map((tick) => stringMap[tick])
-      : range(1, tickValues.length + 1);
+      : Helpers.range(1, tickValues.length + 1);
   }
   const tickArray = ticks ? uniq(ticks) : getTicksFromFormat();
   const buildTickArray = (arr: number[]) => {

packages/victory-core/src/victory-util/data.test.tsx

@@ -336,6 +336,16 @@ describe("victory-util/data", () => {
       expect(returnData).toEqual(generatedReturn);
     });
 
+    it("generates a dataset from negative domain", () => {
+      const generatedReturn = [
+        { x: -10, y: 0 },
+        { x: 10, y: 10 },
+      ];
+      const props = { x: "x", y: "y", domain: { x: [-10, 10], y: [0, 10] } };
+      const returnData = Data.generateData(props);
+      expect(returnData).toEqual(generatedReturn);
+    });
+
     it("generates a dataset from domain and samples", () => {
       const generatedReturn = [
         { x: 0, y: 0 },

packages/victory-core/src/victory-util/data.ts

@@ -2,7 +2,6 @@
 import React from "react";
 import {
   uniq,
-  range,
   last,
   isFunction,
   isPlainObject,
@@ -46,7 +45,7 @@ function generateDataArray(props, axis) {
   const domainMax = Math.max(...domain);
   const domainMin = Math.min(...domain);
   const step = (domainMax - domainMin) / samples;
-  const values = range(domainMin, domainMax, step);
+  const values = Helpers.range(domainMin, domainMax, step);
   return last(values) === domainMax ? values : values.concat(domainMax);
 }
 

packages/victory-core/src/victory-util/helpers.test.ts

@@ -202,4 +202,29 @@ describe("victory-util/helpers", () => {
       expect(undefinedAccessor(14)).toEqual(14);
     });
   });
+
+  describe("range", () => {
+    it("returns an array of length n", () => {
+      expect(Helpers.range(5)).toHaveLength(5);
+    });
+
+    it("returns an array of length for non-positive n", () => {
+      expect(Helpers.range(0)).toHaveLength(0);
+      expect(Helpers.range(-1)).toHaveLength(1);
+      expect(Helpers.range(-4)).toHaveLength(4);
+    });
+
+    it("returns an array of integers from 0 to n - 1", () => {
+      expect(Helpers.range(5)).toEqual([0, 1, 2, 3, 4]);
+    });
+
+    it('returns an array of integers from start to end exclusive', () => {
+      expect(Helpers.range(2, 5)).toEqual([2, 3, 4]);
+    });
+
+    it('returns an array of integers using an increment', () => {
+      expect(Helpers.range(0, 20, 5)).toEqual([0, 5, 10, 15]);
+      expect(Helpers.range(-10, 20, 5)).toEqual([-10, -5, 0, 5, 10, 15]);
+    });
+  });
 });

packages/victory-core/src/victory-util/helpers.ts

@@ -217,6 +217,26 @@ export function getCurrentAxis(axis, horizontal) {
   return horizontal ? otherAxis : axis;
 }
 
+/**
+ * Creates an array of numbers
+ * @param start The length of the array to create, or the start value
+ * @param end [The end value] If this is defined, start is the start value
+ * @returns An array of the given length
+ */
+export function range(start: number, end?: number, increment?: number) {
+  if (end === undefined) {
+    return Array.from({length: start}, (_, i) => i);
+  }
+
+  const inc = increment || 1;
+  const ordinal = (end - start) / Math.abs(end - start);
+
+  return Array.from(
+    Array(Math.abs(end - start) + 1),
+    (_, i) => start + i * ordinal * inc,
+  );
+}
+
 /**
  * @param {Array} children: an array of child components
  * @param {Function} iteratee: a function with arguments "child", "childName", and "parent"

packages/victory-core/src/victory-util/point-path-helpers.ts

@@ -1,5 +1,6 @@
 /* eslint no-magic-numbers: ["error", { "ignore": [0, 1, 2, 2.5, 3] }]*/
-import { range } from "lodash";
+
+import * as Helpers from "./helpers";
 
 export function circle(x: number, y: number, size: number) {
   return `M ${x}, ${y}
@@ -110,7 +111,7 @@ export function star(x: number, y: number, size: number) {
   const baseSize = 1.35 * size; // eslint-disable-line no-magic-numbers
   const angle = Math.PI / 5; // eslint-disable-line no-magic-numbers
   // eslint-disable-next-line no-magic-numbers
-  const starCoords = range(10).map((index) => {
+  const starCoords = Helpers.range(10).map((index) => {
     const length = index % 2 === 0 ? baseSize : baseSize / 2;
     return `${length * Math.sin(angle * (index + 1)) + x},
         ${length * Math.cos(angle * (index + 1)) + y}`;

packages/victory-errorbar/src/victory-errorbars.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { fromJS } from "immutable";
-import { range } from "lodash";
 import React from "react";
+import { Helpers } from "victory-core";
 import { ErrorBar, VictoryErrorBar } from "victory-errorbar";
 import * as d3Scale from "victory-vendor/d3-scale";
 
@@ -78,7 +78,12 @@ describe("components/victory-errorbar", () => {
       describe(`symmetric error, rendering data ${testLabel}`, () => {
         it("renders injected errors for {x, y}", () => {
           const data = createData(
-            range(10).map((i) => ({ x: i, y: i, errorX: 0.1, errorY: 0.2 })),
+            Helpers.range(10).map((i) => ({
+              x: i,
+              y: i,
+              errorX: 0.1,
+              errorY: 0.2,
+            })),
           );
           render(<VictoryErrorBar data={data} {...defaultProps} />);
 
@@ -88,7 +93,12 @@ describe("components/victory-errorbar", () => {
 
         it("renders errors for {x, y}", () => {
           const data = createData(
-            range(10).map((i) => ({ x: i, y: i, errorX: 0.1, errorY: 0.2 })),
+            Helpers.range(10).map((i) => ({
+              x: i,
+              y: i,
+              errorX: 0.1,
+              errorY: 0.2,
+            })),
           );
           render(<VictoryErrorBar data={data} {...defaultProps} />);
           const errors = screen.getAllByTestId("error-bar");
@@ -97,7 +107,7 @@ describe("components/victory-errorbar", () => {
 
         it("sorts data by sortKey getAttribute", () => {
           const data = createData(
-            range(5)
+            Helpers.range(5)
               .map((i) => ({ x: i, y: i, errorX: 0.1, errorY: 0.2 }))
               .reverse(),
           );
@@ -110,7 +120,7 @@ describe("components/victory-errorbar", () => {
 
         it("reversed sorted data with the sortOrder getAttribute", () => {
           const data = createData(
-            range(5)
+            Helpers.range(5)
               .map((i) => ({ x: i, y: i, errorX: 0.1, errorY: 0.2 }))
               .reverse(),
           );
@@ -550,7 +560,7 @@ describe("components/victory-errorbar", () => {
       describe(`asymmetric error, rendering data ${testLabel}`, () => {
         it("renders injected errors for {x, y}", () => {
           const data = createData(
-            range(10).map((i) => ({
+            Helpers.range(10).map((i) => ({
               x: i,
               y: i,
               errorX: [0.1, 0.2],
@@ -565,7 +575,7 @@ describe("components/victory-errorbar", () => {
 
         it("renders errors for {x, y}", () => {
           const data = createData(
-            range(10).map((i) => ({
+            Helpers.range(10).map((i) => ({
               x: i,
               y: i,
               errorX: [0.1, 0.2],