@preact-mvc/core 0.1.0 → 0.1.2

package/src/injector.ts

@@ -1,228 +0,0 @@
-export type Type<T> = new (...args: any[]) => T;
-
-export class InjectionToken<T> {
-  constructor(protected readonly _desc: string) {}
-  toString() {
-    return `InjectionToken ${this._desc}`;
-  }
-}
-
-export type Token<T> = Type<T> | InjectionToken<T> | (abstract new (...args: any[]) => T);
-
-export type Provider =
-  | Type<any>
-  | { provide: Token<any>; useClass: Type<any> }
-  | { provide: Token<any>; useValue: any }
-  | { provide: Token<any>; useFactory: (...deps: any[]) => any; deps?: Token<any>[] };
-
-interface Record {
-  factory: () => any;
-  resolving: boolean;
-  resolved: boolean;
-  value: any;
-}
-
-// --- Injection context -----------------------------------------------------
-// While an Injector constructs a class (service, controller, factory), it
-// becomes the "current" injector so `inject()` calls inside the constructor
-// or field initializers resolve against it — the same model as Angular's
-// injection context.
-
-let currentInjector: Injector | null = null;
-
-export function runInInjectionContext<T>(injector: Injector, fn: () => T): T {
-  const prev = currentInjector;
-  currentInjector = injector;
-  try {
-    return fn();
-  } finally {
-    currentInjector = prev;
-  }
-}
-
-export function inject<T>(token: Token<T>): T {
-  if (!currentInjector) {
-    throw new Error(
-      'inject() called outside an injection context. It can only be used in the ' +
-        'constructor/field initializers of a class instantiated by the framework.'
-    );
-  }
-  return currentInjector.get(token);
-}
-
-export function getCurrentInjector(): Injector | null {
-  return currentInjector;
-}
-
-// --- Injector ---------------------------------------------------------------
-
-function tokenName(token: Token<any>): string {
-  return typeof token === 'function' ? token.name : token.toString();
-}
-
-// Injectable handle to the enclosing scope's destruction — inject(DestroyRef)
-// anywhere to register cleanup that runs when the scope is deactivated.
-export class DestroyRef {
-  constructor(private readonly injector: Injector) {}
-  onDestroy(fn: () => void): void {
-    this.injector.registerCleanup(fn);
-  }
-}
-
-export class Injector {
-  private records = new Map<Token<any>, Record>();
-
-  // Every module whose providers AND declared components are visible in this
-  // scope: the module this injector was created for plus its transitive
-  // imports. Populated by registerModule(); read by view-mount enforcement.
-  readonly modules = new Set<any>();
-
-  constructor(
-    readonly parent: Injector | null = null,
-    readonly name = 'injector'
-  ) {
-    this.records.set(DestroyRef, {
-      factory: () => null,
-      resolving: false,
-      resolved: true,
-      value: new DestroyRef(this),
-    });
-  }
-
-  get root(): Injector {
-    let node: Injector = this;
-    while (node.parent) node = node.parent;
-    return node;
-  }
-
-  provide(provider: Provider): void {
-    if (typeof provider === 'function') {
-      const cls = provider;
-      this.records.set(cls, {
-        factory: () => this.instantiate(cls),
-        resolving: false,
-        resolved: false,
-        value: undefined,
-      });
-    } else if ('useValue' in provider) {
-      this.records.set(provider.provide, {
-        factory: () => provider.useValue,
-        resolving: false,
-        resolved: false,
-        value: undefined,
-      });
-    } else if ('useClass' in provider) {
-      const cls = provider.useClass;
-      this.records.set(provider.provide, {
-        factory: () => this.instantiate(cls),
-        resolving: false,
-        resolved: false,
-        value: undefined,
-      });
-    } else {
-      const { useFactory, deps = [] } = provider;
-      this.records.set(provider.provide, {
-        factory: () => useFactory(...deps.map((d) => this.get(d))),
-        resolving: false,
-        resolved: false,
-        value: undefined,
-      });
-    }
-  }
-
-  has(token: Token<any>): boolean {
-    if (this.records.has(token)) return true;
-    if ((token as any).__controller) return true;
-    if (this.parent) return this.parent.has(token);
-    return this.isRootProvided(token);
-  }
-
-  get<T>(token: Token<T>): T {
-    // Nearest explicit registration wins, walking up the scope chain. This is
-    // what makes declaring a controller/provider in a scope meaningful: every
-    // descendant resolves that shared instance.
-    let node: Injector | null = this;
-    while (node) {
-      const rec = node.records.get(token);
-      if (rec) return node.resolveRecord(token, rec);
-      node = node.parent;
-    }
-    // Controllers are transient unless explicitly provided: one instance per
-    // requesting scope, so a view always gets its own controller.
-    if ((token as any).__controller) {
-      this.provide(token as Type<any>);
-      return this.resolveRecord(token, this.records.get(token)!);
-    }
-    // providedIn: 'root' lazily registers at the top — local providers still
-    // shadow it because the chain walk runs first.
-    const root = this.root;
-    if (root.isRootProvided(token)) {
-      root.provide({ provide: token, useClass: token as Type<T> });
-      return root.get(token);
-    }
-    throw new Error(`No provider for ${tokenName(token)} (looked up from "${this.name}")`);
-  }
-
-  private resolveRecord<T>(token: Token<T>, rec: Record): T {
-    if (rec.resolving) {
-      throw new Error(`Circular dependency detected while resolving ${tokenName(token)}`);
-    }
-    if (!rec.resolved) {
-      rec.resolving = true;
-      try {
-        rec.value = rec.factory();
-        rec.resolved = true;
-      } finally {
-        rec.resolving = false;
-      }
-    }
-    return rec.value;
-  }
-
-  private isRootProvided(token: Token<any>): boolean {
-    const meta = (token as any).__injectable as { providedIn?: 'root' } | undefined;
-    return meta?.providedIn === 'root';
-  }
-
-  instantiate<T>(cls: Type<T>, ...args: any[]): T {
-    const inst = runInInjectionContext(this, () => new cls(...args));
-    this.trackLifecycle(inst);
-    return inst;
-  }
-
-  // --- Scope lifecycle -----------------------------------------------------
-  // Every class this injector constructs (view, injected controllers,
-  // view-scoped providers) is managed together: activate() fires onInit on
-  // all of them at mount, deactivate() fires onDestroy at unmount — the same
-  // way Angular ties provider lifecycles to their injector's scope.
-
-  private managed: any[] = [];
-  private active = false;
-
-  private trackLifecycle(inst: any): void {
-    if (typeof inst?.onInit !== 'function' && typeof inst?.onDestroy !== 'function') return;
-    this.managed.push(inst);
-    if (this.active) inst.onInit?.();
-  }
-
-  activate(): void {
-    this.active = true;
-    for (const inst of this.managed) inst.onInit?.();
-  }
-
-  deactivate(): void {
-    for (const inst of this.managed) inst.onDestroy?.();
-    for (const cleanup of this.cleanups) cleanup();
-    this.managed.length = 0;
-    this.cleanups.length = 0;
-    this.active = false;
-  }
-
-  private cleanups: Array<() => void> = [];
-
-  // Register teardown (effect disposers, subscriptions, timers) that runs
-  // when this scope is deactivated. Exposed to classes via DestroyRef.
-  registerCleanup(fn: () => void): void {
-    this.cleanups.push(fn);
-  }
-}

