@angular-wave/angular.ts 0.9.2 → 0.9.4

package/src/directive/inject/inject.spec.js

@@ -0,0 +1,108 @@
+import { Angular } from "../../angular.js";
+import { dealoc } from "../../shared/dom.js";
+import { wait } from "../../shared/test-utils.js";
+
+describe("ngInject", () => {
+  let $compile, $rootScope, el, $test, $log;
+
+  beforeEach(() => {
+    el = document.getElementById("app");
+    dealoc(el);
+    el.innerHTML = "";
+    let angular = new Angular();
+    angular
+      .module("default", [])
+      .value("$test", { a: 1 })
+      .value("$a", { x: 1 })
+      .value("$b", { y: 2 })
+      .service(
+        "userService",
+        class {
+          constructor() {
+            this.name = "Bob";
+          }
+        },
+      )
+      .factory("userFactory", () => {
+        return {
+          name: "Fred",
+        };
+      });
+    angular
+      .bootstrap(el, ["default"])
+      .invoke((_$compile_, _$rootScope_, _$test_, _$log_) => {
+        $compile = _$compile_;
+        $rootScope = _$rootScope_;
+        $test = _$test_;
+        $log = _$log_;
+      });
+  });
+
+  it("should make $injectable available to scope", async () => {
+    expect($test.a).toEqual(1);
+    el.innerHTML = `<div ng-inject="$test"> {{ $test.a }} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect($rootScope.$test).toEqual($test);
+    expect(el.innerText).toEqual("1");
+  });
+
+  it("should evaluate expressions referencing injected", async () => {
+    expect($test.a).toEqual(1);
+    el.innerHTML = `<div ng-inject="$test"> {{ $test.a  + 1}} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect($rootScope.$test).toEqual($test);
+    expect(el.innerText).toEqual("2");
+  });
+
+  it("should evaluate expressions for multiple references", async () => {
+    expect($test.a).toEqual(1);
+    el.innerHTML = `<div ng-inject="$test;$a;$b"> {{ $test.a + $a.x + $b.y}} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect($rootScope.$test).toEqual($test);
+    expect(el.innerText).toEqual("4");
+  });
+
+  it("should warn and skip missing injectables", async () => {
+    const warnSpy = spyOn($log, "warn");
+    el.innerHTML = `<div ng-inject="$notExisting"> {{ $notExisting }} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+
+    expect(warnSpy).toHaveBeenCalledWith(
+      "Injectable $notExisting not found in $injector",
+    );
+    expect($rootScope.$notExisting).toBeUndefined();
+  });
+
+  it("should not modify scope if ng-inject is empty", async () => {
+    el.innerHTML = `<div ng-inject=""> {{ 123 }} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect($rootScope.$test).toBeUndefined();
+    expect(el.innerText.trim()).toBe("123");
+  });
+
+  it("should ignore non-$ identifiers", async () => {
+    el.innerHTML = `<div ng-inject="someVar = 5"> {{ someVar }} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect($rootScope.someVar).toBe(5);
+  });
+
+  it("should inject identifiers ending in *Service", async () => {
+    el.innerHTML = `<div ng-inject="userService"> {{ userService.name }} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect(el.innerText.trim()).toBe("Bob");
+  });
+
+  it("should inject identifiers ending in *Factory", async () => {
+    el.innerHTML = `<div ng-inject="userFactory"> {{ userFactory.name }} </div>`;
+    $compile(el)($rootScope);
+    await wait();
+    expect(el.innerText.trim()).toBe("Fred");
+  });
+});

package/src/{services/http-backend/http-backend.test.js → directive/inject/inject.test.js}

@@ -1,6 +1,6 @@
 import { test, expect } from "@playwright/test";
 
-const TEST_URL = "src/services/http-backend/http-backend.html";
+const TEST_URL = "src/directive/inject/inject.html";
 
 test("unit tests contain no errors", async ({ page }) => {
   await page.goto(TEST_URL);

package/src/directive/script/script.js

@@ -1,7 +1,7 @@
 scriptDirective.$inject = ["$templateCache"];
 
 /**
- * @param {import('../../services/template-cache/interface.ts').TemplateCache} $templateCache
+ * @param {ng.TemplateCacheService} $templateCache
  * @returns {import('../../interface.ts').Directive}
  */
 export function scriptDirective($templateCache) {

package/src/directive/setter/setter.js

@@ -3,8 +3,8 @@ import { $injectTokens as $t } from "../../injection-tokens.js";
 ngSetterDirective.$inject = [$t.$parse, $t.$log];
 
 /**
- * @param {import('../../core/parse/interface.ts').ParseService} $parse
- * @param {import('../../services/log/interface.ts').LogService} $log
+ * @param {ng.ParseService} $parse
+ * @param {ng.LogService} $log
  * @returns {import('interface.ts').Directive}
  */
 export function ngSetterDirective($parse, $log) {

package/src/filters/filter.js

@@ -9,7 +9,7 @@ import {
 } from "../shared/utils.js";
 
 /**
- * @returns {import('../interface.ts').FilterFn}
+ * @returns {ng.FilterFn}
  */
 export function filterFilter() {
   /**

package/src/filters/filters.js

@@ -227,7 +227,7 @@ export function formatNumber(
 }
 
 /**
- * @returns {import('../interface.ts').FilterFn}
+ * @returns {ng.FilterFn}
  */
 export function jsonFilter() {
   return function (object, spacing) {

package/src/filters/interface.ts

@@ -0,0 +1,9 @@
+/**
+ * A filter function takes an input and optional arguments, and returns a transformed value.
+ */
+export type FilterFn = (input: any, ...args: any[]) => any;
+
+/**
+ * A filter factory function that returns a FilterFn.
+ */
+export type FilterFactory = (...args: any[]) => FilterFn;

package/src/filters/limit-to.js

@@ -7,7 +7,7 @@ import {
 } from "../shared/utils.js";
 
 /**
- * @returns {import('../interface.ts').FilterFn}
+ * @returns {ng.FilterFn}
  */
 export function limitToFilter() {
   /**

package/src/filters/order-by.js

@@ -11,7 +11,7 @@ import { $injectTokens } from "../injection-tokens.js";
 orderByFilter.$inject = [$injectTokens.$parse];
 
 /**
- * @returns {import('../interface.ts').FilterFn}
+ * @returns {ng.FilterFn}
  */
 export function orderByFilter($parse) {
   return function (array, sortPredicate, reverseOrder, compareFn) {

package/src/index.ts

@@ -0,0 +1,96 @@
+import {
+  AnchorScrollProvider,
+  AnchorScrollService as TAnchorScrollService,
+} from "./services/anchor-scroll/anchor-scroll.js";
+import { ControllerService as TControllerService } from "./core/controller/interface.ts";
+import { ErrorHandler } from "./services/exception/interface.ts";
+export * from "./services/http/interface.ts";
+export * from "./services/log/interface.ts";
+export * from "./services/log/log.js";
+export * from "./services/location/interface.ts";
+export * from "./services/location/location.js";
+export * from "./services/pubsub/pubsub.js";
+export * from "./services/template-cache/template-cache.js";
+export * from "./index.js";
+
+import { Angular } from "./angular.js";
+import { Attributes } from "./core/compile/attributes.js";
+import { Scope } from "./core/scope/scope.js";
+import { NgModule } from "./core/di/ng-module.js";
+import { PubSubProvider, PubSub } from "./services/pubsub/pubsub.js";
+import type { ErrorHandlingConfig as TErrorHandlingConfig } from "./shared/interface.ts";
+import { InjectorService } from "./core/di/internal-injector.js";
+import { CompileFn } from "./core/compile/compile.js";
+import {
+  HttpParamSerializer,
+  HttpService as THttpService,
+  LogService as TLogService,
+} from "./interface.ts";
+import { ParseService as TParseService } from "./core/parse/interface.ts";
+import { TemplateRequestService as TTemplateRequestService } from "./services/template-request/interface.ts";
+import { HttpParamSerializerProvider } from "./services/http/http.js";
+import { FilterFactory, FilterFn as TFilterFn } from "./filters/interface.ts";
+import { InterpolateService as TInterpolateService } from "./core/interpolate/interface.ts";
+import { InterpolateProvider } from "./core/interpolate/interpolate.js";
+import { SceDelegateProvider, SceProvider } from "./services/sce/sce.js";
+import {
+  Directive as TDirective,
+  DirectiveFactory as TDirectiveFactory,
+  Component as TComponent,
+  Controller as TController,
+} from "./interface.ts";
+import { StateProvider } from "./router/state/state-service.js";
+
+declare global {
+  interface Function {
+    $inject?: readonly string[] | undefined;
+  }
+
+  namespace ng {
+    // Core types
+    type Angular = InstanceType<typeof Angular>;
+    type Attributes = InstanceType<typeof Attributes>;
+    type Directive = TDirective;
+    type DirectiveFactory = TDirectiveFactory;
+    type Component = TComponent;
+    type Controller = TController;
+    type Scope = InstanceType<typeof Scope>;
+    type NgModule = InstanceType<typeof NgModule>;
+    type PubSubProvider = InstanceType<typeof PubSubProvider>;
+    type FilterFn = TFilterFn;
+
+    // Providers
+    type AnchorScrollProvider = InstanceType<typeof AnchorScrollProvider>;
+    type InterpolateProvider = InstanceType<typeof InterpolateProvider>;
+    type HttpParamSerializerProvider = InstanceType<
+      typeof HttpParamSerializerProvider
+    >;
+
+    type SceProvider = InstanceType<typeof SceProvider>;
+    type SceDelegateProvider = InstanceType<typeof SceDelegateProvider>;
+
+    // Services
+    type AnchorScrollService = TAnchorScrollService;
+    type CompileService = CompileFn;
+    type ControllerService = TControllerService;
+    type ExceptionHandlerService = ErrorHandler;
+    type FilterService = FilterFactory;
+    type HttpParamSerializerSerService = HttpParamSerializer;
+    type HttpService = THttpService;
+    type InterpolateService = TInterpolateService;
+    type InjectorService = InstanceType<typeof InjectorService>;
+    type LogService = TLogService;
+    type ParseService = TParseService;
+    type PubSubService = InstanceType<typeof PubSub>;
+    type RootElementService = Element;
+    type RootScopeService = InstanceType<typeof Scope>;
+    type StateService = InstanceType<typeof StateProvider>;
+    type TemplateCacheService = InstanceType<typeof Map<string, string>>;
+    type TemplateRequestService = TTemplateRequestService;
+
+    // Support types
+    type ErrorHandlingConfig = TErrorHandlingConfig;
+    type WindowService = Window;
+    type DocumentService = Document;
+  }
+}

package/src/injection-tokens.js

@@ -35,11 +35,11 @@ export const $injectTokens = Object.freeze({
   $aria: "$aria",
   $compile: "$compile",
   $controller: "$controller",
+  $document: "$document",
   $eventBus: "$eventBus",
   $exceptionHandler: "$exceptionHandler",
   $filter: "$filter",
   $http: "$http",
-  $httpBackend: "$httpBackend",
   $httpParamSerializer: "$httpParamSerializer",
   $interpolate: "$interpolate",
   $location: "$location",
@@ -53,6 +53,8 @@ export const $injectTokens = Object.freeze({
   $sceDelegate: "$sceDelegate",
   $state: "$state",
   $stateRegistry: "$stateRegistry",
+  $$sanitizeUri: "$$sanitizeUri",
+  $$sanitizeUriProvider: "$$sanitizeUriProvider",
   $templateCache: "$templateCache",
   $templateFactory: "$templateFactory",
   $templateRequest: "$templateRequest",
@@ -60,6 +62,7 @@ export const $injectTokens = Object.freeze({
   $urlConfig: "$urlConfig",
   $url: "$url",
   $view: "$view",
+  $window: "$window",
   // provide literals
   $provide: "$provide",
   $injector: "$injector",

package/src/interface.ts

@@ -4,28 +4,26 @@ export * from "./services/log/log.js";
 export * from "./services/location/interface.ts";
 export * from "./services/location/location.js";
 export * from "./services/pubsub/pubsub.js";
-export * from "./services/template-cache/interface.ts";
 export * from "./services/template-cache/template-cache.js";
 export * from "./index.js";
 
 import { Attributes } from "./core/compile/attributes.js";
 import { Scope } from "./core/scope/scope.js";
-import { NgModule } from "./core/di/ng-module.js";
-import { PubSubProvider, PubSub } from "./services/pubsub/pubsub.js";
-import type { ErrorHandlingConfig as iErrorHandlingConfig } from "./shared/interface.ts";
-
-declare global {
-  interface Function {
-    $inject?: readonly string[] | undefined;
-  }
-
-  namespace ng {
-    type Scope = typeof Scope;
-    type NgModule = typeof NgModule;
-    type PubSubProvider = typeof PubSubProvider;
-    type PubSub = typeof PubSub;
-    type ErrorHandlingConfig = iErrorHandlingConfig;
-  }
+
+/**
+ * Configuration options for the AngularTS bootstrap process.
+ *
+ * @property strictDi - If `true`, disables automatic function annotation
+ * for the application. This helps identify code that breaks under minification.
+ * Defaults to `false`.
+ */
+export interface AngularBootstrapConfig {
+  /**
+   * Disable automatic function annotation for the application.
+   * This helps find bugs that would break under minified code.
+   * Defaults to `false`.
+   */
+  strictDi?: boolean;
 }
 
 /**
@@ -44,27 +42,49 @@ export type ExpandoStore = {
 };
 
 /**
- * A dependency-annotated factory array used by AngularTS DI system.
- *
- * It consists of zero or more dependency names (as strings), followed by
- * a factory function that takes those dependencies as arguments.
+ * Dependency-annotated factory array used by AngularTS DI system.
  *
  * Example:
- * ```ts
- * ['dep1', 'dep2', function(dep1, dep2) { ... }]
- * ```
+ * ['dep1', 'dep2', (dep1, dep2) => new MyController(dep1, dep2)]
+ */
+export type AnnotatedFactory<TFunction extends (...args: any[]) => any> = [
+  ...string[],
+  TFunction,
+];
+
+/**
+ * A class (constructor function) that can be instantiated.
  */
-export type AnnotatedFactory = [...string[], (...args: any[]) => any];
-export type InjectableFactory = (...args: any[]) => any;
-export type InjectableClass = new (...args: any[]) => any;
+export type InjectableClass<TInstance = any> = new (...args: any) => TInstance;
 
 /**
- * A factory that can be either a standalone function or a dependency-annotated array or a class (constructor function).
+ * A factory that can be:
+ * - a standalone function,
+ * - a dependency-annotated array,
+ * - or a class constructor.
  *
- * The array form is used to support minification-safe dependency injection.
- * See {@link AnnotatedFactory}.
+ * Parentheses are required around constructor types when used in unions.
  */
-export type Injectable = AnnotatedFactory | InjectableFactory | InjectableClass;
+export type Injectable<
+  T extends ((...args: any[]) => any) | (abstract new (...args: any[]) => any),
+> =
+  | AnnotatedFactory<
+      T extends abstract new (...args: any[]) => any
+        ? (...args: ConstructorParameters<T>) => InstanceType<T>
+        : T
+    >
+  | (T extends abstract new (...args: any[]) => any
+      ? InjectableClass<InstanceType<T>>
+      : never)
+  | T;
+
+interface ServiceProviderClass {
+  new (...args: any[]): ServiceProvider;
+}
+
+interface ServiceProviderFactory {
+  (...args: any[]): ServiceProvider;
+}
 
 /**
  * An object that defines how a service is constructed.
@@ -73,7 +93,7 @@ export type Injectable = AnnotatedFactory | InjectableFactory | InjectableClass;
  * either as a plain factory function or as an {@link AnnotatedFactory}.
  */
 export interface ServiceProvider {
-  $get: Injectable;
+  $get: Injectable<any>;
 }
 
 /**
@@ -114,14 +134,14 @@ export interface Provider {
    * @param name - The name of the service.
    * @param factoryFn - A function (or annotated array) that returns the service instance.
    */
-  factory(name: string, factoryFn: Injectable): Provider;
+  factory(name: string, factoryFn: Injectable<any>): Provider;
 
   /**
    * Register a constructor function to create a service.
    * @param name - The name of the service.
    * @param constructor - A class or function to instantiate.
    */
-  service(name: string, constructor: Injectable): Provider;
+  service(name: string, constructor: Injectable<any>): Provider;
 
   /**
    * Register a fixed value as a service.
@@ -145,16 +165,6 @@ export interface Provider {
   decorator(name: string, fn: Function): Provider;
 }
 
-/**
- * A filter function takes an input and optional arguments, and returns a transformed value.
- */
-export type FilterFn = (input: any, ...args: any[]) => any;
-
-/**
- * A filter factory function that returns a FilterFn.
- */
-export type FilterFactory = (...args: any[]) => FilterFn;
-
 /**
  * A controller constructor function used in AngularTS.
  */
@@ -192,23 +202,48 @@ export interface Controller {
 }
 
 /**
- * Defines a component's configuration object.
+ * Defines a component's configuration object (a simplified directive definition object).
  */
-export interface ComponentOptions {
-  /** Controller function or injectable string reference */
-  controller?: string | Injectable;
-  /** Alias name for the controller in templates */
-  controllerAs?: string;
-  /** Inline HTML template */
-  template?: string | Injectable;
-  /** URL of the HTML template */
-  templateUrl?: string | Injectable;
-  /** Binding definitions (e.g., `@`, `=`, `<`) */
-  bindings?: Record<string, string>;
-  /** Enable transclusion or specify named slots */
-  transclude?: boolean | Record<string, string>;
-  /** Required controllers from other directives */
-  require?: Record<string, string>;
+export interface Component {
+  controller?: string | Injectable<ControllerConstructor> | undefined;
+  /**
+   * An identifier name for a reference to the controller. If present, the controller will be published to its scope under
+   * the specified name. If not present, this will default to '$ctrl'.
+   */
+  controllerAs?: string | undefined;
+  /**
+   * html template as a string or a function that returns an html template as a string which should be used as the
+   * contents of this component. Empty string by default.
+   * If template is a function, then it is injected with the following locals:
+   * $element - Current element
+   * $attrs - Current attributes object for the element
+   * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+   */
+  template?: string | Injectable<(...args: any[]) => string> | undefined;
+  /**
+   * Path or function that returns a path to an html template that should be used as the contents of this component.
+   * If templateUrl is a function, then it is injected with the following locals:
+   * $element - Current element
+   * $attrs - Current attributes object for the element
+   * Use the array form to define dependencies (necessary if strictDi is enabled and you require dependency injection)
+   */
+  templateUrl?: string | Injectable<(...args: any[]) => string> | undefined;
+  /**
+   * Define DOM attribute binding to component properties. Component properties are always bound to the component
+   * controller and not to the scope.
+   */
+  bindings?: { [boundProperty: string]: string } | undefined;
+  /**
+   * Whether transclusion is enabled. Disabled by default.
+   */
+  transclude?: boolean | { [slot: string]: string } | undefined;
+  /**
+   * Requires the controllers of other directives and binds them to this component's controller.
+   * The object keys specify the property names under which the required controllers (object values) will be bound.
+   * Note that the required controllers will not be available during the instantiation of the controller,
+   * but they are guaranteed to be available just before the $onInit method is executed!
+   */
+  require?: { [controller: string]: string } | undefined;
 }
 
 /**
@@ -263,7 +298,7 @@ export interface Directive {
   /** Compile function for the directive */
   compile?: DirectiveCompileFn;
   /** Controller constructor or injectable string name */
-  controller?: string | Injectable | any;
+  controller?: string | Injectable<any> | any;
   /** Alias name for the controller in templates */
   controllerAs?: string;
   /** Whether to bind scope to controller */
@@ -383,39 +418,13 @@ export interface NgModelController {
   /** Current value shown in the view */
   $viewValue: any;
 }
-/**
- * Possible values for `data-swap` attribute
- */
-export const SwapMode = {
-  /** (default) Replaces the contents inside the element */
-  innerHTML: "innerHTML",
-
-  /** Replaces the entire element, including the tag itself */
-  outerHTML: "outerHTML",
-
-  /** Inserts plain text (without parsing HTML) */
-  textContent: "textContent",
-
-  /** Inserts HTML immediately before the element itself */
-  beforebegin: "beforebegin",
 
-  /** Inserts HTML inside the element, before its first child */
-  afterbegin: "afterbegin",
-
-  /** Inserts HTML inside the element, after its last child */
-  beforeend: "beforeend",
-
-  /** Inserts HTML immediately after the element itself */
-  afterend: "afterend",
-
-  /** Removes the element entirely */
-  delete: "delete",
-
-  /** Performs no insertion (no-op) */
-  none: "none",
-} as const;
+export interface RootElementService extends Element {}
 
 /**
- * Union type representing all possible DOM insertion modes.
+ * The minimal local definitions required by $controller(ctrl, locals) calls.
  */
-export type SwapModeType = keyof typeof SwapMode;
+export interface ControllerLocals {
+  $scope: Scope;
+  $element: Element;
+}

package/src/ng.js

@@ -50,7 +50,7 @@ import {
 import { ngModelOptionsDirective } from "./directive/model-options/model-options.js";
 import { ngAttributeAliasDirectives } from "./directive/attrs/attrs.js";
 import { ngEventDirectives } from "./directive/events/events.js";
-import { AnchorScrollProvider } from "./services/anchor-scroll.js";
+import { AnchorScrollProvider } from "./services/anchor-scroll/anchor-scroll.js";
 import { AnimateProvider } from "./animations/animate.js";
 import {
   AnimateAsyncRunFactoryProvider,
@@ -65,13 +65,12 @@ import {
   HttpParamSerializerProvider,
   HttpProvider,
 } from "./services/http/http.js";
-import { HttpBackendProvider } from "./services/http-backend/http-backend.js";
 import { LocationProvider } from "./services/location/location.js";
 import { LogProvider } from "./services/log/log.js";
 import { ParseProvider } from "./core/parse/parse.js";
 import { RootScopeProvider } from "./core/scope/scope.js";
 import { SceDelegateProvider, SceProvider } from "./services/sce/sce.js";
-import { TemplateRequestProvider } from "./services/template-request.js";
+import { TemplateRequestProvider } from "./services/template-request/template-request.js";
 import { SanitizeUriProvider } from "./core/sanitize/sanitize-uri.js";
 import {
   ngMessageDefaultDirective,
@@ -133,6 +132,7 @@ import {
   ngPutDirective,
 } from "./directive/http/http.js";
 import { $injectTokens as $t } from "./injection-tokens.js";
+import { ngInjectDirective } from "./directive/inject/inject.js";
 
 /**
  * Initializes core `ng` module.
@@ -152,6 +152,8 @@ export function registerNgModule(angular) {
           $provide.provider({
             $$sanitizeUri: SanitizeUriProvider,
           });
+          $provide.value("$window", window);
+          $provide.value("$document", document);
           $provide
             .provider($t.$compile, CompileProvider)
             .directive({
@@ -176,6 +178,7 @@ export function registerNgModule(angular) {
               ngHide: ngHideDirective,
               ngIf: ngIfDirective,
               ngInclude: ngIncludeDirective,
+              ngInject: ngInjectDirective,
               ngInit: ngInitDirective,
               ngMessages: ngMessagesDirective,
               ngMessage: ngMessageDirective,
@@ -253,7 +256,6 @@ export function registerNgModule(angular) {
             $interpolate: InterpolateProvider,
             $http: HttpProvider,
             $httpParamSerializer: HttpParamSerializerProvider,
-            $httpBackend: HttpBackendProvider,
             $location: LocationProvider,
             $log: LogProvider,
             $parse: ParseProvider,

package/src/ng.spec.js

@@ -30,4 +30,16 @@ describe("public", () => {
     const injector = createInjector(["ng"]);
     expect(injector.has("$rootScope")).toBe(true);
   });
+
+  it("sets up $window", () => {
+    const injector = createInjector(["ng"]);
+    expect(injector.has("$window")).toBe(true);
+    expect(injector.get("$window")).toBe(window);
+  });
+
+  it("sets up $document", () => {
+    const injector = createInjector(["ng"]);
+    expect(injector.has("$document")).toBe(true);
+    expect(injector.get("$document")).toBe(document);
+  });
 });

package/src/router/directives/state-directives.js

@@ -355,7 +355,7 @@ export function $StateRefActiveDirective(
         };
         states.push(stateInfo);
         return function removeState() {
-          removeFrom(states)(stateInfo);
+          removeFrom(states, stateInfo);
         };
       }
       // Update route state