@cocreate/elements 1.35.8 → 1.36.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# [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.0",
   "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();
@@ -134,6 +135,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)
@@ -716,6 +716,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')
@@ -1317,6 +1323,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])
         }
     }