package/src/module.ts

@@ -1,76 +0,0 @@
-import { h, render } from 'preact';
-import { Injector } from './injector';
-import { InjectorContext } from './context';
-import { installViewInterop } from './view';
-import type { ModuleMeta } from './decorators';
-
-// Modules are the unit of provider scoping. A module's providers (plus those
-// of its imports, transitively) register into a single child Injector. The
-// injector tree mirrors the view tree: root injector -> AppModule injector ->
-// feature/lazy module injectors -> per-view injectors.
-
-export function getModuleMeta(mod: any): ModuleMeta | undefined {
-  return mod?.__module;
-}
-
-// Applies a module to an injector: registers all transitively imported
-// modules (and their providers/controllers) into it and marks them visible
-// on injector.modules. Used for module injectors and standalone-component
-// `imports` alike.
-export function registerModule(mod: any, injector: Injector, seen: Set<any>): void {
-  if (seen.has(mod)) return;
-  seen.add(mod);
-  const meta = getModuleMeta(mod);
-  if (!meta) {
-    throw new Error(`${mod?.name ?? mod} is not a module — missing @Module() metadata`);
-  }
-  for (const imp of meta.imports ?? []) registerModule(imp, injector, seen);
-  injector.modules.add(mod);
-  for (const provider of meta.providers ?? []) injector.provide(provider);
-  // Module-declared controllers register at module scope: one shared
-  // instance for everything injected under that module.
-  for (const c of meta.controllers ?? []) injector.provide(c);
-}
-
-export function createModuleInjector(mod: any, parent: Injector): Injector {
-  const meta = getModuleMeta(mod);
-  if (!meta) {
-    throw new Error(`${mod?.name ?? mod} is not a module — missing @Module() metadata`);
-  }
-  const injector = new Injector(parent, `module ${mod.name ?? '(anonymous)'}`);
-  registerModule(mod, injector, new Set());
-  return injector;
-}
-
-// Lazy/feature modules get one injector per parent injector, cached so a
-// route-mounted module's providers stay alive across navigations.
-const moduleInjectorCache = new WeakMap<Injector, Map<any, Injector>>();
-
-export function getModuleInjector(mod: any, parent: Injector): Injector {
-  let byModule = moduleInjectorCache.get(parent);
-  if (!byModule) {
-    byModule = new Map();
-    moduleInjectorCache.set(parent, byModule);
-  }
-  let injector = byModule.get(mod);
-  if (!injector) {
-    injector = createModuleInjector(mod, parent);
-    byModule.set(mod, injector);
-  }
-  return injector;
-}
-
-export function bootstrap(RootModule: any, el: HTMLElement): void {
-  installViewInterop();
-  const root = new Injector(null, 'root');
-  const appInjector = createModuleInjector(RootModule, root);
-  const meta = getModuleMeta(RootModule)!;
-  const App = meta.bootstrap?.[0];
-  if (!App) {
-    throw new Error('Root module must declare a bootstrap component: @Module({ bootstrap: [AppView] })');
-  }
-  render(
-    h(InjectorContext.Provider, { value: appInjector }, h(App, {})),
-    el
-  );
-}

