@sproutsocial/seeds-react-data-viz 0.18.0 → 0.19.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/bar/index.d.mts +2 -0
- package/dist/bar/index.d.ts +2 -0
- package/dist/bar/index.js +31 -78
- package/dist/bar/index.js.map +1 -1
- package/dist/bar.css +39 -0
- package/dist/chart-styles.css +295 -0
- package/dist/{chunk-GVAMWFB7.js → chunk-4IOYAUAK.js} +3 -3
- package/dist/{chunk-GVAMWFB7.js.map → chunk-4IOYAUAK.js.map} +1 -1
- package/dist/chunk-6EIJCJCN.js +22 -0
- package/dist/chunk-6EIJCJCN.js.map +1 -0
- package/dist/{chunk-XP7HNV23.js → chunk-DLO4WZLT.js} +3 -4
- package/dist/chunk-DLO4WZLT.js.map +1 -0
- package/dist/donut/index.d.mts +8 -0
- package/dist/donut/index.d.ts +8 -0
- package/dist/donut/index.js +29 -45
- package/dist/donut/index.js.map +1 -1
- package/dist/donut.css +45 -0
- package/dist/esm/bar/index.js +27 -74
- package/dist/esm/bar/index.js.map +1 -1
- package/dist/esm/{chunk-X2KAXY3P.js → chunk-J5QE7VCW.js} +2 -2
- package/dist/esm/chunk-P3MVYSHX.js +22 -0
- package/dist/esm/chunk-P3MVYSHX.js.map +1 -0
- package/dist/esm/{chunk-JLFXOEV2.js → chunk-U6ZOSXK7.js} +2 -3
- package/dist/esm/chunk-U6ZOSXK7.js.map +1 -0
- package/dist/esm/donut/index.js +28 -44
- package/dist/esm/donut/index.js.map +1 -1
- package/dist/esm/line-area/index.js +22 -19
- package/dist/esm/line-area/index.js.map +1 -1
- package/dist/esm/sparkline/index.js +1 -1
- package/dist/line-area/index.d.mts +15 -0
- package/dist/line-area/index.d.ts +15 -0
- package/dist/line-area/index.js +27 -24
- package/dist/line-area/index.js.map +1 -1
- package/dist/line-area.css +112 -0
- package/dist/sparkline/index.js +3 -3
- package/package.json +11 -7
- package/dist/chunk-XP7HNV23.js.map +0 -1
- package/dist/esm/chunk-JLFXOEV2.js.map +0 -1
- /package/dist/esm/{chunk-X2KAXY3P.js.map → chunk-J5QE7VCW.js.map} +0 -0
package/dist/bar/index.d.mts
CHANGED
|
@@ -35,6 +35,8 @@ interface BarChartProps {
|
|
|
35
35
|
/** Wired into Highcharts' `accessibility.description`. */
|
|
36
36
|
description: string;
|
|
37
37
|
series: Array<BarSeries>;
|
|
38
|
+
/** Tailwind / class passthrough appended to the container class chain. */
|
|
39
|
+
className?: string;
|
|
38
40
|
/** Orientation of the bars. `"vertical"` (default) renders columns; `"horizontal"` renders bars. */
|
|
39
41
|
direction?: BarChartDirection;
|
|
40
42
|
/** Maximum number of series to display. Series beyond the limit are dropped. Default `10`. */
|
package/dist/bar/index.d.ts
CHANGED
|
@@ -35,6 +35,8 @@ interface BarChartProps {
|
|
|
35
35
|
/** Wired into Highcharts' `accessibility.description`. */
|
|
36
36
|
description: string;
|
|
37
37
|
series: Array<BarSeries>;
|
|
38
|
+
/** Tailwind / class passthrough appended to the container class chain. */
|
|
39
|
+
className?: string;
|
|
38
40
|
/** Orientation of the bars. `"vertical"` (default) renders columns; `"horizontal"` renders bars. */
|
|
39
41
|
direction?: BarChartDirection;
|
|
40
42
|
/** Maximum number of series to display. Series beyond the limit are dropped. Default `10`. */
|
package/dist/bar/index.js
CHANGED
|
@@ -1,20 +1,21 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _chunk4IOYAUAKjs = require('../chunk-4IOYAUAK.js');
|
|
6
6
|
|
|
7
7
|
|
|
8
|
+
var _chunk6EIJCJCNjs = require('../chunk-6EIJCJCN.js');
|
|
8
9
|
|
|
9
|
-
var _chunk6D7P3IOTjs = require('../chunk-6D7P3IOT.js');
|
|
10
10
|
|
|
11
11
|
|
|
12
|
+
var _chunk6D7P3IOTjs = require('../chunk-6D7P3IOT.js');
|
|
12
13
|
|
|
13
14
|
|
|
14
|
-
var _chunkXP7HNV23js = require('../chunk-XP7HNV23.js');
|
|
15
15
|
|
|
16
16
|
|
|
17
|
-
var
|
|
17
|
+
var _chunkDLO4WZLTjs = require('../chunk-DLO4WZLT.js');
|
|
18
|
+
require('../chunk-WEKDYQ4T.js');
|
|
18
19
|
|
|
19
20
|
// src/charts/bar/BarChart.tsx
|
|
20
21
|
var _react = require('react');
|
|
@@ -27,7 +28,7 @@ function buildBarChartOptions(props, direction, series = props.series) {
|
|
|
27
28
|
const chartType = highchartsType(direction);
|
|
28
29
|
const isDatetime = props.xAxis.type === "datetime";
|
|
29
30
|
const tooltipTimezone = _chunk6D7P3IOTjs.resolveTooltipTimezone.call(void 0, props.xAxis, props.timezone);
|
|
30
|
-
const { annotations, lookup: annotationLookup } =
|
|
31
|
+
const { annotations, lookup: annotationLookup } = _chunk4IOYAUAKjs.buildAnnotationConfig.call(void 0,
|
|
31
32
|
props.annotations
|
|
32
33
|
);
|
|
33
34
|
const barTypeConfig = {
|
|
@@ -74,7 +75,7 @@ function buildBarChartOptions(props, direction, series = props.series) {
|
|
|
74
75
|
}
|
|
75
76
|
};
|
|
76
77
|
const options = {
|
|
77
|
-
...
|
|
78
|
+
..._chunkDLO4WZLTjs.buildBaseChartOptions.call(void 0, {
|
|
78
79
|
type: chartType,
|
|
79
80
|
description: props.description,
|
|
80
81
|
valueSuffix: props.valueSuffix,
|
|
@@ -95,7 +96,7 @@ function buildBarChartOptions(props, direction, series = props.series) {
|
|
|
95
96
|
enabled: _optionalChain([props, 'access', _19 => _19.yAxis, 'optionalAccess', _20 => _20.showLabels]) !== false,
|
|
96
97
|
// A declarative `format` drives ticks through the shared valueFormatter;
|
|
97
98
|
// absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).
|
|
98
|
-
formatter: _optionalChain([props, 'access', _21 => _21.yAxis, 'optionalAccess', _22 => _22.format]) ?
|
|
99
|
+
formatter: _optionalChain([props, 'access', _21 => _21.yAxis, 'optionalAccess', _22 => _22.format]) ? _chunk4IOYAUAKjs.makeValueAxisLabelFormatter.call(void 0, props.yAxis.format) : _chunk4IOYAUAKjs.defaultValueAxisLabelFormatter
|
|
99
100
|
}
|
|
100
101
|
},
|
|
101
102
|
plotOptions: {
|
|
@@ -113,52 +114,6 @@ function buildBarChartOptions(props, direction, series = props.series) {
|
|
|
113
114
|
return { options, annotationLookup, tooltipTimezone };
|
|
114
115
|
}
|
|
115
116
|
|
|
116
|
-
// src/charts/bar/styles.ts
|
|
117
|
-
var _styledcomponents = require('styled-components'); var _styledcomponents2 = _interopRequireDefault(_styledcomponents);
|
|
118
|
-
var _seedsreactbox = require('@sproutsocial/seeds-react-box');
|
|
119
|
-
|
|
120
|
-
// src/charts/shared/styles.ts
|
|
121
|
-
|
|
122
|
-
var axisLabelV2Styles = _styledcomponents.css`
|
|
123
|
-
.highcharts-xaxis-labels,
|
|
124
|
-
.highcharts-yaxis-labels {
|
|
125
|
-
// SVG labels (styledMode): fill is the SVG text colour; color has no effect.
|
|
126
|
-
text {
|
|
127
|
-
font-family: ${({ theme }) => theme.fontFamily};
|
|
128
|
-
${({ theme }) => theme.typography[100]};
|
|
129
|
-
font-weight: ${({ theme }) => theme.fontWeights.normal};
|
|
130
|
-
fill: ${({ theme }) => theme.colors.text.subtext};
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
// Two-line stacked datetime label: the boundary token is an
|
|
134
|
-
// hc-axis-label-secondary tspan on a second line, rendered semibold.
|
|
135
|
-
.highcharts-xaxis-labels text tspan.hc-axis-label-secondary {
|
|
136
|
-
font-weight: ${({ theme }) => theme.fontWeights.semibold};
|
|
137
|
-
}
|
|
138
|
-
`;
|
|
139
|
-
|
|
140
|
-
// src/charts/bar/styles.ts
|
|
141
|
-
var barFamilyStyles = _styledcomponents.css`
|
|
142
|
-
${_chunkWEKDYQ4Tjs.timeSeriesChartStyles}
|
|
143
|
-
|
|
144
|
-
/*
|
|
145
|
-
When the chart container is hovered, dim all bars. Then restore opacity for
|
|
146
|
-
the hovered bar(s) — flagged with the bar-point-hover class by the adapter —
|
|
147
|
-
so the non-hovered bars fade out.
|
|
148
|
-
*/
|
|
149
|
-
.highcharts-container:hover .highcharts-point {
|
|
150
|
-
fill-opacity: 0.3;
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
.highcharts-point.bar-point-hover {
|
|
154
|
-
fill-opacity: 1 !important;
|
|
155
|
-
}
|
|
156
|
-
`;
|
|
157
|
-
var BarStyledBox = _styledcomponents2.default.call(void 0, _seedsreactbox.Box)`
|
|
158
|
-
${barFamilyStyles}
|
|
159
|
-
${axisLabelV2Styles}
|
|
160
|
-
`;
|
|
161
|
-
|
|
162
117
|
// src/charts/constants.ts
|
|
163
118
|
var BAR_CHART_DEFAULT_SERIES_LIMIT = 10;
|
|
164
119
|
|
|
@@ -166,7 +121,7 @@ var BAR_CHART_DEFAULT_SERIES_LIMIT = 10;
|
|
|
166
121
|
var _jsxruntime = require('react/jsx-runtime');
|
|
167
122
|
var BarChart = _react.memo.call(void 0, function BarChart2(props) {
|
|
168
123
|
const seriesLimit = _nullishCoalesce(props.seriesLimit, () => ( BAR_CHART_DEFAULT_SERIES_LIMIT));
|
|
169
|
-
const { colors, series } =
|
|
124
|
+
const { colors, series } = _chunkDLO4WZLTjs.useSeedsChartSetup.call(void 0, {
|
|
170
125
|
series: props.series,
|
|
171
126
|
seriesLimit,
|
|
172
127
|
isSeriesLimitOverridden: props.seriesLimit !== void 0,
|
|
@@ -179,31 +134,29 @@ var BarChart = _react.memo.call(void 0, function BarChart2(props) {
|
|
|
179
134
|
series
|
|
180
135
|
);
|
|
181
136
|
const hasOnClick = Boolean(props.onClick);
|
|
182
|
-
|
|
183
|
-
|
|
137
|
+
const containerProps = _chunk6EIJCJCNjs.getChartContainerProps.call(void 0, {
|
|
138
|
+
familyClasses: ["seeds-chart-time-series", "seeds-chart-bar"],
|
|
139
|
+
colors: series.map((s) => s.color),
|
|
140
|
+
hasOnClick,
|
|
141
|
+
className: props.className
|
|
142
|
+
});
|
|
143
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ...containerProps, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
144
|
+
_chunkDLO4WZLTjs.ChartRenderer,
|
|
184
145
|
{
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
tooltipClickLabel: props.tooltipClickLabel,
|
|
198
|
-
timezone: tooltipTimezone,
|
|
199
|
-
invalidNumberLabel: props.invalidNumberLabel,
|
|
200
|
-
valueFormat: _optionalChain([props, 'access', _23 => _23.yAxis, 'optionalAccess', _24 => _24.format]),
|
|
201
|
-
exportTitle: props.exportTitle,
|
|
202
|
-
onReady: props.onReady
|
|
203
|
-
}
|
|
204
|
-
)
|
|
146
|
+
options,
|
|
147
|
+
series,
|
|
148
|
+
colors,
|
|
149
|
+
tooltip: props.tooltip,
|
|
150
|
+
annotationLookup,
|
|
151
|
+
hasOnClick,
|
|
152
|
+
tooltipClickLabel: props.tooltipClickLabel,
|
|
153
|
+
timezone: tooltipTimezone,
|
|
154
|
+
invalidNumberLabel: props.invalidNumberLabel,
|
|
155
|
+
valueFormat: _optionalChain([props, 'access', _23 => _23.yAxis, 'optionalAccess', _24 => _24.format]),
|
|
156
|
+
exportTitle: props.exportTitle,
|
|
157
|
+
onReady: props.onReady
|
|
205
158
|
}
|
|
206
|
-
);
|
|
159
|
+
) });
|
|
207
160
|
});
|
|
208
161
|
|
|
209
162
|
|
package/dist/bar/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/bar/index.js","../../src/charts/bar/BarChart.tsx","../../src/charts/bar/adapter.ts","../../src/charts/bar/styles.ts","../../src/charts/shared/styles.ts","../../src/charts/constants.ts"],"names":["css","BarChart"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/bar/index.js","sourcesContent":[null,"import { memo } from \"react\";\nimport { useSeedsChartSetup, ChartRenderer } from \"../shared/chartBase\";\nimport { buildBarChartOptions } from \"./adapter\";\nimport { BarStyledBox } from \"./styles\";\nimport type { BarChartProps } from \"./types\";\nimport { BAR_CHART_DEFAULT_SERIES_LIMIT } from \"../constants\";\n\nexport const BarChart = memo(function BarChart(props: BarChartProps) {\n // The shared hook caps the series to the limit (and warns once per render\n // when the default is exceeded without an explicit override) so the adapter\n // and renderer below all consume the capped data.\n const seriesLimit = props.seriesLimit ?? BAR_CHART_DEFAULT_SERIES_LIMIT;\n const { colors, series } = useSeedsChartSetup({\n series: props.series,\n seriesLimit,\n isSeriesLimitOverridden: props.seriesLimit !== undefined,\n hideSeriesLimitWarning: props.hideSeriesLimitWarning,\n componentName: \"BarChart\",\n });\n\n const { options, annotationLookup, tooltipTimezone } = buildBarChartOptions(\n props,\n props.direction ?? \"vertical\",\n series\n );\n const hasOnClick = Boolean(props.onClick);\n\n return (\n <BarStyledBox\n $colors={colors}\n $hasOnClick={hasOnClick}\n bg=\"container.background.base\"\n >\n <ChartRenderer\n options={options}\n series={series}\n colors={colors}\n tooltip={props.tooltip}\n annotationLookup={annotationLookup}\n hasOnClick={hasOnClick}\n tooltipClickLabel={props.tooltipClickLabel}\n timezone={tooltipTimezone}\n invalidNumberLabel={props.invalidNumberLabel}\n valueFormat={props.yAxis?.format}\n exportTitle={props.exportTitle}\n onReady={props.onReady}\n />\n </BarStyledBox>\n );\n});\n","import { buildAnnotationConfig } from \"../shared/annotations\";\nimport type { ChartAnnotationLookup } from \"../shared/annotations\";\nimport type {\n SeedsChartColumnPlotOptions,\n SeedsChartOptions,\n} from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n buildDimensionalAxis,\n resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport {\n defaultValueAxisLabelFormatter,\n makeValueAxisLabelFormatter,\n} from \"../shared/valueAxisLabelFormatter\";\nimport type { BarChartDirection, BarChartProps } from \"./types\";\n\n// Maps the public `direction` to the Highcharts series/chart type. Highcharts\n// `bar` is a horizontally-oriented `column`: it performs the visual rotation\n// while keeping axis roles (xAxis = category, yAxis = value), so the rest of the\n// adapter is direction-agnostic.\nfunction highchartsType(direction: BarChartDirection): \"column\" | \"bar\" {\n return direction === \"horizontal\" ? \"bar\" : \"column\";\n}\n\nexport function buildBarChartOptions(\n props: BarChartProps,\n direction: BarChartDirection,\n // The (already-capped) series to render. Defaults to `props.series` so the\n // ~40 existing call sites keep working; the component passes the capped\n // series from `useSeedsChartSetup` explicitly.\n series: BarChartProps[\"series\"] = props.series\n): {\n options: SeedsChartOptions;\n annotationLookup: ChartAnnotationLookup | undefined;\n /** Resolved timezone for the tooltip date formatter; undefined on category axes. */\n tooltipTimezone: string | undefined;\n} {\n const chartType = highchartsType(direction);\n const isDatetime = props.xAxis.type === \"datetime\";\n const tooltipTimezone = resolveTooltipTimezone(props.xAxis, props.timezone);\n const { annotations, lookup: annotationLookup } = buildAnnotationConfig(\n props.annotations\n );\n // `column` (vertical) and `bar` (horizontal) take the same option shape, so a\n // single config is assigned under the active direction's key. Typed\n // explicitly so the `point.events` handlers below keep their `this`/`event`\n // contextual types (a computed `[chartType]` key would otherwise erase them).\n const barTypeConfig: SeedsChartColumnPlotOptions = {\n // \"grouped\" maps to omitting `stacking` — Highcharts renders multi-series\n // columns side-by-side when no stacking is set.\n ...(props.stacking === \"grouped\"\n ? {}\n : { stacking: props.stacking ?? \"normal\" }),\n // Horizontal bars are height-constrained (fixed chart height ÷ categories),\n // so the same padding fractions that work for columns produce hairline bars.\n pointPadding: direction === \"horizontal\" ? 0.05 : 0.25,\n groupPadding: direction === \"horizontal\" ? 0.1 : 0.25,\n // Fixed bar width on datetime axes. Sparse time-series otherwise size\n // columns from the (large) gap between points and balloon; this mirrors\n // v1's `pointWidth: 20` time-series treatment. Dense datetime data may\n // instead want a `maxPointWidth` cap — revisit when Line/Area land.\n ...(isDatetime ? { pointWidth: 20 } : {}),\n borderRadius: 4,\n borderWidth: 0,\n // Pairs with the `:hover` dimming rule in `styles.ts`: while the cursor\n // is over the chart, all bars dim; these handlers restore opacity for\n // every bar at the hovered x (so stacked/grouped bars highlight together\n // rather than just the single hovered bar).\n point: {\n events: {\n click: props.onClick\n ? (event) => props.onClick!({ position: event.point.x })\n : undefined,\n mouseOver: function () {\n const x = this.x;\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n if (point.x !== x) return;\n point.graphic?.element?.classList.add(\"bar-point-hover\");\n });\n });\n },\n mouseOut: function () {\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n point.graphic?.element?.classList.remove(\"bar-point-hover\");\n });\n });\n },\n },\n },\n };\n const options: SeedsChartOptions = {\n ...buildBaseChartOptions({\n type: chartType,\n description: props.description,\n valueSuffix: props.valueSuffix,\n reserveTopMargin: Boolean(annotations),\n timezone: tooltipTimezone,\n }),\n xAxis: buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n yAxis: {\n min: props.yAxis?.min,\n max: props.yAxis?.max,\n gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,\n // A dedicated plotLine at 0, styled distinctly from regular gridlines\n // (see chartStyles.ts).\n plotLines: [{ value: 0, className: \"y-axis-zero-line\", zIndex: 3 }],\n title: { text: props.yAxis?.title ?? \"\" },\n labels: {\n // `showLabels` toggles tick-label visibility; defaults to shown.\n enabled: props.yAxis?.showLabels !== false,\n // A declarative `format` drives ticks through the shared valueFormatter;\n // absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).\n formatter: props.yAxis?.format\n ? makeValueAxisLabelFormatter(props.yAxis.format)\n : defaultValueAxisLabelFormatter,\n },\n },\n plotOptions: {\n series: { animation: false },\n [chartType]: barTypeConfig,\n },\n series: series.map((s) => ({\n type: chartType,\n name: s.name,\n data: [...s.data],\n color: s.color,\n })),\n ...(annotations ? { annotations } : {}),\n };\n\n return { options, annotationLookup, tooltipTimezone };\n}\n","import styled, { css } from \"styled-components\";\nimport { Box } from \"@sproutsocial/seeds-react-box\";\nimport { timeSeriesChartStyles } from \"../../styles/chartStyles\";\nimport { axisLabelV2Styles } from \"../shared/styles\";\nimport type {\n TypeChartStyleColor,\n TypeChartStyleHasOnClick,\n} from \"../../types\";\n\ntype StyleProps = Readonly<{\n $colors: ReadonlyArray<TypeChartStyleColor>;\n $hasOnClick: TypeChartStyleHasOnClick;\n}>;\n\n// Direction-neutral styling shared by the v2 bar family (vertical + horizontal).\n// Consumes only the v1 `timeSeriesChartStyles` base and owns the hover-dimming\n// block itself, keyed on the neutral `.bar-point-hover` class the adapter emits\n// — so v2 no longer imports v1 *component* styles (see `shared/styles.ts`).\nexport const barFamilyStyles = css<StyleProps>`\n ${timeSeriesChartStyles}\n\n /*\n When the chart container is hovered, dim all bars. Then restore opacity for\n the hovered bar(s) — flagged with the bar-point-hover class by the adapter —\n so the non-hovered bars fade out.\n */\n .highcharts-container:hover .highcharts-point {\n fill-opacity: 0.3;\n }\n\n .highcharts-point.bar-point-hover {\n fill-opacity: 1 !important;\n }\n`;\n\nexport const BarStyledBox = styled(Box)<StyleProps>`\n ${barFamilyStyles}\n ${axisLabelV2Styles}\n`;\n","import { css } from \"styled-components\";\n\n/**\n * v2 chart axis-label styles. v2 charts render in `styledMode` with\n * `useHTML: false`, so axis labels are SVG `<text>` / `<tspan>` rather than the\n * HTML `<span>`s v1 uses; these mirror the v1 HTML label rules in\n * `styles/chartStyles.ts` for the SVG element type.\n *\n * Kept here, separate from v1's `timeSeriesChartStyles`: v2 may *consume* the v1\n * styles, but v2-specific rules must not accrete into the v1 files — that keeps\n * the eventual v1 → v2 port clean and avoids coupling. Compose this into each v2\n * chart family's styled wrapper.\n */\nexport const axisLabelV2Styles = css`\n .highcharts-xaxis-labels,\n .highcharts-yaxis-labels {\n // SVG labels (styledMode): fill is the SVG text colour; color has no effect.\n text {\n font-family: ${({ theme }) => theme.fontFamily};\n ${({ theme }) => theme.typography[100]};\n font-weight: ${({ theme }) => theme.fontWeights.normal};\n fill: ${({ theme }) => theme.colors.text.subtext};\n }\n }\n // Two-line stacked datetime label: the boundary token is an\n // hc-axis-label-secondary tspan on a second line, rendered semibold.\n .highcharts-xaxis-labels text tspan.hc-axis-label-secondary {\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n }\n`;\n","export const BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/bar/index.js","../../src/charts/bar/BarChart.tsx","../../src/charts/bar/adapter.ts","../../src/charts/constants.ts"],"names":["BarChart"],"mappings":"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","file":"/home/runner/_work/seeds/seeds/seeds-react/seeds-react-data-viz/dist/bar/index.js","sourcesContent":[null,"import { memo } from \"react\";\nimport { useSeedsChartSetup, ChartRenderer } from \"../shared/chartBase\";\nimport { getChartContainerProps } from \"../shared/chartContainer\";\nimport { buildBarChartOptions } from \"./adapter\";\nimport type { BarChartProps } from \"./types\";\nimport { BAR_CHART_DEFAULT_SERIES_LIMIT } from \"../constants\";\n\nexport const BarChart = memo(function BarChart(props: BarChartProps) {\n // The shared hook caps the series to the limit (and warns once per render\n // when the default is exceeded without an explicit override) so the adapter\n // and renderer below all consume the capped data.\n const seriesLimit = props.seriesLimit ?? BAR_CHART_DEFAULT_SERIES_LIMIT;\n const { colors, series } = useSeedsChartSetup({\n series: props.series,\n seriesLimit,\n isSeriesLimitOverridden: props.seriesLimit !== undefined,\n hideSeriesLimitWarning: props.hideSeriesLimitWarning,\n componentName: \"BarChart\",\n });\n\n const { options, annotationLookup, tooltipTimezone } = buildBarChartOptions(\n props,\n props.direction ?? \"vertical\",\n series\n );\n const hasOnClick = Boolean(props.onClick);\n\n // Plain <div> consuming the shared chart-styles.css contract via\n // getChartContainerProps. Colors are the RAW per-series colors (undefined when\n // unset, so only explicit overrides inline --highcharts-color-N), NOT the\n // palette-resolved `colors` passed to ChartRenderer. Neither stylesheet is\n // self-imported (consumers import both).\n const containerProps = getChartContainerProps({\n familyClasses: [\"seeds-chart-time-series\", \"seeds-chart-bar\"],\n colors: series.map((s) => s.color),\n hasOnClick,\n className: props.className,\n });\n\n return (\n <div {...containerProps}>\n <ChartRenderer\n options={options}\n series={series}\n colors={colors}\n tooltip={props.tooltip}\n annotationLookup={annotationLookup}\n hasOnClick={hasOnClick}\n tooltipClickLabel={props.tooltipClickLabel}\n timezone={tooltipTimezone}\n invalidNumberLabel={props.invalidNumberLabel}\n valueFormat={props.yAxis?.format}\n exportTitle={props.exportTitle}\n onReady={props.onReady}\n />\n </div>\n );\n});\n","import { buildAnnotationConfig } from \"../shared/annotations\";\nimport type { ChartAnnotationLookup } from \"../shared/annotations\";\nimport type {\n SeedsChartColumnPlotOptions,\n SeedsChartOptions,\n} from \"../shared/chartBase\";\nimport { buildBaseChartOptions } from \"../shared/baseChartOptions\";\nimport {\n buildDimensionalAxis,\n resolveTooltipTimezone,\n} from \"../shared/axisOptions\";\nimport {\n defaultValueAxisLabelFormatter,\n makeValueAxisLabelFormatter,\n} from \"../shared/valueAxisLabelFormatter\";\nimport type { BarChartDirection, BarChartProps } from \"./types\";\n\n// Maps the public `direction` to the Highcharts series/chart type. Highcharts\n// `bar` is a horizontally-oriented `column`: it performs the visual rotation\n// while keeping axis roles (xAxis = category, yAxis = value), so the rest of the\n// adapter is direction-agnostic.\nfunction highchartsType(direction: BarChartDirection): \"column\" | \"bar\" {\n return direction === \"horizontal\" ? \"bar\" : \"column\";\n}\n\nexport function buildBarChartOptions(\n props: BarChartProps,\n direction: BarChartDirection,\n // The (already-capped) series to render. Defaults to `props.series` so the\n // ~40 existing call sites keep working; the component passes the capped\n // series from `useSeedsChartSetup` explicitly.\n series: BarChartProps[\"series\"] = props.series\n): {\n options: SeedsChartOptions;\n annotationLookup: ChartAnnotationLookup | undefined;\n /** Resolved timezone for the tooltip date formatter; undefined on category axes. */\n tooltipTimezone: string | undefined;\n} {\n const chartType = highchartsType(direction);\n const isDatetime = props.xAxis.type === \"datetime\";\n const tooltipTimezone = resolveTooltipTimezone(props.xAxis, props.timezone);\n const { annotations, lookup: annotationLookup } = buildAnnotationConfig(\n props.annotations\n );\n // `column` (vertical) and `bar` (horizontal) take the same option shape, so a\n // single config is assigned under the active direction's key. Typed\n // explicitly so the `point.events` handlers below keep their `this`/`event`\n // contextual types (a computed `[chartType]` key would otherwise erase them).\n const barTypeConfig: SeedsChartColumnPlotOptions = {\n // \"grouped\" maps to omitting `stacking` — Highcharts renders multi-series\n // columns side-by-side when no stacking is set.\n ...(props.stacking === \"grouped\"\n ? {}\n : { stacking: props.stacking ?? \"normal\" }),\n // Horizontal bars are height-constrained (fixed chart height ÷ categories),\n // so the same padding fractions that work for columns produce hairline bars.\n pointPadding: direction === \"horizontal\" ? 0.05 : 0.25,\n groupPadding: direction === \"horizontal\" ? 0.1 : 0.25,\n // Fixed bar width on datetime axes. Sparse time-series otherwise size\n // columns from the (large) gap between points and balloon; this mirrors\n // v1's `pointWidth: 20` time-series treatment. Dense datetime data may\n // instead want a `maxPointWidth` cap — revisit when Line/Area land.\n ...(isDatetime ? { pointWidth: 20 } : {}),\n borderRadius: 4,\n borderWidth: 0,\n // Pairs with the `:hover` dimming rule in `styles.ts`: while the cursor\n // is over the chart, all bars dim; these handlers restore opacity for\n // every bar at the hovered x (so stacked/grouped bars highlight together\n // rather than just the single hovered bar).\n point: {\n events: {\n click: props.onClick\n ? (event) => props.onClick!({ position: event.point.x })\n : undefined,\n mouseOver: function () {\n const x = this.x;\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n if (point.x !== x) return;\n point.graphic?.element?.classList.add(\"bar-point-hover\");\n });\n });\n },\n mouseOut: function () {\n this.series.chart.series.forEach((s) => {\n if (s.type !== chartType) return;\n s.data.forEach((point) => {\n point.graphic?.element?.classList.remove(\"bar-point-hover\");\n });\n });\n },\n },\n },\n };\n const options: SeedsChartOptions = {\n ...buildBaseChartOptions({\n type: chartType,\n description: props.description,\n valueSuffix: props.valueSuffix,\n reserveTopMargin: Boolean(annotations),\n timezone: tooltipTimezone,\n }),\n xAxis: buildDimensionalAxis(props.xAxis, tooltipTimezone ?? \"UTC\"),\n yAxis: {\n min: props.yAxis?.min,\n max: props.yAxis?.max,\n gridLineWidth: props.yAxis?.showGridLines === false ? 0 : 1,\n // A dedicated plotLine at 0, styled distinctly from regular gridlines\n // (see chartStyles.ts).\n plotLines: [{ value: 0, className: \"y-axis-zero-line\", zIndex: 3 }],\n title: { text: props.yAxis?.title ?? \"\" },\n labels: {\n // `showLabels` toggles tick-label visibility; defaults to shown.\n enabled: props.yAxis?.showLabels !== false,\n // A declarative `format` drives ticks through the shared valueFormatter;\n // absent it, the zero-config decimal default (1.20K / 1.20M / 1.20B).\n formatter: props.yAxis?.format\n ? makeValueAxisLabelFormatter(props.yAxis.format)\n : defaultValueAxisLabelFormatter,\n },\n },\n plotOptions: {\n series: { animation: false },\n [chartType]: barTypeConfig,\n },\n series: series.map((s) => ({\n type: chartType,\n name: s.name,\n data: [...s.data],\n color: s.color,\n })),\n ...(annotations ? { annotations } : {}),\n };\n\n return { options, annotationLookup, tooltipTimezone };\n}\n","export const BAR_CHART_DEFAULT_SERIES_LIMIT = 10;\n"]}
|
package/dist/bar.css
ADDED
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Seeds BarChart per-family styles.
|
|
3
|
+
*
|
|
4
|
+
* Consumers import this alongside the shared foundation stylesheet:
|
|
5
|
+
*
|
|
6
|
+
* import "@sproutsocial/seeds-react-data-viz/chart-styles.css";
|
|
7
|
+
* import "@sproutsocial/seeds-react-data-viz/bar.css";
|
|
8
|
+
*
|
|
9
|
+
* chart-styles.css owns the shared .seeds-chart layer (background,
|
|
10
|
+
* annotation-label rules, the per-series .highcharts-color-0..19 palette
|
|
11
|
+
* fallback, the [data-has-on-click] cursor rules, the global tooltip overrides,
|
|
12
|
+
* and the .seeds-chart-legend spacing) AND the shared cross-family
|
|
13
|
+
* .seeds-chart-time-series layer (crosshair, grid/axis lines, ticks, zero line,
|
|
14
|
+
* hover opacity guard, and the v2 SVG axis-label typography) that line-area also
|
|
15
|
+
* uses. This file owns ONLY the truly bar-specific .seeds-chart-bar block — it
|
|
16
|
+
* deliberately does not repeat anything chart-styles.css already ships.
|
|
17
|
+
*
|
|
18
|
+
* Static theme values reference the DS token CSS variables directly
|
|
19
|
+
* (var(--color-*)) — the same tokens every other Seeds component CSS uses,
|
|
20
|
+
* emitted by seeds-react-theme and provided at runtime by the theme provider —
|
|
21
|
+
* so light/dark follows automatically. Ported from the v1 bar hover-dimming
|
|
22
|
+
* block; v1 chartStyles.ts stays in place for the v1 wrappers.
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
/* =========================================================================
|
|
26
|
+
* bar family -> .seeds-chart-bar
|
|
27
|
+
*
|
|
28
|
+
* hover-dimming: when the chart container is hovered, dim all bars, then
|
|
29
|
+
* restore opacity for the hovered bar(s) — flagged with the bar-point-hover
|
|
30
|
+
* class by the adapter — so the non-hovered bars fade out.
|
|
31
|
+
* ========================================================================= */
|
|
32
|
+
|
|
33
|
+
.seeds-chart-bar .highcharts-container:hover .highcharts-point {
|
|
34
|
+
fill-opacity: 0.3;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.seeds-chart-bar .highcharts-point.bar-point-hover {
|
|
38
|
+
fill-opacity: 1 !important;
|
|
39
|
+
}
|
|
@@ -0,0 +1,295 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Seeds v2 chart styles — shared foundation.
|
|
3
|
+
*
|
|
4
|
+
* This is the genuinely-shared layer of the v2 chart styling migration: the
|
|
5
|
+
* .seeds-chart base rules, the per-series color fallback mechanism, the
|
|
6
|
+
* clickable-cursor rules, and the global (unscoped) tooltip overrides. It is a
|
|
7
|
+
* static port of the shared pieces of src/styles/chartStyles.ts
|
|
8
|
+
* (baseChartStyles + GlobalChartStyleOverrides), following the sparkline.css
|
|
9
|
+
* pattern. Consumers import this once:
|
|
10
|
+
*
|
|
11
|
+
* import "@sproutsocial/seeds-react-data-viz/chart-styles.css";
|
|
12
|
+
*
|
|
13
|
+
* Two kinds of layer live here. (1) The .seeds-chart base above. (2) The shared
|
|
14
|
+
* cross-family .seeds-chart-time-series layer below — used by every v2
|
|
15
|
+
* time-series family (bar, line-area), so it lives here once rather than being
|
|
16
|
+
* duplicated in each family .css. Truly per-family classes do NOT live here:
|
|
17
|
+
* each chart family (CE-170 bar, CE-165 line-area, CE-166 donut) owns and ships
|
|
18
|
+
* its own .css file with its .seeds-chart-<family> rules (e.g. .seeds-chart-bar
|
|
19
|
+
* hover-dimming) and passes its own class chain into getChartContainerProps — so
|
|
20
|
+
* those PRs never collide on this file.
|
|
21
|
+
*
|
|
22
|
+
* Theme values reference the DS's already-emitted global CSS variables directly
|
|
23
|
+
* (var(--color-*) / var(--font-*)) — the same surface other Seeds component CSS
|
|
24
|
+
* uses — so light/dark follows the theme stylesheet with zero inline JS. The
|
|
25
|
+
* dynamic per-chart pieces set inline by getChartContainerProps
|
|
26
|
+
* (src/charts/shared/chartContainer.ts) are the shared container mechanism the
|
|
27
|
+
* family files build on:
|
|
28
|
+
*
|
|
29
|
+
* Explicit per-series color override -> var(--highcharts-color-N) (set inline)
|
|
30
|
+
* $hasOnClick -> [data-has-on-click] attribute
|
|
31
|
+
* $patterns -> [data-dashed-series~="N"] attribute
|
|
32
|
+
*
|
|
33
|
+
* .seeds-chart sets --highcharts-color-N to the DS data-viz palette variable
|
|
34
|
+
* (var(--color-dataviz-list-N), emitted by @sproutsocial/seeds-react-theme's
|
|
35
|
+
* theme.css/theme-all.css — light/dark scoped, since the two modes pick
|
|
36
|
+
* different underlying swatches per index) as its default. An explicit
|
|
37
|
+
* per-series override is inlined by getChartContainerProps directly on the
|
|
38
|
+
* same element, which — same property, same element — wins over this class
|
|
39
|
+
* rule regardless of specificity, so the override still takes precedence.
|
|
40
|
+
* Defining the custom property itself (rather than only referencing the DS
|
|
41
|
+
* variable inside a var() fallback on fill/stroke) matters here: Highcharts
|
|
42
|
+
* ships its own default .highcharts-color-N colors (imported via
|
|
43
|
+
* highcharts/css/highcharts.css), and when var(--highcharts-color-N, ...)
|
|
44
|
+
* fails to resolve at all, the declaration is invalid at computed-value time
|
|
45
|
+
* and the cascade falls through to Highcharts' own default — silently
|
|
46
|
+
* dropping to Highcharts' palette instead of the DS one. The enumeration runs
|
|
47
|
+
* 0..19, matching the 20-entry DATAVIZ_COLORS_LIST / --color-dataviz-list-0..19.
|
|
48
|
+
* Series beyond 20 with an explicit color get no static selector — the same
|
|
49
|
+
* behaviour as the old JS fallback returning undefined.
|
|
50
|
+
*
|
|
51
|
+
* This file is additive: chartStyles.ts still serves v1 (and the not-yet-
|
|
52
|
+
* migrated v2 wrappers). The duplication is deliberate and temporary.
|
|
53
|
+
*/
|
|
54
|
+
|
|
55
|
+
/* =========================================================================
|
|
56
|
+
* baseChartStyles -> .seeds-chart
|
|
57
|
+
* ========================================================================= */
|
|
58
|
+
|
|
59
|
+
.seeds-chart {
|
|
60
|
+
--highcharts-background-color: var(--color-container-bg-base);
|
|
61
|
+
|
|
62
|
+
--highcharts-color-0: var(--color-dataviz-list-0);
|
|
63
|
+
--highcharts-color-1: var(--color-dataviz-list-1);
|
|
64
|
+
--highcharts-color-2: var(--color-dataviz-list-2);
|
|
65
|
+
--highcharts-color-3: var(--color-dataviz-list-3);
|
|
66
|
+
--highcharts-color-4: var(--color-dataviz-list-4);
|
|
67
|
+
--highcharts-color-5: var(--color-dataviz-list-5);
|
|
68
|
+
--highcharts-color-6: var(--color-dataviz-list-6);
|
|
69
|
+
--highcharts-color-7: var(--color-dataviz-list-7);
|
|
70
|
+
--highcharts-color-8: var(--color-dataviz-list-8);
|
|
71
|
+
--highcharts-color-9: var(--color-dataviz-list-9);
|
|
72
|
+
--highcharts-color-10: var(--color-dataviz-list-10);
|
|
73
|
+
--highcharts-color-11: var(--color-dataviz-list-11);
|
|
74
|
+
--highcharts-color-12: var(--color-dataviz-list-12);
|
|
75
|
+
--highcharts-color-13: var(--color-dataviz-list-13);
|
|
76
|
+
--highcharts-color-14: var(--color-dataviz-list-14);
|
|
77
|
+
--highcharts-color-15: var(--color-dataviz-list-15);
|
|
78
|
+
--highcharts-color-16: var(--color-dataviz-list-16);
|
|
79
|
+
--highcharts-color-17: var(--color-dataviz-list-17);
|
|
80
|
+
--highcharts-color-18: var(--color-dataviz-list-18);
|
|
81
|
+
--highcharts-color-19: var(--color-dataviz-list-19);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
/* set overall chart background color */
|
|
85
|
+
.seeds-chart .highcharts-background {
|
|
86
|
+
fill: var(--color-container-bg-base);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.seeds-chart g.highcharts-annotation-label {
|
|
90
|
+
display: none;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.seeds-chart div.highcharts-annotation-label {
|
|
94
|
+
top: 0 !important;
|
|
95
|
+
transform: translateX(-50%); /* centers the label on the targeted axis point */
|
|
96
|
+
pointer-events: none; /* prevents tooltip hover from being interrupted by this element since it renders after on the dom */
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
/* map colors to custom assigned colors or fall back to the default data viz
|
|
100
|
+
rotation set on .seeds-chart above. Highcharts already accounts for 10
|
|
101
|
+
series; enumerate through 19 (DATAVIZ_COLORS_LIST / --color-dataviz-list-*
|
|
102
|
+
length). */
|
|
103
|
+
.seeds-chart .highcharts-color-0 {
|
|
104
|
+
color: var(--highcharts-color-0);
|
|
105
|
+
stroke: var(--highcharts-color-0);
|
|
106
|
+
fill: var(--highcharts-color-0);
|
|
107
|
+
}
|
|
108
|
+
.seeds-chart .highcharts-color-1 {
|
|
109
|
+
color: var(--highcharts-color-1);
|
|
110
|
+
stroke: var(--highcharts-color-1);
|
|
111
|
+
fill: var(--highcharts-color-1);
|
|
112
|
+
}
|
|
113
|
+
.seeds-chart .highcharts-color-2 {
|
|
114
|
+
color: var(--highcharts-color-2);
|
|
115
|
+
stroke: var(--highcharts-color-2);
|
|
116
|
+
fill: var(--highcharts-color-2);
|
|
117
|
+
}
|
|
118
|
+
.seeds-chart .highcharts-color-3 {
|
|
119
|
+
color: var(--highcharts-color-3);
|
|
120
|
+
stroke: var(--highcharts-color-3);
|
|
121
|
+
fill: var(--highcharts-color-3);
|
|
122
|
+
}
|
|
123
|
+
.seeds-chart .highcharts-color-4 {
|
|
124
|
+
color: var(--highcharts-color-4);
|
|
125
|
+
stroke: var(--highcharts-color-4);
|
|
126
|
+
fill: var(--highcharts-color-4);
|
|
127
|
+
}
|
|
128
|
+
.seeds-chart .highcharts-color-5 {
|
|
129
|
+
color: var(--highcharts-color-5);
|
|
130
|
+
stroke: var(--highcharts-color-5);
|
|
131
|
+
fill: var(--highcharts-color-5);
|
|
132
|
+
}
|
|
133
|
+
.seeds-chart .highcharts-color-6 {
|
|
134
|
+
color: var(--highcharts-color-6);
|
|
135
|
+
stroke: var(--highcharts-color-6);
|
|
136
|
+
fill: var(--highcharts-color-6);
|
|
137
|
+
}
|
|
138
|
+
.seeds-chart .highcharts-color-7 {
|
|
139
|
+
color: var(--highcharts-color-7);
|
|
140
|
+
stroke: var(--highcharts-color-7);
|
|
141
|
+
fill: var(--highcharts-color-7);
|
|
142
|
+
}
|
|
143
|
+
.seeds-chart .highcharts-color-8 {
|
|
144
|
+
color: var(--highcharts-color-8);
|
|
145
|
+
stroke: var(--highcharts-color-8);
|
|
146
|
+
fill: var(--highcharts-color-8);
|
|
147
|
+
}
|
|
148
|
+
.seeds-chart .highcharts-color-9 {
|
|
149
|
+
color: var(--highcharts-color-9);
|
|
150
|
+
stroke: var(--highcharts-color-9);
|
|
151
|
+
fill: var(--highcharts-color-9);
|
|
152
|
+
}
|
|
153
|
+
.seeds-chart .highcharts-color-10 {
|
|
154
|
+
color: var(--highcharts-color-10);
|
|
155
|
+
stroke: var(--highcharts-color-10);
|
|
156
|
+
fill: var(--highcharts-color-10);
|
|
157
|
+
}
|
|
158
|
+
.seeds-chart .highcharts-color-11 {
|
|
159
|
+
color: var(--highcharts-color-11);
|
|
160
|
+
stroke: var(--highcharts-color-11);
|
|
161
|
+
fill: var(--highcharts-color-11);
|
|
162
|
+
}
|
|
163
|
+
.seeds-chart .highcharts-color-12 {
|
|
164
|
+
color: var(--highcharts-color-12);
|
|
165
|
+
stroke: var(--highcharts-color-12);
|
|
166
|
+
fill: var(--highcharts-color-12);
|
|
167
|
+
}
|
|
168
|
+
.seeds-chart .highcharts-color-13 {
|
|
169
|
+
color: var(--highcharts-color-13);
|
|
170
|
+
stroke: var(--highcharts-color-13);
|
|
171
|
+
fill: var(--highcharts-color-13);
|
|
172
|
+
}
|
|
173
|
+
.seeds-chart .highcharts-color-14 {
|
|
174
|
+
color: var(--highcharts-color-14);
|
|
175
|
+
stroke: var(--highcharts-color-14);
|
|
176
|
+
fill: var(--highcharts-color-14);
|
|
177
|
+
}
|
|
178
|
+
.seeds-chart .highcharts-color-15 {
|
|
179
|
+
color: var(--highcharts-color-15);
|
|
180
|
+
stroke: var(--highcharts-color-15);
|
|
181
|
+
fill: var(--highcharts-color-15);
|
|
182
|
+
}
|
|
183
|
+
.seeds-chart .highcharts-color-16 {
|
|
184
|
+
color: var(--highcharts-color-16);
|
|
185
|
+
stroke: var(--highcharts-color-16);
|
|
186
|
+
fill: var(--highcharts-color-16);
|
|
187
|
+
}
|
|
188
|
+
.seeds-chart .highcharts-color-17 {
|
|
189
|
+
color: var(--highcharts-color-17);
|
|
190
|
+
stroke: var(--highcharts-color-17);
|
|
191
|
+
fill: var(--highcharts-color-17);
|
|
192
|
+
}
|
|
193
|
+
.seeds-chart .highcharts-color-18 {
|
|
194
|
+
color: var(--highcharts-color-18);
|
|
195
|
+
stroke: var(--highcharts-color-18);
|
|
196
|
+
fill: var(--highcharts-color-18);
|
|
197
|
+
}
|
|
198
|
+
.seeds-chart .highcharts-color-19 {
|
|
199
|
+
color: var(--highcharts-color-19);
|
|
200
|
+
stroke: var(--highcharts-color-19);
|
|
201
|
+
fill: var(--highcharts-color-19);
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
/* =========================================================================
|
|
205
|
+
* $hasOnClick -> [data-has-on-click]
|
|
206
|
+
* ========================================================================= */
|
|
207
|
+
|
|
208
|
+
/* apply cursor pointer when click functionality is turned on */
|
|
209
|
+
.seeds-chart[data-has-on-click] .highcharts-series,
|
|
210
|
+
.seeds-chart[data-has-on-click] .highcharts-point {
|
|
211
|
+
cursor: pointer;
|
|
212
|
+
}
|
|
213
|
+
.seeds-chart[data-has-on-click] .highcharts-plot-background,
|
|
214
|
+
.seeds-chart[data-has-on-click] .highcharts-crosshair,
|
|
215
|
+
.seeds-chart[data-has-on-click] .highcharts-grid-line {
|
|
216
|
+
fill: transparent;
|
|
217
|
+
cursor: pointer;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
/* =========================================================================
|
|
221
|
+
* GlobalChartStyleOverrides -> global (unscoped) rules
|
|
222
|
+
*
|
|
223
|
+
* These can't override Highcharts defaults when scoped, so they stay global.
|
|
224
|
+
* ========================================================================= */
|
|
225
|
+
|
|
226
|
+
.highcharts-tooltip-container {
|
|
227
|
+
z-index: 7 !important;
|
|
228
|
+
}
|
|
229
|
+
.highcharts-tooltip-box {
|
|
230
|
+
fill: transparent !important;
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
/* =========================================================================
|
|
234
|
+
* ChartRenderer legend wrapper spacing (shared across all v2 families)
|
|
235
|
+
* ========================================================================= */
|
|
236
|
+
|
|
237
|
+
/* legend wrapper top margin — replaces the former Box mt={350} / mt-350 utility */
|
|
238
|
+
.seeds-chart-legend {
|
|
239
|
+
margin-top: var(--space-350);
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
/* =========================================================================
|
|
243
|
+
* shared cross-family time-series layer -> .seeds-chart-time-series
|
|
244
|
+
*
|
|
245
|
+
* Used by every v2 time-series family (bar, line-area); lives here rather than
|
|
246
|
+
* in a family .css so families reuse rather than duplicate it. crosshair,
|
|
247
|
+
* grid/axis lines, ticks, the zero line, the hover opacity guard, and the v2
|
|
248
|
+
* SVG axis-label typography (v2 renders styledMode SVG text/tspan, not v1 HTML
|
|
249
|
+
* spans — so these are the axisLabelV2Styles rules, not v1's).
|
|
250
|
+
* ========================================================================= */
|
|
251
|
+
|
|
252
|
+
/* vertical crosshair */
|
|
253
|
+
.seeds-chart-time-series .highcharts-crosshair {
|
|
254
|
+
stroke: var(--color-container-border-decorative-neutral);
|
|
255
|
+
stroke-width: 1;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
/* axis and gridlines */
|
|
259
|
+
.seeds-chart-time-series .highcharts-grid-line,
|
|
260
|
+
.seeds-chart-time-series .highcharts-axis-line {
|
|
261
|
+
stroke: var(--color-container-border-base);
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
.seeds-chart-time-series .highcharts-tick {
|
|
265
|
+
stroke: none;
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
/* don't drop opacity when another series is hovered */
|
|
269
|
+
.seeds-chart-time-series .highcharts-series-inactive {
|
|
270
|
+
opacity: 1;
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
.seeds-chart-time-series path.highcharts-plot-line.y-axis-zero-line {
|
|
274
|
+
stroke: var(--color-container-border-decorative-neutral);
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
/* v2 SVG axis labels (styledMode, useHTML: false). fill is the SVG text color;
|
|
278
|
+
color has no effect. */
|
|
279
|
+
.seeds-chart-time-series .highcharts-xaxis-labels text,
|
|
280
|
+
.seeds-chart-time-series .highcharts-yaxis-labels text {
|
|
281
|
+
font-family: var(--font-family);
|
|
282
|
+
font-size: var(--font-size-100);
|
|
283
|
+
line-height: var(--line-height-100);
|
|
284
|
+
font-weight: var(--font-weight-normal);
|
|
285
|
+
fill: var(--color-text-subtext);
|
|
286
|
+
}
|
|
287
|
+
|
|
288
|
+
/* two-line stacked datetime label: the boundary token is an
|
|
289
|
+
hc-axis-label-secondary tspan on a second line, rendered semibold */
|
|
290
|
+
.seeds-chart-time-series
|
|
291
|
+
.highcharts-xaxis-labels
|
|
292
|
+
text
|
|
293
|
+
tspan.hc-axis-label-secondary {
|
|
294
|
+
font-weight: var(--font-weight-semibold);
|
|
295
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkDLO4WZLTjs = require('./chunk-DLO4WZLT.js');
|
|
4
4
|
|
|
5
5
|
// src/charts/shared/annotations.ts
|
|
6
6
|
function buildAnnotationConfig(annotations) {
|
|
@@ -56,7 +56,7 @@ function makeValueAxisLabelFormatter(format) {
|
|
|
56
56
|
return function() {
|
|
57
57
|
const numberValue = Number(this.value);
|
|
58
58
|
const abbreviate = format.abbreviate === false ? false : deriveAbbreviateFromTicks(this);
|
|
59
|
-
return
|
|
59
|
+
return _chunkDLO4WZLTjs.valueFormatter.call(void 0, { ...format, value: numberValue, abbreviate });
|
|
60
60
|
};
|
|
61
61
|
}
|
|
62
62
|
|
|
@@ -65,4 +65,4 @@ function makeValueAxisLabelFormatter(format) {
|
|
|
65
65
|
|
|
66
66
|
|
|
67
67
|
exports.buildAnnotationConfig = buildAnnotationConfig; exports.defaultValueAxisLabelFormatter = defaultValueAxisLabelFormatter; exports.makeValueAxisLabelFormatter = makeValueAxisLabelFormatter;
|
|
68
|
-
//# sourceMappingURL=chunk-
|
|
68
|
+
//# sourceMappingURL=chunk-4IOYAUAK.js.map
|