@inappstory/slide-api 0.0.16 → 0.0.18

package/dist/index.js

@@ -1280,6 +1280,27 @@ class WidgetBase {
         }
         return instance;
     }
+    static initWidget(htmlElement, localData, instantiate) {
+        if (localData != null) {
+            this.createInstance(instantiate, htmlElement, {
+                slide: null,
+                localData,
+            });
+            return Promise.resolve(localData);
+        }
+        else {
+            return new Promise(resolve => {
+                this.getLocalData().then(localData => {
+                    this.createInstance(instantiate, htmlElement, {
+                        slide: null,
+                        localData,
+                    });
+                    resolve(localData);
+                });
+            });
+        }
+    }
+    /** @deprecated */
     static initWidgets(instantiate, elements, localData) {
         if (localData != null) {
             forEach(elements, element => {
@@ -1477,16 +1498,16 @@ class WidgetCopy extends WidgetBase {
             this.resultLayerGeometry = this.resultLayer.closest(".narrative-element-geometry");
             // create align center
             if (this.resultLayerGeometry) {
-                var baseComputedGeometry = window.getComputedStyle(this.geometry);
-                var resultComputedGeometry = window.getComputedStyle(this.resultLayerGeometry);
+                const baseComputedGeometry = window.getComputedStyle(this.geometry);
+                let resultComputedGeometry = window.getComputedStyle(this.resultLayerGeometry);
                 if (parseFloat(resultComputedGeometry.width) < parseFloat(baseComputedGeometry.width)) {
                     // prevent resultLayer shrinking
                     this.resultLayerGeometry.style.setProperty("width", parseFloat(baseComputedGeometry.width) + "px");
                     resultComputedGeometry = window.getComputedStyle(this.resultLayerGeometry);
                 }
-                var geometryCenter = parseFloat(baseComputedGeometry.left) + parseFloat(baseComputedGeometry.width) / 2;
-                var resultLayerGeometryWidth = parseFloat(resultComputedGeometry.width);
-                var newResultLayerGeometryLeft = geometryCenter - resultLayerGeometryWidth / 2;
+                const geometryCenter = parseFloat(baseComputedGeometry.left) + parseFloat(baseComputedGeometry.width) / 2;
+                const resultLayerGeometryWidth = parseFloat(resultComputedGeometry.width);
+                const newResultLayerGeometryLeft = geometryCenter - resultLayerGeometryWidth / 2;
                 this.resultLayerGeometry.style.setProperty("left", newResultLayerGeometryLeft + "px");
             }
         }
@@ -1499,7 +1520,7 @@ class WidgetCopy extends WidgetBase {
     isTransparentElement() {
         if (this.element) {
             try {
-                var color = window.getComputedStyle(this.element).color;
+                const color = window.getComputedStyle(this.element).color;
                 if (color === "transparent" || color === "rgba(0, 0, 0, 0)" || color === "rgba(0,0,0,0)") {
                     return true;
                 }
@@ -1590,7 +1611,7 @@ class WidgetCopy extends WidgetBase {
     }
     _statEventCopyClick(clipboardTarget) {
         try {
-            var buttonText = this.button?.textContent ?? "";
+            const buttonText = this.button?.textContent ?? "";
             this.sendStatisticEventToApp("w-copy", {
                 ...this.statisticEventBaseFieldsShortForm,
                 wi: this.elementId,
@@ -1621,7 +1642,7 @@ class WidgetCopy extends WidgetBase {
     }
     copyToClipboard(element) {
         this._select();
-        var text = this.clipboardTarget ?? "";
+        const text = this.clipboardTarget ?? "";
         Clipboard.copy(text);
         this.completeWidget();
         this._statEventCopyClick(text);
@@ -1638,6 +1659,13 @@ class WidgetCopy extends WidgetBase {
     static api = {
         widgetClassName: WidgetCopy.widgetClassName,
         refreshUserData: WidgetCopy.refreshUserData,
+        init: function (element, localData) {
+            // prevent initWidget for result layer
+            if (!element.classList.contains("narrative-element-copy-result-variant")) {
+                WidgetCopy.initWidget(element, localData, (element, options) => new WidgetCopy(element, options));
+            }
+        },
+        /** @deprecated */
         initWidget: function (nodeList, localData) {
             // prevent initWidget for result layer
             const elements = slice.call(nodeList).filter(element => !element.classList.contains("narrative-element-copy-result-variant"));
@@ -1696,7 +1724,7 @@ class WidgetDataInput extends WidgetBase {
     refreshUserData(localData) {
         this.savedData = this.sdkApi.getCardServerData(this.cardId);
         this.localData = extend({}, this.savedData ?? {}, localData);
-        var text = this.localData["_di_g_" + this.elementId + "_t"];
+        const text = this.localData["_di_g_" + this.elementId + "_t"];
         this._fillUserText(text);
         if (text) {
             this.element.classList.add("done");
@@ -1796,7 +1824,7 @@ class WidgetDataInput extends WidgetBase {
     setUserText(text) {
         this.slide.classList.remove("data-input-editing");
         this.slide.classList.remove("blured");
-        var needResumeUITimer = true;
+        let needResumeUITimer = true;
         if (text) {
             this._fillUserText(text);
             this.localData["_di_g_" + this.elementId + "_t"] = text;
@@ -1825,6 +1853,10 @@ class WidgetDataInput extends WidgetBase {
     static api = {
         widgetClassName: WidgetDataInput.widgetClassName,
         refreshUserData: WidgetDataInput.refreshUserData,
+        init: function (element, localData) {
+            WidgetDataInput.initWidget(element, localData, (element, options) => new WidgetDataInput(element, options));
+        },
+        /** @deprecated */
         initWidget: function (nodeList, localData) {
             WidgetDataInput.initWidgets((element, options) => new WidgetDataInput(element, options), slice.call(nodeList), localData);
         },
@@ -1937,16 +1969,16 @@ class WidgetDateCountdown extends WidgetBase {
         this.thirdGroupCaption = getValueOrException(this.element.querySelector(".date-item-view-group-3 .date-item-caption"), "Empty thirdGroupCaption");
         this.timestampSeconds *= 1000;
         this.timerInited = true;
-        var value = this.timestampSeconds - (new Date().getTime() - this.diff);
+        const value = this.timestampSeconds - (new Date().getTime() - this.diff);
         if (value > 0) {
             this._showLayout(this.layers, 0);
         }
         this.updateTimer();
     }
     updateTimer() {
-        var value = this.timestampSeconds - (new Date().getTime() - this.diff);
+        const value = this.timestampSeconds - (new Date().getTime() - this.diff);
         if (value > 0) {
-            var result = this._asDuration(Math.round(value / 1000));
+            const result = this._asDuration(Math.round(value / 1000));
             if (result.days) {
                 this.firstGroupCaption.textContent = this.messages.days;
                 this.firstGroup1.textContent = result.day1;
@@ -1980,7 +2012,7 @@ class WidgetDateCountdown extends WidgetBase {
         }
     }
     _asDuration(value) {
-        var result = {
+        const result = {
             days: false,
             day1: "0",
             day2: "0",
@@ -1998,11 +2030,11 @@ class WidgetDateCountdown extends WidgetBase {
             return result;
         }
         value = Math.floor(value);
-        var days = Math.floor((value / 86400) % 365);
-        var hours = Math.floor((value / 3600) % 24);
-        var minutes = Math.floor((value / 60) % 60);
-        var seconds = value % 60;
-        var pair;
+        const days = Math.floor((value / 86400) % 365);
+        const hours = Math.floor((value / 3600) % 24);
+        const minutes = Math.floor((value / 60) % 60);
+        const seconds = value % 60;
+        let pair;
         if (days > 0) {
             result.days = true;
             if (days < 10)
@@ -2039,14 +2071,26 @@ class WidgetDateCountdown extends WidgetBase {
     static api = {
         widgetClassName: WidgetDateCountdown.widgetClassName,
         refreshUserData: WidgetDateCountdown.refreshUserData,
+        init: function (element, layers, localData) {
+            WidgetDateCountdown.initWidget(element, localData, (element, options) => new WidgetDateCountdown(element, { ...options, layers }));
+        },
+        /** @deprecated */
         initWidget: function (nodeList, layers, localData) {
             WidgetDateCountdown.initWidgets((element, options) => new WidgetDateCountdown(element, { ...options, layers }), slice.call(nodeList), localData);
         },
+        onPause: function (element) {
+            WidgetDateCountdown.getInstance(element)?.pause();
+        },
+        onResume: function (element) {
+            WidgetDateCountdown.getInstance(element)?.resume();
+        },
+        /** @deprecated */
         pause: function (nodeList) {
             forEach(slice.call(nodeList), function (el, index) {
                 WidgetDateCountdown.getInstance(el)?.pause();
             });
         },
+        /** @deprecated */
         resume: function (nodeList) {
             forEach(slice.call(nodeList), function (el, index) {
                 WidgetDateCountdown.getInstance(el)?.resume();
@@ -2210,6 +2254,7 @@ class WidgetPoll extends WidgetBase {
     selectedVariant;
     nativeDialogueWasOpened = false;
     answerDuration = 0;
+    elementRect;
     /**
      * @throws Error
      * @param element
@@ -2255,8 +2300,8 @@ class WidgetPoll extends WidgetBase {
         this.answerDuration = new Date().getTime() - this.firstOpenTime;
         try {
             if (this.selectedVariant !== undefined) {
-                var labelText = this.label?.textContent ?? "";
-                var variantText = this.variantsTexts[this.selectedVariant] ? this.variantsTexts[this.selectedVariant] : "";
+                const labelText = this.label?.textContent ?? "";
+                const variantText = this.variantsTexts[this.selectedVariant] ? this.variantsTexts[this.selectedVariant] : "";
                 this.sendStatisticEventToApp("w-poll-answer", {
                     ...this.statisticEventBaseFieldsShortForm,
                     wi: this.elementId,
@@ -2348,6 +2393,7 @@ class WidgetPoll extends WidgetBase {
         }
         const index = this.variants.indexOf(variantView);
         if (index !== -1) {
+            this.elementRect = this.element.getBoundingClientRect();
             if (this.getUseResponseOnFirstButton && index === 0) {
                 if (this.sdkApi.isAndroid) {
                     this.slide.classList.add("blured");
@@ -2357,7 +2403,7 @@ class WidgetPoll extends WidgetBase {
                 this.selectedVariant = index;
                 if (this.sdkApi.isExistsShowCardTextInput && dataString) {
                     const data = JSON.parse(dataString);
-                    data.size = getElementBounding(this.env, this.element.getBoundingClientRect());
+                    data.size = getElementBounding(this.env, this.elementRect);
                     if (!this.disableTimer) {
                         this.sdkApi.pauseUI();
                     }
@@ -2391,7 +2437,7 @@ class WidgetPoll extends WidgetBase {
                 this.selectedVariant = index;
                 if (this.sdkApi.isExistsShowCardTextInput && dataString) {
                     const data = JSON.parse(dataString);
-                    data.size = getElementBounding(this.env, this.element.getBoundingClientRect());
+                    data.size = getElementBounding(this.env, this.elementRect);
                     if (!this.disableTimer) {
                         this.sdkApi.pauseUI();
                     }
@@ -2666,6 +2712,10 @@ class WidgetPoll extends WidgetBase {
     static api = {
         widgetClassName: WidgetPoll.widgetClassName,
         refreshUserData: WidgetPoll.refreshUserData,
+        init: function (element, localData) {
+            WidgetPoll.initWidget(element, localData, (element, options) => new WidgetPoll(element, options));
+        },
+        /** @deprecated */
         initWidget: function (element, localData) {
             WidgetPoll.initWidgets((element, options) => new WidgetPoll(element, options), [element], localData);
         },
@@ -2750,9 +2800,9 @@ class WidgetPollLayers extends WidgetBase {
     _statEventPollVariant() {
         try {
             if (this.selectedVariant != null) {
-                var labelText = this.label?.textContent ?? "";
-                var variantText = this.variants[this.selectedVariant]?.textContent ?? "";
-                var duration = new Date().getTime() - this.firstOpenTime;
+                const labelText = this.label?.textContent ?? "";
+                const variantText = this.variants[this.selectedVariant]?.textContent ?? "";
+                const duration = new Date().getTime() - this.firstOpenTime;
                 this.sendStatisticEventToApp("w-poll-layers-answer", {
                     ...this.statisticEventBaseFieldsShortForm,
                     wi: this.elementId,
@@ -2782,7 +2832,7 @@ class WidgetPollLayers extends WidgetBase {
         this.localData["_pl_g_" + this.elementId + "_sa"] = index;
         this.element.classList.add("done");
         // main
-        var layerIndex = 0;
+        let layerIndex = 0;
         if (index === 0) {
             layerIndex = 1;
         }
@@ -2798,7 +2848,7 @@ class WidgetPollLayers extends WidgetBase {
         if (this.selectedVariant !== undefined) {
             return true;
         }
-        var index = this.variants.indexOf(variant);
+        const index = this.variants.indexOf(variant);
         if (index !== -1) {
             this._selectVariant(index, true);
             this.completeWidget();
@@ -2830,10 +2880,16 @@ class WidgetPollLayers extends WidgetBase {
     static api = {
         widgetClassName: WidgetPollLayers.widgetClassName,
         refreshUserData: WidgetPollLayers.refreshUserData,
-        // signature variants
-        // (widget, layers, undefined) - modern web sdk
-        // (widget, undefined, layers) - old web sdk and rn
-        // (widget, layers, localData) - native sdk
+        init: function (element, layers, localData) {
+            WidgetPollLayers.initWidget(element, localData, (element, options) => new WidgetPollLayers(element, { ...options, layers }));
+        },
+        /** @deprecated
+         *
+         *  signature variants
+         *  (widget, layers, undefined) - modern web sdk
+         *  (widget, undefined, layers) - old web sdk and rn
+         *  (widget, layers, localData) - native sdk
+         */
         initWidget: function (element, layers, localData) {
             if (layers === undefined && localData !== undefined) {
                 // @ts-ignore
@@ -2904,7 +2960,7 @@ class WidgetQuest extends WidgetBase {
                 this.localData["_qt_fo_at"] = Math.round(new Date().getTime() / 1000);
                 this.setLocalData(this.localData, false);
             }
-            var lastSlideIdx = this.localData["_qt_last_slide_idx"];
+            let lastSlideIdx = this.localData["_qt_last_slide_idx"];
             if (lastSlideIdx !== undefined) {
                 lastSlideIdx = parseInt(lastSlideIdx);
                 if (lastSlideIdx >= 0 &&
@@ -2922,7 +2978,7 @@ class WidgetQuest extends WidgetBase {
                 }
             }
             // если этого слайда нет в роутинге (сработал переход по таймеру в app)
-            var routes = this._getRoutes();
+            const routes = this._getRoutes();
             if (routes[0].indexOf(this.slideIndex) === -1 && this.finalSlide) {
                 if (this.sdkApi.isExistsShowNextCard) {
                     this.sdkApi.cardShowNext();
@@ -2964,9 +3020,9 @@ class WidgetQuest extends WidgetBase {
         // if (this.selectedAnswer !== undefined) {
         //   return true;
         // }
-        var index = this.variants.indexOf(answer);
+        const index = this.variants.indexOf(answer);
         if (index !== -1) {
-            var slideIndex = getValueOrDefault(getTagDataAsNumber(this.variants[index], "score"), 0) - 1;
+            const slideIndex = getValueOrDefault(getTagDataAsNumber(this.variants[index], "score"), 0) - 1;
             this._selectAnswer(index, slideIndex);
             this.setLocalData(this.localData, true);
             this.env.setTimeout(() => {
@@ -2992,22 +3048,22 @@ class WidgetQuest extends WidgetBase {
         return getTagDataAsNumber(this.slide, "lastSlideWithQuest") ?? 0;
     }
     _getRoutes() {
-        var routes = this.localData["_qt_routes"];
+        let routes = this.localData["_qt_routes"];
         if (!Array.isArray(routes)) {
             routes = [[0], 0];
         }
         return routes;
     }
     _addNewRouteHistory(route) {
-        var routes = this._getRoutes();
-        var _routes = routes[0].slice(0, routes[1] + 1);
+        const routes = this._getRoutes();
+        const _routes = routes[0].slice(0, routes[1] + 1);
         routes[0] = _routes.concat([route]);
         routes[1] = routes[0].length - 1;
         this.localData["_qt_routes"] = routes;
     }
     _routeMvPtrBack() {
-        var routes = this._getRoutes();
-        var newPtr = routes[1] - 1;
+        const routes = this._getRoutes();
+        const newPtr = routes[1] - 1;
         if (newPtr >= 0 && routes[0][newPtr] !== undefined) {
             routes[1] = newPtr;
             this.localData["_qt_routes"] = routes;
@@ -3017,12 +3073,13 @@ class WidgetQuest extends WidgetBase {
         return false;
     }
     getLastSlideIndexFromRouteHistory() {
-        var routes = this._getRoutes();
+        const routes = this._getRoutes();
         return routes[0][routes[1]];
     }
     handleRouteClick(event) {
+        let moveTo;
         // event: direction ('backward', 'forward') slideIndex, slideCount
-        var directionForward = event.direction === "forward";
+        const directionForward = event.direction === "forward";
         event.direction === "backward";
         if (this.isWidget) {
             if (directionForward) {
@@ -3035,7 +3092,7 @@ class WidgetQuest extends WidgetBase {
                 }
                 else {
                     // by routing - move back
-                    var moveTo = this._routeMvPtrBack();
+                    moveTo = this._routeMvPtrBack();
                     if (moveTo !== false && moveTo >= 0 && moveTo < event.slideCount && this.sdkApi.isExistsShowCardSlide) {
                         this.sdkApi.showCardSlide(moveTo);
                     }
@@ -3052,7 +3109,7 @@ class WidgetQuest extends WidgetBase {
             // simple slide case
             if (this.nonFinalSlide || event.slideIndex < this.firstSlideWithQuestIndex()) {
                 if (directionForward) {
-                    var nextSlideIndex = event.slideIndex + 1;
+                    const nextSlideIndex = event.slideIndex + 1;
                     if (nextSlideIndex < this.slideCount) {
                         this._addNewRouteHistory(nextSlideIndex);
                         this.setLocalData(this.localData, true);
@@ -3071,7 +3128,7 @@ class WidgetQuest extends WidgetBase {
                     }
                     else {
                         // by routing - move back
-                        var moveTo = this._routeMvPtrBack();
+                        moveTo = this._routeMvPtrBack();
                         if (moveTo !== false && moveTo >= 0 && moveTo < event.slideCount && this.sdkApi.isExistsShowCardSlide) {
                             this.sdkApi.showCardSlide(moveTo);
                         }
@@ -3099,7 +3156,7 @@ class WidgetQuest extends WidgetBase {
                 }
                 else {
                     // by routing - move back
-                    var moveTo = this._routeMvPtrBack();
+                    moveTo = this._routeMvPtrBack();
                     if (moveTo !== false && moveTo >= 0 && moveTo < event.slideCount && this.sdkApi.isExistsShowCardSlide) {
                         this.sdkApi.showCardSlide(moveTo);
                     }
@@ -3114,6 +3171,19 @@ class WidgetQuest extends WidgetBase {
     static api = {
         widgetClassName: WidgetQuest.widgetClassName,
         refreshUserData: WidgetQuest.refreshUserData,
+        init: function (element, localData) {
+            return new Promise(function (resolve, reject) {
+                WidgetQuest.initWidget(element, localData, (element, options) => new WidgetQuest(element, options)).then(localData => {
+                    const widget = WidgetQuest.getInstance(element);
+                    if (widget) {
+                        resolve(widget.init());
+                    }
+                    else {
+                        resolve(true);
+                    }
+                });
+            });
+        },
         initWidget: function (element, localData) {
             return new Promise(function (resolve, reject) {
                 WidgetQuest.initWidgets((element, options) => new WidgetQuest(element, options), [element], localData).then(localData => {
@@ -3241,10 +3311,10 @@ class WidgetQuiz extends WidgetBase {
         const selectedAnswerIndex = this.answers.indexOf(answer);
         if (selectedAnswerIndex !== -1) {
             this._selectAnswer(selectedAnswerIndex);
-            var isCorrect = this.answers[selectedAnswerIndex].classList.contains("check");
+            const isCorrect = this.answers[selectedAnswerIndex].classList.contains("check");
             this.localData["q_score"] = (this.localData["q_score"] === undefined ? 0 : this.localData["q_score"]) + (isCorrect ? 1 : 0);
-            var answeredQuestion = 0;
-            for (var key in this.localData) {
+            let answeredQuestion = 0;
+            for (const key in this.localData) {
                 if (this.localData.hasOwnProperty(key)) {
                     if (/^_q_g_[A-z0-9-_]+_sa$/.test(key)) {
                         answeredQuestion++;
@@ -3271,7 +3341,7 @@ class WidgetQuiz extends WidgetBase {
                 }, 2000);
             }
             try {
-                var questionText = this.question ? this.question.textContent ?? "" : "";
+                const questionText = this.question ? this.question.textContent ?? "" : "";
                 let answerText = "";
                 if (this.answers[selectedAnswerIndex]) {
                     const answerLabel = this.answers[selectedAnswerIndex].querySelector(".variant-view .label");
@@ -3279,7 +3349,7 @@ class WidgetQuiz extends WidgetBase {
                         answerText = answerLabel.textContent;
                     }
                 }
-                var duration = new Date().getTime() - this.firstOpenTime;
+                const duration = new Date().getTime() - this.firstOpenTime;
                 this.sendStatisticEventToApp("w-quiz-answer", {
                     ...this.statisticEventBaseFieldsShortForm,
                     wi: this.elementId,
@@ -3311,6 +3381,10 @@ class WidgetQuiz extends WidgetBase {
     static api = {
         widgetClassName: WidgetQuiz.widgetClassName,
         refreshUserData: WidgetQuiz.refreshUserData,
+        init: function (element, localData) {
+            WidgetQuiz.initWidget(element, localData, (element, options) => new WidgetQuiz(element, options));
+        },
+        /** @deprecated */
         initWidget: function (element, localData) {
             WidgetQuiz.initWidgets((element, options) => new WidgetQuiz(element, options), [element], localData);
         },
@@ -3504,6 +3578,10 @@ class WidgetQuizGrouped extends WidgetBase {
     static api = {
         widgetClassName: WidgetQuizGrouped.widgetClassName,
         refreshUserData: WidgetQuizGrouped.refreshUserData,
+        init: function (element, localData) {
+            WidgetQuizGrouped.initWidget(element, localData, (element, options) => new WidgetQuizGrouped(element, options));
+        },
+        /** @deprecated */
         initWidget: function (element, localData) {
             WidgetQuizGrouped.initWidgets((element, options) => new WidgetQuizGrouped(element, options), [element], localData);
         },
@@ -3637,7 +3715,7 @@ function tryParseFloat(str, defaultValue) {
     if (str == null) {
         return defaultValue;
     }
-    var value = parseFloat(str);
+    const value = parseFloat(str);
     return Number.isNaN(value) ? defaultValue : value;
 }
 /**
@@ -3952,7 +4030,7 @@ class WidgetRangeSlider extends WidgetBase {
         if ((" " + e.target.className + " ").replace(/[\n\t]/g, " ").indexOf(this.options.handleClass) > -1) {
             return;
         }
-        var pos = this.getRelativePosition(e), rangePos = this.range.getBoundingClientRect()[this.DIRECTION], handlePos = this.getPositionFromNode(this.handle) - rangePos, setPos = this.orientation === "vertical" ? this.maxHandlePos - (pos - this.grabPos) : pos - this.grabPos;
+        const pos = this.getRelativePosition(e), rangePos = this.range.getBoundingClientRect()[this.DIRECTION], handlePos = this.getPositionFromNode(this.handle) - rangePos, setPos = this.orientation === "vertical" ? this.maxHandlePos - (pos - this.grabPos) : pos - this.grabPos;
         this.setPosition(setPos);
         if (pos >= handlePos && pos < handlePos + this.handleDimension) {
             this.grabPos = pos - handlePos;
@@ -4112,6 +4190,10 @@ class WidgetRangeSlider extends WidgetBase {
     static api = {
         widgetClassName: WidgetRangeSlider.widgetClassName,
         refreshUserData: WidgetRangeSlider.refreshUserData,
+        init: function (element, localData) {
+            WidgetRangeSlider.initWidget(element, localData, (element, options) => new WidgetRangeSlider(element, options));
+        },
+        /** @deprecated */
         initWidget: function (element, localData) {
             WidgetRangeSlider.initWidgets((element, options) => new WidgetRangeSlider(element, options), [element], localData);
         },
@@ -4158,6 +4240,7 @@ class WidgetRate extends WidgetBase {
     showDialogueMax;
     selectedStar;
     answerSelectDuration;
+    elementRect;
     constructor(element, options) {
         super(element, options);
         this.label = this.element.querySelector(".label-view .label");
@@ -4258,6 +4341,7 @@ class WidgetRate extends WidgetBase {
             if (value + 1 >= this.showDialogueMin && value + 1 <= this.showDialogueMax) {
                 this.selectedStar = value;
                 if (this.showDialogOnLowRate) {
+                    this.elementRect = this.element.getBoundingClientRect();
                     this._selectStar(this.selectedStar, false);
                     if (this.sdkApi.isAndroid) {
                         this.slide.classList.add("blured");
@@ -4266,7 +4350,7 @@ class WidgetRate extends WidgetBase {
                     const dataString = this.element.dataset["clientdialogwidgetconfig"];
                     if (this.sdkApi.isExistsShowCardTextInput && dataString) {
                         const data = JSON.parse(dataString);
-                        data.size = getElementBounding(this.env, this.element.getBoundingClientRect());
+                        data.size = getElementBounding(this.env, this.elementRect);
                         if (!this.disableTimer) {
                             this.sdkApi.pauseUI();
                         }
@@ -4297,7 +4381,7 @@ class WidgetRate extends WidgetBase {
                 return false;
             }
             else if (value + 1 >= this.submitToStoresMin && value + 1 <= this.submitToStoresMax) {
-                var target = null;
+                let target = null;
                 if (this.sdkApi.isAndroid) {
                     target = getTagData(this.element, "androidLink");
                 }
@@ -4357,6 +4441,10 @@ class WidgetRate extends WidgetBase {
     static api = {
         widgetClassName: WidgetRate.widgetClassName,
         refreshUserData: WidgetRate.refreshUserData,
+        init: function (element, localData) {
+            WidgetRate.initWidget(element, localData, (element, options) => new WidgetRate(element, options));
+        },
+        /** @deprecated */
         initWidget: function (nodeList, localData) {
             WidgetRate.initWidgets((element, options) => new WidgetRate(element, options), slice.call(nodeList), localData);
         },
@@ -4412,6 +4500,9 @@ class WidgetShare extends WidgetBase {
                 this._showLayout(this.layers, 0);
             }
         }
+        if (this.isDone() && this.disableTimer) {
+            this.startDisabledTimeline();
+        }
         this.btnDisabled = false;
         // this.refreshUserData(this.options.localData);
     }
@@ -4470,6 +4561,9 @@ class WidgetShare extends WidgetBase {
         if (isSuccess && this.withLayer) {
             this._showLayout(this.layers, 1, true);
         }
+        if (this.disableTimer) {
+            this.startDisabledTimeline();
+        }
         this.btnDisabled = false;
     }
     isDone() {
@@ -4478,10 +4572,15 @@ class WidgetShare extends WidgetBase {
     static api = {
         widgetClassName: WidgetShare.widgetClassName,
         refreshUserData: WidgetShare.refreshUserData,
-        // signature variants
-        // (widget, layers, undefined) - modern web sdk
-        // (widget, undefined, layers) - old web sdk and rn
-        // (widget, layers, localData) - native sdk
+        init: function (element, layers, localData) {
+            WidgetShare.initWidget(element, localData, (element, options) => new WidgetShare(element, { ...options, layers }));
+        },
+        /** @deprecated
+         * signature variants
+         * (widget, layers, undefined) - modern web sdk
+         * (widget, undefined, layers) - old web sdk and rn
+         * (widget, layers, localData) - native sdk
+         */
         initWidget: function (nodeList, layers, localData) {
             if (layers === undefined && localData !== undefined) {
                 // @ts-ignore
@@ -4556,7 +4655,7 @@ class WidgetTest extends WidgetBase {
                 // if (this.state.timeLeft - this.timeLeft >= 950) {
                 //   this.setState({timeLeft: this.timeLeft});
                 // }
-                var timeNow = new Date().getTime();
+                const timeNow = new Date().getTime();
                 this.timeLeft -= timeNow - this.startTimerAt;
                 this.startTimerAt = timeNow;
                 if (this.timeLeft <= 0) {
@@ -4610,14 +4709,14 @@ class WidgetTest extends WidgetBase {
         try {
             if (this.selectedAnswer != null) {
                 const labelText = this.label?.textContent ?? "";
-                var answerText = "";
+                let answerText = "";
                 if (this.variants[this.selectedAnswer]) {
-                    var answerLabel = this.variants[this.selectedAnswer].querySelector(".label");
+                    const answerLabel = this.variants[this.selectedAnswer].querySelector(".label");
                     if (answerLabel != null) {
                         answerText = answerLabel.textContent ?? "";
                     }
                 }
-                var duration = new Date().getTime() - this.firstOpenTime;
+                const duration = new Date().getTime() - this.firstOpenTime;
                 this.sendStatisticEventToApp("w-test-answer", {
                     ...this.statisticEventBaseFieldsShortForm,
                     wi: this.elementId,
@@ -4661,9 +4760,9 @@ class WidgetTest extends WidgetBase {
         if (this.selectedAnswer !== undefined) {
             return true;
         }
-        var index = this.variants.indexOf(answer);
+        const index = this.variants.indexOf(answer);
         if (index !== -1) {
-            var answerScore = getValueOrDefault(getTagDataAsNumber(this.variants[index], "score"), 0);
+            const answerScore = getValueOrDefault(getTagDataAsNumber(this.variants[index], "score"), 0);
             this._completeWidget(index, answerScore);
         }
         if (Boolean(this.withTimeToAnswer && this.answerTimeout)) {
@@ -4675,15 +4774,15 @@ class WidgetTest extends WidgetBase {
         if (this.selectedAnswer !== undefined) {
             return;
         }
-        var index = -1, answerScore = 0;
+        const index = -1, answerScore = 0;
         this._completeWidget(index, answerScore);
     }
     // complete answer select and save local data + stat event
     _completeWidget(index, answerScore) {
         this._selectAnswer(index);
         this.localData["t_score"] = (this.localData["t_score"] === undefined ? 0 : this.localData["t_score"]) + answerScore;
-        var answeredQuestion = 0;
-        for (var key in this.localData) {
+        let answeredQuestion = 0;
+        for (const key in this.localData) {
             if (this.localData.hasOwnProperty(key)) {
                 if (/^_t_g_[A-z0-9-_]+_sa$/.test(key)) {
                     answeredQuestion++;
@@ -4726,6 +4825,10 @@ class WidgetTest extends WidgetBase {
     static api = {
         widgetClassName: WidgetTest.widgetClassName,
         refreshUserData: WidgetTest.refreshUserData,
+        init: function (element, localData) {
+            WidgetTest.initWidget(element, localData, (element, options) => new WidgetTest(element, options));
+        },
+        /** @deprecated */
         initWidget: function (element, localData) {
             WidgetTest.initWidgets((element, options) => new WidgetTest(element, options), [element], localData);
         },
@@ -4994,7 +5097,7 @@ class WidgetVote extends WidgetBase {
                 return true;
             }
         }
-        var selectedVariantIndex = this.variants.indexOf(variant);
+        const selectedVariantIndex = this.variants.indexOf(variant);
         if (selectedVariantIndex !== -1) {
             this._checkVariant(selectedVariantIndex);
             if (this.multipleChoice) {
@@ -5093,7 +5196,7 @@ class WidgetVote extends WidgetBase {
             }
             voteAllocationTs = sharedData.ts;
         }
-        var voteDoneAt = this.localData["_v_g_" + this.elementId + "_done_at"];
+        const voteDoneAt = this.localData["_v_g_" + this.elementId + "_done_at"];
         if (voteAllocationTs === undefined || voteDoneAt === undefined || voteDoneAt > voteAllocationTs) {
             forEach(this.variants, function (element, index) {
                 const key = index;
@@ -5106,7 +5209,7 @@ class WidgetVote extends WidgetBase {
             });
         }
         // calc percents
-        var percents = [], total = 0;
+        let percents = [], total = 0;
         forEach(this.variants, (element, index) => {
             const key = index;
             if (voteAllocation[key] !== undefined) {
@@ -5129,10 +5232,10 @@ class WidgetVote extends WidgetBase {
                 // percents[i] += '%';
             }
         }
-        var self = this;
+        const self = this;
         forEach(this.variants, (element, index) => {
             const key = index;
-            var percentLabels = slice.call(element.querySelectorAll(".percent-label"));
+            const percentLabels = slice.call(element.querySelectorAll(".percent-label"));
             forEach(percentLabels, label => {
                 if (percents[key] != null) {
                     label.textContent = percents[key] + "%";
@@ -5140,7 +5243,7 @@ class WidgetVote extends WidgetBase {
             });
             element.classList.add("selected");
         });
-        var cb = function () {
+        const cb = function () {
             forEach(self.variants, function (element, index) {
                 const key = index;
                 if (percents[key] != null) {
@@ -5164,18 +5267,24 @@ class WidgetVote extends WidgetBase {
     static api = {
         widgetClassName: WidgetVote.widgetClassName,
         refreshUserData: WidgetVote.refreshUserData,
-        // fix for WidgetVote on every layer of multilayers story
+        init: function (element, localData) {
+            WidgetVote.initWidget(element, localData, (element, options) => new WidgetVote(element, options));
+        },
+        /** @deprecated
+         *
+         * fix for WidgetVote on every layer of multilayers story
+         */
         fallbackInitOnMultiSlide: function (element, localData) {
             if (element.dataset.fallbackInitOnMultiSlide) {
                 return;
             }
-            var multiSlide = element.closest(".narrative-multi-slide");
+            const multiSlide = element.closest(".narrative-multi-slide");
             if (multiSlide != null) {
-                var container = multiSlide.parentElement;
-                var widgetElements = container?.querySelectorAll(`.${WidgetVote.widgetClassName}`);
+                const container = multiSlide.parentElement;
+                const widgetElements = container?.querySelectorAll(`.${WidgetVote.widgetClassName}`);
                 if (widgetElements != null) {
-                    for (var i = 0; i < widgetElements.length; ++i) {
-                        var widgetElement = widgetElements[i];
+                    for (let i = 0; i < widgetElements.length; ++i) {
+                        const widgetElement = widgetElements[i];
                         const widget = WidgetVote.getInstance(widgetElement);
                         if (!widget) {
                             WidgetVote.initWidgets((element, options) => new WidgetVote(element, options), [widgetElement], localData);
@@ -5185,6 +5294,7 @@ class WidgetVote extends WidgetBase {
             }
             element.dataset.fallbackInitOnMultiSlide = "1";
         },
+        /** @deprecated */
         initWidget: function (element, localData) {
             WidgetVote.initWidgets((element, options) => new WidgetVote(element, options), [element], localData).then(localData => {
                 WidgetVote.api.fallbackInitOnMultiSlide(element, localData);
@@ -14625,7 +14735,7 @@ class WidgetBarcode extends WidgetBase {
     isTransparentElement() {
         if (this.element) {
             try {
-                var color = window.getComputedStyle(this.element).color;
+                const color = window.getComputedStyle(this.element).color;
                 if (color === "transparent" || color === "rgba(0, 0, 0, 0)" || color === "rgba(0,0,0,0)") {
                     return true;
                 }
@@ -14732,10 +14842,10 @@ class WidgetBarcode extends WidgetBase {
                     return setTimeout(t, 300);
                 }),
             ]).then(values => {
-                var r = values[0];
-                var status = r.status;
-                var code = null;
-                var success = false;
+                const r = values[0];
+                const status = r.status;
+                let code = null;
+                let success = false;
                 if (status === 200 || status === 201) {
                     if (r.data)
                         code = r.data.code;
@@ -14780,7 +14890,7 @@ class WidgetBarcode extends WidgetBase {
     }
     _statEventCopyClick(clipboardTarget) {
         try {
-            var captionViewText = this.captionView?.textContent ?? "";
+            const captionViewText = this.captionView?.textContent ?? "";
             this.sendStatisticEventToApp("w-barcode", {
                 ...this.statisticEventBaseFieldsShortForm,
                 wi: this.elementId,
@@ -14811,7 +14921,7 @@ class WidgetBarcode extends WidgetBase {
     }
     copyToClipboard(element) {
         this._select();
-        var text = this.clipboardTarget ?? "";
+        const text = this.clipboardTarget ?? "";
         Clipboard.copy(text);
         this.completeWidget();
         this._statEventCopyClick(text);
@@ -14828,6 +14938,10 @@ class WidgetBarcode extends WidgetBase {
     static api = {
         widgetClassName: WidgetBarcode.widgetClassName,
         refreshUserData: WidgetBarcode.refreshUserData,
+        init: function (element, localData) {
+            WidgetBarcode.initWidget(element, localData, (element, options) => new WidgetBarcode(element, options));
+        },
+        /** @deprecated */
         initWidget: function (nodeList, localData) {
             WidgetBarcode.initWidgets((element, options) => new WidgetBarcode(element, options), slice.call(nodeList), localData);
         },