@sproutsocial/seeds-react-data-viz 0.1.0 → 0.2.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/index.js CHANGED
@@ -5,6 +5,9 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
5
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
6
  var __getProtoOf = Object.getPrototypeOf;
7
7
  var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __commonJS = (cb, mod) => function __require() {
9
+ return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
10
+ };
8
11
  var __export = (target, all) => {
9
12
  for (var name in all)
10
13
  __defProp(target, name, { get: all[name], enumerable: true });
@@ -27,15 +30,96 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
27
30
  ));
28
31
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
32
 
33
+ // ../../node_modules/object-assign/index.js
34
+ var require_object_assign = __commonJS({
35
+ "../../node_modules/object-assign/index.js"(exports, module2) {
36
+ "use strict";
37
+ var getOwnPropertySymbols = Object.getOwnPropertySymbols;
38
+ var hasOwnProperty = Object.prototype.hasOwnProperty;
39
+ var propIsEnumerable = Object.prototype.propertyIsEnumerable;
40
+ function toObject(val) {
41
+ if (val === null || val === void 0) {
42
+ throw new TypeError("Object.assign cannot be called with null or undefined");
43
+ }
44
+ return Object(val);
45
+ }
46
+ function shouldUseNative() {
47
+ try {
48
+ if (!Object.assign) {
49
+ return false;
50
+ }
51
+ var test1 = new String("abc");
52
+ test1[5] = "de";
53
+ if (Object.getOwnPropertyNames(test1)[0] === "5") {
54
+ return false;
55
+ }
56
+ var test2 = {};
57
+ for (var i = 0; i < 10; i++) {
58
+ test2["_" + String.fromCharCode(i)] = i;
59
+ }
60
+ var order2 = Object.getOwnPropertyNames(test2).map(function(n2) {
61
+ return test2[n2];
62
+ });
63
+ if (order2.join("") !== "0123456789") {
64
+ return false;
65
+ }
66
+ var test3 = {};
67
+ "abcdefghijklmnopqrst".split("").forEach(function(letter) {
68
+ test3[letter] = letter;
69
+ });
70
+ if (Object.keys(Object.assign({}, test3)).join("") !== "abcdefghijklmnopqrst") {
71
+ return false;
72
+ }
73
+ return true;
74
+ } catch (err) {
75
+ return false;
76
+ }
77
+ }
78
+ module2.exports = shouldUseNative() ? Object.assign : function(target, source) {
79
+ var from;
80
+ var to = toObject(target);
81
+ var symbols;
82
+ for (var s = 1; s < arguments.length; s++) {
83
+ from = Object(arguments[s]);
84
+ for (var key in from) {
85
+ if (hasOwnProperty.call(from, key)) {
86
+ to[key] = from[key];
87
+ }
88
+ }
89
+ if (getOwnPropertySymbols) {
90
+ symbols = getOwnPropertySymbols(from);
91
+ for (var i = 0; i < symbols.length; i++) {
92
+ if (propIsEnumerable.call(from, symbols[i])) {
93
+ to[symbols[i]] = from[symbols[i]];
94
+ }
95
+ }
96
+ }
97
+ }
98
+ return to;
99
+ };
100
+ }
101
+ });
102
+
30
103
  // src/index.ts
31
104
  var src_exports = {};
32
105
  __export(src_exports, {
106
+ AreaChart: () => AreaChart,
107
+ ChartLegend: () => ChartLegend,
108
+ ChartLegendLabel: () => ChartLegendLabel,
33
109
  ChartTable: () => ChartTable,
110
+ ChartTooltip: () => ChartTooltip,
111
+ ChartTooltipFooter: () => ChartTooltipFooter,
112
+ ChartTooltipHeader: () => ChartTooltipHeader,
113
+ ChartTooltipTable: () => ChartTooltipTable,
114
+ ChartTooltipTitle: () => ChartTooltipTitle,
34
115
  ColorBox: () => ColorBox,
35
116
  DONUT_CHART_HALO_SIZE: () => DONUT_CHART_HALO_SIZE,
36
117
  DONUT_CHART_HEIGHT: () => DONUT_CHART_HEIGHT,
37
118
  DONUT_CHART_WIDTH: () => DONUT_CHART_WIDTH,
38
119
  DatavizColorBox: () => DatavizColorBox,
120
+ DonutChart: () => DonutChart,
121
+ DonutChartLegendTable: () => DonutChartLegendTable,
122
+ LineChart: () => LineChart,
39
123
  NetworkColorBox: () => NetworkColorBox,
40
124
  TIME_SERIES_CHART_HEIGHT: () => TIME_SERIES_CHART_HEIGHT,
41
125
  areaChartOptions: () => areaChartOptions,
@@ -52,14 +136,16 @@ __export(src_exports, {
52
136
  });
53
137
  module.exports = __toCommonJS(src_exports);
54
138
 
55
- // src/components/ChartTable/ChartTable.tsx
56
- var import_react4 = require("react");
57
- var import_styled_components3 = __toESM(require("styled-components"));
139
+ // src/components/AreaChart/AreaChart.tsx
140
+ var import_react22 = require("react");
141
+ var import_highcharts2 = __toESM(require("highcharts"));
142
+ var import_highcharts_react_official = require("highcharts-react-official");
143
+ var import_accessibility = __toESM(require("highcharts/modules/accessibility"));
144
+ var import_styled_components15 = __toESM(require("styled-components"));
58
145
 
59
- // ../seeds-react-text/dist/esm/index.js
60
- var import_react2 = require("react");
146
+ // ../seeds-react-box/dist/esm/index.js
147
+ var React = __toESM(require("react"));
61
148
  var import_styled_components = __toESM(require("styled-components"));
62
- var import_styled_components2 = __toESM(require("styled-components"));
63
149
 
64
150
  // ../seeds-react-system-props/dist/index.mjs
65
151
  var import_react = require("react");
@@ -499,181 +585,9 @@ var De = y(l({ cursor: true, whiteSpace: true }));
499
585
  var Ve = y(L({ key: "typography", prop: "typeScale" }));
500
586
  var mo = y(De, Ve, V, I, A, D, G, E, H, $, N, M);
501
587
 
502
- // ../seeds-react-text/dist/esm/index.js
503
- var import_jsx_runtime = require("react/jsx-runtime");
504
- var import_react3 = require("react");
505
- var Container = import_styled_components2.default.span`
506
- margin: 0;
507
- padding-left: 0;
508
- padding-right: 0;
509
- font-family: ${(props) => props.theme.fontFamily};
510
- font-style: ${(props) => {
511
- return props.isItalicized && "italic";
512
- }};
513
-
514
- ${(props) => props.truncated && import_styled_components2.css`
515
- display: block;
516
- overflow: hidden;
517
- white-space: nowrap;
518
- text-overflow: ellipsis;
519
- `}
520
-
521
- ${(props) => props.breakWord && import_styled_components2.css`
522
- word-break: break-word;
523
- hyphens: auto;
524
- `}
525
-
526
- ${ke}
527
- ${Fe}
528
- ${Ee}
529
- ${Me}
530
- ${Ne}
531
- `;
532
- var styles_default = Container;
533
- var Headline = (0, import_styled_components.default)(styles_default)`
534
- color: ${(props) => props.theme.colors.text.headline};
535
- font-weight: ${(props) => props.theme.fontWeights.bold};
536
- ${(props) => props.theme.typography[400]}
537
- `;
538
- var SubHeadline = (0, import_styled_components.default)(styles_default)`
539
- color: ${(props) => props.theme.colors.text.headline};
540
- font-weight: ${(props) => props.theme.fontWeights.bold};
541
- ${(props) => props.theme.typography[300]}
542
- `;
543
- var SmallSubHeadline = (0, import_styled_components.default)(styles_default)`
544
- color: ${(props) => props.theme.colors.text.headline};
545
- font-weight: ${(props) => props.theme.fontWeights.bold};
546
- ${(props) => props.theme.typography[200]}
547
- `;
548
- var Byline = (0, import_styled_components.default)(styles_default)`
549
- color: ${(props) => props.theme.colors.text.subtext};
550
- ${(props) => props.theme.typography[200]}
551
- `;
552
- var SmallByline = (0, import_styled_components.default)(styles_default)`
553
- color: ${(props) => props.theme.colors.text.subtext};
554
- ${(props) => props.theme.typography[100]}
555
- `;
556
- var BodyCopy = (0, import_styled_components.default)(styles_default)`
557
- color: ${(props) => props.theme.colors.text.body};
558
- ${(props) => props.theme.typography[300]}
559
- `;
560
- var SmallBodyCopy = (0, import_styled_components.default)(styles_default)`
561
- color: ${(props) => props.theme.colors.text.body};
562
- ${(props) => props.theme.typography[200]}
563
- `;
564
- var Text = ({ fontSize, children, qa, color, ...rest }) => {
565
- const qaText = typeof children === "string" ? children : void 0;
566
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
567
- styles_default,
568
- {
569
- typeScale: fontSize,
570
- "data-qa-text": qaText,
571
- color,
572
- ...qa,
573
- ...rest,
574
- children
575
- }
576
- );
577
- };
578
- var withTextLogic = (Component) => {
579
- return ({ children, ...props }) => {
580
- const qaText = typeof children === "string" ? children : void 0;
581
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { "data-qa-text": qaText, ...props, children });
582
- };
583
- };
584
- var HeadlineWithLogic = withTextLogic(Headline);
585
- HeadlineWithLogic.displayName = "Text.Headline";
586
- Text.Headline = HeadlineWithLogic;
587
- var SubHeadlineWithLogic = withTextLogic(SubHeadline);
588
- SubHeadlineWithLogic.displayName = "Text.SubHeadline";
589
- Text.SubHeadline = SubHeadlineWithLogic;
590
- var SmallSubHeadlineWithLogic = withTextLogic(SmallSubHeadline);
591
- SmallSubHeadlineWithLogic.displayName = "Text.SmallSubHeadline";
592
- Text.SmallSubHeadline = SmallSubHeadlineWithLogic;
593
- var BylineWithLogic = withTextLogic(Byline);
594
- BylineWithLogic.displayName = "Text.Byline";
595
- Text.Byline = BylineWithLogic;
596
- var SmallBylineWithLogic = withTextLogic(SmallByline);
597
- SmallBylineWithLogic.displayName = "Text.SmallByline";
598
- Text.SmallByline = SmallBylineWithLogic;
599
- var BodyCopyWithLogic = withTextLogic(BodyCopy);
600
- BodyCopyWithLogic.displayName = "Text.BodyCopy";
601
- Text.BodyCopy = BodyCopyWithLogic;
602
- var SmallBodyCopyWithLogic = withTextLogic(SmallBodyCopy);
603
- SmallBodyCopyWithLogic.displayName = "Text.SmallBodyCopy";
604
- Text.SmallBodyCopy = SmallBodyCopyWithLogic;
605
- var Text_default = Text;
606
-
607
- // src/components/ChartTable/ChartTable.tsx
608
- var import_racine = require("@sproutsocial/racine");
609
- var import_jsx_runtime2 = require("react/jsx-runtime");
610
- var StyledRacineTable = (0, import_styled_components3.default)(import_racine.Table)`
611
- tbody tr:last-child {
612
- border-bottom: none;
613
- }
614
- tr:last-child td,
615
- tr:last-child th {
616
- padding-bottom: 0;
617
- }
618
- tr:first-child td,
619
- tr:first-child th {
620
- padding-top: 0;
621
- }
622
- tr th {
623
- padding-left: 0;
624
- }
625
- tr td:last-child {
626
- padding-right: 0;
627
- }
628
- `;
629
- var StyledRacineTableRow = (0, import_styled_components3.default)(import_racine.Table.TableRow)`
630
- ${({ $isAppendedRow, theme: theme2 }) => $isAppendedRow ? `border-top: 2px solid ${theme2.colors.container.border.base}` : ""}
631
- `;
632
- var ChartTable = (0, import_react4.memo)(function ChartTable2({
633
- rows
634
- }) {
635
- if (!rows || rows.length === 0) {
636
- return null;
637
- }
638
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(StyledRacineTable, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_racine.Table.TableBody, { children: rows.map(({ cells, isAppendedRow }, rowIndex) => {
639
- if (!cells || cells.length === 0) {
640
- return null;
641
- }
642
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
643
- StyledRacineTableRow,
644
- {
645
- $isAppendedRow: isAppendedRow,
646
- children: cells.map(
647
- ({ content, align = "left", colSpan = 1 }, cellIndex) => {
648
- const uniqueIdentifier = `chart-tooltip-table-cell-${cellIndex}`;
649
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
650
- import_racine.Table.Cell,
651
- {
652
- id: uniqueIdentifier,
653
- scope: cellIndex === 0 ? "row" : void 0,
654
- align,
655
- colSpan,
656
- py: 200,
657
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text_default.SmallBodyCopy, { as: "div", children: content })
658
- },
659
- uniqueIdentifier
660
- );
661
- }
662
- )
663
- },
664
- `chart-tooltip-table-row-${rowIndex}`
665
- );
666
- }) }) });
667
- });
668
-
669
- // src/components/ColorBox/ColorBox.tsx
670
- var import_styled_components6 = require("styled-components");
671
-
672
588
  // ../seeds-react-box/dist/esm/index.js
673
- var React = __toESM(require("react"));
674
- var import_styled_components4 = __toESM(require("styled-components"));
675
- var import_jsx_runtime3 = require("react/jsx-runtime");
676
- var Container2 = import_styled_components4.default.div`
589
+ var import_jsx_runtime = require("react/jsx-runtime");
590
+ var Container = import_styled_components.default.div`
677
591
  box-sizing: border-box;
678
592
  font-family: ${({ theme: theme2 }) => theme2.fontFamily};
679
593
 
@@ -684,25 +598,25 @@ var Container2 = import_styled_components4.default.div`
684
598
  ${Ee}
685
599
  ${Me}
686
600
  `;
687
- var styles_default2 = Container2;
601
+ var styles_default = Container;
688
602
  var Box = React.forwardRef(
689
- ({ color, ...props }, ref) => {
690
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
691
- styles_default2,
603
+ ({ color: color2, ...props }, ref) => {
604
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
605
+ styles_default,
692
606
  {
693
607
  ...props,
694
608
  ref,
695
- color
609
+ color: color2
696
610
  }
697
611
  );
698
612
  }
699
613
  );
700
614
  Box.displayName = "Box";
701
615
  var Box_default = Box;
616
+ var src_default = Box_default;
702
617
 
703
- // ../seeds-react-theme-provider/dist/index.mjs
704
- var import_react5 = require("react");
705
- var import_styled_components5 = require("styled-components");
618
+ // src/components/AreaChart/components/AreaChartLegend.tsx
619
+ var import_react8 = require("react");
706
620
 
707
621
  // ../../node_modules/@babel/runtime/helpers/esm/extends.js
708
622
  function _extends() {
@@ -922,8 +836,8 @@ var PolishedError = /* @__PURE__ */ function(_Error) {
922
836
  }
923
837
  return PolishedError2;
924
838
  }(/* @__PURE__ */ _wrapNativeSuper(Error));