package/src/router/link.tsx

@@ -1,25 +0,0 @@
-import type { ComponentChildren } from 'preact';
-import type { JSX } from 'preact';
-import { useService } from '../context';
-import { Router } from './router';
-
-export function Link(props: {
-  to: string;
-  class?: string;
-  children?: ComponentChildren;
-}) {
-  const router = useService(Router);
-  const onClick = (e: JSX.TargetedMouseEvent<HTMLAnchorElement>) => {
-    if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || e.button !== 0) return;
-    e.preventDefault();
-    // preact-router's document-level <a> interceptor routes any plain
-    // anchor click it sees — stop propagation so ours doesn't double-nav.
-    e.stopPropagation();
-    router.navigate(props.to);
-  };
-  return (
-    <a href={router.href(props.to)} class={props.class} onClick={onClick}>
-      {props.children}
-    </a>
-  );
-}

package/src/router/module.ts

@@ -1,42 +0,0 @@
-import { getModuleMeta } from '../module';
-import { ROUTES, ROUTER_BASE, Router, defaultBasePath } from './router';
-import type { Route } from './router';
-
-export interface RouterOptions {
-  /**
-   * Mount prefix the app is served under ('/demo/'), Angular's APP_BASE_HREF.
-   * Defaults to the document's own directory (document.baseURI), so apps
-   * hosted under a subpath need no config; '/' disables prefixing.
-   */
-  basePath?: string;
-}
-
-// RouterModule.forRoot(routes) returns a module-shaped object — anything with
-// __module metadata can sit in `imports`, so static config works the same as
-// a decorated module class.
-export class RouterModule {
-  static forRoot(routes: Route[], opts: RouterOptions = {}) {
-    return {
-      __module: {
-        providers: [
-          { provide: ROUTES, useValue: routes },
-          { provide: ROUTER_BASE, useValue: opts.basePath ?? defaultBasePath() },
-          {
-            provide: Router,
-            useFactory: (r: Route[], base: string) => new Router(r, base),
-            deps: [ROUTES, ROUTER_BASE],
-          },
-        ],
-      },
-    };
-  }
-}
-
-// Resolve which view a matched route should render: an explicit component, or
-// the module's declared bootstrap component.
-export function routeComponent(match: { route: Route }): any {
-  const { route } = match;
-  if (route.component) return route.component;
-  if (route.module) return getModuleMeta(route.module)?.bootstrap?.[0] ?? null;
-  return null;
-}

package/src/router/outlet.tsx

