Sidebar

Events & Runtime

Live nav-schema mounts expose practical runtime controls: custom prefixes, sidebar event handlers, route-aware active classes, and mega menu trigger modes.

Runtime prefix

Pass prefix to isolate nav-schema host markers from other tiny-engine powered widgets on the page.

prefix.ts

mountSidebar(container, {
  schema,
  prefix: "nav-schema",
  currentUrl: location.href
});

Internal runtime

nav-schema registers the required tiny-engine-core capsule internally. You keep the public API at the schema level.

runtime.ts

// nav-schema uses tiny-engine-core internally.
// UI and getPrefix are also exported for adapter authors.
import { UI, getPrefix } from "nav-schema";

mountMegaMenu(container, { schema, prefix: "nav-schema" });
getPrefix("nav-schema");

Event handlers

Use handlers for analytics, custom routing, keyboard focus tracking, or application-specific side effects.

events.ts

mountSidebar(container, {
  schema,
  events: {
    onMouseEnter({ item }) {
      analytics.track("nav_hover", { id: item.id });
    }
  }
});