angular2 final release ng-bootstrap systemjs.config.js issue

angular folks recently released angular2 final version.2

every thing is good but systemjs.config.js broke. i looked at their official quick start and fixed configuration for angular2 core libraries but ng-bootstrap config is still broken. thought some one here can help me

i am getting 404 on

http://localhost:8080/my-proj/node_modules/%40ng-bootstrap/ng-bootstrap/ 404 (not found)

following is my systemjs.config.js

(function (global) {

  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',
      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
      // other libraries
      'rxjs':                       'npm:rxjs',
      'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',
     '@ng-bootstrap':              'npm:@ng-bootstrap',
      '@ng-bootstrap/ng-bootstrap':'npm:@ng-bootstrap/ng-bootstrap',


      '@ng-bootstrap/accordion':'npm:@ng-bootstrap/ng-bootstrap/accordion',
      '@ng-bootstrap/alert': 'npm:@ng-bootstrap/ng-bootstrap/alert',
      '@ng-bootstrap/bundles': 'npm:@ng-bootstrap/ng-bootstrap/bundles',
      '@ng-bootstrap/buttons': 'npm:@ng-bootstrap/ng-bootstrap/buttons',
      '@ng-bootstrap/carousel': 'npm:@ng-bootstrap/ng-bootstrap/carousel',
      '@ng-bootstrap/collapse': 'npm:@ng-bootstrap/ng-bootstrap/collapse',
      '@ng-bootstrap/dropdown': 'npm:@ng-bootstrap/ng-bootstrap/dropdown',
      '@ng-bootstrap/esm': 'npm:@ng-bootstrap/ng-bootstrap/esm',
      '@ng-bootstrap/modal': 'npm:@ng-bootstrap/ng-bootstrap/modal',
      '@ng-bootstrap/pagination': 'npm:@ng-bootstrap/ng-bootstrap/pagination',
      '@ng-bootstrap/popover': 'npm:@ng-bootstrap/ng-bootstrap/popover',
      '@ng-bootstrap/progressbar': 'npm:@ng-bootstrap/ng-bootstrap/progressbar',
      '@ng-bootstrap/rating': 'npm:@ng-bootstrap/ng-bootstrap/rating',
      '@ng-bootstrap/tabset': 'npm:@ng-bootstrap/ng-bootstrap/tabset',
      '@ng-bootstrap/timepicker': 'npm:@ng-bootstrap/ng-bootstrap/timepicker',
      '@ng-bootstrap/tooltip': 'npm:@ng-bootstrap/ng-bootstrap/tooltip',
      '@ng-bootstrap/typeahead': 'npm:@ng-bootstrap/ng-bootstrap/typeahead',
      '@ng-bootstrap/util': 'npm:@ng-bootstrap/ng-bootstrap/util',

    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      rxjs: {
        defaultExtension: 'js'
      },
      'angular2-in-memory-web-api': {
        main: './index.js',
        defaultExtension: 'js'
      }
    }
  });
})(this);

My previous configuration which works for angular rc.6 is as following

(function(global) {
  // map tells the System loader where to look for things
  var map = {
    'app':                        'app', // 'dist',
    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs',
    '@ng-bootstrap':              'node_modules/@ng-bootstrap',
    '@ng-bootstrap/ng-bootstrap': 'node_modules/@ng-bootstrap/ng-bootstrap'
  };
  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
    '@ng-bootstrap/ng-bootstrap': { main: 'index.js', defaultExtension: 'js' },
  };
  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'upgrade'
  ];
  var ngBootstrapPackageNames = [
    'accordion',
    'alert',
    'bundles',
    'buttons',
    'carousel',
    'collapse',
    'dropdown',
    'esm',
    'modal',
    'pagination',
    'popover',
    'progressbar',
    'rating',
    'tabset',
    'timepicker',
    'tooltip',
    'typeahead',
    'util'
  ];

  // Individual files (~300 requests):
  function packIndex(pkgName) {
    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }
  // Bundled (~40 requests):
  function packUmd(pkgName) {
    packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
  }

  function ngBootstrapPackIndex(pkgName) {
    packages['@ng-bootstrap/ng-bootstrap/' + pkgName] = {main: 'index.js', defaultExtension: 'js'};
  }



  // Most environments should use UMD; some (Karma) need the individual index files
  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
  // Add package entries for angular packages
  ngPackageNames.forEach(setPackageConfig);
  ngBootstrapPackageNames.forEach(ngBootstrapPackIndex);

  var config = {
    map: map,
    packages: packages
  };
  System.config(config);
})(this);