925
- function colorToInt(color) {
926
- return Math.round(color * 255);
839
+ function colorToInt(color2) {
840
+ return Math.round(color2 * 255);
927
841
  }
928
842
  function convertToInt(red3, green3, blue3) {
929
843
  return colorToInt(red3) + "," + colorToInt(green3) + "," + colorToInt(blue3);
@@ -1116,11 +1030,11 @@ var namedColorMap = {
1116
1030
  yellow: "ff0",
1117
1031
  yellowgreen: "9acd32"
1118
1032
  };
1119
- function nameToHex(color) {
1120
- if (typeof color !== "string")
1121
- return color;
1122
- var normalizedColorName = color.toLowerCase();
1123
- return namedColorMap[normalizedColorName] ? "#" + namedColorMap[normalizedColorName] : color;
1033
+ function nameToHex(color2) {
1034
+ if (typeof color2 !== "string")
1035
+ return color2;
1036
+ var normalizedColorName = color2.toLowerCase();
1037
+ return namedColorMap[normalizedColorName] ? "#" + namedColorMap[normalizedColorName] : color2;
1124
1038
  }
1125
1039
  var hexRegex = /^#[a-fA-F0-9]{6}$/;
1126
1040
  var hexRgbaRegex = /^#[a-fA-F0-9]{8}$/;
@@ -1130,11 +1044,11 @@ var rgbRegex = /^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/i;
1130
1044
  var rgbaRegex = /^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/i;
1131
1045
  var hslRegex = /^hsl\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*\)$/i;
1132
1046
  var hslaRegex = /^hsla\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*(\d{1,3}[.]?[0-9]?)%\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/i;
1133
- function parseToRgb(color) {
1134
- if (typeof color !== "string") {
1047
+ function parseToRgb(color2) {
1048
+ if (typeof color2 !== "string") {
1135
1049
  throw new PolishedError(3);
1136
1050
  }
1137
- var normalizedColor = nameToHex(color);
1051
+ var normalizedColor = nameToHex(color2);
1138
1052
  if (normalizedColor.match(hexRegex)) {
1139
1053
  return {
1140
1054
  red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
@@ -1260,10 +1174,10 @@ function curry(f2) {
1260
1174
  function guard(lowerBoundary, upperBoundary, value) {
1261
1175
  return Math.max(lowerBoundary, Math.min(upperBoundary, value));
1262
1176
  }
1263
- function transparentize(amount, color) {
1264
- if (color === "transparent")
1265
- return color;
1266
- var parsedColor = parseToRgb(color);
1177
+ function transparentize(amount, color2) {
1178
+ if (color2 === "transparent")
1179
+ return color2;
1180
+ var parsedColor = parseToRgb(color2);
1267
1181
  var alpha = typeof parsedColor.alpha === "number" ? parsedColor.alpha : 1;
1268
1182
  var colorWithAlpha = _extends({}, parsedColor, {
1269
1183
  alpha: guard(0, 1, +(alpha * 100 - parseFloat(amount) * 100).toFixed(2) / 100)
@@ -3415,70 +3329,1936 @@ var darkTheme2 = _objectSpread4(_objectSpread4({}, theme_default2), {}, {
3415
3329
  })
3416
3330
  });
3417
3331
 
3418
- // ../seeds-react-theme-provider/dist/index.mjs
3419
- var import_jsx_runtime4 = require("react/jsx-runtime");
3332
+ // src/components/ChartLegend/ChartLegend.tsx
3333
+ var import_react6 = require("react");
3420
3334
 
3421
- // src/components/ColorBox/ColorBox.tsx
3422
- var import_jsx_runtime5 = require("react/jsx-runtime");
3423
- var ColorBox = ({
3424
- display = "inline-block",
3425
- height = "16px",
3426
- width = "16px",
3427
- minWidth = width,
3428
- borderRadius = "400",
3429
- ...props
3430
- }) => {
3431
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
3432
- Box_default,
3335
+ // src/components/ChartLegend/components/ChartLegendLabel.tsx
3336
+ var import_styled_components7 = __toESM(require("styled-components"));
3337
+ var import_react5 = require("react");
3338
+
3339
+ // ../seeds-react-text/dist/esm/index.js
3340
+ var import_react2 = require("react");
3341
+ var import_styled_components2 = __toESM(require("styled-components"));
3342
+ var import_styled_components3 = __toESM(require("styled-components"));
3343
+ var import_jsx_runtime2 = require("react/jsx-runtime");
3344
+ var import_react3 = require("react");
3345
+ var Container2 = import_styled_components3.default.span`
3346
+ margin: 0;
3347
+ padding-left: 0;
3348
+ padding-right: 0;
3349
+ font-family: ${(props) => props.theme.fontFamily};
3350
+ font-style: ${(props) => {
3351
+ return props.isItalicized && "italic";
3352
+ }};
3353
+
3354
+ ${(props) => props.truncated && import_styled_components3.css`
3355
+ display: block;
3356
+ overflow: hidden;
3357
+ white-space: nowrap;
3358
+ text-overflow: ellipsis;
3359
+ `}
3360
+
3361
+ ${(props) => props.breakWord && import_styled_components3.css`
3362
+ word-break: break-word;
3363
+ hyphens: auto;
3364
+ `}
3365
+
3366
+ ${ke}
3367
+ ${Fe}
3368
+ ${Ee}
3369
+ ${Me}
3370
+ ${Ne}
3371
+ `;
3372
+ var styles_default2 = Container2;
3373
+ var Headline = (0, import_styled_components2.default)(styles_default2)`
3374
+ color: ${(props) => props.theme.colors.text.headline};
3375
+ font-weight: ${(props) => props.theme.fontWeights.bold};
3376
+ ${(props) => props.theme.typography[400]}
3377
+ `;
3378
+ var SubHeadline = (0, import_styled_components2.default)(styles_default2)`
3379
+ color: ${(props) => props.theme.colors.text.headline};
3380
+ font-weight: ${(props) => props.theme.fontWeights.bold};
3381
+ ${(props) => props.theme.typography[300]}
3382
+ `;
3383
+ var SmallSubHeadline = (0, import_styled_components2.default)(styles_default2)`
3384
+ color: ${(props) => props.theme.colors.text.headline};
3385
+ font-weight: ${(props) => props.theme.fontWeights.bold};
3386
+ ${(props) => props.theme.typography[200]}
3387
+ `;
3388
+ var Byline = (0, import_styled_components2.default)(styles_default2)`
3389
+ color: ${(props) => props.theme.colors.text.subtext};
3390
+ ${(props) => props.theme.typography[200]}
3391
+ `;
3392
+ var SmallByline = (0, import_styled_components2.default)(styles_default2)`
3393
+ color: ${(props) => props.theme.colors.text.subtext};
3394
+ ${(props) => props.theme.typography[100]}
3395
+ `;
3396
+ var BodyCopy = (0, import_styled_components2.default)(styles_default2)`
3397
+ color: ${(props) => props.theme.colors.text.body};
3398
+ ${(props) => props.theme.typography[300]}
3399
+ `;
3400
+ var SmallBodyCopy = (0, import_styled_components2.default)(styles_default2)`
3401
+ color: ${(props) => props.theme.colors.text.body};
3402
+ ${(props) => props.theme.typography[200]}
3403
+ `;
3404
+ var Text = ({ fontSize: fontSize2, children, qa, color: color2, ...rest }) => {
3405
+ const qaText = typeof children === "string" ? children : void 0;
3406
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
3407
+ styles_default2,
3433
3408
  {
3434
- ...props,
3435
- display,
3436
- height,
3437
- width,
3438
- minWidth,
3439
- borderRadius,
3440
- css: import_styled_components6.css`
3441
- cursor: ${(props2) => props2?.onClick ? "pointer" : "default"};
3442
- `
3409
+ typeScale: fontSize2,
3410
+ "data-qa-text": qaText,
3411
+ color: color2,
3412
+ ...qa,
3413
+ ...rest,
3414
+ children
3415
+ }
3416
+ );
3417
+ };
3418
+ var withTextLogic = (Component) => {
3419
+ return ({ children, ...props }) => {
3420
+ const qaText = typeof children === "string" ? children : void 0;
3421
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Component, { "data-qa-text": qaText, ...props, children });
3422
+ };
3423
+ };
3424
+ var HeadlineWithLogic = withTextLogic(Headline);
3425
+ HeadlineWithLogic.displayName = "Text.Headline";
3426
+ Text.Headline = HeadlineWithLogic;
3427
+ var SubHeadlineWithLogic = withTextLogic(SubHeadline);
3428
+ SubHeadlineWithLogic.displayName = "Text.SubHeadline";
3429
+ Text.SubHeadline = SubHeadlineWithLogic;
3430
+ var SmallSubHeadlineWithLogic = withTextLogic(SmallSubHeadline);
3431
+ SmallSubHeadlineWithLogic.displayName = "Text.SmallSubHeadline";
3432
+ Text.SmallSubHeadline = SmallSubHeadlineWithLogic;
3433
+ var BylineWithLogic = withTextLogic(Byline);
3434
+ BylineWithLogic.displayName = "Text.Byline";
3435
+ Text.Byline = BylineWithLogic;
3436
+ var SmallBylineWithLogic = withTextLogic(SmallByline);
3437
+ SmallBylineWithLogic.displayName = "Text.SmallByline";
3438
+ Text.SmallByline = SmallBylineWithLogic;
3439
+ var BodyCopyWithLogic = withTextLogic(BodyCopy);
3440
+ BodyCopyWithLogic.displayName = "Text.BodyCopy";
3441
+ Text.BodyCopy = BodyCopyWithLogic;
3442
+ var SmallBodyCopyWithLogic = withTextLogic(SmallBodyCopy);
3443
+ SmallBodyCopyWithLogic.displayName = "Text.SmallBodyCopy";
3444
+ Text.SmallBodyCopy = SmallBodyCopyWithLogic;
3445
+ var Text_default = Text;
3446
+
3447
+ // src/components/ColorBox/ColorBox.tsx
3448
+ var import_styled_components5 = require("styled-components");
3449
+
3450
+ // ../seeds-react-theme-provider/dist/index.mjs
3451
+ var import_react4 = require("react");
3452
+ var import_styled_components4 = require("styled-components");
3453
+ var import_jsx_runtime3 = require("react/jsx-runtime");
3454
+
3455
+ // src/components/ColorBox/ColorBox.tsx
3456
+ var import_jsx_runtime4 = require("react/jsx-runtime");
3457
+ var ColorBox = ({
3458
+ display: display2 = "inline-block",
3459
+ height: height2 = "16px",
3460
+ width: width2 = "16px",
3461
+ minWidth: minWidth2 = width2,
3462
+ borderRadius: borderRadius2 = "400",
3463
+ ...props
3464
+ }) => {
3465
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
3466
+ Box_default,
3467
+ {
3468
+ ...props,
3469
+ display: display2,
3470
+ height: height2,
3471
+ width: width2,
3472
+ minWidth: minWidth2,
3473
+ borderRadius: borderRadius2,
3474
+ css: import_styled_components5.css`
3475
+ cursor: ${(props2) => props2?.onClick ? "pointer" : "default"};
3476
+ `
3443
3477
  }
3444
3478
  );
3445
3479
  };
3446
3480
 
3447
3481
  // src/components/ColorBox/DatavizColorBox.tsx
3448
- var import_styled_components7 = __toESM(require("styled-components"));
3449
- var DatavizColorBox = (0, import_styled_components7.default)(ColorBox).attrs(
3482
+ var import_styled_components6 = __toESM(require("styled-components"));
3483
+ var DatavizColorBox = (0, import_styled_components6.default)(ColorBox).attrs(
3450
3484
  ({ colorIndex }) => ({
3451
3485
  style: {
3452
3486
  background: getDatavizColor(colorIndex),
3453
3487
  opacity: getDatavizOpacity(colorIndex)
3454
3488
  }
3455
- })
3456
- )``;
3457
- var getDatavizColor = (colorIndex) => theme_default.colors.DATAVIZ_COLORS_LIST[colorIndex % theme_default.colors.DATAVIZ_COLORS_LIST.length] || "";
3458
- var getDatavizOpacity = (colorIndex) => {
3459
- const opacitySteps = [1, 0.6, 0.4, 0.2];
3460
- const opacityStep = Math.floor(colorIndex / theme_default.colors.DATAVIZ_COLORS_LIST.length) % opacitySteps.length;
3461
- return opacitySteps[opacityStep];
3489
+ })
3490
+ )``;
3491
+ var getDatavizColor = (colorIndex) => theme_default.colors.DATAVIZ_COLORS_LIST[colorIndex % theme_default.colors.DATAVIZ_COLORS_LIST.length] || "";
3492
+ var getDatavizOpacity = (colorIndex) => {
3493
+ const opacitySteps = [1, 0.6, 0.4, 0.2];
3494
+ const opacityStep = Math.floor(colorIndex / theme_default.colors.DATAVIZ_COLORS_LIST.length) % opacitySteps.length;
3495
+ return opacitySteps[opacityStep];
3496
+ };
3497
+ var getDatavizColorWithAlpha = (colorIndex) => {
3498
+ const color2 = getDatavizColor(colorIndex);
3499
+ const opacity2 = getDatavizOpacity(colorIndex);
3500
+ if (opacity2 < 0 || opacity2 > 1) {
3501
+ return color2;
3502
+ }
3503
+ return `${color2}${Math.floor(opacity2 * 255).toString(16).padStart(2, "0")}`;
3504
+ };
3505
+
3506
+ // src/components/ColorBox/NetworkColorBox.tsx
3507
+ var import_seeds_networkcolor2 = __toESM(require("@sproutsocial/seeds-networkcolor"));
3508
+ var import_jsx_runtime5 = require("react/jsx-runtime");
3509
+ var NetworkColorBox = ({
3510
+ networkColor,
3511
+ ...props
3512
+ }) => {
3513
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ColorBox, { ...props, bg: import_seeds_networkcolor2.default[networkColor] });
3514
+ };
3515
+
3516
+ // src/components/ChartLegend/components/ChartLegendLabel.tsx
3517
+ var import_jsx_runtime6 = require("react/jsx-runtime");
3518
+ var StyledBox = (0, import_styled_components7.default)(Box_default)`
3519
+ list-style: none;
3520
+ display: flex;
3521
+ align-items: center;
3522
+ gap: ${({ theme: theme2 }) => theme2.space[300]};
3523
+ `;
3524
+ var ChartLegendLabel = (0, import_react5.memo)(
3525
+ function ChartLegendLabel2({
3526
+ children,
3527
+ color: color2 = "#CCC",
3528
+ containerBoxProps = {}
3529
+ }) {
3530
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(StyledBox, { ...containerBoxProps, children: [
3531
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ColorBox, { bg: color2 }),
3532
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Text_default, { as: "div", fontSize: 200, color: "text.subtext", children })
3533
+ ] });
3534
+ }
3535
+ );
3536
+
3537
+ // src/components/ChartLegend/ChartLegend.tsx
3538
+ var import_jsx_runtime7 = require("react/jsx-runtime");
3539
+ var ChartLegend = (0, import_react6.memo)(function ChartLegend2({
3540
+ legendLabels,
3541
+ containerBoxProps = {},
3542
+ stacked = false
3543
+ }) {
3544
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
3545
+ Box_default,
3546
+ {
3547
+ as: "ul",
3548
+ "aria-hidden": "true",
3549
+ display: "flex",
3550
+ justifyContent: "center",
3551
+ flexDirection: stacked ? "column" : "row",
3552
+ flexWrap: "wrap",
3553
+ columnGap: 450,
3554
+ rowGap: 200,
3555
+ m: 0,
3556
+ p: 0,
3557
+ ...containerBoxProps,
3558
+ children: legendLabels.map(({ color: color2, content }, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
3559
+ ChartLegendLabel,
3560
+ {
3561
+ color: color2 || theme_default.colors.DATAVIZ_COLORS_LIST[index],
3562
+ containerBoxProps: { as: "li" },
3563
+ children: content
3564
+ },
3565
+ `chart-legend-label-${index}`
3566
+ ))
3567
+ }
3568
+ );
3569
+ });
3570
+
3571
+ // src/components/ChartLegend/components/ChartLegendLabelContentWithIcon.tsx
3572
+ var import_react7 = require("react");
3573
+ var import_jsx_runtime8 = require("react/jsx-runtime");
3574
+ var ChartLegendLabelContentWithIcon = (0, import_react7.memo)(
3575
+ function ChartLegendLabelContentWithIcon2({
3576
+ children,
3577
+ icon
3578
+ }) {
3579
+ return icon ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(Box_default, { display: "flex", alignItems: "center", gap: 200, children: [
3580
+ icon,
3581
+ children
3582
+ ] }) : children;
3583
+ }
3584
+ );
3585
+
3586
+ // src/components/AreaChart/components/AreaChartLegend.tsx
3587
+ var import_jsx_runtime9 = require("react/jsx-runtime");
3588
+ var getAreaChartLegendLabels = ({
3589
+ data
3590
+ }) => {
3591
+ return data.map((series, index) => ({
3592
+ content: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
3593
+ color: series.styles?.color || theme_default.colors.DATAVIZ_COLORS_LIST[index]
3594
+ }));
3595
+ };
3596
+ var AreaChartLegend = (0, import_react8.memo)(
3597
+ function AreaChartLegend2({ data }) {
3598
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ChartLegend, { legendLabels: getAreaChartLegendLabels({ data }) });
3599
+ }
3600
+ );
3601
+
3602
+ // src/components/AreaChart/components/AreaChartTooltip.tsx
3603
+ var import_react19 = require("react");
3604
+
3605
+ // ../seeds-react-icon/dist/esm/index.js
3606
+ var import_react11 = require("react");
3607
+ var import_styled_components10 = __toESM(require("styled-components"));
3608
+
3609
+ // ../seeds-react-partner-logo/dist/esm/index.js
3610
+ var import_react9 = require("react");
3611
+ var import_styled_components8 = require("styled-components");
3612
+ var import_styled_components9 = __toESM(require("styled-components"));
3613
+
3614
+ // ../../node_modules/@styled-system/core/dist/index.esm.js
3615
+ var import_object_assign = __toESM(require_object_assign());
3616
+ var merge = function merge2(a3, b2) {
3617
+ var result = (0, import_object_assign.default)({}, a3, b2);
3618
+ for (var key in a3) {
3619
+ var _assign;
3620
+ if (!a3[key] || typeof b2[key] !== "object")
3621
+ continue;
3622
+ (0, import_object_assign.default)(result, (_assign = {}, _assign[key] = (0, import_object_assign.default)(a3[key], b2[key]), _assign));
3623
+ }
3624
+ return result;
3625
+ };
3626
+ var sort = function sort2(obj) {
3627
+ var next = {};
3628
+ Object.keys(obj).sort(function(a3, b2) {
3629
+ return a3.localeCompare(b2, void 0, {
3630
+ numeric: true,
3631
+ sensitivity: "base"
3632
+ });
3633
+ }).forEach(function(key) {
3634
+ next[key] = obj[key];
3635
+ });
3636
+ return next;
3637
+ };
3638
+ var defaults = {
3639
+ breakpoints: [40, 52, 64].map(function(n2) {
3640
+ return n2 + "em";
3641
+ })
3642
+ };
3643
+ var createMediaQuery = function createMediaQuery2(n2) {
3644
+ return "@media screen and (min-width: " + n2 + ")";
3645
+ };
3646
+ var getValue = function getValue2(n2, scale) {
3647
+ return get(scale, n2, n2);
3648
+ };
3649
+ var get = function get2(obj, key, def, p, undef) {
3650
+ key = key && key.split ? key.split(".") : [key];
3651
+ for (p = 0; p < key.length; p++) {
3652
+ obj = obj ? obj[key[p]] : undef;
3653
+ }
3654
+ return obj === undef ? def : obj;
3655
+ };
3656
+ var createParser = function createParser2(config9) {
3657
+ var cache = {};
3658
+ var parse = function parse2(props) {
3659
+ var styles = {};
3660
+ var shouldSort = false;
3661
+ var isCacheDisabled = props.theme && props.theme.disableStyledSystemCache;
3662
+ for (var key in props) {
3663
+ if (!config9[key])
3664
+ continue;
3665
+ var sx = config9[key];
3666
+ var raw = props[key];
3667
+ var scale = get(props.theme, sx.scale, sx.defaults);
3668
+ if (typeof raw === "object") {
3669
+ cache.breakpoints = !isCacheDisabled && cache.breakpoints || get(props.theme, "breakpoints", defaults.breakpoints);
3670
+ if (Array.isArray(raw)) {
3671
+ cache.media = !isCacheDisabled && cache.media || [null].concat(cache.breakpoints.map(createMediaQuery));
3672
+ styles = merge(styles, parseResponsiveStyle(cache.media, sx, scale, raw, props));
3673
+ continue;
3674
+ }
3675
+ if (raw !== null) {
3676
+ styles = merge(styles, parseResponsiveObject(cache.breakpoints, sx, scale, raw, props));
3677
+ shouldSort = true;
3678
+ }
3679
+ continue;
3680
+ }
3681
+ (0, import_object_assign.default)(styles, sx(raw, scale, props));
3682
+ }
3683
+ if (shouldSort) {
3684
+ styles = sort(styles);
3685
+ }
3686
+ return styles;
3687
+ };
3688
+ parse.config = config9;
3689
+ parse.propNames = Object.keys(config9);
3690
+ parse.cache = cache;
3691
+ var keys = Object.keys(config9).filter(function(k2) {
3692
+ return k2 !== "config";
3693
+ });
3694
+ if (keys.length > 1) {
3695
+ keys.forEach(function(key) {
3696
+ var _createParser;
3697
+ parse[key] = createParser2((_createParser = {}, _createParser[key] = config9[key], _createParser));
3698
+ });
3699
+ }
3700
+ return parse;
3701
+ };
3702
+ var parseResponsiveStyle = function parseResponsiveStyle2(mediaQueries, sx, scale, raw, _props) {
3703
+ var styles = {};
3704
+ raw.slice(0, mediaQueries.length).forEach(function(value, i) {
3705
+ var media = mediaQueries[i];
3706
+ var style = sx(value, scale, _props);
3707
+ if (!media) {
3708
+ (0, import_object_assign.default)(styles, style);
3709
+ } else {
3710
+ var _assign2;
3711
+ (0, import_object_assign.default)(styles, (_assign2 = {}, _assign2[media] = (0, import_object_assign.default)({}, styles[media], style), _assign2));
3712
+ }
3713
+ });
3714
+ return styles;
3715
+ };
3716
+ var parseResponsiveObject = function parseResponsiveObject2(breakpoints2, sx, scale, raw, _props) {
3717
+ var styles = {};
3718
+ for (var key in raw) {
3719
+ var breakpoint = breakpoints2[key];
3720
+ var value = raw[key];
3721
+ var style = sx(value, scale, _props);
3722
+ if (!breakpoint) {
3723
+ (0, import_object_assign.default)(styles, style);
3724
+ } else {
3725
+ var _assign3;
3726
+ var media = createMediaQuery(breakpoint);
3727
+ (0, import_object_assign.default)(styles, (_assign3 = {}, _assign3[media] = (0, import_object_assign.default)({}, styles[media], style), _assign3));
3728
+ }
3729
+ }
3730
+ return styles;
3731
+ };
3732
+ var createStyleFunction = function createStyleFunction2(_ref) {
3733
+ var properties = _ref.properties, property = _ref.property, scale = _ref.scale, _ref$transform = _ref.transform, transform = _ref$transform === void 0 ? getValue : _ref$transform, defaultScale = _ref.defaultScale;
3734
+ properties = properties || [property];
3735
+ var sx = function sx2(value, scale2, _props) {
3736
+ var result = {};
3737
+ var n2 = transform(value, scale2, _props);
3738
+ if (n2 === null)
3739
+ return;
3740
+ properties.forEach(function(prop) {
3741
+ result[prop] = n2;
3742
+ });
3743
+ return result;
3744
+ };
3745
+ sx.scale = scale;
3746
+ sx.defaults = defaultScale;
3747
+ return sx;
3748
+ };
3749
+ var system = function system2(args) {
3750
+ if (args === void 0) {
3751
+ args = {};
3752
+ }
3753
+ var config9 = {};
3754
+ Object.keys(args).forEach(function(key) {
3755
+ var conf = args[key];
3756
+ if (conf === true) {
3757
+ config9[key] = createStyleFunction({
3758
+ property: key,
3759
+ scale: key
3760
+ });
3761
+ return;
3762
+ }
3763
+ if (typeof conf === "function") {
3764
+ config9[key] = conf;
3765
+ return;
3766
+ }
3767
+ config9[key] = createStyleFunction(conf);
3768
+ });
3769
+ var parser = createParser(config9);
3770
+ return parser;
3771
+ };
3772
+ var compose = function compose2() {
3773
+ var config9 = {};
3774
+ for (var _len = arguments.length, parsers = new Array(_len), _key = 0; _key < _len; _key++) {
3775
+ parsers[_key] = arguments[_key];
3776
+ }
3777
+ parsers.forEach(function(parser2) {
3778
+ if (!parser2 || !parser2.config)
3779
+ return;
3780
+ (0, import_object_assign.default)(config9, parser2.config);
3781
+ });
3782
+ var parser = createParser(config9);
3783
+ return parser;
3784
+ };
3785
+
3786
+ // ../../node_modules/@styled-system/layout/dist/index.esm.js
3787
+ var isNumber = function isNumber2(n2) {
3788
+ return typeof n2 === "number" && !isNaN(n2);
3789
+ };
3790
+ var getWidth = function getWidth2(n2, scale) {
3791
+ return get(scale, n2, !isNumber(n2) || n2 > 1 ? n2 : n2 * 100 + "%");
3792
+ };
3793
+ var config = {
3794
+ width: {
3795
+ property: "width",
3796
+ scale: "sizes",
3797
+ transform: getWidth
3798
+ },
3799
+ height: {
3800
+ property: "height",
3801
+ scale: "sizes"
3802
+ },
3803
+ minWidth: {
3804
+ property: "minWidth",
3805
+ scale: "sizes"
3806
+ },
3807
+ minHeight: {
3808
+ property: "minHeight",
3809
+ scale: "sizes"
3810
+ },
3811
+ maxWidth: {
3812
+ property: "maxWidth",
3813
+ scale: "sizes"
3814
+ },
3815
+ maxHeight: {
3816
+ property: "maxHeight",
3817
+ scale: "sizes"
3818
+ },
3819
+ size: {
3820
+ properties: ["width", "height"],
3821
+ scale: "sizes"
3822
+ },
3823
+ overflow: true,
3824
+ overflowX: true,
3825
+ overflowY: true,
3826
+ display: true,
3827
+ verticalAlign: true
3828
+ };
3829
+ var layout = system(config);
3830
+ var index_esm_default = layout;
3831
+
3832
+ // ../../node_modules/@styled-system/color/dist/index.esm.js
3833
+ var config2 = {
3834
+ color: {
3835
+ property: "color",
3836
+ scale: "colors"
3837
+ },
3838
+ backgroundColor: {
3839
+ property: "backgroundColor",
3840
+ scale: "colors"
3841
+ },
3842
+ opacity: true
3843
+ };
3844
+ config2.bg = config2.backgroundColor;
3845
+ var color = system(config2);
3846
+ var index_esm_default2 = color;
3847
+
3848
+ // ../../node_modules/@styled-system/typography/dist/index.esm.js
3849
+ var defaults2 = {
3850
+ fontSizes: [12, 14, 16, 20, 24, 32, 48, 64, 72]
3851
+ };
3852
+ var config3 = {
3853
+ fontFamily: {
3854
+ property: "fontFamily",
3855
+ scale: "fonts"
3856
+ },
3857
+ fontSize: {
3858
+ property: "fontSize",
3859
+ scale: "fontSizes",
3860
+ defaultScale: defaults2.fontSizes
3861
+ },
3862
+ fontWeight: {
3863
+ property: "fontWeight",
3864
+ scale: "fontWeights"
3865
+ },
3866
+ lineHeight: {
3867
+ property: "lineHeight",
3868
+ scale: "lineHeights"
3869
+ },
3870
+ letterSpacing: {
3871
+ property: "letterSpacing",
3872
+ scale: "letterSpacings"
3873
+ },
3874
+ textAlign: true,
3875
+ fontStyle: true
3876
+ };
3877
+ var typography2 = system(config3);
3878
+ var index_esm_default3 = typography2;
3879
+
3880
+ // ../../node_modules/@styled-system/flexbox/dist/index.esm.js
3881
+ var config4 = {
3882
+ alignItems: true,
3883
+ alignContent: true,
3884
+ justifyItems: true,
3885
+ justifyContent: true,
3886
+ flexWrap: true,
3887
+ flexDirection: true,
3888
+ // item
3889
+ flex: true,
3890
+ flexGrow: true,
3891
+ flexShrink: true,
3892
+ flexBasis: true,
3893
+ justifySelf: true,
3894
+ alignSelf: true,
3895
+ order: true
3896
+ };
3897
+ var flexbox = system(config4);
3898
+ var index_esm_default4 = flexbox;
3899
+
3900
+ // ../../node_modules/@styled-system/grid/dist/index.esm.js
3901
+ var defaults3 = {
3902
+ space: [0, 4, 8, 16, 32, 64, 128, 256, 512]
3903
+ };
3904
+ var config5 = {
3905
+ gridGap: {
3906
+ property: "gridGap",
3907
+ scale: "space",
3908
+ defaultScale: defaults3.space
3909
+ },
3910
+ gridColumnGap: {
3911
+ property: "gridColumnGap",
3912
+ scale: "space",
3913
+ defaultScale: defaults3.space
3914
+ },
3915
+ gridRowGap: {
3916
+ property: "gridRowGap",
3917
+ scale: "space",
3918
+ defaultScale: defaults3.space
3919
+ },
3920
+ gridColumn: true,
3921
+ gridRow: true,
3922
+ gridAutoFlow: true,
3923
+ gridAutoColumns: true,
3924
+ gridAutoRows: true,
3925
+ gridTemplateColumns: true,
3926
+ gridTemplateRows: true,
3927
+ gridTemplateAreas: true,
3928
+ gridArea: true
3929
+ };
3930
+ var grid = system(config5);
3931
+ var index_esm_default5 = grid;
3932
+
3933
+ // ../../node_modules/@styled-system/border/dist/index.esm.js
3934
+ var config6 = {
3935
+ border: {
3936
+ property: "border",
3937
+ scale: "borders"
3938
+ },
3939
+ borderWidth: {
3940
+ property: "borderWidth",
3941
+ scale: "borderWidths"
3942
+ },
3943
+ borderStyle: {
3944
+ property: "borderStyle",
3945
+ scale: "borderStyles"
3946
+ },
3947
+ borderColor: {
3948
+ property: "borderColor",
3949
+ scale: "colors"
3950
+ },
3951
+ borderRadius: {
3952
+ property: "borderRadius",
3953
+ scale: "radii"
3954
+ },
3955
+ borderTop: {
3956
+ property: "borderTop",
3957
+ scale: "borders"
3958
+ },
3959
+ borderTopLeftRadius: {
3960
+ property: "borderTopLeftRadius",
3961
+ scale: "radii"
3962
+ },
3963
+ borderTopRightRadius: {
3964
+ property: "borderTopRightRadius",
3965
+ scale: "radii"
3966
+ },
3967
+ borderRight: {
3968
+ property: "borderRight",
3969
+ scale: "borders"
3970
+ },
3971
+ borderBottom: {
3972
+ property: "borderBottom",
3973
+ scale: "borders"
3974
+ },
3975
+ borderBottomLeftRadius: {
3976
+ property: "borderBottomLeftRadius",
3977
+ scale: "radii"
3978
+ },
3979
+ borderBottomRightRadius: {
3980
+ property: "borderBottomRightRadius",
3981
+ scale: "radii"
3982
+ },
3983
+ borderLeft: {
3984
+ property: "borderLeft",
3985
+ scale: "borders"
3986
+ },
3987
+ borderX: {
3988
+ properties: ["borderLeft", "borderRight"],
3989
+ scale: "borders"
3990
+ },
3991
+ borderY: {
3992
+ properties: ["borderTop", "borderBottom"],
3993
+ scale: "borders"
3994
+ }
3995
+ };
3996
+ config6.borderTopWidth = {
3997
+ property: "borderTopWidth",
3998
+ scale: "borderWidths"
3999
+ };
4000
+ config6.borderTopColor = {
4001
+ property: "borderTopColor",
4002
+ scale: "colors"
4003
+ };
4004
+ config6.borderTopStyle = {
4005
+ property: "borderTopStyle",
4006
+ scale: "borderStyles"
4007
+ };
4008
+ config6.borderTopLeftRadius = {
4009
+ property: "borderTopLeftRadius",
4010
+ scale: "radii"
4011
+ };
4012
+ config6.borderTopRightRadius = {
4013
+ property: "borderTopRightRadius",
4014
+ scale: "radii"
4015
+ };
4016
+ config6.borderBottomWidth = {
4017
+ property: "borderBottomWidth",
4018
+ scale: "borderWidths"
4019
+ };
4020
+ config6.borderBottomColor = {
4021
+ property: "borderBottomColor",
4022
+ scale: "colors"
4023
+ };
4024
+ config6.borderBottomStyle = {
4025
+ property: "borderBottomStyle",
4026
+ scale: "borderStyles"
4027
+ };
4028
+ config6.borderBottomLeftRadius = {
4029
+ property: "borderBottomLeftRadius",
4030
+ scale: "radii"
4031
+ };
4032
+ config6.borderBottomRightRadius = {
4033
+ property: "borderBottomRightRadius",
4034
+ scale: "radii"
4035
+ };
4036
+ config6.borderLeftWidth = {
4037
+ property: "borderLeftWidth",
4038
+ scale: "borderWidths"
4039
+ };
4040
+ config6.borderLeftColor = {
4041
+ property: "borderLeftColor",
4042
+ scale: "colors"
4043
+ };
4044
+ config6.borderLeftStyle = {
4045
+ property: "borderLeftStyle",
4046
+ scale: "borderStyles"
4047
+ };
4048
+ config6.borderRightWidth = {
4049
+ property: "borderRightWidth",
4050
+ scale: "borderWidths"
4051
+ };
4052
+ config6.borderRightColor = {
4053
+ property: "borderRightColor",
4054
+ scale: "colors"
4055
+ };
4056
+ config6.borderRightStyle = {
4057
+ property: "borderRightStyle",
4058
+ scale: "borderStyles"
4059
+ };
4060
+ var border = system(config6);
4061
+ var index_esm_default6 = border;
4062
+
4063
+ // ../../node_modules/@styled-system/background/dist/index.esm.js
4064
+ var config7 = {
4065
+ background: true,
4066
+ backgroundImage: true,
4067
+ backgroundSize: true,
4068
+ backgroundPosition: true,
4069
+ backgroundRepeat: true
4070
+ };
4071
+ config7.bgImage = config7.backgroundImage;
4072
+ config7.bgSize = config7.backgroundSize;
4073
+ config7.bgPosition = config7.backgroundPosition;
4074
+ config7.bgRepeat = config7.backgroundRepeat;
4075
+ var background = system(config7);
4076
+ var index_esm_default7 = background;
4077
+
4078
+ // ../../node_modules/@styled-system/position/dist/index.esm.js
4079
+ var defaults4 = {
4080
+ space: [0, 4, 8, 16, 32, 64, 128, 256, 512]
4081
+ };
4082
+ var config8 = {
4083
+ position: true,
4084
+ zIndex: {
4085
+ property: "zIndex",
4086
+ scale: "zIndices"
4087
+ },
4088
+ top: {
4089
+ property: "top",
4090
+ scale: "space",
4091
+ defaultScale: defaults4.space
4092
+ },
4093
+ right: {
4094
+ property: "right",
4095
+ scale: "space",
4096
+ defaultScale: defaults4.space
4097
+ },
4098
+ bottom: {
4099
+ property: "bottom",
4100
+ scale: "space",
4101
+ defaultScale: defaults4.space
4102
+ },
4103
+ left: {
4104
+ property: "left",
4105
+ scale: "space",
4106
+ defaultScale: defaults4.space
4107
+ }
4108
+ };
4109
+ var position = system(config8);
4110
+ var index_esm_default8 = position;
4111
+
4112
+ // ../../node_modules/@styled-system/space/dist/index.esm.js
4113
+ var defaults5 = {
4114
+ space: [0, 4, 8, 16, 32, 64, 128, 256, 512]
4115
+ };
4116
+ var isNumber3 = function isNumber4(n2) {
4117
+ return typeof n2 === "number" && !isNaN(n2);
4118
+ };
4119
+ var getMargin = function getMargin2(n2, scale) {
4120
+ if (!isNumber3(n2)) {
4121
+ return get(scale, n2, n2);
4122
+ }
4123
+ var isNegative = n2 < 0;
4124
+ var absolute = Math.abs(n2);
4125
+ var value = get(scale, absolute, absolute);
4126
+ if (!isNumber3(value)) {
4127
+ return isNegative ? "-" + value : value;
4128
+ }
4129
+ return value * (isNegative ? -1 : 1);
4130
+ };
4131
+ var configs = {};
4132
+ configs.margin = {
4133
+ margin: {
4134
+ property: "margin",
4135
+ scale: "space",
4136
+ transform: getMargin,
4137
+ defaultScale: defaults5.space
4138
+ },
4139
+ marginTop: {
4140
+ property: "marginTop",
4141
+ scale: "space",
4142
+ transform: getMargin,
4143
+ defaultScale: defaults5.space
4144
+ },
4145
+ marginRight: {
4146
+ property: "marginRight",
4147
+ scale: "space",
4148
+ transform: getMargin,
4149
+ defaultScale: defaults5.space
4150
+ },
4151
+ marginBottom: {
4152
+ property: "marginBottom",
4153
+ scale: "space",
4154
+ transform: getMargin,
4155
+ defaultScale: defaults5.space
4156
+ },
4157
+ marginLeft: {
4158
+ property: "marginLeft",
4159
+ scale: "space",
4160
+ transform: getMargin,
4161
+ defaultScale: defaults5.space
4162
+ },
4163
+ marginX: {
4164
+ properties: ["marginLeft", "marginRight"],
4165
+ scale: "space",
4166
+ transform: getMargin,
4167
+ defaultScale: defaults5.space
4168
+ },
4169
+ marginY: {
4170
+ properties: ["marginTop", "marginBottom"],
4171
+ scale: "space",
4172
+ transform: getMargin,
4173
+ defaultScale: defaults5.space
4174
+ }
4175
+ };
4176
+ configs.margin.m = configs.margin.margin;
4177
+ configs.margin.mt = configs.margin.marginTop;
4178
+ configs.margin.mr = configs.margin.marginRight;
4179
+ configs.margin.mb = configs.margin.marginBottom;
4180
+ configs.margin.ml = configs.margin.marginLeft;
4181
+ configs.margin.mx = configs.margin.marginX;
4182
+ configs.margin.my = configs.margin.marginY;
4183
+ configs.padding = {
4184
+ padding: {
4185
+ property: "padding",
4186
+ scale: "space",
4187
+ defaultScale: defaults5.space
4188
+ },
4189
+ paddingTop: {
4190
+ property: "paddingTop",
4191
+ scale: "space",
4192
+ defaultScale: defaults5.space
4193
+ },
4194
+ paddingRight: {
4195
+ property: "paddingRight",
4196
+ scale: "space",
4197
+ defaultScale: defaults5.space
4198
+ },
4199
+ paddingBottom: {
4200
+ property: "paddingBottom",
4201
+ scale: "space",
4202
+ defaultScale: defaults5.space
4203
+ },
4204
+ paddingLeft: {
4205
+ property: "paddingLeft",
4206
+ scale: "space",
4207
+ defaultScale: defaults5.space
4208
+ },
4209
+ paddingX: {
4210
+ properties: ["paddingLeft", "paddingRight"],
4211
+ scale: "space",
4212
+ defaultScale: defaults5.space
4213
+ },
4214
+ paddingY: {
4215
+ properties: ["paddingTop", "paddingBottom"],
4216
+ scale: "space",
4217
+ defaultScale: defaults5.space
4218
+ }
4219
+ };
4220
+ configs.padding.p = configs.padding.padding;
4221
+ configs.padding.pt = configs.padding.paddingTop;
4222
+ configs.padding.pr = configs.padding.paddingRight;
4223
+ configs.padding.pb = configs.padding.paddingBottom;
4224
+ configs.padding.pl = configs.padding.paddingLeft;
4225
+ configs.padding.px = configs.padding.paddingX;
4226
+ configs.padding.py = configs.padding.paddingY;
4227
+ var margin = system(configs.margin);
4228
+ var padding = system(configs.padding);
4229
+ var space2 = compose(margin, padding);
4230
+
4231
+ // ../../node_modules/@styled-system/shadow/dist/index.esm.js
4232
+ var shadow = system({
4233
+ boxShadow: {
4234
+ property: "boxShadow",
4235
+ scale: "shadows"
4236
+ },
4237
+ textShadow: {
4238
+ property: "textShadow",
4239
+ scale: "shadows"
4240
+ }
4241
+ });
4242
+
4243
+ // ../../node_modules/@styled-system/css/dist/index.esm.js
4244
+ function _extends2() {
4245
+ _extends2 = Object.assign || function(target) {
4246
+ for (var i = 1; i < arguments.length; i++) {
4247
+ var source = arguments[i];
4248
+ for (var key in source) {
4249
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
4250
+ target[key] = source[key];
4251
+ }
4252
+ }
4253
+ }
4254
+ return target;
4255
+ };
4256
+ return _extends2.apply(this, arguments);
4257
+ }
4258
+ var get3 = function get4(obj, key, def, p, undef) {
4259
+ key = key && key.split ? key.split(".") : [key];
4260
+ for (p = 0; p < key.length; p++) {
4261
+ obj = obj ? obj[key[p]] : undef;
4262
+ }
4263
+ return obj === undef ? def : obj;
4264
+ };
4265
+ var defaultBreakpoints = [40, 52, 64].map(function(n2) {
4266
+ return n2 + "em";
4267
+ });
4268
+ var defaultTheme = {
4269
+ space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
4270
+ fontSizes: [12, 14, 16, 20, 24, 32, 48, 64, 72]
4271
+ };
4272
+ var aliases = {
4273
+ bg: "backgroundColor",
4274
+ m: "margin",
4275
+ mt: "marginTop",
4276
+ mr: "marginRight",
4277
+ mb: "marginBottom",
4278
+ ml: "marginLeft",
4279
+ mx: "marginX",
4280
+ my: "marginY",
4281
+ p: "padding",
4282
+ pt: "paddingTop",
4283
+ pr: "paddingRight",
4284
+ pb: "paddingBottom",
4285
+ pl: "paddingLeft",
4286
+ px: "paddingX",
4287
+ py: "paddingY"
4288
+ };
4289
+ var multiples = {
4290
+ marginX: ["marginLeft", "marginRight"],
4291
+ marginY: ["marginTop", "marginBottom"],
4292
+ paddingX: ["paddingLeft", "paddingRight"],
4293
+ paddingY: ["paddingTop", "paddingBottom"],
4294
+ size: ["width", "height"]
4295
+ };
4296
+ var scales = {
4297
+ color: "colors",
4298
+ backgroundColor: "colors",
4299
+ borderColor: "colors",
4300
+ margin: "space",
4301
+ marginTop: "space",
4302
+ marginRight: "space",
4303
+ marginBottom: "space",
4304
+ marginLeft: "space",
4305
+ marginX: "space",
4306
+ marginY: "space",
4307
+ padding: "space",
4308
+ paddingTop: "space",
4309
+ paddingRight: "space",
4310
+ paddingBottom: "space",
4311
+ paddingLeft: "space",
4312
+ paddingX: "space",
4313
+ paddingY: "space",
4314
+ top: "space",
4315
+ right: "space",
4316
+ bottom: "space",
4317
+ left: "space",
4318
+ gridGap: "space",
4319
+ gridColumnGap: "space",
4320
+ gridRowGap: "space",
4321
+ gap: "space",
4322
+ columnGap: "space",
4323
+ rowGap: "space",
4324
+ fontFamily: "fonts",
4325
+ fontSize: "fontSizes",
4326
+ fontWeight: "fontWeights",
4327
+ lineHeight: "lineHeights",
4328
+ letterSpacing: "letterSpacings",
4329
+ border: "borders",
4330
+ borderTop: "borders",
4331
+ borderRight: "borders",
4332
+ borderBottom: "borders",
4333
+ borderLeft: "borders",
4334
+ borderWidth: "borderWidths",
4335
+ borderStyle: "borderStyles",
4336
+ borderRadius: "radii",
4337
+ borderTopRightRadius: "radii",
4338
+ borderTopLeftRadius: "radii",
4339
+ borderBottomRightRadius: "radii",
4340
+ borderBottomLeftRadius: "radii",
4341
+ borderTopWidth: "borderWidths",
4342
+ borderTopColor: "colors",
4343
+ borderTopStyle: "borderStyles",
4344
+ borderBottomWidth: "borderWidths",
4345
+ borderBottomColor: "colors",
4346
+ borderBottomStyle: "borderStyles",
4347
+ borderLeftWidth: "borderWidths",
4348
+ borderLeftColor: "colors",
4349
+ borderLeftStyle: "borderStyles",
4350
+ borderRightWidth: "borderWidths",
4351
+ borderRightColor: "colors",
4352
+ borderRightStyle: "borderStyles",
4353
+ outlineColor: "colors",
4354
+ boxShadow: "shadows",
4355
+ textShadow: "shadows",
4356
+ zIndex: "zIndices",
4357
+ width: "sizes",
4358
+ minWidth: "sizes",
4359
+ maxWidth: "sizes",
4360
+ height: "sizes",
4361
+ minHeight: "sizes",
4362
+ maxHeight: "sizes",
4363
+ flexBasis: "sizes",
4364
+ size: "sizes",
4365
+ // svg
4366
+ fill: "colors",
4367
+ stroke: "colors"
4368
+ };
4369
+ var positiveOrNegative = function positiveOrNegative2(scale, value) {
4370
+ if (typeof value !== "number" || value >= 0) {
4371
+ return get3(scale, value, value);
4372
+ }
4373
+ var absolute = Math.abs(value);
4374
+ var n2 = get3(scale, absolute, absolute);
4375
+ if (typeof n2 === "string")
4376
+ return "-" + n2;
4377
+ return n2 * -1;
4378
+ };
4379
+ var transforms = ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "top", "bottom", "left", "right"].reduce(function(acc, curr) {
4380
+ var _extends22;
4381
+ return _extends2({}, acc, (_extends22 = {}, _extends22[curr] = positiveOrNegative, _extends22));
4382
+ }, {});
4383
+ var responsive = function responsive2(styles) {
4384
+ return function(theme2) {
4385
+ var next = {};
4386
+ var breakpoints2 = get3(theme2, "breakpoints", defaultBreakpoints);
4387
+ var mediaQueries = [null].concat(breakpoints2.map(function(n2) {
4388
+ return "@media screen and (min-width: " + n2 + ")";
4389
+ }));
4390
+ for (var key in styles) {
4391
+ var value = typeof styles[key] === "function" ? styles[key](theme2) : styles[key];
4392
+ if (value == null)
4393
+ continue;
4394
+ if (!Array.isArray(value)) {
4395
+ next[key] = value;
4396
+ continue;
4397
+ }
4398
+ for (var i = 0; i < value.slice(0, mediaQueries.length).length; i++) {
4399
+ var media = mediaQueries[i];
4400
+ if (!media) {
4401
+ next[key] = value[i];
4402
+ continue;
4403
+ }
4404
+ next[media] = next[media] || {};
4405
+ if (value[i] == null)
4406
+ continue;
4407
+ next[media][key] = value[i];
4408
+ }
4409
+ }
4410
+ return next;
4411
+ };
4412
+ };
4413
+ var css3 = function css4(args) {
4414
+ return function(props) {
4415
+ if (props === void 0) {
4416
+ props = {};
4417
+ }
4418
+ var theme2 = _extends2({}, defaultTheme, {}, props.theme || props);
4419
+ var result = {};
4420
+ var obj = typeof args === "function" ? args(theme2) : args;
4421
+ var styles = responsive(obj)(theme2);
4422
+ for (var key in styles) {
4423
+ var x = styles[key];
4424
+ var val = typeof x === "function" ? x(theme2) : x;
4425
+ if (key === "variant") {
4426
+ var variant3 = css4(get3(theme2, val))(theme2);
4427
+ result = _extends2({}, result, {}, variant3);
4428
+ continue;
4429
+ }
4430
+ if (val && typeof val === "object") {
4431
+ result[key] = css4(val)(theme2);
4432
+ continue;
4433
+ }
4434
+ var prop = get3(aliases, key, key);
4435
+ var scaleName = get3(scales, prop);
4436
+ var scale = get3(theme2, scaleName, get3(theme2, prop, {}));
4437
+ var transform = get3(transforms, prop, get3);
4438
+ var value = transform(scale, val, val);
4439
+ if (multiples[prop]) {
4440
+ var dirs = multiples[prop];
4441
+ for (var i = 0; i < dirs.length; i++) {
4442
+ result[dirs[i]] = value;
4443
+ }
4444
+ } else {
4445
+ result[prop] = value;
4446
+ }
4447
+ }
4448
+ return result;
4449
+ };
4450
+ };
4451
+ var index_esm_default9 = css3;
4452
+
4453
+ // ../../node_modules/@styled-system/variant/dist/index.esm.js
4454
+ var variant = function variant2(_ref) {
4455
+ var _config;
4456
+ var scale = _ref.scale, _ref$prop = _ref.prop, prop = _ref$prop === void 0 ? "variant" : _ref$prop, _ref$variants = _ref.variants, variants = _ref$variants === void 0 ? {} : _ref$variants, key = _ref.key;
4457
+ var sx;
4458
+ if (Object.keys(variants).length) {
4459
+ sx = function sx2(value, scale2, props) {
4460
+ return index_esm_default9(get(scale2, value, null))(props.theme);
4461
+ };
4462
+ } else {
4463
+ sx = function sx2(value, scale2) {
4464
+ return get(scale2, value, null);
4465
+ };
4466
+ }
4467
+ sx.scale = scale || key;
4468
+ sx.defaults = variants;
4469
+ var config9 = (_config = {}, _config[prop] = sx, _config);
4470
+ var parser = createParser(config9);
4471
+ return parser;
4472
+ };
4473
+ var buttonStyle = variant({
4474
+ key: "buttons"
4475
+ });
4476
+ var textStyle = variant({
4477
+ key: "textStyles",
4478
+ prop: "textStyle"
4479
+ });
4480
+ var colorStyle = variant({
4481
+ key: "colorStyles",
4482
+ prop: "colors"
4483
+ });
4484
+
4485
+ // ../../node_modules/styled-system/dist/index.esm.js
4486
+ var width = index_esm_default.width;
4487
+ var height = index_esm_default.height;
4488
+ var minWidth = index_esm_default.minWidth;
4489
+ var minHeight = index_esm_default.minHeight;
4490
+ var maxWidth = index_esm_default.maxWidth;
4491
+ var maxHeight = index_esm_default.maxHeight;
4492
+ var size = index_esm_default.size;
4493
+ var verticalAlign = index_esm_default.verticalAlign;
4494
+ var display = index_esm_default.display;
4495
+ var overflow = index_esm_default.overflow;
4496
+ var overflowX = index_esm_default.overflowX;
4497
+ var overflowY = index_esm_default.overflowY;
4498
+ var opacity = index_esm_default2.opacity;
4499
+ var fontSize = index_esm_default3.fontSize;
4500
+ var fontFamily2 = index_esm_default3.fontFamily;
4501
+ var fontWeight = index_esm_default3.fontWeight;
4502
+ var lineHeight = index_esm_default3.lineHeight;
4503
+ var textAlign = index_esm_default3.textAlign;
4504
+ var fontStyle = index_esm_default3.fontStyle;
4505
+ var letterSpacing = index_esm_default3.letterSpacing;
4506
+ var alignItems = index_esm_default4.alignItems;
4507
+ var alignContent = index_esm_default4.alignContent;
4508
+ var justifyItems = index_esm_default4.justifyItems;
4509
+ var justifyContent = index_esm_default4.justifyContent;
4510
+ var flexWrap = index_esm_default4.flexWrap;
4511
+ var flexDirection = index_esm_default4.flexDirection;
4512
+ var flex = index_esm_default4.flex;
4513
+ var flexGrow = index_esm_default4.flexGrow;
4514
+ var flexShrink = index_esm_default4.flexShrink;
4515
+ var flexBasis = index_esm_default4.flexBasis;
4516
+ var justifySelf = index_esm_default4.justifySelf;
4517
+ var alignSelf = index_esm_default4.alignSelf;
4518
+ var order = index_esm_default4.order;
4519
+ var gridGap = index_esm_default5.gridGap;
4520
+ var gridColumnGap = index_esm_default5.gridColumnGap;
4521
+ var gridRowGap = index_esm_default5.gridRowGap;
4522
+ var gridColumn = index_esm_default5.gridColumn;
4523
+ var gridRow = index_esm_default5.gridRow;
4524
+ var gridAutoFlow = index_esm_default5.gridAutoFlow;
4525
+ var gridAutoColumns = index_esm_default5.gridAutoColumns;
4526
+ var gridAutoRows = index_esm_default5.gridAutoRows;
4527
+ var gridTemplateColumns = index_esm_default5.gridTemplateColumns;
4528
+ var gridTemplateRows = index_esm_default5.gridTemplateRows;
4529
+ var gridTemplateAreas = index_esm_default5.gridTemplateAreas;
4530
+ var gridArea = index_esm_default5.gridArea;
4531
+ var borderWidth = index_esm_default6.borderWidth;
4532
+ var borderStyle = index_esm_default6.borderStyle;
4533
+ var borderColor = index_esm_default6.borderColor;
4534
+ var borderTop = index_esm_default6.borderTop;
4535
+ var borderRight = index_esm_default6.borderRight;
4536
+ var borderBottom = index_esm_default6.borderBottom;
4537
+ var borderLeft = index_esm_default6.borderLeft;
4538
+ var borderRadius = index_esm_default6.borderRadius;
4539
+ var backgroundImage = index_esm_default7.backgroundImage;
4540
+ var backgroundSize = index_esm_default7.backgroundSize;
4541
+ var backgroundPosition = index_esm_default7.backgroundPosition;
4542
+ var backgroundRepeat = index_esm_default7.backgroundRepeat;
4543
+ var zIndex = index_esm_default8.zIndex;
4544
+ var top = index_esm_default8.top;
4545
+ var right = index_esm_default8.right;
4546
+ var bottom = index_esm_default8.bottom;
4547
+ var left = index_esm_default8.left;
4548
+
4549
+ // ../seeds-react-partner-logo/dist/esm/index.js
4550
+ var import_react10 = require("react");
4551
+
4552
+ // ../../seeds-assets/seeds-partner-logos/dist/index.mjs
4553
+ var ViewBoxes = { "adobe-experience-manager-dark": "0 0 18 18", "adobe-experience-manager": "0 0 18 18", "android-dark": "0 0 18 18", "android": "0 0 18 18", "apple-app-store-dark": "0 0 18 18", "apple-app-store": "0 0 18 18", "apple-dark": "0 0 18 18", "apple": "0 0 18 18", "bigcommerce-dark": "0 0 18 18", "bigcommerce-lockup-dark": "0 0 291 66", "bigcommerce-lockup": "0 0 291 66", "bigcommerce": "0 0 18 18", "bitly-dark": "0 0 18 18", "bitly": "0 0 18 18", "bluesky-dark": "0 0 18 18", "bluesky": "0 0 18 18", "bynder-dark": "0 0 18 18", "bynder": "0 0 18 18", "canva-dark": "0 0 18 18", "canva": "0 0 18 18", "dropbox-dark": "0 0 18 18", "dropbox-lockup-dark": "0 0 291 57", "dropbox-lockup": "0 0 291 57", "dropbox-wordmark-dark": "0 0 308 71", "dropbox-wordmark": "0 0 308 71", "dropbox": "0 0 18 18", "facebook-audience-network-dark": "0 0 18 18", "facebook-audience-network": "0 0 18 18", "facebook-dark": "0 0 18 18", "facebook-groups-dark": "0 0 18 18", "facebook-groups": "0 0 18 18", "facebook-shops-dark": "0 0 18 18", "facebook-shops": "0 0 18 18", "facebook": "0 0 18 18", "feedly-dark": "0 0 18 18", "feedly": "0 0 18 18", "github-dark": "0 0 18 18", "github": "0 0 18 18", "glassdoor-dark": "0 0 18 18", "glassdoor": "0 0 18 18", "google-analytics-dark": "0 0 18 18", "google-analytics": "0 0 18 18", "google-business-messages-dark": "0 0 18 18", "google-business-messages": "0 0 18 18", "google-drive-dark": "0 0 18 18", "google-drive": "0 0 18 18", "google-my-business-dark": "0 0 18 18", "google-my-business": "0 0 18 18", "google-play-store-dark": "0 0 16 18", "google-play-store": "0 0 16 18", "hubspot-dark": "0 0 18 18", "hubspot": "0 0 18 18", "instagram-dark": "0 0 18 18", "instagram": "0 0 18 18", "linkedin-audience-network-dark": "0 0 18 18", "linkedin-audience-network": "0 0 18 18", "linkedin-dark": "0 0 18 18", "linkedin": "0 0 18 18", "marketo-dark": "0 0 18 18", "marketo": "0 0 18 18", "messenger-dark": "0 0 18 18", "messenger": "0 0 18 18", "meta-dark": "0 0 18 18", "meta-lockup-dark": "0 0 273 55", "meta-lockup": "0 0 273 55", "meta": "0 0 18 18", "microsoft-dynamics-dark": "0 0 18 18", "microsoft-dynamics": "0 0 18 18", "paypal-lockup-dark": "0 0 245 60", "paypal-lockup": "0 0 245 60", "pinterest-dark": "0 0 18 18", "pinterest": "0 0 18 18", "reddit-dark": "0 0 18 18", "reddit": "0 0 18 18", "salesforce-cloud-dark": "0 0 20 18", "salesforce-cloud": "0 0 20 18", "salesforce-dark": "0 0 20 18", "salesforce": "0 0 20 18", "shopify-dark": "0 0 18 18", "shopify": "0 0 18 18", "slack-dark": "0 0 18 18", "slack": "0 0 18 18", "sproutsocial-dark": "0 0 18 18", "sproutsocial-lockup-dark": "0 0 291 58", "sproutsocial-lockup": "0 0 291 58", "sproutsocial-wordmark-dark": "0 0 320 52", "sproutsocial-wordmark": "0 0 320 52", "sproutsocial": "0 0 18 18", "tableau-dark": "0 0 18 18", "tableau-lockup-dark": "0 0 291 56", "tableau-lockup": "0 0 291 56", "tableau": "0 0 18 18", "threads-dark": "0 0 18 18", "threads": "0 0 18 18", "tiktok-dark": "0 0 18 18", "tiktok-lockup-dark": "0 0 276 68", "tiktok-lockup": "0 0 275 67", "tiktok": "0 0 18 18", "tripadvisor-dark": "0 0 18 18", "tripadvisor": "0 0 18 18", "trustpilot-dark": "0 0 18 18", "trustpilot": "0 0 18 18", "tumblr-dark": "0 0 18 18", "tumblr": "0 0 18 18", "twitter-audience-network-dark": "0 0 18 18", "twitter-audience-network": "0 0 18 18", "twitter-dark": "0 0 18 18", "twitter": "0 0 18 18", "whatsapp-dark": "0 0 18 18", "whatsapp": "0 0 18 18", "woocommerce-dark": "0 0 18 18", "woocommerce": "0 0 18 18", "x-twitter-dark": "0 0 18 18", "x-twitter": "0 0 18 18", "yelp-dark": "0 0 18 18", "yelp": "0 0 18 18", "youtube-dark": "0 0 18 18", "youtube-lockup-dark": "0 0 265 59", "youtube-lockup": "0 0 265 59", "youtube": "0 0 18 18", "zendesk-dark": "0 0 18 18", "zendesk-lockup-dark": "0 0 160 115", "zendesk-lockup": "0 0 160 115", "zendesk-wordmark-dark": "0 0 350 68", "zendesk-wordmark": "0 0 350 68", "zendesk": "0 0 18 18" };
4554
+ var LogoNamesWithoutVariants = ["adobe-experience-manager", "android", "apple-app-store", "apple", "bigcommerce", "bitly", "bluesky", "bynder", "canva", "dropbox", "facebook-audience-network", "facebook", "facebook-groups", "facebook-shops", "feedly", "github", "glassdoor", "google-analytics", "google-business-messages", "google-drive", "google-my-business", "google-play-store", "hubspot", "instagram", "linkedin-audience-network", "linkedin", "marketo", "messenger", "meta", "microsoft-dynamics", "paypal", "pinterest", "reddit", "salesforce-cloud", "salesforce", "shopify", "slack", "sproutsocial", "tableau", "threads", "tiktok", "tripadvisor", "trustpilot", "tumblr", "twitter-audience-network", "twitter", "whatsapp", "woocommerce", "x-twitter", "yelp", "youtube", "zendesk"];
4555
+
4556
+ // ../seeds-react-partner-logo/dist/esm/index.js
4557
+ var import_jsx_runtime10 = require("react/jsx-runtime");
4558
+ var PartnerLogoSizes = {
4559
+ mini: "12px",
4560
+ small: "16px",
4561
+ medium: "24px",
4562
+ large: "32px",
4563
+ jumbo: "64px"
4564
+ };
4565
+ var stylesForSize = (height2, logoSize) => import_styled_components9.css`
4566
+ height: ${logoSize ? logoSize : height2};
4567
+ line-height: ${logoSize ? logoSize : height2};
4568
+
4569
+ .logo-svg {
4570
+ height: ${logoSize ? logoSize : height2};
4571
+ width: ${logoSize ? logoSize : ""};
4572
+ }
4573
+ `;
4574
+ var Container3 = (0, import_styled_components9.default)("span")`
4575
+ display: inline-block;
4576
+ color: inherit;
4577
+ vertical-align: middle;
4578
+ ${ke}
4579
+ ${Ee}
4580
+ ${verticalAlign}
4581
+ ${(props) => stylesForSize(props.height, PartnerLogoSizes[props.logoSize])}
4582
+ `;
4583
+ var styles_default3 = Container3;
4584
+ var whichLogo = ({
4585
+ backgroundType,
4586
+ logoType,
4587
+ partnerName
4588
+ }, mode) => {
4589
+ const logo = logoType && logoType !== "symbol" ? partnerName + "-" + logoType : partnerName;
4590
+ if (backgroundType && backgroundType === "dark") {
4591
+ return `${logo}-dark`;
4592
+ } else if (backgroundType && backgroundType === "light") {
4593
+ return logo;
4594
+ } else if (mode === "dark") {
4595
+ return `${logo}-dark`;
4596
+ } else {
4597
+ return logo;
4598
+ }
4599
+ };
4600
+ var PartnerLogo = ({
4601
+ partnerName,
4602
+ backgroundType,
4603
+ logoType = "symbol",
4604
+ height: height2,
4605
+ width: width2,
4606
+ size: size2,
4607
+ "aria-label": ariaLabel,
4608
+ svgProps,
4609
+ ...rest
4610
+ }) => {
4611
+ const { mode } = (0, import_styled_components8.useTheme)();
4612
+ const logo = whichLogo({ backgroundType, logoType, partnerName }, mode);
4613
+ const logoViewBox = ViewBoxes[logo];
4614
+ const viewBoxCoordinates = logoViewBox?.split(" ") || [];
4615
+ const defaultSize = logoType === "symbol" ? "small" : void 0;
4616
+ const defaultWidth = viewBoxCoordinates[2];
4617
+ const defaultHeight = viewBoxCoordinates[3];
4618
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
4619
+ styles_default3,
4620
+ {
4621
+ height: height2 ? height2 : defaultHeight + "px",
4622
+ width: width2 ? width2 : defaultWidth + "px",
4623
+ logoSize: size2 ?? defaultSize,
4624
+ className: "logo",
4625
+ role: "img",
4626
+ "aria-label": ariaLabel,
4627
+ "data-qa-logo": partnerName,
4628
+ ...rest,
4629
+ children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
4630
+ "svg",
4631
+ {
4632
+ className: "logo-svg",
4633
+ viewBox: logoViewBox,
4634
+ focusable: false,
4635
+ "data-qa-logo-svg": `${partnerName}-svg`,
4636
+ ...svgProps,
4637
+ children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
4638
+ "use",
4639
+ {
4640
+ xmlnsXlink: "http://www.w3.org/1999/xlink",
4641
+ xlinkHref: `#seeds-svgs_${logo}`
4642
+ }
4643
+ )
4644
+ }
4645
+ )
4646
+ }
4647
+ );
4648
+ };
4649
+ var PartnerLogo_default = PartnerLogo;
4650
+ var src_default2 = PartnerLogo_default;
4651
+
4652
+ // ../seeds-react-utilities/dist/index.mjs
4653
+ function includes(coll, el) {
4654
+ return coll.includes(el);
4655
+ }
4656
+
4657
+ // ../seeds-react-icon/dist/esm/index.js
4658
+ var import_styled_components11 = __toESM(require("styled-components"));
4659
+
4660
+ // ../../seeds-assets/seeds-icons/dist/index.mjs
4661
+ var GeneralViewBoxes = { "alarm-clock-outline": "0 0 18 18", "alarm-clock-solid": "0 0 18 18", "all-caps-outline": "0 0 18 18", "all-caps-solid": "0 0 18 18", "alt-text-outline": "0 0 18 18", "alt-text-solid": "0 0 18 18", "arrow-down-outline": "0 0 18 18", "arrow-down-solid": "0 0 18 18", "arrow-down-to-bracket-outline": "0 0 18 18", "arrow-down-to-bracket-solid": "0 0 18 18", "arrow-down-to-line-outline": "0 0 18 18", "arrow-down-to-line-solid": "0 0 18 18", "arrow-left-outline": "0 0 18 18", "arrow-left-solid": "0 0 18 18", "arrow-left-to-line-outline": "0 0 18 18", "arrow-left-to-line-solid": "0 0 18 18", "arrow-right-down-outline": "0 0 18 18", "arrow-right-down-solid": "0 0 18 18", "arrow-right-from-bracket-outline": "0 0 18 18", "arrow-right-from-bracket-solid": "0 0 18 18", "arrow-right-outline": "0 0 18 18", "arrow-right-solid": "0 0 18 18", "arrow-right-to-line-outline": "0 0 18 18", "arrow-right-to-line-solid": "0 0 18 18", "arrow-right-up-outline": "0 0 18 18", "arrow-right-up-solid": "0 0 18 18", "arrow-turn-left-outline": "0 0 18 18", "arrow-turn-left-solid": "0 0 18 18", "arrow-turn-right-outline": "0 0 18 18", "arrow-turn-right-solid": "0 0 18 18", "arrow-up-from-bracket-outline": "0 0 18 18", "arrow-up-from-bracket-solid": "0 0 18 18", "arrow-up-outline": "0 0 18 18", "arrow-up-solid": "0 0 18 18", "arrow-up-to-line-outline": "0 0 18 18", "arrow-up-to-line-solid": "0 0 18 18", "arrows-left-right-outline": "0 0 18 18", "arrows-left-right-solid": "0 0 18 18", "arrows-pointing-in-outline": "0 0 18 18", "arrows-pointing-in-solid": "0 0 18 18", "arrows-pointing-out-outline": "0 0 18 18", "arrows-pointing-out-solid": "0 0 18 18", "arrows-rotate-outline": "0 0 18 18", "arrows-rotate-solid": "0 0 18 18", "arrows-up-down-left-right-outline": "0 0 18 18", "arrows-up-down-left-right-solid": "0 0 18 18", "art-palette-outline": "0 0 18 18", "art-palette-solid": "0 0 18 18", "atom-outline": "0 0 18 18", "atom-solid": "0 0 18 18", "audio-outline": "0 0 18 18", "audio-solid": "0 0 18 18", "ban-outline": "0 0 18 18", "ban-solid": "0 0 18 18", "barcode-outline": "0 0 18 18", "barcode-solid": "0 0 18 18", "bars-density-large-outline": "0 0 18 18", "bars-density-large-solid": "0 0 18 18", "bars-density-medium-outline": "0 0 18 18", "bars-density-medium-solid": "0 0 18 18", "bars-density-small-outline": "0 0 18 18", "bars-density-small-solid": "0 0 18 18", "bars-density-two-panel-outline": "0 0 18 18", "bars-density-two-panel-solid": "0 0 18 18", "basketball-outline": "0 0 18 18", "basketball-solid": "0 0 18 18", "beaker-outline": "0 0 18 18", "beaker-solid": "0 0 18 18", "bell-outline": "0 0 18 18", "bell-slash-outline": "0 0 18 18", "bell-slash-solid": "0 0 18 18", "bell-solid": "0 0 18 18", "bold-outline": "0 0 18 18", "bold-solid": "0 0 18 18", "book-open-outline": "0 0 18 18", "book-open-solid": "0 0 18 18", "book-outline": "0 0 18 18", "book-solid": "0 0 18 18", "bookmark-filter-outline": "0 0 18 18", "bookmark-filter-solid": "0 0 18 18", "bookmark-outline": "0 0 18 18", "bookmark-reply-outline": "0 0 18 18", "bookmark-reply-solid": "0 0 18 18", "bookmark-solid": "0 0 18 18", "briefcase-outline": "0 0 18 18", "briefcase-solid": "0 0 18 18", "browser-nav-bar-outline": "0 0 18 18", "browser-nav-bar-solid": "0 0 18 18", "browser-outline": "0 0 18 18", "browser-restore-outline": "0 0 18 18", "browser-restore-solid": "0 0 18 18", "browser-solid": "0 0 18 18", "bullseye-arrow-outline": "0 0 18 18", "bullseye-arrow-solid": "0 0 18 18", "calculator-outline": "0 0 18 18", "calculator-solid": "0 0 18 18", "calendar-clock-outline": "0 0 18 18", "calendar-clock-solid": "0 0 18 18", "calendar-day-outline": "0 0 18 18", "calendar-day-solid": "0 0 18 18", "calendar-outline": "0 0 18 18", "calendar-range-outline": "0 0 18 18", "calendar-range-solid": "0 0 18 18", "calendar-solid": "0 0 18 18", "camera-outline": "0 0 18 18", "camera-solid": "0 0 18 18", "camera-story-outline": "0 0 18 18", "camera-story-solid": "0 0 18 18", "camera-x-outline": "0 0 18 18", "camera-x-solid": "0 0 18 18", "caret-down-outline": "0 0 18 18", "caret-down-solid": "0 0 18 18", "caret-up-down-outline": "0 0 18 18", "caret-up-down-solid": "0 0 18 18", "caret-up-down-sort-down-outline": "0 0 18 18", "caret-up-down-sort-down-solid": "0 0 18 18", "caret-up-down-sort-up-outline": "0 0 18 18", "caret-up-down-sort-up-solid": "0 0 18 18", "caret-up-outline": "0 0 18 18", "caret-up-solid": "0 0 18 18", "carousel-outline": "0 0 18 18", "carousel-solid": "0 0 18 18", "cart-outline": "0 0 18 18", "cart-plus-outline": "0 0 18 18", "cart-plus-solid": "0 0 18 18", "cart-solid": "0 0 18 18", "chart-area-outline": "0 0 18 18", "chart-area-solid": "0 0 18 18", "chart-arrow-down-outline": "0 0 18 18", "chart-arrow-down-solid": "0 0 18 18", "chart-arrow-neutral-outline": "0 0 18 18", "chart-arrow-neutral-solid": "0 0 18 18", "chart-arrow-up-outline": "0 0 18 18", "chart-arrow-up-solid": "0 0 18 18", "chart-bar-outline": "0 0 18 18", "chart-bar-simple-outline": "0 0 18 18", "chart-bar-simple-solid": "0 0 18 18", "chart-bar-solid": "0 0 18 18", "chart-bar-sparkle-outline": "0 0 18 18", "chart-bar-sparkle-solid": "0 0 18 18", "chart-donut-outline": "0 0 18 18", "chart-donut-solid": "0 0 18 18", "chart-line-average-outline": "0 0 18 18", "chart-line-average-solid": "0 0 18 18", "chart-line-outline": "0 0 18 18", "chart-line-solid": "0 0 18 18", "chart-pie-outline": "0 0 18 18", "chart-pie-solid": "0 0 18 18", "check-outline": "0 0 18 18", "check-solid": "0 0 18 18", "chevron-down-outline": "0 0 18 18", "chevron-down-solid": "0 0 18 18", "chevron-left-outline": "0 0 18 18", "chevron-left-solid": "0 0 18 18", "chevron-right-outline": "0 0 18 18", "chevron-right-solid": "0 0 18 18", "chevron-up-outline": "0 0 18 18", "chevron-up-solid": "0 0 18 18", "circle-check-double-outline": "0 0 21 18", "circle-check-double-solid": "0 0 21 18", "circle-check-outline": "0 0 18 18", "circle-check-solid": "0 0 18 18", "circle-dollar-arrow-up-outline": "0 0 22 18", "circle-dollar-arrow-up-solid": "0 0 22 18", "circle-dollar-outline": "0 0 18 18", "circle-dollar-solid": "0 0 18 18", "circle-exclamation-outline": "0 0 18 18", "circle-exclamation-solid": "0 0 18 18", "circle-fill-outline": "0 0 18 18", "circle-fill-solid": "0 0 18 18", "circle-half-outline": "0 0 18 18", "circle-half-solid": "0 0 18 18", "circle-i-outline": "0 0 18 18", "circle-i-solid": "0 0 18 18", "circle-minus-outline": "0 0 18 18", "circle-minus-solid": "0 0 18 18", "circle-no-fill-outline": "0 0 18 18", "circle-no-fill-solid": "0 0 18 18", "circle-overlap-outline": "0 0 18 18", "circle-overlap-solid": "0 0 18 18", "circle-person-outline": "0 0 18 18", "circle-person-solid": "0 0 18 18", "circle-question-outline": "0 0 18 18", "circle-question-solid": "0 0 18 18", "circle-user-outline": "0 0 18 18", "circle-user-solid": "0 0 18 18", "circle-vertical-lines-outline": "0 0 18 18", "circle-vertical-lines-solid": "0 0 18 18", "circle-x-outline": "0 0 18 18", "circle-x-solid": "0 0 18 18", "clipboard-outline": "0 0 18 18", "clipboard-solid": "0 0 18 18", "clock-outline": "0 0 18 18", "clock-rotate-left-outline": "0 0 18 18", "clock-rotate-left-solid": "0 0 18 18", "clock-solid": "0 0 18 18", "closed-caption-outline": "0 0 18 18", "closed-caption-solid": "0 0 18 18", "cloud-outline": "0 0 18 18", "cloud-solid": "0 0 18 18", "code-outline": "0 0 18 18", "code-solid": "0 0 18 18", "columns-outline": "0 0 18 18", "columns-solid": "0 0 18 18", "comment-plus-outline": "0 0 18 18", "comment-plus-solid": "0 0 18 18", "comment-slash-outline": "0 0 18 18", "comment-slash-solid": "0 0 18 18", "comment-star-outline": "0 0 18 18", "comment-star-slash-outline": "0 0 18 18", "comment-star-slash-solid": "0 0 18 18", "comment-star-solid": "0 0 18 18", "compass-outline": "0 0 18 18", "compass-solid": "0 0 18 18", "credit-card-outline": "0 0 18 18", "credit-card-solid": "0 0 18 18", "crop-outline": "0 0 18 18", "crop-solid": "0 0 18 18", "crown-outline": "0 0 18 18", "crown-solid": "0 0 18 18", "curly-brackets-plus-outline": "0 0 18 18", "curly-brackets-plus-solid": "0 0 18 18", "delete-left-outline": "0 0 18 18", "delete-left-solid": "0 0 18 18", "diamond-line-outline": "0 0 18 18", "diamond-line-solid": "0 0 18 18", "diamond-outline": "0 0 18 18", "diamond-solid": "0 0 18 18", "diamond-vs-outline": "0 0 18 18", "diamond-vs-solid": "0 0 18 18", "dollar-outline": "0 0 18 18", "dollar-solid": "0 0 18 18", "ellipsis-horizontal-outline": "0 0 18 18", "ellipsis-horizontal-solid": "0 0 18 18", "ellipsis-vertical-outline": "0 0 18 18", "ellipsis-vertical-solid": "0 0 18 18", "envelope-outline": "0 0 18 18", "envelope-solid": "0 0 18 18", "expression-frown-outline": "0 0 18 18", "expression-frown-solid": "0 0 18 18", "expression-neutral-outline": "0 0 18 18", "expression-neutral-solid": "0 0 18 18", "expression-smile-open-outline": "0 0 18 18", "expression-smile-open-solid": "0 0 18 18", "eye-dropper-outline": "0 0 18 18", "eye-dropper-solid": "0 0 18 18", "eye-outline": "0 0 18 18", "eye-slash-outline": "0 0 18 18", "eye-slash-solid": "0 0 18 18", "eye-solid": "0 0 18 18", "face-frown-open-outline": "0 0 18 18", "face-frown-open-solid": "0 0 18 18", "face-frown-outline": "0 0 18 18", "face-frown-solid": "0 0 18 18", "face-neutral-outline": "0 0 18 18", "face-neutral-solid": "0 0 18 18", "face-smile-open-outline": "0 0 18 18", "face-smile-open-solid": "0 0 18 18", "face-smile-outline": "0 0 18 18", "face-smile-solid": "0 0 18 18", "file-box-arrow-up-outline": "0 0 18 18", "file-box-arrow-up-solid": "0 0 18 18", "file-box-outline": "0 0 18 18", "file-box-solid": "0 0 18 18", "filter-outline": "0 0 18 18", "filter-solid": "0 0 18 18", "fire-outline": "0 0 18 18", "fire-solid": "0 0 18 18", "flag-outline": "0 0 18 18", "flag-solid": "0 0 18 18", "folder-open-outline": "0 0 18 18", "folder-open-solid": "0 0 18 18", "folder-outline": "0 0 18 18", "folder-solid": "0 0 18 18", "font-case-outline": "0 0 18 18", "font-case-solid": "0 0 18 18", "four-squares-outline": "0 0 18 18", "four-squares-solid": "0 0 18 18", "gauge-outline": "0 0 18 18", "gauge-solid": "0 0 18 18", "gear-outline": "0 0 18 18", "gear-solid": "0 0 18 18", "gem-outline": "0 0 18 18", "gem-solid": "0 0 18 18", "gif-outline": "0 0 18 18", "gif-solid": "0 0 18 18", "glasses-outline": "0 0 18 18", "glasses-solid": "0 0 18 18", "globe-outline": "0 0 18 18", "globe-solid": "0 0 18 18", "grip-lines-vertical-outline": "0 0 18 18", "grip-lines-vertical-solid": "0 0 18 18", "h1-outline": "0 0 18 18", "h1-solid": "0 0 18 18", "h2-outline": "0 0 18 18", "h2-solid": "0 0 18 18", "h3-outline": "0 0 18 18", "h3-solid": "0 0 18 18", "h4-outline": "0 0 18 18", "h4-solid": "0 0 18 18", "hand-pointer-clicking-outline": "0 0 18 18", "hand-pointer-clicking-solid": "0 0 18 18", "handshake-outline": "0 0 18 18", "handshake-solid": "0 0 18 18", "hashtag-outline": "0 0 18 18", "hashtag-solid": "0 0 18 18", "headset-outline": "0 0 18 18", "headset-solid": "0 0 18 18", "heart-outline": "0 0 18 18", "heart-pulse-outline": "0 0 18 18", "heart-pulse-solid": "0 0 18 18", "heart-solid": "0 0 18 18", "horizontal-lines-outline": "0 0 18 18", "horizontal-lines-solid": "0 0 18 18", "hourglass-outline": "0 0 18 18", "hourglass-solid": "0 0 18 18", "house-outline": "0 0 18 18", "house-solid": "0 0 18 18", "image-outline": "0 0 18 18", "image-solid": "0 0 18 18", "images-outline": "0 0 18 18", "images-solid": "0 0 18 18", "inbox-arrow-up-outline": "0 0 18 18", "inbox-arrow-up-solid": "0 0 18 18", "inbox-check-outline": "0 0 18 18", "inbox-check-solid": "0 0 18 18", "inbox-lightning-bolt-outline": "0 0 18 18", "inbox-lightning-bolt-solid": "0 0 18 18", "inbox-outline": "0 0 18 18", "inbox-solid": "0 0 18 18", "inboxes-outline": "0 0 18 18", "inboxes-solid": "0 0 18 18", "infinity-outline": "0 0 18 18", "infinity-solid": "0 0 18 18", "insert-after-outline": "0 0 18 18", "insert-after-solid": "0 0 18 18", "italics-outline": "0 0 18 18", "italics-solid": "0 0 18 18", "justify-center-outline": "0 0 18 18", "justify-center-solid": "0 0 18 18", "justify-left-outline": "0 0 18 18", "justify-left-solid": "0 0 18 18", "justify-right-outline": "0 0 18 18", "justify-right-solid": "0 0 18 18", "key-outline": "0 0 18 18", "key-solid": "0 0 18 18", "keyboard-outline": "0 0 18 18", "keyboard-solid": "0 0 18 18", "language-outline": "0 0 18 18", "language-solid": "0 0 18 18", "laptop-mobile-outline": "0 0 18 18", "laptop-mobile-solid": "0 0 18 18", "large-circle-small-circle-outline": "0 0 18 18", "large-circle-small-circle-solid": "0 0 18 18", "larger-circle-small-circle-outline": "0 0 24 24", "larger-circle-small-circle-solid": "0 0 24 24", "lightbulb-outline": "0 0 18 18", "lightbulb-solid": "0 0 18 18", "lightning-bolt-outline": "0 0 18 18", "lightning-bolt-solid": "0 0 18 18", "link-broken-outline": "0 0 18 18", "link-broken-solid": "0 0 18 18", "link-outline": "0 0 18 18", "link-slash-outline": "0 0 18 18", "link-slash-solid": "0 0 18 18", "link-solid": "0 0 18 18", "locate-outline": "0 0 24 24", "locate-solid": "0 0 24 24", "location-pin-outline": "0 0 18 18", "location-pin-solid": "0 0 18 18", "lock-outline": "0 0 18 18", "lock-solid": "0 0 18 18", "magic-wand-outline": "0 0 18 18", "magic-wand-solid": "0 0 18 18", "magnifying-glass-chart-outline": "0 0 18 18", "magnifying-glass-chart-solid": "0 0 18 18", "magnifying-glass-outline": "0 0 18 18", "magnifying-glass-solid": "0 0 18 18", "magnifying-glass-twitter-outline": "0 0 18 18", "magnifying-glass-twitter-solid": "0 0 18 18", "make-longer-outline": "0 0 18 18", "make-longer-solid": "0 0 18 18", "make-shorter-outline": "0 0 18 18", "make-shorter-solid": "0 0 18 18", "masks-theater-outline": "0 0 22 18", "masks-theater-soild": "0 0 22 18", "masks-theater-solid": "0 0 22 18", "megaphone-dollar-outline": "0 0 18 18", "megaphone-dollar-solid": "0 0 18 18", "megaphone-outline": "0 0 18 18", "megaphone-solid": "0 0 18 18", "metric-table-outline": "0 0 18 18", "metric-table-solid": "0 0 18 18", "microphone-outline": "0 0 18 18", "microphone-solid": "0 0 18 18", "minus-outline": "0 0 18 18", "minus-solid": "0 0 18 18", "mobile-outline": "0 0 18 18", "mobile-solid": "0 0 18 18", "mood-boards-outline": "0 0 18 18", "mood-boards-solid": "0 0 18 18", "moon-crescent-outline": "0 0 18 18", "moon-crescent-solid": "0 0 18 18", "newspaper-outline": "0 0 18 18", "newspaper-solid": "0 0 18 18", "note-outline": "0 0 18 18", "note-solid": "0 0 18 18", "office-building-outline": "0 0 18 18", "office-building-solid": "0 0 18 18", "ordered-list-outline": "0 0 18 18", "ordered-list-solid": "0 0 18 18", "paint-can-outline": "0 0 18 18", "paint-can-solid": "0 0 18 18", "paper-bars-outline": "0 0 18 18", "paper-bars-solid": "0 0 18 18", "paper-outline": "0 0 18 18", "paper-pencil-outline": "0 0 18 18", "paper-pencil-solid": "0 0 18 18", "paper-plane-arrows-rotate-outline": "0 0 18 18", "paper-plane-arrows-rotate-solid": "0 0 18 18", "paper-plane-outline": "0 0 18 18", "paper-plane-solid": "0 0 18 18", "paper-solid": "0 0 18 18", "paper-x-outline": "0 0 18 18", "paper-x-solid": "0 0 18 18", "paperclip-outline": "0 0 18 18", "paperclip-solid": "0 0 18 18", "papers-outline": "0 0 18 18", "papers-solid": "0 0 18 18", "pattern-circle-triangle-square-outline": "0 0 18 18", "pattern-circle-triangle-square-solid": "0 0 18 18", "pause-outline": "0 0 18 18", "pause-solid": "0 0 18 18", "pencil-outline": "0 0 18 18", "pencil-solid": "0 0 18 18", "pencil-sparkle-outline": "0 0 18 18", "pencil-sparkle-solid": "0 0 18 18", "person-hiking-outline": "0 0 18 18", "person-hiking-solid": "0 0 18 18", "phone-outline": "0 0 18 18", "phone-solid": "0 0 18 18", "play-outline": "0 0 18 18", "play-solid": "0 0 18 18", "plug-outline": "0 0 18 18", "plug-solid": "0 0 18 18", "plus-outline": "0 0 18 18", "plus-solid": "0 0 18 18", "pointer-outline": "0 0 18 18", "pointer-solid": "0 0 18 18", "profile-card-outline": "0 0 18 18", "profile-card-solid": "0 0 18 18", "pulse-outline": "0 0 18 18", "pulse-solid": "0 0 18 18", "puzzle-piece-outline": "0 0 18 18", "puzzle-piece-solid": "0 0 18 18", "qr-code-outline": "0 0 18 18", "qr-code-solid": "0 0 18 18", "question-mark-outline": "0 0 18 18", "question-mark-solid": "0 0 18 18", "quotes-outline": "0 0 18 18", "quotes-solid": "0 0 18 18", "radar-outline": "0 0 18 18", "radar-solid": "0 0 18 18", "rectangle-caption-outline": "0 0 18 18", "rectangle-caption-solid": "0 0 18 18", "reply-outline": "0 0 18 18", "reply-solid": "0 0 18 18", "repost-outline": "0 0 18 18", "repost-solid": "0 0 18 18", "robot-outline": "0 0 19 18", "robot-solid": "0 0 19 18", "route-outline": "0 0 18 18", "route-solid": "0 0 18 18", "rss-outline": "0 0 18 18", "rss-solid": "0 0 18 18", "screwdriver-hammer-outline": "0 0 18 18", "screwdriver-hammer-solid": "0 0 18 18", "seeds-outline": "0 0 18 18", "seeds-solid": "0 0 18 18", "shopping-bag-outline": "0 0 18 18", "shopping-bag-solid": "0 0 18 18", "sitemap-outline": "0 0 18 18", "sitemap-solid": "0 0 18 18", "slider-outline": "0 0 18 18", "slider-solid": "0 0 18 18", "social-post-outline": "0 0 18 18", "social-post-solid": "0 0 18 18", "sort-ascending-outline": "0 0 18 18", "sort-ascending-solid": "0 0 18 18", "sort-descending-outline": "0 0 18 18", "sort-descending-solid": "0 0 18 18", "sparkle-outline": "0 0 18 18", "sparkle-solid": "0 0 18 18", "square-check-outline": "0 0 18 18", "square-check-solid": "0 0 18 18", "square-outline": "0 0 18 18", "square-slash-outline": "0 0 18 18", "square-slash-solid": "0 0 18 18", "square-solid": "0 0 18 18", "squares-arrow-up-right-outline": "0 0 18 18", "squares-arrow-up-right-solid": "0 0 18 18", "stamp-check-outline": "0 0 20 18", "stamp-check-solid": "0 0 20 18", "stamp-outline": "0 0 18 18", "stamp-solid": "0 0 18 18", "star-full-outline": "0 0 18 18", "star-full-solid": "0 0 18 18", "star-half-outline": "0 0 18 18", "star-half-solid": "0 0 18 18", "star-of-life-outline": "0 0 18 18", "star-of-life-solid": "0 0 18 18", "star-outline": "0 0 18 18", "star-solid": "0 0 18 18", "story-outline": "0 0 18 18", "story-solid": "0 0 18 18", "strikethrough-outline": "0 0 18 18", "strikethrough-solid": "0 0 18 18", "sun-outline": "0 0 18 18", "sun-solid": "0 0 18 18", "symbol-at-outline": "0 0 18 18", "symbol-at-solid": "0 0 18 18", "symbol-mars-outline": "0 0 18 18", "symbol-mars-solid": "0 0 18 18", "symbol-venus-outline": "0 0 18 18", "symbol-venus-solid": "0 0 18 18", "tag-outline": "0 0 18 18", "tag-solid": "0 0 18 18", "tag-x-outline": "0 0 18 18", "tag-x-solid": "0 0 18 18", "tags-outline": "0 0 18 18", "tags-solid": "0 0 18 18", "text-serif-outline": "0 0 18 18", "text-serif-solid": "0 0 18 18", "thread-outline": "0 0 18 18", "thread-solid": "0 0 18 18", "thumbs-down-outline": "0 0 18 18", "thumbs-down-solid": "0 0 18 18", "thumbs-up-outline": "0 0 18 18", "thumbs-up-solid": "0 0 18 18", "thumbtack-check-outline": "0 0 18 18", "thumbtack-check-solid": "0 0 18 18", "thumbtack-outline": "0 0 18 18", "thumbtack-solid": "0 0 18 18", "ticket-outline": "0 0 18 18", "ticket-solid": "0 0 18 18", "trash-outline": "0 0 18 18", "trash-solid": "0 0 18 18", "triangle-exclamation-outline": "0 0 18 18", "triangle-exclamation-solid": "0 0 18 18", "triangle-outline": "0 0 18 18", "triangle-solid": "0 0 18 18", "trophy-outline": "0 0 18 18", "trophy-solid": "0 0 18 18", "underline-outline": "0 0 18 18", "underline-solid": "0 0 18 18", "unlock-outline": "0 0 18 18", "unlock-solid": "0 0 18 18", "unordered-list-outline": "0 0 18 18", "unordered-list-solid": "0 0 18 18", "user-arrow-up-outline": "0 0 21 18", "user-arrow-up-solid": "0 0 21 18", "user-check-outline": "0 0 21 18", "user-check-solid": "0 0 21 18", "user-minus-outline": "0 0 20 18", "user-minus-solid": "0 0 20 18", "user-outline": "0 0 18 18", "user-plus-outline": "0 0 20 18", "user-plus-solid": "0 0 20 18", "user-solid": "0 0 18 18", "user-x-outline": "0 0 20 18", "user-x-solid": "0 0 20 18", "users-outline": "0 0 18 18", "users-solid": "0 0 18 18", "video-camera-outline": "0 0 18 18", "video-camera-solid": "0 0 18 18", "video-camera-story-outline": "0 0 18 18", "video-camera-story-solid": "0 0 18 18", "weight-outline": "0 0 18 18", "weight-solid": "0 0 18 18", "wifi-outline": "0 0 18 18", "wifi-slash-outline": "0 0 18 18", "wifi-slash-solid": "0 0 18 18", "wifi-solid": "0 0 18 18", "window-arrow-up-left-outline": "0 0 18 18", "window-arrow-up-left-solid": "0 0 18 18", "window-dock-left-outline": "0 0 24 24", "window-dock-left-solid": "0 0 24 24", "window-dock-right-outline": "0 0 24 24", "window-dock-right-solid": "0 0 24 24", "window-docked-left-outline": "0 0 18 18", "window-docked-left-solid": "0 0 18 18", "window-docked-right-outline": "0 0 18 18", "window-docked-right-solid": "0 0 18 18", "window-full-outline": "0 0 18 18", "window-full-solid": "0 0 18 18", "window-minimize-outline": "0 0 18 18", "window-minimize-solid": "0 0 18 18", "window-modal-outline": "0 0 18 18", "window-modal-solid": "0 0 18 18", "x-outline": "0 0 18 18", "x-solid": "0 0 18 18" };
4662
+ var ExternalViewBoxes = { "fb-reactions-angry": "0 0 18 18", "fb-reactions-care": "0 0 18 18", "fb-reactions-haha": "0 0 18 18", "fb-reactions-like": "0 0 18 18", "fb-reactions-love": "0 0 18 18", "fb-reactions-pride": "0 0 18 18", "fb-reactions-sad": "0 0 18 18", "fb-reactions-wow": "0 0 18 18", "recommendation": "0 0 18 18", "reels-outline": "0 0 18 18", "reels-solid": "0 0 18 18", "tripadvisor-circle-outline": "0 0 18 18", "tripadvisor-circle-solid": "0 0 18 18", "trustpilot-star": "0 0 18 18", "verified": "0 0 18 18", "yelp-full-star": "0 0 18 18", "yelp-half-star": "0 0 18 18" };
4663
+ var ExternalIconNames = ["fb-reactions-angry", "fb-reactions-care", "fb-reactions-haha", "fb-reactions-like", "fb-reactions-love", "fb-reactions-pride", "fb-reactions-sad", "fb-reactions-wow", "recommendation", "reels-outline", "reels-solid", "tripadvisor-circle-outline", "tripadvisor-circle-solid", "trustpilot-star", "verified", "yelp-full-star", "yelp-half-star"];
4664
+ var SproutViewBoxes = { "advocacy-outline": "0 0 18 18", "advocacy-solid": "0 0 18 18", "asset-library-outline": "0 0 18 18", "asset-library-plus-outline": "0 0 18 18", "asset-library-plus-solid": "0 0 18 18", "asset-library-solid": "0 0 18 18", "bambu-outline": "0 0 18 18", "bambu-solid": "0 0 18 18", "comment-arrow-up-outline": "0 0 18 18", "comment-arrow-up-solid": "0 0 18 18", "comment-bookmark-outline": "0 0 18 18", "comment-bookmark-solid": "0 0 18 18", "comment-dash-outline": "0 0 18 18", "comment-dash-solid": "0 0 18 18", "comment-exclamation-outline": "0 0 18 18", "comment-exclamation-solid": "0 0 18 18", "comment-eye-outline": "0 0 18 18", "comment-eye-solid": "0 0 18 18", "comment-heart-outline": "0 0 18 18", "comment-heart-solid": "0 0 18 18", "comment-light-bulb-outline": "0 0 18 18", "comment-light-bulb-solid": "0 0 18 18", "comment-outline": "0 0 18 18", "comment-solid": "0 0 18 18", "comment-sparkle-outline": "0 0 18 18", "comment-sparkle-solid": "0 0 18 18", "comments-outline": "0 0 18 18", "comments-solid": "0 0 18 18", "hand-sparkle-outline": "0 0 18 18", "hand-sparkle-solid": "0 0 18 18", "leaf-minus-outline": "0 0 18 18", "leaf-minus-solid": "0 0 18 18", "leaf-plus-outline": "0 0 18 18", "leaf-plus-solid": "0 0 18 18", "leaf-stacked-dotted-outline": "0 0 18 18", "leaf-stacked-dotted-solid": "0 0 18 18", "listening-outline": "0 0 18 18", "listening-solid": "0 0 18 18", "pencil-to-square-outline": "0 0 18 18", "pencil-to-square-solid": "0 0 18 18", "queue-outline": "0 0 18 18", "queue-solid": "0 0 18 18", "sprout-leaf-ellipsis-outline": "0 0 18 18", "sprout-leaf-ellipsis-solid": "0 0 18 18", "sprout-leaf-lightning-bolt-outline": "0 0 18 18", "sprout-leaf-lightning-bolt-solid": "0 0 18 18", "sprout-leaf-outline": "0 0 18 18", "sprout-leaf-solid": "0 0 18 18", "sprout-leaf-sync-outline": "0 0 18 18", "sprout-leaf-sync-solid": "0 0 18 18", "square-round-arrow-up-right-outline": "0 0 16 16", "square-round-arrow-up-right-solid": "0 0 16 16", "team-sprout-outline": "0 0 18 18", "team-sprout-solid": "0 0 18 18", "user-sprout-outline": "0 0 18 18", "user-sprout-solid": "0 0 18 18" };
4665
+
4666
+ // ../seeds-react-icon/dist/esm/index.js
4667
+ var import_jsx_runtime11 = require("react/jsx-runtime");
4668
+ var import_react12 = require("react");
4669
+ var sizes = {
4670
+ mini: "12px",
4671
+ /** TODO: deprecate default in favor of small in future release */
4672
+ default: "16px",
4673
+ small: "16px",
4674
+ medium: "24px",
4675
+ large: "32px",
4676
+ jumbo: "64px"
4677
+ };
4678
+ var stylesForSize2 = (iconActualSize, fixedWidth) => import_styled_components11.css`
4679
+ line-height: ${iconActualSize};
4680
+
4681
+ &,
4682
+ .Icon-svg {
4683
+ height: ${iconActualSize};
4684
+ fill: currentColor;
4685
+ }
4686
+
4687
+ ${fixedWidth && `
4688
+ &,
4689
+ & .Icon-svg {
4690
+ width: ${iconActualSize}
4691
+ }
4692
+ `}
4693
+ `;
4694
+ var Container4 = import_styled_components11.default.span.attrs({
4695
+ className: "Icon"
4696
+ })`
4697
+ display: inline-block;
4698
+ color: inherit;
4699
+ vertical-align: middle;
4700
+
4701
+ ${(props) => stylesForSize2(sizes[props.iconSize], props.fixedWidth)}
4702
+
4703
+ ${ke}
4704
+ ${verticalAlign}
4705
+ `;
4706
+ var styles_default4 = Container4;
4707
+ var AllViewboxes = {
4708
+ ...ExternalViewBoxes,
4709
+ ...GeneralViewBoxes,
4710
+ ...SproutViewBoxes
4711
+ };
4712
+ var Icon = ({
4713
+ name,
4714
+ size: size2 = "small",
4715
+ fixedWidth = false,
4716
+ ariaLabel,
4717
+ color: color2,
4718
+ svgProps,
4719
+ ...rest
4720
+ }) => {
4721
+ if (includes(LogoNamesWithoutVariants, name)) {
4722
+ const logoSize = size2 === "default" ? "small" : size2;
4723
+ const logoProps = {
4724
+ partnerName: name,
4725
+ size: logoSize,
4726
+ logoType: "symbol",
4727
+ svgProps
4728
+ };
4729
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
4730
+ src_default2,
4731
+ {
4732
+ "aria-label": ariaLabel,
4733
+ ...rest,
4734
+ ...logoProps
4735
+ }
4736
+ );
4737
+ }
4738
+ const defaultVariant = size2 === "mini" ? "solid" : "outline";
4739
+ const iconName = (
4740
+ // if not external and has no variant
4741
+ !name?.endsWith("-outline") && !name?.endsWith("-solid") && !includes(ExternalIconNames, name) ? (
4742
+ // then add default variant
4743
+ `${name}-${defaultVariant}`
4744
+ ) : (
4745
+ // else use name as is
4746
+ name
4747
+ )
4748
+ );
4749
+ const iconViewBox = AllViewboxes[iconName];
4750
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
4751
+ styles_default4,
4752
+ {
4753
+ iconSize: size2,
4754
+ fixedWidth: !!fixedWidth,
4755
+ role: "img",
4756
+ "aria-label": ariaLabel,
4757
+ "data-qa-icon": iconName,
4758
+ color: color2,
4759
+ ...rest,
4760
+ children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
4761
+ "svg",
4762
+ {
4763
+ className: "Icon-svg",
4764
+ viewBox: iconViewBox,
4765
+ focusable: false,
4766
+ "data-qa-icon-svg": `${iconName}-svg`,
4767
+ ...svgProps,
4768
+ children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
4769
+ "use",
4770
+ {
4771
+ xmlnsXlink: "http://www.w3.org/1999/xlink",
4772
+ xlinkHref: `#seeds-svgs_${iconName}`
4773
+ }
4774
+ )
4775
+ }
4776
+ )
4777
+ },
4778
+ iconName
4779
+ );
4780
+ };
4781
+ var ToggleableIcon = (0, import_styled_components10.default)(Icon)`
4782
+ transition: all ${(p) => p.theme.duration.fast} linear;
4783
+
4784
+ ${(p) => p.active && import_styled_components10.css`
4785
+ opacity: 1;
4786
+ transform: scale(1);
4787
+ `}
4788
+
4789
+ ${(p) => !p.active && import_styled_components10.css`
4790
+ position: absolute;
4791
+ opacity: 0;
4792
+ transform: scale(0);
4793
+ `}
4794
+ `;
4795
+ var IconToggle = ({
4796
+ activeName,
4797
+ inactiveName,
4798
+ isActive,
4799
+ size: size2 = "small",
4800
+ fixedWidth = false,
4801
+ ariaLabel,
4802
+ ...rest
4803
+ }) => {
4804
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(src_default, { as: "span", position: "relative", display: "inline-flex", ...rest, children: [
4805
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
4806
+ ToggleableIcon,
4807
+ {
4808
+ active: isActive,
4809
+ name: activeName,
4810
+ size: size2,
4811
+ fixedWidth,
4812
+ "aria-label": ariaLabel,
4813
+ "aria-hidden": !isActive
4814
+ }
4815
+ ),
4816
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
4817
+ ToggleableIcon,
4818
+ {
4819
+ active: !isActive,
4820
+ name: inactiveName,
4821
+ size: size2,
4822
+ fixedWidth,
4823
+ "aria-label": ariaLabel,
4824
+ "aria-hidden": isActive
4825
+ }
4826
+ )
4827
+ ] });
4828
+ };
4829
+ IconToggle.displayName = "Icon.Toggle";
4830
+ Icon.Toggle = IconToggle;
4831
+ var Icon_default = Icon;
4832
+
4833
+ // src/components/AreaChart/components/AreaChartTooltip.tsx
4834
+ var import_racine2 = require("@sproutsocial/racine");
4835
+
4836
+ // src/components/ChartTooltip/ChartTooltip.tsx
4837
+ var import_react13 = require("react");
4838
+ var import_styled_components12 = __toESM(require("styled-components"));
4839
+ var import_jsx_runtime12 = require("react/jsx-runtime");
4840
+ var StyledBox2 = (0, import_styled_components12.default)(Box_default)`
4841
+ .Icon,
4842
+ .logo {
4843
+ stroke: none;
4844
+ }
4845
+ `;
4846
+ var ChartTooltip = (0, import_react13.memo)(function ChartTooltip2({
4847
+ children
4848
+ }) {
4849
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
4850
+ StyledBox2,
4851
+ {
4852
+ bg: "container.background.base",
4853
+ boxShadow: "medium",
4854
+ border: 500,
4855
+ borderColor: "container.border.base",
4856
+ borderRadius: 500,
4857
+ p: 400,
4858
+ minWidth: 285,
4859
+ children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Box_default, { display: "flex", flexDirection: "column", gap: 350, children })
4860
+ }
4861
+ );
4862
+ });
4863
+
4864
+ // src/components/ChartTooltip/components/ChartTooltipFooter.tsx
4865
+ var import_react14 = require("react");
4866
+ var import_jsx_runtime13 = require("react/jsx-runtime");
4867
+ var ChartTooltipFooter = (0, import_react14.memo)(
4868
+ function ChartTooltipFooter2({ children }) {
4869
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
4870
+ Box_default,
4871
+ {
4872
+ borderTop: 500,
4873
+ borderColor: "container.border.base",
4874
+ mx: -400,
4875
+ mb: -200,
4876
+ px: 400,
4877
+ pt: 350,
4878
+ children
4879
+ }
4880
+ );
4881
+ }
4882
+ );
4883
+
4884
+ // src/components/ChartTooltip/components/ChartTooltipHeader.tsx
4885
+ var import_react15 = require("react");
4886
+ var import_jsx_runtime14 = require("react/jsx-runtime");
4887
+ var ChartTooltipHeader = (0, import_react15.memo)(
4888
+ function ChartTooltipHeader2({ children }) {
4889
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
4890
+ Box_default,
4891
+ {
4892
+ borderBottom: 500,
4893
+ borderColor: "container.border.base",
4894
+ mx: -400,
4895
+ mt: -200,
4896
+ px: 400,
4897
+ pb: 350,
4898
+ children
4899
+ }
4900
+ );
4901
+ }
4902
+ );
4903
+
4904
+ // src/components/ChartTooltip/components/ChartTooltipTable.tsx
4905
+ var import_react17 = require("react");
4906
+
4907
+ // src/components/ChartTable/ChartTable.tsx
4908
+ var import_react16 = require("react");
4909
+ var import_styled_components13 = __toESM(require("styled-components"));
4910
+ var import_racine = require("@sproutsocial/racine");
4911
+ var import_jsx_runtime15 = require("react/jsx-runtime");
4912
+ var StyledRacineTable = (0, import_styled_components13.default)(import_racine.Table)`
4913
+ tbody tr:last-child {
4914
+ border-bottom: none;
4915
+ }
4916
+ tr:last-child td,
4917
+ tr:last-child th {
4918
+ padding-bottom: 0;
4919
+ }
4920
+ tr:first-child td,
4921
+ tr:first-child th {
4922
+ padding-top: 0;
4923
+ }
4924
+ tr th {
4925
+ padding-left: 0;
4926
+ }
4927
+ tr td:last-child {
4928
+ padding-right: 0;
4929
+ }
4930
+ `;
4931
+ var StyledRacineTableRow = (0, import_styled_components13.default)(import_racine.Table.TableRow)`
4932
+ ${({ $isAppendedRow, theme: theme2 }) => $isAppendedRow ? `border-top: 2px solid ${theme2.colors.container.border.base}` : ""}
4933
+ `;
4934
+ var ChartTable = (0, import_react16.memo)(function ChartTable2({
4935
+ rows
4936
+ }) {
4937
+ if (!rows || rows.length === 0) {
4938
+ return null;
4939
+ }
4940
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(StyledRacineTable, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_racine.Table.TableBody, { children: rows.map(({ cells, isAppendedRow }, rowIndex) => {
4941
+ if (!cells || cells.length === 0) {
4942
+ return null;
4943
+ }
4944
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
4945
+ StyledRacineTableRow,
4946
+ {
4947
+ $isAppendedRow: isAppendedRow,
4948
+ children: cells.map(
4949
+ ({ content, align = "left", colSpan = 1 }, cellIndex) => {
4950
+ const uniqueIdentifier = `chart-tooltip-table-cell-${cellIndex}`;
4951
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
4952
+ import_racine.Table.Cell,
4953
+ {
4954
+ id: uniqueIdentifier,
4955
+ scope: cellIndex === 0 ? "row" : void 0,
4956
+ align,
4957
+ colSpan,
4958
+ py: 200,
4959
+ children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Text_default.SmallBodyCopy, { as: "div", children: content })
4960
+ },
4961
+ uniqueIdentifier
4962
+ );
4963
+ }
4964
+ )
4965
+ },
4966
+ `chart-tooltip-table-row-${rowIndex}`
4967
+ );
4968
+ }) }) });
4969
+ });
4970
+
4971
+ // src/components/ChartTooltip/components/ChartTooltipTable.tsx
4972
+ var import_jsx_runtime16 = require("react/jsx-runtime");
4973
+ var ChartTooltipTable = (0, import_react17.memo)(
4974
+ function ChartTooltipTable2({ rows }) {
4975
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ChartTable, { rows });
4976
+ }
4977
+ );
4978
+
4979
+ // src/components/ChartTooltip/components/ChartTooltipTitle.tsx
4980
+ var import_react18 = require("react");
4981
+ var import_jsx_runtime17 = require("react/jsx-runtime");
4982
+ var ChartTooltipTitle = (0, import_react18.memo)(
4983
+ function ChartTooltipTitle2({ children }) {
4984
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Text_default.SmallSubHeadline, { as: "p", children });
4985
+ }
4986
+ );
4987
+
4988
+ // src/components/AreaChart/components/AreaChartTooltip.tsx
4989
+ var import_jsx_runtime18 = require("react/jsx-runtime");
4990
+ var AreaChartTooltip = (0, import_react19.memo)(
4991
+ function AreaChartTooltip2({
4992
+ data,
4993
+ invalidNumberLabel,
4994
+ numberLocale,
4995
+ textLocale,
4996
+ tooltipDateFormatter,
4997
+ tooltipTotalLabel,
4998
+ total,
4999
+ x,
5000
+ // optional
5001
+ currency = "USD",
5002
+ numberFormat = "decimal",
5003
+ onClick,
5004
+ tooltipClickLabel
5005
+ }) {
5006
+ const rows = data.map(({ color: color2, icon, name, value }) => {
5007
+ return {
5008
+ cells: [
5009
+ {
5010
+ content: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChartLegendLabel, { color: color2, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Text_default, { "aria-label": `${name}: `, children: name }) }) })
5011
+ },
5012
+ {
5013
+ content: value === null && invalidNumberLabel ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Text_default, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_racine2.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
5014
+ import_racine2.Numeral,
5015
+ {
5016
+ abbreviate: false,
5017
+ currency,
5018
+ format: numberFormat,
5019
+ locale: numberLocale,
5020
+ number: value
5021
+ }
5022
+ ),
5023
+ align: "right"
5024
+ }
5025
+ ]
5026
+ };
5027
+ });
5028
+ const appendedRows = data.length > 1 ? [
5029
+ {
5030
+ cells: [
5031
+ {
5032
+ content: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
5033
+ Text_default,
5034
+ {
5035
+ fontWeight: "semibold",
5036
+ "aria-label": `${tooltipTotalLabel}: `,
5037
+ children: tooltipTotalLabel
5038
+ }
5039
+ )
5040
+ },
5041
+ {
5042
+ content: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Text_default, { fontWeight: "bold", children: total === null && invalidNumberLabel ? invalidNumberLabel : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_racine2.Duration, { locale: textLocale, milliseconds: total }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
5043
+ import_racine2.Numeral,
5044
+ {
5045
+ abbreviate: false,
5046
+ currency,
5047
+ format: numberFormat,
5048
+ locale: numberLocale,
5049
+ number: total
5050
+ }
5051
+ ) }),
5052
+ align: "right"
5053
+ }
5054
+ ],
5055
+ isAppendedRow: true
5056
+ }
5057
+ ] : [];
5058
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(ChartTooltip, { children: [
5059
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
5060
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
5061
+ ChartTooltipTable,
5062
+ {
5063
+ rows: [...rows, ...appendedRows]
5064
+ }
5065
+ ),
5066
+ onClick && tooltipClickLabel ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Box_default, { display: "flex", alignItems: "center", gap: 300, children: [
5067
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Icon_default, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
5068
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Text_default, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
5069
+ ] }) : tooltipClickLabel }) : null
5070
+ ] });
5071
+ }
5072
+ );
5073
+
5074
+ // src/components/ChartTooltip/components/ChartTooltipPortal.tsx
5075
+ var import_react20 = require("react");
5076
+ var import_react_dom = require("react-dom");
5077
+ var generateChartTooltipPortalId = (chartId) => `highcharts-custom-tooltip-${chartId}`;
5078
+ var ChartTooltipPortal = (0, import_react20.memo)(
5079
+ function ChartTooltipPortal2({
5080
+ chart,
5081
+ renderContent
5082
+ }) {
5083
+ const isInitialized = (0, import_react20.useRef)(false);
5084
+ const [node, setNode] = (0, import_react20.useState)(null);
5085
+ const [context, setContext] = (0, import_react20.useState)(null);
5086
+ (0, import_react20.useEffect)(() => {
5087
+ const formatter = function() {
5088
+ if (!isInitialized.current) {
5089
+ isInitialized.current = true;
5090
+ chart.tooltip.refresh.apply(chart.tooltip, [this.point]);
5091
+ chart.tooltip.hide(0);
5092
+ }
5093
+ setContext(this);
5094
+ return `<div id="${generateChartTooltipPortalId(
5095
+ chart.index
5096
+ )}" role='tooltip'></div>`;
5097
+ };
5098
+ chart.update({ tooltip: { formatter } });
5099
+ }, [chart]);
5100
+ (0, import_react20.useEffect)(() => {
5101
+ if (context?.series?.chart?.tooltip) {
5102
+ const tooltip = context.series.chart.tooltip;
5103
+ const textElement = tooltip.label.text.element;
5104
+ tooltip.label.box.attr({
5105
+ height: textElement.offsetHeight,
5106
+ width: textElement.offsetWidth
5107
+ });
5108
+ setNode(
5109
+ document.getElementById(generateChartTooltipPortalId(chart.index))
5110
+ );
5111
+ }
5112
+ }, [context, chart.index]);
5113
+ return node && context ? (0, import_react_dom.createPortal)(renderContent(context), node) : null;
5114
+ }
5115
+ );
5116
+
5117
+ // src/helpers/transformDataToSeries.ts
5118
+ var transformDataToSeries = ({ data }, type) => {
5119
+ return data.map((dataItem, dataIndex) => {
5120
+ const points = dataItem.points || [];
5121
+ const dataPoints = points.map((point, pointsIndex) => {
5122
+ let enableMarker = false;
5123
+ const isFirstPoint = pointsIndex === 0;
5124
+ const isLastPoint = pointsIndex === points.length - 1;
5125
+ const previousY = isFirstPoint ? null : points[pointsIndex - 1].y;
5126
+ const nextY = isLastPoint ? null : points[pointsIndex + 1].y;
5127
+ if (isFirstPoint && nextY === null) {
5128
+ enableMarker = true;
5129
+ } else if (isLastPoint && previousY === null) {
5130
+ enableMarker = true;
5131
+ } else if (previousY === null && nextY === null) {
5132
+ enableMarker = true;
5133
+ }
5134
+ return {
5135
+ x: point.x,
5136
+ y: point.y,
5137
+ marker: {
5138
+ enabled: enableMarker ? enableMarker : void 0,
5139
+ symbol: enableMarker ? "circle" : void 0
5140
+ }
5141
+ };
5142
+ });
5143
+ return {
5144
+ colorIndex: dataIndex,
5145
+ data: dataPoints,
5146
+ name: dataItem.name,
5147
+ type
5148
+ };
5149
+ });
3462
5150
  };
