saloe 0.0.5 → 0.0.6

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 CHANGED
@@ -12,7 +12,7 @@ It works seamlessly with `Cloudflare Workers` and `Service Workers`, and can als
12
12
 
13
13
  - [`saloe/html`](./src/html.js) - Stream HTML templates and render temporary templates while waiting for asynchronous functions to finish processing the final template.
14
14
 
15
- - [`saloe/actions`](./src/actions.js) - Add reactivity to HTML nodes with 0kb of initial JavaScript.
15
+ - [`saloe/listener`](./src/listener.js) - Add reactivity to HTML nodes with 0kb of initial JavaScript.
16
16
 
17
17
  ## Coming Soon
18
18
 
@@ -37,13 +37,13 @@ const listener = () => {
37
37
  const fetchListeners = async ({ srcElement, event, e }) => {
38
38
  var _a;
39
39
  if (!(srcElement == null ? void 0 : srcElement.getAttribute)) return;
40
- const scriptNames = srcElement == null ? void 0 : srcElement.getAttribute("on-" + event);
40
+ const scriptNames = srcElement == null ? void 0 : srcElement.getAttribute(`on-${event}`);
41
41
  if (!scriptNames) return;
42
42
  if (scriptNames && EVENTS_PREVENT_DEFAULT_MANDATORY.includes(event)) e.preventDefault();
43
43
  const scripts = await Promise.all(
44
44
  (_a = scriptNames == null ? void 0 : scriptNames.split(",")) == null ? void 0 : _a.map((scriptName) => {
45
45
  var _a2;
46
- const scriptToImport = "/" + (scriptName == null ? void 0 : scriptName.trim()) + ".js";
46
+ const scriptToImport = `/${scriptName == null ? void 0 : scriptName.trim()}.js`;
47
47
  return (_a2 = import(scriptToImport)) == null ? void 0 : _a2.catch((err) => {
48
48
  });
49
49
  })
@@ -92,18 +92,18 @@ const listener = () => {
92
92
  };
93
93
  script.onerror = () => {
94
94
  console.error("script failed to load");
95
- reject(new Error("Failed to load script with src " + script.src));
95
+ reject(new Error(`Failed to load script with src ${script.src}`));
96
96
  };
97
97
  (_b = document == null ? void 0 : document.body) == null ? void 0 : _b.insertAdjacentElement("beforeend", script);
98
98
  });
99
99
  };
100
100
  const fireLoadListener = () => {
101
101
  const event = "load";
102
- const srcElements = document == null ? void 0 : document.querySelectorAll("[on-" + event + "]");
102
+ const srcElements = document == null ? void 0 : document.querySelectorAll(`[on-${event}]`);
103
103
  srcElements == null ? void 0 : srcElements.forEach(async (srcElement) => {
104
104
  const listeners = await fetchListeners({ srcElement, event, e: null });
105
105
  executeListeners({ e: null, srcElement, listeners });
106
- srcElement == null ? void 0 : srcElement.removeAttribute("on-" + event);
106
+ srcElement == null ? void 0 : srcElement.removeAttribute(`on-${event}`);
107
107
  });
108
108
  };
109
109
  const fireObserverListeners = () => {
@@ -118,8 +118,8 @@ const listener = () => {
118
118
  }, /* @__PURE__ */ new Map())) == null ? void 0 : _a.keys()];
