diff --git a/examples/dist/demo.html b/examples/dist/demo.html index 370e165..27b5448 100644 --- a/examples/dist/demo.html +++ b/examples/dist/demo.html @@ -48,8 +48,8 @@

Demo

-
-
+
+

anObjectDefault

first @@ -157,6 +157,8 @@

anArray


aComputed

Yes

+ My filled slot + Hello
diff --git a/examples/src/components/demo.html b/examples/src/components/demo.html index c3aa722..d41f8ef 100644 --- a/examples/src/components/demo.html +++ b/examples/src/components/demo.html @@ -47,11 +47,11 @@ } ], anArray: ['first', 'second'], - aComputed: locals.aComputed === true ? 'Yes' : 'No', + aComputed: locals.aComputed === true ? 'Yes' : 'No' };
-
+

anObjectDefault

{{ i }}: {{ o }}

@@ -95,5 +95,9 @@

anArray

aComputed

{{ aComputed }}

+ + + {{ $slots.name.locals.aslotlocal }} +
diff --git a/examples/src/pages/demo.html b/examples/src/pages/demo.html index 5144820..27d1bed 100644 --- a/examples/src/pages/demo.html +++ b/examples/src/pages/demo.html @@ -19,7 +19,9 @@

Demo

merge:locals='{ "something": "alocal", "anArray": [ "ten" ] }' class="my-demo" - > + > + My filled slot +
diff --git a/src/slots.js b/src/slots.js index 5f537f5..9ae60a0 100644 --- a/src/slots.js +++ b/src/slots.js @@ -2,6 +2,9 @@ const {match} = require('posthtml/lib/api'); const {render} = require('posthtml-render'); +const {each, omit} = require('underscore'); + +const separator = ':'; /** * Set filled slots @@ -17,15 +20,14 @@ function setFilledSlots(currentNode, filledSlots, {fill}) { fillNode.attrs = {}; } - const name = fillNode.tag.split(':')[1]; + const name = fillNode.tag.split(separator)[1]; - /** @var {Object} locals - NOT YET TESTED */ - const locals = Object.fromEntries(Object.entries(fillNode.attrs).filter(([attributeName]) => ![name, 'type'].includes(attributeName))); + const locals = omit(fillNode.attrs, [name, 'type', 'append', 'prepend', 'aware']); if (locals) { - Object.keys(locals).forEach(local => { + each(locals, (value, key, attrs) => { try { - locals[local] = JSON.parse(locals[local]); + attrs[key] = JSON.parse(value); } catch {} }); } @@ -54,7 +56,7 @@ function setFilledSlots(currentNode, filledSlots, {fill}) { */ function processFillContent(tree, filledSlots, {fill}) { match.call(tree, {tag: fill}, fillNode => { - const name = fillNode.tag.split(':')[1]; + const name = fillNode.tag.split(separator)[1]; if (!filledSlots[name]) { filledSlots[name] = {}; @@ -83,7 +85,7 @@ function processFillContent(tree, filledSlots, {fill}) { */ function processSlotContent(tree, filledSlots, {slot}) { match.call(tree, {tag: slot}, slotNode => { - const name = slotNode.tag.split(':')[1]; + const name = slotNode.tag.split(separator)[1]; slotNode.tag = false;