3463
- var getDatavizColorWithAlpha = (colorIndex) => {
3464
- const color = getDatavizColor(colorIndex);
3465
- const opacity = getDatavizOpacity(colorIndex);
3466
- if (opacity < 0 || opacity > 1) {
3467
- return color;
5151
+
5152
+ // src/helpers/transformTimeSeriesTooltipData.ts
5153
+ var transformTimeSeriesTooltipData = ({
5154
+ context,
5155
+ data
5156
+ }) => {
5157
+ return (context.series.chart.series || []).map((series, index) => {
5158
+ const pointIndex = context.point.index;
5159
+ const { y: y2 } = series.points[pointIndex];
5160
+ return {
5161
+ color: data[index]?.styles?.color || theme_default.colors.DATAVIZ_COLORS_LIST[index],
5162
+ ...data[index]?.icon ? { icon: data[index]?.icon } : {},
5163
+ name: series.name,
5164
+ value: typeof y2 === "number" ? y2 : null
5165
+ };
5166
+ });
5167
+ };
5168
+
5169
+ // src/helpers/xAxisLabelFormatter.ts
5170
+ var xAxisLabelFormatter = ({
5171
+ textLocale,
5172
+ tickPositions = [],
5173
+ unitName,
5174
+ value,
5175
+ // optional
5176
+ timeFormat = "12"
5177
+ }) => {
5178
+ const tickIndex = tickPositions.indexOf(value);
5179
+ const isFirst = tickIndex === 0;
5180
+ const previousValue = tickPositions[tickIndex - 1];
5181
+ const valueDate = new Date(value);
5182
+ const previousValueDate = new Date(previousValue);
5183
+ let firstPartOptions = {};
5184
+ let secondPartOptions = {};
5185
+ switch (unitName) {
5186
+ case "hour":
5187
+ firstPartOptions = timeFormat === "24" ? { hour: "numeric", minute: "numeric", hour12: false } : { hour: "numeric" };
5188
+ if (isFirst || valueDate.getUTCDate() !== previousValueDate.getUTCDate()) {
5189
+ secondPartOptions = { day: "numeric", month: "short" };
5190
+ }
5191
+ break;
5192
+ case "day":
5193
+ case "week":
5194
+ firstPartOptions = { day: "numeric" };
5195
+ if (isFirst || valueDate.getUTCMonth() !== previousValueDate.getUTCMonth()) {
5196
+ secondPartOptions = { month: "short" };
5197
+ }
5198
+ break;
5199
+ case "month":
5200
+ firstPartOptions = { month: "short" };
5201
+ if (isFirst || valueDate.getUTCFullYear() !== previousValueDate.getUTCFullYear()) {
5202
+ secondPartOptions = { year: "numeric" };
5203
+ }
5204
+ break;
5205
+ case "year":
5206
+ firstPartOptions = { year: "numeric" };
5207
+ break;
5208
+ default:
5209
+ firstPartOptions = {};
5210
+ break;
3468
5211
  }
3469
- return `${color}${Math.floor(opacity * 255).toString(16).padStart(2, "0")}`;
5212
+ const firstPart = new Intl.DateTimeFormat(textLocale, {
5213
+ ...firstPartOptions,
5214
+ timeZone: "UTC"
5215
+ }).format(valueDate);
5216
+ const secondPart = Object.keys(secondPartOptions).length > 0 ? new Intl.DateTimeFormat(textLocale, {
5217
+ ...secondPartOptions,
5218
+ timeZone: "UTC"
5219
+ }).format(valueDate) : void 0;
5220
+ return `<span>${firstPart}</span>${secondPart ? `<span>${secondPart}</span>` : ""}`;
3470
5221
  };
3471
5222
 
3472
- // src/components/ColorBox/NetworkColorBox.tsx
3473
- var import_seeds_networkcolor2 = __toESM(require("@sproutsocial/seeds-networkcolor"));
3474
- var import_jsx_runtime6 = require("react/jsx-runtime");
3475
- var NetworkColorBox = ({
3476
- networkColor,
3477
- ...props
5223
+ // src/helpers/yAxisLabelFormatter.ts
5224
+ var import_racine3 = require("@sproutsocial/racine");
5225
+ var yAxisLabelFormatter = ({
5226
+ numberLocale,
5227
+ textLocale,
5228
+ tickPositions,
5229
+ value,
5230
+ currency = "USD",
5231
+ numberFormat = "decimal"
3478
5232
  }) => {
3479
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ColorBox, { ...props, bg: import_seeds_networkcolor2.default[networkColor] });
5233
+ const numberValue = Number(value);
5234
+ if (numberValue === 0) {
5235
+ return (0, import_racine3.formatNumeral)({
5236
+ locale: numberLocale,
5237
+ number: numberValue
5238
+ });
5239
+ }
5240
+ if (numberFormat === "duration") {
5241
+ return (0, import_racine3.formatDuration)({
5242
+ display: "narrow",
5243
+ locale: textLocale,
5244
+ milliseconds: numberValue
5245
+ });
5246
+ }
5247
+ const maxValue = tickPositions && tickPositions.length > 0 ? tickPositions[tickPositions.length - 1] : void 0;
5248
+ const abbreviate = typeof maxValue === "number" && maxValue > 9999 ? 1e3 : true;
5249
+ return (0, import_racine3.formatNumeral)({
5250
+ abbreviate,
5251
+ currency,
5252
+ format: numberFormat,
5253
+ locale: numberLocale,
5254
+ number: numberValue
5255
+ });
3480
5256
  };
3481
5257
 
5258
+ // src/hooks/useTimeSeriesChartOptions.ts
5259
+ var import_react21 = require("react");
5260
+ var import_highcharts = require("highcharts");
5261
+
3482
5262
  // src/constants/chartOptions.ts
3483
5263
  var import_lodash = __toESM(require("lodash"));
3484
5264
  var baseChartOptions = {
@@ -3553,185 +5333,848 @@ var timeSeriesChartOptions = import_lodash.default.merge({}, baseChartOptions, {
3553
5333
  text: void 0
3554
5334
  }
3555
5335
  }
3556
- });
3557
- var lineChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
3558
- // plotOptions.spline.events.click is set at the component level because of the optional onClick prop
3559
- });
3560
- var areaChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
3561
- plotOptions: {
3562
- areaspline: {
3563
- // events.click is set at the component level because of the optional onClick prop
3564
- stacking: "normal"
5336
+ });
5337
+ var lineChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
5338
+ // plotOptions.spline.events.click is set at the component level because of the optional onClick prop
5339
+ });
5340
+ var areaChartOptions = import_lodash.default.merge({}, timeSeriesChartOptions, {
5341
+ plotOptions: {
5342
+ areaspline: {
5343
+ // events.click is set at the component level because of the optional onClick prop
5344
+ stacking: "normal"
5345
+ }
5346
+ }
5347
+ });
5348
+ var DONUT_CHART_HALO_SIZE = 10;
5349
+ var DONUT_CHART_HEIGHT = 250 + DONUT_CHART_HALO_SIZE * 2;
5350
+ var DONUT_CHART_WIDTH = DONUT_CHART_HEIGHT;
5351
+ var donutChartOptions = import_lodash.default.merge({}, baseChartOptions, {
5352
+ chart: {
5353
+ height: DONUT_CHART_HEIGHT,
5354
+ spacing: [0, 0, 0, 0]
5355
+ },
5356
+ plotOptions: {
5357
+ pie: {
5358
+ animation: false,
5359
+ borderRadius: 0,
5360
+ // must be handled here instead of css because of path rendering
5361
+ dataLabels: {
5362
+ enabled: false
5363
+ },
5364
+ innerSize: "50%"
5365
+ }
5366
+ }
5367
+ });
5368
+
5369
+ // src/hooks/useTimeSeriesChartOptions.ts
5370
+ var useTimeSeriesChartOptions = ({
5371
+ data,
5372
+ numberLocale,
5373
+ seriesType,
5374
+ textLocale,
5375
+ currency = "USD",
5376
+ numberFormat = "decimal",
5377
+ yAxisLabelFormatter: yAxisLabelFormatter2,
5378
+ onClick,
5379
+ timeFormat = "12"
5380
+ }) => {
5381
+ const [options, setOptions] = (0, import_react21.useState)(
5382
+ seriesType === "areaspline" ? areaChartOptions : lineChartOptions
5383
+ );
5384
+ const [chart, setChart] = (0, import_react21.useState)(null);
5385
+ const callback = (0, import_react21.useCallback)((chartInstance) => {
5386
+ setChart(chartInstance);
5387
+ }, []);
5388
+ (0, import_react21.useEffect)(() => {
5389
+ setOptions({
5390
+ accessibility: {
5391
+ point: {
5392
+ descriptionFormatter: function() {
5393
+ return " ";
5394
+ }
5395
+ }
5396
+ },
5397
+ chart: {
5398
+ events: {
5399
+ click: onClick ? function() {
5400
+ return onClick({ x: this?.hoverPoint?.x });
5401
+ } : void 0,
5402
+ render: function() {
5403
+ const allPoints = this.series.flatMap((series) => series.data);
5404
+ const tooltipId = generateChartTooltipPortalId(this.index);
5405
+ allPoints.forEach((point) => {
5406
+ const pointElement = point?.graphic?.element;
5407
+ pointElement?.setAttribute("aria-describedby", tooltipId);
5408
+ pointElement?.addEventListener("focus", () => {
5409
+ point.series.chart.tooltip.refresh(point);
5410
+ });
5411
+ pointElement?.addEventListener("blur", () => {
5412
+ point.series.chart.tooltip.hide(0);
5413
+ });
5414
+ });
5415
+ }
5416
+ }
5417
+ },
5418
+ plotOptions: {
5419
+ areaspline: {
5420
+ events: {
5421
+ click: onClick && seriesType === "areaspline" ? function(event) {
5422
+ return onClick({ x: event.point.x });
5423
+ } : void 0
5424
+ }
5425
+ },
5426
+ spline: {
5427
+ events: {
5428
+ click: onClick && seriesType === "spline" ? function(event) {
5429
+ return onClick({ x: event.point.x });
5430
+ } : void 0
5431
+ }
5432
+ }
5433
+ },
5434
+ series: transformDataToSeries({ data }, seriesType),
5435
+ xAxis: {
5436
+ labels: {
5437
+ formatter: function() {
5438
+ return xAxisLabelFormatter({
5439
+ textLocale,
5440
+ tickPositions: this.axis.tickPositions || [],
5441
+ timeFormat,
5442
+ unitName: this.tickPositionInfo.unitName,
5443
+ value: this.value
5444
+ });
5445
+ }
5446
+ }
5447
+ },
5448
+ yAxis: {
5449
+ labels: {
5450
+ formatter: function() {
5451
+ return yAxisLabelFormatter2 ? yAxisLabelFormatter2({
5452
+ y: this.value,
5453
+ yValues: this.axis.tickPositions
5454
+ }) : yAxisLabelFormatter({
5455
+ currency,
5456
+ numberFormat,
5457
+ numberLocale,
5458
+ textLocale,
5459
+ tickPositions: this.axis.tickPositions || [],
5460
+ value: this.value
5461
+ });
5462
+ }
5463
+ }
5464
+ }
5465
+ });
5466
+ }, [
5467
+ currency,
5468
+ data,
5469
+ numberFormat,
5470
+ numberLocale,
5471
+ onClick,
5472
+ seriesType,
5473
+ textLocale,
5474
+ timeFormat,
5475
+ yAxisLabelFormatter2
5476
+ ]);
5477
+ return { options, chart, callback };
5478
+ };
5479
+
5480
+ // src/styles/chartStyles.ts
5481
+ var import_styled_components14 = require("styled-components");
5482
+ var baseChartStyles = import_styled_components14.css`
5483
+ // set color variables and map to each series
5484
+ ${({ $colors }) => $colors.map((color2, index) => {
5485
+ const chartColor = color2 || theme_default.colors.DATAVIZ_COLORS_LIST[index];
5486
+ return `
5487
+ // map colors to custom assigned colors or fallback to default data viz color rotation
5488
+ --highcharts-color-${index}: ${chartColor};
5489
+
5490
+ // highcharts already accounts for 10 series, but if we have more, we need to add them
5491
+ .highcharts-color-${index} {
5492
+ color: var(--highcharts-color-${index});
5493
+ stroke: var(--highcharts-color-${index});
5494
+ fill: var(--highcharts-color-${index});
5495
+ }`;
5496
+ }).join("\n")}
5497
+
5498
+ // set overall chart background color
5499
+ .highcharts-background {
5500
+ fill: ${({ theme: theme2 }) => theme2.colors.container.background.base};
5501
+ }
5502
+ `;
5503
+ var timeSeriesChartStyles = import_styled_components14.css`
5504
+ ${baseChartStyles}
5505
+
5506
+ // vertical crosshair styles
5507
+ .highcharts-crosshair {
5508
+ stroke: ${({ theme: theme2 }) => theme2.colors.container.border.decorative.neutral};
5509
+ stroke-width: 1;
5510
+ }
5511
+
5512
+ // axis and gridline styles
5513
+ .highcharts-grid-line {
5514
+ stroke: ${({ theme: theme2 }) => theme2.colors.container.border.base};
5515
+ }
5516
+ .highcharts-axis-line {
5517
+ stroke: ${({ theme: theme2 }) => theme2.colors.container.border.base};
5518
+ }
5519
+ .highcharts-tick {
5520
+ stroke: none;
5521
+ }
5522
+ .highcharts-xaxis-labels,
5523
+ .highcharts-yaxis-labels {
5524
+ > span {
5525
+ font-family: ${({ theme: theme2 }) => theme2.fontFamily};
5526
+ ${({ theme: theme2 }) => theme2.typography[100]};
5527
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.normal};
5528
+ color: ${({ theme: theme2 }) => theme2.colors.text.subtext};
5529
+ }
5530
+ }
5531
+ .highcharts-xaxis-labels {
5532
+ > span {
5533
+ display: flex;
5534
+ flex-direction: column;
5535
+ align-items: center;
5536
+ > span:nth-of-type(2) {
5537
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
5538
+ }
3565
5539
  }
3566
5540
  }
5541
+
5542
+ // we don't want to drop the opacity when another item is hovered
5543
+ .highcharts-series-inactive {
5544
+ opacity: 1;
5545
+ }
5546
+
5547
+ // apply cursor pointer when click functionality is turned on
5548
+ ${({ $hasOnClick }) => $hasOnClick && `
5549
+ .highcharts-series,
5550
+ .highcharts-point {
5551
+ cursor: pointer;
5552
+ }
5553
+ .highcharts-plot-background,
5554
+ .highcharts-crosshair,
5555
+ .highcharts-grid-line {
5556
+ fill: transparent;
5557
+ cursor: pointer;
5558
+ }`}
5559
+ `;
5560
+ var lineChartStyles = import_styled_components14.css`
5561
+ ${timeSeriesChartStyles}
5562
+
5563
+ // set the line stroke
5564
+ .highcharts-graph {
5565
+ stroke-width: 3;
5566
+ }
5567
+
5568
+ // dashed line styles
5569
+ ${({ $patterns }) => $patterns.map((pattern, index) => {
5570
+ return pattern === "dashed" ? `
5571
+ // highcharts already accounts for 10 series, but if we have more, we need to add them
5572
+ .highcharts-series-${index} {
5573
+ stroke-dasharray: 2, 8;
5574
+ }` : "";
5575
+ })}
5576
+ `;
5577
+ var areaChartStyles = import_styled_components14.css`
5578
+ ${timeSeriesChartStyles}
5579
+
5580
+ // don't need to show a stroke for the line part of each area
5581
+ .highcharts-graph {
5582
+ stroke-width: 0;
5583
+ }
5584
+
5585
+ // fill areas to full opacity
5586
+ .highcharts-area {
5587
+ fill-opacity: 1;
5588
+ }
5589
+ `;
5590
+ var donutChartStyles = import_styled_components14.css`
5591
+ ${baseChartStyles}
5592
+
5593
+ // remove 250ms fade in/out when hovering over different donut chart slices
5594
+ .highcharts-point {
5595
+ transition: opacity 0s;
5596
+ }
5597
+
5598
+ // remove stroke on donut slices
5599
+ .highcharts-point,
5600
+ .highcharts-pie-series {
5601
+ stroke: none;
5602
+ }
5603
+
5604
+ // don't reduce opacity when hovering
5605
+ .highcharts-point-hover {
5606
+ fill-opacity: none;
5607
+ }
5608
+ `;
5609
+
5610
+ // src/components/AreaChart/AreaChart.tsx
5611
+ var import_jsx_runtime19 = require("react/jsx-runtime");
5612
+ (0, import_accessibility.default)(import_highcharts2.default);
5613
+ var StyledBox3 = (0, import_styled_components15.default)(Box_default)`
5614
+ ${areaChartStyles}
5615
+ `;
5616
+ var AreaChart = (0, import_react22.memo)(function AreaChart2(props) {
5617
+ const { data } = props;
5618
+ return data.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(AreaChartWithData, { ...props });
3567
5619
  });
