Open-source plugin platform for Angular workbenches

DocsGet startedChangelog

v0.15.0 · Apache 2.0 · frontend only

Build Angular workbenches
that grow with your product.

An open-source plugin platform for Angular workbenches. You write the product; the panes, the palette, the theming and a plugin system your users extend are already there.

npmpnpmyarnbun

npx @loomweaver/cli init

pnpm dlx @loomweaver/cli init

yarn dlx @loomweaver/cli init

bunx @loomweaver/cli init

In an Angular application or an Nx workspace you already have.

Get startedRead the docsLive demo (opens in a new tab)

Twenty-seven seconds, no cuts. The rail, the panes, the palette and the status bar are the platform’s. Everything inside them can come from plugins, the theme at the end included.

What the recording shows, in words

1. A workbench opens with a rail on the left, one document in the content area and a status bar below.
2. ⌘K opens the command palette; it lists commands from several plugins, and one of them runs.
3. A tab is dragged to the right edge and the pane splits, so two documents are open side by side.
4. A plugin written without Angular loads into a sidebar, running inside its own sandboxed iframe.
5. A theme plugin is switched on and re-skins the entire application, chrome included, without a reload.

What you get

The workbench your users work in, before your first plugin. Every picture is from the live demo.

1. Panes and tabs

   Tab groups the user splits by dragging, preview tabs, pinning, and any tab pops out into a window of its own.

   

2. A palette and a quick open

   ⌘K lists every command a plugin registered, with its shortcut. ⌘P finds what is open, and what could be.

   

3. Workspaces

   Named arrangements that remember themselves: the ones you provide, and the ones the user saves.

   

4. A plugin store, with consent

   Your curated catalogue. Before a plugin from it runs, the user sees what it asked for and answers once.

   

5. Settings and permissions

   Every plugin’s settings in one place, and every grant the user can inspect and revoke.

   

Also in the box: theming from semantic tokens, i18n, WCAG 2.1 AA, an installable PWA, live sync across windows, and the unsaved-work question. Everything the user does by hand, your code can call through the Distribution API. No server: settings, state and auth are ports with local defaults, wired toyour own backend when you are ready.

Still Angular

What you write is the Angular you already know, and nothing is written twice.

A weaver is a manifest and one activate(). What it hands the workbench are the standalone components you would have written anyway, against Angular’s own router:routerLink, ActivatedRoute, guards, back and forward all behave.One surface can own your whole route tree, so an app you already have moves in behind a single plugin.

Register an action once and it is a rail item, a keystroke, a context-menu entry and a palette entry. You never keep a second list beside the first.

Authoring a weaverCommands and their triggers

your weaver

ctx.registerCommand({
  id: 'invoices.export',
  title: 'invoices.export',
  description: 'Export the selected invoices as CSV',
  arguments: [
    { name: 'range', kind: 'choice', choices: ['month', 'quarter', 'year'], required: true },
  ],
  callable: true,
  run: (_context, args) => exportInvoices(String(args?.['range'])),
});

Built for humans and agents

Two different things, told apart: an assistant that builds your product, and an agent that drives it at runtime.

Written down for machines

llms.txt is the map, llms-full.txt the whole contract in one fetch. Point any assistant at a URL and it knows the workbench.

llms-full.txt

Tools, not guesses

The MCP server gives your assistant the generators and validators as tools. A weaver lands as generator output, not as something to review line by line.

Building with an AI assistant

One action, offered to an agent

A command is a rail item, a shortcut and a palette entry. callable: true adds one more caller, and it reaches what the user could have reached, nothing more.

Callable commands

Driven over AG-UI

An open protocol we implement rather than one we invented. Generate a weaver with --agent and the panel, the seam that decides before a call runs, and a stand-in are there.

Driving your product with an AG-UI agent

Somebody who wants to contribute to your tool points their own assistant at yourllms-full.txt and starts. Your contributor onboarding is a URL.

The agent opened the quote on the left by calling the same command a menu item calls. The second call was declined, and the workbench was never asked to run it.

Three rungs of trust

One contract, three levels of isolation. Moving a plugin down a rung is a change of trust, not a rewrite.

1

Trusted, in-process

Your own weavers, composed at build time. Full reach, because you wrote them.

2

Sandboxed iframe

Somebody else’s code in its own JS context, opaque origin, no reach into your DOM. Write the body in any framework.

3

Installed at runtime

From your curated catalogue, with a consent dialog the user answers and an update path driven by the catalogue version.

All three consume the same ctx, behind a default-deny capability broker the user can inspect and revoke. The plugin system has the whole picture.

One CLI

The same generators from a command line, as Nx generators, or as tools your assistant calls. Each one wires what it finds and names what it could not.

distribution

a runnable composition root that boots the shell, with its build wired

weaver

a plugin with a surface, a command, a settings section or an agent connection, as asked

theme

a token-override stylesheet, editable colours or mapped onto Bootstrap

auth-source

a stand-in session a user can operate before the real one exists

validate-commands

per command, whether an agent is offered it and what it would have to guess at

ScaffoldingCopyable recipes

Five minutes to a running product

In a fresh Angular app or the one you have. One command installs the platform, wires the build, registers your first weaver, names every file it touched, and only ever adds.

npmpnpmyarnbun

# a fresh Angular app, or the one you have (an Nx workspace works too)
ng new my-studio --style=css --ssr=false && cd my-studio

# the platform, your product and a first plugin, in one go
npx @loomweaver/cli init

npm start

# a fresh Angular app, or the one you have (an Nx workspace works too)
ng new my-studio --style=css --ssr=false && cd my-studio

# the platform, your product and a first plugin, in one go
pnpm dlx @loomweaver/cli init

pnpm start

# a fresh Angular app, or the one you have (an Nx workspace works too)
ng new my-studio --style=css --ssr=false && cd my-studio

# the platform, your product and a first plugin, in one go
yarn dlx @loomweaver/cli init

yarn start

# a fresh Angular app, or the one you have (an Nx workspace works too)
ng new my-studio --style=css --ssr=false && cd my-studio

# the platform, your product and a first plugin, in one go
bunx @loomweaver/cli init

bun start

Get startedWith an AI assistantLive demo (opens in a new tab)