refactor: remove core dependency from common and ui packages (#…

…2430)
WalletConnect · Jun 17, 2024 · 863fdbe · 863fdbe
1 parent 0db5605
commit 863fdbe
Show file tree

Hide file tree

Showing 13 changed files with 152 additions and 190 deletions.
diff --git a/apps/gallery/stories/composites/wui-onramp-activity-item.stories.ts b/apps/gallery/stories/composites/wui-onramp-activity-item.stories.ts
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/common/src/utils/NetworkUtil.ts b/packages/common/src/utils/NetworkUtil.ts
@@ -1,4 +1,4 @@
-import type { CaipNetworkId } from '@web3modal/core'
+import type { CaipNetworkId } from './TypeUtil.js'
 
 export const NetworkUtil = {
   caipNetworkIdToNumber(caipnetworkId?: CaipNetworkId) {

diff --git a/packages/common/src/utils/TypeUtil.ts b/packages/common/src/utils/TypeUtil.ts
@@ -1,3 +1,5 @@
+export type CaipNetworkId = `${string}:${string}`
+
 export type CoinbaseTransactionStatus =
   | 'ONRAMP_TRANSACTION_STATUS_SUCCESS'
   | 'ONRAMP_TRANSACTION_STATUS_IN_PROGRESS'

diff --git a/packages/scaffold/index.ts b/packages/scaffold/index.ts
@@ -67,6 +67,9 @@ export * from './src/partials/w3m-help-widget/index.js'
 export * from './src/partials/w3m-onramp-input/index.js'
 export * from './src/partials/w3m-legal-footer/index.js'
 export * from './src/partials/w3m-mobile-download-links/index.js'
+export * from './src/partials/w3m-onramp-activity-item/index.js'
+export * from './src/partials/w3m-onramp-providers-footer/index.js'
+export * from './src/partials/w3m-onramp-provider-item/index.js'
 export * from './src/partials/w3m-onramp-providers-footer/index.js'
 export * from './src/partials/w3m-snackbar/index.js'
 export * from './src/partials/w3m-email-login-widget/index.js'

diff --git a/...posites/wui-onramp-activity-item/index.ts → ...artials/w3m-onramp-activity-item/index.ts b/...posites/wui-onramp-activity-item/index.ts → ...artials/w3m-onramp-activity-item/index.ts
@@ -1,16 +1,13 @@
 import { html, LitElement } from 'lit'
 import { property } from 'lit/decorators.js'
-import '../../components/wui-icon/index.js'
-import '../../components/wui-text/index.js'
-import { elementStyles, resetStyles } from '../../utils/ThemeUtil.js'
-import type { ColorType } from '../../utils/TypeUtil.js'
-import { customElement } from '../../utils/WebComponentsUtil.js'
-import styles from './styles.js'
+import { customElement } from '@web3modal/ui'
+import type { ColorType } from '@web3modal/ui/src/utils/TypeUtil.js'
 import { ApiController } from '@web3modal/core'
+import styles from './styles.js'
 
-@customElement('wui-onramp-activity-item')
-export class WuiOnRampActivityItem extends LitElement {
-  public static override styles = [resetStyles, elementStyles, styles]
+@customElement('w3m-onramp-activity-item')
+export class W3mOnRampActivityItem extends LitElement {
+  public static override styles = [styles]
 
   // -- State & Properties -------------------------------- //
   @property({ type: Boolean }) public disabled = false
@@ -110,6 +107,6 @@ export class WuiOnRampActivityItem extends LitElement {
 
 declare global {
   interface HTMLElementTagNameMap {
-    'wui-onramp-activity-item': WuiOnRampActivityItem
+    'w3m-onramp-activity-item': W3mOnRampActivityItem
   }
 }
diff --git a/...osites/wui-onramp-activity-item/styles.ts → ...rtials/w3m-onramp-activity-item/styles.ts b/...osites/wui-onramp-activity-item/styles.ts → ...rtials/w3m-onramp-activity-item/styles.ts
diff --git a/...posites/wui-onramp-provider-item/index.ts → ...artials/w3m-onramp-provider-item/index.ts b/...posites/wui-onramp-provider-item/index.ts → ...artials/w3m-onramp-provider-item/index.ts
@@ -1,17 +1,14 @@
 import { html, LitElement } from 'lit'
 import { property } from 'lit/decorators.js'
+import { ifDefined } from 'lit/directives/if-defined.js'
+import { customElement } from '@web3modal/ui'
+import type { ColorType } from '@web3modal/ui/src/utils/TypeUtil.js'
 import { AssetUtil, NetworkController, type OnRampProvider } from '@web3modal/core'
-import '../../components/wui-icon/index.js'
-import '../../components/wui-text/index.js'
-import { elementStyles, resetStyles } from '../../utils/ThemeUtil.js'
-import type { ColorType } from '../../utils/TypeUtil.js'
-import { customElement } from '../../utils/WebComponentsUtil.js'
 import styles from './styles.js'
-import { ifDefined } from 'lit/directives/if-defined.js'
 
-@customElement('wui-onramp-provider-item')
-export class WuiOnRampProviderItem extends LitElement {
-  public static override styles = [resetStyles, elementStyles, styles]
+@customElement('w3m-onramp-provider-item')
+export class W3mOnRampProviderItem extends LitElement {
+  public static override styles = [styles]
 
   // -- State & Properties -------------------------------- //
   @property({ type: Boolean }) public disabled = false
@@ -75,6 +72,6 @@ export class WuiOnRampProviderItem extends LitElement {
 
 declare global {
   interface HTMLElementTagNameMap {
-    'wui-onramp-provider-item': WuiOnRampProviderItem
+    'w3m-onramp-provider-item': W3mOnRampProviderItem
   }
 }
diff --git a/...osites/wui-onramp-provider-item/styles.ts → ...rtials/w3m-onramp-provider-item/styles.ts b/...osites/wui-onramp-provider-item/styles.ts → ...rtials/w3m-onramp-provider-item/styles.ts
diff --git a/packages/scaffold/src/views/w3m-onramp-activity-view/index.ts b/packages/scaffold/src/views/w3m-onramp-activity-view/index.ts
@@ -76,7 +76,7 @@ export class W3mOnRampActivityView extends LitElement {
       const icon = fungibleInfo?.icon?.url || this.tokenImages?.[fungibleInfo.symbol || '']
 
       return html`
-        <wui-onramp-activity-item
+        <w3m-onramp-activity-item
           label="Bought"
           .completed=${transaction.metadata.status === 'ONRAMP_TRANSACTION_STATUS_SUCCESS'}
           .inProgress=${transaction.metadata.status === 'ONRAMP_TRANSACTION_STATUS_IN_PROGRESS'}
@@ -86,7 +86,7 @@ export class W3mOnRampActivityView extends LitElement {
           date=${date}
           icon=${ifDefined(icon)}
           symbol=${ifDefined(fungibleInfo.symbol)}
-        ></wui-onramp-activity-item>
+        ></w3m-onramp-activity-item>
       `
     })
   }

diff --git a/packages/scaffold/src/views/w3m-onramp-providers-view/index.ts b/packages/scaffold/src/views/w3m-onramp-providers-view/index.ts
@@ -63,15 +63,15 @@ export class W3mOnRampProvidersView extends LitElement {
   private onRampProvidersTemplate() {
     return this.providers.map(
       provider => html`
-        <wui-onramp-provider-item
+        <w3m-onramp-provider-item
           label=${provider.label}
           name=${provider.name}
           feeRange=${provider.feeRange}
           @click=${() => {
             this.onClickProvider(provider)
           }}
           ?disabled=${!provider.url}
-        ></wui-onramp-provider-item>
+        ></w3m-onramp-provider-item>
       `
     )
   }

diff --git a/packages/ui/index.ts b/packages/ui/index.ts
@@ -56,8 +56,6 @@ export * from './src/composites/wui-list-accordion/index.js'
 export * from './src/composites/wui-list-content/index.js'
 export * from './src/composites/wui-list-network/index.js'
 export * from './src/composites/wui-list-wallet-transaction/index.js'
-export * from './src/composites/wui-onramp-activity-item/index.js'
-export * from './src/composites/wui-onramp-provider-item/index.js'
 export * from './src/composites/wui-promo/index.js'
 export * from './src/composites/wui-balance/index.js'
 export * from './src/composites/wui-profile-button/index.js'

diff --git a/packages/ui/src/utils/JSXTypeUtil.ts b/packages/ui/src/utils/JSXTypeUtil.ts
@@ -47,8 +47,6 @@ import type { WuiLogoSelect } from '../composites/wui-logo-select/index.js'
 import type { WuiNetworkButton } from '../composites/wui-network-button/index.js'
 import type { WuiNetworkImage } from '../composites/wui-network-image/index.js'
 import type { WuiNoticeCard } from '../composites/wui-notice-card/index.js'
-import type { WuiOnRampActivityItem } from '../composites/wui-onramp-activity-item/index.js'
-import type { WuiOnRampProviderItem } from '../composites/wui-onramp-provider-item/index.js'
 import type { WuiOtp } from '../composites/wui-otp/index.js'
 import type { WuiPreviewItem } from '../composites/wui-preview-item/index.js'
 import type { WuiProfileButton } from '../composites/wui-profile-button/index.js'
@@ -128,8 +126,6 @@ declare global {
       'wui-network-button': CustomElement<WuiNetworkButton>
       'wui-network-image': CustomElement<WuiNetworkImage>
       'wui-notice-card': CustomElement<WuiNoticeCard>
-      'wui-onramp-activity-item': CustomElement<WuiOnRampActivityItem>
-      'wui-onramp-provider-item': CustomElement<WuiOnRampProviderItem>
       'wui-otp': CustomElement<WuiOtp>
       'wui-preview-item': CustomElement<WuiPreviewItem>
       'wui-profile-button': CustomElement<WuiProfileButton>