move demo projects to webpack (#1915)

ng2-components/ng2-activiti-analytics/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-activiti-analytics/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-activiti-analytics/demo/config/webpack.common.js

@@ -0,0 +1,134 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-activiti-analytics',
+    'ng2-activiti-diagrams'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-activiti-analytics/demo/config/webpack.dev.js

@@ -0,0 +1,37 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-activiti-diagrams$": path.resolve(__dirname, '../../ng2-activiti-diagrams/index.ts'),
+            "ng2-activiti-analytics$": path.resolve(__dirname, '../../ng2-activiti-analytics/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-analytics/demo/config/webpack.prod.js

@@ -0,0 +1,66 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-activiti-analytics',
+    'ng2-activiti-diagrams'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-analytics/demo/index.html

@@ -6,51 +6,8 @@
     <title>Alfresco Angular 2 Activiti Analytics - Demo</title>
     <base href="./">
 
-    <!-- Charts -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <script src="node_modules/chart.js/dist/Chart.bundle.min.js"></script>
-    <script src="node_modules/raphael/raphael.min.js"></script>
-
-    <!-- Moment js -->
-    <script src="node_modules/moment/min/moment.min.js"></script>
-
-    <!-- Date picker -->
-    <script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>
-    <script src="node_modules/md-date-time-picker/dist/js/draggabilly.pkgd.min.js"></script>
-    <link rel="stylesheet" href="node_modules/md-date-time-picker/dist/css/mdDateTimePicker.css" media="all">
-
-    <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- Polyfill(s) for Safari (pre-10.x) -->
-    <script src="node_modules/intl/dist/Intl.min.js"></script>
-    <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
-    <script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
-
-    <!-- Polyfill(s) for dialogs -->
-    <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
-    <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
-    <style>._dialog_overlay { position: static !important; } </style>
-
-    <!-- Modules  -->
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
-<style> .chart {display: block; width: 100%;}</style>
-
-
 <body>
 
 <alfresco-app-demo></alfresco-app-demo>

ng2-components/ng2-activiti-analytics/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Angular2 Diagrams Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-activiti-diagrams ng2-activiti-analytics",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "contributors": [
@@ -71,10 +68,54 @@
     "@types/hammerjs": "^2.0.34",
     "@types/jasmine": "2.5.35",
     "@types/node": "6.0.45",
-    "concurrently": "^2.2.0",
+    "angular2-template-loader": "^0.6.2",
-    "rimraf": "2.5.2",
+    "autoprefixer": "^6.5.4",
-    "tslint": "^3.8.1",
+    "copy-webpack-plugin": "^4.0.1",
-    "typescript": "^2.0.3",
+    "css-loader": "^0.23.1",
-    "wsrv": "^0.1.5"
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   }
 }

ng2-components/ng2-activiti-analytics/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-activiti-analytics/demo/src/vendor.ts

@@ -0,0 +1,30 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-activiti-analytics';
+
+import 'ng2-charts';
+import 'chart.js';
+require('script-loader!raphael/raphael.min.js');
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-activiti-analytics/demo/systemjs.config.js

