diff --git a/packages/react/package.json b/packages/react/package.json
index 4f495b24..8bc3ee40 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -8,12 +8,14 @@
   "type": "module",
   "dependencies": {
     "@buildwithsygma/sygmaprotocol-widget": "workspace:*",
-    "@lit/react": "1.0.3"
-  },
-  "peerDependencies": {
+    "@lit/react": "1.0.3",
     "react": ">=17",
     "react-dom": ">=17"
   },
+  "devDependencies": {
+    "@types/react": ">=17",
+    "typescript": "5.2.2"
+  },
   "scripts": {
     "build": "tsc --build --clean && tsc --build ./tsconfig.json",
     "dev": "tsc --build --clean && tsc --build ./tsconfig.json --watch",
diff --git a/packages/react/src/WidgetReac.ts b/packages/react/src/WidgetReact.ts
similarity index 75%
rename from packages/react/src/WidgetReac.ts
rename to packages/react/src/WidgetReact.ts
index a11f001c..860dde2b 100644
--- a/packages/react/src/WidgetReac.ts
+++ b/packages/react/src/WidgetReact.ts
@@ -2,7 +2,7 @@ import React from 'react';
 import { createComponent } from '@lit/react';
 import { SygmaProtocolWidget } from '@buildwithsygma/sygmaprotocol-widget';
 
-export const SygmaProtocolReactWidget = createComponent({
+export const SygmaProtocolReactWidget = createComponent<SygmaProtocolWidget>({
   tagName: 'sygmaprotocol-widget',
   elementClass: SygmaProtocolWidget,
   react: React
diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts
index e69de29b..fbd39784 100644
--- a/packages/react/src/index.ts
+++ b/packages/react/src/index.ts
@@ -0,0 +1 @@
+export { SygmaProtocolReactWidget } from './WidgetReact';
diff --git a/packages/widget/src/interfaces/index.ts b/packages/widget/src/interfaces/index.ts
index f9cee292..30d73570 100644
--- a/packages/widget/src/interfaces/index.ts
+++ b/packages/widget/src/interfaces/index.ts
@@ -3,7 +3,6 @@ import type {
   Network,
   SubstrateResource
 } from '@buildwithsygma/sygma-sdk-core';
-import type { ethers } from 'ethers';
 import type { ApiPromise } from '@polkadot/api';
 import type { Signer } from '@polkadot/api/types';
 
@@ -16,10 +15,17 @@ export type ThemeVariables =
 
 export type Theme = Record<ThemeVariables, string>;
 
+export interface Eip1193Provider {
+  request(request: {
+    method: string;
+    params?: Array<unknown> | Record<string, unknown>;
+  }): Promise<unknown>;
+}
+
 export interface ISygmaProtocolWidget {
   whitelistedSourceNetworks?: Network[];
   whitelistedDestinationNetworks?: Network[];
-  evmProvider?: ethers.providers.Web3Provider;
+  evmProvider?: Eip1193Provider;
   substrateProvider?: ApiPromise | string;
   substrateSigner?: Signer;
   show?: boolean;
diff --git a/packages/widget/src/widget.ts b/packages/widget/src/widget.ts
index be57cc16..45977035 100644
--- a/packages/widget/src/widget.ts
+++ b/packages/widget/src/widget.ts
@@ -1,6 +1,13 @@
 import type { HTMLTemplateResult } from 'lit';
 import { LitElement, html } from 'lit';
-import { customElement } from 'lit/decorators.js';
+import { customElement, property } from 'lit/decorators.js';
+import type {
+  EvmResource,
+  Network,
+  SubstrateResource
+} from '@buildwithsygma/sygma-sdk-core';
+import type { ApiPromise } from '@polkadot/api';
+import type { Signer } from '@polkadot/api/types';
 import { styles } from './styles';
 import { switchNetworkIcon, sygmaLogo } from './assets';
 import { WidgetController } from './controllers/widget';
@@ -8,11 +15,40 @@ import './components/network-selector';
 import './components/amount-selector';
 import './components/address-input';
 import { Directions } from './components/network-selector/network-selector';
+import type {
+  Eip1193Provider,
+  ISygmaProtocolWidget,
+  Theme
+} from './interfaces';
 
 @customElement('sygmaprotocol-widget')
-class SygmaProtocolWidget extends LitElement {
+class SygmaProtocolWidget extends LitElement implements ISygmaProtocolWidget {
   static styles = styles;
 
+  @property({ type: Array }) whitelistedSourceNetworks?: Network[];
+
+  @property({ type: Array }) whitelistedDestinationNetworks?: Network[];
+
+  @property({ type: Object }) evmProvider?: Eip1193Provider;
+
+  @property() substrateProvider?: ApiPromise | string;
+
+  @property({ type: Object }) substrateSigner?: Signer;
+
+  @property({ type: Boolean }) show?: boolean;
+
+  @property({ type: Array }) whitelistedSourceResources?: Array<
+    EvmResource | SubstrateResource
+  >;
+
+  @property({ type: Boolean }) expandable?: boolean;
+
+  @property({ type: Boolean }) darkTheme?: boolean;
+
+  @property({ type: Object }) customLogo?: SVGElement;
+
+  @property({ type: Object }) theme?: Theme;
+
   private widgetController = new WidgetController(this, {});
 
   render(): HTMLTemplateResult {
@@ -81,6 +117,6 @@ export { SygmaProtocolWidget };
 
 declare global {
   interface HTMLElementTagNameMap {
-    'sygmaprotocol-widget': SygmaProtocolWidget;
+    'sygmaprotocol-widget': ISygmaProtocolWidget;
   }
 }