@shipengine/react-api 1.10.1 → 1.10.2

package/README.md

@@ -0,0 +1,36 @@
+# ShipEngine React Api
+
+The `shipengine/react-api` library provides React bindings for the [shipengine/js-api](https://www.npmjs.com/package/@shipengine/js-api) client, with the addition of data sharing and cache management via [React Query](https://tanstack.com/query/latest) (hereon "RQ").
+
+The client interface is exposed via hooks[^1] sharing a single RQ client instance; this allows multiple components to access data from the same ShipEngine API endpoint with a single network request.
+
+For instance, if `ComponentA`, `ComponentB` and `ComponentC` separately invoke the `useListShipments` hook on a single render, the API requests will be deduped to a single `GET /v1/shipments`, with all three components sharing the data / loading / error / etc states from the RQ cache. Revalidating the request in one component similarly updates the others.
+
+## Basic usage
+
+```tsx
+import { ShipEngine, useListShipments } from "@shipengine/react-api";
+
+const MyComponent = () => {
+  const { data, isLoading, error } = useListShipments();
+
+  if (isLoading) return <div>Loading...</div>;
+  if (error) return <div>{error.message}</div>;
+
+  console.log(data);
+  // > an object matching the response schema of https://shipengine.github.io/shipengine-openapi/#operation/list_shipments
+
+  return <div>Retrieved {data.shipments.length} shipments</div>;
+};
+
+const MyApp = () => {
+  return (
+    <ShipEngine getToken={() => "your-platform-token"}>
+      <MyComponent />
+      <MyComponent />
+      <MyComponent />
+      {/* All three components will share the same data and only 1 request will be made */}
+    </ShipEngine>
+  );
+};
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shipengine/react-api",
-  "version": "1.10.1",
+  "version": "1.10.2",
   "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {