@progress/kendo-react-dialogs 7.2.4-develop.2 → 7.2.4-develop.4

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.
Files changed (49) hide show
  1. package/Dialog.js +8 -0
  2. package/Dialog.mjs +122 -0
  3. package/DialogActionsBar.js +8 -0
  4. package/DialogActionsBar.mjs +32 -0
  5. package/DialogTitleBar.js +8 -0
  6. package/DialogTitleBar.mjs +26 -0
  7. package/MiddleLayerOptimization.js +8 -0
  8. package/MiddleLayerOptimization.mjs +20 -0
  9. package/StageEnum.js +8 -0
  10. package/StageEnum.mjs +12 -0
  11. package/Window.js +8 -0
  12. package/Window.mjs +407 -0
  13. package/WindowActionsBar.js +8 -0
  14. package/WindowActionsBar.mjs +36 -0
  15. package/WindowResizeHandlers.js +8 -0
  16. package/WindowResizeHandlers.mjs +39 -0
  17. package/WindowTitlebar.js +8 -0
  18. package/WindowTitlebar.mjs +87 -0
  19. package/constants.js +8 -0
  20. package/constants.mjs +15 -0
  21. package/dist/cdn/js/kendo-react-dialogs.js +8 -5
  22. package/index.d.mts +599 -5
  23. package/index.d.ts +599 -13
  24. package/index.js +8 -5
  25. package/index.mjs +17 -692
  26. package/messages/index.js +8 -0
  27. package/messages/index.mjs +21 -0
  28. package/package-metadata.js +8 -0
  29. package/package-metadata.mjs +19 -0
  30. package/package.json +3 -3
  31. package/utils.js +8 -0
  32. package/utils.mjs +26 -0
  33. package/Dialog.d.ts +0 -94
  34. package/DialogActionsBar.d.ts +0 -25
  35. package/DialogProps.d.ts +0 -77
  36. package/DialogTitleBar.d.ts +0 -30
  37. package/MiddleLayerOptimization.d.ts +0 -21
  38. package/StageEnum.d.ts +0 -9
  39. package/Window.d.ts +0 -179
  40. package/WindowActionsBar.d.ts +0 -25
  41. package/WindowProps.d.ts +0 -151
  42. package/WindowResizeHandlers.d.ts +0 -20
  43. package/WindowTitlebar.d.ts +0 -67
  44. package/constants.d.ts +0 -12
  45. package/events.d.ts +0 -49
  46. package/messages/index.d.ts +0 -29
  47. package/models/actions-layout.d.ts +0 -8
  48. package/package-metadata.d.ts +0 -9
  49. package/utils.d.ts +0 -6
package/index.mjs CHANGED
@@ -1,695 +1,20 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the package root for more information
4
- *-------------------------------------------------------------------------------------------*/
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
5
8
  "use client";
