@cisco-msx/types

TypeScript type declarations for MSX AngularJS application objects, pseudo-packages, and vms-ui-common packages.

Setup

Add node_modules/@cisco-msx to your tsconfig.json's compilerOptions.typeRoots, e.g.

{
  "compilerOptions": {
    "typeRoots": [
      "node_modules/@types",
      "node_modules/@cisco-msx"
    ]
  }
}

AngularJS

As a legacy AngularJS application, MSX needs to supply type annotations for its AngularJS objects, but these pose a problem for TypeScript. Since AngularJS objects are normally retrieved via dependency injection into a function and not via ES module imports, type annotations for those objects need to live in their own space and be imported separately. For MSX's AngularJS objects, export type annotations for application types from the declared module @msx/platform-types, found in platform-types.d.ts.

vms-ui-common

The same issues with AngularJS and TypeScript apply to packages from vms-ui-common, but since their types can be thought of as coming from actual packages, they should be exported from declared modules corresponding to their package names in vms-ui-common.d.ts in order to provide clarity where the object is originating from.

Example Usage

import {
  MsxRootScope, // Extends AngularJS' IRootScopeService interface
                // with additional properties added by MSX.
  Tenant
} from '@msx/platform-types';

export class MyCtrl {
  tenant: Tenant = null;

  static $inject: string[] = ['$rootScope'];
  constructor(private $root: MsxRootScope) {}

  get errorMessage {
    return this.$root.resolveResourceString('cisco.error.message', {
      tenantName: this.tenant.displayName
    });
  }
}