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.
- package/dist/component/chart.lit.d.ts +8 -4
- package/dist/component/chart.lit.js +45 -9
- package/dist/main.js +7 -7
- package/package.json +1 -1
- package/readme.md +45 -26
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "lit-litelements",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.3.0",
|
|
4
4
|
"description": "My LitElement component build for loading spinner with 10 types, and chart-display fix error hover hidden: true for some line async update",
|
|
5
5
|
"main": "dist/main.js",
|
|
6
6
|
"module": "dist/main.js",
|
package/readme.md
CHANGED
|
@@ -8,8 +8,8 @@ This package includes **two** customizable web components built with Lit:
|
|
|
8
8
|
|
|
9
9
|
You can integrate customizable loading spinners using the `<loading-spinner-element>` component, combining designs from:
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
|
|
11
|
+
- [CSS Loaders](https://cssloaders.github.io/)
|
|
12
|
+
- [Loading.io](https://loading.io/css/)
|
|
13
13
|
|
|
14
14
|
---
|
|
15
15
|
|
|
@@ -37,13 +37,24 @@ You can integrate customizable loading spinners using the `<loading-spinner-elem
|
|
|
37
37
|
<loading-spinner-element></loading-spinner-element>
|
|
38
38
|
|
|
39
39
|
<!-- Centered loader-sent-email -->
|
|
40
|
-
<loading-spinner-element center name="spinner11"
|
|
40
|
+
<loading-spinner-element center name="spinner11"></loading-spinner-element>
|
|
41
41
|
|
|
42
42
|
<!-- Centered red spinner with custom size -->
|
|
43
|
-
<loading-spinner-element
|
|
43
|
+
<loading-spinner-element
|
|
44
|
+
center
|
|
45
|
+
name="spinner10"
|
|
46
|
+
style="color: red;"
|
|
47
|
+
size="100px"
|
|
48
|
+
></loading-spinner-element>
|
|
44
49
|
|
|
45
50
|
<!-- Full config with white background -->
|
|
46
|
-
<loading-spinner-element
|
|
51
|
+
<loading-spinner-element
|
|
52
|
+
center
|
|
53
|
+
name="spinner11"
|
|
54
|
+
style="color: red;"
|
|
55
|
+
size="100px"
|
|
56
|
+
backgroundColor="white"
|
|
57
|
+
></loading-spinner-element>
|
|
47
58
|
```
|
|
48
59
|
|
|
49
60
|
---
|
|
@@ -64,7 +75,6 @@ You can integrate customizable loading spinners using the `<loading-spinner-elem
|
|
|
64
75
|
| spinner10 | `loader-yin-yang-2` |
|
|
65
76
|
| spinner11 | `loader-sent-email` |
|
|
66
77
|
|
|
67
|
-
|
|
68
78
|
---
|
|
69
79
|
|
|
70
80
|
## 📊 `stock-chart-display` v2.2.4
|
|
@@ -81,22 +91,27 @@ Bull and Bear base on price vs ma200 with SL and TP
|
|
|
81
91
|
```ts
|
|
82
92
|
const dataArray = [
|
|
83
93
|
{
|
|
84
|
-
|
|
85
|
-
open:
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
MA5:
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
94
|
+
date: "2025-04-07 19:00:00",
|
|
95
|
+
open: 20.06,
|
|
96
|
+
high: 20.39,
|
|
97
|
+
low: 17.67,
|
|
98
|
+
close: 18.13,
|
|
99
|
+
volume: 163982700,
|
|
100
|
+
MA5: 20.392,
|
|
101
|
+
MA9: 21.45,
|
|
102
|
+
MA10: 21.647,
|
|
103
|
+
MA15: 22.482,
|
|
104
|
+
MA20: 22.8635,
|
|
105
|
+
MA50: 22.2332,
|
|
106
|
+
MA100: 21.8667,
|
|
107
|
+
MA200: 23.3118,
|
|
108
|
+
RSI: 29.649264037,
|
|
109
|
+
StochRSI_K: 0,
|
|
110
|
+
StochRSI_D: 0.031609265,
|
|
111
|
+
MACDLine: -0.7138507,
|
|
112
|
+
SignalLine: -0.1025638,
|
|
113
|
+
divergence: -0.6112869,
|
|
114
|
+
MACDDivergence: null,
|
|
100
115
|
},
|
|
101
116
|
// ... more data points
|
|
102
117
|
];
|
|
@@ -137,7 +152,7 @@ In your `angular.json`, add the script under `scripts`:
|
|
|
137
152
|
In the module where you want to use the web component (e.g., `app.module.ts`), import `CUSTOM_ELEMENTS_SCHEMA` and add it to the `schemas` array:
|
|
138
153
|
|
|
139
154
|
```ts
|
|
140
|
-
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from
|
|
155
|
+
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from "@angular/core";
|
|
141
156
|
|
|
142
157
|
@NgModule({
|
|
143
158
|
declarations: [
|
|
@@ -146,9 +161,9 @@ import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
|
|
146
161
|
imports: [
|
|
147
162
|
// your modules
|
|
148
163
|
],
|
|
149
|
-
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
|
164
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
150
165
|
})
|
|
151
|
-
export class AppModule {
|
|
166
|
+
export class AppModule {}
|
|
152
167
|
```
|
|
153
168
|
|
|
154
169
|
---
|
|
@@ -158,5 +173,9 @@ export class AppModule { }
|
|
|
158
173
|
Include the component script directly:
|
|
159
174
|
|
|
160
175
|
```html
|
|
161
|
-
<script
|
|
176
|
+
<script
|
|
177
|
+
type="module"
|
|
178
|
+
src="./node_modules/lit-litelements/dist/main.js"
|
|
179
|
+
></script>
|
|
162
180
|
```
|
|
181
|
+
npm set //registry.npmjs.org/:_authToken=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
|