refactor: elaborate @saucer-dev/types usage

Author: Curve

src/content/docs/getting-started/index.mdx

@@ -106,3 +106,8 @@ The [GitHub Workflows](https://github.com/saucer/saucer/actions/workflows/build.
 
 For those who plan on using saucer for serving their own frontend, we recommend to install the `@saucer-dev/types` package,
 which provides typed abstractions over all saucer functions.
+
+:::caution
+When using the typescript package, you should not access saucer functions through `saucer.something` and instead import them from the package.  
+E.g. instead of using `saucer.call`, import `call` from `import { call } from "@saucer-dev/types";`
+:::

src/content/docs/webview/interop.mdx

@@ -28,6 +28,16 @@ In the example shown above, the function would be callable from JavaScript as fo
 const result = await saucer.exposed.multiply(5, 10);
 ```
 
+:::caution
+When using the typescript package, define the `multiply` function like this instead:
+
+```ts
+import { exposed } from "@saucer-dev/types";
+const multiply = exposed<number, [number, number]>("multiply");
+```
+
+:::
+
 Function Parameters are automatically type-checked:
 
 ```js title="Example: Automatic Type-Checking" frame="terminal" showLineNumbers=false del="[Error]"