survey-react 1.9.89 → 1.9.90

package/survey.react.js

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.89
+ * surveyjs - Survey JavaScript library v1.9.90
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -101,399 +101,6 @@ return /******/ (function(modules) { // webpackBootstrap
 /************************************************************************/
 /******/ ({
 
-/***/ "./node_modules/process/browser.js":
-/*!*****************************************!*\
-  !*** ./node_modules/process/browser.js ***!
-  \*****************************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-// shim for using process in browser
-var process = module.exports = {};
-
-// cached from whatever global is present so that test runners that stub it
-// don't break things.  But we need to wrap it in a try catch in case it is
-// wrapped in strict mode code which doesn't define any globals.  It's inside a
-// function because try/catches deoptimize in certain engines.
-
-var cachedSetTimeout;
-var cachedClearTimeout;
-
-function defaultSetTimout() {
-    throw new Error('setTimeout has not been defined');
-}
-function defaultClearTimeout () {
-    throw new Error('clearTimeout has not been defined');
-}
-(function () {
-    try {
-        if (typeof setTimeout === 'function') {
-            cachedSetTimeout = setTimeout;
-        } else {
-            cachedSetTimeout = defaultSetTimout;
-        }
-    } catch (e) {
-        cachedSetTimeout = defaultSetTimout;
-    }
-    try {
-        if (typeof clearTimeout === 'function') {
-            cachedClearTimeout = clearTimeout;
-        } else {
-            cachedClearTimeout = defaultClearTimeout;
-        }
-    } catch (e) {
-        cachedClearTimeout = defaultClearTimeout;
-    }
-} ())
-function runTimeout(fun) {
-    if (cachedSetTimeout === setTimeout) {
-        //normal enviroments in sane situations
-        return setTimeout(fun, 0);
-    }
-    // if setTimeout wasn't available but was latter defined
-    if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) {
-        cachedSetTimeout = setTimeout;
-        return setTimeout(fun, 0);
-    }
-    try {
-        // when when somebody has screwed with setTimeout but no I.E. maddness
-        return cachedSetTimeout(fun, 0);
-    } catch(e){
-        try {
-            // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally
-            return cachedSetTimeout.call(null, fun, 0);
-        } catch(e){
-            // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error
-            return cachedSetTimeout.call(this, fun, 0);
-        }
-    }
-
-
-}
-function runClearTimeout(marker) {
-    if (cachedClearTimeout === clearTimeout) {
-        //normal enviroments in sane situations
-        return clearTimeout(marker);
-    }
-    // if clearTimeout wasn't available but was latter defined
-    if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) {
-        cachedClearTimeout = clearTimeout;
-        return clearTimeout(marker);
-    }
-    try {
-        // when when somebody has screwed with setTimeout but no I.E. maddness
-        return cachedClearTimeout(marker);
-    } catch (e){
-        try {
-            // When we are in I.E. but the script has been evaled so I.E. doesn't  trust the global object when called normally
-            return cachedClearTimeout.call(null, marker);
-        } catch (e){
-            // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error.
-            // Some versions of I.E. have different rules for clearTimeout vs setTimeout
-            return cachedClearTimeout.call(this, marker);
-        }
-    }
-
-
-
-}
-var queue = [];
-var draining = false;
-var currentQueue;
-var queueIndex = -1;
-
-function cleanUpNextTick() {
-    if (!draining || !currentQueue) {
-        return;
-    }
-    draining = false;
-    if (currentQueue.length) {
-        queue = currentQueue.concat(queue);
-    } else {
-        queueIndex = -1;
-    }
-    if (queue.length) {
-        drainQueue();
-    }
-}
-
-function drainQueue() {
-    if (draining) {
-        return;
-    }
-    var timeout = runTimeout(cleanUpNextTick);
-    draining = true;
-
-    var len = queue.length;
-    while(len) {
-        currentQueue = queue;
-        queue = [];
-        while (++queueIndex < len) {
-            if (currentQueue) {
-                currentQueue[queueIndex].run();
-            }
-        }
-        queueIndex = -1;
-        len = queue.length;
-    }
-    currentQueue = null;
-    draining = false;
-    runClearTimeout(timeout);
-}
-
-process.nextTick = function (fun) {
-    var args = new Array(arguments.length - 1);
-    if (arguments.length > 1) {
-        for (var i = 1; i < arguments.length; i++) {
-            args[i - 1] = arguments[i];
-        }
-    }
-    queue.push(new Item(fun, args));
-    if (queue.length === 1 && !draining) {
-        runTimeout(drainQueue);
-    }
-};
-
-// v8 likes predictible objects
-function Item(fun, array) {
-    this.fun = fun;
-    this.array = array;
-}
-Item.prototype.run = function () {
-    this.fun.apply(null, this.array);
-};
-process.title = 'browser';
-process.browser = true;
-process.env = {};
-process.argv = [];
-process.version = ''; // empty string to avoid regexp issues
-process.versions = {};
-
-function noop() {}
-
-process.on = noop;
-process.addListener = noop;
-process.once = noop;
-process.off = noop;
-process.removeListener = noop;
-process.removeAllListeners = noop;
-process.emit = noop;
-process.prependListener = noop;
-process.prependOnceListener = noop;
-
-process.listeners = function (name) { return [] }
-
-process.binding = function (name) {
-    throw new Error('process.binding is not supported');
-};
-
-process.cwd = function () { return '/' };
-process.chdir = function (dir) {
-    throw new Error('process.chdir is not supported');
-};
-process.umask = function() { return 0; };
-
-
-/***/ }),
-
-/***/ "./node_modules/setimmediate/setImmediate.js":
-/*!***************************************************!*\
-  !*** ./node_modules/setimmediate/setImmediate.js ***!
-  \***************************************************/
-/*! no static exports found */
-/***/ (function(module, exports, __webpack_require__) {
-
-/* WEBPACK VAR INJECTION */(function(global, process) {(function (global, undefined) {
-    "use strict";
-
-    if (global.setImmediate) {
-        return;
-    }
-
-    var nextHandle = 1; // Spec says greater than zero
-    var tasksByHandle = {};
-    var currentlyRunningATask = false;
-    var doc = global.document;
-    var registerImmediate;
-
-    function setImmediate(callback) {
-      // Callback can either be a function or a string
-      if (typeof callback !== "function") {
-        callback = new Function("" + callback);
-      }
-      // Copy function arguments
-      var args = new Array(arguments.length - 1);
-      for (var i = 0; i < args.length; i++) {
-          args[i] = arguments[i + 1];
-      }
-      // Store and register the task
-      var task = { callback: callback, args: args };
-      tasksByHandle[nextHandle] = task;
-      registerImmediate(nextHandle);
-      return nextHandle++;
-    }
-
-    function clearImmediate(handle) {
-        delete tasksByHandle[handle];
-    }
-
-    function run(task) {
-        var callback = task.callback;
-        var args = task.args;
-        switch (args.length) {
-        case 0:
-            callback();
-            break;
-        case 1:
-            callback(args[0]);
-            break;
-        case 2:
-            callback(args[0], args[1]);
-            break;
-        case 3:
-            callback(args[0], args[1], args[2]);
-            break;
-        default:
-            callback.apply(undefined, args);
-            break;
-        }
-    }
-
-    function runIfPresent(handle) {
-        // From the spec: "Wait until any invocations of this algorithm started before this one have completed."
-        // So if we're currently running a task, we'll need to delay this invocation.
-        if (currentlyRunningATask) {
-            // Delay by doing a setTimeout. setImmediate was tried instead, but in Firefox 7 it generated a
-            // "too much recursion" error.
-            setTimeout(runIfPresent, 0, handle);
-        } else {
-            var task = tasksByHandle[handle];
-            if (task) {
-                currentlyRunningATask = true;
-                try {
-                    run(task);
-                } finally {
-                    clearImmediate(handle);
-                    currentlyRunningATask = false;
-                }
-            }
-        }
-    }
-
-    function installNextTickImplementation() {
-        registerImmediate = function(handle) {
-            process.nextTick(function () { runIfPresent(handle); });
-        };
-    }
-
-    function canUsePostMessage() {
-        // The test against `importScripts` prevents this implementation from being installed inside a web worker,
-        // where `global.postMessage` means something completely different and can't be used for this purpose.
-        if (global.postMessage && !global.importScripts) {
-            var postMessageIsAsynchronous = true;
-            var oldOnMessage = global.onmessage;
-            global.onmessage = function() {
-                postMessageIsAsynchronous = false;
-            };
-            global.postMessage("", "*");
-            global.onmessage = oldOnMessage;
-            return postMessageIsAsynchronous;
-        }
-    }
-
-    function installPostMessageImplementation() {
-        // Installs an event handler on `global` for the `message` event: see
-        // * https://developer.mozilla.org/en/DOM/window.postMessage
-        // * http://www.whatwg.org/specs/web-apps/current-work/multipage/comms.html#crossDocumentMessages
-
-        var messagePrefix = "setImmediate$" + Math.random() + "$";
-        var onGlobalMessage = function(event) {
-            if (event.source === global &&
-                typeof event.data === "string" &&
-                event.data.indexOf(messagePrefix) === 0) {
-                runIfPresent(+event.data.slice(messagePrefix.length));
-            }
-        };
-
-        if (global.addEventListener) {
-            global.addEventListener("message", onGlobalMessage, false);
-        } else {
-            global.attachEvent("onmessage", onGlobalMessage);
-        }
-
-        registerImmediate = function(handle) {
-            global.postMessage(messagePrefix + handle, "*");
-        };
-    }
-
-    function installMessageChannelImplementation() {
-        var channel = new MessageChannel();
-        channel.port1.onmessage = function(event) {
-            var handle = event.data;
-            runIfPresent(handle);
-        };
-
-        registerImmediate = function(handle) {
-            channel.port2.postMessage(handle);
-        };
-    }
-
-    function installReadyStateChangeImplementation() {
-        var html = doc.documentElement;
-        registerImmediate = function(handle) {
-            // Create a <script> element; its readystatechange event will be fired asynchronously once it is inserted
-            // into the document. Do so, thus queuing up the task. Remember to clean up once it's been called.
-            var script = doc.createElement("script");
-            script.onreadystatechange = function () {
-                runIfPresent(handle);
-                script.onreadystatechange = null;
-                html.removeChild(script);
-                script = null;
-            };
-            html.appendChild(script);
-        };
-    }
-
-    function installSetTimeoutImplementation() {
-        registerImmediate = function(handle) {
-            setTimeout(runIfPresent, 0, handle);
-        };
-    }
-
-    // If supported, we should attach to the prototype of global, since that is where setTimeout et al. live.
-    var attachTo = Object.getPrototypeOf && Object.getPrototypeOf(global);
-    attachTo = attachTo && attachTo.setTimeout ? attachTo : global;
-
-    // Don't get fooled by e.g. browserify environments.
-    if ({}.toString.call(global.process) === "[object process]") {
-        // For Node.js before 0.9
-        installNextTickImplementation();
-
-    } else if (canUsePostMessage()) {
-        // For non-IE10 modern browsers
-        installPostMessageImplementation();
-
-    } else if (global.MessageChannel) {
-        // For web workers, where supported
-        installMessageChannelImplementation();
-
-    } else if (doc && "onreadystatechange" in doc.createElement("script")) {
-        // For IE 6–8
-        installReadyStateChangeImplementation();
-
-    } else {
-        // For older browsers
-        installSetTimeoutImplementation();
-    }
-
-    attachTo.setImmediate = setImmediate;
-    attachTo.clearImmediate = clearImmediate;
-}(typeof self === "undefined" ? typeof global === "undefined" ? this : global : self));
-
-/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../webpack/buildin/global.js */ "./node_modules/webpack/buildin/global.js"), __webpack_require__(/*! ./../process/browser.js */ "./node_modules/process/browser.js")))
-
-/***/ }),
-
 /***/ "./node_modules/signature_pad/dist/signature_pad.mjs":
 /*!***********************************************************!*\
   !*** ./node_modules/signature_pad/dist/signature_pad.mjs ***!
@@ -1107,112 +714,6 @@ SignaturePad.prototype.toData = function () {
 /* harmony default export */ __webpack_exports__["default"] = (SignaturePad);
 
 
-/***/ }),
-
-/***/ "./node_modules/timers-browserify/main.js":
-/*!************************************************!*\
-  !*** ./node_modules/timers-browserify/main.js ***!
-  \************************************************/
-/*! no static exports found */
-/***/ (function(module, exports, __webpack_require__) {
-
-/* WEBPACK VAR INJECTION */(function(global) {var scope = (typeof global !== "undefined" && global) ||
-            (typeof self !== "undefined" && self) ||
-            window;
-var apply = Function.prototype.apply;
-
-// DOM APIs, for completeness
-
-exports.setTimeout = function() {
-  return new Timeout(apply.call(setTimeout, scope, arguments), clearTimeout);
-};
-exports.setInterval = function() {
-  return new Timeout(apply.call(setInterval, scope, arguments), clearInterval);
-};
-exports.clearTimeout =
-exports.clearInterval = function(timeout) {
-  if (timeout) {
-    timeout.close();
-  }
-};
-
-function Timeout(id, clearFn) {
-  this._id = id;
-  this._clearFn = clearFn;
-}
-Timeout.prototype.unref = Timeout.prototype.ref = function() {};
-Timeout.prototype.close = function() {
-  this._clearFn.call(scope, this._id);
-};
-
-// Does not start the time, just sets up the members needed.
-exports.enroll = function(item, msecs) {
-  clearTimeout(item._idleTimeoutId);
-  item._idleTimeout = msecs;
-};
-
-exports.unenroll = function(item) {
-  clearTimeout(item._idleTimeoutId);
-  item._idleTimeout = -1;
-};
-
-exports._unrefActive = exports.active = function(item) {
-  clearTimeout(item._idleTimeoutId);
-
-  var msecs = item._idleTimeout;
-  if (msecs >= 0) {
-    item._idleTimeoutId = setTimeout(function onTimeout() {
-      if (item._onTimeout)
-        item._onTimeout();
-    }, msecs);
-  }
-};
-
-// setimmediate attaches itself to the global object
-__webpack_require__(/*! setimmediate */ "./node_modules/setimmediate/setImmediate.js");
-// On some exotic environments, it's not clear which object `setimmediate` was
-// able to install onto.  Search each possibility in the same order as the
-// `setimmediate` library.
-exports.setImmediate = (typeof self !== "undefined" && self.setImmediate) ||
-                       (typeof global !== "undefined" && global.setImmediate) ||
-                       (this && this.setImmediate);
-exports.clearImmediate = (typeof self !== "undefined" && self.clearImmediate) ||
-                         (typeof global !== "undefined" && global.clearImmediate) ||
-                         (this && this.clearImmediate);
-
-/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../webpack/buildin/global.js */ "./node_modules/webpack/buildin/global.js")))
-
-/***/ }),
-
-/***/ "./node_modules/webpack/buildin/global.js":
-/*!***********************************!*\
-  !*** (webpack)/buildin/global.js ***!
-  \***********************************/
-/*! no static exports found */
-/***/ (function(module, exports) {
-
-var g;
-
-// This works in non-strict mode
-g = (function() {
-	return this;
-})();
-
-try {
-	// This works if eval is allowed (see CSP)
-	g = g || new Function("return this")();
-} catch (e) {
-	// This works if the window reference is available
-	if (typeof window === "object") g = window;
-}
-
-// g can still be undefined, but nothing to do about it...
-// We return undefined, instead of nothing here, so it's
-// easier to handle this case. if(!global) { ...}
-
-module.exports = g;
-
-
 /***/ }),
 
 /***/ "./src/actions/action.ts":
