diff --git a/.yarn/cache/june-so-client-react-npm-0.0.1-94c8fd6a71-af9ed338e6.zip b/.yarn/cache/june-so-client-react-npm-0.0.1-94c8fd6a71-af9ed338e6.zip
new file mode 100644
index 0000000..d8acbe3
Binary files /dev/null and b/.yarn/cache/june-so-client-react-npm-0.0.1-94c8fd6a71-af9ed338e6.zip differ
diff --git a/.yarn/cache/june-so-client-types-npm-0.0.1-554faf9c0f-d6ff8e5bfc.zip b/.yarn/cache/june-so-client-types-npm-0.0.1-554faf9c0f-d6ff8e5bfc.zip
new file mode 100644
index 0000000..ad0e122
Binary files /dev/null and b/.yarn/cache/june-so-client-types-npm-0.0.1-554faf9c0f-d6ff8e5bfc.zip differ
diff --git a/figma-plugin/package.json b/figma-plugin/package.json
index af94c02..c36aabc 100644
--- a/figma-plugin/package.json
+++ b/figma-plugin/package.json
@@ -22,6 +22,7 @@
     "@vitejs/plugin-react-refresh": "^1.3.6",
     "axios": "^1.6.0",
     "framer-motion": "^10.12.11",
+    "june-so-client-react": "^0.0.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "ts-dedent": "^2.2.0",
diff --git a/figma-plugin/ui-src/contexts/JuneContext.tsx b/figma-plugin/ui-src/contexts/JuneContext.tsx
deleted file mode 100644
index b9ca69e..0000000
--- a/figma-plugin/ui-src/contexts/JuneContext.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import React from "react";
-
-interface JuneContextType {
-  identify: (props: IdentifyProps) => Promise<void>;
-  track: (props: TrackProps) => Promise<void>;
-}
-
-interface JuneProviderProps {
-  writeKey: string;
-  children: React.ReactNode;
-
-  disabled?: boolean;
-}
-
-interface TrackProps {
-  event: string;
-  timestamp?: Date;
-  userId?: string;
-  anonymousId?: string;
-  properties?: Record<string, unknown>;
-  context?: Record<string, unknown>;
-}
-
-interface IdentifyProps {
-  userId?: string;
-  anonymousId?: string;
-  traits?: Record<string, unknown>;
-  timestamp?: Date;
-  context?: Record<string, unknown>;
-}
-
-const BASE_URL = "https://api.june.so/sdk";
-
-const JuneContext = React.createContext<JuneContextType>({
-  identify: async () => {},
-  track: async () => {},
-});
-
-export const JuneProvider: React.FC<JuneProviderProps> = ({
-  children,
-  writeKey,
-  disabled = false,
-}) => {
-  if (!writeKey) {
-    throw new Error("[useJune] writeKey is required");
-  }
-
-  const headers = {
-    Authorization: `Basic ${writeKey}`,
-    "Content-Type": "application/json",
-  };
-
-  const track = async (props: TrackProps) => {
-    if (disabled) return;
-
-    try {
-      await fetch(`${BASE_URL}/track`, {
-        method: "POST",
-        headers,
-        body: JSON.stringify({
-          ...props,
-        }),
-      });
-    } catch (error) {
-      console.error(error);
-    }
-  };
-
-  const identify = async (props: IdentifyProps) => {
-    if (!props.userId || disabled) return;
-
-    try {
-      await fetch(`${BASE_URL}/identify`, {
-        method: "POST",
-        headers,
-        body: JSON.stringify({
-          ...props,
-        }),
-      });
-    } catch (error) {
-      console.error(error);
-    }
-  };
-
-  return (
-    <JuneContext.Provider value={{ identify, track }}>
-      {children}
-    </JuneContext.Provider>
-  );
-};
-
-export const useJune = () => {
-  const context = React.useContext(JuneContext);
-  if (!context) {
-    throw new Error("[useJune] must be used within a JuneProvider");
-  }
-  return context;
-};
diff --git a/figma-plugin/ui-src/main.tsx b/figma-plugin/ui-src/main.tsx
index 484c306..792d1cf 100644
--- a/figma-plugin/ui-src/main.tsx
+++ b/figma-plugin/ui-src/main.tsx
@@ -2,11 +2,11 @@
 import "./styles/global.css";
 
 import { ChakraProvider } from "@chakra-ui/react";
