🐛 ddeStringable and simulateSlots

docs/global.css.js

@@ -103,7 +103,7 @@ main{
 	[main-start] min(var(--body-max-width), 90%) [main-end]
 	1fr [full-main-end];
 }
-main > *{
+main > *, main slot > *{
 	grid-column: main;
 }
 .icon {

docs/index.html.js

@@ -36,7 +36,7 @@ export function page({ pkg, info }){
 		el(code, { src: fileURL("./components/examples/introducing/3ps.js"), page_id }),
 		el("p").append(...T`
 			As we can see, in the code at location “A” we define ${el("em", t`how to react`)} when the function
-			is called with any event as an argument. At that moment, we ${el("em", t`don't care who/why/how`)}
+			is called with any event as an argument. At that moment, we ${el("em", t`don’t care who/why/how`)}
 			the function was called. Similarly, at point “B”, we reference to a function to be called on the event
 			${el("em", t`without caring`)} what the function will do at that time. Finally, at point “C”, we tell
 			the application that a change has occurred, in the input, and we ${el("em", t`don't care if/how someone`)}

index.d.ts

@@ -72,7 +72,7 @@ export function el<
 	TAG extends keyof ExtendedHTMLElementTagNameMap,
 >(
 	tag_name: TAG,
-	attrs?: ElementAttributes<ExtendedHTMLElementTagNameMap[NoInfer<TAG>]> | ddeString,
+	attrs?: ElementAttributes<ExtendedHTMLElementTagNameMap[NoInfer<TAG>]> | ddeStringable,
 	...addons: ddeElementAddon<
 		ExtendedHTMLElementTagNameMap[NoInfer<TAG>]
 	>[], // TODO: for now addons must have the same element
@@ -82,7 +82,7 @@ export function el(
 ): ddeDocumentFragment
 export function el(
 	tag_name: string,
-	attrs?: ElementAttributes<HTMLElement> | ddeString,
+	attrs?: ElementAttributes<HTMLElement> | ddeStringable,
 	...addons: ddeElementAddon<HTMLElement>[]
 ): ddeHTMLElement
 
@@ -90,7 +90,7 @@ export function el<
 	C extends (attr: ddeComponentAttributes)=> SupportedElement | ddeDocumentFragment
 >(
 	component: C,
-	attrs?: Parameters<C>[0] | ddeString,
+	attrs?: Parameters<C>[0] | ddeStringable,
 	...addons: ddeElementAddon<ReturnType<C>>[]
 ): ReturnType<C> extends ddeHTMLElementTagNameMap[keyof ddeHTMLElementTagNameMap]
 	? ReturnType<C>
@@ -104,7 +104,7 @@ export function elNS(
 	EL extends ( TAG extends keyof SVGElementTagNameMap ? SVGElementTagNameMap[TAG] : SVGElement ),
 >(
 	tag_name: TAG,
-	attrs?: ElementAttributes<NoInfer<EL>> | ddeString,
+	attrs?: ElementAttributes<NoInfer<EL>> | ddeStringable,
 	...addons: ddeElementAddon<NoInfer<EL>>[]
 )=>  TAG extends keyof ddeSVGElementTagNameMap ? ddeSVGElementTagNameMap[TAG] : ddeSVGElement
 export function elNS(
@@ -114,7 +114,7 @@ export function elNS(
 	EL extends ( TAG extends keyof MathMLElementTagNameMap ? MathMLElementTagNameMap[TAG] : MathMLElement ),
 >(
 	tag_name: TAG,
-	attrs?: ddeString | Partial<{
+	attrs?: ddeStringable | Partial<{
 		[key in keyof EL]: EL[key] | ddeSignal<EL[key]> | string | number | boolean
 	}>,
 	...addons: ddeElementAddon<NoInfer<EL>>[]
@@ -123,7 +123,7 @@ export function elNS(
 	namespace: string
 ): (
 	tag_name: string,
-	attrs?: string | ddeString | Record<string, any>,
+	attrs?: string | ddeStringable | Record<string, any>,
 	...addons: ddeElementAddon<SupportedElement>[]
 )=> SupportedElement
 export { elNS as createElementNS }

src/dom.js

@@ -108,9 +108,11 @@ export function simulateSlots(element, root= element){
 				try{ elementAttribute(el, "remove", "slot"); } catch(_error){}
 				const slot= slots[name];
 				if(!slot) return;
-				if(!name.startsWith(mark_s)) slot.childNodes.forEach(c=> c.remove());
+				if(!slot.name.startsWith(mark_s)){
+					slot.childNodes.forEach(c=> c.remove());
+					slot.name= mark_s+name;
+				}
 				slot.append(el);
-				slot.name= mark_s+name;
 				//TODO?: el.dispatchEvent(new CustomEvent("dde:slotchange", { detail: slot }));
 			}
 			element.append= orig; //TODO?: better memory management, but non-native behavior!
@@ -119,7 +121,7 @@ export function simulateSlots(element, root= element){
 	});
 	if(element!==root){
 		const els= Array.from(element.childNodes);
-		//els.forEach(el=> el.remove());
+		//TODO?: els.forEach(el=> el.remove());
 		element.append(...els);
 	}
 	return root;