@@ -1,57 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'rxjs': 'npm:rxjs',
-            'moment': 'npm:moment/min/moment.min.js',
-            'ng2-charts': 'npm:ng2-charts',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-activiti-diagrams': 'npm:ng2-activiti-diagrams',
-            'ng2-activiti-analytics': 'npm:ng2-activiti-analytics'
-        },
-        // 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'
-            },
-            'moment': 'npm:moment/min/moment.min.js',
-            'ng2-translate': { defaultExtension: 'js' },
-            'ng2-charts': { main: './bundles/ng2-charts.umd.js', defaultExtension: 'js'},
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': { main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-activiti-diagrams': { main: './bundles/ng2-activiti-diagrams.js', defaultExtension: 'js'},
-            'ng2-activiti-analytics': { main: './bundles/ng2-activiti-analytics.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-activiti-analytics/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-activiti-analytics/demo/tslint.json

@@ -3,15 +3,13 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
         "class-name": true,
         "comment-format": [
             true,
-      "check-space",
+            "check-space"
-      "check-lowercase"
         ],
         "curly": true,
         "eofline": true,
@@ -23,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -50,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -60,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-activiti-analytics/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-activiti-diagrams/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-activiti-diagrams/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-activiti-diagrams/demo/config/webpack.common.js

@@ -0,0 +1,133 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-activiti-diagrams'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-activiti-diagrams/demo/config/webpack.dev.js

@@ -0,0 +1,36 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-activiti-diagrams$": path.resolve(__dirname, '../../ng2-activiti-diagrams/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-diagrams/demo/config/webpack.prod.js

@@ -0,0 +1,65 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-activiti-diagrams'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-diagrams/demo/index.html

@@ -6,40 +6,7 @@
     <title>Alfresco Angular 2 Activiti Diagrams - Demo</title>
     <base href="./">
 
-    <!-- Raphael -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <script src="node_modules/raphael/raphael.min.js"></script>
-    <!-- Diagrams -->
-    <script src="node_modules/ng2-activiti-diagrams/assets/Polyline.js"></script>
-
-    <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- Polyfill(s) for Safari (pre-10.x) -->
-    <script src="node_modules/intl/dist/Intl.min.js"></script>
-    <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
-    <script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
-
-    <!-- Polyfill(s) for dialogs -->
-    <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
-    <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
-    <style>._dialog_overlay { position: static !important; } </style>
-
-    <!-- Modules  -->
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
 <body>
 

ng2-components/ng2-activiti-diagrams/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Angular2 Diagrams Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-activiti-diagrams",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "contributors": [
@@ -62,12 +59,57 @@
     "raphael": "^2.2.6"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "rimraf": "2.5.2",
+    "angular2-template-loader": "^0.6.2",
-    "tslint": "^3.8.1",
+    "autoprefixer": "^6.5.4",
-    "typescript": "^2.0.3",
+    "copy-webpack-plugin": "^4.0.1",
-    "wsrv": "^0.1.5"
+    "css-loader": "^0.23.1",
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   }
 }

ng2-components/ng2-activiti-diagrams/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-activiti-diagrams/demo/src/vendor.ts

@@ -0,0 +1,30 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-activiti-diagrams';
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+import 'ng2-charts';
+import 'chart.js';
+require('script-loader!raphael/raphael.min.js');
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-activiti-diagrams/demo/systemjs.config.js

@@ -1,54 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'rxjs': 'npm:rxjs',
-            'moment': 'npm:moment/min/moment.min.js',
-            'raphael': 'npm:raphael',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-activiti-diagrams': 'npm:ng2-activiti-diagrams'
-        },
-        // 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'
-            },
-            'moment': { defaultExtension: 'js' },
-            'ng2-translate': { defaultExtension: 'js' },
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': { main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-activiti-diagrams': { main: './bundles/ng2-activiti-diagrams.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-activiti-diagrams/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-activiti-diagrams/demo/tslint.json

@@ -3,15 +3,13 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
         "class-name": true,
         "comment-format": [
             true,
-      "check-space",
+            "check-space"
-      "check-lowercase"
         ],
         "curly": true,
         "eofline": true,
@@ -23,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -50,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -60,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-activiti-diagrams/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-activiti-form/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-activiti-form/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-activiti-form/demo/config/webpack.common.js

@@ -0,0 +1,133 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-activiti-form'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-activiti-form/demo/config/webpack.dev.js

@@ -0,0 +1,36 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-activiti-form$": path.resolve(__dirname, '../../ng2-activiti-form/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-form/demo/config/webpack.prod.js

@@ -0,0 +1,65 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-activiti-form'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-form/demo/index.html

@@ -6,47 +6,8 @@
     <title>Alfresco Angular 2 Activiti Form - Demo</title>
     <base href="./">
 
-    <!-- Moment js -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <script src="node_modules/moment/min/moment.min.js"></script>
-
-    <!-- Date picker -->
-    <script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>
-    <script src="node_modules/md-date-time-picker/dist/js/draggabilly.pkgd.min.js"></script>
-    <link rel="stylesheet" href="node_modules/md-date-time-picker/dist/css/mdDateTimePicker.css" media="all">
-
-    <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- Polyfill(s) for Safari (pre-10.x) -->
-    <script src="node_modules/intl/dist/Intl.min.js"></script>
-    <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
-    <script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
-
-    <!-- Polyfill(s) for dialogs -->
-    <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
-    <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
-    <style>._dialog_overlay { position: static !important; } </style>
-
-    <!-- Modules  -->
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
-<style> .chart {display: block; width: 100%;}</style>
-
-
 <body>
 
 <alfresco-app-demo></alfresco-app-demo>

ng2-components/ng2-activiti-form/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Activiti Form Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-activiti-form",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "contributors": [
@@ -63,12 +60,57 @@
     "ng2-activiti-form": "1.5.0"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "rimraf": "2.5.2",
+    "angular2-template-loader": "^0.6.2",
-    "tslint": "^3.8.1",
+    "autoprefixer": "^6.5.4",
-    "typescript": "^2.0.3",
+    "copy-webpack-plugin": "^4.0.1",
-    "wsrv": "^0.1.5"
+    "css-loader": "^0.23.1",
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   }
 }