+import { JuneProvider } from "june-so-client-react";
 import * as React from "react";
 import { createRoot } from "react-dom/client";
 
 import { AppProvider } from "./contexts/AppContext";
-import { JuneProvider } from "./contexts/JuneContext";
 import App from "./pages/App";
 
 const root = createRoot(document.getElementById("root")!);
diff --git a/figma-plugin/ui-src/pages/App.tsx b/figma-plugin/ui-src/pages/App.tsx
index 030cc2c..919ec01 100644
--- a/figma-plugin/ui-src/pages/App.tsx
+++ b/figma-plugin/ui-src/pages/App.tsx
@@ -1,8 +1,8 @@
 import { Box, Tab, TabList, TabPanel, TabPanels, Tabs } from "@chakra-ui/react";
+import { useJune } from "june-so-client-react";
 import * as React from "react";
 
 import { useAppState } from "../contexts/AppContext";
-import { useJune } from "../contexts/JuneContext";
 import * as styles from "./App.css";
 import Deploy from "./Deploy";
 import Setting from "./Setting";
diff --git a/figma-plugin/ui-src/pages/Deploy.tsx b/figma-plugin/ui-src/pages/Deploy.tsx
index 4740239..288ca31 100644
--- a/figma-plugin/ui-src/pages/Deploy.tsx
+++ b/figma-plugin/ui-src/pages/Deploy.tsx
@@ -1,9 +1,9 @@
 import { Box, Button, Spinner, Text, Tooltip } from "@chakra-ui/react";
+import { useJune } from "june-so-client-react";
 import * as React from "react";
 
 import { ACTION, DATA, STATUS } from "../../common/constants";
 import { useAppDispatch, useAppState } from "../contexts/AppContext";
-import { useJune } from "../contexts/JuneContext";
 import * as styles from "./Deploy.css";
 
 const Deploy = () => {
diff --git a/yarn.lock b/yarn.lock
index be46f4f..16a02b9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3622,6 +3622,7 @@ __metadata:
     axios: ^1.6.0
     esbuild: ^0.17.19
     framer-motion: ^10.12.11
+    june-so-client-react: ^0.0.1
     react: ^18.2.0
     react-dom: ^18.2.0
     ts-dedent: ^2.2.0
@@ -7952,6 +7953,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"june-so-client-react@npm:^0.0.1":
+  version: 0.0.1
+  resolution: "june-so-client-react@npm:0.0.1"
+  dependencies:
+    june-so-client-types: ^0.0.1
+  peerDependencies:
+    react: ^17.0.0 || ^18.0.0
+  checksum: af9ed338e65b450f9e15842cb7fe30f5e2783ddf099421b05fd4ce641bfccc14949f96c51ccc336a446e0a094ef2da61da5f3939c5896b251f8c0d44fcef7c8a
+  languageName: node
+  linkType: hard
+
+"june-so-client-types@npm:^0.0.1":
+  version: 0.0.1
+  resolution: "june-so-client-types@npm:0.0.1"
+  checksum: d6ff8e5bfc4abeefa4b35fb15bb4ffa1819d072bebbaadc50a4851203ac954647ef2310924a3939d446d4e8e7c9781ad91a690ed65594925fcee01ea8b9fcd17
+  languageName: node
+  linkType: hard
+
 "kind-of@npm:^6.0.3":
   version: 6.0.3
   resolution: "kind-of@npm:6.0.3"