Uniview

Uniview is a universal plugin system that enables writing plugins in React that can be rendered by any host framework - Svelte, Vue, React, or custom implementations.

Why Uniview?

Modern applications often need extensibility through plugins. Uniview solves the challenge of:

• Framework Lock-in: Write plugins once, render anywhere
• Security: Sandboxed execution in Web Workers
• Flexibility: Run plugins in browser, Node.js, Deno, or Bun
• Type Safety: Full TypeScript support with RPC type checking

                         RPC (kkrpc)
┌──────────────────┐ ◄──────────────────► ┌──────────────────┐
│  Plugin (React)  │      UINode tree     │  Host (Svelte)   │
│  Web Worker      │                      │  or Vue, React   │
└──────────────────┘                      └──────────────────┘

Key Features

Quick Example

Plugin (React):

// App.tsx
import { useState } from "react";

export default function App() {
  const [count, setCount] = useState(0);

  return (
    <div className="p-4">
      <p>Count: {count}</p>
      <button onClick={() => setCount((c) => c + 1)}>Increment</button>
    </div>
  );
}

Host (Svelte):

<script lang="ts">
  import { PluginHost } from '@uniview/host-svelte';
  import { createWorkerController } from '@uniview/host-sdk';

  const controller = createWorkerController({
    pluginUrl: '/plugins/my-plugin.js'
  });
</script>

<PluginHost {controller} />

Packages

Inspiration

Uniview is inspired by Raycast's plugin architecture which uses a custom React reconciler to render plugins using native AppKit components.