@cocreate/render 1.8.1 → 1.8.4

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+## [1.8.4](https://github.com/CoCreate-app/CoCreate-render/compare/v1.8.3...v1.8.4) (2022-06-19)
+
+
+### Bug Fixes
+
+* update templates to use placeholder ([9299cce](https://github.com/CoCreate-app/CoCreate-render/commit/9299ccef3864ffe087044a3614aa35799e89f31c))
+
+## [1.8.3](https://github.com/CoCreate-app/CoCreate-render/compare/v1.8.2...v1.8.3) (2022-06-18)
+
+
+### Bug Fixes
+
+* bump dependencies ([a9db63c](https://github.com/CoCreate-app/CoCreate-render/commit/a9db63c1c00c5df943151e122ffef310c2aa17d7))
+
+## [1.8.2](https://github.com/CoCreate-app/CoCreate-render/compare/v1.8.1...v1.8.2) (2022-06-12)
+
+
+### Bug Fixes
+
+* update dependencies ([ee5da83](https://github.com/CoCreate-app/CoCreate-render/commit/ee5da83168821d569463913953fb1359fbd8e02a))
+* update docs css document_id ([c4b7eca](https://github.com/CoCreate-app/CoCreate-render/commit/c4b7eca6ae528a04062d2a5858461b59285d0543))
+
 ## [1.8.1](https://github.com/CoCreate-app/CoCreate-render/compare/v1.8.0...v1.8.1) (2022-05-23)
 
 

package/demo/render.array.html

@@ -11,7 +11,8 @@
     <body>
         
         <body>
-                <cc-options fetch-collection="organizations" fetch-document_id="5ff747727005da1c272740ab" fetch-name="domains" template_id="domains" class="overflow:auto">
+                <filter template_id="domains" filter-name="_id" filter-value="5ff747727005da1c272740ab"></filter>
+                <cc-options fetch-collection="organizations" fetch-name="domains" template_id="domains" class="overflow:auto">
                     <cc-option class="template display:flex" template_id="domains" value="{{domains}}">
                         <h4>{{domains}}</h4>
                     </cc-option>

package/docs/index.html

@@ -14,7 +14,7 @@
 
 	<!-- CoCreate CSS -->
 	<link rel="stylesheet" href="https://cdn.cocreate.app/latest/CoCreate.min.css" type="text/css" />
-	<link rel="stylesheet" href="/docs/index.css" collection="files" document_id="62827d7e8082ce05b081430b" name="src" type="text/css" save="true" />
+	<link rel="stylesheet" href="/docs/index.css" collection="files" document_id="60888216117c640e7596303f" name="src" type="text/css" save="true" />
 </head>
 
 <body>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/render",
-  "version": "1.8.1",
+  "version": "1.8.4",
   "description": "A simple render component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
   "keywords": [
     "render",
@@ -61,8 +61,8 @@
     "webpack-log": "^3.0.1"
   },
   "dependencies": {
-    "@cocreate/actions": "^1.4.1",
-    "@cocreate/api": "^1.3.1",
-    "@cocreate/docs": "^1.3.1"
+    "@cocreate/actions": "^1.4.3",
+    "@cocreate/api": "^1.3.3",
+    "@cocreate/docs": "^1.3.3"
   }
 }

package/src/index.js

@@ -48,7 +48,7 @@ const CoCreateRender = {
 		}
 	},
 	
-	__replaceValue: function(data, inputValue) {
+	__replaceValue: function(data, inputValue, renderKey) {
 		let isPass = false;
 		let self = this;
 		let resultValue = null;
@@ -71,6 +71,9 @@ const CoCreateRender = {
 					isPass = true;
 					inputValue = inputValue.replace(attr, value);
 				}
+				if (!isPass && renderKey && attr.includes(`{{${renderKey}.`)) {
+					resultValue = '';
+				}
 			});
 			
 			if (isPass) {
@@ -82,7 +85,7 @@ const CoCreateRender = {
 	
 	render: function(template, data) {
 		let type = template.getAttribute('render-array') || "data";
-		const render_key = template.getAttribute('render-key') || type;
+		const renderKey = template.getAttribute('render-key') || type;
 		const self = this;
 
 		// const arrayData = this.__getValueFromObject(data, type);
@@ -118,7 +121,7 @@ const CoCreateRender = {
 		if (!arrayData) {
 			let cloneEl = this.cloneEl(template);
 			cloneEl.classList.add('cloned');
-			self.setValue([cloneEl], data);
+			self.setValue([cloneEl], data, renderKey);
 			template.insertAdjacentHTML('beforebegin', cloneEl.outerHTML);
 		}
 
@@ -126,9 +129,9 @@ const CoCreateRender = {
 			arrayData.forEach((item) => {
 				let cloneEl = this.cloneEl(template);
 				cloneEl.classList.add('clone_' + type);
-				let r_data = self.__createObject(item, render_key);
+				let r_data = self.__createObject(item, renderKey);
 
-				self.setValue([cloneEl], r_data);
+				self.setValue([cloneEl], r_data, renderKey);
 				template.insertAdjacentHTML('beforebegin', cloneEl.outerHTML);
 			});
 		}
@@ -143,7 +146,7 @@ const CoCreateRender = {
 		return cloneEl;
 	},
  
-	setValue:function(els, data, template){
+	setValue:function(els, data, renderKey){
 		if (!data) return;
 		const that = this;
 		Array.from(els).forEach(el => {
@@ -151,15 +154,15 @@ const CoCreateRender = {
 				Array.from(el.attributes).forEach(attr=>{
 					let attr_name = attr.name.toLowerCase();
 					let attrValue = attr.value;
-					attrValue = that.__replaceValue(data, attrValue);
+					attrValue = that.__replaceValue(data, attrValue, renderKey);
 					
-					if (attrValue) {
+					if (attrValue || attrValue == "") {
 						el.setAttribute(attr_name, attrValue);
 					}
 				});
 
 				if(el.childNodes.length > 0) {
-					that.setValue(el.childNodes, data, template);
+					that.setValue(el.childNodes, data, renderKey);
 				}
 				if (el.classList.contains('template')) {
 					that.render(el, data);
@@ -168,8 +171,8 @@ const CoCreateRender = {
 			
 			if (el.nodeType == 3) {
 				let textContent = el.textContent;
-				let text = that.__replaceValue(data, textContent);
-				if (text) {
+				let text = that.__replaceValue(data, textContent, renderKey);
+				if (text || text == "") {
 					const newNode = document.createElement('div');
 					newNode.innerHTML = text;
 					el.replaceWith(...newNode.childNodes)
@@ -187,7 +190,7 @@ const CoCreateRender = {
 				this.render(template, data);
 			}
 			else
-				this.setValue([template], data, template);
+				this.setValue([template], data);
 		} else if (elements) {
 			this.setValue(elements, data);
 		}