@xyo-network/react-price-forecast-plugin 2.78.10 → 2.80.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 (203) hide show
  1. package/dist/browser/index.d.ts +13 -3
  2. package/dist/browser/{index.js → index.mjs} +101 -54
  3. package/dist/browser/index.mjs.map +1 -0
  4. package/package.json +16 -32
  5. package/src/Plugin.ts +1 -1
  6. package/src/components/DetailsBox.stories.tsx +10 -7
  7. package/src/components/DetailsBox.tsx +6 -6
  8. package/src/components/index.ts +1 -1
  9. package/src/index.ts +2 -2
  10. package/src/lib/ForecastLineChartConfigBuilder.ts +5 -4
  11. package/src/lib/SourcePayloads.ts +1 -1
  12. package/src/lib/index.ts +3 -3
  13. package/xy.config.ts +12 -0
  14. package/dist/browser/Plugin.d.cts +0 -3
  15. package/dist/browser/Plugin.d.cts.map +0 -1
  16. package/dist/browser/Plugin.d.mts +0 -3
  17. package/dist/browser/Plugin.d.mts.map +0 -1
  18. package/dist/browser/Plugin.d.ts +0 -3
  19. package/dist/browser/Plugin.d.ts.map +0 -1
  20. package/dist/browser/components/DetailsBox.d.cts +0 -8
  21. package/dist/browser/components/DetailsBox.d.cts.map +0 -1
  22. package/dist/browser/components/DetailsBox.d.mts +0 -8
  23. package/dist/browser/components/DetailsBox.d.mts.map +0 -1
  24. package/dist/browser/components/DetailsBox.d.ts +0 -8
  25. package/dist/browser/components/DetailsBox.d.ts.map +0 -1
  26. package/dist/browser/components/index.d.cts +0 -2
  27. package/dist/browser/components/index.d.cts.map +0 -1
  28. package/dist/browser/components/index.d.mts +0 -2
  29. package/dist/browser/components/index.d.mts.map +0 -1
  30. package/dist/browser/components/index.d.ts +0 -2
  31. package/dist/browser/components/index.d.ts.map +0 -1
  32. package/dist/browser/index.cjs +0 -271
  33. package/dist/browser/index.cjs.map +0 -1
  34. package/dist/browser/index.d.cts +0 -3
  35. package/dist/browser/index.d.cts.map +0 -1
  36. package/dist/browser/index.d.mts +0 -3
  37. package/dist/browser/index.d.mts.map +0 -1
  38. package/dist/browser/index.d.ts.map +0 -1
  39. package/dist/browser/index.js.map +0 -1
  40. package/dist/browser/lib/DataLineStyles.d.cts +0 -5
  41. package/dist/browser/lib/DataLineStyles.d.cts.map +0 -1
  42. package/dist/browser/lib/DataLineStyles.d.mts +0 -5
  43. package/dist/browser/lib/DataLineStyles.d.mts.map +0 -1
  44. package/dist/browser/lib/DataLineStyles.d.ts +0 -5
  45. package/dist/browser/lib/DataLineStyles.d.ts.map +0 -1
  46. package/dist/browser/lib/DataPointStyles.d.cts +0 -8
  47. package/dist/browser/lib/DataPointStyles.d.cts.map +0 -1
  48. package/dist/browser/lib/DataPointStyles.d.mts +0 -8
  49. package/dist/browser/lib/DataPointStyles.d.mts.map +0 -1
  50. package/dist/browser/lib/DataPointStyles.d.ts +0 -8
  51. package/dist/browser/lib/DataPointStyles.d.ts.map +0 -1
  52. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.cts +0 -44
  53. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.cts.map +0 -1
  54. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.mts +0 -44
  55. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.mts.map +0 -1
  56. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.ts +0 -44
  57. package/dist/browser/lib/ForecastLineChartConfigBuilder.d.ts.map +0 -1
  58. package/dist/browser/lib/MockSourcePayloads.d.cts +0 -18
  59. package/dist/browser/lib/MockSourcePayloads.d.cts.map +0 -1
  60. package/dist/browser/lib/MockSourcePayloads.d.mts +0 -18
  61. package/dist/browser/lib/MockSourcePayloads.d.mts.map +0 -1
  62. package/dist/browser/lib/MockSourcePayloads.d.ts +0 -18
  63. package/dist/browser/lib/MockSourcePayloads.d.ts.map +0 -1
  64. package/dist/browser/lib/SourcePayloads.d.cts +0 -30
  65. package/dist/browser/lib/SourcePayloads.d.cts.map +0 -1
  66. package/dist/browser/lib/SourcePayloads.d.mts +0 -30
  67. package/dist/browser/lib/SourcePayloads.d.mts.map +0 -1
  68. package/dist/browser/lib/SourcePayloads.d.ts +0 -30
  69. package/dist/browser/lib/SourcePayloads.d.ts.map +0 -1
  70. package/dist/browser/lib/index.d.cts +0 -4
  71. package/dist/browser/lib/index.d.cts.map +0 -1
  72. package/dist/browser/lib/index.d.mts +0 -4
  73. package/dist/browser/lib/index.d.mts.map +0 -1
  74. package/dist/browser/lib/index.d.ts +0 -4
  75. package/dist/browser/lib/index.d.ts.map +0 -1
  76. package/dist/neutral/Plugin.d.cts +0 -3
  77. package/dist/neutral/Plugin.d.cts.map +0 -1
  78. package/dist/neutral/Plugin.d.mts +0 -3
  79. package/dist/neutral/Plugin.d.mts.map +0 -1
  80. package/dist/neutral/Plugin.d.ts +0 -3
  81. package/dist/neutral/Plugin.d.ts.map +0 -1
  82. package/dist/neutral/components/DetailsBox.d.cts +0 -8
  83. package/dist/neutral/components/DetailsBox.d.cts.map +0 -1
  84. package/dist/neutral/components/DetailsBox.d.mts +0 -8
  85. package/dist/neutral/components/DetailsBox.d.mts.map +0 -1
  86. package/dist/neutral/components/DetailsBox.d.ts +0 -8
  87. package/dist/neutral/components/DetailsBox.d.ts.map +0 -1
  88. package/dist/neutral/components/index.d.cts +0 -2
  89. package/dist/neutral/components/index.d.cts.map +0 -1
  90. package/dist/neutral/components/index.d.mts +0 -2
  91. package/dist/neutral/components/index.d.mts.map +0 -1
  92. package/dist/neutral/components/index.d.ts +0 -2
  93. package/dist/neutral/components/index.d.ts.map +0 -1
  94. package/dist/neutral/index.cjs +0 -271
  95. package/dist/neutral/index.cjs.map +0 -1
  96. package/dist/neutral/index.d.cts +0 -3
  97. package/dist/neutral/index.d.cts.map +0 -1
  98. package/dist/neutral/index.d.mts +0 -3
  99. package/dist/neutral/index.d.mts.map +0 -1
  100. package/dist/neutral/index.d.ts +0 -3
  101. package/dist/neutral/index.d.ts.map +0 -1
  102. package/dist/neutral/index.js +0 -258
  103. package/dist/neutral/index.js.map +0 -1
  104. package/dist/neutral/lib/DataLineStyles.d.cts +0 -5
  105. package/dist/neutral/lib/DataLineStyles.d.cts.map +0 -1
  106. package/dist/neutral/lib/DataLineStyles.d.mts +0 -5
  107. package/dist/neutral/lib/DataLineStyles.d.mts.map +0 -1
  108. package/dist/neutral/lib/DataLineStyles.d.ts +0 -5
  109. package/dist/neutral/lib/DataLineStyles.d.ts.map +0 -1
  110. package/dist/neutral/lib/DataPointStyles.d.cts +0 -8
  111. package/dist/neutral/lib/DataPointStyles.d.cts.map +0 -1
  112. package/dist/neutral/lib/DataPointStyles.d.mts +0 -8
  113. package/dist/neutral/lib/DataPointStyles.d.mts.map +0 -1
  114. package/dist/neutral/lib/DataPointStyles.d.ts +0 -8
  115. package/dist/neutral/lib/DataPointStyles.d.ts.map +0 -1
  116. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.cts +0 -44
  117. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.cts.map +0 -1
  118. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.mts +0 -44
  119. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.mts.map +0 -1
  120. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.ts +0 -44
  121. package/dist/neutral/lib/ForecastLineChartConfigBuilder.d.ts.map +0 -1
  122. package/dist/neutral/lib/MockSourcePayloads.d.cts +0 -18
  123. package/dist/neutral/lib/MockSourcePayloads.d.cts.map +0 -1
  124. package/dist/neutral/lib/MockSourcePayloads.d.mts +0 -18
  125. package/dist/neutral/lib/MockSourcePayloads.d.mts.map +0 -1
  126. package/dist/neutral/lib/MockSourcePayloads.d.ts +0 -18
  127. package/dist/neutral/lib/MockSourcePayloads.d.ts.map +0 -1
  128. package/dist/neutral/lib/SourcePayloads.d.cts +0 -30
  129. package/dist/neutral/lib/SourcePayloads.d.cts.map +0 -1
  130. package/dist/neutral/lib/SourcePayloads.d.mts +0 -30
  131. package/dist/neutral/lib/SourcePayloads.d.mts.map +0 -1
  132. package/dist/neutral/lib/SourcePayloads.d.ts +0 -30
  133. package/dist/neutral/lib/SourcePayloads.d.ts.map +0 -1
  134. package/dist/neutral/lib/index.d.cts +0 -4
  135. package/dist/neutral/lib/index.d.cts.map +0 -1
  136. package/dist/neutral/lib/index.d.mts +0 -4
  137. package/dist/neutral/lib/index.d.mts.map +0 -1
  138. package/dist/neutral/lib/index.d.ts +0 -4
  139. package/dist/neutral/lib/index.d.ts.map +0 -1
  140. package/dist/node/Plugin.d.cts +0 -3
  141. package/dist/node/Plugin.d.cts.map +0 -1
  142. package/dist/node/Plugin.d.mts +0 -3
  143. package/dist/node/Plugin.d.mts.map +0 -1
  144. package/dist/node/Plugin.d.ts +0 -3
  145. package/dist/node/Plugin.d.ts.map +0 -1
  146. package/dist/node/components/DetailsBox.d.cts +0 -8
  147. package/dist/node/components/DetailsBox.d.cts.map +0 -1
  148. package/dist/node/components/DetailsBox.d.mts +0 -8
  149. package/dist/node/components/DetailsBox.d.mts.map +0 -1
  150. package/dist/node/components/DetailsBox.d.ts +0 -8
  151. package/dist/node/components/DetailsBox.d.ts.map +0 -1
  152. package/dist/node/components/index.d.cts +0 -2
  153. package/dist/node/components/index.d.cts.map +0 -1
  154. package/dist/node/components/index.d.mts +0 -2
  155. package/dist/node/components/index.d.mts.map +0 -1
  156. package/dist/node/components/index.d.ts +0 -2
  157. package/dist/node/components/index.d.ts.map +0 -1
  158. package/dist/node/index.cjs +0 -280
  159. package/dist/node/index.cjs.map +0 -1
  160. package/dist/node/index.d.cts +0 -3
  161. package/dist/node/index.d.cts.map +0 -1
  162. package/dist/node/index.d.mts +0 -3
  163. package/dist/node/index.d.mts.map +0 -1
  164. package/dist/node/index.d.ts +0 -3
  165. package/dist/node/index.d.ts.map +0 -1
  166. package/dist/node/index.js +0 -262
  167. package/dist/node/index.js.map +0 -1
  168. package/dist/node/lib/DataLineStyles.d.cts +0 -5
  169. package/dist/node/lib/DataLineStyles.d.cts.map +0 -1
  170. package/dist/node/lib/DataLineStyles.d.mts +0 -5
  171. package/dist/node/lib/DataLineStyles.d.mts.map +0 -1
  172. package/dist/node/lib/DataLineStyles.d.ts +0 -5
  173. package/dist/node/lib/DataLineStyles.d.ts.map +0 -1
  174. package/dist/node/lib/DataPointStyles.d.cts +0 -8
  175. package/dist/node/lib/DataPointStyles.d.cts.map +0 -1
  176. package/dist/node/lib/DataPointStyles.d.mts +0 -8
  177. package/dist/node/lib/DataPointStyles.d.mts.map +0 -1
  178. package/dist/node/lib/DataPointStyles.d.ts +0 -8
  179. package/dist/node/lib/DataPointStyles.d.ts.map +0 -1
  180. package/dist/node/lib/ForecastLineChartConfigBuilder.d.cts +0 -44
  181. package/dist/node/lib/ForecastLineChartConfigBuilder.d.cts.map +0 -1
  182. package/dist/node/lib/ForecastLineChartConfigBuilder.d.mts +0 -44
  183. package/dist/node/lib/ForecastLineChartConfigBuilder.d.mts.map +0 -1
  184. package/dist/node/lib/ForecastLineChartConfigBuilder.d.ts +0 -44
  185. package/dist/node/lib/ForecastLineChartConfigBuilder.d.ts.map +0 -1
  186. package/dist/node/lib/MockSourcePayloads.d.cts +0 -18
  187. package/dist/node/lib/MockSourcePayloads.d.cts.map +0 -1
  188. package/dist/node/lib/MockSourcePayloads.d.mts +0 -18
  189. package/dist/node/lib/MockSourcePayloads.d.mts.map +0 -1
  190. package/dist/node/lib/MockSourcePayloads.d.ts +0 -18
  191. package/dist/node/lib/MockSourcePayloads.d.ts.map +0 -1
  192. package/dist/node/lib/SourcePayloads.d.cts +0 -30
  193. package/dist/node/lib/SourcePayloads.d.cts.map +0 -1
  194. package/dist/node/lib/SourcePayloads.d.mts +0 -30
  195. package/dist/node/lib/SourcePayloads.d.mts.map +0 -1
  196. package/dist/node/lib/SourcePayloads.d.ts +0 -30
  197. package/dist/node/lib/SourcePayloads.d.ts.map +0 -1
  198. package/dist/node/lib/index.d.cts +0 -4
  199. package/dist/node/lib/index.d.cts.map +0 -1
  200. package/dist/node/lib/index.d.mts +0 -4
  201. package/dist/node/lib/index.d.mts.map +0 -1
  202. package/dist/node/lib/index.d.ts +0 -4
  203. package/dist/node/lib/index.d.ts.map +0 -1