ng2-components/ng2-activiti-form/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-activiti-form/demo/src/vendor.ts

@@ -0,0 +1,26 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-activiti-form';
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-activiti-form/demo/systemjs.config.js

@@ -1,54 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'rxjs': 'npm:rxjs',
-            'moment': 'npm:moment/min/moment.min.js',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-activiti-form': 'npm:ng2-activiti-form'
-        },
-        // 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'
-            },
-            'moment': { defaultExtension: 'js' },
-            'ng2-translate': { defaultExtension: 'js' },
-            'ng2-charts': { main: 'ng2-charts.js', defaultExtension: 'js'},
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': { main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-activiti-form': { main: './bundles/ng2-activiti-form.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-activiti-form/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-activiti-form/demo/tslint.json

@@ -3,15 +3,13 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
         "class-name": true,
         "comment-format": [
             true,
-      "check-space",
+            "check-space"
-      "check-lowercase"
         ],
         "curly": true,
         "eofline": true,
@@ -23,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -50,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -60,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-activiti-form/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-activiti-processlist/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-activiti-processlist/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-activiti-processlist/demo/config/webpack.common.js

@@ -0,0 +1,136 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-activiti-processlist',
+    'ng2-activiti-tasklist',
+    'ng2-alfresco-core',
+    'ng2-alfresco-datatable'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-activiti-processlist/demo/config/webpack.dev.js

@@ -0,0 +1,38 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-alfresco-datatable$": path.resolve(__dirname, '../../ng2-alfresco-datatable/index.ts'),
+            "ng2-activiti-processlist$": path.resolve(__dirname, '../../ng2-activiti-processlist/index.ts'),
+            "ng2-activiti-tasklist$": path.resolve(__dirname, '../../ng2-activiti-tasklist/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-processlist/demo/config/webpack.prod.js

@@ -0,0 +1,68 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-activiti-processlist',
+    'ng2-activiti-tasklist',
+    'ng2-alfresco-core',
+    'ng2-alfresco-datatable'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-processlist/demo/index.html

@@ -6,47 +6,8 @@
   <title>Alfresco Angular 2 Activiti Process - Demo</title>
   <base href="./">
 
-  <!-- Moment js -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-  <script src="node_modules/moment/min/moment.min.js"></script>
-
-  <!-- Date picker -->
-  <script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>
-  <script src="node_modules/md-date-time-picker/dist/js/draggabilly.pkgd.min.js"></script>
-  <link rel="stylesheet" href="node_modules/md-date-time-picker/dist/css/mdDateTimePicker.css" media="all">
-
-  <!-- Google Material Design Lite -->
-  <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-  <script src="node_modules/material-design-lite/material.min.js"></script>
-  <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-  <!-- Polyfill(s) for Safari (pre-10.x) -->
-  <script src="node_modules/intl/dist/Intl.min.js"></script>
-  <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-  <!-- Polyfill(s) for older browsers -->
-  <script src="node_modules/core-js/client/shim.min.js"></script>
-  <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
-  <script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
-
-  <!-- Polyfill(s) for dialogs -->
-  <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
-  <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
-  <style>._dialog_overlay { position: static !important; } </style>
-
-  <!-- Modules  -->
-  <script src="node_modules/zone.js/dist/zone.js"></script>
-  <script src="node_modules/reflect-metadata/Reflect.js"></script>
-  <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-  <script src="systemjs.config.js"></script>
-  <script>
-    System.import('app').catch(function(err){ console.error(err); });
-  </script>
-
 </head>
-<style> .chart {display: block; width: 100%;}</style>
-
-
 <body>
 
 <alfresco-app-demo></alfresco-app-demo>

ng2-components/ng2-activiti-processlist/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Show available processes from the Activiti Process Services suite - Demo",
   "version": "0.1.0",
   "author": "Will Abson",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-alfresco-datatable ng2-activiti-form ng2-activiti-tasklist ng2-activiti-processlist",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "keywords": [
     "ng2",
@@ -58,12 +55,57 @@
     "ng2-activiti-processlist": "1.5.0"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "rimraf": "2.5.2",
+    "angular2-template-loader": "^0.6.2",
-    "tslint": "^3.8.1",
+    "autoprefixer": "^6.5.4",
-    "typescript": "^2.0.3",
+    "copy-webpack-plugin": "^4.0.1",
-    "wsrv": "^0.1.5"
+    "css-loader": "^0.23.1",
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   }
 }

