@symbo.ls/atoms 2.11.214 → 2.11.216

package/Collection.js

@@ -1,7 +1,7 @@
 'use strict'
 
 import { isState, getChildStateInKey } from '@domql/state'
-import { isString, isNot, isArray, isObject, isObjectLike, diff, deepClone, deepContains } from '@domql/utils'
+import { isString, isNot, isArray, isObject, isObjectLike, deepDiff, deepClone } from '@domql/utils'
 
 export const Collection = {
   define: {
@@ -38,18 +38,25 @@ export const Collection = {
       if (isState(param)) param = param.parse()
       if (isNot(param)('array', 'object')) return
 
-      if (el.key === 'cnt') {
-        if (el.__ref.__stateCollectionCache) {
-          const d = diff(param, el.__ref.__stateCollectionCache) // eslint-disable-line
+      const { __ref: ref } = el
+
+      if (ref.__stateCollectionCache) {
+        const d = deepDiff(param, ref.__stateCollectionCache) // eslint-disable-line
+        if (Object.keys(d).length) {
+          ref.__stateCollectionCache = deepClone(param)
+          delete ref.__noCollectionDifference
         } else {
-          el.__ref.__stateCollectionCache = deepClone(param)
+          ref.__noCollectionDifference = true
+          return
         }
+      } else {
+        ref.__stateCollectionCache = deepClone(param)
       }
 
       const obj = {
         tag: 'fragment',
         props: {
-          childProps: el.props.childProps
+          childProps: el.props && el.props.childProps
         }
       }
 
@@ -58,10 +65,8 @@ export const Collection = {
         obj[key] = { state: isObjectLike(value) ? value : { value } }
       }
 
-      if (!deepContains(obj, el.content)) {
-        el.removeContent()
-        el.content = obj
-      }
+      el.removeContent()
+      el.content = obj
 
       return obj
     },
@@ -76,10 +81,25 @@ export const Collection = {
       if (isState(param)) param = param.parse()
       if (isNot(param)('array', 'object')) return
 
+      const { __ref: ref } = el
+
+      if (ref.__propsCollectionCache) {
+        const d = deepDiff(param, ref.__propsCollectionCache) // eslint-disable-line
+        if (Object.keys(d).length) {
+          ref.__propsCollectionCache = deepClone(param)
+          delete ref.__noCollectionDifference
+        } else {
+          ref.__noCollectionDifference = true
+          return
+        }
+      } else {
+        ref.__propsCollectionCache = deepClone(param)
+      }
+
       const obj = {
         tag: 'fragment',
         props: {
-          childProps: el.props.childProps
+          childProps: el.props && el.props.childProps
         }
       }
 
@@ -88,10 +108,8 @@ export const Collection = {
         obj[key] = { props: isObjectLike(value) ? value : { value } }
       }
 
-      if (!deepContains(obj, el.content)) {
-        el.removeContent()
-        el.content = obj
-      }
+      el.removeContent()
+      el.content = obj
 
       // const set = () => {
       //   el.set(obj, { preventDefineUpdate: '$setPropsCollection' })

package/Theme.js

@@ -5,6 +5,7 @@ import {
   getMediaColor,
   transformTextStroke,
   transformShadow,
+  transformBoxShadow,
   transformBorder,
   transformBackgroundImage
 } from '@symbo.ls/scratch'
@@ -25,6 +26,7 @@ export const Theme = {
     getMediaColor,
     transformTextStroke,
     transformShadow,
+    transformBoxShadow,
     transformBorder,
     transformBackgroundImage
   },
@@ -119,12 +121,25 @@ export const Theme = {
       borderBottom: deps.transformBorder(props.borderBottom)
     }),
 
+    shadow: (element) => {
+      const { props, deps } = element
+      const globalTheme = deps.getSystemTheme(element)
+      if (!props.backgroundImage) return
+      return ({
+        boxShadow: deps.transformShadow(props.backgroundImage, globalTheme)
+      })
+    },
+
     boxShadow: ({ props, deps }) => !isUndefined(props.boxShadow) && ({
-      boxShadow: deps.transformShadow(props.boxShadow)
+      boxShadow: deps.transformBoxShadow(props.boxShadow)
     }),
 
     textShadow: ({ props, deps }) => !isUndefined(props.textShadow) && ({
-      textShadow: deps.transformShadow(props.textShadow)
+      textShadow: deps.transformBoxShadow(props.textShadow)
+    }),
+
+    backdropFilter: ({ props, deps }) => !isUndefined(props.backdropFilter) && ({
+      backdropFilter: props.backdropFilter
     }),
 
     opacity: ({ props }) => !isUndefined(props.opacity) && ({

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@symbo.ls/atoms",
-  "version": "2.11.214",
+  "version": "2.11.216",
   "main": "index.js",
   "license": "MIT",
-  "gitHead": "707d4101f2b259c80be5c1ad095ca1c0ea6ef35d",
+  "gitHead": "23694218fd8511bd183cb4ca1ed0493e3dbcc704",
   "dependencies": {
     "@domql/state": "latest",
     "@domql/utils": "latest",