@web3modal/ui - npm Package Compare versions

Comparing version 4.1.5 to 4.1.6-canary-sl-001.0

dist/esm/index.js

@@ -63,2 +63,4 @@ export * from './src/components/wui-card/index.js';
 export * from './src/composites/wui-preview-item/index.js';
+export * from './src/composites/wui-list-button/index.js';
+export * from './src/composites/wui-list-social/index.js';
 export * from './src/layout/wui-flex/index.js';
@@ -65,0 +67,0 @@ export * from './src/layout/wui-grid/index.js';

dist/esm/src/assets/svg/google.js

 import { svg } from 'lit';
 export const googleSvg = svg `<svg fill="none" viewBox="0 0 40 40">
-  <g clip-path="url(#a)">
-    <g clip-path="url(#b)">
-      <circle cx="20" cy="19.89" r="20" fill="#fff" fill-opacity=".05" />
-      <g clip-path="url(#c)">
-        <path
-          fill="#4285F4"
-          d="M20 17.7v4.65h6.46a5.53 5.53 0 0 1-2.41 3.61l3.9 3.02c2.26-2.09 3.57-5.17 3.57-8.82 0-.85-.08-1.67-.22-2.46H20Z"
-        />
-        <path
-          fill="#34A853"
-          d="m13.27 22.17-.87.67-3.11 2.42A12 12 0 0 0 20 31.9c3.24 0 5.96-1.07 7.94-2.9l-3.9-3.03A7.15 7.15 0 0 1 20 27.12a7.16 7.16 0 0 1-6.72-4.94v-.01Z"
-        />
-        <path
-          fill="#FBBC05"
-          d="M9.29 14.5a11.85 11.85 0 0 0 0 10.76l3.99-3.1a7.19 7.19 0 0 1 0-4.55l-4-3.1Z"
-        />
-        <path
-          fill="#EA4335"
-          d="M20 12.66c1.77 0 3.34.61 4.6 1.8l3.43-3.44A11.51 11.51 0 0 0 20 7.89c-4.7 0-8.74 2.69-10.71 6.62l3.99 3.1A7.16 7.16 0 0 1 20 12.66Z"
-        />
-      </g>
-    </g>
-  </g>
-  <defs>
-    <clipPath id="a"><rect width="40" height="40" fill="#fff" rx="20" /></clipPath>
-    <clipPath id="b"><path fill="#fff" d="M0 0h40v40H0z" /></clipPath>
-    <clipPath id="c"><path fill="#fff" d="M8 7.89h24v24H8z" /></clipPath>
-  </defs>
+  <path
+    fill="#4285F4"
+    d="M32.74 20.3c0-.93-.08-1.81-.24-2.66H20.26v5.03h7a6 6 0 0 1-2.62 3.91v3.28h4.22c2.46-2.27 3.88-5.6 3.88-9.56Z"
+  />
+  <path
+    fill="#34A853"
+    d="M20.26 33a12.4 12.4 0 0 0 8.6-3.14l-4.22-3.28a7.74 7.74 0 0 1-4.38 1.26 7.76 7.76 0 0 1-7.28-5.36H8.65v3.36A12.99 12.99 0 0 0 20.26 33Z"
+  />
+  <path
+    fill="#FBBC05"
+    d="M12.98 22.47a7.79 7.79 0 0 1 0-4.94v-3.36H8.65a12.84 12.84 0 0 0 0 11.66l3.37-2.63.96-.73Z"
+  />
+  <path
+    fill="#EA4335"
+    d="M20.26 12.18a7.1 7.1 0 0 1 4.98 1.93l3.72-3.72A12.47 12.47 0 0 0 20.26 7c-5.08 0-9.47 2.92-11.6 7.17l4.32 3.36a7.76 7.76 0 0 1 7.28-5.35Z"
+  />
 </svg>`;
 //# sourceMappingURL=google.js.map