@@ -1,65 +0,0 @@
-import { createContext } from 'preact';
-import type { FunctionComponent } from 'preact';
-import { useContext } from 'preact/hooks';
-import PRRouter from 'preact-router';
-import type { RoutableProps } from 'preact-router';
-import { useInjector, useService, InjectorContext } from '../context';
-import { getModuleInjector } from '../module';
-import { routeComponent } from './module';
-import { Router } from './router';
-
-/**
- * Which depth of the matched chain this outlet renders — the root outlet
- * is depth 0, an outlet inside a routed view is depth 1, and so on.
- */
-const OutletDepth = createContext(0);
-
-/**
- * The preact-router bridge: a mounted PR <Router> claiming every URL via a
- * `default` sink child. Its existence makes preact-router's machinery live
- * in this app — foreign `route()` calls and the global `<a href>` click
- * interceptor resolve through it — and its onChange feeds our `url`
- * signal, so navigations from ANY preact-routing code drive our router.
- * The sink renders nothing; url/matches props die on the component.
- */
-const BridgeSink: FunctionComponent<RoutableProps> = () => null;
-
-export function RouterOutlet() {
-  const router = useService(Router);
-  const parent = useInjector();
-  const depth = useContext(OutletDepth);
-  const matches = router.matches.value;
-  const match = matches?.[depth];
-  if (!match) {
-    // The outermost outlet keeps the bridge mounted even with no match, so
-    // route() interop survives 404s.
-    return depth === 0 ? (
-      <PRRouter onChange={(e) => router.syncUrl(e.url)}>
-        <BridgeSink default />
-      </PRRouter>
-    ) : null;
-  }
-
-  const Component = routeComponent(match);
-  if (!Component) return null;
-
-  // A route with `module` gets the module's injector — its providers are
-  // scoped to that feature. Nesting is automatic: a deeper outlet resolves
-  // its module under this level's injector.
-  const injector = match.route.module
-    ? getModuleInjector(match.route.module, parent)
-    : parent;
-
-  return (
-    <OutletDepth.Provider value={depth + 1}>
-      {depth === 0 && (
-        <PRRouter onChange={(e) => router.syncUrl(e.url)}>
-          <BridgeSink default />
-        </PRRouter>
-      )}
-      <InjectorContext.Provider value={injector}>
-        <Component />
-      </InjectorContext.Provider>
-    </OutletDepth.Provider>
-  );
-}

package/src/router/router.ts

