@angular-wave/angular.ts 0.7.0-beta.0 → 0.7.1

package/src/directive/ref/ref.js

@@ -1,8 +1,13 @@
-import { getNodeName, minErr, directiveNormalize } from "../../shared/utils.js";
+import {
+  getNodeName,
+  minErr,
+  directiveNormalize,
+  hasOwn,
+} from "../../shared/utils.js";
 import { getCacheData } from "../../shared/dom.js";
 
 /**
- * The `ngRef` attribute tells AngularJS to assign the controller of a component (or a directive)
+ * The `ngRef` attribute tells AngularTS to assign the controller of a component (or a directive)
  * to the given property in the current scope.
  *
  * If the element with `ngRef` is destroyed `null` is assigned to the property.
@@ -14,7 +19,7 @@ import { getCacheData } from "../../shared/dom.js";
  *
  *
  * @element ANY
- * @param {string} ngRef property name - A valid AngularJS expression identifier to which the
+ * @param {string} ngRef property name - A valid AngularTS expression identifier to which the
  *                       controller or dom-wrapped DOM element will be bound.
  * @param {string=} ngRefRead read value - The name of a directive (or component) on this element,
  *                            or the special string `$element`. If a name is provided, `ngRef` will
@@ -47,7 +52,7 @@ export function ngRefDirective($parse) {
       return (scope, element, attrs) => {
         let refValue;
 
-        if (Object.prototype.hasOwnProperty.call(attrs, "ngRefRead")) {
+        if (hasOwn(attrs, "ngRefRead")) {
           if (attrs.ngRefRead === "$element") {
             refValue = element;
           } else {

package/src/directive/repeat/repeat.js

@@ -1,5 +1,6 @@
-import { minErr, hashKey, isArrayLike } from "../../shared/utils.js";
+import { minErr, hashKey, isArrayLike, hasOwn } from "../../shared/utils.js";
 import { getBlockNodes } from "../../shared/dom.js";
+import { $injectTokens } from "../../injection-tokens.js";
 
 const NG_REMOVED = "$$NG_REMOVED";
 const ngRepeatMinErr = minErr("ngRepeat");
@@ -23,12 +24,12 @@ const ngRepeatMinErr = minErr("ngRepeat");
 const VAR_OR_TUPLE_REGEX =
   /^(?:(\s*[$\w]+)|\(\s*([$\w]+)\s*,\s*([$\w]+)\s*\))$/;
 
-ngRepeatDirective.$inject = ["$animate"];
+ngRepeatDirective.$inject = [$injectTokens.$animate];
 
 /**
  * TODO // Add type for animate service
  * @param {*}  $animate
- * @returns {import("../../types.js").Directive}
+ * @returns {import("../../interface.ts").Directive}
  */
 export function ngRepeatDirective($animate) {
   function updateScope(
@@ -78,8 +79,8 @@ export function ngRepeatDirective($animate) {
     priority: 1000,
     terminal: true,
     compile: (_$element, $attr) => {
-      const expression = $attr.ngRepeat;
-      const hasAnimate = !!$attr.animate;
+      const expression = $attr["ngRepeat"];
+      const hasAnimate = !!$attr["animate"];
 
       let match = expression.match(
         /^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/,
@@ -137,15 +138,15 @@ export function ngRepeatDirective($animate) {
         let lastBlockMap = Object.create(null);
         // watch props
         $scope.$watch(rhs, (collection) => {
-          var index,
+          let index,
             length,
             previousNode = $element, // node that cloned nodes should be inserted after
             // initialized to the comment node anchor
-            nextNode,
-            // Same as lastBlockMap but it has the current state. It will become the
+            nextNode;
+          const // Same as lastBlockMap but it has the current state. It will become the
             // lastBlockMap on the next iteration.
-            nextBlockMap = Object.create(null),
-            collectionLength,
+            nextBlockMap = Object.create(null);
+          let collectionLength,
             key,
             value, // key/value of iteration
             trackById,
@@ -167,10 +168,7 @@ export function ngRepeatDirective($animate) {
             // if object, extract keys, in enumeration order, unsorted
             collectionKeys = [];
             for (const itemKey in collection) {
-              if (
-                Object.hasOwnProperty.call(collection, itemKey) &&
-                itemKey.charAt(0) !== "$"
-              ) {
+              if (hasOwn(collection, itemKey) && itemKey.charAt(0) !== "$") {
                 collectionKeys.push(itemKey);
               }
             }
@@ -214,7 +212,7 @@ export function ngRepeatDirective($animate) {
           }
 
           // remove leftover items
-          for (var blockKey in lastBlockMap) {
+          for (let blockKey in lastBlockMap) {
             block = lastBlockMap[blockKey];
             elementsToRemove = block.clone;
             if (hasAnimate) {
@@ -281,9 +279,11 @@ export function ngRepeatDirective($animate) {
                   if (hasAnimate) {
                     $animate.enter(clone, null, previousNode);
                   } else {
+                    // @ts-ignore
                     previousNode.after(clone);
                   }
 
+                  // @ts-ignore
                   previousNode = endNode;
                   // Note: We only need the first/last node of the cloned nodes.
                   // However, we need to keep the reference to the dom wrapper as it might be changed later

package/src/directive/repeat/repeat.md

@@ -44,14 +44,14 @@
 - However, there are a few limitations compared to array iteration:
 -
 - - The JavaScript specification does not define the order of keys
-- returned for an object, so AngularJS relies on the order returned by the browser
+- returned for an object, so AngularTS relies on the order returned by the browser
 - when running `for key in myObj`. Browsers generally follow the strategy of providing
 - keys in the order in which they were defined, although there are exceptions when keys are deleted
 - and reinstated. See the
 - [MDN page on `delete` for more info](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete#Cross-browser_notes).
 -
 - - `ngRepeat` will silently _ignore_ object keys starting with `$`, because
-- it's a prefix used by AngularJS for public (`$`) and private (`$$`) properties.
+- it's a prefix used by AngularTS for public (`$`) and private (`$$`) properties.
 -
 - - The built-in filters {@link ng.orderBy orderBy} and {@link ng.filter filter} do not work with
 - objects, and will throw an error if used with one.
@@ -293,7 +293,7 @@
 -     Note that the default id function does not support duplicate primitive values (`number`, `string`),
 -     but supports duplictae non-primitive values (`object`) that are *equal* in shape.
 -
--     *Custom Expression*: It is possible to use any AngularJS expression to compute the tracking
+-     *Custom Expression*: It is possible to use any AngularTS expression to compute the tracking
 -     id, for example with a function, or using a property on the collection items.
 -     `item in items track by item.id` is a typical pattern when the items have a unique identifier,
 -     e.g. database id. In this case the object identity does not matter. Two objects are considered

package/src/directive/script/script.js

@@ -2,15 +2,15 @@ scriptDirective.$inject = ["$templateCache"];
 
 /**
  * @param {import('../../core/cache/cache-factory').TemplateCache} $templateCache
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function scriptDirective($templateCache) {
   return {
     restrict: "E",
     terminal: true,
     compile(element, attr) {
-      if (attr.type === "text/ng-template") {
-        $templateCache.set(attr.id, element.innerText);
+      if (attr["type"] === "text/ng-template") {
+        $templateCache.set(attr["id"], element.innerText);
       }
     },
   };

package/src/directive/select/select.js

@@ -402,7 +402,7 @@ class SelectController {
 }
 
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function selectDirective() {
   return {
@@ -545,7 +545,7 @@ export function selectDirective() {
 // of dynamically created (and destroyed) option elements to their containing select
 // directive via its controller.
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 optionDirective.$inject = ["$interpolate"];
 export function optionDirective($interpolate) {

package/src/directive/select/select.md

@@ -5,7 +5,7 @@
 - @restrict E
 -
 - @description
-- HTML `select` element with AngularJS data-binding.
+- HTML `select` element with AngularTS data-binding.
 -
 - The `select` directive is used together with {@link ngModel `ngModel`} to provide data-binding
 - between the scope and the `<select>` control (including setting default values).
@@ -57,7 +57,7 @@
 - Chrome and Internet Explorer / Edge.
 -
 -
-- @param {string} ngModel Assignable AngularJS expression to data-bind to.
+- @param {string} ngModel Assignable AngularTS expression to data-bind to.
 - @param {string=} name Property name of the form under which the control is published.
 - @param {string=} multiple Allows multiple options to be selected. The selected values will be
 -     bound to the model as an array.
@@ -65,7 +65,7 @@
 - @param {string=} ngRequired Adds required attribute and required validation constraint to
 - the element when the ngRequired expression evaluates to true. Use ngRequired instead of required
 - when you want to data-bind to the required attribute.
-- @param {string=} ngChange AngularJS expression to be executed when selected option(s) changes due to user
+- @param {string=} ngChange AngularTS expression to be executed when selected option(s) changes due to user
 - interaction with the select element.
 - @param {string=} ngOptions sets the options that the select is populated with and defines what is
 - set on the model on selection. See {@link ngOptions `ngOptions`}.

package/src/directive/select/select.spec.js

@@ -1822,7 +1822,7 @@ describe("select", () => {
           await wait();
           let elems = element.querySelectorAll("option");
 
-          for (var i = 0; i < elems.length; i++) {
+          for (let i = 0; i < elems.length; i++) {
             elems[i][0].selected = true;
           }
           browserTrigger(element, "change");

package/src/directive/setter/setter.js

@@ -1,22 +1,24 @@
-ngSetterDirective.$inject = ["$parse"];
+ngSetterDirective.$inject = ["$parse", "$log"];
 /**
- * @returns {import('../../types.js').Directive}
+ * @param {import('../../core/parse/interface.ts').ParseService} $parse
+ * @param {import('../../services/log.js').LogService} $log
+ * @returns {import('../../interface.ts').Directive}
  */
-export function ngSetterDirective($parse) {
+export function ngSetterDirective($parse, $log) {
   return {
     restrict: "A",
     link(scope, element, attrs) {
-      const modelExpression = attrs.ngSetter;
+      const modelExpression = attrs["ngSetter"];
 
       if (!modelExpression) {
-        console.warn("ngSetter: Model expression is not provided.");
+        $log.warn("ngSetter: Model expression is not provided.");
         return;
       }
 
       const assignModel = $parse(modelExpression).assign;
 
       if (!assignModel) {
-        console.warn("ngSetter: Invalid model expression.");
+        $log.warn("ngSetter: Invalid model expression.");
         return;
       }
 
@@ -48,7 +50,7 @@ export function ngSetterDirective($parse) {
           characterData: true,
         });
       } else {
-        console.warn("ngSetter: Element is not a valid DOM node.");
+        $log.warn("ngSetter: Element is not a valid DOM node.");
         return;
       }
 

package/src/directive/setter/setter.spec.js

@@ -2,17 +2,18 @@ import { Angular } from "../../loader.js";
 import { wait } from "../../shared/test-utils.js";
 
 describe("setter", () => {
-  let $compile, $rootScope, $parse, observerSpy;
+  let $compile, $rootScope, $parse, observerSpy, $log;
 
   beforeEach(() => {
     window.angular = new Angular();
     angular.module("myModule", ["ng"]);
     angular
       .bootstrap(document.getElementById("app"), ["myModule"])
-      .invoke((_$compile_, _$rootScope_, _$parse_) => {
+      .invoke((_$compile_, _$rootScope_, _$parse_, _$log_) => {
         $compile = _$compile_;
         $rootScope = _$rootScope_;
         $parse = _$parse_;
+        $log = _$log_;
       });
     observerSpy = jasmine.createSpyObj("MutationObserver", [
       "observe",
@@ -42,12 +43,12 @@ describe("setter", () => {
   });
 
   it("should warn if no model expression is provided", async () => {
-    spyOn(console, "warn");
+    spyOn($log, "warn");
 
     $compile("<div ng-setter></div>")($rootScope);
     await wait();
 
-    expect(console.warn).toHaveBeenCalledWith(
+    expect($log.warn).toHaveBeenCalledWith(
       "ngSetter: Model expression is not provided.",
     );
   });

package/src/directive/show-hide/show-hide.js

@@ -5,7 +5,7 @@ const NG_HIDE_IN_PROGRESS_CLASS = "ng-hide-animate";
 
 ngShowDirective.$inject = ["$animate"];
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngShowDirective($animate) {
   return {
@@ -39,7 +39,7 @@ export function ngShowDirective($animate) {
 
 ngHideDirective.$inject = ["$animate"];
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngHideDirective($animate) {
   return {

package/src/directive/show-hide/show-hide.md

@@ -8,7 +8,7 @@
 - the `ngShow` attribute.
 -
 - The element is shown or hidden by removing or adding the `.ng-hide` CSS class onto the element.
-- The `.ng-hide` CSS class is predefined in AngularJS and sets the display style to none (using an
+- The `.ng-hide` CSS class is predefined in AngularTS and sets the display style to none (using an
 - `!important` flag). For CSP mode please add `angular-csp.css` to your HTML file (see
 - {@link ng.directive:ngCsp ngCsp}).
 -
@@ -97,7 +97,7 @@
   ```
 
 -
-- Keep in mind that, as of AngularJS version 1.3, there is no need to change the display property
+- Keep in mind that, as of AngularTS version 1.3, there is no need to change the display property
 - to block during animation states - ngAnimate will automatically handle the style toggling for you.
 -
 - @element ANY
@@ -138,7 +138,7 @@
 - the `ngHide` attribute.
 -
 - The element is shown or hidden by removing or adding the `.ng-hide` CSS class onto the element.
-- The `.ng-hide` CSS class is predefined in AngularJS and sets the display style to none (using an
+- The `.ng-hide` CSS class is predefined in AngularTS and sets the display style to none (using an
 - `!important` flag). For CSP mode please add `angular-csp.css` to your HTML file (see
 - {@link ng.directive:ngCsp ngCsp}).
 -
@@ -227,7 +227,7 @@
   ```
 
 -
-- Keep in mind that, as of AngularJS version 1.3, there is no need to change the display property
+- Keep in mind that, as of AngularTS version 1.3, there is no need to change the display property
 - to block during animation states - ngAnimate will automatically handle the style toggling for you.
 -
 - @element ANY

package/src/directive/style/style.js

@@ -1,12 +1,12 @@
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngStyleDirective() {
   return {
     restrict: "A",
     link: (scope, element, attr) => {
       let oldStyles;
-      scope.$watch(attr.ngStyle, (newStyles) => {
+      scope.$watch(attr["ngStyle"], (newStyles) => {
         if (oldStyles) {
           const oldKeys = Object.keys(oldStyles);
           for (let i = 0, length = oldKeys.length; i < length; i++) {

package/src/directive/style/style.spec.js

@@ -11,7 +11,7 @@ describe("ng-style", () => {
   beforeEach(() => {
     window.angular = new Angular();
     window.angular.module("myModule", ["ng"]);
-    var injector = createInjector(["myModule"]).invoke(
+    const injector = createInjector(["myModule"]).invoke(
       ($rootScope, _$compile_) => {
         $scope = $rootScope.$new();
         $compile = _$compile_;

package/src/directive/switch/switch.js

@@ -4,7 +4,7 @@ import { hasAnimate } from "../../shared/utils.js";
 ngSwitchDirective.$inject = ["$animate"];
 
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngSwitchDirective($animate) {
   return {
@@ -20,7 +20,7 @@ export function ngSwitchDirective($animate) {
       },
     ],
     link(scope, _element, attr, ngSwitchController) {
-      const watchExpr = attr.ngSwitch || attr.on;
+      const watchExpr = attr["ngSwitch"] || attr["on"];
       let selectedTranscludes = [];
       const selectedElements = [];
       const previousLeaveAnimations = [];
@@ -86,18 +86,18 @@ export function ngSwitchDirective($animate) {
 }
 
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngSwitchWhenDirective() {
   return {
     transclude: "element",
     terminal: true,
     priority: 1200,
-    restrict: "EA",
+
     require: "^ngSwitch",
     link(scope, element, attrs, ctrl, $transclude) {
-      const cases = attrs.ngSwitchWhen
-        .split(attrs.ngSwitchWhenSeparator)
+      const cases = attrs["ngSwitchWhen"]
+        .split(attrs["ngSwitchWhenSeparator"])
         .sort()
         .filter(
           // Filter duplicate cases
@@ -116,11 +116,10 @@ export function ngSwitchWhenDirective() {
 }
 
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngSwitchDefaultDirective() {
   return {
-    restrict: "EA",
     transclude: "element",
     terminal: true,
     priority: 1200,

package/src/directive/transclude/transclude.js

@@ -20,14 +20,13 @@ import { emptyElement, startingTag } from "../../shared/dom.js";
 const ngTranscludeMinErr = minErr("ngTransclude");
 export const ngTranscludeDirective = [
   "$compile",
+
   /**
-   *
    * @param {import("../../core/compile/compile.js").CompileFn} $compile
-   * @returns {import("../../types").Directive}
+   * @returns {import("../../interface.ts").Directive}
    */
   function ($compile) {
     return {
-      restrict: "EA",
       compile: function ngTranscludeCompile(tElement) {
         // Remove and cache any original content to act as a fallback
         const fallbackLinkFn = $compile(tElement.childNodes);