import { Mixin } from './ce';

import { ShadowDOM } from './shadow-dom';

const templates = new Map();
function resolveTemplate(self) {
	const name = self.localName;
	let template = templates.get(name);
	if(template) return template;

	template = document.createElement('template');
	template.innerHTML = self.constructor.templateHTML;
	templates.set(name, template);
	return template;
}

export const Template = Mixin(SuperClass => class extends SuperClass.with(ShadowDOM) {
	static get templateHTML() {
		return '';
	}

	createdCallback() {
		super.createdCallback();

		const template = resolveTemplate(this);
		const instance = template.content.cloneNode(true);
		this.shadowRoot.appendChild(instance);
	}
});

@@ -67,16 +67,87 @@
 -dom';%0A%0A
+/*%0A * Cache and resolution of templates based on the element name.%0A */%0A
 const te
@@ -436,28 +436,271 @@
 e);%0A
-%09return template;%0A%7D%0A
+%0A%09if(window.ShadyCSS) %7B%0A%09%09window.ShadyCSS.prepareTemplate(template, name);%0A%09%7D%0A%09return template;%0A%7D%0A%0A/**%0A * Mixin that create a template by calling the static function %60templateHTML%60.%0A * The template is applied to the shadow root whenever an element is created.%0A */
 %0Aexp
@@ -1013,16 +1013,84 @@
 stance);
+%0A%0A%09%09if(window.ShadyCSS) %7B%0A%09%09%09window.ShadyCSS.styleElement(this);%0A%09%09%7D
 %0A%09%7D%0A%7D);%0A

Integrate with ShadyCSS if in use