6
- import * as s from "react";
7
- import * as K from "react-dom";
8
- import o from "prop-types";
9
- import { Button as D } from "@progress/kendo-react-buttons";
10
- import { xIcon as j, windowMinimizeIcon as et, windowIcon as it, windowRestoreIcon as st } from "@progress/kendo-svg-icons";
11
- import { classNames as x, ZIndexContext as L, createPropsContext as G, withIdHOC as X, withPropsContext as V, dispatchEvent as m, Keys as p, getActiveElement as ot, validatePackage as Y, shouldShowValidationUI as $, WatermarkOverlay as q, canUseDOM as J, Draggable as Q } from "@progress/kendo-react-common";
12
- import { useLocalization as nt } from "@progress/kendo-react-intl";
13
- const at = ({ children: r, onCloseButtonClick: i, id: t, closeIcon: e }) => /* @__PURE__ */ s.createElement("div", { className: "k-window-titlebar k-dialog-titlebar", id: t }, /* @__PURE__ */ s.createElement("span", { className: "k-window-title k-dialog-title" }, r), /* @__PURE__ */ s.createElement("div", { className: "k-window-titlebar-actions k-dialog-titlebar-actions" }, e && /* @__PURE__ */ s.createElement(
14
- D,
15
- {
16
- role: "button",
17
- "aria-label": "Close",
18
- onClick: i,
19
- icon: "x",
20
- svgIcon: j,
21
- fillMode: "flat",
22
- className: "k-window-titlebar-action k-dialog-titlebar-action"
23
- }
24
- ))), v = (r) => {
25
- const i = {
26
- layout: "stretched",
27
- ...r
28
- }, { layout: t, children: e } = i, n = x(
29
- "k-actions",
30
- "k-actions-horizontal",
31
- "k-window-actions k-dialog-actions",
32
- {
33
- [`k-actions-${t}`]: t
34
- }
35
- );
36
- return /* @__PURE__ */ s.createElement("div", { className: n }, e);
37
- };
38
- v.propTypes = {
39
- children: o.any,
40
- layout: o.oneOf(["start", "center", "end", "stretched"])
41
- };
42
- const y = {
43
- name: "@progress/kendo-react-dialogs",
44
- productName: "KendoReact",
45
- productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
46
- publishDate: 1709197940,
47
- version: "",
48
- licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
49
- }, O = "data-windowid", N = 10002, S = 2, rt = ".k-window:not(.k-dialog), .k-dialog-wrapper", z = (r, i, t) => {
50
- let e = r;
51
- if (i && i.defaultView) {
52
- let n = i.querySelectorAll(rt), l = !1;
53
- return n.forEach((d) => {
54
- let h = i.defaultView.getComputedStyle(d, null);
55
- if (d.getAttribute(O) !== t && h.zIndex !== null) {
56
- let c = parseInt(h.zIndex, 10);
57
- c >= e && (e = c, l = !0);
58
- }
59
- }), l ? e + S : e;
60
- }
61
- return e;
62
- };
63
- class b extends s.Component {
64
- constructor(i) {
65
- super(i), this.context = 0, this.titleId = this.generateTitleId(), this.contentId = this.generateContentId(), this.showLicenseWatermark = !1, this.onCloseDialog = (t) => {
66
- t.preventDefault(), m(this.props.onClose, t, this, void 0);
67
- }, this.onKeyDown = (t) => {
68
- t.keyCode === p.esc && this.props.onClose && (t.preventDefault(), this.onCloseDialog(t));
69
- const e = this.element;
70
- if (e && t.keyCode === p.tab) {
71
- const n = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])', l = e.querySelectorAll(n), d = l[0], h = l[l.length - 1], g = this.getDocument(), c = ot(g);
72
- t.shiftKey ? (g && c === d || g && c === this.element) && (h.focus(), t.preventDefault()) : g && c === h && (d.focus(), t.preventDefault());
73
- }
74
- }, this.getCurrentZIndex = () => !this.state || this.context === void 0 ? this.context ? this.context : N : this.state.zIndex > (this.context ? this.context + S : 0) ? this.state.zIndex : this.context + S, this.getDocument = () => this.props.appendTo ? this.props.appendTo.ownerDocument : document, Y(y), this.showLicenseWatermark = $(y);
75
- }
76
- get _id() {
77
- return this.props.id + "-accessibility-id";
78
- }
79
- /**
80
- * @hidden
81
- */
82
- componentDidMount() {
83
- this.element && (this.props.autoFocus && this.element.focus(), this.setState({
84
- zIndex: z(this.getCurrentZIndex(), this.getDocument(), this._id)
85
- }));
86
- }
87
- /**
88
- * @hidden
89
- */
90
- render() {
91
- const i = this.props.id !== void 0 ? this.props.id : this.titleId, { title: t, width: e, height: n, children: l, minWidth: d, dir: h, style: g, contentStyle: c } = this.props, f = s.Children.toArray(l), C = this.getContent(f), E = this.getActionBar(f), I = t ? {
92
- "aria-labelledby": i
93
- } : null, u = this.props.closeIcon !== void 0 ? this.props.closeIcon : !0, Z = this.getCurrentZIndex(), P = /* @__PURE__ */ s.createElement(L.Provider, { value: Z }, /* @__PURE__ */ s.createElement(
94
- "div",
95
- {
96
- [O]: this._id,
97
- className: "k-dialog-wrapper" + (this.props.className ? " " + this.props.className : ""),
98
- onKeyDown: this.onKeyDown,
99
- tabIndex: 0,
100
- dir: h,
101
- style: {
102
- zIndex: Z,
103
- ...g
104
- },
105
- ref: (tt) => this.element = tt
106
- },
107
- /* @__PURE__ */ s.createElement("div", { className: "k-overlay" }),
108
- /* @__PURE__ */ s.createElement(
109
- "div",
110
- {
111
- ...I,
112
- className: x(
113
- "k-window k-dialog",
114
- {
115
- [`k-window-${this.props.themeColor}`]: this.props.themeColor
116
- }
117
- ),
118
- role: "dialog",
119
- "aria-labelledby": i,
120
- "aria-modal": !0,
121
- "aria-describedby": this.contentId,
122
- style: { width: e, height: n, minWidth: d }
123
- },
124
- this.props.title && /* @__PURE__ */ s.createElement(
125
- at,
126
- {
127
- closeIcon: u,
128
- onCloseButtonClick: this.onCloseDialog,
129
- id: i
130
- },
131
- t
132
- ),
133
- /* @__PURE__ */ s.createElement("div", { className: "k-window-content k-dialog-content", style: c, id: this.contentId }, C),
134
- E,
135
- this.showLicenseWatermark && /* @__PURE__ */ s.createElement(q, null)
136
- )
137
- ));
138
- return J ? this.props.appendTo !== null ? K.createPortal(P, this.props.appendTo || document.body) : P : null;
139
- }
140
- getActionBar(i) {
141
- return i.filter((t) => t && t.type === v);
142
- }
143
- getContent(i) {
144
- return i.filter((t) => t && t.type !== v);
145
- }
146
- generateTitleId() {
147
- return "dialog-title-" + this._id;
148
- }
149
- generateContentId() {
150
- return "dialog-content-" + this._id;
151
- }
152
- }
153
- b.displayName = "Dialog";
154
- b.propTypes = {
155
- title: o.any,
156
- id: o.string,
157
- dir: o.string,
158
- style: o.object,
159
- closeIcon: o.bool,
160
- width: o.oneOfType([o.number, o.string]),
161
- height: o.oneOfType([o.number, o.string]),
162
- minWidth: o.oneOfType([o.number, o.string]),
163
- autoFocus: o.bool
164
- };
165
- b.defaultProps = {
166
- autoFocus: !1
167
- };
168
- b.contextType = L;
169
- const ht = G(), lt = X(V(ht, b));
170
- lt.displayName = "KendoReactDialog";
171
- var a = /* @__PURE__ */ ((r) => (r.DEFAULT = "DEFAULT", r.FULLSCREEN = "FULLSCREEN", r.MINIMIZED = "MINIMIZED", r))(a || {});
172
- const M = "dialogs.windowMaximizeButton", A = "dialogs.windowMinimizeButton", R = "dialogs.windowRestoreButton", F = "dialogs.windowCloseButton", T = {
173
- [M]: "maximize",
174
- [A]: "minimize",
175
- [R]: "restore",
176
- [F]: "close"
177
- }, dt = (r) => {
178
- const {
179
- children: i,
180
- onCloseButtonClick: t,
181
- onMinimizeButtonClick: e,
182
- onFullScreenButtonClick: n,
183
- onRestoreButtonClick: l,
184
- onDoubleClick: d,
185
- stage: h,
186
- forwardedRef: g,
187
- id: c
188
- } = r, f = nt(), C = r.minimizeButton ? /* @__PURE__ */ s.createElement(r.minimizeButton, { onClick: e, stage: h }) : /* @__PURE__ */ s.createElement(
189
- D,
190
- {
191
- fillMode: "flat",
192
- icon: "window-minimize",
193
- svgIcon: et,
194
- className: "k-window-titlebar-action",
195
- onClick: e,
196
- "aria-label": f.toLanguageString(A, T[A])
197
- }
198
- ), E = r.maximizeButton ? /* @__PURE__ */ s.createElement(r.maximizeButton, { onClick: n, stage: h }) : /* @__PURE__ */ s.createElement(
199
- D,
200
- {
201
- fillMode: "flat",
202
- icon: "window-maximize",
203
- svgIcon: it,
204
- className: "k-window-titlebar-action",
205
- onClick: n,
206
- "aria-label": f.toLanguageString(M, T[M])
207
- }
208
- ), I = r.restoreButton ? /* @__PURE__ */ s.createElement(r.restoreButton, { onClick: l, stage: h }) : /* @__PURE__ */ s.createElement(
209
- D,
210
- {
211
- fillMode: "flat",
212
- icon: "window-restore",
213
- svgIcon: st,
214
- className: "k-window-titlebar-action",
215
- onClick: l,
216
- "aria-label": f.toLanguageString(R, T[R])
217
- }
218
- ), u = r.closeButton ? /* @__PURE__ */ s.createElement(r.closeButton, { onClick: t, stage: h }) : /* @__PURE__ */ s.createElement(
219
- D,
220
- {
221
- fillMode: "flat",
222
- icon: "x",
223
- svgIcon: j,
224
- className: "k-window-titlebar-action",
225
- onClick: t,
226
- "aria-label": f.toLanguageString(F, T[F])
227
- }
228
- );
229
- return /* @__PURE__ */ s.createElement(
230
- "div",
231
- {
232
- className: "k-window-titlebar",
233
- style: { touchAction: "none" },
234
- ref: g,
235
- onDoubleClick: d
236
- },
237
- /* @__PURE__ */ s.createElement("span", { className: "k-window-title", id: c }, i || ""),
238
- /* @__PURE__ */ s.createElement("div", { className: "k-window-titlebar-actions" }, h === a.DEFAULT && C, h === a.DEFAULT && E, h !== a.DEFAULT && I, u)
239
- );
240
- }, ct = s.forwardRef((r, i) => /* @__PURE__ */ s.createElement(
241
- dt,
242
- {
243
- ...r,
244
- forwardedRef: i
245
- }
246
- )), pt = ["n", "e", "s", "w", "se", "sw", "ne", "nw"];
247
- class gt extends s.Component {
248
- render() {
249
- return /* @__PURE__ */ s.createElement("div", { className: "k-resize-handles-wrapper" }, " ", pt.map((i, t) => /* @__PURE__ */ s.createElement(
250
- Q,
251
- {
252
- key: t,
253
- onDrag: (e) => {
254
- const { event: n } = e;
255
- n.originalEvent.preventDefault(), this.props.onResize(n, { end: !1, direction: i });
256
- },
257
- onRelease: (e) => {
258
- const { event: n } = e;
259
- n.originalEvent.preventDefault(), this.props.onResize(n, { end: !0, direction: i });
260
- }
261
- },
262
- /* @__PURE__ */ s.createElement(
263
- "div",
264
- {
265
- className: "k-resize-handle k-resize-" + i,
266
- style: { display: "block", touchAction: "none" }
267
- }
268
- )
269
- )));
270
- }
271
- }
272
- class ut extends s.Component {
273
- shouldComponentUpdate(i) {
274
- return i.shouldUpdateOnDrag || !i.isDragging;
275
- }
276
- render() {
277
- return this.props.children;
278
- }
279
- }
280
- const U = (r) => {
281
- const i = {
282
- layout: "end",
283
- ...r
284
- }, { layout: t, children: e } = i, n = x(
285
- "k-actions",
286
- "k-window-actions",
287
- "k-actions-horizontal",
288
- "k-hstack",
289
- {
290
- "k-justify-content-start": t === "start",
291
- "k-justify-content-center": t === "center",
292
- "k-justify-content-end": t === "end",
293
- "k-justify-content-stretch": t === "stretched"
294
- }
295
- );
296
- return /* @__PURE__ */ s.createElement("div", { className: n }, e);
297
- };
298
- U.propTypes = {
299
- children: o.any,
300
- layout: o.oneOf(["start", "center", "end", "stretched"])
301
- };
302
- const W = 300, B = 300, H = 120, _ = 100, w = 5;
303
- class k extends s.Component {
304
- constructor(i) {
305
- super(i), this.context = 0, this.draggable = null, this.offSetCoordinates = { x: 0, y: 0 }, this.titleId = this.generateTitleId(), this.mounted = !1, this.showLicenseWatermark = !1, this.onKeyDown = (t) => {
306
- if (t.target !== t.currentTarget)
307
- return;
308
- const e = this.props.minWidth || H, n = this.props.minHeight || _;
309
- if (t.ctrlKey && this.props.resizable) {
310
- switch (t.keyCode) {
311
- case p.up:
312
- t.preventDefault(), n <= this.height - w && this.setState({ height: this.height - w });
313
- break;
314
- case p.down:
315
- t.preventDefault(), this.setState({ height: this.height + w });
316
- break;
317
- case p.left:
318
- e <= this.width - w && this.setState({ width: this.width - w });
319
- break;
320
- case p.right:
321
- this.setState({ width: this.width + w });
322
- break;
323
- default:
324
- return;
325
- }
326
- this.dispatchMoveEvent(this.props.onResize, t, !1, void 0);
327
- return;
328
- }
329
- if (t.altKey) {
330
- switch (t.keyCode) {
331
- case p.up:
332
- this.windowStage === a.MINIMIZED ? (this.handleRestore(t), m(this.props.onStageChange, t, this, { state: a.DEFAULT })) : this.windowStage === a.DEFAULT && (this.handleFullscreen(t), m(this.props.onStageChange, t, this, { state: a.FULLSCREEN }));
333
- break;
334
- case p.down:
335
- this.windowStage === a.FULLSCREEN ? (this.handleRestore(t), m(this.props.onStageChange, t, this, { state: a.DEFAULT })) : this.windowStage === a.DEFAULT && (this.handleMinimize(t), m(this.props.onStageChange, t, this, { state: a.MINIMIZED }));
336
- break;
337
- }
338
- return;
339
- }
340
- if (!t.ctrlKey)
341
- switch (t.keyCode) {
342
- case p.esc:
343
- this.props.onClose && this.handleCloseWindow(t);
344
- return;
345
- case p.up:
346
- this.setState({ top: this.state.top - w });
347
- break;
348
- case p.down:
349
- this.setState({ top: this.state.top + w });
350
- break;
351
- case p.left:
352
- this.setState({ left: this.state.left - w });
353
- break;
354
- case p.right:
355
- this.setState({ left: this.state.left + w });
356
- break;
357
- default:
358
- return;
359
- }
360
- this.dispatchMoveEvent(this.props.onMove, t, !1, void 0);
361
- }, this.onPress = (t) => {
362
- const e = t.event;
363
- this.windowCoordinatesState.differenceLeft = e.pageX - this.left, this.windowCoordinatesState.differenceTop = e.pageY - this.top;
364
- }, this.onDrag = (t) => {
365
- const e = t.event;
366
- e.originalEvent.preventDefault(), this.windowStage !== a.FULLSCREEN && this.props.draggable && (this.setState({
367
- top: Math.max(e.pageY - this.windowCoordinatesState.differenceTop, 0),
368
- left: e.pageX - this.windowCoordinatesState.differenceLeft,
369
- isDragging: !0
370
- }), this.props.onMove && this.dispatchMoveEvent(this.props.onMove, e, !0, !1));
371
- }, this.onRelease = (t) => {
372
- const e = t.event;
373
- this.windowStage !== a.FULLSCREEN && this.props.draggable && this.props.onMove && this.dispatchMoveEvent(this.props.onMove, e, !0, !0), this.setState({
374
- isDragging: !1
375
- });
376
- }, this.onFocus = () => {
377
- this._blurTimeout ? (clearTimeout(this._blurTimeout), this._blurTimeout = void 0) : this.setState({
378
- focused: !0,
379
- zIndex: z(this.getCurrentZIndex(), this.getDocument(), this._id)
380
- });
381
- }, this.onBlur = () => {
382
- clearTimeout(this._blurTimeout);
383
- const t = this.getWindow();
384
- t && (this._blurTimeout = t.setTimeout(() => {
385
- this.mounted && this.setState({ focused: !1 }), this._blurTimeout = void 0;
386
- }));
387
- }, this.getInitialTop = () => {
388
- if (this.props.top !== void 0)
389
- return this.props.top;
390
- if (this.props.initialTop !== void 0)
391
- return this.props.initialTop;
392
- let t = B;
393
- if (this.props.height !== void 0 ? t = this.props.height : this.props.initialHeight !== void 0 && (t = this.props.initialHeight), this.props.appendTo)
394
- return this.props.appendTo.offsetHeight / 2 - t / 2;
395
- const e = this.getWindow();
396
- return e ? e.innerHeight / 2 - t / 2 : 0;
397
- }, this.getInitialLeft = () => {
398
- if (this.props.left !== void 0)
399
- return this.props.left;
400
- if (this.props.initialLeft !== void 0)
401
- return this.props.initialLeft;
402
- let t = W;
403
- if (this.props.width !== void 0 ? t = this.props.width : this.props.initialWidth !== void 0 && (t = this.props.initialWidth), this.props.appendTo)
404
- return this.props.appendTo.offsetWidth / 2 - t / 2;
405
- const e = this.getWindow();
406
- return e ? e.innerWidth / 2 - t / 2 : 0;
407
- }, this.getInitialWidth = () => {
408
- let t = W;
409
- return this.props.width !== void 0 ? t = this.props.width : this.props.initialWidth !== void 0 && (t = this.props.initialWidth), t;
410
- }, this.getInitialHeight = () => {
411
- let t = B;
412
- return this.props.height !== void 0 ? t = this.props.height : this.props.initialHeight !== void 0 && (t = this.props.initialHeight), t;
413
- }, this.handleMinimize = (t) => {
414
- t.preventDefault(), this.windowCoordinatesState.leftBeforeAction = this.left, this.windowCoordinatesState.topBeforeAction = this.top, this.windowCoordinatesState.widthBeforeAction = this.width, this.windowCoordinatesState.heightBeforeAction = this.height, this.setState({
415
- stage: a.MINIMIZED,
416
- height: 0
417
- }), m(this.props.onStageChange, t, this, { state: a.MINIMIZED });
418
- }, this.handleFullscreen = (t) => {
419
- t.preventDefault(), this.windowCoordinatesState.leftBeforeAction = this.left, this.windowCoordinatesState.topBeforeAction = this.top, this.windowCoordinatesState.widthBeforeAction = this.width, this.windowCoordinatesState.heightBeforeAction = this.height;
420
- const e = this.getWindow(), n = e ? e.innerWidth : 0, l = e ? e.innerHeight : 0;
421
- this.setState({
422
- left: 0,
423
- top: 0,
424
- width: this.props.appendTo ? this.props.appendTo.offsetWidth : n,
425
- height: this.props.appendTo ? this.props.appendTo.offsetHeight : l,
426
- stage: a.FULLSCREEN
427
- }), m(this.props.onStageChange, t, this, { state: a.FULLSCREEN });
428
- }, this.handleRestore = (t) => {
429
- t.preventDefault(), this.windowStage === a.FULLSCREEN ? this.setState({
430
- stage: a.DEFAULT,
431
- left: this.windowCoordinatesState.leftBeforeAction,
432
- top: this.windowCoordinatesState.topBeforeAction,
433
- width: this.windowCoordinatesState.widthBeforeAction,
434
- height: this.windowCoordinatesState.heightBeforeAction
435
- }) : this.windowStage === a.MINIMIZED && this.setState({
436
- stage: a.DEFAULT,
437
- height: this.windowCoordinatesState.heightBeforeAction
438
- }), m(this.props.onStageChange, t, this, { state: a.DEFAULT });
439
- }, this.handleCloseWindow = (t) => {
440
- t.preventDefault(), m(this.props.onClose, t, this, { state: void 0 });
441
- }, this.handleDoubleClick = (t) => {
442
- this.windowStage === a.FULLSCREEN || this.windowStage === a.MINIMIZED ? this.handleRestore(t) : this.handleFullscreen(t);
443
- }, this.handleResize = (t, e) => {
444
- const n = this.props.appendTo ? t.pageX - this.offSetCoordinates.x : t.pageX, l = this.props.appendTo ? t.pageY - this.offSetCoordinates.y : t.pageY, d = this.width, h = this.height, g = this.props.minWidth || H, c = this.props.minHeight || _, f = this.top - l, C = this.left - n;
445
- let E = n - this.left, I = l - this.top;
446
- const u = Object.assign({}, this.state, { isDragging: !e.end });
447
- e.direction.indexOf("n") >= 0 && c - (h + f) < 0 && (this.top > 0 && (u.height = h + f), u.top = l), e.direction.indexOf("s") >= 0 && c - I < 0 && (u.height = I), e.direction.indexOf("w") >= 0 && g - (d + C) < 0 && (this.left > 0 && (u.width = d + C), u.left = n), e.direction.indexOf("e") >= 0 && g - E < 0 && (u.width = E), this.setState(u), this.dispatchMoveEvent(this.props.onResize, t, !0, e.end);
448
- }, this.dispatchMoveEvent = (t, e, n, l) => {
449
- t && t.call(void 0, {
450
- nativeEvent: e.nativeEvent ? e.nativeEvent : e.originalEvent,
451
- drag: n,
452
- end: l,
453
- target: this,
454
- left: this.state.left,
455
- top: this.state.top,
456
- width: this.state.width,
457
- hight: this.state.height,
458
- height: this.state.height
459
- });
460
- }, this.handleBrowserWindowResize = () => {
461
- if (this.windowStage === a.FULLSCREEN) {
462
- const t = this.getWindow(), e = t ? t.innerWidth : 0, n = t ? t.innerHeight : 0;
463
- this.setState({
464
- width: this.props.appendTo ? this.props.appendTo.offsetWidth : e,
465
- height: this.props.appendTo ? this.props.appendTo.offsetHeight : n
466
- });
467
- }
468
- }, this.getCurrentZIndex = () => !this.state || this.context === void 0 ? this.context ? this.context : N : this.state.zIndex > (this.context ? this.context + S : 0) ? this.state.zIndex : this.context + S, this.getDocument = () => this.props.appendTo ? this.props.appendTo.ownerDocument : document, this.getWindow = () => {
469
- const t = this.getDocument();
470
- return t && t.defaultView;
471
- }, Y(y), this.showLicenseWatermark = $(y), this.state = {
472
- stage: this.props.stage || a.DEFAULT,
473
- isDragging: !1,
474
- top: 0,
475
- left: 0,
476
- width: W,
477
- height: B,
478
- focused: !0,
479
- zIndex: N
480
- };
481
- }
482
- get _id() {
483
- return this.props.id + "-accessibility-id";
484
- }
485
- /**
486
- * @hidden
487
- */
488
- componentDidMount() {
489
- const i = this.getWindow();
490
- i && i.addEventListener("resize", this.handleBrowserWindowResize), this.setState({
491
- stage: this.props.stage || a.DEFAULT,
492
- isDragging: !1,
493
- top: this.getInitialTop(),
494
- left: this.getInitialLeft(),
495
- width: this.getInitialWidth(),
496
- height: this.getInitialHeight(),
497
- focused: !0,
498
- zIndex: z(this.getCurrentZIndex(), this.getDocument(), this._id)
499
- }), this.windowCoordinatesState = {
500
- leftBeforeAction: this.getInitialLeft(),
501
- topBeforeAction: this.getInitialTop(),
502
- widthBeforeAction: this.getInitialWidth(),
503
- heightBeforeAction: this.getInitialHeight()
504
- };
505
- const t = this.getDocument();
506
- if (this.props.appendTo && t) {
507
- let e = this.props.appendTo.getBoundingClientRect(), n = t.body.getBoundingClientRect();
508
- this.offSetCoordinates.x = e.left - n.left, this.offSetCoordinates.y = e.top - n.top;
509
- }
510
- this.mounted = !0;
511
- }
512
- /**
513
- * @hidden
514
- */
515
- componentWillUnmount() {
516
- const i = this.getWindow();
517
- i && i.removeEventListener("resize", this.handleBrowserWindowResize), this.mounted = !1;
518
- }
519
- /**
520
- * @hidden
521
- */
522
- componentDidUpdate() {
523
- const i = this.getDocument();
524
- if (this.props.appendTo && i) {
525
- let t = this.props.appendTo.getBoundingClientRect(), e = i.body.getBoundingClientRect();
526
- this.offSetCoordinates.x = t.left - e.left, this.offSetCoordinates.y = t.top - e.top;
527
- }
528
- this.mounted = !0;
529
- }
530
- /**
531
- * @hidden
532
- */
533
- render() {
534
- const i = s.Children.toArray(this.props.children), t = this.getContent(i), e = this.getActionBar(i), n = this.getCurrentZIndex(), l = x(
535
- "k-window",
536
- this.props.className,
537
- {
538
- [`k-window-${this.props.themeColor}`]: this.props.themeColor,
539
- "k-window-minimized": this.state.stage === "MINIMIZED",
540
- "k-window-focused": this.state.focused
541
- }
542
- ), d = /* @__PURE__ */ s.createElement(L.Provider, { value: n }, /* @__PURE__ */ s.createElement(s.Fragment, null, this.props.modal && /* @__PURE__ */ s.createElement(
543
- "div",
544
- {
545
- className: "k-overlay",
546
- style: {
547
- zIndex: n,
548
- ...this.props.overlayStyle
549
- }
550
- }
551
- ), /* @__PURE__ */ s.createElement(
552
- "div",
553
- {
554
- id: this.props.id,
555
- [O]: this._id,
556
- tabIndex: 0,
557
- role: "dialog",
558
- "aria-labelledby": this.titleId,
559
- onFocus: this.onFocus,
560
- onBlur: this.onBlur,
561
- onKeyDown: this.onKeyDown,
562
- ref: (h) => {
563
- this.windowElement = h, this.element = h;
564
- },
565
- className: l,
566
- style: {
567
- top: this.top,
568
- left: this.left,
569
- width: this.width,
570
- height: this.height || "",
571
- zIndex: n,
572
- ...this.props.style
573
- }
574
- },
575
- /* @__PURE__ */ s.createElement(
576
- ut,
577
- {
578
- shouldUpdateOnDrag: this.props.shouldUpdateOnDrag || !1,
579
- isDragging: this.state.isDragging
580
- },
581
- /* @__PURE__ */ s.createElement(
582
- Q,
583
- {
584
- onPress: this.onPress,
585
- onDrag: this.onDrag,
586
- onRelease: this.onRelease,
587
- ref: (h) => this.draggable = h
588
- },
589
- /* @__PURE__ */ s.createElement(
590
- ct,
591
- {
592
- stage: this.windowStage,
593
- onDoubleClick: this.props.doubleClickStageChange ? this.handleDoubleClick : void 0,
594
- onMinimizeButtonClick: this.handleMinimize,
595
- onFullScreenButtonClick: this.handleFullscreen,
596
- onRestoreButtonClick: this.handleRestore,
597
- onCloseButtonClick: this.handleCloseWindow,
598
- closeButton: this.props.closeButton,
599
- minimizeButton: this.props.minimizeButton,
600
- maximizeButton: this.props.maximizeButton,
601
- restoreButton: this.props.restoreButton,
602
- id: this.titleId
603
- },
604
- this.props.title
605
- )
606
- ),
607
- this.windowStage !== a.MINIMIZED ? /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement("div", { className: "k-window-content" }, t), e) : null,
608
- this.windowStage === a.DEFAULT && this.props.resizable ? /* @__PURE__ */ s.createElement(gt, { onResize: this.handleResize }) : null
609
- ),
610
- this.showLicenseWatermark && /* @__PURE__ */ s.createElement(q, null)
611
- )));
612
- return J ? this.props.appendTo !== null ? K.createPortal(d, this.props.appendTo || document.body) : d : null;
613
- }
614
- // Getters
615
- get top() {
616
- return this.windowStage !== a.FULLSCREEN ? Math.max(this.props.top || this.state.top, 0) : 0;
617
- }
618
- get left() {
619
- return this.windowStage !== a.FULLSCREEN ? Math.max(this.props.left || this.state.left, 0) : 0;
620
- }
621
- get width() {
622
- let i = this.props.width || this.state.width;
623
- if (this.windowStage === a.FULLSCREEN) {
624
- if (this.props.appendTo)
625
- return i = this.props.appendTo.offsetWidth, i;
626
- const t = this.getWindow();
627
- i = t ? t.innerWidth : 0;
628
- }
629
- return i;
630
- }
631
- get height() {
632
- let i = this.props.height || this.state.height;
633
- if (this.windowStage === a.FULLSCREEN) {
634
- if (this.props.appendTo)
635
- return i = this.props.appendTo.offsetHeight, i;
636
- const t = this.getWindow();
637
- i = t ? t.innerHeight : 0;
638
- } else
639
- this.windowStage === a.MINIMIZED && (i = 0);
640
- return i;
641
- }
642
- get windowStage() {
643
- return this.props.stage || this.state.stage;
644
- }
645
- getActionBar(i) {
646
- return i.filter((t) => t && t.type === U);
647
- }
648
- getContent(i) {
649
- return i.filter((t) => t && t.type !== U);
650
- }
651
- generateTitleId() {
652
- return "window-title-" + this._id;
653
- }
654
- }
655
- k.displayName = "Window";
656
- k.propTypes = {
657
- width: o.number,
658
- height: o.number,
659
- left: o.number,
660
- top: o.number,
661
- initialWidth: o.number,
662
- initialHeight: o.number,
663
- initialLeft: o.number,
664
- initialTop: o.number,
665
- minWidth: o.number,
666
- minHeight: o.number,
667
- resizable: o.bool,
668
- draggable: o.bool,
669
- title: o.any,
670
- shouldUpdateOnDrag: o.bool,
671
- stage: o.oneOf(["DEFAULT", "MINIMIZED", "FULLSCREEN"]),
672
- className: o.string,
673
- id: o.string,
674
- style: o.object,
675
- overlayStyle: o.object
676
- };
677
- k.defaultProps = {
678
- minWidth: H,
679
- minHeight: _,
680
- resizable: !0,
681
- draggable: !0,
682
- modal: !1,
683
- doubleClickStageChange: !0
684
- };
685
- k.contextType = L;
686
- const ft = G(), wt = X(V(ft, k));
687
- wt.displayName = "KendoReactWindow";
9
+ import { Dialog as t, DialogPropsContext as i } from "./Dialog.mjs";
10
+ import { DialogActionsBar as n } from "./DialogActionsBar.mjs";
11
+ import { Window as x, WindowPropsContext as a } from "./Window.mjs";
12
+ import { WindowActionsBar as f } from "./WindowActionsBar.mjs";
688
13
  export {
689
- lt as Dialog,
690
- v as DialogActionsBar,
691
- ht as DialogPropsContext,
692
- wt as Window,
693
- U as WindowActionsBar,
694
- ft as WindowPropsContext
14
+ t as Dialog,
15
+ n as DialogActionsBar,
16
+ i as DialogPropsContext,
17
+ x as Window,
18
+ f as WindowActionsBar,
19
+ a as WindowPropsContext
695
20
  };