@cocreate/elements 1.24.0 → 1.24.2

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## [1.24.2](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.24.1...v1.24.2) (2023-10-19)
+
+
+### Bug Fixes
+
+* create.object condition undefined ([50e8a14](https://github.com/CoCreate-app/CoCreate-elements/commit/50e8a140da1b7de9a7ae93a12c7b35a884931283))
+* declartion of render functions using object spread ([d4ecf62](https://github.com/CoCreate-app/CoCreate-elements/commit/d4ecf623f83869b54dc2938ccbebd26358597bdb))
+
+## [1.24.1](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.24.0...v1.24.1) (2023-10-17)
+
+
+### Bug Fixes
+
+* await getValue() ([5970879](https://github.com/CoCreate-app/CoCreate-elements/commit/5970879904665a1f8c6659141928b0ea4de32d9f))
+* create item in rendered element ([3b68724](https://github.com/CoCreate-app/CoCreate-elements/commit/3b687245207d1d06c1ddbe8bece64893b6e46478))
+
 # [1.24.0](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.23.5...v1.24.0) (2023-10-16)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/elements",
-  "version": "1.24.0",
+  "version": "1.24.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/form.js

@@ -17,8 +17,6 @@ function init(elements) {
         runObjectId(element);
         setAttribute(element);
         disableAutoFill(element);
-        // element.setData = () => { }
-        // element.getData = () => getFormData(element)
     }
 }
 

package/src/index.js

@@ -28,7 +28,7 @@ import Actions from '@cocreate/actions';
 import CRUD from '@cocreate/crud-client';
 import { dotNotationToObject, queryElements, queryData, sortData, getAttributes, getAttributeNames, checkValue } from '@cocreate/utils';
 import filter from '@cocreate/filter';
-import render from '@cocreate/render';
+import { render, renderedNodes } from '@cocreate/render';
 import '@cocreate/element-prototype';
 import './fetchSrc';
 import { reset } from './form'
@@ -250,9 +250,7 @@ async function read(element, data, dataKey) {
     debounce.set(dataKey.string, delayTimer)
 }
 
-function setData(element, data) {
-    if (data.method === 'delete.object')
-        console.log('test')
+async function setData(element, data) {
     if (!element) {
         element = getDataElements(data)
         if (!element.length) return
@@ -280,7 +278,7 @@ function setData(element, data) {
 
         const { key, isRead, isListen, isCrdt } = getAttributes(el);
         if (el.getFilter || el.renderValue)
-            filterData(el, data, type, key)
+            await filterData(el, data, type, key)
         else {
             let value = CRUD.getValueFromObject(data[type][0], key);
             if (key) {
@@ -294,7 +292,7 @@ function setData(element, data) {
     }
 }
 
-function filterData(element, data, type, key) {
+async function filterData(element, data, type, key) {
     if (key) {
         if (!data.type) return
         if (Array.isArray(data[type])) {
@@ -314,7 +312,7 @@ function filterData(element, data, type, key) {
     }
 
     if (element.getFilter && data.method && !data.method.startsWith('read'))
-        checkFilters(element, data, type)
+        await checkFilters(element, data, type)
     else if (element.renderValue)
         element.renderValue(data);
     // render({ element, data, key: type });
@@ -325,8 +323,8 @@ function filterData(element, data, type, key) {
     element.dispatchEvent(evt);
 }
 
-function checkFilters(element, data, type) {
-    let Data = element.getData()
+async function checkFilters(element, data, type) {
+    let Data = await element.getData()
     if (!Data) return
 
     let newData
@@ -386,25 +384,32 @@ function checkIndex(element, data, Data, newData, type, filter) {
     if (!data.$filter)
         data.$filter = {}
 
-    if (data.method.startsWith('delete')) {
+    if (data.method.startsWith('delete.')) {
         if (!index && index !== 0)
             return
         data.$filter.remove = true
     } else {
-        if (!index && index !== 0) {
-            data.$filter.create = true
-            Data.push(newData)
+        if (data.method.startsWith('create.')) {
+            if (index === -1) {
+                data.$filter.create = true
+                if (filter && filter.sort)
+                    newData.isNewData = true
+                Data.push(newData)
+            }
         } else {
             data.$filter.update = true
             data.$filter.currentIndex = index
             Data[index] = dotNotationToObject(newData, Data[index])
+            if (filter && filter.sort) {
+                Data[index].isNewData = true
+            }
         }
 
         if (filter && filter.sort) {
-            Data[index].isNewData = true
             Data = sortData(Data, filter.sort)
             index = Data.findIndex(obj => obj.isNewData);
         }
+
     }
 
     if (index >= 0) {
@@ -463,7 +468,9 @@ function getDataKeys(data) {
         let hasMatch = true;
 
         for (const key of targetKeys) {
-            if (data.hasOwnProperty(key)) {
+            if (!data.$filter && (data.type === key || key === '$filter'))
+                hasMatch = true
+            else if (data.hasOwnProperty(key)) {
                 if (!sortedKey.data.hasOwnProperty(key)) {
                     hasMatch = false;
                     break;
@@ -496,7 +503,7 @@ function getDataKeys(data) {
     return matchingKeyStrings;
 }
 
-function getData(form) {
+async function getData(form) {
     let dataKeys = new Map()
     let formObject = forms.get(form)
     for (let type of formObject.types.values()) {
@@ -510,9 +517,9 @@ function getData(form) {
             }
             let Data = { ...data }
             let dataKey = elements.get(element)
-            let value = element.getValue()
-            // console.log(type, value, data)
+            let value = await element.getValue()
 
+            // console.log(type, value, data)
             if (!Data[Data.type] && Data.key) {
                 Data.method = 'create.' + Data.type
                 if (Data.type === 'object') {
@@ -547,8 +554,11 @@ function getData(form) {
                     else if (typeof Data[Data.type] === 'object')
                         if (Data.key == '{}')
                             Data[Data.type] = { ...Data[Data.type], ...value }
-                        else
+                        else {
                             Data[Data.type][Data.key] = value
+                            if (!Data[Data.type]._id)
+                                Data.method = 'create.' + Data.type
+                        }
                 } else {
                     Data[Data.type] = { [Data[Data.type]]: value }
                 }
@@ -608,7 +618,7 @@ async function save(element) {
     if (upsert !== undefined || upsert !== null)
         upsert = true
     if (element.tagName === "FORM") {
-        data = element.getData()
+        data = await element.getData()
     } else {
         let isSave = element.getAttribute('save')
         if (isSave === 'false') return
@@ -620,8 +630,7 @@ async function save(element) {
         let dataKey = elements.get(element)
         data = { ...keys.get(dataKey).dataKey.object }
 
-        value = element.getValue();
-
+        value = await element.getValue();
         let key = element.getAttribute('key')
 
         if (typeof data[data.type] === 'string')
@@ -658,7 +667,7 @@ async function save(element) {
     }
 
 
-
+    let Data = []
     for (let i = 0; i < data.length; i++) {
         if (data[i].type === 'object' && !data[i].method) {
             if (typeof data[i].object === 'string') {
@@ -699,8 +708,11 @@ async function save(element) {
             });
         }
 
+
         data[i] = await CRUD.send(data[i]);
 
+        Data.push(data[i])
+
         if (data[i] && (data[i].method.startsWith('create') || data[i].type !== 'object' && data[i].method.startsWith('update'))) {
             setTypeValue(element, data[i])
         } else if (data[i])
@@ -710,6 +722,7 @@ async function save(element) {
 
     }
 
+    return Data
 }
 
 function setTypeValue(element, data) {
@@ -865,7 +878,7 @@ Observer.init({
         clearTimeout(delayTimer);
         debounce.delete(mutation.target)
 
-        let renderedNode = render.renderedNodes.get(mutation.target)
+        let renderedNode = renderedNodes.get(mutation.target)
         if (!renderedNode) return
 
         if (!mutation.movedFrom) return
@@ -880,9 +893,9 @@ Observer.init({
 })
 
 // TODO: has the potential to work on most of the crud elements specifically if the value is an object or an array
-function dndCrud(draggedEl, draggedFrom, droppedEl, droppedIn) {
-    let from = dndCrudData(draggedEl, draggedFrom, 'remove')
-    let to = dndCrudData(droppedEl, droppedIn, 'add')
+async function dndCrud(draggedEl, draggedFrom, droppedEl, droppedIn) {
+    let from = await dndCrudData(draggedEl, draggedFrom, 'remove')
+    let to = await dndCrudData(droppedEl, droppedIn, 'add')
 
     if (from && to && !draggedFrom.isSameNode(droppedIn)) {
         let element = getDataElements(from.data)
@@ -916,9 +929,9 @@ function dndCrud(draggedEl, draggedFrom, droppedEl, droppedIn) {
 
 }
 
-function dndCrudData(element, parent, operator) {
+async function dndCrudData(element, parent, operator) {
     if (!elements.has(parent)) return
-    let data = parent.getData()
+    let data = await parent.getData()
     let newData = getObject(parent)
 
     let { Data, sortName, sortDirection, keyPath, clones, index } = dndNewData(element, data)
@@ -970,10 +983,9 @@ function dndNewData(element, data) {
         }
     }
 
-
     let keyPath, clonesMap, clones, index
 
-    let renderedNode = CoCreate.render.renderedNodes.get(element)
+    let renderedNode = renderedNodes.get(element)
     if (renderedNode) {
         keyPath = renderedNode.keyPath
         clonesMap = renderedNode.template.clones