@xyo-network/react-price-forecast-plugin 2.78.10 → 2.79.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.
Files changed (87) hide show
  1. package/dist/browser/components/DetailsBox.d.cts +1 -0
  2. package/dist/browser/components/DetailsBox.d.cts.map +1 -1
  3. package/dist/browser/components/DetailsBox.d.mts +1 -0
  4. package/dist/browser/components/DetailsBox.d.mts.map +1 -1
  5. package/dist/browser/components/DetailsBox.d.ts +1 -0
  6. package/dist/browser/components/DetailsBox.d.ts.map +1 -1
  7. package/dist/browser/components/index.d.cts +1 -1
  8. package/dist/browser/components/index.d.cts.map +1 -1
  9. package/dist/browser/components/index.d.mts +1 -1
  10. package/dist/browser/components/index.d.mts.map +1 -1
  11. package/dist/browser/components/index.d.ts +1 -1
  12. package/dist/browser/components/index.d.ts.map +1 -1
  13. package/dist/browser/index.cjs +107 -42
  14. package/dist/browser/index.cjs.map +1 -1
  15. package/dist/browser/index.d.cts +2 -2
  16. package/dist/browser/index.d.mts +2 -2
  17. package/dist/browser/index.d.ts +2 -2
  18. package/dist/browser/{index.js → index.mjs} +101 -54
  19. package/dist/browser/index.mjs.map +1 -0
  20. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.cts.map +1 -1
  21. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.mts.map +1 -1
  22. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.ts.map +1 -1
  23. package/dist/browser/lib/index.d.cts +3 -3
  24. package/dist/browser/lib/index.d.mts +3 -3
  25. package/dist/browser/lib/index.d.ts +3 -3
  26. package/dist/neutral/components/DetailsBox.d.cts +1 -0
  27. package/dist/neutral/components/DetailsBox.d.cts.map +1 -1
  28. package/dist/neutral/components/DetailsBox.d.mts +1 -0
  29. package/dist/neutral/components/DetailsBox.d.mts.map +1 -1
  30. package/dist/neutral/components/DetailsBox.d.ts +1 -0
  31. package/dist/neutral/components/DetailsBox.d.ts.map +1 -1
  32. package/dist/neutral/components/index.d.cts +1 -1
  33. package/dist/neutral/components/index.d.cts.map +1 -1
  34. package/dist/neutral/components/index.d.mts +1 -1
  35. package/dist/neutral/components/index.d.mts.map +1 -1
  36. package/dist/neutral/components/index.d.ts +1 -1
  37. package/dist/neutral/components/index.d.ts.map +1 -1
  38. package/dist/neutral/index.cjs +107 -42
  39. package/dist/neutral/index.cjs.map +1 -1
  40. package/dist/neutral/index.d.cts +2 -2
  41. package/dist/neutral/index.d.mts +2 -2
  42. package/dist/neutral/index.d.ts +2 -2
  43. package/dist/neutral/{index.js → index.mjs} +101 -54
  44. package/dist/neutral/index.mjs.map +1 -0
  45. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.cts.map +1 -1
  46. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.mts.map +1 -1
  47. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.ts.map +1 -1
  48. package/dist/neutral/lib/index.d.cts +3 -3
  49. package/dist/neutral/lib/index.d.mts +3 -3
  50. package/dist/neutral/lib/index.d.ts +3 -3
  51. package/dist/node/components/DetailsBox.d.cts +1 -0
  52. package/dist/node/components/DetailsBox.d.cts.map +1 -1
  53. package/dist/node/components/DetailsBox.d.mts +1 -0
  54. package/dist/node/components/DetailsBox.d.mts.map +1 -1
  55. package/dist/node/components/DetailsBox.d.ts +1 -0
  56. package/dist/node/components/DetailsBox.d.ts.map +1 -1
  57. package/dist/node/components/index.d.cts +1 -1
  58. package/dist/node/components/index.d.cts.map +1 -1
  59. package/dist/node/components/index.d.mts +1 -1
  60. package/dist/node/components/index.d.mts.map +1 -1
  61. package/dist/node/components/index.d.ts +1 -1
  62. package/dist/node/components/index.d.ts.map +1 -1
  63. package/dist/node/index.cjs +107 -44
  64. package/dist/node/index.cjs.map +1 -1
  65. package/dist/node/index.d.cts +2 -2
  66. package/dist/node/index.d.mts +2 -2
  67. package/dist/node/index.d.ts +2 -2
  68. package/dist/node/{index.js → index.mjs} +101 -56
  69. package/dist/node/index.mjs.map +1 -0
  70. package/dist/node/lib/ForecastLineChartConfigBuilder.d.cts.map +1 -1
  71. package/dist/node/lib/ForecastLineChartConfigBuilder.d.mts.map +1 -1
  72. package/dist/node/lib/ForecastLineChartConfigBuilder.d.ts.map +1 -1
  73. package/dist/node/lib/index.d.cts +3 -3
  74. package/dist/node/lib/index.d.mts +3 -3
  75. package/dist/node/lib/index.d.ts +3 -3
  76. package/package.json +14 -14
  77. package/src/Plugin.ts +1 -1
  78. package/src/components/DetailsBox.stories.tsx +10 -7
  79. package/src/components/DetailsBox.tsx +6 -6
  80. package/src/components/index.ts +1 -1
  81. package/src/index.ts +2 -2
  82. package/src/lib/ForecastLineChartConfigBuilder.ts +5 -4
  83. package/src/lib/SourcePayloads.ts +1 -1
  84. package/src/lib/index.ts +3 -3
  85. package/dist/browser/index.js.map +0 -1
  86. package/dist/neutral/index.js.map +0 -1
  87. package/dist/node/index.js.map +0 -1
@@ -1,65 +1,80 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+
1
4
  // src/components/DetailsBox.tsx
2
5
  import "chartjs-adapter-luxon";
3
6
  import { useTheme } from "@mui/material";
4
7
  import { useAsyncEffect } from "@xylabs/react-async-effect";
5
8
  import { FlexCol } from "@xylabs/react-flexbox";
6
- import {
7
- CategoryScale,
8
- Chart as ChartJS,
9
- Legend,
10
- LinearScale,
11
- LineElement,
12
- PointElement,
13
- TimeScale,
14
- Title,
15
- Tooltip
16
- } from "chart.js";
17
- import { useState } from "react";
9
+ import { CategoryScale, Chart as ChartJS, Legend, LinearScale, LineElement, PointElement, TimeScale, Title, Tooltip } from "chart.js";
10
+ import React, { useState } from "react";
18
11
  import { Line } from "react-chartjs-2";
19
12
 
20
13
  // src/lib/DataLineStyles.ts
21
14
  import { alpha } from "@mui/material";
22
- var DataLineStyles = (color) => ({
15
+ var DataLineStyles = /* @__PURE__ */ __name((color) => ({
23
16
  backgroundColor: color ? alpha(color, 0.5) : void 0,
24
17
  borderColor: color
25
- });
18
+ }), "DataLineStyles");
26
19
 
27
20
  // src/lib/DataPointStyles.ts
28
- var DataPointStyles = (pointHoverBackgroundColor) => ({
21
+ var DataPointStyles = /* @__PURE__ */ __name((pointHoverBackgroundColor) => ({
29
22
  pointHitRadius: 20,
30
23
  pointHoverBackgroundColor,
31
24
  pointHoverRadius: 10,
32
25
  pointRadius: 5,
33
26
  pointStyle: "circle"
34
- });
27
+ }), "DataPointStyles");
35
28
 
36
29
  // src/lib/MockSourcePayloads.ts
