a plugin’s dist/index.js is an esm bundle that exports mount(mountPoint, serverData, hostApi). kern mounts it inside an isolated shadow dom so plugin tailwind never bleeds into the host shell, and injects dist/index.css into that shadow root.

ts
export function mount(
  mountPoint: ShadowRoot,
  serverData: ServerData,
  hostApi: HostApi,
) {
  // render your ui into mountPoint
}

hostApi is the bridge to tauri and the shell:

• ·invoke(command, args) — call tauri/rust commands.
• ·serverPath — the instance directory.
• ·listen(event, cb) — subscribe to tauri events.
• ·extension registrars:
• ·registerTab({ id, label }) — add a tab to the server detail view.
• ·registerToolbarAction(...) — add a toolbar button.
• ·registerSidebarItem(...) — add a sidebar entry.

plugins use registerTab to add custom tabs to the server detail view.

because your ui runs in a shadow root:

• ·your tailwind/css only affects your own dom.
• ·the host’s styles never leak in either (except via css custom properties the host explicitly exposes).
• ·you can bundle whatever styling approach you want — plain css, tailwind, css-in-js.