dist/esm/src/assets/svg/telegram.js

 import { svg } from 'lit';
 export const telegramSvg = svg `<svg fill="none" viewBox="0 0 40 40">
   <g clip-path="url(#a)">
-    <g clip-path="url(#b)">
-      <circle cx="20" cy="19.89" r="20" fill="#5865F2" />
-      <path
-        fill="#fff"
-        fill-rule="evenodd"
-        d="M25.71 28.15C30.25 28 32 25.02 32 25.02c0-6.61-2.96-11.98-2.96-11.98-2.96-2.22-5.77-2.15-5.77-2.15l-.29.32c3.5 1.07 5.12 2.61 5.12 2.61a16.75 16.75 0 0 0-10.34-1.93l-.35.04a15.43 15.43 0 0 0-5.88 1.9s1.71-1.63 5.4-2.7l-.2-.24s-2.81-.07-5.77 2.15c0 0-2.96 5.37-2.96 11.98 0 0 1.73 2.98 6.27 3.13l1.37-1.7c-2.6-.79-3.6-2.43-3.6-2.43l.58.35.09.06.08.04.02.01.08.05a17.25 17.25 0 0 0 4.52 1.58 14.4 14.4 0 0 0 8.3-.86c.72-.27 1.52-.66 2.37-1.21 0 0-1.03 1.68-3.72 2.44.61.78 1.35 1.67 1.35 1.67Zm-9.55-9.6c-1.17 0-2.1 1.03-2.1 2.28 0 1.25.95 2.28 2.1 2.28 1.17 0 2.1-1.03 2.1-2.28.01-1.25-.93-2.28-2.1-2.28Zm7.5 0c-1.17 0-2.1 1.03-2.1 2.28 0 1.25.95 2.28 2.1 2.28 1.17 0 2.1-1.03 2.1-2.28 0-1.25-.93-2.28-2.1-2.28Z"
-        clip-rule="evenodd"
-      />
-    </g>
+    <path fill="url(#b)" d="M0 0h40v40H0z" />
+    <path
+      fill="#fff"
+      fill-rule="evenodd"
+      d="M8.8 19.07c6.21-2.71 10.36-4.5 12.43-5.36 5.93-2.47 7.16-2.9 7.96-2.91.18 0 .57.04.83.25a.9.9 0 0 1 .3.58c.03.16.07.54.04.84a252.59 252.59 0 0 1-2.42 15.33c-.3 1.6-.89 2.14-1.46 2.19-1.24.11-2.18-.82-3.38-1.6-1.87-1.24-2.94-2-4.76-3.2-2.1-1.4-.74-2.15.46-3.4.32-.33 5.77-5.3 5.88-5.74.01-.06.03-.27-.1-.38-.12-.11-.3-.07-.44-.04-.19.04-3.19 2.02-9 5.95-.85.58-1.62.87-2.31.85-.76-.02-2.23-.43-3.32-.78-1.34-.44-2.4-.67-2.3-1.4.04-.39.57-.78 1.58-1.18Z"
+      clip-rule="evenodd"
+    />
   </g>
   <defs>
-    <clipPath id="a"><rect width="40" height="40" fill="#fff" rx="20" /></clipPath>
-    <clipPath id="b"><path fill="#fff" d="M0 0h40v40H0z" /></clipPath>
+    <linearGradient id="b" x1="2000" x2="2000" y1="0" y2="3970.33" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#2AABEE" />
+      <stop offset="1" stop-color="#229ED9" />
+    </linearGradient>
+    <clipPath id="a"><path fill="#fff" d="M0 20a20 20 0 1 1 40 0 20 20 0 0 1-40 0Z" /></clipPath>
   </defs>
 </svg> `;
 //# sourceMappingURL=telegram.js.map

dist/esm/src/assets/svg/twitch.js

 import { svg } from 'lit';
 export const twitchSvg = svg `<svg fill="none" viewBox="0 0 40 40">
   <g clip-path="url(#a)">
-    <g clip-path="url(#b)">
-      <circle cx="20" cy="19.89" r="20" fill="#5A3E85" />
-      <g clip-path="url(#c)">
-        <path
-          fill="#fff"
-          d="M18.22 25.7 20 23.91h3.34l2.1-2.1v-6.68H15.4v8.78h2.82v1.77Zm3.87-8.16h1.25v3.66H22.1v-3.66Zm-3.34 0H20v3.66h-1.25v-3.66ZM20 7.9a12 12 0 1 0 0 24 12 12 0 0 0 0-24Zm6.69 14.56-3.66 3.66h-2.72l-1.77 1.78h-1.88V26.1H13.3v-9.82l.94-2.4H26.7v8.56Z"
-        />
-      </g>
-    </g>
+    <path fill="#9146FF" d="M0 0h40v40H0z" />
+    <path fill="#fff" d="m29.14 20.69-3.66 3.65h-3.66l-3.2 3.2v-3.2h-4.11V10.63h14.63v10.06Z" />
+    <path
+      fill="#000"
+      d="m13.6 8.8-4.58 4.57v16.46h5.49v4.57l4.57-4.57h3.66l8.23-8.23V8.8H13.6Zm15.54 11.89-3.66 3.65h-3.66l-3.2 3.2v-3.2h-4.11V10.63h14.63v10.06Z"
+    />
+    <path fill="#000" d="M26.4 13.83h-1.83v5.48h1.83v-5.48ZM21.37 13.83h-1.83v5.48h1.83v-5.48Z" />
   </g>
   <defs>
-    <clipPath id="a"><rect width="40" height="40" fill="#fff" rx="20" /></clipPath>
-    <clipPath id="b"><path fill="#fff" d="M0 0h40v40H0z" /></clipPath>
-    <clipPath id="c"><path fill="#fff" d="M8 7.89h24v24H8z" /></clipPath>
+    <clipPath id="a"><path fill="#fff" d="M0 20a20 20 0 1 1 40 0 20 20 0 0 1-40 0Z" /></clipPath>
   </defs>
 </svg>`;
 //# sourceMappingURL=twitch.js.map

