docs & readme: fix demo

README.md

@@ -3,7 +3,7 @@
 ![bknd](https://raw.githubusercontent.com/bknd-io/bknd/refs/heads/main/docs/public/assets/poster.png)
 
 <p align="center" width="100%">
-<a href="https://stackblitz.com/github/bknd-io/bknd-examples?hideExplorer=1&embed=1&view=preview&startScript=example-admin-rich&initialPath=%2Fdata%2Fschema" target="_blank">
+<a href="https://stackblitz.com/github/bknd-io/bknd-demo?hideExplorer=1&embed=1&view=preview&initialPath=%2Fdata%2Fschema" target="_blank">
 <strong>⭐ Live Demo</strong>
 </a>
 </p>

docs/app/_components/StackBlitz.tsx

@@ -3,79 +3,77 @@
 import * as React from "react";
 
 export const examples = {
-  adminRich: {
+   adminRich: {
-    path: "github/bknd-io/bknd-examples",
+      path: "github/bknd-io/bknd-examples",
-    startScript: "example-admin-rich",
+      startScript: "example-admin-rich",
-    initialPath: "/data/schema"
+      initialPath: "/data/schema",
-  }
+   },
 };
 
 export const StackBlitz = ({
-  path,
+   path,
-  ratio = 9 / 16,
+   ratio = 9 / 16,
-  example,
+   example,
-  ...props
+   ...props
 }: {
-  path?: string;
+   path?: string;
-  ratio?: number;
+   ratio?: number;
-  example?: keyof typeof examples;
+   example?: keyof typeof examples;
-  [key: string]: unknown;
+   [key: string]: unknown;
 }) => {
-  const selected = example ? examples[example] : undefined;
+   const selected = example ? examples[example] : undefined;
-  const finalPath = path || selected?.path || "github/bknd-io/bknd-examples";
+   const finalPath = path || selected?.path || "github/bknd-io/bknd-examples";
 
-  const params = new URLSearchParams({
+   const params = new URLSearchParams({
-    ctl: "1",
+      ctl: "1",
-    hideExplorer: "1",
+      hideExplorer: "1",
-    embed: "1",
+      embed: "1",
-    view: "preview",
+      view: "preview",
-    ...(selected || {}),
+      ...(selected || {}),
-    ...props
+      ...props,
-  });
+   });
 
-  const url = new URL(
+   const url = new URL(`https://stackblitz.com/${finalPath}?${params.toString()}`);
-    `https://stackblitz.com/${finalPath}?${params.toString()}`
-  );
 
-  return (
+   return (
-    <>
+      <>
-      <div
+         <div
-        style={{
+            style={{
-          position: "relative",
+               position: "relative",
-          overflow: "hidden",
+               overflow: "hidden",
-          width: "100%",
+               width: "100%",
-          paddingTop: `${ratio * 100}%`
+               paddingTop: `${ratio * 100}%`,
-        }}
+            }}
-      >
+         >
-        <iframe
+            <iframe
-          width="100%"
+               width="100%"
-          height="100%"
+               height="100%"
-          src={url.toString()}
+               src={url.toString()}
-          style={{
+               style={{
-            position: "absolute",
+                  position: "absolute",
-            top: 0,
+                  top: 0,
-            left: 0,
+                  left: 0,
-            bottom: 0,
+                  bottom: 0,
-            right: 0,
+                  right: 0,
-            border: "none"
+                  border: "none",
-          }}
+               }}
-        />
+            />
-      </div>
+         </div>
-      <div
+         <div
-        style={{
+            style={{
-          fontSize: "80%",
+               fontSize: "80%",
-          opacity: 0.7,
+               opacity: 0.7,
-          marginTop: "0.2rem",
+               marginTop: "0.2rem",
-          marginBottom: "1rem",
+               marginBottom: "1rem",
-          textAlign: "center"
+               textAlign: "center",
-        }}
+            }}
-      >
+         >
-        If you&rsquo;re having issues viewing it inline,{" "}
+            If you&rsquo;re having issues viewing it inline,{" "}
-        <a href={url.toString()} target="_blank" rel="noreferrer">
+            <a href={url.toString()} target="_blank" rel="noreferrer">
-          try in a new tab
+               try in a new tab
-        </a>
+            </a>
-        .
+            .
-      </div>
+         </div>
-    </>
+      </>
-  );
+   );
 };

docs/content/docs/(documentation)/start.mdx

@@ -19,7 +19,7 @@ Glad you're here! **bknd** is a lightweight, infrastructure agnostic and feature
 
 Here is a preview of **bknd** in StackBlitz:
 
-<StackBlitz {...examples.adminRich} />
+<StackBlitz path="github/bknd-io/bknd-demo" initialPath="/" />
 
 <Accordions>
   <Accordion title="What's going on?">