mirror of
https://github.com/supabase/supabase.git
synced 2026-06-20 09:32:15 +08:00
b79a64e301
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Feature, docs update ## What is the new behavior? This PR introduces a new `RealtimeFlow` component and hook to the UI library for building collaborative React Flow with Supabase Realtime: - keeps nodes and edges in sync across multiple connected clients in real time - uses Yjs with `@supabase-labs/y-supabase` to propagate flow updates - supports optional persistence, so a flow can be restored from previously saved shared state ## Additional context https://github.com/user-attachments/assets/90d3a381-6f9c-427f-a493-5d91c2141462 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Collaborative "Realtime Flow" diagram editor with syncing overlays and a dual-view demo component * Interactive demo page and registry example for live editing (add/remove/rename nodes) * Framework-ready registry packages for Next.js, React, React Router, and TanStack * **Documentation** * Comprehensive docs added for Next.js, React, React Router, and TanStack (usage, persistence, hook API) * **Chores** * Added runtime dependency for the flow component package [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/44273) <!-- end of auto-generated comment: release notes by coderabbit.ai -->
52 lines
1.6 KiB
TypeScript
52 lines
1.6 KiB
TypeScript
|
|
// @ts-nocheck
|
|
// This file is autogenerated by scripts/build-registry.mts
|
|
// Do not edit this file directly.
|
|
import * as React from "react"
|
|
|
|
export const Index = {
|
|
"default": {
|
|
|
|
"dropzone-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/dropzone-demo.tsx")),
|
|
}
|
|
,
|
|
"realtime-cursor-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/realtime-cursor-demo.tsx")),
|
|
}
|
|
,
|
|
"realtime-flow-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/realtime-flow-demo.tsx")),
|
|
}
|
|
,
|
|
"realtime-monaco-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/realtime-monaco-demo.tsx")),
|
|
}
|
|
,
|
|
"password-based-auth-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/password-based-auth.tsx")),
|
|
}
|
|
,
|
|
"current-user-avatar-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/current-user-avatar-demo.tsx")),
|
|
}
|
|
,
|
|
"current-user-avatar-preview": {
|
|
component: React.lazy(() => import("@/registry/default/examples/current-user-avatar-preview.tsx")),
|
|
}
|
|
,
|
|
"realtime-avatar-stack-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/realtime-avatar-stack-demo.tsx")),
|
|
}
|
|
,
|
|
"realtime-avatar-stack-preview": {
|
|
component: React.lazy(() => import("@/registry/default/examples/realtime-avatar-stack-preview.tsx")),
|
|
}
|
|
,
|
|
"infinite-query-hook-demo": {
|
|
component: React.lazy(() => import("@/registry/default/examples/infinite-query-hook-demo.tsx")),
|
|
}
|
|
|
|
},
|
|
} as const
|