@progress/kendo-react-dialogs 14.5.0-develop.1 → 14.5.0-develop.11
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/Dialog.js +1 -1
- package/Dialog.mjs +69 -74
- package/DialogProps.d.ts +0 -14
- package/DialogTitleBar.js +1 -1
- package/DialogTitleBar.mjs +1 -0
- package/Window.js +1 -1
- package/Window.mjs +81 -83
- package/WindowProps.d.ts +0 -14
- package/WindowTitlebar.js +1 -1
- package/WindowTitlebar.mjs +12 -8
- package/dist/cdn/js/kendo-react-dialogs.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +11 -6
package/Dialog.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),V=require("react-dom"),o=require("prop-types"),W=require("./DialogTitleBar.js"),z=require("./DialogActionsBar.js"),n=require("@progress/kendo-react-common"),E=require("./constants.js");function U(c){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const l in c)if(l!=="default"){const a=Object.getOwnPropertyDescriptor(c,l);Object.defineProperty(i,l,a.get?a:{enumerable:!0,get:()=>c[l]})}}return i.default=c,Object.freeze(i)}const t=U($),X=U(V),G=n.createPropsContext(),O=t.forwardRef((c,i)=>{const l=n.useZIndexContext(),a=l?l+E.ZINDEX_DIALOGS_STEP:E.DEFAULT_DIALOGS_ZINDEX,T=t.useRef(null),r=t.useRef(null),u=t.useRef(n.getActiveElement(document)),k=n.usePropsContext(G,c),s=t.useMemo(()=>({...m,...k}),[k]),{title:y,width:v,height:S,children:p,minWidth:P,dir:_,style:h,contentStyle:x,autoFocusedElement:f,appendTo:A,className:D,overlayStyle:M,modal:N=m.modal,closeIcon:R=m.closeIcon,autoFocus:b=m.autoFocus}=s,F=t.useCallback(()=>({props:s,element:r.current}),[s]);t.useImperativeHandle(T,F),t.useImperativeHandle(i,()=>T.current);const w=t.useMemo(()=>t.Children.toArray(p).filter(e=>!t.isValidElement(e)||e.type!==z.DialogActionsBar),[p]),j=t.useMemo(()=>t.Children.toArray(p).filter(e=>t.isValidElement(e)&&e.type===z.DialogActionsBar),[p]),{_id:q,contentId:C,id:I}=t.useMemo(()=>{const e=s.id,d=`${e!=null?e:"accessibility"}-id`,H=`dialog-title-${d}`,K=`dialog-content-${d}`;return{_id:d,contentId:K,id:e||H}},[s.id]),B=t.useCallback(()=>{if(r.current)if(b&&!f)r.current.focus();else if(!b&&f&&r.current){const e=r.current.querySelector(f);e==null||e.focus()}else{const e=[...n.FOCUSABLE_ELEMENTS].map(d=>d+":not(.k-dialog-titlebar *)");n.focusFirstFocusableChild(r.current,e)}},[b,f]);t.useEffect(()=>(B(),()=>{setTimeout(()=>{var e;!r.current&&u.current&&n.canUseDOM&&(document.contains(u.current)?u.current.focus():u.current.id&&((e=document.getElementById(u.current.id))==null||e.focus()))})}),[B]);const g=t.useCallback(e=>{e.preventDefault(),n.dispatchEvent(s.onClose,e,F(),void 0)},[s.onClose]),L=t.useCallback(e=>{e.keyCode===n.Keys.esc&&s.onClose&&(e.preventDefault(),g(e)),n.keepFocusInContainer(e,r.current)},[s.onClose,g]),Z=t.useMemo(()=>t.createElement(n.ZIndexContext.Provider,{value:a},t.createElement("div",{ref:r,[E.DATA_DIALOGS_ID]:q,className:"k-dialog-wrapper"+(D?" "+D:""),onKeyDown:L,tabIndex:0,dir:_,style:{zIndex:a,...h}},N&&t.createElement("div",{className:"k-overlay",style:M}),t.createElement("div",{className:n.classNames("k-window k-dialog"),role:"dialog","aria-labelledby":I,"aria-modal":!0,"aria-describedby":C,style:{width:v,height:S,minWidth:P}},y&&t.createElement(W.DialogTitleBar,{closeIcon:R,onCloseButtonClick:g,id:I},y),t.createElement("div",{className:"k-window-content k-dialog-content",style:x,id:C},w),j))),[a,q,D,L,h,_,M,I,C,v,S,P,R,g,x,y,w,j,N]);return n.canUseDOM?A!==null?X.createPortal(Z,A||document.body):Z:null}),m={autoFocus:!1,modal:!0,closeIcon:!0},J={autoFocus:o.bool,autoFocusedElement:o.string,title:o.any,className:o.string,closeIcon:o.bool,modal:o.bool,overlayStyle:o.object,width:o.oneOfType([o.number,o.string]),height:o.oneOfType([o.number,o.string]),minWidth:o.oneOfType([o.number,o.string]),onClose:o.func,children:o.node,id:o.string,dir:o.string,style:o.object,contentStyle:o.object,appendTo:o.any};O.displayName="KendoReactDialog";O.propTypes=J;exports.Dialog=O;exports.DialogDefaultProps=m;exports.DialogPropsContext=G;
|
package/Dialog.mjs
CHANGED
|
@@ -9,33 +9,32 @@ import * as t from "react";
|
|
|
9
9
|
import * as K from "react-dom";
|
|
10
10
|
import o from "prop-types";
|
|
11
11
|
import { DialogTitleBar as U } from "./DialogTitleBar.mjs";
|
|
12
|
-
import { DialogActionsBar as
|
|
13
|
-
import { useZIndexContext as
|
|
14
|
-
import { DEFAULT_DIALOGS_ZINDEX as
|
|
15
|
-
const
|
|
16
|
-
const I =
|
|
12
|
+
import { DialogActionsBar as L } from "./DialogActionsBar.mjs";
|
|
13
|
+
import { useZIndexContext as $, getActiveElement as V, usePropsContext as W, FOCUSABLE_ELEMENTS as X, focusFirstFocusableChild as q, canUseDOM as B, dispatchEvent as J, Keys as Q, keepFocusInContainer as Y, ZIndexContext as ee, classNames as te, createPropsContext as oe } from "@progress/kendo-react-common";
|
|
14
|
+
import { DEFAULT_DIALOGS_ZINDEX as ne, DATA_DIALOGS_ID as re, ZINDEX_DIALOGS_STEP as se } from "./constants.mjs";
|
|
15
|
+
const le = oe(), Z = t.forwardRef((j, z) => {
|
|
16
|
+
const I = $(), d = I ? I + se : ne, C = t.useRef(null), n = t.useRef(null), s = t.useRef(V(document)), E = W(le, j), r = t.useMemo(
|
|
17
17
|
() => ({
|
|
18
|
-
...
|
|
19
|
-
...
|
|
18
|
+
...u,
|
|
19
|
+
...E
|
|
20
20
|
}),
|
|
21
|
-
[
|
|
21
|
+
[E]
|
|
22
22
|
), {
|
|
23
23
|
title: m,
|
|
24
|
-
width:
|
|
25
|
-
height:
|
|
24
|
+
width: b,
|
|
25
|
+
height: D,
|
|
26
26
|
children: c,
|
|
27
27
|
minWidth: k,
|
|
28
28
|
dir: v,
|
|
29
29
|
style: T,
|
|
30
|
-
|
|
31
|
-
contentStyle: x,
|
|
30
|
+
contentStyle: h,
|
|
32
31
|
autoFocusedElement: a,
|
|
33
|
-
appendTo:
|
|
34
|
-
className:
|
|
35
|
-
overlayStyle:
|
|
36
|
-
modal: A =
|
|
37
|
-
closeIcon: F =
|
|
38
|
-
autoFocus:
|
|
32
|
+
appendTo: x,
|
|
33
|
+
className: p,
|
|
34
|
+
overlayStyle: S,
|
|
35
|
+
modal: A = u.modal,
|
|
36
|
+
closeIcon: F = u.closeIcon,
|
|
37
|
+
autoFocus: f = u.autoFocus
|
|
39
38
|
} = r, N = t.useCallback(
|
|
40
39
|
() => ({
|
|
41
40
|
props: r,
|
|
@@ -43,103 +42,100 @@ const ce = ne(), $ = t.forwardRef((j, z) => {
|
|
|
43
42
|
}),
|
|
44
43
|
[r]
|
|
45
44
|
);
|
|
46
|
-
t.useImperativeHandle(
|
|
47
|
-
const
|
|
48
|
-
(e) => !t.isValidElement(e) || e.type !==
|
|
49
|
-
), [c]),
|
|
50
|
-
(e) => t.isValidElement(e) && e.type ===
|
|
51
|
-
), [c]), { _id:
|
|
52
|
-
const e = r.id,
|
|
53
|
-
return { _id:
|
|
54
|
-
}, [r.id]),
|
|
45
|
+
t.useImperativeHandle(C, N), t.useImperativeHandle(z, () => C.current);
|
|
46
|
+
const w = t.useMemo(() => t.Children.toArray(c).filter(
|
|
47
|
+
(e) => !t.isValidElement(e) || e.type !== L
|
|
48
|
+
), [c]), O = t.useMemo(() => t.Children.toArray(c).filter(
|
|
49
|
+
(e) => t.isValidElement(e) && e.type === L
|
|
50
|
+
), [c]), { _id: P, contentId: y, id: g } = t.useMemo(() => {
|
|
51
|
+
const e = r.id, l = `${e != null ? e : "accessibility"}-id`, G = `dialog-title-${l}`, H = `dialog-content-${l}`;
|
|
52
|
+
return { _id: l, contentId: H, id: e || G };
|
|
53
|
+
}, [r.id]), R = t.useCallback(() => {
|
|
55
54
|
if (n.current)
|
|
56
|
-
if (
|
|
55
|
+
if (f && !a)
|
|
57
56
|
n.current.focus();
|
|
58
|
-
else if (!
|
|
57
|
+
else if (!f && a && n.current) {
|
|
59
58
|
const e = n.current.querySelector(a);
|
|
60
59
|
e == null || e.focus();
|
|
61
60
|
} else {
|
|
62
|
-
const e = [...
|
|
63
|
-
(
|
|
61
|
+
const e = [...X].map(
|
|
62
|
+
(l) => l + ":not(.k-dialog-titlebar *)"
|
|
64
63
|
);
|
|
65
|
-
|
|
64
|
+
q(n.current, e);
|
|
66
65
|
}
|
|
67
|
-
}, [
|
|
68
|
-
t.useEffect(() => (
|
|
66
|
+
}, [f, a]);
|
|
67
|
+
t.useEffect(() => (R(), () => {
|
|
69
68
|
setTimeout(() => {
|
|
70
69
|
var e;
|
|
71
|
-
!n.current &&
|
|
70
|
+
!n.current && s.current && B && (document.contains(s.current) ? s.current.focus() : s.current.id && ((e = document.getElementById(s.current.id)) == null || e.focus()));
|
|
72
71
|
});
|
|
73
|
-
}), [
|
|
72
|
+
}), [R]);
|
|
74
73
|
const i = t.useCallback(
|
|
75
74
|
(e) => {
|
|
76
|
-
e.preventDefault(),
|
|
75
|
+
e.preventDefault(), J(r.onClose, e, N(), void 0);
|
|
77
76
|
},
|
|
78
77
|
[r.onClose]
|
|
79
|
-
),
|
|
78
|
+
), _ = t.useCallback(
|
|
80
79
|
(e) => {
|
|
81
|
-
e.keyCode ===
|
|
80
|
+
e.keyCode === Q.esc && r.onClose && (e.preventDefault(), i(e)), Y(e, n.current);
|
|
82
81
|
},
|
|
83
82
|
[r.onClose, i]
|
|
84
|
-
),
|
|
83
|
+
), M = t.useMemo(() => /* @__PURE__ */ t.createElement(ee.Provider, { value: d }, /* @__PURE__ */ t.createElement(
|
|
85
84
|
"div",
|
|
86
85
|
{
|
|
87
86
|
ref: n,
|
|
88
|
-
[
|
|
89
|
-
className: "k-dialog-wrapper" + (
|
|
90
|
-
onKeyDown:
|
|
87
|
+
[re]: P,
|
|
88
|
+
className: "k-dialog-wrapper" + (p ? " " + p : ""),
|
|
89
|
+
onKeyDown: _,
|
|
91
90
|
tabIndex: 0,
|
|
92
91
|
dir: v,
|
|
93
92
|
style: {
|
|
94
|
-
zIndex:
|
|
93
|
+
zIndex: d,
|
|
95
94
|
...T
|
|
96
95
|
}
|
|
97
96
|
},
|
|
98
|
-
A && /* @__PURE__ */ t.createElement("div", { className: "k-overlay", style:
|
|
97
|
+
A && /* @__PURE__ */ t.createElement("div", { className: "k-overlay", style: S }),
|
|
99
98
|
/* @__PURE__ */ t.createElement(
|
|
100
99
|
"div",
|
|
101
100
|
{
|
|
102
|
-
className:
|
|
103
|
-
[`k-window-${p}`]: p
|
|
104
|
-
}),
|
|
101
|
+
className: te("k-window k-dialog"),
|
|
105
102
|
role: "dialog",
|
|
106
|
-
"aria-labelledby":
|
|
103
|
+
"aria-labelledby": g,
|
|
107
104
|
"aria-modal": !0,
|
|
108
|
-
"aria-describedby":
|
|
109
|
-
style: { width:
|
|
105
|
+
"aria-describedby": y,
|
|
106
|
+
style: { width: b, height: D, minWidth: k }
|
|
110
107
|
},
|
|
111
|
-
m && /* @__PURE__ */ t.createElement(U, { closeIcon: F, onCloseButtonClick: i, id:
|
|
112
|
-
/* @__PURE__ */ t.createElement("div", { className: "k-window-content k-dialog-content", style:
|
|
113
|
-
|
|
108
|
+
m && /* @__PURE__ */ t.createElement(U, { closeIcon: F, onCloseButtonClick: i, id: g }, m),
|
|
109
|
+
/* @__PURE__ */ t.createElement("div", { className: "k-window-content k-dialog-content", style: h, id: y }, w),
|
|
110
|
+
O
|
|
114
111
|
)
|
|
115
112
|
)), [
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
113
|
+
d,
|
|
114
|
+
P,
|
|
115
|
+
p,
|
|
116
|
+
_,
|
|
120
117
|
T,
|
|
121
118
|
v,
|
|
122
|
-
|
|
123
|
-
p,
|
|
124
|
-
C,
|
|
119
|
+
S,
|
|
125
120
|
g,
|
|
121
|
+
y,
|
|
122
|
+
b,
|
|
126
123
|
D,
|
|
127
|
-
h,
|
|
128
124
|
k,
|
|
129
125
|
F,
|
|
130
126
|
i,
|
|
131
|
-
|
|
127
|
+
h,
|
|
132
128
|
m,
|
|
129
|
+
w,
|
|
133
130
|
O,
|
|
134
|
-
P,
|
|
135
131
|
A
|
|
136
132
|
]);
|
|
137
|
-
return
|
|
138
|
-
}),
|
|
133
|
+
return B ? x !== null ? K.createPortal(M, x || document.body) : M : null;
|
|
134
|
+
}), u = {
|
|
139
135
|
autoFocus: !1,
|
|
140
136
|
modal: !0,
|
|
141
137
|
closeIcon: !0
|
|
142
|
-
},
|
|
138
|
+
}, ce = {
|
|
143
139
|
autoFocus: o.bool,
|
|
144
140
|
autoFocusedElement: o.string,
|
|
145
141
|
title: o.any,
|
|
@@ -156,13 +152,12 @@ const ce = ne(), $ = t.forwardRef((j, z) => {
|
|
|
156
152
|
dir: o.string,
|
|
157
153
|
style: o.object,
|
|
158
154
|
contentStyle: o.object,
|
|
159
|
-
appendTo: o.any
|
|
160
|
-
themeColor: o.oneOf(["primary", "dark", "light"])
|
|
155
|
+
appendTo: o.any
|
|
161
156
|
};
|
|
162
|
-
|
|
163
|
-
|
|
157
|
+
Z.displayName = "KendoReactDialog";
|
|
158
|
+
Z.propTypes = ce;
|
|
164
159
|
export {
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
160
|
+
Z as Dialog,
|
|
161
|
+
u as DialogDefaultProps,
|
|
162
|
+
le as DialogPropsContext
|
|
168
163
|
};
|
package/DialogProps.d.ts
CHANGED
|
@@ -173,18 +173,4 @@ export interface DialogProps {
|
|
|
173
173
|
* ```
|
|
174
174
|
*/
|
|
175
175
|
appendTo?: any;
|
|
176
|
-
/**
|
|
177
|
-
* Configures the `themeColor` of the Dialog.
|
|
178
|
-
*
|
|
179
|
-
* The available options are:
|
|
180
|
-
* - primary
|
|
181
|
-
* - dark
|
|
182
|
-
* - light
|
|
183
|
-
*
|
|
184
|
-
* @example
|
|
185
|
-
* ```jsx
|
|
186
|
-
* <Dialog themeColor="dark" />
|
|
187
|
-
* ```
|
|
188
|
-
*/
|
|
189
|
-
themeColor?: 'primary' | 'dark' | 'light';
|
|
190
176
|
}
|
package/DialogTitleBar.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 i=require("react"),l=require("@progress/kendo-react-buttons"),r=require("@progress/kendo-svg-icons");function c(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=c(i),s=({children:e,onCloseButtonClick:a,id:t,closeIcon:o})=>n.createElement("div",{className:"k-window-titlebar k-dialog-titlebar",id:t},n.createElement("span",{className:"k-window-title k-dialog-title"},e),o&&n.createElement("div",{className:"k-window-titlebar-actions k-dialog-titlebar-actions"},n.createElement(l.Button,{role:"button","aria-label":"Close",onClick:a,icon:"x",svgIcon:r.xIcon,fillMode:"flat",className:"k-window-titlebar-action k-dialog-titlebar-action"})));exports.DialogTitleBar=s;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react"),l=require("@progress/kendo-react-buttons"),r=require("@progress/kendo-svg-icons");function c(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=c(i),s=({children:e,onCloseButtonClick:a,id:t,closeIcon:o})=>n.createElement("div",{className:"k-window-titlebar k-dialog-titlebar",id:t},n.createElement("span",{className:"k-window-title k-dialog-title"},e),o&&n.createElement("div",{className:"k-window-titlebar-actions k-dialog-titlebar-actions"},n.createElement(l.Button,{role:"button","aria-label":"Close",size:"xs",onClick:a,icon:"x",svgIcon:r.xIcon,fillMode:"flat",className:"k-window-titlebar-action k-dialog-titlebar-action"})));exports.DialogTitleBar=s;
|
package/DialogTitleBar.mjs
CHANGED
package/Window.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 dt=require("react"),lt=require("react-dom"),i=require("prop-types"),ut=require("./WindowTitlebar.js"),a=require("@progress/kendo-react-common"),ft=require("./WindowResizeHandlers.js"),gt=require("./MiddleLayerOptimization.js"),o=require("./StageEnum.js"),Ze=require("./WindowActionsBar.js"),ee=require("./constants.js"),Ke=require("./utils.js");function Pe(e){const C=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const R in e)if(R!=="default"){const _=Object.getOwnPropertyDescriptor(e,R);Object.defineProperty(C,R,_.get?_:{enumerable:!0,get:()=>e[R]})}}return C.default=e,Object.freeze(C)}const m=Pe(dt),ht=Pe(lt),{useState:N,useEffect:O,useCallback:u,useMemo:X,useRef:U,useImperativeHandle:st,useContext:wt,forwardRef:Et}=m,te=300,ne=300,se=120,we=100,y=5,z={minWidth:se,minHeight:we,resizable:!0,draggable:!0,modal:!1,doubleClickStageChange:!0,autoFocus:!0},Ee=Et((e,C)=>{var Me;const{minWidth:R=z.minWidth,minHeight:_=z.minHeight,resizable:ue=z.resizable,draggable:me=z.draggable,modal:fe=z.modal,doubleClickStageChange:je=z.doubleClickStageChange,autoFocus:Xe=z.autoFocus}=e,[Ge,G]=N(e.stage||o.windowStage.DEFAULT),[V,ie]=N(!1),[oe,W]=N(0),[ae,v]=N(0),[re,x]=N(te),[ce,A]=N(ne),[Ve,ge]=N(!0),[he,Se]=N(ee.DEFAULT_DIALOGS_ZINDEX),c=(Me=e.stage)!=null?Me:Ge,M=wt(a.ZIndexContext),H=U(null),De=U(null),h=U({leftBeforeAction:0,topBeforeAction:0,widthBeforeAction:te,heightBeforeAction:ne}),Z=U({x:0,y:0}),K=U(void 0),Y=U(a.canUseDOM?document.activeElement:null),Ce=U("window-title-"+(e.id?e.id+"-accessibility-id":"")),k=U({left:0,top:0,width:te,height:ne,internalLeft:ae,internalTop:oe,internalWidth:re,internalHeight:ce,stage:c,draggable:me,props:e}),F=u(()=>{const t=a.canUseDOM?document:null;return e.appendTo?e.appendTo.ownerDocument:t},[e.appendTo]),s=u(()=>{const t=F();return t==null?void 0:t.defaultView},[F]),P=X(()=>{var t;return c!==o.windowStage.FULLSCREEN?Math.max((t=e.top)!=null?t:oe,0):0},[c,e.top,oe]),q=X(()=>{var t;return c!==o.windowStage.FULLSCREEN?Math.max((t=e.left)!=null?t:ae,0):0},[c,e.left,ae]),L=X(()=>{var n;const t=(n=e.width)!=null?n:re;if(c===o.windowStage.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetWidth;const r=s();return r?r.innerWidth:0}return t},[c,e.width,e.appendTo,re,s]),b=X(()=>{const t=e.height===void 0?ce:e.height;if(c===o.windowStage.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetHeight;const n=s();return n?n.innerHeight:0}else if(c===o.windowStage.MINIMIZED)return 0;return t},[c,e.height,e.appendTo,ce,s]),de=X(()=>e.id?e.id+"-accessibility-id":void 0,[e.id]);O(()=>{k.current={left:q,top:P,width:L,height:b,internalLeft:ae,internalTop:oe,internalWidth:re,internalHeight:ce,stage:c,draggable:me,props:e}});const j=X(()=>{if(M===void 0)return M!=null?M:ee.DEFAULT_DIALOGS_ZINDEX;const t=M?M+ee.ZINDEX_DIALOGS_STEP:0;return he>t?he:M+ee.ZINDEX_DIALOGS_STEP},[he,M]),Le=u(()=>{var r,l;if(e.top!==void 0)return e.top;if(e.initialTop!==void 0)return e.initialTop;let t=ne;if(e.height!==void 0?t=e.height:e.initialHeight!==void 0&&(t=e.initialHeight),e.appendTo&&t)return e.appendTo.offsetHeight/2-t/2;const n=s();return n?n.innerHeight/2-((l=t!=null?t:(r=H.current)==null?void 0:r.clientHeight)!=null?l:0)/2:0},[e.top,e.initialTop,e.height,e.initialHeight,e.appendTo,s]),be=u(()=>{if(e.left!==void 0)return e.left;if(e.initialLeft!==void 0)return e.initialLeft;let t=te;if(e.width!==void 0?t=e.width:e.initialWidth!==void 0&&(t=e.initialWidth),e.appendTo)return e.appendTo.offsetWidth/2-t/2;const n=s();return n?n.innerWidth/2-t/2:0},[e.left,e.initialLeft,e.width,e.initialWidth,e.appendTo,s]),Ie=u(()=>{let t=te;return e.width!==void 0?t=e.width:e.initialWidth!==void 0&&(t=e.initialWidth),t},[e.width,e.initialWidth]),ye=u(()=>{let t=ne;return e.height!==void 0?t=e.height:e.initialHeight!==void 0&&(t=e.initialHeight),t},[e.height,e.initialHeight]),Ye=u(t=>t.filter(n=>(n==null?void 0:n.type)===Ze.WindowActionsBar),[]),$e=u(t=>t.filter(n=>n&&n.type!==Ze.WindowActionsBar),[]),w=u(()=>typeof C=="object"&&C!==null&&"current"in C?C.current:null,[C]),B=u((t,n,r,l,d,f)=>{var D,J,Q;if(!t)return;const{internalLeft:S,internalTop:E,internalWidth:T,internalHeight:I}=k.current;t({nativeEvent:n.nativeEvent?n.nativeEvent:n.originalEvent,drag:r,end:l,target:w(),left:(D=d==null?void 0:d.left)!=null?D:S,top:(J=d==null?void 0:d.top)!=null?J:E,width:(Q=f==null?void 0:f.width)!=null?Q:T,height:(f==null?void 0:f.height)===void 0?I:f==null?void 0:f.height})},[w]),Je=u(t=>{var f,S;if(fe&&a.keepFocusInContainer(t,H.current),t.target!==t.currentTarget)return;const n=R||se,r=_||we,l=t.metaKey||t.ctrlKey,d=(S=b!=null?b:(f=H.current)==null?void 0:f.clientHeight)!=null?S:0;if(l&&ue){switch(t.keyCode){case a.Keys.up:t.preventDefault(),r<=d-y&&A(d-y);break;case a.Keys.down:t.preventDefault(),A(d+y);break;case a.Keys.left:n<=L-y&&x(L-y);break;case a.Keys.right:x(L+y);break;default:return}B(e.onResize,t,!1,void 0);return}if(t.altKey){switch(t.keyCode){case a.Keys.up:c===o.windowStage.MINIMIZED?($(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.DEFAULT})):c===o.windowStage.DEFAULT&&(le(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.FULLSCREEN}));break;case a.Keys.down:c===o.windowStage.FULLSCREEN?($(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.DEFAULT})):c===o.windowStage.DEFAULT&&(We(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.MINIMIZED}));break}return}if(!t.ctrlKey){const{internalLeft:E,internalTop:T}=k.current;let I=E,D=T;switch(t.keyCode){case a.Keys.esc:e.onClose&&ve(t);return;case a.Keys.up:D=T-y,W(D);break;case a.Keys.down:D=T+y,W(D);break;case a.Keys.left:I=E-y,v(I);break;case a.Keys.right:I=E+y,v(I);break;default:return}B(e.onMove,t,!1,void 0,{left:I,top:D})}},[fe,R,_,ue,e.onResize,e.onStageChange,e.onClose,e.onMove,b,L,c,B,w]),Qe=u(t=>{const n=t.event,{left:r,top:l}=k.current;h.current.differenceLeft=n.pageX-r,h.current.differenceTop=n.pageY-l},[]),pe=u(t=>{const n=t.event;n.originalEvent.preventDefault();const{stage:r,draggable:l,props:d,width:f,height:S}=k.current;if(r!==o.windowStage.FULLSCREEN&&l){const E=Math.max(n.pageY-(h.current.differenceTop||0),0),T=n.pageX-(h.current.differenceLeft||0);W(E),v(T),ie(!0),d.onMove&&B(d.onMove,n,!0,!1,{left:T,top:E},{width:f,height:S})}},[B]),et=u(t=>{const n=t.event,{stage:r,draggable:l,props:d,left:f,top:S,width:E,height:T}=k.current;r!==o.windowStage.FULLSCREEN&&l&&d.onMove&&B(d.onMove,n,!0,!0,{left:f,top:S},{width:E,height:T}),ie(!1)},[B]),tt=u(()=>{K.current?(clearTimeout(K.current),K.current=void 0):(ge(!0),Se(Ke.getMaxZIndex(j,F(),de)))},[j,F,de]),nt=u(()=>{clearTimeout(K.current);const t=s();t&&(K.current=t.setTimeout(()=>{ge(!1),K.current=void 0}))},[s]),We=u(t=>{t.preventDefault(),h.current.leftBeforeAction=q,h.current.topBeforeAction=P,h.current.widthBeforeAction=L,h.current.heightBeforeAction=b,G(o.windowStage.MINIMIZED),A(0),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.MINIMIZED})},[q,P,L,b,e.onStageChange,w]),le=u(t=>{t.preventDefault(),h.current.leftBeforeAction=q,h.current.topBeforeAction=P,h.current.widthBeforeAction=L,h.current.heightBeforeAction=b;const n=s(),r=n?n.innerWidth:0,l=n?n.innerHeight:0;v(0),W(0),x(e.appendTo?e.appendTo.offsetWidth:r),A(e.appendTo?e.appendTo.offsetHeight:l),G(o.windowStage.FULLSCREEN),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.FULLSCREEN})},[q,P,L,b,e.appendTo,e.onStageChange,s,w]),$=u(t=>{t.preventDefault(),c===o.windowStage.FULLSCREEN?(G(o.windowStage.DEFAULT),v(h.current.leftBeforeAction),W(h.current.topBeforeAction),x(h.current.widthBeforeAction),A(h.current.heightBeforeAction)):c===o.windowStage.MINIMIZED&&(G(o.windowStage.DEFAULT),A(h.current.heightBeforeAction)),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.DEFAULT})},[c,e.onStageChange,w]),ve=u(t=>{t.preventDefault(),a.dispatchEvent(e.onClose,t,w(),{state:void 0})},[e.onClose,w]),it=u(t=>{c===o.windowStage.FULLSCREEN||c===o.windowStage.MINIMIZED?$(t):le(t)},[c,$,le]),ot=u((t,n)=>{var Ue,xe,ke,Oe,ze,_e;const{props:r,width:l,height:d,top:f,left:S}=k.current,E=r.appendTo?t.pageX-Z.current.x:t.pageX,T=r.appendTo?t.pageY-Z.current.y:t.pageY,I=(xe=d!=null?d:(Ue=H.current)==null?void 0:Ue.clientHeight)!=null?xe:0,D=R||se,J=_||we,Q=f-T,He=S-E,Fe=E-S,Ne=T-f;let p=!1;const g={isDragging:!n.end};n.direction.indexOf("n")>=0&&J-(I+Q)<0&&(f>0&&(g.height=I+Q),g.top=T,p=!0),n.direction.indexOf("s")>=0&&J-Ne<0&&(g.height=Ne,p=!0),n.direction.indexOf("w")>=0&&D-(l+He)<0&&(S>0&&(g.width=l+He),g.left=E,p=!0),n.direction.indexOf("e")>=0&&D-Fe<0&&(g.width=Fe,p=!0),p&&(g.height!==void 0&&A(g.height),g.top!==void 0&&W(g.top),g.width!==void 0&&x(g.width),g.left!==void 0&&v(g.left),g.isDragging!==void 0&&ie(g.isDragging)),B(r.onResize,t,!0,n.end,{left:(ke=g.left)!=null?ke:S,top:(Oe=g.top)!=null?Oe:f},{width:(ze=g.width)!=null?ze:l,height:(_e=g.height)!=null?_e:d})},[B]),Ae=u(()=>{if(c===o.windowStage.FULLSCREEN){const t=s(),n=t?t.innerWidth:0,r=t?t.innerHeight:0;x(e.appendTo?e.appendTo.offsetWidth:n),A(e.appendTo?e.appendTo.offsetHeight:r)}},[c,e.appendTo,s]);O(()=>{const t=H.current;t&&Xe&&t.focus({preventScroll:!0});const n=s();n&&n.addEventListener("resize",Ae),G(e.stage||o.windowStage.DEFAULT),ie(!1),W(Le()),v(be()),x(Ie()),A(ye()),ge(!0),Se(Ke.getMaxZIndex(j,F(),de)),h.current={leftBeforeAction:be(),topBeforeAction:Le(),widthBeforeAction:Ie(),heightBeforeAction:ye()};const r=F();if(e.appendTo&&r){const l=e.appendTo.getBoundingClientRect(),d=r.body.getBoundingClientRect();Z.current.x=l.left-d.left,Z.current.y=l.top-d.top}return()=>{var d;const l=s();l&&l.removeEventListener("resize",Ae),Y.current&&a.canUseDOM&&(document.contains(Y.current)?Y.current.focus({preventScroll:!0}):Y.current.id&&((d=document.getElementById(Y.current.id))==null||d.focus({preventScroll:!0})))}},[]),O(()=>{e.left!==void 0&&!V&&v(e.left)},[e.left,V]),O(()=>{e.top!==void 0&&!V&&W(e.top)},[e.top,V]),O(()=>{e.initialLeft!==void 0&&v(e.initialLeft)},[e.initialLeft]),O(()=>{e.initialTop!==void 0&&W(e.initialTop)},[e.initialTop]),O(()=>{const t=F();if(e.appendTo&&t){const n=e.appendTo.getBoundingClientRect(),r=t.body.getBoundingClientRect();Z.current.x=n.left-r.left,Z.current.y=n.top-r.top}},[e.appendTo,F]),st(C,()=>({get element(){return H.current},get windowElement(){return H.current},get draggable(){return De.current},props:e}),[e]);const Be=m.Children.toArray(e.children),at=$e(Be),rt=Ye(Be),ct=a.classNames("k-window",e.className,{[`k-window-${e.themeColor}`]:e.themeColor,"k-window-minimized":c==="MINIMIZED","k-focus":Ve}),Re=m.createElement(a.ZIndexContext.Provider,{value:j},m.createElement(m.Fragment,null,fe&&m.createElement("div",{className:"k-overlay",style:{zIndex:j,...e.overlayStyle}}),m.createElement("div",{id:e.id,[ee.DATA_DIALOGS_ID]:de,tabIndex:0,role:"dialog","aria-labelledby":Ce.current,onFocus:tt,onBlur:nt,onKeyDown:Je,ref:H,className:ct,style:{top:P,left:q,width:L,height:b||"",zIndex:j,...e.style}},m.createElement(gt.MiddleLayerOptimization,{shouldUpdateOnDrag:e.shouldUpdateOnDrag||!1,isDragging:V},m.createElement(a.Draggable,{onPress:Qe,onDrag:pe,onRelease:et,autoScroll:!1,ref:De},m.createElement(ut.WindowTitleBar,{stage:c,onDoubleClick:je?it:void 0,onMinimizeButtonClick:We,onFullScreenButtonClick:le,onRestoreButtonClick:$,onCloseButtonClick:ve,closeButton:e.closeButton,minimizeButton:e.minimizeButton,maximizeButton:e.maximizeButton,restoreButton:e.restoreButton,id:Ce.current},e.title)),c===o.windowStage.MINIMIZED?null:m.createElement(m.Fragment,null,m.createElement("div",{className:"k-window-content"},at),rt),c===o.windowStage.DEFAULT&&ue?m.createElement(ft.ResizeHandlers,{onResize:ot}):null))));return a.canUseDOM?e.appendTo===null?Re:ht.createPortal(Re,e.appendTo||document.body):null});Ee.displayName="Window";const qe=a.createPropsContext(),Te=a.withIdHOC(a.withPropsContext(qe,Ee));Te.displayName="KendoReactWindow";const Tt={autoFocus:i.bool,title:i.any,className:i.string,closeButton:i.func,minimizeButton:i.func,maximizeButton:i.func,restoreButton:i.func,modal:i.bool,overlayStyle:i.object,width:i.number,height:i.number,minWidth:i.number,minHeight:i.number,left:i.number,top:i.number,initialLeft:i.number,initialTop:i.number,initialWidth:i.number,initialHeight:i.number,resizable:i.bool,draggable:i.bool,doubleClickStageChange:i.bool,stage:i.oneOf(["DEFAULT","MINIMIZED","FULLSCREEN"]),onClose:i.func,onMove:i.func,onResize:i.func,onStageChange:i.func,children:i.node,id:i.string,dir:i.string,style:i.object,appendTo:i.any,themeColor:i.oneOf(["primary","dark","light"]),shouldUpdateOnDrag:i.bool};Te.propTypes=Tt;exports.Window=Te;exports.WindowPropsContext=qe;exports.WindowWithoutContext=Ee;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const dt=require("react"),lt=require("react-dom"),i=require("prop-types"),ut=require("./WindowTitlebar.js"),a=require("@progress/kendo-react-common"),ft=require("./WindowResizeHandlers.js"),gt=require("./MiddleLayerOptimization.js"),o=require("./StageEnum.js"),Ze=require("./WindowActionsBar.js"),ee=require("./constants.js"),Ke=require("./utils.js");function Pe(e){const L=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const R in e)if(R!=="default"){const _=Object.getOwnPropertyDescriptor(e,R);Object.defineProperty(L,R,_.get?_:{enumerable:!0,get:()=>e[R]})}}return L.default=e,Object.freeze(L)}const m=Pe(dt),ht=Pe(lt),{useState:N,useEffect:O,useCallback:u,useMemo:X,useRef:U,useImperativeHandle:st,useContext:wt,forwardRef:Et}=m,te=300,ne=300,se=120,we=100,y=5,z={minWidth:se,minHeight:we,resizable:!0,draggable:!0,modal:!1,doubleClickStageChange:!0,autoFocus:!0},Ee=Et((e,L)=>{var Me;const{minWidth:R=z.minWidth,minHeight:_=z.minHeight,resizable:ue=z.resizable,draggable:me=z.draggable,modal:fe=z.modal,doubleClickStageChange:je=z.doubleClickStageChange,autoFocus:Xe=z.autoFocus}=e,[Ge,G]=N(e.stage||o.windowStage.DEFAULT),[V,ie]=N(!1),[oe,W]=N(0),[ae,v]=N(0),[ce,x]=N(te),[re,A]=N(ne),[Ve,ge]=N(!0),[he,Se]=N(ee.DEFAULT_DIALOGS_ZINDEX),r=(Me=e.stage)!=null?Me:Ge,M=wt(a.ZIndexContext),H=U(null),De=U(null),h=U({leftBeforeAction:0,topBeforeAction:0,widthBeforeAction:te,heightBeforeAction:ne}),Z=U({x:0,y:0}),K=U(void 0),Y=U(a.canUseDOM?document.activeElement:null),Le=U("window-title-"+(e.id?e.id+"-accessibility-id":"")),k=U({left:0,top:0,width:te,height:ne,internalLeft:ae,internalTop:oe,internalWidth:ce,internalHeight:re,stage:r,draggable:me,props:e}),F=u(()=>{const t=a.canUseDOM?document:null;return e.appendTo?e.appendTo.ownerDocument:t},[e.appendTo]),s=u(()=>{const t=F();return t==null?void 0:t.defaultView},[F]),P=X(()=>{var t;return r!==o.windowStage.FULLSCREEN?Math.max((t=e.top)!=null?t:oe,0):0},[r,e.top,oe]),q=X(()=>{var t;return r!==o.windowStage.FULLSCREEN?Math.max((t=e.left)!=null?t:ae,0):0},[r,e.left,ae]),C=X(()=>{var n;const t=(n=e.width)!=null?n:ce;if(r===o.windowStage.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetWidth;const c=s();return c?c.innerWidth:0}return t},[r,e.width,e.appendTo,ce,s]),b=X(()=>{const t=e.height===void 0?re:e.height;if(r===o.windowStage.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetHeight;const n=s();return n?n.innerHeight:0}else if(r===o.windowStage.MINIMIZED)return 0;return t},[r,e.height,e.appendTo,re,s]),de=X(()=>e.id?e.id+"-accessibility-id":void 0,[e.id]);O(()=>{k.current={left:q,top:P,width:C,height:b,internalLeft:ae,internalTop:oe,internalWidth:ce,internalHeight:re,stage:r,draggable:me,props:e}});const j=X(()=>{if(M===void 0)return M!=null?M:ee.DEFAULT_DIALOGS_ZINDEX;const t=M?M+ee.ZINDEX_DIALOGS_STEP:0;return he>t?he:M+ee.ZINDEX_DIALOGS_STEP},[he,M]),Ce=u(()=>{var c,l;if(e.top!==void 0)return e.top;if(e.initialTop!==void 0)return e.initialTop;let t=ne;if(e.height!==void 0?t=e.height:e.initialHeight!==void 0&&(t=e.initialHeight),e.appendTo&&t)return e.appendTo.offsetHeight/2-t/2;const n=s();return n?n.innerHeight/2-((l=t!=null?t:(c=H.current)==null?void 0:c.clientHeight)!=null?l:0)/2:0},[e.top,e.initialTop,e.height,e.initialHeight,e.appendTo,s]),be=u(()=>{if(e.left!==void 0)return e.left;if(e.initialLeft!==void 0)return e.initialLeft;let t=te;if(e.width!==void 0?t=e.width:e.initialWidth!==void 0&&(t=e.initialWidth),e.appendTo)return e.appendTo.offsetWidth/2-t/2;const n=s();return n?n.innerWidth/2-t/2:0},[e.left,e.initialLeft,e.width,e.initialWidth,e.appendTo,s]),Ie=u(()=>{let t=te;return e.width!==void 0?t=e.width:e.initialWidth!==void 0&&(t=e.initialWidth),t},[e.width,e.initialWidth]),ye=u(()=>{let t=ne;return e.height!==void 0?t=e.height:e.initialHeight!==void 0&&(t=e.initialHeight),t},[e.height,e.initialHeight]),Ye=u(t=>t.filter(n=>(n==null?void 0:n.type)===Ze.WindowActionsBar),[]),Je=u(t=>t.filter(n=>n&&n.type!==Ze.WindowActionsBar),[]),w=u(()=>typeof L=="object"&&L!==null&&"current"in L?L.current:null,[L]),B=u((t,n,c,l,d,f)=>{var D,Q,$;if(!t)return;const{internalLeft:S,internalTop:E,internalWidth:T,internalHeight:I}=k.current;t({nativeEvent:n.nativeEvent?n.nativeEvent:n.originalEvent,drag:c,end:l,target:w(),left:(D=d==null?void 0:d.left)!=null?D:S,top:(Q=d==null?void 0:d.top)!=null?Q:E,width:($=f==null?void 0:f.width)!=null?$:T,height:(f==null?void 0:f.height)===void 0?I:f==null?void 0:f.height})},[w]),Qe=u(t=>{var f,S;if(fe&&a.keepFocusInContainer(t,H.current),t.target!==t.currentTarget)return;const n=R||se,c=_||we,l=t.metaKey||t.ctrlKey,d=(S=b!=null?b:(f=H.current)==null?void 0:f.clientHeight)!=null?S:0;if(l&&ue){switch(t.keyCode){case a.Keys.up:t.preventDefault(),c<=d-y&&A(d-y);break;case a.Keys.down:t.preventDefault(),A(d+y);break;case a.Keys.left:n<=C-y&&x(C-y);break;case a.Keys.right:x(C+y);break;default:return}B(e.onResize,t,!1,void 0);return}if(t.altKey){switch(t.keyCode){case a.Keys.up:r===o.windowStage.MINIMIZED?(J(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.DEFAULT})):r===o.windowStage.DEFAULT&&(le(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.FULLSCREEN}));break;case a.Keys.down:r===o.windowStage.FULLSCREEN?(J(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.DEFAULT})):r===o.windowStage.DEFAULT&&(We(t),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.MINIMIZED}));break}return}if(!t.ctrlKey){const{internalLeft:E,internalTop:T}=k.current;let I=E,D=T;switch(t.keyCode){case a.Keys.esc:e.onClose&&ve(t);return;case a.Keys.up:D=T-y,W(D);break;case a.Keys.down:D=T+y,W(D);break;case a.Keys.left:I=E-y,v(I);break;case a.Keys.right:I=E+y,v(I);break;default:return}B(e.onMove,t,!1,void 0,{left:I,top:D})}},[fe,R,_,ue,e.onResize,e.onStageChange,e.onClose,e.onMove,b,C,r,B,w]),$e=u(t=>{const n=t.event,{left:c,top:l}=k.current;h.current.differenceLeft=n.pageX-c,h.current.differenceTop=n.pageY-l},[]),pe=u(t=>{const n=t.event;n.originalEvent.preventDefault();const{stage:c,draggable:l,props:d,width:f,height:S}=k.current;if(c!==o.windowStage.FULLSCREEN&&l){const E=Math.max(n.pageY-(h.current.differenceTop||0),0),T=n.pageX-(h.current.differenceLeft||0);W(E),v(T),ie(!0),d.onMove&&B(d.onMove,n,!0,!1,{left:T,top:E},{width:f,height:S})}},[B]),et=u(t=>{const n=t.event,{stage:c,draggable:l,props:d,left:f,top:S,width:E,height:T}=k.current;c!==o.windowStage.FULLSCREEN&&l&&d.onMove&&B(d.onMove,n,!0,!0,{left:f,top:S},{width:E,height:T}),ie(!1)},[B]),tt=u(()=>{K.current?(clearTimeout(K.current),K.current=void 0):(ge(!0),Se(Ke.getMaxZIndex(j,F(),de)))},[j,F,de]),nt=u(()=>{clearTimeout(K.current);const t=s();t&&(K.current=t.setTimeout(()=>{ge(!1),K.current=void 0}))},[s]),We=u(t=>{t.preventDefault(),h.current.leftBeforeAction=q,h.current.topBeforeAction=P,h.current.widthBeforeAction=C,h.current.heightBeforeAction=b,G(o.windowStage.MINIMIZED),A(0),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.MINIMIZED})},[q,P,C,b,e.onStageChange,w]),le=u(t=>{t.preventDefault(),h.current.leftBeforeAction=q,h.current.topBeforeAction=P,h.current.widthBeforeAction=C,h.current.heightBeforeAction=b;const n=s(),c=n?n.innerWidth:0,l=n?n.innerHeight:0;v(0),W(0),x(e.appendTo?e.appendTo.offsetWidth:c),A(e.appendTo?e.appendTo.offsetHeight:l),G(o.windowStage.FULLSCREEN),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.FULLSCREEN})},[q,P,C,b,e.appendTo,e.onStageChange,s,w]),J=u(t=>{t.preventDefault(),r===o.windowStage.FULLSCREEN?(G(o.windowStage.DEFAULT),v(h.current.leftBeforeAction),W(h.current.topBeforeAction),x(h.current.widthBeforeAction),A(h.current.heightBeforeAction)):r===o.windowStage.MINIMIZED&&(G(o.windowStage.DEFAULT),A(h.current.heightBeforeAction)),a.dispatchEvent(e.onStageChange,t,w(),{state:o.windowStage.DEFAULT})},[r,e.onStageChange,w]),ve=u(t=>{t.preventDefault(),a.dispatchEvent(e.onClose,t,w(),{state:void 0})},[e.onClose,w]),it=u(t=>{r===o.windowStage.FULLSCREEN||r===o.windowStage.MINIMIZED?J(t):le(t)},[r,J,le]),ot=u((t,n)=>{var Ue,xe,ke,Oe,ze,_e;const{props:c,width:l,height:d,top:f,left:S}=k.current,E=c.appendTo?t.pageX-Z.current.x:t.pageX,T=c.appendTo?t.pageY-Z.current.y:t.pageY,I=(xe=d!=null?d:(Ue=H.current)==null?void 0:Ue.clientHeight)!=null?xe:0,D=R||se,Q=_||we,$=f-T,He=S-E,Fe=E-S,Ne=T-f;let p=!1;const g={isDragging:!n.end};n.direction.indexOf("n")>=0&&Q-(I+$)<0&&(f>0&&(g.height=I+$),g.top=T,p=!0),n.direction.indexOf("s")>=0&&Q-Ne<0&&(g.height=Ne,p=!0),n.direction.indexOf("w")>=0&&D-(l+He)<0&&(S>0&&(g.width=l+He),g.left=E,p=!0),n.direction.indexOf("e")>=0&&D-Fe<0&&(g.width=Fe,p=!0),p&&(g.height!==void 0&&A(g.height),g.top!==void 0&&W(g.top),g.width!==void 0&&x(g.width),g.left!==void 0&&v(g.left),g.isDragging!==void 0&&ie(g.isDragging)),B(c.onResize,t,!0,n.end,{left:(ke=g.left)!=null?ke:S,top:(Oe=g.top)!=null?Oe:f},{width:(ze=g.width)!=null?ze:l,height:(_e=g.height)!=null?_e:d})},[B]),Ae=u(()=>{if(r===o.windowStage.FULLSCREEN){const t=s(),n=t?t.innerWidth:0,c=t?t.innerHeight:0;x(e.appendTo?e.appendTo.offsetWidth:n),A(e.appendTo?e.appendTo.offsetHeight:c)}},[r,e.appendTo,s]);O(()=>{const t=H.current;t&&Xe&&t.focus({preventScroll:!0});const n=s();n&&n.addEventListener("resize",Ae),G(e.stage||o.windowStage.DEFAULT),ie(!1),W(Ce()),v(be()),x(Ie()),A(ye()),ge(!0),Se(Ke.getMaxZIndex(j,F(),de)),h.current={leftBeforeAction:be(),topBeforeAction:Ce(),widthBeforeAction:Ie(),heightBeforeAction:ye()};const c=F();if(e.appendTo&&c){const l=e.appendTo.getBoundingClientRect(),d=c.body.getBoundingClientRect();Z.current.x=l.left-d.left,Z.current.y=l.top-d.top}return()=>{var d;const l=s();l&&l.removeEventListener("resize",Ae),Y.current&&a.canUseDOM&&(document.contains(Y.current)?Y.current.focus({preventScroll:!0}):Y.current.id&&((d=document.getElementById(Y.current.id))==null||d.focus({preventScroll:!0})))}},[]),O(()=>{e.left!==void 0&&!V&&v(e.left)},[e.left,V]),O(()=>{e.top!==void 0&&!V&&W(e.top)},[e.top,V]),O(()=>{e.initialLeft!==void 0&&v(e.initialLeft)},[e.initialLeft]),O(()=>{e.initialTop!==void 0&&W(e.initialTop)},[e.initialTop]),O(()=>{const t=F();if(e.appendTo&&t){const n=e.appendTo.getBoundingClientRect(),c=t.body.getBoundingClientRect();Z.current.x=n.left-c.left,Z.current.y=n.top-c.top}},[e.appendTo,F]),st(L,()=>({get element(){return H.current},get windowElement(){return H.current},get draggable(){return De.current},props:e}),[e]);const Be=m.Children.toArray(e.children),at=Je(Be),ct=Ye(Be),rt=a.classNames("k-window",e.className,{"k-window-minimized":r==="MINIMIZED","k-focus":Ve}),Re=m.createElement(a.ZIndexContext.Provider,{value:j},m.createElement(m.Fragment,null,fe&&m.createElement("div",{className:"k-overlay",style:{zIndex:j,...e.overlayStyle}}),m.createElement("div",{id:e.id,[ee.DATA_DIALOGS_ID]:de,tabIndex:0,role:"dialog","aria-labelledby":Le.current,onFocus:tt,onBlur:nt,onKeyDown:Qe,ref:H,className:rt,style:{top:P,left:q,width:C,height:b||"",zIndex:j,...e.style}},m.createElement(gt.MiddleLayerOptimization,{shouldUpdateOnDrag:e.shouldUpdateOnDrag||!1,isDragging:V},m.createElement(a.Draggable,{onPress:$e,onDrag:pe,onRelease:et,autoScroll:!1,ref:De},m.createElement(ut.WindowTitleBar,{stage:r,onDoubleClick:je?it:void 0,onMinimizeButtonClick:We,onFullScreenButtonClick:le,onRestoreButtonClick:J,onCloseButtonClick:ve,closeButton:e.closeButton,minimizeButton:e.minimizeButton,maximizeButton:e.maximizeButton,restoreButton:e.restoreButton,id:Le.current},e.title)),r===o.windowStage.MINIMIZED?null:m.createElement(m.Fragment,null,m.createElement("div",{className:"k-window-content"},at),ct),r===o.windowStage.DEFAULT&&ue?m.createElement(ft.ResizeHandlers,{onResize:ot}):null))));return a.canUseDOM?e.appendTo===null?Re:ht.createPortal(Re,e.appendTo||document.body):null});Ee.displayName="Window";const qe=a.createPropsContext(),Te=a.withIdHOC(a.withPropsContext(qe,Ee));Te.displayName="KendoReactWindow";const Tt={autoFocus:i.bool,title:i.any,className:i.string,closeButton:i.func,minimizeButton:i.func,maximizeButton:i.func,restoreButton:i.func,modal:i.bool,overlayStyle:i.object,width:i.number,height:i.number,minWidth:i.number,minHeight:i.number,left:i.number,top:i.number,initialLeft:i.number,initialTop:i.number,initialWidth:i.number,initialHeight:i.number,resizable:i.bool,draggable:i.bool,doubleClickStageChange:i.bool,stage:i.oneOf(["DEFAULT","MINIMIZED","FULLSCREEN"]),onClose:i.func,onMove:i.func,onResize:i.func,onStageChange:i.func,children:i.node,id:i.string,dir:i.string,style:i.object,appendTo:i.any,shouldUpdateOnDrag:i.bool};Te.propTypes=Tt;exports.Window=Te;exports.WindowPropsContext=qe;exports.WindowWithoutContext=Ee;
|
package/Window.mjs
CHANGED
|
@@ -9,14 +9,14 @@ import * as T from "react";
|
|
|
9
9
|
import * as ut from "react-dom";
|
|
10
10
|
import i from "prop-types";
|
|
11
11
|
import { WindowTitleBar as ft } from "./WindowTitlebar.mjs";
|
|
12
|
-
import { withIdHOC as ht, withPropsContext as gt, createPropsContext as st, ZIndexContext as Ze, canUseDOM as le, keepFocusInContainer as mt, Keys as
|
|
12
|
+
import { withIdHOC as ht, withPropsContext as gt, createPropsContext as st, ZIndexContext as Ze, canUseDOM as le, keepFocusInContainer as mt, Keys as C, dispatchEvent as F, classNames as wt, Draggable as Tt } from "@progress/kendo-react-common";
|
|
13
13
|
import { ResizeHandlers as Et } from "./WindowResizeHandlers.mjs";
|
|
14
|
-
import { MiddleLayerOptimization as
|
|
14
|
+
import { MiddleLayerOptimization as Lt } from "./MiddleLayerOptimization.mjs";
|
|
15
15
|
import { windowStage as o } from "./StageEnum.mjs";
|
|
16
16
|
import { WindowActionsBar as _e } from "./WindowActionsBar.mjs";
|
|
17
|
-
import { DEFAULT_DIALOGS_ZINDEX as Pe, ZINDEX_DIALOGS_STEP as Ke, DATA_DIALOGS_ID as
|
|
17
|
+
import { DEFAULT_DIALOGS_ZINDEX as Pe, ZINDEX_DIALOGS_STEP as Ke, DATA_DIALOGS_ID as Ct } from "./constants.mjs";
|
|
18
18
|
import { getMaxZIndex as Xe } from "./utils.mjs";
|
|
19
|
-
const { useState: M, useEffect:
|
|
19
|
+
const { useState: M, useEffect: k, useCallback: d, useMemo: G, useRef: N, useImperativeHandle: Dt, useContext: It, forwardRef: bt } = T, p = 300, ee = 300, me = 120, we = 100, W = 5, z = {
|
|
20
20
|
minWidth: me,
|
|
21
21
|
minHeight: we,
|
|
22
22
|
resizable: !0,
|
|
@@ -34,14 +34,14 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
34
34
|
modal: he = z.modal,
|
|
35
35
|
doubleClickStageChange: Ye = z.doubleClickStageChange,
|
|
36
36
|
autoFocus: je = z.autoFocus
|
|
37
|
-
} = e, [
|
|
37
|
+
} = e, [qe, V] = M(e.stage || o.DEFAULT), [Y, te] = M(!1), [ne, S] = M(0), [ie, A] = M(0), [oe, U] = M(p), [re, B] = M(ee), [Je, ge] = M(!0), [se, Ee] = M(Pe), a = (ve = e.stage) != null ? ve : qe, R = It(Ze), v = N(null), Le = N(null), h = N({
|
|
38
38
|
leftBeforeAction: 0,
|
|
39
39
|
topBeforeAction: 0,
|
|
40
40
|
widthBeforeAction: p,
|
|
41
41
|
heightBeforeAction: ee
|
|
42
42
|
}), Z = N({ x: 0, y: 0 }), _ = N(void 0), j = N(
|
|
43
43
|
le ? document.activeElement : null
|
|
44
|
-
),
|
|
44
|
+
), Ce = N("window-title-" + (e.id ? e.id + "-accessibility-id" : "")), x = N({
|
|
45
45
|
left: 0,
|
|
46
46
|
top: 0,
|
|
47
47
|
width: p,
|
|
@@ -86,8 +86,8 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
86
86
|
return 0;
|
|
87
87
|
return t;
|
|
88
88
|
}, [a, e.height, e.appendTo, re, g]), ae = G(() => e.id ? e.id + "-accessibility-id" : void 0, [e.id]);
|
|
89
|
-
|
|
90
|
-
|
|
89
|
+
k(() => {
|
|
90
|
+
x.current = {
|
|
91
91
|
left: K,
|
|
92
92
|
top: P,
|
|
93
93
|
width: D,
|
|
@@ -133,9 +133,9 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
133
133
|
}, [e.width, e.initialWidth]), We = d(() => {
|
|
134
134
|
let t = ee;
|
|
135
135
|
return e.height !== void 0 ? t = e.height : e.initialHeight !== void 0 && (t = e.initialHeight), t;
|
|
136
|
-
}, [e.height, e.initialHeight]),
|
|
136
|
+
}, [e.height, e.initialHeight]), Qe = d((t) => t.filter((n) => (n == null ? void 0 : n.type) === _e), []), $e = d((t) => t.filter((n) => n && n.type !== _e), []), s = d(() => typeof O == "object" && O !== null && "current" in O ? O.current : null, [O]), y = d(
|
|
137
137
|
(t, n, r, l, c, u) => {
|
|
138
|
-
var
|
|
138
|
+
var L, J, Q;
|
|
139
139
|
if (!t)
|
|
140
140
|
return;
|
|
141
141
|
const {
|
|
@@ -143,15 +143,15 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
143
143
|
internalTop: m,
|
|
144
144
|
internalWidth: w,
|
|
145
145
|
internalHeight: b
|
|
146
|
-
} =
|
|
146
|
+
} = x.current;
|
|
147
147
|
t({
|
|
148
148
|
nativeEvent: n.nativeEvent ? n.nativeEvent : n.originalEvent,
|
|
149
149
|
drag: r,
|
|
150
150
|
end: l,
|
|
151
151
|
target: s(),
|
|
152
|
-
left: (
|
|
153
|
-
top: (
|
|
154
|
-
width: (
|
|
152
|
+
left: (L = c == null ? void 0 : c.left) != null ? L : E,
|
|
153
|
+
top: (J = c == null ? void 0 : c.top) != null ? J : m,
|
|
154
|
+
width: (Q = u == null ? void 0 : u.width) != null ? Q : w,
|
|
155
155
|
height: (u == null ? void 0 : u.height) === void 0 ? b : u == null ? void 0 : u.height
|
|
156
156
|
});
|
|
157
157
|
},
|
|
@@ -164,35 +164,35 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
164
164
|
const n = de || me, r = ue || we, l = t.metaKey || t.ctrlKey, c = (E = I != null ? I : (u = v.current) == null ? void 0 : u.clientHeight) != null ? E : 0;
|
|
165
165
|
if (l && fe) {
|
|
166
166
|
switch (t.keyCode) {
|
|
167
|
-
case
|
|
168
|
-
t.preventDefault(), r <= c - W &&
|
|
167
|
+
case C.up:
|
|
168
|
+
t.preventDefault(), r <= c - W && B(c - W);
|
|
169
169
|
break;
|
|
170
|
-
case
|
|
171
|
-
t.preventDefault(),
|
|
170
|
+
case C.down:
|
|
171
|
+
t.preventDefault(), B(c + W);
|
|
172
172
|
break;
|
|
173
|
-
case
|
|
173
|
+
case C.left:
|
|
174
174
|
n <= D - W && U(D - W);
|
|
175
175
|
break;
|
|
176
|
-
case
|
|
176
|
+
case C.right:
|
|
177
177
|
U(D + W);
|
|
178
178
|
break;
|
|
179
179
|
default:
|
|
180
180
|
return;
|
|
181
181
|
}
|
|
182
|
-
|
|
182
|
+
y(e.onResize, t, !1, void 0);
|
|
183
183
|
return;
|
|
184
184
|
}
|
|
185
185
|
if (t.altKey) {
|
|
186
186
|
switch (t.keyCode) {
|
|
187
|
-
case
|
|
188
|
-
a === o.MINIMIZED ? (
|
|
187
|
+
case C.up:
|
|
188
|
+
a === o.MINIMIZED ? (q(t), F(e.onStageChange, t, s(), {
|
|
189
189
|
state: o.DEFAULT
|
|
190
190
|
})) : a === o.DEFAULT && (ce(t), F(e.onStageChange, t, s(), {
|
|
191
191
|
state: o.FULLSCREEN
|
|
192
192
|
}));
|
|
193
193
|
break;
|
|
194
|
-
case
|
|
195
|
-
a === o.FULLSCREEN ? (
|
|
194
|
+
case C.down:
|
|
195
|
+
a === o.FULLSCREEN ? (q(t), F(e.onStageChange, t, s(), {
|
|
196
196
|
state: o.DEFAULT
|
|
197
197
|
})) : a === o.DEFAULT && (Se(t), F(e.onStageChange, t, s(), {
|
|
198
198
|
state: o.MINIMIZED
|
|
@@ -202,28 +202,28 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
202
202
|
return;
|
|
203
203
|
}
|
|
204
204
|
if (!t.ctrlKey) {
|
|
205
|
-
const { internalLeft: m, internalTop: w } =
|
|
206
|
-
let b = m,
|
|
205
|
+
const { internalLeft: m, internalTop: w } = x.current;
|
|
206
|
+
let b = m, L = w;
|
|
207
207
|
switch (t.keyCode) {
|
|
208
|
-
case
|
|
209
|
-
e.onClose &&
|
|
208
|
+
case C.esc:
|
|
209
|
+
e.onClose && Ae(t);
|
|
210
210
|
return;
|
|
211
|
-
case
|
|
212
|
-
|
|
211
|
+
case C.up:
|
|
212
|
+
L = w - W, S(L);
|
|
213
213
|
break;
|
|
214
|
-
case
|
|
215
|
-
|
|
214
|
+
case C.down:
|
|
215
|
+
L = w + W, S(L);
|
|
216
216
|
break;
|
|
217
|
-
case
|
|
218
|
-
b = m - W,
|
|
217
|
+
case C.left:
|
|
218
|
+
b = m - W, A(b);
|
|
219
219
|
break;
|
|
220
|
-
case
|
|
221
|
-
b = m + W,
|
|
220
|
+
case C.right:
|
|
221
|
+
b = m + W, A(b);
|
|
222
222
|
break;
|
|
223
223
|
default:
|
|
224
224
|
return;
|
|
225
225
|
}
|
|
226
|
-
|
|
226
|
+
y(e.onMove, t, !1, void 0, { left: b, top: L });
|
|
227
227
|
}
|
|
228
228
|
},
|
|
229
229
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -239,11 +239,11 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
239
239
|
I,
|
|
240
240
|
D,
|
|
241
241
|
a,
|
|
242
|
-
|
|
242
|
+
y,
|
|
243
243
|
s
|
|
244
244
|
]
|
|
245
245
|
), et = d((t) => {
|
|
246
|
-
const n = t.event, { left: r, top: l } =
|
|
246
|
+
const n = t.event, { left: r, top: l } = x.current;
|
|
247
247
|
h.current.differenceLeft = n.pageX - r, h.current.differenceTop = n.pageY - l;
|
|
248
248
|
}, []), tt = d(
|
|
249
249
|
(t) => {
|
|
@@ -255,10 +255,10 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
255
255
|
props: c,
|
|
256
256
|
width: u,
|
|
257
257
|
height: E
|
|
258
|
-
} =
|
|
258
|
+
} = x.current;
|
|
259
259
|
if (r !== o.FULLSCREEN && l) {
|
|
260
260
|
const m = Math.max(n.pageY - (h.current.differenceTop || 0), 0), w = n.pageX - (h.current.differenceLeft || 0);
|
|
261
|
-
S(m),
|
|
261
|
+
S(m), A(w), te(!0), c.onMove && y(
|
|
262
262
|
c.onMove,
|
|
263
263
|
n,
|
|
264
264
|
!0,
|
|
@@ -268,7 +268,7 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
268
268
|
);
|
|
269
269
|
}
|
|
270
270
|
},
|
|
271
|
-
[
|
|
271
|
+
[y]
|
|
272
272
|
), nt = d(
|
|
273
273
|
(t) => {
|
|
274
274
|
const n = t.event, {
|
|
@@ -279,8 +279,8 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
279
279
|
top: E,
|
|
280
280
|
width: m,
|
|
281
281
|
height: w
|
|
282
|
-
} =
|
|
283
|
-
r !== o.FULLSCREEN && l && c.onMove &&
|
|
282
|
+
} = x.current;
|
|
283
|
+
r !== o.FULLSCREEN && l && c.onMove && y(
|
|
284
284
|
c.onMove,
|
|
285
285
|
n,
|
|
286
286
|
!0,
|
|
@@ -289,7 +289,7 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
289
289
|
{ width: m, height: w }
|
|
290
290
|
), te(!1);
|
|
291
291
|
},
|
|
292
|
-
[
|
|
292
|
+
[y]
|
|
293
293
|
), it = d(() => {
|
|
294
294
|
_.current ? (clearTimeout(_.current), _.current = void 0) : (ge(!0), Ee(Xe(X, H(), ae)));
|
|
295
295
|
}, [X, H, ae]), ot = d(() => {
|
|
@@ -300,66 +300,66 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
300
300
|
}));
|
|
301
301
|
}, [g]), Se = d(
|
|
302
302
|
(t) => {
|
|
303
|
-
t.preventDefault(), h.current.leftBeforeAction = K, h.current.topBeforeAction = P, h.current.widthBeforeAction = D, h.current.heightBeforeAction = I, V(o.MINIMIZED),
|
|
303
|
+
t.preventDefault(), h.current.leftBeforeAction = K, h.current.topBeforeAction = P, h.current.widthBeforeAction = D, h.current.heightBeforeAction = I, V(o.MINIMIZED), B(0), F(e.onStageChange, t, s(), { state: o.MINIMIZED });
|
|
304
304
|
},
|
|
305
305
|
[K, P, D, I, e.onStageChange, s]
|
|
306
306
|
), ce = d(
|
|
307
307
|
(t) => {
|
|
308
308
|
t.preventDefault(), h.current.leftBeforeAction = K, h.current.topBeforeAction = P, h.current.widthBeforeAction = D, h.current.heightBeforeAction = I;
|
|
309
309
|
const n = g(), r = n ? n.innerWidth : 0, l = n ? n.innerHeight : 0;
|
|
310
|
-
|
|
310
|
+
A(0), S(0), U(e.appendTo ? e.appendTo.offsetWidth : r), B(e.appendTo ? e.appendTo.offsetHeight : l), V(o.FULLSCREEN), F(e.onStageChange, t, s(), { state: o.FULLSCREEN });
|
|
311
311
|
},
|
|
312
312
|
[K, P, D, I, e.appendTo, e.onStageChange, g, s]
|
|
313
|
-
),
|
|
313
|
+
), q = d(
|
|
314
314
|
(t) => {
|
|
315
|
-
t.preventDefault(), a === o.FULLSCREEN ? (V(o.DEFAULT),
|
|
315
|
+
t.preventDefault(), a === o.FULLSCREEN ? (V(o.DEFAULT), A(h.current.leftBeforeAction), S(h.current.topBeforeAction), U(h.current.widthBeforeAction), B(h.current.heightBeforeAction)) : a === o.MINIMIZED && (V(o.DEFAULT), B(h.current.heightBeforeAction)), F(e.onStageChange, t, s(), { state: o.DEFAULT });
|
|
316
316
|
},
|
|
317
317
|
[a, e.onStageChange, s]
|
|
318
|
-
),
|
|
318
|
+
), Ae = d(
|
|
319
319
|
(t) => {
|
|
320
320
|
t.preventDefault(), F(e.onClose, t, s(), { state: void 0 });
|
|
321
321
|
},
|
|
322
322
|
[e.onClose, s]
|
|
323
323
|
), rt = d(
|
|
324
324
|
(t) => {
|
|
325
|
-
a === o.FULLSCREEN || a === o.MINIMIZED ?
|
|
325
|
+
a === o.FULLSCREEN || a === o.MINIMIZED ? q(t) : ce(t);
|
|
326
326
|
},
|
|
327
|
-
[a,
|
|
327
|
+
[a, q, ce]
|
|
328
328
|
), at = d(
|
|
329
329
|
(t, n) => {
|
|
330
|
-
var Ne, Ue,
|
|
330
|
+
var Ne, Ue, xe, ke, ze, Oe;
|
|
331
331
|
const {
|
|
332
332
|
props: r,
|
|
333
333
|
width: l,
|
|
334
334
|
height: c,
|
|
335
335
|
top: u,
|
|
336
336
|
left: E
|
|
337
|
-
} =
|
|
338
|
-
let
|
|
337
|
+
} = x.current, m = r.appendTo ? t.pageX - Z.current.x : t.pageX, w = r.appendTo ? t.pageY - Z.current.y : t.pageY, b = (Ue = c != null ? c : (Ne = v.current) == null ? void 0 : Ne.clientHeight) != null ? Ue : 0, L = de || me, J = ue || we, Q = u - w, He = E - m, Fe = m - E, Me = w - u;
|
|
338
|
+
let $ = !1;
|
|
339
339
|
const f = {
|
|
340
340
|
isDragging: !n.end
|
|
341
341
|
};
|
|
342
|
-
n.direction.indexOf("n") >= 0 &&
|
|
342
|
+
n.direction.indexOf("n") >= 0 && J - (b + Q) < 0 && (u > 0 && (f.height = b + Q), f.top = w, $ = !0), n.direction.indexOf("s") >= 0 && J - Me < 0 && (f.height = Me, $ = !0), n.direction.indexOf("w") >= 0 && L - (l + He) < 0 && (E > 0 && (f.width = l + He), f.left = m, $ = !0), n.direction.indexOf("e") >= 0 && L - Fe < 0 && (f.width = Fe, $ = !0), $ && (f.height !== void 0 && B(f.height), f.top !== void 0 && S(f.top), f.width !== void 0 && U(f.width), f.left !== void 0 && A(f.left), f.isDragging !== void 0 && te(f.isDragging)), y(
|
|
343
343
|
r.onResize,
|
|
344
344
|
t,
|
|
345
345
|
!0,
|
|
346
346
|
n.end,
|
|
347
|
-
{ left: (
|
|
347
|
+
{ left: (xe = f.left) != null ? xe : E, top: (ke = f.top) != null ? ke : u },
|
|
348
348
|
{ width: (ze = f.width) != null ? ze : l, height: (Oe = f.height) != null ? Oe : c }
|
|
349
349
|
);
|
|
350
350
|
},
|
|
351
|
-
[
|
|
352
|
-
),
|
|
351
|
+
[y]
|
|
352
|
+
), Be = d(() => {
|
|
353
353
|
if (a === o.FULLSCREEN) {
|
|
354
354
|
const t = g(), n = t ? t.innerWidth : 0, r = t ? t.innerHeight : 0;
|
|
355
|
-
U(e.appendTo ? e.appendTo.offsetWidth : n),
|
|
355
|
+
U(e.appendTo ? e.appendTo.offsetWidth : n), B(e.appendTo ? e.appendTo.offsetHeight : r);
|
|
356
356
|
}
|
|
357
357
|
}, [a, e.appendTo, g]);
|
|
358
|
-
|
|
358
|
+
k(() => {
|
|
359
359
|
const t = v.current;
|
|
360
360
|
t && je && t.focus({ preventScroll: !0 });
|
|
361
361
|
const n = g();
|
|
362
|
-
n && n.addEventListener("resize",
|
|
362
|
+
n && n.addEventListener("resize", Be), V(e.stage || o.DEFAULT), te(!1), S(De()), A(Ie()), U(be()), B(We()), ge(!0), Ee(Xe(X, H(), ae)), h.current = {
|
|
363
363
|
leftBeforeAction: Ie(),
|
|
364
364
|
topBeforeAction: De(),
|
|
365
365
|
widthBeforeAction: be(),
|
|
@@ -373,17 +373,17 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
373
373
|
return () => {
|
|
374
374
|
var c;
|
|
375
375
|
const l = g();
|
|
376
|
-
l && l.removeEventListener("resize",
|
|
376
|
+
l && l.removeEventListener("resize", Be), j.current && le && (document.contains(j.current) ? j.current.focus({ preventScroll: !0 }) : j.current.id && ((c = document.getElementById(j.current.id)) == null || c.focus({ preventScroll: !0 })));
|
|
377
377
|
};
|
|
378
|
-
}, []),
|
|
379
|
-
e.left !== void 0 && !Y &&
|
|
380
|
-
}, [e.left, Y]),
|
|
378
|
+
}, []), k(() => {
|
|
379
|
+
e.left !== void 0 && !Y && A(e.left);
|
|
380
|
+
}, [e.left, Y]), k(() => {
|
|
381
381
|
e.top !== void 0 && !Y && S(e.top);
|
|
382
|
-
}, [e.top, Y]),
|
|
383
|
-
e.initialLeft !== void 0 &&
|
|
384
|
-
}, [e.initialLeft]),
|
|
382
|
+
}, [e.top, Y]), k(() => {
|
|
383
|
+
e.initialLeft !== void 0 && A(e.initialLeft);
|
|
384
|
+
}, [e.initialLeft]), k(() => {
|
|
385
385
|
e.initialTop !== void 0 && S(e.initialTop);
|
|
386
|
-
}, [e.initialTop]),
|
|
386
|
+
}, [e.initialTop]), k(() => {
|
|
387
387
|
const t = H();
|
|
388
388
|
if (e.appendTo && t) {
|
|
389
389
|
const n = e.appendTo.getBoundingClientRect(), r = t.body.getBoundingClientRect();
|
|
@@ -399,16 +399,15 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
399
399
|
return v.current;
|
|
400
400
|
},
|
|
401
401
|
get draggable() {
|
|
402
|
-
return
|
|
402
|
+
return Le.current;
|
|
403
403
|
},
|
|
404
404
|
props: e
|
|
405
405
|
}),
|
|
406
406
|
[e]
|
|
407
407
|
);
|
|
408
|
-
const
|
|
409
|
-
[`k-window-${e.themeColor}`]: e.themeColor,
|
|
408
|
+
const ye = T.Children.toArray(e.children), ct = $e(ye), lt = Qe(ye), dt = wt("k-window", e.className, {
|
|
410
409
|
"k-window-minimized": a === "MINIMIZED",
|
|
411
|
-
"k-focus":
|
|
410
|
+
"k-focus": Je
|
|
412
411
|
}), Re = /* @__PURE__ */ T.createElement(Ze.Provider, { value: X }, /* @__PURE__ */ T.createElement(T.Fragment, null, he && /* @__PURE__ */ T.createElement(
|
|
413
412
|
"div",
|
|
414
413
|
{
|
|
@@ -422,10 +421,10 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
422
421
|
"div",
|
|
423
422
|
{
|
|
424
423
|
id: e.id,
|
|
425
|
-
[
|
|
424
|
+
[Ct]: ae,
|
|
426
425
|
tabIndex: 0,
|
|
427
426
|
role: "dialog",
|
|
428
|
-
"aria-labelledby":
|
|
427
|
+
"aria-labelledby": Ce.current,
|
|
429
428
|
onFocus: it,
|
|
430
429
|
onBlur: ot,
|
|
431
430
|
onKeyDown: pe,
|
|
@@ -441,7 +440,7 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
441
440
|
}
|
|
442
441
|
},
|
|
443
442
|
/* @__PURE__ */ T.createElement(
|
|
444
|
-
|
|
443
|
+
Lt,
|
|
445
444
|
{
|
|
446
445
|
shouldUpdateOnDrag: e.shouldUpdateOnDrag || !1,
|
|
447
446
|
isDragging: Y
|
|
@@ -453,7 +452,7 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
453
452
|
onDrag: tt,
|
|
454
453
|
onRelease: nt,
|
|
455
454
|
autoScroll: !1,
|
|
456
|
-
ref:
|
|
455
|
+
ref: Le
|
|
457
456
|
},
|
|
458
457
|
/* @__PURE__ */ T.createElement(
|
|
459
458
|
ft,
|
|
@@ -462,13 +461,13 @@ const { useState: M, useEffect: x, useCallback: d, useMemo: G, useRef: N, useImp
|
|
|
462
461
|
onDoubleClick: Ye ? rt : void 0,
|
|
463
462
|
onMinimizeButtonClick: Se,
|
|
464
463
|
onFullScreenButtonClick: ce,
|
|
465
|
-
onRestoreButtonClick:
|
|
466
|
-
onCloseButtonClick:
|
|
464
|
+
onRestoreButtonClick: q,
|
|
465
|
+
onCloseButtonClick: Ae,
|
|
467
466
|
closeButton: e.closeButton,
|
|
468
467
|
minimizeButton: e.minimizeButton,
|
|
469
468
|
maximizeButton: e.maximizeButton,
|
|
470
469
|
restoreButton: e.restoreButton,
|
|
471
|
-
id:
|
|
470
|
+
id: Ce.current
|
|
472
471
|
},
|
|
473
472
|
e.title
|
|
474
473
|
)
|
|
@@ -520,7 +519,6 @@ const St = {
|
|
|
520
519
|
dir: i.string,
|
|
521
520
|
style: i.object,
|
|
522
521
|
appendTo: i.any,
|
|
523
|
-
themeColor: i.oneOf(["primary", "dark", "light"]),
|
|
524
522
|
shouldUpdateOnDrag: i.bool
|
|
525
523
|
};
|
|
526
524
|
Ve.propTypes = St;
|
package/WindowProps.d.ts
CHANGED
|
@@ -273,20 +273,6 @@ export interface WindowProps {
|
|
|
273
273
|
* ```
|
|
274
274
|
*/
|
|
275
275
|
className?: string;
|
|
276
|
-
/**
|
|
277
|
-
* Configures the `themeColor` of the Window.
|
|
278
|
-
*
|
|
279
|
-
* The available options are:
|
|
280
|
-
* - primary
|
|
281
|
-
* - dark
|
|
282
|
-
* - light
|
|
283
|
-
*
|
|
284
|
-
* @example
|
|
285
|
-
* ```jsx
|
|
286
|
-
* <Window themeColor="dark" />
|
|
287
|
-
* ```
|
|
288
|
-
*/
|
|
289
|
-
themeColor?: 'primary' | 'dark' | 'light';
|
|
290
276
|
/**
|
|
291
277
|
* Fires when the **Close** button in the title is clicked or when the `Esc` button is pressed.
|
|
292
278
|
*
|
package/WindowTitlebar.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 C=require("react"),d=require("./StageEnum.js"),
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react"),d=require("./StageEnum.js"),s=require("@progress/kendo-react-buttons"),E=require("@progress/kendo-react-intl"),r=require("@progress/kendo-svg-icons"),n=require("./messages/index.js");function R(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const i in e)if(i!=="default"){const l=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(o,i,l.get?l:{enumerable:!0,get:()=>e[i]})}}return o.default=e,Object.freeze(o)}const t=R(C),S=e=>{const{children:o,onCloseButtonClick:i,onMinimizeButtonClick:l,onFullScreenButtonClick:u,onRestoreButtonClick:m,onDoubleClick:w,stage:a,forwardedRef:g,id:B}=e,c=E.useLocalization(),f=e.minimizeButton?t.createElement(e.minimizeButton,{onClick:l,stage:a}):t.createElement(s.Button,{fillMode:"flat",size:"xs",icon:"window-minimize",svgIcon:r.windowMinimizeIcon,className:"k-window-titlebar-action",onClick:l,"aria-label":c.toLanguageString(n.dialogsWindowMinimizeButton,n.messages[n.dialogsWindowMinimizeButton])}),k=e.maximizeButton?t.createElement(e.maximizeButton,{onClick:u,stage:a}):t.createElement(s.Button,{fillMode:"flat",size:"xs",icon:"window-maximize",svgIcon:r.windowIcon,className:"k-window-titlebar-action",onClick:u,"aria-label":c.toLanguageString(n.dialogsWindowMaximizeButton,n.messages[n.dialogsWindowMaximizeButton])}),z=e.restoreButton?t.createElement(e.restoreButton,{onClick:m,stage:a}):t.createElement(s.Button,{fillMode:"flat",size:"xs",icon:"window-restore",svgIcon:r.windowRestoreIcon,className:"k-window-titlebar-action",onClick:m,"aria-label":c.toLanguageString(n.dialogsWindowRestoreButton,n.messages[n.dialogsWindowRestoreButton])}),b=e.closeButton?t.createElement(e.closeButton,{onClick:i,stage:a}):t.createElement(s.Button,{fillMode:"flat",size:"xs",icon:"x",svgIcon:r.xIcon,className:"k-window-titlebar-action",onClick:i,"aria-label":c.toLanguageString(n.dialogsWindowCloseButton,n.messages[n.dialogsWindowCloseButton])});return t.createElement("div",{className:"k-window-titlebar",style:{touchAction:"none"},ref:g,onDoubleClick:w},t.createElement("span",{className:"k-window-title",id:B},o||""),t.createElement("div",{className:"k-window-titlebar-actions"},a===d.windowStage.DEFAULT&&f,a===d.windowStage.DEFAULT&&k,a!==d.windowStage.DEFAULT&&z,b))},x=t.forwardRef((e,o)=>t.createElement(S,{...e,forwardedRef:o}));exports.WindowTitleBar=x;
|
package/WindowTitlebar.mjs
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
import * as e from "react";
|
|
9
9
|
import { windowStage as c } from "./StageEnum.mjs";
|
|
10
10
|
import { Button as a } from "@progress/kendo-react-buttons";
|
|
11
|
-
import { useLocalization as
|
|
11
|
+
import { useLocalization as R } from "@progress/kendo-react-intl";
|
|
12
12
|
import { windowMinimizeIcon as I, windowIcon as L, windowRestoreIcon as M, xIcon as N } from "@progress/kendo-svg-icons";
|
|
13
13
|
import { dialogsWindowMinimizeButton as w, messages as l, dialogsWindowMaximizeButton as u, dialogsWindowRestoreButton as g, dialogsWindowCloseButton as B } from "./messages/index.mjs";
|
|
14
14
|
const v = (t) => {
|
|
@@ -21,11 +21,12 @@ const v = (t) => {
|
|
|
21
21
|
onDoubleClick: f,
|
|
22
22
|
stage: n,
|
|
23
23
|
forwardedRef: k,
|
|
24
|
-
id:
|
|
25
|
-
} = t, i =
|
|
24
|
+
id: z
|
|
25
|
+
} = t, i = R(), C = t.minimizeButton ? /* @__PURE__ */ e.createElement(t.minimizeButton, { onClick: m, stage: n }) : /* @__PURE__ */ e.createElement(
|
|
26
26
|
a,
|
|
27
27
|
{
|
|
28
28
|
fillMode: "flat",
|
|
29
|
+
size: "xs",
|
|
29
30
|
icon: "window-minimize",
|
|
30
31
|
svgIcon: I,
|
|
31
32
|
className: "k-window-titlebar-action",
|
|
@@ -35,10 +36,11 @@ const v = (t) => {
|
|
|
35
36
|
l[w]
|
|
36
37
|
)
|
|
37
38
|
}
|
|
38
|
-
),
|
|
39
|
+
), E = t.maximizeButton ? /* @__PURE__ */ e.createElement(t.maximizeButton, { onClick: s, stage: n }) : /* @__PURE__ */ e.createElement(
|
|
39
40
|
a,
|
|
40
41
|
{
|
|
41
42
|
fillMode: "flat",
|
|
43
|
+
size: "xs",
|
|
42
44
|
icon: "window-maximize",
|
|
43
45
|
svgIcon: L,
|
|
44
46
|
className: "k-window-titlebar-action",
|
|
@@ -48,20 +50,22 @@ const v = (t) => {
|
|
|
48
50
|
l[u]
|
|
49
51
|
)
|
|
50
52
|
}
|
|
51
|
-
),
|
|
53
|
+
), x = t.restoreButton ? /* @__PURE__ */ e.createElement(t.restoreButton, { onClick: d, stage: n }) : /* @__PURE__ */ e.createElement(
|
|
52
54
|
a,
|
|
53
55
|
{
|
|
54
56
|
fillMode: "flat",
|
|
57
|
+
size: "xs",
|
|
55
58
|
icon: "window-restore",
|
|
56
59
|
svgIcon: M,
|
|
57
60
|
className: "k-window-titlebar-action",
|
|
58
61
|
onClick: d,
|
|
59
62
|
"aria-label": i.toLanguageString(g, l[g])
|
|
60
63
|
}
|
|
61
|
-
),
|
|
64
|
+
), b = t.closeButton ? /* @__PURE__ */ e.createElement(t.closeButton, { onClick: r, stage: n }) : /* @__PURE__ */ e.createElement(
|
|
62
65
|
a,
|
|
63
66
|
{
|
|
64
67
|
fillMode: "flat",
|
|
68
|
+
size: "xs",
|
|
65
69
|
icon: "x",
|
|
66
70
|
svgIcon: N,
|
|
67
71
|
className: "k-window-titlebar-action",
|
|
@@ -77,8 +81,8 @@ const v = (t) => {
|
|
|
77
81
|
ref: k,
|
|
78
82
|
onDoubleClick: f
|
|
79
83
|
},
|
|
80
|
-
/* @__PURE__ */ e.createElement("span", { className: "k-window-title", id:
|
|
81
|
-
/* @__PURE__ */ e.createElement("div", { className: "k-window-titlebar-actions" }, n === c.DEFAULT &&
|
|
84
|
+
/* @__PURE__ */ e.createElement("span", { className: "k-window-title", id: z }, o || ""),
|
|
85
|
+
/* @__PURE__ */ e.createElement("div", { className: "k-window-titlebar-actions" }, n === c.DEFAULT && C, n === c.DEFAULT && E, n !== c.DEFAULT && x, b)
|
|
82
86
|
);
|
|
83
87
|
}, F = e.forwardRef((t, o) => /* @__PURE__ */ e.createElement(v, { ...t, forwardedRef: o }));
|
|
84
88
|
export {
|
|
@@ -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,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom"),require("prop-types"),require("@progress/kendo-react-buttons"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-common"),require("@progress/kendo-react-intl")):"function"==typeof define&&define.amd?define(["exports","react","react-dom","prop-types","@progress/kendo-react-buttons","@progress/kendo-svg-icons","@progress/kendo-react-common","@progress/kendo-react-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactDialogs={},e.React,e.ReactDOM,e.PropTypes,e.KendoReactButtons,e.KendoSvgIcons,e.KendoReactCommon,e.KendoReactIntl)}(this,function(e,t,n,o,i,r,a,l){"use strict";function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(n){if("default"!==n){var o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:function(){return e[n]}})}}),t.default=e,Object.freeze(t)}var s=c(t),d=c(n);const u=({children:e,onCloseButtonClick:t,id:n,closeIcon:o})=>s.createElement("div",{className:"k-window-titlebar k-dialog-titlebar",id:n},s.createElement("span",{className:"k-window-title k-dialog-title"},e),o&&s.createElement("div",{className:"k-window-titlebar-actions k-dialog-titlebar-actions"},s.createElement(i.Button,{role:"button","aria-label":"Close",onClick:t,icon:"x",svgIcon:r.xIcon,fillMode:"flat",className:"k-window-titlebar-action k-dialog-titlebar-action"}))),g=e=>{const t={layout:"stretched",...e},{layout:n,children:o}=t,i=a.classNames("k-actions","k-actions-horizontal","k-window-actions k-dialog-actions",{[`k-actions-${n}`]:n});return s.createElement("div",{className:i},o)};g.propTypes={children:o.any,layout:o.oneOf(["start","center","end","stretched"])};const p="data-windowid",h=10002,f=a.createPropsContext(),m=s.forwardRef((e,t)=>{const n=a.useZIndexContext(),o=n?n+2:h,i=s.useRef(null),r=s.useRef(null),l=s.useRef(a.getActiveElement(document)),c=a.usePropsContext(f,e),m=s.useMemo(()=>({...v,...c}),[c]),{title:w,width:E,height:C,children:y,minWidth:b,dir:k,style:T,themeColor:I,contentStyle:D,autoFocusedElement:B,appendTo:L,className:N,overlayStyle:M,modal:S=v.modal,closeIcon:F=v.closeIcon,autoFocus:x=v.autoFocus}=m,R=s.useCallback(()=>({props:m,element:r.current}),[m]);s.useImperativeHandle(i,R),s.useImperativeHandle(t,()=>i.current);const A=s.useMemo(()=>s.Children.toArray(y).filter(e=>!s.isValidElement(e)||e.type!==g),[y]),z=s.useMemo(()=>s.Children.toArray(y).filter(e=>s.isValidElement(e)&&e.type===g),[y]),{_id:U,contentId:W,id:O}=s.useMemo(()=>{const e=m.id,t=`${null!=e?e:"accessibility"}-id`;return{_id:t,contentId:`dialog-content-${t}`,id:e||`dialog-title-${t}`}},[m.id]),H=s.useCallback(()=>{if(r.current)if(x&&!B)r.current.focus();else if(!x&&B&&r.current){const e=r.current.querySelector(B);null==e||e.focus()}else{const e=[...a.FOCUSABLE_ELEMENTS].map(e=>e+":not(.k-dialog-titlebar *)");a.focusFirstFocusableChild(r.current,e)}},[x,B]);s.useEffect(()=>(H(),()=>{setTimeout(()=>{var e;!r.current&&l.current&&a.canUseDOM&&(document.contains(l.current)?l.current.focus():l.current.id&&(null==(e=document.getElementById(l.current.id))||e.focus()))})}),[H]);const K=s.useCallback(e=>{e.preventDefault(),a.dispatchEvent(m.onClose,e,R(),void 0)},[m.onClose]),j=s.useCallback(e=>{e.keyCode===a.Keys.esc&&m.onClose&&(e.preventDefault(),K(e)),a.keepFocusInContainer(e,r.current)},[m.onClose,K]),Z=s.useMemo(()=>s.createElement(a.ZIndexContext.Provider,{value:o},s.createElement("div",{ref:r,[p]:U,className:"k-dialog-wrapper"+(N?" "+N:""),onKeyDown:j,tabIndex:0,dir:k,style:{zIndex:o,...T}},S&&s.createElement("div",{className:"k-overlay",style:M}),s.createElement("div",{className:a.classNames("k-window k-dialog",{[`k-window-${I}`]:I}),role:"dialog","aria-labelledby":O,"aria-modal":!0,"aria-describedby":W,style:{width:E,height:C,minWidth:b}},w&&s.createElement(u,{closeIcon:F,onCloseButtonClick:K,id:O},w),s.createElement("div",{className:"k-window-content k-dialog-content",style:D,id:W},A),z))),[o,U,N,j,T,k,M,I,O,W,E,C,b,F,K,D,w,A,z,S]);return a.canUseDOM?null!==L?d.createPortal(Z,L||document.body):Z:null}),v={autoFocus:!1,modal:!0,closeIcon:!0},w={autoFocus:o.bool,autoFocusedElement:o.string,title:o.any,className:o.string,closeIcon:o.bool,modal:o.bool,overlayStyle:o.object,width:o.oneOfType([o.number,o.string]),height:o.oneOfType([o.number,o.string]),minWidth:o.oneOfType([o.number,o.string]),onClose:o.func,children:o.node,id:o.string,dir:o.string,style:o.object,contentStyle:o.object,appendTo:o.any,themeColor:o.oneOf(["primary","dark","light"])};m.displayName="KendoReactDialog",m.propTypes=w;var E=(e=>(e.DEFAULT="DEFAULT",e.FULLSCREEN="FULLSCREEN",e.MINIMIZED="MINIMIZED",e))(E||{});const C="dialogs.windowMaximizeButton",y="dialogs.windowMinimizeButton",b="dialogs.windowRestoreButton",k="dialogs.windowCloseButton",T={[C]:"maximize",[y]:"minimize",[b]:"restore",[k]:"close"},I=e=>{const{children:t,onCloseButtonClick:n,onMinimizeButtonClick:o,onFullScreenButtonClick:a,onRestoreButtonClick:c,onDoubleClick:d,stage:u,forwardedRef:g,id:p}=e,h=l.useLocalization(),f=e.minimizeButton?s.createElement(e.minimizeButton,{onClick:o,stage:u}):s.createElement(i.Button,{fillMode:"flat",icon:"window-minimize",svgIcon:r.windowMinimizeIcon,className:"k-window-titlebar-action",onClick:o,"aria-label":h.toLanguageString(y,T[y])}),m=e.maximizeButton?s.createElement(e.maximizeButton,{onClick:a,stage:u}):s.createElement(i.Button,{fillMode:"flat",icon:"window-maximize",svgIcon:r.windowIcon,className:"k-window-titlebar-action",onClick:a,"aria-label":h.toLanguageString(C,T[C])}),v=e.restoreButton?s.createElement(e.restoreButton,{onClick:c,stage:u}):s.createElement(i.Button,{fillMode:"flat",icon:"window-restore",svgIcon:r.windowRestoreIcon,className:"k-window-titlebar-action",onClick:c,"aria-label":h.toLanguageString(b,T[b])}),w=e.closeButton?s.createElement(e.closeButton,{onClick:n,stage:u}):s.createElement(i.Button,{fillMode:"flat",icon:"x",svgIcon:r.xIcon,className:"k-window-titlebar-action",onClick:n,"aria-label":h.toLanguageString(k,T[k])});return s.createElement("div",{className:"k-window-titlebar",style:{touchAction:"none"},ref:g,onDoubleClick:d},s.createElement("span",{className:"k-window-title",id:p},t||""),s.createElement("div",{className:"k-window-titlebar-actions"},u===E.DEFAULT&&f,u===E.DEFAULT&&m,u!==E.DEFAULT&&v,w))},D=s.forwardRef((e,t)=>s.createElement(I,{...e,forwardedRef:t})),B=["n","e","s","w","se","sw","ne","nw"];class L extends s.Component{constructor(){super(...arguments),this.isDragging=!1}render(){return s.createElement("div",{className:"k-resize-handles-wrapper"}," ",B.map((e,t)=>s.createElement(a.Draggable,{key:t,onDrag:t=>{const{event:n}=t;this.isDragging=!0,n.originalEvent.preventDefault(),this.props.onResize(n,{end:!1,direction:e})},onRelease:t=>{const{event:n}=t;n.originalEvent.preventDefault(),this.isDragging&&(this.isDragging=!1,this.props.onResize(n,{end:!0,direction:e}))}},s.createElement("div",{className:"k-resize-handle k-resize-"+e,style:{display:"block",touchAction:"none",userSelect:"none"}}))))}}class N extends s.Component{shouldComponentUpdate(e){return e.shouldUpdateOnDrag||!e.isDragging}render(){return this.props.children}}const M=e=>{const t={layout:"end",...e},{layout:n,children:o}=t,i=a.classNames("k-actions","k-window-actions","k-actions-horizontal","k-hstack",{"k-justify-content-start":"start"===n,"k-justify-content-center":"center"===n,"k-justify-content-end":"end"===n,"k-justify-content-stretch":"stretched"===n});return s.createElement("div",{className:i},o)};M.propTypes={children:o.any,layout:o.oneOf(["start","center","end","stretched"])};const S=(e,t,n)=>{let o=e;if(t&&t.defaultView){const e=t.querySelectorAll(".k-window:not(.k-dialog), .k-dialog-wrapper");let i=!1;return e.forEach(e=>{const r=t.defaultView.getComputedStyle(e,null);if(e.getAttribute(p)!==n&&null!==r.zIndex){const e=parseInt(r.zIndex,10);e>=o&&(o=e,i=!0)}}),i?o+2:o}return o},{useState:F,useEffect:x,useCallback:R,useMemo:A,useRef:z,useImperativeHandle:U,useContext:W,forwardRef:O}=s,H=300,K=300,j={minWidth:120,minHeight:100,resizable:!0,draggable:!0,modal:!1,doubleClickStageChange:!0,autoFocus:!0},Z=O((e,t)=>{var n;const{minWidth:o=j.minWidth,minHeight:i=j.minHeight,resizable:r=j.resizable,draggable:l=j.draggable,modal:c=j.modal,doubleClickStageChange:u=j.doubleClickStageChange,autoFocus:g=j.autoFocus}=e,[f,m]=F(e.stage||E.DEFAULT),[v,w]=F(!1),[C,y]=F(0),[b,k]=F(0),[T,I]=F(H),[B,O]=F(K),[Z,P]=F(!0),[q,$]=F(h),V=null!=(n=e.stage)?n:f,X=W(a.ZIndexContext),Y=z(null),_=z(null),G=z({leftBeforeAction:0,topBeforeAction:0,widthBeforeAction:H,heightBeforeAction:K}),J=z({x:0,y:0}),Q=z(void 0),ee=z(a.canUseDOM?document.activeElement:null),te=z("window-title-"+(e.id?e.id+"-accessibility-id":"")),ne=z({left:0,top:0,width:H,height:K,internalLeft:b,internalTop:C,internalWidth:T,internalHeight:B,stage:V,draggable:l,props:e}),oe=R(()=>{const t=a.canUseDOM?document:null;return e.appendTo?e.appendTo.ownerDocument:t},[e.appendTo]),ie=R(()=>{const e=oe();return null==e?void 0:e.defaultView},[oe]),re=A(()=>{var t;return V!==E.FULLSCREEN?Math.max(null!=(t=e.top)?t:C,0):0},[V,e.top,C]),ae=A(()=>{var t;return V!==E.FULLSCREEN?Math.max(null!=(t=e.left)?t:b,0):0},[V,e.left,b]),le=A(()=>{var t;const n=null!=(t=e.width)?t:T;if(V===E.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetWidth;const t=ie();return t?t.innerWidth:0}return n},[V,e.width,e.appendTo,T,ie]),ce=A(()=>{const t=void 0===e.height?B:e.height;if(V===E.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetHeight;const t=ie();return t?t.innerHeight:0}return V===E.MINIMIZED?0:t},[V,e.height,e.appendTo,B,ie]),se=A(()=>e.id?e.id+"-accessibility-id":void 0,[e.id]);x(()=>{ne.current={left:ae,top:re,width:le,height:ce,internalLeft:b,internalTop:C,internalWidth:T,internalHeight:B,stage:V,draggable:l,props:e}});const de=A(()=>{if(void 0===X)return null!=X?X:h;return q>(X?X+2:0)?q:X+2},[q,X]),ue=R(()=>{var t,n;if(void 0!==e.top)return e.top;if(void 0!==e.initialTop)return e.initialTop;let o=K;if(void 0!==e.height?o=e.height:void 0!==e.initialHeight&&(o=e.initialHeight),e.appendTo&&o)return e.appendTo.offsetHeight/2-o/2;const i=ie();return i?i.innerHeight/2-(null!=(n=null!=o?o:null==(t=Y.current)?void 0:t.clientHeight)?n:0)/2:0},[e.top,e.initialTop,e.height,e.initialHeight,e.appendTo,ie]),ge=R(()=>{if(void 0!==e.left)return e.left;if(void 0!==e.initialLeft)return e.initialLeft;let t=H;if(void 0!==e.width?t=e.width:void 0!==e.initialWidth&&(t=e.initialWidth),e.appendTo)return e.appendTo.offsetWidth/2-t/2;const n=ie();return n?n.innerWidth/2-t/2:0},[e.left,e.initialLeft,e.width,e.initialWidth,e.appendTo,ie]),pe=R(()=>{let t=H;return void 0!==e.width?t=e.width:void 0!==e.initialWidth&&(t=e.initialWidth),t},[e.width,e.initialWidth]),he=R(()=>{let t=K;return void 0!==e.height?t=e.height:void 0!==e.initialHeight&&(t=e.initialHeight),t},[e.height,e.initialHeight]),fe=R(e=>e.filter(e=>(null==e?void 0:e.type)===M),[]),me=R(e=>e.filter(e=>e&&e.type!==M),[]),ve=R(()=>"object"==typeof t&&null!==t&&"current"in t?t.current:null,[t]),we=R((e,t,n,o,i,r)=>{var a,l,c;if(!e)return;const{internalLeft:s,internalTop:d,internalWidth:u,internalHeight:g}=ne.current;e({nativeEvent:t.nativeEvent?t.nativeEvent:t.originalEvent,drag:n,end:o,target:ve(),left:null!=(a=null==i?void 0:i.left)?a:s,top:null!=(l=null==i?void 0:i.top)?l:d,width:null!=(c=null==r?void 0:r.width)?c:u,height:void 0===(null==r?void 0:r.height)?g:null==r?void 0:r.height})},[ve]),Ee=R(t=>{var n,l;if(c&&a.keepFocusInContainer(t,Y.current),t.target!==t.currentTarget)return;const s=o||120,d=i||100,u=t.metaKey||t.ctrlKey,g=null!=(l=null!=ce?ce:null==(n=Y.current)?void 0:n.clientHeight)?l:0;if(u&&r){switch(t.keyCode){case a.Keys.up:t.preventDefault(),d<=g-5&&O(g-5);break;case a.Keys.down:t.preventDefault(),O(g+5);break;case a.Keys.left:s<=le-5&&I(le-5);break;case a.Keys.right:I(le+5);break;default:return}we(e.onResize,t,!1,void 0)}else if(t.altKey)switch(t.keyCode){case a.Keys.up:V===E.MINIMIZED?(Be(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.DEFAULT})):V===E.DEFAULT&&(De(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.FULLSCREEN}));break;case a.Keys.down:V===E.FULLSCREEN?(Be(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.DEFAULT})):V===E.DEFAULT&&(Ie(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.MINIMIZED}))}else if(!t.ctrlKey){const{internalLeft:n,internalTop:o}=ne.current;let i=n,r=o;switch(t.keyCode){case a.Keys.esc:return void(e.onClose&&Le(t));case a.Keys.up:r=o-5,y(r);break;case a.Keys.down:r=o+5,y(r);break;case a.Keys.left:i=n-5,k(i);break;case a.Keys.right:i=n+5,k(i);break;default:return}we(e.onMove,t,!1,void 0,{left:i,top:r})}},[c,o,i,r,e.onResize,e.onStageChange,e.onClose,e.onMove,ce,le,V,we,ve]),Ce=R(e=>{const t=e.event,{left:n,top:o}=ne.current;G.current.differenceLeft=t.pageX-n,G.current.differenceTop=t.pageY-o},[]),ye=R(e=>{const t=e.event;t.originalEvent.preventDefault();const{stage:n,draggable:o,props:i,width:r,height:a}=ne.current;if(n!==E.FULLSCREEN&&o){const e=Math.max(t.pageY-(G.current.differenceTop||0),0),n=t.pageX-(G.current.differenceLeft||0);y(e),k(n),w(!0),i.onMove&&we(i.onMove,t,!0,!1,{left:n,top:e},{width:r,height:a})}},[we]),be=R(e=>{const t=e.event,{stage:n,draggable:o,props:i,left:r,top:a,width:l,height:c}=ne.current;n!==E.FULLSCREEN&&o&&i.onMove&&we(i.onMove,t,!0,!0,{left:r,top:a},{width:l,height:c}),w(!1)},[we]),ke=R(()=>{Q.current?(clearTimeout(Q.current),Q.current=void 0):(P(!0),$(S(de,oe(),se)))},[de,oe,se]),Te=R(()=>{clearTimeout(Q.current);const e=ie();e&&(Q.current=e.setTimeout(()=>{P(!1),Q.current=void 0}))},[ie]),Ie=R(t=>{t.preventDefault(),G.current.leftBeforeAction=ae,G.current.topBeforeAction=re,G.current.widthBeforeAction=le,G.current.heightBeforeAction=ce,m(E.MINIMIZED),O(0),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.MINIMIZED})},[ae,re,le,ce,e.onStageChange,ve]),De=R(t=>{t.preventDefault(),G.current.leftBeforeAction=ae,G.current.topBeforeAction=re,G.current.widthBeforeAction=le,G.current.heightBeforeAction=ce;const n=ie(),o=n?n.innerWidth:0,i=n?n.innerHeight:0;k(0),y(0),I(e.appendTo?e.appendTo.offsetWidth:o),O(e.appendTo?e.appendTo.offsetHeight:i),m(E.FULLSCREEN),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.FULLSCREEN})},[ae,re,le,ce,e.appendTo,e.onStageChange,ie,ve]),Be=R(t=>{t.preventDefault(),V===E.FULLSCREEN?(m(E.DEFAULT),k(G.current.leftBeforeAction),y(G.current.topBeforeAction),I(G.current.widthBeforeAction),O(G.current.heightBeforeAction)):V===E.MINIMIZED&&(m(E.DEFAULT),O(G.current.heightBeforeAction)),a.dispatchEvent(e.onStageChange,t,ve(),{state:E.DEFAULT})},[V,e.onStageChange,ve]),Le=R(t=>{t.preventDefault(),a.dispatchEvent(e.onClose,t,ve(),{state:void 0})},[e.onClose,ve]),Ne=R(e=>{V===E.FULLSCREEN||V===E.MINIMIZED?Be(e):De(e)},[V,Be,De]),Me=R((e,t)=>{var n,r,a,l,c,s;const{props:d,width:u,height:g,top:p,left:h}=ne.current,f=d.appendTo?e.pageX-J.current.x:e.pageX,m=d.appendTo?e.pageY-J.current.y:e.pageY,v=null!=(r=null!=g?g:null==(n=Y.current)?void 0:n.clientHeight)?r:0,E=o||120,C=i||100,b=p-m,T=h-f,D=f-h,B=m-p;let L=!1;const N={isDragging:!t.end};t.direction.indexOf("n")>=0&&C-(v+b)<0&&(p>0&&(N.height=v+b),N.top=m,L=!0),t.direction.indexOf("s")>=0&&C-B<0&&(N.height=B,L=!0),t.direction.indexOf("w")>=0&&E-(u+T)<0&&(h>0&&(N.width=u+T),N.left=f,L=!0),t.direction.indexOf("e")>=0&&E-D<0&&(N.width=D,L=!0),L&&(void 0!==N.height&&O(N.height),void 0!==N.top&&y(N.top),void 0!==N.width&&I(N.width),void 0!==N.left&&k(N.left),void 0!==N.isDragging&&w(N.isDragging)),we(d.onResize,e,!0,t.end,{left:null!=(a=N.left)?a:h,top:null!=(l=N.top)?l:p},{width:null!=(c=N.width)?c:u,height:null!=(s=N.height)?s:g})},[we]),Se=R(()=>{if(V===E.FULLSCREEN){const t=ie(),n=t?t.innerWidth:0,o=t?t.innerHeight:0;I(e.appendTo?e.appendTo.offsetWidth:n),O(e.appendTo?e.appendTo.offsetHeight:o)}},[V,e.appendTo,ie]);x(()=>{const t=Y.current;t&&g&&t.focus({preventScroll:!0});const n=ie();n&&n.addEventListener("resize",Se),m(e.stage||E.DEFAULT),w(!1),y(ue()),k(ge()),I(pe()),O(he()),P(!0),$(S(de,oe(),se)),G.current={leftBeforeAction:ge(),topBeforeAction:ue(),widthBeforeAction:pe(),heightBeforeAction:he()};const o=oe();if(e.appendTo&&o){const t=e.appendTo.getBoundingClientRect(),n=o.body.getBoundingClientRect();J.current.x=t.left-n.left,J.current.y=t.top-n.top}return()=>{var e;const t=ie();t&&t.removeEventListener("resize",Se),ee.current&&a.canUseDOM&&(document.contains(ee.current)?ee.current.focus({preventScroll:!0}):ee.current.id&&(null==(e=document.getElementById(ee.current.id))||e.focus({preventScroll:!0})))}},[]),x(()=>{void 0!==e.left&&!v&&k(e.left)},[e.left,v]),x(()=>{void 0!==e.top&&!v&&y(e.top)},[e.top,v]),x(()=>{void 0!==e.initialLeft&&k(e.initialLeft)},[e.initialLeft]),x(()=>{void 0!==e.initialTop&&y(e.initialTop)},[e.initialTop]),x(()=>{const t=oe();if(e.appendTo&&t){const n=e.appendTo.getBoundingClientRect(),o=t.body.getBoundingClientRect();J.current.x=n.left-o.left,J.current.y=n.top-o.top}},[e.appendTo,oe]),U(t,()=>({get element(){return Y.current},get windowElement(){return Y.current},get draggable(){return _.current},props:e}),[e]);const Fe=s.Children.toArray(e.children),xe=me(Fe),Re=fe(Fe),Ae=a.classNames("k-window",e.className,{[`k-window-${e.themeColor}`]:e.themeColor,"k-window-minimized":"MINIMIZED"===V,"k-focus":Z}),ze=s.createElement(a.ZIndexContext.Provider,{value:de},s.createElement(s.Fragment,null,c&&s.createElement("div",{className:"k-overlay",style:{zIndex:de,...e.overlayStyle}}),s.createElement("div",{id:e.id,[p]:se,tabIndex:0,role:"dialog","aria-labelledby":te.current,onFocus:ke,onBlur:Te,onKeyDown:Ee,ref:Y,className:Ae,style:{top:re,left:ae,width:le,height:ce||"",zIndex:de,...e.style}},s.createElement(N,{shouldUpdateOnDrag:e.shouldUpdateOnDrag||!1,isDragging:v},s.createElement(a.Draggable,{onPress:Ce,onDrag:ye,onRelease:be,autoScroll:!1,ref:_},s.createElement(D,{stage:V,onDoubleClick:u?Ne:void 0,onMinimizeButtonClick:Ie,onFullScreenButtonClick:De,onRestoreButtonClick:Be,onCloseButtonClick:Le,closeButton:e.closeButton,minimizeButton:e.minimizeButton,maximizeButton:e.maximizeButton,restoreButton:e.restoreButton,id:te.current},e.title)),V===E.MINIMIZED?null:s.createElement(s.Fragment,null,s.createElement("div",{className:"k-window-content"},xe),Re),V===E.DEFAULT&&r?s.createElement(L,{onResize:Me}):null))));return a.canUseDOM?null===e.appendTo?ze:d.createPortal(ze,e.appendTo||document.body):null});Z.displayName="Window";const P=a.createPropsContext(),q=a.withIdHOC(a.withPropsContext(P,Z));q.displayName="KendoReactWindow";const $={autoFocus:o.bool,title:o.any,className:o.string,closeButton:o.func,minimizeButton:o.func,maximizeButton:o.func,restoreButton:o.func,modal:o.bool,overlayStyle:o.object,width:o.number,height:o.number,minWidth:o.number,minHeight:o.number,left:o.number,top:o.number,initialLeft:o.number,initialTop:o.number,initialWidth:o.number,initialHeight:o.number,resizable:o.bool,draggable:o.bool,doubleClickStageChange:o.bool,stage:o.oneOf(["DEFAULT","MINIMIZED","FULLSCREEN"]),onClose:o.func,onMove:o.func,onResize:o.func,onStageChange:o.func,children:o.node,id:o.string,dir:o.string,style:o.object,appendTo:o.any,themeColor:o.oneOf(["primary","dark","light"]),shouldUpdateOnDrag:o.bool};q.propTypes=$,e.Dialog=m,e.DialogActionsBar=g,e.DialogPropsContext=f,e.Window=q,e.WindowActionsBar=M,e.WindowPropsContext=P,e.WindowWithoutContext=Z});
|
|
15
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom"),require("prop-types"),require("@progress/kendo-react-buttons"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-common"),require("@progress/kendo-react-intl")):"function"==typeof define&&define.amd?define(["exports","react","react-dom","prop-types","@progress/kendo-react-buttons","@progress/kendo-svg-icons","@progress/kendo-react-common","@progress/kendo-react-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactDialogs={},e.React,e.ReactDOM,e.PropTypes,e.KendoReactButtons,e.KendoSvgIcons,e.KendoReactCommon,e.KendoReactIntl)}(this,function(e,t,n,o,i,r,a,l){"use strict";function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(n){if("default"!==n){var o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:function(){return e[n]}})}}),t.default=e,Object.freeze(t)}var s=c(t),d=c(n);const u=({children:e,onCloseButtonClick:t,id:n,closeIcon:o})=>s.createElement("div",{className:"k-window-titlebar k-dialog-titlebar",id:n},s.createElement("span",{className:"k-window-title k-dialog-title"},e),o&&s.createElement("div",{className:"k-window-titlebar-actions k-dialog-titlebar-actions"},s.createElement(i.Button,{role:"button","aria-label":"Close",size:"xs",onClick:t,icon:"x",svgIcon:r.xIcon,fillMode:"flat",className:"k-window-titlebar-action k-dialog-titlebar-action"}))),g=e=>{const t={layout:"stretched",...e},{layout:n,children:o}=t,i=a.classNames("k-actions","k-actions-horizontal","k-window-actions k-dialog-actions",{[`k-actions-${n}`]:n});return s.createElement("div",{className:i},o)};g.propTypes={children:o.any,layout:o.oneOf(["start","center","end","stretched"])};const p="data-windowid",h=10002,f=a.createPropsContext(),m=s.forwardRef((e,t)=>{const n=a.useZIndexContext(),o=n?n+2:h,i=s.useRef(null),r=s.useRef(null),l=s.useRef(a.getActiveElement(document)),c=a.usePropsContext(f,e),m=s.useMemo(()=>({...v,...c}),[c]),{title:E,width:w,height:b,children:C,minWidth:y,dir:k,style:T,contentStyle:I,autoFocusedElement:D,appendTo:B,className:L,overlayStyle:N,modal:M=v.modal,closeIcon:x=v.closeIcon,autoFocus:S=v.autoFocus}=m,F=s.useCallback(()=>({props:m,element:r.current}),[m]);s.useImperativeHandle(i,F),s.useImperativeHandle(t,()=>i.current);const z=s.useMemo(()=>s.Children.toArray(C).filter(e=>!s.isValidElement(e)||e.type!==g),[C]),R=s.useMemo(()=>s.Children.toArray(C).filter(e=>s.isValidElement(e)&&e.type===g),[C]),{_id:A,contentId:U,id:W}=s.useMemo(()=>{const e=m.id,t=`${null!=e?e:"accessibility"}-id`;return{_id:t,contentId:`dialog-content-${t}`,id:e||`dialog-title-${t}`}},[m.id]),H=s.useCallback(()=>{if(r.current)if(S&&!D)r.current.focus();else if(!S&&D&&r.current){const e=r.current.querySelector(D);null==e||e.focus()}else{const e=[...a.FOCUSABLE_ELEMENTS].map(e=>e+":not(.k-dialog-titlebar *)");a.focusFirstFocusableChild(r.current,e)}},[S,D]);s.useEffect(()=>(H(),()=>{setTimeout(()=>{var e;!r.current&&l.current&&a.canUseDOM&&(document.contains(l.current)?l.current.focus():l.current.id&&(null==(e=document.getElementById(l.current.id))||e.focus()))})}),[H]);const O=s.useCallback(e=>{e.preventDefault(),a.dispatchEvent(m.onClose,e,F(),void 0)},[m.onClose]),K=s.useCallback(e=>{e.keyCode===a.Keys.esc&&m.onClose&&(e.preventDefault(),O(e)),a.keepFocusInContainer(e,r.current)},[m.onClose,O]),j=s.useMemo(()=>s.createElement(a.ZIndexContext.Provider,{value:o},s.createElement("div",{ref:r,[p]:A,className:"k-dialog-wrapper"+(L?" "+L:""),onKeyDown:K,tabIndex:0,dir:k,style:{zIndex:o,...T}},M&&s.createElement("div",{className:"k-overlay",style:N}),s.createElement("div",{className:a.classNames("k-window k-dialog"),role:"dialog","aria-labelledby":W,"aria-modal":!0,"aria-describedby":U,style:{width:w,height:b,minWidth:y}},E&&s.createElement(u,{closeIcon:x,onCloseButtonClick:O,id:W},E),s.createElement("div",{className:"k-window-content k-dialog-content",style:I,id:U},z),R))),[o,A,L,K,T,k,N,W,U,w,b,y,x,O,I,E,z,R,M]);return a.canUseDOM?null!==B?d.createPortal(j,B||document.body):j:null}),v={autoFocus:!1,modal:!0,closeIcon:!0},E={autoFocus:o.bool,autoFocusedElement:o.string,title:o.any,className:o.string,closeIcon:o.bool,modal:o.bool,overlayStyle:o.object,width:o.oneOfType([o.number,o.string]),height:o.oneOfType([o.number,o.string]),minWidth:o.oneOfType([o.number,o.string]),onClose:o.func,children:o.node,id:o.string,dir:o.string,style:o.object,contentStyle:o.object,appendTo:o.any};m.displayName="KendoReactDialog",m.propTypes=E;var w=(e=>(e.DEFAULT="DEFAULT",e.FULLSCREEN="FULLSCREEN",e.MINIMIZED="MINIMIZED",e))(w||{});const b="dialogs.windowMaximizeButton",C="dialogs.windowMinimizeButton",y="dialogs.windowRestoreButton",k="dialogs.windowCloseButton",T={[b]:"maximize",[C]:"minimize",[y]:"restore",[k]:"close"},I=e=>{const{children:t,onCloseButtonClick:n,onMinimizeButtonClick:o,onFullScreenButtonClick:a,onRestoreButtonClick:c,onDoubleClick:d,stage:u,forwardedRef:g,id:p}=e,h=l.useLocalization(),f=e.minimizeButton?s.createElement(e.minimizeButton,{onClick:o,stage:u}):s.createElement(i.Button,{fillMode:"flat",size:"xs",icon:"window-minimize",svgIcon:r.windowMinimizeIcon,className:"k-window-titlebar-action",onClick:o,"aria-label":h.toLanguageString(C,T[C])}),m=e.maximizeButton?s.createElement(e.maximizeButton,{onClick:a,stage:u}):s.createElement(i.Button,{fillMode:"flat",size:"xs",icon:"window-maximize",svgIcon:r.windowIcon,className:"k-window-titlebar-action",onClick:a,"aria-label":h.toLanguageString(b,T[b])}),v=e.restoreButton?s.createElement(e.restoreButton,{onClick:c,stage:u}):s.createElement(i.Button,{fillMode:"flat",size:"xs",icon:"window-restore",svgIcon:r.windowRestoreIcon,className:"k-window-titlebar-action",onClick:c,"aria-label":h.toLanguageString(y,T[y])}),E=e.closeButton?s.createElement(e.closeButton,{onClick:n,stage:u}):s.createElement(i.Button,{fillMode:"flat",size:"xs",icon:"x",svgIcon:r.xIcon,className:"k-window-titlebar-action",onClick:n,"aria-label":h.toLanguageString(k,T[k])});return s.createElement("div",{className:"k-window-titlebar",style:{touchAction:"none"},ref:g,onDoubleClick:d},s.createElement("span",{className:"k-window-title",id:p},t||""),s.createElement("div",{className:"k-window-titlebar-actions"},u===w.DEFAULT&&f,u===w.DEFAULT&&m,u!==w.DEFAULT&&v,E))},D=s.forwardRef((e,t)=>s.createElement(I,{...e,forwardedRef:t})),B=["n","e","s","w","se","sw","ne","nw"];class L extends s.Component{constructor(){super(...arguments),this.isDragging=!1}render(){return s.createElement("div",{className:"k-resize-handles-wrapper"}," ",B.map((e,t)=>s.createElement(a.Draggable,{key:t,onDrag:t=>{const{event:n}=t;this.isDragging=!0,n.originalEvent.preventDefault(),this.props.onResize(n,{end:!1,direction:e})},onRelease:t=>{const{event:n}=t;n.originalEvent.preventDefault(),this.isDragging&&(this.isDragging=!1,this.props.onResize(n,{end:!0,direction:e}))}},s.createElement("div",{className:"k-resize-handle k-resize-"+e,style:{display:"block",touchAction:"none",userSelect:"none"}}))))}}class N extends s.Component{shouldComponentUpdate(e){return e.shouldUpdateOnDrag||!e.isDragging}render(){return this.props.children}}const M=e=>{const t={layout:"end",...e},{layout:n,children:o}=t,i=a.classNames("k-actions","k-window-actions","k-actions-horizontal","k-hstack",{"k-justify-content-start":"start"===n,"k-justify-content-center":"center"===n,"k-justify-content-end":"end"===n,"k-justify-content-stretch":"stretched"===n});return s.createElement("div",{className:i},o)};M.propTypes={children:o.any,layout:o.oneOf(["start","center","end","stretched"])};const x=(e,t,n)=>{let o=e;if(t&&t.defaultView){const e=t.querySelectorAll(".k-window:not(.k-dialog), .k-dialog-wrapper");let i=!1;return e.forEach(e=>{const r=t.defaultView.getComputedStyle(e,null);if(e.getAttribute(p)!==n&&null!==r.zIndex){const e=parseInt(r.zIndex,10);e>=o&&(o=e,i=!0)}}),i?o+2:o}return o},{useState:S,useEffect:F,useCallback:z,useMemo:R,useRef:A,useImperativeHandle:U,useContext:W,forwardRef:H}=s,O=300,K=300,j={minWidth:120,minHeight:100,resizable:!0,draggable:!0,modal:!1,doubleClickStageChange:!0,autoFocus:!0},Z=H((e,t)=>{var n;const{minWidth:o=j.minWidth,minHeight:i=j.minHeight,resizable:r=j.resizable,draggable:l=j.draggable,modal:c=j.modal,doubleClickStageChange:u=j.doubleClickStageChange,autoFocus:g=j.autoFocus}=e,[f,m]=S(e.stage||w.DEFAULT),[v,E]=S(!1),[b,C]=S(0),[y,k]=S(0),[T,I]=S(O),[B,H]=S(K),[Z,P]=S(!0),[q,V]=S(h),X=null!=(n=e.stage)?n:f,Y=W(a.ZIndexContext),$=A(null),_=A(null),G=A({leftBeforeAction:0,topBeforeAction:0,widthBeforeAction:O,heightBeforeAction:K}),J=A({x:0,y:0}),Q=A(void 0),ee=A(a.canUseDOM?document.activeElement:null),te=A("window-title-"+(e.id?e.id+"-accessibility-id":"")),ne=A({left:0,top:0,width:O,height:K,internalLeft:y,internalTop:b,internalWidth:T,internalHeight:B,stage:X,draggable:l,props:e}),oe=z(()=>{const t=a.canUseDOM?document:null;return e.appendTo?e.appendTo.ownerDocument:t},[e.appendTo]),ie=z(()=>{const e=oe();return null==e?void 0:e.defaultView},[oe]),re=R(()=>{var t;return X!==w.FULLSCREEN?Math.max(null!=(t=e.top)?t:b,0):0},[X,e.top,b]),ae=R(()=>{var t;return X!==w.FULLSCREEN?Math.max(null!=(t=e.left)?t:y,0):0},[X,e.left,y]),le=R(()=>{var t;const n=null!=(t=e.width)?t:T;if(X===w.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetWidth;const t=ie();return t?t.innerWidth:0}return n},[X,e.width,e.appendTo,T,ie]),ce=R(()=>{const t=void 0===e.height?B:e.height;if(X===w.FULLSCREEN){if(e.appendTo)return e.appendTo.offsetHeight;const t=ie();return t?t.innerHeight:0}return X===w.MINIMIZED?0:t},[X,e.height,e.appendTo,B,ie]),se=R(()=>e.id?e.id+"-accessibility-id":void 0,[e.id]);F(()=>{ne.current={left:ae,top:re,width:le,height:ce,internalLeft:y,internalTop:b,internalWidth:T,internalHeight:B,stage:X,draggable:l,props:e}});const de=R(()=>{if(void 0===Y)return null!=Y?Y:h;return q>(Y?Y+2:0)?q:Y+2},[q,Y]),ue=z(()=>{var t,n;if(void 0!==e.top)return e.top;if(void 0!==e.initialTop)return e.initialTop;let o=K;if(void 0!==e.height?o=e.height:void 0!==e.initialHeight&&(o=e.initialHeight),e.appendTo&&o)return e.appendTo.offsetHeight/2-o/2;const i=ie();return i?i.innerHeight/2-(null!=(n=null!=o?o:null==(t=$.current)?void 0:t.clientHeight)?n:0)/2:0},[e.top,e.initialTop,e.height,e.initialHeight,e.appendTo,ie]),ge=z(()=>{if(void 0!==e.left)return e.left;if(void 0!==e.initialLeft)return e.initialLeft;let t=O;if(void 0!==e.width?t=e.width:void 0!==e.initialWidth&&(t=e.initialWidth),e.appendTo)return e.appendTo.offsetWidth/2-t/2;const n=ie();return n?n.innerWidth/2-t/2:0},[e.left,e.initialLeft,e.width,e.initialWidth,e.appendTo,ie]),pe=z(()=>{let t=O;return void 0!==e.width?t=e.width:void 0!==e.initialWidth&&(t=e.initialWidth),t},[e.width,e.initialWidth]),he=z(()=>{let t=K;return void 0!==e.height?t=e.height:void 0!==e.initialHeight&&(t=e.initialHeight),t},[e.height,e.initialHeight]),fe=z(e=>e.filter(e=>(null==e?void 0:e.type)===M),[]),me=z(e=>e.filter(e=>e&&e.type!==M),[]),ve=z(()=>"object"==typeof t&&null!==t&&"current"in t?t.current:null,[t]),Ee=z((e,t,n,o,i,r)=>{var a,l,c;if(!e)return;const{internalLeft:s,internalTop:d,internalWidth:u,internalHeight:g}=ne.current;e({nativeEvent:t.nativeEvent?t.nativeEvent:t.originalEvent,drag:n,end:o,target:ve(),left:null!=(a=null==i?void 0:i.left)?a:s,top:null!=(l=null==i?void 0:i.top)?l:d,width:null!=(c=null==r?void 0:r.width)?c:u,height:void 0===(null==r?void 0:r.height)?g:null==r?void 0:r.height})},[ve]),we=z(t=>{var n,l;if(c&&a.keepFocusInContainer(t,$.current),t.target!==t.currentTarget)return;const s=o||120,d=i||100,u=t.metaKey||t.ctrlKey,g=null!=(l=null!=ce?ce:null==(n=$.current)?void 0:n.clientHeight)?l:0;if(u&&r){switch(t.keyCode){case a.Keys.up:t.preventDefault(),d<=g-5&&H(g-5);break;case a.Keys.down:t.preventDefault(),H(g+5);break;case a.Keys.left:s<=le-5&&I(le-5);break;case a.Keys.right:I(le+5);break;default:return}Ee(e.onResize,t,!1,void 0)}else if(t.altKey)switch(t.keyCode){case a.Keys.up:X===w.MINIMIZED?(Be(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.DEFAULT})):X===w.DEFAULT&&(De(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.FULLSCREEN}));break;case a.Keys.down:X===w.FULLSCREEN?(Be(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.DEFAULT})):X===w.DEFAULT&&(Ie(t),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.MINIMIZED}))}else if(!t.ctrlKey){const{internalLeft:n,internalTop:o}=ne.current;let i=n,r=o;switch(t.keyCode){case a.Keys.esc:return void(e.onClose&&Le(t));case a.Keys.up:r=o-5,C(r);break;case a.Keys.down:r=o+5,C(r);break;case a.Keys.left:i=n-5,k(i);break;case a.Keys.right:i=n+5,k(i);break;default:return}Ee(e.onMove,t,!1,void 0,{left:i,top:r})}},[c,o,i,r,e.onResize,e.onStageChange,e.onClose,e.onMove,ce,le,X,Ee,ve]),be=z(e=>{const t=e.event,{left:n,top:o}=ne.current;G.current.differenceLeft=t.pageX-n,G.current.differenceTop=t.pageY-o},[]),Ce=z(e=>{const t=e.event;t.originalEvent.preventDefault();const{stage:n,draggable:o,props:i,width:r,height:a}=ne.current;if(n!==w.FULLSCREEN&&o){const e=Math.max(t.pageY-(G.current.differenceTop||0),0),n=t.pageX-(G.current.differenceLeft||0);C(e),k(n),E(!0),i.onMove&&Ee(i.onMove,t,!0,!1,{left:n,top:e},{width:r,height:a})}},[Ee]),ye=z(e=>{const t=e.event,{stage:n,draggable:o,props:i,left:r,top:a,width:l,height:c}=ne.current;n!==w.FULLSCREEN&&o&&i.onMove&&Ee(i.onMove,t,!0,!0,{left:r,top:a},{width:l,height:c}),E(!1)},[Ee]),ke=z(()=>{Q.current?(clearTimeout(Q.current),Q.current=void 0):(P(!0),V(x(de,oe(),se)))},[de,oe,se]),Te=z(()=>{clearTimeout(Q.current);const e=ie();e&&(Q.current=e.setTimeout(()=>{P(!1),Q.current=void 0}))},[ie]),Ie=z(t=>{t.preventDefault(),G.current.leftBeforeAction=ae,G.current.topBeforeAction=re,G.current.widthBeforeAction=le,G.current.heightBeforeAction=ce,m(w.MINIMIZED),H(0),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.MINIMIZED})},[ae,re,le,ce,e.onStageChange,ve]),De=z(t=>{t.preventDefault(),G.current.leftBeforeAction=ae,G.current.topBeforeAction=re,G.current.widthBeforeAction=le,G.current.heightBeforeAction=ce;const n=ie(),o=n?n.innerWidth:0,i=n?n.innerHeight:0;k(0),C(0),I(e.appendTo?e.appendTo.offsetWidth:o),H(e.appendTo?e.appendTo.offsetHeight:i),m(w.FULLSCREEN),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.FULLSCREEN})},[ae,re,le,ce,e.appendTo,e.onStageChange,ie,ve]),Be=z(t=>{t.preventDefault(),X===w.FULLSCREEN?(m(w.DEFAULT),k(G.current.leftBeforeAction),C(G.current.topBeforeAction),I(G.current.widthBeforeAction),H(G.current.heightBeforeAction)):X===w.MINIMIZED&&(m(w.DEFAULT),H(G.current.heightBeforeAction)),a.dispatchEvent(e.onStageChange,t,ve(),{state:w.DEFAULT})},[X,e.onStageChange,ve]),Le=z(t=>{t.preventDefault(),a.dispatchEvent(e.onClose,t,ve(),{state:void 0})},[e.onClose,ve]),Ne=z(e=>{X===w.FULLSCREEN||X===w.MINIMIZED?Be(e):De(e)},[X,Be,De]),Me=z((e,t)=>{var n,r,a,l,c,s;const{props:d,width:u,height:g,top:p,left:h}=ne.current,f=d.appendTo?e.pageX-J.current.x:e.pageX,m=d.appendTo?e.pageY-J.current.y:e.pageY,v=null!=(r=null!=g?g:null==(n=$.current)?void 0:n.clientHeight)?r:0,w=o||120,b=i||100,y=p-m,T=h-f,D=f-h,B=m-p;let L=!1;const N={isDragging:!t.end};t.direction.indexOf("n")>=0&&b-(v+y)<0&&(p>0&&(N.height=v+y),N.top=m,L=!0),t.direction.indexOf("s")>=0&&b-B<0&&(N.height=B,L=!0),t.direction.indexOf("w")>=0&&w-(u+T)<0&&(h>0&&(N.width=u+T),N.left=f,L=!0),t.direction.indexOf("e")>=0&&w-D<0&&(N.width=D,L=!0),L&&(void 0!==N.height&&H(N.height),void 0!==N.top&&C(N.top),void 0!==N.width&&I(N.width),void 0!==N.left&&k(N.left),void 0!==N.isDragging&&E(N.isDragging)),Ee(d.onResize,e,!0,t.end,{left:null!=(a=N.left)?a:h,top:null!=(l=N.top)?l:p},{width:null!=(c=N.width)?c:u,height:null!=(s=N.height)?s:g})},[Ee]),xe=z(()=>{if(X===w.FULLSCREEN){const t=ie(),n=t?t.innerWidth:0,o=t?t.innerHeight:0;I(e.appendTo?e.appendTo.offsetWidth:n),H(e.appendTo?e.appendTo.offsetHeight:o)}},[X,e.appendTo,ie]);F(()=>{const t=$.current;t&&g&&t.focus({preventScroll:!0});const n=ie();n&&n.addEventListener("resize",xe),m(e.stage||w.DEFAULT),E(!1),C(ue()),k(ge()),I(pe()),H(he()),P(!0),V(x(de,oe(),se)),G.current={leftBeforeAction:ge(),topBeforeAction:ue(),widthBeforeAction:pe(),heightBeforeAction:he()};const o=oe();if(e.appendTo&&o){const t=e.appendTo.getBoundingClientRect(),n=o.body.getBoundingClientRect();J.current.x=t.left-n.left,J.current.y=t.top-n.top}return()=>{var e;const t=ie();t&&t.removeEventListener("resize",xe),ee.current&&a.canUseDOM&&(document.contains(ee.current)?ee.current.focus({preventScroll:!0}):ee.current.id&&(null==(e=document.getElementById(ee.current.id))||e.focus({preventScroll:!0})))}},[]),F(()=>{void 0!==e.left&&!v&&k(e.left)},[e.left,v]),F(()=>{void 0!==e.top&&!v&&C(e.top)},[e.top,v]),F(()=>{void 0!==e.initialLeft&&k(e.initialLeft)},[e.initialLeft]),F(()=>{void 0!==e.initialTop&&C(e.initialTop)},[e.initialTop]),F(()=>{const t=oe();if(e.appendTo&&t){const n=e.appendTo.getBoundingClientRect(),o=t.body.getBoundingClientRect();J.current.x=n.left-o.left,J.current.y=n.top-o.top}},[e.appendTo,oe]),U(t,()=>({get element(){return $.current},get windowElement(){return $.current},get draggable(){return _.current},props:e}),[e]);const Se=s.Children.toArray(e.children),Fe=me(Se),ze=fe(Se),Re=a.classNames("k-window",e.className,{"k-window-minimized":"MINIMIZED"===X,"k-focus":Z}),Ae=s.createElement(a.ZIndexContext.Provider,{value:de},s.createElement(s.Fragment,null,c&&s.createElement("div",{className:"k-overlay",style:{zIndex:de,...e.overlayStyle}}),s.createElement("div",{id:e.id,[p]:se,tabIndex:0,role:"dialog","aria-labelledby":te.current,onFocus:ke,onBlur:Te,onKeyDown:we,ref:$,className:Re,style:{top:re,left:ae,width:le,height:ce||"",zIndex:de,...e.style}},s.createElement(N,{shouldUpdateOnDrag:e.shouldUpdateOnDrag||!1,isDragging:v},s.createElement(a.Draggable,{onPress:be,onDrag:Ce,onRelease:ye,autoScroll:!1,ref:_},s.createElement(D,{stage:X,onDoubleClick:u?Ne:void 0,onMinimizeButtonClick:Ie,onFullScreenButtonClick:De,onRestoreButtonClick:Be,onCloseButtonClick:Le,closeButton:e.closeButton,minimizeButton:e.minimizeButton,maximizeButton:e.maximizeButton,restoreButton:e.restoreButton,id:te.current},e.title)),X===w.MINIMIZED?null:s.createElement(s.Fragment,null,s.createElement("div",{className:"k-window-content"},Fe),ze),X===w.DEFAULT&&r?s.createElement(L,{onResize:Me}):null))));return a.canUseDOM?null===e.appendTo?Ae:d.createPortal(Ae,e.appendTo||document.body):null});Z.displayName="Window";const P=a.createPropsContext(),q=a.withIdHOC(a.withPropsContext(P,Z));q.displayName="KendoReactWindow";const V={autoFocus:o.bool,title:o.any,className:o.string,closeButton:o.func,minimizeButton:o.func,maximizeButton:o.func,restoreButton:o.func,modal:o.bool,overlayStyle:o.object,width:o.number,height:o.number,minWidth:o.number,minHeight:o.number,left:o.number,top:o.number,initialLeft:o.number,initialTop:o.number,initialWidth:o.number,initialHeight:o.number,resizable:o.bool,draggable:o.bool,doubleClickStageChange:o.bool,stage:o.oneOf(["DEFAULT","MINIMIZED","FULLSCREEN"]),onClose:o.func,onMove:o.func,onResize:o.func,onStageChange:o.func,children:o.node,id:o.string,dir:o.string,style:o.object,appendTo:o.any,shouldUpdateOnDrag:o.bool};q.propTypes=V,e.Dialog=m,e.DialogActionsBar=g,e.DialogPropsContext=f,e.Window=q,e.WindowActionsBar=M,e.WindowPropsContext=P,e.WindowWithoutContext=Z});
|
package/package-metadata.mjs
CHANGED
|
@@ -7,7 +7,7 @@ export const packageMetadata = Object.freeze({
|
|
|
7
7
|
productName: 'KendoReact',
|
|
8
8
|
productCode: 'KENDOUIREACT',
|
|
9
9
|
productCodes: ['KENDOUIREACT'],
|
|
10
|
-
publishDate:
|
|
11
|
-
version: '14.5.0-develop.
|
|
10
|
+
publishDate: 1778667130,
|
|
11
|
+
version: '14.5.0-develop.11',
|
|
12
12
|
licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
|
|
13
13
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-dialogs",
|
|
3
|
-
"version": "14.5.0-develop.
|
|
3
|
+
"version": "14.5.0-develop.11",
|
|
4
4
|
"description": "React Dialogs provide modal and non-modal windows for showing additional information to the user. KendoReact Dialogs package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -26,10 +26,10 @@
|
|
|
26
26
|
"sideEffects": false,
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"@progress/kendo-licensing": "^1.7.2",
|
|
29
|
-
"@progress/kendo-react-buttons": "14.5.0-develop.
|
|
30
|
-
"@progress/kendo-react-common": "14.5.0-develop.
|
|
31
|
-
"@progress/kendo-react-intl": "14.5.0-develop.
|
|
32
|
-
"@progress/kendo-svg-icons": "^4.0.0",
|
|
29
|
+
"@progress/kendo-react-buttons": "14.5.0-develop.11",
|
|
30
|
+
"@progress/kendo-react-common": "14.5.0-develop.11",
|
|
31
|
+
"@progress/kendo-react-intl": "14.5.0-develop.11",
|
|
32
|
+
"@progress/kendo-svg-icons": "^4.9.0 || ^5.0.0",
|
|
33
33
|
"react": "^18.0.0 || ^19.0.0",
|
|
34
34
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
35
35
|
},
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
"package": {
|
|
73
73
|
"productName": "KendoReact",
|
|
74
74
|
"productCode": "KENDOUIREACT",
|
|
75
|
-
"publishDate":
|
|
75
|
+
"publishDate": 1778667130,
|
|
76
76
|
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
77
77
|
}
|
|
78
78
|
},
|
|
@@ -82,5 +82,10 @@
|
|
|
82
82
|
},
|
|
83
83
|
"publishConfig": {
|
|
84
84
|
"access": "public"
|
|
85
|
+
},
|
|
86
|
+
"peerDependenciesMeta": {
|
|
87
|
+
"@progress/kendo-svg-icons": {
|
|
88
|
+
"optional": true
|
|
89
|
+
}
|
|
85
90
|
}
|
|
86
91
|
}
|