3568
- var DONUT_CHART_HALO_SIZE = 10;
3569
- var DONUT_CHART_HEIGHT = 250 + DONUT_CHART_HALO_SIZE * 2;
3570
- var DONUT_CHART_WIDTH = DONUT_CHART_HEIGHT;
3571
- var donutChartOptions = import_lodash.default.merge({}, baseChartOptions, {
3572
- chart: {
3573
- height: DONUT_CHART_HEIGHT,
3574
- spacing: [0, 0, 0, 0]
3575
- },
3576
- plotOptions: {
3577
- pie: {
3578
- animation: false,
3579
- borderRadius: 0,
3580
- // must be handled here instead of css because of path rendering
3581
- dataLabels: {
3582
- enabled: false
3583
- },
3584
- innerSize: "50%"
5620
+ var AreaChartWithData = (0, import_react22.memo)(function AreaChartWithData2({
5621
+ data,
5622
+ invalidNumberLabel,
5623
+ numberLocale = "en-us",
5624
+ textLocale = "en-us",
5625
+ tooltipDateFormatter,
5626
+ tooltipTotalLabel,
5627
+ // optional
5628
+ currency = "USD",
5629
+ numberFormat = "decimal",
5630
+ tooltip,
5631
+ yAxisLabelFormatter: yAxisLabelFormatter2,
5632
+ onClick,
5633
+ tooltipClickLabel,
5634
+ timeFormat = "12"
5635
+ }) {
5636
+ const { options, chart, callback } = useTimeSeriesChartOptions({
5637
+ currency,
5638
+ data,
5639
+ numberFormat,
5640
+ numberLocale,
5641
+ seriesType: "areaspline",
5642
+ textLocale,
5643
+ yAxisLabelFormatter: yAxisLabelFormatter2,
5644
+ onClick,
5645
+ timeFormat
5646
+ });
5647
+ const colors3 = data.map(
5648
+ (series, index) => series.styles?.color ?? theme_default.colors.DATAVIZ_COLORS_LIST[index]
5649
+ );
5650
+ return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
5651
+ StyledBox3,
5652
+ {
5653
+ $colors: colors3,
5654
+ $hasOnClick: Boolean(onClick),
5655
+ bg: "container.background.base",
5656
+ children: [
5657
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
5658
+ import_highcharts_react_official.HighchartsReact,
5659
+ {
5660
+ highcharts: import_highcharts2.default,
5661
+ options,
5662
+ callback
5663
+ }
5664
+ ),
5665
+ chart ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
5666
+ ChartTooltipPortal,
5667
+ {
5668
+ chart,
5669
+ renderContent: (context) => {
5670
+ const tooltipData = transformTimeSeriesTooltipData({
5671
+ context,
5672
+ data
5673
+ });
5674
+ const x = context.x;
5675
+ const total = context.total;
5676
+ return tooltip ? tooltip({ data: tooltipData, total, x }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
5677
+ AreaChartTooltip,
5678
+ {
5679
+ currency,
5680
+ data: tooltipData,
5681
+ invalidNumberLabel,
5682
+ numberFormat,
5683
+ numberLocale,
5684
+ textLocale,
5685
+ tooltipDateFormatter,
5686
+ tooltipTotalLabel,
5687
+ total,
5688
+ x,
5689
+ onClick,
5690
+ tooltipClickLabel
5691
+ }
5692
+ );
5693
+ }
5694
+ }
5695
+ ) : null,
5696
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Box_default, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(AreaChartLegend, { data }) })
5697
+ ]
3585
5698
  }
3586
- }
5699
+ );
3587
5700
  });
