@progress/kendo-react-popup - npm Package Compare versions

Comparing version 0.3.0-dev.201802021152 to 0.3.0-dev.201802022204

dist/es/Popup.d.ts

@@ -49,2 +49,3 @@ /// <reference types="react" />
     private _appendTo;
+    private _anchorElement;
     private _alignService;
@@ -56,10 +57,15 @@ private _positionService;
     private _offset;
+    private _scrollableParents;
     constructor(props: PopupProps);
     componentWillReceiveProps(nextProps: PropsWithChildren): void;
-    render(): any;
-    private calculatePosition(anchorElement, nextProps);
+    componentWillUnmount(): void;
+    reposition(): void;
+    render(): React.ReactPortal | JSX.Element;
+    private calculatePosition(anchorElement, props);
     private position;
     private onOpened;
     private onClosing;
+    private attachRepositionHandlers();
+    private detachRepositionHandlers();
     private onClosed;
 }

dist/es/Popup.js

@@ -25,3 +25,3 @@ var __extends = (this && this.__extends) || (function () {
 import { Slide } from '@progress/kendo-react-animation';
-import { CollisionType, AlignPoint } from './util';
+import { CollisionType, AlignPoint, throttle, FRAME_DURATION } from './util';
 import { AlignService } from './services/alignService';
@@ -67,5 +67,7 @@ import { DOMService } from './services/domService';
         _this.onOpened = function () {
-            if (_this.props.show && _this._element) {
+            if (_this.props.show) {
+                _this._element = _this._element || getHtmlElement(_this);
                 _this._element.classList.add(ANIMATION_CONTAINER_SHOWN);
             }
+            _this.attachRepositionHandlers();
             if (_this.props.open) {
@@ -76,5 +78,6 @@ _this.props.open.call(undefined, { target: _this });
         _this.onClosing = function () {
-            if (!_this.props.show && _this._element) {
+            if (!_this.props.show) {
                 _this._element.classList.remove(ANIMATION_CONTAINER_SHOWN);
             }
+            _this.detachRepositionHandlers();
         };
@@ -91,20 +94,36 @@ _this.onClosed = function () {
         _this._positionService = new PositionService(_this._domService);
+        _this.onOpened = _this.onOpened.bind(_this);
+        _this.onClosing = _this.onClosing.bind(_this);
+        _this.reposition = throttle(_this.reposition.bind(_this), FRAME_DURATION);
         return _this;
     }
     Popup.prototype.componentWillReceiveProps = function (nextProps) {
-        this._element = getHtmlElement(this);
         this._appendTo = getHtmlElement(nextProps.appendTo);
-        var anchorElement = getHtmlElement(nextProps.anchor);
-        if (nextProps.show && anchorElement) {
-            var newPosition = this.calculatePosition(anchorElement, nextProps);
-            this._offset = newPosition.offset;
-            this._flipped = newPosition.flipped;
-        }
+        this._anchorElement = getHtmlElement(nextProps.anchor);
     };
+    Popup.prototype.componentWillUnmount = function () {
+        this.detachRepositionHandlers();
+        delete this._element;
+        delete this._anchorElement;
+        delete this._appendTo;
+    };
+    Popup.prototype.reposition = function () {
+        this.forceUpdate();
+    };
     Popup.prototype.render = function () {
         var _a = this.props, animate = _a.animate, children = _a.children, className = _a.className, popupClass = _a.popupClass, show = _a.show;
+        if (show) {
+            if (this._anchorElement) {
+                var newPosition = this.calculatePosition(this._anchorElement, this.props);
+                this._offset = newPosition.offset;
+                this._flipped = newPosition.flipped || false;
+            }
+            else {
+                this._offset = this.props.offset;
+                this._flipped = false;
+            }
+        }
         var direction = this._flipped && show ? 'up' : 'down';
         var transitionDuration = animate ? undefined : 0;
-        var offset = this._offset || {};
-        var style = Object.assign({}, this.props.style || {}, __assign({}, offset));
+        var style = Object.assign({}, this.props.style || {}, __assign({}, this._offset));
         var popup = (React.createElement(Slide, { componentChildClassName: classNames(popupClass, K_POPUP), className: classNames(className), onEntered: this.onOpened, onExiting: this.onClosing, onExited: this.onClosed, direction: direction, style: style, transitionEnterDuration: transitionDuration, transitionExitDuration: transitionDuration }, show ? children : null));
@@ -118,3 +137,3 @@ if (this._appendTo) {
     };
-    Popup.prototype.calculatePosition = function (anchorElement, nextProps) {
+    Popup.prototype.calculatePosition = function (anchorElement, props) {
         var root = document.createElement('div');
@@ -127,12 +146,27 @@ if (this._appendTo) {
         }
-        var style = Object.assign({}, nextProps.style || {}, { visibility: 'hidden' });
-        var innerClasses = { className: classNames(nextProps.popupClass, K_POPUP) };
-        var popup = (React.createElement("div", { className: classNames(ANIMATION_CONTAINER, nextProps.className), style: style }, React.Children.map(nextProps.children, function (child, index) {
+        var style = Object.assign({}, props.style || {}, { visibility: 'hidden' });
+        var innerClasses = { className: classNames(props.popupClass, K_POPUP) };
+        var popup = (React.createElement("div", { className: classNames(ANIMATION_CONTAINER, props.className), style: style }, React.Children.map(props.children, function (child, index) {
             return React.createElement("div", __assign({ key: index }, innerClasses), child);
         })));
         root.innerHTML = ReactDOMServer.renderToStaticMarkup(popup);
-        var newPosition = this.position(nextProps, anchorElement, root.firstChild);
+        var newPosition = this.position(props, anchorElement, root.firstChild);
         root.parentNode.removeChild(root);
         return newPosition;
     };
+    Popup.prototype.attachRepositionHandlers = function () {
+        var _this = this;
+        this.detachRepositionHandlers();
+        this._scrollableParents = this._domService.scrollableParents(this._anchorElement || this._element);
+        this._scrollableParents.map(function (p) { return p.addEventListener('scroll', _this.reposition); });
+        window.addEventListener('resize', this.reposition);
+    };
+    Popup.prototype.detachRepositionHandlers = function () {
+        var _this = this;
+        if (this._scrollableParents) {
+            this._scrollableParents.map(function (p) { return p.removeEventListener('scroll', _this.reposition); });
+            this._scrollableParents = undefined;
+        }
+        window.removeEventListener('resize', this.reposition);
+    };
     return Popup;
@@ -139,0 +173,0 @@ }(React.Component));

dist/es/services/alignService.js

@@ -23,3 +23,13 @@ import { eitherRect, removeStackingOffset } from '../util';
     AlignService.prototype.absoluteRect = function (anchor, element, offset) {
-        return this._dom.removeScroll(this._dom.addScroll(removeStackingOffset(eitherRect(this._dom.offset(anchor), offset), this._dom.stackingElementOffset(element)), this._dom.stackingElementScroll(element)), this.elementScrollPosition(anchor, element));
+        var dom = this._dom;
+        var rect = eitherRect(dom.offset(anchor), offset);
+        var stackingOffset = dom.stackingElementOffset(element);
+        var removedOffset = removeStackingOffset(rect, stackingOffset);
+        var stackingScroll = dom.stackingElementScroll(element);
+        var withScroll = dom.addScroll(removedOffset, stackingScroll);
+        var scrollPosition = this.elementScrollPosition(anchor, element);
+        var result = dom.removeScroll(withScroll, scrollPosition);
+        result.left += window.scrollX || window.pageXOffset;
+        result.top += window.scrollY || window.pageYOffset;
+        return result;
     };
@@ -26,0 +36,0 @@ AlignService.prototype.elementScrollPosition = function (anchor, element) {

dist/es/util.d.ts

@@ -75,1 +75,5 @@ import { ElementRect, OffsetPosition } from '@progress/kendo-popup-common';
 };
+/**
+ * @hidden
+ */
+export declare const throttle: (func: Function, wait: number, options?: any) => () => any;

dist/es/util.js

@@ -158,2 +158,44 @@ import { parents, siblingContainer } from '@progress/kendo-popup-common';
 };
+/**
+ * @hidden
+ */
+export var throttle = function (func, wait, options) {
+    if (options === void 0) { options = {}; }
+    var timeout, context, args, result;
+    var previous = 0;
+    options = options || {};
+    var later = function () {
+        previous = options.leading === false ? 0 : new Date().getTime();
+        timeout = null;
+        result = func.apply(context, args);
+        if (!timeout) {
+            context = args = null;
+        }
+    };
+    var throttled = function () {
+        var now = new Date().getTime();
+        if (!previous && options.leading === false) {
+            previous = now;
+        }
+        var remaining = wait - (now - previous);
+        context = this;
+        args = arguments;
+        if (remaining <= 0 || remaining > wait) {
+            if (timeout) {
+                clearTimeout(timeout);
+                timeout = null;
+            }
+            previous = now;
+            result = func.apply(context, args);
+            if (!timeout) {
+                context = args = null;
+            }
+        }
+        else if (!timeout && options.trailing !== false) {
+            timeout = setTimeout(later, remaining);
+        }
+        return result;
+    };
+    return throttled;
+};
 //# sourceMappingURL=util.js.map

dist/npm/Popup.d.ts

@@ -49,2 +49,3 @@ /// <reference types="react" />
     private _appendTo;
+    private _anchorElement;
     private _alignService;
@@ -56,10 +57,15 @@ private _positionService;
     private _offset;
+    private _scrollableParents;
     constructor(props: PopupProps);
     componentWillReceiveProps(nextProps: PropsWithChildren): void;
-    render(): any;
-    private calculatePosition(anchorElement, nextProps);
+    componentWillUnmount(): void;
+    reposition(): void;
+    render(): React.ReactPortal | JSX.Element;
+    private calculatePosition(anchorElement, props);
     private position;
     private onOpened;
     private onClosing;
+    private attachRepositionHandlers();
+    private detachRepositionHandlers();
     private onClosed;
 }

dist/npm/Popup.js

@@ -68,5 +68,7 @@ "use strict";
         _this.onOpened = function () {
-            if (_this.props.show && _this._element) {
+            if (_this.props.show) {
+                _this._element = _this._element || getHtmlElement(_this);
                 _this._element.classList.add(ANIMATION_CONTAINER_SHOWN);
             }
+            _this.attachRepositionHandlers();
             if (_this.props.open) {
@@ -77,5 +79,6 @@ _this.props.open.call(undefined, { target: _this });
         _this.onClosing = function () {
-            if (!_this.props.show && _this._element) {
+            if (!_this.props.show) {
                 _this._element.classList.remove(ANIMATION_CONTAINER_SHOWN);
             }
+            _this.detachRepositionHandlers();
         };
@@ -92,20 +95,36 @@ _this.onClosed = function () {
         _this._positionService = new positionService_1.PositionService(_this._domService);
+        _this.onOpened = _this.onOpened.bind(_this);
+        _this.onClosing = _this.onClosing.bind(_this);
+        _this.reposition = util_1.throttle(_this.reposition.bind(_this), util_1.FRAME_DURATION);
         return _this;
     }
     Popup.prototype.componentWillReceiveProps = function (nextProps) {
-        this._element = getHtmlElement(this);
         this._appendTo = getHtmlElement(nextProps.appendTo);
-        var anchorElement = getHtmlElement(nextProps.anchor);
-        if (nextProps.show && anchorElement) {
-            var newPosition = this.calculatePosition(anchorElement, nextProps);
-            this._offset = newPosition.offset;
-            this._flipped = newPosition.flipped;
-        }
+        this._anchorElement = getHtmlElement(nextProps.anchor);
     };
+    Popup.prototype.componentWillUnmount = function () {
+        this.detachRepositionHandlers();
+        delete this._element;
+        delete this._anchorElement;
+        delete this._appendTo;
+    };
+    Popup.prototype.reposition = function () {
+        this.forceUpdate();
+    };
     Popup.prototype.render = function () {
         var _a = this.props, animate = _a.animate, children = _a.children, className = _a.className, popupClass = _a.popupClass, show = _a.show;
+        if (show) {
+            if (this._anchorElement) {
+                var newPosition = this.calculatePosition(this._anchorElement, this.props);
+                this._offset = newPosition.offset;
+                this._flipped = newPosition.flipped || false;
+            }
+            else {
+                this._offset = this.props.offset;
+                this._flipped = false;
+            }
+        }
         var direction = this._flipped && show ? 'up' : 'down';
         var transitionDuration = animate ? undefined : 0;
-        var offset = this._offset || {};
-        var style = Object.assign({}, this.props.style || {}, __assign({}, offset));
+        var style = Object.assign({}, this.props.style || {}, __assign({}, this._offset));
         var popup = (React.createElement(kendo_react_animation_1.Slide, { componentChildClassName: classNames(popupClass, K_POPUP), className: classNames(className), onEntered: this.onOpened, onExiting: this.onClosing, onExited: this.onClosed, direction: direction, style: style, transitionEnterDuration: transitionDuration, transitionExitDuration: transitionDuration }, show ? children : null));
@@ -119,3 +138,3 @@ if (this._appendTo) {
     };
-    Popup.prototype.calculatePosition = function (anchorElement, nextProps) {
+    Popup.prototype.calculatePosition = function (anchorElement, props) {
         var root = document.createElement('div');
@@ -128,12 +147,27 @@ if (this._appendTo) {
         }
-        var style = Object.assign({}, nextProps.style || {}, { visibility: 'hidden' });
-        var innerClasses = { className: classNames(nextProps.popupClass, K_POPUP) };
-        var popup = (React.createElement("div", { className: classNames(ANIMATION_CONTAINER, nextProps.className), style: style }, React.Children.map(nextProps.children, function (child, index) {
+        var style = Object.assign({}, props.style || {}, { visibility: 'hidden' });
+        var innerClasses = { className: classNames(props.popupClass, K_POPUP) };
+        var popup = (React.createElement("div", { className: classNames(ANIMATION_CONTAINER, props.className), style: style }, React.Children.map(props.children, function (child, index) {
             return React.createElement("div", __assign({ key: index }, innerClasses), child);
         })));
         root.innerHTML = ReactDOMServer.renderToStaticMarkup(popup);
-        var newPosition = this.position(nextProps, anchorElement, root.firstChild);
+        var newPosition = this.position(props, anchorElement, root.firstChild);
         root.parentNode.removeChild(root);
         return newPosition;
     };
+    Popup.prototype.attachRepositionHandlers = function () {
+        var _this = this;
+        this.detachRepositionHandlers();
+        this._scrollableParents = this._domService.scrollableParents(this._anchorElement || this._element);
+        this._scrollableParents.map(function (p) { return p.addEventListener('scroll', _this.reposition); });
+        window.addEventListener('resize', this.reposition);
+    };
+    Popup.prototype.detachRepositionHandlers = function () {
+        var _this = this;
+        if (this._scrollableParents) {
+            this._scrollableParents.map(function (p) { return p.removeEventListener('scroll', _this.reposition); });
+            this._scrollableParents = undefined;
+        }
+        window.removeEventListener('resize', this.reposition);
+    };
     return Popup;
@@ -140,0 +174,0 @@ }(React.Component));

dist/npm/services/alignService.js

@@ -25,3 +25,13 @@ "use strict";
     AlignService.prototype.absoluteRect = function (anchor, element, offset) {
-        return this._dom.removeScroll(this._dom.addScroll(util_1.removeStackingOffset(util_1.eitherRect(this._dom.offset(anchor), offset), this._dom.stackingElementOffset(element)), this._dom.stackingElementScroll(element)), this.elementScrollPosition(anchor, element));
+        var dom = this._dom;
+        var rect = util_1.eitherRect(dom.offset(anchor), offset);
+        var stackingOffset = dom.stackingElementOffset(element);
+        var removedOffset = util_1.removeStackingOffset(rect, stackingOffset);
+        var stackingScroll = dom.stackingElementScroll(element);
+        var withScroll = dom.addScroll(removedOffset, stackingScroll);
+        var scrollPosition = this.elementScrollPosition(anchor, element);
+        var result = dom.removeScroll(withScroll, scrollPosition);
+        result.left += window.scrollX || window.pageXOffset;
+        result.top += window.scrollY || window.pageYOffset;
+        return result;
     };
@@ -28,0 +38,0 @@ AlignService.prototype.elementScrollPosition = function (anchor, element) {

dist/npm/util.d.ts

@@ -75,1 +75,5 @@ import { ElementRect, OffsetPosition } from '@progress/kendo-popup-common';
 };
+/**
+ * @hidden
+ */
+export declare const throttle: (func: Function, wait: number, options?: any) => () => any;

dist/npm/util.js

@@ -160,2 +160,44 @@ "use strict";
 };
+/**
+ * @hidden
+ */
+exports.throttle = function (func, wait, options) {
+    if (options === void 0) { options = {}; }
+    var timeout, context, args, result;
+    var previous = 0;
+    options = options || {};
+    var later = function () {
+        previous = options.leading === false ? 0 : new Date().getTime();
+        timeout = null;
+        result = func.apply(context, args);
+        if (!timeout) {
+            context = args = null;
+        }
+    };
+    var throttled = function () {
+        var now = new Date().getTime();
+        if (!previous && options.leading === false) {
+            previous = now;
+        }
+        var remaining = wait - (now - previous);
+        context = this;
+        args = arguments;
+        if (remaining <= 0 || remaining > wait) {
+            if (timeout) {
+                clearTimeout(timeout);
+                timeout = null;
+            }
+            previous = now;
+            result = func.apply(context, args);
+            if (!timeout) {
+                context = args = null;
+            }
+        }
+        else if (!timeout && options.trailing !== false) {
+            timeout = setTimeout(later, remaining);
+        }
+        return result;
+    };
+    return throttled;
+};
 //# sourceMappingURL=util.js.map

dist/systemjs/kendo-react-popup.js

@@ -1,1 +0,1 @@
-System.register("@progress/kendo-react-popup",["react","react-dom","classnames","prop-types","react-dom/server","@progress/kendo-react-animation","@progress/kendo-popup-common"],function(t){var e,n,o,i,r,l,s;function p(t){return t.__useDefault?t.default:t}return{setters:[function(t){e=p(t)},function(t){n=p(t)},function(t){o=p(t)},function(t){i=p(t)},function(t){r=p(t)},function(t){l=p(t)},function(t){s=p(t)}],execute:function(){!function(t){var e={};function n(o){if(e[o])return e[o].exports;var i=e[o]={exports:{},id:o,loaded:!1};return t[o].call(i.exports,i,i.exports,n),i.loaded=!0,i.exports}n.m=t,n.c=e,n.p="",n(0)}([function(e,n,o){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var i=o(1);n.Popup=i.default,function(e){for(var n in e)t(n,e[n])}(n)},function(t,e,n){"use strict";var o,i=this&&this.__extends||(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])},function(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}),r=this&&this.__assign||Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t};Object.defineProperty(e,"__esModule",{value:!0});var l=n(2),s=n(3),p=n(4),c=n(5),a=n(6),f=n(7),u=n(8),d=n(10),h=n(11),m=n(12),v="k-animation-container-shown",g="k-popup",y=function(t){return s.findDOMNode(t)},_=function(t){function e(e){var n=t.call(this,e)||this;return n.position=function(t,e,o){var i=t.anchorAlign,r=t.popupAlign,l=t.collision,s=t.offset,p=n._alignService.alignElement({anchor:e,element:o,elementAlign:r,anchorAlign:i,offset:s});return n._positionService.positionElement({anchor:e,anchorAlign:i,collisions:l,element:o,currentLocation:p,elementAlign:r})},n.onOpened=function(){n.props.show&&n._element&&n._element.classList.add(v),n.props.open&&n.props.open.call(void 0,{target:n})},n.onClosing=function(){!n.props.show&&n._element&&n._element.classList.remove(v)},n.onClosed=function(){n.props.close&&n.props.close.call(void 0,{target:n})},n._flipped=!1,n._offset=n.props.offset,n._domService=new h.DOMService,n._alignService=new d.AlignService(n._domService),n._positionService=new m.PositionService(n._domService),n}return i(e,t),e.prototype.componentWillReceiveProps=function(t){this._element=y(this),this._appendTo=y(t.appendTo);var e=y(t.anchor);if(t.show&&e){var n=this.calculatePosition(e,t);this._offset=n.offset,this._flipped=n.flipped}},e.prototype.render=function(){var t=this.props,e=t.animate,n=t.children,o=t.className,i=t.popupClass,p=t.show,a=this._flipped&&p?"up":"down",u=e?void 0:0,d=this._offset||{},h=Object.assign({},this.props.style||{},r({},d)),m=l.createElement(f.Slide,{componentChildClassName:c(i,g),className:c(o),onEntered:this.onOpened,onExiting:this.onClosing,onExited:this.onClosed,direction:a,style:h,transitionEnterDuration:u,transitionExitDuration:u},p?n:null);return this._appendTo?s.createPortal(m,this._appendTo):m},e.prototype.calculatePosition=function(t,e){var n=document.createElement("div");this._appendTo?this._appendTo.appendChild(n):t.parentNode&&t.parentNode.insertBefore(n,t.nextSibling);var o=Object.assign({},e.style||{},{visibility:"hidden"}),i={className:c(e.popupClass,g)},s=l.createElement("div",{className:c("k-animation-container",e.className),style:o},l.Children.map(e.children,function(t,e){return l.createElement("div",r({key:e},i),t)}));n.innerHTML=a.renderToStaticMarkup(s);var p=this.position(e,t,n.firstChild);return n.parentNode.removeChild(n),p},e}(l.Component);_.propTypes={anchor:function(t){var e=t.anchor;if(e&&"number"!=typeof e.nodeType&&!e.isReactComponent)return new Error("Invalid prop `anchor` supplied to `Kendo React Popup`. Validation failed.")},appendTo:function(t){var e=t.appendTo;if(e&&"number"!=typeof e.nodeType&&!e.isReactComponent)return new Error("Invalid prop `appendTo` supplied to `Kendo React Popup`. Validation failed.")},className:p.string,popupClass:p.string,collision:p.shape({horizontal:p.oneOf([u.CollisionType.fit,u.CollisionType.flip]),vertical:p.oneOf([u.CollisionType.fit,u.CollisionType.flip])}),anchorAlign:p.shape({horizontal:p.oneOf([u.AlignPoint.left,u.AlignPoint.center,u.AlignPoint.right]),vertical:p.oneOf([u.AlignPoint.top,u.AlignPoint.center,u.AlignPoint.bottom])}),popupAlign:p.shape({horizontal:p.oneOf([u.AlignPoint.left,u.AlignPoint.center,u.AlignPoint.right]),vertical:p.oneOf([u.AlignPoint.top,u.AlignPoint.center,u.AlignPoint.bottom])}),offset:p.shape({left:p.number,top:p.number}),children:p.oneOfType([p.element,p.node]),show:p.bool,animate:p.bool},_.defaultProps={collision:{horizontal:u.CollisionType.fit,vertical:u.CollisionType.flip},anchorAlign:{horizontal:u.AlignPoint.left,vertical:u.AlignPoint.bottom},popupAlign:{horizontal:u.AlignPoint.left,vertical:u.AlignPoint.top},offset:{left:-1e3,top:0},animate:!0,show:!1},e.default=_},function(t,n){t.exports=e},function(t,e){t.exports=n},function(t,e){t.exports=i},function(t,e){t.exports=o},function(t,e){t.exports=r},function(t,e){t.exports=l},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(9);e.eitherRect=function(t,e){return t||{height:0,left:e.left,top:e.top,width:0}},e.replaceOffset=function(t,e){return e?{height:t.height,left:e.left,top:e.top,width:t.width}:t},e.removeStackingOffset=function(t,e){return e?{height:t.height,left:t.left-e.left,top:t.top-e.top,width:t.width}:t},e.isDifferentOffset=function(t,e){var n=t.left,o=t.top,i=e.left,r=e.top;return Math.abs(n-i)>=1||Math.abs(o-r)>=1},e.isDocumentAvailable=function(){return"undefined"!=typeof document&&!!document.body},e.isWindowAvailable=function(){return"undefined"!=typeof window},e.hasBoundingRect=function(t){return!!t.getBoundingClientRect},e.OVERFLOW_REGEXP=/auto|scroll/;e.scrollableParents=function(t){var n=[];if(!e.isDocumentAvailable()||!e.isWindowAvailable())return n;for(var o,i,r=t.parentElement;r;)e.OVERFLOW_REGEXP.test((o=r,void 0,""+(i=window.getComputedStyle(o)).overflow+i.overflowX+i.overflowY))&&n.push(r),r=r.parentElement;return n.push(window),n},e.FRAME_DURATION=1e3/60,e.hasRelativeStackingContext=function(){if(!e.isDocumentAvailable())return!1;var t=document.createElement("div");t.style.transform="matrix(10, 0, 0, 10, 0, 0)",t.innerHTML='<div style="position: fixed; top: 10px;">child</div>',document.body.appendChild(t);var n=10!==t.children[0].getBoundingClientRect().top;return document.body.removeChild(t),n},e.HAS_RELATIVE_STACKING_CONTEXT=e.hasRelativeStackingContext(),e.zIndex=function(t,n){if(!t||!e.isDocumentAvailable()||!e.isWindowAvailable())return null;var i=o.siblingContainer(t,n);if(!i)return null;var r=[t].concat(o.parents(t,i)).reduce(function(t,e){var n=e.style.zIndex||window.getComputedStyle(e).zIndex,o=parseInt(n,10);return o>t?o:t},0);return r?r+1:null},e.noop=function(){},e.CollisionType={fit:"fit",flip:"flip"},e.AlignPoint={left:"left",center:"center",right:"right",bottom:"bottom",top:"top"}},function(t,e){t.exports=s},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(8),i=function(){function t(t){this._dom=t}return t.prototype.alignElement=function(t){var e=t.anchor,n=t.element,o=t.anchorAlign,i=t.elementAlign,r=t.offset,l=!this._dom.hasOffsetParent(n)?this.absoluteRect(e,n,r):this.relativeRect(e,n,r);return this._dom.align({anchorAlign:o,anchorRect:l,elementAlign:i,elementRect:this._dom.offset(n)})},t.prototype.absoluteRect=function(t,e,n){return this._dom.removeScroll(this._dom.addScroll(o.removeStackingOffset(o.eitherRect(this._dom.offset(t),n),this._dom.stackingElementOffset(e)),this._dom.stackingElementScroll(e)),this.elementScrollPosition(t,e))},t.prototype.elementScrollPosition=function(t,e){return t?{x:0,y:0}:this._dom.scrollPosition(e)},t.prototype.relativeRect=function(t,e,n){return o.eitherRect(this._dom.position(t,e),n)},t}();e.AlignService=i},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(9),i=n(8),r=function(){function t(){}return t.prototype.addOffset=function(t,e){return{left:t.left+e.left,top:t.top+e.top}},t.prototype.align=function(t){return o.align(t)},t.prototype.boundingOffset=function(t){return o.boundingOffset(t)},t.prototype.getWindow=function(){return i.isWindowAvailable()?window:null},t.prototype.isBodyOffset=function(t){return o.isBodyOffset(t)},t.prototype.hasOffsetParent=function(t){if(!t)return!1;var e=t.offsetParent;return e&&!("BODY"===e.nodeName&&"static"===window.getComputedStyle(e).position)},t.prototype.offset=function(t){return t?o.offset(t):null},t.prototype.staticOffset=function(t){if(!t)return null;var e=t.style,n=e.left,i=e.top;t.style.left="0px",t.style.top="0px";var r=o.offset(t);return t.style.left=n,t.style.top=i,r},t.prototype.position=function(t,e){if(!t||!e)return null;var n=o.siblingContainer(t,e);return o.positionWithScroll(t,n)},t.prototype.relativeOffset=function(t,e){return o.applyLocationOffset(this.offset(t),e,this.isBodyOffset(t))},t.prototype.addScroll=function(t,e){return o.addScroll(t,e)},t.prototype.removeScroll=function(t,e){return o.removeScroll(t,e)},t.prototype.restrictToView=function(t){return o.restrictToView(t)},t.prototype.scrollPosition=function(t){return o.scrollPosition(t)},t.prototype.scrollableParents=function(t){return i.scrollableParents(t)},t.prototype.stackingElementOffset=function(t){var e=this.getRelativeContextElement(t);return e?o.offset(e):null},t.prototype.stackingElementScroll=function(t){var e=this.getRelativeContextElement(t);return e?{x:e.scrollLeft,y:e.scrollTop}:{x:0,y:0}},t.prototype.stackingElementViewPort=function(t){var e=this.getRelativeContextElement(t);return e?{height:e.scrollHeight,width:e.scrollWidth}:null},t.prototype.getRelativeContextElement=function(t){if(!t||!i.HAS_RELATIVE_STACKING_CONTEXT)return null;for(var e=t.parentElement;e;){if("none"!==window.getComputedStyle(e).transform)return e;e=e.parentElement}return null},t.prototype.useRelativePosition=function(t){return!!this.getRelativeContextElement(t)},t.prototype.windowViewPort=function(t){return o.getWindowViewPort(t)},t.prototype.zIndex=function(t,e){return i.zIndex(t,e)},t.prototype.zoomLevel=function(){return i.isDocumentAvailable()&&i.isWindowAvailable()?parseFloat((document.documentElement.clientWidth/window.innerWidth).toFixed(2)):1},t.prototype.isZoomed=function(){return this.zoomLevel()>1},t}();e.DOMService=r},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(8),i=function(){function t(t){this._dom=t}return t.prototype.positionElement=function(t){var e=t.anchor,n=t.currentLocation,i=t.element,r=t.anchorAlign,l=t.elementAlign,s=t.collisions,p=this._dom,c=t.viewPort||p.stackingElementViewPort(i)||p.windowViewPort(i),a=o.eitherRect(p.offset(e),n),f=o.replaceOffset(p.staticOffset(i),n),u=this.elementRect(i,f),d=p.restrictToView({anchorAlign:r,anchorRect:a,collisions:s,elementAlign:l,elementRect:u,viewPort:c});return{flipped:d.flipped,offset:p.addOffset(f,d.offset)}},t.prototype.elementRect=function(t,e){return this._dom.removeScroll(e,this._dom.scrollPosition(t))},t}();e.PositionService=i}])}}});
+System.register("@progress/kendo-react-popup",["prop-types","classnames","react","react-dom","@progress/kendo-react-animation","react-dom/server","@progress/kendo-popup-common"],function(t){var e,n,o,i,r,l,s;function a(t){return t.__useDefault?t.default:t}return{setters:[function(t){e=a(t)},function(t){n=a(t)},function(t){o=a(t)},function(t){i=a(t)},function(t){r=a(t)},function(t){l=a(t)},function(t){s=a(t)}],execute:function(){!function(t){var e={};function n(o){if(e[o])return e[o].exports;var i=e[o]={exports:{},id:o,loaded:!1};return t[o].call(i.exports,i,i.exports,n),i.loaded=!0,i.exports}n.m=t,n.c=e,n.p="",n(0)}([function(e,n,o){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var i=o(1);n.Popup=i.default,function(e){for(var n in e)t(n,e[n])}(n)},function(t,e,n){"use strict";var o,i=this&&this.__extends||(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])},function(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}),r=this&&this.__assign||Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t};Object.defineProperty(e,"__esModule",{value:!0});var l=n(2),s=n(3),a=n(4),p=n(5),c=n(6),f=n(7),u=n(8),d=n(10),h=n(11),m=n(12),v="k-animation-container-shown",g="k-popup",y=function(t){return s.findDOMNode(t)},_=function(t){function e(e){var n=t.call(this,e)||this;return n.position=function(t,e,o){var i=t.anchorAlign,r=t.popupAlign,l=t.collision,s=t.offset,a=n._alignService.alignElement({anchor:e,element:o,elementAlign:r,anchorAlign:i,offset:s});return n._positionService.positionElement({anchor:e,anchorAlign:i,collisions:l,element:o,currentLocation:a,elementAlign:r})},n.onOpened=function(){n.props.show&&(n._element=n._element||y(n),n._element.classList.add(v)),n.attachRepositionHandlers(),n.props.open&&n.props.open.call(void 0,{target:n})},n.onClosing=function(){n.props.show||n._element.classList.remove(v),n.detachRepositionHandlers()},n.onClosed=function(){n.props.close&&n.props.close.call(void 0,{target:n})},n._flipped=!1,n._offset=n.props.offset,n._domService=new h.DOMService,n._alignService=new d.AlignService(n._domService),n._positionService=new m.PositionService(n._domService),n.onOpened=n.onOpened.bind(n),n.onClosing=n.onClosing.bind(n),n.reposition=u.throttle(n.reposition.bind(n),u.FRAME_DURATION),n}return i(e,t),e.prototype.componentWillReceiveProps=function(t){this._appendTo=y(t.appendTo),this._anchorElement=y(t.anchor)},e.prototype.componentWillUnmount=function(){this.detachRepositionHandlers(),delete this._element,delete this._anchorElement,delete this._appendTo},e.prototype.reposition=function(){this.forceUpdate()},e.prototype.render=function(){var t=this.props,e=t.animate,n=t.children,o=t.className,i=t.popupClass,a=t.show;if(a)if(this._anchorElement){var c=this.calculatePosition(this._anchorElement,this.props);this._offset=c.offset,this._flipped=c.flipped||!1}else this._offset=this.props.offset,this._flipped=!1;var u=this._flipped&&a?"up":"down",d=e?void 0:0,h=Object.assign({},this.props.style||{},r({},this._offset)),m=l.createElement(f.Slide,{componentChildClassName:p(i,g),className:p(o),onEntered:this.onOpened,onExiting:this.onClosing,onExited:this.onClosed,direction:u,style:h,transitionEnterDuration:d,transitionExitDuration:d},a?n:null);return this._appendTo?s.createPortal(m,this._appendTo):m},e.prototype.calculatePosition=function(t,e){var n=document.createElement("div");this._appendTo?this._appendTo.appendChild(n):t.parentNode&&t.parentNode.insertBefore(n,t.nextSibling);var o=Object.assign({},e.style||{},{visibility:"hidden"}),i={className:p(e.popupClass,g)},s=l.createElement("div",{className:p("k-animation-container",e.className),style:o},l.Children.map(e.children,function(t,e){return l.createElement("div",r({key:e},i),t)}));n.innerHTML=c.renderToStaticMarkup(s);var a=this.position(e,t,n.firstChild);return n.parentNode.removeChild(n),a},e.prototype.attachRepositionHandlers=function(){var t=this;this.detachRepositionHandlers(),this._scrollableParents=this._domService.scrollableParents(this._anchorElement||this._element),this._scrollableParents.map(function(e){return e.addEventListener("scroll",t.reposition)}),window.addEventListener("resize",this.reposition)},e.prototype.detachRepositionHandlers=function(){var t=this;this._scrollableParents&&(this._scrollableParents.map(function(e){return e.removeEventListener("scroll",t.reposition)}),this._scrollableParents=void 0),window.removeEventListener("resize",this.reposition)},e}(l.Component);_.propTypes={anchor:function(t){var e=t.anchor;if(e&&"number"!=typeof e.nodeType&&!e.isReactComponent)return new Error("Invalid prop `anchor` supplied to `Kendo React Popup`. Validation failed.")},appendTo:function(t){var e=t.appendTo;if(e&&"number"!=typeof e.nodeType&&!e.isReactComponent)return new Error("Invalid prop `appendTo` supplied to `Kendo React Popup`. Validation failed.")},className:a.string,popupClass:a.string,collision:a.shape({horizontal:a.oneOf([u.CollisionType.fit,u.CollisionType.flip]),vertical:a.oneOf([u.CollisionType.fit,u.CollisionType.flip])}),anchorAlign:a.shape({horizontal:a.oneOf([u.AlignPoint.left,u.AlignPoint.center,u.AlignPoint.right]),vertical:a.oneOf([u.AlignPoint.top,u.AlignPoint.center,u.AlignPoint.bottom])}),popupAlign:a.shape({horizontal:a.oneOf([u.AlignPoint.left,u.AlignPoint.center,u.AlignPoint.right]),vertical:a.oneOf([u.AlignPoint.top,u.AlignPoint.center,u.AlignPoint.bottom])}),offset:a.shape({left:a.number,top:a.number}),children:a.oneOfType([a.element,a.node]),show:a.bool,animate:a.bool},_.defaultProps={collision:{horizontal:u.CollisionType.fit,vertical:u.CollisionType.flip},anchorAlign:{horizontal:u.AlignPoint.left,vertical:u.AlignPoint.bottom},popupAlign:{horizontal:u.AlignPoint.left,vertical:u.AlignPoint.top},offset:{left:-1e3,top:0},animate:!0,show:!1},e.default=_},function(t,e){t.exports=o},function(t,e){t.exports=i},function(t,n){t.exports=e},function(t,e){t.exports=n},function(t,e){t.exports=l},function(t,e){t.exports=r},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(9);e.eitherRect=function(t,e){return t||{height:0,left:e.left,top:e.top,width:0}},e.replaceOffset=function(t,e){return e?{height:t.height,left:e.left,top:e.top,width:t.width}:t},e.removeStackingOffset=function(t,e){return e?{height:t.height,left:t.left-e.left,top:t.top-e.top,width:t.width}:t},e.isDifferentOffset=function(t,e){var n=t.left,o=t.top,i=e.left,r=e.top;return Math.abs(n-i)>=1||Math.abs(o-r)>=1},e.isDocumentAvailable=function(){return"undefined"!=typeof document&&!!document.body},e.isWindowAvailable=function(){return"undefined"!=typeof window},e.hasBoundingRect=function(t){return!!t.getBoundingClientRect},e.OVERFLOW_REGEXP=/auto|scroll/;e.scrollableParents=function(t){var n=[];if(!e.isDocumentAvailable()||!e.isWindowAvailable())return n;for(var o,i,r=t.parentElement;r;)e.OVERFLOW_REGEXP.test((o=r,void 0,""+(i=window.getComputedStyle(o)).overflow+i.overflowX+i.overflowY))&&n.push(r),r=r.parentElement;return n.push(window),n},e.FRAME_DURATION=1e3/60,e.hasRelativeStackingContext=function(){if(!e.isDocumentAvailable())return!1;var t=document.createElement("div");t.style.transform="matrix(10, 0, 0, 10, 0, 0)",t.innerHTML='<div style="position: fixed; top: 10px;">child</div>',document.body.appendChild(t);var n=10!==t.children[0].getBoundingClientRect().top;return document.body.removeChild(t),n},e.HAS_RELATIVE_STACKING_CONTEXT=e.hasRelativeStackingContext(),e.zIndex=function(t,n){if(!t||!e.isDocumentAvailable()||!e.isWindowAvailable())return null;var i=o.siblingContainer(t,n);if(!i)return null;var r=[t].concat(o.parents(t,i)).reduce(function(t,e){var n=e.style.zIndex||window.getComputedStyle(e).zIndex,o=parseInt(n,10);return o>t?o:t},0);return r?r+1:null},e.noop=function(){},e.CollisionType={fit:"fit",flip:"flip"},e.AlignPoint={left:"left",center:"center",right:"right",bottom:"bottom",top:"top"},e.throttle=function(t,e,n){var o,i,r,l;void 0===n&&(n={});var s=0;n=n||{};var a=function(){s=!1===n.leading?0:(new Date).getTime(),o=null,l=t.apply(i,r),o||(i=r=null)};return function(){var p=(new Date).getTime();s||!1!==n.leading||(s=p);var c=e-(p-s);return i=this,r=arguments,c<=0||c>e?(o&&(clearTimeout(o),o=null),s=p,l=t.apply(i,r),o||(i=r=null)):o||!1===n.trailing||(o=setTimeout(a,c)),l}}},function(t,e){t.exports=s},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(8),i=function(){function t(t){this._dom=t}return t.prototype.alignElement=function(t){var e=t.anchor,n=t.element,o=t.anchorAlign,i=t.elementAlign,r=t.offset,l=!this._dom.hasOffsetParent(n)?this.absoluteRect(e,n,r):this.relativeRect(e,n,r);return this._dom.align({anchorAlign:o,anchorRect:l,elementAlign:i,elementRect:this._dom.offset(n)})},t.prototype.absoluteRect=function(t,e,n){var i=this._dom,r=o.eitherRect(i.offset(t),n),l=i.stackingElementOffset(e),s=o.removeStackingOffset(r,l),a=i.stackingElementScroll(e),p=i.addScroll(s,a),c=this.elementScrollPosition(t,e),f=i.removeScroll(p,c);return f.left+=window.scrollX||window.pageXOffset,f.top+=window.scrollY||window.pageYOffset,f},t.prototype.elementScrollPosition=function(t,e){return t?{x:0,y:0}:this._dom.scrollPosition(e)},t.prototype.relativeRect=function(t,e,n){return o.eitherRect(this._dom.position(t,e),n)},t}();e.AlignService=i},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(9),i=n(8),r=function(){function t(){}return t.prototype.addOffset=function(t,e){return{left:t.left+e.left,top:t.top+e.top}},t.prototype.align=function(t){return o.align(t)},t.prototype.boundingOffset=function(t){return o.boundingOffset(t)},t.prototype.getWindow=function(){return i.isWindowAvailable()?window:null},t.prototype.isBodyOffset=function(t){return o.isBodyOffset(t)},t.prototype.hasOffsetParent=function(t){if(!t)return!1;var e=t.offsetParent;return e&&!("BODY"===e.nodeName&&"static"===window.getComputedStyle(e).position)},t.prototype.offset=function(t){return t?o.offset(t):null},t.prototype.staticOffset=function(t){if(!t)return null;var e=t.style,n=e.left,i=e.top;t.style.left="0px",t.style.top="0px";var r=o.offset(t);return t.style.left=n,t.style.top=i,r},t.prototype.position=function(t,e){if(!t||!e)return null;var n=o.siblingContainer(t,e);return o.positionWithScroll(t,n)},t.prototype.relativeOffset=function(t,e){return o.applyLocationOffset(this.offset(t),e,this.isBodyOffset(t))},t.prototype.addScroll=function(t,e){return o.addScroll(t,e)},t.prototype.removeScroll=function(t,e){return o.removeScroll(t,e)},t.prototype.restrictToView=function(t){return o.restrictToView(t)},t.prototype.scrollPosition=function(t){return o.scrollPosition(t)},t.prototype.scrollableParents=function(t){return i.scrollableParents(t)},t.prototype.stackingElementOffset=function(t){var e=this.getRelativeContextElement(t);return e?o.offset(e):null},t.prototype.stackingElementScroll=function(t){var e=this.getRelativeContextElement(t);return e?{x:e.scrollLeft,y:e.scrollTop}:{x:0,y:0}},t.prototype.stackingElementViewPort=function(t){var e=this.getRelativeContextElement(t);return e?{height:e.scrollHeight,width:e.scrollWidth}:null},t.prototype.getRelativeContextElement=function(t){if(!t||!i.HAS_RELATIVE_STACKING_CONTEXT)return null;for(var e=t.parentElement;e;){if("none"!==window.getComputedStyle(e).transform)return e;e=e.parentElement}return null},t.prototype.useRelativePosition=function(t){return!!this.getRelativeContextElement(t)},t.prototype.windowViewPort=function(t){return o.getWindowViewPort(t)},t.prototype.zIndex=function(t,e){return i.zIndex(t,e)},t.prototype.zoomLevel=function(){return i.isDocumentAvailable()&&i.isWindowAvailable()?parseFloat((document.documentElement.clientWidth/window.innerWidth).toFixed(2)):1},t.prototype.isZoomed=function(){return this.zoomLevel()>1},t}();e.DOMService=r},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(8),i=function(){function t(t){this._dom=t}return t.prototype.positionElement=function(t){var e=t.anchor,n=t.currentLocation,i=t.element,r=t.anchorAlign,l=t.elementAlign,s=t.collisions,a=this._dom,p=t.viewPort||a.stackingElementViewPort(i)||a.windowViewPort(i),c=o.eitherRect(a.offset(e),n),f=o.replaceOffset(a.staticOffset(i),n),u=this.elementRect(i,f),d=a.restrictToView({anchorAlign:r,anchorRect:c,collisions:s,elementAlign:l,elementRect:u,viewPort:p});return{flipped:d.flipped,offset:a.addOffset(f,d.offset)}},t.prototype.elementRect=function(t,e){return this._dom.removeScroll(e,this._dom.scrollPosition(t))},t}();e.PositionService=i}])}}});

package.json

 {
   "name": "@progress/kendo-react-popup",
   "description": "Kendo UI for React Popup package",
-  "version": "0.3.0-dev.201802021152",
+  "version": "0.3.0-dev.201802022204",
   "repository": {
@@ -31,3 +31,3 @@ "type": "git",
     "@progress/kendo-popup-common": "^1.2.2",
-    "@progress/kendo-react-animation": "0.3.0-dev.201802021152",
+    "@progress/kendo-react-animation": "0.3.0-dev.201802022204",
     "classnames": "^2.2.5",
@@ -34,0 +34,0 @@ "prop-types": "^15.6.0"

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

197446

increased by8.94%

Lines of code

2391

increased by15.45%

Dependency changes

• + Added@progress/kendo-react-animation@0.3.0-dev.201802022204(transitive)

• - Removed@progress/kendo-react-animation@0.3.0-dev.201802021152(transitive)

• Updated@progress/kendo-react-animation@0.3.0-dev.201802022204