@xyo-network/react-price-forecast-plugin 7.0.0 → 7.0.2

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.
@@ -1,8 +1,8 @@
1
1
  import type { Meta } from '@storybook/react-vite';
2
2
  import { PriceForecastDetailsBox } from './DetailsBox.tsx';
3
3
  declare const StorybookEntry: Meta<typeof PriceForecastDetailsBox>;
4
- declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./DetailsBox.tsx").PriceForecastDetailsBoxProps>;
5
- declare const WithData: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./DetailsBox.tsx").PriceForecastDetailsBoxProps>;
4
+ declare const Default: import(".store/storybook-virtual-fa39dd25b7/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./DetailsBox.tsx").PriceForecastDetailsBoxProps>;
5
+ declare const WithData: import(".store/storybook-virtual-fa39dd25b7/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./DetailsBox.tsx").PriceForecastDetailsBoxProps>;
6
6
  export { Default, WithData };
7
7
  export default StorybookEntry;
8
8
  //# sourceMappingURL=DetailsBox.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DetailsBox.stories.d.ts","sourceRoot":"","sources":["../../../src/components/DetailsBox.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAO1D,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAA;AAa1D,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,uBAAuB,CAAC,CAAA;AAyCzC,QAAA,MAAM,OAAO,2JAAoB,CAAA;AAGjC,QAAA,MAAM,QAAQ,2JAAoB,CAAA;AAGlC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAA;AAE5B,eAAe,cAAc,CAAA"}