ng2-components/ng2-activiti-processlist/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-activiti-processlist/demo/src/vendor.ts

@@ -0,0 +1,26 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-activiti-processlist';
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-activiti-processlist/demo/systemjs.config.js

@@ -1,59 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'moment' : 'npm:moment/min/moment.min.js',
-            'rxjs': 'npm:rxjs',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable',
-            'ng2-activiti-form': 'npm:ng2-activiti-form',
-            'ng2-activiti-tasklist': 'npm:ng2-activiti-tasklist',
-            'ng2-activiti-processlist': 'npm:ng2-activiti-processlist'
-        },
-        // 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'
-            },
-            'moment': { defaultExtension: 'js' },
-            'ng2-translate': { defaultExtension: 'js' },
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': { main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-alfresco-datatable': { main: './bundles/ng2-alfresco-datatable.js', defaultExtension: 'js'},
-            'ng2-activiti-form': { main: './bundles/ng2-activiti-form.js', defaultExtension: 'js'},
-            'ng2-activiti-tasklist': { main: './bundles/ng2-activiti-tasklist.js', defaultExtension: 'js'},
-            'ng2-activiti-processlist': { main: './bundles/ng2-activiti-processlist.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-activiti-processlist/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-activiti-processlist/demo/tslint.json

@@ -3,15 +3,13 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
         "class-name": true,
         "comment-format": [
             true,
-      "check-space",
+            "check-space"
-      "check-lowercase"
         ],
         "curly": true,
         "eofline": true,
@@ -23,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -50,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -60,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-activiti-processlist/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-activiti-tasklist/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-activiti-tasklist/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-activiti-tasklist/demo/config/webpack.common.js

@@ -0,0 +1,134 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-activiti-tasklist',
+    'ng2-alfresco-datatable'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-activiti-tasklist/demo/config/webpack.dev.js

@@ -0,0 +1,37 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-alfresco-datatable$": path.resolve(__dirname, '../../ng2-alfresco-datatable/index.ts'),
+            "ng2-activiti-tasklist$": path.resolve(__dirname, '../../ng2-activiti-tasklist/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-tasklist/demo/config/webpack.prod.js

@@ -0,0 +1,65 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-activiti-tasklist'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-activiti-tasklist/demo/index.html

@@ -6,47 +6,8 @@
     <title>Alfresco Angular 2 Activiti Tasks - Demo</title>
     <base href="./">
 
-    <!-- Moment js -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <script src="node_modules/moment/min/moment.min.js"></script>
-
-    <!-- Date picker -->
-    <script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>
-    <script src="node_modules/md-date-time-picker/dist/js/draggabilly.pkgd.min.js"></script>
-    <link rel="stylesheet" href="node_modules/md-date-time-picker/dist/css/mdDateTimePicker.css" media="all">
-
-    <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- Polyfill(s) for Safari (pre-10.x) -->
-    <script src="node_modules/intl/dist/Intl.min.js"></script>
-    <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
-    <script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
-
-    <!-- Polyfill(s) for dialogs -->
-    <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
-    <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
-    <style>._dialog_overlay { position: static !important; } </style>
-
-    <!-- Modules  -->
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
-<style> .chart {display: block; width: 100%;}</style>
-
-
 <body>
 
 <alfresco-app-demo></alfresco-app-demo>

ng2-components/ng2-activiti-tasklist/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Angular2 Task List Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-alfresco-datatable ng2-activiti-form ng2-activiti-tasklist",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "dependencies": {
@@ -51,14 +48,58 @@
     "ng2-activiti-tasklist": "1.5.0"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "license-check": "1.1.5",
+    "angular2-template-loader": "^0.6.2",
-    "rimraf": "2.5.2",
+    "autoprefixer": "^6.5.4",
-    "tslint": "3.15.1",
+    "copy-webpack-plugin": "^4.0.1",
-    "typescript": "^2.0.2",
+    "css-loader": "^0.23.1",
-    "wsrv": "^0.1.5"
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   },
   "keywords": [
     "angular2",

ng2-components/ng2-activiti-tasklist/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-activiti-tasklist/demo/src/vendor.ts

@@ -0,0 +1,26 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-activiti-tasklist';
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-activiti-tasklist/demo/systemjs.config.js

@@ -1,57 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'moment' : 'npm:moment/min/moment.min.js',
-            'rxjs': 'npm:rxjs',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable',
-            'ng2-activiti-form': 'npm:ng2-activiti-form',
-            'ng2-activiti-tasklist': 'npm:ng2-activiti-tasklist'
-        },
-        // 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'
-            },
-            'moment': { defaultExtension: 'js' },
-            'ng2-translate': { defaultExtension: 'js' },
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': { main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-alfresco-datatable': { main: './bundles/ng2-alfresco-datatable.js', defaultExtension: 'js'},
-            'ng2-activiti-form': { main: './bundles/ng2-activiti-form.js', defaultExtension: 'js'},
-            'ng2-activiti-tasklist': { main: './bundles/ng2-activiti-tasklist.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-activiti-tasklist/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-activiti-tasklist/demo/tslint.json

@@ -3,15 +3,13 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
         "class-name": true,
         "comment-format": [
             true,
-      "check-space",
+            "check-space"
-      "check-lowercase"
         ],
         "curly": true,
         "eofline": true,
@@ -23,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -50,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -60,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-activiti-tasklist/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-alfresco-core/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-alfresco-datatable/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-alfresco-datatable/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-alfresco-datatable/demo/config/webpack.common.js

@@ -0,0 +1,133 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-alfresco-datatable'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-alfresco-datatable/demo/config/webpack.dev.js

@@ -0,0 +1,36 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-alfresco-datatable$": path.resolve(__dirname, '../../ng2-alfresco-datatable/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-alfresco-datatable/demo/config/webpack.prod.js

@@ -0,0 +1,65 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-alfresco-datatable'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-alfresco-datatable/demo/index.html

@@ -5,24 +5,7 @@
     <title>Angular 2 DataTable - Demo</title>
     <base href="./">
 
-    <!-- Google Material Design Lite -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- 1. Load libraries -->
-    <!-- 1. Load libraries -->
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
 <body>
 

ng2-components/ng2-alfresco-datatable/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Angular2 DataTable Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-alfresco-datatable",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "contributors": [
@@ -55,13 +52,58 @@
     "ng2-alfresco-datatable": "1.5.0"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "rimraf": "2.5.2",
+    "angular2-template-loader": "^0.6.2",
-    "tslint": "3.15.1",
+    "autoprefixer": "^6.5.4",
-    "typescript": "^2.0.3",
+    "copy-webpack-plugin": "^4.0.1",
-    "wsrv": "^0.1.5"
+    "css-loader": "^0.23.1",
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   },
   "keywords": [
     "angular2",

ng2-components/ng2-alfresco-datatable/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-alfresco-datatable/demo/src/vendor.ts

@@ -0,0 +1,26 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-alfresco-datatable';
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-alfresco-datatable/demo/systemjs.config.js

@@ -1,51 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'rxjs': 'npm:rxjs',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable'
-        },
-        // 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'
-            },
-            'ng2-translate': { defaultExtension: 'js' },
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': { main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-alfresco-datatable': { main: './bundles/ng2-alfresco-datatable.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-alfresco-datatable/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-alfresco-datatable/demo/tslint.json

@@ -3,15 +3,13 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
         "class-name": true,
         "comment-format": [
             true,
-      "check-space",
+            "check-space"
-      "check-lowercase"
         ],
         "curly": true,
         "eofline": true,
@@ -23,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -50,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -60,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-alfresco-datatable/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-alfresco-documentlist/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-alfresco-documentlist/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-alfresco-documentlist/demo/config/webpack.common.js

@@ -0,0 +1,134 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-alfresco-datatable',
+    'ng2-alfresco-documentlist'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-alfresco-documentlist/demo/config/webpack.dev.js

@@ -0,0 +1,37 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-alfresco-datatable$": path.resolve(__dirname, '../../ng2-alfresco-datatable/index.ts'),
+            "ng2-alfresco-documentlist$": path.resolve(__dirname, '../../ng2-alfresco-documentlist/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-alfresco-documentlist/demo/config/webpack.prod.js

@@ -0,0 +1,66 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-alfresco-datatable',
+    'ng2-alfresco-documentlist'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-alfresco-documentlist/demo/index.html

@@ -4,30 +4,8 @@
     <meta charset="UTF-8">
     <title>Alfresco Angular 2 Document List - Demo</title>
     <base href="./">
+
     <meta name="viewport" content="width=device-width, initial-scale=1">
-
-    <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- 1. Load libraries -->
-    <!-- Polyfill(s) for Safari (pre-10.x) -->
-    <script src="node_modules/intl/dist/Intl.min.js"></script>
-    <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
 <body>
 

ng2-components/ng2-alfresco-documentlist/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Angular2 Documentlist Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-alfresco-datatable ng2-alfresco-documentlist",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "dependencies": {
@@ -47,13 +44,58 @@
     "intl": "^1.2.5"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "rimraf": "2.5.2",
+    "angular2-template-loader": "^0.6.2",
-    "tslint": "3.15.1",
+    "autoprefixer": "^6.5.4",
-    "typescript": "^2.0.3",
+    "copy-webpack-plugin": "^4.0.1",
-    "wsrv": "^0.1.5"
+    "css-loader": "^0.23.1",
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   },
   "keywords": [
     "angular2",

ng2-components/ng2-alfresco-documentlist/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}

ng2-components/ng2-alfresco-documentlist/demo/src/vendor.ts

@@ -0,0 +1,26 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+
+// RxJS
+import 'rxjs';
+
+// hammerjs
+import 'hammerjs';
+
+// Alfresco
+import 'alfresco-js-api';
+import 'ng2-alfresco-documentlist';
+
+// Google Material Design Lite
+import 'material-design-lite/material.js';
+import 'material-design-lite/dist/material.orange-blue.min.css';
+import 'material-design-icons/iconfont/material-icons.css';
+
+// Polyfill(s) for dialogs
+require('script-loader!dialog-polyfill/dialog-polyfill');
+import 'dialog-polyfill/dialog-polyfill.css';

ng2-components/ng2-alfresco-documentlist/demo/systemjs.config.js

@@ -1,53 +0,0 @@
-/**
- * System configuration for Angular 2 samples
- * Adjust as necessary for your application needs.
- */
-(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: 'src',
-            // 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',
-            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
-            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
-            '@angular/animations/browser':'npm:@angular/animations/bundles/animations-browser.umd.js',
-            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
-
-            // other libraries
-            'rxjs': 'npm:rxjs',
-            'ng2-translate': 'npm:ng2-translate',
-            'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-alfresco-core': 'npm:ng2-alfresco-core',
-            'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable',
-            'ng2-alfresco-documentlist': 'npm:ng2-alfresco-documentlist'
-        },
-        // 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'
-            },
-            'ng2-translate': {defaultExtension: 'js'},
-            'alfresco-js-api': {main: './alfresco-js-api.js', defaultExtension: 'js'},
-            'ng2-alfresco-core': {main: './bundles/ng2-alfresco-core.js', defaultExtension: 'js'},
-            'ng2-alfresco-datatable': {main: './bundles/ng2-alfresco-datatable.js', defaultExtension: 'js'},
-            'ng2-alfresco-documentlist': {main: './bundles/ng2-alfresco-documentlist.js', defaultExtension: 'js'}
-        }
-    });
-})(this);

