ziko 0.0.20 → 0.0.21
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/ziko.cjs +317 -186
- package/dist/ziko.js +317 -186
- package/dist/ziko.min.js +2 -2
- package/dist/ziko.mjs +314 -186
- package/package.json +2 -1
- package/src/math/functions/helper.js +30 -20
- package/src/math/functions/index.js +2 -1
- package/src/math/index.js +2 -2
- package/src/math/utils/mapfun.js +3 -2
- package/src/ui/elements/primitives/ZikoUIContainerElement.js +108 -149
- package/src/ui/elements/primitives/ZikoUIElement.js +119 -11
- package/src/ui/elements/primitives/misc/hyperscript.js +11 -0
- package/src/ui/elements/primitives/misc/index.js +3 -1
- package/src/ui/elements/primitives/misc/suspense.js +42 -0
- package/starter/bin/index.js +1 -1
- package/src/math/complex/Fractals/julia.js +0 -0
- package/src/ui/elements/derived/elements/Notification.js +0 -0
- package/src/ui/elements/derived/elements/Popover.js +0 -0
- package/src/ui/elements/derived/elements/Popup.js +0 -0
- package/src/ui/elements/derived/elements/Swipper.js +0 -4
- package/src/ui/elements/derived/elements/Timeline.js +0 -0
- package/src/ui/elements/derived/elements/Toast.js +0 -0
- package/src/ui/elements/derived/elements/Treeview.js +0 -0
- package/src/ui/elements/derived/elements/columns.js +0 -1
- package/src/ui/elements/derived/elements/fab.js +0 -0
- package/src/ui/elements/derived/elements/index.js +0 -9
|
@@ -1,20 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
1
|
+
const {PI, cos, sin, tan, acos, asin, atan, cosh, sinh, tanh, acosh, asinh, atanh, log} = Math
|
|
2
|
+
export let Fixed={
|
|
3
|
+
cos,
|
|
4
|
+
sin,
|
|
5
|
+
tan,
|
|
6
|
+
sinc: x => sin(PI*x)/(PI*x),
|
|
7
|
+
sec: x => 1/cos(x),
|
|
8
|
+
csc: x => 1/sin(x),
|
|
9
|
+
cot: x => 1/tan(x),
|
|
10
|
+
acos,
|
|
11
|
+
asin,
|
|
12
|
+
atan,
|
|
13
|
+
acot: x => PI/2-atan(x),
|
|
14
|
+
cosh,
|
|
15
|
+
sinh,
|
|
16
|
+
tanh,
|
|
17
|
+
coth: n => (1/2*log((1+n)/(1-n))),
|
|
18
|
+
acosh,
|
|
19
|
+
asinh,
|
|
20
|
+
atanh,
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
Fixed = new Proxy(Fixed, {
|
|
24
|
+
get(target, prop) {
|
|
25
|
+
if(prop in target){
|
|
26
|
+
return x => + target[prop](x).toFixed(15);
|
|
27
|
+
}
|
|
28
|
+
return undefined;
|
|
29
|
+
}
|
|
30
|
+
})
|
package/src/math/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as __Const__ from "./const.js"
|
|
2
|
-
import * as __Functions__ from "./functions"
|
|
2
|
+
import * as __Functions__ from "./functions/index.js"
|
|
3
3
|
// import * as __Signal__ from "./const.js"
|
|
4
4
|
import * as __Random__ from "./random"
|
|
5
5
|
//import { Derivation } from "./Numeric";
|
|
@@ -19,7 +19,7 @@ const Math = {
|
|
|
19
19
|
...__Calculus__,
|
|
20
20
|
}
|
|
21
21
|
export * from "./const.js"
|
|
22
|
-
export * from "./functions"
|
|
22
|
+
export * from "./functions/index.js"
|
|
23
23
|
export * from "./complex"
|
|
24
24
|
export * from "./matrix"
|
|
25
25
|
export * from "./discret"
|
package/src/math/utils/mapfun.js
CHANGED
|
@@ -42,8 +42,9 @@ const mapfun=(fun,...X)=>{
|
|
|
42
42
|
default : return fun(x)
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
|
-
else if(x instanceof Object)
|
|
46
|
-
|
|
45
|
+
else if(x instanceof Object){
|
|
46
|
+
return fun(Object) || Object.fromEntries(Object.entries(x).map(n=>n=[n[0],mapfun(fun,n[1])]))
|
|
47
|
+
}
|
|
47
48
|
});
|
|
48
49
|
return Y.length==1?Y[0]:Y;
|
|
49
50
|
}
|
|
@@ -5,160 +5,119 @@ class ZikoUIContainerElement extends ZikoUIElement {
|
|
|
5
5
|
super(element, name);
|
|
6
6
|
this.items = [];
|
|
7
7
|
}
|
|
8
|
-
maintain() {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}
|
|
14
|
-
at(index) {
|
|
15
|
-
|
|
16
|
-
}
|
|
17
|
-
#addItem(adder, pusher, ...ele) {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
this.maintain();
|
|
39
|
-
return this;
|
|
40
|
-
}
|
|
41
|
-
append(...ele) {
|
|
42
|
-
this.#addItem("append", "push", ...ele);
|
|
43
|
-
return this;
|
|
44
|
-
}
|
|
45
|
-
prepend(...ele) {
|
|
46
|
-
this.#addItem("prepend", "unshift", ...ele);
|
|
47
|
-
return this;
|
|
48
|
-
}
|
|
49
|
-
// append(...ele) {
|
|
50
|
-
// if(this.cache.isFrozzen){
|
|
51
|
-
// console.warn("You can't append new item to frozzen element");
|
|
52
|
-
// return this;
|
|
53
|
-
// }
|
|
54
|
-
// for (let i = 0; i < ele.length; i++){
|
|
55
|
-
// if(["number","string"].includes(typeof ele[i]))ele[i]=text(ele[i]);
|
|
56
|
-
// if (ele[i] instanceof ZikoUIElement) {
|
|
57
|
-
// ele[i].cache.parent=this;
|
|
58
|
-
// this.element?.appendChild(ele[i].element);
|
|
59
|
-
// ele[i].target = this.element;
|
|
60
|
-
// this.items.push(ele[i]);
|
|
61
|
-
// } else if (ele[i] instanceof Object) {
|
|
62
|
-
// if (ele[i]?.style) this.style(ele[i]?.style);
|
|
63
|
-
// if (ele[i]?.attr) {
|
|
64
|
-
// Object.entries(ele[i].attr).forEach((n) =>
|
|
65
|
-
// this.setAttr("" + n[0], n[1]),
|
|
66
|
-
// );
|
|
67
|
-
// }
|
|
8
|
+
// maintain() {
|
|
9
|
+
// for (let i = 0; i < this.items.length; i++)
|
|
10
|
+
// Object.assign(this, { [[i]]: this.items[i] });
|
|
11
|
+
// this.length = this.items.length;
|
|
12
|
+
// return this;
|
|
13
|
+
// }
|
|
14
|
+
// at(index) {
|
|
15
|
+
// return this.items.at(index);
|
|
16
|
+
// }
|
|
17
|
+
// #addItem(adder, pusher, ...ele) {
|
|
18
|
+
// if (this.cache.isFrozzen) {
|
|
19
|
+
// console.warn("You can't append new item to frozzen element");
|
|
20
|
+
// return this;
|
|
21
|
+
// }
|
|
22
|
+
// for (let i = 0; i < ele.length; i++) {
|
|
23
|
+
// if (["number", "string"].includes(typeof ele[i])) ele[i] = text(ele[i]);
|
|
24
|
+
// if (ele[i] instanceof ZikoUIElement) {
|
|
25
|
+
// ele[i].cache.parent = this;
|
|
26
|
+
// this.element[adder](ele[i].element);
|
|
27
|
+
// ele[i].target = this.element;
|
|
28
|
+
// this.items[pusher](ele[i]);
|
|
29
|
+
// } else if (ele[i] instanceof Object) {
|
|
30
|
+
// if (ele[i]?.style) this.style(ele[i]?.style);
|
|
31
|
+
// if (ele[i]?.attr) {
|
|
32
|
+
// Object.entries(ele[i].attr).forEach((n) =>
|
|
33
|
+
// this.setAttr("" + n[0], n[1]),
|
|
34
|
+
// );
|
|
68
35
|
// }
|
|
69
36
|
// }
|
|
70
|
-
// this.maintain();
|
|
71
|
-
// return this;
|
|
72
37
|
// }
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
38
|
+
// this.maintain();
|
|
39
|
+
// return this;
|
|
40
|
+
// }
|
|
41
|
+
// append(...ele) {
|
|
42
|
+
// this.#addItem("append", "push", ...ele);
|
|
43
|
+
// return this;
|
|
44
|
+
// }
|
|
45
|
+
// prepend(...ele) {
|
|
46
|
+
// this.#addItem("prepend", "unshift", ...ele);
|
|
47
|
+
// return this;
|
|
48
|
+
// }
|
|
49
|
+
// insertAt(index, ...ele) {
|
|
50
|
+
// if (index >= this.element.children.length) this.append(...ele);
|
|
51
|
+
// else
|
|
52
|
+
// for (let i = 0; i < ele.length; i++) {
|
|
53
|
+
// if (["number", "string"].includes(typeof ele[i])) ele[i] = text(ele[i]);
|
|
54
|
+
// this.element?.insertBefore(ele[i].element, this.items[index].element);
|
|
55
|
+
// this.items.splice(index, 0, ele[i]);
|
|
56
|
+
// }
|
|
57
|
+
// return this;
|
|
58
|
+
// }
|
|
83
59
|
// remove(...ele) {
|
|
84
|
-
//
|
|
85
|
-
// if(
|
|
86
|
-
//
|
|
87
|
-
//
|
|
88
|
-
//
|
|
89
|
-
//
|
|
90
|
-
//
|
|
91
|
-
//
|
|
92
|
-
//
|
|
93
|
-
//
|
|
94
|
-
//
|
|
95
|
-
//
|
|
96
|
-
//
|
|
97
|
-
//
|
|
60
|
+
// const remove = (ele) => {
|
|
61
|
+
// if (typeof ele === "number") ele = this.items[ele];
|
|
62
|
+
// if (ele instanceof ZikoUIElement) this.element?.removeChild(ele.element);
|
|
63
|
+
// this.items = this.items.filter((n) => n !== ele);
|
|
64
|
+
// };
|
|
65
|
+
// for (let i = 0; i < ele.length; i++) remove(ele[i]);
|
|
66
|
+
// for (let i = 0; i < this.items.length; i++)
|
|
67
|
+
// Object.assign(this, { [[i]]: this.items[i] });
|
|
68
|
+
// // Remove from item
|
|
69
|
+
// return this;
|
|
70
|
+
// }
|
|
71
|
+
// forEach(callback) {
|
|
72
|
+
// this.items.forEach(callback);
|
|
73
|
+
// return this;
|
|
74
|
+
// }
|
|
75
|
+
// map(callback) {
|
|
76
|
+
// return this.items.map(callback);
|
|
77
|
+
// }
|
|
78
|
+
// find(condition) {
|
|
79
|
+
// return this.items.filter(condition);
|
|
80
|
+
// }
|
|
81
|
+
// filter(condition_callback, if_callback = () => {}, else_callback = () => {}) {
|
|
82
|
+
// const FilterItems = this.items.filter(condition_callback);
|
|
83
|
+
// FilterItems.forEach(if_callback);
|
|
84
|
+
// this.items
|
|
85
|
+
// .filter((item) => !FilterItems.includes(item))
|
|
86
|
+
// .forEach(else_callback);
|
|
87
|
+
// return this;
|
|
88
|
+
// }
|
|
89
|
+
// filterByTextContent(text, exactMatch = false) {
|
|
90
|
+
// this.items.forEach((n) => n.render());
|
|
91
|
+
// this.filter(
|
|
92
|
+
// (n) => !(exactMatch ? n.text === text : n.text.includes(text)),
|
|
93
|
+
// (e) => e.unrender(),
|
|
94
|
+
// );
|
|
95
|
+
// // this.items.filter(n=>{
|
|
96
|
+
// // const content=n.element.textContent;
|
|
97
|
+
// // return !(exactMatch?content===text:content.includes(text))
|
|
98
|
+
// // }).map(n=>n.unrender());
|
|
99
|
+
// // return this;
|
|
100
|
+
// }
|
|
101
|
+
// filterByClass(value) {
|
|
102
|
+
// this.items.map((n) => n.render());
|
|
103
|
+
// this.items
|
|
104
|
+
// .filter((n) => !n.classes.includes(value))
|
|
105
|
+
// .map((n) => n.unrender());
|
|
106
|
+
// return this;
|
|
107
|
+
// }
|
|
108
|
+
// sortByTextContent(value, displays) {
|
|
109
|
+
// let item = this.children;
|
|
110
|
+
// item
|
|
111
|
+
// .filter((n) => !n.textContent.toLowerCase().includes(value.toLowerCase()))
|
|
112
|
+
// .map((n) => {
|
|
113
|
+
// n.style.display = "none";
|
|
114
|
+
// });
|
|
115
|
+
// item
|
|
116
|
+
// .filter((n) => n.textContent.toLowerCase().includes(value.toLowerCase()))
|
|
117
|
+
// .map((n, i) => (n.style.display = displays[i]));
|
|
118
|
+
// //return item.filter(n=>n.style.display!="none")
|
|
119
|
+
// item.filter((n) => n.style.display != "none");
|
|
98
120
|
// return this;
|
|
99
121
|
// }
|
|
100
|
-
remove(...ele) {
|
|
101
|
-
const remove = (ele) => {
|
|
102
|
-
if (typeof ele === "number") ele = this.items[ele];
|
|
103
|
-
if (ele instanceof ZikoUIElement) this.element?.removeChild(ele.element);
|
|
104
|
-
this.items = this.items.filter((n) => n !== ele);
|
|
105
|
-
};
|
|
106
|
-
for (let i = 0; i < ele.length; i++) remove(ele[i]);
|
|
107
|
-
for (let i = 0; i < this.items.length; i++)
|
|
108
|
-
Object.assign(this, { [[i]]: this.items[i] });
|
|
109
|
-
// Remove from item
|
|
110
|
-
return this;
|
|
111
|
-
}
|
|
112
|
-
forEach(callback) {
|
|
113
|
-
this.items.forEach(callback);
|
|
114
|
-
return this;
|
|
115
|
-
}
|
|
116
|
-
map(callback) {
|
|
117
|
-
return this.items.map(callback);
|
|
118
|
-
}
|
|
119
|
-
find(condition) {
|
|
120
|
-
return this.items.filter(condition);
|
|
121
|
-
}
|
|
122
|
-
filter(condition_callback, if_callback = () => {}, else_callback = () => {}) {
|
|
123
|
-
const FilterItems = this.items.filter(condition_callback);
|
|
124
|
-
FilterItems.forEach(if_callback);
|
|
125
|
-
this.items
|
|
126
|
-
.filter((item) => !FilterItems.includes(item))
|
|
127
|
-
.forEach(else_callback);
|
|
128
|
-
return this;
|
|
129
|
-
}
|
|
130
|
-
filterByTextContent(text, exactMatch = false) {
|
|
131
|
-
this.items.forEach((n) => n.render());
|
|
132
|
-
this.filter(
|
|
133
|
-
(n) => !(exactMatch ? n.text === text : n.text.includes(text)),
|
|
134
|
-
(e) => e.unrender(),
|
|
135
|
-
);
|
|
136
|
-
// this.items.filter(n=>{
|
|
137
|
-
// const content=n.element.textContent;
|
|
138
|
-
// return !(exactMatch?content===text:content.includes(text))
|
|
139
|
-
// }).map(n=>n.unrender());
|
|
140
|
-
// return this;
|
|
141
|
-
}
|
|
142
|
-
filterByClass(value) {
|
|
143
|
-
this.items.map((n) => n.render());
|
|
144
|
-
this.items
|
|
145
|
-
.filter((n) => !n.classes.includes(value))
|
|
146
|
-
.map((n) => n.unrender());
|
|
147
|
-
return this;
|
|
148
|
-
}
|
|
149
|
-
sortByTextContent(value, displays) {
|
|
150
|
-
let item = this.children;
|
|
151
|
-
item
|
|
152
|
-
.filter((n) => !n.textContent.toLowerCase().includes(value.toLowerCase()))
|
|
153
|
-
.map((n) => {
|
|
154
|
-
n.style.display = "none";
|
|
155
|
-
});
|
|
156
|
-
item
|
|
157
|
-
.filter((n) => n.textContent.toLowerCase().includes(value.toLowerCase()))
|
|
158
|
-
.map((n, i) => (n.style.display = displays[i]));
|
|
159
|
-
//return item.filter(n=>n.style.display!="none")
|
|
160
|
-
item.filter((n) => n.style.display != "none");
|
|
161
|
-
return this;
|
|
162
|
-
}
|
|
163
122
|
}
|
|
164
123
|
export default ZikoUIContainerElement;
|
|
@@ -25,7 +25,7 @@ class ZikoUIElement {
|
|
|
25
25
|
if(typeof element === "string") {
|
|
26
26
|
element === "svg" ? element=globalThis?.document?.createElementNS("http://www.w3.org/2000/svg", "svg"): element = globalThis?.document?.createElement(element);
|
|
27
27
|
}
|
|
28
|
-
if(element)this.
|
|
28
|
+
if(element)this.__ele__ = element;
|
|
29
29
|
this.uuid=this.constructor.name+"-"+Random.string(10);
|
|
30
30
|
this.cache = {
|
|
31
31
|
name,
|
|
@@ -61,14 +61,17 @@ class ZikoUIElement {
|
|
|
61
61
|
this.style({
|
|
62
62
|
position: "relative",
|
|
63
63
|
boxSizing:"border-box",
|
|
64
|
-
// fontFamily:"verdana",
|
|
65
64
|
margin:0,
|
|
66
65
|
padding:0,
|
|
67
66
|
});
|
|
67
|
+
this.items = [];
|
|
68
68
|
this.size("auto", "auto");
|
|
69
69
|
globalThis.__Ziko__.__UI__[this.cache.name]?globalThis.__Ziko__.__UI__[this.cache.name]?.push(this):globalThis.__Ziko__.__UI__[this.cache.name]=[this];
|
|
70
70
|
element && globalThis.__Ziko__.__Config__.default.render && this.render()
|
|
71
71
|
}
|
|
72
|
+
get element(){
|
|
73
|
+
return this.__ele__
|
|
74
|
+
}
|
|
72
75
|
get isZikoUIElement(){
|
|
73
76
|
return true
|
|
74
77
|
}
|
|
@@ -90,15 +93,6 @@ class ZikoUIElement {
|
|
|
90
93
|
get isBody(){
|
|
91
94
|
return this.element === globalThis?.document.body;
|
|
92
95
|
}
|
|
93
|
-
get __app__(){
|
|
94
|
-
if(this.cache.isRoot)return this;
|
|
95
|
-
let root=this.cache.parent;
|
|
96
|
-
while(1){
|
|
97
|
-
if(!root)return null;
|
|
98
|
-
if(root.cache.isRoot)return root;
|
|
99
|
-
root=root.parent;
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
96
|
get parent(){
|
|
103
97
|
return this.cache.parent;
|
|
104
98
|
}
|
|
@@ -138,6 +132,120 @@ class ZikoUIElement {
|
|
|
138
132
|
this.st.size(width,height);
|
|
139
133
|
return this;
|
|
140
134
|
}
|
|
135
|
+
maintain() {
|
|
136
|
+
for (let i = 0; i < this.items.length; i++)
|
|
137
|
+
Object.assign(this, { [[i]]: this.items[i] });
|
|
138
|
+
this.length = this.items.length;
|
|
139
|
+
return this;
|
|
140
|
+
}
|
|
141
|
+
at(index) {
|
|
142
|
+
return this.items.at(index);
|
|
143
|
+
}
|
|
144
|
+
#addItem(adder, pusher, ...ele) {
|
|
145
|
+
if (this.cache.isFrozzen) {
|
|
146
|
+
console.warn("You can't append new item to frozzen element");
|
|
147
|
+
return this;
|
|
148
|
+
}
|
|
149
|
+
for (let i = 0; i < ele.length; i++) {
|
|
150
|
+
if (["number", "string"].includes(typeof ele[i])) ele[i] = text(ele[i]);
|
|
151
|
+
if (ele[i] instanceof ZikoUIElement) {
|
|
152
|
+
ele[i].cache.parent = this;
|
|
153
|
+
this.element[adder](ele[i].element);
|
|
154
|
+
ele[i].target = this.element;
|
|
155
|
+
this.items[pusher](ele[i]);
|
|
156
|
+
} else if (ele[i] instanceof Object) {
|
|
157
|
+
if (ele[i]?.style) this.style(ele[i]?.style);
|
|
158
|
+
if (ele[i]?.attr) {
|
|
159
|
+
Object.entries(ele[i].attr).forEach((n) =>
|
|
160
|
+
this.setAttr("" + n[0], n[1]),
|
|
161
|
+
);
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
this.maintain();
|
|
166
|
+
return this;
|
|
167
|
+
}
|
|
168
|
+
append(...ele) {
|
|
169
|
+
this.#addItem("append", "push", ...ele);
|
|
170
|
+
return this;
|
|
171
|
+
}
|
|
172
|
+
prepend(...ele) {
|
|
173
|
+
this.#addItem("prepend", "unshift", ...ele);
|
|
174
|
+
return this;
|
|
175
|
+
}
|
|
176
|
+
insertAt(index, ...ele) {
|
|
177
|
+
if (index >= this.element.children.length) this.append(...ele);
|
|
178
|
+
else
|
|
179
|
+
for (let i = 0; i < ele.length; i++) {
|
|
180
|
+
if (["number", "string"].includes(typeof ele[i])) ele[i] = text(ele[i]);
|
|
181
|
+
this.element?.insertBefore(ele[i].element, this.items[index].element);
|
|
182
|
+
this.items.splice(index, 0, ele[i]);
|
|
183
|
+
}
|
|
184
|
+
return this;
|
|
185
|
+
}
|
|
186
|
+
remove(...ele) {
|
|
187
|
+
const remove = (ele) => {
|
|
188
|
+
if (typeof ele === "number") ele = this.items[ele];
|
|
189
|
+
if (ele instanceof ZikoUIElement) this.element?.removeChild(ele.element);
|
|
190
|
+
this.items = this.items.filter((n) => n !== ele);
|
|
191
|
+
};
|
|
192
|
+
for (let i = 0; i < ele.length; i++) remove(ele[i]);
|
|
193
|
+
for (let i = 0; i < this.items.length; i++)
|
|
194
|
+
Object.assign(this, { [[i]]: this.items[i] });
|
|
195
|
+
// Remove from item
|
|
196
|
+
return this;
|
|
197
|
+
}
|
|
198
|
+
forEach(callback) {
|
|
199
|
+
this.items.forEach(callback);
|
|
200
|
+
return this;
|
|
201
|
+
}
|
|
202
|
+
map(callback) {
|
|
203
|
+
return this.items.map(callback);
|
|
204
|
+
}
|
|
205
|
+
find(condition) {
|
|
206
|
+
return this.items.filter(condition);
|
|
207
|
+
}
|
|
208
|
+
filter(condition_callback, if_callback = () => {}, else_callback = () => {}) {
|
|
209
|
+
const FilterItems = this.items.filter(condition_callback);
|
|
210
|
+
FilterItems.forEach(if_callback);
|
|
211
|
+
this.items
|
|
212
|
+
.filter((item) => !FilterItems.includes(item))
|
|
213
|
+
.forEach(else_callback);
|
|
214
|
+
return this;
|
|
215
|
+
}
|
|
216
|
+
filterByTextContent(text, exactMatch = false) {
|
|
217
|
+
this.items.forEach((n) => n.render());
|
|
218
|
+
this.filter(
|
|
219
|
+
(n) => !(exactMatch ? n.text === text : n.text.includes(text)),
|
|
220
|
+
(e) => e.unrender(),
|
|
221
|
+
);
|
|
222
|
+
// this.items.filter(n=>{
|
|
223
|
+
// const content=n.element.textContent;
|
|
224
|
+
// return !(exactMatch?content===text:content.includes(text))
|
|
225
|
+
// }).map(n=>n.unrender());
|
|
226
|
+
// return this;
|
|
227
|
+
}
|
|
228
|
+
filterByClass(value) {
|
|
229
|
+
this.items.map((n) => n.render());
|
|
230
|
+
this.items
|
|
231
|
+
.filter((n) => !n.classes.includes(value))
|
|
232
|
+
.map((n) => n.unrender());
|
|
233
|
+
return this;
|
|
234
|
+
}
|
|
235
|
+
sortByTextContent(value, displays) {
|
|
236
|
+
let item = this.children;
|
|
237
|
+
item
|
|
238
|
+
.filter((n) => !n.textContent.toLowerCase().includes(value.toLowerCase()))
|
|
239
|
+
.map((n) => {
|
|
240
|
+
n.style.display = "none";
|
|
241
|
+
});
|
|
242
|
+
item
|
|
243
|
+
.filter((n) => n.textContent.toLowerCase().includes(value.toLowerCase()))
|
|
244
|
+
.map((n, i) => (n.style.display = displays[i]));
|
|
245
|
+
//return item.filter(n=>n.style.display!="none")
|
|
246
|
+
item.filter((n) => n.style.display != "none");
|
|
247
|
+
return this;
|
|
248
|
+
}
|
|
141
249
|
get #SwitchedStyleRTL_LTR(){
|
|
142
250
|
const CalculedStyle = globalThis.getComputedStyle(this.element);
|
|
143
251
|
const SwitchedStyle = {}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import ZikoUIElement from "../ZikoUIElement.js";
|
|
2
|
+
function h(tag, attributes = {}, ...children){
|
|
3
|
+
const {name, style, ...attrs} = attributes
|
|
4
|
+
let element = new ZikoUIElement(tag,name);
|
|
5
|
+
style && element.style(style);
|
|
6
|
+
attrs && element.setAttr(attrs);
|
|
7
|
+
children && element.append(...children)
|
|
8
|
+
return element
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export {h}
|
|
@@ -85,7 +85,9 @@ class ZikoUIBr extends ZikoUIElement {
|
|
|
85
85
|
const link=(href,...UIElement)=>new ZikoUILink(href).append(...UIElement);
|
|
86
86
|
const html=(tag,...UIElement)=>new ZikoUIHtmlTag(tag).append(...UIElement);
|
|
87
87
|
const btn = (value) => new ZikoUIBtn(value);
|
|
88
|
-
export * from "./xml-wrapper.js"
|
|
88
|
+
export * from "./xml-wrapper.js";
|
|
89
|
+
export * from "./suspense.js"
|
|
90
|
+
export * from "./hyperscript.js"
|
|
89
91
|
export{
|
|
90
92
|
html,
|
|
91
93
|
btn,
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import ZikoUIElement from "../ZikoUIElement.js";
|
|
2
|
+
// function loadComponent() {
|
|
3
|
+
// return new Promise((resolve) => {
|
|
4
|
+
// setTimeout(() => {
|
|
5
|
+
// resolve(p(1000))
|
|
6
|
+
// }, 500);
|
|
7
|
+
// });
|
|
8
|
+
// }
|
|
9
|
+
|
|
10
|
+
// Suspense(p("Loading ..."),()=>fetch('https://jsonplaceholder.typicode.com/todos/1')
|
|
11
|
+
// .then(response => response.json())
|
|
12
|
+
// .then(json => h2(json.title)))
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
class ZikoUISuspense extends ZikoUIElement{
|
|
17
|
+
constructor(fallback_ui, callback){
|
|
18
|
+
super("div", "suspense")
|
|
19
|
+
this.setAttr({
|
|
20
|
+
dataTemp : "suspense"
|
|
21
|
+
})
|
|
22
|
+
this.fallback_ui = fallback_ui
|
|
23
|
+
this.append(fallback_ui);
|
|
24
|
+
(async ()=>{
|
|
25
|
+
try{
|
|
26
|
+
const ui = await callback()
|
|
27
|
+
fallback_ui.unrender()
|
|
28
|
+
this.append(ui)
|
|
29
|
+
// console.log(content)
|
|
30
|
+
}
|
|
31
|
+
catch(error){
|
|
32
|
+
console.log({error})
|
|
33
|
+
}
|
|
34
|
+
})()
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
const Suspense = (fallback_ui, callback) => new ZikoUISuspense(fallback_ui, callback);
|
|
39
|
+
export{
|
|
40
|
+
ZikoUISuspense,
|
|
41
|
+
Suspense
|
|
42
|
+
}
|
package/starter/bin/index.js
CHANGED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
// dipslay table
|
|
File without changes
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
export * from "./accordion/index.js";
|
|
2
|
-
export * from "./carousel/index.js";
|
|
3
|
-
export * from "./code-note/index.js";
|
|
4
|
-
export * from "./tabs/index.js";
|
|
5
|
-
export * from "./alert/index.js";
|
|
6
|
-
export * from "./splitter/index.js";
|
|
7
|
-
export * from "./pagination/index.js";
|
|
8
|
-
export * from "./menu/index.js";
|
|
9
|
-
export * from "./modal/index.js"
|