3588
5701
 
3589
- // src/helpers/transformDataToSeries.ts
3590
- var transformDataToSeries = ({ data }, type) => {
3591
- return data.map((dataItem, dataIndex) => {
3592
- const points = dataItem.points || [];
3593
- const dataPoints = points.map((point, pointsIndex) => {
3594
- let enableMarker = false;
3595
- const isFirstPoint = pointsIndex === 0;
3596
- const isLastPoint = pointsIndex === points.length - 1;
3597
- const previousY = isFirstPoint ? null : points[pointsIndex - 1].y;
3598
- const nextY = isLastPoint ? null : points[pointsIndex + 1].y;
3599
- if (isFirstPoint && nextY === null) {
3600
- enableMarker = true;
3601
- } else if (isLastPoint && previousY === null) {
3602
- enableMarker = true;
3603
- } else if (previousY === null && nextY === null) {
3604
- enableMarker = true;
3605
- }
3606
- return {
3607
- x: point.x,
3608
- y: point.y,
3609
- marker: {
3610
- enabled: enableMarker ? enableMarker : void 0,
3611
- symbol: enableMarker ? "circle" : void 0
3612
- }
3613
- };
3614
- });
3615
- return {
3616
- colorIndex: dataIndex,
3617
- data: dataPoints,
3618
- name: dataItem.name,
3619
- type
3620
- };
3621
- });
5702
+ // src/components/DonutChart/DonutChart.tsx
5703
+ var import_react25 = require("react");
5704
+ var import_highcharts3 = __toESM(require("highcharts"));
5705
+ var import_highcharts_react_official2 = require("highcharts-react-official");
5706
+ var import_accessibility2 = __toESM(require("highcharts/modules/accessibility"));
5707
+ var import_styled_components16 = __toESM(require("styled-components"));
5708
+
5709
+ // src/components/DonutChart/components/DonutChartLegend.tsx
5710
+ var import_react23 = require("react");
5711
+ var import_jsx_runtime20 = require("react/jsx-runtime");
5712
+ var getDonutChartLegendLabels = ({
5713
+ data
5714
+ }) => {
5715
+ return data.map((slice, index) => ({
5716
+ content: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartLegendLabelContentWithIcon, { icon: slice.icon, children: slice.name }),
5717
+ color: slice.styles?.color || theme_default.colors.DATAVIZ_COLORS_LIST[index]
5718
+ }));
3622
5719
  };