1
+ {"version":3,"file":"DetailsBox.stories.d.ts","sourceRoot":"","sources":["../../../src/components/DetailsBox.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAO1D,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAA;AAa1D,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,uBAAuB,CAAC,CAAA;AAyCzC,QAAA,MAAM,OAAO,6LAAoB,CAAA;AAGjC,QAAA,MAAM,QAAQ,6LAAoB,CAAA;AAGlC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAA;AAE5B,eAAe,cAAc,CAAA"}
@@ -1,13 +1,20 @@
1
- var __defProp = Object.defineProperty;
2
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
-
4
1
  // src/components/DetailsBox.tsx
5
2
  import "chartjs-adapter-luxon";
6
3
  import { useTheme } from "@mui/material";
7
4
  import { useAsyncEffect } from "@xylabs/react-async-effect";
8
5
  import { FlexCol } from "@xylabs/react-flexbox";
9
- import { CategoryScale, Chart as ChartJS, Legend, LinearScale, LineElement, PointElement, TimeScale, Title, Tooltip } from "chart.js";
10
- import React, { useState } from "react";
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";
11
18
  import { Line } from "react-chartjs-2";
12
19
 
13
20
  // src/lib/ForecastLineChartConfigBuilder.ts
@@ -15,22 +22,22 @@ import { useIsDark } from "@xylabs/react-theme";
15
22
 
16
23
  // src/lib/DataLineStyles.ts
17
24
  import { alphaCss } from "@xylabs/react-theme";
18
- var DataLineStyles = /* @__PURE__ */ __name((color) => ({
25
+ var DataLineStyles = (color) => ({
19
26
  backgroundColor: color ? alphaCss(color, 0.5) : void 0,
20
27
  borderColor: color
21
- }), "DataLineStyles");
28
+ });
22
29
 
23
30
  // src/lib/DataPointStyles.ts
24
- var DataPointStyles = /* @__PURE__ */ __name((pointHoverBackgroundColor) => ({
31
+ var DataPointStyles = (pointHoverBackgroundColor) => ({
25
32
  pointHitRadius: 20,
26
33
  pointHoverBackgroundColor,
27
34
  pointHoverRadius: 10,
28
35
  pointRadius: 5,
29
36
  pointStyle: "circle"
30
- }), "DataPointStyles");
37
+ });
31
38
 
32
39
  // src/lib/MockSourcePayloads.ts
33
- var MockSourcePayloads = /* @__PURE__ */ __name(() => {
40
+ var MockSourcePayloads = () => {
34
41
  const tenMin = 6e5;
35
42
  return [
36
43
  {
@@ -68,13 +75,10 @@ var MockSourcePayloads = /* @__PURE__ */ __name(() => {
68
75
  timestamp: Date.now()
69
76
  }
70
77
  ];
71
- }, "MockSourcePayloads");
78
+ };
72
79
 
73
80
  // src/lib/SourcePayloads.ts
74
81
  var SourcePayloads = class {
75
- static {
76
- __name(this, "SourcePayloads");
77
- }
78
82
  sourcePayloads;
79
83
  sourcePrices = [];
80
84
  constructor(sourcePayloads) {
@@ -88,10 +92,7 @@ var SourcePayloads = class {
88
92
  const instance = new this(sourcePayloads);
89
93
  const paths = jsonPath.split(".");
90
94
  instance.sourcePrices = sourcePayloads.map((payload) => {
91
- return {
92
- x: payload.timestamp,
93
- y: instance.jsonPathTraverser(payload, paths)
94
- };
95
+ return { x: payload.timestamp, y: instance.jsonPathTraverser(payload, paths) };
95
96
  });
96
97
  return instance;
97
98
  }
@@ -116,24 +117,15 @@ var SourcePayloads = class {
116
117
  };
117
118
 
118
119
  // src/lib/ForecastLineChartConfigBuilder.ts
119
- var defaultOptions = /* @__PURE__ */ __name(() => ({
120
- plugins: {
121
- legend: {
122
- position: "top"
123
- }
124
- },
120
+ var defaultOptions = () => ({
121
+ plugins: { legend: { position: "top" } },
125
122
  responsive: true
126
- }), "defaultOptions");
123
+ });
127
124
  var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
128
- static {
129
- __name(this, "ForecastLineChartConfigBuilder");
130
- }
131
- payload;
132
- data = {
133
- datasets: []
134
- };
125
+ data = { datasets: [] };
135
126
  options = defaultOptions();
136
127
  themeColors;
128
+ payload;
137
129
  constructor(theme, payload) {
138
130
  this.payload = payload;
139
131
  this.themeColors = this.parseTheme(theme);
@@ -158,18 +150,14 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
158
150
  }
159
151
  async buildData(includeSources) {
160
152
  const forecastData = this.generateDataSetForecastData();
161
- const datasets = [
162
- forecastData
163
- ];
153
+ const datasets = [forecastData];
164
154
  if (includeSources) {
165
155
  const sourceData = await this.generateDataSetSourcePayloads();
166
156
  datasets.unshift(sourceData);
167
157
  const lastSourceDataItem = sourceData.data.at(-1);
168
158
  forecastData.data.unshift(lastSourceDataItem);
169
159
  }
170
- this.data = {
171
- datasets
172
- };
160
+ this.data = { datasets };
173
161
  return this;
174
162
  }
175
163
  buildOptions() {
@@ -181,12 +169,8 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
181
169
  return this;
182
170
  }
183
171
  refreshValues() {
184
- this.data = {
185
- ...this.data
186
- };
187
- this.options = {
188
- ...this.options
189
- };
172
+ this.data = { ...this.data };
173
+ this.options = { ...this.options };
190
174
  }
191
175
  generateLegend() {
192
176
  return {
@@ -199,19 +183,11 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
199
183
  generateScales() {
200
184
  return {
201
185
  x: {
202
- grid: {
203
- color: this.themeColors?.gridColor
204
- },
205
- time: {
206
- unit: "minute"
207
- },
186
+ grid: { color: this.themeColors?.gridColor },
187
+ time: { unit: "minute" },
208
188
  type: "time"
209
189
  },
210
- y: {
211
- grid: {
212
- color: this.themeColors?.gridColor
213
- }
214
- }
190
+ y: { grid: { color: this.themeColors?.gridColor } }
215
191
  };
216
192
  }
217
193
  generateTitle() {
@@ -230,14 +206,9 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
230
206
  }
231
207
  generateDataSetForecastData() {
232
208
  return {
233
- borderDash: [
234
- 5
235
- ],
209
+ borderDash: [5],
236
210
  borderDashOffset: 0.5,
237
- data: this.forecastPayload.values.map((price) => ({
238
- x: price.timestamp ?? 0,
239
- y: price.value
240
- })),
211
+ data: this.forecastPayload.values.map((price) => ({ x: price.timestamp ?? 0, y: price.value })),
241
212
  label: "Forecast Price",
242
213
  ...DataPointStyles(this.themeColors?.dataSetColorPrimary),
243
214
  ...DataLineStyles(this.themeColors?.dataSetColorPrimary)
@@ -255,46 +226,32 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
255
226
  };
256
227
 
257
228
  // src/components/DetailsBox.tsx
229
+ import { jsx } from "react/jsx-runtime";
258
230
  ChartJS.register(CategoryScale, TimeScale, PointElement, LineElement, LinearScale, Title, Tooltip, Legend);
259
- var PriceForecastDetailsBox = /* @__PURE__ */ __name(({ payload, ...props }) => {
231
+ var PriceForecastDetailsBox = ({ payload, ...props }) => {
260
232
  const priceForecastPayload = payload;
261
233
  const theme = useTheme();
262
- const [data, setData] = useState({
263
- datasets: []
264
- });
234
+ const [data, setData] = useState({ datasets: [] });
265
235
  const [options, setOptions] = useState({});
266
- useAsyncEffect(async (mounted) => {
267
- const { data: data2, options: options2 } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, {
268
- fetch: true
269
- });
270
- if (mounted()) {
271
- setData(data2);
272
- setOptions(options2);
273
- }
274
- }, [
275
- priceForecastPayload,
276
- theme
277
- ]);
278
- return /* @__PURE__ */ React.createElement(FlexCol, {
279
- ...props,
280
- busy: priceForecastPayload === void 0,
281
- minHeight: "25vh"
282
- }, priceForecastPayload ? /* @__PURE__ */ React.createElement(Line, {
283
- options,
284
- data
285
- }) : null);
286
- }, "PriceForecastDetailsBox");
236
+ useAsyncEffect(
237
+ async (mounted) => {
238
+ const { data: data2, options: options2 } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, { fetch: true });
239
+ if (mounted()) {
240
+ setData(data2);
241
+ setOptions(options2);
242
+ }
243
+ },
244
+ [priceForecastPayload, theme]
245
+ );
246
+ return /* @__PURE__ */ jsx(FlexCol, { ...props, busy: priceForecastPayload === void 0, minHeight: "25vh", children: priceForecastPayload ? /* @__PURE__ */ jsx(Line, { options, data }) : null });
247
+ };
287
248
 
288
249
  // src/Plugin.ts
289
250
  import { createPayloadRenderPlugin } from "@xyo-network/react-payload-plugin";
290
251
  var PriceForecastRenderPlugin = {
291
252
  ...createPayloadRenderPlugin({
292
- canRender: /* @__PURE__ */ __name(() => true, "canRender"),
293
- components: {
294
- box: {
295
- detailsBox: PriceForecastDetailsBox
296
- }
297
- },
253
+ canRender: () => true,
254
+ components: { box: { detailsBox: PriceForecastDetailsBox } },
298
255
  name: "PriceForecast"
299
256
  })
300
257
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/DetailsBox.tsx","../../src/lib/ForecastLineChartConfigBuilder.ts","../../src/lib/DataLineStyles.ts","../../src/lib/DataPointStyles.ts","../../src/lib/MockSourcePayloads.ts","../../src/lib/SourcePayloads.ts","../../src/Plugin.ts"],"sourcesContent":["import 'chartjs-adapter-luxon'\n\nimport { useTheme } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport type { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport type { Payload } from '@xyo-network/payload-model'\nimport type {\n ChartData,\n ChartOptions,\n} from 'chart.js'\nimport {\n CategoryScale,\n Chart as ChartJS,\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 type { Theme } from '@mui/material'\nimport { useIsDark } from '@xylabs/react-theme'\nimport type { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport type {\n ChartData, ChartDataset, ChartOptions, LegendOptions, Point, ScaleChartOptions,\n} 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: { legend: { position: 'top' as const } },\n responsive: true,\n})\n\nexport class ForecastLineChartConfigBuilder {\n data: ChartData<'line'> = { 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 = { datasets }\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: { color: this.themeColors?.gridColor },\n time: { unit: 'minute' },\n type: 'time',\n },\n y: { grid: { color: this.themeColors?.gridColor } },\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 = useIsDark()\n return {\n dataSetColorPrimary: theme.vars.palette.primary.light,\n dataSetColorSecondary: theme.vars.palette.secondary.light,\n gridColor: dark ? theme.vars.palette.grey[800] : theme.vars.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 { alphaCss } from '@xylabs/react-theme'\n\nexport const DataLineStyles = (color?: string) => ({\n backgroundColor: color ? alphaCss(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: {\n high: 47.994_586_439_6, low: 39.006_868_093, medium: 39.306_868_093, veryHigh: 44.453_843_805_25,\n },\n priorityFeePerGas: {\n 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 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now() - tenMin,\n },\n {\n baseFee: 38.901_553_878_25,\n feePerGas: {\n high: 47.994_586_439_6, low: 39.006_868_093, medium: 100, veryHigh: 44.453_843_805_25,\n },\n priorityFeePerGas: {\n 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 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now(),\n },\n ]\n}\n","import type { Payload } from '@xyo-network/payload-model'\nimport type { 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 type { PayloadRenderPlugin } from '@xyo-network/react-payload-plugin'\nimport { createPayloadRenderPlugin } 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: { box: { detailsBox: PriceForecastDetailsBox } },\n name: 'PriceForecast',\n }),\n}\n"],"mappings":"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","names":["useTheme","useAsyncEffect","FlexCol","CategoryScale","Chart","ChartJS","Legend","LinearScale","LineElement","PointElement","TimeScale","Title","Tooltip","React","useState","Line","useIsDark","alphaCss","DataLineStyles","color","backgroundColor","alphaCss","undefined","borderColor","DataPointStyles","pointHoverBackgroundColor","pointHitRadius","pointHoverRadius","pointRadius","pointStyle","MockSourcePayloads","tenMin","baseFee","feePerGas","high","low","medium","veryHigh","priorityFeePerGas","schema","timestamp","Date","now","SourcePayloads","sourcePrices","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","datasets","options","themeColors","theme","payload","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","useIsDark","dataSetColorPrimary","vars","palette","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
+ {"version":3,"sources":["../../src/components/DetailsBox.tsx","../../src/lib/ForecastLineChartConfigBuilder.ts","../../src/lib/DataLineStyles.ts","../../src/lib/DataPointStyles.ts","../../src/lib/MockSourcePayloads.ts","../../src/lib/SourcePayloads.ts","../../src/Plugin.ts"],"sourcesContent":["import 'chartjs-adapter-luxon'\n\nimport { useTheme } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport type { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport type { Payload } from '@xyo-network/payload-model'\nimport type {\n ChartData,\n ChartOptions,\n} from 'chart.js'\nimport {\n CategoryScale,\n Chart as ChartJS,\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 type { Theme } from '@mui/material'\nimport { useIsDark } from '@xylabs/react-theme'\nimport type { ForecastPayload } from '@xyo-network/diviner-forecasting-model'\nimport type {\n ChartData, ChartDataset, ChartOptions, LegendOptions, Point, ScaleChartOptions,\n} 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: { legend: { position: 'top' as const } },\n responsive: true,\n})\n\nexport class ForecastLineChartConfigBuilder {\n data: ChartData<'line'> = { datasets: [] }\n\n options: ChartOptions<'line'> = defaultOptions()\n themeColors: ThemeColors | undefined\n\n private payload?: ForecastPayload\n\n constructor(\n theme: Theme,\n payload?: ForecastPayload,\n ) {\n this.payload = payload\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 = { datasets }\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: { color: this.themeColors?.gridColor },\n time: { unit: 'minute' },\n type: 'time',\n },\n y: { grid: { color: this.themeColors?.gridColor } },\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 = useIsDark()\n return {\n dataSetColorPrimary: theme.vars.palette.primary.light,\n dataSetColorSecondary: theme.vars.palette.secondary.light,\n gridColor: dark ? theme.vars.palette.grey[800] : theme.vars.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 { alphaCss } from '@xylabs/react-theme'\n\nexport const DataLineStyles = (color?: string) => ({\n backgroundColor: color ? alphaCss(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: {\n high: 47.994_586_439_6, low: 39.006_868_093, medium: 39.306_868_093, veryHigh: 44.453_843_805_25,\n },\n priorityFeePerGas: {\n 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 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now() - tenMin,\n },\n {\n baseFee: 38.901_553_878_25,\n feePerGas: {\n high: 47.994_586_439_6, low: 39.006_868_093, medium: 100, veryHigh: 44.453_843_805_25,\n },\n priorityFeePerGas: {\n 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 },\n schema: 'network.xyo.blockchain.ethereum.gas',\n timestamp: Date.now(),\n },\n ]\n}\n","import type { Payload } from '@xyo-network/payload-model'\nimport type { Point } from 'chart.js'\n\nimport { MockSourcePayloads } from './MockSourcePayloads.ts'\n\nexport class SourcePayloads {\n sourcePayloads: Payload[]\n sourcePrices: Point[] = []\n\n constructor(sourcePayloads: Payload[]) {\n this.sourcePayloads = sourcePayloads\n }\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 type { PayloadRenderPlugin } from '@xyo-network/react-payload-plugin'\nimport { createPayloadRenderPlugin } 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: { box: { detailsBox: PriceForecastDetailsBox } },\n name: 'PriceForecast',\n }),\n}\n"],"mappings":"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","names":["data","options"]}
@@ -11,11 +11,11 @@ interface ThemeColors {
11
11
  gridColor: string;
12
12
  }
13
13
  export declare class ForecastLineChartConfigBuilder {
14
- private payload?;
15
14
  data: ChartData<'line'>;
16
15
  options: ChartOptions<'line'>;
17
16
  themeColors: ThemeColors | undefined;
18
- constructor(theme: Theme, payload?: ForecastPayload | undefined);
17
+ private payload?;
18
+ constructor(theme: Theme, payload?: ForecastPayload);
19
19
  get forecastPayload(): ForecastPayload;
20
20
  static create(theme: Theme, payload?: ForecastPayload, sourcePayloadConfig?: SourcePayloadConfig): Promise<ForecastLineChartConfigBuilder>;
21
21
  build(includeSources?: boolean): Promise<this>;
@@ -1 +1 @@
1
- {"version":3,"file":"ForecastLineChartConfigBuilder.d.ts","sourceRoot":"","sources":["../../../src/lib/ForecastLineChartConfigBuilder.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAE1C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EACV,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAC/E,MAAM,UAAU,CAAA;AAMjB,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;AAOD,qBAAa,8BAA8B;IAQvC,OAAO,CAAC,OAAO,CAAC;IAPlB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAmB;IAE1C,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,oBAMlB;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;IAoBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAQN,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,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAE1C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EACV,SAAS,EAAgB,YAAY,EAAE,aAAa,EAAS,iBAAiB,EAC/E,MAAM,UAAU,CAAA;AAMjB,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;AAOD,qBAAa,8BAA8B;IACzC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAmB;IAE1C,OAAO,EAAE,YAAY,CAAC,MAAM,CAAC,CAAmB;IAChD,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;IAEpC,OAAO,CAAC,OAAO,CAAC,CAAiB;gBAG/B,KAAK,EAAE,KAAK,EACZ,OAAO,CAAC,EAAE,eAAe;IAM3B,IAAI,eAAe,oBAMlB;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;IAoBxC,YAAY;IAUZ,aAAa;IAKb,SAAS,CAAC,cAAc,IAMjB,aAAa,CAAC,MAAM,CAAC;IAG5B,SAAS,CAAC,cAAc,IAQN,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":"SourcePayloads.d.ts","sourceRoot":"","sources":["../../../src/lib/SourcePayloads.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AACzD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAIrC,qBAAa,cAAc;IAGN,cAAc,EAAE,OAAO,EAAE;IAF5C,YAAY,EAAE,KAAK,EAAE,CAAK;gBAEP,cAAc,EAAE,OAAO,EAAE;IAE5C,IAAI,QAAQ,cAEX;WAEY,KAAK,CAAC,QAAQ,EAAE,MAAM;WAYtB,mBAAmB;;;;;;;;;;;;;;;;;IAKhC,iBAAiB,CAAC,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE;CAe/C"}
1
+ {"version":3,"file":"SourcePayloads.d.ts","sourceRoot":"","sources":["../../../src/lib/SourcePayloads.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AACzD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAIrC,qBAAa,cAAc;IACzB,cAAc,EAAE,OAAO,EAAE,CAAA;IACzB,YAAY,EAAE,KAAK,EAAE,CAAK;gBAEd,cAAc,EAAE,OAAO,EAAE;IAIrC,IAAI,QAAQ,cAEX;WAEY,KAAK,CAAC,QAAQ,EAAE,MAAM;WAYtB,mBAAmB;;;;;;;;;;;;;;;;;IAKhC,iBAAiB,CAAC,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE;CAe/C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xyo-network/react-price-forecast-plugin",
3
- "version": "7.0.0",
3
+ "version": "7.0.2",
4
4
  "description": "Common React library for all XYO projects that use React",
5
5
  "keywords": [
6
6
  "xyo",
@@ -43,36 +43,39 @@
43
43
  "src"
44
44
  ],
45
45
  "dependencies": {
46
- "@xylabs/react-async-effect": "^7.0.0",
47
- "@xylabs/react-flexbox": "^7.0.0",
48
- "@xylabs/react-theme": "^7.0.0",
49
- "@xyo-network/diviner-forecasting-model": "^5.0.0",
50
- "@xyo-network/payload-model": "^5.0.0",
51
- "@xyo-network/react-payload-plugin": "^7.0.0",
52
- "chart.js": "^4.5.0",
53
- "chartjs-adapter-luxon": "^1.3.1",
54
- "react-chartjs-2": "^5.3.0"
46
+ "@xylabs/react-async-effect": "~7.0.4",
47
+ "@xylabs/react-flexbox": "~7.0.4",
48
+ "@xylabs/react-theme": "~7.0.4",
49
+ "@xyo-network/diviner-forecasting-model": "~5.0.7",
50
+ "@xyo-network/payload-model": "~5.0.7",
51
+ "@xyo-network/react-payload-plugin": "^7.0.2",
52
+ "chart.js": "~4.5.0",
53
+ "chartjs-adapter-luxon": "~1.3.1",
54
+ "react-chartjs-2": "~5.3.0"
55
55
  },
56
56
  "devDependencies": {
57
- "@emotion/react": "^11.14.0",
58
- "@emotion/styled": "^11.14.1",
59
- "@mui/icons-material": "^7.2.0",
60
- "@mui/material": "^7.2.0",
61
- "@storybook/react-vite": "^9.0.18",
62
- "@types/react": "^19.1.9",
63
- "@xylabs/ts-scripts-yarn3": "^7.0.2",
64
- "@xylabs/tsconfig-react": "^7.0.2",
65
- "react": "^19.1.1",
66
- "react-dom": "^19.1.1",
67
- "storybook": "^9.0.18",
68
- "typescript": "^5.8.3"
57
+ "@emotion/react": "~11.14.0",
58
+ "@emotion/styled": "~11.14.1",
59
+ "@mui/icons-material": "~7.3.1",
60
+ "@mui/material": "~7.3.1",
61
+ "@storybook/react-vite": "~9.1.3",
62
+ "@types/react": "~19.1.11",
63
+ "@xylabs/ts-scripts-yarn3": "~7.1.7",
64
+ "@xylabs/tsconfig": "~7.1.7",
65
+ "@xylabs/tsconfig-dom": "~7.1.7",
66
+ "@xylabs/tsconfig-react": "~7.1.7",
67
+ "react": "~19.1.1",
68
+ "react-dom": "~19.1.1",
69
+ "storybook": "~9.1.3",
70
+ "typescript": "~5.9.2",
71
+ "vite": "~7.1.3"
69
72
  },
70
73
  "peerDependencies": {
71
74
  "@mui/icons-material": ">=6 <8",
72
75
  "@mui/material": ">=6 <8",
73
- "luxon": "^3.7.1",
74
- "react": "^19",
75
- "react-dom": "^19"
76
+ "luxon": "~3.7.1",
77
+ "react": "~19",
78
+ "react-dom": "~19"
76
79
  },
77
80
  "publishConfig": {
78
81
  "access": "public"
@@ -31,10 +31,13 @@ export class ForecastLineChartConfigBuilder {
31
31
  options: ChartOptions<'line'> = defaultOptions()
32
32
  themeColors: ThemeColors | undefined
33
33
 
34
+ private payload?: ForecastPayload
35
+
34
36
  constructor(
35
37
  theme: Theme,
36
- private payload?: ForecastPayload,
38
+ payload?: ForecastPayload,
37
39
  ) {
40
+ this.payload = payload
38
41
  this.themeColors = this.parseTheme(theme)
39
42
  }
40
43
 
@@ -4,9 +4,12 @@ import type { Point } from 'chart.js'
4
4
  import { MockSourcePayloads } from './MockSourcePayloads.ts'
5
5
 
6
6
  export class SourcePayloads {
7
+ sourcePayloads: Payload[]
7
8
  sourcePrices: Point[] = []
8
9
 
9
- constructor(public sourcePayloads: Payload[]) {}
10
+ constructor(sourcePayloads: Payload[]) {
11
+ this.sourcePayloads = sourcePayloads
12
+ }
10
13
 
11
14
  get payloads() {
12
15
  return this.sourcePayloads