@spscommerce/ds-react-charts 0.0.0-20260319-8230915ce

package/lib/lineChart/SpsLineChart.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+import type { ScaleConfig } from "@visx/scale";
+import type { CommonProps, AxisScale } from "@visx/axis/lib/types";
+import type { AxisScaleOutput } from "@visx/axis";
+import type { GridProps } from "@visx/xychart/lib/components/grid/Grid";
+import type { LineChartColors } from "@spscommerce/ds-shared";
+export interface LinesChartProps {
+    data: LineChartData[];
+    name: string;
+    color: LineChartColors;
+    strokeDashArray?: boolean;
+}
+export interface LineChartData {
+    x: number;
+    y: number;
+}
+export interface LineTooltipProps {
+    yAxisName?: string;
+    xLineName?: string;
+    value?: number;
+}
+export type SpsLineChartProps = React.PropsWithChildren<{
+    barTooltip?: (props: LineTooltipProps) => JSX.Element;
+    grid?: GridProps;
+    labels: string[];
+    lines?: LinesChartProps[];
+    xAxis?: CommonProps<AxisScale>;
+    xScale: ScaleConfig<AxisScaleOutput, any, any>;
+    yAxis?: CommonProps<AxisScale>;
+    yScale: ScaleConfig<AxisScaleOutput, any, any>;
+}> & React.HTMLAttributes<HTMLDivElement>;
+export declare function SpsLineChart(props: SpsLineChartProps): React.JSX.Element;

package/lib/lineChart/SpsLineChart.examples.d.ts

@@ -0,0 +1,2 @@
+import type { DSReactExamples } from "@spscommerce/ds-shared";
+export declare const SpsLineChartExamples: DSReactExamples;

package/lib/manifest.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentManifest } from "@spscommerce/ds-shared";
+export declare const MANIFEST: ComponentManifest;

package/lib/prop-types.d.ts

@@ -0,0 +1,22 @@
+import type { MutableRefObject, HTMLProps } from "react";
+import * as PropTypes from "prop-types";
+export type Deprecated<T> = PropTypes.Requireable<T>;
+export declare function deprecated<T>(type: PropTypes.Requireable<T>): Deprecated<T>;
+export declare function enumValue<T>(e: any): PropTypes.Requireable<T>;
+export declare function fun<T extends (...args: any[]) => any>(): PropTypes.Requireable<T>;
+export declare function impl<T>(): PropTypes.Requireable<T>;
+export declare function ref<T>(): PropTypes.Requireable<MutableRefObject<T>>;
+export type ReactNodeOrRenderFn = PropTypes.ReactNodeLike | (() => PropTypes.ReactNodeLike);
+export declare const nodeOrRenderFn: PropTypes.Requireable<NonNullable<ReactNodeOrRenderFn>>;
+export type TypeDoc = Record<string, string | {
+    type: string;
+    required?: boolean;
+    deprecated?: boolean;
+}>;
+export type InferTS<T, K extends HTMLElement> = PropTypes.InferProps<T> & Omit<HTMLProps<K>, keyof T>;
+export declare const spsGlobalPropTypes: {
+    children: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+    className: PropTypes.Requireable<string>;
+    "data-testid": PropTypes.Requireable<string>;
+    unsafelyReplaceClassName: PropTypes.Requireable<string>;
+};

package/lib/stackedHorizontalBarChart/SpsStackedHorizontalBarChart.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+import type { StackedBarChartMilestone } from "@spscommerce/ds-shared";
+export interface ChartDataProps {
+    label: string;
+    value: number;
+    color: string;
+}
+export interface MilestonesType {
+    label: string;
+    value: number;
+    color: StackedBarChartMilestone;
+}
+export interface BarTooltipProps {
+    label: string;
+    absoluteValue: number;
+    relativeValue: number;
+}
+export type SpsStackedHorizontalBarChartProps = React.PropsWithChildren<{
+    chartData?: ChartDataProps[];
+    chartHeight?: number;
+    chartWidth?: number;
+    milestones?: MilestonesType[];
+    useAbsoluteLegend?: boolean;
+    barTooltip?: (props: BarTooltipProps) => JSX.Element;
+}> & React.HTMLAttributes<HTMLDivElement>;
+export declare function SpsStackedHorizontalBarChart(props: SpsStackedHorizontalBarChartProps): React.JSX.Element;

