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

package/src/directive/repeat/repeat.js

@@ -1,4 +1,4 @@
-import { minErr, hashKey, isArrayLike } from "../../shared/utils.js";
+import { minErr, hashKey, isArrayLike, hasOwn } from "../../shared/utils.js";
 import { getBlockNodes } from "../../shared/dom.js";
 
 const NG_REMOVED = "$$NG_REMOVED";
@@ -28,7 +28,7 @@ ngRepeatDirective.$inject = ["$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 +78,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*$/,
@@ -167,10 +167,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);
               }
             }
@@ -281,9 +278,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/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;
       }
 

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/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,7 +86,7 @@ export function ngSwitchDirective($animate) {
 }
 
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngSwitchWhenDirective() {
   return {
@@ -96,8 +96,8 @@ export function ngSwitchWhenDirective() {
     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,7 +116,7 @@ export function ngSwitchWhenDirective() {
 }
 
 /**
- * @returns {import('../../types.js').Directive}
+ * @returns {import('../../interface.ts').Directive}
  */
 export function ngSwitchDefaultDirective() {
   return {

package/src/directive/transclude/transclude.js

@@ -20,10 +20,10 @@ 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 {

package/src/directive/validators/validators.js

@@ -5,13 +5,14 @@ import {
   minErr,
   isUndefined,
   isProxy,
+  hasOwn,
 } from "../../shared/utils.js";
 import { REGEX_STRING_REGEXP } from "./../attrs/attrs.js";
 import { startingTag } from "../../shared/dom.js";
 
 /**
  *
- * @param {string} ngRequired AngularJS expression. If it evaluates to `true`, it sets the
+ * @param {string} ngRequired AngularTS expression. If it evaluates to `true`, it sets the
  *                                `required` attribute to the element and adds the `required`
  *                                {@link ngModel.NgModelController#$validators `validator`}.
  *
@@ -20,7 +21,7 @@ import { startingTag } from "../../shared/dom.js";
  * It is most often used for {@link input `input`} and {@link select `select`} controls, but can also be
  * applied to custom controls.
  *
- * The directive sets the `required` attribute on the element if the AngularJS expression inside
+ * The directive sets the `required` attribute on the element if the AngularTS expression inside
  * `ngRequired` evaluates to true. A special directive for setting `required` is necessary because we
  * cannot use interpolation inside `required`. See the {@link guide/interpolation interpolation guide}
  * for more info.
@@ -35,8 +36,8 @@ import { startingTag } from "../../shared/dom.js";
 export const requiredDirective = [
   "$parse",
   /**
-   * @param {import("../../core/parse/parse.js").ParseService} $parse
-   * @returns {import("../../types.js").Directive}
+   * @param {import("../../core/parse/interface.ts").ParseService} $parse
+   * @returns {import("../../interface.ts").Directive}
    */
   ($parse) => ({
     restrict: "A",
@@ -45,24 +46,23 @@ export const requiredDirective = [
       /**
        * @param {import("../../core/scope/scope.js").Scope} scope
        * @param {Element} _elm
-       * @param {import("../../types.js").Attributes} attr
-       * @param {import("../../types.js").NgModelController} ctrl
+       * @param {import("../../core/compile/attributes.js").Attributes} attr
+       * @param {import("../../interface.ts").NgModelController} ctrl
        * @returns
        */
       (scope, _elm, attr, ctrl) => {
         if (!ctrl) return;
         // For boolean attributes like required, presence means true
         let value =
-          Object.prototype.hasOwnProperty.call(attr, "required") ||
-          $parse(attr.ngRequired)(scope);
+          hasOwn(attr, "required") || $parse(attr["ngRequired"])(scope);
 
-        if (!attr.ngRequired) {
+        if (!attr["ngRequired"]) {
           // force truthy in case we are on non input element
           // (input elements do this automatically for boolean attributes like required)
-          attr.required = true;
+          attr["required"] = true;
         }
 
-        ctrl.$validators.required = (_modelValue, viewValue) => {
+        ctrl["$validators"].required = (_modelValue, viewValue) => {
           return !value || !ctrl.$isEmpty(viewValue);
         };
 
@@ -77,7 +77,7 @@ export const requiredDirective = [
 ];
 
 /**
- * @param {String|RegExp} ngPattern AngularJS expression that must evaluate to a `RegExp` or a `String`
+ * @param {String|RegExp} ngPattern AngularTS expression that must evaluate to a `RegExp` or a `String`
  *                                      parsable into a `RegExp`, or a `RegExp` literal. See above for
  *                                      more details.
  *
@@ -88,7 +88,7 @@ export const requiredDirective = [
  *
  * The validator sets the `pattern` error key if the {@link ngModel.NgModelController#$viewValue `ngModel.$viewValue`}
  * does not match a RegExp which is obtained from the `ngPattern` attribute value:
- * - the value is an AngularJS expression:
+ * - the value is an AngularTS expression:
  *   - If the expression evaluates to a RegExp object, then this is used directly.
  *   - If the expression evaluates to a string, then it will be converted to a RegExp after wrapping it
  *     in `^` and `$` characters. For instance, `"abc"` will be converted to `new RegExp('^abc$')`.
@@ -118,8 +118,8 @@ export const requiredDirective = [
 export const patternDirective = [
   "$parse",
   /**
-   * @param {import("../../core/parse/parse.js").ParseService} $parse
-   * @returns {import("../../types.js").Directive}
+   * @param {import("../../core/parse/interface.ts").ParseService} $parse
+   * @returns {import("../../interface.ts").Directive}
    */
   ($parse) => {
     return {
@@ -129,33 +129,33 @@ export const patternDirective = [
         var patternExp;
         var parseFn;
 
-        if (tAttr.ngPattern) {
-          patternExp = tAttr.ngPattern;
+        if (tAttr["ngPattern"]) {
+          patternExp = tAttr["ngPattern"];
 
           // ngPattern might be a scope expression, or an inlined regex, which is not parsable.
           // We get value of the attribute here, so we can compare the old and the new value
           // in the observer to avoid unnecessary validations
           if (
-            tAttr.ngPattern.charAt(0) === "/" &&
-            REGEX_STRING_REGEXP.test(tAttr.ngPattern)
+            tAttr["ngPattern"].charAt(0) === "/" &&
+            REGEX_STRING_REGEXP.test(tAttr["ngPattern"])
           ) {
             parseFn = function () {
-              return tAttr.ngPattern;
+              return tAttr["ngPattern"];
             };
           } else {
-            parseFn = $parse(tAttr.ngPattern);
+            parseFn = $parse(tAttr["ngPattern"]);
           }
         }
 
         return function (scope, elm, attr, ctrl) {
           if (!ctrl) return;
 
-          var attrVal = attr.pattern;
+          var attrVal = attr["pattern"];
 
-          if (attr.ngPattern) {
+          if (attr["ngPattern"]) {
             attrVal = parseFn(scope);
           } else {
-            patternExp = attr.pattern;
+            patternExp = attr["pattern"];
           }
 
           var regexp = parsePatternAttr(attrVal, patternExp, elm);
@@ -168,13 +168,14 @@ export const patternDirective = [
               (oldRegexp && oldRegexp.toString()) !==
               (regexp && regexp.toString())
             ) {
-              ctrl.$validate();
+              ctrl["$validate"]();
             }
           });
 
-          ctrl.$validators.pattern = function (modelValue, viewValue) {
+          ctrl["$validators"]["pattern"] = function (modelValue, viewValue) {
             // HTML5 pattern constraint validates the input value, so we validate the viewValue
             return (
+              // @ts-ignore
               ctrl.$isEmpty(viewValue) ||
               isUndefined(regexp) ||
               regexp.test(viewValue)
@@ -187,7 +188,7 @@ export const patternDirective = [
 ];
 
 /**
- * @param {string} ngMaxlength AngularJS expression that must evaluate to a `Number` or `String`
+ * @param {string} ngMaxlength AngularTS expression that must evaluate to a `Number` or `String`
  *                                 parsable into a `Number`. Used as value for the `maxlength`
  *                                 {@link ngModel.NgModelController#$validators validator}.
  *
@@ -197,7 +198,7 @@ export const patternDirective = [
  * It is most often used for text-based {@link input `input`} controls, but can also be applied to custom text-based controls.
  *
  * The validator sets the `maxlength` error key if the {@link ngModel.NgModelController#$viewValue `ngModel.$viewValue`}
- * is longer than the integer obtained by evaluating the AngularJS expression given in the
+ * is longer than the integer obtained by evaluating the AngularTS expression given in the
  * `ngMaxlength` attribute value.
  *
  * <div class="alert alert-info">
@@ -219,8 +220,8 @@ export const patternDirective = [
 export const maxlengthDirective = [
   "$parse",
   /**
-   * @param {import("../../core/parse/parse.js").ParseService} $parse
-   * @returns {import("../../types.js").Directive}
+   * @param {import("../../core/parse/interface.ts").ParseService} $parse
+   * @returns {import("../../interface.ts").Directive}
    */
   ($parse) => ({
     restrict: "A",
@@ -229,14 +230,14 @@ export const maxlengthDirective = [
       /**
        * @param {import("../../core/scope/scope.js").Scope} scope
        * @param {*} _elm
-       * @param {import("../../types.js").Attributes} attr
-       * @param {import("../../types.js").NgModelController} ctrl
+       * @param {import("../../core/compile/attributes.js").Attributes} attr
+       * @param {import("../../interface.ts").NgModelController} ctrl
        * @returns
        */
       (scope, _elm, attr, ctrl) => {
         if (!ctrl) return;
 
-        let maxlength = attr.maxlength || $parse(attr.ngMaxlength)(scope);
+        let maxlength = attr["maxlength"] || $parse(attr["ngMaxlength"])(scope);
         let maxlengthParsed = parseLength(maxlength);
 
         attr.$observe("maxlength", (value) => {
@@ -246,7 +247,7 @@ export const maxlengthDirective = [
             ctrl.$validate();
           }
         });
-        ctrl.$validators.maxlength = function (modelValue, viewValue) {
+        ctrl["$validators"].maxlength = function (_modelValue, viewValue) {
           return (
             maxlengthParsed < 0 ||
             ctrl.$isEmpty(viewValue) ||
@@ -259,7 +260,7 @@ export const maxlengthDirective = [
 
 /**
  *
- * @param {string} ngMinlength AngularJS expression that must evaluate to a `Number` or `String`
+ * @param {string} ngMinlength AngularTS expression that must evaluate to a `Number` or `String`
  *                                 parsable into a `Number`. Used as value for the `minlength`
  *                                 {@link ngModel.NgModelController#$validators validator}.
  *
@@ -269,7 +270,7 @@ export const maxlengthDirective = [
  * It is most often used for text-based {@link input `input`} controls, but can also be applied to custom text-based controls.
  *
  * The validator sets the `minlength` error key if the {@link ngModel.NgModelController#$viewValue `ngModel.$viewValue`}
- * is shorter than the integer obtained by evaluating the AngularJS expression given in the
+ * is shorter than the integer obtained by evaluating the AngularTS expression given in the
  * `ngMinlength` attribute value.
  *
  * <div class="alert alert-info">

package/src/filters/filter.js

@@ -9,7 +9,7 @@ import {
 } from "../shared/utils.js";
 
 /**
- * @returns {function(Array, string|Object|function(any, number, []):[], function(any, any):boolean|boolean, string?): Array}
+ * @returns {import('../interface.ts').FilterFn}
  */
 export function filterFilter() {
   /**

package/src/filters/filters.js

@@ -227,7 +227,7 @@ export function formatNumber(
 }
 
 /**
- * @returns {function(Object, number?): Object}
+ * @returns {import('../interface.ts').FilterFn}
  */
 export function jsonFilter() {
   return function (object, spacing) {

package/src/filters/limit-to.js

@@ -8,7 +8,7 @@ import {
 } from "../shared/utils.js";
 
 /**
- * @returns {function(Array|ArrayLike|string|number, string|number, (string|number)?):Array|ArrayLike|string|number}
+ * @returns {import('../interface.ts').FilterFn}
  */
 export function limitToFilter() {
   /**

package/src/filters/order-by.js

@@ -9,6 +9,9 @@ import {
 
 orderByFilter.$inject = ["$parse"];
 
+/**
+ * @returns {import('../interface.ts').FilterFn}
+ */
 export function orderByFilter($parse) {
   return function (array, sortPredicate, reverseOrder, compareFn) {
     if (array == null) return array;

package/src/filters/order-by.md

@@ -69,7 +69,7 @@ expression {(Function|string|Array.<Function|string>)=}: A predicate (or list of
 Can be one of:
 
 Function: A getter function. This function will be called with each item as an argument and the return value will be used for sorting.
-string: An AngularJS expression. This expression will be evaluated against each item and the result will be used for sorting. For example, use 'label' to sort by a property called label or 'label.substring(0, 3)' to sort by the first 3 characters of the label property.
+string: An AngularTS expression. This expression will be evaluated against each item and the result will be used for sorting. For example, use 'label' to sort by a property called label or 'label.substring(0, 3)' to sort by the first 3 characters of the label property.
 (The result of a constant expression is interpreted as a property name to be used for comparison. For example, use '"special name"' (note the extra pair of quotes) to sort by a property called special name.)
 An expression can be optionally prefixed with + or - to control the sorting direction, ascending or descending. For example, '+label' or '-label'. If no property is provided, (e.g., '+' or '-'), the collection element itself is used in comparisons.
 Array: An array of function and/or string predicates. If a predicate cannot determine the relative order of two items, the next predicate is used as a tie-breaker.