@symbo.ls/atoms 2.11.291 → 2.11.305

package/Collection.js

@@ -17,17 +17,19 @@ export const Collection = {
 
       const { __ref: ref } = el
 
+      if (isObjectLike(param)) param = deepClone(param)
+
       if (ref.__collectionCache) {
         const equals = JSON.stringify(param) === JSON.stringify(ref.__collectionCache)
         if (equals) {
           ref.__noCollectionDifference = true
           return
         } else {
-          ref.__collectionCache = deepClone(param)
+          ref.__collectionCache = param
           delete ref.__noCollectionDifference
         }
       } else {
-        ref.__collectionCache = deepClone(param)
+        ref.__collectionCache = param
       }
 
       const obj = {

package/Flex.js

@@ -1,12 +1,24 @@
 'use strict'
 
+import { isUndefined } from '@domql/utils'
+
 export const Flex = {
   props: {
     display: 'flex'
   },
 
   class: {
-    flow: ({ props }) => props.flow && ({ flexFlow: props.flow + (props.reverse ? '-reverse' : '') }),
+    flow: ({ props }) => {
+      const { flow } = props
+      if (isUndefined(flow)) return
+      let [direction, wrap] = flow.split(' ')
+      if (flow.startsWith('x') || flow.startsWith('row')) direction = 'row'
+      if (flow.startsWith('y') || flow.startsWith('column')) direction = 'column'
+      return {
+        flexFlow: (direction || '') + (props.reverse ? '-reverse' : '') + ' ' + (wrap || '')
+      }
+    },
+
     wrap: ({ props }) => props.wrap && ({ flexWrap: props.wrap }),
     align: ({ props }) => {
       if (typeof props.align !== 'string') return

package/Picture.js

@@ -26,6 +26,7 @@ export const Picture = {
 
   Img: ({ props }) => ({
     width: 'inherit',
+    ignoreChildExtend: true,
     height: 'inherit',
     src: props.src
   })

package/Svg.js

@@ -1,11 +1,8 @@
 'use strict'
 
-import { init } from '@symbo.ls/init'
-
 // create SVG symbol
 export const Svg = {
   tag: 'svg',
-  deps: { init },
   props: {
     style: { '*': { fill: 'currentColor' } }
   },
@@ -13,8 +10,8 @@ export const Svg = {
     xmlns: 'http://www.w3.org/2000/svg',
     'xmlns:xlink': 'http://www.w3.org/1999/xlink'
   },
-  html: ({ key, props, context, deps, ...el }) => {
-    const { designSystem } = context
+  html: ({ key, props, context, ...el }) => {
+    const { designSystem, utils } = context
     const SVG = designSystem && designSystem.SVG
     const useSvgSprite = props.spriteId || (context.designSystem && context.designSystem.useSvgSprite)
 
@@ -31,7 +28,7 @@ export const Svg = {
 
     SVGKey = SVG[symbolId] = Math.random()
     if (props.src) {
-      deps.init({
+      utils.init({
         svg: { [SVGKey]: props.src }
       }, {
         document: context.document,

package/Timing.js

@@ -5,6 +5,7 @@ import {
   splitTransition,
   transformDuration
 } from '@symbo.ls/scratch'
+import { isUndefined } from 'smbls'
 
 export const Timing = {
   deps: {
@@ -14,22 +15,22 @@ export const Timing = {
   },
 
   class: {
-    transition: ({ props, deps }) => props.transition && ({
+    transition: ({ props, deps }) => !isUndefined(props.transition) && ({
       transition: deps.splitTransition(props.transition)
     }),
-    willChange: ({ props }) => props.willChange && ({
+    willChange: ({ props }) => !isUndefined(props.willChange) && ({
       willChange: props.willChange
     }),
-    transitionDuration: ({ props, deps }) => props.transitionDuration && ({
+    transitionDuration: ({ props, deps }) => !isUndefined(props.transitionDuration) && ({
       transitionDuration: deps.transformDuration(props.transitionDuration)
     }),
-    transitionDelay: ({ props, deps }) => props.transitionDelay && ({
+    transitionDelay: ({ props, deps }) => !isUndefined(props.transitionDelay) && ({
       transitionDelay: deps.transformDuration(props.transitionDelay)
     }),
-    transitionTimingFunction: ({ props, deps }) => props.transitionTimingFunction && ({
+    transitionTimingFunction: ({ props, deps }) => !isUndefined(props.transitionTimingFunction) && ({
       transitionTimingFunction: deps.getTimingFunction(props.transitionTimingFunction)
     }),
-    transitionProperty: ({ props }) => props.transitionProperty && ({
+    transitionProperty: ({ props }) => !isUndefined(props.transitionProperty) && ({
       transitionProperty: props.transitionProperty,
       willChange: props.transitionProperty
     })

package/Transform.js

@@ -1,9 +1,11 @@
 'use strict'
 
+import { isUndefined } from 'smbls'
+
 export const Transform = {
   class: {
-    zoom: ({ props }) => props.zoom && ({ zoom: props.zoom }),
-    transform: ({ props }) => props.transform && ({ transform: props.transform }),
-    transformOrigin: ({ props }) => props.transformOrigin && ({ transformOrigin: props.transformOrigin })
+    zoom: ({ props }) => !isUndefined(props.zoom) && ({ zoom: props.zoom }),
+    transform: ({ props }) => !isUndefined(props.transform) && ({ transform: props.transform }),
+    transformOrigin: ({ props }) => !isUndefined(props.transformOrigin) && ({ transformOrigin: props.transformOrigin })
   }
 }

package/XYZ.js

@@ -1,7 +1,9 @@
 'use strict'
 
+import { isUndefined } from 'smbls'
+
 export const XYZ = {
   class: {
-    zIndex: ({ props }) => props.zIndex && ({ zIndex: props.zIndex })
+    zIndex: ({ props }) => !isUndefined(props.zIndex) && ({ zIndex: props.zIndex })
   }
 }

package/package.json

@@ -1,14 +1,13 @@
 {
   "name": "@symbo.ls/atoms",
-  "version": "2.11.291",
+  "version": "2.11.305",
   "main": "index.js",
   "license": "MIT",
-  "gitHead": "54f3dd0f443356a9cc26b3005ad352d5333f0c11",
+  "gitHead": "14569e713ad6d47a3be207df9f23dc0338a2d562",
   "dependencies": {
     "@domql/state": "latest",
     "@domql/utils": "latest",
     "@symbo.ls/emotion": "latest",
-    "@symbo.ls/init": "latest",
     "@symbo.ls/scratch": "latest"
   },
   "source": "src/index.js",