ng2-components/ng2-alfresco-documentlist/demo/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "baseUrl": ".",
         "target": "es5",
         "module": "commonjs",
         "moduleResolution": "node",
@@ -16,6 +17,7 @@
         "noFallthroughCasesInSwitch": true,
         "removeComments": true,
         "declaration": true,
+        "outDir": "./dist",
         "lib": [
             "es2015",
             "dom"
@@ -23,7 +25,9 @@
         "suppressImplicitAnyIndexErrors": true
     },
     "exclude": [
-        "node_modules"
+        "demo",
+        "node_modules",
+        "dist"
     ],
     "angularCompilerOptions": {
         "strictMetadataEmit": false,

ng2-components/ng2-alfresco-documentlist/demo/tslint.json

@@ -3,7 +3,6 @@
         "align": [
             true,
             "parameters",
-      "arguments",
             "statements"
         ],
         "ban": false,
@@ -22,14 +21,12 @@
         "interface-name": false,
         "jsdoc-format": true,
         "label-position": true,
-    "label-undefined": true,
         "max-line-length": [
             true,
             180
         ],
         "member-ordering": [
             true,
-      "public-before-private",
             "static-before-instance",
             "variables-before-functions"
         ],
@@ -49,7 +46,6 @@
         "no-construct": true,
         "no-constructor-vars": false,
         "no-debugger": true,
-    "no-duplicate-key": true,
         "no-duplicate-variable": true,
         "no-empty": false,
         "no-eval": true,
@@ -59,12 +55,11 @@
         "no-shadowed-variable": true,
         "no-switch-case-fall-through": true,
         "no-trailing-whitespace": true,
-    "no-unreachable": true,
         "no-unused-expression": true,
         "no-unused-variable": true,
         "no-use-before-declare": true,
         "no-var-keyword": true,
-    "no-var-requires": true,
+        "no-var-requires": false,
         "object-literal-sort-keys": false,
         "one-line": [
             true,

ng2-components/ng2-alfresco-documentlist/demo/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');

ng2-components/ng2-alfresco-login/.gitignore

@@ -8,7 +8,6 @@ dist
 src/**/*.js
 src/**/*.js.map
 src/**/*.d.ts
-demo/**/*.js
 demo/**/*.js.map
 demo/**/*.d.ts
 index.js

ng2-components/ng2-alfresco-login/demo/config/helpers.js

@@ -0,0 +1,10 @@
+var path = require('path');
+
+var _root = path.resolve(__dirname, '..');
+
+function root(args) {
+  args = Array.prototype.slice.call(arguments, 0);
+  return path.join.apply(path, [_root].concat(args));
+}
+
+exports.root = root;

ng2-components/ng2-alfresco-login/demo/config/webpack.common.js

@@ -0,0 +1,133 @@
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const ExtractTextPlugin = require("extract-text-webpack-plugin");
+const helpers = require('./helpers');
+const path = require('path');
+
+const alfrescoLibs = [
+    'ng2-alfresco-login'
+];
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'dist': './src/main.ts'
+    },
+
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'source-map-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.ts$/,
+                include: [helpers.root('src'), helpers.root('..')],
+                loader: [
+                    'ts-loader',
+                    'angular2-template-loader'
+                ],
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                loader: 'tslint-loader',
+                include: [helpers.root('src')],
+                options: {
+                    emitErrors: true
+                },
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                enforce: 'pre',
+                test: /\.ts$/,
+                use: 'source-map-loader',
+                exclude: [ /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader',
+                exclude: [ /node_modules/, /public/, /resources/, /dist/]
+            },
+            {
+                test: /\.css$/,
+                exclude: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: ExtractTextPlugin.extract({
+                    fallback: 'style-loader',
+                    use: 'css-loader?sourceMap'
+                })
+            },
+            {
+                test: /\.css$/,
+                include: [helpers.root('src'), helpers.root('../ng2-components')],
+                loader: 'raw-loader'
+            },
+            {
+                test: /\.component.scss$/,
+                use: ['to-string-loader', 'raw-loader', 'sass-loader']
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'file-loader?name=assets/[name].[hash].[ext]'
+            }
+        ]
+    },
+
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)@angular/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new HtmlWebpackPlugin({
+            template: './index.html'
+        }),
+
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `../ng2-components/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            }),
+            {
+                context: 'resources/i18n',
+                from: '**/*.json',
+                to: 'resources/i18n'
+            },
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: 'node_modules',
+                    from: `${lib}/src/i18n/*.json`,
+                    to: 'node_modules'
+                }
+            })
+        ]),
+
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['src', 'vendor', 'polyfills']
+        })
+    ],
+
+    devServer: {
+        contentBase: helpers.root('dist'),
+        compress: true,
+        port: 3000,
+        historyApiFallback: true,
+        host: '0.0.0.0',
+        inline: true
+    },
+
+    node: {
+        fs: 'empty'
+    }
+};

ng2-components/ng2-alfresco-login/demo/config/webpack.dev.js

@@ -0,0 +1,36 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const path = require('path');
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    resolve: {
+        alias: {
+            "ng2-alfresco-core$": path.resolve(__dirname, '../../ng2-alfresco-core/index.ts'),
+            "ng2-alfresco-login$": path.resolve(__dirname, '../../ng2-alfresco-login/index.ts')
+        },
+        extensions: ['.ts', '.js'],
+        modules: [path.resolve(__dirname, '../node_modules')]
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-alfresco-login/demo/config/webpack.prod.js

@@ -0,0 +1,65 @@
+const webpack = require('webpack');
+const webpackMerge = require('webpack-merge');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
+const helpers = require('./helpers');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+const alfrescoLibs = [
+    'ng2-alfresco-login'
+];
+
+module.exports = webpackMerge(commonConfig, {
+
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    resolve: {
+        extensions: ['.ts', '.js'],
+        modules: [helpers.root('node_modules')]
+    },
+
+    plugins: [
+        new CopyWebpackPlugin([
+            ... alfrescoLibs.map(lib => {
+                return {
+                    context: `node_modules/${lib}/bundles/assets/` ,
+                    from: '**/*',
+                    to: `assets/`
+                }
+            })
+        ]),
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            },
+            compress: {
+                warnings: false
+            },
+            output: {
+                comments: false
+            },
+            sourceMap: true
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+                'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});

