@symbo.ls/avatar - npm Package Compare versions

Comparing version 2.11.138 to 2.11.143

index.js

@@ -6,2 +6,4 @@ 'use strict'
 import { IndicatorDot } from '@symbo.ls/accessories'
+import { InfoSet } from '@symbo.ls/infoset'
+import { CardLabel } from '@symbo.ls/card'
 
@@ -49,3 +51,4 @@ export const Avatar = {
     }
-  }
+  },
+  ...[{}, {}]
 }
@@ -98,1 +101,145 @@
 }
+
+export const AvatarWithInfoSet = {
+  extend: Flex,
+  avatar: { extend: AvatarWithIndicator },
+  infos: {
+    extend: InfoSet,
+    ...[
+      {
+        title: { props: { text: 'Erin Schleifer' } },
+        subTitle: { caption: { props: { text: '[e-mail]' } } }
+      }
+    ]
+  },
+
+  props: {
+    boxSize: 'fit-content',
+    align: 'center flex-start',
+    gap: 'A',
+    infos: {
+      childProps: {
+        flow: 'column',
+        subTitle: { caption: { whiteSpace: 'nowrap' } }
+      }
+    }
+  }
+}
+
+export const AvatarInfoSetWithLabel = {
+  extend: AvatarWithInfoSet,
+  avatar: { extend: Avatar },
+  infos: {
+    ...[
+      {
+        title: { props: { text: 'ETHDOWN' } },
+        label: { extend: CardLabel },
+        subTitle: null,
+        props: { gap: 'Z' }
+      },
+      {
+        subTitle: { props: { text: 'Short ADA with up to 4x Leverage' } }
+      }
+    ]
+  },
+
+  props: {
+    avatar: { boxSize: 'B' },
+    infos: {
+      gap: 'X',
+      childProps: {
+        flow: 'row'
+      }
+    }
+  }
+}
+
+export const AvatarInfoSetWithButton = {
+  extend: AvatarWithInfoSet,
+  avatar: { extend: Avatar },
+  infos: {
+    ...[
+      {
+        title: { props: { text: 'Wallet ID' } },
+        subTitle: { caption: { props: { text: '0xfb59...d862' } } }
+      },
+      {
+        extend: Button,
+        props: { icon: 'copyOutline' }
+      }
+    ]
+  },
+
+  props: {
+    padding: 'Y A Y Y',
+    border: '1px solid #57575C',
+    round: 'Z',
+    gap: 'Z',
+    avatar: {
+      boxSize: 'A+B',
+      round: 'Y'
+    },
+    infos: {
+      flow: 'row',
+      align: 'center flex-start',
+      gap: 'A+X',
+      childProps: {
+        title: { fontSize: 'Y' },
+        ':nth-child(2)': {
+          padding: '0',
+          color: 'white',
+          fontSize: 'C',
+          background: 'transparent'
+        }
+      }
+    }
+  }
+}
+
+export const AvatarBundleInfoSet = {
+  extend: AvatarWithInfoSet,
+  avatar: { extend: AvatarBundle },
+  infos: {
+    ...[
+      {
+        title: { props: { text: 'ETH/BNB' } },
+        label: {
+          extend: CardLabel,
+          props: { text: '1 ETH = 240.7 BNB' }
+        },
+        subTitle: null
+      }
+    ]
+  },
+
+  props: {
+    gap: 'Z',
+    background: '#1C1C1F',
+    padding: 'A A',
+    round: 'Z',
+    avatar: {
+      childProps: {
+        boxSize: 'A+A',
+        ':not(:first-child)': {
+          border: 'solid, black 0',
+          borderWidth: '1px'
+        }
+        // style: {
+        //   '&:not(:first-child)': { border: '1px solid rgba(0, 0, 0, 0)' }
+        // }
+      }
+    },
+    infos: {
+      childProps: {
+        flow: 'row',
+        gap: 'Z',
+        align: 'center flex-start',
+        title: { fontWeight: '700' },
+        label: {
+          background: 'black',
+          padding: 'Y Z'
+        }
+      }
+    }
+  }
+}

package.json

 {
   "name": "@symbo.ls/avatar",
-  "version": "2.11.138",
+  "version": "2.11.143",
   "main": "index.js",
   "license": "MIT",
-  "gitHead": "d106932603cf5402acd55e4c03b8163f9beccc5c",
+  "gitHead": "3d7bcc81ae9ee0083a70e6b95f7ecac3b73359ba",
   "dependencies": {
@@ -8,0 +8,0 @@ "@symbo.ls/atoms": "latest",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

6436

increased by80.89%

Lines of code

240

increased by137.62%

No dependency changes