@syncfusion/ej2-dropdowns 22.1.39 → 22.2.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3213,20 +3213,20 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3213
3213
  var args = { cancel: false };
3214
3214
  this.trigger('beforeOpen', args, function (args) {
3215
3215
  if (!args.cancel) {
3216
- var popupEle_1 = _this.createElement('div', {
3216
+ var popupEle = _this.createElement('div', {
3217
3217
  id: _this.element.id + '_popup', className: 'e-ddl e-popup ' + (_this.cssClass !== null ? _this.cssClass : '')
3218
3218
  });
3219
- var searchBox = _this.setSearchBox(popupEle_1);
3219
+ var searchBox = _this.setSearchBox(popupEle);
3220
3220
  _this.listHeight = formatUnit(_this.popupHeight);
3221
3221
  if (_this.headerTemplate) {
3222
- _this.setHeaderTemplate(popupEle_1);
3222
+ _this.setHeaderTemplate(popupEle);
3223
3223
  }
3224
- append([_this.list], popupEle_1);
3224
+ append([_this.list], popupEle);
3225
3225
  if (_this.footerTemplate) {
3226
- _this.setFooterTemplate(popupEle_1);
3226
+ _this.setFooterTemplate(popupEle);
3227
3227
  }
3228
- document.body.appendChild(popupEle_1);
3229
- popupEle_1.style.visibility = 'hidden';
3228
+ document.body.appendChild(popupEle);
3229
+ popupEle.style.visibility = 'hidden';
3230
3230
  if (_this.popupHeight !== 'auto') {
3231
3231
  _this.searchBoxHeight = 0;
3232
3232
  if (!isNullOrUndefined(searchBox.container)) {
@@ -3234,20 +3234,20 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3234
3234
  _this.listHeight = (parseInt(_this.listHeight, 10) - (_this.searchBoxHeight)).toString() + 'px';
3235
3235
  }
3236
3236
  if (_this.headerTemplate) {
3237
- _this.header = _this.header ? _this.header : popupEle_1.querySelector('.e-ddl-header');
3237
+ _this.header = _this.header ? _this.header : popupEle.querySelector('.e-ddl-header');
3238
3238
  var height = Math.round(_this.header.getBoundingClientRect().height);
3239
3239
  _this.listHeight = (parseInt(_this.listHeight, 10) - (height + _this.searchBoxHeight)).toString() + 'px';
3240
3240
  }
3241
3241
  if (_this.footerTemplate) {
3242
- _this.footer = _this.footer ? _this.footer : popupEle_1.querySelector('.e-ddl-footer');
3242
+ _this.footer = _this.footer ? _this.footer : popupEle.querySelector('.e-ddl-footer');
3243
3243
  var height = Math.round(_this.footer.getBoundingClientRect().height);
3244
3244
  _this.listHeight = (parseInt(_this.listHeight, 10) - (height + _this.searchBoxHeight)).toString() + 'px';
3245
3245
  }
3246
3246
  _this.list.style.maxHeight = (parseInt(_this.listHeight, 10) - 2).toString() + 'px'; // due to box-sizing property
3247
- popupEle_1.style.maxHeight = formatUnit(_this.popupHeight);
3247
+ popupEle.style.maxHeight = formatUnit(_this.popupHeight);
3248
3248
  }
3249
3249
  else {
3250
- popupEle_1.style.height = 'auto';
3250
+ popupEle.style.height = 'auto';
3251
3251
  }
3252
3252
  var offsetValue = 0;
3253
3253
  var left = void 0;
@@ -3259,7 +3259,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3259
3259
  }
3260
3260
  if (Browser.isDevice && (!_this.allowFiltering && (_this.getModuleName() === 'dropdownlist' ||
3261
3261
  (_this.isDropDownClick && _this.getModuleName() === 'combobox')))) {
3262
- offsetValue = _this.getOffsetValue(popupEle_1);
3262
+ offsetValue = _this.getOffsetValue(popupEle);
3263
3263
  var firstItem = _this.isEmptyList() ? _this.list : _this.liCollections[0];
3264
3264
  if (!isNullOrUndefined(_this.inputElement)) {
3265
3265
  left = -(parseInt(getComputedStyle(firstItem).textIndent, 10) -
@@ -3268,9 +3268,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3268
3268
  }
3269
3269
  }
3270
3270
  _this.getFocusElement();
3271
- _this.createPopup(popupEle_1, offsetValue, left);
3272
- _this.checkCollision(popupEle_1);
3273
- var popupLeft_1 = _this.enableRtl ? parseFloat(popupEle_1.style.left) - (_this.ulElement.parentElement.offsetWidth - _this.inputWrapper.container.offsetWidth) : 0;
3271
+ _this.createPopup(popupEle, offsetValue, left);
3272
+ _this.checkCollision(popupEle);
3274
3273
  if (Browser.isDevice) {
3275
3274
  _this.popupObj.element.classList.add(dropDownListClasses.device);
3276
3275
  if (_this.getModuleName() === 'dropdownlist' || (_this.getModuleName() === 'combobox'
@@ -3290,8 +3289,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3290
3289
  EventHandler.add(_this.clearIconElement, 'click', _this.clearText, _this);
3291
3290
  }
3292
3291
  }
3293
- popupEle_1.style.visibility = 'visible';
3294
- addClass([popupEle_1], 'e-popup-close');
3292
+ popupEle.style.visibility = 'visible';
3293
+ addClass([popupEle], 'e-popup-close');
3295
3294
  var scrollParentElements = _this.popupObj.getScrollableParent(_this.inputWrapper.container);
3296
3295
  for (var _i = 0, scrollParentElements_1 = scrollParentElements; _i < scrollParentElements_1.length; _i++) {
3297
3296
  var element = scrollParentElements_1[_i];
@@ -3324,9 +3323,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3324
3323
  _this.beforePopupOpen = false;
3325
3324
  _this.destroyPopup();
3326
3325
  }
3327
- if (_this.enableRtl && popupLeft_1 > 0) {
3328
- popupEle_1.style.left = popupLeft_1 + "px";
3329
- }
3330
3326
  });
3331
3327
  }
3332
3328
  else {
@@ -3354,7 +3350,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3354
3350
  this.popupObj = new Popup(element, {
3355
3351
  width: this.setWidth(), targetType: 'relative',
3356
3352
  relateTo: this.inputWrapper.container, collision: { X: 'flip', Y: 'flip' }, offsetY: offsetValue,
3357
- enableRtl: this.enableRtl, offsetX: left, position: { X: 'left', Y: 'bottom' },
3353
+ enableRtl: this.enableRtl, offsetX: left,
3354
+ position: this.enableRtl ? { X: 'right', Y: 'bottom' } : { X: 'left', Y: 'bottom' },
3358
3355
  zIndex: this.zIndex,
3359
3356
  close: function () {
3360
3357
  if (!_this.isDocumentClick) {
@@ -3623,6 +3620,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3623
3620
  }
3624
3621
  }
3625
3622
  });
3623
+ if (this.isReact && this.isFiltering() && this.itemTemplate != null) {
3624
+ this.actionCompleteData.ulElement = this.ulElement.cloneNode(true);
3625
+ }
3626
3626
  };
3627
3627
  DropDownList.prototype.destroyPopup = function () {
3628
3628
  this.isPopupOpen = false;
@@ -5406,7 +5406,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
5406
5406
  data += temp;
5407
5407
  temp = this.overFlowWrapper.innerHTML;
5408
5408
  if (this.enableHtmlSanitizer) {
5409
- this.overFlowWrapper.innerText = data;
5409
+ this.overFlowWrapper.innerText = SanitizeHtmlHelper.sanitize(data);
5410
5410
  }
5411
5411
  else {
5412
5412
  this.overFlowWrapper.innerHTML = data;
@@ -6132,7 +6132,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6132
6132
  var isFooter = closest(target, '.' + FOOTER);
6133
6133
  var isScroller = target.classList.contains(DROPDOWN) ? true :
6134
6134
  (matches(target, '.e-ddt .e-popup') || matches(target, '.e-ddt .e-treeview'));
6135
- if ((this.isPopupOpen && (this.inputWrapper.contains(target) || isTree || isScroller || isHeader || isFooter)) ||
6135
+ if ((this.isPopupOpen && ((!isNullOrUndefined(this.inputWrapper) && this.inputWrapper.contains(target)) || isTree || isScroller || isHeader || isFooter)) ||
6136
6136
  ((this.allowMultiSelection || this.showCheckBox) && (this.isPopupOpen && target.classList.contains(CHIP_CLOSE) ||
6137
6137
  (this.isPopupOpen && (target.classList.contains(CHECKALLPARENT) || target.classList.contains(ALLTEXT)
6138
6138
  || target.classList.contains(CHECKBOXFRAME)))))) {
@@ -6770,7 +6770,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6770
6770
  var chipContent = this.createElement('span', { className: CHIP_CONTENT });
6771
6771
  var chipClose = this.createElement('span', { className: CHIP_CLOSE + ' ' + ICONS });
6772
6772
  if (this.enableHtmlSanitizer) {
6773
- chipContent.innerText = text;
6773
+ chipContent.innerText = SanitizeHtmlHelper.sanitize(text);
6774
6774
  }
6775
6775
  else {
6776
6776
  chipContent.innerHTML = text;
@@ -7428,10 +7428,34 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
7428
7428
  Input.setValue(null, this.inputEle, this.floatLabelType);
7429
7429
  detach(this.inputWrapper);
7430
7430
  detach(this.popupDiv);
7431
+ detach(this.hiddenElement);
7431
7432
  this.element.classList.remove('e-input');
7432
7433
  if (this.showCheckBox || this.allowMultiSelection) {
7433
7434
  this.element.classList.remove(CHIP_INPUT);
7434
7435
  }
7436
+ this.inputObj = null;
7437
+ while (this.hiddenElement.options.length > 0) {
7438
+ this.hiddenElement.remove(0);
7439
+ }
7440
+ this.hiddenElement.innerHTML = '';
7441
+ this.hiddenElement = null;
7442
+ this.inputWrapper = null;
7443
+ this.popupDiv = null;
7444
+ this.tree = null;
7445
+ this.popupObj = null;
7446
+ this.treeObj = null;
7447
+ this.overAllClear = null;
7448
+ this.chipWrapper = null;
7449
+ this.chipCollection = null;
7450
+ this.checkAllParent = null;
7451
+ this.selectAllSpan = null;
7452
+ this.checkBoxElement = null;
7453
+ this.checkWrapper = null;
7454
+ this.popupEle = null;
7455
+ this.header = null;
7456
+ this.footer = null;
7457
+ this.overFlowWrapper = null;
7458
+ this.keyboardModule = null;
7435
7459
  _super.prototype.destroy.call(this);
7436
7460
  };
7437
7461
  DropDownTree.prototype.destroyFilter = function () {
@@ -9383,9 +9407,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9383
9407
  if (_this.isFirstClick) {
9384
9408
  _this.loadTemplate();
9385
9409
  }
9386
- if (_this.enableRtl) {
9387
- _this.popupWrapper.style.visibility = 'hidden';
9388
- }
9389
9410
  }
9390
9411
  });
9391
9412
  };
@@ -11238,7 +11259,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11238
11259
  this.list.style.maxHeight = formatUnit(this.popupHeight);
11239
11260
  }
11240
11261
  this.popupObj = new Popup(this.popupWrapper, {
11241
- width: this.calcPopupWidth(), targetType: 'relative', position: { X: 'left', Y: 'bottom' },
11262
+ width: this.calcPopupWidth(), targetType: 'relative',
11263
+ position: this.enableRtl ? { X: 'right', Y: 'bottom' } : { X: 'left', Y: 'bottom' },
11242
11264
  relateTo: this.overAllWrapper, collision: { X: 'flip', Y: 'flip' }, offsetY: 1,
11243
11265
  enableRtl: this.enableRtl, zIndex: this.zIndex,
11244
11266
  close: function () {
@@ -11254,11 +11276,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11254
11276
  },
11255
11277
  open: function () {
11256
11278
  _this.popupObj.resolveCollision();
11257
- if (_this.enableRtl) {
11258
- var popupLeft = parseFloat(_this.popupWrapper.style.left) - (_this.popupWrapper.offsetWidth - _this.overAllWrapper.offsetWidth);
11259
- _this.popupWrapper.style.left = popupLeft > 0 ? popupLeft + "px" : _this.popupWrapper.style.left;
11260
- _this.popupWrapper.style.visibility = 'hidden';
11261
- }
11262
11279
  if (!_this.isFirstClick) {
11263
11280
  var ulElement = _this.list.querySelector('ul');
11264
11281
  if (ulElement) {