@progress/kendo-react-popup 9.5.0 → 10.0.0-develop.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Popup.js +1 -1
- package/Popup.mjs +24 -27
- package/dist/cdn/js/kendo-react-popup.js +1 -1
- package/package.json +3 -9
- package/package-metadata.js +0 -8
- package/package-metadata.mjs +0 -19
package/Popup.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const we=require("react"),ve=require("react-dom"),n=require("prop-types"),ye=require("./animation.js"),a=require("@progress/kendo-react-common"),t=require("@progress/kendo-popup-common"),ee=require("./util.js")
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const we=require("react"),ve=require("react-dom"),n=require("prop-types"),ye=require("./animation.js"),a=require("@progress/kendo-react-common"),t=require("@progress/kendo-popup-common"),ee=require("./util.js");function ne(i){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const h in i)if(h!=="default"){const v=Object.getOwnPropertyDescriptor(i,h);Object.defineProperty(c,h,v.get?v:{enumerable:!0,get:()=>i[h]})}}return c.default=i,Object.freeze(c)}const l=ne(we),Oe=ne(ve),te=l.createContext(i=>i),Ae=100,Ce=1;function E(i,c){if(i===c)return!0;if(!!i!=!!c)return!1;const h=Object.getOwnPropertyNames(i),v=Object.getOwnPropertyNames(c);if(h.length!==v.length)return!1;for(let P=0;P<h.length;P++){const w=h[P];if(i[w]!==c[w])return!1}return!0}const be={left:-1e3,top:0},U=l.forwardRef((i,c)=>{const v=l.useContext(te).call(void 0,i),{collision:P=g.collision,anchorAlign:w=g.anchorAlign,popupAlign:y=g.popupAlign,offset:R=g.offset,animate:oe=g.animate,show:O=g.show,margin:K=g.margin,positionMode:Z=g.positionMode,appendTo:A,contentKey:T,anchor:f,scale:re,role:ie,onKeyDown:se,onPosition:F,onOpen:H,onMouseDownOutside:V,onClose:X,className:N,popupClass:z,id:le,style:M,children:ce}=v,ue=a.useUnstyled(),S=v.unstyled||ue,D=S&&S.uPopup,[o,I]=l.useState({current:"hidden",previous:"hidden",props:{}}),W=e=>{window==null||window.addEventListener("mousedown",G),L(e),B(e.firstChild,"enter",ae),I({...r,current:"shown",previous:r.current})},L=e=>{const{width:s,height:m}=e.style;e.style.width=e.offsetWidth+"px",e.style.height=e.offsetHeight+"px";const d=t.alignElement({anchor:f,anchorAlign:w,element:e,elementAlign:y,offset:R,margin:K,positionMode:Z,scale:re}),p=t.positionElement({anchor:f,anchorAlign:w,element:e,elementAlign:y,collisions:P,currentLocation:d,margin:K});if(e.style.top=p.offset.top+"px",e.style.left=p.offset.left+"px",e.style.width=s,e.style.height=m,k.current={fit:p.fit,fitted:p.fitted,flip:p.flip,flipped:p.flipped},F){const x={target:b.current,flipped:p.flipped,fitted:p.fitted};F.call(void 0,x)}},ae=()=>{const e=u.current;e&&(O&&e.classList.add(...a.classNames(a.uPopup.animationContainerShown({c:D})).split(" ").filter(s=>s)),de(e),H&&H.call(void 0,{target:b.current}))},B=(e,s,m)=>{if(!y)return;let d;const{horizontal:p,vertical:x}=y;p==="left"&&x==="center"?d="right":p==="right"&&x==="center"?d="left":x==="top"?d="down":d="up";const Pe={down:"up",up:"down",left:"right",right:"left"};k.current&&k.current.flipped&&(d=Pe[d]),ye.slide(e,d,fe()[s],s,m,D)},G=e=>{var d;const s=((d=e==null?void 0:e.target)==null?void 0:d.closest(".k-animation-container"))===null,m=(f==null?void 0:f.contains(e==null?void 0:e.target))||!1;if(s){if(V){const p={target:b.current,event:e,state:o,isAnchorClicked:m};V.call(void 0,p)}window==null||window.removeEventListener("mousedown",G)}},pe=e=>{if(!O){const s=S&&S.uPopup;e.classList.remove(...a.classNames(a.uPopup.animationContainerShown({c:s})).split(" ").filter(m=>m))}j()},J=()=>{r.current==="hiding"&&(r.previous==="shown"||r.previous==="reposition")&&I({...r,current:"hidden",previous:r.current}),X&&X.call(void 0,{target:b.current})},fe=()=>{const e=oe;let s=0,m=0;return e&&(e===!0?s=m=300:(s=e.openDuration||0,m=e.closeDuration||0)),{enter:s,exit:m}},de=e=>{j(),C.current=t.domUtils.scrollableParents(f||e),C.current&&C.current.map(s=>s.addEventListener("scroll",_)),window.addEventListener("resize",_)},j=()=>{C.current&&(C.current.map(e=>e.removeEventListener("scroll",_)),C.current=void 0),window.removeEventListener("resize",_)},_=ee.throttle(()=>{r.current!=="hidden"&&r.current!=="hiding"&&I({...o,current:"reposition",previous:r.current})},ee.FRAME_DURATION),me=()=>Q?Q+Ce:Ae,Q=a.useZIndexContext()||0,k=l.useRef(),C=l.useRef(),u=l.useRef(null),b=l.useRef(null),Y=l.useRef({}),q=l.useRef(!1);l.useImperativeHandle(b,()=>({element:u.current,setPosition:L,props:i})),l.useImperativeHandle(c,()=>b.current);const r=l.useMemo(()=>{const e={...o,props:{show:O,anchor:f,anchorAlign:w,appendTo:A,collision:P,popupAlign:y,className:N,popupClass:z,style:M,offset:R,contentKey:T}};return O?o.current==="hidden"||o.current==="hiding"?{...e,current:"showing",previous:o.current}:o.current==="showing"?{...e,current:"shown",previous:o.current}:o.current==="shown"&&(!E(R,o.props.offset)||!E(w,o.props.anchorAlign)||!E(A,o.props.appendTo)||!E(P,o.props.collision)||!E(y,o.props.popupAlign)||!E(M,o.props.style)||f!==o.props.anchor||z!==o.props.popupClass||N!==o.props.className)?{...e,current:"reposition",previous:o.current}:e:o.current==="hiding"||o.current==="hidden"?{...e,current:"hidden",previous:o.current}:{...e,current:"hiding",previous:o.current}},[O,f,w,A,P,y,N,z,M,R,T,o]);l.useEffect(()=>{r.current==="hiding"&&!q.current&&u.current?(q.current=!0,pe(u.current),B(u.current.firstChild,"exit",J)):(q.current=!1,r.current==="showing"&&u.current?W(u.current):r.current==="hiding"&&u.current?J():r.current==="reposition"&&r.previous==="shown"?setTimeout(()=>{I({...r,current:"shown",previous:r.current})},0):r.current==="shown"&&Y.current.contentKey!==T&&u.current&&L(u.current)),r.current==="reposition"&&(r.previous==="shown"||r.previous==="showing")&&u.current&&L(u.current),Y.current={contentKey:T}},[r]),l.useEffect(()=>(r.current==="showing"&&u.current&&W(u.current),()=>{j()}),[]);const $=A||(a.canUseDOM?f&&f.ownerDocument?f.ownerDocument.body:document.body:void 0),he=Object.assign({},{position:Z,top:0,left:-1e4},M||{}),ge=r.current==="hiding";if((O||ge)&&$){const e=me(),s=l.createElement(a.ZIndexContext.Provider,{value:e},l.createElement("div",{onKeyDown:se,className:a.classNames(a.uPopup.animationContainer({c:D}),N),id:le,ref:u,style:{zIndex:e,...he}},l.createElement("div",{className:a.classNames(a.uPopup.animationChild({c:D})),style:{transitionDelay:"0ms"}},l.createElement("div",{role:ie,className:a.classNames(a.uPopup.popup({c:D}),z)},ce))));return A!==null?Oe.createPortal(s,$):s}return null}),g={collision:{horizontal:t.Collision.fit,vertical:t.Collision.flip},anchorAlign:{horizontal:t.AlignPoint.left,vertical:t.AlignPoint.bottom},popupAlign:{horizontal:t.AlignPoint.left,vertical:t.AlignPoint.top},offset:be,animate:!0,show:!1,margin:{horizontal:0,vertical:0},positionMode:"absolute"};U.displayName="Popup";U.propTypes={anchor:function(i){const c=i.anchor;return c&&typeof c.nodeType!="number"?new Error("Invalid prop `anchor` supplied to `Kendo React Popup`. Validation failed."):null},appendTo:function(i){const c=i.appendTo;return c&&typeof c.nodeType!="number"?new Error("Invalid prop `appendTo` supplied to `Kendo React Popup`. Validation failed."):null},className:n.oneOfType([n.string,n.arrayOf(n.string.isRequired)]),id:n.string,popupClass:n.oneOfType([n.string,n.arrayOf(n.string),n.object]),collision:n.shape({horizontal:n.oneOf([t.Collision.fit,t.Collision.flip,t.Collision.none]),vertical:n.oneOf([t.Collision.fit,t.Collision.flip,t.Collision.none])}),anchorAlign:n.shape({horizontal:n.oneOf([t.AlignPoint.left,t.AlignPoint.center,t.AlignPoint.right]),vertical:n.oneOf([t.AlignPoint.top,t.AlignPoint.center,t.AlignPoint.bottom])}),popupAlign:n.shape({horizontal:n.oneOf([t.AlignPoint.left,t.AlignPoint.center,t.AlignPoint.right]),vertical:n.oneOf([t.AlignPoint.top,t.AlignPoint.center,t.AlignPoint.bottom])}),offset:n.shape({left:n.number,top:n.number}),children:n.oneOfType([n.element,n.node]),show:n.bool,animate:n.oneOfType([n.bool,n.shape({openDuration:n.number,closeDuration:n.number})]),margin:n.shape({horizontal:n.number,vertical:n.number}),positionMode:n.oneOf(["fixed","absolute"]),scale:n.number,style:n.object,onClose:n.func,onPosition:n.func,onOpen:n.func,onKeyDown:n.func,onMouseDownOutside:n.func};exports.Popup=U;exports.PopupPropsContext=te;exports.popupDefaultProps=g;
|
package/Popup.mjs
CHANGED
|
@@ -9,11 +9,10 @@ import * as i from "react";
|
|
|
9
9
|
import * as we from "react-dom";
|
|
10
10
|
import t from "prop-types";
|
|
11
11
|
import { slide as ve } from "./animation.mjs";
|
|
12
|
-
import {
|
|
13
|
-
import { Collision as w, AlignPoint as s, alignElement as
|
|
14
|
-
import { throttle as
|
|
15
|
-
|
|
16
|
-
const Ne = i.createContext((l) => l), ze = 100, Ie = 1;
|
|
12
|
+
import { useUnstyled as ye, useZIndexContext as Pe, canUseDOM as Oe, ZIndexContext as Ee, classNames as D, uPopup as A } from "@progress/kendo-react-common";
|
|
13
|
+
import { Collision as w, AlignPoint as s, alignElement as be, positionElement as Ce, domUtils as xe } from "@progress/kendo-popup-common";
|
|
14
|
+
import { throttle as De, FRAME_DURATION as Ae } from "./util.mjs";
|
|
15
|
+
const Te = i.createContext((l) => l), Re = 100, Ne = 1;
|
|
17
16
|
function b(l, a) {
|
|
18
17
|
if (l === a)
|
|
19
18
|
return !0;
|
|
@@ -29,13 +28,11 @@ function b(l, a) {
|
|
|
29
28
|
}
|
|
30
29
|
return !0;
|
|
31
30
|
}
|
|
32
|
-
const
|
|
31
|
+
const ze = {
|
|
33
32
|
left: -1e3,
|
|
34
33
|
top: 0
|
|
35
34
|
}, te = i.forwardRef((l, a) => {
|
|
36
|
-
const R = i.useContext(
|
|
37
|
-
ye(Re);
|
|
38
|
-
const {
|
|
35
|
+
const R = i.useContext(Te).call(void 0, l), {
|
|
39
36
|
collision: m = g.collision,
|
|
40
37
|
anchorAlign: h = g.anchorAlign,
|
|
41
38
|
popupAlign: v = g.popupAlign,
|
|
@@ -55,11 +52,11 @@ const Me = {
|
|
|
55
52
|
onMouseDownOutside: X,
|
|
56
53
|
onClose: W,
|
|
57
54
|
className: I,
|
|
58
|
-
popupClass:
|
|
55
|
+
popupClass: L,
|
|
59
56
|
id: se,
|
|
60
|
-
style:
|
|
57
|
+
style: M,
|
|
61
58
|
children: ce
|
|
62
|
-
} = R, le =
|
|
59
|
+
} = R, le = ye(), S = R.unstyled || le, C = S && S.uPopup, [n, U] = i.useState({
|
|
63
60
|
current: "hidden",
|
|
64
61
|
previous: "hidden",
|
|
65
62
|
props: {}
|
|
@@ -68,7 +65,7 @@ const Me = {
|
|
|
68
65
|
}, k = (e) => {
|
|
69
66
|
const { width: r, height: d } = e.style;
|
|
70
67
|
e.style.width = e.offsetWidth + "px", e.style.height = e.offsetHeight + "px";
|
|
71
|
-
const f =
|
|
68
|
+
const f = be({
|
|
72
69
|
anchor: p,
|
|
73
70
|
anchorAlign: h,
|
|
74
71
|
element: e,
|
|
@@ -77,7 +74,7 @@ const Me = {
|
|
|
77
74
|
margin: F,
|
|
78
75
|
positionMode: H,
|
|
79
76
|
scale: oe
|
|
80
|
-
}), u =
|
|
77
|
+
}), u = Ce({
|
|
81
78
|
anchor: p,
|
|
82
79
|
anchorAlign: h,
|
|
83
80
|
element: e,
|
|
@@ -147,12 +144,12 @@ const Me = {
|
|
|
147
144
|
let r = 0, d = 0;
|
|
148
145
|
return e && (e === !0 ? r = d = 300 : (r = e.openDuration || 0, d = e.closeDuration || 0)), { enter: r, exit: d };
|
|
149
146
|
}, fe = (e) => {
|
|
150
|
-
Z(), O.current =
|
|
147
|
+
Z(), O.current = xe.scrollableParents(p || e), O.current && O.current.map((r) => r.addEventListener("scroll", K)), window.addEventListener("resize", K);
|
|
151
148
|
}, Z = () => {
|
|
152
149
|
O.current && (O.current.map((e) => e.removeEventListener("scroll", K)), O.current = void 0), window.removeEventListener("resize", K);
|
|
153
|
-
}, K =
|
|
150
|
+
}, K = De(() => {
|
|
154
151
|
o.current !== "hidden" && o.current !== "hiding" && U({ ...n, current: "reposition", previous: o.current });
|
|
155
|
-
},
|
|
152
|
+
}, Ae), de = () => Y ? Y + Ne : Re, Y = Pe() || 0, _ = i.useRef(), O = i.useRef(), c = i.useRef(null), E = i.useRef(null), $ = i.useRef({}), j = i.useRef(!1);
|
|
156
153
|
i.useImperativeHandle(E, () => ({
|
|
157
154
|
element: c.current,
|
|
158
155
|
setPosition: k,
|
|
@@ -169,13 +166,13 @@ const Me = {
|
|
|
169
166
|
collision: m,
|
|
170
167
|
popupAlign: v,
|
|
171
168
|
className: I,
|
|
172
|
-
popupClass:
|
|
173
|
-
style:
|
|
169
|
+
popupClass: L,
|
|
170
|
+
style: M,
|
|
174
171
|
offset: N,
|
|
175
172
|
contentKey: z
|
|
176
173
|
}
|
|
177
174
|
};
|
|
178
|
-
return y ? n.current === "hidden" || n.current === "hiding" ? { ...e, current: "showing", previous: n.current } : n.current === "showing" ? { ...e, current: "shown", previous: n.current } : n.current === "shown" && (!b(N, n.props.offset) || !b(h, n.props.anchorAlign) || !b(P, n.props.appendTo) || !b(m, n.props.collision) || !b(v, n.props.popupAlign) || !b(
|
|
175
|
+
return y ? n.current === "hidden" || n.current === "hiding" ? { ...e, current: "showing", previous: n.current } : n.current === "showing" ? { ...e, current: "shown", previous: n.current } : n.current === "shown" && (!b(N, n.props.offset) || !b(h, n.props.anchorAlign) || !b(P, n.props.appendTo) || !b(m, n.props.collision) || !b(v, n.props.popupAlign) || !b(M, n.props.style) || p !== n.props.anchor || L !== n.props.popupClass || I !== n.props.className) ? { ...e, current: "reposition", previous: n.current } : e : n.current === "hiding" || n.current === "hidden" ? { ...e, current: "hidden", previous: n.current } : { ...e, current: "hiding", previous: n.current };
|
|
179
176
|
}, [
|
|
180
177
|
y,
|
|
181
178
|
p,
|
|
@@ -184,8 +181,8 @@ const Me = {
|
|
|
184
181
|
m,
|
|
185
182
|
v,
|
|
186
183
|
I,
|
|
187
|
-
M,
|
|
188
184
|
L,
|
|
185
|
+
M,
|
|
189
186
|
N,
|
|
190
187
|
z,
|
|
191
188
|
n
|
|
@@ -197,13 +194,13 @@ const Me = {
|
|
|
197
194
|
}, [o]), i.useEffect(() => (o.current === "showing" && c.current && B(c.current), () => {
|
|
198
195
|
Z();
|
|
199
196
|
}), []);
|
|
200
|
-
const ee = P || (
|
|
197
|
+
const ee = P || (Oe ? p && p.ownerDocument ? p.ownerDocument.body : document.body : void 0), me = Object.assign(
|
|
201
198
|
{},
|
|
202
199
|
{ position: H, top: 0, left: -1e4 },
|
|
203
|
-
|
|
200
|
+
M || {}
|
|
204
201
|
), he = o.current === "hiding";
|
|
205
202
|
if ((y || he) && ee) {
|
|
206
|
-
const e = de(), r = /* @__PURE__ */ i.createElement(
|
|
203
|
+
const e = de(), r = /* @__PURE__ */ i.createElement(Ee.Provider, { value: e }, /* @__PURE__ */ i.createElement(
|
|
207
204
|
"div",
|
|
208
205
|
{
|
|
209
206
|
onKeyDown: ie,
|
|
@@ -221,7 +218,7 @@ const Me = {
|
|
|
221
218
|
className: D(A.animationChild({ c: C })),
|
|
222
219
|
style: { transitionDelay: "0ms" }
|
|
223
220
|
},
|
|
224
|
-
/* @__PURE__ */ i.createElement("div", { role: re, className: D(A.popup({ c: C }),
|
|
221
|
+
/* @__PURE__ */ i.createElement("div", { role: re, className: D(A.popup({ c: C }), L) }, ce)
|
|
225
222
|
)
|
|
226
223
|
));
|
|
227
224
|
return P !== null ? we.createPortal(r, ee) : r;
|
|
@@ -240,7 +237,7 @@ const Me = {
|
|
|
240
237
|
horizontal: s.left,
|
|
241
238
|
vertical: s.top
|
|
242
239
|
},
|
|
243
|
-
offset:
|
|
240
|
+
offset: ze,
|
|
244
241
|
animate: !0,
|
|
245
242
|
show: !1,
|
|
246
243
|
margin: {
|
|
@@ -302,6 +299,6 @@ te.propTypes = {
|
|
|
302
299
|
};
|
|
303
300
|
export {
|
|
304
301
|
te as Popup,
|
|
305
|
-
|
|
302
|
+
Te as PopupPropsContext,
|
|
306
303
|
g as popupDefaultProps
|
|
307
304
|
};
|
|
@@ -12,4 +12,4 @@
|
|
|
12
12
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
13
13
|
*-------------------------------------------------------------------------------------------
|
|
14
14
|
*/
|
|
15
|
-
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("react-dom"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-popup-common")):"function"==typeof define&&define.amd?define(["exports","react","react-dom","prop-types","@progress/kendo-react-common","@progress/kendo-popup-common"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactPopup={},e.React,e.ReactDOM,e.PropTypes,e.KendoReactCommon,e.KendoPopupCommon)}(this,(function(e,n,t,o,r,i){"use strict";function s(e){var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var l=s(n),c=s(t);const u=(e,n,t)=>{e.style.transitionDuration="",n&&e.classList.remove(...n.split(" ")),t&&e.classList.remove(...t.split(" "))},p="undefined"!=typeof window&&/Firefox/.test(window.navigator.userAgent),a=(e,n,t,o,i,s)=>{if(0===t)return i();const l=r.classNames(r.uPopup.slide({direction:n,type:o,c:s})),c=r.classNames(r.uPopup.slideActive({direction:n,type:o,c:s})),a=n=>{n.target===e&&(e.removeEventListener("transitionend",a),u(e,l,c),e.style.display="exit"===o?"none":"",i())};e.addEventListener("transitionend",a);const d=e.ownerDocument;if(!d)return;const f=d.defaultView;if(!f)return;const m=()=>{u(e,l,c),"enter"===o&&(e.style.display=""),l&&e.classList.add(...l.split(" ").filter((e=>e))),f.requestAnimationFrame((()=>{e.style.transitionDuration=t+"ms",e.classList.add(...c.split(" ").filter((e=>e)))}))};p?f.requestAnimationFrame(m):m()},d=
|
|
15
|
+
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("react-dom"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-popup-common")):"function"==typeof define&&define.amd?define(["exports","react","react-dom","prop-types","@progress/kendo-react-common","@progress/kendo-popup-common"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactPopup={},e.React,e.ReactDOM,e.PropTypes,e.KendoReactCommon,e.KendoPopupCommon)}(this,(function(e,n,t,o,r,i){"use strict";function s(e){var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var l=s(n),c=s(t);const u=(e,n,t)=>{e.style.transitionDuration="",n&&e.classList.remove(...n.split(" ")),t&&e.classList.remove(...t.split(" "))},p="undefined"!=typeof window&&/Firefox/.test(window.navigator.userAgent),a=(e,n,t,o,i,s)=>{if(0===t)return i();const l=r.classNames(r.uPopup.slide({direction:n,type:o,c:s})),c=r.classNames(r.uPopup.slideActive({direction:n,type:o,c:s})),a=n=>{n.target===e&&(e.removeEventListener("transitionend",a),u(e,l,c),e.style.display="exit"===o?"none":"",i())};e.addEventListener("transitionend",a);const d=e.ownerDocument;if(!d)return;const f=d.defaultView;if(!f)return;const m=()=>{u(e,l,c),"enter"===o&&(e.style.display=""),l&&e.classList.add(...l.split(" ").filter((e=>e))),f.requestAnimationFrame((()=>{e.style.transitionDuration=t+"ms",e.classList.add(...c.split(" ").filter((e=>e)))}))};p?f.requestAnimationFrame(m):m()},d=l.createContext((e=>e));function f(e,n){if(e===n)return!0;if(!!e!=!!n)return!1;const t=Object.getOwnPropertyNames(e),o=Object.getOwnPropertyNames(n);if(t.length!==o.length)return!1;for(let o=0;o<t.length;o++){const r=t[o];if(e[r]!==n[r])return!1}return!0}const m=l.forwardRef(((e,n)=>{const t=l.useContext(d).call(void 0,e),{collision:o=g.collision,anchorAlign:s=g.anchorAlign,popupAlign:u=g.popupAlign,offset:p=g.offset,animate:m=g.animate,show:h=g.show,margin:v=g.margin,positionMode:w=g.positionMode,appendTo:y,contentKey:P,anchor:A,scale:b,role:O,onKeyDown:C,onPosition:T,onOpen:x,onMouseDownOutside:D,onClose:E,className:N,popupClass:L,id:R,style:z,children:K}=t,j=r.useUnstyled(),M=t.unstyled||j,q=M&&M.uPopup,[k,I]=l.useState({current:"hidden",previous:"hidden",props:{}}),F=e=>{null==window||window.addEventListener("mousedown",V),H(e),U(e.firstChild,"enter",S),I({...te,current:"shown",previous:te.current})},H=e=>{const{width:n,height:t}=e.style;e.style.width=e.offsetWidth+"px",e.style.height=e.offsetHeight+"px";const r=i.alignElement({anchor:A,anchorAlign:s,element:e,elementAlign:u,offset:p,margin:v,positionMode:w,scale:b}),l=i.positionElement({anchor:A,anchorAlign:s,element:e,elementAlign:u,collisions:o,currentLocation:r,margin:v});if(e.style.top=l.offset.top+"px",e.style.left=l.offset.left+"px",e.style.width=n,e.style.height=t,X.current={fit:l.fit,fitted:l.fitted,flip:l.flip,flipped:l.flipped},T){const e={target:_.current,flipped:l.flipped,fitted:l.fitted};T.call(void 0,e)}},S=()=>{const e=$.current;e&&(h&&e.classList.add(...r.classNames(r.uPopup.animationContainerShown({c:q})).split(" ").filter((e=>e))),B(e),x&&x.call(void 0,{target:_.current}))},U=(e,n,t)=>{if(!u)return;let o;const{horizontal:r,vertical:i}=u;o="left"===r&&"center"===i?"right":"right"===r&&"center"===i?"left":"top"===i?"down":"up";X.current&&X.current.flipped&&(o={down:"up",up:"down",left:"right",right:"left"}[o]),a(e,o,W()[n],n,t,q)},V=e=>{var n;const t=null===(null==(n=null==e?void 0:e.target)?void 0:n.closest(".k-animation-container")),o=(null==A?void 0:A.contains(null==e?void 0:e.target))||!1;if(t){if(D){const n={target:_.current,event:e,state:k,isAnchorClicked:o};D.call(void 0,n)}null==window||window.removeEventListener("mousedown",V)}},Z=()=>{"hiding"===te.current&&("shown"===te.previous||"reposition"===te.previous)&&I({...te,current:"hidden",previous:te.current}),E&&E.call(void 0,{target:_.current})},W=()=>{const e=m;let n=0,t=0;return e&&(!0===e?n=t=300:(n=e.openDuration||0,t=e.closeDuration||0)),{enter:n,exit:t}},B=e=>{G(),Y.current=i.domUtils.scrollableParents(A||e),Y.current&&Y.current.map((e=>e.addEventListener("scroll",J))),window.addEventListener("resize",J)},G=()=>{Y.current&&(Y.current.map((e=>e.removeEventListener("scroll",J))),Y.current=void 0),window.removeEventListener("resize",J)},J=function(e,n,t={}){let o,r,i,s,l=0;t=t||{};const c=function(){l=!1===t.leading?0:(new Date).getTime(),o=void 0,s=e.apply(r,i),o||(r=i=null)};return function(){const u=(new Date).getTime();!l&&!1===t.leading&&(l=u);const p=n-(u-l);return r=void 0,i=arguments,p<=0||p>n?(o&&(clearTimeout(o),o=void 0),l=u,s=e.apply(r,i),o||(r=i=null)):!o&&!1!==t.trailing&&(o=window.setTimeout(c,p)),s}}((()=>{"hidden"!==te.current&&"hiding"!==te.current&&I({...k,current:"reposition",previous:te.current})}),16.666666666666668),Q=r.useZIndexContext()||0,X=l.useRef(),Y=l.useRef(),$=l.useRef(null),_=l.useRef(null),ee=l.useRef({}),ne=l.useRef(!1);l.useImperativeHandle(_,(()=>({element:$.current,setPosition:H,props:e}))),l.useImperativeHandle(n,(()=>_.current));const te=l.useMemo((()=>{const e={...k,props:{show:h,anchor:A,anchorAlign:s,appendTo:y,collision:o,popupAlign:u,className:N,popupClass:L,style:z,offset:p,contentKey:P}};return h?"hidden"===k.current||"hiding"===k.current?{...e,current:"showing",previous:k.current}:"showing"===k.current?{...e,current:"shown",previous:k.current}:"shown"!==k.current||f(p,k.props.offset)&&f(s,k.props.anchorAlign)&&f(y,k.props.appendTo)&&f(o,k.props.collision)&&f(u,k.props.popupAlign)&&f(z,k.props.style)&&A===k.props.anchor&&L===k.props.popupClass&&N===k.props.className?e:{...e,current:"reposition",previous:k.current}:"hiding"===k.current||"hidden"===k.current?{...e,current:"hidden",previous:k.current}:{...e,current:"hiding",previous:k.current}}),[h,A,s,y,o,u,N,L,z,p,P,k]);l.useEffect((()=>{"hiding"===te.current&&!ne.current&&$.current?(ne.current=!0,(e=>{if(!h){const n=M&&M.uPopup;e.classList.remove(...r.classNames(r.uPopup.animationContainerShown({c:n})).split(" ").filter((e=>e)))}G()})($.current),U($.current.firstChild,"exit",Z)):(ne.current=!1,"showing"===te.current&&$.current?F($.current):"hiding"===te.current&&$.current?Z():"reposition"===te.current&&"shown"===te.previous?setTimeout((()=>{I({...te,current:"shown",previous:te.current})}),0):"shown"===te.current&&ee.current.contentKey!==P&&$.current&&H($.current)),"reposition"===te.current&&("shown"===te.previous||"showing"===te.previous)&&$.current&&H($.current),ee.current={contentKey:P}}),[te]),l.useEffect((()=>("showing"===te.current&&$.current&&F($.current),()=>{G()})),[]);const oe=y||(r.canUseDOM?A&&A.ownerDocument?A.ownerDocument.body:document.body:void 0),re=Object.assign({},{position:w,top:0,left:-1e4},z||{}),ie="hiding"===te.current;if((h||ie)&&oe){const e=Q?Q+1:100,n=l.createElement(r.ZIndexContext.Provider,{value:e},l.createElement("div",{onKeyDown:C,className:r.classNames(r.uPopup.animationContainer({c:q}),N),id:R,ref:$,style:{zIndex:e,...re}},l.createElement("div",{className:r.classNames(r.uPopup.animationChild({c:q})),style:{transitionDelay:"0ms"}},l.createElement("div",{role:O,className:r.classNames(r.uPopup.popup({c:q}),L)},K))));return null!==y?c.createPortal(n,oe):n}return null})),g={collision:{horizontal:i.Collision.fit,vertical:i.Collision.flip},anchorAlign:{horizontal:i.AlignPoint.left,vertical:i.AlignPoint.bottom},popupAlign:{horizontal:i.AlignPoint.left,vertical:i.AlignPoint.top},offset:{left:-1e3,top:0},animate:!0,show:!1,margin:{horizontal:0,vertical:0},positionMode:"absolute"};m.displayName="Popup",m.propTypes={anchor:function(e){const n=e.anchor;return n&&"number"!=typeof n.nodeType?new Error("Invalid prop `anchor` supplied to `Kendo React Popup`. Validation failed."):null},appendTo:function(e){const n=e.appendTo;return n&&"number"!=typeof n.nodeType?new Error("Invalid prop `appendTo` supplied to `Kendo React Popup`. Validation failed."):null},className:o.oneOfType([o.string,o.arrayOf(o.string.isRequired)]),id:o.string,popupClass:o.oneOfType([o.string,o.arrayOf(o.string),o.object]),collision:o.shape({horizontal:o.oneOf([i.Collision.fit,i.Collision.flip,i.Collision.none]),vertical:o.oneOf([i.Collision.fit,i.Collision.flip,i.Collision.none])}),anchorAlign:o.shape({horizontal:o.oneOf([i.AlignPoint.left,i.AlignPoint.center,i.AlignPoint.right]),vertical:o.oneOf([i.AlignPoint.top,i.AlignPoint.center,i.AlignPoint.bottom])}),popupAlign:o.shape({horizontal:o.oneOf([i.AlignPoint.left,i.AlignPoint.center,i.AlignPoint.right]),vertical:o.oneOf([i.AlignPoint.top,i.AlignPoint.center,i.AlignPoint.bottom])}),offset:o.shape({left:o.number,top:o.number}),children:o.oneOfType([o.element,o.node]),show:o.bool,animate:o.oneOfType([o.bool,o.shape({openDuration:o.number,closeDuration:o.number})]),margin:o.shape({horizontal:o.number,vertical:o.number}),positionMode:o.oneOf(["fixed","absolute"]),scale:o.number,style:o.object,onClose:o.func,onPosition:o.func,onOpen:o.func,onKeyDown:o.func,onMouseDownOutside:o.func},e.Popup=m,e.PopupPropsContext=d}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-popup",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "10.0.0-develop.1",
|
|
4
4
|
"description": "React Popup positions a piece of content next to a specific anchor component. KendoReact Popup package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"@progress/kendo-licensing": "^1.5.0",
|
|
29
29
|
"@progress/kendo-popup-common": "^1.9.0",
|
|
30
|
-
"@progress/kendo-react-common": "
|
|
30
|
+
"@progress/kendo-react-common": "10.0.0-develop.1",
|
|
31
31
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
|
|
32
32
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
|
|
33
33
|
},
|
|
@@ -48,13 +48,7 @@
|
|
|
48
48
|
],
|
|
49
49
|
"@progress": {
|
|
50
50
|
"friendlyName": "Popup",
|
|
51
|
-
"framework": "KendoReact"
|
|
52
|
-
"package": {
|
|
53
|
-
"productName": "KendoReact",
|
|
54
|
-
"productCode": "KENDOUIREACT",
|
|
55
|
-
"publishDate": 1741090568,
|
|
56
|
-
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
57
|
-
}
|
|
51
|
+
"framework": "KendoReact"
|
|
58
52
|
},
|
|
59
53
|
"repository": {
|
|
60
54
|
"type": "git",
|
package/package-metadata.js
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
|
-
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
-
*-------------------------------------------------------------------------------------------
|
|
7
|
-
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-popup",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1741090568,version:"9.5.0",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;
|
package/package-metadata.mjs
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
|
-
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
-
*-------------------------------------------------------------------------------------------
|
|
7
|
-
*/
|
|
8
|
-
const e = {
|
|
9
|
-
name: "@progress/kendo-react-popup",
|
|
10
|
-
productName: "KendoReact",
|
|
11
|
-
productCode: "KENDOUIREACT",
|
|
12
|
-
productCodes: ["KENDOUIREACT"],
|
|
13
|
-
publishDate: 1741090568,
|
|
14
|
-
version: "9.5.0",
|
|
15
|
-
licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
16
|
-
};
|
|
17
|
-
export {
|
|
18
|
-
e as packageMetadata
|
|
19
|
-
};
|