package/lib/stackedHorizontalBarChart/SpsStackedHorizontalBarChart.examples.d.ts

@@ -0,0 +1,2 @@
+import type { DSReactExamples } from "@spscommerce/ds-shared";
+export declare const SpsStackedHorizontalBarChartExamples: DSReactExamples;

package/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "@spscommerce/ds-react-charts",
+  "description": "SPS Design System React Chart components",
+  "version": "0.0.0-20260319-8230915ce",
+  "author": "SPS Commerce",
+  "license": "UNLICENSED",
+  "repository": "https://github.com/spscommerce/woodland/tree/main/packages/@spscommerce/ds-react-charts",
+  "homepage": "https://github.com/spscommerce/woodland/tree/master/packages/@spscommerce/ds-react-charts#readme",
+  "type": "module",
+  "module": "./lib/index.js",
+  "main": "./lib/index.umd.cjs",
+  "types": "./lib/index.d.ts",
+  "exports": {
+    "types": "./lib/index.d.ts",
+    "require": "./lib/index.umd.cjs",
+    "import": "./lib/index.js",
+    "default": "./lib/index.js"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@juggle/resize-observer": "^3.3.1",
+    "@visx/axis": "^3.10.1",
+    "@visx/glyph": "^2.1.2",
+    "@visx/gradient": "^2.1.0",
+    "@visx/grid": "^3.5.0",
+    "@visx/group": "^2.1.0",
+    "@visx/legend": "^3.10.3",
+    "@visx/scale": "^3.5.0",
+    "@visx/shape": "^3.5.0",
+    "@visx/xychart": "^3.11.0",
+    "nanoid": "^5.1.5",
+    "react-spring": "^8.0.27"
+  },
+  "peerDependencies": {
+    "@spscommerce/utils": "^7.0.0 || ^8.0.0",
+    "react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "@spscommerce/ds-colors": "0.0.0-20260319-8230915ce",
+    "@spscommerce/ds-react": "0.0.0-20260319-8230915ce",
+    "@spscommerce/ds-shared": "0.0.0-20260319-8230915ce"
+  },
+  "devDependencies": {
+    "@spscommerce/utils": "^8.1.1",
+    "@testing-library/react": "^12.0.0",
+    "@types/prop-types": "^15.7.1",
+    "axe-prop-types": "^1.0.9",
+    "clsx": "^2.1.1",
+    "prop-types": "^15.7.2",
+    "react": "^16.9.0",
+    "react-dom": "^16.9.0",
+    "@spscommerce/ds-colors": "0.0.0-20260319-8230915ce",
+    "@spscommerce/ds-react": "0.0.0-20260319-8230915ce",
+    "@spscommerce/ds-shared": "0.0.0-20260319-8230915ce",
+    "test": "0.0.0-20260319-8230915ce"
+  },
+  "scripts": {
+    "build": "pnpm run build:js && pnpm run build:types",
+    "build:js": "vite build",
+    "build:types": "tsc --emitDeclarationOnly --declaration --declarationDir lib",
+    "watch": "vite build --watch",
+    "clean": "git clean -fdX",
+    "pub": "node ../../scripts/publish-package.mjs"
+  }
+}

package/vite.config.mjs

@@ -0,0 +1,20 @@
+import path from "node:path";
+
+import { defineConfig } from "vite";
+
+import pkg from "./package.json";
+
+export default defineConfig({
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, "src/index.ts"),
+      name: "DSReactCharts",
+      fileName: "index",
+    },
+    outDir: path.resolve(__dirname, "./lib"),
+    emptyOutDir: false,
+    rollupOptions: {
+      external: pkg.peerDependencies ? Object.keys(pkg.peerDependencies) : [],
+    },
+  },
+});