5720
+ var DonutChartLegend = (0, import_react23.memo)(
5721
+ function DonutChartLegend2({ data }) {
5722
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChartLegend, { legendLabels: getDonutChartLegendLabels({ data }) });
5723
+ }
5724
+ );
3623
5725
 
3624
- // src/helpers/transformTimeSeriesTooltipData.ts
3625
- var transformTimeSeriesTooltipData = ({
5726
+ // src/components/DonutChart/components/DonutChartTooltip.tsx
5727
+ var import_react24 = require("react");
5728
+ var import_racine4 = require("@sproutsocial/racine");
5729
+ var import_jsx_runtime21 = require("react/jsx-runtime");
5730
+ var DonutChartTooltip = (0, import_react24.memo)(
5731
+ function DonutChartTooltip2({
5732
+ color: color2,
5733
+ name,
5734
+ numberLocale,
5735
+ percent,
5736
+ textLocale,
5737
+ value,
5738
+ currency,
5739
+ icon,
5740
+ numberFormat
5741
+ }) {
5742
+ const rows = [
5743
+ {
5744
+ cells: [
5745
+ {
5746
+ content: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChartLegendLabel, { color: color2, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text_default, { "aria-label": `${name}: `, children: name }) }) })
5747
+ },
5748
+ {
5749
+ content: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Box_default, { display: "inline-flex", alignItems: "center", gap: 350, children: [
5750
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5751
+ import_racine4.Numeral,
5752
+ {
5753
+ number: percent,
5754
+ format: "percent",
5755
+ abbreviate: false,
5756
+ locale: numberLocale
5757
+ }
5758
+ ),
5759
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text_default, { fontWeight: "semibold", children: numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_racine4.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5760
+ import_racine4.Numeral,
5761
+ {
5762
+ abbreviate: false,
5763
+ currency,
5764
+ format: numberFormat,
5765
+ locale: numberLocale,
5766
+ number: value
5767
+ }
5768
+ ) })
5769
+ ] }),
5770
+ align: "right"
5771
+ }
5772
+ ]
5773
+ }
5774
+ ];
5775
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChartTooltip, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ChartTooltipTable, { rows }) });
5776
+ }
5777
+ );
5778
+
5779
+ // src/components/DonutChart/helpers/transformDonutChartTooltipData.ts
5780
+ var transformDonutChartTooltipData = ({
3626
5781
  context,
3627
5782
  data
3628
5783
  }) => {
3629
- return (context.series.chart.series || []).map((series, index) => {
3630
- const pointIndex = context.point.index;
3631
- const { y: y2 } = series.points[pointIndex];
3632
- return {
3633
- color: data[index]?.styles?.color || theme_default.colors.DATAVIZ_COLORS_LIST[index],
3634
- ...data[index]?.icon ? { icon: data[index]?.icon } : {},
3635
- name: series.name,
3636
- value: typeof y2 === "number" ? y2 : null
3637
- };
3638
- });
5784
+ const colorIndex = context.colorIndex;
5785
+ return {
5786
+ color: data[colorIndex]?.styles?.color ?? theme_default.colors.DATAVIZ_COLORS_LIST[colorIndex] ?? "",
5787
+ ...data[colorIndex]?.icon ? { icon: data[colorIndex]?.icon } : {},
5788
+ name: context.key,
5789
+ percent: context.percentage,
5790
+ value: context.y
5791
+ };
3639
5792
  };