dist/esm/src/components/wui-icon/index.js

@@ -12,2 +12,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 import styles from './styles.js';
+import { addSvg } from '../../assets/svg/add.js';
 import { allWalletsSvg } from '../../assets/svg/all-wallets.js';
@@ -21,3 +22,5 @@ import { arrowBottomCircleSvg } from '../../assets/svg/arrow-bottom-circle.js';
 import { arrowTopSvg } from '../../assets/svg/arrow-top.js';
+import { bankSvg } from '../../assets/svg/bank.js';
 import { browserSvg } from '../../assets/svg/browser.js';
+import { cardSvg } from '../../assets/svg/card.js';
 import { checkmarkSvg } from '../../assets/svg/checkmark.js';
@@ -34,4 +37,4 @@ import { chevronBottomSvg } from '../../assets/svg/chevron-bottom.js';
 import { copySvg } from '../../assets/svg/copy.js';
-import { addSvg } from '../../assets/svg/add.js';
 import { cursorSvg } from '../../assets/svg/cursor.js';
+import { cursorTransparentSvg } from '../../assets/svg/cursor-transparent.js';
 import { desktopSvg } from '../../assets/svg/desktop.js';
@@ -51,2 +54,3 @@ import { disconnectSvg } from '../../assets/svg/disconnect.js';
 import { mobileSvg } from '../../assets/svg/mobile.js';
+import { moreSvg } from '../../assets/svg/more.js';
 import { networkPlaceholderSvg } from '../../assets/svg/network-placeholder.js';
@@ -56,3 +60,5 @@ import { nftPlaceholderSvg } from '../../assets/svg/nftPlaceholder.js';
 import { playStoreSvg } from '../../assets/svg/play-store.js';
+import { plusSvg } from '../../assets/svg/plus.js';
 import { qrCodeIcon } from '../../assets/svg/qr-code.js';
+import { recycleHorizontalSvg } from '../../assets/svg/recycle-horizontal.js';
 import { refreshSvg } from '../../assets/svg/refresh.js';
@@ -67,3 +73,2 @@ import { searchSvg } from '../../assets/svg/search.js';
 import { twitchSvg } from '../../assets/svg/twitch.js';
-import { twitterSvg } from '../../assets/svg/twitter.js';
 import { twitterIconSvg } from '../../assets/svg/twitterIcon.js';
@@ -76,7 +81,3 @@ import { verifySvg } from '../../assets/svg/verify.js';
 import { warningCircleSvg } from '../../assets/svg/warning-circle.js';
-import { recycleHorizontalSvg } from '../../assets/svg/recycle-horizontal.js';
-import { bankSvg } from '../../assets/svg/bank.js';
-import { cardSvg } from '../../assets/svg/card.js';
-import { plusSvg } from '../../assets/svg/plus.js';
-import { cursorTransparentSvg } from '../../assets/svg/cursor-transparent.js';
+import { xSvg } from '../../assets/svg/x.js';
 const svgOptions = {
@@ -122,2 +123,3 @@ add: addSvg,
     mobile: mobileSvg,
+    more: moreSvg,
     networkPlaceholder: networkPlaceholderSvg,
@@ -139,3 +141,2 @@ nftPlaceholder: nftPlaceholderSvg,
     twitch: twitchSvg,
-    twitter: twitterSvg,
     twitterIcon: twitterIconSvg,
@@ -147,3 +148,4 @@ verify: verifySvg,
     walletPlaceholder: walletPlaceholderSvg,
-    warningCircle: warningCircleSvg
+    warningCircle: warningCircleSvg,
+    x: xSvg
 };
