diff --git a/packages/widget-embedded/src/App.tsx b/packages/widget-embedded/src/App.tsx
index edcbf097b..37858d6e2 100644
--- a/packages/widget-embedded/src/App.tsx
+++ b/packages/widget-embedded/src/App.tsx
@@ -5,7 +5,12 @@ import {
   switchChainAndAddToken,
 } from '@lifi/wallet-management';
 import type { WidgetConfig } from '@lifi/widget';
-import { LiFiWidget, LiFiWidgetDrawer } from '@lifi/widget';
+import {
+  LiFiWidget,
+  LiFiWidgetDrawer,
+  useWidgetEvents,
+  WidgetEvent,
+} from '@lifi/widget';
 import {
   Box,
   // Button,
@@ -97,6 +102,7 @@ const widgetConfig: WidgetConfig = {
 
 export const App = () => {
   const { connect, disconnect, account } = useWallet();
+  const widgetEvents = useWidgetEvents();
   const [searchParams] = useState(() =>
     Object.fromEntries(new URLSearchParams(window?.location.search)),
   );
@@ -233,6 +239,16 @@ export const App = () => {
     }
   }, [darkMode, prefersDarkMode, primary, secondary, systemColor]);
 
+  useEffect(() => {
+    const onSwapStarted = () => {
+      console.log('onSwapStarted fired.');
+    };
+    widgetEvents.on(WidgetEvent.SwapStarted, onSwapStarted);
+    return () => {
+      widgetEvents.removeListener(WidgetEvent.SwapStarted, onSwapStarted);
+    };
+  }, [widgetEvents]);
+
   return (
     <ThemeProvider theme={theme}>
       <Box sx={{ display: 'flex' }}>
diff --git a/packages/widget/src/hooks/index.ts b/packages/widget/src/hooks/index.ts
index a5ebf9056..b05c44276 100644
--- a/packages/widget/src/hooks/index.ts
+++ b/packages/widget/src/hooks/index.ts
@@ -17,3 +17,4 @@ export * from './useTokenBalances';
 export * from './useTokens';
 export * from './useTokenSearch';
 export * from './useTools';
+export * from './useWidgetEvents';
diff --git a/packages/widget/src/hooks/useWidgetEvents.ts b/packages/widget/src/hooks/useWidgetEvents.ts
new file mode 100644
index 000000000..753317fd8
--- /dev/null
+++ b/packages/widget/src/hooks/useWidgetEvents.ts
@@ -0,0 +1,8 @@
+import { EventEmitter } from 'events';
+import create from 'zustand';
+
+const emitterStore = create<EventEmitter>()(() => new EventEmitter());
+
+export const useWidgetEvents = () => {
+  return emitterStore();
+};
diff --git a/packages/widget/src/index.ts b/packages/widget/src/index.ts
index c78b1e930..114007920 100644
--- a/packages/widget/src/index.ts
+++ b/packages/widget/src/index.ts
@@ -3,6 +3,7 @@ import { AppDrawer } from './AppDrawer';
 import './fonts/inter.css';
 import { configureReactI18next } from './i18n';
 
+export { useWidgetEvents } from './hooks';
 export * from './types';
 
 configureReactI18next();
diff --git a/packages/widget/src/types/events.ts b/packages/widget/src/types/events.ts
new file mode 100644
index 000000000..4be8c2295
--- /dev/null
+++ b/packages/widget/src/types/events.ts
@@ -0,0 +1,3 @@
+export enum WidgetEvent {
+  SwapStarted = 'swapStarted',
+}
diff --git a/packages/widget/src/types/index.ts b/packages/widget/src/types/index.ts
index bc2209fde..a1f06a916 100644
--- a/packages/widget/src/types/index.ts
+++ b/packages/widget/src/types/index.ts
@@ -1,2 +1,3 @@
+export * from './events';
 export * from './token';
 export * from './widget';