@angular-wave/angular.ts 0.0.13 → 0.0.14

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@angular-wave/angular.ts",
   "license": "MIT",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "type": "module",
   "main": "dist/angular-ts.esm.js",
   "browser": "dist/angular-ts.umd.js",

package/src/exts/messages.md

@@ -518,33 +518,33 @@ _ {@link module:ngMessages Click here} to learn more about`ngMessages`and`ngMess
     _ @param {string} ngMessageExp|whenExp an expression value corresponding to the message key.
     _/
 
-                                                                                                /**
-                                                                                                * @ngdoc directive
-                                                                                                * @name ngMessageDefault
-                                                                                                * @restrict AE
-                                                                                                * @scope
-                                                                                                *
-                                                                                                * @description
-                                                                                                * `ngMessageDefault` is a directive with the purpose to show and hide a default message for
-                                                                                                * {@link directive:ngMessages}, when none of provided messages matches.
-                                                                                                *
-                                                                                                * More information about using `ngMessageDefault` can be found in the
-                                                                                                * {@link module:ngMessages `ngMessages` module documentation}.
-                                                                                                *
-                                                                                                * @usage
-                                                                                                * ```html
-                                                                                                * <!-- using attribute directives -->
-                                                                                                * <ANY ng-messages="expression" role="alert">
-                                                                                                *   <ANY ng-message="stringValue">...</ANY>
-                                                                                                *   <ANY ng-message="stringValue1, stringValue2, ...">...</ANY>
-                                                                                                *   <ANY ng-message-default>...</ANY>
-                                                                                                * </ANY>
-                                                                                                *
-                                                                                                * <!-- or by using element directives -->
-                                                                                                * <ng-messages for="expression" role="alert">
-                                                                                                *   <ng-message when="stringValue">...</ng-message>
-                                                                                                *   <ng-message when="stringValue1, stringValue2, ...">...</ng-message>
-                                                                                                *   <ng-message-default>...</ng-message-default>
-                                                                                                * </ng-messages>
-                                                                                                *
-                                                                                                */
+                                                                                                                        /**
+                                                                                                                        * @ngdoc directive
+                                                                                                                        * @name ngMessageDefault
+                                                                                                                        * @restrict AE
+                                                                                                                        * @scope
+                                                                                                                        *
+                                                                                                                        * @description
+                                                                                                                        * `ngMessageDefault` is a directive with the purpose to show and hide a default message for
+                                                                                                                        * {@link directive:ngMessages}, when none of provided messages matches.
+                                                                                                                        *
+                                                                                                                        * More information about using `ngMessageDefault` can be found in the
+                                                                                                                        * {@link module:ngMessages `ngMessages` module documentation}.
+                                                                                                                        *
+                                                                                                                        * @usage
+                                                                                                                        * ```html
+                                                                                                                        * <!-- using attribute directives -->
+                                                                                                                        * <ANY ng-messages="expression" role="alert">
+                                                                                                                        *   <ANY ng-message="stringValue">...</ANY>
+                                                                                                                        *   <ANY ng-message="stringValue1, stringValue2, ...">...</ANY>
+                                                                                                                        *   <ANY ng-message-default>...</ANY>
+                                                                                                                        * </ANY>
+                                                                                                                        *
+                                                                                                                        * <!-- or by using element directives -->
+                                                                                                                        * <ng-messages for="expression" role="alert">
+                                                                                                                        *   <ng-message when="stringValue">...</ng-message>
+                                                                                                                        *   <ng-message when="stringValue1, stringValue2, ...">...</ng-message>
+                                                                                                                        *   <ng-message-default>...</ng-message-default>
+                                                                                                                        * </ng-messages>
+                                                                                                                        *
+                                                                                                                        */

package/src/index.js

@@ -5,7 +5,6 @@ import { publishExternalAPI } from "./public";
  * @type {angular.IAngularStatic}
  */
 window.angular = new Angular();
-console.log(window.angular);
 
 publishExternalAPI();
 

package/src/router/adapter/directives/stateDirectives.js

@@ -4,23 +4,21 @@
  * These are the directives included in UI-Router for Angular 1.
  * These directives are used in templates to create viewports and link/navigate to states.
  *
