@progress/kendo-react-popup 4.14.0-dev.202201131520 → 4.14.0

package/dist/npm/models/PopupProps.d.ts

@@ -1,9 +1,95 @@
 /// <reference types="react" />
-import { PopupSettings } from './PopupSettings';
+import { Collision } from './Collision';
+import { Align } from './Align';
+import { OpenEvent, CloseEvent, PositionEvent } from './Events';
+import { Offset } from './Offset';
+import { PopupAnimation } from './PopupAnimation';
+import { Margin } from './Margin';
+import { PositionMode } from './PositionMode';
+import { PopupSettings } from '@progress/kendo-popup-common';
 /**
  * Represents the props of the [KendoReact Popup component]({% slug overview_popup %}).
  */
 export interface PopupProps extends PopupSettings {
+    /**
+     * Controls the Popup animation ([see example]({% slug animations_popup %})). By default, the opening and closing animations are enabled.
+     */
+    animate?: boolean | PopupAnimation;
+    /**
+     * Specifies the element which will be used as an anchor ([see example]({% slug alignmentpositioning_popup %})). The Popup opens next to that element.
+     */
+    anchor?: HTMLElement | null;
+    /**
+     * Defines the container to which the Popup will be appended. Defaults to [`body`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body).
+     */
+    appendTo?: HTMLElement | null;
+    /**
+     * Specifies the pivot point of the anchor ([see example]({% slug alignmentpositioning_popup %})).
+     */
+    anchorAlign?: Align;
+    /**
+     * Configures the collision behavior of the Popup ([see example]({% slug viewportboundarydetection_popup %})).
+     */
+    collision?: Collision;
+    /**
+     * Configures the margin value that will be added to the popup dimensions
+     * in pixels and leaves a blank space between the popup and the anchor.
+     */
+    margin?: Margin;
+    /**
+     * Specifies the position mode of the component. By default, the Popup uses fixed positioning.
+     * To make the Popup acquire absolute positioning, set this option to `absolute`.
+     *
+     * > If you need to support mobile browsers with the zoom option, use the `absolute` positioning of the Popup.
+     */
+    positionMode?: PositionMode;
+    /**
+     * Used to set the document scale when using a [scale transform](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale).
+     *
+     * The document or container scale is required to compute the popup position correctly. Detecting the scale is not reliable and must be set by providing a value for SCALE. See [Support for Document Scale]({% slug documentscale_popup %}).
+     *
+     * > Using this token is not necessary for user-applied browser zoom.
+     *
+     */
+    scale?: number;
+    /**
+     * Specifies the pivot point of the Popup ([see example]({% slug alignmentpositioning_popup %})).
+     */
+    popupAlign?: Align;
+    /**
+     * Specifies the absolute position of the element ([see example]({% slug alignmentpositioning_popup %})). The Popup opens next to that point. The pivot point of the Popup is defined by the `popupAlign` configuration option. The boundary detection is applied by using the window viewport.
+     */
+    offset?: Offset;
+    /**
+     * Specifies a list of CSS classes that will be added to the internal animated element ([see example]({% slug appearance_popup %})).
+     */
+    popupClass?: string | Array<string> | {
+        [key: string]: boolean;
+    };
+    /**
+     * Specifies a list of CSS classes that will be added to the Popup element.
+     */
+    className?: string | Array<string>;
+    /**
+     * Specifies the id that will be added to the Popup element.
+     */
+    id?: string;
+    /**
+     * Represents the styles that are applied to the Popup.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Fires after the Popup is opened and the opening animation ends.
+     */
+    onOpen?: (event: OpenEvent) => void;
+    /**
+     * Fires after the Popup is closed.
+     */
+    onClose?: (event: CloseEvent) => void;
+    /**
+     * Fires after the Popup position is set.
+     */
+    onPosition?: (event: PositionEvent) => void;
     /**
      * Controls the Popup visibility ([see example]({% slug hidden_popup %})). Defaults to `false`.
      */
@@ -18,4 +104,8 @@ export interface PopupProps extends PopupSettings {
      * @hidden
      */
     children?: React.ReactNode;
+    /**
+     * @hidden
+     */
+    useBaseStyles?: boolean;
 }

package/dist/npm/package-metadata.js

@@ -7,7 +7,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-popup',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1642085491,
+    publishDate: 1642421321,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/npm/util.d.ts

@@ -11,13 +11,6 @@ export declare const hasBoundingRect: (elem: HTMLElement) => boolean;
  * @hidden
  */
 export declare const FRAME_DURATION: number;
-/**
- * @hidden
- */
-export declare const CollisionType: {
-    fit: string;
-    flip: string;
-};
 /**
  * @hidden
  */

package/dist/npm/util.js

@@ -16,13 +16,6 @@ exports.hasBoundingRect = function (elem) { return !!elem.getBoundingClientRect;
  * @hidden
  */
 exports.FRAME_DURATION = 1000 / 60; // 1000ms divided by 60fps
-/**
- * @hidden
- */
-exports.CollisionType = {
-    fit: 'fit',
-    flip: 'flip'
-};
 /**
  * @hidden
  */

package/dist/systemjs/kendo-react-popup.js

@@ -1 +1 @@
-System.register("@progress/kendo-react-popup",["react","react-dom","prop-types","@progress/kendo-react-common","@progress/kendo-popup-common"],function(r){var s,p,a,l,u;function t(e){return e.__useDefault?e.default:e}return{setters:[function(e){s=t(e)},function(e){p=t(e)},function(e){a=t(e)},function(e){l=t(e)},function(e){u=t(e)}],execute:function(){function i(e){if(o[e])return o[e].exports;var t=o[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,i),t.l=!0,t.exports}var n,o;o={},i.m=n=[function(e,t){e.exports=s},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});n=n(2);t.Popup=n.Popup,t.PopupPropsContext=n.PopupPropsContext,function(e){for(var t in e)r(t,e[t])}(t)},function(e,n,t){"use strict";var o=this&&this.__assign||function(){return(o=Object.assign||function(e){for(var t,n=1,o=arguments.length;n<o;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};Object.defineProperty(n,"__esModule",{value:!0});var i=t(0),r=t(3);n.PopupPropsContext=i.createContext(function(e){return e}),n.Popup=i.forwardRef(function(e,t){e=i.useContext(n.PopupPropsContext).call(void 0,e);return i.createElement(r.Popup,o({ref:t},e))})},function(e,t,n){"use strict";var o,i=this&&this.__extends||(o=function(e,t){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])})(e,t)},function(e,t){function n(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}),f=this&&this.__assign||function(){return(f=Object.assign||function(e){for(var t,n=1,o=arguments.length;n<o;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};Object.defineProperty(t,"__esModule",{value:!0});var l=n(0),u=n(4),r=n(5),s=n(6),c=n(7),d=n(8),p=n(9),a=n(10);function h(e,t){if(e===t)return 1;if(!!e==!!t){var n=Object.getOwnPropertyNames(e),o=Object.getOwnPropertyNames(t);if(n.length===o.length){for(var i=0;i<n.length;i++){var r=n[i];if(e[r]!==t[r])return}return 1}}}var g,m={left:-1e3,top:0};(n=g=g||{}).hiding="hiding",n.hidden="hidden",n.showing="showing",n.shown="shown",n.reposition="reposition";var v,m=(v=l.Component,i(y,v),y.getDerivedStateFromProps=function(e,t){var n=e.show,o=e.anchor,i=e.anchorAlign,r=e.appendTo,s=e.collision,p=e.popupAlign,a=e.className,l=e.popupClass,u=e.style,c=e.offset,d=e.contentKey,d=f({},t,{props:{show:n,anchor:o,anchorAlign:i,appendTo:r,collision:s,popupAlign:p,className:a,popupClass:l,style:u,offset:c,contentKey:d}});return e.show?t.current===g.hidden||t.current===g.hiding?f({},d,{current:g.showing,previous:t.current}):t.current===g.showing?f({},d,{current:g.shown,previous:t.current}):t.current!==g.shown||h(c,t.props.offset)&&h(i,t.props.anchorAlign)&&h(r,t.props.appendTo)&&h(s,t.props.collision)&&h(p,t.props.popupAlign)&&h(u,t.props.style)&&o===t.props.anchor&&l===t.props.popupClass&&a===t.props.className?d:f({},d,{current:g.reposition,previous:t.current}):t.current===g.hiding||t.current===g.hidden?f({},d,{current:g.hidden,previous:t.current}):f({},d,{current:g.hiding,previous:t.current})},y.prototype.componentDidUpdate=function(e){this.state.current===g.showing&&this._popup?this.show(this._popup):this.state.current===g.hiding&&this._popup?(this.onClosing(this._popup),this.animate(this._popup.firstChild,"exit",this.onClosed)):this.state.current===g.reposition&&this.state.previous===g.shown?this.setState({current:g.shown,previous:this.state.current}):this.state.current===g.shown&&e.contentKey!==this.props.contentKey&&this._popup&&this.setPosition(this._popup)},y.prototype.componentDidMount=function(){this.state.current===g.showing&&this._popup&&this.show(this._popup)},y.prototype.componentWillUnmount=function(){this.detachRepositionHandlers()},y.prototype.render=function(){var t=this,e=this.props,n=e.children,o=e.className,i=e.popupClass,r=e.show,s=e.id,p=e.positionMode,a=this.props.appendTo||(c.canUseDOM?(this.props.anchor&&this.props.anchor.ownerDocument?this.props.anchor.ownerDocument:document).body:void 0);this.state.current===g.reposition&&this.state.previous===g.shown&&this._popup&&this.setPosition(this._popup);e=Object.assign({},{position:p},this.props.style||{}),p=this.state.current===g.hiding;if((r||p)&&a){p=this.getCurrentZIndex(),n=l.createElement(c.ZIndexContext.Provider,{value:p},l.createElement("div",{className:c.classNames("k-animation-container","k-animation-container-relative",o),id:s,ref:function(e){return t._popup=e},style:f({zIndex:p},e)},l.createElement("div",{className:c.classNames(i,"k-popup","k-child-animation-container"),style:{transitionDelay:"0ms"}},n)));return u.createPortal(n,a)}return null},Object.defineProperty(y.prototype,"animationDuration",{get:function(){var e=this.props.animate,t=0,n=0;return e&&(!0===e?t=n=300:(t=e.openDuration||0,n=e.closeDuration||0)),{enter:t,exit:n}},enumerable:!0,configurable:!0}),y.prototype.attachRepositionHandlers=function(e){var t=this;this.detachRepositionHandlers(),this._scrollableParents=d.domUtils.scrollableParents(this.props.anchor||e),this._scrollableParents.map(function(e){return e.addEventListener("scroll",t.reposition)}),window.addEventListener("resize",this.reposition)},y.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)},y.prototype.reposition=function(){this.setState({current:g.reposition,previous:this.state.current})},y.propTypes={anchor:function(e){e=e.anchor;return e&&"number"!=typeof e.nodeType?new Error("Invalid prop `anchor` supplied to `Kendo React Popup`. Validation failed."):null},appendTo:function(e){e=e.appendTo;return e&&"number"!=typeof e.nodeType?new Error("Invalid prop `appendTo` supplied to `Kendo React Popup`. Validation failed."):null},className:r.string,id:r.string,popupClass:r.string,collision:r.shape({horizontal:r.oneOf([p.CollisionType.fit,p.CollisionType.flip]),vertical:r.oneOf([p.CollisionType.fit,p.CollisionType.flip])}),anchorAlign:r.shape({horizontal:r.oneOf([d.AlignPoint.left,d.AlignPoint.center,d.AlignPoint.right]),vertical:r.oneOf([d.AlignPoint.top,d.AlignPoint.center,d.AlignPoint.bottom])}),popupAlign:r.shape({horizontal:r.oneOf([d.AlignPoint.left,d.AlignPoint.center,d.AlignPoint.right]),vertical:r.oneOf([d.AlignPoint.top,d.AlignPoint.center,d.AlignPoint.bottom])}),offset:r.shape({left:r.number,top:r.number}),children:r.oneOfType([r.element,r.node]),show:r.bool,animate:r.oneOfType([r.bool,r.shape({openDuration:r.number,closeDuration:r.number})]),margin:r.shape({horizontal:r.number,vertical:r.number}),positionMode:r.oneOf(["fixed","absolute"]),scale:r.number},y.defaultProps={collision:{horizontal:p.CollisionType.fit,vertical:p.CollisionType.flip},anchorAlign:{horizontal:d.AlignPoint.left,vertical:d.AlignPoint.bottom},popupAlign:{horizontal:d.AlignPoint.left,vertical:d.AlignPoint.top},offset:m,animate:!0,show:!1,margin:{horizontal:0,vertical:0},positionMode:"absolute"},y.contextType=c.ZIndexContext,y);function y(e){var l=v.call(this,e)||this;return l.state={current:g.hidden,previous:g.hidden,props:{}},l._popup=null,l.show=function(e){l.setPosition(e),l.animate(e.firstChild,"enter",l.onOpened),l.setState({current:g.shown,previous:l.state.current})},l.setPosition=function(e){var t=l.props,n=t.anchorAlign,o=t.popupAlign,i=t.collision,r=t.offset,s=t.anchor,p=t.margin,a=t.scale,t=t.positionMode;e.style.top="0px",e.style.left="-10000px";a=d.alignElement({anchor:s,element:e,elementAlign:o,anchorAlign:n,offset:r,margin:p,positionMode:t,scale:a}),o=d.positionElement({anchor:s,anchorAlign:n,collisions:i,element:e,currentLocation:a,elementAlign:o,margin:l.props.margin});e.style.top=o.offset.top+"px",e.style.left=o.offset.left+"px",l._flipped=o.flipped},l.onOpened=function(){var e=l._popup;e&&(l.props.show&&e.classList.add("k-animation-container-shown"),l.attachRepositionHandlers(e),l.props.onOpen&&l.props.onOpen.call(void 0,{target:l}))},l.animate=function(e,t,n){s.slide(e,l._flipped?"up":"down",l.animationDuration[t],t,n)},l.onClosing=function(e){l.props.show||e.classList.remove("k-animation-container-shown"),l.detachRepositionHandlers()},l.onClosed=function(){l.state.current===g.hiding&&l.state.previous===g.shown&&l.setState({current:g.hidden,previous:l.state.current}),l.props.onClose&&l.props.onClose.call(void 0,{target:l})},l.getCurrentZIndex=function(){return l.context?l.context+1:100},c.validatePackage(a.packageMetadata),l.reposition=p.throttle(l.reposition.bind(l),p.FRAME_DURATION),l}t.Popup=m},function(e,t){e.exports=p},function(e,t){e.exports=a},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});function l(e){e.style.transitionDuration="",e.classList.remove("k-slide-down-appear","k-slide-down-appear-active","k-slide-down-exit","k-slide-down-exit-active","k-slide-up-appear","k-slide-up-appear-active","k-slide-up-exit","k-slide-up-exit-active")}var u="undefined"!=typeof window&&/Firefox/.test(window.navigator.userAgent);t.slide=function(e,t,n,o,i){if(0===n)return i();function r(){e.removeEventListener("transitionend",r),l(e),i()}var s="k-slide-"+t+"-"+o,p=s+"-active";e.addEventListener("transitionend",r);var a,o=e.ownerDocument;!o||(a=o.defaultView)&&(o=function(){l(e),e.classList.add(s),a.requestAnimationFrame(function(){e.style.transitionDuration=n+"ms",e.classList.add(p)})},u?a.requestAnimationFrame(o):o())}},function(e,t){e.exports=l},function(e,t){e.exports=u},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.isDifferentOffset=function(e,t){var n=e.left,o=e.top,e=t.left,t=t.top;return 1<=Math.abs(n-e)||1<=Math.abs(o-t)},t.hasBoundingRect=function(e){return!!e.getBoundingClientRect},t.FRAME_DURATION=1e3/60,t.CollisionType={fit:"fit",flip:"flip"},t.throttle=function(n,o,i){var r,s,p,a,l=0;i=(i=void 0===i?{}:i)||{};function u(){l=!1===i.leading?0:(new Date).getTime(),r=null,a=n.apply(s,p),r||(s=p=null)}return function(){var e=(new Date).getTime();l||!1!==i.leading||(l=e);var t=o-(e-l);return s=this,p=arguments,t<=0||o<t?(r&&(clearTimeout(r),r=null),l=e,a=n.apply(s,p),r||(s=p=null)):r||!1===i.trailing||(r=window.setTimeout(u,t)),a}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.packageMetadata={name:"@progress/kendo-react-popup",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:1642085491,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"}}],i.c=o,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)i.d(n,o,function(e){return t[e]}.bind(null,o));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=1)}}});
+System.register("@progress/kendo-react-popup",["react","react-dom","prop-types","@progress/kendo-react-common","@progress/kendo-popup-common"],function(r){var s,p,a,l,u;function e(t){return t.__useDefault?t.default:t}return{setters:[function(t){s=e(t)},function(t){p=e(t)},function(t){a=e(t)},function(t){l=e(t)},function(t){u=e(t)}],execute:function(){function i(t){if(o[t])return o[t].exports;var e=o[t]={i:t,l:!1,exports:{}};return n[t].call(e.exports,e,e.exports,i),e.l=!0,e.exports}var n,o;o={},i.m=n=[function(t,e){t.exports=s},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});n=n(2);e.Popup=n.Popup,e.PopupPropsContext=n.PopupPropsContext,function(t){for(var e in t)r(e,t[e])}(e)},function(t,n,e){"use strict";var o=this&&this.__assign||function(){return(o=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}).apply(this,arguments)};Object.defineProperty(n,"__esModule",{value:!0});var i=e(0),r=e(3);n.PopupPropsContext=i.createContext(function(t){return t}),n.Popup=i.forwardRef(function(t,e){t=i.useContext(n.PopupPropsContext).call(void 0,t);return i.createElement(r.PopupWithoutContext,o({ref:e},t))}),n.Popup.displayName="Popup"},function(t,e,n){"use strict";var o,i=this&&this.__extends||(o=function(t,e){return(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])})(t,e)},function(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}),f=this&&this.__assign||function(){return(f=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}).apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0});var l=n(0),u=n(4),r=n(5),s=n(6),c=n(7),d=n(8),p=n(9),a=n(10);function h(t,e){if(t===e)return 1;if(!!t==!!e){var n=Object.getOwnPropertyNames(t),o=Object.getOwnPropertyNames(e);if(n.length===o.length){for(var i=0;i<n.length;i++){var r=n[i];if(t[r]!==e[r])return}return 1}}}var g,m={left:-1e3,top:0};(n=g=g||{}).hiding="hiding",n.hidden="hidden",n.showing="showing",n.shown="shown",n.reposition="reposition";var v,m=(v=l.Component,i(y,v),y.getDerivedStateFromProps=function(t,e){var n=t.show,o=t.anchor,i=t.anchorAlign,r=t.appendTo,s=t.collision,p=t.popupAlign,a=t.className,l=t.popupClass,u=t.style,c=t.offset,d=t.contentKey,d=f({},e,{props:{show:n,anchor:o,anchorAlign:i,appendTo:r,collision:s,popupAlign:p,className:a,popupClass:l,style:u,offset:c,contentKey:d}});return t.show?e.current===g.hidden||e.current===g.hiding?f({},d,{current:g.showing,previous:e.current}):e.current===g.showing?f({},d,{current:g.shown,previous:e.current}):e.current!==g.shown||h(c,e.props.offset)&&h(i,e.props.anchorAlign)&&h(r,e.props.appendTo)&&h(s,e.props.collision)&&h(p,e.props.popupAlign)&&h(u,e.props.style)&&o===e.props.anchor&&l===e.props.popupClass&&a===e.props.className?d:f({},d,{current:g.reposition,previous:e.current}):e.current===g.hiding||e.current===g.hidden?f({},d,{current:g.hidden,previous:e.current}):f({},d,{current:g.hiding,previous:e.current})},y.prototype.componentDidUpdate=function(t){this.state.current===g.showing&&this._popup?this.show(this._popup):this.state.current===g.hiding&&this._popup?(this.onClosing(this._popup),this.animate(this._popup.firstChild,"exit",this.onClosed)):this.state.current===g.reposition&&this.state.previous===g.shown?this.setState({current:g.shown,previous:this.state.current}):this.state.current===g.shown&&t.contentKey!==this.props.contentKey&&this._popup&&this.setPosition(this._popup)},y.prototype.componentDidMount=function(){this.state.current===g.showing&&this._popup&&this.show(this._popup)},y.prototype.componentWillUnmount=function(){this.detachRepositionHandlers()},y.prototype.render=function(){var e=this,t=this.props,n=t.children,o=t.className,i=t.popupClass,r=t.show,s=t.id,p=t.positionMode,a=this.props.appendTo||(c.canUseDOM?(this.props.anchor&&this.props.anchor.ownerDocument?this.props.anchor.ownerDocument:document).body:void 0);this.state.current===g.reposition&&this.state.previous===g.shown&&this._popup&&this.setPosition(this._popup);t=Object.assign({},{position:p,top:0,left:-1e4},this.props.style||{}),p=this.state.current===g.hiding;if((r||p)&&a){p=this.getCurrentZIndex(),n=l.createElement(c.ZIndexContext.Provider,{value:p},l.createElement("div",{className:c.classNames("k-animation-container","k-animation-container-relative",o),id:s,ref:function(t){return e._popup=t},style:f({zIndex:p},t)},l.createElement("div",{className:c.classNames("k-popup",i,"k-child-animation-container"),style:{transitionDelay:"0ms"}},n)));return u.createPortal(n,a)}return null},Object.defineProperty(y.prototype,"animationDuration",{get:function(){var t=this.props.animate,e=0,n=0;return t&&(!0===t?e=n=300:(e=t.openDuration||0,n=t.closeDuration||0)),{enter:e,exit:n}},enumerable:!0,configurable:!0}),y.prototype.attachRepositionHandlers=function(t){var e=this;this.detachRepositionHandlers(),this._scrollableParents=d.domUtils.scrollableParents(this.props.anchor||t),this._scrollableParents.map(function(t){return t.addEventListener("scroll",e.reposition)}),window.addEventListener("resize",this.reposition)},y.prototype.detachRepositionHandlers=function(){var e=this;this._scrollableParents&&(this._scrollableParents.map(function(t){return t.removeEventListener("scroll",e.reposition)}),this._scrollableParents=void 0),window.removeEventListener("resize",this.reposition)},y.prototype.reposition=function(){this.setState({current:g.reposition,previous:this.state.current})},y.propTypes={anchor:function(t){t=t.anchor;return t&&"number"!=typeof t.nodeType?new Error("Invalid prop `anchor` supplied to `Kendo React Popup`. Validation failed."):null},appendTo:function(t){t=t.appendTo;return t&&"number"!=typeof t.nodeType?new Error("Invalid prop `appendTo` supplied to `Kendo React Popup`. Validation failed."):null},className:r.oneOfType([r.string,r.arrayOf(r.string),r.object]),id:r.string,popupClass:r.oneOfType([r.string,r.arrayOf(r.string),r.object]),collision:r.shape({horizontal:r.oneOf([d.Collision.fit,d.Collision.flip,d.Collision.none]),vertical:r.oneOf([d.Collision.fit,d.Collision.flip,d.Collision.none])}),anchorAlign:r.shape({horizontal:r.oneOf([d.AlignPoint.left,d.AlignPoint.center,d.AlignPoint.right]),vertical:r.oneOf([d.AlignPoint.top,d.AlignPoint.center,d.AlignPoint.bottom])}),popupAlign:r.shape({horizontal:r.oneOf([d.AlignPoint.left,d.AlignPoint.center,d.AlignPoint.right]),vertical:r.oneOf([d.AlignPoint.top,d.AlignPoint.center,d.AlignPoint.bottom])}),offset:r.shape({left:r.number,top:r.number}),children:r.oneOfType([r.element,r.node]),show:r.bool,animate:r.oneOfType([r.bool,r.shape({openDuration:r.number,closeDuration:r.number})]),margin:r.shape({horizontal:r.number,vertical:r.number}),positionMode:r.oneOf(["fixed","absolute"]),scale:r.number,style:r.object,onClose:r.func,onPosition:r.func,onOpen:r.func},y.defaultProps={collision:{horizontal:d.Collision.fit,vertical:d.Collision.flip},anchorAlign:{horizontal:d.AlignPoint.left,vertical:d.AlignPoint.bottom},popupAlign:{horizontal:d.AlignPoint.left,vertical:d.AlignPoint.top},offset:m,animate:!0,show:!1,margin:{horizontal:0,vertical:0},positionMode:"absolute"},y.contextType=c.ZIndexContext,y.displayName="PopupComponent",y);function y(t){var l=v.call(this,t)||this;return l.state={current:g.hidden,previous:g.hidden,props:{}},l._popup=null,l.show=function(t){l.setPosition(t),l.animate(t.firstChild,"enter",l.onOpened),l.setState({current:g.shown,previous:l.state.current})},l.setPosition=function(t){var e=l.props,n=e.anchorAlign,o=e.popupAlign,i=e.collision,r=e.offset,s=e.anchor,p=e.margin,a=e.scale,e=e.positionMode,a=d.alignElement({anchor:s,anchorAlign:n,element:t,elementAlign:o,offset:r,margin:p,positionMode:e,scale:a}),a=d.positionElement({anchor:s,anchorAlign:n,element:t,elementAlign:o,collisions:i,currentLocation:a,margin:l.props.margin});t.style.top=a.offset.top+"px",t.style.left=a.offset.left+"px",l._collisions={fit:a.fit,fitted:a.fitted,flip:a.flip,flipped:a.flipped},l.props.onPosition&&(a={target:l,flipped:a.flipped,fitted:a.fitted},l.props.onPosition.call(void 0,a))},l.onOpened=function(){var t=l._popup;t&&(l.props.show&&t.classList.add("k-animation-container-shown"),l.attachRepositionHandlers(t),l.props.onOpen&&l.props.onOpen.call(void 0,{target:l}))},l.animate=function(t,e,n){var o,i;l.props.popupAlign&&(o=(i=l.props.popupAlign).horizontal,i=i.vertical,i="left"===o&&"center"===i?"right":"right"===o&&"center"===i?"left":"top"===i?"down":"up",l._collisions&&l._collisions.flipped&&(i={down:"up",up:"down",left:"right",right:"left"}[i]),s.slide(t,i,l.animationDuration[e],e,n))},l.onClosing=function(t){l.props.show||t.classList.remove("k-animation-container-shown"),l.detachRepositionHandlers()},l.onClosed=function(){l.state.current===g.hiding&&l.state.previous===g.shown&&l.setState({current:g.hidden,previous:l.state.current}),l.props.onClose&&l.props.onClose.call(void 0,{target:l})},l.getCurrentZIndex=function(){return l.context?l.context+1:100},c.validatePackage(a.packageMetadata),l.reposition=p.throttle(l.reposition.bind(l),p.FRAME_DURATION),l}e.PopupWithoutContext=m},function(t,e){t.exports=p},function(t,e){t.exports=a},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});function l(t){t.style.transitionDuration="",t.classList.remove("k-slide-down-appear","k-slide-down-appear-active","k-slide-down-exit","k-slide-down-exit-active","k-slide-up-appear","k-slide-up-appear-active","k-slide-up-exit","k-slide-up-exit-active")}var u="undefined"!=typeof window&&/Firefox/.test(window.navigator.userAgent);e.slide=function(t,e,n,o,i){if(0===n)return i();function r(){t.removeEventListener("transitionend",r),l(t),i()}var s="k-slide-"+e+"-"+o,p=s+"-active";t.addEventListener("transitionend",r);var a,o=t.ownerDocument;!o||(a=o.defaultView)&&(o=function(){l(t),t.classList.add(s),a.requestAnimationFrame(function(){t.style.transitionDuration=n+"ms",t.classList.add(p)})},u?a.requestAnimationFrame(o):o())}},function(t,e){t.exports=l},function(t,e){t.exports=u},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.isDifferentOffset=function(t,e){var n=t.left,o=t.top,t=e.left,e=e.top;return 1<=Math.abs(n-t)||1<=Math.abs(o-e)},e.hasBoundingRect=function(t){return!!t.getBoundingClientRect},e.FRAME_DURATION=1e3/60,e.throttle=function(n,o,i){var r,s,p,a,l=0;i=(i=void 0===i?{}:i)||{};function u(){l=!1===i.leading?0:(new Date).getTime(),r=null,a=n.apply(s,p),r||(s=p=null)}return function(){var t=(new Date).getTime();l||!1!==i.leading||(l=t);var e=o-(t-l);return s=this,p=arguments,e<=0||o<e?(r&&(clearTimeout(r),r=null),l=t,a=n.apply(s,p),r||(s=p=null)):r||!1===i.trailing||(r=window.setTimeout(u,e)),a}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.packageMetadata={name:"@progress/kendo-react-popup",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:1642421321,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"}}],i.c=o,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)i.d(n,o,function(t){return e[t]}.bind(null,o));return n},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=1)}}});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-react-popup",
   "description": "KendoReact Popup package",
-  "version": "4.14.0-dev.202201131520",
+  "version": "4.14.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/telerik/kendo-react.git"
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@progress/kendo-popup-common": "1.9.0",
-    "@progress/kendo-react-common": "4.14.0-dev.202201131520",
+    "@progress/kendo-react-common": "4.14.0",
     "prop-types": "^15.6.0"
   },
   "@progress": {

package/dist/es/PopupWithContext.d.ts

@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { Popup as PopupComponent } from './Popup';
-import { PopupProps } from './models/PopupProps';
-/**
- * The PopupPropsContext. It allows to configure the Popup props from a wrapper component.
- *
- * @example
- * ```jsx-no-run
- *  <PopupPropsContext.Provider value={props => ({ ...props, appendTo: document.querySelector('myPopupsContainer') })}>
- *      <DropDownList />
- *      <Editor />
- *  </PopupPropsContext.Provider>
- * ```
- */
-export declare const PopupPropsContext: React.Context<(props: PopupProps) => PopupProps>;
-/**
- * The KendoReact Popup component.
- */
-export declare const Popup: React.ForwardRefExoticComponent<PopupProps & React.RefAttributes<PopupComponent>>;

package/dist/es/PopupWithContext.js

@@ -1,33 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import * as React from 'react';
-import { Popup as PopupComponent } from './Popup';
-/**
- * The PopupPropsContext. It allows to configure the Popup props from a wrapper component.
- *
- * @example
- * ```jsx-no-run
- *  <PopupPropsContext.Provider value={props => ({ ...props, appendTo: document.querySelector('myPopupsContainer') })}>
- *      <DropDownList />
- *      <Editor />
- *  </PopupPropsContext.Provider>
- * ```
- */
-export var PopupPropsContext = React.createContext(function (props) { return props; });
-/**
- * The KendoReact Popup component.
- */
-export var Popup = React.forwardRef(function (props, ref) {
-    var contextPropsCallback = React.useContext(PopupPropsContext);
-    var popupProps = contextPropsCallback.call(undefined, props);
-    return (React.createElement(PopupComponent, __assign({ ref: ref }, popupProps)));
-});

package/dist/npm/PopupWithContext.d.ts

@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { Popup as PopupComponent } from './Popup';
-import { PopupProps } from './models/PopupProps';
-/**
- * The PopupPropsContext. It allows to configure the Popup props from a wrapper component.
- *
- * @example
- * ```jsx-no-run
- *  <PopupPropsContext.Provider value={props => ({ ...props, appendTo: document.querySelector('myPopupsContainer') })}>
- *      <DropDownList />
- *      <Editor />
- *  </PopupPropsContext.Provider>
- * ```
- */
-export declare const PopupPropsContext: React.Context<(props: PopupProps) => PopupProps>;
-/**
- * The KendoReact Popup component.
- */
-export declare const Popup: React.ForwardRefExoticComponent<PopupProps & React.RefAttributes<PopupComponent>>;

package/dist/npm/PopupWithContext.js

@@ -1,35 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var Popup_1 = require("./Popup");
-/**
- * The PopupPropsContext. It allows to configure the Popup props from a wrapper component.
- *
- * @example
- * ```jsx-no-run
- *  <PopupPropsContext.Provider value={props => ({ ...props, appendTo: document.querySelector('myPopupsContainer') })}>
- *      <DropDownList />
- *      <Editor />
- *  </PopupPropsContext.Provider>
- * ```
- */
-exports.PopupPropsContext = React.createContext(function (props) { return props; });
-/**
- * The KendoReact Popup component.
- */
-exports.Popup = React.forwardRef(function (props, ref) {
-    var contextPropsCallback = React.useContext(exports.PopupPropsContext);
-    var popupProps = contextPropsCallback.call(undefined, props);
-    return (React.createElement(Popup_1.Popup, __assign({ ref: ref }, popupProps)));
-});