@@ -150,0 +152,0 @@ let WuiIcon = class WuiIcon extends LitElement {

dist/esm/src/composites/wui-email-input/index.js

@@ -25,3 +25,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
         icon="mail"
-        size="md"
+        size="mdl"
         .disabled=${this.disabled}
@@ -28,0 +28,0 @@ .value=${this.value}

dist/esm/src/composites/wui-input-text/styles.js

@@ -16,3 +16,2 @@ import { css } from 'lit';
     font-size: var(--wui-font-size-paragraph);
-    font-weight: var(--wui-font-weight-light);
     letter-spacing: var(--wui-letter-spacing-paragraph);
@@ -105,2 +104,13 @@ color: var(--wui-color-fg-100);
 
+  .wui-size-mdl {
+    padding: 17.25px var(--wui-spacing-m) 17.25px var(--wui-spacing-m);
+  }
+  wui-icon + .wui-size-mdl,
+  wui-loading-spinner + .wui-size-mdl {
+    padding: 17.25px var(--wui-spacing-3xl) 17.25px 40px;
+  }
+  wui-icon[data-input='mdl'] {
+    left: var(--wui-spacing-m);
+  }
+
   input:placeholder-shown ~ ::slotted(wui-input-element),
@@ -107,0 +117,0 @@ input:placeholder-shown ~ ::slotted(wui-icon) {

dist/esm/src/composites/wui-logo-select/styles.js

@@ -5,7 +5,8 @@ import { css } from 'lit';
     display: block;
+    width: 100%;
   }
 
   button {
-    width: 50px;
-    height: 50px;
+    width: 100%;
+    height: 56px;
     background: var(--wui-gray-glass-002);
@@ -12,0 +13,0 @@ border-radius: var(--wui-border-radius-xs);

dist/esm/src/composites/wui-logo/styles.js

 import { css } from 'lit';
 export default css `
   :host {
-    display: block;
+    display: flex;
+    justify-content: center;
+    align-items: center;
     width: 40px;
     height: 40px;
     border-radius: var(--wui-border-radius-3xl);
-    border: 1px solid var(--wui-gray-glass-010);
+    border: 1px solid var(--wui-gray-glass-005);
     overflow: hidden;
@@ -10,0 +12,0 @@ }

dist/esm/src/utils/UiHelperUtil.js

@@ -94,4 +94,7 @@ export const UiHelperUtil = {
         return roundedNumber;
+    },
+    capitalizeFirstLetter(string) {
+        return string.charAt(0).toUpperCase() + string.slice(1);
     }
 };
 //# sourceMappingURL=UiHelperUtil.js.map

dist/types/index.d.ts

@@ -63,2 +63,4 @@ export * from './src/components/wui-card/index.js';
 export * from './src/composites/wui-preview-item/index.js';
+export * from './src/composites/wui-list-button/index.js';
+export * from './src/composites/wui-list-social/index.js';
 export * from './src/layout/wui-flex/index.js';
@@ -65,0 +67,0 @@ export * from './src/layout/wui-grid/index.js';

dist/types/src/composites/wui-input-text/index.d.ts

@@ -7,3 +7,3 @@ import { LitElement } from 'lit';
     inputElementRef: import("lit-html/directives/ref.js").Ref<HTMLInputElement>;
-    size: Exclude<SizeType, 'inherit' | 'xl' | 'xs' | 'xxs'>;
+    size: Exclude<SizeType, 'inherit' | 'xs' | 'xxs'>;
     icon?: IconType;
@@ -10,0 +10,0 @@ disabled: boolean;

dist/types/src/utils/JSXTypeUtil.d.ts

@@ -60,2 +60,4 @@ import type { WuiCard } from '../components/wui-card/index.js';
 import type { WuiPreviewItem } from '../composites/wui-preview-item/index.js';
+import type { WuiListButton } from '../composites/wui-list-button/index.js';
+import type { WuiListSocial } from '../composites/wui-list-social/index.js';
 import type { WuiFlex } from '../layout/wui-flex/index.js';
@@ -133,2 +135,4 @@ import type { WuiGrid } from '../layout/wui-grid/index.js';
             'wui-preview-item': CustomElement<WuiPreviewItem>;
+            'wui-list-button': CustomElement<WuiListButton>;
+            'wui-list-social': CustomElement<WuiListSocial>;
         }
@@ -135,0 +139,0 @@ }

dist/types/src/utils/TypeUtil.d.ts

@@ -20,6 +20,6 @@ export type ColorType = 'accent-100' | 'error-100' | 'fg-100' | 'fg-150' | 'fg-200' | 'fg-250' | 'fg-300' | 'inherit' | 'inverse-000' | 'inverse-100' | 'success-100' | 'glass-005';
 export type GridItemsType = 'center' | 'end' | 'start' | 'stretch';
-export type IconType = 'add' | 'allWallets' | 'arrowBottomCircle' | 'appStore' | 'chromeStore' | 'apple' | 'arrowBottom' | 'arrowLeft' | 'arrowRight' | 'arrowTop' | 'bank' | 'browser' | 'card' | 'checkmark' | 'chevronBottom' | 'chevronLeft' | 'chevronRight' | 'chevronTop' | 'clock' | 'close' | 'coinPlaceholder' | 'compass' | 'copy' | 'cursor' | 'cursorTransparent' | 'desktop' | 'disconnect' | 'discord' | 'etherscan' | 'extension' | 'externalLink' | 'facebook' | 'filters' | 'github' | 'google' | 'helpCircle' | 'infoCircle' | 'mail' | 'mobile' | 'networkPlaceholder' | 'nftPlaceholder' | 'off' | 'playStore' | 'plus' | 'qrCode' | 'recycleHorizontal' | 'refresh' | 'search' | 'send' | 'swapHorizontal' | 'swapHorizontalBold' | 'swapHorizontalMedium' | 'swapVertical' | 'telegram' | 'twitch' | 'twitter' | 'twitterIcon' | 'verify' | 'verifyFilled' | 'wallet' | 'walletConnect' | 'walletPlaceholder' | 'warningCircle';
+export type IconType = 'add' | 'allWallets' | 'arrowBottomCircle' | 'appStore' | 'chromeStore' | 'apple' | 'arrowBottom' | 'arrowLeft' | 'arrowRight' | 'arrowTop' | 'bank' | 'browser' | 'card' | 'checkmark' | 'chevronBottom' | 'chevronLeft' | 'chevronRight' | 'chevronTop' | 'clock' | 'close' | 'coinPlaceholder' | 'compass' | 'copy' | 'cursor' | 'cursorTransparent' | 'desktop' | 'disconnect' | 'discord' | 'etherscan' | 'extension' | 'externalLink' | 'facebook' | 'filters' | 'github' | 'google' | 'helpCircle' | 'infoCircle' | 'mail' | 'mobile' | 'more' | 'networkPlaceholder' | 'nftPlaceholder' | 'off' | 'playStore' | 'plus' | 'qrCode' | 'recycleHorizontal' | 'refresh' | 'search' | 'send' | 'swapHorizontal' | 'swapHorizontalBold' | 'swapHorizontalMedium' | 'swapVertical' | 'telegram' | 'twitch' | 'twitterIcon' | 'verify' | 'verifyFilled' | 'wallet' | 'walletConnect' | 'walletPlaceholder' | 'warningCircle' | 'x';
 export type VisualType = 'browser' | 'coinbase' | 'dao' | 'defi' | 'defiAlt' | 'eth' | 'google' | 'layers' | 'lightbulb' | 'lock' | 'login' | 'network' | 'nft' | 'noun' | 'onrampCard' | 'profile' | 'system' | 'moonpay' | 'stripe' | 'paypal' | 'pencil';
 export type VisualSize = 'sm' | 'md' | 'lg';
-export type LogoType = 'apple' | 'discord' | 'facebook' | 'github' | 'google' | 'telegram' | 'twitch' | 'twitter';
+export type LogoType = 'apple' | 'discord' | 'facebook' | 'github' | 'google' | 'telegram' | 'twitch' | 'x' | 'more';
 export type PlacementType = 'bottom' | 'left' | 'right' | 'top';
@@ -26,0 +26,0 @@ export type ChipType = 'fill' | 'shade' | 'shadeSmall' | 'transparent' | 'success' | 'error';

dist/types/src/utils/UiHelperUtil.d.ts

@@ -14,2 +14,3 @@ import type { SpacingType, ThemeType, TruncateOptions } from './TypeUtil.js';
     roundNumber(number: number, threshold: number, fixed: number): number;
+    capitalizeFirstLetter(string: string): string;
 };

package.json

 {
   "name": "@web3modal/ui",
-  "version": "4.1.5",
+  "version": "4.1.6-canary-sl-001.0",
   "type": "module",
@@ -24,3 +24,3 @@ "main": "./dist/esm/index.js",
     "@types/qrcode": "1.5.5",
-    "@web3modal/common": "4.1.5",
+    "@web3modal/common": "4.1.6-canary-sl-001.0",
     "eslint-plugin-lit": "1.11.0",
@@ -27,0 +27,0 @@ "eslint-plugin-wc": "2.0.4"

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

642857

increased by1.53%

Number of package files

695

increased by2.21%

Lines of code

11477

increased by1.71%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

No dependency changes