@@ -1,165 +0,0 @@
-import { computed, signal } from '@preact/signals';
-import { route as prRoute } from 'preact-router';
-import { Injectable } from '../decorators';
-import { InjectionToken } from '../injector';
-
-export interface Route {
-  path: string;
-  component?: any; // view function
-  module?: any; // module class — its bootstrap component renders inside its injector
-  children?: Route[];
-}
-
-export interface RouteMatch {
-  route: Route;
-  params: Record<string, string>;
-}
-
-export const ROUTES = new InjectionToken<Route[]>('ROUTES');
-export const ROUTER_BASE = new InjectionToken<string>('ROUTER_BASE');
-
-/**
- * The directory the app's document lives at, e.g. '/demo/' when the page is
- * served from `host/demo/index.html`. Deriving the base from baseURI (rather
- * than baking it at build time) means the same bundle works under any mount
- * path — GitHub Pages project dirs, reverse-proxy prefixes, iframed demos.
- */
-export function defaultBasePath(): string {
-  if (typeof document === 'undefined') return '/';
-  const p = new URL(document.baseURI).pathname;
-  return p.endsWith('/') ? p : p.slice(0, p.lastIndexOf('/') + 1);
-}
-
-/**
- * Prefix match: consume the pattern's leading segments off `segs`, returning
- * the captured params and the unconsumed tail. `'*'` consumes everything;
- * `''` consumes nothing (an index route — leaf check decides validity).
- */
-function matchPrefix(
-  pattern: string,
-  segs: string[],
-): { params: Record<string, string>; rest: string[] } | null {
-  if (pattern === '*') return { params: {}, rest: [] };
-  const pSegs = pattern.split('/').filter(Boolean);
-  if (pSegs.length > segs.length) return null;
-  const params: Record<string, string> = {};
-  for (let i = 0; i < pSegs.length; i++) {
-    const p = pSegs[i];
-    const u = decodeURIComponent(segs[i]);
-    if (p.startsWith(':')) params[p.slice(1)] = u;
-    else if (p !== u) return null;
-  }
-  return { params, rest: segs.slice(pSegs.length) };
-}
-
-/**
- * Match `segs` against a route list into a chain outermost → innermost.
- * A route with `children` matches by prefix and the tail recurses; a leaf
- * route must consume the whole tail. Parents may match alone when the tail
- * is exhausted (Angular semantics: `/users` renders the parent shell even
- * if it has children).
- */
-function matchSegments(routes: Route[], segs: string[]): RouteMatch[] | null {
-  for (const route of routes) {
-    const m = matchPrefix(route.path, segs);
-    if (m === null) continue;
-    if (route.children?.length) {
-      const child = matchSegments(route.children, m.rest);
-      if (child !== null) return [{ route, params: m.params }, ...child];
-      if (m.rest.length === 0) return [{ route, params: m.params }];
-      continue;
-    }
-    if (m.rest.length === 0) return [{ route, params: m.params }];
-  }
-  return null;
-}
-
-function matchRoutes(routes: Route[], url: string): RouteMatch[] | null {
-  const path = url.split('?')[0].split('#')[0];
-  return matchSegments(routes, path.split('/').filter(Boolean));
-}
-
-@Injectable()
-export class Router {
-  /** Mount prefix, normalized to '' or '/demo' (no trailing slash). */
-  readonly base: string;
-  url = signal(typeof location === 'undefined' ? '/' : '');
-  /**
-   * The matched chain outermost → innermost — depth d is what the d-th
-   * nested <RouterOutlet/> renders.
-   */
-  matches = computed(() => matchRoutes(this.routes, this.url.value));
-  /** Back-compat: the chain's outermost match. */
-  match = computed(() => this.matches.value?.[0] ?? null);
-  /** Params merged across the whole chain (inner levels win on collision). */
-  params = computed(() =>
-    Object.assign({}, ...(this.matches.value ?? []).map((m) => m.params)),
-  );
-
-  constructor(
-    private routes: Route[],
-    base = defaultBasePath(),
-  ) {
-    this.base = base === '/' ? '' : base.replace(/\/+$/, '');
-    this.consumeShimParam();
-    if (typeof location !== 'undefined') {
-      this.url.value = this.strip(location.pathname) + location.search;
-    }
-    if (typeof window !== 'undefined') {
-      window.addEventListener('popstate', this.onPopState);
-    }
-  }
-
-  /**
-   * Static-host deep links: the site's 404 shim redirects
-   * `/docs/<app>/<rest>` to `<app>/?__pmvc_path=<rest>` so the app loads;
-   * restore the real URL via replaceState before seeding `url` — the
-   * browser history never sees the hop. No-op everywhere else.
-   */
-  private consumeShimParam(): void {
-    if (typeof location === 'undefined' || typeof history === 'undefined') return;
-    const rest = new URL(location.href).searchParams.get('__pmvc_path');
-    if (rest === null) return;
-    history.replaceState(null, '', this.base + '/' + rest);
-  }
-
-  private strip(path: string): string {
-    if (this.base && path.startsWith(this.base)) {
-      return path.slice(this.base.length) || '/';
-    }
-    return path;
-  }
-
-  /** Absolute href for an in-app path — what <a href> and pushState see. */
-  href(to: string): string {
-    return this.base + to;
-  }
-
-  /** Called by the preact-router bridge on any URL change it sees —
-   *  foreign route() calls, its global <a> interceptor, popstate. */
-  syncUrl(fullUrl: string): void {
-    const [path, search = ''] = fullUrl.split('?');
-    const stripped = this.strip(path);
-    const next = stripped + (search ? `?${search}` : '');
-    if (next !== this.url.value) this.url.value = next;
-  }
-
-  private onPopState = () => {
-    this.syncUrl(location.pathname + location.search);
-  };
-
-  navigate(to: string): void {
-    // Through preact-router: updates every mounted <Router> in the tree —
-    // ours and foreign ones — not just our own subscriber. route() is a
-    // no-op when no mounted PR Router claims the url, so fall back to a
-    // manual push when the bridge isn't up yet.
-    if (!prRoute(this.base + to)) {
-      history.pushState(null, '', this.base + to);
-      this.url.value = to;
-    }
-  }
-
-  isActive(path: string): boolean {
-    return this.url.value === path;
-  }
-}