@cocreate/render 1.13.0 → 1.14.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# [1.14.0](https://github.com/CoCreate-app/CoCreate-render/compare/v1.13.0...v1.14.0) (2022-08-31)
+
+
+### Bug Fixes
+
+* document_id was not inserting on some of the nested elements ([0ef42c7](https://github.com/CoCreate-app/CoCreate-render/commit/0ef42c73100f1af539c82c8cd0968c34c88655e6))
+
+
+### Features
+
+* render collection and document_id with and without a renderKey ([1f80cf3](https://github.com/CoCreate-app/CoCreate-render/commit/1f80cf3f224f9b894a9107bd009993f9673879c0))
+
 # [1.13.0](https://github.com/CoCreate-app/CoCreate-render/compare/v1.12.3...v1.13.0) (2022-08-23)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/render",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "description": "A simple render component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
   "keywords": [
     "render",

package/src/index.css

@@ -1 +1 @@
-.template {display: none !important;}
+.template, [template] {display: none !important;}

package/src/index.js

@@ -41,7 +41,6 @@ const CoCreateRender = {
 			return this.__getValueFromObject(data, result[1].trim());
 		}
 		return false;
-		
 	},
 	
 	__createObject: function (data, path) {
@@ -69,11 +68,15 @@ const CoCreateRender = {
 		let variables = inputValue.match(/{{([A-Za-z0-9_.,\[\]\- ]*)}}/g);
 		if (variables) {
 			variables.forEach((attr) => {
-				if (attr.includes(`collection`))
-					if( this.dataOriginal[renderKey] && this.dataOriginal[renderKey]['collection'] && attr.includes(`{{${renderKey}.`))
-						data[renderKey]['collection'] = this.dataOriginal[renderKey]['collection']
-
-				let value = self.__getValue(data, attr);
+				let value;
+
+				if (attr == "{{data._id}}" || attr == `{{${renderKey}._id}}` ||  attr == "{{document_id}}")
+					value = this.document_id;
+				else if (attr == "{{collection}" || attr == `{{${renderKey}.collection}}`)
+					value = this.collection;
+				else 
+					value = self.__getValue(data, attr);
+				
 				if (value) {
 					if (typeof(value) == "object") {
 						value = this.generateString(value)	
@@ -194,12 +197,24 @@ const CoCreateRender = {
 		let cloneEl = template.cloneNode(true);
 
 		let templateId = cloneEl.getAttribute('template_id');
-		if (templateId)
-			cloneEl.setAttribute('templateId', templateId);
-
-		cloneEl.removeAttribute('template_id');
+	 	if (templateId) {
+		 	cloneEl.setAttribute('templateId', templateId);
+			cloneEl.removeAttribute('template_id');
+		}
+		
+		if(cloneEl.tagName == 'TEMPLATE'){
+			cloneEl = template.content.firstElementChild
+			for (let attribute of template.attributes){
+				let attrName = attribute.name;
+				let attrValue = attribute.value || '';
+				cloneEl.setAttribute(attrName, attrValue);
+			}
+		}
+		else {
+			cloneEl.classList.remove('template');
+			cloneEl.removeAttribute('template');
+		}
 		cloneEl.setAttribute('render-clone', '');	
-		cloneEl.classList.remove('template');
 
 		if (template.dataOriginal)
 			cloneEl.dataOriginal = template.dataOriginal
@@ -207,11 +222,19 @@ const CoCreateRender = {
 		return cloneEl;
 	},
 
+	document_id: '',
 	setValue: function(els, data, renderArray, renderKey){
 		if (!data) return;
+		
 		let isRenderKey
 		if (data.renderKey)
 			isRenderKey = true
+
+		if (data.data && data.data._id )
+			this.document_id =  data.data._id;
+			
+		if (data.collection)
+			this.collection = data.collection;
 			
 		const that = this;
 		Array.from(els).forEach(el => {
@@ -276,7 +299,7 @@ const CoCreateRender = {
 				if(el.childNodes.length > 0) {		
 					that.setValue(el.childNodes, updateData || data, renderArray, renderKey);
 				}
-				if ((el.tagName == 'TEMPLATE' || el.classList.contains('template')) && !el.hasAttribute('template_id')) {
+				if ((el.tagName == 'TEMPLATE' || el.hasAttribute('template') || el.classList.contains('template')) && !el.hasAttribute('template_id')) {
 					that.render(el, data);
 				}
 				// if (el.hasAttribute('render-array') || el.hasAttribute('render-object')) {
@@ -350,10 +373,10 @@ const CoCreateRender = {
 		if (selector) {
 			let template = queryDocumentSelector(selector);
 			if (!template) return;
-			if (template.tagNmae === 'TEMPLATE')
-				template = template.childNodes;
+			// if (template.tagNmae === 'TEMPLATE')
+			// 	template = template.childNodes;
 			template.dataOriginal = {...data}
-			if (template.classList.contains('template')) {
+			if (template.tagName == 'TEMPLATE' || template.hasAttribute('template') || template.classList.contains('template')) {
 				this.render(template, data);
 			}
 			else
@@ -362,7 +385,7 @@ const CoCreateRender = {
 			for (let element of elements)
 				element.dataOriginal = {...this.dataOriginal};
 
-			if (elements.length == 1 && elements[0].classList.contains('template')){
+			if (elements.length == 1 && (elements[0].tagName == 'TEMPLATE' || elements[0].hasAttribute('template') || elements[0].classList.contains('template'))){
 				this.render(elements[0], data);
 			}
 			else
@@ -461,6 +484,9 @@ observer.init({
 			for (let data of array.reverse()){
 				obj = {...obj, ...data}
 			}
+			
+			// if (!obj['document_id'] && obj.data._id)
+			// 	obj['document_id'] = obj.data._id
 
 			CoCreateRender.data({
 				elements: [element],