fixed mostly entire gulp tasks

test remains...

build/babel-options.js

@@ -1,4 +1,15 @@
-var path = require('path');
+const path = require('path');
+
+const presets = [
+  [
+    '@babel/preset-env', {
+      'targets': {
+        'browsers': [ 'last 2 versions' ]
+      },
+      'loose': true
+    }
+  ]
+];
 
 exports.base = function() {
   return {
@@ -11,35 +22,36 @@ exports.base = function() {
     comments: false,
     compact: false,
     code: true,
-    presets: [['es2015', { loose: true }], 'stage-1'],
+    presets: presets,
     plugins: [
-      'syntax-flow',
-      'transform-decorators-legacy',
-      'transform-flow-strip-types'
+      '@babel/plugin-syntax-flow',
+      ['@babel/plugin-proposal-decorators', { legacy: true }],
+      ['@babel/plugin-proposal-class-properties', { loose: true }],
+      '@babel/plugin-transform-flow-strip-types'
     ]
   };
 };
 
 exports.commonjs = function() {
-  var options = exports.base();
-  options.plugins.push('transform-es2015-modules-commonjs');
+  const options = exports.base();
+  options.plugins.push('@babel/plugin-transform-modules-commonjs');
   return options;
 };
 
 exports.amd = function() {
-  var options = exports.base();
-  options.plugins.push('transform-es2015-modules-amd');
+  const options = exports.base();
+  options.plugins.push('@babel/plugin-transform-modules-amd');
   return options;
 };
 
 exports.system = function() {
-  var options = exports.base();
-  options.plugins.push('transform-es2015-modules-systemjs');
+  const options = exports.base();
+  options.plugins.push('@babel/plugin-transform-modules-systemjs');
   return options;
 };
 
 exports.es2015 = function() {
-  var options = exports.base();
-  options.presets = ['stage-1'];
+  const options = exports.base();
+  options.presets = presets;
   return options;
 };

build/paths.js

@@ -1,5 +1,5 @@
-var appRoot = 'src/';
-var outputRoot = 'dist/';
+const appRoot = 'src/';
+const outputRoot = 'dist/';
 
 module.exports = {
   root: appRoot,
@@ -8,7 +8,7 @@ module.exports = {
   css: appRoot + '**/*.css',
   style: 'styles/**/*.css',
   output: outputRoot,
-  doc: './doc',
+  doc: 'doc/',
   e2eSpecsSrc: 'test/e2e/src/*.js',
   e2eSpecsDist: 'test/e2e/dist/'
 };

build/tasks/build.js

@@ -1,54 +1,49 @@
-let gulp = require('gulp');
-let runSequence = require('run-sequence');
-let to5 = require('gulp-babel');
-let paths = require('../paths');
-let compilerOptions = require('../babel-options');
-let assign = Object.assign || require('object.assign');
+const assign = Object.assign || require('object.assign');
+const { clean } = require('./clean');
+const compilerOptions = require('../babel-options');
+const to5 = require('gulp-babel');
+const paths = require('../paths');
+const { dest, series, src } = require('gulp');
 
-gulp.task('build-html', function() {
-  return gulp.src(paths.html)
-    .pipe(gulp.dest(paths.output + 'es2015'))
-    .pipe(gulp.dest(paths.output + 'commonjs'))
-    .pipe(gulp.dest(paths.output + 'amd'))
-    .pipe(gulp.dest(paths.output + 'system'));
-});
+const buildHtml = function() {
+  return src(paths.html)
+    .pipe(dest(paths.output + 'es2015/'))
+    .pipe(dest(paths.output + 'commonjs/'))
+    .pipe(dest(paths.output + 'amd/'))
+    .pipe(dest(paths.output + 'system/'));
+};
 
-gulp.task('build-css', function() {
-  return gulp.src(paths.css)
-    .pipe(gulp.dest(paths.output + 'es2015'))
-    .pipe(gulp.dest(paths.output + 'commonjs'))
-    .pipe(gulp.dest(paths.output + 'amd'))
-    .pipe(gulp.dest(paths.output + 'system'));
-});
+const buildCss = function() {
+  return src(paths.css)
+    .pipe(dest(paths.output + 'es2015/'))
+    .pipe(dest(paths.output + 'commonjs/'))
+    .pipe(dest(paths.output + 'amd/'))
+    .pipe(dest(paths.output + 'system/'));
+};
 
-gulp.task('build-es2015', function() {
-  return gulp.src(paths.source)
+const buildEs2015 = function() {
+  return src(paths.source)
     .pipe(to5(assign({}, compilerOptions.es2015())))
-    .pipe(gulp.dest(paths.output + 'es2015'));
-});
+    .pipe(dest(paths.output + 'es2015/'));
+};
 
-gulp.task('build-commonjs', function() {
-  return gulp.src(paths.source)
+const buildCommonjs = function() {
+  return src(paths.source)
     .pipe(to5(assign({}, compilerOptions.commonjs())))
-    .pipe(gulp.dest(paths.output + 'commonjs'));
-});
+    .pipe(dest(paths.output + 'commonjs/'));
+};
 
-gulp.task('build-amd', function() {
-  return gulp.src(paths.source)
+const buildAmd = function() {
+  return src(paths.source)
     .pipe(to5(assign({}, compilerOptions.amd())))
-    .pipe(gulp.dest(paths.output + 'amd'));
-});
+    .pipe(dest(paths.output + 'amd/'));
+};
 
-gulp.task('build-system', function() {
-  return gulp.src(paths.source)
+const buildSystem = function() {
+  return src(paths.source)
     .pipe(to5(assign({}, compilerOptions.system())))
-    .pipe(gulp.dest(paths.output + 'system'));
-});
+    .pipe(dest(paths.output + 'system/'));
+};
 
-gulp.task('build', function(callback) {
-  return runSequence(
-    'clean',
-    ['build-html', 'build-css', 'build-es2015', 'build-commonjs', 'build-amd', 'build-system'],
-    callback
-  );
-});
+exports.build = buildEs2015;
+exports.build = series(clean, buildHtml, buildCss, buildEs2015, buildCommonjs, buildAmd, buildSystem);

build/tasks/dev.js

@@ -6,7 +6,7 @@ const args = require('../args');
 
 // updates dependencies in this folder
 // from folders in the parent directory
-exports['update-own-deps'] = function() {
+exports.updatOwnDeps = function() {
   return tools.updateOwnDependenciesFromLocalRepositories(args.depth);
 };
 
@@ -15,6 +15,6 @@ exports['update-own-deps'] = function() {
 // from where the command is executed,
 // then runs `npm install`
 // and `gulp build` for each repo
-exports['build-dev-env'] = function() {
+exports.buildDevEnv = function() {
   tools.buildDevEnv();
 };

build/tasks/doc.js

@@ -1,14 +1,19 @@
-var gulp = require('gulp');
-var tools = require('aurelia-tools');
-var paths = require('../paths');
-var yuidoc = require('gulp-yuidoc');
+const { dest, series, src } = require('gulp');
+const tools = require('aurelia-tools');
+const paths = require('../paths');
+const yuidoc = require('gulp-yuidoc');
 
-gulp.task('doc-generate', function(){
-  return gulp.src(paths.source)
+const docGenerate = function() {
+  return src(paths.source)
     .pipe(yuidoc.parser(null, 'api.json'))
-    .pipe(gulp.dest(paths.doc));
-});
+    .pipe(yuidoc.reporter())
+    .pipe(yuidoc.generator())
+    .pipe(dest(paths.doc));
+};
 
-gulp.task('doc', ['doc-generate'], function(){
+const doc = function() {
   tools.transformAPIModel(paths.doc);
-});
+};
+
+exports['docGenerate'] = docGenerate;
+exports.doc = series(docGenerate, doc);

build/tasks/lint.js

@@ -1,11 +1,11 @@
-var gulp = require('gulp');
-var paths = require('../paths');
-var eslint = require('gulp-eslint');
+const gulp = require('gulp');
+const paths = require('../paths');
+const eslint = require('gulp-eslint');
 
 // runs eslint on all .js files
-gulp.task('lint', function() {
+exports.lint = function() {
   return gulp.src(paths.source)
     .pipe(eslint())
     .pipe(eslint.format())
     .pipe(eslint.failOnError());
-});
+};

build/tasks/prepare-release.js

@@ -1,23 +1,23 @@
-var gulp = require('gulp');
-var runSequence = require('run-sequence');
-var paths = require('../paths');
-var changelog = require('conventional-changelog');
-var fs = require('fs');
-var bump = require('gulp-bump');
-var args = require('../args');
+const args = require('../args');
+const bump = require('gulp-bump');
+const changelog = require('conventional-changelog');
+const { dest, src } = require('gulp');
+const fs = require('fs');
+const paths = require('../paths');
+const { series } = require('gulp');
 
 // utilizes the bump plugin to bump the
 // semver for the repo
-gulp.task('bump-version', function() {
-  return gulp.src(['./package.json'])
+exports.bumpVersion = function() {
+  return src(['./package.json'])
     .pipe(bump({type: args.bump})) //major|minor|patch|prerelease
-    .pipe(gulp.dest('./'));
-});
+    .pipe(dest('./'));
+};
 
 // generates the CHANGELOG.md file based on commit
 // from git commit messages
 exports.changelog = function(callback) {
-  var pkg = JSON.parse(fs.readFileSync('./package.json', 'utf-8'));
+  const pkg = JSON.parse(fs.readFileSync('./package.json', 'utf-8'));
 
   return changelog({
     repository: pkg.repository.url,
@@ -27,14 +27,3 @@ exports.changelog = function(callback) {
     fs.writeFileSync(paths.doc + '/CHANGELOG.md', log);
   });
 };
-
-// calls the listed sequence of tasks in order
-exports['prepare-release'] = function(callback) {
-  return runSequence(
-    'build',
-    'lint',
-    'bump-version',
-    'changelog',
-    callback
-  );
-};

dist/amd/code-loader.js

@@ -0,0 +1,97 @@
+define(["exports", "aurelia-templating", "./content-loader", "./template"], function (_exports, _aureliaTemplating, _contentLoader, _template) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.SvgCodeLoader = void 0;
+
+  var _dec, _dec2, _class, _class2, _descriptor, _temp;
+
+  function _initializerDefineProperty(target, property, descriptor, context) { if (!descriptor) return; Object.defineProperty(target, property, { enumerable: descriptor.enumerable, configurable: descriptor.configurable, writable: descriptor.writable, value: descriptor.initializer ? descriptor.initializer.call(context) : void 0 }); }
+
+  function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
+
+  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+  function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) { var desc = {}; Object['ke' + 'ys'](descriptor).forEach(function (key) { desc[key] = descriptor[key]; }); desc.enumerable = !!desc.enumerable; desc.configurable = !!desc.configurable; if ('value' in desc || desc.initializer) { desc.writable = true; } desc = decorators.slice().reverse().reduce(function (desc, decorator) { return decorator(target, property, desc) || desc; }, desc); if (context && desc.initializer !== void 0) { desc.value = desc.initializer ? desc.initializer.call(context) : void 0; desc.initializer = undefined; } if (desc.initializer === void 0) { Object['define' + 'Property'](target, property, desc); desc = null; } return desc; }
+
+  function _initializerWarningHelper(descriptor, context) { throw new Error('Decorating class property failed. Please ensure that ' + 'proposal-class-properties is enabled and set to use loose mode. ' + 'To use proposal-class-properties in spec mode with decorators, wait for ' + 'the next major version of decorators in stage 2.'); }
+
+  var divTemplate = '';
+  var svgTemplate = "<rect repeat.for=\"codeRange of codeRanges()\" x=\"0\" y.bind=\"lineY($index)\" rx.bind=\"cornerRadius\" ry.bind=\"cornerRadius\" width.bind=\"width\" height.bind=\"lineHeight\">\n  <rect repeat.for=\"range of codeRange\" x.bind=\"range.start\" y.bind=\"lineY($parent.$index)\" rx.bind=\"cornerRadius\" ry.bind=\"cornerRadius\" width.bind=\"range.length\" height.bind=\"lineHeight\"/>\n</rect>";
+  var SvgCodeLoader = (_dec = (0, _aureliaTemplating.customElement)('svg-code-loader'), _dec2 = (0, _aureliaTemplating.inlineView)((0, _template.template)(divTemplate, svgTemplate)), (0, _aureliaTemplating.containerless)(_class = _dec(_class = _dec2(_class = (_class2 = (_temp = function (_SvgContentLoader) {
+    _inheritsLoose(SvgCodeLoader, _SvgContentLoader);
+
+    function SvgCodeLoader() {
+      var _this;
+
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+
+      _this = _SvgContentLoader.call.apply(_SvgContentLoader, [this].concat(args)) || this;
+
+      _initializerDefineProperty(_this, "maxCodeChunks", _descriptor, _assertThisInitialized(_assertThisInitialized(_this)));
+
+      return _this;
+    }
+
+    var _proto = SvgCodeLoader.prototype;
+
+    _proto.attached = function attached() {
+      var _SvgContentLoader$pro;
+
+      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+        args[_key2] = arguments[_key2];
+      }
+
+      _SvgContentLoader.prototype.attached && (_SvgContentLoader$pro = _SvgContentLoader.prototype.attached).call.apply(_SvgContentLoader$pro, [this].concat(args));
+      var clipPath = this.element.querySelector('clipPath');
+      var rects = Array.prototype.slice.call(this.element.querySelectorAll('clipPath > rect'));
+      clipPath.innerHTML = rects.map(function (rect) {
+        return rect.innerHTML;
+      }).join('');
+      this.addClass('svg-loader__inner--code');
+    };
+
+    _proto.codeRanges = function codeRanges() {
+      var _this2 = this;
+
+      return this.lineRange.map(function () {
+        var chunkNr = Math.ceil(Math.random() * 5);
+
+        var chunkRange = _this2.arrayRangeFromNumber(chunkNr).map(function () {
+          return Math.ceil(Math.random() * _this2.width);
+        }).sort(function (a, b) {
+          return a - b;
+        });
+
+        return chunkRange.map(function (value, i) {
+          if (i > 0) {
+            var length = value - chunkRange[i - 1] - _this2.lineHeight;
+            return {
+              start: chunkRange[i - 1] + _this2.lineHeight,
+              length: length > 0 ? length : 0
+            };
+          }
+
+          return {
+            start: 0,
+            length: value
+          };
+        });
+      });
+    };
+
+    return SvgCodeLoader;
+  }(_contentLoader.SvgContentLoader), _temp), (_descriptor = _applyDecoratedDescriptor(_class2.prototype, "maxCodeChunks", [_aureliaTemplating.bindable], {
+    configurable: true,
+    enumerable: true,
+    writable: true,
+    initializer: function initializer() {
+      return 3;
+    }
+  })), _class2)) || _class) || _class) || _class);
+  _exports.SvgCodeLoader = SvgCodeLoader;
+});