@powered-by-array/ui 1.77.1 → 1.78.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/CardContainer/CardContainer.variants.d.ts +1 -1
- package/dist/components/CardContainer/CardContainer.variants.d.ts.map +1 -1
- package/dist/components/CardContainer/CardContainer.variants.js +2 -0
- package/dist/components/CardContainer/CardContainer.variants.js.map +1 -1
- package/dist/components/LineChartCard/LineChartCard.d.ts +7 -0
- package/dist/components/LineChartCard/LineChartCard.d.ts.map +1 -0
- package/dist/components/LineChartCard/LineChartCard.js +17 -0
- package/dist/components/LineChartCard/LineChartCard.js.map +1 -0
- package/dist/components/LineChartCard/LineChartCard.types.d.ts +19 -0
- package/dist/components/LineChartCard/LineChartCard.types.d.ts.map +1 -0
- package/dist/components/LineChartCard/LineChartCard.types.js +2 -0
- package/dist/components/LineChartCard/LineChartCard.types.js.map +1 -0
- package/dist/components/LineChartCard/LineChartCard.variants.d.ts +23 -0
- package/dist/components/LineChartCard/LineChartCard.variants.d.ts.map +1 -0
- package/dist/components/LineChartCard/LineChartCard.variants.js +36 -0
- package/dist/components/LineChartCard/LineChartCard.variants.js.map +1 -0
- package/dist/components/LineChartCard/index.d.ts +5 -0
- package/dist/components/LineChartCard/index.d.ts.map +1 -0
- package/dist/components/LineChartCard/index.js +3 -0
- package/dist/components/LineChartCard/index.js.map +1 -0
- package/dist/components/SemanticBarChart/Chart/Chart.d.ts +3 -1
- package/dist/components/SemanticBarChart/Chart/Chart.d.ts.map +1 -1
- package/dist/components/SemanticBarChart/Chart/Chart.js +2 -2
- package/dist/components/SemanticBarChart/Chart/Chart.js.map +1 -1
- package/dist/components/SemanticLineChart/SemanticLineChart.d.ts +7 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.js +99 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.path.utils.d.ts +18 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.path.utils.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.path.utils.js +52 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.path.utils.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.types.d.ts +49 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.types.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.types.js +2 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.types.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.utils.d.ts +17 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.utils.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.utils.js +58 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.utils.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.variants.d.ts +68 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.variants.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.variants.js +98 -0
- package/dist/components/SemanticLineChart/SemanticLineChart.variants.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartDot.d.ts +12 -0
- package/dist/components/SemanticLineChart/SemanticLineChartDot.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartDot.js +10 -0
- package/dist/components/SemanticLineChart/SemanticLineChartDot.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartGrid.d.ts +9 -0
- package/dist/components/SemanticLineChart/SemanticLineChartGrid.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartGrid.js +52 -0
- package/dist/components/SemanticLineChart/SemanticLineChartGrid.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartHitCurve.d.ts +12 -0
- package/dist/components/SemanticLineChart/SemanticLineChartHitCurve.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartHitCurve.js +21 -0
- package/dist/components/SemanticLineChart/SemanticLineChartHitCurve.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartSeriesDots.d.ts +21 -0
- package/dist/components/SemanticLineChart/SemanticLineChartSeriesDots.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartSeriesDots.js +65 -0
- package/dist/components/SemanticLineChart/SemanticLineChartSeriesDots.js.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartTrimmedCurve.d.ts +10 -0
- package/dist/components/SemanticLineChart/SemanticLineChartTrimmedCurve.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/SemanticLineChartTrimmedCurve.js +13 -0
- package/dist/components/SemanticLineChart/SemanticLineChartTrimmedCurve.js.map +1 -0
- package/dist/components/SemanticLineChart/index.d.ts +5 -0
- package/dist/components/SemanticLineChart/index.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/index.js +3 -0
- package/dist/components/SemanticLineChart/index.js.map +1 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartDotsReveal.d.ts +6 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartDotsReveal.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartDotsReveal.js +47 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartDotsReveal.js.map +1 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartEntryAnimation.d.ts +18 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartEntryAnimation.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartEntryAnimation.js +37 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartEntryAnimation.js.map +1 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartSeriesHover.d.ts +13 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartSeriesHover.d.ts.map +1 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartSeriesHover.js +57 -0
- package/dist/components/SemanticLineChart/useSemanticLineChartSeriesHover.js.map +1 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type VariantProps } from "class-variance-authority";
|
|
2
2
|
export declare const cardContainerVariants: (props?: ({
|
|
3
|
-
variant?: "default" | "outline" | null | undefined;
|
|
3
|
+
variant?: "default" | "outline" | "dataViz" | null | undefined;
|
|
4
4
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
export type CardContainerVariants = VariantProps<typeof cardContainerVariants>;
|
|
6
6
|
//# sourceMappingURL=CardContainer.variants.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardContainer.variants.d.ts","sourceRoot":"","sources":["../../../src/components/CardContainer/CardContainer.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,eAAO,MAAM,qBAAqB;;
|
|
1
|
+
{"version":3,"file":"CardContainer.variants.d.ts","sourceRoot":"","sources":["../../../src/components/CardContainer/CardContainer.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,eAAO,MAAM,qBAAqB;;8EAmBhC,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC"}
|
|
@@ -11,6 +11,8 @@ export const cardContainerVariants = cva("rounded-xl p-5 transition-colors", {
|
|
|
11
11
|
outline: [
|
|
12
12
|
"border border-[var(--color-semantic-card-container-outline-border)]",
|
|
13
13
|
],
|
|
14
|
+
// Filled surface without hover lighten — keeps chart grid contrast stable (e.g. LineChartCard).
|
|
15
|
+
dataViz: ["bg-[var(--color-semantic-card-container-bg)]"],
|
|
14
16
|
},
|
|
15
17
|
},
|
|
16
18
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardContainer.variants.js","sourceRoot":"","sources":["../../../src/components/CardContainer/CardContainer.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAElE,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC,kCAAkC,EAAE;IAC3E,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,gFAAgF;YAChF,OAAO,EAAE;gBACP,8CAA8C;gBAC9C,0DAA0D;aAC3D;YACD,uEAAuE;YACvE,OAAO,EAAE;gBACP,qEAAqE;aACtE;
|
|
1
|
+
{"version":3,"file":"CardContainer.variants.js","sourceRoot":"","sources":["../../../src/components/CardContainer/CardContainer.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAElE,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC,kCAAkC,EAAE;IAC3E,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,gFAAgF;YAChF,OAAO,EAAE;gBACP,8CAA8C;gBAC9C,0DAA0D;aAC3D;YACD,uEAAuE;YACvE,OAAO,EAAE;gBACP,qEAAqE;aACtE;YACD,gGAAgG;YAChG,OAAO,EAAE,CAAC,8CAA8C,CAAC;SAC1D;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CAAC,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { LineChartCardProps } from "./LineChartCard.types.js";
|
|
2
|
+
/**
|
|
3
|
+
* Figma "Card / Data Viz / Line Graph" — navy card shell with title block,
|
|
4
|
+
* status badge, divider, and a multi-series `SemanticLineChart`.
|
|
5
|
+
*/
|
|
6
|
+
export declare function LineChartCard({ className, title, subtitle, status, variant, data, series, chartClassName, chartMargin, chartConfig, chartId, yDomain, yTicks, yTickFormatter, xTickFormatter, gridVertical, strokeWidth, dotRadius, showDots, showTooltip, "aria-label": ariaLabelProp, ref, ...props }: LineChartCardProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
//# sourceMappingURL=LineChartCard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LineChartCard.d.ts","sourceRoot":"","sources":["../../../src/components/LineChartCard/LineChartCard.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAUnE;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAe,EACf,OAAmB,EACnB,IAAI,EACJ,MAAM,EACN,cAAc,EACd,WAAW,EACX,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,EACN,cAAc,EACd,cAAc,EACd,YAAY,EACZ,WAAW,EACX,SAAS,EACT,QAAe,EACf,WAAkB,EAClB,YAAY,EAAE,aAAa,EAC3B,GAAG,EACH,GAAG,KAAK,EACT,EAAE,kBAAkB,2CAgEpB"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { cn } from "../../lib/cn.js";
|
|
4
|
+
import { Badge } from "../Badge/index.js";
|
|
5
|
+
import { CardContainer } from "../CardContainer/index.js";
|
|
6
|
+
import { Separator } from "../Separator/index.js";
|
|
7
|
+
import { SemanticLineChart } from "../SemanticLineChart/index.js";
|
|
8
|
+
import { lineChartCardChartVariants, lineChartCardHeaderVariants, lineChartCardVariants, lineChartCardSubtitleVariants, lineChartCardTitleRowVariants, lineChartCardTitleVariants, } from "./LineChartCard.variants.js";
|
|
9
|
+
/**
|
|
10
|
+
* Figma "Card / Data Viz / Line Graph" — navy card shell with title block,
|
|
11
|
+
* status badge, divider, and a multi-series `SemanticLineChart`.
|
|
12
|
+
*/
|
|
13
|
+
export function LineChartCard({ className, title, subtitle, status = "none", variant = "default", data, series, chartClassName, chartMargin, chartConfig, chartId, yDomain, yTicks, yTickFormatter, xTickFormatter, gridVertical, strokeWidth, dotRadius, showDots = true, showTooltip = true, "aria-label": ariaLabelProp, ref, ...props }) {
|
|
14
|
+
const defaultAriaLabel = typeof title === "string" ? `${title} line chart` : "Line chart card";
|
|
15
|
+
return (_jsx(CardContainer, { asChild: true, variant: "dataViz", children: _jsxs("section", { ref: ref, "data-slot": "line-chart-card", "data-variant": variant, className: cn(lineChartCardVariants({ variant }), className), "aria-label": ariaLabelProp ?? defaultAriaLabel, ...props, children: [_jsxs("header", { "data-slot": "line-chart-card-header", className: lineChartCardHeaderVariants(), children: [_jsxs("div", { "data-slot": "line-chart-card-title-row", className: lineChartCardTitleRowVariants(), children: [_jsx("h3", { "data-slot": "line-chart-card-title", className: lineChartCardTitleVariants(), children: title }), status !== "none" ? (_jsx(Badge, { "data-slot": "line-chart-card-status", variant: status })) : null] }), subtitle != null && subtitle !== "" ? (_jsx("p", { "data-slot": "line-chart-card-subtitle", className: lineChartCardSubtitleVariants(), children: subtitle })) : null] }), _jsx(Separator, { orientation: "horizontal" }), _jsx(SemanticLineChart, { data: data, series: series, chartClassName: cn(lineChartCardChartVariants({ variant }), chartClassName), chartMargin: chartMargin, chartConfig: chartConfig, chartId: chartId, yDomain: yDomain, yTicks: yTicks, yTickFormatter: yTickFormatter, xTickFormatter: xTickFormatter, gridVertical: gridVertical, strokeWidth: strokeWidth, dotRadius: dotRadius, showDots: showDots, showTooltip: showTooltip })] }) }));
|
|
16
|
+
}
|
|
17
|
+
//# sourceMappingURL=LineChartCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LineChartCard.js","sourceRoot":"","sources":["../../../src/components/LineChartCard/LineChartCard.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,OAAO,EACL,0BAA0B,EAC1B,2BAA2B,EAC3B,qBAAqB,EACrB,6BAA6B,EAC7B,6BAA6B,EAC7B,0BAA0B,GAC3B,MAAM,6BAA6B,CAAC;AAErC;;;GAGG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,GAAG,MAAM,EACf,OAAO,GAAG,SAAS,EACnB,IAAI,EACJ,MAAM,EACN,cAAc,EACd,WAAW,EACX,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,EACN,cAAc,EACd,cAAc,EACd,YAAY,EACZ,WAAW,EACX,SAAS,EACT,QAAQ,GAAG,IAAI,EACf,WAAW,GAAG,IAAI,EAClB,YAAY,EAAE,aAAa,EAC3B,GAAG,EACH,GAAG,KAAK,EACW;IACnB,MAAM,gBAAgB,GACpB,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC;IAExE,OAAO,CACL,KAAC,aAAa,IAAC,OAAO,QAAC,OAAO,EAAC,SAAS,YACtC,mBACE,GAAG,EAAE,GAAG,eACE,iBAAiB,kBACb,OAAO,EACrB,SAAS,EAAE,EAAE,CAAC,qBAAqB,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,gBAChD,aAAa,IAAI,gBAAgB,KACzC,KAAK,aAET,+BACY,wBAAwB,EAClC,SAAS,EAAE,2BAA2B,EAAE,aAExC,4BACY,2BAA2B,EACrC,SAAS,EAAE,6BAA6B,EAAE,aAE1C,0BACY,uBAAuB,EACjC,SAAS,EAAE,0BAA0B,EAAE,YAEtC,KAAK,GACH,EACJ,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,CACnB,KAAC,KAAK,iBAAW,wBAAwB,EAAC,OAAO,EAAE,MAAM,GAAI,CAC9D,CAAC,CAAC,CAAC,IAAI,IACJ,EACL,QAAQ,IAAI,IAAI,IAAI,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,CACrC,yBACY,0BAA0B,EACpC,SAAS,EAAE,6BAA6B,EAAE,YAEzC,QAAQ,GACP,CACL,CAAC,CAAC,CAAC,IAAI,IACD,EAET,KAAC,SAAS,IAAC,WAAW,EAAC,YAAY,GAAG,EAEtC,KAAC,iBAAiB,IAChB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,EAAE,CAAC,0BAA0B,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,cAAc,CAAC,EAC3E,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,GACxB,IACM,GACI,CACjB,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import type * as React from "react";
|
|
2
|
+
import type { SemanticLineChartDatum, SemanticLineChartProps, SemanticLineChartSeries } from "../SemanticLineChart/index.js";
|
|
3
|
+
/** Status badge in the card header — matches `GoalCard`; use `none` to hide. */
|
|
4
|
+
export type LineChartCardStatus = "active" | "paused" | "none";
|
|
5
|
+
export type LineChartCardProps = Omit<React.ComponentProps<"section">, "children"> & {
|
|
6
|
+
/** Primary heading in the card header. */
|
|
7
|
+
title: React.ReactNode;
|
|
8
|
+
/** Secondary line below the title. */
|
|
9
|
+
subtitle?: React.ReactNode;
|
|
10
|
+
/** Status badge variant; `none` omits the badge. Defaults to `none`. */
|
|
11
|
+
status?: LineChartCardStatus;
|
|
12
|
+
/** Card layout — `fullWidth` stretches horizontally and uses a taller chart plot. */
|
|
13
|
+
variant?: "default" | "fullWidth";
|
|
14
|
+
/** Chart rows — forwarded to `SemanticLineChart`. */
|
|
15
|
+
data: SemanticLineChartDatum[];
|
|
16
|
+
/** Trend lines — forwarded to `SemanticLineChart`. */
|
|
17
|
+
series: SemanticLineChartSeries[];
|
|
18
|
+
} & Pick<SemanticLineChartProps, "chartClassName" | "chartMargin" | "chartConfig" | "chartId" | "yDomain" | "yTicks" | "yTickFormatter" | "xTickFormatter" | "gridVertical" | "strokeWidth" | "dotRadius" | "showDots" | "showTooltip">;
|
|
19
|
+
//# sourceMappingURL=LineChartCard.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LineChartCard.types.d.ts","sourceRoot":"","sources":["../../../src/components/LineChartCard/LineChartCard.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EACV,sBAAsB,EACtB,sBAAsB,EACtB,uBAAuB,EACxB,MAAM,+BAA+B,CAAC;AAEvC,gFAAgF;AAChF,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE/D,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,GAAG;IACnF,0CAA0C;IAC1C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,wEAAwE;IACxE,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,qFAAqF;IACrF,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAClC,qDAAqD;IACrD,IAAI,EAAE,sBAAsB,EAAE,CAAC;IAC/B,sDAAsD;IACtD,MAAM,EAAE,uBAAuB,EAAE,CAAC;CACnC,GAAG,IAAI,CACN,sBAAsB,EACpB,gBAAgB,GAChB,aAAa,GACb,aAAa,GACb,SAAS,GACT,SAAS,GACT,QAAQ,GACR,gBAAgB,GAChB,gBAAgB,GAChB,cAAc,GACd,aAAa,GACb,WAAW,GACX,UAAU,GACV,aAAa,CAChB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LineChartCard.types.js","sourceRoot":"","sources":["../../../src/components/LineChartCard/LineChartCard.types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
/** Figma card shell max width (708px plot + `CardContainer` horizontal padding). */
|
|
3
|
+
export declare const LINE_CHART_CARD_DEFAULT_MAX_WIDTH_PX = 748;
|
|
4
|
+
/** Default embedded chart height — matches Figma card / `SemanticLineChart`. */
|
|
5
|
+
export declare const LINE_CHART_CARD_DEFAULT_CHART_HEIGHT_PX = 221;
|
|
6
|
+
/** Taller plot for `fullWidth` cards spanning wide dashboard columns. */
|
|
7
|
+
export declare const LINE_CHART_CARD_FULL_WIDTH_CHART_HEIGHT_PX = 280;
|
|
8
|
+
export declare const lineChartCardVariants: (props?: ({
|
|
9
|
+
variant?: "default" | "fullWidth" | null | undefined;
|
|
10
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
|
+
export type LineChartCardVariants = VariantProps<typeof lineChartCardVariants>;
|
|
12
|
+
export declare const lineChartCardChartVariants: (props?: ({
|
|
13
|
+
variant?: "default" | "fullWidth" | null | undefined;
|
|
14
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
15
|
+
/** @deprecated Use {@link lineChartCardVariants}. */
|
|
16
|
+
export declare const lineChartCardRootVariants: (props?: ({
|
|
17
|
+
variant?: "default" | "fullWidth" | null | undefined;
|
|
18
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
19
|
+
export declare const lineChartCardHeaderVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
20
|
+
export declare const lineChartCardTitleRowVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
21
|
+
export declare const lineChartCardTitleVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
22
|
+
export declare const lineChartCardSubtitleVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
23
|
+
//# sourceMappingURL=LineChartCard.variants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LineChartCard.variants.d.ts","sourceRoot":"","sources":["../../../src/components/LineChartCard/LineChartCard.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,oFAAoF;AACpF,eAAO,MAAM,oCAAoC,MAAM,CAAC;AAExD,gFAAgF;AAChF,eAAO,MAAM,uCAAuC,MAAM,CAAC;AAE3D,yEAAyE;AACzE,eAAO,MAAM,0CAA0C,MAAM,CAAC;AAE9D,eAAO,MAAM,qBAAqB;;8EAUhC,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC;AAE/E,eAAO,MAAM,0BAA0B;;8EAUrC,CAAC;AAEH,qDAAqD;AACrD,eAAO,MAAM,yBAAyB;;8EAAwB,CAAC;AAE/D,eAAO,MAAM,2BAA2B,oFAAsC,CAAC;AAE/E,eAAO,MAAM,6BAA6B,oFAEzC,CAAC;AAEF,eAAO,MAAM,0BAA0B,oFAEtC,CAAC;AAEF,eAAO,MAAM,6BAA6B,oFAEzC,CAAC"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { cva } from "class-variance-authority";
|
|
2
|
+
/** Figma card shell max width (708px plot + `CardContainer` horizontal padding). */
|
|
3
|
+
export const LINE_CHART_CARD_DEFAULT_MAX_WIDTH_PX = 748;
|
|
4
|
+
/** Default embedded chart height — matches Figma card / `SemanticLineChart`. */
|
|
5
|
+
export const LINE_CHART_CARD_DEFAULT_CHART_HEIGHT_PX = 221;
|
|
6
|
+
/** Taller plot for `fullWidth` cards spanning wide dashboard columns. */
|
|
7
|
+
export const LINE_CHART_CARD_FULL_WIDTH_CHART_HEIGHT_PX = 280;
|
|
8
|
+
export const lineChartCardVariants = cva("flex w-full min-w-0 flex-col gap-9", {
|
|
9
|
+
variants: {
|
|
10
|
+
variant: {
|
|
11
|
+
default: "max-w-[748px]",
|
|
12
|
+
fullWidth: "max-w-none gap-10",
|
|
13
|
+
},
|
|
14
|
+
},
|
|
15
|
+
defaultVariants: {
|
|
16
|
+
variant: "default",
|
|
17
|
+
},
|
|
18
|
+
});
|
|
19
|
+
export const lineChartCardChartVariants = cva("", {
|
|
20
|
+
variants: {
|
|
21
|
+
variant: {
|
|
22
|
+
default: "",
|
|
23
|
+
fullWidth: "h-[280px]",
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
defaultVariants: {
|
|
27
|
+
variant: "default",
|
|
28
|
+
},
|
|
29
|
+
});
|
|
30
|
+
/** @deprecated Use {@link lineChartCardVariants}. */
|
|
31
|
+
export const lineChartCardRootVariants = lineChartCardVariants;
|
|
32
|
+
export const lineChartCardHeaderVariants = cva("flex w-full flex-col gap-1.5");
|
|
33
|
+
export const lineChartCardTitleRowVariants = cva("flex w-full items-center justify-between gap-3");
|
|
34
|
+
export const lineChartCardTitleVariants = cva("min-w-0 flex-1 font-sans text-base leading-normal font-semibold text-foreground");
|
|
35
|
+
export const lineChartCardSubtitleVariants = cva("w-full font-sans text-sm leading-normal font-normal text-muted-foreground");
|
|
36
|
+
//# sourceMappingURL=LineChartCard.variants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LineChartCard.variants.js","sourceRoot":"","sources":["../../../src/components/LineChartCard/LineChartCard.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAElE,oFAAoF;AACpF,MAAM,CAAC,MAAM,oCAAoC,GAAG,GAAG,CAAC;AAExD,gFAAgF;AAChF,MAAM,CAAC,MAAM,uCAAuC,GAAG,GAAG,CAAC;AAE3D,yEAAyE;AACzE,MAAM,CAAC,MAAM,0CAA0C,GAAG,GAAG,CAAC;AAE9D,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC,oCAAoC,EAAE;IAC7E,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,eAAe;YACxB,SAAS,EAAE,mBAAmB;SAC/B;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CAAC,CAAC;AAIH,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,CAAC,EAAE,EAAE;IAChD,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,EAAE;YACX,SAAS,EAAE,WAAW;SACvB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CAAC,CAAC;AAEH,qDAAqD;AACrD,MAAM,CAAC,MAAM,yBAAyB,GAAG,qBAAqB,CAAC;AAE/D,MAAM,CAAC,MAAM,2BAA2B,GAAG,GAAG,CAAC,8BAA8B,CAAC,CAAC;AAE/E,MAAM,CAAC,MAAM,6BAA6B,GAAG,GAAG,CAC9C,gDAAgD,CACjD,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,CAC3C,iFAAiF,CAClF,CAAC;AAEF,MAAM,CAAC,MAAM,6BAA6B,GAAG,GAAG,CAC9C,2EAA2E,CAC5E,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export { LineChartCard } from "./LineChartCard.js";
|
|
2
|
+
export type { LineChartCardProps, LineChartCardStatus } from "./LineChartCard.types.js";
|
|
3
|
+
export { lineChartCardVariants, lineChartCardChartVariants, LINE_CHART_CARD_DEFAULT_MAX_WIDTH_PX, LINE_CHART_CARD_DEFAULT_CHART_HEIGHT_PX, LINE_CHART_CARD_FULL_WIDTH_CHART_HEIGHT_PX, } from "./LineChartCard.variants.js";
|
|
4
|
+
export type { LineChartCardVariants } from "./LineChartCard.variants.js";
|
|
5
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/LineChartCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AACxF,OAAO,EACL,qBAAqB,EACrB,0BAA0B,EAC1B,oCAAoC,EACpC,uCAAuC,EACvC,0CAA0C,GAC3C,MAAM,6BAA6B,CAAC;AACrC,YAAY,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { LineChartCard } from "./LineChartCard.js";
|
|
2
|
+
export { lineChartCardVariants, lineChartCardChartVariants, LINE_CHART_CARD_DEFAULT_MAX_WIDTH_PX, LINE_CHART_CARD_DEFAULT_CHART_HEIGHT_PX, LINE_CHART_CARD_FULL_WIDTH_CHART_HEIGHT_PX, } from "./LineChartCard.variants.js";
|
|
3
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LineChartCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,OAAO,EACL,qBAAqB,EACrB,0BAA0B,EAC1B,oCAAoC,EACpC,uCAAuC,EACvC,0CAA0C,GAC3C,MAAM,6BAA6B,CAAC"}
|
|
@@ -5,9 +5,11 @@
|
|
|
5
5
|
import * as React from "react";
|
|
6
6
|
import { ResponsiveContainer, Tooltip } from "recharts";
|
|
7
7
|
import { type ChartConfig, type ChartLegendContentProps, type ChartTooltipContentProps } from "./Chart.types.js";
|
|
8
|
-
declare function ChartContainer({ id, className, children, config, ...props }: React.ComponentProps<"div"> & {
|
|
8
|
+
declare function ChartContainer({ id, className, children, config, debounce, ...props }: React.ComponentProps<"div"> & {
|
|
9
9
|
config: ChartConfig;
|
|
10
10
|
children: React.ComponentProps<typeof ResponsiveContainer>["children"];
|
|
11
|
+
/** Passed to Recharts `ResponsiveContainer` to batch resize updates (ms). */
|
|
12
|
+
debounce?: number;
|
|
11
13
|
}): import("react/jsx-runtime").JSX.Element;
|
|
12
14
|
declare function ChartStyle({ id, config }: {
|
|
13
15
|
id: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../../../src/components/SemanticBarChart/Chart/Chart.tsx"],"names":[],"mappings":"AAEA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAU,mBAAmB,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAQhE,OAAO,EAAgB,KAAK,WAAW,EAAE,KAAK,uBAAuB,EAAE,KAAK,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAI/H,iBAAS,cAAc,CAAC,EACtB,EAAE,EACF,SAAS,EACT,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAAC,UAAU,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../../../src/components/SemanticBarChart/Chart/Chart.tsx"],"names":[],"mappings":"AAEA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAU,mBAAmB,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAQhE,OAAO,EAAgB,KAAK,WAAW,EAAE,KAAK,uBAAuB,EAAE,KAAK,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAI/H,iBAAS,cAAc,CAAC,EACtB,EAAE,EACF,SAAS,EACT,QAAQ,EACR,MAAM,EACN,QAAY,EACZ,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAAC,UAAU,CAAC,CAAC;IACvE,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,2CAiBA;AAED,iBAAS,UAAU,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,WAAW,CAAA;CAAE,kDA2BtE;AAED,QAAA,MAAM,YAAY,gBAAU,CAAC;AAE7B,iBAAS,mBAAmB,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,SAAS,EACT,SAAiB,EACjB,SAAiB,EACjB,aAAqB,EACrB,KAAK,EACL,cAAc,EACd,cAAc,EACd,SAAS,EACT,KAAK,EACL,OAAO,EACP,QAAQ,GACT,EAAE,wBAAwB,kDAqH1B;AAED,QAAA,MAAM,WAAW,uGAAS,CAAC;AAE3B,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,QAAgB,EAChB,OAAO,EACP,aAAwB,EACxB,OAAO,GACR,EAAE,uBAAuB,kDA2CzB;AAED,OAAO,EACL,cAAc,EACd,WAAW,EACX,kBAAkB,EAClB,UAAU,EACV,YAAY,EACZ,mBAAmB,GACpB,CAAC"}
|
|
@@ -11,10 +11,10 @@ import { chartContainerVariants, chartLegendContentVariants, chartTooltipContent
|
|
|
11
11
|
import { CHART_THEMES } from "./Chart.types.js";
|
|
12
12
|
import { getPayloadConfigFromPayload } from "./Chart.utils.js";
|
|
13
13
|
import { ChartContext, useChart } from "./hooks/useChart.js";
|
|
14
|
-
function ChartContainer({ id, className, children, config, ...props }) {
|
|
14
|
+
function ChartContainer({ id, className, children, config, debounce = 0, ...props }) {
|
|
15
15
|
const uniqueId = React.useId();
|
|
16
16
|
const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
|
|
17
|
-
return (_jsx(ChartContext.Provider, { value: { config }, children: _jsxs("div", { "data-slot": "chart", "data-chart": chartId, className: cn(chartContainerVariants(), className), ...props, children: [_jsx(ChartStyle, { id: chartId, config: config }), _jsx(ResponsiveContainer, { children: children })] }) }));
|
|
17
|
+
return (_jsx(ChartContext.Provider, { value: { config }, children: _jsxs("div", { "data-slot": "chart", "data-chart": chartId, className: cn(chartContainerVariants(), className), ...props, children: [_jsx(ChartStyle, { id: chartId, config: config }), _jsx(ResponsiveContainer, { debounce: debounce, children: children })] }) }));
|
|
18
18
|
}
|
|
19
19
|
function ChartStyle({ id, config }) {
|
|
20
20
|
const colorConfig = Object.entries(config).filter(([, config]) => config.theme || config.color);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chart.js","sourceRoot":"","sources":["../../../../src/components/SemanticBarChart/Chart/Chart.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAEhE,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AACxC,OAAO,EACL,sBAAsB,EACtB,0BAA0B,EAC1B,2BAA2B,GAC5B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAiF,MAAM,kBAAkB,CAAC;AAC/H,OAAO,EAAE,2BAA2B,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE7D,SAAS,cAAc,CAAC,EACtB,EAAE,EACF,SAAS,EACT,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,
|
|
1
|
+
{"version":3,"file":"Chart.js","sourceRoot":"","sources":["../../../../src/components/SemanticBarChart/Chart/Chart.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { SemanticLineChartProps } from "./SemanticLineChart.types.js";
|
|
2
|
+
/**
|
|
3
|
+
* Multi-series line chart composed from `ChartContainer` and Recharts.
|
|
4
|
+
* Series colors default to semantic chart tokens (`--chart-1` … `--chart-10`).
|
|
5
|
+
*/
|
|
6
|
+
export declare function SemanticLineChart({ className, data, series, chartClassName, chartMargin, chartConfig, chartId, yDomain, yTicks, yTickFormatter, xTickFormatter, gridVertical, strokeWidth, dotRadius, showDots, showTooltip, "aria-label": ariaLabelProp, ...props }: SemanticLineChartProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
//# sourceMappingURL=SemanticLineChart.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.d.ts","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;AAyD3E;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,IAAI,EACJ,MAAM,EACN,cAAc,EACd,WAAW,EACX,WAAgB,EAChB,OAAO,EACP,OAAO,EACP,MAAM,EACN,cAAc,EACd,cAAc,EACd,YAAmB,EACnB,WAAe,EACf,SAAgD,EAChD,QAAe,EACf,WAAmB,EACnB,YAAY,EAAE,aAAa,EAC3B,GAAG,KAAK,EACT,EAAE,sBAAsB,2CA+OxB"}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { Line, LineChart, XAxis, YAxis, } from "recharts";
|
|
5
|
+
import { cn } from "../../lib/cn.js";
|
|
6
|
+
import { ChartContainer, ChartTooltip, ChartTooltipContent, } from "../SemanticBarChart/Chart/index.js";
|
|
7
|
+
import { SemanticLineChartGrid } from "./SemanticLineChartGrid.js";
|
|
8
|
+
import { SemanticLineChartDot } from "./SemanticLineChartDot.js";
|
|
9
|
+
import { SemanticLineChartHitCurve } from "./SemanticLineChartHitCurve.js";
|
|
10
|
+
import { SemanticLineChartTrimmedCurve } from "./SemanticLineChartTrimmedCurve.js";
|
|
11
|
+
import { SemanticLineChartSeriesDots } from "./SemanticLineChartSeriesDots.js";
|
|
12
|
+
import { resolveLineChartTrimRadius } from "./SemanticLineChart.path.utils.js";
|
|
13
|
+
import { buildLineChartConfig, orderSeriesForHover, seriesColorVar } from "./SemanticLineChart.utils.js";
|
|
14
|
+
import { useSemanticLineChartEntryAnimation } from "./useSemanticLineChartEntryAnimation.js";
|
|
15
|
+
import { useSemanticLineChartDotsReveal } from "./useSemanticLineChartDotsReveal.js";
|
|
16
|
+
import { useSemanticLineChartSeriesHover } from "./useSemanticLineChartSeriesHover.js";
|
|
17
|
+
import { DEFAULT_LINE_MARGIN, SEMANTIC_LINE_CHART_BASE_LINE_Z_INDEX, SEMANTIC_LINE_CHART_DOT_INNER_RADIUS, SEMANTIC_LINE_CHART_HOVERED_LINE_Z_INDEX, SEMANTIC_LINE_CHART_HOVER_STROKE_DELTA, SEMANTIC_LINE_CHART_SERIES_LINE_CLASS, SEMANTIC_LINE_CHART_ANIMATION_DURATION_MS, SEMANTIC_LINE_CHART_ANIMATION_STAGGER_MS, SEMANTIC_LINE_CHART_ANIMATION_EASING, SEMANTIC_LINE_CHART_RESIZE_DEBOUNCE_MS, SEMANTIC_LINE_CHART_Y_AXIS_WIDTH, SEMANTIC_LINE_CHART_Y_LABEL_X, SEMANTIC_LINE_CHART_X_AXIS_PADDING, semanticLineChartChartContainerVariants, semanticLineChartXAxisTick, semanticLineChartYAxisTick, } from "./SemanticLineChart.variants.js";
|
|
18
|
+
/** Right-aligned Y tick labels inside the Figma 36px label column. */
|
|
19
|
+
function renderYAxisTick(tickProps, tickFormatter) {
|
|
20
|
+
const rawValue = tickProps.payload?.value;
|
|
21
|
+
const label = rawValue != null && tickFormatter != null
|
|
22
|
+
? tickFormatter(rawValue)
|
|
23
|
+
: rawValue != null
|
|
24
|
+
? String(rawValue)
|
|
25
|
+
: "";
|
|
26
|
+
return (_jsx("text", { x: SEMANTIC_LINE_CHART_Y_LABEL_X, y: tickProps.y, dy: 3, textAnchor: "end", fill: semanticLineChartYAxisTick.fill, fontSize: semanticLineChartYAxisTick.fontSize, className: "font-mono", children: label }));
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* Multi-series line chart composed from `ChartContainer` and Recharts.
|
|
30
|
+
* Series colors default to semantic chart tokens (`--chart-1` … `--chart-10`).
|
|
31
|
+
*/
|
|
32
|
+
export function SemanticLineChart({ className, data, series, chartClassName, chartMargin, chartConfig = {}, chartId, yDomain, yTicks, yTickFormatter, xTickFormatter, gridVertical = true, strokeWidth = 2, dotRadius = SEMANTIC_LINE_CHART_DOT_INNER_RADIUS, showDots = true, showTooltip = false, "aria-label": ariaLabelProp, ...props }) {
|
|
33
|
+
const resolvedConfig = React.useMemo(() => buildLineChartConfig(series, chartConfig), [series, chartConfig]);
|
|
34
|
+
const margin = React.useMemo(() => {
|
|
35
|
+
return {
|
|
36
|
+
...DEFAULT_LINE_MARGIN,
|
|
37
|
+
...chartMargin,
|
|
38
|
+
};
|
|
39
|
+
}, [chartMargin]);
|
|
40
|
+
const defaultAriaLabel = React.useMemo(() => {
|
|
41
|
+
const summaries = series.map((item) => {
|
|
42
|
+
const values = data
|
|
43
|
+
.map((row) => {
|
|
44
|
+
const raw = row[item.dataKey];
|
|
45
|
+
const numeric = typeof raw === "number" ? raw : Number(raw);
|
|
46
|
+
const formatted = Number.isFinite(numeric)
|
|
47
|
+
? yTickFormatter != null
|
|
48
|
+
? yTickFormatter(numeric)
|
|
49
|
+
: String(numeric)
|
|
50
|
+
: String(raw);
|
|
51
|
+
return `${row.name} ${formatted}`;
|
|
52
|
+
})
|
|
53
|
+
.join(", ");
|
|
54
|
+
return `${item.label ?? item.dataKey}: ${values}`;
|
|
55
|
+
});
|
|
56
|
+
return `Line chart, ${summaries.join("; ")}`;
|
|
57
|
+
}, [data, series, yTickFormatter]);
|
|
58
|
+
const suppressMouseFocus = React.useCallback((event) => {
|
|
59
|
+
// Recharts activates keyboard tooltip state on SVG focus (index 0). Mouse clicks
|
|
60
|
+
// should not move focus there; Tab still reaches the chart for arrow-key navigation.
|
|
61
|
+
event.preventDefault();
|
|
62
|
+
}, []);
|
|
63
|
+
const { isEntryAnimationActive } = useSemanticLineChartEntryAnimation({
|
|
64
|
+
seriesCount: series.length,
|
|
65
|
+
});
|
|
66
|
+
const hoverInteractionsEnabled = !isEntryAnimationActive;
|
|
67
|
+
const { hoveredSeriesKey, handleSeriesEnter, handleSeriesLeave, clearHoveredSeries, } = useSemanticLineChartSeriesHover(hoverInteractionsEnabled);
|
|
68
|
+
const orderedSeries = React.useMemo(() => orderSeriesForHover(series, hoveredSeriesKey), [series, hoveredSeriesKey]);
|
|
69
|
+
const entryTrimRadius = resolveLineChartTrimRadius(showDots, dotRadius, isEntryAnimationActive);
|
|
70
|
+
const showSeriesDots = showDots && !isEntryAnimationActive;
|
|
71
|
+
const seriesDotsOpacity = useSemanticLineChartDotsReveal(showSeriesDots);
|
|
72
|
+
const renderTrimmedCurve = React.useCallback((curveProps) => (_jsx(SemanticLineChartTrimmedCurve, { ...curveProps, trimRadius: entryTrimRadius })), [entryTrimRadius]);
|
|
73
|
+
const renderHitCurve = React.useCallback((curveProps) => (_jsx(SemanticLineChartHitCurve, { points: curveProps.points, interactive: hoverInteractionsEnabled })), [hoverInteractionsEnabled]);
|
|
74
|
+
const renderActiveDot = React.useCallback((dotProps) => {
|
|
75
|
+
const dataKey = typeof dotProps.dataKey === "string" ? dotProps.dataKey : undefined;
|
|
76
|
+
if (dotProps.cx == null || dotProps.cy == null || dataKey == null) {
|
|
77
|
+
return null;
|
|
78
|
+
}
|
|
79
|
+
return (_jsx(SemanticLineChartDot, { cx: dotProps.cx, cy: dotProps.cy, fill: seriesColorVar(dataKey), innerRadius: dotRadius }));
|
|
80
|
+
}, [dotRadius]);
|
|
81
|
+
return (_jsx("div", { "data-slot": "semantic-line-chart", role: "group", className: cn("w-full", className), "aria-label": ariaLabelProp ?? defaultAriaLabel, ...props, children: _jsx(ChartContainer, { id: chartId, config: resolvedConfig, debounce: SEMANTIC_LINE_CHART_RESIZE_DEBOUNCE_MS, className: cn(semanticLineChartChartContainerVariants(), chartClassName), "data-entry-animating": isEntryAnimationActive || undefined, onMouseDown: suppressMouseFocus, onMouseLeave: clearHoveredSeries, children: _jsxs(LineChart, { accessibilityLayer: true, data: data, margin: margin, children: [_jsx(SemanticLineChartGrid, { gridVertical: gridVertical, yDomain: yDomain, yTicks: yTicks }), _jsx(XAxis, { dataKey: "name", tickLine: false, axisLine: false, tickMargin: 10, interval: 0, minTickGap: 0, padding: SEMANTIC_LINE_CHART_X_AXIS_PADDING, tick: semanticLineChartXAxisTick, ...(xTickFormatter != null ? { tickFormatter: xTickFormatter } : {}) }), _jsx(YAxis, { ...(yDomain != null ? { domain: yDomain } : {}), ...(yTicks != null ? { ticks: yTicks } : {}), ...(yTickFormatter != null ? { tickFormatter: yTickFormatter } : {}), tickLine: false, axisLine: false, width: SEMANTIC_LINE_CHART_Y_AXIS_WIDTH, interval: 0, minTickGap: 0, allowDecimals: false, tick: (tickProps) => renderYAxisTick(tickProps, yTickFormatter) }), showTooltip ? (_jsx(ChartTooltip, { shared: true, trigger: "hover", cursor: false, isAnimationActive: false, content: _jsx(ChartTooltipContent, { indicator: "dot" }) })) : null, orderedSeries.map((item) => {
|
|
82
|
+
const color = seriesColorVar(item.dataKey);
|
|
83
|
+
const seriesAnimationIndex = series.findIndex((seriesItem) => seriesItem.dataKey === item.dataKey);
|
|
84
|
+
const animationBegin = seriesAnimationIndex * SEMANTIC_LINE_CHART_ANIMATION_STAGGER_MS;
|
|
85
|
+
const isHovered = hoverInteractionsEnabled && hoveredSeriesKey === item.dataKey;
|
|
86
|
+
const seriesStrokeWidth = isHovered
|
|
87
|
+
? strokeWidth + SEMANTIC_LINE_CHART_HOVER_STROKE_DELTA
|
|
88
|
+
: strokeWidth;
|
|
89
|
+
const seriesCurveZIndex = isHovered
|
|
90
|
+
? SEMANTIC_LINE_CHART_HOVERED_LINE_Z_INDEX
|
|
91
|
+
: SEMANTIC_LINE_CHART_BASE_LINE_Z_INDEX;
|
|
92
|
+
const seriesMouseHandlers = {
|
|
93
|
+
onMouseEnter: () => handleSeriesEnter(item.dataKey),
|
|
94
|
+
onMouseLeave: () => handleSeriesLeave(item.dataKey),
|
|
95
|
+
};
|
|
96
|
+
return (_jsxs(React.Fragment, { children: [_jsx(Line, { id: `semantic-line-chart-curve-${item.dataKey}`, className: cn(SEMANTIC_LINE_CHART_SERIES_LINE_CLASS, "semantic-line-chart-series-line"), type: "linear", dataKey: item.dataKey, name: item.label ?? item.dataKey, stroke: color, strokeWidth: seriesStrokeWidth, shape: renderTrimmedCurve, dot: false, activeDot: false, isAnimationActive: isEntryAnimationActive, animateNewValues: false, animationBegin: animationBegin, animationDuration: isEntryAnimationActive ? SEMANTIC_LINE_CHART_ANIMATION_DURATION_MS : 0, animationEasing: SEMANTIC_LINE_CHART_ANIMATION_EASING, legendType: "none", tooltipType: "none", zIndex: seriesCurveZIndex }), _jsx(Line, { id: `semantic-line-chart-hit-${item.dataKey}`, className: "semantic-line-chart-series-hit-line", type: "linear", dataKey: item.dataKey, name: item.label ?? item.dataKey, stroke: showTooltip ? color : "none", shape: renderHitCurve, dot: false, activeDot: showTooltip ? renderActiveDot : false, isAnimationActive: false, legendType: "none", tooltipType: showTooltip ? undefined : "none", zIndex: seriesCurveZIndex, ...(hoverInteractionsEnabled ? seriesMouseHandlers : {}) })] }, item.dataKey));
|
|
97
|
+
}), showSeriesDots ? (_jsx(SemanticLineChartSeriesDots, { series: series, data: data, dotRadius: dotRadius, excludedDataKey: hoveredSeriesKey, raisedDataKey: hoveredSeriesKey != null && hoverInteractionsEnabled ? hoveredSeriesKey : null, opacity: seriesDotsOpacity, onSeriesMouseEnter: handleSeriesEnter, onSeriesMouseLeave: handleSeriesLeave })) : null] }) }) }));
|
|
98
|
+
}
|
|
99
|
+
//# sourceMappingURL=SemanticLineChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.js","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
type LineChartPoint = {
|
|
2
|
+
x?: number | null;
|
|
3
|
+
y?: number | null;
|
|
4
|
+
};
|
|
5
|
+
/** Small gap between each line terminus and the dot edge (Figma separation). */
|
|
6
|
+
export declare const SEMANTIC_LINE_CHART_LINE_DOT_SEPARATION_PX = 4;
|
|
7
|
+
/** Distance from dot center where series lines stop along each segment. */
|
|
8
|
+
export declare function getLineTrimRadius(dotInnerRadius: number, separationPx?: number): number;
|
|
9
|
+
/** Trim radius for visible curves: gaps only when dots are shown and entry draw is done. */
|
|
10
|
+
export declare function resolveLineChartTrimRadius(showDots: boolean, dotInnerRadius: number, isEntryAnimationActive: boolean): number;
|
|
11
|
+
/**
|
|
12
|
+
* Builds line path data between data points. When `trimRadius` is zero the path is
|
|
13
|
+
* one continuous polyline (smooth dash-draw animation). Otherwise segments are
|
|
14
|
+
* trimmed so strokes stop before dot centers.
|
|
15
|
+
*/
|
|
16
|
+
export declare function getTrimmedLinearPath(points: ReadonlyArray<LineChartPoint> | undefined, trimRadius: number): string | null;
|
|
17
|
+
export {};
|
|
18
|
+
//# sourceMappingURL=SemanticLineChart.path.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.path.utils.d.ts","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.path.utils.ts"],"names":[],"mappings":"AAAA,KAAK,cAAc,GAAG;IACpB,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClB,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACnB,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,0CAA0C,IAAI,CAAC;AAE5D,2EAA2E;AAC3E,wBAAgB,iBAAiB,CAC/B,cAAc,EAAE,MAAM,EACtB,YAAY,GAAE,MAAmD,GAChE,MAAM,CAER;AAED,4FAA4F;AAC5F,wBAAgB,0BAA0B,CACxC,QAAQ,EAAE,OAAO,EACjB,cAAc,EAAE,MAAM,EACtB,sBAAsB,EAAE,OAAO,GAC9B,MAAM,CAMR;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,aAAa,CAAC,cAAc,CAAC,GAAG,SAAS,EACjD,UAAU,EAAE,MAAM,GACjB,MAAM,GAAG,IAAI,CA6Cf"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
/** Small gap between each line terminus and the dot edge (Figma separation). */
|
|
2
|
+
export const SEMANTIC_LINE_CHART_LINE_DOT_SEPARATION_PX = 4;
|
|
3
|
+
/** Distance from dot center where series lines stop along each segment. */
|
|
4
|
+
export function getLineTrimRadius(dotInnerRadius, separationPx = SEMANTIC_LINE_CHART_LINE_DOT_SEPARATION_PX) {
|
|
5
|
+
return dotInnerRadius + separationPx;
|
|
6
|
+
}
|
|
7
|
+
/** Trim radius for visible curves: gaps only when dots are shown and entry draw is done. */
|
|
8
|
+
export function resolveLineChartTrimRadius(showDots, dotInnerRadius, isEntryAnimationActive) {
|
|
9
|
+
if (!showDots || isEntryAnimationActive) {
|
|
10
|
+
return 0;
|
|
11
|
+
}
|
|
12
|
+
return getLineTrimRadius(dotInnerRadius);
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Builds line path data between data points. When `trimRadius` is zero the path is
|
|
16
|
+
* one continuous polyline (smooth dash-draw animation). Otherwise segments are
|
|
17
|
+
* trimmed so strokes stop before dot centers.
|
|
18
|
+
*/
|
|
19
|
+
export function getTrimmedLinearPath(points, trimRadius) {
|
|
20
|
+
if (points == null || points.length < 2) {
|
|
21
|
+
return null;
|
|
22
|
+
}
|
|
23
|
+
const validPoints = points.filter((point) => point?.x != null && point?.y != null);
|
|
24
|
+
if (validPoints.length < 2) {
|
|
25
|
+
return null;
|
|
26
|
+
}
|
|
27
|
+
if (trimRadius <= 0) {
|
|
28
|
+
return validPoints
|
|
29
|
+
.map((point, index) => `${index === 0 ? "M" : "L"} ${point.x} ${point.y}`)
|
|
30
|
+
.join(" ");
|
|
31
|
+
}
|
|
32
|
+
const segments = [];
|
|
33
|
+
for (let index = 0; index < validPoints.length - 1; index += 1) {
|
|
34
|
+
const start = validPoints[index];
|
|
35
|
+
const end = validPoints[index + 1];
|
|
36
|
+
const dx = end.x - start.x;
|
|
37
|
+
const dy = end.y - start.y;
|
|
38
|
+
const length = Math.hypot(dx, dy);
|
|
39
|
+
if (length <= trimRadius * 2) {
|
|
40
|
+
continue;
|
|
41
|
+
}
|
|
42
|
+
const unitX = dx / length;
|
|
43
|
+
const unitY = dy / length;
|
|
44
|
+
const x1 = start.x + unitX * trimRadius;
|
|
45
|
+
const y1 = start.y + unitY * trimRadius;
|
|
46
|
+
const x2 = end.x - unitX * trimRadius;
|
|
47
|
+
const y2 = end.y - unitY * trimRadius;
|
|
48
|
+
segments.push(`M ${x1} ${y1} L ${x2} ${y2}`);
|
|
49
|
+
}
|
|
50
|
+
return segments.length > 0 ? segments.join(" ") : null;
|
|
51
|
+
}
|
|
52
|
+
//# sourceMappingURL=SemanticLineChart.path.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.path.utils.js","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.path.utils.ts"],"names":[],"mappings":"AAKA,gFAAgF;AAChF,MAAM,CAAC,MAAM,0CAA0C,GAAG,CAAC,CAAC;AAE5D,2EAA2E;AAC3E,MAAM,UAAU,iBAAiB,CAC/B,cAAsB,EACtB,eAAuB,0CAA0C;IAEjE,OAAO,cAAc,GAAG,YAAY,CAAC;AACvC,CAAC;AAED,4FAA4F;AAC5F,MAAM,UAAU,0BAA0B,CACxC,QAAiB,EACjB,cAAsB,EACtB,sBAA+B;IAE/B,IAAI,CAAC,QAAQ,IAAI,sBAAsB,EAAE,CAAC;QACxC,OAAO,CAAC,CAAC;IACX,CAAC;IAED,OAAO,iBAAiB,CAAC,cAAc,CAAC,CAAC;AAC3C,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,oBAAoB,CAClC,MAAiD,EACjD,UAAkB;IAElB,IAAI,MAAM,IAAI,IAAI,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACxC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAC/B,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,EAAE,CAAC,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC,IAAI,IAAI,CACb,CAAC;IAErC,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,UAAU,IAAI,CAAC,EAAE,CAAC;QACpB,OAAO,WAAW;aACf,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,EAAE,CAAC;aACzE,IAAI,CAAC,GAAG,CAAC,CAAC;IACf,CAAC;IAED,MAAM,QAAQ,GAAa,EAAE,CAAC;IAE9B,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC;QAC/D,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;QACjC,MAAM,GAAG,GAAG,WAAW,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;QAEnC,MAAM,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;QAC3B,MAAM,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;QAElC,IAAI,MAAM,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;YAC7B,SAAS;QACX,CAAC;QAED,MAAM,KAAK,GAAG,EAAE,GAAG,MAAM,CAAC;QAC1B,MAAM,KAAK,GAAG,EAAE,GAAG,MAAM,CAAC;QAE1B,MAAM,EAAE,GAAG,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,UAAU,CAAC;QACxC,MAAM,EAAE,GAAG,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,UAAU,CAAC;QACxC,MAAM,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,UAAU,CAAC;QACtC,MAAM,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,UAAU,CAAC;QAEtC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC;IAC/C,CAAC;IAED,OAAO,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;AACzD,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import type * as React from "react";
|
|
2
|
+
import type { Margin } from "recharts";
|
|
3
|
+
import type { ChartConfig } from "../SemanticBarChart/Chart/index.js";
|
|
4
|
+
export type SemanticLineChartDatum = Record<string, string | number> & {
|
|
5
|
+
/** Category label on the X-axis (e.g. date). */
|
|
6
|
+
name: string;
|
|
7
|
+
};
|
|
8
|
+
export type SemanticLineChartSeries = {
|
|
9
|
+
/** Key on each datum row plotted as a line. */
|
|
10
|
+
dataKey: string;
|
|
11
|
+
/** Human-readable name for tooltips, legends, and aria summaries. */
|
|
12
|
+
label?: string;
|
|
13
|
+
/**
|
|
14
|
+
* Override stroke and dot fill. When omitted, resolved from `chartConfig[dataKey].theme`
|
|
15
|
+
* or the default series palette (`SEMANTIC_LINE_CHART_SERIES_THEMES`).
|
|
16
|
+
*/
|
|
17
|
+
color?: string;
|
|
18
|
+
};
|
|
19
|
+
export type SemanticLineChartProps = Omit<React.ComponentProps<"div">, "children"> & {
|
|
20
|
+
/** One row per X-axis category; each `series.dataKey` must exist on every row. */
|
|
21
|
+
data: SemanticLineChartDatum[];
|
|
22
|
+
/** Trend lines to render; at least one required. */
|
|
23
|
+
series: SemanticLineChartSeries[];
|
|
24
|
+
/** Extra classes on the inner `ChartContainer`. */
|
|
25
|
+
chartClassName?: string;
|
|
26
|
+
/** Recharts `<LineChart margin={...}>`. */
|
|
27
|
+
chartMargin?: Partial<Margin>;
|
|
28
|
+
/** Tooltip/legend color keys; colors default from {@link SEMANTIC_LINE_CHART_SERIES_COLORS}. */
|
|
29
|
+
chartConfig?: ChartConfig;
|
|
30
|
+
/** Optional stable id for `ChartContainer`. */
|
|
31
|
+
chartId?: string;
|
|
32
|
+
/** When set, passed to `<YAxis domain={...} />`. Omit for automatic scaling. */
|
|
33
|
+
yDomain?: [number, number];
|
|
34
|
+
/** When set, passed to `<YAxis ticks={...} />`. */
|
|
35
|
+
yTicks?: number[];
|
|
36
|
+
yTickFormatter?: (value: number) => string;
|
|
37
|
+
xTickFormatter?: (value: string) => string;
|
|
38
|
+
/** Show vertical grid lines at each X tick (default). */
|
|
39
|
+
gridVertical?: boolean;
|
|
40
|
+
/** Line stroke width in px. */
|
|
41
|
+
strokeWidth?: number;
|
|
42
|
+
/** Dot radius in px. */
|
|
43
|
+
dotRadius?: number;
|
|
44
|
+
/** Show dots at each data point (default). */
|
|
45
|
+
showDots?: boolean;
|
|
46
|
+
/** Optional tooltip layer. */
|
|
47
|
+
showTooltip?: boolean;
|
|
48
|
+
};
|
|
49
|
+
//# sourceMappingURL=SemanticLineChart.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.types.d.ts","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAEtE,MAAM,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,GAAG;IACrE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,+CAA+C;IAC/C,OAAO,EAAE,MAAM,CAAC;IAChB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IACnF,kFAAkF;IAClF,IAAI,EAAE,sBAAsB,EAAE,CAAC;IAC/B,oDAAoD;IACpD,MAAM,EAAE,uBAAuB,EAAE,CAAC;IAClC,mDAAmD;IACnD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,2CAA2C;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;IAC9B,gGAAgG;IAChG,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gFAAgF;IAChF,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC3B,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,yDAAyD;IACzD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.types.js","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { ChartConfig } from "../SemanticBarChart/Chart/index.js";
|
|
2
|
+
import type { SemanticLineChartSeries } from "./SemanticLineChart.types.js";
|
|
3
|
+
import { type SemanticLineChartSeriesTheme } from "./SemanticLineChart.variants.js";
|
|
4
|
+
/** Scoped CSS variable injected by `ChartContainer` / `ChartStyle` per series key. */
|
|
5
|
+
export declare function seriesColorVar(dataKey: string): string;
|
|
6
|
+
export declare function resolveSeriesTheme(item: SemanticLineChartSeries, index: number, chartConfig: ChartConfig): SemanticLineChartSeriesTheme;
|
|
7
|
+
export declare function buildLineChartConfig(series: SemanticLineChartSeries[], chartConfig: ChartConfig): ChartConfig;
|
|
8
|
+
/** Y-axis tick values that receive horizontal grid lines (excludes the bottom / domain min). */
|
|
9
|
+
export declare function resolveGridHorizontalValues(yTicks: number[] | undefined, yDomain: [number, number] | undefined): number[] | undefined;
|
|
10
|
+
/**
|
|
11
|
+
* Puts the hovered series last so its curve and dots render above siblings
|
|
12
|
+
* within Recharts' fixed z-index layers (line `400`, dot `600`).
|
|
13
|
+
*/
|
|
14
|
+
export declare function orderSeriesForHover<T extends {
|
|
15
|
+
dataKey: string;
|
|
16
|
+
}>(series: readonly T[], hoveredDataKey: string | null): T[];
|
|
17
|
+
//# sourceMappingURL=SemanticLineChart.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SemanticLineChart.utils.d.ts","sourceRoot":"","sources":["../../../src/components/SemanticLineChart/SemanticLineChart.utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACtE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AAC5E,OAAO,EAEL,KAAK,4BAA4B,EAClC,MAAM,iCAAiC,CAAC;AAEzC,sFAAsF;AACtF,wBAAgB,cAAc,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAEtD;AAMD,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,uBAAuB,EAC7B,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,WAAW,GACvB,4BAA4B,CAiB9B;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,uBAAuB,EAAE,EACjC,WAAW,EAAE,WAAW,GACvB,WAAW,CAeb;AAED,gGAAgG;AAChG,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAC5B,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,GACpC,MAAM,EAAE,GAAG,SAAS,CAQtB;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,SAAS;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,EAC/D,MAAM,EAAE,SAAS,CAAC,EAAE,EACpB,cAAc,EAAE,MAAM,GAAG,IAAI,GAC5B,CAAC,EAAE,CAWL"}
|