- * @preferred @publicapi @module directives
- */ /** */
+ */
 import {
   extend,
   forEach,
   tail,
-  isString,
-  isObject,
-  isArray,
-  parse,
   noop,
   unnestR,
   identity,
   uniqR,
   inArray,
   removeFrom,
-} from "../../core/index";
+} from "../../core/common/common";
+import { isString, isObject, isArray } from "../../core/common/predicates";
+
+import { parse } from "../../core/common/hof";
 /** @hidden */
 function parseStateRef(ref) {
   const paramsOnly = ref.match(/^\s*({[^}]*})\s*$/);
@@ -52,12 +50,12 @@ function processedDef($state, $element, def) {
 function getTypeInfo(el) {
   // SVGAElement does not use the href attribute, but rather the 'xlinkHref' attribute.
   const isSvg =
-    Object.prototype.toString.call(el.prop("href")) ===
+    Object.prototype.toString.call(el[0].getAttribute("href")) ===
     "[object SVGAnimatedString]";
   const isForm = el[0].nodeName === "FORM";
   return {
     attr: isForm ? "action" : isSvg ? "xlink:href" : "href",
-    isAnchor: el.prop("tagName").toUpperCase() === "A",
+    isAnchor: el[0].nodeName === "A",
     clickable: !isForm,
   };
 }
@@ -252,8 +250,7 @@ function bindEvents(element, scope, hookFn, uiStateOpts) {
  * - Unlike the parameter values expression, the state name is not `$watch`ed (for performance reasons).
  * If you need to dynamically update the state being linked to, use the fully dynamic [[uiState]] directive.
  */
-let uiSrefDirective;
-uiSrefDirective = [
+export let uiSrefDirective = [
   "$uiRouter",
   "$timeout",
   function $StateRefDirective($uiRouter, $timeout) {
@@ -390,8 +387,7 @@ uiSrefDirective = [
  * - A middle-click, right-click, or ctrl-click is handled (natively) by the browser to open the href in a new window, for example.
  * ```
  */
-let uiStateDirective;
-uiStateDirective = [
+export let uiStateDirective = [
   "$uiRouter",
   "$timeout",
   function $StateRefDynamicDirective($uiRouter, $timeout) {
@@ -540,8 +536,7 @@ uiStateDirective = [
  *
  * - Multiple classes may be specified in a space-separated format: `ui-sref-active='class1 class2 class3'`
  */
-let uiSrefActiveDirective;
-uiSrefActiveDirective = [
+export let uiSrefActiveDirective = [
   "$state",
   "$stateParams",
   "$interpolate",
@@ -675,9 +670,11 @@ uiSrefActiveDirective = [
               (cls) => !inArray(addClasses, cls),
             );
             $scope.$evalAsync(() => {
-              addClasses.forEach((className) => $element.addClass(className));
+              addClasses.forEach((className) =>
+                $element[0].classList.add(className),
+              );
               removeClasses.forEach((className) =>
-                $element.removeClass(className),
+                $element[0].classList.remove(className),
               );
             });
           }
@@ -687,9 +684,3 @@ uiSrefActiveDirective = [
     };
   },
 ];
-window.angular
-  .module("ui.router.state")
-  .directive("uiSref", uiSrefDirective)
-  .directive("uiSrefActive", uiSrefActiveDirective)
-  .directive("uiSrefActiveEq", uiSrefActiveDirective)
-  .directive("uiState", uiStateDirective);

package/src/router/adapter/directives/viewDirective.js

@@ -1,21 +1,13 @@
-/** @publicapi @module directives */ /** */
-import {
-  extend,
-  filter,
-  isDefined,
-  isFunction,
-  isString,
-  kebobString,
-  noop,
-  parse,
-  ResolveContext,
-  tail,
-  trace,
-  unnestR,
-} from "../../core/index";
-
+import { extend, filter, tail, unnestR } from "../../core/common/common";
+import { isDefined, isFunction, isString } from "../../core/common/predicates";
+import { kebobString } from "../../core/common/strings";
+import { noop } from "../../core/common/common";
+import { parse } from "../../core/common/hof";
+import { ResolveContext } from "../../core/resolve/resolveContext";
+import { trace } from "../../core/common/trace";
 import { getLocals } from "../services";
 import { Ng1ViewConfig } from "../statebuilders/views";
+import { jqLite } from "../../../jqLite";
 /**
  * `ui-view`: A viewport directive which is filled in by a view from the active state.
  *
@@ -141,9 +133,7 @@ import { Ng1ViewConfig } from "../statebuilders/views";
  * });
  * ```
  */
-export let uiView;
-// eslint-disable-next-line prefer-const
-uiView = [
+export let uiView = [
   "$view",
   "$animate",
   "$uiViewScroll",
@@ -153,18 +143,18 @@ uiView = [
     function getRenderer() {
       return {
         enter: function (element, target, cb) {
-          if (angular.version.minor > 2) {
-            $animate.enter(element, null, target).then(cb);
-          } else {
-            $animate.enter(element, null, target, cb);
-          }
+          // if (angular.version.minor > 2) {
+          //$animate.enter(element, null, target).then(cb);
+          // } else {
+          $animate.enter(element, null, target, cb);
+          // }
         },
         leave: function (element, cb) {
-          if (angular.version.minor > 2) {
-            $animate.leave(element).then(cb);
-          } else {
-            $animate.leave(element, cb);
-          }
+          // if (angular.version.minor > 2) {
+          //$animate.leave(element).then(cb);
+          // } else {
+          $animate.leave(element, cb);
+          // }
         },
       };
     }
@@ -324,8 +314,13 @@ $ViewDirectiveFill.$inject = [
   "$view",
   "$q",
 ];
-/** @hidden */
-function $ViewDirectiveFill($compile, $controller, $transitions, $view, $q) {
+export function $ViewDirectiveFill(
+  $compile,
+  $controller,
+  $transitions,
+  $view,
+  $q,
+) {
   const getControllerAs = parse("viewDecl.controllerAs");
   const getResolveAs = parse("viewDecl.resolveAs");
   return {
@@ -338,14 +333,18 @@ function $ViewDirectiveFill($compile, $controller, $transitions, $view, $q) {
         const data = $element.data("$uiView");
         if (!data) {
           $element.html(initial);
-          $compile($element.contents())(scope);
+          $compile($element[0].contentDocument || $element[0].childNodes)(
+            scope,
+          );
           return;
         }
         const cfg = data.$cfg || { viewDecl: {}, getTemplate: noop };
         const resolveCtx = cfg.path && new ResolveContext(cfg.path);
         $element.html(cfg.getTemplate($element, resolveCtx) || initial);
         trace.traceUIViewFill(data.$uiView, $element.html());
-        const link = $compile($element.contents());
+        const link = $compile(
+          $element[0].contentDocument || $element[0].childNodes,
+        );
         const controller = cfg.controller;
         const controllerAs = getControllerAs(cfg);
         const resolveAs = getResolveAs(cfg);
@@ -386,7 +385,7 @@ function $ViewDirectiveFill($compile, $controller, $transitions, $view, $q) {
               .filter((el) => el && el.tagName && tagRegexp.exec(el.tagName));
             return (
               directiveEl &&
-              angular.element(directiveEl).data(`$${cfg.component}Controller`)
+              jqLite(directiveEl).data(`$${cfg.component}Controller`)
             );
           };
           const deregisterWatch = scope.$watch(
@@ -410,8 +409,6 @@ function $ViewDirectiveFill($compile, $controller, $transitions, $view, $q) {
   };
 }
 /** @hidden */
-const hasComponentImpl =
-  typeof angular.module("ui.router")["component"] === "function";
 /** @hidden incrementing id */
 let _uiCanExitId = 0;
 /** @hidden TODO: move these callbacks to $view and/or `/hooks/components.ts` or something */
@@ -425,10 +422,7 @@ function registerControllerCallbacks(
   // Call $onInit() ASAP
   if (
     isFunction(controllerInstance.$onInit) &&
-    !(
-      (cfg.viewDecl.component || cfg.viewDecl.componentProvider) &&
-      hasComponentImpl
-    )
+    !(cfg.viewDecl.component || cfg.viewDecl.componentProvider)
   ) {
     controllerInstance.$onInit();
   }
@@ -508,7 +502,3 @@ function registerControllerCallbacks(
     );
   }
 }
-window.angular
-  .module("ui.router.state")
-  .directive("uiView", uiView)
-  .directive("uiView", $ViewDirectiveFill);

package/src/router/adapter/services.js

@@ -100,7 +100,6 @@ export function runBlock($injector, $q, $uiRouter) {
 // $state service and $stateProvider
 // $urlRouter service and $urlRouterProvider
 export function getStateProvider() {
-  debugger;
   return extend(router.stateProvider, { $get: () => router.stateService });
 }
 

package/src/router/adapter/stateFilters.js

@@ -11,7 +11,7 @@
  * ```
  */
 $IsStateFilter.$inject = ["$state"];
-function $IsStateFilter($state) {
+export function $IsStateFilter($state) {
   const isFilter = function (state, params, options) {
     return $state.is(state, params, options);
   };
@@ -29,15 +29,10 @@ function $IsStateFilter($state) {
  * ```
  */
 $IncludedByStateFilter.$inject = ["$state"];
-function $IncludedByStateFilter($state) {
+export function $IncludedByStateFilter($state) {
   const includesFilter = function (state, params, options) {
     return $state.includes(state, params, options);
   };
   includesFilter.$stateful = true;
   return includesFilter;
 }
-window.angular
-  .module("ui.router.state")
-  .filter("isState", $IsStateFilter)
-  .filter("includedByState", $IncludedByStateFilter);
-export { $IsStateFilter, $IncludedByStateFilter };

package/src/router/adapter/templateFactory.js

@@ -154,7 +154,7 @@ export class TemplateFactory {
   makeComponentTemplate(uiView, context, component, bindings) {
     bindings = bindings || {};
     // Bind once prefix
-    const prefix = angular.version.minor >= 3 ? "::" : "";
+    const prefix = "::"; //angular.version.minor >= 3 ? "::" : "";
     // Convert to kebob name. Add x- prefix if the string starts with `x-` or `data-`
     const kebob = (camelCase) => {
       const kebobed = kebobString(camelCase);

package/src/router/adapter/viewScroll.js

@@ -1,7 +1,4 @@
-/** @publicapi @module ng1 */ /** */
-
-/** @hidden */
-function $ViewScrollProvider() {
+export function $ViewScrollProvider() {
   let useAnchorScroll = false;
   this.useAnchorScroll = function () {
     useAnchorScroll = true;
@@ -25,7 +22,3 @@ function $ViewScrollProvider() {
     },
   ];
 }
-
-window.angular
-  .module("ui.router.state")
-  .provider("$uiViewScroll", $ViewScrollProvider);

package/src/router/core/state/stateObject.js

@@ -1,4 +1,4 @@
-import { defaults, find, inherit } from "../common/common";
+import { defaults, find } from "../common/common";
 import { propEq } from "../common/hof";
 import { Glob } from "../common/glob";
 import { isObject, isFunction } from "../common/predicates";
@@ -25,7 +25,7 @@ export class StateObject {
     stateDecl = StateObject.isStateClass(stateDecl)
       ? new stateDecl()
       : stateDecl;
-    const state = inherit(inherit(stateDecl, StateObject.prototype));
+    const state = Object.setPrototypeOf(stateDecl, StateObject.prototype);
     stateDecl.$$state = () => state;
     state.self = stateDecl;
     state.__stateObjectCache = {
@@ -33,7 +33,7 @@ export class StateObject {
     };
     return state;
   }
-  /** @deprecated use State.create() */
+  // /** @deprecated use State.create() */
   constructor(config) {
     return StateObject.create(config || {});
   }

package/src/router/router.js

@@ -8,6 +8,14 @@ import {
 } from "./adapter/services";
 import { TemplateFactory } from "./adapter/templateFactory";
 import { trace } from "./core/common/trace";
+import { $ViewScrollProvider } from "./adapter/viewScroll";
+import { $IsStateFilter, $IncludedByStateFilter } from "./adapter/stateFilters";
+import {
+  uiSrefActiveDirective,
+  uiStateDirective,
+  uiSrefDirective,
+} from "./adapter/directives/stateDirectives";
+import { uiView, $ViewDirectiveFill } from "./adapter/directives/viewDirective";
 
 export function initRouter() {
   window.angular.module("ui.router.angular1", []);
@@ -35,16 +43,26 @@ export function initRouter() {
   mod_util.provider("$templateFactory", function () {
     return new TemplateFactory();
   });
-  mod_state.provider("$stateRegistry", getProviderFor("stateRegistry"));
-  mod_state.provider("$uiRouterGlobals", getProviderFor("globals"));
-  mod_state.provider("$transitions", getProviderFor("transitionService"));
-  mod_state.provider("$state", ["$uiRouterProvider", getStateProvider]);
-  mod_state.factory("$stateParams", [
-    "$uiRouter",
-    function StateParamse($uiRouter) {
-      return $uiRouter.globals.params;
-    },
-  ]);
+  mod_state
+    .provider("$stateRegistry", getProviderFor("stateRegistry"))
+    .provider("$uiRouterGlobals", getProviderFor("globals"))
+    .provider("$transitions", getProviderFor("transitionService"))
+    .provider("$state", ["$uiRouterProvider", getStateProvider])
+    .provider("$uiViewScroll", $ViewScrollProvider)
+    .factory("$stateParams", [
+      "$uiRouter",
+      function StateParamse($uiRouter) {
+        return $uiRouter.globals.params;
+      },
+    ])
+    .filter("isState", $IsStateFilter)
+    .filter("includedByState", $IncludedByStateFilter)
+    .directive("uiSref", uiSrefDirective)
+    .directive("uiSrefActive", uiSrefActiveDirective)
+    .directive("uiSrefActiveEq", uiSrefActiveDirective)
+    .directive("uiState", uiStateDirective)
+    .directive("uiView", uiView)
+    .directive("uiView", $ViewDirectiveFill);
   mod_main.factory("$view", function View() {
     return router.viewService;
   });

package/test/module-test.html

@@ -1,23 +1,26 @@
 <!doctype html>
 <html>
   <head>
+    <script></script>
+    <script type="module" src="../src/index.js"></script>
     <script>
       document.addEventListener("DOMContentLoaded", () => {
-        window.angular.module("test", ["ui.router"]);
+        var myApp = window.angular.module("test", ["ui.router"]);
+        myApp.config(function ($stateProvider) {
+          var helloState = {
+            name: "hello",
+            url: "/",
+            template: "<h3>hello world!</h3>",
+          };
+
+          $stateProvider.state(helloState);
+        });
       });
     </script>
-    <script type="module" src="../src/index.js"></script>
   </head>
   <body ng-app="test">
-    <div ng-init='list = [{ name: "x" }, { name: "y" }, { name: "z" }]'>
-      <label>Name:</label>
-      <input type="text" ng-model="yourName" placeholder="Enter a name here" />
-      <hr />
-      <h1>Hello {{yourName}}!</h1>
-
-      <ul ng-repeat="i in list">
-        <li>{{ i.name }}</li>
-      </ul>
-    </div>
+    {{ 2 + 2 }}
+    <a ui-sref="hello" ui-sref-active="active">Hello</a>
+    <ui-view></ui-view>
   </body>
 </html>

package/test/ng/directive/if.spec.js

@@ -103,7 +103,6 @@ describe("ngIf", () => {
 
     it("should destroy the child scope every time the expression evaluates to false", () => {
       $scope.value = true;
-      debugger;
       element.append($compile('<div ng-if="value"></div>')($scope));
       $scope.$apply();
 

package/test/original-test.html

@@ -1,21 +1,33 @@
 <!doctype html>
 <html>
   <head>
-    <script src="../legacy/build/angular.js"></script>
-  </head>
-  <body>
-    Test:
-    <my-component></my-component>
-    {{ 2 + 2 }}
-  </body>
+    <script src="../legacy/angular.js"></script>
+    <script src="//unpkg.com/@uirouter/angularjs/release/angular-ui-router.min.js"></script>
+    <script>
+      var myApp = angular.module("helloworld", ["ui.router"]);
+
+      myApp.config(function ($stateProvider) {
+        var helloState = {
+          name: "hello",
+          url: "/",
+          template: "<h3>hello world!</h3>",
+        };
 
-  <script>
-    document.addEventListener("DOMContentLoaded", () => {
-      window.angular.module("myModule", []).component("myComponent", {
-        template: "<div>ME</div>",
+        var aboutState = {
+          name: "about",
+          url: "/about",
+          template: "<h3>Its the UI-Router hello world app!</h3>",
+        };
+
+        $stateProvider.state(helloState);
+        $stateProvider.state(aboutState);
       });
-      window.angular.bootstrap(document, ["myModule"]);
-      //angularInit(document, window.angular.bootstrap);
-    });
-  </script>
+    </script>
+  </head>
+  <body ng-app="helloworld">
+    <a ui-sref="hello" ui-sref-active="active">Hello</a>
+    {{ 2 + 2}}
+    <ui-view></ui-view>
+    {{ 2 + 2}}
+  </body>
 </html>