domql 1.3.1 → 1.3.4
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 +1 -41
- package/package.json +4 -4
- package/src/element/create.js +8 -8
- package/src/element/createProps.js +6 -1
package/README.md
CHANGED
|
@@ -7,51 +7,17 @@ DOM rendering Javascript framework.
|
|
|
7
7
|
- No transpilations, simple ES6 code
|
|
8
8
|
- One-time import and subtrees
|
|
9
9
|
|
|
10
|
-
You can start with [starter-kit](https://github.com/rackai/starter-kit) as a boilerplate, or jump into the
|
|
10
|
+
You can start with [starter-kit](https://github.com/rackai/starter-kit) as a boilerplate, or jump into the [playground](https://domql.com/playground/).
|
|
11
11
|
|
|
12
12
|
[](https://badge.fury.io/js/%40rackai%2Fdomql)
|
|
13
13
|
[](https://travis-ci.org/rackai/domql)
|
|
14
14
|
[](https://coveralls.io/github/rackai/domql?branch=main)
|
|
15
15
|
|
|
16
|
-
TODO:
|
|
17
|
-
- [x] error reporting
|
|
18
|
-
- [x] virtual DOM tree
|
|
19
|
-
- [x] create
|
|
20
|
-
- [x] create using prototype class
|
|
21
|
-
- [x] support multiple level prototypes
|
|
22
|
-
- [x] DOM caching
|
|
23
|
-
- [x] state
|
|
24
|
-
- [x] binding
|
|
25
|
-
- [x] with other component
|
|
26
|
-
- [x] with state
|
|
27
|
-
- [x] update
|
|
28
|
-
- [x] set (recreate)
|
|
29
|
-
- [x] only iterate with diff
|
|
30
|
-
- [x] events
|
|
31
|
-
- [x] event handling
|
|
32
|
-
- [ ] bubbling and propogation
|
|
33
|
-
- [ ] run changes inside animationFrame
|
|
34
|
-
|
|
35
|
-
### Getting started
|
|
36
|
-
|
|
37
|
-
To install all dependencies and run dev server, run:
|
|
38
|
-
|
|
39
|
-
```shell
|
|
40
|
-
yarn && yarn start
|
|
41
|
-
```
|
|
42
|
-
|
|
43
|
-
### Examples
|
|
44
|
-
|
|
45
|
-
Initialization:
|
|
46
|
-
|
|
47
16
|
```javascript
|
|
48
17
|
import DOM from '@rackai/domql'
|
|
49
18
|
|
|
50
19
|
DOM.create({ text: 'Rendered' })
|
|
51
20
|
```
|
|
52
|
-
|
|
53
|
-
Attributes:
|
|
54
|
-
|
|
55
21
|
```javascript
|
|
56
22
|
var link = {
|
|
57
23
|
tag: 'a',
|
|
@@ -70,8 +36,6 @@ var img = {
|
|
|
70
36
|
}
|
|
71
37
|
}
|
|
72
38
|
```
|
|
73
|
-
|
|
74
|
-
Reusing:
|
|
75
39
|
```javascript
|
|
76
40
|
var Link = {
|
|
77
41
|
tag: 'a'
|
|
@@ -96,8 +60,6 @@ var header = {
|
|
|
96
60
|
menu
|
|
97
61
|
}
|
|
98
62
|
```
|
|
99
|
-
|
|
100
|
-
Array Support:
|
|
101
63
|
```javascript
|
|
102
64
|
var navItems = ['Home', 'About', 'FAQ', 'Contact']
|
|
103
65
|
|
|
@@ -106,8 +68,6 @@ var menu = {
|
|
|
106
68
|
...navItems
|
|
107
69
|
}
|
|
108
70
|
```
|
|
109
|
-
|
|
110
|
-
Update:
|
|
111
71
|
```javascript
|
|
112
72
|
var val = {
|
|
113
73
|
text: 0
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "DOM rendering Javascript framework at early stage.",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "rackai",
|
|
6
|
-
"version": "1.3.
|
|
6
|
+
"version": "1.3.4",
|
|
7
7
|
"repository": "https://github.com/rackai/domql",
|
|
8
8
|
"publishConfig": {
|
|
9
9
|
"registry": "https://registry.npmjs.org"
|
|
@@ -29,16 +29,16 @@
|
|
|
29
29
|
"@babel/core": "^7.10.4",
|
|
30
30
|
"@babel/preset-env": "^7.10.4",
|
|
31
31
|
"babel-eslint": "^10.0.3",
|
|
32
|
-
"babel-jest": "^
|
|
32
|
+
"babel-jest": "^28.1.0",
|
|
33
33
|
"babel-preset-env": "^1.7.0",
|
|
34
34
|
"coveralls": "^3.0.5",
|
|
35
35
|
"eslint": "^8.10.0",
|
|
36
36
|
"eslint-plugin-jest": "^26.1.0",
|
|
37
|
-
"jest": "^
|
|
37
|
+
"jest": "^28.1.0",
|
|
38
38
|
"nodemon": "^2.0.6",
|
|
39
39
|
"np": "^7.2.0",
|
|
40
40
|
"parcel-bundler": "^1.12.4",
|
|
41
|
-
"standard": "^
|
|
41
|
+
"standard": "^17.0.0"
|
|
42
42
|
},
|
|
43
43
|
"jest": {
|
|
44
44
|
"collectCoverageFrom": [
|
package/src/element/create.js
CHANGED
|
@@ -71,14 +71,6 @@ const create = (element, parent, key, options = {}) => {
|
|
|
71
71
|
return assignNode(element, parent, assignedKey)
|
|
72
72
|
}
|
|
73
73
|
|
|
74
|
-
// run `on.init`
|
|
75
|
-
if (element.on && isFunction(element.on.init)) {
|
|
76
|
-
on.init(element.on.init, element, element.state)
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
// generate a CLASS name
|
|
80
|
-
assignClass(element)
|
|
81
|
-
|
|
82
74
|
// assign METHODS
|
|
83
75
|
element.set = set
|
|
84
76
|
element.update = update
|
|
@@ -110,6 +102,14 @@ const create = (element, parent, key, options = {}) => {
|
|
|
110
102
|
// apply props settings
|
|
111
103
|
createProps(element, parent)
|
|
112
104
|
|
|
105
|
+
// run `on.init`
|
|
106
|
+
if (element.on && isFunction(element.on.init)) {
|
|
107
|
+
on.init(element.on.init, element, element.state)
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
// generate a CLASS name
|
|
111
|
+
assignClass(element)
|
|
112
|
+
|
|
113
113
|
// console.log('cache.props:')
|
|
114
114
|
// console.log(cache.props)
|
|
115
115
|
// console.log('applied props:')
|
|
@@ -4,7 +4,12 @@ import { deepClone, deepMerge, exec, isArray } from '../utils'
|
|
|
4
4
|
|
|
5
5
|
const initProps = (element, parent) => {
|
|
6
6
|
const propsStack = []
|
|
7
|
-
|
|
7
|
+
|
|
8
|
+
if (element.props === 'inherit') {
|
|
9
|
+
if (parent && parent.props) propsStack.push(parent.props)
|
|
10
|
+
} else if (element.props === 'match') {
|
|
11
|
+
if (parent && parent.props) propsStack.push(parent.props[element.key])
|
|
12
|
+
} else if (element.props) propsStack.push(element.props)
|
|
8
13
|
|
|
9
14
|
if (isArray(element.__proto)) {
|
|
10
15
|
element.__proto.map(proto => {
|