Radzen.Blazor.js

js cbcorporate.ca collected 2026-09-27 06:18:45 UTC 94,021 bytes, 2,580 lines download raw bytes

1if (!Element.prototype.matches) {
2  Element.prototype.matches =
3    Element.prototype.msMatchesSelector ||
4    Element.prototype.webkitMatchesSelector;
5}
6
7if (!Element.prototype.closest) {
8  Element.prototype.closest = function (s) {
9    var el = this;
10
11    do {
12      if (el.matches(s)) return el;
13      el = el.parentElement || el.parentNode;
14    } while (el !== null && el.nodeType === 1);
15    return null;
16  };
17}
18
19var resolveCallbacks = [];
20var rejectCallbacks = [];
21var radzenRecognition;
22
23window.Radzen = {
24    isRTL: function (el) {
25        return el && getComputedStyle(el).direction == 'rtl';
26    },
27    throttle: function (callback, delay) {
28        var timeout = null;
29        return function () {
30            var args = arguments;
31            var ctx = this;
32            if (!timeout) {
33                timeout = setTimeout(function () {
34                    callback.apply(ctx, args);
35                    timeout = null;
36                }, delay);
37            }
38        };
39    },
40    mask: function (id, mask, pattern, characterPattern) {
41      var el = document.getElementById(id);
42      if (el) {
43          var format = function (value, mask, pattern, characterPattern) {
44              var chars = !characterPattern ? value.replace(new RegExp(pattern, "g"), "").split('') : value.match(new RegExp(characterPattern, "g"));
45              var count = 0;
46
47              var formatted = '';
48              for (var i = 0; i < mask.length; i++) {
49                  const c = mask[i];
50                  if (chars && chars[count]) {
51                      if (c === '*' || c == chars[count]) {
52                          formatted += chars[count];
53                          count++;
54                      } else {
55                          formatted += c;
56                      }
57                  }
58              }
59              return formatted;
60          }
61
62          if (window.safari !== undefined) {
63              el.onblur = function (e) {
64                  el.dispatchEvent(new Event('change'));
65              };
66          }
67
68          var start = el.selectionStart != el.value.length ? el.selectionStart : -1;
69          var end = el.selectionEnd != el.value.length ? el.selectionEnd : -1;
70
71          el.value = format(el.value, mask, pattern, characterPattern);
72
73          el.selectionStart = start != -1 ? start : el.selectionStart;
74          el.selectionEnd = end != -1 ? end : el.selectionEnd;
75      }
76  },
77  addContextMenu: function (id, ref) {
78     var el = document.getElementById(id);
79     if (el) {
80        var handler = function (e) {
81            e.stopPropagation();
82            e.preventDefault();
83            ref.invokeMethodAsync('RadzenComponent.RaiseContextMenu',
84                {
85                    ClientX: e.clientX,
86                    ClientY: e.clientY,
87                    ScreenX: e.screenX,
88                    ScreenY: e.screenY,
89                    AltKey: e.altKey,
90                    ShiftKey: e.shiftKey,
91                    CtrlKey: e.ctrlKey,
92                    MetaKey: e.metaKey,
93                    Button: e.button,
94                    Buttons: e.buttons,
95                });
96            return false;
97        };
98        Radzen[id + 'contextmenu'] = handler;
99        el.addEventListener('contextmenu', handler, false);
100     }
101  },
102  addMouseEnter: function (id, ref) {
103     var el = document.getElementById(id);
104     if (el) {
105        var handler = function (e) {
106            ref.invokeMethodAsync('RadzenComponent.RaiseMouseEnter');
107        };
108        Radzen[id + 'mouseenter'] = handler;
109        el.addEventListener('mouseenter', handler, false);
110     }
111  },
112  addMouseLeave: function (id, ref) {
113     var el = document.getElementById(id);
114     if (el) {
115        var handler = function (e) {
116            ref.invokeMethodAsync('RadzenComponent.RaiseMouseLeave');;
117        };
118        Radzen[id + 'mouseleave'] = handler;
119        el.addEventListener('mouseleave', handler, false);
120     }
121  },
122  removeContextMenu: function (id) {
123      var el = document.getElementById(id);
124      if (el && Radzen[id + 'contextmenu']) {
125          el.removeEventListener('contextmenu', Radzen[id + 'contextmenu']);
126      }
127  },
128  removeMouseEnter: function (id) {
129      var el = document.getElementById(id);
130      if (el && Radzen[id + 'mouseenter']) {
131          el.removeEventListener('mouseenter', Radzen[id + 'mouseenter']);
132      }
133  },
134  removeMouseLeave: function (id) {
135      var el = document.getElementById(id);
136      if (el && Radzen[id + 'mouseleave']) {
137          el.removeEventListener('mouseleave', Radzen[id + 'mouseleave']);
138      }
139  },
140  adjustDataGridHeader: function (scrollableHeader, scrollableBody) {
141    if (scrollableHeader && scrollableBody) {
142      scrollableHeader.style.cssText =
143        scrollableBody.clientHeight < scrollableBody.scrollHeight
144          ? 'margin-left:0px;padding-right: ' +
145            (scrollableBody.offsetWidth - scrollableBody.clientWidth) +
146            'px'
147          : 'margin-left:0px;';
148    }
149  },
150  preventDefaultAndStopPropagation: function (e) {
151    e.preventDefault();
152    e.stopPropagation();
153  },
154  preventArrows: function (el) {
155    var preventDefault = function (e) {
156      if (e.keyCode === 38 || e.keyCode === 40) {
157        e.preventDefault();
158        return false;
159      }
160    };
161    if (el) {
162       el.addEventListener('keydown', preventDefault, false);
163    }
164  },
165  selectTab: function (id, index) {
166    var el = document.getElementById(id);
167    if (el && el.parentNode && el.parentNode.previousElementSibling) {
168        var count = el.parentNode.children.length;
169        for (var i = 0; i < count; i++) {
170            var content = el.parentNode.children[i];
171            if (content) {
172                content.style.display = i == index ? '' : 'none';
173            }
174            var header = el.parentNode.previousElementSibling.children[i];
175            if (header) {
176                if (i == index) {
177                    header.classList.add('rz-tabview-selected');
178                    header.classList.add('rz-state-focused');
179                }
180                else {
181                    header.classList.remove('rz-tabview-selected');
182                    header.classList.remove('rz-state-focused');
183                }
184            }
185        }
186    }
187  },
188  loadGoogleMaps: function (defaultView, apiKey, resolve, reject, language) {
189    resolveCallbacks.push(resolve);
190    rejectCallbacks.push(reject);
191
192    if (defaultView['rz_map_init']) {
193      return;
194    }
195
196    defaultView['rz_map_init'] = function () {
197      for (var i = 0;

197 i < resolveCallbacks.length; i++) {
198        resolveCallbacks[i](defaultView.google);
199      }
200    };
201
202    var document = defaultView.document;
203    var script = document.createElement('script');
204
205    script.src =
206      'https://maps.googleapis.com/maps/api/js?' +
207      (language ? 'language=' + language + '&' : '') +
208      (apiKey ? 'key=' + apiKey + '&' : '') +
209      'callback=rz_map_init&libraries=marker';
210
211    script.async = true;
212    script.defer = true;
213    script.onerror = function (err) {
214      for (var i = 0; i < rejectCallbacks.length; i++) {
215        rejectCallbacks[i](err);
216      }
217    };
218
219    document.body.appendChild(script);
220  },
221  createMap: function (wrapper, ref, id, apiKey, mapId, zoom, center, markers, options, fitBoundsToMarkersOnUpdate, language) {
222    var api = function () {
223      var defaultView = document.defaultView;
224
225      return new Promise(function (resolve, reject) {
226        if (defaultView.google && defaultView.google.maps) {
227          return resolve(defaultView.google);
228        }
229
230        Radzen.loadGoogleMaps(defaultView, apiKey, resolve, reject, language);
231      });
232    };
233
234    api().then(function (google) {
235      Radzen[id] = ref;
236      Radzen[id].google = google;
237
238      Radzen[id].instance = new google.maps.Map(wrapper, {
239        center: center,
240        zoom: zoom,
241        mapId: mapId
242      });
243
244      Radzen[id].instance.addListener('click', function (e) {
245        Radzen[id].invokeMethodAsync('RadzenGoogleMap.OnMapClick', {
246          Position: {Lat: e.latLng.lat(), Lng: e.latLng.lng()}
247        });
248      });
249
250      Radzen.updateMap(id, apiKey, zoom, center, markers, options, fitBoundsToMarkersOnUpdate, language);
251    });
252  },
253  updateMap: function (id, apiKey, zoom, center, markers, options, fitBoundsToMarkersOnUpdate, language) {
254    var api = function () {
255        var defaultView = document.defaultView;
256
257        return new Promise(function (resolve, reject) {
258            if (defaultView.google && defaultView.google.maps) {
259                return resolve(defaultView.google);
260            }
261
262            Radzen.loadGoogleMaps(defaultView, apiKey, resolve, reject, language);
263        });
264    };
265    api().then(function (google) {
266        let markerBounds = new google.maps.LatLngBounds();
267
268        if (Radzen[id] && Radzen[id].instance) {
269            if (Radzen[id].instance.markers && Radzen[id].instance.markers.length) {
270                for (var i = 0; i < Radzen[id].instance.markers.length; i++) {
271                    Radzen[id].instance.markers[i].setMap(null);
272                }
273            }
274
275            if (markers) {
276                Radzen[id].instance.markers = [];
277
278                markers.forEach(function (m) {
279                    var content;
280
281                    if (m.label) {
282                        content = document.createElement('span');
283                        content.innerHTML = m.label;
284                    }
285
286                    var marker = new this.google.maps.marker.AdvancedMarkerElement({
287                        position: m.position,
288                        title: m.title,
289                        content: content
290                    });
291
292                    marker.addListener('click', function (e) {
293                        Radzen[id].invokeMethodAsync('RadzenGoogleMap.OnMarkerClick', {
294                            Title: marker.title,
295                            Label: marker.content.innerText,
296                            Position: marker.position
297                        });
298                    });
299
300                    marker.setMap(Radzen[id].instance);
301
302                    Radzen[id].instance.markers.push(marker);
303
304                        markerBounds.extend(marker.position);
305                });
306            }
307
308            if (zoom) {
309                Radzen[id].instance.setZoom(zoom);
310                }
311
312            if (center) {
313                Radzen[id].instance.setCenter(center);
314            }
315
316            if (options) {
317                Radzen[id].instance.setOptions(options);
318            }
319
320            if (markers && fitBoundsToMarkersOnUpdate) {
321                Radzen[id].instance.fitBounds(markerBounds);
322            }
323        }
324    });

325  },
326  destroyMap: function (id) {
327    if (Radzen[id].instance) {
328      delete Radzen[id].instance;
329    }
330  },
331 focusSecurityCode: function (el) {
332    if (!el) return;
333    var firstInput = el.querySelector('.rz-security-code-input');
334    if (firstInput) {
335        setTimeout(function () { firstInput.focus() }, 500);
336    }
337 },
338  destroySecurityCode: function (id, el) {
339    if (!Radzen[id]) return;
340
341    var inputs = el.getElementsByTagName('input');
342
343    if (Radzen[id].keyPress && Radzen[id].paste) {
344        for (var i = 0; i < inputs.length; i++) {
345            inputs[i].removeEventListener('keypress', Radzen[id].keyPress);
346            inputs[i].removeEventListener('keydown', Radzen[id].keyDown);
347            inputs[i].removeEventListener('paste', Radzen[id].paste);
348        }
349        delete Radzen[id].keyPress;
350        delete Radzen[id].paste;
351    }
352
353    Radzen[id] = null;
354  },
355  createSecurityCode: function (id, ref, el, isNumber) {
356      if (!el || !ref) return;
357
358      var hidden = el.querySelector('input[type="hidden"]');
359
360      Radzen[id] = {};
361
362      Radzen[id].inputs = [...el.querySelectorAll('.rz-security-code-input')];
363
364      Radzen[id].paste = function (e) {
365          if (e.clipboardData) {
366              var value = e.clipboardData.getData('text');
367
368              if (value) {
369                  for (var i = 0; i < value.length; i++) {
370                      if (isNumber && isNaN(+value[i])) {
371                          continue;
372                      }
373                      Radzen[id].inputs[i].value = value[i];
374                  }
375
376                  var code = Radzen[id].inputs.map(i => i.value).join('').trim();
377                  hidden.value = code;
378
379                  ref.invokeMethodAsync('RadzenSecurityCode.OnValueChange', code);
380
381                  Radzen[id].inputs[Radzen[id].inputs.length - 1].focus();
382              }
383
384              e.preventDefault();
385          }
386      }
387      Radzen[id].keyPress = function (e) {
388          var keyCode = e.data ? e.data.charCodeAt(0) : e.which;
389          var ch = e.data || String.fromCharCode(e.which);
390
391          if (e.metaKey ||
392              e.ctrlKey ||
393              keyCode == 9 ||
394              keyCode == 8 ||
395              keyCode == 13
396          ) {
397              return;
398          }
399
400          if (isNumber && (keyCode < 48 || keyCode > 57)) {
401              e.preventDefault();
402              return;
403          }
404
405          if (e.currentTarget.value == ch) {
406              return;
407          }
408
409          e.currentTarget.value = ch;
410
411          var value = Radzen[id].inputs.map(i => i.value).join('').trim();
412          hidden.value = value;
413
414          ref.invokeMethodAsync('RadzenSecurityCode.OnValueChange', value);
415
416          var index = Radzen[id].inputs.indexOf(e.currentTarget);
417          if (index < Radzen[id].inputs.length - 1) {
418              Radzen[id].inputs[index + 1].focus();
419          }
420      }
421
422      Radzen[id].keyDown = function (e) {
423          var keyCode = e.data ? e.data.charCodeAt(0) : e.which;
424          if (keyCode == 8) {
425              e.currentTarget.value = '';
426
427              var value = Radzen[id].inputs.map(i => i.value).join('').trim();
428              hidden.value = value;
429
430              ref.invokeMethodAsync('RadzenSecurityCode.OnValueChange', value);
431
432              var index = Radzen[id].inputs.indexOf(e.currentTarget);
433              if (index > 0) {
434                  Radzen[id].inputs[index - 1].focus();
435              }
436          }
437      }
438
439      for (var i = 0; i < Radzen[id].inputs.length; i++) {
440          Radzen[id].inputs[i].addEventListener(navigator.userAgent.match(/Android/i) ? 'textInput' : 'keypress', Radzen[id].keyPress);
441          Radzen[id].inputs[i].addEventListener(navigator.userAgent.match(/Android/i) ? 'textInput' : 'keydown', Radzen[id].keyDown);
442          Radzen[id].inputs[i].addEventListener('paste', Radzen[id].paste);
443      }
444  },
445  createSlider: function (
446    id,
447    slider,
448    parent,
449    range,
450    minHandle,
451    maxHandle,
452    min,
453    max,
454    value,
455    step,
456    isVertical
457  ) {
458    Radzen[id] = {};
459    Radzen[id].mouseMoveHandler = function (e) {
460      e.preventDefault();
461
462      var handle = slider.isMin ? minHandle : maxHandle;
463
464      if (!slider.canChange) return;
465
466      var offsetX =
467        e.targetTouches && e.targetTouches[0]
468          ? e.targetTouches[0].pageX - e.target.getBoundingClientRect().left
469                : e.pageX - handle.getBoundingClientRect().left;
470
471      var offsetY =
472        e.targetTouches && e.targetTouches[0]
473          ? e.targetTouches[0].pageY - e.target.getBoundingClientRect().top
474              : e.pageY - handle.getBoundingClientRect().top;
475
476      var percent = isVertical ? (parent.offsetHeight - handle.offsetTop - offsetY) / parent.offsetHeight
477        : (Radzen.isRTL(handle) ? parent.offsetWidth - handle.offsetLeft - offsetX : handle.offsetLeft + offsetX) / parent.offsetWidth;
478
479      if (percent > 1) {
480        percent = 1;
481      } else if (percent < 0) {
482        percent = 0;
483      }
484
485     var newValue = percent * (max - min) + min;
486
487      if (
488        slider.canChange &&
489        newValue >= min &&
490        newValue <= max
491      ) {
492        slider.invokeMethodAsync(
493          'RadzenSlider.OnValueChange',
494          newValue,
495          !!slider.isMin
496        );
497      }
498    };
499
500    Radzen[id].mouseDownHandler = function (e) {
501      if (parent.classList.contains('rz-state-disabled')) return;
502
503      document.addEventListener('mousemove', Radzen[id].mouseMoveHandler);
504      document.addEventListener('touchmove', Radzen[id].mouseMoveHandler, {
505        passive: false, capture: true
506      });
507
508      document.addEventListener('mouseup', Radzen[id].mouseUpHandler);
509      document.addEventListener('touchend', Radzen[id].mouseUpHandler, {
510        passive: true
511      });
512
513      if (minHandle == e.target || maxHandle == e.target) {
514        slider.canChange = true;
515        slider.isMin = minHandle == e.target;
516      } else {
517
518        var offsetX =
519          e.targetTouches && e.targetTouches[0]
520            ? e.targetTouches[0].pageX - e.target.getBoundingClientRect().left
521                  : e.offsetX;
522
523        var percent = offsetX / parent.offsetWidth;
524
525        var newValue = percent * (max - min) + min;
526        var oldValue = range ? value[slider.isMin ? 0 : 1] : value;
527        if (newValue >= min && newValue <= max && newValue != oldValue) {
528          slider.invokeMethodAsync(
529            'RadzenSlider.OnValueChange',
530            newValue,
531            !!slider.isMin
532          );
533        }
534      }
535    };
536
537    Radzen[id].mouseUpHandler = function (e) {
538      slider.canChange = false;
539      document.removeEventListener('mousemove', Radzen[id].mouseMoveHandler);
540      document.removeEventListener('touchmove', Radzen[id].mouseMoveHandler, {
541        passive: false, capture: true
542      });
543      document.removeEventListener('mouseup', Radzen[id].mouseUpHandler);
544      document.removeEventListener('touchend', Radzen[id].mouseUpHandler, {
545        passive: true
546      });
547    };
548
549    parent.addEventListener('mousedown', Radzen[id].mouseDownHandler);
550    parent.addEventListener('touchstart', Radzen[id].mouseDownHandler, {
551      passive: true
552    });

553  },
554  destroySlider: function (id, parent) {
555    if (!Radzen[id]) return;
556
557    if (Radzen[id].mouseMoveHandler) {
558      document.removeEventListener('mousemove', Radzen[id].mouseMoveHandler);
559      document.removeEventListener('touchmove', Radzen[id].mouseMoveHandler);
560      delete Radzen[id].mouseMoveHandler;
561    }
562    if (Radzen[id].mouseUpHandler) {
563      document.removeEventListener('mouseup', Radzen[id].mouseUpHandler);
564      document.removeEventListener('touchend', Radzen[id].mouseUpHandler);
565      delete Radzen[id].mouseUpHandler;
566    }
567    if (Radzen[id].mouseDownHandler) {
568      parent.removeEventListener('mousedown', Radzen[id].mouseDownHandler);
569      parent.removeEventListener('touchstart', Radzen[id].mouseDownHandler);
570      delete Radzen[id].mouseDownHandler;
571    }
572
573    Radzen[id] = null;
574  },
575  prepareDrag: function (el) {
576    if (el) {
577        el.ondragover = function (e) { e.preventDefault(); };
578        el.ondragstart = function (e) { e.dataTransfer.setData('', e.target.id); };
579    }
580  },
581  focusElement: function (elementId) {
582    var el = document.getElementById(elementId);
583    if (el) {
584      el.focus();
585    }
586  },
587  scrollCarouselItem: function (el) {
588    el.parentElement.scroll(el.offsetLeft, 0);
589  },
590  scrollIntoViewIfNeeded: function (ref, selector) {
591    var el = selector ? ref.getElementsByClassName(selector)[0] : ref;
592    if (el && el.scrollIntoViewIfNeeded) {
593        el.scrollIntoViewIfNeeded();
594    } else if (el && el.scrollIntoView) {
595        el.scrollIntoView();
596    }
597  },
598  selectListItem: function (input, ul, index) {
599    if (!input || !ul) return;
600
601    var childNodes = ul.getElementsByTagName('LI');
602
603    var highlighted = ul.querySelectorAll('.rz-state-highlight');
604    if (highlighted.length) {
605      for (var i = 0; i < highlighted.length; i++) {
606        highlighted[i].classList.remove('rz-state-highlight');
607      }
608    }
609
610    ul.nextSelectedIndex = index;
611
612    if (
613      ul.nextSelectedIndex >= 0 &&
614      ul.nextSelectedIndex <= childNodes.length - 1
615    ) {
616      childNodes[ul.nextSelectedIndex].classList.add('rz-state-highlight');
617      childNodes[ul.nextSelectedIndex].scrollIntoView({block:'nearest'});
618    }
619  },
620  focusListItem: function (input, ul, isDown, startIndex) {
621    if (!input || !ul) return;
622    var childNodes = ul.getElementsByTagName('LI');
623
624    if (!childNodes || childNodes.length == 0) return;
625
626    if (startIndex == undefined || startIndex == null) {
627      startIndex = -1;
628    }
629
630    ul.nextSelectedIndex = startIndex;
631    if (isDown) {
632        while (ul.nextSelectedIndex < childNodes.length - 1) {
633            ul.nextSelectedIndex++;
634            if (!childNodes[ul.nextSelectedIndex].classList.contains('rz-state-disabled'))
635                break;
636        }
637    } else {
638        while (ul.nextSelectedIndex >= 0) {
639            ul.nextSelectedIndex--;
640            if (!childNodes[ul.nextSelectedIndex] || !childNodes[ul.nextSelectedIndex].classList.contains('rz-state-disabled'))
641                break;
642        }
643    }
644
645    var highlighted = ul.querySelectorAll('.rz-state-highlight');
646    if (highlighted.length) {
647      for (var i = 0; i < highlighted.length; i++) {
648        highlighted[i].classList.remove('rz-state-highlight');
649      }
650    }
651
652    if (
653      ul.nextSelectedIndex >= 0 &&
654      ul.nextSelectedIndex <= childNodes.length - 1
655    ) {
656      childNodes[ul.nextSelectedIndex].classList.add('rz-state-highlight');
657      Radzen.scrollIntoViewIfNeeded(childNodes[ul.nextSelectedIndex]);
658    }
659
660    return ul.nextSelectedIndex;
661  },
662  clearFocusedHeaderCell: function (gridId) {
663    var grid = document.getElementById(gridId);
664    if (!grid) return;
665
666    var table = grid.querySelector('.rz-grid-table');
667    var thead = table.getElementsByTagName("thead")[0];
668    var highlightedCells = thead.querySelectorAll('.rz-state-focused');
669    if (highlightedCells.length) {
670        for (var i = 0; i < highlightedCells.length; i++) {
671            highlightedCells[i].classList.remove('rz-state-focused');
672        }
673    }
674  },
675  focusTableRow: function (gridId, key, rowIndex, cellIndex, isVirtual) {
676    var grid = document.getElementById(gridId);
677    if (!grid) return;
678
679    var table = grid.querySelector('.rz-grid-table');
680    var tbody = table.tBodies[0];
681    var thead = table.tHead;

682
683    var rows = (cellIndex != null && thead && thead.rows && thead.rows.length ? [...thead.rows] : []).concat(tbody && tbody.rows && tbody.rows.length ? [...tbody.rows] : []);
684
685    if (isVirtual && (key == 'ArrowUp' || key == 'ArrowDown' || key == 'PageUp' || key == 'PageDown' || key == 'Home' || key == 'End')) {
686        if (rowIndex == 0 && (key == 'End' || key == 'PageDown')) {
687            var highlightedCells = thead.querySelectorAll('.rz-state-focused');
688            if (highlightedCells.length) {
689                for (var i = 0; i < highlightedCells.length; i++) {
690                    highlightedCells[i].classList.remove('rz-state-focused');
691                }
692            }
693        }
694        if (key == 'ArrowUp' || key == 'ArrowDown' || key == 'PageUp' || key == 'PageDown') {
695            var rowHeight = rows[rows.length - 1] ? rows[rows.length - 1].offsetHeight : 40;
696            var factor = key == 'PageUp' || key == 'PageDown' ? 10 : 1;
697            table.parentNode.scrollTop = table.parentNode.scrollTop + (factor * (key == 'ArrowDown' || key == 'PageDown' ? rowHeight : -rowHeight));
698        }
699        else {
700            table.parentNode.scrollTop = key == 'Home' ? 0 : table.parentNode.scrollHeight;
701        }
702    }
703
704    table.nextSelectedIndex = rowIndex || 0;
705    table.nextSelectedCellIndex = cellIndex || 0;
706
707    if (key == 'ArrowDown') {
708        while (table.nextSelectedIndex < rows.length - 1) {
709            table.nextSelectedIndex++;
710            if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].classList.contains('rz-state-disabled'))
711                break;
712        }
713    } else if (key == 'ArrowUp') {
714        while (table.nextSelectedIndex > 0) {
715            table.nextSelectedIndex--;
716            if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].classList.contains('rz-state-disabled'))
717                break;
718        }
719    } else if (key == 'ArrowRight') {
720        while (table.nextSelectedCellIndex < rows[table.nextSelectedIndex].cells.length - 1) {
721            table.nextSelectedCellIndex++;
722            if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex].classList.contains('rz-state-disabled'))
723                break;
724        }
725    } else if (key == 'ArrowLeft') {
726        while (table.nextSelectedCellIndex > 0) {
727            table.nextSelectedCellIndex--;
728            if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex].classList.contains('rz-state-disabled'))
729                break;
730        }
731    } else if (isVirtual && (key == 'PageDown' || key == 'End')) {
732        table.nextSelectedIndex = rows.length - 1;
733    } else if (isVirtual && (key == 'PageUp' || key == 'Home')) {
734        table.nextSelectedIndex = 1;
735    }
736
737    if (key == 'ArrowLeft' || key == 'ArrowRight' || (key == 'ArrowUp' && cellIndex != null && table.nextSelectedIndex == 0 && table.parentNode.scrollTop == 0)) {
738        var highlightedCells = rows[table.nextSelectedIndex].querySelectorAll('.rz-state-focused');
739        if (highlightedCells.length) {
740            for (var i = 0; i < highlightedCells.length; i++) {
741                highlightedCells[i].classList.remove('rz-state-focused');
742            }
743        }
744
745        if (
746            table.nextSelectedCellIndex >= 0 &&
747            table.nextSelectedCellIndex <= rows[table.nextSelectedIndex].cells.length - 1
748        ) {
749            var cell = rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex];
750
751            if (!cell.classList.contains('rz-state-focused')) {
752                cell.classList.add('rz-state-focused');
753                if (!isVirtual && table.parentElement.scrollWidth > table.parentElement.clientWidth) {
754                    Radzen.scrollIntoViewIfNeeded(cell);
755                }
756            }
757        }
758    } else if (key == 'ArrowDown' || key == 'ArrowUp') {
759        var highlighted = table.querySelectorAll('.rz-state-focused');
760        if (highlighted.length) {
761            for (var i = 0; i < highlighted.length; i++) {
762                highlighted[i].classList.remove('rz-state-focused');
763            }
764        }
765
766        if (table.nextSelectedIndex >= 0 &&
767            table.nextSelectedIndex <= rows.length - 1
768        ) {
769            var row = rows[table.nextSelectedIndex];
770
771            if (!row.classList.contains('rz-state-focused')) {
772                row.classList.add('rz-state-focused');
773                if (!isVirtual && table.parentElement.scrollHeight > table.parentElement.clientHeight) {
774                    Radzen.scrollIntoViewIfNeeded(row);

775                }
776            }
777        }
778    }
779
780    return [table.nextSelectedIndex, table.nextSelectedCellIndex];
781  },
782  uploadInputChange: function (e, url, auto, multiple, clear, parameterName) {
783      if (auto) {
784          Radzen.upload(e.target, url, multiple, clear, parameterName);
785          e.target.value = '';
786      } else {
787          Radzen.uploadChange(e.target);
788      }
789  },
790  uploads: function (uploadComponent, id) {
791    if (!Radzen.uploadComponents) {
792      Radzen.uploadComponents = {};
793    }
794    Radzen.uploadComponents[id] = uploadComponent;
795  },
796  uploadChange: function (fileInput) {
797    var files = [];
798    for (var i = 0; i < fileInput.files.length; i++) {
799      var file = fileInput.files[i];
800      files.push({
801        Name: file.name,
802        Size: file.size,
803        Url: URL.createObjectURL(file)
804      });
805    }
806
807    var uploadComponent =
808      Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id];
809    if (uploadComponent) {
810      if (uploadComponent.localFiles) {
811        // Clear any previously created preview URL(s)
812        for (var i = 0; i < uploadComponent.localFiles.length; i++) {
813          var file = uploadComponent.localFiles[i];
814          if (file.Url) {
815            URL.revokeObjectURL(file.Url);
816          }
817        }
818      }
819
820      uploadComponent.files = Array.from(fileInput.files);
821      uploadComponent.localFiles = files;
822      uploadComponent.invokeMethodAsync('RadzenUpload.OnChange', files);
823    }
824
825    for (var i = 0; i < fileInput.files.length; i++) {
826      var file = fileInput.files[i];
827      if (file.Url) {
828        URL.revokeObjectURL(file.Url);
829      }
830    }
831  },
832  removeFileFromUpload: function (fileInput, name) {
833    var uploadComponent = Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id];
834    if (!uploadComponent) return;
835    var file = uploadComponent.files.find(function (f) { return f.name == name; })
836    if (!file) { return; }
837    var localFile = uploadComponent.localFiles.find(function (f) { return f.Name == name; });
838    if (localFile) {
839      URL.revokeObjectURL(localFile.Url);
840    }
841    var index = uploadComponent.files.indexOf(file)
842    if (index != -1) {
843        uploadComponent.files.splice(index, 1);
844    }
845    fileInput.value = '';
846  },
847  removeFileFromFileInput: function (fileInput) {
848    fileInput.value = '';
849  },
850  upload: function (fileInput, url, multiple, clear, parameterName) {
851    var uploadComponent = Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id];
852    if (!uploadComponent) { return; }
853    if (!uploadComponent.files || clear) {
854        uploadComponent.files = Array.from(fileInput.files);
855    }
856    var data = new FormData();
857    var files = [];
858    var cancelled = false;
859    for (var i = 0; i < uploadComponent.files.length; i++) {
860      var file = uploadComponent.files[i];
861      data.append(parameterName || (multiple ? 'files' : 'file'), file, file.name);
862      files.push({Name: file.name, Size: file.size});
863    }
864    var xhr = new XMLHttpRequest();
865    xhr.withCredentials = true;
866    xhr.upload.onprogress = function (e) {
867      if (e.lengthComputable) {
868        var uploadComponent =
869          Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id];
870        if (uploadComponent) {
871          var progress = parseInt((e.loaded / e.total) * 100);
872          uploadComponent.invokeMethodAsync(
873            'RadzenUpload.OnProgress',
874            progress,
875            e.loaded,
876            e.total,
877            files,
878            cancelled
879          ).then(function (cancel) {
880              if (cancel) {
881                  cancelled = true;
882                  xhr.abort();
883              }
884          });
885        }
886      }
887    };
888    xhr.onreadystatechange = function (e) {
889      if (xhr.readyState === XMLHttpRequest.DONE) {
890        var status = xhr.status;
891        var uploadComponent =
892          Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id];
893        if (uploadComponent) {
894          if (status === 0 || (status >= 200 && status < 400)) {
895            uploadComponent.invokeMethodAsync(
896              'RadzenUpload.OnComplete',
897                xhr.responseText,
898                cancelled
899            );
900          } else {
901            uploadComponent.invokeMethodAsync(
902              'RadzenUpload.OnError',
903              xhr.responseText
904            );
905          }
906        }
907      }
908    };
909    uploadComponent.invokeMethodAsync('GetHeaders').then(function (headers) {
910      xhr.open('POST', url, true);
911      for (var name in headers) {
912        xhr.setRequestHeader(name, headers[name]);
913      }
914      xhr.send(data);
915    });

