vaderjs 1.4.1-ui7iuy47 → 1.4.2-jpiml56
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/.editorconfig +11 -0
- package/.vscode/c_cpp_properties.json +21 -0
- package/.vscode/settings.json +12 -0
- package/README.md +44 -197
- package/binaries/Kalix/index.js +673 -0
- package/binaries/compiler/main.js +540 -0
- package/binaries/vader.js +74 -0
- package/binaries/watcher/hmr.js +41 -0
- package/client/index.d.ts +226 -0
- package/client/runtime/index.js +1 -0
- package/client/runtime/router.js +1 -0
- package/config/index.ts +87 -0
- package/index.ts +344 -0
- package/package.json +13 -25
- package/plugins/cloudflare/functions/index.js +102 -0
- package/plugins/cloudflare/toCopy/@server/Kalix/index.js +673 -0
- package/plugins/cloudflare/toCopy/@server/cloudflare_ssr/index.js +85 -0
- package/plugins/cloudflare/toCopy/node_modules/vaderjs/server/index.js +99 -0
- package/plugins/cloudflare/toCopy/src/client.js +1 -0
- package/plugins/cloudflare/toCopy/src/router.js +1 -0
- package/plugins/ssg/index.js +197 -0
- package/plugins/tailwindcss/index.ts +93 -0
- package/plugins/vercel/functions/index.ts +8 -0
- package/router/index.ts +208 -0
- package/server/index.js +143 -0
- package/vader_dev.js +177 -0
- package/@integrations/ssg.js +0 -189
- package/LICENSE +0 -21
- package/binaries/IPC/index.js +0 -277
- package/binaries/main.js +0 -1464
- package/binaries/readme.md +0 -4
- package/binaries/watcher.js +0 -74
- package/binaries/win32/check.ps1 +0 -7
- package/client/index.js +0 -426
- package/config/index.js +0 -36
- package/logo.png +0 -0
- package/runtime/router.js +0 -1
- package/runtime/vader.js +0 -1
- package/vader.js +0 -230
package/binaries/readme.md
DELETED
package/binaries/watcher.js
DELETED
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
|
|
3
|
-
* @file watcher.js
|
|
4
|
-
|
|
5
|
-
* @description This file is used as a polyfill for missing functionality of bun.js fs watch on windows
|
|
6
|
-
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import { watch } from "fs";
|
|
10
|
-
|
|
11
|
-
import IPC from "../binaries/IPC/index.js";
|
|
12
|
-
|
|
13
|
-
IPC.NOLISTEN = true;
|
|
14
|
-
|
|
15
|
-
const s = await IPC.newServer(IPC.typeEnums.WATCHER, { port: process.env.PORT || 3434 });
|
|
16
|
-
|
|
17
|
-
console = s.Console;
|
|
18
|
-
|
|
19
|
-
process.cwd = () => {
|
|
20
|
-
return process.env.PWD;
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
let folders = process.env.FOLDERS.split(",");
|
|
24
|
-
|
|
25
|
-
let hasSent = false;
|
|
26
|
-
|
|
27
|
-
folders.forEach((folder) => {
|
|
28
|
-
watch(process.cwd() + "/" + folder, { recursive: true }, (event, filename) => {
|
|
29
|
-
switch (event) {
|
|
30
|
-
case "change":
|
|
31
|
-
if (!hasSent) {
|
|
32
|
-
console.log({ type: "change", filename });
|
|
33
|
-
|
|
34
|
-
hasSent = true;
|
|
35
|
-
|
|
36
|
-
setTimeout(() => {
|
|
37
|
-
hasSent = false;
|
|
38
|
-
}, 1000);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
break;
|
|
42
|
-
|
|
43
|
-
case "add":
|
|
44
|
-
if (!hasSent) {
|
|
45
|
-
console.log({ type: "add", filename });
|
|
46
|
-
|
|
47
|
-
hasSent = true;
|
|
48
|
-
|
|
49
|
-
setTimeout(() => {
|
|
50
|
-
hasSent = false;
|
|
51
|
-
}, 500);
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
break;
|
|
55
|
-
|
|
56
|
-
case "close":
|
|
57
|
-
if (!hasSent) {
|
|
58
|
-
console.log({ type: "close", filename });
|
|
59
|
-
|
|
60
|
-
hasSent = true;
|
|
61
|
-
|
|
62
|
-
setTimeout(() => {
|
|
63
|
-
hasSent = false;
|
|
64
|
-
}, 500);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
break;
|
|
68
|
-
}
|
|
69
|
-
});
|
|
70
|
-
});
|
|
71
|
-
|
|
72
|
-
process.on("exit", function (code) {
|
|
73
|
-
console.log("About to exit with code:", code);
|
|
74
|
-
});
|
package/binaries/win32/check.ps1
DELETED
package/client/index.js
DELETED
|
@@ -1,426 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @file Vader.js - A lightweight, modern, and fast front-end framework for building web applications.
|
|
3
|
-
* @copyright - Malikwhitten67
|
|
4
|
-
* @license MIT
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* @class Component
|
|
10
|
-
* @description Base class for all components - functional and class components
|
|
11
|
-
* @example
|
|
12
|
-
* class App extends Component {
|
|
13
|
-
* constructor(props){
|
|
14
|
-
* super(props)
|
|
15
|
-
* this.state = {
|
|
16
|
-
* count: 0
|
|
17
|
-
* }
|
|
18
|
-
* }
|
|
19
|
-
*
|
|
20
|
-
* render(){
|
|
21
|
-
* return <div>
|
|
22
|
-
* <h1>Count is {this.state.count}</h1>
|
|
23
|
-
* <button onClick={()=> this.setState({count: this.state.count + 1})}>Click me</button>
|
|
24
|
-
* </div>
|
|
25
|
-
* }
|
|
26
|
-
* }
|
|
27
|
-
*
|
|
28
|
-
*/
|
|
29
|
-
export class Component {
|
|
30
|
-
/**
|
|
31
|
-
* @constructor
|
|
32
|
-
* @param {object} props - Component props
|
|
33
|
-
* @param {string} props.key - Unique identifier for the component
|
|
34
|
-
* @param {object} props.children - Content to be displayed inside the component
|
|
35
|
-
*/
|
|
36
|
-
constructor() {
|
|
37
|
-
this.state = {};
|
|
38
|
-
this.props = {};
|
|
39
|
-
this.key = Math.random();
|
|
40
|
-
this.__internalInstance = {};
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
/**
|
|
44
|
-
* @function
|
|
45
|
-
* @description This method allows you to update the state of a component
|
|
46
|
-
*/
|
|
47
|
-
render() {}
|
|
48
|
-
/**
|
|
49
|
-
* @function
|
|
50
|
-
* @description This method allows you to update the state of a component
|
|
51
|
-
* **/
|
|
52
|
-
onMount() {}
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* @function
|
|
56
|
-
* @description This method allows you to update the state of a component
|
|
57
|
-
* @param {any} initialValue
|
|
58
|
-
* @returns {[any, Function]}
|
|
59
|
-
*/
|
|
60
|
-
|
|
61
|
-
useState(initialValue) {
|
|
62
|
-
if (!this.state[key]) this.state[key] = initialValue;
|
|
63
|
-
let state = this.state[key];
|
|
64
|
-
const setState = (newState) => {
|
|
65
|
-
state = newState;
|
|
66
|
-
this.state[key] = newState;
|
|
67
|
-
this.updateInstance(this.__internalInstance);
|
|
68
|
-
};
|
|
69
|
-
const getUpdatedState = () => {
|
|
70
|
-
return this.state[key] || initialValue;
|
|
71
|
-
}
|
|
72
|
-
state = getUpdatedState();
|
|
73
|
-
return [state, setState];
|
|
74
|
-
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* @function useRef
|
|
79
|
-
* @description This method allows you to create a reference to a DOM element
|
|
80
|
-
* @param {string} key
|
|
81
|
-
* @param {any} initialValue
|
|
82
|
-
* @returns {current: any}
|
|
83
|
-
*/
|
|
84
|
-
useRef(initialValue) {
|
|
85
|
-
return {current: initialValue}
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
/**
|
|
89
|
-
* @function useReducer
|
|
90
|
-
* @description This method allows you to use a reducer to manage state
|
|
91
|
-
* @param {function} reducer
|
|
92
|
-
* @param {any} initialState
|
|
93
|
-
*/
|
|
94
|
-
useReducer(reducer, initialState) {
|
|
95
|
-
if (!this.state[key]) this.state[key] = initialState;
|
|
96
|
-
let state = this.state[key];
|
|
97
|
-
const setState = (newState) => {
|
|
98
|
-
state = newState;
|
|
99
|
-
this.state[key] = newState;
|
|
100
|
-
this.updateInstance(this.__internalInstance);
|
|
101
|
-
};
|
|
102
|
-
const getUpdatedState = () => {
|
|
103
|
-
return this.state[key] || initialState;
|
|
104
|
-
}
|
|
105
|
-
state = getUpdatedState();
|
|
106
|
-
return [state, setState];
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
/**
|
|
112
|
-
* @method Mounted
|
|
113
|
-
* @description This method allows you to await until the component is mounted before running a callback
|
|
114
|
-
*
|
|
115
|
-
* @param {function} callback - Function to be called when the component is mounted
|
|
116
|
-
* @param {Component} component - Component to be determined mounted
|
|
117
|
-
* @param {boolean} runOnlyOnce - Run the callback only once - default: true
|
|
118
|
-
*/
|
|
119
|
-
export const Mounted = (callback, /**@type {Component} */ component, runOnlyOnce = true) => {
|
|
120
|
-
|
|
121
|
-
};
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
/**
|
|
134
|
-
* @class Link
|
|
135
|
-
* @description Allows you to seamlessly navigate to different pages in your application
|
|
136
|
-
* @extends Component
|
|
137
|
-
* @example
|
|
138
|
-
* <Link href="/some-path" class="custom-link" style="color: blue;">Click me!</Link>
|
|
139
|
-
*/
|
|
140
|
-
export class Link extends Component {
|
|
141
|
-
/**
|
|
142
|
-
* @constructor
|
|
143
|
-
* @param {object} props - Component props
|
|
144
|
-
* @param {string} props.href - URL for the link
|
|
145
|
-
* @param {string} props.action - Action to be performed when the link is clicked - can be function or string
|
|
146
|
-
* @param {string} [props.class] - CSS class for the link
|
|
147
|
-
* @param {string} [props.style] - Inline CSS style for the link
|
|
148
|
-
* @param {string} [props.children] - Content to be displayed inside the link
|
|
149
|
-
*/
|
|
150
|
-
constructor(props) {
|
|
151
|
-
super(props);
|
|
152
|
-
/**
|
|
153
|
-
* @type {object}
|
|
154
|
-
* @property {string} href - URL for the link
|
|
155
|
-
* @property {string} [action] - Action to be performed when the link is clicked
|
|
156
|
-
* @property {string} [class] - CSS class for the link
|
|
157
|
-
* @property {string} [style] - Inline CSS style for the link
|
|
158
|
-
* @property {string} [children] - Content to be displayed inside the link
|
|
159
|
-
*/
|
|
160
|
-
this.props = {
|
|
161
|
-
href: props.href,
|
|
162
|
-
/**
|
|
163
|
-
* @type {string|function}
|
|
164
|
-
* @param {string} [action='outside'] - Action to be performed when the link is clicked
|
|
165
|
-
*/
|
|
166
|
-
action: props.action || 'outside',
|
|
167
|
-
class: props.class,
|
|
168
|
-
style: props.style,
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
/**
|
|
172
|
-
* @type {HTMLAnchorElement}
|
|
173
|
-
*/
|
|
174
|
-
this.link = document.createElement('a');
|
|
175
|
-
|
|
176
|
-
/**
|
|
177
|
-
* @type {string}
|
|
178
|
-
*/
|
|
179
|
-
this.key = props.href + Math.random();
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
/**
|
|
183
|
-
* @function
|
|
184
|
-
* @returns {string} - Rendered HTML for the Link component
|
|
185
|
-
*/
|
|
186
|
-
render() {
|
|
187
|
-
|
|
188
|
-
return this.link.outerHTML;
|
|
189
|
-
}
|
|
190
|
-
}
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
/**
|
|
195
|
-
* @class Image
|
|
196
|
-
* @description Image component
|
|
197
|
-
* @extends Component
|
|
198
|
-
* @example
|
|
199
|
-
* <Image src="https://via.placeholder.com/150" alt="image" />
|
|
200
|
-
*/
|
|
201
|
-
export class Image extends Component {
|
|
202
|
-
/**
|
|
203
|
-
* @constructor
|
|
204
|
-
* @param {object} props - Component props
|
|
205
|
-
* @param {string} props.src - Image source URL
|
|
206
|
-
* @param {string} props.class - CSS class for the image
|
|
207
|
-
* @param {string} props.style - Inline CSS style for the image
|
|
208
|
-
* @param {number} props.blur - Blur value for the image (optional)
|
|
209
|
-
* @param {number} props.width - Width of the image (optional)
|
|
210
|
-
* @param {number} props.height - Height of the image (optional)
|
|
211
|
-
* @param {boolean} props.optimize - Optimize the image (optional, default: true)
|
|
212
|
-
* @param {boolean} props.loader - Show a placeholder loader (optional, default: true)
|
|
213
|
-
* @param {string} props.alt - Alt text for the image (optional, default: 'image')
|
|
214
|
-
*/
|
|
215
|
-
constructor(props) {
|
|
216
|
-
super(props);
|
|
217
|
-
|
|
218
|
-
/**
|
|
219
|
-
* @type {object}
|
|
220
|
-
* @property {string} src - Image source URL
|
|
221
|
-
* @property {string} [class] - CSS class for the image
|
|
222
|
-
* @property {string} [style] - Inline CSS style for the image
|
|
223
|
-
* @property {number} [blur] - Blur value for the image (optional)
|
|
224
|
-
* @property {number} [width] - Width of the image (optional)
|
|
225
|
-
* @property {number} [height] - Height of the image (optional)
|
|
226
|
-
* @property {boolean} [optimize] - Optimize the image (optional, default: true)
|
|
227
|
-
* @property {boolean} [loader] - Show a placeholder loader (optional, default: true)
|
|
228
|
-
* @property {string} [alt] - Alt text for the image (optional, default: 'image')
|
|
229
|
-
* @property {string} [children] - Content to be displayed inside the image
|
|
230
|
-
* @property {string} [key] - Unique identifier for the image
|
|
231
|
-
* @property {string} [onLoad] - Function to be called when the image is loaded
|
|
232
|
-
*/
|
|
233
|
-
this.props = {
|
|
234
|
-
src: props.src,
|
|
235
|
-
class: props.class,
|
|
236
|
-
style: props.style,
|
|
237
|
-
blur: props.blur,
|
|
238
|
-
width: props.width,
|
|
239
|
-
height: props.height,
|
|
240
|
-
optimize: props.optimize || true,
|
|
241
|
-
loader: props.loader || true,
|
|
242
|
-
alt: props.alt || 'image',
|
|
243
|
-
};
|
|
244
|
-
|
|
245
|
-
/**
|
|
246
|
-
* @type {string}
|
|
247
|
-
*/
|
|
248
|
-
this.key = props.src + Math.random();
|
|
249
|
-
|
|
250
|
-
/**
|
|
251
|
-
* @type {HTMLImageElement}
|
|
252
|
-
* @private
|
|
253
|
-
*/
|
|
254
|
-
this.img = document.createElement('img');
|
|
255
|
-
|
|
256
|
-
/**
|
|
257
|
-
* @type {HTMLDivElement}
|
|
258
|
-
* @private
|
|
259
|
-
*/
|
|
260
|
-
this.placeholder = document.createElement('div');
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
/**
|
|
264
|
-
* @function
|
|
265
|
-
* @returns {string} - Rendered JSX for the Image component
|
|
266
|
-
*/
|
|
267
|
-
render() {
|
|
268
|
-
// adjust width and height to the user's screen size
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
return this.img.outerHTML;
|
|
272
|
-
}
|
|
273
|
-
}
|
|
274
|
-
|
|
275
|
-
export class Head extends Component {
|
|
276
|
-
/**
|
|
277
|
-
* @constructor
|
|
278
|
-
* @param {object} props - Component props
|
|
279
|
-
* @param {boolean} props.updateOnReload - update metadata and title when rerendered
|
|
280
|
-
* @param {string} props.children - Content to be displayed inside the head
|
|
281
|
-
*/
|
|
282
|
-
constructor(props) {
|
|
283
|
-
super(props);
|
|
284
|
-
/**
|
|
285
|
-
* @type {object}
|
|
286
|
-
* @param {object} props - Component props
|
|
287
|
-
* @param {boolean} props.updateOnReload - update metadata and title when rerendered
|
|
288
|
-
* @param {string} props.children - Content to be displayed inside the head
|
|
289
|
-
*/
|
|
290
|
-
this.props = {
|
|
291
|
-
children: props.children,
|
|
292
|
-
updateOnReload: props.updateOnReload
|
|
293
|
-
}
|
|
294
|
-
this.key = 'head';
|
|
295
|
-
this.head = document.createElement('head');
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
render() {
|
|
301
|
-
this.head.innerHTML = this.props.children;
|
|
302
|
-
return this.head.outerHTML;
|
|
303
|
-
}
|
|
304
|
-
|
|
305
|
-
onMount() {
|
|
306
|
-
document.head.innerHTML = this.head.innerHTML;
|
|
307
|
-
document.body.querySelector(`[key="${this.key}"]`).remove();
|
|
308
|
-
}
|
|
309
|
-
}
|
|
310
|
-
|
|
311
|
-
export class Script extends Component {
|
|
312
|
-
/**
|
|
313
|
-
* @constructor
|
|
314
|
-
* @param {object} props - Component props
|
|
315
|
-
* @param {string} props.children - Content to be displayed inside the script
|
|
316
|
-
*/
|
|
317
|
-
constructor(props) {
|
|
318
|
-
super(props);
|
|
319
|
-
this.props = {
|
|
320
|
-
children: props.children,
|
|
321
|
-
}
|
|
322
|
-
this.key = 'script';
|
|
323
|
-
this.script = document.createElement('script');
|
|
324
|
-
}
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
render() {
|
|
329
|
-
this.script.innerHTML = this.props.children.split('\n').join(';\n');
|
|
330
|
-
return this.script.outerHTML;
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
onMount() {
|
|
334
|
-
document.head.appendChild(this.script);
|
|
335
|
-
document.body.querySelector(`[key="${this.key}"]`).remove();
|
|
336
|
-
}
|
|
337
|
-
|
|
338
|
-
}
|
|
339
|
-
|
|
340
|
-
/**
|
|
341
|
-
* @class HTML
|
|
342
|
-
* @description HTML component
|
|
343
|
-
* @extends Component
|
|
344
|
-
*/
|
|
345
|
-
export class Html extends Component {
|
|
346
|
-
/**
|
|
347
|
-
* @constructor
|
|
348
|
-
* @param {object} props - Component props
|
|
349
|
-
* @param {string} props.key - Identifier which is used to check if the component has been mounted
|
|
350
|
-
* @param {string} props.children - Content to be displayed inside the HTML
|
|
351
|
-
* @param {string} props.lang - Language for the HTML
|
|
352
|
-
*/
|
|
353
|
-
constructor(props) {
|
|
354
|
-
super(props);
|
|
355
|
-
/**
|
|
356
|
-
* @type {object}
|
|
357
|
-
* @property {string} children - Content to be displayed inside the HTML
|
|
358
|
-
* @property {string} lang - Language for the HTML
|
|
359
|
-
* @property {object} attributes - Attributes for the HTML
|
|
360
|
-
*/
|
|
361
|
-
this.props = {
|
|
362
|
-
children: props.children,
|
|
363
|
-
lang: props.lang || 'en',
|
|
364
|
-
attributes: props.attributes || {},
|
|
365
|
-
}
|
|
366
|
-
this.key = props.key || 'html';
|
|
367
|
-
this.html = document.createElement('html');
|
|
368
|
-
}
|
|
369
|
-
|
|
370
|
-
render() {
|
|
371
|
-
this.html.innerHTML = this.props.children;
|
|
372
|
-
return this.html.outerHTML;
|
|
373
|
-
}
|
|
374
|
-
|
|
375
|
-
onMount() {
|
|
376
|
-
if (window.isServer) {
|
|
377
|
-
document.documentElement.innerHTML = this.html.outerHTML;
|
|
378
|
-
}
|
|
379
|
-
console.log('Document Has Been Mounted')
|
|
380
|
-
}
|
|
381
|
-
|
|
382
|
-
}
|
|
383
|
-
/**
|
|
384
|
-
* @function useRef
|
|
385
|
-
* @description This method allows you to create a reference to a DOM element
|
|
386
|
-
* @param {any} initialValue
|
|
387
|
-
* @returns
|
|
388
|
-
*/
|
|
389
|
-
export const useRef = (initialValue) => {
|
|
390
|
-
return {
|
|
391
|
-
current: initialValue
|
|
392
|
-
}
|
|
393
|
-
}
|
|
394
|
-
|
|
395
|
-
/**
|
|
396
|
-
* @function useState
|
|
397
|
-
* @description This method allows you to use to bind state to a component and update on changes
|
|
398
|
-
* @param {any} initialValue
|
|
399
|
-
* @returns {[any, Function]}
|
|
400
|
-
*/
|
|
401
|
-
export const useState = (initialValue) => {
|
|
402
|
-
return [initialValue, () => {}]
|
|
403
|
-
}
|
|
404
|
-
/**
|
|
405
|
-
* @function useReducer
|
|
406
|
-
* @description This method allows you to use a reducer to manage state
|
|
407
|
-
* @param {function} reducer
|
|
408
|
-
* @param {any} initialState
|
|
409
|
-
* @returns
|
|
410
|
-
*/
|
|
411
|
-
|
|
412
|
-
export const useReducer = (reducer, initialState) => {
|
|
413
|
-
return [initialState, () => {}]
|
|
414
|
-
}
|
|
415
|
-
export default {
|
|
416
|
-
Component,
|
|
417
|
-
useRef,
|
|
418
|
-
useReducer,
|
|
419
|
-
useState,
|
|
420
|
-
strictMount,
|
|
421
|
-
Link,
|
|
422
|
-
Image,
|
|
423
|
-
Head,
|
|
424
|
-
Html,
|
|
425
|
-
|
|
426
|
-
}
|
package/config/index.js
DELETED
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @function defineConfig
|
|
3
|
-
* @description Define the configuration for the application
|
|
4
|
-
* @param {Object} config
|
|
5
|
-
* @param {Object} config.host - Important metadata
|
|
6
|
-
* @param {string} config.host.hostname - The hostname for your webapplication
|
|
7
|
-
* @param {Object} config.host.prod - Define data for production use
|
|
8
|
-
* @param {Number} config.host.prod.port - The production port for your webapp
|
|
9
|
-
* @param {('vercel'|'netlify'|'cloudflare')} config.host.provider - Helps vader to generate routes for your webapp
|
|
10
|
-
* @param {Object} config.dev - The development server configuration
|
|
11
|
-
* @param {Number} config.dev.port - The port to use for the development server
|
|
12
|
-
* @param {('localhost')} config.dev.host - The hostname to use for the development server
|
|
13
|
-
* @param {Array} config.integrations - Additional integrations to enhance vaderjs
|
|
14
|
-
* @param {Function} config.integrations[0] - The integration to use for the application
|
|
15
|
-
* @returns {Object} The defined configuration
|
|
16
|
-
*/
|
|
17
|
-
export const defineConfig = (config = {
|
|
18
|
-
host: {
|
|
19
|
-
provider: '',
|
|
20
|
-
hostname:'',
|
|
21
|
-
prod:{
|
|
22
|
-
port:3000,
|
|
23
|
-
}
|
|
24
|
-
},
|
|
25
|
-
dev: {
|
|
26
|
-
port: 3000, // Default port for the development server
|
|
27
|
-
host: 'localhost' // Default hostname for the development server
|
|
28
|
-
},
|
|
29
|
-
integrations: []
|
|
30
|
-
}) => {
|
|
31
|
-
return config;
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
export default {
|
|
35
|
-
defineConfig
|
|
36
|
-
};
|
package/logo.png
DELETED
|
Binary file
|
package/runtime/router.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import t from"./vader.js";let e=[];export default class Router{constructor(t,e){this.routes=[],this.middlewares=[],this.errorMiddlewares=[],this.listeners=[],this.basePath=t}get(t,e){this.routes.push({method:"get",path:t,handler:e})}use(t){this.middlewares.push(t)}matchingRoute(){return routes.find((t=>t.url===window.location.pathname||window.location.pathname.split("/")[1]===t.url.split("/")[1]||void 0))}listen(t,e){t||(t=Math.random().toString(36).substring(7)),this.listeners.push(t),window.onpopstate=async t=>{let e=window.location.pathname;if(e.includes("#noNavigation"))return;let r=`/${e.split("/")[1]}`,n=(new DOMParser).parseFromString(await fetch(r,{cache:"reload"}).then((t=>t.text())),"text/html").documentElement,o=(n.querySelector("head"),n.querySelector("body"));document.querySelector("#app").innerHTML=o.querySelector("#app").innerHTML;let s=document.createElement("script");s.id="router",s.innerHTML=o.querySelector('script[id="router"]').innerHTML,s.setAttribute("type","module"),document.body.removeChild(document.getElementById("router")),document.body.appendChild(s)},window.location.pathname.includes("#noNavigation")||(console.log("no navigation"),this.handleRoute(window.location.pathname)),e&&e()}render(e){document.querySelector("#app").innerHTML="",t.render(e,document.querySelector("#app"))}extractParams(t,e){const r=t.split("/").filter((t=>""!==t)),n=e.split("/").filter((t=>""!==t)),o={};return r.forEach(((t,e)=>{if(t.startsWith(":")){const r=t.slice(1);o[r]=n[e]}else if(t.startsWith("*")){n.slice(e).forEach(((t,e)=>{o[e]=t}))}})),o}extractQueryParams(t){const e=t.split("?")[1];if(!e)return{};const r={};return e.split("&").forEach((t=>{const[e,n]=t.split("=");r[e]=n})),r}checkroute(t){return(t=t.endsWith("/")?t.slice(0,-1):t).includes("index.html")&&(t=t.replace("index.html","")),t.includes("?")&&(t=t.split("?")[0]),this.routes.find((e=>{if(console,e.path===t)return!0;if(""===t&&"/"===e.path)return!0;if(e.path.includes("*")||e.path.includes(":")){const r=e.path.split("/").filter((t=>""!==t)),n=t.split("/").filter((t=>""!==t));if(this.basePath&&n.shift(),console.log(r,n),r.length!==n.length&&!e.path.endsWith("*"))return!1;for(let t=0;t<r.length;t++){const e=r[t],o=n[t];if(!e.startsWith(":")&&!e.startsWith("*")&&e!==o)return!1}return!0}const r=this.extractParams(e.path,t);return Object.keys(r).length>0}))}handleRoute(r){let n=200,o={},s=r,a=this.checkroute(r);a||(n=404,a=this.routes.find((t=>"*"===t.path)),a&&(o=this.extractParams(a.path,r)));const i=this.extractQueryParams(s),l=a&&a.path?this.extractParams(a.path,s):o;Object.keys(l).forEach((t=>{l[t]=l[t].split("?")?l[t].split("?")[0]:l[t]}));const c={headers:{},params:l,query:i,path:r,fileUrl:window.location.href.split(window.location.origin)[1],url:window.location.href,method:a?a.method:"get",pause:!1,timestamp:Date.now()};window.$CURRENT_URL=c.path,window.$basePath=" ",window.$FULL_URL=window.location.href.replace("#","");const h={status:n,log:t=>{void 0===t?console.log(`${c.path} ${c.method} ${h.status} ${c.timestamp}`):console.table({"Request Path":c.path,"Request Method":a.method,"Response Status":h.status,"Request Timestamp":c.timestamp})},refresh:()=>{this.handleRoute(window.location.pathname)},redirect:t=>{!t.startsWith("/")&&(t=`/${t}`),window.history.pushState({},"",t),window.dispatchEvent(new Event("popstate"))},render:async e=>{e?.default&&(e=e.default),document.querySelector("#app").innerHTML="",t.render(e,document.querySelector("#app"),{passProps:{router:{req:c,res:h}}})},setQuery:t=>{if($SERVER)return;let e="";Object.keys(t).forEach(((r,n)=>{e+=`${0===n?"?":"&"}${r}=${t[r]}`}));let r=window.location.pathname.split("?")[0];e=e.replace("/","-").replaceAll("/","-"),c.query={...c.query,...t},window.history.pushState({},"",`${r}${e}`)},getQuery:t=>{let e=window.location.search,r=new URLSearchParams(e);return t?r.get(t.key):r},send:t=>{document.querySelector("#app").innerHTML=t},json:t=>{const e=document.querySelector("#app");e.innerHTML="";const r=document.createElement("pre");r.textContent=JSON.stringify(t,null,2),e.appendChild(r)}};e.forEach((t=>{t(c,h)})),a?h.render(a.handler):h.status(404).send("Not Found")}}
|
package/runtime/vader.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
let e=[],t={},r={};export const Mounted=(t,r,s=!1)=>{let n=setInterval((()=>{switch(!0){case s&&e.includes(r.key):return clearInterval(n);case s&&!e.includes(r.key):e.push(r.key),t();break;case!document.querySelector(`[key="${r.key}"]`):return;default:t(),clearInterval(n)}}),100)};export class Component{constructor(e){this.state=r[this.constructor.name]||{},this.__internalInstance=null,this.key=e?.key||Math.random(),this.checkMount(),this.mounted=!1,this.props=e,this.useKey=e=>{this.props.key=e,this.key=e}}setState(e){this.state=Object.assign({},this.state,e),this.updateInstance(this.__internalInstance)}useState(e,t){this.state[e]||(this.state[e]=t);let r=this.state[e];const state=()=>this.state[e];return[state,t=>{this.state[e]=t,this.updateInstance(this.__internalInstance),r=state()}]}useRef(e,t){return this.state[e]||(this.state[e]=t),{current:this.state[e]}}onMount(){}domDifference(e,t){let r=[];for(let s=0;s<e.length;s++){let n=e[s],a=t[s];if(n&&a&&n.childNodes.length>0&&a.childNodes.length>0){let e=this.domDifference(Array.from(n.childNodes),Array.from(a.childNodes));return r=r.concat(e),r}n.nodeValue!==a.nodeValue&&r.push({type:"replace",old:n,new:a})}return r}checkMount(){if(this.mounted)return;setInterval((()=>{document.querySelector(`[key="${this.key}"]`)&&!this.mounted&&(this.mounted=!0,this.onMount())}))}updateChangedElements(e){e.forEach((e=>{if(e)switch(e.type){case"replace":if(e.old.panrntNode&&"BODY"===e.old.parentNode.nodeName)return;e.old.replaceWith(e.new.cloneNode(!0));break;case"remove":e.old.remove();break;case"attributeSwap":let t=Array.from(e.old.attributes),r=Array.from(e.new.attributes);t.forEach((t=>{e.old.removeAttribute(t.name)})),r.forEach((t=>{e.old.setAttribute(t.name,t.value)}));break;case"add":e.old.appendChild(e.new.cloneNode(!0))}}))}updateInstance(e){let t=document.querySelector(`[key="${this.key}"]`)||document.querySelector("#app").firstChild,r=s.render(e,t,{return:!0}),n=this.domDifference(Array.from(t.childNodes),Array.from(r.childNodes));this.updateChangedElements(n)}parseStyle(e){let t="";return Object.keys(e).forEach((r=>{let s=e[r];r=r.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase(),t+=`${r}:${s};`})),t}}export const useState=e=>{this.state[key]||(this.state[key]=e);let t=this.state[key];const getUpdatedState=()=>this.state[key]||e;return t=getUpdatedState(),[getUpdatedState,e=>{t=e,this.state[key]=e,this.updateInstance(this.__internalInstance)}]};export const useReducer=(e,t)=>{const[r,s]=useState(t);return[r,t=>{const n=e(r,t);s(n)}]};export const useRef=e=>{this.state[key]||(this.state[key]=e);let t=this.state[key];return t=(()=>this.state[key]||e)(),[t,e=>{t=e,this.state[key]=e,this.updateInstance(this.__internalInstance)}]};export class Html extends Component{constructor(e){super(e),this.key=e?.key||"DOCUMENT_ROOT",this.props=e,this.checkMount()}render(){return $SERVER?(this.props.lang&&document.documentElement.setAttribute("lang",this.props.lang),s.createElement("div",{children:this.props.children,key:this.key})):s.createElement("div",{children:this.props.children,key:this.key})}onMount(){this.props?.parent&&this.props?.parent&&this.props.parent.onMount()}}export class Head extends Component{constructor(e){super(e),this.head=document.createElement("div"),this.useKey("head"),this.hasRefreshed=!1}render(){if($SERVER||this.props.refresh){Array.isArray(this.props.children)&&this.props.children.forEach((e=>{let r=s.render(e,this.head,{return:!0}),n=this.head.querySelectorAll("*");for(let e=0;e<n.length;e++)n[e].isEqualNode(r)&&console.log("Equal");console.log(this.key,"key"),this.head.appendChild(r),t[this.key]=!0})),Object.keys(this.props).includes("children")&&!Array.isArray(this.props.children)&&this.head.appendChild(s.render(this.props.children,this.head,{return:!0}));let e=document.head;this.head.querySelectorAll("*").forEach((t=>{switch(t.tagName){case"TITLE":e.querySelector("title")&&e.querySelector("title").remove(),e.appendChild(t);break;case"META":return void(e.querySelector(`meta[name="${t.name}"]`)||e.appendChild(t));case"LINK":if($SERVER)return console.log("Server"),void(e.querySelector(`link[href="${t.href}"]`)||e.appendChild(t));case"SCRIPT":if(!t.hasAttribute("eager"))return void(document.querySelector(`script[src="${t.src}"]`)||e.appendChild(t));if(document.querySelector(`script[srcid="${t.src}"]`))return;fetch(t.src).then((e=>e.text())).then((r=>{let s=document.createElement("script");s.innerHTML=r,s.setAttribute("srcid",t.src),s.setAttribute("type",t.type),s.setAttribute("async",t.async||!1),s.setAttribute("defer",t.defer||!1),e.querySelector(`script[srcid="${t.src}"]`)||e.prepend(s)})).catch((e=>{console.warn("Error fetching script",e)}));break;default:console.warn("Unknown tag",t.tagName)}}))}return""}}export class Link extends Component{constructor(e){super(e),this.key=e?.key||Math.random(),this.props=e,this.checkMount()}render(){let e={...this.props,href:this.props?.href,onClick:e=>{switch(e.preventDefault(),!0){case"outside"===this.props.action:console.log("Outside"),e.preventDefault(),window.open(this.props.href,"_blank");break;case"function"==typeof this.props.action:this.props.action(e);break;default:e.preventDefault(),window.history.pushState({},"",this.props.href),window.dispatchEvent(new Event("popstate"))}},key:this.key};return s.createElement("a",e,this.props?.key,null)}}let s=new class vjsx{constructor(){this._vjsx=!0}isClass(e){return/^\s*class\s+/.test(e.toString())}instanizeClass(e,t={}){if("string"==typeof e||"object"==typeof e)return e;switch(this.isClass(e)){case!0:let s=new e(t);return r[e.name]=s.state,s.state=r[e.name],s.$$typeof="vjsx",s.type=e.name,s.key=t?.key||s.name,s.props=t,s.__internalInstance=()=>s.render(s.props),s.render();case!1:let n=new Component;n.key=e.name+Math.random(),e.$$typeof="vjsx",e.useState=n.useState.bind(n),e.setState=n.setState.bind(n),r[e.name]=n.state,n.state=r[e.name],e.state=n.state;let a={},o={};return t?.router&&(a=t.router.req,o=t.router.res),n.__internalInstance=()=>e.bind(n)(t,a,o),e.apply?e.apply(n,[t,a,o]):e}}createElement(e,t,r,...s){let n="function"==typeof e,a=s.find((e=>"vjsx"===e?.$$typeof));if(n)return t.key=r||t?.key||Math.random(),t.parent=a,this.instanizeClass(e,t);let o={type:e,RootParent:a,props:{...t,key:t?.key||Math.random(),children:Array.isArray(t.children)?t.children:[t.children]}};return"TEXT_ELEMENT"===("string"==typeof o?"TEXT_ELEMENT":o.type)?function createTextElement(e){return{type:"TEXT_ELEMENT",props:{nodeValue:e,children:[]}}}(o):o}render(e,t,r){let s=this.instanizeClass(e,r?.passProps);if(r&&r?.passProps&&r?.passProps?.router){let e=r.passProps.router.req;r.passProps.router.res;e.pause}if(!s.type)return;let n="TEXT_ELEMENT"===s.type?document.createTextNode(""):document.createElement(s.type),isListener=e=>e.startsWith("on");if(s.props&&(s.props.key&&(s.key=s.props.key),Object.keys(s.props).filter(isListener).forEach((e=>{let t=e.toLowerCase().substring(2);n.addEventListener(t,s.props[e].bind(s))})),Object.keys(s.props).filter((e=>!isListener(e))).forEach((e=>{switch(!0){case"className"===e||"class"===e||"classname"===e:n.setAttribute("class",s.props[e]),delete s.props[e];break;case"ref"===e:if(Array.isArray(s.props[e].current))return void s.props[e].current.push(n);s.props[e].current=n,n.removeAttribute("ref");break;case"htmlFor"===e:n.setAttribute("for",s.props[e]);break;case"style"===e:n.setAttribute("style",Component.prototype.parseStyle(s.props[e]));break;default:"children"!==e&&n.setAttribute(e,s.props[e])}"TEXT_ELEMENT"!==s.type||(n.nodeValue=s.props[e])}))),s.props&&s.props.children&&Array.isArray(s.props.children)&&s.props?.children&&s.props.children.forEach((e=>{if("number"!=typeof e&&"string"!=typeof e||(e=e.toString()),Array.isArray(e))return void e.forEach((e=>{null!==e&&this.render(e,n,!0)}));if(!e)return;let t="function"==typeof e?this.instanizeClass(e):e;"TEXT_ELEMENT"!==(t?.type?t.type:"TEXT_ELEMENT")?this.render(t,n):n.appendChild(document.createTextNode(t))})),r?.return)return n;s.key&&n.setAttribute("key",s.key),!r?.return&&document.body.contains(t)&&(s?.RootParent?.onMount(),t.innerHTML=""),t.appendChild(n)}},n={createElement:s.createElement,useState:useState,instanizeClass:s.instanizeClass,render:s.render,useRef:useRef,isClass:s.isClass,Head:Head,Html:Html,Mounted:Mounted,Component:Component,Link:Link};export default n;
|