3640
5793
 
3641
- // src/helpers/xAxisLabelFormatter.ts
3642
- var xAxisLabelFormatter = ({
3643
- textLocale,
3644
- tickPositions = [],
3645
- unitName,
3646
- value
3647
- }) => {
3648
- const tickIndex = tickPositions.indexOf(value);
3649
- const isFirst = tickIndex === 0;
3650
- const previousValue = tickPositions[tickIndex - 1];
3651
- const valueDate = new Date(value);
3652
- const previousValueDate = new Date(previousValue);
3653
- let firstPartOptions = {};
3654
- let secondPartOptions = {};
3655
- switch (unitName) {
3656
- case "hour":
3657
- firstPartOptions = { hour: "numeric" };
3658
- if (isFirst || valueDate.getUTCDate() !== previousValueDate.getUTCDate()) {
3659
- secondPartOptions = { day: "numeric", month: "short" };
3660
- }
3661
- break;
3662
- case "day":
3663
- case "week":
3664
- firstPartOptions = { day: "numeric" };
3665
- if (isFirst || valueDate.getUTCMonth() !== previousValueDate.getUTCMonth()) {
3666
- secondPartOptions = { month: "short" };
5794
+ // src/components/DonutChart/DonutChart.tsx
5795
+ var import_jsx_runtime22 = require("react/jsx-runtime");
5796
+ (0, import_accessibility2.default)(import_highcharts3.default);
5797
+ var StyledBox4 = (0, import_styled_components16.default)(Box_default)`
5798
+ ${donutChartStyles}
5799
+ `;
5800
+ var DonutChart = (0, import_react25.memo)(function DonutChart2(props) {
5801
+ const { data } = props;
5802
+ return data.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DonutChartWithData, { ...props });
5803
+ });
5804
+ var DonutChartWithData = (0, import_react25.memo)(
5805
+ function DonutChartWithData2({
5806
+ data,
5807
+ numberLocale = "en-us",
5808
+ textLocale = "en-us",
5809
+ // optional
5810
+ currency = "USD",
5811
+ hideLegend = false,
5812
+ numberFormat = "decimal",
5813
+ tooltip
5814
+ }) {
5815
+ const [options, setOptions] = (0, import_react25.useState)(donutChartOptions);
5816
+ const [chart, setChart] = (0, import_react25.useState)(null);
5817
+ const callback = (0, import_react25.useCallback)((chartInstance) => {
5818
+ setChart(chartInstance);
5819
+ }, []);
5820
+ (0, import_react25.useEffect)(() => {
5821
+ setOptions({
5822
+ accessibility: {
5823
+ point: {
5824
+ descriptionFormatter: function() {
5825
+ return " ";
5826
+ }
5827
+ }
5828
+ },
5829
+ chart: {
5830
+ events: {
5831
+ render: function() {
5832
+ const allSlices = this.series[0]?.data ?? [];
5833
+ const tooltipId = generateChartTooltipPortalId(this.index);
5834
+ allSlices.forEach((slice) => {
5835
+ const sliceElement = slice?.graphic?.element;
5836
+ sliceElement?.setAttribute("aria-describedby", tooltipId);
5837
+ sliceElement?.addEventListener("focus", () => {
5838
+ slice.series.chart.tooltip.refresh(slice);
5839
+ });
5840
+ sliceElement?.addEventListener("blur", () => {
5841
+ slice.series.chart.tooltip.hide(0);
5842
+ });
5843
+ });
5844
+ }
5845
+ }
5846
+ },
5847
+ series: [
5848
+ {
5849
+ type: "pie",
5850
+ data: data.map((item, index) => {
5851
+ return {
5852
+ name: item.name,
5853
+ y: item.value,
5854
+ colorIndex: index
5855
+ };
5856
+ })
5857
+ }
5858
+ ]
5859
+ });
5860
+ }, [data]);
5861
+ const colors3 = data.map(
5862
+ (series, index) => series.styles?.color ?? theme_default.colors.DATAVIZ_COLORS_LIST[index] ?? ""
5863
+ );
5864
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(StyledBox4, { $colors: colors3, bg: "container.background.base", children: [
5865
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5866
+ import_highcharts_react_official2.HighchartsReact,
5867
+ {
5868
+ highcharts: import_highcharts3.default,
5869
+ options,
5870
+ callback
5871
+ }
5872
+ ),
5873
+ chart ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5874
+ ChartTooltipPortal,
5875
+ {
5876
+ chart,
5877
+ renderContent: (context) => {
5878
+ const { color: color2, icon, name, percent, value } = transformDonutChartTooltipData({ context, data });
5879
+ return tooltip ? tooltip({ color: color2, icon, name, percent, value }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5880
+ DonutChartTooltip,
5881
+ {
5882
+ color: color2,
5883
+ currency,
5884
+ icon,
5885
+ name,
5886
+ numberFormat,
5887
+ numberLocale,
5888
+ percent,
5889
+ textLocale,
5890
+ value
5891
+ }
5892
+ );
5893
+ }
5894
+ }
5895
+ ) : null,
5896
+ hideLegend ? null : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Box_default, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DonutChartLegend, { data }) })
5897
+ ] });
5898
+ }
5899
+ );
5900
+
5901
+ // src/components/DonutChart/components/DonutChartLegendTable.tsx
5902
+ var import_react26 = require("react");
5903
+ var import_racine5 = require("@sproutsocial/racine");
5904
+ var import_jsx_runtime23 = require("react/jsx-runtime");
5905
+ var DonutChartLegendTable = (0, import_react26.memo)(
5906
+ function DonutChartLegendTable2({
5907
+ data,
5908
+ numberLocale = "en-us",
5909
+ textLocale = "en-us",
5910
+ totalLabel,
5911
+ // optional
5912
+ currency = "USD",
5913
+ numberFormat = "decimal"
5914
+ }) {
5915
+ const total = data.reduce(
5916
+ (accumulator, dataItem) => accumulator + dataItem.value,
5917
+ 0
5918
+ );
5919
+ const rows = data.map((dataPoint, index) => {
5920
+ const { name, icon, styles, value } = dataPoint;
5921
+ const color2 = styles?.color || theme_default.colors.DATAVIZ_COLORS_LIST[index];
5922
+ return {
5923
+ cells: [
5924
+ {
5925
+ content: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ChartLegendLabel, { color: color2, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ChartLegendLabelContentWithIcon, { icon, children: name }) })
5926
+ },
5927
+ {
5928
+ content: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Box_default, { display: "inline-flex", alignItems: "center", gap: 350, children: [
5929
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text_default, { color: "text.body", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
5930
+ import_racine5.Numeral,
5931
+ {
5932
+ abbreviate: false,
5933
+ format: "percent",
5934
+ locale: numberLocale,
5935
+ number: value / total * 100
5936
+ }
5937
+ ) }),
5938
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text_default, { color: "text.body", fontWeight: "semibold", children: numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_racine5.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
5939
+ import_racine5.Numeral,
5940
+ {
5941
+ abbreviate: false,
5942
+ currency,
5943
+ format: numberFormat,
5944
+ locale: numberLocale,
5945
+ number: value
5946
+ }
5947
+ ) })
5948
+ ] }),
5949
+ align: "right"
5950
+ }
5951
+ ]
5952
+ };
5953
+ });
5954
+ const totalRow = [
5955
+ {
5956
+ cells: [
5957
+ {
5958
+ content: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text_default, { fontWeight: "semibold", color: "text.headline", children: totalLabel })
5959
+ },
5960
+ {
5961
+ content: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Text_default, { color: "text.body", fontWeight: "bold", children: numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_racine5.Duration, { locale: textLocale, milliseconds: total }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
5962
+ import_racine5.Numeral,
5963
+ {
5964
+ abbreviate: false,
5965
+ currency,
5966
+ format: numberFormat,
5967
+ locale: numberLocale,
5968
+ number: total
5969
+ }
5970
+ ) }),
5971
+ align: "right"
5972
+ }
5973
+ ],
5974
+ isAppendedRow: true
3667
5975
  }
