@cocreate/element-prototype 1.19.0 → 1.20.1

package/CHANGELOG.md

@@ -1,3 +1,24 @@
+## [1.20.1](https://github.com/CoCreate-app/CoCreate-element-prototype/compare/v1.20.0...v1.20.1) (2024-02-05)
+
+
+### Bug Fixes
+
+* insert select options from src file ([7b644e1](https://github.com/CoCreate-app/CoCreate-element-prototype/commit/7b644e10368ca21f4e478c2b333759430b466ef2))
+* Removed https://cdn.cocreate.app/latest/CoCreate.min.css ([144d3e0](https://github.com/CoCreate-app/CoCreate-element-prototype/commit/144d3e0c0996f52022f89d404d785d08a1762cfc))
+
+# [1.20.0](https://github.com/CoCreate-app/CoCreate-element-prototype/compare/v1.19.0...v1.20.0) (2024-02-03)
+
+
+### Bug Fixes
+
+* distpatchEvents if innerHtml ([9d55c26](https://github.com/CoCreate-app/CoCreate-element-prototype/commit/9d55c26492014af2750a38ea7ea7e939b3df6577))
+* remove api typo ([2d7728b](https://github.com/CoCreate-app/CoCreate-element-prototype/commit/2d7728b8e52d1d0d290ebfac1c35308cfb9c200a))
+
+
+### Features
+
+* value-types to handle date and time ([3a72fbc](https://github.com/CoCreate-app/CoCreate-element-prototype/commit/3a72fbc23d9b8008a0bc488ac8230f5dfc2f86ea))
+
 # [1.19.0](https://github.com/CoCreate-app/CoCreate-element-prototype/compare/v1.18.0...v1.19.0) (2024-01-30)
 
 

package/docs/index.html

@@ -19,10 +19,6 @@
         <meta name="robots" content="index,follow" />
 
         <!-- CoCreate CSS CDN -->
-        <link
-            rel="stylesheet"
-            href="https://cdn.cocreate.app/latest/CoCreate.min.css"
-            type="text/css" />
 
         <link rel="manifest" href="/manifest.webmanifest" />
     </head>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/element-prototype",
-  "version": "1.19.0",
+  "version": "1.20.1",
   "description": "A simple element-prototype component in vanilla javascript. Easily configured using HTML5 data-attributes and/or JavaScript API.",
   "keywords": [
     "element-prototype",

package/src/getValue.js

@@ -26,6 +26,7 @@ const getValue = (element) => {
 
     let prefix = element.getAttribute('value-prefix') || "";
     let suffix = element.getAttribute('value-suffix') || "";
+    let valueType = element.getAttribute('value-type');
 
     if (element.type === "checkbox") {
         let inputs = [element]
@@ -78,10 +79,40 @@ const getValue = (element) => {
                 optionValue = prefix + optionValue + suffix;
             value.push(optionValue);
         }
-    } else if (["time", "datetime", "datetime-local"].includes(element.type)) {
-        value = new Date(value).toISOString();
-        if (el.type === 'time')
-            value = value.substring(11, 8) + 'Z';
+    } else if (["time", "date", "datetime", "datetime-local"].includes(element.type)) {
+        if (value === '$now')
+            value = new Date()
+        else if (value)
+            value = new Date(value)
+
+        if (value) {
+            if (!valueType)
+                value = value.toISOString()
+
+            if (element.type === 'time')
+                // value = value.substring(11, 8) + 'Z';
+                value = value.substring(11, 19) + 'Z';
+
+            switch (valueType) {
+                case 'getDayName':
+                    const days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
+                    value = days[value.getDay()];
+                    break;
+                case 'getMonthName':
+                    const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+                    value = months[value.getMonth()];
+                    break;
+                case 'toUnixTimestamp':
+                    value = Math.floor(value.getTime() / 1000);
+                    break;
+                default:
+                    if (typeof value[valueType] === 'function') {
+                        value = value[valueType]();
+                    } else {
+                        console.warn(`The method ${valueType} is not a function of Date object.`);
+                    }
+            }
+        }
     } else if (element.tagName == 'INPUT' || element.tagName == 'SELECT') {
         value = element.value;
     } else if (element.tagName == 'TEXTAREA') {
@@ -97,7 +128,6 @@ const getValue = (element) => {
         value = element.innerHTML;
     }
 
-    let valueType = element.getAttribute('value-type');
     if (!Array.isArray(value)) {
         if (prefix || suffix)
             value = prefix + value + suffix;

package/src/setValue.js

@@ -33,7 +33,8 @@ const setValue = (el, value, dispatch) => {
     if (suffix)
         value = value.toString().replace(suffix, "");
 
-    if (el.tagName == 'INPUT' || el.tagName == 'TEXTAREA' || el.tagName == 'SELECT') {
+    // TODO: el.options vs rendenring options from src
+    if (el.tagName == 'INPUT' || el.tagName == 'TEXTAREA' || el.tagName == 'SELECT' && el.options.length) {
         let { isCrdt } = getAttributes(el)
         if (isCrdt == null || isCrdt == undefined)
             isCrdt = el.getAttribute('crdt')
@@ -132,6 +133,10 @@ const setValue = (el, value, dispatch) => {
         if (el.hasAttribute("value")) {
             el.setAttribute("value", value);
         }
+
+
+        dispatchEvents(el, dispatch);
+
     }
 
     if (el.getAttribute('contenteditable'))