dom-render 1.0.47 → 1.0.48
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/README.MD +28 -4
- package/dist/bundle.js +38 -10
- package/dist/bundle.js.map +1 -1
- package/events/EventManager.js +38 -10
- package/package.json +1 -1
package/README.MD
CHANGED
|
@@ -95,9 +95,19 @@ dr-value-link: <input type="text" dr-value-link="this.office.addr.street"> <br>
|
|
|
95
95
|
<textarea dr-attr="{rows: this.age/2, cols: this.age}"></textarea>
|
|
96
96
|
```
|
|
97
97
|
|
|
98
|
+
## dr-class
|
|
99
|
+
```html
|
|
100
|
+
<div dr-class="{big: this.age > 50, red: this.age > 50}">
|
|
101
|
+
<div dr-class="'big yellow ' + (this.age > 50 ? 'old' : 'young')">
|
|
102
|
+
<div dr-class="['small', 'yellow']">
|
|
103
|
+
```
|
|
104
|
+
|
|
98
105
|
## dr-style
|
|
99
106
|
```html
|
|
100
|
-
<div dr-style="{fontSize: this.age+'px'}"> style </div>
|
|
107
|
+
<div dr-style="{fontSize: this.age + 'px'}"> style </div>
|
|
108
|
+
<div dr-style="{'font-size': '20px'}"> style</div>
|
|
109
|
+
<div dr-style="'font-size: ' + this.age +'px; margin: ' + this.age + 'px'"> style </div>
|
|
110
|
+
<div dr-style="['font-size: ' + this.age +'px', 'margin: ' + this.age + 'px']"> style </div>
|
|
101
111
|
```
|
|
102
112
|
|
|
103
113
|
|
|
@@ -188,6 +198,20 @@ using component
|
|
|
188
198
|
---
|
|
189
199
|
|
|
190
200
|
# Detect Get, Set
|
|
201
|
+
OnBeforeReturnSet
|
|
202
|
+
```typescript
|
|
203
|
+
export interface OnBeforeReturnSet {
|
|
204
|
+
onBeforeReturnSet(name: string, value: any, fullPath?: string[]): void;
|
|
205
|
+
}
|
|
206
|
+
```
|
|
207
|
+
OnBeforeReturnGet
|
|
208
|
+
```typescript
|
|
209
|
+
export interface OnBeforeReturnGet {
|
|
210
|
+
onBeforeReturnGet(name: string, value: any, fullPath?: string[]): void;
|
|
211
|
+
}
|
|
212
|
+
```
|
|
213
|
+
|
|
214
|
+
using detect
|
|
191
215
|
```typescript
|
|
192
216
|
{
|
|
193
217
|
name: 'dom-render'
|
|
@@ -199,7 +223,7 @@ using component
|
|
|
199
223
|
}
|
|
200
224
|
}
|
|
201
225
|
```
|
|
202
|
-
Config
|
|
226
|
+
exclude detect property: Config
|
|
203
227
|
- proxyExcludeOnBeforeReturnGets: ['propertyName']
|
|
204
228
|
- proxyExcludeOnBeforeReturnSets: ['propertyName']
|
|
205
229
|
---
|
|
@@ -207,7 +231,7 @@ Config (exclude)
|
|
|
207
231
|
# Proxy
|
|
208
232
|
all internal variables are managed by proxy. (DomRenderProxy)
|
|
209
233
|
### exclude proxy (situation: Maximum call stack error)
|
|
210
|
-
Config
|
|
234
|
+
exclude detect property: Config
|
|
211
235
|
- proxyExcludeTyps: [Class...]
|
|
212
236
|
|
|
213
237
|
Code base
|
|
@@ -248,7 +272,7 @@ export interface Config {
|
|
|
248
272
|
proxyExcludeOnBeforeReturnGets?: string[];
|
|
249
273
|
scripts?: { [n: string]: any };
|
|
250
274
|
applyEvents?: { attrName: string, callBack: (elements: Element, attrValue: string, obj: any) => void }[];
|
|
251
|
-
}
|
|
275
|
+
}
|
|
252
276
|
```
|
|
253
277
|
----
|
|
254
278
|
# License
|
package/dist/bundle.js
CHANGED
|
@@ -387,10 +387,24 @@ var eventManager = new (function () {
|
|
|
387
387
|
target: it
|
|
388
388
|
})
|
|
389
389
|
}));
|
|
390
|
-
|
|
391
|
-
|
|
390
|
+
if (typeof data === 'string') {
|
|
391
|
+
if (it instanceof HTMLElement) {
|
|
392
|
+
it.removeAttribute('style');
|
|
393
|
+
it.setAttribute('style', data);
|
|
394
|
+
}
|
|
395
|
+
}
|
|
396
|
+
else if (Array.isArray(data)) {
|
|
392
397
|
if (it instanceof HTMLElement) {
|
|
393
|
-
it.style
|
|
398
|
+
it.removeAttribute('style');
|
|
399
|
+
it.setAttribute('style', data.join(';'));
|
|
400
|
+
}
|
|
401
|
+
}
|
|
402
|
+
else {
|
|
403
|
+
for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
|
|
404
|
+
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
405
|
+
if (it instanceof HTMLElement) {
|
|
406
|
+
it.style[key] = String(value);
|
|
407
|
+
}
|
|
394
408
|
}
|
|
395
409
|
}
|
|
396
410
|
}
|
|
@@ -406,14 +420,28 @@ var eventManager = new (function () {
|
|
|
406
420
|
target: it
|
|
407
421
|
})
|
|
408
422
|
}));
|
|
409
|
-
|
|
410
|
-
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
423
|
+
if (typeof data === 'string') {
|
|
411
424
|
if (it instanceof HTMLElement) {
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
425
|
+
it.removeAttribute('class');
|
|
426
|
+
it.setAttribute('class', data);
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
else if (Array.isArray(data)) {
|
|
430
|
+
if (it instanceof HTMLElement) {
|
|
431
|
+
it.removeAttribute('class');
|
|
432
|
+
it.setAttribute('class', data.join(' '));
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
else {
|
|
436
|
+
for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
|
|
437
|
+
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
438
|
+
if (it instanceof HTMLElement) {
|
|
439
|
+
if (value) {
|
|
440
|
+
it.classList.add(key);
|
|
441
|
+
}
|
|
442
|
+
else {
|
|
443
|
+
it.classList.remove(key);
|
|
444
|
+
}
|
|
417
445
|
}
|
|
418
446
|
}
|
|
419
447
|
}
|
package/dist/bundle.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bundle.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"bundle.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/events/EventManager.js
CHANGED
|
@@ -144,10 +144,24 @@ export var eventManager = new (function () {
|
|
|
144
144
|
target: it
|
|
145
145
|
})
|
|
146
146
|
}));
|
|
147
|
-
|
|
148
|
-
|
|
147
|
+
if (typeof data === 'string') {
|
|
148
|
+
if (it instanceof HTMLElement) {
|
|
149
|
+
it.removeAttribute('style');
|
|
150
|
+
it.setAttribute('style', data);
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
else if (Array.isArray(data)) {
|
|
149
154
|
if (it instanceof HTMLElement) {
|
|
150
|
-
it.style
|
|
155
|
+
it.removeAttribute('style');
|
|
156
|
+
it.setAttribute('style', data.join(';'));
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
else {
|
|
160
|
+
for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
|
|
161
|
+
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
162
|
+
if (it instanceof HTMLElement) {
|
|
163
|
+
it.style[key] = String(value);
|
|
164
|
+
}
|
|
151
165
|
}
|
|
152
166
|
}
|
|
153
167
|
}
|
|
@@ -163,14 +177,28 @@ export var eventManager = new (function () {
|
|
|
163
177
|
target: it
|
|
164
178
|
})
|
|
165
179
|
}));
|
|
166
|
-
|
|
167
|
-
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
180
|
+
if (typeof data === 'string') {
|
|
168
181
|
if (it instanceof HTMLElement) {
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
182
|
+
it.removeAttribute('class');
|
|
183
|
+
it.setAttribute('class', data);
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
else if (Array.isArray(data)) {
|
|
187
|
+
if (it instanceof HTMLElement) {
|
|
188
|
+
it.removeAttribute('class');
|
|
189
|
+
it.setAttribute('class', data.join(' '));
|
|
190
|
+
}
|
|
191
|
+
}
|
|
192
|
+
else {
|
|
193
|
+
for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
|
|
194
|
+
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
195
|
+
if (it instanceof HTMLElement) {
|
|
196
|
+
if (value) {
|
|
197
|
+
it.classList.add(key);
|
|
198
|
+
}
|
|
199
|
+
else {
|
|
200
|
+
it.classList.remove(key);
|
|
201
|
+
}
|
|
174
202
|
}
|
|
175
203
|
}
|
|
176
204
|
}
|