diff --git a/.changeset/pink-rice-behave.md b/.changeset/pink-rice-behave.md
new file mode 100644
index 0000000..2e304a6
--- /dev/null
+++ b/.changeset/pink-rice-behave.md
@@ -0,0 +1,5 @@
+---
+"simple-stack-stream": patch
+---
+
+Simple stream initial release. Who said suspense had to be hard?
diff --git a/examples/form/.gitignore b/examples/playground/.gitignore
similarity index 100%
rename from examples/form/.gitignore
rename to examples/playground/.gitignore
diff --git a/examples/form/.vscode/extensions.json b/examples/playground/.vscode/extensions.json
similarity index 100%
rename from examples/form/.vscode/extensions.json
rename to examples/playground/.vscode/extensions.json
diff --git a/examples/form/.vscode/launch.json b/examples/playground/.vscode/launch.json
similarity index 100%
rename from examples/form/.vscode/launch.json
rename to examples/playground/.vscode/launch.json
diff --git a/examples/form/README.md b/examples/playground/README.md
similarity index 100%
rename from examples/form/README.md
rename to examples/playground/README.md
diff --git a/examples/form/astro.config.mjs b/examples/playground/astro.config.mjs
similarity index 86%
rename from examples/form/astro.config.mjs
rename to examples/playground/astro.config.mjs
index 236bb91..277ed15 100644
--- a/examples/form/astro.config.mjs
+++ b/examples/playground/astro.config.mjs
@@ -1,5 +1,6 @@
import { defineConfig } from "astro/config";
import simpleStackForm from "simple-stack-form";
+import simpleStackStream from "simple-stack-stream";
import react from "@astrojs/react";
import node from "@astrojs/node";
import preact from "@astrojs/preact";
@@ -10,6 +11,7 @@ export default defineConfig({
output: "server",
integrations: [
simpleStackForm(),
+ simpleStackStream(),
react({ include: ["**/react/*"] }),
preact({ include: ["**/preact/*"] }),
tailwind(),
diff --git a/examples/form/package.json b/examples/playground/package.json
similarity index 91%
rename from examples/form/package.json
rename to examples/playground/package.json
index 6eb5855..a7bccb2 100644
--- a/examples/form/package.json
+++ b/examples/playground/package.json
@@ -1,5 +1,5 @@
{
- "name": "@examples/form",
+ "name": "@examples/playground",
"type": "module",
"version": "0.0.0",
"private": true,
@@ -24,6 +24,7 @@
"react-dom": "^18.0.0",
"sanitize-html": "^2.11.0",
"simple-stack-form": "^0.1.0",
+ "simple-stack-stream": "^0.0.1",
"tailwindcss": "^3.0.24",
"zod": "^3.22.4"
},
diff --git a/examples/form/public/favicon.svg b/examples/playground/public/favicon.svg
similarity index 100%
rename from examples/form/public/favicon.svg
rename to examples/playground/public/favicon.svg
diff --git a/examples/form/src/components/Sanitize.tsx b/examples/playground/src/components/Sanitize.tsx
similarity index 100%
rename from examples/form/src/components/Sanitize.tsx
rename to examples/playground/src/components/Sanitize.tsx
diff --git a/examples/playground/src/components/Wait.astro b/examples/playground/src/components/Wait.astro
new file mode 100644
index 0000000..33c1c49
--- /dev/null
+++ b/examples/playground/src/components/Wait.astro
@@ -0,0 +1,14 @@
+---
+type Props = {
+ ms: number,
+ class?: string,
+}
+
+const {ms, class: cls} = Astro.props;
+
+await new Promise(resolve => setTimeout(resolve, ms));
+---
+
+
+
Loaded in {ms}ms
+
\ No newline at end of file
diff --git a/examples/form/src/components/preact/Form.tsx b/examples/playground/src/components/preact/Form.tsx
similarity index 100%
rename from examples/form/src/components/preact/Form.tsx
rename to examples/playground/src/components/preact/Form.tsx
diff --git a/examples/form/src/components/preact/Signup.tsx b/examples/playground/src/components/preact/Signup.tsx
similarity index 100%
rename from examples/form/src/components/preact/Signup.tsx
rename to examples/playground/src/components/preact/Signup.tsx
diff --git a/examples/form/src/components/react/Form.tsx b/examples/playground/src/components/react/Form.tsx
similarity index 100%
rename from examples/form/src/components/react/Form.tsx
rename to examples/playground/src/components/react/Form.tsx
diff --git a/examples/form/src/components/react/Signup.tsx b/examples/playground/src/components/react/Signup.tsx
similarity index 100%
rename from examples/form/src/components/react/Signup.tsx
rename to examples/playground/src/components/react/Signup.tsx
diff --git a/examples/form/src/env.d.ts b/examples/playground/src/env.d.ts
similarity index 65%
rename from examples/form/src/env.d.ts
rename to examples/playground/src/env.d.ts
index 1b7275f..1ea85ff 100644
--- a/examples/form/src/env.d.ts
+++ b/examples/playground/src/env.d.ts
@@ -1,2 +1,3 @@
+///
///
///
diff --git a/examples/form/src/pages/array.astro b/examples/playground/src/pages/array.astro
similarity index 100%
rename from examples/form/src/pages/array.astro
rename to examples/playground/src/pages/array.astro
diff --git a/examples/form/src/pages/index.astro b/examples/playground/src/pages/index.astro
similarity index 100%
rename from examples/form/src/pages/index.astro
rename to examples/playground/src/pages/index.astro
diff --git a/examples/playground/src/pages/stream.astro b/examples/playground/src/pages/stream.astro
new file mode 100644
index 0000000..3159283
--- /dev/null
+++ b/examples/playground/src/pages/stream.astro
@@ -0,0 +1,35 @@
+---
+import Wait from "../components/Wait.astro";
+import { Suspense, ResolveSuspended } from 'simple-stack-stream/components'
+---
+
+
+
+
+
+
+ Suspense
+
+
+
Out of order streaming
+
+
+
+
Content
+
+
Loading...
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/examples/form/tailwind.config.mjs b/examples/playground/tailwind.config.mjs
similarity index 100%
rename from examples/form/tailwind.config.mjs
rename to examples/playground/tailwind.config.mjs
diff --git a/examples/form/tsconfig.json b/examples/playground/tsconfig.json
similarity index 100%
rename from examples/form/tsconfig.json
rename to examples/playground/tsconfig.json
diff --git a/packages/form/README.md b/packages/form/README.md
index 439a5ea..77c83bd 100644
--- a/packages/form/README.md
+++ b/packages/form/README.md
@@ -244,8 +244,8 @@ We expose internal functions to manage your form state and handle both synchrono
An demo can be found in our repository `examples`:
-- [StackBlitz playground](https://stackblitz.com/github/bholmesdev/simple-stack/tree/main/examples/form)
-- [GitHub](https://github.com/bholmesdev/simple-stack/tree/main/examples/form)
+- [StackBlitz playground](https://stackblitz.com/github/bholmesdev/simple-stack/tree/main/examples/playground)
+- [GitHub](https://github.com/bholmesdev/simple-stack/tree/main/examples/playground)
## Sanitizing User Input
@@ -272,4 +272,4 @@ const signupForm = createForm({
### Examples
-You can find a sanitization implementation example on our [`examples`](https://github.com/bholmesdev/simple-stack/tree/main/examples/form/src/components/Sanitize.tsx)
+You can find a sanitization implementation example on our [`examples`](https://github.com/bholmesdev/simple-stack/tree/main/examples/playground/src/components/Sanitize.tsx)
diff --git a/packages/stream/README.md b/packages/stream/README.md
new file mode 100644
index 0000000..d1db1d1
--- /dev/null
+++ b/packages/stream/README.md
@@ -0,0 +1,89 @@
+# Simple stream 🌊
+
+Suspend Astro components with fallback content. Like React Server Components, but Just HTML ™️
+
+```astro
+---
+import { Suspense, ResolveSuspended } from 'simple-stack-stream/components';
+---
+
+
Simple stream
+
+https://github.com/bholmesdev/simple-stack/assets/51384119/99ed15a4-5a70-4f19-bc2a-712d4039c0a7
+
+
+
+
+
+
+
+
+
+
+
+```
+
+## Installation
+
+Simple stream is an Astro integration. You can install and configure this via the Astro CLI using `astro add`:
+
+```bash
+npm run astro add simple-stack-stream
+```
+
+## Usage
+
+Simple stream exposes a "Suspense" utility to show fallback content while your server-side components load.
+
+### `Suspense`
+
+`` is a wrapper component for any content you want to load out-of-order with a fallback. Pass any suspended content as children, and use `slot="fallback"` to define your fallback:
+
+```astro
+---
+import { Suspense } from 'simple-stack-stream/components';
+---
+
+
+
+
Loading...
+
+```
+
+⚠️ **Client JS is required** for suspended content to render. For progressive enhancement, we recommend including `