119
119
  uniqueScriptNames == null ? void 0 : uniqueScriptNames.forEach(async (scriptName) => {
120
120
  var _a2;
121
- const observedSrcElements = document.querySelectorAll('[on-observe*="' + scriptName + '"]');
122
- const script = await ((_a2 = import("/" + (scriptName == null ? void 0 : scriptName.trim()) + ".js")) == null ? void 0 : _a2.catch((err) => {
121
+ const observedSrcElements = document.querySelectorAll(`[on-observe*="${scriptName}"]`);
122
+ const script = await ((_a2 = import(`/${scriptName == null ? void 0 : scriptName.trim()}.js`)) == null ? void 0 : _a2.catch((err) => {
123
123
  }));
124
124
  const listener2 = getListenerFromScript({ script, event: "observe" });
125
125
  if (!listener2) return;
@@ -138,29 +138,29 @@ const listener = () => {
138
138
  };
139
139
  const getSrcElement = ({ srcElement, event }) => {
140
140
  if (!(srcElement == null ? void 0 : srcElement.hasAttribute)) return srcElement;
141
- const attribute = "on-" + event;
141
+ const attribute = `on-${event}`;
142
142
  const hasScriptName = srcElement == null ? void 0 : srcElement.hasAttribute(attribute);
143
143
  if (hasScriptName) return srcElement;
144
- const query = ":is(a, button, li)[" + attribute + "]";
144
+ const query = `:is(a, button, li)[${attribute}]`;
145
145
  const closestButton = srcElement == null ? void 0 : srcElement.closest(query);
146
146
  if (closestButton) return closestButton;
147
147
  return srcElement;
148
148
  };
149
149
  const fireListeners = () => {
150
150
  EVENTS_FIRE_DOCUMENT_BODY_LISTENERS == null ? void 0 : EVENTS_FIRE_DOCUMENT_BODY_LISTENERS.forEach((event) => {
151
- document.body["on" + event] = async (e) => {
151
+ document.body[`on${event}`] = async (e) => {
152
152
  await addScripts();
153
153
  fireLoadListener();
154
154
  fireObserverListeners();
155
155
  };
156
156
  });
157
157
  EVENTS == null ? void 0 : EVENTS.forEach((event) => {
158
- document.body["on" + event] = async (e) => {
158
+ document.body[`on${event}`] = async (e) => {
159
159
  const srcElement = getSrcElement({ srcElement: e == null ? void 0 : e.srcElement, event });
160
160
  const listeners = await fetchListeners({ srcElement, event, e });
161
161
  executeListeners({ e, srcElement, listeners });
162
162
  addListener({ srcElement, event, listeners });
163
- if (srcElement == null ? void 0 : srcElement.removeAttribute) srcElement.removeAttribute("on-" + event);
163
+ if (srcElement == null ? void 0 : srcElement.removeAttribute) srcElement.removeAttribute(`on-${event}`);
164
164
  };
165
165
  });
166
166
  };
@@ -35,13 +35,13 @@ const listener = () => {
35
35
  const fetchListeners = async ({ srcElement, event, e }) => {
36
36
  var _a;
37
37
  if (!(srcElement == null ? void 0 : srcElement.getAttribute)) return;
38
- const scriptNames = srcElement == null ? void 0 : srcElement.getAttribute("on-" + event);
38
+ const scriptNames = srcElement == null ? void 0 : srcElement.getAttribute(`on-${event}`);
39
39
  if (!scriptNames) return;
40
40
  if (scriptNames && EVENTS_PREVENT_DEFAULT_MANDATORY.includes(event)) e.preventDefault();
41
41
  const scripts = await Promise.all(
42
42
  (_a = scriptNames == null ? void 0 : scriptNames.split(",")) == null ? void 0 : _a.map((scriptName) => {
43
43
  var _a2;
44
- const scriptToImport = "/" + (scriptName == null ? void 0 : scriptName.trim()) + ".js";
44
+ const scriptToImport = `/${scriptName == null ? void 0 : scriptName.trim()}.js`;
45
45
  return (_a2 = import(scriptToImport)) == null ? void 0 : _a2.catch((err) => {
46
46
  });
47
47
  })
@@ -90,18 +90,18 @@ const listener = () => {
90
90
  };
91
91
  script.onerror = () => {
92
92
  console.error("script failed to load");
93
- reject(new Error("Failed to load script with src " + script.src));
93
+ reject(new Error(`Failed to load script with src ${script.src}`));
94
94
  };
95
95
  (_b = document == null ? void 0 : document.body) == null ? void 0 : _b.insertAdjacentElement("beforeend", script);
96
96
  });
97
97
  };
98
98
  const fireLoadListener = () => {
99
99
  const event = "load";
100
- const srcElements = document == null ? void 0 : document.querySelectorAll("[on-" + event + "]");
100
+ const srcElements = document == null ? void 0 : document.querySelectorAll(`[on-${event}]`);
101
101
  srcElements == null ? void 0 : srcElements.forEach(async (srcElement) => {
102
102
  const listeners = await fetchListeners({ srcElement, event, e: null });
103
103
  executeListeners({ e: null, srcElement, listeners });
104
- srcElement == null ? void 0 : srcElement.removeAttribute("on-" + event);
104
+ srcElement == null ? void 0 : srcElement.removeAttribute(`on-${event}`);
105
105
  });
106
106
  };
107
107
  const fireObserverListeners = () => {
@@ -116,8 +116,8 @@ const listener = () => {
116
116
  }, /* @__PURE__ */ new Map())) == null ? void 0 : _a.keys()];
117
117
  uniqueScriptNames == null ? void 0 : uniqueScriptNames.forEach(async (scriptName) => {
118
118
  var _a2;
119
- const observedSrcElements = document.querySelectorAll('[on-observe*="' + scriptName + '"]');
120
- const script = await ((_a2 = import("/" + (scriptName == null ? void 0 : scriptName.trim()) + ".js")) == null ? void 0 : _a2.catch((err) => {
119
+ const observedSrcElements = document.querySelectorAll(`[on-observe*="${scriptName}"]`);
120
+ const script = await ((_a2 = import(`/${scriptName == null ? void 0 : scriptName.trim()}.js`)) == null ? void 0 : _a2.catch((err) => {
121
121
  }));
122
122
  const listener2 = getListenerFromScript({ script, event: "observe" });
123
123
  if (!listener2) return;
@@ -136,29 +136,29 @@ const listener = () => {
136
136
  };
137
137
  const getSrcElement = ({ srcElement, event }) => {
138
138
  if (!(srcElement == null ? void 0 : srcElement.hasAttribute)) return srcElement;
139
- const attribute = "on-" + event;
139
+ const attribute = `on-${event}`;
140
140
  const hasScriptName = srcElement == null ? void 0 : srcElement.hasAttribute(attribute);
141
141
  if (hasScriptName) return srcElement;
142
- const query = ":is(a, button, li)[" + attribute + "]";
142
+ const query = `:is(a, button, li)[${attribute}]`;
143
143
  const closestButton = srcElement == null ? void 0 : srcElement.closest(query);
144
144
  if (closestButton) return closestButton;
145
145
  return srcElement;
146
146
  };
147
147
  const fireListeners = () => {
148
148
  EVENTS_FIRE_DOCUMENT_BODY_LISTENERS == null ? void 0 : EVENTS_FIRE_DOCUMENT_BODY_LISTENERS.forEach((event) => {
149
- document.body["on" + event] = async (e) => {
149
+ document.body[`on${event}`] = async (e) => {
150
150
  await addScripts();
151
151
  fireLoadListener();
152
152
  fireObserverListeners();
153
153
  };
154
154
  });
155
155
  EVENTS == null ? void 0 : EVENTS.forEach((event) => {
156
- document.body["on" + event] = async (e) => {
156
+ document.body[`on${event}`] = async (e) => {
157
157
  const srcElement = getSrcElement({ srcElement: e == null ? void 0 : e.srcElement, event });
158
158
  const listeners = await fetchListeners({ srcElement, event, e });
159
159
  executeListeners({ e, srcElement, listeners });
160
160
  addListener({ srcElement, event, listeners });
161
- if (srcElement == null ? void 0 : srcElement.removeAttribute) srcElement.removeAttribute("on-" + event);
161
+ if (srcElement == null ? void 0 : srcElement.removeAttribute) srcElement.removeAttribute(`on-${event}`);
162
162
  };
163
163
  });
164
164
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "saloe",
3
- "version": "0.0.5",
3
+ "version": "0.0.6",
4
4
  "description": "Tools for making web development easy and efficient",
5
5
  "scripts": {
6
6
  "build": "vite build",
package/src/listener.js CHANGED
@@ -40,14 +40,14 @@ const listener = () => {
40
40
  const fetchListeners = async ({ srcElement, event, e }) => {
41
41
  if (!srcElement?.getAttribute) return
42
42
 
43
- const scriptNames = srcElement?.getAttribute('on-' + event)
43
+ const scriptNames = srcElement?.getAttribute(`on-${event}`)
44
44
  if (!scriptNames) return
45
45
 
46
46
  if (scriptNames && EVENTS_PREVENT_DEFAULT_MANDATORY.includes(event)) e.preventDefault()
47
47
 
48
48
  const scripts = await Promise.all(
49
49
  scriptNames?.split(',')?.map((scriptName) => {
50
- const scriptToImport = '/' + scriptName?.trim() + '.js'
50
+ const scriptToImport = `/${scriptName?.trim()}.js`
51
51
  return import(scriptToImport)?.catch((err) => { })
52
52
  })
53
53
  )
@@ -105,7 +105,7 @@ const listener = () => {
105
105
 
106
106
  script.onerror = () => {
107
107
  console.error('script failed to load')
108
- reject(new Error('Failed to load script with src ' + script.src))
108
+ reject(new Error(`Failed to load script with src ${script.src}`))
109
109
  }
110
110
 
111
111
  document?.body?.insertAdjacentElement('beforeend', script)
@@ -115,20 +115,20 @@ const listener = () => {
115
115
  // load
116
116
  const fireLoadListener = () => {
117
117
  const event = 'load'
118
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
118
+ const srcElements = document?.querySelectorAll(`[on-${event}]`)
119
119
 
120
120
  srcElements?.forEach(async (srcElement) => {
121
121
  const listeners = await fetchListeners({ srcElement, event, e: null })
122
122
  executeListeners({ e: null, srcElement, listeners })
123
123
 
124
- srcElement?.removeAttribute('on-' + event)
124
+ srcElement?.removeAttribute(`on-${event}`)
125
125
  })
126
126
  }
127
127
 
128
128
  // invalid
129
129
  const fireInvalidListener = () => {
130
130
  const event = 'invalid'
131
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
131
+ const srcElements = document?.querySelectorAll(`[on-${event}]`)
132
132
 
133
133
  srcElements?.forEach(async (srcElement) => {
134
134
  const listeners = await fetchListeners({ srcElement, event, e: null })
@@ -139,7 +139,7 @@ const listener = () => {
139
139
  // blur
140
140
  const fireBlurListener = () => {
141
141
  const event = 'blur'
142
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
142
+ const srcElements = document?.querySelectorAll(`[on-${event}]`)
143
143
 
144
144
  srcElements?.forEach(async (srcElement) => {
145
145
  const listeners = await fetchListeners({ srcElement, event, e: null })
@@ -150,7 +150,7 @@ const listener = () => {
150
150
  // focus
151
151
  const fireFocusListener = () => {
152
152
  const event = 'focus'
153
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
153
+ const srcElements = document?.querySelectorAll(`[on-${event}]`)
154
154
 
155
155
  srcElements?.forEach(async (srcElement) => {
156
156
  const listeners = await fetchListeners({ srcElement, event, e: null })
@@ -173,9 +173,9 @@ const listener = () => {
173
173
  }, new Map())?.keys()]
174
174
 
175
175
  uniqueScriptNames?.forEach(async (scriptName) => {
176
- const observedSrcElements = document.querySelectorAll('[on-observe*="' + scriptName + '"]')
176
+ const observedSrcElements = document.querySelectorAll(`[on-observe*="${scriptName}"]`)
177
177
 
178
- const script = await import('/' + scriptName?.trim() + '.js')?.catch((err) => { })
178
+ const script = await import(`/${scriptName?.trim()}.js`)?.catch((err) => { })
179
179
  const listener = getListenerFromScript({ script, event: 'observe' })
180
180
  if (!listener) return
181
181
 
@@ -197,11 +197,11 @@ const listener = () => {
197
197
 
198
198
  const getSrcElement = ({ srcElement, event }) => {
199
199
  if (!srcElement?.hasAttribute) return srcElement
200
- const attribute = 'on-' + event
200
+ const attribute = `on-${event}`
201
201
  const hasScriptName = srcElement?.hasAttribute(attribute)
202
202
  if (hasScriptName) return srcElement
203
203
 
204
- const query = ':is(a, button, li)[' + attribute + ']'
204
+ const query = `:is(a, button, li)[${attribute}]`
205
205
  const closestButton = srcElement?.closest(query)
206
206
  if (closestButton) return closestButton
207
207
 
@@ -210,7 +210,7 @@ const listener = () => {
210
210
 
211
211
  const fireListeners = () => {
212
212
  EVENTS_FIRE_DOCUMENT_BODY_LISTENERS?.forEach((event) => {
213
- document.body['on' + event] = async (e) => {
213
+ document.body[`on${event}`] = async (e) => {
214
214
  await addScripts()
215
215
 
216
216
  fireLoadListener()
@@ -219,14 +219,14 @@ const listener = () => {
219
219
  })
220
220
 
221
221
  EVENTS?.forEach((event) => {
222
- document.body['on' + event] = async (e) => {
222
+ document.body[`on${event}`] = async (e) => {
223
223
  const srcElement = getSrcElement({ srcElement: e?.srcElement, event })
224
224
  const listeners = await fetchListeners({ srcElement, event, e })
225
225
 
226
226
  executeListeners({ e, srcElement, listeners })
227
227
  addListener({ srcElement, event, listeners })
228
228
 
229
- if (srcElement?.removeAttribute) srcElement.removeAttribute('on-' + event)
229
+ if (srcElement?.removeAttribute) srcElement.removeAttribute(`on-${event}`)
230
230
  }
231
231
  })
232
232
  }
package/vite.config.js CHANGED
@@ -7,7 +7,6 @@ export default defineConfig({
7
7
  minify: false,
8
8
  lib: {
9
9
  entry: {
10
- actions: resolve(__dirname, 'src/actions.js'),
11
10
  'cloudflare-kv': resolve(__dirname, 'src/cloudflare-kv.js'),
12
11
  'cloudflare-worker': resolve(__dirname, 'src/cloudflare-worker.js'),
13
12
  cookie: resolve(__dirname, 'src/cookie.js'),
@@ -1,261 +0,0 @@
1
- "use strict";
2
- var __freeze = Object.freeze;
3
- var __defProp = Object.defineProperty;
4
- var __template = (cooked, raw) => __freeze(__defProp(cooked, "raw", { value: __freeze(raw || cooked.slice()) }));
5
- var _a, _b;
6
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
7
- const html = require("./html.cjs.js");
8
- const LISTENER_SCRIPT = html.html(_a || (_a = __template([`
9
- <script defer>
10
- (() => {
11
- const EVENTS_PREVENT_DEFAULT_MANDATORY = [
12
- 'submit'
13
- ]
14
-
15
- const EVENTS_FIRE_DOCUMENT_BODY_LISTENERS = [
16
- 'mouseover',
17
- 'click',
18
- ]
19
-
20
- const EVENTS = [
21
- 'submit',
22
- 'input',
23
- 'blur',
24
- 'change',
25
- 'focus',
26
- 'invalid',
27
- ]
28
-
29
-
30
- const addListener = ({ srcElement, event, listeners }) => {
31
- srcElement?.addEventListener(event, (e) => {
32
- executeListeners({ e, srcElement, listeners })
33
- })
34
- }
35
-
36
- const executeListeners = ({ e, srcElement, listeners }) => {
37
- listeners?.forEach((listener) => {
38
- if (listener) listener({ e, srcElement })
39
- })
40
- }
41
-
42
- const getListenerFromScript = ({ script, event }) => {
43
- if (!script) return null
44
- if (script[event]) return script[event]
45
- const prev = Object.keys(script)?.find((key) => script[key][event])
46
- if (!prev) return null
47
- return script[prev][event]
48
- }
49
-
50
- const fetchListeners = async ({ srcElement, event, e }) => {
51
- if (!srcElement?.getAttribute) return
52
-
53
- const scriptNames = srcElement?.getAttribute('on-' + event)
54
- if (!scriptNames) return
55
-
56
- if (scriptNames && EVENTS_PREVENT_DEFAULT_MANDATORY.includes(event)) e.preventDefault()
57
-
58
- const scripts = await Promise.all(
59
- scriptNames?.split(',')?.map((scriptName) => {
60
- const scriptToImport = '/' + scriptName?.trim() + '.js'
61
- return import(scriptToImport)?.catch((err) => { })
62
- })
63
- )
64
-
65
- const listeners = scripts?.map((script) => getListenerFromScript({ script, event }))
66
-
67
- return listeners
68
-
69
- // if (['load', 'click', 'submit', 'input', 'change'].includes(event)) executeListeners({ e, srcElement, listeners })
70
- // if (['focus', 'blur', 'invalid', 'click', 'submit', 'input', 'change'].includes(event)) addListener({ srcElement, event, listeners })
71
-
72
- // srcElement?.removeAttribute('on-' + event)
73
- }
74
-
75
- const addScripts = () => {
76
- const scriptsToLoad = [...document.querySelectorAll('script[data-script-to-load]')]
77
- return Promise.all(
78
- scriptsToLoad?.map((scriptToLoad) => {
79
- const id = scriptToLoad?.getAttribute('data-script-to-load')
80
- scriptToLoad.removeAttribute('data-script-to-load')
81
-
82
- const attrs = scriptToLoad?.getAttributeNames()?.reduce((acc, attrName) => {
83
- const attrValue = scriptToLoad.getAttribute(attrName)
84
- if (attrValue !== 'text/script-to-load') acc[attrName] = attrValue
85
- return acc
86
- }, {})
87
-
88
- const content = scriptToLoad?.textContent
89
-
90
- scriptToLoad?.remove()
91
-
92
- return loadScript({ id, attrs, content }).catch((err) => {
93
- console.error(err)
94
- })
95
- })
96
- )
97
- }
98
-
99
- const loadScript = ({ id, attrs, content }) => {
100
- const script = document?.createElement('script')
101
-
102
- Object.keys(attrs)?.forEach((attrKey) => script?.setAttribute(attrKey, attrs[attrKey]))
103
- script.id = id
104
-
105
- if (content) script?.insertAdjacentHTML('beforeend', content)
106
-
107
- return new Promise((resolve, reject) => {
108
- if (!attrs.src) {
109
- resolve()
110
- document?.body?.insertAdjacentElement('beforeend', script)
111
- return
112
- }
113
-
114
- script.onload = script.onreadystatechange = function () {
115
- if (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') {
116
- resolve()
117
- script.onload = script.onreadystatechange = null
118
- }
119
- }
120
-
121
- script.onerror = () => {
122
- console.error('script failed to load')
123
- reject(new Error('Failed to load script with src ' + script.src))
124
- }
125
-
126
- document?.body?.insertAdjacentElement('beforeend', script)
127
- })
128
- }
129
-
130
- // load
131
- const fireLoadListener = () => {
132
- const event = 'load'
133
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
134
-
135
- srcElements?.forEach(async (srcElement) => {
136
- const listeners = await fetchListeners({ srcElement, event, e: null })
137
- executeListeners({ e: null, srcElement, listeners })
138
-
139
- srcElement?.removeAttribute('on-' + event)
140
- })
141
- }
142
-
143
- // invalid
144
- const fireInvalidListener = () => {
145
- const event = 'invalid'
146
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
147
-
148
- srcElements?.forEach(async (srcElement) => {
149
- const listeners = await fetchListeners({ srcElement, event, e: null })
150
- addListener({ srcElement, event, listeners })
151
- })
152
- }
153
-
154
- // blur
155
- const fireBlurListener = () => {
156
- const event = 'blur'
157
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
158
-
159
- srcElements?.forEach(async (srcElement) => {
160
- const listeners = await fetchListeners({ srcElement, event, e: null })
161
- addListener({ srcElement, event, listeners })
162
- })
163
- }
164
-
165
- // focus
166
- const fireFocusListener = () => {
167
- const event = 'focus'
168
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
169
-
170
- srcElements?.forEach(async (srcElement) => {
171
- const listeners = await fetchListeners({ srcElement, event, e: null })
172
- addListener({ srcElement, event, listeners })
173
- })
174
- }
175
-
176
- // observers
177
- const fireObserverListeners = () => {
178
- const srcElements = [...document.querySelectorAll('[on-observe]')]
179
-
180
- const uniqueScriptNames = [...srcElements?.reduce((acc, srcElement) => {
181
- const attribute = srcElement?.getAttribute('on-observe')
182
- if (attribute === 'undefined') return acc
183
-
184
- const scriptNames = attribute?.split(',')
185
- scriptNames?.forEach((scriptName) => acc?.set(scriptName, 1))
186
-
187
- return acc
188
- }, new Map())?.keys()]
189
-
190
- uniqueScriptNames?.forEach(async (scriptName) => {
191
- const observedSrcElements = document.querySelectorAll('[on-observe*="' + scriptName + '"]')
192
-
193
- const script = await import('/' + scriptName?.trim() + '.js')?.catch((err) => { })
194
- const listener = getListenerFromScript({ script, event: 'observe' })
195
- if (!listener) return
196
-
197
- const observer = new IntersectionObserver((entries) => {
198
- entries.forEach((entry) => listener({ entry, observer }))
199
- })
200
-
201
- observedSrcElements?.forEach((observerSrcElement) => {
202
- observer.observe(observerSrcElement)
203
-
204
- const observerAttr = observerSrcElement?.getAttribute('on-observe')
205
- const updatedObserverAttr = observerAttr?.replaceAll(scriptName + ', ', '')?.replaceAll(', ' + scriptName, '')?.replaceAll(scriptName, '')
206
-
207
- if (updatedObserverAttr === '') observerSrcElement.removeAttribute('on-observe')
208
- else observerSrcElement.setAttribute('on-observe', updatedObserverAttr)
209
- })
210
- })
211
- }
212
-
213
- const getSrcElement = ({ srcElement, event }) => {
214
- if (!srcElement?.hasAttribute) return srcElement
215
- const attribute = 'on-' + event
216
- const hasScriptName = srcElement?.hasAttribute(attribute)
217
- if (hasScriptName) return srcElement
218
-
219
- const query = ':is(a, button, li)[' + attribute + ']'
220
- const closestButton = srcElement?.closest(query)
221
- if (closestButton) return closestButton
222
-
223
- return srcElement
224
- }
225
-
226
- const fireListeners = () => {
227
- EVENTS_FIRE_DOCUMENT_BODY_LISTENERS?.forEach((event) => {
228
- document.body['on' + event] = async (e) => {
229
- await addScripts()
230
-
231
- fireLoadListener()
232
- fireObserverListeners()
233
- }
234
- })
235
-
236
- EVENTS?.forEach((event) => {
237
- document.body['on' + event] = async (e) => {
238
- const srcElement = getSrcElement({ srcElement: e?.srcElement, event })
239
- const listeners = await fetchListeners({ srcElement, event, e })
240
-
241
- executeListeners({ e, srcElement, listeners })
242
- addListener({ srcElement, event, listeners })
243
-
244
- if (srcElement?.removeAttribute) srcElement.removeAttribute('on-' + event)
245
- }
246
- })
247
- }
248
-
249
- fireListeners()
250
-
251
- window.onload = () => {
252
- setTimeout(() => {
253
- document?.body?.click()
254
- }, 2_500)
255
- }
256
- })()
257
- <\/script>
258
- `])));
259
- const SW_REGISTER_SCRIPT = html.html(_b || (_b = __template(["\n <script defer>\n (async () => {\n if (!navigator.serviceWorker) return\n\n navigator.serviceWorker.register('/sw.worker.js', { scope: '/', type: 'module' })\n\n let refreshing\n // check to see if there is a current active service worker\n const oldSw = (await navigator.serviceWorker.getRegistration())?.active?.state\n navigator.serviceWorker.addEventListener('controllerchange', async () => {\n if (refreshing) return\n // when the controllerchange event has fired, we get the new service worker\n const newSw = (await navigator.serviceWorker.getRegistration())?.active?.state\n \n // if there was already an old activated service worker, and a new activating service worker, do notify update\n if (oldSw === 'activated' && newSw === 'activating') {\n refreshing = true\n // notifyUpdate()\n location.reload()\n }\n })\n })()\n <\/script> \n"])));
260
- exports.LISTENER_SCRIPT = LISTENER_SCRIPT;
261
- exports.SW_REGISTER_SCRIPT = SW_REGISTER_SCRIPT;
@@ -1,261 +0,0 @@
1
- var __freeze = Object.freeze;
2
- var __defProp = Object.defineProperty;
3
- var __template = (cooked, raw) => __freeze(__defProp(cooked, "raw", { value: __freeze(raw || cooked.slice()) }));
4
- var _a, _b;
5
- import { html } from "./html.es.js";
6
- const LISTENER_SCRIPT = html(_a || (_a = __template([`
7
- <script defer>
8
- (() => {
9
- const EVENTS_PREVENT_DEFAULT_MANDATORY = [
10
- 'submit'
11
- ]
12
-
13
- const EVENTS_FIRE_DOCUMENT_BODY_LISTENERS = [
14
- 'mouseover',
15
- 'click',
16
- ]
17
-
18
- const EVENTS = [
19
- 'submit',
20
- 'input',
21
- 'blur',
22
- 'change',
23
- 'focus',
24
- 'invalid',
25
- ]
26
-
27
-
28
- const addListener = ({ srcElement, event, listeners }) => {
29
- srcElement?.addEventListener(event, (e) => {
30
- executeListeners({ e, srcElement, listeners })
31
- })
32
- }
33
-
34
- const executeListeners = ({ e, srcElement, listeners }) => {
35
- listeners?.forEach((listener) => {
36
- if (listener) listener({ e, srcElement })
37
- })
38
- }
39
-
40
- const getListenerFromScript = ({ script, event }) => {
41
- if (!script) return null
42
- if (script[event]) return script[event]
43
- const prev = Object.keys(script)?.find((key) => script[key][event])
44
- if (!prev) return null
45
- return script[prev][event]
46
- }
47
-
48
- const fetchListeners = async ({ srcElement, event, e }) => {
49
- if (!srcElement?.getAttribute) return
50
-
51
- const scriptNames = srcElement?.getAttribute('on-' + event)
52
- if (!scriptNames) return
53
-
54
- if (scriptNames && EVENTS_PREVENT_DEFAULT_MANDATORY.includes(event)) e.preventDefault()
55
-
56
- const scripts = await Promise.all(
57
- scriptNames?.split(',')?.map((scriptName) => {
58
- const scriptToImport = '/' + scriptName?.trim() + '.js'
59
- return import(scriptToImport)?.catch((err) => { })
60
- })
61
- )
62
-
63
- const listeners = scripts?.map((script) => getListenerFromScript({ script, event }))
64
-
65
- return listeners
66
-
67
- // if (['load', 'click', 'submit', 'input', 'change'].includes(event)) executeListeners({ e, srcElement, listeners })
68
- // if (['focus', 'blur', 'invalid', 'click', 'submit', 'input', 'change'].includes(event)) addListener({ srcElement, event, listeners })
69
-
70
- // srcElement?.removeAttribute('on-' + event)
71
- }
72
-
73
- const addScripts = () => {
74
- const scriptsToLoad = [...document.querySelectorAll('script[data-script-to-load]')]
75
- return Promise.all(
76
- scriptsToLoad?.map((scriptToLoad) => {
77
- const id = scriptToLoad?.getAttribute('data-script-to-load')
78
- scriptToLoad.removeAttribute('data-script-to-load')
79
-
80
- const attrs = scriptToLoad?.getAttributeNames()?.reduce((acc, attrName) => {
81
- const attrValue = scriptToLoad.getAttribute(attrName)
82
- if (attrValue !== 'text/script-to-load') acc[attrName] = attrValue
83
- return acc
84
- }, {})
85
-
86
- const content = scriptToLoad?.textContent
87
-
88
- scriptToLoad?.remove()
89
-
90
- return loadScript({ id, attrs, content }).catch((err) => {
91
- console.error(err)
92
- })
93
- })
94
- )
95
- }
96
-
97
- const loadScript = ({ id, attrs, content }) => {
98
- const script = document?.createElement('script')
99
-
100
- Object.keys(attrs)?.forEach((attrKey) => script?.setAttribute(attrKey, attrs[attrKey]))
101
- script.id = id
102
-
103
- if (content) script?.insertAdjacentHTML('beforeend', content)
104
-
105
- return new Promise((resolve, reject) => {
106
- if (!attrs.src) {
107
- resolve()
108
- document?.body?.insertAdjacentElement('beforeend', script)
109
- return
110
- }
111
-
112
- script.onload = script.onreadystatechange = function () {
113
- if (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') {
114
- resolve()
115
- script.onload = script.onreadystatechange = null
116
- }
117
- }
118
-
119
- script.onerror = () => {
120
- console.error('script failed to load')
121
- reject(new Error('Failed to load script with src ' + script.src))
122
- }
123
-
124
- document?.body?.insertAdjacentElement('beforeend', script)
125
- })
126
- }
127
-
128
- // load
129
- const fireLoadListener = () => {
130
- const event = 'load'
131
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
132
-
133
- srcElements?.forEach(async (srcElement) => {
134
- const listeners = await fetchListeners({ srcElement, event, e: null })
135
- executeListeners({ e: null, srcElement, listeners })
136
-
137
- srcElement?.removeAttribute('on-' + event)
138
- })
139
- }
140
-
141
- // invalid
142
- const fireInvalidListener = () => {
143
- const event = 'invalid'
144
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
145
-
146
- srcElements?.forEach(async (srcElement) => {
147
- const listeners = await fetchListeners({ srcElement, event, e: null })
148
- addListener({ srcElement, event, listeners })
149
- })
150
- }
151
-
152
- // blur
153
- const fireBlurListener = () => {
154
- const event = 'blur'
155
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
156
-
157
- srcElements?.forEach(async (srcElement) => {
158
- const listeners = await fetchListeners({ srcElement, event, e: null })
159
- addListener({ srcElement, event, listeners })
160
- })
161
- }
162
-
163
- // focus
164
- const fireFocusListener = () => {
165
- const event = 'focus'
166
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
167
-
168
- srcElements?.forEach(async (srcElement) => {
169
- const listeners = await fetchListeners({ srcElement, event, e: null })
170
- addListener({ srcElement, event, listeners })
171
- })
172
- }
173
-
174
- // observers
175
- const fireObserverListeners = () => {
176
- const srcElements = [...document.querySelectorAll('[on-observe]')]
177
-
178
- const uniqueScriptNames = [...srcElements?.reduce((acc, srcElement) => {
179
- const attribute = srcElement?.getAttribute('on-observe')
180
- if (attribute === 'undefined') return acc
181
-
182
- const scriptNames = attribute?.split(',')
183
- scriptNames?.forEach((scriptName) => acc?.set(scriptName, 1))
184
-
185
- return acc
186
- }, new Map())?.keys()]
187
-
188
- uniqueScriptNames?.forEach(async (scriptName) => {
189
- const observedSrcElements = document.querySelectorAll('[on-observe*="' + scriptName + '"]')
190
-
191
- const script = await import('/' + scriptName?.trim() + '.js')?.catch((err) => { })
192
- const listener = getListenerFromScript({ script, event: 'observe' })
193
- if (!listener) return
194
-
195
- const observer = new IntersectionObserver((entries) => {
196
- entries.forEach((entry) => listener({ entry, observer }))
197
- })
198
-
199
- observedSrcElements?.forEach((observerSrcElement) => {
200
- observer.observe(observerSrcElement)
201
-
202
- const observerAttr = observerSrcElement?.getAttribute('on-observe')
203
- const updatedObserverAttr = observerAttr?.replaceAll(scriptName + ', ', '')?.replaceAll(', ' + scriptName, '')?.replaceAll(scriptName, '')
204
-
205
- if (updatedObserverAttr === '') observerSrcElement.removeAttribute('on-observe')
206
- else observerSrcElement.setAttribute('on-observe', updatedObserverAttr)
207
- })
208
- })
209
- }
210
-
211
- const getSrcElement = ({ srcElement, event }) => {
212
- if (!srcElement?.hasAttribute) return srcElement
213
- const attribute = 'on-' + event
214
- const hasScriptName = srcElement?.hasAttribute(attribute)
215
- if (hasScriptName) return srcElement
216
-
217
- const query = ':is(a, button, li)[' + attribute + ']'
218
- const closestButton = srcElement?.closest(query)
219
- if (closestButton) return closestButton
220
-
221
- return srcElement
222
- }
223
-
224
- const fireListeners = () => {
225
- EVENTS_FIRE_DOCUMENT_BODY_LISTENERS?.forEach((event) => {
226
- document.body['on' + event] = async (e) => {
227
- await addScripts()
228
-
229
- fireLoadListener()
230
- fireObserverListeners()
231
- }
232
- })
233
-
234
- EVENTS?.forEach((event) => {
235
- document.body['on' + event] = async (e) => {
236
- const srcElement = getSrcElement({ srcElement: e?.srcElement, event })
237
- const listeners = await fetchListeners({ srcElement, event, e })
238
-
239
- executeListeners({ e, srcElement, listeners })
240
- addListener({ srcElement, event, listeners })
241
-
242
- if (srcElement?.removeAttribute) srcElement.removeAttribute('on-' + event)
243
- }
244
- })
245
- }
246
-
247
- fireListeners()
248
-
249
- window.onload = () => {
250
- setTimeout(() => {
251
- document?.body?.click()
252
- }, 2_500)
253
- }
254
- })()
255
- <\/script>
256
- `])));
257
- const SW_REGISTER_SCRIPT = html(_b || (_b = __template(["\n <script defer>\n (async () => {\n if (!navigator.serviceWorker) return\n\n navigator.serviceWorker.register('/sw.worker.js', { scope: '/', type: 'module' })\n\n let refreshing\n // check to see if there is a current active service worker\n const oldSw = (await navigator.serviceWorker.getRegistration())?.active?.state\n navigator.serviceWorker.addEventListener('controllerchange', async () => {\n if (refreshing) return\n // when the controllerchange event has fired, we get the new service worker\n const newSw = (await navigator.serviceWorker.getRegistration())?.active?.state\n \n // if there was already an old activated service worker, and a new activating service worker, do notify update\n if (oldSw === 'activated' && newSw === 'activating') {\n refreshing = true\n // notifyUpdate()\n location.reload()\n }\n })\n })()\n <\/script> \n"])));
258
- export {
259
- LISTENER_SCRIPT,
260
- SW_REGISTER_SCRIPT
261
- };
package/src/actions.js DELETED
@@ -1,284 +0,0 @@
1
- import { html } from './html'
2
-
3
- const LISTENER_SCRIPT = html`
4
- <script defer>
5
- (() => {
6
- const EVENTS_PREVENT_DEFAULT_MANDATORY = [
7
- 'submit'
8
- ]
9
-
10
- const EVENTS_FIRE_DOCUMENT_BODY_LISTENERS = [
11
- 'mouseover',
12
- 'click',
13
- ]
14
-
15
- const EVENTS = [
16
- 'submit',
17
- 'input',
18
- 'blur',
19
- 'change',
20
- 'focus',
21
- 'invalid',
22
- ]
23
-
24
-
25
- const addListener = ({ srcElement, event, listeners }) => {
26
- srcElement?.addEventListener(event, (e) => {
27
- executeListeners({ e, srcElement, listeners })
28
- })
29
- }
30
-
31
- const executeListeners = ({ e, srcElement, listeners }) => {
32
- listeners?.forEach((listener) => {
33
- if (listener) listener({ e, srcElement })
34
- })
35
- }
36
-
37
- const getListenerFromScript = ({ script, event }) => {
38
- if (!script) return null
39
- if (script[event]) return script[event]
40
- const prev = Object.keys(script)?.find((key) => script[key][event])
41
- if (!prev) return null
42
- return script[prev][event]
43
- }
44
-
45
- const fetchListeners = async ({ srcElement, event, e }) => {
46
- if (!srcElement?.getAttribute) return
47
-
48
- const scriptNames = srcElement?.getAttribute('on-' + event)
49
- if (!scriptNames) return
50
-
51
- if (scriptNames && EVENTS_PREVENT_DEFAULT_MANDATORY.includes(event)) e.preventDefault()
52
-
53
- const scripts = await Promise.all(
54
- scriptNames?.split(',')?.map((scriptName) => {
55
- const scriptToImport = '/' + scriptName?.trim() + '.js'
56
- return import(scriptToImport)?.catch((err) => { })
57
- })
58
- )
59
-
60
- const listeners = scripts?.map((script) => getListenerFromScript({ script, event }))
61
-
62
- return listeners
63
-
64
- // if (['load', 'click', 'submit', 'input', 'change'].includes(event)) executeListeners({ e, srcElement, listeners })
65
- // if (['focus', 'blur', 'invalid', 'click', 'submit', 'input', 'change'].includes(event)) addListener({ srcElement, event, listeners })
66
-
67
- // srcElement?.removeAttribute('on-' + event)
68
- }
69
-
70
- const addScripts = () => {
71
- const scriptsToLoad = [...document.querySelectorAll('script[data-script-to-load]')]
72
- return Promise.all(
73
- scriptsToLoad?.map((scriptToLoad) => {
74
- const id = scriptToLoad?.getAttribute('data-script-to-load')
75
- scriptToLoad.removeAttribute('data-script-to-load')
76
-
77
- const attrs = scriptToLoad?.getAttributeNames()?.reduce((acc, attrName) => {
78
- const attrValue = scriptToLoad.getAttribute(attrName)
79
- if (attrValue !== 'text/script-to-load') acc[attrName] = attrValue
80
- return acc
81
- }, {})
82
-
83
- const content = scriptToLoad?.textContent
84
-
85
- scriptToLoad?.remove()
86
-
87
- return loadScript({ id, attrs, content }).catch((err) => {
88
- console.error(err)
89
- })
90
- })
91
- )
92
- }
93
-
94
- const loadScript = ({ id, attrs, content }) => {
95
- const script = document?.createElement('script')
96
-
97
- Object.keys(attrs)?.forEach((attrKey) => script?.setAttribute(attrKey, attrs[attrKey]))
98
- script.id = id
99
-
100
- if (content) script?.insertAdjacentHTML('beforeend', content)
101
-
102
- return new Promise((resolve, reject) => {
103
- if (!attrs.src) {
104
- resolve()
105
- document?.body?.insertAdjacentElement('beforeend', script)
106
- return
107
- }
108
-
109
- script.onload = script.onreadystatechange = function () {
110
- if (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') {
111
- resolve()
112
- script.onload = script.onreadystatechange = null
113
- }
114
- }
115
-
116
- script.onerror = () => {
117
- console.error('script failed to load')
118
- reject(new Error('Failed to load script with src ' + script.src))
119
- }
120
-
121
- document?.body?.insertAdjacentElement('beforeend', script)
122
- })
123
- }
124
-
125
- // load
126
- const fireLoadListener = () => {
127
- const event = 'load'
128
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
129
-
130
- srcElements?.forEach(async (srcElement) => {
131
- const listeners = await fetchListeners({ srcElement, event, e: null })
132
- executeListeners({ e: null, srcElement, listeners })
133
-
134
- srcElement?.removeAttribute('on-' + event)
135
- })
136
- }
137
-
138
- // invalid
139
- const fireInvalidListener = () => {
140
- const event = 'invalid'
141
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
142
-
143
- srcElements?.forEach(async (srcElement) => {
144
- const listeners = await fetchListeners({ srcElement, event, e: null })
145
- addListener({ srcElement, event, listeners })
146
- })
147
- }
148
-
149
- // blur
150
- const fireBlurListener = () => {
151
- const event = 'blur'
152
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
153
-
154
- srcElements?.forEach(async (srcElement) => {
155
- const listeners = await fetchListeners({ srcElement, event, e: null })
156
- addListener({ srcElement, event, listeners })
157
- })
158
- }
159
-
160
- // focus
161
- const fireFocusListener = () => {
162
- const event = 'focus'
163
- const srcElements = document?.querySelectorAll('[on-' + event + ']')
164
-
165
- srcElements?.forEach(async (srcElement) => {
166
- const listeners = await fetchListeners({ srcElement, event, e: null })
167
- addListener({ srcElement, event, listeners })
168
- })
169
- }
170
-
171
- // observers
172
- const fireObserverListeners = () => {
173
- const srcElements = [...document.querySelectorAll('[on-observe]')]
174
-
175
- const uniqueScriptNames = [...srcElements?.reduce((acc, srcElement) => {
176
- const attribute = srcElement?.getAttribute('on-observe')
177
- if (attribute === 'undefined') return acc
178
-
179
- const scriptNames = attribute?.split(',')
180
- scriptNames?.forEach((scriptName) => acc?.set(scriptName, 1))
181
-
182
- return acc
183
- }, new Map())?.keys()]
184
-
185
- uniqueScriptNames?.forEach(async (scriptName) => {
186
- const observedSrcElements = document.querySelectorAll('[on-observe*="' + scriptName + '"]')
187
-
188
- const script = await import('/' + scriptName?.trim() + '.js')?.catch((err) => { })
189
- const listener = getListenerFromScript({ script, event: 'observe' })
190
- if (!listener) return
191
-
192
- const observer = new IntersectionObserver((entries) => {
193
- entries.forEach((entry) => listener({ entry, observer }))
194
- })
195
-
196
- observedSrcElements?.forEach((observerSrcElement) => {
197
- observer.observe(observerSrcElement)
198
-
199
- const observerAttr = observerSrcElement?.getAttribute('on-observe')
200
- const updatedObserverAttr = observerAttr?.replaceAll(scriptName + ', ', '')?.replaceAll(', ' + scriptName, '')?.replaceAll(scriptName, '')
201
-
202
- if (updatedObserverAttr === '') observerSrcElement.removeAttribute('on-observe')
203
- else observerSrcElement.setAttribute('on-observe', updatedObserverAttr)
204
- })
205
- })
206
- }
207
-
208
- const getSrcElement = ({ srcElement, event }) => {
209
- if (!srcElement?.hasAttribute) return srcElement
210
- const attribute = 'on-' + event
211
- const hasScriptName = srcElement?.hasAttribute(attribute)
212
- if (hasScriptName) return srcElement
213
-
214
- const query = ':is(a, button, li)[' + attribute + ']'
215
- const closestButton = srcElement?.closest(query)
216
- if (closestButton) return closestButton
217
-
218
- return srcElement
219
- }
220
-
221
- const fireListeners = () => {
222
- EVENTS_FIRE_DOCUMENT_BODY_LISTENERS?.forEach((event) => {
223
- document.body['on' + event] = async (e) => {
224
- await addScripts()
225
-
226
- fireLoadListener()
227
- fireObserverListeners()
228
- }
229
- })
230
-
231
- EVENTS?.forEach((event) => {
232
- document.body['on' + event] = async (e) => {
233
- const srcElement = getSrcElement({ srcElement: e?.srcElement, event })
234
- const listeners = await fetchListeners({ srcElement, event, e })
235
-
236
- executeListeners({ e, srcElement, listeners })
237
- addListener({ srcElement, event, listeners })
238
-
239
- if (srcElement?.removeAttribute) srcElement.removeAttribute('on-' + event)
240
- }
241
- })
242
- }
243
-
244
- fireListeners()
245
-
246
- window.onload = () => {
247
- setTimeout(() => {
248
- document?.body?.click()
249
- }, 2_500)
250
- }
251
- })()
252
- </script>
253
- `
254
-
255
- const SW_REGISTER_SCRIPT = html`
256
- <script defer>
257
- (async () => {
258
- if (!navigator.serviceWorker) return
259
-
260
- navigator.serviceWorker.register('/sw.worker.js', { scope: '/', type: 'module' })
261
-
262
- let refreshing
263
- // check to see if there is a current active service worker
264
- const oldSw = (await navigator.serviceWorker.getRegistration())?.active?.state
265
- navigator.serviceWorker.addEventListener('controllerchange', async () => {
266
- if (refreshing) return
267
- // when the controllerchange event has fired, we get the new service worker
268
- const newSw = (await navigator.serviceWorker.getRegistration())?.active?.state
269
-
270
- // if there was already an old activated service worker, and a new activating service worker, do notify update
271
- if (oldSw === 'activated' && newSw === 'activating') {
272
- refreshing = true
273
- // notifyUpdate()
274
- location.reload()
275
- }
276
- })
277
- })()
278
- </script>
279
- `
280
-
281
- export {
282
- LISTENER_SCRIPT,
283
- SW_REGISTER_SCRIPT,
284
- }