A production-ready messaging bus for coordinating web components, micro-frontends, and framework integrations.
Zero dependencies. Framework agnostic. 5KB core. 60+ components ready to use.
Use alongside React, Vue, Angular, or vanilla JS. PAN messaging enables seamless coordination without tight coupling. Reduce your framework footprint by 60%+.
PAN messaging protocol enables web components to communicate effectively without prop drilling or tight coupling. Build truly reusable component libraries.
Mix React, Vue, and LARC components on the same page. They all speak PAN. One design system, every framework.
5KB core vs 500KB+ for React+MUI. Load components on-demand. Only pay for what you use.
Drop a script tag and start building. Works from file://, no webpack, no bundlers, no configuration.
60+ production-ready components: data tables, forms, charts, modals, authentication flows. Enterprise-grade UI elements that work anywhere.
JWT authentication with auto-header injection. Developers never write Authorization headers. Auto-refresh tokens.
Built-in Inspector component lets you watch message flow, filter topics, and debug in real-time.
Drop a script tag and start building. No build tools required.
<!doctype html>
<!-- Drop one script tag, then use any component. That's it! -->
<script type="module" src="https://cdn.jsdelivr.net/npm/@larcjs/components@1/src/pan-autoload.mjs"></script>
<!-- Components load automatically (including pan-bus!) -->
<x-counter></x-counter>
<pan-inspector></pan-inspector>
โจ All components load automatically when they appear in the DOM.
The <pan-bus> is automatically created for you.
No imports, no customElements.define(), no bundler.
Replace Material-UI/Ant Design with LARC components. Save 400-500KB instantly.
Build once, use in React apps, Vue apps, Angular apps. One codebase, every framework.
Different teams, different frameworks, coordinating via PAN without tight coupling.
Incrementally upgrade jQuery/Backbone apps. Drop in LARC components, no rewrite needed.
Layer interactive features onto existing pages without heavy frameworks.
Build and iterate quickly without build tooling or configuration overhead.
Explore 20+ progressive examples and 6 production-ready demo applications