37
- var MockSourcePayloads = () => {
30
+ var MockSourcePayloads = /* @__PURE__ */ __name(() => {
38
31
  const tenMin = 6e5;
39
32
  return [
40
33
  {
41
34
  baseFee: 38.90155387825,
42
- feePerGas: { high: 47.9945864396, low: 39.006868093, medium: 39.306868093, veryHigh: 44.45384380525 },
43
- priorityFeePerGas: { high: 1.0266666666666666, low: -0.41000000000000003, medium: 0.38, veryHigh: 1.3900000000000001 },
35
+ feePerGas: {
36
+ high: 47.9945864396,
37
+ low: 39.006868093,
38
+ medium: 39.306868093,
39
+ veryHigh: 44.45384380525
40
+ },
41
+ priorityFeePerGas: {
42
+ high: 1.0266666666666666,
43
+ low: -0.41000000000000003,
44
+ medium: 0.38,
45
+ veryHigh: 1.3900000000000001
46
+ },
44
47
  schema: "network.xyo.blockchain.ethereum.gas",
45
48
  timestamp: Date.now() - tenMin
46
49
  },
47
50
  {
48
51
  baseFee: 38.90155387825,
49
- feePerGas: { high: 47.9945864396, low: 39.006868093, medium: 100, veryHigh: 44.45384380525 },
50
- priorityFeePerGas: { high: 1.0266666666666666, low: -0.41000000000000003, medium: 0.38, veryHigh: 1.3900000000000001 },
52
+ feePerGas: {
53
+ high: 47.9945864396,
54
+ low: 39.006868093,
55
+ medium: 100,
56
+ veryHigh: 44.45384380525
57
+ },
58
+ priorityFeePerGas: {
59
+ high: 1.0266666666666666,
60
+ low: -0.41000000000000003,
61
+ medium: 0.38,
62
+ veryHigh: 1.3900000000000001
63
+ },
51
64
  schema: "network.xyo.blockchain.ethereum.gas",
52
65
  timestamp: Date.now()
53
66
  }
54
67
  ];
55
- };
68
+ }, "MockSourcePayloads");
56
69
 
57
70
  // src/lib/SourcePayloads.ts
