@uifabric/utilities - npm Package Compare versions

Comparing version 1.4.0 to 1.5.0

CHANGELOG.json

@@ -5,2 +5,16 @@ {
     {
+      "version": "1.5.0",
+      "tag": "@uifabric/utilities_v1.5.0",
+      "date": "Tue, 04 Apr 2017 15:18:51 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <[e-mail]>",
+            "commit": "086833bf4ae9f8672c83a2d5e85e07eaf22138ed",
+            "comment": "BaseComponent: added support for resolving `componentRef` automatically. Also added `_warnDeprecations` and `_warnMutualExclusion` helpers for warning on misuse."
+          }
+        ]
+      }
+    },
+    {
       "version": "1.4.0",
@@ -7,0 +21,0 @@ "tag": "@uifabric/utilities_v1.4.0",

CHANGELOG.md

 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 30 Mar 2017 21:04:29 GMT and should not be manually modified.
+This log was last generated on Tue, 04 Apr 2017 15:18:51 GMT and should not be manually modified.
 
+## 1.5.0
+Tue, 04 Apr 2017 15:18:51 GMT
+
+### Minor changes
+
+- BaseComponent: added support for resolving `componentRef` automatically. Also added `_warnDeprecations` and `_warnMutualExclusion` helpers for warning on misuse.
+
 ## 1.4.0
@@ -6,0 +13,0 @@ Thu, 30 Mar 2017 21:04:29 GMT

lib-amd/BaseComponent.d.ts

@@ -5,3 +5,7 @@ import * as React from 'react';
 import { IDisposable } from './IDisposable';
-export declare class BaseComponent<P, S> extends React.Component<P, S> {
+import { ISettingsMap } from './warn';
+export interface IBaseProps {
+    componentRef?: any;
+}
+export declare class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
     /**
@@ -12,2 +16,12 @@ * External consumers should override BaseComponent.onError to hook into error messages that occur from
     static onError: ((errorMessage?: string, ex?: any) => void);
+    /**
+     * Controls whether the componentRef prop will be resolved by this component instance. If you are
+     * implementing a passthrough (higher-order component), you would set this to false and pass through
+     * the props to the inner component, allowing it to resolve the componentRef.
+     *
+     * @protected
+     * @type {boolean}
+     * @memberOf BaseComponent
+     */
+    protected _shouldUpdateComponentRef: boolean;
     private __async;
@@ -17,11 +31,14 @@ private __events;
     private __resolves;
+    private __className;
     /**
      * BaseComponent constructor
      * @param {P} props The props for the component.
-     * @param {Object} deprecatedProps The map of deprecated prop names to new names, where the key is the old name and the
+     * @param {Object} context The context for the component.
      * value is the new name. If a prop is removed rather than renamed, leave the value undefined.
      */
-    constructor(props?: P, deprecatedProps?: {
-        [propName: string]: string;
-    });
+    constructor(props?: P, context?: any);
+    /** When the component will receive props, make sure the componentRef is updated. */
+    componentWillReceiveProps(newProps?: P, newContext?: any): void;
+    /** When the component has mounted, update the componentRef. */
+    componentDidMount(): void;
     /** If we have disposables, dispose them automatically on unmount. */
@@ -61,2 +78,26 @@ componentWillUnmount(): void;
     protected _resolveRef(refName: string): (ref: any) => any;
+    /**
+     * Updates the componentRef (by calling it with "this" when necessary.)
+     */
+    protected _updateComponentRef(currentProps: IBaseProps, newProps?: IBaseProps): void;
+    /**
+     * Warns when a deprecated props are being used.
+     *
+     * @protected
+     * @param {ISettingsMap<P>} deprecationMap The map of deprecations, where key is the prop name and the value is
+     * either null or a replacement prop name.
+     *
+     * @memberOf BaseComponent
+     */
+    protected _warnDeprecations(deprecationMap: ISettingsMap<P>): void;
+    /**
+     * Warns when props which are mutually exclusive with each other are both used.
+     *
+     * @protected
+     * @param {ISettingsMap<P>} mutuallyExclusiveMap The map of mutually exclusive props.
+     *
+     * @memberOf BaseComponent
+     */
+    protected _warnMutuallyExclusive(mutuallyExclusiveMap: ISettingsMap<P>): void;
 }
+export declare function nullRender(): any;

lib-amd/BaseComponent.js

@@ -11,3 +11,3 @@ var __extends = (this && this.__extends) || (function () {
 })();
-define(["require", "exports", "react", "./Async", "./EventGroup"], function (require, exports, React, Async_1, EventGroup_1) {
+define(["require", "exports", "react", "./Async", "./EventGroup", "./warn"], function (require, exports, React, Async_1, EventGroup_1, warn_1) {
     "use strict";
@@ -20,14 +20,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
          * @param {P} props The props for the component.
-         * @param {Object} deprecatedProps The map of deprecated prop names to new names, where the key is the old name and the
+         * @param {Object} context The context for the component.
          * value is the new name. If a prop is removed rather than renamed, leave the value undefined.
          */
-        function BaseComponent(props, deprecatedProps) {
-            var _this = _super.call(this, props) || this;
-            if (deprecatedProps) {
-                for (var propName in deprecatedProps) {
-                    if (propName in props) {
-                        _warnDeprecation(_this, propName, deprecatedProps[propName]);
-                    }
-                }
-            }
+        function BaseComponent(props, context) {
+            var _this = _super.call(this, props, context) || this;
+            _this.props = props;
+            _this._shouldUpdateComponentRef = true;
             _makeAllSafe(_this, BaseComponent.prototype, [
@@ -45,2 +40,10 @@ 'componentWillMount',
         }
+        /** When the component will receive props, make sure the componentRef is updated. */
+        BaseComponent.prototype.componentWillReceiveProps = function (newProps, newContext) {
+            this._updateComponentRef(this.props, newProps);
+        };
+        /** When the component has mounted, update the componentRef. */
+        BaseComponent.prototype.componentDidMount = function () {
+            this._updateComponentRef(undefined, this.props);
+        };
         /** If we have disposables, dispose them automatically on unmount. */
@@ -61,5 +64,8 @@ BaseComponent.prototype.componentWillUnmount = function () {
             get: function () {
-                var funcNameRegex = /function (.{1,})\(/;
-                var results = (funcNameRegex).exec((this).constructor.toString());
-                return (results && results.length > 1) ? results[1] : '';
+                if (!this.__className) {
+                    var funcNameRegex = /function (.{1,})\(/;
+                    var results = (funcNameRegex).exec((this).constructor.toString());
+                    this.__className = (results && results.length > 1) ? results[1] : '';
+                }
+                return this.__className;
             },
@@ -139,2 +145,41 @@ enumerable: true,
         };
+        /**
+         * Updates the componentRef (by calling it with "this" when necessary.)
+         */
+        BaseComponent.prototype._updateComponentRef = function (currentProps, newProps) {
+            if (newProps === void 0) { newProps = {}; }
+            if (this._shouldUpdateComponentRef &&
+                ((!currentProps && newProps.componentRef) ||
+                    (currentProps && currentProps.componentRef !== newProps.componentRef))) {
+                if (currentProps && currentProps.componentRef) {
+                    currentProps.componentRef(null);
+                }
+                if (newProps.componentRef) {
+                    newProps.componentRef(this);
+                }
+            }
+        };
+        /**
+         * Warns when a deprecated props are being used.
+         *
+         * @protected
+         * @param {ISettingsMap<P>} deprecationMap The map of deprecations, where key is the prop name and the value is
+         * either null or a replacement prop name.
+         *
+         * @memberOf BaseComponent
+         */
+        BaseComponent.prototype._warnDeprecations = function (deprecationMap) {
+            warn_1.warnDeprecations(this.className, this.props, deprecationMap);
+        };
+        /**
+         * Warns when props which are mutually exclusive with each other are both used.
+         *
+         * @protected
+         * @param {ISettingsMap<P>} mutuallyExclusiveMap The map of mutually exclusive props.
+         *
+         * @memberOf BaseComponent
+         */
+        BaseComponent.prototype._warnMutuallyExclusive = function (mutuallyExclusiveMap) {
+            warn_1.warnMutuallyExclusive(this.className, this.props, mutuallyExclusiveMap);
+        };
         return BaseComponent;
@@ -163,3 +208,3 @@ }(React.Component));
                     }
-                    if (classMethod) {
+                    if (classMethod !== prototypeMethod) {
                         retVal = classMethod.apply(this, arguments);
@@ -178,11 +223,2 @@ }
     }
-    function _warnDeprecation(obj, propertyName, newPropertyName) {
-        if (console && console.warn) {
-            var deprecationMessage = obj.className + " property '" + propertyName + "' was used but has been deprecated.";
-            if (newPropertyName) {
-                deprecationMessage += " Use '" + newPropertyName + "' instead.";
-            }
-            console.warn(deprecationMessage);
-        }
-    }
     BaseComponent.onError = function (errorMessage) {
@@ -192,4 +228,6 @@ console.error(errorMessage);
     };
+    function nullRender() { return null; }
+    exports.nullRender = nullRender;
 });
 
 //# sourceMappingURL=BaseComponent.js.map

lib-amd/scroll.scss.js

@@ -5,6 +5,6 @@ define(["require", "exports", "@microsoft/load-themed-styles"], function (require, exports, load_themed_styles_1) {
     var styles = {
-        msFabricScrollDisabled: 'msFabricScrollDisabled_577a715c',
+        msFabricScrollDisabled: 'msFabricScrollDisabled_fc90cbab',
     };
     exports.default = styles;
-    load_themed_styles_1.loadStyles([{ "rawString": ".msFabricScrollDisabled_577a715c{overflow:hidden!important}" }]);
+    load_themed_styles_1.loadStyles([{ "rawString": ".msFabricScrollDisabled_fc90cbab{overflow:hidden!important}" }]);
 });
@@ -11,0 +11,0 @@ /* tslint:enable */

lib/BaseComponent.d.ts

@@ -5,3 +5,7 @@ import * as React from 'react';
 import { IDisposable } from './IDisposable';
-export declare class BaseComponent<P, S> extends React.Component<P, S> {
+import { ISettingsMap } from './warn';
+export interface IBaseProps {
+    componentRef?: any;
+}
+export declare class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
     /**
@@ -12,2 +16,12 @@ * External consumers should override BaseComponent.onError to hook into error messages that occur from
     static onError: ((errorMessage?: string, ex?: any) => void);
+    /**
+     * Controls whether the componentRef prop will be resolved by this component instance. If you are
+     * implementing a passthrough (higher-order component), you would set this to false and pass through
+     * the props to the inner component, allowing it to resolve the componentRef.
+     *
+     * @protected
+     * @type {boolean}
+     * @memberOf BaseComponent
+     */
+    protected _shouldUpdateComponentRef: boolean;
     private __async;
@@ -17,11 +31,14 @@ private __events;
     private __resolves;
+    private __className;
     /**
      * BaseComponent constructor
      * @param {P} props The props for the component.
-     * @param {Object} deprecatedProps The map of deprecated prop names to new names, where the key is the old name and the
+     * @param {Object} context The context for the component.
      * value is the new name. If a prop is removed rather than renamed, leave the value undefined.
      */
-    constructor(props?: P, deprecatedProps?: {
-        [propName: string]: string;
-    });
+    constructor(props?: P, context?: any);
+    /** When the component will receive props, make sure the componentRef is updated. */
+    componentWillReceiveProps(newProps?: P, newContext?: any): void;
+    /** When the component has mounted, update the componentRef. */
+    componentDidMount(): void;
     /** If we have disposables, dispose them automatically on unmount. */
@@ -61,2 +78,26 @@ componentWillUnmount(): void;
     protected _resolveRef(refName: string): (ref: any) => any;
+    /**
+     * Updates the componentRef (by calling it with "this" when necessary.)
+     */
+    protected _updateComponentRef(currentProps: IBaseProps, newProps?: IBaseProps): void;
+    /**
+     * Warns when a deprecated props are being used.
+     *
+     * @protected
+     * @param {ISettingsMap<P>} deprecationMap The map of deprecations, where key is the prop name and the value is
+     * either null or a replacement prop name.
+     *
+     * @memberOf BaseComponent
+     */
+    protected _warnDeprecations(deprecationMap: ISettingsMap<P>): void;
+    /**
+     * Warns when props which are mutually exclusive with each other are both used.
+     *
+     * @protected
+     * @param {ISettingsMap<P>} mutuallyExclusiveMap The map of mutually exclusive props.
+     *
+     * @memberOf BaseComponent
+     */
+    protected _warnMutuallyExclusive(mutuallyExclusiveMap: ISettingsMap<P>): void;
 }
+export declare function nullRender(): any;

lib/BaseComponent.js

@@ -16,2 +16,3 @@ "use strict";
 var EventGroup_1 = require("./EventGroup");
+var warn_1 = require("./warn");
 var BaseComponent = (function (_super) {
@@ -22,14 +23,9 @@ __extends(BaseComponent, _super);
      * @param {P} props The props for the component.
-     * @param {Object} deprecatedProps The map of deprecated prop names to new names, where the key is the old name and the
+     * @param {Object} context The context for the component.
      * value is the new name. If a prop is removed rather than renamed, leave the value undefined.
      */
-    function BaseComponent(props, deprecatedProps) {
-        var _this = _super.call(this, props) || this;
-        if (deprecatedProps) {
-            for (var propName in deprecatedProps) {
-                if (propName in props) {
-                    _warnDeprecation(_this, propName, deprecatedProps[propName]);
-                }
-            }
-        }
+    function BaseComponent(props, context) {
+        var _this = _super.call(this, props, context) || this;
+        _this.props = props;
+        _this._shouldUpdateComponentRef = true;
         _makeAllSafe(_this, BaseComponent.prototype, [
@@ -47,2 +43,10 @@ 'componentWillMount',
     }
+    /** When the component will receive props, make sure the componentRef is updated. */
+    BaseComponent.prototype.componentWillReceiveProps = function (newProps, newContext) {
+        this._updateComponentRef(this.props, newProps);
+    };
+    /** When the component has mounted, update the componentRef. */
+    BaseComponent.prototype.componentDidMount = function () {
+        this._updateComponentRef(undefined, this.props);
+    };
     /** If we have disposables, dispose them automatically on unmount. */
@@ -63,5 +67,8 @@ BaseComponent.prototype.componentWillUnmount = function () {
         get: function () {
-            var funcNameRegex = /function (.{1,})\(/;
-            var results = (funcNameRegex).exec((this).constructor.toString());
-            return (results && results.length > 1) ? results[1] : '';
+            if (!this.__className) {
+                var funcNameRegex = /function (.{1,})\(/;
+                var results = (funcNameRegex).exec((this).constructor.toString());
+                this.__className = (results && results.length > 1) ? results[1] : '';
+            }
+            return this.__className;
         },
@@ -141,2 +148,41 @@ enumerable: true,
     };
+    /**
+     * Updates the componentRef (by calling it with "this" when necessary.)
+     */
+    BaseComponent.prototype._updateComponentRef = function (currentProps, newProps) {
+        if (newProps === void 0) { newProps = {}; }
+        if (this._shouldUpdateComponentRef &&
+            ((!currentProps && newProps.componentRef) ||
+                (currentProps && currentProps.componentRef !== newProps.componentRef))) {
+            if (currentProps && currentProps.componentRef) {
+                currentProps.componentRef(null);
+            }
+            if (newProps.componentRef) {
+                newProps.componentRef(this);
+            }
+        }
+    };
+    /**
+     * Warns when a deprecated props are being used.
+     *
+     * @protected
+     * @param {ISettingsMap<P>} deprecationMap The map of deprecations, where key is the prop name and the value is
+     * either null or a replacement prop name.
+     *
+     * @memberOf BaseComponent
+     */
+    BaseComponent.prototype._warnDeprecations = function (deprecationMap) {
+        warn_1.warnDeprecations(this.className, this.props, deprecationMap);
+    };
+    /**
+     * Warns when props which are mutually exclusive with each other are both used.
+     *
+     * @protected
+     * @param {ISettingsMap<P>} mutuallyExclusiveMap The map of mutually exclusive props.
+     *
+     * @memberOf BaseComponent
+     */
+    BaseComponent.prototype._warnMutuallyExclusive = function (mutuallyExclusiveMap) {
+        warn_1.warnMutuallyExclusive(this.className, this.props, mutuallyExclusiveMap);
+    };
     return BaseComponent;
@@ -165,3 +211,3 @@ }(React.Component));
                 }
-                if (classMethod) {
+                if (classMethod !== prototypeMethod) {
                     retVal = classMethod.apply(this, arguments);
@@ -180,11 +226,2 @@ }
 }
-function _warnDeprecation(obj, propertyName, newPropertyName) {
-    if (console && console.warn) {
-        var deprecationMessage = obj.className + " property '" + propertyName + "' was used but has been deprecated.";
-        if (newPropertyName) {
-            deprecationMessage += " Use '" + newPropertyName + "' instead.";
-        }
-        console.warn(deprecationMessage);
-    }
-}
 BaseComponent.onError = function (errorMessage) {
@@ -194,3 +231,5 @@ console.error(errorMessage);
 };
+function nullRender() { return null; }
+exports.nullRender = nullRender;
 
 //# sourceMappingURL=BaseComponent.js.map

lib/scroll.scss.js

@@ -6,8 +6,8 @@ "use strict";
 var styles = {
-    msFabricScrollDisabled: 'msFabricScrollDisabled_577a715c',
+    msFabricScrollDisabled: 'msFabricScrollDisabled_fc90cbab',
 };
 exports.default = styles;
-load_themed_styles_1.loadStyles([{ "rawString": ".msFabricScrollDisabled_577a715c{overflow:hidden!important}" }]);
+load_themed_styles_1.loadStyles([{ "rawString": ".msFabricScrollDisabled_fc90cbab{overflow:hidden!important}" }]);
 /* tslint:enable */ 
 
 //# sourceMappingURL=scroll.scss.js.map

package-deps.json

 {
   "files": {
     ".npmignore": "b632939d809a6ffdf3e0d52671f8b9cd6cbacda9",
-    "CHANGELOG.json": "4ea1fececa09f5e63fbb2f62b0448bd93b9d0fa1",
-    "CHANGELOG.md": "5defd8d1729d8b06ca541a09cd936e511b83c5bd",
+    "CHANGELOG.json": "fdaa58fdb15fe03ff46308bb43f75b24fd276297",
+    "CHANGELOG.md": "0ee3375937482346ad981db94e2139310ed774db",
     "LICENSE": "6981c887f0dc847bee9dc27ec25dec8d45bafa52",
@@ -10,7 +10,8 @@ "README.md": "291f12e214944abf5327922d9e15e3849e06aadc",
     "karma.config.js": "1cc76d92cb5cb15b4d9eff241573b0d47080342b",
-    "package.json": "abf17e0ee4a27f5a562150ee2656673a1674a107",
+    "package.json": "c9656eb61fa6528c5d342c3912db320def917245",
     "src/Async.ts": "5865101eeeb30e23a1f552c8a94269f70f962eb6",
     "src/AutoScroll.ts": "d41801bf26ba3ccd35e7b46f5c6baafbc04d6648",
     "src/BaseComponent.test.tsx": "7d7c1613aa974a04dde8315b2c6093cd01e986ed",
-    "src/BaseComponent.ts": "aab50ed15308006db517138c16280b22f0226e8a",
+    "src/BaseComponent.ts": "5d0e266066afad0127509ff219a3f8adb642116c",
+    "src/Customizer.tsx": "d007f57250690c85461352df0ca1bc961cd7124e",
     "src/DelayedRender.tsx": "6275cfe58093498d211774f190d617deed782d00",
@@ -30,2 +31,3 @@ "src/EventGroup.test.ts": "28e9ec056a09a093522bc793bfe2eb247eccc3e0",
     "src/css.ts": "d1bd5366a739385405b85dc0b524f1bf1b6d330d",
+    "src/customizable.tsx": "d207069a0b9dbceb0ed3d1bd7d0d3b54d6986035",
     "src/dom.test.ts": "f4e3ab7fa5c2b7bfba92a4ba80abe8e7213bdac9",
@@ -51,2 +53,4 @@ "src/dom.ts": "a01147f6cfdca71dec79571c20f368bb80ea90c0",
     "src/string.ts": "ca0b126d8a8f579f2c1175dadc19cdaae92aca99",
+    "src/warn.test.ts": "6333468a752e7706432d87ab22e364b208d88081",
+    "src/warn.ts": "561ab69cd4e81d49d92a3321a5c4bad32ba3d934",
     "tsconfig.json": "612e934cb485f3c3ecb3d9b3bf374830fbf3e5dd",
@@ -53,0 +57,0 @@ "tslint.json": "03cd68018ce168c1dd10ddb9f5b0b4ec72b2b55e"

package.json

 {
   "name": "@uifabric/utilities",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "Office UI Fabric utilities for building React components.",
@@ -38,3 +38,3 @@ "main": "lib/index.js",
     "tslint-microsoft-contrib": "^2.0.9",
-    "typescript": "~2.1.0"
+    "typescript": "^2.2.2"
   },
@@ -41,0 +41,0 @@ "dependencies": {},

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

528942

increased by9.78%

Number of package files

191

increased by10.4%

Lines of code

6079

increased by11.21%

No dependency changes