lit-litelements 2.2.9 → 2.3.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 (5) hide show
  1. package/dist/component/chart.lit.d.ts +8 -4
  2. package/dist/component/chart.lit.js +45 -9
  3. package/dist/main.js +7 -7
  4. package/package.json +1 -1
  5. package/readme.md +45 -26
package/dist/component/chart.lit.d.ts CHANGED
@@ -15,8 +15,10 @@ interface StockData {
15
15
  MA100?: number;
16
16
  RSI?: number;
17
17
  MACDLine?: number;
18
- SignalLine?: any;
19
- divergence?: any;
18
+ SignalLine?: number;
19
+ divergence?: number;
20
+ StochRSI_K?: number;
21
+ StochRSI_D?: number;
20
22
  }
21
23
  declare class ChartElement extends LitElement {
22
24
  stockData: StockData[];
@@ -34,6 +36,8 @@ declare class ChartElement extends LitElement {
34
36
  dates: string[];
35
37
  closePrices: number[];
36
38
  rsi: number[];
39
+ stochRSI_K: number[];
40
+ stochRSI_D: number[];
37
41
  ma5: number[];
38
42
  ma10: number[];
39
43
  ma20: number[];
@@ -41,8 +45,8 @@ declare class ChartElement extends LitElement {
41
45
  ma100: number[];
42
46
  ma200: number[];
43
47
  MACDLine: number[];
44
- SignalLine: any[];
45
- divergence: any[];
48
+ SignalLine: number[];
49
+ divergence: number[];
46
50
  volumes: number[];
47
51
  };
48
52
  _updateChart(): void;
package/dist/component/chart.lit.js CHANGED
@@ -156,6 +156,9 @@ let ChartElement = class ChartElement extends LitElement {
156
156
  dates: this.stockData.map((d) => d.date),
157
157
  closePrices: this.stockData.map((d) => d.close),
158
158
  rsi: this.stockData.map((d) => { var _a; return (_a = d.RSI) !== null && _a !== void 0 ? _a : null; }),
159
+ // ✅ StochRSI
160
+ stochRSI_K: this.stockData.map((d) => { var _a; return (_a = d.StochRSI_K) !== null && _a !== void 0 ? _a : null; }),
161
+ stochRSI_D: this.stockData.map((d) => { var _a; return (_a = d.StochRSI_D) !== null && _a !== void 0 ? _a : null; }),
159
162
  ma5: this.stockData.map((d) => { var _a; return (_a = d.MA5) !== null && _a !== void 0 ? _a : null; }),
160
163
  ma10: this.stockData.map((d) => { var _a; return (_a = d.MA10) !== null && _a !== void 0 ? _a : null; }),
161
164
  ma20: this.stockData.map((d) => { var _a; return (_a = d.MA20) !== null && _a !== void 0 ? _a : null; }),
@@ -174,7 +177,7 @@ let ChartElement = class ChartElement extends LitElement {
174
177
  _updateChart() {
175
178
  if (!this.chart)
176
179
  return;
177
- const { dates, closePrices, rsi, ma5, ma10, ma20, ma50, ma100, ma200, MACDLine, SignalLine, divergence, volumes, } = this._getChartData();
180
+ const { dates, closePrices, rsi, ma5, ma10, ma20, ma50, ma100, ma200, MACDLine, SignalLine, divergence, volumes, stochRSI_K, stochRSI_D, } = this._getChartData();
178
181
  this.chart.data.labels = dates;
179
182
  const ds = this.chart.data.datasets;
180
183
  ds[0].data = rsi;
@@ -189,6 +192,9 @@ let ChartElement = class ChartElement extends LitElement {
189
192
  ds[9].data = ma10;
190
193
  ds[10].data = ma5;
191
194
  ds[11].data = volumes;
195
+ // ✅ Update StochRSI datasets (just like MACDLine and SignalLine)
196
+ ds[12].data = stochRSI_K; // %K line
197
+ ds[13].data = stochRSI_D; // %D line
192
198
  this.chart.update();
193
199
  }
194
200
  // --------------------------------------------------------------------
@@ -196,7 +202,7 @@ let ChartElement = class ChartElement extends LitElement {
196
202
  // --------------------------------------------------------------------
197
203
  _createChart() {
198
204
  var _a;
199
- const { dates, closePrices, rsi, ma5, ma10, ma20, ma50, ma100, ma200, MACDLine, SignalLine, divergence, volumes, } = this._getChartData();
205
+ const { dates, closePrices, rsi, ma5, ma10, ma20, ma50, ma100, ma200, MACDLine, SignalLine, divergence, volumes, stochRSI_K, stochRSI_D, } = this._getChartData();
200
206
  const canvas = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById("stockChart");
201
207
  if (!canvas)
202
208
  return;
@@ -205,7 +211,7 @@ let ChartElement = class ChartElement extends LitElement {
205
211
  this.chart.destroy();
206
212
  // Register plugins
207
213
  Chart.register(zoomPlugin);
208
- Chart.register(this.customLinePlugin);
214
+ // Chart.register(this.customLinePlugin);
209
215
  this.chart = new Chart(ctx, {
210
216
  type: "line",
211
217
  data: {
@@ -260,7 +266,7 @@ let ChartElement = class ChartElement extends LitElement {
260
266
  yAxisID: "yPrice",
261
267
  borderColor: "#ff6384",
262
268
  borderWidth: 1.5,
263
- fill: false,
269
+ pointRadius: 0,
264
270
  },
265
271
  {
266
272
  label: "MA50",
@@ -268,7 +274,7 @@ let ChartElement = class ChartElement extends LitElement {
268
274
  yAxisID: "yPrice",
269
275
  borderColor: "#ffce56",
270
276
  borderWidth: 1.5,
271
- fill: false,
277
+ pointRadius: 0,
272
278
  },
273
279
  {
274
280
  label: "MA100",
@@ -276,7 +282,7 @@ let ChartElement = class ChartElement extends LitElement {
276
282
  yAxisID: "yPrice",
277
283
  borderColor: "#996633",
278
284
  borderWidth: 1.5,
279
- fill: false,
285
+ pointRadius: 0,
280
286
  },
281
287
  {
282
288
  label: "MA200",
@@ -284,7 +290,7 @@ let ChartElement = class ChartElement extends LitElement {
284
290
  yAxisID: "yPrice",
285
291
  borderColor: "#9966ff",
286
292
  borderWidth: 1.5,
287
- fill: false,
293
+ pointRadius: 0,
288
294
  },
289
295
  {
290
296
  label: "MA10",
@@ -310,6 +316,24 @@ let ChartElement = class ChartElement extends LitElement {
310
316
  yAxisID: "yVolume",
311
317
  backgroundColor: "rgba(252, 3, 57, 0.5)",
312
318
  },
319
+ // StochRSI %K
320
+ {
321
+ label: "StochRSI %K",
322
+ data: stochRSI_K,
323
+ yAxisID: "yStochRSI",
324
+ borderColor: "#00c853", // Green color for %K
325
+ borderWidth: 0.5,
326
+ pointRadius: 0,
327
+ },
328
+ // StochRSI %D
329
+ {
330
+ label: "StochRSI %D",
331
+ data: stochRSI_D,
332
+ yAxisID: "yStochRSI",
333
+ borderColor: "#ff5252", // Red color for %D
334
+ borderWidth: 0.5,
335
+ pointRadius: 0,
336
+ },
313
337
  ],
314
338
  },
315
339
  options: {
@@ -331,12 +355,12 @@ let ChartElement = class ChartElement extends LitElement {
331
355
  color: (ctx) => {
332
356
  const label = ctx.tick.label;
333
357
  if (typeof label === "string") {
334
- const labelDate = new Date(label.replace(" ", "T")); // make ISO-compatible
358
+ const labelDate = new Date(label.replace(" ", "T"));
335
359
  if (isNaN(labelDate.getTime()))
336
360
  return "black";
337
361
  const todayStr = new Date().toISOString().split("T")[0];
338
362
  const labelStr = labelDate.toISOString().split("T")[0];
339
- return labelStr === todayStr ? "Salmon" : "black"; // highlight today
363
+ return labelStr === todayStr ? "Salmon" : "black";
340
364
  }
341
365
  return "black";
342
366
  },
@@ -362,6 +386,18 @@ let ChartElement = class ChartElement extends LitElement {
362
386
  weight: 1,
363
387
  grid: { drawOnChartArea: false },
364
388
  },
389
+ yStochRSI: {
390
+ position: "right",
391
+ min: -0.5,
392
+ max: 1.5, // you can adjust this for your scale, or 100 if you use the full range
393
+ title: {
394
+ display: true,
395
+ text: "StochRSI",
396
+ },
397
+ grid: {
398
+ drawOnChartArea: false,
399
+ },
400
+ },
365
401
  },
366
402
  },
367
403
  });