@@ -6608,12 +6109,16 @@ var DragDropPanelHelperV1 = /** @class */ (function () {
         var destRow = this.dragDropFindRow(dest);
         if (!destRow)
             return true;
-        if (_settings__WEBPACK_IMPORTED_MODULE_1__["settings"].supportCreatorV2 && this.panel.isDesignMode) {
-            if (destRow.elements.length > 1)
-                return this.dragDropAddTargetToExistingRow(dragDropInfo, destRow, prevRow);
-            else
-                return this.dragDropAddTargetToNewRow(dragDropInfo, destRow, prevRow);
-        }
+        // if (settings.supportCreatorV2 && this.panel.isDesignMode) {
+        //   if (destRow.elements.length > 1)
+        //     return this.dragDropAddTargetToExistingRow(
+        //       dragDropInfo,
+        //       destRow,
+        //       prevRow
+        //     );
+        //   else
+        //     return this.dragDropAddTargetToNewRow(dragDropInfo, destRow, prevRow);
+        // }
         if (!dragDropInfo.target.startWithNewLine)
             return this.dragDropAddTargetToExistingRow(dragDropInfo, destRow, prevRow);
         return this.dragDropAddTargetToNewRow(dragDropInfo, destRow, prevRow);
@@ -6750,13 +6255,13 @@ var DragDropChoices = /** @class */ (function (_super) {
         _this.doDragOver = function () {
             if (_this.parentElement.getType() === "imagepicker")
                 return;
-            var node = _this.draggedElementShortcut.querySelector(".svc-item-value-controls__button");
+            var node = _this.domAdapter.draggedElementShortcut.querySelector(".svc-item-value-controls__button");
             node.style.cursor = "grabbing";
         };
         _this.doBanDropHere = function () {
             if (_this.parentElement.getType() === "imagepicker")
                 return;
-            var node = _this.draggedElementShortcut.querySelector(".svc-item-value-controls__button");
+            var node = _this.domAdapter.draggedElementShortcut.querySelector(".svc-item-value-controls__button");
             node.style.cursor = "not-allowed";
         };
         return _this;
@@ -6821,7 +6326,7 @@ var DragDropChoices = /** @class */ (function (_super) {
             return parent.rankingChoices;
         return parent.visibleChoices;
     };
-    DragDropChoices.prototype.isDropTargetValid = function (dropTarget) {
+    DragDropChoices.prototype.isDropTargetValid = function (dropTarget, dropTargetNode) {
         var choices = this.getVisibleChoices();
         if (this.parentElement.getType() !== "imagepicker") {
             var dropTargetIndex = choices.indexOf(this.dropTarget);
@@ -6882,12 +6387,14 @@ var DragDropChoices = /** @class */ (function (_super) {
         choices.splice(newIndex, 0, this.draggedElement);
         return this.parentElement;
     };
-    DragDropChoices.prototype.doClear = function () {
-        this.updateVisibleChoices();
+    DragDropChoices.prototype.clear = function () {
+        if (!!this.parentElement) {
+            this.updateVisibleChoices(this.parentElement);
+        }
+        _super.prototype.clear.call(this);
     };
-    DragDropChoices.prototype.updateVisibleChoices = function () {
-        var parent = this.parentElement;
-        this.parentElement.getType() === "ranking" ?
+    DragDropChoices.prototype.updateVisibleChoices = function (parent) {
+        parent.getType() === "ranking" ?
             parent.updateRankingChoices() :
             parent["updateVisibleChoices"]();
     };
@@ -6909,66 +6416,208 @@ var DragDropChoices = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DragDropCore", function() { return DragDropCore; });
 /* harmony import */ var _base__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../base */ "./src/base.ts");
-/* harmony import */ var _jsonobject__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../jsonobject */ "./src/jsonobject.ts");
-/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils/utils */ "./src/utils/utils.ts");
-/* harmony import */ var _utils_devices__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils/devices */ "./src/utils/devices.ts");
-/* harmony import */ var _settings__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../settings */ "./src/settings.ts");
-var __extends = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
+/* harmony import */ var _dom_adapter__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./dom-adapter */ "./src/dragdrop/dom-adapter.ts");
+
+
+var DragDropCore = /** @class */ (function () {
+    function DragDropCore(surveyValue, creator, longTap, domAdapter) {
+        var _this = this;
+        this.surveyValue = surveyValue;
+        this.creator = creator;
+        this._isBottom = null;
+        this.onGhostPositionChanged = new _base__WEBPACK_IMPORTED_MODULE_0__["EventBase"]();
+        this.onDragStart = new _base__WEBPACK_IMPORTED_MODULE_0__["EventBase"]();
+        this.onDragEnd = new _base__WEBPACK_IMPORTED_MODULE_0__["EventBase"]();
+        this.onBeforeDrop = this.onDragStart;
+        this.onAfterDrop = this.onDragEnd;
+        this.draggedElement = null;
+        this.dropTarget = null;
+        this.prevDropTarget = null;
+        this.allowDropHere = false;
+        this.banDropHere = function () {
+            _this.allowDropHere = false;
+            _this.doBanDropHere();
+            _this.dropTarget = null;
+            _this.domAdapter.draggedElementShortcut.style.cursor = "not-allowed";
+            _this.isBottom = null;
+        };
+        this.doBanDropHere = function () { };
+        this.domAdapter = domAdapter || new _dom_adapter__WEBPACK_IMPORTED_MODULE_1__["DragDropDOMAdapter"](this, longTap);
+    }
+    Object.defineProperty(DragDropCore.prototype, "isBottom", {
+        get: function () {
+            return !!this._isBottom;
+        },
+        set: function (val) {
+            this._isBottom = val;
+            this.ghostPositionChanged();
+        },
+        enumerable: false,
+        configurable: true
+    });
+    DragDropCore.prototype.ghostPositionChanged = function () {
+        this.onGhostPositionChanged.fire({}, {});
     };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    Object.defineProperty(DragDropCore.prototype, "dropTargetDataAttributeName", {
+        get: function () {
+            return "[data-sv-drop-target-" + this.draggedElementType + "]";
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(DragDropCore.prototype, "survey", {
+        get: function () {
+            return this.surveyValue || this.creator.survey;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    DragDropCore.prototype.startDrag = function (event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode) {
+        if (preventSaveTargetNode === void 0) { preventSaveTargetNode = false; }
+        this.domAdapter.startDrag(event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode);
     };
-})();
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+    DragDropCore.prototype.dragInit = function (event, draggedElement, parentElement, draggedElementNode) {
+        this.draggedElement = draggedElement;
+        this.parentElement = parentElement;
+        var shortcutText = this.getShortcutText(this.draggedElement);
+        this.domAdapter.draggedElementShortcut = this.createDraggedElementShortcut(shortcutText, draggedElementNode, event);
+        this.onStartDrag();
+    };
+    DragDropCore.prototype.onStartDrag = function () {
+    };
+    DragDropCore.prototype.isDropTargetDoesntChanged = function (newIsBottom) {
+        return (this.dropTarget === this.prevDropTarget && newIsBottom === this.isBottom);
+    };
+    DragDropCore.prototype.getShortcutText = function (draggedElement) {
+        return draggedElement.shortcutText;
+    };
+    DragDropCore.prototype.createDraggedElementShortcut = function (text, draggedElementNode, event) {
+        var draggedElementShortcut = document.createElement("div");
+        draggedElementShortcut.innerText = text;
+        draggedElementShortcut.className = this.getDraggedElementClass();
+        return draggedElementShortcut;
+    };
+    DragDropCore.prototype.getDraggedElementClass = function () {
+        return "sv-dragged-element-shortcut";
+    };
+    DragDropCore.prototype.doDragOver = function () { };
+    DragDropCore.prototype.afterDragOver = function (dropTargetNode) { };
+    DragDropCore.prototype.findDropTargetNodeFromPoint = function (clientX, clientY) {
+        this.domAdapter.draggedElementShortcut.hidden = true;
+        var dragOverNode = document.elementFromPoint(clientX, clientY);
+        this.domAdapter.draggedElementShortcut.hidden = false;
+        if (!dragOverNode)
+            return null;
+        return this.findDropTargetNodeByDragOverNode(dragOverNode);
+    };
+    DragDropCore.prototype.getDataAttributeValueByNode = function (node) {
+        var _this = this;
+        var datasetName = "svDropTarget";
+        var words = this.draggedElementType.split("-");
+        words.forEach(function (word) {
+            datasetName += _this.capitalizeFirstLetter(word);
+        });
+        return node.dataset[datasetName];
+    };
+    DragDropCore.prototype.getDropTargetByNode = function (dropTargetNode, event) {
+        var dataAttributeValue = this.getDataAttributeValueByNode(dropTargetNode);
+        return this.getDropTargetByDataAttributeValue(dataAttributeValue, dropTargetNode, event);
+    };
+    DragDropCore.prototype.capitalizeFirstLetter = function (string) {
+        return string.charAt(0).toUpperCase() + string.slice(1);
+    };
+    DragDropCore.prototype.calculateVerticalMiddleOfHTMLElement = function (HTMLElement) {
+        var rect = HTMLElement.getBoundingClientRect();
+        return rect.y + rect.height / 2;
+    };
+    DragDropCore.prototype.calculateHorizontalMiddleOfHTMLElement = function (HTMLElement) {
+        var rect = HTMLElement.getBoundingClientRect();
+        return rect.x + rect.width / 2;
+    };
+    DragDropCore.prototype.calculateIsBottom = function (clientY, dropTargetNode) {
+        return false;
+    };
+    DragDropCore.prototype.findDropTargetNodeByDragOverNode = function (dragOverNode) {
+        var dropTargetNode = dragOverNode.closest(this.dropTargetDataAttributeName);
+        return dropTargetNode;
+    };
+    DragDropCore.prototype.dragOver = function (event) {
+        var dropTargetNode = this.findDropTargetNodeFromPoint(event.clientX, event.clientY);
+        if (!dropTargetNode) {
+            this.banDropHere();
+            return;
+        }
+        this.dropTarget = this.getDropTargetByNode(dropTargetNode, event);
+        var isDropTargetValid = this.isDropTargetValid(this.dropTarget, dropTargetNode);
+        this.doDragOver();
+        if (!isDropTargetValid) {
+            this.banDropHere();
+            return;
+        }
+        var isBottom = this.calculateIsBottom(event.clientY, dropTargetNode);
+        this.allowDropHere = true;
+        if (this.isDropTargetDoesntChanged(isBottom))
+            return;
+        this.isBottom = null; //TODO need for property change trigger with guarantee but it would be better not to watch on isBottom property but have some event like onValidTargetDragOver
+        this.isBottom = isBottom;
+        this.afterDragOver(dropTargetNode);
+        this.prevDropTarget = this.dropTarget;
+    };
+    DragDropCore.prototype.drop = function () {
+        if (this.allowDropHere) {
+            var fromElement = this.draggedElement.parent;
+            this.onDragStart.fire(this, { fromElement: fromElement, draggedElement: this.draggedElement });
+            var newElement = this.doDrop();
+            this.onDragEnd.fire(this, { fromElement: fromElement, draggedElement: newElement, toElement: this.dropTarget });
+        }
+    };
+    DragDropCore.prototype.clear = function () {
+        this.dropTarget = null;
+        this.draggedElement = null;
+        this.isBottom = null;
+        this.parentElement = null;
+    };
+    return DragDropCore;
+}());
 
 
 
+/***/ }),
+
+/***/ "./src/dragdrop/dom-adapter.ts":
+/*!*************************************!*\
+  !*** ./src/dragdrop/dom-adapter.ts ***!
+  \*************************************/
+/*! exports provided: DragDropDOMAdapter */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DragDropDOMAdapter", function() { return DragDropDOMAdapter; });
+/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/utils */ "./src/utils/utils.ts");
+/* harmony import */ var _utils_devices__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils/devices */ "./src/utils/devices.ts");
+/* harmony import */ var _settings__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../settings */ "./src/settings.ts");
+
 
 
 // WebKit requires cancelable `touchmove` events to be added as early as possible
 // see https://bugs.webkit.org/show_bug.cgi?id=184250
 if (typeof window !== "undefined") {
     window.addEventListener("touchmove", function (event) {
-        if (!DragDropCore.PreventScrolling) {
+        if (!DragDropDOMAdapter.PreventScrolling) {
             return;
         }
         // Prevent scrolling
         event.preventDefault();
     }, { passive: false });
 }
-var DragDropCore = /** @class */ (function (_super) {
-    __extends(DragDropCore, _super);
-    function DragDropCore(surveyValue, creator, longTap) {
-        var _this = _super.call(this) || this;
-        _this.surveyValue = surveyValue;
-        _this.creator = creator;
-        _this.longTap = longTap;
-        _this.onGhostPositionChanged = new _base__WEBPACK_IMPORTED_MODULE_0__["EventBase"]();
-        _this.onDragStart = new _base__WEBPACK_IMPORTED_MODULE_0__["EventBase"]();
-        _this.onDragEnd = new _base__WEBPACK_IMPORTED_MODULE_0__["EventBase"]();
-        _this.onBeforeDrop = _this.onDragStart;
-        _this.onAfterDrop = _this.onDragEnd;
-        _this.draggedElement = null;
-        _this.dropTarget = null;
-        _this.prevDropTarget = null;
-        _this.draggedElementShortcut = null;
-        _this.scrollIntervalId = null;
-        _this.allowDropHere = false;
-        _this.stopLongTapIfMoveEnough = function (pointerMoveEvent) {
+var DragDropDOMAdapter = /** @class */ (function () {
+    function DragDropDOMAdapter(dd, longTap) {
+        var _this = this;
+        this.dd = dd;
+        this.longTap = longTap;
+        this.scrollIntervalId = null;
+        this.stopLongTapIfMoveEnough = function (pointerMoveEvent) {
             pointerMoveEvent.preventDefault();
             _this.currentX = pointerMoveEvent.pageX;
             _this.currentY = pointerMoveEvent.pageY;
@@ -6979,119 +6628,69 @@ var DragDropCore = /** @class */ (function (_super) {
             document.body.style.setProperty("-webkit-user-select", "");
             _this.stopLongTap();
         };
-        _this.stopLongTap = function (e) {
+        this.stopLongTap = function (e) {
             clearTimeout(_this.timeoutID);
             _this.timeoutID = null;
             document.removeEventListener("pointerup", _this.stopLongTap);
             document.removeEventListener("pointermove", _this.stopLongTapIfMoveEnough);
         };
-        _this.onContextMenu = function (event) {
-            event.preventDefault();
-            event.stopPropagation();
-        };
-        _this.dragOver = function (event) {
-            _this.moveShortcutElement(event);
-            _this.draggedElementShortcut.style.cursor = "grabbing";
-            var dropTargetNode = _this.findDropTargetNodeFromPoint(event.clientX, event.clientY);
-            if (!dropTargetNode) {
-                _this.banDropHere();
-                return;
-            }
-            _this.dropTarget = _this.getDropTargetByNode(dropTargetNode, event);
-            var isDropTargetValid = _this.isDropTargetValid(_this.dropTarget, dropTargetNode);
-            _this.doDragOver(dropTargetNode, event);
-            if (!isDropTargetValid) {
-                _this.banDropHere();
-                return;
-            }
-            var isBottom = _this.calculateIsBottom(event.clientY, dropTargetNode);
-            _this.allowDropHere = true;
-            if (_this.isDropTargetDoesntChanged(isBottom))
-                return;
-            _this.isBottom = null; //TODO need for property change trigger with guarantee but it would be better not to watch on isBottom property but have some event like onValidTargetDragOver
-            _this.isBottom = isBottom;
-            _this.afterDragOver(dropTargetNode, event);
-            _this.prevDropTarget = _this.dropTarget;
-        };
-        _this.drop = function () {
-            if (_this.allowDropHere) {
-                var fromElement = _this.draggedElement.parent;
-                _this.onDragStart.fire(_this, { fromElement: fromElement, draggedElement: _this.draggedElement });
-                var newElement = _this.doDrop();
-                _this.onDragEnd.fire(_this, { fromElement: fromElement, draggedElement: newElement, toElement: _this.dropTarget });
-            }
+        this.handlePointerCancel = function (event) {
             _this.clear();
         };
-        _this.handlePointerCancel = function (event) {
-            _this.clear();
-        };
-        _this.handleEscapeButton = function (event) {
+        this.handleEscapeButton = function (event) {
             if (event.keyCode == 27) {
                 _this.clear();
             }
         };
-        _this.banDropHere = function () {
-            _this.allowDropHere = false;
-            _this.doBanDropHere();
-            _this.dropTarget = null;
-            _this.draggedElementShortcut.style.cursor = "not-allowed";
-            _this.isBottom = null;
+        this.onContextMenu = function (event) {
+            event.preventDefault();
+            event.stopPropagation();
+        };
+        this.dragOver = function (event) {
+            _this.moveShortcutElement(event);
+            _this.draggedElementShortcut.style.cursor = "grabbing";
+            _this.dd.dragOver(event);
         };
-        _this.doBanDropHere = function () { };
-        _this.clear = function () {
+        this.clear = function () {
             cancelAnimationFrame(_this.scrollIntervalId);
             document.removeEventListener("pointermove", _this.dragOver);
             document.removeEventListener("pointercancel", _this.handlePointerCancel);
             document.removeEventListener("keydown", _this.handleEscapeButton);
             document.removeEventListener("pointerup", _this.drop);
             _this.draggedElementShortcut.removeEventListener("pointerup", _this.drop);
-            if (_utils_devices__WEBPACK_IMPORTED_MODULE_3__["IsTouch"]) {
+            if (_utils_devices__WEBPACK_IMPORTED_MODULE_1__["IsTouch"]) {
                 _this.draggedElementShortcut.removeEventListener("contextmenu", _this.onContextMenu);
             }
-            _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.rootElement.removeChild(_this.draggedElementShortcut);
-            _this.doClear();
-            _this.dropTarget = null;
+            _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.rootElement.removeChild(_this.draggedElementShortcut);
+            _this.dd.clear();
             _this.draggedElementShortcut = null;
-            _this.draggedElement = null;
-            _this.isBottom = null;
-            _this.parentElement = null;
             _this.scrollIntervalId = null;
-            if (_utils_devices__WEBPACK_IMPORTED_MODULE_3__["IsTouch"]) {
-                _this.savedTargetNode && _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.rootElement.removeChild(_this.savedTargetNode);
-                DragDropCore.PreventScrolling = false;
+            if (_utils_devices__WEBPACK_IMPORTED_MODULE_1__["IsTouch"]) {
+                _this.savedTargetNode && _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.rootElement.removeChild(_this.savedTargetNode);
+                DragDropDOMAdapter.PreventScrolling = false;
             }
             document.body.style.setProperty("touch-action", "");
             document.body.style.setProperty("user-select", "");
             document.body.style.setProperty("-webkit-user-select", "");
         };
-        return _this;
+        this.drop = function () {
+            _this.dd.drop();
+            _this.clear();
+        };
+        this.draggedElementShortcut = null;
     }
-    DragDropCore.prototype.ghostPositionChanged = function () {
-        this.onGhostPositionChanged.fire({}, {});
-    };
-    Object.defineProperty(DragDropCore.prototype, "dropTargetDataAttributeName", {
-        get: function () {
-            return "[data-sv-drop-target-" + this.draggedElementType + "]";
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(DragDropCore.prototype, "survey", {
+    Object.defineProperty(DragDropDOMAdapter.prototype, "isMicroMovement", {
+        // see https://stackoverflow.com/questions/6042202/how-to-distinguish-mouse-click-and-drag
         get: function () {
-            return this.surveyValue || this.creator.survey;
+            var delta = 5;
+            var diffX = Math.abs(this.currentX - this.startX);
+            var diffY = Math.abs(this.currentY - this.startY);
+            return diffX < delta && diffY < delta;
         },
         enumerable: false,
         configurable: true
     });
-    DragDropCore.prototype.startDrag = function (event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode) {
-        if (preventSaveTargetNode === void 0) { preventSaveTargetNode = false; }
-        if (_utils_devices__WEBPACK_IMPORTED_MODULE_3__["IsTouch"]) {
-            this.startLongTapProcessing(event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode);
-            return;
-        }
-        this.doStartDrag(event, draggedElement, parentElement, draggedElementNode);
-    };
-    DragDropCore.prototype.startLongTapProcessing = function (event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode) {
+    DragDropDOMAdapter.prototype.startLongTapProcessing = function (event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode) {
         var _this = this;
         if (preventSaveTargetNode === void 0) { preventSaveTargetNode = false; }
         this.startX = event.pageX;
@@ -7105,75 +6704,14 @@ var DragDropCore = /** @class */ (function (_super) {
                 _this.savedTargetNode = event.target;
                 _this.savedTargetNode.style.cssText =
                     "\n          position: absolute;\n          height: 1px!important;\n          width: 1px!important;\n          overflow: hidden;\n          clip: rect(1px 1px 1px 1px);\n          clip: rect(1px, 1px, 1px, 1px);\n        ";
-                _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.rootElement.appendChild(_this.savedTargetNode);
+                _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.rootElement.appendChild(_this.savedTargetNode);
             }
             _this.stopLongTap();
         }, this.longTap ? 500 : 0);
         document.addEventListener("pointerup", this.stopLongTap);
         document.addEventListener("pointermove", this.stopLongTapIfMoveEnough);
     };
-    Object.defineProperty(DragDropCore.prototype, "isMicroMovement", {
-        // see https://stackoverflow.com/questions/6042202/how-to-distinguish-mouse-click-and-drag
-        get: function () {
-            var delta = 5;
-            var diffX = Math.abs(this.currentX - this.startX);
-            var diffY = Math.abs(this.currentY - this.startY);
-            return diffX < delta && diffY < delta;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    // EO long tap
-    DragDropCore.prototype.doStartDrag = function (event, draggedElement, parentElement, draggedElementNode) {
-        if (_utils_devices__WEBPACK_IMPORTED_MODULE_3__["IsTouch"]) {
-            DragDropCore.PreventScrolling = true;
-        }
-        if (event.which === 3)
-            return; //right mouse btn
-        this.draggedElement = draggedElement;
-        this.parentElement = parentElement;
-        this.onStartDrag();
-        var shortcutText = this.getShortcutText(this.draggedElement);
-        this.draggedElementShortcut = this.createDraggedElementShortcut(shortcutText, draggedElementNode, event);
-        document.body.append(this.draggedElementShortcut);
-        this.moveShortcutElement(event);
-        document.addEventListener("pointermove", this.dragOver);
-        document.addEventListener("pointercancel", this.handlePointerCancel);
-        document.addEventListener("keydown", this.handleEscapeButton);
-        document.addEventListener("pointerup", this.drop);
-        if (!_utils_devices__WEBPACK_IMPORTED_MODULE_3__["IsTouch"]) {
-            this.draggedElementShortcut.addEventListener("pointerup", this.drop);
-        }
-        else {
-            this.draggedElementShortcut.addEventListener("contextmenu", this.onContextMenu);
-        }
-    };
-    DragDropCore.prototype.isDropTargetDoesntChanged = function (newIsBottom) {
-        return (this.dropTarget === this.prevDropTarget && newIsBottom === this.isBottom);
-    };
-    DragDropCore.prototype.onStartDrag = function () { };
-    DragDropCore.prototype.getShortcutText = function (draggedElement) {
-        return draggedElement.shortcutText;
-    };
-    DragDropCore.prototype.createDraggedElementShortcut = function (text, draggedElementNode, event) {
-        var draggedElementShortcut = document.createElement("div");
-        draggedElementShortcut.innerText = text;
-        draggedElementShortcut.className = this.getDraggedElementClass();
-        return draggedElementShortcut;
-    };
-    DragDropCore.prototype.getDraggedElementClass = function () {
-        return "sv-dragged-element-shortcut";
-    };
-    DragDropCore.prototype.doDragOver = function (dropTargetNode, event) { };
-    DragDropCore.prototype.afterDragOver = function (dropTargetNode, event) { };
-    DragDropCore.prototype.getGhostPosition = function (item) {
-        if (this.dropTarget !== item)
-            return null;
-        if (this.isBottom)
-            return "bottom";
-        return "top";
-    };
-    DragDropCore.prototype.moveShortcutElement = function (event) {
+    DragDropDOMAdapter.prototype.moveShortcutElement = function (event) {
         this.doScroll(event.clientY, event.clientX);
         var shortcutHeight = this.draggedElementShortcut.offsetHeight;
         var shortcutWidth = this.draggedElementShortcut.offsetWidth;
@@ -7184,8 +6722,8 @@ var DragDropCore = /** @class */ (function (_super) {
             shortcutXOffset = shortcutWidth / 2;
             shortcutYOffset = shortcutHeight / 2;
         }
-        var documentBottom = (Object(_utils_utils__WEBPACK_IMPORTED_MODULE_2__["isShadowDOM"])(_settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.root) ? _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.root.host : _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.root.documentElement).clientHeight;
-        var documentRight = (Object(_utils_utils__WEBPACK_IMPORTED_MODULE_2__["isShadowDOM"])(_settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.root) ? _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.root.host : _settings__WEBPACK_IMPORTED_MODULE_4__["settings"].environment.root.documentElement).clientWidth;
+        var documentBottom = (Object(_utils_utils__WEBPACK_IMPORTED_MODULE_0__["isShadowDOM"])(_settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.root) ? _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.root.host : _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.root.documentElement).clientHeight;
+        var documentRight = (Object(_utils_utils__WEBPACK_IMPORTED_MODULE_0__["isShadowDOM"])(_settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.root) ? _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.root.host : _settings__WEBPACK_IMPORTED_MODULE_2__["settings"].environment.root.documentElement).clientWidth;
         var shortcutBottomCoordinate = this.getShortcutBottomCoordinate(event.clientY, shortcutHeight, shortcutYOffset);
         var shortcutRightCoordinate = this.getShortcutRightCoordinate(event.clientX, shortcutWidth, shortcutXOffset);
         if (shortcutRightCoordinate >= documentRight) {
@@ -7229,20 +6767,20 @@ var DragDropCore = /** @class */ (function (_super) {
         this.draggedElementShortcut.style.top =
             event.pageY - shortcutYOffset + "px";
     };
-    DragDropCore.prototype.getShortcutBottomCoordinate = function (currentY, shortcutHeight, shortcutYOffset) {
+    DragDropDOMAdapter.prototype.getShortcutBottomCoordinate = function (currentY, shortcutHeight, shortcutYOffset) {
         return currentY + shortcutHeight - shortcutYOffset;
     };
-    DragDropCore.prototype.getShortcutRightCoordinate = function (currentX, shortcutWidth, shortcutXOffset) {
+    DragDropDOMAdapter.prototype.getShortcutRightCoordinate = function (currentX, shortcutWidth, shortcutXOffset) {
         return currentX + shortcutWidth - shortcutXOffset;
     };
-    DragDropCore.prototype.doScroll = function (clientY, clientX) {
+    DragDropDOMAdapter.prototype.doScroll = function (clientY, clientX) {
         var _this = this;
         cancelAnimationFrame(this.scrollIntervalId);
         var startScrollBoundary = 50;
         this.draggedElementShortcut.hidden = true;
         var dragOverNode = document.elementFromPoint(clientX, clientY);
         this.draggedElementShortcut.hidden = false;
-        var scrollableParentNode = Object(_utils_utils__WEBPACK_IMPORTED_MODULE_2__["findScrollableParent"])(dragOverNode);
+        var scrollableParentNode = Object(_utils_utils__WEBPACK_IMPORTED_MODULE_0__["findScrollableParent"])(dragOverNode);
         var top;
         var bottom;
         var left;
@@ -7276,54 +6814,37 @@ var DragDropCore = /** @class */ (function (_super) {
         };
         this.scrollIntervalId = requestAnimationFrame(repeat);
     };
-    DragDropCore.prototype.getDataAttributeValueByNode = function (node) {
-        var _this = this;
-        var datasetName = "svDropTarget";
-        var words = this.draggedElementType.split("-");
-        words.forEach(function (word) {
-            datasetName += _this.capitalizeFirstLetter(word);
-        });
-        return node.dataset[datasetName];
-    };
-    DragDropCore.prototype.getDropTargetByNode = function (dropTargetNode, event) {
-        var dataAttributeValue = this.getDataAttributeValueByNode(dropTargetNode);
-        return this.getDropTargetByDataAttributeValue(dataAttributeValue, dropTargetNode, event);
-    };
-    DragDropCore.prototype.capitalizeFirstLetter = function (string) {
-        return string.charAt(0).toUpperCase() + string.slice(1);
-    };
-    DragDropCore.prototype.calculateVerticalMiddleOfHTMLElement = function (HTMLElement) {
-        var rect = HTMLElement.getBoundingClientRect();
-        return rect.y + rect.height / 2;
-    };
-    DragDropCore.prototype.calculateHorizontalMiddleOfHTMLElement = function (HTMLElement) {
-        var rect = HTMLElement.getBoundingClientRect();
-        return rect.x + rect.width / 2;
-    };
-    DragDropCore.prototype.findDropTargetNodeFromPoint = function (clientX, clientY) {
-        this.draggedElementShortcut.hidden = true;
-        var dragOverNode = document.elementFromPoint(clientX, clientY);
-        this.draggedElementShortcut.hidden = false;
-        if (!dragOverNode)
-            return null;
-        return this.findDropTargetNodeByDragOverNode(dragOverNode);
+    DragDropDOMAdapter.prototype.doStartDrag = function (event, draggedElement, parentElement, draggedElementNode) {
+        if (_utils_devices__WEBPACK_IMPORTED_MODULE_1__["IsTouch"]) {
+            DragDropDOMAdapter.PreventScrolling = true;
+        }
+        if (event.which === 3)
+            return; //right mouse btn
+        this.dd.dragInit(event, draggedElement, parentElement, draggedElementNode);
+        document.body.append(this.draggedElementShortcut);
+        this.moveShortcutElement(event);
+        document.addEventListener("pointermove", this.dragOver);
+        document.addEventListener("pointercancel", this.handlePointerCancel);
+        document.addEventListener("keydown", this.handleEscapeButton);
+        document.addEventListener("pointerup", this.drop);
+        if (!_utils_devices__WEBPACK_IMPORTED_MODULE_1__["IsTouch"]) {
+            this.draggedElementShortcut.addEventListener("pointerup", this.drop);
+        }
+        else {
+            this.draggedElementShortcut.addEventListener("contextmenu", this.onContextMenu);
+        }
     };
-    DragDropCore.prototype.findDropTargetNodeByDragOverNode = function (dragOverNode) {
-        var dropTargetNode = dragOverNode.closest(this.dropTargetDataAttributeName);
-        return dropTargetNode;
+    DragDropDOMAdapter.prototype.startDrag = function (event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode) {
+        if (preventSaveTargetNode === void 0) { preventSaveTargetNode = false; }
+        if (_utils_devices__WEBPACK_IMPORTED_MODULE_1__["IsTouch"]) {
+            this.startLongTapProcessing(event, draggedElement, parentElement, draggedElementNode, preventSaveTargetNode);
+            return;
+        }
+        this.doStartDrag(event, draggedElement, parentElement, draggedElementNode);
     };
-    DragDropCore.prototype.doClear = function () { };
-    DragDropCore.PreventScrolling = false;
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({
-            defaultValue: null,
-            onSet: function (val, target) {
-                target.ghostPositionChanged();
-            },
-        })
-    ], DragDropCore.prototype, "isBottom", void 0);
-    return DragDropCore;
-}(_base__WEBPACK_IMPORTED_MODULE_0__["Base"]));
+    DragDropDOMAdapter.PreventScrolling = false;
+    return DragDropDOMAdapter;
+}());
 
 
 
@@ -7381,18 +6902,20 @@ var DragDropMatrixRows = /** @class */ (function (_super) {
         // draggedElementShortcut.innerText = text;
         draggedElementShortcut.style.cssText = " \n          cursor: grabbing;\n          position: absolute;\n          z-index: 1000;\n          font-family: var(--font-family, $font-family);\n        ";
         var isDeepClone = true;
-        var row = (draggedElementNode
-            .closest("[data-sv-drop-target-matrix-row]"));
-        var clone = (row.cloneNode(isDeepClone));
-        clone.style.cssText = "\n      box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1), 0px 2px 6px rgba(0, 0, 0, 0.1);\n      background-color: white;\n      display: flex;\n      flex-grow: 0;\n      flex-shrink: 0;\n      align-items: center;\n      line-height: 0;\n      width: " + row.offsetWidth + "px;\n    ";
-        clone.classList.remove("sv-matrix__drag-drop--moveup");
-        clone.classList.remove("sv-matrix__drag-drop--movedown");
-        this.draggedElement.isDragDropMoveDown = false;
-        this.draggedElement.isDragDropMoveUp = false;
-        draggedElementShortcut.appendChild(clone);
-        var rect = draggedElementNode.getBoundingClientRect();
-        draggedElementShortcut.shortcutXOffset = event.clientX - rect.x;
-        draggedElementShortcut.shortcutYOffset = event.clientY - rect.y;
+        if (!!draggedElementNode) {
+            var row = (draggedElementNode
+                .closest("[data-sv-drop-target-matrix-row]"));
+            var clone = (row.cloneNode(isDeepClone));
+            clone.style.cssText = "\n        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1), 0px 2px 6px rgba(0, 0, 0, 0.1);\n        background-color: white;\n        display: flex;\n        flex-grow: 0;\n        flex-shrink: 0;\n        align-items: center;\n        line-height: 0;\n        width: " + row.offsetWidth + "px;\n      ";
+            clone.classList.remove("sv-matrix__drag-drop--moveup");
+            clone.classList.remove("sv-matrix__drag-drop--movedown");
+            this.draggedElement.isDragDropMoveDown = false;
+            this.draggedElement.isDragDropMoveUp = false;
+            draggedElementShortcut.appendChild(clone);
+            var rect = draggedElementNode.getBoundingClientRect();
+            draggedElementShortcut.shortcutXOffset = event.clientX - rect.x;
+            draggedElementShortcut.shortcutYOffset = event.clientY - rect.y;
+        }
         //this.isBottom = null;
         var renderedRows = this.parentElement.renderedTable.rows;
         renderedRows.forEach(function (renderedRow, index) {
@@ -7421,7 +6944,7 @@ var DragDropMatrixRows = /** @class */ (function (_super) {
         dropTargetRenderedRow = matrix.renderedTable.rows.filter(function (renderedRow) { return renderedRow.row.id === dataAttributeValue; })[0];
         return dropTargetRenderedRow.row;
     };
-    DragDropMatrixRows.prototype.isDropTargetValid = function (dropTarget) {
+    DragDropMatrixRows.prototype.isDropTargetValid = function (dropTarget, dropTargetNode) {
         return true;
     };
     DragDropMatrixRows.prototype.calculateIsBottom = function (clientY) {
@@ -7471,10 +6994,15 @@ var DragDropMatrixRows = /** @class */ (function (_super) {
         // }
         _super.prototype.ghostPositionChanged.call(this);
     };
-    DragDropMatrixRows.prototype.doClear = function () {
+    DragDropMatrixRows.prototype.clear = function () {
+        var renderedRows = this.parentElement.renderedTable.rows;
+        renderedRows.forEach(function (renderedRow) {
+            renderedRow.isGhostRow = false;
+        });
         this.parentElement.clearOnDrop();
         this.fromIndex = null;
         this.toIndex = null;
+        _super.prototype.clear.call(this);
     };
     return DragDropMatrixRows;
 }(_core__WEBPACK_IMPORTED_MODULE_0__["DragDropCore"]));
@@ -7520,7 +7048,7 @@ var DragDropRankingChoices = /** @class */ (function (_super) {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.isDragOverRootNode = false;
         _this.doDragOver = function () {
-            var node = _this.draggedElementShortcut.querySelector(".sv-ranking-item");
+            var node = _this.domAdapter.draggedElementShortcut.querySelector(".sv-ranking-item");
             node.style.cursor = "grabbing";
         };
         _this.doBanDropHere = function () {
@@ -7528,17 +7056,13 @@ var DragDropRankingChoices = /** @class */ (function (_super) {
                 _this.allowDropHere = true;
                 return;
             }
-            var node = _this.draggedElementShortcut.querySelector(".sv-ranking-item");
+            var node = _this.domAdapter.draggedElementShortcut.querySelector(".sv-ranking-item");
             node.style.cursor = "not-allowed";
         };
         _this.doDrop = function () {
             _this.parentElement.setValue();
             return _this.parentElement;
         };
-        _this.doClear = function () {
-            _this.parentElement.dropTargetNodeMove = null;
-            _this.parentElement.updateRankingChoices(true);
-        };
         return _this;
     }
     Object.defineProperty(DragDropRankingChoices.prototype, "draggedElementType", {
@@ -7632,439 +7156,22 @@ var DragDropRankingChoices = /** @class */ (function (_super) {
     DragDropRankingChoices.prototype.updateDraggedElementShortcut = function (newIndex) {
         var newIndexText = newIndex + "";
         // TODO should avoid direct DOM manipulation, do through the frameworks instead
-        var indexNode = this.draggedElementShortcut.querySelector(".sv-ranking-item__index");
+        var indexNode = this.domAdapter.draggedElementShortcut.querySelector(".sv-ranking-item__index");
         indexNode.innerText = newIndexText;
     };
     DragDropRankingChoices.prototype.ghostPositionChanged = function () {
         this.parentElement.currentDropTarget = this.draggedElement;
         _super.prototype.ghostPositionChanged.call(this);
     };
-    return DragDropRankingChoices;
-}(_choices__WEBPACK_IMPORTED_MODULE_0__["DragDropChoices"]));
-
-
-
-/***/ }),
-
-/***/ "./src/dragdrop/survey-elements.ts":
-/*!*****************************************!*\
-  !*** ./src/dragdrop/survey-elements.ts ***!
-  \*****************************************/
-/*! exports provided: DragDropSurveyElements */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DragDropSurveyElements", function() { return DragDropSurveyElements; });
-/* harmony import */ var _survey_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../survey-element */ "./src/survey-element.ts");
-/* harmony import */ var _jsonobject__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../jsonobject */ "./src/jsonobject.ts");
-/* harmony import */ var _core__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./core */ "./src/dragdrop/core.ts");
-/* harmony import */ var _settings__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../settings */ "./src/settings.ts");
-var __extends = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-
-
-
-
-var DragDropSurveyElements = /** @class */ (function (_super) {
-    __extends(DragDropSurveyElements, _super);
-    function DragDropSurveyElements() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.isEdge = false;
-        _this.prevIsEdge = null;
-        _this.ghostSurveyElement = null;
-        _this.isDraggedElementSelected = false;
-        _this.doBanDropHere = function () {
-            _this.removeGhostElementFromSurvey();
-            _this.isEdge = null;
-        };
-        _this.doDrop = function () {
-            if (_this.dropTarget) {
-                _settings__WEBPACK_IMPORTED_MODULE_3__["settings"].environment.root.activeElement.blur();
-                return _this.insertRealElementIntoSurvey();
-            }
-            return null;
-        };
-        _this.doClear = function () {
-            _this.removeGhostElementFromSurvey();
-            _this.isEdge = null;
-            _this.ghostSurveyElement = null;
-            if (!!_this.draggedElement) {
-                _this.draggedElement.isDragMe = false;
-            }
-            _this.isRight = null;
-        };
-        return _this;
-    }
-    Object.defineProperty(DragDropSurveyElements.prototype, "draggedElementType", {
-        get: function () {
-            return "survey-element";
-        },
-        enumerable: false,
-        configurable: true
-    });
-    DragDropSurveyElements.prototype.startDragToolboxItem = function (event, draggedElementJson, toolboxItemTitle) {
-        var preventSaveTargetNode = true;
-        var draggedElement = this.createElementFromJson(draggedElementJson);
-        draggedElement.toolboxItemTitle = toolboxItemTitle;
-        this.startDrag(event, draggedElement, null, null, preventSaveTargetNode);
-    };
-    DragDropSurveyElements.prototype.startDragSurveyElement = function (event, draggedElement, isElementSelected) {
-        this.isDraggedElementSelected = isElementSelected;
-        this.startDrag(event, draggedElement);
-    };
-    DragDropSurveyElements.prototype.getShortcutText = function (draggedElement) {
-        return draggedElement.toolboxItemTitle || _super.prototype.getShortcutText.call(this, draggedElement);
-    };
-    DragDropSurveyElements.prototype.createDraggedElementShortcut = function (text, draggedElementNode, event) {
-        var draggedElementShortcut = document.createElement("div");
-        var textSpan = document.createElement("span");
-        textSpan.className = "svc-dragged-element-shortcut__text";
-        textSpan.innerText = text;
-        draggedElementShortcut.appendChild(this.createDraggedElementIcon());
-        draggedElementShortcut.appendChild(textSpan);
-        draggedElementShortcut.className = this.getDraggedElementClass();
-        return draggedElementShortcut;
-    };
-    DragDropSurveyElements.prototype.createDraggedElementIcon = function () {
-        var span = document.createElement("span");
-        var type = this.draggedElement.getType();
-        var svgString = "<svg class=\"sv-svg-icon\" role=\"img\" style=\"width: 24px; height: 24px;\"><use xlink:href=\"#icon-" + type + "\"></use></svg>";
-        span.className = "svc-dragged-element-shortcut__icon";
-        span.innerHTML = svgString;
-        return span;
-    };
-    DragDropSurveyElements.prototype.getDraggedElementClass = function () {
-        var result = "svc-dragged-element-shortcut";
-        if (this.isDraggedElementSelected)
-            result += " svc-dragged-element-shortcut--selected";
-        return result;
-    };
-    DragDropSurveyElements.prototype.createElementFromJson = function (json) {
-        var element = this.createNewElement(json);
-        if (element["setSurveyImpl"]) {
-            element["setSurveyImpl"](this.survey);
-        }
-        else {
-            element["setData"](this.survey);
-        }
-        element.renderWidth = "100%";
-        return element;
-    };
-    DragDropSurveyElements.prototype.createNewElement = function (json) {
-        var newElement = _jsonobject__WEBPACK_IMPORTED_MODULE_1__["Serializer"].createClass(json["type"]);
-        new _jsonobject__WEBPACK_IMPORTED_MODULE_1__["JsonObject"]().toObject(json, newElement);
-        return newElement;
-    };
-    DragDropSurveyElements.prototype.findDropTargetNodeByDragOverNode = function (dragOverNode) {
-        var ghostRow = dragOverNode.closest(".svc-row--ghost");
-        if (!!ghostRow) {
-            var ghostDataAttrSelector = "[data-sv-drop-target-survey-element='sv-drag-drop-ghost-survey-element-name']";
-            var ghostNode = dragOverNode.closest(ghostDataAttrSelector) || dragOverNode.querySelector(ghostDataAttrSelector);
-            if (!!ghostNode) {
-                return ghostNode;
-            }
-        }
-        var dropTargetNode = dragOverNode.closest(this.dropTargetDataAttributeName);
-        return dropTargetNode;
-    };
-    DragDropSurveyElements.prototype.getDropTargetByDataAttributeValue = function (dataAttributeValue, dropTargetNode, event) {
-        this.isEdge = this.calculateIsEdge(dropTargetNode, event.clientY);
-        if (!dataAttributeValue) {
-            // panel dynamic
-            var nearestDropTargetElement = dropTargetNode.parentElement.closest(this.dropTargetDataAttributeName);
-            dataAttributeValue = this.getDataAttributeValueByNode(nearestDropTargetElement);
-        }
-        if (!dataAttributeValue) {
-            throw new Error("Can't find drop target survey element name");
-        }
-        if (dataAttributeValue === DragDropSurveyElements.ghostSurveyElementName) {
-            return this.prevDropTarget;
-        }
-        // drop to new page
-        if (dataAttributeValue === "newGhostPage") {
-            return DragDropSurveyElements.newGhostPage;
-        }
-        // drop to page
-        var page = this.survey.getPageByName(dataAttributeValue);
-        if (page) {
-            if (
-            // TODO we can't drop on not empty page directly for now
-            page.elements.length !== 0) {
-                return null;
-            }
-            return page;
-        }
-        // drop to question or panel
-        var dropTarget;
-        var question;
-        this.survey.pages.forEach(function (page) {
-            question = page.getElementByName(dataAttributeValue);
-            if (question)
-                dropTarget = question;
-        });
-        // drop to paneldynamic
-        if (dropTarget.getType() === "paneldynamic" && !this.isEdge) {
-            dropTarget = dropTarget.template;
-        }
-        // drop to matrix detail panel
-        if ((dropTarget.getType() === "matrixdropdown" || dropTarget.getType() === "matrixdynamic") && dropTarget.detailPanelMode !== "none" && !this.isEdge) {
-            dropTarget = dropTarget.detailPanel;
-        }
-        // drop to panel
-        else if (dropTarget.isPanel) {
-            dropTarget = this.getPanelDropTarget(dropTargetNode, dropTarget, event);
-        }
-        // drop to question
-        //question inside paneldymanic
-        if (!dropTarget.page) {
-            var nearestDropTargetPageElement = dropTargetNode.parentElement.closest("[data-sv-drop-target-page]");
-            dataAttributeValue = nearestDropTargetPageElement.dataset.svDropTargetPage;
-            var page_1 = this.survey.getPageByName(dataAttributeValue);
-            dropTarget.__page = page_1;
-        }
-        return dropTarget;
-        // EO drop to question or panel
-    };
-    DragDropSurveyElements.prototype.isDropTargetValid = function () {
-        if (!this.dropTarget)
-            return false;
-        if (this.dropTarget === this.draggedElement)
-            return false;
-        if (this.draggedElement.getType() === "paneldynamic" &&
-            this.dropTarget === this.draggedElement.template)
-            return false;
-        if (DragDropSurveyElements.restrictDragQuestionBetweenPages &&
-            this.shouldRestricDragQuestionBetweenPages(this.dropTarget)) {
-            return false;
-        }
-        return true;
-    };
-    DragDropSurveyElements.prototype.calculateIsBottom = function (clientY, dropTargetNode) {
-        // we shouldn't reculc isBottom if drag over ghost survey element
-        if (this.getDataAttributeValueByNode(dropTargetNode) === DragDropSurveyElements.ghostSurveyElementName) {
-            return this.isBottom;
-        }
-        var middle = this.calculateVerticalMiddleOfHTMLElement(dropTargetNode);
-        return clientY >= middle;
-    };
-    DragDropSurveyElements.prototype.calculateIsRight = function (clientX, dropTargetNode) {
-        // we shouldn't reculc isBottom if drag over ghost survey element
-        if (this.getDataAttributeValueByNode(dropTargetNode) === DragDropSurveyElements.ghostSurveyElementName) {
-            return this.isRight;
-        }
-        var middle = this.calculateHorizontalMiddleOfHTMLElement(dropTargetNode);
-        return clientX >= middle;
-    };
-    DragDropSurveyElements.prototype.isDropTargetDoesntChanged = function (newIsBottom) {
-        if (this.dropTarget === this.ghostSurveyElement)
-            return true;
-        return (this.dropTarget === this.prevDropTarget && newIsBottom === this.isBottom
-            && this.isEdge === this.prevIsEdge && this.isRight === this.prevIsRight);
-    };
-    DragDropSurveyElements.prototype.shouldRestricDragQuestionBetweenPages = function (dropTarget) {
-        var oldPage = this.draggedElement["page"];
-        var newPage = dropTarget.isPage ? dropTarget : dropTarget["page"];
-        // if oldPage === null then it is drop from the toolbox
-        return oldPage && oldPage !== newPage;
-    };
-    DragDropSurveyElements.prototype.getPanelDropTarget = function (HTMLElement, dropTarget, event) {
-        var isEdge = this.isEdge;
-        if (!isEdge && dropTarget.questions.length !== 0) {
-            HTMLElement = this.findDeepestDropTargetChild(HTMLElement);
-            dropTarget = this.getDropTargetByNode(HTMLElement, event);
-        }
-        return dropTarget;
-    };
-    DragDropSurveyElements.prototype.findDeepestDropTargetChild = function (parent) {
-        var selector = this.dropTargetDataAttributeName;
-        var result = parent;
-        while (!!parent) {
-            result = parent;
-            parent = parent.querySelector(selector);
-        }
-        return result;
-    };
-    DragDropSurveyElements.prototype.calculateIsEdge = function (dropTargetNode, clientY) {
-        var rect = dropTargetNode.getBoundingClientRect();
-        return clientY - rect.top <= DragDropSurveyElements.edgeHeight || rect.bottom - clientY <= DragDropSurveyElements.edgeHeight;
-    };
-    // private calculateIsRight(): boolean {
-    //   // const dropTarget = this.dropTarget;
-    //   // const targetRow = this.getTargetRow(dropTarget);
-    //   // if (targetRow.elements.indexOf(this.draggedElement) !== -1) {
-    //   //   var pageOrPanel = dropTarget.parent;
-    //   //   var srcIndex = pageOrPanel.elements.indexOf(this.draggedElement);
-    //   //   var destIndex = pageOrPanel.elements.indexOf(dropTarget);
-    //   // } else {
-    //   //   if (targetRow.elements.indexOf(dropTarget) === 0) {
-    //   //     return false;
-    //   //   } else {
-    //   //     return true;
-    //   //   }
-    //   //   // else if (targetRow.elements.indexOf(dropTarget) === targetRow.elements.length -1) {
-    //   //   //   return true;
-    //   //   // }
-    //   // }
-    //   // return srcIndex < destIndex;
-    //   const middle = this.calculateHorizontalMiddleOfHTMLElement(this.dropTargetNode);
-    //   return clientY >= middle;
-    // }
-    DragDropSurveyElements.prototype.doDragOver = function (dropTargetNode, event) {
-        this.isRight = this.calculateIsRight(event.clientX, dropTargetNode);
-    };
-    DragDropSurveyElements.prototype.afterDragOver = function (dropTargetNode, event) {
-        this.prevIsEdge = this.isEdge;
-        this.prevIsRight = this.isRight;
-        this.insertGhostElementIntoSurvey();
-    };
-    DragDropSurveyElements.prototype.onStartDrag = function () {
-        this.ghostSurveyElement = this.createGhostSurveyElement();
-        this.draggedElement.isDragMe = true;
-    };
-    DragDropSurveyElements.prototype.insertGhostElementIntoSurvey = function () {
-        this.removeGhostElementFromSurvey();
-        var isTargetRowMultiple = this.calcTargetRowMultiple();
-        this.ghostSurveyElement = this.createGhostSurveyElement(isTargetRowMultiple);
-        this.ghostSurveyElement.name =
-            DragDropSurveyElements.ghostSurveyElementName; // TODO why do we need setup it manually see createGhostSurveyElement method
-        this.parentElement = this.dropTarget.isPage
-            ? this.dropTarget
-            : (this.dropTarget.page || this.dropTarget.__page);
-        if (this.isDragOverInsideEmptyPanel()) {
-            this.dropTarget.dragTypeOverMe = _survey_element__WEBPACK_IMPORTED_MODULE_0__["DragTypeOverMeEnum"].InsideEmptyPanel;
-            return;
-        }
-        if (!this.isEdge && isTargetRowMultiple) {
-            this.dropTarget.dragTypeOverMe = this.isRight ?
-                _survey_element__WEBPACK_IMPORTED_MODULE_0__["DragTypeOverMeEnum"].MultilineRight :
-                _survey_element__WEBPACK_IMPORTED_MODULE_0__["DragTypeOverMeEnum"].MultilineLeft;
-            return;
-        }
-        this.parentElement.dragDropStart(this.draggedElement, this.ghostSurveyElement, DragDropSurveyElements.nestedPanelDepth);
-        var result = this.parentElement.dragDropMoveTo(this.dropTarget, isTargetRowMultiple ? this.isRight : this.isBottom, this.isEdge);
-        return result;
-    };
-    DragDropSurveyElements.prototype.calcTargetRowMultiple = function () {
-        var targetParent = this.getTargetParent(this.dropTarget);
-        var targetRow = this.getTargetRow(this.dropTarget);
-        var isTargetRowMultiple = targetRow && targetRow.elements.length > 1;
-        var isTemplatePanelInPanelDynamic = targetParent.isPanel && !targetParent.name;
-        if (this.isEdge && isTargetRowMultiple && !isTemplatePanelInPanelDynamic) {
-            targetParent.__page = this.dropTarget.page || this.dropTarget.__page;
-            this.dropTarget = targetParent;
-            return false;
-        }
-        return isTargetRowMultiple;
-    };
-    DragDropSurveyElements.prototype.getTargetParent = function (dropTarget) {
-        var targetParent = dropTarget.isPage || dropTarget.isPanel ? dropTarget : dropTarget.parent;
-        if (dropTarget.getType() === "paneldynamic") {
-            targetParent = dropTarget.templateValue;
-        }
-        return targetParent;
-    };
-    DragDropSurveyElements.prototype.getTargetRow = function (dropTarget) {
-        var targetParent = this.getTargetParent(dropTarget);
-        var targetRow;
-        targetParent.rows.forEach(function (row) {
-            if (row.elements.indexOf(dropTarget) !== -1) {
-                targetRow = row;
-            }
-        });
-        return targetRow;
-    };
-    DragDropSurveyElements.prototype.isDragOverInsideEmptyPanel = function () {
-        var isEmptyPanel = this.dropTarget.isPanel && this.dropTarget.questions.length === 0;
-        var isDragOverInside = !this.isEdge;
-        return isEmptyPanel && isDragOverInside;
-    };
-    DragDropSurveyElements.prototype.removeGhostElementFromSurvey = function () {
-        var dropTarget = this.prevDropTarget || this.dropTarget;
-        if (!!dropTarget) {
-            dropTarget.dragTypeOverMe = null;
-        }
-        if (!!this.parentElement)
-            this.parentElement.dragDropFinish(true);
-    };
-    DragDropSurveyElements.prototype.insertRealElementIntoSurvey = function () {
-        this.removeGhostElementFromSurvey();
-        var isTargetRowMultiple = this.calcTargetRowMultiple();
-        // ghost new page
-        if (this.dropTarget.isPage && this.dropTarget["_isGhost"]) {
-            this.dropTarget["_addGhostPageViewModel"]();
-        }
-        // EO ghost new page
-        //TODO need for dragDrop helper in library
-        var json = new _jsonobject__WEBPACK_IMPORTED_MODULE_1__["JsonObject"]().toJsonObject(this.draggedElement);
-        json["type"] = this.draggedElement.getType();
-        var fakeTargetElement = this.createFakeTargetElement(this.draggedElement.name, json);
-        //
-        this.parentElement.dragDropStart(this.draggedElement, fakeTargetElement, DragDropSurveyElements.nestedPanelDepth);
-        this.parentElement.dragDropMoveTo(this.dropTarget, isTargetRowMultiple ? this.isRight : this.isBottom, this.isEdge);
-        var newElement = this.parentElement.dragDropFinish();
-        return newElement;
-    };
-    DragDropSurveyElements.prototype.createFakeTargetElement = function (elementName, json) {
-        if (!elementName || !json)
-            return null;
-        var targetElement = null;
-        targetElement = _jsonobject__WEBPACK_IMPORTED_MODULE_1__["Serializer"].createClass(json["type"]);
-        new _jsonobject__WEBPACK_IMPORTED_MODULE_1__["JsonObject"]().toObject(json, targetElement);
-        targetElement.name = elementName;
-        if (targetElement["setSurveyImpl"]) {
-            targetElement["setSurveyImpl"](this.survey);
-        }
-        else {
-            targetElement["setData"](this.survey);
-        }
-        targetElement.renderWidth = "100%";
-        return targetElement;
-    };
-    DragDropSurveyElements.prototype.createGhostSurveyElement = function (isMultipleRowDrag) {
-        if (isMultipleRowDrag === void 0) { isMultipleRowDrag = false; }
-        var className = "sv-drag-drop-ghost";
-        var minWidth = "300px";
-        if (isMultipleRowDrag) {
-            minWidth = "4px";
-            className += " sv-drag-drop-ghost--vertical";
-        }
-        var json = {
-            type: "html",
-            minWidth: minWidth,
-            name: DragDropSurveyElements.ghostSurveyElementName,
-            html: "<div class=\"" + className + "\"></div>",
-        };
-        var element = this.createElementFromJson(json);
-        element.startWithNewLine = !isMultipleRowDrag;
-        if (isMultipleRowDrag) {
-            element.maxWidth = "4px";
-            element.renderWidth = "0px";
-            element.paddingRight = "0px";
-            element.paddingLeft = "0px";
+    DragDropRankingChoices.prototype.clear = function () {
+        if (!!this.parentElement) {
+            this.parentElement.dropTargetNodeMove = null;
+            this.parentElement.updateRankingChoices(true);
         }
-        return element;
+        _super.prototype.clear.call(this);
     };
-    DragDropSurveyElements.newGhostPage = null;
-    DragDropSurveyElements.restrictDragQuestionBetweenPages = false;
-    DragDropSurveyElements.edgeHeight = 30;
-    DragDropSurveyElements.nestedPanelDepth = -1;
-    DragDropSurveyElements.ghostSurveyElementName = "sv-drag-drop-ghost-survey-element-name"; // before renaming use globa search (we have also css selectors)
-    return DragDropSurveyElements;
-}(_core__WEBPACK_IMPORTED_MODULE_2__["DragDropCore"]));
+    return DragDropRankingChoices;
+}(_choices__WEBPACK_IMPORTED_MODULE_0__["DragDropChoices"]));
 
 
 
@@ -8131,6 +7238,11 @@ var DropdownListModel = /** @class */ (function (_super) {
         _this.itemsSettings = { skip: 0, take: 0, totalCount: 0, items: [] };
         _this.isRunningLoadQuestionChoices = false;
         _this.popupCssClasses = "sv-single-select-list";
+        _this.listModelFilterStringChanged = function (newValue) {
+            if (_this.filterString !== newValue) {
+                _this.filterString = newValue;
+            }
+        };
         question.onPropertyChanged.add(function (sender, options) {
             if (options.name == "value") {
                 _this.showInputFieldComponent = _this.question.showInputFieldComponent;
@@ -8273,8 +7385,9 @@ var DropdownListModel = /** @class */ (function (_super) {
                 _this._popupModel.toggleVisibility();
             };
         }
-        var res = new _list__WEBPACK_IMPORTED_MODULE_2__["ListModel"](visibleItems, _onSelectionChanged, false, undefined, undefined, this.listElementId);
+        var res = new _list__WEBPACK_IMPORTED_MODULE_2__["ListModel"](visibleItems, _onSelectionChanged, false, undefined, this.question.choicesLazyLoadEnabled ? this.listModelFilterStringChanged : undefined, this.listElementId);
         res.renderElements = false;
+        res.forceShowFilter = true;
         res.areSameItemsCallback = function (item1, item2) {
             return item1 === item2;
         };
@@ -8607,11 +7720,11 @@ var DropdownListModel = /** @class */ (function (_super) {
         event.stopPropagation();
     };
     DropdownListModel.prototype.onFocus = function (event) {
-        this.setInputStringFromSelectedItem();
+        this.setInputStringFromSelectedItem(this.question.selectedItem);
     };
     DropdownListModel.prototype.setInputStringFromSelectedItem = function (newValue) {
-        if (this.question.searchEnabled) {
-            this.applyInputString(newValue || this.question.selectedItem);
+        if (this.question.searchEnabled && !!newValue) {
+            this.applyInputString(newValue);
         }
         else {
             this.inputString = null;
@@ -8783,7 +7896,9 @@ var DropdownMultiSelectListModel = /** @class */ (function (_super) {
                 }
             };
         }
-        return new _multiSelectListModel__WEBPACK_IMPORTED_MODULE_3__["MultiSelectListModel"](visibleItems, _onSelectionChanged, false, undefined, undefined, this.listElementId);
+        var res = new _multiSelectListModel__WEBPACK_IMPORTED_MODULE_3__["MultiSelectListModel"](visibleItems, _onSelectionChanged, false, undefined, this.question.choicesLazyLoadEnabled ? this.listModelFilterStringChanged : undefined, this.listElementId);
+        res.forceShowFilter = true;
+        return res;
     };
     DropdownMultiSelectListModel.prototype.resetFilterString = function () {
         _super.prototype.resetFilterString.call(this);
@@ -9215,7 +8330,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!*************************************!*\
   !*** ./src/entries/chunks/model.ts ***!
   \*************************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropSurveyElements, DragDropChoices */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -9651,8 +8766,8 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "defaultV2ThemeName", function() { return _defaultCss_defaultV2Css__WEBPACK_IMPORTED_MODULE_82__["defaultV2ThemeName"]; });
 
-/* harmony import */ var _dragdrop_survey_elements__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../../dragdrop/survey-elements */ "./src/dragdrop/survey-elements.ts");
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropSurveyElements", function() { return _dragdrop_survey_elements__WEBPACK_IMPORTED_MODULE_83__["DragDropSurveyElements"]; });
+/* harmony import */ var _dragdrop_core__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../../dragdrop/core */ "./src/dragdrop/core.ts");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropCore", function() { return _dragdrop_core__WEBPACK_IMPORTED_MODULE_83__["DragDropCore"]; });
 
 /* harmony import */ var _dragdrop_choices__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../../dragdrop/choices */ "./src/dragdrop/choices.ts");
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropChoices", function() { return _dragdrop_choices__WEBPACK_IMPORTED_MODULE_84__["DragDropChoices"]; });
@@ -9661,7 +8776,7 @@ __webpack_require__.r(__webpack_exports__);
 // import "../../main.scss";
 //import "../../modern.scss";
 var Version;
-Version = "" + "1.9.89";
+Version = "" + "1.9.90";
 function checkLibraryVersion(ver, libraryName) {
     if (Version != ver) {
         var str = "survey-core has version '" + Version + "' and " + libraryName
@@ -9766,7 +8881,7 @@ function checkLibraryVersion(ver, libraryName) {
 /*!**************************************!*\
   !*** ./src/entries/core-wo-model.ts ***!
   \**************************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropSurveyElements, DragDropChoices, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -10122,7 +9237,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "defaultV2ThemeName", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["defaultV2ThemeName"]; });
 
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropSurveyElements", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["DragDropSurveyElements"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropCore", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["DragDropCore"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropChoices", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["DragDropChoices"]; });
 
@@ -10203,7 +9318,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!*****************************!*\
   !*** ./src/entries/core.ts ***!
   \*****************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropSurveyElements, DragDropChoices, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -10559,7 +9674,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "defaultV2ThemeName", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["defaultV2ThemeName"]; });
 
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropSurveyElements", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["DragDropSurveyElements"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropCore", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["DragDropCore"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropChoices", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["DragDropChoices"]; });
 
@@ -11000,7 +10115,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!******************************!*\
   !*** ./src/entries/react.ts ***!
   \******************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropSurveyElements, DragDropChoices, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model, bootstrapThemeName, bootstrapThemeColors, bootstrapThemeCssRules, bootstrapMaterialThemeName, bootstrapMaterialThemeColors, bootstrapMaterialThemeCssRules, defaultBootstrapCss, defaultBootstrapMaterialCss, Survey, attachKey2click, ReactSurveyElementsWrapper, SurveyNavigationBase, SurveyTimerPanel, SurveyPage, SurveyRow, SurveyPanel, SurveyFlowPanel, SurveyQuestion, SurveyElementErrors, SurveyQuestionAndErrorsCell, ReactSurveyElement, SurveyElementBase, SurveyQuestionElementBase, SurveyQuestionCommentItem, SurveyQuestionComment, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionRanking, SurveyQuestionRankingItem, RatingItem, RatingItemStar, RatingItemSmiley, TagboxFilterString, SurveyQuestionOptionItem, SurveyQuestionDropdownBase, SurveyQuestionDropdown, SurveyQuestionTagboxItem, SurveyQuestionTagbox, SurveyQuestionDropdownSelect, SurveyQuestionMatrix, SurveyQuestionMatrixRow, SurveyQuestionHtml, SurveyQuestionFile, SurveyQuestionMultipleText, SurveyQuestionRadiogroup, SurveyQuestionRadioItem, SurveyQuestionText, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionEmpty, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicAddButton, SurveyQuestionPanelDynamic, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionExpression, PopupSurvey, SurveyWindow, ReactQuestionFactory, ReactElementFactory, SurveyQuestionImagePicker, SurveyQuestionImage, SurveyQuestionSignaturePad, SurveyQuestionButtonGroup, SurveyQuestionCustom, SurveyQuestionComposite, Popup, List, TitleActions, TitleElement, SurveyActionBar, LogoImage, SurveyHeader, SvgIcon, SurveyQuestionMatrixDynamicRemoveButton, SurveyQuestionMatrixDetailButton, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionPanelDynamicAddButton, SurveyQuestionPanelDynamicRemoveButton, SurveyQuestionPanelDynamicPrevButton, SurveyQuestionPanelDynamicNextButton, SurveyQuestionPanelDynamicProgressText, SurveyNavigationButton, MatrixRow, Skeleton, NotifierComponent, ComponentsContainer, CharacterCounterComponent, SurveyLocStringViewer, SurveyLocStringEditor */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model, bootstrapThemeName, bootstrapThemeColors, bootstrapThemeCssRules, bootstrapMaterialThemeName, bootstrapMaterialThemeColors, bootstrapMaterialThemeCssRules, defaultBootstrapCss, defaultBootstrapMaterialCss, Survey, attachKey2click, ReactSurveyElementsWrapper, SurveyNavigationBase, SurveyTimerPanel, SurveyPage, SurveyRow, SurveyPanel, SurveyFlowPanel, SurveyQuestion, SurveyElementErrors, SurveyQuestionAndErrorsCell, ReactSurveyElement, SurveyElementBase, SurveyQuestionElementBase, SurveyQuestionCommentItem, SurveyQuestionComment, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionRanking, SurveyQuestionRankingItem, RatingItem, RatingItemStar, RatingItemSmiley, TagboxFilterString, SurveyQuestionOptionItem, SurveyQuestionDropdownBase, SurveyQuestionDropdown, SurveyQuestionTagboxItem, SurveyQuestionTagbox, SurveyQuestionDropdownSelect, SurveyQuestionMatrix, SurveyQuestionMatrixRow, SurveyQuestionHtml, SurveyQuestionFile, SurveyQuestionMultipleText, SurveyQuestionRadiogroup, SurveyQuestionRadioItem, SurveyQuestionText, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionEmpty, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicAddButton, SurveyQuestionPanelDynamic, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionExpression, PopupSurvey, SurveyWindow, ReactQuestionFactory, ReactElementFactory, SurveyQuestionImagePicker, SurveyQuestionImage, SurveyQuestionSignaturePad, SurveyQuestionButtonGroup, SurveyQuestionCustom, SurveyQuestionComposite, Popup, List, TitleActions, TitleElement, SurveyActionBar, LogoImage, SurveyHeader, SvgIcon, SurveyQuestionMatrixDynamicRemoveButton, SurveyQuestionMatrixDetailButton, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionPanelDynamicAddButton, SurveyQuestionPanelDynamicRemoveButton, SurveyQuestionPanelDynamicPrevButton, SurveyQuestionPanelDynamicNextButton, SurveyQuestionPanelDynamicProgressText, SurveyNavigationButton, MatrixRow, Skeleton, NotifierComponent, ComponentsContainer, CharacterCounterComponent, SurveyLocStringViewer, SurveyLocStringEditor */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -11356,7 +10471,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "defaultV2ThemeName", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["defaultV2ThemeName"]; });
 
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropSurveyElements", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["DragDropSurveyElements"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropCore", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["DragDropCore"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DragDropChoices", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["DragDropChoices"]; });
 
@@ -17379,6 +16494,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _settings__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./settings */ "./src/settings.ts");
 /* harmony import */ var _actions_action__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./actions/action */ "./src/actions/action.ts");
 /* harmony import */ var _question_baseselect__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./question_baseselect */ "./src/question_baseselect.ts");
+/* harmony import */ var _question__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./question */ "./src/question.ts");
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -17408,6 +16524,7 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
 
 
 
+
 /**
  * Array of ItemValue is used in checkox, dropdown and radiogroup choices, matrix columns and rows.
  * It has two main properties: value and text. If text is empty, value is used for displaying.
@@ -17823,10 +16940,10 @@ var ItemValue = /** @class */ (function (_super) {
         configurable: true
     });
     ItemValue.prototype.getComponent = function () {
-        if (this._locOwner instanceof _question_baseselect__WEBPACK_IMPORTED_MODULE_7__["QuestionSelectBase"]) {
+        if (this._locOwner instanceof _question__WEBPACK_IMPORTED_MODULE_8__["Question"]) {
             return this.componentValue || this._locOwner.itemComponent;
         }
-        return "";
+        return this.componentValue;
     };
     ItemValue.prototype.setComponent = function (val) {
         this.componentValue = val;
@@ -19227,7 +18344,7 @@ var JsonMetadata = /** @class */ (function () {
             }
         }
         return {
-            $id: "#locstring",
+            $id: "locstring",
             type: "object",
             properties: props
         };
@@ -19291,10 +18408,10 @@ var JsonMetadata = /** @class */ (function () {
             if (prop.baseClassName == "question") {
                 usedClasses.push(this.findClass("panel"));
             }
-            res.items = [];
+            res.items = { anyOf: [] };
             for (var i = 0; i < usedClasses.length; i++) {
                 var className = usedClasses[i].name;
-                res.items.push({ $ref: this.getChemeRefName(className, isRoot) });
+                res.items.anyOf.push({ $ref: this.getChemeRefName(className, isRoot) });
                 this.generateChemaClass(className, schemaDef, false);
             }
         }
@@ -19313,8 +18430,7 @@ var JsonMetadata = /** @class */ (function () {
         if (hasParent) {
             this.generateChemaClass(classInfo.parentName, schemaDef, isRoot);
         }
-        var id = isRoot ? className : "#" + className;
-        var res = { type: "object", $id: id };
+        var res = { type: "object", $id: className };
         schemaDef[className] = res;
         var chemaProps = { properties: {} };
         this.generateSchemaProperties(classInfo, chemaProps, schemaDef, isRoot);
@@ -19894,7 +19010,7 @@ var ListModel = /** @class */ (function (_super) {
         }
     };
     ListModel.prototype.onSet = function () {
-        this.showFilter = this.searchEnabled && (this.actions || []).length > ListModel.MINELEMENTCOUNT;
+        this.showFilter = this.searchEnabled && (this.forceShowFilter || (this.actions || []).length > ListModel.MINELEMENTCOUNT);
         _super.prototype.onSet.call(this);
     };
     ListModel.prototype.getDefaultCssClasses = function () {
@@ -20080,6 +19196,9 @@ var ListModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: false })
     ], ListModel.prototype, "showFilter", void 0);
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: false })
+    ], ListModel.prototype, "forceShowFilter", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: false })
     ], ListModel.prototype, "isExpanded", void 0);
@@ -22215,7 +21334,7 @@ var greekSurveyStrings = {
     noneItemText: "Κανένας",
     selectAllItemText: "Επιλογή όλων",
     progressText: "Σελίδα {0} από {1}",
-    // indexText: "{0} of {1}",
+    indexText: "{0} από {1}",
     panelDynamicProgressText: "Εγγραφή {0} από {1}",
     questionsProgressText: "Απαντήθηκαν {0} / {1} ερωτήσεις",
     emptySurvey: "Δεν υπάρχει καμία ορατή σελίδα ή ορατή ερώτηση σε αυτό το ερωτηματολόγιο.",
@@ -22223,15 +21342,15 @@ var greekSurveyStrings = {
     completingSurveyBefore: "Τα αρχεία μας δείχνουν ότι έχετε ήδη ολοκληρώσει αυτήν την έρευνα.",
     loadingSurvey: "Το ερωτηματολόγιο φορτώνεται απο το διακομιστή...",
     placeholder: "Επιλέξτε...",
-    // ratingOptionsCaption: "Tap to rate here...",
-    value: "αξία",
+    ratingOptionsCaption: "Πατήστε για να βαθμολογήσετε εδώ...",
+    value: "τιμή",
     requiredError: "Παρακαλώ απαντήστε στην ερώτηση.",
     requiredErrorInPanel: "Απαντήστε σε τουλάχιστον μία ερώτηση.",
-    requiredInAllRowsError: "Παρακαλώ απαντήστε στις ερωτήσεις σε όλες τις γραμμές.",
+    requiredInAllRowsError: "Παρακαλώ απαντήστε τις ερωτήσεις σε όλες τις γραμμές.",
     numericError: "Η τιμή πρέπει να είναι αριθμητική.",
-    // minError: "The value should not be less than {0}",
-    // maxError: "The value should not be greater than {0}",
-    textMinLength: "Παρακαλώ συμπληρώστε τουλάχιστον {0} σύμβολα.",
+    minError: "Η τιμή δεν πρέπει να είναι μικρότερη από {0}",
+    maxError: "Η τιμή δεν πρέπει να είναι μεγαλύτερη από {0}",
+    textMinLength: "Παρακαλώ συμπληρώστε τουλάχιστον {0} χαρακτήρες.",
     textMaxLength: "Εισαγάγετε λιγότερους από {0} χαρακτήρες.",
     textMinMaxLength: "Εισαγάγετε περισσότερους από {0} και λιγότερους από {1} χαρακτήρες.",
     minRowCountError: "Παρακαλώ συμπληρώστε τουλάχιστον {0} γραμμές.",
@@ -22244,25 +21363,25 @@ var greekSurveyStrings = {
     invalidExpression: "Η έκφραση: {0} θα πρέπει να επιστρέψει 'true'.",
     urlRequestError: "Η αίτηση επέστρεψε σφάλμα '{0}'. {1}",
     urlGetChoicesError: "Η αίτηση επέστρεψε κενά δεδομένα ή η ιδιότητα 'μονοπάτι/path' είναι εσφαλμένη",
-    exceedMaxSize: "Το μέγεθος δεν μπορεί να υπερβαίνει τα {0}.",
+    exceedMaxSize: "Το μέγεθος του αρχείου δεν μπορεί να υπερβαίνει τα {0}.",
     otherRequiredError: "Παρακαλώ συμπληρώστε την τιμή για το πεδίο 'άλλο'.",
-    uploadingFile: "Το αρχείο σας ανεβαίνει. Παρακαλώ περιμένετε καποια δευτερόλεπτα και δοκιμάστε ξανά.",
+    uploadingFile: "Το αρχείο σας ανεβαίνει. Παρακαλώ περιμένετε μερικά δευτερόλεπτα και δοκιμάστε ξανά.",
     loadingFile: "Φόρτωση...",
     chooseFile: "Επιλογή αρχείων ...",
     noFileChosen: "Δεν έχει επιλεγεί αρχείο",
-    // fileDragAreaPlaceholder: "Drop a file here or click the button below to load the file.",
+    fileDragAreaPlaceholder: "Αποθέστε το αρχείο σας εδώ ή κάντε κλικ στο κουμπί παρακάτω για να φορτώσετε το αρχείο.",
     confirmDelete: "Θέλετε να διαγράψετε την εγγραφή;",
     keyDuplicationError: "Αυτή η τιμή πρέπει να είναι μοναδική.",
     addColumn: "Προσθήκη στήλης",
     addRow: "Προσθήκη γραμμής",
     removeRow: "Αφαίρεση",
-    // emptyRowsText: "There are no rows.",
-    addPanel: "Προσθεσε νεο",
-    removePanel: "Αφαιρώ",
+    emptyRowsText: "Δεν υπάρχουν εγγραφές.",
+    addPanel: "Προσθέστε νέο",
+    removePanel: "Αφαίρεση",
     choices_Item: "είδος",
     matrix_column: "Στήλη",
-    matrix_row: "Σειρά",
-    // multipletext_itemname: "text",
+    matrix_row: "Γραμμή",
+    multipletext_itemname: "κείμενο",
     savingData: "Τα αποτελέσματα αποθηκεύονται στον διακομιστή ...",
     savingDataError: "Παρουσιάστηκε σφάλμα και δεν ήταν δυνατή η αποθήκευση των αποτελεσμάτων.",
     savingDataSuccess: "Τα αποτελέσματα αποθηκεύτηκαν με επιτυχία!",
@@ -22275,21 +21394,22 @@ var greekSurveyStrings = {
     timerLimitAll: "Έχετε δαπανήσει {0} από {1} σε αυτήν τη σελίδα και {2} από {3} συνολικά.",
     timerLimitPage: "Έχετε ξοδέψει {0} από {1} σε αυτήν τη σελίδα.",
     timerLimitSurvey: "Έχετε ξοδέψει {0} από {1} συνολικά.",
-    clearCaption: "Σαφή",
-    // signaturePlaceHolder: "Sign here",
-    chooseFileCaption: "Επιλέξτε το αρχείο",
-    removeFileCaption: "Καταργήστε αυτό το αρχείο",
-    booleanCheckedLabel: "Ναί",
-    booleanUncheckedLabel: "Οχι",
-    confirmRemoveFile: "Είστε βέβαιοι ότι θέλετε να καταργήσετε αυτό το αρχείο: {0};",
-    confirmRemoveAllFiles: "Είστε βέβαιοι ότι θέλετε να καταργήσετε όλα τα αρχεία;",
+    clearCaption: "Εκκαθάριση",
+    signaturePlaceHolder: "Υπογράψτε εδώ",
+    chooseFileCaption: "Επιλέξτε αρχείο",
+    removeFileCaption: "Διαγράψτε αυτό το αρχείο",
+    booleanCheckedLabel: "Ναι",
+    booleanUncheckedLabel: "Όχι",
+    confirmRemoveFile: "Είστε βέβαιοι ότι θέλετε να διαγράψετε αυτό το αρχείο: {0};",
+    confirmRemoveAllFiles: "Είστε βέβαιοι ότι θέλετε να διαγράψετε όλα τα αρχεία;",
     questionTitlePatternText: "Τίτλος ερώτησης",
-    // modalCancelButtonText: "Cancel",
-    // modalApplyButtonText: "Apply",
-    // filterStringPlaceholder: "Type to search...",
-    // emptyMessage: "No data to display",
-    // noEntriesText: "There are no entries yet.\nClick the button below to add a new entry.",
-    // more: "More"
+    modalCancelButtonText: "Άκυρο",
+    modalApplyButtonText: "Εφαρμογή",
+    filterStringPlaceholder: "Πληκτρολογήστε για αναζήτηση...",
+    emptyMessage: "Δεν υπάρχουν δεδομένα προς εμφάνιση",
+    noEntriesText: "Δεν υπάρχουν ακόμη εγγραφές.\nΚάντε κλικ στο κουμπί παρακάτω για να προσθέσετε μια νέα εγγραφή.",
+    more: "Περισσότερα",
+    tagboxDoneButtonCaption: "ΟΚ"
 };
 survey_core__WEBPACK_IMPORTED_MODULE_0__["surveyLocalization"].locales["gr"] = greekSurveyStrings;
 survey_core__WEBPACK_IMPORTED_MODULE_0__["surveyLocalization"].localeNames["gr"] = "ελληνικά";
@@ -24011,7 +23131,7 @@ var polishSurveyStrings = {
     timerLimitAll: "Spędziłeś {0} z {1} na tej stronie a w sumie {2} z {3}.",
     timerLimitPage: "Spędziłeś {0} z {1} na tej stronie",
     timerLimitSurvey: "Spędziłeś {0} z {1}.",
-    clearCaption: "Jasne",
+    clearCaption: "Wyczyść",
     signaturePlaceHolder: "Podpisz tutaj",
     chooseFileCaption: "Wybierz plik",
     removeFileCaption: "Usuń ten plik",
@@ -27254,6 +26374,9 @@ var QuestionRowModel = /** @class */ (function (_super) {
             .toString();
     };
     QuestionRowModel.rowCounter = 100;
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: null })
+    ], QuestionRowModel.prototype, "dragTypeOverMe", void 0);
     return QuestionRowModel;
 }(_base__WEBPACK_IMPORTED_MODULE_2__["Base"]));
 
@@ -27937,7 +27060,8 @@ var PanelModelBase = /** @class */ (function (_super) {
         return null;
     };
     /**
-     * Sets focus on the input of the first question in this panel/page.
+     * Focuses the first question in this panel/page.
+     * @see focusFirstErrorQuestion
      */
     PanelModelBase.prototype.focusFirstQuestion = function () {
         var q = this.getFirstQuestionToFocus();
@@ -27946,8 +27070,9 @@ var PanelModelBase = /** @class */ (function (_super) {
         }
     };
     /**
-     * Sets focus on the input of the first question in this panel/page that has an error.
+     * Focuses the first question with a validation error in this panel/page.
      * @see validate
+     * @see focusFirstQuestion
      */
     PanelModelBase.prototype.focusFirstErrorQuestion = function () {
         var q = this.getFirstQuestionToFocus(true);
@@ -30713,7 +29838,7 @@ var PopupModalViewModel = /** @class */ (function (_super) {
             id: "apply",
             visibleIndex: 20,
             title: this.applyButtonText,
-            innerCss: "sv-popup__body-footer-item sv-popup__button sv-popup__button--apply",
+            innerCss: "sv-popup__body-footer-item sv-popup__button sv-popup__button--apply sd-btn sd-btn--action",
             action: function () { _this.apply(); }
         });
     };
@@ -31161,14 +30286,14 @@ var PopupBaseViewModel = /** @class */ (function (_super) {
         this.footerToolbarValue = new _actions_container__WEBPACK_IMPORTED_MODULE_3__["ActionContainer"]();
         this.footerToolbar.updateCallback = function (isResetInitialized) {
             _this.footerToolbarValue.actions.forEach(function (action) { return action.cssClasses = {
-                item: "sv-popup__body-footer-item sv-popup__button"
+                item: "sv-popup__body-footer-item sv-popup__button sd-btn"
             }; });
         };
         var footerActions = [{
                 id: "cancel",
                 visibleIndex: 10,
                 title: this.cancelButtonText,
-                innerCss: "sv-popup__button--cancel",
+                innerCss: "sv-popup__button--cancel sd-btn",
                 action: function () { _this.cancel(); }
             }];
         footerActions = this.model.updateFooterActions(footerActions);
@@ -33079,6 +32204,13 @@ var Question = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(Question.prototype, "allowResizeComment", {
+        get: function () {
+            return this.survey && this.survey.allowResizeComment;
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(Question.prototype, "questionValue", {
         get: function () {
             return this.getPropertyValue("value");
@@ -33312,7 +32444,7 @@ var Question = /** @class */ (function (_super) {
     });
     Object.defineProperty(Question.prototype, "resizeStyle", {
         get: function () {
-            return this.autoGrowComment ? "none" : "both";
+            return this.allowResizeComment ? "both" : "none";
         },
         enumerable: false,
         configurable: true
@@ -35001,7 +34133,6 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         }
     };
     QuestionSelectBase.prototype.setNewValue = function (newValue) {
-        this.resetSelectedItemValues();
         newValue = this.valueFromData(newValue);
         if ((!this.choicesByUrl.isRunning &&
             !this.choicesByUrl.isWaitingForParameters) ||
@@ -35093,9 +34224,6 @@ var QuestionSelectBase = /** @class */ (function (_super) {
             });
         }
     };
-    QuestionSelectBase.prototype.resetSelectedItemValues = function () {
-        this.selectedItemValues = null;
-    };
     QuestionSelectBase.prototype.hasUnknownValue = function (val, includeOther, isFilteredChoices, checkEmptyValue) {
         if (includeOther === void 0) { includeOther = false; }
         if (isFilteredChoices === void 0) { isFilteredChoices = true; }
@@ -37749,7 +36877,6 @@ var QuestionCommentModel = /** @class */ (function (_super) {
          * Specifies the visible height of the comment area, measured in lines.
          *
          * The value of this property is passed on to the `rows` attribute of the underlying `<textarea>` element.
-         * @see cols
          */
         get: function () {
             return this.getPropertyValue("rows");
@@ -37761,12 +36888,6 @@ var QuestionCommentModel = /** @class */ (function (_super) {
         configurable: true
     });
     Object.defineProperty(QuestionCommentModel.prototype, "cols", {
-        /**
-         * Specifies the visible width of the comment area, measured in average character width.
-         *
-         * The value of this property is passed on to the `cols` attribute of the underlying `<textarea>` element.
-         * @see rows
-         */
         get: function () {
             return this.getPropertyValue("cols");
         },
@@ -37796,6 +36917,7 @@ var QuestionCommentModel = /** @class */ (function (_super) {
          * Specifies whether the comment area automatically increases its height to accomodate multi-line content.
          *
          * Default value: `false` (inherited from `SurveyModel`'s [`autoGrowComment`](https://surveyjs.io/form-library/documentation/surveymodel#autoGrowComment) property)
+         * @see allowResize
          */
         get: function () {
             return this.getPropertyValue("autoGrow") || (this.survey && this.survey.autoGrowComment);
@@ -37806,6 +36928,29 @@ var QuestionCommentModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(QuestionCommentModel.prototype, "allowResize", {
+        /**
+         * Specifies whether to display a resize handle for the comment area.
+         *
+         * Default value: `true` (inherited from `SurveyModel`'s [`allowResizeComment`](https://surveyjs.io/form-library/documentation/surveymodel#allowResizeComment) property)
+         * @see autoGrow
+         */
+        get: function () {
+            return this.getPropertyValue("allowResize") && (this.survey && this.survey.allowResizeComment);
+        },
+        set: function (val) {
+            this.setPropertyValue("allowResize", val);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(QuestionCommentModel.prototype, "resizeStyle", {
+        get: function () {
+            return this.allowResize ? "both" : "none";
+        },
+        enumerable: false,
+        configurable: true
+    });
     QuestionCommentModel.prototype.getType = function () {
         return "comment";
     };
@@ -37861,7 +37006,7 @@ var QuestionCommentModel = /** @class */ (function (_super) {
 
 _jsonobject__WEBPACK_IMPORTED_MODULE_0__["Serializer"].addClass("comment", [
     { name: "maxLength:number", default: -1 },
-    { name: "cols:number", default: 50 },
+    { name: "cols:number", default: 50, visible: false, isSerializable: false },
     { name: "rows:number", default: 4 },
     { name: "placeholder",
         alternativeName: "placeHolder",
@@ -37872,6 +37017,7 @@ _jsonobject__WEBPACK_IMPORTED_MODULE_0__["Serializer"].addClass("comment", [
         choices: ["default", "onBlur", "onTyping"],
     },
     { name: "autoGrow:boolean" },
+    { name: "allowResize:boolean", default: true },
     { name: "acceptCarriageReturn:boolean", default: true, visible: false }
 ], function () {
     return new QuestionCommentModel("");
@@ -38179,7 +37325,11 @@ var QuestionCustomModelBase = /** @class */ (function (_super) {
         if (!this.data)
             return;
         var newName = this.convertDataName(name);
-        this.data.setValue(newName, this.convertDataValue(name, newValue), locNotification, allowNotifyValueChanged);
+        var valueForSurvey = this.convertDataValue(name, newValue);
+        if (this.valueToDataCallback) {
+            valueForSurvey = this.valueToDataCallback(valueForSurvey);
+        }
+        this.data.setValue(newName, valueForSurvey, locNotification, allowNotifyValueChanged);
         this.updateIsAnswered();
         this.updateElementCss();
         if (!!this.customQuestion) {
@@ -41006,9 +40156,27 @@ var ImageItemValue = /** @class */ (function (_super) {
     ImageItemValue.prototype.onErrorHandler = function () {
         this.contentNotLoaded = true;
     };
+    Object.defineProperty(ImageItemValue.prototype, "contentNotLoaded", {
+        get: function () {
+            return this.locOwner instanceof QuestionImagePickerModel && this.locOwner.contentMode == "video" ? this.videoNotLoaded : this.imageNotLoaded;
+        },
+        set: function (val) {
+            if (this.locOwner instanceof QuestionImagePickerModel && this.locOwner.contentMode == "video") {
+                this.videoNotLoaded = val;
+            }
+            else {
+                this.imageNotLoaded = val;
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: false })
+    ], ImageItemValue.prototype, "videoNotLoaded", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: false })
-    ], ImageItemValue.prototype, "contentNotLoaded", void 0);
+    ], ImageItemValue.prototype, "imageNotLoaded", void 0);
     return ImageItemValue;
 }(_itemvalue__WEBPACK_IMPORTED_MODULE_3__["ItemValue"]));
 
@@ -50727,9 +49895,13 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
         if (newPanelCount == 0 && this.getPropertyValue("panelCount") > 0) {
             newPanelCount = this.getPropertyValue("panelCount");
         }
+        this.settingPanelCountBasedOnValue = true;
         this.panelCount = newPanelCount;
+        this.settingPanelCountBasedOnValue = false;
     };
     QuestionPanelDynamicModel.prototype.setQuestionValue = function (newValue) {
+        if (this.settingPanelCountBasedOnValue)
+            return;
         _super.prototype.setQuestionValue.call(this, newValue, false);
         this.setPanelCountBasedOnValue();
         for (var i = 0; i < this.panels.length; i++) {
@@ -64011,8 +63183,8 @@ var RendererFactory = /** @class */ (function () {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* WEBPACK VAR INJECTION */(function(global) {/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "settings", function() { return settings; });
-var document = global.document;
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "settings", function() { return settings; });
+var document = globalThis.document;
 var defaultEnvironment = (!!document ? {
     root: document,
     _rootElement: document.body,
@@ -64516,7 +63688,6 @@ var settings = {
     }
 };
 
-/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../node_modules/webpack/buildin/global.js */ "./node_modules/webpack/buildin/global.js")))
 
 /***/ }),
 
@@ -65105,11 +64276,16 @@ var SurveyElementCore = /** @class */ (function (_super) {
     return SurveyElementCore;
 }(_base__WEBPACK_IMPORTED_MODULE_1__["Base"]));
 
+// TODO: rename
 var DragTypeOverMeEnum;
 (function (DragTypeOverMeEnum) {
     DragTypeOverMeEnum[DragTypeOverMeEnum["InsideEmptyPanel"] = 1] = "InsideEmptyPanel";
     DragTypeOverMeEnum[DragTypeOverMeEnum["MultilineRight"] = 2] = "MultilineRight";
     DragTypeOverMeEnum[DragTypeOverMeEnum["MultilineLeft"] = 3] = "MultilineLeft";
+    DragTypeOverMeEnum[DragTypeOverMeEnum["Top"] = 4] = "Top";
+    DragTypeOverMeEnum[DragTypeOverMeEnum["Right"] = 5] = "Right";
+    DragTypeOverMeEnum[DragTypeOverMeEnum["Bottom"] = 6] = "Bottom";
+    DragTypeOverMeEnum[DragTypeOverMeEnum["Left"] = 7] = "Left";
 })(DragTypeOverMeEnum || (DragTypeOverMeEnum = {}));
 /**
  * A base class for all survey elements.
@@ -66383,7 +65559,7 @@ var SurveyModel = /** @class */ (function (_super) {
          */
         _this.onNavigateToUrl = _this.addEvent();
         /**
-         * An event that is raised when the survey [`state`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#state) changes from `"starting"` to `"running"`. This occurs only if your survey includes a [start page](https://surveyjs.io/form-library/documentation/design-survey/create-a-multi-page-survey#start-page).
+         * An event that is raised when the survey [`state`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#state) changes to `"running"`.
          * @see firstPageIsStarted
          */
         _this.onStarted = _this.addEvent();
@@ -66745,13 +65921,17 @@ var SurveyModel = /** @class */ (function (_super) {
          */
         _this.onAfterRenderPanel = _this.addEvent();
         /**
-         * The event occurs when an element within a question gets focus.
+         * An event that is raised when an element (input field, checkbox, radio button) within a question gets focus.
          * @see onFocusInPanel
+         * @see focusFirstQuestionAutomatic
+         * @see focusQuestion
          */
         _this.onFocusInQuestion = _this.addEvent();
         /**
-         * The event occurs when an element within a panel gets focus.
+         * An event that is raised when an element within a panel gets focus.
          * @see onFocusInQuestion
+         * @see focusFirstQuestionAutomatic
+         * @see focusQuestion
          */
         _this.onFocusInPanel = _this.addEvent();
         /**
@@ -67551,7 +66731,12 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "focusFirstQuestionAutomatic", {
         /**
-         * Gets or sets whether the first input is focused on showing a next or a previous page.
+         * Specifies whether to focus the first question on the page on survey startup or when users switch between pages.
+         *
+         * Default value: `true`
+         * @see focusOnFirstError
+         * @see focusFirstQuestion
+         * @see focusQuestion
          */
         get: function () {
             return this.getPropertyValue("focusFirstQuestionAutomatic");
@@ -67564,8 +66749,11 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "focusOnFirstError", {
         /**
-         * Gets or sets whether the first input is focused if the current page has errors.
-         * Set this property to `false` (the default value is `true`) if you do not want to bring the focus to the first question that has error on the page.
+         * Specifies whether to focus the first question with a validation error on the current page.
+         *
+         * Default value: `true`
+         * @see validate
+         * @see focusFirstQuestionAutomatic
          */
         get: function () {
             return this.getPropertyValue("focusOnFirstError");
@@ -67914,11 +67102,12 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "autoGrowComment", {
         /**
-         * Specifies whether to increase the height of text areas to accommodate multi-line comments.
+         * Specifies whether to increase the height of [Long Text](https://surveyjs.io/form-library/examples/add-open-ended-question-to-a-form/) questions and other text areas to accommodate multi-line text content.
          *
          * Default value: `false`
          *
-         * You can override this property for individual Comment questions: [`autoGrow`](https://surveyjs.io/form-library/documentation/api-reference/comment-field-model#autoGrow).
+         * You can override this property for individual Long Text questions: [`autoGrow`](https://surveyjs.io/form-library/documentation/api-reference/comment-field-model#autoGrow).
+         * @see allowResizeComment
          */
         get: function () {
             return this.getPropertyValue("autoGrowComment");
@@ -67929,6 +67118,24 @@ var SurveyModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(SurveyModel.prototype, "allowResizeComment", {
+        /**
+         * Specifies whether to display a resize handle for [Long Text](https://surveyjs.io/form-library/examples/add-open-ended-question-to-a-form/) questions and other text areas intended for multi-line text content.
+         *
+         * Default value: `true`
+         *
+         * You can override this property for individual Long Text questions: [`allowResize`](https://surveyjs.io/form-library/documentation/api-reference/comment-field-model#allowResize).
+         * @see autoGrowComment
+         */
+        get: function () {
+            return this.getPropertyValue("allowResizeComment");
+        },
+        set: function (val) {
+            this.setPropertyValue("allowResizeComment", val);
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(SurveyModel.prototype, "textUpdateMode", {
         /**
          * Gets or sets a value that specifies how the survey updates its questions' text values.
@@ -69665,7 +68872,9 @@ var SurveyModel = /** @class */ (function (_super) {
         configurable: true
     });
     /**
-     * Sets the input focus to the first question with the input field.
+     * Focuses the first question on the current page.
+     * @see focusQuestion
+     * @see focusFirstQuestionAutomatic
      */
     SurveyModel.prototype.focusFirstQuestion = function () {
         if (this.isFocusingQuestion)
@@ -71669,6 +70878,9 @@ var SurveyModel = /** @class */ (function (_super) {
     };
     /**
      * Creates a new page and adds it to the survey.
+     *
+     * If you want to switch a survey to the newly added page, assign its index to the [`currentPageNo`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#currentPageNo) property or assign the entire page to the [`currentPage`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#currentPage) property.
+     *
      * @param name A page name. If you do not specify this parameter, it will be generated automatically.
      * @param index An index at which to insert the page. If you do not specify this parameter, the page will be added to the end.
      * @returns The created and added page.
@@ -73549,9 +72761,11 @@ var SurveyModel = /** @class */ (function (_super) {
         this.isMovingQuestion = false;
     };
     /**
-     * Focus question by its name. If needed change the current page on the page where question is located.
-     * Function returns false if there is no question with this name or question is invisible, otherwise it returns true.
-     * @param name question name
+     * Focuses a question with a specified name. Switches the current page if needed.
+     * @param name A question name.
+     * @returns `false` if the survey does not contain a question with a specified name or this question is hidden; otherwise, `true`.
+     * @see focusFirstQuestion
+     * @see focusFirstQuestionAutomatic
      */
     SurveyModel.prototype.focusQuestion = function (name) {
         var _this = this;
@@ -73944,6 +73158,7 @@ _jsonobject__WEBPACK_IMPORTED_MODULE_1__["Serializer"].addClass("survey", [
         choices: ["onBlur", "onTyping"],
     },
     { name: "autoGrowComment:boolean", default: false },
+    { name: "allowResizeComment:boolean", default: true },
     { name: "startSurveyText", serializationProperty: "locStartSurveyText" },
     { name: "pagePrevText", serializationProperty: "locPagePrevText" },
     { name: "pageNextText", serializationProperty: "locPageNextText" },
@@ -75843,9 +75058,7 @@ var PopupUtils = /** @class */ (function () {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ResponsivityManager", function() { return ResponsivityManager; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VerticalResponsivityManager", function() { return VerticalResponsivityManager; });
-/* harmony import */ var timers__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! timers */ "./node_modules/timers-browserify/main.js");
-/* harmony import */ var timers__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(timers__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ "./src/utils/utils.ts");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./src/utils/utils.ts");
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -75862,7 +75075,6 @@ var __extends = (undefined && undefined.__extends) || (function () {
     };
 })();
 
-
 var ResponsivityManager = /** @class */ (function () {
     function ResponsivityManager(container, model, itemsSelector, dotsItemSize) {
         var _this = this;
@@ -75884,7 +75096,7 @@ var ResponsivityManager = /** @class */ (function () {
             if (isResetInitialized)
                 _this.isInitialized = false;
             else
-                Object(timers__WEBPACK_IMPORTED_MODULE_0__["setTimeout"])(function () { _this.process(); }, 1);
+                setTimeout(function () { _this.process(); }, 1);
         };
         if (typeof ResizeObserver !== "undefined") {
             this.resizeObserver = new ResizeObserver(function (_) { return _this.process(); });
@@ -75934,7 +75146,7 @@ var ResponsivityManager = /** @class */ (function () {
     };
     Object.defineProperty(ResponsivityManager.prototype, "isContainerVisible", {
         get: function () {
-            return Object(_utils__WEBPACK_IMPORTED_MODULE_1__["isContainerVisible"])(this.container);
+            return Object(_utils__WEBPACK_IMPORTED_MODULE_0__["isContainerVisible"])(this.container);
         },
         enumerable: false,
         configurable: true