3668
- break;
3669
- case "month":
3670
- firstPartOptions = { month: "short" };
3671
- if (isFirst || valueDate.getUTCFullYear() !== previousValueDate.getUTCFullYear()) {
3672
- secondPartOptions = { year: "numeric" };
5976
+ ];
5977
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
5978
+ ChartTable,
5979
+ {
5980
+ rows: [...rows, ...totalRow]
3673
5981
  }
3674
- break;
3675
- case "year":
3676
- firstPartOptions = { year: "numeric" };
3677
- break;
3678
- default:
3679
- firstPartOptions = {};
3680
- break;
5982
+ );
3681
5983
  }
3682
- const firstPart = new Intl.DateTimeFormat(textLocale, {
3683
- ...firstPartOptions,
3684
- timeZone: "UTC"
3685
- }).format(valueDate);
3686
- const secondPart = Object.keys(secondPartOptions).length > 0 ? new Intl.DateTimeFormat(textLocale, {
3687
- ...secondPartOptions,
3688
- timeZone: "UTC"
3689
- }).format(valueDate) : void 0;
3690
- return `<span>${firstPart}</span>${secondPart ? `<span>${secondPart}</span>` : ""}`;
3691
- };
5984
+ );
3692
5985
 
3693
- // src/helpers/yAxisLabelFormatter.ts
3694
- var import_racine2 = require("@sproutsocial/racine");
3695
- var yAxisLabelFormatter = ({
3696
- numberLocale,
3697
- textLocale,
3698
- tickPositions,
3699
- value,
3700
- currency = "USD",
3701
- numberFormat = "decimal"
5986
+ // src/components/LineChart/LineChart.tsx
5987
+ var import_react29 = require("react");
5988
+ var import_highcharts4 = __toESM(require("highcharts"));
5989
+ var import_highcharts_react_official3 = require("highcharts-react-official");
5990
+ var import_accessibility3 = __toESM(require("highcharts/modules/accessibility"));
5991
+ var import_styled_components17 = __toESM(require("styled-components"));
5992
+
5993
+ // src/components/LineChart/components/LineChartLegend.tsx
5994
+ var import_react27 = require("react");
5995
+ var import_jsx_runtime24 = require("react/jsx-runtime");
5996
+ var getLineChartLegendLabels = ({
5997
+ data
3702
5998
  }) => {
3703
- const numberValue = Number(value);
3704
- if (numberValue === 0) {
3705
- return (0, import_racine2.formatNumeral)({
3706
- locale: numberLocale,
3707
- number: numberValue
3708
- });
5999
+ return data.map((series, index) => ({
6000
+ content: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartLegendLabelContentWithIcon, { icon: series.icon, children: series.name }),
6001
+ color: series.styles?.color || theme_default.colors.DATAVIZ_COLORS_LIST[index]
6002
+ }));
6003
+ };
6004
+ var LineChartLegend = (0, import_react27.memo)(
6005
+ function LineChartLegend2({ data }) {
6006
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChartLegend, { legendLabels: getLineChartLegendLabels({ data }) });
3709
6007
  }
3710
- if (numberFormat === "duration") {
3711
- return (0, import_racine2.formatDuration)({
3712
- display: "narrow",
3713
- locale: textLocale,
3714
- milliseconds: numberValue
6008
+ );
6009
+
6010
+ // src/components/LineChart/components/LineChartTooltip.tsx
6011
+ var import_react28 = require("react");
6012
+ var import_racine6 = require("@sproutsocial/racine");
6013
+ var import_jsx_runtime25 = require("react/jsx-runtime");
6014
+ var LineChartTooltip = (0, import_react28.memo)(
6015
+ function LineChartTooltip2({
6016
+ data,
6017
+ invalidNumberLabel,
6018
+ numberLocale,
6019
+ textLocale,
6020
+ tooltipDateFormatter,
6021
+ x,
6022
+ // optional
6023
+ currency = "USD",
6024
+ numberFormat = "decimal",
6025
+ onClick,
6026
+ tooltipClickLabel
6027
+ }) {
6028
+ const rows = data.map(({ color: color2, icon, name, value }) => {
6029
+ return {
6030
+ cells: [
6031
+ {
6032
+ content: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChartLegendLabel, { color: color2, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChartLegendLabelContentWithIcon, { icon, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text_default, { "aria-label": `${name}: `, children: name }) }) })
6033
+ },
6034
+ {
6035
+ content: value === null && invalidNumberLabel ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text_default, { children: invalidNumberLabel }) : numberFormat === "duration" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_racine6.Duration, { locale: textLocale, milliseconds: value }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
6036
+ import_racine6.Numeral,
6037
+ {
6038
+ abbreviate: false,
6039
+ currency,
6040
+ format: numberFormat,
6041
+ locale: numberLocale,
6042
+ number: value
6043
+ }
6044
+ ),
6045
+ align: "right"
6046
+ }
6047
+ ]
6048
+ };
3715
6049
  });
6050
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(ChartTooltip, { children: [
6051
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChartTooltipTitle, { children: tooltipDateFormatter({ x }) }),
6052
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChartTooltipTable, { rows }),
6053
+ onClick && tooltipClickLabel ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChartTooltipFooter, { children: typeof tooltipClickLabel === "string" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Box_default, { display: "flex", alignItems: "center", gap: 300, children: [
6054
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Icon_default, { name: "hand-pointer-clicking-outline", color: "icon.base" }),
6055
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Text_default, { color: "text.subtext", fontSize: 200, children: tooltipClickLabel })
6056
+ ] }) : tooltipClickLabel }) : null
6057
+ ] });
3716
6058
  }
3717
- const maxValue = tickPositions && tickPositions.length > 0 ? tickPositions[tickPositions.length - 1] : void 0;
3718
- const abbreviate = typeof maxValue === "number" && maxValue > 9999 ? 1e3 : true;
3719
- return (0, import_racine2.formatNumeral)({
3720
- abbreviate,
6059
+ );
6060
+
6061
+ // src/components/LineChart/LineChart.tsx
6062
+ var import_jsx_runtime26 = require("react/jsx-runtime");
6063
+ (0, import_accessibility3.default)(import_highcharts4.default);
6064
+ var StyledBox5 = (0, import_styled_components17.default)(Box_default)`
6065
+ ${lineChartStyles}
6066
+ `;
6067
+ var LineChart = (0, import_react29.memo)(function LineChart2(props) {
6068
+ const { data } = props;
6069
+ return data.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(LineChartWithData, { ...props });
6070
+ });
6071
+ var LineChartWithData = (0, import_react29.memo)(function LineChartWithData2({
6072
+ data,
6073
+ invalidNumberLabel,
6074
+ numberLocale = "en-us",
6075
+ textLocale = "en-us",
6076
+ tooltipDateFormatter,
6077
+ // optional
6078
+ currency = "USD",
6079
+ numberFormat = "decimal",
6080
+ tooltip,
6081
+ yAxisLabelFormatter: yAxisLabelFormatter2,
6082
+ onClick,
6083
+ tooltipClickLabel,
6084
+ timeFormat = "12"
6085
+ }) {
6086
+ const { options, chart, callback } = useTimeSeriesChartOptions({
3721
6087
  currency,
3722
- format: numberFormat,
3723
- locale: numberLocale,
3724
- number: numberValue
6088
+ data,
6089
+ numberFormat,
6090
+ numberLocale,
6091
+ seriesType: "spline",
6092
+ textLocale,
6093
+ yAxisLabelFormatter: yAxisLabelFormatter2,
6094
+ onClick,
6095
+ timeFormat
3725
6096
  });
3726
- };
6097
+ const { colors: colors3, patterns } = data.reduce(
6098
+ (acc, item, index) => {
6099
+ acc.colors.push(
6100
+ item.styles?.color ?? theme_default.colors.DATAVIZ_COLORS_LIST[index] ?? ""
6101
+ );
6102
+ acc.patterns.push(item.styles?.pattern ?? "solid");
6103
+ return acc;
6104
+ },
6105
+ {
6106
+ colors: [],
6107
+ patterns: []
6108
+ }
6109
+ );
6110
+ return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
6111
+ StyledBox5,
6112
+ {
6113
+ $colors: colors3,
6114
+ $patterns: patterns,
6115
+ $hasOnClick: Boolean(onClick),
6116
+ bg: "container.background.base",
6117
+ children: [
6118
+ /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
6119
+ import_highcharts_react_official3.HighchartsReact,
6120
+ {
6121
+ highcharts: import_highcharts4.default,
6122
+ options,
6123
+ callback
6124
+ }
6125
+ ),
6126
+ chart ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
6127
+ ChartTooltipPortal,
6128
+ {
6129
+ chart,
6130
+ renderContent: (context) => {
6131
+ const tooltipData = transformTimeSeriesTooltipData({
6132
+ context,
6133
+ data
6134
+ });
6135
+ const x = context.x;
6136
+ return tooltip ? tooltip({ data: tooltipData, x }) : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
6137
+ LineChartTooltip,
6138
+ {
6139
+ currency,
6140
+ data: tooltipData,
6141
+ invalidNumberLabel,
6142
+ numberFormat,
6143
+ numberLocale,
6144
+ textLocale,
6145
+ tooltipDateFormatter,
6146
+ x,
6147
+ onClick,
6148
+ tooltipClickLabel
6149
+ }
6150
+ );
6151
+ }
6152
+ }
6153
+ ) : null,
6154
+ /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Box_default, { mt: 350, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(LineChartLegend, { data }) })
6155
+ ]
6156
+ }
6157
+ );
6158
+ });
3727
6159
  // Annotate the CommonJS export names for ESM import in node:
3728
6160
  0 && (module.exports = {
6161
+ AreaChart,
6162
+ ChartLegend,
6163
+ ChartLegendLabel,
3729
6164
  ChartTable,
6165
+ ChartTooltip,
6166
+ ChartTooltipFooter,
6167
+ ChartTooltipHeader,
6168
+ ChartTooltipTable,
6169
+ ChartTooltipTitle,
3730
6170
  ColorBox,
3731
6171
  DONUT_CHART_HALO_SIZE,
3732
6172
  DONUT_CHART_HEIGHT,
3733
6173
  DONUT_CHART_WIDTH,
3734
6174
  DatavizColorBox,
6175
+ DonutChart,
6176
+ DonutChartLegendTable,
6177
+ LineChart,
3735
6178
  NetworkColorBox,
3736
6179
  TIME_SERIES_CHART_HEIGHT,
3737
6180
  areaChartOptions,
@@ -3748,6 +6191,15 @@ var yAxisLabelFormatter = ({
3748
6191
  });
3749
6192
  /*! Bundled license information:
3750
6193
 
6194
+ object-assign/index.js:
6195
+ (*
6196
+ object-assign
6197
+ (c) Sindre Sorhus
6198
+ @license MIT
6199
+ *)
6200
+ */
6201
+ /*! Bundled license information:
6202
+
3751
6203
  object-assign/index.js:
3752
6204
  (*
3753
6205
  object-assign