refactor: use named export and function

tien · Jul 23, 2024 · c0ff28a · c0ff28a
1 parent e97c95b
commit c0ff28a
Show file tree

Hide file tree

Showing 16 changed files with 47 additions and 57 deletions.
diff --git a/packages/dot-connect/src/elements/components/dc-circular-progress-indicator.ts b/packages/dot-connect/src/elements/components/dc-circular-progress-indicator.ts
@@ -1,9 +1,9 @@
-import DotConnectElement from "./dc-element.js";
+import { DotConnectElement } from "./dc-element.js";
 import { css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 
 @customElement("dc-circular-progress-indicator")
-export default class CircularProgressIndicator extends DotConnectElement {
+export class CircularProgressIndicator extends DotConnectElement {
   static override readonly styles = [
     super.styles,
     css`

diff --git a/packages/dot-connect/src/elements/components/dc-dialog.ts b/packages/dot-connect/src/elements/components/dc-dialog.ts
@@ -1,12 +1,12 @@
 import { close as closeIcon } from "../../icons/index.js";
-import DotConnectElement from "./dc-element.js";
+import { DotConnectElement } from "./dc-element.js";
 import { effect, signal } from "@lit-labs/preact-signals";
 import { css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { ref } from "lit/directives/ref.js";
 
 @customElement("dc-dialog")
-export default class Dialog extends DotConnectElement {
+export class Dialog extends DotConnectElement {
   static override get styles() {
     return [
       super.styles,

diff --git a/packages/dot-connect/src/elements/components/dc-element.ts b/packages/dot-connect/src/elements/components/dc-element.ts
@@ -1,9 +1,7 @@
 import { SignalWatcher } from "@lit-labs/preact-signals";
 import { LitElement, css, type CSSResultGroup } from "lit";
 
-export default abstract class DotConnectElement extends SignalWatcher(
-  LitElement,
-) {
+export abstract class DotConnectElement extends SignalWatcher(LitElement) {
   static override readonly styles: CSSResultGroup = css`
     * {
       --headline-font-family: var(--dc-headline-font-family, Unbounded);

diff --git a/packages/dot-connect/src/elements/components/dc-list-item.ts b/packages/dot-connect/src/elements/components/dc-list-item.ts
@@ -1,12 +1,12 @@
 import "./dc-circular-progress-indicator.js";
-import DotConnectElement from "./dc-element.js";
+import { DotConnectElement } from "./dc-element.js";
 import { css, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import { styleMap } from "lit/directives/style-map.js";
 
 @customElement("dc-list-item")
-export default class ListItem extends DotConnectElement {
+export class ListItem extends DotConnectElement {
   static override readonly styles = [
     super.styles,
     css`

diff --git a/packages/dot-connect/src/elements/components/dc-qr-code.ts b/packages/dot-connect/src/elements/components/dc-qr-code.ts
@@ -1,5 +1,5 @@
 import { wallet as walletIcon } from "../../icons/index.js";
-import DotConnectElement from "./dc-element.js";
+import { DotConnectElement } from "./dc-element.js";
 import { TemplateResult, css, html, svg } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { styleMap } from "lit/directives/style-map.js";
@@ -10,7 +10,7 @@ import {
 } from "qrcode";
 
 @customElement("dc-qr-code")
-export default class QrCode extends DotConnectElement {
+export class QrCode extends DotConnectElement {
   @property()
   ecl: QRCodeErrorCorrectionLevel = "M";
 

diff --git a/packages/dot-connect/src/elements/dc-connection-button.ts b/packages/dot-connect/src/elements/dc-connection-button.ts
@@ -1,18 +1,18 @@
 import {
-  wallets as walletsIcon,
-  wallet as walletIcon,
   users as usersIcon,
+  wallet as walletIcon,
+  wallets as walletsIcon,
 } from "../icons/index.js";
 import { observableSignal } from "../observable-signal.js";
 import { accounts$, connectedWallets$ } from "../stores.js";
-import DotConnectElement from "./components/dc-element.js";
+import { DotConnectElement } from "./components/dc-element.js";
 import "./dc-connection-dialog.js";
 import { signal } from "@lit-labs/preact-signals";
 import { css, html } from "lit";
 import { customElement } from "lit/decorators.js";
 
 @customElement("dc-connection-button")
-export default class ConnectionButton extends DotConnectElement {
+export class ConnectionButton extends DotConnectElement {
   static override styles = [
     super.styles,
     css`

diff --git a/packages/dot-connect/src/elements/dc-connection-dialog.ts b/packages/dot-connect/src/elements/dc-connection-dialog.ts
@@ -11,7 +11,7 @@ import { SupportedWallet } from "../types.js";
 import { getDownloadUrl } from "../utils.js";
 import { InjectedWalletInfo, WalletConfig } from "../wallets/types.js";
 import "./components/dc-dialog.js";
-import DotConnectElement from "./components/dc-element.js";
+import { DotConnectElement } from "./components/dc-element.js";
 import "./components/dc-list-item.js";
 import "./components/dc-qr-code.js";
 import { computed, effect, signal } from "@lit-labs/preact-signals";
@@ -257,7 +257,7 @@ export class DownloadableWallet extends DotConnectElement {
 }
 
 @customElement("dc-connection-dialog")
-export default class ConnectionDialog extends DotConnectElement {
+export class ConnectionDialog extends DotConnectElement {
   static override get styles() {
     return [
       super.styles,

diff --git a/packages/dot-connect/src/icons/close.ts b/packages/dot-connect/src/icons/close.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const close = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function close({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 29 29"
@@ -26,5 +26,4 @@ const close = ({ size = 24 }: IconProps) =>
       ></path>
     </g>
   </svg>`;
-
-export default close;
+}
diff --git a/packages/dot-connect/src/icons/connected.ts b/packages/dot-connect/src/icons/connected.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const connected = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function connected({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 29 29"
@@ -31,5 +31,4 @@ const connected = ({ size = 24 }: IconProps) =>
       ></path>
     </g>
   </svg>`;
-
-export default connected;
+}
diff --git a/packages/dot-connect/src/icons/disconnected.ts b/packages/dot-connect/src/icons/disconnected.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const disconnected = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function disconnected({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 28 28"
@@ -32,5 +32,4 @@ const disconnected = ({ size = 24 }: IconProps) =>
       <path d="M2.99982 2L24.9998 26" fill="none" data-nofill="true"></path>
     </g>
   </svg>`;
-
-export default disconnected;
+}
diff --git a/packages/dot-connect/src/icons/download.ts b/packages/dot-connect/src/icons/download.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const download = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function download({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 28 28"
@@ -20,5 +20,4 @@ const download = ({ size = 24 }: IconProps) =>
       data-nofill="true"
     ></path>
   </svg>`;
-
-export default download;
+}
diff --git a/packages/dot-connect/src/icons/index.ts b/packages/dot-connect/src/icons/index.ts
@@ -1,8 +1,8 @@
-export { default as close } from "./close.js";
-export { default as connected } from "./connected.js";
-export { default as disconnected } from "./disconnected.js";
-export { default as download } from "./download.js";
-export { default as qrCode } from "./qr-code.js";
-export { default as users } from "./users.js";
-export { default as wallet } from "./wallet.js";
-export { default as wallets } from "./wallets.js";
+export { close } from "./close.js";
+export { connected } from "./connected.js";
+export { disconnected } from "./disconnected.js";
+export { download } from "./download.js";
+export { qrCode } from "./qr-code.js";
+export { users } from "./users.js";
+export { wallet } from "./wallet.js";
+export { wallets } from "./wallets.js";
diff --git a/packages/dot-connect/src/icons/qr-code.ts b/packages/dot-connect/src/icons/qr-code.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const qrCode = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function qrCode({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 28 29"
@@ -34,5 +34,4 @@ const qrCode = ({ size = 24 }: IconProps) =>
     <path d="M22.0002 16.375H16.0002V22.375H22.0002V16.375Z"></path>
     <path d="M12.0001 16.375H6.00012V22.375H12.0001V16.375Z"></path>
   </svg>`;
-
-export default qrCode;
+}
diff --git a/packages/dot-connect/src/icons/users.ts b/packages/dot-connect/src/icons/users.ts
@@ -1,8 +1,8 @@
 import { IconProps } from "./types.js";
 import { html } from "lit";
 
-const users = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function users({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 28 28"
@@ -19,5 +19,4 @@ const users = ({ size = 24 }: IconProps) =>
       ></path>
     </g>
   </svg>`;
-
-export default users;
+}
diff --git a/packages/dot-connect/src/icons/wallet.ts b/packages/dot-connect/src/icons/wallet.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const wallet = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function wallet({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 28 28"
@@ -21,5 +21,4 @@ const wallet = ({ size = 24 }: IconProps) =>
       <circle cx="18" cy="14" r="1"></circle>
     </g>
   </svg>`;
-
-export default wallet;
+}
diff --git a/packages/dot-connect/src/icons/wallets.ts b/packages/dot-connect/src/icons/wallets.ts
@@ -1,8 +1,8 @@
 import type { IconProps } from "./types.js";
 import { html } from "lit";
 
-const wallets = ({ size = 24 }: IconProps) =>
-  html`<svg
+export function wallets({ size = 24 }: IconProps) {
+  return html`<svg
     width=${size}
     height=${size}
     viewBox="0 0 28 28"
@@ -22,5 +22,4 @@ const wallets = ({ size = 24 }: IconProps) =>
       <path d="M15.0181 16.0181L15 16" stroke-miterlimit="10"></path>
     </g>
   </svg>`;
-
-export default wallets;
+}