Use public SDK version

* Use the SDK version published in the NPM registry instead of the one
that lives in this repo (it'll be easier to switch)
* Fix compilation errors in the example app

Author: jverce

packages/connect-react/examples/nextjs/package.json

@@ -7,7 +7,7 @@
   },
   "dependencies": {
     "@pipedream/connect-react": "file:../..",
-    "@pipedream/sdk": "^1.3.3",
+    "@pipedream/sdk": "^1.8.0",
     "next": "15.0.3",
     "react": "19.0.0-rc-66855b96-20241106",
     "react-dom": "19.0.0-rc-66855b96-20241106"

packages/connect-react/examples/nextjs/src/app/page.tsx

@@ -1,10 +1,14 @@
 "use client";
 
-import { useState } from "react";
-import { createFrontendClient } from "@pipedream/sdk/browser";
 import {
   ComponentFormContainer, FrontendClientProvider,
 } from "@pipedream/connect-react";
+import {
+  createFrontendClient,
+  type ConfigurableProp,
+  type ConfiguredProps,
+} from "@pipedream/sdk/browser";
+import { useState } from "react";
 import { fetchToken } from "./actions";
 
 export default function Home() {
@@ -16,7 +20,7 @@ export default function Home() {
   const [
     configuredProps,
     setConfiguredProps,
-  ] = useState({
+  ] = useState<ConfiguredProps<ConfigurableProp[]>>({
     text: "hello slack!",
   });
 
@@ -28,7 +32,7 @@ export default function Home() {
   const [
     sdkResponse,
     setSdkResponse,
-  ] = useState<unknown | undefined>(undefined);
+  ] = useState<ConfiguredProps<ConfigurableProp[]> | undefined>(undefined);
 
   const handleDynamicProps = (dynamicProps: { id: string | undefined }) => {
     setDynamicPropsId(dynamicProps.id)

packages/connect-react/package.json

@@ -28,7 +28,7 @@
   "author": "Pipedream Engineering",
   "license": "MIT",
   "dependencies": {
-    "@pipedream/sdk": "workspace:^",
+    "@pipedream/sdk": "^1.8.0",
     "@tanstack/react-query": "^5.59.16",
     "lodash.isequal": "^4.5.0",
     "react-markdown": "^9.0.1",