@cocreate/elements 1.35.8 → 1.36.1

package/CHANGELOG.md

@@ -1,3 +1,26 @@
+## [1.36.1](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.36.0...v1.36.1) (2024-07-09)
+
+
+### Bug Fixes
+
+* handleing of key="{}" where value is an array ([c86ffd9](https://github.com/CoCreate-app/CoCreate-elements/commit/c86ffd9697839611e8fb10a3f76e0a9bff9892cb))
+* objectId() habndleing to add _id to element ([b2bb7b4](https://github.com/CoCreate-app/CoCreate-elements/commit/b2bb7b423ea2316be0087506fa094a3a8e8cce09))
+* removed testing log ([1b4f38e](https://github.com/CoCreate-app/CoCreate-elements/commit/1b4f38e0cfc1b764dd695dc3288e74f6cb15b676))
+* set flag rendered to prevent loop caused by fireListeners and sync ([3dd1267](https://github.com/CoCreate-app/CoCreate-elements/commit/3dd1267784617c1a666b032fc427671f0cf07375))
+* use continue in for loop and continue if !data$storage ([32020f1](https://github.com/CoCreate-app/CoCreate-elements/commit/32020f17fecc6a578ff58b9fd1dec50a6f611b11))
+
+# [1.36.0](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.35.8...v1.36.0) (2024-06-30)
+
+
+### Bug Fixes
+
+* re init form elements ([7b28c19](https://github.com/CoCreate-app/CoCreate-elements/commit/7b28c19fe31bed297b930d113c98cfd9f913b0fe))
+
+
+### Features
+
+* form.setValue() will set value in elements if value is object else it if string will fallback elementPrototype setVlaue() ([e76df88](https://github.com/CoCreate-app/CoCreate-elements/commit/e76df88fb1755aeffa8f15587d304e2df6497801))
+
 ## [1.35.8](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.35.7...v1.35.8) (2024-06-23)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/elements",
-  "version": "1.35.8",
+  "version": "1.36.1",
   "description": "Fetch content into any html element by using html5 attributes to query data stored in CoCreate headless CMS. If data is changed it will instantly reflect in html tags as changes are broadcasted in realtime",
   "keywords": [
     "elements",

package/src/form.js

@@ -1,7 +1,7 @@
 import Observer from '@cocreate/observer';
 import { getAttributeNames, ObjectId } from '@cocreate/utils';
 import Action from '@cocreate/actions';
-import '@cocreate/element-prototype';
+import elementPrototype from '@cocreate/element-prototype';
 
 
 /**
@@ -33,6 +33,7 @@ function init(elements) {
         runObjectId(element);
         setAttribute(element);
         disableAutoFill(element);
+        setValue(element)
         element.addEventListener('submit', function (event) {
             if (!element.hasAttribute('action')) {
                 event.preventDefault();
@@ -45,20 +46,17 @@ function init(elements) {
 * @param form
 */
 function runObjectId(form) {
-    let elements = form.querySelectorAll("[object='ObjectId()']")
-    let arrays = []
-    // Add a array to the array list
+    let elements = Array.from(form.querySelectorAll("[object='ObjectId()']"));
+
+    if (form.getAttribute('object') === "ObjectId()") {
+        elements.push(form);
+    }
     for (let i = 0; i < elements.length; i++) {
-        elements[i].setAttribute('object', '')
         let array = elements[i].getAttribute('array')
-        // Add a array to the array list.
-        if (array && !arrays.includes(array))
-            arrays.push(array)
-    }
-    // Sets the object id for each array in the array.
-    for (let i = 0; i < arrays.length; i++) {
-        // TODO: needs access to setTypeValue
-        setTypeValue(form, { array: arrays[i], object: [{ _id: ObjectId().toString() }] });
+        if (!array)
+            continue
+        elements[i].setAttribute('object', ObjectId().toString())
+
     }
 }
 
@@ -134,6 +132,23 @@ function reset(form) {
     }));
 }
 
+function setValue(form) {
+    form.setValue = (value) => {
+        if (typeof value !== "object")
+            elementPrototype.setValue(form, value);
+        else {
+            const inputs = form.querySelectorAll('[name], [key]');
+            inputs.forEach(element => {
+                const key = element.getAttribute('key') || element.getAttribute('name');
+                if (value[key]) {
+                    element.setValue(value[key]);
+                }
+            });
+
+        }
+    }
+}
+
 Observer.init({
     name: 'CoCreateForm',
     observe: ['addedNodes'],

package/src/index.js

@@ -53,7 +53,7 @@ const debounce = new Map();
  *                                           any of these CRUD attributes: "storage", "database", "array", "render-json".
  */
 async function init(element) {
-    if (element && !(element instanceof HTMLCollection) && !Array.isArray(element))
+    if (element && !(element instanceof HTMLCollection) && !(element instanceof NodeList) && !Array.isArray(element))
         element = [element]
     else if (!element) {
         element = document.querySelectorAll(selector)
@@ -416,11 +416,13 @@ async function filterData(element, data, type, key) {
         if (Array.isArray(data[type])) {
             let Data = [], isObject
             for (let doc of data[type]) {
+                if (!doc.$storage)
+                    continue
                 // TODO: should have been handled by getDataElements()
                 if (type === 'object') {
                     let _id = element.getAttribute('object')
                     if (_id && doc._id !== _id)
-                        return
+                        continue
                     let $update = doc.$update
                     if ($update) {
                         delete doc.$update
@@ -436,7 +438,7 @@ async function filterData(element, data, type, key) {
                         Data.push(doc[property])
                     }
                 } else
-                    return
+                    continue
             }
 
             // if (isObject && Data.length === 1) {
@@ -716,6 +718,12 @@ function getDataKeys(data) {
 async function getData(form) {
     let dataKeys = new Map()
     let formObject = forms.get(form)
+    if (!formObject) {
+        let elements = form.querySelectorAll(selector)
+        await init(elements)
+        return await getData(form)
+    }
+
     for (let type of formObject.types.values()) {
         for (let [element, data] of type.entries()) {
             if (!element.hasAttribute('key') || element.getAttribute('save') === 'false')
@@ -773,10 +781,21 @@ async function getData(form) {
                 }
 
                 if (Data.type = 'object') {
+                    if (Data.key == '{}') {
+                        if (!value)
+                            continue
+                        else if (Array.isArray(value) && !value.length)
+                            continue
+                    }
+
                     if (typeof Data[Data.type] === 'string')
-                        if (Data.key == '{}')
-                            Data[Data.type] = { _id: Data[Data.type], ...value }
-                        else
+                        if (Data.key == '{}') {
+                            // TODO: handle if array length more than 1
+                            if (Array.isArray(value))
+                                Data[Data.type] = { _id: Data[Data.type], ...value[0] }
+                            else
+                                Data[Data.type] = { _id: Data[Data.type], ...value }
+                        } else
                             Data[Data.type] = { _id: Data[Data.type], [Data.key]: value }
                     else if (Array.isArray(Data[Data.type]))
                         if (Data.key == '{}')
@@ -1124,6 +1143,11 @@ function initSocket() {
             CRUD.listen(action, function (data) {
                 if (data.resolved && data.status === 'received' && CRUD.socket.clientId === data.clientId)
                     return
+                if (data.rendered)
+                    return
+
+                data.rendered = true
+
                 setData(null, data);
             });
         }
@@ -1317,6 +1341,8 @@ Observer.init({
         let currentValue = mutation.target.getAttribute(mutation.attributeName)
         if (currentValue !== mutation.oldValue) {
             remove(mutation.target)
+            if (mutation.target.tagName === 'FORM')
+                return
             init([mutation.target])
         }
     }