58
- var SourcePayloads = class {
71
+ var _SourcePayloads = class _SourcePayloads {
72
+ sourcePayloads;
73
+ sourcePrices;
59
74
  constructor(sourcePayloads) {
60
75
  this.sourcePayloads = sourcePayloads;
76
+ this.sourcePrices = [];
61
77
  }
62
- sourcePrices = [];
63
78
  get payloads() {
64
79
  return this.sourcePayloads;
65
80
  }
@@ -68,7 +83,10 @@ var SourcePayloads = class {
68
83
  const instance = new this(sourcePayloads);
69
84
  const paths = jsonPath.split(".");
70
85
  instance.sourcePrices = sourcePayloads.map((payload) => {
71
- return { x: payload.timestamp, y: instance.jsonPathTraverser(payload, paths) };
86
+ return {
87
+ x: payload.timestamp,
88
+ y: instance.jsonPathTraverser(payload, paths)
89
+ };
72
90
  });
73
91
  return instance;
74
92
  }
@@ -91,26 +109,31 @@ var SourcePayloads = class {
91
109
  return result;
92
110
  }
93
111
  };
112
+ __name(_SourcePayloads, "SourcePayloads");
113
+ var SourcePayloads = _SourcePayloads;
94
114
 
95
115
  // src/lib/ForecastLineChartConfigBuilder.ts
96
- var defaultOptions = () => ({
116
+ var defaultOptions = /* @__PURE__ */ __name(() => ({
97
117
  plugins: {
98
118
  legend: {
99
119
  position: "top"
100
120
  }
101
121
  },
102
122
  responsive: true
103
- });
104
- var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
123
+ }), "defaultOptions");
124
+ var _ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
125
+ payload;
126
+ data;
127
+ options;
128
+ themeColors;
105
129
  constructor(theme, payload) {
106
130
  this.payload = payload;
131
+ this.data = {
132
+ datasets: []
133
+ };
134
+ this.options = defaultOptions();
107
135
  this.themeColors = this.parseTheme(theme);
108
136
  }
109
- data = {
110
- datasets: []
111
- };
112
- options = defaultOptions();
113
- themeColors;
114
137
  get forecastPayload() {
115
138
  if (this.payload) {
116
139
  return this.payload;
@@ -131,7 +154,9 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
131
154
  }
132
155
  async buildData(includeSources) {
133
156
  const forecastData = this.generateDataSetForecastData();
134
- const datasets = [forecastData];
157
+ const datasets = [
158
+ forecastData
159
+ ];
135
160
  if (includeSources) {
136
161
  const sourceData = await this.generateDataSetSourcePayloads();
137
162
  datasets.unshift(sourceData);
@@ -152,8 +177,12 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
152
177
  return this;
153
178
  }
154
179
  refreshValues() {
155
- this.data = { ...this.data };
156
- this.options = { ...this.options };
180
+ this.data = {
181
+ ...this.data
182
+ };
183
+ this.options = {
184
+ ...this.options
185
+ };
157
186
  }
158
187
  generateLegend() {
159
188
  return {
@@ -200,9 +229,14 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
200
229
  generateDataSetForecastData() {
201
230
  var _a, _b;
202
231
  return {
203
- borderDash: [5],
232
+ borderDash: [
233
+ 5
234
+ ],
204
235
  borderDashOffset: 0.5,
205
- data: this.forecastPayload.values.map((price) => ({ x: price.timestamp ?? 0, y: price.value })),
236
+ data: this.forecastPayload.values.map((price) => ({
237
+ x: price.timestamp ?? 0,
238
+ y: price.value
239
+ })),
206
240
  label: "Forecast Price",
207
241
  ...DataPointStyles((_a = this.themeColors) == null ? void 0 : _a.dataSetColorPrimary),
208
242
  ...DataLineStyles((_b = this.themeColors) == null ? void 0 : _b.dataSetColorPrimary)
@@ -219,34 +253,45 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
219
253
  };
220
254
  }
221
255
  };
256
+ __name(_ForecastLineChartConfigBuilder, "ForecastLineChartConfigBuilder");
257
+ var ForecastLineChartConfigBuilder = _ForecastLineChartConfigBuilder;
222
258
 
223
259
  // src/components/DetailsBox.tsx
224
- import { jsx } from "react/jsx-runtime";
225
260
  ChartJS.register(CategoryScale, TimeScale, PointElement, LineElement, LinearScale, Title, Tooltip, Legend);
226
- var PriceForecastDetailsBox = ({ payload, ...props }) => {
261
+ var PriceForecastDetailsBox = /* @__PURE__ */ __name(({ payload, ...props }) => {
227
262
  const priceForecastPayload = payload;
228
263
  const theme = useTheme();
229
- const [data, setData] = useState({ datasets: [] });
264
+ const [data, setData] = useState({
265
+ datasets: []
266
+ });
230
267
  const [options, setOptions] = useState({});
231
- useAsyncEffect(
232
- // eslint-disable-next-line react-hooks/exhaustive-deps
233
- async (mounted) => {
234
- const { data: data2, options: options2 } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, { fetch: true });
235
- if (mounted()) {
236
- setData(data2);
237
- setOptions(options2);
238
- }
239
- },
240
- [priceForecastPayload, theme]
241
- );
242
- return /* @__PURE__ */ jsx(FlexCol, { ...props, busy: priceForecastPayload === void 0, minHeight: "25vh", children: priceForecastPayload ? /* @__PURE__ */ jsx(Line, { options, data }) : null });
243
- };
268
+ useAsyncEffect(async (mounted) => {
269
+ const { data: data2, options: options2 } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, {
270
+ fetch: true
271
+ });
272
+ if (mounted()) {
273
+ setData(data2);
274
+ setOptions(options2);
275
+ }
276
+ }, [
277
+ priceForecastPayload,
278
+ theme
279
+ ]);
280
+ return /* @__PURE__ */ React.createElement(FlexCol, {
281
+ ...props,
282
+ busy: priceForecastPayload === void 0,
283
+ minHeight: "25vh"
284
+ }, priceForecastPayload ? /* @__PURE__ */ React.createElement(Line, {
285
+ options,
286
+ data
287
+ }) : null);
288
+ }, "PriceForecastDetailsBox");
244
289
 
245
290
  // src/Plugin.ts
246
291
  import { createPayloadRenderPlugin } from "@xyo-network/react-payload-plugin";
247
292
  var PriceForecastRenderPlugin = {
248
293
  ...createPayloadRenderPlugin({
249
- canRender: () => true,
294
+ canRender: /* @__PURE__ */ __name(() => true, "canRender"),
250
295
  components: {
251
296
  box: {
252
297
  detailsBox: PriceForecastDetailsBox
@@ -259,4 +304,4 @@ export {
259
304
  PriceForecastDetailsBox,
260
305
  PriceForecastRenderPlugin
261
306
  };
262
- //# sourceMappingURL=index.js.map
307
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/DetailsBox.tsx","../../src/lib/DataLineStyles.ts","../../src/lib/DataPointStyles.ts","../../src/lib/MockSourcePayloads.ts","../../src/lib/SourcePayloads.ts","../../src/lib/ForecastLineChartConfigBuilder.ts","../../src/Plugin.ts"],"sourcesContent":["import 'chartjs-adapter-luxon'\n\nimport { useTheme } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport { Payload } from '@xyo-network/payload-model'\nimport {\n CategoryScale,\n Chart as ChartJS,\n ChartData,\n ChartOptions,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n TimeScale,\n Title,\n Tooltip,\n} from 'chart.js'\nimport React, { useState } from 'react'\nimport { Line } from 'react-chartjs-2'\n\nimport { ForecastLineChartConfigBuilder } from '../lib/index.ts'\n\nChartJS.register(CategoryScale, TimeScale, PointElement, LineElement, LinearScale, Title, Tooltip, Legend)\n\nexport interface PriceForecastDetailsBoxProps extends FlexBoxProps {\n payload?: Payload\n}\n\nexport const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps> = ({ payload, ...props }) => {\n const priceForecastPayload = payload as ForecastPayload | undefined\n const theme = useTheme()\n const [data, setData] = useState<ChartData<'line'>>({ datasets: [] })\n const [options, setOptions] = useState<ChartOptions<'line'>>({})\n\n useAsyncEffect(\n\n async (mounted) => {\n const { data, options } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, { fetch: true })\n if (mounted()) {\n setData(data)\n setOptions(options)\n }\n },\n [priceForecastPayload, theme],\n )\n\n return (\n <FlexCol {...props} busy={priceForecastPayload === undefined} minHeight=\"25vh\">\n {priceForecastPayload\n ? <Line options={options} data={data} />\n : null}\n </FlexCol>\n )\n}\n","import { alpha } from '@mui/material'\n\nexport const DataLineStyles = (color?: string) => ({\n backgroundColor: color ? alpha(color, 0.5) : undefined,\n borderColor: color,\n})\n","export const DataPointStyles = (pointHoverBackgroundColor?: string) => ({\n pointHitRadius: 20,\n pointHoverBackgroundColor,\n pointHoverRadius: 10,\n pointRadius: 5,\n pointStyle: 'circle',\n})\n","export const MockSourcePayloads = () => {\n const tenMin = 600_000\n return [\n {\n baseFee: 38.901_553_878_25,\n feePerGas: { high: 47.994_586_439_6, low: 39.006_868_093, medium: 39.306_868_093, veryHigh: 44.453_843_805_25 },\n priorityFeePerGas: { high: 1.026_666_666_666_666_6, low: -0.410_000_000_000_000_03, medium: 0.38, veryHigh: 1.390_000_000_000_000_1 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now() - tenMin,\n },\n {\n baseFee: 38.901_553_878_25,\n feePerGas: { high: 47.994_586_439_6, low: 39.006_868_093, medium: 100, veryHigh: 44.453_843_805_25 },\n priorityFeePerGas: { high: 1.026_666_666_666_666_6, low: -0.410_000_000_000_000_03, medium: 0.38, veryHigh: 1.390_000_000_000_000_1 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now(),\n },\n ]\n}\n","import { Payload } from '@xyo-network/payload-model'\nimport { Point } from 'chart.js'\n\nimport { MockSourcePayloads } from './MockSourcePayloads.ts'\n\nexport class SourcePayloads {\n sourcePrices: Point[] = []\n\n constructor(public sourcePayloads: Payload[]) {}\n\n get payloads() {\n return this.sourcePayloads\n }\n\n static async build(jsonPath: string) {\n const sourcePayloads = await this.fetchSourcePayloads()\n const instance = new this(sourcePayloads)\n\n const paths = jsonPath.split('.')\n instance.sourcePrices = sourcePayloads.map((payload) => {\n return { x: payload.timestamp, y: instance.jsonPathTraverser(payload, paths) }\n })\n return instance\n }\n\n // TODO - fetch from archivist\n static async fetchSourcePayloads() {\n const payloads = await Promise.resolve(MockSourcePayloads())\n return payloads\n }\n\n jsonPathTraverser(obj: Payload, path: string[]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n let result: any = obj\n for (const key of path) {\n if (key in result) {\n const foundKey = key as keyof typeof result\n result = result[foundKey]\n } else {\n result = undefined\n break\n }\n }\n\n return result\n }\n}\n","import { Theme } from '@mui/material'\nimport { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport { ChartData, ChartDataset, ChartOptions, LegendOptions, Point, ScaleChartOptions } from 'chart.js'\n\nimport { DataLineStyles } from './DataLineStyles.ts'\nimport { DataPointStyles } from './DataPointStyles.ts'\nimport { SourcePayloads } from './SourcePayloads.ts'\n\ninterface SourcePayloadConfig {\n fetch: boolean\n sampleSize?: number\n}\n\ninterface ThemeColors {\n dataSetColorPrimary: string\n dataSetColorSecondary: string\n gridColor: string\n}\n\nconst defaultOptions: () => ChartOptions<'line'> = () => ({\n plugins: {\n legend: {\n position: 'top' as const,\n },\n },\n responsive: true,\n})\n\nexport class ForecastLineChartConfigBuilder {\n data: ChartData<'line'> = {\n datasets: [],\n }\n\n options: ChartOptions<'line'> = defaultOptions()\n themeColors: ThemeColors | undefined\n\n constructor(\n theme: Theme,\n private payload?: ForecastPayload,\n ) {\n this.themeColors = this.parseTheme(theme)\n }\n\n get forecastPayload() {\n if (this.payload) {\n return this.payload\n } else {\n throw new Error('ForecastPayload was not defined')\n }\n }\n\n static async create(theme: Theme, payload?: ForecastPayload, sourcePayloadConfig?: SourcePayloadConfig) {\n const instance = new ForecastLineChartConfigBuilder(theme, payload)\n\n await instance.build(sourcePayloadConfig?.fetch)\n\n instance.refreshValues()\n\n return instance\n }\n\n async build(includeSources?: boolean) {\n this.buildOptions()\n await this.buildData(includeSources)\n return this\n }\n\n async buildData(includeSources?: boolean) {\n const forecastData = this.generateDataSetForecastData()\n\n const datasets: ChartDataset<'line'>[] = [forecastData]\n\n if (includeSources) {\n // build data from sources in forecastPayload\n const sourceData = await this.generateDataSetSourcePayloads()\n datasets.unshift(sourceData)\n\n // add last source point as first item in prediction to connect the lines\n const lastSourceDataItem = sourceData.data.at(-1) as Point\n forecastData.data.unshift(lastSourceDataItem)\n }\n\n this.data = {\n datasets,\n }\n\n return this\n }\n\n buildOptions() {\n if (this.options.plugins) {\n this.options.plugins.title = this.generateTitle()\n this.options.plugins.legend = this.generateLegend()\n }\n this.options.scales = this.generateScales()\n\n return this\n }\n\n refreshValues() {\n this.data = { ...this.data }\n this.options = { ...this.options }\n }\n\n protected generateLegend() {\n return {\n labels: {\n pointStyle: 'circle',\n usePointStyle: true,\n },\n } as LegendOptions<'line'>\n }\n\n protected generateScales() {\n return {\n x: {\n grid: {\n color: this.themeColors?.gridColor,\n },\n time: {\n unit: 'minute',\n },\n type: 'time',\n },\n y: {\n grid: {\n color: this.themeColors?.gridColor,\n },\n },\n } as unknown as ScaleChartOptions<'line'>['scales']\n }\n\n protected generateTitle() {\n return {\n display: true,\n text: `Gas Price Forecaster (GWEI over time from ${\n this.forecastPayload?.values[0].timestamp ? new Date(this.forecastPayload.values[0].timestamp).toLocaleDateString() : ''\n })`,\n }\n }\n\n protected parseTheme(theme: Theme) {\n const dark = theme.palette.mode === 'dark'\n return {\n dataSetColorPrimary: theme.palette.primary.light,\n dataSetColorSecondary: theme.palette.secondary.light,\n gridColor: dark ? theme.palette.grey[800] : theme.palette.grey[300],\n }\n }\n\n private generateDataSetForecastData(): ChartDataset<'line'> {\n return {\n borderDash: [5],\n borderDashOffset: 0.5,\n data: this.forecastPayload.values.map(price => ({ x: price.timestamp ?? 0, y: price.value })),\n label: 'Forecast Price',\n ...DataPointStyles(this.themeColors?.dataSetColorPrimary),\n ...DataLineStyles(this.themeColors?.dataSetColorPrimary),\n }\n }\n\n private async generateDataSetSourcePayloads(): Promise<ChartDataset<'line'>> {\n const { sourcePrices } = await SourcePayloads.build('feePerGas.medium')\n return {\n data: sourcePrices,\n label: 'Source Prices',\n ...DataLineStyles(this.themeColors?.dataSetColorSecondary),\n ...DataPointStyles(this.themeColors?.dataSetColorSecondary),\n }\n }\n}\n","import { createPayloadRenderPlugin, PayloadRenderPlugin } from '@xyo-network/react-payload-plugin'\n\nimport { PriceForecastDetailsBox } from './components/index.ts'\n\nexport const PriceForecastRenderPlugin: PayloadRenderPlugin = {\n ...createPayloadRenderPlugin({\n canRender: () => true,\n components: {\n box: {\n detailsBox: PriceForecastDetailsBox,\n },\n },\n name: 'PriceForecast',\n }),\n}\n"],"mappings":";;;;AAAA,OAAO;AAEP,SAASA,gBAAgB;AACzB,SAASC,sBAAsB;AAC/B,SAAuBC,eAAe;AAGtC,SACEC,eACAC,SAASC,SAGTC,QACAC,aACAC,aACAC,cACAC,WACAC,OACAC,eACK;AACP,OAAOC,SAASC,gBAAgB;AAChC,SAASC,YAAY;;;ACrBrB,SAASC,aAAa;AAEf,IAAMC,iBAAiB,wBAACC,WAAoB;EACjDC,iBAAiBD,QAAQE,MAAMF,OAAO,GAAA,IAAOG;EAC7CC,aAAaJ;AACf,IAH8B;;;ACFvB,IAAMK,kBAAkB,wBAACC,+BAAwC;EACtEC,gBAAgB;EAChBD;EACAE,kBAAkB;EAClBC,aAAa;EACbC,YAAY;AACd,IAN+B;;;ACAxB,IAAMC,qBAAqB,6BAAA;AAChC,QAAMC,SAAS;AACf,SAAO;IACL;MACEC,SAAS;MACTC,WAAW;QAAEC,MAAM;QAAkBC,KAAK;QAAgBC,QAAQ;QAAgBC,UAAU;MAAkB;MAC9GC,mBAAmB;QAAEJ,MAAM;QAAyBC,KAAK;QAA2BC,QAAQ;QAAMC,UAAU;MAAwB;MACpIE,QAAQ;MACRC,WAAWC,KAAKC,IAAG,IAAKX;IAC1B;IACA;MACEC,SAAS;MACTC,WAAW;QAAEC,MAAM;QAAkBC,KAAK;QAAgBC,QAAQ;QAAKC,UAAU;MAAkB;MACnGC,mBAAmB;QAAEJ,MAAM;QAAyBC,KAAK;QAA2BC,QAAQ;QAAMC,UAAU;MAAwB;MACpIE,QAAQ;MACRC,WAAWC,KAAKC,IAAG;IACrB;;AAEJ,GAlBkC;;;ACK3B,IAAMC,kBAAN,MAAMA,gBAAAA;;EACXC;EAEAC,YAAmBC,gBAA2B;SAA3BA,iBAAAA;SAFnBF,eAAwB,CAAA;EAEuB;EAE/C,IAAIG,WAAW;AACb,WAAO,KAAKD;EACd;EAEA,aAAaE,MAAMC,UAAkB;AACnC,UAAMH,iBAAiB,MAAM,KAAKI,oBAAmB;AACrD,UAAMC,WAAW,IAAI,KAAKL,cAAAA;AAE1B,UAAMM,QAAQH,SAASI,MAAM,GAAA;AAC7BF,aAASP,eAAeE,eAAeQ,IAAI,CAACC,YAAAA;AAC1C,aAAO;QAAEC,GAAGD,QAAQE;QAAWC,GAAGP,SAASQ,kBAAkBJ,SAASH,KAAAA;MAAO;IAC/E,CAAA;AACA,WAAOD;EACT;;EAGA,aAAaD,sBAAsB;AACjC,UAAMH,WAAW,MAAMa,QAAQC,QAAQC,mBAAAA,CAAAA;AACvC,WAAOf;EACT;EAEAY,kBAAkBI,KAAcC,MAAgB;AAE9C,QAAIC,SAAcF;AAClB,eAAWG,OAAOF,MAAM;AACtB,UAAIE,OAAOD,QAAQ;AACjB,cAAME,WAAWD;AACjBD,iBAASA,OAAOE,QAAAA;MAClB,OAAO;AACLF,iBAASG;AACT;MACF;IACF;AAEA,WAAOH;EACT;AACF;AAzCatB;AAAN,IAAMA,iBAAN;;;ACcP,IAAM0B,iBAA6C,8BAAO;EACxDC,SAAS;IACPC,QAAQ;MACNC,UAAU;IACZ;EACF;EACAC,YAAY;AACd,IAPmD;AAS5C,IAAMC,kCAAN,MAAMA,gCAAAA;;EACXC;EAIAC;EACAC;EAEAC,YACEC,OACQC,SACR;SADQA,UAAAA;SATVL,OAA0B;MACxBM,UAAU,CAAA;IACZ;SAEAL,UAAgCP,eAAAA;AAO9B,SAAKQ,cAAc,KAAKK,WAAWH,KAAAA;EACrC;EAEA,IAAII,kBAAkB;AACpB,QAAI,KAAKH,SAAS;AAChB,aAAO,KAAKA;IACd,OAAO;AACL,YAAM,IAAII,MAAM,iCAAA;IAClB;EACF;EAEA,aAAaC,OAAON,OAAcC,SAA2BM,qBAA2C;AACtG,UAAMC,WAAW,IAAIb,gCAA+BK,OAAOC,OAAAA;AAE3D,UAAMO,SAASC,MAAMF,2DAAqBG,KAAAA;AAE1CF,aAASG,cAAa;AAEtB,WAAOH;EACT;EAEA,MAAMC,MAAMG,gBAA0B;AACpC,SAAKC,aAAY;AACjB,UAAM,KAAKC,UAAUF,cAAAA;AACrB,WAAO;EACT;EAEA,MAAME,UAAUF,gBAA0B;AACxC,UAAMG,eAAe,KAAKC,4BAA2B;AAErD,UAAMd,WAAmC;MAACa;;AAE1C,QAAIH,gBAAgB;AAElB,YAAMK,aAAa,MAAM,KAAKC,8BAA6B;AAC3DhB,eAASiB,QAAQF,UAAAA;AAGjB,YAAMG,qBAAqBH,WAAWrB,KAAKyB,GAAG,EAAC;AAC/CN,mBAAanB,KAAKuB,QAAQC,kBAAAA;IAC5B;AAEA,SAAKxB,OAAO;MACVM;IACF;AAEA,WAAO;EACT;EAEAW,eAAe;AACb,QAAI,KAAKhB,QAAQN,SAAS;AACxB,WAAKM,QAAQN,QAAQ+B,QAAQ,KAAKC,cAAa;AAC/C,WAAK1B,QAAQN,QAAQC,SAAS,KAAKgC,eAAc;IACnD;AACA,SAAK3B,QAAQ4B,SAAS,KAAKC,eAAc;AAEzC,WAAO;EACT;EAEAf,gBAAgB;AACd,SAAKf,OAAO;MAAE,GAAG,KAAKA;IAAK;AAC3B,SAAKC,UAAU;MAAE,GAAG,KAAKA;IAAQ;EACnC;EAEU2B,iBAAiB;AACzB,WAAO;MACLG,QAAQ;QACNC,YAAY;QACZC,eAAe;MACjB;IACF;EACF;EAEUH,iBAAiB;AA7G7B;AA8GI,WAAO;MACLI,GAAG;QACDC,MAAM;UACJC,QAAO,UAAKlC,gBAAL,mBAAkBmC;QAC3B;QACAC,MAAM;UACJC,MAAM;QACR;QACAC,MAAM;MACR;MACAC,GAAG;QACDN,MAAM;UACJC,QAAO,UAAKlC,gBAAL,mBAAkBmC;QAC3B;MACF;IACF;EACF;EAEUV,gBAAgB;AAhI5B;AAiII,WAAO;MACLe,SAAS;MACTC,MAAM,+CACJ,UAAKnC,oBAAL,mBAAsBoC,OAAO,GAAGC,aAAY,IAAIC,KAAK,KAAKtC,gBAAgBoC,OAAO,CAAA,EAAGC,SAAS,EAAEE,mBAAkB,IAAK,EAAA;IAE1H;EACF;EAEUxC,WAAWH,OAAc;AACjC,UAAM4C,OAAO5C,MAAM6C,QAAQC,SAAS;AACpC,WAAO;MACLC,qBAAqB/C,MAAM6C,QAAQG,QAAQC;MAC3CC,uBAAuBlD,MAAM6C,QAAQM,UAAUF;MAC/ChB,WAAWW,OAAO5C,MAAM6C,QAAQO,KAAK,GAAA,IAAOpD,MAAM6C,QAAQO,KAAK,GAAA;IACjE;EACF;EAEQpC,8BAAoD;AAlJ9D;AAmJI,WAAO;MACLqC,YAAY;QAAC;;MACbC,kBAAkB;MAClB1D,MAAM,KAAKQ,gBAAgBoC,OAAOe,IAAIC,CAAAA,WAAU;QAAE1B,GAAG0B,MAAMf,aAAa;QAAGJ,GAAGmB,MAAMC;MAAM,EAAA;MAC1FC,OAAO;MACP,GAAGC,iBAAgB,UAAK7D,gBAAL,mBAAkBiD,mBAAAA;MACrC,GAAGa,gBAAe,UAAK9D,gBAAL,mBAAkBiD,mBAAAA;IACtC;EACF;EAEA,MAAc7B,gCAA+D;AA7J/E;AA8JI,UAAM,EAAE2C,aAAY,IAAK,MAAMC,eAAerD,MAAM,kBAAA;AACpD,WAAO;MACLb,MAAMiE;MACNH,OAAO;MACP,GAAGE,gBAAe,UAAK9D,gBAAL,mBAAkBoD,qBAAAA;MACpC,GAAGS,iBAAgB,UAAK7D,gBAAL,mBAAkBoD,qBAAAA;IACvC;EACF;AACF;AA9IavD;AAAN,IAAMA,iCAAN;;;ALHPoE,QAAQC,SAASC,eAAeC,WAAWC,cAAcC,aAAaC,aAAaC,OAAOC,SAASC,MAAAA;AAM5F,IAAMC,0BAAkE,wBAAC,EAAEC,SAAS,GAAGC,MAAAA,MAAO;AACnG,QAAMC,uBAAuBF;AAC7B,QAAMG,QAAQC,SAAAA;AACd,QAAM,CAACC,MAAMC,OAAAA,IAAWC,SAA4B;IAAEC,UAAU,CAAA;EAAG,CAAA;AACnE,QAAM,CAACC,SAASC,UAAAA,IAAcH,SAA+B,CAAC,CAAA;AAE9DI,iBAEE,OAAOC,YAAAA;AACL,UAAM,EAAEP,MAAAA,OAAMI,SAAAA,SAAO,IAAK,MAAMI,+BAA+BC,OAAOX,OAAOD,sBAAsB;MAAEa,OAAO;IAAK,CAAA;AACjH,QAAIH,QAAAA,GAAW;AACbN,cAAQD,KAAAA;AACRK,iBAAWD,QAAAA;IACb;EACF,GACA;IAACP;IAAsBC;GAAM;AAG/B,SACE,sBAAA,cAACa,SAAAA;IAAS,GAAGf;IAAOgB,MAAMf,yBAAyBgB;IAAWC,WAAU;KACrEjB,uBACG,sBAAA,cAACkB,MAAAA;IAAKX;IAAkBJ;OACxB,IAAA;AAGV,GAzB+E;;;AM/B/E,SAASgB,iCAAsD;AAIxD,IAAMC,4BAAiD;EAC5D,GAAGC,0BAA0B;IAC3BC,WAAW,6BAAM,MAAN;IACXC,YAAY;MACVC,KAAK;QACHC,YAAYC;MACd;IACF;IACAC,MAAM;EACR,CAAA;AACF;","names":["useTheme","useAsyncEffect","FlexCol","CategoryScale","Chart","ChartJS","Legend","LinearScale","LineElement","PointElement","TimeScale","Title","Tooltip","React","useState","Line","alpha","DataLineStyles","color","backgroundColor","alpha","undefined","borderColor","DataPointStyles","pointHoverBackgroundColor","pointHitRadius","pointHoverRadius","pointRadius","pointStyle","MockSourcePayloads","tenMin","baseFee","feePerGas","high","low","medium","veryHigh","priorityFeePerGas","schema","timestamp","Date","now","SourcePayloads","sourcePrices","constructor","sourcePayloads","payloads","build","jsonPath","fetchSourcePayloads","instance","paths","split","map","payload","x","timestamp","y","jsonPathTraverser","Promise","resolve","MockSourcePayloads","obj","path","result","key","foundKey","undefined","defaultOptions","plugins","legend","position","responsive","ForecastLineChartConfigBuilder","data","options","themeColors","constructor","theme","payload","datasets","parseTheme","forecastPayload","Error","create","sourcePayloadConfig","instance","build","fetch","refreshValues","includeSources","buildOptions","buildData","forecastData","generateDataSetForecastData","sourceData","generateDataSetSourcePayloads","unshift","lastSourceDataItem","at","title","generateTitle","generateLegend","scales","generateScales","labels","pointStyle","usePointStyle","x","grid","color","gridColor","time","unit","type","y","display","text","values","timestamp","Date","toLocaleDateString","dark","palette","mode","dataSetColorPrimary","primary","light","dataSetColorSecondary","secondary","grey","borderDash","borderDashOffset","map","price","value","label","DataPointStyles","DataLineStyles","sourcePrices","SourcePayloads","ChartJS","register","CategoryScale","TimeScale","PointElement","LineElement","LinearScale","Title","Tooltip","Legend","PriceForecastDetailsBox","payload","props","priceForecastPayload","theme","useTheme","data","setData","useState","datasets","options","setOptions","useAsyncEffect","mounted","ForecastLineChartConfigBuilder","create","fetch","FlexCol","busy","undefined","minHeight","Line","createPayloadRenderPlugin","PriceForecastRenderPlugin","createPayloadRenderPlugin","canRender","components","box","detailsBox","PriceForecastDetailsBox","name"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAMzG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,WAAW;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB;AAWD,qBAAa,8BAA8B;IASvC,OAAO,CAAC,OAAO,CAAC;IARlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAEtB;IACD,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;gBAGlC,KAAK,EAAE,KAAK,EACJ,OAAO,CAAC,EAAE,eAAe,YAAA;IAKnC,IAAI,eAAe;;;;MAMlB;WAEY,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAE,mBAAmB;IAUhG,KAAK,CAAC,cAAc,CAAC,EAAE,OAAO;IAM9B,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO;IAsBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAgBN,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAGrD,SAAS,CAAC,aAAa;;;;IASvB,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK;;;;;IASjC,OAAO,CAAC,2BAA2B;YAWrB,6BAA6B;CAS5C"}
1
+ {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAMzG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,WAAW;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB;AAWD,qBAAa,8BAA8B;IAUvC,OAAO,CAAC,OAAO,CAAC;IATlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAEtB;IAED,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;gBAGlC,KAAK,EAAE,KAAK,EACJ,OAAO,CAAC,EAAE,eAAe,YAAA;IAKnC,IAAI,eAAe;;;;MAMlB;WAEY,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAE,mBAAmB;IAUhG,KAAK,CAAC,cAAc,CAAC,EAAE,OAAO;IAM9B,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO;IAsBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAgBN,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAGrD,SAAS,CAAC,aAAa;;;;IASvB,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK;;;;;IASjC,OAAO,CAAC,2BAA2B;YAWrB,6BAA6B;CAS5C"}
@@ -1 +1 @@
1
- {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAMzG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,WAAW;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB;AAWD,qBAAa,8BAA8B;IASvC,OAAO,CAAC,OAAO,CAAC;IARlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAEtB;IACD,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;gBAGlC,KAAK,EAAE,KAAK,EACJ,OAAO,CAAC,EAAE,eAAe,YAAA;IAKnC,IAAI,eAAe;;;;MAMlB;WAEY,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAE,mBAAmB;IAUhG,KAAK,CAAC,cAAc,CAAC,EAAE,OAAO;IAM9B,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO;IAsBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAgBN,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAGrD,SAAS,CAAC,aAAa;;;;IASvB,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK;;;;;IASjC,OAAO,CAAC,2BAA2B;YAWrB,6BAA6B;CAS5C"}
1
+ {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAMzG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,WAAW;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB;AAWD,qBAAa,8BAA8B;IAUvC,OAAO,CAAC,OAAO,CAAC;IATlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAEtB;IAED,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;gBAGlC,KAAK,EAAE,KAAK,EACJ,OAAO,CAAC,EAAE,eAAe,YAAA;IAKnC,IAAI,eAAe;;;;MAMlB;WAEY,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAE,mBAAmB;IAUhG,KAAK,CAAC,cAAc,CAAC,EAAE,OAAO;IAM9B,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO;IAsBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAgBN,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAGrD,SAAS,CAAC,aAAa;;;;IASvB,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK;;;;;IASjC,OAAO,CAAC,2BAA2B;YAWrB,6BAA6B;CAS5C"}
@@ -1 +1 @@
1
- {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAMzG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,WAAW;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB;AAWD,qBAAa,8BAA8B;IASvC,OAAO,CAAC,OAAO,CAAC;IARlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAEtB;IACD,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;gBAGlC,KAAK,EAAE,KAAK,EACJ,OAAO,CAAC,EAAE,eAAe,YAAA;IAKnC,IAAI,eAAe;;;;MAMlB;WAEY,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAE,mBAAmB;IAUhG,KAAK,CAAC,cAAc,CAAC,EAAE,OAAO;IAM9B,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO;IAsBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAgBN,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAGrD,SAAS,CAAC,aAAa;;;;IASvB,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK;;;;;IASjC,OAAO,CAAC,2BAA2B;YAWrB,6BAA6B;CAS5C"}
1
+ {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AACxE,OAAO,EAAE,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAMzG,UAAU,mBAAmB;IAC3B,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,UAAU,WAAW;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB;AAWD,qBAAa,8BAA8B;IAUvC,OAAO,CAAC,OAAO,CAAC;IATlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAEtB;IAED,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;gBAGlC,KAAK,EAAE,KAAK,EACJ,OAAO,CAAC,EAAE,eAAe,YAAA;IAKnC,IAAI,eAAe;;;;MAMlB;WAEY,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,eAAe,EAAE,mBAAmB,CAAC,EAAE,mBAAmB;IAUhG,KAAK,CAAC,cAAc,CAAC,EAAE,OAAO;IAM9B,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO;IAsBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAgBN,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAGrD,SAAS,CAAC,aAAa;;;;IASvB,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK;;;;;IASjC,OAAO,CAAC,2BAA2B;YAWrB,6BAA6B;CAS5C"}
@@ -1,4 +1,4 @@
1
- export * from './ForecastLineChartConfigBuilder.js';
2
- export * from './MockSourcePayloads.js';
3
- export * from './SourcePayloads.js';
1
+ export * from './ForecastLineChartConfigBuilder.ts';
2
+ export * from './MockSourcePayloads.ts';
3
+ export * from './SourcePayloads.ts';
4
4
  //# sourceMappingURL=index.d.ts.map
@@ -1,4 +1,4 @@
1
- export * from './ForecastLineChartConfigBuilder.js';
2
- export * from './MockSourcePayloads.js';
3
- export * from './SourcePayloads.js';
1
+ export * from './ForecastLineChartConfigBuilder.ts';
2
+ export * from './MockSourcePayloads.ts';
3
+ export * from './SourcePayloads.ts';
4
4
  //# sourceMappingURL=index.d.ts.map
@@ -1,4 +1,4 @@
1
- export * from './ForecastLineChartConfigBuilder.js';
2
- export * from './MockSourcePayloads.js';
3
- export * from './SourcePayloads.js';
1
+ export * from './ForecastLineChartConfigBuilder.ts';
2
+ export * from './MockSourcePayloads.ts';
3
+ export * from './SourcePayloads.ts';
4
4
  //# sourceMappingURL=index.d.ts.map
package/package.json CHANGED
@@ -10,20 +10,20 @@
10
10
  "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
11
11
  },
12
12
  "dependencies": {
13
- "@xylabs/react-async-effect": "^3.4.1",
14
- "@xylabs/react-flexbox": "^3.4.1",
15
- "@xyo-network/diviner-forecasting-model": "^2.110.9",
16
- "@xyo-network/payload-model": "^2.110.9",
17
- "@xyo-network/react-payload-plugin": "^2.81.10",
13
+ "@xylabs/react-async-effect": "^3.4.2",
14
+ "@xylabs/react-flexbox": "^3.4.2",
15
+ "@xyo-network/diviner-forecasting-model": "^2.111.3",
16
+ "@xyo-network/payload-model": "^2.111.3",
17
+ "@xyo-network/react-payload-plugin": "^2.82.0",
18
18
  "chart.js": "^4.4.3",
19
19
  "chartjs-adapter-luxon": "^1.3.1",
20
- "luxon": "^3.4.4",
20
+ "luxon": "^3.5.0",
21
21
  "react-chartjs-2": "^5.2.0"
22
22
  },
23
23
  "devDependencies": {
24
- "@storybook/react": "^7.6.20",
25
- "@xylabs/ts-scripts-yarn3": "^3.12.4",
26
- "@xylabs/tsconfig-react": "^3.12.4",
24
+ "@storybook/react": "^8.2.7",
25
+ "@xylabs/ts-scripts-yarn3": "^3.15.16",
26
+ "@xylabs/tsconfig-react": "^3.15.16",
27
27
  "typescript": "^5.5.4"
28
28
  },
29
29
  "peerDependencies": {
@@ -42,7 +42,7 @@
42
42
  "node": {
43
43
  "import": {
44
44
  "types": "./dist/node/index.d.mts",
45
- "default": "./dist/node/index.js"
45
+ "default": "./dist/node/index.mjs"
46
46
  },
47
47
  "require": {
48
48
  "types": "./dist/node/index.d.cts",
@@ -52,19 +52,19 @@
52
52
  "browser": {
53
53
  "import": {
54
54
  "types": "./dist/browser/index.d.mts",
55
- "default": "./dist/browser/index.js"
55
+ "default": "./dist/browser/index.mjs"
56
56
  },
57
57
  "require": {
58
58
  "types": "./dist/browser/index.d.cts",
59
59
  "default": "./dist/browser/index.cjs"
60
60
  }
61
61
  },
62
- "default": "./dist/browser/index.js"
62
+ "default": "./dist/browser/index.mjs"
63
63
  },
64
64
  "./package.json": "./package.json"
65
65
  },
66
66
  "main": "dist/browser/index.cjs",
67
- "module": "dist/browser/index.js",
67
+ "module": "dist/browser/index.mjs",
68
68
  "homepage": "https://xyo.network",
69
69
  "keywords": [
70
70
  "xyo",
@@ -86,6 +86,6 @@
86
86
  },
87
87
  "sideEffects": false,
88
88
  "types": "dist/browser/index.d.ts",
89
- "version": "2.78.10",
89
+ "version": "2.79.0",
90
90
  "type": "module"
91
91
  }
package/src/Plugin.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { createPayloadRenderPlugin, PayloadRenderPlugin } from '@xyo-network/react-payload-plugin'
2
2
 
3
- import { PriceForecastDetailsBox } from './components/index.js'
3
+ import { PriceForecastDetailsBox } from './components/index.ts'
4
4
 
5
5
  export const PriceForecastRenderPlugin: PayloadRenderPlugin = {
6
6
  ...createPayloadRenderPlugin({
@@ -2,16 +2,16 @@ import { Button, ButtonGroup, Typography } from '@mui/material'
2
2
  import { Meta, StoryFn } from '@storybook/react'
3
3
  import { FlexCol } from '@xylabs/react-flexbox'
4
4
  import { ForecastPayloadSchema } from '@xyo-network/diviner-forecasting-model'
5
- import { RefObject, useRef, useState } from 'react'
5
+ import React, { RefObject, useRef, useState } from 'react'
6
6
 
7
- import { MockSourcePayloads } from '../lib/index.js'
8
- import { PriceForecastDetailsBox } from './DetailsBox.js'
7
+ import { MockSourcePayloads } from '../lib/index.ts'
8
+ import { PriceForecastDetailsBox } from './DetailsBox.tsx'
9
9
 
10
10
  const tenMin = 600_000
11
11
 
12
12
  const ForecastingDivinerPayload = {
13
13
  schema: ForecastPayloadSchema,
14
- values: [1, 2, 3, 4, 5, 6, 7, 8].map((item) => ({
14
+ values: [1, 2, 3, 4, 5, 6, 7, 8].map(item => ({
15
15
  error: 0,
16
16
  timestamp: Date.now() + tenMin * item,
17
17
  value: 100 * item,
@@ -52,12 +52,16 @@ const Template: StoryFn<typeof PriceForecastDetailsBox> = (args) => {
52
52
  </FlexCol>
53
53
  <pre>
54
54
  <Typography ref={forecastPayloadRef}>
55
- ForecastPayload: <code>{JSON.stringify(args.payload, null, 2)}</code>
55
+ ForecastPayload:
56
+ {' '}
57
+ <code>{JSON.stringify(args.payload, null, 2)}</code>
56
58
  </Typography>
57
59
  </pre>
58
60
  <pre>
59
61
  <Typography ref={sourcePayloadsRef}>
60
- SourcePayloads: <pre>{JSON.stringify(MockSourcePayloads(), null, 2)}</pre>
62
+ SourcePayloads:
63
+ {' '}
64
+ <pre>{JSON.stringify(MockSourcePayloads(), null, 2)}</pre>
61
65
  </Typography>
62
66
  </pre>
63
67
  </>
@@ -74,5 +78,4 @@ WithData.args = {
74
78
 
75
79
  export { Default, WithData }
76
80
 
77
- // eslint-disable-next-line import/no-default-export
78
81
  export default StorybookEntry
@@ -18,10 +18,10 @@ import {
18
18
  Title,
19
19
  Tooltip,
20
20
  } from 'chart.js'
21
- import { useState } from 'react'
21
+ import React, { useState } from 'react'
22
22
  import { Line } from 'react-chartjs-2'
23
23
 
24
- import { ForecastLineChartConfigBuilder } from '../lib/index.js'
24
+ import { ForecastLineChartConfigBuilder } from '../lib/index.ts'
25
25
 
26
26
  ChartJS.register(CategoryScale, TimeScale, PointElement, LineElement, LinearScale, Title, Tooltip, Legend)
27
27
 
@@ -36,7 +36,7 @@ export const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps> = (
36
36
  const [options, setOptions] = useState<ChartOptions<'line'>>({})
37
37
 
38
38
  useAsyncEffect(
39
- // eslint-disable-next-line react-hooks/exhaustive-deps
39
+
40
40
  async (mounted) => {
41
41
  const { data, options } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, { fetch: true })
42
42
  if (mounted()) {
@@ -49,9 +49,9 @@ export const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps> = (
49
49
 
50
50
  return (
51
51
  <FlexCol {...props} busy={priceForecastPayload === undefined} minHeight="25vh">
52
- {priceForecastPayload ?
53
- <Line options={options} data={data} />
54
- : null}
52
+ {priceForecastPayload
53
+ ? <Line options={options} data={data} />
54
+ : null}
55
55
  </FlexCol>
56
56
  )
57
57
  }
@@ -1 +1 @@
1
- export * from './DetailsBox.js'
1
+ export * from './DetailsBox.tsx'
package/src/index.ts CHANGED
@@ -1,2 +1,2 @@
1
- export * from './components/index.js'
2
- export * from './Plugin.js'
1
+ export * from './components/index.ts'
2
+ export * from './Plugin.ts'
@@ -2,9 +2,9 @@ import { Theme } from '@mui/material'
2
2
  import { ForecastPayload } from '@xyo-network/diviner-forecasting-model'
3
3
  import { ChartData, ChartDataset, ChartOptions, LegendOptions, Point, ScaleChartOptions } from 'chart.js'
4
4
 
5
- import { DataLineStyles } from './DataLineStyles.js'
6
- import { DataPointStyles } from './DataPointStyles.js'
7
- import { SourcePayloads } from './SourcePayloads.js'
5
+ import { DataLineStyles } from './DataLineStyles.ts'
6
+ import { DataPointStyles } from './DataPointStyles.ts'
7
+ import { SourcePayloads } from './SourcePayloads.ts'
8
8
 
9
9
  interface SourcePayloadConfig {
10
10
  fetch: boolean
@@ -30,6 +30,7 @@ export class ForecastLineChartConfigBuilder {
30
30
  data: ChartData<'line'> = {
31
31
  datasets: [],
32
32
  }
33
+
33
34
  options: ChartOptions<'line'> = defaultOptions()
34
35
  themeColors: ThemeColors | undefined
35
36
 
@@ -151,7 +152,7 @@ export class ForecastLineChartConfigBuilder {
151
152
  return {
152
153
  borderDash: [5],
153
154
  borderDashOffset: 0.5,
154
- data: this.forecastPayload.values.map((price) => ({ x: price.timestamp ?? 0, y: price.value })),
155
+ data: this.forecastPayload.values.map(price => ({ x: price.timestamp ?? 0, y: price.value })),
155
156
  label: 'Forecast Price',
156
157
  ...DataPointStyles(this.themeColors?.dataSetColorPrimary),
157
158
  ...DataLineStyles(this.themeColors?.dataSetColorPrimary),
@@ -1,7 +1,7 @@
1
1
  import { Payload } from '@xyo-network/payload-model'
2
2
  import { Point } from 'chart.js'
3
3
 
4
- import { MockSourcePayloads } from './MockSourcePayloads.js'
4
+ import { MockSourcePayloads } from './MockSourcePayloads.ts'
5
5
 
6
6
  export class SourcePayloads {
7
7
  sourcePrices: Point[] = []
package/src/lib/index.ts CHANGED
@@ -1,3 +1,3 @@
1
- export * from './ForecastLineChartConfigBuilder.js'
2
- export * from './MockSourcePayloads.js'
3
- export * from './SourcePayloads.js'
1
+ export * from './ForecastLineChartConfigBuilder.ts'
2
+ export * from './MockSourcePayloads.ts'
3
+ export * from './SourcePayloads.ts'
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/components/DetailsBox.tsx","../../src/lib/DataLineStyles.ts","../../src/lib/DataPointStyles.ts","../../src/lib/MockSourcePayloads.ts","../../src/lib/SourcePayloads.ts","../../src/lib/ForecastLineChartConfigBuilder.ts","../../src/Plugin.ts"],"sourcesContent":["import 'chartjs-adapter-luxon'\n\nimport { useTheme } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport { Payload } from '@xyo-network/payload-model'\nimport {\n CategoryScale,\n Chart as ChartJS,\n ChartData,\n ChartOptions,\n Legend,\n LinearScale,\n LineElement,\n PointElement,\n TimeScale,\n Title,\n Tooltip,\n} from 'chart.js'\nimport { useState } from 'react'\nimport { Line } from 'react-chartjs-2'\n\nimport { ForecastLineChartConfigBuilder } from '../lib/index.js'\n\nChartJS.register(CategoryScale, TimeScale, PointElement, LineElement, LinearScale, Title, Tooltip, Legend)\n\nexport interface PriceForecastDetailsBoxProps extends FlexBoxProps {\n payload?: Payload\n}\n\nexport const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps> = ({ payload, ...props }) => {\n const priceForecastPayload = payload as ForecastPayload | undefined\n const theme = useTheme()\n const [data, setData] = useState<ChartData<'line'>>({ datasets: [] })\n const [options, setOptions] = useState<ChartOptions<'line'>>({})\n\n useAsyncEffect(\n // eslint-disable-next-line react-hooks/exhaustive-deps\n async (mounted) => {\n const { data, options } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, { fetch: true })\n if (mounted()) {\n setData(data)\n setOptions(options)\n }\n },\n [priceForecastPayload, theme],\n )\n\n return (\n <FlexCol {...props} busy={priceForecastPayload === undefined} minHeight=\"25vh\">\n {priceForecastPayload ?\n <Line options={options} data={data} />\n : null}\n </FlexCol>\n )\n}\n","import { alpha } from '@mui/material'\n\nexport const DataLineStyles = (color?: string) => ({\n backgroundColor: color ? alpha(color, 0.5) : undefined,\n borderColor: color,\n})\n","export const DataPointStyles = (pointHoverBackgroundColor?: string) => ({\n pointHitRadius: 20,\n pointHoverBackgroundColor,\n pointHoverRadius: 10,\n pointRadius: 5,\n pointStyle: 'circle',\n})\n","export const MockSourcePayloads = () => {\n const tenMin = 600_000\n return [\n {\n baseFee: 38.901_553_878_25,\n feePerGas: { high: 47.994_586_439_6, low: 39.006_868_093, medium: 39.306_868_093, veryHigh: 44.453_843_805_25 },\n priorityFeePerGas: { high: 1.026_666_666_666_666_6, low: -0.410_000_000_000_000_03, medium: 0.38, veryHigh: 1.390_000_000_000_000_1 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now() - tenMin,\n },\n {\n baseFee: 38.901_553_878_25,\n feePerGas: { high: 47.994_586_439_6, low: 39.006_868_093, medium: 100, veryHigh: 44.453_843_805_25 },\n priorityFeePerGas: { high: 1.026_666_666_666_666_6, low: -0.410_000_000_000_000_03, medium: 0.38, veryHigh: 1.390_000_000_000_000_1 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now(),\n },\n ]\n}\n","import { Payload } from '@xyo-network/payload-model'\nimport { Point } from 'chart.js'\n\nimport { MockSourcePayloads } from './MockSourcePayloads.js'\n\nexport class SourcePayloads {\n sourcePrices: Point[] = []\n\n constructor(public sourcePayloads: Payload[]) {}\n\n get payloads() {\n return this.sourcePayloads\n }\n\n static async build(jsonPath: string) {\n const sourcePayloads = await this.fetchSourcePayloads()\n const instance = new this(sourcePayloads)\n\n const paths = jsonPath.split('.')\n instance.sourcePrices = sourcePayloads.map((payload) => {\n return { x: payload.timestamp, y: instance.jsonPathTraverser(payload, paths) }\n })\n return instance\n }\n\n // TODO - fetch from archivist\n static async fetchSourcePayloads() {\n const payloads = await Promise.resolve(MockSourcePayloads())\n return payloads\n }\n\n jsonPathTraverser(obj: Payload, path: string[]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n let result: any = obj\n for (const key of path) {\n if (key in result) {\n const foundKey = key as keyof typeof result\n result = result[foundKey]\n } else {\n result = undefined\n break\n }\n }\n\n return result\n }\n}\n","import { Theme } from '@mui/material'\nimport { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport { ChartData, ChartDataset, ChartOptions, LegendOptions, Point, ScaleChartOptions } from 'chart.js'\n\nimport { DataLineStyles } from './DataLineStyles.js'\nimport { DataPointStyles } from './DataPointStyles.js'\nimport { SourcePayloads } from './SourcePayloads.js'\n\ninterface SourcePayloadConfig {\n fetch: boolean\n sampleSize?: number\n}\n\ninterface ThemeColors {\n dataSetColorPrimary: string\n dataSetColorSecondary: string\n gridColor: string\n}\n\nconst defaultOptions: () => ChartOptions<'line'> = () => ({\n plugins: {\n legend: {\n position: 'top' as const,\n },\n },\n responsive: true,\n})\n\nexport class ForecastLineChartConfigBuilder {\n data: ChartData<'line'> = {\n datasets: [],\n }\n options: ChartOptions<'line'> = defaultOptions()\n themeColors: ThemeColors | undefined\n\n constructor(\n theme: Theme,\n private payload?: ForecastPayload,\n ) {\n this.themeColors = this.parseTheme(theme)\n }\n\n get forecastPayload() {\n if (this.payload) {\n return this.payload\n } else {\n throw new Error('ForecastPayload was not defined')\n }\n }\n\n static async create(theme: Theme, payload?: ForecastPayload, sourcePayloadConfig?: SourcePayloadConfig) {\n const instance = new ForecastLineChartConfigBuilder(theme, payload)\n\n await instance.build(sourcePayloadConfig?.fetch)\n\n instance.refreshValues()\n\n return instance\n }\n\n async build(includeSources?: boolean) {\n this.buildOptions()\n await this.buildData(includeSources)\n return this\n }\n\n async buildData(includeSources?: boolean) {\n const forecastData = this.generateDataSetForecastData()\n\n const datasets: ChartDataset<'line'>[] = [forecastData]\n\n if (includeSources) {\n // build data from sources in forecastPayload\n const sourceData = await this.generateDataSetSourcePayloads()\n datasets.unshift(sourceData)\n\n // add last source point as first item in prediction to connect the lines\n const lastSourceDataItem = sourceData.data.at(-1) as Point\n forecastData.data.unshift(lastSourceDataItem)\n }\n\n this.data = {\n datasets,\n }\n\n return this\n }\n\n buildOptions() {\n if (this.options.plugins) {\n this.options.plugins.title = this.generateTitle()\n this.options.plugins.legend = this.generateLegend()\n }\n this.options.scales = this.generateScales()\n\n return this\n }\n\n refreshValues() {\n this.data = { ...this.data }\n this.options = { ...this.options }\n }\n\n protected generateLegend() {\n return {\n labels: {\n pointStyle: 'circle',\n usePointStyle: true,\n },\n } as LegendOptions<'line'>\n }\n\n protected generateScales() {\n return {\n x: {\n grid: {\n color: this.themeColors?.gridColor,\n },\n time: {\n unit: 'minute',\n },\n type: 'time',\n },\n y: {\n grid: {\n color: this.themeColors?.gridColor,\n },\n },\n } as unknown as ScaleChartOptions<'line'>['scales']\n }\n\n protected generateTitle() {\n return {\n display: true,\n text: `Gas Price Forecaster (GWEI over time from ${\n this.forecastPayload?.values[0].timestamp ? new Date(this.forecastPayload.values[0].timestamp).toLocaleDateString() : ''\n })`,\n }\n }\n\n protected parseTheme(theme: Theme) {\n const dark = theme.palette.mode === 'dark'\n return {\n dataSetColorPrimary: theme.palette.primary.light,\n dataSetColorSecondary: theme.palette.secondary.light,\n gridColor: dark ? theme.palette.grey[800] : theme.palette.grey[300],\n }\n }\n\n private generateDataSetForecastData(): ChartDataset<'line'> {\n return {\n borderDash: [5],\n borderDashOffset: 0.5,\n data: this.forecastPayload.values.map((price) => ({ x: price.timestamp ?? 0, y: price.value })),\n label: 'Forecast Price',\n ...DataPointStyles(this.themeColors?.dataSetColorPrimary),\n ...DataLineStyles(this.themeColors?.dataSetColorPrimary),\n }\n }\n\n private async generateDataSetSourcePayloads(): Promise<ChartDataset<'line'>> {\n const { sourcePrices } = await SourcePayloads.build('feePerGas.medium')\n return {\n data: sourcePrices,\n label: 'Source Prices',\n ...DataLineStyles(this.themeColors?.dataSetColorSecondary),\n ...DataPointStyles(this.themeColors?.dataSetColorSecondary),\n }\n }\n}\n","import { createPayloadRenderPlugin, PayloadRenderPlugin } from '@xyo-network/react-payload-plugin'\n\nimport { PriceForecastDetailsBox } from './components/index.js'\n\nexport const PriceForecastRenderPlugin: PayloadRenderPlugin = {\n ...createPayloadRenderPlugin({\n canRender: () => true,\n components: {\n box: {\n detailsBox: PriceForecastDetailsBox,\n },\n },\n name: 'PriceForecast',\n }),\n}\n"],"mappings":"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","names":["data","options"]}