@cocreate/element-prototype 1.4.11 → 1.5.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [1.5.0](https://github.com/CoCreate-app/CoCreate-element-prototype/compare/v1.4.11...v1.5.0) (2023-03-15)
+
+
+### Features
+
+* ability to use one checkbox as a boolean ([9dc3e5a](https://github.com/CoCreate-app/CoCreate-element-prototype/commit/9dc3e5a0fa78a9a01a8e95759b48f63de69d111c))
+
 ## [1.4.11](https://github.com/CoCreate-app/CoCreate-element-prototype/compare/v1.4.10...v1.4.11) (2023-02-01)
 
 

package/package.json

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

package/src/getValue.js

@@ -21,18 +21,24 @@ const getValue = (element) => {
 	let suffix = element.getAttribute('value-suffix') || "";
 
 	if (element.type === "checkbox") {
-		let el_name = element.getAttribute('name');
-		let checkboxs = document.querySelectorAll(`input[type='checkbox'][name='${el_name}']`);
-		if (checkboxs.length > 1) {
+		let inputs = [element]
+		let name = element.getAttribute('name');
+		if (name)
+			inputs = document.querySelectorAll(`input[type="${el.type}"][name="${name}"]`);
+			
+
+		if (inputs.length > 1) {
 			value = [];
-			checkboxs.forEach(el => {
+			inputs.forEach(el => {
 				if (el.checked) 
 					value.push(el.value);
 			});
-		}
-		else {
-			if (el.checked) 
-				value = el.value
+		} else {
+			if (element.checked) 
+				value = element.value || 'true'
+			else if (!element.value)
+				value = 'false'
+
 		}
 	} else if (element.type === 'radio') {
 		let name = element.getAttribute('name');

package/src/setValue.js

@@ -26,13 +26,24 @@ const setValue = (el, value) => {
 		if (isCrdt == "true" || el.type === 'file') return;
 
 		if (el.type == 'checkbox') {
+			let inputs = [el]
 			let name = el.getAttribute('name');
-			let inputs = document.querySelectorAll(`input[type="${el.type}"][name="${name}"]`);
+			if (name)
+				inputs = document.querySelectorAll(`input[type="${el.type}"][name="${name}"]`);
+				
 			for (let i = 0; i < inputs.length; i++) {
-				if (value.includes(inputs[i].value))
-					inputs[i].checked = true;
-				else
-					inputs[i].checked = false;
+				if (inputs[i].value) {
+					if (value.includes(inputs[i].value))
+						inputs[i].checked = true;
+					else
+						inputs[i].checked = false;
+				} else {
+					if (value === 'true' || value === true || value === 'checked')
+						inputs[i].checked = true;
+					else
+						inputs[i].checked = false;
+
+				}
 			}
 		}
 		else if (el.type === 'radio') {