@cocreate/elements 1.36.0 → 1.36.2

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## [1.36.2](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.36.1...v1.36.2) (2024-08-24)
+
+
+### Bug Fixes
+
+* prevent duplicate input event listeners ([e7d5bfd](https://github.com/CoCreate-app/CoCreate-elements/commit/e7d5bfd7c254b9e4a76bd5eb55106b86357904c9))
+* use continue in for loop ([e0febbc](https://github.com/CoCreate-app/CoCreate-elements/commit/e0febbcbf16486d54e312cd646f2d2a255e71848))
+
+## [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)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/elements",
-  "version": "1.36.0",
+  "version": "1.36.2",
   "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/fetchSrc.js

@@ -19,7 +19,7 @@ async function initElements(elements) {
         let src = element.getAttribute('src') || element.getAttribute('source') || element.getAttribute('stream');
 
         if (!src || /{{\s*([\w\W]+)\s*}}/g.test(src))
-            return;
+            continue;
 
         let initialize = initializing.get(element)
         if (!initialize || initialize.src != src) {

package/src/form.js

@@ -46,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())
+
     }
 }
 

package/src/index.js

@@ -97,18 +97,26 @@ async function initElement(el) {
     if (!elements.has(el)) {
         elements.set(el, '')
 
-        if (['INPUT', 'TEXTAREA', 'SELECT'].includes(el.tagName)
-            || (el.hasAttribute('contenteditable') && el.getAttribute('contenteditable') !== 'false')
-            || el.contenteditable) {
-            el.addEventListener('input', function (e) {
-                const { object, key, isRealtime, isCrdt } = getAttributes(el);
-                if (!isRealtime || isRealtime === "false" || key === "_id") return;
-                if (isCrdt == "true" && object && object !== 'pending') return
-                if (e.detail && e.detail.skip == true) return;
-                if (data.type !== 'object' && data[data.type] === 'pending') return
-
-                save(el);
-            });
+        if (el.tagName === "EDITOR")
+            console.log('editor event added')
+        if (!el.elementsInputEvent) {
+            el.elementsInputEvent = true;
+
+            if (['INPUT', 'TEXTAREA', 'SELECT'].includes(el.tagName)
+                || (el.hasAttribute('contenteditable') && el.getAttribute('contenteditable') !== 'false')
+                || el.contenteditable) {
+                el.addEventListener('input', function (e) {
+                    if (el.pendingObject) return
+
+                    const { object, key, isRealtime, isCrdt } = getAttributes(el);
+                    if (!isRealtime || isRealtime === "false" || key === "_id") return;
+                    if (isCrdt == "true" && object && object !== 'pending') return
+                    if (e.detail && e.detail.skip == true) return;
+                    if (data.type !== 'object' && data[data.type] === 'pending') return
+
+                    save(el);
+                });
+            }
         }
     }
     // let attributes = ['filter-key', 'filter-search', 'filter-sort-key', 'filter-on', 'filter-limit']
@@ -416,11 +424,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 +446,7 @@ async function filterData(element, data, type, key) {
                         Data.push(doc[property])
                     }
                 } else
-                    return
+                    continue
             }
 
             // if (isObject && Data.length === 1) {
@@ -779,10 +789,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 == '{}')
@@ -1130,6 +1151,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);
             });
         }