diff --git a/package-lock.json b/package-lock.json index ce5db83..0134381 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3991,9 +3991,9 @@ } }, "packages/config/node_modules/@mcflyjs/core": { - "version": "0.2.14", - "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.2.14.tgz", - "integrity": "sha512-3R9aVJ2Wf5XaTWWSgMvwBnls9D4czmRKgHoleMZ+1jNCgZn8ZoFM0mZuYbHCtw3gEtZsQALJDtkV1piktyWY6w==", + "version": "0.2.15", + "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.2.15.tgz", + "integrity": "sha512-BWG04g8+CIP86KTYNupVAETIFczH4oq46aVVcOnm8AZYalspixDjl+tPAwlk05VTPssh6+d5oIxz7oGKedRcfA==", "dependencies": { "esprima": "^4.0.1", "h3": "^1.8.2", @@ -4002,7 +4002,7 @@ }, "packages/core": { "name": "@mcflyjs/core", - "version": "0.2.15", + "version": "0.3.0", "license": "MIT", "dependencies": { "esprima": "^4.0.1", @@ -4066,9 +4066,9 @@ } }, "templates/basic/node_modules/@mcflyjs/core": { - "version": "0.2.14", - "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.2.14.tgz", - "integrity": "sha512-3R9aVJ2Wf5XaTWWSgMvwBnls9D4czmRKgHoleMZ+1jNCgZn8ZoFM0mZuYbHCtw3gEtZsQALJDtkV1piktyWY6w==", + "version": "0.2.15", + "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.2.15.tgz", + "integrity": "sha512-BWG04g8+CIP86KTYNupVAETIFczH4oq46aVVcOnm8AZYalspixDjl+tPAwlk05VTPssh6+d5oIxz7oGKedRcfA==", "dependencies": { "esprima": "^4.0.1", "h3": "^1.8.2", diff --git a/packages/core/event-handler.js b/packages/core/event-handler.js index f723b41..4dccea9 100644 --- a/packages/core/event-handler.js +++ b/packages/core/event-handler.js @@ -142,7 +142,7 @@ async function buildRegistry(usedCustomElements, type, storage) { !isBaseClassImported && content.toString().includes("extends WebComponent") ) { - const baseClassImport = `import { WebComponent } from "https://unpkg.com/web-component-base@1.11.1/WebComponent.js";`; + const baseClassImport = `import { WebComponent } from "https://unpkg.com/web-component-base@1.11.2/WebComponent.js";`; registryScript += baseClassImport; isBaseClassImported = true; @@ -335,10 +335,28 @@ async function useFragments(html, storage) { * @returns {void} */ function replaceSlots(fragmentNode, node) { + let slotted = []; + const containsAll = (arr, target) => target.every(v => arr.includes(v)); walkSync(fragmentNode, (n) => { if (n.type === ELEMENT_NODE && n.name === "slot") { - const index = n.parent.children.indexOf(n); - n.parent.children.splice(index, 1, ...node.children); + // find node child with same name attribute + const currentSlotName = n.attributes?.['name'] ?? null; + let nodeChildren = []; + + if (currentSlotName === null) { + nodeChildren = node.children.filter(child => !child.attributes?.['slot'] && child.type === ELEMENT_NODE); + } else { + nodeChildren = node.children.filter(child => { + const childSlotName = child.attributes?.['slot']; + return childSlotName === currentSlotName; + }) + } + + if (nodeChildren.length > 0 && !containsAll(slotted, nodeChildren)) { + slotted = [...slotted, ...nodeChildren] + const index = n.parent.children.indexOf(n); + n.parent.children.splice(index, 1, ...nodeChildren); + } } }); } diff --git a/packages/core/package.json b/packages/core/package.json index fd12c0c..04a1b30 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@mcflyjs/core", - "version": "0.2.15", + "version": "0.3.0", "description": "McFly core package", "type": "module", "main": "index.js", diff --git a/site/nitro.config.mjs b/site/nitro.config.mjs index 9055175..8863c2b 100644 --- a/site/nitro.config.mjs +++ b/site/nitro.config.mjs @@ -1,4 +1,7 @@ import McFly from "@mcflyjs/config"; export default defineNitroConfig({ ...McFly(), + devServer: { + watch: ["../packages"], + } }); diff --git a/site/src/components/awesome-header.html b/site/src/components/awesome-header.html index 27d7e4a..8d95e68 100644 --- a/site/src/components/awesome-header.html +++ b/site/src/components/awesome-header.html @@ -12,7 +12,7 @@ " > -

McFly

+

McFly

- Back to the Basics. Into the Future. + diff --git a/site/src/pages/demo.html b/site/src/pages/demo.html index fc28647..f103c0b 100644 --- a/site/src/pages/demo.html +++ b/site/src/pages/demo.html @@ -16,7 +16,10 @@ - heyyy + + Back to the Basics. Into the Future. + - This is strong! +

McFly Demo

@@ -75,22 +78,18 @@ </script> </my-head> <body> - <awesome-header><span>heyyy</span></awesome-header> - <main> - <a href="/demo/about">{{ count }}</a> - <div> - <my-hello-world id="my-hello" data-name="{{name }}"></my-hello-world> - <input - placeholder="Type your name here" - onkeyup="document.getElementById('my-hello').setAttribute('data-name', this.value)" - /> - </div> - <code-block language="js">const name = "Nitro"</code-block> - <p>some text: {{greeting}}</p> - {{greeting}} hey<br /> - <clickable-text></clickable-text> - </main> - <my-footer></my-footer> + <a href="/demo/about">{{ count }}</a> + <div> + <my-hello-world id="my-hello" data-name="{{name }}"></my-hello-world> + <input + placeholder="Type your name here" + onkeyup="document.getElementById('my-hello').setAttribute('data-name', this.value)" + /> + </div> + <code-block language="js">const name = "Nitro"</code-block> + <p>some text: {{greeting}}</p> + {{greeting}} hey<br /> + <clickable-text></clickable-text> </body> </html> diff --git a/site/src/pages/index.html b/site/src/pages/index.html index 6a0d568..153a80e 100644 --- a/site/src/pages/index.html +++ b/site/src/pages/index.html @@ -20,7 +20,9 @@ - + + Back to the Basics. Into the Future. +