@@ -1,3 +1,13 @@
1
- export * from './components/index.js';
2
- export * from './Plugin.js';
3
- //# sourceMappingURL=index.d.ts.map
1
+ import { FlexBoxProps } from '@xylabs/react-flexbox';
2
+ import { Payload } from '@xyo-network/payload-model';
3
+ import React from 'react';
4
+ import { PayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
5
+
6
+ interface PriceForecastDetailsBoxProps extends FlexBoxProps {
7
+ payload?: Payload;
8
+ }
9
+ declare const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps>;
10
+
11
+ declare const PriceForecastRenderPlugin: PayloadRenderPlugin;
12
+
13
+ export { PriceForecastDetailsBox, type PriceForecastDetailsBoxProps, PriceForecastRenderPlugin };
@@ -1,65 +1,83 @@
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
71
  var SourcePayloads = class {
72
+ static {
73
+ __name(this, "SourcePayloads");
74
+ }
75
+ sourcePayloads;
76
+ sourcePrices;
59
77
  constructor(sourcePayloads) {
60
78
  this.sourcePayloads = sourcePayloads;
79
+ this.sourcePrices = [];
61
80
  }
62
- sourcePrices = [];
63
81
  get payloads() {
64
82
  return this.sourcePayloads;
65
83
  }
@@ -68,7 +86,10 @@ var SourcePayloads = class {
68
86
  const instance = new this(sourcePayloads);
69
87
  const paths = jsonPath.split(".");
70
88
  instance.sourcePrices = sourcePayloads.map((payload) => {
71
- return { x: payload.timestamp, y: instance.jsonPathTraverser(payload, paths) };
89
+ return {
90
+ x: payload.timestamp,
91
+ y: instance.jsonPathTraverser(payload, paths)
92
+ };
72
93
  });
73
94
  return instance;
74
95
  }
@@ -93,24 +114,30 @@ var SourcePayloads = class {
93
114
  };
94
115
 
95
116
  // src/lib/ForecastLineChartConfigBuilder.ts
96
- var defaultOptions = () => ({
117
+ var defaultOptions = /* @__PURE__ */ __name(() => ({
97
118
  plugins: {
98
119
  legend: {
99
120
  position: "top"
100
121
  }
101
122
  },
102
123
  responsive: true
103
- });
124
+ }), "defaultOptions");
104
125
  var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
126
+ static {
127
+ __name(this, "ForecastLineChartConfigBuilder");
128
+ }
129
+ payload;
130
+ data;
131
+ options;
132
+ themeColors;
105
133
  constructor(theme, payload) {
106
134
  this.payload = payload;
135
+ this.data = {
136
+ datasets: []
137
+ };
138
+ this.options = defaultOptions();
107
139
  this.themeColors = this.parseTheme(theme);
108
140
  }
109
- data = {
110
- datasets: []
111
- };
112
- options = defaultOptions();
113
- themeColors;
114
141
  get forecastPayload() {
115
142
  if (this.payload) {
116
143
  return this.payload;
@@ -131,7 +158,9 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
131
158
  }
132
159
  async buildData(includeSources) {
133
160
  const forecastData = this.generateDataSetForecastData();
134
- const datasets = [forecastData];
161
+ const datasets = [
162
+ forecastData
163
+ ];
135
164
  if (includeSources) {
136
165
  const sourceData = await this.generateDataSetSourcePayloads();
137
166
  datasets.unshift(sourceData);
@@ -152,8 +181,12 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
152
181
  return this;
153
182
  }
154
183
  refreshValues() {
155
- this.data = { ...this.data };
156
- this.options = { ...this.options };
184
+ this.data = {
185
+ ...this.data
186
+ };
187
+ this.options = {
188
+ ...this.options
189
+ };
157
190
  }
158
191
  generateLegend() {
159
192
  return {
@@ -197,9 +230,14 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
197
230
  }
198
231
  generateDataSetForecastData() {
199
232
  return {
200
- borderDash: [5],
233
+ borderDash: [
234
+ 5
235
+ ],
201
236
  borderDashOffset: 0.5,
202
- data: this.forecastPayload.values.map((price) => ({ x: price.timestamp ?? 0, y: price.value })),
237
+ data: this.forecastPayload.values.map((price) => ({
238
+ x: price.timestamp ?? 0,
239
+ y: price.value
240
+ })),
203
241
  label: "Forecast Price",
204
242
  ...DataPointStyles(this.themeColors?.dataSetColorPrimary),
205
243
  ...DataLineStyles(this.themeColors?.dataSetColorPrimary)
@@ -217,32 +255,41 @@ var ForecastLineChartConfigBuilder = class _ForecastLineChartConfigBuilder {
217
255
  };
218
256
 
219
257
  // src/components/DetailsBox.tsx
220
- import { jsx } from "react/jsx-runtime";
221
258
  ChartJS.register(CategoryScale, TimeScale, PointElement, LineElement, LinearScale, Title, Tooltip, Legend);
222
- var PriceForecastDetailsBox = ({ payload, ...props }) => {
259
+ var PriceForecastDetailsBox = /* @__PURE__ */ __name(({ payload, ...props }) => {
223
260
  const priceForecastPayload = payload;
224
261
  const theme = useTheme();
225
- const [data, setData] = useState({ datasets: [] });
262
+ const [data, setData] = useState({
263
+ datasets: []
264
+ });
226
265
  const [options, setOptions] = useState({});
227
- useAsyncEffect(
228
- // eslint-disable-next-line react-hooks/exhaustive-deps
229
- async (mounted) => {
230
- const { data: data2, options: options2 } = await ForecastLineChartConfigBuilder.create(theme, priceForecastPayload, { fetch: true });
231
- if (mounted()) {
232
- setData(data2);
233
- setOptions(options2);
234
- }
235
- },
236
- [priceForecastPayload, theme]
237
- );
238
- return /* @__PURE__ */ jsx(FlexCol, { ...props, busy: priceForecastPayload === void 0, minHeight: "25vh", children: priceForecastPayload ? /* @__PURE__ */ jsx(Line, { options, data }) : null });
239
- };
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");
240
287
 
241
288
  // src/Plugin.ts
242
289
  import { createPayloadRenderPlugin } from "@xyo-network/react-payload-plugin";
243
290
  var PriceForecastRenderPlugin = {
244
291
  ...createPayloadRenderPlugin({
245
- canRender: () => true,
292
+ canRender: /* @__PURE__ */ __name(() => true, "canRender"),
246
293
  components: {
247
294
  box: {
248
295
  detailsBox: PriceForecastDetailsBox
@@ -255,4 +302,4 @@ export {
255
302
  PriceForecastDetailsBox,
256
303
  PriceForecastRenderPlugin
257
304
  };
258
- //# sourceMappingURL=index.js.map
305
+ //# 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":"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","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"]}
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.83.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": "^4.0.0-rc.7",
26
+ "@xylabs/tsconfig-react": "^4.0.0-rc.7",
27
27
  "typescript": "^5.5.4"
28
28
  },
29
29
  "peerDependencies": {
@@ -39,32 +39,16 @@
39
39
  "docs": "dist/docs.json",
40
40
  "exports": {
41
41
  ".": {
42
- "node": {
43
- "import": {
44
- "types": "./dist/node/index.d.mts",
45
- "default": "./dist/node/index.js"
46
- },
47
- "require": {
48
- "types": "./dist/node/index.d.cts",
49
- "default": "./dist/node/index.cjs"
50
- }
42
+ "import": {
43
+ "types": "./dist/browser/index.d.ts",
44
+ "default": "./dist/browser/index.mjs"
51
45
  },
52
- "browser": {
53
- "import": {
54
- "types": "./dist/browser/index.d.mts",
55
- "default": "./dist/browser/index.js"
56
- },
57
- "require": {
58
- "types": "./dist/browser/index.d.cts",
59
- "default": "./dist/browser/index.cjs"
60
- }
61
- },
62
- "default": "./dist/browser/index.js"
46
+ "types": "./dist/browser/index.d.ts",
47
+ "default": "./dist/browser/index.mjs"
63
48
  },
64
49
  "./package.json": "./package.json"
65
50
  },
66
- "main": "dist/browser/index.cjs",
67
- "module": "dist/browser/index.js",
51
+ "module": "dist/browser/index.mjs",
68
52
  "homepage": "https://xyo.network",
69
53
  "keywords": [
70
54
  "xyo",
@@ -86,6 +70,6 @@
86
70
  },
87
71
  "sideEffects": false,
88
72
  "types": "dist/browser/index.d.ts",
89
- "version": "2.78.10",
73
+ "version": "2.80.0",
90
74
  "type": "module"
91
75
  }
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'
package/xy.config.ts ADDED
@@ -0,0 +1,12 @@
1
+ import { XyTsupConfig } from '@xylabs/ts-scripts-yarn3'
2
+ const config: XyTsupConfig = {
3
+ compile: {
4
+ browser: {
5
+ src: true,
6
+ },
7
+ node: {},
8
+ neutral: {},
9
+ },
10
+ }
11
+
12
+ export default config
@@ -1,3 +0,0 @@
1
- import { PayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
2
- export declare const PriceForecastRenderPlugin: PayloadRenderPlugin;
3
- //# sourceMappingURL=Plugin.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Plugin.d.ts","sourceRoot":"","sources":["../../src/Plugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,mBAAmB,EAAE,MAAM,mCAAmC,CAAA;AAIlG,eAAO,MAAM,yBAAyB,EAAE,mBAUvC,CAAA"}
@@ -1,3 +0,0 @@
1
- import { PayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
2
- export declare const PriceForecastRenderPlugin: PayloadRenderPlugin;
3
- //# sourceMappingURL=Plugin.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Plugin.d.ts","sourceRoot":"","sources":["../../src/Plugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,mBAAmB,EAAE,MAAM,mCAAmC,CAAA;AAIlG,eAAO,MAAM,yBAAyB,EAAE,mBAUvC,CAAA"}
@@ -1,3 +0,0 @@
1
- import { PayloadRenderPlugin } from '@xyo-network/react-payload-plugin';
2
- export declare const PriceForecastRenderPlugin: PayloadRenderPlugin;
3
- //# sourceMappingURL=Plugin.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Plugin.d.ts","sourceRoot":"","sources":["../../src/Plugin.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,mBAAmB,EAAE,MAAM,mCAAmC,CAAA;AAIlG,eAAO,MAAM,yBAAyB,EAAE,mBAUvC,CAAA"}
@@ -1,8 +0,0 @@
1
- import 'chartjs-adapter-luxon';
2
- import { FlexBoxProps } from '@xylabs/react-flexbox';
3
- import { Payload } from '@xyo-network/payload-model';
4
- export interface PriceForecastDetailsBoxProps extends FlexBoxProps {
5
- payload?: Payload;
6
- }
7
- export declare const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps>;
8
- //# sourceMappingURL=DetailsBox.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DetailsBox.d.ts","sourceRoot":"","sources":["../../../src/components/DetailsBox.tsx"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAA;AAI9B,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAE7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAqBpD,MAAM,WAAW,4BAA6B,SAAQ,YAAY;IAChE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAyB1E,CAAA"}
@@ -1,8 +0,0 @@
1
- import 'chartjs-adapter-luxon';
2
- import { FlexBoxProps } from '@xylabs/react-flexbox';
3
- import { Payload } from '@xyo-network/payload-model';
4
- export interface PriceForecastDetailsBoxProps extends FlexBoxProps {
5
- payload?: Payload;
6
- }
7
- export declare const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps>;
8
- //# sourceMappingURL=DetailsBox.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DetailsBox.d.ts","sourceRoot":"","sources":["../../../src/components/DetailsBox.tsx"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAA;AAI9B,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAE7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAqBpD,MAAM,WAAW,4BAA6B,SAAQ,YAAY;IAChE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAyB1E,CAAA"}
@@ -1,8 +0,0 @@
1
- import 'chartjs-adapter-luxon';
2
- import { FlexBoxProps } from '@xylabs/react-flexbox';
3
- import { Payload } from '@xyo-network/payload-model';
4
- export interface PriceForecastDetailsBoxProps extends FlexBoxProps {
5
- payload?: Payload;
6
- }
7
- export declare const PriceForecastDetailsBox: React.FC<PriceForecastDetailsBoxProps>;
8
- //# sourceMappingURL=DetailsBox.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DetailsBox.d.ts","sourceRoot":"","sources":["../../../src/components/DetailsBox.tsx"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAA;AAI9B,OAAO,EAAE,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAE7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAqBpD,MAAM,WAAW,4BAA6B,SAAQ,YAAY;IAChE,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAyB1E,CAAA"}
@@ -1,2 +0,0 @@
1
- export * from './DetailsBox.js';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +0,0 @@
1
- export * from './DetailsBox.js';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}