@cocreate/utils 1.26.2 → 1.27.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [1.27.0](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.26.2...v1.27.0) (2023-11-03)
+
+
+### Bug Fixes
+
+* favicon.ico path ([4474c25](https://github.com/CoCreate-app/CoCreate-utils/commit/4474c25089a0953c6d24264152fe3b9d690dce25))
+* update dependencies to the lates versions ([d0bd60b](https://github.com/CoCreate-app/CoCreate-utils/commit/d0bd60bb21b2f555ddee0412861a9e7510173fb7))
+
+
+### Features
+
+* checkMediaQuries ([f9322d2](https://github.com/CoCreate-app/CoCreate-utils/commit/f9322d26261a4ee7007064115c86303a78534034))
+* isValidDate converts date to system local date ([4519b7c](https://github.com/CoCreate-app/CoCreate-utils/commit/4519b7ce2b2d739bd9c76dd0605f91c41837d7d0))
+
 ## [1.26.2](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.26.1...v1.26.2) (2023-10-25)
 
 

package/demo/index.html

@@ -6,9 +6,9 @@
         <!-- CoCreate Favicon -->
         <link
             rel="icon"
-            href="https://cdn.cocreate.app/favicon.ico"
-            type="image/ico"
-            sizes="16x16" />
+            type="image/png"
+            sizes="32x32"
+            href="../assets/favicon.ico" />
         <!-- CoCreate CSS CDN -->
         <link
             rel="stylesheet"

package/package.json

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

package/src/index.js

@@ -88,21 +88,19 @@
     }
 
     function isValidDate(value) {
-        // Check if the value is a string and can be converted to a Date object
-        if (typeof value === 'string'
-            && !isNaN(value)
-            && !(/^[0-9a-fA-F]{24}$/.test(value))
-            && !(/^(\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{1,3})?Z|Mon|Tue|Wed|Thu|Fri|Sat|Sun [A-Za-z]{3} \d{2} \d{4} \d{2}:\d{2}:\d{2} [A-Za-z]{3} \+\d{4}|\d{4}\/\d{2}\/\d{2} \d{2}:\d{2}:\d{2}(\.\d{1,3})?|\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}(\.\d{1,3})?|\d{4}\/\d{2}\/\d{2} \d{2}:\d{2}:\d{2}(\.\d{1,3})?|Sun|Mon|Tue|Wed|Thu|Fri|Sat),? .+$/.test(value))
-        ) {
-            const dateObject = new Date(value);
-
-            // Check if the result of the Date constructor is a valid Date object
-            if (!isNaN(dateObject) && dateObject.toString() !== 'Invalid Date') {
-                return dateObject; // It's a valid Date object
+        if (typeof value === 'string' && value.length >= 20 && value.length <= 24) {
+            const iso8601Regex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{1,3})?Z$/i;
+            if (iso8601Regex.test(value)) {
+                const dateObject = new Date(value);
+                dateObject.setUTCHours(dateObject.getUTCHours(), 0, 0, 0);
+                if (!isNaN(dateObject)) {
+                    return dateObject; // Is a valid date object and now utc 
+                }
             }
         }
 
-        return value; // It's not a valid Date object
+        return value; // Is a valid date object adjusted to UTC time
+
     }
 
     function dotNotationToObject(data, obj = {}) {
@@ -308,6 +306,12 @@
 
                 let selectors = Selector.split(',');
                 for (let j = 0; j < selectors.length; j++) {
+                    if (selectors[j].includes('@')) {
+                        selectors[j] = checkMediaQueries(selectors[j])
+                        if (selectors[j] === false)
+                            continue
+                    }
+
                     let queriedElement = element
                     let specialSelectors = selectors[j].split(';')
                     for (let k = 0; k < specialSelectors.length; k++) {
@@ -385,6 +389,41 @@
         return elements
     }
 
+    const mediaRanges = {
+        xs: [0, 575],
+        sm: [576, 768],
+        md: [769, 992],
+        lg: [993, 1200],
+        xl: [1201, 0],
+    };
+
+    function checkMediaQueries(selector) {
+        if (selector && selector.includes('@')) {
+            let screenSizes = selector.split('@')
+            selector = screenSizes.shift();
+            for (let screenSize of screenSizes) {
+                const viewportWidth = window.innerWidth;
+                let mediaViewport = false;
+
+                // Check if screenSize is a valid range in the 'ranges' object
+                if (mediaRanges.hasOwnProperty(screenSize)) {
+                    const [minWidth, maxWidth] = mediaRanges[screenSize];
+                    if (viewportWidth >= minWidth && viewportWidth <= maxWidth) {
+                        mediaViewport = true;
+                        break;
+                    }
+                }
+
+                if (!mediaViewport)
+                    return false
+
+            }
+        }
+
+        return selector
+    }
+
+
     function queryData(data, query) {
         if (!data)
             return false;
@@ -424,6 +463,9 @@
                             queryValue = queryValue.toLowerCase()
                     }
 
+                    dataValue = isValidDate(dataValue)
+                    queryValue = isValidDate(queryValue)
+
                     switch (query[i].operator) {
                         case '$includes':
                         case 'includes':
@@ -443,19 +485,19 @@
                                 queryStatus = true
                             break;
                         case '$lt':
-                            if (dataValue > queryValue)
+                            if (dataValue < queryValue)
                                 queryStatus = true
                             break;
                         case '$lte':
-                            if (dataValue >= queryValue)
+                            if (dataValue <= queryValue)
                                 queryStatus = true
                             break;
                         case '$gt':
-                            if (dataValue < queryValue)
+                            if (dataValue > queryValue)
                                 queryStatus = true
                             break;
                         case '$gte':
-                            if (dataValue <= queryValue)
+                            if (dataValue >= queryValue)
                                 queryStatus = true
                             break;
                         case '$in':
@@ -667,6 +709,7 @@
         escapeHtml,
         cssPath,
         queryElements,
+        checkMediaQueries,
         queryData,
         searchData,
         sortData,