ng2-components/ng2-alfresco-login/demo/index.html

@@ -6,34 +6,7 @@
     <title>Alfresco Angular 2 Login - Demo</title>
     <base href="./">
 
-    <!-- Google Material Design Lite -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="assets/material.orange-blue.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-    <!-- Polyfill(s) for Safari (pre-10.x) -->
-    <script src="node_modules/intl/dist/Intl.min.js"></script>
-    <script src="node_modules/intl/locale-data/jsonp/en.js"></script>
-
-    <!-- Polyfill(s) for older browsers -->
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
-    <script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
-
-    <!-- Polyfill(s) for dialogs -->
-    <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
-    <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
-
-    <!-- Modules  -->
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-        System.import('app').catch(function(err){ console.error(err); });
-    </script>
-
 </head>
 <body>
 

ng2-components/ng2-alfresco-login/demo/package.json

@@ -3,19 +3,16 @@
   "description": "Alfresco Angular2 Login Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
-  "main": "index.js",
   "scripts": {
+    "build": "rimraf dist && npm run webpack -- --config  config/webpack.prod.js --progress --profile --bail",
+    "build:dev": "rimraf dist && npm run webpack -- --config  config/webpack.dev.js --progress --profile --bail",
+    "start:dist": "wsrv -s dist/ -p 3000 -a 0.0.0.0",
+    "start": "npm run webpack-dev-server -- --config config/webpack.prod.js --progress  --content-base app/",
+    "start:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --progress --content-base app/",
     "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
-    "clean-build" : "rimraf 'src/{,**/}**.js' 'src/{,**/}**.js.map' 'src/{,**/}**.d.ts'",
+    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
-    "postinstall": "npm run build",
+    "webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "webpack": "webpack"
-    "server": "wsrv -o -s -l",
-    "build": "npm run tslint && npm run clean-build && npm run tsc",
-    "build:w": "npm run tslint && rimraf dist && npm run tsc:w",
-    "travis": "npm link ng2-alfresco-core ng2-alfresco-login",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts  -e '{,**/}**.d.ts'"
   },
   "license": "Apache-2.0",
   "contributors": [
@@ -76,12 +73,57 @@
     "ng2-alfresco-login": "1.5.0"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.33",
+    "@types/hammerjs": "^2.0.34",
-    "@types/node": "^6.0.42",
+    "@types/jasmine": "2.5.35",
-    "concurrently": "^2.2.0",
+    "@types/node": "6.0.45",
-    "rimraf": "2.5.2",
+    "angular2-template-loader": "^0.6.2",
-    "tslint": "^3.8.1",
+    "autoprefixer": "^6.5.4",
-    "typescript": "^2.0.3",
+    "copy-webpack-plugin": "^4.0.1",
-    "wsrv": "^0.1.5"
+    "css-loader": "^0.23.1",
+    "css-to-string-loader": "^0.1.2",
+    "cssnano": "^3.8.1",
+    "extract-text-webpack-plugin": "^2.0.0-rc.3",
+    "file-loader": "0.11.1",
+    "html-loader": "^0.4.4",
+    "html-webpack-plugin": "^2.28.0",
+    "istanbul-instrumenter-loader": "0.2.0",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "^0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.1.1",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "^2.2.2",
+    "karma-remap-istanbul": "^0.6.0",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-systemjs": "^0.16.0",
+    "karma-webpack": "^2.0.2",
+    "loader-utils": "^1.1.0",
+    "merge-stream": "^1.0.1",
+    "null-loader": "^0.1.1",
+    "package-json-merge": "0.0.1",
+    "raw-loader": "^0.5.1",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "^2.5.4",
+    "run-sequence": "^1.2.2",
+    "script-loader": "0.7.0",
+    "source-map-loader": "^0.1.6",
+    "style-loader": "^0.13.1",
+    "systemjs-builder": "^0.15.34",
+    "to-string-loader": "^1.1.4",
+    "traceur": "^0.0.91",
+    "ts-loader": "^2.0.0",
+    "ts-node": "^1.7.0",
+    "tslint": "^4.4.2",
+    "tslint-loader": "^3.3.0",
+    "typescript": "^2.1.6",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.3.0",
+    "webpack-merge": "2.6.1",
+    "wsrv": "^0.1.7",
+    "node-sass": "^3.13.1",
+    "sass-loader": "6.0.2"
   }
 }

ng2-components/ng2-alfresco-login/demo/src/polyfills.ts

@@ -0,0 +1,17 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+import 'intl';
+
+require('zone.js/dist/zone'); // IE 8-11
+require('element.scrollintoviewifneeded-polyfill'); // IE/FF
+
+if (process.env.ENV === 'production') {
+    // Production
+
+} else {
+    // Development
+
+    Error['stackTraceLimit'] = Infinity;
+
+    require('zone.js/dist/long-stack-trace-zone');
+}