ladrillosjs 0.1.4 → 0.1.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/dist/ladrillosjs.cjs.js +1 -1
- package/dist/ladrillosjs.es.js +1 -1
- package/dist/ladrillosjs.umd.js +5 -5
- package/dist/{main-Ds8zereY.mjs → main-BNWsTWhL.mjs} +8 -8
- package/dist/{main-DZj0hnti.js → main-DtdmxWqG.js} +2 -2
- package/dist/webcomponent-B4FfYJcG.mjs +171 -0
- package/dist/webcomponent-Cpdm2yXq.js +1 -0
- package/package.json +1 -1
- package/dist/webcomponent-MGgx7kqL.mjs +0 -156
- package/dist/webcomponent-mLpAkIC-.js +0 -1
package/dist/ladrillosjs.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./main-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./main-DtdmxWqG.js");exports.ladrillos=e.ladrillos;
|
package/dist/ladrillosjs.es.js
CHANGED
package/dist/ladrillosjs.umd.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
(function(
|
|
2
|
-
`+(yield
|
|
3
|
-
`+e.textContent;e.remove()}
|
|
4
|
-
`+(yield
|
|
5
|
-
`+e.textContent,e.remove();
|
|
1
|
+
(function(r,s){typeof exports=="object"&&typeof module!="undefined"?s(exports):typeof define=="function"&&define.amd?define(["exports"],s):(r=typeof globalThis!="undefined"?globalThis:r||self,s(r.ladrillosjs={}))})(this,function(r){"use strict";var M=Object.defineProperty;var N=r=>{throw TypeError(r)};var H=(r,s,o)=>s in r?M(r,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):r[s]=o;var C=(r,s,o)=>H(r,typeof s!="symbol"?s+"":s,o),q=(r,s,o)=>s.has(r)||N("Cannot "+o);var A=(r,s,o)=>(q(r,s,"read from private field"),o?o.call(r):s.get(r)),B=(r,s,o)=>s.has(r)?N("Cannot add the same private member more than once"):s instanceof WeakSet?s.add(r):s.set(r,o);var v=(r,s,o)=>new Promise((b,x)=>{var $=l=>{try{f(o.next(l))}catch(a){x(a)}},E=l=>{try{f(o.throw(l))}catch(a){x(a)}},f=l=>l.done?b(l.value):Promise.resolve(l.value).then($,E);f((o=o.apply(r,s)).next())});var f;const s={log(l,...a){},error(l,...a){console.error(l,...a)},warn(l,...a){}};class o{constructor(){B(this,f,new Map);this.components={}}registerComponent(a,h,d=!0){return v(this,null,function*(){if(this.components[a]){s.log(`Component ${a} already registered, skipping.`);return}try{let u=A(this,f).get(h);u||(u=yield(yield fetch(h)).text(),A(this,f).set(h,u));const w=u.replace(/<!--[\s\S]*?-->/g,""),y=new DOMParser().parseFromString(w,"text/html");let _="";const T=Array.from(y.querySelectorAll("script:not([type='module'])"));for(const e of T){if(e.src){const n=e.getAttribute("src");let c;try{c=n}catch(i){console.error(`Invalid script URL "${n}" (base "${h}") - skipping:`,i),e.remove();continue}try{const i=yield fetch(c);if(!i.ok)throw new Error(`HTTP ${i.status}`);_+=`
|
|
2
|
+
`+(yield i.text())}catch(i){console.error(`Could not load script at ${c} - skipping:`,i)}}else _+=`
|
|
3
|
+
`+e.textContent;e.remove()}_=_.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\/\/.*$/gm,"").trim();let g="";const S=Array.from(y.querySelectorAll("link[rel='stylesheet']"));for(const e of S){const n=e.getAttribute("href");let c;try{c=n+"?raw"}catch(i){console.error(`Invalid stylesheet URL "${n}" (base "${h}") - skipping:`,i),e.remove();continue}try{const i=yield fetch(c);if(!i.ok)throw new Error(`HTTP ${i.status}`);g+=`
|
|
4
|
+
`+(yield i.text())}catch(i){console.error(`Could not load stylesheet at ${c} - skipping:`,i)}e.remove()}const m=Array.from(y.querySelectorAll("style"));for(const e of m)g+=`
|
|
5
|
+
`+e.textContent,e.remove();g=g.trim();const t=document.createElement("template");t.innerHTML=y.body.innerHTML,this.components[a]={tagName:a,template:t,script:_,style:g},this._defineWebComponent(a,d),s.log(`Component ${a} registered successfully`)}catch(u){s.error(`Failed to register component ${a}:`,u)}})}_defineWebComponent(a,h){return v(this,null,function*(){const{defineWebComponent:d}=yield Promise.resolve().then(()=>E);d(this.components[a],h)})}}f=new WeakMap,C(o,"_SCRIPT_ALL",/<script>([\s\S]*?)<\/script>/g),C(o,"_STYLE_ALL",/<style>([\s\S]*?)<\/style>/g),C(o,"_SCRIPT_ONE",/<script>([\s\S]*?)<\/script>/),C(o,"_STYLE_ONE",/<style>([\s\S]*?)<\/style>/);const b=new o;function x(l,a={}){return new Proxy(a,{set(h,d,u){const w=h[d];return h[d]=u,w!==u&&!l._initializing&&(typeof l._updateBinding=="function"?l._updateBinding(d,u):l._update()),!0},get(h,d){return h[d]}})}const E=Object.freeze(Object.defineProperty({__proto__:null,defineWebComponent:(l,a)=>{if(!l){s.error("Component is not defined or invalid.");return}if(customElements.get(l.tagName)){s.warn(`Component ${l.tagName} is already defined.`);return}const{tagName:h,template:d,script:u,style:w}=l,y=(m=>{const t=/{(.*?)}/g,e=new Set;let n;for(;(n=t.exec(m.innerHTML))!==null;)e.add(n[1].trim().toLowerCase());return Array.from(e)})(d),_=u.replace(/\b(?:const|let|var)\s+([\w$]+)\s*=/g,"state.$1 =").replace(/function\s+([\w$]+)\s*\(/g,"state.$1 = function ("),T=u?new Function("state",`with(state){${_}}`):()=>{},g=[];d.content.querySelectorAll("*").forEach(m=>{Array.from(m.attributes).forEach(t=>{if(!t.name.startsWith("on"))return;const e=t.name.slice(2),n=t.value.match(/{\s*([\w$]+)\(\)\s*}/);if(!n)return;const c=n[1];m.dataset._evtIndex=g.length,g.push({evt:e,fnName:c}),m.removeAttribute(t.name)})});class S extends HTMLElement{constructor(){super(),a&&this.attachShadow({mode:"open"}),this.state={},this.styleElement=document.createElement("style"),this.styleElement.textContent=w||"",this._textBindings={},this._origText=new Map,this._hasConnected=!1,this._isUpdating=!1,this._isBinding=!1}connectedCallback(){if(this._hasConnected)return;this._hasConnected=!0,this._textBindings={},this._origText=new Map;const t=d.content.cloneNode(!0);this.shadowRoot?this.shadowRoot.innerHTML="":this.innerHTML="",this.shadowRoot?(this.shadowRoot.appendChild(this.styleElement),this.shadowRoot.appendChild(t)):(this.appendChild(this.styleElement),this.appendChild(t)),this.state=x(this,{}),this._initializing=!0;try{T.call(this,this.state)}catch(n){console.error("Error initializing component script:",n)}finally{this._initializing=!1}const e=this.shadowRoot||this;this._processTemplate(e)}_processTemplate(t){this._getAllTextNodes(t).forEach(n=>{const c=n.textContent;c.includes("{")&&c.includes("}")&&(this._origText.set(n,c),n.textContent=c.replace(/{([^}]+)}/g,(i,p)=>(p=p.trim(),this._textBindings[p]=this._textBindings[p]||[],this._textBindings[p].push(n),this.hasAttribute(p)?this.getAttribute(p):this.state[p]!==void 0?this.state[p]:i)))}),g.forEach((n,c)=>{const i=t.querySelector(`[data-_evt-index="${c}"]`);i.removeAttribute("data-_evt-index"),i.addEventListener(n.evt,p=>{const R=this.state[n.fnName];typeof R=="function"&&R.call(i,p)})})}_getAllTextNodes(t){const e=[],n=document.createTreeWalker(t,NodeFilter.SHOW_TEXT,null,!1);let c;for(;c=n.nextNode();)e.push(c);return e}_update(){if(!this._isUpdating){this._isUpdating=!0;try{const t=d.content.cloneNode(!0);this._processTemplate(t),this.shadowRoot?(this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(this.styleElement),this.shadowRoot.appendChild(t)):(this.innerHTML="",this.appendChild(this.styleElement),this.appendChild(t))}finally{this._isUpdating=!1}}}_updateBinding(t){if(!this._isBinding){this._isBinding=!0;try{(this._textBindings[t]||[]).forEach(e=>{const n=this._origText.get(e)||"";e.textContent=n.replace(/{([^}]+)}/g,(c,i)=>(i=i.trim(),this.hasAttribute(i)?this.getAttribute(i):this.state[i]))})}finally{this._isBinding=!1}}}disconnectedCallback(){this._hasConnected=!1,s.log("disconnectedCallback",this)}static get observedAttributes(){return y}attributeChangedCallback(t,e,n){e!==n&&(this.state[t]=n)}emit(t,e){const n=e!=null?e:this.state;this.dispatchEvent(new CustomEvent(t,{detail:n,bubbles:!0}))}querySelector(t){return this.shadowRoot?this.shadowRoot.querySelector(t):super.querySelector(t)}querySelectorAll(t){return this.shadowRoot?this.shadowRoot.querySelectorAll(t):super.querySelectorAll(t)}}customElements.define(h,S),s.log(`Web component defined: <${h}></${h}>`)}},Symbol.toStringTag,{value:"Module"}));r.ladrillos=b,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
|
|
@@ -4,8 +4,8 @@ var $ = (e) => {
|
|
|
4
4
|
};
|
|
5
5
|
var b = (e, t, r) => t in e ? k(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
|
|
6
6
|
var y = (e, t, r) => b(e, typeof t != "symbol" ? t + "" : t, r), v = (e, t, r) => t.has(e) || $("Cannot " + r);
|
|
7
|
-
var
|
|
8
|
-
var
|
|
7
|
+
var w = (e, t, r) => (v(e, t, "read from private field"), r ? r.call(e) : t.get(e)), A = (e, t, r) => t.has(e) ? $("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, r);
|
|
8
|
+
var d = (e, t, r) => new Promise((a, c) => {
|
|
9
9
|
var u = (o) => {
|
|
10
10
|
try {
|
|
11
11
|
l(r.next(o));
|
|
@@ -58,14 +58,14 @@ class f {
|
|
|
58
58
|
* @returns {Promise<void>}
|
|
59
59
|
*/
|
|
60
60
|
registerComponent(t, r, a = !0) {
|
|
61
|
-
return
|
|
61
|
+
return d(this, null, function* () {
|
|
62
62
|
if (this.components[t]) {
|
|
63
63
|
E.log(`Component ${t} already registered, skipping.`);
|
|
64
64
|
return;
|
|
65
65
|
}
|
|
66
66
|
try {
|
|
67
|
-
let c =
|
|
68
|
-
c || (c = yield (yield fetch(r)).text(),
|
|
67
|
+
let c = w(this, h).get(r);
|
|
68
|
+
c || (c = yield (yield fetch(r)).text(), w(this, h).set(r, c));
|
|
69
69
|
const u = c.replace(/<!--[\s\S]*?-->/g, ""), l = new DOMParser().parseFromString(u, "text/html");
|
|
70
70
|
let o = "";
|
|
71
71
|
const p = Array.from(
|
|
@@ -109,7 +109,7 @@ class f {
|
|
|
109
109
|
const g = n.getAttribute("href");
|
|
110
110
|
let i;
|
|
111
111
|
try {
|
|
112
|
-
i = g;
|
|
112
|
+
i = g + "?raw";
|
|
113
113
|
} catch (s) {
|
|
114
114
|
console.error(
|
|
115
115
|
`Invalid stylesheet URL "${g}" (base "${r}") - skipping:`,
|
|
@@ -153,8 +153,8 @@ class f {
|
|
|
153
153
|
* @param {boolean} useShadowDOM
|
|
154
154
|
*/
|
|
155
155
|
_defineWebComponent(t, r) {
|
|
156
|
-
return
|
|
157
|
-
const { defineWebComponent: a } = yield import("./webcomponent-
|
|
156
|
+
return d(this, null, function* () {
|
|
157
|
+
const { defineWebComponent: a } = yield import("./webcomponent-B4FfYJcG.mjs");
|
|
158
158
|
a(this.components[t], r);
|
|
159
159
|
});
|
|
160
160
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use strict";var k=Object.defineProperty;var $=t=>{throw TypeError(t)};var b=(t,e,r)=>e in t?k(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r;var y=(t,e,r)=>b(t,typeof e!="symbol"?e+"":e,r),v=(t,e,r)=>e.has(t)||$("Cannot "+r);var w=(t,e,r)=>(v(t,e,"read from private field"),r?r.call(t):e.get(t)),A=(t,e,r)=>e.has(t)?$("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(t):e.set(t,r);var E=(t,e,r)=>new Promise((a,c)=>{var d=o=>{try{l(r.next(o))}catch(p){c(p)}},S=o=>{try{l(r.throw(o))}catch(p){c(p)}},l=o=>o.done?a(o.value):Promise.resolve(o.value).then(d,S);l((r=r.apply(t,e)).next())});const u={log(t,...e){},error(t,...e){console.error(t,...e)},warn(t,...e){}};var h;class f{constructor(){A(this,h,new Map);this.components={}}registerComponent(e,r,a=!0){return E(this,null,function*(){if(this.components[e]){u.log(`Component ${e} already registered, skipping.`);return}try{let c=w(this,h).get(r);c||(c=yield(yield fetch(r)).text(),w(this,h).set(r,c));const d=c.replace(/<!--[\s\S]*?-->/g,""),l=new DOMParser().parseFromString(d,"text/html");let o="";const p=Array.from(l.querySelectorAll("script:not([type='module'])"));for(const n of p){if(n.src){const m=n.getAttribute("src");let i;try{i=m}catch(s){console.error(`Invalid script URL "${m}" (base "${r}") - skipping:`,s),n.remove();continue}try{const s=yield fetch(i);if(!s.ok)throw new Error(`HTTP ${s.status}`);o+=`
|
|
2
2
|
`+(yield s.text())}catch(s){console.error(`Could not load script at ${i} - skipping:`,s)}}else o+=`
|
|
3
|
-
`+n.textContent;n.remove()}o=o.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\/\/.*$/gm,"").trim();let g="";const T=Array.from(l.querySelectorAll("link[rel='stylesheet']"));for(const n of T){const m=n.getAttribute("href");let i;try{i=m}catch(s){console.error(`Invalid stylesheet URL "${m}" (base "${r}") - skipping:`,s),n.remove();continue}try{const s=yield fetch(i);if(!s.ok)throw new Error(`HTTP ${s.status}`);g+=`
|
|
3
|
+
`+n.textContent;n.remove()}o=o.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\/\/.*$/gm,"").trim();let g="";const T=Array.from(l.querySelectorAll("link[rel='stylesheet']"));for(const n of T){const m=n.getAttribute("href");let i;try{i=m+"?raw"}catch(s){console.error(`Invalid stylesheet URL "${m}" (base "${r}") - skipping:`,s),n.remove();continue}try{const s=yield fetch(i);if(!s.ok)throw new Error(`HTTP ${s.status}`);g+=`
|
|
4
4
|
`+(yield s.text())}catch(s){console.error(`Could not load stylesheet at ${i} - skipping:`,s)}n.remove()}const _=Array.from(l.querySelectorAll("style"));for(const n of _)g+=`
|
|
5
|
-
`+n.textContent,n.remove();g=g.trim();const C=document.createElement("template");C.innerHTML=l.body.innerHTML,this.components[e]={tagName:e,template:C,script:o,style:g},this._defineWebComponent(e,a),u.log(`Component ${e} registered successfully`)}catch(c){u.error(`Failed to register component ${e}:`,c)}})}_defineWebComponent(e,r){return E(this,null,function*(){const{defineWebComponent:a}=yield Promise.resolve().then(()=>require("./webcomponent-
|
|
5
|
+
`+n.textContent,n.remove();g=g.trim();const C=document.createElement("template");C.innerHTML=l.body.innerHTML,this.components[e]={tagName:e,template:C,script:o,style:g},this._defineWebComponent(e,a),u.log(`Component ${e} registered successfully`)}catch(c){u.error(`Failed to register component ${e}:`,c)}})}_defineWebComponent(e,r){return E(this,null,function*(){const{defineWebComponent:a}=yield Promise.resolve().then(()=>require("./webcomponent-Cpdm2yXq.js"));a(this.components[e],r)})}}h=new WeakMap,y(f,"_SCRIPT_ALL",/<script>([\s\S]*?)<\/script>/g),y(f,"_STYLE_ALL",/<style>([\s\S]*?)<\/style>/g),y(f,"_SCRIPT_ONE",/<script>([\s\S]*?)<\/script>/),y(f,"_STYLE_ONE",/<style>([\s\S]*?)<\/style>/);const L=new f;exports.ladrillos=L;exports.logger=u;
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
import { l as c } from "./main-BNWsTWhL.mjs";
|
|
2
|
+
function C(a, u = {}) {
|
|
3
|
+
return new Proxy(u, {
|
|
4
|
+
set(h, r, l) {
|
|
5
|
+
const f = h[r];
|
|
6
|
+
return h[r] = l, f !== l && !a._initializing && (typeof a._updateBinding == "function" ? a._updateBinding(r, l) : a._update()), !0;
|
|
7
|
+
},
|
|
8
|
+
get(h, r) {
|
|
9
|
+
return h[r];
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
}
|
|
13
|
+
const y = (a, u) => {
|
|
14
|
+
if (!a) {
|
|
15
|
+
c.error("Component is not defined or invalid.");
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
if (customElements.get(a.tagName)) {
|
|
19
|
+
c.warn(`Component ${a.tagName} is already defined.`);
|
|
20
|
+
return;
|
|
21
|
+
}
|
|
22
|
+
const { tagName: h, template: r, script: l, style: f } = a, m = ((d) => {
|
|
23
|
+
const t = /{(.*?)}/g, i = /* @__PURE__ */ new Set();
|
|
24
|
+
let e;
|
|
25
|
+
for (; (e = t.exec(d.innerHTML)) !== null; )
|
|
26
|
+
i.add(e[1].trim().toLowerCase());
|
|
27
|
+
return Array.from(i);
|
|
28
|
+
})(r), _ = l.replace(/\b(?:const|let|var)\s+([\w$]+)\s*=/g, "state.$1 =").replace(/function\s+([\w$]+)\s*\(/g, "state.$1 = function ("), x = l ? new Function("state", `with(state){${_}}`) : () => {
|
|
29
|
+
}, g = [];
|
|
30
|
+
r.content.querySelectorAll("*").forEach((d) => {
|
|
31
|
+
Array.from(d.attributes).forEach((t) => {
|
|
32
|
+
if (!t.name.startsWith("on")) return;
|
|
33
|
+
const i = t.name.slice(2), e = t.value.match(/{\s*([\w$]+)\(\)\s*}/);
|
|
34
|
+
if (!e) return;
|
|
35
|
+
const s = e[1];
|
|
36
|
+
d.dataset._evtIndex = g.length, g.push({ evt: i, fnName: s }), d.removeAttribute(t.name);
|
|
37
|
+
});
|
|
38
|
+
});
|
|
39
|
+
class w extends HTMLElement {
|
|
40
|
+
constructor() {
|
|
41
|
+
super(), u && this.attachShadow({ mode: "open" }), this.state = {}, this.styleElement = document.createElement("style"), this.styleElement.textContent = f || "", this._textBindings = {}, this._origText = /* @__PURE__ */ new Map(), this._hasConnected = !1, this._isUpdating = !1, this._isBinding = !1;
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* Called when element is inserted into the DOM.
|
|
45
|
+
* - Initializes reactive state
|
|
46
|
+
* - Runs user script to populate state
|
|
47
|
+
* - Processes template bindings
|
|
48
|
+
* - Appends style + content to (shadow) root
|
|
49
|
+
*/
|
|
50
|
+
connectedCallback() {
|
|
51
|
+
if (this._hasConnected) return;
|
|
52
|
+
this._hasConnected = !0, this._textBindings = {}, this._origText = /* @__PURE__ */ new Map();
|
|
53
|
+
const t = r.content.cloneNode(!0);
|
|
54
|
+
this.shadowRoot ? this.shadowRoot.innerHTML = "" : this.innerHTML = "", this.shadowRoot ? (this.shadowRoot.appendChild(this.styleElement), this.shadowRoot.appendChild(t)) : (this.appendChild(this.styleElement), this.appendChild(t)), this.state = C(this, {}), this._initializing = !0;
|
|
55
|
+
try {
|
|
56
|
+
x.call(this, this.state);
|
|
57
|
+
} catch (e) {
|
|
58
|
+
console.error("Error initializing component script:", e);
|
|
59
|
+
} finally {
|
|
60
|
+
this._initializing = !1;
|
|
61
|
+
}
|
|
62
|
+
const i = this.shadowRoot || this;
|
|
63
|
+
this._processTemplate(i);
|
|
64
|
+
}
|
|
65
|
+
_processTemplate(t) {
|
|
66
|
+
this._getAllTextNodes(t).forEach((e) => {
|
|
67
|
+
const s = e.textContent;
|
|
68
|
+
s.includes("{") && s.includes("}") && (this._origText.set(e, s), e.textContent = s.replace(/{([^}]+)}/g, (n, o) => (o = o.trim(), this._textBindings[o] = this._textBindings[o] || [], this._textBindings[o].push(e), this.hasAttribute(o) ? this.getAttribute(o) : this.state[o] !== void 0 ? this.state[o] : n)));
|
|
69
|
+
}), g.forEach((e, s) => {
|
|
70
|
+
const n = t.querySelector(`[data-_evt-index="${s}"]`);
|
|
71
|
+
n.removeAttribute("data-_evt-index"), n.addEventListener(e.evt, (o) => {
|
|
72
|
+
const p = this.state[e.fnName];
|
|
73
|
+
typeof p == "function" && p.call(n, o);
|
|
74
|
+
});
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
/**
|
|
78
|
+
* Retrieve all text nodes under a given root node.
|
|
79
|
+
*
|
|
80
|
+
* @param {Node} node
|
|
81
|
+
* @returns {Text[]}
|
|
82
|
+
*/
|
|
83
|
+
_getAllTextNodes(t) {
|
|
84
|
+
const i = [], e = document.createTreeWalker(
|
|
85
|
+
t,
|
|
86
|
+
NodeFilter.SHOW_TEXT,
|
|
87
|
+
null,
|
|
88
|
+
!1
|
|
89
|
+
);
|
|
90
|
+
let s;
|
|
91
|
+
for (; s = e.nextNode(); )
|
|
92
|
+
i.push(s);
|
|
93
|
+
return i;
|
|
94
|
+
}
|
|
95
|
+
/**
|
|
96
|
+
* clears previous DOM, re-processes template and styles.
|
|
97
|
+
* Usually called by reactive state on mutation.
|
|
98
|
+
*/
|
|
99
|
+
_update() {
|
|
100
|
+
if (!this._isUpdating) {
|
|
101
|
+
this._isUpdating = !0;
|
|
102
|
+
try {
|
|
103
|
+
const t = r.content.cloneNode(!0);
|
|
104
|
+
this._processTemplate(t), this.shadowRoot ? (this.shadowRoot.innerHTML = "", this.shadowRoot.appendChild(this.styleElement), this.shadowRoot.appendChild(t)) : (this.innerHTML = "", this.appendChild(this.styleElement), this.appendChild(t));
|
|
105
|
+
} finally {
|
|
106
|
+
this._isUpdating = !1;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
// only update the nodes bound to a single key
|
|
111
|
+
_updateBinding(t) {
|
|
112
|
+
if (!this._isBinding) {
|
|
113
|
+
this._isBinding = !0;
|
|
114
|
+
try {
|
|
115
|
+
(this._textBindings[t] || []).forEach((i) => {
|
|
116
|
+
const e = this._origText.get(i) || "";
|
|
117
|
+
i.textContent = e.replace(/{([^}]+)}/g, (s, n) => (n = n.trim(), this.hasAttribute(n) ? this.getAttribute(n) : this.state[n]));
|
|
118
|
+
});
|
|
119
|
+
} finally {
|
|
120
|
+
this._isBinding = !1;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
/**
|
|
125
|
+
* Called when the element is removed from the DOM
|
|
126
|
+
*/
|
|
127
|
+
disconnectedCallback() {
|
|
128
|
+
this._hasConnected = !1, c.log("disconnectedCallback", this);
|
|
129
|
+
}
|
|
130
|
+
// property
|
|
131
|
+
static get observedAttributes() {
|
|
132
|
+
return m;
|
|
133
|
+
}
|
|
134
|
+
/**
|
|
135
|
+
* Called when one of the observed attributes changes.
|
|
136
|
+
* Updates state and triggers a re-render via the reactive proxy.
|
|
137
|
+
*
|
|
138
|
+
* @param {string} name
|
|
139
|
+
* @param {string} oldVal
|
|
140
|
+
* @param {string} newVal
|
|
141
|
+
*/
|
|
142
|
+
attributeChangedCallback(t, i, e) {
|
|
143
|
+
i !== e && (this.state[t] = e);
|
|
144
|
+
}
|
|
145
|
+
/**
|
|
146
|
+
* Dispatch a custom event from the component.
|
|
147
|
+
*
|
|
148
|
+
* @param {string} name Event name
|
|
149
|
+
* @param {*} [detail] Payload; defaults to full component state
|
|
150
|
+
*/
|
|
151
|
+
emit(t, i) {
|
|
152
|
+
const e = i != null ? i : this.state;
|
|
153
|
+
this.dispatchEvent(
|
|
154
|
+
new CustomEvent(t, {
|
|
155
|
+
detail: e,
|
|
156
|
+
bubbles: !0
|
|
157
|
+
})
|
|
158
|
+
);
|
|
159
|
+
}
|
|
160
|
+
querySelector(t) {
|
|
161
|
+
return this.shadowRoot ? this.shadowRoot.querySelector(t) : super.querySelector(t);
|
|
162
|
+
}
|
|
163
|
+
querySelectorAll(t) {
|
|
164
|
+
return this.shadowRoot ? this.shadowRoot.querySelectorAll(t) : super.querySelectorAll(t);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
customElements.define(h, w), c.log(`Web component defined: <${h}></${h}>`);
|
|
168
|
+
};
|
|
169
|
+
export {
|
|
170
|
+
y as defineWebComponent
|
|
171
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./main-DtdmxWqG.js");function C(a,u={}){return new Proxy(u,{set(h,r,l){const g=h[r];return h[r]=l,g!==l&&!a._initializing&&(typeof a._updateBinding=="function"?a._updateBinding(r,l):a._update()),!0},get(h,r){return h[r]}})}const b=(a,u)=>{if(!a){c.logger.error("Component is not defined or invalid.");return}if(customElements.get(a.tagName)){c.logger.warn(`Component ${a.tagName} is already defined.`);return}const{tagName:h,template:r,script:l,style:g}=a,m=(d=>{const t=/{(.*?)}/g,i=new Set;let e;for(;(e=t.exec(d.innerHTML))!==null;)i.add(e[1].trim().toLowerCase());return Array.from(i)})(r),_=l.replace(/\b(?:const|let|var)\s+([\w$]+)\s*=/g,"state.$1 =").replace(/function\s+([\w$]+)\s*\(/g,"state.$1 = function ("),x=l?new Function("state",`with(state){${_}}`):()=>{},f=[];r.content.querySelectorAll("*").forEach(d=>{Array.from(d.attributes).forEach(t=>{if(!t.name.startsWith("on"))return;const i=t.name.slice(2),e=t.value.match(/{\s*([\w$]+)\(\)\s*}/);if(!e)return;const s=e[1];d.dataset._evtIndex=f.length,f.push({evt:i,fnName:s}),d.removeAttribute(t.name)})});class w extends HTMLElement{constructor(){super(),u&&this.attachShadow({mode:"open"}),this.state={},this.styleElement=document.createElement("style"),this.styleElement.textContent=g||"",this._textBindings={},this._origText=new Map,this._hasConnected=!1,this._isUpdating=!1,this._isBinding=!1}connectedCallback(){if(this._hasConnected)return;this._hasConnected=!0,this._textBindings={},this._origText=new Map;const t=r.content.cloneNode(!0);this.shadowRoot?this.shadowRoot.innerHTML="":this.innerHTML="",this.shadowRoot?(this.shadowRoot.appendChild(this.styleElement),this.shadowRoot.appendChild(t)):(this.appendChild(this.styleElement),this.appendChild(t)),this.state=C(this,{}),this._initializing=!0;try{x.call(this,this.state)}catch(e){console.error("Error initializing component script:",e)}finally{this._initializing=!1}const i=this.shadowRoot||this;this._processTemplate(i)}_processTemplate(t){this._getAllTextNodes(t).forEach(e=>{const s=e.textContent;s.includes("{")&&s.includes("}")&&(this._origText.set(e,s),e.textContent=s.replace(/{([^}]+)}/g,(n,o)=>(o=o.trim(),this._textBindings[o]=this._textBindings[o]||[],this._textBindings[o].push(e),this.hasAttribute(o)?this.getAttribute(o):this.state[o]!==void 0?this.state[o]:n)))}),f.forEach((e,s)=>{const n=t.querySelector(`[data-_evt-index="${s}"]`);n.removeAttribute("data-_evt-index"),n.addEventListener(e.evt,o=>{const p=this.state[e.fnName];typeof p=="function"&&p.call(n,o)})})}_getAllTextNodes(t){const i=[],e=document.createTreeWalker(t,NodeFilter.SHOW_TEXT,null,!1);let s;for(;s=e.nextNode();)i.push(s);return i}_update(){if(!this._isUpdating){this._isUpdating=!0;try{const t=r.content.cloneNode(!0);this._processTemplate(t),this.shadowRoot?(this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(this.styleElement),this.shadowRoot.appendChild(t)):(this.innerHTML="",this.appendChild(this.styleElement),this.appendChild(t))}finally{this._isUpdating=!1}}}_updateBinding(t){if(!this._isBinding){this._isBinding=!0;try{(this._textBindings[t]||[]).forEach(i=>{const e=this._origText.get(i)||"";i.textContent=e.replace(/{([^}]+)}/g,(s,n)=>(n=n.trim(),this.hasAttribute(n)?this.getAttribute(n):this.state[n]))})}finally{this._isBinding=!1}}}disconnectedCallback(){this._hasConnected=!1,c.logger.log("disconnectedCallback",this)}static get observedAttributes(){return m}attributeChangedCallback(t,i,e){i!==e&&(this.state[t]=e)}emit(t,i){const e=i!=null?i:this.state;this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0}))}querySelector(t){return this.shadowRoot?this.shadowRoot.querySelector(t):super.querySelector(t)}querySelectorAll(t){return this.shadowRoot?this.shadowRoot.querySelectorAll(t):super.querySelectorAll(t)}}customElements.define(h,w),c.logger.log(`Web component defined: <${h}></${h}>`)};exports.defineWebComponent=b;
|
package/package.json
CHANGED
|
@@ -1,156 +0,0 @@
|
|
|
1
|
-
import { l as d } from "./main-Ds8zereY.mjs";
|
|
2
|
-
function C(a, u = {}) {
|
|
3
|
-
return new Proxy(u, {
|
|
4
|
-
set(l, r, h) {
|
|
5
|
-
const p = l[r];
|
|
6
|
-
return l[r] = h, p !== h && !a._initializing && (typeof a._updateBinding == "function" ? a._updateBinding(r, h) : a._update()), !0;
|
|
7
|
-
},
|
|
8
|
-
get(l, r) {
|
|
9
|
-
return l[r];
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
}
|
|
13
|
-
const T = (a, u) => {
|
|
14
|
-
if (!a) {
|
|
15
|
-
d.error("Component is not defined or invalid.");
|
|
16
|
-
return;
|
|
17
|
-
}
|
|
18
|
-
if (customElements.get(a.tagName)) {
|
|
19
|
-
d.warn(`Component ${a.tagName} is already defined.`);
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
const { tagName: l, template: r, script: h, style: p } = a, g = ((c) => {
|
|
23
|
-
const t = /{(.*?)}/g, s = /* @__PURE__ */ new Set();
|
|
24
|
-
let e;
|
|
25
|
-
for (; (e = t.exec(c.innerHTML)) !== null; )
|
|
26
|
-
s.add(e[1].trim().toLowerCase());
|
|
27
|
-
return Array.from(s);
|
|
28
|
-
})(r), x = h.replace(/\b(?:const|let|var)\s+([\w$]+)\s*=/g, "state.$1 =").replace(/function\s+([\w$]+)\s*\(/g, "state.$1 = function ("), w = h ? new Function("state", `with(state){${x}}`) : () => {
|
|
29
|
-
}, m = [];
|
|
30
|
-
r.content.querySelectorAll("*").forEach((c) => {
|
|
31
|
-
Array.from(c.attributes).forEach((t) => {
|
|
32
|
-
if (!t.name.startsWith("on")) return;
|
|
33
|
-
const s = t.name.slice(2), e = t.value.match(/{\s*([\w$]+)\(\)\s*}/);
|
|
34
|
-
if (!e) return;
|
|
35
|
-
const i = e[1];
|
|
36
|
-
c.dataset._evtIndex = m.length, m.push({ evt: s, fnName: i }), c.removeAttribute(t.name);
|
|
37
|
-
});
|
|
38
|
-
});
|
|
39
|
-
class _ extends HTMLElement {
|
|
40
|
-
constructor() {
|
|
41
|
-
super(), u && this.attachShadow({ mode: "open" }), this.state = {}, this.styleElement = document.createElement("style"), this.styleElement.textContent = p || "", this._textBindings = {}, this._origText = /* @__PURE__ */ new Map();
|
|
42
|
-
}
|
|
43
|
-
/**
|
|
44
|
-
* Called when element is inserted into the DOM.
|
|
45
|
-
* - Initializes reactive state
|
|
46
|
-
* - Runs user script to populate state
|
|
47
|
-
* - Processes template bindings
|
|
48
|
-
* - Appends style + content to (shadow) root
|
|
49
|
-
*/
|
|
50
|
-
connectedCallback() {
|
|
51
|
-
this._textBindings = {}, this._origText = /* @__PURE__ */ new Map();
|
|
52
|
-
const t = r.content.cloneNode(!0);
|
|
53
|
-
this.shadowRoot ? (this.shadowRoot.appendChild(this.styleElement), this.shadowRoot.appendChild(t)) : (this.appendChild(this.styleElement), this.appendChild(t)), this.state = C(this, {}), this._initializing = !0;
|
|
54
|
-
try {
|
|
55
|
-
w.call(this, this.state);
|
|
56
|
-
} catch (e) {
|
|
57
|
-
console.error("Error initializing component script:", e);
|
|
58
|
-
} finally {
|
|
59
|
-
this._initializing = !1;
|
|
60
|
-
}
|
|
61
|
-
const s = this.shadowRoot || this;
|
|
62
|
-
this._processTemplate(s);
|
|
63
|
-
}
|
|
64
|
-
_processTemplate(t) {
|
|
65
|
-
this._getAllTextNodes(t).forEach((e) => {
|
|
66
|
-
const i = e.textContent;
|
|
67
|
-
i.includes("{") && i.includes("}") && (this._origText.set(e, i), e.textContent = i.replace(/{([^}]+)}/g, (n, o) => (o = o.trim(), this._textBindings[o] = this._textBindings[o] || [], this._textBindings[o].push(e), this.hasAttribute(o) ? this.getAttribute(o) : this.state[o] !== void 0 ? this.state[o] : n)));
|
|
68
|
-
}), m.forEach((e, i) => {
|
|
69
|
-
const n = t.querySelector(`[data-_evt-index="${i}"]`);
|
|
70
|
-
n.removeAttribute("data-_evt-index"), n.addEventListener(e.evt, (o) => {
|
|
71
|
-
const f = this.state[e.fnName];
|
|
72
|
-
typeof f == "function" && f.call(n, o);
|
|
73
|
-
});
|
|
74
|
-
});
|
|
75
|
-
}
|
|
76
|
-
/**
|
|
77
|
-
* Retrieve all text nodes under a given root node.
|
|
78
|
-
*
|
|
79
|
-
* @param {Node} node
|
|
80
|
-
* @returns {Text[]}
|
|
81
|
-
*/
|
|
82
|
-
_getAllTextNodes(t) {
|
|
83
|
-
const s = [], e = document.createTreeWalker(
|
|
84
|
-
t,
|
|
85
|
-
NodeFilter.SHOW_TEXT,
|
|
86
|
-
null,
|
|
87
|
-
!1
|
|
88
|
-
);
|
|
89
|
-
let i;
|
|
90
|
-
for (; i = e.nextNode(); )
|
|
91
|
-
s.push(i);
|
|
92
|
-
return s;
|
|
93
|
-
}
|
|
94
|
-
/**
|
|
95
|
-
* clears previous DOM, re-processes template and styles.
|
|
96
|
-
* Usually called by reactive state on mutation.
|
|
97
|
-
*/
|
|
98
|
-
_update() {
|
|
99
|
-
const t = r.content.cloneNode(!0);
|
|
100
|
-
this._processTemplate(t), this.shadowRoot ? (this.shadowRoot.innerHTML = "", this.shadowRoot.appendChild(this.styleElement), this.shadowRoot.appendChild(t)) : (this.innerHTML = "", this.appendChild(this.styleElement), this.appendChild(t));
|
|
101
|
-
}
|
|
102
|
-
// only update the nodes bound to a single key
|
|
103
|
-
_updateBinding(t) {
|
|
104
|
-
(this._textBindings[t] || []).forEach((s) => {
|
|
105
|
-
const e = this._origText.get(s) || "";
|
|
106
|
-
s.textContent = e.replace(/{([^}]+)}/g, (i, n) => (n = n.trim(), this.hasAttribute(n) ? this.getAttribute(n) : this.state[n]));
|
|
107
|
-
});
|
|
108
|
-
}
|
|
109
|
-
/**
|
|
110
|
-
* Called when the element is removed from the DOM
|
|
111
|
-
*/
|
|
112
|
-
disconnectedCallback() {
|
|
113
|
-
d.log("disconnectedCallback", this);
|
|
114
|
-
}
|
|
115
|
-
// property
|
|
116
|
-
static get observedAttributes() {
|
|
117
|
-
return g;
|
|
118
|
-
}
|
|
119
|
-
/**
|
|
120
|
-
* Called when one of the observed attributes changes.
|
|
121
|
-
* Updates state and triggers a re-render via the reactive proxy.
|
|
122
|
-
*
|
|
123
|
-
* @param {string} name
|
|
124
|
-
* @param {string} oldVal
|
|
125
|
-
* @param {string} newVal
|
|
126
|
-
*/
|
|
127
|
-
attributeChangedCallback(t, s, e) {
|
|
128
|
-
s !== e && (this.state[t] = e);
|
|
129
|
-
}
|
|
130
|
-
/**
|
|
131
|
-
* Dispatch a custom event from the component.
|
|
132
|
-
*
|
|
133
|
-
* @param {string} name Event name
|
|
134
|
-
* @param {*} [detail] Payload; defaults to full component state
|
|
135
|
-
*/
|
|
136
|
-
emit(t, s) {
|
|
137
|
-
const e = s != null ? s : this.state;
|
|
138
|
-
this.dispatchEvent(
|
|
139
|
-
new CustomEvent(t, {
|
|
140
|
-
detail: e,
|
|
141
|
-
bubbles: !0
|
|
142
|
-
})
|
|
143
|
-
);
|
|
144
|
-
}
|
|
145
|
-
querySelector(t) {
|
|
146
|
-
return this.shadowRoot ? this.shadowRoot.querySelector(t) : super.querySelector(t);
|
|
147
|
-
}
|
|
148
|
-
querySelectorAll(t) {
|
|
149
|
-
return this.shadowRoot ? this.shadowRoot.querySelectorAll(t) : super.querySelectorAll(t);
|
|
150
|
-
}
|
|
151
|
-
}
|
|
152
|
-
customElements.define(l, _), d.log(`Web component defined: <${l}></${l}>`);
|
|
153
|
-
};
|
|
154
|
-
export {
|
|
155
|
-
T as defineWebComponent
|
|
156
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./main-DZj0hnti.js");function C(a,u={}){return new Proxy(u,{set(l,r,h){const g=l[r];return l[r]=h,g!==h&&!a._initializing&&(typeof a._updateBinding=="function"?a._updateBinding(r,h):a._update()),!0},get(l,r){return l[r]}})}const b=(a,u)=>{if(!a){d.logger.error("Component is not defined or invalid.");return}if(customElements.get(a.tagName)){d.logger.warn(`Component ${a.tagName} is already defined.`);return}const{tagName:l,template:r,script:h,style:g}=a,f=(c=>{const t=/{(.*?)}/g,i=new Set;let e;for(;(e=t.exec(c.innerHTML))!==null;)i.add(e[1].trim().toLowerCase());return Array.from(i)})(r),x=h.replace(/\b(?:const|let|var)\s+([\w$]+)\s*=/g,"state.$1 =").replace(/function\s+([\w$]+)\s*\(/g,"state.$1 = function ("),w=h?new Function("state",`with(state){${x}}`):()=>{},p=[];r.content.querySelectorAll("*").forEach(c=>{Array.from(c.attributes).forEach(t=>{if(!t.name.startsWith("on"))return;const i=t.name.slice(2),e=t.value.match(/{\s*([\w$]+)\(\)\s*}/);if(!e)return;const n=e[1];c.dataset._evtIndex=p.length,p.push({evt:i,fnName:n}),c.removeAttribute(t.name)})});class _ extends HTMLElement{constructor(){super(),u&&this.attachShadow({mode:"open"}),this.state={},this.styleElement=document.createElement("style"),this.styleElement.textContent=g||"",this._textBindings={},this._origText=new Map}connectedCallback(){this._textBindings={},this._origText=new Map;const t=r.content.cloneNode(!0);this.shadowRoot?(this.shadowRoot.appendChild(this.styleElement),this.shadowRoot.appendChild(t)):(this.appendChild(this.styleElement),this.appendChild(t)),this.state=C(this,{}),this._initializing=!0;try{w.call(this,this.state)}catch(e){console.error("Error initializing component script:",e)}finally{this._initializing=!1}const i=this.shadowRoot||this;this._processTemplate(i)}_processTemplate(t){this._getAllTextNodes(t).forEach(e=>{const n=e.textContent;n.includes("{")&&n.includes("}")&&(this._origText.set(e,n),e.textContent=n.replace(/{([^}]+)}/g,(s,o)=>(o=o.trim(),this._textBindings[o]=this._textBindings[o]||[],this._textBindings[o].push(e),this.hasAttribute(o)?this.getAttribute(o):this.state[o]!==void 0?this.state[o]:s)))}),p.forEach((e,n)=>{const s=t.querySelector(`[data-_evt-index="${n}"]`);s.removeAttribute("data-_evt-index"),s.addEventListener(e.evt,o=>{const m=this.state[e.fnName];typeof m=="function"&&m.call(s,o)})})}_getAllTextNodes(t){const i=[],e=document.createTreeWalker(t,NodeFilter.SHOW_TEXT,null,!1);let n;for(;n=e.nextNode();)i.push(n);return i}_update(){const t=r.content.cloneNode(!0);this._processTemplate(t),this.shadowRoot?(this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(this.styleElement),this.shadowRoot.appendChild(t)):(this.innerHTML="",this.appendChild(this.styleElement),this.appendChild(t))}_updateBinding(t){(this._textBindings[t]||[]).forEach(i=>{const e=this._origText.get(i)||"";i.textContent=e.replace(/{([^}]+)}/g,(n,s)=>(s=s.trim(),this.hasAttribute(s)?this.getAttribute(s):this.state[s]))})}disconnectedCallback(){d.logger.log("disconnectedCallback",this)}static get observedAttributes(){return f}attributeChangedCallback(t,i,e){i!==e&&(this.state[t]=e)}emit(t,i){const e=i!=null?i:this.state;this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0}))}querySelector(t){return this.shadowRoot?this.shadowRoot.querySelector(t):super.querySelector(t)}querySelectorAll(t){return this.shadowRoot?this.shadowRoot.querySelectorAll(t):super.querySelectorAll(t)}}customElements.define(l,_),d.logger.log(`Web component defined: <${l}></${l}>`)};exports.defineWebComponent=b;
|