next-suspend 1.0.0 → 1.0.1

package/README.md

@@ -1,5 +1,8 @@
 # next-suspend
 
+The `suspend` utility runs your data resolver function through `React.cache` using your Next.js page `params` as the cache keys.
+It returns an enhanced `<Suspense>` component, which awaits the `params` and renders the resolved value through a children prop.
+
 ```
 npm i next-suspend
 ```
@@ -11,21 +14,22 @@ import { suspend } from "next-suspend";
 
 // 1. Setup your data resolver
 export const SuspendedProduct = suspend(
-  async ({ productId }: { productId: string}) => {
+  async ({ productId }: { productId: string }) => {
     const product = await db.select.productById({ productId });
     if (!product) {
-        notFound();
+      notFound();
     }
     return product;
   },
 );
 
-
 // 2. Pass the params & render values suspensfully
-export default async function Page({ params }: PageProps<"/inventory/[productId]">) {
+export default async function Page({
+  params,
+}: PageProps<"/inventory/[productId]">) {
   return (
-    <div className="mb-8 w-full">
-      <Property icon={<TbGardenCart className="-mt-1 mr-1 size-6" />}>
+    <div>
+      <Property icon={<TbGardenCart />}>
         <PropertyTitle>Product</PropertyTitle>
         <PropertyValue>
           <SuspendedProduct params={params} fallback={<SkeletonLine />}>
@@ -33,7 +37,7 @@ export default async function Page({ params }: PageProps<"/inventory/[productId]
           </SuspendedProduct>
         </PropertyValue>
       </Property>
-      <Property icon={<TbGardenCart className="-mt-1 mr-1 size-6" />}>
+      <Property icon={<TbGardenCart />}>
         <PropertyTitle>Description</PropertyTitle>
         <PropertyValue>
           <SuspendedProduct params={params} fallback={<SkeletonLine />}>
@@ -41,11 +45,12 @@ export default async function Page({ params }: PageProps<"/inventory/[productId]
           </SuspendedProduct>
         </PropertyValue>
       </Property>
-  )
+    </div>
+  );
 }
 ```
 
-Your resolver will run once per params.
+Your resolver will run once per params. The page can now the titles (Product & Description) into a static shell.
 
 ## Helper types
 

package/dist/index.d.mts

@@ -1,7 +1,16 @@
-import { ReactNode, SuspenseProps } from "react";
+import { ReactNode } from "react";
 //#region src/suspend.d.ts
-export declare function suspend<Params extends Record<string, string>, Result>(resolve: (params: Params) => Promise<Result>): ({ params, children, ...props }: Omit<SuspenseProps, "children"> & {
+/**
+ * A rendering utility.
+ * @param resolve The function to cache by the page params promise.
+ * @returns A component to render the cached result suspense-fully.
+ */
+export declare function suspend<Params extends Record<string, string>, Result>(resolve: (params: Params) => Promise<Result>): ({ params, children, ...props }: {
+  fallback?: ReactNode;
+  name?: string | undefined;
   params: Promise<Params>;
-  children: (props: Result) => ReactNode;
+  children: (data: Result) => ReactNode;
 }) => Promise<import("react").JSX.Element>;
+export type Prettify<T> = Identity<{ [K in keyof T]: T[K]; }>;
+type Identity<T> = T;
 //#endregion

package/package.json

@@ -1,10 +1,14 @@
 {
   "name": "next-suspend",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Suspensfully access data by page params.",
   "publishConfig": {
     "access": "public"
   },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/MiroslavPetrik/next-suspend.git"
+  },
   "keywords": [
     "react",
     "nextjs",