916  },
917  getCookie: function (name) {
918    var value = '; ' + decodeURIComponent(document.cookie);
919    var parts = value.split('; ' + name + '=');
920    if (parts.length == 2) return parts.pop().split(';').shift();
921  },
922  getCulture: function () {
923    var cultureCookie = Radzen.getCookie('.AspNetCore.Culture');
924    var uiCulture = cultureCookie
925      ? cultureCookie.split('|').pop().split('=').pop()
926      : null;
927    return uiCulture || 'en-US';
928  },
929  numericOnPaste: function (e, min, max) {
930    if (e.clipboardData) {
931      var value = e.clipboardData.getData('text');
932
933      if (value && !isNaN(+value)) {
934        var numericValue = +value;
935        if (min != null && numericValue >= min) {
936            return;
937        }
938        if (max != null && numericValue <= max) {
939            return;
940        }
941      }
942
943      e.preventDefault();
944    }
945  },
946  numericOnInput: function (e, min, max, isNullable) {
947      var value = e.target.value;
948
949      if (!isNullable && value == '' && min != null) {
950          e.target.value = min;
951      }
952
953      if (value && !isNaN(+value)) {
954        var numericValue = +value;
955        if (min != null && !isNaN(+min) && numericValue < min) {
956            e.target.value = min;
957        }
958        if (max != null && !isNaN(+max) && numericValue > max) {
959            e.target.value = max;
960        }
961      }
962  },
963  numericKeyPress: function (e, isInteger, decimalSeparator) {
964    if (
965      e.metaKey ||
966      e.ctrlKey ||
967      e.keyCode == 9 ||
968      e.keyCode == 8 ||
969      e.keyCode == 13
970    ) {
971      return;
972      }
973
974      if (e.code === 'NumpadDecimal' && !isInteger) {
975          var cursorPosition = e.target.selectionEnd;
976          e.target.value = [e.target.value.slice(0, e.target.selectionStart), decimalSeparator, e.target.value.slice(e.target.selectionEnd)].join('');
977          e.target.selectionStart = ++cursorPosition;
978          e.target.selectionEnd = cursorPosition;
979          e.preventDefault();
980          return;
981    }
982
983    var ch = e.key;
984
985    if (/\p{Nd}/u.test(ch) || ch === '-' || (!isInteger && ch === decimalSeparator)) {
986      return;
987    }
988
989    e.preventDefault();
990  },
991  openContextMenu: function (x,y,id, instance, callback) {
992    Radzen.closePopup(id);
993
994    Radzen.openPopup(null, id, false, null, x, y, instance, callback);
995
996    setTimeout(function () {
997        var popup = document.getElementById(id);
998        if (popup) {
999            var menu = popup.querySelector('.rz-menu');
1000            if (menu) {
1001                menu.focus();
1002            }
1003        }
1004    }, 500);
1005  },
1006  openTooltip: function (target, id, delay, duration, position, closeTooltipOnDocumentClick, instance, callback) {
1007    Radzen.closeTooltip(id);
1008
1009    if (delay) {
1010        Radzen[id + 'delay'] = setTimeout(Radzen.openPopup, delay, target, id, false, position, null, null, instance, callback, closeTooltipOnDocumentClick);
1011    } else {
1012        Radzen.openPopup(target, id, false, position, null, null, instance, callback, closeTooltipOnDocumentClick);
1013    }
1014
1015    if (duration) {
1016      Radzen[id + 'duration'] = setTimeout(Radzen.closePopup, duration, id, instance, callback);
1017    }
1018  },
1019  closeTooltip(id) {
1020    Radzen.activeElement = null;
1021    Radzen.closePopup(id);
1022
1023    if (Radzen[id + 'delay']) {
1024        clearTimeout(Radzen[id + 'delay']);
1025    }
1026
1027    if (Radzen[id + 'duration']) {
1028        clearTimeout(Radzen[id + 'duration']);
1029    }
1030  },
1031  destroyDatePicker(id) {
1032      var el = document.getElementById(id);
1033      if (!el) return;
1034
1035      var button = el.querySelector('.rz-datepicker-trigger');
1036      if (button) {
1037          button.onclick = null;
1038      }
1039      var input = el.querySelector('.rz-inputtext');
1040      if (input) {
1041          input.onclick = null;
1042      }
1043  },
1044  createDatePicker(el, popupId) {
1045      if(!el) return;
1046      var handler = function (e, condition) {
1047          if (condition) {
1048              Radzen.togglePopup(e.currentTarget.parentNode, popupId, false, null, null, true, false);
1049          }
1050      };
1051
1052      var input = el.querySelector('.rz-inputtext');
1053      var button = el.querySelector('.rz-datepicker-trigger');
1054      if (button) {
1055          button.onclick = function (e) {
1056              handler(e, !e.currentTarget.classList.contains('rz-state-disabled') && (input ? !input.classList.contains('rz-readonly') : true));
1057          };
1058      }
1059
1060      if (input) {
1061          input.onclick = function (e) {
1062              handler(e, e.currentTarget.classList.contains('rz-input-trigger') && !e.currentTarget.classList.contains('rz-readonly'));
1063          };
1064      }
1065  },
1066  findPopup: function (id) {
1067    var popups = [];
1068    for (var i = 0; i < document.body.children.length; i++) {
1069      if (document.body.children[i].id == id) {
1070        popups.push(document.body.children[i]);
1071      }
1072    }
1073    return popups;
1074  },
1075  repositionPopup: function (parent, id) {
1076      var popup = document.getElementById(id);
1077      if (!popup) return;
1078
1079      var rect = popup.getBoundingClientRect();
1080      var parentRect = parent ? parent.getBoundingClientRect() : { top: 0, bottom: 0, left: 0, right: 0, width: 0, height: 0 };
1081
1082      if (/Edge/.test(navigator.userAgent)) {
1083          var scrollTop = document.body.scrollTop;
1084      } else {
1085          var scrollTop = document.documentElement.scrollTop;
1086      }
1087
1088      var top = parentRect.bottom + scrollTop;
1089
1090      if (top + rect.height > window.innerHeight + scrollTop && parentRect.top > rect.height) {
1091          top = parentRect.top - rect.height + scrollTop;
1092      }
1093
1094      popup.style.top = top + 'px';
1095  },
1096  openPopup: function (parent, id, syncWidth, position, x, y, instance, callback, closeOnDocumentClick = true, autoFocusFirstElement = false, disableSmartPosition = false) {
1097    var popup = document.getElementById(id);
1098    if (!popup) return;
1099
1100    Radzen.activeElement = document.activeElement;
1101
1102    var parentRect = parent ? parent.getBoundingClientRect() : { top: y || 0, bottom: 0, left: x || 0, right: 0, width: 0, height: 0 };
1103
1104    if (/Edge/.test(navigator.userAgent)) {
1105      var scrollLeft = document.body.scrollLeft;
1106      var scrollTop = document.body.scrollTop;
1107    } else {
1108      var scrollLeft = document.documentElement.scrollLeft;
1109      var scrollTop = document.documentElement.scrollTop;
1110    }
1111
1112    var top = y ? y : parentRect.bottom;
1113    var left = x ? x : parentRect.left;
1114
1115      if (syncWidth) {
1116        popup.style.width = parentRect.width + 'px';
1117        if (!popup.style.minWidth) {
1118            popup.minWidth = true;
1119            popup.style.minWidth = parentRect.width + 'px';
1120        }
1121    }
1122
1123    if (window.chrome) {
1124        var closestFrozenCell = popup.closest('.rz-frozen-cell');
1125        if (closestFrozenCell) {
1126            Radzen[id + 'FZL'] = { cell: closestFrozenCell, left: closestFrozenCell.style.left };
1127            closestFrozenCell.style.left = '';
1128        }
1129    }
1130
1131    popup.style.display = 'block';
1132    popup.onanimationend = null;
1133    popup.classList.add("rz-open");
1134    popup.classList.remove("rz-close");
1135
1136    var rect = popup.getBoundingClientRect();
1137    rect.width = x ? rect.width + 20 : rect.width;
1138    rect.height = y ? rect.height + 20 : rect.height;
1139
1140    var smartPosition = !position || position == 'bottom';
1141
1142    if (smartPosition && top + rect.height > window.innerHeight && parentRect.top > rect.height) {
1143        if (disableSmartPosition !== true) {
1144            top = parentRect.top - rect.height;
1145        }
1146
1147      if (position) {
1148        top = top - 40;
1149        var tooltipContent = popup.children[0];
1150        var tooltipContentClassName = 'rz-' + position + '-tooltip-content';
1151        if (tooltipContent.classList.contains(tooltipContentClassName)) {
1152          tooltipContent.classList.remove(tooltipContentClassName);
1153          tooltipContent.classList.add('rz-top-tooltip-content');
1154            position = 'top';
1155            if (instance && callback) {
1156                try { instance.invokeMethodAsync(callback, position); } catch { }
1157            }
1158        }
1159      }
1160    }
1161
1162    if (smartPosition && left + rect.width > window.innerWidth && window.innerWidth > rect.width) {
1163      left = !position ? window.innerWidth - rect.width : rect.left;
1164
1165      if (position) {
1166        top = y || parentRect.top;
1167        var tooltipContent = popup.children[0];
1168        var tooltipContentClassName = 'rz-' + position + '-tooltip-content';
1169        if (tooltipContent.classList.contains(tooltipContentClassName)) {
1170          tooltipContent.classList.remove(tooltipContentClassName);
1171          tooltipContent.classList.add('rz-left-tooltip-content');
1172          position = 'left';
1173          if (instance && callback) {
1174              try { instance.invokeMethodAsync(callback, position); } catch { }
1175          }
1176        }
1177      }
1178    }
1179
1180    if (smartPosition) {
1181      if (position) {
1182        top = top + 20;
1183      }
1184    }
1185
1186    if (position == 'left') {
1187      left = parentRect.left - rect.width - 5;
1188      top =  parentRect.top;
1189    }
1190
1191    if (position == 'right') {
1192      left = parentRect.right + 10;
1193      top = parentRect.top;
1194    }
1195
1196    if (position == 'top') {
1197      top = parentRect.top - rect.height + 5;
1198      left = parentRect.left;
1199    }
1200
1201    popup.style.zIndex = 2000;
1202    popup.style.left = left + scrollLeft + 'px';
1203    popup.style.top = top + scrollTop + 'px';
1204
1205    if (!popup.classList.contains('rz-overlaypanel')) {
1206        popup.classList.add('rz-popup');
1207    }
1208
1209    Radzen[id] = function (e) {
1210        var lastPopup = Radzen.popups && Radzen.popups[Radzen.popups.length - 1];
1211        var currentPopup = lastPopup != null && document.getElementById(lastPopup.id) || popup;
1212
1213        if (lastPopup) {
1214            currentPopup.instance = lastPopup.instance;
1215            currentPopup.callback = lastPopup.callback;
1216            currentPopup.parent = lastPopup.parent;
1217        }
1218
1219        if(e.type == 'contextmenu' || !e.target || !closeOnDocumentClick) return;
1220        if (!/Android/i.test(navigator.userAgent) &&
1221            !['input', 'textarea'].includes(document.activeElement ? document.activeElement.tagName.toLowerCase() : '') && e.type == 'resize') {
1222            Radzen.closePopup(currentPopup.id, currentPopup.instance, currentPopup.callback, e);
1223            return;
1224        }
1225
1226        var closestLink = e.target.closest && (e.target.closest('.rz-link') || e.target.closest('.rz-navigation-item-link'));
1227        if (e.type == 'resize' && !/Android/i.test(navigator.userAgent)) {
1228            if (closestLink && closestLink.closest && closestLink.closest('a') && e.button == 0) {
1229                closestLink.closest('a').click();
1230                Radzen.closeAllPopups();
1231            } else {
1232                Radzen.closeAllPopups();
1233            }
1234        }
1235        if (currentPopup.parent) {
1236          if (e.type == 'mousedown' && !currentPopup.parent.contains(e.target) && !currentPopup.contains(e.target)) {
1237              Radzen.closePopup(currentPopup.id, currentPopup.instance, currentPopup.callback, e);
1238          }
1239        } else {
1240          if (e.target.nodeType && !currentPopup.contains(e.target)) {
1241              Radzen.closePopup(currentPopup.id, currentPopup.instance, currentPopup.callback, e);
1242          }
1243        }
1244    };
1245
1246    if (!Radzen.popups) {
1247        Radzen.popups = [];
1248    }
1249
1250    Radzen.popups.push({ id, instance, callback, parent });
1251

1252    document.body.appendChild(popup);
1253    document.removeEventListener('mousedown', Radzen[id]);
1254    document.addEventListener('mousedown', Radzen[id]);
1255    window.removeEventListener('resize', Radzen[id]);
1256    window.addEventListener('resize', Radzen[id]);
1257
1258    var p = parent;
1259    while (p && p != document.body) {
1260        if (p.scrollWidth > p.clientWidth || p.scrollHeight > p.clientHeight) {
1261            p.removeEventListener('scroll', Radzen.closeAllPopups);
1262            p.addEventListener('scroll', Radzen.closeAllPopups);
1263        }
1264        p = p.parentElement;
1265    }
1266
1267    if (!parent) {
1268        document.removeEventListener('contextmenu', Radzen[id]);
1269        document.addEventListener('contextmenu', Radzen[id]);
1270    }
1271
1272    if (autoFocusFirstElement) {
1273        setTimeout(function () {
1274            popup.removeEventListener('keydown', Radzen.focusTrap);
1275            popup.addEventListener('keydown', Radzen.focusTrap);
1276
1277            var focusable = Radzen.getFocusableElements(popup);
1278            var firstFocusable = focusable[0];
1279            if (firstFocusable) {
1280                firstFocusable.focus();
1281            }
1282        }, 200);
1283    }
1284  },
1285  closeAllPopups: function (e, id) {
1286    if (!Radzen.popups) return;
1287    var el = e && e.target || id && documentElement.getElementById(id);
1288    var popups = Radzen.popups;
1289      for (var i = 0; i < popups.length; i++) {
1290        var p = popups[i];
1291
1292        var closestPopup = el && el.closest && (el.closest('.rz-popup') || el.closest('.rz-overlaypanel'));
1293        if (closestPopup && closestPopup != p) {
1294            return;
1295        }
1296
1297        Radzen.closePopup(p.id, p.instance, p.callback, e);
1298    }
1299    Radzen.popups = [];
1300  },
1301  closePopup: function (id, instance, callback, e) {
1302    var popup = document.getElementById(id);
1303    if (!popup) return;
1304    if (popup.style.display == 'none') {
1305        var popups = Radzen.findPopup(id);
1306        if (popups.length > 1) {
1307            for (var i = 0; i < popups.length; i++) {
1308                if (popups[i].style.display == 'none') {
1309                    popups[i].parentNode.removeChild(popups[i]);
1310                } else {
1311                    popup = popups[i];
1312                }
1313            }
1314        } else {
1315            return;
1316        }
1317    }
1318
1319    if (popup) {
1320      if (popup.minWidth) {
1321          popup.style.minWidth = '';
1322      }
1323
1324      if (window.chrome && Radzen[id + 'FZL']) {
1325        Radzen[id + 'FZL'].cell.style.left = Radzen[id + 'FZL'].left;
1326        Radzen[id + 'FZL'] = null;
1327      }
1328
1329      popup.onanimationend = function () {
1330          popup.style.display = 'none';
1331          popup.onanimationend = null;
1332      }
1333      popup.classList.add("rz-close");
1334      popup.classList.remove("rz-open");
1335    }
1336    document.removeEventListener('mousedown', Radzen[id]);
1337    window.removeEventListener('resize', Radzen[id]);
1338    Radzen[id] = null;
1339
1340    if (instance && callback) {
1341        if (callback.includes('RadzenTooltip')) {
1342            try { instance.invokeMethodAsync(callback, null); } catch { }
1343        } else {
1344            try { instance.invokeMethodAsync(callback); } catch { }
1345        }
1346    }
1347    Radzen.popups = (Radzen.popups || []).filter(function (obj) {
1348        return obj.id !== id;
1349    });
1350
1351    if (Radzen.activeElement && Radzen.activeElement == document.activeElement ||
1352        Radzen.activeElement && document.activeElement == document.body ||
1353        Radzen.activeElement && document.activeElement &&
1354            (document.activeElement.classList.contains('rz-dropdown-filter') || document.activeElement.classList.contains('rz-lookup-search-input'))) {
1355        setTimeout(function () {
1356            if (e && e.target && e.target.tabIndex != -1) {
1357                Radzen.activeElement = e.target;
1358            }
1359            if (Radzen.activeElement) {
1360               Radzen.activeElement.focus();
1361            }
1362            Radzen.activeElement = null;
1363        }, 100);
1364    }
1365  },
1366  popupOpened: function (id) {
1367    var popup = document.getElementById(id);
1368    if (popup) {
1369        return popup.style.display != 'none';
1370    }
1371    return false;
1372  },
1373  togglePopup: function (parent, id, syncWidth, instance, callback, closeOnDocumentClick = true, autoFocusFirstElement = false) {
1374    var popup = document.getElementById(id);
1375    if (!popup) return;
1376    if (popup.style.display == 'block') {
1377      Radzen.closePopup(id, instance, callback);
1378    } else {
1379      Radzen.openPopup(parent, id, syncWidth, null, null, null, instance, callback, closeOnDocumentClick, autoFocusFirstElement);
1380    }
1381  },
1382  destroyPopup: function (id) {
1383    var popup = document.getElementById(id);
1384    if (popup) {
1385      popup.parentNode.removeChild(popup);
1386    }
1387    document.removeEventListener('mousedown', Radzen[id]);
1388  },
1389  scrollDataGrid: function (e) {
1390    var scrollLeft =
1391      (e.target.scrollLeft ? '-' + e.target.scrollLeft : 0) + 'px';
1392
1393      e.target.previousElementSibling.style.marginLeft = scrollLeft;
1394      e.target.previousElementSibling.firstElementChild.style.paddingRight =
1395          e.target.clientHeight < e.target.scrollHeight ? (e.target.offsetWidth - e.target.clientWidth) + 'px' : '0px';
1396
1397    if (e.target.nextElementSibling) {
1398        e.target.nextElementSibling.style.marginLeft = scrollLeft;
1399        e.target.nextElementSibling.firstElementChild.style.paddingRight =
1400            e.target.clientHeight < e.target.scrollHeight ? (e.target.offsetWidth - e.target.clientWidth) + 'px' : '0px';
1401    }
1402
1403    for (var i = 0; i < document.body.children.length; i++) {
1404        if (document.body.children[i].classList.contains('rz-overlaypanel')) {
1405            document.body.children[i].style.display = 'none';
1406        }
1407    }
1408  },
1409  focusFirstFocusableElement: function (el) {
1410      var focusable = Radzen.getFocusableElements(el);
1411      var editor = el.querySelector('.rz-html-editor');
1412
1413      if (editor && !focusable.includes(editor.previousElementSibling)) {
1414          var editable = el.querySelector('.rz-html-editor-content');
1415          if (editable) {
1416              var selection = window.getSelection();
1417              var range = document.createRange();
1418              range.setStart(editable, 0);
1419              range.setEnd(editable, 0);
1420              selection.removeAllRanges();
1421              selection.addRange(range);
1422          }
1423      } else {
1424          var firstFocusable = focusable[0];
1425          if (firstFocusable) {
1426              firstFocusable.focus();
1427          }
1428      }
1429  },
1430  openSideDialog: function (options) {
1431      setTimeout(function () {
1432          if (options.autoFocusFirstElement) {
1433              var dialogs = document.querySelectorAll('.rz-dialog-side-content');
1434              if (dialogs.length == 0) return;
1435              var lastDialog = dialogs[dialogs.length - 1];
1436              Radzen.focusFirstFocusableElement(lastDialog);
1437          }
1438      }, 500);
1439  },
1440  openDialog: function (options, dialogService, dialog) {
1441    if (Radzen.closeAllPopups) {
1442        Radzen.closeAllPopups();
1443    }
1444    Radzen.dialogService = dialogService;
1445    if (
1446      document.documentElement.scrollHeight >
1447      document.documentElement.clientHeight
1448    ) {
1449      document.body.classList.add('no-scroll');
1450    }
1451
1452    setTimeout(function () {
1453        var dialogs = document.querySelectorAll('.rz-dialog-content');
1454        if (dialogs.length == 0) return;
1455        var lastDialog = dialogs[dialogs.length - 1];
1456
1457        if (lastDialog) {
1458            lastDialog.options = options;
1459            lastDialog.removeEventListener('keydown', Radzen.focusTrap);
1460            lastDialog.addEventListener('keydown', Radzen.focusTrap);
1461
1462            if (options.resizable) {
1463                dialog.offsetWidth = lastDialog.parentElement.offsetWidth;
1464                dialog.offsetHeight = lastDialog.parentElement.offsetHeight;
1465                var dialogResize = function (e) {
1466                    if (!dialog) return;
1467                    if (dialog.offsetWidth != e[0].target.offsetWidth || dialog.offsetHeight != e[0].target.offsetHeight) {
1468
1469                        dialog.offsetWidth = e[0].target.offsetWidth;
1470                        dialog.offsetHeight = e[0].target.offsetHeight;
1471
1472                        dialog.invokeMethodAsync(
1473                            'RadzenDialog.OnResize',
1474                            e[0].target.offsetWidth,
1475                            e[0].target.offsetHeight
1476                        );
1477                    }
1478                };
1479                Radzen.dialogResizer = new ResizeObserver(dialogResize).observe(lastDialog.parentElement);
1480            }
1481
1482            if (options.draggable) {
1483                var dialogTitle = lastDialog.parentElement.querySelector('.rz-dialog-titlebar');
1484                if (dialogTitle) {

1485                    Radzen[dialogTitle] = function (e) {
1486                        var rect = lastDialog.parentElement.getBoundingClientRect();
1487                        var offsetX = e.clientX - rect.left;
1488                        var offsetY = e.clientY - rect.top;
1489
1490                        var move = function (e) {
1491                            var left = e.clientX - offsetX;
1492                            var top = e.clientY - offsetY;
1493
1494                            lastDialog.parentElement.style.left = left + 'px';
1495                            lastDialog.parentElement.style.top = top + 'px';
1496
1497                            dialog.invokeMethodAsync('RadzenDialog.OnDrag', top, left);
1498                        };
1499
1500                        var stop = function () {
1501                            document.removeEventListener('mousemove', move);
1502                            document.removeEventListener('mouseup', stop);
1503                        };
1504
1505                        document.addEventListener('mousemove', move);
1506                        document.addEventListener('mouseup', stop);
1507                    };
1508
1509                    dialogTitle.addEventListener('mousedown', Radzen[dialogTitle]);
1510                }
1511            }
1512
1513            if (options.autoFocusFirstElement) {
1514                Radzen.focusFirstFocusableElement(lastDialog);
1515            }
1516        }
1517    }, 500);
1518
1519    document.removeEventListener('keydown', Radzen.closePopupOrDialog);
1520    if (options.closeDialogOnEsc) {
1521        document.addEventListener('keydown', Radzen.closePopupOrDialog);
1522    }
1523  },
1524  closeDialog: function () {
1525    Radzen.dialogResizer = null;
1526    document.body.classList.remove('no-scroll');
1527    var dialogs = document.querySelectorAll('.rz-dialog-content');
1528
1529    var lastDialog = dialogs.length && dialogs[dialogs.length - 1];
1530    if (lastDialog) {
1531        var dialogTitle = lastDialog.parentElement.querySelector('.rz-dialog-titlebar');
1532        if (dialogTitle) {
1533            dialogTitle.removeEventListener('mousedown', Radzen[dialogTitle]);
1534            Radzen[dialogTitle] = null;
1535            delete Radzen[dialogTitle];
1536        }
1537    }
1538
1539    if (dialogs.length <= 1) {
1540        document.removeEventListener('keydown', Radzen.closePopupOrDialog);
1541        delete Radzen.dialogService;
1542    }
1543  },
1544  disableKeydown: function (e) {
1545      e = e || window.event;
1546      e.preventDefault();
1547  },
1548  getFocusableElements: function (element) {
1549    return [...element.querySelectorAll('a, button, input, textarea, select, details, iframe, embed, object, summary dialog, audio[controls], video[controls], [contenteditable], [tabindex]')]
1550        .filter(el => el && el.tabIndex > -1 && !el.hasAttribute('disabled') && el.offsetParent !== null);
1551  },
1552  focusTrap: function (e) {
1553    e = e || window.event;
1554    var isTab = false;
1555    if ("key" in e) {
1556        isTab = (e.key === "Tab");
1557    } else {
1558        isTab = (e.keyCode === 9);
1559    }
1560    if (isTab) {
1561        var focusable = Radzen.getFocusableElements(e.currentTarget);
1562        var firstFocusable = focusable[0];
1563        var lastFocusable = focusable[focusable.length - 1];
1564
1565        if (firstFocusable && lastFocusable && e.shiftKey && document.activeElement === firstFocusable) {
1566            e.preventDefault();
1567            lastFocusable.focus();
1568        } else if (firstFocusable && lastFocusable && !e.shiftKey && document.activeElement === lastFocusable) {
1569            e.preventDefault();
1570            firstFocusable.focus();
1571        }
1572    }
1573  },
1574  closePopupOrDialog: function (e) {
1575      e = e || window.event;
1576      var isEscape = false;
1577      if ("key" in e) {
1578          isEscape = (e.key === "Escape" || e.key === "Esc");
1579      } else {
1580          isEscape = (e.keyCode === 27);
1581      }
1582      if (isEscape && Radzen.dialogService) {
1583          var popups = document.querySelectorAll('.rz-popup,.rz-overlaypanel');
1584          for (var i = 0; i < popups.length; i++) {
1585              if (popups[i].style.display != 'none') {
1586                  return;
1587              }
1588          }
1589
1590          var dialogs = document.querySelectorAll('.rz-dialog-content');
1591          if (dialogs.length == 0) return;
1592          var lastDialog = dialogs[dialogs.length - 1];
1593
1594          if (lastDialog && lastDialog.options && lastDialog.options.closeDialogOnEsc) {
1595              Radzen.dialogService.invokeMethodAsync('DialogService.Close', null);
1596
1597              if (dialogs.length <= 1) {
1598                  document.removeEventListener('keydown', Radzen.closePopupOrDialog);
1599                  delete Radzen.dialogService;
1600                  var layout = document.querySelector('.rz-layout');
1601                  if (layout) {
1602                      layout.removeEventListener('keydown', Radzen.disableKeydown);
1603                  }
1604              }
1605          }
1606      }
1607  },
1608  getNumericValue: function (arg) {
1609    var el =
1610      arg instanceof Element || arg instanceof HTMLDocument
1611        ? arg
1612        : document.getElementById(arg);
1613    return el ? Radzen.getInputValue(el.children[0]) : null;
1614  },
1615  getInputValue: function (arg) {
1616    var input =
1617      arg instanceof Element || arg instanceof HTMLDocument
1618        ? arg
1619        : document.getElementById(arg);
1620    return input && input.value != '' ? input.value : null;
1621  },
1622  setInputValue: function (arg, value) {
1623    var input =
1624      arg instanceof Element || arg instanceof HTMLDocument
1625        ? arg
1626        : document.getElementById(arg);
1627    if (input) {
1628      input.value = value;
1629    }
1630  },
1631  blur: function (el, e) { 
1632    if (el) {
1633        e.preventDefault();
1634        el.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, cancelable: true, keyCode: 9 }));
1635    }
1636  },
1637  readFileAsBase64: function (fileInput, maxFileSize, maxWidth, maxHeight) {
1638    var calculateWidthAndHeight = function (img) {
1639      var width = img.width;

1640      var height = img.height;
1641      // Change the resizing logic
1642      if (width > height) {
1643        if (width > maxWidth) {
1644          height = height * (maxWidth / width);
1645          width = maxWidth;
1646        }
1647      } else {
1648        if (height > maxHeight) {
1649          width = width * (maxHeight / height);
1650          height = maxHeight;
1651        }
1652      }
1653      return { width, height };
1654    };
1655    var readAsDataURL = function (fileInput) {
1656      return new Promise(function (resolve, reject) {
1657        var reader = new FileReader();
1658        reader.onerror = function () {
1659          reader.abort();
1660          reject('Error reading file.');
1661        };
1662        reader.addEventListener(
1663          'load',
1664          function () {
1665            if (fileInput.files[0] && fileInput.files[0].type.includes('image') && maxWidth > 0 && maxHeight > 0) {
1666              var img = document.createElement("img");
1667              img.onload = function (event) {
1668                // Dynamically create a canvas element
1669                var canvas = document.createElement("canvas");
1670                var res = calculateWidthAndHeight(img);
1671                canvas.width = res.width;
1672                canvas.height = res.height;
1673                var ctx = canvas.getContext("2d");
1674                ctx.drawImage(img, 0, 0, res.width, res.height);
1675                resolve(canvas.toDataURL(fileInput.type));
1676              }
1677              img.src = reader.result;
1678            } else {
1679              resolve(reader.result);
1680            }
1681          },
1682          false
1683          );
1684        var file = fileInput.files[0];
1685        if (!file) return;
1686        if (file.size <= maxFileSize) {
1687          reader.readAsDataURL(file);
1688        } else {
1689          reject('File too large.');
1690        }
1691      });
1692    };
1693
1694    return readAsDataURL(fileInput);
1695  },
1696  toggleMenuItem: function (target, event, defaultActive, clickToOpen) {
1697    var item = target.closest('.rz-navigation-item');
1698
1699    var active = defaultActive != undefined ? defaultActive : !item.classList.contains('rz-navigation-item-active');
1700
1701    function toggle(active) {
1702      item.classList.toggle('rz-navigation-item-active', active);
1703
1704      target.classList.toggle('rz-navigation-item-wrapper-active', active);
1705
1706      var children = item.querySelector('.rz-navigation-menu');
1707
1708      if (children) {
1709        if (active) {
1710          children.onanimationend = null;
1711          children.style.display = '';
1712          children.classList.add('rz-open');
1713          children.classList.remove('rz-close');
1714        } else {
1715          children.onanimationend = function () {
1716            children.style.display = 'none';
1717            children.onanimationend = null;
1718          }
1719          children.classList.remove('rz-open');
1720          children.classList.add('rz-close');
1721        }
1722      }
1723
1724      var icon = item.querySelector('.rz-navigation-item-icon-children');
1725
1726      if (icon) {
1727        icon.classList.toggle('rz-state-expanded', active);
1728        icon.classList.toggle('rz-state-collapsed', !active);
1729      }
1730    }
1731
1732    if (clickToOpen === false && item.parentElement && item.parentElement.closest('.rz-navigation-item') && !defaultActive) {
1733        return;
1734    };
1735
1736    toggle(active);
1737
1738    document.removeEventListener('click', target.clickHandler);
1739
1740    target.clickHandler = function (event) {
1741      if (item.contains(event.target)) {
1742        var child = event.target.closest('.rz-navigation-item');
1743        if (child && child.querySelector('.rz-navigation-menu')) {
1744          return;
1745        }
1746      }
1747      toggle(false);
1748    }
1749
1750    document.addEventListener('click', target.clickHandler);
1751  },
1752  destroyChart: function (ref) {
1753    if(!ref) return;
1754    ref.removeEventListener('mouseleave', ref.mouseLeaveHandler);
1755    delete ref.mouseLeaveHandler;
1756    ref.removeEventListener('mouseenter', ref.mouseEnterHandler);
1757    delete ref.mouseEnterHandler;
1758    ref.removeEventListener('mousemove', ref.mouseMoveHandler);
1759    delete ref.mouseMoveHandler;
1760    ref.removeEventListener('click', ref.clickHandler);
1761    delete ref.clickHandler;
1762    this.destroyResizable(ref);
1763  },
1764  destroyGauge: function (ref) {
1765    this.destroyResizable(ref);
1766  },
1767  destroyResizable: function (ref) {
1768    if (ref.resizeObserver) {
1769      ref.resizeObserver.disconnect();
1770      delete ref.resizeObserver;
1771    }
1772    if (ref.resizeHandler) {
1773      window.removeEventListener('resize', ref.resizeHandler);
1774      delete ref.resizeHandler;
1775    }
1776  },
1777  createResizable: function (ref, instance) {
1778    ref.resizeHandler = function () {
1779      var rect = ref.getBoundingClientRect();
1780
1781      instance.invokeMethodAsync('Resize', rect.width, rect.height);
1782    };
1783
1784    if (window.ResizeObserver) {
1785      ref.resizeObserver = new ResizeObserver(ref.resizeHandler);
1786      ref.resizeObserver.observe(ref);
1787    } else {
1788      window.addEventListener('resize', ref.resizeHandler);
1789    }
1790
1791    var rect = ref.getBoundingClientRect();
1792
1793    return {width: rect.width, height: rect.height};
1794  },
1795  createChart: function (ref, instance) {
1796    var inside = false;
1797    ref.mouseMoveHandler = this.throttle(function (e) {
1798      if (inside) {
1799        var rect = ref.getBoundingClientRect();
1800        var x = e.clientX - rect.left;
1801        var y = e.clientY - rect.top;
1802        instance.invokeMethodAsync('MouseMove', x, y);
1803     }
1804    }, 100);
1805    ref.mouseEnterHandler = function () {
1806        inside = true;
1807    };
1808    ref.mouseLeaveHandler = function (e) {
1809        if (e.relatedTarget && (e.relatedTarget.matches('.rz-chart-tooltip') || e.relatedTarget.closest('.rz-chart-tooltip'))) {
1810            return;
1811        }
1812        inside = false;
1813        instance.invokeMethodAsync('MouseMove', -1, -1);
1814    };
1815    ref.clickHandler = function (e) {
1816      var rect = ref.getBoundingClientRect();
1817      var x = e.clientX - rect.left;
1818      var y = e.clientY - rect.top;
1819      if (!e.target.closest('.rz-marker')) {
1820        instance.invokeMethodAsync('Click', x, y);
1821      }
1822    };
1823
1824    ref.addEventListener('mouseenter', ref.mouseEnterHandler);
1825    ref.addEventListener('mouseleave', ref.mouseLeaveHandler);
1826    ref.addEventListener('mousemove', ref.mouseMoveHandler);
1827    ref.addEventListener('click', ref.clickHandler);
1828
1829    return this.createResizable(ref, instance);
1830  },
1831  createGauge: function (ref, instance) {
1832    return this.createResizable(ref, instance);
1833  },
1834  destroyScheduler: function (ref) {
1835    if (ref && ref.resizeHandler) {
1836      window.removeEventListener('resize', ref.resizeHandler);
1837      delete ref.resizeHandler;
1838    }
1839  },
1840  createScheduler: function (ref, instance) {
1841    ref.resizeHandler = function () {
1842      var rect = ref.getBoundingClientRect();
1843
1844      instance.invokeMethodAsync('Resize', rect.width, rect.height);
1845    };
1846
1847    window.addEventListener('resize', ref.resizeHandler);
1848
1849    var rect = ref.getBoundingClientRect();
1850    return {width: rect.width, height: rect.height};
1851  },
1852  innerHTML: function (ref, value) {
1853    if (value != undefined) {
1854        if (ref != null) {
1855            ref.innerHTML = value;
1856        }
1857    } else {
1858      return ref.innerHTML;
1859    }
1860  },
1861  execCommand: function (ref, name, value) {
1862    if (document.activeElement != ref && ref) {
1863      ref.focus();
1864    }
1865    document.execCommand(name, false, value);
1866    return this.queryCommands(ref);
1867  },
1868  queryCommands: function (ref) {
1869    return {
1870      html: ref != null ? ref.innerHTML : null,
1871      fontName: document.queryCommandValue('fontName'),
1872      fontSize: document.queryCommandValue('fontSize'),
1873      formatBlock: document.queryCommandValue('formatBlock'),
1874      bold: document.queryCommandState('bold'),
1875      underline: document.queryCommandState('underline'),
1876      justifyRight: document.queryCommandState('justifyRight'),
1877      justifyLeft: document.queryCommandState('justifyLeft'),
1878      justifyCenter: document.queryCommandState('justifyCenter'),
1879      justifyFull: document.queryCommandState('justifyFull'),
1880      italic: document.queryCommandState('italic'),

1881      strikeThrough: document.queryCommandState('strikeThrough'),
1882      superscript: document.queryCommandState('superscript'),
1883      subscript: document.queryCommandState('subscript'),
1884      unlink: document.queryCommandEnabled('unlink'),
1885      undo: document.queryCommandEnabled('undo'),
1886      redo: document.queryCommandEnabled('redo')
1887    };
1888  },
1889  mediaQueries: {},
1890  mediaQuery: function(query, instance) {
1891    if (instance) {
1892      function callback(event) {
1893          instance.invokeMethodAsync('OnChange', event.matches)
1894      };
1895      var query = matchMedia(query);
1896      this.mediaQueries[instance._id] = function() {
1897          query.removeListener(callback);
1898      }
1899      query.addListener(callback);
1900      return query.matches;
1901    } else {
1902        instance = query;
1903        if (this.mediaQueries[instance._id]) {
1904            this.mediaQueries[instance._id]();
1905            delete this.mediaQueries[instance._id];
1906        }
1907    }
1908  },
1909  createEditor: function (ref, uploadUrl, paste, instance, shortcuts) {
1910    ref.inputListener = function () {
1911      instance.invokeMethodAsync('OnChange', ref.innerHTML);
1912    };
1913    ref.keydownListener = function (e) {
1914      var key = '';
1915      if (e.ctrlKey || e.metaKey) {
1916        key += 'Ctrl+';
1917      }
1918      if (e.altKey) {
1919        key += 'Alt+';
1920      }
1921      if (e.shiftKey) {
1922        key += 'Shift+';
1923      }
1924      key += e.code.replace('Key', '').replace('Digit', '').replace('Numpad', '');
1925
1926      if (shortcuts.includes(key)) {
1927        e.preventDefault();
1928        instance.invokeMethodAsync('ExecuteShortcutAsync', key);
1929      }
1930    };
1931
1932    ref.clickListener = function (e) {
1933      if (e.target) {
1934        if (e.target.matches('a,button')) {
1935          e.preventDefault();
1936        }
1937
1938        for (var img of ref.querySelectorAll('img.rz-state-selected')) {
1939          img.classList.remove('rz-state-selected');
1940        }
1941
1942        if (e.target.matches('img')) {
1943          e.target.classList.add('rz-state-selected');
1944          var range = document.createRange();
1945          range.selectNode(e.target);
1946          getSelection().removeAllRanges();
1947          getSelection().addRange(range);
1948        }
1949      }
1950    }
1951
1952    ref.selectionChangeListener = function () {
1953      if (document.activeElement == ref) {
1954        instance.invokeMethodAsync('OnSelectionChange');
1955      }
1956    };
1957    ref.pasteListener = function (e) {
1958      var item = e.clipboardData.items[0];
1959
1960      if (item.kind == 'file') {
1961        e.preventDefault();
1962        var file = item.getAsFile();
1963
1964        if (uploadUrl) {
1965            var xhr = new XMLHttpRequest();
1966            var data = new FormData();
1967            data.append("file", file);
1968            xhr.onreadystatechange = function (e) {
1969                if (xhr.readyState === XMLHttpRequest.DONE) {
1970                    var status = xhr.status;
1971                    if (status === 0 || (status >= 200 && status < 400)) {
1972                        var result = JSON.parse(xhr.responseText);
1973                        var html = '<img src="' + result.url + '">';
1974                        if (paste) {
1975                            instance.invokeMethodAsync('OnPaste', html)
1976                                .then(function (html) {
1977                                    document.execCommand("insertHTML", false, html);
1978                                });
1979                        } else {
1980                          document.execCommand("insertHTML", false, '<img src="' + result.url + '">');
1981                        }
1982                        instance.invokeMethodAsync('OnUploadComplete', xhr.responseText);
1983                    } else {
1984                        instance.invokeMethodAsync('OnError', xhr.responseText);
1985                    }
1986                }
1987            }
1988            instance.invokeMethodAsync('GetHeaders').then(function (headers) {
1989                xhr.open('POST', uploadUrl, true);
1990                for (var name in headers) {
1991                    xhr.setRequestHeader(name, headers[name]);
1992                }
1993                xhr.send(data);
1994            });
1995        } else {
1996            var reader = new FileReader();
1997            reader.onload = function (e) {
1998              var html = '<img src="' + e.target.result + '">';
1999
2000              if (paste) {
2001                instance.invokeMethodAsync('OnPaste', html)
2002                  .then(function (html) {
2003                    document.execCommand("insertHTML", false, html);
2004                  });
2005              } else {
2006                document.execCommand("insertHTML", false, html);
2007              }
2008            };

2009            reader.readAsDataURL(file);
2010        }
2011      } else if (paste) {
2012        e.preventDefault();
2013        var data = e.clipboardData.getData('text/html') || e.clipboardData.getData('text/plain');
2014
2015        instance.invokeMethodAsync('OnPaste', data)
2016          .then(function (html) {
2017            document.execCommand("insertHTML", false, html);
2018          });
2019      }
2020    };
2021    ref.addEventListener('input', ref.inputListener);
2022    ref.addEventListener('paste', ref.pasteListener);
2023    ref.addEventListener('keydown', ref.keydownListener);
2024    ref.addEventListener('click', ref.clickListener);
2025    document.addEventListener('selectionchange', ref.selectionChangeListener);
2026    document.execCommand('styleWithCSS', false, true);
2027  },
2028  saveSelection: function (ref) {
2029    if (document.activeElement == ref) {
2030      var selection = getSelection();
2031      if (selection.rangeCount > 0) {
2032        ref.range = selection.getRangeAt(0);
2033      }
2034    }
2035  },
2036  restoreSelection: function (ref) {
2037    var range = ref.range;
2038    if (range) {
2039      delete ref.range;
2040      if(ref) {
2041          ref.focus();
2042      }
2043      var selection = getSelection();
2044      selection.removeAllRanges();
2045      selection.addRange(range);
2046    }
2047  },
2048  selectionAttributes: function (selector, attributes, container) {
2049    var selection = getSelection();
2050    var range = selection.rangeCount > 0 && selection.getRangeAt(0);
2051    var parent = range && range.commonAncestorContainer;
2052    var img = container.querySelector('img.rz-state-selected');
2053    var inside = img && selector == 'img';
2054    while (parent) {
2055      if (parent == container) {
2056        inside = true;
2057        break;
2058      }
2059      parent = parent.parentNode;
2060    }
2061    if (!inside) {
2062      return {};
2063    }
2064    var target = selection.focusNode;
2065    var innerHTML;
2066
2067    if (img && selector == 'img') {
2068      target = img;
2069    } else if (target) {
2070      if (target.nodeType == 3) {
2071        target = target.parentElement;
2072      } else {
2073        target = target.childNodes[selection.focusOffset];
2074        if (target) {
2075          innerHTML = target.outerHTML;
2076        }
2077      }
2078      if (target && target.matches && !target.matches(selector)) {
2079        target = target.closest(selector);
2080      }
2081    }
2082
2083    return attributes.reduce(function (result, name) {
2084      if (target) {
2085        result[name] = name == 'innerText' ? target[name] : target.getAttribute(name);
2086      }
2087      return result;
2088    }, { innerText: selection.toString(), innerHTML: innerHTML });
2089  },
2090  destroyEditor: function (ref) {
2091    if (ref) {
2092      ref.removeEventListener('input', ref.inputListener);
2093      ref.removeEventListener('paste', ref.pasteListener);
2094      ref.removeEventListener('keydown', ref.keydownListener);
2095      ref.removeEventListener('click', ref.clickListener);
2096      document.removeEventListener('selectionchange', ref.selectionChangeListener);
2097    }
2098  },
2099  startDrag: function (ref, instance, handler) {
2100    if (!ref) {
2101        return { left: 0, top: 0, width: 0, height: 0 };
2102    }
2103    ref.mouseMoveHandler = function (e) {
2104      instance.invokeMethodAsync(handler, { clientX: e.clientX, clientY: e.clientY });
2105    };
2106    ref.touchMoveHandler = function (e) {
2107      if (e.targetTouches[0] && ref.contains(e.targetTouches[0].target)) {
2108        instance.invokeMethodAsync(handler, { clientX: e.targetTouches[0].clientX, clientY: e.targetTouches[0].clientY });
2109      }
2110    };
2111    ref.mouseUpHandler = function (e) {
2112      Radzen.endDrag(ref);
2113    };
2114    document.addEventListener('mousemove', ref.mouseMoveHandler);
2115    document.addEventListener('mouseup', ref.mouseUpHandler);
2116    document.addEventListener('touchmove', ref.touchMoveHandler, { passive: true, capture: true })
2117    document.addEventListener('touchend', ref.mouseUpHandler, { passive: true });
2118    return Radzen.clientRect(ref);
2119  },
2120  submit: function (form) {
2121    form.submit();
2122  },
2123  clientRect: function (arg) {
2124    var el = arg instanceof Element || arg instanceof HTMLDocument
2125        ? arg
2126        : document.getElementById(arg);
2127    var rect = el.getBoundingClientRect();
2128    return { left: rect.left, top: rect.top, width: rect.width, height: rect.height };
2129  },
2130  endDrag: function (ref) {
2131    document.removeEventListener('mousemove', ref.mouseMoveHandler);
2132    document.removeEventListener('mouseup', ref.mouseUpHandler);
2133    document.removeEventListener('touchmove', ref.touchMoveHandler)
2134    document.removeEventListener('touchend', ref.mouseUpHandler);
2135  },
2136  startColumnReorder: function(id) {
2137      var el = document.getElementById(id + '-drag');
2138      var cell = el.parentNode.parentNode;
2139      var visual = document.createElement("th");
2140      visual.className = cell.className + ' rz-column-draggable';
2141      visual.style = cell.style;
2142      visual.style.display = 'none';
2143      visual.style.position = 'absolute';
2144      visual.style.height = cell.offsetHeight + 'px';
2145      visual.style.width = cell.offsetWidth + 'px';
2146      visual.style.zIndex = 2000;
2147      visual.innerHTML = cell.firstChild.outerHTML;
2148      visual.id = id + 'visual';
2149      document.body.appendChild(visual);
2150
2151      var resizers = cell.parentNode.querySelectorAll('.rz-column-resizer');
2152      for (let i = 0; i < resizers.length; i++) {
2153          resizers[i].style.display = 'none';
2154      }
2155
2156      Radzen[id + 'end'] = function (e) {
2157          var el = document.getElementById(id + 'visual');
2158          if (el) {
2159              document.body.removeChild(el);
2160              Radzen[id + 'end'] = null;
2161              Radzen[id + 'move'] = null;
2162              var resizers = cell.parentNode.querySelectorAll('.rz-column-resizer');
2163              for (let i = 0; i < resizers.length; i++) {
2164                  resizers[i].style.display = 'block';
2165              }
2166          }
2167      }
2168      document.removeEventListener('click', Radzen[id + 'end']);
2169      document.addEventListener('click', Radzen[id + 'end']);
2170
2171      Radzen[id + 'move'] = function (e) {
2172          var el = document.getElementById(id + 'visual');
2173          if (el) {
2174              el.style.display = 'block';
2175
2176              if (/Edge/.test(navigator.userAgent)) {
2177                  var scrollLeft = document.body.scrollLeft;
2178                  var scrollTop = document.body.scrollTop;
2179              } else {
2180                  var scrollLeft = document.documentElement.scrollLeft;
2181                  var scrollTop = document.documentElement.scrollTop;
2182              }
2183
2184              el.style.top = e.clientY + scrollTop + 10 + 'px';
2185              el.style.left = e.clientX + scrollLeft + 10 + 'px';
2186          }
2187      }
2188      document.removeEventListener('mousemove', Radzen[id + 'move']);
2189      document.addEventListener('mousemove', Radzen[id + 'move']);
2190  },
2191  stopColumnResize: function (id, grid, columnIndex) {
2192    var el = document.getElementById(id + '-resizer');
2193    if(!el) return;
2194    var cell = el.parentNode.parentNode;
2195    if (!cell) return;
2196    if (Radzen[el]) {
2197        grid.invokeMethodAsync(
2198            'RadzenGrid.OnColumnResized',
2199            columnIndex,
2200            cell.getBoundingClientRect().width
2201        );
2202        el.style.width = null;
2203        document.removeEventListener('mousemove', Radzen[el].mouseMoveHandler);
2204        document.removeEventListener('mouseup', Radzen[el].mouseUpHandler);
2205        document.removeEventListener('touchmove', Radzen[el].touchMoveHandler)
2206        document.removeEventListener('touchend', Radzen[el].mouseUpHandler);
2207        Radzen[el] = null;
2208    }
2209  },
2210  startColumnResize: function(id, grid, columnIndex, clientX) {
2211      var el = document.getElementById(id + '-resizer');
2212      var cell = el.parentNode.parentNode;
2213      var col = document.getElementById(id + '-col');
2214      var dataCol = document.getElementById(id + '-data-col');
2215      var footerCol = document.getElementById(id + '-footer-col');
2216      Radzen[el] = {
2217          clientX: clientX,
2218          width: cell.getBoundingClientRect().width,
2219          mouseUpHandler: function (e) {
2220              if (Radzen[el]) {
2221                  grid.invokeMethodAsync(
2222                      'RadzenGrid.OnColumnResized',
2223                      columnIndex,
2224                      cell.getBoundingClientRect().width
2225                  );
2226                  el.style.width = null;
2227                  document.removeEventListener('mousemove', Radzen[el].mouseMoveHandler);
2228                  document.removeEventListener('mouseup', Radzen[el].mouseUpHandler);
2229                  document.removeEventListener('touchmove', Radzen[el].touchMoveHandler)
2230                  document.removeEventListener('touchend', Radzen[el].mouseUpHandler);
2231                  Radzen[el] = null;
2232              }
2233          },
2234          mouseMoveHandler: function (e) {
2235              if (Radzen[el]) {
2236                  var widthFloat = (Radzen[el].width - (Radzen.isRTL(cell) ? -1 : 1) * (Radzen[el].clientX - e.clientX));
2237                  var minWidth = parseFloat(cell.style.minWidth || 0)
2238                  var maxWidth = parseFloat(cell.style.maxWidth || 0)
2239
2240                  if (widthFloat < minWidth) {
2241                      widthFloat = minWidth;
2242                  }
2243
2244                  if (cell.style.maxWidth && widthFloat > maxWidth) {
2245                      widthFloat = maxWidth;
2246                  }
2247
2248                  var width = widthFloat + 'px';
2249
2250                  if (cell) {
2251                      cell.style.width = width;
2252                  }
2253                  if (col) {
2254                      col.style.width = width;
2255                  }
2256                  if (dataCol) {
2257                      dataCol.style.width = width;
2258                  }
2259                  if (footerCol) {
2260                      footerCol.style.width = width;
2261                  }
2262              }
2263          },
2264          touchMoveHandler: function (e) {
2265              if (e.targetTouches[0]) {
2266                  Radzen[el].mouseMoveHandler(e.targetTouches[0]);
2267              }
2268          }
2269      };
2270      el.style.width = "100%";
2271      document.addEventListener('mousemove', Radzen[el].mouseMoveHandler);
2272      document.addEventListener('mouseup', Radzen[el].mouseUpHandler);
2273      document.addEventListener('touchmove', Radzen[el].touchMoveHandler, { passive: true })
2274      document.addEventListener('touchend', Radzen[el].mouseUpHandler, { passive: true });

2275  },
2276      startSplitterResize: function(id,
2277        splitter,
2278        paneId,
2279        paneNextId,
2280        orientation,
2281        clientPos,
2282        minValue,
2283        maxValue,
2284        minNextValue,
2285        maxNextValue) {
2286
2287        var el = document.getElementById(id);
2288        var pane = document.getElementById(paneId);
2289        var paneNext = document.getElementById(paneNextId);
2290        var paneLength;
2291        var paneNextLength;
2292        var panePerc;
2293        var paneNextPerc;
2294        var isHOrientation=orientation == 'Horizontal';
2295
2296        var totalLength = 0.0;
2297        Array.from(el.children).forEach(element => {
2298            totalLength += isHOrientation
2299                ? element.getBoundingClientRect().width
2300                : element.getBoundingClientRect().height;
2301        });
2302
2303        if (pane) {
2304            paneLength = isHOrientation
2305                ? pane.getBoundingClientRect().width
2306                : pane.getBoundingClientRect().height;
2307
2308            panePerc = (paneLength / totalLength * 100) + '%';
2309        }
2310
2311        if (paneNext) {
2312            paneNextLength = isHOrientation
2313                ? paneNext.getBoundingClientRect().width
2314                : paneNext.getBoundingClientRect().height;
2315
2316            paneNextPerc = (paneNextLength / totalLength * 100) + '%';
2317        }
2318
2319        function ensurevalue(value) {
2320            if (!value)
2321                return null;
2322
2323            value=value.trim().toLowerCase();
2324
2325            if (value.endsWith("%"))
2326                return totalLength*parseFloat(value)/100;
2327
2328            if (value.endsWith("px"))
2329                return parseFloat(value);
2330
2331            throw 'Invalid value';
2332        }
2333
2334        minValue=ensurevalue(minValue);
2335        maxValue=ensurevalue(maxValue);
2336        minNextValue=ensurevalue(minNextValue);
2337        maxNextValue=ensurevalue(maxNextValue);
2338
2339        Radzen[el] = {
2340            clientPos: clientPos,
2341            panePerc: parseFloat(panePerc),
2342            paneNextPerc: isFinite(parseFloat(paneNextPerc)) ? parseFloat(paneNextPerc) : 0,
2343            paneLength: paneLength,
2344            paneNextLength: isFinite(paneNextLength) ? paneNextLength : 0,
2345            mouseUpHandler: function(e) {
2346                if (Radzen[el]) {
2347                    splitter.invokeMethodAsync(
2348                        'RadzenSplitter.OnPaneResized',
2349                        parseInt(pane.getAttribute('data-index')),
2350                        parseFloat(pane.style.flexBasis),
2351                        paneNext ? parseInt(paneNext.getAttribute('data-index')) : null,
2352                        paneNext ? parseFloat(paneNext.style.flexBasis) : null
2353                    );
2354
2355                    document.removeEventListener('pointerup', Radzen[el].mouseUpHandler);
2356                    document.removeEventListener('pointermove', Radzen[el].mouseMoveHandler);
2357                    el.removeEventListener('touchmove', preventDefaultAndStopPropagation);
2358                    Radzen[el] = null;
2359                }
2360            },
2361            mouseMoveHandler: function(e) {
2362                if (Radzen[el]) {
2363
2364                    splitter.invokeMethodAsync(
2365                        'RadzenSplitter.OnPaneResizing'
2366                    );
2367
2368                    var spacePerc = Radzen[el].panePerc + Radzen[el].paneNextPerc;
2369                    var spaceLength = Radzen[el].paneLength + Radzen[el].paneNextLength;
2370
2371                    var length = (Radzen[el].paneLength -
2372                        (isHOrientation && Radzen.isRTL(e.target) ? -1 : 1) * (Radzen[el].clientPos - (isHOrientation ? e.clientX : e.clientY)));
2373
2374                    if (length > spaceLength)
2375                        length = spaceLength;
2376
2377                    if (minValue && length < minValue) length = minValue;
2378                    if (maxValue && length > maxValue) length = maxValue;
2379
2380                    if (paneNext) {
2381                        var nextSpace=spaceLength-length;
2382                        if (minNextValue && nextSpace < minNextValue) length = spaceLength-minNextValue;
2383                        if (maxNextValue && nextSpace >

2383 maxNextValue) length = spaceLength+maxNextValue;
2384                    }
2385
2386                    var perc = length / Radzen[el].paneLength;
2387                    if (!isFinite(perc)) {
2388                        perc = 1;
2389                        Radzen[el].panePerc = 0.1;
2390                        Radzen[el].paneLength =isHOrientation
2391                            ? pane.getBoundingClientRect().width
2392                            : pane.getBoundingClientRect().height;
2393                    }
2394
2395                    var newPerc =  Radzen[el].panePerc * perc;
2396                    if (newPerc < 0) newPerc = 0;
2397                    if (newPerc > 100) newPerc = 100;
2398
2399                    pane.style.flexBasis = newPerc + '%';
2400                    if (paneNext)
2401                        paneNext.style.flexBasis = (spacePerc - newPerc) + '%';
2402                }
2403            },
2404            touchMoveHandler: function(e) {
2405                if (e.targetTouches[0]) {
2406                    Radzen[el].mouseMoveHandler(e.targetTouches[0]);
2407                }
2408            }
2409          };
2410
2411        const preventDefaultAndStopPropagation = (ev) => {
2412            ev.preventDefault();
2413            ev.stopPropagation();
2414        };
2415          document.addEventListener('pointerup', Radzen[el].mouseUpHandler);
2416          document.addEventListener('pointermove', Radzen[el].mouseMoveHandler);
2417          el.addEventListener('touchmove', preventDefaultAndStopPropagation, { passive: false });
2418    },
2419    resizeSplitter(id, e) {
2420        var el = document.getElementById(id);
2421        if (el && Radzen[el]) {
2422            Radzen[el].mouseMoveHandler(e);
2423            Radzen[el].mouseUpHandler(e);
2424        }
2425    },
2426    openWaiting: function() {
2427        if (document.documentElement.scrollHeight > document.documentElement.clientHeight) {
2428            document.body.classList.add('no-scroll');
2429        }
2430        if (Radzen.WaitingIntervalId != null) {
2431            clearInterval(Radzen.WaitingIntervalId);
2432        }
2433
2434        setTimeout(function() {
2435                var timerObj = document.getElementsByClassName('rz-waiting-timer');
2436                if (timerObj.length == 0) return;
2437                var timerStart = new Date().getTime();
2438                Radzen.WaitingIntervalId = setInterval(function() {
2439                        if (timerObj == null || timerObj[0] == null) {
2440                            clearInterval(Radzen.WaitingIntervalId);
2441                        } else {
2442                            var time = new Date(new Date().getTime() - timerStart);
2443                            timerObj[0].innerHTML = Math.floor(time / 1000) + "." + Math.floor((time % 1000) / 100);
2444                        }
2445                    },
2446                    100);
2447            },
2448            100);
2449    },
2450    closeWaiting: function() {
2451        document.body.classList.remove('no-scroll');
2452        if (Radzen.WaitingIntervalId != null) {
2453            clearInterval(Radzen.WaitingIntervalId);
2454            Radzen.WaitingIntervalId = null;
2455        }
2456    },
2457    toggleDictation: function (componentRef, language) {
2458        function start() {
2459            const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
2460
2461            if (!SpeechRecognition) {
2462                return;
2463            }
2464
2465            radzenRecognition = new SpeechRecognition();
2466            radzenRecognition.componentRef = componentRef;
2467            radzenRecognition.continuous = true;
2468
2469            if (language) {
2470                radzenRecognition.lang = language;
2471            }
2472
2473            radzenRecognition.onresult = function (event) {
2474                if (event.results.length < 1) {
2475                    return;
2476                }
2477
2478                let current = event.results[event.results.length - 1][0]
2479                let result = current.transcript;
2480
2481                componentRef.invokeMethodAsync("OnResult", result);
2482            };
2483            radzenRecognition.onend = function (event) {
2484                componentRef.invokeMethodAsync("StopRecording");
2485                radzenRecognition = null;
2486            };
2487            radzenRecognition.start();
2488        }
2489
2490        if (radzenRecognition) {
2491            if (radzenRecognition.componentRef._id != componentRef._id) {
2492                radzenRecognition.addEventListener('end', start);
2493            }
2494            radzenRecognition.stop();
2495        } else {
2496            start();
2497        }
2498    },
2499    openChartTooltip: function (chart, x, y, id, instance, callback) {
2500        Radzen.closeTooltip(id);
2501
2502        var chartRect = chart.getBoundingClientRect();
2503        x = Math.max(2, chartRect.left + x);
2504        y = Math.max(2, chartRect.top + y);
2505        Radzen.openPopup(chart, id, false, null, x, y, instance, callback, true, false, false);
2506
2507        var popup = document.getElementById(id);
2508        if (!popup) {
2509            return;
2510        }
2511        var tooltipContent = popup.children[0];
2512        var tooltipContentRect = tooltipContent.getBoundingClientRect();
2513        var tooltipContentClassName = 'rz-top-chart-tooltip';
2514        if (y - tooltipContentRect.height < 0) {
2515            tooltipContentClassName = 'rz-bottom-chart-tooltip';
2516        }
2517        tooltipContent.classList.remove('rz-top-chart-tooltip');
2518        tooltipContent.classList.remove('rz-bottom-chart-tooltip');
2519        tooltipContent.classList.add(tooltipContentClassName);
2520    },
2521    navigateTo: function (selector, scroll) {
2522      if (selector.startsWith('#')) {
2523        history.replaceState(null, '', location.pathname + location.search + selector);
2524      }
2525
2526      if (scroll) {
2527        const target = document.querySelector(selector);
2528        if (target) {
2529            target.scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'start' });
2530        }
2531      }
2532    },
2533    registerScrollListener: function (element, ref, selectors, selector) {
2534      let currentSelector;
2535      const container = selector ? document.querySelector(selector) : document.documentElement;
2536      const elements = selectors.map(document.querySelector, document);
2537
2538      this.unregisterScrollListener(element);
2539      element.scrollHandler = () => {
2540        const center = (container.tagName === 'HTML' ? 0 : container.getBoundingClientRect().top) + container.clientHeight / 2;
2541
2542        let min = Number.MAX_SAFE_INTEGER;
2543        let match;
2544
2545        for (let i = 0; i < elements.length; i++) {
2546          const element = elements[i];
2547          if (!element) continue;
2548
2549          const rect = element.getBoundingClientRect();
2550          const diff = Math.abs(rect.top - center);
2551
2552          if (!match && rect.top < center) {
2553            match = selectors[i];
2554            min = diff;
2555            continue;
2556          }
2557
2558          if (match && rect.top >= center) continue;
2559
2560          if (diff < min) {
2561            match = selectors[i];
2562            min = diff;
2563          }
2564        }
2565
2566        if (match !== currentSelector) {
2567          currentSelector = match;
2568          this.navigateTo(currentSelector, false);
2569          ref.invokeMethodAsync('ScrollIntoView', currentSelector);
2570        }
2571      };
2572
2573      document.addEventListener('scroll', element.scrollHandler, true);
2574      window.addEventListener('resize', element.scrollHandler, true);
2575    },
2576    unregisterScrollListener: function (element) {
2577      document.removeEventListener('scroll', element.scrollHandler, true);
2578      window.removeEventListener('resize', element.scrollHandler, true);
2579    }
2580};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.