@cocreate/elements 1.23.5 → 1.24.1

package/CHANGELOG.md

@@ -1,3 +1,26 @@
+## [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)
+
+
+### Bug Fixes
+
+* data[i].method ([71c0b7c](https://github.com/CoCreate-app/CoCreate-elements/commit/71c0b7ccd28d0f4bbf03b7d8cec615f21479af18))
+* delete for loop ([5507a86](https://github.com/CoCreate-app/CoCreate-elements/commit/5507a86526bdee6b7ac8f74d6ae051068ff9e736))
+* export getObject ([42bd4b3](https://github.com/CoCreate-app/CoCreate-elements/commit/42bd4b3fa66de724a94230c1c3ccfa7faea3a8b8))
+* replaced deleteDocuments with delete ([8e06633](https://github.com/CoCreate-app/CoCreate-elements/commit/8e0663351d459bd79a9f955a0a296df46ed3d580))
+
+
+### Features
+
+* delete-selector w/ fallback to clicked el ([4143fbb](https://github.com/CoCreate-app/CoCreate-elements/commit/4143fbbfade97c3073e8df6b1ce5b8051b5d5fe0))
+
 ## [1.23.5](https://github.com/CoCreate-app/CoCreate-elements/compare/v1.23.4...v1.23.5) (2023-10-14)
 
 

package/package.json

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

@@ -26,7 +26,7 @@
 import Observer from '@cocreate/observer';
 import Actions from '@cocreate/actions';
 import CRUD from '@cocreate/crud-client';
-import { dotNotationToObject, queryData, sortData, getAttributes, getAttributeNames, checkValue } from '@cocreate/utils';
+import { dotNotationToObject, queryElements, queryData, sortData, getAttributes, getAttributeNames, checkValue } from '@cocreate/utils';
 import filter from '@cocreate/filter';
 import render from '@cocreate/render';
 import '@cocreate/element-prototype';
@@ -250,7 +250,7 @@ async function read(element, data, dataKey) {
     debounce.set(dataKey.string, delayTimer)
 }
 
-function setData(element, data) {
+async function setData(element, data) {
     if (!element) {
         element = getDataElements(data)
         if (!element.length) return
@@ -278,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) {
@@ -292,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])) {
@@ -312,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 });
@@ -323,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
@@ -384,38 +384,44 @@ 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) {
-            if (data.$filter.currentIndex === index)
-                delete data.$filter.currentIndex
-            data.$filter.index = index
-            if (element.renderValue)
-                element.renderValue(data);
-            // render({ element, data, key: type });
-            else if (data)
-                element.setValue(data)
-        }
+    }
 
+    if (index >= 0) {
+        if (data.$filter.currentIndex === index)
+            delete data.$filter.currentIndex
+        data.$filter.index = index
+        if (element.renderValue)
+            element.renderValue(data);
+        else if (data)
+            element.setValue(data)
     }
+
 }
 
 function getDataKey(data) {
@@ -462,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;
@@ -495,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()) {
@@ -509,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') {
@@ -607,7 +615,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
@@ -619,8 +627,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')
@@ -656,8 +663,10 @@ async function save(element) {
         data = [data]
     }
 
+
+
     for (let i = 0; i < data.length; i++) {
-        if (data[i].type === 'object' && !data[i]) {
+        if (data[i].type === 'object' && !data[i].method) {
             if (typeof data[i].object === 'string') {
                 if (!data[i]._id)
                     data[i].method = 'create.object'
@@ -877,9 +886,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)
@@ -913,9 +922,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)
@@ -1042,10 +1051,32 @@ Actions.init({
     name: "delete",
     endEvent: "deleted",
     callback: async (action) => {
-        const data = getObject(action.element);
-        if (data) {
+        let elements = queryElements({ element: action.element, prefix: 'delete' });
+        if (elements === false)
+            elements = [action.element]
+
+        for (let i = 0; i < elements.length; i++) {
+            const data = getObject(elements[i]);
+            if (!data) return
             data.method = 'delete.' + data.type
-            if (data.type === 'object' && typeof data[data.type] === 'string')
+
+            if (elements[i].renderValue) {
+                let selected = elements[i].querySelectorAll('.selected')
+                data[data.type] = []
+                for (let j = 0; j < selected.length; j++) {
+                    let attribute = selected[j].getAttribute(data.type)
+                    if (attribute) {
+                        attribute = attribute.split(',')
+                        for (let k = 0; k < attribute.length; k++) {
+                            if (data.type === 'object')
+                                data[data.type].push({ _id: attribute[k] })
+                            else {
+                                data[data.type].push(attribute[k])
+                            }
+                        }
+                    }
+                }
+            } else if (data.type === 'object' && typeof data[data.type] === 'string')
                 data[data.type] = { _id: data[data.type] }
 
             let response = await CRUD.send(data)
@@ -1058,4 +1089,4 @@ Actions.init({
 
 init();
 
-export default { init, read, save, getData, reset, elements, keys, forms, debounce, getAttributes };
+export default { init, read, save, getData, getObject, reset, elements, keys, forms, debounce, getAttributes };