diff --git a/src/Mite.js b/src/Mite.js index 99717e0..cda4b41 100644 --- a/src/Mite.js +++ b/src/Mite.js @@ -34,9 +34,9 @@ export class Mite { this.root = document.querySelector(selector); if (!this.root) throw new Error(`Element ${selector} not found`); - this.state = {}; - for (const key in options.state) { - this.state[key] = signal(options.state[key]); + this.data = {}; + for (const key in options.data) { + this.data[key] = signal(options.data[key]); } this.methods = options || {}; @@ -68,7 +68,7 @@ export class Mite { this.scanAndBind(this.root); - for (const key in this.state) { + for (const key in this.data) { this.update(key); } } @@ -82,10 +82,10 @@ export class Mite { if (matches) { matches.forEach(token => { const key = token.slice(1, -1); - if (this.state[key]) { + if (this.data[key]) { if (!this.bindings.has(key)) this.bindings.set(key, []); const updateFn = () => this.update(key); - const unsubscribe = this.state[key].subscribe(updateFn); + const unsubscribe = this.data[key].subscribe(updateFn); this.bindings.get(key).push({ node, type: "text", original: node.textContent, unsubscribe }); } }); @@ -103,10 +103,10 @@ export class Mite { } else { matches.forEach(token => { const key = token.slice(1, -1); - if (this.state[key]) { + if (this.data[key]) { if (!this.bindings.has(key)) this.bindings.set(key, []); const updateFn = () => this.update(key); - const unsubscribe = this.state[key].subscribe(updateFn); + const unsubscribe = this.data[key].subscribe(updateFn); this.bindings.get(key).push({ node, type: "attr", attrName: attr.name, original: attr.value, unsubscribe }); } }); @@ -117,10 +117,10 @@ export class Mite { const rif = node.getAttribute("r-if"); if (rif && rif.match(/{(\w+)}$/)) { const key = rif.slice(1, -1); - if (this.state[key]) { + if (this.data[key]) { if (!this.bindings.has(key)) this.bindings.set(key, []); const updateFn = () => this.update(key); - const unsubscribe = this.state[key].subscribe(updateFn); + const unsubscribe = this.data[key].subscribe(updateFn); this.bindings.get(key).push({ node, type: "if", unsubscribe }); } } @@ -147,10 +147,10 @@ export class Mite { const itemName = nameParts[0]; const indexName = nameParts.length > 1 ? nameParts[1] : undefined; - if (this.state[listName]) { + if (this.data[listName]) { if (!this.bindings.has(listName)) this.bindings.set(listName, []); const updateFn = () => this.update(listName); - const unsubscribe = this.state[listName].subscribe(updateFn); + const unsubscribe = this.data[listName].subscribe(updateFn); this.bindings.get(listName).push({ node, type: "each", @@ -161,7 +161,7 @@ export class Mite { parentSelector: node.parentNode.tagName.toLowerCase() }); } else { - console.error(`State key not found: ${listName}`); + console.error(`data key not found: ${listName}`); } } } @@ -178,20 +178,20 @@ export class Mite { case "text": if (!binding.node.parentNode) return; binding.node.textContent = binding.original.replace(/{(\w+)}/g, (_, k) => { - return this.state[k] ? this.state[k].value : `{${k}}`; + return this.data[k] ? this.data[k].value : `{${k}}`; }); break; case "attr": if (!binding.node.parentNode) return; binding.node.setAttribute(binding.attrName, binding.original.replace(/{(\w+)}/g, (_, k) => { - return this.state[k] ? this.state[k].value : `{${k}}`; + return this.data[k] ? this.data[k].value : `{${k}}`; })); break; case "if": if (!binding.node.parentNode) return; - binding.node.style.display = this.state[key].value ? "" : "none"; + binding.node.style.display = this.data[key].value ? "" : "none"; break; case "each": { @@ -205,7 +205,7 @@ export class Mite { console.error(`Template not found for r-each="${binding.originalReach}"`); return; } - const items = this.state[key].value || []; + const items = this.data[key].value || []; parent.innerHTML = ""; @@ -219,7 +219,7 @@ export class Mite { textNode.textContent = textNode.textContent.replace(/{(\w+)}/g, (_, k) => { if (k === binding.itemName) return item; if (k === binding.indexName) return index; - return this.state[k] ? this.state[k].value : `{${k}}`; + return this.data[k] ? this.data[k].value : `{${k}}`; }); } }